Rule Proposal: `require-custom-props`

[alexerisov]

Please describe what the rule should do: This rule enforces the presence or absence of specific props for specific Vue components. It helps ensure consistency and adherence to project-specific conventions or deprecations by warning developers when required props are missing or when deprecated props are used.

What category should the rule belong to? [ ] Enforces code style (layout) [x] Warns about a potential error (problem) [ ] Suggests an alternate way of doing something (suggestion) [ ] Other (please specify:)

<template>
    <!-- ❌ Should warn: Prop `small` is not passed when it`s required -->
    <RedToast />

    <!-- ✅ Correct usage: `small` prop is passed -->
    <RedToast small />

    <!-- ❌ Should warn: `rounded` prop is deprecated, use `border-radius` instead -->
    <BaseButton rounded />

    <!-- ❌ Should warn: colored` prop is deprecated, use `red` instead -->
    <BaseButton colored />

    <!-- ✅ Correct usage: `red` and `border-radius` props used -->
    <BaseButton red border-radius="4" />
</template>

Additional context This rule is highly configurable. Below is an example of how it can be configured in the ESLint settings:

// eslint.config.js
rules: {
  'vue/require-custom-props': ["warn", {
    require: [
      {
        component: 'RedToast',
        prop: 'small',
        message: 'Prop `small` is not passed when it`s required'
      },
      {
        component: 'BlueToast',
        prop: 'small',
        message: 'Prop `small` is not passed when it`s required'
      }
    ],
    "non-require": [
      {
        component: 'BaseButton',
        prop: 'rounded',
        message: '`rounded` prop is deprecated, use `border-radius` instead'
      },
      {
        component: 'BaseButton',
        prop: 'colored',
        message: '`colored` prop is deprecated, use `red` instead'
      }
    ]
  }]
}

This rule enables teams to enforce custom prop usage conventions specific to their design systems or codebase standards. It can also be useful during codebase updates to support a smooth migration from legacy components to newer ones by identifying deprecated props and enforcing usage of required ones in new components.