Combobox

Stable

Autocomplete input and command palette with a list of suggestions.

Examples

Basic Usage

tsx
export function ComboboxDemo() {
  const [value, setValue] = React.useState("");
  
  return (
    <Combobox
      label="Framework"
      placeholder="Select framework..."
      searchPlaceholder="Search frameworks..."
      options={frameworks}
      value={value}
      onChange={setValue}
    />
  );
}

Neon Variant

Combobox uses the Command palette under the hood, so it automatically inherits the Neon styling for both the trigger and the popup.

tsx
<Combobox variant="neon" label="Command" />

API Reference

PropertyDescriptionTypeDefault
optionsArray of { value: string, label: string } objects.ComboboxOption[]-
valueThe controlled value.string-
onChangeEvent handler called when value changes.(value: string) => void-
variantVisual style for trigger and dropdown."default" | "neon" | "glass"-
searchPlaceholderPlaceholder for the internal search input.string-
emptyTextText to display when no results are found.string-