react-resizable-panels 2.0.10 → 2.0.12

package/dist/react-resizable-panels.node.cjs.js

@@ -235,15 +235,15 @@ function isTouchEvent(event) {
 function getResizeEventCoordinates(event) {
   if (isMouseEvent(event)) {
     return {
-      x: event.pageX,
-      y: event.pageY
+      x: event.clientX,
+      y: event.clientY
     };
   } else if (isTouchEvent(event)) {
     const touch = event.touches[0];
-    if (touch && touch.pageX && touch.pageY) {
+    if (touch && touch.clientX && touch.clientY) {
       return {
-        x: touch.pageX,
-        y: touch.pageY
+        x: touch.clientX,
+        y: touch.clientY
       };
     }
   }
@@ -658,6 +658,20 @@ function fuzzyNumbersEqual(actual, expected, fractionDigits) {
   return fuzzyCompareNumbers(actual, expected, fractionDigits) === 0;
 }
 
+function fuzzyLayoutsEqual(actual, expected, fractionDigits) {
+  if (actual.length !== expected.length) {
+    return false;
+  }
+  for (let index = 0; index < actual.length; index++) {
+    const actualSize = actual[index];
+    const expectedSize = expected[index];
+    if (!fuzzyNumbersEqual(actualSize, expectedSize, fractionDigits)) {
+      return false;
+    }
+  }
+  return true;
+}
+
 // Panel size must be in percentages; pixel values should be pre-converted
 function resizePanel({
   panelConstraints: panelConstraintsArray,
@@ -693,26 +707,29 @@ function resizePanel({
 // All units must be in percentages; pixel values should be pre-converted
 function adjustLayoutByDelta({
   delta,
-  layout: prevLayout,
+  initialLayout,
   panelConstraints: panelConstraintsArray,
   pivotIndices,
+  prevLayout,
   trigger
 }) {
   if (fuzzyNumbersEqual(delta, 0)) {
-    return prevLayout;
+    return initialLayout;
   }
-  const nextLayout = [...prevLayout];
+  const nextLayout = [...initialLayout];
   const [firstPivotIndex, secondPivotIndex] = pivotIndices;
   assert(firstPivotIndex != null, "Invalid first pivot index");
   assert(secondPivotIndex != null, "Invalid second pivot index");
   let deltaApplied = 0;
 
-  //const DEBUG = [];
-  //DEBUG.push(`adjustLayoutByDelta() ${prevLayout.join(", ")}`);
-  //DEBUG.push(`  delta: ${delta}`);
-  //DEBUG.push(`  pivotIndices: ${pivotIndices.join(", ")}`);
-  //DEBUG.push(`  trigger: ${trigger}`);
-  //DEBUG.push("");
+  // const DEBUG = [];
+  // DEBUG.push(`adjustLayoutByDelta()`);
+  // DEBUG.push(`  initialLayout: ${initialLayout.join(", ")}`);
+  // DEBUG.push(`  prevLayout: ${prevLayout.join(", ")}`);
+  // DEBUG.push(`  delta: ${delta}`);
+  // DEBUG.push(`  pivotIndices: ${pivotIndices.join(", ")}`);
+  // DEBUG.push(`  trigger: ${trigger}`);
+  // DEBUG.push("");
 
   // A resizing panel affects the panels before or after it.
   //
@@ -737,18 +754,18 @@ function adjustLayoutByDelta({
           minSize = 0
         } = panelConstraints;
 
-        //DEBUG.push(`edge case check 1: ${index}`);
-        //DEBUG.push(`  -> collapsible? ${constraints.collapsible}`);
+        // DEBUG.push(`edge case check 1: ${index}`);
+        // DEBUG.push(`  -> collapsible? ${collapsible}`);
         if (collapsible) {
-          const prevSize = prevLayout[index];
+          const prevSize = initialLayout[index];
           assert(prevSize != null, `Previous layout not found for panel index ${index}`);
           if (fuzzyNumbersEqual(prevSize, collapsedSize)) {
             const localDelta = minSize - prevSize;
-            //DEBUG.push(`  -> expand delta: ${localDelta}`);
+            // DEBUG.push(`  -> expand delta: ${localDelta}`);
 
             if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
               delta = delta < 0 ? 0 - localDelta : localDelta;
-              //DEBUG.push(`  -> delta: ${delta}`);
+              // DEBUG.push(`  -> delta: ${delta}`);
             }
           }
         }
@@ -765,24 +782,24 @@ function adjustLayoutByDelta({
           minSize = 0
         } = panelConstraints;
 
-        //DEBUG.push(`edge case check 2: ${index}`);
-        //DEBUG.push(`  -> collapsible? ${collapsible}`);
+        // DEBUG.push(`edge case check 2: ${index}`);
+        // DEBUG.push(`  -> collapsible? ${collapsible}`);
         if (collapsible) {
-          const prevSize = prevLayout[index];
+          const prevSize = initialLayout[index];
           assert(prevSize != null, `Previous layout not found for panel index ${index}`);
           if (fuzzyNumbersEqual(prevSize, minSize)) {
             const localDelta = prevSize - collapsedSize;
-            //DEBUG.push(`  -> expand delta: ${localDelta}`);
+            // DEBUG.push(`  -> expand delta: ${localDelta}`);
 
             if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
               delta = delta < 0 ? 0 - localDelta : localDelta;
-              //DEBUG.push(`  -> delta: ${delta}`);
+              // DEBUG.push(`  -> delta: ${delta}`);
             }
           }
         }
       }
     }
-    //DEBUG.push("");
+    // DEBUG.push("");
   }
 
   {
@@ -796,9 +813,9 @@ function adjustLayoutByDelta({
     let index = delta < 0 ? secondPivotIndex : firstPivotIndex;
     let maxAvailableDelta = 0;
 
-    //DEBUG.push("pre calc...");
+    // DEBUG.push("pre calc...");
     while (true) {
-      const prevSize = prevLayout[index];
+      const prevSize = initialLayout[index];
       assert(prevSize != null, `Previous layout not found for panel index ${index}`);
       const maxSafeSize = resizePanel({
         panelConstraints: panelConstraintsArray,
@@ -806,7 +823,7 @@ function adjustLayoutByDelta({
         size: 100
       });
       const delta = maxSafeSize - prevSize;
-      //DEBUG.push(`  ${index}: ${prevSize} -> ${maxSafeSize}`);
+      // DEBUG.push(`  ${index}: ${prevSize} -> ${maxSafeSize}`);
 
       maxAvailableDelta += delta;
       index += increment;
@@ -815,11 +832,11 @@ function adjustLayoutByDelta({
       }
     }
 
-    //DEBUG.push(`  -> max available delta: ${maxAvailableDelta}`);
+    // DEBUG.push(`  -> max available delta: ${maxAvailableDelta}`);
     const minAbsDelta = Math.min(Math.abs(delta), Math.abs(maxAvailableDelta));
     delta = delta < 0 ? 0 - minAbsDelta : minAbsDelta;
-    //DEBUG.push(`  -> adjusted delta: ${delta}`);
-    //DEBUG.push("");
+    // DEBUG.push(`  -> adjusted delta: ${delta}`);
+    // DEBUG.push("");
   }
 
   {
@@ -829,7 +846,7 @@ function adjustLayoutByDelta({
     let index = pivotIndex;
     while (index >= 0 && index < panelConstraintsArray.length) {
       const deltaRemaining = Math.abs(delta) - Math.abs(deltaApplied);
-      const prevSize = prevLayout[index];
+      const prevSize = initialLayout[index];
       assert(prevSize != null, `Previous layout not found for panel index ${index}`);
       const unsafeSize = prevSize - deltaRemaining;
       const safeSize = resizePanel({
@@ -853,20 +870,22 @@ function adjustLayoutByDelta({
       }
     }
   }
-  //DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
-  //DEBUG.push(`  deltaApplied: ${deltaApplied}`);
-  //DEBUG.push("");
+  // DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
+  // DEBUG.push(`  deltaApplied: ${deltaApplied}`);
+  // DEBUG.push("");
 
   // If we were unable to resize any of the panels panels, return the previous state.
   // This will essentially bailout and ignore e.g. drags past a panel's boundaries
-  if (fuzzyNumbersEqual(deltaApplied, 0)) {
-    //console.log(DEBUG.join("\n"));
+  if (fuzzyLayoutsEqual(prevLayout, nextLayout)) {
+    // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
+    // console.log(DEBUG.join("\n"));
+
     return prevLayout;
   }
   {
     // Now distribute the applied delta to the panels in the other direction
     const pivotIndex = delta < 0 ? secondPivotIndex : firstPivotIndex;
-    const prevSize = prevLayout[pivotIndex];
+    const prevSize = initialLayout[pivotIndex];
     assert(prevSize != null, `Previous layout not found for panel index ${pivotIndex}`);
     const unsafeSize = prevSize + deltaApplied;
     const safeSize = resizePanel({
@@ -907,17 +926,23 @@ function adjustLayoutByDelta({
       }
     }
   }
-  //DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
-  //DEBUG.push(`  deltaApplied: ${deltaApplied}`);
-  //DEBUG.push("");
+  // DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
+  // DEBUG.push(`  deltaApplied: ${deltaApplied}`);
+  // DEBUG.push("");
 
   const totalSize = nextLayout.reduce((total, size) => size + total, 0);
-  //DEBUG.push(`total size: ${totalSize}`);
-  //console.log(DEBUG.join("\n"));
+  // DEBUG.push(`total size: ${totalSize}`);
 
+  // If our new layout doesn't add up to 100%, that means the requested delta can't be applied
+  // In that case, fall back to our most recent valid layout
   if (!fuzzyNumbersEqual(totalSize, 100)) {
+    // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
+    // console.log(DEBUG.join("\n"));
+
     return prevLayout;
   }
+
+  // console.log(DEBUG.join("\n"));
   return nextLayout;
 }
 
@@ -1024,9 +1049,10 @@ function useWindowSplitterPanelGroupBehavior({
                 if (size != null && collapsible) {
                   const nextLayout = adjustLayoutByDelta({
                     delta: fuzzyNumbersEqual(size, collapsedSize) ? minSize - collapsedSize : collapsedSize - size,
-                    layout,
+                    initialLayout: layout,
                     panelConstraints: panelDataArray.map(panelData => panelData.constraints),
                     pivotIndices: determinePivotIndices(groupId, handleId, panelGroupElement),
+                    prevLayout: layout,
                     trigger: "keyboard"
                   });
                   if (layout !== nextLayout) {
@@ -1513,9 +1539,10 @@ function PanelGroupWithForwardedRef({
         const delta = isLastPanel ? panelSize - collapsedSize : collapsedSize - panelSize;
         const nextLayout = adjustLayoutByDelta({
           delta,
-          layout: prevLayout,
+          initialLayout: prevLayout,
           panelConstraints: panelConstraintsArray,
           pivotIndices,
+          prevLayout,
           trigger: "imperative-api"
         });
         if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1555,9 +1582,10 @@ function PanelGroupWithForwardedRef({
         const delta = isLastPanel ? panelSize - baseSize : baseSize - panelSize;
         const nextLayout = adjustLayoutByDelta({
           delta,
-          layout: prevLayout,
+          initialLayout: prevLayout,
           panelConstraints: panelConstraintsArray,
           pivotIndices,
+          prevLayout,
           trigger: "imperative-api"
         });
         if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1683,9 +1711,10 @@ function PanelGroupWithForwardedRef({
       const panelConstraints = panelDataArray.map(panelData => panelData.constraints);
       const nextLayout = adjustLayoutByDelta({
         delta,
-        layout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
+        initialLayout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
         panelConstraints,
         pivotIndices,
+        prevLayout,
         trigger: isKeyDown(event) ? "keyboard" : "mouse-or-touch"
       });
       const layoutChanged = !compareLayouts(prevLayout, nextLayout);
@@ -1741,9 +1770,10 @@ function PanelGroupWithForwardedRef({
     const delta = isLastPanel ? panelSize - unsafePanelSize : unsafePanelSize - panelSize;
     const nextLayout = adjustLayoutByDelta({
       delta,
-      layout: prevLayout,
+      initialLayout: prevLayout,
       panelConstraints: panelConstraintsArray,
       pivotIndices,
+      prevLayout,
       trigger: "imperative-api"
     });
     if (!compareLayouts(prevLayout, nextLayout)) {

package/dist/react-resizable-panels.node.esm.js

@@ -211,15 +211,15 @@ function isTouchEvent(event) {
 function getResizeEventCoordinates(event) {
   if (isMouseEvent(event)) {
     return {
-      x: event.pageX,
-      y: event.pageY
+      x: event.clientX,
+      y: event.clientY
     };
   } else if (isTouchEvent(event)) {
     const touch = event.touches[0];
-    if (touch && touch.pageX && touch.pageY) {
+    if (touch && touch.clientX && touch.clientY) {
       return {
-        x: touch.pageX,
-        y: touch.pageY
+        x: touch.clientX,
+        y: touch.clientY
       };
     }
   }
@@ -634,6 +634,20 @@ function fuzzyNumbersEqual(actual, expected, fractionDigits) {
   return fuzzyCompareNumbers(actual, expected, fractionDigits) === 0;
 }
 
+function fuzzyLayoutsEqual(actual, expected, fractionDigits) {
+  if (actual.length !== expected.length) {
+    return false;
+  }
+  for (let index = 0; index < actual.length; index++) {
+    const actualSize = actual[index];
+    const expectedSize = expected[index];
+    if (!fuzzyNumbersEqual(actualSize, expectedSize, fractionDigits)) {
+      return false;
+    }
+  }
+  return true;
+}
+
 // Panel size must be in percentages; pixel values should be pre-converted
 function resizePanel({
   panelConstraints: panelConstraintsArray,
@@ -669,26 +683,29 @@ function resizePanel({
 // All units must be in percentages; pixel values should be pre-converted
 function adjustLayoutByDelta({
   delta,
-  layout: prevLayout,
+  initialLayout,
   panelConstraints: panelConstraintsArray,
   pivotIndices,
+  prevLayout,
   trigger
 }) {
   if (fuzzyNumbersEqual(delta, 0)) {
-    return prevLayout;
+    return initialLayout;
   }
-  const nextLayout = [...prevLayout];
+  const nextLayout = [...initialLayout];
   const [firstPivotIndex, secondPivotIndex] = pivotIndices;
   assert(firstPivotIndex != null, "Invalid first pivot index");
   assert(secondPivotIndex != null, "Invalid second pivot index");
   let deltaApplied = 0;
 
-  //const DEBUG = [];
-  //DEBUG.push(`adjustLayoutByDelta() ${prevLayout.join(", ")}`);
-  //DEBUG.push(`  delta: ${delta}`);
-  //DEBUG.push(`  pivotIndices: ${pivotIndices.join(", ")}`);
-  //DEBUG.push(`  trigger: ${trigger}`);
-  //DEBUG.push("");
+  // const DEBUG = [];
+  // DEBUG.push(`adjustLayoutByDelta()`);
+  // DEBUG.push(`  initialLayout: ${initialLayout.join(", ")}`);
+  // DEBUG.push(`  prevLayout: ${prevLayout.join(", ")}`);
+  // DEBUG.push(`  delta: ${delta}`);
+  // DEBUG.push(`  pivotIndices: ${pivotIndices.join(", ")}`);
+  // DEBUG.push(`  trigger: ${trigger}`);
+  // DEBUG.push("");
 
   // A resizing panel affects the panels before or after it.
   //
@@ -713,18 +730,18 @@ function adjustLayoutByDelta({
           minSize = 0
         } = panelConstraints;
 
-        //DEBUG.push(`edge case check 1: ${index}`);
-        //DEBUG.push(`  -> collapsible? ${constraints.collapsible}`);
+        // DEBUG.push(`edge case check 1: ${index}`);
+        // DEBUG.push(`  -> collapsible? ${collapsible}`);
         if (collapsible) {
-          const prevSize = prevLayout[index];
+          const prevSize = initialLayout[index];
           assert(prevSize != null, `Previous layout not found for panel index ${index}`);
           if (fuzzyNumbersEqual(prevSize, collapsedSize)) {
             const localDelta = minSize - prevSize;
-            //DEBUG.push(`  -> expand delta: ${localDelta}`);
+            // DEBUG.push(`  -> expand delta: ${localDelta}`);
 
             if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
               delta = delta < 0 ? 0 - localDelta : localDelta;
-              //DEBUG.push(`  -> delta: ${delta}`);
+              // DEBUG.push(`  -> delta: ${delta}`);
             }
           }
         }
@@ -741,24 +758,24 @@ function adjustLayoutByDelta({
           minSize = 0
         } = panelConstraints;
 
-        //DEBUG.push(`edge case check 2: ${index}`);
-        //DEBUG.push(`  -> collapsible? ${collapsible}`);
+        // DEBUG.push(`edge case check 2: ${index}`);
+        // DEBUG.push(`  -> collapsible? ${collapsible}`);
         if (collapsible) {
-          const prevSize = prevLayout[index];
+          const prevSize = initialLayout[index];
           assert(prevSize != null, `Previous layout not found for panel index ${index}`);
           if (fuzzyNumbersEqual(prevSize, minSize)) {
             const localDelta = prevSize - collapsedSize;
-            //DEBUG.push(`  -> expand delta: ${localDelta}`);
+            // DEBUG.push(`  -> expand delta: ${localDelta}`);
 
             if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
               delta = delta < 0 ? 0 - localDelta : localDelta;
-              //DEBUG.push(`  -> delta: ${delta}`);
+              // DEBUG.push(`  -> delta: ${delta}`);
             }
           }
         }
       }
     }
-    //DEBUG.push("");
+    // DEBUG.push("");
   }
 
   {
@@ -772,9 +789,9 @@ function adjustLayoutByDelta({
     let index = delta < 0 ? secondPivotIndex : firstPivotIndex;
     let maxAvailableDelta = 0;
 
-    //DEBUG.push("pre calc...");
+    // DEBUG.push("pre calc...");
     while (true) {
-      const prevSize = prevLayout[index];
+      const prevSize = initialLayout[index];
       assert(prevSize != null, `Previous layout not found for panel index ${index}`);
       const maxSafeSize = resizePanel({
         panelConstraints: panelConstraintsArray,
@@ -782,7 +799,7 @@ function adjustLayoutByDelta({
         size: 100
       });
       const delta = maxSafeSize - prevSize;
-      //DEBUG.push(`  ${index}: ${prevSize} -> ${maxSafeSize}`);
+      // DEBUG.push(`  ${index}: ${prevSize} -> ${maxSafeSize}`);
 
       maxAvailableDelta += delta;
       index += increment;
@@ -791,11 +808,11 @@ function adjustLayoutByDelta({
       }
     }
 
-    //DEBUG.push(`  -> max available delta: ${maxAvailableDelta}`);
+    // DEBUG.push(`  -> max available delta: ${maxAvailableDelta}`);
     const minAbsDelta = Math.min(Math.abs(delta), Math.abs(maxAvailableDelta));
     delta = delta < 0 ? 0 - minAbsDelta : minAbsDelta;
-    //DEBUG.push(`  -> adjusted delta: ${delta}`);
-    //DEBUG.push("");
+    // DEBUG.push(`  -> adjusted delta: ${delta}`);
+    // DEBUG.push("");
   }
 
   {
@@ -805,7 +822,7 @@ function adjustLayoutByDelta({
     let index = pivotIndex;
     while (index >= 0 && index < panelConstraintsArray.length) {
       const deltaRemaining = Math.abs(delta) - Math.abs(deltaApplied);
-      const prevSize = prevLayout[index];
+      const prevSize = initialLayout[index];
       assert(prevSize != null, `Previous layout not found for panel index ${index}`);
       const unsafeSize = prevSize - deltaRemaining;
       const safeSize = resizePanel({
@@ -829,20 +846,22 @@ function adjustLayoutByDelta({
       }
     }
   }
-  //DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
-  //DEBUG.push(`  deltaApplied: ${deltaApplied}`);
-  //DEBUG.push("");
+  // DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
+  // DEBUG.push(`  deltaApplied: ${deltaApplied}`);
+  // DEBUG.push("");
 
   // If we were unable to resize any of the panels panels, return the previous state.
   // This will essentially bailout and ignore e.g. drags past a panel's boundaries
-  if (fuzzyNumbersEqual(deltaApplied, 0)) {
-    //console.log(DEBUG.join("\n"));
+  if (fuzzyLayoutsEqual(prevLayout, nextLayout)) {
+    // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
+    // console.log(DEBUG.join("\n"));
+
     return prevLayout;
   }
   {
     // Now distribute the applied delta to the panels in the other direction
     const pivotIndex = delta < 0 ? secondPivotIndex : firstPivotIndex;
-    const prevSize = prevLayout[pivotIndex];
+    const prevSize = initialLayout[pivotIndex];
     assert(prevSize != null, `Previous layout not found for panel index ${pivotIndex}`);
     const unsafeSize = prevSize + deltaApplied;
     const safeSize = resizePanel({
@@ -883,17 +902,23 @@ function adjustLayoutByDelta({
       }
     }
   }
-  //DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
-  //DEBUG.push(`  deltaApplied: ${deltaApplied}`);
-  //DEBUG.push("");
+  // DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
+  // DEBUG.push(`  deltaApplied: ${deltaApplied}`);
+  // DEBUG.push("");
 
   const totalSize = nextLayout.reduce((total, size) => size + total, 0);
-  //DEBUG.push(`total size: ${totalSize}`);
-  //console.log(DEBUG.join("\n"));
+  // DEBUG.push(`total size: ${totalSize}`);
 
+  // If our new layout doesn't add up to 100%, that means the requested delta can't be applied
+  // In that case, fall back to our most recent valid layout
   if (!fuzzyNumbersEqual(totalSize, 100)) {
+    // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
+    // console.log(DEBUG.join("\n"));
+
     return prevLayout;
   }
+
+  // console.log(DEBUG.join("\n"));
   return nextLayout;
 }
 
@@ -1000,9 +1025,10 @@ function useWindowSplitterPanelGroupBehavior({
                 if (size != null && collapsible) {
                   const nextLayout = adjustLayoutByDelta({
                     delta: fuzzyNumbersEqual(size, collapsedSize) ? minSize - collapsedSize : collapsedSize - size,
-                    layout,
+                    initialLayout: layout,
                     panelConstraints: panelDataArray.map(panelData => panelData.constraints),
                     pivotIndices: determinePivotIndices(groupId, handleId, panelGroupElement),
+                    prevLayout: layout,
                     trigger: "keyboard"
                   });
                   if (layout !== nextLayout) {
@@ -1489,9 +1515,10 @@ function PanelGroupWithForwardedRef({
         const delta = isLastPanel ? panelSize - collapsedSize : collapsedSize - panelSize;
         const nextLayout = adjustLayoutByDelta({
           delta,
-          layout: prevLayout,
+          initialLayout: prevLayout,
           panelConstraints: panelConstraintsArray,
           pivotIndices,
+          prevLayout,
           trigger: "imperative-api"
         });
         if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1531,9 +1558,10 @@ function PanelGroupWithForwardedRef({
         const delta = isLastPanel ? panelSize - baseSize : baseSize - panelSize;
         const nextLayout = adjustLayoutByDelta({
           delta,
-          layout: prevLayout,
+          initialLayout: prevLayout,
           panelConstraints: panelConstraintsArray,
           pivotIndices,
+          prevLayout,
           trigger: "imperative-api"
         });
         if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1659,9 +1687,10 @@ function PanelGroupWithForwardedRef({
       const panelConstraints = panelDataArray.map(panelData => panelData.constraints);
       const nextLayout = adjustLayoutByDelta({
         delta,
-        layout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
+        initialLayout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
         panelConstraints,
         pivotIndices,
+        prevLayout,
         trigger: isKeyDown(event) ? "keyboard" : "mouse-or-touch"
       });
       const layoutChanged = !compareLayouts(prevLayout, nextLayout);
@@ -1717,9 +1746,10 @@ function PanelGroupWithForwardedRef({
     const delta = isLastPanel ? panelSize - unsafePanelSize : unsafePanelSize - panelSize;
     const nextLayout = adjustLayoutByDelta({
       delta,
-      layout: prevLayout,
+      initialLayout: prevLayout,
       panelConstraints: panelConstraintsArray,
       pivotIndices,
+      prevLayout,
       trigger: "imperative-api"
     });
     if (!compareLayouts(prevLayout, nextLayout)) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-resizable-panels",
-  "version": "2.0.10",
+  "version": "2.0.12",
   "description": "React components for resizable panel groups/layouts",
   "author": "Brian Vaughn <brian.david.vaughn@gmail.com>",
   "license": "MIT",

package/src/PanelGroup.ts

@@ -355,9 +355,10 @@ function PanelGroupWithForwardedRef({
 
         const nextLayout = adjustLayoutByDelta({
           delta,
-          layout: prevLayout,
+          initialLayout: prevLayout,
           panelConstraints: panelConstraintsArray,
           pivotIndices,
+          prevLayout,
           trigger: "imperative-api",
         });
 
@@ -415,9 +416,10 @@ function PanelGroupWithForwardedRef({
 
         const nextLayout = adjustLayoutByDelta({
           delta,
-          layout: prevLayout,
+          initialLayout: prevLayout,
           panelConstraints: panelConstraintsArray,
           pivotIndices,
+          prevLayout,
           trigger: "imperative-api",
         });
 
@@ -636,9 +638,10 @@ function PanelGroupWithForwardedRef({
 
       const nextLayout = adjustLayoutByDelta({
         delta,
-        layout: initialLayout ?? prevLayout,
+        initialLayout: initialLayout ?? prevLayout,
         panelConstraints,
         pivotIndices,
+        prevLayout,
         trigger: isKeyDown(event) ? "keyboard" : "mouse-or-touch",
       });
 
@@ -722,9 +725,10 @@ function PanelGroupWithForwardedRef({
 
       const nextLayout = adjustLayoutByDelta({
         delta,
-        layout: prevLayout,
+        initialLayout: prevLayout,
         panelConstraints: panelConstraintsArray,
         pivotIndices,
+        prevLayout,
         trigger: "imperative-api",
       });
 

package/src/hooks/useWindowSplitterPanelGroupBehavior.ts

@@ -157,7 +157,7 @@ export function useWindowSplitterPanelGroupBehavior({
                   delta: fuzzyNumbersEqual(size, collapsedSize)
                     ? minSize - collapsedSize
                     : collapsedSize - size,
-                  layout,
+                  initialLayout: layout,
                   panelConstraints: panelDataArray.map(
                     (panelData) => panelData.constraints
                   ),
@@ -166,6 +166,7 @@ export function useWindowSplitterPanelGroupBehavior({
                     handleId,
                     panelGroupElement
                   ),
+                  prevLayout: layout,
                   trigger: "keyboard",
                 });
                 if (layout !== nextLayout) {