@mui/material-nextjs 6.4.3 → 7.0.0-alpha.1

package/esm/package.json

@@ -0,0 +1 @@
+{"type":"module","sideEffects":false}

package/esm/v13-appRouter/appRouterV13.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { EmotionCache, Options as OptionsOfCreateCache } from '@emotion/cache';
+export type AppRouterCacheProviderProps = {
+  /**
+   * These are the options passed to createCache() from 'import createCache from "@emotion/cache"'.
+   */
+  options?: Partial<OptionsOfCreateCache> & {
+    /**
+     * If `true`, the generated styles are wrapped within `@layer mui`.
+     * This is useful if you want to override the Material UI's generated styles with different styling solution, like Tailwind CSS, plain CSS etc.
+     */
+    enableCssLayer?: boolean;
+  };
+  /**
+   * By default <CacheProvider /> from 'import { CacheProvider } from "@emotion/react"'.
+   */
+  CacheProvider?: React.ElementType<{
+    value: EmotionCache;
+  }>;
+  children: React.ReactNode;
+};
+/**
+ * Emotion works OK without this provider but it's recommended to use this provider to improve performance.
+ * Without it, Emotion will generate a new <style> tag during SSR for every component.
+ * See https://github.com/mui/material-ui/issues/26561#issuecomment-855286153 for why it's a problem.
+ */
+export default function AppRouterCacheProvider(props: AppRouterCacheProviderProps): React.JSX.Element;

package/{node → esm}/v13-appRouter/appRouterV13.js

@@ -1,30 +1,23 @@
-"use strict";
 'use client';
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = AppRouterCacheProvider;
-var React = _interopRequireWildcard(require("react"));
-var _cache = _interopRequireDefault(require("@emotion/cache"));
-var _react2 = require("@emotion/react");
-var _navigation = require("next/navigation");
-var _jsxRuntime = require("react/jsx-runtime");
+import * as React from 'react';
+import createCache from '@emotion/cache';
+import { CacheProvider as DefaultCacheProvider } from '@emotion/react';
+import { useServerInsertedHTML } from 'next/navigation';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * Emotion works OK without this provider but it's recommended to use this provider to improve performance.
  * Without it, Emotion will generate a new <style> tag during SSR for every component.
  * See https://github.com/mui/material-ui/issues/26561#issuecomment-855286153 for why it's a problem.
  */
