@koine/next 1.0.14 → 1.0.17

package/node/Auth/useLogout.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useLogout = void 0;
+var react_1 = require("react");
+var router_1 = require("next/router");
+var react_2 = require("next-auth/react");
+var utils_1 = require("@koine/utils");
+var i18n_1 = require("../i18n");
+var helpers_1 = require("./helpers");
+function useLogout() {
+    var t = (0, i18n_1.useT)();
+    var push = (0, router_1.useRouter)().push;
+    var _a = (0, react_1.useState)(false), loading = _a[0], setLoading = _a[1];
+    var _b = (0, react_1.useState)(false), ok = _b[0], setOk = _b[1];
+    var fail = (0, react_1.useState)(false)[0];
+    var submit = (0, react_1.useCallback)(function (event) {
+        event.preventDefault();
+        event.stopPropagation();
+        setLoading(true);
+        (0, react_2.signOut)({ redirect: false }).then(function () {
+            setLoading(false);
+            setOk(true);
+            var redirectUrl = (0, utils_1.parseURL)((0, helpers_1.getCallbackUrl)());
+            var currentUrl = (0, utils_1.parseURL)(window.location.href);
+            var secured = (0, helpers_1.getAuthRoutes)(t).secured;
+            var signin = t("~:/signin");
+            var profile = t("~:/profile");
+            var targetUrl = redirectUrl || currentUrl;
+            var redirect = "";
+            if (targetUrl) {
+                if (targetUrl.pathname === profile) {
+                    redirect = signin;
+                }
+                else if (secured) {
+                    for (var i = 0; i < secured.length; i++) {
+                        if (targetUrl.pathname.match(secured[i])) {
+                            redirect = signin;
+                            break;
+                        }
+                    }
+                }
+            }
+            if (redirect) {
+                push(redirect);
+            }
+        });
+    }, [t, push]);
+    // TODO: useMemo ?
+    return {
+        submit: submit,
+        loading: loading,
+        ok: ok,
+        fail: fail,
+    };
+}
+exports.useLogout = useLogout;

package/node/Favicon/Favicon.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Favicon = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var head_1 = tslib_1.__importDefault(require("next/head"));
+var react_1 = require("@koine/react");
+var Favicon = function (props) { return ((0, jsx_runtime_1.jsx)(head_1.default, { children: (0, jsx_runtime_1.jsx)(react_1.FaviconTags, tslib_1.__assign({}, props)) })); };
+exports.Favicon = Favicon;

package/node/Favicon/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./Favicon"), exports);

package/node/Forms/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./useForm"), exports);

package/node/Forms/useForm.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useForm = void 0;
+var tslib_1 = require("tslib");
+var react_1 = require("react");
+var react_hook_form_1 = require("react-hook-form");
+var yup_1 = require("@hookform/resolvers/yup");
+function useForm(
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+schema, t, formProps, debug) {
+    if (formProps === void 0) { formProps = {}; }
+    // const form = _useForm<InferType<ObjectSchema<T, object>>>({
+    var form = (0, react_hook_form_1.useForm)(tslib_1.__assign({ 
+        // @ts-expect-error FIXME:
+        resolver: (0, yup_1.yupResolver)(schema) }, formProps));
+    // const { control, register, setValue } = form;
+    // const field = { control, register, setValue, t };
+    // if (process.env["NODE_ENV"] !== "production") {
+    //   if (debug) {
+    //     console.log(
+    //       `Form ${i18nNamespace} data`,
+    //       form.watch(),
+    //       `errors: `,
+    //       form.formState.errors
+    //     );
+    //   }
+    // }
+    // if (formProps.mode === "onChange") {
+    //   return { field, ...form };
+    // }
+    return (0, react_1.useMemo)(function () {
+        var control = form.control, register = form.register, setValue = form.setValue;
+        var field = { control: control, register: register, setValue: setValue, t: t };
+        return tslib_1.__assign({ field: field }, form);
+    }, [t, form]);
+}
+exports.useForm = useForm;

package/node/Head/Head.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Head = void 0;
+var head_1 = require("next/head");
+Object.defineProperty(exports, "Head", { enumerable: true, get: function () { return __importDefault(head_1).default; } });

package/node/Head/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./Head"), exports);

