Overlays

The Modal component implements comprehensive accessibility features following WAI-ARIA dialog patterns. A focus trap ensures that pressing Tab cycles focus only through interactive elements within the modal, preventing focus from escaping to background content. When the modal closes, focus is restored to the element that triggered it, maintaining the user's place in the document.

Pressing the Escape key closes the modal by default, providing a consistent keyboard dismissal mechanism. The modal sets aria-modal="true" on the dialog element, which signals to assistive technologies that content behind the modal is inert. Body scroll lock prevents the background page from scrolling while the modal is open.

The modal title is linked to the dialog via aria-labelledby, ensuring screen readers announce the modal's purpose when it opens. All interactive elements within the modal, including the close button, form fields, and action buttons, are fully keyboard accessible.