Window¶
The Window widget is the frame of a dialog or drawer: its title bar, its close button and its body. You do not add it from the widget library. Every window you create starts with one, and it stays at the root of that window's content. It cannot be moved, copied, deleted or repeated.
See also Actions and Windows for how windows open and close, Button for the button that opens one, and Container for arranging the widgets inside.
Using it¶
Open a window from the Overlays list in the portal editor. Set the frame's Title, then drag widgets into the body as you would on a page. The title can show a window parameter, so a window opened for one order can say which order it is.
Order {$params.orderId}Small widgets such as a badge or a button can go in the title bar next to the heading. The window's size, its mode (dialog or drawer) and how it closes are set on the window itself in the Window ribbon tab, not on this widget. See Window settings.
Options¶
| Option | Values | Default | Description |
|---|---|---|---|
| Title | Any text or template | Window |
The heading in the title bar. Use {$params.name} to show a window parameter |
| Show title bar | On · Off | On | Off hides the title, anything placed in the title bar, and the close button |
| Show content | On · Off | On | Off hides the body |
| Show close button | On · Off | On | Only offered while the title bar is shown |
| Icon | An icon key | An X | The close button's icon. Only offered while the close button is shown |
| Theme | Per part | Theme default | Theme values for the Window, Header, Title, Close Button and Body parts. See Themes |
| Custom Style | CSS per part | Empty | Extra styling for the Window, Header, Body and Close Button |
Tips¶
A few things to keep in mind:
- The frame has two slots. Widgets in Title sit in the title bar next to the heading. Everything else goes in Content.
- The frame always fills the window, so it has no Box Style.
- The close button does nothing on the designer canvas. It works in the preview and the live portal.
- If you hide the close button, keep another way out: Close on Escape, Close on backdrop click, or a Button with the Close window action.