framer-motion
Version:
A simple and powerful React animation library
29 lines (26 loc) • 1.25 kB
JavaScript
import { isMouseEvent } from './utils/event-type.mjs';
import { AnimationType } from '../render/utils/types.mjs';
import { usePointerEvent } from '../events/use-pointer-event.mjs';
import { isDragActive } from './drag/utils/lock.mjs';
function createHoverEvent(visualElement, isActive, callback) {
return function (event, info) {
var _a;
if (!isMouseEvent(event) || isDragActive())
return;
/**
* Ensure we trigger animations before firing event callback
*/
(_a = visualElement.animationState) === null || _a === void 0 ? void 0 : _a.setActive(AnimationType.Hover, isActive);
callback === null || callback === void 0 ? void 0 : callback(event, info);
};
}
function useHoverGesture(_a) {
var onHoverStart = _a.onHoverStart, onHoverEnd = _a.onHoverEnd, whileHover = _a.whileHover, visualElement = _a.visualElement;
usePointerEvent(visualElement, "pointerenter", onHoverStart || whileHover
? createHoverEvent(visualElement, true, onHoverStart)
: undefined);
usePointerEvent(visualElement, "pointerleave", onHoverEnd || whileHover
? createHoverEvent(visualElement, false, onHoverEnd)
: undefined);
}
export { useHoverGesture };