@mui/material 5.11.15 → 5.12.0

package/node/styles/useThemeProps.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = useThemeProps;
 var _system = require("@mui/system");
 var _defaultTheme = _interopRequireDefault(require("./defaultTheme"));
+var _identifier = _interopRequireDefault(require("./identifier"));
 function useThemeProps({
   props,
   name
@@ -14,6 +15,7 @@ function useThemeProps({
   return (0, _system.useThemeProps)({
     props,
     name,
-    defaultTheme: _defaultTheme.default
+    defaultTheme: _defaultTheme.default,
+    themeId: _identifier.default
   });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/material",
-  "version": "5.11.15",
+  "version": "5.12.0",
   "private": false,
   "author": "MUI Team",
   "description": "React components that implement Google's Material Design.",
@@ -46,14 +46,14 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.21.0",
-    "@mui/base": "5.0.0-alpha.123",
-    "@mui/core-downloads-tracker": "^5.11.15",
-    "@mui/system": "^5.11.15",
-    "@mui/types": "^7.2.3",
-    "@mui/utils": "^5.11.13",
+    "@mui/base": "5.0.0-alpha.125",
+    "@mui/core-downloads-tracker": "^5.12.0",
+    "@mui/system": "^5.12.0",
+    "@mui/types": "^7.2.4",
+    "@mui/utils": "^5.12.0",
     "@types/react-transition-group": "^4.4.5",
     "clsx": "^1.2.1",
-    "csstype": "^3.1.1",
+    "csstype": "^3.1.2",
     "prop-types": "^15.8.1",
     "react-is": "^18.2.0",
     "react-transition-group": "^4.4.5"

package/styles/CssVarsProvider.d.ts

@@ -4,6 +4,11 @@ declare const CssVarsProvider: (props: import("react").PropsWithChildren<Partial
     theme?: {
         cssVarPrefix?: string | undefined;
         colorSchemes: Record<SupportedColorScheme, Record<string, any>>;
+    } | {
+        $$material: {
+            cssVarPrefix?: string | undefined;
+            colorSchemes: Record<SupportedColorScheme, Record<string, any>>;
+        };
     } | undefined;
     documentNode?: Document | null | undefined;
     colorSchemeNode?: Element | null | undefined;

package/styles/CssVarsProvider.js

@@ -3,12 +3,14 @@ import { unstable_createCssVarsProvider as createCssVarsProvider, unstable_style
 import experimental_extendTheme from './experimental_extendTheme';
 import createTypography from './createTypography';
 import excludeVariablesFromRoot from './excludeVariablesFromRoot';
+import THEME_ID from './identifier';
 const defaultTheme = experimental_extendTheme();
 const {
   CssVarsProvider,
   useColorScheme,
   getInitColorSchemeScript
 } = createCssVarsProvider({
+  themeId: THEME_ID,
   theme: defaultTheme,
   attribute: 'data-mui-color-scheme',
   modeStorageKey: 'mui-mode',

package/styles/ThemeProvider.js

@@ -1 +1,22 @@
-export { ThemeProvider as default } from '@mui/system';
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["theme"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { ThemeProvider as SystemThemeProvider } from '@mui/system';
+import THEME_ID from './identifier';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function ThemeProvider(_ref) {
+  let {
+      theme: themeInput
+    } = _ref,
+    props = _objectWithoutPropertiesLoose(_ref, _excluded);
+  const scopedTheme = themeInput[THEME_ID];
+  return /*#__PURE__*/_jsx(SystemThemeProvider, _extends({}, props, {
+    themeId: scopedTheme ? THEME_ID : undefined,
+    theme: scopedTheme || themeInput
+  }));
+}
+process.env.NODE_ENV !== "production" ? ThemeProvider.propTypes = {
+  theme: PropTypes.object
+} : void 0;

package/styles/experimental_extendTheme.d.ts

@@ -407,7 +407,7 @@ export interface CssVarsTheme extends ColorSystem {
 
   // Default theme tokens
   spacing: Theme['spacing'];
-  breakpints: Theme['breakpoints'];
+  breakpoints: Theme['breakpoints'];
   shape: Theme['shape'];
   typography: Theme['typography'];
   transitions: Theme['transitions'];

package/styles/identifier.d.ts

@@ -0,0 +1,2 @@
+declare const _default: "$$material";
+export default _default;

package/styles/identifier.js

@@ -0,0 +1 @@
+export default '$$material';

package/styles/index.d.ts

@@ -1,3 +1,4 @@
+export { default as THEME_ID } from './identifier';
 export {
   default as createTheme,
   default as unstable_createMuiStrictModeTheme,

package/styles/index.js

@@ -1,4 +1,5 @@
 import { formatMuiErrorMessage as _formatMuiErrorMessage } from "@mui/utils";
+export { default as THEME_ID } from './identifier';
 export { default as adaptV4Theme } from './adaptV4Theme';
 export { hexToRgb, rgbToHex, hslToRgb, decomposeColor, recomposeColor, getContrastRatio, getLuminance, emphasize, alpha, darken, lighten, css, keyframes } from '@mui/system';
 // TODO: Remove this function in v6.

package/styles/styled.js

@@ -1,8 +1,10 @@
 import { createStyled, shouldForwardProp } from '@mui/system';
 import defaultTheme from './defaultTheme';
+import THEME_ID from './identifier';
 export const rootShouldForwardProp = prop => shouldForwardProp(prop) && prop !== 'classes';
 export const slotShouldForwardProp = shouldForwardProp;
 const styled = createStyled({
+  themeId: THEME_ID,
   defaultTheme,
   rootShouldForwardProp
 });

package/styles/useTheme.js

@@ -1,11 +1,12 @@
 import * as React from 'react';
 import { useTheme as useThemeSystem } from '@mui/system';
 import defaultTheme from './defaultTheme';
+import THEME_ID from './identifier';
 export default function useTheme() {
   const theme = useThemeSystem(defaultTheme);
   if (process.env.NODE_ENV !== 'production') {
     // eslint-disable-next-line react-hooks/rules-of-hooks
     React.useDebugValue(theme);
   }
-  return theme;
+  return theme[THEME_ID] || theme;
 }

package/styles/useThemeProps.js

@@ -1,5 +1,6 @@
 import { useThemeProps as systemUseThemeProps } from '@mui/system';
 import defaultTheme from './defaultTheme';
+import THEME_ID from './identifier';
 export default function useThemeProps({
   props,
   name
@@ -7,6 +8,7 @@ export default function useThemeProps({
   return systemUseThemeProps({
     props,
     name,
-    defaultTheme
+    defaultTheme,
+    themeId: THEME_ID
   });
 }