@mui/material 6.1.2 → 6.1.3

package/Badge/Badge.d.ts

@@ -29,8 +29,8 @@ export type BadgeOwnerState = Simplify<
 >;
 
 export interface BadgeOrigin {
-  vertical: 'top' | 'bottom';
-  horizontal: 'left' | 'right';
+  vertical?: 'top' | 'bottom';
+  horizontal?: 'left' | 'right';
 }
 
 export interface BadgeOwnProps {

package/Badge/Badge.js

@@ -210,16 +210,19 @@ const BadgeBadge = styled('span', {
     }
   }]
 })));
+function getAnchorOrigin(anchorOrigin) {
+  return {
+    vertical: anchorOrigin?.vertical ?? 'top',
+    horizontal: anchorOrigin?.horizontal ?? 'right'
+  };
+}
 const Badge = /*#__PURE__*/React.forwardRef(function Badge(inProps, ref) {
   const props = useDefaultProps({
     props: inProps,
     name: 'MuiBadge'
   });
   const {
-    anchorOrigin: anchorOriginProp = {
-      vertical: 'top',
-      horizontal: 'right'
-    },
+    anchorOrigin: anchorOriginProp,
     className,
     classes: classesProp,
     component,
@@ -249,7 +252,7 @@ const Badge = /*#__PURE__*/React.forwardRef(function Badge(inProps, ref) {
     showZero
   });
   const prevProps = usePreviousProps({
-    anchorOrigin: anchorOriginProp,
+    anchorOrigin: getAnchorOrigin(anchorOriginProp),
     color: colorProp,
     overlap: overlapProp,
     variant: variantProp,
@@ -259,9 +262,10 @@ const Badge = /*#__PURE__*/React.forwardRef(function Badge(inProps, ref) {
   const {
     color = colorProp,
     overlap = overlapProp,
-    anchorOrigin = anchorOriginProp,
+    anchorOrigin: anchorOriginPropProp,
     variant = variantProp
   } = invisible ? prevProps : props;
+  const anchorOrigin = getAnchorOrigin(anchorOriginPropProp);
   const displayValue = variant !== 'dot' ? displayValueFromHook : undefined;
   const ownerState = {
     ...props,
@@ -320,8 +324,8 @@ process.env.NODE_ENV !== "production" ? Badge.propTypes /* remove-proptypes */ =
    * }
    */
   anchorOrigin: PropTypes.shape({
-    horizontal: PropTypes.oneOf(['left', 'right']).isRequired,
-    vertical: PropTypes.oneOf(['bottom', 'top']).isRequired
+    horizontal: PropTypes.oneOf(['left', 'right']),
+    vertical: PropTypes.oneOf(['bottom', 'top'])
   }),
   /**
    * The content rendered within the badge.

package/CHANGELOG.md

@@ -1,5 +1,82 @@
 # [Versions](https://mui.com/versions/)
 
+## v6.1.3
+
+<!-- generated comparing v6.1.2..master -->
+
+_Oct 9, 2024_
+
+A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨:
+
+- 🚀 Improved performance on styled components by pre-serializing and caching the styles (#43412) @romgrk
+
+### `@mui/material@6.1.3`
+
+- &#8203;<!-- 18 -->Change React.ReactElement<any> to React.ReactElement<unknown> (#43402) @sai6855
+- &#8203;<!-- 42 -->[Badge] Make keys in anchor origin partial (#43950) @sai6855
+- &#8203;<!-- 22 -->[Grid2] Fix column spacing for nested containers (#43733) @Janpot
+- &#8203;<!-- 21 -->[Grid2] Remove required `item` prop for `size` prop (#44027) @Janpot
+- &#8203;<!-- 20 -->[Grid2] Add compatible props warning (#43801) @k-rajat19
+- &#8203;<!-- 17 -->[Modal] Fix comment location (#44026) @oliviertassinari
+- &#8203;<!-- 16 -->[OutlinedInput] Resolve border color issue on mobile (#43797) (#43879) @wojtek35
+
+### `@mui/system@6.1.3`
+
+- &#8203;<!-- 15 -->Make createGrid compatible with React 19 types (#44035) @aarongarciah
+- &#8203;<!-- 14 -->Add empty interfaces to fix issue with typescript module augmentation (#43873) @yonatan0
+- &#8203;<!-- 13 -->Pre-serialize & cache styles to improve performance (#43412) @romgrk
+- &#8203;<!-- 09 -->[typescript] `SystemCSSProperties` should not have `SystemStyleObject` as value (#44029) @siriwatknp
+
+### `@mui/utils@6.0.0-beta.11`
+
+- &#8203;<!-- 08 -->[utils] Make getReactElementRef React 19 compatible (#44034) @aarongarciah
+
+### `@mui/lab@6.1.3`
+
+- &#8203;<!-- 20 -->[lab][Timeline] Fix types for React 19 (#44043) @aarongarciah
+
+### Docs
+
+- &#8203;<!-- 35 -->Update docs-infra role (#44032) @mnajdova
+- &#8203;<!-- 34 -->Update Material Symbols plan to reflect Google development (#44000) @oliviertassinari
+- &#8203;<!-- 33 -->Fix 301 redirections in docs @oliviertassinari
+- &#8203;<!-- 32 -->Fix indentation @oliviertassinari
+- &#8203;<!-- 31 -->Fix Live edit copies (#43835) @oliviertassinari
+- &#8203;<!-- 30 -->Virtualize icons svg (#43939) @Janpot
+- &#8203;<!-- 28 -->[Grid] Fix Grid2 gap description (#43967) @aarongarciah
+- &#8203;<!-- 27 -->[icons] Index search synchronously (#44001) @oliviertassinari
+- &#8203;<!-- 26 -->[material-ui] Incorrect React useState Example on Toggle Button (#43987) @barrownicholas
+- &#8203;<!-- 25 -->[material-ui] Add theme setting for pigment-css migration (#43993) @effektsvk
+- &#8203;<!-- 24 -->[material-ui] Fix incorrect `slotProp` name in the `TextField` deprecation note. (#43985) @Chee7ah
+- &#8203;<!-- 23 -->[examples] Use CSS Variables (#43856) @Juneezee
+- &#8203;<!-- 29 -->[material-ui] Improved documentation for indeterminateIcon prop (#43791) @marctaylor01
+
+### Core
+
+- &#8203;<!-- 37 -->Fix typo in useLocalStorageState (#44024) @hieunguyenduc696
+- &#8203;<!-- 36 -->Amend changelog (#43968) @aarongarciah
+- &#8203;<!-- 41 -->Remove `@mui/styled-engine-sc` dev dependency from `@mui/styled-engine-sc` (#44050) @Janpot
+- &#8203;<!-- 43 -->[docs-infra] Add pointer cursor on hover for logo to improve UX (#43999) @Asin-Junior-Honore
+- &#8203;<!-- 41 -->[blog] Migrate some .gif to <video> (#43945) @oliviertassinari
+- &#8203;<!-- 40 -->[code-infra] Align `next` dependency specifier across project (#44036) @Janpot
+- &#8203;<!-- 39 -->[code-infra] Move MuiError babel macro to babel plugin (#43904) @Janpot
+- &#8203;<!-- 38 -->[code-infra] Forbid calling `Error` without `new` (#43963) @Janpot
+- &#8203;<!-- 29 -->[docs-infra] Fix link in header regression (#43834) @oliviertassinari
+- &#8203;<!-- 19 -->[infra] Fix line break in Stack Overflow message @oliviertassinari
+- &#8203;<!-- 12 -->[test] Add missing async (#44028) @oliviertassinari
+- &#8203;<!-- 11 -->[test] Fix Escape event firing event (#43961) @oliviertassinari
+- &#8203;<!-- 10 -->[test] Fix flaky pigment-css screenshot (#43959) @Janpot
+- &#8203;<!-- 07 -->[website] Add missing \_redirects HTTP status @oliviertassinari
+- &#8203;<!-- 06 -->[website] Fix sponsor image height @oliviertassinari
+- &#8203;<!-- 05 -->[website] Remove srcset, does nothing in README @oliviertassinari
+- &#8203;<!-- 04 -->[website] Polish display of sponsors @oliviertassinari
+- &#8203;<!-- 03 -->[website] Standardize utm tags @oliviertassinari
+- &#8203;<!-- 02 -->[website] Improve utm_source strategy @oliviertassinari
+- &#8203;<!-- 01 -->[website] Clarify min-level docs-infra @oliviertassinari
+- &#8203;<!-- 08 -->[website] Update backlink sponsors (#43995) @rluzists1
+
+All contributors of this release in alphabetical order: @aarongarciah, @Asin-Junior-Honore, @barrownicholas, @Chee7ah, @effektsvk, @hieunguyenduc696, @Janpot, @Juneezee, @k-rajat19, @mnajdova, @oliviertassinari, @romgrk, @sai6855, @siriwatknp, @wojtek35, @yonatan0
+
 ## v6.1.2
 
 <!-- generated comparing v6.1.1..master -->
@@ -10,16 +87,12 @@ A big thanks to the 13 contributors who made this release possible.
 
 ### `@mui/material@6.1.2`
 
-- [Modal] Remove unnecessary `manager` prop handling (#43867) @ZeeshanTamboli
 - [Autocomplete] Fix listbox opens and closes on click when used with `limitTags` (#42494) @appleSimple
 - [Button] Ignore `dark` and `contrastText` if not provided in the theme (#43861) @siriwatknp
 - [Button] Fix regression for color `inherit` (#43862) @siriwatknp
 - [LinearProgress] Fix background color (#43949) @sai6855
 - Support CSS variables with shadow DOM (#43948) @siriwatknp
-- Improve getReactElementRef() utils (#43022) @sai6855
-- [Modal] Replace `show` parameter name with `hide` in modal manager (#43868) @ZeeshanTamboli
 - [Rating] Use Rating `name` as prefix of input element ids (#43829) @yash49
-- [Drawer] Refactor getScrollbarSize usages (#43828) @BrianWoolfolk
 - [Drawer] Fix issue with main window being used instead of iframe's window (#43818) @albarv340
 - [ThemeProvider] Support setting default mode (#43951) @siriwatknp
 
@@ -56,9 +129,10 @@ A big thanks to the 13 contributors who made this release possible.
 - [icons] Reduce Material Icon page size (#43911) @oliviertassinari
 - [test] Point Istanbul to correct URL (#43935) @sai6855
 - [test] Sync React.version parse logic with codebase (#43820) @oliviertassinari
-- [website] Add 'Row spanning' (#43831) @oliviertassinari
-- [website] Improve Next roles section (#43822) @oliviertassinari
-- [website] Open the xCharts, eXplore and X general react engineer roles (#43805) @DanailH
+- Improve getReactElementRef() utils (#43022) @sai6855
+- [Drawer] Refactor getScrollbarSize usages (#43828) @BrianWoolfolk
+- [Modal] Replace `show` parameter name with `hide` in modal manager (#43868) @ZeeshanTamboli
+- [Modal] Remove unnecessary `manager` prop handling (#43867) @ZeeshanTamboli
 
 All contributors of this release in alphabetical order: @albarv340, @appleSimple, @BrianWoolfolk, @DanailH, @Janpot, @kdichev, @oliviertassinari, @sai6855, @samuelsycamore, @siriwatknp, @wilhelmlofsten, @yash49, @ZeeshanTamboli
 

package/Grid2/Grid2.d.ts

@@ -43,24 +43,29 @@ export interface GridBaseProps {
     offset?: ResponsiveStyleValue<GridOffset>;
     /**
      * @internal
-     * The level of the grid starts from `0`
-     * and increases when the grid nests inside another grid regardless of container or item.
+     * The level of the grid starts from `0` and increases when the grid nests
+     * inside another grid. Nesting is defined as a container Grid being a direct
+     * child of a container Grid.
      *
      * ```js
-     * <Grid> // level 0
-     *   <Grid> // level 1
-     *     <Grid> // level 2
-     *   <Grid> // level 1
+     * <Grid container> // level 0
+     *   <Grid container> // level 1
+     *     <Grid container> // level 2
      * ```
      *
-     * Only consecutive grid is considered nesting.
-     * A grid container will start at `0` if there are non-Grid element above it.
+     * Only consecutive grid is considered nesting. A grid container will start at
+     * `0` if there are non-Grid container element above it.
      *
      * ```js
-     * <Grid> // level 0
+     * <Grid container> // level 0
      *   <div>
-     *     <Grid> // level 0
-     *       <Grid> // level 1
+     *     <Grid container> // level 0
+     * ```
+     *
+     * ```js
+     * <Grid container> // level 0
+     *   <Grid>
+     *     <Grid container> // level 0
      * ```
      */
     unstable_level?: number;

package/Grid2/Grid2.js

@@ -2,6 +2,7 @@
 
 import PropTypes from 'prop-types';
 import { createGrid as createGrid2 } from '@mui/system/Grid';
+import requirePropFactory from "../utils/requirePropFactory.js";
 import { styled, useThemeProps } from "../styles/index.js";
 /**
  *
@@ -81,24 +82,29 @@ process.env.NODE_ENV !== "production" ? Grid2.propTypes /* remove-proptypes */ =
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   /**
    * @internal
-   * The level of the grid starts from `0`
-   * and increases when the grid nests inside another grid regardless of container or item.
+   * The level of the grid starts from `0` and increases when the grid nests
+   * inside another grid. Nesting is defined as a container Grid being a direct
+   * child of a container Grid.
    *
    * ```js
-   * <Grid> // level 0
-   *   <Grid> // level 1
-   *     <Grid> // level 2
-   *   <Grid> // level 1
+   * <Grid container> // level 0
+   *   <Grid container> // level 1
+   *     <Grid container> // level 2
    * ```
    *
-   * Only consecutive grid is considered nesting.
-   * A grid container will start at `0` if there are non-Grid element above it.
+   * Only consecutive grid is considered nesting. A grid container will start at
+   * `0` if there are non-Grid container element above it.
    *
    * ```js
-   * <Grid> // level 0
+   * <Grid container> // level 0
    *   <div>
-   *     <Grid> // level 0
-   *       <Grid> // level 1
+   *     <Grid container> // level 0
+   * ```
+   *
+   * ```js
+   * <Grid container> // level 0
+   *   <Grid>
+   *     <Grid container> // level 0
    * ```
    */
   unstable_level: PropTypes.number,
@@ -109,4 +115,16 @@ process.env.NODE_ENV !== "production" ? Grid2.propTypes /* remove-proptypes */ =
    */
   wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap'])
 } : void 0;
+if (process.env.NODE_ENV !== 'production') {
+  const Component = Grid2;
+  const requireProp = requirePropFactory('Grid2', Component);
+  // eslint-disable-next-line no-useless-concat
+  Component['propTypes' + ''] = {
+    // eslint-disable-next-line react/forbid-foreign-prop-types
+    ...Component.propTypes,
+    direction: requireProp('container'),
+    spacing: requireProp('container'),
+    wrap: requireProp('container')
+  };
+}
 export default Grid2;

package/InputBase/InputBase.js

@@ -372,7 +372,7 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
     if (!isControlled) {
       const element = event.target || inputRef.current;
       if (element == null) {
-        throw new Error(process.env.NODE_ENV !== "production" ? `MUI: Expected valid input target. Did you use a custom \`inputComponent\` and forget to forward refs? See https://mui.com/r/input-component-ref-interface for more info.` : _formatMuiErrorMessage(1));
+        throw new Error(process.env.NODE_ENV !== "production" ? 'MUI: Expected valid input target. ' + 'Did you use a custom `inputComponent` and forget to forward refs? ' + 'See https://mui.com/r/input-component-ref-interface for more info.' : _formatMuiErrorMessage(1));
       }
       checkDirty({
         value: element.value

package/Modal/useModal.js

@@ -143,6 +143,12 @@ function useModal(parameters) {
       ...otherHandlers
     };
     return {
+      /*
+       * Marking an element with the role presentation indicates to assistive technology
+       * that this element should be ignored; it exists to support the web application and
+       * is not meant for humans to interact with directly.
+       * https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-static-element-interactions.md
+       */
       role: 'presentation',
       ...externalEventHandlers,
       onKeyDown: createHandleKeyDown(externalEventHandlers),

package/OutlinedInput/OutlinedInput.js

@@ -46,6 +46,12 @@ const OutlinedInputRoot = styled(InputBaseRoot, {
     [`&:hover .${outlinedInputClasses.notchedOutline}`]: {
       borderColor: (theme.vars || theme).palette.text.primary
     },
+    // Reset on touch devices, it doesn't add specificity
+    '@media (hover: none)': {
+      [`&:hover .${outlinedInputClasses.notchedOutline}`]: {
+        borderColor: theme.vars ? `rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : borderColor
+      }
+    },
     [`&.${outlinedInputClasses.focused} .${outlinedInputClasses.notchedOutline}`]: {
       borderWidth: 2
     },
@@ -62,12 +68,6 @@ const OutlinedInputRoot = styled(InputBaseRoot, {
       props: {},
       // to overide the above style
       style: {
-        // Reset on touch devices, it doesn't add specificity
-        '@media (hover: none)': {
-          [`&:hover .${outlinedInputClasses.notchedOutline}`]: {
-            borderColor: theme.vars ? `rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : borderColor
-          }
-        },
         [`&.${outlinedInputClasses.error} .${outlinedInputClasses.notchedOutline}`]: {
           borderColor: (theme.vars || theme).palette.error.main
         },

package/PigmentGrid/PigmentGrid.d.ts

@@ -40,29 +40,6 @@ export interface GridBaseProps {
      * Defines the offset of the grid.
      */
     offset?: ResponsiveStyleValue<number> | undefined;
-    /**
-     * @internal
-     * The level of the grid starts from `0`
-     * and increases when the grid nests inside another grid regardless of container or item.
-     *
-     * ```js
-     * <Grid> // level 0
-     *   <Grid> // level 1
-     *     <Grid> // level 2
-     *   <Grid> // level 1
-     * ```
-     *
-     * Only consecutive grid is considered nesting.
-     * A grid container will start at `0` if there are non-Grid element above it.
-     *
-     * ```js
-     * <Grid> // level 0
-     *   <div>
-     *     <Grid> // level 0
-     *       <Grid> // level 1
-     * ```
-     */
-    unstable_level?: number;
     /**
      * Defines the vertical space between the type `item` components.
      * It overrides the value of the `spacing` prop.

package/PigmentGrid/PigmentGrid.js

@@ -113,29 +113,6 @@ process.env.NODE_ENV !== "production" ? PigmentGrid.propTypes /* remove-proptype
    * @ignore
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
-  /**
-   * @internal
-   * The level of the grid starts from `0`
-   * and increases when the grid nests inside another grid regardless of container or item.
-   *
-   * ```js
-   * <Grid> // level 0
-   *   <Grid> // level 1
-   *     <Grid> // level 2
-   *   <Grid> // level 1
-   * ```
-   *
-   * Only consecutive grid is considered nesting.
-   * A grid container will start at `0` if there are non-Grid element above it.
-   *
-   * ```js
-   * <Grid> // level 0
-   *   <div>
-   *     <Grid> // level 0
-   *       <Grid> // level 1
-   * ```
-   */
-  unstable_level: PropTypes.number,
   /**
    * Defines the `flex-wrap` style property.
    * It's applied for all screen sizes.

package/Select/SelectInput.js

@@ -347,7 +347,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     let selected;
     if (multiple) {
       if (!Array.isArray(value)) {
-        throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The \`value\` prop must be an array when using the \`Select\` component with \`multiple\`.` : _formatMuiErrorMessage(2));
+        throw new Error(process.env.NODE_ENV !== "production" ? 'MUI: The `value` prop must be an array ' + 'when using the `Select` component with `multiple`.' : _formatMuiErrorMessage(2));
       }
       selected = value.some(v => areEqualValues(v, child.props.value));
       if (selected && computeDisplay) {

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v6.1.2
+ * @mui/material v6.1.3
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/modern/Badge/Badge.js

@@ -210,16 +210,19 @@ const BadgeBadge = styled('span', {
     }
   }]
 })));
+function getAnchorOrigin(anchorOrigin) {
+  return {
+    vertical: anchorOrigin?.vertical ?? 'top',
+    horizontal: anchorOrigin?.horizontal ?? 'right'
+  };
+}
 const Badge = /*#__PURE__*/React.forwardRef(function Badge(inProps, ref) {
   const props = useDefaultProps({
     props: inProps,
     name: 'MuiBadge'
   });
   const {
-    anchorOrigin: anchorOriginProp = {
-      vertical: 'top',
-      horizontal: 'right'
-    },
+    anchorOrigin: anchorOriginProp,
     className,
     classes: classesProp,
     component,
@@ -249,7 +252,7 @@ const Badge = /*#__PURE__*/React.forwardRef(function Badge(inProps, ref) {
     showZero
   });
   const prevProps = usePreviousProps({
-    anchorOrigin: anchorOriginProp,
+    anchorOrigin: getAnchorOrigin(anchorOriginProp),
     color: colorProp,
     overlap: overlapProp,
     variant: variantProp,
@@ -259,9 +262,10 @@ const Badge = /*#__PURE__*/React.forwardRef(function Badge(inProps, ref) {
   const {
     color = colorProp,
     overlap = overlapProp,
-    anchorOrigin = anchorOriginProp,
+    anchorOrigin: anchorOriginPropProp,
     variant = variantProp
   } = invisible ? prevProps : props;
+  const anchorOrigin = getAnchorOrigin(anchorOriginPropProp);
   const displayValue = variant !== 'dot' ? displayValueFromHook : undefined;
   const ownerState = {
     ...props,
@@ -320,8 +324,8 @@ process.env.NODE_ENV !== "production" ? Badge.propTypes /* remove-proptypes */ =
    * }
    */
   anchorOrigin: PropTypes.shape({
-    horizontal: PropTypes.oneOf(['left', 'right']).isRequired,
-    vertical: PropTypes.oneOf(['bottom', 'top']).isRequired
+    horizontal: PropTypes.oneOf(['left', 'right']),
+    vertical: PropTypes.oneOf(['bottom', 'top'])
   }),
   /**
    * The content rendered within the badge.

package/modern/Grid2/Grid2.js

@@ -2,6 +2,7 @@
 
 import PropTypes from 'prop-types';
 import { createGrid as createGrid2 } from '@mui/system/Grid';
+import requirePropFactory from "../utils/requirePropFactory.js";
 import { styled, useThemeProps } from "../styles/index.js";
 /**
  *
@@ -81,24 +82,29 @@ process.env.NODE_ENV !== "production" ? Grid2.propTypes /* remove-proptypes */ =
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   /**
    * @internal
-   * The level of the grid starts from `0`
-   * and increases when the grid nests inside another grid regardless of container or item.
+   * The level of the grid starts from `0` and increases when the grid nests
+   * inside another grid. Nesting is defined as a container Grid being a direct
+   * child of a container Grid.
    *
    * ```js
-   * <Grid> // level 0
-   *   <Grid> // level 1
-   *     <Grid> // level 2
-   *   <Grid> // level 1
+   * <Grid container> // level 0
+   *   <Grid container> // level 1
+   *     <Grid container> // level 2
    * ```
    *
-   * Only consecutive grid is considered nesting.
-   * A grid container will start at `0` if there are non-Grid element above it.
+   * Only consecutive grid is considered nesting. A grid container will start at
+   * `0` if there are non-Grid container element above it.
    *
    * ```js
-   * <Grid> // level 0
+   * <Grid container> // level 0
    *   <div>
-   *     <Grid> // level 0
-   *       <Grid> // level 1
+   *     <Grid container> // level 0
+   * ```
+   *
+   * ```js
+   * <Grid container> // level 0
+   *   <Grid>
+   *     <Grid container> // level 0
    * ```
    */
   unstable_level: PropTypes.number,
@@ -109,4 +115,16 @@ process.env.NODE_ENV !== "production" ? Grid2.propTypes /* remove-proptypes */ =
    */
   wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap'])
 } : void 0;
+if (process.env.NODE_ENV !== 'production') {
+  const Component = Grid2;
+  const requireProp = requirePropFactory('Grid2', Component);
+  // eslint-disable-next-line no-useless-concat
+  Component['propTypes' + ''] = {
+    // eslint-disable-next-line react/forbid-foreign-prop-types
+    ...Component.propTypes,
+    direction: requireProp('container'),
+    spacing: requireProp('container'),
+    wrap: requireProp('container')
+  };
+}
 export default Grid2;

package/modern/InputBase/InputBase.js

@@ -372,7 +372,7 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
     if (!isControlled) {
       const element = event.target || inputRef.current;
       if (element == null) {
-        throw new Error(process.env.NODE_ENV !== "production" ? `MUI: Expected valid input target. Did you use a custom \`inputComponent\` and forget to forward refs? See https://mui.com/r/input-component-ref-interface for more info.` : _formatMuiErrorMessage(1));
+        throw new Error(process.env.NODE_ENV !== "production" ? 'MUI: Expected valid input target. ' + 'Did you use a custom `inputComponent` and forget to forward refs? ' + 'See https://mui.com/r/input-component-ref-interface for more info.' : _formatMuiErrorMessage(1));
       }
       checkDirty({
         value: element.value

package/modern/Modal/useModal.js

@@ -143,6 +143,12 @@ function useModal(parameters) {
       ...otherHandlers
     };
     return {
+      /*
+       * Marking an element with the role presentation indicates to assistive technology
+       * that this element should be ignored; it exists to support the web application and
+       * is not meant for humans to interact with directly.
+       * https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-static-element-interactions.md
+       */
       role: 'presentation',
       ...externalEventHandlers,
       onKeyDown: createHandleKeyDown(externalEventHandlers),

package/modern/OutlinedInput/OutlinedInput.js

@@ -46,6 +46,12 @@ const OutlinedInputRoot = styled(InputBaseRoot, {
     [`&:hover .${outlinedInputClasses.notchedOutline}`]: {
       borderColor: (theme.vars || theme).palette.text.primary
     },
+    // Reset on touch devices, it doesn't add specificity
+    '@media (hover: none)': {
+      [`&:hover .${outlinedInputClasses.notchedOutline}`]: {
+        borderColor: theme.vars ? `rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : borderColor
+      }
+    },
     [`&.${outlinedInputClasses.focused} .${outlinedInputClasses.notchedOutline}`]: {
       borderWidth: 2
     },
@@ -62,12 +68,6 @@ const OutlinedInputRoot = styled(InputBaseRoot, {
       props: {},
       // to overide the above style
       style: {
-        // Reset on touch devices, it doesn't add specificity
-        '@media (hover: none)': {
-          [`&:hover .${outlinedInputClasses.notchedOutline}`]: {
-            borderColor: theme.vars ? `rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : borderColor
-          }
-        },
         [`&.${outlinedInputClasses.error} .${outlinedInputClasses.notchedOutline}`]: {
           borderColor: (theme.vars || theme).palette.error.main
         },

package/modern/PigmentGrid/PigmentGrid.js

@@ -113,29 +113,6 @@ process.env.NODE_ENV !== "production" ? PigmentGrid.propTypes /* remove-proptype
    * @ignore
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
-  /**
-   * @internal
-   * The level of the grid starts from `0`
-   * and increases when the grid nests inside another grid regardless of container or item.
-   *
-   * ```js
-   * <Grid> // level 0
-   *   <Grid> // level 1
-   *     <Grid> // level 2
-   *   <Grid> // level 1
-   * ```
-   *
-   * Only consecutive grid is considered nesting.
-   * A grid container will start at `0` if there are non-Grid element above it.
-   *
-   * ```js
-   * <Grid> // level 0
-   *   <div>
-   *     <Grid> // level 0
-   *       <Grid> // level 1
-   * ```
-   */
-  unstable_level: PropTypes.number,
   /**
    * Defines the `flex-wrap` style property.
    * It's applied for all screen sizes.

package/modern/Select/SelectInput.js

@@ -347,7 +347,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     let selected;
     if (multiple) {
       if (!Array.isArray(value)) {
-        throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The \`value\` prop must be an array when using the \`Select\` component with \`multiple\`.` : _formatMuiErrorMessage(2));
+        throw new Error(process.env.NODE_ENV !== "production" ? 'MUI: The `value` prop must be an array ' + 'when using the `Select` component with `multiple`.' : _formatMuiErrorMessage(2));
       }
       selected = value.some(v => areEqualValues(v, child.props.value));
       if (selected && computeDisplay) {

package/modern/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v6.1.2
+ * @mui/material v6.1.3
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the