Vibe UI
Initializing Vibe UI System...
Vibe UI

Combobox

Autocomplete search filter and option selection dropdown.

Combobox

Autocomplete search filter and option selection dropdown.

Installation

pnpm dlx vibe-ui-kit@latest add combobox popover button
💡 Vibe UI Component Dependencies: This component requires other components to work correctlyPlease make sure you also install these Vibe UI component dependencies: popover, button

Themes

Explore design variant presets for the Combobox.

Composed Example

Create bespoke dropdown layouts by utilizing the composed sub-components directly.

Props

Combobox

PropTypeDefaultDescription
optionsComboboxOption[][]The array of predefined option items. Each item must contain a value and label.
valuestring-The controlled value of the selected item.
defaultValuestring''The initial value of the selected item.
onValueChange(value: string) => void-Callback fired when a new item value is selected.
placeholderstring'Select option...'Trigger button label display when no value is chosen.
searchPlaceholderstring'Search...'The placeholder text inside the input search field.
emptyTextstring'No option found.'Label displayed when searching matches no predefined items.
variant'default' | 'glass' | 'retro' | 'glow''default'The design system theme to apply to the trigger and content frame.

Contributors

JS
Jenish Sabhadiya

Theme Customizer

8px
@theme {
  --radius: 0.5rem;
  --glass-blur: 8px;
}
Changes apply instantly to this documentation workspace.
Combobox | Vibe UI