{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "camaleon-alert",
  "title": "Camaleon Alert",
  "description": "Alertas e notificações white-label para feedback, banners operacionais e status semântico.",
  "dependencies": [
    "class-variance-authority",
    "clsx",
    "tailwind-merge"
  ],
  "registryDependencies": [
    "camaleon-utils",
    "camaleon-button"
  ],
  "files": [
    {
      "path": "registry/ui/alert.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\n\nconst alertVariants = cva(\n  \"grid gap-3 rounded-[calc(var(--radius)*1.15)] border p-4 shadow-[0_14px_38px_-30px_hsl(var(--shadow-color))]\",\n  {\n    variants: {\n      tone: {\n        info: \"\",\n        success: \"\",\n        warning: \"\",\n        danger: \"\",\n      },\n      appearance: {\n        subtle: \"\",\n        outline: \"bg-background\",\n        solid: \"text-white\",\n      },\n    },\n    compoundVariants: [\n      {\n        tone: \"info\",\n        appearance: \"subtle\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--primary))_18%,white)] bg-[color-mix(in_srgb,hsl(var(--primary))_8%,white)] text-foreground\",\n      },\n      {\n        tone: \"info\",\n        appearance: \"outline\",\n        className: \"border-border/70 text-foreground\",\n      },\n      {\n        tone: \"info\",\n        appearance: \"solid\",\n        className: \"border-primary bg-primary\",\n      },\n      {\n        tone: \"success\",\n        appearance: \"subtle\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--success))_18%,white)] bg-[color-mix(in_srgb,hsl(var(--success))_9%,white)] text-foreground\",\n      },\n      {\n        tone: \"success\",\n        appearance: \"outline\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--success))_24%,white)] bg-background text-foreground\",\n      },\n      {\n        tone: \"success\",\n        appearance: \"solid\",\n        className: \"border-[hsl(var(--success))] bg-[hsl(var(--success))]\",\n      },\n      {\n        tone: \"warning\",\n        appearance: \"subtle\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--warning))_20%,white)] bg-[color-mix(in_srgb,hsl(var(--warning))_12%,white)] text-foreground\",\n      },\n      {\n        tone: \"warning\",\n        appearance: \"outline\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--warning))_28%,white)] bg-background text-foreground\",\n      },\n      {\n        tone: \"warning\",\n        appearance: \"solid\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--warning))_84%,black)] bg-[color-mix(in_srgb,hsl(var(--warning))_84%,black)]\",\n      },\n      {\n        tone: \"danger\",\n        appearance: \"subtle\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--danger))_18%,white)] bg-[color-mix(in_srgb,hsl(var(--danger))_8%,white)] text-foreground\",\n      },\n      {\n        tone: \"danger\",\n        appearance: \"outline\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--danger))_26%,white)] bg-background text-foreground\",\n      },\n      {\n        tone: \"danger\",\n        appearance: \"solid\",\n        className: \"border-[hsl(var(--danger))] bg-[hsl(var(--danger))]\",\n      },\n    ],\n    defaultVariants: {\n      tone: \"info\",\n      appearance: \"subtle\",\n    },\n  },\n);\n\nconst alertIconWrapVariants = cva(\n  \"inline-flex size-10 shrink-0 items-center justify-center rounded-full border\",\n  {\n    variants: {\n      tone: {\n        info: \"\",\n        success: \"\",\n        warning: \"\",\n        danger: \"\",\n      },\n      appearance: {\n        subtle: \"\",\n        outline: \"bg-background\",\n        solid: \"border-white/18 bg-white/14 text-white\",\n      },\n    },\n    compoundVariants: [\n      {\n        tone: \"info\",\n        appearance: \"subtle\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--primary))_12%,white)] bg-background/70 text-primary\",\n      },\n      {\n        tone: \"info\",\n        appearance: \"outline\",\n        className: \"border-border/70 bg-surface text-primary\",\n      },\n      {\n        tone: \"success\",\n        appearance: \"subtle\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--success))_18%,white)] bg-background/72 text-[hsl(var(--success))]\",\n      },\n      {\n        tone: \"success\",\n        appearance: \"outline\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--success))_24%,white)] bg-surface text-[hsl(var(--success))]\",\n      },\n      {\n        tone: \"warning\",\n        appearance: \"subtle\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--warning))_18%,white)] bg-background/72 text-[color-mix(in_srgb,hsl(var(--warning))_84%,black)]\",\n      },\n      {\n        tone: \"warning\",\n        appearance: \"outline\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--warning))_24%,white)] bg-surface text-[color-mix(in_srgb,hsl(var(--warning))_84%,black)]\",\n      },\n      {\n        tone: \"danger\",\n        appearance: \"subtle\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--danger))_18%,white)] bg-background/72 text-[hsl(var(--danger))]\",\n      },\n      {\n        tone: \"danger\",\n        appearance: \"outline\",\n        className:\n          \"border-[color-mix(in_srgb,hsl(var(--danger))_24%,white)] bg-surface text-[hsl(var(--danger))]\",\n      },\n    ],\n    defaultVariants: {\n      tone: \"info\",\n      appearance: \"subtle\",\n    },\n  },\n);\n\nexport interface AlertProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof alertVariants> {\n  title?: React.ReactNode;\n  description?: React.ReactNode;\n  icon?: React.ReactNode;\n  action?: React.ReactNode;\n}\n\nfunction Alert({\n  className,\n  tone,\n  appearance,\n  title,\n  description,\n  icon,\n  action,\n  children,\n  ...props\n}: AlertProps) {\n  const hasStructuredContent = title || description || icon || action;\n\n  return (\n    <div\n      className={cn(alertVariants({ tone, appearance }), className)}\n      role=\"alert\"\n      {...props}\n    >\n      {hasStructuredContent ? (\n        <div className=\"flex items-start gap-3\">\n          {icon ? (\n            <div className={cn(alertIconWrapVariants({ tone, appearance }))}>\n              {icon}\n            </div>\n          ) : null}\n\n          <div className=\"min-w-0 flex-1 space-y-1\">\n            {title ? (\n              <p\n                className={cn(\n                  \"text-sm font-semibold leading-6\",\n                  appearance === \"solid\" ? \"text-white\" : \"text-foreground\",\n                )}\n              >\n                {title}\n              </p>\n            ) : null}\n            {description ? (\n              <p\n                className={cn(\n                  \"text-sm leading-6\",\n                  appearance === \"solid\" ? \"text-white/88\" : \"text-muted-foreground\",\n                )}\n              >\n                {description}\n              </p>\n            ) : null}\n            {children}\n          </div>\n\n          {action ? <div className=\"shrink-0\">{action}</div> : null}\n        </div>\n      ) : (\n        children\n      )}\n    </div>\n  );\n}\n\nfunction AlertIcon({\n  tone = \"info\",\n}: {\n  tone?: NonNullable<AlertProps[\"tone\"]>;\n}) {\n  return (\n    <span\n      aria-hidden=\"true\"\n      className={cn(\n        \"inline-flex size-5 items-center justify-center rounded-full border text-[11px] font-bold\",\n        tone === \"info\" && \"border-current/20\",\n        tone === \"success\" && \"border-current/20\",\n        tone === \"warning\" && \"border-current/20\",\n        tone === \"danger\" && \"border-current/20\",\n      )}\n    >\n      {tone === \"success\" ? \"✓\" : tone === \"warning\" ? \"!\" : tone === \"danger\" ? \"×\" : \"i\"}\n    </span>\n  );\n}\n\nexport { Alert, AlertIcon, alertVariants };\n",
      "type": "registry:ui",
      "target": "@ui/alert.tsx"
    }
  ],
  "type": "registry:ui"
}