@mui/material 7.3.6 → 7.3.8

package/Accordion/Accordion.d.ts

@@ -75,12 +75,12 @@ export interface AccordionOwnProps {
    */
   disabled?: boolean;
   /**
-   * If `true`, it removes the margin between two expanded accordion items and the increase of height.
+   * If `true`, it removes the margin between two expanded accordion items and prevents the increased height when expanded.
    * @default false
    */
   disableGutters?: boolean;
   /**
-   * If `true`, expands the accordion, otherwise collapse it.
+   * If `true`, expands the accordion, otherwise collapses it.
    * Setting this prop enables control over the accordion.
    */
   expanded?: boolean;

package/Accordion/Accordion.js

@@ -149,7 +149,6 @@ const Accordion = /*#__PURE__*/React.forwardRef(function Accordion(inProps, ref)
     disableGutters = false,
     expanded: expandedProp,
     onChange,
-    square = false,
     slots = {},
     slotProps = {},
     TransitionComponent: TransitionComponentProp,
@@ -177,7 +176,6 @@ const Accordion = /*#__PURE__*/React.forwardRef(function Accordion(inProps, ref)
   }), [expanded, disabled, disableGutters, handleChange]);
   const ownerState = {
     ...props,
-    square,
     disabled,
     disableGutters,
     expanded
@@ -204,10 +202,7 @@ const Accordion = /*#__PURE__*/React.forwardRef(function Accordion(inProps, ref)
     className: (0, _clsx.default)(classes.root, className),
     shouldForwardComponentProp: true,
     ownerState,
-    ref,
-    additionalProps: {
-      square
-    }
+    ref
   });
   const [AccordionHeadingSlot, accordionProps] = (0, _useSlot.default)('heading', {
     elementType: AccordionHeading,
@@ -287,12 +282,12 @@ process.env.NODE_ENV !== "production" ? Accordion.propTypes /* remove-proptypes
    */
   disabled: _propTypes.default.bool,
   /**
-   * If `true`, it removes the margin between two expanded accordion items and the increase of height.
+   * If `true`, it removes the margin between two expanded accordion items and prevents the increased height when expanded.
    * @default false
    */
   disableGutters: _propTypes.default.bool,
   /**
-   * If `true`, expands the accordion, otherwise collapse it.
+   * If `true`, expands the accordion, otherwise collapses it.
    * Setting this prop enables control over the accordion.
    */
   expanded: _propTypes.default.bool,
@@ -323,11 +318,6 @@ process.env.NODE_ENV !== "production" ? Accordion.propTypes /* remove-proptypes
     root: _propTypes.default.elementType,
     transition: _propTypes.default.elementType
   }),
-  /**
-   * If `true`, rounded corners are disabled.
-   * @default false
-   */
-  square: _propTypes.default.bool,
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */

package/AppBar/AppBar.js

@@ -33,7 +33,7 @@ const useUtilityClasses = ownerState => {
 
 // var2 is the fallback.
 // Ex. var1: 'var(--a)', var2: 'var(--b)'; return: 'var(--a, var(--b))'
-const joinVars = (var1, var2) => var1 ? `${var1?.replace(')', '')}, ${var2})` : var2;
+const joinVars = (var1, var2) => var1 ? `${var1.replace(')', '')}, ${var2})` : var2;
 const AppBarRoot = (0, _zeroStyled.styled)(_Paper.default, {
   name: 'MuiAppBar',
   slot: 'Root',
@@ -108,7 +108,8 @@ const AppBarRoot = (0, _zeroStyled.styled)(_Paper.default, {
       color: 'inherit'
     },
     style: {
-      '--AppBar-color': 'inherit'
+      '--AppBar-color': 'inherit',
+      color: 'var(--AppBar-color)'
     }
   }, {
     props: {

package/Autocomplete/Autocomplete.d.ts

@@ -283,7 +283,7 @@ export interface AutocompleteProps<Value, Multiple extends boolean | undefined,
    * @returns {ReactNode}
    */
   renderOption?: (props: React.HTMLAttributes<HTMLLIElement> & {
-    key: any;
+    key: React.Key;
   }, option: Value, state: AutocompleteRenderOptionState, ownerState: AutocompleteOwnerState<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>) => React.ReactNode;
   /**
    * Render the selected value when doing multiple selections.

package/Autocomplete/Autocomplete.js

@@ -669,7 +669,7 @@ const Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps
       children: renderInput({
         id,
         disabled,
-        fullWidth: true,
+        fullWidth: props.fullWidth ?? true,
         size: size === 'small' ? 'small' : undefined,
         InputLabelProps: getInputLabelProps(),
         InputProps: {

package/Backdrop/Backdrop.js

@@ -114,7 +114,6 @@ const Backdrop = /*#__PURE__*/React.forwardRef(function Backdrop(inProps, ref) {
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(RootSlot, {
       "aria-hidden": true,
       ...rootProps,
-      classes: classes,
       ref: ref,
       children: children
     })

package/Badge/Badge.js

@@ -100,110 +100,6 @@ const BadgeBadge = (0, _zeroStyled.styled)('span', {
       minWidth: RADIUS_DOT * 2,
       padding: 0
     }
-  }, {
-    props: ({
-      ownerState
-    }) => ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'rectangular',
-    style: {
-      top: 0,
-      right: 0,
-      transform: 'scale(1) translate(50%, -50%)',
-      transformOrigin: '100% 0%',
-      [`&.${_badgeClasses.default.invisible}`]: {
-        transform: 'scale(0) translate(50%, -50%)'
-      }
-    }
-  }, {
-    props: ({
-      ownerState
-    }) => ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'rectangular',
-    style: {
-      bottom: 0,
-      right: 0,
-      transform: 'scale(1) translate(50%, 50%)',
-      transformOrigin: '100% 100%',
-      [`&.${_badgeClasses.default.invisible}`]: {
-        transform: 'scale(0) translate(50%, 50%)'
-      }
-    }
-  }, {
-    props: ({
-      ownerState
-    }) => ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'rectangular',
-    style: {
-      top: 0,
-      left: 0,
-      transform: 'scale(1) translate(-50%, -50%)',
-      transformOrigin: '0% 0%',
-      [`&.${_badgeClasses.default.invisible}`]: {
-        transform: 'scale(0) translate(-50%, -50%)'
-      }
-    }
-  }, {
-    props: ({
-      ownerState
-    }) => ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'rectangular',
-    style: {
-      bottom: 0,
-      left: 0,
-      transform: 'scale(1) translate(-50%, 50%)',
-      transformOrigin: '0% 100%',
-      [`&.${_badgeClasses.default.invisible}`]: {
-        transform: 'scale(0) translate(-50%, 50%)'
-      }
-    }
-  }, {
-    props: ({
-      ownerState
-    }) => ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'circular',
-    style: {
-      top: '14%',
-      right: '14%',
-      transform: 'scale(1) translate(50%, -50%)',
-      transformOrigin: '100% 0%',
-      [`&.${_badgeClasses.default.invisible}`]: {
-        transform: 'scale(0) translate(50%, -50%)'
-      }
-    }
-  }, {
-    props: ({
-      ownerState
-    }) => ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'circular',
-    style: {
-      bottom: '14%',
-      right: '14%',
-      transform: 'scale(1) translate(50%, 50%)',
-      transformOrigin: '100% 100%',
-      [`&.${_badgeClasses.default.invisible}`]: {
-        transform: 'scale(0) translate(50%, 50%)'
-      }
-    }
-  }, {
-    props: ({
-      ownerState
-    }) => ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'circular',
-    style: {
-      top: '14%',
-      left: '14%',
-      transform: 'scale(1) translate(-50%, -50%)',
-      transformOrigin: '0% 0%',
-      [`&.${_badgeClasses.default.invisible}`]: {
-        transform: 'scale(0) translate(-50%, -50%)'
-      }
-    }
-  }, {
-    props: ({
-      ownerState
-    }) => ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'circular',
-    style: {
-      bottom: '14%',
-      left: '14%',
-      transform: 'scale(1) translate(-50%, 50%)',
-      transformOrigin: '0% 100%',
-      [`&.${_badgeClasses.default.invisible}`]: {
-        transform: 'scale(0) translate(-50%, 50%)'
-      }
-    }
   }, {
     props: {
       invisible: true
@@ -214,6 +110,29 @@ const BadgeBadge = (0, _zeroStyled.styled)('span', {
         duration: theme.transitions.duration.leavingScreen
       })
     }
+  }, {
+    style: ({
+      ownerState
+    }) => {
+      const {
+        vertical,
+        horizontal
+      } = ownerState.anchorOrigin;
+      const offset = ownerState.overlap === 'circular' ? '14%' : 0;
+      return {
+        '--Badge-translateX': horizontal === 'right' ? '50%' : '-50%',
+        '--Badge-translateY': vertical === 'top' ? '-50%' : '50%',
+        top: vertical === 'top' ? offset : 'initial',
+        bottom: vertical === 'bottom' ? offset : 'initial',
+        right: horizontal === 'right' ? offset : 'initial',
+        left: horizontal === 'left' ? offset : 'initial',
+        transform: 'scale(1) translate(var(--Badge-translateX), var(--Badge-translateY))',
+        transformOrigin: `${horizontal === 'right' ? '100%' : '0%'} ${vertical === 'top' ? '0%' : '100%'}`,
+        [`&.${_badgeClasses.default.invisible}`]: {
+          transform: 'scale(0) translate(var(--Badge-translateX), var(--Badge-translateY))'
+        }
+      };
+    }
   }]
 })));
 function getAnchorOrigin(anchorOrigin) {

package/ButtonGroup/ButtonGroup.js

@@ -76,7 +76,13 @@ const ButtonGroupRoot = (0, _zeroStyled.styled)('div', {
       variant: 'contained'
     },
     style: {
-      boxShadow: (theme.vars || theme).shadows[2]
+      boxShadow: (theme.vars || theme).shadows[2],
+      [`& .${_buttonGroupClasses.default.grouped}`]: {
+        boxShadow: 'none',
+        '&:hover': {
+          boxShadow: 'none'
+        }
+      }
     }
   }, {
     props: {
@@ -227,16 +233,7 @@ const ButtonGroupRoot = (0, _zeroStyled.styled)('div', {
     }
   }))],
   [`& .${_buttonGroupClasses.default.grouped}`]: {
-    minWidth: 40,
-    boxShadow: 'none',
-    props: {
-      variant: 'contained'
-    },
-    style: {
-      '&:hover': {
-        boxShadow: 'none'
-      }
-    }
+    minWidth: 40
   }
 })));
 const ButtonGroup = /*#__PURE__*/React.forwardRef(function ButtonGroup(inProps, ref) {

package/CHANGELOG.md

@@ -1,5 +1,123 @@
 # [Versions](https://mui.com/versions/)
 
+## 7.3.8
+
+<!-- generated comparing v7.3.7..master -->
+
+_Feb 12, 2026_
+
+A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨:
+
+### `@mui/material@7.3.8`
+
+- [alert] Revert removing default icon mapping fallback (#47629) @ZeeshanTamboli
+- [app-bar] Fix optional chaining in joinVars function (#47739) @sai6855
+- [autocomplete] Fix scroll position resetting on reopen with `disableCloseOnSelect` (#47248) @ZeeshanTamboli
+- [autocomplete] Pass fullWidth prop to input, with default as true (#47663) @silviuaavram
+- [badge] Refactor variant styles generation (#47742) @sai6855
+- [chip] Remove unnecessary `onDelete` check (#47753) @ZeeshanTamboli
+- [switch][checkbox][radio] Remove `aria-disabled` from root span (#46318) @KirankumarAmbati
+- [collapse] Remove unnecessary string concatenation (#47745) @sai6855
+- [drawer] `persistent` and `permanent` variant Drawers should not override the styles via theme using `modal` class (#47581) @ZeeshanTamboli
+- [tabs] Add ability to extend Tabs variant (#47590) @aditya1906
+- [useAutocomplete] Add aria-multiselectable to listbox props when multiple is true (#47632) @silviuaavram
+- [useAutocomplete] Use `React.Key` instead of `any` for `key` prop (#47619) @sonixx02
+
+#### Core
+
+- Revert "[docs-infra] Add Cookie Banner and Analytics Provider (#47445)" (868d23e) @dav-is
+- Revert "[docs-infra] Update Cookie Consent Dialog styling and content (#47718)" (ae29d03) @dav-is
+- [api-docs-builder] Validate slots prop and Slots interface export consistency (#47623) @Janpot
+- [code-infra] Remove `window.muiDocConfig` (#47737) @Janpot
+- [code-infra] Fix flaky Select test on Webkit (#47728) @Janpot
+- [code-infra] Remove usage of NODE_ENV=test (#47692) @Janpot
+- [code-infra] Prepare eslint rule rename (#47702) @Janpot
+- [code-infra] Next.js 15.5.11 (security update) (#47697) @Janpot
+- [code-infra] Fix Tooltip tests flakyness (#47669) @Janpot
+- [code-infra] Improve instructions for error messages (#47668) @Janpot
+- [code-infra] Add initial agent instructions (#47655) @Janpot
+- [code-infra] Update broken links checker (#47633) @Janpot
+- [code-infra] Improve Tooltip leaveDelay test (#47624) @Janpot
+- [code-infra] Fix internal broken links (#47607) @Janpot
+- [docs-infra] Resolve a few 301s in our docs (#47746) @Janpot
+- [docs-infra] Update Cookie Consent Dialog styling and content (#47718) @dav-is
+- [docs-infra] Add Cookie Banner and Analytics Provider (#47445) @dav-is
+- [docs-infra] Make sure /customers page has a h1 (#47615) @Janpot
+- [docs-infra] Fix privacy link (#47614) @Janpot
+- [docs-infra] Resolve a few 301s (#47579) @Janpot
+- [internal] Remove unused sponsor files (#47741) @oliviertassinari
+- [markdown] Fix some broken hash links (#47609) @Janpot
+- [test] Cleanup Table tests TODOs (#47656) @Ocheretovich
+
+### Docs
+
+- [website] unclickable banner in the pricing page (#47634) @aemartos
+- [blog] Company Update: What we've been working on (and why) (#47626) @alelthomas
+- [docs] Remove outdated notifications (#47743) @bernardobelchior
+- [docs] Make Demo component product-agnostic (#47635) @Janpot
+- [docs] Copyedit the Number Field doc (#47469) @mapache-salvaje
+- [docs] Fix Roboto font not loading in iframe demos (#47660) @Janpot
+- [docs] Replace Checkbox with Icons in Combobox examples (#47654) @silviuaavram
+- [docs] Fix punctuation in TypeScript guide description (#47617) @nodirbekprogrammer
+
+All contributors of this release in alphabetical order: @aditya1906, @aemartos, @alelthomas, @bernardobelchior, @dav-is, @Janpot, @KirankumarAmbati, @mapache-salvaje, @nodirbekprogrammer, @Ocheretovich, @oliviertassinari, @sai6855, @silviuaavram, @sonixx02, @ZeeshanTamboli
+
+## 7.3.7
+
+<!-- generated comparing v7.3.6..master -->
+
+_Jan 8, 2026_
+
+A big thanks to the 16 contributors who made this release possible.
+
+### `@mui/material@7.3.7`
+
+- [accordion] Remove unnecessary handling of `square` prop on Accordion Root (#47457) @ZeeshanTamboli
+- [alert] Remove unnecessary default icon mapping fallback (#47460) @ZeeshanTamboli
+- [appbar] Fix inherit color CSS variable not getting applied (#47518) @ZeeshanTamboli
+- [autocomplete] Fix `ArrowLeft`, `Backspace` & `Delete` behavior for multiple and single-value rendering with proper caret handling (#47411) @jnbain
+- [backdrop] Remove unnecessary passing of `classes` from root slot (#47519) @ZeeshanTamboli
+- [button-group] Fix styles when variant is `contained` (#47499) @ZeeshanTamboli
+- [card-action-area] Remove incorrect root ref being forwarded to focus highlight component (#47523) @ZeeshanTamboli
+- [checkbox] Fix readonly checkboxes (#47503) @mj12albert
+- [click-away-listener] Tighten the parameter type of createHandleSynthetic method (#47525) @ZeeshanTamboli
+- [dialog] Fix backdrop theme style overrides (#47544) @ZeeshanTamboli
+- [focus-trap] Compute `activeElement` inside `loopFocus` on every keydown (#47566) @ZeeshanTamboli
+- [modal] Take non-integer padding-right into consideration when scroll locking (#47420) @Zache
+- [select] Fix dropdown width does not match trigger width on window resize (#47526) @AarishMansur
+- [tabs] Fix passing incorrect slot name props (scrollButton → scrollButtons) (#47215) @rithik56
+
+### Docs
+
+- [card] Fix key warning (#47524) @ZeeshanTamboli
+- [dialog] Replace TranstionProps with slotProps.transition (#47569) @sai6855
+- [number-field] Use stable Base UI package (#47504) @siriwatknp
+- [snackbar] Replace TransitionComponent with slots.transition (#47570) @sai6855
+- Fix incorrect indentation in migration guide (#47571) @sai6855
+- Enable MUI chat on Material UI demos (#46837) @siriwatknp
+- Add docs and website banner for Dev survey'25 (#47521) @prakhargupta1
+- Update Tailwind CSS v4 + Next.js Pages Router docs (#47546) @atharva3333
+- Add warning callout to Sync plugin doc (#47511) @mapache-salvaje
+- Update typo in TailwindCSS v4 integration with Next.js docs (#47512) @TimKraemer
+- Fix link to contributing guide (#47473) @oliviertassinari
+- Improve description of Accordion props (#47459) @ZeeshanTamboli
+
+### Core
+
+- [blog] Whats new since MUI X v8 [DX-51] (#47140) @joserodolfofreitas
+- [code-infra] Fix React@next CI job (#47493) @Janpot
+- [code-infra] Move font loading to @mui/docs (#47385) @Janpot
+- [code-infra] Fix CI for React 18 (#47560) @Janpot
+- [code-infra] Prevent legacy browsers tests from updating (#47496) @Janpot
+- [code-infra] Move `@mui/internal-test-utils` to code infra repo (#47422) @Janpot
+- [code-infra] Fix React@next CI job (#47493) @Janpot
+- [examples] Update Next.js versions to v16 in Next.js examples (DX-57) (#47453) @alelthomas
+- [internal] Bump Next.js & React version to avoid security vulnerability (#47427) @oliviertassinari
+- [test] Use plain playwright for e2e (#47410) @mj12albert
+- [test] Fix react-18 tests (#47407) @Janpot
+
+All contributors of this release in alphabetical order: @AarishMansur, @alelthomas, @atharva3333, @bricefrisco, @Janpot, @jnbain, @joserodolfofreitas, @mapache-salvaje, @mj12albert, @oliviertassinari, @prakhargupta1, @rithik56, @siriwatknp, @TimKraemer, @Zache, @ZeeshanTamboli
+
 ## 7.3.6
 
 <!-- generated comparing v7.3.5..master -->
@@ -753,7 +871,7 @@ A big thanks to the 7 contributors who made this release possible.
 - Fix `Grid`, `GridLegacy`, `Stack`, `Badge`, `Select`, `Autocomplete` demos CSS variables (#45693) @DiegoAndai
 - Add "Material UI v7 is here" to the notifications (#45694) @DiegoAndai
 - Fix `Breadcrumbs`, `List`, `Divider`, and `Typography` dark mode demos (#45692) @siriwatknp
-- Fix Material Icons page in dark mode (#45691) @mnajdova
+- Fix Material Icons page in dark mode (#45691) @mnajdova
 
 All contributors of this release in alphabetical order: @aarongarciah, @DiegoAndai, @eduter, @Janpot, @micttyoid, @mnajdova, @siriwatknp
 

package/CardActionArea/CardActionArea.js

@@ -106,7 +106,6 @@ const CardActionArea = /*#__PURE__*/React.forwardRef(function CardActionArea(inP
     elementType: CardActionAreaFocusHighlight,
     externalForwardedProps,
     ownerState,
-    ref,
     className: classes.focusHighlight
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(RootSlot, {

package/Chip/Chip.js

@@ -388,9 +388,7 @@ const Chip = /*#__PURE__*/React.forwardRef(function Chip(inProps, ref) {
   const handleDeleteIconClick = event => {
     // Stop the event from bubbling up to the `Chip`
     event.stopPropagation();
-    if (onDelete) {
-      onDelete(event);
-    }
+    onDelete(event);
   };
   const handleKeyDown = event => {
     // Ignore events from children of `Chip`.

package/Collapse/Collapse.js

@@ -29,11 +29,11 @@ const useUtilityClasses = ownerState => {
     classes
   } = ownerState;
   const slots = {
-    root: ['root', `${orientation}`],
+    root: ['root', orientation],
     entered: ['entered'],
     hidden: ['hidden'],
-    wrapper: ['wrapper', `${orientation}`],
-    wrapperInner: ['wrapperInner', `${orientation}`]
+    wrapper: ['wrapper', orientation],
+    wrapperInner: ['wrapperInner', orientation]
   };
   return (0, _composeClasses.default)(slots, _collapseClasses.getCollapseUtilityClass, classes);
 };

package/Dialog/Dialog.js

@@ -26,8 +26,7 @@ var _useSlot = _interopRequireDefault(require("../utils/useSlot"));
 var _jsxRuntime = require("react/jsx-runtime");
 const DialogBackdrop = (0, _zeroStyled.styled)(_Backdrop.default, {
   name: 'MuiDialog',
-  slot: 'Backdrop',
-  overrides: (props, styles) => styles.backdrop
+  slot: 'Backdrop'
 })({
   // Improve scrollable dialog support.
   zIndex: -1
@@ -42,6 +41,7 @@ const useUtilityClasses = ownerState => {
   } = ownerState;
   const slots = {
     root: ['root'],
+    backdrop: ['backdrop'],
     container: ['container', `scroll${(0, _capitalize.default)(scroll)}`],
     paper: ['paper', `paperScroll${(0, _capitalize.default)(scroll)}`, `paperWidth${(0, _capitalize.default)(String(maxWidth))}`, fullWidth && 'paperFullWidth', fullScreen && 'paperFullScreen']
   };
@@ -292,7 +292,8 @@ const Dialog = /*#__PURE__*/React.forwardRef(function Dialog(inProps, ref) {
     elementType: DialogBackdrop,
     shouldForwardComponentProp: true,
     externalForwardedProps,
-    ownerState
+    ownerState,
+    className: classes.backdrop
   });
   const [PaperSlot, paperSlotProps] = (0, _useSlot.default)('paper', {
     elementType: DialogPaper,

package/Dialog/dialogClasses.d.ts

@@ -1,6 +1,8 @@
 export interface DialogClasses {
   /** Styles applied to the root element. */
   root: string;
+  /** Styles applied to the backdrop element. */
+  backdrop: string;
   /** Styles applied to the container element if `scroll="paper"`. */
   scrollPaper: string;
   /** Styles applied to the container element if `scroll="body"`. */

package/Dialog/dialogClasses.js

@@ -11,5 +11,5 @@ var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateU
 function getDialogUtilityClass(slot) {
   return (0, _generateUtilityClass.default)('MuiDialog', slot);
 }
-const dialogClasses = (0, _generateUtilityClasses.default)('MuiDialog', ['root', 'scrollPaper', 'scrollBody', 'container', 'paper', 'paperScrollPaper', 'paperScrollBody', 'paperWidthFalse', 'paperWidthXs', 'paperWidthSm', 'paperWidthMd', 'paperWidthLg', 'paperWidthXl', 'paperFullWidth', 'paperFullScreen']);
+const dialogClasses = (0, _generateUtilityClasses.default)('MuiDialog', ['root', 'backdrop', 'scrollPaper', 'scrollBody', 'container', 'paper', 'paperScrollPaper', 'paperScrollBody', 'paperWidthFalse', 'paperWidthXs', 'paperWidthSm', 'paperWidthMd', 'paperWidthLg', 'paperWidthXl', 'paperFullWidth', 'paperFullScreen']);
 var _default = exports.default = dialogClasses;

package/Drawer/Drawer.js

@@ -31,7 +31,7 @@ const overridesResolver = (props, styles) => {
   const {
     ownerState
   } = props;
-  return [styles.root, (ownerState.variant === 'permanent' || ownerState.variant === 'persistent') && styles.docked, styles.modal];
+  return [styles.root, (ownerState.variant === 'permanent' || ownerState.variant === 'persistent') && styles.docked, ownerState.variant === 'temporary' && styles.modal];
 };
 const useUtilityClasses = ownerState => {
   const {

package/GridLegacy/GridLegacy.js

@@ -38,7 +38,7 @@ var _gridLegacyClasses = _interopRequireWildcard(require("./gridLegacyClasses"))
 var _jsxRuntime = require("react/jsx-runtime");
 let warnedOnce = false;
 function warnAboutDeprecatedGridLegacy() {
-  if (!warnedOnce && process.env.NODE_ENV === 'development') {
+  if (!warnedOnce && process.env.NODE_ENV !== 'production') {
     warnedOnce = true;
     console.warn('MUI: The GridLegacy component is deprecated. See https://mui.com/material-ui/migration/upgrade-to-grid-v2/ for migration instructions.\n');
   }

package/Modal/ModalManager.js

@@ -25,7 +25,7 @@ function ariaHidden(element, hide) {
   }
 }
 function getPaddingRight(element) {
-  return parseInt((0, _ownerWindow.default)(element).getComputedStyle(element).paddingRight, 10) || 0;
+  return parseFloat((0, _ownerWindow.default)(element).getComputedStyle(element).paddingRight) || 0;
 }
 function isAriaHiddenForbiddenOnElement(element) {
   // The forbidden HTML tags are the ones from ARIA specification that

package/Popover/Popover.js

@@ -157,7 +157,7 @@ const Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
     const anchorRect = anchorElement.getBoundingClientRect();
     if (process.env.NODE_ENV !== 'production') {
       const box = anchorElement.getBoundingClientRect();
-      if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
+      if (!globalThis.MUI_TEST_ENV && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
         console.warn(['MUI: The `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', "Make sure the element is present in the document or that it's not display none."].join('\n'));
       }
     }
@@ -408,7 +408,7 @@ process.env.NODE_ENV !== "production" ? Popover.propTypes /* remove-proptypes */
       const resolvedAnchorEl = resolveAnchorEl(props.anchorEl);
       if (resolvedAnchorEl && resolvedAnchorEl.nodeType === 1) {
         const box = resolvedAnchorEl.getBoundingClientRect();
-        if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
+        if (process.env.NODE_ENV !== 'production' && !globalThis.MUI_TEST_ENV && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
           return new Error(['MUI: The `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', "Make sure the element is present in the document or that it's not display none."].join('\n'));
         }
       } else {

package/Popper/BasePopper.js

@@ -112,7 +112,7 @@ const PopperTooltip = /*#__PURE__*/React.forwardRef(function PopperTooltip(props
     if (process.env.NODE_ENV !== 'production') {
       if (resolvedAnchorElement && isHTMLElement(resolvedAnchorElement) && resolvedAnchorElement.nodeType === 1) {
         const box = resolvedAnchorElement.getBoundingClientRect();
-        if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
+        if (!globalThis.MUI_TEST_ENV && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
           console.warn(['MUI: The `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', "Make sure the element is present in the document or that it's not display none."].join('\n'));
         }
       }
@@ -274,7 +274,7 @@ process.env.NODE_ENV !== "production" ? Popper.propTypes /* remove-proptypes */
       const resolvedAnchorEl = resolveAnchorEl(props.anchorEl);
       if (resolvedAnchorEl && isHTMLElement(resolvedAnchorEl) && resolvedAnchorEl.nodeType === 1) {
         const box = resolvedAnchorEl.getBoundingClientRect();
-        if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
+        if (process.env.NODE_ENV !== 'production' && !globalThis.MUI_TEST_ENV && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
           return new Error(['MUI: The `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', "Make sure the element is present in the document or that it's not display none."].join('\n'));
         }
       } else if (!resolvedAnchorEl || typeof resolvedAnchorEl.getBoundingClientRect !== 'function' || isVirtualElement(resolvedAnchorEl) && resolvedAnchorEl.contextElement != null && resolvedAnchorEl.contextElement.nodeType !== 1) {

package/README.md

@@ -33,7 +33,7 @@ Our documentation features [a collection of example projects using Material UI]
 
 ## Contributing
 
-Read the [contributing guide](/CONTRIBUTING.md) to learn about our development process, how to propose bug fixes and improvements, and how to build and test your changes.
+Read the [contributing guide](../../CONTRIBUTING.md) to learn about our development process, how to propose bug fixes and improvements, and how to build and test your changes.
 
 Contributing to Material UI is about more than just issues and pull requests!
 There are many other ways to [support Material UI](https://mui.com/material-ui/getting-started/faq/#mui-is-awesome-how-can-i-support-the-project) beyond contributing to the code base.
@@ -49,7 +49,7 @@ Future plans and high-priority features and enhancements can be found in the [ro
 ## License
 
 This project is licensed under the terms of the
-[MIT license](/LICENSE).
+[MIT license](../../LICENSE).
 
 ## Security
 

package/Select/SelectInput.js

@@ -184,6 +184,22 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     node: inputRef.current,
     value
   }), [value]);
+  const open = displayNode !== null && openState;
+  React.useEffect(() => {
+    if (!open || !anchorElement || autoWidth) {
+      return undefined;
+    }
+    if (typeof ResizeObserver === 'undefined') {
+      return undefined;
+    }
+    const observer = new ResizeObserver(() => {
+      setMenuMinWidthState(anchorElement.clientWidth);
+    });
+    observer.observe(anchorElement);
+    return () => {
+      observer.disconnect();
+    };
+  }, [open, anchorElement, autoWidth]);
 
   // Resize menu on `defaultOpen` automatic toggle.
   React.useEffect(() => {
@@ -219,8 +235,8 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     }
     return undefined;
   }, [labelId]);
-  const update = (open, event) => {
-    if (open) {
+  const update = (openParam, event) => {
+    if (openParam) {
       if (onOpen) {
         onOpen(event);
       }
@@ -229,7 +245,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     }
     if (!isOpenControlled) {
       setMenuMinWidthState(autoWidth ? null : anchorElement.clientWidth);
-      setOpenState(open);
+      setOpenState(openParam);
     }
   };
   const handleMouseDown = event => {
@@ -316,7 +332,6 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       onKeyDown?.(event);
     }
   };
-  const open = displayNode !== null && openState;
   const handleBlur = event => {
     // if open event.stopImmediatePropagation
     if (!open && onBlur) {