Skip to content

Modal: Implement focus trap#1067

Open
wazeerc wants to merge 1 commit intothemesberg:mainfrom
wazeerc:a11y/modal
Open

Modal: Implement focus trap#1067
wazeerc wants to merge 1 commit intothemesberg:mainfrom
wazeerc:a11y/modal

Conversation

@wazeerc
Copy link
Copy Markdown

@wazeerc wazeerc commented May 3, 2025

This PR proposes a solution to trap focus within a modal. This improves keyboard navigation and overall accessibility.

According to Focus Order (Level A) from WCAG 2.2 - A web page implements modal dialogs via scripting. When the trigger button is activated, a dialog opens and focus is set within the dialog. As long as the dialog is open, focus is limited to the elements of the dialog. When the dialog is dismissed, focus returns to the button or the element following the button.

I previously submitted a similar PR to Flowbite Vue.

@zecka
Copy link
Copy Markdown

zecka commented May 5, 2025

Why not use a <dialog> html tag ?

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