jspdf-utils 0.1.10 → 0.1.11

package/dist/html-to-pdf.js

@@ -1,4 +1,4 @@
-import W from "html2canvas";
+import P from "html2canvas";
 const q = {
   a0: [841, 1189],
   a1: [594, 841],
@@ -22,8 +22,8 @@ const q = {
   legal: 25.4,
   tabloid: 25
 };
-function P(t = {}) {
-  const e = t.format ?? "a4", [a, n] = q[e], i = t.pageWidth ?? a, o = t.pageHeight ?? n, s = $[e], r = {
+function S(t = {}) {
+  const e = t.format ?? "a4", [a, o] = q[e], i = t.pageWidth ?? a, n = t.pageHeight ?? o, s = $[e], r = {
     top: s,
     right: s,
     bottom: s,
@@ -33,15 +33,15 @@ function P(t = {}) {
     unit: t.unit ?? "mm",
     format: e,
     pageWidth: i,
-    pageHeight: o,
+    pageHeight: n,
     margin: { ...r, ...t.margin }
   };
 }
-function x(t, e) {
-  const a = t.offsetWidth, n = e.pageWidth - e.margin.left - e.margin.right, i = n / a, s = (e.pageHeight - e.margin.top - e.margin.bottom) / i;
-  return { renderedWidth: a, scale: i, contentWidthMm: n, pageContentPx: s };
+function B(t, e) {
+  const a = t.offsetWidth, o = e.pageWidth - e.margin.left - e.margin.right, i = o / a, s = (e.pageHeight - e.margin.top - e.margin.bottom) / i;
+  return { renderedWidth: a, scale: i, contentWidthMm: o, pageContentPx: s };
 }
-function B(t, e = 210) {
+function E(t, e = 210) {
   const a = t.cloneNode(!0);
   return Object.assign(a.style, {
     position: "fixed",
@@ -57,161 +57,161 @@ function N() {
   const t = document.createElement("style");
   return t.setAttribute("data-jspdf-utils", ""), t.textContent = "img { display: inline !important; }", document.head.appendChild(t), () => t.remove();
 }
-function E(t) {
+function T(t) {
   for (const e of t.querySelectorAll("table")) {
     const a = e.getAttribute("cellpadding");
     if (a) {
-      for (const n of e.querySelectorAll("th, td"))
-        n.style.padding || (n.style.padding = a + "px");
+      for (const o of e.querySelectorAll("th, td"))
+        o.style.padding || (o.style.padding = a + "px");
       e.removeAttribute("cellpadding");
     }
   }
 }
-function T(t, e) {
+function R(t, e) {
   for (const a of Array.from(
     t.querySelectorAll(":scope > table")
   )) {
     if (a.offsetHeight <= e) continue;
-    const n = Array.from(a.rows);
-    if (n.length === 0) continue;
-    const i = n[0].querySelector("th") !== null, o = i ? n[0] : null, s = i ? n.slice(1) : n, r = o ? o.offsetHeight : 0, g = e - r - 2, d = [];
-    let c = [], l = 0;
-    for (const m of s) {
-      const h = m.offsetHeight;
-      l + h > g && c.length > 0 && (d.push(c), c = [], l = 0), c.push(m), l += h;
+    const o = Array.from(a.rows);
+    if (o.length === 0) continue;
+    const i = o[0].querySelector("th") !== null, n = i ? o[0] : null, s = i ? o.slice(1) : o, r = n ? n.offsetHeight : 0, l = e - r - 2, h = [];
+    let c = [], g = 0;
+    for (const f of s) {
+      const d = f.offsetHeight;
+      g + d > l && c.length > 0 && (h.push(c), c = [], g = 0), c.push(f), g += d;
     }
-    c.length > 0 && d.push(c);
-    for (const m of d) {
-      const h = a.cloneNode(!1);
-      o && h.appendChild(o.cloneNode(!0));
-      for (const f of m) h.appendChild(f.cloneNode(!0));
-      a.parentNode.insertBefore(h, a);
+    c.length > 0 && h.push(c);
+    for (const f of h) {
+      const d = a.cloneNode(!1);
+      n && d.appendChild(n.cloneNode(!0));
+      for (const m of f) d.appendChild(m.cloneNode(!0));
+      a.parentNode.insertBefore(d, a);
     }
     a.remove();
   }
 }
-function R(t, e) {
+function j(t, e) {
   for (const a of Array.from(t.querySelectorAll(":scope > *"))) {
-    const n = a;
-    if (n.offsetHeight <= e || n.tagName === "TABLE")
+    const o = a;
+    if (o.offsetHeight <= e || o.tagName === "TABLE")
       continue;
-    const i = n.tagName, o = n.getAttribute("style") || "", s = getComputedStyle(n).width, r = (n.textContent || "").split(/\s+/).filter(Boolean), g = document.createElement(i);
-    g.setAttribute("style", o), Object.assign(g.style, {
+    const i = o.tagName, n = o.getAttribute("style") || "", s = getComputedStyle(o).width, r = (o.textContent || "").split(/\s+/).filter(Boolean), l = document.createElement(i);
+    l.setAttribute("style", n), Object.assign(l.style, {
       position: "absolute",
       visibility: "hidden",
       width: s
-    }), t.appendChild(g);
-    const d = [];
+    }), t.appendChild(l);
+    const h = [];
     let c = 0;
     for (; c < r.length; ) {
-      let l = c + 1, m = r.length;
-      for (; l < m; ) {
-        const f = Math.ceil((l + m) / 2);
-        g.textContent = r.slice(c, f).join(" "), g.offsetHeight <= e ? l = f : m = f - 1;
+      let g = c + 1, f = r.length;
+      for (; g < f; ) {
+        const m = Math.ceil((g + f) / 2);
+        l.textContent = r.slice(c, m).join(" "), l.offsetHeight <= e ? g = m : f = m - 1;
       }
-      const h = document.createElement(i);
-      h.setAttribute("style", o), h.textContent = r.slice(c, l).join(" "), d.push(h), c = l;
+      const d = document.createElement(i);
+      d.setAttribute("style", n), d.textContent = r.slice(c, g).join(" "), h.push(d), c = g;
     }
-    g.remove();
-    for (const l of d)
-      n.parentNode.insertBefore(l, n);
-    n.remove();
+    l.remove();
+    for (const g of h)
+      o.parentNode.insertBefore(g, o);
+    o.remove();
   }
 }
 function U(t, e, a) {
-  const n = Array.from(t.rows);
-  if (n.length === 0) return !1;
-  const i = n[0].querySelector("th") !== null, o = i ? n[0] : null, s = i ? n.slice(1) : n, r = o ? o.offsetHeight : 0;
+  const o = Array.from(t.rows);
+  if (o.length === 0) return !1;
+  const i = o[0].querySelector("th") !== null, n = i ? o[0] : null, s = i ? o.slice(1) : o, r = n ? n.offsetHeight : 0;
   if (s.length < 2) return !1;
-  const g = a - r - 2;
-  if (g <= 0) return !1;
-  let d = 0, c = 0;
-  for (const h of s) {
-    if (c + h.offsetHeight > g) break;
-    c += h.offsetHeight, d++;
+  const l = a - r - 2;
+  if (l <= 0) return !1;
+  let h = 0, c = 0;
+  for (const d of s) {
+    if (c + d.offsetHeight > l) break;
+    c += d.offsetHeight, h++;
   }
-  if (d === 0 || d === s.length) return !1;
-  const l = t.cloneNode(!1);
-  o && l.appendChild(o.cloneNode(!0));
-  for (let h = 0; h < d; h++)
-    l.appendChild(s[h].cloneNode(!0));
-  const m = t.cloneNode(!1);
-  o && m.appendChild(o.cloneNode(!0));
-  for (let h = d; h < s.length; h++)
-    m.appendChild(s[h].cloneNode(!0));
-  return e.insertBefore(l, t), e.insertBefore(m, t), t.remove(), !0;
+  if (h === 0 || h === s.length) return !1;
+  const g = t.cloneNode(!1);
+  n && g.appendChild(n.cloneNode(!0));
+  for (let d = 0; d < h; d++)
+    g.appendChild(s[d].cloneNode(!0));
+  const f = t.cloneNode(!1);
+  n && f.appendChild(n.cloneNode(!0));
+  for (let d = h; d < s.length; d++)
+    f.appendChild(s[d].cloneNode(!0));
+  return e.insertBefore(g, t), e.insertBefore(f, t), t.remove(), !0;
 }
 function _(t, e, a) {
   if (t.tagName === "TABLE" || t.tagName === "IMG") return !1;
-  const n = (t.textContent || "").split(/\s+/).filter(Boolean);
-  if (n.length < 2) return !1;
-  const i = t.tagName, o = t.getAttribute("style") || "", s = getComputedStyle(t).width, r = document.createElement(i);
-  if (r.setAttribute("style", o), Object.assign(r.style, {
+  const o = (t.textContent || "").split(/\s+/).filter(Boolean);
+  if (o.length < 2) return !1;
+  const i = t.tagName, n = t.getAttribute("style") || "", s = getComputedStyle(t).width, r = document.createElement(i);
+  if (r.setAttribute("style", n), Object.assign(r.style, {
     position: "absolute",
     visibility: "hidden",
     width: s
-  }), e.appendChild(r), r.textContent = n[0], r.offsetHeight > a)
+  }), e.appendChild(r), r.textContent = o[0], r.offsetHeight > a)
     return r.remove(), !1;
-  let g = 1, d = n.length;
-  for (; g < d; ) {
-    const m = Math.ceil((g + d) / 2);
-    r.textContent = n.slice(0, m).join(" "), r.offsetHeight <= a ? g = m : d = m - 1;
+  let l = 1, h = o.length;
+  for (; l < h; ) {
+    const f = Math.ceil((l + h) / 2);
+    r.textContent = o.slice(0, f).join(" "), r.offsetHeight <= a ? l = f : h = f - 1;
   }
-  if (r.remove(), g >= n.length) return !1;
+  if (r.remove(), l >= o.length) return !1;
   const c = document.createElement(i);
-  c.setAttribute("style", o), c.textContent = n.slice(0, g).join(" ");
-  const l = document.createElement(i);
-  return l.setAttribute("style", o), l.textContent = n.slice(g).join(" "), e.insertBefore(c, t), e.insertBefore(l, t), t.remove(), !0;
+  c.setAttribute("style", n), c.textContent = o.slice(0, l).join(" ");
+  const g = document.createElement(i);
+  return g.setAttribute("style", n), g.textContent = o.slice(l).join(" "), e.insertBefore(c, t), e.insertBefore(g, t), t.remove(), !0;
 }
-function j(t, e) {
+function O(t, e) {
   let a = 0;
   for (; a < t.children.length; ) {
-    const n = t.children[a], i = n.offsetTop, o = i + n.offsetHeight, s = (Math.floor(i / e) + 1) * e;
-    if (o > s) {
+    const o = t.children[a], i = o.offsetTop, n = i + o.offsetHeight, s = (Math.floor(i / e) + 1) * e;
+    if (n > s) {
       const r = s - i;
-      if (n.tagName === "TABLE") {
+      if (o.tagName === "TABLE") {
         if (U(
-          n,
+          o,
           t,
           r
         ))
           continue;
-      } else if (_(n, t, r))
+      } else if (_(o, t, r))
         continue;
-      if (n.offsetHeight <= e) {
-        const g = document.createElement("div");
-        g.style.height = s - i + 1 + "px", n.parentNode.insertBefore(g, n), a++;
+      if (o.offsetHeight <= e) {
+        const l = document.createElement("div");
+        l.style.height = s - i + 1 + "px", o.parentNode.insertBefore(l, o), a++;
       }
     }
     a++;
   }
 }
 function J(t, e = {}) {
-  const a = P(e), n = N(), i = B(t, a.pageWidth);
-  E(i);
-  const o = x(i, a);
-  return T(i, o.pageContentPx), R(i, o.pageContentPx), j(i, o.pageContentPx), {
+  const a = S(e), o = N(), i = E(t, a.pageWidth);
+  T(i);
+  const n = B(i, a);
+  return R(i, n.pageContentPx), j(i, n.pageContentPx), O(i, n.pageContentPx), {
     clone: i,
-    layout: o,
+    layout: n,
     options: a,
     cleanup: () => {
-      i.remove(), n();
+      i.remove(), o();
     }
   };
 }
 async function Y(t, e, a = {}) {
-  const { clone: n, layout: i, options: o, cleanup: s } = J(e, a);
+  const { clone: o, layout: i, options: n, cleanup: s } = J(e, a);
   try {
     await new Promise((r) => {
-      t.html(n, {
+      t.html(o, {
         callback: () => r(),
         width: i.contentWidthMm,
         windowWidth: i.renderedWidth,
         margin: [
-          o.margin.top,
-          o.margin.right,
-          o.margin.bottom,
-          o.margin.left
+          n.margin.top,
+          n.margin.right,
+          n.margin.bottom,
+          n.margin.left
         ]
       });
     });
@@ -220,7 +220,7 @@ async function Y(t, e, a = {}) {
   }
   return a.marginContent && await z(t, a.marginContent, a), t;
 }
-function k(t, e) {
+function I(t, e) {
   switch (t) {
     case "top":
       return { x: 0, y: 0, width: e.pageWidth, height: e.margin.top };
@@ -242,7 +242,7 @@ function k(t, e) {
       };
   }
 }
-async function L(t, e, a, n) {
+async function L(t, e, a, o) {
   const i = document.createElement("div");
   Object.assign(i.style, {
     position: "fixed",
@@ -253,8 +253,8 @@ async function L(t, e, a, n) {
     overflow: "hidden"
   }), i.appendChild(t), document.body.appendChild(i);
   try {
-    return await W(i, {
-      scale: n,
+    return await P(i, {
+      scale: o,
       backgroundColor: null
     });
   } finally {
@@ -263,20 +263,20 @@ async function L(t, e, a, n) {
 }
 const G = ["top", "right", "bottom", "left"];
 async function D(t, e, a) {
-  const n = {};
+  const o = {};
   for (const i of G) {
-    const o = t[i];
-    if (o && typeof o != "function") {
-      const s = k(i, e);
-      n[i] = await L(
-        o.cloneNode(!0),
+    const n = t[i];
+    if (n && typeof n != "function") {
+      const s = I(i, e);
+      o[i] = await L(
+        n.cloneNode(!0),
         s.width,
         s.height,
         a
       );
     }
   }
-  return n;
+  return o;
 }
 function Q(t, e) {
   return t == null ? e.margin : typeof t == "number" ? { top: t, right: t, bottom: t, left: t } : {
@@ -286,59 +286,49 @@ function Q(t, e) {
     left: t.left ?? e.margin.left
   };
 }
-function Z(t, e, a, n, i, o, s) {
+function Z(t, e, a, o, i, n, s) {
   const {
     text: r,
-    color: g = "#000000",
-    fontSize: d = 2.5,
+    color: l = "#000000",
+    fontSize: h = 2.5,
     fontFamily: c = "Arial, sans-serif"
-  } = e, l = d * a, m = (e.gap ?? d * 0.5) * a;
-  t.save(), t.fillStyle = g, t.font = `${l}px ${c}`, t.textBaseline = "middle";
-  const h = t.measureText(r).width + m, f = l * 0.5;
-  t.save(), t.beginPath(), t.rect(
-    n + f,
-    i - l,
-    o - f * 2,
-    l * 2
-  ), t.clip();
-  for (let u = n + f; u < n + o - f; u += h)
-    t.fillText(r, u, i);
-  t.restore(), t.save(), t.beginPath(), t.rect(
-    n + f,
-    i + s - l,
-    o - f * 2,
-    l * 2
-  ), t.clip();
-  for (let u = n + f; u < n + o - f; u += h)
-    t.fillText(r, u, i + s);
-  t.restore(), t.save(), t.translate(n, i + s), t.rotate(-Math.PI / 2), t.beginPath(), t.rect(f, -l, s - f * 2, l * 2), t.clip();
-  for (let u = f; u < s - f; u += h)
-    t.fillText(r, u, 0);
-  t.restore(), t.save(), t.translate(n + o, i), t.rotate(Math.PI / 2), t.beginPath(), t.rect(f, -l, s - f * 2, l * 2), t.clip();
-  for (let u = f; u < s - f; u += h)
-    t.fillText(r, u, 0);
-  t.restore(), t.restore();
+  } = e, g = h * a, f = (e.gap ?? h * 0.5) * a;
+  t.save(), t.fillStyle = l, t.font = `${g}px ${c}`, t.textBaseline = "middle";
+  const d = t.measureText(r).width, m = d + f, w = g * 0.2, C = (p, u, y) => {
+    for (let H = p; H < u; H += m)
+      if (H + d <= u)
+        y(H, r);
+      else
+        for (let b = r.length - 1; b >= 1; b--) {
+          const W = r.substring(0, b);
+          if (H + t.measureText(W).width <= u) {
+            y(H, W);
+            break;
+          }
+        }
+  }, x = o + w, v = o + n - w;
+  C(x, v, (p, u) => t.fillText(u, p, i)), C(x, v, (p, u) => t.fillText(u, p, i + s)), t.save(), t.translate(o, i + s), t.rotate(-Math.PI / 2), C(w, s - w, (p, u) => t.fillText(u, p, 0)), t.restore(), t.save(), t.translate(o + n, i), t.rotate(Math.PI / 2), C(w, s - w, (p, u) => t.fillText(u, p, 0)), t.restore(), t.restore();
 }
-function I(t, e) {
+function k(t, e) {
   return Q(t.margin, e);
 }
-async function F(t, e, a, n, i, o, s, r) {
-  for (const g of G) {
-    const d = e[g];
-    if (!d) continue;
-    const c = k(g, n);
-    let l;
-    typeof d == "function" ? l = await L(
-      d(o, s),
+async function F(t, e, a, o, i, n, s, r) {
+  for (const l of G) {
+    const h = e[l];
+    if (!h) continue;
+    const c = I(l, o);
+    let g;
+    typeof h == "function" ? g = await L(
+      h(n, s),
       c.width,
       c.height,
       r
-    ) : l = a[g], t.drawImage(
-      l,
+    ) : g = a[l], t.drawImage(
+      g,
       0,
       0,
-      l.width,
-      l.height,
+      g.width,
+      g.height,
       Math.round(c.x * i),
       Math.round(c.y * i),
       Math.round(c.width * i),
@@ -346,145 +336,145 @@ async function F(t, e, a, n, i, o, s, r) {
     );
   }
   if (e.contentBorder) {
-    const { color: g = "#000000", width: d = 0.3 } = e.contentBorder, c = I(e.contentBorder, n);
-    t.strokeStyle = g, t.lineWidth = d * i, t.strokeRect(
+    const { color: l = "#000000", width: h = 0.3 } = e.contentBorder, c = k(e.contentBorder, o);
+    t.strokeStyle = l, t.lineWidth = h * i, t.strokeRect(
       Math.round(c.left * i),
       Math.round(c.top * i),
-      Math.round((n.pageWidth - c.left - c.right) * i),
-      Math.round((n.pageHeight - c.top - c.bottom) * i)
+      Math.round((o.pageWidth - c.left - c.right) * i),
+      Math.round((o.pageHeight - c.top - c.bottom) * i)
     );
   }
   if (e.textBorder) {
-    const g = I(e.textBorder, n);
+    const l = k(e.textBorder, o);
     Z(
       t,
       e.textBorder,
       i,
-      Math.round(g.left * i),
-      Math.round(g.top * i),
-      Math.round((n.pageWidth - g.left - g.right) * i),
-      Math.round((n.pageHeight - g.top - g.bottom) * i)
+      Math.round(l.left * i),
+      Math.round(l.top * i),
+      Math.round((o.pageWidth - l.left - l.right) * i),
+      Math.round((o.pageHeight - l.top - l.bottom) * i)
     );
   }
 }
 async function X(t, e = {}) {
-  const { imageFormat: a = "JPEG", imageQuality: n = 1, scale: i = 2 } = e, o = P(e), s = N(), r = B(t, o.pageWidth);
-  r.style.opacity = "1", r.style.left = "-99999px", E(r);
-  const g = x(r, o);
-  T(r, g.pageContentPx), R(r, g.pageContentPx), j(r, g.pageContentPx);
+  const { imageFormat: a = "JPEG", imageQuality: o = 1, scale: i = 2 } = e, n = S(e), s = N(), r = E(t, n.pageWidth);
+  r.style.opacity = "1", r.style.left = "-99999px", T(r);
+  const l = B(r, n);
+  R(r, l.pageContentPx), j(r, l.pageContentPx), O(r, l.pageContentPx);
   try {
-    const d = await W(r, {
+    const h = await P(r, {
       scale: i,
       backgroundColor: "#ffffff"
-    }), { jsPDF: c } = await import("jspdf"), l = o.pageWidth - o.margin.left - o.margin.right, m = o.pageHeight - o.margin.top - o.margin.bottom, h = d.width, f = m / l * h, u = Math.ceil(d.height / f), H = o.pageWidth > o.pageHeight ? "l" : "p", v = new c({
-      orientation: H,
+    }), { jsPDF: c } = await import("jspdf"), g = n.pageWidth - n.margin.left - n.margin.right, f = n.pageHeight - n.margin.top - n.margin.bottom, d = h.width, m = f / g * d, w = Math.ceil(h.height / m), C = n.pageWidth > n.pageHeight ? "l" : "p", x = new c({
+      orientation: C,
       unit: "mm",
-      format: [o.pageWidth, o.pageHeight]
+      format: [n.pageWidth, n.pageHeight]
     });
-    for (let w = 0; w < u; w++) {
-      const y = Math.min(
-        f,
-        d.height - w * f
-      ), b = document.createElement("canvas");
-      b.width = h, b.height = y;
-      const p = b.getContext("2d");
-      if (!p) throw new Error("Could not get canvas context");
-      p.fillStyle = "#ffffff", p.fillRect(0, 0, h, y), p.drawImage(
-        d,
-        0,
-        w * f,
+    for (let v = 0; v < w; v++) {
+      const p = Math.min(
+        m,
+        h.height - v * m
+      ), u = document.createElement("canvas");
+      u.width = d, u.height = p;
+      const y = u.getContext("2d");
+      if (!y) throw new Error("Could not get canvas context");
+      y.fillStyle = "#ffffff", y.fillRect(0, 0, d, p), y.drawImage(
         h,
-        y,
+        0,
+        v * m,
+        d,
+        p,
         0,
         0,
-        h,
-        y
+        d,
+        p
       );
-      const A = b.toDataURL(
+      const H = u.toDataURL(
         `image/${a.toLowerCase()}`,
-        n
+        o
       );
-      w > 0 && v.addPage([o.pageWidth, o.pageHeight], H);
-      const C = y / h * l;
-      v.addImage(
-        A,
+      v > 0 && x.addPage([n.pageWidth, n.pageHeight], C);
+      const b = p / d * g;
+      x.addImage(
+        H,
         a,
-        o.margin.left,
-        o.margin.top,
-        l,
-        C,
+        n.margin.left,
+        n.margin.top,
+        g,
+        b,
         void 0,
         "FAST"
       );
     }
-    return e.marginContent && await z(v, e.marginContent, e), v;
+    return e.marginContent && await z(x, e.marginContent, e), x;
   } finally {
     r.remove(), s();
   }
 }
 async function K(t, e = {}) {
-  const { imageFormat: a = "PNG", imageQuality: n = 1, scale: i = 2 } = e, o = P(e), s = N(), r = B(t, o.pageWidth);
-  r.style.opacity = "1", r.style.left = "-99999px", E(r);
-  const g = x(r, o);
-  T(r, g.pageContentPx), R(r, g.pageContentPx), j(r, g.pageContentPx);
+  const { imageFormat: a = "PNG", imageQuality: o = 1, scale: i = 2 } = e, n = S(e), s = N(), r = E(t, n.pageWidth);
+  r.style.opacity = "1", r.style.left = "-99999px", T(r);
+  const l = B(r, n);
+  R(r, l.pageContentPx), j(r, l.pageContentPx), O(r, l.pageContentPx);
   try {
-    const d = await W(r, {
+    const h = await P(r, {
       scale: i,
       backgroundColor: "#ffffff"
-    }), c = o.pageWidth - o.margin.left - o.margin.right, l = o.pageHeight - o.margin.top - o.margin.bottom, m = d.width, h = l / c * m, f = m / c, u = Math.round(o.pageWidth * f), H = Math.round(o.pageHeight * f), v = Math.round(o.margin.top * f), w = Math.round(o.margin.left * f), y = Math.ceil(d.height / h), b = [], { marginContent: p } = e, A = p ? await D(p, o, i) : {};
-    for (let C = 0; C < y; C++) {
-      const O = Math.min(
-        h,
-        d.height - C * h
-      ), S = document.createElement("canvas");
-      S.width = u, S.height = H;
-      const M = S.getContext("2d");
-      if (!M) throw new Error("Could not get canvas context");
-      M.fillStyle = "#ffffff", M.fillRect(0, 0, u, H), M.drawImage(
+    }), c = n.pageWidth - n.margin.left - n.margin.right, g = n.pageHeight - n.margin.top - n.margin.bottom, f = h.width, d = g / c * f, m = f / c, w = Math.round(n.pageWidth * m), C = Math.round(n.pageHeight * m), x = Math.round(n.margin.top * m), v = Math.round(n.margin.left * m), p = Math.ceil(h.height / d), u = [], { marginContent: y } = e, H = y ? await D(y, n, i) : {};
+    for (let b = 0; b < p; b++) {
+      const W = Math.min(
         d,
+        h.height - b * d
+      ), A = document.createElement("canvas");
+      A.width = w, A.height = C;
+      const M = A.getContext("2d");
+      if (!M) throw new Error("Could not get canvas context");
+      M.fillStyle = "#ffffff", M.fillRect(0, 0, w, C), M.drawImage(
+        h,
         0,
-        C * h,
-        m,
-        O,
-        w,
+        b * d,
+        f,
+        W,
         v,
-        m,
-        O
-      ), p && await F(
-        M,
-        p,
-        A,
-        o,
+        x,
         f,
-        C + 1,
+        W
+      ), y && await F(
+        M,
         y,
+        H,
+        n,
+        m,
+        b + 1,
+        p,
         i
-      ), b.push(
-        S.toDataURL(
+      ), u.push(
+        A.toDataURL(
           `image/${a.toLowerCase()}`,
-          n
+          o
         )
       );
     }
-    return b;
+    return u;
   } finally {
     r.remove(), s();
   }
 }
 async function tt(t, e, a = {}) {
-  const n = P(a), i = await K(t, a);
+  const o = S(a), i = await K(t, a);
   e.innerHTML = "", Object.assign(e.style, {
     direction: "ltr",
     width: "fit-content",
-    height: n.pageHeight + "mm",
+    height: o.pageHeight + "mm",
     maxHeight: "100vh",
     overflowY: "auto",
     background: "#e0e0e0"
   });
-  for (let o = 0; o < i.length; o++) {
+  for (let n = 0; n < i.length; n++) {
     const s = document.createElement("img");
-    s.src = i[o], s.alt = `Page ${o + 1}`, Object.assign(s.style, {
-      width: n.pageWidth + "mm",
+    s.src = i[n], s.alt = `Page ${n + 1}`, Object.assign(s.style, {
+      width: o.pageWidth + "mm",
       maxWidth: "100%",
       height: "auto",
       boxSizing: "border-box",
@@ -496,28 +486,28 @@ async function tt(t, e, a = {}) {
   }
 }
 async function z(t, e, a = {}) {
-  const n = P(a), i = t.getNumberOfPages(), o = 2, s = o * (96 / 25.4), r = Math.round(n.pageWidth * s), g = Math.round(n.pageHeight * s), d = await D(e, n, o);
+  const o = S(a), i = t.getNumberOfPages(), n = 2, s = n * (96 / 25.4), r = Math.round(o.pageWidth * s), l = Math.round(o.pageHeight * s), h = await D(e, o, n);
   for (let c = 1; c <= i; c++) {
     t.setPage(c);
-    const l = document.createElement("canvas");
-    l.width = r, l.height = g;
-    const m = l.getContext("2d");
-    m && (await F(
-      m,
+    const g = document.createElement("canvas");
+    g.width = r, g.height = l;
+    const f = g.getContext("2d");
+    f && (await F(
+      f,
       e,
-      d,
-      n,
+      h,
+      o,
       s,
       c,
       i,
-      o
+      n
     ), t.addImage(
-      l.toDataURL("image/png"),
+      g.toDataURL("image/png"),
       "PNG",
       0,
       0,
-      n.pageWidth,
-      n.pageHeight
+      o.pageWidth,
+      o.pageHeight
     ));
   }
   return t;
@@ -526,15 +516,15 @@ export {
   $ as PAGE_MARGINS,
   q as PAGE_SIZES,
   z as addMarginContent,
-  x as computeLayout,
-  B as createPrintClone,
-  j as insertPageBreakSpacers,
-  E as normalizeTableAttributes,
+  B as computeLayout,
+  E as createPrintClone,
+  O as insertPageBreakSpacers,
+  T as normalizeTableAttributes,
   J as prepare,
   tt as previewPageImages,
   Y as renderHTML,
   X as renderImagePDF,
   K as renderPageImages,
-  T as splitOversizedTables,
-  R as splitOversizedText
+  R as splitOversizedTables,
+  j as splitOversizedText
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jspdf-utils",
-  "version": "0.1.10",
+  "version": "0.1.11",
   "description": "Utility helpers for jsPDF's doc.html() renderer with automatic page breaking, table splitting, and RTL support",
   "type": "module",
   "main": "dist/html-to-pdf.js",