Step
<gstock-step>
|
GstockStep
API
Properties
| Name | Description | Reflects | Type | Default |
|---|---|---|---|---|
active
|
Draws the step in an active state. |
|
boolean
|
false
|
disabled
|
Disables the step and prevents selection. |
|
boolean
|
false
|
icon
|
Icon name of the step. |
|
string | undefined
|
-
|
panel
|
The name of the step panel this step is associated with. The panel must be located in the same step group. |
|
string
|
''
|
color
|
The color of the step. |
|
'primary' | 'secondary'
|
'primary'
|
download
|
Tells the browser to download the linked file as this filename. Only used when href is present.
|
string | undefined
|
-
|
|
href
|
When set, the underlying button will be rendered as an <a> with this href instead of a <div>.
|
string
|
''
|
|
rel
|
When using href, this attribute will map to the underlying link’s rel attribute. Unlike regular links, the
default is noreferrer noopener to prevent security exploits. However, if you’re using target to point to a
specific step/window, this will prevent that from working correctly. You can remove or change the default value by
setting the attribute to an empty string or a value of your choice, respectively.
|
string
|
'noreferrer noopener'
|
|
size
|
The size of the step. |
|
'small' | 'medium' | 'large'
|
'medium'
|
target
|
Tells the browser where to open the link. Only used when href is present.
|
'_blank' | '_parent' | '_self' | '_top'
|
-
|
|
updateComplete
|
A read-only promise that resolves when the component has finished updating. |
Learn more about attributes and properties .
Slots
| Name | Description |
|---|---|
default
|
The label of the step. |
badge
|
The badge of the step. |
Learn more about slots .
Methods
| Name | Description |
|---|---|
focus(
|
Sets focus to the step. |
blur(
)
|
Removes focus from the step. |
Learn more about methods .
CSS Parts
| Name | Description |
|---|---|
base
|
The component’s base wrapper. |
icon
|
The status icon of the step. |
badge
|
The status badge of the step. |
label
|
The label of the step. |
Learn more about CSS parts .
Dependencies
This component automatically imports the following dependencies.