{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "shader-pulsing-border",
  "title": "Shader Pulsing Border",
  "description": "Glowing border frame that pulses around the edges.",
  "dependencies": ["@paper-design/shaders-react"],
  "files": [
    {
      "path": "registry/remocn/shader-pulsing-border/index.tsx",
      "content": "\"use client\";\n\nimport {\n  PulsingBorder,\n  type PulsingBorderProps,\n} from \"@paper-design/shaders-react\";\nimport { useCallback, useState } from \"react\";\nimport {\n  continueRender,\n  delayRender,\n  useCurrentFrame,\n  useVideoConfig,\n} from \"remotion\";\n\nconst NEUTRAL_COLORS = [\"#52527a\", \"#8a8a95\", \"#3a3a5c\"];\n\nexport interface ShaderPulsingBorderProps\n  extends Omit<PulsingBorderProps, \"frame\" | \"ref\"> {}\n\nexport function ShaderPulsingBorder({\n  speed = 1,\n  colorBack = \"#12121a\",\n  colors = NEUTRAL_COLORS,\n  roundness = 0.25,\n  thickness = 0.1,\n  intensity = 0.2,\n  bloom = 0.25,\n  className,\n  ...rest\n}: ShaderPulsingBorderProps) {\n  const frame = useCurrentFrame();\n  const { fps, width, height } = useVideoConfig();\n\n  const [handle] = useState(() => delayRender(\"shader-pulsing-border\"));\n  const gate = useCallback(\n    (element: HTMLDivElement | null) => {\n      if (!element) return;\n      requestAnimationFrame(() =>\n        requestAnimationFrame(() => continueRender(handle)),\n      );\n    },\n    [handle],\n  );\n\n  return (\n    <div\n      ref={gate}\n      className={className}\n      style={{ position: \"absolute\", inset: 0 }}\n    >\n      <PulsingBorder\n        speed={0}\n        frame={(frame / fps) * speed * 1000}\n        colorBack={colorBack}\n        colors={colors}\n        roundness={roundness}\n        thickness={thickness}\n        intensity={intensity}\n        bloom={bloom}\n        fit=\"cover\"\n        width={width}\n        height={height}\n        {...rest}\n      />\n    </div>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/remocn/shader-pulsing-border.tsx"
    }
  ],
  "type": "registry:component"
}
