@koine/react 2.0.0-beta.15 → 2.0.0-beta.151

package/hooks/useAsyncFn.js

@@ -1,33 +0,0 @@
-import { __assign } from "tslib";
-import { useCallback, useRef, useState } from "react";
-import { useMountedState } from "./useMountedState.js";
-export function useAsyncFn(fn, deps, initialState) {
-    if (deps === void 0) { deps = []; }
-    if (initialState === void 0) { initialState = { loading: false }; }
-    var lastCallId = useRef(0);
-    var isMounted = useMountedState();
-    var _a = useState(initialState), state = _a[0], set = _a[1];
-    var callback = useCallback(function () {
-        var args = [];
-        for (var _i = 0; _i < arguments.length; _i++) {
-            args[_i] = arguments[_i];
-        }
-        var callId = ++lastCallId.current;
-        if (!state.loading) {
-            set(function (prevState) { return (__assign(__assign({}, prevState), { loading: true })); });
-        }
-        return fn.apply(void 0, args).then(function (value) {
-            isMounted() &&
-                callId === lastCallId.current &&
-                set({ value: value, loading: false });
-            return value;
-        }, function (error) {
-            isMounted() &&
-                callId === lastCallId.current &&
-                set({ error: error, loading: false });
-            return error;
-        });
-    }, deps);
-    return [state, callback];
-}
-export default useAsyncFn;

package/hooks/useDateLocale.d.ts

@@ -1,2 +0,0 @@
-export declare function useDateLocale(locale?: string, defaultLocale?: string): globalThis.Locale | undefined;
-export default useDateLocale;

package/hooks/useDateLocale.js

@@ -1,28 +0,0 @@
-import { __awaiter, __generator } from "tslib";
-import { useEffect, useState } from "react";
-export function useDateLocale(locale, defaultLocale) {
-    var _this = this;
-    if (defaultLocale === void 0) { defaultLocale = "en"; }
-    var _a = useState(), data = _a[0], setData = _a[1];
-    var _b = useState(defaultLocale), current = _b[0], setCurrent = _b[1];
-    useEffect(function () {
-        var importLocaleFile = function () { return __awaiter(_this, void 0, void 0, function () {
-            var localeToSet;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4, import("date-fns/locale/en-US/index.js")];
-                    case 1:
-                        localeToSet = _a.sent();
-                        setCurrent(locale || current);
-                        setData(localeToSet.default);
-                        return [2];
-                }
-            });
-        }); };
-        if (locale !== current) {
-            importLocaleFile();
-        }
-    }, [locale, current]);
-    return data;
-}
-export default useDateLocale;

package/hooks/useFirstMountState.d.ts

@@ -1,2 +0,0 @@
-export declare function useFirstMountState(): boolean;
-export default useFirstMountState;

package/hooks/useFirstMountState.js

@@ -1,10 +0,0 @@
-import { useRef } from "react";
-export function useFirstMountState() {
-    var isFirst = useRef(true);
-    if (isFirst.current) {
-        isFirst.current = false;
-        return true;
-    }
-    return isFirst.current;
-}
-export default useFirstMountState;

package/hooks/useFixedOffset.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-export declare function useFixedOffset(selector?: string): import("react").MutableRefObject<number>;
-export default useFixedOffset;

package/hooks/useFixedOffset.js

