# Stepper

Multi-step progress indicator. Horizontal (default) or vertical orientation; status (`complete`, `current`, `upcoming`) is derived per-step from `activeStep`.

[View examples](https://marsam.rahhal.app/components/stepper) · [Agent index](https://marsam.rahhal.app/llms.txt)

**Import:** `@rahhal/ui/stepper`

**Category:** `nav`

## Props

| prop | type | purpose |
| --- | --- | --- |
| steps | StepperStep[] | ordered list — { title, description?, icon? } |
| activeStep | number | 0-based index of the currently active step |
| orientation | horizontal | vertical | default \"horizontal\" |

## Notes

- Connector lines fill in as the user advances.
- For wizard navigation, pair with two `<Button>`s ("Back" / "Next") and toggle the active index from the parent.