Dialog

stable

Modal window for focused tasks and confirmations.

since v1.04.1 kB gzip

Preview

Code

3 members in workspace

Installation

CLI

Manual

npm

pnpm

bun

yarn

$ npx @strata/cli add dialog

Usage

React

Import only

import { Dialog, DialogTrigger, Button } from "@/components/strata";

<DialogTrigger>
  <Button>Invite member</Button>
  <Dialog title="Invite to workspace">…</Dialog>
</DialogTrigger>

Props

Prop	Type	Default
`isOpen` Controlled open state.	boolean	—
`size` Max width.	"sm" \| "md" \| "lg" \| "xl"	"md"
`isDismissable` Close on outside click.	boolean	true
`role` Use alertdialog for destructive confirmations.	"dialog" \| "alertdialog"	"dialog"

Accessibility

Tooltip

Short contextual label shown on hover or keyboard focus.

Was this page helpful?

Documented since v1.0 · components/dialog.mdx