@pixldocs/canvas-renderer 0.5.67 → 0.5.68

package/dist/index.cjs

@@ -12142,1384 +12142,19 @@ function paintRepeatableSections(config, repeatableSections) {
     }
   }
 }
-function normalizeFontFamily(fontStack) {
-  const first = fontStack.split(",")[0].trim();
-  return first.replace(/^['"]|['"]$/g, "");
-}
-const loadedFonts = /* @__PURE__ */ new Set();
-const loadingPromises = /* @__PURE__ */ new Map();
-function withTimeout(promise, timeoutMs = 4e3) {
-  let timeoutId;
-  return Promise.race([
-    promise,
-    new Promise((resolve) => {
-      timeoutId = setTimeout(resolve, timeoutMs);
-    })
-  ]).finally(() => {
-    if (timeoutId) clearTimeout(timeoutId);
-  });
-}
-async function loadGoogleFontCSS(rawFontFamily) {
-  if (!rawFontFamily || typeof document === "undefined") return;
-  const fontFamily = normalizeFontFamily(rawFontFamily);
-  if (!fontFamily) return;
-  if (loadedFonts.has(fontFamily)) return;
-  const existing = loadingPromises.get(fontFamily);
-  if (existing) return existing;
-  const promise = (async () => {
-    try {
-      const encoded = encodeURIComponent(fontFamily);
-      const url = `https://fonts.googleapis.com/css?family=${encoded}:300,400,500,600,700&display=swap`;
-      const link = document.createElement("link");
-      link.rel = "stylesheet";
-      link.href = url;
-      link.crossOrigin = "anonymous";
-      await new Promise((resolve, reject) => {
-        link.onload = () => resolve();
-        link.onerror = () => reject(new Error(`Failed to load font: ${fontFamily}`));
-        document.head.appendChild(link);
-      });
-      loadedFonts.add(fontFamily);
-    } catch (e) {
-      console.warn(`[@pixldocs/canvas-renderer] Font load failed: ${fontFamily}`, e);
-    }
-  })();
-  loadingPromises.set(fontFamily, promise);
-  await promise;
-  loadingPromises.delete(fontFamily);
-}
-function collectFontsFromConfig(config) {
-  var _a;
-  const fonts = /* @__PURE__ */ new Set();
-  fonts.add("Open Sans");
-  fonts.add("Hind");
-  function walk(nodes) {
-    var _a2;
-    if (!nodes) return;
-    for (const node of nodes) {
-      if (node.fontFamily) fonts.add(normalizeFontFamily(node.fontFamily));
-      if ((_a2 = node.smartProps) == null ? void 0 : _a2.fontFamily) fonts.add(normalizeFontFamily(node.smartProps.fontFamily));
-      if (node.styles && Array.isArray(node.styles)) {
-        for (const lineStyle of node.styles) {
-          if (lineStyle && typeof lineStyle === "object") {
-            for (const charStyle of Object.values(lineStyle)) {
-              if (charStyle == null ? void 0 : charStyle.fontFamily) fonts.add(normalizeFontFamily(charStyle.fontFamily));
-            }
-          }
-        }
-      }
-      if (node.children) walk(node.children);
-    }
-  }
-  for (const page of config.pages || []) {
-    walk(page.children || []);
-  }
-  if ((_a = config.themeConfig) == null ? void 0 : _a.variables) {
-    for (const def of Object.values(config.themeConfig.variables)) {
-      if (def.value && typeof def.value === "string" && !def.value.startsWith("#") && !def.value.startsWith("rgb")) {
-        if (def.label && /font/i.test(def.label)) {
-          fonts.add(normalizeFontFamily(def.value));
-        }
-      }
-    }
-  }
-  return fonts;
-}
-function collectFontDescriptorsFromConfig(config) {
-  var _a;
-  const seen = /* @__PURE__ */ new Set();
-  const descriptors = [];
-  function add(family, weight, style) {
-    const f = normalizeFontFamily(family);
-    if (!f) return;
-    const w = weight ?? 400;
-    const s = style ?? "normal";
-    const key = `${f}|${w}|${s}`;
-    if (seen.has(key)) return;
-    seen.add(key);
-    descriptors.push({ family: f, weight: w, style: s });
-  }
-  function walk(nodes) {
-    var _a2;
-    if (!nodes) return;
-    for (const node of nodes) {
-      if (node.fontFamily) {
-        add(node.fontFamily, node.fontWeight, node.fontStyle);
-        if (node.type === "text") {
-          for (const w of [300, 400, 500, 600, 700]) {
-            add(node.fontFamily, w, node.fontStyle);
-          }
-        }
-      }
-      if ((_a2 = node.smartProps) == null ? void 0 : _a2.fontFamily) {
-        add(node.smartProps.fontFamily, node.smartProps.fontWeight, node.smartProps.fontStyle);
-      }
-      if (node.styles) {
-        const styleEntries = Array.isArray(node.styles) ? node.styles : Object.values(node.styles);
-        for (const lineStyle of styleEntries) {
-          if (lineStyle && typeof lineStyle === "object") {
-            for (const charStyle of Object.values(lineStyle)) {
-              if (charStyle == null ? void 0 : charStyle.fontFamily) {
-                add(charStyle.fontFamily, charStyle.fontWeight, charStyle.fontStyle);
-              }
-            }
-          }
-        }
-      }
-      if (node.children) walk(node.children);
-    }
-  }
-  add("Open Sans", 400, "normal");
-  add("Hind", 400, "normal");
-  add("Hind", 700, "normal");
-  for (const page of config.pages || []) {
-    walk(page.children || []);
-  }
-  if ((_a = config.themeConfig) == null ? void 0 : _a.variables) {
-    for (const def of Object.values(config.themeConfig.variables)) {
-      if (def.value && typeof def.value === "string" && !def.value.startsWith("#") && !def.value.startsWith("rgb")) {
-        if (def.label && /font/i.test(def.label)) {
-          add(def.value);
-        }
-      }
-    }
-  }
-  return descriptors;
-}
-async function ensureFontsForResolvedConfig(config) {
-  if (typeof document === "undefined") return;
-  const descriptors = collectFontDescriptorsFromConfig(config);
-  const families = new Set(descriptors.map((d) => d.family));
-  void withTimeout(Promise.all([...families].map((f) => loadGoogleFontCSS(f))), 2500);
-  if (document.fonts) {
-    descriptors.forEach((d) => {
-      const stylePrefix = d.style === "italic" ? "italic " : "";
-      const weightStr = String(d.weight);
-      const spec = `${stylePrefix}${weightStr} 16px "${d.family}"`;
-      document.fonts.load(spec).catch(() => {
-      });
-    });
-  }
-}
-function configHasAutoShrinkText$1(config) {
-  var _a;
-  if (!((_a = config == null ? void 0 : config.pages) == null ? void 0 : _a.length)) return false;
-  const walk = (nodes) => {
-    for (const node of nodes || []) {
-      if (!node) continue;
-      if (node.type === "text" && node.overflowPolicy === "auto-shrink") return true;
-      if (Array.isArray(node.children) && node.children.length && walk(node.children)) return true;
-    }
-    return false;
-  };
-  for (const page of config.pages) {
-    if (walk(page.children || [])) return true;
-  }
-  return false;
-}
-async function awaitFontsForConfig(config, maxWaitMs) {
-  if (typeof document === "undefined" || !document.fonts) return;
-  void ensureFontsForResolvedConfig(config);
-  const descriptors = collectFontDescriptorsFromConfig(config);
-  if (descriptors.length === 0) return;
-  const loads = Promise.all(
-    descriptors.map((d) => {
-      const stylePrefix = d.style === "italic" ? "italic " : "";
-      const spec = `${stylePrefix}${d.weight} 16px "${d.family}"`;
-      return document.fonts.load(spec).catch(() => []);
-    })
-  ).then(() => void 0);
-  await Promise.race([
-    loads,
-    new Promise((resolve) => setTimeout(resolve, maxWaitMs))
-  ]);
-  await Promise.race([
-    document.fonts.ready.catch(() => void 0).then(() => void 0),
-    new Promise((r) => setTimeout(r, Math.min(500, maxWaitMs)))
-  ]);
-  await new Promise(
-    (resolve) => requestAnimationFrame(() => requestAnimationFrame(() => resolve()))
-  );
-}
-const PREVIEW_DEBUG_PREFIX = "[canvas-renderer][preview-debug]";
-function countUnderlinedNodes(config) {
-  var _a;
-  if (!((_a = config == null ? void 0 : config.pages) == null ? void 0 : _a.length)) return 0;
-  let count = 0;
-  const walk = (nodes) => {
-    var _a2;
-    for (const node of nodes || []) {
-      if (node == null ? void 0 : node.underline) count += 1;
-      if ((_a2 = node == null ? void 0 : node.children) == null ? void 0 : _a2.length) walk(node.children);
-    }
-  };
-  for (const page of config.pages) walk(page.children || []);
-  return count;
-}
-function PixldocsPreview(props) {
-  const {
-    pageIndex = 0,
-    zoom = 1,
-    absoluteZoom = false,
-    imageProxyUrl,
-    className,
-    style,
-    onDynamicFieldClick,
-    onReady,
-    onError,
-    // Default `false` so PageCanvas blocks textbox creation until the host
-    // browser actually has the @font-face rules registered. This matters for
-    // `overflowPolicy: 'auto-shrink'` text — `createText` runs the shrink
-    // loop synchronously at mount time using whatever font metrics Fabric
-    // can measure right then. If the real font hasn't loaded yet, Fabric
-    // falls back to the system font (typically narrower), the shrink loop
-    // decides "fits, no shrink needed", and when the real font finally
-    // loads the text overflows the box.
-    //
-    // The renderer's imperative PNG/PDF paths (`renderPageViaPreviewCanvas`,
-    // `captureSvgViaPreviewCanvas`) already pass `skipFontReadyWait: false`
-    // for this exact reason — that's why the downloaded PDF was correct
-    // while the on-screen preview wasn't.
-    skipFontReadyWait = false
-  } = props;
-  react.useEffect(() => {
-    setPackageApiUrl(imageProxyUrl);
-  }, [imageProxyUrl]);
-  const [resolvedConfig, setResolvedConfig] = react.useState(null);
-  const [isLoading, setIsLoading] = react.useState(false);
-  const [fontsReady, setFontsReady] = react.useState(false);
-  const [fontsReadyVersion, setFontsReadyVersion] = react.useState(0);
-  const [canvasSettled, setCanvasSettled] = react.useState(false);
-  const [stabilizationPass, setStabilizationPass] = react.useState(0);
-  const isResolveMode = !("config" in props && props.config);
-  react.useEffect(() => {
-    if (!isResolveMode) {
-      setResolvedConfig(null);
-      setCanvasSettled(false);
-      console.log(PREVIEW_DEBUG_PREFIX, "config-mode active");
-      return;
-    }
-    const p = props;
-    if (!p.templateId || !p.formSchemaId || !p.supabaseUrl || !p.supabaseAnonKey) return;
-    let cancelled = false;
-    setIsLoading(true);
-    setFontsReady(false);
-    setCanvasSettled(false);
-    console.log(PREVIEW_DEBUG_PREFIX, "resolve-start", {
-      templateId: p.templateId,
-      formSchemaId: p.formSchemaId,
-      themeId: p.themeId ?? null,
-      pageIndex
-    });
-    resolveFromForm({
-      templateId: p.templateId,
-      formSchemaId: p.formSchemaId,
-      sectionState: p.sectionState,
-      themeId: p.themeId,
-      supabaseUrl: p.supabaseUrl,
-      supabaseAnonKey: p.supabaseAnonKey
-    }).then((resolved) => {
-      var _a, _b;
-      if (!cancelled) {
-        console.log(PREVIEW_DEBUG_PREFIX, "resolve-done", {
-          pages: ((_b = (_a = resolved.config) == null ? void 0 : _a.pages) == null ? void 0 : _b.length) ?? 0,
-          underlinedNodes: countUnderlinedNodes(resolved.config)
-        });
-        setResolvedConfig(resolved.config);
-        const hasAutoShrink = configHasAutoShrinkText$1(resolved.config);
-        const waitMs = hasAutoShrink ? 4e3 : 1800;
-        awaitFontsForConfig(resolved.config, waitMs).then(() => {
-          if (!cancelled) {
-            console.log(PREVIEW_DEBUG_PREFIX, "resolve-mode fonts settled", { hasAutoShrink, waitMs });
-            setFontsReady(true);
-            setIsLoading(false);
-          }
-        }).catch((err) => {
-          if (!cancelled) {
-            console.warn(PREVIEW_DEBUG_PREFIX, "resolve-mode font wait failed", err);
-            setFontsReady(true);
-            setIsLoading(false);
-          }
-        });
-      }
-    }).catch((err) => {
-      if (!cancelled) {
-        setIsLoading(false);
-        console.warn(PREVIEW_DEBUG_PREFIX, "resolve-error", err);
-        onError == null ? void 0 : onError(err instanceof Error ? err : new Error(String(err)));
-      }
-    });
-    return () => {
-      cancelled = true;
-    };
-  }, [
-    isResolveMode,
-    // For resolve mode, re-resolve when these change
-    isResolveMode ? props.templateId : void 0,
-    isResolveMode ? props.formSchemaId : void 0,
-    isResolveMode ? JSON.stringify(props.sectionState) : void 0,
-    isResolveMode ? props.themeId : void 0
-  ]);
-  const config = isResolveMode ? resolvedConfig : props.config;
-  react.useEffect(() => {
-    var _a, _b, _c;
-    if (!config) return;
-    let cancelled = false;
-    setCanvasSettled(false);
-    setStabilizationPass(0);
-    console.log(PREVIEW_DEBUG_PREFIX, "config-changed", {
-      pageIndex,
-      pages: ((_a = config.pages) == null ? void 0 : _a.length) ?? 0,
-      underlinedNodes: countUnderlinedNodes(config),
-      isResolveMode
-    });
-    const bump = () => {
-      if (cancelled) return;
-      clearMeasurementCache();
-      clearFabricCharCache();
-      setFontsReadyVersion((v) => {
-        const next = v + 1;
-        console.log(PREVIEW_DEBUG_PREFIX, "font-bump", { pageIndex, next, stabilizationPass });
-        return next;
-      });
-    };
-    (_c = (_b = document.fonts) == null ? void 0 : _b.ready) == null ? void 0 : _c.then(bump);
-    const timeoutId = window.setTimeout(bump, 350);
-    return () => {
-      cancelled = true;
-      window.clearTimeout(timeoutId);
-    };
-  }, [config]);
-  const previewKey = react.useMemo(
-    () => `${pageIndex}-${fontsReadyVersion}-${stabilizationPass}`,
-    [pageIndex, fontsReadyVersion, stabilizationPass]
-  );
-  react.useEffect(() => {
-    if (isResolveMode) return;
-    if (!config) {
-      setFontsReady(false);
-      setCanvasSettled(false);
-      setStabilizationPass(0);
-      return;
-    }
-    setFontsReady(false);
-    setCanvasSettled(false);
-    setStabilizationPass(0);
-    let cancelled = false;
-    const hasAutoShrink = configHasAutoShrinkText$1(config);
-    const waitMs = hasAutoShrink ? 4e3 : 1800;
-    awaitFontsForConfig(config, waitMs).then(() => {
-      if (cancelled) return;
-      console.log(PREVIEW_DEBUG_PREFIX, "config-mode fonts settled", {
-        pageIndex,
-        hasAutoShrink,
-        waitMs,
-        underlinedNodes: countUnderlinedNodes(config)
-      });
-      setFontsReady(true);
-    }).catch((err) => {
-      if (cancelled) return;
-      console.warn(PREVIEW_DEBUG_PREFIX, "config-mode font wait failed", err);
-      setFontsReady(true);
-    });
-    return () => {
-      cancelled = true;
-    };
-  }, [isResolveMode, config]);
-  const handleCanvasReady = react.useCallback(() => {
-    if (stabilizationPass === 0) {
-      console.log(PREVIEW_DEBUG_PREFIX, "canvas-ready-pass", { pageIndex, stabilizationPass, action: "stabilize-again" });
-      setCanvasSettled(false);
-      setStabilizationPass(1);
-      return;
-    }
-    console.log(PREVIEW_DEBUG_PREFIX, "canvas-ready-pass", { pageIndex, stabilizationPass, action: "settled" });
-    setCanvasSettled(true);
-    onReady == null ? void 0 : onReady();
-  }, [onReady, pageIndex, stabilizationPass]);
-  if (isLoading) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className, style: { ...style, display: "flex", alignItems: "center", justifyContent: "center", minHeight: 200 }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: "#888", fontSize: 14 }, children: "Loading preview..." }) });
-  }
-  if (!config) return null;
-  if (!fontsReady) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className, style: { ...style, display: "flex", alignItems: "center", justifyContent: "center", minHeight: 200 }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: "#888", fontSize: 14 }, children: "Loading preview..." }) });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, style: { ...style, position: "relative" }, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { style: { visibility: canvasSettled ? "visible" : "hidden" }, children: /* @__PURE__ */ jsxRuntime.jsx(
-      PreviewCanvas,
-      {
-        config,
-        pageIndex,
-        zoom,
-        absoluteZoom,
-        skipFontReadyWait,
-        onDynamicFieldClick,
-        onReady: handleCanvasReady
-      },
-      previewKey
-    ) }),
-    !canvasSettled && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { position: "absolute", inset: 0, display: "flex", alignItems: "center", justifyContent: "center", minHeight: 200 }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: "#888", fontSize: 14 }, children: "Loading preview..." }) })
-  ] });
-}
-const PACKAGE_VERSION = "0.5.67";
-let __underlineFixInstalled = false;
-function installUnderlineFix(fab) {
-  var _a;
-  if (__underlineFixInstalled) return;
-  const TextProto = (_a = fab.Text) == null ? void 0 : _a.prototype;
-  if (!TextProto || typeof TextProto._renderTextDecoration !== "function") return;
-  const original = TextProto._renderTextDecoration;
-  const measureLineTextWidth = (obj, ctx, lineIndex) => {
-    var _a2, _b, _c, _d, _e, _f;
-    const rawLine = (_a2 = obj._textLines) == null ? void 0 : _a2[lineIndex];
-    const lineText = Array.isArray(rawLine) ? rawLine.join("") : String(rawLine ?? "");
-    if (!lineText) return 0;
-    const fontSize = Number(((_b = obj.getValueOfPropertyAt) == null ? void 0 : _b.call(obj, lineIndex, 0, "fontSize")) ?? obj.fontSize ?? 0);
-    const fontStyle = String(((_c = obj.getValueOfPropertyAt) == null ? void 0 : _c.call(obj, lineIndex, 0, "fontStyle")) ?? obj.fontStyle ?? "normal");
-    const fontWeight = String(((_d = obj.getValueOfPropertyAt) == null ? void 0 : _d.call(obj, lineIndex, 0, "fontWeight")) ?? obj.fontWeight ?? "400");
-    const fontFamily = String(((_e = obj.getValueOfPropertyAt) == null ? void 0 : _e.call(obj, lineIndex, 0, "fontFamily")) ?? obj.fontFamily ?? "sans-serif");
-    const charSpacing = Number(((_f = obj.getValueOfPropertyAt) == null ? void 0 : _f.call(obj, lineIndex, 0, "charSpacing")) ?? obj.charSpacing ?? 0);
-    ctx.save();
-    ctx.font = `${fontStyle} normal ${fontWeight} ${fontSize}px ${fontFamily}`;
-    const measured = ctx.measureText(lineText).width;
-    ctx.restore();
-    const graphemeCount = Array.from(lineText).length;
-    const spacingWidth = graphemeCount > 1 ? charSpacing / 1e3 * fontSize * (graphemeCount - 1) : 0;
-    return Math.max(0, measured + spacingWidth);
-  };
-  TextProto._renderTextDecoration = function patchedRenderTextDecoration(ctx, type) {
-    try {
-      const hasOwn = !!this[type];
-      const hasStyled = typeof this.styleHas === "function" && this.styleHas(type);
-      if (!hasOwn && !hasStyled) return;
-      const lines = this._textLines;
-      const offsets = this.offsets;
-      if (!Array.isArray(lines) || !offsets) {
-        return original.call(this, ctx, type);
-      }
-      const offsetY = offsets[type];
-      const offsetAligner = type === "linethrough" ? 0.5 : type === "overline" ? 1 : 0;
-      const leftOffset = this._getLeftOffset();
-      let topOffset = this._getTopOffset();
-      for (let i = 0, len = lines.length; i < len; i++) {
-        const heightOfLine = this.getHeightOfLine(i);
-        const lineHas = !!this[type] || typeof this.styleHas === "function" && this.styleHas(type, i);
-        if (!lineHas) {
-          topOffset += heightOfLine;
-          continue;
-        }
-        const fillStyle = this.getValueOfPropertyAt(i, 0, "fill");
-        const thickness = this.getValueOfPropertyAt(i, 0, "textDecorationThickness");
-        const charSize = this.getHeightOfChar(i, 0);
-        const dy = this.getValueOfPropertyAt(i, 0, "deltaY") || 0;
-        const finalThickness = this.fontSize * (thickness || 0) / 1e3;
-        if (!fillStyle || !finalThickness) {
-          topOffset += heightOfLine;
-          continue;
-        }
-        const lineWidth = measureLineTextWidth(this, ctx, i);
-        if (!lineWidth) {
-          topOffset += heightOfLine;
-          continue;
-        }
-        const availableWidth = Number(this.width ?? lineWidth);
-        let lineLeftOffset = 0;
-        const align = String(this.textAlign ?? "left");
-        if (align === "center") lineLeftOffset = (availableWidth - lineWidth) / 2;
-        else if (align === "right" || align === "end") lineLeftOffset = availableWidth - lineWidth;
-        let drawStart = leftOffset + lineLeftOffset;
-        if (this.direction === "rtl") {
-          drawStart = this.width - drawStart - lineWidth;
-        }
-        const maxHeight = heightOfLine / this.lineHeight;
-        const top = topOffset + maxHeight * (1 - this._fontSizeFraction);
-        ctx.fillStyle = fillStyle;
-        ctx.fillRect(
-          drawStart,
-          top + offsetY * charSize + dy - offsetAligner * finalThickness,
-          lineWidth,
-          finalThickness
-        );
-        topOffset += heightOfLine;
-      }
-      if (typeof this._removeShadow === "function") {
-        try {
-          this._removeShadow(ctx);
-        } catch {
-        }
-      }
-    } catch {
-      try {
-        return original.call(this, ctx, type);
-      } catch {
-      }
-    }
-  };
-  __underlineFixInstalled = true;
-  console.log(`[canvas-renderer] underline-fix monkey patch installed (v${PACKAGE_VERSION})`);
-}
-function configHasAutoShrinkText(config) {
-  var _a;
-  if (!((_a = config == null ? void 0 : config.pages) == null ? void 0 : _a.length)) return false;
-  const walk = (nodes) => {
-    for (const node of nodes || []) {
-      if (!node) continue;
-      if (node.type === "text" && node.overflowPolicy === "auto-shrink") return true;
-      if (Array.isArray(node.children) && node.children.length && walk(node.children)) return true;
-    }
-    return false;
-  };
-  for (const page of config.pages) {
-    if (walk(page.children || [])) return true;
-  }
-  return false;
-}
-class PixldocsRenderer {
-  constructor(config) {
-    __publicField(this, "config");
-    this.config = config;
-    installUnderlineFix(fabric__namespace);
-    try {
-      console.log(`[canvas-renderer] PixldocsRenderer v${PACKAGE_VERSION} initialized`);
-    } catch {
-    }
-  }
-  /**
-   * Render a pre-resolved template config to an image using the full PageCanvas engine.
-   * Mounts a hidden PreviewCanvas component and captures the Fabric canvas output.
-   */
-  async render(templateConfig, options = {}) {
-    const pageIndex = options.pageIndex ?? 0;
-    const format = options.format ?? "png";
-    const quality = options.quality ?? 0.92;
-    const pixelRatio = options.pixelRatio ?? this.config.pixelRatio ?? 2;
-    const canvasWidth = templateConfig.canvas.width;
-    const canvasHeight = templateConfig.canvas.height;
-    const page = templateConfig.pages[pageIndex];
-    if (!page) {
-      throw new Error(`Page index ${pageIndex} not found (template has ${templateConfig.pages.length} pages)`);
-    }
-    await ensureFontsForResolvedConfig(templateConfig);
-    if (!options.skipFontReadyWait) {
-      const hasAutoShrink = configHasAutoShrinkText(templateConfig);
-      const defaultWait = hasAutoShrink ? 4e3 : 1800;
-      await this.awaitFontsForConfig(templateConfig, options.waitForFontsMs ?? defaultWait);
-    }
-    const { setPackageApiUrl: setPackageApiUrl2 } = await Promise.resolve().then(() => appApi);
-    setPackageApiUrl2(this.config.imageProxyUrl);
-    const dataUrl = await this.renderPageViaPreviewCanvas(
-      templateConfig,
-      pageIndex,
-      pixelRatio,
-      format,
-      quality,
-      { skipFontReadyWait: options.skipFontReadyWait, waitForFontsMs: options.waitForFontsMs }
-    );
-    return {
-      dataUrl,
-      width: canvasWidth,
-      height: canvasHeight,
-      pixelWidth: canvasWidth * pixelRatio,
-      pixelHeight: canvasHeight * pixelRatio
-    };
-  }
-  /**
-   * Render all pages and return array of results.
-   */
-  async renderAllPages(templateConfig, options = {}) {
-    if (!options.skipFontReadyWait) {
-      const hasAutoShrink = configHasAutoShrinkText(templateConfig);
-      const defaultWait = hasAutoShrink ? 4e3 : 1800;
-      await this.awaitFontsForConfig(templateConfig, options.waitForFontsMs ?? defaultWait);
-    }
-    const results = [];
-    for (let i = 0; i < templateConfig.pages.length; i++) {
-      results.push(await this.render(templateConfig, { ...options, pageIndex: i, skipFontReadyWait: true }));
-    }
-    return results;
-  }
-  /**
-   * Resolve from V2 sectionState (like the server API) and render all pages.
-   * This is the primary external API for the package.
-   */
-  async renderFromForm(options) {
-    const { templateId, formSchemaId, sectionState, themeId, watermark, watermarkOptions, prefetched, ...renderOpts } = options;
-    const resolved = await resolveFromForm({
-      templateId,
-      formSchemaId,
-      sectionState,
-      themeId,
-      supabaseUrl: this.config.supabaseUrl,
-      supabaseAnonKey: this.config.supabaseAnonKey,
-      prefetched
-    });
-    const shouldWatermark = watermark ?? resolved.price > 0;
-    let configToRender = resolved.config;
-    if (shouldWatermark) {
-      const { injectWatermark } = await Promise.resolve().then(() => require("./canvasWatermark-B0ab38Ok.cjs"));
-      configToRender = injectWatermark(configToRender, watermarkOptions);
-    }
-    return this.renderAllPages(configToRender, renderOpts);
-  }
-  /**
-   * Render a page and capture the Fabric canvas SVG output (vector, not raster).
-   * This is the key building block for client-side vector PDF export.
-   */
-  async renderPageSvg(templateConfig, pageIndex = 0) {
-    const page = templateConfig.pages[pageIndex];
-    if (!page) {
-      throw new Error(`Page index ${pageIndex} not found (template has ${templateConfig.pages.length} pages)`);
-    }
-    await ensureFontsForResolvedConfig(templateConfig);
-    const hasAutoShrinkSvg = configHasAutoShrinkText(templateConfig);
-    await this.awaitFontsForConfig(templateConfig, hasAutoShrinkSvg ? 4e3 : 1800);
-    const { setPackageApiUrl: setPackageApiUrl2 } = await Promise.resolve().then(() => appApi);
-    setPackageApiUrl2(this.config.imageProxyUrl);
-    const canvasWidth = templateConfig.canvas.width;
-    const canvasHeight = templateConfig.canvas.height;
-    return this.captureSvgViaPreviewCanvas(templateConfig, pageIndex, canvasWidth, canvasHeight);
-  }
-  /**
-   * Render all pages and return SVG strings for each.
-   */
-  async renderAllPageSvgs(templateConfig) {
-    await ensureFontsForResolvedConfig(templateConfig);
-    const hasAutoShrinkSvg = configHasAutoShrinkText(templateConfig);
-    await this.awaitFontsForConfig(templateConfig, hasAutoShrinkSvg ? 4e3 : 1800);
-    const { setPackageApiUrl: setPackageApiUrl2 } = await Promise.resolve().then(() => appApi);
-    setPackageApiUrl2(this.config.imageProxyUrl);
-    const results = [];
-    for (let i = 0; i < templateConfig.pages.length; i++) {
-      const canvasWidth = templateConfig.canvas.width;
-      const canvasHeight = templateConfig.canvas.height;
-      results.push(await this.captureSvgViaPreviewCanvas(templateConfig, i, canvasWidth, canvasHeight));
-    }
-    return results;
-  }
-  /**
-   * Resolve from V2 sectionState and return SVGs for all pages (for server vector PDF).
-   */
-  async renderSvgsFromForm(options) {
-    const { templateId, formSchemaId, sectionState, themeId, watermark, watermarkOptions, prefetched } = options;
-    const resolved = await resolveFromForm({
-      templateId,
-      formSchemaId,
-      sectionState,
-      themeId,
-      supabaseUrl: this.config.supabaseUrl,
-      supabaseAnonKey: this.config.supabaseAnonKey,
-      prefetched
-    });
-    const shouldWatermark = watermark ?? resolved.price > 0;
-    let configToRender = resolved.config;
-    if (shouldWatermark) {
-      const { injectWatermark } = await Promise.resolve().then(() => require("./canvasWatermark-B0ab38Ok.cjs"));
-      configToRender = injectWatermark(configToRender, watermarkOptions);
-    }
-    return this.renderAllPageSvgs(configToRender);
-  }
-  /**
-   * Render a pre-resolved template config to a vector PDF.
-   * Returns a Blob and ArrayBuffer.
-   */
-  async renderPdf(templateConfig, options) {
-    const svgs = await this.renderAllPageSvgs(templateConfig);
-    const { assemblePdfFromSvgs: assemblePdfFromSvgs2 } = await Promise.resolve().then(() => pdfExport);
-    return assemblePdfFromSvgs2(svgs, { title: options == null ? void 0 : options.title, fontBaseUrl: options == null ? void 0 : options.fontBaseUrl });
-  }
-  /**
-   * Resolve from V2 sectionState and render a vector PDF.
-   * This is the primary PDF export API — mirrors renderFromForm() but returns a PDF.
-   */
-  async renderPdfFromForm(options) {
-    const { templateId, formSchemaId, sectionState, themeId, watermark, watermarkOptions, prefetched, title, fontBaseUrl } = options;
-    const resolved = await resolveFromForm({
-      templateId,
-      formSchemaId,
-      sectionState,
-      themeId,
-      supabaseUrl: this.config.supabaseUrl,
-      supabaseAnonKey: this.config.supabaseAnonKey,
-      prefetched
-    });
-    const shouldWatermark = watermark ?? resolved.price > 0;
-    let configToRender = resolved.config;
-    if (shouldWatermark) {
-      const { injectWatermark } = await Promise.resolve().then(() => require("./canvasWatermark-B0ab38Ok.cjs"));
-      configToRender = injectWatermark(configToRender, watermarkOptions);
-    }
-    const svgs = await this.renderAllPageSvgs(configToRender);
-    const { assemblePdfFromSvgs: assemblePdfFromSvgs2 } = await Promise.resolve().then(() => pdfExport);
-    return assemblePdfFromSvgs2(svgs, { title: title ?? resolved.config.name, fontBaseUrl });
-  }
-  async renderById(templateId, formData, options) {
-    const resolved = await resolveTemplateData({
-      templateId,
-      formData,
-      supabaseUrl: this.config.supabaseUrl,
-      supabaseAnonKey: this.config.supabaseAnonKey
-    });
-    return this.render(resolved.config, options);
-  }
-  /**
-   * Convenience: fetch by ID with flat data and render ALL pages.
-   */
-  async renderAllById(templateId, formData, options) {
-    const resolved = await resolveTemplateData({
-      templateId,
-      formData,
-      supabaseUrl: this.config.supabaseUrl,
-      supabaseAnonKey: this.config.supabaseAnonKey
-    });
-    return this.renderAllPages(resolved.config, options);
-  }
-  // ─── Internal: render a page using the full PreviewCanvas engine ───
-  getExpectedImageCount(config, pageIndex) {
-    const page = config.pages[pageIndex];
-    if (!(page == null ? void 0 : page.children)) return 0;
-    let count = 0;
-    const walk = (nodes) => {
-      for (const node of nodes) {
-        if (!node || node.visible === false) continue;
-        const src = typeof node.src === "string" ? node.src.trim() : "";
-        const imageUrl = typeof node.imageUrl === "string" ? node.imageUrl.trim() : "";
-        if (node.type === "image" && (src || imageUrl)) count += 1;
-        if (Array.isArray(node.children) && node.children.length > 0) {
-          walk(node.children);
-        }
-      }
-    };
-    walk(page.children);
-    return count;
-  }
-  waitForCanvasImages(container, expectedImageCount, maxWaitMs = 15e3, pollMs = 120) {
-    return new Promise((resolve) => {
-      const start = Date.now();
-      let stableFrames = 0;
-      let lastSummary = "";
-      const isRenderableImage = (value) => value instanceof HTMLImageElement && value.complete && value.naturalWidth > 0 && value.naturalHeight > 0;
-      const collectRenderableImages = (obj, seen) => {
-        if (!obj || typeof obj !== "object") return;
-        const candidates = [obj._element, obj._originalElement, obj._filteredEl, obj._cacheCanvasEl];
-        for (const candidate of candidates) {
-          if (isRenderableImage(candidate)) {
-            seen.add(candidate);
-          } else if (candidate instanceof HTMLImageElement) {
-            return false;
-          }
-        }
-        const nested = Array.isArray(obj._objects) ? obj._objects : Array.isArray(obj.objects) ? obj.objects : [];
-        for (const child of nested) {
-          if (collectRenderableImages(child, seen) === false) return false;
-        }
-        return true;
-      };
-      const getFabricCanvas = () => {
-        const registry2 = window.__fabricCanvasRegistry;
-        if (registry2 instanceof Map) {
-          for (const entry of registry2.values()) {
-            const canvas = entry == null ? void 0 : entry.canvas;
-            const el = (canvas == null ? void 0 : canvas.lowerCanvasEl) || (canvas == null ? void 0 : canvas.upperCanvasEl);
-            if (el && container.contains(el)) return canvas;
-          }
-        }
-        return null;
-      };
-      const settle = () => requestAnimationFrame(() => requestAnimationFrame(() => resolve()));
-      const getImageDebugInfo = (obj, bucket) => {
-        if (!obj || typeof obj !== "object") return;
-        const candidates = [obj._element, obj._originalElement, obj._filteredEl, obj._cacheCanvasEl];
-        for (const candidate of candidates) {
-          if (candidate instanceof HTMLImageElement) {
-            bucket.push({
-              id: obj.__docuforgeId || obj.id || "unknown",
-              src: (candidate.currentSrc || candidate.src || "").slice(0, 240),
-              complete: candidate.complete,
-              naturalWidth: candidate.naturalWidth,
-              naturalHeight: candidate.naturalHeight
-            });
-          }
-        }
-        const nested = Array.isArray(obj._objects) ? obj._objects : Array.isArray(obj.objects) ? obj.objects : [];
-        for (const child of nested) {
-          getImageDebugInfo(child, bucket);
-        }
-      };
-      const check = () => {
-        const elapsed = Date.now() - start;
-        const domImages = Array.from(container.querySelectorAll("img"));
-        const allDomLoaded = domImages.every((img) => img.complete && img.naturalWidth > 0 && img.naturalHeight > 0);
-        const fabricCanvas = getFabricCanvas();
-        const fabricObjects = fabricCanvas && typeof fabricCanvas.getObjects === "function" ? fabricCanvas.getObjects() : [];
-        const renderableImages = /* @__PURE__ */ new Set();
-        const fabricReady = fabricObjects.every((obj) => collectRenderableImages(obj, renderableImages) !== false);
-        const actualImageCount = Math.max(domImages.length, renderableImages.size);
-        const canvasReady = !!fabricCanvas && !!(fabricCanvas.lowerCanvasEl || fabricCanvas.upperCanvasEl);
-        const hasExpectedAssets = expectedImageCount === 0 ? true : actualImageCount >= expectedImageCount;
-        const ready = allDomLoaded && fabricReady && hasExpectedAssets;
-        const summary = `expected=${expectedImageCount} actual=${actualImageCount} dom=${domImages.length} fabricReady=${fabricReady} domReady=${allDomLoaded} canvasReady=${canvasReady}`;
-        if (summary !== lastSummary) {
-          lastSummary = summary;
-          console.log(`[canvas-renderer][asset-wait] ${summary}`);
-        }
-        if (ready) {
-          stableFrames += 1;
-          if (stableFrames >= 2) {
-            console.log(`[canvas-renderer][asset-wait] ready after ${elapsed}ms (${summary})`);
-            settle();
-            return;
-          }
-        } else {
-          stableFrames = 0;
-        }
-        if (elapsed >= maxWaitMs) {
-          const fabricImageDebug = [];
-          for (const obj of fabricObjects) {
-            getImageDebugInfo(obj, fabricImageDebug);
-          }
-          const domImageDebug = domImages.map((img, index) => ({
-            index,
-            src: (img.currentSrc || img.src || "").slice(0, 240),
-            complete: img.complete,
-            naturalWidth: img.naturalWidth,
-            naturalHeight: img.naturalHeight
-          }));
-          console.warn(`[canvas-renderer][asset-wait-timeout] elapsed=${elapsed}ms ${summary}`);
-          console.warn("[canvas-renderer][asset-wait-timeout][dom-images]", domImageDebug);
-          console.warn("[canvas-renderer][asset-wait-timeout][fabric-images]", fabricImageDebug);
-          settle();
-          return;
-        }
-        setTimeout(check, pollMs);
-      };
-      setTimeout(check, 0);
-    });
-  }
-  waitForCanvasScene(container, config, pageIndex, maxWaitMs = 8e3, pollMs = 50) {
-    return new Promise((resolve) => {
-      var _a, _b;
-      const start = Date.now();
-      const pageHasContent = (((_b = (_a = config.pages[pageIndex]) == null ? void 0 : _a.children) == null ? void 0 : _b.length) ?? 0) > 0;
-      const settle = () => requestAnimationFrame(() => requestAnimationFrame(() => resolve()));
-      const check = () => {
-        const fabricCanvas = this.getFabricCanvasFromContainer(container);
-        const lowerCanvas = (fabricCanvas == null ? void 0 : fabricCanvas.lowerCanvasEl) || container.querySelector("canvas.lower-canvas, canvas");
-        const objectCount = typeof (fabricCanvas == null ? void 0 : fabricCanvas.getObjects) === "function" ? fabricCanvas.getObjects().length : 0;
-        const ready = !!lowerCanvas && (!pageHasContent || objectCount > 0);
-        if (ready) {
-          console.log(`[canvas-renderer][scene-wait] ready after ${Date.now() - start}ms (objects=${objectCount})`);
-          settle();
-          return;
-        }
-        if (Date.now() - start >= maxWaitMs) {
-          console.warn(`[canvas-renderer][scene-wait-timeout] elapsed=${Date.now() - start}ms objects=${objectCount} pageHasContent=${pageHasContent}`);
-          settle();
-          return;
-        }
-        setTimeout(check, pollMs);
-      };
-      setTimeout(check, 0);
-    });
-  }
-  async waitForRelevantFonts(config, maxWaitMs = 1800) {
-    if (typeof document === "undefined" || !document.fonts) return;
-    const descriptors = collectFontDescriptorsFromConfig(config);
-    if (descriptors.length === 0) return;
-    const loads = Promise.all(
-      descriptors.map((descriptor) => {
-        const stylePrefix = descriptor.style === "italic" ? "italic " : "";
-        const spec = `${stylePrefix}${descriptor.weight} 16px "${descriptor.family}"`;
-        return document.fonts.load(spec).catch(() => []);
-      })
-    ).then(() => void 0);
-    await Promise.race([
-      loads,
-      new Promise((resolve) => setTimeout(resolve, maxWaitMs))
-    ]);
-    await new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(() => resolve())));
-  }
-  /**
-   * Block until the webfonts referenced by `config` have actually loaded
-   * (or `maxWaitMs` elapses). Used by the headless capture path BEFORE
-   * mounting `PreviewCanvas`, so the synchronous `createText` auto-shrink
-   * loop measures against final font metrics instead of fallback ones.
-   *
-   * Stronger than `ensureFontsForResolvedConfig` (which is fire-and-forget)
-   * — this awaits each `document.fonts.load(spec)` AND `document.fonts.ready`,
-   * racing the whole thing against `maxWaitMs` so a slow CDN can't hang the
-   * renderer.
-   */
-  async awaitFontsForConfig(config, maxWaitMs) {
-    if (typeof document === "undefined" || !document.fonts) return;
-    void ensureFontsForResolvedConfig(config);
-    await this.waitForRelevantFonts(config, maxWaitMs);
-    await Promise.race([
-      document.fonts.ready.catch(() => void 0).then(() => void 0),
-      new Promise((r) => setTimeout(r, Math.min(500, maxWaitMs)))
-    ]);
-  }
-  getNormalizedGradientStops(gradient) {
-    const stops = Array.isArray(gradient == null ? void 0 : gradient.stops) ? gradient.stops.map((stop) => ({
-      offset: Math.max(0, Math.min(1, Number((stop == null ? void 0 : stop.offset) ?? 0))),
-      color: String((stop == null ? void 0 : stop.color) ?? "#ffffff")
-    })).filter((stop) => Number.isFinite(stop.offset)).sort((a, b) => a.offset - b.offset) : [];
-    if (stops.length === 0) return [];
-    const normalized = [...stops];
-    if (normalized[0].offset > 0) {
-      normalized.unshift({ offset: 0, color: normalized[0].color });
-    }
-    if (normalized[normalized.length - 1].offset < 1) {
-      normalized.push({ offset: 1, color: normalized[normalized.length - 1].color });
-    }
-    return normalized;
-  }
-  paintPageBackground(ctx, page, width, height) {
-    var _a, _b;
-    const backgroundColor = ((_a = page == null ? void 0 : page.settings) == null ? void 0 : _a.backgroundColor) || "#ffffff";
-    const gradient = (_b = page == null ? void 0 : page.settings) == null ? void 0 : _b.backgroundGradient;
-    ctx.clearRect(0, 0, width, height);
-    ctx.fillStyle = backgroundColor;
-    ctx.fillRect(0, 0, width, height);
-    const stops = this.getNormalizedGradientStops(gradient);
-    if (stops.length < 2) return;
-    try {
-      let canvasGradient = null;
-      if ((gradient == null ? void 0 : gradient.type) === "radial") {
-        const cx = Number.isFinite(gradient == null ? void 0 : gradient.cx) ? gradient.cx : 0.5;
-        const cy = Number.isFinite(gradient == null ? void 0 : gradient.cy) ? gradient.cy : 0.5;
-        const centerX = width * cx;
-        const centerY = height * cy;
-        const radius = Math.max(
-          Math.hypot(centerX, centerY),
-          Math.hypot(width - centerX, centerY),
-          Math.hypot(centerX, height - centerY),
-          Math.hypot(width - centerX, height - centerY)
-        );
-        canvasGradient = ctx.createRadialGradient(centerX, centerY, 0, centerX, centerY, radius);
-      } else if ((gradient == null ? void 0 : gradient.type) === "conic" && typeof ctx.createConicGradient === "function") {
-        const cx = Number.isFinite(gradient == null ? void 0 : gradient.cx) ? gradient.cx : 0.5;
-        const cy = Number.isFinite(gradient == null ? void 0 : gradient.cy) ? gradient.cy : 0.5;
-        const startAngle = (((gradient == null ? void 0 : gradient.angle) ?? 0) - 90) * Math.PI / 180;
-        canvasGradient = ctx.createConicGradient(startAngle, width * cx, height * cy);
-      } else {
-        const angleDeg = (gradient == null ? void 0 : gradient.angle) ?? 90;
-        const angleRad = angleDeg * Math.PI / 180;
-        const sinA = Math.sin(angleRad);
-        const cosA = Math.cos(angleRad);
-        const midX = width / 2;
-        const midY = height / 2;
-        const corners = [
-          [0, 0],
-          [width, 0],
-          [width, height],
-          [0, height]
-        ];
-        const projections = corners.map(([x, y]) => x * sinA - y * cosA);
-        const minProjection = Math.min(...projections);
-        const maxProjection = Math.max(...projections);
-        canvasGradient = ctx.createLinearGradient(
-          midX + minProjection * sinA,
-          midY - minProjection * cosA,
-          midX + maxProjection * sinA,
-          midY - maxProjection * cosA
-        );
-      }
-      if (!canvasGradient) return;
-      stops.forEach((stop) => canvasGradient.addColorStop(stop.offset, stop.color));
-      ctx.fillStyle = canvasGradient;
-      ctx.fillRect(0, 0, width, height);
-    } catch {
-    }
-  }
-  async renderPageViaPreviewCanvas(config, pageIndex, pixelRatio, format, quality, options = {}) {
-    const { PreviewCanvas: PreviewCanvas2 } = await Promise.resolve().then(() => PreviewCanvas$1);
-    const canvasWidth = config.canvas.width;
-    const canvasHeight = config.canvas.height;
-    const hasAutoShrink = configHasAutoShrinkText(config);
-    let firstMountSettled = false;
-    let lateFontSettleDetected = false;
-    if (typeof document !== "undefined" && document.fonts && hasAutoShrink) {
-      document.fonts.ready.then(() => {
-        if (firstMountSettled) lateFontSettleDetected = true;
-      }).catch(() => {
-      });
-    }
-    return new Promise((resolve, reject) => {
-      const container = document.createElement("div");
-      container.style.cssText = `
-        position: fixed; left: -99999px; top: -99999px;
-        width: ${canvasWidth}px; height: ${canvasHeight}px;
-        overflow: hidden; pointer-events: none; opacity: 0;
-      `;
-      document.body.appendChild(container);
-      const timeout = setTimeout(() => {
-        cleanup();
-        reject(new Error("Render timeout (30s)"));
-      }, 3e4);
-      let root;
-      let mountKey = 0;
-      const cleanup = () => {
-        clearTimeout(timeout);
-        try {
-          root.unmount();
-        } catch {
-        }
-        container.remove();
-      };
-      const remountWithFreshKey = async () => {
-        mountKey += 1;
-        try {
-          clearMeasurementCache();
-        } catch {
-        }
-        try {
-          clearFabricCharCache();
-        } catch {
-        }
-        try {
-          root.unmount();
-        } catch {
-        }
-        root = client.createRoot(container);
-        await new Promise((settle) => {
-          const onReadyOnce = () => {
-            this.waitForCanvasScene(container, config, pageIndex).then(async () => {
-              const fabricInstance = this.getFabricCanvasFromContainer(container);
-              const expectedImageCount = this.getExpectedImageCount(config, pageIndex);
-              await this.waitForCanvasImages(container, expectedImageCount);
-              await this.waitForStableTextMetrics(container, config);
-              await this.waitForCanvasScene(container, config, pageIndex);
-              if (!fabricInstance) return settle();
-              settle();
-            }).catch(() => settle());
-          };
-          root.render(
-            react.createElement(PreviewCanvas2, {
-              key: `remount-${mountKey}`,
-              config,
-              pageIndex,
-              zoom: pixelRatio,
-              absoluteZoom: true,
-              skipFontReadyWait: false,
-              onReady: onReadyOnce
-            })
-          );
-        });
-      };
-      const onReady = () => {
-        this.waitForCanvasScene(container, config, pageIndex).then(async () => {
-          try {
-            const fabricInstance = this.getFabricCanvasFromContainer(container);
-            const expectedImageCount = this.getExpectedImageCount(config, pageIndex);
-            await this.waitForCanvasImages(container, expectedImageCount);
-            await this.waitForStableTextMetrics(container, config);
-            await this.waitForCanvasScene(container, config, pageIndex);
-            firstMountSettled = true;
-            if (hasAutoShrink && lateFontSettleDetected) {
-              console.log("[canvas-renderer][parity] late font-settle detected — remounting for auto-shrink reflow");
-              await remountWithFreshKey();
-            }
-            const fabricCanvas = container.querySelector("canvas.upper-canvas, canvas");
-            const sourceCanvas = (fabricInstance == null ? void 0 : fabricInstance.lowerCanvasEl) || container.querySelector("canvas.lower-canvas") || fabricCanvas;
-            const fabricInstanceAfter = this.getFabricCanvasFromContainer(container) || fabricInstance;
-            const sourceCanvasAfter = (fabricInstanceAfter == null ? void 0 : fabricInstanceAfter.lowerCanvasEl) || container.querySelector("canvas.lower-canvas") || sourceCanvas;
-            if (!sourceCanvas) {
-              cleanup();
-              reject(new Error("No canvas element found after render"));
-              return;
-            }
-            const exportCanvas = document.createElement("canvas");
-            exportCanvas.width = sourceCanvasAfter.width;
-            exportCanvas.height = sourceCanvasAfter.height;
-            const exportCtx = exportCanvas.getContext("2d");
-            if (!exportCtx) {
-              cleanup();
-              reject(new Error("Failed to create export canvas"));
-              return;
-            }
-            exportCtx.save();
-            exportCtx.scale(sourceCanvasAfter.width / canvasWidth, sourceCanvasAfter.height / canvasHeight);
-            this.paintPageBackground(exportCtx, config.pages[pageIndex], canvasWidth, canvasHeight);
-            exportCtx.restore();
-            exportCtx.drawImage(sourceCanvasAfter, 0, 0);
-            const mimeType = format === "jpeg" ? "image/jpeg" : format === "webp" ? "image/webp" : "image/png";
-            const dataUrl = exportCanvas.toDataURL(mimeType, quality);
-            cleanup();
-            resolve(dataUrl);
-          } catch (err) {
-            cleanup();
-            reject(err);
-          }
-        });
-      };
-      root = client.createRoot(container);
-      root.render(
-        react.createElement(PreviewCanvas2, {
-          config,
-          pageIndex,
-          zoom: pixelRatio,
-          absoluteZoom: true,
-          skipFontReadyWait: false,
-          onReady
-        })
-      );
-    });
-  }
-  // ─── Internal: capture SVG from a rendered Fabric canvas ───
-  //
-  // APPROACH: Use the SAME PreviewCanvas that renders perfect PNGs, then call
-  // Fabric's toSVG() on that canvas. This guarantees 100% layout parity —
-  // the SVG is a vector snapshot of exactly what's on screen.
-  //
-  // The trick: before calling toSVG(), we temporarily neutralize the viewport
-  // transform and retina scaling so Fabric emits coordinates in logical
-  // document space (e.g. 612x792) instead of inflated pixel space.
-  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;
-        width: ${canvasWidth}px; height: ${canvasHeight}px;
-        overflow: hidden; pointer-events: none; opacity: 0;
-      `;
-      document.body.appendChild(container);
-      const timeout = setTimeout(() => {
-        cleanup();
-        reject(new Error("SVG render timeout (30s)"));
-      }, 3e4);
-      let root = null;
-      let mountKey = 0;
-      let didPreviewParityRemount = false;
-      const cleanup = () => {
-        clearTimeout(timeout);
-        try {
-          root == null ? void 0 : root.unmount();
-        } catch {
-        }
-        container.remove();
-      };
-      const mountPreview = (readyHandler) => {
-        root = client.createRoot(container);
-        root.render(
-          react.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;
-          try {
-            const expectedImageCount = this.getExpectedImageCount(config, pageIndex);
-            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();
-              reject(new Error("No Fabric canvas instance found for SVG capture"));
-              return;
-            }
-            const prevVPT = fabricInstance.viewportTransform ? [...fabricInstance.viewportTransform] : void 0;
-            const prevSvgVPT = fabricInstance.svgViewportTransformation;
-            const prevRetina = fabricInstance.enableRetinaScaling;
-            const prevWidth = fabricInstance.width;
-            const prevHeight = fabricInstance.height;
-            fabricInstance.viewportTransform = [1, 0, 0, 1, 0, 0];
-            fabricInstance.svgViewportTransformation = false;
-            fabricInstance.enableRetinaScaling = false;
-            fabricInstance.setDimensions(
-              { width: canvasWidth, height: canvasHeight },
-              { cssOnly: false, backstoreOnly: false }
-            );
-            const rawSvgString = fabricInstance.toSVG();
-            const svgString = this.normalizeSvgDimensions(
-              rawSvgString,
-              canvasWidth,
-              canvasHeight
-            );
-            fabricInstance.enableRetinaScaling = prevRetina;
-            fabricInstance.setDimensions(
-              { width: prevWidth, height: prevHeight },
-              { cssOnly: false, backstoreOnly: false }
-            );
-            if (prevVPT) fabricInstance.viewportTransform = prevVPT;
-            fabricInstance.svgViewportTransformation = prevSvgVPT;
-            const page = config.pages[pageIndex];
-            const backgroundColor = ((_a = page == null ? void 0 : page.settings) == null ? void 0 : _a.backgroundColor) || "#ffffff";
-            const backgroundGradient = (_b = page == null ? void 0 : page.settings) == null ? void 0 : _b.backgroundGradient;
-            cleanup();
-            resolve({
-              svg: svgString,
-              width: canvasWidth,
-              height: canvasHeight,
-              backgroundColor,
-              backgroundGradient
-            });
-          } catch (err) {
-            cleanup();
-            reject(err);
-          }
-        });
-      };
-      mountPreview(onReady);
-    });
-  }
-  /**
-   * Normalize the SVG's width/height/viewBox to match the logical page dimensions.
-   * Fabric's toSVG() may output dimensions scaled by the canvas element's actual
-   * pixel size (e.g., 2x due to devicePixelRatio), causing svg2pdf to render
-   * content at the wrong scale. This rewrites the root <svg> attributes to ensure
-   * the SVG coordinate system matches the intended page size exactly.
-   */
-  normalizeSvgDimensions(svg, targetWidth, targetHeight) {
-    const widthMatch = svg.match(/<svg[^>]*\bwidth="([^"]+)"/i);
-    const heightMatch = svg.match(/<svg[^>]*\bheight="([^"]+)"/i);
-    const svgWidth = widthMatch ? parseFloat(widthMatch[1]) : targetWidth;
-    const svgHeight = heightMatch ? parseFloat(heightMatch[1]) : targetHeight;
-    console.log(
-      `[canvas-renderer][svg-normalize] root ${svgWidth}x${svgHeight} → page ${targetWidth}x${targetHeight}`
-    );
-    let normalized = svg;
-    if (/\bwidth="[^"]*"/i.test(normalized)) {
-      normalized = normalized.replace(/(<svg[^>]*\b)width="[^"]*"/i, `$1width="${targetWidth}"`);
-    } else {
-      normalized = normalized.replace(/<svg\b/i, `<svg width="${targetWidth}"`);
-    }
-    if (/\bheight="[^"]*"/i.test(normalized)) {
-      normalized = normalized.replace(/(<svg[^>]*\b)height="[^"]*"/i, `$1height="${targetHeight}"`);
-    } else {
-      normalized = normalized.replace(/<svg\b/i, `<svg height="${targetHeight}"`);
-    }
-    const viewBox = `0 0 ${targetWidth} ${targetHeight}`;
-    if (/\bviewBox="[^"]*"/i.test(normalized)) {
-      normalized = normalized.replace(/viewBox="[^"]*"/i, `viewBox="${viewBox}"`);
-    } else {
-      normalized = normalized.replace(/<svg\b/i, `<svg viewBox="${viewBox}"`);
-    }
-    normalized = normalized.replace(/="undefined"/g, '="0"');
-    normalized = normalized.replace(/="NaN"/g, '="0"');
-    if (/\bx="[^"]*"/i.test(normalized)) {
-      normalized = normalized.replace(/(<svg[^>]*\b)x="[^"]*"/i, '$1x="0"');
-    } else {
-      normalized = normalized.replace(/<svg\b/i, '<svg x="0"');
-    }
-    if (/\by="[^"]*"/i.test(normalized)) {
-      normalized = normalized.replace(/(<svg[^>]*\b)y="[^"]*"/i, '$1y="0"');
-    } else {
-      normalized = normalized.replace(/<svg\b/i, '<svg y="0"');
-    }
-    normalized = normalized.replace(/\bpreserveAspectRatio="[^"]*"/i, 'preserveAspectRatio="none"');
-    if (!/\bpreserveAspectRatio="[^"]*"/i.test(normalized)) {
-      normalized = normalized.replace(/<svg\b/i, '<svg preserveAspectRatio="none"');
-    }
-    return normalized;
-  }
-  /**
-   * Find the Fabric.Canvas instance that belongs to a given container element,
-   * using the global __fabricCanvasRegistry (set by PageCanvas).
-   */
-  getFabricCanvasFromContainer(container) {
-    const registry2 = window.__fabricCanvasRegistry;
-    if (registry2 instanceof Map) {
-      for (const entry of registry2.values()) {
-        const canvas = (entry == null ? void 0 : entry.canvas) || entry;
-        if (!canvas || typeof canvas.toSVG !== "function") continue;
-        const el = canvas.lowerCanvasEl || canvas.upperCanvasEl;
-        if (el && container.contains(el)) return canvas;
-      }
-    }
-    return null;
-  }
-  async waitForStableTextMetrics(container, config) {
-    var _a, _b, _c;
-    if (typeof document !== "undefined") {
-      void ensureFontsForResolvedConfig(config);
-      await this.waitForRelevantFonts(config);
-    }
-    const fabricInstance = this.getFabricCanvasFromContainer(container);
-    if (!(fabricInstance == null ? void 0 : fabricInstance.getObjects)) return;
-    const waitForPaint = () => new Promise((r) => requestAnimationFrame(() => requestAnimationFrame(() => r())));
-    const primeCharBounds = (obj) => {
-      if (obj instanceof fabric__namespace.Textbox) {
-        const lines = obj._textLines;
-        if (Array.isArray(lines)) {
-          for (let i = 0; i < lines.length; i++) {
-            try {
-              obj.getLineWidth(i);
-            } catch {
-            }
-          }
-        }
-        obj.dirty = true;
-        return;
-      }
-      if (obj instanceof fabric__namespace.Group) {
-        obj.getObjects().forEach(primeCharBounds);
-        obj.dirty = true;
-      }
-    };
-    fabricInstance.getObjects().forEach(primeCharBounds);
-    (_a = fabricInstance.calcOffset) == null ? void 0 : _a.call(fabricInstance);
-    (_b = fabricInstance.renderAll) == null ? void 0 : _b.call(fabricInstance);
-    await waitForPaint();
-    (_c = fabricInstance.renderAll) == null ? void 0 : _c.call(fabricInstance);
-    await waitForPaint();
-  }
-}
-const FONT_WEIGHT_LABELS = {
-  300: "Light",
-  400: "Regular",
-  500: "Medium",
-  600: "SemiBold",
-  700: "Bold"
-};
-function resolveFontWeight(weight) {
-  if (weight <= 350) return 300;
-  if (weight <= 450) return 400;
-  if (weight <= 550) return 500;
-  if (weight <= 650) return 600;
-  return 700;
+const FONT_WEIGHT_LABELS = {
+  300: "Light",
+  400: "Regular",
+  500: "Medium",
+  600: "SemiBold",
+  700: "Bold"
+};
+function resolveFontWeight(weight) {
+  if (weight <= 350) return 300;
+  if (weight <= 450) return 400;
+  if (weight <= 550) return 500;
+  if (weight <= 650) return 600;
+  return 700;
 }
 const FONT_FALLBACK_SYMBOLS = "Noto Sans";
 const FONT_FALLBACK_DEVANAGARI = "Hind";
@@ -14004,327 +12639,1731 @@ const FONT_FILES = {
     italic: "CormorantGaramond-Italic.ttf",
     boldItalic: "CormorantGaramond-BoldItalic.ttf"
   }
-};
-const WEIGHT_TO_KEYS = {
-  300: ["light", "regular"],
-  400: ["regular"],
-  500: ["medium", "regular"],
-  600: ["semibold", "bold", "regular"],
-  700: ["bold", "regular"]
-};
-const WEIGHT_TO_ITALIC_KEYS = {
-  300: ["lightItalic", "italic", "light", "regular"],
-  400: ["italic", "regular"],
-  500: ["mediumItalic", "italic", "medium", "regular"],
-  600: ["semiboldItalic", "boldItalic", "italic", "semibold", "bold", "regular"],
-  700: ["boldItalic", "italic", "bold", "regular"]
-};
-function getFontPathForWeight(files, weight, isItalic = false) {
-  const keys = isItalic ? WEIGHT_TO_ITALIC_KEYS[weight] : WEIGHT_TO_KEYS[weight];
-  if (!keys) return files.regular;
-  for (const k of keys) {
-    const path = files[k];
-    if (path) return path;
+};
+const WEIGHT_TO_KEYS = {
+  300: ["light", "regular"],
+  400: ["regular"],
+  500: ["medium", "regular"],
+  600: ["semibold", "bold", "regular"],
+  700: ["bold", "regular"]
+};
+const WEIGHT_TO_ITALIC_KEYS = {
+  300: ["lightItalic", "italic", "light", "regular"],
+  400: ["italic", "regular"],
+  500: ["mediumItalic", "italic", "medium", "regular"],
+  600: ["semiboldItalic", "boldItalic", "italic", "semibold", "bold", "regular"],
+  700: ["boldItalic", "italic", "bold", "regular"]
+};
+function getFontPathForWeight(files, weight, isItalic = false) {
+  const keys = isItalic ? WEIGHT_TO_ITALIC_KEYS[weight] : WEIGHT_TO_KEYS[weight];
+  if (!keys) return files.regular;
+  for (const k of keys) {
+    const path = files[k];
+    if (path) return path;
+  }
+  return files.regular;
+}
+function isItalicPath(files, path) {
+  return path === files.italic || path === files.boldItalic || path === files.lightItalic || path === files.mediumItalic || path === files.semiboldItalic;
+}
+function getJsPDFFontName(fontName) {
+  return fontName.replace(/\s+/g, "");
+}
+function getEmbeddedJsPDFFontName(fontName, weight, isItalic = false) {
+  const resolved = resolveFontWeight(weight);
+  const label = FONT_WEIGHT_LABELS[resolved];
+  const italicSuffix = isItalic ? "Italic" : "";
+  return `${getJsPDFFontName(fontName)}-${label}${italicSuffix}`;
+}
+function isFontAvailable(fontName) {
+  return fontName in FONT_FILES;
+}
+const ttfCache = /* @__PURE__ */ new Map();
+async function fetchTTFAsBase64(url) {
+  const cached = ttfCache.get(url);
+  if (cached) return cached;
+  try {
+    const res = await fetch(url);
+    if (!res.ok) return null;
+    const buf = await res.arrayBuffer();
+    const bytes = new Uint8Array(buf);
+    let binary = "";
+    for (let i = 0; i < bytes.length; i++) {
+      binary += String.fromCharCode(bytes[i]);
+    }
+    const b64 = btoa(binary);
+    ttfCache.set(url, b64);
+    return b64;
+  } catch {
+    return null;
+  }
+}
+async function embedFont(pdf, fontName, weight, fontBaseUrl, isItalic = false) {
+  const fontFiles = FONT_FILES[fontName];
+  if (!fontFiles) return false;
+  const baseUrl = fontBaseUrl.endsWith("/") ? fontBaseUrl : fontBaseUrl + "/";
+  const resolvedWeight = resolveFontWeight(weight);
+  const fontPath = getFontPathForWeight(fontFiles, resolvedWeight, isItalic);
+  if (!fontPath) return false;
+  const hasItalicFile = isItalic && isItalicPath(fontFiles, fontPath);
+  const jsPdfFontName = getEmbeddedJsPDFFontName(fontName, weight, hasItalicFile);
+  const label = FONT_WEIGHT_LABELS[resolvedWeight];
+  const italicSuffix = hasItalicFile ? "Italic" : "";
+  const fileName = `${getJsPDFFontName(fontName)}-${label}${italicSuffix}.ttf`;
+  const url = baseUrl + fontPath;
+  try {
+    const b64 = await fetchTTFAsBase64(url);
+    if (!b64) return false;
+    pdf.addFileToVFS(fileName, b64);
+    pdf.addFont(fileName, jsPdfFontName, "normal");
+    if (fontName !== jsPdfFontName) {
+      try {
+        pdf.addFont(fileName, fontName, "normal");
+      } catch {
+      }
+    }
+    return true;
+  } catch (e) {
+    console.warn(`[pdf-fonts] Failed to embed ${fontName} w${weight}:`, e);
+    return false;
+  }
+}
+async function embedFontsForConfig(pdf, config, fontBaseUrl) {
+  const fontKeys = /* @__PURE__ */ new Set();
+  const SEP = "";
+  const walkElements = (elements) => {
+    for (const el of elements) {
+      if (el.fontFamily) {
+        const w = resolveFontWeight(el.fontWeight ?? 400);
+        fontKeys.add(`${el.fontFamily}${SEP}${w}`);
+      }
+      if (el.styles && typeof el.styles === "object") {
+        for (const lineKey of Object.keys(el.styles)) {
+          const lineStyles = el.styles[lineKey];
+          if (lineStyles && typeof lineStyles === "object") {
+            for (const charKey of Object.keys(lineStyles)) {
+              const s = lineStyles[charKey];
+              if (s == null ? void 0 : s.fontFamily) {
+                const w = resolveFontWeight(s.fontWeight ?? 400);
+                fontKeys.add(`${s.fontFamily}${SEP}${w}`);
+              }
+            }
+          }
+        }
+      }
+      if (el.children) walkElements(el.children);
+      if (el.objects) walkElements(el.objects);
+    }
+  };
+  for (const page of (config == null ? void 0 : config.pages) || []) {
+    if (page.children) walkElements(page.children);
+    if (page.elements) walkElements(page.elements);
+  }
+  fontKeys.add(`${FONT_FALLBACK_SYMBOLS}${SEP}400`);
+  for (const w of [300, 400, 500, 600, 700]) {
+    fontKeys.add(`${FONT_FALLBACK_DEVANAGARI}${SEP}${w}`);
+  }
+  const embedded = /* @__PURE__ */ new Set();
+  const tasks = [];
+  for (const key of fontKeys) {
+    const sep = key.indexOf(SEP);
+    const fontName = key.slice(0, sep);
+    const weight = parseInt(key.slice(sep + 1), 10);
+    if (!isFontAvailable(fontName)) continue;
+    tasks.push(
+      embedFont(pdf, fontName, weight, fontBaseUrl).then((ok) => {
+        if (ok) embedded.add(key);
+      })
+    );
+  }
+  await Promise.all(tasks);
+  console.log(`[pdf-fonts] Embedded ${embedded.size} font variants from config`);
+  return embedded;
+}
+function isDevanagari(char) {
+  const c = char.codePointAt(0) ?? 0;
+  return c >= 2304 && c <= 2431 || c >= 43232 && c <= 43263 || c >= 7376 && c <= 7423;
+}
+function containsDevanagari(text) {
+  if (!text) return false;
+  for (const char of text) {
+    if (isDevanagari(char)) return true;
+  }
+  return false;
+}
+function isBasicLatinOrLatin1(char) {
+  const c = char.codePointAt(0) ?? 0;
+  return c <= 591;
+}
+function classifyChar(char) {
+  if (isBasicLatinOrLatin1(char)) return "main";
+  if (isDevanagari(char)) return "devanagari";
+  return "symbol";
+}
+function splitIntoRuns(text) {
+  if (!text) return [];
+  const runs = [];
+  let currentType = null;
+  let currentText = "";
+  for (const char of text) {
+    const type = classifyChar(char);
+    if (type !== currentType && currentText) {
+      runs.push({ text: currentText, runType: currentType });
+      currentText = "";
+    }
+    currentType = type;
+    currentText += char;
+  }
+  if (currentText && currentType) {
+    runs.push({ text: currentText, runType: currentType });
+  }
+  return runs;
+}
+function rewriteSvgFontsForJsPDF(svgStr) {
+  var _a, _b;
+  const parser = new DOMParser();
+  const doc = parser.parseFromString(svgStr, "image/svg+xml");
+  const textEls = doc.querySelectorAll("text, tspan, textPath");
+  const readStyleToken = (style, prop) => {
+    var _a2;
+    const match = style.match(new RegExp(`${prop}\\s*:\\s*([^;]+)`, "i"));
+    return ((_a2 = match == null ? void 0 : match[1]) == null ? void 0 : _a2.trim()) || null;
+  };
+  const resolveInheritedValue = (el, attr, styleProp = attr) => {
+    var _a2;
+    let current = el;
+    while (current) {
+      const attrVal = (_a2 = current.getAttribute(attr)) == null ? void 0 : _a2.trim();
+      if (attrVal) return attrVal;
+      const styleVal = readStyleToken(current.getAttribute("style") || "", styleProp);
+      if (styleVal) return styleVal;
+      current = current.parentElement;
+    }
+    return null;
+  };
+  const resolveWeightNum = (weightRaw) => {
+    const parsedWeight = Number.parseInt(weightRaw, 10);
+    return Number.isFinite(parsedWeight) ? parsedWeight : /bold/i.test(weightRaw) ? 700 : /medium/i.test(weightRaw) ? 500 : /semi/i.test(weightRaw) ? 600 : /light/i.test(weightRaw) ? 300 : 400;
+  };
+  const buildStyleString = (existingStyle, fontName) => {
+    const stylePairs = existingStyle.split(";").map((part) => part.trim()).filter(Boolean).filter((part) => !/^font-family\s*:/i.test(part) && !/^font-weight\s*:/i.test(part) && !/^font-style\s*:/i.test(part));
+    stylePairs.push(`font-family: ${fontName}`);
+    stylePairs.push(`font-weight: normal`);
+    stylePairs.push(`font-style: normal`);
+    return stylePairs.join("; ");
+  };
+  for (const el of textEls) {
+    const inlineStyle = el.getAttribute("style") || "";
+    const rawFf = resolveInheritedValue(el, "font-family");
+    if (!rawFf) continue;
+    const clean = (_a = rawFf.split(",")[0]) == null ? void 0 : _a.replace(/['"]/g, "").trim();
+    if (!isFontAvailable(clean)) continue;
+    const weightRaw = resolveInheritedValue(el, "font-weight") || "400";
+    const styleRaw = resolveInheritedValue(el, "font-style") || "normal";
+    const weight = resolveWeightNum(weightRaw);
+    const resolved = resolveFontWeight(weight);
+    const isItalic = /italic|oblique/i.test(styleRaw);
+    const jsPdfName = getEmbeddedJsPDFFontName(clean, resolved, isItalic);
+    el.setAttribute("data-source-font-family", clean);
+    el.setAttribute("data-source-font-weight", String(resolved));
+    el.setAttribute("data-source-font-style", isItalic ? "italic" : "normal");
+    const directText = Array.from(el.childNodes).filter((n) => n.nodeType === 3).map((n) => n.textContent || "").join("");
+    const hasDevanagari = containsDevanagari(directText);
+    if (hasDevanagari && directText.length > 0) {
+      const devanagariWeight = resolveFontWeight(weight);
+      const devanagariJsPdfName = getEmbeddedJsPDFFontName(FONT_FALLBACK_DEVANAGARI, devanagariWeight);
+      const symbolJsPdfName = isFontAvailable(FONT_FALLBACK_SYMBOLS) ? getEmbeddedJsPDFFontName(FONT_FALLBACK_SYMBOLS, 400) : jsPdfName;
+      const childNodes = Array.from(el.childNodes);
+      for (const node of childNodes) {
+        if (node.nodeType !== 3 || !node.textContent) continue;
+        const runs = splitIntoRuns(node.textContent);
+        if (runs.length <= 1 && ((_b = runs[0]) == null ? void 0 : _b.runType) !== "devanagari") continue;
+        const fragment = doc.createDocumentFragment();
+        for (const run of runs) {
+          const tspan = doc.createElementNS("http://www.w3.org/2000/svg", "tspan");
+          let runFont;
+          if (run.runType === "devanagari") {
+            runFont = devanagariJsPdfName;
+          } else if (run.runType === "symbol") {
+            runFont = symbolJsPdfName;
+          } else {
+            runFont = jsPdfName;
+          }
+          tspan.setAttribute("font-family", runFont);
+          tspan.setAttribute("font-weight", "normal");
+          tspan.setAttribute("font-style", "normal");
+          tspan.textContent = run.text;
+          fragment.appendChild(tspan);
+        }
+        el.replaceChild(fragment, node);
+      }
+      el.setAttribute("font-family", jsPdfName);
+      el.setAttribute("font-weight", "normal");
+      el.setAttribute("font-style", "normal");
+      el.setAttribute("style", buildStyleString(inlineStyle, jsPdfName));
+    } else {
+      el.setAttribute("font-family", jsPdfName);
+      el.setAttribute("font-weight", "normal");
+      el.setAttribute("font-style", "normal");
+      el.setAttribute("style", buildStyleString(inlineStyle, jsPdfName));
+    }
+  }
+  return new XMLSerializer().serializeToString(doc.documentElement);
+}
+function extractFontFamiliesFromSvgs(svgs) {
+  const families = /* @__PURE__ */ new Set();
+  const regex = /font-family[=:]\s*["']?([^"';},]+)/gi;
+  for (const svg of svgs) {
+    let m;
+    while ((m = regex.exec(svg)) !== null) {
+      const raw = m[1].trim().split(",")[0].trim().replace(/^['"]|['"]$/g, "");
+      if (raw && raw !== "serif" && raw !== "sans-serif" && raw !== "monospace") {
+        families.add(raw);
+      }
+    }
+  }
+  return families;
+}
+async function embedFontsInPdf(pdf, fontFamilies, fontBaseUrl) {
+  const embedded = /* @__PURE__ */ new Set();
+  const weights = [300, 400, 500, 600, 700];
+  const tasks = [];
+  for (const family of fontFamilies) {
+    if (!isFontAvailable(family)) {
+      console.warn(`[pdf-fonts] No TTF mapping for "${family}" — will use Helvetica fallback`);
+      continue;
+    }
+    for (const w of weights) {
+      tasks.push(
+        embedFont(pdf, family, w, fontBaseUrl).then((ok) => {
+          if (ok) embedded.add(`${family}${w}`);
+        })
+      );
+    }
+  }
+  await Promise.all(tasks);
+  console.log(`[pdf-fonts] Embedded ${embedded.size} font variants for ${fontFamilies.size} families`);
+  return embedded;
+}
+const pdfFonts = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  FONT_FALLBACK_DEVANAGARI,
+  FONT_FALLBACK_SYMBOLS,
+  FONT_FILES,
+  FONT_WEIGHT_LABELS,
+  embedFont,
+  embedFontsForConfig,
+  embedFontsInPdf,
+  extractFontFamiliesFromSvgs,
+  getEmbeddedJsPDFFontName,
+  getFontPathForWeight,
+  isFontAvailable,
+  resolveFontWeight,
+  rewriteSvgFontsForJsPDF
+}, Symbol.toStringTag, { value: "Module" }));
+function normalizeFontFamily(fontStack) {
+  const first = fontStack.split(",")[0].trim();
+  return first.replace(/^['"]|['"]$/g, "");
+}
+const loadedFonts = /* @__PURE__ */ new Set();
+const loadingPromises = /* @__PURE__ */ new Map();
+function getFontBaseUrl() {
+  if (typeof window === "undefined") return "/fonts/";
+  return `${window.location.origin}/fonts/`;
+}
+function injectLocalFontFaces(rawFontFamily) {
+  if (typeof document === "undefined") return false;
+  const fontFamily = normalizeFontFamily(rawFontFamily);
+  const files = FONT_FILES[fontFamily];
+  if (!files) return false;
+  const id = `pixldocs-local-font-${fontFamily.replace(/[^a-z0-9_-]+/gi, "-")}`;
+  if (document.getElementById(id)) return true;
+  const baseUrl = getFontBaseUrl();
+  const rules = [];
+  const seen = /* @__PURE__ */ new Set();
+  for (const weight of [300, 400, 500, 600, 700]) {
+    for (const italic of [false, true]) {
+      const resolvedWeight = resolveFontWeight(weight);
+      const file = getFontPathForWeight(files, resolvedWeight, italic);
+      if (!file) continue;
+      const key = `${file}|${weight}|${italic ? "italic" : "normal"}`;
+      if (seen.has(key)) continue;
+      seen.add(key);
+      rules.push(
+        `@font-face{font-family:${JSON.stringify(fontFamily)};src:url(${JSON.stringify(baseUrl + file)}) format("truetype");font-weight:${weight};font-style:${italic ? "italic" : "normal"};font-display:block;}`
+      );
+    }
+  }
+  if (rules.length === 0) return false;
+  const style = document.createElement("style");
+  style.id = id;
+  style.textContent = rules.join("\n");
+  document.head.appendChild(style);
+  return true;
+}
+function withTimeout(promise, timeoutMs = 4e3) {
+  let timeoutId;
+  return Promise.race([
+    promise,
+    new Promise((resolve) => {
+      timeoutId = setTimeout(resolve, timeoutMs);
+    })
+  ]).finally(() => {
+    if (timeoutId) clearTimeout(timeoutId);
+  });
+}
+async function loadGoogleFontCSS(rawFontFamily) {
+  if (!rawFontFamily || typeof document === "undefined") return;
+  const fontFamily = normalizeFontFamily(rawFontFamily);
+  if (!fontFamily) return;
+  if (loadedFonts.has(fontFamily)) return;
+  const existing = loadingPromises.get(fontFamily);
+  if (existing) return existing;
+  const promise = (async () => {
+    try {
+      if (injectLocalFontFaces(fontFamily)) {
+        loadedFonts.add(fontFamily);
+        return;
+      }
+      const encoded = encodeURIComponent(fontFamily);
+      const url = `https://fonts.googleapis.com/css?family=${encoded}:300,400,500,600,700&display=swap`;
+      const link = document.createElement("link");
+      link.rel = "stylesheet";
+      link.href = url;
+      link.crossOrigin = "anonymous";
+      await new Promise((resolve, reject) => {
+        link.onload = () => resolve();
+        link.onerror = () => reject(new Error(`Failed to load font: ${fontFamily}`));
+        document.head.appendChild(link);
+      });
+      loadedFonts.add(fontFamily);
+    } catch (e) {
+      console.warn(`[@pixldocs/canvas-renderer] Font load failed: ${fontFamily}`, e);
+    }
+  })();
+  loadingPromises.set(fontFamily, promise);
+  await promise;
+  loadingPromises.delete(fontFamily);
+}
+function collectFontsFromConfig(config) {
+  var _a;
+  const fonts = /* @__PURE__ */ new Set();
+  fonts.add("Open Sans");
+  fonts.add("Hind");
+  function walk(nodes) {
+    var _a2;
+    if (!nodes) return;
+    for (const node of nodes) {
+      if (node.fontFamily) fonts.add(normalizeFontFamily(node.fontFamily));
+      if ((_a2 = node.smartProps) == null ? void 0 : _a2.fontFamily) fonts.add(normalizeFontFamily(node.smartProps.fontFamily));
+      if (node.styles && Array.isArray(node.styles)) {
+        for (const lineStyle of node.styles) {
+          if (lineStyle && typeof lineStyle === "object") {
+            for (const charStyle of Object.values(lineStyle)) {
+              if (charStyle == null ? void 0 : charStyle.fontFamily) fonts.add(normalizeFontFamily(charStyle.fontFamily));
+            }
+          }
+        }
+      }
+      if (node.children) walk(node.children);
+    }
+  }
+  for (const page of config.pages || []) {
+    walk(page.children || []);
+  }
+  if ((_a = config.themeConfig) == null ? void 0 : _a.variables) {
+    for (const def of Object.values(config.themeConfig.variables)) {
+      if (def.value && typeof def.value === "string" && !def.value.startsWith("#") && !def.value.startsWith("rgb")) {
+        if (def.label && /font/i.test(def.label)) {
+          fonts.add(normalizeFontFamily(def.value));
+        }
+      }
+    }
+  }
+  return fonts;
+}
+function collectFontDescriptorsFromConfig(config) {
+  var _a;
+  const seen = /* @__PURE__ */ new Set();
+  const descriptors = [];
+  function add(family, weight, style) {
+    const f = normalizeFontFamily(family);
+    if (!f) return;
+    const w = weight ?? 400;
+    const s = style ?? "normal";
+    const key = `${f}|${w}|${s}`;
+    if (seen.has(key)) return;
+    seen.add(key);
+    descriptors.push({ family: f, weight: w, style: s });
+  }
+  function walk(nodes) {
+    var _a2;
+    if (!nodes) return;
+    for (const node of nodes) {
+      if (node.fontFamily) {
+        add(node.fontFamily, node.fontWeight, node.fontStyle);
+        if (node.type === "text") {
+          for (const w of [300, 400, 500, 600, 700]) {
+            add(node.fontFamily, w, node.fontStyle);
+          }
+        }
+      }
+      if ((_a2 = node.smartProps) == null ? void 0 : _a2.fontFamily) {
+        add(node.smartProps.fontFamily, node.smartProps.fontWeight, node.smartProps.fontStyle);
+      }
+      if (node.styles) {
+        const styleEntries = Array.isArray(node.styles) ? node.styles : Object.values(node.styles);
+        for (const lineStyle of styleEntries) {
+          if (lineStyle && typeof lineStyle === "object") {
+            for (const charStyle of Object.values(lineStyle)) {
+              if (charStyle == null ? void 0 : charStyle.fontFamily) {
+                add(charStyle.fontFamily, charStyle.fontWeight, charStyle.fontStyle);
+              }
+            }
+          }
+        }
+      }
+      if (node.children) walk(node.children);
+    }
+  }
+  add("Open Sans", 400, "normal");
+  add("Hind", 400, "normal");
+  add("Hind", 700, "normal");
+  for (const page of config.pages || []) {
+    walk(page.children || []);
+  }
+  if ((_a = config.themeConfig) == null ? void 0 : _a.variables) {
+    for (const def of Object.values(config.themeConfig.variables)) {
+      if (def.value && typeof def.value === "string" && !def.value.startsWith("#") && !def.value.startsWith("rgb")) {
+        if (def.label && /font/i.test(def.label)) {
+          add(def.value);
+        }
+      }
+    }
+  }
+  return descriptors;
+}
+async function ensureFontsForResolvedConfig(config) {
+  if (typeof document === "undefined") return;
+  const descriptors = collectFontDescriptorsFromConfig(config);
+  const families = new Set(descriptors.map((d) => d.family));
+  void withTimeout(Promise.all([...families].map((f) => loadGoogleFontCSS(f))), 2500);
+  if (document.fonts) {
+    descriptors.forEach((d) => {
+      const stylePrefix = d.style === "italic" ? "italic " : "";
+      const weightStr = String(d.weight);
+      const spec = `${stylePrefix}${weightStr} 16px "${d.family}"`;
+      document.fonts.load(spec).catch(() => {
+      });
+    });
+  }
+}
+function configHasAutoShrinkText$1(config) {
+  var _a;
+  if (!((_a = config == null ? void 0 : config.pages) == null ? void 0 : _a.length)) return false;
+  const walk = (nodes) => {
+    for (const node of nodes || []) {
+      if (!node) continue;
+      if (node.type === "text" && node.overflowPolicy === "auto-shrink") return true;
+      if (Array.isArray(node.children) && node.children.length && walk(node.children)) return true;
+    }
+    return false;
+  };
+  for (const page of config.pages) {
+    if (walk(page.children || [])) return true;
+  }
+  return false;
+}
+async function awaitFontsForConfig(config, maxWaitMs) {
+  if (typeof document === "undefined" || !document.fonts) return;
+  void ensureFontsForResolvedConfig(config);
+  const descriptors = collectFontDescriptorsFromConfig(config);
+  if (descriptors.length === 0) return;
+  const loads = Promise.all(
+    descriptors.map((d) => {
+      const stylePrefix = d.style === "italic" ? "italic " : "";
+      const spec = `${stylePrefix}${d.weight} 16px "${d.family}"`;
+      return document.fonts.load(spec).catch(() => []);
+    })
+  ).then(() => void 0);
+  await Promise.race([
+    loads,
+    new Promise((resolve) => setTimeout(resolve, maxWaitMs))
+  ]);
+  await Promise.race([
+    document.fonts.ready.catch(() => void 0).then(() => void 0),
+    new Promise((r) => setTimeout(r, Math.min(500, maxWaitMs)))
+  ]);
+  await new Promise(
+    (resolve) => requestAnimationFrame(() => requestAnimationFrame(() => resolve()))
+  );
+}
+const PREVIEW_DEBUG_PREFIX = "[canvas-renderer][preview-debug]";
+function countUnderlinedNodes(config) {
+  var _a;
+  if (!((_a = config == null ? void 0 : config.pages) == null ? void 0 : _a.length)) return 0;
+  let count = 0;
+  const walk = (nodes) => {
+    var _a2;
+    for (const node of nodes || []) {
+      if (node == null ? void 0 : node.underline) count += 1;
+      if ((_a2 = node == null ? void 0 : node.children) == null ? void 0 : _a2.length) walk(node.children);
+    }
+  };
+  for (const page of config.pages) walk(page.children || []);
+  return count;
+}
+function PixldocsPreview(props) {
+  const {
+    pageIndex = 0,
+    zoom = 1,
+    absoluteZoom = false,
+    imageProxyUrl,
+    className,
+    style,
+    onDynamicFieldClick,
+    onReady,
+    onError,
+    // Default `false` so PageCanvas blocks textbox creation until the host
+    // browser actually has the @font-face rules registered. This matters for
+    // `overflowPolicy: 'auto-shrink'` text — `createText` runs the shrink
+    // loop synchronously at mount time using whatever font metrics Fabric
+    // can measure right then. If the real font hasn't loaded yet, Fabric
+    // falls back to the system font (typically narrower), the shrink loop
+    // decides "fits, no shrink needed", and when the real font finally
+    // loads the text overflows the box.
+    //
+    // The renderer's imperative PNG/PDF paths (`renderPageViaPreviewCanvas`,
+    // `captureSvgViaPreviewCanvas`) already pass `skipFontReadyWait: false`
+    // for this exact reason — that's why the downloaded PDF was correct
+    // while the on-screen preview wasn't.
+    skipFontReadyWait = false
+  } = props;
+  react.useEffect(() => {
+    setPackageApiUrl(imageProxyUrl);
+  }, [imageProxyUrl]);
+  const [resolvedConfig, setResolvedConfig] = react.useState(null);
+  const [isLoading, setIsLoading] = react.useState(false);
+  const [fontsReady, setFontsReady] = react.useState(false);
+  const [fontsReadyVersion, setFontsReadyVersion] = react.useState(0);
+  const [canvasSettled, setCanvasSettled] = react.useState(false);
+  const [stabilizationPass, setStabilizationPass] = react.useState(0);
+  const isResolveMode = !("config" in props && props.config);
+  react.useEffect(() => {
+    if (!isResolveMode) {
+      setResolvedConfig(null);
+      setCanvasSettled(false);
+      console.log(PREVIEW_DEBUG_PREFIX, "config-mode active");
+      return;
+    }
+    const p = props;
+    if (!p.templateId || !p.formSchemaId || !p.supabaseUrl || !p.supabaseAnonKey) return;
+    let cancelled = false;
+    setIsLoading(true);
+    setFontsReady(false);
+    setCanvasSettled(false);
+    console.log(PREVIEW_DEBUG_PREFIX, "resolve-start", {
+      templateId: p.templateId,
+      formSchemaId: p.formSchemaId,
+      themeId: p.themeId ?? null,
+      pageIndex
+    });
+    resolveFromForm({
+      templateId: p.templateId,
+      formSchemaId: p.formSchemaId,
+      sectionState: p.sectionState,
+      themeId: p.themeId,
+      supabaseUrl: p.supabaseUrl,
+      supabaseAnonKey: p.supabaseAnonKey
+    }).then((resolved) => {
+      var _a, _b;
+      if (!cancelled) {
+        console.log(PREVIEW_DEBUG_PREFIX, "resolve-done", {
+          pages: ((_b = (_a = resolved.config) == null ? void 0 : _a.pages) == null ? void 0 : _b.length) ?? 0,
+          underlinedNodes: countUnderlinedNodes(resolved.config)
+        });
+        setResolvedConfig(resolved.config);
+        const hasAutoShrink = configHasAutoShrinkText$1(resolved.config);
+        const waitMs = hasAutoShrink ? 4e3 : 1800;
+        awaitFontsForConfig(resolved.config, waitMs).then(() => {
+          if (!cancelled) {
+            console.log(PREVIEW_DEBUG_PREFIX, "resolve-mode fonts settled", { hasAutoShrink, waitMs });
+            setFontsReady(true);
+            setIsLoading(false);
+          }
+        }).catch((err) => {
+          if (!cancelled) {
+            console.warn(PREVIEW_DEBUG_PREFIX, "resolve-mode font wait failed", err);
+            setFontsReady(true);
+            setIsLoading(false);
+          }
+        });
+      }
+    }).catch((err) => {
+      if (!cancelled) {
+        setIsLoading(false);
+        console.warn(PREVIEW_DEBUG_PREFIX, "resolve-error", err);
+        onError == null ? void 0 : onError(err instanceof Error ? err : new Error(String(err)));
+      }
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [
+    isResolveMode,
+    // For resolve mode, re-resolve when these change
+    isResolveMode ? props.templateId : void 0,
+    isResolveMode ? props.formSchemaId : void 0,
+    isResolveMode ? JSON.stringify(props.sectionState) : void 0,
+    isResolveMode ? props.themeId : void 0
+  ]);
+  const config = isResolveMode ? resolvedConfig : props.config;
+  react.useEffect(() => {
+    var _a, _b, _c;
+    if (!config) return;
+    let cancelled = false;
+    setCanvasSettled(false);
+    setStabilizationPass(0);
+    console.log(PREVIEW_DEBUG_PREFIX, "config-changed", {
+      pageIndex,
+      pages: ((_a = config.pages) == null ? void 0 : _a.length) ?? 0,
+      underlinedNodes: countUnderlinedNodes(config),
+      isResolveMode
+    });
+    const bump = () => {
+      if (cancelled) return;
+      clearMeasurementCache();
+      clearFabricCharCache();
+      setFontsReadyVersion((v) => {
+        const next = v + 1;
+        console.log(PREVIEW_DEBUG_PREFIX, "font-bump", { pageIndex, next, stabilizationPass });
+        return next;
+      });
+    };
+    (_c = (_b = document.fonts) == null ? void 0 : _b.ready) == null ? void 0 : _c.then(bump);
+    const timeoutId = window.setTimeout(bump, 350);
+    return () => {
+      cancelled = true;
+      window.clearTimeout(timeoutId);
+    };
+  }, [config]);
+  const previewKey = react.useMemo(
+    () => `${pageIndex}-${fontsReadyVersion}-${stabilizationPass}`,
+    [pageIndex, fontsReadyVersion, stabilizationPass]
+  );
+  react.useEffect(() => {
+    if (isResolveMode) return;
+    if (!config) {
+      setFontsReady(false);
+      setCanvasSettled(false);
+      setStabilizationPass(0);
+      return;
+    }
+    setFontsReady(false);
+    setCanvasSettled(false);
+    setStabilizationPass(0);
+    let cancelled = false;
+    const hasAutoShrink = configHasAutoShrinkText$1(config);
+    const waitMs = hasAutoShrink ? 4e3 : 1800;
+    awaitFontsForConfig(config, waitMs).then(() => {
+      if (cancelled) return;
+      console.log(PREVIEW_DEBUG_PREFIX, "config-mode fonts settled", {
+        pageIndex,
+        hasAutoShrink,
+        waitMs,
+        underlinedNodes: countUnderlinedNodes(config)
+      });
+      setFontsReady(true);
+    }).catch((err) => {
+      if (cancelled) return;
+      console.warn(PREVIEW_DEBUG_PREFIX, "config-mode font wait failed", err);
+      setFontsReady(true);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [isResolveMode, config]);
+  const handleCanvasReady = react.useCallback(() => {
+    if (stabilizationPass === 0) {
+      console.log(PREVIEW_DEBUG_PREFIX, "canvas-ready-pass", { pageIndex, stabilizationPass, action: "stabilize-again" });
+      setCanvasSettled(false);
+      setStabilizationPass(1);
+      return;
+    }
+    console.log(PREVIEW_DEBUG_PREFIX, "canvas-ready-pass", { pageIndex, stabilizationPass, action: "settled" });
+    setCanvasSettled(true);
+    onReady == null ? void 0 : onReady();
+  }, [onReady, pageIndex, stabilizationPass]);
+  if (isLoading) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className, style: { ...style, display: "flex", alignItems: "center", justifyContent: "center", minHeight: 200 }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: "#888", fontSize: 14 }, children: "Loading preview..." }) });
+  }
+  if (!config) return null;
+  if (!fontsReady) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className, style: { ...style, display: "flex", alignItems: "center", justifyContent: "center", minHeight: 200 }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: "#888", fontSize: 14 }, children: "Loading preview..." }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, style: { ...style, position: "relative" }, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { style: { visibility: canvasSettled ? "visible" : "hidden" }, children: /* @__PURE__ */ jsxRuntime.jsx(
+      PreviewCanvas,
+      {
+        config,
+        pageIndex,
+        zoom,
+        absoluteZoom,
+        skipFontReadyWait,
+        onDynamicFieldClick,
+        onReady: handleCanvasReady
+      },
+      previewKey
+    ) }),
+    !canvasSettled && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { position: "absolute", inset: 0, display: "flex", alignItems: "center", justifyContent: "center", minHeight: 200 }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: "#888", fontSize: 14 }, children: "Loading preview..." }) })
+  ] });
+}
+const PACKAGE_VERSION = "0.5.68";
+let __underlineFixInstalled = false;
+function installUnderlineFix(fab) {
+  var _a;
+  if (__underlineFixInstalled) return;
+  const TextProto = (_a = fab.Text) == null ? void 0 : _a.prototype;
+  if (!TextProto || typeof TextProto._renderTextDecoration !== "function") return;
+  const original = TextProto._renderTextDecoration;
+  const measureLineTextWidth = (obj, ctx, lineIndex) => {
+    var _a2, _b, _c, _d, _e, _f;
+    const rawLine = (_a2 = obj._textLines) == null ? void 0 : _a2[lineIndex];
+    const lineText = Array.isArray(rawLine) ? rawLine.join("") : String(rawLine ?? "");
+    if (!lineText) return 0;
+    const fontSize = Number(((_b = obj.getValueOfPropertyAt) == null ? void 0 : _b.call(obj, lineIndex, 0, "fontSize")) ?? obj.fontSize ?? 0);
+    const fontStyle = String(((_c = obj.getValueOfPropertyAt) == null ? void 0 : _c.call(obj, lineIndex, 0, "fontStyle")) ?? obj.fontStyle ?? "normal");
+    const fontWeight = String(((_d = obj.getValueOfPropertyAt) == null ? void 0 : _d.call(obj, lineIndex, 0, "fontWeight")) ?? obj.fontWeight ?? "400");
+    const fontFamily = String(((_e = obj.getValueOfPropertyAt) == null ? void 0 : _e.call(obj, lineIndex, 0, "fontFamily")) ?? obj.fontFamily ?? "sans-serif");
+    const charSpacing = Number(((_f = obj.getValueOfPropertyAt) == null ? void 0 : _f.call(obj, lineIndex, 0, "charSpacing")) ?? obj.charSpacing ?? 0);
+    ctx.save();
+    ctx.font = `${fontStyle} normal ${fontWeight} ${fontSize}px ${fontFamily}`;
+    const measured = ctx.measureText(lineText).width;
+    ctx.restore();
+    const graphemeCount = Array.from(lineText).length;
+    const spacingWidth = graphemeCount > 1 ? charSpacing / 1e3 * fontSize * (graphemeCount - 1) : 0;
+    return Math.max(0, measured + spacingWidth);
+  };
+  TextProto._renderTextDecoration = function patchedRenderTextDecoration(ctx, type) {
+    try {
+      const hasOwn = !!this[type];
+      const hasStyled = typeof this.styleHas === "function" && this.styleHas(type);
+      if (!hasOwn && !hasStyled) return;
+      const lines = this._textLines;
+      const offsets = this.offsets;
+      if (!Array.isArray(lines) || !offsets) {
+        return original.call(this, ctx, type);
+      }
+      const offsetY = offsets[type];
+      const offsetAligner = type === "linethrough" ? 0.5 : type === "overline" ? 1 : 0;
+      const leftOffset = this._getLeftOffset();
+      let topOffset = this._getTopOffset();
+      for (let i = 0, len = lines.length; i < len; i++) {
+        const heightOfLine = this.getHeightOfLine(i);
+        const lineHas = !!this[type] || typeof this.styleHas === "function" && this.styleHas(type, i);
+        if (!lineHas) {
+          topOffset += heightOfLine;
+          continue;
+        }
+        const fillStyle = this.getValueOfPropertyAt(i, 0, "fill");
+        const thickness = this.getValueOfPropertyAt(i, 0, "textDecorationThickness");
+        const charSize = this.getHeightOfChar(i, 0);
+        const dy = this.getValueOfPropertyAt(i, 0, "deltaY") || 0;
+        const finalThickness = this.fontSize * (thickness || 0) / 1e3;
+        if (!fillStyle || !finalThickness) {
+          topOffset += heightOfLine;
+          continue;
+        }
+        const lineWidth = measureLineTextWidth(this, ctx, i);
+        if (!lineWidth) {
+          topOffset += heightOfLine;
+          continue;
+        }
+        const availableWidth = Number(this.width ?? lineWidth);
+        let lineLeftOffset = 0;
+        const align = String(this.textAlign ?? "left");
+        if (align === "center") lineLeftOffset = (availableWidth - lineWidth) / 2;
+        else if (align === "right" || align === "end") lineLeftOffset = availableWidth - lineWidth;
+        let drawStart = leftOffset + lineLeftOffset;
+        if (this.direction === "rtl") {
+          drawStart = this.width - drawStart - lineWidth;
+        }
+        const maxHeight = heightOfLine / this.lineHeight;
+        const top = topOffset + maxHeight * (1 - this._fontSizeFraction);
+        ctx.fillStyle = fillStyle;
+        ctx.fillRect(
+          drawStart,
+          top + offsetY * charSize + dy - offsetAligner * finalThickness,
+          lineWidth,
+          finalThickness
+        );
+        topOffset += heightOfLine;
+      }
+      if (typeof this._removeShadow === "function") {
+        try {
+          this._removeShadow(ctx);
+        } catch {
+        }
+      }
+    } catch {
+      try {
+        return original.call(this, ctx, type);
+      } catch {
+      }
+    }
+  };
+  __underlineFixInstalled = true;
+  console.log(`[canvas-renderer] underline-fix monkey patch installed (v${PACKAGE_VERSION})`);
+}
+function configHasAutoShrinkText(config) {
+  var _a;
+  if (!((_a = config == null ? void 0 : config.pages) == null ? void 0 : _a.length)) return false;
+  const walk = (nodes) => {
+    for (const node of nodes || []) {
+      if (!node) continue;
+      if (node.type === "text" && node.overflowPolicy === "auto-shrink") return true;
+      if (Array.isArray(node.children) && node.children.length && walk(node.children)) return true;
+    }
+    return false;
+  };
+  for (const page of config.pages) {
+    if (walk(page.children || [])) return true;
+  }
+  return false;
+}
+class PixldocsRenderer {
+  constructor(config) {
+    __publicField(this, "config");
+    this.config = config;
+    installUnderlineFix(fabric__namespace);
+    try {
+      console.log(`[canvas-renderer] PixldocsRenderer v${PACKAGE_VERSION} initialized`);
+    } catch {
+    }
+  }
+  /**
+   * Render a pre-resolved template config to an image using the full PageCanvas engine.
+   * Mounts a hidden PreviewCanvas component and captures the Fabric canvas output.
+   */
+  async render(templateConfig, options = {}) {
+    const pageIndex = options.pageIndex ?? 0;
+    const format = options.format ?? "png";
+    const quality = options.quality ?? 0.92;
+    const pixelRatio = options.pixelRatio ?? this.config.pixelRatio ?? 2;
+    const canvasWidth = templateConfig.canvas.width;
+    const canvasHeight = templateConfig.canvas.height;
+    const page = templateConfig.pages[pageIndex];
+    if (!page) {
+      throw new Error(`Page index ${pageIndex} not found (template has ${templateConfig.pages.length} pages)`);
+    }
+    await ensureFontsForResolvedConfig(templateConfig);
+    if (!options.skipFontReadyWait) {
+      const hasAutoShrink = configHasAutoShrinkText(templateConfig);
+      const defaultWait = hasAutoShrink ? 4e3 : 1800;
+      await this.awaitFontsForConfig(templateConfig, options.waitForFontsMs ?? defaultWait);
+    }
+    const { setPackageApiUrl: setPackageApiUrl2 } = await Promise.resolve().then(() => appApi);
+    setPackageApiUrl2(this.config.imageProxyUrl);
+    const dataUrl = await this.renderPageViaPreviewCanvas(
+      templateConfig,
+      pageIndex,
+      pixelRatio,
+      format,
+      quality,
+      { skipFontReadyWait: options.skipFontReadyWait, waitForFontsMs: options.waitForFontsMs }
+    );
+    return {
+      dataUrl,
+      width: canvasWidth,
+      height: canvasHeight,
+      pixelWidth: canvasWidth * pixelRatio,
+      pixelHeight: canvasHeight * pixelRatio
+    };
+  }
+  /**
+   * Render all pages and return array of results.
+   */
+  async renderAllPages(templateConfig, options = {}) {
+    if (!options.skipFontReadyWait) {
+      const hasAutoShrink = configHasAutoShrinkText(templateConfig);
+      const defaultWait = hasAutoShrink ? 4e3 : 1800;
+      await this.awaitFontsForConfig(templateConfig, options.waitForFontsMs ?? defaultWait);
+    }
+    const results = [];
+    for (let i = 0; i < templateConfig.pages.length; i++) {
+      results.push(await this.render(templateConfig, { ...options, pageIndex: i, skipFontReadyWait: true }));
+    }
+    return results;
+  }
+  /**
+   * Resolve from V2 sectionState (like the server API) and render all pages.
+   * This is the primary external API for the package.
+   */
+  async renderFromForm(options) {
+    const { templateId, formSchemaId, sectionState, themeId, watermark, watermarkOptions, prefetched, ...renderOpts } = options;
+    const resolved = await resolveFromForm({
+      templateId,
+      formSchemaId,
+      sectionState,
+      themeId,
+      supabaseUrl: this.config.supabaseUrl,
+      supabaseAnonKey: this.config.supabaseAnonKey,
+      prefetched
+    });
+    const shouldWatermark = watermark ?? resolved.price > 0;
+    let configToRender = resolved.config;
+    if (shouldWatermark) {
+      const { injectWatermark } = await Promise.resolve().then(() => require("./canvasWatermark-B0ab38Ok.cjs"));
+      configToRender = injectWatermark(configToRender, watermarkOptions);
+    }
+    return this.renderAllPages(configToRender, renderOpts);
+  }
+  /**
+   * Render a page and capture the Fabric canvas SVG output (vector, not raster).
+   * This is the key building block for client-side vector PDF export.
+   */
+  async renderPageSvg(templateConfig, pageIndex = 0) {
+    const page = templateConfig.pages[pageIndex];
+    if (!page) {
+      throw new Error(`Page index ${pageIndex} not found (template has ${templateConfig.pages.length} pages)`);
+    }
+    await ensureFontsForResolvedConfig(templateConfig);
+    const hasAutoShrinkSvg = configHasAutoShrinkText(templateConfig);
+    await this.awaitFontsForConfig(templateConfig, hasAutoShrinkSvg ? 4e3 : 1800);
+    const { setPackageApiUrl: setPackageApiUrl2 } = await Promise.resolve().then(() => appApi);
+    setPackageApiUrl2(this.config.imageProxyUrl);
+    const canvasWidth = templateConfig.canvas.width;
+    const canvasHeight = templateConfig.canvas.height;
+    return this.captureSvgViaPreviewCanvas(templateConfig, pageIndex, canvasWidth, canvasHeight);
+  }
+  /**
+   * Render all pages and return SVG strings for each.
+   */
+  async renderAllPageSvgs(templateConfig) {
+    await ensureFontsForResolvedConfig(templateConfig);
+    const hasAutoShrinkSvg = configHasAutoShrinkText(templateConfig);
+    await this.awaitFontsForConfig(templateConfig, hasAutoShrinkSvg ? 4e3 : 1800);
+    const { setPackageApiUrl: setPackageApiUrl2 } = await Promise.resolve().then(() => appApi);
+    setPackageApiUrl2(this.config.imageProxyUrl);
+    const results = [];
+    for (let i = 0; i < templateConfig.pages.length; i++) {
+      const canvasWidth = templateConfig.canvas.width;
+      const canvasHeight = templateConfig.canvas.height;
+      results.push(await this.captureSvgViaPreviewCanvas(templateConfig, i, canvasWidth, canvasHeight));
+    }
+    return results;
+  }
+  /**
+   * Resolve from V2 sectionState and return SVGs for all pages (for server vector PDF).
+   */
+  async renderSvgsFromForm(options) {
+    const { templateId, formSchemaId, sectionState, themeId, watermark, watermarkOptions, prefetched } = options;
+    const resolved = await resolveFromForm({
+      templateId,
+      formSchemaId,
+      sectionState,
+      themeId,
+      supabaseUrl: this.config.supabaseUrl,
+      supabaseAnonKey: this.config.supabaseAnonKey,
+      prefetched
+    });
+    const shouldWatermark = watermark ?? resolved.price > 0;
+    let configToRender = resolved.config;
+    if (shouldWatermark) {
+      const { injectWatermark } = await Promise.resolve().then(() => require("./canvasWatermark-B0ab38Ok.cjs"));
+      configToRender = injectWatermark(configToRender, watermarkOptions);
+    }
+    return this.renderAllPageSvgs(configToRender);
+  }
+  /**
+   * Render a pre-resolved template config to a vector PDF.
+   * Returns a Blob and ArrayBuffer.
+   */
+  async renderPdf(templateConfig, options) {
+    const svgs = await this.renderAllPageSvgs(templateConfig);
+    const { assemblePdfFromSvgs: assemblePdfFromSvgs2 } = await Promise.resolve().then(() => pdfExport);
+    return assemblePdfFromSvgs2(svgs, { title: options == null ? void 0 : options.title, fontBaseUrl: options == null ? void 0 : options.fontBaseUrl });
+  }
+  /**
+   * Resolve from V2 sectionState and render a vector PDF.
+   * This is the primary PDF export API — mirrors renderFromForm() but returns a PDF.
+   */
+  async renderPdfFromForm(options) {
+    const { templateId, formSchemaId, sectionState, themeId, watermark, watermarkOptions, prefetched, title, fontBaseUrl } = options;
+    const resolved = await resolveFromForm({
+      templateId,
+      formSchemaId,
+      sectionState,
+      themeId,
+      supabaseUrl: this.config.supabaseUrl,
+      supabaseAnonKey: this.config.supabaseAnonKey,
+      prefetched
+    });
+    const shouldWatermark = watermark ?? resolved.price > 0;
+    let configToRender = resolved.config;
+    if (shouldWatermark) {
+      const { injectWatermark } = await Promise.resolve().then(() => require("./canvasWatermark-B0ab38Ok.cjs"));
+      configToRender = injectWatermark(configToRender, watermarkOptions);
+    }
+    const svgs = await this.renderAllPageSvgs(configToRender);
+    const { assemblePdfFromSvgs: assemblePdfFromSvgs2 } = await Promise.resolve().then(() => pdfExport);
+    return assemblePdfFromSvgs2(svgs, { title: title ?? resolved.config.name, fontBaseUrl });
+  }
+  async renderById(templateId, formData, options) {
+    const resolved = await resolveTemplateData({
+      templateId,
+      formData,
+      supabaseUrl: this.config.supabaseUrl,
+      supabaseAnonKey: this.config.supabaseAnonKey
+    });
+    return this.render(resolved.config, options);
+  }
+  /**
+   * Convenience: fetch by ID with flat data and render ALL pages.
+   */
+  async renderAllById(templateId, formData, options) {
+    const resolved = await resolveTemplateData({
+      templateId,
+      formData,
+      supabaseUrl: this.config.supabaseUrl,
+      supabaseAnonKey: this.config.supabaseAnonKey
+    });
+    return this.renderAllPages(resolved.config, options);
+  }
+  // ─── Internal: render a page using the full PreviewCanvas engine ───
+  getExpectedImageCount(config, pageIndex) {
+    const page = config.pages[pageIndex];
+    if (!(page == null ? void 0 : page.children)) return 0;
+    let count = 0;
+    const walk = (nodes) => {
+      for (const node of nodes) {
+        if (!node || node.visible === false) continue;
+        const src = typeof node.src === "string" ? node.src.trim() : "";
+        const imageUrl = typeof node.imageUrl === "string" ? node.imageUrl.trim() : "";
+        if (node.type === "image" && (src || imageUrl)) count += 1;
+        if (Array.isArray(node.children) && node.children.length > 0) {
+          walk(node.children);
+        }
+      }
+    };
+    walk(page.children);
+    return count;
+  }
+  waitForCanvasImages(container, expectedImageCount, maxWaitMs = 15e3, pollMs = 120) {
+    return new Promise((resolve) => {
+      const start = Date.now();
+      let stableFrames = 0;
+      let lastSummary = "";
+      const isRenderableImage = (value) => value instanceof HTMLImageElement && value.complete && value.naturalWidth > 0 && value.naturalHeight > 0;
+      const collectRenderableImages = (obj, seen) => {
+        if (!obj || typeof obj !== "object") return;
+        const candidates = [obj._element, obj._originalElement, obj._filteredEl, obj._cacheCanvasEl];
+        for (const candidate of candidates) {
+          if (isRenderableImage(candidate)) {
+            seen.add(candidate);
+          } else if (candidate instanceof HTMLImageElement) {
+            return false;
+          }
+        }
+        const nested = Array.isArray(obj._objects) ? obj._objects : Array.isArray(obj.objects) ? obj.objects : [];
+        for (const child of nested) {
+          if (collectRenderableImages(child, seen) === false) return false;
+        }
+        return true;
+      };
+      const getFabricCanvas = () => {
+        const registry2 = window.__fabricCanvasRegistry;
+        if (registry2 instanceof Map) {
+          for (const entry of registry2.values()) {
+            const canvas = entry == null ? void 0 : entry.canvas;
+            const el = (canvas == null ? void 0 : canvas.lowerCanvasEl) || (canvas == null ? void 0 : canvas.upperCanvasEl);
+            if (el && container.contains(el)) return canvas;
+          }
+        }
+        return null;
+      };
+      const settle = () => requestAnimationFrame(() => requestAnimationFrame(() => resolve()));
+      const getImageDebugInfo = (obj, bucket) => {
+        if (!obj || typeof obj !== "object") return;
+        const candidates = [obj._element, obj._originalElement, obj._filteredEl, obj._cacheCanvasEl];
+        for (const candidate of candidates) {
+          if (candidate instanceof HTMLImageElement) {
+            bucket.push({
+              id: obj.__docuforgeId || obj.id || "unknown",
+              src: (candidate.currentSrc || candidate.src || "").slice(0, 240),
+              complete: candidate.complete,
+              naturalWidth: candidate.naturalWidth,
+              naturalHeight: candidate.naturalHeight
+            });
+          }
+        }
+        const nested = Array.isArray(obj._objects) ? obj._objects : Array.isArray(obj.objects) ? obj.objects : [];
+        for (const child of nested) {
+          getImageDebugInfo(child, bucket);
+        }
+      };
+      const check = () => {
+        const elapsed = Date.now() - start;
+        const domImages = Array.from(container.querySelectorAll("img"));
+        const allDomLoaded = domImages.every((img) => img.complete && img.naturalWidth > 0 && img.naturalHeight > 0);
+        const fabricCanvas = getFabricCanvas();
+        const fabricObjects = fabricCanvas && typeof fabricCanvas.getObjects === "function" ? fabricCanvas.getObjects() : [];
+        const renderableImages = /* @__PURE__ */ new Set();
+        const fabricReady = fabricObjects.every((obj) => collectRenderableImages(obj, renderableImages) !== false);
+        const actualImageCount = Math.max(domImages.length, renderableImages.size);
+        const canvasReady = !!fabricCanvas && !!(fabricCanvas.lowerCanvasEl || fabricCanvas.upperCanvasEl);
+        const hasExpectedAssets = expectedImageCount === 0 ? true : actualImageCount >= expectedImageCount;
+        const ready = allDomLoaded && fabricReady && hasExpectedAssets;
+        const summary = `expected=${expectedImageCount} actual=${actualImageCount} dom=${domImages.length} fabricReady=${fabricReady} domReady=${allDomLoaded} canvasReady=${canvasReady}`;
+        if (summary !== lastSummary) {
+          lastSummary = summary;
+          console.log(`[canvas-renderer][asset-wait] ${summary}`);
+        }
+        if (ready) {
+          stableFrames += 1;
+          if (stableFrames >= 2) {
+            console.log(`[canvas-renderer][asset-wait] ready after ${elapsed}ms (${summary})`);
+            settle();
+            return;
+          }
+        } else {
+          stableFrames = 0;
+        }
+        if (elapsed >= maxWaitMs) {
+          const fabricImageDebug = [];
+          for (const obj of fabricObjects) {
+            getImageDebugInfo(obj, fabricImageDebug);
+          }
+          const domImageDebug = domImages.map((img, index) => ({
+            index,
+            src: (img.currentSrc || img.src || "").slice(0, 240),
+            complete: img.complete,
+            naturalWidth: img.naturalWidth,
+            naturalHeight: img.naturalHeight
+          }));
+          console.warn(`[canvas-renderer][asset-wait-timeout] elapsed=${elapsed}ms ${summary}`);
+          console.warn("[canvas-renderer][asset-wait-timeout][dom-images]", domImageDebug);
+          console.warn("[canvas-renderer][asset-wait-timeout][fabric-images]", fabricImageDebug);
+          settle();
+          return;
+        }
+        setTimeout(check, pollMs);
+      };
+      setTimeout(check, 0);
+    });
+  }
+  waitForCanvasScene(container, config, pageIndex, maxWaitMs = 8e3, pollMs = 50) {
+    return new Promise((resolve) => {
+      var _a, _b;
+      const start = Date.now();
+      const pageHasContent = (((_b = (_a = config.pages[pageIndex]) == null ? void 0 : _a.children) == null ? void 0 : _b.length) ?? 0) > 0;
+      const settle = () => requestAnimationFrame(() => requestAnimationFrame(() => resolve()));
+      const check = () => {
+        const fabricCanvas = this.getFabricCanvasFromContainer(container);
+        const lowerCanvas = (fabricCanvas == null ? void 0 : fabricCanvas.lowerCanvasEl) || container.querySelector("canvas.lower-canvas, canvas");
+        const objectCount = typeof (fabricCanvas == null ? void 0 : fabricCanvas.getObjects) === "function" ? fabricCanvas.getObjects().length : 0;
+        const ready = !!lowerCanvas && (!pageHasContent || objectCount > 0);
+        if (ready) {
+          console.log(`[canvas-renderer][scene-wait] ready after ${Date.now() - start}ms (objects=${objectCount})`);
+          settle();
+          return;
+        }
+        if (Date.now() - start >= maxWaitMs) {
+          console.warn(`[canvas-renderer][scene-wait-timeout] elapsed=${Date.now() - start}ms objects=${objectCount} pageHasContent=${pageHasContent}`);
+          settle();
+          return;
+        }
+        setTimeout(check, pollMs);
+      };
+      setTimeout(check, 0);
+    });
+  }
+  async waitForRelevantFonts(config, maxWaitMs = 1800) {
+    if (typeof document === "undefined" || !document.fonts) return;
+    const descriptors = collectFontDescriptorsFromConfig(config);
+    if (descriptors.length === 0) return;
+    const loads = Promise.all(
+      descriptors.map((descriptor) => {
+        const stylePrefix = descriptor.style === "italic" ? "italic " : "";
+        const spec = `${stylePrefix}${descriptor.weight} 16px "${descriptor.family}"`;
+        return document.fonts.load(spec).catch(() => []);
+      })
+    ).then(() => void 0);
+    await Promise.race([
+      loads,
+      new Promise((resolve) => setTimeout(resolve, maxWaitMs))
+    ]);
+    await new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(() => resolve())));
   }
