A component that represents a logical step as part of the ui5-wizard.
It is meant to aggregate arbitrary HTML elements that form the content of a single step.
Structure
- Each wizard step has arbitrary content.
- Each wizard step might have texts - defined by the
titleText and subtitleText properties.
- Each wizard step might have an icon - defined by the
icon property.
- Each wizard step might display a number in place of the
icon, when it's missing.
Usage
The ui5-wizard-step component should be used only as slot of the ui5-wizard component
and should not be used standalone.
Properties
titleText
| Description | Defines the titleText of the step.
Note: The text is displayed in the ui5-wizard navigation header. |
| Type | string | undefined |
| Default | undefined |
| Since | 1.0.0-rc.15 |
subtitleText
| Description | Defines the subtitleText of the step.
Note: the text is displayed in the ui5-wizard navigation header. |
| Type | string | undefined |
| Default | undefined |
| Since | 1.0.0-rc.15 |
icon
| Description | Defines the icon of the step.
Note: The icon is displayed in the ui5-wizard navigation header.
The SAP-icons font provides numerous options. See all the available icons in the Icon Explorer. |
| Type | string | undefined |
| Default | undefined |
disabled
| Description | Defines if the step is disabled. When disabled the step is displayed, but the user can't select the step by clicking or navigate to it with scrolling.
Note: Step can't be selected and disabled at the same time. In this case the selected property would take precedence. |
| Type | boolean |
| Default | false |
selected
| Description | Defines the step's selected state - the step that is currently active.
Note: Step can't be selected and disabled at the same time. In this case the selected property would take precedence. |
| Type | boolean |
| Default | false |
branching
| Description | When branching is enabled a dashed line would be displayed after the step, meant to indicate that the next step is not yet known and depends on user choice in the current step.
Note: It is recommended to use branching on the last known step and later add new steps when it becomes clear how the wizard flow should continue. |
| Type | boolean |
| Default | false |
Slots
default
| Description | Defines the step content. |
| Type | Array<Node> |
Events
No events available for this component.
Methods
No methods available for this component.
CSS Parts
No CSS parts available for this component.