[material-nextjs][system] Backport CSS layers to v6
Docs
- docs/data/material/customization/css-layers/css-layers.md
- docs/data/material/integrations/nextjs/nextjs.md
Next.js Pages
- demo: https://mui5-nextjs-pages.vercel.app/
- repo: https://github.com/siriwatknp/mui5-nextjs-pages/tree/v6
Next.js App Router
- demo: https://mui5-nextjs-pages-git-v6-siriwatknps-projects.vercel.app/
- repo: https://github.com/siriwatknp/mui5-nextjs-app/tree/v6
Vite
- demo: https://mui5-vite-git-v6-siriwatknps-projects.vercel.app/
- repo: https://github.com/siriwatknp/mui5-vite/tree/v6
This PR cherry pick 2 commits:
-
#45596: enable CSS layers for pages router
-
#46001: modular CSS Layers
-
[x] I have followed (at least) the PR section of the contributing guide.
Netlify deploy preview
- docs/data/material/customization/css-layers/css-layers.md
- docs/data/material/integrations/nextjs/nextjs.md
@mui/joy/GlobalStyles: parsed: +14.94% , gzip: +20.34% @mui/joy/CssBaseline: parsed: +14.70% , gzip: +19.96% GlobalStyles: parsed: +13.08% , gzip: +17.27% CssBaseline: parsed: +12.53% , gzip: +16.53% @material-ui/core: parsed: +0.33% , gzip: +0.35% @material-ui/system: parsed: +2.11% , gzip: +1.77% @mui/joy: parsed: +0.33% , gzip: +0.21% TextField: parsed: +0.61% , gzip: +0.64% OutlinedInput: parsed: +0.99% , gzip: +0.97% NativeSelect: parsed: +0.98% , gzip: +0.94% FilledInput: parsed: +0.95% , gzip: +0.99% InputBase: parsed: +1.01% , gzip: +0.99% ScopedCssBaseline: parsed: +1.11% , gzip: +1.08% Radio: parsed: +0.77% , gzip: +0.62% Breadcrumbs: parsed: +0.67% , gzip: +0.66% Checkbox: parsed: +0.68% , gzip: +0.59% SwipeableDrawer: parsed: +0.59% , gzip: +0.57% CardHeader: parsed: +0.79% , gzip: +0.85% ListItemText: parsed: +0.79% , gzip: +0.85% Grid2: parsed: +0.81% , gzip: +0.83% and 181 more changes
Bundle size report
Details of bundle changes (Toolpad) Details of bundle changes
Generated by :no_entry_sign: dangerJS against f9c0b6518202d730053f888128c3587c5c9a39eb
Added @sai6855 as a reviewer, in case you see anything missing/wrong.
Overall looks good @siriwatknp!
May I ask you to point me to what's different between this implementation and v7's?
There is no difference from implementation and API perspective. However, the code might not be exactly the same as v7 but that's because v6 - v7 has other changes in between (from other PRs).