animaltrack/docs/vendor/monsterui/api_ref/docs_steps.md

Steps API Reference

See Source

See Output

• Account Created
• Profile Setup
• Verification

[code]

def ex_steps2():
    return Steps(
        LiStep("Account Created", cls=StepT.primary),
        LiStep("Profile Setup", cls=StepT.neutral),
        LiStep("Verification", cls=StepT.neutral),
        cls="w-full")

[/code]

See Source

See Output

• Project Planning
• Design Phase
• Development
• Testing
• Deployment

[code]

def ex_steps3():
    return Steps(
    LiStep("Project Planning", cls=StepT.success, data_content="📝"),
    LiStep("Design Phase", cls=StepT.success, data_content="💡"),
    LiStep("Development", cls=StepT.primary, data_content="🛠️"),
    LiStep("Testing", cls=StepT.neutral, data_content="🔎"),
    LiStep("Deployment", cls=StepT.neutral, data_content="🚀"),
    cls=(StepsT.vertical, "min-h-[400px]"))

[/code]

API Docs

Steps

Source

[code]

Steps(*li, cls='', **kwargs) -> fastcore.xml.FT

[/code]

Creates a steps container

Params

• li Each Li represent a step (generally use LiStep)

• cls class for Steps (generally a StepsT option)

• kwargs

Returns: Ul(..., cls='steps')

---

StepsT

Options for Steps

Option	Value	Option	Value
vertical	steps-vertical	horizonal	steps-horizonal

LiStep

Source

[code]

LiStep(*c, cls='', data_content=None, **kwargs) -> fastcore.xml.FT

[/code]

Creates a step list item

Params

• c Description for Step that goes next to bubble (often text)

• cls Additional step classes (generally a StepT component)

• data_content Content for inside bubble (defaults to number, often an emoji)

• kwargs

Returns: Li(..., cls='step')

---

StepT

Step styles for LiStep

Option	Value	Option	Value	Option	Value
primary	step-primary	secondary	step-secondary	accent	step-accent
info	step-info	success	step-success	warning	step-warning
error	step-error	neutral	step-neutral