{
  "name": "use-click-outside",
  "type": "registry:hook",
  "description": "React hook that runs a callback when the user clicks outside the referenced element.",
  "files": [
    {
      "type": "registry:hook",
      "content": "import { type RefObject, useEffect } from \"react\";\n\nexport function useClickOutside(\n  ref: RefObject<HTMLElement>,\n  handler: () => void\n) {\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (ref.current && !ref.current.contains(event.target as Node)) {\n        handler();\n      }\n    };\n\n    document.addEventListener(\"mousedown\", handleClickOutside);\n    return () => document.removeEventListener(\"mousedown\", handleClickOutside);\n  }, [ref, handler]);\n}\n",
      "path": "/hooks/use-click-outside.ts",
      "target": "hooks/use-click-outside.ts"
    }
  ]
}