DUAiChat
AIFull AI chat panel with bubbles, typing, and prompt input.
import { DUAiChat } from 'deri-ui';Live preview
AI Assistant
A
Ask me anything about Deri UI.
typescript
<DUAiChat messages={msgs} onSend={send} typing={false} title="Assistant" />Props
| Prop | Type | Default | Description |
|---|---|---|---|
| messages | DUChatMessage[] | — | Transcript |
| onSend | (text: string) => void | — | Submit |
| typing | boolean | — | Show typing indicator |
| title | string | — | Header |
Usage
import { DUAiChat } from 'deri-ui';
<DUAiChat messages={msgs} onSend={send} typing={false} title="Assistant" />Customize with className, radius, and Tailwind utilities. Theme tokens come from deri-ui/tailwind.preset.
Related
© 2026 Deri Ui. Developed by Deribew Shimelis. Copy and use the code freely in your projects.