Step progress for setup, onboarding, and multi-step flows.
WizardSteps communicates sequence and current progress without turning the flow into a large navigation system.
Current steps are exposed through aria-current.
<WizardSteps>
<WizardStep status="complete">Install</WizardStep>
<WizardStep status="current">Configure</WizardStep>
<WizardStep>Ship</WizardStep>
</WizardSteps>import { WizardStep, WizardSteps, StepperProgress } from "@froggdesign/enter-ui-react";Use vertical steps when labels are longer or the layout is narrow.
WizardSteps renders an ordered list. The current step receives aria-current="step"; avoid making completed state depend on color alone.
orientation: horizontal or vertical.WizardStep status: complete, current, or upcoming.StepperProgress and StepperProgressStep are aliases.Every exported component accepts className when it renders an element. EnterUI styles use .eui-* classes and --eui-* variables mapped from FroggDesign theme tokens.