# Chat UI

> Chat UI building blocks for React/Next.js from ui.inference.sh. Components: ChatContainer, ChatMessages, ChatInput, MessageBubble, MessageContent, MessageReasoning, MessageStatusIndicator, Markdown. Capabilities: chat interfaces, message lists, input handling, streaming, file uploads, drag-and-drop, auto-scroll, reasoning/thinking blocks, markdown rendering with code highlighting. Use for: building custom chat UIs, messaging interfaces, AI agent frontends, conversational apps. Triggers: chat ui, chat component, message list, chat input, shadcn chat, react chat, chat interface, messaging ui, conversation ui, chat building blocks, inference.sh chat, agent chat ui, streaming chat

- Skill: `quaylabshq/chat-ui` (Agent Skill, multi-file: 16 files)
- Install (CLI): `npx skillmds@latest add quaylabshq/chat-ui`
- Raw SKILL.md: https://api.skillmd.com/api/skills/quaylabshq/chat-ui/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: quaylabshq (https://skillmd.com/u/quaylabshq)
- Updated: 2026-09-22
- Page: https://skillmd.com/skills/quaylabshq/chat-ui

---


# Chat UI Components

Navigable reference graph for chat building blocks from [ui.inference.sh](https://ui.inference.sh). Install via shadcn registry.

## Components

| Component | Reference |
|-----------|-----------|
| Overview + ChatContainer | [references/components/overview.md](references/components/overview.md) |
| ChatMessages + Auto-Scroll | [references/components/chat-messages.md](references/components/chat-messages.md) |
| ChatInput + File Attachments | [references/components/chat-input.md](references/components/chat-input.md) |
| Message Display (Bubble, Content, Reasoning, Status) | [references/components/message-display.md](references/components/message-display.md) |
| Markdown Renderer | [references/components/markdown.md](references/components/markdown.md) |

## Integration

| Topic | Reference |
|-------|-----------|
| Installation + Provider Setup | [references/integration/setup.md](references/integration/setup.md) |
| Hooks + State Management | [references/integration/hooks-and-state.md](references/integration/hooks-and-state.md) |
| File Upload System | [references/integration/file-uploads.md](references/integration/file-uploads.md) |

## Patterns

| Pattern | Reference |
|---------|-----------|
| Full Agent Assembly | [references/patterns/full-agent.md](references/patterns/full-agent.md) |
| Customization + Styling | [references/patterns/customization.md](references/patterns/customization.md) |

## Extensions

| Topic | Reference |
|-------|-----------|
| Future Extensions + Related Skills | [references/extensions.md](references/extensions.md) |