@deot/vc-components 1.0.51 → 1.0.52
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/index.cjs +93 -11
- package/dist/index.d.ts +76 -28
- package/dist/index.iife.js +4246 -33
- package/dist/index.js +92 -10
- package/dist/index.umd.cjs +4246 -33
- package/package.json +2 -1
package/dist/index.umd.cjs
CHANGED
|
@@ -200,7 +200,7 @@
|
|
|
200
200
|
return target;
|
|
201
201
|
};
|
|
202
202
|
|
|
203
|
-
const getStyle$
|
|
203
|
+
const getStyle$2 = (el, name) => {
|
|
204
204
|
if (IS_SERVER$3 || !name) return "";
|
|
205
205
|
if (name === "float") {
|
|
206
206
|
name = "cssFloat";
|
|
@@ -216,8 +216,8 @@
|
|
|
216
216
|
const isScroller = (el, options) => {
|
|
217
217
|
if (IS_SERVER$3 || !el) return false;
|
|
218
218
|
const { className, direction } = options || {};
|
|
219
|
-
let overflow = getStyle$
|
|
220
|
-
overflow = overflow || getStyle$
|
|
219
|
+
let overflow = getStyle$2(el, `overflow-${direction ? "y" : "x"}`);
|
|
220
|
+
overflow = overflow || getStyle$2(el, "overflow");
|
|
221
221
|
return !!(overflow.match(/(scroll|auto)/) || className?.test(el.className));
|
|
222
222
|
};
|
|
223
223
|
|
|
@@ -7792,23 +7792,23 @@
|
|
|
7792
7792
|
...listeners
|
|
7793
7793
|
}), {
|
|
7794
7794
|
prepend: slots.prepend && (() => slots.prepend?.()),
|
|
7795
|
-
append:
|
|
7795
|
+
append: slots.append ? () => slots.append?.() : props.step ? () => {
|
|
7796
7796
|
return vue.createVNode("div", {
|
|
7797
7797
|
"class": "vc-input-number__icon"
|
|
7798
7798
|
}, [vue.createVNode("div", {
|
|
7799
7799
|
"class": "vc-input-number__up",
|
|
7800
|
-
"disabled": plusDisabled.value ? 'disabled' :
|
|
7800
|
+
"disabled": plusDisabled.value ? 'disabled' : void 0,
|
|
7801
7801
|
"onClick": e => handleStepper(e, 1)
|
|
7802
7802
|
}, [vue.createVNode(Icon, {
|
|
7803
7803
|
"type": "up"
|
|
7804
7804
|
}, null)]), vue.createVNode("div", {
|
|
7805
7805
|
"class": "vc-input-number__down",
|
|
7806
|
-
"disabled": minusDisabled.value ? 'disabled' :
|
|
7806
|
+
"disabled": minusDisabled.value ? 'disabled' : void 0,
|
|
7807
7807
|
"onClick": e => handleStepper(e, -1)
|
|
7808
7808
|
}, [vue.createVNode(Icon, {
|
|
7809
7809
|
"type": "down"
|
|
7810
7810
|
}, null)])]);
|
|
7811
|
-
} :
|
|
7811
|
+
} : void 0
|
|
7812
7812
|
});
|
|
7813
7813
|
};
|
|
7814
7814
|
}
|
|
@@ -17031,7 +17031,7 @@
|
|
|
17031
17031
|
* @returns {boolean}
|
|
17032
17032
|
*/
|
|
17033
17033
|
|
|
17034
|
-
function isSafari$
|
|
17034
|
+
function isSafari$2() {
|
|
17035
17035
|
return !!(navigator.vendor && navigator.vendor.match(/apple/i));
|
|
17036
17036
|
}
|
|
17037
17037
|
|
|
@@ -17909,7 +17909,7 @@
|
|
|
17909
17909
|
// that's because I want to show image before it's fully loaded,
|
|
17910
17910
|
// as browser can render parts of image while it is loading.
|
|
17911
17911
|
// We do not do this in Safari due to partial loading bug.
|
|
17912
|
-
if (supportsDecode && this.slide && (!this.slide.isActive || isSafari$
|
|
17912
|
+
if (supportsDecode && this.slide && (!this.slide.isActive || isSafari$2())) {
|
|
17913
17913
|
this.isDecoding = true; // purposefully using finally instead of then,
|
|
17914
17914
|
// as if srcset sizes changes dynamically - it may cause decode error
|
|
17915
17915
|
|
|
@@ -17940,7 +17940,7 @@
|
|
|
17940
17940
|
return;
|
|
17941
17941
|
}
|
|
17942
17942
|
|
|
17943
|
-
if (this.isImageContent() && this.isDecoding && !isSafari$
|
|
17943
|
+
if (this.isImageContent() && this.isDecoding && !isSafari$2()) {
|
|
17944
17944
|
// add image to slide when it becomes active,
|
|
17945
17945
|
// even if it's not finished decoding
|
|
17946
17946
|
this.appendImage();
|
|
@@ -20660,27 +20660,109 @@
|
|
|
20660
20660
|
tag: {
|
|
20661
20661
|
type: String,
|
|
20662
20662
|
default: "div"
|
|
20663
|
+
},
|
|
20664
|
+
// useCORS
|
|
20665
|
+
crossOrigin: {
|
|
20666
|
+
type: String,
|
|
20667
|
+
// ''. 'anonymous', 'use-credentials'
|
|
20668
|
+
default: "anonymous",
|
|
20669
|
+
validator: (v) => /^(|anonymous|use-credentials)$/.test(v)
|
|
20670
|
+
},
|
|
20671
|
+
transformSource: Function,
|
|
20672
|
+
// 传递给snap-dom的配置项
|
|
20673
|
+
options: {
|
|
20674
|
+
type: Object,
|
|
20675
|
+
default: () => ({})
|
|
20663
20676
|
}
|
|
20664
20677
|
};
|
|
20665
20678
|
|
|
20666
20679
|
/** @jsxImportSource vue */
|
|
20667
20680
|
|
|
20668
|
-
const COMPONENT_NAME$Z = 'vc-
|
|
20669
|
-
const
|
|
20681
|
+
const COMPONENT_NAME$Z = 'vc-snapshot';
|
|
20682
|
+
const Snapshot = /* @__PURE__ */ vue.defineComponent({
|
|
20670
20683
|
name: COMPONENT_NAME$Z,
|
|
20671
20684
|
props: props$H,
|
|
20685
|
+
emits: ['ready'],
|
|
20672
20686
|
setup(props, {
|
|
20673
|
-
|
|
20687
|
+
emit,
|
|
20688
|
+
slots,
|
|
20689
|
+
expose
|
|
20674
20690
|
}) {
|
|
20691
|
+
const current = vue.ref();
|
|
20692
|
+
const instance = vue.ref();
|
|
20693
|
+
|
|
20694
|
+
// 网络的图片如果没有加上crossOrigin,且没有放在第一个就会出现问题(Safari)
|
|
20695
|
+
const refresh = async () => {
|
|
20696
|
+
if (!props.crossOrigin) return;
|
|
20697
|
+
const transformSource = props.transformSource || VcInstance.options.Snapshot?.transformSource || (v => v);
|
|
20698
|
+
return Promise.all(Array.from(current.value.querySelectorAll('img')).map(node => {
|
|
20699
|
+
return new Promise(resolve => {
|
|
20700
|
+
(async () => {
|
|
20701
|
+
let url;
|
|
20702
|
+
try {
|
|
20703
|
+
url = await transformSource(node.src);
|
|
20704
|
+
} catch (e) {
|
|
20705
|
+
console.error(e);
|
|
20706
|
+
}
|
|
20707
|
+
const image = new Image();
|
|
20708
|
+
image.crossOrigin = props.crossOrigin;
|
|
20709
|
+
image.src = `${url}?=${new Date().getTime()}`; // 强制不缓存
|
|
20710
|
+
image.onload = () => {
|
|
20711
|
+
node.src = image.src;
|
|
20712
|
+
resolve(1);
|
|
20713
|
+
};
|
|
20714
|
+
image.onerror = () => resolve(0);
|
|
20715
|
+
})();
|
|
20716
|
+
});
|
|
20717
|
+
}));
|
|
20718
|
+
};
|
|
20719
|
+
const toDataURL = async () => {
|
|
20720
|
+
await refresh();
|
|
20721
|
+
return instance.value.toRaw();
|
|
20722
|
+
};
|
|
20723
|
+
const download = async options => {
|
|
20724
|
+
await refresh();
|
|
20725
|
+
const _download = VcInstance.options.Snapshot?.download || (() => false);
|
|
20726
|
+
const allow = _download(options);
|
|
20727
|
+
if (allow && allow.then) {
|
|
20728
|
+
allow.catch(() => {
|
|
20729
|
+
instance.value.download(options);
|
|
20730
|
+
});
|
|
20731
|
+
return;
|
|
20732
|
+
}
|
|
20733
|
+
allow || instance.value.download(options);
|
|
20734
|
+
};
|
|
20735
|
+
expose({
|
|
20736
|
+
instance,
|
|
20737
|
+
refresh,
|
|
20738
|
+
toDataURL,
|
|
20739
|
+
download
|
|
20740
|
+
});
|
|
20741
|
+
vue.onMounted(async () => {
|
|
20742
|
+
try {
|
|
20743
|
+
let snapDOM = window.snapdom || (await Promise.resolve().then(() => snapdom$1));
|
|
20744
|
+
snapDOM = snapDOM.snapdom || snapDOM;
|
|
20745
|
+
instance.value = await snapDOM(current.value, props.options);
|
|
20746
|
+
emit('ready', {
|
|
20747
|
+
instance: instance.value,
|
|
20748
|
+
dependencies: {
|
|
20749
|
+
snapDOM
|
|
20750
|
+
}
|
|
20751
|
+
});
|
|
20752
|
+
} catch (e) {
|
|
20753
|
+
throw new VcError('snapshot', e);
|
|
20754
|
+
}
|
|
20755
|
+
});
|
|
20675
20756
|
return () => {
|
|
20676
20757
|
return vue.createVNode("div", {
|
|
20677
|
-
"
|
|
20758
|
+
"ref": current,
|
|
20759
|
+
"class": "vc-snapshot"
|
|
20678
20760
|
}, [slots?.default?.()]);
|
|
20679
20761
|
};
|
|
20680
20762
|
}
|
|
20681
20763
|
});
|
|
20682
20764
|
|
|
20683
|
-
const
|
|
20765
|
+
const MSnapshot = Snapshot;
|
|
20684
20766
|
|
|
20685
20767
|
const MIcon = Icon;
|
|
20686
20768
|
|
|
@@ -27202,7 +27284,7 @@
|
|
|
27202
27284
|
let hiddenEl$1;
|
|
27203
27285
|
const getFitIndex = (options = {}) => {
|
|
27204
27286
|
const { el, line, value, suffix, indent = 0 } = options;
|
|
27205
|
-
let lineHeight = parseInt(getStyle$
|
|
27287
|
+
let lineHeight = parseInt(getStyle$2(el, "line-height"), 10);
|
|
27206
27288
|
if (!hiddenEl$1) {
|
|
27207
27289
|
hiddenEl$1 = document.createElement("div");
|
|
27208
27290
|
document.body.appendChild(hiddenEl$1);
|
|
@@ -27214,7 +27296,7 @@
|
|
|
27214
27296
|
boxSizing,
|
|
27215
27297
|
sizingStyle
|
|
27216
27298
|
} = utils.getComputedStyle(el, SIZING_STYLE$1);
|
|
27217
|
-
const textIndent = `text-indent: ${parseInt(getStyle$
|
|
27299
|
+
const textIndent = `text-indent: ${parseInt(getStyle$2(el, "text-indent"), 10) + indent}px;`;
|
|
27218
27300
|
hiddenEl$1.setAttribute("style", `${sizingStyle};${textIndent};${HIDDEN_TEXT_STYLE}`);
|
|
27219
27301
|
let sideHeight = paddingSize || 0;
|
|
27220
27302
|
boxSizing === "border-box" && (sideHeight += borderSize);
|
|
@@ -56023,10 +56105,10 @@
|
|
|
56023
56105
|
return styleChanged;
|
|
56024
56106
|
}
|
|
56025
56107
|
function bindPathAndTextCommonStyle(ctx, el, prevEl, forceSetAll, scope) {
|
|
56026
|
-
var style = getStyle(el, scope.inHover);
|
|
56108
|
+
var style = getStyle$1(el, scope.inHover);
|
|
56027
56109
|
var prevStyle = forceSetAll
|
|
56028
56110
|
? null
|
|
56029
|
-
: (prevEl && getStyle(prevEl, scope.inHover) || {});
|
|
56111
|
+
: (prevEl && getStyle$1(prevEl, scope.inHover) || {});
|
|
56030
56112
|
if (style === prevStyle) {
|
|
56031
56113
|
return false;
|
|
56032
56114
|
}
|
|
@@ -56077,7 +56159,7 @@
|
|
|
56077
56159
|
return styleChanged;
|
|
56078
56160
|
}
|
|
56079
56161
|
function bindImageStyle(ctx, el, prevEl, forceSetAll, scope) {
|
|
56080
|
-
return bindCommonProps(ctx, getStyle(el, scope.inHover), prevEl && getStyle(prevEl, scope.inHover), forceSetAll, scope);
|
|
56162
|
+
return bindCommonProps(ctx, getStyle$1(el, scope.inHover), prevEl && getStyle$1(prevEl, scope.inHover), forceSetAll, scope);
|
|
56081
56163
|
}
|
|
56082
56164
|
function setContextTransform(ctx, el) {
|
|
56083
56165
|
var m = el.transform;
|
|
@@ -56136,7 +56218,7 @@
|
|
|
56136
56218
|
scope.batchFill = '';
|
|
56137
56219
|
scope.batchStroke = '';
|
|
56138
56220
|
}
|
|
56139
|
-
function getStyle(el, inHover) {
|
|
56221
|
+
function getStyle$1(el, inHover) {
|
|
56140
56222
|
return inHover ? (el.__hoverStyle || el.style) : el.style;
|
|
56141
56223
|
}
|
|
56142
56224
|
function brushSingle(ctx, el) {
|
|
@@ -56190,7 +56272,7 @@
|
|
|
56190
56272
|
else if (!canBatchPath) {
|
|
56191
56273
|
flushPathDrawn(ctx, scope);
|
|
56192
56274
|
}
|
|
56193
|
-
var style = getStyle(el, scope.inHover);
|
|
56275
|
+
var style = getStyle$1(el, scope.inHover);
|
|
56194
56276
|
if (el instanceof Path) {
|
|
56195
56277
|
if (scope.lastDrawType !== DRAW_TYPE_PATH) {
|
|
56196
56278
|
forceSetStyle = true;
|
|
@@ -73577,7 +73659,7 @@
|
|
|
73577
73659
|
if (!coordSys.axisPointerEnabled) {
|
|
73578
73660
|
return;
|
|
73579
73661
|
}
|
|
73580
|
-
var coordSysKey = makeKey(coordSys.model);
|
|
73662
|
+
var coordSysKey = makeKey$1(coordSys.model);
|
|
73581
73663
|
var axesInfoInCoordSys = result.coordSysAxesInfo[coordSysKey] = {};
|
|
73582
73664
|
result.coordSysMap[coordSysKey] = coordSys;
|
|
73583
73665
|
// Set tooltip (like 'cross') is a convenient way to show axisPointer
|
|
@@ -73617,7 +73699,7 @@
|
|
|
73617
73699
|
axisPointerModel = fromTooltip ? makeAxisPointerModel(axis, baseTooltipModel, globalAxisPointerModel, ecModel, fromTooltip, triggerTooltip) : axisPointerModel;
|
|
73618
73700
|
var snap = axisPointerModel.get('snap');
|
|
73619
73701
|
var triggerEmphasis = axisPointerModel.get('triggerEmphasis');
|
|
73620
|
-
var axisKey = makeKey(axis.model);
|
|
73702
|
+
var axisKey = makeKey$1(axis.model);
|
|
73621
73703
|
var involveSeries = triggerTooltip || snap || axis.type === 'category';
|
|
73622
73704
|
// If result.axesInfo[key] exist, override it (tooltip has higher priority).
|
|
73623
73705
|
var axisInfo = result.axesInfo[axisKey] = {
|
|
@@ -73689,7 +73771,7 @@
|
|
|
73689
73771
|
if (!coordSys || seriesTooltipTrigger === 'none' || seriesTooltipTrigger === false || seriesTooltipTrigger === 'item' || seriesTooltipShow === false || seriesModel.get(['axisPointer', 'show'], true) === false) {
|
|
73690
73772
|
return;
|
|
73691
73773
|
}
|
|
73692
|
-
each$f(result.coordSysAxesInfo[makeKey(coordSys.model)], function (axisInfo) {
|
|
73774
|
+
each$f(result.coordSysAxesInfo[makeKey$1(coordSys.model)], function (axisInfo) {
|
|
73693
73775
|
var axis = axisInfo.axis;
|
|
73694
73776
|
if (coordSys.getAxis(axis.dim) === axis) {
|
|
73695
73777
|
axisInfo.seriesModels.push(seriesModel);
|
|
@@ -73767,7 +73849,7 @@
|
|
|
73767
73849
|
}
|
|
73768
73850
|
function getAxisInfo$1(axisModel) {
|
|
73769
73851
|
var coordSysAxesInfo = (axisModel.ecModel.getComponent('axisPointer') || {}).coordSysAxesInfo;
|
|
73770
|
-
return coordSysAxesInfo && coordSysAxesInfo.axesInfo[makeKey(axisModel)];
|
|
73852
|
+
return coordSysAxesInfo && coordSysAxesInfo.axesInfo[makeKey$1(axisModel)];
|
|
73771
73853
|
}
|
|
73772
73854
|
function getAxisPointerModel(axisModel) {
|
|
73773
73855
|
var axisInfo = getAxisInfo$1(axisModel);
|
|
@@ -73780,7 +73862,7 @@
|
|
|
73780
73862
|
* @param {module:echarts/model/Model} model
|
|
73781
73863
|
* @return {string} unique key
|
|
73782
73864
|
*/
|
|
73783
|
-
function makeKey(model) {
|
|
73865
|
+
function makeKey$1(model) {
|
|
73784
73866
|
return model.type + '||' + model.id;
|
|
73785
73867
|
}
|
|
73786
73868
|
|
|
@@ -96073,7 +96155,7 @@
|
|
|
96073
96155
|
return;
|
|
96074
96156
|
}
|
|
96075
96157
|
var coordSysModel = axisInfo.coordSys.model;
|
|
96076
|
-
var coordSysKey = makeKey(coordSysModel);
|
|
96158
|
+
var coordSysKey = makeKey$1(coordSysModel);
|
|
96077
96159
|
var coordSysItem = dataByCoordSys.map[coordSysKey];
|
|
96078
96160
|
if (!coordSysItem) {
|
|
96079
96161
|
coordSysItem = dataByCoordSys.map[coordSysKey] = {
|
|
@@ -113302,7 +113384,7 @@
|
|
|
113302
113384
|
* @returns {boolean}
|
|
113303
113385
|
*/
|
|
113304
113386
|
|
|
113305
|
-
function isSafari() {
|
|
113387
|
+
function isSafari$1() {
|
|
113306
113388
|
return !!(navigator.vendor && navigator.vendor.match(/apple/i));
|
|
113307
113389
|
}
|
|
113308
113390
|
|
|
@@ -118337,7 +118419,7 @@
|
|
|
118337
118419
|
// that's because I want to show image before it's fully loaded,
|
|
118338
118420
|
// as browser can render parts of image while it is loading.
|
|
118339
118421
|
// We do not do this in Safari due to partial loading bug.
|
|
118340
|
-
if (supportsDecode && this.slide && (!this.slide.isActive || isSafari())) {
|
|
118422
|
+
if (supportsDecode && this.slide && (!this.slide.isActive || isSafari$1())) {
|
|
118341
118423
|
this.isDecoding = true; // purposefully using finally instead of then,
|
|
118342
118424
|
// as if srcset sizes changes dynamically - it may cause decode error
|
|
118343
118425
|
|
|
@@ -118368,7 +118450,7 @@
|
|
|
118368
118450
|
return;
|
|
118369
118451
|
}
|
|
118370
118452
|
|
|
118371
|
-
if (this.isImageContent() && this.isDecoding && !isSafari()) {
|
|
118453
|
+
if (this.isImageContent() && this.isDecoding && !isSafari$1()) {
|
|
118372
118454
|
// add image to slide when it becomes active,
|
|
118373
118455
|
// even if it's not finished decoding
|
|
118374
118456
|
this.appendImage();
|
|
@@ -133195,6 +133277,4137 @@
|
|
|
133195
133277
|
default: Quill
|
|
133196
133278
|
}, Symbol.toStringTag, { value: 'Module' }));
|
|
133197
133279
|
|
|
133280
|
+
/*
|
|
133281
|
+
* snapdom
|
|
133282
|
+
* v.1.9.14
|
|
133283
|
+
* Author Juan Martin Muda
|
|
133284
|
+
* License MIT
|
|
133285
|
+
**/
|
|
133286
|
+
|
|
133287
|
+
|
|
133288
|
+
// src/core/cache.js
|
|
133289
|
+
var cache = {
|
|
133290
|
+
image: /* @__PURE__ */ new Map(),
|
|
133291
|
+
background: /* @__PURE__ */ new Map(),
|
|
133292
|
+
resource: /* @__PURE__ */ new Map(),
|
|
133293
|
+
defaultStyle: /* @__PURE__ */ new Map(),
|
|
133294
|
+
baseStyle: /* @__PURE__ */ new Map(),
|
|
133295
|
+
computedStyle: /* @__PURE__ */ new WeakMap(),
|
|
133296
|
+
font: /* @__PURE__ */ new Set(),
|
|
133297
|
+
session: {
|
|
133298
|
+
styleMap: /* @__PURE__ */ new Map(),
|
|
133299
|
+
styleCache: /* @__PURE__ */ new WeakMap(),
|
|
133300
|
+
nodeMap: /* @__PURE__ */ new Map()
|
|
133301
|
+
}
|
|
133302
|
+
};
|
|
133303
|
+
function applyCachePolicy(policy = "soft") {
|
|
133304
|
+
switch (policy) {
|
|
133305
|
+
case "auto": {
|
|
133306
|
+
cache.session.styleMap = /* @__PURE__ */ new Map();
|
|
133307
|
+
cache.session.nodeMap = /* @__PURE__ */ new Map();
|
|
133308
|
+
return;
|
|
133309
|
+
}
|
|
133310
|
+
case "soft": {
|
|
133311
|
+
cache.session.styleMap = /* @__PURE__ */ new Map();
|
|
133312
|
+
cache.session.nodeMap = /* @__PURE__ */ new Map();
|
|
133313
|
+
cache.session.styleCache = /* @__PURE__ */ new WeakMap();
|
|
133314
|
+
return;
|
|
133315
|
+
}
|
|
133316
|
+
case "full": {
|
|
133317
|
+
return;
|
|
133318
|
+
}
|
|
133319
|
+
case "disabled": {
|
|
133320
|
+
cache.session.styleMap = /* @__PURE__ */ new Map();
|
|
133321
|
+
cache.session.nodeMap = /* @__PURE__ */ new Map();
|
|
133322
|
+
cache.session.styleCache = /* @__PURE__ */ new WeakMap();
|
|
133323
|
+
cache.computedStyle = /* @__PURE__ */ new WeakMap();
|
|
133324
|
+
cache.baseStyle = /* @__PURE__ */ new Map();
|
|
133325
|
+
cache.defaultStyle = /* @__PURE__ */ new Map();
|
|
133326
|
+
cache.image = /* @__PURE__ */ new Map();
|
|
133327
|
+
cache.background = /* @__PURE__ */ new Map();
|
|
133328
|
+
cache.resource = /* @__PURE__ */ new Map();
|
|
133329
|
+
cache.font = /* @__PURE__ */ new Set();
|
|
133330
|
+
return;
|
|
133331
|
+
}
|
|
133332
|
+
default: {
|
|
133333
|
+
cache.session.styleMap = /* @__PURE__ */ new Map();
|
|
133334
|
+
cache.session.nodeMap = /* @__PURE__ */ new Map();
|
|
133335
|
+
cache.session.styleCache = /* @__PURE__ */ new WeakMap();
|
|
133336
|
+
return;
|
|
133337
|
+
}
|
|
133338
|
+
}
|
|
133339
|
+
}
|
|
133340
|
+
|
|
133341
|
+
// src/utils/helpers.js
|
|
133342
|
+
function extractURL(value) {
|
|
133343
|
+
const match = value.match(/url\((['"]?)(.*?)(\1)\)/);
|
|
133344
|
+
if (!match) return null;
|
|
133345
|
+
const url = match[2].trim();
|
|
133346
|
+
if (url.startsWith("#")) return null;
|
|
133347
|
+
return url;
|
|
133348
|
+
}
|
|
133349
|
+
function stripTranslate(transform) {
|
|
133350
|
+
if (!transform || transform === "none") return "";
|
|
133351
|
+
let cleaned = transform.replace(/translate[XY]?\([^)]*\)/g, "");
|
|
133352
|
+
cleaned = cleaned.replace(/matrix\(([^)]+)\)/g, (_, values) => {
|
|
133353
|
+
const parts = values.split(",").map((s) => s.trim());
|
|
133354
|
+
if (parts.length !== 6) return `matrix(${values})`;
|
|
133355
|
+
parts[4] = "0";
|
|
133356
|
+
parts[5] = "0";
|
|
133357
|
+
return `matrix(${parts.join(", ")})`;
|
|
133358
|
+
});
|
|
133359
|
+
cleaned = cleaned.replace(/matrix3d\(([^)]+)\)/g, (_, values) => {
|
|
133360
|
+
const parts = values.split(",").map((s) => s.trim());
|
|
133361
|
+
if (parts.length !== 16) return `matrix3d(${values})`;
|
|
133362
|
+
parts[12] = "0";
|
|
133363
|
+
parts[13] = "0";
|
|
133364
|
+
return `matrix3d(${parts.join(", ")})`;
|
|
133365
|
+
});
|
|
133366
|
+
return cleaned.trim().replace(/\s{2,}/g, " ");
|
|
133367
|
+
}
|
|
133368
|
+
function safeEncodeURI(uri) {
|
|
133369
|
+
if (/%[0-9A-Fa-f]{2}/.test(uri)) return uri;
|
|
133370
|
+
try {
|
|
133371
|
+
return encodeURI(uri);
|
|
133372
|
+
} catch {
|
|
133373
|
+
return uri;
|
|
133374
|
+
}
|
|
133375
|
+
}
|
|
133376
|
+
|
|
133377
|
+
// src/modules/snapFetch.js
|
|
133378
|
+
function createSnapLogger(prefix = "[snapDOM]", { ttlMs = 5 * 6e4, maxEntries = 12 } = {}) {
|
|
133379
|
+
const seen = /* @__PURE__ */ new Map();
|
|
133380
|
+
let emitted = 0;
|
|
133381
|
+
function log(level, key, msg) {
|
|
133382
|
+
if (emitted >= maxEntries) return;
|
|
133383
|
+
const now = Date.now();
|
|
133384
|
+
const until = seen.get(key) || 0;
|
|
133385
|
+
if (until > now) return;
|
|
133386
|
+
seen.set(key, now + ttlMs);
|
|
133387
|
+
emitted++;
|
|
133388
|
+
if (level === "warn" && console && console.warn) console.warn(`${prefix} ${msg}`);
|
|
133389
|
+
else if (console && console.error) console.error(`${prefix} ${msg}`);
|
|
133390
|
+
}
|
|
133391
|
+
return {
|
|
133392
|
+
warnOnce(key, msg) {
|
|
133393
|
+
log("warn", key, msg);
|
|
133394
|
+
},
|
|
133395
|
+
errorOnce(key, msg) {
|
|
133396
|
+
log("error", key, msg);
|
|
133397
|
+
},
|
|
133398
|
+
reset() {
|
|
133399
|
+
seen.clear();
|
|
133400
|
+
emitted = 0;
|
|
133401
|
+
}
|
|
133402
|
+
};
|
|
133403
|
+
}
|
|
133404
|
+
var snapLogger = createSnapLogger("[snapDOM]", { ttlMs: 3 * 6e4, maxEntries: 10 });
|
|
133405
|
+
var _inflight = /* @__PURE__ */ new Map();
|
|
133406
|
+
var _errorCache = /* @__PURE__ */ new Map();
|
|
133407
|
+
function isSpecialURL(url) {
|
|
133408
|
+
return /^data:|^blob:|^about:blank$/i.test(url);
|
|
133409
|
+
}
|
|
133410
|
+
function isAlreadyProxied(url, useProxy) {
|
|
133411
|
+
try {
|
|
133412
|
+
const baseHref = typeof location !== "undefined" && location.href ? location.href : "http://localhost/";
|
|
133413
|
+
const proxyBaseRaw = useProxy.includes("{url}") ? useProxy.split("{url}")[0] : useProxy;
|
|
133414
|
+
const proxyBase = new URL(proxyBaseRaw || ".", baseHref);
|
|
133415
|
+
const u = new URL(url, baseHref);
|
|
133416
|
+
if (u.origin === proxyBase.origin) return true;
|
|
133417
|
+
const sp = u.searchParams;
|
|
133418
|
+
if (sp && (sp.has("url") || sp.has("target"))) return true;
|
|
133419
|
+
} catch {
|
|
133420
|
+
}
|
|
133421
|
+
return false;
|
|
133422
|
+
}
|
|
133423
|
+
function shouldProxy(url, useProxy) {
|
|
133424
|
+
if (!useProxy) return false;
|
|
133425
|
+
if (isSpecialURL(url)) return false;
|
|
133426
|
+
if (isAlreadyProxied(url, useProxy)) return false;
|
|
133427
|
+
try {
|
|
133428
|
+
const base = typeof location !== "undefined" && location.href ? location.href : "http://localhost/";
|
|
133429
|
+
const u = new URL(url, base);
|
|
133430
|
+
return typeof location !== "undefined" ? u.origin !== location.origin : true;
|
|
133431
|
+
} catch {
|
|
133432
|
+
return !!useProxy;
|
|
133433
|
+
}
|
|
133434
|
+
}
|
|
133435
|
+
function applyProxy(url, useProxy) {
|
|
133436
|
+
if (!useProxy) return url;
|
|
133437
|
+
if (useProxy.includes("{url}")) {
|
|
133438
|
+
return useProxy.replace("{urlRaw}", safeEncodeURI(url)).replace("{url}", encodeURIComponent(url));
|
|
133439
|
+
}
|
|
133440
|
+
if (/[?&]url=?$/.test(useProxy)) {
|
|
133441
|
+
return `${useProxy}${encodeURIComponent(url)}`;
|
|
133442
|
+
}
|
|
133443
|
+
if (useProxy.endsWith("?")) {
|
|
133444
|
+
return `${useProxy}url=${encodeURIComponent(url)}`;
|
|
133445
|
+
}
|
|
133446
|
+
if (useProxy.endsWith("/")) {
|
|
133447
|
+
return `${useProxy}${safeEncodeURI(url)}`;
|
|
133448
|
+
}
|
|
133449
|
+
const sep = useProxy.includes("?") ? "&" : "?";
|
|
133450
|
+
return `${useProxy}${sep}url=${encodeURIComponent(url)}`;
|
|
133451
|
+
}
|
|
133452
|
+
function blobToDataURL(blob) {
|
|
133453
|
+
return new Promise((res, rej) => {
|
|
133454
|
+
const fr = new FileReader();
|
|
133455
|
+
fr.onload = () => res(String(fr.result || ""));
|
|
133456
|
+
fr.onerror = () => rej(new Error("read_failed"));
|
|
133457
|
+
fr.readAsDataURL(blob);
|
|
133458
|
+
});
|
|
133459
|
+
}
|
|
133460
|
+
function makeKey(url, o) {
|
|
133461
|
+
return [
|
|
133462
|
+
o.as || "blob",
|
|
133463
|
+
o.timeout ?? 3e3,
|
|
133464
|
+
o.useProxy || "",
|
|
133465
|
+
o.errorTTL ?? 8e3,
|
|
133466
|
+
url
|
|
133467
|
+
].join("|");
|
|
133468
|
+
}
|
|
133469
|
+
async function snapFetch(url, options = {}) {
|
|
133470
|
+
const as = options.as ?? "blob";
|
|
133471
|
+
const timeout = options.timeout ?? 3e3;
|
|
133472
|
+
const useProxy = options.useProxy || "";
|
|
133473
|
+
const errorTTL = options.errorTTL ?? 8e3;
|
|
133474
|
+
const headers = options.headers || {};
|
|
133475
|
+
const silent = !!options.silent;
|
|
133476
|
+
if (/^data:/i.test(url)) {
|
|
133477
|
+
try {
|
|
133478
|
+
if (as === "text") {
|
|
133479
|
+
return { ok: true, data: String(url), status: 200, url, fromCache: false };
|
|
133480
|
+
}
|
|
133481
|
+
if (as === "dataURL") {
|
|
133482
|
+
return {
|
|
133483
|
+
ok: true,
|
|
133484
|
+
data: String(url),
|
|
133485
|
+
status: 200,
|
|
133486
|
+
url,
|
|
133487
|
+
fromCache: false,
|
|
133488
|
+
mime: String(url).slice(5).split(";")[0] || ""
|
|
133489
|
+
};
|
|
133490
|
+
}
|
|
133491
|
+
const [, meta = "", data = ""] = String(url).match(/^data:([^,]*),(.*)$/) || [];
|
|
133492
|
+
const isBase64 = /;base64/i.test(meta);
|
|
133493
|
+
const bin = isBase64 ? atob(data) : decodeURIComponent(data);
|
|
133494
|
+
const bytes = new Uint8Array([...bin].map((c) => c.charCodeAt(0)));
|
|
133495
|
+
const b = new Blob([bytes], { type: (meta || "").split(";")[0] || "" });
|
|
133496
|
+
return { ok: true, data: b, status: 200, url, fromCache: false, mime: b.type || "" };
|
|
133497
|
+
} catch {
|
|
133498
|
+
return { ok: false, data: null, status: 0, url, fromCache: false, reason: "special_url_error" };
|
|
133499
|
+
}
|
|
133500
|
+
}
|
|
133501
|
+
if (/^blob:/i.test(url)) {
|
|
133502
|
+
try {
|
|
133503
|
+
const resp = await fetch(url);
|
|
133504
|
+
if (!resp.ok) {
|
|
133505
|
+
return { ok: false, data: null, status: resp.status, url, fromCache: false, reason: "http_error" };
|
|
133506
|
+
}
|
|
133507
|
+
const blob = await resp.blob();
|
|
133508
|
+
const mime = blob.type || resp.headers.get("content-type") || "";
|
|
133509
|
+
if (as === "dataURL") {
|
|
133510
|
+
const dataURL = await blobToDataURL(blob);
|
|
133511
|
+
return { ok: true, data: dataURL, status: resp.status, url, fromCache: false, mime };
|
|
133512
|
+
}
|
|
133513
|
+
if (as === "text") {
|
|
133514
|
+
const text = await blob.text();
|
|
133515
|
+
return { ok: true, data: text, status: resp.status, url, fromCache: false, mime };
|
|
133516
|
+
}
|
|
133517
|
+
return { ok: true, data: blob, status: resp.status, url, fromCache: false, mime };
|
|
133518
|
+
} catch {
|
|
133519
|
+
return { ok: false, data: null, status: 0, url, fromCache: false, reason: "network" };
|
|
133520
|
+
}
|
|
133521
|
+
}
|
|
133522
|
+
if (/^about:blank$/i.test(url)) {
|
|
133523
|
+
if (as === "dataURL") {
|
|
133524
|
+
return {
|
|
133525
|
+
ok: true,
|
|
133526
|
+
data: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg==",
|
|
133527
|
+
status: 200,
|
|
133528
|
+
url,
|
|
133529
|
+
fromCache: false,
|
|
133530
|
+
mime: "image/png"
|
|
133531
|
+
};
|
|
133532
|
+
}
|
|
133533
|
+
return { ok: true, data: as === "text" ? "" : new Blob([]), status: 200, url, fromCache: false };
|
|
133534
|
+
}
|
|
133535
|
+
const key = makeKey(url, { as, timeout, useProxy, errorTTL });
|
|
133536
|
+
const e = _errorCache.get(key);
|
|
133537
|
+
if (e && e.until > Date.now()) {
|
|
133538
|
+
return { ...e.result, fromCache: true };
|
|
133539
|
+
} else if (e) {
|
|
133540
|
+
_errorCache.delete(key);
|
|
133541
|
+
}
|
|
133542
|
+
const inflight = _inflight.get(key);
|
|
133543
|
+
if (inflight) return inflight;
|
|
133544
|
+
const finalURL = shouldProxy(url, useProxy) ? applyProxy(url, useProxy) : url;
|
|
133545
|
+
let cred = options.credentials;
|
|
133546
|
+
if (!cred) {
|
|
133547
|
+
try {
|
|
133548
|
+
const base = typeof location !== "undefined" && location.href ? location.href : "http://localhost/";
|
|
133549
|
+
const u = new URL(url, base);
|
|
133550
|
+
const sameOrigin = typeof location !== "undefined" && u.origin === location.origin;
|
|
133551
|
+
cred = sameOrigin ? "include" : "omit";
|
|
133552
|
+
} catch {
|
|
133553
|
+
cred = "omit";
|
|
133554
|
+
}
|
|
133555
|
+
}
|
|
133556
|
+
const ctrl = new AbortController();
|
|
133557
|
+
const timer = setTimeout(() => ctrl.abort("timeout"), timeout);
|
|
133558
|
+
const p = (async () => {
|
|
133559
|
+
try {
|
|
133560
|
+
const resp = await fetch(finalURL, { signal: ctrl.signal, credentials: cred, headers });
|
|
133561
|
+
if (!resp.ok) {
|
|
133562
|
+
const result = { ok: false, data: null, status: resp.status, url: finalURL, fromCache: false, reason: "http_error" };
|
|
133563
|
+
if (errorTTL > 0) _errorCache.set(key, { until: Date.now() + errorTTL, result });
|
|
133564
|
+
if (!silent) {
|
|
133565
|
+
const short = `${resp.status} ${resp.statusText || ""}`.trim();
|
|
133566
|
+
snapLogger.warnOnce(
|
|
133567
|
+
`http:${resp.status}:${as}:${new URL(url, location?.href ?? "http://localhost/").origin}`,
|
|
133568
|
+
`HTTP error ${short} while fetching ${as} ${url}`
|
|
133569
|
+
);
|
|
133570
|
+
}
|
|
133571
|
+
options.onError && options.onError(result);
|
|
133572
|
+
return result;
|
|
133573
|
+
}
|
|
133574
|
+
if (as === "text") {
|
|
133575
|
+
const text = await resp.text();
|
|
133576
|
+
return { ok: true, data: text, status: resp.status, url: finalURL, fromCache: false };
|
|
133577
|
+
}
|
|
133578
|
+
const blob = await resp.blob();
|
|
133579
|
+
const mime = blob.type || resp.headers.get("content-type") || "";
|
|
133580
|
+
if (as === "dataURL") {
|
|
133581
|
+
const dataURL = await blobToDataURL(blob);
|
|
133582
|
+
return { ok: true, data: dataURL, status: resp.status, url: finalURL, fromCache: false, mime };
|
|
133583
|
+
}
|
|
133584
|
+
return { ok: true, data: blob, status: resp.status, url: finalURL, fromCache: false, mime };
|
|
133585
|
+
} catch (err) {
|
|
133586
|
+
const reason = err && typeof err === "object" && "name" in err && err.name === "AbortError" ? String(err.message || "").includes("timeout") ? "timeout" : "abort" : "network";
|
|
133587
|
+
const result = { ok: false, data: null, status: 0, url: finalURL, fromCache: false, reason };
|
|
133588
|
+
if (!/^blob:/i.test(url) && errorTTL > 0) {
|
|
133589
|
+
_errorCache.set(key, { until: Date.now() + errorTTL, result });
|
|
133590
|
+
}
|
|
133591
|
+
if (!silent) {
|
|
133592
|
+
const k = `${reason}:${as}:${new URL(url, location?.href ?? "http://localhost/").origin}`;
|
|
133593
|
+
const tips = reason === "timeout" ? `Timeout after ${timeout}ms. Consider increasing timeout or using a proxy for ${url}` : reason === "abort" ? `Request aborted while fetching ${as} ${url}` : `Network/CORS issue while fetching ${as} ${url}. A proxy may be required`;
|
|
133594
|
+
snapLogger.errorOnce(k, tips);
|
|
133595
|
+
}
|
|
133596
|
+
options.onError && options.onError(result);
|
|
133597
|
+
return result;
|
|
133598
|
+
} finally {
|
|
133599
|
+
clearTimeout(timer);
|
|
133600
|
+
_inflight.delete(key);
|
|
133601
|
+
}
|
|
133602
|
+
})();
|
|
133603
|
+
_inflight.set(key, p);
|
|
133604
|
+
return p;
|
|
133605
|
+
}
|
|
133606
|
+
|
|
133607
|
+
// src/utils/image.js
|
|
133608
|
+
function createBackground(baseCanvas, backgroundColor) {
|
|
133609
|
+
if (!backgroundColor || !baseCanvas.width || !baseCanvas.height) {
|
|
133610
|
+
return baseCanvas;
|
|
133611
|
+
}
|
|
133612
|
+
const temp = document.createElement("canvas");
|
|
133613
|
+
temp.width = baseCanvas.width;
|
|
133614
|
+
temp.height = baseCanvas.height;
|
|
133615
|
+
const ctx = temp.getContext("2d");
|
|
133616
|
+
ctx.fillStyle = backgroundColor;
|
|
133617
|
+
ctx.fillRect(0, 0, temp.width, temp.height);
|
|
133618
|
+
ctx.drawImage(baseCanvas, 0, 0);
|
|
133619
|
+
return temp;
|
|
133620
|
+
}
|
|
133621
|
+
async function inlineSingleBackgroundEntry(entry, options = {}) {
|
|
133622
|
+
const isGradient = /^((repeating-)?(linear|radial|conic)-gradient)\(/i.test(entry);
|
|
133623
|
+
if (isGradient || entry.trim() === "none") {
|
|
133624
|
+
return entry;
|
|
133625
|
+
}
|
|
133626
|
+
const rawUrl = extractURL(entry);
|
|
133627
|
+
if (!rawUrl) {
|
|
133628
|
+
return entry;
|
|
133629
|
+
}
|
|
133630
|
+
const encodedUrl = safeEncodeURI(rawUrl);
|
|
133631
|
+
if (cache.background.has(encodedUrl)) {
|
|
133632
|
+
const dataUrl = cache.background.get(encodedUrl);
|
|
133633
|
+
return dataUrl ? `url("${dataUrl}")` : "none";
|
|
133634
|
+
}
|
|
133635
|
+
try {
|
|
133636
|
+
const dataUrl = await snapFetch(encodedUrl, { as: "dataURL", useProxy: options.useProxy });
|
|
133637
|
+
if (dataUrl.ok) {
|
|
133638
|
+
cache.background.set(encodedUrl, dataUrl.data);
|
|
133639
|
+
return `url("${dataUrl.data}")`;
|
|
133640
|
+
}
|
|
133641
|
+
cache.background.set(encodedUrl, null);
|
|
133642
|
+
return "none";
|
|
133643
|
+
} catch {
|
|
133644
|
+
cache.background.set(encodedUrl, null);
|
|
133645
|
+
return "none";
|
|
133646
|
+
}
|
|
133647
|
+
}
|
|
133648
|
+
|
|
133649
|
+
// src/utils/css.js
|
|
133650
|
+
var NO_CAPTURE_TAGS = /* @__PURE__ */ new Set([
|
|
133651
|
+
"meta",
|
|
133652
|
+
"script",
|
|
133653
|
+
"noscript",
|
|
133654
|
+
"title",
|
|
133655
|
+
"link",
|
|
133656
|
+
"template"
|
|
133657
|
+
]);
|
|
133658
|
+
var NO_DEFAULTS_TAGS = /* @__PURE__ */ new Set([
|
|
133659
|
+
// non-painting / head stuff
|
|
133660
|
+
"meta",
|
|
133661
|
+
"link",
|
|
133662
|
+
"style",
|
|
133663
|
+
"title",
|
|
133664
|
+
"noscript",
|
|
133665
|
+
"script",
|
|
133666
|
+
"template",
|
|
133667
|
+
// SVG whole namespace (safe for LeaderLine/presentation attrs)
|
|
133668
|
+
"g",
|
|
133669
|
+
"defs",
|
|
133670
|
+
"use",
|
|
133671
|
+
"marker",
|
|
133672
|
+
"mask",
|
|
133673
|
+
"clipPath",
|
|
133674
|
+
"pattern",
|
|
133675
|
+
"path",
|
|
133676
|
+
"polygon",
|
|
133677
|
+
"polyline",
|
|
133678
|
+
"line",
|
|
133679
|
+
"circle",
|
|
133680
|
+
"ellipse",
|
|
133681
|
+
"rect",
|
|
133682
|
+
"filter",
|
|
133683
|
+
"lineargradient",
|
|
133684
|
+
"radialgradient",
|
|
133685
|
+
"stop"
|
|
133686
|
+
]);
|
|
133687
|
+
var commonTags = [
|
|
133688
|
+
"div",
|
|
133689
|
+
"span",
|
|
133690
|
+
"p",
|
|
133691
|
+
"a",
|
|
133692
|
+
"img",
|
|
133693
|
+
"ul",
|
|
133694
|
+
"li",
|
|
133695
|
+
"button",
|
|
133696
|
+
"input",
|
|
133697
|
+
"select",
|
|
133698
|
+
"textarea",
|
|
133699
|
+
"label",
|
|
133700
|
+
"section",
|
|
133701
|
+
"article",
|
|
133702
|
+
"header",
|
|
133703
|
+
"footer",
|
|
133704
|
+
"nav",
|
|
133705
|
+
"main",
|
|
133706
|
+
"aside",
|
|
133707
|
+
"h1",
|
|
133708
|
+
"h2",
|
|
133709
|
+
"h3",
|
|
133710
|
+
"h4",
|
|
133711
|
+
"h5",
|
|
133712
|
+
"h6",
|
|
133713
|
+
"table",
|
|
133714
|
+
"thead",
|
|
133715
|
+
"tbody",
|
|
133716
|
+
"tr",
|
|
133717
|
+
"td",
|
|
133718
|
+
"th"
|
|
133719
|
+
];
|
|
133720
|
+
function precacheCommonTags() {
|
|
133721
|
+
for (let tag of commonTags) {
|
|
133722
|
+
const t = String(tag).toLowerCase();
|
|
133723
|
+
if (NO_CAPTURE_TAGS.has(t)) continue;
|
|
133724
|
+
if (NO_DEFAULTS_TAGS.has(t)) continue;
|
|
133725
|
+
getDefaultStyleForTag(t);
|
|
133726
|
+
}
|
|
133727
|
+
}
|
|
133728
|
+
function getDefaultStyleForTag(tagName) {
|
|
133729
|
+
tagName = String(tagName).toLowerCase();
|
|
133730
|
+
if (NO_DEFAULTS_TAGS.has(tagName)) {
|
|
133731
|
+
const empty = {};
|
|
133732
|
+
cache.defaultStyle.set(tagName, empty);
|
|
133733
|
+
return empty;
|
|
133734
|
+
}
|
|
133735
|
+
if (cache.defaultStyle.has(tagName)) {
|
|
133736
|
+
return cache.defaultStyle.get(tagName);
|
|
133737
|
+
}
|
|
133738
|
+
let sandbox = document.getElementById("snapdom-sandbox");
|
|
133739
|
+
if (!sandbox) {
|
|
133740
|
+
sandbox = document.createElement("div");
|
|
133741
|
+
sandbox.id = "snapdom-sandbox";
|
|
133742
|
+
sandbox.setAttribute("data-snapdom-sandbox", "true");
|
|
133743
|
+
sandbox.setAttribute("aria-hidden", "true");
|
|
133744
|
+
sandbox.style.position = "absolute";
|
|
133745
|
+
sandbox.style.left = "-9999px";
|
|
133746
|
+
sandbox.style.top = "-9999px";
|
|
133747
|
+
sandbox.style.width = "0px";
|
|
133748
|
+
sandbox.style.height = "0px";
|
|
133749
|
+
sandbox.style.overflow = "hidden";
|
|
133750
|
+
document.body.appendChild(sandbox);
|
|
133751
|
+
}
|
|
133752
|
+
const el = document.createElement(tagName);
|
|
133753
|
+
el.style.all = "initial";
|
|
133754
|
+
sandbox.appendChild(el);
|
|
133755
|
+
const styles = getComputedStyle(el);
|
|
133756
|
+
const defaults = {};
|
|
133757
|
+
for (let prop of styles) {
|
|
133758
|
+
if (shouldIgnoreProp(prop)) continue;
|
|
133759
|
+
const value = styles.getPropertyValue(prop);
|
|
133760
|
+
defaults[prop] = value;
|
|
133761
|
+
}
|
|
133762
|
+
sandbox.removeChild(el);
|
|
133763
|
+
cache.defaultStyle.set(tagName, defaults);
|
|
133764
|
+
return defaults;
|
|
133765
|
+
}
|
|
133766
|
+
var NO_PAINT_TOKEN = /(?:^|-)(animation|transition)(?:-|$)/i;
|
|
133767
|
+
var NO_PAINT_PREFIX = /^(--|view-timeline|scroll-timeline|animation-trigger|offset-|position-try|app-region|interactivity|overlay|view-transition|-webkit-locale|-webkit-user-(?:drag|modify)|-webkit-tap-highlight-color|-webkit-text-security)$/i;
|
|
133768
|
+
var NO_PAINT_EXACT = /* @__PURE__ */ new Set([
|
|
133769
|
+
// Interaction hints
|
|
133770
|
+
"cursor",
|
|
133771
|
+
"pointer-events",
|
|
133772
|
+
"touch-action",
|
|
133773
|
+
"user-select",
|
|
133774
|
+
// Printing/speech/reading-mode hints
|
|
133775
|
+
"print-color-adjust",
|
|
133776
|
+
"speak",
|
|
133777
|
+
"reading-flow",
|
|
133778
|
+
"reading-order",
|
|
133779
|
+
// Anchoring/container/timeline scopes (metadata for layout queries)
|
|
133780
|
+
"anchor-name",
|
|
133781
|
+
"anchor-scope",
|
|
133782
|
+
"container-name",
|
|
133783
|
+
"container-type",
|
|
133784
|
+
"timeline-scope"
|
|
133785
|
+
]);
|
|
133786
|
+
function shouldIgnoreProp(prop) {
|
|
133787
|
+
const p = String(prop).toLowerCase();
|
|
133788
|
+
if (NO_PAINT_EXACT.has(p)) return true;
|
|
133789
|
+
if (NO_PAINT_PREFIX.test(p)) return true;
|
|
133790
|
+
if (NO_PAINT_TOKEN.test(p)) return true;
|
|
133791
|
+
return false;
|
|
133792
|
+
}
|
|
133793
|
+
function getStyleKey(snapshot, tagName) {
|
|
133794
|
+
tagName = String(tagName || "").toLowerCase();
|
|
133795
|
+
if (NO_DEFAULTS_TAGS.has(tagName)) {
|
|
133796
|
+
return "";
|
|
133797
|
+
}
|
|
133798
|
+
const entries = [];
|
|
133799
|
+
const defaults = getDefaultStyleForTag(tagName);
|
|
133800
|
+
for (let [prop, value] of Object.entries(snapshot)) {
|
|
133801
|
+
if (shouldIgnoreProp(prop)) continue;
|
|
133802
|
+
const def = defaults[prop];
|
|
133803
|
+
if (value && value !== def) entries.push(`${prop}:${value}`);
|
|
133804
|
+
}
|
|
133805
|
+
entries.sort();
|
|
133806
|
+
return entries.join(";");
|
|
133807
|
+
}
|
|
133808
|
+
function collectUsedTagNames(root) {
|
|
133809
|
+
const tagSet = /* @__PURE__ */ new Set();
|
|
133810
|
+
if (root.nodeType !== Node.ELEMENT_NODE && root.nodeType !== Node.DOCUMENT_FRAGMENT_NODE) {
|
|
133811
|
+
return [];
|
|
133812
|
+
}
|
|
133813
|
+
if (root.tagName) {
|
|
133814
|
+
tagSet.add(root.tagName.toLowerCase());
|
|
133815
|
+
}
|
|
133816
|
+
if (typeof root.querySelectorAll === "function") {
|
|
133817
|
+
root.querySelectorAll("*").forEach((el) => tagSet.add(el.tagName.toLowerCase()));
|
|
133818
|
+
}
|
|
133819
|
+
return Array.from(tagSet);
|
|
133820
|
+
}
|
|
133821
|
+
function generateDedupedBaseCSS(usedTagNames) {
|
|
133822
|
+
const groups = /* @__PURE__ */ new Map();
|
|
133823
|
+
for (let tagName of usedTagNames) {
|
|
133824
|
+
const styles = cache.defaultStyle.get(tagName);
|
|
133825
|
+
if (!styles) continue;
|
|
133826
|
+
const key = Object.entries(styles).map(([k, v]) => `${k}:${v};`).sort().join("");
|
|
133827
|
+
if (!key) continue;
|
|
133828
|
+
if (!groups.has(key)) {
|
|
133829
|
+
groups.set(key, []);
|
|
133830
|
+
}
|
|
133831
|
+
groups.get(key).push(tagName);
|
|
133832
|
+
}
|
|
133833
|
+
let css = "";
|
|
133834
|
+
for (let [styleBlock, tagList] of groups.entries()) {
|
|
133835
|
+
css += `${tagList.join(",")} { ${styleBlock} }
|
|
133836
|
+
`;
|
|
133837
|
+
}
|
|
133838
|
+
return css;
|
|
133839
|
+
}
|
|
133840
|
+
function generateCSSClasses(styleMap) {
|
|
133841
|
+
const keys = Array.from(new Set(styleMap.values())).filter(Boolean).sort();
|
|
133842
|
+
const classMap = /* @__PURE__ */ new Map();
|
|
133843
|
+
let i = 1;
|
|
133844
|
+
for (const k of keys) classMap.set(k, `c${i++}`);
|
|
133845
|
+
return classMap;
|
|
133846
|
+
}
|
|
133847
|
+
function getStyle(el, pseudo = null) {
|
|
133848
|
+
if (!(el instanceof Element)) {
|
|
133849
|
+
return window.getComputedStyle(el, pseudo);
|
|
133850
|
+
}
|
|
133851
|
+
let map = cache.computedStyle.get(el);
|
|
133852
|
+
if (!map) {
|
|
133853
|
+
map = /* @__PURE__ */ new Map();
|
|
133854
|
+
cache.computedStyle.set(el, map);
|
|
133855
|
+
}
|
|
133856
|
+
if (!map.has(pseudo)) {
|
|
133857
|
+
const st = window.getComputedStyle(el, pseudo);
|
|
133858
|
+
map.set(pseudo, st);
|
|
133859
|
+
}
|
|
133860
|
+
return map.get(pseudo);
|
|
133861
|
+
}
|
|
133862
|
+
function snapshotComputedStyle(style) {
|
|
133863
|
+
const snap = {};
|
|
133864
|
+
for (let prop of style) {
|
|
133865
|
+
snap[prop] = style.getPropertyValue(prop);
|
|
133866
|
+
}
|
|
133867
|
+
return snap;
|
|
133868
|
+
}
|
|
133869
|
+
function splitBackgroundImage(bg) {
|
|
133870
|
+
const parts = [];
|
|
133871
|
+
let depth = 0;
|
|
133872
|
+
let lastIndex = 0;
|
|
133873
|
+
for (let i = 0; i < bg.length; i++) {
|
|
133874
|
+
const char = bg[i];
|
|
133875
|
+
if (char === "(") depth++;
|
|
133876
|
+
if (char === ")") depth--;
|
|
133877
|
+
if (char === "," && depth === 0) {
|
|
133878
|
+
parts.push(bg.slice(lastIndex, i).trim());
|
|
133879
|
+
lastIndex = i + 1;
|
|
133880
|
+
}
|
|
133881
|
+
}
|
|
133882
|
+
parts.push(bg.slice(lastIndex).trim());
|
|
133883
|
+
return parts;
|
|
133884
|
+
}
|
|
133885
|
+
|
|
133886
|
+
// src/utils/browser.js
|
|
133887
|
+
function idle(fn, { fast = false } = {}) {
|
|
133888
|
+
if (fast) return fn();
|
|
133889
|
+
if ("requestIdleCallback" in window) {
|
|
133890
|
+
requestIdleCallback(fn, { timeout: 50 });
|
|
133891
|
+
} else {
|
|
133892
|
+
setTimeout(fn, 1);
|
|
133893
|
+
}
|
|
133894
|
+
}
|
|
133895
|
+
function isSafari() {
|
|
133896
|
+
const ua = typeof navigator !== "undefined" && navigator.userAgent ? navigator.userAgent : "";
|
|
133897
|
+
const isSafariUA = /^((?!chrome|android).)*safari/i.test(ua);
|
|
133898
|
+
const isUIWebView = /AppleWebKit/i.test(ua) && /Mobile/i.test(ua) && !/Safari/i.test(ua);
|
|
133899
|
+
const isWeChatUA = /(MicroMessenger|wxwork|WeCom|WindowsWechat|MacWechat)/i.test(ua);
|
|
133900
|
+
return isSafariUA || isUIWebView || isWeChatUA;
|
|
133901
|
+
}
|
|
133902
|
+
|
|
133903
|
+
// src/modules/styles.js
|
|
133904
|
+
var snapshotCache = /* @__PURE__ */ new WeakMap();
|
|
133905
|
+
var snapshotKeyCache = /* @__PURE__ */ new Map();
|
|
133906
|
+
var __epoch = 0;
|
|
133907
|
+
function bumpEpoch() {
|
|
133908
|
+
__epoch++;
|
|
133909
|
+
}
|
|
133910
|
+
var __wired = false;
|
|
133911
|
+
function setupInvalidationOnce(root = document.documentElement) {
|
|
133912
|
+
if (__wired) return;
|
|
133913
|
+
__wired = true;
|
|
133914
|
+
try {
|
|
133915
|
+
const domObs = new MutationObserver(() => bumpEpoch());
|
|
133916
|
+
domObs.observe(root, { subtree: true, childList: true, characterData: true, attributes: true });
|
|
133917
|
+
} catch {
|
|
133918
|
+
}
|
|
133919
|
+
try {
|
|
133920
|
+
const headObs = new MutationObserver(() => bumpEpoch());
|
|
133921
|
+
headObs.observe(document.head, { subtree: true, childList: true, characterData: true, attributes: true });
|
|
133922
|
+
} catch {
|
|
133923
|
+
}
|
|
133924
|
+
try {
|
|
133925
|
+
const f = document.fonts;
|
|
133926
|
+
if (f) {
|
|
133927
|
+
f.addEventListener?.("loadingdone", bumpEpoch);
|
|
133928
|
+
f.ready?.then(() => bumpEpoch()).catch(() => {
|
|
133929
|
+
});
|
|
133930
|
+
}
|
|
133931
|
+
} catch {
|
|
133932
|
+
}
|
|
133933
|
+
}
|
|
133934
|
+
function snapshotComputedStyleFull(style, options = {}) {
|
|
133935
|
+
const out = {};
|
|
133936
|
+
const vis = style.getPropertyValue("visibility");
|
|
133937
|
+
for (let i = 0; i < style.length; i++) {
|
|
133938
|
+
const prop = style[i];
|
|
133939
|
+
let val = style.getPropertyValue(prop);
|
|
133940
|
+
if ((prop === "background-image" || prop === "content") && val.includes("url(") && !val.includes("data:")) {
|
|
133941
|
+
val = "none";
|
|
133942
|
+
}
|
|
133943
|
+
out[prop] = val;
|
|
133944
|
+
}
|
|
133945
|
+
if (options.embedFonts) {
|
|
133946
|
+
const EXTRA_FONT_PROPS = [
|
|
133947
|
+
"font-feature-settings",
|
|
133948
|
+
"font-variation-settings",
|
|
133949
|
+
"font-kerning",
|
|
133950
|
+
"font-variant",
|
|
133951
|
+
"font-variant-ligatures",
|
|
133952
|
+
"font-optical-sizing"
|
|
133953
|
+
];
|
|
133954
|
+
for (const prop of EXTRA_FONT_PROPS) {
|
|
133955
|
+
if (out[prop]) continue;
|
|
133956
|
+
try {
|
|
133957
|
+
const v = style.getPropertyValue(prop);
|
|
133958
|
+
if (v) out[prop] = v;
|
|
133959
|
+
} catch {
|
|
133960
|
+
}
|
|
133961
|
+
}
|
|
133962
|
+
}
|
|
133963
|
+
if (vis === "hidden") out.opacity = "0";
|
|
133964
|
+
return out;
|
|
133965
|
+
}
|
|
133966
|
+
var __snapshotSig = /* @__PURE__ */ new WeakMap();
|
|
133967
|
+
function styleSignature(snap) {
|
|
133968
|
+
let sig = __snapshotSig.get(snap);
|
|
133969
|
+
if (sig) return sig;
|
|
133970
|
+
const entries = Object.entries(snap).sort((a, b) => a[0] < b[0] ? -1 : a[0] > b[0] ? 1 : 0);
|
|
133971
|
+
sig = entries.map(([k, v]) => `${k}:${v}`).join(";");
|
|
133972
|
+
__snapshotSig.set(snap, sig);
|
|
133973
|
+
return sig;
|
|
133974
|
+
}
|
|
133975
|
+
function getSnapshot(el, preStyle = null, options = {}) {
|
|
133976
|
+
const rec = snapshotCache.get(el);
|
|
133977
|
+
if (rec && rec.epoch === __epoch) return rec.snapshot;
|
|
133978
|
+
const style = preStyle || getComputedStyle(el);
|
|
133979
|
+
const snap = snapshotComputedStyleFull(style, options);
|
|
133980
|
+
stripHeightForWrappers(el, style, snap);
|
|
133981
|
+
snapshotCache.set(el, { epoch: __epoch, snapshot: snap });
|
|
133982
|
+
return snap;
|
|
133983
|
+
}
|
|
133984
|
+
function _resolveCtx(sessionOrCtx, opts) {
|
|
133985
|
+
if (sessionOrCtx && sessionOrCtx.session && sessionOrCtx.persist) return sessionOrCtx;
|
|
133986
|
+
if (sessionOrCtx && (sessionOrCtx.styleMap || sessionOrCtx.styleCache || sessionOrCtx.nodeMap)) {
|
|
133987
|
+
return {
|
|
133988
|
+
session: sessionOrCtx,
|
|
133989
|
+
persist: {
|
|
133990
|
+
snapshotKeyCache,
|
|
133991
|
+
defaultStyle: cache.defaultStyle,
|
|
133992
|
+
baseStyle: cache.baseStyle,
|
|
133993
|
+
image: cache.image,
|
|
133994
|
+
resource: cache.resource,
|
|
133995
|
+
background: cache.background,
|
|
133996
|
+
font: cache.font
|
|
133997
|
+
},
|
|
133998
|
+
options: opts || {}
|
|
133999
|
+
};
|
|
134000
|
+
}
|
|
134001
|
+
return {
|
|
134002
|
+
session: cache.session,
|
|
134003
|
+
persist: {
|
|
134004
|
+
snapshotKeyCache,
|
|
134005
|
+
defaultStyle: cache.defaultStyle,
|
|
134006
|
+
baseStyle: cache.baseStyle,
|
|
134007
|
+
image: cache.image,
|
|
134008
|
+
resource: cache.resource,
|
|
134009
|
+
background: cache.background,
|
|
134010
|
+
font: cache.font
|
|
134011
|
+
},
|
|
134012
|
+
options: sessionOrCtx || opts || {}
|
|
134013
|
+
};
|
|
134014
|
+
}
|
|
134015
|
+
async function inlineAllStyles(source, clone, sessionOrCtx, opts) {
|
|
134016
|
+
if (source.tagName === "STYLE") return;
|
|
134017
|
+
const ctx = _resolveCtx(sessionOrCtx, opts);
|
|
134018
|
+
const resetMode = ctx.options && ctx.options.cache || "auto";
|
|
134019
|
+
if (resetMode !== "disabled") setupInvalidationOnce(document.documentElement);
|
|
134020
|
+
if (resetMode === "disabled" && !ctx.session.__bumpedForDisabled) {
|
|
134021
|
+
bumpEpoch();
|
|
134022
|
+
snapshotKeyCache.clear();
|
|
134023
|
+
ctx.session.__bumpedForDisabled = true;
|
|
134024
|
+
}
|
|
134025
|
+
if (NO_DEFAULTS_TAGS.has(source.tagName?.toLowerCase())) {
|
|
134026
|
+
const author = source.getAttribute?.("style");
|
|
134027
|
+
if (author) clone.setAttribute("style", author);
|
|
134028
|
+
}
|
|
134029
|
+
const { session, persist } = ctx;
|
|
134030
|
+
if (!session.styleCache.has(source)) {
|
|
134031
|
+
session.styleCache.set(source, getComputedStyle(source));
|
|
134032
|
+
}
|
|
134033
|
+
const pre = session.styleCache.get(source);
|
|
134034
|
+
const snap = getSnapshot(source, pre, ctx.options);
|
|
134035
|
+
const sig = styleSignature(snap);
|
|
134036
|
+
let key = persist.snapshotKeyCache.get(sig);
|
|
134037
|
+
if (!key) {
|
|
134038
|
+
const tag = source.tagName?.toLowerCase() || "div";
|
|
134039
|
+
key = getStyleKey(snap, tag);
|
|
134040
|
+
persist.snapshotKeyCache.set(sig, key);
|
|
134041
|
+
}
|
|
134042
|
+
session.styleMap.set(clone, key);
|
|
134043
|
+
}
|
|
134044
|
+
function isReplaced(el) {
|
|
134045
|
+
return el instanceof HTMLImageElement || el instanceof HTMLCanvasElement || el instanceof HTMLVideoElement || el instanceof HTMLIFrameElement || el instanceof SVGElement || el instanceof HTMLObjectElement || el instanceof HTMLEmbedElement;
|
|
134046
|
+
}
|
|
134047
|
+
function hasBox(cs) {
|
|
134048
|
+
if (cs.backgroundImage && cs.backgroundImage !== "none") return true;
|
|
134049
|
+
if (cs.backgroundColor && cs.backgroundColor !== "rgba(0, 0, 0, 0)" && cs.backgroundColor !== "transparent") return true;
|
|
134050
|
+
if ((parseFloat(cs.borderTopWidth) || 0) > 0) return true;
|
|
134051
|
+
if ((parseFloat(cs.borderBottomWidth) || 0) > 0) return true;
|
|
134052
|
+
if ((parseFloat(cs.paddingTop) || 0) > 0) return true;
|
|
134053
|
+
if ((parseFloat(cs.paddingBottom) || 0) > 0) return true;
|
|
134054
|
+
const ob = cs.overflowBlock || cs.overflowY || "visible";
|
|
134055
|
+
return ob !== "visible";
|
|
134056
|
+
}
|
|
134057
|
+
function isFlexOrGridItem(el) {
|
|
134058
|
+
const p = el.parentElement;
|
|
134059
|
+
if (!p) return false;
|
|
134060
|
+
const pd = getComputedStyle(p).display || "";
|
|
134061
|
+
return pd.includes("flex") || pd.includes("grid");
|
|
134062
|
+
}
|
|
134063
|
+
function hasFlowFast(el, cs) {
|
|
134064
|
+
if (el.textContent && /\S/.test(el.textContent)) return true;
|
|
134065
|
+
const f = el.firstElementChild, l = el.lastElementChild;
|
|
134066
|
+
if (f && f.tagName === "BR" || l && l.tagName === "BR") return true;
|
|
134067
|
+
const sh = el.scrollHeight;
|
|
134068
|
+
if (sh === 0) return false;
|
|
134069
|
+
const pt = parseFloat(cs.paddingTop) || 0;
|
|
134070
|
+
const pb = parseFloat(cs.paddingBottom) || 0;
|
|
134071
|
+
return sh > pt + pb;
|
|
134072
|
+
}
|
|
134073
|
+
function stripHeightForWrappers(el, cs, snap) {
|
|
134074
|
+
if (el instanceof HTMLElement && el.style && el.style.height) return;
|
|
134075
|
+
const disp = cs.display || "";
|
|
134076
|
+
if (disp.includes("flex") || disp.includes("grid")) return;
|
|
134077
|
+
if (isReplaced(el)) return;
|
|
134078
|
+
const pos = cs.position;
|
|
134079
|
+
if (pos === "absolute" || pos === "fixed" || pos === "sticky") return;
|
|
134080
|
+
if (cs.transform !== "none") return;
|
|
134081
|
+
if (hasBox(cs)) return;
|
|
134082
|
+
if (isFlexOrGridItem(el)) return;
|
|
134083
|
+
if (!hasFlowFast(el, cs)) return;
|
|
134084
|
+
delete snap.height;
|
|
134085
|
+
delete snap["block-size"];
|
|
134086
|
+
}
|
|
134087
|
+
|
|
134088
|
+
// src/modules/CSSVar.js
|
|
134089
|
+
function resolveCSSVars(sourceEl, cloneEl) {
|
|
134090
|
+
if (!(sourceEl instanceof Element) || !(cloneEl instanceof Element)) return;
|
|
134091
|
+
const styleAttr = sourceEl.getAttribute?.("style");
|
|
134092
|
+
let hasVar = !!(styleAttr && styleAttr.includes("var("));
|
|
134093
|
+
if (!hasVar && sourceEl.attributes?.length) {
|
|
134094
|
+
const attrs = sourceEl.attributes;
|
|
134095
|
+
for (let i = 0; i < attrs.length; i++) {
|
|
134096
|
+
const a = attrs[i];
|
|
134097
|
+
if (a && typeof a.value === "string" && a.value.includes("var(")) {
|
|
134098
|
+
hasVar = true;
|
|
134099
|
+
break;
|
|
134100
|
+
}
|
|
134101
|
+
}
|
|
134102
|
+
}
|
|
134103
|
+
if (!hasVar) return;
|
|
134104
|
+
let cs;
|
|
134105
|
+
try {
|
|
134106
|
+
cs = getComputedStyle(sourceEl);
|
|
134107
|
+
} catch {
|
|
134108
|
+
return;
|
|
134109
|
+
}
|
|
134110
|
+
const author = sourceEl.style;
|
|
134111
|
+
if (author && author.length) {
|
|
134112
|
+
for (let i = 0; i < author.length; i++) {
|
|
134113
|
+
const prop = author[i];
|
|
134114
|
+
const val = author.getPropertyValue(prop);
|
|
134115
|
+
if (!val || !val.includes("var(")) continue;
|
|
134116
|
+
const resolved = cs.getPropertyValue(prop);
|
|
134117
|
+
if (resolved) {
|
|
134118
|
+
try {
|
|
134119
|
+
cloneEl.style.setProperty(prop, resolved.trim(), author.getPropertyPriority(prop));
|
|
134120
|
+
} catch {
|
|
134121
|
+
}
|
|
134122
|
+
}
|
|
134123
|
+
}
|
|
134124
|
+
}
|
|
134125
|
+
if (sourceEl.attributes?.length) {
|
|
134126
|
+
const attrs = sourceEl.attributes;
|
|
134127
|
+
for (let i = 0; i < attrs.length; i++) {
|
|
134128
|
+
const a = attrs[i];
|
|
134129
|
+
if (!a || typeof a.value !== "string" || !a.value.includes("var(")) continue;
|
|
134130
|
+
const propName = a.name;
|
|
134131
|
+
let resolved = "";
|
|
134132
|
+
try {
|
|
134133
|
+
resolved = cs.getPropertyValue(propName);
|
|
134134
|
+
} catch {
|
|
134135
|
+
}
|
|
134136
|
+
if (resolved) {
|
|
134137
|
+
try {
|
|
134138
|
+
cloneEl.style.setProperty(propName, resolved.trim());
|
|
134139
|
+
} catch {
|
|
134140
|
+
}
|
|
134141
|
+
}
|
|
134142
|
+
}
|
|
134143
|
+
}
|
|
134144
|
+
}
|
|
134145
|
+
|
|
134146
|
+
// src/core/clone.js
|
|
134147
|
+
function idleCallback(childList, callback, fast) {
|
|
134148
|
+
return Promise.all(childList.map((child) => {
|
|
134149
|
+
return new Promise((resolve) => {
|
|
134150
|
+
function deal() {
|
|
134151
|
+
idle((deadline) => {
|
|
134152
|
+
const hasIdleBudget = deadline && typeof deadline.timeRemaining === "function" ? deadline.timeRemaining() > 0 : true;
|
|
134153
|
+
if (hasIdleBudget) {
|
|
134154
|
+
callback(child, resolve);
|
|
134155
|
+
} else {
|
|
134156
|
+
deal();
|
|
134157
|
+
}
|
|
134158
|
+
}, { fast });
|
|
134159
|
+
}
|
|
134160
|
+
deal();
|
|
134161
|
+
});
|
|
134162
|
+
}));
|
|
134163
|
+
}
|
|
134164
|
+
function addNotSlottedRightmost(sel) {
|
|
134165
|
+
sel = sel.trim();
|
|
134166
|
+
if (!sel) return sel;
|
|
134167
|
+
if (/:not\(\s*\[data-sd-slotted\]\s*\)\s*$/.test(sel)) return sel;
|
|
134168
|
+
return `${sel}:not([data-sd-slotted])`;
|
|
134169
|
+
}
|
|
134170
|
+
function wrapWithScope(selectorList, scopeSelector, excludeSlotted = true) {
|
|
134171
|
+
return selectorList.split(",").map((s) => s.trim()).filter(Boolean).map((s) => {
|
|
134172
|
+
if (s.startsWith(":where(")) return s;
|
|
134173
|
+
if (s.startsWith("@")) return s;
|
|
134174
|
+
const body = excludeSlotted ? addNotSlottedRightmost(s) : s;
|
|
134175
|
+
return `:where(${scopeSelector} ${body})`;
|
|
134176
|
+
}).join(", ");
|
|
134177
|
+
}
|
|
134178
|
+
function rewriteShadowCSS(cssText, scopeSelector) {
|
|
134179
|
+
if (!cssText) return "";
|
|
134180
|
+
cssText = cssText.replace(/:host\(([^)]+)\)/g, (_, sel) => {
|
|
134181
|
+
return `:where(${scopeSelector}:is(${sel.trim()}))`;
|
|
134182
|
+
});
|
|
134183
|
+
cssText = cssText.replace(/:host\b/g, `:where(${scopeSelector})`);
|
|
134184
|
+
cssText = cssText.replace(/:host-context\(([^)]+)\)/g, (_, sel) => {
|
|
134185
|
+
return `:where(:where(${sel.trim()}) ${scopeSelector})`;
|
|
134186
|
+
});
|
|
134187
|
+
cssText = cssText.replace(/::slotted\(([^)]+)\)/g, (_, sel) => {
|
|
134188
|
+
return `:where(${scopeSelector} ${sel.trim()})`;
|
|
134189
|
+
});
|
|
134190
|
+
cssText = cssText.replace(/(^|})(\s*)([^@}{]+){/g, (_, brace, ws, selectorList) => {
|
|
134191
|
+
const wrapped = wrapWithScope(
|
|
134192
|
+
selectorList,
|
|
134193
|
+
scopeSelector,
|
|
134194
|
+
/*excludeSlotted*/
|
|
134195
|
+
true
|
|
134196
|
+
);
|
|
134197
|
+
return `${brace}${ws}${wrapped}{`;
|
|
134198
|
+
});
|
|
134199
|
+
return cssText;
|
|
134200
|
+
}
|
|
134201
|
+
function nextShadowScopeId(sessionCache) {
|
|
134202
|
+
sessionCache.shadowScopeSeq = (sessionCache.shadowScopeSeq || 0) + 1;
|
|
134203
|
+
return `s${sessionCache.shadowScopeSeq}`;
|
|
134204
|
+
}
|
|
134205
|
+
function extractShadowCSS(sr) {
|
|
134206
|
+
let css = "";
|
|
134207
|
+
try {
|
|
134208
|
+
sr.querySelectorAll("style").forEach((s) => {
|
|
134209
|
+
css += (s.textContent || "") + "\n";
|
|
134210
|
+
});
|
|
134211
|
+
const sheets = sr.adoptedStyleSheets || [];
|
|
134212
|
+
for (const sh of sheets) {
|
|
134213
|
+
try {
|
|
134214
|
+
if (sh && sh.cssRules) {
|
|
134215
|
+
for (const rule of sh.cssRules) css += rule.cssText + "\n";
|
|
134216
|
+
}
|
|
134217
|
+
} catch {
|
|
134218
|
+
}
|
|
134219
|
+
}
|
|
134220
|
+
} catch {
|
|
134221
|
+
}
|
|
134222
|
+
return css;
|
|
134223
|
+
}
|
|
134224
|
+
function injectScopedStyle(hostClone, cssText, scopeId) {
|
|
134225
|
+
if (!cssText) return;
|
|
134226
|
+
const style = document.createElement("style");
|
|
134227
|
+
style.setAttribute("data-sd", scopeId);
|
|
134228
|
+
style.textContent = cssText;
|
|
134229
|
+
hostClone.insertBefore(style, hostClone.firstChild || null);
|
|
134230
|
+
}
|
|
134231
|
+
function freezeImgSrcset(original, cloned) {
|
|
134232
|
+
try {
|
|
134233
|
+
const chosen = original.currentSrc || original.src || "";
|
|
134234
|
+
if (!chosen) return;
|
|
134235
|
+
cloned.setAttribute("src", chosen);
|
|
134236
|
+
cloned.removeAttribute("srcset");
|
|
134237
|
+
cloned.removeAttribute("sizes");
|
|
134238
|
+
cloned.loading = "eager";
|
|
134239
|
+
cloned.decoding = "sync";
|
|
134240
|
+
} catch {
|
|
134241
|
+
}
|
|
134242
|
+
}
|
|
134243
|
+
function collectCustomPropsFromCSS(cssText) {
|
|
134244
|
+
const out = /* @__PURE__ */ new Set();
|
|
134245
|
+
if (!cssText) return out;
|
|
134246
|
+
const re = /var\(\s*(--[A-Za-z0-9_-]+)\b/g;
|
|
134247
|
+
let m;
|
|
134248
|
+
while (m = re.exec(cssText)) out.add(m[1]);
|
|
134249
|
+
return out;
|
|
134250
|
+
}
|
|
134251
|
+
function resolveCustomProp(el, name) {
|
|
134252
|
+
try {
|
|
134253
|
+
const cs = getComputedStyle(el);
|
|
134254
|
+
let v = cs.getPropertyValue(name).trim();
|
|
134255
|
+
if (v) return v;
|
|
134256
|
+
} catch {
|
|
134257
|
+
}
|
|
134258
|
+
try {
|
|
134259
|
+
const rootCS = getComputedStyle(document.documentElement);
|
|
134260
|
+
let v = rootCS.getPropertyValue(name).trim();
|
|
134261
|
+
if (v) return v;
|
|
134262
|
+
} catch {
|
|
134263
|
+
}
|
|
134264
|
+
return "";
|
|
134265
|
+
}
|
|
134266
|
+
function buildSeedCustomPropsRule(hostEl, names, scopeSelector) {
|
|
134267
|
+
const decls = [];
|
|
134268
|
+
for (const name of names) {
|
|
134269
|
+
const val = resolveCustomProp(hostEl, name);
|
|
134270
|
+
if (val) decls.push(`${name}: ${val};`);
|
|
134271
|
+
}
|
|
134272
|
+
if (!decls.length) return "";
|
|
134273
|
+
return `${scopeSelector}{${decls.join("")}}
|
|
134274
|
+
`;
|
|
134275
|
+
}
|
|
134276
|
+
function markSlottedSubtree(root) {
|
|
134277
|
+
if (!root) return;
|
|
134278
|
+
if (root.nodeType === Node.ELEMENT_NODE) {
|
|
134279
|
+
root.setAttribute("data-sd-slotted", "");
|
|
134280
|
+
}
|
|
134281
|
+
if (root.querySelectorAll) {
|
|
134282
|
+
root.querySelectorAll("*").forEach((el) => el.setAttribute("data-sd-slotted", ""));
|
|
134283
|
+
}
|
|
134284
|
+
}
|
|
134285
|
+
async function getAccessibleIframeDocument(iframe, attempts = 3) {
|
|
134286
|
+
const probe = () => {
|
|
134287
|
+
try {
|
|
134288
|
+
return iframe.contentDocument || iframe.contentWindow?.document || null;
|
|
134289
|
+
} catch {
|
|
134290
|
+
return null;
|
|
134291
|
+
}
|
|
134292
|
+
};
|
|
134293
|
+
let doc = probe();
|
|
134294
|
+
let i = 0;
|
|
134295
|
+
while (i < attempts && (!doc || !doc.body && !doc.documentElement)) {
|
|
134296
|
+
await new Promise((r) => setTimeout(r, 0));
|
|
134297
|
+
doc = probe();
|
|
134298
|
+
i++;
|
|
134299
|
+
}
|
|
134300
|
+
return doc && (doc.body || doc.documentElement) ? doc : null;
|
|
134301
|
+
}
|
|
134302
|
+
function measureContentBox(el) {
|
|
134303
|
+
const rect = el.getBoundingClientRect();
|
|
134304
|
+
let bl = 0, br = 0, bt = 0, bb = 0;
|
|
134305
|
+
try {
|
|
134306
|
+
const cs = getComputedStyle(el);
|
|
134307
|
+
bl = parseFloat(cs.borderLeftWidth) || 0;
|
|
134308
|
+
br = parseFloat(cs.borderRightWidth) || 0;
|
|
134309
|
+
bt = parseFloat(cs.borderTopWidth) || 0;
|
|
134310
|
+
bb = parseFloat(cs.borderBottomWidth) || 0;
|
|
134311
|
+
} catch {
|
|
134312
|
+
}
|
|
134313
|
+
const contentWidth = Math.max(0, Math.round(rect.width - (bl + br)));
|
|
134314
|
+
const contentHeight = Math.max(0, Math.round(rect.height - (bt + bb)));
|
|
134315
|
+
return { contentWidth, contentHeight, rect };
|
|
134316
|
+
}
|
|
134317
|
+
function pinIframeViewport(doc, w, h) {
|
|
134318
|
+
const style = doc.createElement("style");
|
|
134319
|
+
style.setAttribute("data-sd-iframe-pin", "");
|
|
134320
|
+
style.textContent = `html, body {margin: 0 !important;padding: 0 !important;width: ${w}px !important;height: ${h}px !important;min-width: ${w}px !important;min-height: ${h}px !important;box-sizing: border-box !important;overflow: hidden !important;background-clip: border-box !important;}`;
|
|
134321
|
+
(doc.head || doc.documentElement).appendChild(style);
|
|
134322
|
+
return () => {
|
|
134323
|
+
try {
|
|
134324
|
+
style.remove();
|
|
134325
|
+
} catch {
|
|
134326
|
+
}
|
|
134327
|
+
};
|
|
134328
|
+
}
|
|
134329
|
+
async function rasterizeIframe(iframe, sessionCache, options) {
|
|
134330
|
+
const doc = await getAccessibleIframeDocument(iframe, 3);
|
|
134331
|
+
if (!doc) throw new Error("iframe document not accessible/ready");
|
|
134332
|
+
const { contentWidth, contentHeight, rect } = measureContentBox(iframe);
|
|
134333
|
+
const snap = options?.snap;
|
|
134334
|
+
if (!snap || typeof snap.toPng !== "function") {
|
|
134335
|
+
throw new Error("snapdom.toPng not available in iframe or window");
|
|
134336
|
+
}
|
|
134337
|
+
const nested = { ...options, scale: 1 };
|
|
134338
|
+
const unpin = pinIframeViewport(doc, contentWidth, contentHeight);
|
|
134339
|
+
let imgEl;
|
|
134340
|
+
try {
|
|
134341
|
+
imgEl = await snap.toPng(doc.documentElement, nested);
|
|
134342
|
+
} finally {
|
|
134343
|
+
unpin();
|
|
134344
|
+
}
|
|
134345
|
+
imgEl.style.display = "block";
|
|
134346
|
+
imgEl.style.width = `${contentWidth}px`;
|
|
134347
|
+
imgEl.style.height = `${contentHeight}px`;
|
|
134348
|
+
const wrapper = document.createElement("div");
|
|
134349
|
+
sessionCache.nodeMap.set(wrapper, iframe);
|
|
134350
|
+
inlineAllStyles(iframe, wrapper, sessionCache, options);
|
|
134351
|
+
wrapper.style.overflow = "hidden";
|
|
134352
|
+
wrapper.style.display = "block";
|
|
134353
|
+
if (!wrapper.style.width) wrapper.style.width = `${Math.round(rect.width)}px`;
|
|
134354
|
+
if (!wrapper.style.height) wrapper.style.height = `${Math.round(rect.height)}px`;
|
|
134355
|
+
wrapper.appendChild(imgEl);
|
|
134356
|
+
return wrapper;
|
|
134357
|
+
}
|
|
134358
|
+
async function deepClone(node, sessionCache, options) {
|
|
134359
|
+
if (!node) throw new Error("Invalid node");
|
|
134360
|
+
const clonedAssignedNodes = /* @__PURE__ */ new Set();
|
|
134361
|
+
let pendingSelectValue = null;
|
|
134362
|
+
let pendingTextAreaValue = null;
|
|
134363
|
+
if (node.nodeType === Node.ELEMENT_NODE) {
|
|
134364
|
+
const tag = (node.localName || node.tagName || "").toLowerCase();
|
|
134365
|
+
if (node.id === "snapdom-sandbox" || node.hasAttribute("data-snapdom-sandbox")) {
|
|
134366
|
+
return null;
|
|
134367
|
+
}
|
|
134368
|
+
if (NO_CAPTURE_TAGS.has(tag)) {
|
|
134369
|
+
return null;
|
|
134370
|
+
}
|
|
134371
|
+
}
|
|
134372
|
+
if (node.nodeType === Node.TEXT_NODE) {
|
|
134373
|
+
return node.cloneNode(true);
|
|
134374
|
+
}
|
|
134375
|
+
if (node.nodeType !== Node.ELEMENT_NODE) {
|
|
134376
|
+
return node.cloneNode(true);
|
|
134377
|
+
}
|
|
134378
|
+
if (node.getAttribute("data-capture") === "exclude") {
|
|
134379
|
+
if (options.excludeMode === "hide") {
|
|
134380
|
+
const spacer = document.createElement("div");
|
|
134381
|
+
const rect = node.getBoundingClientRect();
|
|
134382
|
+
spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
|
|
134383
|
+
return spacer;
|
|
134384
|
+
} else if (options.excludeMode === "remove") {
|
|
134385
|
+
return null;
|
|
134386
|
+
}
|
|
134387
|
+
}
|
|
134388
|
+
if (options.exclude && Array.isArray(options.exclude)) {
|
|
134389
|
+
for (const selector of options.exclude) {
|
|
134390
|
+
try {
|
|
134391
|
+
if (node.matches?.(selector)) {
|
|
134392
|
+
if (options.excludeMode === "hide") {
|
|
134393
|
+
const spacer = document.createElement("div");
|
|
134394
|
+
const rect = node.getBoundingClientRect();
|
|
134395
|
+
spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
|
|
134396
|
+
return spacer;
|
|
134397
|
+
} else if (options.excludeMode === "remove") {
|
|
134398
|
+
return null;
|
|
134399
|
+
}
|
|
134400
|
+
}
|
|
134401
|
+
} catch (err) {
|
|
134402
|
+
console.warn(`Invalid selector in exclude option: ${selector}`, err);
|
|
134403
|
+
}
|
|
134404
|
+
}
|
|
134405
|
+
}
|
|
134406
|
+
if (typeof options.filter === "function") {
|
|
134407
|
+
try {
|
|
134408
|
+
if (!options.filter(node)) {
|
|
134409
|
+
if (options.filterMode === "hide") {
|
|
134410
|
+
const spacer = document.createElement("div");
|
|
134411
|
+
const rect = node.getBoundingClientRect();
|
|
134412
|
+
spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
|
|
134413
|
+
return spacer;
|
|
134414
|
+
} else if (options.filterMode === "remove") {
|
|
134415
|
+
return null;
|
|
134416
|
+
}
|
|
134417
|
+
}
|
|
134418
|
+
} catch (err) {
|
|
134419
|
+
console.warn("Error in filter function:", err);
|
|
134420
|
+
}
|
|
134421
|
+
}
|
|
134422
|
+
if (node.tagName === "IFRAME") {
|
|
134423
|
+
let sameOrigin = false;
|
|
134424
|
+
try {
|
|
134425
|
+
sameOrigin = !!(node.contentDocument || node.contentWindow?.document);
|
|
134426
|
+
} catch {
|
|
134427
|
+
sameOrigin = false;
|
|
134428
|
+
}
|
|
134429
|
+
if (sameOrigin) {
|
|
134430
|
+
try {
|
|
134431
|
+
const wrapper = await rasterizeIframe(node, sessionCache, options);
|
|
134432
|
+
return wrapper;
|
|
134433
|
+
} catch (err) {
|
|
134434
|
+
console.warn("[SnapDOM] iframe rasterization failed, fallback:", err);
|
|
134435
|
+
}
|
|
134436
|
+
}
|
|
134437
|
+
if (options.placeholders) {
|
|
134438
|
+
const fallback = document.createElement("div");
|
|
134439
|
+
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;`;
|
|
134440
|
+
inlineAllStyles(node, fallback, sessionCache, options);
|
|
134441
|
+
return fallback;
|
|
134442
|
+
} else {
|
|
134443
|
+
const rect = node.getBoundingClientRect();
|
|
134444
|
+
const spacer = document.createElement("div");
|
|
134445
|
+
spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
|
|
134446
|
+
inlineAllStyles(node, spacer, sessionCache, options);
|
|
134447
|
+
return spacer;
|
|
134448
|
+
}
|
|
134449
|
+
}
|
|
134450
|
+
if (node.getAttribute("data-capture") === "placeholder") {
|
|
134451
|
+
const clone2 = node.cloneNode(false);
|
|
134452
|
+
sessionCache.nodeMap.set(clone2, node);
|
|
134453
|
+
inlineAllStyles(node, clone2, sessionCache, options);
|
|
134454
|
+
const placeholder = document.createElement("div");
|
|
134455
|
+
placeholder.textContent = node.getAttribute("data-placeholder-text") || "";
|
|
134456
|
+
placeholder.style.cssText = "color:#666;font-size:12px;text-align:center;line-height:1.4;padding:0.5em;box-sizing:border-box;";
|
|
134457
|
+
clone2.appendChild(placeholder);
|
|
134458
|
+
return clone2;
|
|
134459
|
+
}
|
|
134460
|
+
if (node.tagName === "CANVAS") {
|
|
134461
|
+
const dataURL = node.toDataURL();
|
|
134462
|
+
const img = document.createElement("img");
|
|
134463
|
+
img.src = dataURL;
|
|
134464
|
+
img.width = node.width;
|
|
134465
|
+
img.height = node.height;
|
|
134466
|
+
sessionCache.nodeMap.set(img, node);
|
|
134467
|
+
inlineAllStyles(node, img, sessionCache, options);
|
|
134468
|
+
return img;
|
|
134469
|
+
}
|
|
134470
|
+
let clone;
|
|
134471
|
+
try {
|
|
134472
|
+
clone = node.cloneNode(false);
|
|
134473
|
+
resolveCSSVars(node, clone);
|
|
134474
|
+
sessionCache.nodeMap.set(clone, node);
|
|
134475
|
+
if (node.tagName === "IMG") {
|
|
134476
|
+
freezeImgSrcset(node, clone);
|
|
134477
|
+
try {
|
|
134478
|
+
const rect = node.getBoundingClientRect();
|
|
134479
|
+
let w = Math.round(rect.width || 0);
|
|
134480
|
+
let h = Math.round(rect.height || 0);
|
|
134481
|
+
if (!w || !h) {
|
|
134482
|
+
const computed = window.getComputedStyle(node);
|
|
134483
|
+
const cssW = parseFloat(computed.width) || 0;
|
|
134484
|
+
const cssH = parseFloat(computed.height) || 0;
|
|
134485
|
+
const attrW = parseInt(node.getAttribute("width") || "", 10) || 0;
|
|
134486
|
+
const attrH = parseInt(node.getAttribute("height") || "", 10) || 0;
|
|
134487
|
+
const propW = node.width || node.naturalWidth || 0;
|
|
134488
|
+
const propH = node.height || node.naturalHeight || 0;
|
|
134489
|
+
w = Math.round(w || cssW || attrW || propW || 0);
|
|
134490
|
+
h = Math.round(h || cssH || attrH || propH || 0);
|
|
134491
|
+
}
|
|
134492
|
+
if (w) clone.dataset.snapdomWidth = String(w);
|
|
134493
|
+
if (h) clone.dataset.snapdomHeight = String(h);
|
|
134494
|
+
} catch {
|
|
134495
|
+
}
|
|
134496
|
+
}
|
|
134497
|
+
} catch (err) {
|
|
134498
|
+
console.error("[Snapdom] Failed to clone node:", node, err);
|
|
134499
|
+
throw err;
|
|
134500
|
+
}
|
|
134501
|
+
if (node instanceof HTMLTextAreaElement) {
|
|
134502
|
+
const rect = node.getBoundingClientRect();
|
|
134503
|
+
clone.style.width = `${rect.width}px`;
|
|
134504
|
+
clone.style.height = `${rect.height}px`;
|
|
134505
|
+
}
|
|
134506
|
+
if (node instanceof HTMLInputElement) {
|
|
134507
|
+
clone.value = node.value;
|
|
134508
|
+
clone.setAttribute("value", node.value);
|
|
134509
|
+
if (node.checked !== void 0) {
|
|
134510
|
+
clone.checked = node.checked;
|
|
134511
|
+
if (node.checked) clone.setAttribute("checked", "");
|
|
134512
|
+
if (node.indeterminate) clone.indeterminate = node.indeterminate;
|
|
134513
|
+
}
|
|
134514
|
+
}
|
|
134515
|
+
if (node instanceof HTMLSelectElement) {
|
|
134516
|
+
pendingSelectValue = node.value;
|
|
134517
|
+
}
|
|
134518
|
+
if (node instanceof HTMLTextAreaElement) {
|
|
134519
|
+
pendingTextAreaValue = node.value;
|
|
134520
|
+
}
|
|
134521
|
+
inlineAllStyles(node, clone, sessionCache, options);
|
|
134522
|
+
if (node.shadowRoot) {
|
|
134523
|
+
let callback2 = function(child, resolve) {
|
|
134524
|
+
if (child.nodeType === Node.ELEMENT_NODE && child.tagName === "STYLE") {
|
|
134525
|
+
return resolve(null);
|
|
134526
|
+
} else {
|
|
134527
|
+
deepClone(child, sessionCache, options).then((clonedChild) => {
|
|
134528
|
+
resolve(clonedChild || null);
|
|
134529
|
+
}).catch(() => {
|
|
134530
|
+
resolve(null);
|
|
134531
|
+
});
|
|
134532
|
+
}
|
|
134533
|
+
};
|
|
134534
|
+
try {
|
|
134535
|
+
const slots = node.shadowRoot.querySelectorAll("slot");
|
|
134536
|
+
for (const s of slots) {
|
|
134537
|
+
let assigned = [];
|
|
134538
|
+
try {
|
|
134539
|
+
assigned = s.assignedNodes?.({ flatten: true }) || s.assignedNodes?.() || [];
|
|
134540
|
+
} catch {
|
|
134541
|
+
assigned = s.assignedNodes?.() || [];
|
|
134542
|
+
}
|
|
134543
|
+
for (const an of assigned) clonedAssignedNodes.add(an);
|
|
134544
|
+
}
|
|
134545
|
+
} catch {
|
|
134546
|
+
}
|
|
134547
|
+
const scopeId = nextShadowScopeId(sessionCache);
|
|
134548
|
+
const scopeSelector = `[data-sd="${scopeId}"]`;
|
|
134549
|
+
try {
|
|
134550
|
+
clone.setAttribute("data-sd", scopeId);
|
|
134551
|
+
} catch {
|
|
134552
|
+
}
|
|
134553
|
+
const rawCSS = extractShadowCSS(node.shadowRoot);
|
|
134554
|
+
const rewritten = rewriteShadowCSS(rawCSS, scopeSelector);
|
|
134555
|
+
const neededVars = collectCustomPropsFromCSS(rawCSS);
|
|
134556
|
+
const seed = buildSeedCustomPropsRule(node, neededVars, scopeSelector);
|
|
134557
|
+
injectScopedStyle(clone, seed + rewritten, scopeId);
|
|
134558
|
+
const shadowFrag = document.createDocumentFragment();
|
|
134559
|
+
const cloneList2 = await idleCallback(Array.from(node.shadowRoot.childNodes), callback2, options.fast);
|
|
134560
|
+
shadowFrag.append(...cloneList2.filter((clonedChild) => !!clonedChild));
|
|
134561
|
+
clone.appendChild(shadowFrag);
|
|
134562
|
+
}
|
|
134563
|
+
if (node.tagName === "SLOT") {
|
|
134564
|
+
let callback2 = function(child, resolve) {
|
|
134565
|
+
deepClone(child, sessionCache, options).then((clonedChild) => {
|
|
134566
|
+
if (clonedChild) {
|
|
134567
|
+
markSlottedSubtree(clonedChild);
|
|
134568
|
+
}
|
|
134569
|
+
resolve(clonedChild || null);
|
|
134570
|
+
}).catch(() => {
|
|
134571
|
+
resolve(null);
|
|
134572
|
+
});
|
|
134573
|
+
};
|
|
134574
|
+
const assigned = node.assignedNodes?.({ flatten: true }) || [];
|
|
134575
|
+
const nodesToClone = assigned.length > 0 ? assigned : Array.from(node.childNodes);
|
|
134576
|
+
const fragment = document.createDocumentFragment();
|
|
134577
|
+
const cloneList2 = await idleCallback(Array.from(nodesToClone), callback2, options.fast);
|
|
134578
|
+
fragment.append(...cloneList2.filter((clonedChild) => !!clonedChild));
|
|
134579
|
+
return fragment;
|
|
134580
|
+
}
|
|
134581
|
+
function callback(child, resolve) {
|
|
134582
|
+
if (clonedAssignedNodes.has(child)) return resolve(null);
|
|
134583
|
+
deepClone(child, sessionCache, options).then((clonedChild) => {
|
|
134584
|
+
resolve(clonedChild || null);
|
|
134585
|
+
}).catch(() => {
|
|
134586
|
+
resolve(null);
|
|
134587
|
+
});
|
|
134588
|
+
}
|
|
134589
|
+
const cloneList = await idleCallback(Array.from(node.childNodes), callback, options.fast);
|
|
134590
|
+
clone.append(...cloneList.filter((clonedChild) => !!clonedChild));
|
|
134591
|
+
if (pendingSelectValue !== null && clone instanceof HTMLSelectElement) {
|
|
134592
|
+
clone.value = pendingSelectValue;
|
|
134593
|
+
for (const opt of clone.options) {
|
|
134594
|
+
if (opt.value === pendingSelectValue) {
|
|
134595
|
+
opt.setAttribute("selected", "");
|
|
134596
|
+
} else {
|
|
134597
|
+
opt.removeAttribute("selected");
|
|
134598
|
+
}
|
|
134599
|
+
}
|
|
134600
|
+
}
|
|
134601
|
+
if (pendingTextAreaValue !== null && clone instanceof HTMLTextAreaElement) {
|
|
134602
|
+
clone.textContent = pendingTextAreaValue;
|
|
134603
|
+
}
|
|
134604
|
+
return clone;
|
|
134605
|
+
}
|
|
134606
|
+
|
|
134607
|
+
// src/modules/iconFonts.js
|
|
134608
|
+
var defaultIconFonts = [
|
|
134609
|
+
// /uicons/i,
|
|
134610
|
+
/font\s*awesome/i,
|
|
134611
|
+
/material\s*icons/i,
|
|
134612
|
+
/ionicons/i,
|
|
134613
|
+
/glyphicons/i,
|
|
134614
|
+
/feather/i,
|
|
134615
|
+
/bootstrap\s*icons/i,
|
|
134616
|
+
/remix\s*icons/i,
|
|
134617
|
+
/heroicons/i,
|
|
134618
|
+
/layui/i,
|
|
134619
|
+
/lucide/i
|
|
134620
|
+
];
|
|
134621
|
+
var userIconFonts = [];
|
|
134622
|
+
function extendIconFonts(fonts) {
|
|
134623
|
+
const list = Array.isArray(fonts) ? fonts : [fonts];
|
|
134624
|
+
for (const f of list) {
|
|
134625
|
+
if (f instanceof RegExp) {
|
|
134626
|
+
userIconFonts.push(f);
|
|
134627
|
+
} else if (typeof f === "string") {
|
|
134628
|
+
userIconFonts.push(new RegExp(f, "i"));
|
|
134629
|
+
} else {
|
|
134630
|
+
console.warn("[snapdom] Ignored invalid iconFont value:", f);
|
|
134631
|
+
}
|
|
134632
|
+
}
|
|
134633
|
+
}
|
|
134634
|
+
function isIconFont2(input) {
|
|
134635
|
+
const text = typeof input === "string" ? input : "";
|
|
134636
|
+
const candidates = [...defaultIconFonts, ...userIconFonts];
|
|
134637
|
+
for (const rx of candidates) {
|
|
134638
|
+
if (rx instanceof RegExp && rx.test(text)) return true;
|
|
134639
|
+
}
|
|
134640
|
+
if (/icon/i.test(text) || /glyph/i.test(text) || /symbols/i.test(text) || /feather/i.test(text) || /fontawesome/i.test(text)) return true;
|
|
134641
|
+
return false;
|
|
134642
|
+
}
|
|
134643
|
+
|
|
134644
|
+
// src/modules/fonts.js
|
|
134645
|
+
async function iconToImage(unicodeChar, fontFamily, fontWeight, fontSize = 32, color = "#000") {
|
|
134646
|
+
fontFamily = fontFamily.replace(/^['"]+|['"]+$/g, "");
|
|
134647
|
+
const dpr = window.devicePixelRatio || 1;
|
|
134648
|
+
try {
|
|
134649
|
+
await document.fonts.ready;
|
|
134650
|
+
} catch {
|
|
134651
|
+
}
|
|
134652
|
+
const span = document.createElement("span");
|
|
134653
|
+
span.textContent = unicodeChar;
|
|
134654
|
+
span.style.position = "absolute";
|
|
134655
|
+
span.style.visibility = "hidden";
|
|
134656
|
+
span.style.fontFamily = `"${fontFamily}"`;
|
|
134657
|
+
span.style.fontWeight = fontWeight || "normal";
|
|
134658
|
+
span.style.fontSize = `${fontSize}px`;
|
|
134659
|
+
span.style.lineHeight = "1";
|
|
134660
|
+
span.style.whiteSpace = "nowrap";
|
|
134661
|
+
span.style.padding = "0";
|
|
134662
|
+
span.style.margin = "0";
|
|
134663
|
+
document.body.appendChild(span);
|
|
134664
|
+
const rect = span.getBoundingClientRect();
|
|
134665
|
+
const width = Math.ceil(rect.width);
|
|
134666
|
+
const height = Math.ceil(rect.height);
|
|
134667
|
+
document.body.removeChild(span);
|
|
134668
|
+
const canvas = document.createElement("canvas");
|
|
134669
|
+
canvas.width = Math.max(1, width * dpr);
|
|
134670
|
+
canvas.height = Math.max(1, height * dpr);
|
|
134671
|
+
const ctx = canvas.getContext("2d");
|
|
134672
|
+
ctx.scale(dpr, dpr);
|
|
134673
|
+
ctx.font = fontWeight ? `${fontWeight} ${fontSize}px "${fontFamily}"` : `${fontSize}px "${fontFamily}"`;
|
|
134674
|
+
ctx.textAlign = "left";
|
|
134675
|
+
ctx.textBaseline = "top";
|
|
134676
|
+
ctx.fillStyle = color;
|
|
134677
|
+
ctx.fillText(unicodeChar, 0, 0);
|
|
134678
|
+
return {
|
|
134679
|
+
dataUrl: canvas.toDataURL(),
|
|
134680
|
+
width,
|
|
134681
|
+
height
|
|
134682
|
+
};
|
|
134683
|
+
}
|
|
134684
|
+
var GENERIC_FAMILIES = /* @__PURE__ */ new Set([
|
|
134685
|
+
"serif",
|
|
134686
|
+
"sans-serif",
|
|
134687
|
+
"monospace",
|
|
134688
|
+
"cursive",
|
|
134689
|
+
"fantasy",
|
|
134690
|
+
"system-ui",
|
|
134691
|
+
"emoji",
|
|
134692
|
+
"math",
|
|
134693
|
+
"fangsong",
|
|
134694
|
+
"ui-serif",
|
|
134695
|
+
"ui-sans-serif",
|
|
134696
|
+
"ui-monospace",
|
|
134697
|
+
"ui-rounded"
|
|
134698
|
+
]);
|
|
134699
|
+
function pickPrimaryFamily(familyList) {
|
|
134700
|
+
if (!familyList) return "";
|
|
134701
|
+
for (let raw of familyList.split(",")) {
|
|
134702
|
+
let f = raw.trim().replace(/^['"]+|['"]+$/g, "");
|
|
134703
|
+
if (!f) continue;
|
|
134704
|
+
if (!GENERIC_FAMILIES.has(f.toLowerCase())) return f;
|
|
134705
|
+
}
|
|
134706
|
+
return "";
|
|
134707
|
+
}
|
|
134708
|
+
function normWeight(w) {
|
|
134709
|
+
const t = String(w ?? "400").trim().toLowerCase();
|
|
134710
|
+
if (t === "normal") return 400;
|
|
134711
|
+
if (t === "bold") return 700;
|
|
134712
|
+
const n = parseInt(t, 10);
|
|
134713
|
+
return Number.isFinite(n) ? Math.min(900, Math.max(100, n)) : 400;
|
|
134714
|
+
}
|
|
134715
|
+
function normStyle(s) {
|
|
134716
|
+
const t = String(s ?? "normal").trim().toLowerCase();
|
|
134717
|
+
if (t.startsWith("italic")) return "italic";
|
|
134718
|
+
if (t.startsWith("oblique")) return "oblique";
|
|
134719
|
+
return "normal";
|
|
134720
|
+
}
|
|
134721
|
+
function normStretchPct(st) {
|
|
134722
|
+
const m = String(st ?? "100%").match(/(\d+(?:\.\d+)?)\s*%/);
|
|
134723
|
+
return m ? Math.max(50, Math.min(200, parseFloat(m[1]))) : 100;
|
|
134724
|
+
}
|
|
134725
|
+
function parseWeightSpec(spec) {
|
|
134726
|
+
const s = String(spec || "400").trim();
|
|
134727
|
+
const m = s.match(/^(\d{2,3})\s+(\d{2,3})$/);
|
|
134728
|
+
if (m) {
|
|
134729
|
+
const a = normWeight(m[1]), b = normWeight(m[2]);
|
|
134730
|
+
return { min: Math.min(a, b), max: Math.max(a, b) };
|
|
134731
|
+
}
|
|
134732
|
+
const v = normWeight(s);
|
|
134733
|
+
return { min: v, max: v };
|
|
134734
|
+
}
|
|
134735
|
+
function parseStyleSpec(spec) {
|
|
134736
|
+
const t = String(spec || "normal").trim().toLowerCase();
|
|
134737
|
+
if (t === "italic") return { kind: "italic" };
|
|
134738
|
+
if (t.startsWith("oblique")) return { kind: "oblique" };
|
|
134739
|
+
return { kind: "normal" };
|
|
134740
|
+
}
|
|
134741
|
+
function parseStretchSpec(spec) {
|
|
134742
|
+
const s = String(spec || "100%").trim();
|
|
134743
|
+
const mm = s.match(/(\d+(?:\.\d+)?)\s*%\s+(\d+(?:\.\d+)?)\s*%/);
|
|
134744
|
+
if (mm) {
|
|
134745
|
+
const a = parseFloat(mm[1]), b = parseFloat(mm[2]);
|
|
134746
|
+
return { min: Math.min(a, b), max: Math.max(a, b) };
|
|
134747
|
+
}
|
|
134748
|
+
const m = s.match(/(\d+(?:\.\d+)?)\s*%/);
|
|
134749
|
+
const v = m ? parseFloat(m[1]) : 100;
|
|
134750
|
+
return { min: v, max: v };
|
|
134751
|
+
}
|
|
134752
|
+
function isLikelyFontStylesheet(href, requiredFamilies) {
|
|
134753
|
+
if (!href) return false;
|
|
134754
|
+
try {
|
|
134755
|
+
const u = new URL(href, location.href);
|
|
134756
|
+
const sameOrigin = u.origin === location.origin;
|
|
134757
|
+
if (sameOrigin) return true;
|
|
134758
|
+
const host = u.host.toLowerCase();
|
|
134759
|
+
const FONT_HOSTS = [
|
|
134760
|
+
"fonts.googleapis.com",
|
|
134761
|
+
"fonts.gstatic.com",
|
|
134762
|
+
"use.typekit.net",
|
|
134763
|
+
"p.typekit.net",
|
|
134764
|
+
"kit.fontawesome.com",
|
|
134765
|
+
"use.fontawesome.com"
|
|
134766
|
+
];
|
|
134767
|
+
if (FONT_HOSTS.some((h) => host.endsWith(h))) return true;
|
|
134768
|
+
const path = (u.pathname + u.search).toLowerCase();
|
|
134769
|
+
if (/\bfont(s)?\b/.test(path) || /\.woff2?(\b|$)/.test(path)) return true;
|
|
134770
|
+
for (const fam of requiredFamilies) {
|
|
134771
|
+
const tokenA = fam.toLowerCase().replace(/\s+/g, "+");
|
|
134772
|
+
const tokenB = fam.toLowerCase().replace(/\s+/g, "-");
|
|
134773
|
+
if (path.includes(tokenA) || path.includes(tokenB)) return true;
|
|
134774
|
+
}
|
|
134775
|
+
return false;
|
|
134776
|
+
} catch {
|
|
134777
|
+
return false;
|
|
134778
|
+
}
|
|
134779
|
+
}
|
|
134780
|
+
function familiesFromRequired(required) {
|
|
134781
|
+
const out = /* @__PURE__ */ new Set();
|
|
134782
|
+
for (const k of required || []) {
|
|
134783
|
+
const fam = String(k).split("__")[0]?.trim();
|
|
134784
|
+
if (fam) out.add(fam);
|
|
134785
|
+
}
|
|
134786
|
+
return out;
|
|
134787
|
+
}
|
|
134788
|
+
function rewriteRelativeUrls(cssText, baseHref) {
|
|
134789
|
+
if (!cssText) return cssText;
|
|
134790
|
+
return cssText.replace(
|
|
134791
|
+
/url\(\s*(['"]?)([^)'"]+)\1\s*\)/g,
|
|
134792
|
+
(m, q, u) => {
|
|
134793
|
+
const src = (u || "").trim();
|
|
134794
|
+
if (!src || /^data:|^blob:|^https?:|^file:|^about:/i.test(src)) return m;
|
|
134795
|
+
let abs = src;
|
|
134796
|
+
try {
|
|
134797
|
+
abs = new URL(src, baseHref || location.href).href;
|
|
134798
|
+
} catch {
|
|
134799
|
+
}
|
|
134800
|
+
return `url("${abs}")`;
|
|
134801
|
+
}
|
|
134802
|
+
);
|
|
134803
|
+
}
|
|
134804
|
+
var IMPORT_ANY_RE = /@import\s+(?:url\(\s*(['"]?)([^)"']+)\1\s*\)|(['"])([^"']+)\3)([^;]*);/g;
|
|
134805
|
+
var MAX_IMPORT_DEPTH = 4;
|
|
134806
|
+
async function inlineImportsAndRewrite(cssText, ownerHref, useProxy) {
|
|
134807
|
+
if (!cssText) return cssText;
|
|
134808
|
+
const visited = /* @__PURE__ */ new Set();
|
|
134809
|
+
function normalizeUrl(u, base) {
|
|
134810
|
+
try {
|
|
134811
|
+
return new URL(u, base || location.href).href;
|
|
134812
|
+
} catch {
|
|
134813
|
+
return u;
|
|
134814
|
+
}
|
|
134815
|
+
}
|
|
134816
|
+
async function resolveOnce(text, baseHref, depth = 0) {
|
|
134817
|
+
if (depth > MAX_IMPORT_DEPTH) {
|
|
134818
|
+
console.warn(`[snapDOM] @import depth exceeded (${MAX_IMPORT_DEPTH}) at ${baseHref}`);
|
|
134819
|
+
return text;
|
|
134820
|
+
}
|
|
134821
|
+
let out = "";
|
|
134822
|
+
let last = 0;
|
|
134823
|
+
let m;
|
|
134824
|
+
while (m = IMPORT_ANY_RE.exec(text)) {
|
|
134825
|
+
out += text.slice(last, m.index);
|
|
134826
|
+
last = IMPORT_ANY_RE.lastIndex;
|
|
134827
|
+
const rawUrl = (m[2] || m[4] || "").trim();
|
|
134828
|
+
const absUrl = normalizeUrl(rawUrl, baseHref);
|
|
134829
|
+
if (visited.has(absUrl)) {
|
|
134830
|
+
console.warn(`[snapDOM] Skipping circular @import: ${absUrl}`);
|
|
134831
|
+
continue;
|
|
134832
|
+
}
|
|
134833
|
+
visited.add(absUrl);
|
|
134834
|
+
let imported = "";
|
|
134835
|
+
try {
|
|
134836
|
+
const r = await snapFetch(absUrl, { as: "text", useProxy, silent: true });
|
|
134837
|
+
if (r.ok && typeof r.data === "string") imported = r.data;
|
|
134838
|
+
} catch {
|
|
134839
|
+
}
|
|
134840
|
+
if (imported) {
|
|
134841
|
+
imported = rewriteRelativeUrls(imported, absUrl);
|
|
134842
|
+
imported = await resolveOnce(imported, absUrl, depth + 1);
|
|
134843
|
+
out += `
|
|
134844
|
+
/* inlined: ${absUrl} */
|
|
134845
|
+
${imported}
|
|
134846
|
+
`;
|
|
134847
|
+
} else {
|
|
134848
|
+
out += m[0];
|
|
134849
|
+
}
|
|
134850
|
+
}
|
|
134851
|
+
out += text.slice(last);
|
|
134852
|
+
return out;
|
|
134853
|
+
}
|
|
134854
|
+
let rewritten = rewriteRelativeUrls(cssText, ownerHref || location.href);
|
|
134855
|
+
rewritten = await resolveOnce(rewritten, ownerHref || location.href, 0);
|
|
134856
|
+
return rewritten;
|
|
134857
|
+
}
|
|
134858
|
+
var URL_RE = /url\((["']?)([^"')]+)\1\)/g;
|
|
134859
|
+
var FACE_RE = /@font-face[^{}]*\{[^}]*\}/g;
|
|
134860
|
+
function parseUnicodeRange(ur) {
|
|
134861
|
+
if (!ur) return [];
|
|
134862
|
+
const ranges = [];
|
|
134863
|
+
const parts = ur.split(",").map((s) => s.trim()).filter(Boolean);
|
|
134864
|
+
for (const p of parts) {
|
|
134865
|
+
const m = p.match(/^U\+([0-9A-Fa-f?]+)(?:-([0-9A-Fa-f?]+))?$/);
|
|
134866
|
+
if (!m) continue;
|
|
134867
|
+
const a = m[1], b = m[2];
|
|
134868
|
+
const expand = (hex) => {
|
|
134869
|
+
if (!hex.includes("?")) return parseInt(hex, 16);
|
|
134870
|
+
const min = parseInt(hex.replace(/\?/g, "0"), 16);
|
|
134871
|
+
const max = parseInt(hex.replace(/\?/g, "F"), 16);
|
|
134872
|
+
return [min, max];
|
|
134873
|
+
};
|
|
134874
|
+
if (b) {
|
|
134875
|
+
const A = expand(a), B = expand(b);
|
|
134876
|
+
const min = Array.isArray(A) ? A[0] : A;
|
|
134877
|
+
const max = Array.isArray(B) ? B[1] : B;
|
|
134878
|
+
ranges.push([Math.min(min, max), Math.max(min, max)]);
|
|
134879
|
+
} else {
|
|
134880
|
+
const X = expand(a);
|
|
134881
|
+
if (Array.isArray(X)) ranges.push([X[0], X[1]]);
|
|
134882
|
+
else ranges.push([X, X]);
|
|
134883
|
+
}
|
|
134884
|
+
}
|
|
134885
|
+
return ranges;
|
|
134886
|
+
}
|
|
134887
|
+
function unicodeIntersects(used, ranges) {
|
|
134888
|
+
if (!ranges.length) return true;
|
|
134889
|
+
if (!used || used.size === 0) return true;
|
|
134890
|
+
for (const cp of used) {
|
|
134891
|
+
for (const [a, b] of ranges) if (cp >= a && cp <= b) return true;
|
|
134892
|
+
}
|
|
134893
|
+
return false;
|
|
134894
|
+
}
|
|
134895
|
+
function extractSrcUrls(srcValue, baseHref) {
|
|
134896
|
+
const urls = [];
|
|
134897
|
+
if (!srcValue) return urls;
|
|
134898
|
+
for (const m of srcValue.matchAll(URL_RE)) {
|
|
134899
|
+
let u = (m[2] || "").trim();
|
|
134900
|
+
if (!u || u.startsWith("data:")) continue;
|
|
134901
|
+
if (!/^https?:/i.test(u)) {
|
|
134902
|
+
try {
|
|
134903
|
+
u = new URL(u, baseHref || location.href).href;
|
|
134904
|
+
} catch {
|
|
134905
|
+
}
|
|
134906
|
+
}
|
|
134907
|
+
urls.push(u);
|
|
134908
|
+
}
|
|
134909
|
+
return urls;
|
|
134910
|
+
}
|
|
134911
|
+
async function inlineUrlsInCssBlock(cssBlock, baseHref, useProxy = "") {
|
|
134912
|
+
let out = cssBlock;
|
|
134913
|
+
for (const m of cssBlock.matchAll(URL_RE)) {
|
|
134914
|
+
const raw = extractURL(m[0]);
|
|
134915
|
+
if (!raw) continue;
|
|
134916
|
+
let abs = raw;
|
|
134917
|
+
if (!abs.startsWith("http") && !abs.startsWith("data:")) {
|
|
134918
|
+
try {
|
|
134919
|
+
abs = new URL(abs, baseHref || location.href).href;
|
|
134920
|
+
} catch {
|
|
134921
|
+
}
|
|
134922
|
+
}
|
|
134923
|
+
if (isIconFont2(abs)) continue;
|
|
134924
|
+
if (cache.resource?.has(abs)) {
|
|
134925
|
+
cache.font?.add(abs);
|
|
134926
|
+
out = out.replace(m[0], `url(${cache.resource.get(abs)})`);
|
|
134927
|
+
continue;
|
|
134928
|
+
}
|
|
134929
|
+
if (cache.font?.has(abs)) continue;
|
|
134930
|
+
try {
|
|
134931
|
+
const r = await snapFetch(abs, { as: "dataURL", useProxy, silent: true });
|
|
134932
|
+
if (r.ok && typeof r.data === "string") {
|
|
134933
|
+
const b64 = r.data;
|
|
134934
|
+
cache.resource?.set(abs, b64);
|
|
134935
|
+
cache.font?.add(abs);
|
|
134936
|
+
out = out.replace(m[0], `url(${b64})`);
|
|
134937
|
+
}
|
|
134938
|
+
} catch {
|
|
134939
|
+
console.warn("[snapDOM] Failed to fetch font resource:", abs);
|
|
134940
|
+
}
|
|
134941
|
+
}
|
|
134942
|
+
return out;
|
|
134943
|
+
}
|
|
134944
|
+
function subsetFromRanges(ranges) {
|
|
134945
|
+
if (!ranges.length) return null;
|
|
134946
|
+
const hit = (a, b) => ranges.some(([x, y]) => !(y < a || x > b));
|
|
134947
|
+
const latin = hit(0, 255) || hit(305, 305);
|
|
134948
|
+
const latinExt = hit(256, 591) || hit(7680, 7935);
|
|
134949
|
+
const greek = hit(880, 1023);
|
|
134950
|
+
const cyr = hit(1024, 1279);
|
|
134951
|
+
const viet = hit(7840, 7929) || hit(258, 259) || hit(416, 417) || hit(431, 432);
|
|
134952
|
+
if (viet) return "vietnamese";
|
|
134953
|
+
if (cyr) return "cyrillic";
|
|
134954
|
+
if (greek) return "greek";
|
|
134955
|
+
if (latinExt) return "latin-ext";
|
|
134956
|
+
if (latin) return "latin";
|
|
134957
|
+
return null;
|
|
134958
|
+
}
|
|
134959
|
+
function buildSimpleExcluder(ex = {}) {
|
|
134960
|
+
const famSet = new Set((ex.families || []).map((s) => String(s).toLowerCase()));
|
|
134961
|
+
const domSet = new Set((ex.domains || []).map((s) => String(s).toLowerCase()));
|
|
134962
|
+
const subSet = new Set((ex.subsets || []).map((s) => String(s).toLowerCase()));
|
|
134963
|
+
return (meta, parsedRanges) => {
|
|
134964
|
+
if (famSet.size && famSet.has(meta.family.toLowerCase())) return true;
|
|
134965
|
+
if (domSet.size) {
|
|
134966
|
+
for (const u of meta.srcUrls) {
|
|
134967
|
+
try {
|
|
134968
|
+
if (domSet.has(new URL(u).host.toLowerCase())) return true;
|
|
134969
|
+
} catch {
|
|
134970
|
+
}
|
|
134971
|
+
}
|
|
134972
|
+
}
|
|
134973
|
+
if (subSet.size) {
|
|
134974
|
+
const label = subsetFromRanges(parsedRanges);
|
|
134975
|
+
if (label && subSet.has(label)) return true;
|
|
134976
|
+
}
|
|
134977
|
+
return false;
|
|
134978
|
+
};
|
|
134979
|
+
}
|
|
134980
|
+
function dedupeFontFaces(cssText) {
|
|
134981
|
+
if (!cssText) return cssText;
|
|
134982
|
+
const FACE_RE_G = /@font-face[^{}]*\{[^}]*\}/gi;
|
|
134983
|
+
const seen = /* @__PURE__ */ new Set();
|
|
134984
|
+
const out = [];
|
|
134985
|
+
for (const block of cssText.match(FACE_RE_G) || []) {
|
|
134986
|
+
const familyRaw = block.match(/font-family:\s*([^;]+);/i)?.[1] || "";
|
|
134987
|
+
const family = pickPrimaryFamily(familyRaw);
|
|
134988
|
+
const weightSpec = (block.match(/font-weight:\s*([^;]+);/i)?.[1] || "400").trim();
|
|
134989
|
+
const styleSpec = (block.match(/font-style:\s*([^;]+);/i)?.[1] || "normal").trim();
|
|
134990
|
+
const stretchSpec = (block.match(/font-stretch:\s*([^;]+);/i)?.[1] || "100%").trim();
|
|
134991
|
+
const urange = (block.match(/unicode-range:\s*([^;]+);/i)?.[1] || "").trim();
|
|
134992
|
+
const srcRaw = (block.match(/src\s*:\s*([^;]+);/i)?.[1] || "").trim();
|
|
134993
|
+
const urls = extractSrcUrls(srcRaw, location.href);
|
|
134994
|
+
const srcPart = urls.length ? urls.map((u) => String(u).toLowerCase()).sort().join("|") : srcRaw.toLowerCase();
|
|
134995
|
+
const key = [
|
|
134996
|
+
String(family || "").toLowerCase(),
|
|
134997
|
+
weightSpec,
|
|
134998
|
+
styleSpec,
|
|
134999
|
+
stretchSpec,
|
|
135000
|
+
urange.toLowerCase(),
|
|
135001
|
+
srcPart
|
|
135002
|
+
].join("|");
|
|
135003
|
+
if (!seen.has(key)) {
|
|
135004
|
+
seen.add(key);
|
|
135005
|
+
out.push(block);
|
|
135006
|
+
}
|
|
135007
|
+
}
|
|
135008
|
+
if (out.length === 0) return cssText;
|
|
135009
|
+
let i = 0;
|
|
135010
|
+
return cssText.replace(FACE_RE_G, () => out[i++] || "");
|
|
135011
|
+
}
|
|
135012
|
+
function buildFontsCacheKey(required, exclude, localFonts, useProxy) {
|
|
135013
|
+
const req = Array.from(required || []).sort().join("|");
|
|
135014
|
+
const ex = exclude ? JSON.stringify({
|
|
135015
|
+
families: (exclude.families || []).map((s) => String(s).toLowerCase()).sort(),
|
|
135016
|
+
domains: (exclude.domains || []).map((s) => String(s).toLowerCase()).sort(),
|
|
135017
|
+
subsets: (exclude.subsets || []).map((s) => String(s).toLowerCase()).sort()
|
|
135018
|
+
}) : "";
|
|
135019
|
+
const lf = (localFonts || []).map((f) => `${(f.family || "").toLowerCase()}::${f.weight || "normal"}::${f.style || "normal"}::${f.src || ""}`).sort().join("|");
|
|
135020
|
+
const px = useProxy || "";
|
|
135021
|
+
return `fonts-embed-css::req=${req}::ex=${ex}::lf=${lf}::px=${px}`;
|
|
135022
|
+
}
|
|
135023
|
+
async function collectFacesFromSheet(sheet, baseHref, emitFace, ctx) {
|
|
135024
|
+
let rules;
|
|
135025
|
+
try {
|
|
135026
|
+
rules = sheet.cssRules || [];
|
|
135027
|
+
} catch {
|
|
135028
|
+
return;
|
|
135029
|
+
}
|
|
135030
|
+
const normalizeUrl = (u, base) => {
|
|
135031
|
+
try {
|
|
135032
|
+
return new URL(u, base || location.href).href;
|
|
135033
|
+
} catch {
|
|
135034
|
+
return u;
|
|
135035
|
+
}
|
|
135036
|
+
};
|
|
135037
|
+
for (const rule of rules) {
|
|
135038
|
+
if (rule.type === CSSRule.IMPORT_RULE && rule.styleSheet) {
|
|
135039
|
+
const childHref = rule.href ? normalizeUrl(rule.href, baseHref) : baseHref;
|
|
135040
|
+
if (ctx.depth >= MAX_IMPORT_DEPTH) {
|
|
135041
|
+
console.warn(`[snapDOM] CSSOM import depth exceeded (${MAX_IMPORT_DEPTH}) at ${childHref}`);
|
|
135042
|
+
continue;
|
|
135043
|
+
}
|
|
135044
|
+
if (childHref && ctx.visitedSheets.has(childHref)) {
|
|
135045
|
+
console.warn(`[snapDOM] Skipping circular CSSOM import: ${childHref}`);
|
|
135046
|
+
continue;
|
|
135047
|
+
}
|
|
135048
|
+
if (childHref) ctx.visitedSheets.add(childHref);
|
|
135049
|
+
const nextCtx = { ...ctx, depth: (ctx.depth || 0) + 1 };
|
|
135050
|
+
await collectFacesFromSheet(rule.styleSheet, childHref, emitFace, nextCtx);
|
|
135051
|
+
continue;
|
|
135052
|
+
}
|
|
135053
|
+
if (rule.type === CSSRule.FONT_FACE_RULE) {
|
|
135054
|
+
const famRaw = (rule.style.getPropertyValue("font-family") || "").trim();
|
|
135055
|
+
const family = pickPrimaryFamily(famRaw);
|
|
135056
|
+
if (!family || isIconFont2(family)) continue;
|
|
135057
|
+
const weightSpec = (rule.style.getPropertyValue("font-weight") || "400").trim();
|
|
135058
|
+
const styleSpec = (rule.style.getPropertyValue("font-style") || "normal").trim();
|
|
135059
|
+
const stretchSpec = (rule.style.getPropertyValue("font-stretch") || "100%").trim();
|
|
135060
|
+
const srcRaw = (rule.style.getPropertyValue("src") || "").trim();
|
|
135061
|
+
const urange = (rule.style.getPropertyValue("unicode-range") || "").trim();
|
|
135062
|
+
if (!ctx.faceMatchesRequired(family, styleSpec, weightSpec, stretchSpec)) continue;
|
|
135063
|
+
const ranges = parseUnicodeRange(urange);
|
|
135064
|
+
if (!unicodeIntersects(ctx.usedCodepoints, ranges)) continue;
|
|
135065
|
+
const meta = {
|
|
135066
|
+
family,
|
|
135067
|
+
weightSpec,
|
|
135068
|
+
styleSpec,
|
|
135069
|
+
stretchSpec,
|
|
135070
|
+
unicodeRange: urange,
|
|
135071
|
+
srcRaw,
|
|
135072
|
+
srcUrls: extractSrcUrls(srcRaw, baseHref || location.href),
|
|
135073
|
+
href: baseHref || location.href
|
|
135074
|
+
};
|
|
135075
|
+
if (ctx.simpleExcluder && ctx.simpleExcluder(meta, ranges)) continue;
|
|
135076
|
+
if (/url\(/i.test(srcRaw)) {
|
|
135077
|
+
const inlinedSrc = await inlineUrlsInCssBlock(srcRaw, baseHref || location.href, ctx.useProxy);
|
|
135078
|
+
await emitFace(`@font-face{font-family:${family};src:${inlinedSrc};font-style:${styleSpec};font-weight:${weightSpec};font-stretch:${stretchSpec};${urange ? `unicode-range:${urange};` : ""}}`);
|
|
135079
|
+
} else {
|
|
135080
|
+
await emitFace(`@font-face{font-family:${family};src:${srcRaw};font-style:${styleSpec};font-weight:${weightSpec};font-stretch:${stretchSpec};${urange ? `unicode-range:${urange};` : ""}}`);
|
|
135081
|
+
}
|
|
135082
|
+
}
|
|
135083
|
+
}
|
|
135084
|
+
}
|
|
135085
|
+
async function embedCustomFonts({
|
|
135086
|
+
required,
|
|
135087
|
+
usedCodepoints,
|
|
135088
|
+
exclude = void 0,
|
|
135089
|
+
localFonts = [],
|
|
135090
|
+
useProxy = ""
|
|
135091
|
+
} = {}) {
|
|
135092
|
+
if (!(required instanceof Set)) required = /* @__PURE__ */ new Set();
|
|
135093
|
+
if (!(usedCodepoints instanceof Set)) usedCodepoints = /* @__PURE__ */ new Set();
|
|
135094
|
+
const requiredIndex = /* @__PURE__ */ new Map();
|
|
135095
|
+
for (const key of required) {
|
|
135096
|
+
const [fam, w, s, st] = String(key).split("__");
|
|
135097
|
+
if (!fam) continue;
|
|
135098
|
+
const arr = requiredIndex.get(fam) || [];
|
|
135099
|
+
arr.push({ w: parseInt(w, 10), s, st: parseInt(st, 10) });
|
|
135100
|
+
requiredIndex.set(fam, arr);
|
|
135101
|
+
}
|
|
135102
|
+
function faceMatchesRequired(fam, styleSpec, weightSpec, stretchSpec) {
|
|
135103
|
+
if (!requiredIndex.has(fam)) return false;
|
|
135104
|
+
const need = requiredIndex.get(fam);
|
|
135105
|
+
const ws = parseWeightSpec(weightSpec);
|
|
135106
|
+
const ss = parseStyleSpec(styleSpec);
|
|
135107
|
+
const ts = parseStretchSpec(stretchSpec);
|
|
135108
|
+
const faceIsRange = ws.min !== ws.max;
|
|
135109
|
+
const faceSingleW = ws.min;
|
|
135110
|
+
const styleOK = (reqKind) => ss.kind === "normal" && reqKind === "normal" || ss.kind !== "normal" && (reqKind === "italic" || reqKind === "oblique");
|
|
135111
|
+
let exactMatched = false;
|
|
135112
|
+
for (const r of need) {
|
|
135113
|
+
const wOk = faceIsRange ? r.w >= ws.min && r.w <= ws.max : r.w === faceSingleW;
|
|
135114
|
+
const sOk = styleOK(normStyle(r.s));
|
|
135115
|
+
const tOk = r.st >= ts.min && r.st <= ts.max;
|
|
135116
|
+
if (wOk && sOk && tOk) {
|
|
135117
|
+
exactMatched = true;
|
|
135118
|
+
break;
|
|
135119
|
+
}
|
|
135120
|
+
}
|
|
135121
|
+
if (exactMatched) return true;
|
|
135122
|
+
if (!faceIsRange) {
|
|
135123
|
+
for (const r of need) {
|
|
135124
|
+
const sOk = styleOK(normStyle(r.s));
|
|
135125
|
+
const tOk = r.st >= ts.min && r.st <= ts.max;
|
|
135126
|
+
const nearWeight = Math.abs(faceSingleW - r.w) <= 300;
|
|
135127
|
+
if (nearWeight && sOk && tOk) return true;
|
|
135128
|
+
}
|
|
135129
|
+
}
|
|
135130
|
+
return false;
|
|
135131
|
+
}
|
|
135132
|
+
const simpleExcluder = buildSimpleExcluder(exclude);
|
|
135133
|
+
const cacheKey = buildFontsCacheKey(required, exclude, localFonts, useProxy);
|
|
135134
|
+
if (cache.resource?.has(cacheKey)) {
|
|
135135
|
+
return cache.resource.get(cacheKey);
|
|
135136
|
+
}
|
|
135137
|
+
const requiredFamilies = familiesFromRequired(required);
|
|
135138
|
+
const importUrls = [];
|
|
135139
|
+
const IMPORT_ANY_RE_LOCAL = IMPORT_ANY_RE;
|
|
135140
|
+
for (const styleTag of document.querySelectorAll("style")) {
|
|
135141
|
+
const cssText = styleTag.textContent || "";
|
|
135142
|
+
for (const m of cssText.matchAll(IMPORT_ANY_RE_LOCAL)) {
|
|
135143
|
+
const u = (m[2] || m[4] || "").trim();
|
|
135144
|
+
if (!u || isIconFont2(u)) continue;
|
|
135145
|
+
const hasLink = !!document.querySelector(`link[rel="stylesheet"][href="${u}"]`);
|
|
135146
|
+
if (!hasLink) importUrls.push(u);
|
|
135147
|
+
}
|
|
135148
|
+
}
|
|
135149
|
+
if (importUrls.length) {
|
|
135150
|
+
await Promise.all(importUrls.map((u) => new Promise((resolve) => {
|
|
135151
|
+
if (document.querySelector(`link[rel="stylesheet"][href="${u}"]`)) return resolve(null);
|
|
135152
|
+
const link = document.createElement("link");
|
|
135153
|
+
link.rel = "stylesheet";
|
|
135154
|
+
link.href = u;
|
|
135155
|
+
link.setAttribute("data-snapdom", "injected-import");
|
|
135156
|
+
link.onload = () => resolve(link);
|
|
135157
|
+
link.onerror = () => resolve(null);
|
|
135158
|
+
document.head.appendChild(link);
|
|
135159
|
+
})));
|
|
135160
|
+
}
|
|
135161
|
+
let finalCSS = "";
|
|
135162
|
+
const linkNodes = Array.from(document.querySelectorAll('link[rel="stylesheet"]')).filter((l) => !!l.href);
|
|
135163
|
+
for (const link of linkNodes) {
|
|
135164
|
+
try {
|
|
135165
|
+
if (isIconFont2(link.href)) continue;
|
|
135166
|
+
let cssText = "";
|
|
135167
|
+
let sameOrigin = false;
|
|
135168
|
+
try {
|
|
135169
|
+
sameOrigin = new URL(link.href, location.href).origin === location.origin;
|
|
135170
|
+
} catch {
|
|
135171
|
+
}
|
|
135172
|
+
if (!sameOrigin) {
|
|
135173
|
+
if (!isLikelyFontStylesheet(link.href, requiredFamilies)) continue;
|
|
135174
|
+
}
|
|
135175
|
+
if (sameOrigin) {
|
|
135176
|
+
const sheet = Array.from(document.styleSheets).find((s) => s.href === link.href);
|
|
135177
|
+
if (sheet) {
|
|
135178
|
+
try {
|
|
135179
|
+
const rules = sheet.cssRules || [];
|
|
135180
|
+
cssText = Array.from(rules).map((r) => r.cssText).join("");
|
|
135181
|
+
} catch {
|
|
135182
|
+
}
|
|
135183
|
+
}
|
|
135184
|
+
}
|
|
135185
|
+
if (!cssText) {
|
|
135186
|
+
const res = await snapFetch(link.href, { as: "text", useProxy });
|
|
135187
|
+
cssText = res.data;
|
|
135188
|
+
if (isIconFont2(link.href)) continue;
|
|
135189
|
+
}
|
|
135190
|
+
cssText = await inlineImportsAndRewrite(cssText, link.href, useProxy);
|
|
135191
|
+
let facesOut = "";
|
|
135192
|
+
for (const face of cssText.match(FACE_RE) || []) {
|
|
135193
|
+
const famRaw = (face.match(/font-family:\s*([^;]+);/i)?.[1] || "").trim();
|
|
135194
|
+
const family = pickPrimaryFamily(famRaw);
|
|
135195
|
+
if (!family || isIconFont2(family)) continue;
|
|
135196
|
+
const weightSpec = (face.match(/font-weight:\s*([^;]+);/i)?.[1] || "400").trim();
|
|
135197
|
+
const styleSpec = (face.match(/font-style:\s*([^;]+);/i)?.[1] || "normal").trim();
|
|
135198
|
+
const stretchSpec = (face.match(/font-stretch:\s*([^;]+);/i)?.[1] || "100%").trim();
|
|
135199
|
+
const urange = (face.match(/unicode-range:\s*([^;]+);/i)?.[1] || "").trim();
|
|
135200
|
+
const srcRaw = (face.match(/src\s*:\s*([^;]+);/i)?.[1] || "").trim();
|
|
135201
|
+
const srcUrls = extractSrcUrls(srcRaw, link.href);
|
|
135202
|
+
if (!faceMatchesRequired(family, styleSpec, weightSpec, stretchSpec)) continue;
|
|
135203
|
+
const ranges = parseUnicodeRange(urange);
|
|
135204
|
+
if (!unicodeIntersects(usedCodepoints, ranges)) continue;
|
|
135205
|
+
const meta = { family, weightSpec, styleSpec, stretchSpec, unicodeRange: urange, srcRaw, srcUrls, href: link.href };
|
|
135206
|
+
if (exclude && simpleExcluder(meta, ranges)) continue;
|
|
135207
|
+
const newFace = /url\(/i.test(srcRaw) ? await inlineUrlsInCssBlock(face, link.href, useProxy) : face;
|
|
135208
|
+
facesOut += newFace;
|
|
135209
|
+
}
|
|
135210
|
+
if (facesOut.trim()) finalCSS += facesOut;
|
|
135211
|
+
} catch {
|
|
135212
|
+
console.warn("[snapDOM] Failed to process stylesheet:", link.href);
|
|
135213
|
+
}
|
|
135214
|
+
}
|
|
135215
|
+
const ctx = {
|
|
135216
|
+
requiredIndex,
|
|
135217
|
+
usedCodepoints,
|
|
135218
|
+
faceMatchesRequired,
|
|
135219
|
+
simpleExcluder: exclude ? buildSimpleExcluder(exclude) : null,
|
|
135220
|
+
useProxy,
|
|
135221
|
+
visitedSheets: /* @__PURE__ */ new Set(),
|
|
135222
|
+
depth: 0
|
|
135223
|
+
};
|
|
135224
|
+
for (const sheet of document.styleSheets) {
|
|
135225
|
+
if (sheet.href && linkNodes.some((l) => l.href === sheet.href)) continue;
|
|
135226
|
+
try {
|
|
135227
|
+
const rootHref = sheet.href || location.href;
|
|
135228
|
+
if (rootHref) ctx.visitedSheets.add(rootHref);
|
|
135229
|
+
await collectFacesFromSheet(
|
|
135230
|
+
sheet,
|
|
135231
|
+
rootHref,
|
|
135232
|
+
async (faceCss) => {
|
|
135233
|
+
finalCSS += faceCss;
|
|
135234
|
+
},
|
|
135235
|
+
ctx
|
|
135236
|
+
);
|
|
135237
|
+
} catch {
|
|
135238
|
+
}
|
|
135239
|
+
}
|
|
135240
|
+
try {
|
|
135241
|
+
for (const f of document.fonts || []) {
|
|
135242
|
+
if (!f || !f.family || f.status !== "loaded" || !f._snapdomSrc) continue;
|
|
135243
|
+
const fam = String(f.family).replace(/^['"]+|['"]+$/g, "");
|
|
135244
|
+
if (isIconFont2(fam)) continue;
|
|
135245
|
+
if (!requiredIndex.has(fam)) continue;
|
|
135246
|
+
if (exclude?.families && exclude.families.some((n) => String(n).toLowerCase() === fam.toLowerCase())) {
|
|
135247
|
+
continue;
|
|
135248
|
+
}
|
|
135249
|
+
let b64 = f._snapdomSrc;
|
|
135250
|
+
if (!String(b64).startsWith("data:")) {
|
|
135251
|
+
if (cache.resource?.has(f._snapdomSrc)) {
|
|
135252
|
+
b64 = cache.resource.get(f._snapdomSrc);
|
|
135253
|
+
cache.font?.add(f._snapdomSrc);
|
|
135254
|
+
} else if (!cache.font?.has(f._snapdomSrc)) {
|
|
135255
|
+
try {
|
|
135256
|
+
const r = await snapFetch(f._snapdomSrc, { as: "dataURL", useProxy, silent: true });
|
|
135257
|
+
if (r.ok && typeof r.data === "string") {
|
|
135258
|
+
b64 = r.data;
|
|
135259
|
+
cache.resource?.set(f._snapdomSrc, b64);
|
|
135260
|
+
cache.font?.add(f._snapdomSrc);
|
|
135261
|
+
} else {
|
|
135262
|
+
continue;
|
|
135263
|
+
}
|
|
135264
|
+
} catch {
|
|
135265
|
+
console.warn("[snapDOM] Failed to fetch dynamic font src:", f._snapdomSrc);
|
|
135266
|
+
continue;
|
|
135267
|
+
}
|
|
135268
|
+
}
|
|
135269
|
+
}
|
|
135270
|
+
finalCSS += `@font-face{font-family:'${fam}';src:url(${b64});font-style:${f.style || "normal"};font-weight:${f.weight || "normal"};}`;
|
|
135271
|
+
}
|
|
135272
|
+
} catch {
|
|
135273
|
+
}
|
|
135274
|
+
for (const font of localFonts) {
|
|
135275
|
+
if (!font || typeof font !== "object") continue;
|
|
135276
|
+
const family = String(font.family || "").replace(/^['"]+|['"]+$/g, "");
|
|
135277
|
+
if (!family || isIconFont2(family)) continue;
|
|
135278
|
+
if (!requiredIndex.has(family)) continue;
|
|
135279
|
+
if (exclude?.families && exclude.families.some((n) => String(n).toLowerCase() === family.toLowerCase())) continue;
|
|
135280
|
+
const weight = font.weight != null ? String(font.weight) : "normal";
|
|
135281
|
+
const style = font.style != null ? String(font.style) : "normal";
|
|
135282
|
+
const stretch = font.stretchPct != null ? `${font.stretchPct}%` : "100%";
|
|
135283
|
+
const src = String(font.src || "");
|
|
135284
|
+
let b64 = src;
|
|
135285
|
+
if (!b64.startsWith("data:")) {
|
|
135286
|
+
if (cache.resource?.has(src)) {
|
|
135287
|
+
b64 = cache.resource.get(src);
|
|
135288
|
+
cache.font?.add(src);
|
|
135289
|
+
} else if (!cache.font?.has(src)) {
|
|
135290
|
+
try {
|
|
135291
|
+
const r = await snapFetch(src, { as: "dataURL", useProxy, silent: true });
|
|
135292
|
+
if (r.ok && typeof r.data === "string") {
|
|
135293
|
+
b64 = r.data;
|
|
135294
|
+
cache.resource?.set(src, b64);
|
|
135295
|
+
cache.font?.add(src);
|
|
135296
|
+
} else {
|
|
135297
|
+
continue;
|
|
135298
|
+
}
|
|
135299
|
+
} catch {
|
|
135300
|
+
console.warn("[snapDOM] Failed to fetch localFonts src:", src);
|
|
135301
|
+
continue;
|
|
135302
|
+
}
|
|
135303
|
+
}
|
|
135304
|
+
}
|
|
135305
|
+
finalCSS += `@font-face{font-family:'${family}';src:url(${b64});font-style:${style};font-weight:${weight};font-stretch:${stretch};}`;
|
|
135306
|
+
}
|
|
135307
|
+
if (finalCSS) {
|
|
135308
|
+
finalCSS = dedupeFontFaces(finalCSS);
|
|
135309
|
+
cache.resource?.set(cacheKey, finalCSS);
|
|
135310
|
+
}
|
|
135311
|
+
return finalCSS;
|
|
135312
|
+
}
|
|
135313
|
+
function collectUsedFontVariants(root) {
|
|
135314
|
+
const req = /* @__PURE__ */ new Set();
|
|
135315
|
+
if (!root) return req;
|
|
135316
|
+
const tw = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT, null);
|
|
135317
|
+
const addFromStyle = (cs) => {
|
|
135318
|
+
const family = pickPrimaryFamily(cs.fontFamily);
|
|
135319
|
+
if (!family) return;
|
|
135320
|
+
const key = (w, s, st) => `${family}__${normWeight(w)}__${normStyle(s)}__${normStretchPct(st)}`;
|
|
135321
|
+
req.add(key(cs.fontWeight, cs.fontStyle, cs.fontStretch));
|
|
135322
|
+
};
|
|
135323
|
+
addFromStyle(getComputedStyle(root));
|
|
135324
|
+
const csBeforeRoot = getComputedStyle(root, "::before");
|
|
135325
|
+
if (csBeforeRoot && csBeforeRoot.content && csBeforeRoot.content !== "none") addFromStyle(csBeforeRoot);
|
|
135326
|
+
const csAfterRoot = getComputedStyle(root, "::after");
|
|
135327
|
+
if (csAfterRoot && csAfterRoot.content && csAfterRoot.content !== "none") addFromStyle(csAfterRoot);
|
|
135328
|
+
while (tw.nextNode()) {
|
|
135329
|
+
const el = (
|
|
135330
|
+
/** @type {Element} */
|
|
135331
|
+
tw.currentNode
|
|
135332
|
+
);
|
|
135333
|
+
const cs = getComputedStyle(el);
|
|
135334
|
+
addFromStyle(cs);
|
|
135335
|
+
const b = getComputedStyle(el, "::before");
|
|
135336
|
+
if (b && b.content && b.content !== "none") addFromStyle(b);
|
|
135337
|
+
const a = getComputedStyle(el, "::after");
|
|
135338
|
+
if (a && a.content && a.content !== "none") addFromStyle(a);
|
|
135339
|
+
}
|
|
135340
|
+
return req;
|
|
135341
|
+
}
|
|
135342
|
+
function collectUsedCodepoints(root) {
|
|
135343
|
+
const used = /* @__PURE__ */ new Set();
|
|
135344
|
+
const pushText = (txt) => {
|
|
135345
|
+
if (!txt) return;
|
|
135346
|
+
for (const ch of txt) used.add(ch.codePointAt(0));
|
|
135347
|
+
};
|
|
135348
|
+
const walker = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT | NodeFilter.SHOW_TEXT, null);
|
|
135349
|
+
while (walker.nextNode()) {
|
|
135350
|
+
const n = walker.currentNode;
|
|
135351
|
+
if (n.nodeType === Node.TEXT_NODE) {
|
|
135352
|
+
pushText(n.nodeValue || "");
|
|
135353
|
+
} else if (n.nodeType === Node.ELEMENT_NODE) {
|
|
135354
|
+
const el = (
|
|
135355
|
+
/** @type {Element} */
|
|
135356
|
+
n
|
|
135357
|
+
);
|
|
135358
|
+
for (const pseudo of ["::before", "::after"]) {
|
|
135359
|
+
const cs = getComputedStyle(el, pseudo);
|
|
135360
|
+
const c = cs?.getPropertyValue("content");
|
|
135361
|
+
if (!c || c === "none") continue;
|
|
135362
|
+
if (/^"/.test(c) || /^'/.test(c)) {
|
|
135363
|
+
pushText(c.slice(1, -1));
|
|
135364
|
+
} else {
|
|
135365
|
+
const matches = c.match(/\\[0-9A-Fa-f]{1,6}/g);
|
|
135366
|
+
if (matches) {
|
|
135367
|
+
for (const m of matches) {
|
|
135368
|
+
try {
|
|
135369
|
+
used.add(parseInt(m.slice(1), 16));
|
|
135370
|
+
} catch {
|
|
135371
|
+
}
|
|
135372
|
+
}
|
|
135373
|
+
}
|
|
135374
|
+
}
|
|
135375
|
+
}
|
|
135376
|
+
}
|
|
135377
|
+
}
|
|
135378
|
+
return used;
|
|
135379
|
+
}
|
|
135380
|
+
async function ensureFontsReady(families, warmupRepetitions = 2) {
|
|
135381
|
+
try {
|
|
135382
|
+
await document.fonts.ready;
|
|
135383
|
+
} catch {
|
|
135384
|
+
}
|
|
135385
|
+
const fams = Array.from(families || []).filter(Boolean);
|
|
135386
|
+
if (fams.length === 0) return;
|
|
135387
|
+
const warmupOnce = () => {
|
|
135388
|
+
const container = document.createElement("div");
|
|
135389
|
+
container.style.cssText = "position:absolute!important;left:-9999px!important;top:0!important;opacity:0!important;pointer-events:none!important;contain:layout size style;";
|
|
135390
|
+
for (const fam of fams) {
|
|
135391
|
+
const span = document.createElement("span");
|
|
135392
|
+
span.textContent = "AaBbGg1234\xC1\xC9\xCD\xD3\xDA\xE7\xF1\u2014\u221E";
|
|
135393
|
+
span.style.fontFamily = `"${fam}"`;
|
|
135394
|
+
span.style.fontWeight = "700";
|
|
135395
|
+
span.style.fontStyle = "italic";
|
|
135396
|
+
span.style.fontSize = "32px";
|
|
135397
|
+
span.style.lineHeight = "1";
|
|
135398
|
+
span.style.whiteSpace = "nowrap";
|
|
135399
|
+
span.style.margin = "0";
|
|
135400
|
+
span.style.padding = "0";
|
|
135401
|
+
container.appendChild(span);
|
|
135402
|
+
}
|
|
135403
|
+
document.body.appendChild(container);
|
|
135404
|
+
container.offsetWidth;
|
|
135405
|
+
document.body.removeChild(container);
|
|
135406
|
+
};
|
|
135407
|
+
for (let i = 0; i < Math.max(1, warmupRepetitions); i++) {
|
|
135408
|
+
warmupOnce();
|
|
135409
|
+
await new Promise((r) => requestAnimationFrame(() => requestAnimationFrame(r)));
|
|
135410
|
+
}
|
|
135411
|
+
}
|
|
135412
|
+
|
|
135413
|
+
// src/modules/counter.js
|
|
135414
|
+
function hasCounters(input) {
|
|
135415
|
+
return /\bcounter\s*\(|\bcounters\s*\(/.test(input || "");
|
|
135416
|
+
}
|
|
135417
|
+
function unquoteDoubleStrings(s) {
|
|
135418
|
+
return (s || "").replace(/"([^"]*)"/g, "$1");
|
|
135419
|
+
}
|
|
135420
|
+
function alpha(n, upper = false) {
|
|
135421
|
+
let s = "", x = Math.max(1, n);
|
|
135422
|
+
while (x > 0) {
|
|
135423
|
+
x--;
|
|
135424
|
+
s = String.fromCharCode(97 + x % 26) + s;
|
|
135425
|
+
x = Math.floor(x / 26);
|
|
135426
|
+
}
|
|
135427
|
+
return upper ? s.toUpperCase() : s;
|
|
135428
|
+
}
|
|
135429
|
+
function roman(n, upper = true) {
|
|
135430
|
+
const map = [[1e3, "M"], [900, "CM"], [500, "D"], [400, "CD"], [100, "C"], [90, "XC"], [50, "L"], [40, "XL"], [10, "X"], [9, "IX"], [5, "V"], [4, "IV"], [1, "I"]];
|
|
135431
|
+
let num = Math.max(1, Math.min(3999, n)), out = "";
|
|
135432
|
+
for (const [v, sym] of map) while (num >= v) {
|
|
135433
|
+
out += sym;
|
|
135434
|
+
num -= v;
|
|
135435
|
+
}
|
|
135436
|
+
return upper ? out : out.toLowerCase();
|
|
135437
|
+
}
|
|
135438
|
+
function formatCounter(value, style) {
|
|
135439
|
+
switch ((style || "decimal").toLowerCase()) {
|
|
135440
|
+
case "decimal":
|
|
135441
|
+
return String(Math.max(0, value));
|
|
135442
|
+
case "decimal-leading-zero":
|
|
135443
|
+
return (value < 10 ? "0" : "") + String(Math.max(0, value));
|
|
135444
|
+
case "lower-alpha":
|
|
135445
|
+
return alpha(value, false);
|
|
135446
|
+
case "upper-alpha":
|
|
135447
|
+
return alpha(value, true);
|
|
135448
|
+
case "lower-roman":
|
|
135449
|
+
return roman(value, false);
|
|
135450
|
+
case "upper-roman":
|
|
135451
|
+
return roman(value, true);
|
|
135452
|
+
default:
|
|
135453
|
+
return String(Math.max(0, value));
|
|
135454
|
+
}
|
|
135455
|
+
}
|
|
135456
|
+
function buildCounterContext(root) {
|
|
135457
|
+
const nodeCounters = /* @__PURE__ */ new WeakMap();
|
|
135458
|
+
const rootEl = root instanceof Document ? root.documentElement : root;
|
|
135459
|
+
const isLi = (el) => el && el.tagName === "LI";
|
|
135460
|
+
const countPrevLi = (li) => {
|
|
135461
|
+
let c = 0, p = li?.parentElement;
|
|
135462
|
+
if (!p) return 0;
|
|
135463
|
+
for (const sib of p.children) {
|
|
135464
|
+
if (sib === li) break;
|
|
135465
|
+
if (sib.tagName === "LI") c++;
|
|
135466
|
+
}
|
|
135467
|
+
return c;
|
|
135468
|
+
};
|
|
135469
|
+
const cloneMap = (m) => {
|
|
135470
|
+
const out = /* @__PURE__ */ new Map();
|
|
135471
|
+
for (const [k, arr] of m) out.set(k, arr.slice());
|
|
135472
|
+
return out;
|
|
135473
|
+
};
|
|
135474
|
+
const applyTo = (baseMap, parentMap, el) => {
|
|
135475
|
+
const map = cloneMap(baseMap);
|
|
135476
|
+
let reset;
|
|
135477
|
+
try {
|
|
135478
|
+
reset = el.style?.counterReset || getComputedStyle(el).counterReset;
|
|
135479
|
+
} catch {
|
|
135480
|
+
}
|
|
135481
|
+
if (reset && reset !== "none") {
|
|
135482
|
+
for (const part of reset.split(",")) {
|
|
135483
|
+
const toks = part.trim().split(/\s+/);
|
|
135484
|
+
const name = toks[0];
|
|
135485
|
+
const val = Number.isFinite(Number(toks[1])) ? Number(toks[1]) : 0;
|
|
135486
|
+
if (!name) continue;
|
|
135487
|
+
const parentStack = parentMap.get(name);
|
|
135488
|
+
if (parentStack && parentStack.length) {
|
|
135489
|
+
const s = parentStack.slice();
|
|
135490
|
+
s.push(val);
|
|
135491
|
+
map.set(name, s);
|
|
135492
|
+
} else {
|
|
135493
|
+
map.set(name, [val]);
|
|
135494
|
+
}
|
|
135495
|
+
}
|
|
135496
|
+
}
|
|
135497
|
+
let inc;
|
|
135498
|
+
try {
|
|
135499
|
+
inc = el.style?.counterIncrement || getComputedStyle(el).counterIncrement;
|
|
135500
|
+
} catch {
|
|
135501
|
+
}
|
|
135502
|
+
if (inc && inc !== "none") {
|
|
135503
|
+
for (const part of inc.split(",")) {
|
|
135504
|
+
const toks = part.trim().split(/\s+/);
|
|
135505
|
+
const name = toks[0];
|
|
135506
|
+
const by = Number.isFinite(Number(toks[1])) ? Number(toks[1]) : 1;
|
|
135507
|
+
if (!name) continue;
|
|
135508
|
+
const stack = map.get(name) || [];
|
|
135509
|
+
if (stack.length === 0) stack.push(0);
|
|
135510
|
+
stack[stack.length - 1] += by;
|
|
135511
|
+
map.set(name, stack);
|
|
135512
|
+
}
|
|
135513
|
+
}
|
|
135514
|
+
try {
|
|
135515
|
+
const cs = getComputedStyle(el);
|
|
135516
|
+
if (cs.display === "list-item" && isLi(el)) {
|
|
135517
|
+
const p = el.parentElement;
|
|
135518
|
+
let idx = 1;
|
|
135519
|
+
if (p && p.tagName === "OL") {
|
|
135520
|
+
const startAttr = p.getAttribute("start");
|
|
135521
|
+
const start = Number.isFinite(Number(startAttr)) ? Number(startAttr) : 1;
|
|
135522
|
+
const prev = countPrevLi(el);
|
|
135523
|
+
const ownAttr = el.getAttribute("value");
|
|
135524
|
+
idx = Number.isFinite(Number(ownAttr)) ? Number(ownAttr) : start + prev;
|
|
135525
|
+
} else {
|
|
135526
|
+
idx = 1 + countPrevLi(el);
|
|
135527
|
+
}
|
|
135528
|
+
const s = map.get("list-item") || [];
|
|
135529
|
+
if (s.length === 0) s.push(0);
|
|
135530
|
+
s[s.length - 1] = idx;
|
|
135531
|
+
map.set("list-item", s);
|
|
135532
|
+
}
|
|
135533
|
+
} catch {
|
|
135534
|
+
}
|
|
135535
|
+
return map;
|
|
135536
|
+
};
|
|
135537
|
+
const build = (el, parentMap, carryMap) => {
|
|
135538
|
+
const curr = applyTo(carryMap, parentMap, el);
|
|
135539
|
+
nodeCounters.set(el, curr);
|
|
135540
|
+
let nextCarry = curr;
|
|
135541
|
+
for (const child of el.children) {
|
|
135542
|
+
const childCarry = build(child, curr, nextCarry);
|
|
135543
|
+
nextCarry = childCarry;
|
|
135544
|
+
}
|
|
135545
|
+
return curr;
|
|
135546
|
+
};
|
|
135547
|
+
const empty = /* @__PURE__ */ new Map();
|
|
135548
|
+
build(rootEl, empty, empty);
|
|
135549
|
+
return {
|
|
135550
|
+
/**
|
|
135551
|
+
* Get top value for counter name at given node.
|
|
135552
|
+
* @param {Element} node
|
|
135553
|
+
* @param {string} name
|
|
135554
|
+
*/
|
|
135555
|
+
get(node, name) {
|
|
135556
|
+
const s = nodeCounters.get(node)?.get(name);
|
|
135557
|
+
return s && s.length ? s[s.length - 1] : 0;
|
|
135558
|
+
},
|
|
135559
|
+
/**
|
|
135560
|
+
* Get full stack for counter name at given node.
|
|
135561
|
+
* @param {Element} node
|
|
135562
|
+
* @param {string} name
|
|
135563
|
+
*/
|
|
135564
|
+
getStack(node, name) {
|
|
135565
|
+
const s = nodeCounters.get(node)?.get(name);
|
|
135566
|
+
return s ? s.slice() : [];
|
|
135567
|
+
}
|
|
135568
|
+
};
|
|
135569
|
+
}
|
|
135570
|
+
function resolveCountersInContent(raw, node, ctx) {
|
|
135571
|
+
if (!raw || raw === "none") return raw;
|
|
135572
|
+
try {
|
|
135573
|
+
const RX = /\b(counter|counters)\s*\(([^)]+)\)/g;
|
|
135574
|
+
let out = raw.replace(RX, (_, fn, args) => {
|
|
135575
|
+
const parts = String(args).split(",").map((s) => s.trim());
|
|
135576
|
+
if (fn === "counter") {
|
|
135577
|
+
const name = parts[0]?.replace(/^["']|["']$/g, "");
|
|
135578
|
+
const style = (parts[1] || "decimal").toLowerCase();
|
|
135579
|
+
const v = ctx.get(node, name);
|
|
135580
|
+
return formatCounter(v, style);
|
|
135581
|
+
} else {
|
|
135582
|
+
const name = parts[0]?.replace(/^["']|["']$/g, "");
|
|
135583
|
+
const sep = parts[1]?.replace(/^["']|["']$/g, "") ?? "";
|
|
135584
|
+
const style = (parts[2] || "decimal").toLowerCase();
|
|
135585
|
+
const stack = ctx.getStack(node, name);
|
|
135586
|
+
if (!stack.length) return "";
|
|
135587
|
+
const pieces = stack.map((v) => formatCounter(v, style));
|
|
135588
|
+
return pieces.join(sep);
|
|
135589
|
+
}
|
|
135590
|
+
});
|
|
135591
|
+
return unquoteDoubleStrings(out);
|
|
135592
|
+
} catch {
|
|
135593
|
+
return "- ";
|
|
135594
|
+
}
|
|
135595
|
+
}
|
|
135596
|
+
|
|
135597
|
+
// src/modules/pseudo.js
|
|
135598
|
+
var counterCtx = null;
|
|
135599
|
+
var __siblingCounters = /* @__PURE__ */ new WeakMap();
|
|
135600
|
+
function unquoteDoubleStrings2(s) {
|
|
135601
|
+
return (s || "").replace(/"([^"]*)"/g, "$1");
|
|
135602
|
+
}
|
|
135603
|
+
function collapseCssContent(raw) {
|
|
135604
|
+
if (!raw) return "";
|
|
135605
|
+
const tokens = [];
|
|
135606
|
+
const rx = /"([^"]*)"/g;
|
|
135607
|
+
let m;
|
|
135608
|
+
while (m = rx.exec(raw)) tokens.push(m[1]);
|
|
135609
|
+
if (tokens.length) return tokens.join("");
|
|
135610
|
+
return unquoteDoubleStrings2(raw);
|
|
135611
|
+
}
|
|
135612
|
+
function withSiblingOverrides(node, base) {
|
|
135613
|
+
const parent = node.parentElement;
|
|
135614
|
+
const map = parent ? __siblingCounters.get(parent) : null;
|
|
135615
|
+
if (!map) return base;
|
|
135616
|
+
return {
|
|
135617
|
+
get(n, name) {
|
|
135618
|
+
const v = base.get(n, name);
|
|
135619
|
+
const ov = map.get(name);
|
|
135620
|
+
return typeof ov === "number" ? Math.max(v, ov) : v;
|
|
135621
|
+
},
|
|
135622
|
+
getStack(n, name) {
|
|
135623
|
+
const s = base.getStack(n, name);
|
|
135624
|
+
if (!s.length) return s;
|
|
135625
|
+
const ov = map.get(name);
|
|
135626
|
+
if (typeof ov === "number") {
|
|
135627
|
+
const out = s.slice();
|
|
135628
|
+
out[out.length - 1] = Math.max(out[out.length - 1], ov);
|
|
135629
|
+
return out;
|
|
135630
|
+
}
|
|
135631
|
+
return s;
|
|
135632
|
+
}
|
|
135633
|
+
};
|
|
135634
|
+
}
|
|
135635
|
+
function deriveCounterCtxForPseudo(node, pseudoStyle, baseCtx) {
|
|
135636
|
+
const modStacks = /* @__PURE__ */ new Map();
|
|
135637
|
+
function parseListDecl(value) {
|
|
135638
|
+
const out = [];
|
|
135639
|
+
if (!value || value === "none") return out;
|
|
135640
|
+
for (const part of String(value).split(",")) {
|
|
135641
|
+
const toks = part.trim().split(/\s+/);
|
|
135642
|
+
const name = toks[0];
|
|
135643
|
+
const num = Number.isFinite(Number(toks[1])) ? Number(toks[1]) : void 0;
|
|
135644
|
+
if (name) out.push({ name, num });
|
|
135645
|
+
}
|
|
135646
|
+
return out;
|
|
135647
|
+
}
|
|
135648
|
+
const resets = parseListDecl(pseudoStyle?.counterReset);
|
|
135649
|
+
const incs = parseListDecl(pseudoStyle?.counterIncrement);
|
|
135650
|
+
function getStackDerived(name) {
|
|
135651
|
+
if (modStacks.has(name)) return modStacks.get(name).slice();
|
|
135652
|
+
let stack = baseCtx.getStack(node, name);
|
|
135653
|
+
stack = stack.length ? stack.slice() : [];
|
|
135654
|
+
const r = resets.find((x) => x.name === name);
|
|
135655
|
+
if (r) {
|
|
135656
|
+
const val = Number.isFinite(r.num) ? r.num : 0;
|
|
135657
|
+
stack = stack.length ? [...stack, val] : [val];
|
|
135658
|
+
}
|
|
135659
|
+
const inc = incs.find((x) => x.name === name);
|
|
135660
|
+
if (inc) {
|
|
135661
|
+
const by = Number.isFinite(inc.num) ? inc.num : 1;
|
|
135662
|
+
if (stack.length === 0) stack = [0];
|
|
135663
|
+
stack[stack.length - 1] += by;
|
|
135664
|
+
}
|
|
135665
|
+
modStacks.set(name, stack.slice());
|
|
135666
|
+
return stack;
|
|
135667
|
+
}
|
|
135668
|
+
return {
|
|
135669
|
+
get(_node, name) {
|
|
135670
|
+
const s = getStackDerived(name);
|
|
135671
|
+
return s.length ? s[s.length - 1] : 0;
|
|
135672
|
+
},
|
|
135673
|
+
getStack(_node, name) {
|
|
135674
|
+
return getStackDerived(name);
|
|
135675
|
+
},
|
|
135676
|
+
/** expone increments del pseudo para que el caller pueda propagar a hermanos */
|
|
135677
|
+
__incs: incs
|
|
135678
|
+
};
|
|
135679
|
+
}
|
|
135680
|
+
function resolvePseudoContentAndIncs(node, pseudo, baseCtx) {
|
|
135681
|
+
let ps;
|
|
135682
|
+
try {
|
|
135683
|
+
ps = getComputedStyle(node, pseudo);
|
|
135684
|
+
} catch {
|
|
135685
|
+
}
|
|
135686
|
+
const raw = ps?.content;
|
|
135687
|
+
if (!raw || raw === "none" || raw === "normal") return { text: "", incs: [] };
|
|
135688
|
+
const baseWithSiblings = withSiblingOverrides(node, baseCtx);
|
|
135689
|
+
const derived = deriveCounterCtxForPseudo(node, ps, baseWithSiblings);
|
|
135690
|
+
let resolved = hasCounters(raw) ? resolveCountersInContent(raw, node, derived) : raw;
|
|
135691
|
+
const text = collapseCssContent(resolved);
|
|
135692
|
+
return { text, incs: derived.__incs || [] };
|
|
135693
|
+
}
|
|
135694
|
+
async function inlinePseudoElements(source, clone, sessionCache, options) {
|
|
135695
|
+
if (!(source instanceof Element) || !(clone instanceof Element)) return;
|
|
135696
|
+
if (!counterCtx) {
|
|
135697
|
+
try {
|
|
135698
|
+
counterCtx = buildCounterContext(source.ownerDocument || document);
|
|
135699
|
+
} catch {
|
|
135700
|
+
}
|
|
135701
|
+
}
|
|
135702
|
+
for (const pseudo of ["::before", "::after", "::first-letter"]) {
|
|
135703
|
+
try {
|
|
135704
|
+
const style = getStyle(source, pseudo);
|
|
135705
|
+
if (!style || typeof style[Symbol.iterator] !== "function") continue;
|
|
135706
|
+
const isEmptyPseudo = style.content === "none" && style.backgroundImage === "none" && style.backgroundColor === "transparent" && (style.borderStyle === "none" || parseFloat(style.borderWidth) === 0) && (!style.transform || style.transform === "none") && style.display === "inline";
|
|
135707
|
+
if (isEmptyPseudo) continue;
|
|
135708
|
+
if (pseudo === "::first-letter") {
|
|
135709
|
+
const normal = getComputedStyle(source);
|
|
135710
|
+
const isMeaningful = style.color !== normal.color || style.fontSize !== normal.fontSize || style.fontWeight !== normal.fontWeight;
|
|
135711
|
+
if (!isMeaningful) continue;
|
|
135712
|
+
const textNode = Array.from(clone.childNodes).find(
|
|
135713
|
+
(n) => n.nodeType === Node.TEXT_NODE && n.textContent?.trim().length > 0
|
|
135714
|
+
);
|
|
135715
|
+
if (!textNode) continue;
|
|
135716
|
+
const text = textNode.textContent;
|
|
135717
|
+
const match = text.match(/^([^\p{L}\p{N}\s]*[\p{L}\p{N}](?:['’])?)/u);
|
|
135718
|
+
const first = match?.[0];
|
|
135719
|
+
const rest = text.slice(first?.length || 0);
|
|
135720
|
+
if (!first || /[\uD800-\uDFFF]/.test(first)) continue;
|
|
135721
|
+
const span = document.createElement("span");
|
|
135722
|
+
span.textContent = first;
|
|
135723
|
+
span.dataset.snapdomPseudo = "::first-letter";
|
|
135724
|
+
const snapshot2 = snapshotComputedStyle(style);
|
|
135725
|
+
const key2 = getStyleKey(snapshot2, "span");
|
|
135726
|
+
sessionCache.styleMap.set(span, key2);
|
|
135727
|
+
const restNode = document.createTextNode(rest);
|
|
135728
|
+
clone.replaceChild(restNode, textNode);
|
|
135729
|
+
clone.insertBefore(span, restNode);
|
|
135730
|
+
continue;
|
|
135731
|
+
}
|
|
135732
|
+
const rawContent = style.content;
|
|
135733
|
+
const { text: cleanContent, incs } = resolvePseudoContentAndIncs(source, pseudo, counterCtx);
|
|
135734
|
+
const bg = style.backgroundImage;
|
|
135735
|
+
const bgColor = style.backgroundColor;
|
|
135736
|
+
const fontFamily = style.fontFamily;
|
|
135737
|
+
const fontSize = parseInt(style.fontSize) || 32;
|
|
135738
|
+
const fontWeight = parseInt(style.fontWeight) || false;
|
|
135739
|
+
const color = style.color || "#000";
|
|
135740
|
+
const borderStyle = style.borderStyle;
|
|
135741
|
+
const borderWidth = parseFloat(style.borderWidth);
|
|
135742
|
+
const transform = style.transform;
|
|
135743
|
+
const isIconFont22 = isIconFont2(fontFamily);
|
|
135744
|
+
const hasExplicitContent = rawContent !== "none" && cleanContent !== "";
|
|
135745
|
+
const hasBg = bg && bg !== "none";
|
|
135746
|
+
const hasBgColor = bgColor && bgColor !== "transparent" && bgColor !== "rgba(0, 0, 0, 0)";
|
|
135747
|
+
const hasBorder = borderStyle && borderStyle !== "none" && borderWidth > 0;
|
|
135748
|
+
const hasTransform = transform && transform !== "none";
|
|
135749
|
+
const shouldRender = hasExplicitContent || hasBg || hasBgColor || hasBorder || hasTransform;
|
|
135750
|
+
if (!shouldRender) {
|
|
135751
|
+
if (incs && incs.length && source.parentElement) {
|
|
135752
|
+
const map = __siblingCounters.get(source.parentElement) || /* @__PURE__ */ new Map();
|
|
135753
|
+
for (const { name } of incs) {
|
|
135754
|
+
if (!name) continue;
|
|
135755
|
+
const baseWithSibs = withSiblingOverrides(source, counterCtx);
|
|
135756
|
+
const derived = deriveCounterCtxForPseudo(source, getComputedStyle(source, pseudo), baseWithSibs);
|
|
135757
|
+
const finalVal = derived.get(source, name);
|
|
135758
|
+
map.set(name, finalVal);
|
|
135759
|
+
}
|
|
135760
|
+
__siblingCounters.set(source.parentElement, map);
|
|
135761
|
+
}
|
|
135762
|
+
continue;
|
|
135763
|
+
}
|
|
135764
|
+
const pseudoEl = document.createElement("span");
|
|
135765
|
+
pseudoEl.dataset.snapdomPseudo = pseudo;
|
|
135766
|
+
pseudoEl.style.verticalAlign = "middle";
|
|
135767
|
+
pseudoEl.style.pointerEvents = "none";
|
|
135768
|
+
const snapshot = snapshotComputedStyle(style);
|
|
135769
|
+
const key = getStyleKey(snapshot, "span");
|
|
135770
|
+
sessionCache.styleMap.set(pseudoEl, key);
|
|
135771
|
+
if (isIconFont22 && cleanContent && cleanContent.length === 1) {
|
|
135772
|
+
const { dataUrl, width: w, height: h } = await iconToImage(cleanContent, fontFamily, fontWeight, fontSize, color);
|
|
135773
|
+
const imgEl = document.createElement("img");
|
|
135774
|
+
imgEl.src = dataUrl;
|
|
135775
|
+
imgEl.style = `height:${fontSize}px;width:${w / h * fontSize}px;object-fit:contain;`;
|
|
135776
|
+
pseudoEl.appendChild(imgEl);
|
|
135777
|
+
clone.dataset.snapdomHasIcon = "true";
|
|
135778
|
+
} else if (cleanContent && cleanContent.startsWith("url(")) {
|
|
135779
|
+
const rawUrl = extractURL(cleanContent);
|
|
135780
|
+
if (rawUrl?.trim()) {
|
|
135781
|
+
try {
|
|
135782
|
+
const imgEl = document.createElement("img");
|
|
135783
|
+
const dataUrl = await snapFetch(safeEncodeURI(rawUrl), { as: "dataURL", useProxy: options.useProxy });
|
|
135784
|
+
imgEl.src = dataUrl.data;
|
|
135785
|
+
imgEl.style = `width:${fontSize}px;height:auto;object-fit:contain;`;
|
|
135786
|
+
pseudoEl.appendChild(imgEl);
|
|
135787
|
+
} catch (e) {
|
|
135788
|
+
console.error(`[snapdom] Error in pseudo ${pseudo} for`, source, e);
|
|
135789
|
+
}
|
|
135790
|
+
}
|
|
135791
|
+
} else if (!isIconFont22 && hasExplicitContent) {
|
|
135792
|
+
pseudoEl.textContent = cleanContent;
|
|
135793
|
+
}
|
|
135794
|
+
pseudoEl.style.background = "none";
|
|
135795
|
+
if ("mask" in pseudoEl.style) {
|
|
135796
|
+
pseudoEl.style.mask = "none";
|
|
135797
|
+
}
|
|
135798
|
+
if (hasBg) {
|
|
135799
|
+
try {
|
|
135800
|
+
const bgSplits = splitBackgroundImage(bg);
|
|
135801
|
+
const newBgParts = await Promise.all(bgSplits.map(inlineSingleBackgroundEntry));
|
|
135802
|
+
pseudoEl.style.backgroundImage = newBgParts.join(", ");
|
|
135803
|
+
} catch (e) {
|
|
135804
|
+
console.warn(`[snapdom] Failed to inline background-image for ${pseudo}`, e);
|
|
135805
|
+
}
|
|
135806
|
+
}
|
|
135807
|
+
if (hasBgColor) pseudoEl.style.backgroundColor = bgColor;
|
|
135808
|
+
const hasContent2 = pseudoEl.childNodes.length > 0 || pseudoEl.textContent?.trim() !== "";
|
|
135809
|
+
const hasVisibleBox = hasContent2 || hasBg || hasBgColor || hasBorder || hasTransform;
|
|
135810
|
+
if (incs && incs.length && source.parentElement) {
|
|
135811
|
+
const map = __siblingCounters.get(source.parentElement) || /* @__PURE__ */ new Map();
|
|
135812
|
+
const baseWithSibs = withSiblingOverrides(source, counterCtx);
|
|
135813
|
+
const derived = deriveCounterCtxForPseudo(source, getComputedStyle(source, pseudo), baseWithSibs);
|
|
135814
|
+
for (const { name } of incs) {
|
|
135815
|
+
if (!name) continue;
|
|
135816
|
+
const finalVal = derived.get(source, name);
|
|
135817
|
+
map.set(name, finalVal);
|
|
135818
|
+
}
|
|
135819
|
+
__siblingCounters.set(source.parentElement, map);
|
|
135820
|
+
}
|
|
135821
|
+
if (!hasVisibleBox) continue;
|
|
135822
|
+
if (pseudo === "::before") {
|
|
135823
|
+
clone.insertBefore(pseudoEl, clone.firstChild);
|
|
135824
|
+
} else {
|
|
135825
|
+
clone.appendChild(pseudoEl);
|
|
135826
|
+
}
|
|
135827
|
+
} catch (e) {
|
|
135828
|
+
console.warn(`[snapdom] Failed to capture ${pseudo} for`, source, e);
|
|
135829
|
+
}
|
|
135830
|
+
}
|
|
135831
|
+
const sChildren = Array.from(source.children);
|
|
135832
|
+
const cChildren = Array.from(clone.children).filter((child) => !child.dataset.snapdomPseudo);
|
|
135833
|
+
for (let i = 0; i < Math.min(sChildren.length, cChildren.length); i++) {
|
|
135834
|
+
await inlinePseudoElements(sChildren[i], cChildren[i], sessionCache, options);
|
|
135835
|
+
}
|
|
135836
|
+
}
|
|
135837
|
+
|
|
135838
|
+
// src/modules/svgDefs.js
|
|
135839
|
+
function inlineExternalDefsAndSymbols(rootElement) {
|
|
135840
|
+
if (!rootElement) return;
|
|
135841
|
+
const usedIds = /* @__PURE__ */ new Set();
|
|
135842
|
+
rootElement.querySelectorAll("use").forEach((use) => {
|
|
135843
|
+
const href = use.getAttribute("xlink:href") || use.getAttribute("href");
|
|
135844
|
+
if (href && href.startsWith("#")) {
|
|
135845
|
+
usedIds.add(href.slice(1));
|
|
135846
|
+
}
|
|
135847
|
+
});
|
|
135848
|
+
if (!usedIds.size) return;
|
|
135849
|
+
const allGlobal = Array.from(document.querySelectorAll("svg > symbol, svg > defs"));
|
|
135850
|
+
const globalSymbols = allGlobal.filter((el) => el.tagName.toLowerCase() === "symbol");
|
|
135851
|
+
const globalDefs = allGlobal.filter((el) => el.tagName.toLowerCase() === "defs");
|
|
135852
|
+
let container = rootElement.querySelector("svg.inline-defs-container");
|
|
135853
|
+
if (!container) {
|
|
135854
|
+
container = document.createElementNS("http://www.w3.org/2000/svg", "svg");
|
|
135855
|
+
container.setAttribute("aria-hidden", "true");
|
|
135856
|
+
container.setAttribute("style", "position: absolute; width: 0; height: 0; overflow: hidden;");
|
|
135857
|
+
container.classList.add("inline-defs-container");
|
|
135858
|
+
rootElement.insertBefore(container, rootElement.firstChild);
|
|
135859
|
+
}
|
|
135860
|
+
const existingIds = /* @__PURE__ */ new Set();
|
|
135861
|
+
rootElement.querySelectorAll("symbol[id], defs > *[id]").forEach((el) => {
|
|
135862
|
+
existingIds.add(el.id);
|
|
135863
|
+
});
|
|
135864
|
+
usedIds.forEach((id) => {
|
|
135865
|
+
if (existingIds.has(id)) return;
|
|
135866
|
+
const symbol = globalSymbols.find((sym) => sym.id === id);
|
|
135867
|
+
if (symbol) {
|
|
135868
|
+
container.appendChild(symbol.cloneNode(true));
|
|
135869
|
+
existingIds.add(id);
|
|
135870
|
+
return;
|
|
135871
|
+
}
|
|
135872
|
+
for (const defs of globalDefs) {
|
|
135873
|
+
const defEl = defs.querySelector(`#${CSS.escape(id)}`);
|
|
135874
|
+
if (defEl) {
|
|
135875
|
+
let defsContainer = container.querySelector("defs");
|
|
135876
|
+
if (!defsContainer) {
|
|
135877
|
+
defsContainer = document.createElementNS("http://www.w3.org/2000/svg", "defs");
|
|
135878
|
+
container.appendChild(defsContainer);
|
|
135879
|
+
}
|
|
135880
|
+
defsContainer.appendChild(defEl.cloneNode(true));
|
|
135881
|
+
existingIds.add(id);
|
|
135882
|
+
break;
|
|
135883
|
+
}
|
|
135884
|
+
}
|
|
135885
|
+
});
|
|
135886
|
+
}
|
|
135887
|
+
|
|
135888
|
+
// src/modules/changeCSS.js
|
|
135889
|
+
function freezeSticky(originalRoot, cloneRoot) {
|
|
135890
|
+
if (!originalRoot || !cloneRoot) return;
|
|
135891
|
+
const scrollTop = originalRoot.scrollTop || 0;
|
|
135892
|
+
if (!scrollTop) return;
|
|
135893
|
+
if (getComputedStyle(cloneRoot).position === "static") {
|
|
135894
|
+
cloneRoot.style.position = "relative";
|
|
135895
|
+
}
|
|
135896
|
+
const rootRect = originalRoot.getBoundingClientRect();
|
|
135897
|
+
const viewportH = originalRoot.clientHeight;
|
|
135898
|
+
const PH_ATTR = "data-snap-ph";
|
|
135899
|
+
const walker = document.createTreeWalker(originalRoot, NodeFilter.SHOW_ELEMENT);
|
|
135900
|
+
while (walker.nextNode()) {
|
|
135901
|
+
const el = (
|
|
135902
|
+
/** @type {HTMLElement} */
|
|
135903
|
+
walker.currentNode
|
|
135904
|
+
);
|
|
135905
|
+
const cs = getComputedStyle(el);
|
|
135906
|
+
const pos = cs.position;
|
|
135907
|
+
if (pos !== "sticky" && pos !== "-webkit-sticky") continue;
|
|
135908
|
+
const topInit = _toPx(cs.top);
|
|
135909
|
+
const bottomInit = _toPx(cs.bottom);
|
|
135910
|
+
if (topInit == null && bottomInit == null) continue;
|
|
135911
|
+
const path = _pathOf(el, originalRoot);
|
|
135912
|
+
const cloneEl = _findByPathIgnoringPlaceholders(cloneRoot, path, PH_ATTR);
|
|
135913
|
+
if (!cloneEl) continue;
|
|
135914
|
+
const elRect = el.getBoundingClientRect();
|
|
135915
|
+
const widthPx = elRect.width;
|
|
135916
|
+
const heightPx = elRect.height;
|
|
135917
|
+
const leftPx = elRect.left - rootRect.left;
|
|
135918
|
+
if (!(widthPx > 0 && heightPx > 0)) continue;
|
|
135919
|
+
if (!Number.isFinite(leftPx)) continue;
|
|
135920
|
+
const topAbsPx = topInit != null ? topInit + scrollTop : scrollTop + (viewportH - heightPx - /** bottomInit non-null */
|
|
135921
|
+
bottomInit);
|
|
135922
|
+
if (!Number.isFinite(topAbsPx)) continue;
|
|
135923
|
+
const zParsed = Number.parseInt(cs.zIndex, 10);
|
|
135924
|
+
const hasZ = Number.isFinite(zParsed);
|
|
135925
|
+
const overlayZ = hasZ ? Math.max(zParsed, 1) + 1 : 2;
|
|
135926
|
+
const placeholderZ = hasZ ? zParsed - 1 : 0;
|
|
135927
|
+
const ph = cloneEl.cloneNode(false);
|
|
135928
|
+
ph.setAttribute(PH_ATTR, "1");
|
|
135929
|
+
ph.style.position = "sticky";
|
|
135930
|
+
ph.style.left = `${leftPx}px`;
|
|
135931
|
+
ph.style.top = `${topAbsPx}px`;
|
|
135932
|
+
ph.style.width = `${widthPx}px`;
|
|
135933
|
+
ph.style.height = `${heightPx}px`;
|
|
135934
|
+
ph.style.visibility = "hidden";
|
|
135935
|
+
ph.style.zIndex = String(placeholderZ);
|
|
135936
|
+
ph.style.overflow = "hidden";
|
|
135937
|
+
ph.style.background = "transparent";
|
|
135938
|
+
ph.style.boxShadow = "none";
|
|
135939
|
+
ph.style.filter = "none";
|
|
135940
|
+
cloneEl.parentElement?.insertBefore(ph, cloneEl);
|
|
135941
|
+
cloneEl.style.position = "absolute";
|
|
135942
|
+
cloneEl.style.left = `${leftPx}px`;
|
|
135943
|
+
cloneEl.style.top = `${topAbsPx}px`;
|
|
135944
|
+
cloneEl.style.bottom = "auto";
|
|
135945
|
+
cloneEl.style.zIndex = String(overlayZ);
|
|
135946
|
+
cloneEl.style.pointerEvents = "none";
|
|
135947
|
+
}
|
|
135948
|
+
}
|
|
135949
|
+
function _toPx(v) {
|
|
135950
|
+
if (!v || v === "auto") return null;
|
|
135951
|
+
const n = Number.parseFloat(v);
|
|
135952
|
+
return Number.isFinite(n) ? n : null;
|
|
135953
|
+
}
|
|
135954
|
+
function _pathOf(el, root) {
|
|
135955
|
+
const path = [];
|
|
135956
|
+
for (let cur = el; cur && cur !== root; ) {
|
|
135957
|
+
const p = cur.parentElement;
|
|
135958
|
+
if (!p) break;
|
|
135959
|
+
path.push(Array.prototype.indexOf.call(p.children, cur));
|
|
135960
|
+
cur = p;
|
|
135961
|
+
}
|
|
135962
|
+
return path.reverse();
|
|
135963
|
+
}
|
|
135964
|
+
function _findByPathIgnoringPlaceholders(root, path, phAttr) {
|
|
135965
|
+
let cur = root;
|
|
135966
|
+
for (let i = 0; i < path.length; i++) {
|
|
135967
|
+
const kids = _childrenWithoutPlaceholders(cur, phAttr);
|
|
135968
|
+
cur = /** @type {HTMLElement|undefined} */
|
|
135969
|
+
kids[path[i]];
|
|
135970
|
+
if (!cur) return null;
|
|
135971
|
+
}
|
|
135972
|
+
return cur instanceof HTMLElement ? cur : null;
|
|
135973
|
+
}
|
|
135974
|
+
function _childrenWithoutPlaceholders(el, phAttr) {
|
|
135975
|
+
const out = [];
|
|
135976
|
+
const ch = el.children;
|
|
135977
|
+
for (let i = 0; i < ch.length; i++) {
|
|
135978
|
+
const c = ch[i];
|
|
135979
|
+
if (!c.hasAttribute(phAttr)) out.push(c);
|
|
135980
|
+
}
|
|
135981
|
+
return out;
|
|
135982
|
+
}
|
|
135983
|
+
|
|
135984
|
+
// src/core/prepare.js
|
|
135985
|
+
async function prepareClone(element, options = {}) {
|
|
135986
|
+
const sessionCache = {
|
|
135987
|
+
styleMap: cache.session.styleMap,
|
|
135988
|
+
styleCache: cache.session.styleCache,
|
|
135989
|
+
nodeMap: cache.session.nodeMap
|
|
135990
|
+
};
|
|
135991
|
+
let clone;
|
|
135992
|
+
let classCSS = "";
|
|
135993
|
+
let shadowScopedCSS = "";
|
|
135994
|
+
stabilizeLayout(element);
|
|
135995
|
+
try {
|
|
135996
|
+
inlineExternalDefsAndSymbols(element);
|
|
135997
|
+
} catch (e) {
|
|
135998
|
+
console.warn("inlineExternal defs or symbol failed:", e);
|
|
135999
|
+
}
|
|
136000
|
+
try {
|
|
136001
|
+
clone = await deepClone(element, sessionCache, options, element);
|
|
136002
|
+
} catch (e) {
|
|
136003
|
+
console.warn("deepClone failed:", e);
|
|
136004
|
+
throw e;
|
|
136005
|
+
}
|
|
136006
|
+
try {
|
|
136007
|
+
await inlinePseudoElements(element, clone, sessionCache, options);
|
|
136008
|
+
} catch (e) {
|
|
136009
|
+
console.warn("inlinePseudoElements failed:", e);
|
|
136010
|
+
}
|
|
136011
|
+
await resolveBlobUrlsInTree(clone);
|
|
136012
|
+
try {
|
|
136013
|
+
const styleNodes = clone.querySelectorAll("style[data-sd]");
|
|
136014
|
+
for (const s of styleNodes) {
|
|
136015
|
+
shadowScopedCSS += s.textContent || "";
|
|
136016
|
+
s.remove();
|
|
136017
|
+
}
|
|
136018
|
+
} catch {
|
|
136019
|
+
}
|
|
136020
|
+
const keyToClass = generateCSSClasses(sessionCache.styleMap);
|
|
136021
|
+
classCSS = Array.from(keyToClass.entries()).map(([key, className]) => `.${className}{${key}}`).join("");
|
|
136022
|
+
classCSS = shadowScopedCSS + classCSS;
|
|
136023
|
+
for (const [node, key] of sessionCache.styleMap.entries()) {
|
|
136024
|
+
if (node.tagName === "STYLE") continue;
|
|
136025
|
+
if (node.getRootNode && node.getRootNode() instanceof ShadowRoot) {
|
|
136026
|
+
node.setAttribute("style", key.replace(/;/g, "; "));
|
|
136027
|
+
continue;
|
|
136028
|
+
}
|
|
136029
|
+
const className = keyToClass.get(key);
|
|
136030
|
+
if (className) node.classList.add(className);
|
|
136031
|
+
const bgImage = node.style?.backgroundImage;
|
|
136032
|
+
const hasIcon = node.dataset?.snapdomHasIcon;
|
|
136033
|
+
if (bgImage && bgImage !== "none") node.style.backgroundImage = bgImage;
|
|
136034
|
+
if (hasIcon) {
|
|
136035
|
+
node.style.verticalAlign = "middle";
|
|
136036
|
+
node.style.display = "inline";
|
|
136037
|
+
}
|
|
136038
|
+
}
|
|
136039
|
+
for (const [cloneNode, originalNode] of sessionCache.nodeMap.entries()) {
|
|
136040
|
+
const scrollX = originalNode.scrollLeft;
|
|
136041
|
+
const scrollY = originalNode.scrollTop;
|
|
136042
|
+
const hasScroll = scrollX || scrollY;
|
|
136043
|
+
if (hasScroll && cloneNode instanceof HTMLElement) {
|
|
136044
|
+
cloneNode.style.overflow = "hidden";
|
|
136045
|
+
cloneNode.style.scrollbarWidth = "none";
|
|
136046
|
+
cloneNode.style.msOverflowStyle = "none";
|
|
136047
|
+
const inner = document.createElement("div");
|
|
136048
|
+
inner.style.transform = `translate(${-scrollX}px, ${-scrollY}px)`;
|
|
136049
|
+
inner.style.willChange = "transform";
|
|
136050
|
+
inner.style.display = "inline-block";
|
|
136051
|
+
inner.style.width = "100%";
|
|
136052
|
+
while (cloneNode.firstChild) {
|
|
136053
|
+
inner.appendChild(cloneNode.firstChild);
|
|
136054
|
+
}
|
|
136055
|
+
cloneNode.appendChild(inner);
|
|
136056
|
+
}
|
|
136057
|
+
}
|
|
136058
|
+
const contentRoot = clone instanceof HTMLElement && clone.firstElementChild instanceof HTMLElement ? clone.firstElementChild : clone;
|
|
136059
|
+
freezeSticky(element, contentRoot);
|
|
136060
|
+
if (element === sessionCache.nodeMap.get(clone)) {
|
|
136061
|
+
const computed = sessionCache.styleCache.get(element) || window.getComputedStyle(element);
|
|
136062
|
+
sessionCache.styleCache.set(element, computed);
|
|
136063
|
+
const transform = stripTranslate(computed.transform);
|
|
136064
|
+
clone.style.margin = "0";
|
|
136065
|
+
clone.style.top = "auto";
|
|
136066
|
+
clone.style.left = "auto";
|
|
136067
|
+
clone.style.right = "auto";
|
|
136068
|
+
clone.style.bottom = "auto";
|
|
136069
|
+
clone.style.animation = "none";
|
|
136070
|
+
clone.style.transition = "none";
|
|
136071
|
+
clone.style.willChange = "auto";
|
|
136072
|
+
clone.style.float = "none";
|
|
136073
|
+
clone.style.clear = "none";
|
|
136074
|
+
clone.style.transform = transform || "";
|
|
136075
|
+
}
|
|
136076
|
+
for (const [cloneNode, originalNode] of sessionCache.nodeMap.entries()) {
|
|
136077
|
+
if (originalNode.tagName === "PRE") {
|
|
136078
|
+
cloneNode.style.marginTop = "0";
|
|
136079
|
+
cloneNode.style.marginBlockStart = "0";
|
|
136080
|
+
}
|
|
136081
|
+
}
|
|
136082
|
+
return { clone, classCSS, styleCache: sessionCache.styleCache };
|
|
136083
|
+
}
|
|
136084
|
+
function stabilizeLayout(element) {
|
|
136085
|
+
const style = getComputedStyle(element);
|
|
136086
|
+
const outlineStyle = style.outlineStyle;
|
|
136087
|
+
const outlineWidth = style.outlineWidth;
|
|
136088
|
+
const borderStyle = style.borderStyle;
|
|
136089
|
+
const borderWidth = style.borderWidth;
|
|
136090
|
+
const outlineVisible = outlineStyle !== "none" && parseFloat(outlineWidth) > 0;
|
|
136091
|
+
const borderAbsent = borderStyle === "none" || parseFloat(borderWidth) === 0;
|
|
136092
|
+
if (outlineVisible && borderAbsent) {
|
|
136093
|
+
element.style.border = `${outlineWidth} solid transparent`;
|
|
136094
|
+
}
|
|
136095
|
+
}
|
|
136096
|
+
var _blobToDataUrlCache = /* @__PURE__ */ new Map();
|
|
136097
|
+
async function blobUrlToDataUrl(blobUrl) {
|
|
136098
|
+
if (cache.resource?.has(blobUrl)) return cache.resource.get(blobUrl);
|
|
136099
|
+
if (_blobToDataUrlCache.has(blobUrl)) return _blobToDataUrlCache.get(blobUrl);
|
|
136100
|
+
const p = (async () => {
|
|
136101
|
+
const r = await snapFetch(blobUrl, { as: "dataURL", silent: true });
|
|
136102
|
+
if (!r.ok || typeof r.data !== "string") {
|
|
136103
|
+
throw new Error(`[snapDOM] Failed to read blob URL: ${blobUrl}`);
|
|
136104
|
+
}
|
|
136105
|
+
cache.resource?.set(blobUrl, r.data);
|
|
136106
|
+
return r.data;
|
|
136107
|
+
})();
|
|
136108
|
+
_blobToDataUrlCache.set(blobUrl, p);
|
|
136109
|
+
try {
|
|
136110
|
+
const data = await p;
|
|
136111
|
+
_blobToDataUrlCache.set(blobUrl, data);
|
|
136112
|
+
return data;
|
|
136113
|
+
} catch (e) {
|
|
136114
|
+
_blobToDataUrlCache.delete(blobUrl);
|
|
136115
|
+
throw e;
|
|
136116
|
+
}
|
|
136117
|
+
}
|
|
136118
|
+
var BLOB_URL_RE = /\bblob:[^)"'\s]+/g;
|
|
136119
|
+
async function replaceBlobUrlsInCssText(cssText) {
|
|
136120
|
+
if (!cssText || cssText.indexOf("blob:") === -1) return cssText;
|
|
136121
|
+
const uniques = Array.from(new Set(cssText.match(BLOB_URL_RE) || []));
|
|
136122
|
+
if (uniques.length === 0) return cssText;
|
|
136123
|
+
let out = cssText;
|
|
136124
|
+
for (const u of uniques) {
|
|
136125
|
+
try {
|
|
136126
|
+
const d = await blobUrlToDataUrl(u);
|
|
136127
|
+
out = out.split(u).join(d);
|
|
136128
|
+
} catch {
|
|
136129
|
+
}
|
|
136130
|
+
}
|
|
136131
|
+
return out;
|
|
136132
|
+
}
|
|
136133
|
+
function isBlobUrl(u) {
|
|
136134
|
+
return typeof u === "string" && u.startsWith("blob:");
|
|
136135
|
+
}
|
|
136136
|
+
function parseSrcset(srcset) {
|
|
136137
|
+
return (srcset || "").split(",").map((s) => s.trim()).filter(Boolean).map((item) => {
|
|
136138
|
+
const m = item.match(/^(\S+)(\s+.+)?$/);
|
|
136139
|
+
return m ? { url: m[1], desc: m[2] || "" } : null;
|
|
136140
|
+
}).filter(Boolean);
|
|
136141
|
+
}
|
|
136142
|
+
function stringifySrcset(parts) {
|
|
136143
|
+
return parts.map((p) => p.desc ? `${p.url} ${p.desc.trim()}` : p.url).join(", ");
|
|
136144
|
+
}
|
|
136145
|
+
async function resolveBlobUrlsInTree(root) {
|
|
136146
|
+
if (!root) return;
|
|
136147
|
+
const imgs = root.querySelectorAll ? root.querySelectorAll("img") : [];
|
|
136148
|
+
for (const img of imgs) {
|
|
136149
|
+
try {
|
|
136150
|
+
const srcAttr = img.getAttribute("src");
|
|
136151
|
+
const effective = srcAttr || img.currentSrc || "";
|
|
136152
|
+
if (isBlobUrl(effective)) {
|
|
136153
|
+
const data = await blobUrlToDataUrl(effective);
|
|
136154
|
+
img.setAttribute("src", data);
|
|
136155
|
+
}
|
|
136156
|
+
const srcset = img.getAttribute("srcset");
|
|
136157
|
+
if (srcset && srcset.includes("blob:")) {
|
|
136158
|
+
const parts = parseSrcset(srcset);
|
|
136159
|
+
let changed = false;
|
|
136160
|
+
for (const p of parts) {
|
|
136161
|
+
if (isBlobUrl(p.url)) {
|
|
136162
|
+
try {
|
|
136163
|
+
p.url = await blobUrlToDataUrl(p.url);
|
|
136164
|
+
changed = true;
|
|
136165
|
+
} catch {
|
|
136166
|
+
}
|
|
136167
|
+
}
|
|
136168
|
+
}
|
|
136169
|
+
if (changed) img.setAttribute("srcset", stringifySrcset(parts));
|
|
136170
|
+
}
|
|
136171
|
+
} catch {
|
|
136172
|
+
}
|
|
136173
|
+
}
|
|
136174
|
+
const svgImages = root.querySelectorAll ? root.querySelectorAll("image") : [];
|
|
136175
|
+
for (const node of svgImages) {
|
|
136176
|
+
try {
|
|
136177
|
+
const XLINK_NS = "http://www.w3.org/1999/xlink";
|
|
136178
|
+
const href = node.getAttribute("href") || node.getAttributeNS?.(XLINK_NS, "href");
|
|
136179
|
+
if (isBlobUrl(href)) {
|
|
136180
|
+
const d = await blobUrlToDataUrl(href);
|
|
136181
|
+
node.setAttribute("href", d);
|
|
136182
|
+
node.removeAttributeNS?.(XLINK_NS, "href");
|
|
136183
|
+
}
|
|
136184
|
+
} catch {
|
|
136185
|
+
}
|
|
136186
|
+
}
|
|
136187
|
+
const styled = root.querySelectorAll ? root.querySelectorAll("[style*='blob:']") : [];
|
|
136188
|
+
for (const el of styled) {
|
|
136189
|
+
try {
|
|
136190
|
+
const styleText = el.getAttribute("style");
|
|
136191
|
+
if (styleText && styleText.includes("blob:")) {
|
|
136192
|
+
const replaced = await replaceBlobUrlsInCssText(styleText);
|
|
136193
|
+
el.setAttribute("style", replaced);
|
|
136194
|
+
}
|
|
136195
|
+
} catch {
|
|
136196
|
+
}
|
|
136197
|
+
}
|
|
136198
|
+
const styleTags = root.querySelectorAll ? root.querySelectorAll("style") : [];
|
|
136199
|
+
for (const s of styleTags) {
|
|
136200
|
+
try {
|
|
136201
|
+
const css = s.textContent || "";
|
|
136202
|
+
if (css.includes("blob:")) {
|
|
136203
|
+
s.textContent = await replaceBlobUrlsInCssText(css);
|
|
136204
|
+
}
|
|
136205
|
+
} catch {
|
|
136206
|
+
}
|
|
136207
|
+
}
|
|
136208
|
+
const urlAttrs = ["poster"];
|
|
136209
|
+
for (const attr of urlAttrs) {
|
|
136210
|
+
const nodes = root.querySelectorAll ? root.querySelectorAll(`[${attr}^='blob:']`) : [];
|
|
136211
|
+
for (const n of nodes) {
|
|
136212
|
+
try {
|
|
136213
|
+
const u = n.getAttribute(attr);
|
|
136214
|
+
if (isBlobUrl(u)) {
|
|
136215
|
+
n.setAttribute(attr, await blobUrlToDataUrl(u));
|
|
136216
|
+
}
|
|
136217
|
+
} catch {
|
|
136218
|
+
}
|
|
136219
|
+
}
|
|
136220
|
+
}
|
|
136221
|
+
}
|
|
136222
|
+
|
|
136223
|
+
// src/modules/images.js
|
|
136224
|
+
async function inlineImages(clone, options = {}) {
|
|
136225
|
+
const imgs = Array.from(clone.querySelectorAll("img"));
|
|
136226
|
+
const processImg = async (img) => {
|
|
136227
|
+
if (!img.getAttribute("src")) {
|
|
136228
|
+
const eff = img.currentSrc || img.src || "";
|
|
136229
|
+
if (eff) img.setAttribute("src", eff);
|
|
136230
|
+
}
|
|
136231
|
+
img.removeAttribute("srcset");
|
|
136232
|
+
img.removeAttribute("sizes");
|
|
136233
|
+
const src = img.src || "";
|
|
136234
|
+
if (!src) return;
|
|
136235
|
+
const r = await snapFetch(src, { as: "dataURL", useProxy: options.useProxy });
|
|
136236
|
+
if (r.ok && typeof r.data === "string" && r.data.startsWith("data:")) {
|
|
136237
|
+
img.src = r.data;
|
|
136238
|
+
if (!img.width) img.width = img.naturalWidth || 100;
|
|
136239
|
+
if (!img.height) img.height = img.naturalHeight || 100;
|
|
136240
|
+
return;
|
|
136241
|
+
}
|
|
136242
|
+
const { fallbackURL } = options || {};
|
|
136243
|
+
if (fallbackURL) {
|
|
136244
|
+
try {
|
|
136245
|
+
const dsW = parseInt(img.dataset?.snapdomWidth || "", 10) || 0;
|
|
136246
|
+
const dsH = parseInt(img.dataset?.snapdomHeight || "", 10) || 0;
|
|
136247
|
+
const attrW = parseInt(img.getAttribute("width") || "", 10) || 0;
|
|
136248
|
+
const attrH = parseInt(img.getAttribute("height") || "", 10) || 0;
|
|
136249
|
+
const styleW = parseFloat(img.style?.width || "") || 0;
|
|
136250
|
+
const styleH = parseFloat(img.style?.height || "") || 0;
|
|
136251
|
+
const fbW = dsW || styleW || attrW || img.width || void 0;
|
|
136252
|
+
const fbH = dsH || styleH || attrH || img.height || void 0;
|
|
136253
|
+
const fallbackUrl = typeof fallbackURL === "function" ? await fallbackURL({ width: fbW, height: fbH, src, element: img }) : fallbackURL;
|
|
136254
|
+
if (fallbackUrl) {
|
|
136255
|
+
const fallbackData = await snapFetch(fallbackUrl, { as: "dataURL", useProxy: options.useProxy });
|
|
136256
|
+
img.src = fallbackData.data;
|
|
136257
|
+
if (!img.width && fbW) img.width = fbW;
|
|
136258
|
+
if (!img.height && fbH) img.height = fbH;
|
|
136259
|
+
if (!img.width) img.width = img.naturalWidth || 100;
|
|
136260
|
+
if (!img.height) img.height = img.naturalHeight || 100;
|
|
136261
|
+
return;
|
|
136262
|
+
}
|
|
136263
|
+
} catch {
|
|
136264
|
+
}
|
|
136265
|
+
}
|
|
136266
|
+
const w = img.width || img.naturalWidth || 100;
|
|
136267
|
+
const h = img.height || img.naturalHeight || 100;
|
|
136268
|
+
if (options.placeholders !== false) {
|
|
136269
|
+
const fallback = document.createElement("div");
|
|
136270
|
+
fallback.style.cssText = [
|
|
136271
|
+
`width:${w}px`,
|
|
136272
|
+
`height:${h}px`,
|
|
136273
|
+
"background:#ccc",
|
|
136274
|
+
"display:inline-block",
|
|
136275
|
+
"text-align:center",
|
|
136276
|
+
`line-height:${h}px`,
|
|
136277
|
+
"color:#666",
|
|
136278
|
+
"font-size:12px",
|
|
136279
|
+
"overflow:hidden"
|
|
136280
|
+
].join(";");
|
|
136281
|
+
fallback.textContent = "img";
|
|
136282
|
+
img.replaceWith(fallback);
|
|
136283
|
+
} else {
|
|
136284
|
+
const spacer = document.createElement("div");
|
|
136285
|
+
spacer.style.cssText = `display:inline-block;width:${w}px;height:${h}px;visibility:hidden;`;
|
|
136286
|
+
img.replaceWith(spacer);
|
|
136287
|
+
}
|
|
136288
|
+
};
|
|
136289
|
+
for (let i = 0; i < imgs.length; i += 4) {
|
|
136290
|
+
const group = imgs.slice(i, i + 4).map(processImg);
|
|
136291
|
+
await Promise.allSettled(group);
|
|
136292
|
+
}
|
|
136293
|
+
}
|
|
136294
|
+
|
|
136295
|
+
// src/modules/background.js
|
|
136296
|
+
async function inlineBackgroundImages(source, clone, styleCache, options = {}) {
|
|
136297
|
+
const queue = [[source, clone]];
|
|
136298
|
+
const URL_PROPS = [
|
|
136299
|
+
"background-image",
|
|
136300
|
+
// Mask shorthands & images (both standard and WebKit)
|
|
136301
|
+
"mask",
|
|
136302
|
+
"mask-image",
|
|
136303
|
+
"-webkit-mask",
|
|
136304
|
+
"-webkit-mask-image",
|
|
136305
|
+
// Mask sources (rare, but keep)
|
|
136306
|
+
"mask-source",
|
|
136307
|
+
"mask-box-image-source",
|
|
136308
|
+
"mask-border-source",
|
|
136309
|
+
"-webkit-mask-box-image-source",
|
|
136310
|
+
// Border image
|
|
136311
|
+
"border-image",
|
|
136312
|
+
"border-image-source"
|
|
136313
|
+
];
|
|
136314
|
+
const MASK_LAYOUT_PROPS = [
|
|
136315
|
+
"mask-position",
|
|
136316
|
+
"mask-size",
|
|
136317
|
+
"mask-repeat",
|
|
136318
|
+
// WebKit variants
|
|
136319
|
+
"-webkit-mask-position",
|
|
136320
|
+
"-webkit-mask-size",
|
|
136321
|
+
"-webkit-mask-repeat",
|
|
136322
|
+
// Extra (optional but helpful across engines)
|
|
136323
|
+
"mask-origin",
|
|
136324
|
+
"mask-clip",
|
|
136325
|
+
"-webkit-mask-origin",
|
|
136326
|
+
"-webkit-mask-clip",
|
|
136327
|
+
// Some engines expose X/Y position separately:
|
|
136328
|
+
"-webkit-mask-position-x",
|
|
136329
|
+
"-webkit-mask-position-y"
|
|
136330
|
+
];
|
|
136331
|
+
const BORDER_AUX_PROPS = [
|
|
136332
|
+
"border-image-slice",
|
|
136333
|
+
"border-image-width",
|
|
136334
|
+
"border-image-outset",
|
|
136335
|
+
"border-image-repeat"
|
|
136336
|
+
];
|
|
136337
|
+
while (queue.length) {
|
|
136338
|
+
const [srcNode, cloneNode] = queue.shift();
|
|
136339
|
+
const style = styleCache.get(srcNode) || getStyle(srcNode);
|
|
136340
|
+
if (!styleCache.has(srcNode)) styleCache.set(srcNode, style);
|
|
136341
|
+
const hasBorderImage = (() => {
|
|
136342
|
+
const bi = style.getPropertyValue("border-image");
|
|
136343
|
+
const bis = style.getPropertyValue("border-image-source");
|
|
136344
|
+
return bi && bi !== "none" || bis && bis !== "none";
|
|
136345
|
+
})();
|
|
136346
|
+
for (const prop of URL_PROPS) {
|
|
136347
|
+
const val = style.getPropertyValue(prop);
|
|
136348
|
+
if (!val || val === "none") continue;
|
|
136349
|
+
const splits = splitBackgroundImage(val);
|
|
136350
|
+
const inlined = await Promise.all(
|
|
136351
|
+
splits.map((entry) => inlineSingleBackgroundEntry(entry, options))
|
|
136352
|
+
);
|
|
136353
|
+
if (inlined.some((p) => p && p !== "none" && !/^url\(undefined/.test(p))) {
|
|
136354
|
+
cloneNode.style.setProperty(prop, inlined.join(", "));
|
|
136355
|
+
}
|
|
136356
|
+
}
|
|
136357
|
+
for (const prop of MASK_LAYOUT_PROPS) {
|
|
136358
|
+
const val = style.getPropertyValue(prop);
|
|
136359
|
+
if (!val || val === "initial") continue;
|
|
136360
|
+
cloneNode.style.setProperty(prop, val);
|
|
136361
|
+
}
|
|
136362
|
+
if (hasBorderImage) {
|
|
136363
|
+
for (const prop of BORDER_AUX_PROPS) {
|
|
136364
|
+
const val = style.getPropertyValue(prop);
|
|
136365
|
+
if (!val || val === "initial") continue;
|
|
136366
|
+
cloneNode.style.setProperty(prop, val);
|
|
136367
|
+
}
|
|
136368
|
+
}
|
|
136369
|
+
const sChildren = Array.from(srcNode.children);
|
|
136370
|
+
const cChildren = Array.from(cloneNode.children);
|
|
136371
|
+
for (let i = 0; i < Math.min(sChildren.length, cChildren.length); i++) {
|
|
136372
|
+
queue.push([sChildren[i], cChildren[i]]);
|
|
136373
|
+
}
|
|
136374
|
+
}
|
|
136375
|
+
}
|
|
136376
|
+
|
|
136377
|
+
// src/modules/lineClamp.js
|
|
136378
|
+
function lineClamp(el) {
|
|
136379
|
+
if (!el) return () => {
|
|
136380
|
+
};
|
|
136381
|
+
const lines = getClamp(el);
|
|
136382
|
+
if (lines <= 0) return () => {
|
|
136383
|
+
};
|
|
136384
|
+
if (!isPlainTextContainer(el)) return () => {
|
|
136385
|
+
};
|
|
136386
|
+
const cs = getComputedStyle(el);
|
|
136387
|
+
const targetH = Math.round(usedLineHeightPx(cs) * lines + vpad(cs));
|
|
136388
|
+
const original = el.textContent ?? "";
|
|
136389
|
+
const prevText = original;
|
|
136390
|
+
if (el.scrollHeight <= targetH + 0.5) {
|
|
136391
|
+
return () => {
|
|
136392
|
+
};
|
|
136393
|
+
}
|
|
136394
|
+
let lo = 0, hi = original.length, best = -1;
|
|
136395
|
+
while (lo <= hi) {
|
|
136396
|
+
const mid = lo + hi >> 1;
|
|
136397
|
+
el.textContent = original.slice(0, mid) + "\u2026";
|
|
136398
|
+
if (el.scrollHeight <= targetH + 0.5) {
|
|
136399
|
+
best = mid;
|
|
136400
|
+
lo = mid + 1;
|
|
136401
|
+
} else {
|
|
136402
|
+
hi = mid - 1;
|
|
136403
|
+
}
|
|
136404
|
+
}
|
|
136405
|
+
el.textContent = (best >= 0 ? original.slice(0, best) : "") + "\u2026";
|
|
136406
|
+
return () => {
|
|
136407
|
+
el.textContent = prevText;
|
|
136408
|
+
};
|
|
136409
|
+
}
|
|
136410
|
+
function getClamp(el) {
|
|
136411
|
+
const cs = getComputedStyle(el);
|
|
136412
|
+
let v = cs.getPropertyValue("-webkit-line-clamp") || cs.getPropertyValue("line-clamp");
|
|
136413
|
+
v = (v || "").trim();
|
|
136414
|
+
const n = parseInt(v, 10);
|
|
136415
|
+
return Number.isFinite(n) && n > 0 ? n : 0;
|
|
136416
|
+
}
|
|
136417
|
+
function usedLineHeightPx(cs) {
|
|
136418
|
+
const lh = (cs.lineHeight || "").trim();
|
|
136419
|
+
const fs = parseFloat(cs.fontSize) || 16;
|
|
136420
|
+
if (!lh || lh === "normal") return Math.round(fs * 1.2);
|
|
136421
|
+
if (lh.endsWith("px")) return parseFloat(lh);
|
|
136422
|
+
if (/^\d+(\.\d+)?$/.test(lh)) return Math.round(parseFloat(lh) * fs);
|
|
136423
|
+
if (lh.endsWith("%")) return Math.round(parseFloat(lh) / 100 * fs);
|
|
136424
|
+
return Math.round(fs * 1.2);
|
|
136425
|
+
}
|
|
136426
|
+
function vpad(cs) {
|
|
136427
|
+
return (parseFloat(cs.paddingTop) || 0) + (parseFloat(cs.paddingBottom) || 0);
|
|
136428
|
+
}
|
|
136429
|
+
function isPlainTextContainer(el) {
|
|
136430
|
+
if (el.childElementCount > 0) return false;
|
|
136431
|
+
return Array.from(el.childNodes).some((n) => n.nodeType === Node.TEXT_NODE);
|
|
136432
|
+
}
|
|
136433
|
+
|
|
136434
|
+
// src/core/capture.js
|
|
136435
|
+
function stripRootShadows(originalEl, cloneRoot) {
|
|
136436
|
+
if (!originalEl || !cloneRoot || !cloneRoot.style) return;
|
|
136437
|
+
const cs = getComputedStyle(originalEl);
|
|
136438
|
+
try {
|
|
136439
|
+
cloneRoot.style.boxShadow = "none";
|
|
136440
|
+
} catch {
|
|
136441
|
+
}
|
|
136442
|
+
try {
|
|
136443
|
+
cloneRoot.style.textShadow = "none";
|
|
136444
|
+
} catch {
|
|
136445
|
+
}
|
|
136446
|
+
try {
|
|
136447
|
+
cloneRoot.style.outline = "none";
|
|
136448
|
+
} catch {
|
|
136449
|
+
}
|
|
136450
|
+
const f = cs.filter || "";
|
|
136451
|
+
const cleaned = f.replace(/\bblur\([^()]*\)\s*/gi, "").replace(/\bdrop-shadow\([^()]*\)\s*/gi, "").trim().replace(/\s+/g, " ");
|
|
136452
|
+
try {
|
|
136453
|
+
cloneRoot.style.filter = cleaned.length ? cleaned : "none";
|
|
136454
|
+
} catch {
|
|
136455
|
+
}
|
|
136456
|
+
}
|
|
136457
|
+
async function captureDOM(element, options) {
|
|
136458
|
+
if (!element) throw new Error("Element cannot be null or undefined");
|
|
136459
|
+
applyCachePolicy(options.cache);
|
|
136460
|
+
const fast = options.fast;
|
|
136461
|
+
const straighten = !!options.straighten;
|
|
136462
|
+
const noShadows = !!options.noShadows;
|
|
136463
|
+
let clone, classCSS, styleCache;
|
|
136464
|
+
let fontsCSS = "";
|
|
136465
|
+
let baseCSS = "";
|
|
136466
|
+
let dataURL;
|
|
136467
|
+
let svgString;
|
|
136468
|
+
let rootTransform2D = null;
|
|
136469
|
+
const undoClamp = lineClamp(element);
|
|
136470
|
+
try {
|
|
136471
|
+
({ clone, classCSS, styleCache } = await prepareClone(element, options));
|
|
136472
|
+
if (straighten && clone) {
|
|
136473
|
+
rootTransform2D = normalizeRootTransforms(element, clone);
|
|
136474
|
+
}
|
|
136475
|
+
if (noShadows && clone) {
|
|
136476
|
+
stripRootShadows(element, clone);
|
|
136477
|
+
}
|
|
136478
|
+
} finally {
|
|
136479
|
+
undoClamp();
|
|
136480
|
+
}
|
|
136481
|
+
await new Promise((resolve) => {
|
|
136482
|
+
idle(async () => {
|
|
136483
|
+
await inlineImages(clone, options);
|
|
136484
|
+
resolve();
|
|
136485
|
+
}, { fast });
|
|
136486
|
+
});
|
|
136487
|
+
await new Promise((resolve) => {
|
|
136488
|
+
idle(async () => {
|
|
136489
|
+
await inlineBackgroundImages(element, clone, styleCache, options);
|
|
136490
|
+
resolve();
|
|
136491
|
+
}, { fast });
|
|
136492
|
+
});
|
|
136493
|
+
if (options.embedFonts) {
|
|
136494
|
+
await new Promise((resolve) => {
|
|
136495
|
+
idle(async () => {
|
|
136496
|
+
const required = collectUsedFontVariants(element);
|
|
136497
|
+
const usedCodepoints = collectUsedCodepoints(element);
|
|
136498
|
+
if (isSafari()) {
|
|
136499
|
+
const families = new Set(
|
|
136500
|
+
Array.from(required).map((k) => String(k).split("__")[0]).filter(Boolean)
|
|
136501
|
+
);
|
|
136502
|
+
await ensureFontsReady(families, 1);
|
|
136503
|
+
}
|
|
136504
|
+
fontsCSS = await embedCustomFonts({
|
|
136505
|
+
required,
|
|
136506
|
+
usedCodepoints,
|
|
136507
|
+
exclude: options.excludeFonts,
|
|
136508
|
+
useProxy: options.useProxy
|
|
136509
|
+
});
|
|
136510
|
+
resolve();
|
|
136511
|
+
}, { fast });
|
|
136512
|
+
});
|
|
136513
|
+
}
|
|
136514
|
+
const usedTags = collectUsedTagNames(clone).sort();
|
|
136515
|
+
const tagKey = usedTags.join(",");
|
|
136516
|
+
if (cache.baseStyle.has(tagKey)) {
|
|
136517
|
+
baseCSS = cache.baseStyle.get(tagKey);
|
|
136518
|
+
} else {
|
|
136519
|
+
await new Promise((resolve) => {
|
|
136520
|
+
idle(() => {
|
|
136521
|
+
baseCSS = generateDedupedBaseCSS(usedTags);
|
|
136522
|
+
cache.baseStyle.set(tagKey, baseCSS);
|
|
136523
|
+
resolve();
|
|
136524
|
+
}, { fast });
|
|
136525
|
+
});
|
|
136526
|
+
}
|
|
136527
|
+
await new Promise((resolve) => {
|
|
136528
|
+
idle(() => {
|
|
136529
|
+
const csEl = getComputedStyle(element);
|
|
136530
|
+
function parseFilterDropShadows(cs) {
|
|
136531
|
+
const raw = `${cs.filter || ""} ${cs.webkitFilter || ""}`.trim();
|
|
136532
|
+
if (!raw || raw === "none") {
|
|
136533
|
+
return { bleed: { top: 0, right: 0, bottom: 0, left: 0 }, has: false };
|
|
136534
|
+
}
|
|
136535
|
+
const tokens = raw.match(/drop-shadow\((?:[^()]|\([^()]*\))*\)/gi) || [];
|
|
136536
|
+
let t = 0, r = 0, b = 0, l = 0;
|
|
136537
|
+
let found = false;
|
|
136538
|
+
for (const tok of tokens) {
|
|
136539
|
+
found = true;
|
|
136540
|
+
const nums = tok.match(/-?\d+(?:\.\d+)?px/gi)?.map((v) => parseFloat(v)) || [];
|
|
136541
|
+
const [ox = 0, oy = 0, blur = 0] = nums;
|
|
136542
|
+
const extX = Math.abs(ox) + blur;
|
|
136543
|
+
const extY = Math.abs(oy) + blur;
|
|
136544
|
+
r = Math.max(r, extX + Math.max(ox, 0));
|
|
136545
|
+
l = Math.max(l, extX + Math.max(-ox, 0));
|
|
136546
|
+
b = Math.max(b, extY + Math.max(oy, 0));
|
|
136547
|
+
t = Math.max(t, extY + Math.max(-oy, 0));
|
|
136548
|
+
}
|
|
136549
|
+
return { bleed: { top: Math.ceil(t), right: Math.ceil(r), bottom: Math.ceil(b), left: Math.ceil(l) }, has: found };
|
|
136550
|
+
}
|
|
136551
|
+
const rect = element.getBoundingClientRect();
|
|
136552
|
+
const w0 = Math.max(1, Math.ceil(element.offsetWidth || parseFloat(csEl.width) || rect.width || 1));
|
|
136553
|
+
const h0 = Math.max(1, Math.ceil(element.offsetHeight || parseFloat(csEl.height) || rect.height || 1));
|
|
136554
|
+
const coerceNum = (v, def = NaN) => {
|
|
136555
|
+
const n = typeof v === "string" ? parseFloat(v) : v;
|
|
136556
|
+
return Number.isFinite(n) ? n : def;
|
|
136557
|
+
};
|
|
136558
|
+
const optW = coerceNum(options.width);
|
|
136559
|
+
const optH = coerceNum(options.height);
|
|
136560
|
+
let w = w0, h = h0;
|
|
136561
|
+
const hasW = Number.isFinite(optW);
|
|
136562
|
+
const hasH = Number.isFinite(optH);
|
|
136563
|
+
const aspect0 = h0 > 0 ? w0 / h0 : 1;
|
|
136564
|
+
if (hasW && hasH) {
|
|
136565
|
+
w = Math.max(1, Math.ceil(optW));
|
|
136566
|
+
h = Math.max(1, Math.ceil(optH));
|
|
136567
|
+
} else if (hasW) {
|
|
136568
|
+
w = Math.max(1, Math.ceil(optW));
|
|
136569
|
+
h = Math.max(1, Math.ceil(w / (aspect0 || 1)));
|
|
136570
|
+
} else if (hasH) {
|
|
136571
|
+
h = Math.max(1, Math.ceil(optH));
|
|
136572
|
+
w = Math.max(1, Math.ceil(h * (aspect0 || 1)));
|
|
136573
|
+
} else {
|
|
136574
|
+
w = w0;
|
|
136575
|
+
h = h0;
|
|
136576
|
+
}
|
|
136577
|
+
let minX = 0, minY = 0, maxX = w0, maxY = h0;
|
|
136578
|
+
if (straighten && rootTransform2D && Number.isFinite(rootTransform2D.a)) {
|
|
136579
|
+
const M2 = { a: rootTransform2D.a, b: rootTransform2D.b || 0, c: rootTransform2D.c || 0, d: rootTransform2D.d || 1, e: 0, f: 0 };
|
|
136580
|
+
const bb2 = bboxWithOriginFull(w0, h0, M2, 0, 0);
|
|
136581
|
+
minX = bb2.minX;
|
|
136582
|
+
minY = bb2.minY;
|
|
136583
|
+
maxX = bb2.maxX;
|
|
136584
|
+
maxY = bb2.maxY;
|
|
136585
|
+
} else {
|
|
136586
|
+
const useTFBBox = !straighten && hasTFBBox(element);
|
|
136587
|
+
if (useTFBBox) {
|
|
136588
|
+
const baseTransform2 = csEl.transform && csEl.transform !== "none" ? csEl.transform : "";
|
|
136589
|
+
const ind2 = readIndividualTransforms(element);
|
|
136590
|
+
const TOTAL = readTotalTransformMatrix({
|
|
136591
|
+
baseTransform: baseTransform2,
|
|
136592
|
+
rotate: ind2.rotate || "0deg",
|
|
136593
|
+
scale: ind2.scale,
|
|
136594
|
+
translate: ind2.translate
|
|
136595
|
+
});
|
|
136596
|
+
const { ox: ox2, oy: oy2 } = parseTransformOriginPx(csEl, w0, h0);
|
|
136597
|
+
const M = TOTAL.is2D ? TOTAL : new DOMMatrix(TOTAL.toString());
|
|
136598
|
+
const bb = bboxWithOriginFull(w0, h0, M, ox2, oy2);
|
|
136599
|
+
minX = bb.minX;
|
|
136600
|
+
minY = bb.minY;
|
|
136601
|
+
maxX = bb.maxX;
|
|
136602
|
+
maxY = bb.maxY;
|
|
136603
|
+
}
|
|
136604
|
+
}
|
|
136605
|
+
const bleedShadow = parseBoxShadow(csEl);
|
|
136606
|
+
const bleedBlur = parseFilterBlur(csEl);
|
|
136607
|
+
const bleedOutline = parseOutline(csEl);
|
|
136608
|
+
const drop = parseFilterDropShadows(csEl);
|
|
136609
|
+
const bleed = noShadows ? { top: 0, right: 0, bottom: 0, left: 0 } : {
|
|
136610
|
+
top: bleedShadow.top + bleedBlur.top + bleedOutline.top + drop.bleed.top,
|
|
136611
|
+
right: bleedShadow.right + bleedBlur.right + bleedOutline.right + drop.bleed.right,
|
|
136612
|
+
bottom: bleedShadow.bottom + bleedBlur.bottom + bleedOutline.bottom + drop.bleed.bottom,
|
|
136613
|
+
left: bleedShadow.left + bleedBlur.left + bleedOutline.left + drop.bleed.left
|
|
136614
|
+
};
|
|
136615
|
+
minX -= bleed.left;
|
|
136616
|
+
minY -= bleed.top;
|
|
136617
|
+
maxX += bleed.right;
|
|
136618
|
+
maxY += bleed.bottom;
|
|
136619
|
+
const vbW0 = Math.max(1, Math.ceil(maxX - minX));
|
|
136620
|
+
const vbH0 = Math.max(1, Math.ceil(maxY - minY));
|
|
136621
|
+
const outW = Math.max(1, Math.round(vbW0 * (hasW || hasH ? w / w0 : 1)));
|
|
136622
|
+
const outH = Math.max(1, Math.round(vbH0 * (hasH || hasW ? h / h0 : 1)));
|
|
136623
|
+
const svgNS = "http://www.w3.org/2000/svg";
|
|
136624
|
+
const basePad = isSafari() ? 1 : 0;
|
|
136625
|
+
const extraPad = straighten ? 1 : 0;
|
|
136626
|
+
const pad = basePad + extraPad;
|
|
136627
|
+
const fo = document.createElementNS(svgNS, "foreignObject");
|
|
136628
|
+
const vbMinX = Math.floor(minX);
|
|
136629
|
+
const vbMinY = Math.floor(minY);
|
|
136630
|
+
fo.setAttribute("x", String(-(vbMinX - pad)));
|
|
136631
|
+
fo.setAttribute("y", String(-(vbMinY - pad)));
|
|
136632
|
+
fo.setAttribute("width", String(Math.ceil(w0 + pad * 2)));
|
|
136633
|
+
fo.setAttribute("height", String(Math.ceil(h0 + pad * 2)));
|
|
136634
|
+
fo.style.overflow = "visible";
|
|
136635
|
+
const styleTag = document.createElement("style");
|
|
136636
|
+
styleTag.textContent = baseCSS + fontsCSS + "svg{overflow:visible;} foreignObject{overflow:visible;}" + classCSS;
|
|
136637
|
+
fo.appendChild(styleTag);
|
|
136638
|
+
const container = document.createElement("div");
|
|
136639
|
+
container.setAttribute("xmlns", "http://www.w3.org/1999/xhtml");
|
|
136640
|
+
container.style.width = `${w0}px`;
|
|
136641
|
+
container.style.height = `${h0}px`;
|
|
136642
|
+
container.style.overflow = "visible";
|
|
136643
|
+
clone.setAttribute("xmlns", "http://www.w3.org/1999/xhtml");
|
|
136644
|
+
container.appendChild(clone);
|
|
136645
|
+
fo.appendChild(container);
|
|
136646
|
+
const serializer = new XMLSerializer();
|
|
136647
|
+
const foString = serializer.serializeToString(fo);
|
|
136648
|
+
const vbW = vbW0 + pad * 2;
|
|
136649
|
+
const vbH = vbH0 + pad * 2;
|
|
136650
|
+
const wantsSize = hasW || hasH;
|
|
136651
|
+
options.meta = { w0, h0, vbW, vbH, targetW: w, targetH: h };
|
|
136652
|
+
const svgOutW = isSafari() && wantsSize ? vbW : outW + pad * 2;
|
|
136653
|
+
const svgOutH = isSafari() && wantsSize ? vbH : outH + pad * 2;
|
|
136654
|
+
const svgHeader = `<svg xmlns="${svgNS}" width="${svgOutW}" height="${svgOutH}" viewBox="0 0 ${vbW} ${vbH}">`;
|
|
136655
|
+
const svgFooter = "</svg>";
|
|
136656
|
+
svgString = svgHeader + foString + svgFooter;
|
|
136657
|
+
dataURL = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svgString)}`;
|
|
136658
|
+
resolve();
|
|
136659
|
+
}, { fast });
|
|
136660
|
+
});
|
|
136661
|
+
const sandbox = document.getElementById("snapdom-sandbox");
|
|
136662
|
+
if (sandbox && sandbox.style.position === "absolute") sandbox.remove();
|
|
136663
|
+
return dataURL;
|
|
136664
|
+
}
|
|
136665
|
+
function normalizeRootTransforms(originalEl, cloneRoot) {
|
|
136666
|
+
if (!originalEl || !cloneRoot || !cloneRoot.style) return null;
|
|
136667
|
+
const cs = getComputedStyle(originalEl);
|
|
136668
|
+
try {
|
|
136669
|
+
cloneRoot.style.transformOrigin = "0 0";
|
|
136670
|
+
} catch {
|
|
136671
|
+
}
|
|
136672
|
+
try {
|
|
136673
|
+
if ("translate" in cloneRoot.style) cloneRoot.style.translate = "none";
|
|
136674
|
+
if ("rotate" in cloneRoot.style) cloneRoot.style.rotate = "none";
|
|
136675
|
+
} catch {
|
|
136676
|
+
}
|
|
136677
|
+
const tr = cs.transform || "none";
|
|
136678
|
+
if (tr === "none") {
|
|
136679
|
+
try {
|
|
136680
|
+
const M = matrixFromComputed(originalEl);
|
|
136681
|
+
if (M.a === 1 && M.b === 0 && M.c === 0 && M.d === 1) {
|
|
136682
|
+
cloneRoot.style.transform = "none";
|
|
136683
|
+
return { a: 1, b: 0, c: 0, d: 1 };
|
|
136684
|
+
}
|
|
136685
|
+
} catch {
|
|
136686
|
+
}
|
|
136687
|
+
}
|
|
136688
|
+
const m2d = tr.match(/^matrix\(\s*([^)]+)\)$/i);
|
|
136689
|
+
if (m2d) {
|
|
136690
|
+
const nums = m2d[1].split(",").map((v) => parseFloat(v.trim()));
|
|
136691
|
+
if (nums.length === 6 && nums.every(Number.isFinite)) {
|
|
136692
|
+
const [a, b, c, d] = nums;
|
|
136693
|
+
const scaleX = Math.sqrt(a * a + b * b) || 0;
|
|
136694
|
+
let a1 = 0, b1 = 0, shear = 0, c2 = 0, d2 = 0, scaleY = 0;
|
|
136695
|
+
if (scaleX > 0) {
|
|
136696
|
+
a1 = a / scaleX;
|
|
136697
|
+
b1 = b / scaleX;
|
|
136698
|
+
shear = a1 * c + b1 * d;
|
|
136699
|
+
c2 = c - a1 * shear;
|
|
136700
|
+
d2 = d - b1 * shear;
|
|
136701
|
+
scaleY = Math.sqrt(c2 * c2 + d2 * d2) || 0;
|
|
136702
|
+
if (scaleY > 0) shear = shear / scaleY;
|
|
136703
|
+
else shear = 0;
|
|
136704
|
+
}
|
|
136705
|
+
const aP = scaleX;
|
|
136706
|
+
const bP = 0;
|
|
136707
|
+
const cP = shear * scaleY;
|
|
136708
|
+
const dP = scaleY;
|
|
136709
|
+
try {
|
|
136710
|
+
cloneRoot.style.transform = `matrix(${aP}, ${bP}, ${cP}, ${dP}, 0, 0)`;
|
|
136711
|
+
} catch {
|
|
136712
|
+
}
|
|
136713
|
+
return { a: aP, b: bP, c: cP, d: dP };
|
|
136714
|
+
}
|
|
136715
|
+
}
|
|
136716
|
+
try {
|
|
136717
|
+
const legacy = String(tr).trim();
|
|
136718
|
+
cloneRoot.style.transform = legacy + " translate(0px, 0px) rotate(0deg)";
|
|
136719
|
+
return null;
|
|
136720
|
+
} catch {
|
|
136721
|
+
return null;
|
|
136722
|
+
}
|
|
136723
|
+
}
|
|
136724
|
+
function parseBoxShadow(cs) {
|
|
136725
|
+
const v = cs.boxShadow || "";
|
|
136726
|
+
if (!v || v === "none") return { top: 0, right: 0, bottom: 0, left: 0 };
|
|
136727
|
+
const parts = v.split(/\),(?=(?:[^()]*\([^()]*\))*[^()]*$)/).map((s) => s.trim());
|
|
136728
|
+
let t = 0, r = 0, b2 = 0, l = 0;
|
|
136729
|
+
for (const part of parts) {
|
|
136730
|
+
const nums = part.match(/-?\d+(\.\d+)?px/g)?.map((n) => parseFloat(n)) || [];
|
|
136731
|
+
if (nums.length < 2) continue;
|
|
136732
|
+
const [ox2, oy2, blur = 0, spread = 0] = nums;
|
|
136733
|
+
const extX = Math.abs(ox2) + blur + spread;
|
|
136734
|
+
const extY = Math.abs(oy2) + blur + spread;
|
|
136735
|
+
r = Math.max(r, extX + Math.max(ox2, 0));
|
|
136736
|
+
l = Math.max(l, extX + Math.max(-ox2, 0));
|
|
136737
|
+
b2 = Math.max(b2, extY + Math.max(oy2, 0));
|
|
136738
|
+
t = Math.max(t, extY + Math.max(-oy2, 0));
|
|
136739
|
+
}
|
|
136740
|
+
return { top: Math.ceil(t), right: Math.ceil(r), bottom: Math.ceil(b2), left: Math.ceil(l) };
|
|
136741
|
+
}
|
|
136742
|
+
function parseFilterBlur(cs) {
|
|
136743
|
+
const m = (cs.filter || "").match(/blur\(\s*([0-9.]+)px\s*\)/);
|
|
136744
|
+
const b2 = m ? Math.ceil(parseFloat(m[1]) || 0) : 0;
|
|
136745
|
+
return { top: b2, right: b2, bottom: b2, left: b2 };
|
|
136746
|
+
}
|
|
136747
|
+
function parseOutline(cs) {
|
|
136748
|
+
if ((cs.outlineStyle || "none") === "none") return { top: 0, right: 0, bottom: 0, left: 0 };
|
|
136749
|
+
const w2 = Math.ceil(parseFloat(cs.outlineWidth || "0") || 0);
|
|
136750
|
+
return { top: w2, right: w2, bottom: w2, left: w2 };
|
|
136751
|
+
}
|
|
136752
|
+
function bboxWithOriginFull(w2, h2, M, ox2, oy2) {
|
|
136753
|
+
const a2 = M.a, b2 = M.b, c2 = M.c, d2 = M.d, e2 = M.e || 0, f2 = M.f || 0;
|
|
136754
|
+
function pt(x, y) {
|
|
136755
|
+
let X = x - ox2, Y = y - oy2;
|
|
136756
|
+
let X2 = a2 * X + c2 * Y, Y2 = b2 * X + d2 * Y;
|
|
136757
|
+
X2 += ox2 + e2;
|
|
136758
|
+
Y2 += oy2 + f2;
|
|
136759
|
+
return [X2, Y2];
|
|
136760
|
+
}
|
|
136761
|
+
const P = [pt(0, 0), pt(w2, 0), pt(0, h2), pt(w2, h2)];
|
|
136762
|
+
let minX2 = Infinity, minY2 = Infinity, maxX2 = -Infinity, maxY2 = -Infinity;
|
|
136763
|
+
for (const [X, Y] of P) {
|
|
136764
|
+
if (X < minX2) minX2 = X;
|
|
136765
|
+
if (Y < minY2) minY2 = Y;
|
|
136766
|
+
if (X > maxX2) maxX2 = X;
|
|
136767
|
+
if (Y > maxY2) maxY2 = Y;
|
|
136768
|
+
}
|
|
136769
|
+
return { minX: minX2, minY: minY2, maxX: maxX2, maxY: maxY2, width: maxX2 - minX2, height: maxY2 - minY2 };
|
|
136770
|
+
}
|
|
136771
|
+
function hasTFBBox(el) {
|
|
136772
|
+
return hasBBoxAffectingTransform(el);
|
|
136773
|
+
}
|
|
136774
|
+
function matrixFromComputed(el) {
|
|
136775
|
+
const tr = getComputedStyle(el).transform;
|
|
136776
|
+
if (!tr || tr === "none") return new DOMMatrix();
|
|
136777
|
+
try {
|
|
136778
|
+
return new DOMMatrix(tr);
|
|
136779
|
+
} catch {
|
|
136780
|
+
return new WebKitCSSMatrix(tr);
|
|
136781
|
+
}
|
|
136782
|
+
}
|
|
136783
|
+
function readIndividualTransforms(el) {
|
|
136784
|
+
const out = { rotate: "0deg", scale: null, translate: null };
|
|
136785
|
+
const map = typeof el.computedStyleMap === "function" ? el.computedStyleMap() : null;
|
|
136786
|
+
if (map) {
|
|
136787
|
+
const safeGet = (prop) => {
|
|
136788
|
+
try {
|
|
136789
|
+
if (typeof map.has === "function" && !map.has(prop)) return null;
|
|
136790
|
+
if (typeof map.get !== "function") return null;
|
|
136791
|
+
return map.get(prop);
|
|
136792
|
+
} catch {
|
|
136793
|
+
return null;
|
|
136794
|
+
}
|
|
136795
|
+
};
|
|
136796
|
+
const rot = safeGet("rotate");
|
|
136797
|
+
if (rot) {
|
|
136798
|
+
if (rot.angle) {
|
|
136799
|
+
const ang = rot.angle;
|
|
136800
|
+
out.rotate = ang.unit === "rad" ? ang.value * 180 / Math.PI + "deg" : ang.value + ang.unit;
|
|
136801
|
+
} else if (rot.unit) {
|
|
136802
|
+
out.rotate = rot.unit === "rad" ? rot.value * 180 / Math.PI + "deg" : rot.value + rot.unit;
|
|
136803
|
+
} else {
|
|
136804
|
+
out.rotate = String(rot);
|
|
136805
|
+
}
|
|
136806
|
+
} else {
|
|
136807
|
+
const cs2 = getComputedStyle(el);
|
|
136808
|
+
out.rotate = cs2.rotate && cs2.rotate !== "none" ? cs2.rotate : "0deg";
|
|
136809
|
+
}
|
|
136810
|
+
const sc = safeGet("scale");
|
|
136811
|
+
if (sc) {
|
|
136812
|
+
const sx = "x" in sc && sc.x?.value != null ? sc.x.value : Array.isArray(sc) ? sc[0]?.value : Number(sc) || 1;
|
|
136813
|
+
const sy = "y" in sc && sc.y?.value != null ? sc.y.value : Array.isArray(sc) ? sc[1]?.value : sx;
|
|
136814
|
+
out.scale = `${sx} ${sy}`;
|
|
136815
|
+
} else {
|
|
136816
|
+
const cs2 = getComputedStyle(el);
|
|
136817
|
+
out.scale = cs2.scale && cs2.scale !== "none" ? cs2.scale : null;
|
|
136818
|
+
}
|
|
136819
|
+
const tr = safeGet("translate");
|
|
136820
|
+
if (tr) {
|
|
136821
|
+
const tx = "x" in tr && "value" in tr.x ? tr.x.value : Array.isArray(tr) ? tr[0]?.value : 0;
|
|
136822
|
+
const ty = "y" in tr && "value" in tr.y ? tr.y.value : Array.isArray(tr) ? tr[1]?.value : 0;
|
|
136823
|
+
const ux = "x" in tr && tr.x?.unit ? tr.x.unit : "px";
|
|
136824
|
+
const uy = "y" in tr && tr.y?.unit ? tr.y.unit : "px";
|
|
136825
|
+
out.translate = `${tx}${ux} ${ty}${uy}`;
|
|
136826
|
+
} else {
|
|
136827
|
+
const cs2 = getComputedStyle(el);
|
|
136828
|
+
out.translate = cs2.translate && cs2.translate !== "none" ? cs2.translate : null;
|
|
136829
|
+
}
|
|
136830
|
+
return out;
|
|
136831
|
+
}
|
|
136832
|
+
const cs = getComputedStyle(el);
|
|
136833
|
+
out.rotate = cs.rotate && cs.rotate !== "none" ? cs.rotate : "0deg";
|
|
136834
|
+
out.scale = cs.scale && cs.scale !== "none" ? cs.scale : null;
|
|
136835
|
+
out.translate = cs.translate && cs.translate !== "none" ? cs.translate : null;
|
|
136836
|
+
return out;
|
|
136837
|
+
}
|
|
136838
|
+
function hasBBoxAffectingTransform(el) {
|
|
136839
|
+
const cs = getComputedStyle(el);
|
|
136840
|
+
const t = cs.transform || "none";
|
|
136841
|
+
const hasMatrix = t !== "none" && !/^matrix\(\s*1\s*,\s*0\s*,\s*0\s*,\s*1\s*,\s*0\s*,\s*0\s*\)$/i.test(t);
|
|
136842
|
+
if (hasMatrix) return true;
|
|
136843
|
+
const r = cs.rotate && cs.rotate !== "none" && cs.rotate !== "0deg";
|
|
136844
|
+
const s = cs.scale && cs.scale !== "none" && cs.scale !== "1";
|
|
136845
|
+
const tr = cs.translate && cs.translate !== "none" && cs.translate !== "0px 0px";
|
|
136846
|
+
return Boolean(r || s || tr);
|
|
136847
|
+
}
|
|
136848
|
+
function parseTransformOriginPx(cs, w, h) {
|
|
136849
|
+
const raw = (cs.transformOrigin || "0 0").trim().split(/\s+/);
|
|
136850
|
+
const [oxRaw, oyRaw] = [raw[0] || "0", raw[1] || "0"];
|
|
136851
|
+
const toPx = (token, size) => {
|
|
136852
|
+
const t = token.toLowerCase();
|
|
136853
|
+
if (t === "left" || t === "top") return 0;
|
|
136854
|
+
if (t === "center") return size / 2;
|
|
136855
|
+
if (t === "right") return size;
|
|
136856
|
+
if (t === "bottom") return size;
|
|
136857
|
+
if (t.endsWith("px")) return parseFloat(t) || 0;
|
|
136858
|
+
if (t.endsWith("%")) return (parseFloat(t) || 0) * size / 100;
|
|
136859
|
+
if (/^-?\d+(\.\d+)?$/.test(t)) return parseFloat(t) || 0;
|
|
136860
|
+
return 0;
|
|
136861
|
+
};
|
|
136862
|
+
return {
|
|
136863
|
+
ox: toPx(oxRaw, w),
|
|
136864
|
+
oy: toPx(oyRaw, h)
|
|
136865
|
+
};
|
|
136866
|
+
}
|
|
136867
|
+
var __measureHost = null;
|
|
136868
|
+
function getMeasureHost() {
|
|
136869
|
+
if (__measureHost) return __measureHost;
|
|
136870
|
+
const n = document.createElement("div");
|
|
136871
|
+
n.id = "snapdom-measure-slot";
|
|
136872
|
+
n.setAttribute("aria-hidden", "true");
|
|
136873
|
+
Object.assign(n.style, {
|
|
136874
|
+
position: "absolute",
|
|
136875
|
+
left: "-99999px",
|
|
136876
|
+
top: "0px",
|
|
136877
|
+
width: "0px",
|
|
136878
|
+
height: "0px",
|
|
136879
|
+
overflow: "hidden",
|
|
136880
|
+
opacity: "0",
|
|
136881
|
+
pointerEvents: "none",
|
|
136882
|
+
contain: "size layout style"
|
|
136883
|
+
});
|
|
136884
|
+
document.documentElement.appendChild(n);
|
|
136885
|
+
__measureHost = n;
|
|
136886
|
+
return n;
|
|
136887
|
+
}
|
|
136888
|
+
function readTotalTransformMatrix(t) {
|
|
136889
|
+
const host = getMeasureHost();
|
|
136890
|
+
const tmp = document.createElement("div");
|
|
136891
|
+
tmp.style.transformOrigin = "0 0";
|
|
136892
|
+
if (t.baseTransform) tmp.style.transform = t.baseTransform;
|
|
136893
|
+
if (t.rotate) tmp.style.rotate = t.rotate;
|
|
136894
|
+
if (t.scale) tmp.style.scale = t.scale;
|
|
136895
|
+
if (t.translate) tmp.style.translate = t.translate;
|
|
136896
|
+
host.appendChild(tmp);
|
|
136897
|
+
const M = matrixFromComputed(tmp);
|
|
136898
|
+
host.removeChild(tmp);
|
|
136899
|
+
return M;
|
|
136900
|
+
}
|
|
136901
|
+
|
|
136902
|
+
// src/core/context.js
|
|
136903
|
+
function normalizeCachePolicy(v) {
|
|
136904
|
+
if (typeof v === "string") {
|
|
136905
|
+
const s = v.toLowerCase().trim();
|
|
136906
|
+
if (s === "disabled" || s === "full" || s === "auto" || s === "soft") return (
|
|
136907
|
+
/** @type {CachePolicy} */
|
|
136908
|
+
s
|
|
136909
|
+
);
|
|
136910
|
+
}
|
|
136911
|
+
return "soft";
|
|
136912
|
+
}
|
|
136913
|
+
function createContext(options = {}) {
|
|
136914
|
+
const resolvedFormat = options.format ?? "png";
|
|
136915
|
+
const cachePolicy = normalizeCachePolicy(options.cache);
|
|
136916
|
+
return {
|
|
136917
|
+
// Debug & perf
|
|
136918
|
+
debug: options.debug ?? false,
|
|
136919
|
+
fast: options.fast ?? true,
|
|
136920
|
+
scale: options.scale ?? 1,
|
|
136921
|
+
// DOM filters
|
|
136922
|
+
exclude: options.exclude ?? [],
|
|
136923
|
+
excludeMode: options.excludeMode ?? "hide",
|
|
136924
|
+
filter: options.filter ?? null,
|
|
136925
|
+
filterMode: options.filterMode ?? "hide",
|
|
136926
|
+
// Placeholders
|
|
136927
|
+
placeholders: options.placeholders !== false,
|
|
136928
|
+
// default true
|
|
136929
|
+
// Fonts
|
|
136930
|
+
embedFonts: options.embedFonts ?? false,
|
|
136931
|
+
iconFonts: Array.isArray(options.iconFonts) ? options.iconFonts : options.iconFonts ? [options.iconFonts] : [],
|
|
136932
|
+
localFonts: Array.isArray(options.localFonts) ? options.localFonts : [],
|
|
136933
|
+
excludeFonts: options.excludeFonts ?? void 0,
|
|
136934
|
+
fallbackURL: options.fallbackURL ?? void 0,
|
|
136935
|
+
/** @type {CachePolicy} */
|
|
136936
|
+
cache: cachePolicy,
|
|
136937
|
+
// Network
|
|
136938
|
+
useProxy: typeof options.useProxy === "string" ? options.useProxy : "",
|
|
136939
|
+
// Output
|
|
136940
|
+
width: options.width ?? null,
|
|
136941
|
+
height: options.height ?? null,
|
|
136942
|
+
format: resolvedFormat,
|
|
136943
|
+
type: options.type ?? "svg",
|
|
136944
|
+
quality: options.quality ?? 0.92,
|
|
136945
|
+
dpr: options.dpr ?? (window.devicePixelRatio || 1),
|
|
136946
|
+
backgroundColor: options.backgroundColor ?? (["jpg", "jpeg", "webp"].includes(resolvedFormat) ? "#ffffff" : null),
|
|
136947
|
+
filename: options.filename ?? "snapDOM",
|
|
136948
|
+
// NEW flags (user-friendly)
|
|
136949
|
+
straighten: options.straighten ?? false,
|
|
136950
|
+
noShadows: options.noShadows ?? false
|
|
136951
|
+
// Plugins (reservado)
|
|
136952
|
+
// plugins: normalizePlugins(...),
|
|
136953
|
+
};
|
|
136954
|
+
}
|
|
136955
|
+
|
|
136956
|
+
// src/exporters/toCanvas.js
|
|
136957
|
+
function isSvgDataURL(u) {
|
|
136958
|
+
return typeof u === "string" && /^data:image\/svg\+xml/i.test(u);
|
|
136959
|
+
}
|
|
136960
|
+
function decodeSvgFromDataURL(u) {
|
|
136961
|
+
const i = u.indexOf(",");
|
|
136962
|
+
return i >= 0 ? decodeURIComponent(u.slice(i + 1)) : "";
|
|
136963
|
+
}
|
|
136964
|
+
function encodeSvgToDataURL(svgText) {
|
|
136965
|
+
return `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svgText)}`;
|
|
136966
|
+
}
|
|
136967
|
+
function splitDecls(s) {
|
|
136968
|
+
let parts = [], buf = "", depth = 0;
|
|
136969
|
+
for (let i = 0; i < s.length; i++) {
|
|
136970
|
+
const ch = s[i];
|
|
136971
|
+
if (ch === "(") depth++;
|
|
136972
|
+
if (ch === ")") depth = Math.max(0, depth - 1);
|
|
136973
|
+
if (ch === ";" && depth === 0) {
|
|
136974
|
+
parts.push(buf);
|
|
136975
|
+
buf = "";
|
|
136976
|
+
} else buf += ch;
|
|
136977
|
+
}
|
|
136978
|
+
if (buf.trim()) parts.push(buf);
|
|
136979
|
+
return parts.map((x) => x.trim()).filter(Boolean);
|
|
136980
|
+
}
|
|
136981
|
+
function boxShadowToDropShadow(value) {
|
|
136982
|
+
const layers = [];
|
|
136983
|
+
let buf = "", depth = 0;
|
|
136984
|
+
for (let i = 0; i < value.length; i++) {
|
|
136985
|
+
const ch = value[i];
|
|
136986
|
+
if (ch === "(") depth++;
|
|
136987
|
+
if (ch === ")") depth = Math.max(0, depth - 1);
|
|
136988
|
+
if (ch === "," && depth === 0) {
|
|
136989
|
+
layers.push(buf.trim());
|
|
136990
|
+
buf = "";
|
|
136991
|
+
} else buf += ch;
|
|
136992
|
+
}
|
|
136993
|
+
if (buf.trim()) layers.push(buf.trim());
|
|
136994
|
+
const fns = [];
|
|
136995
|
+
for (const layer of layers) {
|
|
136996
|
+
if (/\binset\b/i.test(layer)) continue;
|
|
136997
|
+
const nums = layer.match(/-?\d+(?:\.\d+)?px/gi) || [];
|
|
136998
|
+
const [ox = "0px", oy = "0px", blur = "0px"] = nums;
|
|
136999
|
+
let color = layer.replace(/-?\d+(?:\.\d+)?px/gi, "").replace(/\binset\b/ig, "").trim().replace(/\s{2,}/g, " ");
|
|
137000
|
+
const hasColor = !!color && color !== ",";
|
|
137001
|
+
fns.push(`drop-shadow(${ox} ${oy} ${blur}${hasColor ? ` ${color}` : ""})`);
|
|
137002
|
+
}
|
|
137003
|
+
return fns.join(" ");
|
|
137004
|
+
}
|
|
137005
|
+
function rewriteDeclList(list) {
|
|
137006
|
+
const decls = splitDecls(list);
|
|
137007
|
+
let filter = null, wfilter = null, box = null;
|
|
137008
|
+
const rest = [];
|
|
137009
|
+
for (const d of decls) {
|
|
137010
|
+
const idx = d.indexOf(":");
|
|
137011
|
+
if (idx < 0) continue;
|
|
137012
|
+
const prop = d.slice(0, idx).trim().toLowerCase();
|
|
137013
|
+
const val = d.slice(idx + 1).trim();
|
|
137014
|
+
if (prop === "box-shadow") box = val;
|
|
137015
|
+
else if (prop === "filter") filter = val;
|
|
137016
|
+
else if (prop === "-webkit-filter") wfilter = val;
|
|
137017
|
+
else rest.push([prop, val]);
|
|
137018
|
+
}
|
|
137019
|
+
if (box) {
|
|
137020
|
+
const ds = boxShadowToDropShadow(box);
|
|
137021
|
+
if (ds) {
|
|
137022
|
+
filter = filter ? `${filter} ${ds}` : ds;
|
|
137023
|
+
wfilter = wfilter ? `${wfilter} ${ds}` : ds;
|
|
137024
|
+
}
|
|
137025
|
+
}
|
|
137026
|
+
const out = [...rest];
|
|
137027
|
+
if (filter) out.push(["filter", filter]);
|
|
137028
|
+
if (wfilter) out.push(["-webkit-filter", wfilter]);
|
|
137029
|
+
return out.map(([k, v]) => `${k}:${v}`).join(";");
|
|
137030
|
+
}
|
|
137031
|
+
function rewriteCssBlock(css) {
|
|
137032
|
+
return css.replace(/([^{}]+)\{([^}]*)\}/g, (_m, sel, body) => `${sel}{${rewriteDeclList(body)}}`);
|
|
137033
|
+
}
|
|
137034
|
+
function rewriteSvgBoxShadowToDropShadow(svgText) {
|
|
137035
|
+
svgText = svgText.replace(
|
|
137036
|
+
/<style[^>]*>([\s\S]*?)<\/style>/gi,
|
|
137037
|
+
(m, css) => m.replace(css, rewriteCssBlock(css))
|
|
137038
|
+
);
|
|
137039
|
+
svgText = svgText.replace(
|
|
137040
|
+
/style=(['"])([\s\S]*?)\1/gi,
|
|
137041
|
+
(m, q, body) => `style=${q}${rewriteDeclList(body)}${q}`
|
|
137042
|
+
);
|
|
137043
|
+
return svgText;
|
|
137044
|
+
}
|
|
137045
|
+
function maybeConvertBoxShadowForSafari(url) {
|
|
137046
|
+
if (!isSafari() || !isSvgDataURL(url)) return url;
|
|
137047
|
+
try {
|
|
137048
|
+
const svg = decodeSvgFromDataURL(url);
|
|
137049
|
+
const fixed = rewriteSvgBoxShadowToDropShadow(svg);
|
|
137050
|
+
return encodeSvgToDataURL(fixed);
|
|
137051
|
+
} catch {
|
|
137052
|
+
return url;
|
|
137053
|
+
}
|
|
137054
|
+
}
|
|
137055
|
+
async function toCanvas(url, options) {
|
|
137056
|
+
let { width: optW, height: optH, scale = 1, dpr = 1, meta = {} } = options;
|
|
137057
|
+
url = maybeConvertBoxShadowForSafari(url);
|
|
137058
|
+
const img = new Image();
|
|
137059
|
+
img.loading = "eager";
|
|
137060
|
+
img.decoding = "sync";
|
|
137061
|
+
img.crossOrigin = "anonymous";
|
|
137062
|
+
img.src = url;
|
|
137063
|
+
await img.decode();
|
|
137064
|
+
const natW = img.naturalWidth;
|
|
137065
|
+
const natH = img.naturalHeight;
|
|
137066
|
+
const refW = Number.isFinite(meta.w0) ? meta.w0 : natW;
|
|
137067
|
+
const refH = Number.isFinite(meta.h0) ? meta.h0 : natH;
|
|
137068
|
+
let outW, outH;
|
|
137069
|
+
const hasW = Number.isFinite(optW);
|
|
137070
|
+
const hasH = Number.isFinite(optH);
|
|
137071
|
+
if (hasW && hasH) {
|
|
137072
|
+
outW = Math.max(1, optW);
|
|
137073
|
+
outH = Math.max(1, optH);
|
|
137074
|
+
} else if (hasW) {
|
|
137075
|
+
const k = optW / Math.max(1, refW);
|
|
137076
|
+
outW = optW;
|
|
137077
|
+
outH = Math.round(refH * k);
|
|
137078
|
+
} else if (hasH) {
|
|
137079
|
+
const k = optH / Math.max(1, refH);
|
|
137080
|
+
outH = optH;
|
|
137081
|
+
outW = Math.round(refW * k);
|
|
137082
|
+
} else {
|
|
137083
|
+
outW = natW;
|
|
137084
|
+
outH = natH;
|
|
137085
|
+
}
|
|
137086
|
+
outW = Math.round(outW * scale);
|
|
137087
|
+
outH = Math.round(outH * scale);
|
|
137088
|
+
const canvas = document.createElement("canvas");
|
|
137089
|
+
canvas.width = Math.ceil(outW * dpr);
|
|
137090
|
+
canvas.height = Math.ceil(outH * dpr);
|
|
137091
|
+
canvas.style.width = `${outW}px`;
|
|
137092
|
+
canvas.style.height = `${outH}px`;
|
|
137093
|
+
const ctx = canvas.getContext("2d");
|
|
137094
|
+
if (dpr !== 1) ctx.scale(dpr, dpr);
|
|
137095
|
+
ctx.drawImage(img, 0, 0, outW, outH);
|
|
137096
|
+
return canvas;
|
|
137097
|
+
}
|
|
137098
|
+
|
|
137099
|
+
// src/modules/rasterize.js
|
|
137100
|
+
async function rasterize(url, options) {
|
|
137101
|
+
const canvas = await toCanvas(url, options);
|
|
137102
|
+
const finalCanvas = options.backgroundColor ? createBackground(canvas, options.backgroundColor) : canvas;
|
|
137103
|
+
const img = new Image();
|
|
137104
|
+
img.src = finalCanvas.toDataURL(`image/${options.format}`, options.quality);
|
|
137105
|
+
await img.decode();
|
|
137106
|
+
img.style.width = `${finalCanvas.width / options.dpr}px`;
|
|
137107
|
+
img.style.height = `${finalCanvas.height / options.dpr}px`;
|
|
137108
|
+
return img;
|
|
137109
|
+
}
|
|
137110
|
+
|
|
137111
|
+
// src/exporters/toImg.js
|
|
137112
|
+
async function toImg(url, options) {
|
|
137113
|
+
const { scale = 1, width, height, meta = {} } = options;
|
|
137114
|
+
const hasW = Number.isFinite(width);
|
|
137115
|
+
const hasH = Number.isFinite(height);
|
|
137116
|
+
const wantsScale = Number.isFinite(scale) && scale !== 1 || hasW || hasH;
|
|
137117
|
+
if (isSafari() && wantsScale) {
|
|
137118
|
+
const pngUrl = await rasterize(url, { ...options, format: "png", quality: 1, meta });
|
|
137119
|
+
return pngUrl;
|
|
137120
|
+
}
|
|
137121
|
+
const img = new Image();
|
|
137122
|
+
img.decoding = "sync";
|
|
137123
|
+
img.loading = "eager";
|
|
137124
|
+
img.src = url;
|
|
137125
|
+
await img.decode();
|
|
137126
|
+
if (hasW && hasH) {
|
|
137127
|
+
img.style.width = `${width}px`;
|
|
137128
|
+
img.style.height = `${height}px`;
|
|
137129
|
+
} else if (hasW) {
|
|
137130
|
+
const refW = Number.isFinite(meta.w0) ? meta.w0 : img.naturalWidth;
|
|
137131
|
+
const refH = Number.isFinite(meta.h0) ? meta.h0 : img.naturalHeight;
|
|
137132
|
+
const k = width / Math.max(1, refW);
|
|
137133
|
+
img.style.width = `${width}px`;
|
|
137134
|
+
img.style.height = `${Math.round(refH * k)}px`;
|
|
137135
|
+
} else if (hasH) {
|
|
137136
|
+
const refW = Number.isFinite(meta.w0) ? meta.w0 : img.naturalWidth;
|
|
137137
|
+
const refH = Number.isFinite(meta.h0) ? meta.h0 : img.naturalHeight;
|
|
137138
|
+
const k = height / Math.max(1, refH);
|
|
137139
|
+
img.style.height = `${height}px`;
|
|
137140
|
+
img.style.width = `${Math.round(refW * k)}px`;
|
|
137141
|
+
} else {
|
|
137142
|
+
const cssW = Math.round(img.naturalWidth * scale);
|
|
137143
|
+
const cssH = Math.round(img.naturalHeight * scale);
|
|
137144
|
+
img.style.width = `${cssW}px`;
|
|
137145
|
+
img.style.height = `${cssH}px`;
|
|
137146
|
+
if (typeof url === "string" && url.startsWith("data:image/svg+xml")) {
|
|
137147
|
+
try {
|
|
137148
|
+
const decoded = decodeURIComponent(url.split(",")[1]);
|
|
137149
|
+
const patched = decoded.replace(/width="[^"]*"/, `width="${cssW}"`).replace(/height="[^"]*"/, `height="${cssH}"`);
|
|
137150
|
+
url = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(patched)}`;
|
|
137151
|
+
img.src = url;
|
|
137152
|
+
} catch {
|
|
137153
|
+
}
|
|
137154
|
+
}
|
|
137155
|
+
}
|
|
137156
|
+
return img;
|
|
137157
|
+
}
|
|
137158
|
+
|
|
137159
|
+
// src/exporters/toBlob.js
|
|
137160
|
+
async function toBlob(url, options) {
|
|
137161
|
+
const type = options.type;
|
|
137162
|
+
if (type === "svg") {
|
|
137163
|
+
const svgText = decodeURIComponent(url.split(",")[1]);
|
|
137164
|
+
return new Blob([svgText], { type: "image/svg+xml" });
|
|
137165
|
+
}
|
|
137166
|
+
const canvas = await toCanvas(url, options);
|
|
137167
|
+
const finalCanvas = options.backgroundColor ? createBackground(canvas, options.backgroundColor) : canvas;
|
|
137168
|
+
return new Promise(
|
|
137169
|
+
(resolve) => finalCanvas.toBlob(
|
|
137170
|
+
(blob) => resolve(blob),
|
|
137171
|
+
`image/${type}`,
|
|
137172
|
+
options.quality
|
|
137173
|
+
)
|
|
137174
|
+
);
|
|
137175
|
+
}
|
|
137176
|
+
|
|
137177
|
+
// src/exporters/download.js
|
|
137178
|
+
async function download(url, options) {
|
|
137179
|
+
options.dpr = 1;
|
|
137180
|
+
if (options.format === "svg") {
|
|
137181
|
+
const blob = await toBlob(url, { ...options, type: "svg" });
|
|
137182
|
+
const objectURL = URL.createObjectURL(blob);
|
|
137183
|
+
const a2 = document.createElement("a");
|
|
137184
|
+
a2.href = objectURL;
|
|
137185
|
+
a2.download = options.filename;
|
|
137186
|
+
a2.click();
|
|
137187
|
+
URL.revokeObjectURL(objectURL);
|
|
137188
|
+
return;
|
|
137189
|
+
}
|
|
137190
|
+
const canvas = await toCanvas(url, options);
|
|
137191
|
+
const finalCanvas = options.backgroundColor ? createBackground(canvas, options.backgroundColor) : canvas;
|
|
137192
|
+
const a = document.createElement("a");
|
|
137193
|
+
a.href = finalCanvas.toDataURL(`image/${options.format}`, options.quality);
|
|
137194
|
+
a.download = options.filename;
|
|
137195
|
+
a.click();
|
|
137196
|
+
}
|
|
137197
|
+
|
|
137198
|
+
// src/api/snapdom.js
|
|
137199
|
+
var INTERNAL_TOKEN = Symbol("snapdom.internal");
|
|
137200
|
+
var _safariWarmup = false;
|
|
137201
|
+
async function snapdom(element, userOptions) {
|
|
137202
|
+
if (!element) throw new Error("Element cannot be null or undefined");
|
|
137203
|
+
const context = createContext(userOptions);
|
|
137204
|
+
if (isSafari() && (context.embedFonts === true || hasBackgroundOrMask(element))) {
|
|
137205
|
+
for (let i = 0; i < 3; i++) {
|
|
137206
|
+
try {
|
|
137207
|
+
await safariWarmup(element, userOptions);
|
|
137208
|
+
console.log("Iteraci\xF3n n\xFAmero:", i);
|
|
137209
|
+
_safariWarmup = false;
|
|
137210
|
+
} catch {
|
|
137211
|
+
}
|
|
137212
|
+
}
|
|
137213
|
+
}
|
|
137214
|
+
if (context.iconFonts && context.iconFonts.length > 0) extendIconFonts(context.iconFonts);
|
|
137215
|
+
if (!context.snap) {
|
|
137216
|
+
context.snap = {
|
|
137217
|
+
toPng: (el, opts) => snapdom.toPng(el, opts),
|
|
137218
|
+
toSvg: (el, opts) => snapdom.toSvg(el, opts)
|
|
137219
|
+
};
|
|
137220
|
+
}
|
|
137221
|
+
return snapdom.capture(element, context, INTERNAL_TOKEN);
|
|
137222
|
+
}
|
|
137223
|
+
snapdom.capture = async (el, context, _token) => {
|
|
137224
|
+
if (_token !== INTERNAL_TOKEN) throw new Error("[snapdom.capture] is internal. Use snapdom(...) instead.");
|
|
137225
|
+
const url = await captureDOM(el, context);
|
|
137226
|
+
const ensureContext = (opts) => ({ ...context, ...opts || {} });
|
|
137227
|
+
const withFormat = (format) => (opts) => {
|
|
137228
|
+
const next = ensureContext({ ...opts || {}, format });
|
|
137229
|
+
const wantsJpeg = format === "jpeg" || format === "jpg";
|
|
137230
|
+
const noBg = next.backgroundColor == null || next.backgroundColor === "transparent";
|
|
137231
|
+
if (wantsJpeg && noBg) {
|
|
137232
|
+
next.backgroundColor = "#ffffff";
|
|
137233
|
+
}
|
|
137234
|
+
return rasterize(url, next);
|
|
137235
|
+
};
|
|
137236
|
+
return {
|
|
137237
|
+
url,
|
|
137238
|
+
toRaw: () => url,
|
|
137239
|
+
toImg: (opts) => toImg(url, ensureContext(opts)),
|
|
137240
|
+
toSvg: (opts) => toImg(url, ensureContext(opts)),
|
|
137241
|
+
toCanvas: (opts) => toCanvas(url, ensureContext(opts)),
|
|
137242
|
+
toBlob: (opts) => toBlob(url, ensureContext(opts)),
|
|
137243
|
+
toPng: withFormat("png"),
|
|
137244
|
+
toJpg: withFormat("jpeg"),
|
|
137245
|
+
toWebp: withFormat("webp"),
|
|
137246
|
+
download: (opts) => download(url, ensureContext(opts))
|
|
137247
|
+
};
|
|
137248
|
+
};
|
|
137249
|
+
snapdom.toRaw = (el, options) => snapdom(el, options).then((result) => result.toRaw());
|
|
137250
|
+
snapdom.toImg = (el, options) => snapdom(el, options).then((result) => result.toImg());
|
|
137251
|
+
snapdom.toSvg = (el, options) => snapdom(el, options).then((result) => result.toSvg());
|
|
137252
|
+
snapdom.toCanvas = (el, options) => snapdom(el, options).then((result) => result.toCanvas());
|
|
137253
|
+
snapdom.toBlob = (el, options) => snapdom(el, options).then((result) => result.toBlob());
|
|
137254
|
+
snapdom.toPng = (el, options) => snapdom(el, { ...options, format: "png" }).then((result) => result.toPng());
|
|
137255
|
+
snapdom.toJpg = (el, options) => snapdom(el, { ...options, format: "jpeg" }).then((result) => result.toJpg());
|
|
137256
|
+
snapdom.toWebp = (el, options) => snapdom(el, { ...options, format: "webp" }).then((result) => result.toWebp());
|
|
137257
|
+
snapdom.download = (el, options) => snapdom(el, options).then((result) => result.download());
|
|
137258
|
+
async function safariWarmup(element, baseOptions) {
|
|
137259
|
+
if (_safariWarmup) return;
|
|
137260
|
+
const preflight = {
|
|
137261
|
+
...baseOptions,
|
|
137262
|
+
fast: true,
|
|
137263
|
+
embedFonts: true,
|
|
137264
|
+
scale: 0.2
|
|
137265
|
+
};
|
|
137266
|
+
let url;
|
|
137267
|
+
try {
|
|
137268
|
+
url = await captureDOM(element, preflight);
|
|
137269
|
+
} catch {
|
|
137270
|
+
return;
|
|
137271
|
+
}
|
|
137272
|
+
await new Promise((resolve) => {
|
|
137273
|
+
const img = new Image();
|
|
137274
|
+
img.decoding = "sync";
|
|
137275
|
+
img.loading = "eager";
|
|
137276
|
+
img.style.position = "fixed";
|
|
137277
|
+
img.style.left = 0;
|
|
137278
|
+
img.style.top = 0;
|
|
137279
|
+
img.style.width = "10px";
|
|
137280
|
+
img.style.height = "10px";
|
|
137281
|
+
img.style.opacity = "0.01";
|
|
137282
|
+
img.style.transform = "translateZ(10px)";
|
|
137283
|
+
img.style.willChange = "transform,opacity;";
|
|
137284
|
+
img.src = url;
|
|
137285
|
+
const cleanup = async () => {
|
|
137286
|
+
await new Promise((r) => setTimeout(r, 100));
|
|
137287
|
+
if (img && img.parentNode) img.parentNode.removeChild(img);
|
|
137288
|
+
_safariWarmup = true;
|
|
137289
|
+
resolve();
|
|
137290
|
+
};
|
|
137291
|
+
document.body.appendChild(img);
|
|
137292
|
+
cleanup();
|
|
137293
|
+
});
|
|
137294
|
+
}
|
|
137295
|
+
function hasBackgroundOrMask(el) {
|
|
137296
|
+
const walker = document.createTreeWalker(el, NodeFilter.SHOW_ELEMENT);
|
|
137297
|
+
while (walker.nextNode()) {
|
|
137298
|
+
const node = (
|
|
137299
|
+
/** @type {Element} */
|
|
137300
|
+
walker.currentNode
|
|
137301
|
+
);
|
|
137302
|
+
const cs = getComputedStyle(node);
|
|
137303
|
+
const bg = cs.backgroundImage && cs.backgroundImage !== "none";
|
|
137304
|
+
const mask = cs.maskImage && cs.maskImage !== "none" || cs.webkitMaskImage && cs.webkitMaskImage !== "none";
|
|
137305
|
+
if (bg || mask) return true;
|
|
137306
|
+
}
|
|
137307
|
+
return false;
|
|
137308
|
+
}
|
|
137309
|
+
|
|
137310
|
+
// src/api/preCache.js
|
|
137311
|
+
async function preCache(root = document, options = {}) {
|
|
137312
|
+
const {
|
|
137313
|
+
embedFonts = true,
|
|
137314
|
+
useProxy = ""
|
|
137315
|
+
} = options;
|
|
137316
|
+
const cacheMode = options.cache ?? options.cacheOpt ?? "full";
|
|
137317
|
+
applyCachePolicy(cacheMode);
|
|
137318
|
+
try {
|
|
137319
|
+
await document.fonts?.ready;
|
|
137320
|
+
} catch {
|
|
137321
|
+
}
|
|
137322
|
+
try {
|
|
137323
|
+
precacheCommonTags();
|
|
137324
|
+
} catch {
|
|
137325
|
+
}
|
|
137326
|
+
cache.session = cache.session || {};
|
|
137327
|
+
if (!cache.session.styleCache) {
|
|
137328
|
+
cache.session.styleCache = /* @__PURE__ */ new WeakMap();
|
|
137329
|
+
}
|
|
137330
|
+
cache.image = cache.image || /* @__PURE__ */ new Map();
|
|
137331
|
+
try {
|
|
137332
|
+
await inlineBackgroundImages(
|
|
137333
|
+
root,
|
|
137334
|
+
/* mirror */
|
|
137335
|
+
void 0,
|
|
137336
|
+
cache.session.styleCache,
|
|
137337
|
+
{ useProxy }
|
|
137338
|
+
);
|
|
137339
|
+
} catch {
|
|
137340
|
+
}
|
|
137341
|
+
let imgEls = [], allEls = [];
|
|
137342
|
+
try {
|
|
137343
|
+
if (root?.querySelectorAll) {
|
|
137344
|
+
imgEls = Array.from(root.querySelectorAll("img[src]"));
|
|
137345
|
+
allEls = Array.from(root.querySelectorAll("*"));
|
|
137346
|
+
}
|
|
137347
|
+
} catch {
|
|
137348
|
+
}
|
|
137349
|
+
const promises = [];
|
|
137350
|
+
for (const img of imgEls) {
|
|
137351
|
+
const src = img?.currentSrc || img?.src;
|
|
137352
|
+
if (!src) continue;
|
|
137353
|
+
if (!cache.image.has(src)) {
|
|
137354
|
+
const p = Promise.resolve().then(async () => {
|
|
137355
|
+
const res = await snapFetch(src, { as: "dataURL", useProxy });
|
|
137356
|
+
if (res?.ok && typeof res.data === "string") {
|
|
137357
|
+
cache.image.set(src, res.data);
|
|
137358
|
+
}
|
|
137359
|
+
}).catch(() => {
|
|
137360
|
+
});
|
|
137361
|
+
promises.push(p);
|
|
137362
|
+
}
|
|
137363
|
+
}
|
|
137364
|
+
for (const el of allEls) {
|
|
137365
|
+
let bg = "";
|
|
137366
|
+
try {
|
|
137367
|
+
bg = getStyle(el).backgroundImage;
|
|
137368
|
+
} catch {
|
|
137369
|
+
}
|
|
137370
|
+
if (bg && bg !== "none") {
|
|
137371
|
+
const parts = splitBackgroundImage(bg);
|
|
137372
|
+
for (const entry of parts) {
|
|
137373
|
+
if (entry.startsWith("url(")) {
|
|
137374
|
+
const p = Promise.resolve().then(() => inlineSingleBackgroundEntry(entry, { ...options, useProxy })).catch(() => {
|
|
137375
|
+
});
|
|
137376
|
+
promises.push(p);
|
|
137377
|
+
}
|
|
137378
|
+
}
|
|
137379
|
+
}
|
|
137380
|
+
}
|
|
137381
|
+
if (embedFonts) {
|
|
137382
|
+
try {
|
|
137383
|
+
const required = collectUsedFontVariants(root);
|
|
137384
|
+
const usedCodepoints = collectUsedCodepoints(root);
|
|
137385
|
+
const safari = typeof isSafari === "function" ? isSafari() : !!isSafari;
|
|
137386
|
+
if (safari) {
|
|
137387
|
+
const families = new Set(
|
|
137388
|
+
Array.from(required).map((k) => String(k).split("__")[0]).filter(Boolean)
|
|
137389
|
+
);
|
|
137390
|
+
await ensureFontsReady(families, 3);
|
|
137391
|
+
}
|
|
137392
|
+
await embedCustomFonts({
|
|
137393
|
+
required,
|
|
137394
|
+
usedCodepoints,
|
|
137395
|
+
exclude: options.excludeFonts,
|
|
137396
|
+
localFonts: options.localFonts,
|
|
137397
|
+
useProxy: options.useProxy ?? useProxy
|
|
137398
|
+
});
|
|
137399
|
+
} catch {
|
|
137400
|
+
}
|
|
137401
|
+
}
|
|
137402
|
+
await Promise.allSettled(promises);
|
|
137403
|
+
}
|
|
137404
|
+
|
|
137405
|
+
const snapdom$1 = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
|
|
137406
|
+
__proto__: null,
|
|
137407
|
+
preCache,
|
|
137408
|
+
snapdom
|
|
137409
|
+
}, Symbol.toStringTag, { value: 'Module' }));
|
|
137410
|
+
|
|
133198
137411
|
exports.ActionSheet = ActionSheet;
|
|
133199
137412
|
exports.Affix = Affix;
|
|
133200
137413
|
exports.Alert = Alert;
|
|
@@ -133228,7 +137441,6 @@
|
|
|
133228
137441
|
exports.Form = Form;
|
|
133229
137442
|
exports.FormItem = FormItem;
|
|
133230
137443
|
exports.Fragment = Fragment;
|
|
133231
|
-
exports.HTMLToImage = HTMLToImage;
|
|
133232
137444
|
exports.Icon = Icon;
|
|
133233
137445
|
exports.IconManager = IconManager;
|
|
133234
137446
|
exports.Image = Image$2;
|
|
@@ -133273,7 +137485,6 @@
|
|
|
133273
137485
|
exports.MForm = MForm;
|
|
133274
137486
|
exports.MFormItem = MFormItem;
|
|
133275
137487
|
exports.MFragment = MFragment;
|
|
133276
|
-
exports.MHTMLToImage = MHTMLToImage;
|
|
133277
137488
|
exports.MIcon = MIcon;
|
|
133278
137489
|
exports.MImage = MImage;
|
|
133279
137490
|
exports.MImageCrop = MImageCrop;
|
|
@@ -133307,6 +137518,7 @@
|
|
|
133307
137518
|
exports.MScroller = MScroller;
|
|
133308
137519
|
exports.MSelect = MSelect;
|
|
133309
137520
|
exports.MSlider = MSlider;
|
|
137521
|
+
exports.MSnapshot = MSnapshot;
|
|
133310
137522
|
exports.MSortList = MSortList;
|
|
133311
137523
|
exports.MSpin = MSpin;
|
|
133312
137524
|
exports.MSteps = MSteps;
|
|
@@ -133360,6 +137572,7 @@
|
|
|
133360
137572
|
exports.ScrollerWheel = ScrollerWheel;
|
|
133361
137573
|
exports.Select = Select;
|
|
133362
137574
|
exports.Slider = Slider;
|
|
137575
|
+
exports.Snapshot = Snapshot;
|
|
133363
137576
|
exports.SortList = SortList;
|
|
133364
137577
|
exports.Spin = Spin;
|
|
133365
137578
|
exports.Steps = Steps;
|