Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Update Checkbox live demo #11268

Closed
4 tasks done
Tracked by #10889
tay1orjones opened this issue Apr 21, 2022 · 0 comments · Fixed by carbon-design-system/carbon-website#2929
Closed
4 tasks done
Tracked by #10889

Update Checkbox live demo #11268

tay1orjones opened this issue Apr 21, 2022 · 0 comments · Fixed by carbon-design-system/carbon-website#2929
Assignees
@aledavila
Milestone
2022 Q2

Comments

@tay1orjones
Copy link
Member

tay1orjones commented Apr 21, 2022 •
edited by aledavila
Loading

The Checkbox component live demo on the website needs the following updates:

  • Update to v11 component
  • Label is not turning to disabled colors when "Disabled" is selected.
  • Add a "checked" state modifier.
  • Ensure component renders properly for each theme
@tay1orjones tay1orjones mentioned this issue Apr 21, 2022
Closed
81 tasks
@tay1orjones tay1orjones moved this to ⏱ Backlog in Design System Apr 25, 2022
@tay1orjones tay1orjones added this to the 2022 Q2 milestone Apr 25, 2022
@tay1orjones tay1orjones assigned aledavila and unassigned abbeyhrt Apr 25, 2022
@aledavila aledavila mentioned this issue May 9, 2022
Merged
@laurenmrice laurenmrice mentioned this issue May 12, 2022
Closed
2 tasks
@aledavila aledavila moved this from ⏱ Backlog to ✅ Done in Design System May 12, 2022
kennylam pushed a commit to kennylam/carbon that referenced this issue Jul 30, 2024
@m4olivei
[combo-box / dropdown] Improve accessibility (carbon-design-system#11421
24b6f2e 
)

### Related Ticket(s)

Closes carbon-design-system#11268
[Jira ticket](https://jsw.ibm.com/browse/ADCMS-4401)

### Description

Fixes accessibility issues with Combo-box, and by extension Dropdown.

Used both React package (which uses [Downshift](https://www.downshift-js.com/)), and [ARIA APG](https://www.w3.org/WAI/ARIA/apg/patterns/combobox/) as references. Tested with VoiceOver on Mac OS.

### Testing

* Use both dropdown and combo-box components. Ensure there are no regressions for sighted users
* Using a screenreader, test both dropdown and combo-box components. Should work well. See [Select-Only Combobox Example](https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-select-only/) and [Editable Combobox With List Autocomplete Example](https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-autocomplete-list/) are great reference examples.
* Regression test the Multi select component (it extends the Dropdown component)

### Changelog

**Changed**

- Improved dropdown and combo-box accessibility.

<!-- React and Web Component deploy previews are enabled by default. -->
<!-- To enable additional available deploy previews, apply the following -->
<!-- labels for the corresponding package: -->
<!-- *** "test: e2e": Codesandbox examples and e2e integration tests -->
<!-- *** "package: services": Services -->
<!-- *** "package: utilities": Utilities -->
<!-- *** "RTL": React / Web Components (RTL) -->
<!-- *** "feature flag": React / Web Components (experimental) -->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@aledavila aledavila

Labels
None yet
Projects
Design System
Archived in project
Milestone
2022 Q2
Development

Successfully merging a pull request may close this issue.

fix(checkbox): update checkbox colors and props aledavila/carbon-website
3 participants
@tay1orjones @aledavila @abbeyhrt