@koine/react 2.0.0-beta.5 → 2.0.0-beta.51

package/hooks/index.js

@@ -1,92 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    useAsyncFn: function() {
-        return _useAsyncFn.useAsyncFn;
-    },
-    useDateLocale: function() {
-        return _useDateLocale.useDateLocale;
-    },
-    useFirstMountState: function() {
-        return _useFirstMountState.useFirstMountState;
-    },
-    useFixedOffset: function() {
-        return _useFixedOffset.useFixedOffset;
-    },
-    useFocus: function() {
-        return _useFocus.useFocus;
-    },
-    useInterval: function() {
-        return _useInterval.useInterval;
-    },
-    useIsomorphicLayoutEffect: function() {
-        return _useIsomorphicLayoutEffect.useIsomorphicLayoutEffect;
-    },
-    useKeyUp: function() {
-        return _useKeyUp.useKeyUp;
-    },
-    useMeasure: function() {
-        return _useMeasure.useMeasure;
-    },
-    useMountedState: function() {
-        return _useMountedState.useMountedState;
-    },
-    useNavigateAway: function() {
-        return _useNavigateAway.useNavigateAway;
-    },
-    usePrevious: function() {
-        return _usePrevious.usePrevious;
-    },
-    usePreviousRef: function() {
-        return _usePreviousRef.usePreviousRef;
-    },
-    useScrollPosition: function() {
-        return _useScrollPosition.useScrollPosition;
-    },
-    useScrollThreshold: function() {
-        return _useScrollThreshold.useScrollThreshold;
-    },
-    useSmoothScroll: function() {
-        return _useSmoothScroll.useSmoothScroll;
-    },
-    useSpinDelay: function() {
-        return _useSpinDelay.useSpinDelay;
-    },
-    useTraceUpdate: function() {
-        return _useTraceUpdate.useTraceUpdate;
-    },
-    useUpdateEffect: function() {
-        return _useUpdateEffect.useUpdateEffect;
-    },
-    useWindowSize: function() {
-        return _useWindowSize.useWindowSize;
-    }
-});
-const _useAsyncFn = require("./useAsyncFn");
-const _useDateLocale = require("./useDateLocale");
-const _useFirstMountState = require("./useFirstMountState");
-const _useFixedOffset = require("./useFixedOffset");
-const _useFocus = require("./useFocus");
-const _useInterval = require("./useInterval");
-const _useIsomorphicLayoutEffect = require("./useIsomorphicLayoutEffect");
-const _useKeyUp = require("./useKeyUp");
-const _useMeasure = require("./useMeasure");
-const _useMountedState = require("./useMountedState");
-const _useNavigateAway = require("./useNavigateAway");
-const _usePrevious = require("./usePrevious");
-const _usePreviousRef = require("./usePreviousRef");
-const _useScrollPosition = require("./useScrollPosition");
-const _useScrollThreshold = require("./useScrollThreshold");
-const _useSmoothScroll = require("./useSmoothScroll");
-const _useSpinDelay = require("./useSpinDelay");
-const _useTraceUpdate = require("./useTraceUpdate");
-const _useUpdateEffect = require("./useUpdateEffect");
-const _useWindowSize = require("./useWindowSize");

package/hooks/index.mjs

@@ -1,21 +0,0 @@
-export { useAsyncFn } from "./useAsyncFn";
-export { useDateLocale } from "./useDateLocale";
-export { useFirstMountState } from "./useFirstMountState";
-export { useFixedOffset } from "./useFixedOffset";
-export { useFocus } from "./useFocus";
-export { useInterval } from "./useInterval";
-export { useIsomorphicLayoutEffect } from "./useIsomorphicLayoutEffect";
-export { useKeyUp } from "./useKeyUp";
-export { useMeasure } from "./useMeasure";
-export { useMountedState } from "./useMountedState";
-export { useNavigateAway } from "./useNavigateAway";
-export { usePrevious } from "./usePrevious";
-export { usePreviousRef } from "./usePreviousRef";
-export { useScrollPosition } from "./useScrollPosition";
-export { useScrollThreshold } from "./useScrollThreshold";
-// export { useScrollTo } from "./useScrollTo";
-export { useSmoothScroll } from "./useSmoothScroll";
-export { useSpinDelay } from "./useSpinDelay";
-export { useTraceUpdate } from "./useTraceUpdate";
-export { useUpdateEffect } from "./useUpdateEffect";
-export { useWindowSize } from "./useWindowSize";

