@zumer/snapdom 1.9.6-dev.1 → 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 -412
- package/dist/snapdom.min.js +3 -15
- package/dist/snapdom.min.mjs +3 -15
- package/dist/snapdom.mjs +154 -163
- 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,178 +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
|
-
img.style.display = "inline-block";
|
|
593
|
-
img.style.width = node.style.width || `${node.width}px`;
|
|
594
|
-
img.style.height = node.style.height || `${node.height}px`;
|
|
595
|
-
return img;
|
|
596
|
-
}
|
|
597
|
-
let clone;
|
|
515
|
+
}
|
|
516
|
+
if (typeof options.filter === "function") {
|
|
598
517
|
try {
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
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;
|
|
602
523
|
}
|
|
603
|
-
cache.preNodeMap.set(clone, node);
|
|
604
524
|
} catch (err) {
|
|
605
|
-
console.
|
|
606
|
-
throw err;
|
|
525
|
+
console.warn("Error in filter function:", err);
|
|
607
526
|
}
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
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;
|
|
629
576
|
}
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
634
|
-
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
} else {
|
|
646
|
-
const baseChildren = node.shadowRoot ? node.shadowRoot.childNodes : node.childNodes;
|
|
647
|
-
for (const child of baseChildren) {
|
|
648
|
-
try {
|
|
649
|
-
const clonedChild = deepClone(child, compress, options, originalRoot || node);
|
|
650
|
-
if (clonedChild) clone.appendChild(clonedChild);
|
|
651
|
-
} catch (err) {
|
|
652
|
-
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);
|
|
653
592
|
}
|
|
654
593
|
}
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
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);
|
|
664
603
|
}
|
|
665
|
-
|
|
604
|
+
continue;
|
|
666
605
|
}
|
|
606
|
+
const clonedChild = deepClone(child, compress, options, originalRoot || node);
|
|
607
|
+
if (clonedChild) shadowFrag.appendChild(clonedChild);
|
|
667
608
|
}
|
|
668
|
-
|
|
669
|
-
console.error("[Snapdom] Error cloning children:", err);
|
|
670
|
-
throw err;
|
|
609
|
+
clone.appendChild(shadowFrag);
|
|
671
610
|
}
|
|
672
|
-
return clone;
|
|
673
|
-
} catch (error) {
|
|
674
|
-
console.error("[Snapdom] Error in deepClone:", error);
|
|
675
|
-
throw error;
|
|
676
611
|
}
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
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;
|
|
682
621
|
}
|
|
683
|
-
|
|
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
|
+
}
|
|
684
639
|
|
|
685
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 = [];
|
|
686
655
|
function extendIconFonts(fonts) {
|
|
687
656
|
const list = Array.isArray(fonts) ? fonts : [fonts];
|
|
688
657
|
for (const f of list) {
|
|
@@ -704,25 +673,6 @@
|
|
|
704
673
|
if (/icon/i.test(text) || /glyph/i.test(text) || /symbols/i.test(text) || /feather/i.test(text) || /fontawesome/i.test(text)) return true;
|
|
705
674
|
return false;
|
|
706
675
|
}
|
|
707
|
-
var defaultIconFonts, userIconFonts;
|
|
708
|
-
var init_iconFonts = __esm({
|
|
709
|
-
"src/modules/iconFonts.js"() {
|
|
710
|
-
defaultIconFonts = [
|
|
711
|
-
// /uicons/i,
|
|
712
|
-
/font\s*awesome/i,
|
|
713
|
-
/material\s*icons/i,
|
|
714
|
-
/ionicons/i,
|
|
715
|
-
/glyphicons/i,
|
|
716
|
-
/feather/i,
|
|
717
|
-
/bootstrap\s*icons/i,
|
|
718
|
-
/remix\s*icons/i,
|
|
719
|
-
/heroicons/i,
|
|
720
|
-
/layui/i,
|
|
721
|
-
/lucide/i
|
|
722
|
-
];
|
|
723
|
-
userIconFonts = [];
|
|
724
|
-
}
|
|
725
|
-
});
|
|
726
676
|
|
|
727
677
|
// src/modules/fonts.js
|
|
728
678
|
function iconToImage(unicodeChar, fontFamily, fontWeight, fontSize = 32, color = "#000") {
|
|
@@ -847,6 +797,13 @@
|
|
|
847
797
|
const family = rule.style.getPropertyValue("font-family");
|
|
848
798
|
if (!src || isIconFont(family)) continue;
|
|
849
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
|
+
}
|
|
850
807
|
let inlinedSrc = src;
|
|
851
808
|
const matches = Array.from(src.matchAll(urlRegex));
|
|
852
809
|
for (const match of matches) {
|
|
@@ -878,13 +835,7 @@
|
|
|
878
835
|
console.warn("[snapdom] Failed to fetch font URL:", url);
|
|
879
836
|
}
|
|
880
837
|
}
|
|
881
|
-
finalCSS += `@font-face {
|
|
882
|
-
font-family: ${family};
|
|
883
|
-
src: ${inlinedSrc};
|
|
884
|
-
font-style: ${rule.style.getPropertyValue("font-style") || "normal"};
|
|
885
|
-
font-weight: ${rule.style.getPropertyValue("font-weight") || "normal"};
|
|
886
|
-
}
|
|
887
|
-
`;
|
|
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"};}`;
|
|
888
839
|
}
|
|
889
840
|
}
|
|
890
841
|
}
|
|
@@ -917,13 +868,7 @@
|
|
|
917
868
|
}
|
|
918
869
|
}
|
|
919
870
|
}
|
|
920
|
-
finalCSS += `@font-face {
|
|
921
|
-
font-family: '${font.family}';
|
|
922
|
-
src: url(${b64});
|
|
923
|
-
font-style: ${font.style || "normal"};
|
|
924
|
-
font-weight: ${font.weight || "normal"};
|
|
925
|
-
}
|
|
926
|
-
`;
|
|
871
|
+
finalCSS += `@font-face{font-family:'${font.family}';src:url(${b64});font-style:${font.style || "normal"};font-weight:${font.weight || "normal"};}`;
|
|
927
872
|
}
|
|
928
873
|
}
|
|
929
874
|
if (finalCSS) {
|
|
@@ -938,13 +883,6 @@
|
|
|
938
883
|
return finalCSS;
|
|
939
884
|
});
|
|
940
885
|
}
|
|
941
|
-
var init_fonts = __esm({
|
|
942
|
-
"src/modules/fonts.js"() {
|
|
943
|
-
init_helpers();
|
|
944
|
-
init_cache();
|
|
945
|
-
init_iconFonts();
|
|
946
|
-
}
|
|
947
|
-
});
|
|
948
886
|
|
|
949
887
|
// src/modules/pseudo.js
|
|
950
888
|
function inlinePseudoElements(source, clone, compress, embedFonts = false, useProxy) {
|
|
@@ -995,7 +933,12 @@
|
|
|
995
933
|
const key = getStyleKey(snapshot, "span", compress);
|
|
996
934
|
cache.preStyleMap.set(pseudoEl, key);
|
|
997
935
|
const isIconFont2 = isIconFont(fontFamily);
|
|
998
|
-
|
|
936
|
+
let cleanContent;
|
|
937
|
+
if (/counter\s*\(|counters\s*\(/.test(content)) {
|
|
938
|
+
cleanContent = "- ";
|
|
939
|
+
} else {
|
|
940
|
+
cleanContent = parseContent(content);
|
|
941
|
+
}
|
|
999
942
|
if (isIconFont2 && cleanContent.length === 1) {
|
|
1000
943
|
const imgEl = document.createElement("img");
|
|
1001
944
|
imgEl.src = yield iconToImage(cleanContent, fontFamily, fontWeight, fontSize, color);
|
|
@@ -1051,15 +994,6 @@
|
|
|
1051
994
|
}
|
|
1052
995
|
});
|
|
1053
996
|
}
|
|
1054
|
-
var init_pseudo = __esm({
|
|
1055
|
-
"src/modules/pseudo.js"() {
|
|
1056
|
-
init_helpers();
|
|
1057
|
-
init_cssTools();
|
|
1058
|
-
init_fonts();
|
|
1059
|
-
init_iconFonts();
|
|
1060
|
-
init_cache();
|
|
1061
|
-
}
|
|
1062
|
-
});
|
|
1063
997
|
|
|
1064
998
|
// src/modules/svgDefs.js
|
|
1065
999
|
function inlineExternalDef(root) {
|
|
@@ -1090,10 +1024,6 @@
|
|
|
1090
1024
|
}
|
|
1091
1025
|
});
|
|
1092
1026
|
}
|
|
1093
|
-
var init_svgDefs = __esm({
|
|
1094
|
-
"src/modules/svgDefs.js"() {
|
|
1095
|
-
}
|
|
1096
|
-
});
|
|
1097
1027
|
|
|
1098
1028
|
// src/core/prepare.js
|
|
1099
1029
|
function prepareClone(_0) {
|
|
@@ -1177,16 +1107,6 @@
|
|
|
1177
1107
|
return { clone, classCSS };
|
|
1178
1108
|
});
|
|
1179
1109
|
}
|
|
1180
|
-
var init_prepare = __esm({
|
|
1181
|
-
"src/core/prepare.js"() {
|
|
1182
|
-
init_cssTools();
|
|
1183
|
-
init_helpers();
|
|
1184
|
-
init_clone();
|
|
1185
|
-
init_pseudo();
|
|
1186
|
-
init_svgDefs();
|
|
1187
|
-
init_cache();
|
|
1188
|
-
}
|
|
1189
|
-
});
|
|
1190
1110
|
|
|
1191
1111
|
// src/modules/images.js
|
|
1192
1112
|
function inlineImages(_0) {
|
|
@@ -1212,11 +1132,6 @@
|
|
|
1212
1132
|
}
|
|
1213
1133
|
});
|
|
1214
1134
|
}
|
|
1215
|
-
var init_images = __esm({
|
|
1216
|
-
"src/modules/images.js"() {
|
|
1217
|
-
init_helpers();
|
|
1218
|
-
}
|
|
1219
|
-
});
|
|
1220
1135
|
|
|
1221
1136
|
// src/modules/background.js
|
|
1222
1137
|
function inlineBackgroundImages(_0, _1) {
|
|
@@ -1259,12 +1174,6 @@
|
|
|
1259
1174
|
}
|
|
1260
1175
|
});
|
|
1261
1176
|
}
|
|
1262
|
-
var init_background = __esm({
|
|
1263
|
-
"src/modules/background.js"() {
|
|
1264
|
-
init_helpers();
|
|
1265
|
-
init_cache();
|
|
1266
|
-
}
|
|
1267
|
-
});
|
|
1268
1177
|
|
|
1269
1178
|
// src/core/capture.js
|
|
1270
1179
|
function captureDOM(_0) {
|
|
@@ -1371,17 +1280,6 @@
|
|
|
1371
1280
|
return dataURL;
|
|
1372
1281
|
});
|
|
1373
1282
|
}
|
|
1374
|
-
var init_capture = __esm({
|
|
1375
|
-
"src/core/capture.js"() {
|
|
1376
|
-
init_prepare();
|
|
1377
|
-
init_images();
|
|
1378
|
-
init_background();
|
|
1379
|
-
init_helpers();
|
|
1380
|
-
init_cssTools();
|
|
1381
|
-
init_fonts();
|
|
1382
|
-
init_cache();
|
|
1383
|
-
}
|
|
1384
|
-
});
|
|
1385
1283
|
|
|
1386
1284
|
// src/api/snapdom.js
|
|
1387
1285
|
function toImg(_0, _1) {
|
|
@@ -1505,63 +1403,56 @@
|
|
|
1505
1403
|
return yield snapdom.capture(element, options);
|
|
1506
1404
|
});
|
|
1507
1405
|
}
|
|
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
|
-
|
|
1558
|
-
"filename",
|
|
1559
|
-
"backgroundColor"
|
|
1560
|
-
]);
|
|
1561
|
-
const capture = yield snapdom.capture(el, rest);
|
|
1562
|
-
return yield capture.download({ format, filename, backgroundColor });
|
|
1563
|
-
});
|
|
1564
|
-
}
|
|
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 });
|
|
1565
1456
|
});
|
|
1566
1457
|
|
|
1567
1458
|
// src/api/preCache.js
|
|
@@ -1610,38 +1501,10 @@
|
|
|
1610
1501
|
yield Promise.all(promises);
|
|
1611
1502
|
});
|
|
1612
1503
|
}
|
|
1613
|
-
var init_preCache = __esm({
|
|
1614
|
-
"src/api/preCache.js"() {
|
|
1615
|
-
init_helpers();
|
|
1616
|
-
init_fonts();
|
|
1617
|
-
init_cssTools();
|
|
1618
|
-
init_cache();
|
|
1619
|
-
}
|
|
1620
|
-
});
|
|
1621
1504
|
|
|
1622
1505
|
// src/index.browser.js
|
|
1623
|
-
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
|
|
1627
|
-
window.snapdom = snapdom;
|
|
1628
|
-
if (typeof window !== "undefined") {
|
|
1629
|
-
window.snapdom = snapdom;
|
|
1630
|
-
window.preCache = preCache;
|
|
1631
|
-
}
|
|
1632
|
-
if (typeof module !== "undefined" && typeof module.exports !== "undefined") {
|
|
1633
|
-
module.exports = { snapdom, preCache };
|
|
1634
|
-
}
|
|
1635
|
-
if (typeof define === "function" && define.amd) {
|
|
1636
|
-
define([], function() {
|
|
1637
|
-
return { snapdom, preCache };
|
|
1638
|
-
});
|
|
1639
|
-
}
|
|
1640
|
-
if (typeof globalThis !== "undefined") {
|
|
1641
|
-
globalThis.snapdom = snapdom;
|
|
1642
|
-
globalThis.preCache = preCache;
|
|
1643
|
-
}
|
|
1644
|
-
}
|
|
1645
|
-
});
|
|
1646
|
-
require_index_browser();
|
|
1506
|
+
if (typeof window !== "undefined") {
|
|
1507
|
+
window.snapdom = snapdom;
|
|
1508
|
+
window.preCache = preCache;
|
|
1509
|
+
}
|
|
1647
1510
|
})();
|