Open modal dialogs

At a glanceCopy Anchor Link

• Who: Developers interrupting the flow for focused input or decisions.
• What: Accessible modal dialogs (trigger, content, title, footer) with focus trap and Escape.
• Use when: For short tasks that need full attention (confirm, edit one thing).
• Avoid when: For destructive one-click confirms — use ConfirmDialog instead; for long forms use a page.
• See also: Confirm destructive actions, Slide in a drawer panel

PreviewCopy Anchor Link

InstallCopy Anchor Link

pnpm add @zedtech/zedkit-ui

Latest: 0.3.0 (via changesets).

ExampleCopy Anchor Link

import { Button, Dialog, DialogContent, DialogTitle, DialogTrigger } from "@zedtech/zedkit-ui";
<Dialog>
  <DialogTrigger asChild><Button>Open</Button></DialogTrigger>
  <DialogContent><DialogTitle>Details</DialogTitle></DialogContent>
</Dialog>

Wraps: @radix-ui/react-dialog