I have setup a listening event on the page:
const [width, height] = constants.useWindowSize();
window.addEventListener("resize", updateSize);
And setup the column widths to use a percentage of the window size.
width={width * 0.2}
When the window increases in size it works and when I decrease it back to the point of the original window size it works. It does not seem to work when I reduce the window below the original width it does not appear to work.
It does appear the header row updates correctly when reducing the size of the window, but the data rows do not. The header looks like it renders as a separate table than the data and the header table is behaving as expected, but the data table is not.