{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "spotlight",
  "type": "registry:ui",
  "title": "Spotlight",
  "description": "Masked spotlight highlighting container content on hover.",
  "dependencies": [
    "framer-motion"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/ui/cursor/spotlight.tsx",
      "type": "registry:ui",
      "target": "components/amicro/spotlight.tsx",
      "content": "import React, { useRef, useState } from 'react';\r\nimport { motion } from 'framer-motion';\r\n\r\ninterface SpotlightProps {\r\n  children: React.ReactNode;\r\n  className?: string;\r\n  glowColor?: string;\r\n  glowSize?: number;\r\n}\r\n\r\nexport function Spotlight({\r\n  children,\r\n  className = '',\r\n  glowColor = 'rgba(255, 255, 255, 0.08)',\r\n  glowSize = 250,\r\n}: SpotlightProps) {\r\n  const containerRef = useRef<HTMLDivElement>(null);\r\n  const [coords, setCoords] = useState({ x: 0, y: 0 });\r\n  const [opacity, setOpacity] = useState(0);\r\n\r\n  const handleMouseMove = (e: React.MouseEvent<HTMLDivElement>) => {\r\n    if (!containerRef.current) return;\r\n    const rect = containerRef.current.getBoundingClientRect();\r\n    setCoords({\r\n      x: e.clientX - rect.left,\r\n      y: e.clientY - rect.top,\r\n    });\r\n  };\r\n\r\n  return (\r\n    <div\r\n      ref={containerRef}\r\n      onMouseMove={handleMouseMove}\r\n      onMouseEnter={() => setOpacity(1)}\r\n      onMouseLeave={() => setOpacity(0)}\r\n      className={`relative overflow-hidden bg-neutral-950 border border-neutral-900 rounded-2xl p-6 ${className}`}\r\n    >\r\n      {/* Dynamic Cursor Spotlight Layer */}\r\n      <motion.div\r\n        className=\"pointer-events-none absolute -inset-px opacity-0 transition-opacity duration-300\"\r\n        style={{\r\n          opacity,\r\n          background: `radial-gradient(${glowSize}px circle at ${coords.x}px ${coords.y}px, ${glowColor}, transparent 80%)`,\r\n        }}\r\n      />\r\n      \r\n      {/* Content wrapper */}\r\n      <div className=\"relative z-10\">{children}</div>\r\n    </div>\r\n  );\r\n}\r\n"
    }
  ]
}