Wizard
The Wizard package helps capture data in steps and provide ability to navigate between steps.
import { WizardProgress, WizardProgressRope } from '@balance-web/wizard';The Wizard package helps capture data in steps and provide ability to navigate between steps.
WizardProgressRope
The WizardProgressRope is used to help the user add an entity through a guided wizard. This component only provides the item and rope UI, consumer is expected to provide the container UI with things like height, background color etc.
NOTE: Do not use this component for updating entities.
Usage
WizardProgress
WizardProgress renders a numbered step nav from a steps map (keyed by
step number) and a currentStep. It's a display-only component — it has no
opinion about how step state is stored; wire currentStep/steps up to
whatever state you're already managing (useState, a form library, or
@reckon-web/wizard-hooks's useCreateWizard/useWizard, a separate
package elsewhere in the monorepo for wizards that need per-step state,
resumability, or navigation helpers — not part of this design-system
package).
Each step accepts a title, an optional subtitle, an optional action
(a small link-style call-to-action, e.g. "Reset"), and complete, which
determines the checkmark/number styling relative to active.