Dialog
Beta notice: This page is being built.Edit on GitHub(opens in new tab)
Dialog defaults to the Platform's 960px-wide, 560px-high frame, reduced to fit shorter viewports. Set variant to fullscreen to fill about 95% of the screen, including over Platform navigation. Fullscreen keeps Solution content sandboxed and temporarily blocks the surrounding Platform controls. Closing it restores the View layout without losing state. A title adds a visible header; otherwise only the close control is shown. The gap between title and content defaults to spacing step 3, matching Stack and Grid. Escape and the close button dismiss it; clicking the backdrop does not. The body scrolls while the header stays visible.
This is a LongLink-specific component.
Example
Properties
| Dialog - Properties |
|---|
children Dialog content.ReactNode |
title Shows a dialog header when a title is provided.string |
variant Standard uses the fixed frame. Fullscreen fills about 95% of the screen, including over Platform navigation."standard" | "fullscreen" |
isOpen Whether the dialog is open.boolean |
onOpenChange Callback when dialog visibility changes.(open: boolean) => void |
gap Spacing between the title and content; defaults to 3.0 | 0.5 | 1 | 1.5 | 2 | 3 | 4 | 5 | 6 | 8 | 10 |