Skip to content

feat: a11y Keyboard Navigation for Modals#624

Merged
Ogstevyn merged 3 commits into
Ogstevyn:mainfrom
Salmatcre8:issue-525-a11y-modals
Apr 27, 2026
Merged

feat: a11y Keyboard Navigation for Modals#624
Ogstevyn merged 3 commits into
Ogstevyn:mainfrom
Salmatcre8:issue-525-a11y-modals

Conversation

@Salmatcre8
Copy link
Copy Markdown
Contributor

@Salmatcre8 Salmatcre8 commented Apr 26, 2026

Closes #525

Description

This PR implements robust keyboard accessibility for modals by introducing a global useFocusTrap hook, ensuring users who navigate with keyboards cannot accidentally tab outside the modal context.

Changes Included

  • New useFocusTrap Hook: Intercepts Tab and Shift+Tab keystrokes to cycle focus purely between the first and last interactive elements within a modal container.
  • Auto-Focus & Restore: Automatically focuses the first interactive element when a modal opens, and importantly, restores focus to the original triggering element (e.g., the button that opened it) when the modal closes.
  • Escape Key Integration: Added native support for closing the modal via the Escape key directly within the focus trap hook, removing the need for duplicate logic across different components.
  • Aria Roles: Added role="dialog" and aria-modal="true" to ConfirmDialog and TransactionConfirmModal for improved screen-reader announcement.

(Note: TransactionDetailModal.tsx was excluded as it did not exist in the codebase).

@vercel
Copy link
Copy Markdown

vercel Bot commented Apr 26, 2026

@Salmatcre8 is attempting to deploy a commit to the Stephen's projects Team on Vercel.

A member of the Team first needs to authorize it.

@drips-wave
Copy link
Copy Markdown

drips-wave Bot commented Apr 26, 2026

@Salmatcre8 Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

@Salmatcre8 Salmatcre8 force-pushed the issue-525-a11y-modals branch from cd8fac9 to 0a14c6a Compare April 27, 2026 20:23
@Ogstevyn Ogstevyn merged commit 2b41745 into Ogstevyn:main Apr 27, 2026
4 of 6 checks passed
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.

[Issue #106] a11y: Keyboard Navigation for Modals

2 participants