-function AppRouterCacheProvider(props) {
+export default function AppRouterCacheProvider(props) {
   const {
     options,
-    CacheProvider = _react2.CacheProvider,
+    CacheProvider = DefaultCacheProvider,
     children
   } = props;
   const [registry] = React.useState(() => {
-    const cache = (0, _cache.default)({
+    const cache = createCache({
       ...options,
       key: options?.key ?? 'mui'
     });
@@ -55,7 +48,7 @@ function AppRouterCacheProvider(props) {
       flush
     };
   });
-  (0, _navigation.useServerInsertedHTML)(() => {
+  useServerInsertedHTML(() => {
     const inserted = registry.flush();
     if (inserted.length === 0) {
       return null;
@@ -80,11 +73,11 @@ function AppRouterCacheProvider(props) {
         }
       }
     });
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
+    return /*#__PURE__*/_jsxs(React.Fragment, {
       children: [globals.map(({
         name,
         style
-      }) => /*#__PURE__*/(0, _jsxRuntime.jsx)("style", {
+      }) => /*#__PURE__*/_jsx("style", {
         nonce: options?.nonce,
         "data-emotion": `${registry.cache.key}-global ${name}`
         // eslint-disable-next-line react/no-danger
@@ -92,7 +85,7 @@ function AppRouterCacheProvider(props) {
         dangerouslySetInnerHTML: {
           __html: style
         }
-      }, name)), styles && /*#__PURE__*/(0, _jsxRuntime.jsx)("style", {
+      }, name)), styles && /*#__PURE__*/_jsx("style", {
         nonce: options?.nonce,
         "data-emotion": dataEmotionAttribute
         // eslint-disable-next-line react/no-danger
@@ -103,7 +96,7 @@ function AppRouterCacheProvider(props) {
       })]
     });
   });
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(CacheProvider, {
+  return /*#__PURE__*/_jsx(CacheProvider, {
     value: registry.cache,
     children: children
   });

package/esm/v13-appRouter/index.d.ts

@@ -0,0 +1,2 @@
+export { default as AppRouterCacheProvider } from "./appRouterV13.js";
+export * from "./appRouterV13.js";

package/esm/v13-appRouter/index.js

@@ -0,0 +1,2 @@
+export { default as AppRouterCacheProvider } from "./appRouterV13.js";
+export * from "./appRouterV13.js";

package/esm/v13-pagesRouter/createCache.d.ts

@@ -0,0 +1 @@
+export default function createEmotionCache(): import("@emotion/cache").EmotionCache;

package/{node → esm}/v13-pagesRouter/createCache.js

@@ -1,23 +1,16 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = createEmotionCache;
-var _cache = _interopRequireDefault(require("@emotion/cache"));
+import createCache from '@emotion/cache';
 const isBrowser = typeof document !== 'undefined';
 
 // On the client side, Create a meta tag at the top of the <head> and set it as insertionPoint.
 // This assures that MUI styles are loaded first.
 // It allows developers to easily override MUI styles with other styling solutions, like CSS modules.
-function createEmotionCache() {
+export default function createEmotionCache() {
   let insertionPoint;
   if (isBrowser) {
     const emotionInsertionPoint = document.querySelector('meta[name="emotion-insertion-point"]');
     insertionPoint = emotionInsertionPoint ?? undefined;
   }
-  return (0, _cache.default)({
+  return createCache({
     key: 'mui',
     insertionPoint
   });

package/esm/v13-pagesRouter/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./pagesRouterV13Document.js";
+export * from "./pagesRouterV13App.js";

package/esm/v13-pagesRouter/index.js

@@ -0,0 +1,2 @@
+export * from "./pagesRouterV13Document.js";
+export * from "./pagesRouterV13App.js";

package/esm/v13-pagesRouter/nextDocument.cjs

@@ -0,0 +1 @@
+module.exports = require('next/document');

package/esm/v13-pagesRouter/nextDocument.d.cts

@@ -0,0 +1,2 @@
+declare const _exports: typeof import("next/document");
+export = _exports;

package/esm/v13-pagesRouter/pagesRouterV13App.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { EmotionCache } from '@emotion/react';
+export interface EmotionCacheProviderProps {
+  emotionCache?: EmotionCache;
+}
+export declare function AppCacheProvider({
+  emotionCache,
+  children
+}: React.PropsWithChildren<EmotionCacheProviderProps>): React.JSX.Element;

package/esm/v13-pagesRouter/pagesRouterV13App.js

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { CacheProvider } from '@emotion/react';
+import createEmotionCache from "./createCache.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const defaultEmotionCache = createEmotionCache();
+export function AppCacheProvider({
+  emotionCache = defaultEmotionCache,
+  children
+}) {
+  return /*#__PURE__*/_jsx(CacheProvider, {
+    value: emotionCache,
+    children: children
+  });
+}

package/esm/v13-pagesRouter/pagesRouterV13Document.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { AppType } from 'next/app';
+import { EmotionCache } from '@emotion/react';
+import type { DocumentContext, DocumentInitialProps } from 'next/document';
+interface Plugin {
+  enhanceApp: (App: React.ComponentType<React.ComponentProps<AppType>>) => (props: any) => React.JSX.Element;
+  resolveProps: (initialProps: DocumentInitialProps) => Promise<DocumentInitialProps>;
+}
+/**
+ * A utility to compose multiple `getInitialProps` functions.
+ */
+export declare function createGetInitialProps(plugins: Plugin[]): (ctx: DocumentContext) => Promise<DocumentInitialProps>;
+export interface DocumentHeadTagsProps {
+  emotionStyleTags: React.ReactElement<unknown>[];
+}
+export declare function DocumentHeadTags(props: DocumentHeadTagsProps): React.JSX.Element;
+export declare function documentGetInitialProps(ctx: DocumentContext, options?: {
+  emotionCache?: EmotionCache;
+  plugins?: Plugin[];
+}): Promise<import("next/dist/shared/lib/utils").RenderPageResult & {
+  styles?: React.ReactElement[] | Iterable<React.ReactNode> | React.JSX.Element;
+} & DocumentHeadTagsProps>;
+export {};

package/{node → esm}/v13-pagesRouter/pagesRouterV13Document.js

@@ -1,36 +1,27 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.DocumentHeadTags = DocumentHeadTags;
-exports.createGetInitialProps = createGetInitialProps;
-exports.documentGetInitialProps = documentGetInitialProps;
-var React = _interopRequireWildcard(require("react"));
-var _createInstance = _interopRequireDefault(require("@emotion/server/create-instance"));
-var _document = _interopRequireDefault(require("next/document"));
-var _createCache = _interopRequireDefault(require("./createCache"));
-var _jsxRuntime = require("react/jsx-runtime");
 var _meta;
+import * as React from 'react';
+import createEmotionServer from '@emotion/server/create-instance';
+import nextDocument from "./nextDocument.cjs";
+import createEmotionCache from "./createCache.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const Document = nextDocument.default || nextDocument;
 /**
  * A utility to compose multiple `getInitialProps` functions.
  */
-function createGetInitialProps(plugins) {
+export function createGetInitialProps(plugins) {
   return async function getInitialProps(ctx) {
     const originalRenderPage = ctx.renderPage;
     ctx.renderPage = () => originalRenderPage({
       enhanceApp: App => plugins.reduce((result, plugin) => plugin.enhanceApp(result), App)
     });
-    const initialProps = await _document.default.getInitialProps(ctx);
+    const initialProps = await Document.getInitialProps(ctx);
     const finalProps = await plugins.reduce(async (result, plugin) => plugin.resolveProps(await result), Promise.resolve(initialProps));
     return finalProps;
   };
 }
-function DocumentHeadTags(props) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
-    children: [_meta || (_meta = /*#__PURE__*/(0, _jsxRuntime.jsx)("meta", {
+export function DocumentHeadTags(props) {
+  return /*#__PURE__*/_jsxs(React.Fragment, {
+    children: [_meta || (_meta = /*#__PURE__*/_jsx("meta", {
       name: "emotion-insertion-point",
       content: ""
     })), props.emotionStyleTags]
@@ -39,7 +30,7 @@ function DocumentHeadTags(props) {
 
 // `getInitialProps` belongs to `_document` (instead of `_app`),
 // it's compatible with static-site generation (SSG).
-async function documentGetInitialProps(ctx, options) {
+export async function documentGetInitialProps(ctx, options) {
   // Resolution order
   //
   // On the server:
@@ -64,15 +55,15 @@ async function documentGetInitialProps(ctx, options) {
 
   // You can consider sharing the same Emotion cache between all the SSR requests to speed up performance.
   // However, be aware that it can have global side effects.
-  const cache = options?.emotionCache ?? (0, _createCache.default)();
+  const cache = options?.emotionCache ?? createEmotionCache();
   // The createEmotionServer has to be called directly after the cache creation due to the side effect of cache.compat = true,
   // otherwise the <style> tag will not come with the HTML string from the server.
   const {
     extractCriticalToChunks
-  } = (0, _createInstance.default)(cache);
+  } = createEmotionServer(cache);
   return createGetInitialProps([{
     enhanceApp: App => function EnhanceApp(props) {
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(App, {
+      return /*#__PURE__*/_jsx(App, {
         emotionCache: cache,
         ...props
       });
@@ -83,7 +74,7 @@ async function documentGetInitialProps(ctx, options) {
       } = extractCriticalToChunks(initialProps.html);
       return {
         ...initialProps,
-        emotionStyleTags: styles.map(style => /*#__PURE__*/(0, _jsxRuntime.jsx)("style", {
+        emotionStyleTags: styles.map(style => /*#__PURE__*/_jsx("style", {
           "data-emotion": `${style.key} ${style.ids.join(' ')}`,
           // eslint-disable-next-line react/no-danger
           dangerouslySetInnerHTML: {

package/esm/v14-appRouter/index.d.ts

@@ -0,0 +1 @@
+export * from "../v13-appRouter/index.js";

package/esm/v14-appRouter/index.js

@@ -0,0 +1 @@
+export * from "../v13-appRouter/index.js";

package/esm/v14-pagesRouter/index.d.ts

@@ -0,0 +1 @@
+export * from "../v13-pagesRouter/index.js";

package/esm/v14-pagesRouter/index.js

@@ -0,0 +1 @@
+export * from "../v13-pagesRouter/index.js";

package/esm/v15-appRouter/index.d.ts

@@ -0,0 +1 @@
+export * from "../v13-appRouter/index.js";

package/esm/v15-appRouter/index.js

@@ -0,0 +1 @@
+export * from "../v13-appRouter/index.js";

package/esm/v15-pagesRouter/index.d.ts

@@ -0,0 +1 @@
+export * from "../v13-pagesRouter/index.js";

package/esm/v15-pagesRouter/index.js

@@ -0,0 +1 @@
+export * from "../v13-pagesRouter/index.js";

package/modern/package.json

@@ -0,0 +1 @@
+{"type":"module","sideEffects":false}

package/modern/v13-appRouter/appRouterV13.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { EmotionCache, Options as OptionsOfCreateCache } from '@emotion/cache';
+export type AppRouterCacheProviderProps = {
+  /**
+   * These are the options passed to createCache() from 'import createCache from "@emotion/cache"'.
+   */
+  options?: Partial<OptionsOfCreateCache> & {
+    /**
+     * If `true`, the generated styles are wrapped within `@layer mui`.
+     * This is useful if you want to override the Material UI's generated styles with different styling solution, like Tailwind CSS, plain CSS etc.
+     */
+    enableCssLayer?: boolean;
+  };
+  /**
+   * By default <CacheProvider /> from 'import { CacheProvider } from "@emotion/react"'.
+   */
+  CacheProvider?: React.ElementType<{
+    value: EmotionCache;
+  }>;
+  children: React.ReactNode;
+};
+/**
+ * Emotion works OK without this provider but it's recommended to use this provider to improve performance.
+ * Without it, Emotion will generate a new <style> tag during SSR for every component.
+ * See https://github.com/mui/material-ui/issues/26561#issuecomment-855286153 for why it's a problem.
+ */
+export default function AppRouterCacheProvider(props: AppRouterCacheProviderProps): React.JSX.Element;

package/modern/v13-appRouter/index.d.ts

@@ -0,0 +1,2 @@
+export { default as AppRouterCacheProvider } from "./appRouterV13.js";
+export * from "./appRouterV13.js";

package/modern/v13-pagesRouter/createCache.d.ts

@@ -0,0 +1 @@
+export default function createEmotionCache(): import("@emotion/cache").EmotionCache;

package/modern/v13-pagesRouter/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./pagesRouterV13Document.js";
+export * from "./pagesRouterV13App.js";

package/modern/v13-pagesRouter/nextDocument.cjs

@@ -0,0 +1 @@
+module.exports = require('next/document');

package/modern/v13-pagesRouter/pagesRouterV13App.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { EmotionCache } from '@emotion/react';
+export interface EmotionCacheProviderProps {
+  emotionCache?: EmotionCache;
+}
+export declare function AppCacheProvider({
+  emotionCache,
+  children
+}: React.PropsWithChildren<EmotionCacheProviderProps>): React.JSX.Element;

package/modern/v13-pagesRouter/pagesRouterV13Document.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { AppType } from 'next/app';
+import { EmotionCache } from '@emotion/react';
+import type { DocumentContext, DocumentInitialProps } from 'next/document';
+interface Plugin {
+  enhanceApp: (App: React.ComponentType<React.ComponentProps<AppType>>) => (props: any) => React.JSX.Element;
+  resolveProps: (initialProps: DocumentInitialProps) => Promise<DocumentInitialProps>;
+}
+/**
+ * A utility to compose multiple `getInitialProps` functions.
+ */
+export declare function createGetInitialProps(plugins: Plugin[]): (ctx: DocumentContext) => Promise<DocumentInitialProps>;
+export interface DocumentHeadTagsProps {
+  emotionStyleTags: React.ReactElement<unknown>[];
+}
+export declare function DocumentHeadTags(props: DocumentHeadTagsProps): React.JSX.Element;
+export declare function documentGetInitialProps(ctx: DocumentContext, options?: {
+  emotionCache?: EmotionCache;
+  plugins?: Plugin[];
+}): Promise<import("next/dist/shared/lib/utils").RenderPageResult & {
+  styles?: React.ReactElement[] | Iterable<React.ReactNode> | React.JSX.Element;
+} & DocumentHeadTagsProps>;
+export {};

package/modern/v13-pagesRouter/pagesRouterV13Document.js

@@ -1,9 +1,10 @@
 var _meta;
 import * as React from 'react';
 import createEmotionServer from '@emotion/server/create-instance';
-import Document from 'next/document';
+import nextDocument from "./nextDocument.cjs";
 import createEmotionCache from "./createCache.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const Document = nextDocument.default || nextDocument;
 /**
  * A utility to compose multiple `getInitialProps` functions.
  */

package/modern/v14-appRouter/index.d.ts

@@ -0,0 +1 @@
+export * from "../v13-appRouter/index.js";

package/modern/v14-pagesRouter/index.d.ts

@@ -0,0 +1 @@
+export * from "../v13-pagesRouter/index.js";

package/modern/v15-appRouter/index.d.ts

@@ -0,0 +1 @@
+export * from "../v13-appRouter/index.js";

package/modern/v15-pagesRouter/index.d.ts

@@ -0,0 +1 @@
+export * from "../v13-pagesRouter/index.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/material-nextjs",
-  "version": "6.4.3",
+  "version": "7.0.0-alpha.1",
   "private": false,
   "author": "MUI Team",
   "description": "Collection of utilities for integration between Material UI and Next.js.",
@@ -24,7 +24,7 @@
     "url": "https://opencollective.com/mui-org"
   },
   "dependencies": {
-    "@babel/runtime": "^7.26.0"
+    "@babel/runtime": "^7.26.7"
   },
   "peerDependencies": {
     "@emotion/cache": "^11.11.0",
@@ -52,5 +52,35 @@
   },
   "engines": {
     "node": ">=14.0.0"
+  },
+  "exports": {
+    "./*": {
+      "require": {
+        "types": "./*/index.d.ts",
+        "default": "./*/index.js"
+      },
+      "import": {
+        "types": "./esm/*/index.d.ts",
+        "default": "./esm/*/index.js"
+      },
+      "mui-modern": {
+        "types": "./modern/*/index.d.ts",
+        "default": "./modern/*/index.js"
+      }
+    },
+    "./v13-pagesRouter": {
+      "require": {
+        "types": "./v13-pagesRouter/index.d.ts",
+        "default": "./v13-pagesRouter/index.js"
+      },
+      "import": {
+        "types": "./esm/v13-pagesRouter/index.d.ts",
+        "default": "./esm/v13-pagesRouter/index.js"
+      },
+      "mui-modern": {
+        "types": "./modern/v13-pagesRouter/index.d.ts",
+        "default": "./modern/v13-pagesRouter/index.js"
+      }
+    }
   }
 }