Skip to content

fix(ProgressBar): add aria-valuetext attribute #5100

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

Merged
merged 6 commits into from
Oct 16, 2024
Merged

fix(ProgressBar): add aria-valuetext attribute #5100

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
10b353d
fix(ProgressBar): add aria-valuetext attribute
francinelucca Oct 9, 2024
984db3c
Create slimy-sloths-whisper.md
francinelucca Oct 9, 2024
2af81d3
test(ProgressBar): update snapshot
francinelucca Oct 10, 2024
e6ce826
Merge branch 'main' into 3458-prcprogressbar-best-practice-add-a-huma…
francinelucca Oct 10, 2024
23a7d0a
Update changeset to minor
francinelucca Oct 16, 2024
f2cfda7
Merge branch 'main' into 3458-prcprogressbar-best-practice-add-a-huma…
francinelucca Oct 16, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/slimy-sloths-whisper.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@primer/react": patch
---

fix(ProgressBar): add aria-valuetext attribute
1 change: 1 addition & 0 deletions packages/react/src/ProgressBar/ProgressBar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -85,6 +85,7 @@ export const ProgressBar = forwardRef<HTMLSpanElement, ProgressBarProps>(
'aria-valuenow': progressAsNumber ? Math.round(progressAsNumber) : undefined,
'aria-valuemin': 0,
'aria-valuemax': 100,
'aria-valuetext': progressAsNumber ? `${Math.round(progressAsNumber)}%` : undefined,
}

return (
Expand Down
1 change: 1 addition & 0 deletions packages/react/src/__tests__/__snapshots__/ProgressBar.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@ exports[`ProgressBar respects the "progress" prop 1`] = `
aria-valuemax={100}
aria-valuemin={0}
aria-valuenow={80}
aria-valuetext="80%"
className="c0"
role="progressbar"
>
Expand Down
Loading