@mantine/hooks
Version:
A collection of 50+ hooks for state and UI management
34 lines (33 loc) • 1.02 kB
JavaScript
"use client";
let react = require("react");
//#region packages/@mantine/hooks/src/use-hover/use-hover.ts
function useHover() {
const [hovered, setHovered] = (0, react.useState)(false);
const previousNode = (0, react.useRef)(null);
const handleMouseEnter = (0, react.useCallback)(() => {
setHovered(true);
}, []);
const handleMouseLeave = (0, react.useCallback)(() => {
setHovered(false);
}, []);
return {
ref: (0, react.useCallback)((node) => {
if (previousNode.current) {
previousNode.current.removeEventListener("mouseenter", handleMouseEnter);
previousNode.current.removeEventListener("mouseleave", handleMouseLeave);
}
if (node) {
node.addEventListener("mouseenter", handleMouseEnter);
node.addEventListener("mouseleave", handleMouseLeave);
}
previousNode.current = node;
return () => {
previousNode.current = null;
};
}, [handleMouseEnter, handleMouseLeave]),
hovered
};
}
//#endregion
exports.useHover = useHover;
//# sourceMappingURL=use-hover.cjs.map