{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "banner-cookie",
  "type": "registry:ui",
  "title": "Banner Cookie",
  "description": "A frosted-glass cookie consent card with rise entrance and shrink-drop dismiss.",
  "files": [
    {
      "path": "registry/ruixenui/banner-cookie.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nexport interface BannerCookieProps {\n  description?: string;\n  onAccept?: () => void;\n  onDecline?: () => void;\n  className?: string;\n}\n\nexport function BannerCookie({\n  description = \"This site uses cookies to improve your experience.\",\n  onAccept,\n  onDecline,\n  className,\n}: BannerCookieProps) {\n  const [leaving, setLeaving] = React.useState(false);\n  const [gone, setGone] = React.useState(false);\n\n  const dismiss = (cb?: () => void) => {\n    setLeaving(true);\n    setTimeout(() => {\n      setGone(true);\n      cb?.();\n    }, 300);\n  };\n\n  if (gone) return null;\n\n  return (\n    <div\n      className={cn(\n        /* ── surface ── */\n        \"relative w-full max-w-[340px] overflow-hidden rounded-2xl border border-border bg-card p-5\",\n        /* ── depth: outline + tight + ambient ── */\n        \"shadow-[0_0_0_0.5px_rgba(0,0,0,0.06),0_1px_3px_rgba(0,0,0,0.06),0_12px_24px_-6px_rgba(0,0,0,0.1)]\",\n        /* ── top-edge glass highlight ── */\n        \"after:pointer-events-none after:absolute after:inset-x-4 after:top-0 after:h-px after:bg-gradient-to-r after:from-transparent after:via-foreground/[0.06] after:to-transparent\",\n        /* ── entrance / exit ── */\n        leaving\n          ? \"animate-[cookie-leave_0.25s_ease-out_forwards]\"\n          : \"animate-[cookie-enter_0.5s_cubic-bezier(0.16,1,0.3,1)_both]\",\n        className,\n      )}\n    >\n      <p className=\"text-sm leading-relaxed text-muted-foreground\">\n        {description}\n      </p>\n\n      <div className=\"mt-4 flex items-center justify-end gap-3\">\n        {/* ── Decline: ghost + sliding underline reveal ── */}\n        <button\n          type=\"button\"\n          onClick={() => dismiss(onDecline)}\n          className=\"group relative h-8 px-3 text-sm font-medium text-muted-foreground transition-colors duration-200 hover:text-foreground\"\n        >\n          Decline\n          <span className=\"absolute inset-x-1 -bottom-px h-px origin-left scale-x-0 bg-current transition-transform duration-200 ease-out group-hover:scale-x-100\" />\n        </button>\n\n        {/* ── Accept: pill + shadow elevator + press scale ── */}\n        <button\n          type=\"button\"\n          onClick={() => dismiss(onAccept)}\n          className=\"h-8 rounded-full bg-primary px-4 text-sm font-medium text-primary-foreground shadow-sm transition-all duration-200 hover:brightness-110 hover:shadow-md active:scale-[0.96]\"\n        >\n          Accept\n        </button>\n      </div>\n    </div>\n  );\n}\n",
      "type": "registry:ui",
      "target": "components/ruixen/banner-cookie.tsx"
    }
  ]
}