WAI-ARIA recommends that role="dialog" be used if the dialog expects input (such as text input), This can be changed using the role attribute. This can be observed by inspecting the DOM: Users can change the dialog dimensions using style attributes:īy default, the role will be set to dialog. In most cases, you will want to use the default height:auto, since this will automatically adjust the height based on the content. The default dialog dimensions are the following: The JET Dialog can be closed with keyboard actions:ĭialog dimensions, including height, width, min-width, max-width, min-height and max-height are defined with css variables. Upon closing a dialog, focus is automatically returned to the element that had focus when the dialog was opened. Modal dialogs additionally prevent mouse users from clicking on elements outside of the dialog. While open, the dialog widget ensures that tabbing cycles focus between elements within the dialog itself, not elements outside of it. The first :tabbable element within the dialog footer.The first :tabbable element within the dialog body.The first element within the dialog with the autofocus attribute.Upon opening a dialog, focus is automatically moved to the first item that matches the following: If the content length exceeds the maximum height, a scrollbar will automatically appear.Ī bottom button bar and semi-transparent modal overlay layer are common options that can be added. Dialogs can also be resized by dragging on edges or corners of the dialog component. The dialog window can be moved by dragging on the title area, and closed with the 'x' icon (by default). DataGridProviderUpdateOperationEventDetailĭescription: Themeable, WAI-ARIA-compliant dialog component.Ī dialog is a floating window that typically contains a title bar and a content area.DataGridProviderRemoveOperationEventDetail.DataGridProviderRefreshOperationEventDetail.DataGridProviderAddOperationEventDetail.BufferingDataProviderSubmittableChangeEvent.
0 kommentar(er)
