@mui/material 5.3.0 → 5.4.2

package/FormControlLabel/formControlLabelClasses.js

@@ -2,5 +2,5 @@ import { generateUtilityClasses, generateUtilityClass } from '@mui/base';
 export function getFormControlLabelUtilityClasses(slot) {
   return generateUtilityClass('MuiFormControlLabel', slot);
 }
-const formControlLabelClasses = generateUtilityClasses('MuiFormControlLabel', ['root', 'labelPlacementStart', 'labelPlacementTop', 'labelPlacementBottom', 'disabled', 'label']);
+const formControlLabelClasses = generateUtilityClasses('MuiFormControlLabel', ['root', 'labelPlacementStart', 'labelPlacementTop', 'labelPlacementBottom', 'disabled', 'label', 'error']);
 export default formControlLabelClasses;

package/FormGroup/FormGroup.js

@@ -8,15 +8,18 @@ import { unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import { getFormGroupUtilityClass } from './formGroupClasses';
+import useFormControl from '../FormControl/useFormControl';
+import formControlState from '../FormControl/formControlState';
 import { jsx as _jsx } from "react/jsx-runtime";
 
 const useUtilityClasses = ownerState => {
   const {
     classes,
-    row
+    row,
+    error
   } = ownerState;
   const slots = {
-    root: ['root', row && 'row']
+    root: ['root', row && 'row', error && 'error']
   };
   return composeClasses(slots, getFormGroupUtilityClass, classes);
 };
@@ -57,8 +60,16 @@ const FormGroup = /*#__PURE__*/React.forwardRef(function FormGroup(inProps, ref)
   } = props,
         other = _objectWithoutPropertiesLoose(props, _excluded);
 
+  const muiFormControl = useFormControl();
+  const fcs = formControlState({
+    props,
+    muiFormControl,
+    states: ['error']
+  });
+
   const ownerState = _extends({}, props, {
-    row
+    row,
+    error: fcs.error
   });
 
   const classes = useUtilityClasses(ownerState);

package/FormGroup/formGroupClasses.d.ts

@@ -3,6 +3,8 @@ export interface FormGroupClasses {
     root: string;
     /** Styles applied to the root element if `row={true}`. */
     row: string;
+    /** State class applied to the root element if `error={true}`. */
+    error: string;
 }
 export declare type FormGroupClassKey = keyof FormGroupClasses;
 export declare function getFormGroupUtilityClass(slot: string): string;

package/FormGroup/formGroupClasses.js

@@ -2,5 +2,5 @@ import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getFormGroupUtilityClass(slot) {
   return generateUtilityClass('MuiFormGroup', slot);
 }
-const formGroupClasses = generateUtilityClasses('MuiFormGroup', ['root', 'row']);
+const formGroupClasses = generateUtilityClasses('MuiFormGroup', ['root', 'row', 'error']);
 export default formGroupClasses;

package/FormHelperText/FormHelperText.js

@@ -1,5 +1,8 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
+
+var _span;
+
 const _excluded = ["children", "className", "component", "disabled", "error", "filled", "focused", "margin", "required", "variant"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
@@ -101,16 +104,11 @@ const FormHelperText = /*#__PURE__*/React.forwardRef(function FormHelperText(inP
     className: clsx(classes.root, className),
     ref: ref
   }, other, {
-    children: children === ' ' ?
-    /*#__PURE__*/
-    // notranslate needed while Google Translate will not fix zero-width space issue
-    // eslint-disable-next-line react/no-danger
-    _jsx("span", {
+    children: children === ' ' ? // notranslate needed while Google Translate will not fix zero-width space issue
+    _span || (_span = /*#__PURE__*/_jsx("span", {
       className: "notranslate",
-      dangerouslySetInnerHTML: {
-        __html: '​'
-      }
-    }) : children
+      children: "\u200B"
+    })) : children
   }));
 });
 process.env.NODE_ENV !== "production" ? FormHelperText.propTypes

package/Grid/Grid.js

