{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "border-beam",
  "title": "Border Beam",
  "description": "Animated accent beam that travels around the border of a highlighted surface.",
  "dependencies": [
    "@vllnt/ui@^0.3.0"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/default/border-beam/border-beam.tsx",
      "content": "import * as React from \"react\";\n\nimport { cn } from \"@vllnt/ui\";\n\nexport type BorderBeamProps = React.ComponentPropsWithoutRef<\"span\"> & {\n  borderWidth?: number;\n  colorFrom?: string;\n  colorTo?: string;\n  delay?: number;\n  duration?: number;\n  reverse?: boolean;\n};\n\nexport const BorderBeam = ({\n  borderWidth = 1,\n  className,\n  colorFrom = \"oklch(var(--primary) / 0.85)\",\n  colorTo = \"oklch(var(--ring) / 0.25)\",\n  delay = 0,\n  duration = 6,\n  ref,\n  reverse = false,\n  style,\n  ...props\n}: BorderBeamProps & { ref?: React.Ref<HTMLSpanElement> }) => {\n  const beamStyle: React.CSSProperties = {\n    animationDelay: `${delay}s`,\n    animationDirection: reverse ? \"reverse\" : \"normal\",\n    animationDuration: `${duration}s`,\n    animationIterationCount: \"infinite\",\n    animationName: \"vllnt-border-beam-angle\",\n    animationTimingFunction: \"linear\",\n    background: `conic-gradient(from var(--vllnt-border-beam-angle, 90deg), transparent 0deg, transparent 220deg, ${colorFrom} 280deg, ${colorTo} 335deg, transparent 360deg)`,\n    borderRadius: \"inherit\",\n    boxSizing: \"border-box\",\n    mask: \"linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0)\",\n    maskComposite: \"exclude\",\n    padding: `${borderWidth}px`,\n    WebkitMask:\n      \"linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0)\",\n    WebkitMaskComposite: \"xor\",\n    ...style,\n  };\n\n  return (\n    <span\n      aria-hidden=\"true\"\n      className={cn(\n        \"pointer-events-none absolute inset-0 rounded-[inherit]\",\n        className,\n      )}\n      ref={ref}\n      style={beamStyle}\n      {...props}\n    />\n  );\n};\n\nBorderBeam.displayName = \"BorderBeam\";\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component",
  "version": "0.3.0",
  "stability": "stable"
}