BwWizard | bw-wizard
Overview
The wizard component is used for multi-step forms. You can have optional and required steps. It has methods to navigate between steps and a method to check if the current step can be skipped. The mode property can be set to make the wizard horizontal (default) or vertical.
Properties
| Property | Attribute | Description | Type | Default |
|---|---|---|---|---|
initialStep | initial-step | Initial step of the wizard | number | undefined |
mobile | mobile | Hides labels and reduces spacing to make component more mobile friendly. Only applicable in horizontal mode. | boolean | false |
mode | mode | Display mode: 'horizontal' (default) or 'vertical'. | "horizontal" | "vertical" | 'horizontal' |
steps | steps | The steps of the wizard. | { label: string; subLabel?: string; optional?: boolean; }[] | [] |
Events
| Event | Description | Type |
|---|---|---|
finish | Emitted when the wizard is finished. | CustomEvent<void> |
stepChange | Emitted when the current step changes. | CustomEvent<number> |
Methods
canSkip() => Promise<boolean>
Checks if the current step can be skipped.
Returns
Type: Promise<boolean>
next() => Promise<void>
Goes to the next step.
Returns
Type: Promise<void>
previous() => Promise<void>
Goes to the previous step.
Returns
Type: Promise<void>
reset() => Promise<void>
Resets the wizard.
Returns
Type: Promise<void>
skip() => Promise<void>
Skips the current step.
Returns
Type: Promise<void>
© 2025 United Systems & Software - All Rights Reserved.