@aligent/eslint-plugin-no-disabled-buttons

eslint-plugin-no-disabled-buttons

ESlint rule to enforce that buttons are never set to disabled, except when there is no better solution. Disabled buttons can lead to poor UX experience and negatively affects accessibility.

Articles about why using disabled buttons is usually bad practice:

• CSS Tricks - Making disabled buttons more inclusive
• Smashing Magazine - Frustrating Design Patterns: Disabled Buttons

Installation

You'll first need to install ESLint:

npm i eslint --save-dev
# or
yarn add --dev eslint

Next, install eslint-plugin-no-disabled-buttons:

npm install eslint-plugin-no-disabled-buttons --save-dev
# or
yarn add --dev @aligent/eslint-plugin-no-shared-talons

Usage

Add no-disabled-buttons to the plugins section of your .eslintrc configuration file. You can omit the eslint-plugin- prefix:

{
    "plugins": [
        "no-disabled-buttons"
    ]
}

Then configure the rules you want to use under the rules section.

{
    "rules": {
        "no-disabled-buttons/rule-name": 2
    }
}