Steps and pages

The q-stepper structure builds a multi-step form with Quasar QStepper and one FormKit group per step.

Reorder steps

The same controls are available in:

• the selected step configuration panel;
• the left drawer Tree tab.

Move up and Move down update the steps[] order. The moved step remains selected and active.

Duplicate a step

Duplicate creates a copy directly after the source step.

Duplication:

• copies the step configuration;
• recursively copies all fields, sections, columns, tabs and nested structures;
• regenerates every field name to prevent collisions;
• sets the new validation state to pending.

Delete a step

Delete is available in both the settings panel and tree. The last remaining step cannot be removed.

After deletion, the builder selects the previous step or the first available step.

Validation states

Each step exposes a state shared with the tree:

State	Icon	Meaning
pending	clock	The FormKit group has not produced a usable state yet.
valid	green check	No error or blocking validation message.
invalid	red error	At least one rule blocks progression.

The state is displayed:

• in the QStepper header;
• in the tree node caption and icon.

Blocking navigation

In preview mode and FormViewer, users cannot move forward while the current step is invalid.

The guard applies to:

• the Next button;
• direct clicks on a later step in the stepper header.

When navigation is refused:

1. the step is marked submitted so FormKit errors become visible;
2. the current step remains active;
3. an actionable banner asks the user to fix the fields;
4. the tree immediately receives the invalid state.

Moving backwards remains allowed. Builder editing mode stays unrestricted so authors can continue designing the form.

Display conditions

A step can keep an if property. In preview/runtime, steps whose condition is false are removed from the navigation order. Progression checks only use visible steps.