@symbo.ls/scratch 3.1.2 → 3.2.7

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.
Files changed (67) hide show
  1. package/dist/cjs/factory.js +23 -475
  2. package/dist/cjs/index.js +11 -2684
  3. package/dist/cjs/set.js +66 -1992
  4. package/dist/esm/factory.js +43 -0
  5. package/dist/esm/index.js +12 -0
  6. package/dist/esm/set.js +148 -0
  7. package/dist/iife/index.js +2580 -0
  8. package/package.json +26 -16
  9. package/src/set.js +22 -7
  10. package/src/system/color.js +48 -11
  11. package/src/system/font.js +19 -5
  12. package/src/system/reset.js +12 -3
  13. package/src/system/shadow.js +20 -13
  14. package/src/system/spacing.js +63 -56
  15. package/src/system/theme.js +4 -3
  16. package/src/system/timing.js +1 -1
  17. package/src/system/typography.js +12 -20
  18. package/src/transforms/index.js +212 -95
  19. package/src/utils/color.js +121 -31
  20. package/src/utils/font.js +54 -14
  21. package/src/utils/sequence.js +94 -39
  22. package/src/utils/sprite.js +10 -6
  23. package/src/utils/unit.js +69 -2
  24. package/src/utils/var.js +1 -2
  25. package/dist/cjs/defaultConfig/animation.js +0 -26
  26. package/dist/cjs/defaultConfig/cases.js +0 -26
  27. package/dist/cjs/defaultConfig/class.js +0 -27
  28. package/dist/cjs/defaultConfig/color.js +0 -28
  29. package/dist/cjs/defaultConfig/document.js +0 -26
  30. package/dist/cjs/defaultConfig/font-family.js +0 -34
  31. package/dist/cjs/defaultConfig/font.js +0 -26
  32. package/dist/cjs/defaultConfig/grid.js +0 -27
  33. package/dist/cjs/defaultConfig/icons.js +0 -28
  34. package/dist/cjs/defaultConfig/index.js +0 -222
  35. package/dist/cjs/defaultConfig/media.js +0 -31
  36. package/dist/cjs/defaultConfig/responsive.js +0 -52
  37. package/dist/cjs/defaultConfig/sequence.js +0 -51
  38. package/dist/cjs/defaultConfig/shadow.js +0 -26
  39. package/dist/cjs/defaultConfig/spacing.js +0 -87
  40. package/dist/cjs/defaultConfig/svg.js +0 -28
  41. package/dist/cjs/defaultConfig/templates.js +0 -26
  42. package/dist/cjs/defaultConfig/theme.js +0 -26
  43. package/dist/cjs/defaultConfig/timing.js +0 -68
  44. package/dist/cjs/defaultConfig/typography.js +0 -72
  45. package/dist/cjs/defaultConfig/unit.js +0 -28
  46. package/dist/cjs/package.json +0 -4
  47. package/dist/cjs/system/color.js +0 -1096
  48. package/dist/cjs/system/document.js +0 -906
  49. package/dist/cjs/system/font.js +0 -928
  50. package/dist/cjs/system/index.js +0 -2163
  51. package/dist/cjs/system/reset.js +0 -1018
  52. package/dist/cjs/system/shadow.js +0 -1305
  53. package/dist/cjs/system/spacing.js +0 -1257
  54. package/dist/cjs/system/svg.js +0 -1007
  55. package/dist/cjs/system/theme.js +0 -1197
  56. package/dist/cjs/system/timing.js +0 -1132
  57. package/dist/cjs/system/typography.js +0 -1243
  58. package/dist/cjs/tests/index.js +0 -30
  59. package/dist/cjs/transforms/index.js +0 -1534
  60. package/dist/cjs/utils/color.js +0 -336
  61. package/dist/cjs/utils/font.js +0 -69
  62. package/dist/cjs/utils/index.js +0 -1477
  63. package/dist/cjs/utils/sequence.js +0 -1125
  64. package/dist/cjs/utils/sprite.js +0 -554
  65. package/dist/cjs/utils/theme.js +0 -31
  66. package/dist/cjs/utils/unit.js +0 -28
  67. package/dist/cjs/utils/var.js +0 -967
package/dist/cjs/set.js CHANGED
@@ -1,13 +1,8 @@
1
1
  "use strict";
2
- var __create = Object.create;
3
2
  var __defProp = Object.defineProperty;
4
3
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
4
  var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
5
  var __hasOwnProp = Object.prototype.hasOwnProperty;
8
- var __commonJS = (cb, mod) => function __require() {
9
- return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
10
- };
11
6
  var __export = (target, all) => {
12
7
  for (var name in all)
13
8
  __defProp(target, name, { get: all[name], enumerable: true });
@@ -20,381 +15,7 @@ var __copyProps = (to, from, except, desc) => {
20
15
  }
21
16
  return to;
22
17
  };
23
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
24
- // If the importer is in node compatibility mode or this is not an ESM
25
- // file that has been converted to a CommonJS file using a Babel-
26
- // compatible transform (i.e. "__esModule" has not been set), then set
27
- // "default" to the CommonJS "module.exports" for node compatibility.
28
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
29
- mod
30
- ));
31
18
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
32
-
33
- // ../utils/dist/cjs/index.js
34
- var require_cjs = __commonJS({
35
- "../utils/dist/cjs/index.js"(exports, module2) {
36
- "use strict";
37
- var __defProp2 = Object.defineProperty;
38
- var __getOwnPropDesc2 = Object.getOwnPropertyDescriptor;
39
- var __getOwnPropNames2 = Object.getOwnPropertyNames;
40
- var __hasOwnProp2 = Object.prototype.hasOwnProperty;
41
- var __export2 = (target, all) => {
42
- for (var name in all)
43
- __defProp2(target, name, { get: all[name], enumerable: true });
44
- };
45
- var __copyProps2 = (to, from, except, desc) => {
46
- if (from && typeof from === "object" || typeof from === "function") {
47
- for (let key of __getOwnPropNames2(from))
48
- if (!__hasOwnProp2.call(to, key) && key !== except)
49
- __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
50
- }
51
- return to;
52
- };
53
- var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
54
- var index_exports = {};
55
- __export2(index_exports, {
56
- arrayzeValue: () => arrayzeValue3,
57
- copyJavaScriptToClipboard: () => copyJavaScriptToClipboard,
58
- copyStringToClipboard: () => copyStringToClipboard,
59
- fibonacciNumberByIndex: () => fibonacciNumberByIndex,
60
- findClosestNumber: () => findClosestNumber,
61
- findClosestNumberInFactory: () => findClosestNumberInFactory,
62
- formatDate: () => formatDate,
63
- isPhoto: () => isPhoto,
64
- loadCssFile: () => loadCssFile,
65
- loadJavascript: () => loadJavascript,
66
- loadJavascriptFile: () => loadJavascriptFile,
67
- loadJavascriptFileEmbedSync: () => loadJavascriptFileEmbedSync,
68
- loadJavascriptFileSync: () => loadJavascriptFileSync,
69
- removeChars: () => removeChars,
70
- toCamelCase: () => toCamelCase2,
71
- toDashCase: () => toDashCase2,
72
- toDescriptionCase: () => toDescriptionCase,
73
- toTitleCase: () => toTitleCase,
74
- toggleFullscreen: () => toggleFullscreen
75
- });
76
- module2.exports = __toCommonJS2(index_exports);
77
- var window22 = globalThis;
78
- var document22 = window22.document;
79
- var isObject2 = (arg) => {
80
- if (arg === null) return false;
81
- return typeof arg === "object" && arg.constructor === Object;
82
- };
83
- var isString2 = (arg) => typeof arg === "string";
84
- var isNumber2 = (arg) => typeof arg === "number";
85
- var isArray2 = (arg) => Array.isArray(arg);
86
- var STATE_METHODS3 = [
87
- "update",
88
- "parse",
89
- "clean",
90
- "create",
91
- "destroy",
92
- "add",
93
- "toggle",
94
- "remove",
95
- "apply",
96
- "set",
97
- "reset",
98
- "replace",
99
- "quietReplace",
100
- "quietUpdate",
101
- "applyReplace",
102
- "applyFunction",
103
- "keys",
104
- "values",
105
- "ref",
106
- "rootUpdate",
107
- "parentUpdate",
108
- "parent",
109
- "__element",
110
- "__depends",
111
- "__ref",
112
- "__children",
113
- "root",
114
- "setByPath",
115
- "setPathCollection",
116
- "removeByPath",
117
- "removePathCollection",
118
- "getByPath"
119
- ];
120
- var PROPS_METHODS3 = ["update", "__element"];
121
- var METHODS3 = [
122
- "set",
123
- "reset",
124
- "update",
125
- "remove",
126
- "updateContent",
127
- "removeContent",
128
- "lookup",
129
- "lookdown",
130
- "lookdownAll",
131
- "getRef",
132
- "getPath",
133
- "setNodeStyles",
134
- "spotByPath",
135
- "keys",
136
- "parse",
137
- "setProps",
138
- "parseDeep",
139
- "variables",
140
- "if",
141
- "log",
142
- "verbose",
143
- "warn",
144
- "error",
145
- "call",
146
- "nextElement",
147
- "previousElement"
148
- ];
149
- var METHODS_EXL3 = [
150
- ...["node", "context", "extends", "__element", "__ref"],
151
- ...METHODS3,
152
- ...STATE_METHODS3,
153
- ...PROPS_METHODS3
154
- ];
155
- var isMobile2 = (() => typeof navigator === "undefined" ? false : /Mobi/.test(navigator.userAgent))();
156
- var STATE_METHODS22 = [
157
- "update",
158
- "parse",
159
- "clean",
160
- "create",
161
- "destroy",
162
- "add",
163
- "toggle",
164
- "remove",
165
- "apply",
166
- "set",
167
- "reset",
168
- "replace",
169
- "quietReplace",
170
- "quietUpdate",
171
- "applyReplace",
172
- "applyFunction",
173
- "keys",
174
- "values",
175
- "ref",
176
- "rootUpdate",
177
- "parentUpdate",
178
- "parent",
179
- "__element",
180
- "__depends",
181
- "__ref",
182
- "__children",
183
- "root",
184
- "setByPath",
185
- "setPathCollection",
186
- "removeByPath",
187
- "removePathCollection",
188
- "getByPath"
189
- ];
190
- var PROPS_METHODS22 = ["update", "__element"];
191
- var METHODS22 = [
192
- "set",
193
- "reset",
194
- "update",
195
- "remove",
196
- "updateContent",
197
- "removeContent",
198
- "lookup",
199
- "lookdown",
200
- "lookdownAll",
201
- "getRef",
202
- "getPath",
203
- "setNodeStyles",
204
- "spotByPath",
205
- "keys",
206
- "parse",
207
- "setProps",
208
- "parseDeep",
209
- "variables",
210
- "if",
211
- "log",
212
- "verbose",
213
- "warn",
214
- "error",
215
- "call",
216
- "nextElement",
217
- "previousElement"
218
- ];
219
- var METHODS_EXL22 = [
220
- ...["node", "context", "extends", "__element", "__ref"],
221
- ...METHODS22,
222
- ...STATE_METHODS22,
223
- ...PROPS_METHODS22
224
- ];
225
- var window32 = globalThis;
226
- var document32 = window32.document;
227
- async function toggleFullscreen(opts) {
228
- if (!document.fullscreenElement) {
229
- try {
230
- await (this.node || document).requestFullscreen();
231
- } catch (err) {
232
- console.warn(`Error attempting to enable fullscreen mode: ${err.message} (${err.name})`);
233
- }
234
- } else {
235
- await document.exitFullscreen();
236
- }
237
- }
238
- var findClosestNumber = (number, arr) => {
239
- return (isArray2(arr) ? arr : Object.values(arr)).reduce((prev, curr) => {
240
- return Math.abs(curr - number) < Math.abs(prev - number) ? curr : prev;
241
- });
242
- };
243
- var findClosestNumberInFactory = (val, factory) => {
244
- val = parseFloat(val);
245
- if (isObject2(factory)) factory = Object.values(factory);
246
- return findClosestNumber(val, factory);
247
- };
248
- var formatDate = (timestamp) => {
249
- if (!timestamp) return "";
250
- const d = new Date(timestamp);
251
- const ye = new Intl.DateTimeFormat("en", { year: "numeric" }).format(d);
252
- const mo = new Intl.DateTimeFormat("en", { month: "short" }).format(d);
253
- const da = new Intl.DateTimeFormat("en", { day: "2-digit" }).format(d);
254
- return `${da} ${mo}, ${ye}`;
255
- };
256
- var fibonacciNumberByIndex = function fibonacciNumberByIndex2(n) {
257
- const fib = [0, 1];
258
- for (let i = 2; i <= n; i++) {
259
- fib[i] = fib[i - 1] + fib[i - 2];
260
- }
261
- return fib[n];
262
- };
263
- var loadJavascriptFile = (FILE_URL, async = false, doc = document, type = "text/javascript") => {
264
- return new Promise((resolve, reject) => {
265
- try {
266
- const scriptEle = doc.createElement("script");
267
- scriptEle.type = type;
268
- scriptEle.async = async;
269
- scriptEle.src = FILE_URL;
270
- scriptEle.addEventListener("load", (ev) => {
271
- resolve({
272
- status: true
273
- });
274
- });
275
- scriptEle.addEventListener("error", (ev) => {
276
- reject(new Error({
277
- status: false,
278
- message: `Failed to load the script ${FILE_URL}`
279
- }));
280
- });
281
- doc.body.appendChild(scriptEle);
282
- } catch (error) {
283
- reject(error);
284
- }
285
- });
286
- };
287
- var loadJavascriptFileSync = (fileUrl, doc = document, type = "text/javascript") => {
288
- return new Promise((resolve, reject) => {
289
- const scriptEle = doc.createElement("script");
290
- scriptEle.type = type;
291
- scriptEle.src = fileUrl;
292
- const blocker = doc.createElement("div");
293
- blocker.style.cssText = "position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,0.8);z-index:9999;";
294
- doc.body.appendChild(blocker);
295
- scriptEle.onload = () => {
296
- console.log(`Successfully loaded: ${fileUrl}`);
297
- doc.body.removeChild(blocker);
298
- resolve();
299
- };
300
- scriptEle.onerror = () => {
301
- doc.body.removeChild(blocker);
302
- reject(new Error(`Failed to load: ${fileUrl}`));
303
- };
304
- doc.body.appendChild(scriptEle);
305
- });
306
- };
307
- var loadJavascriptFileEmbedSync = (FILE_URL, doc = document, fallback, type = "text/javascript") => {
308
- const xhr = new window.XMLHttpRequest();
309
- xhr.open("GET", FILE_URL, false);
310
- xhr.send();
311
- if (xhr.status === 200) {
312
- const scriptEle = doc.createElement("script");
313
- scriptEle.type = type;
314
- scriptEle.text = xhr.responseText;
315
- doc.body.appendChild(scriptEle);
316
- if (typeof fallback === "function") fallback();
317
- } else {
318
- throw new Error(`Failed to load the script ${FILE_URL}`);
319
- }
320
- };
321
- var loadCssFile = (FILE_URL, async = false, doc = document, type = "text/javascript") => {
322
- return new Promise((resolve, reject) => {
323
- try {
324
- const linkElem = doc.createElement("link");
325
- linkElem.rel = "stylesheet";
326
- linkElem.href = FILE_URL;
327
- linkElem.addEventListener("load", (ev) => {
328
- resolve({
329
- status: true
330
- });
331
- });
332
- doc.head.appendChild(linkElem);
333
- } catch (error) {
334
- reject(error);
335
- }
336
- });
337
- };
338
- var loadJavascript = (body, async = false, doc = document, type = "text/javascript", id = "smbls-script") => {
339
- try {
340
- const scriptEle = doc.createElement("script");
341
- scriptEle.type = type;
342
- scriptEle.async = async;
343
- scriptEle.id = id;
344
- scriptEle.innerHTML = body;
345
- doc.body.appendChild(scriptEle);
346
- } catch (error) {
347
- console.warn(error);
348
- }
349
- };
350
- var isPhoto = (format) => ["jpeg", "gif", "jpg", "png", "tiff", "woff"].includes(format);
351
- var copyStringToClipboard = async (str) => {
352
- try {
353
- await navigator.clipboard.writeText(str);
354
- } catch (err) {
355
- console.warn("Failed to copy text: ", err);
356
- }
357
- };
358
- var copyJavaScriptToClipboard = async (jsCode) => {
359
- try {
360
- const blob = new Blob([jsCode], { type: "text/javascript" });
361
- const clipboardItem = new window.ClipboardItem({ "text/plain": blob });
362
- await navigator.clipboard.write([clipboardItem]);
363
- console.log("JavaScript code copied to clipboard as text/javascript");
364
- } catch (err) {
365
- console.error("Failed to copy JavaScript code: ", err);
366
- }
367
- };
368
- var removeChars = (str) => {
369
- return str.replace(/[^a-zA-Z0-9_]/g, "");
370
- };
371
- var toCamelCase2 = (str) => {
372
- return str.replace(/(?:^\w|[A-Z]|\b\w)/g, function(word, index) {
373
- return index === 0 ? word.toLowerCase() : word.toUpperCase();
374
- }).replaceAll(/\s+/g, "");
375
- };
376
- var toTitleCase = (str) => str && str.replace(
377
- /\w\S*/g,
378
- (txt) => {
379
- return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
380
- }
381
- );
382
- var toDashCase2 = (val) => val.replace(/[^a-zA-Z0-9]/g, " ").trim().toLowerCase().replace(/\s+/g, "-").replace(/-+/g, "-").replace(/^-|-$/g, "");
383
- var toDescriptionCase = (str = "") => {
384
- if (typeof str !== "string") return;
385
- const result = str.replace(/([A-Z])/g, " $1");
386
- return result.charAt(0).toUpperCase() + result.slice(1);
387
- };
388
- var arrayzeValue3 = (val) => {
389
- if (isArray2(val)) return val;
390
- if (isString2(val)) return val.split(" ");
391
- if (isObject2(val)) return Object.values(val);
392
- if (isNumber2(val)) return [val];
393
- };
394
- }
395
- });
396
-
397
- // src/set.js
398
19
  var set_exports = {};
