Steps
Steps are used to guide users through complex processes, making them easier and more intuitive.
Properties
Steps
This property lets you add and the steps. Every object represents a step.
{{
[
{ name: 'step 1', tooltip: 'some tooltip', id: 1},
{ name: 'step 2', tooltip: 'some tooltip', id: 2},
{ name: 'step 3', tooltip: 'some tooltip', id: 3},
{ name: 'step 4', tooltip: 'some tooltip', id: 4},
{ name: 'step 5', tooltip: 'some tooltip', id: 5}
]
}}
Current step
This property lets you select the current step you want to be highlighted.
Steps selectable
This property when disabled will disable selection of steps.
Events
Event | Description |
---|---|
On select | This event is fired whenever the user selects any step. |
Component Specific Actions (CSA)
There are currently no CSA (Component-Specific Actions) implemented to regulate or control the component.
Exposed Variables
Variables | Description | How To Access |
---|---|---|
currentStepId | This variable holds the id of the currently selected step on the step component. | Access the value dynamically using JS: {{components.steps1.currentStepId}} |