@unicom-cloud/utils 0.1.11 → 0.1.13

package/snapdom/src/modules/background.js

@@ -1,25 +1,34 @@
-import { getStyle as b, splitBackgroundImage as p, inlineSingleBackgroundEntry as k } from "../utils/helpers.js";
-async function B(u, m, l, f = {}) {
-  const r = [[u, m]];
-  for (; r.length; ) {
-    const [e, o] = r.shift(), s = l.get(e) || b(e);
-    l.has(e) || l.set(e, s);
-    const c = s.getPropertyValue("background-image"), t = s.getPropertyValue("background-color");
-    if (!c || c === "none") {
-      const n = Array.from(e.children), h = Array.from(o.children);
-      for (let i = 0; i < Math.min(n.length, h.length); i++)
-        r.push([n[i], h[i]]);
-      continue;
+import { cache as c } from "../core/cache.js";
+import { getStyle as y, splitBackgroundImage as h, inlineSingleBackgroundEntry as b } from "../utils/helpers.js";
+async function w(u, d, k = {}) {
+  const t = [[u, d]], p = [
+    "background-image",
+    "mask",
+    "mask-image",
+    "-webkit-mask-image",
+    "mask-source",
+    "mask-box-image-source",
+    "mask-border-source",
+    "-webkit-mask-box-image-source"
+  ];
+  for (; t.length; ) {
+    const [o, s] = t.shift(), a = c.preStyle.get(o) || y(o);
+    c.preStyle.has(o) || c.preStyle.set(o, a);
+    for (const e of p) {
+      const i = a.getPropertyValue(e);
+      if (!i || i === "none") continue;
+      const f = h(i), g = await Promise.all(
+        f.map((r) => b(r, k))
+      );
+      g.some((r) => r && r !== "none" && !/^url\(undefined/.test(r)) && s.style.setProperty(e, g.join(", "));
     }
-    const y = p(c), a = await Promise.all(
-      y.map((n) => k(n, f))
-    );
-    a.some((n) => n && n !== "none" && !/^url\(undefined\)/.test(n)) && (o.style.backgroundImage = a.join(", ")), t && t !== "transparent" && t !== "rgba(0, 0, 0, 0)" && (o.style.backgroundColor = t);
-    const g = Array.from(e.children), d = Array.from(o.children);
-    for (let n = 0; n < Math.min(g.length, d.length); n++)
-      r.push([g[n], d[n]]);
+    const n = a.getPropertyValue("background-color");
+    n && n !== "transparent" && n !== "rgba(0, 0, 0, 0)" && (s.style.backgroundColor = n);
+    const l = Array.from(o.children), m = Array.from(s.children);
+    for (let e = 0; e < Math.min(l.length, m.length); e++)
+      t.push([l[e], m[e]]);
   }
 }
 export {
-  B as inlineBackgroundImages
+  w as inlineBackgroundImages
 };

package/snapdom/src/modules/fonts.js

@@ -1,125 +1,120 @@
-import { resourceCache as c, processedFontURLs as h } from "../core/cache.js";
-import { isIconFont as b, extractURL as $ } from "../utils/helpers.js";
-async function _(f, a, l, p = 32, g = "#000") {
-  a = a.replace(/^['"]+|['"]+$/g, "");
-  const i = window.devicePixelRatio || 1, n = document.createElement("canvas").getContext("2d");
-  n.font = l ? `${l} ${p}px "${a}"` : `${p}px "${a}"`;
-  const o = n.measureText(f), m = o.actualBoundingBoxAscent || p * 0.8, s = o.actualBoundingBoxDescent || p * 0.2, d = m + s, r = o.width, u = document.createElement("canvas");
-  u.width = Math.ceil(r * i), u.height = Math.ceil(d * i);
-  const e = u.getContext("2d");
-  return e.scale(i, i), e.font = n.font, e.textAlign = "left", e.textBaseline = "alphabetic", e.fillStyle = g, e.fillText(f, 0, m), u.toDataURL();
+import { cache as o } from "../core/cache.js";
+import { isIconFont as y } from "./iconFonts.js";
+import { extractURL as L } from "../utils/helpers.js";
+async function E(u, i, a, p = 32, m = "#000") {
+  i = i.replace(/^['"]+|['"]+$/g, "");
+  const t = window.devicePixelRatio || 1, s = document.createElement("canvas").getContext("2d");
+  s.font = a ? `${a} ${p}px "${i}"` : `${p}px "${i}"`;
+  const c = s.measureText(u), l = c.actualBoundingBoxAscent || p * 0.8, f = c.actualBoundingBoxDescent || p * 0.2, d = l + f, w = c.width, e = document.createElement("canvas");
+  e.width = Math.ceil(w * t), e.height = Math.ceil(d * t);
+  const h = e.getContext("2d");
+  return h.scale(t, t), h.font = s.font, h.textAlign = "left", h.textBaseline = "alphabetic", h.fillStyle = m, h.fillText(u, 0, l), e.toDataURL();
 }
-function A(f) {
-  return Array.from(document.styleSheets).some((a) => a.href === f);
+function $(u) {
+  return Array.from(document.styleSheets).some((i) => i.href === u);
 }
-function C(f) {
-  return new Promise((a) => {
-    if (A(f)) return a(null);
-    const l = document.createElement("link");
-    l.rel = "stylesheet", l.href = f, l.setAttribute("data-snapdom", "injected-import"), l.onload = () => a(l), l.onerror = () => a(null), document.head.appendChild(l);
+function P(u) {
+  return new Promise((i) => {
+    if ($(u)) return i(null);
+    const a = document.createElement("link");
+    a.rel = "stylesheet", a.href = u, a.setAttribute("data-snapdom", "injected-import"), a.onload = () => i(a), a.onerror = () => i(null), document.head.appendChild(a);
   });
 }
-async function P({
-  ignoreIconFonts: f = !0,
-  preCached: a = !1
-} = {}) {
-  if (c.has("fonts-embed-css")) {
-    if (a) {
+async function T({ preCached: u = !1 } = {}) {
+  if (o.resource.has("fonts-embed-css")) {
+    if (u) {
       const t = document.createElement("style");
-      t.setAttribute("data-snapdom", "embedFonts"), t.textContent = c.get("fonts-embed-css"), document.head.appendChild(t);
+      t.setAttribute("data-snapdom", "embedFonts"), t.textContent = o.resource.get("fonts-embed-css"), document.head.appendChild(t);
     }
-    return c.get("fonts-embed-css");
+    return o.resource.get("fonts-embed-css");
   }
-  const l = /@import\s+url\(["']?([^"')]+)["']?\)/g, p = [];
+  const i = /@import\s+url\(["']?([^"')]+)["']?\)/g, a = [];
   for (const t of document.querySelectorAll("style")) {
-    const n = t.textContent || "", o = Array.from(n.matchAll(l));
-    for (const m of o) {
-      const s = m[1];
-      A(s) || p.push(s);
+    const n = t.textContent || "", s = Array.from(n.matchAll(i));
+    for (const c of s) {
+      const l = c[1];
+      y(l) || $(l) || a.push(l);
     }
   }
-  await Promise.all(p.map(C));
-  const g = Array.from(
+  await Promise.all(a.map(P));
+  const p = Array.from(
     document.querySelectorAll('link[rel="stylesheet"]')
   ).filter((t) => t.href);
-  let i = "";
-  for (const t of g)
+  let m = "";
+  for (const t of p)
     try {
-      const o = await (await fetch(t.href)).text();
-      if (f && (b(t.href) || b(o)))
-        continue;
-      const m = /url\((["']?)([^"')]+)\1\)/g, s = await Promise.all(
-        Array.from(o.matchAll(m)).map(async (r) => {
-          let u = $(r[0]);
-          if (!u) return null;
-          let e = u;
-          if (!e.startsWith("http") && !e.startsWith("data:") && (e = new URL(e, t.href).href), f && b(e)) return null;
-          if (c.has(e))
-            return h.add(e), {
-              original: r[0],
-              inlined: `url(${c.get(e)})`
+      const s = await (await fetch(t.href)).text();
+      if (y(t.href) || y(s)) continue;
+      const c = /url\((["']?)([^"')]+)\1\)/g, l = await Promise.all(
+        Array.from(s.matchAll(c)).map(async (d) => {
+          let w = L(d[0]);
+          if (!w) return null;
+          let e = w;
+          if (!e.startsWith("http") && !e.startsWith("data:") && (e = new URL(e, t.href).href), y(e)) return null;
+          if (o.resource.has(e))
+            return o.font.add(e), {
+              original: d[0],
+              inlined: `url(${o.resource.get(e)})`
             };
-          if (h.has(e)) return null;
+          if (o.font.has(e)) return null;
           try {
-            const S = await (await fetch(e)).blob(), w = await new Promise((R) => {
-              const y = new FileReader();
-              y.onload = () => R(y.result), y.readAsDataURL(S);
+            const g = await (await fetch(e)).blob(), b = await new Promise((r) => {
+              const x = new FileReader();
+              x.onload = () => r(x.result), x.readAsDataURL(g);
             });
-            return c.set(e, w), h.add(e), { original: r[0], inlined: `url(${w})` };
+            return o.resource.set(e, b), o.font.add(e), { original: d[0], inlined: `url(${b})` };
           } catch {
             return console.warn("[snapdom] Failed to fetch font resource:", e), null;
           }
         })
       );
-      let d = o;
-      for (const r of s)
-        r && (d = d.replace(r.original, r.inlined));
-      i += d + `
+      let f = s;
+      for (const d of l)
+        d && (f = f.replace(d.original, d.inlined));
+      m += f + `
 `;
     } catch {
       console.warn("[snapdom] Failed to fetch CSS:", t.href);
     }
   for (const t of document.styleSheets)
     try {
-      if (!t.href || g.every((n) => n.href !== t.href)) {
+      if (!t.href || p.every((n) => n.href !== t.href)) {
         for (const n of t.cssRules)
           if (n.type === CSSRule.FONT_FACE_RULE) {
-            const o = n.style.getPropertyValue("src");
-            if (!o) continue;
-            const m = /url\((["']?)([^"')]+)\1\)/g;
-            let s = o;
-            const d = Array.from(o.matchAll(m));
-            for (const r of d) {
-              let u = r[2].trim();
-              if (!u) continue;
-              let e = u;
-              if (!e.startsWith("http") && !e.startsWith("data:") && (e = new URL(e, t.href || location.href).href), !(f && b(e))) {
-                if (c.has(e)) {
-                  h.add(e), s = s.replace(
-                    r[0],
-                    `url(${c.get(e)})`
+            const s = n.style.getPropertyValue("src"), c = n.style.getPropertyValue("font-family");
+            if (!s || y(c)) continue;
+            const l = /url\((["']?)([^"')]+)\1\)/g, f = /local\((["']?)[^)]+?\1\)/g, d = l.test(s), w = f.test(s);
+            if (!d && w) {
+              m += `@font-face{font-family:${c};src:${s};font-style:${n.style.getPropertyValue("font-style") || "normal"};font-weight:${n.style.getPropertyValue("font-weight") || "normal"};}`;
+              continue;
+            }
+            let e = s;
+            const h = Array.from(s.matchAll(l));
+            for (const g of h) {
+              let b = g[2].trim();
+              if (!b) continue;
+              let r = b;
+              if (!r.startsWith("http") && !r.startsWith("data:") && (r = new URL(r, t.href || location.href).href), !y(r)) {
+                if (o.resource.has(r)) {
+                  o.font.add(r), e = e.replace(
+                    g[0],
+                    `url(${o.resource.get(r)})`
                   );
                   continue;
                 }
-                if (!h.has(e))
+                if (!o.font.has(r))
                   try {
-                    const S = await (await fetch(e)).blob(), w = await new Promise((R) => {
-                      const y = new FileReader();
-                      y.onload = () => R(y.result), y.readAsDataURL(S);
+                    const A = await (await fetch(r)).blob(), S = await new Promise((C) => {
+                      const R = new FileReader();
+                      R.onload = () => C(R.result), R.readAsDataURL(A);
                     });
-                    c.set(e, w), h.add(e), s = s.replace(r[0], `url(${w})`);
+                    o.resource.set(r, S), o.font.add(r), e = e.replace(g[0], `url(${S})`);
                   } catch {
-                    console.warn("[snapdom] Failed to fetch font URL:", e);
+                    console.warn("[snapdom] Failed to fetch font URL:", r);
                   }
               }
             }
-            i += `@font-face {
-  font-family: ${n.style.getPropertyValue("font-family")};
-  src: ${s};
-  font-style: ${n.style.getPropertyValue("font-style") || "normal"};
-  font-weight: ${n.style.getPropertyValue("font-weight") || "normal"};
-}
-`;
+            m += `@font-face{font-family:${c};src:${e};font-style:${n.style.getPropertyValue("font-style") || "normal"};font-weight:${n.style.getPropertyValue("font-weight") || "normal"};}`;
           }
       }
     } catch (n) {
@@ -127,17 +122,18 @@ async function P({
     }
   for (const t of document.fonts)
     if (t.family && t.status === "loaded" && t._snapdomSrc) {
+      if (y(t.family)) continue;
       let n = t._snapdomSrc;
       if (!n.startsWith("data:")) {
-        if (c.has(t._snapdomSrc))
-          n = c.get(t._snapdomSrc), h.add(t._snapdomSrc);
-        else if (!h.has(t._snapdomSrc))
+        if (o.resource.has(t._snapdomSrc))
+          n = o.resource.get(t._snapdomSrc), o.font.add(t._snapdomSrc);
+        else if (!o.font.has(t._snapdomSrc))
           try {
-            const m = await (await fetch(t._snapdomSrc)).blob();
-            n = await new Promise((s) => {
-              const d = new FileReader();
-              d.onload = () => s(d.result), d.readAsDataURL(m);
-            }), c.set(t._snapdomSrc, n), h.add(t._snapdomSrc);
+            const c = await (await fetch(t._snapdomSrc)).blob();
+            n = await new Promise((l) => {
+              const f = new FileReader();
+              f.onload = () => l(f.result), f.readAsDataURL(c);
+            }), o.resource.set(t._snapdomSrc, n), o.font.add(t._snapdomSrc);
           } catch {
             console.warn(
               "[snapdom] Failed to fetch dynamic font src:",
@@ -146,21 +142,15 @@ async function P({
             continue;
           }
       }
-      i += `@font-face {
-  font-family: '${t.family}';
-  src: url(${n});
-  font-style: ${t.style || "normal"};
-  font-weight: ${t.weight || "normal"};
-}
-`;
+      m += `@font-face{font-family:'${t.family}';src:url(${n});font-style:${t.style || "normal"};font-weight:${t.weight || "normal"};}`;
     }
-  if (i && (c.set("fonts-embed-css", i), a)) {
+  if (m && (o.resource.set("fonts-embed-css", m), u)) {
     const t = document.createElement("style");
-    t.setAttribute("data-snapdom", "embedFonts"), t.textContent = i, document.head.appendChild(t);
+    t.setAttribute("data-snapdom", "embedFonts"), t.textContent = m, document.head.appendChild(t);
   }
-  return i;
+  return m;
 }
 export {
-  P as embedCustomFonts,
-  _ as iconToImage
+  T as embedCustomFonts,
+  E as iconToImage
 };

package/snapdom/src/modules/iconFonts.js

@@ -0,0 +1,28 @@
+var s = [
+  // /uicons/i,
+  /font\s*awesome/i,
+  /material\s*icons/i,
+  /ionicons/i,
+  /glyphicons/i,
+  /feather/i,
+  /bootstrap\s*icons/i,
+  /remix\s*icons/i,
+  /heroicons/i,
+  /layui/i,
+  /lucide/i
+], o = [];
+function r(i) {
+  const e = Array.isArray(i) ? i : [i];
+  for (const t of e)
+    t instanceof RegExp ? o.push(t) : typeof t == "string" ? o.push(new RegExp(t, "i")) : console.warn("[snapdom] Ignored invalid iconFont value:", t);
+}
+function c(i) {
+  const e = typeof i == "string" ? i : "", t = [...s, ...o];
+  for (const n of t)
+    if (n instanceof RegExp && n.test(e)) return !0;
+  return !!(/icon/i.test(e) || /glyph/i.test(e) || /symbols/i.test(e) || /feather/i.test(e) || /fontawesome/i.test(e));
+}
+export {
+  r as extendIconFonts,
+  c as isIconFont
+};

package/snapdom/src/modules/images.js

@@ -1,17 +1,17 @@
-import { fetchImage as o } from "../utils/helpers.js";
-async function h(i, n = {}) {
-  const r = Array.from(i.querySelectorAll("img")), s = async (t) => {
+import { fetchImage as l } from "../utils/helpers.js";
+async function h(n, a = {}) {
+  const r = Array.from(n.querySelectorAll("img")), i = async (t) => {
     const c = t.src;
     try {
-      const e = n.crossOrigin ? n.crossOrigin(c) : "anonymous", a = await o(c, 3e3, e);
-      t.src = a, t.width || (t.width = t.naturalWidth || 100), t.height || (t.height = t.naturalHeight || 100);
+      const e = await l(c, { useProxy: a.useProxy });
+      t.src = e, t.width || (t.width = t.naturalWidth || 100), t.height || (t.height = t.naturalHeight || 100);
     } catch {
       const e = document.createElement("div");
       e.style = `width: ${t.width || 100}px; height: ${t.height || 100}px; background: #ccc; display: inline-block; text-align: center; line-height: ${t.height || 100}px; color: #666; font-size: 12px;`, e.innerText = "img", t.replaceWith(e);
     }
   };
   for (let t = 0; t < r.length; t += 4) {
-    const c = r.slice(t, t + 4).map(s);
+    const c = r.slice(t, t + 4).map(i);
     await Promise.allSettled(c);
   }
 }

package/snapdom/src/modules/pseudo.js

@@ -1,90 +1,92 @@
-import { iconToImage as z } from "./fonts.js";
-import { getStyleKey as V } from "../utils/cssTools.js";
-import { getStyle as U, snapshotComputedStyle as I, parseContent as W, extractURL as j, fetchImage as A, safeEncodeURI as D, splitBackgroundImage as L, inlineSingleBackgroundEntry as $ } from "../utils/helpers.js";
-async function R(l, i, g, F, h, w = !1) {
-  if (!(l instanceof Element) || !(i instanceof Element)) return;
+import { cache as I } from "../core/cache.js";
+import { iconToImage as T } from "./fonts.js";
+import { isIconFont as $ } from "./iconFonts.js";
+import { getStyleKey as N } from "../utils/cssTools.js";
+import { getStyle as z, snapshotComputedStyle as V, parseContent as U, extractURL as W, fetchImage as j, safeEncodeURI as A, splitBackgroundImage as D, inlineSingleBackgroundEntry as L } from "../utils/helpers.js";
+async function R(c, r, h, F = !1, S) {
+  if (!(c instanceof Element) || !(r instanceof Element)) return;
   for (const n of ["::before", "::after", "::first-letter"])
     try {
-      const t = U(l, n);
+      const t = z(c, n);
       if (!t || typeof t[Symbol.iterator] != "function") continue;
       if (n === "::first-letter") {
-        const a = getComputedStyle(l);
-        if (!(t.color !== a.color || t.fontSize !== a.fontSize || t.fontWeight !== a.fontWeight)) continue;
-        const d = Array.from(i.childNodes).find(
+        const l = getComputedStyle(c);
+        if (!(t.color !== l.color || t.fontSize !== l.fontSize || t.fontWeight !== l.fontWeight)) continue;
+        const d = Array.from(r.childNodes).find(
           (e) => e.nodeType === Node.TEXT_NODE && e.textContent && e.textContent.trim().length > 0
         );
         if (!d) continue;
-        const p = d.textContent, f = p.match(/^([^\p{L}\p{N}\s]*[\p{L}\p{N}](?:['’])?)/u)?.[0], b = p.slice(f?.length || 0);
+        const g = d.textContent, f = g.match(/^([^\p{L}\p{N}\s]*[\p{L}\p{N}](?:['’])?)/u)?.[0], x = g.slice(f?.length || 0);
         if (!f || /[\uD800-\uDFFF]/.test(f)) continue;
-        const r = document.createElement("span");
-        r.textContent = f, r.dataset.snapdomPseudo = "::first-letter";
-        const s = I(t), N = V(s, "span", h);
-        g.set(r, N);
-        const x = document.createTextNode(b);
-        i.replaceChild(x, d), i.insertBefore(r, x);
+        const a = document.createElement("span");
+        a.textContent = f, a.dataset.snapdomPseudo = "::first-letter";
+        const s = V(t), B = N(s, "span", h);
+        I.preStyleMap.set(a, B);
+        const E = document.createTextNode(x);
+        r.replaceChild(E, d), r.insertBefore(a, E);
         continue;
       }
-      const S = t.getPropertyValue("content"), u = t.getPropertyValue("background-image"), m = t.getPropertyValue("background-color"), T = S !== "none", y = u && u !== "none", C = m && m !== "transparent" && m !== "rgba(0, 0, 0, 0)";
-      if (T || y || C) {
-        const a = t.getPropertyValue("font-family"), B = parseInt(t.getPropertyValue("font-size")) || 32, d = parseInt(t.getPropertyValue("font-weight")) || !1, p = t.getPropertyValue("color") || "#000", o = document.createElement("span");
+      const u = t.getPropertyValue("content"), y = t.getPropertyValue("background-image"), p = t.getPropertyValue("background-color"), M = u !== "none", C = y && y !== "none", b = p && p !== "transparent" && p !== "rgba(0, 0, 0, 0)";
+      if (M || C || b) {
+        const l = t.getPropertyValue("font-family"), m = parseInt(t.getPropertyValue("font-size")) || 32, d = parseInt(t.getPropertyValue("font-weight")) || !1, g = t.getPropertyValue("color") || "#000", o = document.createElement("span");
         o.dataset.snapdomPseudo = n;
-        const f = I(t), b = V(f, "span", h);
-        g.set(o, b);
-        const r = a && /font.*awesome|material|bootstrap|glyphicons|ionicons|remixicon|simple-line-icons|octicons|feather|typicons|weathericons|lucide/i.test(
-          a
-        ), s = W(S);
-        if (!w && r && s.length === 1) {
+        const f = V(t), x = N(f, "span", h);
+        I.preStyleMap.set(o, x);
+        const a = $(l);
+        let s;
+        if (/counter\s*\(|counters\s*\(/.test(u) ? s = "- " : s = U(u), a && s.length === 1) {
           const e = document.createElement("img");
-          e.src = await z(
+          e.src = await T(
             s,
-            a,
+            l,
             d,
-            B,
-            p
-          ), e.style = "display:block;width:100%;height:100%;object-fit:contain;", o.appendChild(e);
+            m,
+            g
+          ), e.style = `width:${m}px;height:auto;object-fit:contain;`, o.appendChild(e);
         } else if (s.startsWith("url(")) {
-          const e = j(s);
+          const e = W(s);
           if (e && e.trim() !== "")
             try {
-              const c = document.createElement("img"), E = await A(D(e));
-              c.src = E, c.style = "display:block;width:100%;height:100%;object-fit:contain;", o.appendChild(c);
-            } catch (c) {
+              const i = document.createElement("img"), P = await j(
+                A(e, { useProxy: S })
+              );
+              i.src = P, i.style = `width:${m}px;height:auto;object-fit:contain;`, o.appendChild(i);
+            } catch (i) {
               console.error(
                 `[snapdom] Error in pseudo ${n} for`,
-                l,
-                c
+                c,
+                i
               );
             }
-        } else !r && s && s !== "none" && (o.textContent = s);
-        if (y)
+        } else !a && s && s !== "none" && (o.textContent = s);
+        if (C)
           try {
-            const e = L(u), c = await Promise.all(
-              e.map((E) => $(E))
+            const e = D(y), i = await Promise.all(
+              e.map((P) => L(P))
             );
-            o.style.backgroundImage = c.join(", ");
+            o.style.backgroundImage = i.join(", ");
           } catch (e) {
             console.warn(
               `[snapdom] Failed to inline background-image for ${n}`,
               e
             );
           }
-        if (C && (o.style.backgroundColor = m), !(o.childNodes.length > 0 || o.textContent && o.textContent.trim() !== "" || y || C)) continue;
-        n === "::before" ? i.insertBefore(o, i.firstChild) : i.appendChild(o);
+        if (b && (o.style.backgroundColor = p), !(o.childNodes.length > 0 || o.textContent && o.textContent.trim() !== "" || C || b)) continue;
+        n === "::before" ? r.insertBefore(o, r.firstChild) : r.appendChild(o);
       }
     } catch (t) {
-      console.warn(`[snapdom] Failed to capture ${n} for`, l, t);
+      console.warn(`[snapdom] Failed to capture ${n} for`, c, t);
     }
-  const P = Array.from(l.children), k = Array.from(i.children).filter(
+  const w = Array.from(c.children), k = Array.from(r.children).filter(
     (n) => !n.dataset.snapdomPseudo
   );
-  for (let n = 0; n < Math.min(P.length, k.length); n++)
+  for (let n = 0; n < Math.min(w.length, k.length); n++)
     await R(
-      P[n],
+      w[n],
       k[n],
-      g,
-      F,
       h,
-      w
+      F,
+      S
     );
 }
 export {

package/snapdom/src/modules/styles.js

@@ -1,11 +1,31 @@
+import { cache as e } from "../core/cache.js";
 import { getStyleKey as y } from "../utils/cssTools.js";
-import { getStyle as g, snapshotComputedStyle as p } from "../utils/helpers.js";
-function r(t, n, o, e, s) {
+import { getStyle as m } from "../utils/helpers.js";
+function g(t) {
+  const a = {};
+  for (let o = 0; o < t.length; o++) {
+    const s = t[o];
+    let n = t.getPropertyValue(s);
+    (s === "background-image" || s === "content") && n.includes("url(") && !n.includes("data:") && (n = "none"), a[s] = n;
+  }
+  return a;
+}
+function d(t, a, o) {
   if (t.tagName === "STYLE") return;
-  e.has(t) || e.set(t, g(t));
-  const a = e.get(t), i = p(a), l = t.tagName?.toLowerCase() || "div", m = y(i, l, s);
-  o.set(n, m);
+  e.preStyle.has(t) || e.preStyle.set(t, m(t));
+  const s = e.preStyle.get(t);
+  if (!e.snapshot.has(t)) {
+    const p = g(s);
+    e.snapshot.set(t, p);
+  }
+  const n = e.snapshot.get(t), l = Object.entries(n).sort(([p], [r]) => p.localeCompare(r)).map(([p, r]) => `${p}:${r}`).join(";");
+  if (e.snapshotKey.has(l)) {
+    e.preStyleMap.set(a, e.snapshotKey.get(l));
+    return;
+  }
+  const h = t.tagName?.toLowerCase() || "div", i = y(n, h, o);
+  e.snapshotKey.set(l, i), e.preStyleMap.set(a, i);
 }
 export {
-  r as inlineAllStyles
+  d as inlineAllStyles
 };

package/snapdom/src/modules/svgDefs.js

@@ -0,0 +1,26 @@
+function l(s) {
+  if (!s) return;
+  const f = document.querySelectorAll("svg > defs");
+  f.length && s.querySelectorAll("svg").forEach((r) => {
+    const c = r.querySelectorAll("use");
+    if (!c.length) return;
+    const n = /* @__PURE__ */ new Set();
+    if (c.forEach((t) => {
+      const e = t.getAttribute("xlink:href") || t.getAttribute("href");
+      e && e.startsWith("#") && n.add(e.slice(1));
+    }), !n.size) return;
+    const o = document.createElementNS("http://www.w3.org/2000/svg", "defs");
+    for (const t of n)
+      for (const e of f) {
+        const i = e.querySelector(`#${CSS.escape(t)}`);
+        if (i) {
+          o.appendChild(i.cloneNode(!0));
+          break;
+        }
+      }
+    o.childNodes.length && r.insertBefore(o, r.firstChild);
+  });
+}
+export {
+  l as inlineExternalDef
+};