Loading...
Loading...
> Natural language search with categorized results and relevance scoring.
The AI Search component provides a conversational search interface. Users type natural language queries and receive categorized results with relevance scores. Includes suggested queries for discovery and demo mode for testing.
DESC: Import the search interface into your page.
1import { AiSearch } from '@/components/library/ai-search';
Use without API for testing and demos.
1export default function Page() {2 return <AiSearch placeholder="> Search your data..." />;3}
Connect to your search backend.
1export default function Page() {2 const handleSearch = async (query: string) => {3 const response = await fetch('/api/ai/search', {4 method: 'POST',5 body: JSON.stringify({ query }),6 });7 return await response.json();8 };910 return <AiSearch onSearch={handleSearch} />;11}
| Option | Type | Default | Description |
|---|---|---|---|
| onSearch | (query: string) => Promise<SearchResult[]> | undefined | Async callback for fetching search results. |
| placeholder | string | "> Ask anything or search..." | Placeholder text for the search input. |
| className | string | undefined | Additional CSS classes for the container. |
Results are categorized with icons for quick scanning: