Dialog is a low-level primitive that helps achieve ecosystem-agnostic, fully accessible dialogs that can be styled as needed.
A dialog consists of a container element and an optional title. useDialog handles exposing this to assistive technology using ARIA. It can be combined with other primitives to create modal dialogs, popovers, and other types of overlays.
Import
import {Dialog} from '@fuegokit/react'
Usage
Accessibility
If a dialog does not have a visible title element, an aria-label or aria-labelledby prop must be passed instead to identify the element to assistive technology.
The dialog's title is used for aria-labelledby, and the dialog's description is used for aria-describedby.
The aria-modal="true" attribute is used to inform screen readers that the rest of the content on the page is inert.