Merge pull request #6490 from KirilCycle/fix/splitter-with-multi-panels

Fix: #6487 Splitter can work with multiple panels
primefaces · Apr 30, 2024 · 378a167 · 378a167
2 parents 681a1aa + 36a99a9
commit 378a167
Showing 1 changed file with 9 additions and 1 deletion.
diff --git a/components/lib/splitter/Splitter.js b/components/lib/splitter/Splitter.js
@@ -199,7 +199,10 @@ export const Splitter = React.memo(
         };
 
         const onResizeEnd = (event) => {
-            const sizes = [prevPanelSizeNew.current, nextPanelSizeNew.current];
+            let sizes = [...panelSizes];
+
+            sizes[prevPanelIndex.current] = prevPanelSizeNew.current;
+            sizes[prevPanelIndex.current + 1] = nextPanelSizeNew.current;
 
             if (props.onResizeEnd) {
                 props.onResizeEnd({
@@ -371,15 +374,20 @@ export const Splitter = React.memo(
         React.useEffect(() => {
             const panelElements = [...elementRef.current.children].filter((child) => DomHandler.getAttribute(child, 'data-pc-section') === 'splitterpanel.root');
 
+            let _panelSizes = [];
+
             panelElements.map((panelElement, i) => {
                 prevSize.current = panelSize(panelSizes, 0);
+                _panelSizes[i] = panelSize(panelSizes, i);
 
                 if (panelElement.childNodes && ObjectUtils.isNotEmpty(DomHandler.find(panelElement, "[data-pc-name='splitter']") && DomHandler.find(panelElement, "[data-pc-section='root']"))) {
                     !isUnstyled() && DomHandler.addClass(panelElement, 'p-splitter-panel-nested');
                     panelElement.setAttribute('data-p-splitter-panel-nested', true);
                     setNested(true);
                 }
             });
+
+            setPanelSizes(_panelSizes);
             // eslint-disable-next-line react-hooks/exhaustive-deps
         }, []);