@koine/next 1.0.59 → 1.0.62

package/node/ThemeProvider.js

@@ -0,0 +1,250 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ThemeProvider = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var script_1 = tslib_1.__importDefault(require("next/script"));
+var utils_1 = require("@koine/utils");
+var ThemeContext_1 = require("./ThemeContext");
+var colorSchemes = ["light", "dark"];
+var MEDIA = "(prefers-color-scheme: dark)";
+var THEME_STORAGE_KEY = "theme";
+/**
+ * @borrows [next-themes](https://github.com/pacocoursey/next-themes)
+ *
+ * Differences:
+ *
+ * - enableColorScheme: `false` by default (instead of `true`), this plays more
+ * nicely with tailwind `dark` class mode as dark theme is supposed to be only
+ * controlled by tailwind modifiers
+ */
+var ThemeProvider = function (_a) {
+    var forcedTheme = _a.forcedTheme, _b = _a.disableTransitionOnChange, disableTransitionOnChange = _b === void 0 ? false : _b, _c = _a.enableSystem, enableSystem = _c === void 0 ? true : _c, enableColorScheme = _a.enableColorScheme, _d = _a.themes, themes = _d === void 0 ? ["light", "dark"] : _d, _e = _a.defaultTheme, defaultTheme = _e === void 0 ? enableSystem ? "system" : "light" : _e, _f = _a.attribute, attribute = _f === void 0 ? "data-theme" : _f, value = _a.value, children = _a.children, nonce = _a.nonce;
+    var _g = (0, react_1.useState)(function () {
+        return getTheme(THEME_STORAGE_KEY, defaultTheme);
+    }), theme = _g[0], setThemeState = _g[1];
+    var _h = (0, react_1.useState)(function () {
+        return getTheme(THEME_STORAGE_KEY);
+    }), resolvedTheme = _h[0], setResolvedTheme = _h[1];
+    var attrs = !value ? themes : Object.values(value);
+    var applyTheme = (0, react_1.useCallback)(function (theme) {
+        var _a;
+        var resolved = theme;
+        if (utils_1.isServer || !resolved)
+            return;
+        // If theme is system, resolve it before setting theme
+        if (theme === "system" && enableSystem) {
+            resolved = getSystemTheme();
+        }
+        var name = value ? value[resolved] : resolved;
+        var enable = disableTransitionOnChange ? disableAnimation() : null;
+        var d = document.documentElement;
+        if (attribute === "class") {
+            (_a = d.classList).remove.apply(_a, attrs);
+            if (name)
+                d.classList.add(name);
+        }
+        else {
+            if (name) {
+                d.setAttribute(attribute, name);
+            }
+            else {
+                d.removeAttribute(attribute);
+            }
+        }
+        if (enableColorScheme) {
+            var fallback = colorSchemes.includes(defaultTheme)
+                ? defaultTheme
+                : "";
+            var colorScheme = colorSchemes.includes(resolved)
+                ? resolved
+                : fallback;
+            d.style.colorScheme = colorScheme;
+        }
+        enable === null || enable === void 0 ? void 0 : enable();
+    }, [
+        attribute,
+        attrs,
+        defaultTheme,
+        disableTransitionOnChange,
+        enableColorScheme,
+        enableSystem,
+        value,
+    ]);
+    var setTheme = (0, react_1.useCallback)(function (theme) {
+        setThemeState(theme);
+        // Save to storage
+        try {
+            localStorage.setItem(THEME_STORAGE_KEY, theme);
+        }
+        catch (e) {
+            // Unsupported
+        }
+    }, []);
+    var handleMediaQuery = (0, react_1.useCallback)(function (e) {
+        var resolved = getSystemTheme(e);
+        setResolvedTheme(resolved);
+        if (theme === "system" && enableSystem && !forcedTheme) {
+            applyTheme("system");
+        }
+    }, [theme, enableSystem, forcedTheme, applyTheme]);
+    // Always listen to System preference
+    (0, react_1.useEffect)(function () {
+        var media = window.matchMedia(MEDIA);
+        // Intentionally use deprecated listener methods to support iOS & old browsers
+        media.addListener(handleMediaQuery);
+        handleMediaQuery(media);
+        return function () { return media.removeListener(handleMediaQuery); };
+    }, [handleMediaQuery]);
+    // localStorage event handling
+    (0, react_1.useEffect)(function () {
+        var handleStorage = function (e) {
+            if (e.key !== THEME_STORAGE_KEY) {
+                return;
+            }
+            // If default theme set, use it if localstorage === null (happens on local storage manual deletion)
+            var theme = e.newValue || defaultTheme;
+            setTheme(theme);
+        };
+        window.addEventListener("storage", handleStorage);
+        return function () { return window.removeEventListener("storage", handleStorage); };
+    }, [defaultTheme, setTheme]);
+    // Whenever theme or forcedTheme changes, apply it
+    (0, react_1.useEffect)(function () {
+        applyTheme(forcedTheme !== null && forcedTheme !== void 0 ? forcedTheme : theme);
+    }, [applyTheme, forcedTheme, theme]);
+    return ((0, jsx_runtime_1.jsxs)(ThemeContext_1.ThemeContext.Provider, tslib_1.__assign({ value: {
+            theme: theme,
+            setTheme: setTheme,
+            forcedTheme: forcedTheme,
+            resolvedTheme: theme === "system" ? resolvedTheme : theme,
+            themes: enableSystem ? tslib_1.__spreadArray(tslib_1.__spreadArray([], themes, true), ["system"], false) : themes,
+            systemTheme: (enableSystem ? resolvedTheme : undefined),
+        } }, { children: [(0, jsx_runtime_1.jsx)(ThemeScript, tslib_1.__assign({}, {
+                forcedTheme: forcedTheme,
+                disableTransitionOnChange: disableTransitionOnChange,
+                enableSystem: enableSystem,
+                enableColorScheme: enableColorScheme,
+                themes: themes,
+                defaultTheme: defaultTheme,
+                attribute: attribute,
+                value: value,
+                children: children,
+                attrs: attrs,
+                nonce: nonce,
+            })), children] })));
+};
+exports.ThemeProvider = ThemeProvider;
+var ThemeScript = (0, react_1.memo)(function (_a) {
+    var forcedTheme = _a.forcedTheme, attribute = _a.attribute, enableSystem = _a.enableSystem, enableColorScheme = _a.enableColorScheme, defaultTheme = _a.defaultTheme, value = _a.value, attrs = _a.attrs, nonce = _a.nonce;
+    var defaultSystem = defaultTheme === "system";
+    // Code-golfing the amount of characters in the script
+    var optimization = (function () {
+        var removeClasses = "d.remove(".concat(attrs
+            .map(function (t) { return "'".concat(t, "'"); })
+            .join(","), ")");
+        return "var d=document.documentElement.classList;".concat(removeClasses, ";");
+    })();
+    var fallbackColorScheme = (function () {
+        if (!enableColorScheme) {
+            return "";
+        }
+        var fallback = colorSchemes.includes(defaultTheme)
+            ? defaultTheme
+            : null;
+        if (fallback) {
+            return "if(e==='light'||e==='dark'||!e)d.style.colorScheme=e||'".concat(defaultTheme, "'");
+        }
+        else {
+            return "if(e==='light'||e==='dark')d.style.colorScheme=e";
+        }
+    })();
+    var updateDOM = function (name, literal, setColorScheme) {
+        if (literal === void 0) { literal = false; }
+        if (setColorScheme === void 0) { setColorScheme = true; }
+        var resolvedName = value ? value[name] : name;
+        var val = literal ? name + "|| ''" : "'".concat(resolvedName, "'");
+        var text = "";
+        // MUCH faster to set colorScheme alongside HTML attribute/class
+        // as it only incurs 1 style recalculation rather than 2
+        // This can save over 250ms of work for pages with big DOM
+        if (enableColorScheme &&
+            setColorScheme &&
+            !literal &&
+            colorSchemes.includes(name)) {
+            text += "d.style.colorScheme = '".concat(name, "';");
+        }
+        if (attribute === "class") {
+            if (literal || resolvedName) {
+                text += "d.add(".concat(val, ")");
+            }
+            else {
+                text += "null";
+            }
+        }
+        else {
+            if (resolvedName) {
+                text += "d[s](n, ".concat(val, ")");
+            }
+        }
+        return text;
+    };
+    var scriptSrc = (function () {
+        if (forcedTheme) {
+            return "!function(){".concat(optimization).concat(updateDOM(forcedTheme), "}()");
+        }
+        if (enableSystem) {
+            return "!function(){try {".concat(optimization, "var e=localStorage.getItem('").concat(THEME_STORAGE_KEY, "');if(\"system\"===e||(!e&&").concat(defaultSystem, ")){var t=\"").concat(MEDIA, "\",m=window.matchMedia(t);if(m.media!==t||m.matches){").concat(updateDOM("dark"), "}else{").concat(updateDOM("light"), "}}else if(e){").concat(value ? "var x=".concat(JSON.stringify(value), ";") : "").concat(updateDOM(value ? "x[e]" : "e", true), "}").concat(!defaultSystem
+                ? "else{" + updateDOM(defaultTheme, false, false) + "}"
+                : "").concat(fallbackColorScheme, "}catch(e){}}()");
+        }
+        return "!function(){try{".concat(optimization, "var e=localStorage.getItem(\"").concat(THEME_STORAGE_KEY, "\");if(e){").concat(value ? "var x=".concat(JSON.stringify(value), ";") : "").concat(updateDOM(value ? "x[e]" : "e", true), "}else{").concat(updateDOM(defaultTheme, false, false), ";}").concat(fallbackColorScheme, "}catch(t){}}();");
+    })();
+    // We MUST use next/script's `beforeInteractive` strategy to avoid flashing on load.
+    // However, it only accepts the `src` prop, not `dangerouslySetInnerHTML` or `children`
+    // But our script cannot be external because it changes at runtime based on React props
+    // so we trick next/script by passing `src` as a base64 JS script
+    var encodedScript = "data:text/javascript;base64,".concat(encodeBase64(scriptSrc));
+    return ((0, jsx_runtime_1.jsx)(script_1.default, { id: "next-theme-script", strategy: "beforeInteractive", src: encodedScript, nonce: nonce }));
+}, 
+// Never re-render this component
+function () { return true; });
+// Helpers
+var getTheme = function (key, fallback) {
+    if (utils_1.isServer)
+        return undefined;
+    var theme;
+    try {
+        theme = localStorage.getItem(key) || undefined;
+    }
+    catch (e) {
+        // Unsupported
+    }
+    return theme || fallback;
+};
+var disableAnimation = function () {
+    var d = document;
+    var css = d.createElement("style");
+    css.appendChild(d.createTextNode("*{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}"));
+    d.head.appendChild(css);
+    return function () {
+        // Force restyle
+        (function () { return window.getComputedStyle(d.body); })();
+        // Wait for next tick before removing
+        setTimeout(function () {
+            d.head.removeChild(css);
+        }, 1);
+    };
+};
+var getSystemTheme = function (e) {
+    if (!e)
+        e = window.matchMedia(MEDIA);
+    var isDark = e.matches;
+    var systemTheme = isDark ? "dark" : "light";
+    return systemTheme;
+};
+var encodeBase64 = function (str) {
+    return utils_1.isServer ? Buffer.from(str).toString("base64") : btoa(str);
+};
+exports.default = exports.ThemeProvider;

