AI Components / Search
Search
AI-powered search with suggestions, faceted filters, recent searches, and result preview. Matches cg-input sizing.
ai-workflowv0.3.0
Playground
Examples
With filters
<ai-search placeholder="Search components..." style="max-width:420px;"></ai-search>Large
<ai-search size="lg" placeholder="Ask anything..." style="max-width:480px;"></ai-search>Pill
<ai-search rounded="full" placeholder="Search..." style="max-width:420px;"></ai-search>With results
<ai-search placeholder="Search..." style="max-width:420px;"></ai-search>Import
import { AiSearch } from '@cognivo/components';// Or tree-shake: import '@cognivo/components/ai-search';Per-component imports ship only that component (~8 kB gzip).
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
size | "md" | "lg" | "md" | Input size — md (48px), lg (56px) |
rounded | "default" | "full" | "default" | Pill shape when full |
placeholder | string | "Search..." | Placeholder text |
suggestions | string[] | — | AI-generated suggestions |
filters | string[] | — | Filter tag chips |
recentSearches | string[] | — | Recent search history |
results | {title, description?, icon?, url?}[] | — | Search results |
Events
| Event | Detail | Description |
|---|---|---|
ai-search-query | {query: string, filters: string[]} | Search query changed |
ai-search-select | {result: SearchResult} | Result selected |