@hanzogui/react-native-web-internals 3.0.6 → 4.4.0

package/dist/cjs/modules/useEvent/index.cjs

@@ -3,43 +3,55 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
-    for (var name in all) __defProp(target, name, {
-      get: all[name],
-      enumerable: !0
-    });
-  },
-  __copyProps = (to, from, except, desc) => {
-    if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
       get: () => from[key],
       enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
     });
-    return to;
-  };
+  }
+  return to;
+};
 var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: !0
+  value: true
 }), mod);
 var useEvent_exports = {};
 __export(useEvent_exports, {
   useEvent: () => useEvent
 });
 module.exports = __toCommonJS(useEvent_exports);
-var import_createEventHandle = require("../createEventHandle/index.cjs"),
-  import_useLayoutEffect = require("../useLayoutEffect/index.cjs"),
-  import_useStable = require("../useStable/index.cjs");
+var import_createEventHandle = require("../createEventHandle/index.cjs");
+var import_useLayoutEffect = require("../useLayoutEffect/index.cjs");
+var import_useStable = require("../useStable/index.cjs");
 function useEvent(event, options) {
-  const targetListeners = (0, import_useStable.useStable)(() => /* @__PURE__ */new Map()),
-    addListener = (0, import_useStable.useStable)(() => {
-      const addEventListener = (0, import_createEventHandle.createEventHandle)(event, options);
-      return (target, callback) => {
-        const removeTargetListener = targetListeners.get(target);
-        removeTargetListener?.(), callback == null && targetListeners.delete(target);
-        const removeEventListener = addEventListener(target, callback);
-        return targetListeners.set(target, removeEventListener), removeEventListener;
-      };
-    });
-  return (0, import_useLayoutEffect.useLayoutEffectImpl)(() => () => {
-    targetListeners.forEach(removeListener => {
-      removeListener();
-    }), targetListeners.clear();
-  }, [targetListeners]), addListener;
+  const targetListeners = (0, import_useStable.useStable)(() => /* @__PURE__ */new Map());
+  const addListener = (0, import_useStable.useStable)(() => {
+    const addEventListener = (0, import_createEventHandle.createEventHandle)(event, options);
+    return (target, callback) => {
+      const removeTargetListener = targetListeners.get(target);
+      if (removeTargetListener != null) {
+        removeTargetListener();
+      }
+      if (callback == null) {
+        targetListeners.delete(target);
+      }
+      const removeEventListener = addEventListener(target, callback);
+      targetListeners.set(target, removeEventListener);
+      return removeEventListener;
+    };
+  });
+  (0, import_useLayoutEffect.useLayoutEffectImpl)(() => {
+    return () => {
+      targetListeners.forEach(removeListener => {
+        removeListener();
+      });
+      targetListeners.clear();
+    };
+  }, [targetListeners]);
+  return addListener;
 }

package/dist/cjs/modules/useHover/__tests__/index-test.cjs

@@ -2,13 +2,15 @@ var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf,
-  __hasOwnProp = Object.prototype.hasOwnProperty;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, {
-    get: () => from[key],
-    enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-  });
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
@@ -18,15 +20,15 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 // "default" to the CommonJS "module.exports" for node compatibility.
 isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
   value: mod,
-  enumerable: !0
+  enumerable: true
 }) : target, mod));