package/node/app/css/AppTheme.js

@@ -4,7 +4,7 @@ exports.AppTheme = void 0;
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
 // import { ThemeVanillaProvider, ThemeVanillaValue } from "@koine/react";
-var useTheme_1 = require("../../useTheme");
+var ThemeProvider_1 = require("../../ThemeProvider");
 /**
  * App theme with vanilla class based theme (good for `tailwindcss`)
  */
@@ -13,6 +13,6 @@ var AppTheme = function (_a) {
     // return (
     //   <ThemeVanillaProvider initialTheme={theme}>{children}</ThemeVanillaProvider>
     // );
-    return ((0, jsx_runtime_1.jsx)(useTheme_1.ThemeProvider, tslib_1.__assign({ defaultTheme: theme, attribute: "class" }, { children: children })));
+    return ((0, jsx_runtime_1.jsx)(ThemeProvider_1.ThemeProvider, tslib_1.__assign({ defaultTheme: theme, attribute: "class" }, { children: children })));
 };
 exports.AppTheme = AppTheme;

package/node/index.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./AnalyticsGoogle"), exports);
 // export * from "./createEmotionCache";
+tslib_1.__exportStar(require("./DisableErrorOverlay"), exports);
 tslib_1.__exportStar(require("./DynamicNamespaces"), exports);
 tslib_1.__exportStar(require("./Favicon"), exports);
 tslib_1.__exportStar(require("./getSiteUrl"), exports);
