@yamada-ui/react/dist/cjs/hooks/use-hover/index.cjs

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

"use client";


const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
let react = require("react");
react = require_rolldown_runtime.__toESM(react);

//#region src/hooks/use-hover/index.ts
/**
* `useHover` is a custom hook that detects whether the pointer has moved over or away from an element.
*
* @see https://yamada-ui.com/docs/hooks/use-hover
*/
const useHover = () => {
	const [hovered, setHovered] = (0, react.useState)(false);
	const ref = (0, react.useRef)(null);
	const onMouseEnter = (0, react.useCallback)(() => setHovered(true), []);
	const onMouseLeave = (0, react.useCallback)(() => setHovered(false), []);
	(0, react.useEffect)(() => {
		const el = ref.current;
		if (el) {
			el.addEventListener("mouseenter", onMouseEnter);
			el.addEventListener("mouseleave", onMouseLeave);
			return () => {
				el.removeEventListener("mouseenter", onMouseEnter);
				el.removeEventListener("mouseleave", onMouseLeave);
			};
		}
	}, [onMouseEnter, onMouseLeave]);
	return {
		ref,
		hovered
	};
};

//#endregion
exports.useHover = useHover;
//# sourceMappingURL=index.cjs.map