-var import_dom_event_testing_library = require("dom-event-testing-library"),
-  React = __toESM(require("react"), 1),
-  ReactDOM = __toESM(require("react-dom"), 1),
-  import_test_utils = require("react-dom/test-utils"),
-  import_modality = require("../../modality/index.cjs"),
-  import__ = __toESM(require("../index.cjs"), 1),
-  import_jsx_runtime = require("react/jsx-runtime");
+var import_dom_event_testing_library = require("dom-event-testing-library");
+var React = __toESM(require("react"), 1);
+var ReactDOM = __toESM(require("react-dom"), 1);
+var import_test_utils = require("react-dom/test-utils");
+var import_modality = require("../../modality/index.cjs");
+var import__ = __toESM(require("../index.cjs"), 1);
+var import_jsx_runtime = require("react/jsx-runtime");
 function createRoot(rootNode) {
   return {
     render(element) {
@@ -35,55 +37,88 @@ function createRoot(rootNode) {
   };
 }
 (0, import_dom_event_testing_library.describeWithPointerEvent)("useHover", hasPointerEvents => {
-  let root, rootNode;
+  let root;
+  let rootNode;
   beforeEach(() => {
-    (0, import_dom_event_testing_library.setPointerEvent)(hasPointerEvents), rootNode = document.createElement("div"), document.body.appendChild(rootNode), root = createRoot(rootNode);
-  }), afterEach(() => {
-    root.render(null), document.body.removeChild(rootNode), rootNode = null, root = null, (0, import_modality.testOnly_resetActiveModality)(), (0, import_dom_event_testing_library.clearPointers)();
-  }), describe("contain", () => {
+    (0, import_dom_event_testing_library.setPointerEvent)(hasPointerEvents);
+    rootNode = document.createElement("div");
+    document.body.appendChild(rootNode);
+    root = createRoot(rootNode);
+  });
+  afterEach(() => {
+    root.render(null);
+    document.body.removeChild(rootNode);
+    rootNode = null;
+    root = null;
+    (0, import_modality.testOnly_resetActiveModality)();
+    (0, import_dom_event_testing_library.clearPointers)();
+  });
+  describe("contain", () => {
     let onHoverChange, onHoverStart, onHoverUpdate, onHoverEnd, ref, childRef;
     const componentInit = () => {
-      onHoverChange = jest.fn(), onHoverStart = jest.fn(), onHoverUpdate = jest.fn(), onHoverEnd = jest.fn(), ref = React.createRef(), childRef = React.createRef();
-      const Component = () => ((0, import__.default)(ref, {
-        onHoverChange,
-        onHoverStart,
-        onHoverUpdate,
-        onHoverEnd
-      }), (0, import__.default)(childRef, {
-        contain: !0
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
-        ref,
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
-          ref: childRef
-        })
-      }));
+      onHoverChange = jest.fn();
+      onHoverStart = jest.fn();
+      onHoverUpdate = jest.fn();
+      onHoverEnd = jest.fn();
+      ref = React.createRef();
+      childRef = React.createRef();
+      const Component = () => {
+        (0, import__.default)(ref, {
+          onHoverChange,
+          onHoverStart,
+          onHoverUpdate,
+          onHoverEnd
+        });
+        (0, import__.default)(childRef, {
+          contain: true
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+          ref,
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+            ref: childRef
+          })
+        });
+      };
       (0, import_test_utils.act)(() => {
         root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {}));
       });
     };
     test("contains the hover gesture", () => {
       componentInit();
-      const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current),
-        child = (0, import_dom_event_testing_library.createEventTarget)(childRef.current);
+      const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current);
+      const child = (0, import_dom_event_testing_library.createEventTarget)(childRef.current);
+      (0, import_test_utils.act)(() => {
+        target.pointerover();
+        target.pointerout();
+        child.pointerover();
+      });
+      expect(onHoverEnd).toBeCalled();
       (0, import_test_utils.act)(() => {
-        target.pointerover(), target.pointerout(), child.pointerover();
-      }), expect(onHoverEnd).toBeCalled(), (0, import_test_utils.act)(() => {
         child.pointerout();
-      }), expect(onHoverStart).toBeCalled();
+      });
+      expect(onHoverStart).toBeCalled();
     });
