Carregando…

Autocomplete

Inputs

Text input with dropdown suggestions, keyboard navigation, sizes and async support.

Instalação via CLI

$ npx kikitocn add autocomplete

Interno:

@/lib/utils

Exemplo de uso

AutocompleteExample.tsx

import { Autocomplete } from "@/components/ui/cn/autocomplete/Autocomplete";

export function AutocompleteExample() {
  return (
    <Autocomplete />
  );
}

Props

Prop	Tipo	Padrão	Descrição
`options*`	`AutocompleteOption[]`	—	Lista de sugestões: { value, label, description?, icon?, disabled? }
`value`	`string`	`undefined`	Valor selecionado (controlled)
`defaultValue`	`string`	`undefined`	Valor inicial (uncontrolled)
`onChange`	`(value: string) => void`	`undefined`	Callback quando uma opção é selecionada
`onInputChange`	`(input: string) => void`	`undefined`	Callback quando o texto do input muda (para filtro assíncrono)
`placeholder`	`string`	`undefined`	Texto placeholder
`label`	`string`	`undefined`	Label acima do campo
`disabled`	`boolean`	`false`	Desabilita o campo
`size`	`'sm' \| 'md' \| 'lg'`	`'md'`	Tamanho do input
`maxResults`	`number`	`undefined`	Limita o número de sugestões exibidas
`emptyMessage`	`string`	`undefined`	Mensagem quando não há resultados

Voltar para Inputs

Carregando…