react-resizable-panels 2.0.11 → 2.0.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (26) hide show
  1. package/.parcel-cache/0e613961dce44a82 +0 -0
  2. package/.parcel-cache/13776de4870b0ae4.txt +2 -0
  3. package/.parcel-cache/35c20fb91e350b46 +0 -0
  4. package/.parcel-cache/data.mdb +0 -0
  5. package/.parcel-cache/lock.mdb +0 -0
  6. package/CHANGELOG.md +8 -0
  7. package/LICENSE +21 -0
  8. package/dist/react-resizable-panels.browser.cjs.js +84 -47
  9. package/dist/react-resizable-panels.browser.development.cjs.js +84 -47
  10. package/dist/react-resizable-panels.browser.development.esm.js +84 -47
  11. package/dist/react-resizable-panels.browser.esm.js +84 -47
  12. package/dist/react-resizable-panels.cjs.js +84 -47
  13. package/dist/react-resizable-panels.development.cjs.js +84 -47
  14. package/dist/react-resizable-panels.development.esm.js +84 -47
  15. package/dist/react-resizable-panels.development.node.cjs.js +84 -47
  16. package/dist/react-resizable-panels.development.node.esm.js +84 -47
  17. package/dist/react-resizable-panels.esm.js +84 -47
  18. package/dist/react-resizable-panels.node.cjs.js +84 -47
  19. package/dist/react-resizable-panels.node.esm.js +84 -47
  20. package/package.json +9 -9
  21. package/src/PanelGroup.ts +8 -4
  22. package/src/hooks/useWindowSplitterPanelGroupBehavior.ts +2 -1
  23. package/src/utils/adjustLayoutByDelta.test.ts +268 -115
  24. package/src/utils/adjustLayoutByDelta.ts +51 -39
  25. package/src/utils/numbers/fuzzyLayoutsEqual.ts +22 -0
  26. package/src/vendor/stacking-order.ts +10 -4
