Environment
@launchpad/lp-components version: 10.0.0react version: ^18.0.0node version: ^20
Expected Behavio
There wouldn't be accessibility issues related to form elements when looking at "with no label" variations.
Current Behavior
Accessibility reports one violation: Form elements must have labels
Steps to Reproduce
- Can be seen in the deployed storybook: http://lp-components.herokuapp.com/
- Click on the "with no label" stories under
Input, IconInput, Checkbox, and Switch.
- Click on the Accessibility tab to see the issues
Suggested Solution
Since we now have visually-hidden class css styles, perhaps we can pass in that classname when label is set to false in InputLabel.js, rather than not rendering the label at all. We're currently doing that for fieldset + legend instances (see RadioGroup and CheckboxGroup components)
Environment
@launchpad/lp-componentsversion: 10.0.0reactversion: ^18.0.0nodeversion: ^20Expected Behavio
There wouldn't be accessibility issues related to form elements when looking at "with no label" variations.
Current Behavior
Accessibility reports one violation:
Form elements must have labelsSteps to Reproduce
Input,IconInput,Checkbox, andSwitch.Suggested Solution
Since we now have visually-hidden class css styles, perhaps we can pass in that classname when
labelis set tofalseinInputLabel.js, rather than not rendering the label at all. We're currently doing that forfieldset+legendinstances (seeRadioGroupandCheckboxGroupcomponents)