PtahUi.Components.Steps (PtahUI v0.1.0)

Copy Markdown View Source

Steps component for showing a list of steps in a process.

Example

<.steps>
  <:item color="primary">Register</:item>
  <:item color="primary">Choose plan</:item>
  <:item>Purchase</:item>
  <:item>Receive Product</:item>
</.steps>

Summary

Functions

steps(assigns)

Attributes

  • direction (:string) - Layout direction. Defaults to "horizontal".
  • class (:string) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • item (required) - A single step node. Accepts attributes:
    • color (:string) - Marks step as completed with a color: primary, secondary, accent, info, success, warning, error, neutral.
    • content (:string) - Custom text or symbol inside the circle (overrides step number).
    • icon (:string) - Hero icon name inside the step circle.
    • class (:string)