@@ -1,45 +0,0 @@
-import { useRef } from "react";
-import debounce from "@koine/utils/debounce";
-import $each from "@koine/dom/$each";
-import calculateFixedOffset from "@koine/dom/calculateFixedOffset";
-import injectCss from "@koine/dom/injectCss";
-import listenResizeDebounced from "@koine/dom/listenResizeDebounced";
-import useIsomorphicLayoutEffect from "./useIsomorphicLayoutEffect.js";
-var inject = function (value) {
-    injectCss("useFixedOffset", "html{scroll-padding-top: ".concat(value, "px}"));
-};
-export function useFixedOffset(selector) {
-    var fixedOffset = useRef(0);
-    useIsomorphicLayoutEffect(function () {
-        var update = function () {
-            var newFixedOffset = calculateFixedOffset();
-            fixedOffset.current = newFixedOffset;
-            inject(newFixedOffset);
-        };
-        update();
-        if (ResizeObserver) {
-            var observer_1 = new ResizeObserver(function (entries) {
-                var newFixedOffset = 0;
-                entries.forEach(function (entry) {
-                    newFixedOffset += entry.contentRect.height;
-                });
-                fixedOffset.current = newFixedOffset;
-                var updateOnResize = debounce(function () { return inject(newFixedOffset); }, 400, true);
-                updateOnResize();
-            });
-            $each(selector || "[data-fixed]", function ($el) {
-                if (observer_1)
-                    observer_1.observe($el);
-            });
-            return function () {
-                observer_1 === null || observer_1 === void 0 ? void 0 : observer_1.disconnect();
-            };
-        }
-        else {
-            var listener = listenResizeDebounced(0, update);
-            return listener;
-        }
-    }, [selector]);
-    return fixedOffset;
-}
-export default useFixedOffset;

package/hooks/useFocus.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-export declare const useFocus: () => (import("react").RefObject<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement> | (() => void))[];
-export default useFocus;

package/hooks/useFocus.js

@@ -1,9 +0,0 @@
-import { useRef } from "react";
-export var useFocus = function () {
-    var elementRef = useRef(null);
-    var setFocus = function () {
-        elementRef.current && elementRef.current.focus();
-    };
-    return [elementRef, setFocus];
-};
-export default useFocus;

package/hooks/useInterval.d.ts

@@ -1,2 +0,0 @@
-export declare function useInterval<T extends () => unknown>(callback: T, delay: number, deps?: unknown[]): void;
-export default useInterval;

package/hooks/useInterval.js

@@ -1,22 +0,0 @@
-import { __spreadArray } from "tslib";
-import { useEffect, useRef } from "react";
-import noop from "@koine/utils/noop";
-export function useInterval(callback, delay, deps) {
-    if (deps === void 0) { deps = []; }
-    var savedCallback = useRef();
-    useEffect(function () {
-        savedCallback.current = callback;
-    }, __spreadArray([callback], deps, true));
-    useEffect(function () {
-        function tick() {
-            if (savedCallback.current)
-                savedCallback.current();
-        }
-        if (delay !== null) {
-            var id_1 = setInterval(tick, delay);
-            return function () { return clearInterval(id_1); };
-        }
-        return noop;
-    }, [delay]);
-}
-export default useInterval;

package/hooks/useIsomorphicLayoutEffect.d.ts

@@ -1,3 +0,0 @@
-import { useEffect } from "react";
-export declare const useIsomorphicLayoutEffect: typeof useEffect;
-export default useIsomorphicLayoutEffect;

package/hooks/useIsomorphicLayoutEffect.js

@@ -1,6 +0,0 @@
-import { useEffect, useLayoutEffect } from "react";
-import isBrowser from "@koine/utils/isBrowser";
-export var useIsomorphicLayoutEffect = isBrowser
-    ? useLayoutEffect
-    : useEffect;
-export default useIsomorphicLayoutEffect;

package/hooks/useKeyUp.d.ts

@@ -1,2 +0,0 @@
-export declare function useKeyUp(callback: (event: KeyboardEvent) => void, deps?: unknown[]): void;
-export default useKeyUp;

package/hooks/useKeyUp.js

@@ -1,18 +0,0 @@
-import { __spreadArray } from "tslib";
-import { useEffect } from "react";
-import on from "@koine/dom/on";
-export function useKeyUp(callback, deps) {
-    if (deps === void 0) { deps = []; }
-    useEffect(function () {
-        var listener = on(window, "keyup", function (event) {
-            if (!event.ctrlKey &&
-                !event.altKey &&
-                !event.shiftKey &&
-                !event.metaKey) {
-                callback(event);
-            }
-        });
-        return listener;
-    }, __spreadArray([callback], deps, true));
-}
-export default useKeyUp;

