Skip to main content
Version: 1.x

@microsoft/fast-foundation > Dialog

Dialog class

A Switch Custom HTML Element. Implements the ARIA dialog.

  • The default slot for the dialog content

positioning-region - A wrapping element used to center the dialog and position the modal overlay

overlay - The modal dialog overlay

control - The dialog element

cancel - Fires a custom 'cancel' event when the modal overlay is clicked

close - Fires a custom 'close' event when the dialog is hidden

Signature:
export declare class Dialog extends FoundationElement 

Properties

PropertyModifiersTypeDescription
ariaDescribedbystringThe id of the element describing the dialog.
ariaLabelstringThe label surfaced to assistive technologies.
ariaLabelledbystringThe id of the element labeling the dialog.
hiddenbooleanThe hidden state of the element.
modalbooleanIndicates the element is modal. When modal, user mouse interaction will be limited to the contents of the element by a modal overlay. Clicks on the overlay will cause the dialog to emit a "dismiss" event.
trapFocusbooleanIndicates that the dialog should trap focus.

Methods

MethodModifiersDescription
hide()The method to hide the dialog.
show()The method to show the dialog.