The StepCount component is used to show users where they are within a sequence of a defined number of steps. It provides a clear visual reference for both the total number of steps and the specific step the user is currently viewing.
This helps set expectations, and guide users through multi-step workflows. StepCount supports two visual styles — textual and circular.
Variants
Variants contain different versions of the component depending on specific properties, such as state, size, colour, optional iconography, etc.
| Property | Values | Default |
|---|---|---|
| type Variant | textual | circular | textual |
| ✏️ totalSteps Text | string | 5 |
| ✏️ currentStep Text | string | 1 |
Help and support