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.
Binary file
@@ -0,0 +1,2 @@
1
+ 114864213
2
+ 1680459541679979000
Binary file
Binary file
Binary file
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # Changelog
2
2
 
3
+ ## 2.0.13
4
+
5
+ - Fix potential cycle in stacking-order logic for an unmounted node (#317)
6
+
7
+ ## 2.0.12
8
+
9
+ - Improve resize for edge cases with collapsed panels; intermediate resize states should now fall back to the most recent valid layout rather than the initial layout (#311)
10
+
3
11
  ## 2.0.11
4
12
 
5
13
  - Fix resize handle cursor hit detection when when viewport is scrolled (#305)
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2023 Brian Vaughn
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
@@ -349,7 +349,9 @@ const props = /\b(?:position|zIndex|opacity|transform|webkitTransform|mixBlendMo
349
349
 
350
350
  /** @param {HTMLElement} node */
351
351
  function is_flex_item(node) {
352
- const display = getComputedStyle(get_parent(node)).display;
352
+ var _get_parent;
353
+ // @ts-ignore
354
+ const display = getComputedStyle((_get_parent = get_parent(node)) !== null && _get_parent !== void 0 ? _get_parent : node).display;
353
355
  return display === "flex" || display === "inline-flex";
354
356
  }
355
357
 
@@ -399,6 +401,7 @@ function get_ancestors(node) {
399
401
  const ancestors = [];
400
402
  while (node) {
401
403
  ancestors.push(node);
404
+ // @ts-ignore
402
405
  node = get_parent(node);
403
406
  }
404
407
  return ancestors; // [ node, ... <body>, <html>, document ]
@@ -406,9 +409,13 @@ function get_ancestors(node) {
406
409
 
407
410
  /** @param {HTMLElement} node */
408
411
  function get_parent(node) {
409
- var _node$parentNode;
410
- // @ts-ignore
411
- return ((_node$parentNode = node.parentNode) === null || _node$parentNode === void 0 ? void 0 : _node$parentNode.host) || node.parentNode;
412
+ const {
413
+ parentNode
414
+ } = node;
415
+ if (parentNode && parentNode instanceof ShadowRoot) {
416
+ return parentNode.host;
417
+ }
418
+ return parentNode;
412
419
  }
413
420
 
414
421
  const EXCEEDED_HORIZONTAL_MIN = 0b0001;
@@ -694,6 +701,20 @@ function fuzzyNumbersEqual(actual, expected, fractionDigits) {
694
701
  return fuzzyCompareNumbers(actual, expected, fractionDigits) === 0;
695
702
  }
696
703
 
704
+ function fuzzyLayoutsEqual(actual, expected, fractionDigits) {
705
+ if (actual.length !== expected.length) {
706
+ return false;
707
+ }
708
+ for (let index = 0; index < actual.length; index++) {
709
+ const actualSize = actual[index];
710
+ const expectedSize = expected[index];
711
+ if (!fuzzyNumbersEqual(actualSize, expectedSize, fractionDigits)) {
712
+ return false;
713
+ }
714
+ }
715
+ return true;
716
+ }
717
+
697
718
  // Panel size must be in percentages; pixel values should be pre-converted
698
719
  function resizePanel({
699
720
  panelConstraints: panelConstraintsArray,
@@ -729,26 +750,29 @@ function resizePanel({
729
750
  // All units must be in percentages; pixel values should be pre-converted
730
751
  function adjustLayoutByDelta({
731
752
  delta,
732
- layout: prevLayout,
753
+ initialLayout,
733
754
  panelConstraints: panelConstraintsArray,
734
755
  pivotIndices,
756
+ prevLayout,
735
757
  trigger
736
758
  }) {
737
759
  if (fuzzyNumbersEqual(delta, 0)) {
738
- return prevLayout;
760
+ return initialLayout;
739
761
  }
740
- const nextLayout = [...prevLayout];
762
+ const nextLayout = [...initialLayout];
741
763
  const [firstPivotIndex, secondPivotIndex] = pivotIndices;
742
764
  assert(firstPivotIndex != null, "Invalid first pivot index");
743
765
  assert(secondPivotIndex != null, "Invalid second pivot index");
744
766
  let deltaApplied = 0;
745
767
 
746
- //const DEBUG = [];
747
- //DEBUG.push(`adjustLayoutByDelta() ${prevLayout.join(", ")}`);
748
- //DEBUG.push(` delta: ${delta}`);
749
- //DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
750
- //DEBUG.push(` trigger: ${trigger}`);
751
- //DEBUG.push("");
768
+ // const DEBUG = [];
769
+ // DEBUG.push(`adjustLayoutByDelta()`);
770
+ // DEBUG.push(` initialLayout: ${initialLayout.join(", ")}`);
771
+ // DEBUG.push(` prevLayout: ${prevLayout.join(", ")}`);
772
+ // DEBUG.push(` delta: ${delta}`);
773
+ // DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
774
+ // DEBUG.push(` trigger: ${trigger}`);
775
+ // DEBUG.push("");
752
776
 
753
777
  // A resizing panel affects the panels before or after it.
754
778
  //
@@ -773,18 +797,18 @@ function adjustLayoutByDelta({
773
797
  minSize = 0
774
798
  } = panelConstraints;
775
799
 
776
- //DEBUG.push(`edge case check 1: ${index}`);
777
- //DEBUG.push(` -> collapsible? ${constraints.collapsible}`);
800
+ // DEBUG.push(`edge case check 1: ${index}`);
801
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
778
802
  if (collapsible) {
779
- const prevSize = prevLayout[index];
803
+ const prevSize = initialLayout[index];
780
804
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
781
805
  if (fuzzyNumbersEqual(prevSize, collapsedSize)) {
782
806
  const localDelta = minSize - prevSize;
783
- //DEBUG.push(` -> expand delta: ${localDelta}`);
807
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
784
808
 
785
809
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
786
810
  delta = delta < 0 ? 0 - localDelta : localDelta;
787
- //DEBUG.push(` -> delta: ${delta}`);
811
+ // DEBUG.push(` -> delta: ${delta}`);
788
812
  }
789
813
  }
790
814
  }
@@ -801,24 +825,24 @@ function adjustLayoutByDelta({
801
825
  minSize = 0
802
826
  } = panelConstraints;
803
827
 
804
- //DEBUG.push(`edge case check 2: ${index}`);
805
- //DEBUG.push(` -> collapsible? ${collapsible}`);
828
+ // DEBUG.push(`edge case check 2: ${index}`);
829
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
806
830
  if (collapsible) {
807
- const prevSize = prevLayout[index];
831
+ const prevSize = initialLayout[index];
808
832
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
809
833
  if (fuzzyNumbersEqual(prevSize, minSize)) {
810
834
  const localDelta = prevSize - collapsedSize;
811
- //DEBUG.push(` -> expand delta: ${localDelta}`);
835
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
812
836
 
813
837
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
814
838
  delta = delta < 0 ? 0 - localDelta : localDelta;
815
- //DEBUG.push(` -> delta: ${delta}`);
839
+ // DEBUG.push(` -> delta: ${delta}`);
816
840
  }
817
841
  }
818
842
  }
819
843
  }
820
844
  }
821
- //DEBUG.push("");
845
+ // DEBUG.push("");
822
846
  }
823
847
 
824
848
  {
@@ -832,9 +856,9 @@ function adjustLayoutByDelta({
832
856
  let index = delta < 0 ? secondPivotIndex : firstPivotIndex;
833
857
  let maxAvailableDelta = 0;
834
858
 
835
- //DEBUG.push("pre calc...");
859
+ // DEBUG.push("pre calc...");
836
860
  while (true) {
837
- const prevSize = prevLayout[index];
861
+ const prevSize = initialLayout[index];
838
862
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
839
863
  const maxSafeSize = resizePanel({
840
864
  panelConstraints: panelConstraintsArray,
@@ -842,7 +866,7 @@ function adjustLayoutByDelta({
842
866
  size: 100
843
867
  });
844
868
  const delta = maxSafeSize - prevSize;
845
- //DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
869
+ // DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
846
870
 
847
871
  maxAvailableDelta += delta;
848
872
  index += increment;
@@ -851,11 +875,11 @@ function adjustLayoutByDelta({
851
875
  }
852
876
  }
853
877
 
854
- //DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
878
+ // DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
855
879
  const minAbsDelta = Math.min(Math.abs(delta), Math.abs(maxAvailableDelta));
856
880
  delta = delta < 0 ? 0 - minAbsDelta : minAbsDelta;
857
- //DEBUG.push(` -> adjusted delta: ${delta}`);
858
- //DEBUG.push("");
881
+ // DEBUG.push(` -> adjusted delta: ${delta}`);
882
+ // DEBUG.push("");
859
883
  }
860
884
 
861
885
  {
@@ -865,7 +889,7 @@ function adjustLayoutByDelta({
865
889
  let index = pivotIndex;
866
890
  while (index >= 0 && index < panelConstraintsArray.length) {
867
891
  const deltaRemaining = Math.abs(delta) - Math.abs(deltaApplied);
868
- const prevSize = prevLayout[index];
892
+ const prevSize = initialLayout[index];
869
893
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
870
894
  const unsafeSize = prevSize - deltaRemaining;
871
895
  const safeSize = resizePanel({
@@ -889,20 +913,22 @@ function adjustLayoutByDelta({
889
913
  }
890
914
  }
891
915
  }
892
- //DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
893
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
894
- //DEBUG.push("");
916
+ // DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
917
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
918
+ // DEBUG.push("");
895
919
 
896
920
  // If we were unable to resize any of the panels panels, return the previous state.
897
921
  // This will essentially bailout and ignore e.g. drags past a panel's boundaries
898
- if (fuzzyNumbersEqual(deltaApplied, 0)) {
899
- //console.log(DEBUG.join("\n"));
922
+ if (fuzzyLayoutsEqual(prevLayout, nextLayout)) {
923
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
924
+ // console.log(DEBUG.join("\n"));
925
+
900
926
  return prevLayout;
901
927
  }
902
928
  {
903
929
  // Now distribute the applied delta to the panels in the other direction
904
930
  const pivotIndex = delta < 0 ? secondPivotIndex : firstPivotIndex;
905
- const prevSize = prevLayout[pivotIndex];
931
+ const prevSize = initialLayout[pivotIndex];
906
932
  assert(prevSize != null, `Previous layout not found for panel index ${pivotIndex}`);
907
933
  const unsafeSize = prevSize + deltaApplied;
908
934
  const safeSize = resizePanel({
@@ -943,17 +969,23 @@ function adjustLayoutByDelta({
943
969
  }
944
970
  }
945
971
  }
946
- //DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
947
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
948
- //DEBUG.push("");
972
+ // DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
973
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
974
+ // DEBUG.push("");
949
975
 
950
976
  const totalSize = nextLayout.reduce((total, size) => size + total, 0);
951
- //DEBUG.push(`total size: ${totalSize}`);
952
- //console.log(DEBUG.join("\n"));
977
+ // DEBUG.push(`total size: ${totalSize}`);
953
978
 
979
+ // If our new layout doesn't add up to 100%, that means the requested delta can't be applied
980
+ // In that case, fall back to our most recent valid layout
954
981
  if (!fuzzyNumbersEqual(totalSize, 100)) {
982
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
983
+ // console.log(DEBUG.join("\n"));
984
+
955
985
  return prevLayout;
956
986
  }
987
+
988
+ // console.log(DEBUG.join("\n"));
957
989
  return nextLayout;
958
990
  }
959
991
 
@@ -1133,9 +1165,10 @@ function useWindowSplitterPanelGroupBehavior({
1133
1165
  if (size != null && collapsible) {
1134
1166
  const nextLayout = adjustLayoutByDelta({
1135
1167
  delta: fuzzyNumbersEqual(size, collapsedSize) ? minSize - collapsedSize : collapsedSize - size,
1136
- layout,
1168
+ initialLayout: layout,
1137
1169
  panelConstraints: panelDataArray.map(panelData => panelData.constraints),
1138
1170
  pivotIndices: determinePivotIndices(groupId, handleId, panelGroupElement),
1171
+ prevLayout: layout,
1139
1172
  trigger: "keyboard"
1140
1173
  });
1141
1174
  if (layout !== nextLayout) {
@@ -1677,9 +1710,10 @@ function PanelGroupWithForwardedRef({
1677
1710
  const delta = isLastPanel ? panelSize - collapsedSize : collapsedSize - panelSize;
1678
1711
  const nextLayout = adjustLayoutByDelta({
1679
1712
  delta,
1680
- layout: prevLayout,
1713
+ initialLayout: prevLayout,
1681
1714
  panelConstraints: panelConstraintsArray,
1682
1715
  pivotIndices,
1716
+ prevLayout,
1683
1717
  trigger: "imperative-api"
1684
1718
  });
1685
1719
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1719,9 +1753,10 @@ function PanelGroupWithForwardedRef({
1719
1753
  const delta = isLastPanel ? panelSize - baseSize : baseSize - panelSize;
1720
1754
  const nextLayout = adjustLayoutByDelta({
1721
1755
  delta,
1722
- layout: prevLayout,
1756
+ initialLayout: prevLayout,
1723
1757
  panelConstraints: panelConstraintsArray,
1724
1758
  pivotIndices,
1759
+ prevLayout,
1725
1760
  trigger: "imperative-api"
1726
1761
  });
1727
1762
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1903,9 +1938,10 @@ function PanelGroupWithForwardedRef({
1903
1938
  const panelConstraints = panelDataArray.map(panelData => panelData.constraints);
1904
1939
  const nextLayout = adjustLayoutByDelta({
1905
1940
  delta,
1906
- layout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
1941
+ initialLayout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
1907
1942
  panelConstraints,
1908
1943
  pivotIndices,
1944
+ prevLayout,
1909
1945
  trigger: isKeyDown(event) ? "keyboard" : "mouse-or-touch"
1910
1946
  });
1911
1947
  const layoutChanged = !compareLayouts(prevLayout, nextLayout);
@@ -1961,9 +1997,10 @@ function PanelGroupWithForwardedRef({
1961
1997
  const delta = isLastPanel ? panelSize - unsafePanelSize : unsafePanelSize - panelSize;
1962
1998
  const nextLayout = adjustLayoutByDelta({
1963
1999
  delta,
1964
- layout: prevLayout,
2000
+ initialLayout: prevLayout,
1965
2001
  panelConstraints: panelConstraintsArray,
1966
2002
  pivotIndices,
2003
+ prevLayout,
1967
2004
  trigger: "imperative-api"
1968
2005
  });
1969
2006
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -355,7 +355,9 @@ const props = /\b(?:position|zIndex|opacity|transform|webkitTransform|mixBlendMo
355
355
 
356
356
  /** @param {HTMLElement} node */
357
357
  function is_flex_item(node) {
358
- const display = getComputedStyle(get_parent(node)).display;
358
+ var _get_parent;
359
+ // @ts-ignore
360
+ const display = getComputedStyle((_get_parent = get_parent(node)) !== null && _get_parent !== void 0 ? _get_parent : node).display;
359
361
  return display === "flex" || display === "inline-flex";
360
362
  }
361
363
 
@@ -405,6 +407,7 @@ function get_ancestors(node) {
405
407
  const ancestors = [];
406
408
  while (node) {
407
409
  ancestors.push(node);
410
+ // @ts-ignore
408
411
  node = get_parent(node);
409
412
  }
410
413
  return ancestors; // [ node, ... <body>, <html>, document ]
@@ -412,9 +415,13 @@ function get_ancestors(node) {
412
415
 
413
416
  /** @param {HTMLElement} node */
414
417
  function get_parent(node) {
415
- var _node$parentNode;
416
- // @ts-ignore
417
- return ((_node$parentNode = node.parentNode) === null || _node$parentNode === void 0 ? void 0 : _node$parentNode.host) || node.parentNode;
418
+ const {
419
+ parentNode
420
+ } = node;
421
+ if (parentNode && parentNode instanceof ShadowRoot) {
422
+ return parentNode.host;
423
+ }
424
+ return parentNode;
418
425
  }
419
426
 
420
427
  const EXCEEDED_HORIZONTAL_MIN = 0b0001;
@@ -700,6 +707,20 @@ function fuzzyNumbersEqual(actual, expected, fractionDigits) {
700
707
  return fuzzyCompareNumbers(actual, expected, fractionDigits) === 0;
701
708
  }
702
709
 
710
+ function fuzzyLayoutsEqual(actual, expected, fractionDigits) {
711
+ if (actual.length !== expected.length) {
712
+ return false;
713
+ }
714
+ for (let index = 0; index < actual.length; index++) {
715
+ const actualSize = actual[index];
716
+ const expectedSize = expected[index];
717
+ if (!fuzzyNumbersEqual(actualSize, expectedSize, fractionDigits)) {
718
+ return false;
719
+ }
720
+ }
721
+ return true;
722
+ }
723
+
703
724
  // Panel size must be in percentages; pixel values should be pre-converted
704
725
  function resizePanel({
705
726
  panelConstraints: panelConstraintsArray,
@@ -735,26 +756,29 @@ function resizePanel({
735
756
  // All units must be in percentages; pixel values should be pre-converted
736
757
  function adjustLayoutByDelta({
737
758
  delta,
738
- layout: prevLayout,
759
+ initialLayout,
739
760
  panelConstraints: panelConstraintsArray,
740
761
  pivotIndices,
762
+ prevLayout,
741
763
  trigger
742
764
  }) {
743
765
  if (fuzzyNumbersEqual(delta, 0)) {
744
- return prevLayout;
766
+ return initialLayout;
745
767
  }
746
- const nextLayout = [...prevLayout];
768
+ const nextLayout = [...initialLayout];
747
769
  const [firstPivotIndex, secondPivotIndex] = pivotIndices;
748
770
  assert(firstPivotIndex != null, "Invalid first pivot index");
749
771
  assert(secondPivotIndex != null, "Invalid second pivot index");
750
772
  let deltaApplied = 0;
751
773
 
752
- //const DEBUG = [];
753
- //DEBUG.push(`adjustLayoutByDelta() ${prevLayout.join(", ")}`);
754
- //DEBUG.push(` delta: ${delta}`);
755
- //DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
756
- //DEBUG.push(` trigger: ${trigger}`);
757
- //DEBUG.push("");
774
+ // const DEBUG = [];
775
+ // DEBUG.push(`adjustLayoutByDelta()`);
776
+ // DEBUG.push(` initialLayout: ${initialLayout.join(", ")}`);
777
+ // DEBUG.push(` prevLayout: ${prevLayout.join(", ")}`);
778
+ // DEBUG.push(` delta: ${delta}`);
779
+ // DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
780
+ // DEBUG.push(` trigger: ${trigger}`);
781
+ // DEBUG.push("");
758
782
 
759
783
  // A resizing panel affects the panels before or after it.
760
784
  //
@@ -779,18 +803,18 @@ function adjustLayoutByDelta({
779
803
  minSize = 0
780
804
  } = panelConstraints;
781
805
 
782
- //DEBUG.push(`edge case check 1: ${index}`);
783
- //DEBUG.push(` -> collapsible? ${constraints.collapsible}`);
806
+ // DEBUG.push(`edge case check 1: ${index}`);
807
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
784
808
  if (collapsible) {
785
- const prevSize = prevLayout[index];
809
+ const prevSize = initialLayout[index];
786
810
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
787
811
  if (fuzzyNumbersEqual(prevSize, collapsedSize)) {
788
812
  const localDelta = minSize - prevSize;
789
- //DEBUG.push(` -> expand delta: ${localDelta}`);
813
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
790
814
 
791
815
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
792
816
  delta = delta < 0 ? 0 - localDelta : localDelta;
793
- //DEBUG.push(` -> delta: ${delta}`);
817
+ // DEBUG.push(` -> delta: ${delta}`);
794
818
  }
795
819
  }
796
820
  }
@@ -807,24 +831,24 @@ function adjustLayoutByDelta({
807
831
  minSize = 0
808
832
  } = panelConstraints;
809
833
 
810
- //DEBUG.push(`edge case check 2: ${index}`);
811
- //DEBUG.push(` -> collapsible? ${collapsible}`);
834
+ // DEBUG.push(`edge case check 2: ${index}`);
835
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
812
836
  if (collapsible) {
813
- const prevSize = prevLayout[index];
837
+ const prevSize = initialLayout[index];
814
838
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
815
839
  if (fuzzyNumbersEqual(prevSize, minSize)) {
816
840
  const localDelta = prevSize - collapsedSize;
817
- //DEBUG.push(` -> expand delta: ${localDelta}`);
841
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
818
842
 
819
843
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
820
844
  delta = delta < 0 ? 0 - localDelta : localDelta;
821
- //DEBUG.push(` -> delta: ${delta}`);
845
+ // DEBUG.push(` -> delta: ${delta}`);
822
846
  }
823
847
  }
824
848
  }
825
849
  }
826
850
  }
827
- //DEBUG.push("");
851
+ // DEBUG.push("");
828
852
  }
829
853
 
830
854
  {
@@ -838,9 +862,9 @@ function adjustLayoutByDelta({
838
862
  let index = delta < 0 ? secondPivotIndex : firstPivotIndex;
839
863
  let maxAvailableDelta = 0;
840
864
 
841
- //DEBUG.push("pre calc...");
865
+ // DEBUG.push("pre calc...");
842
866
  while (true) {
843
- const prevSize = prevLayout[index];
867
+ const prevSize = initialLayout[index];
844
868
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
845
869
  const maxSafeSize = resizePanel({
846
870
  panelConstraints: panelConstraintsArray,
@@ -848,7 +872,7 @@ function adjustLayoutByDelta({
848
872
  size: 100
849
873
  });
850
874
  const delta = maxSafeSize - prevSize;
851
- //DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
875
+ // DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
852
876
 
853
877
  maxAvailableDelta += delta;
854
878
  index += increment;
@@ -857,11 +881,11 @@ function adjustLayoutByDelta({
857
881
  }
858
882
  }
859
883
 
860
- //DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
884
+ // DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
861
885
  const minAbsDelta = Math.min(Math.abs(delta), Math.abs(maxAvailableDelta));
862
886
  delta = delta < 0 ? 0 - minAbsDelta : minAbsDelta;
863
- //DEBUG.push(` -> adjusted delta: ${delta}`);
864
- //DEBUG.push("");
887
+ // DEBUG.push(` -> adjusted delta: ${delta}`);
888
+ // DEBUG.push("");
865
889
  }
866
890
 
867
891
  {
@@ -871,7 +895,7 @@ function adjustLayoutByDelta({
871
895
  let index = pivotIndex;
872
896
  while (index >= 0 && index < panelConstraintsArray.length) {
873
897
  const deltaRemaining = Math.abs(delta) - Math.abs(deltaApplied);
874
- const prevSize = prevLayout[index];
898
+ const prevSize = initialLayout[index];
875
899
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
876
900
  const unsafeSize = prevSize - deltaRemaining;
877
901
  const safeSize = resizePanel({
@@ -895,20 +919,22 @@ function adjustLayoutByDelta({
895
919
  }
896
920
  }
897
921
  }
898
- //DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
899
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
900
- //DEBUG.push("");
922
+ // DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
923
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
924
+ // DEBUG.push("");
901
925
 
902
926
  // If we were unable to resize any of the panels panels, return the previous state.
903
927
  // This will essentially bailout and ignore e.g. drags past a panel's boundaries
904
- if (fuzzyNumbersEqual(deltaApplied, 0)) {
905
- //console.log(DEBUG.join("\n"));
928
+ if (fuzzyLayoutsEqual(prevLayout, nextLayout)) {
929
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
930
+ // console.log(DEBUG.join("\n"));
931
+
906
932
  return prevLayout;
907
933
  }
908
934
  {
909
935
  // Now distribute the applied delta to the panels in the other direction
910
936
  const pivotIndex = delta < 0 ? secondPivotIndex : firstPivotIndex;
911
- const prevSize = prevLayout[pivotIndex];
937
+ const prevSize = initialLayout[pivotIndex];
912
938
  assert(prevSize != null, `Previous layout not found for panel index ${pivotIndex}`);
913
939
  const unsafeSize = prevSize + deltaApplied;
914
940
  const safeSize = resizePanel({
@@ -949,17 +975,23 @@ function adjustLayoutByDelta({
949
975
  }
950
976
  }
951
977
  }
952
- //DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
953
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
954
- //DEBUG.push("");
978
+ // DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
979
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
980
+ // DEBUG.push("");
955
981
 
956
982
  const totalSize = nextLayout.reduce((total, size) => size + total, 0);
957
- //DEBUG.push(`total size: ${totalSize}`);
958
- //console.log(DEBUG.join("\n"));
983
+ // DEBUG.push(`total size: ${totalSize}`);
959
984
 
985
+ // If our new layout doesn't add up to 100%, that means the requested delta can't be applied
986
+ // In that case, fall back to our most recent valid layout
960
987
  if (!fuzzyNumbersEqual(totalSize, 100)) {
988
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
989
+ // console.log(DEBUG.join("\n"));
990
+
961
991
  return prevLayout;
962
992
  }
993
+
994
+ // console.log(DEBUG.join("\n"));
963
995
  return nextLayout;
964
996
  }
965
997
 
@@ -1149,9 +1181,10 @@ function useWindowSplitterPanelGroupBehavior({
1149
1181
  if (size != null && collapsible) {
1150
1182
  const nextLayout = adjustLayoutByDelta({
1151
1183
  delta: fuzzyNumbersEqual(size, collapsedSize) ? minSize - collapsedSize : collapsedSize - size,
1152
- layout,
1184
+ initialLayout: layout,
1153
1185
  panelConstraints: panelDataArray.map(panelData => panelData.constraints),
1154
1186
  pivotIndices: determinePivotIndices(groupId, handleId, panelGroupElement),
1187
+ prevLayout: layout,
1155
1188
  trigger: "keyboard"
1156
1189
  });
1157
1190
  if (layout !== nextLayout) {
@@ -1783,9 +1816,10 @@ function PanelGroupWithForwardedRef({
1783
1816
  const delta = isLastPanel ? panelSize - collapsedSize : collapsedSize - panelSize;
1784
1817
  const nextLayout = adjustLayoutByDelta({
1785
1818
  delta,
1786
- layout: prevLayout,
1819
+ initialLayout: prevLayout,
1787
1820
  panelConstraints: panelConstraintsArray,
1788
1821
  pivotIndices,
1822
+ prevLayout,
1789
1823
  trigger: "imperative-api"
1790
1824
  });
1791
1825
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1825,9 +1859,10 @@ function PanelGroupWithForwardedRef({
1825
1859
  const delta = isLastPanel ? panelSize - baseSize : baseSize - panelSize;
1826
1860
  const nextLayout = adjustLayoutByDelta({
1827
1861
  delta,
1828
- layout: prevLayout,
1862
+ initialLayout: prevLayout,
1829
1863
  panelConstraints: panelConstraintsArray,
1830
1864
  pivotIndices,
1865
+ prevLayout,
1831
1866
  trigger: "imperative-api"
1832
1867
  });
1833
1868
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -2009,9 +2044,10 @@ function PanelGroupWithForwardedRef({
2009
2044
  const panelConstraints = panelDataArray.map(panelData => panelData.constraints);
2010
2045
  const nextLayout = adjustLayoutByDelta({
2011
2046
  delta,
2012
- layout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
2047
+ initialLayout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
2013
2048
  panelConstraints,
2014
2049
  pivotIndices,
2050
+ prevLayout,
2015
2051
  trigger: isKeyDown(event) ? "keyboard" : "mouse-or-touch"
2016
2052
  });
2017
2053
  const layoutChanged = !compareLayouts(prevLayout, nextLayout);
@@ -2067,9 +2103,10 @@ function PanelGroupWithForwardedRef({
2067
2103
  const delta = isLastPanel ? panelSize - unsafePanelSize : unsafePanelSize - panelSize;
2068
2104
  const nextLayout = adjustLayoutByDelta({
2069
2105
  delta,
2070
- layout: prevLayout,
2106
+ initialLayout: prevLayout,
2071
2107
  panelConstraints: panelConstraintsArray,
2072
2108
  pivotIndices,
2109
+ prevLayout,
2073
2110
  trigger: "imperative-api"
2074
2111
  });
2075
2112
  if (!compareLayouts(prevLayout, nextLayout)) {