@mui/material-nextjs 7.0.0 → 7.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (45) hide show
  1. package/CHANGELOG.md +197 -0
  2. package/esm/nextCompatRouter.cjs +1 -0
  3. package/esm/nextCompatRouter.d.cts +2 -0
  4. package/esm/v13-appRouter/appRouterV13.js +10 -2
  5. package/esm/v13-appRouter/nextNavigation.cjs +1 -0
  6. package/esm/v13-appRouter/nextNavigation.d.cts +2 -0
  7. package/esm/v13-pagesRouter/createCache.d.ts +4 -1
  8. package/esm/v13-pagesRouter/createCache.js +19 -3
  9. package/esm/v13-pagesRouter/index.d.ts +2 -1
  10. package/esm/v13-pagesRouter/index.js +2 -1
  11. package/esm/v13-pagesRouter/pagesRouterV13App.js +8 -0
  12. package/esm/v13-pagesRouter/pagesRouterV13Document.js +15 -6
  13. package/nextCompatRouter.cjs +1 -0
  14. package/package.json +4 -12
  15. package/v13-appRouter/appRouterV13.js +11 -3
  16. package/v13-appRouter/nextNavigation.cjs +1 -0
  17. package/v13-pagesRouter/createCache.d.ts +4 -1
  18. package/v13-pagesRouter/createCache.js +19 -3
  19. package/v13-pagesRouter/index.d.ts +2 -1
  20. package/v13-pagesRouter/index.js +14 -1
  21. package/v13-pagesRouter/pagesRouterV13App.js +8 -0
  22. package/v13-pagesRouter/pagesRouterV13Document.js +15 -6
  23. package/modern/package.json +0 -1
  24. package/modern/v13-appRouter/appRouterV13.d.ts +0 -27
  25. package/modern/v13-appRouter/appRouterV13.js +0 -103
  26. package/modern/v13-appRouter/index.d.ts +0 -2
  27. package/modern/v13-appRouter/index.js +0 -2
  28. package/modern/v13-pagesRouter/createCache.d.ts +0 -1
  29. package/modern/v13-pagesRouter/createCache.js +0 -17
  30. package/modern/v13-pagesRouter/index.d.ts +0 -2
  31. package/modern/v13-pagesRouter/index.js +0 -2
  32. package/modern/v13-pagesRouter/nextDocument.cjs +0 -1
  33. package/modern/v13-pagesRouter/pagesRouterV13App.d.ts +0 -9
  34. package/modern/v13-pagesRouter/pagesRouterV13App.js +0 -14
  35. package/modern/v13-pagesRouter/pagesRouterV13Document.d.ts +0 -23
  36. package/modern/v13-pagesRouter/pagesRouterV13Document.js +0 -87
  37. package/modern/v14-appRouter/index.d.ts +0 -1
  38. package/modern/v14-appRouter/index.js +0 -1
  39. package/modern/v14-pagesRouter/index.d.ts +0 -1
  40. package/modern/v14-pagesRouter/index.js +0 -1
  41. package/modern/v15-appRouter/index.d.ts +0 -1
  42. package/modern/v15-appRouter/index.js +0 -1
  43. package/modern/v15-pagesRouter/index.d.ts +0 -1
  44. package/modern/v15-pagesRouter/index.js +0 -1
  45. package/tsconfig.build.tsbuildinfo +0 -1
