{
  "name": "alert-dialog",
  "type": "registry:ui",
  "title": "Alert Dialog",
  "description": "Alert Dialog asks users to confirm a blocking or destructive decision before the application continues.",
  "registryDependencies": [
    "@siteplane/base"
  ],
  "dependencies": [
    "@base-ui/react@1.5.0"
  ],
  "files": [
    {
      "path": "src/components/ui/alert-dialog.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\n\nimport { AlertDialog as AlertDialogPrimitive } from \"@base-ui/react/alert-dialog\";\nimport type React from \"react\";\nimport { cn } from \"@/lib/utils\";\nimport { SiteplaneUIPortalScope } from \"@/components/ui/siteplane-provider\";\nimport {\n  overlayBackdropClassName,\n  overlayDialogPopupClassName,\n  overlayDialogPopupMobileStickClassName,\n  overlayViewportClassName,\n  overlayViewportMobileStickClassName,\n} from \"@/components/ui/overlay-shared\";\n\nexport const AlertDialogCreateHandle: typeof AlertDialogPrimitive.createHandle =\n  AlertDialogPrimitive.createHandle;\n\nexport const AlertDialog: typeof AlertDialogPrimitive.Root =\n  AlertDialogPrimitive.Root;\n\nexport const AlertDialogPortal: typeof AlertDialogPrimitive.Portal =\n  AlertDialogPrimitive.Portal;\n\nexport function AlertDialogTrigger(\n  props: AlertDialogPrimitive.Trigger.Props,\n): React.ReactElement {\n  return (\n    <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />\n  );\n}\n\nexport function AlertDialogBackdrop({\n  className,\n  ...props\n}: AlertDialogPrimitive.Backdrop.Props): React.ReactElement {\n  return (\n    <AlertDialogPrimitive.Backdrop\n      className={cn(overlayBackdropClassName, className)}\n      data-slot=\"alert-dialog-backdrop\"\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogViewport({\n  className,\n  ...props\n}: AlertDialogPrimitive.Viewport.Props): React.ReactElement {\n  return (\n    <AlertDialogPrimitive.Viewport\n      className={cn(overlayViewportClassName, className)}\n      data-slot=\"alert-dialog-viewport\"\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogPopup({\n  className,\n  bottomStickOnMobile = true,\n  portalProps,\n  ...props\n}: AlertDialogPrimitive.Popup.Props & {\n  bottomStickOnMobile?: boolean;\n  portalProps?: AlertDialogPrimitive.Portal.Props;\n}): React.ReactElement {\n  return (\n    <AlertDialogPortal {...portalProps}>\n      <SiteplaneUIPortalScope>\n        <AlertDialogBackdrop />\n        <AlertDialogViewport\n          className={cn(\n            bottomStickOnMobile && overlayViewportMobileStickClassName,\n          )}\n        >\n          <AlertDialogPrimitive.Popup\n            className={cn(\n              overlayDialogPopupClassName,\n              bottomStickOnMobile && overlayDialogPopupMobileStickClassName,\n              className,\n            )}\n            data-slot=\"alert-dialog-popup\"\n            {...props}\n          />\n        </AlertDialogViewport>\n      </SiteplaneUIPortalScope>\n    </AlertDialogPortal>\n  );\n}\n\nexport function AlertDialogHeader({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">): React.ReactElement {\n  return (\n    <div\n      className={cn(\n        \"flex flex-col gap-2 p-6 text-center max-sm:pb-4 sm:text-left\",\n        className,\n      )}\n      data-slot=\"alert-dialog-header\"\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogFooter({\n  className,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  variant?: \"default\" | \"bare\";\n}): React.ReactElement {\n  return (\n    <div\n      className={cn(\n        \"flex flex-col-reverse gap-2 px-6 sm:flex-row sm:justify-end sm:rounded-b-[calc(var(--radius-2xl)-1px)]\",\n        variant === \"default\" && \"border-t bg-muted/72 py-4\",\n        variant === \"bare\" && \"pb-6\",\n        className,\n      )}\n      data-slot=\"alert-dialog-footer\"\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogTitle({\n  className,\n  ...props\n}: AlertDialogPrimitive.Title.Props): React.ReactElement {\n  return (\n    <AlertDialogPrimitive.Title\n      className={cn(\n        \"font-heading font-semibold text-xl leading-none\",\n        className,\n      )}\n      data-slot=\"alert-dialog-title\"\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogDescription({\n  className,\n  ...props\n}: AlertDialogPrimitive.Description.Props): React.ReactElement {\n  return (\n    <AlertDialogPrimitive.Description\n      className={cn(\"text-muted-foreground text-sm\", className)}\n      data-slot=\"alert-dialog-description\"\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogClose(\n  props: AlertDialogPrimitive.Close.Props,\n): React.ReactElement {\n  return (\n    <AlertDialogPrimitive.Close data-slot=\"alert-dialog-close\" {...props} />\n  );\n}\n\nexport {\n  AlertDialogPrimitive,\n  AlertDialogBackdrop as AlertDialogOverlay,\n  AlertDialogPopup as AlertDialogContent,\n};\n"
    },
    {
      "path": "src/components/ui/overlay-shared.ts",
      "type": "registry:ui",
      "content": "// Geteilte Shell-Klassen der zentrierten Overlays. Dialog, AlertDialog und\n// Command (CommandDialog) re-implementierten zuvor identische Backdrop-/Viewport-/\n// Popup-Strings. Jetzt liegt jede Klasse genau einmal hier, sodass eine Aenderung\n// alle Overlays gleichzeitig erreicht. Literale Strings -> Tailwind-Scan-sicher.\n\nimport { cn } from \"@/lib/utils\";\nimport { surfaceClassNames } from \"@/components/ui/surface\";\n\nexport const overlayBackdropClassName =\n  \"fixed inset-0 z-50 bg-black/32 backdrop-blur-sm transition-all duration-(--motion-duration-overlay) ease-(--motion-ease-apple-out) data-ending-style:opacity-0 data-starting-style:opacity-0\";\n\nexport const overlayViewportClassName =\n  \"fixed inset-0 z-50 grid grid-rows-[1fr_auto_3fr] justify-items-center p-4\";\n\nexport const overlayViewportMobileStickClassName =\n  \"max-sm:grid-rows-[1fr_auto] max-sm:p-0 max-sm:pt-12\";\n\n// Gemeinsame Popup-Chrome von Dialog + AlertDialog. Dialog ergaenzt `outline-none`\n// (es traegt den schliessbaren Close-Button), AlertDialog nicht.\nexport const overlayDialogPopupClassName = cn(\n  surfaceClassNames.overlay,\n  \"row-start-2 flex max-h-full min-h-0 w-full min-w-0 max-w-lg origin-center flex-col rounded-2xl opacity-[calc(1-var(--nested-dialogs))] siteplane-dialog-motion will-change-transform before:rounded-[inherit] data-ending-style:opacity-0 data-starting-style:opacity-0 sm:scale-[calc(1-0.1*var(--nested-dialogs))] sm:data-ending-style:scale-98 sm:data-starting-style:scale-98\",\n);\n\nexport const overlayDialogPopupMobileStickClassName =\n  \"max-sm:max-w-none max-sm:origin-bottom max-sm:rounded-none max-sm:border-x-0 max-sm:border-t max-sm:border-b-0 max-sm:data-ending-style:translate-y-4 max-sm:data-starting-style:translate-y-4 max-sm:before:hidden max-sm:before:rounded-none\";\n"
    }
  ],
  "categories": [
    "feedback"
  ],
  "docs": "# Alert Dialog\n\n> Siteplane UI release `0.1.1`.\n\n## Public Purpose\n\nAlert Dialog asks the user to confirm a blocking or destructive decision before\nthe application continues. Use Dialog for ordinary modal forms and Alert for\nnon-blocking inline feedback.\n\n## Import\n\n`import { AlertDialog, AlertDialogClose, AlertDialogCreateHandle, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogPopup, AlertDialogTitle, AlertDialogTrigger } from \"@/components/ui/alert-dialog\";`\n\n## Public API\n\n- Every composition uses `AlertDialogTrigger`, `AlertDialogPopup`,\n  `AlertDialogTitle`, `AlertDialogDescription`, and explicit cancel and\n  confirm actions.\n- `AlertDialogCreateHandle` supports one shared confirmation dialog with\n  detached triggers or imperative opening.\n- `AlertDialogPopup bottomStickOnMobile={false}` keeps the popup centered on\n  small screens instead of attaching it to the bottom edge.\n- `AlertDialogFooter variant=\"bare\"` removes the separated footer surface.\n\n## Public Motion\n\n- Backdrop, viewport, popup, and mobile positioning use the native Alert Dialog\n  motion and global reduced-motion contract.\n- Do not add local durations, transforms, or motion wrappers.\n\n## Public Accessibility\n\n- The component renders `role=\"alertdialog\"` with modal focus management,\n  Escape handling, and focus restoration.\n- Every alert dialog requires a concise `AlertDialogTitle` and\n  `AlertDialogDescription`.\n- Cancel and confirm actions must be real buttons. Use `AlertDialogClose` or\n  controlled state to close the dialog.\n- In dirty-state flows, keep the original dialog open until the user confirms\n  that it may be discarded.\n\n## Public Agent Guidance\n\n- Reserve Alert Dialog for decisions that block progress or may cause data loss.\n- Use Dialog for non-destructive modal forms, Alert for persistent inline\n  feedback, and Toast for transient feedback.\n- Preserve the native popup, footer, focus, and dismissal behavior.\n\n## Public Links\n\n- [Documentation and preview](https://ui.siteplane.io/docs/components/feedback/alert-dialog)\n\n- [Registry source](https://ui.siteplane.io/r/alert-dialog.json)\n",
  "meta": {
    "siteplane:agentContractVersion": 1,
    "siteplane:docs": "https://ui.siteplane.io/docs/components/feedback/alert-dialog",
    "siteplane:releaseVersion": "0.1.1",
    "siteplane:sourceOwned": true
  },
  "devDependencies": []
}
