{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "alert",
  "title": "Alert",
  "description": "An inline callout in a pane: a tinted box with a symbol, a title and a description.",
  "dependencies": [
    "class-variance-authority"
  ],
  "registryDependencies": [
    "@cupertinoui/macos-theme"
  ],
  "files": [
    {
      "path": "registry/macos/ui/alert.tsx",
      "content": "import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\n\n// An inline callout in a pane: a tinted rounded box with a symbol, a title\n// and a description.\nconst alertVariants = cva(\n  \"group/alert relative grid w-full gap-0.5 rounded-[10px] px-3 py-2.5 text-left text-mac-body has-data-[slot=alert-action]:pr-24 has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-2.5 *:[svg]:row-span-2 *:[svg]:translate-y-px *:[svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-mac-fill-quaternary text-mac-label shadow-[inset_0_0_0_1px_var(--mac-grid)] *:[svg]:text-mac-blue\",\n        warning: \"bg-mac-yellow/12 text-mac-label shadow-[inset_0_0_0_1px_color-mix(in_srgb,var(--mac-yellow)_35%,transparent)] *:[svg]:text-mac-orange\",\n        destructive: \"bg-mac-red/8 text-mac-red shadow-[inset_0_0_0_1px_color-mix(in_srgb,var(--mac-red)_30%,transparent)] *:data-[slot=alert-description]:text-mac-red/85 *:[svg]:text-current\",\n      },\n    },\n    defaultVariants: { variant: \"default\" },\n  }\n)\n\nfunction Alert({ className, variant, ...props }: React.ComponentProps<\"div\"> & VariantProps<typeof alertVariants>) {\n  return <div data-slot=\"alert\" role=\"alert\" className={cn(alertVariants({ variant }), className)} {...props} />\n}\n\nfunction AlertTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-title\"\n      className={cn(\"font-semibold group-has-[>svg]/alert:col-start-2 [&_a]:text-mac-link [&_a]:hover:underline\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDescription({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-description\"\n      className={cn(\"text-mac-body text-balance text-mac-label-secondary md:text-pretty [&_a]:text-mac-link [&_a]:hover:underline [&_p:not(:last-child)]:mb-3\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction AlertAction({ className, ...props }: React.ComponentProps<\"div\">) {\n  return <div data-slot=\"alert-action\" className={cn(\"absolute top-2 right-2\", className)} {...props} />\n}\n\nexport { Alert, AlertAction, AlertDescription, AlertTitle }\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}