Modal & Dialog

Modals display content over the page. There are two types: multi-functional modals and dialogs. Each has different styles and uses. Both are composed of a wm-modal-header, a wm-modal-footer, and variable content to display between them.

The modal component has no control over the content passed to it. Check the Notes tab to understand the implications (you might in particular experience unexpected behavior with scrolling).

For accessibility reasons, the component should always be rendered on the page, whether it is visible or not. The component itself should control whether the modal is displayed or not; you should NOT conditionally render the component. See the Notes sections for more information.