-
Notifications
You must be signed in to change notification settings - Fork 130
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.
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
Improve Selector usability (keyboard focus, hover and disabled states) #544
Labels
♿ accessibility
Improves usability
🎨 design
Requires input from designers
good first issue
A beginner-friendly task
Comments
larimaza
added
♿ accessibility
Improves usability
good first issue
A beginner-friendly task
labels
Feb 7, 2020
larimaza
changed the title
Make Selector focusable via keyboard
Improve Selector usability (keyboard focus, hover and disabled states)
Feb 7, 2020
connor-baer
added a commit
that referenced
this issue
Mar 31, 2020
This makes the Selector component accessible (it wasn't before). It also brings the API inline with the Checkbox and RadioButton components. Furthermore, it allows for multiple options to be selected. BREAKING CHANGE: The Selector component now accepts the onChange, value, name, and checked props. The onClick and selected props have been removed. ISSUES CLOSED: #544
5 tasks
5 tasks
connor-baer
added a commit
that referenced
this issue
Apr 3, 2020
* feat(components): rewrite the Selector as radio/checkbox This makes the Selector component accessible (it wasn't before). It also brings the API inline with the Checkbox and RadioButton components. Furthermore, it allows for multiple options to be selected. BREAKING CHANGE: The Selector component now accepts the onChange, value, name, and checked props. The onClick and selected props have been removed. ISSUES CLOSED: #544 * feat(components): increase color contrast on Selector ISSUES CLOSED: #544 * feat(components): add SelectorGroup component The SelectorGroup is a convenience component to display multiple, related Selector components in an accessible way. The component API is modelled after the RadioButtonGroup component, so they can be used interchangeably. * fix(components): remove unnecessary attributes from Checkbox and RadioButton labels The value and name attributes are not valid HTML attributes on the label element. * feat(components): rename label prop for RadioButtonGroup options The options that are passed to a RadioButtonGroup should include a children prop instead of a label prop. This brings it in line with the RadioButton and SelectorGroup components. BREAKING CHANGE: The label property of the options prop of the RadioButtonGroup component has been renamed to children. * test(components): update storyshots * refactor(docs): don't persist event unnecessarily
🎉 This issue has been resolved in version 2.0.0-alpha.7 🎉 The release is available on: Your semantic-release bot 📦🚀 |
🎉 This issue has been resolved in version 2.0.0-beta.1 🎉 The release is available on: Your semantic-release bot 📦🚀 |
🎉 This issue has been resolved in version 2.0.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Labels
♿ accessibility
Improves usability
🎨 design
Requires input from designers
good first issue
A beginner-friendly task
Component to amend
Selector
Visual
Context
We have a few issues to address on this:
div
s. We could change them to radio buttons instead.The text was updated successfully, but these errors were encountered: