Accessibility
multiSelect. Default single-select follows the combobox + listbox pattern with typeahead. multiSelect keeps focus on the inline search input and moves a highlight through option rows via aria-activedescendant.
role="combobox" with aria-expanded, aria-controls pointing at the listbox, and aria-activedescendant reflecting the highlighted option.role="listbox"; each option has role="option" and reflects aria-selected.label (trigger / selected-value text). For form fields that need a required asterisk, compose an external Label with required and set Combobox required for aria-required—do not expect an asterisk on the trigger itself.aria-busy on the list region when appropriate).searchable={false} there is no search input. Opening the popover moves focus into the cmdk root (not the Radix Popover wrapper) so Arrow keys, Enter, and Escape work. Option rows stay tabIndex={-1} so Tab still moves between triggers rather than through items.
Focus stays in the input while browsing searchable single-select results; activating an option closes the listbox and keeps focus there unless configuration moves focus elsewhere. Without a search field, focus moves to the command list on open so keyboard navigation is available immediately.
Typical sequence:
role="option" with aria-selected; selected rows also show a trailing checkbox for sighted users. Keep labels short and unique so screen reader users can scan the list efficiently.
aria-hidden actions region and are not tab stops (tabIndex={-1}). Selection for assistive tech is aria-selected on the option—do not expose a second checkbox widget in the accessibility tree.
options[].tooltip is exposed to screen readers through aria-describedby (visually hidden description). The info icon remains a pointer/hover affordance for the visual tooltip. The content renders twice (visible tooltip + hidden description), so pass plain strings or id-less nodes — a node carrying its own id would be duplicated in the DOM.
role="combobox" with aria-expanded, aria-controls, aria-activedescendant, and aria-autocomplete="list". Pills supplement but must not replace the accessible name of the control.
+N more entries before pills still visible in the field). Option rows are not Tab stops — focus stays on the search input with aria-activedescendant. Tab can move into the Clear / Close footer buttons; Clear resets selection without closing, Close dismisses the panel. Storybook MultiSelectKeyboardNavigation demos this full pattern.
+N more control exposes the hidden values in a checkbox Menu. The overflow trigger has an accessible button name (for example "+3 more"). Overflow rows are menuitemcheckbox widgets with a decorative check indicator (not a nested interactive checkbox). The overflow menu and the Combobox options popover are mutually exclusive—opening one closes the other.
aria-autocomplete (list or both) depending on configuration.aria-selected, not visual-only treatment.aria-describedby.multiSelect.