Messages
User and assistant messages, streaming, markdown, code and errors.
Components
13 components availableRender an AI reply token by token like ChatGPT's typing effect — blinking cursor, stop button, and no layout jump as the text grows.
User MessageThe user's chat bubble — right-aligned, with hover actions to copy, edit the prompt, or regenerate the answer.
Message ActionsThe action row under an AI reply — copy, regenerate, share and thumbs up/down feedback, revealed on hover.
Error & RetryWhat to show when a generation fails — a plain-English reason, a retry button, and a countdown for rate limits.
Markdown MessageA rendered markdown reply — syntax-highlighted code blocks with copy buttons, plus tables, lists and safe links.
Streaming MarkdownMarkdown that renders correctly while it is still arriving — bold, code spans, links and tables settle without ever flashing raw syntax or reflowing.
Response VersionsThe 1/3 pager after a regenerate — previous and next versions, branch markers, continue-from-here, and honest generating, failed and stopped states.
Code BlockA code block with a language label and one-click copy button.
Comparison TableA feature-by-plan comparison matrix with checkmarks.
Data TableA tidy data table for structured comparisons and results.
Message Actions (AICSS)The action row under an assistant message: good response, bad response, copy, an emoji reaction, reply, and more.
Streaming TextTypewriter-style streaming text with a blinking caret.
Text ResponseClean prose styling for a standard assistant answer with inline code.
Patterns using Messages
Complete interfaces composed from these components.
The canonical chat interface — sidebar, streaming messages, prompt input with model selector, and sources.
Open pattern →AI Voice AssistantA voice-first conversation — live waveform states, a recording input, a spoken transcript and a typed fallback.
Open pattern →Artifact WorkspaceChat on the left, generated output on the right — artifacts open from the answer, stream, version, and fail without breaking the conversation.
Open pattern →Document Q&A WorkspaceAsk your own documents — upload and parse, cited answers with inspectable passages, an honest not-found state, and a visible context budget.
Open pattern →Generative UI DashboardThe model assembles a dashboard from a controlled widget registry — streamed props, an unsupported-request fallback, and widget clicks that re-enter the chat.
Open pattern →