Stepper
IzzyBlazor.Stepper in the IzzyBlazor.Core package, generated from the 0.1.0-alpha.17 assembly
and its doc comments.
Properties (6)
ChildContentRenderFragment?The Steps, in order.
Currentint = 1The current step, counting from 1. Steps before it show as done. Past the last step, every step is done; 0 means none has started.
OrientationOrientation = Orientation.HorizontalA row (the default) or a column. On phones a row shows only the current step's label; the other steps are markers, and a finished step with an Href is still a link on its marker.
Labelstring? = "Progress"The list's accessible name. Defaults to "Progress".
CompletedLabelstring? = "(completed)"Read after a finished step's label, in place of its check mark. Defaults to "(completed)".
SizeControlSize = ControlSize.MdThe marker and text size. Defaults to ControlSize.Md.
Plus 16 item props and 4 common props.
Show them hereEvents (0)
No events.
Parts (1)
Components written inside Stepper, documented here with it.
Step
One step in a Stepper: a numbered marker (a check once done), its label and an optional description. For a step that only sometimes applies, set Hidden rather than wrapping it in @if: Blazor renders a step added later after the others, which would number it out of order.
Labelstring?The step's name, such as "Shipping".
Descriptionstring?A muted line under the label.
Hrefstring?Makes the label a link, such as back to a finished step.
IconIconData?An icon in the marker in place of the number (until the step is done).
Plus 4 common props.
Types (2)
ControlSize
enumThe height of interactive controls. Shared by buttons and form fields, so a button and an input of the same size line up in a row.
| Value | Description |
|---|---|
Sm | 32px tall, small text. |
Md | 36px tall (the default). |
Lg | 44px tall, large text. For touch-first and marketing pages. |
Orientation
enumWhether items run across or down.
| Value | Description |
|---|---|
Vertical | Top to bottom. |
Horizontal | Side by side, wrapping when space runs out. |