SystemMessage
Centered system-event rows and consumer-owned adjacent-run grouping.
2:16 PM📦 Atlas archived this channel
2:16 PM@hermes joined this channel.
2:16 PM✅ Atlas moved #41 "Release review checklist" to Done
import {
SystemMessage,
SystemMessageContent,
SystemMessageGroup,
SystemMessageGroupChevron,
SystemMessageGroupDisclosure,
SystemMessageGroupHeader,
SystemMessageGroupPanel,
SystemMessageGroupSummary,
SystemMessageTime,
} from "raft-ui";
<SystemMessage>
<SystemMessageTime />
<SystemMessageContent>{message.content}</SystemMessageContent>
</SystemMessage>
<SystemMessageGroup open={open} onOpenChange={setOpen}>
<SystemMessageGroupHeader>
<SystemMessageGroupDisclosure>
<SystemMessageGroupSummary>{summary}</SystemMessageGroupSummary>
<SystemMessageGroupChevron />
</SystemMessageGroupDisclosure>
</SystemMessageGroupHeader>
<SystemMessageGroupPanel>
<SystemMessage>...</SystemMessage>
</SystemMessageGroupPanel>
</SystemMessageGroup>API#WIP
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"div"> | — | Centered system row for product-authored system events. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"span"> | — | Inline timestamp shown before the system copy. |
| Prop | Type | Default | Description |
|---|---|---|---|
title | string | — | Tooltip title. Defaults to the string children when present. |
...props | useRender.ComponentProps<"span"> | — | System event content slot. Product parsing and copy stay consumer-owned. |
| Prop | Type | Default | Description |
|---|---|---|---|
open | boolean | — | Controlled open state for the group. |
defaultOpen | boolean | — | Default open state for the uncontrolled group. |
onOpenChange | Collapsible.Root.Props['onOpenChange'] | — | Callback fired when the group open state changes. |
...props | Base UI Collapsible.Root.Props | — | Base UI Collapsible root for an adjacent-run system-message group. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"div"> | — | Centered wrap around the group disclosure trigger. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"button"> (Collapsible.Trigger) | — | Collapsible trigger for the group summary row. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"span"> | — | Truncated summary copy inside the disclosure. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"svg"> | — | Chevron indicator; rotates via data-panel-open on the disclosure. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | Base UI Collapsible.Panel.Props | — | Expanded details slot that hosts the grouped SystemMessage rows. |