package/hooks/types.d.ts

@@ -1,8 +0,0 @@
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/misc/types.ts)
- */
-export type PromiseType<P extends Promise<any>> = P extends Promise<infer T> ? T : never;
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/misc/types.ts)
- */
-export type FunctionReturningPromise = (...args: any[]) => Promise<any>;

package/hooks/types.js

@@ -1,6 +0,0 @@
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/misc/types.ts)
- */ "use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});

package/hooks/types.mjs

@@ -1,3 +0,0 @@
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/misc/types.ts)
- */ export { };

package/hooks/useAsyncFn.js

@@ -1,56 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    useAsyncFn: function() {
-        return useAsyncFn;
-    },
-    default: function() {
-        return _default;
-    }
-});
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
-const _useMountedState = require("./useMountedState");
-function useAsyncFn(fn, deps = [], initialState = {
-    loading: false
-}) {
-    const lastCallId = (0, _react.useRef)(0);
-    const isMounted = (0, _useMountedState.useMountedState)();
-    const [state, set] = (0, _react.useState)(initialState);
-    const callback = (0, _react.useCallback)((...args)=>{
-        const callId = ++lastCallId.current;
-        if (!state.loading) {
-            set((prevState)=>({
-                    ...prevState,
-                    loading: true
-                }));
-        }
-        return fn(...args).then((value)=>{
-            isMounted() && callId === lastCallId.current && set({
-                value,
-                loading: false
-            });
-            return value;
-        }, (error)=>{
-            isMounted() && callId === lastCallId.current && set({
-                error,
-                loading: false
-            });
-            return error;
-        });
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, deps);
-    return [
-        state,
-        callback
-    ];
-}
-const _default = useAsyncFn;

package/hooks/useAsyncFn.mjs

@@ -1,39 +0,0 @@
-import React, { useCallback, useRef, useState } from "react";
-import { useMountedState } from "./useMountedState";
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useAsyncFn.ts)
- */ export function useAsyncFn(fn, deps = [], initialState = {
-    loading: false
-}) {
-    const lastCallId = useRef(0);
-    const isMounted = useMountedState();
-    const [state, set] = useState(initialState);
-    const callback = useCallback((...args)=>{
-        const callId = ++lastCallId.current;
-        if (!state.loading) {
-            set((prevState)=>({
-                    ...prevState,
-                    loading: true
-                }));
-        }
-        return fn(...args).then((value)=>{
-            isMounted() && callId === lastCallId.current && set({
-                value,
-                loading: false
-            });
-            return value;
-        }, (error)=>{
-            isMounted() && callId === lastCallId.current && set({
-                error,
-                loading: false
-            });
-            return error;
-        });
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, deps);
-    return [
-        state,
-        callback
-    ];
-}
-export default useAsyncFn;

package/hooks/useDateLocale.d.ts

@@ -1,8 +0,0 @@
-/**
- * Dynamically import the date-fns correct locale
- *
- * Inspired by:
- * @see https://robertmarshall.dev/blog/dynamically-import-datefns-locale-mui-datepicker-localization/
- */
-export declare function useDateLocale(locale?: string, defaultLocale?: string): globalThis.Locale | undefined;
-export default useDateLocale;

package/hooks/useDateLocale.js

@@ -1,51 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    useDateLocale: function() {
-        return useDateLocale;
-    },
-    default: function() {
-        return _default;
-    }
-});
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _react = require("react");
-function useDateLocale(locale, defaultLocale = "en") {
-    const [data, setData] = (0, _react.useState)();
-    const [current, setCurrent] = (0, _react.useState)(defaultLocale);
-    // const [ready, setReady] = useState(false);
-    // If the user changes the locale listen to the change and import the locale that is now required.
-    (0, _react.useEffect)(()=>{
-        const importLocaleFile = async ()=>{
-            // This webpack option stops all of the date-fns files being imported and chunked.
-            // NB: this makes unnecessary numerous webpack chunks in applications
-            // that do not even use this hook, so we comment out the webpack dynamic
-            // import and its magic comment
-            // const localeToSet = await import(
-            //   /FIXME: * webpackMode: "lazy", webpackChunkName: "df-[index]", webpackExclude: /_lib/ */
-            //   `date-fns/locale/${locale}/index.js`,
-            // );
-            const localeToSet = await Promise.resolve(`date-fns/locale/en-US/index.js`).then((p)=>/*#__PURE__*/ _interop_require_wildcard._(require(p)));
-            setCurrent(locale || current);
-            setData(localeToSet.default);
-        // setReady(true);
-        };
-        // If the locale has not yet been loaded.
-        if (locale !== current) {
-            importLocaleFile();
-        }
-    }, [
-        locale,
-        current
-    ]);
-    return data;
-}
-const _default = useDateLocale;

