{"version":3,"sources":["../src/hooks/useHover.ts"],"names":["useHover","_ref","isHovered","setIsHovered","useState","ref","useRef","useEffect","element","handleMouseEnter","handleMouseLeave"],"mappings":"8CA+CO,IAAMA,CAAmCC,CAAAA,CAAAA,EAA+D,CAC7G,GAAM,CAACC,EAAWC,CAAY,CAAA,CAAIC,SAAS,CAAK,CAAA,CAAA,CAC1CC,CAAMC,CAAAA,MAAAA,CAAU,IAAI,CAE1B,CAAA,OAAAC,UAAU,IAAM,CACd,IAAMC,CAAUP,CAAAA,CAAAA,CAAAA,EAAA,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,CAAAA,CAAM,UAAWI,CAAI,CAAA,OAAA,CACrC,GAAI,CAACG,CAAAA,CAAS,OAEd,IAAMC,CAAAA,CAAmB,IAAMN,CAAAA,CAAa,EAAI,CAC1CO,CAAAA,CAAAA,CAAmB,IAAMP,CAAAA,CAAa,EAAK,CAEjD,CAAA,OAAAK,CAAQ,CAAA,gBAAA,CAAiB,aAAcC,CAAgB,CAAA,CACvDD,EAAQ,gBAAiB,CAAA,YAAA,CAAcE,CAAgB,CAEhD,CAAA,IAAM,CACXF,CAAAA,CAAQ,oBAAoB,YAAcC,CAAAA,CAAgB,EAC1DD,CAAQ,CAAA,mBAAA,CAAoB,aAAcE,CAAgB,EAC5D,CACF,CAAA,CAAG,EAAE,CAAA,CAEE,CAAEL,CAAwBJ,EAAAA,CAAAA,CAAMC,CAAS,CAClD","file":"useHover.mjs","sourcesContent":["import { useState, useRef, useEffect, RefObject } from \"react\";\n\n/**\n * Hook that detects when an element is being hovered over.\n *\n * Provides a simple way to track hover state for any HTML element, with support\n * for both internal ref management and external ref usage.\n *\n * @template T - The type of HTML element being monitored (extends HTMLElement)\n * @param _ref - Optional React ref object for the element to monitor. If not provided,\n *               the hook will create and return its own ref.\n *\n * @returns A tuple containing:\n *   - `ref`: React ref object to attach to the target element\n *   - `isHovered`: Boolean indicating whether the element is currently being hovered\n *\n * @example\n * ```tsx\n * // Using the hook's internal ref\n * function HoverButton() {\n *   const [ref, isHovered] = useHover<HTMLButtonElement>();\n *\n *   return (\n *     <button\n *       ref={ref}\n *       style={{ backgroundColor: isHovered ? 'lightblue' : 'white' }}\n *     >\n *       {isHovered ? 'Hovered!' : 'Hover me'}\n *     </button>\n *   );\n * }\n *\n * // Using an external ref\n * function HoverDiv() {\n *   const myRef = useRef<HTMLDivElement>(null);\n *   const [, isHovered] = useHover(myRef);\n *\n *   return (\n *     <div ref={myRef}>\n *       {isHovered && <span>You're hovering!</span>}\n *     </div>\n *   );\n * }\n * ```\n *\n * @see https://thibault.sh/hooks/use-hover\n */\nexport const useHover = <T extends HTMLElement>(_ref?: RefObject<T | null> | null): [RefObject<T>, boolean] => {\n  const [isHovered, setIsHovered] = useState(false);\n  const ref = useRef<T>(null);\n\n  useEffect(() => {\n    const element = _ref?.current || ref.current;\n    if (!element) return;\n\n    const handleMouseEnter = () => setIsHovered(true);\n    const handleMouseLeave = () => setIsHovered(false);\n\n    element.addEventListener(\"mouseenter\", handleMouseEnter);\n    element.addEventListener(\"mouseleave\", handleMouseLeave);\n\n    return () => {\n      element.removeEventListener(\"mouseenter\", handleMouseEnter);\n      element.removeEventListener(\"mouseleave\", handleMouseLeave);\n    };\n  }, []);\n\n  return [(ref as RefObject<T>) || _ref, isHovered];\n};\n"]}