Bubble
Displays conversational content in a message bubble — variants, alignment, grouping, reactions, and polymorphic link/button content.
Default
A short thread with grouped messages and reactions.
Installation
CLI
Usage
bubble.tsx
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| variant | "default" · "secondary" · "muted" · "tinted" · "outline" · "ghost" · "destructive" | "default" | Visual treatment of the bubble surface. |
| align | "start" · "end" | "start" | Align the bubble to the start or end of the conversation row. |
| side | "top" · "bottom" | "bottom" | On BubbleReactions: which edge to anchor to. |
| asChild | boolean | false | On BubbleContent: merge props onto a child (link or button). |