-  }), describe("disabled", () => {
+  });
+  describe("disabled", () => {
     let onHoverChange, onHoverStart, onHoverUpdate, onHoverEnd, ref;
     const componentInit = () => {
-      onHoverChange = jest.fn(), onHoverStart = jest.fn(), onHoverUpdate = jest.fn(), onHoverEnd = jest.fn(), ref = React.createRef();
-      const Component = () => ((0, import__.default)(ref, {
-        disabled: !0,
-        onHoverChange,
-        onHoverStart,
-        onHoverUpdate,
-        onHoverEnd
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
-        ref
-      }));
+      onHoverChange = jest.fn();
+      onHoverStart = jest.fn();
+      onHoverUpdate = jest.fn();
+      onHoverEnd = jest.fn();
+      ref = React.createRef();
+      const Component = () => {
+        (0, import__.default)(ref, {
+          disabled: true,
+          onHoverChange,
+          onHoverStart,
+          onHoverUpdate,
+          onHoverEnd
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+          ref
+        });
+      };
       (0, import_test_utils.act)(() => {
         root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {}));
       });
@@ -92,18 +127,28 @@ function createRoot(rootNode) {
       componentInit();
       const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current);
       (0, import_test_utils.act)(() => {
-        target.pointerover(), target.pointerout();
-      }), expect(onHoverChange).not.toBeCalled(), expect(onHoverStart).not.toBeCalled(), expect(onHoverUpdate).not.toBeCalled(), expect(onHoverEnd).not.toBeCalled();
+        target.pointerover();
+        target.pointerout();
+      });
+      expect(onHoverChange).not.toBeCalled();
+      expect(onHoverStart).not.toBeCalled();
+      expect(onHoverUpdate).not.toBeCalled();
+      expect(onHoverEnd).not.toBeCalled();
     });
-  }), describe("onHoverStart", () => {
+  });
+  describe("onHoverStart", () => {
     let onHoverStart, ref;
     const componentInit = () => {
-      onHoverStart = jest.fn(), ref = React.createRef();
-      const Component = () => ((0, import__.default)(ref, {
-        onHoverStart
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
-        ref
-      }));
+      onHoverStart = jest.fn();
+      ref = React.createRef();
+      const Component = () => {
+        (0, import__.default)(ref, {
+          onHoverStart
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+          ref
+        });
+      };
       (0, import_test_utils.act)(() => {
         root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {}));
       });
@@ -115,39 +160,52 @@ function createRoot(rootNode) {
         target.pointerover({
           pointerType: "mouse"
         });
-      }), expect(onHoverStart).toBeCalledTimes(1);
-    }), test("is not called for touch pointers", () => {
+      });
+      expect(onHoverStart).toBeCalledTimes(1);
+    });
+    test("is not called for touch pointers", () => {
       componentInit();
       const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current);
       (0, import_test_utils.act)(() => {
         target.pointerdown({
           pointerType: "touch"
-        }), target.pointerup({
+        });
+        target.pointerup({
           pointerType: "touch"
         });
-      }), expect(onHoverStart).not.toBeCalled();
-    }), test("is called if a mouse pointer is used after a touch pointer", () => {
+      });
+      expect(onHoverStart).not.toBeCalled();
+    });
+    test("is called if a mouse pointer is used after a touch pointer", () => {
       componentInit();
       const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current);
       (0, import_test_utils.act)(() => {
         target.pointerdown({
           pointerType: "touch"
-        }), target.pointerup({
+        });
+        target.pointerup({
           pointerType: "touch"
-        }), target.pointerover({
+        });
+        target.pointerover({
           pointerType: "mouse"
         });
-      }), expect(onHoverStart).toBeCalledTimes(1);
+      });
+      expect(onHoverStart).toBeCalledTimes(1);
     });
-  }), describe("onHoverChange", () => {
+  });
+  describe("onHoverChange", () => {
     let onHoverChange, ref;
     const componentInit = () => {
-      onHoverChange = jest.fn(), ref = React.createRef();
-      const Component = () => ((0, import__.default)(ref, {
-        onHoverChange
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
-        ref
-      }));
+      onHoverChange = jest.fn();
+      ref = React.createRef();
+      const Component = () => {
+        (0, import__.default)(ref, {
+          onHoverChange
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+          ref
+        });
+      };
       (0, import_test_utils.act)(() => {
         root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {}));
       });
@@ -157,32 +215,46 @@ function createRoot(rootNode) {
       const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current);
       (0, import_test_utils.act)(() => {
         target.pointerover();
-      }), expect(onHoverChange).toBeCalledTimes(1), expect(onHoverChange).toBeCalledWith(!0), (0, import_test_utils.act)(() => {
+      });
+      expect(onHoverChange).toBeCalledTimes(1);
+      expect(onHoverChange).toBeCalledWith(true);
+      (0, import_test_utils.act)(() => {
         target.pointerout();
-      }), expect(onHoverChange).toBeCalledTimes(2), expect(onHoverChange).toBeCalledWith(!1);
-    }), test("is not called for touch pointers", () => {
+      });
+      expect(onHoverChange).toBeCalledTimes(2);
+      expect(onHoverChange).toBeCalledWith(false);
+    });
+    test("is not called for touch pointers", () => {
       componentInit();
       const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current);
       (0, import_test_utils.act)(() => {
         target.pointerdown({
           pointerType: "touch"
-        }), target.pointerup({
+        });
+        target.pointerup({
           pointerType: "touch"
         });
-      }), expect(onHoverChange).not.toBeCalled();
+      });
+      expect(onHoverChange).not.toBeCalled();
     });
-  }), describe("onHoverEnd", () => {
+  });
+  describe("onHoverEnd", () => {
     let onHoverEnd, ref, childRef;
     const componentInit = () => {
-      onHoverEnd = jest.fn(), ref = React.createRef(), childRef = React.createRef();
-      const Component = () => ((0, import__.default)(ref, {
-        onHoverEnd
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
-        ref,
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
-          ref: childRef
-        })
-      }));
+      onHoverEnd = jest.fn();
+      ref = React.createRef();
+      childRef = React.createRef();
+      const Component = () => {
+        (0, import__.default)(ref, {
+          onHoverEnd
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+          ref,
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+            ref: childRef
+          })
+        });
+      };
       (0, import_test_utils.act)(() => {
         root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {}));
       });
@@ -191,65 +263,89 @@ function createRoot(rootNode) {
       componentInit();
       const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current);
       (0, import_test_utils.act)(() => {
-        target.pointerover(), target.pointerout();
-      }), expect(onHoverEnd).toBeCalledTimes(1);
-    }), test("is not called for touch pointers", () => {
+        target.pointerover();
+        target.pointerout();
+      });
+      expect(onHoverEnd).toBeCalledTimes(1);
+    });
+    test("is not called for touch pointers", () => {
       componentInit();
       const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current);
       (0, import_test_utils.act)(() => {
         target.pointerdown({
           pointerType: "touch"
-        }), target.pointerup({
+        });
+        target.pointerup({
           pointerType: "touch"
         });
-      }), expect(onHoverEnd).not.toBeCalled();
-    }), test("is not called when entering children of the target", () => {
+      });
+      expect(onHoverEnd).not.toBeCalled();
+    });
+    test("is not called when entering children of the target", () => {
       componentInit();
-      const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current),
-        child = (0, import_dom_event_testing_library.createEventTarget)(childRef.current);
+      const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current);
+      const child = (0, import_dom_event_testing_library.createEventTarget)(childRef.current);
       (0, import_test_utils.act)(() => {
-        target.pointerover(), target.pointerout({
+        target.pointerover();
+        target.pointerout({
           relatedTarget: childRef.current
-        }), child.pointerover({
+        });
+        child.pointerover({
           relatedTarget: target.node
         });
-      }), expect(onHoverEnd).not.toBeCalled();
+      });
+      expect(onHoverEnd).not.toBeCalled();
     });