package/hooks/useMeasure.js

@@ -1,134 +0,0 @@
-import { __spreadArray } from "tslib";
-import { useEffect, useMemo, useRef, useState } from "react";
-import debounce from "@koine/utils/debounce";
-import noop from "@koine/utils/noop";
-import listenResizeDebounced from "@koine/dom/listenResizeDebounced";
-import listenScrollDebounced from "@koine/dom/listenScrollDebounced";
-import off from "@koine/dom/off";
-import on from "@koine/dom/on";
-var observer;
-function findScrollContainers(element) {
-    var result = [];
-    if (!element || element === document.body)
-        return result;
-    var _a = window.getComputedStyle(element), overflow = _a.overflow, overflowX = _a.overflowX, overflowY = _a.overflowY;
-    if ([overflow, overflowX, overflowY].some(function (prop) { return prop === "auto" || prop === "scroll"; }))
-        result.push(element);
-    return __spreadArray(__spreadArray([], result, true), findScrollContainers(element.parentElement), true);
-}
-var keys = [
-    "x",
-    "y",
-    "top",
-    "bottom",
-    "left",
-    "right",
-    "width",
-    "height",
-];
-var areBoundsEqual = function (a, b) {
-    return keys.every(function (key) { return a[key] === b[key]; });
-};
-export function useMeasure(options) {
-    var _a = (options || {}).scroll, scroll = _a === void 0 ? false : _a;
-    var _b = useState({
-        left: 0,
-        top: 0,
-        width: 0,
-        height: 0,
-        bottom: 0,
-        right: 0,
-        x: 0,
-        y: 0,
-    }), bounds = _b[0], setBounds = _b[1];
-    var state = useRef([
-        null,
-        null,
-        null,
-        bounds,
-    ]);
-    var mounted = useRef(false);
-    useEffect(function () {
-        mounted.current = true;
-        return function () { return void (mounted.current = false); };
-    }, []);
-    var _c = useMemo(function () {
-        var callback = function () {
-            var _args = [];
-            for (var _i = 0; _i < arguments.length; _i++) {
-                _args[_i] = arguments[_i];
-            }
-            var _a = state.current, element = _a[0], lastBounds = _a[3];
-            if (!element)
-                return;
-            var size = element.getBoundingClientRect();
-            Object.freeze(size);
-            if (mounted.current && !areBoundsEqual(lastBounds, size)) {
-                state.current[3] = size;
-                setBounds(size);
-            }
-        };
-        var debouncedCallback = debounce(callback);
-        return [callback, debouncedCallback, debouncedCallback];
-    }, [setBounds]), forceRefresh = _c[0], scrollChange = _c[2];
-    function removeListeners() {
-        var _a = state.current, scrollContainers = _a[1], resizeObserver = _a[2];
-        if (scrollContainers) {
-            scrollContainers.forEach(function (element) {
-                return off(element, "scroll", scrollChange);
-            });
-            state.current[1] = null;
-        }
-        if (resizeObserver) {
-            resizeObserver.disconnect();
-            state.current[2] = null;
-        }
-    }
-    function addListeners() {
-        var _a = state.current, element = _a[0], scrollContainers = _a[1];
-        if (!element)
-            return;
-        if (!observer && ResizeObserver) {
-            observer = new ResizeObserver(scrollChange);
-            state.current[2] = observer;
-            observer.observe(element);
-            if (scroll && scrollContainers) {
-                scrollContainers.forEach(function (scrollContainer) {
-                    return on(scrollContainer, "scroll", scrollChange, {
-                        capture: true,
-                        passive: true,
-                    });
-                });
-            }
-        }
-    }
-    var ref = function (node) {
-        if (!node || node === state.current[0])
-            return;
-        removeListeners();
-        state.current[0] = node;
-        state.current[1] = findScrollContainers(node);
-        addListeners();
-    };
-    useEffect(function () {
-        if (scroll) {
-            var listener = listenScrollDebounced(0, forceRefresh, 100);
-            return listener;
-        }
-        return noop;
-    }, [scroll, forceRefresh]);
-    useEffect(function () {
-        var listener = listenResizeDebounced(0, forceRefresh, 100);
-        return listener;
-    }, [forceRefresh]);
-    useEffect(function () {
-        removeListeners();
-        addListeners();
-    }, [scroll]);
-    useEffect(function () {
-        forceRefresh();
-        return removeListeners;
-    }, []);
-    return [ref, bounds, forceRefresh];
-}
-export default useMeasure;

