Modal
Accessible dialog. Open/close state managed by $store.modals. Load content dynamically via HTMX or use inline.
Confirm Action
This action cannot be undone.
Are you sure you want to delete this item? All associated data will be permanently removed.
page.templ
<!-- Trigger -->
<button @click="$store.modals.open('demo')" class="...">Open Modal</button>
<!-- Modal -->
@modal.Modal(modal.Props{
ID: "demo",
Title: "Confirm Action",
Description: "This action cannot be undone.",
Size: modal.SizeMD,
}) {
@modal.Body() {
<p>Are you sure you want to delete this item?</p>
}
@modal.Footer() {
@button.Button(button.Props{
Variant: button.VariantGhost,
Attrs: templ.Attributes{"@click": "$store.modals.close('demo')"},
}) { Cancel }
@button.Button(button.Props{Variant: button.VariantDestructive}) { Delete }
}
}