Uh oh!
There was an error while loading.Please reload this page.
- Notifications
You must be signed in to change notification settings - Fork458
Ensure FocusScope adheres to the Dialog WAI-ARIA design pattern#2307
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 ourterms of service andprivacy statement. We’ll occasionally send you account related emails.
Already on GitHub?Sign in to your account
base:v2
Are you sure you want to change the base?
Conversation
Per the documentation for the popover component, the popover component adheres to the Dialog WAI-ARIA design pattern:https://reka-ui.com/docs/components/popover#accessibilityHowever, when testing, if the popover contains a list of links and then a button, the focus will go to the button, not the link. From my understanding of the design pattern, this isn't correct as links are focusable elements too.I'm not sure why it was originally like this - the PR that added the code doesn't give any details:unovue#281(the pattern can be found here:https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/)
sadeghbarati commentedDec 7, 2025
callumacrae commentedDec 8, 2025 • edited
Loading Uh oh!
There was an error while loading.Please reload this page.
edited
Uh oh!
There was an error while loading.Please reload this page.
Hadn't seen that, thanks! Seems pretty good logic for dialogs where forms are more common, but not sure it works for popovers - we're seeing a lot of inconsistencies throughout our app as we're using them for nested navigation / action dropdowns / export menus / other things where we mix buttons and links but they all look the same Either way, clearly this PR needs to change as it's breaking sensible behaviour for dialogs - would you accept a prop as inradix-ui/primitives#1796 if i made the same change here? |
sadeghbarati commentedDec 8, 2025
Hi, thanks for the PR btw It's up to maintainer |
Per the documentation for the popover component, the popover component adheres to the Dialog WAI-ARIA design pattern:https://reka-ui.com/docs/components/popover#accessibility
However, when testing, if the popover contains a list of links and then a button, the focus will go to the button, not the link. From my understanding of the design pattern, this isn't correct as links are focusable elements too.
I'm not sure why it was originally like this - the PR that added the code doesn't give any details and there's no comments on the function or usages:#281
(the pattern can be found here:https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/)
This is my first contribution to this project - you don't have a CONTRIBUTING.md so let me know if I've done anything wrong! I'm just joined your discord too if that's quicker than communicating here :)