AI Components / Citation
Citation
Inline numbered citation badges with expandable source cards, or bibliography list mode. Relevance dots, URL sanitization.
ai-display v0.2.0
Playground
Examples
Inline badges
Revenue grew 23% driven by enterprise expansion
<p style="font-size:14px;color:var(--text);line-height:1.6;max-width:480px;">Revenue grew 23% driven by enterprise expansion<ai-citation></ai-citation> while churn decreased to 3.2%<ai-citation></ai-citation>. Click a badge to expand the source card.</p>Multiple sources
<ai-citation></ai-citation>List mode
<ai-citation mode="list" style="max-width:480px;"></ai-citation>Import
import { AiCitation } from '@cognivo/components';// Or tree-shake: import '@cognivo/components/ai-citation';Per-component imports ship only that component (~8 kB gzip).
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
sources | {title, url?, excerpt?, relevance?}[] | — | Source objects |
mode | "inline" | "list" | "inline" | Inline badges or list |
maxVisible | number | 5 | Max visible inline badges before +N |
Events
| Event | Detail | Description |
|---|---|---|
ai-citation-click | {index: number, source: CitationSource} | Citation badge clicked |