Skip to content

Combobox

An autocomplete input that allows users to filter and select from a list of options. Implements the ARIA 1.2 Combobox pattern.

Comboboxes are complex interactive widgets. Our implementation follows the latest ARIA patterns to ensure a consistent experience across all screen readers.

Accessibility Features

  • ARIA 1.2 Pattern: Uses role="combobox", aria-autocomplete, and aria-expanded.
  • Live Announcements: Announces the number of results found as the user types.
  • Keyboard Navigation: Full support for Up/Down arrows to navigate options and Enter to select.

Usage Example

import { Combobox, ComboboxInput, ComboboxList, ComboboxItem } from '@holmdigital/components'; <Combobox> <ComboboxInput placeholder="Search framework..." /> <ComboboxList> <ComboboxItem value="next">Next.js</ComboboxItem> <ComboboxItem value="svelte">SvelteKit</ComboboxItem> <ComboboxItem value="astro">Astro</ComboboxItem> </ComboboxList> </Combobox>