{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "extends": "none",
  "name": "note",
  "title": "note",
  "description": "note",
  "dependencies": [
    "@heroicons/react",
    "cn"
  ],
  "files": [
    {
      "path": "src/components/ui/note.tsx",
      "content": "import {\n  CheckCircleIcon,\n  ExclamationCircleIcon,\n  InformationCircleIcon,\n} from \"@heroicons/react/24/solid\"\nimport { twJoin, cn } from \"cn\"\n\nexport interface NoteProps extends React.HtmlHTMLAttributes<HTMLDivElement> {\n  intent?: \"default\" | \"info\" | \"warning\" | \"danger\" | \"success\"\n  indicator?: boolean\n}\n\nexport function Note({ indicator = true, intent = \"default\", className, ...props }: NoteProps) {\n  const iconMap: Record<string, React.ElementType | null> = {\n    info: InformationCircleIcon,\n    warning: ExclamationCircleIcon,\n    danger: ExclamationCircleIcon,\n    success: CheckCircleIcon,\n    default: null,\n  }\n\n  const IconComponent = iconMap[intent] || null\n\n  return (\n    <div\n      data-slot=\"note\"\n      className={cn([\n        \"grid w-full grid-cols-[auto_1fr] overflow-hidden rounded-lg border border-current/15 p-4 text-base/6 backdrop-blur-2xl sm:text-sm/6\",\n        \"*:[a]:hover:underline **:[strong]:font-medium\",\n        intent === \"default\" && \"bg-muted/50 text-secondary-foreground\",\n        intent === \"info\" &&\n          \"bg-info-subtle text-info-subtle-foreground **:[.text-muted-foreground]:text-info-subtle-foreground/70\",\n        intent === \"warning\" &&\n          \"bg-warning-subtle text-warning-subtle-foreground **:[.text-muted-foreground]:text-warning-subtle-foreground/80\",\n        intent === \"danger\" &&\n          \"bg-danger-subtle text-danger-subtle-foreground **:[.text-muted-foreground]:text-danger-subtle-foreground/80\",\n        intent === \"success\" &&\n          \"bg-success-subtle text-success-subtle-foreground **:[.text-muted-foreground]:text-success-subtle-foreground/80\",\n        className,\n      ])}\n      {...props}\n    >\n      {IconComponent && indicator && (\n        <div\n          className={twJoin(\n            \"me-3 grid size-8 place-content-center rounded-full border-2\",\n            intent === \"warning\" && \"border-warning-subtle-foreground/40\",\n            intent === \"success\" && \"border-success-subtle-foreground/40\",\n            intent === \"danger\" && \"border-danger-subtle-foreground/40\",\n            intent === \"info\" && \"border-info-subtle-foreground/40\"\n          )}\n        >\n          <div\n            className={twJoin(\n              \"grid size-6 place-content-center rounded-full border-2\",\n              intent === \"warning\" && \"border-warning-subtle-foreground/85\",\n              intent === \"success\" && \"border-success-subtle-foreground/85\",\n              intent === \"danger\" && \"border-danger-subtle-foreground/85\",\n              intent === \"info\" && \"border-info-subtle-foreground/85\"\n            )}\n          >\n            <IconComponent className=\"size-5 shrink-0\" />\n          </div>\n        </div>\n      )}\n      <div className=\"text-pretty group-has-[svg]:col-start-2\">{props.children}</div>\n    </div>\n  )\n}\n",
      "type": "registry:ui"
    }
  ],
  "cssVars": {
    "theme": {
      "color-success-subtle": "var(--success-subtle)",
      "color-success-subtle-foreground": "var(--success-subtle-foreground)",
      "color-info-subtle": "var(--info-subtle)",
      "color-info-subtle-foreground": "var(--info-subtle-foreground)",
      "color-warning-subtle": "var(--warning-subtle)",
      "color-warning-subtle-foreground": "var(--warning-subtle-foreground)",
      "color-danger-subtle": "var(--danger-subtle)",
      "color-danger-subtle-foreground": "var(--danger-subtle-foreground)"
    },
    "light": {
      "success-subtle": "oklch(0.696 0.17 162.48 / 0.15)",
      "success-subtle-foreground": "oklch(0.508 0.118 165.612)",
      "info-subtle": "oklch(0.685 0.169 237.323 / 0.15)",
      "info-subtle-foreground": "oklch(0.5 0.134 242.749)",
      "warning-subtle": "oklch(0.828 0.189 84.429 / 0.2)",
      "warning-subtle-foreground": "oklch(0.555 0.163 48.998)",
      "danger-subtle": "oklch(0.637 0.237 25.331 / 0.15)",
      "danger-subtle-foreground": "oklch(0.505 0.213 27.518)"
    },
    "dark": {
      "success-subtle": "oklch(0.696 0.17 162.48 / 0.1)",
      "success-subtle-foreground": "oklch(0.765 0.177 163.223)",
      "info-subtle": "oklch(0.685 0.169 237.323 / 0.1)",
      "info-subtle-foreground": "oklch(0.828 0.111 230.318)",
      "warning-subtle": "oklch(0.828 0.189 84.429 / 0.1)",
      "warning-subtle-foreground": "oklch(0.828 0.189 84.429)",
      "danger-subtle": "oklch(0.637 0.237 25.331 / 0.1)",
      "danger-subtle-foreground": "oklch(0.704 0.191 22.216)"
    }
  },
  "type": "registry:ui"
}