@@ -18,6 +19,8 @@ tslib_1.__exportStar(require("./Seo"), exports);
 // export * from "./seoBuildTags";
 tslib_1.__exportStar(require("./SeoDefaults"), exports);
 tslib_1.__exportStar(require("./T"), exports);
+tslib_1.__exportStar(require("./ThemeContext"), exports);
+tslib_1.__exportStar(require("./ThemeProvider"), exports);
 tslib_1.__exportStar(require("./to"), exports);
 tslib_1.__exportStar(require("./translationAsOptions"), exports);
 tslib_1.__exportStar(require("./types-i18n"), exports);

package/node/useTheme.js

@@ -1,263 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ThemeProvider = exports.useTheme = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
-/**
- * @file
- *
- * Adapted from [next-themes](https://github.com/pacocoursey/next-themes)
- *
- * Differences:
- *
- * - enableColorScheme: `false` by default (instead of `true`), this plays more
- * nicely with tailwind `dark` class mode as dark theme is supposed to be only
- * controlled by tailwind modifiers
- */
+exports.useTheme = void 0;
 var react_1 = require("react");
-var script_1 = tslib_1.__importDefault(require("next/script"));
-var utils_1 = require("@koine/utils");
-var THEME_STORAGE_KEY = "theme";
-var colorSchemes = ["light", "dark"];
-var MEDIA = "(prefers-color-scheme: dark)";
-var ThemeContext = (0, react_1.createContext)({
-    // eslint-disable-next-line @typescript-eslint/no-empty-function
-    setTheme: function (_) { },
-    themes: [],
-});
+var ThemeContext_1 = require("./ThemeContext");
 /**
  * @borrows [next-themes](https://github.com/pacocoursey/next-themes)
  */