package/hooks/useMountedState.d.ts

@@ -1,2 +0,0 @@
-export declare function useMountedState(): () => boolean;
-export default useMountedState;

package/hooks/useMountedState.js

@@ -1,13 +0,0 @@
-import { useCallback, useEffect, useRef } from "react";
-export function useMountedState() {
-    var mountedRef = useRef(false);
-    var get = useCallback(function () { return mountedRef.current; }, []);
-    useEffect(function () {
-        mountedRef.current = true;
-        return function () {
-            mountedRef.current = false;
-        };
-    }, []);
-    return get;
-}
-export default useMountedState;

package/hooks/useNavigateAway.d.ts

@@ -1,3 +0,0 @@
-export type UseNavigateAwayHandler = (event: BeforeUnloadEvent) => string | boolean;
-export declare const useNavigateAway: (handler: UseNavigateAwayHandler) => void;
-export default useNavigateAway;

package/hooks/useNavigateAway.js

@@ -1,25 +0,0 @@
-import { useEffect, useRef } from "react";
-import on from "@koine/dom/on";
-export var useNavigateAway = function (handler) {
-    var beforeUnloadHandlerRef = useRef();
-    useEffect(function () {
-        beforeUnloadHandlerRef.current = function (event) {
-            var customMessageOrCondition = handler(event);
-            if (customMessageOrCondition) {
-                event.preventDefault();
-            }
-            if (typeof customMessageOrCondition === "string") {
-                return (event.returnValue = customMessageOrCondition);
-            }
-            if (event.defaultPrevented) {
-                return (event.returnValue = "");
-            }
-            return;
-        };
-    }, [handler]);
-    useEffect(function () {
-        var listenerBeforeunload = on(window, "beforeunload", function (event) { var _a; return (_a = beforeUnloadHandlerRef.current) === null || _a === void 0 ? void 0 : _a.call(beforeUnloadHandlerRef, event); });
-        return listenerBeforeunload;
-    }, []);
-};
-export default useNavigateAway;

package/hooks/usePrevious.d.ts

@@ -1,2 +0,0 @@
-export declare function usePrevious<T>(state: T, defaulValue: T): T;
-export default usePrevious;

package/hooks/usePrevious.js

@@ -1,9 +0,0 @@
-import { useState } from "react";
-export function usePrevious(state, defaulValue) {
-    var _a = useState([state, defaulValue]), tuple = _a[0], setTuple = _a[1];
-    if (tuple[1] !== state) {
-        setTuple([tuple[1], state]);
-    }
-    return tuple[0];
-}
-export default usePrevious;

package/hooks/usePreviousRef.d.ts

@@ -1,2 +0,0 @@
-export declare function usePreviousRef<T>(value: T): T | undefined;
-export default usePreviousRef;

package/hooks/usePreviousRef.js

@@ -1,9 +0,0 @@
-import { useEffect, useRef } from "react";
-export function usePreviousRef(value) {
-    var ref = useRef();
-    useEffect(function () {
-        ref.current = value;
-    });
-    return ref.current;
-}
-export default usePreviousRef;

package/hooks/useScrollPosition.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-type Position = {
-    x: number;
-    y: number;
-};
-type ElementRef = React.MutableRefObject<HTMLElement | undefined>;
-export declare const useScrollPosition: (effect: (currentPosition: Position, prevPosition: Position) => void, deps?: import("react").DependencyList, element?: ElementRef, boundingElement?: ElementRef, wait?: number) => void;
-export default useScrollPosition;

package/hooks/useScrollPosition.js

