@koine/react 1.1.3 → 1.1.5

package/hooks/index.d.ts

@@ -14,6 +14,7 @@ export * from "./useNavigateAway";
 export * from "./usePrevious";
 export * from "./usePreviousRef";
 export * from "./useScrollPosition";
+export * from "./useScrollThreshold";
 export * from "./useSmoothScroll";
 export * from "./useTraceUpdate";
 export * from "./useUpdateEffect";

package/hooks/index.js

@@ -14,6 +14,7 @@ export * from "./useNavigateAway";
 export * from "./usePrevious";
 export * from "./usePreviousRef";
 export * from "./useScrollPosition";
+export * from "./useScrollThreshold";
 // export * from "./useScrollTo";
 export * from "./useSmoothScroll";
 export * from "./useTraceUpdate";

package/hooks/useScrollThreshold.d.ts

@@ -0,0 +1,2 @@
+export declare const useScrollThreshold: (threshold?: number, callback?: ((isAbove: boolean, isBelow: boolean) => void) | undefined) => boolean;
+export default useScrollThreshold;

package/hooks/useScrollThreshold.js

@@ -0,0 +1,28 @@
+import { useCallback, useEffect, useState } from "react";
+import { noop } from "@koine/utils";
+import { /* listenScroll, */ on } from "@koine/dom";
+export var useScrollThreshold = function (threshold, callback) {
+    var _a = useState(false), isBelow = _a[0], setIsBelow = _a[1];
+    var handler = useCallback(function () {
+        if (threshold) {
+            var posY = window.scrollY; // * -1;
+            var isAbove = posY < threshold;
+            var isBelow_1 = posY > threshold;
+            // console.log("useScrollThreshold setIsBelow", isBelow, posY, threshold);
+            setIsBelow(isBelow_1);
+            if (callback)
+                callback(isAbove, isBelow_1);
+        }
+    }, [threshold, callback]);
+    useEffect(function () {
+        if (threshold) {
+            // const listener = listenScroll(handler, 50);
+            var listener = on(window, "scroll", handler, { passive: true });
+            handler();
+            return listener;
+        }
+        return noop;
+    }, [threshold, handler]);
+    return isBelow;
+};
+export default useScrollThreshold;

package/hooks/useSmoothScroll.d.ts

@@ -1,2 +1,2 @@
-export declare function useSmoothScroll(): (to?: number | string, offset?: number, callback?: () => void, fallbackTimeout?: number, behavior?: ScrollBehavior) => void;
+export declare function useSmoothScroll(disregardFixedOffset?: boolean): (to?: number | string, offset?: number, callback?: () => void, fallbackTimeout?: number, behavior?: ScrollBehavior) => void;
 export default useSmoothScroll;

package/hooks/useSmoothScroll.js

@@ -2,7 +2,7 @@ import { useCallback } from "react";
 import { isNumber } from "@koine/utils";
 import { scrollTo } from "@koine/dom";
 import { useFixedOffset } from "./useFixedOffset";
-export function useSmoothScroll() {
+export function useSmoothScroll(disregardFixedOffset) {
     var fixedOffset = useFixedOffset();
     var scroll = useCallback(function (to, offset, callback, fallbackTimeout, behavior) {
         if (offset === void 0) { offset = 0; }
@@ -17,10 +17,10 @@ export function useSmoothScroll() {
             }
         }
         if (isNumber(top)) {
-            top = top + window.scrollY - (fixedOffset.current + offset);
+            top = top + offset + (disregardFixedOffset ? 0 : fixedOffset.current);
             scrollTo(top, callback, fallbackTimeout, behavior);
         }
-    }, [fixedOffset]);
+    }, [disregardFixedOffset, fixedOffset]);
     return scroll;
 }
 export default useSmoothScroll;

package/node/hooks/index.js

@@ -17,6 +17,7 @@ tslib_1.__exportStar(require("./useNavigateAway"), exports);
 tslib_1.__exportStar(require("./usePrevious"), exports);
 tslib_1.__exportStar(require("./usePreviousRef"), exports);
 tslib_1.__exportStar(require("./useScrollPosition"), exports);
