@koine/next 1.1.10 → 1.1.12

package/ThemeProvider.js

@@ -1,9 +1,12 @@
-import { __assign, __spreadArray } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useState, memo } from "react";
-import NextScript from "next/script";
-import isServer from "@koine/utils/isServer";
-import { ThemeContext } from "./ThemeContext";
+"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 isServer_1 = tslib_1.__importDefault(require("@koine/utils/isServer"));
+var ThemeContext_1 = require("./ThemeContext");
 var colorSchemes = ["light", "dark"];
 var MEDIA = "(prefers-color-scheme: dark)";
 var THEME_STORAGE_KEY = "theme";
@@ -16,19 +19,19 @@ var THEME_STORAGE_KEY = "theme";
  * nicely with tailwind `dark` class mode as dark theme is supposed to be only
  * controlled by tailwind modifiers
  */
-export var ThemeProvider = function (_a) {
+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 = useState(function () {
+    var _g = (0, react_1.useState)(function () {
         return getTheme(THEME_STORAGE_KEY, defaultTheme);
     }), theme = _g[0], setThemeState = _g[1];
-    var _h = useState(function () {
+    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 = useCallback(function (theme) {
+    var applyTheme = (0, react_1.useCallback)(function (theme) {
         var _a;
         var resolved = theme;
-        if (isServer || !resolved)
+        if (isServer_1.default || !resolved)
             return;
         // If theme is system, resolve it before setting theme
         if (theme === "system" && enableSystem) {
@@ -69,7 +72,7 @@ export var ThemeProvider = function (_a) {
         enableSystem,
         value,
     ]);
-    var setTheme = useCallback(function (theme) {
+    var setTheme = (0, react_1.useCallback)(function (theme) {
         setThemeState(theme);
         // Save to storage
         try {
@@ -79,7 +82,7 @@ export var ThemeProvider = function (_a) {
             // Unsupported
         }
     }, []);
-    var handleMediaQuery = useCallback(function (e) {
+    var handleMediaQuery = (0, react_1.useCallback)(function (e) {
         var resolved = getSystemTheme(e);
         setResolvedTheme(resolved);
         if (theme === "system" && enableSystem && !forcedTheme) {
@@ -87,7 +90,7 @@ export var ThemeProvider = function (_a) {
         }
     }, [theme, enableSystem, forcedTheme, applyTheme]);
     // Always listen to System preference
-    useEffect(function () {
+    (0, react_1.useEffect)(function () {
         var media = window.matchMedia(MEDIA);
         // Intentionally use deprecated listener methods to support iOS & old browsers
         media.addListener(handleMediaQuery);
@@ -95,7 +98,7 @@ export var ThemeProvider = function (_a) {
         return function () { return media.removeListener(handleMediaQuery); };
     }, [handleMediaQuery]);
     // localStorage event handling
-    useEffect(function () {
+    (0, react_1.useEffect)(function () {
         var handleStorage = function (e) {
             if (e.key !== THEME_STORAGE_KEY) {
                 return;
@@ -108,17 +111,17 @@ export var ThemeProvider = function (_a) {
         return function () { return window.removeEventListener("storage", handleStorage); };
     }, [defaultTheme, setTheme]);
     // Whenever theme or forcedTheme changes, apply it
-    useEffect(function () {
+    (0, react_1.useEffect)(function () {
         applyTheme(forcedTheme !== null && forcedTheme !== void 0 ? forcedTheme : theme);
     }, [applyTheme, forcedTheme, theme]);
-    return (_jsxs(ThemeContext.Provider, __assign({ value: {
+    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 ? __spreadArray(__spreadArray([], themes, true), ["system"], false) : themes,
+            themes: enableSystem ? tslib_1.__spreadArray(tslib_1.__spreadArray([], themes, true), ["system"], false) : themes,
             systemTheme: (enableSystem ? resolvedTheme : undefined),
-        } }, { children: [_jsx(ThemeScript, __assign({}, {
+        } }, { children: [(0, jsx_runtime_1.jsx)(ThemeScript, tslib_1.__assign({}, {
                 forcedTheme: forcedTheme,
                 disableTransitionOnChange: disableTransitionOnChange,
                 enableSystem: enableSystem,
@@ -132,7 +135,8 @@ export var ThemeProvider = function (_a) {
                 nonce: nonce,
             })), children] })));
 };
-var ThemeScript = memo(function (_a) {
+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
@@ -202,13 +206,13 @@ var ThemeScript = memo(function (_a) {
     // 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 (_jsx(NextScript, { id: "next-theme-script", strategy: "beforeInteractive", src: encodedScript, nonce: nonce }));
+    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 (isServer)
+    if (isServer_1.default)
         return undefined;
     var theme;
     try {
@@ -241,6 +245,6 @@ var getSystemTheme = function (e) {
     return systemTheme;
 };
 var encodeBase64 = function (str) {
-    return isServer ? Buffer.from(str).toString("base64") : btoa(str);
+    return isServer_1.default ? Buffer.from(str).toString("base64") : btoa(str);
 };
-export default ThemeProvider;
+exports.default = exports.ThemeProvider;

package/{node/ThemeProvider.js → ThemeProvider.mjs}

@@ -1,12 +1,9 @@
-"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 isServer_1 = tslib_1.__importDefault(require("@koine/utils/isServer"));
-var ThemeContext_1 = require("./ThemeContext");
+import { __assign, __spreadArray } from "tslib";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useState, memo } from "react";
+import NextScript from "next/script";
+import isServer from "@koine/utils/isServer";
+import { ThemeContext } from "./ThemeContext";
 var colorSchemes = ["light", "dark"];
 var MEDIA = "(prefers-color-scheme: dark)";
 var THEME_STORAGE_KEY = "theme";
@@ -19,19 +16,19 @@ var THEME_STORAGE_KEY = "theme";
  * nicely with tailwind `dark` class mode as dark theme is supposed to be only
  * controlled by tailwind modifiers
  */
-var ThemeProvider = function (_a) {
+export 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 () {
+    var _g = useState(function () {
         return getTheme(THEME_STORAGE_KEY, defaultTheme);
     }), theme = _g[0], setThemeState = _g[1];
-    var _h = (0, react_1.useState)(function () {
+    var _h = 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 applyTheme = useCallback(function (theme) {
         var _a;
         var resolved = theme;
-        if (isServer_1.default || !resolved)
+        if (isServer || !resolved)
             return;
         // If theme is system, resolve it before setting theme
         if (theme === "system" && enableSystem) {
@@ -72,7 +69,7 @@ var ThemeProvider = function (_a) {
         enableSystem,
         value,
     ]);
-    var setTheme = (0, react_1.useCallback)(function (theme) {
+    var setTheme = useCallback(function (theme) {
         setThemeState(theme);
         // Save to storage
         try {
@@ -82,7 +79,7 @@ var ThemeProvider = function (_a) {
             // Unsupported
         }
     }, []);
-    var handleMediaQuery = (0, react_1.useCallback)(function (e) {
+    var handleMediaQuery = useCallback(function (e) {
         var resolved = getSystemTheme(e);
         setResolvedTheme(resolved);
         if (theme === "system" && enableSystem && !forcedTheme) {
@@ -90,7 +87,7 @@ var ThemeProvider = function (_a) {
         }
     }, [theme, enableSystem, forcedTheme, applyTheme]);
     // Always listen to System preference
-    (0, react_1.useEffect)(function () {
+    useEffect(function () {
         var media = window.matchMedia(MEDIA);
         // Intentionally use deprecated listener methods to support iOS & old browsers
         media.addListener(handleMediaQuery);
@@ -98,7 +95,7 @@ var ThemeProvider = function (_a) {
         return function () { return media.removeListener(handleMediaQuery); };
     }, [handleMediaQuery]);
     // localStorage event handling
-    (0, react_1.useEffect)(function () {
+    useEffect(function () {
         var handleStorage = function (e) {
             if (e.key !== THEME_STORAGE_KEY) {
                 return;
@@ -111,17 +108,17 @@ var ThemeProvider = function (_a) {
         return function () { return window.removeEventListener("storage", handleStorage); };
     }, [defaultTheme, setTheme]);
     // Whenever theme or forcedTheme changes, apply it
-    (0, react_1.useEffect)(function () {
+    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: {
+    return (_jsxs(ThemeContext.Provider, __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,
+            themes: enableSystem ? __spreadArray(__spreadArray([], themes, true), ["system"], false) : themes,
             systemTheme: (enableSystem ? resolvedTheme : undefined),
-        } }, { children: [(0, jsx_runtime_1.jsx)(ThemeScript, tslib_1.__assign({}, {
+        } }, { children: [_jsx(ThemeScript, __assign({}, {
                 forcedTheme: forcedTheme,
                 disableTransitionOnChange: disableTransitionOnChange,
                 enableSystem: enableSystem,
@@ -135,8 +132,7 @@ var ThemeProvider = function (_a) {
                 nonce: nonce,
             })), children] })));
 };
-exports.ThemeProvider = ThemeProvider;
-var ThemeScript = (0, react_1.memo)(function (_a) {
+var ThemeScript = 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
@@ -206,13 +202,13 @@ var ThemeScript = (0, react_1.memo)(function (_a) {
     // 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 }));
+    return (_jsx(NextScript, { 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 (isServer_1.default)
+    if (isServer)
         return undefined;
     var theme;
     try {
@@ -245,6 +241,6 @@ var getSystemTheme = function (e) {
     return systemTheme;
 };
 var encodeBase64 = function (str) {
-    return isServer_1.default ? Buffer.from(str).toString("base64") : btoa(str);
+    return isServer ? Buffer.from(str).toString("base64") : btoa(str);
 };
-exports.default = exports.ThemeProvider;
+export default ThemeProvider;

package/TransText.js

@@ -1,3 +1,7 @@
-import _TransText from "next-translate/TransText";
-export var TransText = _TransText;
-export default TransText;
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TransText = void 0;
+var tslib_1 = require("tslib");
+var TransText_1 = tslib_1.__importDefault(require("next-translate/TransText"));
+exports.TransText = TransText_1.default;
+exports.default = exports.TransText;

package/TransText.mjs

@@ -0,0 +1,3 @@
+import _TransText from "next-translate/TransText";
+export var TransText = _TransText;
+export default TransText;

package/app/AppHead.js

@@ -1,6 +1,11 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import Head from "next/head";
-export var AppHead = function () {
-    return (_jsx(Head, { children: _jsx("meta", { name: "viewport", content: "width=device-width" }) }));
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AppHead = 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 AppHead = function () {
+    return ((0, jsx_runtime_1.jsx)(head_1.default, { children: (0, jsx_runtime_1.jsx)("meta", { name: "viewport", content: "width=device-width" }) }));
 };
-export default AppHead;
+exports.AppHead = AppHead;
+exports.default = exports.AppHead;

package/app/AppHead.mjs

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Head from "next/head";
+export var AppHead = function () {
+    return (_jsx(Head, { children: _jsx("meta", { name: "viewport", content: "width=device-width" }) }));
+};
+export default AppHead;

package/app/AppMain.js

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

package/app/AppMain.mjs

@@ -0,0 +1 @@
+export {};

package/app/css/AppMain.js

@@ -1,14 +1,18 @@
-import { __assign } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from "react";
-import { SeoDefaults } from "../../SeoDefaults";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AppMain = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = tslib_1.__importDefault(require("react"));
+var SeoDefaults_1 = require("../../SeoDefaults");
 /**
  * App main
  *
  * It does not imply any specific styling or animation solution
  */
-export var AppMain = function (_a) {
+var AppMain = function (_a) {
     var Component = _a.Component, pageProps = _a.pageProps, Layout = _a.Layout, seo = _a.seo, pre = _a.pre, post = _a.post;
-    return (_jsxs(React.Fragment, { children: [_jsx(SeoDefaults, __assign({}, seo)), pre, _jsx(Layout, { children: _jsx(Component, __assign({}, pageProps)) }), post] }));
+    return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(SeoDefaults_1.SeoDefaults, tslib_1.__assign({}, seo)), pre, (0, jsx_runtime_1.jsx)(Layout, { children: (0, jsx_runtime_1.jsx)(Component, tslib_1.__assign({}, pageProps)) }), post] }));
 };
-export default AppMain;
+exports.AppMain = AppMain;
+exports.default = exports.AppMain;

package/app/css/AppMain.mjs

@@ -0,0 +1,14 @@
+import { __assign } from "tslib";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from "react";
+import { SeoDefaults } from "../../SeoDefaults";
+/**
+ * App main
+ *
+ * It does not imply any specific styling or animation solution
+ */
+export var AppMain = function (_a) {
+    var Component = _a.Component, pageProps = _a.pageProps, Layout = _a.Layout, seo = _a.seo, pre = _a.pre, post = _a.post;
+    return (_jsxs(React.Fragment, { children: [_jsx(SeoDefaults, __assign({}, seo)), pre, _jsx(Layout, { children: _jsx(Component, __assign({}, pageProps)) }), post] }));
+};
+export default AppMain;

package/app/css/AppTheme.js

@@ -1,15 +1,19 @@
-import { __assign } from "tslib";
-import { jsx as _jsx } from "react/jsx-runtime";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AppTheme = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
 // import { ThemeVanillaProvider, ThemeVanillaValue } from "@koine/react/styles";
-import { ThemeProvider } from "../../ThemeProvider";
+var ThemeProvider_1 = require("../../ThemeProvider");
 /**
  * App theme with vanilla class based theme (good for `tailwindcss`)
  */
-export var AppTheme = function (_a) {
+var AppTheme = function (_a) {
     var theme = _a.theme, children = _a.children;
     // return (
     //   <ThemeVanillaProvider initialTheme={theme}>{children}</ThemeVanillaProvider>
     // );
-    return (_jsx(ThemeProvider, __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 })));
 };
-export default AppTheme;
+exports.AppTheme = AppTheme;
+exports.default = exports.AppTheme;

package/app/css/AppTheme.mjs

@@ -0,0 +1,15 @@
+import { __assign } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+// import { ThemeVanillaProvider, ThemeVanillaValue } from "@koine/react/styles";
+import { ThemeProvider } from "../../ThemeProvider";
+/**
+ * App theme with vanilla class based theme (good for `tailwindcss`)
+ */
+export var AppTheme = function (_a) {
+    var theme = _a.theme, children = _a.children;
+    // return (
+    //   <ThemeVanillaProvider initialTheme={theme}>{children}</ThemeVanillaProvider>
+    // );
+    return (_jsx(ThemeProvider, __assign({ defaultTheme: theme, attribute: "class" }, { children: children })));
+};
+export default AppTheme;

package/app/css/auth/index.js

@@ -1,13 +1,17 @@
-import { __assign } from "tslib";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { SessionProvider } from "next-auth/react";
-import { AppHead } from "../../AppHead";
-import { AppTheme } from "../AppTheme";
-import { AppMain } from "../AppMain";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NextApp = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("next-auth/react");
+var AppHead_1 = require("../../AppHead");
+var AppTheme_1 = require("../AppTheme");
+var AppMain_1 = require("../AppMain");
 /**
  * App with authentication provided by `next-auth`
  */
-export var NextApp = function (props) {
-    return (_jsxs(_Fragment, { children: [_jsx(AppHead, {}), _jsx(SessionProvider, __assign({ session: props.pageProps.session }, { children: _jsx(AppTheme, __assign({}, props, { children: _jsx(AppMain, __assign({}, props)) })) }))] }));
+var NextApp = function (props) {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(AppHead_1.AppHead, {}), (0, jsx_runtime_1.jsx)(react_1.SessionProvider, tslib_1.__assign({ session: props.pageProps.session }, { children: (0, jsx_runtime_1.jsx)(AppTheme_1.AppTheme, tslib_1.__assign({}, props, { children: (0, jsx_runtime_1.jsx)(AppMain_1.AppMain, tslib_1.__assign({}, props)) })) }))] }));
 };
-export default NextApp;
+exports.NextApp = NextApp;
+exports.default = exports.NextApp;

package/app/css/auth/index.mjs

@@ -0,0 +1,13 @@
+import { __assign } from "tslib";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { SessionProvider } from "next-auth/react";
+import { AppHead } from "../../AppHead";
+import { AppTheme } from "../AppTheme";
+import { AppMain } from "../AppMain";
+/**
+ * App with authentication provided by `next-auth`
+ */
+export var NextApp = function (props) {
+    return (_jsxs(_Fragment, { children: [_jsx(AppHead, {}), _jsx(SessionProvider, __assign({ session: props.pageProps.session }, { children: _jsx(AppTheme, __assign({}, props, { children: _jsx(AppMain, __assign({}, props)) })) }))] }));
+};
+export default NextApp;

package/app/css/auth/package.json

@@ -1,6 +1,6 @@
 {
   "sideEffects": false,
-  "module": "./index.js",
-  "main": "../../../node/app/css/auth/index.js",
+  "module": "./index.mjs",
+  "main": "./index.js",
   "types": "./index.d.ts"
 }

package/app/css/index.js

@@ -1,8 +1,11 @@
-import { __assign } from "tslib";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { AppHead } from "../AppHead";
-import { AppTheme } from "./AppTheme";
-import { AppMain } from "./AppMain";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NextApp = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var AppHead_1 = require("../AppHead");
+var AppTheme_1 = require("./AppTheme");
+var AppMain_1 = require("./AppMain");
 /**
  * App
  *
@@ -51,7 +54,8 @@ import { AppMain } from "./AppMain";
  *
  * ```
  */
-export var NextApp = function (props) {
-    return (_jsxs(_Fragment, { children: [_jsx(AppHead, {}), _jsx(AppTheme, __assign({}, props, { children: _jsx(AppMain, __assign({}, props)) }))] }));
+var NextApp = function (props) {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(AppHead_1.AppHead, {}), (0, jsx_runtime_1.jsx)(AppTheme_1.AppTheme, tslib_1.__assign({}, props, { children: (0, jsx_runtime_1.jsx)(AppMain_1.AppMain, tslib_1.__assign({}, props)) }))] }));
 };
-export default NextApp;
+exports.NextApp = NextApp;
+exports.default = exports.NextApp;

package/{node/app/css/index.js → app/css/index.mjs}

@@ -1,11 +1,8 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.NextApp = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
-var AppHead_1 = require("../AppHead");
-var AppTheme_1 = require("./AppTheme");
-var AppMain_1 = require("./AppMain");
+import { __assign } from "tslib";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { AppHead } from "../AppHead";
+import { AppTheme } from "./AppTheme";
+import { AppMain } from "./AppMain";
 /**
  * App
  *
@@ -54,8 +51,7 @@ var AppMain_1 = require("./AppMain");
  *
  * ```
  */
-var NextApp = function (props) {
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(AppHead_1.AppHead, {}), (0, jsx_runtime_1.jsx)(AppTheme_1.AppTheme, tslib_1.__assign({}, props, { children: (0, jsx_runtime_1.jsx)(AppMain_1.AppMain, tslib_1.__assign({}, props)) }))] }));
+export var NextApp = function (props) {
+    return (_jsxs(_Fragment, { children: [_jsx(AppHead, {}), _jsx(AppTheme, __assign({}, props, { children: _jsx(AppMain, __assign({}, props)) }))] }));
 };
-exports.NextApp = NextApp;
-exports.default = exports.NextApp;
+export default NextApp;

package/app/css/package.json

@@ -1,6 +1,6 @@
 {
   "sideEffects": false,
-  "module": "./index.js",
-  "main": "../../node/app/css/index.js",
+  "module": "./index.mjs",
+  "main": "./index.js",
   "types": "./index.d.ts"
 }

package/app/em/AppMain.js

@@ -1,11 +1,14 @@
-import { __assign } from "tslib";
-import { createElement as _createElement } from "react";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useRouter } from "next/router";
-import { AnimatePresence, m } from "framer-motion";
-import MotionProvider from "@koine/react/m/MotionProvider";
-import { SeoDefaults } from "../../SeoDefaults";
-import { NextProgress } from "../../NextProgress";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AppMain = void 0;
+var tslib_1 = require("tslib");
+var react_1 = require("react");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var router_1 = require("next/router");
+var framer_motion_1 = require("framer-motion");
+var MotionProvider_1 = tslib_1.__importDefault(require("@koine/react/m/MotionProvider"));
+var SeoDefaults_1 = require("../../SeoDefaults");
+var NextProgress_1 = require("../../NextProgress");
 /**
  * App main
  *
@@ -13,13 +16,14 @@ import { NextProgress } from "../../NextProgress";
  *
  * About the page transition [wallis' blog post](https://wallis.dev/blog/nextjs-page-transitions-with-framer-motion)
  */
-export var AppMain = function (_a) {
+var AppMain = function (_a) {
     var Component = _a.Component, pageProps = _a.pageProps, Layout = _a.Layout, ProgressOverlay = _a.ProgressOverlay, seo = _a.seo, motion = _a.motion, _b = _a.transition, transition = _b === void 0 ? {
         initial: { opacity: 0 },
         animate: { opacity: 1 },
         exit: { opacity: 0 },
     } : _b, pre = _a.pre, post = _a.post;
-    var pathname = useRouter().pathname;
-    return (_jsxs(_Fragment, { children: [_jsx(SeoDefaults, __assign({}, seo)), pre, _jsxs(MotionProvider, __assign({ features: motion }, { children: [ProgressOverlay && _jsx(NextProgress, { Overlay: ProgressOverlay }), _jsx(Layout, { children: _jsx(AnimatePresence, __assign({ exitBeforeEnter: true, initial: false }, { children: _jsx(m.div, __assign({}, transition, { children: _createElement(Component, __assign({}, pageProps, { key: pathname })) }), pathname) })) })] })), post] }));
+    var pathname = (0, router_1.useRouter)().pathname;
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(SeoDefaults_1.SeoDefaults, tslib_1.__assign({}, seo)), pre, (0, jsx_runtime_1.jsxs)(MotionProvider_1.default, tslib_1.__assign({ features: motion }, { children: [ProgressOverlay && (0, jsx_runtime_1.jsx)(NextProgress_1.NextProgress, { Overlay: ProgressOverlay }), (0, jsx_runtime_1.jsx)(Layout, { children: (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, tslib_1.__assign({ exitBeforeEnter: true, initial: false }, { children: (0, jsx_runtime_1.jsx)(framer_motion_1.m.div, tslib_1.__assign({}, transition, { children: (0, react_1.createElement)(Component, tslib_1.__assign({}, pageProps, { key: pathname })) }), pathname) })) })] })), post] }));
 };
-export default AppMain;
+exports.AppMain = AppMain;
+exports.default = exports.AppMain;

package/app/em/AppMain.mjs

@@ -0,0 +1,25 @@
+import { __assign } from "tslib";
+import { createElement as _createElement } from "react";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useRouter } from "next/router";
+import { AnimatePresence, m } from "framer-motion";
+import MotionProvider from "@koine/react/m/MotionProvider";
+import { SeoDefaults } from "../../SeoDefaults";
+import { NextProgress } from "../../NextProgress";
+/**
+ * App main
+ *
+ * It implies a setup for `styled-components` and `framer-motion` libraries.
+ *
+ * About the page transition [wallis' blog post](https://wallis.dev/blog/nextjs-page-transitions-with-framer-motion)
+ */
+export var AppMain = function (_a) {
+    var Component = _a.Component, pageProps = _a.pageProps, Layout = _a.Layout, ProgressOverlay = _a.ProgressOverlay, seo = _a.seo, motion = _a.motion, _b = _a.transition, transition = _b === void 0 ? {
+        initial: { opacity: 0 },
+        animate: { opacity: 1 },
+        exit: { opacity: 0 },
+    } : _b, pre = _a.pre, post = _a.post;
+    var pathname = useRouter().pathname;
+    return (_jsxs(_Fragment, { children: [_jsx(SeoDefaults, __assign({}, seo)), pre, _jsxs(MotionProvider, __assign({ features: motion }, { children: [ProgressOverlay && _jsx(NextProgress, { Overlay: ProgressOverlay }), _jsx(Layout, { children: _jsx(AnimatePresence, __assign({ exitBeforeEnter: true, initial: false }, { children: _jsx(m.div, __assign({}, transition, { children: _createElement(Component, __assign({}, pageProps, { key: pathname })) }), pathname) })) })] })), post] }));
+};
+export default AppMain;