Skip to content

Dialog

Open .md
Live preview

Loading example…

Wraps DialogPrimitive.Root so focus is restored on close even when the dialog is opened in a controlled way, without its own DialogTrigger.

import { Dialog } from "@jcsoftdev/ui/overlays";

Single-component entry points tree-shake to just this component: @jcsoftdev/ui/overlays/dialog.

export const Default: Story = {
render: (args) => (
<Dialog>
<DialogTrigger asChild>
<Button variant="danger">Anular cita</Button>
</DialogTrigger>
<DialogContent {...args}>
<CancelBody />
</DialogContent>
</Dialog>
),
};

Source of the Storybook story.

This component declares no props of its own.

It also accepts the native props of the element or primitive it renders (for example className, id, aria-* and event handlers).

packages/ui/src/overlays/dialog/dialog.tsx