@pixldocs/canvas-renderer 0.3.23 → 0.3.24

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -11057,6 +11057,14 @@ class PixldocsRenderer {
11057
11057
  });
11058
11058
  }
11059
11059
  // ─── Internal: capture SVG from a rendered Fabric canvas ───
11060
+ //
11061
+ // APPROACH: Use the SAME PreviewCanvas that renders perfect PNGs, then call
11062
+ // Fabric's toSVG() on that canvas. This guarantees 100% layout parity —
11063
+ // the SVG is a vector snapshot of exactly what's on screen.
11064
+ //
11065
+ // The trick: before calling toSVG(), we temporarily neutralize the viewport
11066
+ // transform and retina scaling so Fabric emits coordinates in logical
11067
+ // document space (e.g. 612x792) instead of inflated pixel space.
11060
11068
  captureSvgViaPreviewCanvas(config, pageIndex, canvasWidth, canvasHeight) {
11061
11069
  return new Promise(async (resolve, reject) => {
11062
11070
  const { PreviewCanvas: PreviewCanvas2 } = await Promise.resolve().then(() => PreviewCanvas$1);
@@ -11092,17 +11100,20 @@ class PixldocsRenderer {
11092
11100
  }
11093
11101
  const prevVPT = fabricInstance.viewportTransform ? [...fabricInstance.viewportTransform] : void 0;
11094
11102
  const prevSvgVPT = fabricInstance.svgViewportTransformation;
11095
- const prevCanvasWidth = fabricInstance.width;
11096
- const prevCanvasHeight = fabricInstance.height;
11103
+ const prevRetina = fabricInstance.enableRetinaScaling;
11104
+ const prevWidth = fabricInstance.width;
11105
+ const prevHeight = fabricInstance.height;
11106
+ fabricInstance.viewportTransform = [1, 0, 0, 1, 0, 0];
11107
+ fabricInstance.svgViewportTransformation = false;
11108
+ fabricInstance.enableRetinaScaling = false;
11097
11109
  fabricInstance.setDimensions(
11098
11110
  { width: canvasWidth, height: canvasHeight },
11099
11111
  { cssOnly: false, backstoreOnly: false }
11100
11112
  );
11101
- fabricInstance.viewportTransform = [1, 0, 0, 1, 0, 0];
11102
- fabricInstance.svgViewportTransformation = false;
11103
11113
  const svgString = fabricInstance.toSVG();
11114
+ fabricInstance.enableRetinaScaling = prevRetina;
11104
11115
  fabricInstance.setDimensions(
11105
- { width: prevCanvasWidth, height: prevCanvasHeight },
11116
+ { width: prevWidth, height: prevHeight },
11106
11117
  { cssOnly: false, backstoreOnly: false }
11107
11118
  );
11108
11119
  if (prevVPT) fabricInstance.viewportTransform = prevVPT;
@@ -11130,7 +11141,7 @@ class PixldocsRenderer {
11130
11141
  config,
11131
11142
  pageIndex,
11132
11143
  zoom: 1,
11133
- // 1:1 — no scaling for SVG capture
11144
+ // 1:1 — no UI scaling for SVG capture
11134
11145
  absoluteZoom: true,
11135
11146
  onReady
11136
11147
  })