@@ -260,10 +260,8 @@ const GridRoot = styled('div', {
 
 }, ownerState.zeroMinWidth && {
   minWidth: 0
-}, ownerState.wrap === 'nowrap' && {
-  flexWrap: 'nowrap'
-}, ownerState.wrap === 'reverse' && {
-  flexWrap: 'wrap-reverse'
+}, ownerState.wrap !== 'wrap' && {
+  flexWrap: ownerState.wrap
 }), generateDirection, generateRowGap, generateColumnGap, generateGrid);
 
 const useUtilityClasses = ownerState => {

package/ImageList/ImageList.js

@@ -169,6 +169,8 @@ process.env.NODE_ENV !== "production" ? ImageList.propTypes
    * The variant to use.
    * @default 'standard'
    */
-  variant: PropTypes.oneOf(['masonry', 'quilted', 'standard', 'woven'])
+  variant: PropTypes
+  /* @typescript-to-proptypes-ignore */
+  .oneOfType([PropTypes.oneOf(['masonry', 'quilted', 'standard', 'woven']), PropTypes.string])
 } : void 0;
 export default ImageList;

package/InputAdornment/InputAdornment.js

@@ -1,5 +1,8 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
+
+var _span;
+
 const _excluded = ["children", "className", "component", "disablePointerEvents", "disableTypography", "position", "variant"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
@@ -121,17 +124,11 @@ const InputAdornment = /*#__PURE__*/React.forwardRef(function InputAdornment(inP
         children: children
       }) : /*#__PURE__*/_jsxs(React.Fragment, {
         children: [position === 'start' ?
-        /*#__PURE__*/
-
         /* notranslate needed while Google Translate will not fix zero-width space issue */
-
-        /* eslint-disable-next-line react/no-danger */
-        _jsx("span", {
+        _span || (_span = /*#__PURE__*/_jsx("span", {
           className: "notranslate",
-          dangerouslySetInnerHTML: {
-            __html: '​'
-          }
-        }) : null, children]
+          children: "\u200B"
+        })) : null, children]
       })
     }))
   });

package/Modal/Modal.js

@@ -228,7 +228,7 @@ process.env.NODE_ENV !== "production" ? Modal.propTypes
 
   /**
    * If `true`, the modal will not restore focus to previously focused element once
-   * modal is hidden.
+   * modal is hidden or unmounted.
    * @default false
    */
   disableRestoreFocus: PropTypes.bool,

package/OutlinedInput/NotchedOutline.js

