fix(dialog): implement dialog button groups
Description
Currently on the static docs site, the dialogs don't really follow the guidelines and documentation according to the internal/beta site:
When not dismissible, the dialog needs to have one or more buttons in the footer for users to perform an action (including closing the dialog) and the background overlay cannot be clicked.
This PR implements the missing button groups on non-dismissible dialogs on the docs page. It also adds/removes classes in dialog.yml to implement the button groups.
Jira
How and where has this been tested?
Please tag yourself on the tests you've marked complete to confirm the tests have been run by someone other than the author.
Validation steps
- [ ] Pull down the branch
- [ ] Run
yarn run devand visit the dialog docs page - [ ] Verify all dialog variants are closed on page load
- [ ] Test all closed dialogs on the page:
- opening the dialog should add the
is-openclass tospectrum-Modalandspectrum-Modal-wrapper - once the dialog is open, any buttons (like the close button or a button group) should be clickable/focusable
- ensure the small, medium and large dialogs now have a
ButtonGroup - closing the dialog with one of the new buttons should remove
is-openfrom those same modal elements
- opening the dialog should add the
Regression testing
Validate:
- The documentation pages for at least two other components are still loading, including:
- [ ] The pages render correctly, are accessible, and are responsive.
- If components have been modified, VRTs have been run on this branch:
- [ ] VRTs have been run and looked at.
- [ ] Any VRT changes have been accepted (by reviewer and/or PR author), or there are no changes.
Screenshots
To-do list
- [x] I have read the contribution guidelines.
- [ ] I have updated relevant storybook stories and templates.
- [ ] I have tested these changes in Windows High Contrast mode.
- [ ] If my change impacts other components, I have tested to make sure they don't break.
- [ ] If my change impacts documentation, I have updated the documentation accordingly.
- [ ] ✨ This pull request is ready to merge. ✨
⚠️ No Changeset found
Latest commit: 40feada7e725bce67855cf969170f8c3e1d1fea0
Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.
This PR includes no changesets
When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types
Click here to learn what changesets are, and how to add one.
Click here if you're a maintainer who wants to add a changeset to this PR
File metrics
Summary
Total size: 4.66 MB*
🎉 No changes detected in any packages
* Size determined by adding together the size of the main file for all packages in the library.* Results are not gzipped or minified.
* An ASCII character in UTF-8 is 8 bits or 1 byte.
🚀 Deployed on https://pr-2861--spectrum-css.netlify.app
I think we need to adjust the dependencies. It should load if buttongroup is added to
devDependencies.
Good catch- totally overlooked that. It's added to devDependencies now: https://github.com/adobe/spectrum-css/pull/2861/commits/ba0831bb0f650d8ad5549684ca4a6207893fd81e