ChatAssistant
BlocksCompose an AI assistant screen with ChatSidebar, ChatMessageList, and ChatInput.
Compose chat messages with an autoresizing textarea, file attachments, and model and style selectors.
bun add @reopt-ai/opt-uiimport { ChatInput } from "@reopt-ai/opt-ui";Change the width and theme, then interact with the components.
| 키 | 동작 |
|---|---|
| Enter | 메시지 전송 |
| Shift + Enter | 줄바꿈 |
Compose an AI assistant screen with ChatSidebar, ChatMessageList, and ChatInput.
Display role-based chat bubbles, typing indicators, and automatic scrolling.
Browse and search AI conversations and start a new chat.
Display keyboard shortcuts as inline key badges.
Build a dropdown selection with Root, Label, Trigger, Popover, and Item components.
Use accessible buttons with primary, secondary, ghost, and danger variants, three sizes, icons, loading, and aria-busy states.
Organize FAQ questions and answers with Composite and Disclosure components.