-var useTheme = function () { return (0, react_1.useContext)(ThemeContext); };
+var useTheme = function () { return (0, react_1.useContext)(ThemeContext_1.ThemeContext); };
 exports.useTheme = useTheme;
-/**
- * @borrows [next-themes](https://github.com/pacocoursey/next-themes)
- */
-var ThemeProvider = function (_a) {
-    var forcedTheme = _a.forcedTheme, _b = _a.disableTransitionOnChange, disableTransitionOnChange = _b === void 0 ? false : _b, _c = _a.enableSystem, enableSystem = _c === void 0 ? true : _c, enableColorScheme = _a.enableColorScheme, _d = _a.themes, themes = _d === void 0 ? ["light", "dark"] : _d, _e = _a.defaultTheme, defaultTheme = _e === void 0 ? enableSystem ? "system" : "light" : _e, _f = _a.attribute, attribute = _f === void 0 ? "data-theme" : _f, value = _a.value, children = _a.children, nonce = _a.nonce;
-    var _g = (0, react_1.useState)(function () {
-        return getTheme(THEME_STORAGE_KEY, defaultTheme);
-    }), theme = _g[0], setThemeState = _g[1];
-    var _h = (0, react_1.useState)(function () {
-        return getTheme(THEME_STORAGE_KEY);
-    }), resolvedTheme = _h[0], setResolvedTheme = _h[1];
-    var attrs = !value ? themes : Object.values(value);
-    var applyTheme = (0, react_1.useCallback)(function (theme) {
-        var _a;
-        var resolved = theme;
-        if (utils_1.isServer || !resolved)
-            return;
-        // If theme is system, resolve it before setting theme
-        if (theme === "system" && enableSystem) {
-            resolved = getSystemTheme();
-        }
-        var name = value ? value[resolved] : resolved;
-        var enable = disableTransitionOnChange ? disableAnimation() : null;
-        var d = document.documentElement;
-        if (attribute === "class") {
-            (_a = d.classList).remove.apply(_a, attrs);
-            if (name)
-                d.classList.add(name);
-        }
-        else {
-            if (name) {
-                d.setAttribute(attribute, name);
-            }
-            else {
-                d.removeAttribute(attribute);
-            }
-        }
-        if (enableColorScheme) {
-            var fallback = colorSchemes.includes(defaultTheme)
-                ? defaultTheme
-                : "";
-            var colorScheme = colorSchemes.includes(resolved)
-                ? resolved
-                : fallback;
-            d.style.colorScheme = colorScheme;
-        }
-        enable === null || enable === void 0 ? void 0 : enable();
-    }, [
-        attribute,
-        attrs,
-        defaultTheme,
-        disableTransitionOnChange,
-        enableColorScheme,
-        enableSystem,
-        value,
-    ]);
-    var setTheme = (0, react_1.useCallback)(function (theme) {
-        setThemeState(theme);
-        // Save to storage
-        try {
-            localStorage.setItem(THEME_STORAGE_KEY, theme);
-        }
-        catch (e) {
-            // Unsupported
-        }
-    }, []);
-    var handleMediaQuery = (0, react_1.useCallback)(function (e) {
-        var resolved = getSystemTheme(e);
-        setResolvedTheme(resolved);
-        if (theme === "system" && enableSystem && !forcedTheme) {
-            applyTheme("system");
-        }
-    }, [theme, enableSystem, forcedTheme, applyTheme]);
-    // Always listen to System preference
-    (0, react_1.useEffect)(function () {
-        var media = window.matchMedia(MEDIA);
-        // Intentionally use deprecated listener methods to support iOS & old browsers
-        media.addListener(handleMediaQuery);
-        handleMediaQuery(media);
-        return function () { return media.removeListener(handleMediaQuery); };
-    }, [handleMediaQuery]);
-    // localStorage event handling
-    (0, react_1.useEffect)(function () {
-        var handleStorage = function (e) {
-            if (e.key !== THEME_STORAGE_KEY) {
-                return;
-            }
-            // If default theme set, use it if localstorage === null (happens on local storage manual deletion)
-            var theme = e.newValue || defaultTheme;
-            setTheme(theme);
-        };
-        window.addEventListener("storage", handleStorage);
-        return function () { return window.removeEventListener("storage", handleStorage); };
-    }, [defaultTheme, setTheme]);
-    // Whenever theme or forcedTheme changes, apply it
-    (0, react_1.useEffect)(function () {
-        applyTheme(forcedTheme !== null && forcedTheme !== void 0 ? forcedTheme : theme);
-    }, [applyTheme, forcedTheme, theme]);
-    return ((0, jsx_runtime_1.jsxs)(ThemeContext.Provider, tslib_1.__assign({ value: {
-            theme: theme,
-            setTheme: setTheme,
-            forcedTheme: forcedTheme,
-            resolvedTheme: theme === "system" ? resolvedTheme : theme,
-            themes: enableSystem ? tslib_1.__spreadArray(tslib_1.__spreadArray([], themes, true), ["system"], false) : themes,
-            systemTheme: (enableSystem ? resolvedTheme : undefined),
-        } }, { children: [(0, jsx_runtime_1.jsx)(ThemeScript, tslib_1.__assign({}, {
-                forcedTheme: forcedTheme,
-                disableTransitionOnChange: disableTransitionOnChange,
-                enableSystem: enableSystem,
-                enableColorScheme: enableColorScheme,
-                themes: themes,
-                defaultTheme: defaultTheme,
-                attribute: attribute,
-                value: value,
-                children: children,
-                attrs: attrs,
-                nonce: nonce,
-            })), children] })));
-};
-exports.ThemeProvider = ThemeProvider;
-var ThemeScript = (0, react_1.memo)(function (_a) {
-    var forcedTheme = _a.forcedTheme, attribute = _a.attribute, enableSystem = _a.enableSystem, enableColorScheme = _a.enableColorScheme, defaultTheme = _a.defaultTheme, value = _a.value, attrs = _a.attrs, nonce = _a.nonce;
-    var defaultSystem = defaultTheme === "system";
-    // Code-golfing the amount of characters in the script
-    var optimization = (function () {
-        var removeClasses = "d.remove(".concat(attrs
-            .map(function (t) { return "'".concat(t, "'"); })
-            .join(","), ")");
-        return "var d=document.documentElement.classList;".concat(removeClasses, ";");
-    })();
-    var fallbackColorScheme = (function () {
-        if (!enableColorScheme) {
-            return "";
-        }
-        var fallback = colorSchemes.includes(defaultTheme)
-            ? defaultTheme
-            : null;
-        if (fallback) {
-            return "if(e==='light'||e==='dark'||!e)d.style.colorScheme=e||'".concat(defaultTheme, "'");
-        }
-        else {
-            return "if(e==='light'||e==='dark')d.style.colorScheme=e";
-        }
-    })();
-    var updateDOM = function (name, literal, setColorScheme) {
-        if (literal === void 0) { literal = false; }
-        if (setColorScheme === void 0) { setColorScheme = true; }
-        var resolvedName = value ? value[name] : name;
-        var val = literal ? name + "|| ''" : "'".concat(resolvedName, "'");
-        var text = "";
-        // MUCH faster to set colorScheme alongside HTML attribute/class
-        // as it only incurs 1 style recalculation rather than 2
-        // This can save over 250ms of work for pages with big DOM
-        if (enableColorScheme &&
-            setColorScheme &&
-            !literal &&
-            colorSchemes.includes(name)) {
-            text += "d.style.colorScheme = '".concat(name, "';");
-        }
-        if (attribute === "class") {
-            if (literal || resolvedName) {
-                text += "d.add(".concat(val, ")");
-            }
-            else {
-                text += "null";
-            }
-        }
-        else {
-            if (resolvedName) {
-                text += "d[s](n, ".concat(val, ")");
-            }
-        }
-        return text;
-    };
-    var scriptSrc = (function () {
-        if (forcedTheme) {
-            return "!function(){".concat(optimization).concat(updateDOM(forcedTheme), "}()");
-        }
-        if (enableSystem) {
-            return "!function(){try {".concat(optimization, "var e=localStorage.getItem('").concat(THEME_STORAGE_KEY, "');if(\"system\"===e||(!e&&").concat(defaultSystem, ")){var t=\"").concat(MEDIA, "\",m=window.matchMedia(t);if(m.media!==t||m.matches){").concat(updateDOM("dark"), "}else{").concat(updateDOM("light"), "}}else if(e){").concat(value ? "var x=".concat(JSON.stringify(value), ";") : "").concat(updateDOM(value ? "x[e]" : "e", true), "}").concat(!defaultSystem
-                ? "else{" + updateDOM(defaultTheme, false, false) + "}"
-                : "").concat(fallbackColorScheme, "}catch(e){}}()");
-        }
-        return "!function(){try{".concat(optimization, "var e=localStorage.getItem(\"").concat(THEME_STORAGE_KEY, "\");if(e){").concat(value ? "var x=".concat(JSON.stringify(value), ";") : "").concat(updateDOM(value ? "x[e]" : "e", true), "}else{").concat(updateDOM(defaultTheme, false, false), ";}").concat(fallbackColorScheme, "}catch(t){}}();");
-    })();
-    // We MUST use next/script's `beforeInteractive` strategy to avoid flashing on load.
-    // However, it only accepts the `src` prop, not `dangerouslySetInnerHTML` or `children`
-    // But our script cannot be external because it changes at runtime based on React props
-    // so we trick next/script by passing `src` as a base64 JS script
-    var encodedScript = "data:text/javascript;base64,".concat(encodeBase64(scriptSrc));
-    return ((0, jsx_runtime_1.jsx)(script_1.default, { id: "next-theme-script", strategy: "beforeInteractive", src: encodedScript, nonce: nonce }));
-}, 
-// Never re-render this component
-function () { return true; });
-// Helpers
-var getTheme = function (key, fallback) {
-    if (utils_1.isServer)
-        return undefined;
-    var theme;
-    try {
-        theme = localStorage.getItem(key) || undefined;
-    }
-    catch (e) {
-        // Unsupported
-    }
-    return theme || fallback;
-};
-var disableAnimation = function () {
-    var css = document.createElement("style");
-    css.appendChild(document.createTextNode("*{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}"));
-    document.head.appendChild(css);
-    return function () {
-        // Force restyle
-        (function () { return window.getComputedStyle(document.body); })();
-        // Wait for next tick before removing
-        setTimeout(function () {
-            document.head.removeChild(css);
-        }, 1);
-    };
-};
-var getSystemTheme = function (e) {
-    if (!e)
-        e = window.matchMedia(MEDIA);
-    var isDark = e.matches;
-    var systemTheme = isDark ? "dark" : "light";
-    return systemTheme;
-};
-var encodeBase64 = function (str) {
-    return utils_1.isServer ? Buffer.from(str).toString("base64") : btoa(str);
-};
 exports.default = exports.useTheme;