package/hooks/useDateLocale.mjs

@@ -1,37 +0,0 @@
-import { useEffect, useState } from "react";
-/**
- * Dynamically import the date-fns correct locale
- *
- * Inspired by:
- * @see https://robertmarshall.dev/blog/dynamically-import-datefns-locale-mui-datepicker-localization/
- */ export function useDateLocale(locale, defaultLocale = "en") {
-    const [data, setData] = useState();
-    const [current, setCurrent] = useState(defaultLocale);
-    // const [ready, setReady] = useState(false);
-    // If the user changes the locale listen to the change and import the locale that is now required.
-    useEffect(()=>{
-        const importLocaleFile = async ()=>{
-            // This webpack option stops all of the date-fns files being imported and chunked.
-            // NB: this makes unnecessary numerous webpack chunks in applications
-            // that do not even use this hook, so we comment out the webpack dynamic
-            // import and its magic comment
-            // const localeToSet = await import(
-            //   /FIXME: * webpackMode: "lazy", webpackChunkName: "df-[index]", webpackExclude: /_lib/ */
-            //   `date-fns/locale/${locale}/index.js`,
-            // );
-            const localeToSet = await import(`date-fns/locale/en-US/index.js`);
-            setCurrent(locale || current);
-            setData(localeToSet.default);
-        // setReady(true);
-        };
-        // If the locale has not yet been loaded.
-        if (locale !== current) {
-            importLocaleFile();
-        }
-    }, [
-        locale,
-        current
-    ]);
-    return data;
-}
-export default useDateLocale;

package/hooks/useFirstMountState.js

@@ -1,28 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    useFirstMountState: function() {
-        return useFirstMountState;
-    },
-    default: function() {
-        return _default;
-    }
-});
-const _react = require("react");
-function useFirstMountState() {
-    const isFirst = (0, _react.useRef)(true);
-    if (isFirst.current) {
-        isFirst.current = false;
-        return true;
-    }
-    return isFirst.current;
-}
-const _default = useFirstMountState;

package/hooks/useFirstMountState.mjs

@@ -1,12 +0,0 @@
-import { useRef } from "react";
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useFirstMountState.ts)
- */ export function useFirstMountState() {
-    const isFirst = useRef(true);
-    if (isFirst.current) {
-        isFirst.current = false;
-        return true;
-    }
-    return isFirst.current;
-}
-export default useFirstMountState;

package/hooks/useFixedOffset.js

