ModalWindow

A modal dialog shell. Build a widget into its body, or give it markup. For a window people can move, resize or keep open beside the page, use Window.

from wapyt import Form, FormConfig, ModalConfig, ModalWindow

modal = ModalWindow(ModalConfig(title="Add item", width=420, height=460, dispose_on_close=True))
form = Form(FormConfig(fields=[...], submit_text="Add", cancel_text="Cancel"),
            container=modal.body)
form.on_cancel(lambda _values: modal.close())
modal.show()
form.focus_first()

Config

ModalConfig(title, width=520, height=360, closable=True, dispose_on_close=False). width and height take pixels or any CSS size.

• The height is honest. Content taller than it scrolls inside the body instead of growing the dialog, so size it for the fields plus the button row.
• dispose_on_close=True makes ×, Escape and a backdrop click remove the dialog (close()) instead of hiding it. Use it for dialogs built per use; leave it off for one built once and shown repeatedly.

Methods

Method
body (property)	The content element. Mount widgets here with container=modal.body
set_content(component)	Replaces the body, destroying anything mounted in it
set_title(title)
show() / hide()	hide() leaves the overlay in the DOM
close()	Removes the dialog and its Escape listener; safe to call twice
is_visible()

Events

Added in #41.

modal.on_hide(lambda e: save_draft() if e["reason"] != "code" else None)
modal.on_close(lambda e: self.open_modals.remove(modal))

Event	Payload
on_show	{} when it becomes visible (not again while it already is)
on_hide	{reason} when it stops being visible
on_close	{reason} when it is removed; nothing fires after it

reason is how it went away: "button" (the ×), "escape", "backdrop", or "code" (your own hide() / close()). With dispose_on_close=True a dismissal fires on_hide then on_close. There is no event that can stop a close: wapyt lets it happen and lets the app react.

Stacked modals: only the topmost visible one answers Escape, so one press closes one dialog.

The modal is mounted on <body>, outside any layout, and takes its font from --wapyt-font-family (Theming and Icons).

Not yet

No movable, resizable or non-modal windows; see the Roadmap. For alert, confirm and prompt dialogs, use Message.