{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "cursor",
  "title": "Cursor",
  "description": "Custom cursor follower that trails the pointer.",
  "dependencies": [
    "@vllnt/ui@^0.2.1"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/default/cursor/cursor.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\n\nimport { cn } from \"@vllnt/ui\";\n\n/** Props for {@link Cursor}. */\nexport type CursorProps = React.ComponentPropsWithoutRef<\"div\"> & {\n  /** Diameter of the follower dot in pixels. Defaults to `24`. */\n  size?: number;\n};\n\ntype Point = {\n  x: number;\n  y: number;\n};\n\nfunction usePointerPosition(): Point | undefined {\n  const [point, setPoint] = React.useState<Point>();\n\n  React.useEffect(() => {\n    if (typeof window === \"undefined\") {\n      return;\n    }\n\n    const onMove = (event: PointerEvent): void => {\n      setPoint({ x: event.clientX, y: event.clientY });\n    };\n\n    window.addEventListener(\"pointermove\", onMove, { passive: true });\n\n    return () => {\n      window.removeEventListener(\"pointermove\", onMove);\n    };\n  }, []);\n\n  return point;\n}\n\n/**\n * Circular follower that tracks the pointer as a custom cursor overlay.\n *\n * Pointer tracking is direct feedback and keeps following under reduced\n * motion; `motion-reduce` drops the smoothing transition.\n *\n * @example\n * ```tsx\n * <Cursor size={32} />\n * ```\n */\nexport const Cursor = ({\n  className,\n  ref,\n  size = 24,\n  style,\n  ...props\n}: CursorProps & { ref?: React.Ref<HTMLDivElement> }) => {\n  const point = usePointerPosition();\n\n  return (\n    <div\n      aria-hidden=\"true\"\n      className={cn(\n        \"pointer-events-none fixed left-0 top-0 z-50 -translate-x-1/2 -translate-y-1/2 rounded-full border border-foreground bg-foreground/20 backdrop-invert transition-transform duration-100 ease-out motion-reduce:transition-none\",\n        point ? \"opacity-100\" : \"opacity-0\",\n        className,\n      )}\n      ref={ref}\n      style={{\n        height: `${size}px`,\n        transform: point\n          ? `translate(${point.x}px, ${point.y}px) translate(-50%, -50%)`\n          : undefined,\n        width: `${size}px`,\n        ...style,\n      }}\n      {...props}\n    />\n  );\n};\nCursor.displayName = \"Cursor\";\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component",
  "version": "0.2.1",
  "stability": "stable"
}
