# r-stepper A progress indicator showing a sequence of steps with completed, active, and pending states. Example ``` Personal details Payment Confirmation ``` ## class: `RStepper`, `r-stepper` ### Fields | Name | Privacy | Type | Default | Description | Inherited From | | --------------------- | ------- | -------- | ------------- | -------------------------------------------------------------- | -------------- | | `completeSteps` | | `number` | `0` | | | | `completed` | | `number` | `0` | Complete steps. Default value 0 | | | `completedStepsLabel` | | `string` | `'Completed'` | Label for completed steps for screen reader users. | | | `label` | | `string` | | Label for the stepper for screen reader users. | | | `total` | | `number` | | Total number of steps. Used when no slot-based steps provided. | | ### Attributes | Name | Field | Inherited From | | ----------------------- | ------------------- | -------------- | | `complete-steps` | completeSteps | | | `completed` | completed | | | `completed-steps-label` | completedStepsLabel | | | `label` | label | | | `total` | total | | ### Slots | Name | Description | | ---- | ---------------------------------------------- | | | Stepper step items (`r-stepper-item` elements) |

---

## Exports | Kind | Name | Declaration | Module | Package | | --------------------------- | ----------- | ----------- | ------ | ------- | | `js` | `RStepper` | RStepper | | | | `custom-element-definition` | `r-stepper` | RStepper | | |