API REFERENCE · OVERLAYS
<dj-dialog>
A modal dialog. Slots: title, default (content), actions. Locks body scroll while open, closes on Escape and the close button, and on underlay click unless modal. role="alertdialog" is always modal. Restores focus to the previously focused element on close. Emits dj-close. Parts: underlay, dialog, title, close, content, actions.
npm install @dojo-ng/dialog
import "@dojo-ng/dialog";Properties
| Property | Attribute | Type | Default |
|---|---|---|---|
open |
open reflected |
boolean |
false |
closeable |
closeable |
boolean |
true |
modal |
modal |
boolean |
false |
underlay |
underlay |
boolean |
true |
role |
role reflected |
"dialog""alertdialog" |
"dialog" |
closeText |
close-text |
string |
None |
Events
dj-close
Slots
| Slot | Description |
|---|---|
title | |
| Default slot | content |
actions |
CSS parts
Style these with dj-dialog::part(name).
underlaydialogtitleclosecontentactions
CSS custom properties
| Property | Default | Description |
|---|---|---|
--dj-dialog-z-index | 941 | Stacking order of the dialog. |
--dj-dialog-underlay-z-index | 940 | Stacking order of the dialog underlay (scrim). |
Methods
close()