@@ -1,61 +0,0 @@
-import { useRef } from "react";
-import isBrowser from "@koine/utils/isBrowser";
-import listenScroll from "@koine/dom/listenScroll";
-import useIsomorphicLayoutEffect from "./useIsomorphicLayoutEffect.js";
-var zeroPosition = { x: 0, y: 0 };
-var getClientRect = function (element) {
-    return element === null || element === void 0 ? void 0 : element.getBoundingClientRect();
-};
-var getScrollPosition = function (element, boundingElement) {
-    if (!isBrowser) {
-        return zeroPosition;
-    }
-    if (!boundingElement) {
-        return { x: window.scrollX, y: window.scrollY };
-    }
-    var targetPosition = getClientRect((element === null || element === void 0 ? void 0 : element.current) || document.body);
-    var containerPosition = getClientRect(boundingElement.current);
-    if (!targetPosition) {
-        return zeroPosition;
-    }
-    return containerPosition
-        ? {
-            x: (containerPosition.x || 0) - (targetPosition.x || 0),
-            y: (containerPosition.y || 0) - (targetPosition.y || 0),
-        }
-        : { x: targetPosition.left, y: targetPosition.top };
-};
-export var useScrollPosition = function (effect, deps, element, boundingElement, wait) {
-    if (deps === void 0) { deps = []; }
-    var position = useRef(getScrollPosition(null, boundingElement));
-    var throttleTimeout = null;
-    var callBack = function () {
-        var current = getScrollPosition(element, boundingElement);
-        effect(current, position.current);
-        position.current = current;
-        throttleTimeout = null;
-    };
-    useIsomorphicLayoutEffect(function () {
-        if (!isBrowser) {
-            return undefined;
-        }
-        var handleScroll = function () {
-            if (wait) {
-                if (throttleTimeout === null) {
-                    throttleTimeout = window.setTimeout(callBack, wait);
-                }
-            }
-            else {
-                callBack();
-            }
-        };
-        var listener = listenScroll(handleScroll, boundingElement === null || boundingElement === void 0 ? void 0 : boundingElement.current);
-        return function () {
-            listener();
-            if (throttleTimeout) {
-                clearTimeout(throttleTimeout);
-            }
-        };
-    }, deps);
-};
-export default useScrollPosition;

package/hooks/useScrollThreshold.d.ts

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

package/hooks/useScrollThreshold.js

@@ -1,26 +0,0 @@
-import { useCallback, useEffect, useState } from "react";
-import noop from "@koine/utils/noop";
-import listenScroll from "@koine/dom/listenScroll";
-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;
-            var isAbove = posY < threshold;
-            var isBelow_1 = posY > threshold;
-            setIsBelow(isBelow_1);
-            if (callback)
-                callback(isAbove, isBelow_1);
-        }
-    }, [threshold, callback]);
-    useEffect(function () {
-        if (threshold) {
-            var listener = listenScroll(handler);
-            handler();
-            return listener;
-        }
-        return noop;
-    }, [threshold, handler]);
-    return isBelow;
-};
-export default useScrollThreshold;

package/hooks/useScrollTo.d.ts

@@ -1,2 +0,0 @@
-export declare function useScrollTo(id?: string, offset?: number): void;
-export default useScrollTo;

package/hooks/useScrollTo.js

@@ -1,22 +0,0 @@
-import isBrowser from "@koine/utils/isBrowser";
-import useHeader from "../Header/useHeader.js";
-export function useScrollTo(id, offset) {
-    if (id === void 0) { id = ""; }
-    if (offset === void 0) { offset = 0; }
-    var _a = useHeader(), headerHeight = _a[2];
-    if (!isBrowser) {
-        return;
-    }
-    var headerOffset = headerHeight || 0;
-    var element = document.getElementById(id);
-    var top = 0;
-    if (element && element.offsetParent) {
-        do {
-            top += element.offsetTop;
-        } while ((element = element.offsetParent));
-    }
-    top -= offset;
-    top -= headerOffset;
-    window.scroll(0, top);
-}
-export default useScrollTo;

