react-native-web-internals/dist/esm/modules/useHover/index.js

React Native for Web

import { getModality } from "../modality/index";
import useEvent from "../useEvent/index";
import useLayoutEffect from "../useLayoutEffect/index";
const emptyObject = {}, opts = { passive: !0 }, lockEventType = "react-gui:hover:lock", unlockEventType = "react-gui:hover:unlock", supportsPointerEvent = () => typeof window < "u" && window.PointerEvent != null;
function dispatchCustomEvent(target, type, payload) {
  const event = document.createEvent("CustomEvent"), { bubbles = !0, cancelable = !0, detail } = payload || emptyObject;
  event.initCustomEvent(type, bubbles, cancelable, detail), target.dispatchEvent(event);
}
function getPointerType(event) {
  const { pointerType } = event;
  return pointerType ?? getModality();
}
function useHover(targetRef, config) {
  const { contain, disabled, onHoverStart, onHoverChange, onHoverUpdate, onHoverEnd } = config, canUsePE = supportsPointerEvent(), addMoveListener = useEvent(canUsePE ? "pointermove" : "mousemove", opts), addEnterListener = useEvent(canUsePE ? "pointerenter" : "mouseenter", opts), addLeaveListener = useEvent(canUsePE ? "pointerleave" : "mouseleave", opts), addLockListener = useEvent(lockEventType, opts), addUnlockListener = useEvent(unlockEventType, opts);
  useLayoutEffect(() => {
    const target = targetRef.current;
    if (target !== null) {
      const hoverEnd = function(e) {
        onHoverEnd?.(e), onHoverChange?.(!1), addMoveListener(target, null), addLeaveListener(target, null);
      }, leaveListener = function(e) {
        const target2 = targetRef.current;
        target2 != null && getPointerType(e) !== "touch" && (contain && dispatchCustomEvent(target2, unlockEventType), hoverEnd(e));
      }, moveListener = function(e) {
        getPointerType(e) !== "touch" && onHoverUpdate != null && (e.x == null && (e.x = e.clientX), e.y == null && (e.y = e.clientY), onHoverUpdate(e));
      }, hoverStart = function(e) {
        onHoverStart?.(e), onHoverChange?.(!0), onHoverUpdate != null && addMoveListener(target, disabled ? null : moveListener), addLeaveListener(target, disabled ? null : leaveListener);
      };
      addEnterListener(target, disabled ? null : function(e) {
        const target2 = targetRef.current;
        if (target2 != null && getPointerType(e) !== "touch") {
          contain && dispatchCustomEvent(target2, lockEventType), hoverStart(e);
          const lockListener = function(lockEvent) {
            lockEvent.target !== target2 && hoverEnd(e);
          }, unlockListener = function(lockEvent) {
            lockEvent.target !== target2 && hoverStart(e);
          };
          addLockListener(target2, disabled ? null : lockListener), addUnlockListener(target2, disabled ? null : unlockListener);
        }
      });
    }
  }, [
    addEnterListener,
    addMoveListener,
    addLeaveListener,
    addLockListener,
    addUnlockListener,
    contain,
    disabled,
    onHoverStart,
    onHoverChange,
    onHoverUpdate,
    onHoverEnd,
    targetRef
  ]);
}
export {
  useHover as default
};
//# sourceMappingURL=index.js.map