Back to Dropdown
View full API on Dropdown
Dropdown
Controlled
Value driven from external buttons.
Selected: medium
API
| Prop | Type | Default | Description |
|---|---|---|---|
| options* | { value: string; label: string; disabled?: boolean }[] | — | The list of selectable options. |
| value / defaultValue | string | string[] | — | Controlled / uncontrolled selection (array when `multiple`). |
| onValueChange | (value: string | string[], option?: DropdownOption | DropdownOption[] | null) => void | — | Fires on selection change with resolved option object(s). |
| multiple | boolean | false | Allow selecting more than one option. |
| filter / searchable | boolean | false | Enables filtering — single mode filters via trigger input; multi mode shows a panel filter. |
| filterAtBeginning | boolean | false | Match options by prefix instead of contains. |
| onFilterChange | (text: string) => void | — | Fires when the filter text changes. |
| clearable | boolean | — | Shows a clear-selection affordance in the trigger. |
| loading | boolean | — | Shows a spinner and disables interaction. |
| hideOnScroll | boolean | — | Closes the menu when a scroll parent moves. |
| dropdownHeight / dropdownWidth | number | string | — | Override list max-height or menu width. |
| placeholder / searchPlaceholder | string | — | Copy for the trigger and search field. |
| emptyText | string | No matching options. | Copy shown when no options match the current filter. |
| fullWidth | boolean | true | Stretch the trigger and menu to the container width. |
| size | "sm" | "md" | "lg" | md | Trigger height and text scale. |
| disabled | boolean | — | Disables the trigger. |
| showDisabledIcon | boolean | — | Shows a lock icon when disabled. |
| onClear | () => void | — | Fires after the selection is cleared. |
| className | string | — | Merged onto the combobox trigger. |
| contentClassName | string | — | Merged onto the popover content panel. |
| onOpenChange | (open: boolean) => void | — | Fires when the popover opens or closes. |
More Dropdown examples
Single selectBasic single-selection dropdown.Multiple selectMulti-select with a clear button.SearchableFilter a long option list by typing.Filter in triggerSingle-select combobox with beginning-of-label filtering and highlighted matches.Filter + Select AllMulti-select with panel filter and Select All row.