Skip to content
Block Kit for React
Esc
↑↓navigate↵open⌘Jpreview
On this page

Input

A labeled form field for a modal or App Home, the only way to collect input from a user.

input pairs a label with one form element: a text field, a select, a date or time picker, checkboxes, or radio buttons. It’s the field type modals and App Home tabs use to collect values a user submits; message and card surfaces never render it.

New ticket

Tell us what went wrong. All fields are shared with the on-call team.
Title
Priority
Details (optional)
Steps to reproduce help a lot.
Notify

Fields

PropType
typestring

Always `input`.

Typestring
labelPlainTextElement

The bold label above the element. Maximum length is 2000 characters.

TypePlainTextElement
elementInputBlockElement

The single form element this field wraps: a text input, select, picker, checkboxes, or radio buttons.

TypeInputBlockElement
hint?PlainTextElement

Muted helper text below the element. Maximum length is 2000 characters.

TypePlainTextElement
optional?boolean

Lets the modal submit with this field empty. Not shown on a message-surface preview, only in a modal or Home tab form.

Typeboolean
Defaultfalse
dispatch_action?boolean

Sends a `block_actions` payload as the user interacts with the element. Without it, the value only arrives on submit.

Typeboolean
Defaultfalse
block_id?string

A unique identifier for this block. Auto-generated if omitted. Maximum length is 255 characters.

Typestring

Examples

Plain text input

Your AppAPP
Label

Multiline plain text input

Your AppAPP
Label

Checkboxes

Your AppAPP
Label

Radio buttons

Your AppAPP
Label

Static select

Your AppAPP
Label

Every select variant renders the same way inside input. See select menus for multi_static_select, users_select, external_select, and the rest.

Multi-user select

Your AppAPP
Label

Date and time pickers

Your AppAPP
Date
Time

Optional field

An optional field shows an “(optional)” suffix next to its label, in a modal or Home tab form:

Your AppAPP
Label

Hint

Your AppAPP
Details
Steps to reproduce help a lot.

Interactivity

By default an input block’s element sends no actions: its value only reaches state, and your app reads it from the view_submission payload. Set dispatch_action: true to also get a block_actions payload as the user interacts, like an element in an actions block.

Checkboxes, radio buttons, selects and pickers then dispatch on every change. Single-line text inputs (plain_text_input, email_text_input, url_text_input, number_input) dispatch on the trigger in their dispatch_action_config: on_enter_pressed (the default) or on_character_entered. A multiline plain_text_input never dispatches on Enter, which inserts a newline instead.

Your AppAPP
Label
Press 'enter' to submit
onActionInteract with the preview.

onAction receives, on pressing Enter:

{
  "type": "plain_text_input",
  "action_id": "plain_text_input-action",
  "block_id": "<the input block's block_id>",
  "value": "…"
}

When the field doesn’t already carry its own hint, a single-line on_enter_pressed-dispatching input shows a synthesized “Press ‘enter’ to submit” hint below it, matching Slack’s Builder preview:

Your AppAPP
Label
Press 'enter' to submit

Any other element dispatches on change. Tick a box to see the action:

Preferences

Notifications
onActionInteract with the preview.

Was this page helpful?