[data grid] How to autosize and header filters work well? #13802
Description
The problem in depth
Header filters and autosize don't work well together.
When a column as a short header and short content then header filter is unusable: autosize should consider the presence of header filters.
Please look at first column in the following example:
https://stackblitz.com/edit/react-gx1hi5-rafoe7?file=Demo.js
Is there a way to tell the library to consider header filters? Is this a bug?
Many thanks in advance for your help,
Mauro
Your environment
`npx @mui/envinfo`
I'm using Google Chrome 126.0.6478.127
System:
OS: macOS 14.5
Binaries:
Node: 22.4.1 - /usr/local/bin/node
npm: 10.8.1 - /usr/local/bin/npm
pnpm: Not Found
Browsers:
Chrome: 126.0.6478.127
Edge: Not Found
Safari: 17.5
npmPackages:
@emotion/react: ^11.11.4 => 11.11.4
@emotion/styled: ^11.11.5 => 11.11.5
@mui/base: 5.0.0-beta.45
@mui/core-downloads-tracker: 5.16.0
@mui/icons-material: 5.16.0 => 5.16.0
@mui/lab: ^5.0.0-alpha.171 => 5.0.0-alpha.171
@mui/material: ^5.16.0 => 5.16.0
@mui/private-theming: 5.16.0
@mui/styled-engine: 5.15.14
@mui/system: ^5.16.0 => 5.16.0
@mui/types: 7.2.14
@mui/utils: 5.16.0
@mui/x-data-grid: 7.9.0
@mui/x-data-grid-premium: ^7.9.0 => 7.9.0
@mui/x-data-grid-pro: 7.9.0
@mui/x-date-pickers: 7.9.0
@mui/x-date-pickers-pro: ^7.9.0 => 7.9.0
@mui/x-internals: 7.9.0
@mui/x-license: ^7.9.0 => 7.9.0
@mui/x-tree-view: ^7.9.0 => 7.9.0
@types/react: 18.0.14
react: ^18.3.1 => 18.3.1
react-dom: ^18.3.1 => 18.3.1
typescript: 5.1.6
Search keywords: datagrid autosize header filters
Order ID: 47709