@pixldocs/canvas-renderer 0.5.330 → 0.5.331

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.
@@ -11160,6 +11160,15 @@ const bakeTextboxScaleIntoTypography = (obj, sourceElement) => {
11160
11160
  };
11161
11161
  return updates;
11162
11162
  };
11163
+ const rotatedTopLeftToCenter = (left, top, width, height, angleDeg = 0) => {
11164
+ const angle = angleDeg * Math.PI / 180;
11165
+ const cos = Math.cos(angle);
11166
+ const sin = Math.sin(angle);
11167
+ return {
11168
+ x: left + width / 2 * cos - height / 2 * sin,
11169
+ y: top + width / 2 * sin + height / 2 * cos
11170
+ };
11171
+ };
11163
11172
  function applyWarpAwareSelectionBorders(selection) {
11164
11173
  var _a2;
11165
11174
  if (selection.__pixldocsOrigASHasBorders !== void 0) {
@@ -13522,29 +13531,23 @@ const PageCanvas = forwardRef(
13522
13531
  const getObjectFrameBoundsInSelection = (selection, obj, frameWidth, frameHeight) => {
13523
13532
  const w = Math.max(1, frameWidth ?? obj.width ?? 1);
13524
13533
  const h = Math.max(1, frameHeight ?? obj.height ?? 1);
13525
- const originX = obj.originX ?? "left";
13526
- const originY = obj.originY ?? "top";
13527
- const localLeft = originX === "center" ? -w / 2 : originX === "right" ? -w : 0;
13528
- const localTop = originY === "center" ? -h / 2 : originY === "bottom" ? -h : 0;
13529
13534
  const matrix = fabric.util.multiplyTransformMatrices(
13530
13535
  selection.calcTransformMatrix(),
13531
13536
  obj.calcOwnMatrix()
13532
13537
  );
13533
- const points = [
13534
- new fabric.Point(localLeft, localTop),
13535
- new fabric.Point(localLeft + w, localTop),
13536
- new fabric.Point(localLeft + w, localTop + h),
13537
- new fabric.Point(localLeft, localTop + h)
13538
- ].map((point) => fabric.util.transformPoint(point, matrix));
13539
- const xs = points.map((p) => p.x);
13540
- const ys = points.map((p) => p.y);
13541
- const left = Math.min(...xs);
13542
- const top = Math.min(...ys);
13538
+ const decomposed = fabric.util.qrDecompose(matrix);
13539
+ const scaledW = Math.max(1, w * Math.abs(decomposed.scaleX || 1));
13540
+ const scaledH = Math.max(1, h * Math.abs(decomposed.scaleY || 1));
13541
+ const angleRad = (decomposed.angle ?? 0) * Math.PI / 180;
13542
+ const cos = Math.cos(angleRad);
13543
+ const sin = Math.sin(angleRad);
13544
+ const left = decomposed.translateX - scaledW / 2 * cos + scaledH / 2 * sin;
13545
+ const top = decomposed.translateY - scaledW / 2 * sin - scaledH / 2 * cos;
13543
13546
  return {
13544
13547
  left,
13545
13548
  top,
13546
- width: Math.max(1, Math.max(...xs) - left),
13547
- height: Math.max(1, Math.max(...ys) - top)
13549
+ width: scaledW,
13550
+ height: scaledH
13548
13551
  };
13549
13552
  };
13550
13553
  fabricCanvas.on("object:added", (e) => {
@@ -13816,17 +13819,54 @@ const PageCanvas = forwardRef(
13816
13819
  };
13817
13820
  for (const child of obj.getObjects()) {
13818
13821
  if (child instanceof fabric.Group && (child.__cropGroup || ((_d = child._ct) == null ? void 0 : _d.isCropGroup))) {
13822
+ const ct = child.__cropData;
13823
+ if (ct) {
13824
+ if (child.__asLiveOrigW == null) {
13825
+ child.__asLiveOrigW = ct.frameW ?? child.width ?? 1;
13826
+ }
13827
+ if (child.__asLiveOrigH == null) {
13828
+ child.__asLiveOrigH = ct.frameH ?? child.height ?? 1;
13829
+ }
13830
+ if (isXSide) {
13831
+ const newW = Math.max(1, Number(child.__asLiveOrigW) * sAxis);
13832
+ ct.frameW = newW;
13833
+ child._set("width", newW);
13834
+ } else {
13835
+ const newH = Math.max(1, Number(child.__asLiveOrigH) * sAxis);
13836
+ ct.frameH = newH;
13837
+ child._set("height", newH);
13838
+ }
13839
+ try {
13840
+ updateCoverLayout(child);
13841
+ } catch {
13842
+ }
13843
+ }
13819
13844
  if (isXSide) child._set("scaleX", childCounterScale);
13820
13845
  else child._set("scaleY", childCounterScale);
13821
13846
  child.setCoords();
13822
13847
  child.dirty = true;
13848
+ didReflowTextChild = true;
13823
13849
  continue;
13824
13850
  }
13825
13851
  if (child instanceof fabric.FabricImage && !child.__cropGroup && !child.smartElementType) {
13852
+ if (isXSide) {
13853
+ if (child.__asLiveOrigW == null) {
13854
+ child.__asLiveOrigW = (child.width ?? 0) * Math.abs(child.scaleX ?? 1);
13855
+ }
13856
+ const newW = Math.max(1, Number(child.__asLiveOrigW) * sAxis);
13857
+ child._set("width", newW);
13858
+ } else {
13859
+ if (child.__asLiveOrigH == null) {
13860
+ child.__asLiveOrigH = (child.height ?? 0) * Math.abs(child.scaleY ?? 1);
13861
+ }
13862
+ const newH = Math.max(1, Number(child.__asLiveOrigH) * sAxis);
13863
+ child._set("height", newH);
13864
+ }
13826
13865
  if (isXSide) child._set("scaleX", childCounterScale);
13827
13866
  else child._set("scaleY", childCounterScale);
13828
13867
  child.setCoords();
13829
13868
  child.dirty = true;
13869
+ didReflowTextChild = true;
13830
13870
  continue;
13831
13871
  }
13832
13872
  if (!(child instanceof fabric.Textbox)) continue;
@@ -14385,8 +14425,9 @@ const PageCanvas = forwardRef(
14385
14425
  const stateCrop = useEditorStore.getState();
14386
14426
  const pageCrop = stateCrop.canvas.pages.find((p) => p.id === pageId);
14387
14427
  const pageChildrenCrop = (pageCrop == null ? void 0 : pageCrop.children) ?? [];
14388
- const absLeft = (active.left ?? 0) - ct.frameW / 2;
14389
- const absTop = (active.top ?? 0) - ct.frameH / 2;
14428
+ const angleRad = (active.angle ?? 0) * Math.PI / 180;
14429
+ const absLeft = (active.left ?? 0) - ct.frameW / 2 * Math.cos(angleRad) + ct.frameH / 2 * Math.sin(angleRad);
14430
+ const absTop = (active.top ?? 0) - ct.frameW / 2 * Math.sin(angleRad) - ct.frameH / 2 * Math.cos(angleRad);
14390
14431
  const storePosCrop = absoluteToStorePosition(absLeft, absTop, objId, pageChildrenCrop);
14391
14432
  updateElement2(objId, {
14392
14433
  width: ct.frameW,
@@ -14747,14 +14788,16 @@ const PageCanvas = forwardRef(
14747
14788
  } else {
14748
14789
  const w = ((ct == null ? void 0 : ct.frameW) ?? obj.width ?? 0) * Math.abs(obj.scaleX ?? 1);
14749
14790
  const h = ((ct == null ? void 0 : ct.frameH) ?? obj.height ?? 0) * Math.abs(obj.scaleY ?? 1);
14750
- absoluteLeft = (absoluteLeft ?? 0) - w / 2;
14751
- absoluteTop = (absoluteTop ?? 0) - h / 2;
14791
+ const angleRad = (decomposed.angle ?? obj.angle ?? 0) * Math.PI / 180;
14792
+ absoluteLeft = (decomposed.translateX ?? absoluteLeft ?? 0) - w / 2 * Math.cos(angleRad) + h / 2 * Math.sin(angleRad);
14793
+ absoluteTop = (decomposed.translateY ?? absoluteTop ?? 0) - w / 2 * Math.sin(angleRad) - h / 2 * Math.cos(angleRad);
14752
14794
  }
14753
14795
  } else if (obj instanceof fabric.FabricImage && (obj.originX === "center" || obj.originY === "center")) {
14754
14796
  const w = (obj.width ?? 0) * (obj.scaleX ?? 1);
14755
14797
  const h = (obj.height ?? 0) * (obj.scaleY ?? 1);
14756
- absoluteLeft = (absoluteLeft ?? 0) - w / 2;
14757
- absoluteTop = (absoluteTop ?? 0) - h / 2;
14798
+ const angleRad = (decomposed.angle ?? obj.angle ?? 0) * Math.PI / 180;
14799
+ absoluteLeft = (decomposed.translateX ?? absoluteLeft ?? 0) - w / 2 * Math.cos(angleRad) + h / 2 * Math.sin(angleRad);
14800
+ absoluteTop = (decomposed.translateY ?? absoluteTop ?? 0) - w / 2 * Math.sin(angleRad) - h / 2 * Math.cos(angleRad);
14758
14801
  }
14759
14802
  const preserveCornerGeometry = (sourceElement == null ? void 0 : sourceElement.type) === "shape" && (sourceElement.shapeType === "circle" || sourceElement.shapeType === "rounded-rect" || sourceElement.shapeType === "triangle");
14760
14803
  let finalWidth = intrinsicWidth;
@@ -14781,12 +14824,14 @@ const PageCanvas = forwardRef(
14781
14824
  absoluteLeft = frameBounds.left;
14782
14825
  absoluteTop = frameBounds.top;
14783
14826
  } else {
14784
- absoluteLeft = (decomposed.translateX ?? absoluteLeft) - finalWidth / 2;
14785
- absoluteTop = (decomposed.translateY ?? absoluteTop) - finalHeight / 2;
14827
+ const angleRad = (decomposed.angle ?? obj.angle ?? 0) * Math.PI / 180;
14828
+ absoluteLeft = (decomposed.translateX ?? absoluteLeft) - finalWidth / 2 * Math.cos(angleRad) + finalHeight / 2 * Math.sin(angleRad);
14829
+ absoluteTop = (decomposed.translateY ?? absoluteTop) - finalWidth / 2 * Math.sin(angleRad) - finalHeight / 2 * Math.cos(angleRad);
14786
14830
  }
14831
+ const finalCenter = rotatedTopLeftToCenter(absoluteLeft, absoluteTop, finalWidth, finalHeight, decomposed.angle ?? (obj.angle ?? 0));
14787
14832
  finalAbsoluteMatrix = fabric.util.composeMatrix({
14788
- translateX: absoluteLeft + finalWidth / 2,
14789
- translateY: absoluteTop + finalHeight / 2,
14833
+ translateX: finalCenter.x,
14834
+ translateY: finalCenter.y,
14790
14835
  angle: decomposed.angle ?? (obj.angle ?? 0),
14791
14836
  scaleX: 1,
14792
14837
  scaleY: 1,
@@ -15172,9 +15217,10 @@ const PageCanvas = forwardRef(
15172
15217
  if (!ct) continue;
15173
15218
  ct.frameW = bake.width;
15174
15219
  ct.frameH = bake.height;
15220
+ const bakeCenter = rotatedTopLeftToCenter(bake.left, bake.top, bake.width, bake.height, bake.angle);
15175
15221
  bake.obj.set({
15176
- left: bake.left + bake.width / 2,
15177
- top: bake.top + bake.height / 2,
15222
+ left: bakeCenter.x,
15223
+ top: bakeCenter.y,
15178
15224
  width: bake.width,
15179
15225
  height: bake.height,
15180
15226
  scaleX: 1,
@@ -15771,8 +15817,9 @@ const PageCanvas = forwardRef(
15771
15817
  const node = findNodeById(pageChildren, element.id);
15772
15818
  return node ? getAbsoluteBounds(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
15773
15819
  })() : { left: element.left ?? 0, top: element.top ?? 0 };
15774
- const cropCenterX = cropPos.left + (ct.frameW ?? 0) / 2;
15775
- const cropCenterY = cropPos.top + (ct.frameH ?? 0) / 2;
15820
+ const cropCenter = rotatedTopLeftToCenter(cropPos.left, cropPos.top, ct.frameW ?? 0, ct.frameH ?? 0, element.angle ?? 0);
15821
+ const cropCenterX = cropCenter.x;
15822
+ const cropCenterY = cropCenter.y;
15776
15823
  if (element.left !== void 0) existingObj.set({ left: cropCenterX });
15777
15824
  if (element.top !== void 0) existingObj.set({ top: cropCenterY });
15778
15825
  if (element.angle !== void 0) existingObj.set({ angle: element.angle });
@@ -16708,8 +16755,9 @@ const PageCanvas = forwardRef(
16708
16755
  ct.shape = clipShape === "circle" ? "circle" : clipShape === "rounded" ? "roundRect" : "rect";
16709
16756
  ct.rx = rxRatio;
16710
16757
  obj.__maintainResolution = element.maintainResolution !== false;
16711
- const centerX = fabricPos.left + elementWidth / 2;
16712
- const centerY = fabricPos.top + elementHeight / 2;
16758
+ const center = rotatedTopLeftToCenter(fabricPos.left, fabricPos.top, elementWidth, elementHeight, element.angle ?? 0);
16759
+ const centerX = center.x;
16760
+ const centerY = center.y;
16713
16761
  const cropSetProps = {
16714
16762
  width: elementWidth,
16715
16763
  height: elementHeight,
@@ -16949,7 +16997,8 @@ const PageCanvas = forwardRef(
16949
16997
  if (!skipPositionUpdate && (obj instanceof fabric.FabricImage && obj.originX === "center" || obj instanceof fabric.Group && obj.__cropGroup)) {
16950
16998
  const vW = rW * effectiveScaleX;
16951
16999
  const vH = rH * effectiveScaleY;
16952
- posIfNotSkipped = { left: fabricPos.left + vW / 2, top: fabricPos.top + vH / 2 };
17000
+ const center = rotatedTopLeftToCenter(fabricPos.left, fabricPos.top, vW, vH, element.angle ?? 0);
17001
+ posIfNotSkipped = { left: center.x, top: center.y };
16953
17002
  }
16954
17003
  if (element.transformMatrix && element.transformMatrix.length === 6) {
16955
17004
  if (isTextbox) {
@@ -24247,9 +24296,9 @@ function captureFabricCanvasSvgForPdf(fabricInstance, canvasWidth, canvasHeight)
24247
24296
  }
24248
24297
  return svgString;
24249
24298
  }
24250
- const resolvedPackageVersion = "0.5.330";
24299
+ const resolvedPackageVersion = "0.5.331";
24251
24300
  const PACKAGE_VERSION = resolvedPackageVersion;
24252
- const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.330";
24301
+ const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.331";
24253
24302
  const roundParityValue = (value) => {
24254
24303
  if (typeof value !== "number") return value;
24255
24304
  return Number.isFinite(value) ? Number(value.toFixed(3)) : value;
@@ -25063,7 +25112,7 @@ class PixldocsRenderer {
25063
25112
  await this.waitForCanvasScene(container, cloned, i);
25064
25113
  }
25065
25114
  console.log(`[canvas-renderer][pdf-unified] mounted ${cloned.pages.length} page(s), handing off to client exportMultiPagePdf`);
25066
- const { exportMultiPagePdf, preparePagesForExport } = await import("./vectorPdfExport-BIkOnJF2.js");
25115
+ const { exportMultiPagePdf, preparePagesForExport } = await import("./vectorPdfExport-DvpRTaGb.js");
25067
25116
  const prepared = preparePagesForExport(
25068
25117
  cloned.pages,
25069
25118
  canvasWidth,
@@ -27383,7 +27432,7 @@ async function prepareLiveCanvasSvgForPdf(rawSvg, pageWidth, pageHeight, pageKey
27383
27432
  if (options == null ? void 0 : options.stripPageBackground) stripRootPageBackgroundFromSvg(svgToDraw);
27384
27433
  sanitizeSvgTreeForPdf(svgToDraw);
27385
27434
  try {
27386
- const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await import("./vectorPdfExport-BIkOnJF2.js");
27435
+ const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await import("./vectorPdfExport-DvpRTaGb.js");
27387
27436
  try {
27388
27437
  await logTextMeasurementDiagnostic(svgToDraw);
27389
27438
  } catch {
@@ -27783,4 +27832,4 @@ export {
27783
27832
  buildTeaserBlurFlatKeys as y,
27784
27833
  collectFontDescriptorsFromConfig as z
27785
27834
  };
27786
- //# sourceMappingURL=index-B6Ucv-_d.js.map
27835
+ //# sourceMappingURL=index-C9n6xrCt.js.map