Add bot-driven room app UI via im.paarrot.ui state.
All checks were successful
Trigger cinny-mobile / dispatch (push) Successful in 2s
All checks were successful
Trigger cinny-mobile / dispatch (push) Successful in 2s
Bots can publish a declarative panel UI that takes over a room; user actions are sent as im.paarrot.ui.action timeline events.
This commit is contained in:
34
docs/handoff/features/room-app-ui/samples/poll-ui-state.json
Normal file
34
docs/handoff/features/room-app-ui/samples/poll-ui-state.json
Normal file
@@ -0,0 +1,34 @@
|
||||
{
|
||||
"version": 1,
|
||||
"title": "Poll Booth",
|
||||
"root": {
|
||||
"type": "panel",
|
||||
"id": "poll",
|
||||
"children": [
|
||||
{
|
||||
"type": "text",
|
||||
"id": "prompt",
|
||||
"text": "Where should we go for lunch?"
|
||||
},
|
||||
{
|
||||
"type": "select",
|
||||
"id": "choice",
|
||||
"name": "choice",
|
||||
"label": "Your vote",
|
||||
"options": [
|
||||
{ "label": "Ramen", "value": "ramen" },
|
||||
{ "label": "Pizza", "value": "pizza" },
|
||||
{ "label": "Salad", "value": "salad" }
|
||||
],
|
||||
"value": "ramen"
|
||||
},
|
||||
{
|
||||
"type": "button",
|
||||
"id": "vote",
|
||||
"label": "Submit vote",
|
||||
"action": "vote",
|
||||
"variant": "Primary"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,88 @@
|
||||
{
|
||||
"version": 1,
|
||||
"title": "Trivia Night",
|
||||
"css": ".score { font-weight: 700; } .hint { opacity: 0.75; }",
|
||||
"root": {
|
||||
"type": "panel",
|
||||
"id": "main",
|
||||
"children": [
|
||||
{
|
||||
"type": "text",
|
||||
"id": "q",
|
||||
"text": "Capital of France?"
|
||||
},
|
||||
{
|
||||
"type": "text",
|
||||
"id": "hint",
|
||||
"className": "hint",
|
||||
"text": "Pick one answer below."
|
||||
},
|
||||
{
|
||||
"type": "spacer",
|
||||
"id": "sp1",
|
||||
"size": 16
|
||||
},
|
||||
{
|
||||
"type": "row",
|
||||
"id": "answers",
|
||||
"children": [
|
||||
{
|
||||
"type": "button",
|
||||
"id": "a",
|
||||
"label": "Paris",
|
||||
"action": "answer",
|
||||
"value": "paris",
|
||||
"variant": "Primary"
|
||||
},
|
||||
{
|
||||
"type": "button",
|
||||
"id": "b",
|
||||
"label": "Lyon",
|
||||
"action": "answer",
|
||||
"value": "lyon",
|
||||
"variant": "Secondary"
|
||||
},
|
||||
{
|
||||
"type": "button",
|
||||
"id": "c",
|
||||
"label": "Marseille",
|
||||
"action": "answer",
|
||||
"value": "marseille",
|
||||
"variant": "Secondary"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "spacer",
|
||||
"id": "sp2",
|
||||
"size": 24
|
||||
},
|
||||
{
|
||||
"type": "text",
|
||||
"id": "score_label",
|
||||
"className": "score",
|
||||
"text": "Score: 0"
|
||||
},
|
||||
{
|
||||
"type": "input",
|
||||
"id": "nick",
|
||||
"name": "nickname",
|
||||
"label": "Display name on the board",
|
||||
"placeholder": "Optional nickname"
|
||||
},
|
||||
{
|
||||
"type": "row",
|
||||
"id": "submit_row",
|
||||
"children": [
|
||||
{
|
||||
"type": "button",
|
||||
"id": "join",
|
||||
"label": "Join board",
|
||||
"action": "join",
|
||||
"variant": "Success"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
{
|
||||
"action": "answer",
|
||||
"component_id": "a",
|
||||
"value": "paris",
|
||||
"values": {
|
||||
"nickname": "Ada"
|
||||
},
|
||||
"ui_event_id": "$REPLACE_WITH_CURRENT_im.paarrot.ui_EVENT_ID"
|
||||
}
|
||||
Reference in New Issue
Block a user