Form Wizard

A multi-step form wizard with horizontal and vertical step indicators, per-step validation via EditContext or custom callbacks, optional/skippable steps, disabled step support, and customizable navigation buttons.

Default

A BbFormWizard with three steps using icons. Use BbWizardStep children to define each step. The wizard provides built-in Back/Next/Complete navigation.

Per-Step Validation

Wrap in an EditForm with DataAnnotationsValidator and set FieldNames on each step to validate only that step's fields when clicking Next. Try clicking Next with empty fields to see validation errors and the Invalid step state.
At least 8 characters

Checkout Flow (Vertical)

A vertical checkout wizard using Layout="WizardLayout.Vertical" with step descriptions, icons, and per-step field validation. The shipping step includes a state dropdown and the payment step has card number, expiry, and CVV fields with regex validation.

Custom Validator

Use the Validator callback on a step for custom logic. The callback must return true for the step to pass validation. Works independently of or alongside FieldNames.

Optional Steps

Set IsOptional="true" on a step to show a Skip button. Skipping bypasses validation and marks the step with a minus icon. Users can always go back and fill in optional steps later.