@mui/material 5.10.15 → 5.10.16

package/legacy/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.10.15
+/** @license MUI v5.10.16
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/locale/index.d.ts

@@ -1,73 +1,73 @@
-import { ComponentsPropsList } from '../styles/props';
-export interface Localization {
-    components?: {
-        MuiAlert?: {
-            defaultProps: Pick<ComponentsPropsList['MuiAlert'], 'closeText'>;
-        };
-        MuiBreadcrumbs?: {
-            defaultProps: Pick<ComponentsPropsList['MuiBreadcrumbs'], 'expandText'>;
-        };
-        MuiTablePagination?: {
-            defaultProps: Pick<ComponentsPropsList['MuiTablePagination'], 'labelRowsPerPage' | 'labelDisplayedRows' | 'getItemAriaLabel'>;
-        };
-        MuiRating?: {
-            defaultProps: Pick<ComponentsPropsList['MuiRating'], 'emptyLabelText' | 'getLabelText'>;
-        };
-        MuiAutocomplete?: {
-            defaultProps: Pick<ComponentsPropsList['MuiAutocomplete'], 'clearText' | 'closeText' | 'loadingText' | 'noOptionsText' | 'openText'>;
-        };
-        MuiPagination?: {
-            defaultProps: Pick<ComponentsPropsList['MuiPagination'], 'aria-label' | 'getItemAriaLabel'>;
-        };
-    };
-}
-export declare const amET: Localization;
-export declare const arEG: Localization;
-export declare const arSA: Localization;
-export declare const arSD: Localization;
-export declare const azAZ: Localization;
-export declare const bnBD: Localization;
-export declare const bgBG: Localization;
-export declare const caES: Localization;
-export declare const csCZ: Localization;
-export declare const daDK: Localization;
-export declare const deDE: Localization;
-export declare const elGR: Localization;
-export declare const enUS: Localization;
-export declare const esES: Localization;
-export declare const etEE: Localization;
-export declare const faIR: Localization;
-export declare const fiFI: Localization;
-export declare const frFR: Localization;
-export declare const heIL: Localization;
-export declare const hiIN: Localization;
-export declare const hrHR: Localization;
-export declare const huHU: Localization;
-export declare const hyAM: Localization;
-export declare const idID: Localization;
-export declare const isIS: Localization;
-export declare const itIT: Localization;
-export declare const jaJP: Localization;
-export declare const khKH: Localization;
-export declare const koKR: Localization;
-export declare const kzKZ: Localization;
-export declare const mkMK: Localization;
-export declare const nbNO: Localization;
-export declare const nlNL: Localization;
-export declare const plPL: Localization;
-export declare const ptBR: Localization;
-export declare const ptPT: Localization;
-export declare const roRO: Localization;
-export declare const srRS: Localization;
-export declare const ruRU: Localization;
-export declare const siLK: Localization;
-export declare const skSK: Localization;
-export declare const svSE: Localization;
-export declare const thTH: Localization;
-export declare const trTR: Localization;
-export declare const ukUA: Localization;
-export declare const urPK: Localization;
-export declare const viVN: Localization;
-export declare const zhCN: Localization;
-export declare const zhHK: Localization;
-export declare const zhTW: Localization;
+import { ComponentsPropsList } from '../styles/props';
+export interface Localization {
+    components?: {
+        MuiAlert?: {
+            defaultProps: Pick<ComponentsPropsList['MuiAlert'], 'closeText'>;
+        };
+        MuiBreadcrumbs?: {
+            defaultProps: Pick<ComponentsPropsList['MuiBreadcrumbs'], 'expandText'>;
+        };
+        MuiTablePagination?: {
+            defaultProps: Pick<ComponentsPropsList['MuiTablePagination'], 'labelRowsPerPage' | 'labelDisplayedRows' | 'getItemAriaLabel'>;
+        };
+        MuiRating?: {
+            defaultProps: Pick<ComponentsPropsList['MuiRating'], 'emptyLabelText' | 'getLabelText'>;
+        };
+        MuiAutocomplete?: {
+            defaultProps: Pick<ComponentsPropsList['MuiAutocomplete'], 'clearText' | 'closeText' | 'loadingText' | 'noOptionsText' | 'openText'>;
+        };
+        MuiPagination?: {
+            defaultProps: Pick<ComponentsPropsList['MuiPagination'], 'aria-label' | 'getItemAriaLabel'>;
+        };
+    };
+}
+export declare const amET: Localization;
+export declare const arEG: Localization;
+export declare const arSA: Localization;
+export declare const arSD: Localization;
+export declare const azAZ: Localization;
+export declare const bnBD: Localization;
+export declare const bgBG: Localization;
+export declare const caES: Localization;
+export declare const csCZ: Localization;
+export declare const daDK: Localization;
+export declare const deDE: Localization;
+export declare const elGR: Localization;
+export declare const enUS: Localization;
+export declare const esES: Localization;
+export declare const etEE: Localization;
+export declare const faIR: Localization;
+export declare const fiFI: Localization;
+export declare const frFR: Localization;
+export declare const heIL: Localization;
+export declare const hiIN: Localization;
+export declare const hrHR: Localization;
+export declare const huHU: Localization;
+export declare const hyAM: Localization;
+export declare const idID: Localization;
+export declare const isIS: Localization;
+export declare const itIT: Localization;
+export declare const jaJP: Localization;
+export declare const khKH: Localization;
+export declare const koKR: Localization;
+export declare const kzKZ: Localization;
+export declare const mkMK: Localization;
+export declare const nbNO: Localization;
+export declare const nlNL: Localization;
+export declare const plPL: Localization;
+export declare const ptBR: Localization;
+export declare const ptPT: Localization;
+export declare const roRO: Localization;
+export declare const srRS: Localization;
+export declare const ruRU: Localization;
+export declare const siLK: Localization;
+export declare const skSK: Localization;
+export declare const svSE: Localization;
+export declare const thTH: Localization;
+export declare const trTR: Localization;
+export declare const ukUA: Localization;
+export declare const urPK: Localization;
+export declare const viVN: Localization;
+export declare const zhCN: Localization;
+export declare const zhHK: Localization;
+export declare const zhTW: Localization;

package/modern/Chip/Chip.js

@@ -1,6 +1,6 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["avatar", "className", "clickable", "color", "component", "deleteIcon", "disabled", "icon", "label", "onClick", "onDelete", "onKeyDown", "onKeyUp", "size", "variant"];
+const _excluded = ["avatar", "className", "clickable", "color", "component", "deleteIcon", "disabled", "icon", "label", "onClick", "onDelete", "onKeyDown", "onKeyUp", "size", "variant", "tabIndex", "skipFocusWhenDisabled"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -292,7 +292,9 @@ const Chip = /*#__PURE__*/React.forwardRef(function Chip(inProps, ref) {
       onKeyDown,
       onKeyUp,
       size = 'medium',
-      variant = 'filled'
+      variant = 'filled',
+      tabIndex,
+      skipFocusWhenDisabled = false
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
   const chipRef = React.useRef(null);
@@ -382,6 +384,7 @@ const Chip = /*#__PURE__*/React.forwardRef(function Chip(inProps, ref) {
     onKeyDown: handleKeyDown,
     onKeyUp: handleKeyUp,
     ref: handleRef,
+    tabIndex: skipFocusWhenDisabled && disabled ? -1 : tabIndex,
     ownerState: ownerState
   }, moreProps, other, {
     children: [avatar || icon, /*#__PURE__*/_jsx(ChipLabel, {
@@ -473,10 +476,20 @@ process.env.NODE_ENV !== "production" ? Chip.propTypes /* remove-proptypes */ =
    * @default 'medium'
    */
   size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]),
+  /**
+   * If `true`, allows the disabled chip to escape focus.
+   * If `false`, allows the disabled chip to receive focus.
+   * @default false
+   */
+  skipFocusWhenDisabled: PropTypes.bool,
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * @ignore
+   */
+  tabIndex: PropTypes.number,
   /**
    * The variant to use.
    * @default 'filled'

package/modern/FormControl/FormControlContext.js

@@ -1,9 +1,8 @@
 import * as React from 'react';
-
 /**
  * @ignore - internal component.
  */
-const FormControlContext = /*#__PURE__*/React.createContext();
+const FormControlContext = /*#__PURE__*/React.createContext(undefined);
 if (process.env.NODE_ENV !== 'production') {
   FormControlContext.displayName = 'FormControlContext';
 }

package/modern/IconButton/iconButtonClasses.js

@@ -3,5 +3,5 @@ import generateUtilityClass from '../generateUtilityClass';
 export function getIconButtonUtilityClass(slot) {
   return generateUtilityClass('MuiIconButton', slot);
 }
-const iconButtonClasses = generateUtilityClasses('MuiIconButton', ['root', 'disabled', 'colorInherit', 'colorPrimary', 'colorSecondary', 'edgeStart', 'edgeEnd', 'sizeSmall', 'sizeMedium', 'sizeLarge']);
+const iconButtonClasses = generateUtilityClasses('MuiIconButton', ['root', 'disabled', 'colorInherit', 'colorPrimary', 'colorSecondary', 'colorError', 'colorInfo', 'colorSuccess', 'colorWarning', 'edgeStart', 'edgeEnd', 'sizeSmall', 'sizeMedium', 'sizeLarge']);
 export default iconButtonClasses;

package/modern/SwipeableDrawer/SwipeableDrawer.js

@@ -9,6 +9,7 @@ import { elementTypeAcceptingRef } from '@mui/utils';
 import { useThemeProps } from '@mui/system';
 import { NoSsr } from '@mui/base';
 import Drawer, { getAnchor, isHorizontal } from '../Drawer/Drawer';
+import useForkRef from '../utils/useForkRef';
 import ownerDocument from '../utils/ownerDocument';
 import ownerWindow from '../utils/ownerWindow';
 import useEventCallback from '../utils/useEventCallback';
@@ -154,6 +155,7 @@ const SwipeableDrawer = /*#__PURE__*/React.forwardRef(function SwipeableDrawer(i
   const swipeAreaRef = React.useRef();
   const backdropRef = React.useRef();
   const paperRef = React.useRef();
+  const handleRef = useForkRef(PaperProps.ref, paperRef);
   const touchDetected = React.useRef(false);
 
   // Ref for transition duration based on / to match swipe speed
@@ -448,7 +450,7 @@ const SwipeableDrawer = /*#__PURE__*/React.forwardRef(function SwipeableDrawer(i
         style: _extends({
           pointerEvents: variant === 'temporary' && !open ? 'none' : ''
         }, PaperProps.style),
-        ref: paperRef
+        ref: handleRef
       }),
       anchor: anchor,
       transitionDuration: calculatedDurationRef.current || transitionDuration,

package/modern/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.10.15
+/** @license MUI v5.10.16
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/material",
-  "version": "5.10.15",
+  "version": "5.10.16",
   "private": false,
   "author": "MUI Team",
   "description": "React components that implement Google's Material Design.",
@@ -46,11 +46,11 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.20.1",
-    "@mui/base": "5.0.0-alpha.107",
-    "@mui/core-downloads-tracker": "^5.10.15",
-    "@mui/system": "^5.10.15",
-    "@mui/types": "^7.2.1",
-    "@mui/utils": "^5.10.15",
+    "@mui/base": "5.0.0-alpha.108",
+    "@mui/core-downloads-tracker": "^5.10.16",
+    "@mui/system": "^5.10.16",
+    "@mui/types": "^7.2.2",
+    "@mui/utils": "^5.10.16",
     "@types/react-transition-group": "^4.4.5",
     "clsx": "^1.2.1",
     "csstype": "^3.1.1",

package/styles/CssVarsProvider.d.ts

@@ -1,14 +1,14 @@
-/// <reference types="react" />
-import { SupportedColorScheme } from './experimental_extendTheme';
-declare const shouldSkipGeneratingVar: (keys: string[]) => boolean;
-declare const CssVarsProvider: (props: import("react").PropsWithChildren<Partial<import("@mui/system").CssVarsProviderConfig<SupportedColorScheme>> & {
-    theme?: {
-        cssVarPrefix?: string | undefined;
-        colorSchemes: Record<SupportedColorScheme, Record<string, any>>;
-    } | undefined;
-    documentNode?: Document | null | undefined;
-    colorSchemeNode?: Document | HTMLElement | null | undefined;
-    colorSchemeSelector?: string | undefined;
-    storageWindow?: Window | null | undefined;
-}>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, useColorScheme: () => import("@mui/system").ColorSchemeContextValue<SupportedColorScheme>, getInitColorSchemeScript: typeof import("@mui/system").getInitColorSchemeScript;
-export { useColorScheme, getInitColorSchemeScript, shouldSkipGeneratingVar, CssVarsProvider as Experimental_CssVarsProvider, };
+/// <reference types="react" />
+import { SupportedColorScheme } from './experimental_extendTheme';
+declare const shouldSkipGeneratingVar: (keys: string[]) => boolean;
+declare const CssVarsProvider: (props: import("react").PropsWithChildren<Partial<import("@mui/system").CssVarsProviderConfig<SupportedColorScheme>> & {
+    theme?: {
+        cssVarPrefix?: string | undefined;
+        colorSchemes: Record<SupportedColorScheme, Record<string, any>>;
+    } | undefined;
+    documentNode?: Document | null | undefined;
+    colorSchemeNode?: Document | HTMLElement | null | undefined;
+    colorSchemeSelector?: string | undefined;
+    storageWindow?: Window | null | undefined;
+}>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, useColorScheme: () => import("@mui/system").ColorSchemeContextValue<SupportedColorScheme>, getInitColorSchemeScript: typeof import("@mui/system").getInitColorSchemeScript;
+export { useColorScheme, getInitColorSchemeScript, shouldSkipGeneratingVar, CssVarsProvider as Experimental_CssVarsProvider, };

package/styles/excludeVariablesFromRoot.d.ts

@@ -1,5 +1,5 @@
-/**
- * @internal These variables should not appear in the :root stylesheet when the `defaultMode="dark"`
- */
-declare const excludeVariablesFromRoot: (cssVarPrefix: string) => string[];
-export default excludeVariablesFromRoot;
+/**
+ * @internal These variables should not appear in the :root stylesheet when the `defaultMode="dark"`
+ */
+declare const excludeVariablesFromRoot: (cssVarPrefix: string) => string[];
+export default excludeVariablesFromRoot;

package/styles/getOverlayAlpha.d.ts

@@ -1,2 +1,2 @@
-declare const getOverlayAlpha: (elevation: number) => string;
-export default getOverlayAlpha;
+declare const getOverlayAlpha: (elevation: number) => string;
+export default getOverlayAlpha;

package/styles/responsiveFontSizes.d.ts

@@ -1,12 +1,12 @@
 import { Breakpoint } from '@mui/system';
+import { Typography } from './createTypography';
 import { Theme } from './createTheme';
-import { Variant } from './createTypography';
 
 export interface ResponsiveFontSizesOptions {
   breakpoints?: Breakpoint[];
   disableAlign?: boolean;
   factor?: number;
-  variants?: Variant[];
+  variants?: Array<keyof Typography>;
 }
 
 export default function responsiveFontSizes(

package/transitions/index.d.ts

@@ -1 +1 @@
-export * from './transition';
+export * from './transition';

package/transitions/transition.d.ts

@@ -1,13 +1,13 @@
-import { TransitionProps as _TransitionProps, TransitionActions } from 'react-transition-group/Transition';
-import * as React from 'react';
-export declare type TransitionHandlerKeys = 'onEnter' | 'onEntering' | 'onEntered' | 'onExit' | 'onExiting' | 'onExited';
-export declare type TransitionHandlerProps = Pick<_TransitionProps, TransitionHandlerKeys>;
-export interface EasingProps {
-    easing: string | {
-        enter?: string;
-        exit?: string;
-    };
-}
-export declare type TransitionKeys = 'in' | 'mountOnEnter' | 'unmountOnExit' | 'timeout' | 'easing' | 'addEndListener' | TransitionHandlerKeys;
-export interface TransitionProps extends TransitionActions, Partial<Pick<_TransitionProps & EasingProps, TransitionKeys>>, React.HTMLAttributes<HTMLElement> {
-}
+import { TransitionProps as _TransitionProps, TransitionActions } from 'react-transition-group/Transition';
+import * as React from 'react';
+export type TransitionHandlerKeys = 'onEnter' | 'onEntering' | 'onEntered' | 'onExit' | 'onExiting' | 'onExited';
+export type TransitionHandlerProps = Pick<_TransitionProps, TransitionHandlerKeys>;
+export interface EasingProps {
+    easing: string | {
+        enter?: string;
+        exit?: string;
+    };
+}
+export type TransitionKeys = 'in' | 'mountOnEnter' | 'unmountOnExit' | 'timeout' | 'easing' | 'addEndListener' | TransitionHandlerKeys;
+export interface TransitionProps extends TransitionActions, Partial<Pick<_TransitionProps & EasingProps, TransitionKeys>>, React.HTMLAttributes<HTMLElement> {
+}

package/transitions/utils.d.ts

@@ -1,23 +1,23 @@
-import * as React from 'react';
-export declare const reflow: (node: Element) => number;
-interface ComponentProps {
-    easing: string | {
-        enter?: string;
-        exit?: string;
-    } | undefined;
-    style: React.CSSProperties | undefined;
-    timeout: number | {
-        enter?: number;
-        exit?: number;
-    };
-}
-interface Options {
-    mode: 'enter' | 'exit';
-}
-interface TransitionProps {
-    duration: string | number;
-    easing: string | undefined;
-    delay: string | undefined;
-}
-export declare function getTransitionProps(props: ComponentProps, options: Options): TransitionProps;
-export {};
+import * as React from 'react';
+export declare const reflow: (node: Element) => number;
+interface ComponentProps {
+    easing: string | {
+        enter?: string;
+        exit?: string;
+    } | undefined;
+    style: React.CSSProperties | undefined;
+    timeout: number | {
+        enter?: number;
+        exit?: number;
+    };
+}
+interface Options {
+    mode: 'enter' | 'exit';
+}
+interface TransitionProps {
+    duration: string | number;
+    easing: string | undefined;
+    delay: string | undefined;
+}
+export declare function getTransitionProps(props: ComponentProps, options: Options): TransitionProps;
+export {};

package/umd/material-ui.development.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.10.15
+/** @license MUI v5.10.16
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -7626,10 +7626,10 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
    * }} options.
    *  `prefix`: The prefix of the generated CSS variables. This function does not change the value.
    *
-   * @returns {{ css: Object, vars: Object, parsedTheme: typeof theme }} `css` is the stylesheet, `vars` is an object to get css variable (same structure as theme), and `parsedTheme` is the cloned version of theme.
+   * @returns {{ css: Object, vars: Object }} `css` is the stylesheet, `vars` is an object to get css variable (same structure as theme).
    *
    * @example
-   * const { css, vars, parsedTheme } = parser({
+   * const { css, vars } = parser({
    *   fontSize: 12,
    *   lineHeight: 1.2,
    *   palette: { primary: { 500: 'var(--color)' } }
@@ -7637,7 +7637,6 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
    *
    * console.log(css) // { '--foo-fontSize': '12px', '--foo-lineHeight': 1.2, '--foo-palette-primary-500': 'var(--color)' }
    * console.log(vars) // { fontSize: 'var(--foo-fontSize)', lineHeight: 'var(--foo-lineHeight)', palette: { primary: { 500: 'var(--foo-palette-primary-500)' } } }
-   * console.log(parsedTheme) // { fontSize: 12, lineHeight: 1.2, palette: { primary: { 500: 'var(--color)' } } }
    */
   function cssVarsParser(theme, options) {
     const {
@@ -7646,7 +7645,6 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
     } = options || {};
     const css = {};
     const vars = {};
-    const parsedTheme = {};
     walkObjectDeep(theme, (keys, value, arrayKeys) => {
       if (typeof value === 'string' || typeof value === 'number') {
         if (!shouldSkipGeneratingVar || !shouldSkipGeneratingVar(keys, value)) {
@@ -7658,14 +7656,12 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
           assignNestedKeys(vars, keys, `var(${cssVar})`, arrayKeys);
         }
       }
-      assignNestedKeys(parsedTheme, keys, value, arrayKeys);
     }, keys => keys[0] === 'vars' // skip 'vars/*' paths
     );
 
     return {
       css,
-      vars,
-      parsedTheme
+      vars
     };
   }
 
@@ -8023,15 +8019,14 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
       // 2. Create CSS variables and store them in objects (to be generated in stylesheets in the final step)
       const {
         css: rootCss,
-        vars: rootVars,
-        parsedTheme
+        vars: rootVars
       } = cssVarsParser(restThemeProp, {
         prefix: cssVarPrefix,
         shouldSkipGeneratingVar
       });
 
       // 3. Start composing the theme object
-      const theme = _extends({}, parsedTheme, {
+      const theme = _extends({}, restThemeProp, {
         components,
         colorSchemes,
         cssVarPrefix,
@@ -8047,8 +8042,7 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
       Object.entries(colorSchemes).forEach(([key, scheme]) => {
         const {
           css,
-          vars,
-          parsedTheme: parsedScheme
+          vars
         } = cssVarsParser(scheme, {
           prefix: cssVarPrefix,
           shouldSkipGeneratingVar
@@ -8056,12 +8050,12 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
         theme.vars = deepmerge(theme.vars, vars);
         if (key === calculatedColorScheme) {
           // 4.1 Merge the selected color scheme to the theme
-          Object.keys(parsedScheme).forEach(schemeKey => {
-            if (parsedScheme[schemeKey] && typeof parsedScheme[schemeKey] === 'object') {
+          Object.keys(scheme).forEach(schemeKey => {
+            if (scheme[schemeKey] && typeof scheme[schemeKey] === 'object') {
               // shallow merge the 1st level structure of the theme.
-              theme[schemeKey] = _extends({}, theme[schemeKey], parsedScheme[schemeKey]);
+              theme[schemeKey] = _extends({}, theme[schemeKey], scheme[schemeKey]);
             } else {
-              theme[schemeKey] = parsedScheme[schemeKey];
+              theme[schemeKey] = scheme[schemeKey];
             }
           });
           if (theme.palette) {
@@ -9956,12 +9950,12 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
   /**
    * Appends the ownerState object to the props, merging with the existing one if necessary.
    *
-   * @param elementType Type of the element that owns the `existingProps`. If the element is a DOM node, `ownerState` is not applied.
+   * @param elementType Type of the element that owns the `existingProps`. If the element is a DOM node or undefined, `ownerState` is not applied.
    * @param otherProps Props of the element.
    * @param ownerState
    */
   function appendOwnerState(elementType, otherProps, ownerState) {
-    if (isHostComponent(elementType)) {
+    if (elementType === undefined || isHostComponent(elementType)) {
       return otherProps;
     }
     return _extends({}, otherProps, {
@@ -19213,7 +19207,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
   function getIconButtonUtilityClass(slot) {
     return generateUtilityClass('MuiIconButton', slot);
   }
-  const iconButtonClasses = generateUtilityClasses('MuiIconButton', ['root', 'disabled', 'colorInherit', 'colorPrimary', 'colorSecondary', 'edgeStart', 'edgeEnd', 'sizeSmall', 'sizeMedium', 'sizeLarge']);
+  const iconButtonClasses = generateUtilityClasses('MuiIconButton', ['root', 'disabled', 'colorInherit', 'colorPrimary', 'colorSecondary', 'colorError', 'colorInfo', 'colorSuccess', 'colorWarning', 'edgeStart', 'edgeEnd', 'sizeSmall', 'sizeMedium', 'sizeLarge']);
   var iconButtonClasses$1 = iconButtonClasses;
 
   const _excluded$1W = ["edge", "children", "className", "color", "disabled", "disableFocusRipple", "size"];
@@ -20473,7 +20467,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
   const chipClasses = generateUtilityClasses('MuiChip', ['root', 'sizeSmall', 'sizeMedium', 'colorError', 'colorInfo', 'colorPrimary', 'colorSecondary', 'colorSuccess', 'colorWarning', 'disabled', 'clickable', 'clickableColorPrimary', 'clickableColorSecondary', 'deletable', 'deletableColorPrimary', 'deletableColorSecondary', 'outlined', 'filled', 'outlinedPrimary', 'outlinedSecondary', 'filledPrimary', 'filledSecondary', 'avatar', 'avatarSmall', 'avatarMedium', 'avatarColorPrimary', 'avatarColorSecondary', 'icon', 'iconSmall', 'iconMedium', 'iconColorPrimary', 'iconColorSecondary', 'label', 'labelSmall', 'labelMedium', 'deleteIcon', 'deleteIconSmall', 'deleteIconMedium', 'deleteIconColorPrimary', 'deleteIconColorSecondary', 'deleteIconOutlinedColorPrimary', 'deleteIconOutlinedColorSecondary', 'deleteIconFilledColorPrimary', 'deleteIconFilledColorSecondary', 'focusVisible']);
   var chipClasses$1 = chipClasses;
 
-  const _excluded$1P = ["avatar", "className", "clickable", "color", "component", "deleteIcon", "disabled", "icon", "label", "onClick", "onDelete", "onKeyDown", "onKeyUp", "size", "variant"];
+  const _excluded$1P = ["avatar", "className", "clickable", "color", "component", "deleteIcon", "disabled", "icon", "label", "onClick", "onDelete", "onKeyDown", "onKeyUp", "size", "variant", "tabIndex", "skipFocusWhenDisabled"];
   const useUtilityClasses$1x = ownerState => {
     const {
       classes,
@@ -20750,7 +20744,9 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
         onKeyDown,
         onKeyUp,
         size = 'medium',
-        variant = 'filled'
+        variant = 'filled',
+        tabIndex,
+        skipFocusWhenDisabled = false
       } = props,
       other = _objectWithoutPropertiesLoose(props, _excluded$1P);
     const chipRef = React__namespace.useRef(null);
@@ -20840,6 +20836,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
       onKeyDown: handleKeyDown,
       onKeyUp: handleKeyUp,
       ref: handleRef,
+      tabIndex: skipFocusWhenDisabled && disabled ? -1 : tabIndex,
       ownerState: ownerState
     }, moreProps, other, {
       children: [avatar || icon, /*#__PURE__*/jsxRuntime_1(ChipLabel, {
@@ -20931,10 +20928,20 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
      * @default 'medium'
      */
     size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]),
+    /**
+     * If `true`, allows the disabled chip to escape focus.
+     * If `false`, allows the disabled chip to receive focus.
+     * @default false
+     */
+    skipFocusWhenDisabled: PropTypes.bool,
     /**
      * The system prop that allows defining system overrides as well as additional CSS styles.
      */
     sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+    /**
+     * @ignore
+     */
+    tabIndex: PropTypes.number,
     /**
      * The variant to use.
      * @default 'filled'
@@ -20962,7 +20969,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
   /**
    * @ignore - internal component.
    */
-  const FormControlContext = /*#__PURE__*/React__namespace.createContext();
+  const FormControlContext = /*#__PURE__*/React__namespace.createContext(undefined);
   {
     FormControlContext.displayName = 'FormControlContext';
   }
@@ -44344,6 +44351,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
     const swipeAreaRef = React__namespace.useRef();
     const backdropRef = React__namespace.useRef();
     const paperRef = React__namespace.useRef();
+    const handleRef = useForkRef(PaperProps.ref, paperRef);
     const touchDetected = React__namespace.useRef(false);
 
     // Ref for transition duration based on / to match swipe speed
@@ -44638,7 +44646,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
           style: _extends({
             pointerEvents: variant === 'temporary' && !open ? 'none' : ''
           }, PaperProps.style),
-          ref: paperRef
+          ref: handleRef
         }),
         anchor: anchor,
         transitionDuration: calculatedDurationRef.current || transitionDuration,