Options
ChatLayout is configuration-first:conversation and prompt are typed props, not composed children, and both are optional.
Conversation slot
The three slot configurations side by side: the full column,conversation alone (a read-only or archived view, with no composer), and prompt alone (an empty landing state, ready for the first message). Either slot can be omitted independently — the other still renders correctly on its own.
Prompt slot
Theprompt composer is typically a PromptBar, rendered below conversation and pinned to the bottom of the region regardless of how much transcript precedes it.
Behavior
The transcript manages its own scroll position so a growing conversation never fights the reader.Stick to Bottom
The transcript sticks to the bottom on its own as messages arrive. The moment the user scrolls up to read history, it stops auto-scrolling — so incoming content never yanks them back down — and re-engages the lock once they scroll back to the bottom.Scroll to Latest
A floating “scroll to latest” button appears whenever the user has scrolled away from the bottom. Pressing it scrolls smoothly back to the latest content and re-engages the stick-to-bottom lock. Force the same scroll programmatically — e.g. right after the user sends a message — viacontrolRef’s scrollToBottom().
Keyboard Interaction
Users can scroll the transcript using standard keyboard controls.Patterns that use this component
- Agentic Experience Shell — Defines the conversation region