"use client"
import {
Dialog,
DialogBody,
DialogClose,
DialogFooter,
DialogHeader,
DialogTrigger,
} from "@/components/ui/preskok-ui/dialog"
export function DialogPreskokDemo() {
return (
<DialogTrigger>
<button className="bg-primary text-primary-foreground rounded-md px-3 py-1.5">
Open dialog
</button>
<Dialog>
<DialogHeader title="Dialog title" description="Optional description" />
<DialogBody>Content inside the dialog.</DialogBody>
<DialogFooter>
<DialogClose>Close</DialogClose>
</DialogFooter>
</Dialog>
</DialogTrigger>
)
}
Installation
pnpmnpmyarnbunpnpm dlx @preskok-org/ui@latest add dialog
Usage
import {
Dialog,
DialogBody,
DialogFooter,
DialogHeader,
DialogTrigger,
} from "@/registry/preskok/ui/preskok-ui/dialog"
export function Example() {
return (
<DialogTrigger>
<button>Open dialog</button>
<Dialog>
<DialogHeader title="Dialog title" description="Optional description" />
<DialogBody>Content</DialogBody>
<DialogFooter>
<button slot="close">Close</button>
</DialogFooter>
</Dialog>
</DialogTrigger>
)
}Components
- Dialog: root
- DialogTrigger, DialogHeader, DialogBody, DialogFooter