399
20
  __export(set_exports, {
400
21
  VALUE_TRANSFORMERS: () => VALUE_TRANSFORMERS,
@@ -403,1584 +24,27 @@ __export(set_exports, {
403
24
  setValue: () => setValue
404
25
  });
405
26
  module.exports = __toCommonJS(set_exports);
406
-
407
- // ../../../domql/packages/utils/globals.js
408
- var window2 = globalThis;
409
- var document2 = window2.document;
410
-
411
- // ../../../domql/packages/utils/node.js
412
- var isDOMNode = (obj) => {
413
- return typeof window2 !== "undefined" && (obj instanceof window2.Node || obj instanceof window2.Window || obj === window2 || obj === document);
414
- };
415
-
416
- // ../../../domql/packages/utils/types.js
417
- var isObject = (arg) => {
418
- if (arg === null) return false;
419
- return typeof arg === "object" && arg.constructor === Object;
420
- };
421
- var isString = (arg) => typeof arg === "string";
422
- var isNumber = (arg) => typeof arg === "number";
423
- var isFunction = (arg) => typeof arg === "function";
424
- var isNull = (arg) => arg === null;
425
- var isArray = (arg) => Array.isArray(arg);
426
- var isObjectLike = (arg) => {
427
- if (arg === null) return false;
428
- return typeof arg === "object";
429
- };
430
- var isUndefined = (arg) => {
431
- return arg === void 0;
432
- };
433
-
434
- // ../../../domql/packages/utils/array.js
435
- var unstackArrayOfObjects = (arr, exclude = []) => {
436
- return arr.reduce(
437
- (a, c) => deepMerge(a, deepClone(c, { exclude }), exclude),
438
- {}
439
- );
440
- };
441
-
442
- // ../../../domql/packages/utils/keys.js
443
- var STATE_METHODS = [
444
- "update",
445
- "parse",
446
- "clean",
447
- "create",
448
- "destroy",
449
- "add",
450
- "toggle",
451
- "remove",
452
- "apply",
453
- "set",
454
- "reset",
455
- "replace",
456
- "quietReplace",
457
- "quietUpdate",
458
- "applyReplace",
459
- "applyFunction",
460
- "keys",
461
- "values",
462
- "ref",
463
- "rootUpdate",
464
- "parentUpdate",
465
- "parent",
466
- "__element",
467
- "__depends",
468
- "__ref",
469
- "__children",
470
- "root",
471
- "setByPath",
472
- "setPathCollection",
473
- "removeByPath",
474
- "removePathCollection",
475
- "getByPath"
476
- ];
477
- var PROPS_METHODS = ["update", "__element"];
478
- var METHODS = [
479
- "set",
480
- "reset",
481
- "update",
482
- "remove",
483
- "updateContent",
484
- "removeContent",
485
- "lookup",
486
- "lookdown",
487
- "lookdownAll",
488
- "getRef",
489
- "getPath",
490
- "setNodeStyles",
491
- "spotByPath",
492
- "keys",
493
- "parse",
494
- "setProps",
495
- "parseDeep",
496
- "variables",
497
- "if",
498
- "log",
499
- "verbose",
500
- "warn",
501
- "error",
502
- "call",
503
- "nextElement",
504
- "previousElement"
505
- ];
506
- var METHODS_EXL = [
507
- ...["node", "context", "extends", "__element", "__ref"],
508
- ...METHODS,
509
- ...STATE_METHODS,
510
- ...PROPS_METHODS
511
- ];
512
-
513
- // ../../../domql/packages/utils/object.js
514
- var merge = (element, obj, excludeFrom = []) => {
515
- for (const e in obj) {
516
- const hasOwnProperty = Object.prototype.hasOwnProperty.call(obj, e);
517
- if (!hasOwnProperty || excludeFrom.includes(e) || e.startsWith("__")) {
518
- continue;
519
- }
520
- const elementProp = element[e];
521
- const objProp = obj[e];
522
- if (elementProp === void 0) {
523
- element[e] = objProp;
524
- }
525
- }
526
- return element;
527
- };
528
- var deepMerge = (element, extend, excludeFrom = METHODS_EXL) => {
529
- for (const e in extend) {
530
- const hasOwnProperty = Object.prototype.hasOwnProperty.call(extend, e);
531
- if (!hasOwnProperty || excludeFrom.includes(e) || e.startsWith("__")) {
532
- continue;
533
- }
534
- const elementProp = element[e];
535
- const extendProp = extend[e];
536
- if (isObjectLike(elementProp) && isObjectLike(extendProp)) {
537
- deepMerge(elementProp, extendProp, excludeFrom);
538
- } else if (elementProp === void 0) {
539
- element[e] = extendProp;
540
- }
541
- }
542
- return element;
543
- };
544
- var deepClone = (obj, options = {}) => {
545
- const {
546
- exclude = [],
547
- cleanUndefined = false,
548
- cleanNull = false,
549
- window: targetWindow,
550
- visited = /* @__PURE__ */ new WeakMap(),
551
- handleExtends = false
552
- } = options;
553
- if (!isObjectLike(obj) || isDOMNode(obj)) {
554
- return obj;
555
- }
556
- if (visited.has(obj)) {
557
- return visited.get(obj);
558
- }
559
- const clone = targetWindow ? isArray(obj) ? new targetWindow.Array() : new targetWindow.Object() : isArray(obj) ? [] : {};
560
- visited.set(obj, clone);
561
- for (const key in obj) {
562
- if (!Object.prototype.hasOwnProperty.call(obj, key)) continue;
563
- if (exclude.includes(key) || key.startsWith("__") || key === "__proto__") {
564
- continue;
565
- }
566
- const value = obj[key];
567
- if (cleanUndefined && isUndefined(value) || cleanNull && isNull(value)) {
568
- continue;
569
- }
570
- if (isDOMNode(value)) {
571
- clone[key] = value;
572
- continue;
573
- }
574
- if (handleExtends && key === "extends" && isArray(value)) {
575
- clone[key] = unstackArrayOfObjects(value, exclude);
576
- continue;
577
- }
578
- if (isFunction(value) && targetWindow) {
579
- clone[key] = targetWindow.eval("(" + value.toString() + ")");
580
- continue;
581
- }
582
- if (isObjectLike(value)) {
583
- clone[key] = deepClone(value, {
584
- ...options,
585
- visited
586
- });
587
- } else {
588
- clone[key] = value;
589
- }
590
- }
591
- return clone;
592
- };
593
- var overwriteDeep = (obj, params, opts = {}, visited = /* @__PURE__ */ new WeakMap()) => {
594
- const excl = opts.exclude || [];
595
- const forcedExclude = opts.preventForce ? [] : ["node", "window"];
596
- if (!isObjectLike(obj) || !isObjectLike(params) || isDOMNode(obj) || isDOMNode(params)) {
597
- return params;
598
- }
599
- if (visited.has(obj)) return visited.get(obj);
600
- visited.set(obj, obj);
601
- for (const e in params) {
602
- if (!Object.hasOwnProperty.call(params, e)) continue;
603
- if (excl.includes(e) || forcedExclude && e.startsWith("__")) continue;
604
- const objProp = obj[e];
605
- const paramsProp = params[e];
606
- if (isDOMNode(paramsProp)) {
607
- obj[e] = paramsProp;
608
- } else if (isObjectLike(objProp) && isObjectLike(paramsProp)) {
609
- obj[e] = overwriteDeep(objProp, paramsProp, opts, visited);
610
- } else if (paramsProp !== void 0) {
611
- obj[e] = paramsProp;
612
- }
613
- }
614
- return obj;
615
- };
616
-
617
- // ../../../domql/packages/utils/cookie.js
618
- var isMobile = (() => typeof navigator === "undefined" ? false : /Mobi/.test(navigator.userAgent))();
619
-
620
- // ../../../domql/packages/event/dist/esm/keys.js
621
- var STATE_METHODS2 = [
622
- "update",
623
- "parse",
624
- "clean",
625
- "create",
626
- "destroy",
627
- "add",
628
- "toggle",
629
- "remove",
630
- "apply",
631
- "set",
632
- "reset",
633
- "replace",
634
- "quietReplace",
635
- "quietUpdate",
636
- "applyReplace",
637
- "applyFunction",
638
- "keys",
639
- "values",
640
- "ref",
641
- "rootUpdate",
642
- "parentUpdate",
643
- "parent",
644
- "__element",
645
- "__depends",
646
- "__ref",
647
- "__children",
648
- "root",
649
- "setByPath",
650
- "setPathCollection",
651
- "removeByPath",
652
- "removePathCollection",
653
- "getByPath"
654
- ];
655
- var PROPS_METHODS2 = ["update", "__element"];
656
- var METHODS2 = [
657
- "set",
658
- "reset",
659
- "update",
660
- "remove",
661
- "updateContent",
662
- "removeContent",
663
- "lookup",
664
- "lookdown",
665
- "lookdownAll",
666
- "getRef",
667
- "getPath",
668
- "setNodeStyles",
669
- "spotByPath",
670
- "keys",
671
- "parse",
672
- "setProps",
673
- "parseDeep",
674
- "variables",
675
- "if",
676
- "log",
677
- "verbose",
678
- "warn",
679
- "error",
680
- "call",
681
- "nextElement",
682
- "previousElement"
683
- ];
684
- var METHODS_EXL2 = [
685
- ...["node", "context", "extends", "__element", "__ref"],
686
- ...METHODS2,
687
- ...STATE_METHODS2,
688
- ...PROPS_METHODS2
689
- ];
690
-
691
- // ../../../domql/packages/event/dist/esm/globals.js
692
- var window3 = globalThis;
693
- var document3 = window3.document;
694
-
695
- // src/defaultConfig/index.js
696
- var defaultConfig_exports = {};
697
- __export(defaultConfig_exports, {
698
- ANIMATION: () => ANIMATION,
699
- BREAKPOINTS: () => BREAKPOINTS,
700
- CASES: () => CASES,
701
- CLASS: () => CLASS,
702
- COLOR: () => COLOR,
703
- DEVICES: () => DEVICES,
704
- DOCUMENT: () => DOCUMENT,
705
- FONT: () => FONT,
706
- FONT_FACE: () => FONT_FACE,
707
- FONT_FAMILY: () => FONT_FAMILY,
708
- FONT_FAMILY_TYPES: () => FONT_FAMILY_TYPES,
709
- GRADIENT: () => GRADIENT,
710
- GRID: () => GRID,
711
- ICONS: () => ICONS,
712
- MEDIA: () => MEDIA,
713
- RESET: () => RESET,
714
- SEMANTIC_ICONS: () => SEMANTIC_ICONS,
715
- SEQUENCE: () => SEQUENCE,
716
- SHADOW: () => SHADOW,
717
- SPACING: () => SPACING,
718
- SVG: () => SVG,
719
- SVG_DATA: () => SVG_DATA,
720
- TEMPLATES: () => TEMPLATES,
721
- THEME: () => THEME,
722
- TIMING: () => TIMING,
723
- TYPOGRAPHY: () => TYPOGRAPHY,
724
- UNIT: () => UNIT
725
- });
726
-
727
- // src/defaultConfig/sequence.js
728
- var SEQUENCE = {
729
- "minor-second": 1.067,
730
- "major-second": 1.125,
731
- "minor-third": 1.2,
732
- "major-third": 1.25,
733
- "perfect-fourth": 1.333,
734
- "augmented-fourth": 1.414,
735
- "perfect-fifth": 1.5,
736
- "minor-sixth": 1.6,
737
- phi: 1.618,
738
- // golden-ratio
739
- "major-sixth": 1.667,
740
- "square-root-3": 1.732,
741
- // theodorus
742
- "minor-seventh": 1.778,
743
- "major-seventh": 1.875,
744
- octave: 2,
745
- "square-root-5": 2.23,
746
- // pythagoras
747
- "major-tenth": 2.5,
748
- "major-eleventh": 2.667,
749
- "major-twelfth": 3,
750
- pi: 3.14,
751
- // archimedes
752
- "double-octave": 4
753
- };
754
-
755
- // src/defaultConfig/unit.js
756
- var UNIT = {
757
- default: "em"
758
- };
759
-
760
- // src/defaultConfig/typography.js
761
- var defaultProps = {
762
- browserDefault: 16,
763
- base: 16,
764
- type: "font-size",
765
- ratio: SEQUENCE["minor-third"],
766
- range: [-3, 12],
767
- h1Matches: 6,
768
- lineHeight: 1.5,
769
- subSequence: true,
770
- mediaRegenerate: false,
771
- unit: "em",
772
- templates: {},
773
- sequence: {},
774
- scales: {},
775
- vars: {}
776
- };
777
- var TYPOGRAPHY = defaultProps;
778
-
779
- // src/defaultConfig/font.js
780
- var FONT = {};
781
-
782
- // src/defaultConfig/font-family.js
783
- var FONT_FAMILY = {};
784
- var FONT_FAMILY_TYPES = {
785
- "sans-serif": "Helvetica, Arial, sans-serif, --system-default",
786
- serif: "Times New Roman, Georgia, serif, --system-default",
787
- monospace: "Courier New, monospace, --system-default"
788
- };
789
- var FONT_FACE = {};
790
-
791
- // src/defaultConfig/media.js
792
- var MEDIA = {
793
- tv: "(min-width: 2780px)",
794
- light: "(prefers-color-scheme: light)",
795
- dark: "(prefers-color-scheme: dark)",
796
- print: "print"
797
- };
798
-
799
- // src/defaultConfig/spacing.js
800
- var defaultProps2 = {
801
- base: TYPOGRAPHY.base,
802
- type: "spacing",
803
- ratio: SEQUENCE.phi,
804
- range: [-5, 15],
805
- subSequence: true,
806
- mediaRegenerate: false,
807
- unit: "em",
808
- sequence: {},
809
- scales: {},
810
- vars: {}
811
- };
812
- var SPACING = defaultProps2;
813
-
814
- // src/defaultConfig/color.js
815
- var COLOR = {};
816
- var GRADIENT = {};
817
-
818
- // src/defaultConfig/theme.js
819
- var THEME = {};
820
-
821
- // src/defaultConfig/shadow.js
822
- var SHADOW = {};
823
-
824
- // src/defaultConfig/icons.js
825
- var ICONS = {};
826
- var SEMANTIC_ICONS = {};
827
-
828
- // src/defaultConfig/timing.js
829
- var defaultProps3 = {
830
- default: 150,
831
- base: 150,
832
- type: "timing",
833
- ratio: SEQUENCE["perfect-fourth"],
834
- range: [-3, 12],
835
- mediaRegenerate: false,
836
- unit: "ms",
837
- sequence: {},
838
- scales: {},
839
- vars: {}
840
- };
841
- var TIMING = defaultProps3;
842
-
843
- // src/defaultConfig/document.js
844
- var DOCUMENT = {};
845
-
846
- // src/defaultConfig/responsive.js
847
- var BREAKPOINTS = {
848
- screenL: 1920,
849
- screenM: 1680,
850
- screenS: 1440,
851
- tabletL: 1366,
852
- tabletM: 1280,
853
- tabletS: 1024,
854
- mobileL: 768,
855
- mobileM: 560,
856
- mobileS: 480,
857
- mobileXS: 375
858
- };
859
- var DEVICES = {
860
- screenXXL: [2560, 1440],
861
- screenXL: [2240, 1260],
862
- screenL: [1920, 1024],
863
- screenM: [1680, 1024],
864
- screenS: [1440, 720],
865
- tabletL: [1366, 926],
866
- tabletM: [1280, 768],
867
- tabletS: [1024, 768],
868
- mobileL: [768, 375],
869
- mobileM: [560, 768],
870
- mobileS: [480, 768],
871
- mobileXS: [375, 768]
872
- };
873
-
874
- // src/defaultConfig/cases.js
875
- var CASES = {};
876
-
877
- // src/defaultConfig/animation.js
878
- var ANIMATION = {};
879
-
880
- // src/defaultConfig/svg.js
881
- var SVG = {};
882
- var SVG_DATA = {};
883
-
884
- // src/defaultConfig/templates.js
885
- var TEMPLATES = {};
886
-
887
- // src/defaultConfig/grid.js
888
- var defaultProps4 = {};
889
- var GRID = defaultProps4;
890
-
891
- // src/defaultConfig/class.js
892
- var defaultProps5 = {};
893
- var CLASS = defaultProps5;
894
-
895
- // src/defaultConfig/index.js
896
- var RESET = {};
897
-
898
- // src/factory.js
899
- var CSS_VARS = {};
900
- var CONFIG = {
901
- verbose: false,
902
- useVariable: true,
903
- useReset: true,
904
- CSS_VARS,
905
- ...void 0 || defaultConfig_exports
906
- };
907
- var cachedConfig = deepClone(CONFIG);
908
- var FACTORY = {
909
- active: "0",
910
- 0: CONFIG
911
- };
912
- var getActiveConfig = (def) => {
913
- return FACTORY[def || FACTORY.active] || CONFIG;
914
- };
915
- var setActiveConfig = (newConfig) => {
916
- if (!isObject(newConfig)) return;
917
- FACTORY.active = "1";
918
- FACTORY["1"] = deepMerge(newConfig, deepClone(cachedConfig));
919
- return newConfig;
920
- };
921
-
922
- // src/utils/unit.js
923
- var isScalingUnit = (unit) => {
924
- return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
925
- };
926
-
927
- // src/utils/color.js
928
- var colorStringToRgbaArray = (color) => {
929
- if (color === "") return [0, 0, 0, 0];
930
- if (color.toLowerCase() === "transparent") return [0, 0, 0, 0];
931
- if (color[0] === "#") {
932
- if (color.length < 7) {
933
- color = "#" + color[1] + color[1] + color[2] + color[2] + color[3] + color[3] + (color.length > 4 ? color[4] + color[4] : "");
934
- }
935
- return [
936
- parseInt(color.substr(1, 2), 16),
937
- parseInt(color.substr(3, 2), 16),
938
- parseInt(color.substr(5, 2), 16),
939
- color.length > 7 ? parseInt(color.substr(7, 2), 16) / 255 : 1
940
- ];
941
- }
942
- if (color.indexOf("rgb") === -1) {
943
- if (document2 && window2) {
944
- const elem = document2.body.appendChild(document2.createElement("fictum"));
945
- const flag = "rgb(1, 2, 3)";
946
- elem.style.color = flag;
947
- if (elem.style.color !== flag) {
948
- document2.body.removeChild(elem);
949
- return;
950
- }
951
- elem.style.color = color;
952
- if (elem.style.color === flag || elem.style.color === "") {
953
- document2.body.removeChild(elem);
954
- return [0, 0, 0, 0];
955
- }
956
- color = window2.getComputedStyle(elem).color;
957
- document2.body.removeChild(elem);
958
- }
959
- }
960
- if (color.indexOf("rgb") === 0) {
961
- if (color.indexOf("rgba") === -1) color = `${color}, 1`;
962
- return color.match(/[\.\d]+/g).map((a) => +a);
963
- }
964
- return [0, 0, 0, 0];
965
- };
966
- var hexToRgbArray = (hex, alpha = 1) => {
967
- const [r, g, b] = hex.match(/\w\w/g).map((x) => parseInt(x, 16));
968
- return [r, g, b];
969
- };
970
- var rgbArrayToHex = ([r, g, b]) => {
971
- return ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
972
- };
973
- var rgbToHSL = (r, g, b) => {
974
- const a = Math.max(r, g, b);
975
- const n = a - Math.min(r, g, b);
976
- const f = 1 - Math.abs(a + a - n - 1);
977
- const h = n && (a == r ? (g - b) / n : a == g ? 2 + (b - r) / n : 4 + (r - g) / n);
978
- return [60 * (h < 0 ? h + 6 : h), f ? n / f : 0, (a + a - n) / 2];
979
- };
980
- var hslToRgb = (h, s, l, a = s * Math.min(l, 1 - l), f = (n, k = (n + h / 30) % 12) => l - a * Math.max(
981
- Math.min(k - 3, 9 - k, 1),
982
- -1
983
- )) => [f(0), f(8), f(4)];
984
- var getColorShade = (col, amt) => {
985
- const num = parseInt(col, 16);
986
- let r = (num >> 16) + amt;
987
- if (r > 255) r = 255;
988
- else if (r < 0) r = 0;
989
- let b = (num >> 8 & 255) + amt;
990
- if (b > 255) b = 255;
991
- else if (b < 0) b = 0;
992
- let g = (num & 255) + amt;
993
- if (g > 255) g = 255;
994
- else if (g < 0) g = 0;
995
- return ((g | b << 8 | r << 16) + 16777216).toString(16).slice(1);
996
- };
997
- var getRgbTone = (rgb, tone) => {
998
- if (isString(rgb) && rgb.includes("rgb")) rgb = colorStringToRgbaArray(rgb).join(", ");
999
- if (isString(rgb)) rgb = rgb.split(",").map((v) => parseFloat(v.trim()));
1000
- if (isNumber(tone)) tone += "";
1001
- const toHex = rgbArrayToHex(rgb);
1002
- const abs = tone.slice(0, 1);
1003
- if (abs === "-" || abs === "+") {
1004
- const colorShade = getColorShade(toHex, parseFloat(tone));
1005
- return hexToRgbArray(colorShade).join(", ");
1006
- } else {
1007
- const [r, g, b] = rgb;
1008
- const hsl = rgbToHSL(r, g, b);
1009
- const [h, s, l] = hsl;
1010
- const newRgb = hslToRgb(h, s, parseFloat(tone) / 100 * 255);
1011
- return newRgb;
1012
- }
1013
- };
1014
-
1015
- // src/utils/font.js
1016
- var getDefaultOrFirstKey = (LIBRARY, key) => {
1017
- if (LIBRARY[key]) return LIBRARY[key].value;
1018
- if (LIBRARY.default) return LIBRARY[LIBRARY.default].value;
1019
- const hasValue = Object.keys(LIBRARY)[0];
1020
- return hasValue && LIBRARY[hasValue] && LIBRARY[hasValue].value;
1021
- };
1022
- var getFontFormat = (url) => url.split(/[#?]/)[0].split(".").pop().trim();
1023
- var setCustomFont = (name, url, weight) => `
1024
- font-family: '${name}';
1025
- font-style: normal;
1026
- ${weight && `font-weight: ${weight};`}
1027
- src: url('${url}') format('${getFontFormat(url)}');`;
1028
- var setCustomFontMedia = (name, url, weight) => `@font-face {
1029
- ${setCustomFont(name, url, weight)}
1030
- }`;
1031
- var getFontFaceEach = (name, weights) => {
1032
- const keys = Object.keys(weights);
1033
- return keys.map((key) => {
1034
- const { url, fontWeight } = weights[key];
1035
- return setCustomFont(name, url, fontWeight);
1036
- });
1037
- };
1038
-
1039
- // src/utils/sequence.js
1040
- var import_utils5 = __toESM(require_cjs(), 1);
1041
- var numToLetterMap = {
1042
- "-6": "U",
1043
- "-5": "V",
1044
- "-4": "W",
1045
- "-3": "X",
1046
- "-2": "Y",
1047
- "-1": "Z",
1048
- 0: "A",
1049
- 1: "B",
1050
- 2: "C",
1051
- 3: "D",
1052
- 4: "E",
1053
- 5: "F",
1054
- 6: "G",
1055
- 7: "H",
1056
- 8: "I",
1057
- 9: "J",
1058
- 10: "K",
1059
- 11: "L",
1060
- 12: "M",
1061
- 13: "N",
1062
- 14: "O",
1063
- 15: "P",
1064
- 16: "Q",
1065
- 17: "R",
1066
- 18: "S",
1067
- 19: "T"
1068
- };
1069
- var setSequenceValue = (props, sequenceProps) => {
1070
- const { key, variable, value, scaling, index, scalingVariable } = props;
1071
- sequenceProps.sequence[key] = {
1072
- key,
1073
- decimal: ~~(value * 100) / 100,
1074
- val: ~~value,
1075
- scaling,
1076
- index,
1077
- scalingVariable,
1078
- variable
1079
- };
1080
- sequenceProps.scales[key] = scaling;
1081
- sequenceProps.vars[variable] = scaling + sequenceProps.unit;
1082
- };
1083
- var setScalingVar = (key, sequenceProps) => {
1084
- const { base, type, unit } = sequenceProps;
1085
- const defaultVal = (isScalingUnit(unit) ? 1 : base) + unit;
1086
- if (key === 0) return defaultVal;
1087
- const prefix = "--" + (type && type.replace(".", "-"));
1088
- const ratioVar = `${prefix}-ratio`;
1089
- if (key > 0) {
1090
- const prevLetterKey = numToLetterMap[key - 1];
1091
- return `calc(var(${prefix}-${prevLetterKey}) * var(${ratioVar}))`;
1092
- }
1093
- if (key < 0) {
1094
- const nextLetterKey = numToLetterMap[key + 1];
1095
- return `calc(var(${prefix}-${nextLetterKey}) / var(${ratioVar}))`;
1096
- }
1097
- };
1098
- var setSubScalingVar = (index, arr, variable, sequenceProps) => {
1099
- const { type } = sequenceProps;
1100
- const skipMiddle = index === 2 && arr.length === 2;
1101
- const indexMapWithLength = skipMiddle ? index + 1 : index;
1102
- const prefix = "--" + (type && type.replace(".", "-"));
1103
- const subRatioVarPrefix = `${prefix}-sub-ratio-`;
1104
- return `calc(var(${variable}) * var(${subRatioVarPrefix + indexMapWithLength}))`;
1105
- };
1106
- var getSubratioDifference = (base, ratio) => {
1107
- const diff = base * ratio - base;
1108
- const subRatio = diff / 1.618;
1109
- const first = base * ratio - subRatio;
1110
- const second = base + subRatio;
1111
- const middle = (first + second) / 2;
1112
- return [first, middle, second];
1113
- };
1114
- var getSubratio = (base, ratio) => {
1115
- return getSubratioDifference(base, ratio).map((v) => v / base);
1116
- };
1117
- var generateSubSequence = (props, sequenceProps) => {
1118
- const { key, base, value, ratio, variable, index } = props;
1119
- const next = value * ratio;
1120
- const diffRounded = ~~next - ~~value;
1121
- let arr;
1122
- const [first, middle, second] = getSubratioDifference(value, ratio);
1123
- if (diffRounded > 16) arr = [first, middle, second];
1124
- else arr = [first, second];
1125
- arr.forEach((v, k) => {
1126
- const scaling = ~~(v / base * 1e3) / 1e3;
1127
- const newVar = variable + (k + 1);
1128
- const newIndex = index + (k + 1) / 10;
1129
- const scalingVariable = setSubScalingVar(k + 1, arr, variable, sequenceProps);
1130
- const props2 = {
1131
- key: key + (k + 1),
1132
- variable: newVar,
1133
- value: v,
1134
- scaling,
1135
- scalingVariable,
1136
- index: newIndex
1137
- };
1138
- setSequenceValue(props2, sequenceProps);
1139
- });
1140
- };
1141
- var switchSequenceOnNegative = (key, base, ratio) => {
1142
- return base * Math.pow(ratio, key);
1143
- };
1144
- var generateSequence = (sequenceProps) => {
1145
- const { type, base, ratio, range, subSequence } = sequenceProps;
1146
- const n = Math.abs(range[0]) + Math.abs(range[1]);
1147
- const prefix = "--" + (type && type.replace(".", "-")) + "-";
1148
- for (let i = 0; i <= n; i++) {
1149
- const key = range[1] - i;
1150
- const letterKey = numToLetterMap[key];
1151
- const value = switchSequenceOnNegative(key, base, ratio);
1152
- const scaling = ~~(value / base * 100) / 100;
1153
- const variable = prefix + letterKey;
1154
- const scalingVariable = setScalingVar(key, sequenceProps);
1155
- const props = {
1156
- key: letterKey,
1157
- variable,
1158
- value,
1159
- base,
1160
- scaling,
1161
- scalingVariable,
1162
- ratio,
1163
- index: key
1164
- };
1165
- setSequenceValue(props, sequenceProps);
1166
- if (subSequence) generateSubSequence(props, sequenceProps);
1167
- }
1168
- return sequenceProps;
1169
- };
1170
- var getSequenceValue = (value = "A", sequenceProps) => {
1171
- const CONFIG2 = getActiveConfig();
1172
- const { UNIT: UNIT2 } = CONFIG2;
1173
- const {
1174
- sequence,
1175
- unit = UNIT2.default,
1176
- useVariable
1177
- } = sequenceProps;
1178
- if (isString(value) && value.slice(0, 2) === "--") return `var(${value})`;
1179
- const prefix = `--${(0, import_utils5.toDashCase)(sequenceProps.type.replace(".", "-"))}-`;
1180
- const startsWithDashOrLetterRegex = /^-?[a-zA-Z]/i;
1181
- const startsWithDashOrLetter = startsWithDashOrLetterRegex.test(value);
1182
- if (value === "none" || value === "auto" || value === "unset" || value === "inherit" || value === "fit-content" || value === "min-content" || value === "max-content" || value.includes("calc") || value.includes("var") || !startsWithDashOrLetter) return value;
1183
- const letterVal = value.toUpperCase();
1184
- const isNegative = letterVal.slice(0, 1) === "-" ? "-" : "";
1185
- let absValue = isNegative ? letterVal.slice(1) : letterVal;
1186
- let mediaName = "";
1187
- if (absValue.includes("_")) {
1188
- mediaName = "_" + absValue.split("_")[1].toLowerCase();
1189
- absValue = absValue.split("_")[0];
1190
- }
1191
- const varValue = (v) => startsWithDashOrLetterRegex.test(v) ? `var(${prefix}${v}${mediaName})` : v;
1192
- if (absValue.includes("+")) {
1193
- const [first, second] = absValue.split("+");
1194
- const joint = `${varValue(first)} + ${varValue(second)}`;
1195
- return isNegative ? `calc((${joint}) * -1)` : `calc(${joint})`;
1196
- } else if (absValue.includes("*")) {
1197
- const [first, second] = absValue.split("*");
1198
- const joint = `${varValue(first)} * ${varValue(second)}`;
1199
- return isNegative ? `calc((${joint}) * -1)` : `calc(${joint})`;
1200
- } else if (absValue.includes("-")) {
1201
- const [first, second] = absValue.split("-");
1202
- const joint = `${varValue(first)} - ${varValue(second)}`;
1203
- return isNegative ? `calc((${joint}) * -1)` : `calc(${joint})`;
1204
- }
1205
- if (!sequence[absValue] && absValue.length === 2) {
1206
- if (CONFIG2.verbose) console.warn(absValue, "- value is not found because `subSequence` is set to false");
1207
- absValue = absValue.slice(0, 1);
1208
- }
1209
- if (useVariable || CONFIG2.useVariable) {
1210
- const varValue2 = `var(${prefix}${absValue}${mediaName})`;
1211
- return isNegative ? `calc(${varValue2} * -1)` : varValue2;
1212
- }
1213
- const sequenceItem = sequence ? sequence[absValue] : null;
1214
- if (!sequenceItem) return console.warn("can't find", sequence, absValue);
1215
- if (unit === "ms" || unit === "s") {
1216
- return isNegative + sequenceItem.val + unit;
1217
- }
1218
- return isNegative + sequenceItem.scaling + unit;
1219
- };
1220
- var getSequenceValuePropertyPair = (value, propertyName, sequenceProps) => {
1221
- if (typeof value !== "string") {
1222
- const CONFIG2 = getActiveConfig();
1223
- if (CONFIG2.verbose) console.warn(propertyName, value, "is not a string");
1224
- return { [propertyName]: value };
1225
- }
1226
- if (value === "-" || value === "") return {};
1227
- return { [propertyName]: getSequenceValue(value, sequenceProps) };
1228
- };
1229
- var findHeadingLetter = (h1Matches, index) => numToLetterMap[h1Matches - index];
1230
- var findHeadings = (propertyNames) => {
1231
- const { h1Matches, sequence } = propertyNames;
1232
- return new Array(6).fill(null).map((_, i) => {
1233
- const findLetter = findHeadingLetter(h1Matches, i);
1234
- return sequence[findLetter];
1235
- });
1236
- };
1237
-
1238
- // src/utils/var.js
1239
- var applySequenceGlobalVars = (vars, obj, options) => {
1240
- const CONFIG2 = getActiveConfig();
1241
- const { UNIT: UNIT2 } = CONFIG2;
1242
- const unit = obj.unit || UNIT2.default;
1243
- const { base, ratio, type } = obj;
1244
- const prefix = "--" + (type && type.replace(".", "-"));
1245
- vars[`${prefix}-base`] = base;
1246
- vars[`${prefix}-unit`] = unit;
1247
- const ratioVar = `${prefix}-ratio`;
1248
- vars[ratioVar] = ratio;
1249
- const [first, middle, second] = getSubratio(base, ratio);
1250
- vars[`${prefix}-sub-ratio-1`] = `calc(var(${prefix}-ratio) * ${first / ratio})`;
1251
- vars[`${prefix}-sub-ratio-2`] = `calc(var(${prefix}-ratio) * ${middle / ratio})`;
1252
- vars[`${prefix}-sub-ratio-3`] = `calc(var(${prefix}-ratio) * ${second / ratio})`;
1253
- };
1254
- var applySequenceVars = (FACTORY2, options = {}) => {
1255
- const CONFIG2 = getActiveConfig();
1256
- const { UNIT: UNIT2, TIMING: TIMING2, CSS_VARS: CSS_VARS2 } = CONFIG2;
1257
- const unit = FACTORY2.unit || UNIT2.default;
1258
- const { mediaRegenerate, sequence, scales } = FACTORY2;
1259
- if (!mediaRegenerate) {
1260
- applySequenceGlobalVars(CSS_VARS2, FACTORY2, options);
1261
- }
1262
- for (const key in sequence) {
1263
- const item = sequence[key];
1264
- const value = (FACTORY2.type === TIMING2.type ? sequence[key].val : scales[key]) + unit;
1265
- if (!mediaRegenerate) {
1266
- CSS_VARS2[item.variable + "_default"] = value;
1267
- CSS_VARS2[item.variable] = item.scalingVariable;
1268
- continue;
1269
- }
1270
- if (options.useDefault === false) {
1271
- CSS_VARS2[item.variable] = value;
1272
- } else {
1273
- CSS_VARS2[item.variable + "_default"] = value;
1274
- CSS_VARS2[item.variable] = `var(${item.variable + "_default"})`;
1275
- }
1276
- }
1277
- };
1278
- var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
1279
- const CONFIG2 = getActiveConfig();
1280
- const { UNIT: UNIT2, MEDIA: MEDIA2, CSS_VARS: CSS_VARS2 } = CONFIG2;
1281
- const mediaName = media.slice(1);
1282
- const unit = FACTORY2.unit || UNIT2.default;
1283
- const { mediaRegenerate } = FACTORY2;
1284
- const { sequence, scales } = FACTORY2[media];
1285
- const query = MEDIA2[mediaName];
1286
- if (!query && CONFIG2.verbose) console.warn("Can't find media query ", query);
1287
- if (!mediaRegenerate) {
1288
- let underMediaQuery = CSS_VARS2[`@media ${query}`];
1289
- if (!underMediaQuery) underMediaQuery = CSS_VARS2[`@media ${query}`] = {};
1290
- applySequenceGlobalVars(underMediaQuery, FACTORY2[media], options);
1291
- return;
1292
- }
1293
- for (const key in sequence) {
1294
- const item = sequence[key];
1295
- const value = (isScalingUnit(unit) ? scales[key] : sequence[key].val) + unit;
1296
- if (!query && CONFIG2.verbose) console.warn("Can't find query ", query);
1297
- let underMediaQuery = CSS_VARS2[`@media ${query}`];
1298
- if (!underMediaQuery) underMediaQuery = CSS_VARS2[`@media ${query}`] = {};
1299
- underMediaQuery[item.variable] = `var(${item.variable + "_" + mediaName})`;
1300
- CSS_VARS2[item.variable + "_" + mediaName] = value;
1301
- }
1302
- };
1303
-
1304
- // src/utils/sprite.js
1305
- var ENV = "development";
1306
- var isDev = ENV === "development" || ENV === "testing";
1307
- var parseRootAttributes = (htmlString) => {
1308
- const val = htmlString.default || htmlString;
1309
- if (!isString(val)) {
1310
- if (isDev) console.warn("parseRootAttributes:", val, "is not a string");
1311
- return;
1312
- }
1313
- const match = val.match(/<svg\s+(.*?)>/);
1314
- if (!match || !match[1]) {
1315
- return {};
1316
- }
1317
- const attrString = match[1];
1318
- const attrs = attrString.match(/(\S+)=["']?((?:.(?!["']?\s+(?:\S+)=|\s*\/?[>"']))+.)["']?/gm);
1319
- return attrs.reduce((acc, attr) => {
1320
- const [key, value] = attr.split("=");
1321
- acc[key] = value.replace(/['"]/g, "");
1322
- return acc;
1323
- }, {});
1324
- };
1325
- var replaceIdsAndUrls = (code, key) => {
1326
- const idRegex = /id="([^"]*)"/;
1327
- const urlRegex = /url\(#([^)]*)\)/g;
1328
- const matches = code.match(/id="([^"]*)"/g);
1329
- let replacedCode = code;
1330
- if (isArray(matches)) {
1331
- matches.forEach(() => {
1332
- const randomKey = Math.floor(Math.random() * 1e5);
1333
- replacedCode = code.replace(idRegex, `id="${key}-${randomKey}"`).replace(urlRegex, `url(#${key}-${randomKey})`);
1334
- });
1335
- }
1336
- return replacedCode;
1337
- };
1338
- var convertSvgToSymbol = (key, code) => {
1339
- const extractAttrs = parseRootAttributes(code);
1340
- const { width, height } = extractAttrs;
1341
- const viewBox = extractAttrs.viewBox || `0 0 ${width || 24} ${height || 24}`;
1342
- const xmlns = "http://www.w3.org/2000/svg";
1343
- const replacedCode = replaceIdsAndUrls(code, key);
1344
- let symbol = replacedCode.replace(
1345
- "<svg",
1346
- `<symbol id="${key}" xmlns="${xmlns}" viewBox="${viewBox}"`
1347
- );
1348
- symbol = symbol.replace(/width="[^"]*"/, "");
1349
- symbol = symbol.replace(/height="[^"]*"/, "");
1350
- symbol = symbol.replace("</svg", "</symbol");
1351
- return symbol;
1352
- };
1353
-
1354
- // src/system/color.js
1355
- var getColor = (value, key, config) => {
1356
- const CONFIG2 = config || getActiveConfig();
1357
- if (!isString(value)) {
1358
- if (CONFIG2.verbose) console.warn(value, "- type for color is not valid");
1359
- return;
1360
- }
1361
- if (value.slice(0, 2) === "--") return `var(${value})`;
1362
- if (key && value[key]) value = value[key];
1363
- const [name, alpha, tone] = isArray(value) ? value : value.split(" ");
1364
- const { COLOR: COLOR2, GRADIENT: GRADIENT2 } = CONFIG2;
1365
- let val = COLOR2[name] || GRADIENT2[name];
1366
- if (!val) {
1367
- if (CONFIG2.verbose) console.warn("Can't find color ", name);
1368
- return value;
1369
- }
1370
- if (key) {
1371
- if (val[key]) val = val[key];
1372
- else if (CONFIG2.verbose) console.warn(value, " - does not have ", key);
1373
- }
1374
- let rgb = val.rgb;
1375
- if (!rgb) {
1376
- return CONFIG2.useVariable ? `var(${val.var})` : val.value;
1377
- }
1378
- if (tone && !val[tone]) {
1379
- rgb = getRgbTone(rgb, tone);
1380
- val[tone] = { rgb, var: `${val.var}-${tone}` };
1381
- }
1382
- if (val[tone]) rgb = val[tone].rgb;
1383
- if (alpha) return `rgba(${rgb}, ${alpha})`;
1384
- return CONFIG2.useVariable ? `var(${val.var})` : `rgb(${rgb})`;
1385
- };
1386
- var setColor = (val, key, suffix) => {
1387
- const CONFIG2 = getActiveConfig();
1388
- if (isString(val) && val.slice(0, 2) === "--") {
1389
- val = getColor(val.slice(2));
1390
- if (!(val.includes("rgb") || val.includes("var") || val.includes("#"))) {
1391
- if (CONFIG2.verbose) console.warn(val, "- referred but does not exist");
1392
- val = val.split(" ")[0];
1393
- }
1394
- }
1395
- if (isArray(val)) {
1396
- return {
1397
- "@light": setColor(val[0], key, "light"),
1398
- "@dark": setColor(val[1], key, "dark")
1399
- };
1400
- }
1401
- if (isObject(val)) {
1402
- const obj = {};
1403
- for (const variant in val) {
1404
- obj[variant] = setColor(
1405
- val[variant],
1406
- key,
1407
- variant.slice(0, 1) === "@" ? variant.slice(1) : variant
1408
- );
1409
- }
1410
- return obj;
1411
- }
1412
- const CSSVar = `--color-${key}` + (suffix ? `-${suffix}` : "");
1413
- const colorArr = colorStringToRgbaArray(val.value || val);
1414
- const [r, g, b, a = 1] = colorArr;
1415
- const alpha = parseFloat(a.toFixed(2));
1416
- const rgb = `${r}, ${g}, ${b}`;
1417
- const value = `rgba(${rgb}, ${alpha})`;
1418
- if (CONFIG2.useVariable) {
1419
- CONFIG2.CSS_VARS[CSSVar] = value;
1420
- }
1421
- return {
1422
- var: CSSVar,
1423
- rgb,
1424
- alpha,
1425
- value
1426
- };
1427
- };
1428
- var setGradient = (val, key, suffix) => {
1429
- const CONFIG2 = getActiveConfig();
1430
- if (isString(val) && val.slice(0, 2) === "--") val = getColor(val.slice(2));
1431
- if (isArray(val)) {
1432
- return {
1433
- "@light": setGradient(val[0], key, "light"),
1434
- "@dark": setGradient(val[0], key, "dark")
1435
- };
1436
- }
1437
- if (isObject(val)) {
1438
- const obj = {};
1439
- for (const variant in val) obj[variant] = setGradient(val[variant], key, variant.slice(0, 1) === "@" ? variant.slice(1) : variant);
1440
- return obj;
1441
- }
1442
- const CSSVar = `--gradient-${key}` + (suffix ? `-${suffix}` : "");
1443
- if (CONFIG2.useVariable) {
1444
- CONFIG2.CSS_VARS[CSSVar] = val.value || val;
1445
- }
1446
- return {
1447
- var: CSSVar,
1448
- value: val.value || val
1449
- };
1450
- };
1451
-
1452
- // src/system/theme.js
1453
- var setThemeValue = (theme) => {
1454
- const value = {};
1455
- const { state, media, helpers, ...rest } = theme;
1456
- const keys = Object.keys(rest);
1457
- keys.map((key) => {
1458
- const conditions = ["color", "Color", "background", "border"];
1459
- const isColor = conditions.some((k) => key.includes(k));
1460
- return value[key] = isColor ? getColor(theme[key]) : theme[key];
1461
- });
1462
- return value;
1463
- };
1464
- var getThemeValue = (theme) => {
1465
- if (theme.value) return theme.value;
1466
- theme.value = setThemeValue(theme);
1467
- return theme.value;
1468
- };
1469
- var getTheme = (value, modifier) => {
1470
- const CONFIG2 = getActiveConfig();
1471
- if (CONFIG2.useVariable) return getMediaTheme(value, modifier);
1472
- const { THEME: THEME2 } = CONFIG2;
1473
- if (isString(value)) {
1474
- const [theme, subtheme] = value.split(" ");
1475
- const isOurTheme = THEME2[theme];
1476
- if (isOurTheme) {
1477
- if (!subtheme && !modifier) return getThemeValue(isOurTheme);
1478
- value = [theme, subtheme || modifier];
1479
- }
1480
- }
1481
- if (isObjectLike(value) && value[1]) {
1482
- const themeName = value[0];
1483
- const subThemeName = value[1];
1484
- const { helpers, media, state } = THEME2[themeName];
1485
- if (media && media[subThemeName]) return getThemeValue(media[subThemeName]);
1486
- if (helpers && helpers[subThemeName]) return getThemeValue(helpers[subThemeName]);
1487
- if (state && state[subThemeName]) return getThemeValue(state[subThemeName]);
1488
- } else if (isObject(value)) return setThemeValue(value);
1489
- };
1490
- var setInverseTheme = (theme, variant, value) => {
1491
- if (isObject(variant)) {
1492
- theme.variants.inverse.value = setThemeValue(variant);
1493
- } else if (variant === true) {
1494
- const { color, background } = value;
1495
- theme.variants.inverse = {
1496
- value: {
1497
- color: background,
1498
- background: color
1499
- }
1500
- };
1501
- }
1502
- };
1503
- var setPseudo = (theme, key, variant, themeValue) => {
1504
- const result = getTheme(variant);
1505
- themeValue[`&:${key}`] = result;
1506
- if (isObject(variant) && !variant.value) variant.value = result;
1507
- };
1508
- var setSelectors = (theme, value) => {
1509
- const { state } = theme;
1510
- if (!state) return;
1511
- const keys = Object.keys(state);
1512
- keys.map((key) => {
1513
- const variant = state[key];
1514
- setPseudo(theme, key, variant, value);
1515
- return theme;
1516
- });
1517
- return theme;
1518
- };
1519
- var setPrefersScheme = (theme, key, variant, themeValue) => {
1520
- const result = getTheme(variant);
1521
- themeValue[`@media (prefers-color-scheme: ${key})`] = result;
1522
- if (isObject(variant) && !variant.value) variant.value = result;
1523
- };
1524
- var setMedia = (theme, value) => {
1525
- const { media } = theme;
1526
- if (!media) return;
1527
- const keys = Object.keys(media);
1528
- keys.map((key) => {
1529
- const variant = media[key];
1530
- if (key === "dark" || key === "light") setPrefersScheme(theme, key, variant, value);
1531
- if (key === "inverse") setInverseTheme(theme, variant, value);
1532
- return theme;
1533
- });
1534
- return theme;
1535
- };
1536
- var setHelpers = (theme, value) => {
1537
- const CONFIG2 = getActiveConfig();
1538
- const { helpers } = theme;
1539
- if (!helpers) return;
1540
- const keys = Object.keys(helpers);
1541
- keys.map((key) => {
1542
- const helper = helpers[key];
1543
- if (isString(helper)) helpers[key] = CONFIG2.THEME[helper];
1544
- else getThemeValue(helpers[key]);
1545
- return theme;
1546
- });
1547
- return theme;
1548
- };
1549
- var setTheme = (val, key) => {
1550
- const CONFIG2 = getActiveConfig();
1551
- if (CONFIG2.useVariable) return setMediaTheme(val, key);
1552
- const { state, media, helpers } = val;
1553
- const value = setThemeValue(val, key);
1554
- const CSSvar = `--theme-${key}`;
1555
- setSelectors(val, value);
1556
- setMedia(val, value);
1557
- setHelpers(val, value);
1558
- return { var: CSSvar, value, state, media, helpers };
1559
- };
1560
- var setMediaTheme = (val, key, suffix, prefers) => {
1561
- const CONFIG2 = getActiveConfig();
1562
- const { CSS_VARS: CSS_VARS2 } = CONFIG2;
1563
- const theme = { value: val };
1564
- if (isObjectLike(val)) {
1565
- for (const param in val) {
1566
- const symb = param.slice(0, 1);
1567
- const value = val[param];
1568
- if (symb === "@" || symb === ":" || symb === ".") {
1569
- const hasPrefers = symb === "@" && param;
1570
- theme[param] = setMediaTheme(value, key, param, prefers || hasPrefers);
1571
- } else {
1572
- const color = getColor(value, prefers);
1573
- const metaSuffixes = [...new Set([prefers, suffix].filter((v) => v).map((v) => v.slice(1)))];
1574
- const varmetaSuffixName = metaSuffixes.length ? "-" + metaSuffixes.join("-") : "";
1575
- const CSSVar = `--theme-${key}${varmetaSuffixName}-${param}`;
1576
- if (CONFIG2.useVariable) {
1577
- CSS_VARS2[CSSVar] = color;
1578
- theme[param] = `var(${CSSVar})`;
1579
- } else {
1580
- theme[param] = color;
1581
- }
1582
- theme[`.${param}`] = { [param]: theme[param] };
1583
- }
1584
- }
1585
- if (theme.background || theme.color || theme.backgroundColor) {
1586
- theme[".inversed"] = {
1587
- color: theme.background || theme.backgroundColor,
1588
- background: theme.color
1589
- };
1590
- }
1591
- }
1592
- if (isString(val) && val.slice(0, 2) === "--") {
1593
- const { THEME: THEME2 } = CONFIG2;
1594
- const value = THEME2[val.slice(2)];
1595
- const getReferenced = getMediaTheme(value, prefers);
1596
- return getReferenced;
1597
- }
1598
- return theme;
1599
- };
1600
- var recursiveTheme = (val) => {
1601
- const CONFIG2 = getActiveConfig();
1602
- const obj = {};
1603
- for (const param in val) {
1604
- const symb = param.slice(0, 1);
1605
- if (isObjectLike(val[param])) {
1606
- if (symb === "@") {
1607
- const query = CONFIG2.MEDIA[param.slice(1)];
1608
- const media = "@media " + (query === "print" ? `${query}` : `screen and ${query}`);
1609
- obj[media] = recursiveTheme(val[param]);
1610
- } else if (symb === ":") {
1611
- obj[`&${param}`] = recursiveTheme(val[param]);
1612
- }
1613
- } else obj[param] = val[param];
1614
- }
1615
- return obj;
1616
- };
1617
- var findModifierFromArray = (val, modifierArray) => {
1618
- const currentMod = modifierArray.shift();
1619
- if (val[currentMod]) return findModifierFromArray(val[currentMod], modifierArray);
1620
- return val;
1621
- };
1622
- var findModifier = (val, modifier) => {
1623
- if (isArray(modifier)) return findModifierFromArray(val, modifier);
1624
- else if (isString(modifier) && val[modifier]) return val[modifier];
1625
- else return val;
1626
- };
1627
- var getMediaTheme = (value, modifier) => {
1628
- const activeConfig = getActiveConfig();
1629
- if (isString(value) && value.slice(0, 2) === "--") {
1630
- value = getMediaTheme(value.slice(2));
1631
- }
1632
- if (!value || !isString(value)) {
1633
- if (activeConfig.verbose) {
1634
- console.warn(`${value} - Theme is not a string`);
1635
- }
1636
- return;
1637
- }
1638
- const [themeName, ...themeModifiers] = isArray(value) ? value : value.split(" ");
1639
- let themeValue = activeConfig.THEME[themeName];
1640
- if (themeValue && (themeModifiers || modifier)) {
1641
- themeValue = findModifier(themeValue, themeModifiers.length ? themeModifiers : modifier);
1642
- }
1643
- const resolvedTheme = recursiveTheme(themeValue);
1644
- return resolvedTheme;
1645
- };
1646
-
1647
- // src/system/font.js
1648
- var import_utils12 = __toESM(require_cjs(), 1);
1649
- var setFont = (val, key) => {
1650
- const CSSvar = `--font-${key}`;
1651
- if (!val || isArray(val) && !val[0]) return;
1652
- const fontFace = val[0] ? getFontFaceEach(key, val) : setCustomFontMedia(key, val.url);
1653
- return { var: CSSvar, value: val, fontFace };
1654
- };
1655
- var setFontFamily = (val, key) => {
1656
- const CONFIG2 = getActiveConfig();
1657
- const { FONT_FAMILY: FONT_FAMILY2, FONT_FAMILY_TYPES: FONT_FAMILY_TYPES2 } = CONFIG2;
1658
- let { value, type } = val;
1659
- if (val.isDefault) FONT_FAMILY2.default = key;
1660
- if (isObject(value)) value = (0, import_utils12.arrayzeValue)(value);
1661
- const CSSvar = `--font-family-${key}`;
1662
- const str = `${value.join(", ")}, ${FONT_FAMILY_TYPES2[type]}`;
1663
- return { var: CSSvar, value: str, arr: value, type };
1664
- };
1665
-
1666
- // src/system/typography.js
1667
- var runThroughMedia = (FACTORY2) => {
1668
- const CONFIG2 = getActiveConfig();
1669
- const { TYPOGRAPHY: TYPOGRAPHY2, MEDIA: MEDIA2 } = CONFIG2;
1670
- for (const prop in FACTORY2) {
1671
- const isPropMedia = prop.slice(0, 1) === "@";
1672
- const mediaValue = FACTORY2[prop];
1673
- if (!isPropMedia) continue;
1674
- const { mediaRegenerate } = FACTORY2;
1675
- const mediaName = prop.slice(1);
1676
- const {
1677
- type,
1678
- base,
1679
- ratio,
1680
- range,
1681
- subSequence,
1682
- h1Matches,
1683
- unit
1684
- } = FACTORY2;
1685
- merge(mediaValue, {
1686
- type,
1687
- base,
1688
- ratio,
1689
- range,
1690
- subSequence,
1691
- h1Matches,
1692
- unit
1693
- });
1694
- const query = MEDIA2[mediaName];
1695
- const media = "@media " + (query === "print" ? `${query}` : `screen and ${query}`);
1696
- TYPOGRAPHY2.templates[media] = {
1697
- fontSize: mediaValue.base / TYPOGRAPHY2.browserDefault + unit
1698
- };
1699
- if (!mediaRegenerate) {
1700
- applyMediaSequenceVars(FACTORY2, prop);
1701
- continue;
1702
- }
1703
- merge(mediaValue, {
1704
- sequence: {},
1705
- scales: {},
1706
- templates: {},
1707
- vars: {}
1708
- });
1709
- generateSequence(mediaValue);
1710
- applyMediaSequenceVars(FACTORY2, prop);
1711
- }
1712
- };
1713
- var applyHeadings = (props) => {
1714
- var _a;
1715
- const CONFIG2 = getActiveConfig();
1716
- if (props.h1Matches) {
1717
- const unit = props.unit;
1718
- const HEADINGS = findHeadings(props);
1719
- const { templates } = props;
1720
- for (const k in HEADINGS) {
1721
- const headerName = `h${parseInt(k) + 1}`;
1722
- const headerStyle = templates[headerName];
1723
- if (!HEADINGS[k]) continue;
1724
- templates[headerName] = {
1725
- fontSize: CONFIG2.useVariable ? `var(${(_a = HEADINGS[k]) == null ? void 0 : _a.variable})` : `${HEADINGS[k].scaling}${unit}`,
1726
- margin: headerStyle ? headerStyle.margin : 0,
1727
- lineHeight: headerStyle ? headerStyle.lineHeight : props.lineHeight,
1728
- letterSpacing: headerStyle ? headerStyle.letterSpacing : props.letterSpacing,
1729
- fontWeight: headerStyle ? headerStyle.fontWeight : 900 - k * 100
1730
- };
1731
- }
1732
- }
1733
- };
1734
- var applyTypographySequence = () => {
1735
- const CONFIG2 = getActiveConfig();
1736
- const { TYPOGRAPHY: TYPOGRAPHY2 } = CONFIG2;
1737
- generateSequence(TYPOGRAPHY2);
1738
- applyHeadings(TYPOGRAPHY2);
1739
- applySequenceVars(TYPOGRAPHY2);
1740
- runThroughMedia(TYPOGRAPHY2);
1741
- };
1742
-
1743
- // src/system/spacing.js
1744
- var import_utils16 = __toESM(require_cjs(), 1);
1745
- var runThroughMedia2 = (FACTORY2) => {
1746
- for (const prop in FACTORY2) {
1747
- const mediaProps = FACTORY2[prop];
1748
- const isMediaName = prop.slice(0, 1) === "@";
1749
- if (!isMediaName) continue;
1750
- const {
1751
- type,
1752
- base,
1753
- ratio,
1754
- range,
1755
- subSequence,
1756
- h1Matches,
1757
- unit
1758
- } = FACTORY2;
1759
- merge(mediaProps, {
1760
- type,
1761
- base,
1762
- ratio,
1763
- range,
1764
- subSequence,
1765
- h1Matches,
1766
- unit,
1767
- sequence: {},
1768
- scales: {},
1769
- templates: {},
1770
- vars: {}
1771
- });
1772
- generateSequence(mediaProps);
1773
- applyMediaSequenceVars(FACTORY2, prop);
1774
- }
1775
- };
1776
- var applySpacingSequence = () => {
1777
- const CONFIG2 = getActiveConfig();
1778
- const { SPACING: SPACING2 } = CONFIG2;
1779
- generateSequence(SPACING2);
1780
- applySequenceVars(SPACING2);
1781
- runThroughMedia2(SPACING2);
1782
- };
1783
- var getSequence = (sequenceProps) => {
1784
- const CONFIG2 = getActiveConfig();
1785
- const { SPACING: SPACING2 } = CONFIG2;
1786
- if (!sequenceProps) return SPACING2;
1787
- const hasGenerated = Object.keys(sequenceProps.sequence).length > 0;
1788
- return hasGenerated ? sequenceProps : generateSequence(sequenceProps);
1789
- };
1790
- var getSpacingByKey = (value, propertyName = "padding", sequenceProps) => {
1791
- const sequence = getSequence(sequenceProps);
1792
- if (isString(value) && (value.includes("calc") || value.includes("var"))) {
1793
- return { [propertyName]: value };
1794
- }
1795
- const stack = (0, import_utils16.arrayzeValue)(value);
1796
- if (!isArray(stack)) return;
1797
- if (stack.length > 1) {
1798
- let suffix = "";
1799
- if (propertyName === "borderWidth") {
1800
- propertyName = "border";
1801
- suffix = "Width";
1802
- }
1803
- const directions = {
1804
- 2: ["Block", "Inline"],
1805
- 3: ["BlockStart", "Inline", "BlockEnd"],
1806
- 4: ["BlockStart", "InlineEnd", "BlockEnd", "InlineStart"]
1807
- };
1808
- const wrapSequenceValueByDirection = (direction, i) => getSequenceValuePropertyPair(
1809
- stack[i],
1810
- propertyName + direction + suffix,
1811
- sequence
1812
- );
1813
- return directions[stack.length].map((dir, key) => wrapSequenceValueByDirection(dir, key));
1814
- }
1815
- return getSequenceValuePropertyPair(
1816
- value,
1817
- propertyName,
1818
- sequence
1819
- );
1820
- };
1821
-
1822
- // src/system/shadow.js
1823
- var setShadow = (value, key, suffix, prefers) => {
1824
- const CONFIG2 = getActiveConfig();
1825
- if (isArray(value)) {
1826
- return {
1827
- "@light": setShadow(value[0], key, "light"),
1828
- "@dark": setShadow(value[1], key, "dark")
1829
- };
1830
- }
1831
- if (isObject(value)) {
1832
- const obj = {};
1833
- for (const variant in value) {
1834
- obj[variant] = setShadow(
1835
- value[variant],
1836
- key,
1837
- variant.startsWith("@") ? variant.slice(1) : variant
1838
- );
1839
- }
1840
- return obj;
1841
- }
1842
- if (isString(value) && value.includes(",")) {
1843
- value = value.split(",").map((v) => {
1844
- v = v.trim();
1845
- if (v.startsWith("--")) return `var(${v})`;
1846
- if (getColor(v).length > 2) return getColor(v);
1847
- if (v.includes("px") || v.slice(-2) === "em") return v;
1848
- const arr = v.split(" ");
1849
- if (!arr.length) return v;
1850
- return arr.map((v2) => getSpacingByKey(v2, "shadow").shadow).join(" ");
1851
- }).join(" ");
1852
- }
1853
- const CSSVar = `--shadow-${key}` + (suffix ? `-${suffix}` : "");
1854
- if (CONFIG2.useVariable) {
1855
- CONFIG2.CSS_VARS[CSSVar] = value;
1856
- }
1857
- return {
1858
- var: CSSVar,
1859
- value
1860
- };
1861
- };
1862
-
1863
- // src/system/timing.js
1864
- var import_utils20 = __toESM(require_cjs(), 1);
1865
- var applyTimingSequence = () => {
1866
- const CONFIG2 = getActiveConfig();
1867
- const { TIMING: TIMING2 } = CONFIG2;
1868
- generateSequence(TIMING2);
1869
- applySequenceVars(TIMING2);
1870
- };
1871
-
1872
- // src/system/document.js
1873
- var applyDocument = () => {
1874
- const CONFIG2 = getActiveConfig();
1875
- const { DOCUMENT: DOCUMENT2, FONT_FAMILY: FONT_FAMILY2, THEME: THEME2, TYPOGRAPHY: TYPOGRAPHY2 } = CONFIG2;
1876
- return merge(DOCUMENT2, {
1877
- theme: THEME2.document,
1878
- fontFamily: getDefaultOrFirstKey(FONT_FAMILY2),
1879
- fontSize: TYPOGRAPHY2.base,
1880
- lineHeight: TYPOGRAPHY2.lineHeight
1881
- });
1882
- };
1883
-
1884
- // src/system/svg.js
1885
- var setSVG = (val, key) => {
1886
- const CONFIG2 = getActiveConfig();
1887
- if (!val) {
1888
- if (CONFIG2.verbose) console.warn("setSVG: val is not defined", key);
1889
- return;
1890
- }
1891
- if (CONFIG2.useSvgSprite) {
1892
- return convertSvgToSymbol(key, val);
1893
- }
1894
- return val;
1895
- };
1896
- var setSvgIcon = (val, key) => {
1897
- var _a;
1898
- const CONFIG2 = getActiveConfig();
1899
- if (CONFIG2.useIconSprite && !((_a = CONFIG2.SEMANTIC_ICONS) == null ? void 0 : _a[key])) {
1900
- return setSVG(val, key);
1901
- }
1902
- return val;
1903
- };
1904
-
1905
- // src/system/reset.js
1906
- var applyReset = (reset = {}) => {
1907
- const CONFIG2 = getActiveConfig();
1908
- const { RESET: RESET2, TYPOGRAPHY: TYPOGRAPHY2, DOCUMENT: DOCUMENT2 } = CONFIG2;
1909
- if (RESET2) {
1910
- if (RESET2[":root"]) {
1911
- const configReset = RESET2;
1912
- const configTemplates = TYPOGRAPHY2.templates;
1913
- configReset.body = {
1914
- ...CONFIG2.useDocumentTheme ? getMediaTheme("document", `@${CONFIG2.globalTheme}`) : {},
1915
- ...configTemplates.body
1916
- };
1917
- configReset.h1 = configTemplates.h1;
1918
- configReset.h2 = configTemplates.h2;
1919
- configReset.h3 = configTemplates.h3;
1920
- configReset.h4 = configTemplates.h4;
1921
- configReset.h5 = configTemplates.h5;
1922
- configReset.h6 = configTemplates.h6;
1923
- }
1924
- const { body, ...templates } = TYPOGRAPHY2.templates;
1925
- const globalTheme = CONFIG2.useDocumentTheme ? getMediaTheme("document", `@${CONFIG2.globalTheme}`) : {};
1926
- if (RESET2.html) overwriteDeep(RESET2.html, globalTheme);
1927
- return deepMerge(merge(RESET2, reset), {
1928
- html: {
1929
- position: "absolute",
1930
- // overflow: 'hidden',
1931
- width: "100%",
1932
- height: "100%",
1933
- top: "0",
1934
- left: "0",
1935
- margin: "0",
1936
- WebkitFontSmoothing: "subpixel-antialiased",
1937
- scrollBehavior: "smooth",
1938
- ...globalTheme,
1939
- fontSize: TYPOGRAPHY2.browserDefault + "px",
1940
- fontFamily: DOCUMENT2.fontFamily,
1941
- lineHeight: DOCUMENT2.lineHeight
1942
- },
1943
- body: {
1944
- boxSizing: "border-box",
1945
- height: "100%",
1946
- margin: 0,
1947
- fontFamily: DOCUMENT2.fontFamily,
1948
- fontSize: TYPOGRAPHY2.base / TYPOGRAPHY2.browserDefault + CONFIG2.UNIT.default,
1949
- ...templates,
1950
- ...body
1951
- },
1952
- // form elements
1953
- fieldset: {
1954
- border: 0,
1955
- padding: 0,
1956
- margin: 0
1957
- },
1958
- "select, input": {
1959
- fontFamily: DOCUMENT2.fontFamily
1960
- }
1961
- });
1962
- }
1963
- };
1964
-
1965
- // src/set.js
1966
- var setCases = (val, key) => {
1967
- if (isFunction(val)) return val();
27
+ var import_factory = require("./factory.js");
28
+ var import_system = require("./system");
29
+ var import_utils = require("@domql/utils");
30
+ const setCases = (val, key) => {
31
+ if ((0, import_utils.isFunction)(val)) return val();
1968
32
  return val;
1969
33
  };
1970
- var setSameValue = (val, key) => val;
1971
- var VALUE_TRANSFORMERS = {
1972
- color: setColor,
1973
- gradient: setGradient,
1974
- font: setFont,
1975
- font_family: setFontFamily,
1976
- theme: setTheme,
1977
- icons: setSvgIcon,
34
+ const setSameValue = (val, key) => val;
35
+ const VALUE_TRANSFORMERS = {
36
+ color: import_system.setColor,
37
+ gradient: import_system.setGradient,
38
+ font: import_system.setFont,
39
+ font_family: import_system.setFontFamily,
40
+ theme: import_system.setTheme,
41
+ icons: import_system.setSvgIcon,
1978
42
  semantic_icons: setSameValue,
1979
- svg: setSVG,
43
+ svg: import_system.setSVG,
1980
44
  svg_data: setSameValue,
1981
45
  typography: setSameValue,
1982
46
  cases: setCases,
1983
- shadow: setShadow,
47
+ shadow: import_system.setShadow,
1984
48
  spacing: setSameValue,
1985
49
  media: setSameValue,
1986
50
  grid: setSameValue,
@@ -1990,37 +54,37 @@ var VALUE_TRANSFORMERS = {
1990
54
  unit: setSameValue,
1991
55
  animation: setSameValue
1992
56
  };
1993
- var setValue = (FACTORY_NAME, value, key) => {
1994
- const CONFIG2 = getActiveConfig();
57
+ const setValue = (FACTORY_NAME, value, key) => {
58
+ const CONFIG = (0, import_factory.getActiveConfig)();
1995
59
  const factoryName = FACTORY_NAME.toLowerCase();
1996
- const FACTORY2 = CONFIG2[FACTORY_NAME];
60
+ const FACTORY2 = CONFIG[FACTORY_NAME];
1997
61
  if (VALUE_TRANSFORMERS[factoryName]) {
1998
62
  try {
1999
63
  const result = VALUE_TRANSFORMERS[factoryName](value, key);
2000
64
  FACTORY2[key] = result;
2001
65
  return FACTORY2;
2002
66
  } catch (error) {
2003
- if (CONFIG2.verbose) console.warn("Error setting", factoryName, "value", value, key, error);
67
+ if (CONFIG.verbose) console.warn("Error setting", factoryName, "value", value, key, error);
2004
68
  }
2005
69
  }
2006
- if (CONFIG2.verbose) console.warn("Can not find", factoryName, "method in scratch");
70
+ if (CONFIG.verbose) console.warn("Can not find", factoryName, "method in scratch");
2007
71
  };
2008
- var setEach = (factoryName, props) => {
2009
- const CONFIG2 = getActiveConfig();
72
+ const setEach = (factoryName, props) => {
73
+ const CONFIG = (0, import_factory.getActiveConfig)();
2010
74
  const FACTORY_NAME = factoryName.toUpperCase();
2011
75
  const keys = Object.keys(props);
2012
76
  keys.forEach((key) => {
2013
77
  try {
2014
78
  return setValue(FACTORY_NAME, props[key], key);
2015
79
  } catch (error) {
2016
- if (CONFIG2.verbose) console.warn("Error setting", FACTORY_NAME, "value", props[key], key, error);
80
+ if (CONFIG.verbose) console.warn("Error setting", FACTORY_NAME, "value", props[key], key, error);
2017
81
  }
2018
82
  });
2019
- return CONFIG2[FACTORY_NAME];
83
+ return CONFIG[FACTORY_NAME];
2020
84
  };
2021
- var SET_OPTIONS = {};
2022
- var set = (recivedConfig, options = SET_OPTIONS) => {
2023
- let CONFIG2 = getActiveConfig();
85
+ const SET_OPTIONS = {};
86
+ const set = (recivedConfig, options = SET_OPTIONS) => {
87
+ let CONFIG = (0, import_factory.getActiveConfig)();
2024
88
  const {
2025
89
  version,
2026
90
  verbose,
@@ -2032,49 +96,59 @@ var set = (recivedConfig, options = SET_OPTIONS) => {
2032
96
  globalTheme,
2033
97
  useDocumentTheme,
2034
98
  useDefaultConfig,
2035
- SEMANTIC_ICONS: SEMANTIC_ICONS2,
99
+ SEMANTIC_ICONS,
2036
100
  ...config
2037
101
  } = recivedConfig;
2038
102
  if (options.newConfig) {
2039
- CONFIG2 = setActiveConfig(options.newConfig);
2040
- }
2041
- if (verbose !== void 0) CONFIG2.verbose = verbose;
2042
- if (useVariable !== void 0) CONFIG2.useVariable = useVariable;
2043
- if (useReset !== void 0) CONFIG2.useReset = useReset;
2044
- if (useFontImport !== void 0) CONFIG2.useFontImport = useFontImport;
2045
- if (useSvgSprite !== void 0) CONFIG2.useSvgSprite = useSvgSprite;
2046
- if (useIconSprite !== void 0) CONFIG2.useIconSprite = useIconSprite;
2047
- if (useDocumentTheme !== void 0) CONFIG2.useDocumentTheme = useDocumentTheme;
2048
- if (globalTheme !== void 0) CONFIG2.globalTheme = globalTheme;
2049
- if (useDefaultConfig !== void 0) CONFIG2.useDefaultConfig = useDefaultConfig;
2050
- if (SEMANTIC_ICONS2 !== void 0) CONFIG2.SEMANTIC_ICONS = SEMANTIC_ICONS2;
2051
- if (CONFIG2.verbose) console.log(CONFIG2);
2052
- if (!CONFIG2.__svg_cache) CONFIG2.__svg_cache = {};
103
+ CONFIG = (0, import_factory.setActiveConfig)(options.newConfig);
104
+ }
105
+ if (verbose !== void 0) CONFIG.verbose = verbose;
106
+ if (useVariable !== void 0) CONFIG.useVariable = useVariable;
107
+ if (useReset !== void 0) CONFIG.useReset = useReset;
108
+ if (useFontImport !== void 0) CONFIG.useFontImport = useFontImport;
109
+ if (useSvgSprite !== void 0) CONFIG.useSvgSprite = useSvgSprite;
110
+ if (useIconSprite !== void 0) CONFIG.useIconSprite = useIconSprite;
111
+ if (useDocumentTheme !== void 0) CONFIG.useDocumentTheme = useDocumentTheme;
112
+ if (globalTheme !== void 0) CONFIG.globalTheme = globalTheme;
113
+ if (useDefaultConfig !== void 0) CONFIG.useDefaultConfig = useDefaultConfig;
114
+ if (SEMANTIC_ICONS !== void 0) CONFIG.SEMANTIC_ICONS = SEMANTIC_ICONS;
115
+ if (CONFIG.verbose) console.log(CONFIG);
116
+ if (!CONFIG.__svg_cache) CONFIG.__svg_cache = {};
2053
117
  const keys = Object.keys(config);
2054
- keys.map((key) => setEach(key, config[key]));
2055
- if (config.TYPOGRAPHY) {
118
+ const keySet = new Set(keys);
119
+ keys.forEach((key) => {
120
+ const lower = key.toLowerCase();
121
+ if (lower !== key && keySet.has(lower)) {
122
+ (0, import_utils.deepMerge)(config[lower], config[key]);
123
+ }
124
+ });
125
+ keys.map((key) => {
126
+ const lower = key.toLowerCase();
127
+ if (lower !== key && keySet.has(lower)) return;
128
+ return setEach(key, config[key]);
129
+ });
130
+ if (config.TYPOGRAPHY || config.typography) {
2056
131
  try {
2057
- applyTypographySequence();
132
+ (0, import_system.applyTypographySequence)();
2058
133
  } catch (e) {
2059
- if (CONFIG2.verbose) console.warn("Error applying typography sequence", e);
134
+ if (CONFIG.verbose) console.warn("Error applying typography sequence", e);
2060
135
  }
2061
136
  }
2062
- if (config.SPACING) {
137
+ if (config.SPACING || config.spacing) {
2063
138
  try {
2064
- applySpacingSequence();
139
+ (0, import_system.applySpacingSequence)();
2065
140
  } catch (e) {
2066
- if (CONFIG2.verbose) console.warn("Error applying typography sequence", e);
141
+ if (CONFIG.verbose) console.warn("Error applying spacing sequence", e);
2067
142
  }
2068
143
  }
2069
- if (config.TIMING) {
144
+ if (config.TIMING || config.timing) {
2070
145
  try {
2071
- applyTimingSequence();
146
+ (0, import_system.applyTimingSequence)();
2072
147
  } catch (e) {
2073
- if (CONFIG2.verbose) console.warn("Error applying typography sequence", e);
148
+ if (CONFIG.verbose) console.warn("Error applying timing sequence", e);
2074
149
  }
2075
150
  }
2076
- applyDocument();
2077
- applyReset();
2078
- return CONFIG2;
151
+ (0, import_system.applyDocument)();
152
+ (0, import_system.applyReset)();
153
+ return CONFIG;
2079
154
  };
2080
- // @preserve-env