@mui/material 5.15.17 → 5.15.19

package/AlertTitle/AlertTitle.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
-import { InternalStandardProps as StandardProps, Theme } from '..';
+import { Theme, TypographyProps } from '..';
 import { AlertTitleClasses } from './alertTitleClasses';
 
-export interface AlertTitleProps extends StandardProps<React.HTMLAttributes<HTMLDivElement>> {
+export interface AlertTitleProps extends TypographyProps<'div'> {
   /**
    * The content of the component.
    */

package/Autocomplete/Autocomplete.js

@@ -4,7 +4,9 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import _extends from "@babel/runtime/helpers/esm/extends";
 var _ClearIcon, _ArrowDropDownIcon;
 const _excluded = ["autoComplete", "autoHighlight", "autoSelect", "blurOnSelect", "ChipProps", "className", "clearIcon", "clearOnBlur", "clearOnEscape", "clearText", "closeText", "componentsProps", "defaultValue", "disableClearable", "disableCloseOnSelect", "disabled", "disabledItemsFocusable", "disableListWrap", "disablePortal", "filterOptions", "filterSelectedOptions", "forcePopupIcon", "freeSolo", "fullWidth", "getLimitTagsText", "getOptionDisabled", "getOptionKey", "getOptionLabel", "isOptionEqualToValue", "groupBy", "handleHomeEndKeys", "id", "includeInputInList", "inputValue", "limitTags", "ListboxComponent", "ListboxProps", "loading", "loadingText", "multiple", "noOptionsText", "onChange", "onClose", "onHighlightChange", "onInputChange", "onOpen", "open", "openOnFocus", "openText", "options", "PaperComponent", "PopperComponent", "popupIcon", "readOnly", "renderGroup", "renderInput", "renderOption", "renderTags", "selectOnFocus", "size", "slotProps", "value"],
-  _excluded2 = ["ref"];
+  _excluded2 = ["ref"],
+  _excluded3 = ["key"],
+  _excluded4 = ["key"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -30,7 +32,6 @@ import capitalize from '../utils/capitalize';
 import useForkRef from '../utils/useForkRef';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-import { createElement as _createElement } from "react";
 const useThemeProps = createUseThemeProps('MuiAutocomplete');
 const useUtilityClasses = ownerState => {
   const {
@@ -91,21 +92,11 @@ const AutocompleteRoot = styled('div', {
     }, styles.root, fullWidth && styles.fullWidth, hasPopupIcon && styles.hasPopupIcon, hasClearIcon && styles.hasClearIcon];
   }
 })({
-  [`&.${autocompleteClasses.focused} .${autocompleteClasses.clearIndicator}`]: {
-    visibility: 'visible'
-  },
-  /* Avoid double tap issue on iOS */
-  '@media (pointer: fine)': {
-    [`&:hover .${autocompleteClasses.clearIndicator}`]: {
-      visibility: 'visible'
-    }
-  },
   [`& .${autocompleteClasses.tag}`]: {
     margin: 3,
     maxWidth: 'calc(100% - 6px)'
   },
   [`& .${autocompleteClasses.inputRoot}`]: {
-    flexWrap: 'wrap',
     [`.${autocompleteClasses.hasPopupIcon}&, .${autocompleteClasses.hasClearIcon}&`]: {
       paddingRight: 26 + 4
     },
@@ -117,6 +108,23 @@ const AutocompleteRoot = styled('div', {
       minWidth: 30
     }
   },
+  [`&.${autocompleteClasses.focused}`]: {
+    [`& .${autocompleteClasses.clearIndicator}`]: {
+      visibility: 'visible'
+    },
+    [`& .${autocompleteClasses.input}`]: {
+      minWidth: 0
+    }
+  },
+  /* Avoid double tap issue on iOS */
+  '@media (pointer: fine)': {
+    [`&:hover .${autocompleteClasses.clearIndicator}`]: {
+      visibility: 'visible'
+    },
+    [`&:hover .${autocompleteClasses.input}`]: {
+      minWidth: 0
+    }
+  },
   [`& .${inputClasses.root}`]: {
     paddingBottom: 1,
     '& .MuiInput-input': {
@@ -223,6 +231,15 @@ const AutocompleteRoot = styled('div', {
         opacity: 1
       }
     }
+  }, {
+    props: {
+      multiple: true
+    },
+    style: {
+      [`& .${autocompleteClasses.inputRoot}`]: {
+        flexWrap: 'wrap'
+      }
+    }
   }]
 });
 const AutocompleteEndAdornment = styled('div', {
@@ -525,12 +542,19 @@ const Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps
     if (renderTags) {
       startAdornment = renderTags(value, getCustomizedTagProps, ownerState);
     } else {
-      startAdornment = value.map((option, index) => /*#__PURE__*/_jsx(Chip, _extends({
-        label: getOptionLabel(option),
-        size: size
-      }, getCustomizedTagProps({
-        index
-      }), ChipProps)));
+      startAdornment = value.map((option, index) => {
+        const _getCustomizedTagProp = getCustomizedTagProps({
+            index
+          }),
+          {
+            key
+          } = _getCustomizedTagProp,
+          customTagProps = _objectWithoutPropertiesLoose(_getCustomizedTagProp, _excluded3);
+        return /*#__PURE__*/_jsx(Chip, _extends({
+          label: getOptionLabel(option),
+          size: size
+        }, customTagProps, ChipProps), key);
+      });
     }
   }
   if (limitTags > -1 && Array.isArray(startAdornment)) {
@@ -558,9 +582,13 @@ const Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps
   const renderGroup = renderGroupProp || defaultRenderGroup;
   const defaultRenderOption = (props2, option) => {
     // Need to clearly apply key because of https://github.com/vercel/next.js/issues/55642
-    return /*#__PURE__*/_createElement("li", _extends({}, props2, {
-      key: props2.key
-    }), getOptionLabel(option));
+    const {
+        key
+      } = props2,
+      otherProps = _objectWithoutPropertiesLoose(props2, _excluded4);
+    return /*#__PURE__*/_jsx("li", _extends({}, otherProps, {
+      children: getOptionLabel(option)
+    }), key);
   };
   const renderOption = renderOptionProp || defaultRenderOption;
   const renderListOption = (option, index) => {

package/CHANGELOG.md

@@ -1,5 +1,69 @@
 # [Versions](https://mui.com/versions/)
 
+## v5.15.19
+
+<!-- generated comparing v5.15.18..master -->
+
+_May 29, 2024_
+
+A big thanks to the 12 contributors who made this release possible.
+This release was mostly about 🐛 bug fixes and 📚 documentation improvements.
+
+### `@mui/material@5.15.19`
+
+- &#8203;<!-- 19 -->[AlertTitle] Enable extending Typography props (@lucasgmelo) (#42334) @github-actions[bot]
+- &#8203;<!-- 06 -->[responsiveFontSizes] Handled undefined variants (@brijeshb42) (#42419) @github-actions[bot]
+- &#8203;<!-- 05 -->[Slider] Fix wrong CSS value (@mnajdova) (#42373) @github-actions[bot]
+
+### Docs
+
+- &#8203;<!-- 13 -->Link to pnpm installation docs (#42420) @aarongarciah
+- &#8203;<!-- 12 -->Remove LocalMonero (@oliviertassinari) (#42315) @github-actions[bot]
+- &#8203;<!-- 10 -->[material-ui] Fix typo in style interoperability with Tailwind CSS docs (@ZeeshanTamboli) (#42312) @github-actions[bot]
+- &#8203;<!-- 09 -->[material-ui][Pagination] Clarify pagination `page` prop API (@Mandar-Pandya) (#42265) @github-actions[bot]
+- &#8203;<!-- 08 -->[material-ui][Tabs] Improve the Basic Tabs demo (@MatheusEli) (#42426) @github-actions[bot]
+- &#8203;<!-- 07 -->[pigment-css] Fix duplication of content (#42410) @oliviertassinari
+
+### Core
+
+- &#8203;<!-- 18 -->[blog] Add the "Product" tag to the Pigment CSS post (@danilo-leal) (#42366) @github-actions[bot]
+- &#8203;<!-- 17 -->[blog] Update blog post OG image (@danilo-leal) (#42306) @github-actions[bot]
+- &#8203;<!-- 16 -->[blog] Update Pigment CSS post (@danilo-leal) (#42267) @github-actions[bot]
+- &#8203;<!-- 15 -->[core] Fix React 18.3 warnings about spreading keys in the Material UI `Autocomplete` component (#42099) (#42241) @DiegoAndai
+- &#8203;<!-- 14 -->[core] Fix a few more key spread issues (@oliviertassinari) (#42318) @github-actions[bot]
+- &#8203;<!-- 11 -->[docs-infra] Allow JSDoc tags (#42327) @aarongarciah
+- &#8203;<!-- 04 -->[website] Add Nikita to the about page (@nikitaa24) (#42421) @github-actions[bot]
+- &#8203;<!-- 03 -->[website] Fix hero spacing changes applying at the wrong breakpoint (@KenanYusuf) (#42357) @github-actions[bot]
+- &#8203;<!-- 02 -->[website] Adds Kenan Yusuf to about page (@KenanYusuf) (#42330) @github-actions[bot]
+- &#8203;<!-- 01 -->[website] Improve about page @oliviertassinari
+
+All contributors of this release in alphabetical order: @aarongarciah, @brijeshb42, @danilo-leal, @DiegoAndai, @KenanYusuf, @lucasgmelo, @Mandar-Pandya, @MatheusEli, @mnajdova, @nikitaa24, @oliviertassinari, @ZeeshanTamboli
+
+## v5.15.18
+
+<!-- generated comparing v5.15.17..master -->
+
+_May 14, 2024_
+
+A big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
+
+### `@mui/material@5.15.18`
+
+- &#8203;<!-- 6 -->[Autocomplete] Improve design when there's a start adornment for small autocomplete (@TahaRhidouani) (#42176) @github-actions[bot]
+- &#8203;<!-- 3 -->[ToggleButtonGroup] Add missing `selected` class in ToggleButtonGroupClasses type (@tarunrajput) (#42250) @github-actions[bot]
+
+### Docs
+
+- &#8203;<!-- 4 -->[docs] Fix 301 to Figma @oliviertassinari
+
+### Core
+
+- &#8203;<!-- 5 -->[blog] Introducing Pigment CSS blog post (#42198) (#42255) @samuelsycamore
+- &#8203;<!-- 2 -->[website] Add redirection for talk @oliviertassinari
+- &#8203;<!-- 1 -->[website] Adds Arthur Balduini team info (@arthurbalduini) (#42226) @github-actions[bot]
+
+All contributors of this release in alphabetical order: @arthurbalduini, @oliviertassinari, @samuelsycamore, @TahaRhidouani, @tarunrajput
+
 ## v5.15.17
 
 <!-- generated comparing v5.15.16..master -->

package/Hidden/Hidden.d.ts

@@ -90,6 +90,8 @@ export interface HiddenProps {
  * API:
  *
  * - [Hidden API](https://mui.com/material-ui/api/hidden/)
+ *
+ * @deprecated The Hidden component was deprecated in Material UI v5. To learn more, see [the Hidden section](/material-ui/migration/v5-component-changes/#hidden) of the migration docs.
  */
 declare const Hidden: React.JSXElementConstructor<HiddenProps>;
 

package/Hidden/Hidden.js

@@ -10,6 +10,8 @@ import HiddenCss from './HiddenCss';
 
 /**
  * Responsively hides children based on the selected implementation.
+ *
+ * @deprecated The Hidden component was deprecated in Material UI v5. To learn more, see [the Hidden section](/material-ui/migration/v5-component-changes/#hidden) of the migration docs.
  */
 import { jsx as _jsx } from "react/jsx-runtime";
 function Hidden(props) {

package/Pagination/Pagination.js

@@ -193,7 +193,7 @@ process.env.NODE_ENV !== "production" ? Pagination.propTypes /* remove-proptypes
    */
   onChange: PropTypes.func,
   /**
-   * The current page.
+   * The current page. Unlike `TablePagination`, which starts numbering from `0`, this pagination starts from `1`.
    */
   page: integerPropType,
   /**

package/Slider/Slider.js

@@ -337,7 +337,7 @@ export const SliderThumb = styled('span', {
           }
         }),
         [`&.${sliderClasses.active}`]: _extends({}, theme.vars ? {
-          boxShadow: `0px 0px 0px 14px rgba(${theme.vars.palette[color].mainChannel} / 0.16)}`
+          boxShadow: `0px 0px 0px 14px rgba(${theme.vars.palette[color].mainChannel} / 0.16)`
         } : {
           boxShadow: `0px 0px 0px 14px ${alpha(theme.palette[color].main, 0.16)}`
         })

package/ToggleButtonGroup/toggleButtonGroupClasses.d.ts

@@ -1,6 +1,10 @@
 export interface ToggleButtonGroupClasses {
     /** Styles applied to the root element. */
     root: string;
+    /** State class applied to the root element if `selected={true}`. */
+    selected: string;
+    /** Styles applied to the root element if `orientation="horizontal"`. */
+    horizontal: string;
     /** Styles applied to the root element if `orientation="vertical"`. */
     vertical: string;
     /** State class applied to the root element if `disabled={true}`. */

package/ToggleButtonGroup/toggleButtonGroupClasses.js

@@ -3,5 +3,5 @@ import generateUtilityClass from '@mui/utils/generateUtilityClass';
 export function getToggleButtonGroupUtilityClass(slot) {
   return generateUtilityClass('MuiToggleButtonGroup', slot);
 }
-const toggleButtonGroupClasses = generateUtilityClasses('MuiToggleButtonGroup', ['root', 'selected', 'vertical', 'disabled', 'grouped', 'groupedHorizontal', 'groupedVertical', 'fullWidth', 'firstButton', 'lastButton', 'middleButton']);
+const toggleButtonGroupClasses = generateUtilityClasses('MuiToggleButtonGroup', ['root', 'selected', 'horizontal', 'vertical', 'disabled', 'grouped', 'groupedHorizontal', 'groupedVertical', 'fullWidth', 'firstButton', 'lastButton', 'middleButton']);
 export default toggleButtonGroupClasses;

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v5.15.17
+ * @mui/material v5.15.19
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/legacy/Autocomplete/Autocomplete.js

@@ -29,7 +29,6 @@ import capitalize from '../utils/capitalize';
 import useForkRef from '../utils/useForkRef';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-import { createElement as _createElement } from "react";
 var useThemeProps = createUseThemeProps('MuiAutocomplete');
 var useUtilityClasses = function useUtilityClasses(ownerState) {
   var classes = ownerState.classes,
@@ -73,22 +72,24 @@ var AutocompleteRoot = styled('div', {
       size = ownerState.size;
     return [_defineProperty({}, "& .".concat(autocompleteClasses.tag), styles.tag), _defineProperty({}, "& .".concat(autocompleteClasses.tag), styles["tagSize".concat(capitalize(size))]), _defineProperty({}, "& .".concat(autocompleteClasses.inputRoot), styles.inputRoot), _defineProperty({}, "& .".concat(autocompleteClasses.input), styles.input), _defineProperty({}, "& .".concat(autocompleteClasses.input), inputFocused && styles.inputFocused), styles.root, fullWidth && styles.fullWidth, hasPopupIcon && styles.hasPopupIcon, hasClearIcon && styles.hasClearIcon];
   }
-})((_styled = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_styled, "&.".concat(autocompleteClasses.focused, " .").concat(autocompleteClasses.clearIndicator), {
-  visibility: 'visible'
-}), '@media (pointer: fine)', _defineProperty({}, "&:hover .".concat(autocompleteClasses.clearIndicator), {
-  visibility: 'visible'
-})), "& .".concat(autocompleteClasses.tag), {
+})((_styled = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_styled, "& .".concat(autocompleteClasses.tag), {
   margin: 3,
   maxWidth: 'calc(100% - 6px)'
-}), "& .".concat(autocompleteClasses.inputRoot), _defineProperty(_defineProperty(_defineProperty({
-  flexWrap: 'wrap'
-}, ".".concat(autocompleteClasses.hasPopupIcon, "&, .").concat(autocompleteClasses.hasClearIcon, "&"), {
+}), "& .".concat(autocompleteClasses.inputRoot), _defineProperty(_defineProperty(_defineProperty({}, ".".concat(autocompleteClasses.hasPopupIcon, "&, .").concat(autocompleteClasses.hasClearIcon, "&"), {
   paddingRight: 26 + 4
 }), ".".concat(autocompleteClasses.hasPopupIcon, ".").concat(autocompleteClasses.hasClearIcon, "&"), {
   paddingRight: 52 + 4
 }), "& .".concat(autocompleteClasses.input), {
   width: 0,
   minWidth: 30
+})), "&.".concat(autocompleteClasses.focused), _defineProperty(_defineProperty({}, "& .".concat(autocompleteClasses.clearIndicator), {
+  visibility: 'visible'
+}), "& .".concat(autocompleteClasses.input), {
+  minWidth: 0
+})), '@media (pointer: fine)', _defineProperty(_defineProperty({}, "&:hover .".concat(autocompleteClasses.clearIndicator), {
+  visibility: 'visible'
+}), "&:hover .".concat(autocompleteClasses.input), {
+  minWidth: 0
 })), "& .".concat(inputClasses.root), {
   paddingBottom: 1,
   '& .MuiInput-input': {
@@ -166,6 +167,13 @@ var AutocompleteRoot = styled('div', {
   style: _defineProperty({}, "& .".concat(autocompleteClasses.input), {
     opacity: 1
   })
+}, {
+  props: {
+    multiple: true
+  },
+  style: _defineProperty({}, "& .".concat(autocompleteClasses.inputRoot), {
+    flexWrap: 'wrap'
+  })
 }])));
 var AutocompleteEndAdornment = styled('div', {
   name: 'MuiAutocomplete',
@@ -527,12 +535,15 @@ var Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps,
       startAdornment = renderTags(value, getCustomizedTagProps, ownerState);
     } else {
       startAdornment = value.map(function (option, index) {
+        var _getCustomizedTagProp = getCustomizedTagProps({
+            index: index
+          }),
+          key = _getCustomizedTagProp.key,
+          customTagProps = _objectWithoutProperties(_getCustomizedTagProp, ["key"]);
         return /*#__PURE__*/_jsx(Chip, _extends({
           label: getOptionLabel(option),
           size: size
-        }, getCustomizedTagProps({
-          index: index
-        }), ChipProps));
+        }, customTagProps, ChipProps), key);
       });
     }
   }
@@ -563,9 +574,11 @@ var Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps,
   var renderGroup = renderGroupProp || defaultRenderGroup;
   var defaultRenderOption = function defaultRenderOption(props2, option) {
     // Need to clearly apply key because of https://github.com/vercel/next.js/issues/55642
-    return /*#__PURE__*/_createElement("li", _extends({}, props2, {
-      key: props2.key
-    }), getOptionLabel(option));
+    var key = props2.key,
+      otherProps = _objectWithoutProperties(props2, ["key"]);
+    return /*#__PURE__*/_jsx("li", _extends({}, otherProps, {
+      children: getOptionLabel(option)
+    }), key);
   };
   var renderOption = renderOptionProp || defaultRenderOption;
   var renderListOption = function renderListOption(option, index) {

package/legacy/Hidden/Hidden.js

@@ -9,6 +9,8 @@ import HiddenCss from './HiddenCss';
 
 /**
  * Responsively hides children based on the selected implementation.
+ *
+ * @deprecated The Hidden component was deprecated in Material UI v5. To learn more, see [the Hidden section](/material-ui/migration/v5-component-changes/#hidden) of the migration docs.
  */
 import { jsx as _jsx } from "react/jsx-runtime";
 function Hidden(props) {

package/legacy/Pagination/Pagination.js

@@ -208,7 +208,7 @@ process.env.NODE_ENV !== "production" ? Pagination.propTypes /* remove-proptypes
    */
   onChange: PropTypes.func,
   /**
-   * The current page.
+   * The current page. Unlike `TablePagination`, which starts numbering from `0`, this pagination starts from `1`.
    */
   page: integerPropType,
   /**

package/legacy/Slider/Slider.js

@@ -332,7 +332,7 @@ export var SliderThumb = styled('span', {
           boxShadow: 'none'
         }
       })), "&.".concat(sliderClasses.active), _extends({}, theme.vars ? {
-        boxShadow: "0px 0px 0px 14px rgba(".concat(theme.vars.palette[color].mainChannel, " / 0.16)}")
+        boxShadow: "0px 0px 0px 14px rgba(".concat(theme.vars.palette[color].mainChannel, " / 0.16)")
       } : {
         boxShadow: "0px 0px 0px 14px ".concat(alpha(theme.palette[color].main, 0.16))
       }))

package/legacy/ToggleButtonGroup/toggleButtonGroupClasses.js

@@ -3,5 +3,5 @@ import generateUtilityClass from '@mui/utils/generateUtilityClass';
 export function getToggleButtonGroupUtilityClass(slot) {
   return generateUtilityClass('MuiToggleButtonGroup', slot);
 }
-var toggleButtonGroupClasses = generateUtilityClasses('MuiToggleButtonGroup', ['root', 'selected', 'vertical', 'disabled', 'grouped', 'groupedHorizontal', 'groupedVertical', 'fullWidth', 'firstButton', 'lastButton', 'middleButton']);
+var toggleButtonGroupClasses = generateUtilityClasses('MuiToggleButtonGroup', ['root', 'selected', 'horizontal', 'vertical', 'disabled', 'grouped', 'groupedHorizontal', 'groupedVertical', 'fullWidth', 'firstButton', 'lastButton', 'middleButton']);
 export default toggleButtonGroupClasses;

package/legacy/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v5.15.17
+ * @mui/material v5.15.19
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/legacy/styles/responsiveFontSizes.js

@@ -23,6 +23,9 @@ export default function responsiveFontSizes(themeInput) {
   });
   variants.forEach(function (variant) {
     var style = typography[variant];
+    if (!style) {
+      return;
+    }
     var remFontSize = parseFloat(convert(style.fontSize, 'rem'));
     if (remFontSize <= 1) {
       return;

package/modern/Autocomplete/Autocomplete.js

@@ -4,7 +4,9 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import _extends from "@babel/runtime/helpers/esm/extends";
 var _ClearIcon, _ArrowDropDownIcon;
 const _excluded = ["autoComplete", "autoHighlight", "autoSelect", "blurOnSelect", "ChipProps", "className", "clearIcon", "clearOnBlur", "clearOnEscape", "clearText", "closeText", "componentsProps", "defaultValue", "disableClearable", "disableCloseOnSelect", "disabled", "disabledItemsFocusable", "disableListWrap", "disablePortal", "filterOptions", "filterSelectedOptions", "forcePopupIcon", "freeSolo", "fullWidth", "getLimitTagsText", "getOptionDisabled", "getOptionKey", "getOptionLabel", "isOptionEqualToValue", "groupBy", "handleHomeEndKeys", "id", "includeInputInList", "inputValue", "limitTags", "ListboxComponent", "ListboxProps", "loading", "loadingText", "multiple", "noOptionsText", "onChange", "onClose", "onHighlightChange", "onInputChange", "onOpen", "open", "openOnFocus", "openText", "options", "PaperComponent", "PopperComponent", "popupIcon", "readOnly", "renderGroup", "renderInput", "renderOption", "renderTags", "selectOnFocus", "size", "slotProps", "value"],
-  _excluded2 = ["ref"];
+  _excluded2 = ["ref"],
+  _excluded3 = ["key"],
+  _excluded4 = ["key"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -30,7 +32,6 @@ import capitalize from '../utils/capitalize';
 import useForkRef from '../utils/useForkRef';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-import { createElement as _createElement } from "react";
 const useThemeProps = createUseThemeProps('MuiAutocomplete');
 const useUtilityClasses = ownerState => {
   const {
@@ -91,21 +92,11 @@ const AutocompleteRoot = styled('div', {
     }, styles.root, fullWidth && styles.fullWidth, hasPopupIcon && styles.hasPopupIcon, hasClearIcon && styles.hasClearIcon];
   }
 })({
-  [`&.${autocompleteClasses.focused} .${autocompleteClasses.clearIndicator}`]: {
-    visibility: 'visible'
-  },
-  /* Avoid double tap issue on iOS */
-  '@media (pointer: fine)': {
-    [`&:hover .${autocompleteClasses.clearIndicator}`]: {
-      visibility: 'visible'
-    }
-  },
   [`& .${autocompleteClasses.tag}`]: {
     margin: 3,
     maxWidth: 'calc(100% - 6px)'
   },
   [`& .${autocompleteClasses.inputRoot}`]: {
-    flexWrap: 'wrap',
     [`.${autocompleteClasses.hasPopupIcon}&, .${autocompleteClasses.hasClearIcon}&`]: {
       paddingRight: 26 + 4
     },
@@ -117,6 +108,23 @@ const AutocompleteRoot = styled('div', {
       minWidth: 30
     }
   },
+  [`&.${autocompleteClasses.focused}`]: {
+    [`& .${autocompleteClasses.clearIndicator}`]: {
+      visibility: 'visible'
+    },
+    [`& .${autocompleteClasses.input}`]: {
+      minWidth: 0
+    }
+  },
+  /* Avoid double tap issue on iOS */
+  '@media (pointer: fine)': {
+    [`&:hover .${autocompleteClasses.clearIndicator}`]: {
+      visibility: 'visible'
+    },
+    [`&:hover .${autocompleteClasses.input}`]: {
+      minWidth: 0
+    }
+  },
   [`& .${inputClasses.root}`]: {
     paddingBottom: 1,
     '& .MuiInput-input': {
@@ -223,6 +231,15 @@ const AutocompleteRoot = styled('div', {
         opacity: 1
       }
     }
+  }, {
+    props: {
+      multiple: true
+    },
+    style: {
+      [`& .${autocompleteClasses.inputRoot}`]: {
+        flexWrap: 'wrap'
+      }
+    }
   }]
 });
 const AutocompleteEndAdornment = styled('div', {
@@ -521,12 +538,19 @@ const Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps
     if (renderTags) {
       startAdornment = renderTags(value, getCustomizedTagProps, ownerState);
     } else {
-      startAdornment = value.map((option, index) => /*#__PURE__*/_jsx(Chip, _extends({
-        label: getOptionLabel(option),
-        size: size
-      }, getCustomizedTagProps({
-        index
-      }), ChipProps)));
+      startAdornment = value.map((option, index) => {
+        const _getCustomizedTagProp = getCustomizedTagProps({
+            index
+          }),
+          {
+            key
+          } = _getCustomizedTagProp,
+          customTagProps = _objectWithoutPropertiesLoose(_getCustomizedTagProp, _excluded3);
+        return /*#__PURE__*/_jsx(Chip, _extends({
+          label: getOptionLabel(option),
+          size: size
+        }, customTagProps, ChipProps), key);
+      });
     }
   }
   if (limitTags > -1 && Array.isArray(startAdornment)) {
@@ -554,9 +578,13 @@ const Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps
   const renderGroup = renderGroupProp || defaultRenderGroup;
   const defaultRenderOption = (props2, option) => {
     // Need to clearly apply key because of https://github.com/vercel/next.js/issues/55642
-    return /*#__PURE__*/_createElement("li", _extends({}, props2, {
-      key: props2.key
-    }), getOptionLabel(option));
+    const {
+        key
+      } = props2,
+      otherProps = _objectWithoutPropertiesLoose(props2, _excluded4);
+    return /*#__PURE__*/_jsx("li", _extends({}, otherProps, {
+      children: getOptionLabel(option)
+    }), key);
   };
   const renderOption = renderOptionProp || defaultRenderOption;
   const renderListOption = (option, index) => {

package/modern/Hidden/Hidden.js

@@ -10,6 +10,8 @@ import HiddenCss from './HiddenCss';
 
 /**
  * Responsively hides children based on the selected implementation.
+ *
+ * @deprecated The Hidden component was deprecated in Material UI v5. To learn more, see [the Hidden section](/material-ui/migration/v5-component-changes/#hidden) of the migration docs.
  */
 import { jsx as _jsx } from "react/jsx-runtime";
 function Hidden(props) {

package/modern/Pagination/Pagination.js

@@ -193,7 +193,7 @@ process.env.NODE_ENV !== "production" ? Pagination.propTypes /* remove-proptypes
    */
   onChange: PropTypes.func,
   /**
-   * The current page.
+   * The current page. Unlike `TablePagination`, which starts numbering from `0`, this pagination starts from `1`.
    */
   page: integerPropType,
   /**

package/modern/Slider/Slider.js

@@ -322,7 +322,7 @@ export const SliderThumb = styled('span', {
         }
       }),
       [`&.${sliderClasses.active}`]: _extends({}, theme.vars ? {
-        boxShadow: `0px 0px 0px 14px rgba(${theme.vars.palette[color].mainChannel} / 0.16)}`
+        boxShadow: `0px 0px 0px 14px rgba(${theme.vars.palette[color].mainChannel} / 0.16)`
       } : {
         boxShadow: `0px 0px 0px 14px ${alpha(theme.palette[color].main, 0.16)}`
       })

package/modern/ToggleButtonGroup/toggleButtonGroupClasses.js

@@ -3,5 +3,5 @@ import generateUtilityClass from '@mui/utils/generateUtilityClass';
 export function getToggleButtonGroupUtilityClass(slot) {
   return generateUtilityClass('MuiToggleButtonGroup', slot);
 }
-const toggleButtonGroupClasses = generateUtilityClasses('MuiToggleButtonGroup', ['root', 'selected', 'vertical', 'disabled', 'grouped', 'groupedHorizontal', 'groupedVertical', 'fullWidth', 'firstButton', 'lastButton', 'middleButton']);
+const toggleButtonGroupClasses = generateUtilityClasses('MuiToggleButtonGroup', ['root', 'selected', 'horizontal', 'vertical', 'disabled', 'grouped', 'groupedHorizontal', 'groupedVertical', 'fullWidth', 'firstButton', 'lastButton', 'middleButton']);
 export default toggleButtonGroupClasses;

package/modern/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v5.15.17
+ * @mui/material v5.15.19
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/modern/styles/responsiveFontSizes.js

@@ -18,6 +18,9 @@ export default function responsiveFontSizes(themeInput, options = {}) {
   const breakpointValues = breakpoints.map(x => theme.breakpoints.values[x]);
   variants.forEach(variant => {
     const style = typography[variant];
+    if (!style) {
+      return;
+    }
     const remFontSize = parseFloat(convert(style.fontSize, 'rem'));
     if (remFontSize <= 1) {
       return;