+tslib_1.__exportStar(require("./useScrollThreshold"), exports);
 // export * from "./useScrollTo";
 tslib_1.__exportStar(require("./useSmoothScroll"), exports);
 tslib_1.__exportStar(require("./useTraceUpdate"), exports);

package/node/hooks/useScrollThreshold.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useScrollThreshold = void 0;
+var react_1 = require("react");
+var utils_1 = require("@koine/utils");
+var dom_1 = require("@koine/dom");
+var useScrollThreshold = function (threshold, callback) {
+    var _a = (0, react_1.useState)(false), isBelow = _a[0], setIsBelow = _a[1];
+    var handler = (0, react_1.useCallback)(function () {
+        if (threshold) {
+            var posY = window.scrollY; // * -1;
+            var isAbove = posY < threshold;
+            var isBelow_1 = posY > threshold;
+            // console.log("useScrollThreshold setIsBelow", isBelow, posY, threshold);
+            setIsBelow(isBelow_1);
+            if (callback)
+                callback(isAbove, isBelow_1);
+        }
+    }, [threshold, callback]);
+    (0, react_1.useEffect)(function () {
+        if (threshold) {
+            // const listener = listenScroll(handler, 50);
+            var listener = (0, dom_1.on)(window, "scroll", handler, { passive: true });
+            handler();
+            return listener;
+        }
+        return utils_1.noop;
+    }, [threshold, handler]);
+    return isBelow;
+};
+exports.useScrollThreshold = useScrollThreshold;
+exports.default = exports.useScrollThreshold;

package/node/hooks/useSmoothScroll.js

@@ -5,7 +5,7 @@ var react_1 = require("react");
 var utils_1 = require("@koine/utils");
 var dom_1 = require("@koine/dom");
 var useFixedOffset_1 = require("./useFixedOffset");
-function useSmoothScroll() {
+function useSmoothScroll(disregardFixedOffset) {
     var fixedOffset = (0, useFixedOffset_1.useFixedOffset)();
     var scroll = (0, react_1.useCallback)(function (to, offset, callback, fallbackTimeout, behavior) {
         if (offset === void 0) { offset = 0; }
@@ -20,10 +20,10 @@ function useSmoothScroll() {
             }
         }
         if ((0, utils_1.isNumber)(top)) {
-            top = top + window.scrollY - (fixedOffset.current + offset);
+            top = top + offset + (disregardFixedOffset ? 0 : fixedOffset.current);
             (0, dom_1.scrollTo)(top, callback, fallbackTimeout, behavior);
         }
-    }, [fixedOffset]);
+    }, [disregardFixedOffset, fixedOffset]);
     return scroll;
 }
 exports.useSmoothScroll = useSmoothScroll;

package/package.json

@@ -44,6 +44,26 @@
   },
   "main": "./node/index.js",
   "types": "./index.d.ts",
-  "version": "1.1.3",
+  "dependencies": {},
+  "peerDependencies": {
+    "styled-components": "5.3.6",
+    "framer-motion": "8.5.5",
+    "react": "18.2.0",
+    "@mui/base": "5.0.0-alpha.115",
+    "@koine/utils": "1.1.5",
+    "ts-debounce": "4.0.0",
+    "type-fest": "3.5.3",
+    "react-icons": "4.7.1",
+    "date-fns": "2.29.3",
+    "react-swipeable": "7.0.0",
+    "@tiptap/react": "2.0.0-beta.209",
+    "@tiptap/starter-kit": "2.0.0-beta.209",
+    "@kuus/yup": "1.0.0-beta.7",
+    "react-hook-form": "7.42.1",
+    "@koine/dom": "1.1.5",
+    "react-popper": "2.3.0",
+    "tslib": "2.5.0"
+  },
+  "version": "1.1.5",
   "module": "./index.js"
 }