@koine/react 1.1.10 → 1.1.12

package/node/hooks/usePrevious.js

@@ -1,16 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.usePrevious = void 0;
-var react_1 = require("react");
-/**
- * @borrows [samselikoff/animated-carousel](https://github.com/samselikoff/2022-06-02-animated-carousel/blob/main/pages/final.jsx)
- */
-function usePrevious(state, defaulValue) {
-    var _a = (0, react_1.useState)([state, defaulValue]), tuple = _a[0], setTuple = _a[1];
-    if (tuple[1] !== state) {
-        setTuple([tuple[1], state]);
-    }
-    return tuple[0];
-}
-exports.usePrevious = usePrevious;
-exports.default = usePrevious;

package/node/hooks/usePreviousRef.js

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

package/node/hooks/useScrollThreshold.js

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

package/node/hooks/useScrollTo.js

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useScrollTo = void 0;
-var tslib_1 = require("tslib");
-var isBrowser_1 = tslib_1.__importDefault(require("@koine/utils/isBrowser"));
-var useHeader_1 = tslib_1.__importDefault(require("../Header/useHeader"));
-function useScrollTo(id, offset) {
-    if (id === void 0) { id = ""; }
-    if (offset === void 0) { offset = 0; }
-    var _a = (0, useHeader_1.default)(), headerHeight = _a[2];
-    if (!isBrowser_1.default) {
-        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);
-}
-exports.useScrollTo = useScrollTo;
-exports.default = useScrollTo;

package/node/hooks/useSmoothScroll.js

@@ -1,44 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useSmoothScroll = void 0;
-var tslib_1 = require("tslib");
-var react_1 = require("react");
-var isNumber_1 = tslib_1.__importDefault(require("@koine/utils/isNumber"));
-var getOffsetTopSlim_1 = tslib_1.__importDefault(require("@koine/dom/getOffsetTopSlim"));
-var scrollTo_1 = tslib_1.__importDefault(require("@koine/dom/scrollTo"));
-var useFixedOffset_1 = tslib_1.__importDefault(require("./useFixedOffset"));
-/**
- *
- * @param disregardAutomaticFixedOffset When the `to` scroll argument is a DOM
- * selector we will keep into account the _fixedOffset_ despite this option.
- * @returns
- */
-function useSmoothScroll(disregardAutomaticFixedOffset) {
-    var fixedOffset = (0, useFixedOffset_1.default)();
-    var scroll = (0, react_1.useCallback)(function (to, customOffset, callback, fallbackTimeout, behavior) {
-        var top = undefined;
-        var toIsElement = false;
-        if ((0, isNumber_1.default)(to)) {
-            top = to;
-        }
-        else if (to) {
-            var el = document.getElementById(to);
-            if (el) {
-                top = (0, getOffsetTopSlim_1.default)(el) - fixedOffset.current;
-                toIsElement = true;
-            }
-        }
-        if ((0, isNumber_1.default)(top)) {
-            top =
-                top +
-                    (customOffset || 0) +
-                    (disregardAutomaticFixedOffset || toIsElement
-                        ? 0
-                        : fixedOffset.current);
-            (0, scrollTo_1.default)(top, callback, fallbackTimeout, behavior);
-        }
-    }, [disregardAutomaticFixedOffset, fixedOffset]);
-    return scroll;
-}
-exports.useSmoothScroll = useSmoothScroll;
-exports.default = useSmoothScroll;

package/node/hooks/useUpdateEffect.js

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

package/node/hooks/useWindowSize.js

