{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "border-beam",
  "type": "registry:ui",
  "dependencies": [],
  "files": [
    {
      "path": "components/ui/border-beam.tsx",
      "content": "\"use client\";\n\nimport { cn } from \"@/lib/utils\";\n\ninterface BorderBeamProps {\n    className?: string;\n    size?: number;\n    duration?: number;\n    borderWidth?: number;\n    anchor?: number;\n    colorFrom?: string;\n    colorTo?: string;\n    delay?: number;\n}\n\nexport const BorderBeam = ({\n    className,\n    size = 200,\n    duration = 15,\n    anchor = 90,\n    borderWidth = 1.5,\n    colorFrom = \"#ffaa40\",\n    colorTo = \"#9c40ff\",\n    delay = 0,\n}: BorderBeamProps) => {\n    return (\n        <>\n            <style jsx>{`\n        @keyframes border-beam {\n          100% {\n            offset-distance: 100%;\n          }\n        }\n      `}</style>\n            <div\n                style={\n                    {\n                        \"--size\": size,\n                        \"--duration\": duration,\n                        \"--anchor\": anchor,\n                        \"--border-width\": borderWidth,\n                        \"--color-from\": colorFrom,\n                        \"--color-to\": colorTo,\n                        \"--delay\": delay,\n                    } as React.CSSProperties\n                }\n                className={cn(\n                    \"absolute inset-[0] rounded-[inherit] [border:calc(var(--border-width)*1px)_solid_transparent]\",\n                    \"![mask-clip:padding-box,border-box] ![mask-composite:intersect] [mask:linear-gradient(transparent,transparent),linear-gradient(white,white)]\",\n                    \"after:absolute after:aspect-square after:w-[calc(var(--size)*1px)] after:[animation:border-beam_calc(var(--duration)*1s)_infinite_linear] after:[animation-delay:var(--delay)s] after:[background:linear-gradient(to_left,var(--color-from),var(--color-to),transparent)] after:[offset-anchor:calc(var(--anchor)*1%)_50%] after:[offset-path:rect(0_auto_auto_0_round_calc(var(--size)*1px))]\",\n                    className,\n                )}\n            />\n        </>\n    );\n};\n",
      "type": "registry:ui",
      "target": "components/ui/border-beam.tsx"
    }
  ]
}