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.

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

feat(react-swatch-picker): Correctly integrating SwatchPicker with Field component #33274

Open
wants to merge 2 commits into
base: master
Choose a base branch
from

Conversation

khmakoto
Copy link
Member

Previous Behavior

SwatchPicker had no integration with the Field component. So when they were used together, all the expectations of correctly labeling things for accessibility were not being meant.

New Behavior

We have integrated the Field's context with SwatchPicker so that when they are used together, SwatchPicker will be correctly labelled for accessibility.

Related Issue(s)

Copy link

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-components
react-components: entire library
1.162 MB
291.159 kB
1.162 MB
291.165 kB
8 B
6 B
react-swatch-picker
@fluentui/react-swatch-picker - package
104.258 kB
30.231 kB
105.086 kB
30.516 kB
828 B
285 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-components
react-components: Button, FluentProvider & webLightTheme
69.21 kB
20.174 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
220.638 kB
63.918 kB
react-components
react-components: FluentProvider & webLightTheme
44.447 kB
14.59 kB
react-portal-compat
PortalCompatProvider
8.39 kB
2.64 kB
react-timepicker-compat
TimePicker
107.398 kB
35.772 kB
🤖 This report was generated against 072ad5a3be7e47d6ccc19ac5addb0f633f403094

Copy link

Pull request demo site: URL

@@ -0,0 +1,7 @@
{
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🕵🏾‍♀️ visual regressions to review in the fluentuiv9 Visual Regression Report

Avatar Converged 3 screenshots
Image Name Diff(in Pixels) Image Type
Avatar Converged.Badge Mask RTL.chromium.png 44 Changed
Avatar Converged.size+image+badge.chromium.png 1 Changed
Avatar Converged.badgeMask.chromium.png 1 Changed
Drawer 2 screenshots
Image Name Diff(in Pixels) Image Type
Drawer.Full Overlay High Contrast.chromium.png 4933 Changed
Drawer.Full Overlay Dark Mode.chromium.png 2549 Changed

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Bug]: When wrapping SwatchPicker with Field component, it didn't add 'aria-labelledby' to SwatchPicker
2 participants