Select

Select is a low-level, accessible UI primitive that helps achieve ecosystem-agnostic, fully accessible select menus that can be styled as needed.

Select follows the WAI-ARIA authoring practices for a listbox that displays a menu to the user, such as a set of actions or functions triggered by a button.

Import

import {Select} from '@fuegokit/react'

Usage

<Select>
  <Select.Trigger aria-label="Food">
    <Select.Value placeholder="Select a fruit…" />
    <Select.Icon>
      <AkChevronDownIcon />
    </Select.Icon>
  </Select.Trigger>
  <Select.Portal>
    <Select.Content>

Accessibility

Select adheres to the listBox WAI-ARIA design pattern.

See the W3C Select-Only Combobox example for more information.

Keyboard interactions