Responsive bug with MUI component

[ydainna]

Steps to reproduce

Link to live example: (required)

Steps:
1.install MUI and toolpad in vite
2.use exemple vitejs integration
3.add component table in your page for exemple

Current behavior

My MUI components don't resize when I change the window size (desktop, tablet, mobile) when toolpad is installed.

Expected behavior

MUI components must follow breakpoint size

Context

No response

Your environment

npx @mui/envinfo

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

System:
OS: Windows 11 10.0.22631
Binaries:
Node: 20.18.0 - C:\Program Files\nodejs\node.EXE
npm: 10.8.2 - C:\Program Files\nodejs\npm.CMD
pnpm: Not Found
Browsers:
Chrome: Not Found
Edge: Chromium (129.0.2792.89)
npmPackages:
typescript: ^5.6.3 => 5.6.3

Search keywords: MUI responsive bug

[bharatkashyap]

Hi! Can you create a minimal reproduction for us to be able to replicate this? A codesandbox link would work. I can't seem to reproduce

Screen.Recording.2024-11-14.at.10.14.09.AM.mov

[ydainna]

ok i created a stackblitz test with vitejs

https://stackblitz.com/edit/vitejs-vite-mkfvgf?file=src%2Fmain.tsx

[bharatkashyap]

ok i created a stackblitz test with vitejs

https://stackblitz.com/edit/vitejs-vite-mkfvgf?file=src%2Fmain.tsx

If I understand correctly, the issue is about the DataGrid scrolling? We're tracking that here as well #4407 and the fix here #4414

Here's a Stackblitz running with the corrected version https://stackblitz.com/edit/vitejs-vite-vk9u7p

[ydainna]

Oh ok ! thank, I'll wait until this is deployed ....