PhiaUi.Components.StepperNav (phia_ui v0.1.17)

Copy Markdown View Source

Visual step progress indicator for onboarding, checkout, and wizard flows.

Two components:

Summary

Functions

Renders a step progress indicator container.

Renders an individual step inside stepper_nav.

Functions

stepper_nav(assigns)

Renders a step progress indicator container.

Attributes

  • orientation (:atom) - Defaults to :horizontal. Must be one of :horizontal, or :vertical.
  • variant (:atom) - Defaults to :default. Must be one of :default, :dots, or :progress.
  • current_step (:integer) (required)
  • class (:string) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • inner_block (required) - stepper_nav_item/1 children.

stepper_nav_item(assigns)

Renders an individual step inside stepper_nav.

Attributes

  • step (:integer) (required)
  • state (:atom) - Defaults to :pending. Must be one of :pending, :active, :complete, or :error.
  • on_click (:string) - phx-click event for non-linear navigation. Defaults to nil.
  • disabled (:boolean) - Defaults to false.
  • class (:string) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • inner_block (required) - Step label text.
  • description - Optional subtitle.