The model - Author, Bind, Auto

One component vocabulary, three ways to use it, and the single rule that governs all of them.

Blocks have one component vocabulary and three postures. The only thing that changes between postures is how much you configure inline — the components are identical. Learn this page and the rest of the reference is obvious.

The one rule (read this first)

The agent is the sole decision maker

A Cell renders what the agent returns and submits what the respondent enters, nothing more. A Cell never appraises an answer, advances on its own logic, caps follow-ups, or checks whether an answer is "enough." Whether an answer is complete, and what to ask next, is always the agent's call, never the client's. There is no client-side validation of sufficiency (no required, no min_selections). A field's props only constrain the shape of input (a star picker yields 1 to 5; single vs. multi select).

This is what makes Blocks different from a form library, and it's why the postures below never give the client decision-making power, only layout and presentation.

Bind - the common case

Your Form is authored in Debriefer (via the GUI, API, MCP, or CLI). In React you just place primitives and bind each to a node by id. You control layout and styling; everything else comes from the published Form.

<Form>
  <Textarea id="cancel_reason" label="What made you cancel?" />
  <Select id="plan" label="Which plan were you on?" />
</Form>

Author - your JSX is the Form

Prefer to define the Form in code? Fill in the authoring props. Your component tree compiles to a blueprint graph (see Authoring).

<Form>
  <Textarea
    id="cancel_reason"
    label="What made you cancel?"
    objective="Surface the specific moment they decided to leave"
    probing={{ enabled: true }}
  />
</Form>

Authoring props (objective, probing, …) define the node at build time. At runtime the published graph is the source of truth for behaviour — so a prop can never silently change what the agent does. See Authoring.

Auto - let the agent drive the whole Form

Render the entire Form with no children. The agent sequences the nodes and decides what comes next; you own only the look.

<Form />

How the postures compare

	Bind	Author	Auto
You write	`<Textarea id />`	`<Textarea label objective … />`	`<Form />`
Form defined in	Debriefer (GUI/API/MCP)	your JSX (compiles)	Debriefer
You lay out the fields	✅	✅	❌ (agent does)
Agent sequences across fields	—	—	✅
Agent drives depth within a field	✅	✅	✅

Across all three, the components, props, and StyleKit are the same. Pick the posture that fits how your Form is authored; switch any time without rewriting your UI.