Bubble

Bubble renders a standalone chat message surface. Its optional collapse mode clamps: content stays mounted for selection and accessibility while the surface clips it visually.

import { Bubble } from "smithers-orchestrator/ui";

<Bubble variant="assistant" collapsible collapsedHeight={320}>
  {longResponse}
</Bubble>

Props

Prop	Type	Default	Description
`variant`	`"user" \| "assistant" \| "system"`	`"assistant"`	Surface and text treatment.
`align`	`"start" \| "end" \| "center"`	derived	User ends, assistant starts, system centers.
`collapsible`	`boolean`	`false`	Enables measured long-content clamping.
`collapsedHeight`	`number`	`320`	Clamp height in pixels.
`expanded`, `defaultExpanded`	`boolean`	`false`	Controlled or initial expansion state.
`onExpandedChange`	`(expanded: boolean) => void`	Not set	Receives expansion requests.
`expandLabel`, `collapseLabel`	`string`	`"Show more"`, `"Show less"`	Visible disclosure labels.

Use bubbleVariants({ variant }) for other elements needing the same variant classes.

MessageScroller

Attachment

Overview

Core API

Runtime

Types & errors

Gateway RPC

Props

​Props

Props