package/modern/v13-appRouter/appRouterV13.js DELETED
@@ -1,103 +0,0 @@
1
- 'use client';
2
-
3
- import * as React from 'react';
4
- import createCache from '@emotion/cache';
5
- import { CacheProvider as DefaultCacheProvider } from '@emotion/react';
6
- import { useServerInsertedHTML } from 'next/navigation';
7
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
8
- /**
9
- * Emotion works OK without this provider but it's recommended to use this provider to improve performance.
10
- * Without it, Emotion will generate a new <style> tag during SSR for every component.
11
- * See https://github.com/mui/material-ui/issues/26561#issuecomment-855286153 for why it's a problem.
12
- */
13
- export default function AppRouterCacheProvider(props) {
14
- const {
15
- options,
16
- CacheProvider = DefaultCacheProvider,
17
- children
18
- } = props;
19
- const [registry] = React.useState(() => {
20
- const cache = createCache({
21
- ...options,
22
- key: options?.key ?? 'mui'
23
- });
24
- cache.compat = true;
25
- const prevInsert = cache.insert;
26
- let inserted = [];
27
- // Override the insert method to support streaming SSR with flush().
28
- cache.insert = (...args) => {
29
- if (options?.enableCssLayer) {
30
- args[1].styles = `@layer mui {${args[1].styles}}`;
31
- }
32
- const [selector, serialized] = args;
33
- if (cache.inserted[serialized.name] === undefined) {
34
- inserted.push({
35
- name: serialized.name,
36
- isGlobal: !selector
37
- });
38
- }
39
- return prevInsert(...args);
40
- };
41
- const flush = () => {
42
- const prevInserted = inserted;
43
- inserted = [];
44
- return prevInserted;
45
- };
46
- return {
47
- cache,
48
- flush
49
- };
50
- });
51
- useServerInsertedHTML(() => {
52
- const inserted = registry.flush();
53
- if (inserted.length === 0) {
54
- return null;
55
- }
56
- let styles = '';
57
- let dataEmotionAttribute = registry.cache.key;
58
- const globals = [];
59
- inserted.forEach(({
60
- name,
61
- isGlobal
62
- }) => {
63
- const style = registry.cache.inserted[name];
64
- if (typeof style === 'string') {
65
- if (isGlobal) {
66
- globals.push({
67
- name,
68
- style
69
- });
70
- } else {
71
- styles += style;
72
- dataEmotionAttribute += ` ${name}`;
73
- }
74
- }
75
- });
76
- return /*#__PURE__*/_jsxs(React.Fragment, {
77
- children: [globals.map(({
78
- name,
79
- style
80
- }) => /*#__PURE__*/_jsx("style", {
81
- nonce: options?.nonce,
82
- "data-emotion": `${registry.cache.key}-global ${name}`
83
- // eslint-disable-next-line react/no-danger
84
- ,
85
- dangerouslySetInnerHTML: {
86
- __html: style
87
- }
88
- }, name)), styles && /*#__PURE__*/_jsx("style", {
89
- nonce: options?.nonce,
90
- "data-emotion": dataEmotionAttribute
91
- // eslint-disable-next-line react/no-danger
92
- ,
93
- dangerouslySetInnerHTML: {
94
- __html: styles
95
- }
96
- })]
97
- });
98
- });
99
- return /*#__PURE__*/_jsx(CacheProvider, {
100
- value: registry.cache,
101
- children: children
102
- });
103
- }
package/modern/v13-appRouter/index.d.ts DELETED
@@ -1,2 +0,0 @@
1
- export { default as AppRouterCacheProvider } from "./appRouterV13.js";
2
- export * from "./appRouterV13.js";
package/modern/v13-appRouter/index.js DELETED
@@ -1,2 +0,0 @@
1
- export { default as AppRouterCacheProvider } from "./appRouterV13.js";
2
- export * from "./appRouterV13.js";
package/modern/v13-pagesRouter/createCache.d.ts DELETED
@@ -1 +0,0 @@
1
- export default function createEmotionCache(): import("@emotion/cache").EmotionCache;
package/modern/v13-pagesRouter/createCache.js DELETED
@@ -1,17 +0,0 @@
1
- import createCache from '@emotion/cache';
2
- const isBrowser = typeof document !== 'undefined';
3
-
4
- // On the client side, Create a meta tag at the top of the <head> and set it as insertionPoint.
5
- // This assures that MUI styles are loaded first.
6
- // It allows developers to easily override MUI styles with other styling solutions, like CSS modules.
7
- export default function createEmotionCache() {
8
- let insertionPoint;
9
- if (isBrowser) {
10
- const emotionInsertionPoint = document.querySelector('meta[name="emotion-insertion-point"]');
11
- insertionPoint = emotionInsertionPoint ?? undefined;
12
- }
13
- return createCache({
14
- key: 'mui',
15
- insertionPoint
16
- });
17
- }
package/modern/v13-pagesRouter/index.d.ts DELETED
@@ -1,2 +0,0 @@
1
- export * from "./pagesRouterV13Document.js";
2
- export * from "./pagesRouterV13App.js";
package/modern/v13-pagesRouter/index.js DELETED
@@ -1,2 +0,0 @@
1
- export * from "./pagesRouterV13Document.js";
2
- export * from "./pagesRouterV13App.js";
package/modern/v13-pagesRouter/nextDocument.cjs DELETED
@@ -1 +0,0 @@
1
- module.exports = require('next/document');
package/modern/v13-pagesRouter/pagesRouterV13App.d.ts DELETED
@@ -1,9 +0,0 @@
1
- import * as React from 'react';
2
- import { EmotionCache } from '@emotion/react';
3
- export interface EmotionCacheProviderProps {
4
- emotionCache?: EmotionCache;
5
- }
6
- export declare function AppCacheProvider({
7
- emotionCache,
8
- children
9
- }: React.PropsWithChildren<EmotionCacheProviderProps>): React.JSX.Element;
package/modern/v13-pagesRouter/pagesRouterV13App.js DELETED
@@ -1,14 +0,0 @@
1
- import * as React from 'react';
2
- import { CacheProvider } from '@emotion/react';
3
- import createEmotionCache from "./createCache.js";
4
- import { jsx as _jsx } from "react/jsx-runtime";
5
- const defaultEmotionCache = createEmotionCache();
6
- export function AppCacheProvider({
7
- emotionCache = defaultEmotionCache,
8
- children
9
- }) {
10
- return /*#__PURE__*/_jsx(CacheProvider, {
11
- value: emotionCache,
12
- children: children
13
- });
14
- }
package/modern/v13-pagesRouter/pagesRouterV13Document.d.ts DELETED
@@ -1,23 +0,0 @@
1
- import * as React from 'react';
2
- import { AppType } from 'next/app';
3
- import { EmotionCache } from '@emotion/react';
4
- import type { DocumentContext, DocumentInitialProps } from 'next/document';
5
- interface Plugin {
6
- enhanceApp: (App: React.ComponentType<React.ComponentProps<AppType>>) => (props: any) => React.JSX.Element;
7
- resolveProps: (initialProps: DocumentInitialProps) => Promise<DocumentInitialProps>;
8
- }
9
- /**
10
- * A utility to compose multiple `getInitialProps` functions.
11
- */
12
- export declare function createGetInitialProps(plugins: Plugin[]): (ctx: DocumentContext) => Promise<DocumentInitialProps>;
13
- export interface DocumentHeadTagsProps {
14
- emotionStyleTags: React.ReactElement<unknown>[];
15
- }
16
- export declare function DocumentHeadTags(props: DocumentHeadTagsProps): React.JSX.Element;
17
- export declare function documentGetInitialProps(ctx: DocumentContext, options?: {
18
- emotionCache?: EmotionCache;
19
- plugins?: Plugin[];
20
- }): Promise<import("next/dist/shared/lib/utils").RenderPageResult & {
21
- styles?: React.ReactElement[] | Iterable<React.ReactNode> | React.JSX.Element;
22
- } & DocumentHeadTagsProps>;
23
- export {};
package/modern/v13-pagesRouter/pagesRouterV13Document.js DELETED
@@ -1,87 +0,0 @@
1
- var _meta;
2
- import * as React from 'react';
3
- import createEmotionServer from '@emotion/server/create-instance';
4
- import nextDocument from "./nextDocument.cjs";
5
- import createEmotionCache from "./createCache.js";
6
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
7
- const Document = nextDocument.default || nextDocument;
8
- /**
9
- * A utility to compose multiple `getInitialProps` functions.
10
- */
11
- export function createGetInitialProps(plugins) {
12
- return async function getInitialProps(ctx) {
13
- const originalRenderPage = ctx.renderPage;
14
- ctx.renderPage = () => originalRenderPage({
15
- enhanceApp: App => plugins.reduce((result, plugin) => plugin.enhanceApp(result), App)
16
- });
17
- const initialProps = await Document.getInitialProps(ctx);
18
- const finalProps = await plugins.reduce(async (result, plugin) => plugin.resolveProps(await result), Promise.resolve(initialProps));
19
- return finalProps;
20
- };
21
- }
22
- export function DocumentHeadTags(props) {
23
- return /*#__PURE__*/_jsxs(React.Fragment, {
24
- children: [_meta || (_meta = /*#__PURE__*/_jsx("meta", {
25
- name: "emotion-insertion-point",
26
- content: ""
27
- })), props.emotionStyleTags]
28
- });
29
- }
30
-
31
- // `getInitialProps` belongs to `_document` (instead of `_app`),
32
- // it's compatible with static-site generation (SSG).
33
- export async function documentGetInitialProps(ctx, options) {
34
- // Resolution order
35
- //
36
- // On the server:
37
- // 1. app.getInitialProps
38
- // 2. page.getInitialProps
39
- // 3. document.getInitialProps
40
- // 4. app.render
41
- // 5. page.render
42
- // 6. document.render
43
- //
44
- // On the server with error:
45
- // 1. document.getInitialProps
46
- // 2. app.render
47
- // 3. page.render
48
- // 4. document.render
49
- //
50
- // On the client
51
- // 1. app.getInitialProps
52
- // 2. page.getInitialProps
53
- // 3. app.render
54
- // 4. page.render
55
-
56
- // You can consider sharing the same Emotion cache between all the SSR requests to speed up performance.
57
- // However, be aware that it can have global side effects.
58
- const cache = options?.emotionCache ?? createEmotionCache();
59
- // The createEmotionServer has to be called directly after the cache creation due to the side effect of cache.compat = true,
60
- // otherwise the <style> tag will not come with the HTML string from the server.
61
- const {
62
- extractCriticalToChunks
63
- } = createEmotionServer(cache);
64
- return createGetInitialProps([{
65
- enhanceApp: App => function EnhanceApp(props) {
66
- return /*#__PURE__*/_jsx(App, {
67
- emotionCache: cache,
68
- ...props
69
- });
70
- },
71
- resolveProps: async initialProps => {
72
- const {
73
- styles
74
- } = extractCriticalToChunks(initialProps.html);
75
- return {
76
- ...initialProps,
77
- emotionStyleTags: styles.map(style => /*#__PURE__*/_jsx("style", {
78
- "data-emotion": `${style.key} ${style.ids.join(' ')}`,
79
- // eslint-disable-next-line react/no-danger
80
- dangerouslySetInnerHTML: {
81
- __html: style.css
82
- }
83
- }, style.key))
84
- };
85
- }
86
- }, ...(options?.plugins ?? [])])(ctx);
87
- }
package/modern/v14-appRouter/index.d.ts DELETED
@@ -1 +0,0 @@
1
- export * from "../v13-appRouter/index.js";
package/modern/v14-appRouter/index.js DELETED
@@ -1 +0,0 @@
1
- export * from "../v13-appRouter/index.js";
package/modern/v14-pagesRouter/index.d.ts DELETED
@@ -1 +0,0 @@
1
- export * from "../v13-pagesRouter/index.js";
package/modern/v14-pagesRouter/index.js DELETED
@@ -1 +0,0 @@
1
- export * from "../v13-pagesRouter/index.js";
package/modern/v15-appRouter/index.d.ts DELETED
@@ -1 +0,0 @@
1
- export * from "../v13-appRouter/index.js";
package/modern/v15-appRouter/index.js DELETED
@@ -1 +0,0 @@
1
- export * from "../v13-appRouter/index.js";
package/modern/v15-pagesRouter/index.d.ts DELETED
@@ -1 +0,0 @@
1
- export * from "../v13-pagesRouter/index.js";
package/modern/v15-pagesRouter/index.js DELETED
@@ -1 +0,0 @@
1
- export * from "../v13-pagesRouter/index.js";