@@ -1,34 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useWindowSize = void 0;
-var tslib_1 = require("tslib");
-var react_1 = require("react");
-var listenResize_1 = tslib_1.__importDefault(require("@koine/dom/listenResize"));
-var listenResizeDebounced_1 = tslib_1.__importDefault(require("@koine/dom/listenResizeDebounced"));
-/**
- * # Use `window` size
- *
- * @param args Optionally pass {@link debounce} arguments (`wait` and `immediate`)
- *
- * @returns An array with:
- * 1) _width_: using `window.innerWidth`
- * 2) _height_: using `window.innerHeight`
- */
-function useWindowSize(wait, immediate) {
-    var _a = (0, react_1.useState)(0), width = _a[0], widthSet = _a[1];
-    var _b = (0, react_1.useState)(0), height = _b[0], heightSet = _b[1];
-    (0, react_1.useEffect)(function () {
-        function updateSize() {
-            widthSet(window.innerWidth);
-            heightSet(window.innerHeight);
-        }
-        var listener = wait
-            ? (0, listenResizeDebounced_1.default)(0, updateSize, wait, immediate)
-            : (0, listenResize_1.default)(updateSize);
-        updateSize();
-        return listener;
-    }, [wait, immediate]);
-    return [width, height];
-}
-exports.useWindowSize = useWindowSize;
-exports.default = useWindowSize;

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 });
-var 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 });
-var 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 });
-var 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;
-var 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;
-var 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 });
-var tslib_1 = require("tslib");
-tslib_1.__exportStar(require("../Calendar"), exports);
-tslib_1.__exportStar(require("../Dialog"), exports);
-tslib_1.__exportStar(require("../FaviconTags"), 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,16 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BodyMain = exports.BodyRoot = void 0;
-var tslib_1 = require("tslib");
-var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.BodyRoot = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  min-height: 100vh;\n"], ["\n  display: flex;\n  flex-direction: column;\n  min-height: 100vh;\n"])));
-/**
- * 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(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  flex: 1;\n"], ["\n  flex: 1;\n"])));
-var templateObject_1, templateObject_2;

package/node/styles/Global.js

@@ -1,21 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.StylesGlobal = exports.stylesGlobal = void 0;
-var tslib_1 = require("tslib");
-var 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 = "\n  body {\n    margin: 0;\n    padding: 0;\n    overflow-x: hidden;\n    overflow-y: scroll;\n  }\n\n  body,\n  button,\n  input,\n  textarea,\n  select,\n  select:-webkit-autofill::first-line,\n  input:-webkit-autofill::first-line {\n    font-family: var(--font), -apple-system, BlinkMacSystemFont, \"Segoe UI\",\n      Roboto, Oxygen, Ubuntu, Cantarell, \"Open Sans\", \"Helvetica Neue\",\n      sans-serif;\n    font-size: var(--fontSize);\n  }\n\n  html {\n    box-sizing: border-box;\n    @media (prefers-reduced-motion: no-preference) {\n      scroll-behavior: smooth;\n    }\n  }\n\n  *,\n  *:before,\n  *:after {\n    box-sizing: inherit;\n    -webkit-tap-highlight-color: transparent;\n  }\n";
-exports.StylesGlobal = (0, styled_components_1.createGlobalStyle)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["", ""], ["", ""])), exports.stylesGlobal);
-var templateObject_1;

package/node/styles/index.js

@@ -1,10 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var 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);

package/node/styles/styled.js

@@ -1,17 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.stateFocus = exports.invisible = exports.ellipsis = exports.centered = exports.overlay = exports.inset0 = exports.colStretch = void 0;
-function colStretch(direction, bg) {
-    return "\n    background: ".concat(bg, ";\n    position: relative;\n\n    &:before{\n      z-index: -1;\n      content: '';\n      position: absolute;\n      right: ").concat(direction === "left" ? "100%" : "-100vw", ";\n      left: ").concat(direction === "right" ? "100%" : "-100vw", ";\n      top: 0;\n      bottom: 0;\n      background: ").concat(bg, ";\n    }\n  ");
-}
-exports.colStretch = colStretch;
-/** @see https://caniuse.com/?search=inset */
-exports.inset0 = "top:0;left:0;right:0;bottom:0;";
-exports.overlay = "position: absolute;".concat(exports.inset0);
-exports.centered = "display: flex;align-items: center;justify-content: center;";
-exports.ellipsis = "overflow: hidden;text-overflow: ellipsis;white-space: nowrap;";
-/**
- * @see import("@mui/utils").visuallyHidden https://github.com/mui-org/material-ui/blob/master/packages/mui-utils/src/visuallyHidden.ts
- */
-exports.invisible = "border: 0;clip: rect(0 0 0 0);height: 1px;margin: -1px;overflow: hidden;padding: 0;position: absolute;white-space: nowrap;width: 1px;";
-exports.stateFocus = "outline: 0px;box-shadow: 0 0 0 0.2rem rgba(200, 200, 200, 0.25);";

package/node/styles/theme--vanilla.js

@@ -1,64 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ThemeVanillaProvider = exports.ThemeVanillaContext = exports.getInitialThemeFromClient = exports.getInitialThemeFromRequest = exports.THEME_DEFAULT = exports.THEME_KEY = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
-var isBrowser_1 = tslib_1.__importDefault(require("@koine/utils/isBrowser"));
-var setCookie_1 = tslib_1.__importDefault(require("@koine/utils/setCookie"));
-var parseCookie_1 = tslib_1.__importDefault(require("@koine/utils/parseCookie"));
-var useMount_1 = tslib_1.__importDefault(require("../hooks/useMount"));
-var useUpdateEffect_1 = tslib_1.__importDefault(require("../hooks/useUpdateEffect"));
-exports.THEME_KEY = "theme";
-exports.THEME_DEFAULT = "light";
-var getInitialThemeFromRequest = function (cookie) {
-    if (cookie) {
-        var parsed = (0, parseCookie_1.default)(cookie);
-        return parsed === null || parsed === void 0 ? void 0 : parsed.theme;
-    }
-    return exports.THEME_DEFAULT;
-};
-exports.getInitialThemeFromRequest = getInitialThemeFromRequest;
-var getInitialThemeFromClient = function () {
-    if (typeof window !== "undefined" && window.localStorage) {
-        var storedPrefs = window.localStorage.getItem(exports.THEME_KEY);
-        if (typeof storedPrefs === "string") {
-            return storedPrefs;
-        }
-        var userMedia = window.matchMedia("(prefers-color-scheme: dark)");
-        if (userMedia.matches) {
-            return "dark";
-        }
-    }
-    return exports.THEME_DEFAULT;
-};
-exports.getInitialThemeFromClient = getInitialThemeFromClient;
-exports.ThemeVanillaContext = (0, react_1.createContext)({
-    theme: "light",
-    setTheme: undefined,
-});
-var ThemeVanillaProvider = function (_a) {
-    var initialTheme = _a.initialTheme, children = _a.children;
-    var _b = (0, react_1.useState)(initialTheme), theme = _b[0], setTheme = _b[1];
-    var rawSetTheme = function (rawTheme) {
-        if (!rawTheme || !isBrowser_1.default) {
-            return;
-        }
-        var root = window.document.documentElement;
-        var isDark = rawTheme === "dark";
-        root.classList.remove(isDark ? "light" : "dark");
-        root.classList.add(rawTheme);
-        localStorage.setItem(exports.THEME_KEY, rawTheme);
-        (0, setCookie_1.default)(exports.THEME_KEY, rawTheme);
-    };
-    (0, useMount_1.default)(function () {
-        var theme = (0, exports.getInitialThemeFromClient)();
-        setTheme(theme);
-        rawSetTheme(theme);
-    });
-    (0, useUpdateEffect_1.default)(function () {
-        rawSetTheme(theme);
-    }, [theme]);
-    return ((0, jsx_runtime_1.jsx)(exports.ThemeVanillaContext.Provider, tslib_1.__assign({ value: { theme: theme, setTheme: setTheme } }, { children: children })));
-};
-exports.ThemeVanillaProvider = ThemeVanillaProvider;

package/node/types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });