Skip to main content
Dialogs display content in a modal overlay that focuses user attention. Like Popover, the first child becomes the trigger and the remaining children form the dialog body. An optional title and description render in the dialog header.

Basic Usage

Confirmation Pattern

Dialogs work well for destructive actions that need explicit confirmation before proceeding.

API Reference

Dialog Parameters

title
str | None
default:"None"
Dialog header title.
description
str | None
default:"None"
Dialog header description text.
css_class
str | None
default:"None"
Additional Tailwind CSS classes.

Protocol Reference

Dialog
{
  "type": "Dialog",
  "children?": "[Component]",
  "title?": "string",
  "description?": "string",
  "cssClass?": "string"
}
For the complete protocol schema, see Dialog.