@koine/next 2.0.0-beta.7 → 2.0.0-beta.70
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/12/AnalyticsGoogle.d.ts +1 -2
- package/12/DisableErrorOverlay.d.ts +1 -6
- package/12/Seo.d.ts +8 -26
- package/12/SeoDefaults.d.ts +3 -4
- package/12/seoBuildTags.d.ts +1 -16
- package/12/types.d.ts +2 -0
- package/12.cjs.d.ts +1 -0
- package/12.cjs.default.js +1 -0
- package/12.cjs.js +28 -0
- package/12.cjs.mjs +2 -0
- package/12.d.ts +3 -0
- package/12.esm.js +18 -0
- package/README.md +0 -12
- package/config.cjs.d.ts +1 -0
- package/config.cjs.default.js +1 -0
- package/config.cjs.js +9 -0
- package/config.cjs.mjs +2 -0
- package/config.d.ts +7 -0
- package/config.esm.js +5 -0
- package/index.cjs.d.ts +1 -0
- package/index.cjs.default.js +1 -0
- package/index.cjs.js +25 -0
- package/index.cjs.mjs +2 -0
- package/index.d.ts +4 -2
- package/index.esm.js +14 -0
- package/package.json +30 -69
- package/theme/ThemeContext.d.ts +11 -0
- package/theme/ThemeProvider.d.ts +17 -0
- package/theme/useTheme.d.ts +4 -0
- package/typings.d.ts +39 -50
- package/utils/load.d.ts +1 -0
- package/12/AnalyticsGoogle.js +0 -79
- package/12/AnalyticsGoogle.mjs +0 -60
- package/12/DisableErrorOverlay.js +0 -31
- package/12/DisableErrorOverlay.mjs +0 -16
- package/12/DynamicNamespaces.d.ts +0 -13
- package/12/DynamicNamespaces.js +0 -23
- package/12/DynamicNamespaces.mjs +0 -8
- package/12/Favicon.d.ts +0 -4
- package/12/Favicon.js +0 -29
- package/12/Favicon.mjs +0 -10
- package/12/Link.d.ts +0 -10
- package/12/Link.js +0 -38
- package/12/Link.mjs +0 -20
- package/12/NextProgress.d.ts +0 -25
- package/12/NextProgress.js +0 -69
- package/12/NextProgress.mjs +0 -51
- package/12/Seo.js +0 -29
- package/12/Seo.mjs +0 -30
- package/12/SeoDefaults.js +0 -31
- package/12/SeoDefaults.mjs +0 -14
- package/12/T.d.ts +0 -16
- package/12/T.js +0 -43
- package/12/T.mjs +0 -27
- package/12/ThemeContext.d.ts +0 -17
- package/12/ThemeContext.js +0 -25
- package/12/ThemeContext.mjs +0 -7
- package/12/ThemeProvider.d.ts +0 -35
- package/12/ThemeProvider.js +0 -256
- package/12/ThemeProvider.mjs +0 -245
- package/12/TransText.d.ts +0 -3
- package/12/TransText.js +0 -23
- package/12/TransText.mjs +0 -4
- package/12/app/AppHead.d.ts +0 -3
- package/12/app/AppHead.js +0 -31
- package/12/app/AppHead.mjs +0 -12
- package/12/app/AppMain.d.ts +0 -35
- package/12/app/AppMain.js +0 -6
- package/12/app/AppMain.mjs +0 -1
- package/12/app/css/AppMain.d.ts +0 -9
- package/12/app/css/AppMain.js +0 -39
- package/12/app/css/AppMain.mjs +0 -24
- package/12/app/css/AppTheme.d.ts +0 -11
- package/12/app/css/AppTheme.js +0 -33
- package/12/app/css/AppTheme.mjs +0 -17
- package/12/app/css/auth/index.d.ts +0 -11
- package/12/app/css/auth/index.js +0 -40
- package/12/app/css/auth/index.mjs +0 -24
- package/12/app/css/index.d.ts +0 -54
- package/12/app/css/index.js +0 -36
- package/12/app/css/index.mjs +0 -65
- package/12/app/index.d.ts +0 -2
- package/12/app/index.js +0 -7
- package/12/app/index.mjs +0 -2
- package/12/app/sc/AppMain.d.ts +0 -11
- package/12/app/sc/AppMain.js +0 -70
- package/12/app/sc/AppMain.mjs +0 -58
- package/12/app/sc/AppTheme.d.ts +0 -14
- package/12/app/sc/AppTheme.js +0 -33
- package/12/app/sc/AppTheme.mjs +0 -16
- package/12/app/sc/auth/index.d.ts +0 -11
- package/12/app/sc/auth/index.js +0 -40
- package/12/app/sc/auth/index.mjs +0 -24
- package/12/app/sc/index.d.ts +0 -56
- package/12/app/sc/index.js +0 -36
- package/12/app/sc/index.mjs +0 -67
- package/12/document/Document.d.ts +0 -15
- package/12/document/Document.js +0 -49
- package/12/document/Document.mjs +0 -38
- package/12/document/css/index.d.ts +0 -17
- package/12/document/css/index.js +0 -60
- package/12/document/css/index.mjs +0 -53
- package/12/document/index.d.ts +0 -2
- package/12/document/index.js +0 -19
- package/12/document/index.mjs +0 -2
- package/12/document/sc/index.d.ts +0 -19
- package/12/document/sc/index.js +0 -73
- package/12/document/sc/index.mjs +0 -65
- package/12/getT.d.ts +0 -9
- package/12/getT.js +0 -23
- package/12/getT.mjs +0 -8
- package/12/index.d.ts +0 -24
- package/12/index.js +0 -100
- package/12/index.mjs +0 -27
- package/12/seoBuildTags.js +0 -126
- package/12/seoBuildTags.mjs +0 -121
- package/12/to.d.ts +0 -24
- package/12/to.js +0 -31
- package/12/to.mjs +0 -19
- package/12/translationAsOptions.d.ts +0 -3
- package/12/translationAsOptions.js +0 -19
- package/12/translationAsOptions.mjs +0 -9
- package/12/types-i18n.d.ts +0 -118
- package/12/types-i18n.js +0 -15
- package/12/types-i18n.mjs +0 -12
- package/12/types-seo.d.ts +0 -7
- package/12/types-seo.js +0 -4
- package/12/types-seo.mjs +0 -1
- package/12/useBackUrl.d.ts +0 -2
- package/12/useBackUrl.js +0 -47
- package/12/useBackUrl.mjs +0 -28
- package/12/useDateFormat.d.ts +0 -7
- package/12/useDateFormat.js +0 -42
- package/12/useDateFormat.mjs +0 -26
- package/12/useForm.d.ts +0 -27
- package/12/useForm.js +0 -65
- package/12/useForm.mjs +0 -47
- package/12/useLocale.d.ts +0 -2
- package/12/useLocale.js +0 -25
- package/12/useLocale.mjs +0 -6
- package/12/useT.d.ts +0 -4
- package/12/useT.js +0 -58
- package/12/useT.mjs +0 -39
- package/12/useTheme.d.ts +0 -7
- package/12/useTheme.js +0 -23
- package/12/useTheme.mjs +0 -7
- package/12/useTo.d.ts +0 -3
- package/12/useTo.js +0 -26
- package/12/useTo.mjs +0 -8
- package/config/index.d.ts +0 -160
- package/config/index.js +0 -317
- package/config/index.mjs +0 -315
- package/getSiteUrl.d.ts +0 -8
- package/getSiteUrl.js +0 -24
- package/getSiteUrl.mjs +0 -10
- package/index.js +0 -20
- package/index.mjs +0 -2
- package/load.d.ts +0 -10
- package/load.js +0 -31
- package/load.mjs +0 -13
package/12/ThemeContext.mjs
DELETED
package/12/ThemeProvider.d.ts
DELETED
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
type ValueObject = {
|
|
3
|
-
[themeName: string]: string;
|
|
4
|
-
};
|
|
5
|
-
export type ThemeProviderProps = React.PropsWithChildren<{
|
|
6
|
-
/** List of all available theme names */
|
|
7
|
-
themes?: string[];
|
|
8
|
-
/** Forced theme name for the current page */
|
|
9
|
-
forcedTheme?: string;
|
|
10
|
-
/** Whether to switch between dark and light themes based on prefers-color-scheme */
|
|
11
|
-
enableSystem?: boolean;
|
|
12
|
-
/** Disable all CSS transitions when switching themes */
|
|
13
|
-
disableTransitionOnChange?: boolean;
|
|
14
|
-
/** Whether to indicate to browsers which color scheme is used (dark or light) for built-in UI like inputs and buttons */
|
|
15
|
-
enableColorScheme?: boolean;
|
|
16
|
-
/** Default theme name (for v0.0.12 and lower the default was light). If `enableSystem` is false, the default theme is light */
|
|
17
|
-
defaultTheme?: string;
|
|
18
|
-
/** HTML attribute modified based on the active theme. Accepts `class` and `data-*` (meaning any data attribute, `data-mode`, `data-color`, etc.) */
|
|
19
|
-
attribute?: string | "class";
|
|
20
|
-
/** Mapping of theme name to HTML attribute value. Object where key is the theme name and value is the attribute value */
|
|
21
|
-
value?: ValueObject;
|
|
22
|
-
/** Nonce string to pass to the inline script for CSP headers */
|
|
23
|
-
nonce?: string;
|
|
24
|
-
}>;
|
|
25
|
-
/**
|
|
26
|
-
* @borrows [next-themes](https://github.com/pacocoursey/next-themes)
|
|
27
|
-
*
|
|
28
|
-
* Differences:
|
|
29
|
-
*
|
|
30
|
-
* - enableColorScheme: `false` by default (instead of `true`), this plays more
|
|
31
|
-
* nicely with tailwind `dark` class mode as dark theme is supposed to be only
|
|
32
|
-
* controlled by tailwind modifiers
|
|
33
|
-
*/
|
|
34
|
-
export declare const ThemeProvider: ({ forcedTheme, disableTransitionOnChange, enableSystem, enableColorScheme, themes, defaultTheme, attribute, value, children, nonce, }: ThemeProviderProps) => import("react/jsx-runtime").JSX.Element;
|
|
35
|
-
export default ThemeProvider;
|
package/12/ThemeProvider.js
DELETED
|
@@ -1,256 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
"use strict";
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
function _export(target, all) {
|
|
7
|
-
for(var name in all)Object.defineProperty(target, name, {
|
|
8
|
-
enumerable: true,
|
|
9
|
-
get: all[name]
|
|
10
|
-
});
|
|
11
|
-
}
|
|
12
|
-
_export(exports, {
|
|
13
|
-
ThemeProvider: function() {
|
|
14
|
-
return ThemeProvider;
|
|
15
|
-
},
|
|
16
|
-
default: function() {
|
|
17
|
-
return _default;
|
|
18
|
-
}
|
|
19
|
-
});
|
|
20
|
-
const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
|
|
21
|
-
const _jsxruntime = require("react/jsx-runtime");
|
|
22
|
-
const _script = /*#__PURE__*/ _interop_require_default._(require("next/script"));
|
|
23
|
-
const _react = require("react");
|
|
24
|
-
const _isServer = /*#__PURE__*/ _interop_require_default._(require("@koine/utils/isServer"));
|
|
25
|
-
const _ThemeContext = require("./ThemeContext");
|
|
26
|
-
const colorSchemes = [
|
|
27
|
-
"light",
|
|
28
|
-
"dark"
|
|
29
|
-
];
|
|
30
|
-
const MEDIA = "(prefers-color-scheme: dark)";
|
|
31
|
-
const THEME_STORAGE_KEY = "theme";
|
|
32
|
-
const ThemeProvider = ({ forcedTheme, disableTransitionOnChange = false, enableSystem = true, enableColorScheme, themes = [
|
|
33
|
-
"light",
|
|
34
|
-
"dark"
|
|
35
|
-
], defaultTheme = enableSystem ? "system" : "light", attribute = "data-theme", value, children, nonce })=>{
|
|
36
|
-
const [theme, setThemeState] = (0, _react.useState)(()=>getTheme(THEME_STORAGE_KEY, defaultTheme));
|
|
37
|
-
const [resolvedTheme, setResolvedTheme] = (0, _react.useState)(()=>getTheme(THEME_STORAGE_KEY));
|
|
38
|
-
const attrs = !value ? themes : Object.values(value);
|
|
39
|
-
const applyTheme = (0, _react.useCallback)((theme)=>{
|
|
40
|
-
let resolved = theme;
|
|
41
|
-
if (_isServer.default || !resolved) return;
|
|
42
|
-
// If theme is system, resolve it before setting theme
|
|
43
|
-
if (theme === "system" && enableSystem) {
|
|
44
|
-
resolved = getSystemTheme();
|
|
45
|
-
}
|
|
46
|
-
const name = value ? value[resolved] : resolved;
|
|
47
|
-
const enable = disableTransitionOnChange ? disableAnimation() : null;
|
|
48
|
-
const d = document.documentElement;
|
|
49
|
-
if (attribute === "class") {
|
|
50
|
-
d.classList.remove(...attrs);
|
|
51
|
-
if (name) d.classList.add(name);
|
|
52
|
-
} else {
|
|
53
|
-
if (name) {
|
|
54
|
-
d.setAttribute(attribute, name);
|
|
55
|
-
} else {
|
|
56
|
-
d.removeAttribute(attribute);
|
|
57
|
-
}
|
|
58
|
-
}
|
|
59
|
-
if (enableColorScheme) {
|
|
60
|
-
const fallback = colorSchemes.includes(defaultTheme) ? defaultTheme : "";
|
|
61
|
-
const colorScheme = colorSchemes.includes(resolved) ? resolved : fallback;
|
|
62
|
-
d.style.colorScheme = colorScheme;
|
|
63
|
-
}
|
|
64
|
-
enable?.();
|
|
65
|
-
}, [
|
|
66
|
-
attribute,
|
|
67
|
-
attrs,
|
|
68
|
-
defaultTheme,
|
|
69
|
-
disableTransitionOnChange,
|
|
70
|
-
enableColorScheme,
|
|
71
|
-
enableSystem,
|
|
72
|
-
value
|
|
73
|
-
]);
|
|
74
|
-
const setTheme = (0, _react.useCallback)((theme)=>{
|
|
75
|
-
setThemeState(theme);
|
|
76
|
-
// Save to storage
|
|
77
|
-
try {
|
|
78
|
-
localStorage.setItem(THEME_STORAGE_KEY, theme);
|
|
79
|
-
} catch (e) {
|
|
80
|
-
// Unsupported
|
|
81
|
-
}
|
|
82
|
-
}, []);
|
|
83
|
-
const handleMediaQuery = (0, _react.useCallback)((e)=>{
|
|
84
|
-
const resolved = getSystemTheme(e);
|
|
85
|
-
setResolvedTheme(resolved);
|
|
86
|
-
if (theme === "system" && enableSystem && !forcedTheme) {
|
|
87
|
-
applyTheme("system");
|
|
88
|
-
}
|
|
89
|
-
}, [
|
|
90
|
-
theme,
|
|
91
|
-
enableSystem,
|
|
92
|
-
forcedTheme,
|
|
93
|
-
applyTheme
|
|
94
|
-
]);
|
|
95
|
-
// Always listen to System preference
|
|
96
|
-
(0, _react.useEffect)(()=>{
|
|
97
|
-
const media = window.matchMedia(MEDIA);
|
|
98
|
-
// Intentionally use deprecated listener methods to support iOS & old browsers
|
|
99
|
-
media.addListener(handleMediaQuery);
|
|
100
|
-
handleMediaQuery(media);
|
|
101
|
-
return ()=>media.removeListener(handleMediaQuery);
|
|
102
|
-
}, [
|
|
103
|
-
handleMediaQuery
|
|
104
|
-
]);
|
|
105
|
-
// localStorage event handling
|
|
106
|
-
(0, _react.useEffect)(()=>{
|
|
107
|
-
const handleStorage = (e)=>{
|
|
108
|
-
if (e.key !== THEME_STORAGE_KEY) {
|
|
109
|
-
return;
|
|
110
|
-
}
|
|
111
|
-
// If default theme set, use it if localstorage === null (happens on local storage manual deletion)
|
|
112
|
-
const theme = e.newValue || defaultTheme;
|
|
113
|
-
setTheme(theme);
|
|
114
|
-
};
|
|
115
|
-
window.addEventListener("storage", handleStorage);
|
|
116
|
-
return ()=>window.removeEventListener("storage", handleStorage);
|
|
117
|
-
}, [
|
|
118
|
-
defaultTheme,
|
|
119
|
-
setTheme
|
|
120
|
-
]);
|
|
121
|
-
// Whenever theme or forcedTheme changes, apply it
|
|
122
|
-
(0, _react.useEffect)(()=>{
|
|
123
|
-
applyTheme(forcedTheme ?? theme);
|
|
124
|
-
}, [
|
|
125
|
-
applyTheme,
|
|
126
|
-
forcedTheme,
|
|
127
|
-
theme
|
|
128
|
-
]);
|
|
129
|
-
return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_ThemeContext.ThemeContext.Provider, {
|
|
130
|
-
value: {
|
|
131
|
-
theme,
|
|
132
|
-
setTheme,
|
|
133
|
-
forcedTheme,
|
|
134
|
-
resolvedTheme: theme === "system" ? resolvedTheme : theme,
|
|
135
|
-
themes: enableSystem ? [
|
|
136
|
-
...themes,
|
|
137
|
-
"system"
|
|
138
|
-
] : themes,
|
|
139
|
-
systemTheme: enableSystem ? resolvedTheme : undefined
|
|
140
|
-
},
|
|
141
|
-
children: [
|
|
142
|
-
/*#__PURE__*/ (0, _jsxruntime.jsx)(ThemeScript, {
|
|
143
|
-
forcedTheme,
|
|
144
|
-
disableTransitionOnChange,
|
|
145
|
-
enableSystem,
|
|
146
|
-
enableColorScheme,
|
|
147
|
-
themes,
|
|
148
|
-
defaultTheme,
|
|
149
|
-
attribute,
|
|
150
|
-
value,
|
|
151
|
-
children,
|
|
152
|
-
attrs,
|
|
153
|
-
nonce
|
|
154
|
-
}),
|
|
155
|
-
children
|
|
156
|
-
]
|
|
157
|
-
});
|
|
158
|
-
};
|
|
159
|
-
const ThemeScript = /*#__PURE__*/ (0, _react.memo)(({ forcedTheme, attribute, enableSystem, enableColorScheme, defaultTheme, value, attrs, nonce })=>{
|
|
160
|
-
const defaultSystem = defaultTheme === "system";
|
|
161
|
-
// Code-golfing the amount of characters in the script
|
|
162
|
-
const optimization = (()=>{
|
|
163
|
-
const removeClasses = `d.remove(${attrs.map((t)=>`'${t}'`).join(",")})`;
|
|
164
|
-
return `var d=document.documentElement.classList;${removeClasses};`;
|
|
165
|
-
})();
|
|
166
|
-
const fallbackColorScheme = (()=>{
|
|
167
|
-
if (!enableColorScheme) {
|
|
168
|
-
return "";
|
|
169
|
-
}
|
|
170
|
-
const fallback = colorSchemes.includes(defaultTheme) ? defaultTheme : null;
|
|
171
|
-
if (fallback) {
|
|
172
|
-
return `if(e==='light'||e==='dark'||!e)d.style.colorScheme=e||'${defaultTheme}'`;
|
|
173
|
-
} else {
|
|
174
|
-
return `if(e==='light'||e==='dark')d.style.colorScheme=e`;
|
|
175
|
-
}
|
|
176
|
-
})();
|
|
177
|
-
const updateDOM = (name, literal = false, setColorScheme = true)=>{
|
|
178
|
-
const resolvedName = value ? value[name] : name;
|
|
179
|
-
const val = literal ? name + `|| ''` : `'${resolvedName}'`;
|
|
180
|
-
let text = "";
|
|
181
|
-
// MUCH faster to set colorScheme alongside HTML attribute/class
|
|
182
|
-
// as it only incurs 1 style recalculation rather than 2
|
|
183
|
-
// This can save over 250ms of work for pages with big DOM
|
|
184
|
-
if (enableColorScheme && setColorScheme && !literal && colorSchemes.includes(name)) {
|
|
185
|
-
text += `d.style.colorScheme = '${name}';`;
|
|
186
|
-
}
|
|
187
|
-
if (attribute === "class") {
|
|
188
|
-
if (literal || resolvedName) {
|
|
189
|
-
text += `d.add(${val})`;
|
|
190
|
-
} else {
|
|
191
|
-
text += `null`;
|
|
192
|
-
}
|
|
193
|
-
} else {
|
|
194
|
-
if (resolvedName) {
|
|
195
|
-
text += `d[s](n, ${val})`;
|
|
196
|
-
}
|
|
197
|
-
}
|
|
198
|
-
return text;
|
|
199
|
-
};
|
|
200
|
-
const scriptSrc = (()=>{
|
|
201
|
-
if (forcedTheme) {
|
|
202
|
-
return `!function(){${optimization}${updateDOM(forcedTheme)}}()`;
|
|
203
|
-
}
|
|
204
|
-
if (enableSystem) {
|
|
205
|
-
return `!function(){try {${optimization}var e=localStorage.getItem('${THEME_STORAGE_KEY}');if("system"===e||(!e&&${defaultSystem})){var t="${MEDIA}",m=window.matchMedia(t);if(m.media!==t||m.matches){${updateDOM("dark")}}else{${updateDOM("light")}}}else if(e){${value ? `var x=${JSON.stringify(value)};` : ""}${updateDOM(value ? `x[e]` : "e", true)}}${!defaultSystem ? `else{` + updateDOM(defaultTheme, false, false) + "}" : ""}${fallbackColorScheme}}catch(e){}}()`;
|
|
206
|
-
}
|
|
207
|
-
return `!function(){try{${optimization}var e=localStorage.getItem("${THEME_STORAGE_KEY}");if(e){${value ? `var x=${JSON.stringify(value)};` : ""}${updateDOM(value ? `x[e]` : "e", true)}}else{${updateDOM(defaultTheme, false, false)};}${fallbackColorScheme}}catch(t){}}();`;
|
|
208
|
-
})();
|
|
209
|
-
// We MUST use next/script's `beforeInteractive` strategy to avoid flashing on load.
|
|
210
|
-
// However, it only accepts the `src` prop, not `dangerouslySetInnerHTML` or `children`
|
|
211
|
-
// But our script cannot be external because it changes at runtime based on React props
|
|
212
|
-
// so we trick next/script by passing `src` as a base64 JS script
|
|
213
|
-
const encodedScript = `data:text/javascript;base64,${encodeBase64(scriptSrc)}`;
|
|
214
|
-
return /*#__PURE__*/ (0, _jsxruntime.jsx)(_script.default, {
|
|
215
|
-
id: "next-theme-script",
|
|
216
|
-
strategy: "beforeInteractive",
|
|
217
|
-
src: encodedScript,
|
|
218
|
-
nonce: nonce
|
|
219
|
-
});
|
|
220
|
-
}, // Never re-render this component
|
|
221
|
-
()=>true);
|
|
222
|
-
// Helpers
|
|
223
|
-
const getTheme = (key, fallback)=>{
|
|
224
|
-
if (_isServer.default) return undefined;
|
|
225
|
-
let theme;
|
|
226
|
-
try {
|
|
227
|
-
theme = localStorage.getItem(key) || undefined;
|
|
228
|
-
} catch (e) {
|
|
229
|
-
// Unsupported
|
|
230
|
-
}
|
|
231
|
-
return theme || fallback;
|
|
232
|
-
};
|
|
233
|
-
const disableAnimation = ()=>{
|
|
234
|
-
const d = document;
|
|
235
|
-
const css = d.createElement("style");
|
|
236
|
-
css.appendChild(d.createTextNode(`*{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}`));
|
|
237
|
-
d.head.appendChild(css);
|
|
238
|
-
return ()=>{
|
|
239
|
-
// Force restyle
|
|
240
|
-
(()=>window.getComputedStyle(d.body))();
|
|
241
|
-
// Wait for next tick before removing
|
|
242
|
-
setTimeout(()=>{
|
|
243
|
-
d.head.removeChild(css);
|
|
244
|
-
}, 1);
|
|
245
|
-
};
|
|
246
|
-
};
|
|
247
|
-
const getSystemTheme = (e)=>{
|
|
248
|
-
if (!e) e = window.matchMedia(MEDIA);
|
|
249
|
-
const isDark = e.matches;
|
|
250
|
-
const systemTheme = isDark ? "dark" : "light";
|
|
251
|
-
return systemTheme;
|
|
252
|
-
};
|
|
253
|
-
const encodeBase64 = (str)=>{
|
|
254
|
-
return _isServer.default ? Buffer.from(str).toString("base64") : btoa(str);
|
|
255
|
-
};
|
|
256
|
-
const _default = ThemeProvider;
|
package/12/ThemeProvider.mjs
DELETED
|
@@ -1,245 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import NextScript from "next/script";
|
|
4
|
-
import { memo, useCallback, useEffect, useState } from "react";
|
|
5
|
-
import isServer from "@koine/utils/isServer";
|
|
6
|
-
import { ThemeContext } from "./ThemeContext";
|
|
7
|
-
const colorSchemes = [
|
|
8
|
-
"light",
|
|
9
|
-
"dark"
|
|
10
|
-
];
|
|
11
|
-
const MEDIA = "(prefers-color-scheme: dark)";
|
|
12
|
-
const THEME_STORAGE_KEY = "theme";
|
|
13
|
-
/**
|
|
14
|
-
* @borrows [next-themes](https://github.com/pacocoursey/next-themes)
|
|
15
|
-
*
|
|
16
|
-
* Differences:
|
|
17
|
-
*
|
|
18
|
-
* - enableColorScheme: `false` by default (instead of `true`), this plays more
|
|
19
|
-
* nicely with tailwind `dark` class mode as dark theme is supposed to be only
|
|
20
|
-
* controlled by tailwind modifiers
|
|
21
|
-
*/ export const ThemeProvider = ({ forcedTheme, disableTransitionOnChange = false, enableSystem = true, enableColorScheme, themes = [
|
|
22
|
-
"light",
|
|
23
|
-
"dark"
|
|
24
|
-
], defaultTheme = enableSystem ? "system" : "light", attribute = "data-theme", value, children, nonce })=>{
|
|
25
|
-
const [theme, setThemeState] = useState(()=>getTheme(THEME_STORAGE_KEY, defaultTheme));
|
|
26
|
-
const [resolvedTheme, setResolvedTheme] = useState(()=>getTheme(THEME_STORAGE_KEY));
|
|
27
|
-
const attrs = !value ? themes : Object.values(value);
|
|
28
|
-
const applyTheme = useCallback((theme)=>{
|
|
29
|
-
let resolved = theme;
|
|
30
|
-
if (isServer || !resolved) return;
|
|
31
|
-
// If theme is system, resolve it before setting theme
|
|
32
|
-
if (theme === "system" && enableSystem) {
|
|
33
|
-
resolved = getSystemTheme();
|
|
34
|
-
}
|
|
35
|
-
const name = value ? value[resolved] : resolved;
|
|
36
|
-
const enable = disableTransitionOnChange ? disableAnimation() : null;
|
|
37
|
-
const d = document.documentElement;
|
|
38
|
-
if (attribute === "class") {
|
|
39
|
-
d.classList.remove(...attrs);
|
|
40
|
-
if (name) d.classList.add(name);
|
|
41
|
-
} else {
|
|
42
|
-
if (name) {
|
|
43
|
-
d.setAttribute(attribute, name);
|
|
44
|
-
} else {
|
|
45
|
-
d.removeAttribute(attribute);
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
if (enableColorScheme) {
|
|
49
|
-
const fallback = colorSchemes.includes(defaultTheme) ? defaultTheme : "";
|
|
50
|
-
const colorScheme = colorSchemes.includes(resolved) ? resolved : fallback;
|
|
51
|
-
d.style.colorScheme = colorScheme;
|
|
52
|
-
}
|
|
53
|
-
enable?.();
|
|
54
|
-
}, [
|
|
55
|
-
attribute,
|
|
56
|
-
attrs,
|
|
57
|
-
defaultTheme,
|
|
58
|
-
disableTransitionOnChange,
|
|
59
|
-
enableColorScheme,
|
|
60
|
-
enableSystem,
|
|
61
|
-
value
|
|
62
|
-
]);
|
|
63
|
-
const setTheme = useCallback((theme)=>{
|
|
64
|
-
setThemeState(theme);
|
|
65
|
-
// Save to storage
|
|
66
|
-
try {
|
|
67
|
-
localStorage.setItem(THEME_STORAGE_KEY, theme);
|
|
68
|
-
} catch (e) {
|
|
69
|
-
// Unsupported
|
|
70
|
-
}
|
|
71
|
-
}, []);
|
|
72
|
-
const handleMediaQuery = useCallback((e)=>{
|
|
73
|
-
const resolved = getSystemTheme(e);
|
|
74
|
-
setResolvedTheme(resolved);
|
|
75
|
-
if (theme === "system" && enableSystem && !forcedTheme) {
|
|
76
|
-
applyTheme("system");
|
|
77
|
-
}
|
|
78
|
-
}, [
|
|
79
|
-
theme,
|
|
80
|
-
enableSystem,
|
|
81
|
-
forcedTheme,
|
|
82
|
-
applyTheme
|
|
83
|
-
]);
|
|
84
|
-
// Always listen to System preference
|
|
85
|
-
useEffect(()=>{
|
|
86
|
-
const media = window.matchMedia(MEDIA);
|
|
87
|
-
// Intentionally use deprecated listener methods to support iOS & old browsers
|
|
88
|
-
media.addListener(handleMediaQuery);
|
|
89
|
-
handleMediaQuery(media);
|
|
90
|
-
return ()=>media.removeListener(handleMediaQuery);
|
|
91
|
-
}, [
|
|
92
|
-
handleMediaQuery
|
|
93
|
-
]);
|
|
94
|
-
// localStorage event handling
|
|
95
|
-
useEffect(()=>{
|
|
96
|
-
const handleStorage = (e)=>{
|
|
97
|
-
if (e.key !== THEME_STORAGE_KEY) {
|
|
98
|
-
return;
|
|
99
|
-
}
|
|
100
|
-
// If default theme set, use it if localstorage === null (happens on local storage manual deletion)
|
|
101
|
-
const theme = e.newValue || defaultTheme;
|
|
102
|
-
setTheme(theme);
|
|
103
|
-
};
|
|
104
|
-
window.addEventListener("storage", handleStorage);
|
|
105
|
-
return ()=>window.removeEventListener("storage", handleStorage);
|
|
106
|
-
}, [
|
|
107
|
-
defaultTheme,
|
|
108
|
-
setTheme
|
|
109
|
-
]);
|
|
110
|
-
// Whenever theme or forcedTheme changes, apply it
|
|
111
|
-
useEffect(()=>{
|
|
112
|
-
applyTheme(forcedTheme ?? theme);
|
|
113
|
-
}, [
|
|
114
|
-
applyTheme,
|
|
115
|
-
forcedTheme,
|
|
116
|
-
theme
|
|
117
|
-
]);
|
|
118
|
-
return /*#__PURE__*/ _jsxs(ThemeContext.Provider, {
|
|
119
|
-
value: {
|
|
120
|
-
theme,
|
|
121
|
-
setTheme,
|
|
122
|
-
forcedTheme,
|
|
123
|
-
resolvedTheme: theme === "system" ? resolvedTheme : theme,
|
|
124
|
-
themes: enableSystem ? [
|
|
125
|
-
...themes,
|
|
126
|
-
"system"
|
|
127
|
-
] : themes,
|
|
128
|
-
systemTheme: enableSystem ? resolvedTheme : undefined
|
|
129
|
-
},
|
|
130
|
-
children: [
|
|
131
|
-
/*#__PURE__*/ _jsx(ThemeScript, {
|
|
132
|
-
forcedTheme,
|
|
133
|
-
disableTransitionOnChange,
|
|
134
|
-
enableSystem,
|
|
135
|
-
enableColorScheme,
|
|
136
|
-
themes,
|
|
137
|
-
defaultTheme,
|
|
138
|
-
attribute,
|
|
139
|
-
value,
|
|
140
|
-
children,
|
|
141
|
-
attrs,
|
|
142
|
-
nonce
|
|
143
|
-
}),
|
|
144
|
-
children
|
|
145
|
-
]
|
|
146
|
-
});
|
|
147
|
-
};
|
|
148
|
-
const ThemeScript = /*#__PURE__*/ memo(({ forcedTheme, attribute, enableSystem, enableColorScheme, defaultTheme, value, attrs, nonce })=>{
|
|
149
|
-
const defaultSystem = defaultTheme === "system";
|
|
150
|
-
// Code-golfing the amount of characters in the script
|
|
151
|
-
const optimization = (()=>{
|
|
152
|
-
const removeClasses = `d.remove(${attrs.map((t)=>`'${t}'`).join(",")})`;
|
|
153
|
-
return `var d=document.documentElement.classList;${removeClasses};`;
|
|
154
|
-
})();
|
|
155
|
-
const fallbackColorScheme = (()=>{
|
|
156
|
-
if (!enableColorScheme) {
|
|
157
|
-
return "";
|
|
158
|
-
}
|
|
159
|
-
const fallback = colorSchemes.includes(defaultTheme) ? defaultTheme : null;
|
|
160
|
-
if (fallback) {
|
|
161
|
-
return `if(e==='light'||e==='dark'||!e)d.style.colorScheme=e||'${defaultTheme}'`;
|
|
162
|
-
} else {
|
|
163
|
-
return `if(e==='light'||e==='dark')d.style.colorScheme=e`;
|
|
164
|
-
}
|
|
165
|
-
})();
|
|
166
|
-
const updateDOM = (name, literal = false, setColorScheme = true)=>{
|
|
167
|
-
const resolvedName = value ? value[name] : name;
|
|
168
|
-
const val = literal ? name + `|| ''` : `'${resolvedName}'`;
|
|
169
|
-
let text = "";
|
|
170
|
-
// MUCH faster to set colorScheme alongside HTML attribute/class
|
|
171
|
-
// as it only incurs 1 style recalculation rather than 2
|
|
172
|
-
// This can save over 250ms of work for pages with big DOM
|
|
173
|
-
if (enableColorScheme && setColorScheme && !literal && colorSchemes.includes(name)) {
|
|
174
|
-
text += `d.style.colorScheme = '${name}';`;
|
|
175
|
-
}
|
|
176
|
-
if (attribute === "class") {
|
|
177
|
-
if (literal || resolvedName) {
|
|
178
|
-
text += `d.add(${val})`;
|
|
179
|
-
} else {
|
|
180
|
-
text += `null`;
|
|
181
|
-
}
|
|
182
|
-
} else {
|
|
183
|
-
if (resolvedName) {
|
|
184
|
-
text += `d[s](n, ${val})`;
|
|
185
|
-
}
|
|
186
|
-
}
|
|
187
|
-
return text;
|
|
188
|
-
};
|
|
189
|
-
const scriptSrc = (()=>{
|
|
190
|
-
if (forcedTheme) {
|
|
191
|
-
return `!function(){${optimization}${updateDOM(forcedTheme)}}()`;
|
|
192
|
-
}
|
|
193
|
-
if (enableSystem) {
|
|
194
|
-
return `!function(){try {${optimization}var e=localStorage.getItem('${THEME_STORAGE_KEY}');if("system"===e||(!e&&${defaultSystem})){var t="${MEDIA}",m=window.matchMedia(t);if(m.media!==t||m.matches){${updateDOM("dark")}}else{${updateDOM("light")}}}else if(e){${value ? `var x=${JSON.stringify(value)};` : ""}${updateDOM(value ? `x[e]` : "e", true)}}${!defaultSystem ? `else{` + updateDOM(defaultTheme, false, false) + "}" : ""}${fallbackColorScheme}}catch(e){}}()`;
|
|
195
|
-
}
|
|
196
|
-
return `!function(){try{${optimization}var e=localStorage.getItem("${THEME_STORAGE_KEY}");if(e){${value ? `var x=${JSON.stringify(value)};` : ""}${updateDOM(value ? `x[e]` : "e", true)}}else{${updateDOM(defaultTheme, false, false)};}${fallbackColorScheme}}catch(t){}}();`;
|
|
197
|
-
})();
|
|
198
|
-
// We MUST use next/script's `beforeInteractive` strategy to avoid flashing on load.
|
|
199
|
-
// However, it only accepts the `src` prop, not `dangerouslySetInnerHTML` or `children`
|
|
200
|
-
// But our script cannot be external because it changes at runtime based on React props
|
|
201
|
-
// so we trick next/script by passing `src` as a base64 JS script
|
|
202
|
-
const encodedScript = `data:text/javascript;base64,${encodeBase64(scriptSrc)}`;
|
|
203
|
-
return /*#__PURE__*/ _jsx(NextScript, {
|
|
204
|
-
id: "next-theme-script",
|
|
205
|
-
strategy: "beforeInteractive",
|
|
206
|
-
src: encodedScript,
|
|
207
|
-
nonce: nonce
|
|
208
|
-
});
|
|
209
|
-
}, // Never re-render this component
|
|
210
|
-
()=>true);
|
|
211
|
-
// Helpers
|
|
212
|
-
const getTheme = (key, fallback)=>{
|
|
213
|
-
if (isServer) return undefined;
|
|
214
|
-
let theme;
|
|
215
|
-
try {
|
|
216
|
-
theme = localStorage.getItem(key) || undefined;
|
|
217
|
-
} catch (e) {
|
|
218
|
-
// Unsupported
|
|
219
|
-
}
|
|
220
|
-
return theme || fallback;
|
|
221
|
-
};
|
|
222
|
-
const disableAnimation = ()=>{
|
|
223
|
-
const d = document;
|
|
224
|
-
const css = d.createElement("style");
|
|
225
|
-
css.appendChild(d.createTextNode(`*{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}`));
|
|
226
|
-
d.head.appendChild(css);
|
|
227
|
-
return ()=>{
|
|
228
|
-
// Force restyle
|
|
229
|
-
(()=>window.getComputedStyle(d.body))();
|
|
230
|
-
// Wait for next tick before removing
|
|
231
|
-
setTimeout(()=>{
|
|
232
|
-
d.head.removeChild(css);
|
|
233
|
-
}, 1);
|
|
234
|
-
};
|
|
235
|
-
};
|
|
236
|
-
const getSystemTheme = (e)=>{
|
|
237
|
-
if (!e) e = window.matchMedia(MEDIA);
|
|
238
|
-
const isDark = e.matches;
|
|
239
|
-
const systemTheme = isDark ? "dark" : "light";
|
|
240
|
-
return systemTheme;
|
|
241
|
-
};
|
|
242
|
-
const encodeBase64 = (str)=>{
|
|
243
|
-
return isServer ? Buffer.from(str).toString("base64") : btoa(str);
|
|
244
|
-
};
|
|
245
|
-
export default ThemeProvider;
|
package/12/TransText.d.ts
DELETED
package/12/TransText.js
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
"use strict";
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
function _export(target, all) {
|
|
7
|
-
for(var name in all)Object.defineProperty(target, name, {
|
|
8
|
-
enumerable: true,
|
|
9
|
-
get: all[name]
|
|
10
|
-
});
|
|
11
|
-
}
|
|
12
|
-
_export(exports, {
|
|
13
|
-
TransText: function() {
|
|
14
|
-
return TransText;
|
|
15
|
-
},
|
|
16
|
-
default: function() {
|
|
17
|
-
return _default;
|
|
18
|
-
}
|
|
19
|
-
});
|
|
20
|
-
const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
|
|
21
|
-
const _TransText = /*#__PURE__*/ _interop_require_default._(require("next-translate/TransText"));
|
|
22
|
-
const TransText = _TransText.default;
|
|
23
|
-
const _default = TransText;
|
package/12/TransText.mjs
DELETED
package/12/app/AppHead.d.ts
DELETED
package/12/app/AppHead.js
DELETED
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", {
|
|
3
|
-
value: true
|
|
4
|
-
});
|
|
5
|
-
function _export(target, all) {
|
|
6
|
-
for(var name in all)Object.defineProperty(target, name, {
|
|
7
|
-
enumerable: true,
|
|
8
|
-
get: all[name]
|
|
9
|
-
});
|
|
10
|
-
}
|
|
11
|
-
_export(exports, {
|
|
12
|
-
AppHead: function() {
|
|
13
|
-
return AppHead;
|
|
14
|
-
},
|
|
15
|
-
default: function() {
|
|
16
|
-
return _default;
|
|
17
|
-
}
|
|
18
|
-
});
|
|
19
|
-
const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
|
|
20
|
-
const _jsxruntime = require("react/jsx-runtime");
|
|
21
|
-
const _head = /*#__PURE__*/ _interop_require_default._(require("next/head"));
|
|
22
|
-
const _react = /*#__PURE__*/ _interop_require_default._(require("react"));
|
|
23
|
-
const AppHead = ()=>{
|
|
24
|
-
return /*#__PURE__*/ (0, _jsxruntime.jsx)(_head.default, {
|
|
25
|
-
children: /*#__PURE__*/ (0, _jsxruntime.jsx)("meta", {
|
|
26
|
-
name: "viewport",
|
|
27
|
-
content: "width=device-width"
|
|
28
|
-
})
|
|
29
|
-
});
|
|
30
|
-
};
|
|
31
|
-
const _default = AppHead;
|
package/12/app/AppHead.mjs
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import Head from "next/head";
|
|
3
|
-
import React from "react";
|
|
4
|
-
export const AppHead = ()=>{
|
|
5
|
-
return /*#__PURE__*/ _jsx(Head, {
|
|
6
|
-
children: /*#__PURE__*/ _jsx("meta", {
|
|
7
|
-
name: "viewport",
|
|
8
|
-
content: "width=device-width"
|
|
9
|
-
})
|
|
10
|
-
});
|
|
11
|
-
};
|
|
12
|
-
export default AppHead;
|
package/12/app/AppMain.d.ts
DELETED
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
import type { HTMLMotionProps } from "framer-motion";
|
|
2
|
-
import type { AppProps as NextAppProps } from "next/app";
|
|
3
|
-
import React from "react";
|
|
4
|
-
import type { MotionProviderFeatures } from "@koine/react/m";
|
|
5
|
-
import type { NextProgressProps } from "../NextProgress";
|
|
6
|
-
import type { SeoDefaultsProps } from "../SeoDefaults";
|
|
7
|
-
export type AppMainBaseProps = NextAppProps & {
|
|
8
|
-
/**
|
|
9
|
-
* A wrapping layout component
|
|
10
|
-
*/
|
|
11
|
-
Layout: React.FC<Record<string, unknown>>;
|
|
12
|
-
/**
|
|
13
|
-
* A Progress' Overlay component
|
|
14
|
-
*/
|
|
15
|
-
ProgressOverlay?: NextProgressProps["Overlay"];
|
|
16
|
-
/**
|
|
17
|
-
* Seo site wide default configuration
|
|
18
|
-
*/
|
|
19
|
-
seo?: SeoDefaultsProps;
|
|
20
|
-
/**
|
|
21
|
-
* JSX to render just after SEO
|
|
22
|
-
*/
|
|
23
|
-
pre?: React.ReactNode;
|
|
24
|
-
/**
|
|
25
|
-
* JSX to render just at the end of the markup
|
|
26
|
-
*/
|
|
27
|
-
post?: React.ReactNode;
|
|
28
|
-
};
|
|
29
|
-
export type AppMainFramerProps = {
|
|
30
|
-
motion: MotionProviderFeatures;
|
|
31
|
-
/**
|
|
32
|
-
* Default layout transition, by default it is a simple fade in/out
|
|
33
|
-
*/
|
|
34
|
-
transition?: Omit<HTMLMotionProps<"div">, "key">;
|
|
35
|
-
};
|
package/12/app/AppMain.js
DELETED
package/12/app/AppMain.mjs
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import React from "react";
|