> ## Documentation Index
> Fetch the complete documentation index at: https://docs.getflowpilot.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Block controllers (Simple)

> In Simple mode the properties panel shows one high-level controller per block instead of the raw Layout, Style, and Logic tabs: curated controls for content, color, actions, and animation.

In [Simple mode](/editor/editing-modes), selecting a block shows a **block controller** in the properties panel: a compact set of high-level controls for that block. It replaces the Advanced [Layout / Style / Logic tabs](/editor/properties). You get the controls that matter for the block (its content, options, colors, an action, an animation) and none of the raw plumbing.

Every certified block has a controller. The controls are always either a **curated choice** (a preset dropdown, a style picker) or a **direct value with safe bounds** (a color, a number, some text). Simple never offers a control that composes arbitrary logic or positioning.

<Note>TODO: screenshot of a Simple-mode block controller (for example the choice controller) in the properties panel.</Note>

## When a block has no controller

A block without a Simple controller cannot be edited in Simple. The panel shows one of two things:

* If the block uses Advanced-only features, a read-only amber card titled **"Some features are Advanced-only"**: "You can style this element here, but it also uses advanced features that stay intact and are editable only in Advanced mode," followed by the list of what is locked (conditional values, positioning, custom components, advanced animations).
* Otherwise, a short placeholder telling you to switch to Advanced for full control.

Nothing is ever lost. Switch to [Advanced](/editor/editing-modes) to edit these in the full property tabs.

## Controls shared across blocks

Several controls appear in many controllers.

### When tapped

Interactive blocks (like a button) get a **"When tapped"** section with a single **Action** picker. You choose one verb from a curated list:

| Verb                | What it does                                |
| ------------------- | ------------------------------------------- |
| **Do nothing**      | No action.                                  |
| **Continue**        | Advance to the next screen.                 |
| **Go back**         | Return to the previous screen.              |
| **Go to screen...** | Jump to a screen you pick.                  |
| **Open link...**    | Open a URL you enter in the **Link** field. |
| **Finish flow**     | Close the flow.                             |

A **"Haptic on tap"** toggle adds a light vibration on press. This is the Simple form of an [action](/editor/interactions-and-actions). Multi-action chains, non-tap events, delays, and conditional actions stay in Advanced.

### Auto-advance (single-choice questions)

A single-select question controller has an **"Auto-advance"** toggle: "When on, picking an option goes to the next screen." It saves you from adding a separate Continue tap for one-answer questions.

### Animation

Most controllers have an **"Animation"** section with three controls:

* **Effect**: **None**, **Fade up**, **Slide in**, **Pop**, **Scale & fade**, or **Bounce in**.
* **Trigger**: **On appear** or **On tap**.
* **Delay (ms)** (on-appear only): 0 to 2000.

These map to vetted [animation](/editor/animations) presets. The full timeline, stagger, and attention editors stay in Advanced.

### Text effect

Text blocks add a **"Text effect"** section with one **Effect** picker: **None**, **Typewriter**, **Typewriter (words)**, **Count up**, **Fade in lines**, or **Scramble**.

### Required

Choice and input blocks have a **"Required"** section. Turning **Required** on disables a target (usually the Continue button or a persistent-zone footer button) until the question is answered or the field is filled. You pick the target in the **Disables** dropdown.

* On a choice block, it reads "Must answer to continue" and "Stays disabled until an option is selected on this screen."
* On an input field, it reads "Must be filled to continue" and "Stays disabled until this field is filled in."

