Open adamjohnson opened 2 months ago
Since switch is a FACE, we can just associate it with a label, and we'll be good to go.
We already do this, just that when the state changes, we check for specially marked children of that label and hide or show then depending on their attributes
Fixing this issue should simplify the implementation of switch as well, because we could simply provide a pair of slots (with complimentary attributes) for the descriptions
This is all dependent on the upstream design
<label for=a>label!</label>
<pf-switch id=a>
<span slot="off">Off!</span>
<span slot="on">On!</span>
</pf-switch>
Description of the issue
<pf-switch />
lacks an accessible static label. The current label uses the state of the switch as the label.Impacted component(s)
<pf-switch />
Steps to reproduce
Basic Demo
<pf-switch />
"Basic" demo.Without Label Demo
Other demos
Similarly, the "Checked with label" and "Disabled" follow these trends and need fixed.
Expected behavior
All
<pf-switch />
elements should include an accessible label for the control.aria-describedby
attribute that targets the controls toggled state options.<label>
isn't used, the switch needs anaccessible-label
property/attribute.Proposed fixes:
Related to https://github.com/RedHat-UX/red-hat-design-system/pull/1513#issuecomment-2062119853.