@mui/material 7.1.1 → 7.2.0

package/Backdrop/Backdrop.js

@@ -91,6 +91,7 @@ const Backdrop = /*#__PURE__*/React.forwardRef(function Backdrop(inProps, ref) {
     ...slotProps
   };
   const externalForwardedProps = {
+    component,
     slots: backwardCompatibleSlots,
     slotProps: backwardCompatibleSlotProps
   };

package/Breadcrumbs/BreadcrumbCollapsed.js

@@ -15,7 +15,9 @@ var _memoTheme = _interopRequireDefault(require("../utils/memoTheme"));
 var _MoreHoriz = _interopRequireDefault(require("../internal/svg-icons/MoreHoriz"));
 var _ButtonBase = _interopRequireDefault(require("../ButtonBase"));
 var _jsxRuntime = require("react/jsx-runtime");
-const BreadcrumbCollapsedButton = (0, _zeroStyled.styled)(_ButtonBase.default)((0, _memoTheme.default)(({
+const BreadcrumbCollapsedButton = (0, _zeroStyled.styled)(_ButtonBase.default, {
+  name: 'MuiBreadcrumbCollapsed'
+})((0, _memoTheme.default)(({
   theme
 }) => ({
   display: 'flex',

package/CHANGELOG.md

@@ -1,5 +1,86 @@
 # [Versions](https://mui.com/versions/)
 
+## 7.2.0
+
+<!-- generated comparing v7.1.1..master -->
+
+_Jun 26, 2025_
+
+A big thanks to the 17 contributors who made this release possible. Here are the highlights ✨:
+
+- ⚡️ Added `modularCssLayers` theme option for splitting styles into multiple CSS layers (#46001) @siriwatknp.
+- 📖 Added example for using Material UI with React Router v7 (#46406) @siriwatknp.
+
+### `@mui/material@7.2.0`
+
+- [Backdrop] Fix handling of `component` prop (#46269) @sai6855
+- [Chip] Explicitly define line-height (#46260) @DiegoAndai
+- [Chip] Fix handling on event handlers (#46263) @sai6855
+- [OutlinedInput][Input] Deprecate composed classes (#46316) @sai6855
+- [Select] Pass MenuProps.slotProps.list alongside MenuListProps (#46274) @scousino
+- [l10] Enable `labelDisplayedRows` translation for Romanian (#46377) @dhu-redwoodtech
+- Skip generating `modularCssLayers` CSS var (#46329) @siriwatknp
+
+### `@mui/system@7.2.0`
+
+- Add `modularCssLayers` theme flag to split styles into multiple CSS layers (#46001) @siriwatknp
+
+### `@mui/styled-engine@7.2.0`
+
+- Do not reuse the emotion cache across SSR requests (#46276) @robbtraister
+
+### `@mui/codemod@7.2.0`
+
+- [Dialog] Add codemod for deprecated props (#46328) @sai6855
+
+### Docs
+
+- Don't forward `hasAiSuggestion` (#46415) @bharatkashyap
+- Add introduction to MCP (#46224) @bharatkashyap
+- Fallback for searchbar during SSR (#46364) @Janpot
+- Update InitColorSchemeScript options to match colorSchemeSelector (#46302) @humble-barnacle001
+- Add `ListItemButton` to make the deprecation clear (#46356) @siriwatknp
+- Remove "Unstyled" section from component docs (#46272) @mapache-salvaje
+- Add Testing section to Rating component doc (#46268) @0210shivam
+- Fix fade modal demo (#46271) @brijeshb42
+- [ai] Add suggestions to edit with MUI Chat (#46309) @bharatkashyap
+- [Dialog] Fix form dialog uses ARIA roles on incompatible elements (#46307) @ZeeshanTamboli
+- [Menu] Fix dark mode styling of grouped header demo (#46317) @sai6855
+- [TextField] Removed type="number" demos (#46314) @KirankumarAmbati
+- [examples] Add `material-ui-react-router-ts` example (#46406) @siriwatknp
+
+### Core
+
+- pnpm docs:sync-team (3641a0b) @oliviertassinari
+- Add cross-env to eslint script (#46358) @ZeeshanTamboli
+- Support merging of className and style from theme (#45975) @sai6855
+- [code-infra] Create bundle size package (#45911) @Janpot
+- [docs-infra] Add a script to generate Material UI `llms.txt` and docs markdown. (#46308) @siriwatknp
+- [docs-infra] Fix stackblitz for js projects (#46220) @Janpot
+- [infra] Add emotion as external for bundle monitor (#46372) @Janpot
+- [infra] Create update PR on every canary publish for internal packages (#46367) @Janpot
+- [infra] Remove deprecated esmExternals (#46365) @Janpot
+- [infra] Support project-specific changelog in build scripts (#46425) @michaldudak
+- [toolpad][website] Remove references to Toolpad (#46311) @prakhargupta1
+
+All contributors of this release in alphabetical order: @0210shivam, @bharatkashyap, @brijeshb42, @dhu-redwoodtech, @DiegoAndai, @humble-barnacle001, @Janpot, @KirankumarAmbati, @mapache-salvaje, @michaldudak, @oliviertassinari, @prakhargupta1, @robbtraister, @sai6855, @scousino, @siriwatknp, @ZeeshanTamboli
+
+## 7.1.2
+
+_Jun 18, 2025_
+
+A big thanks to the 2 contributors who made this release possible.
+
+### `@mui/material@7.1.2`
+
+- [Chip] Fix handling on event handlers (#46263) @sai6855
+
+### Docs
+
+- Fix fade modal demo (#46271) @brijeshb42
+
+All contributors of this release in alphabetical order: @brijeshb42, @sai6855
+
 ## 7.1.1
 
 <!-- generated comparing v7.1.0..master -->

package/Chip/Chip.js

@@ -93,6 +93,7 @@ const ChipRoot = (0, _zeroStyled.styled)('div', {
     alignItems: 'center',
     justifyContent: 'center',
     height: 32,
+    lineHeight: 1.5,
     color: (theme.vars || theme).palette.text.primary,
     backgroundColor: (theme.vars || theme).palette.action.selected,
     borderRadius: 32 / 2,
@@ -486,15 +487,15 @@ const Chip = /*#__PURE__*/React.forwardRef(function Chip(inProps, ref) {
       ...handlers,
       onClick: event => {
         handlers.onClick?.(event);
-        onClick(event);
+        onClick?.(event);
       },
       onKeyDown: event => {
         handlers.onKeyDown?.(event);
-        handleKeyDown(event);
+        handleKeyDown?.(event);
       },
       onKeyUp: event => {
         handlers.onKeyUp?.(event);
-        handleKeyUp(event);
+        handleKeyUp?.(event);
       }
     })
   });

package/Input/inputClasses.d.ts

@@ -21,13 +21,21 @@ export interface InputClasses {
   fullWidth: string;
   /** Styles applied to the input element. */
   input: string;
-  /** Styles applied to the input element if `size="small"`. */
+  /** Styles applied to the input element if `size="small"`.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-sizeSmall](/material-ui/api/input-base/#inputbase-classes-sizeSmall) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputSizeSmall: string;
-  /** Styles applied to the input element if `multiline={true}`. */
+  /** Styles applied to the input element if `multiline={true}`.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-multiline](/material-ui/api/input-base/#inputbase-classes-multiline) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputMultiline: string;
-  /** Styles applied to the input element if `startAdornment` is provided. */
+  /** Styles applied to the input element if `startAdornment` is provided.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-adornedStart](/material-ui/api/input-base/#inputbase-classes-adornedStart) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputAdornedStart: string;
-  /** Styles applied to the input element if `endAdornment` is provided. */
+  /** Styles applied to the input element if `endAdornment` is provided.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-adornedEnd](/material-ui/api/input-base/#inputbase-classes-adornedEnd) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputAdornedEnd: string;
   /** Styles applied to the input element if `type="search"`. */
   inputTypeSearch: string;

package/NativeSelect/NativeSelectInput.js

@@ -32,7 +32,9 @@ const useUtilityClasses = ownerState => {
   };
   return (0, _composeClasses.default)(slots, _nativeSelectClasses.getNativeSelectUtilityClasses, classes);
 };
-const StyledSelectSelect = exports.StyledSelectSelect = (0, _zeroStyled.styled)('select')(({
+const StyledSelectSelect = exports.StyledSelectSelect = (0, _zeroStyled.styled)('select', {
+  name: 'MuiNativeSelect'
+})(({
   theme
 }) => ({
   // Reset
@@ -106,7 +108,9 @@ const NativeSelectSelect = (0, _zeroStyled.styled)(StyledSelectSelect, {
     }];
   }
 })({});
-const StyledSelectIcon = exports.StyledSelectIcon = (0, _zeroStyled.styled)('svg')(({
+const StyledSelectIcon = exports.StyledSelectIcon = (0, _zeroStyled.styled)('svg', {
+  name: 'MuiNativeSelect'
+})(({
   theme
 }) => ({
   // We use a position absolute over a flexbox in order to forward the pointer events

package/OutlinedInput/NotchedOutline.js

@@ -15,6 +15,7 @@ var _memoTheme = _interopRequireDefault(require("../utils/memoTheme"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _span;
 const NotchedOutlineRoot = (0, _zeroStyled.styled)('fieldset', {
+  name: 'MuiNotchedOutlined',
   shouldForwardProp: _rootShouldForwardProp.default
 })({
   textAlign: 'left',
@@ -33,6 +34,7 @@ const NotchedOutlineRoot = (0, _zeroStyled.styled)('fieldset', {
   minWidth: '0%'
 });
 const NotchedOutlineLegend = (0, _zeroStyled.styled)('legend', {
+  name: 'MuiNotchedOutlined',
   shouldForwardProp: _rootShouldForwardProp.default
 })((0, _memoTheme.default)(({
   theme

package/OutlinedInput/outlinedInputClasses.d.ts

@@ -21,13 +21,21 @@ export interface OutlinedInputClasses {
   notchedOutline: string;
   /** Styles applied to the input element. */
   input: string;
-  /** Styles applied to the input element if `size="small"`. */
+  /** Styles applied to the input element if `size="small"`.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-sizeSmall](/material-ui/api/input-base/#inputbase-classes-sizeSmall) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputSizeSmall: string;
-  /** Styles applied to the input element if `multiline={true}`. */
+  /** Styles applied to the input element if `multiline={true}`.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-multiline](/material-ui/api/input-base/#inputbase-classes-multiline) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputMultiline: string;
-  /** Styles applied to the input element if `startAdornment` is provided. */
+  /** Styles applied to the input element if `startAdornment` is provided.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-adornedStart](/material-ui/api/input-base/#inputbase-classes-adornedStart) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputAdornedStart: string;
-  /** Styles applied to the input element if `endAdornment` is provided. */
+  /** Styles applied to the input element if `endAdornment` is provided.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-adornedEnd](/material-ui/api/input-base/#inputbase-classes-adornedEnd) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputAdornedEnd: string;
   /** Styles applied to the input element if `type="search"`. */
   inputTypeSearch: string;

package/Radio/RadioButtonIcon.js

@@ -16,16 +16,21 @@ var _zeroStyled = require("../zero-styled");
 var _memoTheme = _interopRequireDefault(require("../utils/memoTheme"));
 var _jsxRuntime = require("react/jsx-runtime");
 const RadioButtonIconRoot = (0, _zeroStyled.styled)('span', {
+  name: 'MuiRadioButtonIcon',
   shouldForwardProp: _rootShouldForwardProp.default
 })({
   position: 'relative',
   display: 'flex'
 });
-const RadioButtonIconBackground = (0, _zeroStyled.styled)(_RadioButtonUnchecked.default)({
+const RadioButtonIconBackground = (0, _zeroStyled.styled)(_RadioButtonUnchecked.default, {
+  name: 'MuiRadioButtonIcon'
+})({
   // Scale applied to prevent dot misalignment in Safari
   transform: 'scale(1)'
 });
-const RadioButtonIconDot = (0, _zeroStyled.styled)(_RadioButtonChecked.default)((0, _memoTheme.default)(({
+const RadioButtonIconDot = (0, _zeroStyled.styled)(_RadioButtonChecked.default, {
+  name: 'MuiRadioButtonIcon'
+})((0, _memoTheme.default)(({
   theme
 }) => ({
   left: 0,

package/Select/SelectInput.js

@@ -442,6 +442,10 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     ...MenuProps.PaperProps,
     ...MenuProps.slotProps?.paper
   };
+  const listProps = {
+    ...MenuProps.MenuListProps,
+    ...MenuProps.slotProps?.list
+  };
   const listboxId = (0, _useId.default)();
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(SelectSelect, {
@@ -514,7 +518,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
           'aria-multiselectable': multiple ? 'true' : undefined,
           disableListWrap: true,
           id: listboxId,
-          ...MenuProps.MenuListProps
+          ...listProps
         },
         paper: {
           ...paperProps,

package/SwipeableDrawer/SwipeArea.js

@@ -17,6 +17,7 @@ var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
 var _Drawer = require("../Drawer/Drawer");
 var _jsxRuntime = require("react/jsx-runtime");
 const SwipeAreaRoot = (0, _zeroStyled.styled)('div', {
+  name: 'MuiSwipeArea',
   shouldForwardProp: _rootShouldForwardProp.default
 })((0, _memoTheme.default)(({
   theme

package/esm/Backdrop/Backdrop.js

@@ -84,6 +84,7 @@ const Backdrop = /*#__PURE__*/React.forwardRef(function Backdrop(inProps, ref) {
     ...slotProps
   };
   const externalForwardedProps = {
+    component,
     slots: backwardCompatibleSlots,
     slotProps: backwardCompatibleSlotProps
   };

package/esm/Breadcrumbs/BreadcrumbCollapsed.js

@@ -8,7 +8,9 @@ import memoTheme from "../utils/memoTheme.js";
 import MoreHorizIcon from "../internal/svg-icons/MoreHoriz.js";
 import ButtonBase from "../ButtonBase/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
-const BreadcrumbCollapsedButton = styled(ButtonBase)(memoTheme(({
+const BreadcrumbCollapsedButton = styled(ButtonBase, {
+  name: 'MuiBreadcrumbCollapsed'
+})(memoTheme(({
   theme
 }) => ({
   display: 'flex',

package/esm/Chip/Chip.js

@@ -86,6 +86,7 @@ const ChipRoot = styled('div', {
     alignItems: 'center',
     justifyContent: 'center',
     height: 32,
+    lineHeight: 1.5,
     color: (theme.vars || theme).palette.text.primary,
     backgroundColor: (theme.vars || theme).palette.action.selected,
     borderRadius: 32 / 2,
@@ -479,15 +480,15 @@ const Chip = /*#__PURE__*/React.forwardRef(function Chip(inProps, ref) {
       ...handlers,
       onClick: event => {
         handlers.onClick?.(event);
-        onClick(event);
+        onClick?.(event);
       },
       onKeyDown: event => {
         handlers.onKeyDown?.(event);
-        handleKeyDown(event);
+        handleKeyDown?.(event);
       },
       onKeyUp: event => {
         handlers.onKeyUp?.(event);
-        handleKeyUp(event);
+        handleKeyUp?.(event);
       }
     })
   });

package/esm/Input/inputClasses.d.ts

@@ -21,13 +21,21 @@ export interface InputClasses {
   fullWidth: string;
   /** Styles applied to the input element. */
   input: string;
-  /** Styles applied to the input element if `size="small"`. */
+  /** Styles applied to the input element if `size="small"`.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-sizeSmall](/material-ui/api/input-base/#inputbase-classes-sizeSmall) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputSizeSmall: string;
-  /** Styles applied to the input element if `multiline={true}`. */
+  /** Styles applied to the input element if `multiline={true}`.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-multiline](/material-ui/api/input-base/#inputbase-classes-multiline) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputMultiline: string;
-  /** Styles applied to the input element if `startAdornment` is provided. */
+  /** Styles applied to the input element if `startAdornment` is provided.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-adornedStart](/material-ui/api/input-base/#inputbase-classes-adornedStart) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputAdornedStart: string;
-  /** Styles applied to the input element if `endAdornment` is provided. */
+  /** Styles applied to the input element if `endAdornment` is provided.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-adornedEnd](/material-ui/api/input-base/#inputbase-classes-adornedEnd) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputAdornedEnd: string;
   /** Styles applied to the input element if `type="search"`. */
   inputTypeSearch: string;

package/esm/NativeSelect/NativeSelectInput.js

@@ -25,7 +25,9 @@ const useUtilityClasses = ownerState => {
   };
   return composeClasses(slots, getNativeSelectUtilityClasses, classes);
 };
-export const StyledSelectSelect = styled('select')(({
+export const StyledSelectSelect = styled('select', {
+  name: 'MuiNativeSelect'
+})(({
   theme
 }) => ({
   // Reset
@@ -99,7 +101,9 @@ const NativeSelectSelect = styled(StyledSelectSelect, {
     }];
   }
 })({});
-export const StyledSelectIcon = styled('svg')(({
+export const StyledSelectIcon = styled('svg', {
+  name: 'MuiNativeSelect'
+})(({
   theme
 }) => ({
   // We use a position absolute over a flexbox in order to forward the pointer events

package/esm/OutlinedInput/NotchedOutline.js

@@ -8,6 +8,7 @@ import { styled } from "../zero-styled/index.js";
 import memoTheme from "../utils/memoTheme.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const NotchedOutlineRoot = styled('fieldset', {
+  name: 'MuiNotchedOutlined',
   shouldForwardProp: rootShouldForwardProp
 })({
   textAlign: 'left',
@@ -26,6 +27,7 @@ const NotchedOutlineRoot = styled('fieldset', {
   minWidth: '0%'
 });
 const NotchedOutlineLegend = styled('legend', {
+  name: 'MuiNotchedOutlined',
   shouldForwardProp: rootShouldForwardProp
 })(memoTheme(({
   theme

package/esm/OutlinedInput/outlinedInputClasses.d.ts

@@ -21,13 +21,21 @@ export interface OutlinedInputClasses {
   notchedOutline: string;
   /** Styles applied to the input element. */
   input: string;
-  /** Styles applied to the input element if `size="small"`. */
+  /** Styles applied to the input element if `size="small"`.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-sizeSmall](/material-ui/api/input-base/#inputbase-classes-sizeSmall) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputSizeSmall: string;
-  /** Styles applied to the input element if `multiline={true}`. */
+  /** Styles applied to the input element if `multiline={true}`.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-multiline](/material-ui/api/input-base/#inputbase-classes-multiline) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputMultiline: string;
-  /** Styles applied to the input element if `startAdornment` is provided. */
+  /** Styles applied to the input element if `startAdornment` is provided.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-adornedStart](/material-ui/api/input-base/#inputbase-classes-adornedStart) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputAdornedStart: string;
-  /** Styles applied to the input element if `endAdornment` is provided. */
+  /** Styles applied to the input element if `endAdornment` is provided.
+   * @deprecated Combine the [.MuiInputBase-input](/material-ui/api/input-base/#inputbase-classes-input) and [.MuiInputBase-adornedEnd](/material-ui/api/input-base/#inputbase-classes-adornedEnd) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
   inputAdornedEnd: string;
   /** Styles applied to the input element if `type="search"`. */
   inputTypeSearch: string;

package/esm/Radio/RadioButtonIcon.js

@@ -9,16 +9,21 @@ import { styled } from "../zero-styled/index.js";
 import memoTheme from "../utils/memoTheme.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const RadioButtonIconRoot = styled('span', {
+  name: 'MuiRadioButtonIcon',
   shouldForwardProp: rootShouldForwardProp
 })({
   position: 'relative',
   display: 'flex'
 });
-const RadioButtonIconBackground = styled(RadioButtonUncheckedIcon)({
+const RadioButtonIconBackground = styled(RadioButtonUncheckedIcon, {
+  name: 'MuiRadioButtonIcon'
+})({
   // Scale applied to prevent dot misalignment in Safari
   transform: 'scale(1)'
 });
-const RadioButtonIconDot = styled(RadioButtonCheckedIcon)(memoTheme(({
+const RadioButtonIconDot = styled(RadioButtonCheckedIcon, {
+  name: 'MuiRadioButtonIcon'
+})(memoTheme(({
   theme
 }) => ({
   left: 0,

package/esm/Select/SelectInput.js

@@ -435,6 +435,10 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     ...MenuProps.PaperProps,
     ...MenuProps.slotProps?.paper
   };
+  const listProps = {
+    ...MenuProps.MenuListProps,
+    ...MenuProps.slotProps?.list
+  };
   const listboxId = useId();
   return /*#__PURE__*/_jsxs(React.Fragment, {
     children: [/*#__PURE__*/_jsx(SelectSelect, {
@@ -507,7 +511,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
           'aria-multiselectable': multiple ? 'true' : undefined,
           disableListWrap: true,
           id: listboxId,
-          ...MenuProps.MenuListProps
+          ...listProps
         },
         paper: {
           ...paperProps,

package/esm/SwipeableDrawer/SwipeArea.js

@@ -10,6 +10,7 @@ import capitalize from "../utils/capitalize.js";
 import { isHorizontal } from "../Drawer/Drawer.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const SwipeAreaRoot = styled('div', {
+  name: 'MuiSwipeArea',
   shouldForwardProp: rootShouldForwardProp
 })(memoTheme(({
   theme

package/esm/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v7.1.1
+ * @mui/material v7.2.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/esm/internal/SwitchBase.js

@@ -26,7 +26,9 @@ const useUtilityClasses = ownerState => {
   };
   return composeClasses(slots, getSwitchBaseUtilityClass, classes);
 };
-const SwitchBaseRoot = styled(ButtonBase)({
+const SwitchBaseRoot = styled(ButtonBase, {
+  name: 'MuiSwitchBase'
+})({
   padding: 9,
   borderRadius: '50%',
   variants: [{
@@ -64,6 +66,7 @@ const SwitchBaseRoot = styled(ButtonBase)({
   }]
 });
 const SwitchBaseInput = styled('input', {
+  name: 'MuiSwitchBase',
   shouldForwardProp: rootShouldForwardProp
 })({
   cursor: 'inherit',

package/esm/locale/index.js

@@ -3278,9 +3278,12 @@ export const roRO = {
           // if (type === 'previous') {
           return 'Mergi la pagina precedentă';
         },
-        labelRowsPerPage: 'Rânduri pe pagină:'
-        // labelDisplayedRows: ({ from, to, count }) =>
-        //   `${from}–${to} din ${count !== -1 ? count : `more than ${to}`}`,
+        labelRowsPerPage: 'Rânduri pe pagină:',
+        labelDisplayedRows: ({
+          from,
+          to,
+          count
+        }) => `${from}–${to} din ${count !== -1 ? count : `mai mult de ${to}`}`
       }
     },
     MuiRating: {

package/esm/styles/components.d.ts

@@ -2,6 +2,11 @@ import { ComponentsProps } from "./props.js";
 import { ComponentsOverrides } from "./overrides.js";
 import { ComponentsVariants } from "./variants.js";
 export interface Components<Theme = unknown> {
+  /**
+   * Whether to merge the className and style coming from the component props with the default props.
+   * @default false
+   */
+  mergeClassNameAndStyle?: boolean;
   MuiAlert?: {
     defaultProps?: ComponentsProps['MuiAlert'];
     styleOverrides?: ComponentsOverrides<Theme>['MuiAlert'];

package/esm/styles/createThemeNoVars.d.ts

@@ -32,6 +32,7 @@ export interface ThemeOptions extends Omit<SystemThemeOptions, 'zIndex'>, CssVar
   zIndex?: ZIndexOptions;
   unstable_strictMode?: boolean;
   unstable_sxConfig?: SxConfig;
+  modularCssLayers?: boolean | string;
 }
 export interface BaseTheme extends SystemTheme {
   mixins: Mixins;

package/esm/styles/shouldSkipGeneratingVar.js

@@ -1,5 +1,5 @@
 export default function shouldSkipGeneratingVar(keys) {
-  return !!keys[0].match(/(cssVarPrefix|colorSchemeSelector|rootSelector|typography|mixins|breakpoints|direction|transitions)/) || !!keys[0].match(/sxConfig$/) ||
+  return !!keys[0].match(/(cssVarPrefix|colorSchemeSelector|modularCssLayers|rootSelector|typography|mixins|breakpoints|direction|transitions)/) || !!keys[0].match(/sxConfig$/) ||
   // ends with sxConfig
   keys[0] === 'palette' && !!keys[1]?.match(/(mode|contrastThreshold|tonalOffset)/);
 }

package/esm/version/index.js

@@ -1,6 +1,6 @@
-export const version = "7.1.1";
+export const version = "7.2.0";
 export const major = Number("7");
-export const minor = Number("1");
-export const patch = Number("1");
+export const minor = Number("2");
+export const patch = Number("0");
 export const prerelease = undefined;
 export default version;

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v7.1.1
+ * @mui/material v7.2.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/internal/SwitchBase.js

@@ -33,7 +33,9 @@ const useUtilityClasses = ownerState => {
   };
   return (0, _composeClasses.default)(slots, _switchBaseClasses.getSwitchBaseUtilityClass, classes);
 };
-const SwitchBaseRoot = (0, _zeroStyled.styled)(_ButtonBase.default)({
+const SwitchBaseRoot = (0, _zeroStyled.styled)(_ButtonBase.default, {
+  name: 'MuiSwitchBase'
+})({
   padding: 9,
   borderRadius: '50%',
   variants: [{
@@ -71,6 +73,7 @@ const SwitchBaseRoot = (0, _zeroStyled.styled)(_ButtonBase.default)({
   }]
 });
 const SwitchBaseInput = (0, _zeroStyled.styled)('input', {
+  name: 'MuiSwitchBase',
   shouldForwardProp: _rootShouldForwardProp.default
 })({
   cursor: 'inherit',

package/locale/index.js

@@ -3284,9 +3284,12 @@ const roRO = exports.roRO = {
           // if (type === 'previous') {
           return 'Mergi la pagina precedentă';
         },
-        labelRowsPerPage: 'Rânduri pe pagină:'
-        // labelDisplayedRows: ({ from, to, count }) =>
-        //   `${from}–${to} din ${count !== -1 ? count : `more than ${to}`}`,
+        labelRowsPerPage: 'Rânduri pe pagină:',
+        labelDisplayedRows: ({
+          from,
+          to,
+          count
+        }) => `${from}–${to} din ${count !== -1 ? count : `mai mult de ${to}`}`
       }
     },
     MuiRating: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/material",
-  "version": "7.1.1",
+  "version": "7.2.0",
   "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.",
   "main": "./index.js",
@@ -26,7 +26,7 @@
     "url": "https://opencollective.com/mui-org"
   },
   "dependencies": {
-    "@babel/runtime": "^7.27.1",
+    "@babel/runtime": "^7.27.6",
     "@popperjs/core": "^2.11.8",
     "@types/react-transition-group": "^4.4.12",
     "clsx": "^2.1.1",
@@ -34,10 +34,10 @@
     "prop-types": "^15.8.1",
     "react-is": "^19.1.0",
     "react-transition-group": "^4.4.5",
-    "@mui/core-downloads-tracker": "^7.1.1",
-    "@mui/types": "^7.4.3",
-    "@mui/system": "^7.1.1",
-    "@mui/utils": "^7.1.1"
+    "@mui/system": "^7.2.0",
+    "@mui/types": "^7.4.4",
+    "@mui/utils": "^7.2.0",
+    "@mui/core-downloads-tracker": "^7.2.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.5.0",
@@ -45,7 +45,7 @@
     "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
     "react": "^17.0.0 || ^18.0.0 || ^19.0.0",
     "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0",
-    "@mui/material-pigment-css": "^7.1.1"
+    "@mui/material-pigment-css": "^7.2.0"
   },
   "peerDependenciesMeta": {
     "@types/react": {

package/styles/components.d.ts

@@ -2,6 +2,11 @@ import { ComponentsProps } from "./props.js";
 import { ComponentsOverrides } from "./overrides.js";
 import { ComponentsVariants } from "./variants.js";
 export interface Components<Theme = unknown> {
+  /**
+   * Whether to merge the className and style coming from the component props with the default props.
+   * @default false
+   */
+  mergeClassNameAndStyle?: boolean;
   MuiAlert?: {
     defaultProps?: ComponentsProps['MuiAlert'];
     styleOverrides?: ComponentsOverrides<Theme>['MuiAlert'];

package/styles/createThemeNoVars.d.ts

@@ -32,6 +32,7 @@ export interface ThemeOptions extends Omit<SystemThemeOptions, 'zIndex'>, CssVar
   zIndex?: ZIndexOptions;
   unstable_strictMode?: boolean;
   unstable_sxConfig?: SxConfig;
+  modularCssLayers?: boolean | string;
 }
 export interface BaseTheme extends SystemTheme {
   mixins: Mixins;

package/styles/shouldSkipGeneratingVar.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = shouldSkipGeneratingVar;
 function shouldSkipGeneratingVar(keys) {
-  return !!keys[0].match(/(cssVarPrefix|colorSchemeSelector|rootSelector|typography|mixins|breakpoints|direction|transitions)/) || !!keys[0].match(/sxConfig$/) ||
+  return !!keys[0].match(/(cssVarPrefix|colorSchemeSelector|modularCssLayers|rootSelector|typography|mixins|breakpoints|direction|transitions)/) || !!keys[0].match(/sxConfig$/) ||
   // ends with sxConfig
   keys[0] === 'palette' && !!keys[1]?.match(/(mode|contrastThreshold|tonalOffset)/);
 }

package/version/index.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.version = exports.prerelease = exports.patch = exports.minor = exports.major = exports.default = void 0;
-const version = exports.version = "7.1.1";
+const version = exports.version = "7.2.0";
 const major = exports.major = Number("7");
-const minor = exports.minor = Number("1");
-const patch = exports.patch = Number("1");
+const minor = exports.minor = Number("2");
+const patch = exports.patch = Number("0");
 const prerelease = exports.prerelease = undefined;
 var _default = exports.default = version;