Skip to content
Paramanu v0.1.0-alpha.0

Dialog

Dialog renders a modal overlay with role="dialog", aria-modal="true", focus trapping, backdrop click, and escape key handling.

Basic Usage

import { Dialog, DialogHeader, DialogBody, DialogFooter } from "@paramanu/overlays-react"


export default function App() {
return (
  <Dialog open onClose={() => {}} size="md">
    <DialogHeader>Dialog Title</DialogHeader>
    <DialogBody>Content here.</DialogBody>
    <DialogFooter><button>Close</button></DialogFooter>
  </Dialog>
)
}
<div class="pm-dialog pm-dialog--md" role="dialog" aria-modal="true">
<div class="pm-dialog__header">Dialog Title</div>
<div class="pm-dialog__body">Content here.</div>
<div class="pm-dialog__footer"><button>Close</button></div>
</div>