DOCS
v0.4

Components / Autocomplete

Autocomplete

Combobox input with filtered dropdown suggestions, arrow key navigation, highlight matching.

forms v0.5.0

Playground

Examples

Basic
<cg-autocomplete placeholder="Search countries..." clearable style="max-width:300px;"></cg-autocomplete>

Import

import { CgAutocomplete } from '@cognivo/components';
// Or tree-shake: import '@cognivo/components/cg-autocomplete';

Per-component imports ship only that component (~8 kB gzip).

API Reference

PropTypeDefaultDescription
options {value, label}[] Options list
placeholder string Placeholder
clearable boolean false Show clear button
rounded "none" | "sm" | "md" | "lg" | "full" "lg" Border radius variant

Events

EventDetailDescription
cg-autocomplete-select {value, label} Option selected