Merge branch 'master' into mtolmacs/fix/z-ordering

Signed-off-by: Mark Tolmacs <mark@lazycat.hu>

packages/element/src/zindex.ts

@@ -409,8 +409,10 @@ const shiftElementsToEnd = (
   let trailingIndex: number;
   if (direction === "left") {
     if (containingFrame) {
-      leadingIndex = findIndex(elements, (el) =>
-        isOfTargetFrame(el, containingFrame),
+      leadingIndex = findIndex(
+        elements,
+        (el) =>
+          el.id !== containingFrame && isOfTargetFrame(el, containingFrame),
       );
     } else if (appState.editingGroupId) {
       const groupElements = getElementsInGroup(
@@ -428,8 +430,10 @@ const shiftElementsToEnd = (
     trailingIndex = indicesToMove[indicesToMove.length - 1];
   } else {
     if (containingFrame) {
-      trailingIndex = findLastIndex(elements, (el) =>
-        isOfTargetFrame(el, containingFrame),
+      trailingIndex = findLastIndex(
+        elements,
+        (el) =>
+          el.id !== containingFrame && isOfTargetFrame(el, containingFrame),
       );
     } else if (appState.editingGroupId) {
       const groupElements = getElementsInGroup(
@@ -499,10 +503,7 @@ function shiftElementsAccountingForFrames(
     }),
   );
 
-  const frameAwareContiguousElementsToMove: {
-    regularElements: ExcalidrawElement[];
-    frameChildren: Map<ExcalidrawFrameLikeElement["id"], ExcalidrawElement[]>;
-  } = { regularElements: [], frameChildren: new Map() };
+  const regularElements: ExcalidrawElement[] = [];
 
   const fullySelectedFrames = new Set<ExcalidrawFrameLikeElement["id"]>();
 
@@ -512,51 +513,33 @@ function shiftElementsAccountingForFrames(
     }
   }
 
+  const selectedFrameIds = new Set<ExcalidrawFrameLikeElement["id"]>();
+
   for (const element of allElements) {
     if (elementsToMove.has(element.id)) {
       if (
         isFrameLikeElement(element) ||
         (element.frameId && fullySelectedFrames.has(element.frameId))
       ) {
-        frameAwareContiguousElementsToMove.regularElements.push(element);
+        regularElements.push(element);
       } else if (!element.frameId) {
-        frameAwareContiguousElementsToMove.regularElements.push(element);
-      } else {
-        const frameChildren =
-          frameAwareContiguousElementsToMove.frameChildren.get(
-            element.frameId,
-          ) || [];
-        frameChildren.push(element);
-        frameAwareContiguousElementsToMove.frameChildren.set(
-          element.frameId,
-          frameChildren,
-        );
+        regularElements.push(element);
+      } else if (!selectedFrameIds.has(element.frameId)) {
+        selectedFrameIds.add(element.frameId);
+        regularElements.push(element);
       }
     }
   }
 
-  let nextElements = allElements;
-
-  const frameChildrenSets = Array.from(
-    frameAwareContiguousElementsToMove.frameChildren.entries(),
-  );
-
-  for (const [frameId, children] of frameChildrenSets) {
-    nextElements = shiftFunction(
-      allElements,
-      appState,
-      direction,
-      frameId,
-      children,
-    );
-  }
+  const containingFrame =
+    selectedFrameIds.size > 0 ? [...selectedFrameIds][0] : null;
 
   return shiftFunction(
-    nextElements,
+    allElements,
     appState,
     direction,
-    null,
-    frameAwareContiguousElementsToMove.regularElements,
+    containingFrame,
+    regularElements,
   );
 }