package/dist/react-resizable-panels.cjs.js CHANGED
@@ -351,7 +351,9 @@ const props = /\b(?:position|zIndex|opacity|transform|webkitTransform|mixBlendMo
351
351
 
352
352
  /** @param {HTMLElement} node */
353
353
  function is_flex_item(node) {
354
- const display = getComputedStyle(get_parent(node)).display;
354
+ var _get_parent;
355
+ // @ts-ignore
356
+ const display = getComputedStyle((_get_parent = get_parent(node)) !== null && _get_parent !== void 0 ? _get_parent : node).display;
355
357
  return display === "flex" || display === "inline-flex";
356
358
  }
357
359
 
@@ -401,6 +403,7 @@ function get_ancestors(node) {
401
403
  const ancestors = [];
402
404
  while (node) {
403
405
  ancestors.push(node);
406
+ // @ts-ignore
404
407
  node = get_parent(node);
405
408
  }
406
409
  return ancestors; // [ node, ... <body>, <html>, document ]
@@ -408,9 +411,13 @@ function get_ancestors(node) {
408
411
 
409
412
  /** @param {HTMLElement} node */
410
413
  function get_parent(node) {
411
- var _node$parentNode;
412
- // @ts-ignore
413
- return ((_node$parentNode = node.parentNode) === null || _node$parentNode === void 0 ? void 0 : _node$parentNode.host) || node.parentNode;
414
+ const {
415
+ parentNode
416
+ } = node;
417
+ if (parentNode && parentNode instanceof ShadowRoot) {
418
+ return parentNode.host;
419
+ }
420
+ return parentNode;
414
421
  }
415
422
 
416
423
  const EXCEEDED_HORIZONTAL_MIN = 0b0001;
@@ -696,6 +703,20 @@ function fuzzyNumbersEqual(actual, expected, fractionDigits) {
696
703
  return fuzzyCompareNumbers(actual, expected, fractionDigits) === 0;
697
704
  }
698
705
 
706
+ function fuzzyLayoutsEqual(actual, expected, fractionDigits) {
707
+ if (actual.length !== expected.length) {
708
+ return false;
709
+ }
710
+ for (let index = 0; index < actual.length; index++) {
711
+ const actualSize = actual[index];
712
+ const expectedSize = expected[index];
713
+ if (!fuzzyNumbersEqual(actualSize, expectedSize, fractionDigits)) {
714
+ return false;
715
+ }
716
+ }
717
+ return true;
718
+ }
719
+
699
720
  // Panel size must be in percentages; pixel values should be pre-converted
700
721
  function resizePanel({
701
722
  panelConstraints: panelConstraintsArray,
@@ -731,26 +752,29 @@ function resizePanel({
731
752
  // All units must be in percentages; pixel values should be pre-converted
732
753
  function adjustLayoutByDelta({
733
754
  delta,
734
- layout: prevLayout,
755
+ initialLayout,
735
756
  panelConstraints: panelConstraintsArray,
736
757
  pivotIndices,
758
+ prevLayout,
737
759
  trigger
738
760
  }) {
739
761
  if (fuzzyNumbersEqual(delta, 0)) {
740
- return prevLayout;
762
+ return initialLayout;
741
763
  }
742
- const nextLayout = [...prevLayout];
764
+ const nextLayout = [...initialLayout];
743
765
  const [firstPivotIndex, secondPivotIndex] = pivotIndices;
744
766
  assert(firstPivotIndex != null, "Invalid first pivot index");
745
767
  assert(secondPivotIndex != null, "Invalid second pivot index");
746
768
  let deltaApplied = 0;
747
769
 
748
- //const DEBUG = [];
749
- //DEBUG.push(`adjustLayoutByDelta() ${prevLayout.join(", ")}`);
750
- //DEBUG.push(` delta: ${delta}`);
751
- //DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
752
- //DEBUG.push(` trigger: ${trigger}`);
753
- //DEBUG.push("");
770
+ // const DEBUG = [];
771
+ // DEBUG.push(`adjustLayoutByDelta()`);
772
+ // DEBUG.push(` initialLayout: ${initialLayout.join(", ")}`);
773
+ // DEBUG.push(` prevLayout: ${prevLayout.join(", ")}`);
774
+ // DEBUG.push(` delta: ${delta}`);
775
+ // DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
776
+ // DEBUG.push(` trigger: ${trigger}`);
777
+ // DEBUG.push("");
754
778
 
755
779
  // A resizing panel affects the panels before or after it.
756
780
  //
@@ -775,18 +799,18 @@ function adjustLayoutByDelta({
775
799
  minSize = 0
776
800
  } = panelConstraints;
777
801
 
778
- //DEBUG.push(`edge case check 1: ${index}`);
779
- //DEBUG.push(` -> collapsible? ${constraints.collapsible}`);
802
+ // DEBUG.push(`edge case check 1: ${index}`);
803
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
780
804
  if (collapsible) {
781
- const prevSize = prevLayout[index];
805
+ const prevSize = initialLayout[index];
782
806
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
783
807
  if (fuzzyNumbersEqual(prevSize, collapsedSize)) {
784
808
  const localDelta = minSize - prevSize;
785
- //DEBUG.push(` -> expand delta: ${localDelta}`);
809
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
786
810
 
787
811
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
788
812
  delta = delta < 0 ? 0 - localDelta : localDelta;
789
- //DEBUG.push(` -> delta: ${delta}`);
813
+ // DEBUG.push(` -> delta: ${delta}`);
790
814
  }
791
815
  }
792
816
  }
@@ -803,24 +827,24 @@ function adjustLayoutByDelta({
803
827
  minSize = 0
804
828
  } = panelConstraints;
805
829
 
806
- //DEBUG.push(`edge case check 2: ${index}`);
807
- //DEBUG.push(` -> collapsible? ${collapsible}`);
830
+ // DEBUG.push(`edge case check 2: ${index}`);
831
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
808
832
  if (collapsible) {
809
- const prevSize = prevLayout[index];
833
+ const prevSize = initialLayout[index];
810
834
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
811
835
  if (fuzzyNumbersEqual(prevSize, minSize)) {
812
836
  const localDelta = prevSize - collapsedSize;
813
- //DEBUG.push(` -> expand delta: ${localDelta}`);
837
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
814
838
 
815
839
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
816
840
  delta = delta < 0 ? 0 - localDelta : localDelta;
817
- //DEBUG.push(` -> delta: ${delta}`);
841
+ // DEBUG.push(` -> delta: ${delta}`);
818
842
  }
819
843
  }
820
844
  }
821
845
  }
822
846
  }
823
- //DEBUG.push("");
847
+ // DEBUG.push("");
824
848
  }
825
849
 
826
850
  {
@@ -834,9 +858,9 @@ function adjustLayoutByDelta({
834
858
  let index = delta < 0 ? secondPivotIndex : firstPivotIndex;
835
859
  let maxAvailableDelta = 0;
836
860
 
837
- //DEBUG.push("pre calc...");
861
+ // DEBUG.push("pre calc...");
838
862
  while (true) {
839
- const prevSize = prevLayout[index];
863
+ const prevSize = initialLayout[index];
840
864
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
841
865
  const maxSafeSize = resizePanel({
842
866
  panelConstraints: panelConstraintsArray,
@@ -844,7 +868,7 @@ function adjustLayoutByDelta({
844
868
  size: 100
845
869
  });
846
870
  const delta = maxSafeSize - prevSize;
847
- //DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
871
+ // DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
848
872
 
849
873
  maxAvailableDelta += delta;
850
874
  index += increment;
@@ -853,11 +877,11 @@ function adjustLayoutByDelta({
853
877
  }
854
878
  }
855
879
 
856
- //DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
880
+ // DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
857
881
  const minAbsDelta = Math.min(Math.abs(delta), Math.abs(maxAvailableDelta));
858
882
  delta = delta < 0 ? 0 - minAbsDelta : minAbsDelta;
859
- //DEBUG.push(` -> adjusted delta: ${delta}`);
860
- //DEBUG.push("");
883
+ // DEBUG.push(` -> adjusted delta: ${delta}`);
884
+ // DEBUG.push("");
861
885
  }
862
886
 
863
887
  {
@@ -867,7 +891,7 @@ function adjustLayoutByDelta({
867
891
  let index = pivotIndex;
868
892
  while (index >= 0 && index < panelConstraintsArray.length) {
869
893
  const deltaRemaining = Math.abs(delta) - Math.abs(deltaApplied);
870
- const prevSize = prevLayout[index];
894
+ const prevSize = initialLayout[index];
871
895
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
872
896
  const unsafeSize = prevSize - deltaRemaining;
873
897
  const safeSize = resizePanel({
@@ -891,20 +915,22 @@ function adjustLayoutByDelta({
891
915
  }
892
916
  }
893
917
  }
894
- //DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
895
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
896
- //DEBUG.push("");
918
+ // DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
919
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
920
+ // DEBUG.push("");
897
921
 
898
922
  // If we were unable to resize any of the panels panels, return the previous state.
899
923
  // This will essentially bailout and ignore e.g. drags past a panel's boundaries
900
- if (fuzzyNumbersEqual(deltaApplied, 0)) {
901
- //console.log(DEBUG.join("\n"));
924
+ if (fuzzyLayoutsEqual(prevLayout, nextLayout)) {
925
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
926
+ // console.log(DEBUG.join("\n"));
927
+
902
928
  return prevLayout;
903
929
  }
904
930
  {
905
931
  // Now distribute the applied delta to the panels in the other direction
906
932
  const pivotIndex = delta < 0 ? secondPivotIndex : firstPivotIndex;
907
- const prevSize = prevLayout[pivotIndex];
933
+ const prevSize = initialLayout[pivotIndex];
908
934
  assert(prevSize != null, `Previous layout not found for panel index ${pivotIndex}`);
909
935
  const unsafeSize = prevSize + deltaApplied;
910
936
  const safeSize = resizePanel({
@@ -945,17 +971,23 @@ function adjustLayoutByDelta({
945
971
  }
946
972
  }
947
973
  }
948
- //DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
949
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
950
- //DEBUG.push("");
974
+ // DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
975
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
976
+ // DEBUG.push("");
951
977
 
952
978
  const totalSize = nextLayout.reduce((total, size) => size + total, 0);
953
- //DEBUG.push(`total size: ${totalSize}`);
954
- //console.log(DEBUG.join("\n"));
979
+ // DEBUG.push(`total size: ${totalSize}`);
955
980
 
981
+ // If our new layout doesn't add up to 100%, that means the requested delta can't be applied
982
+ // In that case, fall back to our most recent valid layout
956
983
  if (!fuzzyNumbersEqual(totalSize, 100)) {
984
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
985
+ // console.log(DEBUG.join("\n"));
986
+
957
987
  return prevLayout;
958
988
  }
989
+
990
+ // console.log(DEBUG.join("\n"));
959
991
  return nextLayout;
960
992
  }
961
993
 
@@ -1135,9 +1167,10 @@ function useWindowSplitterPanelGroupBehavior({
1135
1167
  if (size != null && collapsible) {
1136
1168
  const nextLayout = adjustLayoutByDelta({
1137
1169
  delta: fuzzyNumbersEqual(size, collapsedSize) ? minSize - collapsedSize : collapsedSize - size,
1138
- layout,
1170
+ initialLayout: layout,
1139
1171
  panelConstraints: panelDataArray.map(panelData => panelData.constraints),
1140
1172
  pivotIndices: determinePivotIndices(groupId, handleId, panelGroupElement),
1173
+ prevLayout: layout,
1141
1174
  trigger: "keyboard"
1142
1175
  });
1143
1176
  if (layout !== nextLayout) {
@@ -1679,9 +1712,10 @@ function PanelGroupWithForwardedRef({
1679
1712
  const delta = isLastPanel ? panelSize - collapsedSize : collapsedSize - panelSize;
1680
1713
  const nextLayout = adjustLayoutByDelta({
1681
1714
  delta,
1682
- layout: prevLayout,
1715
+ initialLayout: prevLayout,
1683
1716
  panelConstraints: panelConstraintsArray,
1684
1717
  pivotIndices,
1718
+ prevLayout,
1685
1719
  trigger: "imperative-api"
1686
1720
  });
1687
1721
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1721,9 +1755,10 @@ function PanelGroupWithForwardedRef({
1721
1755
  const delta = isLastPanel ? panelSize - baseSize : baseSize - panelSize;
1722
1756
  const nextLayout = adjustLayoutByDelta({
1723
1757
  delta,
1724
- layout: prevLayout,
1758
+ initialLayout: prevLayout,
1725
1759
  panelConstraints: panelConstraintsArray,
1726
1760
  pivotIndices,
1761
+ prevLayout,
1727
1762
  trigger: "imperative-api"
1728
1763
  });
1729
1764
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1905,9 +1940,10 @@ function PanelGroupWithForwardedRef({
1905
1940
  const panelConstraints = panelDataArray.map(panelData => panelData.constraints);
1906
1941
  const nextLayout = adjustLayoutByDelta({
1907
1942
  delta,
1908
- layout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
1943
+ initialLayout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
1909
1944
  panelConstraints,
1910
1945
  pivotIndices,
1946
+ prevLayout,
1911
1947
  trigger: isKeyDown(event) ? "keyboard" : "mouse-or-touch"
1912
1948
  });
1913
1949
  const layoutChanged = !compareLayouts(prevLayout, nextLayout);
@@ -1963,9 +1999,10 @@ function PanelGroupWithForwardedRef({
1963
1999
  const delta = isLastPanel ? panelSize - unsafePanelSize : unsafePanelSize - panelSize;
1964
2000
  const nextLayout = adjustLayoutByDelta({
1965
2001
  delta,
1966
- layout: prevLayout,
2002
+ initialLayout: prevLayout,
1967
2003
  panelConstraints: panelConstraintsArray,
1968
2004
  pivotIndices,
2005
+ prevLayout,
1969
2006
  trigger: "imperative-api"
1970
2007
  });
1971
2008
  if (!compareLayouts(prevLayout, nextLayout)) {
package/dist/react-resizable-panels.development.cjs.js CHANGED
@@ -362,7 +362,9 @@ const props = /\b(?:position|zIndex|opacity|transform|webkitTransform|mixBlendMo
362
362
 
363
363
  /** @param {HTMLElement} node */
364
364
  function is_flex_item(node) {
365
- const display = getComputedStyle(get_parent(node)).display;
365
+ var _get_parent;
366
+ // @ts-ignore
367
+ const display = getComputedStyle((_get_parent = get_parent(node)) !== null && _get_parent !== void 0 ? _get_parent : node).display;
366
368
  return display === "flex" || display === "inline-flex";
367
369
  }
368
370
 
@@ -412,6 +414,7 @@ function get_ancestors(node) {
412
414
  const ancestors = [];
413
415
  while (node) {
414
416
  ancestors.push(node);
417
+ // @ts-ignore
415
418
  node = get_parent(node);
416
419
  }
417
420
  return ancestors; // [ node, ... <body>, <html>, document ]
@@ -419,9 +422,13 @@ function get_ancestors(node) {
419
422
 
420
423
  /** @param {HTMLElement} node */
421
424
  function get_parent(node) {
422
- var _node$parentNode;
423
- // @ts-ignore
424
- return ((_node$parentNode = node.parentNode) === null || _node$parentNode === void 0 ? void 0 : _node$parentNode.host) || node.parentNode;
425
+ const {
426
+ parentNode
427
+ } = node;
428
+ if (parentNode && parentNode instanceof ShadowRoot) {
429
+ return parentNode.host;
430
+ }
431
+ return parentNode;
425
432
  }
426
433
 
427
434
  const EXCEEDED_HORIZONTAL_MIN = 0b0001;
@@ -707,6 +714,20 @@ function fuzzyNumbersEqual(actual, expected, fractionDigits) {
707
714
  return fuzzyCompareNumbers(actual, expected, fractionDigits) === 0;
708
715
  }
709
716
 
717
+ function fuzzyLayoutsEqual(actual, expected, fractionDigits) {
718
+ if (actual.length !== expected.length) {
719
+ return false;
720
+ }
721
+ for (let index = 0; index < actual.length; index++) {
722
+ const actualSize = actual[index];
723
+ const expectedSize = expected[index];
724
+ if (!fuzzyNumbersEqual(actualSize, expectedSize, fractionDigits)) {
725
+ return false;
726
+ }
727
+ }
728
+ return true;
729
+ }
730
+
710
731
  // Panel size must be in percentages; pixel values should be pre-converted
711
732
  function resizePanel({
712
733
  panelConstraints: panelConstraintsArray,
@@ -742,26 +763,29 @@ function resizePanel({
742
763
  // All units must be in percentages; pixel values should be pre-converted
743
764
  function adjustLayoutByDelta({
744
765
  delta,
745
- layout: prevLayout,
766
+ initialLayout,
746
767
  panelConstraints: panelConstraintsArray,
747
768
  pivotIndices,
769
+ prevLayout,
748
770
  trigger
749
771
  }) {
750
772
  if (fuzzyNumbersEqual(delta, 0)) {
751
- return prevLayout;
773
+ return initialLayout;
752
774
  }
753
- const nextLayout = [...prevLayout];
775
+ const nextLayout = [...initialLayout];
754
776
  const [firstPivotIndex, secondPivotIndex] = pivotIndices;
755
777
  assert(firstPivotIndex != null, "Invalid first pivot index");
756
778
  assert(secondPivotIndex != null, "Invalid second pivot index");
757
779
  let deltaApplied = 0;
758
780
 
759
- //const DEBUG = [];
760
- //DEBUG.push(`adjustLayoutByDelta() ${prevLayout.join(", ")}`);
761
- //DEBUG.push(` delta: ${delta}`);
762
- //DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
763
- //DEBUG.push(` trigger: ${trigger}`);
764
- //DEBUG.push("");
781
+ // const DEBUG = [];
782
+ // DEBUG.push(`adjustLayoutByDelta()`);
783
+ // DEBUG.push(` initialLayout: ${initialLayout.join(", ")}`);
784
+ // DEBUG.push(` prevLayout: ${prevLayout.join(", ")}`);
785
+ // DEBUG.push(` delta: ${delta}`);
786
+ // DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
787
+ // DEBUG.push(` trigger: ${trigger}`);
788
+ // DEBUG.push("");
765
789
 
766
790
  // A resizing panel affects the panels before or after it.
767
791
  //
@@ -786,18 +810,18 @@ function adjustLayoutByDelta({
786
810
  minSize = 0
787
811
  } = panelConstraints;
788
812
 
789
- //DEBUG.push(`edge case check 1: ${index}`);
790
- //DEBUG.push(` -> collapsible? ${constraints.collapsible}`);
813
+ // DEBUG.push(`edge case check 1: ${index}`);
814
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
791
815
  if (collapsible) {
792
- const prevSize = prevLayout[index];
816
+ const prevSize = initialLayout[index];
793
817
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
794
818
  if (fuzzyNumbersEqual(prevSize, collapsedSize)) {
795
819
  const localDelta = minSize - prevSize;
796
- //DEBUG.push(` -> expand delta: ${localDelta}`);
820
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
797
821
 
798
822
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
799
823
  delta = delta < 0 ? 0 - localDelta : localDelta;
800
- //DEBUG.push(` -> delta: ${delta}`);
824
+ // DEBUG.push(` -> delta: ${delta}`);
801
825
  }
802
826
  }
803
827
  }
@@ -814,24 +838,24 @@ function adjustLayoutByDelta({
814
838
  minSize = 0
815
839
  } = panelConstraints;
816
840
 
817
- //DEBUG.push(`edge case check 2: ${index}`);
818
- //DEBUG.push(` -> collapsible? ${collapsible}`);
841
+ // DEBUG.push(`edge case check 2: ${index}`);
842
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
819
843
  if (collapsible) {
820
- const prevSize = prevLayout[index];
844
+ const prevSize = initialLayout[index];
821
845
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
822
846
  if (fuzzyNumbersEqual(prevSize, minSize)) {
823
847
  const localDelta = prevSize - collapsedSize;
824
- //DEBUG.push(` -> expand delta: ${localDelta}`);
848
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
825
849
 
826
850
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
827
851
  delta = delta < 0 ? 0 - localDelta : localDelta;
828
- //DEBUG.push(` -> delta: ${delta}`);
852
+ // DEBUG.push(` -> delta: ${delta}`);
829
853
  }
830
854
  }
831
855
  }
832
856
  }
833
857
  }
834
- //DEBUG.push("");
858
+ // DEBUG.push("");
835
859
  }
836
860
 
837
861
  {
@@ -845,9 +869,9 @@ function adjustLayoutByDelta({
845
869
  let index = delta < 0 ? secondPivotIndex : firstPivotIndex;
846
870
  let maxAvailableDelta = 0;
847
871
 
848
- //DEBUG.push("pre calc...");
872
+ // DEBUG.push("pre calc...");
849
873
  while (true) {
850
- const prevSize = prevLayout[index];
874
+ const prevSize = initialLayout[index];
851
875
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
852
876
  const maxSafeSize = resizePanel({
853
877
  panelConstraints: panelConstraintsArray,
@@ -855,7 +879,7 @@ function adjustLayoutByDelta({
855
879
  size: 100
856
880
  });
857
881
  const delta = maxSafeSize - prevSize;
858
- //DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
882
+ // DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
859
883
 
860
884
  maxAvailableDelta += delta;
861
885
  index += increment;
@@ -864,11 +888,11 @@ function adjustLayoutByDelta({
864
888
  }
865
889
  }
866
890
 
867
- //DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
891
+ // DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
868
892
  const minAbsDelta = Math.min(Math.abs(delta), Math.abs(maxAvailableDelta));
869
893
  delta = delta < 0 ? 0 - minAbsDelta : minAbsDelta;
870
- //DEBUG.push(` -> adjusted delta: ${delta}`);
871
- //DEBUG.push("");
894
+ // DEBUG.push(` -> adjusted delta: ${delta}`);
895
+ // DEBUG.push("");
872
896
  }
873
897
 
874
898
  {
@@ -878,7 +902,7 @@ function adjustLayoutByDelta({
878
902
  let index = pivotIndex;
879
903
  while (index >= 0 && index < panelConstraintsArray.length) {
880
904
  const deltaRemaining = Math.abs(delta) - Math.abs(deltaApplied);
881
- const prevSize = prevLayout[index];
905
+ const prevSize = initialLayout[index];
882
906
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
883
907
  const unsafeSize = prevSize - deltaRemaining;
884
908
  const safeSize = resizePanel({
@@ -902,20 +926,22 @@ function adjustLayoutByDelta({
902
926
  }
903
927
  }
904
928
  }
905
- //DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
906
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
907
- //DEBUG.push("");
929
+ // DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
930
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
931
+ // DEBUG.push("");
908
932
 
909
933
  // If we were unable to resize any of the panels panels, return the previous state.
910
934
  // This will essentially bailout and ignore e.g. drags past a panel's boundaries
911
- if (fuzzyNumbersEqual(deltaApplied, 0)) {
912
- //console.log(DEBUG.join("\n"));
935
+ if (fuzzyLayoutsEqual(prevLayout, nextLayout)) {
936
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
937
+ // console.log(DEBUG.join("\n"));
938
+
913
939
  return prevLayout;
914
940
  }
915
941
  {
916
942
  // Now distribute the applied delta to the panels in the other direction
917
943
  const pivotIndex = delta < 0 ? secondPivotIndex : firstPivotIndex;
918
- const prevSize = prevLayout[pivotIndex];
944
+ const prevSize = initialLayout[pivotIndex];
919
945
  assert(prevSize != null, `Previous layout not found for panel index ${pivotIndex}`);
920
946
  const unsafeSize = prevSize + deltaApplied;
921
947
  const safeSize = resizePanel({
@@ -956,17 +982,23 @@ function adjustLayoutByDelta({
956
982
  }
957
983
  }
958
984
  }
959
- //DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
960
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
961
- //DEBUG.push("");
985
+ // DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
986
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
987
+ // DEBUG.push("");
962
988
 
963
989
  const totalSize = nextLayout.reduce((total, size) => size + total, 0);
964
- //DEBUG.push(`total size: ${totalSize}`);
965
- //console.log(DEBUG.join("\n"));
990
+ // DEBUG.push(`total size: ${totalSize}`);
966
991
 
992
+ // If our new layout doesn't add up to 100%, that means the requested delta can't be applied
993
+ // In that case, fall back to our most recent valid layout
967
994
  if (!fuzzyNumbersEqual(totalSize, 100)) {
995
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
996
+ // console.log(DEBUG.join("\n"));
997
+
968
998
  return prevLayout;
969
999
  }
1000
+
1001
+ // console.log(DEBUG.join("\n"));
970
1002
  return nextLayout;
971
1003
  }
972
1004
 
@@ -1156,9 +1188,10 @@ function useWindowSplitterPanelGroupBehavior({
1156
1188
  if (size != null && collapsible) {
1157
1189
  const nextLayout = adjustLayoutByDelta({
1158
1190
  delta: fuzzyNumbersEqual(size, collapsedSize) ? minSize - collapsedSize : collapsedSize - size,
1159
- layout,
1191
+ initialLayout: layout,
1160
1192
  panelConstraints: panelDataArray.map(panelData => panelData.constraints),
1161
1193
  pivotIndices: determinePivotIndices(groupId, handleId, panelGroupElement),
1194
+ prevLayout: layout,
1162
1195
  trigger: "keyboard"
1163
1196
  });
1164
1197
  if (layout !== nextLayout) {
@@ -1790,9 +1823,10 @@ function PanelGroupWithForwardedRef({
1790
1823
  const delta = isLastPanel ? panelSize - collapsedSize : collapsedSize - panelSize;
1791
1824
  const nextLayout = adjustLayoutByDelta({
1792
1825
  delta,
1793
- layout: prevLayout,
1826
+ initialLayout: prevLayout,
1794
1827
  panelConstraints: panelConstraintsArray,
1795
1828
  pivotIndices,
1829
+ prevLayout,
1796
1830
  trigger: "imperative-api"
1797
1831
  });
1798
1832
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1832,9 +1866,10 @@ function PanelGroupWithForwardedRef({
1832
1866
  const delta = isLastPanel ? panelSize - baseSize : baseSize - panelSize;
1833
1867
  const nextLayout = adjustLayoutByDelta({
1834
1868
  delta,
1835
- layout: prevLayout,
1869
+ initialLayout: prevLayout,
1836
1870
  panelConstraints: panelConstraintsArray,
1837
1871
  pivotIndices,
1872
+ prevLayout,
1838
1873
  trigger: "imperative-api"
1839
1874
  });
1840
1875
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -2016,9 +2051,10 @@ function PanelGroupWithForwardedRef({
2016
2051
  const panelConstraints = panelDataArray.map(panelData => panelData.constraints);
2017
2052
  const nextLayout = adjustLayoutByDelta({
2018
2053
  delta,
2019
- layout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
2054
+ initialLayout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
2020
2055
  panelConstraints,
2021
2056
  pivotIndices,
2057
+ prevLayout,
2022
2058
  trigger: isKeyDown(event) ? "keyboard" : "mouse-or-touch"
2023
2059
  });
2024
2060
  const layoutChanged = !compareLayouts(prevLayout, nextLayout);
@@ -2074,9 +2110,10 @@ function PanelGroupWithForwardedRef({
2074
2110
  const delta = isLastPanel ? panelSize - unsafePanelSize : unsafePanelSize - panelSize;
2075
2111
  const nextLayout = adjustLayoutByDelta({
2076
2112
  delta,
2077
- layout: prevLayout,
2113
+ initialLayout: prevLayout,
2078
2114
  panelConstraints: panelConstraintsArray,
2079
2115
  pivotIndices,
2116
+ prevLayout,
2080
2117
  trigger: "imperative-api"
2081
2118
  });
2082
2119
  if (!compareLayouts(prevLayout, nextLayout)) {