package/node/Img/Img.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getNextImgProps = exports.NextImgSmart = exports.NextImg = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var image_1 = tslib_1.__importDefault(require("next/image"));
+exports.NextImg = image_1.default;
+var NextImgSmart = function (props) {
+    var _a = (0, react_1.useState)(false), $loaded = _a[0], setLoaded = _a[1];
+    var _b = (0, react_1.useState)(false), $error = _b[0], setError = _b[1];
+    var _c = getNextImgProps(props), nextImgProps = _c.nextImgProps, restProps = _c.restProps;
+    var Wrap = restProps.Wrap;
+    return nextImgProps.priority ? ((0, jsx_runtime_1.jsx)(image_1.default, tslib_1.__assign({}, nextImgProps))) : ((0, jsx_runtime_1.jsx)(Wrap, tslib_1.__assign({}, restProps, { "$loaded": $loaded, "$error": $error }, { children: (0, jsx_runtime_1.jsx)(image_1.default, tslib_1.__assign({}, nextImgProps, { onLoadingComplete: function () { return setLoaded(true); }, onError: function () { return setError(true); } })) })));
+};
+exports.NextImgSmart = NextImgSmart;
+function getNextImgProps(_a) {
+    var src = _a.src, alt = _a.alt, layout = _a.layout, blurDataURL = _a.blurDataURL, width = _a.width, height = _a.height, priority = _a.priority, objectFit = _a.objectFit, objectPosition = _a.objectPosition, restProps = tslib_1.__rest(_a, ["src", "alt", "layout", "blurDataURL", "width", "height", "priority", "objectFit", "objectPosition"]);
+    var nextImgProps = {
+        src: src,
+        alt: alt,
+        layout: layout,
+        blurDataURL: blurDataURL,
+        width: width,
+        height: height,
+        priority: priority,
+        objectFit: objectFit,
+        objectPosition: objectPosition,
+    };
+    return {
+        nextImgProps: nextImgProps,
+        restProps: restProps,
+    };
+}
+exports.getNextImgProps = getNextImgProps;

package/node/Img/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./Img"), exports);

package/node/Link/Link.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Link = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var link_1 = tslib_1.__importDefault(require("next/link"));
+/**
+ * @see https://next.js.org/docs/api-reference/next/link
+ */
+exports.Link = (0, react_1.forwardRef)(function Link(_a, ref) {
+    var href = _a.href, prefetch = _a.prefetch, replace = _a.replace, scroll = _a.scroll, shallow = _a.shallow, locale = _a.locale, _b = _a.Link, Link = _b === void 0 ? "span" : _b, props = tslib_1.__rest(_a, ["href", "prefetch", "replace", "scroll", "shallow", "locale", "Link"]);
+    return ((0, jsx_runtime_1.jsx)(link_1.default, tslib_1.__assign({ href: href, replace: replace, scroll: scroll, shallow: shallow, locale: locale, passHref: true }, { children: (0, jsx_runtime_1.jsx)(Link, tslib_1.__assign({ ref: ref }, props)) })));
+});

package/node/Link/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./Link"), exports);

package/node/NextProgress/NextProgress.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NextProgress = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var router_1 = require("next/router");
+var NextProgress = function (_a) {
+    var _b = _a.startAt, startAt = _b === void 0 ? 0.3 : _b, _c = _a.showOnShallow, showOnShallow = _c === void 0 ? true : _c, _d = _a.stopDelayMs, stopDelayMs = _d === void 0 ? 200 : _d, _e = _a.Overlay, Overlay = _e === void 0 ? "div" : _e;
+    var events = (0, router_1.useRouter)().events;
+    // const [progress, setProgress] = useState(0);
+    var _f = (0, react_1.useState)(false), running = _f[0], setRunning = _f[1];
+    var timer = (0, react_1.useRef)(null);
+    var routeChangeStart = (0, react_1.useCallback)(function (_, _a) {
+        var shallow = _a.shallow;
+        if (!shallow || showOnShallow) {
+            // setProgress(startAt);
+            setRunning(true);
+        }
+    }, [showOnShallow]);
+    var routeChangeEnd = (0, react_1.useCallback)(function (_, _a) {
+        var shallow = _a.shallow;
+        if (!shallow || showOnShallow) {
+            if (timer.current) {
+                clearTimeout(timer.current);
+            }
+            timer.current = setTimeout(function () {
+                // setProgress(100);
+                setRunning(false);
+            }, stopDelayMs);
+        }
+    }, [showOnShallow, stopDelayMs, timer]);
+    (0, react_1.useEffect)(function () {
+        events.on("routeChangeStart", routeChangeStart);
+        events.on("routeChangeComplete", routeChangeEnd);
+        events.on("routeChangeError", routeChangeEnd);
+        return function () {
+            events.off("routeChangeStart", routeChangeStart);
+            events.off("routeChangeComplete", routeChangeEnd);
+            events.off("routeChangeError", routeChangeEnd);
+        };
+    }, [events, routeChangeStart, routeChangeEnd]);
+    return (0, jsx_runtime_1.jsx)(Overlay, { running: running });
+};
+exports.NextProgress = NextProgress;

