@pixldocs/canvas-renderer 0.5.447 → 0.5.448

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.
@@ -11686,6 +11686,18 @@ const restorePersistedFlipState = (obj, flipX, flipY, angle) => {
11686
11686
  obj.setCoords();
11687
11687
  obj.dirty = true;
11688
11688
  };
11689
+ const isBitmapLikeFabricObject = (obj) => {
11690
+ var _a2;
11691
+ return obj instanceof fabric__namespace.FabricImage || obj instanceof fabric__namespace.Group && !!(obj.__cropGroup || ((_a2 = obj._ct) == null ? void 0 : _a2.isCropGroup));
11692
+ };
11693
+ const restorePersistedFlipFlagsOnly = (obj, flipX, flipY) => {
11694
+ if (!isBitmapLikeFabricObject(obj)) return;
11695
+ const sx = Math.abs(Number(obj.scaleX ?? 1)) || 1;
11696
+ const sy = Math.abs(Number(obj.scaleY ?? 1)) || 1;
11697
+ obj.set({ scaleX: sx, scaleY: sy, flipX, flipY });
11698
+ obj.setCoords();
11699
+ obj.dirty = true;
11700
+ };
11689
11701
  const toggleLogicalFlipInMatrix = (matrix, flipX, flipY) => {
11690
11702
  if (!flipX && !flipY) return matrix;
11691
11703
  const sx = flipX ? -1 : 1;
@@ -14655,7 +14667,7 @@ const PageCanvas = react.forwardRef(
14655
14667
  fabricCanvas.on("selection:cleared", () => {
14656
14668
  });
14657
14669
  fabricCanvas.on("object:scaling", (e) => {
14658
- var _a2, _b2, _c2, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q;
14670
+ var _a2, _b2, _c2, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w;
14659
14671
  if (!isActiveRef.current) return;
14660
14672
  const t = e.target;
14661
14673
  if (t) lastResizeScaleTargetRef.current = t;
@@ -14886,11 +14898,66 @@ const PageCanvas = react.forwardRef(
14886
14898
  };
14887
14899
  }
14888
14900
  }
14889
- if (obj instanceof fabric__namespace.ActiveSelection && (corner === "ml" || corner === "mr" || corner === "mt" || corner === "mb")) {
14890
- const isXSide = corner === "ml" || corner === "mr";
14901
+ if (obj instanceof fabric__namespace.ActiveSelection && isCornerResizeHandle(corner)) {
14891
14902
  const _cur = fabricCanvas._currentTransform;
14892
14903
  const startSx = Math.abs(Number(((_g = _cur == null ? void 0 : _cur.original) == null ? void 0 : _g.scaleX) ?? 1)) || 1;
14893
14904
  const startSy = Math.abs(Number(((_h = _cur == null ? void 0 : _cur.original) == null ? void 0 : _h.scaleY) ?? 1)) || 1;
14905
+ const liveAsSx = Math.abs((obj.scaleX ?? 1) / startSx) || 1;
14906
+ const liveAsSy = Math.abs((obj.scaleY ?? 1) / startSy) || 1;
14907
+ const uniform = Math.max(1e-3, Math.sqrt(liveAsSx * liveAsSy));
14908
+ for (const child of obj.getObjects()) {
14909
+ if (!isBitmapLikeFabricObject(child)) continue;
14910
+ const liveGestureKey = `${obj.__pixldocsGroupSelection ?? "selection"}:${corner}:${((_i = groupSelectionTransformStartRef.current) == null ? void 0 : _i.selectionLeft) ?? obj.left ?? 0}:${((_j = groupSelectionTransformStartRef.current) == null ? void 0 : _j.selectionTop) ?? obj.top ?? 0}`;
14911
+ if (child.__asLiveGestureKey !== liveGestureKey) {
14912
+ child.__asLiveGestureKey = liveGestureKey;
14913
+ child.__asLiveOrigAngle = Number.isFinite(child.angle) ? child.angle ?? 0 : 0;
14914
+ child.__asLiveOrigFlipX = !!child.flipX;
14915
+ child.__asLiveOrigFlipY = !!child.flipY;
14916
+ child.__asLiveOrigScaleX = Math.abs(Number(child.scaleX ?? 1)) || 1;
14917
+ child.__asLiveOrigScaleY = Math.abs(Number(child.scaleY ?? 1)) || 1;
14918
+ }
14919
+ const childAngleDeg = child.__asLiveOrigAngle ?? (child.angle ?? 0);
14920
+ const origScaleX = child.__asLiveOrigScaleX;
14921
+ const origScaleY = child.__asLiveOrigScaleY;
14922
+ const baseW = Math.max(1, Number(((_k = child.__cropData) == null ? void 0 : _k.frameW) ?? child.width ?? 1));
14923
+ const baseH = Math.max(1, Number(((_l = child.__cropData) == null ? void 0 : _l.frameH) ?? child.height ?? 1));
14924
+ try {
14925
+ const inv = [1 / liveAsSx, 0, 0, 1 / liveAsSy, 0, 0];
14926
+ const Rtheta = fabric__namespace.util.composeMatrix({ angle: childAngleDeg, scaleX: 1, scaleY: 1, translateX: 0, translateY: 0 });
14927
+ const Uscale = fabric__namespace.util.composeMatrix({ angle: 0, scaleX: origScaleX * uniform, scaleY: origScaleY * uniform, translateX: 0, translateY: 0 });
14928
+ const M = fabric__namespace.util.multiplyTransformMatrices(
14929
+ fabric__namespace.util.multiplyTransformMatrices(inv, Rtheta),
14930
+ Uscale
14931
+ );
14932
+ const dec = fabric__namespace.util.qrDecompose(M);
14933
+ child._set("angle", dec.angle);
14934
+ child._set("scaleX", dec.scaleX);
14935
+ child._set("scaleY", dec.scaleY);
14936
+ child._set("skewX", dec.skewX);
14937
+ child._set("skewY", dec.skewY);
14938
+ child._set("flipX", !!(child.__asLiveOrigFlipX ?? child.flipX));
14939
+ child._set("flipY", !!(child.__asLiveOrigFlipY ?? child.flipY));
14940
+ const worldMatrix = fabric__namespace.util.multiplyTransformMatrices(
14941
+ obj.calcTransformMatrix(),
14942
+ child.calcOwnMatrix()
14943
+ );
14944
+ const live = fabric__namespace.util.qrDecompose(worldMatrix);
14945
+ child.__asLiveWorldAngle = (obj.angle ?? 0) + childAngleDeg;
14946
+ child.__asLiveWorldCenterX = live.translateX;
14947
+ child.__asLiveWorldCenterY = live.translateY;
14948
+ child.__asLiveFinalW = baseW * origScaleX * uniform;
14949
+ child.__asLiveFinalH = baseH * origScaleY * uniform;
14950
+ } catch {
14951
+ }
14952
+ child.setCoords();
14953
+ child.dirty = true;
14954
+ }
14955
+ }
14956
+ if (obj instanceof fabric__namespace.ActiveSelection && (corner === "ml" || corner === "mr" || corner === "mt" || corner === "mb")) {
14957
+ const isXSide = corner === "ml" || corner === "mr";
14958
+ const _cur = fabricCanvas._currentTransform;
14959
+ const startSx = Math.abs(Number(((_m = _cur == null ? void 0 : _cur.original) == null ? void 0 : _m.scaleX) ?? 1)) || 1;
14960
+ const startSy = Math.abs(Number(((_n = _cur == null ? void 0 : _cur.original) == null ? void 0 : _n.scaleY) ?? 1)) || 1;
14894
14961
  const sAxis = isXSide ? Math.abs((obj.scaleX ?? 1) / startSx) : Math.abs((obj.scaleY ?? 1) / startSy);
14895
14962
  if (sAxis > 1e-3) {
14896
14963
  const captureAsLiveWorldSnapshot = (childObj, liveW, liveH) => {
@@ -14909,13 +14976,13 @@ const PageCanvas = react.forwardRef(
14909
14976
  } catch {
14910
14977
  }
14911
14978
  };
14912
- if (isXSide && ((_i = groupShiftReflowSnapshotRef.current) == null ? void 0 : _i.selection) !== obj) {
14979
+ if (isXSide && ((_o = groupShiftReflowSnapshotRef.current) == null ? void 0 : _o.selection) !== obj) {
14913
14980
  groupShiftReflowSnapshotRef.current = null;
14914
14981
  const logicalGroupId = obj.__pixldocsGroupSelection;
14915
14982
  if (logicalGroupId) {
14916
14983
  try {
14917
14984
  const state = useEditorStore.getState();
14918
- const pageChildren2 = ((_j = state.canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _j.children) ?? [];
14985
+ const pageChildren2 = ((_p = state.canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _p.children) ?? [];
14919
14986
  const groupNode = findNodeById(pageChildren2, logicalGroupId);
14920
14987
  if (groupNode && isGroup(groupNode) && !isStackLayoutMode(groupNode.layoutMode)) {
14921
14988
  const entries = obj.getObjects().map((c) => ({
@@ -14945,7 +15012,7 @@ const PageCanvas = react.forwardRef(
14945
15012
  const asRect0 = obj.getBoundingRect();
14946
15013
  let didReflowTextChild = false;
14947
15014
  for (const child of obj.getObjects()) {
14948
- const liveGestureKey = `${obj.__pixldocsGroupSelection ?? "selection"}:${corner}:${((_k = groupSelectionTransformStartRef.current) == null ? void 0 : _k.selectionLeft) ?? obj.left ?? 0}:${((_l = groupSelectionTransformStartRef.current) == null ? void 0 : _l.selectionTop) ?? obj.top ?? 0}`;
15015
+ const liveGestureKey = `${obj.__pixldocsGroupSelection ?? "selection"}:${corner}:${((_q = groupSelectionTransformStartRef.current) == null ? void 0 : _q.selectionLeft) ?? obj.left ?? 0}:${((_r = groupSelectionTransformStartRef.current) == null ? void 0 : _r.selectionTop) ?? obj.top ?? 0}`;
14949
15016
  if (child.__asLiveGestureKey !== liveGestureKey) {
14950
15017
  child.__asLiveGestureKey = liveGestureKey;
14951
15018
  child.__asLiveOrigAngle = Number.isFinite(child.angle) ? child.angle ?? 0 : 0;
@@ -14954,7 +15021,7 @@ const PageCanvas = react.forwardRef(
14954
15021
  }
14955
15022
  const liveAsSx = isXSide ? sAxis : 1;
14956
15023
  const liveAsSy = isXSide ? 1 : sAxis;
14957
- if (child instanceof fabric__namespace.Group && (child.__cropGroup || ((_m = child._ct) == null ? void 0 : _m.isCropGroup)) || child instanceof fabric__namespace.FabricImage && !child.__cropGroup && !child.smartElementType) {
15024
+ if (child instanceof fabric__namespace.Group && (child.__cropGroup || ((_s = child._ct) == null ? void 0 : _s.isCropGroup)) || child instanceof fabric__namespace.FabricImage && !child.__cropGroup && !child.smartElementType) {
14958
15025
  const childAngleDeg2 = child.__asLiveOrigAngle ?? (child.angle ?? 0);
14959
15026
  const theta2 = fabric__namespace.util.degreesToRadians(childAngleDeg2);
14960
15027
  const cosT2 = Math.cos(theta2);
@@ -14965,8 +15032,8 @@ const PageCanvas = react.forwardRef(
14965
15032
  if (child.__asLiveOrigScaleY == null) child.__asLiveOrigScaleY = Math.abs(Number(child.scaleY ?? 1)) || 1;
14966
15033
  const origScaleX = child.__asLiveOrigScaleX;
14967
15034
  const origScaleY = child.__asLiveOrigScaleY;
14968
- const baseW = Math.max(1, Number(((_n = child.__cropData) == null ? void 0 : _n.frameW) ?? child.width ?? 1));
14969
- const baseH = Math.max(1, Number(((_o = child.__cropData) == null ? void 0 : _o.frameH) ?? child.height ?? 1));
15035
+ const baseW = Math.max(1, Number(((_t = child.__cropData) == null ? void 0 : _t.frameW) ?? child.width ?? 1));
15036
+ const baseH = Math.max(1, Number(((_u = child.__cropData) == null ? void 0 : _u.frameH) ?? child.height ?? 1));
14970
15037
  const liveW = baseW * origScaleX * dX;
14971
15038
  const liveH = baseH * origScaleY * dY;
14972
15039
  try {
@@ -15045,7 +15112,7 @@ const PageCanvas = react.forwardRef(
15045
15112
  child.dirty = true;
15046
15113
  didReflowTextChild = true;
15047
15114
  }
15048
- if (isXSide && ((_p = groupShiftReflowSnapshotRef.current) == null ? void 0 : _p.selection) === obj) {
15115
+ if (isXSide && ((_v = groupShiftReflowSnapshotRef.current) == null ? void 0 : _v.selection) === obj) {
15049
15116
  const snap = groupShiftReflowSnapshotRef.current;
15050
15117
  const anchorEntry = snap.children[0];
15051
15118
  const anchorTopLive = anchorEntry.obj.top ?? 0;
@@ -15207,7 +15274,7 @@ const PageCanvas = react.forwardRef(
15207
15274
  setGuides(gridGuidesForScale.length ? [...scaleGuides, ...gridGuidesForScale] : scaleGuides);
15208
15275
  if (drilledGroupIdRef.current) {
15209
15276
  try {
15210
- (_q = fabricCanvas.__updateDrilledGroupOutline) == null ? void 0 : _q.call(fabricCanvas);
15277
+ (_w = fabricCanvas.__updateDrilledGroupOutline) == null ? void 0 : _w.call(fabricCanvas);
15211
15278
  } catch {
15212
15279
  }
15213
15280
  }
@@ -16455,7 +16522,13 @@ const PageCanvas = react.forwardRef(
16455
16522
  const cleanTransformMatrix = toggleLogicalFlipInMatrix(normalizedFinalAbsoluteMatrix, persistedFlipX, persistedFlipY);
16456
16523
  const persistedDecomposed = fabric__namespace.util.qrDecompose(cleanTransformMatrix);
16457
16524
  if (isActiveSelection && (obj instanceof fabric__namespace.FabricImage || obj instanceof fabric__namespace.Group && obj.__cropGroup)) {
16458
- activeSelectionFlipRestores.push({ obj, flipX: persistedFlipX, flipY: persistedFlipY, angle: persistedAngle });
16525
+ activeSelectionFlipRestores.push({
16526
+ obj,
16527
+ flipX: persistedFlipX,
16528
+ flipY: persistedFlipY,
16529
+ localAngle: Number.isFinite(obj.angle) ? obj.angle ?? 0 : persistedAngle,
16530
+ worldAngle: persistedAngle
16531
+ });
16459
16532
  }
16460
16533
  const elementUpdate = {
16461
16534
  left: storePos.left,
@@ -16536,7 +16609,7 @@ const PageCanvas = react.forwardRef(
16536
16609
  }
16537
16610
  const isCropGroupObj = obj instanceof fabric__namespace.Group && obj.__cropGroup;
16538
16611
  const isPlainImageObj = obj instanceof fabric__namespace.FabricImage && !obj.__cropGroup && !obj.smartElementType;
16539
- if (isActiveSelection && isActiveSelectionSideHandle && (isCropGroupObj || isPlainImageObj)) {
16612
+ if (isActiveSelection && isActiveSelectionResizeGesture && (isCropGroupObj || isPlainImageObj)) {
16540
16613
  const childLocalAngleSrc = obj.__asLiveOrigAngle != null ? obj.__asLiveOrigAngle : Number.isFinite(sourceElement == null ? void 0 : sourceElement.angle) ? sourceElement.angle ?? 0 : obj.angle ?? 0;
16541
16614
  const normAng = (childLocalAngleSrc % 360 + 360) % 360;
16542
16615
  const isRotatedImg = Math.min(normAng, 360 - normAng) > 0.5;
@@ -16588,7 +16661,7 @@ const PageCanvas = react.forwardRef(
16588
16661
  if (isActiveSelection && (obj instanceof fabric__namespace.FabricImage || obj instanceof fabric__namespace.Group && obj.__cropGroup)) {
16589
16662
  const restore = activeSelectionFlipRestores.find((entry) => entry.obj === obj);
16590
16663
  if (restore) {
16591
- restore.angle = Number.isFinite(elementUpdate.angle) ? elementUpdate.angle : persistedAngle;
16664
+ restore.worldAngle = Number.isFinite(elementUpdate.angle) ? elementUpdate.angle : persistedAngle;
16592
16665
  }
16593
16666
  }
16594
16667
  if (isActiveSelection) {
@@ -16687,14 +16760,14 @@ const PageCanvas = react.forwardRef(
16687
16760
  skipActiveSelectionBakeOnClearRef.current = true;
16688
16761
  try {
16689
16762
  for (const restore of activeSelectionFlipRestores) {
16690
- restorePersistedFlipState(restore.obj, restore.flipX, restore.flipY, restore.angle);
16763
+ restorePersistedFlipFlagsOnly(restore.obj, restore.flipX, restore.flipY);
16691
16764
  }
16692
16765
  fabricCanvas.discardActiveObject();
16693
16766
  } finally {
16694
16767
  skipActiveSelectionBakeOnClearRef.current = false;
16695
16768
  }
16696
16769
  for (const restore of activeSelectionFlipRestores) {
16697
- restorePersistedFlipState(restore.obj, restore.flipX, restore.flipY, restore.angle);
16770
+ restorePersistedFlipState(restore.obj, restore.flipX, restore.flipY);
16698
16771
  }
16699
16772
  for (const bake of pendingCropGroupFrameBakes) {
16700
16773
  const ct = bake.obj.__cropData;
@@ -16716,7 +16789,7 @@ const PageCanvas = react.forwardRef(
16716
16789
  bake.obj.setCoords();
16717
16790
  }
16718
16791
  for (const restore of activeSelectionFlipRestores) {
16719
- restorePersistedFlipState(restore.obj, restore.flipX, restore.flipY, restore.angle);
16792
+ restorePersistedFlipState(restore.obj, restore.flipX, restore.flipY);
16720
16793
  }
16721
16794
  if (membersToReselect.length > 1) {
16722
16795
  const newSel = new fabric__namespace.ActiveSelection(membersToReselect, { canvas: fabricCanvas });
@@ -25889,9 +25962,9 @@ function captureFabricCanvasSvgForPdf(fabricInstance, canvasWidth, canvasHeight)
25889
25962
  }
25890
25963
  return svgString;
25891
25964
  }
25892
- const resolvedPackageVersion = "0.5.447";
25965
+ const resolvedPackageVersion = "0.5.448";
25893
25966
  const PACKAGE_VERSION = resolvedPackageVersion;
25894
- const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.447";
25967
+ const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.448";
25895
25968
  const roundParityValue = (value) => {
25896
25969
  if (typeof value !== "number") return value;
25897
25970
  return Number.isFinite(value) ? Number(value.toFixed(3)) : value;
@@ -26705,7 +26778,7 @@ class PixldocsRenderer {
26705
26778
  await this.waitForCanvasScene(container, cloned, i);
26706
26779
  }
26707
26780
  console.log(`[canvas-renderer][pdf-unified] mounted ${cloned.pages.length} page(s), handing off to client exportMultiPagePdf`);
26708
- const { exportMultiPagePdf, preparePagesForExport } = await Promise.resolve().then(() => require("./vectorPdfExport-BVQkDFXD.cjs"));
26781
+ const { exportMultiPagePdf, preparePagesForExport } = await Promise.resolve().then(() => require("./vectorPdfExport-B9AA07qB.cjs"));
26709
26782
  const prepared = preparePagesForExport(
26710
26783
  cloned.pages,
26711
26784
  canvasWidth,
@@ -29025,7 +29098,7 @@ async function prepareLiveCanvasSvgForPdf(rawSvg, pageWidth, pageHeight, pageKey
29025
29098
  if (options == null ? void 0 : options.stripPageBackground) stripRootPageBackgroundFromSvg(svgToDraw);
29026
29099
  sanitizeSvgTreeForPdf(svgToDraw);
29027
29100
  try {
29028
- const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await Promise.resolve().then(() => require("./vectorPdfExport-BVQkDFXD.cjs"));
29101
+ const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await Promise.resolve().then(() => require("./vectorPdfExport-B9AA07qB.cjs"));
29029
29102
  try {
29030
29103
  await logTextMeasurementDiagnostic(svgToDraw);
29031
29104
  } catch {
@@ -29422,4 +29495,4 @@ exports.setAutoShrinkDebug = setAutoShrinkDebug;
29422
29495
  exports.setBundledAssetPrefixes = setBundledAssetPrefixes;
29423
29496
  exports.warmResolvedTemplateForPreview = warmResolvedTemplateForPreview;
29424
29497
  exports.warmTemplateFromForm = warmTemplateFromForm;
29425
- //# sourceMappingURL=index-D7JnQkpf.cjs.map
29498
+ //# sourceMappingURL=index-CzxefTLk.cjs.map