Step Indicator Component
A step indicator component.
Properties
| Name | Type | Default | Description |
|---|---|---|---|
steps | number | 2 | The total number of steps. Defaults to 2. |
current | number | 0 | The current step index. Defaults to 0. |
CSS Parts
| Name | Description |
|---|---|
steps | The container for the steps. |
step | Each individual step. |
Check this link to learn how to use CSS parts for Step Indicator Component.
CSS Properties
| Token | Default | Description |
|---|---|---|
--tap-step-indicator-step-size | --tap-sys-spacing-5 | The size of each step. |
--tap-step-indicator-step-border-radius | --tap-sys-radius-full | The border radius of each step. |
--tap-step-indicator-step-border-color | --tap-sys-color-surface-primary | The border color of each step. |
--tap-step-indicator-step-background-color | --tap-sys-color-border-primary | The background color of each step. |
Events
| Name | Description |
|---|---|
tap-step-indicator-change | Step indicator change event |