ModalLayout Example

This page uses ModalLayout with default props: close button, backdrop, link-based close (navigate to /), and backdrop click to close.

Press Escape to close (navigates per closeBehavior). Click the X or the backdrop to close.

Usage variants

• Custom max width: Set maxWidth="max-w-6xl"
• Without close button: Set showCloseButton=
• Close with history.back(): Set closeBehavior="back"
• Custom header/footer: Use slot="header" and slot="footer"
• No backdrop close: Set closeOnBackdropClick=