@koine/next 1.0.9 → 1.0.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Analytics/AnalyticsGoogle.js +12 -16
- package/Auth/helpers.js +6 -5
- package/Auth/useLogin.js +17 -18
- package/Auth/useLoginUrl.js +5 -5
- package/Auth/useLogout.js +19 -19
- package/Favicon/Favicon.js +2 -1
- package/Forms/useForm.js +11 -13
- package/Forms/useSubmit.js +24 -19
- package/I18n/I18n.js +35 -14
- package/Img/Img.js +22 -20
- package/Link/Link.js +4 -2
- package/NextProgress/NextProgress.js +12 -9
- package/Seo/Seo.js +2 -2
- package/Seo/SeoDefaults.js +2 -2
- package/Seo/helpers.js +34 -30
- package/Theme/Theme.js +98 -88
- package/app/AppHead.js +1 -1
- package/app/css/AppMain.js +4 -2
- package/app/css/AppTheme.js +4 -2
- package/app/css/auth/index.js +3 -2
- package/app/css/index.js +3 -2
- package/app/em/AppMain.js +9 -7
- package/app/em/AppTheme.js +6 -5
- package/app/em/auth/index.js +3 -2
- package/app/em/index.js +3 -2
- package/app/sc/AppMain.js +9 -7
- package/app/sc/AppTheme.js +4 -2
- package/app/sc/auth/index.js +3 -2
- package/app/sc/index.js +3 -2
- package/config/index.js +62 -72
- package/document/Document.js +12 -5
- package/document/css/index.js +26 -12
- package/document/em/index.js +39 -48
- package/document/sc/index.js +44 -23
- package/node/Analytics/AnalyticsGoogle.js +17 -22
- package/node/Analytics/index.js +1 -1
- package/node/Auth/helpers.js +6 -5
- package/node/Auth/index.js +1 -1
- package/node/Auth/useLogin.js +23 -24
- package/node/Auth/useLoginUrl.js +8 -8
- package/node/Auth/useLogout.js +25 -25
- package/node/Favicon/Favicon.js +5 -5
- package/node/Favicon/index.js +1 -1
- package/node/Forms/index.js +1 -1
- package/node/Forms/useForm.js +15 -17
- package/node/Forms/useSubmit.js +25 -20
- package/node/Head/index.js +1 -1
- package/node/I18n/I18n.js +40 -20
- package/node/I18n/index.js +1 -1
- package/node/Img/Img.js +24 -23
- package/node/Img/index.js +1 -1
- package/node/Link/Link.js +7 -6
- package/node/Link/index.js +1 -1
- package/node/NextProgress/NextProgress.js +15 -12
- package/node/Seo/Seo.js +6 -6
- package/node/Seo/SeoDefaults.js +6 -6
- package/node/Seo/helpers.js +36 -32
- package/node/Seo/index.js +1 -1
- package/node/Theme/Theme.js +102 -93
- package/node/Theme/index.js +1 -1
- package/node/app/AppHead.js +4 -4
- package/node/app/css/AppMain.js +7 -6
- package/node/app/css/AppTheme.js +6 -4
- package/node/app/css/auth/index.js +9 -9
- package/node/app/css/index.js +8 -8
- package/node/app/em/AppMain.js +16 -14
- package/node/app/em/AppTheme.js +13 -13
- package/node/app/em/auth/index.js +9 -9
- package/node/app/em/index.js +8 -8
- package/node/app/index.js +1 -1
- package/node/app/sc/AppMain.js +16 -14
- package/node/app/sc/AppTheme.js +7 -5
- package/node/app/sc/auth/index.js +9 -9
- package/node/app/sc/index.js +8 -8
- package/node/config/index.js +62 -72
- package/node/document/Document.js +14 -9
- package/node/document/css/index.js +29 -17
- package/node/document/em/index.js +43 -54
- package/node/document/sc/index.js +48 -29
- package/node/index.js +1 -1
- package/node/utils/api.js +41 -32
- package/node/utils/emotion-cache.js +2 -2
- package/node/utils/index.js +7 -6
- package/package.json +28 -2
- package/utils/api.js +40 -31
- package/utils/index.js +7 -6
package/node/Seo/helpers.js
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.buildTags = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
var utils_1 = require("@koine/utils");
|
|
7
|
+
var defaults = {
|
|
7
8
|
tplTitle: "",
|
|
8
9
|
};
|
|
9
10
|
/**
|
|
@@ -20,14 +21,15 @@ const defaults = {
|
|
|
20
21
|
*
|
|
21
22
|
* @returns
|
|
22
23
|
*/
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
24
|
+
var buildTags = function (_a) {
|
|
25
|
+
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;
|
|
26
|
+
var render = [];
|
|
27
|
+
var $names = {};
|
|
28
|
+
var $properties = {};
|
|
27
29
|
if (titleTemplate) {
|
|
28
30
|
defaults.tplTitle = titleTemplate;
|
|
29
31
|
}
|
|
30
|
-
title = title || seo
|
|
32
|
+
title = title || (seo === null || seo === void 0 ? void 0 : seo.title) || "";
|
|
31
33
|
if (title) {
|
|
32
34
|
if (defaults.tplTitle && defaults.tplTitle !== title) {
|
|
33
35
|
title = defaults.tplTitle.replace(/%s/g, title);
|
|
@@ -40,26 +42,26 @@ const buildTags = ({ seo, hidden, keywords, title = "", titleTemplate, defaultTi
|
|
|
40
42
|
render.push((0, jsx_runtime_1.jsx)("title", { children: title }, "title"));
|
|
41
43
|
$properties["og:title"] = title; // overridden later...
|
|
42
44
|
}
|
|
43
|
-
$names["robots"] =
|
|
44
|
-
description = description || seo
|
|
45
|
+
$names["robots"] = "".concat(noindex || hidden ? "noindex" : "index", ",").concat(nofollow || hidden ? "nofollow" : "follow");
|
|
46
|
+
description = description || (seo === null || seo === void 0 ? void 0 : seo.description);
|
|
45
47
|
if (description) {
|
|
46
48
|
$names["description"] = description;
|
|
47
49
|
$properties["og:description"] = description; // overridden later...
|
|
48
50
|
}
|
|
49
|
-
keywords = keywords || seo
|
|
51
|
+
keywords = keywords || (seo === null || seo === void 0 ? void 0 : seo.keywords);
|
|
50
52
|
if (keywords) {
|
|
51
53
|
$names["keywords"] = (0, utils_1.isArray)(keywords) ? keywords.join(", ") : keywords;
|
|
52
54
|
}
|
|
53
|
-
if (languageAlternates
|
|
54
|
-
languageAlternates.forEach((languageAlternate)
|
|
55
|
-
render.push((0, jsx_runtime_1.jsx)("link", { rel: "alternate", hrefLang: languageAlternate.hrefLang, href: languageAlternate.href },
|
|
55
|
+
if ((languageAlternates === null || languageAlternates === void 0 ? void 0 : languageAlternates.length) > 0) {
|
|
56
|
+
languageAlternates.forEach(function (languageAlternate) {
|
|
57
|
+
render.push((0, jsx_runtime_1.jsx)("link", { rel: "alternate", hrefLang: languageAlternate.hrefLang, href: languageAlternate.href }, "languageAlternate-".concat(languageAlternate.hrefLang)));
|
|
56
58
|
});
|
|
57
59
|
}
|
|
58
60
|
if (canonical) {
|
|
59
61
|
render.push((0, jsx_runtime_1.jsx)("link", { rel: "canonical", href: canonical }, "canonical"));
|
|
60
62
|
$properties["og:url"] = canonical;
|
|
61
63
|
}
|
|
62
|
-
if (facebook
|
|
64
|
+
if (facebook === null || facebook === void 0 ? void 0 : facebook.appId)
|
|
63
65
|
$properties["fb:app_id"] = facebook.appId;
|
|
64
66
|
if (twitter) {
|
|
65
67
|
if (twitter.cardType)
|
|
@@ -69,36 +71,38 @@ const buildTags = ({ seo, hidden, keywords, title = "", titleTemplate, defaultTi
|
|
|
69
71
|
if (twitter.handle)
|
|
70
72
|
$names["twitter:creator"] = twitter.handle;
|
|
71
73
|
}
|
|
72
|
-
|
|
73
|
-
if (og
|
|
74
|
-
$properties["og:title"] = og
|
|
75
|
-
if (og
|
|
76
|
-
$properties["og:description"] = og
|
|
77
|
-
if (og
|
|
74
|
+
var og = ogAlias || openGraph;
|
|
75
|
+
if (og === null || og === void 0 ? void 0 : og.title)
|
|
76
|
+
$properties["og:title"] = og === null || og === void 0 ? void 0 : og.title;
|
|
77
|
+
if (og === null || og === void 0 ? void 0 : og.description)
|
|
78
|
+
$properties["og:description"] = og === null || og === void 0 ? void 0 : og.description;
|
|
79
|
+
if (og === null || og === void 0 ? void 0 : og.url)
|
|
78
80
|
$properties["og:url"] = og.url;
|
|
79
|
-
if (og
|
|
81
|
+
if (og === null || og === void 0 ? void 0 : og.type)
|
|
80
82
|
$properties["og:type"] = og.type.toLowerCase();
|
|
81
|
-
if (og
|
|
83
|
+
if (og === null || og === void 0 ? void 0 : og.locale)
|
|
82
84
|
$properties["og:locale"] = og.locale;
|
|
83
|
-
if (og
|
|
85
|
+
if (og === null || og === void 0 ? void 0 : og.site_name)
|
|
84
86
|
$properties["og:site_name"] = og.site_name;
|
|
85
|
-
|
|
87
|
+
var ogimage = (og === null || og === void 0 ? void 0 : og.image) || (seo === null || seo === void 0 ? void 0 : seo.ogimage);
|
|
86
88
|
if (ogimage)
|
|
87
89
|
$properties["og:image"] = ogimage;
|
|
88
|
-
Object.keys($names).forEach((key)
|
|
90
|
+
Object.keys($names).forEach(function (key) {
|
|
89
91
|
render.push((0, jsx_runtime_1.jsx)("meta", { name: key, content: $names[key] }, key));
|
|
90
92
|
});
|
|
91
|
-
Object.keys($properties).forEach((key)
|
|
93
|
+
Object.keys($properties).forEach(function (key) {
|
|
92
94
|
render.push((0, jsx_runtime_1.jsx)("meta", { property: key, content: $properties[key] }, key));
|
|
93
95
|
});
|
|
94
96
|
if (metaTags && metaTags.length > 0) {
|
|
95
|
-
metaTags.forEach((tag)
|
|
96
|
-
|
|
97
|
+
metaTags.forEach(function (tag) {
|
|
98
|
+
var _a, _b, _c;
|
|
99
|
+
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)));
|
|
97
100
|
});
|
|
98
101
|
}
|
|
99
|
-
if (linkTags
|
|
100
|
-
linkTags.forEach((tag)
|
|
101
|
-
|
|
102
|
+
if (linkTags === null || linkTags === void 0 ? void 0 : linkTags.length) {
|
|
103
|
+
linkTags.forEach(function (tag) {
|
|
104
|
+
var _a;
|
|
105
|
+
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)));
|
|
102
106
|
});
|
|
103
107
|
}
|
|
104
108
|
// TODO: alternates and canonical
|
package/node/Seo/index.js
CHANGED
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
* - https://nextjs.org/docs/api-reference/next/head
|
|
10
10
|
*/
|
|
11
11
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
-
|
|
12
|
+
var tslib_1 = require("tslib");
|
|
13
13
|
tslib_1.__exportStar(require("./helpers"), exports);
|
|
14
14
|
tslib_1.__exportStar(require("./Seo"), exports);
|
|
15
15
|
tslib_1.__exportStar(require("./SeoDefaults"), exports);
|
package/node/Theme/Theme.js
CHANGED
|
@@ -1,43 +1,49 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.ThemeProvider = exports.useTheme = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
6
|
/**
|
|
7
7
|
* @file
|
|
8
8
|
*
|
|
9
9
|
* Adapted from [next-themes](https://github.com/pacocoursey/next-themes)
|
|
10
10
|
*/
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
11
|
+
var react_1 = require("react");
|
|
12
|
+
var script_1 = tslib_1.__importDefault(require("next/script"));
|
|
13
|
+
var utils_1 = require("@koine/utils");
|
|
14
|
+
var THEME_STORAGE_KEY = "theme";
|
|
15
|
+
var colorSchemes = ["light", "dark"];
|
|
16
|
+
var MEDIA = "(prefers-color-scheme: dark)";
|
|
17
|
+
var ThemeContext = (0, react_1.createContext)({
|
|
18
18
|
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
19
|
-
setTheme: (_)
|
|
19
|
+
setTheme: function (_) { },
|
|
20
20
|
themes: [],
|
|
21
21
|
});
|
|
22
|
-
|
|
22
|
+
var useTheme = function () { return (0, react_1.useContext)(ThemeContext); };
|
|
23
23
|
exports.useTheme = useTheme;
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
24
|
+
var ThemeProvider = function (_a) {
|
|
25
|
+
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;
|
|
26
|
+
var _h = (0, react_1.useState)(function () {
|
|
27
|
+
return getTheme(THEME_STORAGE_KEY, defaultTheme);
|
|
28
|
+
}), theme = _h[0], setThemeState = _h[1];
|
|
29
|
+
var _j = (0, react_1.useState)(function () {
|
|
30
|
+
return getTheme(THEME_STORAGE_KEY);
|
|
31
|
+
}), resolvedTheme = _j[0], setResolvedTheme = _j[1];
|
|
32
|
+
var attrs = !value ? themes : Object.values(value);
|
|
33
|
+
var applyTheme = (0, react_1.useCallback)(function (theme) {
|
|
34
|
+
var _a;
|
|
35
|
+
var resolved = theme;
|
|
30
36
|
if (utils_1.isServer || !resolved)
|
|
31
37
|
return;
|
|
32
38
|
// If theme is system, resolve it before setting theme
|
|
33
39
|
if (theme === "system" && enableSystem) {
|
|
34
40
|
resolved = getSystemTheme();
|
|
35
41
|
}
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
42
|
+
var name = value ? value[resolved] : resolved;
|
|
43
|
+
var enable = disableTransitionOnChange ? disableAnimation() : null;
|
|
44
|
+
var d = document.documentElement;
|
|
39
45
|
if (attribute === "class") {
|
|
40
|
-
d.classList.remove(
|
|
46
|
+
(_a = d.classList).remove.apply(_a, attrs);
|
|
41
47
|
if (name)
|
|
42
48
|
d.classList.add(name);
|
|
43
49
|
}
|
|
@@ -50,15 +56,15 @@ const ThemeProvider = ({ forcedTheme, disableTransitionOnChange = false, enableS
|
|
|
50
56
|
}
|
|
51
57
|
}
|
|
52
58
|
if (enableColorScheme) {
|
|
53
|
-
|
|
59
|
+
var fallback = colorSchemes.includes(defaultTheme)
|
|
54
60
|
? defaultTheme
|
|
55
61
|
: "";
|
|
56
|
-
|
|
62
|
+
var colorScheme = colorSchemes.includes(resolved)
|
|
57
63
|
? resolved
|
|
58
64
|
: fallback;
|
|
59
65
|
d.style.colorScheme = colorScheme;
|
|
60
66
|
}
|
|
61
|
-
enable
|
|
67
|
+
enable === null || enable === void 0 ? void 0 : enable();
|
|
62
68
|
}, [
|
|
63
69
|
attribute,
|
|
64
70
|
attrs,
|
|
@@ -68,7 +74,7 @@ const ThemeProvider = ({ forcedTheme, disableTransitionOnChange = false, enableS
|
|
|
68
74
|
enableSystem,
|
|
69
75
|
value,
|
|
70
76
|
]);
|
|
71
|
-
|
|
77
|
+
var setTheme = (0, react_1.useCallback)(function (theme) {
|
|
72
78
|
setThemeState(theme);
|
|
73
79
|
// Save to storage
|
|
74
80
|
try {
|
|
@@ -78,87 +84,90 @@ const ThemeProvider = ({ forcedTheme, disableTransitionOnChange = false, enableS
|
|
|
78
84
|
// Unsupported
|
|
79
85
|
}
|
|
80
86
|
}, []);
|
|
81
|
-
|
|
82
|
-
|
|
87
|
+
var handleMediaQuery = (0, react_1.useCallback)(function (e) {
|
|
88
|
+
var resolved = getSystemTheme(e);
|
|
83
89
|
setResolvedTheme(resolved);
|
|
84
90
|
if (theme === "system" && enableSystem && !forcedTheme) {
|
|
85
91
|
applyTheme("system");
|
|
86
92
|
}
|
|
87
93
|
}, [theme, enableSystem, forcedTheme, applyTheme]);
|
|
88
94
|
// Always listen to System preference
|
|
89
|
-
(0, react_1.useEffect)(()
|
|
90
|
-
|
|
95
|
+
(0, react_1.useEffect)(function () {
|
|
96
|
+
var media = window.matchMedia(MEDIA);
|
|
91
97
|
// Intentionally use deprecated listener methods to support iOS & old browsers
|
|
92
98
|
media.addListener(handleMediaQuery);
|
|
93
99
|
handleMediaQuery(media);
|
|
94
|
-
return ()
|
|
100
|
+
return function () { return media.removeListener(handleMediaQuery); };
|
|
95
101
|
}, [handleMediaQuery]);
|
|
96
102
|
// localStorage event handling
|
|
97
|
-
(0, react_1.useEffect)(()
|
|
98
|
-
|
|
103
|
+
(0, react_1.useEffect)(function () {
|
|
104
|
+
var handleStorage = function (e) {
|
|
99
105
|
if (e.key !== THEME_STORAGE_KEY) {
|
|
100
106
|
return;
|
|
101
107
|
}
|
|
102
108
|
// If default theme set, use it if localstorage === null (happens on local storage manual deletion)
|
|
103
|
-
|
|
109
|
+
var theme = e.newValue || defaultTheme;
|
|
104
110
|
setTheme(theme);
|
|
105
111
|
};
|
|
106
112
|
window.addEventListener("storage", handleStorage);
|
|
107
|
-
return ()
|
|
113
|
+
return function () { return window.removeEventListener("storage", handleStorage); };
|
|
108
114
|
}, [defaultTheme, setTheme]);
|
|
109
115
|
// Whenever theme or forcedTheme changes, apply it
|
|
110
|
-
(0, react_1.useEffect)(()
|
|
111
|
-
applyTheme(forcedTheme
|
|
116
|
+
(0, react_1.useEffect)(function () {
|
|
117
|
+
applyTheme(forcedTheme !== null && forcedTheme !== void 0 ? forcedTheme : theme);
|
|
112
118
|
}, [applyTheme, forcedTheme, theme]);
|
|
113
|
-
return ((0, jsx_runtime_1.jsxs)(ThemeContext.Provider, { value: {
|
|
114
|
-
theme,
|
|
115
|
-
setTheme,
|
|
116
|
-
forcedTheme,
|
|
119
|
+
return ((0, jsx_runtime_1.jsxs)(ThemeContext.Provider, tslib_1.__assign({ value: {
|
|
120
|
+
theme: theme,
|
|
121
|
+
setTheme: setTheme,
|
|
122
|
+
forcedTheme: forcedTheme,
|
|
117
123
|
resolvedTheme: theme === "system" ? resolvedTheme : theme,
|
|
118
|
-
themes: enableSystem ? [
|
|
124
|
+
themes: enableSystem ? tslib_1.__spreadArray(tslib_1.__spreadArray([], themes, true), ["system"], false) : themes,
|
|
119
125
|
systemTheme: (enableSystem ? resolvedTheme : undefined),
|
|
120
|
-
}, children: [(0, jsx_runtime_1.jsx)(ThemeScript, {
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
126
|
+
} }, { children: [(0, jsx_runtime_1.jsx)(ThemeScript, tslib_1.__assign({}, {
|
|
127
|
+
forcedTheme: forcedTheme,
|
|
128
|
+
disableTransitionOnChange: disableTransitionOnChange,
|
|
129
|
+
enableSystem: enableSystem,
|
|
130
|
+
enableColorScheme: enableColorScheme,
|
|
131
|
+
themes: themes,
|
|
132
|
+
defaultTheme: defaultTheme,
|
|
133
|
+
attribute: attribute,
|
|
134
|
+
value: value,
|
|
135
|
+
children: children,
|
|
136
|
+
attrs: attrs,
|
|
137
|
+
nonce: nonce,
|
|
138
|
+
})), children] })));
|
|
133
139
|
};
|
|
134
140
|
exports.ThemeProvider = ThemeProvider;
|
|
135
|
-
|
|
136
|
-
|
|
141
|
+
var ThemeScript = (0, react_1.memo)(function (_a) {
|
|
142
|
+
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;
|
|
143
|
+
var defaultSystem = defaultTheme === "system";
|
|
137
144
|
// Code-golfing the amount of characters in the script
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
.map((t)
|
|
141
|
-
.join(",")
|
|
142
|
-
return
|
|
145
|
+
var optimization = (function () {
|
|
146
|
+
var removeClasses = "d.remove(".concat(attrs
|
|
147
|
+
.map(function (t) { return "'".concat(t, "'"); })
|
|
148
|
+
.join(","), ")");
|
|
149
|
+
return "var d=document.documentElement.classList;".concat(removeClasses, ";");
|
|
143
150
|
})();
|
|
144
|
-
|
|
151
|
+
var fallbackColorScheme = (function () {
|
|
145
152
|
if (!enableColorScheme) {
|
|
146
153
|
return "";
|
|
147
154
|
}
|
|
148
|
-
|
|
155
|
+
var fallback = colorSchemes.includes(defaultTheme)
|
|
149
156
|
? defaultTheme
|
|
150
157
|
: null;
|
|
151
158
|
if (fallback) {
|
|
152
|
-
return
|
|
159
|
+
return "if(e==='light'||e==='dark'||!e)d.style.colorScheme=e||'".concat(defaultTheme, "'");
|
|
153
160
|
}
|
|
154
161
|
else {
|
|
155
|
-
return
|
|
162
|
+
return "if(e==='light'||e==='dark')d.style.colorScheme=e";
|
|
156
163
|
}
|
|
157
164
|
})();
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
165
|
+
var updateDOM = function (name, literal, setColorScheme) {
|
|
166
|
+
if (literal === void 0) { literal = false; }
|
|
167
|
+
if (setColorScheme === void 0) { setColorScheme = true; }
|
|
168
|
+
var resolvedName = value ? value[name] : name;
|
|
169
|
+
var val = literal ? name + "|| ''" : "'".concat(resolvedName, "'");
|
|
170
|
+
var text = "";
|
|
162
171
|
// MUCH faster to set colorScheme alongside HTML attribute/class
|
|
163
172
|
// as it only incurs 1 style recalculation rather than 2
|
|
164
173
|
// This can save over 250ms of work for pages with big DOM
|
|
@@ -166,48 +175,48 @@ const ThemeScript = (0, react_1.memo)(({ forcedTheme, attribute, enableSystem, e
|
|
|
166
175
|
setColorScheme &&
|
|
167
176
|
!literal &&
|
|
168
177
|
colorSchemes.includes(name)) {
|
|
169
|
-
text +=
|
|
178
|
+
text += "d.style.colorScheme = '".concat(name, "';");
|
|
170
179
|
}
|
|
171
180
|
if (attribute === "class") {
|
|
172
181
|
if (literal || resolvedName) {
|
|
173
|
-
text +=
|
|
182
|
+
text += "d.add(".concat(val, ")");
|
|
174
183
|
}
|
|
175
184
|
else {
|
|
176
|
-
text +=
|
|
185
|
+
text += "null";
|
|
177
186
|
}
|
|
178
187
|
}
|
|
179
188
|
else {
|
|
180
189
|
if (resolvedName) {
|
|
181
|
-
text +=
|
|
190
|
+
text += "d[s](n, ".concat(val, ")");
|
|
182
191
|
}
|
|
183
192
|
}
|
|
184
193
|
return text;
|
|
185
194
|
};
|
|
186
|
-
|
|
195
|
+
var scriptSrc = (function () {
|
|
187
196
|
if (forcedTheme) {
|
|
188
|
-
return
|
|
197
|
+
return "!function(){".concat(optimization).concat(updateDOM(forcedTheme), "}()");
|
|
189
198
|
}
|
|
190
199
|
if (enableSystem) {
|
|
191
|
-
return
|
|
192
|
-
?
|
|
193
|
-
: ""
|
|
200
|
+
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
|
|
201
|
+
? "else{" + updateDOM(defaultTheme, false, false) + "}"
|
|
202
|
+
: "").concat(fallbackColorScheme, "}catch(e){}}()");
|
|
194
203
|
}
|
|
195
|
-
return
|
|
204
|
+
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){}}();");
|
|
196
205
|
})();
|
|
197
206
|
// We MUST use next/script's `beforeInteractive` strategy to avoid flashing on load.
|
|
198
207
|
// However, it only accepts the `src` prop, not `dangerouslySetInnerHTML` or `children`
|
|
199
208
|
// But our script cannot be external because it changes at runtime based on React props
|
|
200
209
|
// so we trick next/script by passing `src` as a base64 JS script
|
|
201
|
-
|
|
210
|
+
var encodedScript = "data:text/javascript;base64,".concat(encodeBase64(scriptSrc));
|
|
202
211
|
return ((0, jsx_runtime_1.jsx)(script_1.default, { id: "next-theme-script", strategy: "beforeInteractive", src: encodedScript, nonce: nonce }));
|
|
203
212
|
},
|
|
204
213
|
// Never re-render this component
|
|
205
|
-
()
|
|
214
|
+
function () { return true; });
|
|
206
215
|
// Helpers
|
|
207
|
-
|
|
216
|
+
var getTheme = function (key, fallback) {
|
|
208
217
|
if (utils_1.isServer)
|
|
209
218
|
return undefined;
|
|
210
|
-
|
|
219
|
+
var theme;
|
|
211
220
|
try {
|
|
212
221
|
theme = localStorage.getItem(key) || undefined;
|
|
213
222
|
}
|
|
@@ -216,26 +225,26 @@ const getTheme = (key, fallback) => {
|
|
|
216
225
|
}
|
|
217
226
|
return theme || fallback;
|
|
218
227
|
};
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
css.appendChild(document.createTextNode(
|
|
228
|
+
var disableAnimation = function () {
|
|
229
|
+
var css = document.createElement("style");
|
|
230
|
+
css.appendChild(document.createTextNode("*{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}"));
|
|
222
231
|
document.head.appendChild(css);
|
|
223
|
-
return ()
|
|
232
|
+
return function () {
|
|
224
233
|
// Force restyle
|
|
225
|
-
(()
|
|
234
|
+
(function () { return window.getComputedStyle(document.body); })();
|
|
226
235
|
// Wait for next tick before removing
|
|
227
|
-
setTimeout(()
|
|
236
|
+
setTimeout(function () {
|
|
228
237
|
document.head.removeChild(css);
|
|
229
238
|
}, 1);
|
|
230
239
|
};
|
|
231
240
|
};
|
|
232
|
-
|
|
241
|
+
var getSystemTheme = function (e) {
|
|
233
242
|
if (!e)
|
|
234
243
|
e = window.matchMedia(MEDIA);
|
|
235
|
-
|
|
236
|
-
|
|
244
|
+
var isDark = e.matches;
|
|
245
|
+
var systemTheme = isDark ? "dark" : "light";
|
|
237
246
|
return systemTheme;
|
|
238
247
|
};
|
|
239
|
-
|
|
248
|
+
var encodeBase64 = function (str) {
|
|
240
249
|
return utils_1.isServer ? Buffer.from(str).toString("base64") : btoa(str);
|
|
241
250
|
};
|
package/node/Theme/index.js
CHANGED
package/node/app/AppHead.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.AppHead = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
var head_1 = tslib_1.__importDefault(require("next/head"));
|
|
7
|
+
var AppHead = function () {
|
|
8
8
|
return ((0, jsx_runtime_1.jsx)(head_1.default, { children: (0, jsx_runtime_1.jsx)("meta", { name: "viewport", content: "width=device-width" }) }));
|
|
9
9
|
};
|
|
10
10
|
exports.AppHead = AppHead;
|
package/node/app/css/AppMain.js
CHANGED
|
@@ -1,16 +1,17 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.AppMain = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
var react_1 = tslib_1.__importDefault(require("react"));
|
|
7
|
+
var Seo_1 = require("../../Seo");
|
|
8
8
|
/**
|
|
9
9
|
* App main
|
|
10
10
|
*
|
|
11
11
|
* It does not imply any specific styling or animation solution
|
|
12
12
|
*/
|
|
13
|
-
|
|
14
|
-
|
|
13
|
+
var AppMain = function (_a) {
|
|
14
|
+
var Component = _a.Component, pageProps = _a.pageProps, Layout = _a.Layout, seo = _a.seo, pre = _a.pre, post = _a.post;
|
|
15
|
+
return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(Seo_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] }));
|
|
15
16
|
};
|
|
16
17
|
exports.AppMain = AppMain;
|
package/node/app/css/AppTheme.js
CHANGED
|
@@ -1,16 +1,18 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.AppTheme = void 0;
|
|
4
|
-
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
6
|
// import { ThemeVanillaProvider, ThemeVanillaValue } from "@koine/react";
|
|
6
|
-
|
|
7
|
+
var Theme_1 = require("../../Theme");
|
|
7
8
|
/**
|
|
8
9
|
* App theme with vanilla class based theme (good for `tailwindcss`)
|
|
9
10
|
*/
|
|
10
|
-
|
|
11
|
+
var AppTheme = function (_a) {
|
|
12
|
+
var theme = _a.theme, children = _a.children;
|
|
11
13
|
// return (
|
|
12
14
|
// <ThemeVanillaProvider initialTheme={theme}>{children}</ThemeVanillaProvider>
|
|
13
15
|
// );
|
|
14
|
-
return ((0, jsx_runtime_1.jsx)(Theme_1.ThemeProvider, { defaultTheme: theme, attribute: "class", children: children }));
|
|
16
|
+
return ((0, jsx_runtime_1.jsx)(Theme_1.ThemeProvider, tslib_1.__assign({ defaultTheme: theme, attribute: "class" }, { children: children })));
|
|
15
17
|
};
|
|
16
18
|
exports.AppTheme = AppTheme;
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.NextApp = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
var react_1 = tslib_1.__importDefault(require("react"));
|
|
7
|
+
var react_2 = require("next-auth/react");
|
|
8
|
+
var AppHead_1 = require("../../AppHead");
|
|
9
|
+
var AppTheme_1 = require("../AppTheme");
|
|
10
|
+
var AppMain_1 = require("../AppMain");
|
|
11
11
|
/**
|
|
12
12
|
* App with authentication provided by `next-auth`
|
|
13
13
|
*/
|
|
14
|
-
|
|
15
|
-
return ((0, jsx_runtime_1.jsxs)(react_1.default.StrictMode, { children: [(0, jsx_runtime_1.jsx)(AppHead_1.AppHead, {}), (0, jsx_runtime_1.jsx)(react_2.SessionProvider, { session: props.pageProps.session, children: (0, jsx_runtime_1.jsx)(AppTheme_1.AppTheme, {
|
|
14
|
+
var NextApp = function (props) {
|
|
15
|
+
return ((0, jsx_runtime_1.jsxs)(react_1.default.StrictMode, { children: [(0, jsx_runtime_1.jsx)(AppHead_1.AppHead, {}), (0, jsx_runtime_1.jsx)(react_2.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)) })) }))] }));
|
|
16
16
|
};
|
|
17
17
|
exports.NextApp = NextApp;
|
|
18
18
|
exports.default = exports.NextApp;
|
package/node/app/css/index.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.NextApp = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
var react_1 = tslib_1.__importDefault(require("react"));
|
|
7
|
+
var AppHead_1 = require("../AppHead");
|
|
8
|
+
var AppTheme_1 = require("./AppTheme");
|
|
9
|
+
var AppMain_1 = require("./AppMain");
|
|
10
10
|
/**
|
|
11
11
|
* App
|
|
12
12
|
*
|
|
@@ -55,8 +55,8 @@ const AppMain_1 = require("./AppMain");
|
|
|
55
55
|
*
|
|
56
56
|
* ```
|
|
57
57
|
*/
|
|
58
|
-
|
|
59
|
-
return ((0, jsx_runtime_1.jsxs)(react_1.default.StrictMode, { children: [(0, jsx_runtime_1.jsx)(AppHead_1.AppHead, {}), (0, jsx_runtime_1.jsx)(AppTheme_1.AppTheme, {
|
|
58
|
+
var NextApp = function (props) {
|
|
59
|
+
return ((0, jsx_runtime_1.jsxs)(react_1.default.StrictMode, { 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)) }))] }));
|
|
60
60
|
};
|
|
61
61
|
exports.NextApp = NextApp;
|
|
62
62
|
exports.default = exports.NextApp;
|