-  return files.regular;
-}
-function isItalicPath(files, path) {
-  return path === files.italic || path === files.boldItalic || path === files.lightItalic || path === files.mediumItalic || path === files.semiboldItalic;
-}
-function getJsPDFFontName(fontName) {
-  return fontName.replace(/\s+/g, "");
-}
-function getEmbeddedJsPDFFontName(fontName, weight, isItalic = false) {
-  const resolved = resolveFontWeight(weight);
-  const label = FONT_WEIGHT_LABELS[resolved];
-  const italicSuffix = isItalic ? "Italic" : "";
-  return `${getJsPDFFontName(fontName)}-${label}${italicSuffix}`;
-}
-function isFontAvailable(fontName) {
-  return fontName in FONT_FILES;
-}
-const ttfCache = /* @__PURE__ */ new Map();
-async function fetchTTFAsBase64(url) {
-  const cached = ttfCache.get(url);
-  if (cached) return cached;
-  try {
-    const res = await fetch(url);
-    if (!res.ok) return null;
-    const buf = await res.arrayBuffer();
-    const bytes = new Uint8Array(buf);
-    let binary = "";
-    for (let i = 0; i < bytes.length; i++) {
-      binary += String.fromCharCode(bytes[i]);
+  /**
+   * Block until the webfonts referenced by `config` have actually loaded
+   * (or `maxWaitMs` elapses). Used by the headless capture path BEFORE
+   * mounting `PreviewCanvas`, so the synchronous `createText` auto-shrink
+   * loop measures against final font metrics instead of fallback ones.
+   *
+   * Stronger than `ensureFontsForResolvedConfig` (which is fire-and-forget)
+   * — this awaits each `document.fonts.load(spec)` AND `document.fonts.ready`,
+   * racing the whole thing against `maxWaitMs` so a slow CDN can't hang the
+   * renderer.
+   */
+  async awaitFontsForConfig(config, maxWaitMs) {
+    if (typeof document === "undefined" || !document.fonts) return;
+    void ensureFontsForResolvedConfig(config);
+    await this.waitForRelevantFonts(config, maxWaitMs);
+    await Promise.race([
+      document.fonts.ready.catch(() => void 0).then(() => void 0),
+      new Promise((r) => setTimeout(r, Math.min(500, maxWaitMs)))
+    ]);
+  }
+  getNormalizedGradientStops(gradient) {
+    const stops = Array.isArray(gradient == null ? void 0 : gradient.stops) ? gradient.stops.map((stop) => ({
+      offset: Math.max(0, Math.min(1, Number((stop == null ? void 0 : stop.offset) ?? 0))),
+      color: String((stop == null ? void 0 : stop.color) ?? "#ffffff")
+    })).filter((stop) => Number.isFinite(stop.offset)).sort((a, b) => a.offset - b.offset) : [];
+    if (stops.length === 0) return [];
+    const normalized = [...stops];
+    if (normalized[0].offset > 0) {
+      normalized.unshift({ offset: 0, color: normalized[0].color });
     }
-    const b64 = btoa(binary);
-    ttfCache.set(url, b64);
-    return b64;
-  } catch {
-    return null;
+    if (normalized[normalized.length - 1].offset < 1) {
+      normalized.push({ offset: 1, color: normalized[normalized.length - 1].color });
+    }
+    return normalized;
   }
-}
-async function embedFont(pdf, fontName, weight, fontBaseUrl, isItalic = false) {
-  const fontFiles = FONT_FILES[fontName];
-  if (!fontFiles) return false;
-  const baseUrl = fontBaseUrl.endsWith("/") ? fontBaseUrl : fontBaseUrl + "/";
-  const resolvedWeight = resolveFontWeight(weight);
-  const fontPath = getFontPathForWeight(fontFiles, resolvedWeight, isItalic);
-  if (!fontPath) return false;
-  const hasItalicFile = isItalic && isItalicPath(fontFiles, fontPath);
-  const jsPdfFontName = getEmbeddedJsPDFFontName(fontName, weight, hasItalicFile);
-  const label = FONT_WEIGHT_LABELS[resolvedWeight];
-  const italicSuffix = hasItalicFile ? "Italic" : "";
-  const fileName = `${getJsPDFFontName(fontName)}-${label}${italicSuffix}.ttf`;
-  const url = baseUrl + fontPath;
-  try {
-    const b64 = await fetchTTFAsBase64(url);
-    if (!b64) return false;
-    pdf.addFileToVFS(fileName, b64);
-    pdf.addFont(fileName, jsPdfFontName, "normal");
-    if (fontName !== jsPdfFontName) {
-      try {
-        pdf.addFont(fileName, fontName, "normal");
-      } catch {
+  paintPageBackground(ctx, page, width, height) {
+    var _a, _b;
+    const backgroundColor = ((_a = page == null ? void 0 : page.settings) == null ? void 0 : _a.backgroundColor) || "#ffffff";
+    const gradient = (_b = page == null ? void 0 : page.settings) == null ? void 0 : _b.backgroundGradient;
+    ctx.clearRect(0, 0, width, height);
+    ctx.fillStyle = backgroundColor;
+    ctx.fillRect(0, 0, width, height);
+    const stops = this.getNormalizedGradientStops(gradient);
+    if (stops.length < 2) return;
+    try {
+      let canvasGradient = null;
+      if ((gradient == null ? void 0 : gradient.type) === "radial") {
+        const cx = Number.isFinite(gradient == null ? void 0 : gradient.cx) ? gradient.cx : 0.5;
+        const cy = Number.isFinite(gradient == null ? void 0 : gradient.cy) ? gradient.cy : 0.5;
+        const centerX = width * cx;
+        const centerY = height * cy;
+        const radius = Math.max(
+          Math.hypot(centerX, centerY),
+          Math.hypot(width - centerX, centerY),
+          Math.hypot(centerX, height - centerY),
+          Math.hypot(width - centerX, height - centerY)
+        );
+        canvasGradient = ctx.createRadialGradient(centerX, centerY, 0, centerX, centerY, radius);
+      } else if ((gradient == null ? void 0 : gradient.type) === "conic" && typeof ctx.createConicGradient === "function") {
+        const cx = Number.isFinite(gradient == null ? void 0 : gradient.cx) ? gradient.cx : 0.5;
+        const cy = Number.isFinite(gradient == null ? void 0 : gradient.cy) ? gradient.cy : 0.5;
+        const startAngle = (((gradient == null ? void 0 : gradient.angle) ?? 0) - 90) * Math.PI / 180;
+        canvasGradient = ctx.createConicGradient(startAngle, width * cx, height * cy);
+      } else {
+        const angleDeg = (gradient == null ? void 0 : gradient.angle) ?? 90;
+        const angleRad = angleDeg * Math.PI / 180;
+        const sinA = Math.sin(angleRad);
+        const cosA = Math.cos(angleRad);
+        const midX = width / 2;
+        const midY = height / 2;
+        const corners = [
+          [0, 0],
+          [width, 0],
+          [width, height],
+          [0, height]
+        ];
+        const projections = corners.map(([x, y]) => x * sinA - y * cosA);
+        const minProjection = Math.min(...projections);
+        const maxProjection = Math.max(...projections);
+        canvasGradient = ctx.createLinearGradient(
+          midX + minProjection * sinA,
+          midY - minProjection * cosA,
+          midX + maxProjection * sinA,
+          midY - maxProjection * cosA
+        );
       }
+      if (!canvasGradient) return;
+      stops.forEach((stop) => canvasGradient.addColorStop(stop.offset, stop.color));
+      ctx.fillStyle = canvasGradient;
+      ctx.fillRect(0, 0, width, height);
+    } catch {
     }
-    return true;
-  } catch (e) {
-    console.warn(`[pdf-fonts] Failed to embed ${fontName} w${weight}:`, e);
-    return false;
   }
-}
-async function embedFontsForConfig(pdf, config, fontBaseUrl) {
-  const fontKeys = /* @__PURE__ */ new Set();
-  const SEP = "";
-  const walkElements = (elements) => {
-    for (const el of elements) {
-      if (el.fontFamily) {
-        const w = resolveFontWeight(el.fontWeight ?? 400);
-        fontKeys.add(`${el.fontFamily}${SEP}${w}`);
-      }
-      if (el.styles && typeof el.styles === "object") {
-        for (const lineKey of Object.keys(el.styles)) {
-          const lineStyles = el.styles[lineKey];
-          if (lineStyles && typeof lineStyles === "object") {
-            for (const charKey of Object.keys(lineStyles)) {
-              const s = lineStyles[charKey];
-              if (s == null ? void 0 : s.fontFamily) {
-                const w = resolveFontWeight(s.fontWeight ?? 400);
-                fontKeys.add(`${s.fontFamily}${SEP}${w}`);
-              }
+  async renderPageViaPreviewCanvas(config, pageIndex, pixelRatio, format, quality, options = {}) {
+    const { PreviewCanvas: PreviewCanvas2 } = await Promise.resolve().then(() => PreviewCanvas$1);
+    const canvasWidth = config.canvas.width;
+    const canvasHeight = config.canvas.height;
+    const hasAutoShrink = configHasAutoShrinkText(config);
+    let firstMountSettled = false;
+    let lateFontSettleDetected = false;
+    if (typeof document !== "undefined" && document.fonts && hasAutoShrink) {
+      document.fonts.ready.then(() => {
+        if (firstMountSettled) lateFontSettleDetected = true;
+      }).catch(() => {
+      });
+    }
+    return new Promise((resolve, reject) => {
+      const container = document.createElement("div");
+      container.style.cssText = `
+        position: fixed; left: -99999px; top: -99999px;
+        width: ${canvasWidth}px; height: ${canvasHeight}px;
+        overflow: hidden; pointer-events: none; opacity: 0;
+      `;
+      document.body.appendChild(container);
+      const timeout = setTimeout(() => {
+        cleanup();
+        reject(new Error("Render timeout (30s)"));
+      }, 3e4);
+      let root;
+      let mountKey = 0;
+      const cleanup = () => {
+        clearTimeout(timeout);
+        try {
+          root.unmount();
+        } catch {
+        }
+        container.remove();
+      };
+      const remountWithFreshKey = async () => {
+        mountKey += 1;
+        try {
+          clearMeasurementCache();
+        } catch {
+        }
+        try {
+          clearFabricCharCache();
+        } catch {
+        }
+        try {
+          root.unmount();
+        } catch {
+        }
+        root = client.createRoot(container);
+        await new Promise((settle) => {
+          const onReadyOnce = () => {
+            this.waitForCanvasScene(container, config, pageIndex).then(async () => {
+              const fabricInstance = this.getFabricCanvasFromContainer(container);
+              const expectedImageCount = this.getExpectedImageCount(config, pageIndex);
+              await this.waitForCanvasImages(container, expectedImageCount);
+              await this.waitForStableTextMetrics(container, config);
+              await this.waitForCanvasScene(container, config, pageIndex);
+              if (!fabricInstance) return settle();
+              settle();
+            }).catch(() => settle());
+          };
+          root.render(
+            react.createElement(PreviewCanvas2, {
+              key: `remount-${mountKey}`,
+              config,
+              pageIndex,
+              zoom: pixelRatio,
+              absoluteZoom: true,
+              skipFontReadyWait: false,
+              onReady: onReadyOnce
+            })
+          );
+        });
+      };
+      const onReady = () => {
+        this.waitForCanvasScene(container, config, pageIndex).then(async () => {
+          try {
+            const fabricInstance = this.getFabricCanvasFromContainer(container);
+            const expectedImageCount = this.getExpectedImageCount(config, pageIndex);
+            await this.waitForCanvasImages(container, expectedImageCount);
+            await this.waitForStableTextMetrics(container, config);
+            await this.waitForCanvasScene(container, config, pageIndex);
+            firstMountSettled = true;
+            if (hasAutoShrink && lateFontSettleDetected) {
+              console.log("[canvas-renderer][parity] late font-settle detected — remounting for auto-shrink reflow");
+              await remountWithFreshKey();
+            }
+            const fabricCanvas = container.querySelector("canvas.upper-canvas, canvas");
+            const sourceCanvas = (fabricInstance == null ? void 0 : fabricInstance.lowerCanvasEl) || container.querySelector("canvas.lower-canvas") || fabricCanvas;
+            const fabricInstanceAfter = this.getFabricCanvasFromContainer(container) || fabricInstance;
+            const sourceCanvasAfter = (fabricInstanceAfter == null ? void 0 : fabricInstanceAfter.lowerCanvasEl) || container.querySelector("canvas.lower-canvas") || sourceCanvas;
+            if (!sourceCanvas) {
+              cleanup();
+              reject(new Error("No canvas element found after render"));
+              return;
+            }
+            const exportCanvas = document.createElement("canvas");
+            exportCanvas.width = sourceCanvasAfter.width;
+            exportCanvas.height = sourceCanvasAfter.height;
+            const exportCtx = exportCanvas.getContext("2d");
+            if (!exportCtx) {
+              cleanup();
+              reject(new Error("Failed to create export canvas"));
+              return;
             }
+            exportCtx.save();
+            exportCtx.scale(sourceCanvasAfter.width / canvasWidth, sourceCanvasAfter.height / canvasHeight);
+            this.paintPageBackground(exportCtx, config.pages[pageIndex], canvasWidth, canvasHeight);
+            exportCtx.restore();
+            exportCtx.drawImage(sourceCanvasAfter, 0, 0);
+            const mimeType = format === "jpeg" ? "image/jpeg" : format === "webp" ? "image/webp" : "image/png";
+            const dataUrl = exportCanvas.toDataURL(mimeType, quality);
+            cleanup();
+            resolve(dataUrl);
+          } catch (err) {
+            cleanup();
+            reject(err);
           }
-        }
-      }
-      if (el.children) walkElements(el.children);
-      if (el.objects) walkElements(el.objects);
-    }
-  };
-  for (const page of (config == null ? void 0 : config.pages) || []) {
-    if (page.children) walkElements(page.children);
-    if (page.elements) walkElements(page.elements);
-  }
-  fontKeys.add(`${FONT_FALLBACK_SYMBOLS}${SEP}400`);
-  for (const w of [300, 400, 500, 600, 700]) {
-    fontKeys.add(`${FONT_FALLBACK_DEVANAGARI}${SEP}${w}`);
-  }
-  const embedded = /* @__PURE__ */ new Set();
-  const tasks = [];
-  for (const key of fontKeys) {
-    const sep = key.indexOf(SEP);
-    const fontName = key.slice(0, sep);
-    const weight = parseInt(key.slice(sep + 1), 10);
-    if (!isFontAvailable(fontName)) continue;
-    tasks.push(
-      embedFont(pdf, fontName, weight, fontBaseUrl).then((ok) => {
-        if (ok) embedded.add(key);
-      })
-    );
+        });
+      };
+      root = client.createRoot(container);
+      root.render(
+        react.createElement(PreviewCanvas2, {
+          config,
+          pageIndex,
+          zoom: pixelRatio,
+          absoluteZoom: true,
+          skipFontReadyWait: false,
+          onReady
+        })
+      );
+    });
   }
-  await Promise.all(tasks);
-  console.log(`[pdf-fonts] Embedded ${embedded.size} font variants from config`);
-  return embedded;
-}
-function isDevanagari(char) {
-  const c = char.codePointAt(0) ?? 0;
-  return c >= 2304 && c <= 2431 || c >= 43232 && c <= 43263 || c >= 7376 && c <= 7423;
-}
-function containsDevanagari(text) {
-  if (!text) return false;
-  for (const char of text) {
-    if (isDevanagari(char)) return true;
+  // ─── Internal: capture SVG from a rendered Fabric canvas ───
+  //
+  // APPROACH: Use the SAME PreviewCanvas that renders perfect PNGs, then call
+  // Fabric's toSVG() on that canvas. This guarantees 100% layout parity —
+  // the SVG is a vector snapshot of exactly what's on screen.
+  //
+  // The trick: before calling toSVG(), we temporarily neutralize the viewport
+  // transform and retina scaling so Fabric emits coordinates in logical
+  // document space (e.g. 612x792) instead of inflated pixel space.
+  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;
+        width: ${canvasWidth}px; height: ${canvasHeight}px;
+        overflow: hidden; pointer-events: none; opacity: 0;
+      `;
+      document.body.appendChild(container);
+      const timeout = setTimeout(() => {
+        cleanup();
+        reject(new Error("SVG render timeout (30s)"));
+      }, 3e4);
+      let root = null;
+      let mountKey = 0;
+      let didPreviewParityRemount = false;
+      const cleanup = () => {
+        clearTimeout(timeout);
+        try {
+          root == null ? void 0 : root.unmount();
+        } catch {
+        }
+        container.remove();
+      };
+      const mountPreview = (readyHandler) => {
+        root = client.createRoot(container);
+        root.render(
+          react.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;
+          try {
+            const expectedImageCount = this.getExpectedImageCount(config, pageIndex);
+            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();
+              reject(new Error("No Fabric canvas instance found for SVG capture"));
+              return;
+            }
+            const prevVPT = fabricInstance.viewportTransform ? [...fabricInstance.viewportTransform] : void 0;
+            const prevSvgVPT = fabricInstance.svgViewportTransformation;
+            const prevRetina = fabricInstance.enableRetinaScaling;
+            const prevWidth = fabricInstance.width;
+            const prevHeight = fabricInstance.height;
+            fabricInstance.viewportTransform = [1, 0, 0, 1, 0, 0];
+            fabricInstance.svgViewportTransformation = false;
+            fabricInstance.enableRetinaScaling = false;
+            fabricInstance.setDimensions(
+              { width: canvasWidth, height: canvasHeight },
+              { cssOnly: false, backstoreOnly: false }
+            );
+            const rawSvgString = fabricInstance.toSVG();
+            const svgString = this.normalizeSvgDimensions(
+              rawSvgString,
+              canvasWidth,
+              canvasHeight
+            );
+            fabricInstance.enableRetinaScaling = prevRetina;
+            fabricInstance.setDimensions(
+              { width: prevWidth, height: prevHeight },
+              { cssOnly: false, backstoreOnly: false }
+            );
+            if (prevVPT) fabricInstance.viewportTransform = prevVPT;
+            fabricInstance.svgViewportTransformation = prevSvgVPT;
+            const page = config.pages[pageIndex];
+            const backgroundColor = ((_a = page == null ? void 0 : page.settings) == null ? void 0 : _a.backgroundColor) || "#ffffff";
+            const backgroundGradient = (_b = page == null ? void 0 : page.settings) == null ? void 0 : _b.backgroundGradient;
+            cleanup();
+            resolve({
+              svg: svgString,
+              width: canvasWidth,
+              height: canvasHeight,
+              backgroundColor,
+              backgroundGradient
+            });
+          } catch (err) {
+            cleanup();
+            reject(err);
+          }
+        });
+      };
+      mountPreview(onReady);
+    });
   }
-  return false;
-}
-function isBasicLatinOrLatin1(char) {
-  const c = char.codePointAt(0) ?? 0;
-  return c <= 591;
-}
-function classifyChar(char) {
-  if (isBasicLatinOrLatin1(char)) return "main";
-  if (isDevanagari(char)) return "devanagari";
-  return "symbol";
-}
-function splitIntoRuns(text) {
-  if (!text) return [];
-  const runs = [];
-  let currentType = null;
-  let currentText = "";
-  for (const char of text) {
-    const type = classifyChar(char);
-    if (type !== currentType && currentText) {
-      runs.push({ text: currentText, runType: currentType });
-      currentText = "";
+  /**
+   * Normalize the SVG's width/height/viewBox to match the logical page dimensions.
+   * Fabric's toSVG() may output dimensions scaled by the canvas element's actual
+   * pixel size (e.g., 2x due to devicePixelRatio), causing svg2pdf to render
+   * content at the wrong scale. This rewrites the root <svg> attributes to ensure
+   * the SVG coordinate system matches the intended page size exactly.
+   */
+  normalizeSvgDimensions(svg, targetWidth, targetHeight) {
+    const widthMatch = svg.match(/<svg[^>]*\bwidth="([^"]+)"/i);
+    const heightMatch = svg.match(/<svg[^>]*\bheight="([^"]+)"/i);
+    const svgWidth = widthMatch ? parseFloat(widthMatch[1]) : targetWidth;
+    const svgHeight = heightMatch ? parseFloat(heightMatch[1]) : targetHeight;
+    console.log(
+      `[canvas-renderer][svg-normalize] root ${svgWidth}x${svgHeight} → page ${targetWidth}x${targetHeight}`
+    );
+    let normalized = svg;
+    if (/\bwidth="[^"]*"/i.test(normalized)) {
+      normalized = normalized.replace(/(<svg[^>]*\b)width="[^"]*"/i, `$1width="${targetWidth}"`);
+    } else {
+      normalized = normalized.replace(/<svg\b/i, `<svg width="${targetWidth}"`);
     }
-    currentType = type;
-    currentText += char;
-  }
-  if (currentText && currentType) {
-    runs.push({ text: currentText, runType: currentType });
-  }
-  return runs;
-}
-function rewriteSvgFontsForJsPDF(svgStr) {
-  var _a, _b;
-  const parser = new DOMParser();
-  const doc = parser.parseFromString(svgStr, "image/svg+xml");
-  const textEls = doc.querySelectorAll("text, tspan, textPath");
-  const readStyleToken = (style, prop) => {
-    var _a2;
-    const match = style.match(new RegExp(`${prop}\\s*:\\s*([^;]+)`, "i"));
-    return ((_a2 = match == null ? void 0 : match[1]) == null ? void 0 : _a2.trim()) || null;
-  };
-  const resolveInheritedValue = (el, attr, styleProp = attr) => {
-    var _a2;
-    let current = el;
-    while (current) {
-      const attrVal = (_a2 = current.getAttribute(attr)) == null ? void 0 : _a2.trim();
-      if (attrVal) return attrVal;
-      const styleVal = readStyleToken(current.getAttribute("style") || "", styleProp);
-      if (styleVal) return styleVal;
-      current = current.parentElement;
+    if (/\bheight="[^"]*"/i.test(normalized)) {
+      normalized = normalized.replace(/(<svg[^>]*\b)height="[^"]*"/i, `$1height="${targetHeight}"`);
+    } else {
+      normalized = normalized.replace(/<svg\b/i, `<svg height="${targetHeight}"`);
     }
-    return null;
-  };
-  const resolveWeightNum = (weightRaw) => {
-    const parsedWeight = Number.parseInt(weightRaw, 10);
-    return Number.isFinite(parsedWeight) ? parsedWeight : /bold/i.test(weightRaw) ? 700 : /medium/i.test(weightRaw) ? 500 : /semi/i.test(weightRaw) ? 600 : /light/i.test(weightRaw) ? 300 : 400;
-  };
-  const buildStyleString = (existingStyle, fontName) => {
-    const stylePairs = existingStyle.split(";").map((part) => part.trim()).filter(Boolean).filter((part) => !/^font-family\s*:/i.test(part) && !/^font-weight\s*:/i.test(part) && !/^font-style\s*:/i.test(part));
-    stylePairs.push(`font-family: ${fontName}`);
-    stylePairs.push(`font-weight: normal`);
-    stylePairs.push(`font-style: normal`);
-    return stylePairs.join("; ");
-  };
-  for (const el of textEls) {
-    const inlineStyle = el.getAttribute("style") || "";
-    const rawFf = resolveInheritedValue(el, "font-family");
-    if (!rawFf) continue;
-    const clean = (_a = rawFf.split(",")[0]) == null ? void 0 : _a.replace(/['"]/g, "").trim();
-    if (!isFontAvailable(clean)) continue;
-    const weightRaw = resolveInheritedValue(el, "font-weight") || "400";
-    const styleRaw = resolveInheritedValue(el, "font-style") || "normal";
-    const weight = resolveWeightNum(weightRaw);
-    const resolved = resolveFontWeight(weight);
-    const isItalic = /italic|oblique/i.test(styleRaw);
-    const jsPdfName = getEmbeddedJsPDFFontName(clean, resolved, isItalic);
-    el.setAttribute("data-source-font-family", clean);
-    el.setAttribute("data-source-font-weight", String(resolved));
-    el.setAttribute("data-source-font-style", isItalic ? "italic" : "normal");
-    const directText = Array.from(el.childNodes).filter((n) => n.nodeType === 3).map((n) => n.textContent || "").join("");
-    const hasDevanagari = containsDevanagari(directText);
-    if (hasDevanagari && directText.length > 0) {
-      const devanagariWeight = resolveFontWeight(weight);
-      const devanagariJsPdfName = getEmbeddedJsPDFFontName(FONT_FALLBACK_DEVANAGARI, devanagariWeight);
-      const symbolJsPdfName = isFontAvailable(FONT_FALLBACK_SYMBOLS) ? getEmbeddedJsPDFFontName(FONT_FALLBACK_SYMBOLS, 400) : jsPdfName;
-      const childNodes = Array.from(el.childNodes);
-      for (const node of childNodes) {
-        if (node.nodeType !== 3 || !node.textContent) continue;
-        const runs = splitIntoRuns(node.textContent);
-        if (runs.length <= 1 && ((_b = runs[0]) == null ? void 0 : _b.runType) !== "devanagari") continue;
-        const fragment = doc.createDocumentFragment();
-        for (const run of runs) {
-          const tspan = doc.createElementNS("http://www.w3.org/2000/svg", "tspan");
-          let runFont;
-          if (run.runType === "devanagari") {
-            runFont = devanagariJsPdfName;
-          } else if (run.runType === "symbol") {
-            runFont = symbolJsPdfName;
-          } else {
-            runFont = jsPdfName;
-          }
-          tspan.setAttribute("font-family", runFont);
-          tspan.setAttribute("font-weight", "normal");
-          tspan.setAttribute("font-style", "normal");
-          tspan.textContent = run.text;
-          fragment.appendChild(tspan);
-        }
-        el.replaceChild(fragment, node);
-      }
-      el.setAttribute("font-family", jsPdfName);
-      el.setAttribute("font-weight", "normal");
-      el.setAttribute("font-style", "normal");
-      el.setAttribute("style", buildStyleString(inlineStyle, jsPdfName));
+    const viewBox = `0 0 ${targetWidth} ${targetHeight}`;
+    if (/\bviewBox="[^"]*"/i.test(normalized)) {
+      normalized = normalized.replace(/viewBox="[^"]*"/i, `viewBox="${viewBox}"`);
     } else {
-      el.setAttribute("font-family", jsPdfName);
-      el.setAttribute("font-weight", "normal");
-      el.setAttribute("font-style", "normal");
-      el.setAttribute("style", buildStyleString(inlineStyle, jsPdfName));
+      normalized = normalized.replace(/<svg\b/i, `<svg viewBox="${viewBox}"`);
+    }
+    normalized = normalized.replace(/="undefined"/g, '="0"');
+    normalized = normalized.replace(/="NaN"/g, '="0"');
+    if (/\bx="[^"]*"/i.test(normalized)) {
+      normalized = normalized.replace(/(<svg[^>]*\b)x="[^"]*"/i, '$1x="0"');
+    } else {
+      normalized = normalized.replace(/<svg\b/i, '<svg x="0"');
+    }
+    if (/\by="[^"]*"/i.test(normalized)) {
+      normalized = normalized.replace(/(<svg[^>]*\b)y="[^"]*"/i, '$1y="0"');
+    } else {
+      normalized = normalized.replace(/<svg\b/i, '<svg y="0"');
+    }
+    normalized = normalized.replace(/\bpreserveAspectRatio="[^"]*"/i, 'preserveAspectRatio="none"');
+    if (!/\bpreserveAspectRatio="[^"]*"/i.test(normalized)) {
+      normalized = normalized.replace(/<svg\b/i, '<svg preserveAspectRatio="none"');
     }
+    return normalized;
   }
-  return new XMLSerializer().serializeToString(doc.documentElement);
-}
-function extractFontFamiliesFromSvgs(svgs) {
-  const families = /* @__PURE__ */ new Set();
-  const regex = /font-family[=:]\s*["']?([^"';},]+)/gi;
-  for (const svg of svgs) {
-    let m;
-    while ((m = regex.exec(svg)) !== null) {
-      const raw = m[1].trim().split(",")[0].trim().replace(/^['"]|['"]$/g, "");
-      if (raw && raw !== "serif" && raw !== "sans-serif" && raw !== "monospace") {
-        families.add(raw);
+  /**
+   * Find the Fabric.Canvas instance that belongs to a given container element,
+   * using the global __fabricCanvasRegistry (set by PageCanvas).
+   */
+  getFabricCanvasFromContainer(container) {
+    const registry2 = window.__fabricCanvasRegistry;
+    if (registry2 instanceof Map) {
+      for (const entry of registry2.values()) {
+        const canvas = (entry == null ? void 0 : entry.canvas) || entry;
+        if (!canvas || typeof canvas.toSVG !== "function") continue;
+        const el = canvas.lowerCanvasEl || canvas.upperCanvasEl;
+        if (el && container.contains(el)) return canvas;
       }
     }
+    return null;
   }
-  return families;
-}
-async function embedFontsInPdf(pdf, fontFamilies, fontBaseUrl) {
-  const embedded = /* @__PURE__ */ new Set();
-  const weights = [300, 400, 500, 600, 700];
-  const tasks = [];
-  for (const family of fontFamilies) {
-    if (!isFontAvailable(family)) {
-      console.warn(`[pdf-fonts] No TTF mapping for "${family}" — will use Helvetica fallback`);
-      continue;
-    }
-    for (const w of weights) {
-      tasks.push(
-        embedFont(pdf, family, w, fontBaseUrl).then((ok) => {
-          if (ok) embedded.add(`${family}${w}`);
-        })
-      );
+  async waitForStableTextMetrics(container, config) {
+    var _a, _b, _c;
+    if (typeof document !== "undefined") {
+      void ensureFontsForResolvedConfig(config);
+      await this.waitForRelevantFonts(config);
     }
+    const fabricInstance = this.getFabricCanvasFromContainer(container);
+    if (!(fabricInstance == null ? void 0 : fabricInstance.getObjects)) return;
+    const waitForPaint = () => new Promise((r) => requestAnimationFrame(() => requestAnimationFrame(() => r())));
+    const primeCharBounds = (obj) => {
+      if (obj instanceof fabric__namespace.Textbox) {
+        const lines = obj._textLines;
+        if (Array.isArray(lines)) {
+          for (let i = 0; i < lines.length; i++) {
+            try {
+              obj.getLineWidth(i);
+            } catch {
+            }
+          }
+        }
+        obj.dirty = true;
+        return;
+      }
+      if (obj instanceof fabric__namespace.Group) {
+        obj.getObjects().forEach(primeCharBounds);
+        obj.dirty = true;
+      }
+    };
+    fabricInstance.getObjects().forEach(primeCharBounds);
+    (_a = fabricInstance.calcOffset) == null ? void 0 : _a.call(fabricInstance);
+    (_b = fabricInstance.renderAll) == null ? void 0 : _b.call(fabricInstance);
+    await waitForPaint();
+    (_c = fabricInstance.renderAll) == null ? void 0 : _c.call(fabricInstance);
+    await waitForPaint();
   }
-  await Promise.all(tasks);
-  console.log(`[pdf-fonts] Embedded ${embedded.size} font variants for ${fontFamilies.size} families`);
-  return embedded;
 }
-const pdfFonts = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
-  __proto__: null,
-  FONT_FALLBACK_DEVANAGARI,
-  FONT_FALLBACK_SYMBOLS,
-  FONT_FILES,
-  FONT_WEIGHT_LABELS,
-  embedFont,
-  embedFontsForConfig,
-  embedFontsInPdf,
-  extractFontFamiliesFromSvgs,
-  getEmbeddedJsPDFFontName,
-  isFontAvailable,
-  resolveFontWeight,
-  rewriteSvgFontsForJsPDF
-}, Symbol.toStringTag, { value: "Module" }));
 const SVG_DRAWABLE_TAGS = /* @__PURE__ */ new Set([
   "path",
   "rect",