@pixldocs/canvas-renderer 0.5.359 → 0.5.361

package/dist/{index-lU7E8PIC.js → index-BaiH8RTh.js}

@@ -11087,6 +11087,136 @@ const logGroupTextResizeDebug = (phase, payload) => {
     console.log(GROUP_TEXT_RESIZE_DEBUG_PREFIX, phase, payload);
   }
 };
+const ROT_GROUP_IMAGE_DRIFT_DEBUG_PREFIX = "[Pixldocs][rot-group-image-drift]";
+const ROT_GROUP_IMAGE_DRIFT_DEBUG_MAX_ENTRIES = 500;
+const roundRotDriftNumber = (value) => {
+  if (typeof value !== "number") return value;
+  return Number.isFinite(value) ? Math.round(value * 1e3) / 1e3 : String(value);
+};
+const normalizeRotDriftPayload = (value) => {
+  const seen = /* @__PURE__ */ new WeakSet();
+  const normalize = (entry) => {
+    if (entry == null) return entry;
+    const valueType = typeof entry;
+    if (valueType === "number") return roundRotDriftNumber(entry);
+    if (valueType === "string" || valueType === "boolean") return entry;
+    if (Array.isArray(entry)) return entry.map((item) => normalize(item));
+    if (valueType === "object") {
+      if (seen.has(entry)) return "[Circular]";
+      seen.add(entry);
+      if (entry instanceof fabric.FabricObject) return normalize(summarizeRotDriftObject(entry));
+      const output = {};
+      Object.entries(entry).forEach(([key, item]) => {
+        output[key] = normalize(item);
+      });
+      return output;
+    }
+    return String(entry);
+  };
+  return normalize(value);
+};
+const matrixForRotDriftLog = (matrix) => {
+  if (!matrix) return void 0;
+  return matrix.map((entry) => roundRotDriftNumber(entry));
+};
+const summarizeRotDriftObject = (obj, worldMatrix) => {
+  var _a2, _b2, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q;
+  if (!obj) return null;
+  const anyObj = obj;
+  try {
+    const ownMatrix = (_a2 = obj.calcOwnMatrix) == null ? void 0 : _a2.call(obj);
+    const calcWorld = worldMatrix ?? ((_b2 = obj.calcTransformMatrix) == null ? void 0 : _b2.call(obj));
+    const decomposed = calcWorld ? fabric.util.qrDecompose(calcWorld) : null;
+    const center = (_c = obj.getCenterPoint) == null ? void 0 : _c.call(obj);
+    const rect = (_d = obj.getBoundingRect) == null ? void 0 : _d.call(obj);
+    return {
+      id: getObjectId(obj),
+      type: anyObj.type ?? ((_e = obj.constructor) == null ? void 0 : _e.name),
+      isAS: obj instanceof fabric.ActiveSelection,
+      isGroup: obj instanceof fabric.Group,
+      isImage: obj instanceof fabric.FabricImage,
+      isCropGroup: Boolean(anyObj.__cropGroup || ((_f = anyObj._ct) == null ? void 0 : _f.isCropGroup)),
+      hasLayoutManager: Boolean(anyObj.layoutManager),
+      left: obj.left,
+      top: obj.top,
+      angle: obj.angle,
+      scaleX: obj.scaleX,
+      scaleY: obj.scaleY,
+      width: obj.width,
+      height: obj.height,
+      originX: obj.originX,
+      originY: obj.originY,
+      centerX: center == null ? void 0 : center.x,
+      centerY: center == null ? void 0 : center.y,
+      brLeft: rect == null ? void 0 : rect.left,
+      brTop: rect == null ? void 0 : rect.top,
+      brWidth: rect == null ? void 0 : rect.width,
+      brHeight: rect == null ? void 0 : rect.height,
+      worldTx: decomposed == null ? void 0 : decomposed.translateX,
+      worldTy: decomposed == null ? void 0 : decomposed.translateY,
+      worldAngle: decomposed == null ? void 0 : decomposed.angle,
+      worldScaleX: decomposed == null ? void 0 : decomposed.scaleX,
+      worldScaleY: decomposed == null ? void 0 : decomposed.scaleY,
+      ownMatrix: matrixForRotDriftLog(ownMatrix ?? null),
+      worldMatrix: matrixForRotDriftLog(calcWorld ?? null),
+      cropFrameW: (_g = anyObj.__cropData) == null ? void 0 : _g.frameW,
+      cropFrameH: (_h = anyObj.__cropData) == null ? void 0 : _h.frameH,
+      cropPanX: (_k = (_j = (_i = anyObj.__cropData) == null ? void 0 : _i._img) == null ? void 0 : _j._ct) == null ? void 0 : _k.panX,
+      cropPanY: (_n = (_m = (_l = anyObj.__cropData) == null ? void 0 : _l._img) == null ? void 0 : _m._ct) == null ? void 0 : _n.panY,
+      cropZoom: (_q = (_p = (_o = anyObj.__cropData) == null ? void 0 : _o._img) == null ? void 0 : _p._ct) == null ? void 0 : _q.zoom
+    };
+  } catch (error) {
+    return { id: getObjectId(obj), type: anyObj.type, error: String(error) };
+  }
+};
+const logRotGroupImageDrift = (phase, payload) => {
+  if (typeof console === "undefined") return;
+  try {
+    const line = `${ROT_GROUP_IMAGE_DRIFT_DEBUG_PREFIX} ${phase} ${JSON.stringify(normalizeRotDriftPayload(payload))}`;
+    if (typeof window !== "undefined") {
+      const debugWindow = window;
+      debugWindow.__pixldocsRotGroupImageDriftLogs = Array.isArray(debugWindow.__pixldocsRotGroupImageDriftLogs) ? debugWindow.__pixldocsRotGroupImageDriftLogs.slice(-ROT_GROUP_IMAGE_DRIFT_DEBUG_MAX_ENTRIES + 1) : [];
+      debugWindow.__pixldocsRotGroupImageDriftLogs.push(line);
+    }
+    console.log(line);
+  } catch {
+    console.log(ROT_GROUP_IMAGE_DRIFT_DEBUG_PREFIX, phase, payload);
+  }
+};
+const shouldLogRotDriftLiveTick = (target, phase) => {
+  if (!target) return false;
+  const anyTarget = target;
+  const key = `__pixldocsRotDrift_${phase}_count`;
+  const count = (anyTarget[key] ?? 0) + 1;
+  anyTarget[key] = count;
+  return count <= 3 || count % 8 === 0;
+};
+const logRotDriftSelectionSnapshot = (phase, target, extra = {}) => {
+  if (!target) return;
+  const anyTarget = target;
+  const kids = typeof anyTarget.getObjects === "function" ? anyTarget.getObjects() : [];
+  const selectionMatrix = target instanceof fabric.ActiveSelection ? target.calcTransformMatrix() : null;
+  logRotGroupImageDrift(phase, {
+    ...extra,
+    target: summarizeRotDriftObject(target),
+    childCount: kids.length,
+    groupSelectionId: anyTarget.__pixldocsGroupSelection,
+    alignedAngle: anyTarget.__pixldocsAlignedAngle
+  });
+  kids.forEach((kid, childIndex) => {
+    var _a2, _b2;
+    const childWorldMatrix = selectionMatrix ? fabric.util.multiplyTransformMatrices(
+      selectionMatrix,
+      kid.calcOwnMatrix()
+    ) : (_a2 = kid.calcTransformMatrix) == null ? void 0 : _a2.call(kid);
+    logRotGroupImageDrift(`${phase}-child`, {
+      ...extra,
+      childIndex,
+      parentType: anyTarget.type ?? ((_b2 = target.constructor) == null ? void 0 : _b2.name),
+      child: summarizeRotDriftObject(kid, childWorldMatrix ?? null)
+    });
+  });
+};
 const bakeTextboxScaleIntoTypography = (obj, sourceElement) => {
   const sx = Math.abs(obj.scaleX ?? 1) || 1;
   const sy = Math.abs(obj.scaleY ?? 1) || 1;
@@ -11196,6 +11326,7 @@ function applyWarpAwareSelectionBorders(selection) {
               selection.calcTransformMatrix()
             );
             kids.forEach((k, index) => {
+              const beforeRestore = summarizeRotDriftObject(k);
               const localMatrix = fabric.util.multiplyTransformMatrices(
                 invSelection,
                 worldMatrices[index]
@@ -11214,8 +11345,19 @@ function applyWarpAwareSelectionBorders(selection) {
               }
               k.setCoords();
               k.dirty = true;
+              logRotGroupImageDrift("aligned-restore-child", {
+                targetAngle,
+                childIndex: index,
+                before: beforeRestore,
+                expectedLocal: fabric.util.qrDecompose(localMatrix),
+                after: summarizeRotDriftObject(k)
+              });
             });
           };
+          logRotDriftSelectionSnapshot("aligned-before", selection, {
+            targetAngle,
+            worldAngles
+          });
           selection.set({ angle: targetAngle, scaleX: 1, scaleY: 1, skewX: 0, skewY: 0 });
           restoreKidsFromWorld();
           try {
@@ -11226,6 +11368,10 @@ function applyWarpAwareSelectionBorders(selection) {
           selection.setCoords();
           selection.dirty = true;
           selection.__pixldocsAlignedAngle = targetAngle;
+          logRotDriftSelectionSnapshot("aligned-after", selection, {
+            targetAngle,
+            worldAngles
+          });
         }
       }
     }
