Repository: material-ui
Issue: [core] Hydration error using nextjs turbopack and icons-material
Labels: bug 🐛,package: icons,nextjs

### Steps to reproduce

Link to live example: https://codesandbox.io/p/devbox/elegant-alex-xrjs5l

Steps:
1. Check out the example from https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-pages-router-ts
2. Add an icon from @mui/icons-material to index.ts
3. Start with turbopack with `next dev --turbo`
4. See error in the console 
![image](https://github.com/user-attachments/assets/e0d63720-0f85-460a-b488-5f1c33487d66)

Related to https://github.com/mui/material-ui/issues/34905

### Current behavior

Hydration Error:
```
Warning: Prop `className` did not match. Server: "MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root" Client: "MuiSvgIcon-root MuiSvgIcon-fontSizeMedium mui-4uxqju-MuiSvgIcon-root"
```

<details>

```
index.js:8 Warning: Prop `className` did not match. Server: "MuiSvgIcon-root MuiSvgIcon-fontSizeMedium  css-20bmp1-MuiSvgIcon-root" Client: "MuiSvgIcon-root MuiSvgIcon-fontSizeMedium  mui-1slccg-MuiSvgIcon-root"
    at svg
    at https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:1020:141
    at SvgIcon (https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:6461:180)
    at RefreshIcon
    at div
    at https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:1020:141
    at Box (https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:12397:162)
    at div
    at https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:1020:141
    at Container (https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:10685:23)
    at Home
    at DefaultPropsProvider (https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:11525:11)
    at RtlProvider (https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:10829:11)
    at ThemeProvider (https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:15567:13)
    at ThemeProvider (https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:11631:13)
    at CssVarsProvider (https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:11729:17)
    at ThemeProvider (https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:4262:11)
    at AppCacheProvider (https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:13350:11)
    at MyApp (https://xrjs5l-3000.csb.app/_next/static/chunks/pages__app_tsx_035eb2._.js:22:13)
    at PathnameContextProviderAdapter (https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:25194:11)
    at ErrorBoundary (https://xrjs5l-3000.csb.app/_next/static/chunks/%5Bnext%5D_overlay_client_ts_eac06c._.js:6040:1)
    at ReactDevOverlay (https://xrjs5l-3000.csb.app/_next/static/chunks/%5Bnext%5D_overlay_client_ts_eac06c._.js:6266:11)
    at Container (https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:26292:1)
    at AppContainer (https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:26375:11)
    at Root (https://xrjs5l-3000.csb.app/_next/static/chunks/node_modules_975935._.js:26524:11)
```

</details>

### Expected behavior

No hydration error.

### Context

Trying to run NextJS with MUI and turbopack.

### Your environment

See codesandbox

**Search keywords**: nextjs hydration error mui icons turbopack