MessageActionCard
Suggested action card composed inside a MessageItem body for commit-style workflows.
import {
Banner,
BannerDescription,
MessageActionCard,
MessageActionCardActions,
MessageActionCardCompletion,
MessageActionCardContent,
MessageActionCardHeader,
MessageActionCardHeaderStatus,
MessageActionCardHint,
MessageActionCardProperties,
MessageActionCardProperty,
MessageActionCardPropertyLabel,
MessageActionCardPropertyValue,
MessageActionCardScope,
MessageActionCardScopeDescription,
MessageActionCardScopeList,
MessageActionCardScopeListLabel,
MessageActionCardScopeName,
} from "raft-ui";
<MessageActionCard>
<MessageActionCardHeader>
<MessageActionCardHeaderStatus />
</MessageActionCardHeader>
<MessageActionCardContent>
<MessageActionCardProperties>
<MessageActionCardProperty>
<MessageActionCardPropertyLabel />
<MessageActionCardPropertyValue />
</MessageActionCardProperty>
</MessageActionCardProperties>
<MessageActionCardScopeList>
<MessageActionCardScopeListLabel />
<MessageActionCardScope>
<MessageActionCardScopeName />
<MessageActionCardScopeDescription />
</MessageActionCardScope>
</MessageActionCardScopeList>
<Banner status="warning">
<BannerDescription />
</Banner>
<MessageActionCardHint />
<MessageActionCardActions />
<MessageActionCardCompletion />
</MessageActionCardContent>
</MessageActionCard>These three prepared-card shapes cover channel creation, agent creation, and member changes. The caller owns the dialog and execution path; this usage keeps the card itself static.
Login approval, Connected App registration, legacy update, and owner recovery each provide their own prepared-card content. Their execute policy remains product-owned.
A completed card replaces its action area with result content. A rejected card keeps its prepared structure and lets the product choose whether retry is permitted.
API#WIP
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"div"> | — | Suggested-action card root. Compose inside MessageItemBody; execution state stays consumer-owned. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"div"> | — | Outer title row. Compose the action title and any trailing status here. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"span"> | — | Trailing header region. Use render to apply its alignment to a caller-owned badge or status. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"div"> | — | White inner content stack for details, hint, actions, and completion. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"dl"> | — | Optional aligned definition list for compact action properties. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"div"> | — | Semantic label/value pair in the shared Properties grid; it does not create its own surface. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"dt"> | — | Muted metadata label with a shared column width. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"dd"> | — | Metadata value that wraps without widening the card. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"div"> | — | Optional named scope section rendered directly in the content stack. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"div"> | — | Theme-aware heading for a scope list. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"div"> | — | One bordered scope explanation block. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"div"> | — | Scope identifier. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"div"> | — | Scope capability explanation. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"div"> | — | Optional agent-provided rationale or guidance. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"div"> | — | Pre-commit action area. Buttons and dialog state stay consumer-owned. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | useRender.ComponentProps<"div"> | — | Post-commit result and actor summary supplied by the consumer. |