@pixldocs/canvas-renderer 0.5.394 → 0.5.395

package/dist/{index-CgnT1WJ6.js → index-Bl3vMS3U.js}

@@ -11436,7 +11436,7 @@ const bakeTextboxScaleIntoTypography = (obj, sourceElement) => {
   };
   return updates;
 };
-function applyWarpAwareSelectionBorders(selection, preferredGroupAngle) {
+function applyWarpAwareSelectionBorders(selection, preferredGroupAngle, preferredGroupFrame) {
   var _a2;
   if (selection.__pixldocsOrigASHasBorders !== void 0) {
     selection.hasBorders = selection.__pixldocsOrigASHasBorders;
@@ -11499,7 +11499,8 @@ function applyWarpAwareSelectionBorders(selection, preferredGroupAngle) {
         for (const b of buckets) b.area = orientedAreaForAngle(b.angle);
         buckets.sort((a, b) => b.count - a.count || a.area - b.area || Math.abs(b.angle) - Math.abs(a.angle));
         const dominant = buckets[0];
-        const preferredAngle = typeof preferredGroupAngle === "number" && Number.isFinite(preferredGroupAngle) ? normalizeAngle180(preferredGroupAngle) : null;
+        const rawPreferredGroupAngle = typeof preferredGroupAngle === "number" && Number.isFinite(preferredGroupAngle) ? preferredGroupAngle : typeof selection.__pixldocsGroupAngle === "number" && Number.isFinite(selection.__pixldocsGroupAngle) ? selection.__pixldocsGroupAngle : null;
+        const preferredAngle = rawPreferredGroupAngle != null ? normalizeAngle180(rawPreferredGroupAngle) : null;
         let targetAngle = preferredAngle;
         const isLogicalGroupSelection = !!selection.__pixldocsGroupSelection;
         if (targetAngle == null && dominant && Math.abs(dominant.angle) > 0.5 && (isLogicalGroupSelection || kids.length === 1 || dominant.count >= 2 || dominant.count === kids.length)) {
@@ -11543,11 +11544,30 @@ function applyWarpAwareSelectionBorders(selection, preferredGroupAngle) {
             targetAngle,
             worldAngles
           });
+          const fixedFrame = preferredGroupFrame && Number.isFinite(preferredGroupFrame.left) && Number.isFinite(preferredGroupFrame.top) && Number.isFinite(preferredGroupFrame.width) && preferredGroupFrame.width > 0 && Number.isFinite(preferredGroupFrame.height) && preferredGroupFrame.height > 0 ? preferredGroupFrame : null;
           selection.set({ angle: targetAngle, scaleX: 1, scaleY: 1, skewX: 0, skewY: 0 });
+          if (fixedFrame) {
+            selection.set({ width: fixedFrame.width, height: fixedFrame.height, originX: "center", originY: "center" });
+            selection.setPositionByOrigin(
+              new fabric.Point(fixedFrame.left + fixedFrame.width / 2, fixedFrame.top + fixedFrame.height / 2),
+              "center",
+              "center"
+            );
+          }
           restoreKidsFromWorld();
-          try {
-            (_a2 = selection.triggerLayout) == null ? void 0 : _a2.call(selection);
-          } catch {
+          if (!fixedFrame) {
+            try {
+              (_a2 = selection.triggerLayout) == null ? void 0 : _a2.call(selection);
+            } catch {
+            }
+          }
+          if (fixedFrame) {
+            selection.set({ width: fixedFrame.width, height: fixedFrame.height, originX: "center", originY: "center" });
+            selection.setPositionByOrigin(
+              new fabric.Point(fixedFrame.left + fixedFrame.width / 2, fixedFrame.top + fixedFrame.height / 2),
+              "center",
+              "center"
+            );
           }
           restoreKidsFromWorld();
           selection.setCoords();
@@ -11636,14 +11656,50 @@ const PageCanvas = forwardRef(
     const [ready, setReady] = useState(false);
     const [unlockRequestId, setUnlockRequestId] = useState(0);
     const applyLogicalGroupSelectionVisualState = useCallback((selection, groupId) => {
-      var _a2;
+      var _a2, _b2;
       selection.__pixldocsGroupSelection = groupId;
       delete selection.__pixldocsLogicalGroupIds;
       const pageNow = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId);
       const groupNode = pageNow ? findNodeById(pageNow.children ?? [], groupId) : null;
-      const groupAngle = groupNode && isGroup(groupNode) && typeof groupNode.angle === "number" ? groupNode.angle : void 0;
-      if (groupAngle !== void 0) selection.__pixldocsGroupAngle = groupAngle;
-      else delete selection.__pixldocsGroupAngle;
+      let groupAngle = groupNode && isGroup(groupNode) && typeof groupNode.angle === "number" ? groupNode.angle : void 0;
+      if (groupAngle === void 0 && groupNode && isGroup(groupNode)) {
+        try {
+          const kids = selection.getObjects();
+          const selectionMatrix = selection.calcTransformMatrix();
+          const worldAngles = kids.map((kid) => normalizeAngle180(fabric.util.qrDecompose(
+            fabric.util.multiplyTransformMatrices(
+              selectionMatrix,
+              kid.calcOwnMatrix()
+            )
+          ).angle ?? 0));
+          const buckets = [];
+          for (const angle of worldAngles) {
+            const bucket = buckets.find((candidate) => Math.abs(normalizeAngle180(candidate.angle - angle)) <= 2);
+            if (bucket) bucket.count += 1;
+            else buckets.push({ angle, count: 1 });
+          }
+          buckets.sort((a, b) => b.count - a.count || Math.abs(b.angle) - Math.abs(a.angle));
+          const inferredAngle = (_a2 = buckets[0]) == null ? void 0 : _a2.angle;
+          if (typeof inferredAngle === "number" && Number.isFinite(inferredAngle) && Math.abs(inferredAngle) > 0.01) {
+            groupAngle = inferredAngle;
+            useEditorStore.getState().updateNode(
+              groupId,
+              { angle: inferredAngle },
+              { recordHistory: false, skipLayoutRecalc: true }
+            );
+          }
+        } catch {
+        }
+      }
+      if (groupAngle !== void 0) {
+        selection.__pixldocsGroupAngle = groupAngle;
+        const aligned = selection.__pixldocsAlignedAngle;
+        if (typeof aligned === "number" && Math.abs(normalizeAngle180(aligned - groupAngle)) > 0.01) {
+          delete selection.__pixldocsAlignedAngle;
+        }
+      } else {
+        delete selection.__pixldocsGroupAngle;
+      }
       selection.hasBorders = true;
       const members = selection.getObjects();
       for (const prev of suppressGroupMemberBordersRef.current) {
@@ -11668,7 +11724,7 @@ const PageCanvas = forwardRef(
         if (m.__pixldocsOrigHasControls === void 0) m.__pixldocsOrigHasControls = m.hasControls;
         m.hasBorders = false;
         m.hasControls = false;
-        if (m.__cropGroup || ((_a2 = m._ct) == null ? void 0 : _a2.isCropGroup)) {
+        if (m.__cropGroup || ((_b2 = m._ct) == null ? void 0 : _b2.isCropGroup)) {
           if (m.__pixldocsOrigLockScalingX === void 0) {
             m.__pixldocsOrigLockScalingX = m.lockScalingX;
             m.__pixldocsOrigLockScalingY = m.lockScalingY;
@@ -11677,7 +11733,22 @@ const PageCanvas = forwardRef(
           m.lockScalingY = false;
         }
       }
-      applyWarpAwareSelectionBorders(selection, groupAngle);
+      const groupFrame = groupNode && isGroup(groupNode) ? (() => {
+        try {
+          const abs = getAbsoluteBounds(groupNode, (pageNow == null ? void 0 : pageNow.children) ?? []);
+          const storedW = Number(groupNode.width);
+          const storedH = Number(groupNode.height);
+          return {
+            left: abs.left,
+            top: abs.top,
+            width: Number.isFinite(storedW) && storedW > 0 ? storedW : abs.width,
+            height: Number.isFinite(storedH) && storedH > 0 ? storedH : abs.height
+          };
+        } catch {
+          return null;
+        }
+      })() : null;
+      applyWarpAwareSelectionBorders(selection, groupAngle, groupFrame);
     }, [pageId]);
     const pageBoundsOptions = useMemo(
       () => ({ pageContentWidth: canvasWidth, pageContentHeight: canvasHeight }),
@@ -11780,7 +11851,11 @@ const PageCanvas = forwardRef(
         const activeMembers = activeBeforeRestore.getObjects();
         const sameMembers = activeMembers.length === members.length && members.every((member) => activeMembers.includes(member));
         const sameGroup = activeBeforeRestore.__pixldocsGroupSelection === groupId;
-        const alreadyAligned = activeBeforeRestore.__pixldocsAlignedAngle != null;
+        const pageNow = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId);
+        const groupNode = pageNow ? findNodeById(pageNow.children ?? [], groupId) : null;
+        const savedAngle = groupNode && isGroup(groupNode) && typeof groupNode.angle === "number" ? groupNode.angle : null;
+        const alignedAngle = activeBeforeRestore.__pixldocsAlignedAngle;
+        const alreadyAligned = typeof alignedAngle === "number" && (savedAngle == null || Math.abs(normalizeAngle180(alignedAngle - savedAngle)) <= 0.01);
         if (sameMembers && sameGroup && alreadyAligned) {
           ensureCanvaControlRenders(activeBeforeRestore);
           return;
@@ -11797,9 +11872,11 @@ const PageCanvas = forwardRef(
           members.forEach((m) => m.setCoords());
         } catch {
         }
-        try {
-          (_a2 = selection.triggerLayout) == null ? void 0 : _a2.call(selection);
-        } catch {
+        if (!selection.__pixldocsGroupSelection) {
+          try {
+            (_a2 = selection.triggerLayout) == null ? void 0 : _a2.call(selection);
+          } catch {
+          }
         }
         selection.setCoords();
         fc.requestRenderAll();
@@ -13247,6 +13324,8 @@ const PageCanvas = forwardRef(
           selectionTop: rect.top,
           groupLeft: groupAbs.left,
           groupTop: groupAbs.top,
+          groupWidth: groupAbs.width,
+          groupHeight: groupAbs.height,
           selectionAngle: ((active.angle ?? 0) % 360 + 360) % 360
         };
         logRotDriftSelectionSnapshot("transform-start", active, {
@@ -13414,7 +13493,11 @@ const PageCanvas = forwardRef(
               const activeIds = active.getObjects().map((obj) => getObjectId(obj)).filter((id) => !!id && id !== "__background__");
               const sameMembers = activeIds.length === snapshot.memberIds.length && snapshot.memberIds.every((id) => activeIds.includes(id));
               const sameGroup = active.__pixldocsGroupSelection === snapshot.groupSelectionId;
-              const alreadyAligned = active.__pixldocsAlignedAngle != null;
+              const pageNow = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId);
+              const groupNode = pageNow ? findNodeById(pageNow.children ?? [], snapshot.groupSelectionId) : null;
+              const savedAngle = groupNode && isGroup(groupNode) && typeof groupNode.angle === "number" ? groupNode.angle : null;
+              const alignedAngle = active.__pixldocsAlignedAngle;
+              const alreadyAligned = typeof alignedAngle === "number" && (savedAngle == null || Math.abs(normalizeAngle180(alignedAngle - savedAngle)) <= 0.01);
               if (sameMembers && sameGroup && alreadyAligned) {
                 ensureCanvaControlRenders(active);
                 return;
@@ -13571,6 +13654,31 @@ const PageCanvas = forwardRef(
         }
         if (members.length === 0) return null;
         const savedGroupAngle = typeof g.angle === "number" && Number.isFinite(g.angle) ? normalizeAngle180(g.angle) : null;
+        const savedGroupWidth = Number(g.width);
+        const savedGroupHeight = Number(g.height);
+        if (savedGroupAngle != null && savedGroupWidth > 0 && savedGroupHeight > 0) {
+          const pageNow = useEditorStore.getState().canvas.pages.find((p) => p.id === pageId);
+          const pageChildrenNow = (pageNow == null ? void 0 : pageNow.children) ?? [];
+          const abs = getAbsoluteBounds(g, pageChildrenNow);
+          const cx = abs.left + savedGroupWidth / 2;
+          const cy = abs.top + savedGroupHeight / 2;
+          const rad2 = savedGroupAngle * Math.PI / 180;
+          const c = Math.cos(rad2), s = Math.sin(rad2);
+          const rotate = (x, y) => {
+            const dx = x - cx;
+            const dy = y - cy;
+            return { x: cx + dx * c - dy * s, y: cy + dx * s + dy * c };
+          };
+          return {
+            corners: [
+              rotate(abs.left, abs.top),
+              rotate(abs.left + savedGroupWidth, abs.top),
+              rotate(abs.left + savedGroupWidth, abs.top + savedGroupHeight),
+              rotate(abs.left, abs.top + savedGroupHeight)
+            ],
+            angle: savedGroupAngle
+          };
+        }
         const worldPoints = [];
         for (const m of members) {
           (_a2 = m.setCoords) == null ? void 0 : _a2.call(m);
@@ -14810,6 +14918,7 @@ const PageCanvas = forwardRef(
       fabricCanvas.on("object:rotating", (e) => {
         var _a2, _b2;
         markSimpleTransform(e);
+        prepareGroupSelectionTransformStart(e.target);
         didTransformRef.current = true;
         const tr = e.target;
         if (shouldLogRotDriftLiveTick(tr, "rotating")) {
@@ -14999,7 +15108,7 @@ const PageCanvas = forwardRef(
                     const groupLeft = fabricCenterX - w / 2;
                     const groupTop = fabricCenterY - h / 2;
                     const storePosGroup = absoluteToStorePosition(groupLeft, groupTop, movedGroupId, pageChildrenSec);
-                    useEditorStore.getState().updateNode(movedGroupId, { left: storePosGroup.left, top: storePosGroup.top }, { recordHistory: false, skipLayoutRecalc: true });
+                    useEditorStore.getState().updateNode(movedGroupId, { left: storePosGroup.left, top: storePosGroup.top, angle: fabricSectionGroup.angle ?? 0 }, { recordHistory: false, skipLayoutRecalc: true });
                   }
                   commitHistory();
                   unlockEditsSoon();
@@ -15142,7 +15251,7 @@ const PageCanvas = forwardRef(
               const groupLeft = centerX - w / 2;
               const groupTop = centerY - h / 2;
               const storePosGroup = absoluteToStorePosition(groupLeft, groupTop, groupId, pageChildrenSec);
-              useEditorStore.getState().updateNode(groupId, { left: storePosGroup.left, top: storePosGroup.top }, { recordHistory: false, skipLayoutRecalc: true });
+              useEditorStore.getState().updateNode(groupId, { left: storePosGroup.left, top: storePosGroup.top, angle: active.angle ?? 0 }, { recordHistory: false, skipLayoutRecalc: true });
             }
             const node = findNodeById(pageChildrenSec, groupId);
             if (isChildModified && node && !groupMoved) {
@@ -15171,7 +15280,7 @@ const PageCanvas = forwardRef(
             const groupLeft = active.originX === "center" ? centerX - w / 2 : centerX;
             const groupTop = active.originY === "center" ? centerY - h / 2 : centerY;
             const storePos = absoluteToStorePosition(groupLeft, groupTop, groupId, pageChildren3);
-            useEditorStore.getState().updateNode(groupId, { left: storePos.left, top: storePos.top }, { recordHistory: false, skipLayoutRecalc: true });
+            useEditorStore.getState().updateNode(groupId, { left: storePos.left, top: storePos.top, angle: active.angle ?? 0 }, { recordHistory: false, skipLayoutRecalc: true });
             commitHistory();
             unlockEditsSoon();
             return;
@@ -15996,9 +16105,11 @@ const PageCanvas = forwardRef(
               } catch {
               }
               fabricCanvas.setActiveObject(newSel);
-              try {
-                (_j = newSel.triggerLayout) == null ? void 0 : _j.call(newSel);
-              } catch {
+              if (!wasGroupSel) {
+                try {
+                  (_j = newSel.triggerLayout) == null ? void 0 : _j.call(newSel);
+                } catch {
+                }
               }
               try {
                 for (const member of membersToReselect) member.setCoords();
@@ -16375,7 +16486,12 @@ const PageCanvas = forwardRef(
               const prevAS = activeBeforeSync instanceof fabric.ActiveSelection ? activeBeforeSync : null;
               const prevMembers = prevAS ? prevAS.getObjects() : [];
               const sameMembers = !!prevAS && prevMembers.length === freshMembers.length && prevMembers.every((m) => freshMembers.includes(m));
-              const alreadyAligned = sameMembers && prevAS.__pixldocsAlignedAngle != null;
+              const savedSnapshotAngle = activeSelectionSnapshot.groupSelectionId ? (() => {
+                const groupNode = findNodeById(pageTree, activeSelectionSnapshot.groupSelectionId);
+                return groupNode && isGroup(groupNode) && typeof groupNode.angle === "number" ? groupNode.angle : null;
+              })() : null;
+              const prevAlignedAngle = sameMembers ? prevAS.__pixldocsAlignedAngle : null;
+              const alreadyAligned = sameMembers && typeof prevAlignedAngle === "number" && (savedSnapshotAngle == null || Math.abs(normalizeAngle180(prevAlignedAngle - savedSnapshotAngle)) <= 0.01);
               if (sameMembers && alreadyAligned) {
                 try {
                   ensureCanvaControlRenders(prevAS);
@@ -17417,11 +17533,10 @@ const PageCanvas = forwardRef(
         if (sameSelection && (isFlatGroupSelection || isPureSingleGroupSelection)) {
           if (selectedGroupSelectionId && active instanceof fabric.ActiveSelection) {
             if (isPureSingleGroupSelection) {
-              active.__pixldocsGroupSelection = selectedGroupSelectionId;
-              delete active.__pixldocsLogicalGroupIds;
-              suppressGroupMemberBordersRef.current = active.getObjects();
+              applyLogicalGroupSelectionVisualState(active, selectedGroupSelectionId);
             } else {
               delete active.__pixldocsGroupSelection;
+              delete active.__pixldocsGroupAngle;
               active.__pixldocsLogicalGroupIds = selectedGroupIds;
               active.hasBorders = true;
               suppressGroupMemberBordersRef.current = active.getObjects().filter((m) => {
@@ -17461,10 +17576,10 @@ const PageCanvas = forwardRef(
           const selection = new fabric.ActiveSelection(toSelect, { canvas: fc });
           if (selectedGroupSelectionId) {
             if (isPureSingleGroupSelection) {
-              selection.__pixldocsGroupSelection = selectedGroupSelectionId;
-              suppressGroupMemberBordersRef.current = toSelect;
+              applyLogicalGroupSelectionVisualState(selection, selectedGroupSelectionId);
             } else {
               selection.__pixldocsLogicalGroupIds = selectedGroupIds;
+              delete selection.__pixldocsGroupAngle;
               selection.hasBorders = true;
               suppressGroupMemberBordersRef.current = toSelect.filter((m) => {
                 const id = getObjectId(m);
@@ -25107,9 +25222,9 @@ function captureFabricCanvasSvgForPdf(fabricInstance, canvasWidth, canvasHeight)
   }
   return svgString;
 }
-const resolvedPackageVersion = "0.5.394";
+const resolvedPackageVersion = "0.5.395";
 const PACKAGE_VERSION = resolvedPackageVersion;
-const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.394";
+const DEPLOYMENT_VERSION_MARKER = "__PIXLDOCS_CANVAS_RENDERER_VERSION__:0.5.395";
 const roundParityValue = (value) => {
   if (typeof value !== "number") return value;
   return Number.isFinite(value) ? Number(value.toFixed(3)) : value;
@@ -25923,7 +26038,7 @@ class PixldocsRenderer {
         await this.waitForCanvasScene(container, cloned, i);
       }
       console.log(`[canvas-renderer][pdf-unified] mounted ${cloned.pages.length} page(s), handing off to client exportMultiPagePdf`);
-      const { exportMultiPagePdf, preparePagesForExport } = await import("./vectorPdfExport-BUj20FDX.js");
+      const { exportMultiPagePdf, preparePagesForExport } = await import("./vectorPdfExport-DXadS763.js");
       const prepared = preparePagesForExport(
         cloned.pages,
         canvasWidth,
@@ -28243,7 +28358,7 @@ async function prepareLiveCanvasSvgForPdf(rawSvg, pageWidth, pageHeight, pageKey
     if (options == null ? void 0 : options.stripPageBackground) stripRootPageBackgroundFromSvg(svgToDraw);
     sanitizeSvgTreeForPdf(svgToDraw);
     try {
-      const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await import("./vectorPdfExport-BUj20FDX.js");
+      const { bakeTextAnchorPositionsFromLiveSvg, logTextMeasurementDiagnostic } = await import("./vectorPdfExport-DXadS763.js");
       try {
         await logTextMeasurementDiagnostic(svgToDraw);
       } catch {
@@ -28643,4 +28758,4 @@ export {
   buildTeaserBlurFlatKeys as y,
   collectFontDescriptorsFromConfig as z
 };
-//# sourceMappingURL=index-CgnT1WJ6.js.map
+//# sourceMappingURL=index-Bl3vMS3U.js.map