-
Notifications
You must be signed in to change notification settings - Fork 2.7k
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
SpinButton updates from accessibility testing #22489
Conversation
Minor styling and story updates based on accessibility testing.
Adds default, English, labels to the increment and decrement buttons of SpinButton. This provides a default description for assistive tech users. This commit implements a new prop, `strings` per RFC microsoft#19258. Default values are provided for English and the strings support a token, `{step}` that will be replaced with the value of the `step` prop. The `{step}` token may be omitted. All string keys are required but invididual labels may be overridden by passing the `aria-label` prop to a slot.
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit 725a5bf:
|
📊 Bundle size report
🤖 This report was generated against 399a179957a37480093eaaf5b0ddfb37a97ad7a8 |
Asset size changesSize Auditor did not detect a change in bundle size for any component! Baseline commit: 399a179957a37480093eaaf5b0ddfb37a97ad7a8 (build) |
packages/react-spinbutton/src/components/SpinButton/useSpinButton.tsx
Outdated
Show resolved
Hide resolved
packages/react-spinbutton/src/components/SpinButton/useSpinButton.tsx
Outdated
Show resolved
Hide resolved
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
* react-spinbutton: a11y updates Minor styling and story updates based on accessibility testing. * react-spinbutton: add labels to spinner buttons Adds default, English, labels to the increment and decrement buttons of SpinButton. This provides a default description for assistive tech users. This commit implements a new prop, `strings` per RFC microsoft#19258. Default values are provided for English and the strings support a token, `{step}` that will be replaced with the value of the `step` prop. The `{step}` token may be omitted. All string keys are required but invididual labels may be overridden by passing the `aria-label` prop to a slot. * react-spinbutton: update API snapshot * react-spinbutton: remove commented out TODOs
Current Behavior
New Behavior
strings
prop has been added to SpinButton allowing labels be applied to the increment and decrement buttons. These strings support a token,{step}
, that will be replaced with the value of thestep
prop when present in the string. This allows the labels to be localized as needed. By default the English localization is included.Related Issue(s)
#22307