package/package.json

@@ -17,31 +17,31 @@
   "dependencies": {},
   "peerDependencies": {
     "react": "^16.8 || ^17 || ^18",
-    "next": "^12.2.0",
-    "@koine/utils": "1.0.59",
-    "framer-motion": "^6.4.2",
-    "@koine/react": "1.0.59",
+    "next": "^12.2.3",
+    "@koine/utils": "1.0.62",
+    "framer-motion": "^6.5.1",
+    "next-auth": "^4.10.2",
+    "@mui/material": "^5.9.1",
+    "@emotion/react": "^11.9.3",
     "styled-components": "^5.3.5",
-    "@mui/base": "^5.0.0-alpha.88",
+    "react-hook-form": "^7.33.1",
+    "@koine/react": "1.0.62",
+    "@mui/base": "^5.0.0-alpha.90",
     "react-icons": "^4.4.0",
-    "date-fns": "^2.28.0",
+    "date-fns": "^2.29.1",
     "react-swipeable": "^7.0.0",
     "@tiptap/react": "^2.0.0-beta.114",
-    "@tiptap/starter-kit": "^2.0.0-beta.190",
+    "@tiptap/starter-kit": "^2.0.0-beta.191",
     "@kuus/yup": "^1.0.0-beta.4",
-    "react-hook-form": "^7.33.1",
-    "type-fest": "^2.16.0",
+    "type-fest": "^2.17.0",
     "react-popper": "^2.3.0",
     "tslib": "^2.4.0",
-    "next-auth": "^4.9.0",
-    "@mui/material": "^5.8.7",
-    "@emotion/react": "^11.9.3",
     "@emotion/server": "^11.4.0",
     "next-translate": "^1.5.0",
-    "next-seo": "^5.4.0",
-    "@hookform/resolvers": "^2.9.3"
+    "next-seo": "^5.5.0",
+    "@hookform/resolvers": "^2.9.6"
   },
