Dialog
A modal dialog that interrupts the user with important content and expects a response.
Installation
$ npx shadcn@latest add "/r/dialog.json"
Usage
With Form
Props
Dialog
| Prop | Type | Default | Description |
|---|
| open | boolean | - | The controlled open state. |
| defaultOpen | boolean | false | The initial open state. |
| onOpenChange | (open: boolean) => void | - | Callback when the open state changes. |
DialogTrigger
| Prop | Type | Default | Description |
|---|
| className | string | - | Additional CSS classes. Use buttonVariants() for button styling. |
DialogContent
| Prop | Type | Default | Description |
|---|
| className | string | - | Additional CSS classes. |
DialogHeader, DialogFooter
| Prop | Type | Default | Description |
|---|
| className | string | - | Additional CSS classes. |
DialogTitle
| Prop | Type | Default | Description |
|---|
| className | string | - | Additional CSS classes. |
DialogDescription
| Prop | Type | Default | Description |
|---|
| className | string | - | Additional CSS classes. |