opinion
Wizard
A multi-step form: step progress, one step at a time, and Back, Next and Submit.
New projectNext stays disabled until the required fields are filled
- 1ProjectName and owner
- 2DatesWhen it ships
- 3BriefWhat it is
- 1Team
- 2Details
In context
Invite the crewSetup inside a dialog-sized card
Set up crew interviewsTwelve calls, ending 21 Oct
- 1Who
- 2When
Props
| Prop | Type | Required | Default |
|---|---|---|---|
steps | WizardStep[] | Yes | — |
submitLabel | string | undefined | No | Submit |
backLabel | string | undefined | No | Back |
nextLabel | string | undefined | No | Next |
onSubmit | ((values: Record<string, WizardValue>) => void) | undefined | No | — |
bionic | boolean | undefined | No | — |
bionicOptions | BionicOptions | undefined | No | — |
Shape
{ type: "wizard", steps: { label, description?, fields: FormField[] }[], submitLabel?, backLabel?, nextLabel? }. Next and Submit are really disabled, not just dimmed, until the current step's required fields are filled.
data-rebar-* attributes
Same as the core Wizard; see its Props.
Migrating to Ant Design
Not codemod-covered; compose AntD's Steps and Form.