GitHub

Autocomplete

A searchable select input that allows users to filter and select from a list of options

Docs API
Select a fruit or type a new one

Installation

pnpm dlx shadcn@latest add https://shark-ui.vercel.app/r/autocomplete.json

Usage

import { 
  Autocomplete,
  AutocompleteInput,
  AutocompleteContent,
  AutocompleteItem,
  AutocompleteItemGroup,
  AutocompleteEmpty,
  AutocompleteItemGroupLabel,
  AutocompleteTrigger,
  AutocompleteClearTrigger,
} from "@/components/ui/autocomplete";
<Autocomplete>
  <AutocompleteInput />
  <AutocompleteContent>
    <AutocompleteEmpty />
    <AutocompleteItemGroup>
      <AutocompleteItemGroupLabel />
        <AutocompleteItem />
    </AutocompleteItemGroup>
  </AutocompleteContent>
</Autocomplete>