Walk me through how the kit handles message bubbles.
AI
Each row is a Message with optional Avatar, Content, Text, and Action parts. Variants live on MessageText so you can mix bubble and plain segments.
N
What's the right way to render assistant streams?
AI
Wrap streaming text in a sibling like Markdown or ResponseStream. The Message itself stays presentational, so you only pay for parsing when you render it.
N
And actions go where?
AI
Inside MessageContent, after the text segments. MessageAction is just a layout row. Drop a Button with iconOnly and the ghost variant inside for the standard look.
N
Can I use my own avatar component?
AI
Yes, MessageAvatar accepts any children. A direct <img> child is sized to fill the slot, anything else lays out centered.
N
How does the Conversation manage scroll?
AI
It wraps Base UI's ScrollArea, tracks distance from the bottom, and exposes a context so the floating button can scroll to the latest message.
N
What if I want a flat list with no auto-scroll?
AI
You can drop ConversationScrollButton entirely and the auto-stick still works, or you can stop calling scrollToBottom by editing the file. The kit copies into your repo.
N
Does it cooperate with virtualization?
AI
Not out of the box. If you need virtualization, swap the ScrollArea internals or render your own viewport. The behavior here is for moderate threads.
N
Where do I theme the scrollbar?
AI
Inside Conversation. The Scrollbar and Thumb live in the root render tree so you can retone them without exposing extra parts.
N
Final question: does it handle reduced-motion preferences?
AI
scrollTo uses smooth by default. If a user has reduced-motion set, the browser already swaps it for instant. You can also pass behavior to scrollToBottom.