I'm having issues with the Splitter and DataTable as well. I started with MUIX's DataGrid, thinking it was library incompatibility. The splitter will expand, but it wont shrink when the DataTable is 100% width. I'm guessing it has to do with the flex-basis style that is adjusted when you move the gutter bar. The component reads that the SplitterPanel is as small as it can be, so it stops shrinking.
Originally posted by **joepascual** March 26, 2024
Hello. I'm a PrimeReact beginner and was wondering if anyone can recommend a simple solution to my problem. I would like to display two DataTables side by side using a Splitter. When I have a just a single DataTable, I get the desired behavior where the DataTable takes up the whole width of the viewport and horizontal scrollbars appear as needed when the DataTable exceeds the width of the viewport. When I have just a Splitter, again it takes up the whole width of the viewport and the two SplitterPanels are split into equal widths by default. However, when I embed the DataTables in the Splitter, the Splitter exceeds the viewport and the DataTables do not display horizontal scrollbars. I would like the limit the Splitter within the view port and the for the DataTables to display horizontal scrollbars. Thanks in advance.
https://stackblitz.com/edit/yzjdrh?file=src%2FApp.jsx
I'm having issues with the Splitter and DataTable as well. I started with MUIX's DataGrid, thinking it was library incompatibility. The splitter will expand, but it wont shrink when the DataTable is 100% width. I'm guessing it has to do with the flex-basis style that is adjusted when you move the gutter bar. The component reads that the SplitterPanel is as small as it can be, so it stops shrinking.
Discussed in https://github.com/orgs/primefaces/discussions/1520