Skip to content

Dropdown: reveal the current value on open + proper listbox/menu item roles #396

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.

Sign up for GitHub

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

Open
acusti wants to merge 6 commits into
base: main
Choose a base branch
from
Open

Dropdown: reveal the current value on open + proper listbox/menu item roles #396

Changes from 1 commit
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
126c785
Reveal the current value when the dropdown opens
acusti Jul 16, 2026
13a9f7f
Add listbox and menu item roles
acusti Jul 16, 2026
495b2fd
Keep aria-selected on the submitted item when the body stays open
claude Jul 16, 2026
c48606a
Document item roles, reveal-on-open, and the selected tint in the README
claude Jul 16, 2026
08cddbf
Document the reveal-on-open scope precisely
claude Jul 17, 2026
6238202
Never write invalid or conflicting selection ARIA in a listbox
claude Jul 17, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Document item roles, reveal-on-open, and the selected tint in the README 
The ARIA attributes section covered the trigger, body, submenu, and
menubar annotations but not the item-level ones added alongside them:
option/menuitem role fill-in, the presentation role on list wrappers,
aria-selected on the current listbox option, and the reveal-on-open
behavior with its --uktdd-body-bg-color-selected custom property.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01HcJxNoQKN6Yx5hmYpwJHMJ
  • Loading branch information
@claude
claude committed Jul 16, 2026
commit c48606ac39d3d967e247c1325029dee2f4f3efa3
15 changes: 15 additions & 0 deletions packages/dropdown/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -947,6 +947,21 @@ readers can associate the trigger with its popup. If your custom trigger
already specifies any of these ARIA props, your values win — the component
only fills in what you haven’t set.

Item roles are filled in the same way when the body opens: items receive
`role="option"` in a searchable (listbox) dropdown or `role="menuitem"` in
a menu (always `menuitem` inside a submenu), and the `<ul>`/`<ol>` wrappers
around them receive `role="presentation"` so the listbox or menu owns its
items directly rather than through an intervening list. A natively
interactive item (a button, link, or input) or one with a role you set
yourself keeps its own role.

Opening also reveals the current selection: the item matching `props.value`
becomes the active item (so keyboard navigation starts from the current
selection) and is scrolled into view. In a searchable (listbox) dropdown it
additionally receives `aria-selected="true"` (`aria-selected` isn’t valid
on a `menuitem`); the persistent tint on the selected item is themeable via
the `--uktdd-body-bg-color-selected` custom property.

Submenus and menubars extend the same pattern automatically:

- parent items receive `aria-haspopup="menu"` and `aria-expanded`, and
Expand Down
Loading