Skip to content
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.

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

Drawer: allow a custom element to be focused on close #1669

Merged
merged 15 commits into from
May 10, 2024

Conversation

ChrisLaneAU
Copy link
Contributor

@ChrisLaneAU ChrisLaneAU commented May 2, 2024

This PR adds the ability for the Drawer to return focus to a custom element while maintaining the fallback of the existing trigger element. It also establishes a focusAll prop (naming was derived from the similarly behaving focus prop) on the Box component that is used by the two alert components.

The combination of these changes allows consumers to return focus to an alert, for example when a file upload in a drawer throws an error and we render the error style alert.

image

View preview

Checklist

Preflight

  • Prefix the PR title with the slug of the package or component - e.g. accordion: Updated padding or docs: Updated header links
  • Describe the changes clearly in the PR description
  • Read and check your code before tagging someone for review
  • Create a changeset file by running yarn changeset. Learn more about change management.

Testing

  • Manually test component in various modern browsers at various sizes (use Browserstack)
  • Manually test component in various devices (phone, tablet, desktop)
  • Manually test component using a keyboard
  • Manually test component using a screen reader
  • Manually tested in dark mode
  • Component meets Web Content Accessibility Guidelines (WCAG) 2.1 standards
  • Add any necessary unit tests (HTML validation, snapshots etc)
  • Run yarn test to ensure tests are passing. If required, run yarn test -u to update any generated snapshots.

Documentation

  • Create or update documentation on the website
  • Create or update stories for Storybook
  • Create or update stories for Playroom snippets

@ChrisLaneAU ChrisLaneAU self-assigned this May 2, 2024
Copy link

changeset-bot bot commented May 2, 2024

🦋 Changeset detected

Latest commit: d65f498

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@ag.ds-next/react Minor

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

Copy link
Contributor

github-actions bot commented May 2, 2024

PR Preview Action v1.4.7
Preview removed because the pull request was closed.
2024-05-10 04:08 UTC

@ChrisLaneAU ChrisLaneAU requested a review from stowball May 3, 2024 03:03
@ChrisLaneAU ChrisLaneAU marked this pull request as ready for review May 3, 2024 07:11
@ChrisLaneAU ChrisLaneAU requested a review from stowball May 8, 2024 23:14
@ChrisLaneAU ChrisLaneAU requested a review from stowball May 9, 2024 02:09
@ChrisLaneAU ChrisLaneAU force-pushed the drawer-custom-element-focus-on-close branch from 24f8f20 to 6994c07 Compare May 9, 2024 02:21
@ChrisLaneAU ChrisLaneAU requested a review from stowball May 9, 2024 06:46
Copy link

Quality Gate Passed Quality Gate passed

Issues
2 New issues
0 Accepted issues

Measures
0 Security Hotspots
No data about Coverage
0.0% Duplication on New Code

See analysis details on SonarCloud

@ChrisLaneAU ChrisLaneAU merged commit 358c561 into main May 10, 2024
7 checks passed
@ChrisLaneAU ChrisLaneAU deleted the drawer-custom-element-focus-on-close branch May 10, 2024 04:04
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.

2 participants