Block Kit layouts, elements and input handling
Building valid Block Kit layouts: block and field limits, header and modal view rules, buttons with action_id, style and confirm, static versus external select menus, reading view.state.values, returning validation errors, and updating a modal without losing input.
Build a UI for your app's surfaces using Block Kit.
~7 min read · 12 practice questions ·
What the exam expects
- Diagnose invalid layouts from block limits, section
fieldslimits, header text type and modal view rules. - Configure buttons: unique
action_id,styleprimaryordanger, aconfirmdialog, and link buttons that still need an acknowledgement. - Choose a static or external select menu from the size and volatility of the option list.
- Read submitted values from
view.state.values, returnresponse_action: errors, and react to input changes withdispatch_action. - Update a modal without losing typed input or applying stale updates.
Key terms: block (a visual component in a surface's blocks array); block element (usually interactive, such as a button or menu); composition object (text, option or confirm object used inside them); action_id (identifies the element in payloads); view.state.values (submitted values keyed by block_id, then action_id); dispatch_action (makes an input block send block_actions).
Key facts
- Detail
- 50 per message; 100 per modal or Home tab
fields- Detail
- Maximum 10 items
- Detail
plain_text, max 150 characters
style- Detail
primaryordangeronly
- Detail
- Still sends a payload that must be acknowledged
- Detail
title,text,confirm,denyrequired
static_select options- Detail
- Maximum 100
options, or 100option_groups
external_select typeahead- Detail
min_query_lengthdefault 3
- Detail
plain_text, max 24 characters
submit- Detail
- Required when the view has an input block
dispatch_action- Detail
- Input block field, default false
Sources for this section (8)
- Blocksdocs.slack.dev (opens in a new tab)
- Section blockdocs.slack.dev (opens in a new tab)
- Header blockdocs.slack.dev (opens in a new tab)
- Button elementdocs.slack.dev (opens in a new tab)
- Confirmation dialog objectdocs.slack.dev (opens in a new tab)
- Select menu elementdocs.slack.dev (opens in a new tab)
- Modal viewsdocs.slack.dev (opens in a new tab)
- Input blockdocs.slack.dev (opens in a new tab)
- Why can't two buttons in one actions block share an `action_id`?
- When should an app choose `external_select` over `static_select`?
- Which path reads the text typed into a plain-text input `a1` in block `b1`?
- Why pass `hash` to `views.update`?
The questions are free to read. Answers with their sources and self-grading are included with the pack.
Keep reading with the Slack Developer pack
- Core concepts
- Exam traps
- Worked scenario
The pack includes:
- All 38 lessons of the Slack Developer guide, with reading progress
- Interactive decision walks and step-by-step sequence steppers
- Inline practice questions and one-click topic practice (12 questions for this lesson)
- An official source cited for every claim
- An AI tutor that answers from the guide
- Unlimited timed practice exams