@pixldocs/canvas-renderer 0.5.64 → 0.5.66

package/dist/index.d.ts

@@ -254,7 +254,7 @@ export declare function normalizeFontFamily(fontStack: string): string;
  * Package version banner. Bump alongside package.json so we can confirm
  * (via browser:log) that the deployed bundle matches the expected build.
  */
-export declare const PACKAGE_VERSION = "0.5.64";
+export declare const PACKAGE_VERSION = "0.5.66";
 
 export declare interface PageSettings {
     backgroundColor?: string;
@@ -272,6 +272,8 @@ export declare interface PdfAssemblyOptions {
     stripPageBackground?: boolean;
     /** Base URL for TTF font files (e.g. 'https://pixldocs.com/fonts/' or '/fonts/'). Required for correct font rendering. */
     fontBaseUrl?: string;
+    /** Convert SVG text to paths before svg2pdf for preview/PDF font metric parity. Default: true. */
+    outlineText?: boolean;
 }
 
 /** Options for PDF rendering */

package/dist/index.js

@@ -12542,7 +12542,7 @@ function PixldocsPreview(props) {
     !canvasSettled && /* @__PURE__ */ jsx("div", { style: { position: "absolute", inset: 0, display: "flex", alignItems: "center", justifyContent: "center", minHeight: 200 }, children: /* @__PURE__ */ jsx("div", { style: { color: "#888", fontSize: 14 }, children: "Loading preview..." }) })
   ] });
 }
