AI Components / Rich Message
Rich Message
Chat message with embedded cards, action buttons, and avatar.
ai-essentials v0.5.0
Playground
Examples
Assistant message
<ai-rich-message role="assistant" text="I analyzed the Q4 data. Revenue grew 18% driven by enterprise expansion.\n\nKey findings:\n- Enterprise: +32%\n- SMB: +8%\n- Consumer: -2%" avatar="AI" timestamp="2 min ago"></ai-rich-message> Import
import { AiRichMessage } from '@cognivo/components'; // Or tree-shake: import '@cognivo/components/ai-rich-message'; Per-component imports ship only that component (~8 kB gzip).
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
role | "user"|"assistant"|"system" | — | Message role |
text | string | — | Message text |
avatar | string | — | Avatar text/URL |
timestamp | string | — | Time label |
Events
| Event | Detail | Description |
|---|---|---|
ai-message-action | {actionId} | Action clicked |