@@ -1,67 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    useFixedOffset: function() {
-        return useFixedOffset;
-    },
-    default: function() {
-        return _default;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _react = require("react");
-const _debounce = /*#__PURE__*/ _interop_require_default._(require("@koine/utils/debounce"));
-const _$each = /*#__PURE__*/ _interop_require_default._(require("@koine/dom/$each"));
-const _calculateFixedOffset = /*#__PURE__*/ _interop_require_default._(require("@koine/dom/calculateFixedOffset"));
-const _injectCss = /*#__PURE__*/ _interop_require_default._(require("@koine/dom/injectCss"));
-const _listenResizeDebounced = /*#__PURE__*/ _interop_require_default._(require("@koine/dom/listenResizeDebounced"));
-const _useIsomorphicLayoutEffect = /*#__PURE__*/ _interop_require_default._(require("./useIsomorphicLayoutEffect"));
-const inject = (value)=>{
-    (0, _injectCss.default)("useFixedOffset", `html{scroll-padding-top: ${value}px}`);
-};
-function useFixedOffset(selector) {
-    const fixedOffset = (0, _react.useRef)(0);
-    (0, _useIsomorphicLayoutEffect.default)(()=>{
-        const update = ()=>{
-            const newFixedOffset = (0, _calculateFixedOffset.default)();
-            fixedOffset.current = newFixedOffset;
-            // inject this CSS make the hashed deeplinks position the scroll at the
-            // right offset
-            inject(newFixedOffset);
-        };
-        update();
-        if (ResizeObserver) {
-            // const elements = $$("[data-fixed]");
-            const observer = new ResizeObserver((entries)=>{
-                let newFixedOffset = 0;
-                entries.forEach((entry)=>{
-                    newFixedOffset += entry.contentRect.height;
-                });
-                fixedOffset.current = newFixedOffset;
-                const updateOnResize = (0, _debounce.default)(()=>inject(newFixedOffset), 400, true);
-                updateOnResize();
-            });
-            (0, _$each.default)(selector || "[data-fixed]", ($el)=>{
-                if (observer) observer.observe($el);
-            });
-            return ()=>{
-                observer?.disconnect();
-            };
-        } else {
-            const listener = (0, _listenResizeDebounced.default)(0, update);
-            return listener;
-        }
-    }, [
-        selector
-    ]);
-    return fixedOffset;
-}
-const _default = useFixedOffset;

package/hooks/useFixedOffset.mjs

@@ -1,56 +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";
-const inject = (value)=>{
-    injectCss("useFixedOffset", `html{scroll-padding-top: ${value}px}`);
-};
-/**
- * # Use fixed offset
- *
- * Maybe use [ResizeObserver polyfill](https://github.com/juggle/resize-observer)
- *
- * @see https://web.dev/resize-observer/
- *
- * @param selector By default `[data-fixed]`: anyhting with the data attribute `data-fixed`
- */ export function useFixedOffset(selector) {
-    const fixedOffset = useRef(0);
-    useIsomorphicLayoutEffect(()=>{
-        const update = ()=>{
-            const newFixedOffset = calculateFixedOffset();
-            fixedOffset.current = newFixedOffset;
-            // inject this CSS make the hashed deeplinks position the scroll at the
-            // right offset
-            inject(newFixedOffset);
-        };
-        update();
-        if (ResizeObserver) {
-            // const elements = $$("[data-fixed]");
-            const observer = new ResizeObserver((entries)=>{
-                let newFixedOffset = 0;
-                entries.forEach((entry)=>{
-                    newFixedOffset += entry.contentRect.height;
-                });
-                fixedOffset.current = newFixedOffset;
-                const updateOnResize = debounce(()=>inject(newFixedOffset), 400, true);
-                updateOnResize();
-            });
-            $each(selector || "[data-fixed]", ($el)=>{
-                if (observer) observer.observe($el);
-            });
-            return ()=>{
-                observer?.disconnect();
-            };
-        } else {
-            const listener = listenResizeDebounced(0, update);
-            return listener;
-        }
-    }, [
-        selector
-    ]);
-    return fixedOffset;
-}
-export default useFixedOffset;

package/hooks/useFocus.js

@@ -1,30 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    useFocus: function() {
-        return useFocus;
-    },
-    default: function() {
-        return _default;
-    }
-});
-const _react = require("react");
-const useFocus = ()=>{
-    const elementRef = (0, _react.useRef)(null);
-    const setFocus = ()=>{
-        elementRef.current && elementRef.current.focus();
-    };
-    return [
-        elementRef,
-        setFocus
-    ];
-};
-const _default = useFocus;

