@koine/react 2.0.0-beta.21 → 2.0.0-beta.211

package/useAsyncFn.js

@@ -1,33 +0,0 @@
-import { __assign, __read, __spreadArray } 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 = __read(useState(initialState), 2), 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, __spreadArray([], __read(args), false)).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/useDateLocale.d.ts

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

package/useDateLocale.js

@@ -1,28 +0,0 @@
-import { __awaiter, __generator, __read } from "tslib";
-import { useEffect, useState } from "react";
-export function useDateLocale(locale, defaultLocale) {
-    var _this = this;
-    if (defaultLocale === void 0) { defaultLocale = "en"; }
-    var _a = __read(useState(), 2), data = _a[0], setData = _a[1];
-    var _b = __read(useState(defaultLocale), 2), 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/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/useFixedOffset.js

@@ -1,42 +0,0 @@
-import { useRef } from "react";
-import { debounce } from "@koine/utils";
-import { $each, calculateFixedOffset, injectCss, listenResizeDebounced, } from "@koine/dom";
-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/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/useInterval.js

@@ -1,22 +0,0 @@
-import { __read, __spreadArray } from "tslib";
-import { useEffect, useRef } from "react";
-import { noop } from "@koine/utils";
-export function useInterval(callback, delay, deps) {
-    if (deps === void 0) { deps = []; }
-    var savedCallback = useRef();
-    useEffect(function () {
-        savedCallback.current = callback;
-    }, __spreadArray([callback], __read(deps), false));
-    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/useIsomorphicLayoutEffect.js

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

package/useKeyUp.js

@@ -1,18 +0,0 @@
-import { __read, __spreadArray } from "tslib";
-import { useEffect } from "react";
-import { on } from "@koine/dom";
-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], __read(deps), false));
-}
-export default useKeyUp;

package/useMeasure.js

@@ -1,130 +0,0 @@
-import { __read, __spreadArray } from "tslib";
-import { useEffect, useMemo, useRef, useState } from "react";
-import { debounce, noop } from "@koine/utils";
-import { listenResizeDebounced, listenScrollDebounced, off, on, } from "@koine/dom";
-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([], __read(result), false), __read(findScrollContainers(element.parentElement)), false);
-}
-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 = __read(useState({
-        left: 0,
-        top: 0,
-        width: 0,
-        height: 0,
-        bottom: 0,
-        right: 0,
-        x: 0,
-        y: 0,
-    }), 2), 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 = __read(useMemo(function () {
-        var callback = function () {
-            var _args = [];
-            for (var _i = 0; _i < arguments.length; _i++) {
-                _args[_i] = arguments[_i];
-            }
-            var _a = __read(state.current, 4), 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]), 3), forceRefresh = _c[0], scrollChange = _c[2];
-    function removeListeners() {
-        var _a = __read(state.current, 3), 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 = __read(state.current, 2), 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/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/useNavigateAway.js

@@ -1,25 +0,0 @@
-import { useEffect, useRef } from "react";
-import { on } from "@koine/dom";
-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/usePrevious.js

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

package/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/useScrollPosition.js

@@ -1,61 +0,0 @@
-import { useRef } from "react";
-import { isBrowser } from "@koine/utils";
-import { listenScroll } from "@koine/dom";
-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/useScrollThreshold.js

@@ -1,27 +0,0 @@
-import { __read } from "tslib";
-import { useCallback, useEffect, useState } from "react";
-import { noop } from "@koine/utils";
-import { listenScroll } from "@koine/dom";
-export var useScrollThreshold = function (threshold, callback) {
-    var _a = __read(useState(false), 2), 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/useScrollTo.js

@@ -1,23 +0,0 @@
-import { __read } from "tslib";
-import { isBrowser } from "@koine/utils";
-import useHeader from "./Header/useHeader.js";
-export function useScrollTo(id, offset) {
-    if (id === void 0) { id = ""; }
-    if (offset === void 0) { offset = 0; }
-    var _a = __read(useHeader(), 3), 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/useSmoothScroll.js

@@ -1,32 +0,0 @@
-import { useCallback } from "react";
-import { isNumber } from "@koine/utils";
-import { getOffsetTopSlim, scrollTo } from "@koine/dom";
-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/useSpinDelay.js

@@ -1,39 +0,0 @@
-import { __read } from "tslib";
-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 = __read(useState(State.IDLE), 2), 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/useTraceUpdate.js

@@ -1,19 +0,0 @@
-import { __read } from "tslib";
-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 _b = __read(_a, 2), k = _b[0], v = _b[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;

package/useUpdateEffect.js

@@ -1,11 +0,0 @@
-import { useEffect } from "react";
-import { useFirstMountState } from "./useFirstMountState.js";
-export var useUpdateEffect = function (effect, deps) {
-    var isFirstMount = useFirstMountState();
-    useEffect(function () {
-        if (!isFirstMount) {
-            return effect();
-        }
-    }, deps);
-};
-export default useUpdateEffect;

package/useWindowSize.js

@@ -1,20 +0,0 @@
-import { __read } from "tslib";
-import { useEffect, useState } from "react";
-import { listenResize, listenResizeDebounced } from "@koine/dom";
-export function useWindowSize(wait, immediate) {
-    var _a = __read(useState(0), 2), width = _a[0], widthSet = _a[1];
-    var _b = __read(useState(0), 2), height = _b[0], heightSet = _b[1];
-    useEffect(function () {
-        function updateSize() {
-            widthSet(window.innerWidth);
-            heightSet(window.innerHeight);
-        }
-        var listener = wait
-            ? listenResizeDebounced(0, updateSize, wait, immediate)
-            : listenResize(updateSize);
-        updateSize();
-        return listener;
-    }, [wait, immediate]);
-    return [width, height];
-}
-export default useWindowSize;