@@ -1,5 +1,8 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
+
+var _span;
+
 const _excluded = ["children", "classes", "className", "label", "notched"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
@@ -21,14 +24,12 @@ const NotchedOutlineRoot = styled('fieldset')({
   overflow: 'hidden',
   minWidth: '0%'
 });
-const NotchedOutlineLegend = styled('legend', {
-  skipSx: true
-})(({
+const NotchedOutlineLegend = styled('legend')(({
   ownerState,
   theme
 }) => _extends({
   float: 'unset'
-}, ownerState.label === undefined && {
+}, !ownerState.withLabel && {
   padding: 0,
   lineHeight: '11px',
   // sync with `height` in `legend` styles
@@ -36,7 +37,7 @@ const NotchedOutlineLegend = styled('legend', {
     duration: 150,
     easing: theme.transitions.easing.easeOut
   })
-}, ownerState.label !== undefined && _extends({
+}, ownerState.withLabel && _extends({
   display: 'block',
   // Fix conflict with normalize.css and sanitize.css
   width: 'auto',
@@ -77,9 +78,11 @@ export default function NotchedOutline(props) {
   } = props,
         other = _objectWithoutPropertiesLoose(props, _excluded);
 
+  const withLabel = label != null && label !== '';
+
   const ownerState = _extends({}, props, {
     notched,
-    label
+    withLabel
   });
 
   return /*#__PURE__*/_jsx(NotchedOutlineRoot, _extends({
@@ -89,18 +92,13 @@ export default function NotchedOutline(props) {
   }, other, {
     children: /*#__PURE__*/_jsx(NotchedOutlineLegend, {
       ownerState: ownerState,
-      children: label ? /*#__PURE__*/_jsx("span", {
+      children: withLabel ? /*#__PURE__*/_jsx("span", {
         children: label
-      }) :
-      /*#__PURE__*/
-      // notranslate needed while Google Translate will not fix zero-width space issue
-      // eslint-disable-next-line react/no-danger
-      _jsx("span", {
+      }) : // notranslate needed while Google Translate will not fix zero-width space issue
+      _span || (_span = /*#__PURE__*/_jsx("span", {
         className: "notranslate",
-        dangerouslySetInnerHTML: {
-          __html: '​'
-        }
-      })
+        children: "\u200B"
+      }))
     })
   }));
 }

package/OutlinedInput/OutlinedInput.js

@@ -136,7 +136,7 @@ const OutlinedInput = /*#__PURE__*/React.forwardRef(function OutlinedInput(inPro
     }, components),
     renderSuffix: state => /*#__PURE__*/_jsx(NotchedOutlineRoot, {
       className: classes.notchedOutline,
-      label: label && fcs.required ? _React$Fragment || (_React$Fragment = /*#__PURE__*/_jsxs(React.Fragment, {
+      label: label != null && label !== '' && fcs.required ? _React$Fragment || (_React$Fragment = /*#__PURE__*/_jsxs(React.Fragment, {
         children: [label, "\xA0", '*']
       })) : label,
       notched: typeof notched !== 'undefined' ? notched : Boolean(state.startAdornment || state.filled || state.focused)

package/README.md

@@ -9,15 +9,15 @@
 
 Quickly build beautiful [React](https://reactjs.org/) apps. MUI is a simple and customizable component library to build faster, beautiful, and more accessible React applications. Follow your own design system, or start with [Material Design](https://material.io/design/introduction/).
 
-[![license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/mui-org/material-ui/blob/HEAD/LICENSE)
+[![license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/mui/material-ui/blob/HEAD/LICENSE)
 [![npm latest package](https://img.shields.io/npm/v/@mui/material/latest.svg)](https://www.npmjs.com/package/@mui/material)
 [![npm next package](https://img.shields.io/npm/v/@mui/material/next.svg)](https://www.npmjs.com/package/@mui/material)
 [![npm downloads](https://img.shields.io/npm/dm/@mui/material.svg)](https://www.npmjs.com/package/@mui/material)
-[![CircleCI](https://circleci.com/gh/mui-org/material-ui/tree/master.svg?style=shield)](https://app.circleci.com/pipelines/github/mui-org/material-ui?branch=master)
-[![Coverage Status](https://img.shields.io/codecov/c/github/mui-org/material-ui/master.svg)](https://codecov.io/gh/mui-org/material-ui/branch/master)
+[![CircleCI](https://circleci.com/gh/mui/material-ui/tree/master.svg?style=shield)](https://app.circleci.com/pipelines/github/mui/material-ui?branch=master)
+[![Coverage Status](https://img.shields.io/codecov/c/github/mui/material-ui/master.svg)](https://codecov.io/gh/mui/material-ui/branch/master)
 [![Follow on Twitter](https://img.shields.io/twitter/follow/MUI_hq.svg?label=follow+MUI)](https://twitter.com/MUI_hq)
-[![Renovate status](https://img.shields.io/badge/renovate-enabled-brightgreen.svg)](https://github.com/mui-org/material-ui/issues/27062)
-[![Average time to resolve an issue](https://isitmaintained.com/badge/resolution/mui-org/material-ui.svg)](https://isitmaintained.com/project/mui-org/material-ui 'Average time to resolve an issue')
+[![Renovate status](https://img.shields.io/badge/renovate-enabled-brightgreen.svg)](https://github.com/mui/material-ui/issues/27062)
+[![Average time to resolve an issue](https://isitmaintained.com/badge/resolution/mui/material-ui.svg)](https://isitmaintained.com/project/mui/material-ui 'Average time to resolve an issue')
 [![Crowdin](https://badges.crowdin.net/material-ui-docs/localized.svg)](https://translate.mui.com/project/material-ui-docs)
 [![Open Collective backers and sponsors](https://img.shields.io/opencollective/all/mui)](https://opencollective.com/mui)
 
@@ -132,7 +132,7 @@ Although we love giving you the opportunity to put your stamp on MUI, we also ar
 
 ## Changelog
 
-If you have recently updated, please read the [changelog](https://github.com/mui-org/material-ui/releases) for details of what has changed.
+If you have recently updated, please read the [changelog](https://github.com/mui/material-ui/releases) for details of what has changed.
 
 ## Roadmap
 

package/Radio/RadioButtonIcon.js

@@ -10,15 +10,11 @@ const RadioButtonIconRoot = styled('span')({
   position: 'relative',
   display: 'flex'
 });
-const RadioButtonIconBackground = styled(RadioButtonUncheckedIcon, {
-  skipSx: true
-})({
+const RadioButtonIconBackground = styled(RadioButtonUncheckedIcon)({
   // Scale applied to prevent dot misalignment in Safari
   transform: 'scale(1)'
 });
-const RadioButtonIconDot = styled(RadioButtonCheckedIcon, {
-  skipSx: true
-})(({
+const RadioButtonIconDot = styled(RadioButtonCheckedIcon)(({
   theme,
   ownerState
 }) => _extends({

package/Rating/Rating.js

@@ -405,7 +405,7 @@ const Rating = /*#__PURE__*/React.forwardRef(function Rating(inProps, ref) {
 
   const handleChange = event => {
     let newValue = event.target.value === '' ? null : parseFloat(event.target.value); // Give mouse priority over keyboard
-    // Fix https://github.com/mui-org/material-ui/issues/22827
+    // Fix https://github.com/mui/material-ui/issues/22827
 
     if (hover !== -1) {
       newValue = hover;

package/Select/Select.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 
-var _Input, _FilledInput;
+var _StyledInput, _StyledFilledInput;
 
 const _excluded = ["autoWidth", "children", "classes", "className", "defaultOpen", "displayEmpty", "IconComponent", "id", "input", "inputProps", "label", "labelId", "MenuProps", "multiple", "native", "onClose", "onOpen", "open", "renderValue", "SelectDisplayProps", "variant"];
 import * as React from 'react';
@@ -18,6 +18,7 @@ import FilledInput from '../FilledInput';
 import OutlinedInput from '../OutlinedInput';
 import useThemeProps from '../styles/useThemeProps';
 import useForkRef from '../utils/useForkRef';
+import styled, { rootShouldForwardProp } from '../styles/styled';
 import { jsx as _jsx } from "react/jsx-runtime";
 
 const useUtilityClasses = ownerState => {
@@ -27,6 +28,15 @@ const useUtilityClasses = ownerState => {
   return classes;
 };
 
+const styledRootConfig = {
+  name: 'MuiSelect',
+  overridesResolver: (props, styles) => styles.root,
+  shouldForwardProp: prop => rootShouldForwardProp(prop) && prop !== 'variant',
+  slot: 'Root'
+};
+const StyledInput = styled(Input, styledRootConfig)('');
+const StyledOutlinedInput = styled(OutlinedInput, styledRootConfig)('');
+const StyledFilledInput = styled(FilledInput, styledRootConfig)('');
 const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
   const props = useThemeProps({
     name: 'MuiSelect',
@@ -54,7 +64,7 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     open,
     renderValue,
     SelectDisplayProps,
-    variant: variantProps = 'outlined'
+    variant: variantProp = 'outlined'
   } = props,
         other = _objectWithoutPropertiesLoose(props, _excluded);
 
@@ -65,16 +75,17 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     muiFormControl,
     states: ['variant']
   });
-  const variant = fcs.variant || variantProps;
+  const variant = fcs.variant || variantProp;
   const InputComponent = input || {
-    standard: _Input || (_Input = /*#__PURE__*/_jsx(Input, {})),
-    outlined: /*#__PURE__*/_jsx(OutlinedInput, {
+    standard: _StyledInput || (_StyledInput = /*#__PURE__*/_jsx(StyledInput, {})),
+    outlined: /*#__PURE__*/_jsx(StyledOutlinedInput, {
       label: label
     }),
-    filled: _FilledInput || (_FilledInput = /*#__PURE__*/_jsx(FilledInput, {}))
+    filled: _StyledFilledInput || (_StyledFilledInput = /*#__PURE__*/_jsx(StyledFilledInput, {}))
   }[variant];
 
   const ownerState = _extends({}, props, {
+    variant,
     classes: classesProp
   });
 
@@ -113,7 +124,8 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     notched: true
   } : {}, {
     ref: inputComponentRef,
-    className: clsx(InputComponent.props.className, className)
+    className: clsx(InputComponent.props.className, className),
+    variant
   }, other));
 });
 process.env.NODE_ENV !== "production" ? Select.propTypes

package/Select/SelectInput.js

@@ -1,6 +1,9 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import { formatMuiErrorMessage as _formatMuiErrorMessage } from "@mui/utils";
+
+var _span;
+
 const _excluded = ["aria-describedby", "aria-label", "autoFocus", "autoWidth", "children", "className", "defaultOpen", "defaultValue", "disabled", "displayEmpty", "IconComponent", "inputRef", "labelId", "MenuProps", "multiple", "name", "onBlur", "onChange", "onClose", "onFocus", "onOpen", "open", "readOnly", "renderValue", "SelectDisplayProps", "tabIndex", "type", "value", "variant"];
 import * as React from 'react';
 import { isFragment } from 'react-is';
@@ -186,6 +189,10 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     }
   }, [autoFocus]);
   React.useEffect(() => {
+    if (!labelId) {
+      return undefined;
+    }
+
     const label = ownerDocument(displayRef.current).getElementById(labelId);
 
     if (label) {
@@ -282,7 +289,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       if (onChange) {
         // Redefine target to allow name and value to be read.
         // This allows seamless integration with the most popular form libraries.
-        // https://github.com/mui-org/material-ui/issues/13485#issuecomment-676048492
+        // https://github.com/mui/material-ui/issues/13485#issuecomment-676048492
         // Clone the event to not override `target` of the original event.
         const nativeEvent = event.nativeEvent || event;
         const clonedEvent = new nativeEvent.constructor(nativeEvent.type, nativeEvent);
@@ -482,16 +489,11 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       className: clsx(classes.select, className, SelectDisplayProps.className) // The id is required for proper a11y
       ,
       id: buttonId,
-      children: isEmpty(display) ?
-      /*#__PURE__*/
-      // notranslate needed while Google Translate will not fix zero-width space issue
-      // eslint-disable-next-line react/no-danger
-      _jsx("span", {
+      children: isEmpty(display) ? // notranslate needed while Google Translate will not fix zero-width space issue
+      _span || (_span = /*#__PURE__*/_jsx("span", {
         className: "notranslate",
-        dangerouslySetInnerHTML: {
-          __html: '​'
-        }
-      }) : display
+        children: "\u200B"
+      })) : display
     })), /*#__PURE__*/_jsx(SelectNativeInput, _extends({
       value: Array.isArray(value) ? value.join(',') : value,
       name: name,

package/Slider/Slider.js

@@ -691,7 +691,9 @@ process.env.NODE_ENV !== "production" ? Slider.propTypes
    * The size of the slider.
    * @default 'medium'
    */
-  size: PropTypes.oneOf(['small', 'medium']),
+  size: PropTypes
+  /* @typescript-to-proptypes-ignore */
+  .oneOfType([PropTypes.oneOf(['small', 'medium']), PropTypes.string]),
 
   /**
    * The granularity with which the slider can step through values. (A "discrete" slider.)

package/Snackbar/Snackbar.js

@@ -290,7 +290,10 @@ const Snackbar = /*#__PURE__*/React.forwardRef(function Snackbar(inProps, ref) {
       onMouseEnter: handleMouseEnter,
       onMouseLeave: handleMouseLeave,
       ownerState: ownerState,
-      ref: ref
+      ref: ref // ClickAwayListener adds an `onClick` prop which results in the alert not being announced.
+      // See https://github.com/mui-org/material-ui/issues/29080
+      ,
+      role: "presentation"
     }, other, {
       children: /*#__PURE__*/_jsx(TransitionComponent, _extends({
         appear: true,

package/SvgIcon/SvgIcon.js

@@ -37,7 +37,7 @@ const SvgIconRoot = styled('svg', {
   theme,
   ownerState
 }) => {
-  var _theme$palette$ownerS, _theme$palette$ownerS2;
+  var _theme$transitions, _theme$transitions$cr, _theme$transitions2, _theme$transitions2$d, _theme$typography, _theme$typography$pxT, _theme$typography2, _theme$typography2$px, _theme$typography3, _theme$typography3$px, _theme$palette$ownerS, _theme$palette, _theme$palette$ownerS2, _theme$palette2, _theme$palette2$actio, _theme$palette3, _theme$palette3$actio;
 
   return {
     userSelect: 'none',
@@ -46,19 +46,19 @@ const SvgIconRoot = styled('svg', {
     display: 'inline-block',
     fill: 'currentColor',
     flexShrink: 0,
-    transition: theme.transitions.create('fill', {
-      duration: theme.transitions.duration.shorter
+    transition: (_theme$transitions = theme.transitions) == null ? void 0 : (_theme$transitions$cr = _theme$transitions.create) == null ? void 0 : _theme$transitions$cr.call(_theme$transitions, 'fill', {
+      duration: (_theme$transitions2 = theme.transitions) == null ? void 0 : (_theme$transitions2$d = _theme$transitions2.duration) == null ? void 0 : _theme$transitions2$d.shorter
     }),
     fontSize: {
       inherit: 'inherit',
-      small: theme.typography.pxToRem(20),
-      medium: theme.typography.pxToRem(24),
-      large: theme.typography.pxToRem(35)
+      small: ((_theme$typography = theme.typography) == null ? void 0 : (_theme$typography$pxT = _theme$typography.pxToRem) == null ? void 0 : _theme$typography$pxT.call(_theme$typography, 20)) || '1.25rem',
+      medium: ((_theme$typography2 = theme.typography) == null ? void 0 : (_theme$typography2$px = _theme$typography2.pxToRem) == null ? void 0 : _theme$typography2$px.call(_theme$typography2, 24)) || '1.5rem',
+      large: ((_theme$typography3 = theme.typography) == null ? void 0 : (_theme$typography3$px = _theme$typography3.pxToRem) == null ? void 0 : _theme$typography3$px.call(_theme$typography3, 35)) || '2.1875'
     }[ownerState.fontSize],
     // TODO v5 deprecate, v6 remove for sx
-    color: (_theme$palette$ownerS = (_theme$palette$ownerS2 = theme.palette[ownerState.color]) == null ? void 0 : _theme$palette$ownerS2.main) != null ? _theme$palette$ownerS : {
-      action: theme.palette.action.active,
-      disabled: theme.palette.action.disabled,
+    color: (_theme$palette$ownerS = (_theme$palette = theme.palette) == null ? void 0 : (_theme$palette$ownerS2 = _theme$palette[ownerState.color]) == null ? void 0 : _theme$palette$ownerS2.main) != null ? _theme$palette$ownerS : {
+      action: (_theme$palette2 = theme.palette) == null ? void 0 : (_theme$palette2$actio = _theme$palette2.action) == null ? void 0 : _theme$palette2$actio.active,
+      disabled: (_theme$palette3 = theme.palette) == null ? void 0 : (_theme$palette3$actio = _theme$palette3.action) == null ? void 0 : _theme$palette3$actio.disabled,
       inherit: undefined
     }[ownerState.color]
   };

package/SwipeableDrawer/SwipeArea.js

@@ -8,9 +8,7 @@ import styled from '../styles/styled';
 import capitalize from '../utils/capitalize';
 import { isHorizontal } from '../Drawer/Drawer';
 import { jsx as _jsx } from "react/jsx-runtime";
-const SwipeAreaRoot = styled('div', {
-  skipSx: true
-})(({
+const SwipeAreaRoot = styled('div')(({
   theme,
   ownerState
 }) => _extends({

package/TextField/TextField.js

@@ -191,7 +191,7 @@ const TextField = /*#__PURE__*/React.forwardRef(function TextField(inProps, ref)
     variant: variant,
     ownerState: ownerState
   }, other, {
-    children: [label && /*#__PURE__*/_jsx(InputLabel, _extends({
+    children: [label != null && label !== '' && /*#__PURE__*/_jsx(InputLabel, _extends({
       htmlFor: id,
       id: inputLabelId
     }, InputLabelProps, {

package/ToggleButton/ToggleButton.d.ts

@@ -1,5 +1,6 @@
 import { SxProps } from '@mui/system';
 import { OverridableStringUnion } from '@mui/types';
+import * as React from 'react';
 import { Theme } from '..';
 import { ExtendButtonBase, ExtendButtonBaseTypeMap } from '../ButtonBase';
 import { OverrideProps } from '../OverridableComponent';
@@ -45,6 +46,20 @@ export type ToggleButtonTypeMap<
      * @default false
      */
     fullWidth?: boolean;
+    /**
+     * Callback fired when the state changes.
+     *
+     * @param {React.MouseEvent<HTMLElement>} event The event source of the callback.
+     * @param {any} value of the selected button.
+     */
+    onChange?: (event: React.MouseEvent<HTMLElement>, value: any) => void;
+    /**
+     * Callback fired when the button is clicked.
+     *
+     * @param {React.MouseEvent<HTMLElement>} event The event source of the callback.
+     * @param {any} value of the selected button.
+     */
+    onClick?: (event: React.MouseEvent<HTMLElement>, value: any) => void;
     /**
      * If `true`, the button is rendered in an active state.
      */

package/ToggleButton/ToggleButton.js

@@ -200,12 +200,18 @@ process.env.NODE_ENV !== "production" ? ToggleButton.propTypes
   fullWidth: PropTypes.bool,
 
   /**
-   * @ignore
+   * Callback fired when the state changes.
+   *
+   * @param {React.MouseEvent<HTMLElement>} event The event source of the callback.
+   * @param {any} value of the selected button.
    */
   onChange: PropTypes.func,
 
   /**
-   * @ignore
+   * Callback fired when the button is clicked.
+   *
+   * @param {React.MouseEvent<HTMLElement>} event The event source of the callback.
+   * @param {any} value of the selected button.
    */
   onClick: PropTypes.func,
 

package/index.d.ts

@@ -23,7 +23,7 @@ export type StandardProps<
 
 /**
  * @internal
- * ONLY USE FROM WITHIN mui-org/material-ui
+ * ONLY USE FROM WITHIN mui/material-ui
  *
  * Internal helper type for conform (describeConformance) components
  * However, we don't declare classes on this type.
@@ -74,8 +74,6 @@ export * from './styles';
 
 export * from './utils';
 
-export * from '@mui/base';
-
 export { default as Accordion } from './Accordion';
 export * from './Accordion';
 
@@ -328,6 +326,9 @@ export * from './Popover';
 export { default as Popper } from './Popper';
 export * from './Popper';
 
+export { default as Portal } from './Portal';
+export * from './Portal';
+
 export { default as Radio } from './Radio';
 export * from './Radio';
 
@@ -476,3 +477,10 @@ export * from './GlobalStyles';
  * @deprecated will be removed in v5.beta, please use StyledEngineProvider from @mui/material/styles instead
  */
 export { StyledEngineProvider } from './styles';
+
+export { default as unstable_composeClasses } from '@mui/base/composeClasses';
+
+export { default as generateUtilityClass } from '@mui/base/generateUtilityClass';
+export * from '@mui/base/generateUtilityClass';
+
+export { default as generateUtilityClasses } from '@mui/base/generateUtilityClasses';

package/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.3.0
+/** @license MUI v5.4.2
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -8,7 +8,6 @@ import * as colors from './colors';
 export { colors };
 export * from './styles';
 export * from './utils';
-export * from '@mui/base';
 export { default as Accordion } from './Accordion';
 export * from './Accordion';
 export { default as AccordionActions } from './AccordionActions';
@@ -175,6 +174,8 @@ export { default as Popover } from './Popover';
 export * from './Popover';
 export { default as Popper } from './Popper';
 export * from './Popper';
+export { default as Portal } from './Portal';
+export * from './Portal';
 export { default as Radio } from './Radio';
 export * from './Radio';
 export { default as RadioGroup } from './RadioGroup';
@@ -273,4 +274,8 @@ export * from './Zoom'; // createFilterOptions is exported from Autocomplete
 export { default as useAutocomplete } from './useAutocomplete';
 export { default as GlobalStyles } from './GlobalStyles';
 export * from './GlobalStyles';
-export { StyledEngineProvider } from './styles';
+export { StyledEngineProvider } from './styles';
+export { default as unstable_composeClasses } from '@mui/base/composeClasses';
+export { default as generateUtilityClass } from '@mui/base/generateUtilityClass';
+export * from '@mui/base/generateUtilityClass';
+export { default as generateUtilityClasses } from '@mui/base/generateUtilityClasses';