Library routes for chat surfaces, composers, and renders.
Use this app to inspect the exported package surfaces. The live chat demo stays separate from the component pages so screenshots and visual checks remain repeatable.
Routes
Start with the full chat surface, then move to the focused component routes when you need tighter visual checks.
Render surfaces
Isolated routes with no sidebar or header chrome, intended for README screenshots and UI review.
Surface families
The package separates transcript layout, input primitives, and supporting rich-content parts so app code can mix them without reimplementing the shell.
Transcript surfaces
`ChatView`, `ChatMessage`, and `ChatTaskCard` cover the thread shell, message blocks, and run-state UI. Use them when you need a full assistant thread with streamed parts, attachments, and status cards.
Input surfaces
`ChatComposer` and `ChatInput` share the Spark-derived autoresize behavior and keyboard submit flow. Use them when you want the full composer shell or just the textarea primitive.
Rich text and parts
`ChatMarkdown` plus the part factories keep markdown, task cards, maths, and custom thread inserts aligned. Use them when assistant replies need richer blocks without a separate renderer.
Inspection flow
The gallery mirrors the review sequence for the package: live route first, isolated render second, README screenshot last.
1. Live route
Check the full page route for spacing, section rhythm, and how the component behaves with surrounding UI.
2. Isolated render
Use the matching `/render/*` route to verify just the exported component without gallery chrome.
3. README asset
Capture the selector-based screenshot only after the live route and render route both look correct.
`ChatView`, `ChatComposer`, `ChatInput`, `ChatMessage`, `ChatTaskCard`, and `ChatMarkdown` are the public package contract. The gallery exists to exercise those exports, not to document its own internal route structure.
If a route looks good in the gallery but fails in `/render/*`, treat the render route as the source of truth for docs and screenshot work.