Skip to content

Commit 02103f4

Browse files
feat(progress)!: port to pf-v6-progress element (#3152)
* feat(progress): port pf-v5-progress to pf-v6-progress Update progress bar element for PatternFly v6 with inline SVG status icons, InternalsController, `helper-text` `@slot`, `value-text` and `static-width` properties, `singleline` measure location, and v6 design tokens with CSS grid layout. Closes #3031 Assisted-By: Claude Opus 4.6 <noreply@anthropic.com> * fix(progress): address review findings from a11y, API, and demo audits Move progressbar role and all ARIA to host via InternalsController, fix aria-valuemax to always be 100, remove unnecessary value reflection, guard fade-in animation with prefers-reduced-motion, rename failure demos to danger, and inline demo wrapper styles. Assisted-By: Claude Opus 4.6 <noreply@anthropic.com> * feat(progress): port pf-v5-progress to pf-v6-progress * fix(progress): singleline should be derived not an attribute * fix(progress): correct missing hide-status-icon and correct info around toolip * fix(progress): handle describedby like labelledby * fix(progress): use @observes instead of willUpdate * chore(progress): add changeset * docs: readme, manifest * fix: aria-describedby --------- Co-authored-by: Benny Powers <web@bennypowers.com>
1 parent cec0ca3 commit 02103f4

37 files changed

Lines changed: 1207 additions & 670 deletions

.changeset/calm-friends-carry.md

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
---
2+
"@patternfly/elements": major
3+
---
4+
5+
`<pf-v6-progress>`: replaces `<pf-v5-progress>` with PatternFly v6 design specs.
6+
7+
```html
8+
<pf-v6-progress value="33" description="Loading..."></pf-v6-progress>
9+
```
10+
11+
**Breaking Changes from v5**
12+
13+
- Renamed tag from `<pf-v5-progress>` to `<pf-v6-progress>`
14+
- CSS custom properties renamed from `--pf-v5-c-progress--*` to `--pf-v6-c-progress--*`
15+
16+
**New features**
17+
18+
- `accessible-label` attribute for screen reader text via ElementInternals
19+
- `value-text` attribute for custom `aria-valuetext` (finite step displays)
20+
- `truncated` attribute for ellipsis overflow on description
21+
- `hide-status-icon` attribute for tight layouts
22+
- `helper-text` slot for supplementary text below the bar, auto-wired to `aria-describedby`
23+
- v6 design tokens and `light-dark()` support

elements/pf-v5-progress/README.md

Lines changed: 0 additions & 33 deletions
This file was deleted.

elements/pf-v5-progress/demo/index.html

Lines changed: 0 additions & 5 deletions
This file was deleted.

elements/pf-v5-progress/demo/kitchen-sink.css

Lines changed: 0 additions & 4 deletions
This file was deleted.

elements/pf-v5-progress/demo/kitchen-sink.html

Lines changed: 0 additions & 141 deletions
This file was deleted.

elements/pf-v5-progress/demo/truncated-description.html

Lines changed: 0 additions & 20 deletions
This file was deleted.

elements/pf-v5-progress/docs/pf-v5-progress.md

Lines changed: 0 additions & 49 deletions
This file was deleted.

0 commit comments

Comments
 (0)