index
component-controls has a very flexible api that allows creating and installing various plugins. The following are the
official plaugins, please refer to each plugin's own documetation for installation and usage.Components
Table to display the attributes usage, with a % progress indicator
Tables for all the filtered attributes, and the components using them
Table of all the used attributes, with their components
Table to display the components usage, with a % progress indicator
Grid display of component cards
Selection of components from stories, to be displayed in a ComponentList
Table of all the components, with their attributes
component | attributes | #stories | #used in |
|---|---|---|---|
| Button | 1 | 1 | |
| Button | 1 | 0 | |
| ArrowButton | 2 | 0 |
Table to display the components usage, with a % progress indicator
component | #used |
|---|---|
| Button | 1 |
Tables for all the filtered components
component | #used |
|---|---|
| ArrowButton | 1 |
Design
Testing
id | description | |
|---|---|---|
aria-allowed-attr | Ensures ARIA attributes are allowed for an element's role... | |
aria-allowed-role | Ensures role attribute has an appropriate value for the element... | |
aria-required-attr | Ensures elements with ARIA roles have all required ARIA attributes... | |
aria-roles | Ensures all elements with a role attribute use a valid value... | |
aria-valid-attr-value | Ensures all ARIA attributes have valid values... | |
aria-valid-attr | Ensures attributes that begin with aria- are valid ARIA attributes... | |
nested-interactive | Ensure controls are not nested as they are not announced by screen readers... | |
svg-img-alt | Ensures <svg> elements with an img, graphics-document or graphics-symbol role have an accessible text... |