If there is no button to gate yet, the section prompts: "Add a continue button to this screen or a persistent zone first." Required gating is Simple-only; see [Interactions and actions](/editor/interactions-and-actions#required-questions-and-inputs).

## Controllers by block

| Block                                                              | Its controller's main controls                                                                                                                                                                                                                                                                                                                                                                                                |
| ------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Title / Subtitle / Normal Text / Rich Text**                     | **Content** (the text), **Typography**: a **Size** preset (Display, Title, Heading, Subheading, Body, Caption), **Color**, and **Align** (Left / Center / Right), plus **Text effect** and **Animation**.                                                                                                                                                                                                                     |
| **Image**                                                          | **Image**: source and **Fit** (Cover, Contain, Fill, None, Scale down), plus **Animation**.                                                                                                                                                                                                                                                                                                                                   |
| **Single / Multi Choice**                                          | **Options** (add, edit, reorder; **Add Option**), **Answer values** (see [Calculated values](/editor/calculated-values)), **Selection** (the bound **Variable**, a **Haptic** "Vibrate on select" toggle), **Option Style** (quick styles **Soft / Outline / Contrast**, plus background, border, radius, padding, gap), **Option Typography** (font size, weight, color), **Auto-advance**, **Required**, and **Animation**. |
| **Rating**                                                         | **Rating**: **Style** (Stars / Numbers) and **Scale** (3, 4, 5, 7, ...), plus **Animation**.                                                                                                                                                                                                                                                                                                                                  |
| **Text / Long Text / Email / Phone / Number / Password input**     | **Field**: **Heading**, **Placeholder**, **Validation** (Optional / Required / Valid email (required)), and **Lines** for long text. **Data collected**: the **Name** and the **Saved to** variable (or **Create new variable**). Plus **Required** and **Animation**.                                                                                                                                                        |
| **Buttons** (Primary / Secondary / Text / Icon / Pulse / Gradient) | **Button**: **Label**, **Style** (filled / outline / text / gradient), and **Color** (or gradient **Start** / **End**). **Shape & icon**: **Shape** (Rounded / Pill / Square), **Icon**, **Icon side** (Leading / Trailing). **Emphasis**: a **Pulse** toggle. Plus **When tapped** and **Animation**.                                                                                                                        |
| **Hero**                                                           | **Image** (source) and **Text** (**Title**, **Subtitle**), plus **Animation**.                                                                                                                                                                                                                                                                                                                                                |
| **Review**                                                         | **Review**: **Stars** (3, 4, 5) and the quote, author, and avatar, plus **Animation**.                                                                                                                                                                                                                                                                                                                                        |
| **Continue Button**                                                | A light controller with the **When tapped** action and styling.                                                                                                                                                                                                                                                                                                                                                               |
| **Progress Bar**                                                   | **Appearance**: **Fill** and **Track** colors and **Thickness** (Thin / Medium / Thick).                                                                                                                                                                                                                                                                                                                                      |
| **Analysis Loader**                                                | Title, subtitle, accent color, plus **Animation**.                                                                                                                                                                                                                                                                                                                                                                            |
| **Countdown / Countdown Boxed / Limited Offer**                    | **Countdown**: **Duration** (H / M / S), **Display** format, **Restart** (once per session, or every visit), the text shown **At zero**, and a **Shared ID** for showing one clock in several places. Then the emit hooks: **When it reaches zero** and **Along the way** (milestones), each an action list.                                                                                                                  |
| **Columns / Rows / Carousel**                                      | Container controls: add or remove cells (a **Column** / **Row** / **Slide**) and set spacing. Fill each cell by dragging blocks into it. Carousel adds **Auto-scroll**: **Scroll automatically** loops the slides endlessly, with **Direction** (Left / Right) and **Speed**. The slides hold still on the canvas so you can keep dropping into them — the loop runs in preview and on device.                                |

## Common mistakes

* **Hunting for a Position or per-edge padding control.** Simple does not expose them. Spacing is set per block (a gap or padding value in the controller); precise positioning is an Advanced control.
* **Trying to add a second action on tap.** Simple's "When tapped" is a single action. For chains, delays, or non-tap events, switch to Advanced.
* **Renaming an input's variable and breaking a Calculated value.** The **Saved to** key is what other features read. Keep references consistent, or edit in the Advanced [variable manager](/editor/variables).
* **Expecting Required to work with no Continue button.** Required gates a target. Add a Continue button (or a footer zone button) first.

## Related pages

* [Simple and Advanced modes](/editor/editing-modes)
* [The Element Library (Simple)](/editor/element-library)
* [The properties panel (Advanced)](/editor/properties)
* [Interactions and actions](/editor/interactions-and-actions)
* [Animations](/editor/animations)
* [Calculated values and answer scores](/editor/calculated-values)
