@blocklet/theme 2.13.69 → 3.0.0
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/dist/cjs/index.js +45 -307
- package/dist/es/index.js +27 -265
- package/dist/types/blocklet.d.ts +8 -0
- package/dist/types/did-connect.d.ts +2 -0
- package/dist/types/index.d.ts +3 -89
- package/dist/types/util.d.ts +21 -0
- package/package.json +13 -23
package/dist/cjs/index.js
CHANGED
|
@@ -1,268 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
|
|
9
|
-
};
|
|
10
|
-
var __export = (target, all) => {
|
|
11
|
-
for (var name in all)
|
|
12
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
13
|
-
};
|
|
14
|
-
var __copyProps = (to, from, except, desc) => {
|
|
15
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
16
|
-
for (let key of __getOwnPropNames(from))
|
|
17
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
18
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
19
|
-
}
|
|
20
|
-
return to;
|
|
21
|
-
};
|
|
22
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
23
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
24
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
25
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
26
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
27
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
28
|
-
mod
|
|
29
|
-
));
|
|
30
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
31
|
-
|
|
32
|
-
// ../../node_modules/deepmerge/dist/cjs.js
|
|
33
|
-
var require_cjs = __commonJS({
|
|
34
|
-
"../../node_modules/deepmerge/dist/cjs.js"(exports2, module2) {
|
|
35
|
-
"use strict";
|
|
36
|
-
var isMergeableObject = function isMergeableObject2(value) {
|
|
37
|
-
return isNonNullObject(value) && !isSpecial(value);
|
|
38
|
-
};
|
|
39
|
-
function isNonNullObject(value) {
|
|
40
|
-
return !!value && typeof value === "object";
|
|
41
|
-
}
|
|
42
|
-
function isSpecial(value) {
|
|
43
|
-
var stringValue = Object.prototype.toString.call(value);
|
|
44
|
-
return stringValue === "[object RegExp]" || stringValue === "[object Date]" || isReactElement(value);
|
|
45
|
-
}
|
|
46
|
-
var canUseSymbol = typeof Symbol === "function" && Symbol.for;
|
|
47
|
-
var REACT_ELEMENT_TYPE = canUseSymbol ? Symbol.for("react.element") : 60103;
|
|
48
|
-
function isReactElement(value) {
|
|
49
|
-
return value.$$typeof === REACT_ELEMENT_TYPE;
|
|
50
|
-
}
|
|
51
|
-
function emptyTarget(val) {
|
|
52
|
-
return Array.isArray(val) ? [] : {};
|
|
53
|
-
}
|
|
54
|
-
function cloneUnlessOtherwiseSpecified(value, options) {
|
|
55
|
-
return options.clone !== false && options.isMergeableObject(value) ? deepmerge2(emptyTarget(value), value, options) : value;
|
|
56
|
-
}
|
|
57
|
-
function defaultArrayMerge(target, source, options) {
|
|
58
|
-
return target.concat(source).map(function(element) {
|
|
59
|
-
return cloneUnlessOtherwiseSpecified(element, options);
|
|
60
|
-
});
|
|
61
|
-
}
|
|
62
|
-
function getMergeFunction(key, options) {
|
|
63
|
-
if (!options.customMerge) {
|
|
64
|
-
return deepmerge2;
|
|
65
|
-
}
|
|
66
|
-
var customMerge = options.customMerge(key);
|
|
67
|
-
return typeof customMerge === "function" ? customMerge : deepmerge2;
|
|
68
|
-
}
|
|
69
|
-
function getEnumerableOwnPropertySymbols(target) {
|
|
70
|
-
return Object.getOwnPropertySymbols ? Object.getOwnPropertySymbols(target).filter(function(symbol) {
|
|
71
|
-
return Object.propertyIsEnumerable.call(target, symbol);
|
|
72
|
-
}) : [];
|
|
73
|
-
}
|
|
74
|
-
function getKeys(target) {
|
|
75
|
-
return Object.keys(target).concat(getEnumerableOwnPropertySymbols(target));
|
|
76
|
-
}
|
|
77
|
-
function propertyIsOnObject(object, property) {
|
|
78
|
-
try {
|
|
79
|
-
return property in object;
|
|
80
|
-
} catch (_) {
|
|
81
|
-
return false;
|
|
82
|
-
}
|
|
83
|
-
}
|
|
84
|
-
function propertyIsUnsafe(target, key) {
|
|
85
|
-
return propertyIsOnObject(target, key) && !(Object.hasOwnProperty.call(target, key) && Object.propertyIsEnumerable.call(target, key));
|
|
86
|
-
}
|
|
87
|
-
function mergeObject(target, source, options) {
|
|
88
|
-
var destination = {};
|
|
89
|
-
if (options.isMergeableObject(target)) {
|
|
90
|
-
getKeys(target).forEach(function(key) {
|
|
91
|
-
destination[key] = cloneUnlessOtherwiseSpecified(target[key], options);
|
|
92
|
-
});
|
|
93
|
-
}
|
|
94
|
-
getKeys(source).forEach(function(key) {
|
|
95
|
-
if (propertyIsUnsafe(target, key)) {
|
|
96
|
-
return;
|
|
97
|
-
}
|
|
98
|
-
if (propertyIsOnObject(target, key) && options.isMergeableObject(source[key])) {
|
|
99
|
-
destination[key] = getMergeFunction(key, options)(target[key], source[key], options);
|
|
100
|
-
} else {
|
|
101
|
-
destination[key] = cloneUnlessOtherwiseSpecified(source[key], options);
|
|
102
|
-
}
|
|
103
|
-
});
|
|
104
|
-
return destination;
|
|
105
|
-
}
|
|
106
|
-
function deepmerge2(target, source, options) {
|
|
107
|
-
options = options || {};
|
|
108
|
-
options.arrayMerge = options.arrayMerge || defaultArrayMerge;
|
|
109
|
-
options.isMergeableObject = options.isMergeableObject || isMergeableObject;
|
|
110
|
-
options.cloneUnlessOtherwiseSpecified = cloneUnlessOtherwiseSpecified;
|
|
111
|
-
var sourceIsArray = Array.isArray(source);
|
|
112
|
-
var targetIsArray = Array.isArray(target);
|
|
113
|
-
var sourceAndTargetTypesMatch = sourceIsArray === targetIsArray;
|
|
114
|
-
if (!sourceAndTargetTypesMatch) {
|
|
115
|
-
return cloneUnlessOtherwiseSpecified(source, options);
|
|
116
|
-
} else if (sourceIsArray) {
|
|
117
|
-
return options.arrayMerge(target, source, options);
|
|
118
|
-
} else {
|
|
119
|
-
return mergeObject(target, source, options);
|
|
120
|
-
}
|
|
121
|
-
}
|
|
122
|
-
deepmerge2.all = function deepmergeAll(array, options) {
|
|
123
|
-
if (!Array.isArray(array)) {
|
|
124
|
-
throw new Error("first argument should be an array");
|
|
125
|
-
}
|
|
126
|
-
return array.reduce(function(prev, next) {
|
|
127
|
-
return deepmerge2(prev, next, options);
|
|
128
|
-
}, {});
|
|
129
|
-
};
|
|
130
|
-
var deepmerge_1 = deepmerge2;
|
|
131
|
-
module2.exports = deepmerge_1;
|
|
132
|
-
}
|
|
133
|
-
});
|
|
134
|
-
|
|
135
|
-
// src/index.ts
|
|
136
|
-
var src_exports = {};
|
|
137
|
-
__export(src_exports, {
|
|
138
|
-
BLOCKLET_THEME_DARK: () => BLOCKLET_THEME_DARK,
|
|
139
|
-
BLOCKLET_THEME_LIGHT: () => BLOCKLET_THEME_LIGHT,
|
|
140
|
-
BLOCKLET_THEME_PREFER_KEY: () => BLOCKLET_THEME_PREFER_KEY,
|
|
141
|
-
DEFAULT_FONTS: () => DEFAULT_FONTS,
|
|
142
|
-
DID_CONNECT_THEME_DARK: () => DID_CONNECT_THEME_DARK,
|
|
143
|
-
DID_CONNECT_THEME_LIGHT: () => DID_CONNECT_THEME_LIGHT,
|
|
144
|
-
buildThemeScript: () => buildThemeScript,
|
|
145
|
-
buildThemeStyles: () => buildThemeStyles,
|
|
146
|
-
getBlockletThemeOptions: () => getBlockletThemeOptions,
|
|
147
|
-
getDefaultThemePrefer: () => getDefaultThemePrefer,
|
|
148
|
-
isValidThemeMode: () => isValidThemeMode,
|
|
149
|
-
merge: () => merge
|
|
150
|
-
});
|
|
151
|
-
module.exports = __toCommonJS(src_exports);
|
|
152
|
-
|
|
153
|
-
// node_modules/@mui/utils/esm/formatMuiErrorMessage/formatMuiErrorMessage.js
|
|
154
|
-
function formatMuiErrorMessage(code, ...args) {
|
|
155
|
-
const url = new URL(`https://mui.com/production-error/?code=${code}`);
|
|
156
|
-
args.forEach((arg) => url.searchParams.append("args[]", arg));
|
|
157
|
-
return `Minified MUI error #${code}; visit ${url} for the full message.`;
|
|
158
|
-
}
|
|
159
|
-
|
|
160
|
-
// node_modules/@mui/utils/esm/clamp/clamp.js
|
|
161
|
-
function clamp(val, min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER) {
|
|
162
|
-
return Math.max(min, Math.min(val, max));
|
|
163
|
-
}
|
|
164
|
-
var clamp_default = clamp;
|
|
165
|
-
|
|
166
|
-
// node_modules/@mui/system/esm/colorManipulator/colorManipulator.js
|
|
167
|
-
function clampWrapper(value, min = 0, max = 1) {
|
|
168
|
-
if (process.env.NODE_ENV !== "production") {
|
|
169
|
-
if (value < min || value > max) {
|
|
170
|
-
console.error(`MUI: The value provided ${value} is out of range [${min}, ${max}].`);
|
|
171
|
-
}
|
|
172
|
-
}
|
|
173
|
-
return clamp_default(value, min, max);
|
|
174
|
-
}
|
|
175
|
-
function hexToRgb(color) {
|
|
176
|
-
color = color.slice(1);
|
|
177
|
-
const re = new RegExp(`.{1,${color.length >= 6 ? 2 : 1}}`, "g");
|
|
178
|
-
let colors = color.match(re);
|
|
179
|
-
if (colors && colors[0].length === 1) {
|
|
180
|
-
colors = colors.map((n) => n + n);
|
|
181
|
-
}
|
|
182
|
-
if (process.env.NODE_ENV !== "production") {
|
|
183
|
-
if (color.length !== color.trim().length) {
|
|
184
|
-
console.error(`MUI: The color: "${color}" is invalid. Make sure the color input doesn't contain leading/trailing space.`);
|
|
185
|
-
}
|
|
186
|
-
}
|
|
187
|
-
return colors ? `rgb${colors.length === 4 ? "a" : ""}(${colors.map((n, index) => {
|
|
188
|
-
return index < 3 ? parseInt(n, 16) : Math.round(parseInt(n, 16) / 255 * 1e3) / 1e3;
|
|
189
|
-
}).join(", ")})` : "";
|
|
190
|
-
}
|
|
191
|
-
function decomposeColor(color) {
|
|
192
|
-
if (color.type) {
|
|
193
|
-
return color;
|
|
194
|
-
}
|
|
195
|
-
if (color.charAt(0) === "#") {
|
|
196
|
-
return decomposeColor(hexToRgb(color));
|
|
197
|
-
}
|
|
198
|
-
const marker = color.indexOf("(");
|
|
199
|
-
const type = color.substring(0, marker);
|
|
200
|
-
if (!["rgb", "rgba", "hsl", "hsla", "color"].includes(type)) {
|
|
201
|
-
throw new Error(process.env.NODE_ENV !== "production" ? `MUI: Unsupported \`${color}\` color.
|
|
202
|
-
The following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().` : formatMuiErrorMessage(9, color));
|
|
203
|
-
}
|
|
204
|
-
let values = color.substring(marker + 1, color.length - 1);
|
|
205
|
-
let colorSpace;
|
|
206
|
-
if (type === "color") {
|
|
207
|
-
values = values.split(" ");
|
|
208
|
-
colorSpace = values.shift();
|
|
209
|
-
if (values.length === 4 && values[3].charAt(0) === "/") {
|
|
210
|
-
values[3] = values[3].slice(1);
|
|
211
|
-
}
|
|
212
|
-
if (!["srgb", "display-p3", "a98-rgb", "prophoto-rgb", "rec-2020"].includes(colorSpace)) {
|
|
213
|
-
throw new Error(process.env.NODE_ENV !== "production" ? `MUI: unsupported \`${colorSpace}\` color space.
|
|
214
|
-
The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rgb, rec-2020.` : formatMuiErrorMessage(10, colorSpace));
|
|
215
|
-
}
|
|
216
|
-
} else {
|
|
217
|
-
values = values.split(",");
|
|
218
|
-
}
|
|
219
|
-
values = values.map((value) => parseFloat(value));
|
|
220
|
-
return {
|
|
221
|
-
type,
|
|
222
|
-
values,
|
|
223
|
-
colorSpace
|
|
224
|
-
};
|
|
225
|
-
}
|
|
226
|
-
function recomposeColor(color) {
|
|
227
|
-
const {
|
|
228
|
-
type,
|
|
229
|
-
colorSpace
|
|
230
|
-
} = color;
|
|
231
|
-
let {
|
|
232
|
-
values
|
|
233
|
-
} = color;
|
|
234
|
-
if (type.includes("rgb")) {
|
|
235
|
-
values = values.map((n, i) => i < 3 ? parseInt(n, 10) : n);
|
|
236
|
-
} else if (type.includes("hsl")) {
|
|
237
|
-
values[1] = `${values[1]}%`;
|
|
238
|
-
values[2] = `${values[2]}%`;
|
|
239
|
-
}
|
|
240
|
-
if (type.includes("color")) {
|
|
241
|
-
values = `${colorSpace} ${values.join(" ")}`;
|
|
242
|
-
} else {
|
|
243
|
-
values = `${values.join(", ")}`;
|
|
244
|
-
}
|
|
245
|
-
return `${type}(${values})`;
|
|
246
|
-
}
|
|
247
|
-
function alpha(color, value) {
|
|
248
|
-
color = decomposeColor(color);
|
|
249
|
-
value = clampWrapper(value);
|
|
250
|
-
if (color.type === "rgb" || color.type === "hsl") {
|
|
251
|
-
color.type += "a";
|
|
252
|
-
}
|
|
253
|
-
if (color.type === "color") {
|
|
254
|
-
color.values[3] = `/${value}`;
|
|
255
|
-
} else {
|
|
256
|
-
color.values[3] = value;
|
|
257
|
-
}
|
|
258
|
-
return recomposeColor(color);
|
|
259
|
-
}
|
|
260
|
-
|
|
261
|
-
// src/util.ts
|
|
262
|
-
var import_deepmerge = __toESM(require_cjs());
|
|
263
|
-
var BLOCKLET_THEME_PREFER_KEY = "blocklet_theme_prefer";
|
|
264
|
-
var merge = (x, y) => {
|
|
265
|
-
return (0, import_deepmerge.default)(x, y, {
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const system = require("@mui/system");
|
|
4
|
+
const deepmerge = require("deepmerge");
|
|
5
|
+
const BLOCKLET_THEME_PREFER_KEY = "blocklet_theme_prefer";
|
|
6
|
+
const merge = (x, y) => {
|
|
7
|
+
return deepmerge(x, y, {
|
|
266
8
|
// 采用替换策略合并数组
|
|
267
9
|
arrayMerge: (_, source) => source
|
|
268
10
|
});
|
|
@@ -271,15 +13,17 @@ function isValidThemeMode(mode) {
|
|
|
271
13
|
return mode === "light" || mode === "dark";
|
|
272
14
|
}
|
|
273
15
|
function getBlockletThemeOptions(mode = "light") {
|
|
274
|
-
|
|
16
|
+
var _a;
|
|
17
|
+
const { common = {}, light = {}, dark = {} } = ((_a = window.blocklet) == null ? void 0 : _a.theme) || {};
|
|
275
18
|
if (mode === "dark") {
|
|
276
19
|
return merge(common, dark);
|
|
277
20
|
}
|
|
278
21
|
return merge(common, light);
|
|
279
22
|
}
|
|
280
23
|
function getDefaultThemePrefer(meta) {
|
|
24
|
+
var _a, _b;
|
|
281
25
|
const blockletInfo = Object.assign({}, window.blocklet, meta);
|
|
282
|
-
const preferKey = blockletInfo.theme
|
|
26
|
+
const preferKey = ((_a = blockletInfo.theme) == null ? void 0 : _a.preferKey) ?? BLOCKLET_THEME_PREFER_KEY;
|
|
283
27
|
const urlParams = new URLSearchParams(window.location.search);
|
|
284
28
|
const urlPrefer = urlParams.get("theme");
|
|
285
29
|
if (isValidThemeMode(urlPrefer)) {
|
|
@@ -289,7 +33,7 @@ function getDefaultThemePrefer(meta) {
|
|
|
289
33
|
if (isValidThemeMode(sessionPrefer)) {
|
|
290
34
|
return sessionPrefer;
|
|
291
35
|
}
|
|
292
|
-
const prefer = blockletInfo.theme
|
|
36
|
+
const prefer = (_b = blockletInfo.theme) == null ? void 0 : _b.prefer;
|
|
293
37
|
if (prefer === "light" || prefer === "dark") {
|
|
294
38
|
return prefer;
|
|
295
39
|
}
|
|
@@ -302,18 +46,19 @@ function getDefaultThemePrefer(meta) {
|
|
|
302
46
|
}
|
|
303
47
|
return "light";
|
|
304
48
|
}
|
|
305
|
-
|
|
49
|
+
const buildThemeStyles = (theme) => {
|
|
50
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
306
51
|
const { light = {}, dark = {} } = theme ?? {};
|
|
307
52
|
return `
|
|
308
53
|
<style id="blocklet-theme-style">
|
|
309
54
|
:root {
|
|
310
|
-
--blocklet-background-default-color: ${light.palette
|
|
311
|
-
--blocklet-text-primary-color: ${light.palette
|
|
55
|
+
--blocklet-background-default-color: ${((_b = (_a = light.palette) == null ? void 0 : _a.background) == null ? void 0 : _b.default) ?? "#ffffff"};
|
|
56
|
+
--blocklet-text-primary-color: ${((_d = (_c = light.palette) == null ? void 0 : _c.text) == null ? void 0 : _d.primary) ?? "#18181b"};
|
|
312
57
|
}
|
|
313
58
|
|
|
314
59
|
[data-theme='dark'] {
|
|
315
|
-
--blocklet-background-default-color: ${dark.palette
|
|
316
|
-
--blocklet-text-primary-color: ${dark.palette
|
|
60
|
+
--blocklet-background-default-color: ${((_f = (_e = dark.palette) == null ? void 0 : _e.background) == null ? void 0 : _f.default) ?? "#121212"};
|
|
61
|
+
--blocklet-text-primary-color: ${((_h = (_g = dark.palette) == null ? void 0 : _g.text) == null ? void 0 : _h.primary) ?? "#ffffff"};
|
|
317
62
|
}
|
|
318
63
|
|
|
319
64
|
html, body {
|
|
@@ -323,7 +68,7 @@ var buildThemeStyles = (theme) => {
|
|
|
323
68
|
</style>
|
|
324
69
|
`;
|
|
325
70
|
};
|
|
326
|
-
|
|
71
|
+
const buildThemeScript = (theme) => {
|
|
327
72
|
return `
|
|
328
73
|
<script id="blocklet-theme-script">
|
|
329
74
|
(function() {
|
|
@@ -331,7 +76,7 @@ var buildThemeScript = (theme) => {
|
|
|
331
76
|
${isValidThemeMode.toString()}
|
|
332
77
|
${getDefaultThemePrefer.toString()}
|
|
333
78
|
|
|
334
|
-
const prefer = getDefaultThemePrefer(${JSON.stringify({ theme: { prefer: theme
|
|
79
|
+
const prefer = getDefaultThemePrefer(${JSON.stringify({ theme: { prefer: (theme == null ? void 0 : theme.prefer) ?? "light", preferKey: BLOCKLET_THEME_PREFER_KEY } })});
|
|
335
80
|
|
|
336
81
|
if(prefer === 'dark') {
|
|
337
82
|
document.documentElement.setAttribute('data-theme', 'dark');
|
|
@@ -342,13 +87,11 @@ var buildThemeScript = (theme) => {
|
|
|
342
87
|
console.error('Theme init error:', e);
|
|
343
88
|
}
|
|
344
89
|
})();
|
|
345
|
-
|
|
90
|
+
<\/script>
|
|
346
91
|
`;
|
|
347
92
|
};
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
var DEFAULT_FONTS = ["Roboto", "Helvetica", "Arial", "sans-serif"];
|
|
351
|
-
var shadows = [
|
|
93
|
+
const DEFAULT_FONTS = ["Roboto", "Helvetica", "Arial", "sans-serif"];
|
|
94
|
+
const shadows = [
|
|
352
95
|
"none",
|
|
353
96
|
"0px 1px 2px 0px rgba(24,24,27,0.06),0px 1px 3px 0px rgba(24,24,27,0.03)",
|
|
354
97
|
"0px 1.5px 3px 0px rgba(24,24,27,0.07),0px 1px 4px 0px rgba(24,24,27,0.035)",
|
|
@@ -375,7 +118,7 @@ var shadows = [
|
|
|
375
118
|
"0px 11.5px 46px 0px rgba(24,24,27,0.28),0px 11px 25px 0px rgba(24,24,27,0.14)",
|
|
376
119
|
"0px 12px 48px 0px rgba(24,24,27,0.29),0px 11.5px 26px 0px rgba(24,24,27,0.145)"
|
|
377
120
|
];
|
|
378
|
-
|
|
121
|
+
const BLOCKLET_THEME_LIGHT = {
|
|
379
122
|
palette: {
|
|
380
123
|
mode: "light",
|
|
381
124
|
primary: {
|
|
@@ -679,7 +422,7 @@ var BLOCKLET_THEME_LIGHT = {
|
|
|
679
422
|
}
|
|
680
423
|
}
|
|
681
424
|
};
|
|
682
|
-
|
|
425
|
+
const BLOCKLET_THEME_DARK = merge(BLOCKLET_THEME_LIGHT, {
|
|
683
426
|
palette: {
|
|
684
427
|
mode: "dark",
|
|
685
428
|
common: {
|
|
@@ -804,28 +547,28 @@ var BLOCKLET_THEME_DARK = merge(BLOCKLET_THEME_LIGHT, {
|
|
|
804
547
|
MuiAlert: {
|
|
805
548
|
styleOverrides: {
|
|
806
549
|
standardError: ({ theme }) => ({
|
|
807
|
-
backgroundColor: alpha(theme.palette.error.main, 0.25),
|
|
550
|
+
backgroundColor: system.alpha(theme.palette.error.main, 0.25),
|
|
808
551
|
color: theme.palette.warning.light,
|
|
809
552
|
"& .MuiAlert-icon": {
|
|
810
553
|
color: theme.palette.warning.light
|
|
811
554
|
}
|
|
812
555
|
}),
|
|
813
556
|
standardInfo: ({ theme }) => ({
|
|
814
|
-
backgroundColor: alpha(theme.palette.info.main, 0.25),
|
|
557
|
+
backgroundColor: system.alpha(theme.palette.info.main, 0.25),
|
|
815
558
|
color: theme.palette.info.light,
|
|
816
559
|
"& .MuiAlert-icon": {
|
|
817
560
|
color: theme.palette.info.light
|
|
818
561
|
}
|
|
819
562
|
}),
|
|
820
563
|
standardWarning: ({ theme }) => ({
|
|
821
|
-
backgroundColor: alpha(theme.palette.warning.main, 0.25),
|
|
564
|
+
backgroundColor: system.alpha(theme.palette.warning.main, 0.25),
|
|
822
565
|
color: theme.palette.warning.light,
|
|
823
566
|
"& .MuiAlert-icon": {
|
|
824
567
|
color: theme.palette.warning.light
|
|
825
568
|
}
|
|
826
569
|
}),
|
|
827
570
|
standardSuccess: ({ theme }) => ({
|
|
828
|
-
backgroundColor: alpha(theme.palette.success.main, 0.25),
|
|
571
|
+
backgroundColor: system.alpha(theme.palette.success.main, 0.25),
|
|
829
572
|
color: theme.palette.success.light,
|
|
830
573
|
"& .MuiAlert-icon": {
|
|
831
574
|
color: theme.palette.success.light
|
|
@@ -858,40 +601,35 @@ var BLOCKLET_THEME_DARK = merge(BLOCKLET_THEME_LIGHT, {
|
|
|
858
601
|
}
|
|
859
602
|
}
|
|
860
603
|
});
|
|
861
|
-
|
|
862
|
-
// src/did-connect.ts
|
|
863
|
-
var paletteLight = {
|
|
604
|
+
const paletteLight = {
|
|
864
605
|
divider: "rgba(18, 22, 24, 0.06)",
|
|
865
606
|
action: {
|
|
866
607
|
hover: "#FAFAFA",
|
|
867
608
|
selected: "#F4F4F5"
|
|
868
609
|
}
|
|
869
610
|
};
|
|
870
|
-
|
|
611
|
+
const paletteDark = {
|
|
871
612
|
divider: "rgba(255, 255, 255, 0.06)",
|
|
872
613
|
action: {
|
|
873
614
|
hover: "rgba(255, 255, 255, 0.08)",
|
|
874
615
|
selected: "rgba(255, 255, 255, 0.16)"
|
|
875
616
|
}
|
|
876
617
|
};
|
|
877
|
-
|
|
618
|
+
const DID_CONNECT_THEME_LIGHT = merge(BLOCKLET_THEME_LIGHT, {
|
|
878
619
|
palette: paletteLight
|
|
879
620
|
});
|
|
880
|
-
|
|
621
|
+
const DID_CONNECT_THEME_DARK = merge(BLOCKLET_THEME_DARK, {
|
|
881
622
|
palette: paletteDark
|
|
882
623
|
});
|
|
883
|
-
|
|
884
|
-
|
|
885
|
-
|
|
886
|
-
|
|
887
|
-
|
|
888
|
-
|
|
889
|
-
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
|
|
894
|
-
|
|
895
|
-
isValidThemeMode,
|
|
896
|
-
merge
|
|
897
|
-
});
|
|
624
|
+
exports.BLOCKLET_THEME_DARK = BLOCKLET_THEME_DARK;
|
|
625
|
+
exports.BLOCKLET_THEME_LIGHT = BLOCKLET_THEME_LIGHT;
|
|
626
|
+
exports.BLOCKLET_THEME_PREFER_KEY = BLOCKLET_THEME_PREFER_KEY;
|
|
627
|
+
exports.DEFAULT_FONTS = DEFAULT_FONTS;
|
|
628
|
+
exports.DID_CONNECT_THEME_DARK = DID_CONNECT_THEME_DARK;
|
|
629
|
+
exports.DID_CONNECT_THEME_LIGHT = DID_CONNECT_THEME_LIGHT;
|
|
630
|
+
exports.buildThemeScript = buildThemeScript;
|
|
631
|
+
exports.buildThemeStyles = buildThemeStyles;
|
|
632
|
+
exports.getBlockletThemeOptions = getBlockletThemeOptions;
|
|
633
|
+
exports.getDefaultThemePrefer = getDefaultThemePrefer;
|
|
634
|
+
exports.isValidThemeMode = isValidThemeMode;
|
|
635
|
+
exports.merge = merge;
|
package/dist/es/index.js
CHANGED
|
@@ -1,245 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __commonJS = (cb, mod) => function __require() {
|
|
8
|
-
return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
|
|
9
|
-
};
|
|
10
|
-
var __copyProps = (to, from, except, desc) => {
|
|
11
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
-
for (let key of __getOwnPropNames(from))
|
|
13
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
-
}
|
|
16
|
-
return to;
|
|
17
|
-
};
|
|
18
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
19
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
20
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
21
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
22
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
23
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
24
|
-
mod
|
|
25
|
-
));
|
|
26
|
-
|
|
27
|
-
// ../../node_modules/deepmerge/dist/cjs.js
|
|
28
|
-
var require_cjs = __commonJS({
|
|
29
|
-
"../../node_modules/deepmerge/dist/cjs.js"(exports, module) {
|
|
30
|
-
"use strict";
|
|
31
|
-
var isMergeableObject = function isMergeableObject2(value) {
|
|
32
|
-
return isNonNullObject(value) && !isSpecial(value);
|
|
33
|
-
};
|
|
34
|
-
function isNonNullObject(value) {
|
|
35
|
-
return !!value && typeof value === "object";
|
|
36
|
-
}
|
|
37
|
-
function isSpecial(value) {
|
|
38
|
-
var stringValue = Object.prototype.toString.call(value);
|
|
39
|
-
return stringValue === "[object RegExp]" || stringValue === "[object Date]" || isReactElement(value);
|
|
40
|
-
}
|
|
41
|
-
var canUseSymbol = typeof Symbol === "function" && Symbol.for;
|
|
42
|
-
var REACT_ELEMENT_TYPE = canUseSymbol ? Symbol.for("react.element") : 60103;
|
|
43
|
-
function isReactElement(value) {
|
|
44
|
-
return value.$$typeof === REACT_ELEMENT_TYPE;
|
|
45
|
-
}
|
|
46
|
-
function emptyTarget(val) {
|
|
47
|
-
return Array.isArray(val) ? [] : {};
|
|
48
|
-
}
|
|
49
|
-
function cloneUnlessOtherwiseSpecified(value, options) {
|
|
50
|
-
return options.clone !== false && options.isMergeableObject(value) ? deepmerge2(emptyTarget(value), value, options) : value;
|
|
51
|
-
}
|
|
52
|
-
function defaultArrayMerge(target, source, options) {
|
|
53
|
-
return target.concat(source).map(function(element) {
|
|
54
|
-
return cloneUnlessOtherwiseSpecified(element, options);
|
|
55
|
-
});
|
|
56
|
-
}
|
|
57
|
-
function getMergeFunction(key, options) {
|
|
58
|
-
if (!options.customMerge) {
|
|
59
|
-
return deepmerge2;
|
|
60
|
-
}
|
|
61
|
-
var customMerge = options.customMerge(key);
|
|
62
|
-
return typeof customMerge === "function" ? customMerge : deepmerge2;
|
|
63
|
-
}
|
|
64
|
-
function getEnumerableOwnPropertySymbols(target) {
|
|
65
|
-
return Object.getOwnPropertySymbols ? Object.getOwnPropertySymbols(target).filter(function(symbol) {
|
|
66
|
-
return Object.propertyIsEnumerable.call(target, symbol);
|
|
67
|
-
}) : [];
|
|
68
|
-
}
|
|
69
|
-
function getKeys(target) {
|
|
70
|
-
return Object.keys(target).concat(getEnumerableOwnPropertySymbols(target));
|
|
71
|
-
}
|
|
72
|
-
function propertyIsOnObject(object, property) {
|
|
73
|
-
try {
|
|
74
|
-
return property in object;
|
|
75
|
-
} catch (_) {
|
|
76
|
-
return false;
|
|
77
|
-
}
|
|
78
|
-
}
|
|
79
|
-
function propertyIsUnsafe(target, key) {
|
|
80
|
-
return propertyIsOnObject(target, key) && !(Object.hasOwnProperty.call(target, key) && Object.propertyIsEnumerable.call(target, key));
|
|
81
|
-
}
|
|
82
|
-
function mergeObject(target, source, options) {
|
|
83
|
-
var destination = {};
|
|
84
|
-
if (options.isMergeableObject(target)) {
|
|
85
|
-
getKeys(target).forEach(function(key) {
|
|
86
|
-
destination[key] = cloneUnlessOtherwiseSpecified(target[key], options);
|
|
87
|
-
});
|
|
88
|
-
}
|
|
89
|
-
getKeys(source).forEach(function(key) {
|
|
90
|
-
if (propertyIsUnsafe(target, key)) {
|
|
91
|
-
return;
|
|
92
|
-
}
|
|
93
|
-
if (propertyIsOnObject(target, key) && options.isMergeableObject(source[key])) {
|
|
94
|
-
destination[key] = getMergeFunction(key, options)(target[key], source[key], options);
|
|
95
|
-
} else {
|
|
96
|
-
destination[key] = cloneUnlessOtherwiseSpecified(source[key], options);
|
|
97
|
-
}
|
|
98
|
-
});
|
|
99
|
-
return destination;
|
|
100
|
-
}
|
|
101
|
-
function deepmerge2(target, source, options) {
|
|
102
|
-
options = options || {};
|
|
103
|
-
options.arrayMerge = options.arrayMerge || defaultArrayMerge;
|
|
104
|
-
options.isMergeableObject = options.isMergeableObject || isMergeableObject;
|
|
105
|
-
options.cloneUnlessOtherwiseSpecified = cloneUnlessOtherwiseSpecified;
|
|
106
|
-
var sourceIsArray = Array.isArray(source);
|
|
107
|
-
var targetIsArray = Array.isArray(target);
|
|
108
|
-
var sourceAndTargetTypesMatch = sourceIsArray === targetIsArray;
|
|
109
|
-
if (!sourceAndTargetTypesMatch) {
|
|
110
|
-
return cloneUnlessOtherwiseSpecified(source, options);
|
|
111
|
-
} else if (sourceIsArray) {
|
|
112
|
-
return options.arrayMerge(target, source, options);
|
|
113
|
-
} else {
|
|
114
|
-
return mergeObject(target, source, options);
|
|
115
|
-
}
|
|
116
|
-
}
|
|
117
|
-
deepmerge2.all = function deepmergeAll(array, options) {
|
|
118
|
-
if (!Array.isArray(array)) {
|
|
119
|
-
throw new Error("first argument should be an array");
|
|
120
|
-
}
|
|
121
|
-
return array.reduce(function(prev, next) {
|
|
122
|
-
return deepmerge2(prev, next, options);
|
|
123
|
-
}, {});
|
|
124
|
-
};
|
|
125
|
-
var deepmerge_1 = deepmerge2;
|
|
126
|
-
module.exports = deepmerge_1;
|
|
127
|
-
}
|
|
128
|
-
});
|
|
129
|
-
|
|
130
|
-
// node_modules/@mui/utils/esm/formatMuiErrorMessage/formatMuiErrorMessage.js
|
|
131
|
-
function formatMuiErrorMessage(code, ...args) {
|
|
132
|
-
const url = new URL(`https://mui.com/production-error/?code=${code}`);
|
|
133
|
-
args.forEach((arg) => url.searchParams.append("args[]", arg));
|
|
134
|
-
return `Minified MUI error #${code}; visit ${url} for the full message.`;
|
|
135
|
-
}
|
|
136
|
-
|
|
137
|
-
// node_modules/@mui/utils/esm/clamp/clamp.js
|
|
138
|
-
function clamp(val, min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER) {
|
|
139
|
-
return Math.max(min, Math.min(val, max));
|
|
140
|
-
}
|
|
141
|
-
var clamp_default = clamp;
|
|
142
|
-
|
|
143
|
-
// node_modules/@mui/system/esm/colorManipulator/colorManipulator.js
|
|
144
|
-
function clampWrapper(value, min = 0, max = 1) {
|
|
145
|
-
if (process.env.NODE_ENV !== "production") {
|
|
146
|
-
if (value < min || value > max) {
|
|
147
|
-
console.error(`MUI: The value provided ${value} is out of range [${min}, ${max}].`);
|
|
148
|
-
}
|
|
149
|
-
}
|
|
150
|
-
return clamp_default(value, min, max);
|
|
151
|
-
}
|
|
152
|
-
function hexToRgb(color) {
|
|
153
|
-
color = color.slice(1);
|
|
154
|
-
const re = new RegExp(`.{1,${color.length >= 6 ? 2 : 1}}`, "g");
|
|
155
|
-
let colors = color.match(re);
|
|
156
|
-
if (colors && colors[0].length === 1) {
|
|
157
|
-
colors = colors.map((n) => n + n);
|
|
158
|
-
}
|
|
159
|
-
if (process.env.NODE_ENV !== "production") {
|
|
160
|
-
if (color.length !== color.trim().length) {
|
|
161
|
-
console.error(`MUI: The color: "${color}" is invalid. Make sure the color input doesn't contain leading/trailing space.`);
|
|
162
|
-
}
|
|
163
|
-
}
|
|
164
|
-
return colors ? `rgb${colors.length === 4 ? "a" : ""}(${colors.map((n, index) => {
|
|
165
|
-
return index < 3 ? parseInt(n, 16) : Math.round(parseInt(n, 16) / 255 * 1e3) / 1e3;
|
|
166
|
-
}).join(", ")})` : "";
|
|
167
|
-
}
|
|
168
|
-
function decomposeColor(color) {
|
|
169
|
-
if (color.type) {
|
|
170
|
-
return color;
|
|
171
|
-
}
|
|
172
|
-
if (color.charAt(0) === "#") {
|
|
173
|
-
return decomposeColor(hexToRgb(color));
|
|
174
|
-
}
|
|
175
|
-
const marker = color.indexOf("(");
|
|
176
|
-
const type = color.substring(0, marker);
|
|
177
|
-
if (!["rgb", "rgba", "hsl", "hsla", "color"].includes(type)) {
|
|
178
|
-
throw new Error(process.env.NODE_ENV !== "production" ? `MUI: Unsupported \`${color}\` color.
|
|
179
|
-
The following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().` : formatMuiErrorMessage(9, color));
|
|
180
|
-
}
|
|
181
|
-
let values = color.substring(marker + 1, color.length - 1);
|
|
182
|
-
let colorSpace;
|
|
183
|
-
if (type === "color") {
|
|
184
|
-
values = values.split(" ");
|
|
185
|
-
colorSpace = values.shift();
|
|
186
|
-
if (values.length === 4 && values[3].charAt(0) === "/") {
|
|
187
|
-
values[3] = values[3].slice(1);
|
|
188
|
-
}
|
|
189
|
-
if (!["srgb", "display-p3", "a98-rgb", "prophoto-rgb", "rec-2020"].includes(colorSpace)) {
|
|
190
|
-
throw new Error(process.env.NODE_ENV !== "production" ? `MUI: unsupported \`${colorSpace}\` color space.
|
|
191
|
-
The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rgb, rec-2020.` : formatMuiErrorMessage(10, colorSpace));
|
|
192
|
-
}
|
|
193
|
-
} else {
|
|
194
|
-
values = values.split(",");
|
|
195
|
-
}
|
|
196
|
-
values = values.map((value) => parseFloat(value));
|
|
197
|
-
return {
|
|
198
|
-
type,
|
|
199
|
-
values,
|
|
200
|
-
colorSpace
|
|
201
|
-
};
|
|
202
|
-
}
|
|
203
|
-
function recomposeColor(color) {
|
|
204
|
-
const {
|
|
205
|
-
type,
|
|
206
|
-
colorSpace
|
|
207
|
-
} = color;
|
|
208
|
-
let {
|
|
209
|
-
values
|
|
210
|
-
} = color;
|
|
211
|
-
if (type.includes("rgb")) {
|
|
212
|
-
values = values.map((n, i) => i < 3 ? parseInt(n, 10) : n);
|
|
213
|
-
} else if (type.includes("hsl")) {
|
|
214
|
-
values[1] = `${values[1]}%`;
|
|
215
|
-
values[2] = `${values[2]}%`;
|
|
216
|
-
}
|
|
217
|
-
if (type.includes("color")) {
|
|
218
|
-
values = `${colorSpace} ${values.join(" ")}`;
|
|
219
|
-
} else {
|
|
220
|
-
values = `${values.join(", ")}`;
|
|
221
|
-
}
|
|
222
|
-
return `${type}(${values})`;
|
|
223
|
-
}
|
|
224
|
-
function alpha(color, value) {
|
|
225
|
-
color = decomposeColor(color);
|
|
226
|
-
value = clampWrapper(value);
|
|
227
|
-
if (color.type === "rgb" || color.type === "hsl") {
|
|
228
|
-
color.type += "a";
|
|
229
|
-
}
|
|
230
|
-
if (color.type === "color") {
|
|
231
|
-
color.values[3] = `/${value}`;
|
|
232
|
-
} else {
|
|
233
|
-
color.values[3] = value;
|
|
234
|
-
}
|
|
235
|
-
return recomposeColor(color);
|
|
236
|
-
}
|
|
237
|
-
|
|
238
|
-
// src/util.ts
|
|
239
|
-
var import_deepmerge = __toESM(require_cjs());
|
|
240
|
-
var BLOCKLET_THEME_PREFER_KEY = "blocklet_theme_prefer";
|
|
241
|
-
var merge = (x, y) => {
|
|
242
|
-
return (0, import_deepmerge.default)(x, y, {
|
|
1
|
+
import { alpha } from "@mui/system";
|
|
2
|
+
import deepmerge from "deepmerge";
|
|
3
|
+
const BLOCKLET_THEME_PREFER_KEY = "blocklet_theme_prefer";
|
|
4
|
+
const merge = (x, y) => {
|
|
5
|
+
return deepmerge(x, y, {
|
|
243
6
|
// 采用替换策略合并数组
|
|
244
7
|
arrayMerge: (_, source) => source
|
|
245
8
|
});
|
|
@@ -248,15 +11,17 @@ function isValidThemeMode(mode) {
|
|
|
248
11
|
return mode === "light" || mode === "dark";
|
|
249
12
|
}
|
|
250
13
|
function getBlockletThemeOptions(mode = "light") {
|
|
251
|
-
|
|
14
|
+
var _a;
|
|
15
|
+
const { common = {}, light = {}, dark = {} } = ((_a = window.blocklet) == null ? void 0 : _a.theme) || {};
|
|
252
16
|
if (mode === "dark") {
|
|
253
17
|
return merge(common, dark);
|
|
254
18
|
}
|
|
255
19
|
return merge(common, light);
|
|
256
20
|
}
|
|
257
21
|
function getDefaultThemePrefer(meta) {
|
|
22
|
+
var _a, _b;
|
|
258
23
|
const blockletInfo = Object.assign({}, window.blocklet, meta);
|
|
259
|
-
const preferKey = blockletInfo.theme
|
|
24
|
+
const preferKey = ((_a = blockletInfo.theme) == null ? void 0 : _a.preferKey) ?? BLOCKLET_THEME_PREFER_KEY;
|
|
260
25
|
const urlParams = new URLSearchParams(window.location.search);
|
|
261
26
|
const urlPrefer = urlParams.get("theme");
|
|
262
27
|
if (isValidThemeMode(urlPrefer)) {
|
|
@@ -266,7 +31,7 @@ function getDefaultThemePrefer(meta) {
|
|
|
266
31
|
if (isValidThemeMode(sessionPrefer)) {
|
|
267
32
|
return sessionPrefer;
|
|
268
33
|
}
|
|
269
|
-
const prefer = blockletInfo.theme
|
|
34
|
+
const prefer = (_b = blockletInfo.theme) == null ? void 0 : _b.prefer;
|
|
270
35
|
if (prefer === "light" || prefer === "dark") {
|
|
271
36
|
return prefer;
|
|
272
37
|
}
|
|
@@ -279,18 +44,19 @@ function getDefaultThemePrefer(meta) {
|
|
|
279
44
|
}
|
|
280
45
|
return "light";
|
|
281
46
|
}
|
|
282
|
-
|
|
47
|
+
const buildThemeStyles = (theme) => {
|
|
48
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
283
49
|
const { light = {}, dark = {} } = theme ?? {};
|
|
284
50
|
return `
|
|
285
51
|
<style id="blocklet-theme-style">
|
|
286
52
|
:root {
|
|
287
|
-
--blocklet-background-default-color: ${light.palette
|
|
288
|
-
--blocklet-text-primary-color: ${light.palette
|
|
53
|
+
--blocklet-background-default-color: ${((_b = (_a = light.palette) == null ? void 0 : _a.background) == null ? void 0 : _b.default) ?? "#ffffff"};
|
|
54
|
+
--blocklet-text-primary-color: ${((_d = (_c = light.palette) == null ? void 0 : _c.text) == null ? void 0 : _d.primary) ?? "#18181b"};
|
|
289
55
|
}
|
|
290
56
|
|
|
291
57
|
[data-theme='dark'] {
|
|
292
|
-
--blocklet-background-default-color: ${dark.palette
|
|
293
|
-
--blocklet-text-primary-color: ${dark.palette
|
|
58
|
+
--blocklet-background-default-color: ${((_f = (_e = dark.palette) == null ? void 0 : _e.background) == null ? void 0 : _f.default) ?? "#121212"};
|
|
59
|
+
--blocklet-text-primary-color: ${((_h = (_g = dark.palette) == null ? void 0 : _g.text) == null ? void 0 : _h.primary) ?? "#ffffff"};
|
|
294
60
|
}
|
|
295
61
|
|
|
296
62
|
html, body {
|
|
@@ -300,7 +66,7 @@ var buildThemeStyles = (theme) => {
|
|
|
300
66
|
</style>
|
|
301
67
|
`;
|
|
302
68
|
};
|
|
303
|
-
|
|
69
|
+
const buildThemeScript = (theme) => {
|
|
304
70
|
return `
|
|
305
71
|
<script id="blocklet-theme-script">
|
|
306
72
|
(function() {
|
|
@@ -308,7 +74,7 @@ var buildThemeScript = (theme) => {
|
|
|
308
74
|
${isValidThemeMode.toString()}
|
|
309
75
|
${getDefaultThemePrefer.toString()}
|
|
310
76
|
|
|
311
|
-
const prefer = getDefaultThemePrefer(${JSON.stringify({ theme: { prefer: theme
|
|
77
|
+
const prefer = getDefaultThemePrefer(${JSON.stringify({ theme: { prefer: (theme == null ? void 0 : theme.prefer) ?? "light", preferKey: BLOCKLET_THEME_PREFER_KEY } })});
|
|
312
78
|
|
|
313
79
|
if(prefer === 'dark') {
|
|
314
80
|
document.documentElement.setAttribute('data-theme', 'dark');
|
|
@@ -319,13 +85,11 @@ var buildThemeScript = (theme) => {
|
|
|
319
85
|
console.error('Theme init error:', e);
|
|
320
86
|
}
|
|
321
87
|
})();
|
|
322
|
-
|
|
88
|
+
<\/script>
|
|
323
89
|
`;
|
|
324
90
|
};
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
var DEFAULT_FONTS = ["Roboto", "Helvetica", "Arial", "sans-serif"];
|
|
328
|
-
var shadows = [
|
|
91
|
+
const DEFAULT_FONTS = ["Roboto", "Helvetica", "Arial", "sans-serif"];
|
|
92
|
+
const shadows = [
|
|
329
93
|
"none",
|
|
330
94
|
"0px 1px 2px 0px rgba(24,24,27,0.06),0px 1px 3px 0px rgba(24,24,27,0.03)",
|
|
331
95
|
"0px 1.5px 3px 0px rgba(24,24,27,0.07),0px 1px 4px 0px rgba(24,24,27,0.035)",
|
|
@@ -352,7 +116,7 @@ var shadows = [
|
|
|
352
116
|
"0px 11.5px 46px 0px rgba(24,24,27,0.28),0px 11px 25px 0px rgba(24,24,27,0.14)",
|
|
353
117
|
"0px 12px 48px 0px rgba(24,24,27,0.29),0px 11.5px 26px 0px rgba(24,24,27,0.145)"
|
|
354
118
|
];
|
|
355
|
-
|
|
119
|
+
const BLOCKLET_THEME_LIGHT = {
|
|
356
120
|
palette: {
|
|
357
121
|
mode: "light",
|
|
358
122
|
primary: {
|
|
@@ -656,7 +420,7 @@ var BLOCKLET_THEME_LIGHT = {
|
|
|
656
420
|
}
|
|
657
421
|
}
|
|
658
422
|
};
|
|
659
|
-
|
|
423
|
+
const BLOCKLET_THEME_DARK = merge(BLOCKLET_THEME_LIGHT, {
|
|
660
424
|
palette: {
|
|
661
425
|
mode: "dark",
|
|
662
426
|
common: {
|
|
@@ -835,26 +599,24 @@ var BLOCKLET_THEME_DARK = merge(BLOCKLET_THEME_LIGHT, {
|
|
|
835
599
|
}
|
|
836
600
|
}
|
|
837
601
|
});
|
|
838
|
-
|
|
839
|
-
// src/did-connect.ts
|
|
840
|
-
var paletteLight = {
|
|
602
|
+
const paletteLight = {
|
|
841
603
|
divider: "rgba(18, 22, 24, 0.06)",
|
|
842
604
|
action: {
|
|
843
605
|
hover: "#FAFAFA",
|
|
844
606
|
selected: "#F4F4F5"
|
|
845
607
|
}
|
|
846
608
|
};
|
|
847
|
-
|
|
609
|
+
const paletteDark = {
|
|
848
610
|
divider: "rgba(255, 255, 255, 0.06)",
|
|
849
611
|
action: {
|
|
850
612
|
hover: "rgba(255, 255, 255, 0.08)",
|
|
851
613
|
selected: "rgba(255, 255, 255, 0.16)"
|
|
852
614
|
}
|
|
853
615
|
};
|
|
854
|
-
|
|
616
|
+
const DID_CONNECT_THEME_LIGHT = merge(BLOCKLET_THEME_LIGHT, {
|
|
855
617
|
palette: paletteLight
|
|
856
618
|
});
|
|
857
|
-
|
|
619
|
+
const DID_CONNECT_THEME_DARK = merge(BLOCKLET_THEME_DARK, {
|
|
858
620
|
palette: paletteDark
|
|
859
621
|
});
|
|
860
622
|
export {
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { Theme, ThemeOptions } from './types';
|
|
2
|
+
export type { Theme, ThemeOptions };
|
|
3
|
+
export declare const DEFAULT_FONTS: string[];
|
|
4
|
+
/**
|
|
5
|
+
* figma: https://www.figma.com/file/1qHyMF137EXOQpSFVByszG/UX-Library?node-id=295%3A1518
|
|
6
|
+
*/
|
|
7
|
+
export declare const BLOCKLET_THEME_LIGHT: ThemeOptions;
|
|
8
|
+
export declare const BLOCKLET_THEME_DARK: ThemeOptions;
|
package/dist/types/index.d.ts
CHANGED
|
@@ -1,89 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
declare module "@mui/material/styles" {
|
|
6
|
-
// @extend theme
|
|
7
|
-
interface Theme {
|
|
8
|
-
mode?: PaletteMode;
|
|
9
|
-
themeName?: string;
|
|
10
|
-
pageWidth?: string;
|
|
11
|
-
/** @deprecated 请使用 theme.palette */
|
|
12
|
-
colors?: Record<string, string>;
|
|
13
|
-
/** @private 标识这是一个 UX Theme */
|
|
14
|
-
__isUxTheme__?: true;
|
|
15
|
-
}
|
|
16
|
-
interface ThemeOptions {
|
|
17
|
-
mode?: PaletteMode;
|
|
18
|
-
themeName?: string;
|
|
19
|
-
pageWidth?: string;
|
|
20
|
-
/** @deprecated 请使用 theme.palette */
|
|
21
|
-
colors?: Record<string, string>;
|
|
22
|
-
/** @deprecated 请使用 components */
|
|
23
|
-
overrides?: Components<Omit<Theme, "components">>;
|
|
24
|
-
}
|
|
25
|
-
// @extend theme.palette
|
|
26
|
-
interface Palette {
|
|
27
|
-
storeSecondary: SimplePaletteColorOptions;
|
|
28
|
-
did: {
|
|
29
|
-
primary: string;
|
|
30
|
-
secondary: string;
|
|
31
|
-
};
|
|
32
|
-
}
|
|
33
|
-
interface PaletteOptions {
|
|
34
|
-
storeSecondary?: PaletteColorOptions;
|
|
35
|
-
did?: {
|
|
36
|
-
primary?: string;
|
|
37
|
-
secondary?: string;
|
|
38
|
-
};
|
|
39
|
-
}
|
|
40
|
-
// @extend theme.palette.text
|
|
41
|
-
interface TypeText {
|
|
42
|
-
hint: string;
|
|
43
|
-
contrast: string;
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
declare module "@mui/material/styles/createTypography" {
|
|
47
|
-
// @extend theme.typography
|
|
48
|
-
interface Typography {
|
|
49
|
-
/** @deprecated 请使用 theme.palette.text */
|
|
50
|
-
color: Record<string, string>;
|
|
51
|
-
}
|
|
52
|
-
interface TypographyOptions {
|
|
53
|
-
color?: Record<string, string>;
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
export declare const DEFAULT_FONTS: string[];
|
|
57
|
-
/**
|
|
58
|
-
* figma: https://www.figma.com/file/1qHyMF137EXOQpSFVByszG/UX-Library?node-id=295%3A1518
|
|
59
|
-
*/
|
|
60
|
-
export declare const BLOCKLET_THEME_LIGHT: ThemeOptions;
|
|
61
|
-
export declare const BLOCKLET_THEME_DARK: ThemeOptions;
|
|
62
|
-
export declare const DID_CONNECT_THEME_LIGHT: import("@mui/material/styles").ThemeOptions;
|
|
63
|
-
export declare const DID_CONNECT_THEME_DARK: import("@mui/material/styles").ThemeOptions;
|
|
64
|
-
export declare const BLOCKLET_THEME_PREFER_KEY = "blocklet_theme_prefer";
|
|
65
|
-
export declare const merge: <T>(x: T, y: Partial<T>) => T;
|
|
66
|
-
export declare function isValidThemeMode(mode: any): mode is PaletteMode;
|
|
67
|
-
export declare function getBlockletThemeOptions(mode?: PaletteMode): ThemeOptions;
|
|
68
|
-
export declare function getDefaultThemePrefer(meta?: {
|
|
69
|
-
theme: {
|
|
70
|
-
prefer: "light" | "dark" | "system";
|
|
71
|
-
preferKey?: string;
|
|
72
|
-
};
|
|
73
|
-
}): PaletteMode;
|
|
74
|
-
export type ThemeSettings = {
|
|
75
|
-
prefer: "light" | "dark" | "system";
|
|
76
|
-
light: ThemeOptions;
|
|
77
|
-
dark: ThemeOptions;
|
|
78
|
-
};
|
|
79
|
-
/** 生成用于服务端注入的初始样式，避免首屏加载闪白 */
|
|
80
|
-
export declare const buildThemeStyles: (theme?: ThemeSettings) => string;
|
|
81
|
-
/** 生成用于服务端注入的初始脚本，用于选择 theme mode */
|
|
82
|
-
export declare const buildThemeScript: (theme?: ThemeSettings) => string;
|
|
83
|
-
|
|
84
|
-
export {
|
|
85
|
-
Theme,
|
|
86
|
-
ThemeOptions,
|
|
87
|
-
};
|
|
88
|
-
|
|
89
|
-
export {};
|
|
1
|
+
export * from './blocklet';
|
|
2
|
+
export * from './did-connect';
|
|
3
|
+
export * from './util';
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { PaletteMode } from '@mui/material';
|
|
2
|
+
import { ThemeOptions } from './types';
|
|
3
|
+
export declare const BLOCKLET_THEME_PREFER_KEY = "blocklet_theme_prefer";
|
|
4
|
+
export declare const merge: <T>(x: T, y: Partial<T>) => T;
|
|
5
|
+
export declare function isValidThemeMode(mode: any): mode is PaletteMode;
|
|
6
|
+
export declare function getBlockletThemeOptions(mode?: PaletteMode): ThemeOptions;
|
|
7
|
+
export declare function getDefaultThemePrefer(meta?: {
|
|
8
|
+
theme: {
|
|
9
|
+
prefer: 'light' | 'dark' | 'system';
|
|
10
|
+
preferKey?: string;
|
|
11
|
+
};
|
|
12
|
+
}): PaletteMode;
|
|
13
|
+
export type ThemeSettings = {
|
|
14
|
+
prefer: 'light' | 'dark' | 'system';
|
|
15
|
+
light: ThemeOptions;
|
|
16
|
+
dark: ThemeOptions;
|
|
17
|
+
};
|
|
18
|
+
/** 生成用于服务端注入的初始样式，避免首屏加载闪白 */
|
|
19
|
+
export declare const buildThemeStyles: (theme?: ThemeSettings) => string;
|
|
20
|
+
/** 生成用于服务端注入的初始脚本，用于选择 theme mode */
|
|
21
|
+
export declare const buildThemeScript: (theme?: ThemeSettings) => string;
|
package/package.json
CHANGED
|
@@ -3,16 +3,16 @@
|
|
|
3
3
|
"publishConfig": {
|
|
4
4
|
"access": "public"
|
|
5
5
|
},
|
|
6
|
-
"version": "
|
|
6
|
+
"version": "3.0.0",
|
|
7
7
|
"description": "A preset MUI-based theme configuration designed for use with Blocklet.",
|
|
8
8
|
"main": "dist/cjs/index.js",
|
|
9
9
|
"module": "dist/es/index.js",
|
|
10
10
|
"types": "dist/types/index.d.ts",
|
|
11
11
|
"exports": {
|
|
12
12
|
".": {
|
|
13
|
+
"types": "./dist/types/index.d.ts",
|
|
13
14
|
"require": "./dist/cjs/index.js",
|
|
14
|
-
"import": "./dist/es/index.js"
|
|
15
|
-
"types": "./dist/types/index.d.ts"
|
|
15
|
+
"import": "./dist/es/index.js"
|
|
16
16
|
}
|
|
17
17
|
},
|
|
18
18
|
"files": [
|
|
@@ -23,37 +23,27 @@
|
|
|
23
23
|
"lint:fix": "npm run lint -- --fix",
|
|
24
24
|
"test": "NODE_ENV=test node tools/jest.js",
|
|
25
25
|
"coverage": "npm run test -- --coverage",
|
|
26
|
-
"
|
|
27
|
-
"
|
|
28
|
-
"build:cjs": "esbuild src/index.ts --bundle --outfile=dist/cjs/index.js --platform=node --format=cjs",
|
|
29
|
-
"build:esm": "esbuild src/index.ts --bundle --outfile=dist/es/index.js --platform=node --format=esm",
|
|
30
|
-
"build": "npm run clean && npm run build:cjs && npm run build:esm && npm run build:types",
|
|
31
|
-
"watch:cjs": "npm run build:cjs -- --watch",
|
|
32
|
-
"watch:esm": "npm run build:esm -- --watch",
|
|
33
|
-
"watch": "npm run watch:cjs & npm run watch:esm"
|
|
26
|
+
"build": "vite build",
|
|
27
|
+
"watch": "vite build --watch"
|
|
34
28
|
},
|
|
35
29
|
"author": "wangshijun<wangshijun2010@gmail.com>",
|
|
36
30
|
"license": "Apache-2.0",
|
|
37
31
|
"peerDependencies": {
|
|
38
|
-
"@mui/material": "
|
|
32
|
+
"@mui/material": "^7.1.2"
|
|
39
33
|
},
|
|
40
34
|
"dependencies": {
|
|
41
|
-
"@mui/system": "^7.1.
|
|
35
|
+
"@mui/system": "^7.1.1",
|
|
42
36
|
"deepmerge": "^4.3.1"
|
|
43
37
|
},
|
|
44
38
|
"devDependencies": {
|
|
45
39
|
"@arcblock/eslint-config-ts": "^0.3.3",
|
|
46
|
-
"@types/jest": "^29.5.
|
|
47
|
-
"@types/node": "^
|
|
48
|
-
"
|
|
49
|
-
"@typescript-eslint/parser": "^7.1.0",
|
|
50
|
-
"dts-bundle-generator": "^9.2.3",
|
|
51
|
-
"esbuild": "^0.20.2",
|
|
52
|
-
"eslint": "^8.57.0",
|
|
40
|
+
"@types/jest": "^29.5.14",
|
|
41
|
+
"@types/node": "^24.0.4",
|
|
42
|
+
"eslint": "^8.57.1",
|
|
53
43
|
"jest": "^29.7.0",
|
|
54
|
-
"prettier": "^3.
|
|
55
|
-
"ts-jest": "^29.
|
|
44
|
+
"prettier": "^3.6.0",
|
|
45
|
+
"ts-jest": "^29.4.0",
|
|
56
46
|
"typescript": "~5.5.4"
|
|
57
47
|
},
|
|
58
|
-
"gitHead": "
|
|
48
|
+
"gitHead": "b001c32ca85d40d8a0784ca581bfd54d90550b24"
|
|
59
49
|
}
|