carbon-website
carbon-website copied to clipboard
Text input Usage and Style tabs have content which needs to be addressed
trafficstars
As part of a review of Text Input for accessibility considerations, a number of problems and points of discussion were identified, which are captured in comments in pdf outputs of both the usage and style pages.
These issues include (but are not limited to):
- on other components, the default version is called 'default', here it is called 'text input'; recommend changing to "default"
- text area is treated as a separate component in figma and on the react examples, but is listed as a variant of text input here. It should be consistent (and I recommend making it a variant in the prototyping and react examples, to match the component)
- password should be listed as another variant
- the anatomy section is missing and should be added
- information on masking should be added (including weighing value of using Helper text compared to placeholder
There are also the questions/considerations raised in the CAG slack channel:
- Do you have an implementation where character count is built in? There are none in the React component library, although they are mentioned on Usage and appear in Figma (image below).
- Any working examples of errors? I assume exceeding character count is the typical time when errors are surfaced, although if there are other common text input/area situations resulting in errors, iād like to understand them.
- Do you have any working examples of masking requirements for text inputs? (i.e., date formatting)
See the above linked pdfs for more detailed comments and additional considerations.