actions
One or two buttons for what to do about the thing on screen.
What to do about it. actions is one or two buttons beside what the answer is about: "Add to cart", "Choose a size", "Open the site". The first is the one that matters most.
On a detail page the first is also drawn lit beside the microphone, where the thumb already is, and the buttons on the page stay quiet. In a thread the first is the primary button and the second a quiet one.
Re-rendered in the browser from the SDK’s own scales. Not a screenshot.
Rendered natively by the Flutter SDK since 0.35.0 and the web SDK since 0.12.0. A build that does not declare it is never offered it.
When not to use it
Not for questions to go on with, which are quick_replies: an action does something about this thing, a quick reply asks about something next.
Not as a way round a confirmation. A reply action asks, in the user's voice, for something to be done ("Add size 43 to my cart"); if that is a write, the copilot still answers it with a confirm_card the user has to accept.
Props
Every block also carries type and a required fallback_text of 1 to 300 characters.
| Prop | Type | Required | Constraints |
|---|---|---|---|
items | array | Yes | 1 to 2 entries. |
items[].label | string | Yes | 1 to 40 characters. |
items[].icon | string | No | Up to 40 characters. |
items[].action | action | Yes | { kind: "reply", text } or { kind: "open_url", url }. See Actions. |
On the wire
{
"id": "blk_40",
"type": "actions",
"fallback_text": "Add Aero Glide 2 to the cart, or choose a size.",
"props": {
"items": [
{ "label": "Add to cart", "icon": "bag", "action": { "kind": "reply", "text": "Add size 43 to my cart" } },
{ "label": "Choose a size", "action": { "kind": "reply", "text": "Which sizes are in stock?" } }
]
}
}Interaction
A reply sends its text as the user's next message: on a detail page the detail closes and the answer opens as a new page. open_url opens the link and leaves everything where it is.
Accessibility
Each button is announced by its label. The icon is decoration; the label says what happens.