# `m-stepper-inline`

An inline stepper is a horizontal navigation component that displays a sequence of steps in a linear fashion. It helps users understand their progress through a multi-step process by visually indicating the current step, completed steps, and upcoming steps. Inline steppers are typically used in forms, onboarding flows, and checkout processes to enhance user experience and provide clarity on the workflow.

## Props

| Name | Description | Type | Default |
|------|-------------|------|---------|
| `step` | Defines the currently active step.

- If a `number` is provided, it represents the 1-based position of the step
  in the `steps` array (e.g. `1` for the first step).
- If a `string` is provided, it must match the `id` of one of the steps. | `number` `string` | `$bindable(0)` |
| `steps` | Steps of the stepper inline. | `Array<{ id?: string; label: string; additionalinfo?: string; }>` | `$bindable([])` |