-const PACKAGE_VERSION = "0.5.64";
+const PACKAGE_VERSION = "0.5.66";
 let __underlineFixInstalled = false;
 function installUnderlineFix(fab) {
   var _a;
@@ -13258,6 +13258,7 @@ class PixldocsRenderer {
   captureSvgViaPreviewCanvas(config, pageIndex, canvasWidth, canvasHeight) {
     return new Promise(async (resolve, reject) => {
       const { PreviewCanvas: PreviewCanvas2 } = await Promise.resolve().then(() => PreviewCanvas$1);
+      const hasAutoShrink = configHasAutoShrinkText(config);
       const container = document.createElement("div");
       container.style.cssText = `
         position: fixed; left: -99999px; top: -99999px;
@@ -13270,6 +13271,8 @@ class PixldocsRenderer {
         reject(new Error("SVG render timeout (30s)"));
       }, 3e4);
       let root = null;
+      let mountKey = 0;
+      let didPreviewParityRemount = false;
       const cleanup = () => {
         clearTimeout(timeout);
         try {
@@ -13278,6 +13281,48 @@ class PixldocsRenderer {
         }
         container.remove();
       };
+      const mountPreview = (readyHandler) => {
+        root = createRoot(container);
+        root.render(
+          createElement(PreviewCanvas2, {
+            key: `svg-capture-${mountKey}`,
+            config,
+            pageIndex,
+            zoom: 1,
+            absoluteZoom: true,
+            skipFontReadyWait: false,
+            onReady: readyHandler
+          })
+        );
+      };
+      const remountForPreviewParity = async () => {
+        if (didPreviewParityRemount) return;
+        didPreviewParityRemount = true;
+        mountKey += 1;
+        try {
+          clearMeasurementCache();
+        } catch {
+        }
+        try {
+          clearFabricCharCache();
+        } catch {
+        }
+        try {
+          root == null ? void 0 : root.unmount();
+        } catch {
+        }
+        await new Promise((settle) => {
+          mountPreview(() => {
+            this.waitForCanvasScene(container, config, pageIndex).then(async () => {
+              const expectedImageCount = this.getExpectedImageCount(config, pageIndex);
+              await this.waitForCanvasImages(container, expectedImageCount);
+              await this.waitForStableTextMetrics(container, config);
+              await this.waitForCanvasScene(container, config, pageIndex);
+              settle();
+            }).catch(() => settle());
+          });
+        });
+      };
       const onReady = () => {
         this.waitForCanvasScene(container, config, pageIndex).then(async () => {
           var _a, _b;
@@ -13286,6 +13331,10 @@ class PixldocsRenderer {
             await this.waitForCanvasImages(container, expectedImageCount);
             await this.waitForStableTextMetrics(container, config);
             await this.waitForCanvasScene(container, config, pageIndex);
+            if (hasAutoShrink && !didPreviewParityRemount) {
+              console.log("[canvas-renderer][svg-parity] remounting once to match PixldocsPreview auto-shrink stabilization");
+              await remountForPreviewParity();
+            }
             const fabricInstance = this.getFabricCanvasFromContainer(container);
             if (!fabricInstance) {
               cleanup();
@@ -13334,18 +13383,7 @@ class PixldocsRenderer {
           }
         });
       };
-      root = createRoot(container);
-      root.render(
-        createElement(PreviewCanvas2, {
-          config,
-          pageIndex,
-          zoom: 1,
-          // 1:1 — no UI scaling for SVG capture
-          absoluteZoom: true,
-          skipFontReadyWait: false,
-          onReady
-        })
-      );
+      mountPreview(onReady);
     });
   }
   /**
@@ -15160,6 +15198,14 @@ async function svg2pdfWithDomMount(svg, pdf, opts) {
 async function convertTextDecorationsToLines(svg) {
   const doc = svg.ownerDocument;
   if (!doc) return;
+  const stripTextDecoration = (el) => {
+    el.removeAttribute("text-decoration");
+    const style = el.getAttribute("style") || "";
+    if (!style) return;
+    const kept = style.split(";").map((part) => part.trim()).filter(Boolean).filter((part) => !/^text-decoration\s*:/i.test(part));
+    if (kept.length > 0) el.setAttribute("style", kept.join("; "));
+    else el.removeAttribute("style");
+  };
   const resolveInheritedSvgValue = (el, attr, styleProp = attr) => {
     var _a, _b;
     let current = el;
@@ -15310,6 +15356,8 @@ async function convertTextDecorationsToLines(svg) {
       if (textEl.parentElement) {
         textEl.parentElement.insertBefore(line, textEl.nextSibling);
       }
+      stripTextDecoration(tspan);
+      if (textHasUnderline) stripTextDecoration(textEl);
     }
   }
   if (tempContainer) {
@@ -15548,7 +15596,7 @@ function drawPageBackground(pdf, pageIndex, pageWidth, pageHeight, backgroundCol
   }
 }
 async function assemblePdfFromSvgs(svgResults, options = {}) {
-  var _a, _b;
+  var _a, _b, _c;
   if (svgResults.length === 0) throw new Error("No pages to export");
   const { title, stripPageBackground } = options;
   const firstPage = svgResults[0];
@@ -15576,17 +15624,33 @@ async function assemblePdfFromSvgs(svgResults, options = {}) {
     const hasGradient = !!((_b = (_a = page.backgroundGradient) == null ? void 0 : _a.stops) == null ? void 0 : _b.length);
     drawPageBackground(pdf, i, page.width, page.height, page.backgroundColor, page.backgroundGradient);
     const shouldStripBg = stripPageBackground ?? hasGradient;
+    const shouldOutlineText = options.outlineText ?? true;
     const pageSvg = page.svg;
     let processedSvg = await prepareLiveCanvasSvgForPdf(pageSvg, page.width, page.height, `page-${i + 1}`, {
       stripPageBackground: shouldStripBg
     });
     if (processedSvg) {
-      const svgStr = new XMLSerializer().serializeToString(processedSvg);
-      const rewrittenSvg = rewriteSvgFontsForJsPDF(svgStr);
+      await convertTextDecorationsToLines(processedSvg);
+      if (shouldOutlineText) {
+        try {
+          const { convertAllTextToPath } = await import("./svgTextToPath-BP0Kppla.js");
+          const outlinedSvg = await convertAllTextToPath(
+            new XMLSerializer().serializeToString(processedSvg),
+            fontBaseUrl
+          );
+          const outlineDoc = new DOMParser().parseFromString(outlinedSvg, "image/svg+xml");
+          const outlinedRoot = outlineDoc.documentElement;
+          if (outlinedRoot && ((_c = outlinedRoot.tagName) == null ? void 0 : _c.toLowerCase()) === "svg" && !outlineDoc.querySelector("parsererror")) {
+            processedSvg = outlinedRoot;
+          }
+        } catch (outlineErr) {
+          console.warn("[canvas-renderer][pdf] text outlining unavailable, falling back to embedded SVG text:", outlineErr);
+        }
+      }
+      const rewrittenSvg = rewriteSvgFontsForJsPDF(new XMLSerializer().serializeToString(processedSvg));
       const reParser = new DOMParser();
       const reDoc = reParser.parseFromString(rewrittenSvg, "image/svg+xml");
       processedSvg = reDoc.documentElement;
-      await convertTextDecorationsToLines(processedSvg);
     }
     if (processedSvg) {
       pdf.setFillColor(0, 0, 0);