{
  "name": "dialog",
  "displayName": "Dialog",
  "type": "shadow",
  "isCustomElement": true,
  "tag": "l-dialog",
  "nativeTag": null,
  "selector": "l-dialog",
  "subItemOf": null,
  "summary": "A modal dialog rendered in the top layer via the native `<dialog>` element.\n\nOpen and close by toggling the `open` property (or the `--show` / `--hide`\nInvoker commands). There are no public `show()` / `close()` methods.",
  "status": "stable",
  "appearances": [],
  "import": {
    "css": null,
    "js": "luxen-ui/dialog"
  },
  "properties": [
    {
      "name": "title",
      "attribute": "title",
      "type": "string",
      "default": "''",
      "reflects": false,
      "description": "Dialog title rendered in the header and used as the dialog's accessible name."
    },
    {
      "name": "open",
      "attribute": "open",
      "type": "boolean",
      "default": "false",
      "reflects": true,
      "description": "Whether the dialog is open."
    },
    {
      "name": "lightDismiss",
      "attribute": "light-dismiss",
      "type": "boolean",
      "default": "false",
      "reflects": true,
      "description": "Close when the backdrop is clicked."
    },
    {
      "name": "withoutHeader",
      "attribute": "without-header",
      "type": "boolean",
      "default": "false",
      "reflects": true,
      "description": "Hide the header entirely (title and close slot)."
    }
  ],
  "attributes": [],
  "events": [
    {
      "name": "show",
      "description": "Fired when the dialog is about to open. Cancelable — call `event.preventDefault()` to keep it closed.",
      "cancelable": true
    },
    {
      "name": "after-show",
      "description": "Fired after the open animation completes. Not cancelable.",
      "cancelable": false
    },
    {
      "name": "hide",
      "description": "Fired when the dialog is about to close. Cancelable — call `event.preventDefault()` to keep it open.",
      "cancelable": true
    },
    {
      "name": "after-hide",
      "description": "Fired after the close animation completes. Not cancelable.",
      "cancelable": false
    }
  ],
  "methods": [],
  "slots": [
    {
      "name": "",
      "description": "Body content."
    },
    {
      "name": "title",
      "description": "Custom heading element. Overrides the default `<h2>` rendered from the `title` property. Also provides the dialog's accessible name."
    },
    {
      "name": "close",
      "description": "Close button (typically `<button class=\"l-close\">`)."
    },
    {
      "name": "footer",
      "description": "Footer actions."
    }
  ],
  "cssClasses": [],
  "cssParts": [
    {
      "name": "dialog",
      "description": "The native `<dialog>` element."
    },
    {
      "name": "header",
      "description": "The header wrapper containing the title and close slot."
    },
    {
      "name": "title",
      "description": "The dialog title heading."
    },
    {
      "name": "body",
      "description": "The body wrapper around the default slot."
    },
    {
      "name": "footer",
      "description": "The footer wrapper around the footer slot."
    }
  ],
  "cssProperties": [
    {
      "name": "--width",
      "default": "31rem",
      "description": "Dialog width."
    },
    {
      "name": "--border-radius",
      "default": "6px",
      "description": "Dialog border radius."
    },
    {
      "name": "--padding",
      "default": "1.5rem",
      "description": "Padding applied to the header, footer, and inline-padding of the body. Set to `0` to remove all internal spacing (e.g. for edge-to-edge media)."
    },
    {
      "name": "--show-duration",
      "default": "200ms",
      "description": "Open transition duration."
    },
    {
      "name": "--hide-duration",
      "default": "200ms",
      "description": "Close transition duration."
    },
    {
      "name": "--backdrop",
      "default": null,
      "description": "Backdrop color."
    },
    {
      "name": "--backdrop-blur",
      "default": "0",
      "description": "Backdrop blur amount (any CSS length). `0` means no blur; set e.g. `4px` for a subtle frost."
    }
  ],
  "commands": [
    {
      "name": "--show",
      "description": "Sets `open = true`."
    },
    {
      "name": "--hide",
      "description": "Sets `open = false`."
    }
  ],
  "examples": []
}
