Input Text
The Input Text component captures a single line of user-entered text, with length constraints, pattern validation, required state, and customizable error messaging.
The Input Text component captures a single line of text on a Flow screen. Use it for names, codes, email addresses, URLs, phone numbers, passwords, and any other short free-form entry, with built-in validation to keep the input clean.
Overview
Beyond plain text, the component supports specialized input types (email, telephone, URL, password, search) and a full set of validation rules — required, pattern matching, and minimum/maximum length — each with its own error message. Prefix and suffix text, a placeholder, field-level help, and an inline-edit display mode round out the configuration.
Configuration
To configure it, click the component on the Flow screen. The Edit Text Input Component panel opens on the right with three tabs: Properties, Interactions, and Style. The sub-sections below mirror the Properties tab.
Properties
Label — the text label shown above the input.
Prefix — text displayed before (to the left of) the input field, such as a currency symbol or scheme name.
Value — the default value of the input. Bind it to a Flow variable or record field to pre-fill the field.
Suffix — text displayed after (to the right of) the input field, such as a unit.
Field Level Help — optional tooltip text detailing the purpose and function of the input, shown next to the label.
Type — the kind of input, which controls the keyboard and built-in browser validation:
Text (default) — plain single-line text.
email — an email address.
Telephone — a phone number.
URL — a web address.
Password — masked input for secrets.
Search — a search box.
Variant — the label placement and field appearance:
Standard (default) — label above the input.
Label Hidden — label is hidden (still read by screen readers).
Label Inline — label sits to the left of the input.
Label Stacked — label stacked above the input.
Moving Label — label floats inside the field and animates above it on focus.
Placeholder — hint text shown inside the field when it is empty, to prompt the user for a valid entry.
Inline Edit — when enabled, the field renders as an inline-editable value rather than a standard input box — the user clicks the value to edit it in place.
Validations
The Validations section is collapsed by default. Expand it to enforce entry rules and customize the error messages the user sees.
Required — marks the field as mandatory.
Disabled — greys out the field so the user cannot interact with it.
Read Only — the field is visible but cannot be edited.
Pattern — a regular expression the entered value must match to be considered valid.
Max Length — the maximum number of characters allowed.
Min Length — the minimum number of characters allowed.
Message When Bad Input — error message shown when a bad input is detected.
Message When Pattern Mismatch — error message shown when the value does not match the pattern. Requires Pattern to be set.
Message When Too Long — error message shown when the value exceeds the maximum length. Requires Max Length to be set.
Message When Too Short — error message shown when the value is shorter than the minimum length. Requires Min Length to be set.
Message When Type Mismatch — error message shown when the value does not match the expected type (for example, an invalid email address).
Message When Value Missing — error message shown when the field is Required and left empty.
Interactions
Interactions define what happens when users interact with the Text Input. Configure them from the Interactions tab of the Edit Text Input panel.
Change
Fires when the user changes the entered value. Use it to validate as the user types, refresh dependent data on the same screen, or drive conditional logic based on what was entered.
Styling
The Style tab gives you fine-grained control over the Input Text's appearance. Configure it from the Style tab of the Edit Text Input panel.
Controls the outer spacing around the component.
Top / Right / Bottom / Left: Adjust the space on each side.
Controls the inner spacing between the component's content and its edges.
Top / Right / Bottom / Left: Adjust the inner spacing on each side.
Styles the field label displayed above the input.
Color: Label text color.
Font Size / Font Style / Font Weight: Control the label typography.
Styles the input box itself.
Background Color: Input background color.
Text Color: Color of the entered text.
Color Border: Input border color.
Box Shadow: Shadow around the input.
Box Shadow Focus: Shadow shown when the input has focus.
Border Radius: Corner rounding of the input.
Inline Start / Inline End: Horizontal spacing inside the input, before and after the text.
Styles the prefix text shown before the input.
Color: Prefix text color.
Font Size / Font Style / Font Weight: Control the prefix typography.
Styles the suffix text shown after the input.
Color: Suffix text color.
Font Size / Font Style / Font Weight: Control the suffix typography.
Output Variables
The Input Text exposes the entered text as an output variable you can reference in your flow after the screen. To use it, select the screen element in Flow Builder, then the Input Text component, and pick the output variable you need.
Entered Value
Value
Text (String)
The text the user entered in the field.
Example: After the screen, use Value in a Create Records element to store the entered text on a new record, or in a Decision element to branch on what the user typed.
Troubleshooting Common Issues
Validation messages never appear — The matching rule isn't set, so there is nothing to validate against. A custom message only shows once its rule is configured — for example Message When Pattern Mismatch requires Pattern, and Message When Too Long requires Max Length.
The Value output is empty after the screen — The field was left blank and is not marked Required, so the flow received no value. Enable Required (with Message When Value Missing) if a value is mandatory before the user can continue.
The field can't be edited — Read Only or Disabled is enabled. Turn both off to let the user type; use Read Only only when you want to display a value the user shouldn't change.
Last updated
Was this helpful?