package/node/NextProgress/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NextProgress = void 0;
+var NextProgress_1 = require("./NextProgress");
+Object.defineProperty(exports, "NextProgress", { enumerable: true, get: function () { return NextProgress_1.NextProgress; } });

package/node/Seo/Seo.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Seo = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var head_1 = tslib_1.__importDefault(require("next/head"));
+var helpers_1 = require("./helpers");
+var _Seo = function (props) {
+    return (0, jsx_runtime_1.jsx)(head_1.default, { children: (0, helpers_1.buildTags)(props) });
+};
+exports.Seo = (0, react_1.memo)(_Seo);

package/node/Seo/SeoDefaults.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SeoDefaults = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var head_1 = tslib_1.__importDefault(require("next/head"));
+// import { useRouter } from "next/router";
+// import { getSiteUrl } from "../utils";
+var helpers_1 = require("./helpers");
+var _SeoDefaults = function (props) {
+    // const router = useRouter();
+    // props.openGraph.url = getSiteUrl(router.asPath);
+    return (0, jsx_runtime_1.jsx)(head_1.default, { children: (0, helpers_1.buildTags)(props) });
+};
+exports.SeoDefaults = (0, react_1.memo)(_SeoDefaults);

package/node/Seo/helpers.js

@@ -0,0 +1,119 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buildTags = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var utils_1 = require("@koine/utils");
+var defaults = {
+    tplTitle: "",
+};
+/**
+ * We do a couple of things in addition while many other are removed.
+ *
+ * - Add `seo` meta object coming from a CMS probably
+ * - Add `ogimage` and `openGraph.image` as single image source
+ * - Add `og` alias to define `openGraph`
+ * - Add check for `title` equale to `templateTitle` to avoid meta titles like
+ *   "My site | My site" often happening in homepages
+ * - Remove the open graph videos and images
+ *
+ * - Shorter code
+ *
+ * @returns
+ */
+var buildTags = function (_a) {
+    var _b = _a === void 0 ? {} : _a, seo = _b.seo, hidden = _b.hidden, keywords = _b.keywords, _c = _b.title, title = _c === void 0 ? "" : _c, titleTemplate = _b.titleTemplate, defaultTitle = _b.defaultTitle, noindex = _b.noindex, nofollow = _b.nofollow, description = _b.description, _d = _b.languageAlternates, languageAlternates = _d === void 0 ? [] : _d, twitter = _b.twitter, facebook = _b.facebook, openGraph = _b.openGraph, ogAlias = _b.og, canonical = _b.canonical, metaTags = _b.metaTags, linkTags = _b.linkTags;
+    var render = [];
+    var $names = {};
+    var $properties = {};
+    if (titleTemplate) {
+        defaults.tplTitle = titleTemplate;
+    }
+    title = title || (seo === null || seo === void 0 ? void 0 : seo.title) || "";
+    if (title) {
+        if (defaults.tplTitle && defaults.tplTitle !== title) {
+            title = defaults.tplTitle.replace(/%s/g, title);
+        }
+    }
+    else if (defaultTitle) {
+        title = defaultTitle;
+    }
+    if (title) {
+        render.push((0, jsx_runtime_1.jsx)("title", { children: title }, "title"));
+        $properties["og:title"] = title; // overridden later...
+    }
+    $names["robots"] = "".concat(noindex || hidden ? "noindex" : "index", ",").concat(nofollow || hidden ? "nofollow" : "follow");
+    description = description || (seo === null || seo === void 0 ? void 0 : seo.description);
+    if (description) {
+        $names["description"] = description;
+        $properties["og:description"] = description; // overridden later...
+    }
+    keywords = keywords || (seo === null || seo === void 0 ? void 0 : seo.keywords);
+    if (keywords) {
+        $names["keywords"] = (0, utils_1.isArray)(keywords) ? keywords.join(", ") : keywords;
+    }
+    if ((languageAlternates === null || languageAlternates === void 0 ? void 0 : languageAlternates.length) > 0) {
+        languageAlternates.forEach(function (languageAlternate) {
+            render.push((0, jsx_runtime_1.jsx)("link", { rel: "alternate", hrefLang: languageAlternate.hrefLang, href: languageAlternate.href }, "languageAlternate-".concat(languageAlternate.hrefLang)));
+        });
+    }
+    if (canonical) {
+        render.push((0, jsx_runtime_1.jsx)("link", { rel: "canonical", href: canonical }, "canonical"));
+        $properties["og:url"] = canonical;
+    }
+    if (facebook === null || facebook === void 0 ? void 0 : facebook.appId)
+        $properties["fb:app_id"] = facebook.appId;
+    if (twitter) {
+        if (twitter.cardType)
+            $names["twitter:card"] = twitter.cardType;
+        if (twitter.site)
+            $names["twitter:site"] = twitter.site;
+        if (twitter.handle)
+            $names["twitter:creator"] = twitter.handle;
+    }
+    var og = ogAlias || openGraph;
+    if (og === null || og === void 0 ? void 0 : og.title)
+        $properties["og:title"] = og === null || og === void 0 ? void 0 : og.title;
+    if (og === null || og === void 0 ? void 0 : og.description)
+        $properties["og:description"] = og === null || og === void 0 ? void 0 : og.description;
+    if (og === null || og === void 0 ? void 0 : og.url)
+        $properties["og:url"] = og.url;
+    if (og === null || og === void 0 ? void 0 : og.type)
+        $properties["og:type"] = og.type.toLowerCase();
+    if (og === null || og === void 0 ? void 0 : og.locale)
+        $properties["og:locale"] = og.locale;
+    if (og === null || og === void 0 ? void 0 : og.site_name)
+        $properties["og:site_name"] = og.site_name;
+    var ogimage = (og === null || og === void 0 ? void 0 : og.image) || (seo === null || seo === void 0 ? void 0 : seo.ogimage);
+    if (ogimage)
+        $properties["og:image"] = ogimage;
+    Object.keys($names).forEach(function (key) {
+        render.push((0, jsx_runtime_1.jsx)("meta", { name: key, content: $names[key] }, key));
+    });
+    Object.keys($properties).forEach(function (key) {
+        render.push((0, jsx_runtime_1.jsx)("meta", { property: key, content: $properties[key] }, key));
+    });
+    if (metaTags && metaTags.length > 0) {
+        metaTags.forEach(function (tag) {
+            var _a, _b, _c;
+            render.push((0, jsx_runtime_1.jsx)("meta", tslib_1.__assign({}, tag), "meta:".concat((_c = (_b = (_a = tag.keyOverride) !== null && _a !== void 0 ? _a : tag.name) !== null && _b !== void 0 ? _b : tag.property) !== null && _c !== void 0 ? _c : tag.httpEquiv)));
+        });
+    }
+    if (linkTags === null || linkTags === void 0 ? void 0 : linkTags.length) {
+        linkTags.forEach(function (tag) {
+            var _a;
+            render.push((0, jsx_runtime_1.jsx)("link", tslib_1.__assign({}, tag), "link".concat((_a = tag.keyOverride) !== null && _a !== void 0 ? _a : tag.href).concat(tag.rel)));
+        });
+    }
+    // TODO: alternates and canonical
+    // canonical = 'https://www.domain.com/';
+    // languageAlternates={[{
+    //   hrefLang: 'en',
+    //   href: 'https://www.domain.com/en',
+    // }]}
+    // <link rel="alternate" hreflang="x-default" href="https://www.domain.com/nl/">
+    // <link rel="alternate" hreflang="nl" href="https://www.domain.com/nl/">
+    // <link rel="alternate" hreflang="en" href="https://www.domain.com/en/">
+    return render;
+};
+exports.buildTags = buildTags;

