Skip to content

chore(react-tags-preview): update stories and best practices for adding aria-label on dismissible tag#29026

Merged
YuanboXue-Amber merged 6 commits into
microsoft:masterfrom
YuanboXue-Amber:tag-pr1
Sep 4, 2023
Merged

chore(react-tags-preview): update stories and best practices for adding aria-label on dismissible tag#29026
YuanboXue-Amber merged 6 commits into
microsoft:masterfrom
YuanboXue-Amber:tag-pr1

Conversation

@YuanboXue-Amber

@YuanboXue-Amber YuanboXue-Amber commented Aug 30, 2023

Copy link
Copy Markdown
Contributor

This PR update stories of dismissible InteractionTag with proper aria-label/aria-labelledby and add it in best practice guide.

It gives aria-label on the dismiss button, and use aria-labelledby to make it announce the content of the primary button as well, providing more context for screenreader users:
Screenshot 2023-08-31 at 14 19 20

@codesandbox-ci

codesandbox-ci Bot commented Aug 30, 2023

Copy link
Copy Markdown

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 db9e99d:

Sandbox Source
@fluentui/react 8 starter Configuration
@fluentui/react-components 9 starter Configuration

@fabricteam

fabricteam commented Aug 30, 2023

Copy link
Copy Markdown
Collaborator

📊 Bundle size report

Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-tags-preview
InteractionTag
13.85 kB
5.626 kB
react-tags-preview
Tag
29.604 kB
9.567 kB
react-tags-preview
TagGroup
72.493 kB
21.628 kB
🤖 This report was generated against 405ee3cf4d5bcaae806448be6c497927d4f1730b

@size-auditor

size-auditor Bot commented Aug 30, 2023

Copy link
Copy Markdown

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: 405ee3cf4d5bcaae806448be6c497927d4f1730b (build)

@fabricteam

fabricteam commented Aug 30, 2023

Copy link
Copy Markdown
Collaborator

🕵 fluentuiv9 No visual regressions between this PR and main

@YuanboXue-Amber
YuanboXue-Amber marked this pull request as ready for review August 31, 2023 12:25
@YuanboXue-Amber
YuanboXue-Amber requested review from a team as code owners August 31, 2023 12:25
@YuanboXue-Amber YuanboXue-Amber changed the title Draft chore(react-tags-preview): update stories and best practices for adding aria-label on dismissible tag chore(react-tags-preview): update stories and best practices for adding aria-label on dismissible tag Aug 31, 2023
@YuanboXue-Amber
YuanboXue-Amber merged commit 3967e12 into microsoft:master Sep 4, 2023
@YuanboXue-Amber
YuanboXue-Amber deleted the tag-pr1 branch September 4, 2023 10:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants