@jobber/hooks 2.1.6-quick-use-.178 → 2.2.0

package/dist/useInView/index.d.ts

@@ -0,0 +1 @@
+export * from "./useInView";

package/dist/useInView/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./useInView"), exports);

package/dist/useInView/useInView.d.ts

@@ -0,0 +1,2 @@
+import { RefObject } from "react";
+export declare function useInView<T extends Element>(): [RefObject<T>, boolean];

package/dist/useInView/useInView.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useInView = void 0;
+const react_1 = require("react");
+function useInView() {
+    const ref = (0, react_1.useRef)(null);
+    const [isInView, setIsInView] = (0, react_1.useState)(false);
+    const handleIntersection = (0, react_1.useCallback)(entries => setIsInView(entries[0].isIntersecting), [setIsInView]);
+    (0, react_1.useEffect)(() => {
+        if (!window.IntersectionObserver)
+            return;
+        const observer = new IntersectionObserver(handleIntersection);
+        ref.current && observer.observe(ref.current);
+        return () => {
+            ref.current && observer.unobserve(ref.current);
+        };
+    }, [handleIntersection, ref.current]);
+    return [ref, isInView];
+}
+exports.useInView = useInView;

package/dist/useInView/useInView.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/useInView/useInView.test.js

@@ -0,0 +1,29 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const react_2 = require("@testing-library/react");
+const jsdom_testing_mocks_1 = require("jsdom-testing-mocks");
+const useInView_1 = require("./useInView");
+(0, jsdom_testing_mocks_1.configMocks)({ act: react_2.act });
+const observer = (0, jsdom_testing_mocks_1.mockIntersectionObserver)();
+describe("useInView", () => {
+    it("should return true when the target element is in view", () => {
+        const { result, rerender } = (0, react_2.renderHook)(() => (0, useInView_1.useInView)());
+        const [ref, isInView] = result.current;
+        (0, react_2.render)(react_1.default.createElement("button", { ref: ref }));
+        rerender();
+        expect(result.current[0].current).toBeInstanceOf(HTMLButtonElement);
+        observer.leaveNode(react_2.screen.getByRole("button"));
+        expect(isInView).toBe(false);
+    });
+    it("should return false when the target element is in view", () => {
+        const { result, rerender } = (0, react_2.renderHook)(() => (0, useInView_1.useInView)());
+        (0, react_2.render)(react_1.default.createElement("button", { ref: result.current[0] }));
+        rerender();
+        observer.enterNode(react_2.screen.getByRole("button"));
+        expect(result.current[1]).toBe(true);
+    });
+});

package/dist/useResizeObserver/useResizeObserver.js

@@ -22,7 +22,7 @@ function useResizeObserver({ widths = exports.Breakpoints, heights = exports.Bre
         width: undefined,
         height: undefined,
     });
-    const onResize = (0, react_1.useMemo)(() => (0, throttle_1.default)(setSize, wait, { leading: true }), [wait]);
+    const onResize = (0, react_1.useMemo)(() => (0, throttle_1.default)(setSize, wait), [wait]);
     const { ref } = (0, polyfilled_1.default)({
         onResize,
     });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/hooks",
-  "version": "2.1.6-quick-use-.178+e93e05ec",
+  "version": "2.2.0",
   "license": "MIT",
   "main": "./dist/index.js",
   "types": "./dist/index.d.js",
@@ -20,7 +20,7 @@
   ],
   "devDependencies": {
     "@apollo/react-testing": "^4.0.0",
-    "@jobber/formatters": "^0.2.2",
+    "@jobber/formatters": "*",
     "@testing-library/react": "^14.0.0",
     "@testing-library/react-hooks": "^7.0.0",
     "@testing-library/user-event": "^12.0.2",
@@ -29,6 +29,7 @@
     "@types/react-dom": "^18.0.11",
     "@types/uuid": "^8.3.3",
     "@types/zxcvbn": "^4.4.1",
+    "jsdom-testing-mocks": "^1.9.0",
     "typescript": "^4.9.5",
     "uuid": "^8.3.2"
   },
@@ -44,5 +45,5 @@
     "@apollo/client": "^3.0.0",
     "react": "^18"
   },
-  "gitHead": "e93e05ec75e35a765b7dd6d4b3f3c61b2a4be7a1"
+  "gitHead": "3e19cd88bd918e5e8a6c047bc5b3683d60c31451"
 }

package/useInView.d.ts

@@ -0,0 +1 @@
+export * from "./dist/useInView";

package/useInView.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true,
+});
+
+var useInView = require("./dist/useInView");
+
+Object.keys(useInView).forEach(function(key) {
+  if (key === "default" || key === "__esModule") return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return useInView[key];
+    },
+  });
+});