@zumer/snapdom 1.9.6-dev.2 → 1.9.6
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/snapdom.js +275 -411
- package/dist/snapdom.min.js +3 -15
- package/dist/snapdom.min.mjs +3 -15
- package/dist/snapdom.mjs +154 -162
- package/package.json +1 -4
package/dist/snapdom.js
CHANGED
|
@@ -1,14 +1,13 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
3
|
* snapdom
|
|
4
|
-
* v.1.9.6
|
|
4
|
+
* v.1.9.6
|
|
5
5
|
* Author Juan Martin Muda
|
|
6
6
|
* License MIT
|
|
7
7
|
**/
|
|
8
8
|
|
|
9
9
|
(() => {
|
|
10
10
|
var __defProp = Object.defineProperty;
|
|
11
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
12
11
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
13
12
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
14
13
|
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
@@ -36,12 +35,6 @@
|
|
|
36
35
|
}
|
|
37
36
|
return target;
|
|
38
37
|
};
|
|
39
|
-
var __esm = (fn, res) => function __init() {
|
|
40
|
-
return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
|
|
41
|
-
};
|
|
42
|
-
var __commonJS = (cb, mod) => function __require() {
|
|
43
|
-
return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
|
|
44
|
-
};
|
|
45
38
|
var __async = (__this, __arguments, generator) => {
|
|
46
39
|
return new Promise((resolve, reject) => {
|
|
47
40
|
var fulfilled = (value) => {
|
|
@@ -64,6 +57,21 @@
|
|
|
64
57
|
};
|
|
65
58
|
|
|
66
59
|
// src/core/cache.js
|
|
60
|
+
var cache = {
|
|
61
|
+
image: /* @__PURE__ */ new Map(),
|
|
62
|
+
background: /* @__PURE__ */ new Map(),
|
|
63
|
+
resource: /* @__PURE__ */ new Map(),
|
|
64
|
+
defaultStyle: /* @__PURE__ */ new Map(),
|
|
65
|
+
baseStyle: /* @__PURE__ */ new Map(),
|
|
66
|
+
computedStyle: /* @__PURE__ */ new WeakMap(),
|
|
67
|
+
font: /* @__PURE__ */ new Set(),
|
|
68
|
+
snapshot: /* @__PURE__ */ new WeakMap(),
|
|
69
|
+
snapshotKey: /* @__PURE__ */ new Map(),
|
|
70
|
+
preStyleMap: /* @__PURE__ */ new Map(),
|
|
71
|
+
preStyle: /* @__PURE__ */ new WeakMap(),
|
|
72
|
+
preNodeMap: /* @__PURE__ */ new Map(),
|
|
73
|
+
reset: resetCache
|
|
74
|
+
};
|
|
67
75
|
function resetCache() {
|
|
68
76
|
cache.computedStyle = /* @__PURE__ */ new WeakMap();
|
|
69
77
|
cache.snapshot = /* @__PURE__ */ new WeakMap();
|
|
@@ -72,28 +80,47 @@
|
|
|
72
80
|
cache.preStyle = /* @__PURE__ */ new WeakMap();
|
|
73
81
|
cache.preNodeMap.clear();
|
|
74
82
|
}
|
|
75
|
-
var cache;
|
|
76
|
-
var init_cache = __esm({
|
|
77
|
-
"src/core/cache.js"() {
|
|
78
|
-
cache = {
|
|
79
|
-
image: /* @__PURE__ */ new Map(),
|
|
80
|
-
background: /* @__PURE__ */ new Map(),
|
|
81
|
-
resource: /* @__PURE__ */ new Map(),
|
|
82
|
-
defaultStyle: /* @__PURE__ */ new Map(),
|
|
83
|
-
baseStyle: /* @__PURE__ */ new Map(),
|
|
84
|
-
computedStyle: /* @__PURE__ */ new WeakMap(),
|
|
85
|
-
font: /* @__PURE__ */ new Set(),
|
|
86
|
-
snapshot: /* @__PURE__ */ new WeakMap(),
|
|
87
|
-
snapshotKey: /* @__PURE__ */ new Map(),
|
|
88
|
-
preStyleMap: /* @__PURE__ */ new Map(),
|
|
89
|
-
preStyle: /* @__PURE__ */ new WeakMap(),
|
|
90
|
-
preNodeMap: /* @__PURE__ */ new Map(),
|
|
91
|
-
reset: resetCache
|
|
92
|
-
};
|
|
93
|
-
}
|
|
94
|
-
});
|
|
95
83
|
|
|
96
84
|
// src/utils/cssTools.js
|
|
85
|
+
var commonTags = [
|
|
86
|
+
"div",
|
|
87
|
+
"span",
|
|
88
|
+
"p",
|
|
89
|
+
"a",
|
|
90
|
+
"img",
|
|
91
|
+
"ul",
|
|
92
|
+
"li",
|
|
93
|
+
"button",
|
|
94
|
+
"input",
|
|
95
|
+
"select",
|
|
96
|
+
"textarea",
|
|
97
|
+
"label",
|
|
98
|
+
"section",
|
|
99
|
+
"article",
|
|
100
|
+
"header",
|
|
101
|
+
"footer",
|
|
102
|
+
"nav",
|
|
103
|
+
"main",
|
|
104
|
+
"aside",
|
|
105
|
+
"h1",
|
|
106
|
+
"h2",
|
|
107
|
+
"h3",
|
|
108
|
+
"h4",
|
|
109
|
+
"h5",
|
|
110
|
+
"h6",
|
|
111
|
+
"svg",
|
|
112
|
+
"path",
|
|
113
|
+
"circle",
|
|
114
|
+
"rect",
|
|
115
|
+
"line",
|
|
116
|
+
"g",
|
|
117
|
+
"table",
|
|
118
|
+
"thead",
|
|
119
|
+
"tbody",
|
|
120
|
+
"tr",
|
|
121
|
+
"td",
|
|
122
|
+
"th"
|
|
123
|
+
];
|
|
97
124
|
function precacheCommonTags() {
|
|
98
125
|
for (let tag of commonTags) {
|
|
99
126
|
getDefaultStyleForTag(tag);
|
|
@@ -190,51 +217,6 @@
|
|
|
190
217
|
}
|
|
191
218
|
return classMap;
|
|
192
219
|
}
|
|
193
|
-
var commonTags;
|
|
194
|
-
var init_cssTools = __esm({
|
|
195
|
-
"src/utils/cssTools.js"() {
|
|
196
|
-
init_cache();
|
|
197
|
-
commonTags = [
|
|
198
|
-
"div",
|
|
199
|
-
"span",
|
|
200
|
-
"p",
|
|
201
|
-
"a",
|
|
202
|
-
"img",
|
|
203
|
-
"ul",
|
|
204
|
-
"li",
|
|
205
|
-
"button",
|
|
206
|
-
"input",
|
|
207
|
-
"select",
|
|
208
|
-
"textarea",
|
|
209
|
-
"label",
|
|
210
|
-
"section",
|
|
211
|
-
"article",
|
|
212
|
-
"header",
|
|
213
|
-
"footer",
|
|
214
|
-
"nav",
|
|
215
|
-
"main",
|
|
216
|
-
"aside",
|
|
217
|
-
"h1",
|
|
218
|
-
"h2",
|
|
219
|
-
"h3",
|
|
220
|
-
"h4",
|
|
221
|
-
"h5",
|
|
222
|
-
"h6",
|
|
223
|
-
"svg",
|
|
224
|
-
"path",
|
|
225
|
-
"circle",
|
|
226
|
-
"rect",
|
|
227
|
-
"line",
|
|
228
|
-
"g",
|
|
229
|
-
"table",
|
|
230
|
-
"thead",
|
|
231
|
-
"tbody",
|
|
232
|
-
"tr",
|
|
233
|
-
"td",
|
|
234
|
-
"th"
|
|
235
|
-
];
|
|
236
|
-
}
|
|
237
|
-
});
|
|
238
220
|
|
|
239
221
|
// src/utils/helpers.js
|
|
240
222
|
function inlineSingleBackgroundEntry(_0) {
|
|
@@ -292,13 +274,10 @@
|
|
|
292
274
|
return clean;
|
|
293
275
|
}
|
|
294
276
|
function extractURL(value) {
|
|
295
|
-
const
|
|
296
|
-
if (
|
|
297
|
-
|
|
298
|
-
if (url.
|
|
299
|
-
if (url.startsWith('"') && url.endsWith('"') || url.startsWith("'") && url.endsWith("'")) {
|
|
300
|
-
url = url.slice(1, -1);
|
|
301
|
-
}
|
|
277
|
+
const match = value.match(/url\((['"]?)(.*?)(\1)\)/);
|
|
278
|
+
if (!match) return null;
|
|
279
|
+
const url = match[2].trim();
|
|
280
|
+
if (url.startsWith("#")) return null;
|
|
302
281
|
return url;
|
|
303
282
|
}
|
|
304
283
|
function fetchImage(src, { timeout = 3e3, useProxy = "" } = {}) {
|
|
@@ -336,20 +315,16 @@
|
|
|
336
315
|
try {
|
|
337
316
|
return yield fetchBlobAsDataURL(proxied);
|
|
338
317
|
} catch (e2) {
|
|
339
|
-
|
|
340
|
-
throw new Error("CORS restrictions prevented image capture (even via proxy)");
|
|
318
|
+
throw new Error("[SnapDOM - fetchImage] CORS restrictions prevented image capture (even via proxy)");
|
|
341
319
|
}
|
|
342
320
|
} else {
|
|
343
|
-
|
|
344
|
-
throw new Error("Fetch fallback failed and no proxy provided");
|
|
321
|
+
throw new Error("[SnapDOM - fetchImage] Fetch fallback failed and no proxy provided");
|
|
345
322
|
}
|
|
346
323
|
}
|
|
347
324
|
});
|
|
348
325
|
}
|
|
349
326
|
const crossOriginValue = getCrossOriginMode(src);
|
|
350
|
-
console.log(`[SnapDOM - fetchImage] Start loading image: ${src} with crossOrigin=${crossOriginValue}`);
|
|
351
327
|
if (cache.image.has(src)) {
|
|
352
|
-
console.log(`[SnapDOM - fetchImage] Cache hit for: ${src}`);
|
|
353
328
|
return Promise.resolve(cache.image.get(src));
|
|
354
329
|
}
|
|
355
330
|
const isDataURI = src.startsWith("data:image/");
|
|
@@ -376,8 +351,7 @@
|
|
|
376
351
|
}
|
|
377
352
|
return new Promise((resolve, reject) => {
|
|
378
353
|
const timeoutId = setTimeout(() => {
|
|
379
|
-
|
|
380
|
-
reject(new Error("Image load timed out"));
|
|
354
|
+
reject(new Error("[SnapDOM - fetchImage] Image load timed out"));
|
|
381
355
|
}, timeout);
|
|
382
356
|
const image = new Image();
|
|
383
357
|
image.crossOrigin = crossOriginValue;
|
|
@@ -470,11 +444,6 @@
|
|
|
470
444
|
parts.push(bg.slice(lastIndex).trim());
|
|
471
445
|
return parts;
|
|
472
446
|
}
|
|
473
|
-
var init_helpers = __esm({
|
|
474
|
-
"src/utils/helpers.js"() {
|
|
475
|
-
init_cache();
|
|
476
|
-
}
|
|
477
|
-
});
|
|
478
447
|
|
|
479
448
|
// src/modules/styles.js
|
|
480
449
|
function snapshotComputedStyleFull(style) {
|
|
@@ -511,177 +480,178 @@
|
|
|
511
480
|
cache.snapshotKey.set(hash, key);
|
|
512
481
|
cache.preStyleMap.set(clone, key);
|
|
513
482
|
}
|
|
514
|
-
var init_styles = __esm({
|
|
515
|
-
"src/modules/styles.js"() {
|
|
516
|
-
init_cssTools();
|
|
517
|
-
init_helpers();
|
|
518
|
-
init_cache();
|
|
519
|
-
}
|
|
520
|
-
});
|
|
521
483
|
|
|
522
484
|
// src/core/clone.js
|
|
523
|
-
function isSlotElement(node) {
|
|
524
|
-
return node.nodeType === Node.ELEMENT_NODE && node.tagName === "SLOT";
|
|
525
|
-
}
|
|
526
485
|
function deepClone(node, compress, options = {}, originalRoot) {
|
|
527
486
|
var _a, _b;
|
|
528
|
-
if (!node)
|
|
529
|
-
|
|
487
|
+
if (!node) throw new Error("Invalid node");
|
|
488
|
+
const clonedAssignedNodes = /* @__PURE__ */ new Set();
|
|
489
|
+
let pendingSelectValue = null;
|
|
490
|
+
if (node.nodeType === Node.TEXT_NODE) {
|
|
491
|
+
return node.cloneNode(true);
|
|
530
492
|
}
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
}
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
return spacer;
|
|
543
|
-
}
|
|
544
|
-
if (options.exclude && Array.isArray(options.exclude)) {
|
|
545
|
-
for (const selector of options.exclude) {
|
|
546
|
-
try {
|
|
547
|
-
if ((_a = node.matches) == null ? void 0 : _a.call(node, selector)) {
|
|
548
|
-
const spacer = document.createElement("div");
|
|
549
|
-
const rect = node.getBoundingClientRect();
|
|
550
|
-
spacer.style.cssText = `display: inline-block; width: ${rect.width}px; height: ${rect.height}px; visibility: hidden;`;
|
|
551
|
-
return spacer;
|
|
552
|
-
}
|
|
553
|
-
} catch (err) {
|
|
554
|
-
console.warn(`Invalid selector in exclude option: ${selector}`, err);
|
|
555
|
-
}
|
|
556
|
-
}
|
|
557
|
-
}
|
|
558
|
-
if (typeof options.filter === "function") {
|
|
493
|
+
if (node.nodeType !== Node.ELEMENT_NODE) {
|
|
494
|
+
return node.cloneNode(true);
|
|
495
|
+
}
|
|
496
|
+
if (node.getAttribute("data-capture") === "exclude") {
|
|
497
|
+
const spacer = document.createElement("div");
|
|
498
|
+
const rect = node.getBoundingClientRect();
|
|
499
|
+
spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
|
|
500
|
+
return spacer;
|
|
501
|
+
}
|
|
502
|
+
if (options.exclude && Array.isArray(options.exclude)) {
|
|
503
|
+
for (const selector of options.exclude) {
|
|
559
504
|
try {
|
|
560
|
-
if (
|
|
505
|
+
if ((_a = node.matches) == null ? void 0 : _a.call(node, selector)) {
|
|
561
506
|
const spacer = document.createElement("div");
|
|
562
507
|
const rect = node.getBoundingClientRect();
|
|
563
|
-
spacer.style.cssText = `display:
|
|
508
|
+
spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
|
|
564
509
|
return spacer;
|
|
565
510
|
}
|
|
566
511
|
} catch (err) {
|
|
567
|
-
console.warn(
|
|
512
|
+
console.warn(`Invalid selector in exclude option: ${selector}`, err);
|
|
568
513
|
}
|
|
569
514
|
}
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
fallback.textContent = "";
|
|
573
|
-
fallback.style.cssText = `width: ${node.offsetWidth}px; height: ${node.offsetHeight}px; background-image: repeating-linear-gradient(45deg, #ddd, #ddd 5px, #f9f9f9 5px, #f9f9f9 10px);display: flex;align-items: center;justify-content: center;font-size: 12px;color: #555; border: 1px solid #aaa;`;
|
|
574
|
-
return fallback;
|
|
575
|
-
}
|
|
576
|
-
if (node.getAttribute("data-capture") === "placeholder") {
|
|
577
|
-
const clone2 = node.cloneNode(false);
|
|
578
|
-
cache.preNodeMap.set(clone2, node);
|
|
579
|
-
inlineAllStyles(node, clone2, compress);
|
|
580
|
-
const placeholder = document.createElement("div");
|
|
581
|
-
placeholder.textContent = node.getAttribute("data-placeholder-text") || "";
|
|
582
|
-
placeholder.style.cssText = `color: #666;font-size: 12px;text-align: center;line-height: 1.4;padding: 0.5em;box-sizing: border-box;`;
|
|
583
|
-
clone2.appendChild(placeholder);
|
|
584
|
-
return clone2;
|
|
585
|
-
}
|
|
586
|
-
if (node.tagName === "CANVAS") {
|
|
587
|
-
const dataURL = node.toDataURL();
|
|
588
|
-
const img = document.createElement("img");
|
|
589
|
-
img.src = dataURL;
|
|
590
|
-
img.width = node.width;
|
|
591
|
-
img.height = node.height;
|
|
592
|
-
cache.preNodeMap.set(img, node);
|
|
593
|
-
inlineAllStyles(node, img, compress);
|
|
594
|
-
return img;
|
|
595
|
-
}
|
|
596
|
-
let clone;
|
|
515
|
+
}
|
|
516
|
+
if (typeof options.filter === "function") {
|
|
597
517
|
try {
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
518
|
+
if (!options.filter(node, originalRoot || node)) {
|
|
519
|
+
const spacer = document.createElement("div");
|
|
520
|
+
const rect = node.getBoundingClientRect();
|
|
521
|
+
spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
|
|
522
|
+
return spacer;
|
|
601
523
|
}
|
|
602
|
-
cache.preNodeMap.set(clone, node);
|
|
603
524
|
} catch (err) {
|
|
604
|
-
console.
|
|
605
|
-
throw err;
|
|
525
|
+
console.warn("Error in filter function:", err);
|
|
606
526
|
}
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
527
|
+
}
|
|
528
|
+
if (node.tagName === "IFRAME") {
|
|
529
|
+
const fallback = document.createElement("div");
|
|
530
|
+
fallback.style.cssText = `width:${node.offsetWidth}px;height:${node.offsetHeight}px;background-image:repeating-linear-gradient(45deg,#ddd,#ddd 5px,#f9f9f9 5px,#f9f9f9 10px);display:flex;align-items:center;justify-content:center;font-size:12px;color:#555;border:1px solid #aaa;`;
|
|
531
|
+
return fallback;
|
|
532
|
+
}
|
|
533
|
+
if (node.getAttribute("data-capture") === "placeholder") {
|
|
534
|
+
const clone2 = node.cloneNode(false);
|
|
535
|
+
cache.preNodeMap.set(clone2, node);
|
|
536
|
+
inlineAllStyles(node, clone2, compress);
|
|
537
|
+
const placeholder = document.createElement("div");
|
|
538
|
+
placeholder.textContent = node.getAttribute("data-placeholder-text") || "";
|
|
539
|
+
placeholder.style.cssText = `color:#666;font-size:12px;text-align:center;line-height:1.4;padding:0.5em;box-sizing:border-box;`;
|
|
540
|
+
clone2.appendChild(placeholder);
|
|
541
|
+
return clone2;
|
|
542
|
+
}
|
|
543
|
+
if (node.tagName === "CANVAS") {
|
|
544
|
+
const dataURL = node.toDataURL();
|
|
545
|
+
const img = document.createElement("img");
|
|
546
|
+
img.src = dataURL;
|
|
547
|
+
img.width = node.width;
|
|
548
|
+
img.height = node.height;
|
|
549
|
+
cache.preNodeMap.set(img, node);
|
|
550
|
+
inlineAllStyles(node, img, compress);
|
|
551
|
+
return img;
|
|
552
|
+
}
|
|
553
|
+
let clone;
|
|
554
|
+
try {
|
|
555
|
+
clone = node.cloneNode(false);
|
|
556
|
+
cache.preNodeMap.set(clone, node);
|
|
557
|
+
} catch (err) {
|
|
558
|
+
console.error("[Snapdom] Failed to clone node:", node, err);
|
|
559
|
+
throw err;
|
|
560
|
+
}
|
|
561
|
+
if (node instanceof HTMLTextAreaElement) {
|
|
562
|
+
clone.textContent = node.value;
|
|
563
|
+
clone.value = node.value;
|
|
564
|
+
const rect = node.getBoundingClientRect();
|
|
565
|
+
clone.style.width = `${rect.width}px`;
|
|
566
|
+
clone.style.height = `${rect.height}px`;
|
|
567
|
+
return clone;
|
|
568
|
+
}
|
|
569
|
+
if (node instanceof HTMLInputElement) {
|
|
570
|
+
clone.value = node.value;
|
|
571
|
+
clone.setAttribute("value", node.value);
|
|
572
|
+
if (node.checked !== void 0) {
|
|
573
|
+
clone.checked = node.checked;
|
|
574
|
+
if (node.checked) clone.setAttribute("checked", "");
|
|
575
|
+
if (node.indeterminate) clone.indeterminate = node.indeterminate;
|
|
628
576
|
}
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
634
|
-
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
} else {
|
|
645
|
-
const baseChildren = node.shadowRoot ? node.shadowRoot.childNodes : node.childNodes;
|
|
646
|
-
for (const child of baseChildren) {
|
|
647
|
-
try {
|
|
648
|
-
const clonedChild = deepClone(child, compress, options, originalRoot || node);
|
|
649
|
-
if (clonedChild) clone.appendChild(clonedChild);
|
|
650
|
-
} catch (err) {
|
|
651
|
-
console.warn("[Snapdom] Failed to clone child node:", child, err);
|
|
577
|
+
return clone;
|
|
578
|
+
}
|
|
579
|
+
if (node instanceof HTMLSelectElement) {
|
|
580
|
+
pendingSelectValue = node.value;
|
|
581
|
+
}
|
|
582
|
+
inlineAllStyles(node, clone, compress);
|
|
583
|
+
if (node.shadowRoot) {
|
|
584
|
+
const hasSlot = Array.from(node.shadowRoot.querySelectorAll("slot")).length > 0;
|
|
585
|
+
if (hasSlot) {
|
|
586
|
+
for (const child of node.shadowRoot.childNodes) {
|
|
587
|
+
if (child.nodeType === Node.ELEMENT_NODE && child.tagName === "STYLE") {
|
|
588
|
+
const cssText = child.textContent || "";
|
|
589
|
+
if (cssText.trim() && compress) {
|
|
590
|
+
if (!cache.preStyle) cache.preStyle = /* @__PURE__ */ new WeakMap();
|
|
591
|
+
cache.preStyle.set(child, cssText);
|
|
652
592
|
}
|
|
653
593
|
}
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
594
|
+
}
|
|
595
|
+
} else {
|
|
596
|
+
const shadowFrag = document.createDocumentFragment();
|
|
597
|
+
for (const child of node.shadowRoot.childNodes) {
|
|
598
|
+
if (child.nodeType === Node.ELEMENT_NODE && child.tagName === "STYLE") {
|
|
599
|
+
const cssText = child.textContent || "";
|
|
600
|
+
if (cssText.trim() && compress) {
|
|
601
|
+
if (!cache.preStyle) cache.preStyle = /* @__PURE__ */ new WeakMap();
|
|
602
|
+
cache.preStyle.set(child, cssText);
|
|
663
603
|
}
|
|
664
|
-
|
|
604
|
+
continue;
|
|
665
605
|
}
|
|
606
|
+
const clonedChild = deepClone(child, compress, options, originalRoot || node);
|
|
607
|
+
if (clonedChild) shadowFrag.appendChild(clonedChild);
|
|
666
608
|
}
|
|
667
|
-
|
|
668
|
-
console.error("[Snapdom] Error cloning children:", err);
|
|
669
|
-
throw err;
|
|
609
|
+
clone.appendChild(shadowFrag);
|
|
670
610
|
}
|
|
671
|
-
return clone;
|
|
672
|
-
} catch (error) {
|
|
673
|
-
console.error("[Snapdom] Error in deepClone:", error);
|
|
674
|
-
throw error;
|
|
675
611
|
}
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
612
|
+
if (node.tagName === "SLOT") {
|
|
613
|
+
const assigned = ((_b = node.assignedNodes) == null ? void 0 : _b.call(node, { flatten: true })) || [];
|
|
614
|
+
const nodesToClone = assigned.length > 0 ? assigned : Array.from(node.childNodes);
|
|
615
|
+
const fragment = document.createDocumentFragment();
|
|
616
|
+
for (const child of nodesToClone) {
|
|
617
|
+
const clonedChild = deepClone(child, compress, options, originalRoot || node);
|
|
618
|
+
if (clonedChild) fragment.appendChild(clonedChild);
|
|
619
|
+
}
|
|
620
|
+
return fragment;
|
|
681
621
|
}
|
|
682
|
-
|
|
622
|
+
for (const child of node.childNodes) {
|
|
623
|
+
if (clonedAssignedNodes.has(child)) continue;
|
|
624
|
+
const clonedChild = deepClone(child, compress, options, originalRoot || node);
|
|
625
|
+
if (clonedChild) clone.appendChild(clonedChild);
|
|
626
|
+
}
|
|
627
|
+
if (pendingSelectValue !== null && clone instanceof HTMLSelectElement) {
|
|
628
|
+
clone.value = pendingSelectValue;
|
|
629
|
+
for (const opt of clone.options) {
|
|
630
|
+
if (opt.value === pendingSelectValue) {
|
|
631
|
+
opt.setAttribute("selected", "");
|
|
632
|
+
} else {
|
|
633
|
+
opt.removeAttribute("selected");
|
|
634
|
+
}
|
|
635
|
+
}
|
|
636
|
+
}
|
|
637
|
+
return clone;
|
|
638
|
+
}
|
|
683
639
|
|
|
684
640
|
// src/modules/iconFonts.js
|
|
641
|
+
var defaultIconFonts = [
|
|
642
|
+
// /uicons/i,
|
|
643
|
+
/font\s*awesome/i,
|
|
644
|
+
/material\s*icons/i,
|
|
645
|
+
/ionicons/i,
|
|
646
|
+
/glyphicons/i,
|
|
647
|
+
/feather/i,
|
|
648
|
+
/bootstrap\s*icons/i,
|
|
649
|
+
/remix\s*icons/i,
|
|
650
|
+
/heroicons/i,
|
|
651
|
+
/layui/i,
|
|
652
|
+
/lucide/i
|
|
653
|
+
];
|
|
654
|
+
var userIconFonts = [];
|
|
685
655
|
function extendIconFonts(fonts) {
|
|
686
656
|
const list = Array.isArray(fonts) ? fonts : [fonts];
|
|
687
657
|
for (const f of list) {
|
|
@@ -703,25 +673,6 @@
|
|
|
703
673
|
if (/icon/i.test(text) || /glyph/i.test(text) || /symbols/i.test(text) || /feather/i.test(text) || /fontawesome/i.test(text)) return true;
|
|
704
674
|
return false;
|
|
705
675
|
}
|
|
706
|
-
var defaultIconFonts, userIconFonts;
|
|
707
|
-
var init_iconFonts = __esm({
|
|
708
|
-
"src/modules/iconFonts.js"() {
|
|
709
|
-
defaultIconFonts = [
|
|
710
|
-
// /uicons/i,
|
|
711
|
-
/font\s*awesome/i,
|
|
712
|
-
/material\s*icons/i,
|
|
713
|
-
/ionicons/i,
|
|
714
|
-
/glyphicons/i,
|
|
715
|
-
/feather/i,
|
|
716
|
-
/bootstrap\s*icons/i,
|
|
717
|
-
/remix\s*icons/i,
|
|
718
|
-
/heroicons/i,
|
|
719
|
-
/layui/i,
|
|
720
|
-
/lucide/i
|
|
721
|
-
];
|
|
722
|
-
userIconFonts = [];
|
|
723
|
-
}
|
|
724
|
-
});
|
|
725
676
|
|
|
726
677
|
// src/modules/fonts.js
|
|
727
678
|
function iconToImage(unicodeChar, fontFamily, fontWeight, fontSize = 32, color = "#000") {
|
|
@@ -846,6 +797,13 @@
|
|
|
846
797
|
const family = rule.style.getPropertyValue("font-family");
|
|
847
798
|
if (!src || isIconFont(family)) continue;
|
|
848
799
|
const urlRegex = /url\((["']?)([^"')]+)\1\)/g;
|
|
800
|
+
const localRegex = /local\((["']?)[^)]+?\1\)/g;
|
|
801
|
+
const hasURL = urlRegex.test(src);
|
|
802
|
+
const hasLocal = localRegex.test(src);
|
|
803
|
+
if (!hasURL && hasLocal) {
|
|
804
|
+
finalCSS += `@font-face{font-family:${family};src:${src};font-style:${rule.style.getPropertyValue("font-style") || "normal"};font-weight:${rule.style.getPropertyValue("font-weight") || "normal"};}`;
|
|
805
|
+
continue;
|
|
806
|
+
}
|
|
849
807
|
let inlinedSrc = src;
|
|
850
808
|
const matches = Array.from(src.matchAll(urlRegex));
|
|
851
809
|
for (const match of matches) {
|
|
@@ -877,13 +835,7 @@
|
|
|
877
835
|
console.warn("[snapdom] Failed to fetch font URL:", url);
|
|
878
836
|
}
|
|
879
837
|
}
|
|
880
|
-
finalCSS += `@font-face {
|
|
881
|
-
font-family: ${family};
|
|
882
|
-
src: ${inlinedSrc};
|
|
883
|
-
font-style: ${rule.style.getPropertyValue("font-style") || "normal"};
|
|
884
|
-
font-weight: ${rule.style.getPropertyValue("font-weight") || "normal"};
|
|
885
|
-
}
|
|
886
|
-
`;
|
|
838
|
+
finalCSS += `@font-face{font-family:${family};src:${inlinedSrc};font-style:${rule.style.getPropertyValue("font-style") || "normal"};font-weight:${rule.style.getPropertyValue("font-weight") || "normal"};}`;
|
|
887
839
|
}
|
|
888
840
|
}
|
|
889
841
|
}
|
|
@@ -916,13 +868,7 @@
|
|
|
916
868
|
}
|
|
917
869
|
}
|
|
918
870
|
}
|
|
919
|
-
finalCSS += `@font-face {
|
|
920
|
-
font-family: '${font.family}';
|
|
921
|
-
src: url(${b64});
|
|
922
|
-
font-style: ${font.style || "normal"};
|
|
923
|
-
font-weight: ${font.weight || "normal"};
|
|
924
|
-
}
|
|
925
|
-
`;
|
|
871
|
+
finalCSS += `@font-face{font-family:'${font.family}';src:url(${b64});font-style:${font.style || "normal"};font-weight:${font.weight || "normal"};}`;
|
|
926
872
|
}
|
|
927
873
|
}
|
|
928
874
|
if (finalCSS) {
|
|
@@ -937,13 +883,6 @@
|
|
|
937
883
|
return finalCSS;
|
|
938
884
|
});
|
|
939
885
|
}
|
|
940
|
-
var init_fonts = __esm({
|
|
941
|
-
"src/modules/fonts.js"() {
|
|
942
|
-
init_helpers();
|
|
943
|
-
init_cache();
|
|
944
|
-
init_iconFonts();
|
|
945
|
-
}
|
|
946
|
-
});
|
|
947
886
|
|
|
948
887
|
// src/modules/pseudo.js
|
|
949
888
|
function inlinePseudoElements(source, clone, compress, embedFonts = false, useProxy) {
|
|
@@ -994,7 +933,12 @@
|
|
|
994
933
|
const key = getStyleKey(snapshot, "span", compress);
|
|
995
934
|
cache.preStyleMap.set(pseudoEl, key);
|
|
996
935
|
const isIconFont2 = isIconFont(fontFamily);
|
|
997
|
-
|
|
936
|
+
let cleanContent;
|
|
937
|
+
if (/counter\s*\(|counters\s*\(/.test(content)) {
|
|
938
|
+
cleanContent = "- ";
|
|
939
|
+
} else {
|
|
940
|
+
cleanContent = parseContent(content);
|
|
941
|
+
}
|
|
998
942
|
if (isIconFont2 && cleanContent.length === 1) {
|
|
999
943
|
const imgEl = document.createElement("img");
|
|
1000
944
|
imgEl.src = yield iconToImage(cleanContent, fontFamily, fontWeight, fontSize, color);
|
|
@@ -1050,15 +994,6 @@
|
|
|
1050
994
|
}
|
|
1051
995
|
});
|
|
1052
996
|
}
|
|
1053
|
-
var init_pseudo = __esm({
|
|
1054
|
-
"src/modules/pseudo.js"() {
|
|
1055
|
-
init_helpers();
|
|
1056
|
-
init_cssTools();
|
|
1057
|
-
init_fonts();
|
|
1058
|
-
init_iconFonts();
|
|
1059
|
-
init_cache();
|
|
1060
|
-
}
|
|
1061
|
-
});
|
|
1062
997
|
|
|
1063
998
|
// src/modules/svgDefs.js
|
|
1064
999
|
function inlineExternalDef(root) {
|
|
@@ -1089,10 +1024,6 @@
|
|
|
1089
1024
|
}
|
|
1090
1025
|
});
|
|
1091
1026
|
}
|
|
1092
|
-
var init_svgDefs = __esm({
|
|
1093
|
-
"src/modules/svgDefs.js"() {
|
|
1094
|
-
}
|
|
1095
|
-
});
|
|
1096
1027
|
|
|
1097
1028
|
// src/core/prepare.js
|
|
1098
1029
|
function prepareClone(_0) {
|
|
@@ -1176,16 +1107,6 @@
|
|
|
1176
1107
|
return { clone, classCSS };
|
|
1177
1108
|
});
|
|
1178
1109
|
}
|
|
1179
|
-
var init_prepare = __esm({
|
|
1180
|
-
"src/core/prepare.js"() {
|
|
1181
|
-
init_cssTools();
|
|
1182
|
-
init_helpers();
|
|
1183
|
-
init_clone();
|
|
1184
|
-
init_pseudo();
|
|
1185
|
-
init_svgDefs();
|
|
1186
|
-
init_cache();
|
|
1187
|
-
}
|
|
1188
|
-
});
|
|
1189
1110
|
|
|
1190
1111
|
// src/modules/images.js
|
|
1191
1112
|
function inlineImages(_0) {
|
|
@@ -1211,11 +1132,6 @@
|
|
|
1211
1132
|
}
|
|
1212
1133
|
});
|
|
1213
1134
|
}
|
|
1214
|
-
var init_images = __esm({
|
|
1215
|
-
"src/modules/images.js"() {
|
|
1216
|
-
init_helpers();
|
|
1217
|
-
}
|
|
1218
|
-
});
|
|
1219
1135
|
|
|
1220
1136
|
// src/modules/background.js
|
|
1221
1137
|
function inlineBackgroundImages(_0, _1) {
|
|
@@ -1258,12 +1174,6 @@
|
|
|
1258
1174
|
}
|
|
1259
1175
|
});
|
|
1260
1176
|
}
|
|
1261
|
-
var init_background = __esm({
|
|
1262
|
-
"src/modules/background.js"() {
|
|
1263
|
-
init_helpers();
|
|
1264
|
-
init_cache();
|
|
1265
|
-
}
|
|
1266
|
-
});
|
|
1267
1177
|
|
|
1268
1178
|
// src/core/capture.js
|
|
1269
1179
|
function captureDOM(_0) {
|
|
@@ -1370,17 +1280,6 @@
|
|
|
1370
1280
|
return dataURL;
|
|
1371
1281
|
});
|
|
1372
1282
|
}
|
|
1373
|
-
var init_capture = __esm({
|
|
1374
|
-
"src/core/capture.js"() {
|
|
1375
|
-
init_prepare();
|
|
1376
|
-
init_images();
|
|
1377
|
-
init_background();
|
|
1378
|
-
init_helpers();
|
|
1379
|
-
init_cssTools();
|
|
1380
|
-
init_fonts();
|
|
1381
|
-
init_cache();
|
|
1382
|
-
}
|
|
1383
|
-
});
|
|
1384
1283
|
|
|
1385
1284
|
// src/api/snapdom.js
|
|
1386
1285
|
function toImg(_0, _1) {
|
|
@@ -1504,63 +1403,56 @@
|
|
|
1504
1403
|
return yield snapdom.capture(element, options);
|
|
1505
1404
|
});
|
|
1506
1405
|
}
|
|
1507
|
-
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
|
|
1511
|
-
|
|
1512
|
-
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1516
|
-
|
|
1517
|
-
|
|
1518
|
-
|
|
1519
|
-
|
|
1520
|
-
|
|
1521
|
-
|
|
1522
|
-
|
|
1523
|
-
|
|
1524
|
-
|
|
1525
|
-
|
|
1526
|
-
|
|
1527
|
-
|
|
1528
|
-
|
|
1529
|
-
|
|
1530
|
-
|
|
1531
|
-
|
|
1532
|
-
|
|
1533
|
-
|
|
1534
|
-
|
|
1535
|
-
|
|
1536
|
-
|
|
1537
|
-
|
|
1538
|
-
|
|
1539
|
-
|
|
1540
|
-
|
|
1541
|
-
|
|
1542
|
-
|
|
1543
|
-
|
|
1544
|
-
|
|
1545
|
-
|
|
1546
|
-
|
|
1547
|
-
|
|
1548
|
-
|
|
1549
|
-
|
|
1550
|
-
|
|
1551
|
-
|
|
1552
|
-
|
|
1553
|
-
|
|
1554
|
-
|
|
1555
|
-
|
|
1556
|
-
|
|
1557
|
-
"filename",
|
|
1558
|
-
"backgroundColor"
|
|
1559
|
-
]);
|
|
1560
|
-
const capture = yield snapdom.capture(el, rest);
|
|
1561
|
-
return yield capture.download({ format, filename, backgroundColor });
|
|
1562
|
-
});
|
|
1563
|
-
}
|
|
1406
|
+
snapdom.capture = (_0, ..._1) => __async(null, [_0, ..._1], function* (el, options = {}) {
|
|
1407
|
+
const url = yield captureDOM(el, options);
|
|
1408
|
+
const dpr = window.devicePixelRatio || 1;
|
|
1409
|
+
const scale = options.scale || 1;
|
|
1410
|
+
return {
|
|
1411
|
+
url,
|
|
1412
|
+
options,
|
|
1413
|
+
toRaw: () => url,
|
|
1414
|
+
toImg: () => toImg(url, { dpr, scale }),
|
|
1415
|
+
toCanvas: () => toCanvas(url, { dpr, scale }),
|
|
1416
|
+
toBlob: (options2) => toBlob(url, __spreadValues({ dpr, scale }, options2)),
|
|
1417
|
+
toPng: (options2) => toRasterImg(url, __spreadValues({ dpr, scale }, options2), "png"),
|
|
1418
|
+
toJpg: (options2) => toRasterImg(url, __spreadValues({ dpr, scale }, options2), "jpeg"),
|
|
1419
|
+
toWebp: (options2) => toRasterImg(url, __spreadValues({ dpr, scale }, options2), "webp"),
|
|
1420
|
+
download: ({ format = "png", filename = "capture", backgroundColor } = {}) => download(url, { dpr, scale, backgroundColor, format, filename })
|
|
1421
|
+
};
|
|
1422
|
+
});
|
|
1423
|
+
snapdom.toRaw = (el, options) => __async(null, null, function* () {
|
|
1424
|
+
return (yield snapdom.capture(el, options)).toRaw();
|
|
1425
|
+
});
|
|
1426
|
+
snapdom.toImg = (el, options) => __async(null, null, function* () {
|
|
1427
|
+
return (yield snapdom.capture(el, options)).toImg();
|
|
1428
|
+
});
|
|
1429
|
+
snapdom.toCanvas = (el, options) => __async(null, null, function* () {
|
|
1430
|
+
return (yield snapdom.capture(el, options)).toCanvas();
|
|
1431
|
+
});
|
|
1432
|
+
snapdom.toBlob = (el, options) => __async(null, null, function* () {
|
|
1433
|
+
return (yield snapdom.capture(el, options)).toBlob(options);
|
|
1434
|
+
});
|
|
1435
|
+
snapdom.toPng = (el, options) => __async(null, null, function* () {
|
|
1436
|
+
return (yield snapdom.capture(el, options)).toPng(options);
|
|
1437
|
+
});
|
|
1438
|
+
snapdom.toJpg = (el, options) => __async(null, null, function* () {
|
|
1439
|
+
return (yield snapdom.capture(el, options)).toJpg(options);
|
|
1440
|
+
});
|
|
1441
|
+
snapdom.toWebp = (el, options) => __async(null, null, function* () {
|
|
1442
|
+
return (yield snapdom.capture(el, options)).toWebp(options);
|
|
1443
|
+
});
|
|
1444
|
+
snapdom.download = (_0, ..._1) => __async(null, [_0, ..._1], function* (el, options = {}) {
|
|
1445
|
+
const _a = options, {
|
|
1446
|
+
format = "png",
|
|
1447
|
+
filename = "capture",
|
|
1448
|
+
backgroundColor
|
|
1449
|
+
} = _a, rest = __objRest(_a, [
|
|
1450
|
+
"format",
|
|
1451
|
+
"filename",
|
|
1452
|
+
"backgroundColor"
|
|
1453
|
+
]);
|
|
1454
|
+
const capture = yield snapdom.capture(el, rest);
|
|
1455
|
+
return yield capture.download({ format, filename, backgroundColor });
|
|
1564
1456
|
});
|
|
1565
1457
|
|
|
1566
1458
|
// src/api/preCache.js
|
|
@@ -1609,38 +1501,10 @@
|
|
|
1609
1501
|
yield Promise.all(promises);
|
|
1610
1502
|
});
|
|
1611
1503
|
}
|
|
1612
|
-
var init_preCache = __esm({
|
|
1613
|
-
"src/api/preCache.js"() {
|
|
1614
|
-
init_helpers();
|
|
1615
|
-
init_fonts();
|
|
1616
|
-
init_cssTools();
|
|
1617
|
-
init_cache();
|
|
1618
|
-
}
|
|
1619
|
-
});
|
|
1620
1504
|
|
|
1621
1505
|
// src/index.browser.js
|
|
1622
|
-
|
|
1623
|
-
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
window.snapdom = snapdom;
|
|
1627
|
-
if (typeof window !== "undefined") {
|
|
1628
|
-
window.snapdom = snapdom;
|
|
1629
|
-
window.preCache = preCache;
|
|
1630
|
-
}
|
|
1631
|
-
if (typeof module !== "undefined" && typeof module.exports !== "undefined") {
|
|
1632
|
-
module.exports = { snapdom, preCache };
|
|
1633
|
-
}
|
|
1634
|
-
if (typeof define === "function" && define.amd) {
|
|
1635
|
-
define([], function() {
|
|
1636
|
-
return { snapdom, preCache };
|
|
1637
|
-
});
|
|
1638
|
-
}
|
|
1639
|
-
if (typeof globalThis !== "undefined") {
|
|
1640
|
-
globalThis.snapdom = snapdom;
|
|
1641
|
-
globalThis.preCache = preCache;
|
|
1642
|
-
}
|
|
1643
|
-
}
|
|
1644
|
-
});
|
|
1645
|
-
require_index_browser();
|
|
1506
|
+
if (typeof window !== "undefined") {
|
|
1507
|
+
window.snapdom = snapdom;
|
|
1508
|
+
window.preCache = preCache;
|
|
1509
|
+
}
|
|
1646
1510
|
})();
|