package/node/Seo/index.js

@@ -0,0 +1,15 @@
+"use strict";
+/**
+ * @file
+ *
+ * Adapted from https://github.com/garmeeh/next-seo
+ *
+ * See also:
+ * - https://github.com/catnose99/next-head-seo
+ * - https://nextjs.org/docs/api-reference/next/head
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./helpers"), exports);
+tslib_1.__exportStar(require("./Seo"), exports);
+tslib_1.__exportStar(require("./SeoDefaults"), exports);

package/node/Theme/Theme.js

@@ -0,0 +1,250 @@
+"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)
+ */
+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 useTheme = function () { return (0, react_1.useContext)(ThemeContext); };
+exports.useTheme = useTheme;
+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, _d = _a.enableColorScheme, enableColorScheme = _d === void 0 ? true : _d, _e = _a.themes, themes = _e === void 0 ? ["light", "dark"] : _e, _f = _a.defaultTheme, defaultTheme = _f === void 0 ? enableSystem ? "system" : "light" : _f, _g = _a.attribute, attribute = _g === void 0 ? "data-theme" : _g, value = _a.value, children = _a.children, nonce = _a.nonce;
+    var _h = (0, react_1.useState)(function () {
+        return getTheme(THEME_STORAGE_KEY, defaultTheme);
+    }), theme = _h[0], setThemeState = _h[1];
+    var _j = (0, react_1.useState)(function () {
+        return getTheme(THEME_STORAGE_KEY);
+    }), resolvedTheme = _j[0], setResolvedTheme = _j[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);
+};