@mui/material 6.0.0-beta.3 → 6.0.0-beta.4

package/node/PigmentGrid/index.js

@@ -31,6 +31,6 @@ Object.keys(_PigmentGrid).forEach(function (key) {
     }
   });
 });
-var _grid2Classes = _interopRequireDefault(require("../Unstable_Grid2/grid2Classes"));
+var _grid2Classes = _interopRequireDefault(require("../Grid2/grid2Classes"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }

package/node/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v6.0.0-beta.3
+ * @mui/material v6.0.0-beta.4
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the
@@ -62,7 +62,7 @@ var _exportNames = {
   FormHelperText: true,
   FormLabel: true,
   Grid: true,
-  Unstable_Grid2: true,
+  Grid2: true,
   Grow: true,
   Hidden: true,
   Icon: true,
@@ -446,6 +446,12 @@ Object.defineProperty(exports, "Grid", {
     return _Grid.default;
   }
 });
+Object.defineProperty(exports, "Grid2", {
+  enumerable: true,
+  get: function () {
+    return _Grid2.default;
+  }
+});
 Object.defineProperty(exports, "Grow", {
   enumerable: true,
   get: function () {
@@ -914,12 +920,6 @@ Object.defineProperty(exports, "Typography", {
     return _Typography.default;
   }
 });
-Object.defineProperty(exports, "Unstable_Grid2", {
-  enumerable: true,
-  get: function () {
-    return _Unstable_Grid.default;
-  }
-});
 Object.defineProperty(exports, "Unstable_TrapFocus", {
   enumerable: true,
   get: function () {
@@ -1583,27 +1583,16 @@ Object.keys(_FormLabel).forEach(function (key) {
     }
   });
 });
-var _Grid = _interopRequireWildcard(require("./Grid"));
-Object.keys(_Grid).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Grid[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _Grid[key];
-    }
-  });
-});
-var _Unstable_Grid = _interopRequireWildcard(require("./Unstable_Grid2"));
-Object.keys(_Unstable_Grid).forEach(function (key) {
+var _Grid = _interopRequireDefault(require("./Grid"));
+var _Grid2 = _interopRequireWildcard(require("./Grid2"));
+Object.keys(_Grid2).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Unstable_Grid[key]) return;
+  if (key in exports && exports[key] === _Grid2[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function () {
-      return _Unstable_Grid[key];
+      return _Grid2[key];
     }
   });
 });

package/node/styles/createGetSelector.js

@@ -35,7 +35,7 @@ var _default = theme => (colorScheme, css) => {
       if (rule) {
         return {
           [rule.replace('%s', colorScheme)]: excludedVariables,
-          ':root': css
+          [`:root, ${rule.replace('%s', colorScheme)}`]: css
         };
       }
       return {
@@ -45,6 +45,9 @@ var _default = theme => (colorScheme, css) => {
         }
       };
     }
