@koine/react 1.0.11 → 1.0.14

package/node/hooks/useDateLocale.js

@@ -1,56 +0,0 @@
-"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useDateLocale = void 0;
-const react_1 = require("react");
-/**
- * Dynamically import the date-fns correct locale
- *
- * Inspired by:
- * @see https://robertmarshall.dev/blog/dynamically-import-datefns-locale-mui-datepicker-localization/
- */
-function useDateLocale(locale, defaultLocale = "en") {
-    const [data, setData] = (0, react_1.useState)();
-    const [current, setCurrent] = (0, react_1.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_1.useEffect)(() => {
-        const importLocaleFile = async () => {
-            // This webpack option stops all of the date-fns files being imported and chunked.
-            const localeToSet = await Promise.resolve().then(() => __importStar(require(
-            /* webpackMode: "lazy", webpackChunkName: "df-[index]", webpackExclude: /_lib/ */
-            `date-fns/locale/${locale}/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;
-}
-exports.useDateLocale = useDateLocale;

package/node/hooks/useEffectOnce.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useEffectOnce = void 0;
-const react_1 = require("react");
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useEffectOnce.ts)
- */
-const useEffectOnce = (effect) => {
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    (0, react_1.useEffect)(effect, []);
-};
-exports.useEffectOnce = useEffectOnce;

package/node/hooks/useFirstMountState.js

@@ -1,16 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useFirstMountState = void 0;
-const react_1 = require("react");
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useFirstMountState.ts)
- */
-function useFirstMountState() {
-    const isFirst = (0, react_1.useRef)(true);
-    if (isFirst.current) {
-        isFirst.current = false;
-        return true;
-    }
-    return isFirst.current;
-}
-exports.useFirstMountState = useFirstMountState;

package/node/hooks/useFocus.js

@@ -1,15 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useFocus = void 0;
-const react_1 = require("react");
-/**
- * @see https://stackoverflow.com/a/54159564/1938970
- */
-const useFocus = () => {
-    const element = (0, react_1.useRef)(null);
-    const setFocus = () => {
-        element.current && element.current.focus();
-    };
-    return [element, setFocus];
-};
-exports.useFocus = useFocus;

package/node/hooks/useId.js

@@ -1,11 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useId = void 0;
-const utils_1 = require("@koine/utils");
-/**
- * FIXME: once we can move to react 18 just replace this import with `{ useId } from "react";`
- */
-function useId(prefix = "uid") {
-    return `${prefix}-${(0, utils_1.uid)()}`;
-}
-exports.useId = useId;

package/node/hooks/useIsomorphicLayoutEffect.js

@@ -1,11 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useIsomorphicLayoutEffect = void 0;
-const react_1 = require("react");
-const utils_1 = require("@koine/utils");
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useFirstMountState.ts)
- */
-exports.useIsomorphicLayoutEffect = utils_1.isBrowser
-    ? react_1.useLayoutEffect
-    : react_1.useEffect;

package/node/hooks/useMount.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMount = void 0;
-const useEffectOnce_1 = require("./useEffectOnce");
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useMount.ts)
- */
-const useMount = (fn) => {
-    (0, useEffectOnce_1.useEffectOnce)(() => {
-        fn();
-    });
-};
-exports.useMount = useMount;

package/node/hooks/useMountedState.js

@@ -1,19 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMountedState = void 0;
-const react_1 = require("react");
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useMountedState.ts)
- */
-function useMountedState() {
-    const mountedRef = (0, react_1.useRef)(false);
-    const get = (0, react_1.useCallback)(() => mountedRef.current, []);
-    (0, react_1.useEffect)(() => {
-        mountedRef.current = true;
-        return () => {
-            mountedRef.current = false;
-        };
-    }, []);
-    return get;
-}
-exports.useMountedState = useMountedState;

package/node/hooks/usePrevious.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.usePrevious = void 0;
-const react_1 = require("react");
-function usePrevious(value) {
-    const ref = (0, react_1.useRef)();
-    (0, react_1.useEffect)(() => {
-        ref.current = value;
-    });
-    return ref.current;
-}
-exports.usePrevious = usePrevious;

package/node/hooks/useScrollPosition.js

@@ -1,79 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useScrollPosition = void 0;
-const react_1 = require("react");
-const utils_1 = require("@koine/utils");
-const useIsomorphicLayoutEffect_1 = require("./useIsomorphicLayoutEffect");
-const zeroPosition = { x: 0, y: 0 };
-const getClientRect = (element) => element?.getBoundingClientRect();
-const getScrollPosition = (element, useWindow, boundingElement) => {
-    if (!utils_1.isBrowser) {
-        return zeroPosition;
-    }
-    if (useWindow) {
-        return { x: window.scrollX, y: window.scrollY };
-    }
-    const targetPosition = getClientRect(element?.current || document.body);
-    const 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 };
-};
-/**
- * @borrows [@n8tb1t/use-scroll-position@2.0.3](https://github.com/n8tb1t/use-scroll-position) by `n8tb1t <n8tb1t@gmail.com>`
- *
- * We've just:
- * - reused internal helper functions
- * - compacted object arguments in functions as plain argument list to improve compression
- */
-const useScrollPosition = (effect, deps = [], element, useWindow, wait, boundingElement) => {
-    const position = (0, react_1.useRef)(getScrollPosition(null, useWindow, boundingElement));
-    let throttleTimeout = null;
-    const callBack = () => {
-        const current = getScrollPosition(element, useWindow, boundingElement);
-        effect(current, position.current);
-        position.current = current;
-        throttleTimeout = null;
-    };
-    (0, useIsomorphicLayoutEffect_1.useIsomorphicLayoutEffect)(() => {
-        if (!utils_1.isBrowser) {
-            return undefined;
-        }
-        const handleScroll = () => {
-            if (wait) {
-                if (throttleTimeout === null) {
-                    throttleTimeout = window.setTimeout(callBack, wait);
-                }
-            }
-            else {
-                callBack();
-            }
-        };
-        if (boundingElement) {
-            boundingElement.current?.addEventListener("scroll", handleScroll, {
-                passive: true,
-            });
-        }
-        else {
-            window.addEventListener("scroll", handleScroll, { passive: true });
-        }
-        return () => {
-            if (boundingElement) {
-                boundingElement.current?.removeEventListener("scroll", handleScroll);
-            }
-            else {
-                window.removeEventListener("scroll", handleScroll);
-            }
-            if (throttleTimeout) {
-                clearTimeout(throttleTimeout);
-            }
-        };
-    }, deps);
-};
-exports.useScrollPosition = useScrollPosition;

package/node/hooks/useScrollTo.js

@@ -1,23 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useScrollTo = void 0;
-const utils_1 = require("@koine/utils");
-const useHeader_1 = require("../Header/useHeader");
-function useScrollTo(id = "", offset = 0) {
-    const [, , headerHeight] = (0, useHeader_1.useHeader)();
-    if (!utils_1.isBrowser) {
-        return;
-    }
-    const headerOffset = headerHeight || 0;
-    let element = document.getElementById(id);
-    let top = 0;
-    if (element && element.offsetParent) {
-        do {
-            top += element.offsetTop;
-        } while ((element = element.offsetParent));
-    }
-    top -= offset;
-    top -= headerOffset;
-    window.scroll(0, top);
-}
-exports.useScrollTo = useScrollTo;

package/node/hooks/useTraceUpdate.js

@@ -1,24 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useTraceUpdate = void 0;
-const react_1 = require("react");
-/**
- * @see https://stackoverflow.com/a/51082563/9122820
- */
-function useTraceUpdate(props) {
-    const prev = (0, react_1.useRef)(props);
-    (0, react_1.useEffect)(() => {
-        const changedProps = Object.entries(props).reduce((ps, [k, v]) => {
-            if (prev.current[k] !== v) {
-                // @ts-expect-error Does not matter here...
-                ps[k] = [prev.current[k], v];
-            }
-            return ps;
-        }, {});
-        if (Object.keys(changedProps).length > 0) {
-            console.log("Changed props:", changedProps);
-        }
-        prev.current = props;
-    });
-}
-exports.useTraceUpdate = useTraceUpdate;

package/node/hooks/useUpdateEffect.js

@@ -1,18 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useUpdateEffect = void 0;
-const react_1 = require("react");
-const useFirstMountState_1 = require("./useFirstMountState");
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useUpdateEffect.ts)
- */
-const useUpdateEffect = (effect, deps) => {
-    const isFirstMount = (0, useFirstMountState_1.useFirstMountState)();
-    (0, react_1.useEffect)(() => {
-        if (!isFirstMount) {
-            return effect();
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, deps);
-};
-exports.useUpdateEffect = useUpdateEffect;

package/node/hooks/useWindowSize.js

@@ -1,17 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useWindowSize = void 0;
-const react_1 = require("react");
-function useWindowSize() {
-    const [size, setSize] = (0, react_1.useState)([0, 0]);
-    (0, react_1.useEffect)(() => {
-        function updateSize() {
-            setSize([window.innerWidth, window.innerHeight]);
-        }
-        window.addEventListener("resize", updateSize);
-        updateSize();
-        return () => window.removeEventListener("resize", updateSize);
-    }, []);
-    return size;
-}
-exports.useWindowSize = useWindowSize;

package/node/index.js

@@ -1,8 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./shared"), exports);
-// we need to alias the star export otherwise the named exports would collide
-// export * as css from "./css";
-// export * as sc from "./sc";
-// export * as tw from "./tw";

package/node/m/MotionProvider.js

@@ -1,41 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MotionProvider = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const framer_motion_1 = require("framer-motion");
-/**
- * `<LazyMotion />` provider wrapper from `framer-motion`
- *
- * @see https://www.framer.com/docs/guide-reduce-bundle-size/
- *
- * About the difference between `lite` and `max`
- * @see https://www.framer.com/docs/guide-reduce-bundle-size/#available-features
- *
- * @example
- *
- * `lite` version:
- * ```tsx
- * import { MotionProvider } from "@koine/react/m";
- *
- * const features = () => import("@koine/react/m/lite").then((m) => m.default);
- *
- * <MotionProvider features={features}>
- *   <App />
- * </MotionProvider>
- * ```
- *
- * ### `max` version
- * ```tsx
- * import { MotionProvider } from "@koine/react/m";
- *
- * const features = () => import("@koine/react/m/max").then((m) => m.default);
- *
- * <MotionProvider features={features}>
- *   <App />
- * </MotionProvider>
- * ```
- */
-const MotionProvider = ({ features, children }) => {
-    return (0, jsx_runtime_1.jsx)(framer_motion_1.LazyMotion, { features: features, children: children });
-};
-exports.MotionProvider = MotionProvider;

package/node/m/index.js

@@ -1,9 +0,0 @@
-"use strict";
-/**
- * @file
- *
- * In this file we only have exports related to `framer-motion`
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./MotionProvider"), exports);

package/node/m/lite.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const framer_motion_1 = require("framer-motion");
-exports.default = framer_motion_1.domAnimation;

package/node/m/max.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const framer_motion_1 = require("framer-motion");
-exports.default = framer_motion_1.domMax;

package/node/sc/index.js

@@ -1,37 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineForm = exports.KoineDialog = void 0;
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("../shared"), exports);
-tslib_1.__exportStar(require("../Alert"), exports);
-tslib_1.__exportStar(require("../Animations"), exports);
-tslib_1.__exportStar(require("../Autocomplete"), exports);
-tslib_1.__exportStar(require("../Bg"), exports);
-tslib_1.__exportStar(require("../Breadcrumbs"), exports);
-tslib_1.__exportStar(require("../Buttons"), exports);
-tslib_1.__exportStar(require("../Carousel"), exports);
-tslib_1.__exportStar(require("../Collapsable"), exports);
-tslib_1.__exportStar(require("../Debug"), exports);
-var bare_1 = require("../Dialog/sc/bare");
-Object.defineProperty(exports, "KoineDialog", { enumerable: true, get: function () { return bare_1.KoineDialog; } });
-var bare_2 = require("../Form/sc/bare");
-Object.defineProperty(exports, "KoineForm", { enumerable: true, get: function () { return bare_2.KoineForm; } });
-tslib_1.__exportStar(require("../Forms"), exports);
-tslib_1.__exportStar(require("../Grid"), exports);
-tslib_1.__exportStar(require("../Hamburger"), exports);
-tslib_1.__exportStar(require("../Header"), exports);
-tslib_1.__exportStar(require("../Hidden"), exports);
-tslib_1.__exportStar(require("../Img"), exports);
-tslib_1.__exportStar(require("../Link"), exports);
-tslib_1.__exportStar(require("../MenuItem"), exports);
-tslib_1.__exportStar(require("../Pagination"), exports);
-tslib_1.__exportStar(require("../Pill"), exports);
-tslib_1.__exportStar(require("../Progress"), exports);
-tslib_1.__exportStar(require("../Rating"), exports);
-// export * from "../Select";
-tslib_1.__exportStar(require("../Sidebar"), exports);
-tslib_1.__exportStar(require("../Spacing"), exports);
-tslib_1.__exportStar(require("../Sticky"), exports);
-tslib_1.__exportStar(require("../styles"), exports);
-tslib_1.__exportStar(require("../Tabs"), exports);
-tslib_1.__exportStar(require("../Typography"), exports);

package/node/scm/index.js

@@ -1,36 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineDialog = void 0;
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("../shared"), exports);
-tslib_1.__exportStar(require("../Alert"), exports);
-tslib_1.__exportStar(require("../Animations"), exports);
-tslib_1.__exportStar(require("../Autocomplete"), exports);
-tslib_1.__exportStar(require("../Bg"), exports);
-tslib_1.__exportStar(require("../Breadcrumbs"), exports);
-tslib_1.__exportStar(require("../Buttons"), exports);
-tslib_1.__exportStar(require("../Carousel"), exports);
-tslib_1.__exportStar(require("../Collapsable"), exports);
-tslib_1.__exportStar(require("../Debug"), exports);
-var framer_1 = require("../Dialog/sc/framer");
-Object.defineProperty(exports, "KoineDialog", { enumerable: true, get: function () { return framer_1.KoineDialog; } });
-// export { KoineForm, type KoineFormProps} from "../Form/sc/framer";
-tslib_1.__exportStar(require("../Forms"), exports);
-tslib_1.__exportStar(require("../Grid"), exports);
-tslib_1.__exportStar(require("../Hamburger"), exports);
-tslib_1.__exportStar(require("../Header"), exports);
-tslib_1.__exportStar(require("../Hidden"), exports);
-tslib_1.__exportStar(require("../Img"), exports);
-tslib_1.__exportStar(require("../Link"), exports);
-tslib_1.__exportStar(require("../MenuItem"), exports);
-tslib_1.__exportStar(require("../Pagination"), exports);
-tslib_1.__exportStar(require("../Pill"), exports);
-tslib_1.__exportStar(require("../Progress"), exports);
-tslib_1.__exportStar(require("../Rating"), exports);
-// export * from "../Select";
-tslib_1.__exportStar(require("../Sidebar"), exports);
-tslib_1.__exportStar(require("../Spacing"), exports);
-tslib_1.__exportStar(require("../Sticky"), exports);
-tslib_1.__exportStar(require("../styles"), exports);
-tslib_1.__exportStar(require("../Tabs"), exports);
-tslib_1.__exportStar(require("../Typography"), exports);

package/node/shared/index.js

@@ -1,11 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("../Calendar"), exports);
-tslib_1.__exportStar(require("../Dialog"), exports);
-tslib_1.__exportStar(require("../Favicon"), exports);
-tslib_1.__exportStar(require("../helpers"), exports);
-tslib_1.__exportStar(require("../hooks"), exports);
-tslib_1.__exportStar(require("../Meta"), exports);
-tslib_1.__exportStar(require("../NoJs"), exports);
-tslib_1.__exportStar(require("../types"), exports);

package/node/styles/Body.js

@@ -1,21 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BodyMain = exports.BodyRoot = void 0;
-const tslib_1 = require("tslib");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.BodyRoot = styled_components_1.default.div `
-  display: flex;
-  flex-direction: column;
-  min-height: 100vh;
-`;
-/**
- * If you have background graphics to overlap you might need to add:
- *
- * ```css
- * z-index: 1;
- * position: relative;
- * ```
- */
-exports.BodyMain = styled_components_1.default.main `
-  flex: 1;
-`;

package/node/styles/Global.js

@@ -1,53 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.StylesGlobal = exports.stylesGlobal = void 0;
-const styled_components_1 = require("styled-components");
-/**
- * App global style
- *
- * For examples of what to do here take a look at [Bootstrap's reset](https://github.com/twbs/bootstrap/blob/main/scss/_reboot.scss)
- * and similar.
- *
- * What we do here:
- * - set the base font family on all possible elements including placeholders prevent Chrome showing a standard font when using the autofill feature
- *  - @see https://stackoverflow.com/a/60987373/1938970
- * - set the base font size on all possible elements to prevent weird zooming on input fields on iPhone iOS devices.
- *  - @see https://www.warrenchandler.com/2019/04/02/stop-iphones-from-zooming-in-on-form-fields/
- *  - @see https://css-tricks.com/16px-or-larger-text-prevents-ios-form-zoom/
- */
-exports.stylesGlobal = `
-  body {
-    margin: 0;
-    padding: 0;
-    overflow-x: hidden;
-    overflow-y: scroll;
-  }
-
-  body,
-  button,
-  input,
-  textarea,
-  select,
-  select:-webkit-autofill::first-line,
-  input:-webkit-autofill::first-line {
-    font-family: var(--font), -apple-system, BlinkMacSystemFont, "Segoe UI",
-      Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue",
-      sans-serif;
-    font-size: var(--fontSize);
-  }
-
-  html {
-    box-sizing: border-box;
-    @media (prefers-reduced-motion: no-preference) {
-      scroll-behavior: smooth;
-    }
-  }
-
-  *,
-  *:before,
-  *:after {
-    box-sizing: inherit;
-    -webkit-tap-highlight-color: transparent;
-  }
-`;
-exports.StylesGlobal = (0, styled_components_1.createGlobalStyle) `${exports.stylesGlobal}`;

package/node/styles/index.js

@@ -1,10 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./Body"), exports);
-tslib_1.__exportStar(require("./Global"), exports);
-tslib_1.__exportStar(require("./media"), exports);
-tslib_1.__exportStar(require("./spacing"), exports);
-tslib_1.__exportStar(require("./styled"), exports);
-tslib_1.__exportStar(require("./theme"), exports);
-tslib_1.__exportStar(require("./theme--vanilla"), exports);