Wizard

Un flusso completo passo-passo: un'intestazione Stepper + il contenuto del passo corrente + navigazione Indietro/Avanti/Fine, con un validate asincrono opzionale per passo (ad es. bloccare l'avanzamento finché una sezione del form non è valida).

import { Wizard, type WizardStep } from "@pompeitech/vesuvius-ui";

Default

Un passo con validazione bloccante

validate viene eseguito prima di avanzare oltre un passo — restituisci (o risolvi) false per bloccare, ad es. attivando trigger() di react-hook-form per i campi di quel passo.

API

Wizard

Prop	Tipo	Default	Descrizione
`steps`	`WizardStep[]`		Obbligatorio.
`activeStep` / `defaultActiveStep`	`number`		Indice del passo corrente, controllato o non controllato.
`onStepChange`	`(index: number) => void`
`onFinish`	`() => void`		Chiamata dopo che `validate` ha successo sull'ultimo passo.
`orientation`	`"horizontal" \| "vertical"`	`"horizontal"`	Passata all'intestazione `Stepper` interna.
`allowStepClick`	`boolean`	`true`	Salta a qualsiasi passo già visitato cliccandolo sull'intestazione `Stepper`.
`nextLabel` / `backLabel` / `finishLabel`	`string`	`"Next"` / `"Back"` / `"Finish"`

WizardStep — estende StepperStep (title, description?, status?) con:

Campo	Tipo	Descrizione
`content`	`ReactNode`	Obbligatorio — il corpo del passo, renderizzato mentre è attivo.
`validate`	`() => boolean \| Promise<boolean>`	Viene eseguita prima di avanzare oltre questo passo; restituire (o risolvere) `false` blocca l'azione Avanti/Fine. Asincrona, così può attendere una chiamata di validazione di rete.

Accessibilità

L'intestazione Stepper mantiene la propria semantica role="tab"/aria-selected; Indietro/Avanti/Fine sono veri pulsanti, e un passo bloccato da validate semplicemente non avanza invece di disabilitare preventivamente il pulsante Avanti — abbina un validate fallito a un feedback visibile nel content stesso del passo (come fa l'esempio email con FormHelperText), dato che non esiste un annuncio d'errore integrato di per sé.