ComponentsDialog
Dialog
The Dialog component is a powerful and highly customizable tool for creating dialog windows, also known as modals, in your application. It includes essential elements such as triggers, content, and close triggers.
The Dialog component is a powerful and highly customizable tool for creating dialog windows, also known as modals, in your application. It includes essential elements such as triggers, content, and close triggers.
API reference docs for the component. Learn about the props, CSS, and other APIs of this exported module.
string
Human readable label for the dialog, in event the dialog title is not rendered
boolean
Whether to close the dialog when the escape key is pressed
boolean
Whether to close the dialog when the outside is clicked
'ltr' | 'rtl'
The document's text/writing direction.
HTMLElement | (() => MaybeElement)
Element to receive focus when the dialog is closed
() => ShadowRoot | Node | Document
A root node to correctly resolve document in custom environments. E.x.: Iframes, Electron.
string
The unique identifier of the machine.
Partial<{ trigger: string container: string backdrop: string content: string closeTrigger: string title: string description: string }>
The ids of the elements in the dialog. Useful for composition.
HTMLElement | (() => MaybeElement)
Element to receive focus when the dialog is opened
boolean
Whether to prevent pointer interaction outside the element and hide all content below it
VoidFunction
Callback to be invoked when the escape key is pressed
(details: OpenChangeDetails) => void
Callback to be invoked when the dialog is opened or closed
VoidFunction
Callback to be invoked when the outside is clicked
boolean
Whether the dialog is open
boolean
Whether to prevent scrolling behind the dialog when it's opened
boolean
Whether to restore focus to the element that had focus before the dialog was opened
'dialog' | 'alertdialog'
The dialog's role
boolean
Whether to trap focus inside the dialog when it's opened
Dict<any>
() => void
Function to close the dialog
Dict<any>
Dict<any>
Dict<any>
Dict<any>
boolean
Whether the dialog is open
() => void
Function to open the dialog
Dict<any>
Dict<any>
boolean
Whether to enable lazy mounting. Defaults to `false`.
() => void
boolean
boolean
Whether to unmount on exit. Defaults to `false`.
boolean
Whether to enable lazy mounting. Defaults to `false`.
() => void
boolean
boolean
Whether to unmount on exit. Defaults to `false`.