From 2359c0badfb5a8d746ccc83c1d082c4ad70a542b Mon Sep 17 00:00:00 2001 From: Nick Muller <3781551+nphmuller@users.noreply.github.com> Date: Fri, 25 Oct 2024 06:41:16 +0200 Subject: [PATCH] Support Next 15.0.0 in @mui/material-nextjs (#42428) --- .../material/integrations/nextjs/nextjs.md | 13 ++- packages/mui-material-nextjs/package.json | 2 +- .../src/v15-appRouter/index.ts | 1 + .../src/v15-pagesRouter/index.ts | 1 + pnpm-lock.yaml | 90 +++++++++---------- 5 files changed, 54 insertions(+), 53 deletions(-) create mode 100644 packages/mui-material-nextjs/src/v15-appRouter/index.ts create mode 100644 packages/mui-material-nextjs/src/v15-pagesRouter/index.ts diff --git a/docs/data/material/integrations/nextjs/nextjs.md b/docs/data/material/integrations/nextjs/nextjs.md index 06a37301d9332c..9eb1c64dea7e78 100644 --- a/docs/data/material/integrations/nextjs/nextjs.md +++ b/docs/data/material/integrations/nextjs/nextjs.md @@ -32,7 +32,7 @@ yarn add @mui/material-nextjs @emotion/cache Inside `app/layout.tsx`, import the `AppRouterCacheProvider` and wrap all elements under the `` with it: ```diff title="app/layout.tsx" -+import { AppRouterCacheProvider } from '@mui/material-nextjs/v14-appRouter'; ++import { AppRouterCacheProvider } from '@mui/material-nextjs/v15-appRouter'; // or `v1X-appRouter` if you are using Next.js v1X export default function RootLayout(props) { @@ -88,8 +88,7 @@ export default theme; Finally, in `src/app/layout.tsx`, pass the theme to the `ThemeProvider`: ```diff title="app/layout.tsx" - import { AppRouterCacheProvider } from '@mui/material-nextjs/v14-appRouter'; -+import { Roboto } from 'next/font/google'; + import { AppRouterCacheProvider } from '@mui/material-nextjs/v15-appRouter'; +import { ThemeProvider } from '@mui/material/styles'; +import theme from '../theme'; @@ -179,7 +178,7 @@ Inside the `pages/_document.tsx` file: +import { + DocumentHeadTags, + documentGetInitialProps, -+} from '@mui/material-nextjs/v14-pagesRouter'; ++} from '@mui/material-nextjs/v15-pagesRouter'; // or `v1X-pagesRouter` if you are using Next.js v1X export default function MyDocument(props) { @@ -206,7 +205,7 @@ Inside the `pages/_document.tsx` file: Then, inside `pages/_app.tsx`, import the `AppCacheProvider` component and render it as the root element: ```diff title="pages/_app.tsx" -+import { AppCacheProvider } from '@mui/material-nextjs/v14-pagesRouter'; ++import { AppCacheProvider } from '@mui/material-nextjs/v15-pagesRouter'; // Or `v1X-pages` if you are using Next.js v1X export default function MyApp(props) { @@ -311,7 +310,7 @@ MyDocument.getInitialProps = async (ctx) => { If you are using TypeScript, add `DocumentHeadTagsProps` to the Document's props interface: ```diff -+import type { DocumentHeadTagsProps } from '@mui/material-nextjs/v14-pagesRouter'; ++import type { DocumentHeadTagsProps } from '@mui/material-nextjs/v15-pagesRouter'; // or `v1X-pagesRouter` if you are using Next.js v1X +export default function MyDocument(props: DocumentProps & DocumentHeadTagsProps) { @@ -327,7 +326,7 @@ To integrate [Next.js font optimization](https://nextjs.org/docs/pages/building- import * as React from 'react'; import Head from 'next/head'; import { AppProps } from 'next/app'; - import { AppCacheProvider } from '@mui/material-nextjs/v14-pagesRouter'; + import { AppCacheProvider } from '@mui/material-nextjs/v15-pagesRouter'; +import { ThemeProvider, createTheme } from '@mui/material/styles'; +import { Roboto } from 'next/font/google'; diff --git a/packages/mui-material-nextjs/package.json b/packages/mui-material-nextjs/package.json index 67fedd39b20393..cb021f21ed6955 100644 --- a/packages/mui-material-nextjs/package.json +++ b/packages/mui-material-nextjs/package.json @@ -51,7 +51,7 @@ "@emotion/react": "^11.11.4", "@emotion/server": "^11.11.0", "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", - "next": "^13.0.0 || ^14.0.0", + "next": "^13.0.0 || ^14.0.0 || ^15.0.0", "react": "^17.0.0 || ^18.0.0 || ^19.0.0" }, "peerDependenciesMeta": { diff --git a/packages/mui-material-nextjs/src/v15-appRouter/index.ts b/packages/mui-material-nextjs/src/v15-appRouter/index.ts new file mode 100644 index 00000000000000..fc4bb1deaba8f4 --- /dev/null +++ b/packages/mui-material-nextjs/src/v15-appRouter/index.ts @@ -0,0 +1 @@ +export * from '../v13-appRouter'; diff --git a/packages/mui-material-nextjs/src/v15-pagesRouter/index.ts b/packages/mui-material-nextjs/src/v15-pagesRouter/index.ts new file mode 100644 index 00000000000000..695035caa34c5c --- /dev/null +++ b/packages/mui-material-nextjs/src/v15-pagesRouter/index.ts @@ -0,0 +1 @@ +export * from '../v13-pagesRouter'; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 66d0baad8ce611..2bb50d88e95f58 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -350,7 +350,7 @@ importers: version: link:../../packages/mui-utils/build next: specifier: latest - version: 15.0.0(@babel/core@7.25.8)(@opentelemetry/api@1.8.0)(@playwright/test@1.48.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 15.0.1(@babel/core@7.25.8)(@opentelemetry/api@1.8.0)(@playwright/test@1.48.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) react: specifier: ^18.3.1 version: 18.3.1 @@ -360,7 +360,7 @@ importers: devDependencies: '@pigment-css/nextjs-plugin': specifier: 0.0.24 - version: 0.0.24(@types/react@18.3.11)(next@15.0.0(@babel/core@7.25.8)(@opentelemetry/api@1.8.0)(@playwright/test@1.48.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1) + version: 0.0.24(@types/react@18.3.11)(next@15.0.1(@babel/core@7.25.8)(@opentelemetry/api@1.8.0)(@playwright/test@1.48.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1) '@types/node': specifier: ^20.16.13 version: 20.16.13 @@ -4421,8 +4421,8 @@ packages: '@next/env@14.2.15': resolution: {integrity: sha512-S1qaj25Wru2dUpcIZMjxeMVSwkt8BK4dmWHHiBuRstcIyOsMapqT4A4jSB6onvqeygkSSmOkyny9VVx8JIGamQ==} - '@next/env@15.0.0': - resolution: {integrity: sha512-Mcv8ZVmEgTO3bePiH/eJ7zHqQEs2gCqZ0UId2RxHmDDc7Pw6ngfSrOFlxG8XDpaex+n2G+TKPsQAf28MO+88Gw==} + '@next/env@15.0.1': + resolution: {integrity: sha512-lc4HeDUKO9gxxlM5G2knTRifqhsY6yYpwuHspBZdboZe0Gp+rZHBNNSIjmQKDJIdRXiXGyVnSD6gafrbQPvILQ==} '@next/eslint-plugin-next@14.2.15': resolution: {integrity: sha512-pKU0iqKRBlFB/ocOI1Ip2CkKePZpYpnw5bEItEkuZ/Nr9FQP1+p7VDWr4VfOdff4i9bFmrOaeaU1bFEyAcxiMQ==} @@ -4433,8 +4433,8 @@ packages: cpu: [arm64] os: [darwin] - '@next/swc-darwin-arm64@15.0.0': - resolution: {integrity: sha512-Gjgs3N7cFa40a9QT9AEHnuGKq69/bvIOn0SLGDV+ordq07QOP4k1GDOVedMHEjVeqy1HBLkL8rXnNTuMZIv79A==} + '@next/swc-darwin-arm64@15.0.1': + resolution: {integrity: sha512-C9k/Xv4sxkQRTA37Z6MzNq3Yb1BJMmSqjmwowoWEpbXTkAdfOwnoKOpAb71ItSzoA26yUTIo6ZhN8rKGu4ExQw==} engines: {node: '>= 10'} cpu: [arm64] os: [darwin] @@ -4445,8 +4445,8 @@ packages: cpu: [x64] os: [darwin] - '@next/swc-darwin-x64@15.0.0': - resolution: {integrity: sha512-BUtTvY5u9s5berAuOEydAUlVMjnl6ZjXS+xVrMt317mglYZ2XXjY8YRDCaz9vYMjBNPXH8Gh75Cew5CMdVbWTw==} + '@next/swc-darwin-x64@15.0.1': + resolution: {integrity: sha512-uHl13HXOuq1G7ovWFxCACDJHTSDVbn/sbLv8V1p+7KIvTrYQ5HNoSmKBdYeEKRRCbEmd+OohOgg9YOp8Ux3MBg==} engines: {node: '>= 10'} cpu: [x64] os: [darwin] @@ -4457,8 +4457,8 @@ packages: cpu: [arm64] os: [linux] - '@next/swc-linux-arm64-gnu@15.0.0': - resolution: {integrity: sha512-sbCoEpuWUBpYoLSgYrk0CkBv8RFv4ZlPxbwqRHr/BWDBJppTBtF53EvsntlfzQJ9fosYX12xnS6ltxYYwsMBjg==} + '@next/swc-linux-arm64-gnu@15.0.1': + resolution: {integrity: sha512-LvyhvxHOihFTEIbb35KxOc3q8w8G4xAAAH/AQnsYDEnOvwawjL2eawsB59AX02ki6LJdgDaHoTEnC54Gw+82xw==} engines: {node: '>= 10'} cpu: [arm64] os: [linux] @@ -4469,8 +4469,8 @@ packages: cpu: [arm64] os: [linux] - '@next/swc-linux-arm64-musl@15.0.0': - resolution: {integrity: sha512-JAw84qfL81aQCirXKP4VkgmhiDpXJupGjt8ITUkHrOVlBd+3h5kjfPva5M0tH2F9KKSgJQHEo3F5S5tDH9h2ww==} + '@next/swc-linux-arm64-musl@15.0.1': + resolution: {integrity: sha512-vFmCGUFNyk/A5/BYcQNhAQqPIw01RJaK6dRO+ZEhz0DncoW+hJW1kZ8aH2UvTX27zPq3m85zN5waMSbZEmANcQ==} engines: {node: '>= 10'} cpu: [arm64] os: [linux] @@ -4481,8 +4481,8 @@ packages: cpu: [x64] os: [linux] - '@next/swc-linux-x64-gnu@15.0.0': - resolution: {integrity: sha512-r5Smd03PfxrGKMewdRf2RVNA1CU5l2rRlvZLQYZSv7FUsXD5bKEcOZ/6/98aqRwL7diXOwD8TCWJk1NbhATQHg==} + '@next/swc-linux-x64-gnu@15.0.1': + resolution: {integrity: sha512-5by7IYq0NCF8rouz6Qg9T97jYU68kaClHPfGpQG2lCZpSYHtSPQF1kjnqBTd34RIqPKMbCa4DqCufirgr8HM5w==} engines: {node: '>= 10'} cpu: [x64] os: [linux] @@ -4493,8 +4493,8 @@ packages: cpu: [x64] os: [linux] - '@next/swc-linux-x64-musl@15.0.0': - resolution: {integrity: sha512-fM6qocafz4Xjhh79CuoQNeGPhDHGBBUbdVtgNFJOUM8Ih5ZpaDZlTvqvqsh5IoO06CGomxurEGqGz/4eR/FaMQ==} + '@next/swc-linux-x64-musl@15.0.1': + resolution: {integrity: sha512-lmYr6H3JyDNBJLzklGXLfbehU3ay78a+b6UmBGlHls4xhDXBNZfgb0aI67sflrX+cGBnv1LgmWzFlYrAYxS1Qw==} engines: {node: '>= 10'} cpu: [x64] os: [linux] @@ -4505,8 +4505,8 @@ packages: cpu: [arm64] os: [win32] - '@next/swc-win32-arm64-msvc@15.0.0': - resolution: {integrity: sha512-ZOd7c/Lz1lv7qP/KzR513XEa7QzW5/P0AH3A5eR1+Z/KmDOvMucht0AozccPc0TqhdV1xaXmC0Fdx0hoNzk6ng==} + '@next/swc-win32-arm64-msvc@15.0.1': + resolution: {integrity: sha512-DS8wQtl6diAj0eZTdH0sefykm4iXMbHT4MOvLwqZiIkeezKpkgPFcEdFlz3vKvXa2R/2UEgMh48z1nEpNhjeOQ==} engines: {node: '>= 10'} cpu: [arm64] os: [win32] @@ -4523,8 +4523,8 @@ packages: cpu: [x64] os: [win32] - '@next/swc-win32-x64-msvc@15.0.0': - resolution: {integrity: sha512-2RVWcLtsqg4LtaoJ3j7RoKpnWHgcrz5XvuUGE7vBYU2i6M2XeD9Y8RlLaF770LEIScrrl8MdWsp6odtC6sZccg==} + '@next/swc-win32-x64-msvc@15.0.1': + resolution: {integrity: sha512-4Ho2ggvDdMKlZ/0e9HNdZ9ngeaBwtc+2VS5oCeqrbXqOgutX6I4U2X/42VBw0o+M5evn4/7v3zKgGHo+9v/VjA==} engines: {node: '>= 10'} cpu: [x64] os: [win32] @@ -9906,16 +9906,16 @@ packages: sass: optional: true - next@15.0.0: - resolution: {integrity: sha512-/ivqF6gCShXpKwY9hfrIQYh8YMge8L3W+w1oRLv/POmK4MOQnh+FscZ8a0fRFTSQWE+2z9ctNYvELD9vP2FV+A==} + next@15.0.1: + resolution: {integrity: sha512-PSkFkr/w7UnFWm+EP8y/QpHrJXMqpZzAXpergB/EqLPOh4SGPJXv1wj4mslr2hUZBAS9pX7/9YLIdxTv6fwytw==} engines: {node: '>=18.18.0'} hasBin: true peerDependencies: '@opentelemetry/api': ^1.1.0 '@playwright/test': ^1.41.2 babel-plugin-react-compiler: '*' - react: ^18.2.0 || 19.0.0-rc-65a56d0e-20241020 - react-dom: ^18.2.0 || 19.0.0-rc-65a56d0e-20241020 + react: ^18.2.0 || 19.0.0-rc-69d4b800-20241021 + react-dom: ^18.2.0 || 19.0.0-rc-69d4b800-20241021 sass: ^1.3.0 peerDependenciesMeta: '@opentelemetry/api': @@ -15177,7 +15177,7 @@ snapshots: '@next/env@14.2.15': {} - '@next/env@15.0.0': {} + '@next/env@15.0.1': {} '@next/eslint-plugin-next@14.2.15': dependencies: @@ -15186,43 +15186,43 @@ snapshots: '@next/swc-darwin-arm64@14.2.15': optional: true - '@next/swc-darwin-arm64@15.0.0': + '@next/swc-darwin-arm64@15.0.1': optional: true '@next/swc-darwin-x64@14.2.15': optional: true - '@next/swc-darwin-x64@15.0.0': + '@next/swc-darwin-x64@15.0.1': optional: true '@next/swc-linux-arm64-gnu@14.2.15': optional: true - '@next/swc-linux-arm64-gnu@15.0.0': + '@next/swc-linux-arm64-gnu@15.0.1': optional: true '@next/swc-linux-arm64-musl@14.2.15': optional: true - '@next/swc-linux-arm64-musl@15.0.0': + '@next/swc-linux-arm64-musl@15.0.1': optional: true '@next/swc-linux-x64-gnu@14.2.15': optional: true - '@next/swc-linux-x64-gnu@15.0.0': + '@next/swc-linux-x64-gnu@15.0.1': optional: true '@next/swc-linux-x64-musl@14.2.15': optional: true - '@next/swc-linux-x64-musl@15.0.0': + '@next/swc-linux-x64-musl@15.0.1': optional: true '@next/swc-win32-arm64-msvc@14.2.15': optional: true - '@next/swc-win32-arm64-msvc@15.0.0': + '@next/swc-win32-arm64-msvc@15.0.1': optional: true '@next/swc-win32-ia32-msvc@14.2.15': @@ -15231,7 +15231,7 @@ snapshots: '@next/swc-win32-x64-msvc@14.2.15': optional: true - '@next/swc-win32-x64-msvc@15.0.0': + '@next/swc-win32-x64-msvc@15.0.1': optional: true '@nicolo-ribaudo/chokidar-2@2.1.8-no-fsevents.3': @@ -15666,10 +15666,10 @@ snapshots: '@opentelemetry/api@1.8.0': optional: true - '@pigment-css/nextjs-plugin@0.0.24(@types/react@18.3.11)(next@15.0.0(@babel/core@7.25.8)(@opentelemetry/api@1.8.0)(@playwright/test@1.48.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1)': + '@pigment-css/nextjs-plugin@0.0.24(@types/react@18.3.11)(next@15.0.1(@babel/core@7.25.8)(@opentelemetry/api@1.8.0)(@playwright/test@1.48.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1)': dependencies: '@pigment-css/unplugin': 0.0.24(@types/react@18.3.11)(react@18.3.1) - next: 15.0.0(@babel/core@7.25.8)(@opentelemetry/api@1.8.0)(@playwright/test@1.48.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + next: 15.0.1(@babel/core@7.25.8)(@opentelemetry/api@1.8.0)(@playwright/test@1.48.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) transitivePeerDependencies: - '@types/react' - react @@ -22206,9 +22206,9 @@ snapshots: - '@babel/core' - babel-plugin-macros - next@15.0.0(@babel/core@7.25.8)(@opentelemetry/api@1.8.0)(@playwright/test@1.48.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1): + next@15.0.1(@babel/core@7.25.8)(@opentelemetry/api@1.8.0)(@playwright/test@1.48.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1): dependencies: - '@next/env': 15.0.0 + '@next/env': 15.0.1 '@swc/counter': 0.1.3 '@swc/helpers': 0.5.13 busboy: 1.6.0 @@ -22218,14 +22218,14 @@ snapshots: react-dom: 18.3.1(react@18.3.1) styled-jsx: 5.1.6(@babel/core@7.25.8)(babel-plugin-macros@3.1.0)(react@18.3.1) optionalDependencies: - '@next/swc-darwin-arm64': 15.0.0 - '@next/swc-darwin-x64': 15.0.0 - '@next/swc-linux-arm64-gnu': 15.0.0 - '@next/swc-linux-arm64-musl': 15.0.0 - '@next/swc-linux-x64-gnu': 15.0.0 - '@next/swc-linux-x64-musl': 15.0.0 - '@next/swc-win32-arm64-msvc': 15.0.0 - '@next/swc-win32-x64-msvc': 15.0.0 + '@next/swc-darwin-arm64': 15.0.1 + '@next/swc-darwin-x64': 15.0.1 + '@next/swc-linux-arm64-gnu': 15.0.1 + '@next/swc-linux-arm64-musl': 15.0.1 + '@next/swc-linux-x64-gnu': 15.0.1 + '@next/swc-linux-x64-musl': 15.0.1 + '@next/swc-win32-arm64-msvc': 15.0.1 + '@next/swc-win32-x64-msvc': 15.0.1 '@opentelemetry/api': 1.8.0 '@playwright/test': 1.48.1 sharp: 0.33.5