@unicom-cloud/utils 0.1.13 → 0.1.15
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/content-disposition/index.js +34 -31
- package/contentDisposition.js +7 -5
- package/file/saveAs.js +13 -14
- package/mock/MockWebSocket.js +2 -2
- package/package.json +1 -1
- package/snapdom/src/api/snapdom.js +77 -72
- package/snapdom/src/core/capture.js +42 -42
- package/snapdom/src/core/clone.js +1 -3
- package/snapdom/src/modules/background.js +23 -17
- package/snapdom/src/modules/fonts.js +19 -19
- package/snapdom/src/modules/pseudo.js +69 -77
- package/types/file/saveAs.d.ts +1 -1
|
@@ -1,56 +1,59 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
import "../is/index.js";
|
|
2
|
+
import m from "lodash/isString";
|
|
3
|
+
function p(t) {
|
|
4
|
+
if (!(m(t) && t.trim())) return null;
|
|
3
5
|
const e = {
|
|
4
6
|
type: "",
|
|
5
|
-
parameters:
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
for (
|
|
12
|
-
const
|
|
13
|
-
if (
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
7
|
+
parameters: /* @__PURE__ */ Object.create(null)
|
|
8
|
+
// 避免原型污染
|
|
9
|
+
}, a = t.match(/^\s*([^;\s]+)\s*/);
|
|
10
|
+
m(a?.[1]) && (e.type = a[1].toLowerCase());
|
|
11
|
+
const s = /;\s*([^=\s]+)\s*=\s*(?:"([^"]*)"|([^;\s]*))/g;
|
|
12
|
+
let o;
|
|
13
|
+
for (; (o = s.exec(t)) !== null; ) {
|
|
14
|
+
const r = o[1].trim().toLowerCase(), n = o[2] || o[3] || "";
|
|
15
|
+
if (r.endsWith("*"))
|
|
16
|
+
try {
|
|
17
|
+
const c = f(n), i = r.slice(0, -1);
|
|
18
|
+
e.parameters[i] || (e.parameters[i] = c), e.parameters[r] = c;
|
|
19
|
+
} catch (c) {
|
|
20
|
+
console.debug(`RFC5987解码失败: ${n}`, c), e.parameters[r] = n;
|
|
21
|
+
}
|
|
22
|
+
else !e.parameters[r] && !e.parameters[`${r}*`] && (e.parameters[r] = n);
|
|
19
23
|
}
|
|
20
24
|
return e;
|
|
21
25
|
}
|
|
22
|
-
function
|
|
23
|
-
const e = t.match(/^([^']*)'[^']*'(.*)$/);
|
|
26
|
+
function f(t) {
|
|
27
|
+
const e = t.match(/^([^']*)'([^']*)'(.*)$/);
|
|
24
28
|
if (!e) return t;
|
|
25
|
-
const [
|
|
29
|
+
const [a, s, o, r] = e;
|
|
26
30
|
try {
|
|
27
|
-
const n =
|
|
28
|
-
/%([0-9A-Fa-f]{2})/g,
|
|
29
|
-
(i, a) => String.fromCharCode(parseInt(a, 16))
|
|
31
|
+
const n = decodeURIComponent(
|
|
32
|
+
r.replace(/%(?![0-9A-Fa-f]{2})/g, "%25")
|
|
30
33
|
);
|
|
31
|
-
return s &&
|
|
34
|
+
return s && !/^utf-?8$/i.test(s) && console.warn(`非UTF-8编码暂未转换: ${s}`), n;
|
|
32
35
|
} catch (n) {
|
|
33
|
-
return console.warn(
|
|
36
|
+
return console.warn(`RFC5987解码失败: ${t}`, n), t;
|
|
34
37
|
}
|
|
35
38
|
}
|
|
36
|
-
function
|
|
39
|
+
function l(t) {
|
|
37
40
|
let e = t?.["content-disposition"];
|
|
38
41
|
if (e)
|
|
39
|
-
return
|
|
42
|
+
return p(e);
|
|
40
43
|
}
|
|
41
44
|
function d(t) {
|
|
42
|
-
const e =
|
|
45
|
+
const e = l(t);
|
|
43
46
|
if (e)
|
|
44
47
|
return e.parameters;
|
|
45
48
|
}
|
|
46
|
-
function
|
|
49
|
+
function C(t) {
|
|
47
50
|
const e = d(t);
|
|
48
51
|
if (e)
|
|
49
52
|
return e["filename*"] || e.filename;
|
|
50
53
|
}
|
|
51
54
|
export {
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
+
p as default,
|
|
56
|
+
l as getContentDispositionFromHeader,
|
|
57
|
+
C as getContentDispositionParametersFilenameFromHeader,
|
|
55
58
|
d as getContentDispositionParametersFromHeader
|
|
56
59
|
};
|
package/contentDisposition.js
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
|
-
import
|
|
1
|
+
import "./is/index.js";
|
|
2
|
+
import "lodash/isString";
|
|
3
|
+
import { default as i, getContentDispositionFromHeader as n, getContentDispositionParametersFilenameFromHeader as a, getContentDispositionParametersFromHeader as m } from "./content-disposition/index.js";
|
|
2
4
|
export {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
5
|
+
i as default,
|
|
6
|
+
n as getContentDispositionFromHeader,
|
|
7
|
+
a as getContentDispositionParametersFilenameFromHeader,
|
|
8
|
+
m as getContentDispositionParametersFromHeader
|
|
7
9
|
};
|
package/file/saveAs.js
CHANGED
|
@@ -1,34 +1,33 @@
|
|
|
1
1
|
import { fileToURL as r } from "./fileToURL.js";
|
|
2
|
-
function o(
|
|
2
|
+
function o(t) {
|
|
3
3
|
return new XMLHttpRequest();
|
|
4
4
|
}
|
|
5
|
-
function s(
|
|
5
|
+
function s(t, n) {
|
|
6
6
|
const e = o();
|
|
7
|
-
e.open("GET",
|
|
8
|
-
c(e.response,
|
|
7
|
+
e.open("GET", t), e.responseType = "blob", e.onload = () => {
|
|
8
|
+
c(e.response, n);
|
|
9
9
|
}, e.onerror = () => {
|
|
10
10
|
console.error("无法下载文件");
|
|
11
11
|
}, e.send();
|
|
12
12
|
}
|
|
13
|
-
function a(
|
|
14
|
-
const
|
|
15
|
-
|
|
13
|
+
function a(t) {
|
|
14
|
+
const n = o();
|
|
15
|
+
n.open("HEAD", t, !1);
|
|
16
16
|
try {
|
|
17
|
-
|
|
17
|
+
n.send();
|
|
18
18
|
} catch (e) {
|
|
19
19
|
console.error(e);
|
|
20
20
|
}
|
|
21
|
-
return
|
|
21
|
+
return n.status >= 200 && n.status <= 299;
|
|
22
22
|
}
|
|
23
|
-
async function
|
|
23
|
+
async function c(t, n) {
|
|
24
24
|
const e = document.createElementNS("http://www.w3.org/1999/xhtml", "a");
|
|
25
|
-
e.rel = "noopener", typeof
|
|
25
|
+
e.rel = "noopener", typeof t == "string" && (e.href = t, e.origin === location.origin || (a(t) ? s(t, n) : e.target = "_blank")), t instanceof File ? (e.href = await r(t), n ||= t.name) : t instanceof Blob && (e.href = URL.createObjectURL(t), setTimeout(() => {
|
|
26
|
+
URL.revokeObjectURL(e.href);
|
|
27
|
+
}, 4e4)), n ||= "download", e.download = n, setTimeout(() => {
|
|
26
28
|
e.dispatchEvent(new MouseEvent("click"));
|
|
27
29
|
}, 0);
|
|
28
30
|
}
|
|
29
|
-
function c(n, t) {
|
|
30
|
-
i(n, t);
|
|
31
|
-
}
|
|
32
31
|
export {
|
|
33
32
|
c as default,
|
|
34
33
|
c as saveAs
|
package/mock/MockWebSocket.js
CHANGED
|
@@ -19,7 +19,7 @@ class l extends EventTarget {
|
|
|
19
19
|
this.dispatchEvent(t), this.onopen?.(t), clearTimeout(this.#i);
|
|
20
20
|
},
|
|
21
21
|
this.#t?.openTimeout ?? Math.random() * 27
|
|
22
|
-
), this.#a = setInterval(
|
|
22
|
+
), this.#a = window.setInterval(
|
|
23
23
|
() => {
|
|
24
24
|
this.readyState === n.OPEN && this.#e.length && (this.send(this.#h), this.#s++);
|
|
25
25
|
},
|
|
@@ -44,7 +44,7 @@ class l extends EventTarget {
|
|
|
44
44
|
let t = new CloseEvent("close");
|
|
45
45
|
this.dispatchEvent(t), this.onclose?.(t);
|
|
46
46
|
}
|
|
47
|
-
clearTimeout(this.#i), clearInterval(this.#a), this.#s = 0, this.#e = [];
|
|
47
|
+
clearTimeout(this.#i), window.clearInterval(this.#a), this.#s = 0, this.#e = [];
|
|
48
48
|
} else
|
|
49
49
|
this.#o?.close?.(e, s);
|
|
50
50
|
}
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@unicom-cloud/utils","version":"0.1.
|
|
1
|
+
{"name":"@unicom-cloud/utils","version":"0.1.15","dependencies":{},"peerDependencies":{"lodash":"^4.17.21"},"main":"./index.js","type":"module","types":"types/index.d.ts","publishConfig":{"registry":"https://registry.npmjs.org/","access":"public"}}
|
|
@@ -1,108 +1,113 @@
|
|
|
1
1
|
import { captureDOM as v } from "../core/capture.js";
|
|
2
2
|
import { extendIconFonts as j } from "../modules/iconFonts.js";
|
|
3
|
-
import { isSafari as
|
|
4
|
-
async function
|
|
5
|
-
const
|
|
6
|
-
return
|
|
3
|
+
import { isSafari as x } from "../utils/helpers.js";
|
|
4
|
+
async function R(e, { scale: t = 1 } = {}) {
|
|
5
|
+
const n = new Image();
|
|
6
|
+
return n.src = e, await n.decode(), t !== 1 && (n.style.width = `${n.naturalWidth * t}px`, n.style.height = `${n.naturalHeight * t}px`), n;
|
|
7
7
|
}
|
|
8
|
-
async function
|
|
9
|
-
const
|
|
10
|
-
|
|
11
|
-
const
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
8
|
+
async function h(e, { dpr: t = 1, scale: n = 1 } = {}) {
|
|
9
|
+
const c = new Image();
|
|
10
|
+
c.src = e, c.crossOrigin = "anonymous", c.loading = "eager", c.decoding = "sync";
|
|
11
|
+
const o = x();
|
|
12
|
+
let a = !1;
|
|
13
|
+
if (o && (document.body.appendChild(c), a = !0), await c.decode(), o && await new Promise((w) => setTimeout(w, 100)), c.width === 0 || c.height === 0)
|
|
14
|
+
throw a && c.remove(), new Error("Image failed to load or has no dimensions");
|
|
15
|
+
const s = c.naturalWidth * n, r = c.naturalHeight * n, g = document.createElement("canvas");
|
|
16
|
+
g.width = Math.ceil(s * t), g.height = Math.ceil(r * t), g.style.width = `${s}px`, g.style.height = `${r}px`;
|
|
17
|
+
const d = g.getContext("2d");
|
|
18
|
+
return d.scale(t, t), d.drawImage(c, 0, 0, s, r), a && c.remove(), g;
|
|
15
19
|
}
|
|
16
|
-
async function
|
|
17
|
-
const
|
|
20
|
+
async function y(e, { type: t = "svg", scale: n = 1, backgroundColor: c = "#fff", quality: o } = {}) {
|
|
21
|
+
const a = {
|
|
18
22
|
jpg: "image/jpeg",
|
|
19
23
|
jpeg: "image/jpeg",
|
|
20
24
|
png: "image/png",
|
|
21
25
|
webp: "image/webp"
|
|
22
26
|
}[t] || "image/png";
|
|
23
27
|
if (t === "svg") {
|
|
24
|
-
const
|
|
25
|
-
return new Blob([
|
|
28
|
+
const r = decodeURIComponent(e.split(",")[1]);
|
|
29
|
+
return new Blob([r], { type: "image/svg+xml" });
|
|
26
30
|
}
|
|
27
|
-
const
|
|
28
|
-
|
|
29
|
-
{ dpr: 1, scale:
|
|
30
|
-
|
|
31
|
+
const s = await u(
|
|
32
|
+
e,
|
|
33
|
+
{ dpr: 1, scale: n },
|
|
34
|
+
c
|
|
31
35
|
);
|
|
32
|
-
return new Promise((
|
|
33
|
-
|
|
36
|
+
return new Promise((r) => {
|
|
37
|
+
s.toBlob((g) => r(g), `${a}`, o);
|
|
34
38
|
});
|
|
35
39
|
}
|
|
36
|
-
async function
|
|
37
|
-
const
|
|
38
|
-
if (!
|
|
39
|
-
const
|
|
40
|
-
|
|
41
|
-
const
|
|
42
|
-
return
|
|
40
|
+
async function u(e, { dpr: t = 1, scale: n = 1 }, c) {
|
|
41
|
+
const o = await h(e, { dpr: t, scale: n });
|
|
42
|
+
if (!c) return o;
|
|
43
|
+
const a = document.createElement("canvas");
|
|
44
|
+
a.width = o.width, a.height = o.height;
|
|
45
|
+
const s = a.getContext("2d");
|
|
46
|
+
return s.fillStyle = c, s.fillRect(0, 0, a.width, a.height), s.drawImage(o, 0, 0), a;
|
|
43
47
|
}
|
|
44
|
-
async function
|
|
45
|
-
const
|
|
46
|
-
return
|
|
48
|
+
async function m(e, { dpr: t = 1, scale: n = 1, backgroundColor: c, quality: o }, a = "png") {
|
|
49
|
+
const s = ["jpg", "jpeg", "webp"].includes(a) ? "#fff" : void 0, g = await u(e, { dpr: t, scale: n }, c ?? s), d = new Image();
|
|
50
|
+
return d.src = g.toDataURL(`image/${a}`, o), await d.decode(), d.style.width = `${g.width / t}px`, d.style.height = `${g.height / t}px`, d;
|
|
47
51
|
}
|
|
48
|
-
async function B(
|
|
52
|
+
async function B(e, {
|
|
49
53
|
dpr: t = 1,
|
|
50
|
-
scale:
|
|
51
|
-
backgroundColor:
|
|
52
|
-
format:
|
|
53
|
-
filename:
|
|
54
|
+
scale: n = 1,
|
|
55
|
+
backgroundColor: c,
|
|
56
|
+
format: o = "png",
|
|
57
|
+
filename: a = "snapDOM"
|
|
54
58
|
} = {}) {
|
|
55
|
-
if (
|
|
56
|
-
const
|
|
57
|
-
|
|
59
|
+
if (o === "svg") {
|
|
60
|
+
const b = await y(e), f = URL.createObjectURL(b), l = document.createElement("a");
|
|
61
|
+
l.href = f, l.download = `${a}.svg`, l.click(), URL.revokeObjectURL(f);
|
|
58
62
|
return;
|
|
59
63
|
}
|
|
60
|
-
const
|
|
64
|
+
const s = ["jpg", "jpeg", "webp"].includes(o) ? "#fff" : void 0, g = await u(e, { dpr: t, scale: n }, c ?? s), d = {
|
|
61
65
|
jpg: "image/jpeg",
|
|
62
66
|
jpeg: "image/jpeg",
|
|
63
67
|
png: "image/png",
|
|
64
68
|
webp: "image/webp"
|
|
65
|
-
}[
|
|
66
|
-
|
|
69
|
+
}[o] || "image/png", w = g.toDataURL(d), p = document.createElement("a");
|
|
70
|
+
p.href = w, p.download = `${a}.${o}`, p.click();
|
|
67
71
|
}
|
|
68
|
-
async function i(
|
|
69
|
-
if (t = { scale: 1, ...t }, !
|
|
70
|
-
return t.iconFonts && j(t.iconFonts), await i.capture(
|
|
72
|
+
async function i(e, t = {}) {
|
|
73
|
+
if (t = { scale: 1, ...t }, !e) throw new Error("Element cannot be null or undefined");
|
|
74
|
+
return t.iconFonts && j(t.iconFonts), await i.capture(e, t);
|
|
71
75
|
}
|
|
72
|
-
i.capture = async (
|
|
73
|
-
const
|
|
76
|
+
i.capture = async (e, t = {}) => {
|
|
77
|
+
const n = await v(e, t), c = t.dpr ?? (window.devicePixelRatio || 1), o = t.scale || 1;
|
|
74
78
|
return {
|
|
75
|
-
url:
|
|
79
|
+
url: n,
|
|
76
80
|
options: t,
|
|
77
|
-
toRaw: () =>
|
|
78
|
-
toImg: () =>
|
|
79
|
-
toCanvas: () =>
|
|
80
|
-
toBlob: (
|
|
81
|
-
toPng: (
|
|
82
|
-
toJpg: (
|
|
83
|
-
toWebp: (
|
|
81
|
+
toRaw: () => n,
|
|
82
|
+
toImg: (a = {}) => R(n, { scale: o, ...a }),
|
|
83
|
+
toCanvas: (a = {}) => h(n, { dpr: c, scale: o, ...a }),
|
|
84
|
+
toBlob: (a = {}) => y(n, { scale: o, ...a }),
|
|
85
|
+
toPng: (a = {}) => m(n, { dpr: c, scale: o, ...a }, "png"),
|
|
86
|
+
toJpg: (a = {}) => m(n, { dpr: c, scale: o, ...a }, "jpeg"),
|
|
87
|
+
toWebp: (a = {}) => m(n, { dpr: c, scale: o, ...a }, "webp"),
|
|
84
88
|
download: ({
|
|
85
|
-
format:
|
|
86
|
-
filename:
|
|
87
|
-
backgroundColor:
|
|
88
|
-
|
|
89
|
+
format: a = "png",
|
|
90
|
+
filename: s = "snapDOM",
|
|
91
|
+
backgroundColor: r,
|
|
92
|
+
...g
|
|
93
|
+
} = {}) => B(n, { dpr: c, scale: o, format: a, filename: s, backgroundColor: r, ...g })
|
|
89
94
|
};
|
|
90
95
|
};
|
|
91
|
-
i.toRaw = async (
|
|
92
|
-
i.toImg = async (
|
|
93
|
-
i.toCanvas = async (
|
|
94
|
-
i.toBlob = async (
|
|
95
|
-
i.toPng = async (
|
|
96
|
-
i.toJpg = async (
|
|
97
|
-
i.toWebp = async (
|
|
98
|
-
i.download = async (
|
|
96
|
+
i.toRaw = async (e, t) => (await i.capture(e, t)).toRaw();
|
|
97
|
+
i.toImg = async (e, t) => (await i.capture(e, t)).toImg();
|
|
98
|
+
i.toCanvas = async (e, t) => (await i.capture(e, t)).toCanvas();
|
|
99
|
+
i.toBlob = async (e, t) => (await i.capture(e, t)).toBlob(t);
|
|
100
|
+
i.toPng = async (e, t) => (await i.capture(e, t)).toPng(t);
|
|
101
|
+
i.toJpg = async (e, t) => (await i.capture(e, t)).toJpg(t);
|
|
102
|
+
i.toWebp = async (e, t) => (await i.capture(e, t)).toWebp(t);
|
|
103
|
+
i.download = async (e, t = {}) => {
|
|
99
104
|
const {
|
|
100
|
-
format:
|
|
101
|
-
filename:
|
|
102
|
-
backgroundColor:
|
|
103
|
-
...
|
|
105
|
+
format: n = "png",
|
|
106
|
+
filename: c = "capture",
|
|
107
|
+
backgroundColor: o,
|
|
108
|
+
...a
|
|
104
109
|
} = t;
|
|
105
|
-
return await (await i.capture(
|
|
110
|
+
return await (await i.capture(e, a)).download({ format: n, filename: c, backgroundColor: o });
|
|
106
111
|
};
|
|
107
112
|
export {
|
|
108
113
|
i as snapdom
|
|
@@ -3,83 +3,83 @@ import { inlineBackgroundImages as H } from "../modules/background.js";
|
|
|
3
3
|
import { embedCustomFonts as I } from "../modules/fonts.js";
|
|
4
4
|
import { inlineImages as M } from "../modules/images.js";
|
|
5
5
|
import { collectUsedTagNames as A, generateDedupedBaseCSS as O } from "../utils/cssTools.js";
|
|
6
|
-
import { idle as
|
|
7
|
-
import { prepareClone as
|
|
8
|
-
async function
|
|
9
|
-
if (!
|
|
6
|
+
import { idle as c } from "../utils/helpers.js";
|
|
7
|
+
import { prepareClone as R } from "./prepare.js";
|
|
8
|
+
async function J(l, t = {}) {
|
|
9
|
+
if (!l) throw new Error("Element cannot be null or undefined");
|
|
10
10
|
h.reset();
|
|
11
11
|
const {
|
|
12
|
-
compress:
|
|
13
|
-
embedFonts:
|
|
12
|
+
compress: u = !0,
|
|
13
|
+
embedFonts: b = !1,
|
|
14
14
|
fast: n = !0,
|
|
15
|
-
scale:
|
|
16
|
-
useProxy:
|
|
15
|
+
scale: S = 1,
|
|
16
|
+
useProxy: U = ""
|
|
17
17
|
} = t;
|
|
18
|
-
let
|
|
19
|
-
if ({ clone:
|
|
20
|
-
|
|
18
|
+
let a, y, p = "", m = "", v, x;
|
|
19
|
+
if ({ clone: a, classCSS: y } = await R(
|
|
20
|
+
l,
|
|
21
|
+
u,
|
|
21
22
|
b,
|
|
22
|
-
y,
|
|
23
23
|
t
|
|
24
|
-
), await new Promise((
|
|
25
|
-
|
|
24
|
+
), await new Promise((s) => {
|
|
25
|
+
c(
|
|
26
26
|
async () => {
|
|
27
|
-
await M(
|
|
27
|
+
await M(a, t), s();
|
|
28
28
|
},
|
|
29
29
|
{ fast: n }
|
|
30
30
|
);
|
|
31
|
-
}), await new Promise((
|
|
32
|
-
|
|
31
|
+
}), await new Promise((s) => {
|
|
32
|
+
c(
|
|
33
33
|
async () => {
|
|
34
|
-
await H(
|
|
34
|
+
await H(l, a, t), s();
|
|
35
35
|
},
|
|
36
36
|
{ fast: n }
|
|
37
37
|
);
|
|
38
|
-
}),
|
|
39
|
-
|
|
38
|
+
}), b && await new Promise((s) => {
|
|
39
|
+
c(
|
|
40
40
|
async () => {
|
|
41
|
-
|
|
41
|
+
p = await I(), s();
|
|
42
42
|
},
|
|
43
43
|
{ fast: n }
|
|
44
44
|
);
|
|
45
|
-
}),
|
|
46
|
-
const
|
|
47
|
-
h.baseStyle.has(
|
|
48
|
-
|
|
45
|
+
}), u) {
|
|
46
|
+
const s = A(a).sort(), i = s.join(",");
|
|
47
|
+
h.baseStyle.has(i) ? m = h.baseStyle.get(i) : await new Promise((e) => {
|
|
48
|
+
c(
|
|
49
49
|
() => {
|
|
50
|
-
m = O(
|
|
50
|
+
m = O(s), h.baseStyle.set(i, m), e();
|
|
51
51
|
},
|
|
52
52
|
{ fast: n }
|
|
53
53
|
);
|
|
54
54
|
});
|
|
55
55
|
}
|
|
56
|
-
await new Promise((
|
|
57
|
-
|
|
56
|
+
await new Promise((s) => {
|
|
57
|
+
c(
|
|
58
58
|
() => {
|
|
59
|
-
const
|
|
60
|
-
let e =
|
|
61
|
-
const d = Number.isFinite(t.width),
|
|
62
|
-
if (!
|
|
63
|
-
const g =
|
|
64
|
-
d &&
|
|
59
|
+
const i = l.getBoundingClientRect();
|
|
60
|
+
let e = i.width, r = i.height;
|
|
61
|
+
const d = Number.isFinite(t.width), f = Number.isFinite(t.height), C = typeof S == "number" && S !== 1;
|
|
62
|
+
if (!C) {
|
|
63
|
+
const g = i.width / i.height;
|
|
64
|
+
d && f ? (e = t.width, r = t.height) : d ? (e = t.width, r = e / g) : f && (r = t.height, e = r * g);
|
|
65
|
+
}
|
|
66
|
+
if (e = Math.ceil(e), r = Math.ceil(r), a.setAttribute("xmlns", "http://www.w3.org/1999/xhtml"), a.style.transformOrigin = "top left", !C && (d || f)) {
|
|
67
|
+
const g = i.width, T = i.height, B = e / g, E = r / T, N = a.style.transform || "", z = `scale(${B}, ${E})`;
|
|
68
|
+
a.style.transform = `${z} ${N}`.trim();
|
|
65
69
|
}
|
|
66
|
-
if (e = Math.ceil(e), r = Math.ceil(r), s.setAttribute("xmlns", "http://www.w3.org/1999/xhtml"), s.style.transformOrigin = "top left", !S && (d || u)) {
|
|
67
|
-
const g = a.width, T = a.height, B = e / g, E = r / T, N = s.style.transform || "", z = `scale(${B}, ${E})`;
|
|
68
|
-
s.style.transform = `${z} ${N}`.trim();
|
|
69
|
-
} else S && R() && (s.style.scale = `${f}`);
|
|
70
70
|
const $ = "http://www.w3.org/2000/svg", o = document.createElementNS($, "foreignObject");
|
|
71
71
|
o.setAttribute("width", "100%"), o.setAttribute("height", "100%");
|
|
72
72
|
const F = document.createElement("style");
|
|
73
|
-
F.textContent = m +
|
|
73
|
+
F.textContent = m + p + "svg{overflow:visible;}" + y, o.appendChild(F), o.appendChild(a);
|
|
74
74
|
const P = new XMLSerializer().serializeToString(o);
|
|
75
|
-
|
|
75
|
+
x = `<svg xmlns="${$}" width="${e}" height="${r}" viewBox="0 0 ${e} ${r}">` + P + "</svg>", v = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(x)}`, s();
|
|
76
76
|
},
|
|
77
77
|
{ fast: n }
|
|
78
78
|
);
|
|
79
79
|
});
|
|
80
80
|
const w = document.getElementById("snapdom-sandbox");
|
|
81
|
-
return w && w.style.position === "absolute" && w.remove(),
|
|
81
|
+
return w && w.style.position === "absolute" && w.remove(), v;
|
|
82
82
|
}
|
|
83
83
|
export {
|
|
84
|
-
|
|
84
|
+
J as captureDOM
|
|
85
85
|
};
|
|
@@ -54,9 +54,7 @@ function u(e, n, a = {}, o) {
|
|
|
54
54
|
const t = e.getBoundingClientRect();
|
|
55
55
|
return c.style.width = `${t.width}px`, c.style.height = `${t.height}px`, c;
|
|
56
56
|
}
|
|
57
|
-
if (e instanceof HTMLInputElement)
|
|
58
|
-
return c.value = e.value, c.setAttribute("value", e.value), e.checked !== void 0 && (c.checked = e.checked, e.checked && c.setAttribute("checked", ""), e.indeterminate && (c.indeterminate = e.indeterminate)), c;
|
|
59
|
-
if (e instanceof HTMLSelectElement && (d = e.value), f(e, c, n), e.shadowRoot)
|
|
57
|
+
if (e instanceof HTMLInputElement && (c.value = e.value, c.setAttribute("value", e.value), e.checked !== void 0 && (c.checked = e.checked, e.checked && c.setAttribute("checked", ""), e.indeterminate && (c.indeterminate = e.indeterminate))), e instanceof HTMLSelectElement && (d = e.value), f(e, c, n), e.shadowRoot)
|
|
60
58
|
if (Array.from(e.shadowRoot.querySelectorAll("slot")).length > 0) {
|
|
61
59
|
for (const i of e.shadowRoot.childNodes)
|
|
62
60
|
if (i.nodeType === Node.ELEMENT_NODE && i.tagName === "STYLE") {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { cache as c } from "../core/cache.js";
|
|
2
|
-
import { getStyle as
|
|
3
|
-
async function
|
|
4
|
-
const
|
|
2
|
+
import { getStyle as f, splitBackgroundImage as h, inlineSingleBackgroundEntry as y } from "../utils/helpers.js";
|
|
3
|
+
async function S(d, u, b = {}) {
|
|
4
|
+
const n = [[d, u]], p = [
|
|
5
5
|
"background-image",
|
|
6
6
|
"mask",
|
|
7
7
|
"mask-image",
|
|
@@ -9,26 +9,32 @@ async function w(u, d, k = {}) {
|
|
|
9
9
|
"mask-source",
|
|
10
10
|
"mask-box-image-source",
|
|
11
11
|
"mask-border-source",
|
|
12
|
-
"-webkit-mask-box-image-source"
|
|
12
|
+
"-webkit-mask-box-image-source",
|
|
13
|
+
"border-image",
|
|
14
|
+
"border-image-source",
|
|
15
|
+
"border-image-slice",
|
|
16
|
+
"border-image-width",
|
|
17
|
+
"border-image-outset",
|
|
18
|
+
"border-image-repeat"
|
|
13
19
|
];
|
|
14
|
-
for (;
|
|
15
|
-
const [
|
|
16
|
-
c.preStyle.has(
|
|
20
|
+
for (; n.length; ) {
|
|
21
|
+
const [r, i] = n.shift(), s = c.preStyle.get(r) || f(r);
|
|
22
|
+
c.preStyle.has(r) || c.preStyle.set(r, s);
|
|
17
23
|
for (const e of p) {
|
|
18
|
-
const
|
|
19
|
-
if (!
|
|
20
|
-
const
|
|
21
|
-
|
|
24
|
+
const a = s.getPropertyValue(e);
|
|
25
|
+
if (!a || a === "none") continue;
|
|
26
|
+
const k = h(a), g = await Promise.all(
|
|
27
|
+
k.map((o) => y(o, b))
|
|
22
28
|
);
|
|
23
|
-
g.some((
|
|
29
|
+
g.some((o) => o && o !== "none" && !/^url\(undefined/.test(o)) && i.style.setProperty(e, g.join(", "));
|
|
24
30
|
}
|
|
25
|
-
const
|
|
26
|
-
|
|
27
|
-
const l = Array.from(
|
|
31
|
+
const t = s.getPropertyValue("background-color");
|
|
32
|
+
t && t !== "transparent" && t !== "rgba(0, 0, 0, 0)" && (i.style.backgroundColor = t);
|
|
33
|
+
const l = Array.from(r.children), m = Array.from(i.children);
|
|
28
34
|
for (let e = 0; e < Math.min(l.length, m.length); e++)
|
|
29
|
-
|
|
35
|
+
n.push([l[e], m[e]]);
|
|
30
36
|
}
|
|
31
37
|
}
|
|
32
38
|
export {
|
|
33
|
-
|
|
39
|
+
S as inlineBackgroundImages
|
|
34
40
|
};
|
|
@@ -1,28 +1,28 @@
|
|
|
1
1
|
import { cache as o } from "../core/cache.js";
|
|
2
2
|
import { isIconFont as y } from "./iconFonts.js";
|
|
3
3
|
import { extractURL as L } from "../utils/helpers.js";
|
|
4
|
-
async function E(
|
|
4
|
+
async function E(m, i, a, p = 32, u = "#000") {
|
|
5
5
|
i = i.replace(/^['"]+|['"]+$/g, "");
|
|
6
6
|
const t = window.devicePixelRatio || 1, s = document.createElement("canvas").getContext("2d");
|
|
7
7
|
s.font = a ? `${a} ${p}px "${i}"` : `${p}px "${i}"`;
|
|
8
|
-
const c = s.measureText(
|
|
8
|
+
const c = s.measureText(m), l = c.actualBoundingBoxAscent || p * 0.8, f = c.actualBoundingBoxDescent || p * 0.2, d = l + f, w = c.width, e = document.createElement("canvas");
|
|
9
9
|
e.width = Math.ceil(w * t), e.height = Math.ceil(d * t);
|
|
10
10
|
const h = e.getContext("2d");
|
|
11
|
-
return h.scale(t, t), h.font = s.font, h.textAlign = "left", h.textBaseline = "alphabetic", h.fillStyle =
|
|
11
|
+
return h.scale(t, t), h.font = s.font, h.textAlign = "left", h.textBaseline = "alphabetic", h.fillStyle = u, h.fillText(m, 0, l), e.toDataURL();
|
|
12
12
|
}
|
|
13
|
-
function $(
|
|
14
|
-
return Array.from(document.styleSheets).some((i) => i.href ===
|
|
13
|
+
function $(m) {
|
|
14
|
+
return Array.from(document.styleSheets).some((i) => i.href === m);
|
|
15
15
|
}
|
|
16
|
-
function P(
|
|
16
|
+
function P(m) {
|
|
17
17
|
return new Promise((i) => {
|
|
18
|
-
if ($(
|
|
18
|
+
if ($(m)) return i(null);
|
|
19
19
|
const a = document.createElement("link");
|
|
20
|
-
a.rel = "stylesheet", a.href =
|
|
20
|
+
a.rel = "stylesheet", a.href = m, a.setAttribute("data-snapdom", "injected-import"), a.onload = () => i(a), a.onerror = () => i(null), document.head.appendChild(a);
|
|
21
21
|
});
|
|
22
22
|
}
|
|
23
|
-
async function T({ preCached:
|
|
23
|
+
async function T({ preCached: m = !1 } = {}) {
|
|
24
24
|
if (o.resource.has("fonts-embed-css")) {
|
|
25
|
-
if (
|
|
25
|
+
if (m) {
|
|
26
26
|
const t = document.createElement("style");
|
|
27
27
|
t.setAttribute("data-snapdom", "embedFonts"), t.textContent = o.resource.get("fonts-embed-css"), document.head.appendChild(t);
|
|
28
28
|
}
|
|
@@ -40,7 +40,7 @@ async function T({ preCached: u = !1 } = {}) {
|
|
|
40
40
|
const p = Array.from(
|
|
41
41
|
document.querySelectorAll('link[rel="stylesheet"]')
|
|
42
42
|
).filter((t) => t.href);
|
|
43
|
-
let
|
|
43
|
+
let u = "";
|
|
44
44
|
for (const t of p)
|
|
45
45
|
try {
|
|
46
46
|
const s = await (await fetch(t.href)).text();
|
|
@@ -71,7 +71,7 @@ async function T({ preCached: u = !1 } = {}) {
|
|
|
71
71
|
let f = s;
|
|
72
72
|
for (const d of l)
|
|
73
73
|
d && (f = f.replace(d.original, d.inlined));
|
|
74
|
-
|
|
74
|
+
u += f + `
|
|
75
75
|
`;
|
|
76
76
|
} catch {
|
|
77
77
|
console.warn("[snapdom] Failed to fetch CSS:", t.href);
|
|
@@ -83,9 +83,9 @@ async function T({ preCached: u = !1 } = {}) {
|
|
|
83
83
|
if (n.type === CSSRule.FONT_FACE_RULE) {
|
|
84
84
|
const s = n.style.getPropertyValue("src"), c = n.style.getPropertyValue("font-family");
|
|
85
85
|
if (!s || y(c)) continue;
|
|
86
|
-
const l = /url\((["']?)([^"')]+)\1\)/g, f = /local\((["']?)[^)]+?\1\)/g, d =
|
|
86
|
+
const l = /url\((["']?)([^"')]+)\1\)/g, f = /local\((["']?)[^)]+?\1\)/g, d = !!s.match(l), w = !!s.match(f);
|
|
87
87
|
if (!d && w) {
|
|
88
|
-
|
|
88
|
+
u += `@font-face{font-family:${c};src:${s};font-style:${n.style.getPropertyValue("font-style") || "normal"};font-weight:${n.style.getPropertyValue("font-weight") || "normal"};}`;
|
|
89
89
|
continue;
|
|
90
90
|
}
|
|
91
91
|
let e = s;
|
|
@@ -114,7 +114,7 @@ async function T({ preCached: u = !1 } = {}) {
|
|
|
114
114
|
}
|
|
115
115
|
}
|
|
116
116
|
}
|
|
117
|
-
|
|
117
|
+
u += `@font-face{font-family:${c};src:${e};font-style:${n.style.getPropertyValue("font-style") || "normal"};font-weight:${n.style.getPropertyValue("font-weight") || "normal"};}`;
|
|
118
118
|
}
|
|
119
119
|
}
|
|
120
120
|
} catch (n) {
|
|
@@ -142,13 +142,13 @@ async function T({ preCached: u = !1 } = {}) {
|
|
|
142
142
|
continue;
|
|
143
143
|
}
|
|
144
144
|
}
|
|
145
|
-
|
|
145
|
+
u += `@font-face{font-family:'${t.family}';src:url(${n});font-style:${t.style || "normal"};font-weight:${t.weight || "normal"};}`;
|
|
146
146
|
}
|
|
147
|
-
if (
|
|
147
|
+
if (u && (o.resource.set("fonts-embed-css", u), m)) {
|
|
148
148
|
const t = document.createElement("style");
|
|
149
|
-
t.setAttribute("data-snapdom", "embedFonts"), t.textContent =
|
|
149
|
+
t.setAttribute("data-snapdom", "embedFonts"), t.textContent = u, document.head.appendChild(t);
|
|
150
150
|
}
|
|
151
|
-
return
|
|
151
|
+
return u;
|
|
152
152
|
}
|
|
153
153
|
export {
|
|
154
154
|
T as embedCustomFonts,
|
|
@@ -1,94 +1,86 @@
|
|
|
1
|
-
import { cache as
|
|
2
|
-
import { iconToImage as
|
|
3
|
-
import { isIconFont as
|
|
4
|
-
import { getStyleKey as
|
|
5
|
-
import { getStyle as
|
|
6
|
-
async function
|
|
7
|
-
if (!(
|
|
1
|
+
import { cache as M } from "../core/cache.js";
|
|
2
|
+
import { iconToImage as v } from "./fonts.js";
|
|
3
|
+
import { isIconFont as G } from "./iconFonts.js";
|
|
4
|
+
import { getStyleKey as $ } from "../utils/cssTools.js";
|
|
5
|
+
import { getStyle as H, snapshotComputedStyle as z, parseContent as J, extractURL as Q, fetchImage as Y, safeEncodeURI as Z, splitBackgroundImage as tt, inlineSingleBackgroundEntry as nt } from "../utils/helpers.js";
|
|
6
|
+
async function et(a, s, m, R = !1, b) {
|
|
7
|
+
if (!(a instanceof Element) || !(s instanceof Element)) return;
|
|
8
8
|
for (const n of ["::before", "::after", "::first-letter"])
|
|
9
9
|
try {
|
|
10
|
-
const t =
|
|
11
|
-
if (!t || typeof t[Symbol.iterator] != "function") continue;
|
|
10
|
+
const t = H(a, n);
|
|
11
|
+
if (!t || typeof t[Symbol.iterator] != "function" || t.content === "none" && t.backgroundImage === "none" && t.backgroundColor === "transparent" && (t.borderStyle === "none" || parseFloat(t.borderWidth) === 0) && (!t.transform || t.transform === "none") && t.display === "inline") continue;
|
|
12
12
|
if (n === "::first-letter") {
|
|
13
|
-
const
|
|
14
|
-
if (!(t.color !==
|
|
15
|
-
const
|
|
16
|
-
(
|
|
13
|
+
const e = getComputedStyle(a);
|
|
14
|
+
if (!(t.color !== e.color || t.fontSize !== e.fontSize || t.fontWeight !== e.fontWeight)) continue;
|
|
15
|
+
const c = Array.from(s.childNodes).find(
|
|
16
|
+
(T) => T.nodeType === Node.TEXT_NODE && T.textContent?.trim().length > 0
|
|
17
17
|
);
|
|
18
|
-
if (!
|
|
19
|
-
const
|
|
20
|
-
if (!
|
|
21
|
-
const
|
|
22
|
-
|
|
23
|
-
const
|
|
24
|
-
|
|
25
|
-
const
|
|
26
|
-
|
|
18
|
+
if (!c) continue;
|
|
19
|
+
const W = c.textContent, d = W.match(/^([^\p{L}\p{N}\s]*[\p{L}\p{N}](?:['’])?)/u)?.[0], X = W.slice(d?.length || 0);
|
|
20
|
+
if (!d || /[\uD800-\uDFFF]/.test(d)) continue;
|
|
21
|
+
const f = document.createElement("span");
|
|
22
|
+
f.textContent = d, f.dataset.snapdomPseudo = "::first-letter";
|
|
23
|
+
const _ = z(t), q = $(_, "span", m);
|
|
24
|
+
M.preStyleMap.set(f, q);
|
|
25
|
+
const P = document.createTextNode(X);
|
|
26
|
+
s.replaceChild(P, c), s.insertBefore(f, P);
|
|
27
27
|
continue;
|
|
28
28
|
}
|
|
29
|
-
const
|
|
30
|
-
if (
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
const
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
} else if (s.startsWith("url(")) {
|
|
47
|
-
const e = W(s);
|
|
48
|
-
if (e && e.trim() !== "")
|
|
49
|
-
try {
|
|
50
|
-
const i = document.createElement("img"), P = await j(
|
|
51
|
-
A(e, { useProxy: S })
|
|
52
|
-
);
|
|
53
|
-
i.src = P, i.style = `width:${m}px;height:auto;object-fit:contain;`, o.appendChild(i);
|
|
54
|
-
} catch (i) {
|
|
55
|
-
console.error(
|
|
56
|
-
`[snapdom] Error in pseudo ${n} for`,
|
|
57
|
-
c,
|
|
58
|
-
i
|
|
59
|
-
);
|
|
60
|
-
}
|
|
61
|
-
} else !a && s && s !== "none" && (o.textContent = s);
|
|
62
|
-
if (C)
|
|
29
|
+
const h = t.content, i = /counter\s*\(|counters\s*\(/.test(h) ? "- " : J(h), p = t.backgroundImage, l = t.backgroundColor, S = t.fontFamily, g = parseInt(t.fontSize) || 32, U = parseInt(t.fontWeight) || !1, j = t.color || "#000", A = t.display, D = parseFloat(t.width), L = parseFloat(t.height), x = t.borderStyle, V = parseFloat(t.borderWidth), F = t.transform, w = G(S), k = h !== "none" && i !== "", u = p && p !== "none", y = l && l !== "transparent" && l !== "rgba(0, 0, 0, 0)", B = A !== "inline" && (D > 0 || L > 0), I = x && x !== "none" && V > 0, N = F && F !== "none";
|
|
30
|
+
if (!(k || u || y || B || I || N)) continue;
|
|
31
|
+
const o = document.createElement("span");
|
|
32
|
+
o.dataset.snapdomPseudo = n;
|
|
33
|
+
const K = z(t), O = $(K, "span", m);
|
|
34
|
+
if (M.preStyleMap.set(o, O), w && i.length === 1) {
|
|
35
|
+
const e = document.createElement("img");
|
|
36
|
+
e.src = await v(
|
|
37
|
+
i,
|
|
38
|
+
S,
|
|
39
|
+
U,
|
|
40
|
+
g,
|
|
41
|
+
j
|
|
42
|
+
), e.style = `width:${g}px;height:auto;object-fit:contain;`, o.appendChild(e);
|
|
43
|
+
} else if (i.startsWith("url(")) {
|
|
44
|
+
const e = Q(i);
|
|
45
|
+
if (e?.trim())
|
|
63
46
|
try {
|
|
64
|
-
const
|
|
65
|
-
e
|
|
66
|
-
);
|
|
67
|
-
o.style.backgroundImage = i.join(", ");
|
|
68
|
-
} catch (e) {
|
|
69
|
-
console.warn(
|
|
70
|
-
`[snapdom] Failed to inline background-image for ${n}`,
|
|
71
|
-
e
|
|
47
|
+
const r = document.createElement("img"), c = await Y(
|
|
48
|
+
Z(e, { useProxy: b })
|
|
72
49
|
);
|
|
50
|
+
r.src = c, r.style = `width:${g}px;height:auto;object-fit:contain;`, o.appendChild(r);
|
|
51
|
+
} catch (r) {
|
|
52
|
+
console.error(`[snapdom] Error in pseudo ${n} for`, a, r);
|
|
73
53
|
}
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
54
|
+
} else !w && k && (o.textContent = i);
|
|
55
|
+
if (u)
|
|
56
|
+
try {
|
|
57
|
+
const e = tt(p), r = await Promise.all(
|
|
58
|
+
e.map(nt)
|
|
59
|
+
);
|
|
60
|
+
o.style.backgroundImage = r.join(", ");
|
|
61
|
+
} catch (e) {
|
|
62
|
+
console.warn(
|
|
63
|
+
`[snapdom] Failed to inline background-image for ${n}`,
|
|
64
|
+
e
|
|
65
|
+
);
|
|
66
|
+
}
|
|
67
|
+
if (y && (o.style.backgroundColor = l), !(o.childNodes.length > 0 || o.textContent?.trim() !== "" || u || y || B || I || N)) continue;
|
|
68
|
+
n === "::before" ? s.insertBefore(o, s.firstChild) : s.appendChild(o);
|
|
77
69
|
} catch (t) {
|
|
78
|
-
console.warn(`[snapdom] Failed to capture ${n} for`,
|
|
70
|
+
console.warn(`[snapdom] Failed to capture ${n} for`, a, t);
|
|
79
71
|
}
|
|
80
|
-
const
|
|
72
|
+
const C = Array.from(a.children), E = Array.from(s.children).filter(
|
|
81
73
|
(n) => !n.dataset.snapdomPseudo
|
|
82
74
|
);
|
|
83
|
-
for (let n = 0; n < Math.min(
|
|
84
|
-
await
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
75
|
+
for (let n = 0; n < Math.min(C.length, E.length); n++)
|
|
76
|
+
await et(
|
|
77
|
+
C[n],
|
|
78
|
+
E[n],
|
|
79
|
+
m,
|
|
80
|
+
R,
|
|
81
|
+
b
|
|
90
82
|
);
|
|
91
83
|
}
|
|
92
84
|
export {
|
|
93
|
-
|
|
85
|
+
et as inlinePseudoElements
|
|
94
86
|
};
|
package/types/file/saveAs.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export default saveAs;
|
|
2
|
-
export function saveAs(blob: any, name: any): void
|
|
2
|
+
export function saveAs(blob: any, name: any): Promise<void>;
|