@@ -12273,6 +12419,10 @@ const PageCanvas = forwardRef(
             selectionLeft: rect.left,
             selectionTop: rect.top
           };
+          logRotDriftSelectionSnapshot("mouse-down-active-selection", active, {
+            time: Math.round(performance.now()),
+            selectedStoreIds: useEditorStore.getState().canvas.selectedIds
+          });
         }
         if (fabricCanvas._currentTransform) {
           fabricCanvas.__isUserTransforming = true;
@@ -12885,6 +13035,14 @@ const PageCanvas = forwardRef(
           groupTop: groupAbs.top,
           selectionAngle: ((active.angle ?? 0) % 360 + 360) % 360
         };
+        logRotDriftSelectionSnapshot("transform-start", active, {
+          time: Math.round(performance.now()),
+          groupId,
+          groupAbs,
+          selectionRect: rect,
+          transformStart: groupSelectionTransformStartRef.current,
+          selectedStoreIds: useEditorStore.getState().canvas.selectedIds
+        });
       };
       const restoreGroupSelectionVisualState = (selection, groupId) => {
         applyLogicalGroupSelectionVisualState(selection, groupId);
@@ -13671,13 +13829,22 @@ const PageCanvas = forwardRef(
       fabricCanvas.on("selection:cleared", () => {
       });
       fabricCanvas.on("object:scaling", (e) => {
-        var _a2, _b2, _c, _d, _e, _f;
+        var _a2, _b2, _c, _d, _e, _f, _g, _h;
         if (!isActiveRef.current) return;
         const t = e.target;
         if (t) lastResizeScaleTargetRef.current = t;
         prepareGroupSelectionTransformStart(t);
         markTransforming(t);
         didTransformRef.current = true;
+        if (shouldLogRotDriftLiveTick(t, "scaling")) {
+          logRotDriftSelectionSnapshot("scaling", t, {
+            time: Math.round(performance.now()),
+            corner: t == null ? void 0 : t.__corner,
+            transformAction: (_a2 = fabricCanvas._currentTransform) == null ? void 0 : _a2.action,
+            transformCorner: (_b2 = fabricCanvas._currentTransform) == null ? void 0 : _b2.corner,
+            transformStart: groupSelectionTransformStartRef.current
+          });
+        }
         const transformTargetId = t ? getObjectId(t) : null;
         if (transformTargetId && transformTargetId !== "__background__") {
           preserveSelectionAfterTransformIdRef.current = transformTargetId;
@@ -13838,7 +14005,7 @@ const PageCanvas = forwardRef(
               time: Math.round(performance.now()),
               corner,
               groupSelectionId: obj.__pixldocsGroupSelection,
-              currentTransformAction: (_a2 = fabricCanvas._currentTransform) == null ? void 0 : _a2.action,
+              currentTransformAction: (_c = fabricCanvas._currentTransform) == null ? void 0 : _c.action,
               selection: summarizeFabricObjectForResizeDebug(obj),
               textChildren: obj.getObjects().filter((child) => child instanceof fabric.Textbox).map((child) => summarizeFabricObjectForResizeDebug(child))
             };
@@ -13848,13 +14015,13 @@ const PageCanvas = forwardRef(
           const isXSide = corner === "ml" || corner === "mr";
           const sAxis = isXSide ? Math.abs(obj.scaleX ?? 1) : Math.abs(obj.scaleY ?? 1);
           if (sAxis > 1e-3) {
-            if (isXSide && ((_b2 = groupShiftReflowSnapshotRef.current) == null ? void 0 : _b2.selection) !== obj) {
+            if (isXSide && ((_d = groupShiftReflowSnapshotRef.current) == null ? void 0 : _d.selection) !== obj) {
               groupShiftReflowSnapshotRef.current = null;
               const logicalGroupId = obj.__pixldocsGroupSelection;
               if (logicalGroupId) {
                 try {
                   const state = useEditorStore.getState();
-                  const pageChildren2 = ((_c = state.canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _c.children) ?? [];
+                  const pageChildren2 = ((_e = state.canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _e.children) ?? [];
                   const groupNode = findNodeById(pageChildren2, logicalGroupId);
                   if (groupNode && isGroup(groupNode) && !isStackLayoutMode(groupNode.layoutMode)) {
                     const entries = obj.getObjects().map((c) => ({
@@ -13884,7 +14051,7 @@ const PageCanvas = forwardRef(
             const asRect0 = obj.getBoundingRect();
             let didReflowTextChild = false;
             for (const child of obj.getObjects()) {
-              if (child instanceof fabric.Group && (child.__cropGroup || ((_d = child._ct) == null ? void 0 : _d.isCropGroup))) {
+              if (child instanceof fabric.Group && (child.__cropGroup || ((_f = child._ct) == null ? void 0 : _f.isCropGroup))) {
                 const ct = child.__cropData;
                 if (!ct) continue;
                 if (isXSide) {
@@ -13989,7 +14156,7 @@ const PageCanvas = forwardRef(
                 didReflowTextChild = true;
               }
             }
-            if (isXSide && ((_e = groupShiftReflowSnapshotRef.current) == null ? void 0 : _e.selection) === obj) {
+            if (isXSide && ((_g = groupShiftReflowSnapshotRef.current) == null ? void 0 : _g.selection) === obj) {
               const snap = groupShiftReflowSnapshotRef.current;
               const anchorEntry = snap.children[0];
               const anchorTopLive = anchorEntry.obj.top ?? 0;
@@ -14145,7 +14312,7 @@ const PageCanvas = forwardRef(
         setGuides(gridGuidesForScale.length ? [...scaleGuides, ...gridGuidesForScale] : scaleGuides);
         if (drilledGroupIdRef.current) {
           try {
-            (_f = fabricCanvas.__updateDrilledGroupOutline) == null ? void 0 : _f.call(fabricCanvas);
+            (_h = fabricCanvas.__updateDrilledGroupOutline) == null ? void 0 : _h.call(fabricCanvas);
           } catch {
           }
         }
@@ -14236,9 +14403,18 @@ const PageCanvas = forwardRef(
         }
       });
       fabricCanvas.on("object:rotating", (e) => {
+        var _a2, _b2;
         markSimpleTransform(e);
         didTransformRef.current = true;
         const tr = e.target;
+        if (shouldLogRotDriftLiveTick(tr, "rotating")) {
+          logRotDriftSelectionSnapshot("rotating", tr, {
+            time: Math.round(performance.now()),
+            transformAction: (_a2 = fabricCanvas._currentTransform) == null ? void 0 : _a2.action,
+            transformCorner: (_b2 = fabricCanvas._currentTransform) == null ? void 0 : _b2.corner,
+            transformStart: groupSelectionTransformStartRef.current
+          });
+        }
         try {
           const getCursor = fabricCanvas.__pixldocsGetRotateCursor;
           const upper = fabricCanvas.upperCanvasEl;
@@ -14267,10 +14443,19 @@ const PageCanvas = forwardRef(
         didTransformRef.current = true;
       });
       fabricCanvas.on("object:moving", (e) => {
+        var _a2, _b2;
         if (!isActiveRef.current) return;
         prepareGroupSelectionTransformStart(e.target);
         markTransforming(e.target);
         didTransformRef.current = true;
+        if (shouldLogRotDriftLiveTick(e.target, "moving")) {
+          logRotDriftSelectionSnapshot("moving", e.target, {
+            time: Math.round(performance.now()),
+            transformAction: (_a2 = fabricCanvas._currentTransform) == null ? void 0 : _a2.action,
+            transformCorner: (_b2 = fabricCanvas._currentTransform) == null ? void 0 : _b2.corner,
+            transformStart: groupSelectionTransformStartRef.current
+          });
+        }
         const activeDuringMove = fabricCanvas.getActiveObject();
         const movingLogicalGroupId = activeDuringMove instanceof fabric.ActiveSelection ? activeDuringMove.__pixldocsGroupSelection : void 0;
         const pendingMoveDrill = pendingGroupDrillInRef.current;
@@ -14607,6 +14792,15 @@ const PageCanvas = forwardRef(
             activeObjects = activeObjects[0].getObjects();
           }
           const isActiveSelection = activeObj instanceof fabric.ActiveSelection || activeObjects.length > 1;
+          if (activeObj instanceof fabric.ActiveSelection) {
+            logRotDriftSelectionSnapshot("modified-start-active-selection", activeObj, {
+              time: Math.round(performance.now()),
+              modifiedTarget: summarizeRotDriftObject(modifiedTarget),
+              activeObjectIds: activeObjects.map((candidate) => getObjectId(candidate)),
+              selectedStoreIds: useEditorStore.getState().canvas.selectedIds,
+              transformStart: groupSelectionTransformStartRef.current
+            });
+          }
           const activeSelectionResizeHandle = isActiveSelection ? activeSelectionResizeHandleRef.current : null;
           const debugGroupTextCornerResize = activeObj instanceof fabric.ActiveSelection && isCornerResizeHandle(activeSelectionResizeHandle) && activeObjects.some((candidate) => candidate instanceof fabric.Textbox);
           if (debugGroupTextCornerResize) {
@@ -14884,9 +15078,8 @@ const PageCanvas = forwardRef(
                 finalScaleX = 1;
                 finalScaleY = 1;
                 if (isActiveSelection && activeObj instanceof fabric.ActiveSelection) {
-                  const frameBounds = getObjectFrameBoundsInSelection(activeObj, obj, sourceFrameW, sourceFrameH);
-                  absoluteLeft = frameBounds.left;
-                  absoluteTop = frameBounds.top;
+                  absoluteLeft = (decomposed.translateX ?? absoluteLeft) - finalWidth / 2;
+                  absoluteTop = (decomposed.translateY ?? absoluteTop) - finalHeight / 2;
                 } else {
                   absoluteLeft = (decomposed.translateX ?? absoluteLeft) - finalWidth / 2;
                   absoluteTop = (decomposed.translateY ?? absoluteTop) - finalHeight / 2;
@@ -15256,6 +15449,32 @@ const PageCanvas = forwardRef(
                 objectBeforeStoreWrite: summarizeFabricObjectForResizeDebug(obj)
               });
             }
+            if (isActiveSelection) {
+              logRotGroupImageDrift("store-update-child", {
+                time: Math.round(performance.now()),
+                objId,
+                sourceElement: sourceElement ? {
+                  id: sourceElement.id,
+                  type: sourceElement.type,
+                  left: sourceElement.left,
+                  top: sourceElement.top,
+                  width: sourceElement.width,
+                  height: sourceElement.height,
+                  angle: sourceElement.angle,
+                  scaleX: sourceElement.scaleX,
+                  scaleY: sourceElement.scaleY
+                } : null,
+                objectBeforeStoreWrite: summarizeRotDriftObject(obj, finalAbsoluteMatrix),
+                activeSelection: summarizeRotDriftObject(activeObj),
+                absoluteMatrix,
+                finalAbsoluteMatrix,
+                decomposed,
+                absoluteLeft,
+                absoluteTop,
+                storePos,
+                elementUpdate
+              });
+            }
             updateElement(objId, elementUpdate, { recordHistory: false, skipLayoutRecalc: true });
             obj.setCoords();
           }
@@ -15286,6 +15505,19 @@ const PageCanvas = forwardRef(
                 renderOnAddRemove: fabricCanvas.renderOnAddRemove
               });
             }
+            logRotDriftSelectionSnapshot("before-reselect", activeObj, {
+              time: Math.round(performance.now()),
+              wasGroupSel,
+              memberIds: membersToReselect.map((member) => getObjectId(member)),
+              pendingCropBakes: pendingCropGroupFrameBakes.map((bake) => ({
+                id: getObjectId(bake.obj),
+                width: bake.width,
+                height: bake.height,
+                left: bake.left,
+                top: bake.top,
+                angle: bake.angle
+              }))
+            });
             const prevRenderOnAddRemove = fabricCanvas.renderOnAddRemove;
             fabricCanvas.renderOnAddRemove = false;
             skipSelectionClearOnDiscardRef.current = true;
@@ -15319,6 +15551,11 @@ const PageCanvas = forwardRef(
               if (wasGroupSel) restoreGroupSelectionVisualState(newSel, wasGroupSel);
               fabricCanvas.setActiveObject(newSel);
               newSel.setCoords();
+              logRotDriftSelectionSnapshot("after-reselect", newSel, {
+                time: Math.round(performance.now()),
+                wasGroupSel,
+                memberIds: membersToReselect.map((member) => getObjectId(member))
+              });
               if (debugGroupTextCornerResize) {
                 logGroupTextResizeDebug("after-reselect", {
                   time: Math.round(performance.now()),
@@ -24377,9 +24614,9 @@ function captureFabricCanvasSvgForPdf(fabricInstance, canvasWidth, canvasHeight)
   }
   return svgString;
 }
-const resolvedPackageVersion = "0.5.359";
+const resolvedPackageVersion = "0.5.361";
 const PACKAGE_VERSION = resolvedPackageVersion;
-const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.359";
+const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.361";
 const roundParityValue = (value) => {
   if (typeof value !== "number") return value;
   return Number.isFinite(value) ? Number(value.toFixed(3)) : value;
@@ -25193,7 +25430,7 @@ class PixldocsRenderer {
         await this.waitForCanvasScene(container, cloned, i);
       }
       console.log(`[canvas-renderer][pdf-unified] mounted ${cloned.pages.length} page(s), handing off to client exportMultiPagePdf`);
-      const { exportMultiPagePdf, preparePagesForExport } = await import("./vectorPdfExport-CaEmOpLs.js");
+      const { exportMultiPagePdf, preparePagesForExport } = await import("./vectorPdfExport-BvYAPUvD.js");
       const prepared = preparePagesForExport(
         cloned.pages,
         canvasWidth,
@@ -27513,7 +27750,7 @@ async function prepareLiveCanvasSvgForPdf(rawSvg, pageWidth, pageHeight, pageKey
     if (options == null ? void 0 : options.stripPageBackground) stripRootPageBackgroundFromSvg(svgToDraw);
     sanitizeSvgTreeForPdf(svgToDraw);
     try {
-      const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await import("./vectorPdfExport-CaEmOpLs.js");
+      const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await import("./vectorPdfExport-BvYAPUvD.js");
       try {
         await logTextMeasurementDiagnostic(svgToDraw);
       } catch {
@@ -27913,4 +28150,4 @@ export {
   buildTeaserBlurFlatKeys as y,
   collectFontDescriptorsFromConfig as z
 };
-//# sourceMappingURL=index-lU7E8PIC.js.map
+//# sourceMappingURL=index-BaiH8RTh.js.map