Docs
Combobox

Combobox

Autocomplete input and command palette with a list of suggestions.

Usage

import React, { useState } from 'react'
 
import { Combobox } from '@bit/ui'
 
const frameworks = [
  { value: 'next.js', label: 'Next.js' },
  { value: 'sveltekit', label: 'SvelteKit' },
  { value: 'nuxt.js', label: 'Nuxt.js' },
  { value: 'remix', label: 'Remix' },
  { value: 'astro', label: 'Astro' },
]
 
export default function ComboboxDemo() {
  const [value, setValue] = useState('')
 
  return (
    <Combobox
      options={frameworks}
      placeholder='Select framework...'
      value={value}
      onChange={(option) => setValue(option === value ? '' : option)}
      className='w-[200px]'
      noOptionsMessage='No framework found.'
    />
  )
}