glittershark / reactable

Fast, flexible, and simple data tables in React
glittershark.github.io/reactable
MIT License
1.51k stars 222 forks source link

inclusion of filter header removes ability to size table columns #375

Open andrewlorenz opened 7 years ago

andrewlorenz commented 7 years ago

the addition of the filter block tr class=reactable-filterer within the thead block (and before the actual row headers as provided to the component) is overriding any css/inline styling of the column widths. Also, the html standard colgroup settings before the thead cannot be used because they are rejected, with the message "The only possible children of Table are Thead, Tr, or one Tfoot". This causes a secondary issue with column sorting - as the columns default to dynamic widths according to the data they contain, when changing the sort order the table columns can resize - meaning both the headings and the column data can 'jump' left and right. Whereas as soon as the filter tr is removed, the table column widths observe their sizing via styling correctly, and sorting does not cause the table to jump.