Component Blueprints
Metupy provides responsive, zero-JS configuration UI blueprints ready for use.
1. Badges & Buttons
Primary Success Danger Secondary
python
from metupy.components_blueprint import Badge, Button
badge = Badge("Success", type="success", rounded=True)
btn = Button(text="Documentation", icon="fa-solid fa-book", href="/getting_started")
2. Alerts & Callouts
System Updated
Version v0.1.0 is stable and ready for production.
Navigation Tip
Use keyboard shortcuts for quick search navigation.
python
from metupy.components_blueprint import Alert, Callout
page += Alert(title="System Updated", message="Metupy v0.1.0 is stable.", type="success")
page += Callout(title="Navigation Tip", message="Use keyboard shortcuts.", type="tip")
3. Interactivity (Accordion, Tabs & Modal)
Modal Dialog
This content is rendered inside the Metupy modal blueprint.
python
from metupy.components_blueprint import Accordion, Modal
faq = Accordion([{"title": "Feature 1", "content": "Zero Config"}])
modal = Modal(id_name="my_modal", title="Modal Title", content="Body text", trigger_text="Open Modal")
4. Data Tables & Steps
| Parameter | Type | Description |
|---|---|---|
title | str | Main page title |
type | str | Theme type (info, success, danger, warning) |
1
Step 1
Import components from
metupy.components_blueprint2
Step 2
Append to page instance using
page += componentpython
from metupy.components_blueprint import Table, Steps
table = Table(headers=["Header 1", "Header 2"], rows=[["Val 1", "Val 2"]])
steps = Steps([{"title": "Step 1", "desc": "Overview explanation"}])