{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "blob-card",
  "title": "Blob Card",
  "description": "Animated card with fluid blob header, animated glow border, and configurable colors.",
  "files": [
    {
      "path": "registry/components/ui/blob-card/index.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport { FluidBlobs } from \"@/components/ui/FluidBlobs\";\nimport { GlowEffect } from \"@/components/ui/glow-effect\";\nimport { cn } from \"@/lib/utils\";\n\nexport interface BlobCardProps {\n  header?: React.ReactNode;\n  children?: React.ReactNode;\n  headerHeight?: number;\n  lightColors?: string[];\n  darkColors?: string[];\n  glowColors?: string[];\n  className?: string;\n}\n\nconst DEFAULT_LIGHT = [\"#ff0020\", \"#fc0f60\", \"#e8227a\", \"#ff85b3\"];\nconst DEFAULT_DARK = [\"#8c0f60\", \"#e8227a\", \"#e8227a\", \"#ff85b3\"];\nconst DEFAULT_GLOW = [\"#ff96a9\", \"#e8b4f0\", \"#ffb3c6\", \"#d44d8a\", \"#ff96a9\"];\n\nexport function BlobCard({\n  header,\n  children,\n  headerHeight = 224,\n  lightColors = DEFAULT_LIGHT,\n  darkColors = DEFAULT_DARK,\n  glowColors = DEFAULT_GLOW,\n  className,\n}: BlobCardProps) {\n  return (\n    <div className={cn(\"relative w-full\", className)}>\n      <div className=\"absolute -inset-[1.5px] rounded-[21.5px] overflow-hidden z-0\">\n        <GlowEffect\n          colors={glowColors}\n          mode=\"rotate\"\n          blur=\"strongest\"\n          duration={5}\n          scale={1}\n        />\n      </div>\n\n      <div className=\"relative z-10 rounded-[20px] overflow-hidden bg-background\">\n        <div\n          className=\"relative overflow-hidden rounded-t-[20px]\"\n          style={{ height: headerHeight }}\n        >\n          <FluidBlobs\n            lightColors={lightColors}\n            darkColors={darkColors}\n            origins={[\n              { x: 50, y: -55 },\n              { x: 50, y: -25 },\n              { x: 50, y: -25 },\n              { x: 50, y: -25 },\n            ]}\n            margin={60}\n            blur={50}\n          />\n          <div className=\"absolute inset-0 bg-gradient-to-b from-transparent via-transparent to-background pointer-events-none\" />\n          {header && <div className=\"relative z-10 p-8 pb-0\">{header}</div>}\n        </div>\n\n        {children && <div>{children}</div>}\n      </div>\n    </div>\n  );\n}\n",
      "type": "registry:ui",
      "target": "components/unlumen-ui/blob-card.tsx"
    }
  ],
  "type": "registry:ui"
}