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.development.node.esm.js CHANGED
@@ -300,7 +300,9 @@ const props = /\b(?:position|zIndex|opacity|transform|webkitTransform|mixBlendMo
300
300
 
301
301
  /** @param {HTMLElement} node */
302
302
  function is_flex_item(node) {
303
- const display = getComputedStyle(get_parent(node)).display;
303
+ var _get_parent;
304
+ // @ts-ignore
305
+ const display = getComputedStyle((_get_parent = get_parent(node)) !== null && _get_parent !== void 0 ? _get_parent : node).display;
304
306
  return display === "flex" || display === "inline-flex";
305
307
  }
306
308
 
@@ -350,6 +352,7 @@ function get_ancestors(node) {
350
352
  const ancestors = [];
351
353
  while (node) {
352
354
  ancestors.push(node);
355
+ // @ts-ignore
353
356
  node = get_parent(node);
354
357
  }
355
358
  return ancestors; // [ node, ... <body>, <html>, document ]
@@ -357,9 +360,13 @@ function get_ancestors(node) {
357
360
 
358
361
  /** @param {HTMLElement} node */
359
362
  function get_parent(node) {
360
- var _node$parentNode;
361
- // @ts-ignore
362
- return ((_node$parentNode = node.parentNode) === null || _node$parentNode === void 0 ? void 0 : _node$parentNode.host) || node.parentNode;
363
+ const {
364
+ parentNode
365
+ } = node;
366
+ if (parentNode && parentNode instanceof ShadowRoot) {
367
+ return parentNode.host;
368
+ }
369
+ return parentNode;
363
370
  }
364
371
 
365
372
  const EXCEEDED_HORIZONTAL_MIN = 0b0001;
@@ -645,6 +652,20 @@ function fuzzyNumbersEqual(actual, expected, fractionDigits) {
645
652
  return fuzzyCompareNumbers(actual, expected, fractionDigits) === 0;
646
653
  }
647
654
 
655
+ function fuzzyLayoutsEqual(actual, expected, fractionDigits) {
656
+ if (actual.length !== expected.length) {
657
+ return false;
658
+ }
659
+ for (let index = 0; index < actual.length; index++) {
660
+ const actualSize = actual[index];
661
+ const expectedSize = expected[index];
662
+ if (!fuzzyNumbersEqual(actualSize, expectedSize, fractionDigits)) {
663
+ return false;
664
+ }
665
+ }
666
+ return true;
667
+ }
668
+
648
669
  // Panel size must be in percentages; pixel values should be pre-converted
649
670
  function resizePanel({
650
671
  panelConstraints: panelConstraintsArray,
@@ -680,26 +701,29 @@ function resizePanel({
680
701
  // All units must be in percentages; pixel values should be pre-converted
681
702
  function adjustLayoutByDelta({
682
703
  delta,
683
- layout: prevLayout,
704
+ initialLayout,
684
705
  panelConstraints: panelConstraintsArray,
685
706
  pivotIndices,
707
+ prevLayout,
686
708
  trigger
687
709
  }) {
688
710
  if (fuzzyNumbersEqual(delta, 0)) {
689
- return prevLayout;
711
+ return initialLayout;
690
712
  }
691
- const nextLayout = [...prevLayout];
713
+ const nextLayout = [...initialLayout];
692
714
  const [firstPivotIndex, secondPivotIndex] = pivotIndices;
693
715
  assert(firstPivotIndex != null, "Invalid first pivot index");
694
716
  assert(secondPivotIndex != null, "Invalid second pivot index");
695
717
  let deltaApplied = 0;
696
718
 
697
- //const DEBUG = [];
698
- //DEBUG.push(`adjustLayoutByDelta() ${prevLayout.join(", ")}`);
699
- //DEBUG.push(` delta: ${delta}`);
700
- //DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
701
- //DEBUG.push(` trigger: ${trigger}`);
702
- //DEBUG.push("");
719
+ // const DEBUG = [];
720
+ // DEBUG.push(`adjustLayoutByDelta()`);
721
+ // DEBUG.push(` initialLayout: ${initialLayout.join(", ")}`);
722
+ // DEBUG.push(` prevLayout: ${prevLayout.join(", ")}`);
723
+ // DEBUG.push(` delta: ${delta}`);
724
+ // DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
725
+ // DEBUG.push(` trigger: ${trigger}`);
726
+ // DEBUG.push("");
703
727
 
704
728
  // A resizing panel affects the panels before or after it.
705
729
  //
@@ -724,18 +748,18 @@ function adjustLayoutByDelta({
724
748
  minSize = 0
725
749
  } = panelConstraints;
726
750
 
727
- //DEBUG.push(`edge case check 1: ${index}`);
728
- //DEBUG.push(` -> collapsible? ${constraints.collapsible}`);
751
+ // DEBUG.push(`edge case check 1: ${index}`);
752
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
729
753
  if (collapsible) {
730
- const prevSize = prevLayout[index];
754
+ const prevSize = initialLayout[index];
731
755
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
732
756
  if (fuzzyNumbersEqual(prevSize, collapsedSize)) {
733
757
  const localDelta = minSize - prevSize;
734
- //DEBUG.push(` -> expand delta: ${localDelta}`);
758
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
735
759
 
736
760
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
737
761
  delta = delta < 0 ? 0 - localDelta : localDelta;
738
- //DEBUG.push(` -> delta: ${delta}`);
762
+ // DEBUG.push(` -> delta: ${delta}`);
739
763
  }
740
764
  }
741
765
  }
@@ -752,24 +776,24 @@ function adjustLayoutByDelta({
752
776
  minSize = 0
753
777
  } = panelConstraints;
754
778
 
755
- //DEBUG.push(`edge case check 2: ${index}`);
756
- //DEBUG.push(` -> collapsible? ${collapsible}`);
779
+ // DEBUG.push(`edge case check 2: ${index}`);
780
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
757
781
  if (collapsible) {
758
- const prevSize = prevLayout[index];
782
+ const prevSize = initialLayout[index];
759
783
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
760
784
  if (fuzzyNumbersEqual(prevSize, minSize)) {
761
785
  const localDelta = prevSize - collapsedSize;
762
- //DEBUG.push(` -> expand delta: ${localDelta}`);
786
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
763
787
 
764
788
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
765
789
  delta = delta < 0 ? 0 - localDelta : localDelta;
766
- //DEBUG.push(` -> delta: ${delta}`);
790
+ // DEBUG.push(` -> delta: ${delta}`);
767
791
  }
768
792
  }
769
793
  }
770
794
  }
771
795
  }
772
- //DEBUG.push("");
796
+ // DEBUG.push("");
773
797
  }
774
798
 
775
799
  {
@@ -783,9 +807,9 @@ function adjustLayoutByDelta({
783
807
  let index = delta < 0 ? secondPivotIndex : firstPivotIndex;
784
808
  let maxAvailableDelta = 0;
785
809
 
786
- //DEBUG.push("pre calc...");
810
+ // DEBUG.push("pre calc...");
787
811
  while (true) {
788
- const prevSize = prevLayout[index];
812
+ const prevSize = initialLayout[index];
789
813
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
790
814
  const maxSafeSize = resizePanel({
791
815
  panelConstraints: panelConstraintsArray,
@@ -793,7 +817,7 @@ function adjustLayoutByDelta({
793
817
  size: 100
794
818
  });
795
819
  const delta = maxSafeSize - prevSize;
796
- //DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
820
+ // DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
797
821
 
798
822
  maxAvailableDelta += delta;
799
823
  index += increment;
@@ -802,11 +826,11 @@ function adjustLayoutByDelta({
802
826
  }
803
827
  }
804
828
 
805
- //DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
829
+ // DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
806
830
  const minAbsDelta = Math.min(Math.abs(delta), Math.abs(maxAvailableDelta));
807
831
  delta = delta < 0 ? 0 - minAbsDelta : minAbsDelta;
808
- //DEBUG.push(` -> adjusted delta: ${delta}`);
809
- //DEBUG.push("");
832
+ // DEBUG.push(` -> adjusted delta: ${delta}`);
833
+ // DEBUG.push("");
810
834
  }
811
835
 
812
836
  {
@@ -816,7 +840,7 @@ function adjustLayoutByDelta({
816
840
  let index = pivotIndex;
817
841
  while (index >= 0 && index < panelConstraintsArray.length) {
818
842
  const deltaRemaining = Math.abs(delta) - Math.abs(deltaApplied);
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 unsafeSize = prevSize - deltaRemaining;
822
846
  const safeSize = resizePanel({
@@ -840,20 +864,22 @@ function adjustLayoutByDelta({
840
864
  }
841
865
  }
842
866
  }
843
- //DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
844
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
845
- //DEBUG.push("");
867
+ // DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
868
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
869
+ // DEBUG.push("");
846
870
 
847
871
  // If we were unable to resize any of the panels panels, return the previous state.
848
872
  // This will essentially bailout and ignore e.g. drags past a panel's boundaries
849
- if (fuzzyNumbersEqual(deltaApplied, 0)) {
850
- //console.log(DEBUG.join("\n"));
873
+ if (fuzzyLayoutsEqual(prevLayout, nextLayout)) {
874
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
875
+ // console.log(DEBUG.join("\n"));
876
+
851
877
  return prevLayout;
852
878
  }
853
879
  {
854
880
  // Now distribute the applied delta to the panels in the other direction
855
881
  const pivotIndex = delta < 0 ? secondPivotIndex : firstPivotIndex;
856
- const prevSize = prevLayout[pivotIndex];
882
+ const prevSize = initialLayout[pivotIndex];
857
883
  assert(prevSize != null, `Previous layout not found for panel index ${pivotIndex}`);
858
884
  const unsafeSize = prevSize + deltaApplied;
859
885
  const safeSize = resizePanel({
@@ -894,17 +920,23 @@ function adjustLayoutByDelta({
894
920
  }
895
921
  }
896
922
  }
897
- //DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
898
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
899
- //DEBUG.push("");
923
+ // DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
924
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
925
+ // DEBUG.push("");
900
926
 
901
927
  const totalSize = nextLayout.reduce((total, size) => size + total, 0);
902
- //DEBUG.push(`total size: ${totalSize}`);
903
- //console.log(DEBUG.join("\n"));
928
+ // DEBUG.push(`total size: ${totalSize}`);
904
929
 
930
+ // If our new layout doesn't add up to 100%, that means the requested delta can't be applied
931
+ // In that case, fall back to our most recent valid layout
905
932
  if (!fuzzyNumbersEqual(totalSize, 100)) {
933
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
934
+ // console.log(DEBUG.join("\n"));
935
+
906
936
  return prevLayout;
907
937
  }
938
+
939
+ // console.log(DEBUG.join("\n"));
908
940
  return nextLayout;
909
941
  }
910
942
 
@@ -1011,9 +1043,10 @@ function useWindowSplitterPanelGroupBehavior({
1011
1043
  if (size != null && collapsible) {
1012
1044
  const nextLayout = adjustLayoutByDelta({
1013
1045
  delta: fuzzyNumbersEqual(size, collapsedSize) ? minSize - collapsedSize : collapsedSize - size,
1014
- layout,
1046
+ initialLayout: layout,
1015
1047
  panelConstraints: panelDataArray.map(panelData => panelData.constraints),
1016
1048
  pivotIndices: determinePivotIndices(groupId, handleId, panelGroupElement),
1049
+ prevLayout: layout,
1017
1050
  trigger: "keyboard"
1018
1051
  });
1019
1052
  if (layout !== nextLayout) {
@@ -1590,9 +1623,10 @@ function PanelGroupWithForwardedRef({
1590
1623
  const delta = isLastPanel ? panelSize - collapsedSize : collapsedSize - panelSize;
1591
1624
  const nextLayout = adjustLayoutByDelta({
1592
1625
  delta,
1593
- layout: prevLayout,
1626
+ initialLayout: prevLayout,
1594
1627
  panelConstraints: panelConstraintsArray,
1595
1628
  pivotIndices,
1629
+ prevLayout,
1596
1630
  trigger: "imperative-api"
1597
1631
  });
1598
1632
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1632,9 +1666,10 @@ function PanelGroupWithForwardedRef({
1632
1666
  const delta = isLastPanel ? panelSize - baseSize : baseSize - panelSize;
1633
1667
  const nextLayout = adjustLayoutByDelta({
1634
1668
  delta,
1635
- layout: prevLayout,
1669
+ initialLayout: prevLayout,
1636
1670
  panelConstraints: panelConstraintsArray,
1637
1671
  pivotIndices,
1672
+ prevLayout,
1638
1673
  trigger: "imperative-api"
1639
1674
  });
1640
1675
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1760,9 +1795,10 @@ function PanelGroupWithForwardedRef({
1760
1795
  const panelConstraints = panelDataArray.map(panelData => panelData.constraints);
1761
1796
  const nextLayout = adjustLayoutByDelta({
1762
1797
  delta,
1763
- layout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
1798
+ initialLayout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
1764
1799
  panelConstraints,
1765
1800
  pivotIndices,
1801
+ prevLayout,
1766
1802
  trigger: isKeyDown(event) ? "keyboard" : "mouse-or-touch"
1767
1803
  });
1768
1804
  const layoutChanged = !compareLayouts(prevLayout, nextLayout);
@@ -1818,9 +1854,10 @@ function PanelGroupWithForwardedRef({
1818
1854
  const delta = isLastPanel ? panelSize - unsafePanelSize : unsafePanelSize - panelSize;
1819
1855
  const nextLayout = adjustLayoutByDelta({
1820
1856
  delta,
1821
- layout: prevLayout,
1857
+ initialLayout: prevLayout,
1822
1858
  panelConstraints: panelConstraintsArray,
1823
1859
  pivotIndices,
1860
+ prevLayout,
1824
1861
  trigger: "imperative-api"
1825
1862
  });
1826
1863
  if (!compareLayouts(prevLayout, nextLayout)) {
package/dist/react-resizable-panels.esm.js CHANGED
@@ -327,7 +327,9 @@ const props = /\b(?:position|zIndex|opacity|transform|webkitTransform|mixBlendMo
327
327
 
328
328
  /** @param {HTMLElement} node */
329
329
  function is_flex_item(node) {
330
- const display = getComputedStyle(get_parent(node)).display;
330
+ var _get_parent;
331
+ // @ts-ignore
332
+ const display = getComputedStyle((_get_parent = get_parent(node)) !== null && _get_parent !== void 0 ? _get_parent : node).display;
331
333
  return display === "flex" || display === "inline-flex";
332
334
  }
333
335
 
@@ -377,6 +379,7 @@ function get_ancestors(node) {
377
379
  const ancestors = [];
378
380
  while (node) {
379
381
  ancestors.push(node);
382
+ // @ts-ignore
380
383
  node = get_parent(node);
381
384
  }
382
385
  return ancestors; // [ node, ... <body>, <html>, document ]
@@ -384,9 +387,13 @@ function get_ancestors(node) {
384
387
 
385
388
  /** @param {HTMLElement} node */
386
389
  function get_parent(node) {
387
- var _node$parentNode;
388
- // @ts-ignore
389
- return ((_node$parentNode = node.parentNode) === null || _node$parentNode === void 0 ? void 0 : _node$parentNode.host) || node.parentNode;
390
+ const {
391
+ parentNode
392
+ } = node;
393
+ if (parentNode && parentNode instanceof ShadowRoot) {
394
+ return parentNode.host;
395
+ }
396
+ return parentNode;
390
397
  }
391
398
 
392
399
  const EXCEEDED_HORIZONTAL_MIN = 0b0001;
@@ -672,6 +679,20 @@ function fuzzyNumbersEqual(actual, expected, fractionDigits) {
672
679
  return fuzzyCompareNumbers(actual, expected, fractionDigits) === 0;
673
680
  }
674
681
 
682
+ function fuzzyLayoutsEqual(actual, expected, fractionDigits) {
683
+ if (actual.length !== expected.length) {
684
+ return false;
685
+ }
686
+ for (let index = 0; index < actual.length; index++) {
687
+ const actualSize = actual[index];
688
+ const expectedSize = expected[index];
689
+ if (!fuzzyNumbersEqual(actualSize, expectedSize, fractionDigits)) {
690
+ return false;
691
+ }
692
+ }
693
+ return true;
694
+ }
695
+
675
696
  // Panel size must be in percentages; pixel values should be pre-converted
676
697
  function resizePanel({
677
698
  panelConstraints: panelConstraintsArray,
@@ -707,26 +728,29 @@ function resizePanel({
707
728
  // All units must be in percentages; pixel values should be pre-converted
708
729
  function adjustLayoutByDelta({
709
730
  delta,
710
- layout: prevLayout,
731
+ initialLayout,
711
732
  panelConstraints: panelConstraintsArray,
712
733
  pivotIndices,
734
+ prevLayout,
713
735
  trigger
714
736
  }) {
715
737
  if (fuzzyNumbersEqual(delta, 0)) {
716
- return prevLayout;
738
+ return initialLayout;
717
739
  }
718
- const nextLayout = [...prevLayout];
740
+ const nextLayout = [...initialLayout];
719
741
  const [firstPivotIndex, secondPivotIndex] = pivotIndices;
720
742
  assert(firstPivotIndex != null, "Invalid first pivot index");
721
743
  assert(secondPivotIndex != null, "Invalid second pivot index");
722
744
  let deltaApplied = 0;
723
745
 
724
- //const DEBUG = [];
725
- //DEBUG.push(`adjustLayoutByDelta() ${prevLayout.join(", ")}`);
726
- //DEBUG.push(` delta: ${delta}`);
727
- //DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
728
- //DEBUG.push(` trigger: ${trigger}`);
729
- //DEBUG.push("");
746
+ // const DEBUG = [];
747
+ // DEBUG.push(`adjustLayoutByDelta()`);
748
+ // DEBUG.push(` initialLayout: ${initialLayout.join(", ")}`);
749
+ // DEBUG.push(` prevLayout: ${prevLayout.join(", ")}`);
750
+ // DEBUG.push(` delta: ${delta}`);
751
+ // DEBUG.push(` pivotIndices: ${pivotIndices.join(", ")}`);
752
+ // DEBUG.push(` trigger: ${trigger}`);
753
+ // DEBUG.push("");
730
754
 
731
755
  // A resizing panel affects the panels before or after it.
732
756
  //
@@ -751,18 +775,18 @@ function adjustLayoutByDelta({
751
775
  minSize = 0
752
776
  } = panelConstraints;
753
777
 
754
- //DEBUG.push(`edge case check 1: ${index}`);
755
- //DEBUG.push(` -> collapsible? ${constraints.collapsible}`);
778
+ // DEBUG.push(`edge case check 1: ${index}`);
779
+ // DEBUG.push(` -> collapsible? ${collapsible}`);
756
780
  if (collapsible) {
757
- const prevSize = prevLayout[index];
781
+ const prevSize = initialLayout[index];
758
782
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
759
783
  if (fuzzyNumbersEqual(prevSize, collapsedSize)) {
760
784
  const localDelta = minSize - prevSize;
761
- //DEBUG.push(` -> expand delta: ${localDelta}`);
785
+ // DEBUG.push(` -> expand delta: ${localDelta}`);
762
786
 
763
787
  if (fuzzyCompareNumbers(localDelta, Math.abs(delta)) > 0) {
764
788
  delta = delta < 0 ? 0 - localDelta : localDelta;
765
- //DEBUG.push(` -> delta: ${delta}`);
789
+ // DEBUG.push(` -> delta: ${delta}`);
766
790
  }
767
791
  }
768
792
  }
@@ -779,24 +803,24 @@ function adjustLayoutByDelta({
779
803
  minSize = 0
780
804
  } = panelConstraints;
781
805
 
782
- //DEBUG.push(`edge case check 2: ${index}`);
783
- //DEBUG.push(` -> collapsible? ${collapsible}`);
806
+ // DEBUG.push(`edge case check 2: ${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, minSize)) {
788
812
  const localDelta = prevSize - collapsedSize;
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
  }
797
821
  }
798
822
  }
799
- //DEBUG.push("");
823
+ // DEBUG.push("");
800
824
  }
801
825
 
802
826
  {
@@ -810,9 +834,9 @@ function adjustLayoutByDelta({
810
834
  let index = delta < 0 ? secondPivotIndex : firstPivotIndex;
811
835
  let maxAvailableDelta = 0;
812
836
 
813
- //DEBUG.push("pre calc...");
837
+ // DEBUG.push("pre calc...");
814
838
  while (true) {
815
- const prevSize = prevLayout[index];
839
+ const prevSize = initialLayout[index];
816
840
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
817
841
  const maxSafeSize = resizePanel({
818
842
  panelConstraints: panelConstraintsArray,
@@ -820,7 +844,7 @@ function adjustLayoutByDelta({
820
844
  size: 100
821
845
  });
822
846
  const delta = maxSafeSize - prevSize;
823
- //DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
847
+ // DEBUG.push(` ${index}: ${prevSize} -> ${maxSafeSize}`);
824
848
 
825
849
  maxAvailableDelta += delta;
826
850
  index += increment;
@@ -829,11 +853,11 @@ function adjustLayoutByDelta({
829
853
  }
830
854
  }
831
855
 
832
- //DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
856
+ // DEBUG.push(` -> max available delta: ${maxAvailableDelta}`);
833
857
  const minAbsDelta = Math.min(Math.abs(delta), Math.abs(maxAvailableDelta));
834
858
  delta = delta < 0 ? 0 - minAbsDelta : minAbsDelta;
835
- //DEBUG.push(` -> adjusted delta: ${delta}`);
836
- //DEBUG.push("");
859
+ // DEBUG.push(` -> adjusted delta: ${delta}`);
860
+ // DEBUG.push("");
837
861
  }
838
862
 
839
863
  {
@@ -843,7 +867,7 @@ function adjustLayoutByDelta({
843
867
  let index = pivotIndex;
844
868
  while (index >= 0 && index < panelConstraintsArray.length) {
845
869
  const deltaRemaining = Math.abs(delta) - Math.abs(deltaApplied);
846
- const prevSize = prevLayout[index];
870
+ const prevSize = initialLayout[index];
847
871
  assert(prevSize != null, `Previous layout not found for panel index ${index}`);
848
872
  const unsafeSize = prevSize - deltaRemaining;
849
873
  const safeSize = resizePanel({
@@ -867,20 +891,22 @@ function adjustLayoutByDelta({
867
891
  }
868
892
  }
869
893
  }
870
- //DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
871
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
872
- //DEBUG.push("");
894
+ // DEBUG.push(`after 1: ${nextLayout.join(", ")}`);
895
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
896
+ // DEBUG.push("");
873
897
 
874
898
  // If we were unable to resize any of the panels panels, return the previous state.
875
899
  // This will essentially bailout and ignore e.g. drags past a panel's boundaries
876
- if (fuzzyNumbersEqual(deltaApplied, 0)) {
877
- //console.log(DEBUG.join("\n"));
900
+ if (fuzzyLayoutsEqual(prevLayout, nextLayout)) {
901
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
902
+ // console.log(DEBUG.join("\n"));
903
+
878
904
  return prevLayout;
879
905
  }
880
906
  {
881
907
  // Now distribute the applied delta to the panels in the other direction
882
908
  const pivotIndex = delta < 0 ? secondPivotIndex : firstPivotIndex;
883
- const prevSize = prevLayout[pivotIndex];
909
+ const prevSize = initialLayout[pivotIndex];
884
910
  assert(prevSize != null, `Previous layout not found for panel index ${pivotIndex}`);
885
911
  const unsafeSize = prevSize + deltaApplied;
886
912
  const safeSize = resizePanel({
@@ -921,17 +947,23 @@ function adjustLayoutByDelta({
921
947
  }
922
948
  }
923
949
  }
924
- //DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
925
- //DEBUG.push(` deltaApplied: ${deltaApplied}`);
926
- //DEBUG.push("");
950
+ // DEBUG.push(`after 2: ${nextLayout.join(", ")}`);
951
+ // DEBUG.push(` deltaApplied: ${deltaApplied}`);
952
+ // DEBUG.push("");
927
953
 
928
954
  const totalSize = nextLayout.reduce((total, size) => size + total, 0);
929
- //DEBUG.push(`total size: ${totalSize}`);
930
- //console.log(DEBUG.join("\n"));
955
+ // DEBUG.push(`total size: ${totalSize}`);
931
956
 
957
+ // If our new layout doesn't add up to 100%, that means the requested delta can't be applied
958
+ // In that case, fall back to our most recent valid layout
932
959
  if (!fuzzyNumbersEqual(totalSize, 100)) {
960
+ // DEBUG.push(`bailout to previous layout: ${prevLayout.join(", ")}`);
961
+ // console.log(DEBUG.join("\n"));
962
+
933
963
  return prevLayout;
934
964
  }
965
+
966
+ // console.log(DEBUG.join("\n"));
935
967
  return nextLayout;
936
968
  }
937
969
 
@@ -1111,9 +1143,10 @@ function useWindowSplitterPanelGroupBehavior({
1111
1143
  if (size != null && collapsible) {
1112
1144
  const nextLayout = adjustLayoutByDelta({
1113
1145
  delta: fuzzyNumbersEqual(size, collapsedSize) ? minSize - collapsedSize : collapsedSize - size,
1114
- layout,
1146
+ initialLayout: layout,
1115
1147
  panelConstraints: panelDataArray.map(panelData => panelData.constraints),
1116
1148
  pivotIndices: determinePivotIndices(groupId, handleId, panelGroupElement),
1149
+ prevLayout: layout,
1117
1150
  trigger: "keyboard"
1118
1151
  });
1119
1152
  if (layout !== nextLayout) {
@@ -1655,9 +1688,10 @@ function PanelGroupWithForwardedRef({
1655
1688
  const delta = isLastPanel ? panelSize - collapsedSize : collapsedSize - panelSize;
1656
1689
  const nextLayout = adjustLayoutByDelta({
1657
1690
  delta,
1658
- layout: prevLayout,
1691
+ initialLayout: prevLayout,
1659
1692
  panelConstraints: panelConstraintsArray,
1660
1693
  pivotIndices,
1694
+ prevLayout,
1661
1695
  trigger: "imperative-api"
1662
1696
  });
1663
1697
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1697,9 +1731,10 @@ function PanelGroupWithForwardedRef({
1697
1731
  const delta = isLastPanel ? panelSize - baseSize : baseSize - panelSize;
1698
1732
  const nextLayout = adjustLayoutByDelta({
1699
1733
  delta,
1700
- layout: prevLayout,
1734
+ initialLayout: prevLayout,
1701
1735
  panelConstraints: panelConstraintsArray,
1702
1736
  pivotIndices,
1737
+ prevLayout,
1703
1738
  trigger: "imperative-api"
1704
1739
  });
1705
1740
  if (!compareLayouts(prevLayout, nextLayout)) {
@@ -1881,9 +1916,10 @@ function PanelGroupWithForwardedRef({
1881
1916
  const panelConstraints = panelDataArray.map(panelData => panelData.constraints);
1882
1917
  const nextLayout = adjustLayoutByDelta({
1883
1918
  delta,
1884
- layout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
1919
+ initialLayout: initialLayout !== null && initialLayout !== void 0 ? initialLayout : prevLayout,
1885
1920
  panelConstraints,
1886
1921
  pivotIndices,
1922
+ prevLayout,
1887
1923
  trigger: isKeyDown(event) ? "keyboard" : "mouse-or-touch"
1888
1924
  });
1889
1925
  const layoutChanged = !compareLayouts(prevLayout, nextLayout);
@@ -1939,9 +1975,10 @@ function PanelGroupWithForwardedRef({
1939
1975
  const delta = isLastPanel ? panelSize - unsafePanelSize : unsafePanelSize - panelSize;
1940
1976
  const nextLayout = adjustLayoutByDelta({
1941
1977
  delta,
1942
- layout: prevLayout,
1978
+ initialLayout: prevLayout,
1943
1979
  panelConstraints: panelConstraintsArray,
1944
1980
  pivotIndices,
1981
+ prevLayout,
1945
1982
  trigger: "imperative-api"
1946
1983
  });
1947
1984
  if (!compareLayouts(prevLayout, nextLayout)) {