NovoFormuláriodesde v0.2.0

Combobox

Campo de busca com lista de opções.

Quando usar

Lista grande de opções com busca. Use quando Select simples não escala.

Playground

Ajuste props ou edite o código em tempo real (componentes compatíveis).

Controles interativos disponíveis em breve para este componente. Use os exemplos abaixo como referência.

Editor Sandpack disponível para: button, input, textarea, switch, skeleton, separator, label e spinner. Este componente usa apenas o preview interativo acima.

Exemplos

Variações comuns de uso.

Uso básico

import { Combobox } from "@/components/ui/combobox"

export function ComboboxDemo() {
  return <Combobox />
}

API

Props principais documentadas para o time.

Prop	Tipo	Padrão	Descrição
className	string	—	Classes Tailwind para layout e espaçamento.
children	ReactNode	—	Conteúdo interno do componente.

Instalação

pnpm dlx shadcn@latest add http://localhost:3000/r/combobox.json

pnpm dlx shadcn@latest add @youxgroup/combobox

Dependências

npm: cn, @base-ui/react, @hugeicons/react, @hugeicons/core-free-icons

Registry: @youxgroup/button, @youxgroup/input-group

Relacionados

input-group button