Comcast / Comcast/react-data-grid
Flex Column widths break if text does not fit the cell
- Dominant language
- TypeScript
- Stars
- 7.7k
- Forks
- 2.2k
- Avg merge
- 1d 2h
- Merged PRs (30d)
- 33
Description
## Describe the bug
When using fr or percent column widths and there is truncated text in cells, if grid resizes (zoom or window resize), width of columns expands to fit full cell content
## To Reproduce
1. Go to "Columns Reordering" on example website (all column widths except ID are set to 1fr)
2. Inspect element -> Add text to any cell not in ID column so it does not fit and gets truncated with ellipsis
3. Resize window or resize any other cell
4. Column that has modified cell expands to fit the text
## Expected behavior
1. Columns (except ID) stay equal size and text stays truncated with ellipsis
## Link to Minimal Reproducible Example
[ColumnsReordering.tsx](https://github.com/Comcast/react-data-grid/blob/main/website/routes/ColumnsReordering.tsx)
## Environment
- `react-data-grid` version: 7.0.0-beta.58
- `react`/`react-dom` version: 19.1.1
## Additional context
Setting overflow on .rdg-cell to "hidden" instead of "clip" seems to fix the issue, but not sure if it will break other existing features
Contributor guide
Assessment
This issue has not been assessed yet.