Marker

Default

Variants

Use variant to switch between an inline marker, bordered row, and labeled separator.

Status

Set role="status" and include a Spinner for streaming or in-progress markers so updates are announced.

Shimmer

Add the shimmer utility class to Marker.Content for an animated streaming-text effect. The utility ships with the Valar Svelte package. See the shimmer docs for installation.

Separator

Use the separator variant for labeled dividers, such as dates or section breaks, in a conversation.

Border

Use the border variant for status rows that should keep the default marker alignment while separating the next row.

With Icon

Use Marker.Icon to render an icon alongside the content. Use flex-col to stack the icon above the content.

Links and Buttons

Turn a marker into a link or button with the child snippet on Marker.Root.