Description
Hi all 👋
First off thank you so much for this plugin, it has helped me many times, and saved me countless hours of debugging
I would like to put forward an idea to extend the following two rules
- react/forbid-component-props
- react/forbid-dom-props
The former accepts an allowedFor option, and I would like to introduce its counterpart dissalowedFor.
It would be particularly interesting for the react/forbid-dom-props rule as the Web platform constantly evolves, and even though it is rare, they sometimes deprecate old attributes.
To give you an example, the <form> tag used to receive an accept argument, however it is now deprecated and that attribute should be set on an <input type="file">.
There are no ways at the moment in eslint-plugin-react to express that. I would be happy to implement that directly but wanted to create this issue first to gather feedback from the community and settled on the proper syntax, naming and behavioura
Syntax
{
"propName": "accept"
"disallowedFor": [form],
"message": "Avoid using the accept attribute on <form>"
}
To ensure backwards compatibility I believe the allowedFor option should take precendance over the disallowedFor option in the case of the following example, only allowedFor would be applied and a warning would be added to the terminal to notify the developer that they have conflicting rules configuration
Edit: as @ljharb pointed out, the following schema would not be valid as the two options would be mutually exclusive
{
"propName": "accept"
"disallowedFor": [form],
"allowedFor": [input]
"message": "Avoid using the accept attribute on <form>"
}