Skip to content

Improve dropdown menu accessibility state and focus#226

Open
web3blind wants to merge 1 commit into
suitenumerique:mainfrom
web3blind:fix-dropdown-menu-a11y-state-focus
Open

Improve dropdown menu accessibility state and focus#226
web3blind wants to merge 1 commit into
suitenumerique:mainfrom
web3blind:fix-dropdown-menu-a11y-state-focus

Conversation

@web3blind
Copy link
Copy Markdown

Summary

This PR addresses part of #183 for DropdownMenu by improving the trigger state announcement and keyboard focus visibility.

Changes:

  • add aria-haspopup="menu" and aria-expanded to a single trigger element when possible
  • link the trigger to the menu with aria-controls while the menu is open
  • add an explicit high-contrast outline for focused menu items, instead of relying only on a very subtle background change

Accessibility impact

Screen-reader users can now hear whether the dropdown trigger is expanded or collapsed, and keyboard users get a clearer focus indicator while navigating menu items.

This is intentionally a small, safe step toward the broader dropdown accessibility issue rather than a full rewrite of the component.

Validation

  • corepack yarn lint — passed with existing warnings in unrelated preview components
  • corepack yarn build — passed

Closes part of #183.

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.

1 participant