@onereach/webform
Version:
Content Builder includes several views for: - Content builder view itself; - Web Form view; - Slack block-kit builder;
1,483 lines (1,482 loc) • 40.5 kB
JSON
{
"web": [
{
"section_label": "Display",
"props": {
"icon": "image",
"label": "Display",
"helpText": "Display category...",
"codeMode": true
},
"blocks": [
{
"type": "divider",
"section_label": "Divider",
"props": {
"icon": "border_bottom",
"label": "Divider",
"helpText": "Divider element",
"codeMode": false
}
},
{
"type": "image",
"section_label": "Image",
"props": {
"icon": "image",
"label": "Image",
"helpText": "Image element",
"codeMode": true
}
},
{
"type": "text",
"section_label": "Text",
"props": {
"icon": "text_fields",
"label": "Text",
"helpText": "Text (static) element",
"codeMode": true
}
},
{
"type": "attachments",
"section_label": "Attachments",
"props": {
"icon": "attachment",
"label": "Attachments",
"helpText": "Attach file",
"codeMode": true
}
},
{
"type": "video",
"section_label": "Video",
"props": {
"icon": "video",
"label": "Video",
"helpText": "Video player",
"codeMode": true
}
}
]
},
{
"section_label": "Input",
"props": {
"icon": "input",
"label": "Input",
"helpText": "Input category...",
"codeMode": true
},
"blocks": [
{
"type": "input",
"section_label": "Input",
"props": {
"icon": "input",
"label": "Input",
"helpText": "Input element",
"codeMode": true
}
},
{
"type": "select",
"section_label": "Select",
"props": {
"icon": "list_alt",
"label": "Select",
"helpText": "Select element",
"codeMode": true
}
},
{
"type": "radio",
"section_label": "Radio group",
"props": {
"icon": "radio_button_checked",
"label": "Radio group",
"helpText": "Radio group element",
"codeMode": true
}
},
{
"type": "checkbox",
"section_label": "Checkbox",
"props": {
"icon": "check_box",
"label": "Checkbox",
"helpText": "Checkbox element",
"codeMode": true
}
},
{
"type": "advancedSelect",
"section_label": "Advanced select",
"props": {
"icon": "image",
"label": "Advanced select",
"helpText": "Select element",
"codeMode": true
}
},
{
"type": "switch",
"section_label": "Switch",
"props": {
"icon": "toggle_off",
"label": "Switch",
"helpText": "Switch element",
"codeMode": true
}
},
{
"type": "datePicker",
"section_label": "Datepicker",
"props": {
"icon": "calendar_today",
"label": "Datepicker",
"helpText": "Datepicker element",
"codeMode": true
}
},
{
"type": "timePicker",
"section_label": "Timepicker",
"props": {
"icon": "access_time",
"label": "Timepicker",
"helpText": "Timepicker element",
"codeMode": true
}
},
{
"type": "slider",
"section_label": "Slider",
"props": {
"icon": "sync_alt",
"label": "Slider",
"helpText": "Slider element",
"codeMode": true
}
},
{
"type": "location",
"section_label": "Location",
"props": {
"icon": "place",
"label": "Location",
"helpText": "Location element",
"codeMode": true
}
},
{
"type": "file",
"section_label": "Files",
"props": {
"icon": "cloud_upload",
"label": "Files",
"helpText": "User can upload files",
"codeMode": true
}
}
]
},
{
"type": "advancedCode",
"section_label": "Custom/dynamic",
"props": {
"icon": "code",
"label": "Custom/dynamic",
"helpText": "Insert a section based on dynamic data",
"codeMode": true
},
"blocks": [
{
"type": "advancedCode",
"section_label": "Advanced code section",
"props": {
"icon": "code",
"label": "Advanced code section",
"helpText": "Insert a section based on dynamic data",
"codeMode": true
}
}
]
}
],
"legacyWeb": [
{
"type": "input",
"section_label": "Input",
"props": {
"icon": "input",
"label": "Input",
"helpText": "Input element",
"codeMode": true
}
},
{
"type": "select",
"section_label": "Select",
"props": {
"icon": "list_alt",
"label": "Select",
"helpText": "Select element",
"codeMode": true
}
},
{
"type": "radio",
"section_label": "Radio group",
"props": {
"icon": "radio_button_checked",
"label": "Radio group",
"helpText": "Radio group element",
"codeMode": true
}
},
{
"type": "checkbox",
"section_label": "Checkbox",
"props": {
"icon": "check_box",
"label": "Checkbox",
"helpText": "Checkbox element",
"codeMode": true
}
},
{
"type": "advancedSelect",
"section_label": "Advanced select",
"props": {
"icon": "image",
"label": "Advanced select",
"helpText": "Select element",
"codeMode": true
}
},
{
"type": "datePicker",
"section_label": "Datepicker",
"props": {
"icon": "calendar_today",
"label": "Datepicker",
"helpText": "Datepicker element",
"codeMode": true
}
},
{
"type": "timePicker",
"section_label": "Timepicker",
"props": {
"icon": "access_time",
"label": "Timepicker",
"helpText": "Timepicker element",
"codeMode": true
}
},
{
"type": "switch",
"section_label": "Switch",
"props": {
"icon": "toggle_off",
"label": "Switch",
"helpText": "Switch element",
"codeMode": true
}
},
{
"type": "slider",
"section_label": "Slider",
"props": {
"icon": "sync_alt",
"label": "Slider",
"helpText": "Slider element",
"codeMode": true
}
},
{
"type": "divider",
"section_label": "Divider",
"props": {
"icon": "border_bottom",
"label": "Divider",
"helpText": "Divider element",
"codeMode": false
}
},
{
"type": "image",
"section_label": "Image",
"props": {
"icon": "image",
"label": "Image",
"helpText": "Image element",
"codeMode": true
}
},
{
"type": "text",
"section_label": "Text",
"props": {
"icon": "text_fields",
"label": "Text",
"helpText": "Text (static) element",
"codeMode": true
}
},
{
"type": "location",
"section_label": "Location",
"props": {
"icon": "place",
"label": "Location",
"helpText": "Location element",
"codeMode": true
}
},
{
"type": "file",
"section_label": "Files",
"props": {
"icon": "cloud_upload",
"label": "Files",
"helpText": "User can upload files",
"codeMode": true
}
},
{
"type": "attachments",
"section_label": "Attachments",
"props": {
"icon": "attachment",
"label": "Attachments",
"helpText": "Attach file",
"codeMode": true
}
},
{
"type": "advancedCode",
"section_label": "Advanced code section",
"props": {
"icon": "code",
"label": "Advanced code section",
"helpText": "Insert a section based on dynamic data",
"codeMode": true
}
}
],
"msteams": [],
"slack": [
{
"props": {
"icon": "text_fields",
"label": "Section",
"codeMode": true
},
"blocks": [
{
"name": "Plain text",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`This is a plain text section block.`",
"slack": {
"type": "mrkdwn",
"verbatim": false
}
}
}
],
"props": {
"slack": {
"type": "section"
}
}
}
},
{
"name": "Markdown",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`This is a mrkdwn section block 👻 **this is bold**, and ~~this is crossed out~~, and [this is a link](https://google.com)`",
"slack": {
"type": "mrkdwn",
"emoji": false,
"verbatim": false
}
}
}
],
"props": {
"slack": {
"type": "section"
}
}
}
},
{
"name": "Text fields",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`*this is plain_text text*`",
"slack": {
"type": "plain_text",
"emoji": true,
"verbatim": false
}
}
}
],
"props": {
"slack": {
"type": "section"
}
}
}
},
{
"name": "Users select",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`Test block with users select`",
"slack": {
"type": "mrkdwn",
"emoji": false,
"verbatim": false
}
}
},
{
"type": "select",
"props": {
"placeholder": "`Select a user`",
"slack": {
"type": "users_select",
"action_id": " `users_select-action`",
"placeholder_type": "plain_text",
"placeholder_emoji": true,
"placeholder_verbatim": false
}
}
}
],
"props": {
"slack": {
"type": "section"
}
}
}
},
{
"name": "Static select",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`Pick an item from the dropdown list`",
"slack": {
"type": "mrkdwn",
"emoji": false,
"verbatim": false
}
}
},
{
"type": "select",
"props": {
"placeholder": "`Select an item`",
"slack": {
"type": "static_select",
"action_id": "`static_select-action`",
"placeholder_type": "plain_text",
"placeholder_emoji": true
},
"options": [
{
"key": "value-0",
"value": "`*this is plain_text text*`",
"slack": {
"type": "plain_text",
"emoji": true
}
},
{
"key": "value-1",
"value": "`*this is plain_text text*`",
"slack": {
"type": "plain_text",
"emoji": true
}
},
{
"key": "value-2",
"value": "`*this is plain_text text*`",
"slack": {
"type": "plain_text",
"emoji": true
}
}
]
}
}
],
"props": {
"slack": {
"type": "section"
}
}
}
},
{
"name": "Multi conversations select",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`Test block with multi conversations select`",
"slack": {
"type": "mrkdwn",
"emoji": false,
"verbatim": false
}
}
},
{
"type": "select",
"props": {
"placeholder": "`Select conversations`",
"slack": {
"type": "multi_conversations_select",
"action_id": "`multi_conversations_select-action`",
"placeholder_type": "plain_text",
"placeholder_emoji": true,
"placeholder_verbatim": false
}
}
}
],
"props": {
"slack": {
"type": "section"
}
}
}
},
{
"name": "Button",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`This is a section block with a button.`",
"slack": {
"type": "mrkdwn",
"emoji": false,
"verbatim": false
}
}
},
{
"type": "button",
"props": {
"style": "primary",
"label": "`Click Me`",
"slack": {
"action_id": "`button-action`",
"label_type": "plain_text",
"label_emoji": true
},
"value": "`click_me_123`"
}
}
],
"props": {
"slack": {
"type": "section"
}
}
}
},
{
"name": "Button link",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`This is a section block with a button.`",
"slack": {
"type": "mrkdwn",
"emoji": false,
"verbatim": false
}
}
},
{
"type": "button",
"props": {
"label": "`Click Me`",
"slack": {
"action_id": "`button-action`",
"url": "`https://google.com`",
"value": "`click_me_123`",
"label_type": "plain_text",
"label_emoji": true
}
}
}
],
"props": {
"slack": {
"type": "section"
}
}
}
},
{
"name": "Image",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`This is a section block with an accessory image.`",
"slack": {
"type": "mrkdwn",
"emoji": false,
"verbatim": false
}
}
},
{
"type": "image",
"props": {
"url": "`https://pbs.twimg.com/profile_images/625633822235693056/lNGUneLX_400x400.jpg`",
"alt": "`cute cat`"
}
}
],
"props": {
"slack": {
"type": "section"
}
}
}
},
{
"name": "Overflow",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`This is a section block with an overflow menu.`",
"slack": {
"type": "mrkdwn",
"emoji": false,
"verbatim": false
}
}
},
{
"type": "select",
"props": {
"value": "",
"options": [
{
"key": "value-0",
"value": "`*this is plain_text text*`",
"slack": {
"type": "plain_text",
"emoji": true
}
},
{
"key": "value-1",
"value": "`*this is plain_text text*`",
"slack": {
"type": "plain_text",
"emoji": true
}
}
],
"slack": {
"type": "overflow",
"action_id": "`overflow-action`"
}
}
}
],
"props": {
"slack": {
"type": "section"
}
}
}
},
{
"name": "Date Picker",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`Pick a date for the deadline.`",
"slack": {
"type": "mrkdwn",
"emoji": false,
"verbatim": false
}
}
},
{
"type": "datePicker",
"props": {
"placeholder": "`Select a date`",
"slack": {
"action_id": "datepicker-action",
"placeholder_type": "plain_text",
"placeholder_emoji": true,
"placeholder_verbatim": false
},
"value": "1990-04-28"
}
}
],
"props": {
"slack": {
"type": "section"
}
}
}
},
{
"name": "Checkboxes",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`This is a section block with checkboxes.`",
"slack": {
"type": "mrkdwn",
"emoji": false,
"verbatim": false
}
}
},
{
"type": "checkbox",
"props": {
"multiple": true,
"options": [
{
"key": "value-0",
"value": "`**this is mrkdwn text 0**`",
"slack": {
"type": "mrkdwn",
"description": {
"value": "`**this is mrkdwn text**`",
"slack": {
"type": "mrkdwn"
}
}
}
},
{
"key": "value-1",
"value": "`**this is mrkdwn text 1**`",
"slack": {
"type": "mrkdwn",
"description": {
"value": "`**this is mrkdwn text**`",
"slack": {
"type": "mrkdwn"
}
}
}
}
],
"slack": {
"action_id": "`checkboxes-action`"
}
}
}
],
"props": {
"slack": {
"type": "section"
}
}
}
},
{
"name": "Radio Buttons",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`Section block with radio buttons`",
"slack": {
"type": "mrkdwn",
"emoji": false,
"verbatim": false
}
}
},
{
"type": "radio",
"props": {
"options": [
{
"key": "value-0",
"value": "`*this is plain_text text 0*`",
"slack": {
"type": "plain_text",
"emoji": true
}
},
{
"key": "value-1",
"value": "`*this is plain_text text 1*`",
"slack": {
"type": "plain_text",
"emoji": true
}
}
],
"slack": {
"action_id": "`radio_buttons-action`"
}
}
}
],
"props": {
"slack": {
"type": "section"
}
}
}
},
{
"name": "Time Picker",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`Section block with a timepicker.`",
"slack": {
"type": "mrkdwn",
"emoji": false,
"verbatim": false
}
}
},
{
"type": "timePicker",
"props": {
"slack": {
"action_id": "timepicker-action"
},
"value": "12:00 am"
}
}
],
"props": {
"slack": {
"type": "section"
}
}
}
}
]
},
{
"props": {
"icon": "smart_button",
"label": "Actions",
"codeMode": true
},
"blocks": [
{
"name": "Button",
"schema": {
"type": "section",
"children": [
{
"type": "button",
"props": {
"label": "`Click Me`",
"slack": {
"action_id": "`actionId-0`",
"value": "`click_me_123`",
"label_type": "plain_text",
"label_emoji": true
}
}
}
],
"props": {
"slack": {
"type": "actions"
}
}
}
},
{
"name": "Datepicker",
"schema": {
"type": "section",
"children": [
{
"type": "datePicker",
"props": {
"placeholder": "`Select a date`",
"slack": {
"action_id": "`actionId-0`",
"placeholder_type": "plain_text",
"placeholder_emoji": true,
"placeholder_verbatim": false
},
"value": "1990-04-28"
}
}
],
"props": {
"slack": {
"type": "actions"
}
}
}
},
{
"name": "Checkboxes",
"schema": {
"type": "section",
"children": [
{
"type": "checkbox",
"props": {
"multiple": true,
"options": [
{
"key": "value-0",
"value": "`this is plain_text text 0`",
"slack": {
"type": "plain_text",
"emoji": true,
"description": {
"value": "`this is plain_text text`",
"slack": {
"type": "plain_text",
"emoji": true
}
}
}
},
{
"key": "value-1",
"value": "`this is plain_text text 1`",
"slack": {
"type": "plain_text",
"emoji": true,
"description": {
"value": "`this is plain_text text`",
"slack": {
"type": "plain_text",
"emoji": true
}
}
}
}
],
"slack": {
"action_id": "`actionId-0`"
}
}
},
{
"type": "checkbox",
"props": {
"multiple": true,
"options": [
{
"key": "value-0",
"value": "`**this is mrkdwn text 0**`",
"slack": {
"type": "mrkdwn",
"description": {
"value": "`**this is mrkdwn text**`",
"slack": {
"type": "mrkdwn"
}
}
}
},
{
"key": "value-1",
"value": "`**this is mrkdwn text 1**`",
"slack": {
"type": "mrkdwn",
"description": {
"value": "`**this is mrkdwn text**`",
"slack": {
"type": "mrkdwn"
}
}
}
}
],
"slack": {
"action_id": "`actionId-1`"
}
}
}
],
"props": {
"slack": {
"type": "actions"
}
}
}
},
{
"name": "Radio buttons",
"schema": {
"type": "section",
"children": [
{
"type": "radio",
"props": {
"options": [
{
"key": "value-0",
"value": "`this is plain_text text`",
"slack": {
"type": "plain_text",
"emoji": true
}
},
{
"key": "value-1",
"value": "`this is plain_text text 1`",
"slack": {
"type": "plain_text",
"emoji": true
}
}
],
"slack": {
"action_id": "`actionId-0`"
}
}
}
],
"props": {
"slack": {
"type": "actions"
}
}
}
},
{
"name": "Time Picker",
"schema": {
"type": "section",
"children": [
{
"type": "timePicker",
"props": {
"slack": {
"action_id": "timepicker-action"
},
"value": {
"HH": "13",
"mm": "37"
}
}
}
],
"props": {
"slack": {
"type": "actions"
}
}
}
}
]
},
{
"props": {
"icon": "horizontal_rule",
"label": "Divider",
"codeMode": true
},
"blocks": [
{
"name": "Plain",
"schema": {
"type": "divider"
}
}
]
},
{
"props": {
"icon": "error_outline",
"label": "Context",
"codeMode": true
},
"blocks": [
{
"name": "Plain text",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`Author: K A Applegate`",
"slack": {
"type": "plain_text",
"emoji": true,
"verbatim": false
}
}
}
],
"props": {
"slack": {
"type": "context"
}
}
}
}
]
},
{
"props": {
"icon": "input",
"label": "Input",
"codeMode": true
},
"blocks": [
{
"name": "Multiline plain text input",
"schema": {
"type": "inputWrapper",
"children": [
{
"type": "input",
"props": {
"slack": {
"type": "plain_text_input",
"action_id": "`multiline_plain_text_input-action`",
"multiline": true,
"placeholder_type": "plain_text",
"placeholder_emoji": false,
"placeholder_verbatim": false
}
}
}
],
"props": {
"placeholder": "`Write something`",
"label": "`Label`",
"multiline": true,
"slack": {
"type": "plain_text_input",
"label_type": "plain_text",
"label_emoji": false
}
}
}
},
{
"name": "Plain text input",
"schema": {
"type": "inputWrapper",
"children": [
{
"type": "input",
"props": {
"slack": {
"type": "plain_text_input",
"action_id": "`plain_text_input-action`",
"placeholder_type": "plain_text",
"placeholder_emoji": false,
"placeholder_verbatim": false
}
}
}
],
"props": {
"placeholder": "`Write something`",
"label": "`Label`",
"slack": {
"type": "plain_text_input",
"label_type": "plain_text",
"label_emoji": false
}
}
}
},
{
"name": "Multi user select",
"schema": {
"type": "inputWrapper",
"children": [
{
"type": "select",
"props": {
"placeholder": "`Select users`",
"slack": {
"type": "multi_users_select",
"action_id": "`multi_users_select-action`",
"placeholder_type": "plain_text",
"placeholder_emoji": false,
"placeholder_verbatim": false
}
}
}
],
"props": {
"label": "`Label`",
"slack": {
"type": "multi_users_select",
"label_type": "plain_text",
"label_emoji": false
}
}
}
},
{
"name": "Static Select",
"schema": {
"type": "inputWrapper",
"children": [
{
"type": "select",
"props": {
"slack": {
"type": "static_select",
"action_id": "`static_select-action`",
"placeholder_type": "plain_text",
"placeholder_emoji": false,
"placeholder_verbatim": false
},
"placeholder": "`Select an item`",
"options": [
{
"key": "value-0",
"value": "`*this is plain_text text 0*`",
"slack": {
"type": "plain_text",
"emoji": false
}
},
{
"key": "value-1",
"value": "`*this is plain_text text 1*`",
"slack": {
"type": "plain_text",
"emoji": false
}
}
]
}
}
],
"props": {
"label": "`Label`",
"slack": {
"type": "static_select",
"label_type": "plain_text",
"label_emoji": false
}
}
}
},
{
"name": "Datepicker",
"schema": {
"type": "inputWrapper",
"children": [
{
"type": "datePicker",
"props": {
"placeholder": "`Select a date`",
"slack": {
"action_id": "`datepicker-action`",
"placeholder_type": "plain_text",
"placeholder_emoji": false,
"placeholder_verbatim": false
},
"value": "1990-04-28"
}
}
],
"props": {
"label": "`Label`",
"slack": {
"type": "datepicker",
"label_type": "plain_text",
"label_emoji": false
}
}
}
},
{
"name": "Checkboxes",
"schema": {
"type": "inputWrapper",
"children": [
{
"type": "checkbox",
"props": {
"multiple": true,
"options": [
{
"key": "value-0",
"value": "`*this is plain_text text 0*`",
"slack": {
"type": "plain_text",
"emoji": false
}
},
{
"key": "value-1",
"value": "`*this is plain_text text 1*`",
"slack": {
"type": "plain_text",
"emoji": false
}
}
],
"slack": {
"action_id": "`checkboxes-action`"
}
}
}
],
"props": {
"label": "`Label`",
"slack": {
"type": "checkboxes",
"label_type": "plain_text",
"label_emoji": false
}
}
}
},
{
"name": "Radio buttons",
"schema": {
"type": "inputWrapper",
"children": [
{
"type": "radio",
"props": {
"options": [
{
"key": "value-0",
"value": "`*this is plain_text text 0*`",
"slack": {
"type": "plain_text",
"emoji": false
}
},
{
"key": "value-1",
"value": "`*this is plain_text text 1*`",
"slack": {
"type": "plain_text",
"emoji": false
}
}
],
"slack": {
"action_id": "`radio_buttons-action`"
}
}
}
],
"props": {
"label": "`Label`",
"slack": {
"type": "radio_buttons",
"label_type": "plain_text",
"label_emoji": false
}
}
}
}
]
},
{
"props": {
"icon": "title",
"label": "Header",
"codeMode": true
},
"blocks": [
{
"name": "Example",
"schema": {
"type": "section",
"children": [
{
"type": "text",
"props": {
"value": "`This is a header block`",
"slack": {
"type": "plain_text",
"emoji": true,
"verbatim": false
}
}
}
],
"props": {
"slack": {
"type": "header"
}
}
}
}
]
}
]
}