# Shadcn AI Chat blocks

> Conversation surfaces for AI products, from full chat shells to embeddable threads, sheets, and launchers.

- Type: Pro blocks (AI & Agents)
- Page: https://reui.io/blocks/ai-agents/ai-chat
- Blocks: 13
- Installs with a ReUI Pro or Ultimate license; setup: https://reui.io/docs/license-setup

## When to use

- A full page assistant chat, new chat welcome screen or 2 model comparison inside an AI product
- A copilot docked beside the page it works on, or opened from a launcher in the page corner
- Answers that show the work behind them: sources read, tool steps, plans to approve and run cost

## When not to use

- The product layout around the chat: a sidebar of threads, workspaces and account menus: use the [App Shell blocks](https://reui.io/blocks/application/app-shell.md)
- A plain overlay chat panel opened from a button, with suggestion chips and a composer: use the [Sheet blocks](https://reui.io/blocks/application/sheet.md)
- A highlighted snippet with a filename header and copy button, outside any conversation: use [Code Block](https://reui.io/components/code-block.md) (`get_component("code-block")`)

## Agent notes

- Each `AiChat` root sizes itself to the viewport with `h-svh`, or `min-h-svh` in ai-chat-5; give it your layout's height inside an app shell
- Every reply is canned content from the block's data file, played back on `setTimeout` and `setInterval` timers; stream your model's output there instead

## Third-party libraries

- Shiki v4: [API reference](https://shiki.style/guide/install), [docs](https://shiki.style/guide/), used by 8 of 13 blocks
- Sonner v2: [API reference](https://sonner.emilkowal.ski/toast), [docs](https://sonner.emilkowal.ski/getting-started), used by 7 of 13 blocks
- Motion v12: [API reference](https://motion.dev/docs/react-motion-component), [docs](https://motion.dev/docs/react), used by 1 of 13 blocks (the docs follow the latest Motion, with no React API break since v12)
- next-themes: [API reference](https://github.com/pacocoursey/next-themes#api), [docs](https://github.com/pacocoursey/next-themes), used by 1 of 13 blocks
- React Resizable Panels v4: [API reference](https://github.com/bvaughn/react-resizable-panels#documentation), [docs](https://react-resizable-panels.vercel.app/), used by 1 of 13 blocks (v4 names its parts Group, Panel and Separator (v3 docs say PanelGroup))

## Blocks

- [Copilot Shell](https://reui.io/blocks/ai-agents/ai-chat/ai-chat-1.md): AI copilot chat surface with streaming transcript and recent chats. Best for a starter rail of Create, Explore, Code and Learn prompts, with a context window meter and an extended thinking toggle in the composer.
- [Docked Assistant](https://reui.io/blocks/ai-agents/ai-chat/ai-chat-2.md): Docked AI assistant chat panel beside a page with insert into draft. Best for a release notes draft beside a collapsible assistant dock, where Insert writes the drafted section into the page and Undo takes it out.
- [Prompt Starter Welcome](https://reui.io/blocks/ai-agents/ai-chat/ai-chat-3.md): AI chat welcome screen with prompt starters and a docked composer. Best for a greeting over Start rows that fill the composer and attach a source, with Instant, Extended or Deep effort and an in thread Questionnaire.
- [Quote Reply Sidebar](https://reui.io/blocks/ai-agents/ai-chat/ai-chat-4.md): Floating right chat sidebar that pushes the page and replies to a quoted sentence. Best for a floating right Sidebar that pushes the page, where selecting a reply sentence opens a quote pill and arrow keys walk a suggestion list.
- [Connected Apps Chat](https://reui.io/blocks/ai-agents/ai-chat/ai-chat-5.md): AI chat welcome screen where connected work apps set the answer scope. Best for a one run screen where a Combobox in the composer footer scopes 9 apps, then marks each source read or skipped with a Connect button.
- [Agentic Task Panel](https://reui.io/blocks/ai-agents/ai-chat/ai-chat-6.md): Agentic side panel where the answers carry the controls. Best for an agent run steered inside its replies: a 3 question brief, a checkbox plan with skip and retry, a mid run fork and a ticket handoff.
- [Model Comparison](https://reui.io/blocks/ai-agents/ai-chat/ai-chat-7.md): Split pane model comparison running one prompt against two AI models. Best for a pair of Resizable model panes on one prompt, with a scroll lock and a latency, tokens per second and cost strip ending in an A or B vote.
- [Voice Assistant Panel](https://reui.io/blocks/ai-agents/ai-chat/ai-chat-8.md): Docked voice first assistant panel that answers in a different shape each time. Best for a calendar assistant taking voice notes with a scrubbable Slider transport, answered as a move plan to approve, time slots or a roster.
- [Branching Thread](https://reui.io/blocks/ai-agents/ai-chat/ai-chat-9.md): Branching AI chat thread with reply versions, cited sources and code artifacts. Best for a thread held as a node tree, where a regenerate or an edit adds a version chip on its fork, with folded reasoning and numbered citations.
- [Structured Answers](https://reui.io/blocks/ai-agents/ai-chat/ai-chat-10.md): AI chat welcome screen with scoped sources and structured answers. Best for a file scope ToggleGroup on the ask box, with replies built from sortable tables, code artifacts and Progress comparison bars.
- [Answer Receipts](https://reui.io/blocks/ai-agents/ai-chat/ai-chat-11.md): AI chat stage with framed answer receipts on a live dot field. Best for replies as Frame receipts with model, latency and token count in the header and a tool trace, figure row or patch summary under the prose.
- [Docs Support Assistant](https://reui.io/blocks/ai-agents/ai-chat/ai-chat-12.md): Ask AI docs support panel that shows the knowledge base being read. Best for a support sidebar beside a docs page that ticks each knowledge base article from queued to read and offers a ticket when none covers it.
- [Corner Chat Popup](https://reui.io/blocks/ai-agents/ai-chat/ai-chat-13.md): Corner AI chat popup with history, expand and page context. Best for a corner launcher whose non modal window expands, minimizes to a bar that flags a New Reply, and keeps a pinnable, deletable history.

Every ReUI item has a twin like this one; the index is https://reui.io/llms.txt. Agents with the ReUI MCP (https://reui.io/docs/mcp) get the same guidance from the getters named above.