package/hooks/useFocus.mjs

@@ -1,14 +0,0 @@
-import { useRef } from "react";
-/**
- * @see https://stackoverflow.com/a/54159564/1938970
- */ export const useFocus = ()=>{
-    const elementRef = useRef(null);
-    const setFocus = ()=>{
-        elementRef.current && elementRef.current.focus();
-    };
-    return [
-        elementRef,
-        setFocus
-    ];
-};
-export default useFocus;

package/hooks/useInterval.js

@@ -1,44 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    useInterval: function() {
-        return useInterval;
-    },
-    default: function() {
-        return _default;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _react = require("react");
-const _noop = /*#__PURE__*/ _interop_require_default._(require("@koine/utils/noop"));
-function useInterval(callback, delay, deps = []) {
-    const savedCallback = (0, _react.useRef)();
-    (0, _react.useEffect)(()=>{
-        savedCallback.current = callback;
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [
-        callback,
-        ...deps
-    ]);
-    (0, _react.useEffect)(()=>{
-        function tick() {
-            if (savedCallback.current) savedCallback.current();
-        }
-        if (delay !== null) {
-            const id = setInterval(tick, delay);
-            return ()=>clearInterval(id);
-        }
-        return _noop.default;
-    }, [
-        delay
-    ]);
-}
-const _default = useInterval;

package/hooks/useInterval.mjs

@@ -1,29 +0,0 @@
-import { useEffect, useRef } from "react";
-import noop from "@koine/utils/noop";
-/**
- * @borrows [dan abramov](https://overreacted.io/making-setinterval-declarative-with-react-hooks/)
- *
- * We just add `deps` array argument and typescript support
- */ export function useInterval(callback, delay, deps = []) {
-    const savedCallback = useRef();
-    useEffect(()=>{
-        savedCallback.current = callback;
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [
-        callback,
-        ...deps
-    ]);
-    useEffect(()=>{
-        function tick() {
-            if (savedCallback.current) savedCallback.current();
-        }
-        if (delay !== null) {
-            const id = setInterval(tick, delay);
-            return ()=>clearInterval(id);
-        }
-        return noop;
-    }, [
-        delay
-    ]);
-}
-export default useInterval;

package/hooks/useIsomorphicLayoutEffect.js

@@ -1,23 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    useIsomorphicLayoutEffect: function() {
-        return useIsomorphicLayoutEffect;
-    },
-    default: function() {
-        return _default;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _react = require("react");
-const _isBrowser = /*#__PURE__*/ _interop_require_default._(require("@koine/utils/isBrowser"));
-const useIsomorphicLayoutEffect = _isBrowser.default ? _react.useLayoutEffect : _react.useEffect;
-const _default = useIsomorphicLayoutEffect;

package/hooks/useIsomorphicLayoutEffect.mjs

@@ -1,6 +0,0 @@
-import { useEffect, useLayoutEffect } from "react";
-import isBrowser from "@koine/utils/isBrowser";
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useIsomorphicLayoutEffect.ts)
- */ export const useIsomorphicLayoutEffect = isBrowser ? useLayoutEffect : useEffect;
-export default useIsomorphicLayoutEffect;