@pixldocs/canvas-renderer 0.5.324 → 0.5.326

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.
@@ -13736,116 +13736,6 @@ const PageCanvas = forwardRef(
13736
13736
  const isXSide = corner === "ml" || corner === "mr";
13737
13737
  const sAxis = isXSide ? Math.abs(obj.scaleX ?? 1) : Math.abs(obj.scaleY ?? 1);
13738
13738
  if (sAxis > 1e-3) {
13739
- const hasRotatedChild = obj.getObjects().some(
13740
- (c) => Math.abs((c.angle ?? 0) % 360) > 0.5
13741
- );
13742
- if (hasRotatedChild) {
13743
- if (obj.__asRotAwareSnap == null) {
13744
- obj.__asRotAwareSnap = {
13745
- width: obj.width ?? 0,
13746
- height: obj.height ?? 0,
13747
- scaleX: obj.scaleX ?? 1,
13748
- scaleY: obj.scaleY ?? 1,
13749
- angle: obj.angle ?? 0,
13750
- aCoords: (() => {
13751
- obj.setCoords();
13752
- const c = obj.aCoords;
13753
- return c ? { tl: { x: c.tl.x, y: c.tl.y }, tr: { x: c.tr.x, y: c.tr.y }, br: { x: c.br.x, y: c.br.y }, bl: { x: c.bl.x, y: c.bl.y } } : null;
13754
- })(),
13755
- corner
13756
- };
13757
- for (const ch of obj.getObjects()) {
13758
- ch.__asRotAwareChild = {
13759
- width: ch.width ?? 0,
13760
- height: ch.height ?? 0,
13761
- scaleX: ch.scaleX ?? 1,
13762
- scaleY: ch.scaleY ?? 1,
13763
- left: ch.left ?? 0,
13764
- top: ch.top ?? 0,
13765
- angle: ch.angle ?? 0
13766
- };
13767
- }
13768
- }
13769
- const snap = obj.__asRotAwareSnap;
13770
- const asAngle = snap.angle;
13771
- const effAxisScale = isXSide ? (obj.scaleX ?? 1) / (snap.scaleX || 1) : (obj.scaleY ?? 1) / (snap.scaleY || 1);
13772
- obj._set("scaleX", snap.scaleX);
13773
- obj._set("scaleY", snap.scaleY);
13774
- for (const child of obj.getObjects()) {
13775
- const cSnap = child.__asRotAwareChild;
13776
- if (!cSnap) continue;
13777
- const relAngleRad = (cSnap.angle - asAngle) * Math.PI / 180;
13778
- const proj = Math.abs(Math.cos(relAngleRad));
13779
- const effChildScale = 1 + (effAxisScale - 1) * proj;
13780
- if (child instanceof fabric.Textbox) {
13781
- if (isXSide) {
13782
- const origVisW = cSnap.width * (cSnap.scaleX || 1);
13783
- const newW = Math.max(20, origVisW * effChildScale);
13784
- if (Math.abs((child.width ?? 0) - newW) > 0.5) {
13785
- child._set("width", newW);
13786
- child._set("scaleX", cSnap.scaleX);
13787
- try {
13788
- child.initDimensions();
13789
- } catch {
13790
- }
13791
- }
13792
- } else {
13793
- const origVisH = cSnap.height * (cSnap.scaleY || 1);
13794
- const newH = Math.max(20, origVisH * effChildScale);
13795
- child.minBoxHeight = newH;
13796
- child._set("scaleY", cSnap.scaleY);
13797
- try {
13798
- child.initDimensions();
13799
- } catch {
13800
- }
13801
- }
13802
- } else if (child instanceof fabric.FabricImage && !child.__cropGroup && !child.smartElementType) {
13803
- if (isXSide) {
13804
- const origVisW = cSnap.width * (cSnap.scaleX || 1);
13805
- const newW = Math.max(1, origVisW * effChildScale);
13806
- child._set("width", newW);
13807
- child._set("scaleX", cSnap.scaleX);
13808
- } else {
13809
- const origVisH = cSnap.height * (cSnap.scaleY || 1);
13810
- const newH = Math.max(1, origVisH * effChildScale);
13811
- child._set("height", newH);
13812
- child._set("scaleY", cSnap.scaleY);
13813
- }
13814
- } else {
13815
- child._set("scaleX", (cSnap.scaleX || 1) * effChildScale);
13816
- child._set("scaleY", (cSnap.scaleY || 1) * effChildScale);
13817
- }
13818
- if (isXSide) {
13819
- child._set("left", cSnap.left * effAxisScale);
13820
- child._set("top", cSnap.top);
13821
- } else {
13822
- child._set("left", cSnap.left);
13823
- child._set("top", cSnap.top * effAxisScale);
13824
- }
13825
- child.setCoords();
13826
- child.dirty = true;
13827
- }
13828
- try {
13829
- obj.triggerLayout();
13830
- } catch {
13831
- }
13832
- obj.setCoords();
13833
- const aAfter = obj.aCoords;
13834
- const aBefore = snap.aCoords;
13835
- if (aBefore && aAfter) {
13836
- const midBefore = corner === "ml" ? { x: (aBefore.tr.x + aBefore.br.x) / 2, y: (aBefore.tr.y + aBefore.br.y) / 2 } : corner === "mr" ? { x: (aBefore.tl.x + aBefore.bl.x) / 2, y: (aBefore.tl.y + aBefore.bl.y) / 2 } : corner === "mt" ? { x: (aBefore.bl.x + aBefore.br.x) / 2, y: (aBefore.bl.y + aBefore.br.y) / 2 } : { x: (aBefore.tl.x + aBefore.tr.x) / 2, y: (aBefore.tl.y + aBefore.tr.y) / 2 };
13837
- const midAfter = corner === "ml" ? { x: (aAfter.tr.x + aAfter.br.x) / 2, y: (aAfter.tr.y + aAfter.br.y) / 2 } : corner === "mr" ? { x: (aAfter.tl.x + aAfter.bl.x) / 2, y: (aAfter.tl.y + aAfter.bl.y) / 2 } : corner === "mt" ? { x: (aAfter.bl.x + aAfter.br.x) / 2, y: (aAfter.bl.y + aAfter.br.y) / 2 } : { x: (aAfter.tl.x + aAfter.tr.x) / 2, y: (aAfter.tl.y + aAfter.tr.y) / 2 };
13838
- const dx = midBefore.x - midAfter.x;
13839
- const dy = midBefore.y - midAfter.y;
13840
- if (Math.abs(dx) > 0.01 || Math.abs(dy) > 0.01) {
13841
- obj._set("left", (obj.left ?? 0) + dx);
13842
- obj._set("top", (obj.top ?? 0) + dy);
13843
- obj.setCoords();
13844
- }
13845
- }
13846
- obj.dirty = true;
13847
- return;
13848
- }
13849
13739
  if (isXSide && ((_b2 = groupShiftReflowSnapshotRef.current) == null ? void 0 : _b2.selection) !== obj) {
13850
13740
  groupShiftReflowSnapshotRef.current = null;
13851
13741
  const logicalGroupId = obj.__pixldocsGroupSelection;
@@ -14346,9 +14236,7 @@ const PageCanvas = forwardRef(
14346
14236
  for (const child of t.getObjects()) {
14347
14237
  delete child.__asLiveOrigW;
14348
14238
  delete child.__asLiveOrigH;
14349
- delete child.__asRotAwareChild;
14350
14239
  }
14351
- delete t.__asRotAwareSnap;
14352
14240
  }
14353
14241
  } catch {
14354
14242
  }
@@ -14872,6 +14760,9 @@ const PageCanvas = forwardRef(
14872
14760
  let finalScaleX = decomposed.scaleX;
14873
14761
  let finalScaleY = decomposed.scaleY;
14874
14762
  let finalAbsoluteMatrix = absoluteMatrix;
14763
+ let finalAngle = decomposed.angle;
14764
+ let finalSkewX = decomposed.skewX;
14765
+ let finalSkewY = decomposed.skewY;
14875
14766
  if (obj instanceof fabric.Group && obj.__cropGroup) {
14876
14767
  const ct = obj.__cropData;
14877
14768
  if (ct) {
@@ -14928,6 +14819,11 @@ const PageCanvas = forwardRef(
14928
14819
  finalHeight = bakedH;
14929
14820
  finalScaleX = 1;
14930
14821
  finalScaleY = 1;
14822
+ if (activeSelectionResizeHandle === "ml" || activeSelectionResizeHandle === "mr" || activeSelectionResizeHandle === "mt" || activeSelectionResizeHandle === "mb") {
14823
+ finalAngle = (sourceElement == null ? void 0 : sourceElement.angle) ?? obj.angle ?? decomposed.angle;
14824
+ finalSkewX = (sourceElement == null ? void 0 : sourceElement.skewX) ?? obj.skewX ?? 0;
14825
+ finalSkewY = (sourceElement == null ? void 0 : sourceElement.skewY) ?? obj.skewY ?? 0;
14826
+ }
14931
14827
  obj.set({ scaleX: 1, scaleY: 1 });
14932
14828
  const newSrc = renderSmartElementToDataUri(sourceElement.smartElementType, sourceElement.smartProps, bakedW, bakedH);
14933
14829
  if (newSrc) {
@@ -14978,20 +14874,7 @@ const PageCanvas = forwardRef(
14978
14874
  obj.set({ scaleX: localScaleX, scaleY: localScaleY });
14979
14875
  const selectionMatrix = (_g = activeObj == null ? void 0 : activeObj.calcTransformMatrix) == null ? void 0 : _g.call(activeObj);
14980
14876
  const localCenter = selectionMatrix ? fabric.util.transformPoint(preBakeCenter, fabric.util.invertTransform(selectionMatrix)) : preBakeCenter;
14981
- const localWidth = bakedW * localScaleX;
14982
- const localHeight = bakedH * localScaleY;
14983
- const isCenterOrigin = obj.originX === "center" || obj.originY === "center";
14984
- if (isCenterOrigin) {
14985
- obj.set({
14986
- left: localCenter.x,
14987
- top: localCenter.y
14988
- });
14989
- } else {
14990
- obj.set({
14991
- left: localCenter.x - localWidth / 2,
14992
- top: localCenter.y - localHeight / 2
14993
- });
14994
- }
14877
+ obj.setPositionByOrigin(localCenter, "center", "center");
14995
14878
  }
14996
14879
  obj.dirty = true;
14997
14880
  if (activeObj) activeObj.dirty = true;
@@ -15002,33 +14885,29 @@ const PageCanvas = forwardRef(
15002
14885
  finalHeight = bakedH;
15003
14886
  finalScaleX = 1;
15004
14887
  finalScaleY = 1;
14888
+ if (activeSelectionResizeHandle === "ml" || activeSelectionResizeHandle === "mr" || activeSelectionResizeHandle === "mt" || activeSelectionResizeHandle === "mb") {
14889
+ finalAngle = (sourceElement == null ? void 0 : sourceElement.angle) ?? obj.angle ?? decomposed.angle;
14890
+ finalSkewX = (sourceElement == null ? void 0 : sourceElement.skewX) ?? obj.skewX ?? 0;
14891
+ finalSkewY = (sourceElement == null ? void 0 : sourceElement.skewY) ?? obj.skewY ?? 0;
14892
+ }
15005
14893
  try {
15006
- const angleRad = (decomposed.angle ?? 0) * Math.PI / 180;
14894
+ const angleRad = (finalAngle ?? 0) * Math.PI / 180;
15007
14895
  const cos = Math.cos(angleRad);
15008
14896
  const sin = Math.sin(angleRad);
15009
14897
  const hw = finalWidth / 2;
15010
14898
  const hh = finalHeight / 2;
15011
- const corners = [
15012
- { x: -hw, y: -hh },
15013
- { x: hw, y: -hh },
15014
- { x: hw, y: hh },
15015
- { x: -hw, y: hh }
15016
- ].map((p) => ({
15017
- x: decomposed.translateX + p.x * cos - p.y * sin,
15018
- y: decomposed.translateY + p.x * sin + p.y * cos
15019
- }));
15020
- absoluteLeft = Math.min(...corners.map((p) => p.x));
15021
- absoluteTop = Math.min(...corners.map((p) => p.y));
14899
+ absoluteLeft = decomposed.translateX - hw * cos + hh * sin;
14900
+ absoluteTop = decomposed.translateY - hw * sin - hh * cos;
15022
14901
  } catch {
15023
14902
  }
15024
14903
  finalAbsoluteMatrix = fabric.util.composeMatrix({
15025
14904
  translateX: decomposed.translateX,
15026
14905
  translateY: decomposed.translateY,
15027
- angle: decomposed.angle ?? 0,
14906
+ angle: finalAngle ?? 0,
15028
14907
  scaleX: 1,
15029
14908
  scaleY: 1,
15030
- skewX: 0,
15031
- skewY: 0
14909
+ skewX: finalSkewX ?? 0,
14910
+ skewY: finalSkewY ?? 0
15032
14911
  });
15033
14912
  } else {
15034
14913
  finalWidth = intrinsicWidth;
@@ -15039,6 +14918,11 @@ const PageCanvas = forwardRef(
15039
14918
  finalHeight = 0;
15040
14919
  finalScaleX = 1;
15041
14920
  finalScaleY = 1;
14921
+ if (activeSelectionResizeHandle === "ml" || activeSelectionResizeHandle === "mr" || activeSelectionResizeHandle === "mt" || activeSelectionResizeHandle === "mb") {
14922
+ finalAngle = (sourceElement == null ? void 0 : sourceElement.angle) ?? obj.angle ?? decomposed.angle;
14923
+ finalSkewX = (sourceElement == null ? void 0 : sourceElement.skewX) ?? obj.skewX ?? 0;
14924
+ finalSkewY = (sourceElement == null ? void 0 : sourceElement.skewY) ?? obj.skewY ?? 0;
14925
+ }
15042
14926
  } else if (obj instanceof fabric.Textbox && isActiveSelection && (Math.abs((decomposed.scaleX ?? 1) - 1) > 1e-3 || Math.abs((decomposed.scaleY ?? 1) - 1) > 1e-3)) {
15043
14927
  const sx = Math.abs(decomposed.scaleX || 1);
15044
14928
  const sy = Math.abs(decomposed.scaleY || 1);
@@ -15109,12 +14993,7 @@ const PageCanvas = forwardRef(
15109
14993
  obj.set({ scaleX: localScaleX, scaleY: localScaleY });
15110
14994
  const selectionMatrix = (_h = activeObj == null ? void 0 : activeObj.calcTransformMatrix) == null ? void 0 : _h.call(activeObj);
15111
14995
  const localCenter = selectionMatrix ? fabric.util.transformPoint(preBakeCenter, fabric.util.invertTransform(selectionMatrix)) : preBakeCenter;
15112
- const localWidth = bakedWidth * localScaleX;
15113
- const localHeight = (obj.height ?? intrinsicHeight) * localScaleY;
15114
- obj.set({
15115
- left: localCenter.x - localWidth / 2,
15116
- top: localCenter.y - localHeight / 2
15117
- });
14996
+ obj.setPositionByOrigin(localCenter, "center", "center");
15118
14997
  } else {
15119
14998
  obj.setPositionByOrigin(preBakeCenter, "center", "center");
15120
14999
  }
@@ -15127,32 +15006,23 @@ const PageCanvas = forwardRef(
15127
15006
  } catch {
15128
15007
  }
15129
15008
  try {
15130
- const angleRad = (decomposed.angle ?? 0) * Math.PI / 180;
15009
+ const angleRad = (finalAngle ?? 0) * Math.PI / 180;
15131
15010
  const cos = Math.cos(angleRad);
15132
15011
  const sin = Math.sin(angleRad);
15133
15012
  const hw = finalWidth / 2;
15134
15013
  const hh = finalHeight / 2;
15135
- const corners = [
15136
- { x: -hw, y: -hh },
15137
- { x: hw, y: -hh },
15138
- { x: hw, y: hh },
15139
- { x: -hw, y: hh }
15140
- ].map((p) => ({
15141
- x: decomposed.translateX + p.x * cos - p.y * sin,
15142
- y: decomposed.translateY + p.x * sin + p.y * cos
15143
- }));
15144
- absoluteLeft = Math.min(...corners.map((p) => p.x));
15145
- absoluteTop = Math.min(...corners.map((p) => p.y));
15014
+ absoluteLeft = decomposed.translateX - hw * cos + hh * sin;
15015
+ absoluteTop = decomposed.translateY - hw * sin - hh * cos;
15146
15016
  } catch {
15147
15017
  }
15148
15018
  finalAbsoluteMatrix = fabric.util.composeMatrix({
15149
15019
  translateX: decomposed.translateX,
15150
15020
  translateY: decomposed.translateY,
15151
- angle: decomposed.angle ?? 0,
15021
+ angle: finalAngle ?? 0,
15152
15022
  scaleX: 1,
15153
15023
  scaleY: 1,
15154
- skewX: 0,
15155
- skewY: 0
15024
+ skewX: finalSkewX ?? 0,
15025
+ skewY: finalSkewY ?? 0
15156
15026
  });
15157
15027
  if (debugGroupTextCornerResize) {
15158
15028
  logGroupTextResizeDebug("text-bake", {
@@ -15219,9 +15089,9 @@ const PageCanvas = forwardRef(
15219
15089
  // so finalWidth already reflects the new width chosen by the user.
15220
15090
  width: finalWidth,
15221
15091
  height: isLineObj ? 0 : isAutoShrinkText ? typeof autoShrinkStoredHeight === "number" ? autoShrinkStoredHeight : finalHeight : finalHeight,
15222
- angle: decomposed.angle,
15223
- skewX: isLineObj ? 0 : decomposed.skewX,
15224
- skewY: isLineObj ? 0 : decomposed.skewY,
15092
+ angle: finalAngle,
15093
+ skewX: isLineObj ? 0 : finalSkewX,
15094
+ skewY: isLineObj ? 0 : finalSkewY,
15225
15095
  scaleX: finalScaleX,
15226
15096
  scaleY: finalScaleY,
15227
15097
  transformMatrix: finalAbsoluteMatrix
@@ -24375,9 +24245,9 @@ function captureFabricCanvasSvgForPdf(fabricInstance, canvasWidth, canvasHeight)
24375
24245
  }
24376
24246
  return svgString;
24377
24247
  }
24378
- const resolvedPackageVersion = "0.5.324";
24248
+ const resolvedPackageVersion = "0.5.326";
24379
24249
  const PACKAGE_VERSION = resolvedPackageVersion;
24380
- const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.324";
24250
+ const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.326";
24381
24251
  const roundParityValue = (value) => {
24382
24252
  if (typeof value !== "number") return value;
24383
24253
  return Number.isFinite(value) ? Number(value.toFixed(3)) : value;
@@ -25191,7 +25061,7 @@ class PixldocsRenderer {
25191
25061
  await this.waitForCanvasScene(container, cloned, i);
25192
25062
  }
25193
25063
  console.log(`[canvas-renderer][pdf-unified] mounted ${cloned.pages.length} page(s), handing off to client exportMultiPagePdf`);
25194
- const { exportMultiPagePdf, preparePagesForExport } = await import("./vectorPdfExport-Chs7LuGz.js");
25064
+ const { exportMultiPagePdf, preparePagesForExport } = await import("./vectorPdfExport-N0-ZYAKl.js");
25195
25065
  const prepared = preparePagesForExport(
25196
25066
  cloned.pages,
25197
25067
  canvasWidth,
@@ -27511,7 +27381,7 @@ async function prepareLiveCanvasSvgForPdf(rawSvg, pageWidth, pageHeight, pageKey
27511
27381
  if (options == null ? void 0 : options.stripPageBackground) stripRootPageBackgroundFromSvg(svgToDraw);
27512
27382
  sanitizeSvgTreeForPdf(svgToDraw);
27513
27383
  try {
27514
- const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await import("./vectorPdfExport-Chs7LuGz.js");
27384
+ const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await import("./vectorPdfExport-N0-ZYAKl.js");
27515
27385
  try {
27516
27386
  await logTextMeasurementDiagnostic(svgToDraw);
27517
27387
  } catch {
@@ -27911,4 +27781,4 @@ export {
27911
27781
  buildTeaserBlurFlatKeys as y,
27912
27782
  collectFontDescriptorsFromConfig as z
27913
27783
  };
27914
- //# sourceMappingURL=index-y6RZ0a0x.js.map
27784
+ //# sourceMappingURL=index-CXrA6xYG.js.map