@mui/material 7.0.0-alpha.2 → 7.0.0-beta.0

package/styles/createThemeNoVars.js

@@ -5,7 +5,6 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.createMuiTheme = createMuiTheme;
 exports.default = void 0;
 var _formatMuiErrorMessage2 = _interopRequireDefault(require("@mui/utils/formatMuiErrorMessage"));
 var _deepmerge = _interopRequireDefault(require("@mui/utils/deepmerge"));
@@ -30,8 +29,13 @@ function createThemeNoVars(options = {}, ...args) {
     shape: shapeInput,
     ...other
   } = options;
-  if (options.vars) {
-    throw new Error(process.env.NODE_ENV !== "production" ? 'MUI: `vars` is a private field used for CSS variables support.\n' + 'Please use another name.' : (0, _formatMuiErrorMessage2.default)(20));
+  if (options.vars &&
+  // The error should throw only for the root theme creation because user is not allowed to use a custom node `vars`.
+  // `generateThemeVars` is the closest identifier for checking that the `options` is a result of `createTheme` with CSS variables so that user can create new theme for nested ThemeProvider.
+  options.generateThemeVars === undefined) {
+    throw new Error(process.env.NODE_ENV !== "production" ? 'MUI: `vars` is a private field used for CSS variables support.\n' +
+    // #host-reference
+    'Please use another name or follow the [docs](https://mui.com/material-ui/customization/css-theme-variables/usage/) to enable the feature.' : (0, _formatMuiErrorMessage2.default)(20));
   }
   const palette = (0, _createPalette.default)(paletteInput);
   const systemTheme = (0, _createTheme.default)(options);
@@ -92,14 +96,4 @@ function createThemeNoVars(options = {}, ...args) {
 
   return muiTheme;
 }
-let warnedOnce = false;
-function createMuiTheme(...args) {
-  if (process.env.NODE_ENV !== 'production') {
-    if (!warnedOnce) {
-      warnedOnce = true;
-      console.error(['MUI: the createMuiTheme function was renamed to createTheme.', '', "You should use `import { createTheme } from '@mui/material/styles'`"].join('\n'));
-    }
-  }
-  return createThemeNoVars(...args);
-}
 var _default = exports.default = createThemeNoVars;

package/styles/index.js

@@ -25,7 +25,6 @@ var _exportNames = {
   StyledEngineProvider: true,
   unstable_createBreakpoints: true,
   createTheme: true,
-  createMuiTheme: true,
   unstable_createMuiStrictModeTheme: true,
   createStyles: true,
   unstable_getUnit: true,
@@ -38,7 +37,6 @@ var _exportNames = {
   useTheme: true,
   useThemeProps: true,
   styled: true,
-  experimentalStyled: true,
   ThemeProvider: true,
   makeStyles: true,
   withStyles: true,
@@ -87,12 +85,6 @@ Object.defineProperty(exports, "createColorScheme", {
     return _createColorScheme.default;
   }
 });
-Object.defineProperty(exports, "createMuiTheme", {
-  enumerable: true,
-  get: function () {
-    return _createTheme.createMuiTheme;
-  }
-});
 Object.defineProperty(exports, "createStyles", {
   enumerable: true,
   get: function () {
@@ -147,12 +139,6 @@ Object.defineProperty(exports, "emphasize", {
     return _system.emphasize;
   }
 });
-Object.defineProperty(exports, "experimentalStyled", {
-  enumerable: true,
-  get: function () {
-    return _styled.default;
-  }
-});
 Object.defineProperty(exports, "experimental_extendTheme", {
   enumerable: true,
   get: function () {
@@ -315,7 +301,7 @@ var _identifier = _interopRequireDefault(require("./identifier"));
 var _adaptV4Theme = _interopRequireDefault(require("./adaptV4Theme"));
 var _system = require("@mui/system");
 var _createBreakpoints = require("@mui/system/createBreakpoints");
-var _createTheme = _interopRequireWildcard(require("./createTheme"));
+var _createTheme = _interopRequireDefault(require("./createTheme"));
 var _createMuiStrictModeTheme = _interopRequireDefault(require("./createMuiStrictModeTheme"));
 var _createStyles = _interopRequireDefault(require("./createStyles"));
 var _cssUtils = require("./cssUtils");