Combobox

Searchable select combining a text input with a filterable dropdown list.

Examples

A dropdown list with a trigger button.

Combobox with a text filter input inside the dropdown.

A combobox that cannot be interacted with.

Options organised into labelled groups.

Combobox allowing multiple items to be selected.

react vue

Combobox with error border.

Please select a valid option.

pnpm add @rokle/components @rokle/tokens

Installs with the default Rokle brand. Generate a custom brand on rokle.app to use your own colours and personality.

import { Combobox } from "@rokle/components";

import { Combobox } from "@rokle/components";

export function Example() {
  return <Combobox />;
}

Prop	Type	Default	Description
options	{ label: string; value: string }[]	-	List of selectable options.
value	string	-	Currently selected value.
onValueChange	(value: string) => void	-	Called when selection changes.
placeholder	string	"Search…"	Input placeholder text.