Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/yogendrarana/craftdotui/llms.txt

Use this file to discover all available pages before exploring further.

The Combobox component combines a text input with a listbox of options, allowing users to filter and select from a list.

​
Installation

import { Combobox } from "@craftdotui/baseui/components/combobox";

​
Usage

This component is built on @base-ui/react’s Combobox primitive. Refer to the source code for the complete API and implementation details.
<Combobox
  options={[
    { value: 'option1', label: 'Option 1' },
    { value: 'option2', label: 'Option 2' },
    { value: 'option3', label: 'Option 3' },
  ]}
/>

​
Features

  • Searchable dropdown
  • Keyboard navigation
  • Single or multiple selection
  • Custom option rendering
  • Async option loading
  • Filtering and sorting

​
Examples

​
Basic Combobox

<Combobox
  placeholder="Select an option"
  options={[
    { value: 'react', label: 'React' },
    { value: 'vue', label: 'Vue' },
    { value: 'angular', label: 'Angular' },
  ]}
/>

​
With Search

<Combobox
  searchable
  placeholder="Search frameworks..."
  options={frameworks}
/>

​
Accessibility

  • Built on @base-ui/react for ARIA compliance
  • Combobox ARIA pattern
  • Keyboard accessible
  • Screen reader support
  • Focus management