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.browser.development.esm.js CHANGED
@@ -331,7 +331,9 @@ const props = /\b(?:position|zIndex|opacity|transform|webkitTransform|mixBlendMo
331
331
 
332
332
  /** @param {HTMLElement} node */
333
333
  function is_flex_item(node) {
334
- const display = getComputedStyle(get_parent(node)).display;
334
+ var _get_parent;
335
+ // @ts-ignore
336
+ const display = getComputedStyle((_get_parent = get_parent(node)) !== null && _get_parent !== void 0 ? _get_parent : node).display;
335
337
  return display === "flex" || display === "inline-flex";
336
338
  }
337
339
 
@@ -381,6 +383,7 @@ function get_ancestors(node) {
381
383
  const ancestors = [];
382
384
  while (node) {
383
385
  ancestors.push(node);
386
+ // @ts-ignore
384
387
  node = get_parent(node);
385
388
  }
386
389
  return ancestors; // [ node, ... <body>, <html>, document ]
@@ -388,9 +391,13 @@ function get_ancestors(node) {
388
391
 
389
392
  /** @param {HTMLElement} node */
390
393
  function get_parent(node) {
391
- var _node$parentNode;
392
- // @ts-ignore
393
- return ((_node$parentNode = node.parentNode) === null || _node$parentNode === void 0 ? void 0 : _node$parentNode.host) || node.parentNode;
394
+ const {
395
+ parentNode
396
+ } = node;
397
+ if (parentNode && parentNode instanceof ShadowRoot) {
398
+ return parentNode.host;
399
+ }
400
+ return parentNode;
394
401
  }
395
402
 
396
403
  const EXCEEDED_HORIZONTAL_MIN = 0b0001;
@@ -676,6 +683,20 @@ function fuzzyNumbersEqual(actual, expected, fractionDigits) {
676
683
  return fuzzyCompareNumbers(actual, expected, fractionDigits) === 0;
677
684
  }
678
685
 
686
+ function fuzzyLayoutsEqual(actual, expected, fractionDigits) {
687
+ if (actual.length !== expected.length) {
688
+ return false;
689
+ }
690
+ for (let index = 0; index < actual.length; index++) {
691
+ const actualSize = actual[index];
692
+ const expectedSize = expected[index];
693
+ if (!fuzzyNumbersEqual(actualSize, expectedSize, fractionDigits)) {
694
+ return false;
695
+ }
696
+ }
697
+ return true;
698
+ }
699
+
679
700
  // Panel size must be in percentages; pixel values should be pre-converted
680
701
  function resizePanel({
681
702
  panelConstraints: panelConstraintsArray,
@@ -711,26 +732,29 @@ function resizePanel({
711
732
  // All units must be in percentages; pixel values should be pre-converted
712
733
  function adjustLayoutByDelta({
713
734
  delta,
714
- layout: prevLayout,
735
+ initialLayout,
715
736
  panelConstraints: panelConstraintsArray,
716
737
  pivotIndices,
738
+ prevLayout,
717
739
  trigger
718
740
  }) {
719
741
  if (fuzzyNumbersEqual(delta, 0)) {
720
- return prevLayout;
742
+ return initialLayout;
721
743
  }
722
- const nextLayout = [...prevLayout];
744
+ const nextLayout = [...initialLayout];
723
745
  const [firstPivotIndex, secondPivotIndex] = pivotIndices;
724
746
  assert(firstPivotIndex != null, "Invalid first pivot index");
725
747
  assert(secondPivotIndex != null, "Invalid second pivot index");
726
748
  let deltaApplied = 0;
727
749
 
728
- //const DEBUG = [];
729
- //DEBUG.push(`adjustLayoutByDelta() ${prevLayout.join(", ")}`);
730
- //DEBUG.push(` delta: ${delta}`);
731
- //DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
732
- //DEBUG.push(` trigger: ${trigger}`);
733
- //DEBUG.push("");
750
+ // const DEBUG = [];
751
+ // DEBUG.push(`adjustLayoutByDelta()`);
752
+ // DEBUG.push(` initialLayout: ${initialLayout.join(", ")}`);
753
+ // DEBUG.push(` prevLayout: ${prevLayout.join(", ")}`);
754
+ // DEBUG.push(` delta: ${delta}`);
755
+ // DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
756
+ // DEBUG.push(` trigger: ${trigger}`);
757
+ // DEBUG.push("");
734
758
 
735
759
  // A resizing panel affects the panels before or after it.
736
760
  //
@@ -755,18 +779,18 @@ function adjustLayoutByDelta({
755
779
  minSize = 0
756
780
  } = panelConstraints;
757
781
 
758
- //DEBUG.push(`edge case check 1: ${index}`);
759
- //DEBUG.push(` -> collapsible? ${constraints.collapsible}`);
782
+ // DEBUG.push(`edge case check 1: ${index}`);
783
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
760
784
  if (collapsible) {
761
- const prevSize = prevLayout[index];
785
+ const prevSize = initialLayout[index];
762
786
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
763
787
  if (fuzzyNumbersEqual(prevSize, collapsedSize)) {
764
788
  const localDelta = minSize - prevSize;
765
- //DEBUG.push(` -> expand delta: ${localDelta}`);
789
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
766
790
 
767
791
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
768
792
  delta = delta < 0 ? 0 - localDelta : localDelta;
769
- //DEBUG.push(` -> delta: ${delta}`);
793
+ // DEBUG.push(` -> delta: ${delta}`);
770
794
  }
771
795
  }
772
796
  }
@@ -783,24 +807,24 @@ function adjustLayoutByDelta({
783
807
  minSize = 0
784
808
  } = panelConstraints;
785
809
 
786
- //DEBUG.push(`edge case check 2: ${index}`);
787
- //DEBUG.push(` -> collapsible? ${collapsible}`);
810
+ // DEBUG.push(`edge case check 2: ${index}`);
811
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
788
812
  if (collapsible) {
789
- const prevSize = prevLayout[index];
813
+ const prevSize = initialLayout[index];
790
814
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
791
815
  if (fuzzyNumbersEqual(prevSize, minSize)) {
792
816
  const localDelta = prevSize - collapsedSize;
793
- //DEBUG.push(` -> expand delta: ${localDelta}`);
817
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
794
818
 
795
819
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
796
820
  delta = delta < 0 ? 0 - localDelta : localDelta;
797
- //DEBUG.push(` -> delta: ${delta}`);
821
+ // DEBUG.push(` -> delta: ${delta}`);
798
822
  }
799
823
  }
800
824
  }
801
825
  }
802
826
  }
803
- //DEBUG.push("");
827
+ // DEBUG.push("");
804
828
  }
805
829
 
806
830
  {
@@ -814,9 +838,9 @@ function adjustLayoutByDelta({
814
838
  let index = delta < 0 ? secondPivotIndex : firstPivotIndex;
815
839
  let maxAvailableDelta = 0;
816
840
 
817
- //DEBUG.push("pre calc...");
841
+ // DEBUG.push("pre calc...");
818
842
  while (true) {
819
- const prevSize = prevLayout[index];
843
+ const prevSize = initialLayout[index];
820
844
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
821
845
  const maxSafeSize = resizePanel({
822
846
  panelConstraints: panelConstraintsArray,
@@ -824,7 +848,7 @@ function adjustLayoutByDelta({
824
848
  size: 100
825
849
  });
826
850
  const delta = maxSafeSize - prevSize;
827
- //DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
851
+ // DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
828
852
 
829
853
  maxAvailableDelta += delta;
830
854
  index += increment;
@@ -833,11 +857,11 @@ function adjustLayoutByDelta({
833
857
  }
834
858
  }
835
859
 
836
- //DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
860
+ // DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
837
861
  const minAbsDelta = Math.min(Math.abs(delta), Math.abs(maxAvailableDelta));
838
862
  delta = delta < 0 ? 0 - minAbsDelta : minAbsDelta;
839
- //DEBUG.push(` -> adjusted delta: ${delta}`);
840
- //DEBUG.push("");
863
+ // DEBUG.push(` -> adjusted delta: ${delta}`);
864
+ // DEBUG.push("");
841
865
  }
842
866
 
843
867
  {
@@ -847,7 +871,7 @@ function adjustLayoutByDelta({
847
871
  let index = pivotIndex;
848
872
  while (index >= 0 && index < panelConstraintsArray.length) {
849
873
  const deltaRemaining = Math.abs(delta) - Math.abs(deltaApplied);
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 unsafeSize = prevSize - deltaRemaining;
853
877
  const safeSize = resizePanel({
@@ -871,20 +895,22 @@ function adjustLayoutByDelta({
871
895
  }
872
896
  }
873
897
  }
874
- //DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
875
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
876
- //DEBUG.push("");
898
+ // DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
899
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
900
+ // DEBUG.push("");
877
901
 
878
902
  // If we were unable to resize any of the panels panels, return the previous state.
879
903
  // This will essentially bailout and ignore e.g. drags past a panel's boundaries
880
- if (fuzzyNumbersEqual(deltaApplied, 0)) {
881
- //console.log(DEBUG.join("\n"));
904
+ if (fuzzyLayoutsEqual(prevLayout, nextLayout)) {
905
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
906
+ // console.log(DEBUG.join("\n"));
907
+
882
908
  return prevLayout;
883
909
  }
884
910
  {
885
911
  // Now distribute the applied delta to the panels in the other direction
886
912
  const pivotIndex = delta < 0 ? secondPivotIndex : firstPivotIndex;
887
- const prevSize = prevLayout[pivotIndex];
913
+ const prevSize = initialLayout[pivotIndex];
888
914
  assert(prevSize != null, `Previous layout not found for panel index ${pivotIndex}`);
889
915
  const unsafeSize = prevSize + deltaApplied;
890
916
  const safeSize = resizePanel({
@@ -925,17 +951,23 @@ function adjustLayoutByDelta({
925
951
  }
926
952
  }
927
953
  }
928
- //DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
929
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
930
- //DEBUG.push("");
954
+ // DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
955
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
956
+ // DEBUG.push("");
931
957
 
932
958
  const totalSize = nextLayout.reduce((total, size) => size + total, 0);
933
- //DEBUG.push(`total size: ${totalSize}`);
934
- //console.log(DEBUG.join("\n"));
959
+ // DEBUG.push(`total size: ${totalSize}`);
935
960
 
961
+ // If our new layout doesn't add up to 100%, that means the requested delta can't be applied
962
+ // In that case, fall back to our most recent valid layout
936
963
  if (!fuzzyNumbersEqual(totalSize, 100)) {
964
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
965
+ // console.log(DEBUG.join("\n"));
966
+
937
967
  return prevLayout;
938
968
  }
969
+
970
+ // console.log(DEBUG.join("\n"));
939
971
  return nextLayout;
940
972
  }
941
973
 
@@ -1125,9 +1157,10 @@ function useWindowSplitterPanelGroupBehavior({
1125
1157
  if (size != null && collapsible) {
1126
1158
  const nextLayout = adjustLayoutByDelta({
1127
1159
  delta: fuzzyNumbersEqual(size, collapsedSize) ? minSize - collapsedSize : collapsedSize - size,
1128
- layout,
1160
+ initialLayout: layout,
1129
1161
  panelConstraints: panelDataArray.map(panelData => panelData.constraints),
1130
1162
  pivotIndices: determinePivotIndices(groupId, handleId, panelGroupElement),
1163
+ prevLayout: layout,
1131
1164
  trigger: "keyboard"
1132
1165
  });
1133
1166
  if (layout !== nextLayout) {
@@ -1759,9 +1792,10 @@ function PanelGroupWithForwardedRef({
1759
1792
  const delta = isLastPanel ? panelSize - collapsedSize : collapsedSize - panelSize;
1760
1793
  const nextLayout = adjustLayoutByDelta({
1761
1794
  delta,
1762
- layout: prevLayout,
1795
+ initialLayout: prevLayout,
1763
1796
  panelConstraints: panelConstraintsArray,
1764
1797
  pivotIndices,
1798
+ prevLayout,
1765
1799
  trigger: "imperative-api"
1766
1800
  });
1767
1801
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1801,9 +1835,10 @@ function PanelGroupWithForwardedRef({
1801
1835
  const delta = isLastPanel ? panelSize - baseSize : baseSize - panelSize;
1802
1836
  const nextLayout = adjustLayoutByDelta({
1803
1837
  delta,
1804
- layout: prevLayout,
1838
+ initialLayout: prevLayout,
1805
1839
  panelConstraints: panelConstraintsArray,
1806
1840
  pivotIndices,
1841
+ prevLayout,
1807
1842
  trigger: "imperative-api"
1808
1843
  });
1809
1844
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1985,9 +2020,10 @@ function PanelGroupWithForwardedRef({
1985
2020
  const panelConstraints = panelDataArray.map(panelData => panelData.constraints);
1986
2021
  const nextLayout = adjustLayoutByDelta({
1987
2022
  delta,
1988
- layout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
2023
+ initialLayout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
1989
2024
  panelConstraints,
1990
2025
  pivotIndices,
2026
+ prevLayout,
1991
2027
  trigger: isKeyDown(event) ? "keyboard" : "mouse-or-touch"
1992
2028
  });
1993
2029
  const layoutChanged = !compareLayouts(prevLayout, nextLayout);
@@ -2043,9 +2079,10 @@ function PanelGroupWithForwardedRef({
2043
2079
  const delta = isLastPanel ? panelSize - unsafePanelSize : unsafePanelSize - panelSize;
2044
2080
  const nextLayout = adjustLayoutByDelta({
2045
2081
  delta,
2046
- layout: prevLayout,
2082
+ initialLayout: prevLayout,
2047
2083
  panelConstraints: panelConstraintsArray,
2048
2084
  pivotIndices,
2085
+ prevLayout,
2049
2086
  trigger: "imperative-api"
2050
2087
  });
2051
2088
  if (!compareLayouts(prevLayout, nextLayout)) {
package/dist/react-resizable-panels.browser.esm.js CHANGED
@@ -325,7 +325,9 @@ const props = /\b(?:position|zIndex|opacity|transform|webkitTransform|mixBlendMo
325
325
 
326
326
  /** @param {HTMLElement} node */
327
327
  function is_flex_item(node) {
328
- const display = getComputedStyle(get_parent(node)).display;
328
+ var _get_parent;
329
+ // @ts-ignore
330
+ const display = getComputedStyle((_get_parent = get_parent(node)) !== null && _get_parent !== void 0 ? _get_parent : node).display;
329
331
  return display === "flex" || display === "inline-flex";
330
332
  }
331
333
 
@@ -375,6 +377,7 @@ function get_ancestors(node) {
375
377
  const ancestors = [];
376
378
  while (node) {
377
379
  ancestors.push(node);
380
+ // @ts-ignore
378
381
  node = get_parent(node);
379
382
  }
380
383
  return ancestors; // [ node, ... <body>, <html>, document ]
@@ -382,9 +385,13 @@ function get_ancestors(node) {
382
385
 
383
386
  /** @param {HTMLElement} node */
384
387
  function get_parent(node) {
385
- var _node$parentNode;
386
- // @ts-ignore
387
- return ((_node$parentNode = node.parentNode) === null || _node$parentNode === void 0 ? void 0 : _node$parentNode.host) || node.parentNode;
388
+ const {
389
+ parentNode
390
+ } = node;
391
+ if (parentNode && parentNode instanceof ShadowRoot) {
392
+ return parentNode.host;
393
+ }
394
+ return parentNode;
388
395
  }
389
396
 
390
397
  const EXCEEDED_HORIZONTAL_MIN = 0b0001;
@@ -670,6 +677,20 @@ function fuzzyNumbersEqual(actual, expected, fractionDigits) {
670
677
  return fuzzyCompareNumbers(actual, expected, fractionDigits) === 0;
671
678
  }
672
679
 
680
+ function fuzzyLayoutsEqual(actual, expected, fractionDigits) {
681
+ if (actual.length !== expected.length) {
682
+ return false;
683
+ }
684
+ for (let index = 0; index < actual.length; index++) {
685
+ const actualSize = actual[index];
686
+ const expectedSize = expected[index];
687
+ if (!fuzzyNumbersEqual(actualSize, expectedSize, fractionDigits)) {
688
+ return false;
689
+ }
690
+ }
691
+ return true;
692
+ }
693
+
673
694
  // Panel size must be in percentages; pixel values should be pre-converted
674
695
  function resizePanel({
675
696
  panelConstraints: panelConstraintsArray,
@@ -705,26 +726,29 @@ function resizePanel({
705
726
  // All units must be in percentages; pixel values should be pre-converted
706
727
  function adjustLayoutByDelta({
707
728
  delta,
708
- layout: prevLayout,
729
+ initialLayout,
709
730
  panelConstraints: panelConstraintsArray,
710
731
  pivotIndices,
732
+ prevLayout,
711
733
  trigger
712
734
  }) {
713
735
  if (fuzzyNumbersEqual(delta, 0)) {
714
- return prevLayout;
736
+ return initialLayout;
715
737
  }
716
- const nextLayout = [...prevLayout];
738
+ const nextLayout = [...initialLayout];
717
739
  const [firstPivotIndex, secondPivotIndex] = pivotIndices;
718
740
  assert(firstPivotIndex != null, "Invalid first pivot index");
719
741
  assert(secondPivotIndex != null, "Invalid second pivot index");
720
742
  let deltaApplied = 0;
721
743
 
722
- //const DEBUG = [];
723
- //DEBUG.push(`adjustLayoutByDelta() ${prevLayout.join(", ")}`);
724
- //DEBUG.push(` delta: ${delta}`);
725
- //DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
726
- //DEBUG.push(` trigger: ${trigger}`);
727
- //DEBUG.push("");
744
+ // const DEBUG = [];
745
+ // DEBUG.push(`adjustLayoutByDelta()`);
746
+ // DEBUG.push(` initialLayout: ${initialLayout.join(", ")}`);
747
+ // DEBUG.push(` prevLayout: ${prevLayout.join(", ")}`);
748
+ // DEBUG.push(` delta: ${delta}`);
749
+ // DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
750
+ // DEBUG.push(` trigger: ${trigger}`);
751
+ // DEBUG.push("");
728
752
 
729
753
  // A resizing panel affects the panels before or after it.
730
754
  //
@@ -749,18 +773,18 @@ function adjustLayoutByDelta({
749
773
  minSize = 0
750
774
  } = panelConstraints;
751
775
 
752
- //DEBUG.push(`edge case check 1: ${index}`);
753
- //DEBUG.push(` -> collapsible? ${constraints.collapsible}`);
776
+ // DEBUG.push(`edge case check 1: ${index}`);
777
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
754
778
  if (collapsible) {
755
- const prevSize = prevLayout[index];
779
+ const prevSize = initialLayout[index];
756
780
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
757
781
  if (fuzzyNumbersEqual(prevSize, collapsedSize)) {
758
782
  const localDelta = minSize - prevSize;
759
- //DEBUG.push(` -> expand delta: ${localDelta}`);
783
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
760
784
 
761
785
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
762
786
  delta = delta < 0 ? 0 - localDelta : localDelta;
763
- //DEBUG.push(` -> delta: ${delta}`);
787
+ // DEBUG.push(` -> delta: ${delta}`);
764
788
  }
765
789
  }
766
790
  }
@@ -777,24 +801,24 @@ function adjustLayoutByDelta({
777
801
  minSize = 0
778
802
  } = panelConstraints;
779
803
 
780
- //DEBUG.push(`edge case check 2: ${index}`);
781
- //DEBUG.push(` -> collapsible? ${collapsible}`);
804
+ // DEBUG.push(`edge case check 2: ${index}`);
805
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
782
806
  if (collapsible) {
783
- const prevSize = prevLayout[index];
807
+ const prevSize = initialLayout[index];
784
808
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
785
809
  if (fuzzyNumbersEqual(prevSize, minSize)) {
786
810
  const localDelta = prevSize - collapsedSize;
787
- //DEBUG.push(` -> expand delta: ${localDelta}`);
811
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
788
812
 
789
813
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
790
814
  delta = delta < 0 ? 0 - localDelta : localDelta;
791
- //DEBUG.push(` -> delta: ${delta}`);
815
+ // DEBUG.push(` -> delta: ${delta}`);
792
816
  }
793
817
  }
794
818
  }
795
819
  }
796
820
  }
797
- //DEBUG.push("");
821
+ // DEBUG.push("");
798
822
  }
799
823
 
800
824
  {
@@ -808,9 +832,9 @@ function adjustLayoutByDelta({
808
832
  let index = delta < 0 ? secondPivotIndex : firstPivotIndex;
809
833
  let maxAvailableDelta = 0;
810
834
 
811
- //DEBUG.push("pre calc...");
835
+ // DEBUG.push("pre calc...");
812
836
  while (true) {
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
  const maxSafeSize = resizePanel({
816
840
  panelConstraints: panelConstraintsArray,
@@ -818,7 +842,7 @@ function adjustLayoutByDelta({
818
842
  size: 100
819
843
  });
820
844
  const delta = maxSafeSize - prevSize;
821
- //DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
845
+ // DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
822
846
 
823
847
  maxAvailableDelta += delta;
824
848
  index += increment;
@@ -827,11 +851,11 @@ function adjustLayoutByDelta({
827
851
  }
828
852
  }
829
853
 
830
- //DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
854
+ // DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
831
855
  const minAbsDelta = Math.min(Math.abs(delta), Math.abs(maxAvailableDelta));
832
856
  delta = delta < 0 ? 0 - minAbsDelta : minAbsDelta;
833
- //DEBUG.push(` -> adjusted delta: ${delta}`);
834
- //DEBUG.push("");
857
+ // DEBUG.push(` -> adjusted delta: ${delta}`);
858
+ // DEBUG.push("");
835
859
  }
836
860
 
837
861
  {
@@ -841,7 +865,7 @@ function adjustLayoutByDelta({
841
865
  let index = pivotIndex;
842
866
  while (index >= 0 && index < panelConstraintsArray.length) {
843
867
  const deltaRemaining = Math.abs(delta) - Math.abs(deltaApplied);
844
- const prevSize = prevLayout[index];
868
+ const prevSize = initialLayout[index];
845
869
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
846
870
  const unsafeSize = prevSize - deltaRemaining;
847
871
  const safeSize = resizePanel({
@@ -865,20 +889,22 @@ function adjustLayoutByDelta({
865
889
  }
866
890
  }
867
891
  }
868
- //DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
869
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
870
- //DEBUG.push("");
892
+ // DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
893
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
894
+ // DEBUG.push("");
871
895
 
872
896
  // If we were unable to resize any of the panels panels, return the previous state.
873
897
  // This will essentially bailout and ignore e.g. drags past a panel's boundaries
874
- if (fuzzyNumbersEqual(deltaApplied, 0)) {
875
- //console.log(DEBUG.join("\n"));
898
+ if (fuzzyLayoutsEqual(prevLayout, nextLayout)) {
899
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
900
+ // console.log(DEBUG.join("\n"));
901
+
876
902
  return prevLayout;
877
903
  }
878
904
  {
879
905
  // Now distribute the applied delta to the panels in the other direction
880
906
  const pivotIndex = delta < 0 ? secondPivotIndex : firstPivotIndex;
881
- const prevSize = prevLayout[pivotIndex];
907
+ const prevSize = initialLayout[pivotIndex];
882
908
  assert(prevSize != null, `Previous layout not found for panel index ${pivotIndex}`);
883
909
  const unsafeSize = prevSize + deltaApplied;
884
910
  const safeSize = resizePanel({
@@ -919,17 +945,23 @@ function adjustLayoutByDelta({
919
945
  }
920
946
  }
921
947
  }
922
- //DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
923
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
924
- //DEBUG.push("");
948
+ // DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
949
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
950
+ // DEBUG.push("");
925
951
 
926
952
  const totalSize = nextLayout.reduce((total, size) => size + total, 0);
927
- //DEBUG.push(`total size: ${totalSize}`);
928
- //console.log(DEBUG.join("\n"));
953
+ // DEBUG.push(`total size: ${totalSize}`);
929
954
 
955
+ // If our new layout doesn't add up to 100%, that means the requested delta can't be applied
956
+ // In that case, fall back to our most recent valid layout
930
957
  if (!fuzzyNumbersEqual(totalSize, 100)) {
958
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
959
+ // console.log(DEBUG.join("\n"));
960
+
931
961
  return prevLayout;
932
962
  }
963
+
964
+ // console.log(DEBUG.join("\n"));
933
965
  return nextLayout;
934
966
  }
935
967
 
@@ -1109,9 +1141,10 @@ function useWindowSplitterPanelGroupBehavior({
1109
1141
  if (size != null && collapsible) {
1110
1142
  const nextLayout = adjustLayoutByDelta({
1111
1143
  delta: fuzzyNumbersEqual(size, collapsedSize) ? minSize - collapsedSize : collapsedSize - size,
1112
- layout,
1144
+ initialLayout: layout,
1113
1145
  panelConstraints: panelDataArray.map(panelData => panelData.constraints),
1114
1146
  pivotIndices: determinePivotIndices(groupId, handleId, panelGroupElement),
1147
+ prevLayout: layout,
1115
1148
  trigger: "keyboard"
1116
1149
  });
1117
1150
  if (layout !== nextLayout) {
@@ -1653,9 +1686,10 @@ function PanelGroupWithForwardedRef({
1653
1686
  const delta = isLastPanel ? panelSize - collapsedSize : collapsedSize - panelSize;
1654
1687
  const nextLayout = adjustLayoutByDelta({
1655
1688
  delta,
1656
- layout: prevLayout,
1689
+ initialLayout: prevLayout,
1657
1690
  panelConstraints: panelConstraintsArray,
1658
1691
  pivotIndices,
1692
+ prevLayout,
1659
1693
  trigger: "imperative-api"
1660
1694
  });
1661
1695
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1695,9 +1729,10 @@ function PanelGroupWithForwardedRef({
1695
1729
  const delta = isLastPanel ? panelSize - baseSize : baseSize - panelSize;
1696
1730
  const nextLayout = adjustLayoutByDelta({
1697
1731
  delta,
1698
- layout: prevLayout,
1732
+ initialLayout: prevLayout,
1699
1733
  panelConstraints: panelConstraintsArray,
1700
1734
  pivotIndices,
1735
+ prevLayout,
1701
1736
  trigger: "imperative-api"
1702
1737
  });
1703
1738
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1879,9 +1914,10 @@ function PanelGroupWithForwardedRef({
1879
1914
  const panelConstraints = panelDataArray.map(panelData => panelData.constraints);
1880
1915
  const nextLayout = adjustLayoutByDelta({
1881
1916
  delta,
1882
- layout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
1917
+ initialLayout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
1883
1918
  panelConstraints,
1884
1919
  pivotIndices,
1920
+ prevLayout,
1885
1921
  trigger: isKeyDown(event) ? "keyboard" : "mouse-or-touch"
1886
1922
  });
1887
1923
  const layoutChanged = !compareLayouts(prevLayout, nextLayout);
@@ -1937,9 +1973,10 @@ function PanelGroupWithForwardedRef({
1937
1973
  const delta = isLastPanel ? panelSize - unsafePanelSize : unsafePanelSize - panelSize;
1938
1974
  const nextLayout = adjustLayoutByDelta({
1939
1975
  delta,
1940
- layout: prevLayout,
1976
+ initialLayout: prevLayout,
1941
1977
  panelConstraints: panelConstraintsArray,
1942
1978
  pivotIndices,
1979
+ prevLayout,
1943
1980
  trigger: "imperative-api"
1944
1981
  });
1945
1982
  if (!compareLayouts(prevLayout, nextLayout)) {