+    if (rule && rule !== 'media') {
+      return `:root, ${rule.replace('%s', String(colorScheme))}`;
+    }
   } else if (colorScheme) {
     if (rule === 'media') {
       return `@media (prefers-color-scheme: ${String(colorScheme)}) { :root`;

package/node/styles/index.js

@@ -23,6 +23,7 @@ var _exportNames = {
   css: true,
   keyframes: true,
   StyledEngineProvider: true,
+  unstable_createBreakpoints: true,
   createTheme: true,
   createMuiTheme: true,
   unstable_createMuiStrictModeTheme: true,
@@ -254,6 +255,12 @@ Object.defineProperty(exports, "styled", {
     return _styled.default;
   }
 });
+Object.defineProperty(exports, "unstable_createBreakpoints", {
+  enumerable: true,
+  get: function () {
+    return _createBreakpoints.unstable_createBreakpoints;
+  }
+});
 Object.defineProperty(exports, "unstable_createMuiStrictModeTheme", {
   enumerable: true,
   get: function () {
@@ -300,6 +307,7 @@ var _formatMuiErrorMessage2 = _interopRequireDefault(require("@mui/utils/formatM
 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 _createMuiStrictModeTheme = _interopRequireDefault(require("./createMuiStrictModeTheme"));
 var _createStyles = _interopRequireDefault(require("./createStyles"));

package/node/styles/stringifyTheme.js

@@ -50,8 +50,7 @@ function stringifyTheme(baseTheme = {}) {
     }
   }
   serializeTheme(serializableTheme);
-  return `import { createBreakpoints } from '@mui/system';
-import { createTransitions } from '@mui/material/styles';
+  return `import { unstable_createBreakpoints as createBreakpoints, createTransitions } from '@mui/material/styles';
 
 const theme = ${JSON.stringify(serializableTheme, null, 2)};
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/material",
-  "version": "6.0.0-beta.3",
+  "version": "6.0.0-beta.4",
   "private": false,
   "author": "MUI Team",
   "description": "Material UI is an open-source React component library that implements Google's Material Design. It's comprehensive and can be used in production out of the box.",
@@ -27,7 +27,7 @@
     "url": "https://opencollective.com/mui-org"
   },
   "dependencies": {
-    "@babel/runtime": "^7.24.8",
+    "@babel/runtime": "^7.25.0",
     "@popperjs/core": "^2.11.8",
     "@types/react-transition-group": "^4.4.10",
     "clsx": "^2.1.1",
@@ -35,10 +35,10 @@
     "prop-types": "^15.8.1",
     "react-is": "^18.3.1",
     "react-transition-group": "^4.4.5",
-    "@mui/system": "6.0.0-beta.3",
-    "@mui/core-downloads-tracker": "^6.0.0-beta.3",
+    "@mui/core-downloads-tracker": "^6.0.0-beta.4",
+    "@mui/system": "6.0.0-beta.4",
     "@mui/types": "^7.2.14",
-    "@mui/utils": "6.0.0-beta.3"
+    "@mui/utils": "6.0.0-beta.4"
   },
   "peerDependencies": {
     "@emotion/react": "^11.5.0",
@@ -46,7 +46,7 @@
     "@types/react": "^17.0.0 || ^18.0.0",
     "react": "^17.0.0 || ^18.0.0",
     "react-dom": "^17.0.0 || ^18.0.0",
-    "@mui/material-pigment-css": "^6.0.0-beta.3"
+    "@mui/material-pigment-css": "^6.0.0-beta.4"
   },
   "peerDependenciesMeta": {
     "@types/react": {

package/styles/createGetSelector.d.ts

@@ -8,7 +8,12 @@ declare const _default: <T extends {
     '@media (prefers-color-scheme: dark) { :root': Record<string, any>;
 } | {
     [x: string]: Record<string, any>;
-    ':root': Record<string, any>;
+    ':root'?: undefined;
+    '@media (prefers-color-scheme: dark) { :root'?: undefined;
+} | {
+    ':root': {
+        [x: string]: any;
+    };
     '@media (prefers-color-scheme: dark) { :root'?: undefined;
 };
 export default _default;

package/styles/createGetSelector.js

@@ -28,7 +28,7 @@ export default (theme => (colorScheme, css) => {
       if (rule) {
         return {
           [rule.replace('%s', colorScheme)]: excludedVariables,
-          ':root': css
+          [`:root, ${rule.replace('%s', colorScheme)}`]: css
         };
       }
       return {
@@ -38,6 +38,9 @@ export default (theme => (colorScheme, css) => {
         }
       };
     }
+    if (rule && rule !== 'media') {
+      return `:root, ${rule.replace('%s', String(colorScheme))}`;
+    }
   } else if (colorScheme) {
     if (rule === 'media') {
       return `@media (prefers-color-scheme: ${String(colorScheme)}) { :root`;

package/styles/index.d.ts

@@ -66,6 +66,7 @@ export {
   StyledEngineProvider,
   SxProps,
 } from '@mui/system';
+export { unstable_createBreakpoints } from '@mui/system/createBreakpoints';
 // TODO: Remove this function in v6.
 // eslint-disable-next-line @typescript-eslint/naming-convention
 export function experimental_sx(): any;

package/styles/index.js

@@ -4,6 +4,7 @@ import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage";
 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';
+export { unstable_createBreakpoints } from '@mui/system/createBreakpoints';
 // TODO: Remove this function in v6.
 // eslint-disable-next-line @typescript-eslint/naming-convention
 export function experimental_sx() {

package/styles/overrides.d.ts

@@ -45,7 +45,7 @@ import { FormGroupClassKey } from '../FormGroup';
 import { FormHelperTextClassKey } from '../FormHelperText';
 import { FormLabelClassKey } from '../FormLabel';
 import { GridClassKey } from '../Grid';
-import { Grid2Slot } from '../Unstable_Grid2';
+import { Grid2Slot } from '../Grid2';
 import { IconButtonClassKey } from '../IconButton';
 import { IconClassKey } from '../Icon';
 import { ImageListClassKey } from '../ImageList';

package/styles/props.d.ts

@@ -43,7 +43,7 @@ import { FormGroupProps } from '../FormGroup';
 import { FormHelperTextProps } from '../FormHelperText';
 import { FormLabelProps } from '../FormLabel';
 import { GridProps } from '../Grid';
-import { Grid2Props } from '../Unstable_Grid2';
+import { Grid2Props } from '../Grid2';
 import { IconButtonProps } from '../IconButton';
 import { IconProps } from '../Icon';
 import { ImageListProps } from '../ImageList';

package/styles/stringifyTheme.js

@@ -43,8 +43,7 @@ export function stringifyTheme(baseTheme = {}) {
     }
   }
   serializeTheme(serializableTheme);
-  return `import { createBreakpoints } from '@mui/system';
-import { createTransitions } from '@mui/material/styles';
+  return `import { unstable_createBreakpoints as createBreakpoints, createTransitions } from '@mui/material/styles';
 
 const theme = ${JSON.stringify(serializableTheme, null, 2)};
 

package/Unstable_Grid2/Grid2.d.ts

@@ -1,4 +0,0 @@
-import { OverridableComponent } from '@mui/types';
-import { Grid2TypeMap } from './Grid2Props';
-declare const Grid2: OverridableComponent<Grid2TypeMap<{}, "div">>;
-export default Grid2;

package/Unstable_Grid2/Grid2.js

@@ -1,32 +0,0 @@
-'use client';
-
-import PropTypes from 'prop-types';
-import { createGrid as createGrid2 } from '@mui/system/Unstable_Grid';
-import { styled, useThemeProps } from '../styles';
-const Grid2 = createGrid2({
-  createStyledComponent: styled('div', {
-    name: 'MuiGrid2',
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-  }),
-  componentName: 'MuiGrid2',
-  useThemeProps: inProps => useThemeProps({
-    props: inProps,
-    name: 'MuiGrid2'
-  })
-});
-process.env.NODE_ENV !== "production" ? Grid2.propTypes /* remove-proptypes */ = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * The content of the component.
-   */
-  children: PropTypes.node,
-  /**
-   * @ignore
-   */
-  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
-} : void 0;
-export default Grid2;

package/Unstable_Grid2/Grid2Props.d.ts

@@ -1,15 +0,0 @@
-import * as React from 'react';
-import { OverrideProps } from '@mui/types';
-import { SxProps, SystemProps } from '@mui/system';
-import { GridBaseProps } from '@mui/system/Unstable_Grid';
-import { Theme } from '../styles';
-export type Grid2Slot = 'root';
-export interface Grid2TypeMap<P = {}, D extends React.ElementType = 'div'> {
-    props: P & GridBaseProps & {
-        sx?: SxProps<Theme>;
-    } & SystemProps<Theme>;
-    defaultComponent: D;
-}
-export type Grid2Props<D extends React.ElementType = Grid2TypeMap['defaultComponent'], P = {
-    component?: React.ElementType;
-}> = OverrideProps<Grid2TypeMap<P, D>, D>;

package/Unstable_Grid2/Grid2Props.js

@@ -1 +0,0 @@
-export {};

package/modern/Unstable_Grid2/Grid2.js

@@ -1,32 +0,0 @@
-'use client';
-
-import PropTypes from 'prop-types';
-import { createGrid as createGrid2 } from '@mui/system/Unstable_Grid';
-import { styled, useThemeProps } from '../styles';
-const Grid2 = createGrid2({
-  createStyledComponent: styled('div', {
-    name: 'MuiGrid2',
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-  }),
-  componentName: 'MuiGrid2',
-  useThemeProps: inProps => useThemeProps({
-    props: inProps,
-    name: 'MuiGrid2'
-  })
-});
-process.env.NODE_ENV !== "production" ? Grid2.propTypes /* remove-proptypes */ = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * The content of the component.
-   */
-  children: PropTypes.node,
-  /**
-   * @ignore
-   */
-  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
-} : void 0;
-export default Grid2;

package/modern/Unstable_Grid2/Grid2Props.js

@@ -1 +0,0 @@
-export {};

package/node/Unstable_Grid2/Grid2.js

@@ -1,38 +0,0 @@
-"use strict";
-'use client';
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _Unstable_Grid = require("@mui/system/Unstable_Grid");
-var _styles = require("../styles");
-const Grid2 = (0, _Unstable_Grid.createGrid)({
-  createStyledComponent: (0, _styles.styled)('div', {
-    name: 'MuiGrid2',
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-  }),
-  componentName: 'MuiGrid2',
-  useThemeProps: inProps => (0, _styles.useThemeProps)({
-    props: inProps,
-    name: 'MuiGrid2'
-  })
-});
-process.env.NODE_ENV !== "production" ? Grid2.propTypes /* remove-proptypes */ = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * The content of the component.
-   */
-  children: _propTypes.default.node,
-  /**
-   * @ignore
-   */
-  sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object])
-} : void 0;
-var _default = exports.default = Grid2;

package/node/Unstable_Grid2/Grid2Props.js

@@ -1,5 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});