Message Thread

A full chat conversation layout. Renders user and assistant bubbles with Avatar, ScrollArea, ThinkingIndicator, and StreamingText all composed together. Pass messages with state: 'thinking' | 'streaming' | 'done' to drive the AI response lifecycle.

Interactive

A full chat loop — thinking state transitions to streaming text, which completes to static. Composed from Avatar, ScrollArea, ThinkingIndicator, and StreamingText.

Hi! Ask me anything about Karigiri Kit.

Try asking

Static messages

Pass messages with state: "done" (or no state) to render completed conversations without animation.

Does it support dark mode?

Yes — add data-theme="dark" to any ancestor element. Every component responds to it, including all AI-native ones.

What about accessibility?

All components are WAI-ARIA compliant with full keyboard navigation and screen reader support.

With FeedbackBar

Slot FeedbackBar below the thread for thumbs up/down on the last response.

Does it support dark mode?

Yes — add data-theme="dark" to any ancestor element. Every component responds to it, including all AI-native ones.

What about accessibility?

All components are WAI-ARIA compliant with full keyboard navigation and screen reader support.

Was this helpful?