-  }), describe("onHoverUpdate", () => {
+  });
+  describe("onHoverUpdate", () => {
     test('is called after the active pointer moves"', () => {
-      const onHoverUpdate = jest.fn(),
-        ref = React.createRef(),
-        Component = () => ((0, import__.default)(ref, {
+      const onHoverUpdate = jest.fn();
+      const ref = React.createRef();
+      const Component = () => {
+        (0, import__.default)(ref, {
           onHoverUpdate
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
           ref
-        }));
+        });
+      };
       (0, import_test_utils.act)(() => {
         root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {}));
       });
       const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current);
       (0, import_test_utils.act)(() => {
-        target.pointerover(), target.pointerhover({
+        target.pointerover();
+        target.pointerhover({
           x: 0,
           y: 0
-        }), target.pointerhover({
+        });
+        target.pointerhover({
           x: 1,
           y: 1
         });
-      }), expect(onHoverUpdate).toBeCalledTimes(2);
+      });
+      expect(onHoverUpdate).toBeCalledTimes(2);
     });
-  }), describe("repeat use", () => {
+  });
+  describe("repeat use", () => {
     let onHoverChange, onHoverStart, onHoverUpdate, onHoverEnd, ref;
     const componentInit = () => {
-      onHoverChange = jest.fn(), onHoverStart = jest.fn(), onHoverUpdate = jest.fn(), onHoverEnd = jest.fn(), ref = React.createRef();
-      const Component = () => ((0, import__.default)(ref, {
-        onHoverChange,
-        onHoverStart,
-        onHoverUpdate,
-        onHoverEnd
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
-        ref
-      }));
+      onHoverChange = jest.fn();
+      onHoverStart = jest.fn();
+      onHoverUpdate = jest.fn();
+      onHoverEnd = jest.fn();
+      ref = React.createRef();
+      const Component = () => {
+        (0, import__.default)(ref, {
+          onHoverChange,
+          onHoverStart,
+          onHoverUpdate,
+          onHoverEnd
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
+          ref
+        });
+      };
       (0, import_test_utils.act)(() => {
         root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {}));
       });
@@ -258,16 +354,29 @@ function createRoot(rootNode) {
       componentInit();
       const target = (0, import_dom_event_testing_library.createEventTarget)(ref.current);
       (0, import_test_utils.act)(() => {
-        target.pointerover(), target.pointerhover({
+        target.pointerover();
+        target.pointerhover({
           x: 1,
           y: 1
-        }), target.pointerout();
-      }), expect(onHoverStart).toBeCalledTimes(1), expect(onHoverUpdate).toBeCalledTimes(1), expect(onHoverEnd).toBeCalledTimes(1), expect(onHoverChange).toBeCalledTimes(2), (0, import_test_utils.act)(() => {
-        target.pointerover(), target.pointerhover({
+        });
+        target.pointerout();
+      });
+      expect(onHoverStart).toBeCalledTimes(1);
+      expect(onHoverUpdate).toBeCalledTimes(1);
+      expect(onHoverEnd).toBeCalledTimes(1);
+      expect(onHoverChange).toBeCalledTimes(2);
+      (0, import_test_utils.act)(() => {
+        target.pointerover();
+        target.pointerhover({
           x: 1,
           y: 1
-        }), target.pointerout();
-      }), expect(onHoverStart).toBeCalledTimes(2), expect(onHoverUpdate).toBeCalledTimes(2), expect(onHoverEnd).toBeCalledTimes(2), expect(onHoverChange).toBeCalledTimes(4);
+        });
+        target.pointerout();
+      });
+      expect(onHoverStart).toBeCalledTimes(2);
+      expect(onHoverUpdate).toBeCalledTimes(2);
+      expect(onHoverEnd).toBeCalledTimes(2);
+      expect(onHoverChange).toBeCalledTimes(4);
     });
   });
 });