{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "alert-dialog",
  "title": "Alert dialog",
  "description": "A confirmation modal. Initial focus lands on Cancel regardless of action order, unless initialFocus is supplied. Actions remain ordinary buttons so an asynchronous operation can keep the dialog open. Destructive confirmations name the consequence in their title or description.",
  "dependencies": [
    "@base-ui/react@1.9.0"
  ],
  "registryDependencies": [
    "@waimakers/utils",
    "@waimakers/theme",
    "@waimakers/button",
    "@waimakers/dialog"
  ],
  "files": [
    {
      "path": "src/components/ui/alert-dialog.tsx",
      "content": "import * as React from \"react\";\nimport { AlertDialog as AlertDialogPrimitive } from \"@base-ui/react/alert-dialog\";\nimport { cn } from \"../../lib/utils\";\n\nimport { Button } from \"./button\";\nimport { DialogContent, DialogOverlay } from \"./dialog\";\n\nfunction AlertDialog({ ...props }: AlertDialogPrimitive.Root.Props) {\n  return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />;\n}\n\nfunction AlertDialogTrigger({ ...props }: AlertDialogPrimitive.Trigger.Props) {\n  return <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />;\n}\n\nfunction AlertDialogPortal({ ...props }: AlertDialogPrimitive.Portal.Props) {\n  return <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />;\n}\n\nfunction AlertDialogOverlay(props: AlertDialogPrimitive.Backdrop.Props) {\n  return <DialogOverlay data-slot=\"alert-dialog-overlay\" {...props} />;\n}\n\nfunction AlertDialogContent({\n  className,\n  size = \"default\",\n  ref,\n  initialFocus,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Popup> & {\n  size?: \"default\" | \"sm\";\n}) {\n  const popupRef = React.useRef<HTMLDivElement>(null);\n  const setPopupRef = React.useCallback(\n    (element: HTMLDivElement | null) => {\n      popupRef.current = element;\n      if (typeof ref === \"function\") {\n        return ref(element);\n      }\n      if (ref) {\n        ref.current = element;\n      }\n    },\n    [ref],\n  );\n  return (\n    <DialogContent\n      ref={setPopupRef}\n      data-slot=\"alert-dialog-content\"\n      data-size={size}\n      showCloseButton={false}\n      initialFocus={\n        initialFocus ??\n        (() =>\n          popupRef.current?.querySelector<HTMLElement>(\n            '[data-slot=\"alert-dialog-cancel\"]:not(:disabled)',\n          ) ?? true)\n      }\n      className={cn(\"group/alert-dialog-content\", size === \"sm\" && \"max-w-sm\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-header\"\n      className={cn(\"flex flex-col items-start gap-1.5\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      className={cn(\"flex flex-col-reverse gap-2 sm:flex-row sm:justify-end\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogMedia({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-media\"\n      className={cn(\n        \"mb-2 inline-flex size-10 items-center justify-center rounded-md bg-muted [&_svg]:size-6\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {\n  return (\n    <AlertDialogPrimitive.Title\n      data-slot=\"alert-dialog-title\"\n      className={cn(\"font-display text-lg font-bold tracking-tight\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {\n  return (\n    <AlertDialogPrimitive.Description\n      data-slot=\"alert-dialog-description\"\n      className={cn(\n        \"text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogAction({ className, ...props }: React.ComponentProps<typeof Button>) {\n  return (\n    <Button type=\"button\" data-slot=\"alert-dialog-action\" className={cn(className)} {...props} />\n  );\n}\n\nfunction AlertDialogCancel({\n  className,\n  variant = \"outline\",\n  size = \"default\",\n  ...props\n}: AlertDialogPrimitive.Close.Props &\n  Pick<React.ComponentProps<typeof Button>, \"variant\" | \"size\">) {\n  return (\n    <AlertDialogPrimitive.Close\n      data-slot=\"alert-dialog-cancel\"\n      className={cn(className)}\n      render={<Button type=\"button\" variant={variant} size={size} />}\n      {...props}\n    />\n  );\n}\n\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogMedia,\n  AlertDialogOverlay,\n  AlertDialogPortal,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n};\n",
      "type": "registry:ui",
      "target": "components/ui/alert-dialog.tsx"
    }
  ],
  "type": "registry:ui"
}