@pixldocs/canvas-renderer 0.5.353 → 0.5.355

package/dist/{index-UiuMKvLc.cjs → index-DWxht-v_.cjs}

@@ -10518,105 +10518,6 @@ function bakeEdgeFade(source, fade) {
   }
   return canvas;
 }
-const normalizeSignedAngle = (angle) => (angle % 360 + 540) % 360 - 180;
-const rotatedTopLeftToCenter = (left, top, width, height, angleDeg = 0) => {
-  const angle = angleDeg * Math.PI / 180;
-  const cos = Math.cos(angle);
-  const sin = Math.sin(angle);
-  return {
-    x: left + width / 2 * cos - height / 2 * sin,
-    y: top + width / 2 * sin + height / 2 * cos
-  };
-};
-const centerToRotatedTopLeft = (centerX, centerY, width, height, angleDeg = 0) => {
-  const angle = angleDeg * Math.PI / 180;
-  const cos = Math.cos(angle);
-  const sin = Math.sin(angle);
-  return {
-    left: centerX - width / 2 * cos + height / 2 * sin,
-    top: centerY - width / 2 * sin - height / 2 * cos
-  };
-};
-const getGroupTransformFrame = (group, pageChildren, options) => {
-  const bounds = getNodeBounds(group, pageChildren);
-  const width = Math.max(1, Number(group.width ?? bounds.width) || bounds.width || 1);
-  const height = Math.max(1, Number(group.height ?? bounds.height) || bounds.height || 1);
-  return {
-    left: Number(group.left ?? bounds.left ?? 0) || 0,
-    top: Number(group.top ?? bounds.top ?? 0) || 0,
-    width,
-    height,
-    angle: Number(group.angle ?? 0) || 0
-  };
-};
-const getGroupLocalToParentMatrix = (group, pageChildren, options) => {
-  const frame = getGroupTransformFrame(group, pageChildren);
-  const rad = frame.angle * Math.PI / 180;
-  const cos = Math.cos(rad);
-  const sin = Math.sin(rad);
-  return [
-    cos,
-    sin,
-    -sin,
-    cos,
-    frame.left,
-    frame.top
-  ];
-};
-const getAncestorGroupTransform = (nodeId, pageChildren, fabric2, options) => {
-  let matrix = [1, 0, 0, 1, 0, 0];
-  let angle = 0;
-  const chain = [];
-  let currentId = nodeId;
-  for (let guard = 0; guard < 32; guard++) {
-    const parent = findParentGroup(pageChildren, currentId);
-    if (!parent) break;
-    chain.unshift(parent);
-    currentId = parent.id;
-  }
-  for (const group of chain) {
-    matrix = fabric2.util.multiplyTransformMatrices(
-      matrix,
-      getGroupLocalToParentMatrix(group, pageChildren)
-    );
-    angle += Number(group.angle ?? 0) || 0;
-  }
-  return { matrix, angle: normalizeSignedAngle(angle) };
-};
-const getElementFabricPlacement$1 = (element, pageChildren, fabric2, options) => {
-  if (!pageChildren.length) {
-    return { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
-  }
-  const ancestor = getAncestorGroupTransform(element.id, pageChildren, fabric2);
-  const point = fabric2.util.transformPoint(
-    new fabric2.Point(element.left ?? 0, element.top ?? 0),
-    ancestor.matrix
-  );
-  return {
-    left: point.x,
-    top: point.y,
-    angle: normalizeSignedAngle(ancestor.angle + Number(element.angle ?? 0))
-  };
-};
-const getGroupAbsoluteTransformFrame$1 = (group, pageChildren, fabric2, options) => {
-  const frame = getGroupTransformFrame(group, pageChildren);
-  const ancestor = getAncestorGroupTransform(group.id, pageChildren, fabric2);
-  const centerLocal = rotatedTopLeftToCenter(frame.left, frame.top, frame.width, frame.height, frame.angle);
-  const center = fabric2.util.transformPoint(new fabric2.Point(centerLocal.x, centerLocal.y), ancestor.matrix);
-  const topLeft = fabric2.util.transformPoint(new fabric2.Point(frame.left, frame.top), ancestor.matrix);
-  return {
-    left: topLeft.x,
-    top: topLeft.y,
-    width: frame.width,
-    height: frame.height,
-    centerX: center.x,
-    centerY: center.y,
-    angle: normalizeSignedAngle(ancestor.angle + frame.angle)
-  };
-};
-function preserveLogicalGroupTagDuringMove(selection, groupId) {
-  selection.__pixldocsGroupSelection = groupId;
-}
 const SELECTION_PRIMARY = "hsl(217, 91%, 60%)";
 const SELECTION_BORDER_SCALE = 2;
 let ensureCanvaControlRenders = () => {
@@ -11070,18 +10971,12 @@ try {
       } catch (e) {
       }
     };
-    const wrapControlsFactory = (key) => {
-      if (typeof cu[key] !== "function") return;
-      const descriptor = Object.getOwnPropertyDescriptor(cu, key);
-      if (descriptor && descriptor.writable === false && !descriptor.set) return;
-      const original = cu[key].bind(cu);
-      try {
-        cu[key] = () => installPillRenders(original());
-      } catch {
-      }
-    };
-    wrapControlsFactory("createObjectDefaultControls");
-    wrapControlsFactory("createTextboxDefaultControls");
+    const origObj = cu.createObjectDefaultControls.bind(cu);
+    cu.createObjectDefaultControls = () => installPillRenders(origObj());
+    if (typeof cu.createTextboxDefaultControls === "function") {
+      const origTb = cu.createTextboxDefaultControls.bind(cu);
+      cu.createTextboxDefaultControls = () => installPillRenders(origTb());
+    }
     const wrapClassCreateControls = (Klass) => {
       if (!Klass || typeof Klass.createControls !== "function") return;
       const orig = Klass.createControls.bind(Klass);
@@ -11148,8 +11043,6 @@ const scaleUpdateNumber = (updates, source, key, factor) => {
 };
 const GROUP_TEXT_RESIZE_DEBUG_PREFIX = "[Pixldocs][group-text-corner-resize]";
 const GROUP_TEXT_RESIZE_DEBUG_MAX_ENTRIES = 200;
-const GROUP_IMAGE_RESIZE_DEBUG_PREFIX = "[Pixldocs][group-image-side-resize]";
-const GROUP_IMAGE_RESIZE_DEBUG_MAX_ENTRIES = 300;
 const isCornerResizeHandle = (handle) => handle === "tl" || handle === "tr" || handle === "bl" || handle === "br";
 const summarizeFabricObjectForResizeDebug = (obj) => {
   var _a2;
@@ -11212,43 +11105,6 @@ const logGroupTextResizeDebug = (phase, payload) => {
     console.log(GROUP_TEXT_RESIZE_DEBUG_PREFIX, phase, payload);
   }
 };
-const isGroupResizeImageLikeObject = (obj) => {
-  var _a2;
-  return !!obj && (obj instanceof fabric__namespace.FabricImage || obj instanceof fabric__namespace.Group && (obj.__cropGroup || ((_a2 = obj._ct) == null ? void 0 : _a2.isCropGroup)));
-};
-const logGroupImageResizeDebug = (phase, payload) => {
-  if (typeof console === "undefined") return;
-  try {
-    const seen = /* @__PURE__ */ new WeakSet();
-    const normalize = (value) => {
-      if (value == null) return value;
-      const valueType = typeof value;
-      if (valueType === "number") return Number.isFinite(value) ? Math.round(value * 1e3) / 1e3 : String(value);
-      if (valueType === "string" || valueType === "boolean") return value;
-      if (valueType === "function") return `[Function ${value.name || "anonymous"}]`;
-      if (Array.isArray(value)) return value.map((entry) => normalize(entry));
-      if (valueType === "object") {
-        if (seen.has(value)) return "[Circular]";
-        seen.add(value);
-        if (value instanceof fabric__namespace.FabricObject) return normalize(summarizeFabricObjectForResizeDebug(value));
-        const output = {};
-        Object.entries(value).forEach(([key, entry]) => {
-          output[key] = normalize(entry);
-        });
-        return output;
-      }
-      return String(value);
-    };
-    const normalizedPayload = normalize(payload);
-    const line = `${GROUP_IMAGE_RESIZE_DEBUG_PREFIX} ${phase} ${JSON.stringify(normalizedPayload)}`;
-    const debugWindow = window;
-    debugWindow.__pixldocsGroupImageResizeLogs = Array.isArray(debugWindow.__pixldocsGroupImageResizeLogs) ? debugWindow.__pixldocsGroupImageResizeLogs.slice(-GROUP_IMAGE_RESIZE_DEBUG_MAX_ENTRIES + 1) : [];
-    debugWindow.__pixldocsGroupImageResizeLogs.push(line);
-    console.log(line);
-  } catch {
-    console.log(GROUP_IMAGE_RESIZE_DEBUG_PREFIX, phase, payload);
-  }
-};
 const bakeTextboxScaleIntoTypography = (obj, sourceElement) => {
   const sx = Math.abs(obj.scaleX ?? 1) || 1;
   const sy = Math.abs(obj.scaleY ?? 1) || 1;
@@ -11322,8 +11178,6 @@ const bakeTextboxScaleIntoTypography = (obj, sourceElement) => {
   };
   return updates;
 };
-const getElementFabricPlacement = (element, pageChildren, options) => getElementFabricPlacement$1(element, pageChildren, fabric__namespace);
-const getGroupAbsoluteTransformFrame = (group, pageChildren, options) => getGroupAbsoluteTransformFrame$1(group, pageChildren, fabric__namespace);
 function applyWarpAwareSelectionBorders(selection) {
   var _a2;
   if (selection.__pixldocsOrigASHasBorders !== void 0) {
@@ -11332,7 +11186,6 @@ function applyWarpAwareSelectionBorders(selection) {
   }
   selection.hasBorders = true;
   selection.hasControls = true;
-  if (selection.__pixldocsGroupSelection) return;
   try {
     if (selection.__pixldocsAlignedAngle == null) {
       const kids = selection.getObjects();
@@ -11459,46 +11312,10 @@ const PageCanvas = react.forwardRef(
     const [ready, setReady] = react.useState(false);
     const [unlockRequestId, setUnlockRequestId] = react.useState(0);
     const applyLogicalGroupSelectionVisualState = react.useCallback((selection, groupId) => {
-      var _a2, _b2;
+      var _a2;
       selection.__pixldocsGroupSelection = groupId;
       delete selection.__pixldocsLogicalGroupIds;
       selection.hasBorders = true;
-      try {
-        const membersBeforeFrame = selection.getObjects();
-        const selectionMatrixBefore = selection.calcTransformMatrix();
-        const memberWorldMatrices = membersBeforeFrame.map((member) => fabric__namespace.util.multiplyTransformMatrices(
-          selectionMatrixBefore,
-          member.calcOwnMatrix()
-        ));
-        const pageChildren2 = ((_a2 = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _a2.children) ?? [];
-        const groupNode = findNodeById(pageChildren2, groupId);
-        const groupFrame = groupNode && isGroup(groupNode) ? getGroupAbsoluteTransformFrame(groupNode, pageChildren2, pageBoundsOptions) : null;
-        const groupAngle = groupFrame ? groupFrame.angle : 0;
-        if (Number.isFinite(groupAngle)) {
-          selection.set({ angle: groupAngle, scaleX: 1, scaleY: 1, skewX: 0, skewY: 0 });
-          if (groupFrame) {
-            selection.setPositionByOrigin(
-              new fabric__namespace.Point(groupFrame.centerX, groupFrame.centerY),
-              "center",
-              "center"
-            );
-          }
-          const invSelectionAfter = fabric__namespace.util.invertTransform(
-            selection.calcTransformMatrix()
-          );
-          membersBeforeFrame.forEach((member, index) => {
-            const localMatrix = fabric__namespace.util.multiplyTransformMatrices(
-              invSelectionAfter,
-              memberWorldMatrices[index]
-            );
-            fabric__namespace.util.applyTransformToObject(member, localMatrix);
-            member.setCoords();
-            member.dirty = true;
-          });
-          selection.setCoords();
-        }
-      } catch {
-      }
       const members = selection.getObjects();
       for (const prev of suppressGroupMemberBordersRef.current) {
         if (members.includes(prev)) continue;
@@ -11522,7 +11339,7 @@ const PageCanvas = react.forwardRef(
         if (m.__pixldocsOrigHasControls === void 0) m.__pixldocsOrigHasControls = m.hasControls;
         m.hasBorders = false;
         m.hasControls = false;
-        if (m.__cropGroup || ((_b2 = m._ct) == null ? void 0 : _b2.isCropGroup)) {
+        if (m.__cropGroup || ((_a2 = m._ct) == null ? void 0 : _a2.isCropGroup)) {
           if (m.__pixldocsOrigLockScalingX === void 0) {
             m.__pixldocsOrigLockScalingX = m.lockScalingX;
             m.__pixldocsOrigLockScalingY = m.lockScalingY;
@@ -11532,7 +11349,7 @@ const PageCanvas = react.forwardRef(
         }
       }
       applyWarpAwareSelectionBorders(selection);
-    }, [pageId]);
+    }, []);
     const pageBoundsOptions = react.useMemo(
       () => ({ pageContentWidth: canvasWidth, pageContentHeight: canvasHeight }),
       [canvasWidth, canvasHeight]
@@ -11606,6 +11423,7 @@ const PageCanvas = react.forwardRef(
     const preserveSelectionAfterTransformIdRef = react.useRef(null);
     const groupSelectionTransformStartRef = react.useRef(null);
     const activeSelectionMoveStartRef = react.useRef(null);
+    const sectionGroupTransientImagesRef = react.useRef(null);
     setGroupOverlayLiveBoundsRef.current = setGroupOverlayLiveBounds;
     const {
       selectElements,
@@ -12451,6 +12269,7 @@ const PageCanvas = react.forwardRef(
       fabricCanvas.__fontCleanup = fontCleanup;
       fabricCanvas.__isUserTransforming = false;
       fabricCanvas.on("mouse:down", () => {
+        groupSelectionTransformStartRef.current = null;
         activeSelectionMoveStartRef.current = null;
         activeSelectionResizeHandleRef.current = null;
         const active = fabricCanvas.getActiveObject();
@@ -12461,7 +12280,6 @@ const PageCanvas = react.forwardRef(
             selectionLeft: rect.left,
             selectionTop: rect.top
           };
-          prepareGroupSelectionTransformStart(active);
         }
         if (fabricCanvas._currentTransform) {
           fabricCanvas.__isUserTransforming = true;
@@ -12523,8 +12341,101 @@ const PageCanvas = react.forwardRef(
           });
         }
       });
-      fabricCanvas.on("object:moving", () => {
+      const collectSectionGroupImageDescendantObjects = (groupNode) => {
+        const ids = getAllElementIds(groupNode.children ?? []);
+        if (ids.length === 0) return [];
+        const elementById = new Map(elementsRef.current.map((el) => [el.id, el]));
+        const out = [];
+        for (const id of ids) {
+          const el = elementById.get(id);
+          if (!el || el.type !== "image") continue;
+          const obj = fabricCanvas.getObjects().find((o) => getObjectId(o) === id);
+          if (obj) out.push(obj);
+        }
+        return out;
+      };
+      const ensureSectionGroupTransientSnapshot = (group) => {
+        var _a2;
+        if (!group || !(group instanceof fabric__namespace.Group)) return false;
+        if (!group.__docuforgeSectionGroup) return false;
+        const groupId = getObjectId(group);
+        if (!groupId) return false;
+        const existing = sectionGroupTransientImagesRef.current;
+        if (existing && existing.groupId === groupId && existing.group === group) return true;
+        const pageChildrenLocal = ((_a2 = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _a2.children) ?? [];
+        const node = findNodeById(pageChildrenLocal, groupId);
+        if (!node || !isGroup(node)) return false;
+        const images = collectSectionGroupImageDescendantObjects(node);
+        const gcx = group.left ?? 0;
+        const gcy = group.top ?? 0;
+        const gangle = group.angle ?? 0;
+        const gsx = group.scaleX ?? 1;
+        const gsy = group.scaleY ?? 1;
+        const rad = -gangle * Math.PI / 180;
+        const cos0 = Math.cos(rad);
+        const sin0 = Math.sin(rad);
+        const snap = images.map((obj) => {
+          const icx = obj.left ?? 0;
+          const icy = obj.top ?? 0;
+          const dx = icx - gcx;
+          const dy = icy - gcy;
+          const rx = dx * cos0 - dy * sin0;
+          const ry = dx * sin0 + dy * cos0;
+          return {
+            obj,
+            localX: gsx ? rx / gsx : rx,
+            localY: gsy ? ry / gsy : ry,
+            relAngle: (obj.angle ?? 0) - gangle,
+            relSx: (obj.scaleX ?? 1) / (gsx || 1),
+            relSy: (obj.scaleY ?? 1) / (gsy || 1)
+          };
+        });
+        sectionGroupTransientImagesRef.current = {
+          groupId,
+          group,
+          group0: { cx: gcx, cy: gcy, angle: gangle, sx: gsx, sy: gsy },
+          images: snap
+        };
+        return true;
+      };
+      const applySectionGroupTransientTransform = () => {
+        const snap = sectionGroupTransientImagesRef.current;
+        if (!snap || snap.images.length === 0) return;
+        const group = snap.group;
+        const gcx = group.left ?? 0;
+        const gcy = group.top ?? 0;
+        const gangle = group.angle ?? 0;
+        const gsx = group.scaleX ?? 1;
+        const gsy = group.scaleY ?? 1;
+        const rad = gangle * Math.PI / 180;
+        const cos = Math.cos(rad);
+        const sin = Math.sin(rad);
+        for (const entry of snap.images) {
+          const lx = entry.localX * gsx;
+          const ly = entry.localY * gsy;
+          const wx = lx * cos - ly * sin;
+          const wy = lx * sin + ly * cos;
+          entry.obj.set({
+            left: gcx + wx,
+            top: gcy + wy,
+            angle: entry.relAngle + gangle,
+            scaleX: entry.relSx * gsx,
+            scaleY: entry.relSy * gsy
+          });
+          entry.obj.setCoords();
+          entry.obj.dirty = true;
+        }
+      };
+      const clearSectionGroupTransientSnapshot = () => {
+        sectionGroupTransientImagesRef.current = null;
+      };
+      const maybeFollowSectionGroupTransient = (target) => {
+        if (!ensureSectionGroupTransientSnapshot(target)) return;
+        applySectionGroupTransientTransform();
+      };
+      fabricCanvas.on("object:moving", (e) => {
         var _a2, _b2;
+        maybeFollowSectionGroupTransient((e == null ? void 0 : e.target) ?? null);
         fabricCanvas.__isUserTransforming = true;
         didTransformRef.current = true;
         if (drilledGroupIdRef.current) {
@@ -12566,8 +12477,9 @@ const PageCanvas = react.forwardRef(
           });
         }
       });
-      fabricCanvas.on("object:rotating", () => {
+      fabricCanvas.on("object:rotating", (e) => {
         var _a2;
+        maybeFollowSectionGroupTransient((e == null ? void 0 : e.target) ?? null);
         fabricCanvas.__isUserTransforming = true;
         didTransformRef.current = true;
         if (drilledGroupIdRef.current) {
@@ -12577,6 +12489,12 @@ const PageCanvas = react.forwardRef(
           }
         }
       });
+      fabricCanvas.on("object:scaling", (e) => {
+        maybeFollowSectionGroupTransient((e == null ? void 0 : e.target) ?? null);
+      });
+      fabricCanvas.on("mouse:up", () => {
+        clearSectionGroupTransientSnapshot();
+      });
       const syncSelectionToStore = () => {
         var _a2, _b2, _c, _d;
         if (!isActiveRef.current || isRebuildingRef.current || isSyncingSelectionToFabricRef.current || !allowSelection) return;
@@ -12963,22 +12881,16 @@ const PageCanvas = react.forwardRef(
         const pageChildren2 = ((_b2 = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _b2.children) ?? [];
         const groupNode = findNodeById(pageChildren2, groupId);
         if (!groupNode) return;
-        const groupFrame = isGroup(groupNode) ? getGroupAbsoluteTransformFrame(groupNode, pageChildren2) : null;
-        const groupAbs = groupFrame ?? getAbsoluteBounds(groupNode, pageChildren2);
+        const groupAbs = getAbsoluteBounds(groupNode, pageChildren2);
         const rect = active.getBoundingRect();
-        const center = active.getCenterPoint();
         groupSelectionTransformStartRef.current = {
           groupId,
           selection: active,
           selectionLeft: rect.left,
           selectionTop: rect.top,
-          selectionCenterX: center.x,
-          selectionCenterY: center.y,
           groupLeft: groupAbs.left,
           groupTop: groupAbs.top,
-          groupWidth: groupAbs.width,
-          groupHeight: groupAbs.height,
-          selectionAngle: (((groupFrame == null ? void 0 : groupFrame.angle) ?? active.angle ?? 0) % 360 + 360) % 360
+          selectionAngle: ((active.angle ?? 0) % 360 + 360) % 360
         };
       };
       const restoreGroupSelectionVisualState = (selection, groupId) => {
@@ -13315,9 +13227,6 @@ const PageCanvas = react.forwardRef(
       fabricCanvas.on("mouse:down:before", (opt) => {
         var _a2, _b2, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m;
         const activeBeforeMouseDown = fabricCanvas.getActiveObject();
-        if (activeBeforeMouseDown instanceof fabric__namespace.ActiveSelection && activeBeforeMouseDown.__pixldocsGroupSelection) {
-          prepareGroupSelectionTransformStart(activeBeforeMouseDown);
-        }
         if (editLockRef.current) {
           const active = fabricCanvas.getActiveObject();
           if (active && (((_a2 = active._ct) == null ? void 0 : _a2.isCropGroup) || active.__cropGroup)) {
@@ -13417,7 +13326,6 @@ const PageCanvas = react.forwardRef(
               restoreGroupSelectionVisualState(selection, parent.id);
               fabricCanvas.setActiveObject(selection);
               selection.setCoords();
-              prepareGroupSelectionTransformStart(selection);
               fabricCanvas._target = selection;
               opt.target = selection;
               pendingGroupPromotionRef.current = { groupId: parent.id, selection };
@@ -13460,7 +13368,6 @@ const PageCanvas = react.forwardRef(
                   restoreGroupSelectionVisualState(selection, parent.id);
                   fabricCanvas.setActiveObject(selection);
                   selection.setCoords();
-                  prepareGroupSelectionTransformStart(selection);
                   fabricCanvas._target = selection;
                   opt.target = selection;
                   pendingGroupPromotionRef.current = { groupId: parent.id, selection };
@@ -13729,29 +13636,34 @@ const PageCanvas = react.forwardRef(
       });
       const markSimpleTransform = (e) => {
         if (!isActiveRef.current) return;
-        prepareGroupSelectionTransformStart(e.target);
         markTransforming(e.target);
       };
       const getObjectFrameBoundsInSelection = (selection, obj, frameWidth, frameHeight) => {
         const w = Math.max(1, frameWidth ?? obj.width ?? 1);
         const h = Math.max(1, frameHeight ?? obj.height ?? 1);
+        const originX = obj.originX ?? "left";
+        const originY = obj.originY ?? "top";
+        const localLeft = originX === "center" ? -w / 2 : originX === "right" ? -w : 0;
+        const localTop = originY === "center" ? -h / 2 : originY === "bottom" ? -h : 0;
         const matrix = fabric__namespace.util.multiplyTransformMatrices(
           selection.calcTransformMatrix(),
           obj.calcOwnMatrix()
         );
-        const decomposed = fabric__namespace.util.qrDecompose(matrix);
-        const scaledW = Math.max(1, w * Math.abs(decomposed.scaleX || 1));
-        const scaledH = Math.max(1, h * Math.abs(decomposed.scaleY || 1));
-        const angleRad = (decomposed.angle ?? 0) * Math.PI / 180;
-        const cos = Math.cos(angleRad);
-        const sin = Math.sin(angleRad);
-        const left = decomposed.translateX - scaledW / 2 * cos + scaledH / 2 * sin;
-        const top = decomposed.translateY - scaledW / 2 * sin - scaledH / 2 * cos;
+        const points = [
+          new fabric__namespace.Point(localLeft, localTop),
+          new fabric__namespace.Point(localLeft + w, localTop),
+          new fabric__namespace.Point(localLeft + w, localTop + h),
+          new fabric__namespace.Point(localLeft, localTop + h)
+        ].map((point) => fabric__namespace.util.transformPoint(point, matrix));
+        const xs = points.map((p) => p.x);
+        const ys = points.map((p) => p.y);
+        const left = Math.min(...xs);
+        const top = Math.min(...ys);
         return {
           left,
           top,
-          width: scaledW,
-          height: scaledH
+          width: Math.max(1, Math.max(...xs) - left),
+          height: Math.max(1, Math.max(...ys) - top)
         };
       };
       fabricCanvas.on("object:added", (e) => {
@@ -13766,30 +13678,10 @@ const PageCanvas = react.forwardRef(
       fabricCanvas.on("selection:cleared", () => {
       });
       fabricCanvas.on("object:scaling", (e) => {
-        var _a2, _b2, _c, _d, _e, _f, _g, _h;
+        var _a2, _b2, _c, _d, _e, _f;
         if (!isActiveRef.current) return;
         const t = e.target;
         if (t) lastResizeScaleTargetRef.current = t;
-        try {
-          const transformDbg = e.transform;
-          const cornerDbg = (transformDbg == null ? void 0 : transformDbg.corner) || "";
-          const children = t instanceof fabric__namespace.Group || t instanceof fabric__namespace.ActiveSelection ? t.getObjects() : [];
-          logGroupImageResizeDebug("scaling-entry", {
-            time: Math.round(performance.now()),
-            corner: cornerDbg,
-            targetType: t == null ? void 0 : t.type,
-            targetCtor: (_a2 = t == null ? void 0 : t.constructor) == null ? void 0 : _a2.name,
-            isActiveSelection: t instanceof fabric__namespace.ActiveSelection,
-            isGroup: t instanceof fabric__namespace.Group,
-            isCropGroup: !!(t && (t.__cropGroup || ((_b2 = t._ct) == null ? void 0 : _b2.isCropGroup))),
-            childCount: children.length,
-            childTypes: children.map((c) => c == null ? void 0 : c.type),
-            hasImageChild: children.some((c) => isGroupResizeImageLikeObject(c)),
-            target: t ? summarizeFabricObjectForResizeDebug(t) : null
-          });
-        } catch (err) {
-          console.warn("[Pixldocs][group-image-side-resize] scaling-entry log failed", err);
-        }
         prepareGroupSelectionTransformStart(t);
         markTransforming(t);
         didTransformRef.current = true;
@@ -13953,7 +13845,7 @@ const PageCanvas = react.forwardRef(
               time: Math.round(performance.now()),
               corner,
               groupSelectionId: obj.__pixldocsGroupSelection,
-              currentTransformAction: (_c = fabricCanvas._currentTransform) == null ? void 0 : _c.action,
+              currentTransformAction: (_a2 = fabricCanvas._currentTransform) == null ? void 0 : _a2.action,
               selection: summarizeFabricObjectForResizeDebug(obj),
               textChildren: obj.getObjects().filter((child) => child instanceof fabric__namespace.Textbox).map((child) => summarizeFabricObjectForResizeDebug(child))
             };
@@ -13963,43 +13855,19 @@ const PageCanvas = react.forwardRef(
           const isXSide = corner === "ml" || corner === "mr";
           const sAxis = isXSide ? Math.abs(obj.scaleX ?? 1) : Math.abs(obj.scaleY ?? 1);
           if (sAxis > 1e-3) {
-            const hasRotatedChild = obj.getObjects().some((c) => {
-              const a = ((c.angle ?? 0) % 180 + 180) % 180;
-              return !(a < 0.5 || a > 179.5);
-            });
-            const selectionAngle = ((obj.angle ?? 0) % 180 + 180) % 180;
-            const isSelectionRotated = !(selectionAngle < 0.5 || selectionAngle > 179.5);
-            const shouldPinNonTextChildren = hasRotatedChild || isSelectionRotated;
-            const shouldDebugGroupImageResize = obj.getObjects().some((child) => isGroupResizeImageLikeObject(child));
-            if (shouldDebugGroupImageResize) {
-              logGroupImageResizeDebug("live-start", {
-                time: Math.round(performance.now()),
-                corner,
-                isXSide,
-                sAxis,
-                hasRotatedChild,
-                isSelectionRotated,
-                shouldPinNonTextChildren,
-                groupSelectionId: obj.__pixldocsGroupSelection,
-                selection: summarizeFabricObjectForResizeDebug(obj),
-                children: obj.getObjects().map((child) => summarizeFabricObjectForResizeDebug(child))
-              });
-            }
-            if ((isXSide || shouldPinNonTextChildren) && ((_d = groupShiftReflowSnapshotRef.current) == null ? void 0 : _d.selection) !== obj) {
+            if (isXSide && ((_b2 = groupShiftReflowSnapshotRef.current) == null ? void 0 : _b2.selection) !== obj) {
               groupShiftReflowSnapshotRef.current = null;
               const logicalGroupId = obj.__pixldocsGroupSelection;
               if (logicalGroupId) {
                 try {
                   const state = useEditorStore.getState();
-                  const pageChildren2 = ((_e = state.canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _e.children) ?? [];
+                  const pageChildren2 = ((_c = state.canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _c.children) ?? [];
                   const groupNode = findNodeById(pageChildren2, logicalGroupId);
                   if (groupNode && isGroup(groupNode) && !isStackLayoutMode(groupNode.layoutMode)) {
                     const entries = obj.getObjects().map((c) => ({
                       obj: c,
                       id: getObjectId(c) ?? "",
-                      left0: c.left ?? 0,
                       top0: c.top ?? 0,
-                      width0: (c.width ?? 0) * Math.abs(c.scaleX ?? 1),
                       height0: (c.height ?? 0) * Math.abs(c.scaleY ?? 1)
                     })).filter((e2) => e2.id).sort((a, b) => a.top0 - b.top0);
                     if (entries.length > 1) {
@@ -14022,150 +13890,78 @@ const PageCanvas = react.forwardRef(
             const asTop0 = obj.top ?? 0;
             const asRect0 = obj.getBoundingRect();
             let didReflowTextChild = false;
-            if (hasRotatedChild) {
-              if (isXSide) {
-                obj._set("width", asW0 * sAxis);
-                obj._set("scaleX", 1);
-              } else {
-                obj._set("height", asH0 * sAxis);
-                obj._set("scaleY", 1);
-              }
-            }
-            const childCounterScale = hasRotatedChild ? 1 : 1 / sAxis;
-            let restoredNonTextAfterLayout = false;
-            const restoreNonTextChildren = (pins) => {
-              var _a3, _b3;
-              if (!shouldPinNonTextChildren || ((_a3 = groupShiftReflowSnapshotRef.current) == null ? void 0 : _a3.selection) !== obj) return;
-              for (const entry of groupShiftReflowSnapshotRef.current.children) {
-                const child = entry.obj;
-                if (child instanceof fabric__namespace.Textbox) continue;
-                if (child instanceof fabric__namespace.FabricImage || child instanceof fabric__namespace.Group && (child.__cropGroup || ((_b3 = child._ct) == null ? void 0 : _b3.isCropGroup))) {
-                  const pin = pins == null ? void 0 : pins.get(child);
-                  let targetLeft = hasRotatedChild && isXSide ? entry.left0 * sAxis : entry.left0;
-                  let targetTop = hasRotatedChild && !isXSide ? entry.top0 * sAxis : entry.top0;
-                  if (pin == null ? void 0 : pin.worldCenter) {
-                    try {
-                      const invSelectionMatrix = fabric__namespace.util.invertTransform(obj.calcTransformMatrix());
-                      const localCenter = fabric__namespace.util.transformPoint(pin.worldCenter, invSelectionMatrix);
-                      targetLeft = localCenter.x;
-                      targetTop = localCenter.y;
-                    } catch {
-                      targetLeft = pin.left ?? targetLeft;
-                      targetTop = pin.top ?? targetTop;
-                    }
-                  } else {
-                    targetLeft = (pin == null ? void 0 : pin.left) ?? targetLeft;
-                    targetTop = (pin == null ? void 0 : pin.top) ?? targetTop;
-                  }
-                  const beforeRestore = shouldDebugGroupImageResize ? summarizeFabricObjectForResizeDebug(child) : null;
-                  if (Math.abs((child.left ?? 0) - targetLeft) > 0.01) child._set("left", targetLeft);
-                  if (Math.abs((child.top ?? 0) - targetTop) > 0.01) child._set("top", targetTop);
-                  if (isXSide) child._set("scaleX", childCounterScale);
-                  else child._set("scaleY", childCounterScale);
-                  child.setCoords();
-                  child.dirty = true;
-                  if (shouldDebugGroupImageResize) {
-                    logGroupImageResizeDebug("restore-non-text", {
-                      time: Math.round(performance.now()),
-                      corner,
-                      childId: getObjectId(child),
-                      targetLeft,
-                      targetTop,
-                      pin,
-                      before: beforeRestore,
-                      after: summarizeFabricObjectForResizeDebug(child)
-                    });
-                  }
-                }
-              }
-            };
-            const projectRotatedTextPosition = (child) => {
-              var _a3;
-              if (!hasRotatedChild || ((_a3 = groupShiftReflowSnapshotRef.current) == null ? void 0 : _a3.selection) !== obj) return;
-              const entry = groupShiftReflowSnapshotRef.current.children.find((candidate) => candidate.obj === child);
-              if (!entry) return;
-              if (isXSide) child._set("left", entry.left0 * sAxis);
-              else child._set("top", entry.top0 * sAxis);
-            };
             for (const child of obj.getObjects()) {
-              if (child instanceof fabric__namespace.Group && (child.__cropGroup || ((_f = child._ct) == null ? void 0 : _f.isCropGroup))) {
-                const beforeImageChildResize = shouldDebugGroupImageResize ? summarizeFabricObjectForResizeDebug(child) : null;
+              if (child instanceof fabric__namespace.Group && (child.__cropGroup || ((_d = child._ct) == null ? void 0 : _d.isCropGroup))) {
                 const ct = child.__cropData;
-                if (ct) {
+                if (!ct) continue;
+                if (isXSide) {
                   if (child.__asLiveOrigW == null) {
-                    child.__asLiveOrigW = ct.frameW ?? child.width ?? 1;
-                  }
-                  if (child.__asLiveOrigH == null) {
-                    child.__asLiveOrigH = ct.frameH ?? child.height ?? 1;
+                    const baseW = child.width ?? ct.frameW ?? 0;
+                    child.__asLiveOrigW = baseW * (child.scaleX ?? 1);
                   }
-                  if (isXSide) {
-                    const newW = Math.max(1, Number(child.__asLiveOrigW) * sAxis);
+                  const origW = child.__asLiveOrigW;
+                  const newW = Math.max(20, origW * sAxis);
+                  if (Math.abs((child.width ?? 0) - newW) > 0.5) {
                     ct.frameW = newW;
                     child._set("width", newW);
-                  } else {
-                    const newH = Math.max(1, Number(child.__asLiveOrigH) * sAxis);
+                    child._set("scaleX", 1 / sAxis);
+                    try {
+                      updateCoverLayout(child);
+                    } catch {
+                    }
+                    child.setCoords();
+                    child.dirty = true;
+                  }
+                } else {
+                  if (child.__asLiveOrigH == null) {
+                    const baseH = child.height ?? ct.frameH ?? 0;
+                    child.__asLiveOrigH = baseH * (child.scaleY ?? 1);
+                  }
+                  const origH = child.__asLiveOrigH;
+                  const newH = Math.max(20, origH * sAxis);
+                  if (Math.abs((child.height ?? 0) - newH) > 0.5) {
                     ct.frameH = newH;
                     child._set("height", newH);
+                    child._set("scaleY", 1 / sAxis);
+                    try {
+                      updateCoverLayout(child);
+                    } catch {
+                    }
+                    child.setCoords();
+                    child.dirty = true;
                   }
-                  try {
-                    updateCoverLayout(child);
-                  } catch {
-                  }
-                }
-                if (isXSide) child._set("scaleX", childCounterScale);
-                else child._set("scaleY", childCounterScale);
-                child.setCoords();
-                child.dirty = true;
-                if (shouldDebugGroupImageResize) {
-                  logGroupImageResizeDebug("live-crop-child-resized", {
-                    time: Math.round(performance.now()),
-                    corner,
-                    sAxis,
-                    childCounterScale,
-                    before: beforeImageChildResize,
-                    after: summarizeFabricObjectForResizeDebug(child),
-                    cropData: ct ? { frameW: ct.frameW, frameH: ct.frameH } : null
-                  });
                 }
-                didReflowTextChild = true;
                 continue;
               }
               if (child instanceof fabric__namespace.FabricImage && !child.__cropGroup && !child.smartElementType) {
-                const beforeImageChildResize = shouldDebugGroupImageResize ? summarizeFabricObjectForResizeDebug(child) : null;
                 if (isXSide) {
                   if (child.__asLiveOrigW == null) {
-                    child.__asLiveOrigW = (child.width ?? 0) * Math.abs(child.scaleX ?? 1);
+                    child.__asLiveOrigW = (child.width ?? 0) * (child.scaleX ?? 1);
+                  }
+                  const origW = child.__asLiveOrigW;
+                  const newW = Math.max(1, origW * sAxis);
+                  if (Math.abs((child.width ?? 0) - newW) > 0.5) {
+                    child._set("width", newW);
+                    child._set("scaleX", 1 / sAxis);
+                    child.setCoords();
+                    child.dirty = true;
                   }
-                  const newW = Math.max(1, Number(child.__asLiveOrigW) * sAxis);
-                  child._set("width", newW);
                 } else {
                   if (child.__asLiveOrigH == null) {
-                    child.__asLiveOrigH = (child.height ?? 0) * Math.abs(child.scaleY ?? 1);
+                    child.__asLiveOrigH = (child.height ?? 0) * (child.scaleY ?? 1);
+                  }
+                  const origH = child.__asLiveOrigH;
+                  const newH = Math.max(1, origH * sAxis);
+                  if (Math.abs((child.height ?? 0) - newH) > 0.5) {
+                    child._set("height", newH);
+                    child._set("scaleY", 1 / sAxis);
+                    child.setCoords();
+                    child.dirty = true;
                   }
-                  const newH = Math.max(1, Number(child.__asLiveOrigH) * sAxis);
-                  child._set("height", newH);
-                }
-                if (isXSide) child._set("scaleX", childCounterScale);
-                else child._set("scaleY", childCounterScale);
-                child.setCoords();
-                child.dirty = true;
-                if (shouldDebugGroupImageResize) {
-                  logGroupImageResizeDebug("live-image-child-resized", {
-                    time: Math.round(performance.now()),
-                    corner,
-                    sAxis,
-                    childCounterScale,
-                    liveOrigW: child.__asLiveOrigW,
-                    liveOrigH: child.__asLiveOrigH,
-                    before: beforeImageChildResize,
-                    after: summarizeFabricObjectForResizeDebug(child)
-                  });
                 }
-                didReflowTextChild = true;
                 continue;
               }
               if (!(child instanceof fabric__namespace.Textbox)) continue;
-              projectRotatedTextPosition(child);
               if (isXSide) {
                 if (child.__asLiveOrigW == null) {
                   child.__asLiveOrigW = (child.width ?? 0) * (child.scaleX ?? 1);
@@ -14174,7 +13970,7 @@ const PageCanvas = react.forwardRef(
                 const newW = Math.max(20, origW * sAxis);
                 if (Math.abs((child.width ?? 0) - newW) > 0.5) {
                   child._set("width", newW);
-                  child._set("scaleX", childCounterScale);
+                  child._set("scaleX", 1 / sAxis);
                   try {
                     child.initDimensions();
                   } catch {
@@ -14187,14 +13983,10 @@ const PageCanvas = react.forwardRef(
                 if (child.__asLiveOrigH == null) {
                   child.__asLiveOrigH = (child.height ?? 0) * (child.scaleY ?? 1);
                 }
-                if (child.__asLiveOrigMinH == null) {
-                  const m = Number(child.minBoxHeight);
-                  if (Number.isFinite(m) && m > 0) child.__asLiveOrigMinH = m;
-                }
                 const origH = child.__asLiveOrigH;
                 const newH = Math.max(20, origH * sAxis);
                 child.minBoxHeight = newH;
-                child._set("scaleY", childCounterScale);
+                child._set("scaleY", 1 / sAxis);
                 try {
                   child.initDimensions();
                 } catch {
@@ -14204,7 +13996,7 @@ const PageCanvas = react.forwardRef(
                 didReflowTextChild = true;
               }
             }
-            if (isXSide && !shouldPinNonTextChildren && ((_g = groupShiftReflowSnapshotRef.current) == null ? void 0 : _g.selection) === obj) {
+            if (isXSide && ((_e = groupShiftReflowSnapshotRef.current) == null ? void 0 : _e.selection) === obj) {
               const snap = groupShiftReflowSnapshotRef.current;
               const anchorEntry = snap.children[0];
               const anchorTopLive = anchorEntry.obj.top ?? 0;
@@ -14237,26 +14029,10 @@ const PageCanvas = react.forwardRef(
               if (cornersBefore) {
                 fixedMidBefore = corner === "ml" ? { x: (cornersBefore.tr.x + cornersBefore.br.x) / 2, y: (cornersBefore.tr.y + cornersBefore.br.y) / 2 } : { x: (cornersBefore.tl.x + cornersBefore.bl.x) / 2, y: (cornersBefore.tl.y + cornersBefore.bl.y) / 2 };
               }
-              const nonTextPinsBeforeLayout = shouldPinNonTextChildren ? new Map(obj.getObjects().map((child) => [child, {
-                left: child.left ?? 0,
-                top: child.top ?? 0,
-                worldCenter: child instanceof fabric__namespace.Textbox ? void 0 : child.getCenterPoint()
-              }])) : void 0;
               try {
                 obj.triggerLayout();
               } catch {
               }
-              restoreNonTextChildren(nonTextPinsBeforeLayout);
-              restoredNonTextAfterLayout = !!nonTextPinsBeforeLayout;
-              if (shouldDebugGroupImageResize) {
-                logGroupImageResizeDebug("after-trigger-layout", {
-                  time: Math.round(performance.now()),
-                  corner,
-                  selection: summarizeFabricObjectForResizeDebug(obj),
-                  nonTextPinsBeforeLayout,
-                  children: obj.getObjects().map((child) => summarizeFabricObjectForResizeDebug(child))
-                });
-              }
               obj._set("width", asW0);
               obj._set("scaleX", asSx0);
               obj._set("scaleY", asSy0);
@@ -14282,19 +14058,9 @@ const PageCanvas = react.forwardRef(
               obj._set("left", asLeft0);
               obj._set("top", asTop0);
             }
-            if (!restoredNonTextAfterLayout) restoreNonTextChildren();
             obj._set("width", asW0);
             obj._set("scaleX", asSx0);
             obj._set("scaleY", asSy0);
-            if (hasRotatedChild) {
-              if (isXSide) {
-                obj._set("width", asW0 * sAxis);
-                obj._set("scaleX", 1);
-              } else {
-                obj._set("height", asH0 * sAxis);
-                obj._set("scaleY", 1);
-              }
-            }
             obj.setCoords();
             obj.dirty = true;
           }
@@ -14386,7 +14152,7 @@ const PageCanvas = react.forwardRef(
         setGuides(gridGuidesForScale.length ? [...scaleGuides, ...gridGuidesForScale] : scaleGuides);
         if (drilledGroupIdRef.current) {
           try {
-            (_h = fabricCanvas.__updateDrilledGroupOutline) == null ? void 0 : _h.call(fabricCanvas);
+            (_f = fabricCanvas.__updateDrilledGroupOutline) == null ? void 0 : _f.call(fabricCanvas);
           } catch {
           }
         }
@@ -14477,37 +14243,9 @@ const PageCanvas = react.forwardRef(
         }
       });
       fabricCanvas.on("object:rotating", (e) => {
-        var _a2, _b2;
-        prepareGroupSelectionTransformStart(e.target);
         markSimpleTransform(e);
         didTransformRef.current = true;
         const tr = e.target;
-        try {
-          const children = tr instanceof fabric__namespace.Group || tr instanceof fabric__namespace.ActiveSelection ? tr.getObjects() : [];
-          logGroupImageResizeDebug("rotating-entry", {
-            time: Math.round(performance.now()),
-            angle: tr == null ? void 0 : tr.angle,
-            targetType: tr == null ? void 0 : tr.type,
-            targetCtor: (_a2 = tr == null ? void 0 : tr.constructor) == null ? void 0 : _a2.name,
-            isActiveSelection: tr instanceof fabric__namespace.ActiveSelection,
-            isGroup: tr instanceof fabric__namespace.Group,
-            isCropGroup: !!(tr && (tr.__cropGroup || ((_b2 = tr._ct) == null ? void 0 : _b2.isCropGroup))),
-            childCount: children.length,
-            childTypes: children.map((c) => c == null ? void 0 : c.type),
-            hasImageChild: children.some((c) => isGroupResizeImageLikeObject(c)),
-            target: tr ? summarizeFabricObjectForResizeDebug(tr) : null,
-            children: children.map((c) => {
-              var _a3;
-              return {
-                type: c == null ? void 0 : c.type,
-                ctor: (_a3 = c == null ? void 0 : c.constructor) == null ? void 0 : _a3.name,
-                summary: summarizeFabricObjectForResizeDebug(c)
-              };
-            })
-          });
-        } catch (err) {
-          console.warn("[Pixldocs][group-image-side-resize] rotating-entry log failed", err);
-        }
         try {
           const getCursor = fabricCanvas.__pixldocsGetRotateCursor;
           const upper = fabricCanvas.upperCanvasEl;
@@ -14550,7 +14288,7 @@ const PageCanvas = react.forwardRef(
           setDrilledGroupBounds(null);
           drilledGroupIdRef.current = null;
           if (activeDuringMove instanceof fabric__namespace.ActiveSelection && groupIdToKeep) {
-            preserveLogicalGroupTagDuringMove(activeDuringMove, groupIdToKeep);
+            restoreGroupSelectionVisualState(activeDuringMove, groupIdToKeep);
           }
         }
         if (e.target) e.target.__pixldocsDragMoved = true;
@@ -14603,7 +14341,7 @@ const PageCanvas = react.forwardRef(
       });
       let cropGroupSaveTimer = null;
       fabricCanvas.on("object:modified", (e) => {
-        var _a2, _b2, _c, _d, _e, _f, _g, _h, _i, _j, _k;
+        var _a2, _b2, _c, _d, _e, _f, _g, _h, _i;
         try {
           dragStarted = false;
           setGuides([]);
@@ -14612,43 +14350,18 @@ const PageCanvas = react.forwardRef(
           groupResizeActiveSnapRef.current = null;
           onDragEnd == null ? void 0 : onDragEnd();
           try {
-            const mt = e.target;
-            const children = mt instanceof fabric__namespace.Group || mt instanceof fabric__namespace.ActiveSelection ? mt.getObjects() : [];
-            logGroupImageResizeDebug("modified-entry", {
-              time: Math.round(performance.now()),
-              didTransform: didTransformRef.current,
-              targetType: mt == null ? void 0 : mt.type,
-              targetCtor: (_a2 = mt == null ? void 0 : mt.constructor) == null ? void 0 : _a2.name,
-              isActiveSelection: mt instanceof fabric__namespace.ActiveSelection,
-              isGroup: mt instanceof fabric__namespace.Group,
-              angle: mt == null ? void 0 : mt.angle,
-              childCount: children.length,
-              childTypes: children.map((c) => c == null ? void 0 : c.type),
-              hasImageChild: children.some((c) => isGroupResizeImageLikeObject(c)),
-              target: mt ? summarizeFabricObjectForResizeDebug(mt) : null,
-              children: children.map((c) => {
-                var _a3;
-                return {
-                  type: c == null ? void 0 : c.type,
-                  ctor: (_a3 = c == null ? void 0 : c.constructor) == null ? void 0 : _a3.name,
-                  summary: summarizeFabricObjectForResizeDebug(c)
-                };
-              })
-            });
-          } catch (err) {
-            console.warn("[Pixldocs][group-image-side-resize] modified-entry log failed", err);
-          }
-          const modifiedTarget = e.target;
-          if (modifiedTarget instanceof fabric__namespace.ActiveSelection && modifiedTarget.getObjects().length === 0) {
-            didTransformRef.current = false;
-            groupSelectionTransformStartRef.current = null;
-            activeSelectionMoveStartRef.current = null;
-            activeSelectionResizeHandleRef.current = null;
-            unlockEditsSoon();
-            return;
+            const t = e.target;
+            if (t instanceof fabric__namespace.ActiveSelection) {
+              for (const child of t.getObjects()) {
+                delete child.__asLiveOrigW;
+                delete child.__asLiveOrigH;
+              }
+            }
+          } catch {
           }
           groupShiftReflowSnapshotRef.current = null;
           lockEdits();
+          const modifiedTarget = e.target;
           const modifiedTargetId = modifiedTarget ? getObjectId(modifiedTarget) : null;
           const modifiedTargetElement = modifiedTargetId ? elementsRef.current.find((el) => el.id === modifiedTargetId) : null;
           if (modifiedTarget && (modifiedTargetElement == null ? void 0 : modifiedTargetElement.type) === "shape") {
@@ -14673,7 +14386,7 @@ const PageCanvas = react.forwardRef(
           const active = fabricCanvas.getActiveObject();
           const activeId = active ? getObjectId(active) : null;
           if (active && activeId && activeId !== "__background__" && !(active instanceof fabric__namespace.Group)) {
-            const pageChildrenForParent = ((_b2 = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _b2.children) ?? [];
+            const pageChildrenForParent = ((_a2 = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _a2.children) ?? [];
             const parentGroup = findParentGroup(pageChildrenForParent, activeId);
             if (parentGroup && isGroup(parentGroup) && parentGroup.backgroundColor) {
               let fabricSectionGroup = active.group && active.group instanceof fabric__namespace.Group ? active.group : null;
@@ -14755,7 +14468,7 @@ const PageCanvas = react.forwardRef(
                   useEditorStore.getState().reflowStackGroupInPage(pageId, groupId);
                 }
                 const stateAfter = useEditorStore.getState();
-                const pageAfter = ((_c = stateAfter.canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _c.children) ?? [];
+                const pageAfter = ((_b2 = stateAfter.canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _b2.children) ?? [];
                 const groupNodeAfter = findNodeById(pageAfter, groupId);
                 if (groupNodeAfter) {
                   const abs = getAbsoluteBounds(groupNodeAfter, pageAfter);
@@ -14791,9 +14504,8 @@ const PageCanvas = react.forwardRef(
                   const stateCrop = useEditorStore.getState();
                   const pageCrop = stateCrop.canvas.pages.find((p) => p.id === pageId);
                   const pageChildrenCrop = (pageCrop == null ? void 0 : pageCrop.children) ?? [];
-                  const angleRad = (active.angle ?? 0) * Math.PI / 180;
-                  const absLeft = (active.left ?? 0) - ct.frameW / 2 * Math.cos(angleRad) + ct.frameH / 2 * Math.sin(angleRad);
-                  const absTop = (active.top ?? 0) - ct.frameW / 2 * Math.sin(angleRad) - ct.frameH / 2 * Math.cos(angleRad);
+                  const absLeft = (active.left ?? 0) - ct.frameW / 2;
+                  const absTop = (active.top ?? 0) - ct.frameH / 2;
                   const storePosCrop = absoluteToStorePosition(absLeft, absTop, objId, pageChildrenCrop);
                   updateElement2(objId, {
                     width: ct.frameW,
@@ -14818,7 +14530,7 @@ const PageCanvas = react.forwardRef(
           }
           if (active && active instanceof fabric__namespace.Group && active.__docuforgeSectionGroup && getObjectId(active)) {
             const groupId = getObjectId(active);
-            const pageChildrenSec = ((_d = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _d.children) ?? [];
+            const pageChildrenSec = ((_c = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _c.children) ?? [];
             const modifiedTarget2 = e == null ? void 0 : e.target;
             const resizeScaleTarget = lastResizeScaleTargetRef.current;
             lastResizeScaleTargetRef.current = null;
@@ -14849,7 +14561,7 @@ const PageCanvas = react.forwardRef(
             const node = findNodeById(pageChildrenSec, groupId);
             if (isChildModified && node && !groupMoved) {
               const stateAfter = useEditorStore.getState();
-              const pageAfter = ((_e = stateAfter.canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _e.children) ?? [];
+              const pageAfter = ((_d = stateAfter.canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _d.children) ?? [];
               const groupNodeAfter = findNodeById(pageAfter, groupId);
               if (groupNodeAfter) {
                 const abs = getAbsoluteBounds(groupNodeAfter, pageAfter);
@@ -14865,7 +14577,7 @@ const PageCanvas = react.forwardRef(
           }
           if (active && active instanceof fabric__namespace.Group && !(active instanceof fabric__namespace.ActiveSelection) && getObjectId(active)) {
             const groupId = getObjectId(active);
-            const pageChildren3 = ((_f = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _f.children) ?? [];
+            const pageChildren3 = ((_e = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _e.children) ?? [];
             const w = (active.width ?? 0) * (active.scaleX ?? 1);
             const h = (active.height ?? 0) * (active.scaleY ?? 1);
             const centerX = active.left ?? 0;
@@ -14887,7 +14599,7 @@ const PageCanvas = react.forwardRef(
           }
           const activeObj = fabricCanvas.getActiveObject();
           let activeObjects = fabricCanvas.getActiveObjects();
-          const activeSelectionMoveStart = activeObj instanceof fabric__namespace.ActiveSelection && ((_g = activeSelectionMoveStartRef.current) == null ? void 0 : _g.selection) === activeObj ? activeSelectionMoveStartRef.current : null;
+          const activeSelectionMoveStart = activeObj instanceof fabric__namespace.ActiveSelection && ((_f = activeSelectionMoveStartRef.current) == null ? void 0 : _f.selection) === activeObj ? activeSelectionMoveStartRef.current : null;
           const activeSelectionDelta = activeObj instanceof fabric__namespace.ActiveSelection && activeSelectionMoveStart ? (() => {
             const rect = activeObj.getBoundingRect();
             return {
@@ -14904,18 +14616,6 @@ const PageCanvas = react.forwardRef(
           const isActiveSelection = activeObj instanceof fabric__namespace.ActiveSelection || activeObjects.length > 1;
           const activeSelectionResizeHandle = isActiveSelection ? activeSelectionResizeHandleRef.current : null;
           const debugGroupTextCornerResize = activeObj instanceof fabric__namespace.ActiveSelection && isCornerResizeHandle(activeSelectionResizeHandle) && activeObjects.some((candidate) => candidate instanceof fabric__namespace.Textbox);
-          const debugGroupImageSideResize = activeObj instanceof fabric__namespace.ActiveSelection && (activeSelectionResizeHandle === "ml" || activeSelectionResizeHandle === "mr" || activeSelectionResizeHandle === "mt" || activeSelectionResizeHandle === "mb") && activeObjects.some((candidate) => isGroupResizeImageLikeObject(candidate));
-          if (debugGroupImageSideResize) {
-            logGroupImageResizeDebug("modified-start", {
-              time: Math.round(performance.now()),
-              handle: activeSelectionResizeHandle,
-              target: summarizeFabricObjectForResizeDebug(modifiedTarget),
-              selection: summarizeFabricObjectForResizeDebug(activeObj),
-              activeObjectIds: activeObjects.map((candidate) => getObjectId(candidate)),
-              selectedStoreIds: useEditorStore.getState().canvas.selectedIds,
-              members: activeObjects.map((candidate) => summarizeFabricObjectForResizeDebug(candidate))
-            });
-          }
           if (debugGroupTextCornerResize) {
             logGroupTextResizeDebug("modified-start", {
               time: Math.round(performance.now()),
@@ -14948,14 +14648,7 @@ const PageCanvas = react.forwardRef(
             const node = findNodeById(pageChildren2, id);
             return !!(node && isGroup(node));
           });
-          const activeSelectionHadTransform = activeObj instanceof fabric__namespace.ActiveSelection && (Math.abs((activeObj.scaleX ?? 1) - 1) > 0.01 || Math.abs((activeObj.scaleY ?? 1) - 1) > 0.01 || (() => {
-            var _a3;
-            const normAngle = (angle) => (angle % 360 + 360) % 360;
-            const startAngle = ((_a3 = groupSelectionTransformStartRef.current) == null ? void 0 : _a3.selection) === activeObj ? groupSelectionTransformStartRef.current.selectionAngle : 0;
-            const currentAngle = normAngle(activeObj.angle ?? 0);
-            const diff = Math.abs(currentAngle - normAngle(startAngle));
-            return Math.min(diff, 360 - diff) > 1;
-          })());
+          const activeSelectionHadTransform = activeObj instanceof fabric__namespace.ActiveSelection && (Math.abs((activeObj.scaleX ?? 1) - 1) > 0.01 || Math.abs((activeObj.scaleY ?? 1) - 1) > 0.01 || Math.abs((activeObj.angle ?? 0) % 360) > 0.01);
           if (!anyCropGroup && activeSelectionDelta && !activeSelectionHadTransform && selectedLogicalGroupIds.length > 0) {
             const selectedStoreIds = useEditorStore.getState().canvas.selectedIds ?? [];
             const groupMemberIds = /* @__PURE__ */ new Set();
@@ -14996,13 +14689,7 @@ const PageCanvas = react.forwardRef(
               return;
             }
           }
-          const isActiveSelectionSideResize = isActiveSelection && (activeSelectionResizeHandle === "ml" || activeSelectionResizeHandle === "mr" || activeSelectionResizeHandle === "mt" || activeSelectionResizeHandle === "mb");
-          const normalizeAngle = (angle) => (angle % 360 + 360) % 360;
-          const shortestAngleDelta = (a, b) => {
-            const diff = Math.abs(normalizeAngle(a) - normalizeAngle(b));
-            return Math.min(diff, 360 - diff);
-          };
-          if (selectedElementIds.length > 0) {
+          if (selectedElementIds.length > 0 && !anyCropGroup) {
             const firstObj = activeObjects[0];
             const firstId = getObjectId(firstObj);
             const parentGroups = selectedElementIds.map((id) => findParentGroup(pageChildren2, id)).filter((g) => g !== null);
@@ -15025,9 +14712,9 @@ const PageCanvas = react.forwardRef(
               let movedGroupLeft = groupAbs.left;
               let movedGroupTop = groupAbs.top;
               if (activeObj instanceof fabric__namespace.ActiveSelection && (transformStart == null ? void 0 : transformStart.groupId) === groupToMove.id) {
-                const selectionCenter = activeObj.getCenterPoint();
-                movedGroupLeft = transformStart.groupLeft + (selectionCenter.x - transformStart.selectionCenterX);
-                movedGroupTop = transformStart.groupTop + (selectionCenter.y - transformStart.selectionCenterY);
+                const selectionRect = activeObj.getBoundingRect();
+                movedGroupLeft = transformStart.groupLeft + (selectionRect.left - transformStart.selectionLeft);
+                movedGroupTop = transformStart.groupTop + (selectionRect.top - transformStart.selectionTop);
               } else if (activeObj instanceof fabric__namespace.ActiveSelection && firstId && firstObj) {
                 const firstNode = findNodeById(pageChildren2, firstId);
                 if (firstNode) {
@@ -15063,58 +14750,19 @@ const PageCanvas = react.forwardRef(
               }
               const deltaX = movedGroupLeft - groupAbs.left;
               const deltaY = movedGroupTop - groupAbs.top;
-              const hadResizeHandle = isActiveSelection && !!activeSelectionResizeHandle;
-              const hadScale = isActiveSelection && activeObj && (hadResizeHandle || Math.abs((activeObj.scaleX ?? 1) - 1) > 0.01 || Math.abs((activeObj.scaleY ?? 1) - 1) > 0.01);
-              const startSelAngle = normalizeAngle((transformStart == null ? void 0 : transformStart.selectionAngle) ?? 0);
-              const currentSelAngle = isActiveSelection && activeObj ? normalizeAngle(activeObj.angle ?? 0) : 0;
-              const storedGroupAngle = normalizeAngle(Number(groupToMove.angle ?? 0));
-              const effectiveStartAngle = transformStart ? startSelAngle : storedGroupAngle;
-              const angleDelta = shortestAngleDelta(currentSelAngle, effectiveStartAngle);
-              const hadRotation = isActiveSelection && activeObj && angleDelta > 1;
-              if (activeGroupSelectionId === groupToMove.id && hadRotation && !hadScale && !activeSelectionResizeHandle && activeObj instanceof fabric__namespace.ActiveSelection) {
-                const { updateNode: updateNodeStore, commitHistory: commitHistoryStore, getCurrentElements } = useEditorStore.getState();
-                const center = activeObj.getCenterPoint();
-                const baseCenterX = (transformStart == null ? void 0 : transformStart.selectionCenterX) ?? groupAbs.left + groupAbs.width / 2;
-                const baseCenterY = (transformStart == null ? void 0 : transformStart.selectionCenterY) ?? groupAbs.top + groupAbs.height / 2;
-                const nextAbsLeft = groupAbs.left + (center.x - baseCenterX);
-                const nextAbsTop = groupAbs.top + (center.y - baseCenterY);
-                const storePos = absoluteToStorePosition(nextAbsLeft, nextAbsTop, groupToMove.id, pageChildren2);
-                updateNodeStore(groupToMove.id, {
-                  left: storePos.left,
-                  top: storePos.top,
-                  angle: currentSelAngle
-                }, { recordHistory: false, skipLayoutRecalc: true });
-                commitHistoryStore();
-                restoreGroupSelectionVisualState(activeObj, groupToMove.id);
-                fabricCanvas.setActiveObject(activeObj);
-                activeObj.setCoords();
-                selectElements([groupToMove.id], false, false);
-                fabricCanvas.requestRenderAll();
-                elementsRef.current = getCurrentElements();
-                const restoreSnapshot = {
-                  memberIds: activeObj.getObjects().map((obj) => getObjectId(obj)).filter((id) => !!id && id !== "__background__"),
-                  groupSelectionId: groupToMove.id,
-                  expiresAt: Date.now() + 1200
-                };
-                recentGroupSelectionRestoreRef.current = restoreSnapshot;
-                activeObj.getObjects().forEach((obj) => {
-                  const objId = getObjectId(obj);
-                  if (objId && objId !== "__background__") {
-                    justModifiedIdsRef.current.add(objId);
-                    modifiedIdsThisRound.add(objId);
-                  }
-                });
-                setTimeout(() => modifiedIdsThisRound.forEach((id) => justModifiedIdsRef.current.delete(id)), 150);
-                groupSelectionTransformStartRef.current = null;
-                activeSelectionMoveStartRef.current = null;
-                activeSelectionResizeHandleRef.current = null;
-                unlockEditsSoon();
-                return;
-              }
-              if (!isActiveSelectionSideResize && !hadScale && !hadRotation && (Math.abs(deltaX) > 0.1 || Math.abs(deltaY) > 0.1)) {
+              const hadScale = isActiveSelection && activeObj && (Math.abs((activeObj.scaleX ?? 1) - 1) > 0.01 || Math.abs((activeObj.scaleY ?? 1) - 1) > 0.01);
+              const startSelAngle = (((transformStart == null ? void 0 : transformStart.selectionAngle) ?? 0) % 360 + 360) % 360;
+              const currentSelAngle = isActiveSelection && activeObj ? ((activeObj.angle ?? 0) % 360 + 360) % 360 : 0;
+              const angleDelta = Math.min(
+                Math.abs(currentSelAngle - startSelAngle),
+                360 - Math.abs(currentSelAngle - startSelAngle)
+              );
+              const hadRotation = isActiveSelection && activeObj && angleDelta > 0.01;
+              if (!hadScale && !hadRotation && (Math.abs(deltaX) > 0.1 || Math.abs(deltaY) > 0.1)) {
                 const { updateNode: updateNodeStore, commitHistory: commitHistoryStore, getCurrentElements } = useEditorStore.getState();
-                const storePos = absoluteToStorePosition(movedGroupLeft, movedGroupTop, groupToMove.id, pageChildren2);
-                updateNodeStore(groupToMove.id, { left: storePos.left, top: storePos.top }, { recordHistory: false, skipLayoutRecalc: true });
+                const newLeft = (groupToMove.left ?? 0) + deltaX;
+                const newTop = (groupToMove.top ?? 0) + deltaY;
+                updateNodeStore(groupToMove.id, { left: newLeft, top: newTop }, { recordHistory: false, skipLayoutRecalc: true });
                 commitHistoryStore();
                 pendingGroupDrillInRef.current = null;
                 fabricCanvas.__activeEditingGroupId = null;
@@ -15139,8 +14787,6 @@ const PageCanvas = react.forwardRef(
                 }
                 setTimeout(() => modifiedIdsThisRound.forEach((id) => justModifiedIdsRef.current.delete(id)), 150);
                 groupSelectionTransformStartRef.current = null;
-                activeSelectionMoveStartRef.current = null;
-                activeSelectionResizeHandleRef.current = null;
                 const restoreSnapshot = {
                   memberIds: targetObjects.map((obj) => getObjectId(obj)).filter((id) => !!id && id !== "__background__"),
                   groupSelectionId,
@@ -15154,38 +14800,6 @@ const PageCanvas = react.forwardRef(
             }
           }
           const pendingCropGroupFrameBakes = [];
-          const logicalGroupSelectionId = activeObj instanceof fabric__namespace.ActiveSelection ? activeObj.__pixldocsGroupSelection : void 0;
-          const isLogicalGroupAS = !!logicalGroupSelectionId && !(activeObj == null ? void 0 : activeObj.__cropGroup) && !(activeObj == null ? void 0 : activeObj.__docuforgeSectionGroup);
-          const logicalGroupNodeForBake = logicalGroupSelectionId ? findNodeById(pageChildren2, logicalGroupSelectionId) : null;
-          const asAngleForBake = isLogicalGroupAS && activeObj ? normalizeAngle(Number(activeObj.angle ?? 0)) : 0;
-          const logicalGroupFinalFrame = (() => {
-            var _a3;
-            if (!isLogicalGroupAS || !logicalGroupSelectionId || !(activeObj instanceof fabric__namespace.ActiveSelection)) return null;
-            const baseline = ((_a3 = groupSelectionTransformStartRef.current) == null ? void 0 : _a3.groupId) === logicalGroupSelectionId ? groupSelectionTransformStartRef.current : null;
-            const localWidth = Math.max(1, (activeObj.width ?? (baseline == null ? void 0 : baseline.groupWidth) ?? 1) * Math.abs(activeObj.scaleX ?? 1));
-            const localHeight = Math.max(1, (activeObj.height ?? (baseline == null ? void 0 : baseline.groupHeight) ?? 1) * Math.abs(activeObj.scaleY ?? 1));
-            const center = activeObj.getCenterPoint();
-            const topLeft = centerToRotatedTopLeft(center.x, center.y, localWidth, localHeight, asAngleForBake);
-            return {
-              groupId: logicalGroupSelectionId,
-              left: topLeft.left,
-              top: topLeft.top,
-              width: localWidth,
-              height: localHeight,
-              centerX: center.x,
-              centerY: center.y,
-              angle: asAngleForBake,
-              matrix: fabric__namespace.util.composeMatrix({
-                translateX: center.x,
-                translateY: center.y,
-                angle: asAngleForBake,
-                scaleX: 1,
-                scaleY: 1,
-                skewX: 0,
-                skewY: 0
-              })
-            };
-          })();
           for (const obj of activeObjects) {
             const objId = getObjectId(obj);
             if (!objId || objId === "__background__") continue;
@@ -15231,15 +14845,16 @@ const PageCanvas = react.forwardRef(
             modifiedIdsThisRound.add(objId);
             let absoluteLeft;
             let absoluteTop;
-            const initialTopLeft = centerToRotatedTopLeft(
-              decomposed.translateX ?? (obj.left ?? 0),
-              decomposed.translateY ?? (obj.top ?? 0),
-              intrinsicWidth * Math.abs(decomposed.scaleX || 1),
-              intrinsicHeight * Math.abs(decomposed.scaleY || 1),
-              decomposed.angle ?? 0
-            );
-            absoluteLeft = initialTopLeft.left;
-            absoluteTop = initialTopLeft.top;
+            if (isActiveSelection && activeObj) {
+              const selectionMatrix = activeObj.calcTransformMatrix();
+              const relativePoint = { x: obj.left ?? 0, y: obj.top ?? 0 };
+              const absolutePoint = fabric__namespace.util.transformPoint(relativePoint, selectionMatrix);
+              absoluteLeft = absolutePoint.x;
+              absoluteTop = absolutePoint.y;
+            } else {
+              absoluteLeft = obj.left ?? 0;
+              absoluteTop = obj.top ?? 0;
+            }
             if (obj instanceof fabric__namespace.Group && obj.__cropGroup) {
               const ct = obj.__cropData;
               if (isActiveSelection && activeObj instanceof fabric__namespace.ActiveSelection) {
@@ -15249,22 +14864,14 @@ const PageCanvas = react.forwardRef(
               } else {
                 const w = ((ct == null ? void 0 : ct.frameW) ?? obj.width ?? 0) * Math.abs(obj.scaleX ?? 1);
                 const h = ((ct == null ? void 0 : ct.frameH) ?? obj.height ?? 0) * Math.abs(obj.scaleY ?? 1);
-                const angleRad = (decomposed.angle ?? obj.angle ?? 0) * Math.PI / 180;
-                absoluteLeft = (decomposed.translateX ?? absoluteLeft ?? 0) - w / 2 * Math.cos(angleRad) + h / 2 * Math.sin(angleRad);
-                absoluteTop = (decomposed.translateY ?? absoluteTop ?? 0) - w / 2 * Math.sin(angleRad) - h / 2 * Math.cos(angleRad);
+                absoluteLeft = (absoluteLeft ?? 0) - w / 2;
+                absoluteTop = (absoluteTop ?? 0) - h / 2;
               }
             } else if (obj instanceof fabric__namespace.FabricImage && (obj.originX === "center" || obj.originY === "center")) {
-              if (isActiveSelection && activeObj instanceof fabric__namespace.ActiveSelection) {
-                const frameBounds = getObjectFrameBoundsInSelection(activeObj, obj, obj.width ?? 0, obj.height ?? 0);
-                absoluteLeft = frameBounds.left;
-                absoluteTop = frameBounds.top;
-              } else {
-                const w = (obj.width ?? 0) * (obj.scaleX ?? 1);
-                const h = (obj.height ?? 0) * (obj.scaleY ?? 1);
-                const angleRad = (decomposed.angle ?? obj.angle ?? 0) * Math.PI / 180;
-                absoluteLeft = (decomposed.translateX ?? absoluteLeft ?? 0) - w / 2 * Math.cos(angleRad) + h / 2 * Math.sin(angleRad);
-                absoluteTop = (decomposed.translateY ?? absoluteTop ?? 0) - w / 2 * Math.sin(angleRad) - h / 2 * Math.cos(angleRad);
-              }
+              const w = (obj.width ?? 0) * (obj.scaleX ?? 1);
+              const h = (obj.height ?? 0) * (obj.scaleY ?? 1);
+              absoluteLeft = (absoluteLeft ?? 0) - w / 2;
+              absoluteTop = (absoluteTop ?? 0) - h / 2;
             }
             const preserveCornerGeometry = (sourceElement == null ? void 0 : sourceElement.type) === "shape" && (sourceElement.shapeType === "circle" || sourceElement.shapeType === "rounded-rect" || sourceElement.shapeType === "triangle");
             let finalWidth = intrinsicWidth;
@@ -15272,10 +14879,6 @@ const PageCanvas = react.forwardRef(
             let finalScaleX = decomposed.scaleX;
             let finalScaleY = decomposed.scaleY;
             let finalAbsoluteMatrix = absoluteMatrix;
-            let finalAngle = decomposed.angle;
-            let finalSkewX = decomposed.skewX;
-            let finalSkewY = decomposed.skewY;
-            let finalAngleFromDecomposed = true;
             if (obj instanceof fabric__namespace.Group && obj.__cropGroup) {
               const ct = obj.__cropData;
               if (ct) {
@@ -15292,14 +14895,12 @@ const PageCanvas = react.forwardRef(
                   absoluteLeft = frameBounds.left;
                   absoluteTop = frameBounds.top;
                 } else {
-                  const angleRad = (decomposed.angle ?? obj.angle ?? 0) * Math.PI / 180;
-                  absoluteLeft = (decomposed.translateX ?? absoluteLeft) - finalWidth / 2 * Math.cos(angleRad) + finalHeight / 2 * Math.sin(angleRad);
-                  absoluteTop = (decomposed.translateY ?? absoluteTop) - finalWidth / 2 * Math.sin(angleRad) - finalHeight / 2 * Math.cos(angleRad);
+                  absoluteLeft = (decomposed.translateX ?? absoluteLeft) - finalWidth / 2;
+                  absoluteTop = (decomposed.translateY ?? absoluteTop) - finalHeight / 2;
                 }
-                const finalCenter = rotatedTopLeftToCenter(absoluteLeft, absoluteTop, finalWidth, finalHeight, decomposed.angle ?? (obj.angle ?? 0));
                 finalAbsoluteMatrix = fabric__namespace.util.composeMatrix({
-                  translateX: finalCenter.x,
-                  translateY: finalCenter.y,
+                  translateX: absoluteLeft + finalWidth / 2,
+                  translateY: absoluteTop + finalHeight / 2,
                   angle: decomposed.angle ?? (obj.angle ?? 0),
                   scaleX: 1,
                   scaleY: 1,
@@ -15334,12 +14935,6 @@ const PageCanvas = react.forwardRef(
                 finalHeight = bakedH;
                 finalScaleX = 1;
                 finalScaleY = 1;
-                if (activeSelectionResizeHandle === "ml" || activeSelectionResizeHandle === "mr" || activeSelectionResizeHandle === "mt" || activeSelectionResizeHandle === "mb") {
-                  finalAngle = (sourceElement == null ? void 0 : sourceElement.angle) ?? obj.angle ?? decomposed.angle;
-                  finalSkewX = (sourceElement == null ? void 0 : sourceElement.skewX) ?? obj.skewX ?? 0;
-                  finalSkewY = (sourceElement == null ? void 0 : sourceElement.skewY) ?? obj.skewY ?? 0;
-                  if ((sourceElement == null ? void 0 : sourceElement.angle) !== void 0 || obj.angle !== void 0) finalAngleFromDecomposed = false;
-                }
                 obj.set({ scaleX: 1, scaleY: 1 });
                 const newSrc = renderSmartElementToDataUri(sourceElement.smartElementType, sourceElement.smartProps, bakedW, bakedH);
                 if (newSrc) {
@@ -15355,7 +14950,6 @@ const PageCanvas = react.forwardRef(
                   useEditorStore.getState().updateElement(objId, { src: newSrc }, { recordHistory: false, skipLayoutRecalc: true });
                 }
               } else if (isActiveSelection && (Math.abs((decomposed.scaleX ?? 1) - 1) > 1e-3 || Math.abs((decomposed.scaleY ?? 1) - 1) > 1e-3)) {
-                const debugImageBeforeBake = debugGroupImageSideResize ? summarizeFabricObjectForResizeDebug(obj) : null;
                 const sx = Math.abs(decomposed.scaleX || 1);
                 const sy = Math.abs(decomposed.scaleY || 1);
                 const handle = activeSelectionResizeHandle;
@@ -15389,9 +14983,22 @@ const PageCanvas = react.forwardRef(
                     const localScaleX = 1 / sx;
                     const localScaleY = 1 / sy;
                     obj.set({ scaleX: localScaleX, scaleY: localScaleY });
-                    const selectionMatrix = (_h = activeObj == null ? void 0 : activeObj.calcTransformMatrix) == null ? void 0 : _h.call(activeObj);
+                    const selectionMatrix = (_g = activeObj == null ? void 0 : activeObj.calcTransformMatrix) == null ? void 0 : _g.call(activeObj);
                     const localCenter = selectionMatrix ? fabric__namespace.util.transformPoint(preBakeCenter, fabric__namespace.util.invertTransform(selectionMatrix)) : preBakeCenter;
-                    obj.setPositionByOrigin(localCenter, "center", "center");
+                    const localWidth = bakedW * localScaleX;
+                    const localHeight = bakedH * localScaleY;
+                    const isCenterOrigin = obj.originX === "center" || obj.originY === "center";
+                    if (isCenterOrigin) {
+                      obj.set({
+                        left: localCenter.x,
+                        top: localCenter.y
+                      });
+                    } else {
+                      obj.set({
+                        left: localCenter.x - localWidth / 2,
+                        top: localCenter.y - localHeight / 2
+                      });
+                    }
                   }
                   obj.dirty = true;
                   if (activeObj) activeObj.dirty = true;
@@ -15402,63 +15009,34 @@ const PageCanvas = react.forwardRef(
                 finalHeight = bakedH;
                 finalScaleX = 1;
                 finalScaleY = 1;
-                if (activeSelectionResizeHandle === "ml" || activeSelectionResizeHandle === "mr" || activeSelectionResizeHandle === "mt" || activeSelectionResizeHandle === "mb") {
-                  finalAngle = (sourceElement == null ? void 0 : sourceElement.angle) ?? obj.angle ?? decomposed.angle;
-                  finalSkewX = (sourceElement == null ? void 0 : sourceElement.skewX) ?? obj.skewX ?? 0;
-                  finalSkewY = (sourceElement == null ? void 0 : sourceElement.skewY) ?? obj.skewY ?? 0;
-                  if ((sourceElement == null ? void 0 : sourceElement.angle) !== void 0 || obj.angle !== void 0) finalAngleFromDecomposed = false;
-                }
                 try {
-                  const angleRad = (finalAngle ?? 0) * Math.PI / 180;
+                  const angleRad = (decomposed.angle ?? 0) * Math.PI / 180;
                   const cos = Math.cos(angleRad);
                   const sin = Math.sin(angleRad);
                   const hw = finalWidth / 2;
                   const hh = finalHeight / 2;
-                  absoluteLeft = decomposed.translateX - hw * cos + hh * sin;
-                  absoluteTop = decomposed.translateY - hw * sin - hh * cos;
+                  const corners = [
+                    { x: -hw, y: -hh },
+                    { x: hw, y: -hh },
+                    { x: hw, y: hh },
+                    { x: -hw, y: hh }
+                  ].map((p) => ({
+                    x: decomposed.translateX + p.x * cos - p.y * sin,
+                    y: decomposed.translateY + p.x * sin + p.y * cos
+                  }));
+                  absoluteLeft = Math.min(...corners.map((p) => p.x));
+                  absoluteTop = Math.min(...corners.map((p) => p.y));
                 } catch {
                 }
                 finalAbsoluteMatrix = fabric__namespace.util.composeMatrix({
                   translateX: decomposed.translateX,
                   translateY: decomposed.translateY,
-                  angle: finalAngle ?? 0,
+                  angle: decomposed.angle ?? 0,
                   scaleX: 1,
                   scaleY: 1,
-                  skewX: finalSkewX ?? 0,
-                  skewY: finalSkewY ?? 0
+                  skewX: 0,
+                  skewY: 0
                 });
-                if (debugGroupImageSideResize) {
-                  logGroupImageResizeDebug("image-bake", {
-                    time: Math.round(performance.now()),
-                    handle: activeSelectionResizeHandle,
-                    imageId: objId,
-                    source: sourceElement ? {
-                      left: sourceElement.left,
-                      top: sourceElement.top,
-                      width: sourceElement.width,
-                      height: sourceElement.height,
-                      angle: sourceElement.angle,
-                      scaleX: sourceElement.scaleX,
-                      scaleY: sourceElement.scaleY
-                    } : null,
-                    factors: { sx, sy, fx, fy, isCornerHandle },
-                    beforeBake: debugImageBeforeBake,
-                    afterBake: summarizeFabricObjectForResizeDebug(obj),
-                    persistedGeometry: {
-                      absoluteLeft,
-                      absoluteTop,
-                      finalWidth,
-                      finalHeight,
-                      finalScaleX,
-                      finalScaleY,
-                      finalAngle,
-                      finalSkewX,
-                      finalSkewY,
-                      decomposed,
-                      finalAbsoluteMatrix
-                    }
-                  });
-                }
               } else {
                 finalWidth = intrinsicWidth;
                 finalHeight = intrinsicHeight;
@@ -15468,33 +15046,16 @@ const PageCanvas = react.forwardRef(
               finalHeight = 0;
               finalScaleX = 1;
               finalScaleY = 1;
-              if (activeSelectionResizeHandle === "ml" || activeSelectionResizeHandle === "mr" || activeSelectionResizeHandle === "mt" || activeSelectionResizeHandle === "mb") {
-                finalAngle = (sourceElement == null ? void 0 : sourceElement.angle) ?? obj.angle ?? decomposed.angle;
-                finalSkewX = (sourceElement == null ? void 0 : sourceElement.skewX) ?? obj.skewX ?? 0;
-                finalSkewY = (sourceElement == null ? void 0 : sourceElement.skewY) ?? obj.skewY ?? 0;
-                if ((sourceElement == null ? void 0 : sourceElement.angle) !== void 0 || obj.angle !== void 0) finalAngleFromDecomposed = false;
-              }
-            } else if (obj instanceof fabric__namespace.Textbox && isActiveSelection && (activeSelectionResizeHandle != null || obj.__asLiveOrigW != null || obj.__asLiveOrigH != null || Math.abs((decomposed.scaleX ?? 1) - 1) > 1e-3 || Math.abs((decomposed.scaleY ?? 1) - 1) > 1e-3)) {
-              const liveOrigW = obj.__asLiveOrigW;
-              const liveOrigH = obj.__asLiveOrigH;
-              const decSx = Math.abs(decomposed.scaleX || 1);
-              const decSy = Math.abs(decomposed.scaleY || 1);
-              const sx = Math.abs(decSx - 1) < 1e-3 && liveOrigW && liveOrigW > 0 ? Math.max(1e-3, (obj.width ?? liveOrigW) / liveOrigW) : decSx;
-              const baseHForRecover = Number(
-                obj.minBoxHeight ?? obj.height ?? liveOrigH ?? 1
-              );
-              const sy = Math.abs(decSy - 1) < 1e-3 && liveOrigH && liveOrigH > 0 ? Math.max(1e-3, baseHForRecover / liveOrigH) : decSy;
+            } else if (obj instanceof fabric__namespace.Textbox && isActiveSelection && (Math.abs((decomposed.scaleX ?? 1) - 1) > 1e-3 || Math.abs((decomposed.scaleY ?? 1) - 1) > 1e-3)) {
+              const sx = Math.abs(decomposed.scaleX || 1);
+              const sy = Math.abs(decomposed.scaleY || 1);
               const isLikelyUniformCorner = !activeSelectionResizeHandle && Math.abs(sx - sy) < 0.01 && Math.abs(sx - 1) > 1e-3;
               const isCornerHandle = activeSelectionResizeHandle === "tl" || activeSelectionResizeHandle === "tr" || activeSelectionResizeHandle === "bl" || activeSelectionResizeHandle === "br" || isLikelyUniformCorner;
               const isHeightSideHandle = activeSelectionResizeHandle === "mt" || activeSelectionResizeHandle === "mb";
               const fontScale = isCornerHandle ? Math.max(1e-3, Math.sqrt(sx * sy)) : 1;
-              const widthBase = liveOrigW && liveOrigW > 0 ? liveOrigW : intrinsicWidth;
-              const heightBase = liveOrigH && liveOrigH > 0 ? liveOrigH : intrinsicHeight;
-              const bakedWidth = Math.max(20, widthBase * sx);
-              const liveMinHOrig = obj.__asLiveOrigMinH;
-              const currentMinH = Number(obj.minBoxHeight ?? (sourceElement == null ? void 0 : sourceElement.minBoxHeight));
-              const minHBase = Number.isFinite(liveMinHOrig) && liveMinHOrig > 0 ? liveMinHOrig : liveOrigH && liveOrigH > 0 ? currentMinH / sy : currentMinH;
-              const nextMinH = Number.isFinite(minHBase) && minHBase > 0 ? minHBase * sy : isHeightSideHandle ? Math.max(1, heightBase * sy) : void 0;
+              const bakedWidth = Math.max(20, intrinsicWidth * sx);
+              const baseMinH = Number(obj.minBoxHeight ?? (sourceElement == null ? void 0 : sourceElement.minBoxHeight));
+              const nextMinH = Number.isFinite(baseMinH) && baseMinH > 0 ? baseMinH * sy : isHeightSideHandle ? Math.max(1, intrinsicHeight * sy) : void 0;
               const bakedTextScaleUpdates = { width: bakedWidth };
               const debugTextBeforeBake = debugGroupTextCornerResize ? summarizeFabricObjectForResizeDebug(obj) : null;
               finalScaleX = 1;
@@ -15553,9 +15114,14 @@ const PageCanvas = react.forwardRef(
                   const localScaleX = 1 / sx;
                   const localScaleY = 1 / sy;
                   obj.set({ scaleX: localScaleX, scaleY: localScaleY });
-                  const selectionMatrix = (_i = activeObj == null ? void 0 : activeObj.calcTransformMatrix) == null ? void 0 : _i.call(activeObj);
+                  const selectionMatrix = (_h = activeObj == null ? void 0 : activeObj.calcTransformMatrix) == null ? void 0 : _h.call(activeObj);
                   const localCenter = selectionMatrix ? fabric__namespace.util.transformPoint(preBakeCenter, fabric__namespace.util.invertTransform(selectionMatrix)) : preBakeCenter;
-                  obj.setPositionByOrigin(localCenter, "center", "center");
+                  const localWidth = bakedWidth * localScaleX;
+                  const localHeight = (obj.height ?? intrinsicHeight) * localScaleY;
+                  obj.set({
+                    left: localCenter.x - localWidth / 2,
+                    top: localCenter.y - localHeight / 2
+                  });
                 } else {
                   obj.setPositionByOrigin(preBakeCenter, "center", "center");
                 }
@@ -15568,23 +15134,32 @@ const PageCanvas = react.forwardRef(
               } catch {
               }
               try {
-                const angleRad = (finalAngle ?? 0) * Math.PI / 180;
+                const angleRad = (decomposed.angle ?? 0) * Math.PI / 180;
                 const cos = Math.cos(angleRad);
                 const sin = Math.sin(angleRad);
                 const hw = finalWidth / 2;
                 const hh = finalHeight / 2;
-                absoluteLeft = decomposed.translateX - hw * cos + hh * sin;
-                absoluteTop = decomposed.translateY - hw * sin - hh * cos;
+                const corners = [
+                  { x: -hw, y: -hh },
+                  { x: hw, y: -hh },
+                  { x: hw, y: hh },
+                  { x: -hw, y: hh }
+                ].map((p) => ({
+                  x: decomposed.translateX + p.x * cos - p.y * sin,
+                  y: decomposed.translateY + p.x * sin + p.y * cos
+                }));
+                absoluteLeft = Math.min(...corners.map((p) => p.x));
+                absoluteTop = Math.min(...corners.map((p) => p.y));
               } catch {
               }
               finalAbsoluteMatrix = fabric__namespace.util.composeMatrix({
                 translateX: decomposed.translateX,
                 translateY: decomposed.translateY,
-                angle: finalAngle ?? 0,
+                angle: decomposed.angle ?? 0,
                 scaleX: 1,
                 scaleY: 1,
-                skewX: finalSkewX ?? 0,
-                skewY: finalSkewY ?? 0
+                skewX: 0,
+                skewY: 0
               });
               if (debugGroupTextCornerResize) {
                 logGroupTextResizeDebug("text-bake", {
@@ -15639,21 +15214,7 @@ const PageCanvas = react.forwardRef(
             const state = useEditorStore.getState();
             const page = state.canvas.pages.find((p) => p.id === pageId);
             const pageChildrenForSave = (page == null ? void 0 : page.children) ?? [];
-            const storePos = (logicalGroupFinalFrame == null ? void 0 : logicalGroupFinalFrame.groupId) === logicalGroupSelectionId ? (() => {
-              const localCenter = fabric__namespace.util.transformPoint(
-                new fabric__namespace.Point(decomposed.translateX ?? 0, decomposed.translateY ?? 0),
-                fabric__namespace.util.invertTransform(logicalGroupFinalFrame.matrix)
-              );
-              const localAngle = finalAngleFromDecomposed ? ((Number(finalAngle ?? 0) - asAngleForBake) % 360 + 540) % 360 - 180 : Number(finalAngle ?? 0);
-              const localAngleRad = localAngle * Math.PI / 180;
-              return {
-                left: localCenter.x - finalWidth / 2 * Math.cos(localAngleRad) + finalHeight / 2 * Math.sin(localAngleRad) + logicalGroupFinalFrame.width / 2,
-                top: localCenter.y - finalWidth / 2 * Math.sin(localAngleRad) - finalHeight / 2 * Math.cos(localAngleRad) + logicalGroupFinalFrame.height / 2
-              };
-            })() : absoluteToStorePosition(absoluteLeft, absoluteTop, objId, pageChildrenForSave);
-            if (isLogicalGroupAS && finalAngleFromDecomposed && typeof finalAngle === "number") {
-              finalAngle = ((finalAngle - asAngleForBake) % 360 + 540) % 360 - 180;
-            }
+            const storePos = absoluteToStorePosition(absoluteLeft, absoluteTop, objId, pageChildrenForSave);
             const isLineObj = obj instanceof fabric__namespace.Line;
             const isAutoShrinkText = (sourceElement == null ? void 0 : sourceElement.type) === "text" && sourceElement.overflowPolicy === "auto-shrink";
             const autoShrinkStoredHeight = isAutoShrinkText ? sourceElement.height : void 0;
@@ -15665,17 +15226,13 @@ const PageCanvas = react.forwardRef(
               // so finalWidth already reflects the new width chosen by the user.
               width: finalWidth,
               height: isLineObj ? 0 : isAutoShrinkText ? typeof autoShrinkStoredHeight === "number" ? autoShrinkStoredHeight : finalHeight : finalHeight,
-              angle: finalAngle,
-              skewX: isLineObj ? 0 : finalSkewX,
-              skewY: isLineObj ? 0 : finalSkewY,
+              angle: decomposed.angle,
+              skewX: isLineObj ? 0 : decomposed.skewX,
+              skewY: isLineObj ? 0 : decomposed.skewY,
               scaleX: finalScaleX,
-              scaleY: finalScaleY
+              scaleY: finalScaleY,
+              transformMatrix: finalAbsoluteMatrix
             };
-            if (!isLogicalGroupAS) {
-              elementUpdate.transformMatrix = finalAbsoluteMatrix;
-            } else {
-              elementUpdate.transformMatrix = void 0;
-            }
             if (obj instanceof fabric__namespace.Textbox) {
               const bakedTextScaleUpdates = obj.__pixldocsBakedTextScaleUpdates;
               if (bakedTextScaleUpdates && typeof bakedTextScaleUpdates === "object") {
@@ -15706,41 +15263,10 @@ const PageCanvas = react.forwardRef(
                 objectBeforeStoreWrite: summarizeFabricObjectForResizeDebug(obj)
               });
             }
-            if (debugGroupImageSideResize && isGroupResizeImageLikeObject(obj)) {
-              logGroupImageResizeDebug("store-update-image", {
-                time: Math.round(performance.now()),
-                handle: activeSelectionResizeHandle,
-                imageId: objId,
-                storePos,
-                elementUpdate,
-                objectBeforeStoreWrite: summarizeFabricObjectForResizeDebug(obj)
-              });
-            }
             updateElement(objId, elementUpdate, { recordHistory: false, skipLayoutRecalc: true });
             obj.setCoords();
-            delete obj.__asLiveOrigW;
-            delete obj.__asLiveOrigH;
-            delete obj.__asLiveOrigMinH;
           }
-          if (isLogicalGroupAS && logicalGroupSelectionId && activeObj instanceof fabric__namespace.ActiveSelection) {
-            try {
-              const pageChildrenForGroup = ((_j = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _j.children) ?? [];
-              const groupNode = findNodeById(pageChildrenForGroup, logicalGroupSelectionId);
-              if (groupNode && logicalGroupFinalFrame) {
-                const storePosGroup = absoluteToStorePosition(logicalGroupFinalFrame.left, logicalGroupFinalFrame.top, logicalGroupSelectionId, pageChildrenForGroup);
-                useEditorStore.getState().updateNode(logicalGroupSelectionId, {
-                  left: storePosGroup.left,
-                  top: storePosGroup.top,
-                  width: logicalGroupFinalFrame.width,
-                  height: logicalGroupFinalFrame.height,
-                  angle: logicalGroupFinalFrame.angle
-                }, { recordHistory: false, skipLayoutRecalc: true });
-              }
-            } catch (err) {
-              console.warn("[Pixldocs] logical-group envelope persist failed", err);
-            }
-          }
-          const pageChildrenForReflow = ((_k = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _k.children) ?? [];
+          const pageChildrenForReflow = ((_i = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _i.children) ?? [];
           const stackGroupsToReflow = /* @__PURE__ */ new Set();
           for (const id of modifiedIdsThisRound) {
             const parent = findParentGroup(pageChildrenForReflow, id);
@@ -15767,16 +15293,6 @@ const PageCanvas = react.forwardRef(
                 renderOnAddRemove: fabricCanvas.renderOnAddRemove
               });
             }
-            if (debugGroupImageSideResize) {
-              logGroupImageResizeDebug("before-reselect", {
-                time: Math.round(performance.now()),
-                handle: activeSelectionResizeHandle,
-                wasGroupSel,
-                selection: summarizeFabricObjectForResizeDebug(activeObj),
-                members: membersToReselect.map((member) => summarizeFabricObjectForResizeDebug(member)),
-                renderOnAddRemove: fabricCanvas.renderOnAddRemove
-              });
-            }
             const prevRenderOnAddRemove = fabricCanvas.renderOnAddRemove;
             fabricCanvas.renderOnAddRemove = false;
             skipSelectionClearOnDiscardRef.current = true;
@@ -15791,10 +15307,9 @@ const PageCanvas = react.forwardRef(
               if (!ct) continue;
               ct.frameW = bake.width;
               ct.frameH = bake.height;
-              const bakeCenter = rotatedTopLeftToCenter(bake.left, bake.top, bake.width, bake.height, bake.angle);
               bake.obj.set({
-                left: bakeCenter.x,
-                top: bakeCenter.y,
+                left: bake.left + bake.width / 2,
+                top: bake.top + bake.height / 2,
                 width: bake.width,
                 height: bake.height,
                 scaleX: 1,
@@ -15821,16 +15336,6 @@ const PageCanvas = react.forwardRef(
                   renderOnAddRemove: fabricCanvas.renderOnAddRemove
                 });
               }
-              if (debugGroupImageSideResize) {
-                logGroupImageResizeDebug("after-reselect", {
-                  time: Math.round(performance.now()),
-                  handle: activeSelectionResizeHandle,
-                  wasGroupSel,
-                  selection: summarizeFabricObjectForResizeDebug(newSel),
-                  members: membersToReselect.map((member) => summarizeFabricObjectForResizeDebug(member)),
-                  renderOnAddRemove: fabricCanvas.renderOnAddRemove
-                });
-              }
             } else if (membersToReselect.length === 1) {
               fabricCanvas.setActiveObject(membersToReselect[0]);
             }
@@ -15867,7 +15372,6 @@ const PageCanvas = react.forwardRef(
         const activeObj = fabricCanvas.getActiveObject();
         if (!(activeObj instanceof fabric__namespace.ActiveSelection)) return;
         if (skipActiveSelectionBakeOnClearRef.current) return;
-        if (activeObj.__pixldocsGroupSelection) return;
         const selectionMatrix = activeObj.calcTransformMatrix();
         for (const obj of deselected) {
           const objId = getObjectId(obj);
@@ -16337,7 +15841,7 @@ const PageCanvas = react.forwardRef(
                 const nextHeight = Math.max(minVisiblePlaceholder, Number(resolvedSizeImg.height) || 50);
                 const storePosImg = pageChildren ? (() => {
                   const node = findNodeById(pageChildren, element.id);
-                  return node && isElement(node) ? getElementFabricPlacement(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
+                  return node ? getAbsoluteBounds(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
                 })() : { left: element.left ?? 0, top: element.top ?? 0 };
                 const elementForPlaceholder = { ...element, width: nextWidth, height: nextHeight };
                 const placeholder = isCropGroup2 ? createImagePlaceholderForGroup(elementForPlaceholder) : createImagePlaceholder(elementForPlaceholder);
@@ -16400,14 +15904,13 @@ const PageCanvas = react.forwardRef(
                     }
                     const cropPos = pageChildren ? (() => {
                       const node = findNodeById(pageChildren, element.id);
-                      return node && isElement(node) ? getElementFabricPlacement(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
-                    })() : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
-                    const cropCenter = rotatedTopLeftToCenter(cropPos.left, cropPos.top, ct.frameW ?? 0, ct.frameH ?? 0, cropPos.angle ?? element.angle ?? 0);
-                    const cropCenterX = cropCenter.x;
-                    const cropCenterY = cropCenter.y;
+                      return node ? getAbsoluteBounds(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
+                    })() : { left: element.left ?? 0, top: element.top ?? 0 };
+                    const cropCenterX = cropPos.left + (ct.frameW ?? 0) / 2;
+                    const cropCenterY = cropPos.top + (ct.frameH ?? 0) / 2;
                     if (element.left !== void 0) existingObj.set({ left: cropCenterX });
                     if (element.top !== void 0) existingObj.set({ top: cropCenterY });
-                    existingObj.set({ angle: cropPos.angle ?? element.angle ?? 0 });
+                    if (element.angle !== void 0) existingObj.set({ angle: element.angle });
                     existingObj.set({
                       flipX: element.flipX ?? false,
                       flipY: element.flipY ?? false
@@ -16530,8 +16033,8 @@ const PageCanvas = react.forwardRef(
                 if (isPlaceholderGroup) {
                   const storePosImg = pageChildren ? (() => {
                     const node = findNodeById(pageChildren, element.id);
-                    return node && isElement(node) ? getElementFabricPlacement(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
-                  })() : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
+                    return node ? getAbsoluteBounds(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
+                  })() : { left: element.left ?? 0, top: element.top ?? 0 };
                   const resolvedSizeImg = (pageChildren == null ? void 0 : pageChildren.length) ? getNodeBounds(element, pageChildren) : { width: typeof element.width === "number" ? element.width : 200, height: typeof element.height === "number" ? element.height : 50 };
                   const hasExplicitSize = typeof element.width === "number" && Number.isFinite(element.width) && element.width > 0 && typeof element.height === "number" && Number.isFinite(element.height) && element.height > 0;
                   const minVisiblePlaceholder = hasExplicitSize ? 1 : 20;
@@ -16545,7 +16048,7 @@ const PageCanvas = react.forwardRef(
                     top: storePosImg.top + nextHeight / 2,
                     originX: "center",
                     originY: "center",
-                    angle: storePosImg.angle ?? element.angle ?? 0,
+                    angle: element.angle ?? 0,
                     opacity: isHidden ? 0 : element.opacity ?? 1,
                     flipX: element.flipX ?? false,
                     flipY: element.flipY ?? false,
@@ -16594,8 +16097,8 @@ const PageCanvas = react.forwardRef(
                 const visibilityChanged = previousVisible !== currentVisible;
                 const storePosForImg = pageChildren ? (() => {
                   const node = findNodeById(pageChildren, element.id);
-                  return node && isElement(node) ? getElementFabricPlacement(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
-                })() : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
+                  return node ? getAbsoluteBounds(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
+                })() : { left: element.left ?? 0, top: element.top ?? 0 };
                 const positionChanged = Math.abs((existingObj.left ?? 0) - storePosForImg.left) > 0.1 || Math.abs((existingObj.top ?? 0) - storePosForImg.top) > 0.1;
                 if (visibilityChanged && !positionChanged || visibilityUpdateInProgressRef.current) {
                   const isDynamicField = dynamicFieldIds.includes(element.id);
@@ -16637,7 +16140,7 @@ const PageCanvas = react.forwardRef(
                 const fabricTop = existingObj.top ?? 0;
                 const storePos = pageChildren ? (() => {
                   const node = findNodeById(pageChildren, element.id);
-                  return node && isElement(node) ? getElementFabricPlacement(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
+                  return node ? getAbsoluteBounds(node, pageChildren) : { left: element.left ?? 0, top: element.top ?? 0 };
                 })() : { left: element.left ?? 0, top: element.top ?? 0 };
                 const storeLeft = storePos.left;
                 const storeTop = storePos.top;
@@ -16764,7 +16267,7 @@ const PageCanvas = react.forwardRef(
               setObjectData(placeholder, element.id);
               const absPosImg = pageTree.length > 0 ? (() => {
                 const node = findNodeById(pageTree, element.id);
-                return node && isElement(node) ? getElementFabricPlacement(node, pageTree) : { left: element.left ?? 0, top: element.top ?? 0 };
+                return node ? getAbsoluteBounds(node, pageTree) : { left: element.left ?? 0, top: element.top ?? 0 };
               })() : { left: element.left ?? 0, top: element.top ?? 0 };
               const placeholderWidth = Number((placeholder.width ?? 0) * (placeholder.scaleX ?? 1));
               const placeholderHeight = Number((placeholder.height ?? 0) * (placeholder.scaleY ?? 1));
@@ -16813,7 +16316,7 @@ const PageCanvas = react.forwardRef(
               if (obj) {
                 const absPos = pageTree.length > 0 ? (() => {
                   const node = findNodeById(pageTree, element.id);
-                  return node && isElement(node) ? getElementFabricPlacement(node, pageTree) : { left: element.left ?? 0, top: element.top ?? 0 };
+                  return node ? getAbsoluteBounds(node, pageTree) : { left: element.left ?? 0, top: element.top ?? 0 };
                 })() : { left: element.left ?? 0, top: element.top ?? 0 };
                 obj.set({ left: absPos.left, top: absPos.top });
                 obj.setCoords();
@@ -17203,7 +16706,9 @@ const PageCanvas = react.forwardRef(
         if (sameSelection && isFlatGroupSelection) {
           if (selectedGroupSelectionId && active instanceof fabric__namespace.ActiveSelection) {
             if (isPureSingleGroupSelection) {
-              applyLogicalGroupSelectionVisualState(active, selectedGroupSelectionId);
+              active.__pixldocsGroupSelection = selectedGroupSelectionId;
+              delete active.__pixldocsLogicalGroupIds;
+              suppressGroupMemberBordersRef.current = active.getObjects();
             } else {
               delete active.__pixldocsGroupSelection;
               active.__pixldocsLogicalGroupIds = selectedGroupIds;
@@ -17243,7 +16748,8 @@ const PageCanvas = react.forwardRef(
           const selection = new fabric__namespace.ActiveSelection(toSelect, { canvas: fc });
           if (selectedGroupSelectionId) {
             if (isPureSingleGroupSelection) {
-              applyLogicalGroupSelectionVisualState(selection, selectedGroupSelectionId);
+              selection.__pixldocsGroupSelection = selectedGroupSelectionId;
+              suppressGroupMemberBordersRef.current = toSelect;
             } else {
               selection.__pixldocsLogicalGroupIds = selectedGroupIds;
               selection.hasBorders = true;
@@ -17301,8 +16807,8 @@ const PageCanvas = react.forwardRef(
       const currentPageTree = ((pageChildren == null ? void 0 : pageChildren.length) ? pageChildren : (_a2 = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _a2.children) ?? [];
       const fabricPos = currentPageTree.length > 0 ? (() => {
         const node = findNodeById(currentPageTree, element.id);
-        return node && isElement(node) ? getElementFabricPlacement(node, currentPageTree) : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
-      })() : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
+        return node ? getAbsoluteBounds(node, currentPageTree) : { left: element.left ?? 0, top: element.top ?? 0 };
+      })() : { left: element.left ?? 0, top: element.top ?? 0 };
       const resolvedSize = currentPageTree.length > 0 ? getNodeBounds(element, currentPageTree) : { width: typeof element.width === "number" ? element.width : 200, height: typeof element.height === "number" ? element.height : 50 };
       const shouldPreserveSmallSize = typeof element.width === "number" && Number.isFinite(element.width) && element.width > 0 && typeof element.height === "number" && Number.isFinite(element.height) && element.height > 0;
       const minVisible = shouldPreserveSmallSize ? 1 : 20;
@@ -17337,9 +16843,8 @@ const PageCanvas = react.forwardRef(
           ct.shape = clipShape === "circle" ? "circle" : clipShape === "rounded" ? "roundRect" : "rect";
           ct.rx = rxRatio;
           obj.__maintainResolution = element.maintainResolution !== false;
-          const center = rotatedTopLeftToCenter(fabricPos.left, fabricPos.top, elementWidth, elementHeight, element.angle ?? 0);
-          const centerX = center.x;
-          const centerY = center.y;
+          const centerX = fabricPos.left + elementWidth / 2;
+          const centerY = fabricPos.top + elementHeight / 2;
           const cropSetProps = {
             width: elementWidth,
             height: elementHeight,
@@ -17579,8 +17084,7 @@ const PageCanvas = react.forwardRef(
         if (!skipPositionUpdate && (obj instanceof fabric__namespace.FabricImage && obj.originX === "center" || obj instanceof fabric__namespace.Group && obj.__cropGroup)) {
           const vW = rW * effectiveScaleX;
           const vH = rH * effectiveScaleY;
-          const center = rotatedTopLeftToCenter(fabricPos.left, fabricPos.top, vW, vH, element.angle ?? 0);
-          posIfNotSkipped = { left: center.x, top: center.y };
+          posIfNotSkipped = { left: fabricPos.left + vW / 2, top: fabricPos.top + vH / 2 };
         }
         if (element.transformMatrix && element.transformMatrix.length === 6) {
           if (isTextbox) {
@@ -18371,14 +17875,14 @@ const PageCanvas = react.forwardRef(
             const pageTreeForCreate = ((pageChildren == null ? void 0 : pageChildren.length) ? pageChildren : (_f = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _f.children) ?? [];
             const createPos = pageTreeForCreate.length > 0 ? (() => {
               const node = findNodeById(pageTreeForCreate, element.id);
-              return node && isElement(node) ? getElementFabricPlacement(node, pageTreeForCreate, pageBoundsOptions) : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
-            })() : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
+              return node ? getAbsoluteBounds(node, pageTreeForCreate) : { left: element.left ?? 0, top: element.top ?? 0 };
+            })() : { left: element.left ?? 0, top: element.top ?? 0 };
             img.set({
               left: createPos.left,
               top: createPos.top,
               scaleX: finalScaleX,
               scaleY: finalScaleY,
-              angle: createPos.angle ?? element.angle ?? 0,
+              angle: element.angle ?? 0,
               skewX: element.skewX ?? 0,
               skewY: element.skewY ?? 0,
               flipX: element.flipX ?? false,
@@ -18465,8 +17969,8 @@ const PageCanvas = react.forwardRef(
           const pageTreeForCrop = ((pageChildren == null ? void 0 : pageChildren.length) ? pageChildren : (_n = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId)) == null ? void 0 : _n.children) ?? [];
           const createPosForCrop = pageTreeForCrop.length > 0 ? (() => {
             const node = findNodeById(pageTreeForCrop, element.id);
-            return node && isElement(node) ? getElementFabricPlacement(node, pageTreeForCrop, pageBoundsOptions) : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
-          })() : { left: element.left ?? 0, top: element.top ?? 0, angle: element.angle ?? 0 };
+            return node ? getAbsoluteBounds(node, pageTreeForCrop) : { left: element.left ?? 0, top: element.top ?? 0 };
+          })() : { left: element.left ?? 0, top: element.top ?? 0 };
           const nodeForCreate = pageTreeForCrop.length ? findNodeById(pageTreeForCrop, element.id) : null;
           const createW = nodeForCreate && isElement(nodeForCreate) ? nodeForCreate.width : elementWidth;
           const createH = nodeForCreate && isElement(nodeForCreate) ? nodeForCreate.height : elementHeight;
@@ -18474,9 +17978,8 @@ const PageCanvas = react.forwardRef(
           const createSy = nodeForCreate && isElement(nodeForCreate) ? nodeForCreate.scaleY ?? 1 : element.scaleY ?? 1;
           const frameW = Math.max(1, Number(createW) || 200) * createSx;
           const frameH = Math.max(1, Number(createH) || 50) * createSy;
-          const createCenter = rotatedTopLeftToCenter(createPosForCrop.left, createPosForCrop.top, frameW, frameH, createPosForCrop.angle ?? element.angle ?? 0);
-          const createCenterX = createCenter.x;
-          const createCenterY = createCenter.y;
+          const createCenterX = createPosForCrop.left + frameW / 2;
+          const createCenterY = createPosForCrop.top + frameH / 2;
           const cropGroup = await createMaskedImageElement({
             image: img,
             frameW,
@@ -18489,7 +17992,7 @@ const PageCanvas = react.forwardRef(
             strokeWidth: 0,
             left: createCenterX,
             top: createCenterY,
-            angle: createPosForCrop.angle ?? element.angle ?? 0,
+            angle: element.angle ?? 0,
             opacity: isHidden ? 0 : element.opacity ?? 1,
             selectable: allowSelection && !isHidden,
             evented: canBeEvented && !isHidden,
@@ -24879,9 +24382,9 @@ function captureFabricCanvasSvgForPdf(fabricInstance, canvasWidth, canvasHeight)
   }
   return svgString;
 }
-const resolvedPackageVersion = "0.5.353";
+const resolvedPackageVersion = "0.5.355";
 const PACKAGE_VERSION = resolvedPackageVersion;
-const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.353";
+const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.355";
 const roundParityValue = (value) => {
   if (typeof value !== "number") return value;
   return Number.isFinite(value) ? Number(value.toFixed(3)) : value;
@@ -25695,7 +25198,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 Promise.resolve().then(() => require("./vectorPdfExport-DihZwtD7.cjs"));
+      const { exportMultiPagePdf, preparePagesForExport } = await Promise.resolve().then(() => require("./vectorPdfExport-BtRK4LgQ.cjs"));
       const prepared = preparePagesForExport(
         cloned.pages,
         canvasWidth,
@@ -28015,7 +27518,7 @@ async function prepareLiveCanvasSvgForPdf(rawSvg, pageWidth, pageHeight, pageKey
     if (options == null ? void 0 : options.stripPageBackground) stripRootPageBackgroundFromSvg(svgToDraw);
     sanitizeSvgTreeForPdf(svgToDraw);
     try {
-      const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await Promise.resolve().then(() => require("./vectorPdfExport-DihZwtD7.cjs"));
+      const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await Promise.resolve().then(() => require("./vectorPdfExport-BtRK4LgQ.cjs"));
       try {
         await logTextMeasurementDiagnostic(svgToDraw);
       } catch {
@@ -28412,4 +27915,4 @@ exports.setAutoShrinkDebug = setAutoShrinkDebug;
 exports.setBundledAssetPrefixes = setBundledAssetPrefixes;
 exports.warmResolvedTemplateForPreview = warmResolvedTemplateForPreview;
 exports.warmTemplateFromForm = warmTemplateFromForm;
-//# sourceMappingURL=index-UiuMKvLc.cjs.map
+//# sourceMappingURL=index-DWxht-v_.cjs.map