docs(progress-bar): documentation updates
Description
Improving the accessibility documentation of components.
Related issue(s)
SWC-398
Author's checklist
- [x] I have read the CONTRIBUTING and PULL_REQUESTS documents.
- [ ] I have reviewed at the Accessibility Practices for this feature, see: Aria Practices
- [ ] I have added automated tests to cover my changes.
- [ ] I have included a well-written changeset if my change needs to be published.
- [x] I have included updated documentation if my change required it.
Reviewer's checklist
- [x] Includes a Github Issue with appropriate flag or Jira ticket number without a link
- [ ] Includes thoughtfully written changeset if changes suggested include
patch,minor, ormajorfeatures - [ ] Automated tests cover all use cases and follow best practices for writing
- [ ] Validated on all supported browsers
- [ ] All VRTs are approved before the author can update Golden Hash
Device review
- [x] Did it pass in Desktop?
- [x] Did it pass in (emulated) Mobile?
- [x] Did it pass in (emulated) iPad?
🦋 Changeset detected
Latest commit: 46ec228d7fb7a63f382bcf2c13af06ac252a48c8
The changes in this PR will be included in the next version bump.
This PR includes changesets to release 84 packages
| Name | Type |
|---|---|
| @spectrum-web-components/progress-bar | Patch |
| @spectrum-web-components/bundle | Patch |
| documentation | Patch |
| @spectrum-web-components/eslint-plugin | Patch |
| @spectrum-web-components/accordion | Patch |
| @spectrum-web-components/action-bar | Patch |
| @spectrum-web-components/action-button | Patch |
| @spectrum-web-components/action-group | Patch |
| @spectrum-web-components/action-menu | Patch |
| @spectrum-web-components/alert-banner | Patch |
| @spectrum-web-components/alert-dialog | Patch |
| @spectrum-web-components/asset | Patch |
| @spectrum-web-components/avatar | Patch |
| @spectrum-web-components/badge | Patch |
| @spectrum-web-components/breadcrumbs | Patch |
| @spectrum-web-components/button-group | Patch |
| @spectrum-web-components/button | Patch |
| @spectrum-web-components/card | Patch |
| @spectrum-web-components/checkbox | Patch |
| @spectrum-web-components/clear-button | Patch |
| @spectrum-web-components/close-button | Patch |
| @spectrum-web-components/coachmark | Patch |
| @spectrum-web-components/color-area | Patch |
| @spectrum-web-components/color-field | Patch |
| @spectrum-web-components/color-handle | Patch |
| @spectrum-web-components/color-loupe | Patch |
| @spectrum-web-components/color-slider | Patch |
| @spectrum-web-components/color-wheel | Patch |
| @spectrum-web-components/combobox | Patch |
| @spectrum-web-components/contextual-help | Patch |
| @spectrum-web-components/dialog | Patch |
| @spectrum-web-components/divider | Patch |
| @spectrum-web-components/dropzone | Patch |
| @spectrum-web-components/field-group | Patch |
| @spectrum-web-components/field-label | Patch |
| @spectrum-web-components/help-text | Patch |
| @spectrum-web-components/icon | Patch |
| @spectrum-web-components/icons-ui | Patch |
| @spectrum-web-components/icons-workflow | Patch |
| @spectrum-web-components/icons | Patch |
| @spectrum-web-components/iconset | Patch |
| @spectrum-web-components/illustrated-message | Patch |
| @spectrum-web-components/infield-button | Patch |
| @spectrum-web-components/link | Patch |
| @spectrum-web-components/menu | Patch |
| @spectrum-web-components/meter | Patch |
| @spectrum-web-components/modal | Patch |
| @spectrum-web-components/number-field | Patch |
| @spectrum-web-components/overlay | Patch |
| @spectrum-web-components/picker-button | Patch |
| @spectrum-web-components/picker | Patch |
| @spectrum-web-components/popover | Patch |
| @spectrum-web-components/progress-circle | Patch |
| @spectrum-web-components/radio | Patch |
| @spectrum-web-components/search | Patch |
| @spectrum-web-components/sidenav | Patch |
| @spectrum-web-components/slider | Patch |
| @spectrum-web-components/split-view | Patch |
| @spectrum-web-components/status-light | Patch |
| @spectrum-web-components/swatch | Patch |
| @spectrum-web-components/switch | Patch |
| @spectrum-web-components/table | Patch |
| @spectrum-web-components/tabs | Patch |
| @spectrum-web-components/tags | Patch |
| @spectrum-web-components/textfield | Patch |
| @spectrum-web-components/thumbnail | Patch |
| @spectrum-web-components/toast | Patch |
| @spectrum-web-components/tooltip | Patch |
| @spectrum-web-components/top-nav | Patch |
| @spectrum-web-components/tray | Patch |
| @spectrum-web-components/underlay | Patch |
| @spectrum-web-components/custom-vars-viewer | Patch |
| @spectrum-web-components/story-decorator | Patch |
| @spectrum-web-components/vrt-compare | Patch |
| @spectrum-web-components/base | Patch |
| @spectrum-web-components/grid | Patch |
| @spectrum-web-components/opacity-checkerboard | Patch |
| @spectrum-web-components/reactive-controllers | Patch |
| @spectrum-web-components/shared | Patch |
| @spectrum-web-components/styles | Patch |
| @spectrum-web-components/theme | Patch |
| @spectrum-web-components/truncated | Patch |
| example-project-rollup | Patch |
| example-project-webpack | Patch |
Not sure what this means? Click here to learn what changesets are.
Click here if you're a maintainer who wants to add another changeset to this PR
Tachometer results
Chrome
progress-bar permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 454 kB | 29.44ms - 30.24ms | - | faster ✔ 3% - 6% 0.77ms - 1.93ms |
| branch | 432 kB | 30.77ms - 31.61ms | slower ❌ 3% - 6% 0.77ms - 1.93ms |
- |
Firefox
progress-bar permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 454 kB | 59.85ms - 61.67ms | - | faster ✔ 1% - 8% 0.74ms - 5.34ms |
| branch | 432 kB | 61.68ms - 65.92ms | slower ❌ 1% - 9% 0.74ms - 5.34ms |
- |
We already have a system in place to show deprecation notice like below. In package.json you can add deprecationNotice: " < your notice here> ". I have pushed this commit for you to verify.
![]()
Excellent, thank you! Do we need to address this? https://github.com/adobe/spectrum-web-components/pull/5553/commits/03c57d2722656b23802a56d7e40cad8c0104ccf6#r2161351158
Are all of the CSS changes expected in the diff as well?
We already have a system in place to show deprecation notice like below. In package.json you can add deprecationNotice: " < your notice here> ". I have pushed this commit for you to verify.
Excellent, thank you! Do we need to address this? 03c57d2#r2161351158
Are all of the CSS changes expected in the diff as well?
Mostly all are linting whitespace. Only change is
We already have a system in place to show deprecation notice like below. In package.json you can add deprecationNotice: " < your notice here> ". I have pushed this commit for you to verify.
Excellent, thank you! Do we need to address this? 03c57d2#r2161351158
Are all of the CSS changes expected in the diff as well?
@cdransf Yes we need to add the changes from this commit to maintain parity of UI on the deprecation notice. Let's not create another format here!
We already have a system in place to show deprecation notice like below. In package.json you can add deprecationNotice: " < your notice here> ". I have pushed this commit for you to verify.
Excellent, thank you! Do we need to address this? 03c57d2#r2161351158 Are all of the CSS changes expected in the diff as well?
Mostly all are linting whitespace. Only change is
We already have a system in place to show deprecation notice like below. In package.json you can add deprecationNotice: " < your notice here> ". I have pushed this commit for you to verify.
Excellent, thank you! Do we need to address this? 03c57d2#r2161351158 Are all of the CSS changes expected in the diff as well?
@cdransf Yes we need to add the changes from this commit to maintain parity of UI on the deprecation notice. Let's not create another format here!
Got it! I rebased main back in to resolve the conflicts when you have the time to take another look. ✨
We already have a system in place to show deprecation notice like below. In package.json you can add deprecationNotice: " < your notice here> ". I have pushed this commit for you to verify.
Excellent, thank you! Do we need to address this? 03c57d2#r2161351158 Are all of the CSS changes expected in the diff as well?
Mostly all are linting whitespace. Only change is
We already have a system in place to show deprecation notice like below. In package.json you can add deprecationNotice: " < your notice here> ". I have pushed this commit for you to verify.
Excellent, thank you! Do we need to address this? 03c57d2#r2161351158 Are all of the CSS changes expected in the diff as well?
@cdransf Yes we need to add the changes from this commit to maintain parity of UI on the deprecation notice. Let's not create another format here!
Got it! I rebased main back in to resolve the conflicts when you have the time to take another look. ✨
Can you add back inline-alert.css changes too. I think it is missing.
We already have a system in place to show deprecation notice like below. In package.json you can add deprecationNotice: " < your notice here> ". I have pushed this commit for you to verify.
Excellent, thank you! Do we need to address this? 03c57d2#r2161351158 Are all of the CSS changes expected in the diff as well?
Mostly all are linting whitespace. Only change is
We already have a system in place to show deprecation notice like below. In package.json you can add deprecationNotice: " < your notice here> ". I have pushed this commit for you to verify.
Excellent, thank you! Do we need to address this? 03c57d2#r2161351158 Are all of the CSS changes expected in the diff as well?
@cdransf Yes we need to add the changes from this commit to maintain parity of UI on the deprecation notice. Let's not create another format here!
Got it! I rebased main back in to resolve the conflicts when you have the time to take another look. ✨
Can you add back inline-alert.css changes too. I think it is missing.
Just restored those. ✨
📚 Branch Preview
🔍 Visual Regression Test Results
When a visual regression test fails (or has previously failed while working on this branch), its results can be found in the following URLs:
- Spectrum | Light | Medium | LTR
- Spectrum | Dark | Large | RTL
- Express | Light | Medium | LTR
- Express | Dark | Large | RTL
- Spectrum-two | Light | Medium | LTR
- Spectrum-two | Dark | Large | RTL
- High Contrast Mode | Medium | LTR
Deployed to Azure Blob Storage: pr-5553
If the changes are expected, update the current_golden_images_cache hash in the circleci config to accept the new images. Instructions are included in that file.
If the changes are unexpected, you can investigate the cause of the differences and update the code accordingly.