package/hooks/useSmoothScroll.d.ts

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

package/hooks/useSmoothScroll.js

@@ -1,33 +0,0 @@
-import { useCallback } from "react";
-import isNumber from "@koine/utils/isNumber";
-import getOffsetTopSlim from "@koine/dom/getOffsetTopSlim";
-import scrollTo from "@koine/dom/scrollTo";
-import useFixedOffset from "./useFixedOffset.js";
-export function useSmoothScroll(disregardAutomaticFixedOffset) {
-    var fixedOffset = useFixedOffset();
-    var scroll = useCallback(function (to, customOffset, callback, fallbackTimeout, behavior) {
-        var top = undefined;
-        var toIsElement = false;
-        if (isNumber(to)) {
-            top = to;
-        }
-        else if (to) {
-            var el = document.getElementById(to);
-            if (el) {
-                top = getOffsetTopSlim(el) - fixedOffset.current;
-                toIsElement = true;
-            }
-        }
-        if (isNumber(top)) {
-            top =
-                top +
-                    (customOffset || 0) +
-                    (disregardAutomaticFixedOffset || toIsElement
-                        ? 0
-                        : fixedOffset.current);
-            scrollTo(top, callback, fallbackTimeout, behavior);
-        }
-    }, [disregardAutomaticFixedOffset, fixedOffset]);
-    return scroll;
-}
-export default useSmoothScroll;

package/hooks/useSpinDelay.d.ts

@@ -1,2 +0,0 @@
-export declare function useSpinDelay(loading: boolean, delay?: number, minDuration?: number): boolean;
-export default useSpinDelay;

package/hooks/useSpinDelay.js

@@ -1,38 +0,0 @@
-import { useEffect, useRef, useState } from "react";
-var State;
-(function (State) {
-    State[State["IDLE"] = 0] = "IDLE";
-    State[State["DELAY"] = 1] = "DELAY";
-    State[State["DISPLAY"] = 2] = "DISPLAY";
-    State[State["EXPIRE"] = 3] = "EXPIRE";
-})(State || (State = {}));
-export function useSpinDelay(loading, delay, minDuration) {
-    if (delay === void 0) { delay = 500; }
-    if (minDuration === void 0) { minDuration = 200; }
-    var _a = useState(State.IDLE), state = _a[0], setState = _a[1];
-    var timeout = useRef();
-    useEffect(function () {
-        if (loading && state === State.IDLE) {
-            clearTimeout(timeout.current);
-            timeout.current = setTimeout(function () {
-                if (!loading) {
-                    return setState(State.IDLE);
-                }
-                timeout.current = setTimeout(function () {
-                    setState(State.EXPIRE);
-                }, minDuration);
-                setState(State.DISPLAY);
-            }, delay);
-            setState(State.DELAY);
-        }
-        if (!loading && state !== State.DISPLAY) {
-            clearTimeout(timeout.current);
-            setState(State.IDLE);
-        }
-    }, [loading, state, delay, minDuration]);
-    useEffect(function () {
-        return function () { return clearTimeout(timeout.current); };
-    }, []);
-    return state === State.DISPLAY || state === State.EXPIRE;
-}
-export default useSpinDelay;

package/hooks/useTraceUpdate.d.ts

@@ -1,2 +0,0 @@
-export declare function useTraceUpdate(props: any): void;
-export default useTraceUpdate;

package/hooks/useTraceUpdate.js

@@ -1,18 +0,0 @@
-import { useEffect, useRef } from "react";
-export function useTraceUpdate(props) {
-    var prev = useRef(props);
-    useEffect(function () {
-        var changedProps = Object.entries(props).reduce(function (ps, _a) {
-            var k = _a[0], v = _a[1];
-            if (prev.current[k] !== v) {
-                ps[k] = [prev.current[k], v];
-            }
-            return ps;
-        }, {});
-        if (Object.keys(changedProps).length > 0) {
-            console.info("[@koine/react:useTraceUpdate] changed props:", changedProps);
-        }
-        prev.current = props;
-    });
-}
-export default useTraceUpdate;