-  "version": "1.0.59",
+  "version": "1.0.62",
   "module": "./index.js",
   "types": "./index.d.ts"
 }

package/useTheme.d.ts

@@ -1,47 +1,7 @@
-/// <reference types="react" />
-declare type ValueObject = {
-    [themeName: string]: string;
-};
-export declare type UseThemeProps = {
-    /** List of all available theme names */
-    themes: string[];
-    /** Forced theme name for the current page */
-    forcedTheme?: string;
-    /** Update the theme */
-    setTheme: (theme: string) => void;
-    /** Active theme name */
-    theme?: string;
-    /** If `enableSystem` is true and the active theme is "system", this returns whether the system preference resolved to "dark" or "light". Otherwise, identical to `theme` */
-    resolvedTheme?: string;
-    /** If enableSystem is true, returns the System theme preference ("dark" or "light"), regardless what the active theme is */
-    systemTheme?: "dark" | "light";
-};
-export declare type ThemeProviderProps = React.PropsWithChildren<{
-    /** List of all available theme names */
-    themes?: string[];
-    /** Forced theme name for the current page */
-    forcedTheme?: string;
-    /** Whether to switch between dark and light themes based on prefers-color-scheme */
-    enableSystem?: boolean;
-    /** Disable all CSS transitions when switching themes */
-    disableTransitionOnChange?: boolean;
-    /** Whether to indicate to browsers which color scheme is used (dark or light) for built-in UI like inputs and buttons */
-    enableColorScheme?: boolean;
-    /** Default theme name (for v0.0.12 and lower the default was light). If `enableSystem` is false, the default theme is light */
-    defaultTheme?: string;
-    /** HTML attribute modified based on the active theme. Accepts `class` and `data-*` (meaning any data attribute, `data-mode`, `data-color`, etc.) */
-    attribute?: string | "class";
-    /** Mapping of theme name to HTML attribute value. Object where key is the theme name and value is the attribute value */
-    value?: ValueObject;
-    /** Nonce string to pass to the inline script for CSP headers */
-    nonce?: string;
-}>;
+import { ThemeContextProps } from "./ThemeContext";
+export declare type UseThemeProps = ThemeContextProps;
 /**
  * @borrows [next-themes](https://github.com/pacocoursey/next-themes)
  */
-export declare const useTheme: () => UseThemeProps;
-/**
- * @borrows [next-themes](https://github.com/pacocoursey/next-themes)
- */
-export declare const ThemeProvider: ({ forcedTheme, disableTransitionOnChange, enableSystem, enableColorScheme, themes, defaultTheme, attribute, value, children, nonce, }: ThemeProviderProps) => JSX.Element;
+export declare const useTheme: () => ThemeContextProps;
 export default useTheme;