{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "sonner",
  "title": "Sonner (Toast)",
  "author": "AniBT <https://anibt.net>",
  "description": "AniBT toasts on sonner: the floating panel with a 32px tinted type tile (mint, blue, amber, red, spinner), a bold title, a muted line and a quiet close square.",
  "dependencies": [
    "sonner",
    "next-themes",
    "lucide-react"
  ],
  "registryDependencies": [
    "@anibt/theme"
  ],
  "files": [
    {
      "path": "registry/anibt/ui/sonner.tsx",
      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { CheckIcon, InfoIcon, Loader2Icon, TriangleAlertIcon, XIcon } from \"lucide-react\"\nimport { useTheme } from \"next-themes\"\nimport { Toaster as Sonner, type ToasterProps } from \"sonner\"\n\n/**\n * Toaster — AniBT 「贴纸手账」 toasts on sonner.\n *\n * Every toast is the floating panel: paper, a 1px edge and the pop shadow on\n * radius 14, 12px of padding. The type is a 32px tinted tile in the icon slot\n * — mint for done, blue for info, amber for a warning, red for a failure, the\n * sunk well with a spinner for work in flight — beside a 13/700 title and a\n * 12px muted line. The words still say the state on their own. The close\n * button is a quiet 24px square at the right end; an action is a small raised\n * key, a cancel is quiet.\n *\n * sonner styles a toast from attribute selectors, which outrank a utility\n * class, so the overrides here are `!important`. Its own 1px border is\n * dropped and the edge drawn in the shadow, so a toast has one line.\n *\n * Mount one `<Toaster />` near the root (shadcn's export name), then call\n * `toast.success(\"已复制磁力链接\", { description: \"…\" })` from `sonner`.\n */\nconst TILE = \"grid size-8 place-items-center rounded-[10px] [&>svg]:size-4\"\n\nconst Toaster = ({ ...props }: ToasterProps) => {\n  const { theme = \"system\" } = useTheme()\n\n  return (\n    <Sonner\n      theme={theme as ToasterProps[\"theme\"]}\n      className=\"toaster group\"\n      closeButton\n      gap={10}\n      icons={{\n        success: (\n          <span className={`${TILE} bg-anibt-ok-wash text-anibt-ok`}>\n            <CheckIcon strokeWidth={2.75} />\n          </span>\n        ),\n        info: (\n          <span className={`${TILE} bg-anibt-time-wash text-anibt-time-ink`}>\n            <InfoIcon />\n          </span>\n        ),\n        warning: (\n          <span className={`${TILE} bg-anibt-warn-wash text-anibt-warn`}>\n            <TriangleAlertIcon />\n          </span>\n        ),\n        error: (\n          <span className={`${TILE} bg-anibt-danger-wash text-destructive`}>\n            <XIcon strokeWidth={2.75} />\n          </span>\n        ),\n        loading: (\n          <span className={`${TILE} bg-muted text-muted-foreground shadow-[inset_0_0_0_1px_var(--border)]`}>\n            <Loader2Icon className=\"animate-spin\" />\n          </span>\n        ),\n      }}\n      toastOptions={{\n        classNames: {\n          toast:\n            \"anibt-pop! border-0! gap-3! p-3! pr-11! text-[13px]! font-sans! focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring focus-visible:outline-solid\",\n          title: \"font-bold! text-[13px]! leading-snug! text-popover-foreground!\",\n          description: \"text-[12px]! leading-normal! text-muted-foreground!\",\n          icon: \"size-8! m-0! shrink-0!\",\n          closeButton:\n            \"top-1/2! size-6! rounded-[6px]! border-0! bg-transparent! text-muted-foreground! shadow-none! hover:bg-accent! hover:text-accent-foreground! focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring focus-visible:outline-solid [&>svg]:size-3.5!\",\n          actionButton:\n            \"anibt-btn-raised! h-7! rounded-[10px]! px-3! text-[12px]! font-semibold!\",\n          cancelButton: \"h-7! rounded-[10px]! bg-transparent! px-3! text-[12px]! font-semibold! text-anibt-ink2! hover:bg-accent! hover:text-accent-foreground!\",\n        },\n      }}\n      style={\n        {\n          \"--normal-bg\": \"var(--popover)\",\n          \"--normal-text\": \"var(--popover-foreground)\",\n          \"--normal-border\": \"var(--border)\",\n          \"--border-radius\": \"14px\",\n          // The close button sits at the right end, centred, instead of on the\n          // top-left corner.\n          \"--toast-close-button-start\": \"auto\",\n          \"--toast-close-button-end\": \"8px\",\n          \"--toast-close-button-transform\": \"translateY(-50%)\",\n          // sonner's internal greys, pointed at the theme.\n          \"--gray2\": \"var(--muted)\",\n          \"--gray4\": \"var(--border)\",\n          \"--gray5\": \"var(--border)\",\n          \"--gray11\": \"var(--muted-foreground)\",\n          \"--gray12\": \"var(--popover-foreground)\",\n        } as React.CSSProperties\n      }\n      {...props}\n    />\n  )\n}\n\nexport { Toaster }\n",
      "type": "registry:ui"
    }
  ],
  "categories": [
    "feedback",
    "overlay"
  ],
  "type": "registry:ui"
}