@mui/material 5.15.11 → 5.15.12

package/Checkbox/Checkbox.d.ts

@@ -91,7 +91,7 @@ export interface CheckboxProps
    * `small` is equivalent to the dense checkbox styling.
    * @default 'medium'
    */
-  size?: OverridableStringUnion<'small' | 'medium', CheckboxPropsSizeOverrides>;
+  size?: OverridableStringUnion<'small' | 'medium' | 'large', CheckboxPropsSizeOverrides>;
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */

package/Chip/chipClasses.d.ts

@@ -21,71 +21,123 @@ export interface ChipClasses {
     disabled: string;
     /** Styles applied to the root element if `onClick` is defined or `clickable={true}`. */
     clickable: string;
-    /** Styles applied to the root element if `onClick` and `color="primary"` is defined or `clickable={true}`. */
+    /** Styles applied to the root element if `onClick` and `color="primary"` is defined or `clickable={true}`.
+     * @deprecated Combine the [.MuiChip-clickable](/material-ui/api/chip/#chip-classes-clickable) and [.MuiChip-colorPrimary](/material-ui/api/chip/#chip-classes-colorPrimary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     clickableColorPrimary: string;
-    /** Styles applied to the root element if `onClick` and `color="secondary"` is defined or `clickable={true}`. */
+    /** Styles applied to the root element if `onClick` and `color="secondary"` is defined or `clickable={true}`.
+     * @deprecated Combine the [.MuiChip-clickable](/material-ui/api/chip/#chip-classes-clickable) and [.MuiChip-colorSecondary](/material-ui/api/chip/#chip-classes-colorSecondary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     clickableColorSecondary: string;
     /** Styles applied to the root element if `onDelete` is defined. */
     deletable: string;
-    /** Styles applied to the root element if `onDelete` and `color="primary"` is defined. */
+    /** Styles applied to the root element if `onDelete` and `color="primary"` is defined.
+     * @deprecated Combine the [.MuiChip-deletable](/material-ui/api/chip/#chip-classes-deletable) and [.MuiChip-colorPrimary](/material-ui/api/chip/#chip-classes-colorPrimary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     deletableColorPrimary: string;
-    /** Styles applied to the root element if `onDelete` and `color="secondary"` is defined. */
+    /** Styles applied to the root element if `onDelete` and `color="secondary"` is defined.
+     * @deprecated Combine the [.MuiChip-deletable](/material-ui/api/chip/#chip-classes-deletable) and [.MuiChip-colorSecondary](/material-ui/api/chip/#chip-classes-colorSecondary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     deletableColorSecondary: string;
     /** Styles applied to the root element if `variant="outlined"`. */
     outlined: string;
     /** Styles applied to the root element if `variant="filled"`. */
     filled: string;
-    /** Styles applied to the root element if `variant="outlined"` and `color="primary"`. */
+    /** Styles applied to the root element if `variant="outlined"` and `color="primary"`.
+     * @deprecated Combine the [.MuiChip-outlined](/material-ui/api/chip/#chip-classes-outlined) and [.MuiChip-colorPrimary](/material-ui/api/chip/#chip-classes-colorPrimary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     outlinedPrimary: string;
-    /** Styles applied to the root element if `variant="outlined"` and `color="secondary"`. */
+    /** Styles applied to the root element if `variant="outlined"` and `color="secondary"`.
+     * @deprecated Combine the [.MuiChip-outlined](/material-ui/api/chip/#chip-classes-outlined) and [.MuiChip-colorSecondary](/material-ui/api/chip/#chip-classes-colorSecondary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     outlinedSecondary: string;
-    /** Styles applied to the root element if `variant="filled"` and `color="primary"`. */
+    /** Styles applied to the root element if `variant="filled"` and `color="primary"`.
+     * @deprecated Combine the [.MuiChip-filled](/material-ui/api/chip/#chip-classes-filled) and [.MuiChip-colorPrimary](/material-ui/api/chip/#chip-classes-colorPrimary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     filledPrimary: string;
-    /** Styles applied to the root element if `variant="filled"` and `color="secondary"`. */
+    /** Styles applied to the root element if `variant="filled"` and `color="secondary"`.
+     * @deprecated Combine the [.MuiChip-filled](/material-ui/api/chip/#chip-classes-filled) and [.MuiChip-colorSecondary](/material-ui/api/chip/#chip-classes-colorSecondary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     filledSecondary: string;
     /** Styles applied to the avatar element. */
     avatar: string;
-    /** Styles applied to the avatar element if `size="small"`. */
+    /** Styles applied to the avatar element if `size="small"`.
+     * @deprecated Combine the [.MuiChip-avatar](/material-ui/api/chip/#chip-classes-avatar) and [.MuiChip-sizeSmall](/material-ui/api/chip/#chip-classes-sizeSmall) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     avatarSmall: string;
-    /** Styles applied to the avatar element if `size="medium"`. */
+    /** Styles applied to the avatar element if `size="medium"`.
+     * @deprecated Combine the [.MuiChip-avatar](/material-ui/api/chip/#chip-classes-avatar) and [.MuiChip-sizeMedium](/material-ui/api/chip/#chip-classes-sizeMedium) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     avatarMedium: string;
-    /** Styles applied to the avatar element if `color="primary"`. */
+    /** Styles applied to the avatar element if `color="primary"`.
+     * @deprecated Combine the [.MuiChip-avatar](/material-ui/api/chip/#chip-classes-avatar) and [.MuiChip-colorPrimary](/material-ui/api/chip/#chip-classes-colorPrimary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     avatarColorPrimary: string;
-    /** Styles applied to the avatar element if `color="secondary"`. */
+    /** Styles applied to the avatar element if `color="secondary"`.
+     * @deprecated Combine the [.MuiChip-avatar](/material-ui/api/chip/#chip-classes-avatar) and [.MuiChip-colorSecondary](/material-ui/api/chip/#chip-classes-colorSecondary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     avatarColorSecondary: string;
     /** Styles applied to the icon element. */
     icon: string;
-    /** Styles applied to the icon element if `size="small"`. */
+    /** Styles applied to the icon element if `size="small"`.
+     * @deprecated Combine the [.MuiChip-icon](/material-ui/api/chip/#chip-classes-icon) and [.MuiChip-sizeSmall](/material-ui/api/chip/#chip-classes-sizeSmall) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     iconSmall: string;
-    /** Styles applied to the icon element if `size="medium"`. */
+    /** Styles applied to the icon element if `size="medium"`.
+     * @deprecated Combine the [.MuiChip-icon](/material-ui/api/chip/#chip-classes-icon) and [.MuiChip-sizeMedium](/material-ui/api/chip/#chip-classes-sizeMedium) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     iconMedium: string;
-    /** Styles applied to the icon element if `color="primary"`. */
+    /** Styles applied to the icon element if `color="primary"`.
+     * @deprecated Combine the [.MuiChip-icon](/material-ui/api/chip/#chip-classes-icon) and [.MuiChip-colorPrimary](/material-ui/api/chip/#chip-classes-colorPrimary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     iconColorPrimary: string;
-    /** Styles applied to the icon element if `color="secondary"`. */
+    /** Styles applied to the icon element if `color="secondary"`.
+     * @deprecated Combine the [.MuiChip-icon](/material-ui/api/chip/#chip-classes-icon) and [.MuiChip-colorSecondary](/material-ui/api/chip/#chip-classes-colorSecondary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     iconColorSecondary: string;
     /** Styles applied to the label `span` element. */
     label: string;
-    /** Styles applied to the label `span` element if `size="small"`. */
+    /** Styles applied to the label `span` element if `size="small"`.
+     * @deprecated Combine the [.MuiChip-label](/material-ui/api/chip/#chip-classes-label) and [.MuiChip-sizeSmall](/material-ui/api/chip/#chip-classes-sizeSmall) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     labelSmall: string;
-    /** Styles applied to the label `span` element if `size="medium"`. */
+    /** Styles applied to the label `span` element if `size="medium"`.
+     * @deprecated Combine the [.MuiChip-label](/material-ui/api/chip/#chip-classes-label) and [.MuiChip-sizeMedium](/material-ui/api/chip/#chip-classes-sizeMedium) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     labelMedium: string;
     /** Styles applied to the deleteIcon element. */
     deleteIcon: string;
-    /** Styles applied to the deleteIcon element if `size="small"`. */
+    /** Styles applied to the deleteIcon element if `size="small"`.
+     * @deprecated Combine the [.MuiChip-deleteIcon](/material-ui/api/chip/#chip-classes-deleteIcon) and [.MuiChip-sizeSmall](/material-ui/api/chip/#chip-classes-sizeSmall) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     deleteIconSmall: string;
-    /** Styles applied to the deleteIcon element if `size="medium"`. */
+    /** Styles applied to the deleteIcon element if `size="medium"`.
+     * @deprecated Combine the [.MuiChip-deleteIcon](/material-ui/api/chip/#chip-classes-deleteIcon) and [.MuiChip-sizeMedium](/material-ui/api/chip/#chip-classes-sizeMedium) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     deleteIconMedium: string;
-    /** Styles applied to the deleteIcon element if `color="primary"` and `variant="filled"`. */
+    /** Styles applied to the deleteIcon element if `color="primary"`.
+     * @deprecated Combine the [.MuiChip-deleteIcon](/material-ui/api/chip/#chip-classes-deleteIcon) and [.MuiChip-colorPrimary](/material-ui/api/chip/#chip-classes-colorPrimary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     deleteIconColorPrimary: string;
-    /** Styles applied to the deleteIcon element if `color="secondary"` and `variant="filled"`. */
+    /** Styles applied to the deleteIcon element if `color="secondary"`.
+     * @deprecated Combine the [.MuiChip-deleteIcon](/material-ui/api/chip/#chip-classes-deleteIcon) and [.MuiChip-colorSecondary](/material-ui/api/chip/#chip-classes-colorSecondary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     deleteIconColorSecondary: string;
-    /** Styles applied to the deleteIcon element if `color="primary"` and `variant="outlined"`. */
+    /** Styles applied to the deleteIcon element if `color="primary"` and `variant="outlined"`.
+     * @deprecated Combine the [.MuiChip-deleteIcon](/material-ui/api/chip/#chip-classes-deleteIcon) , [.MuiChip-outlined](/material-ui/api/chip/#chip-classes-outlined) and [.MuiChip-colorPrimary](/material-ui/api/chip/#chip-classes-colorPrimary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     deleteIconOutlinedColorPrimary: string;
-    /** Styles applied to the deleteIcon element if `color="secondary"` and `variant="outlined"`. */
+    /** Styles applied to the deleteIcon element if `color="secondary"` and `variant="outlined"`.
+     * @deprecated Combine the [.MuiChip-deleteIcon](/material-ui/api/chip/#chip-classes-deleteIcon) , [.MuiChip-outlined](/material-ui/api/chip/#chip-classes-outlined) and [.MuiChip-colorSecondary](/material-ui/api/chip/#chip-classes-colorSecondary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     deleteIconOutlinedColorSecondary: string;
-    /** Styles applied to the deleteIcon element if `color="primary"` and `variant="filled"`. */
+    /** Styles applied to the deleteIcon element if `color="primary"` and `variant="filled"`.
+     * @deprecated Combine the [.MuiChip-deleteIcon](/material-ui/api/chip/#chip-classes-deleteIcon) , [.MuiChip-filled](/material-ui/api/chip/#chip-classes-filled) and [.MuiChip-colorPrimary](/material-ui/api/chip/#chip-classes-colorPrimary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     deleteIconFilledColorPrimary: string;
-    /** Styles applied to the deleteIcon element if `color="secondary"` and `variant="filled"`. */
+    /** Styles applied to the deleteIcon element if `color="secondary"` and `variant="filled"`.
+     * @deprecated Combine the [.MuiChip-deleteIcon](/material-ui/api/chip/#chip-classes-deleteIcon) , [.MuiChip-filled](/material-ui/api/chip/#chip-classes-filled) and [.MuiChip-colorSecondary](/material-ui/api/chip/#chip-classes-colorSecondary) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     */
     deleteIconFilledColorSecondary: string;
     /** State class applied to the root element if keyboard focused. */
     focusVisible: string;

package/README.md

@@ -22,7 +22,7 @@ Visit [https://mui.com/material-ui/](https://mui.com/material-ui/) to view the f
 ## Questions
 
 For how-to questions that don't involve making changes to the code base, please use [Stack Overflow](https://stackoverflow.com/questions/tagged/material-ui) instead of GitHub issues.
-Use the "material-ui" tag on Stack Overflow to make it easier for the community to find your question.
+Use the "material-ui" tag on Stack Overflow to make it easier for the community to find your question.
 
 ## Examples
 

package/Slider/Slider.d.ts

@@ -46,8 +46,7 @@ export interface SliderOwnProps {
   /**
    * The components used for each slot inside.
    *
-   * This prop is an alias for the `slots` prop.
-   * It's recommended to use the `slots` prop instead.
+   * @deprecated use the `slots` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
    *
    * @default {}
    */
@@ -65,8 +64,7 @@ export interface SliderOwnProps {
    * The extra props for the slot components.
    * You can override the existing props or add new ones.
    *
-   * This prop is an alias for the `slotProps` prop.
-   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
+   * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
    *
    * @default {}
    */

package/Slider/Slider.js

@@ -633,8 +633,7 @@ process.env.NODE_ENV !== "production" ? Slider.propTypes /* remove-proptypes */
   /**
    * The components used for each slot inside.
    *
-   * This prop is an alias for the `slots` prop.
-   * It's recommended to use the `slots` prop instead.
+   * @deprecated use the `slots` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
    *
    * @default {}
    */
@@ -652,8 +651,7 @@ process.env.NODE_ENV !== "production" ? Slider.propTypes /* remove-proptypes */
    * The extra props for the slot components.
    * You can override the existing props or add new ones.
    *
-   * This prop is an alias for the `slotProps` prop.
-   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
+   * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
    *
    * @default {}
    */

package/index.js

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

package/legacy/Alert/Alert.js

@@ -1,16 +1,16 @@
 'use client';
 
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/base';
-import { darken, lighten } from '@mui/system';
-import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import composeClasses from '@mui/utils/composeClasses';
+import { darken, lighten } from '@mui/system/colorManipulator';
+import { styled, createUseThemeProps } from '../zero-styled';
 import useSlot from '../utils/useSlot';
 import capitalize from '../utils/capitalize';
 import Paper from '../Paper';
@@ -23,13 +23,14 @@ import InfoOutlinedIcon from '../internal/svg-icons/InfoOutlined';
 import CloseIcon from '../internal/svg-icons/Close';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
+var useThemeProps = createUseThemeProps('MuiAlert');
 var useUtilityClasses = function useUtilityClasses(ownerState) {
   var variant = ownerState.variant,
     color = ownerState.color,
     severity = ownerState.severity,
     classes = ownerState.classes;
   var slots = {
-    root: ['root', "".concat(variant).concat(capitalize(color || severity)), "".concat(variant)],
+    root: ['root', "color".concat(capitalize(color || severity)), "".concat(variant).concat(capitalize(color || severity)), "".concat(variant)],
     icon: ['icon'],
     message: ['message'],
     action: ['action']
@@ -44,38 +45,79 @@ var AlertRoot = styled(Paper, {
     return [styles.root, styles[ownerState.variant], styles["".concat(ownerState.variant).concat(capitalize(ownerState.color || ownerState.severity))]];
   }
 })(function (_ref) {
-  var theme = _ref.theme,
-    ownerState = _ref.ownerState;
+  var theme = _ref.theme;
   var getColor = theme.palette.mode === 'light' ? darken : lighten;
   var getBackgroundColor = theme.palette.mode === 'light' ? lighten : darken;
-  var color = ownerState.color || ownerState.severity;
   return _extends({}, theme.typography.body2, {
     backgroundColor: 'transparent',
     display: 'flex',
-    padding: '6px 16px'
-  }, color && ownerState.variant === 'standard' && _defineProperty({
-    color: theme.vars ? theme.vars.palette.Alert["".concat(color, "Color")] : getColor(theme.palette[color].light, 0.6),
-    backgroundColor: theme.vars ? theme.vars.palette.Alert["".concat(color, "StandardBg")] : getBackgroundColor(theme.palette[color].light, 0.9)
-  }, "& .".concat(alertClasses.icon), theme.vars ? {
-    color: theme.vars.palette.Alert["".concat(color, "IconColor")]
-  } : {
-    color: theme.palette[color].main
-  }), color && ownerState.variant === 'outlined' && _defineProperty({
-    color: theme.vars ? theme.vars.palette.Alert["".concat(color, "Color")] : getColor(theme.palette[color].light, 0.6),
-    border: "1px solid ".concat((theme.vars || theme).palette[color].light)
-  }, "& .".concat(alertClasses.icon), theme.vars ? {
-    color: theme.vars.palette.Alert["".concat(color, "IconColor")]
-  } : {
-    color: theme.palette[color].main
-  }), color && ownerState.variant === 'filled' && _extends({
-    fontWeight: theme.typography.fontWeightMedium
-  }, theme.vars ? {
-    color: theme.vars.palette.Alert["".concat(color, "FilledColor")],
-    backgroundColor: theme.vars.palette.Alert["".concat(color, "FilledBg")]
-  } : {
-    backgroundColor: theme.palette.mode === 'dark' ? theme.palette[color].dark : theme.palette[color].main,
-    color: theme.palette.getContrastText(theme.palette[color].main)
-  }));
+    padding: '6px 16px',
+    variants: [].concat(_toConsumableArray(Object.entries(theme.palette).filter(function (_ref2) {
+      var _ref3 = _slicedToArray(_ref2, 2),
+        value = _ref3[1];
+      return value.main && value.light;
+    }).map(function (_ref4) {
+      var _ref5 = _slicedToArray(_ref4, 1),
+        color = _ref5[0];
+      return {
+        props: {
+          colorSeverity: color,
+          variant: 'standard'
+        },
+        style: _defineProperty({
+          color: theme.vars ? theme.vars.palette.Alert["".concat(color, "Color")] : getColor(theme.palette[color].light, 0.6),
+          backgroundColor: theme.vars ? theme.vars.palette.Alert["".concat(color, "StandardBg")] : getBackgroundColor(theme.palette[color].light, 0.9)
+        }, "& .".concat(alertClasses.icon), theme.vars ? {
+          color: theme.vars.palette.Alert["".concat(color, "IconColor")]
+        } : {
+          color: theme.palette[color].main
+        })
+      };
+    })), _toConsumableArray(Object.entries(theme.palette).filter(function (_ref6) {
+      var _ref7 = _slicedToArray(_ref6, 2),
+        value = _ref7[1];
+      return value.main && value.light;
+    }).map(function (_ref8) {
+      var _ref9 = _slicedToArray(_ref8, 1),
+        color = _ref9[0];
+      return {
+        props: {
+          colorSeverity: color,
+          variant: 'outlined'
+        },
+        style: _defineProperty({
+          color: theme.vars ? theme.vars.palette.Alert["".concat(color, "Color")] : getColor(theme.palette[color].light, 0.6),
+          border: "1px solid ".concat((theme.vars || theme).palette[color].light)
+        }, "& .".concat(alertClasses.icon), theme.vars ? {
+          color: theme.vars.palette.Alert["".concat(color, "IconColor")]
+        } : {
+          color: theme.palette[color].main
+        })
+      };
+    })), _toConsumableArray(Object.entries(theme.palette).filter(function (_ref10) {
+      var _ref11 = _slicedToArray(_ref10, 2),
+        value = _ref11[1];
+      return value.main && value.dark;
+    }).map(function (_ref12) {
+      var _ref13 = _slicedToArray(_ref12, 1),
+        color = _ref13[0];
+      return {
+        props: {
+          colorSeverity: color,
+          variant: 'filled'
+        },
+        style: _extends({
+          fontWeight: theme.typography.fontWeightMedium
+        }, theme.vars ? {
+          color: theme.vars.palette.Alert["".concat(color, "FilledColor")],
+          backgroundColor: theme.vars.palette.Alert["".concat(color, "FilledBg")]
+        } : {
+          backgroundColor: theme.palette.mode === 'dark' ? theme.palette[color].dark : theme.palette[color].main,
+          color: theme.palette.getContrastText(theme.palette[color].main)
+        })
+      };
+    })))
+  });
 });
 var AlertIcon = styled('div', {
   name: 'MuiAlert',
@@ -161,7 +203,8 @@ var Alert = /*#__PURE__*/React.forwardRef(function Alert(inProps, ref) {
   var ownerState = _extends({}, props, {
     color: color,
     severity: severity,
-    variant: variant
+    variant: variant,
+    colorSeverity: color || severity
   });
   var classes = useUtilityClasses(ownerState);
   var externalForwardedProps = {

package/legacy/Alert/alertClasses.js

@@ -3,5 +3,5 @@ import generateUtilityClass from '@mui/utils/generateUtilityClass';
 export function getAlertUtilityClass(slot) {
   return generateUtilityClass('MuiAlert', slot);
 }
-var alertClasses = generateUtilityClasses('MuiAlert', ['root', 'action', 'icon', 'message', 'filled', 'filledSuccess', 'filledInfo', 'filledWarning', 'filledError', 'outlined', 'outlinedSuccess', 'outlinedInfo', 'outlinedWarning', 'outlinedError', 'standard', 'standardSuccess', 'standardInfo', 'standardWarning', 'standardError']);
+var alertClasses = generateUtilityClasses('MuiAlert', ['root', 'action', 'icon', 'message', 'filled', 'colorSuccess', 'colorInfo', 'colorWarning', 'colorError', 'filledSuccess', 'filledInfo', 'filledWarning', 'filledError', 'outlined', 'outlinedSuccess', 'outlinedInfo', 'outlinedWarning', 'outlinedError', 'standard', 'standardSuccess', 'standardInfo', 'standardWarning', 'standardError']);
 export default alertClasses;

package/legacy/AlertTitle/AlertTitle.js

@@ -6,11 +6,11 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
-import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { styled, createUseThemeProps } from '../zero-styled';
 import Typography from '../Typography';
 import { getAlertTitleUtilityClass } from './alertTitleClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
+var useThemeProps = createUseThemeProps('MuiAlertTitle');
 var useUtilityClasses = function useUtilityClasses(ownerState) {
   var classes = ownerState.classes;
   var slots = {

package/legacy/Avatar/Avatar.js

@@ -7,12 +7,12 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
-import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { styled, createUseThemeProps } from '../zero-styled';
 import Person from '../internal/svg-icons/Person';
 import { getAvatarUtilityClass } from './avatarClasses';
 import useSlot from '../utils/useSlot';
 import { jsx as _jsx } from "react/jsx-runtime";
+var useThemeProps = createUseThemeProps('MuiAvatar');
 var useUtilityClasses = function useUtilityClasses(ownerState) {
   var classes = ownerState.classes,
     variant = ownerState.variant,

package/legacy/Button/Button.js

@@ -26,10 +26,10 @@ var useUtilityClasses = function useUtilityClasses(ownerState) {
     variant = ownerState.variant,
     classes = ownerState.classes;
   var slots = {
-    root: ['root', variant, "".concat(variant).concat(capitalize(color)), "size".concat(capitalize(size)), "".concat(variant, "Size").concat(capitalize(size)), color === 'inherit' && 'colorInherit', disableElevation && 'disableElevation', fullWidth && 'fullWidth'],
+    root: ['root', variant, "".concat(variant).concat(capitalize(color)), "size".concat(capitalize(size)), "".concat(variant, "Size").concat(capitalize(size)), "color".concat(capitalize(color)), disableElevation && 'disableElevation', fullWidth && 'fullWidth'],
     label: ['label'],
-    startIcon: ['startIcon', "iconSize".concat(capitalize(size))],
-    endIcon: ['endIcon', "iconSize".concat(capitalize(size))]
+    startIcon: ['icon', 'startIcon', "iconSize".concat(capitalize(size))],
+    endIcon: ['icon', 'endIcon', "iconSize".concat(capitalize(size))]
   };
   var composedClasses = composeClasses(slots, getButtonUtilityClass, classes);
   return _extends({}, classes, composedClasses);

package/legacy/Button/buttonClasses.js

@@ -3,5 +3,5 @@ import generateUtilityClass from '@mui/utils/generateUtilityClass';
 export function getButtonUtilityClass(slot) {
   return generateUtilityClass('MuiButton', slot);
 }
-var buttonClasses = generateUtilityClasses('MuiButton', ['root', 'text', 'textInherit', 'textPrimary', 'textSecondary', 'textSuccess', 'textError', 'textInfo', 'textWarning', 'outlined', 'outlinedInherit', 'outlinedPrimary', 'outlinedSecondary', 'outlinedSuccess', 'outlinedError', 'outlinedInfo', 'outlinedWarning', 'contained', 'containedInherit', 'containedPrimary', 'containedSecondary', 'containedSuccess', 'containedError', 'containedInfo', 'containedWarning', 'disableElevation', 'focusVisible', 'disabled', 'colorInherit', 'textSizeSmall', 'textSizeMedium', 'textSizeLarge', 'outlinedSizeSmall', 'outlinedSizeMedium', 'outlinedSizeLarge', 'containedSizeSmall', 'containedSizeMedium', 'containedSizeLarge', 'sizeMedium', 'sizeSmall', 'sizeLarge', 'fullWidth', 'startIcon', 'endIcon', 'iconSizeSmall', 'iconSizeMedium', 'iconSizeLarge']);
+var buttonClasses = generateUtilityClasses('MuiButton', ['root', 'text', 'textInherit', 'textPrimary', 'textSecondary', 'textSuccess', 'textError', 'textInfo', 'textWarning', 'outlined', 'outlinedInherit', 'outlinedPrimary', 'outlinedSecondary', 'outlinedSuccess', 'outlinedError', 'outlinedInfo', 'outlinedWarning', 'contained', 'containedInherit', 'containedPrimary', 'containedSecondary', 'containedSuccess', 'containedError', 'containedInfo', 'containedWarning', 'disableElevation', 'focusVisible', 'disabled', 'colorInherit', 'colorPrimary', 'colorSecondary', 'colorSuccess', 'colorError', 'colorInfo', 'colorWarning', 'textSizeSmall', 'textSizeMedium', 'textSizeLarge', 'outlinedSizeSmall', 'outlinedSizeMedium', 'outlinedSizeLarge', 'containedSizeSmall', 'containedSizeMedium', 'containedSizeLarge', 'sizeMedium', 'sizeSmall', 'sizeLarge', 'fullWidth', 'startIcon', 'endIcon', 'icon', 'iconSizeSmall', 'iconSizeMedium', 'iconSizeLarge']);
 export default buttonClasses;

package/legacy/Slider/Slider.js

@@ -654,8 +654,7 @@ process.env.NODE_ENV !== "production" ? Slider.propTypes /* remove-proptypes */
   /**
    * The components used for each slot inside.
    *
-   * This prop is an alias for the `slots` prop.
-   * It's recommended to use the `slots` prop instead.
+   * @deprecated use the `slots` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
    *
    * @default {}
    */
@@ -673,8 +672,7 @@ process.env.NODE_ENV !== "production" ? Slider.propTypes /* remove-proptypes */
    * The extra props for the slot components.
    * You can override the existing props or add new ones.
    *
-   * This prop is an alias for the `slotProps` prop.
-   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
+   * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
    *
    * @default {}
    */

package/legacy/index.js

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

package/modern/Alert/Alert.js

@@ -6,10 +6,9 @@ const _excluded = ["action", "children", "className", "closeText", "color", "com
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/base';
-import { darken, lighten } from '@mui/system';
-import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import composeClasses from '@mui/utils/composeClasses';
+import { darken, lighten } from '@mui/system/colorManipulator';
+import { styled, createUseThemeProps } from '../zero-styled';
 import useSlot from '../utils/useSlot';
 import capitalize from '../utils/capitalize';
 import Paper from '../Paper';
@@ -22,6 +21,7 @@ import InfoOutlinedIcon from '../internal/svg-icons/InfoOutlined';
 import CloseIcon from '../internal/svg-icons/Close';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
+const useThemeProps = createUseThemeProps('MuiAlert');
 const useUtilityClasses = ownerState => {
   const {
     variant,
@@ -30,7 +30,7 @@ const useUtilityClasses = ownerState => {
     classes
   } = ownerState;
   const slots = {
-    root: ['root', `${variant}${capitalize(color || severity)}`, `${variant}`],
+    root: ['root', `color${capitalize(color || severity)}`, `${variant}${capitalize(color || severity)}`, `${variant}`],
     icon: ['icon'],
     message: ['message'],
     action: ['action']
@@ -47,41 +47,58 @@ const AlertRoot = styled(Paper, {
     return [styles.root, styles[ownerState.variant], styles[`${ownerState.variant}${capitalize(ownerState.color || ownerState.severity)}`]];
   }
 })(({
-  theme,
-  ownerState
+  theme
 }) => {
   const getColor = theme.palette.mode === 'light' ? darken : lighten;
   const getBackgroundColor = theme.palette.mode === 'light' ? lighten : darken;
-  const color = ownerState.color || ownerState.severity;
   return _extends({}, theme.typography.body2, {
     backgroundColor: 'transparent',
     display: 'flex',
-    padding: '6px 16px'
-  }, color && ownerState.variant === 'standard' && {
-    color: theme.vars ? theme.vars.palette.Alert[`${color}Color`] : getColor(theme.palette[color].light, 0.6),
-    backgroundColor: theme.vars ? theme.vars.palette.Alert[`${color}StandardBg`] : getBackgroundColor(theme.palette[color].light, 0.9),
-    [`& .${alertClasses.icon}`]: theme.vars ? {
-      color: theme.vars.palette.Alert[`${color}IconColor`]
-    } : {
-      color: theme.palette[color].main
-    }
-  }, color && ownerState.variant === 'outlined' && {
-    color: theme.vars ? theme.vars.palette.Alert[`${color}Color`] : getColor(theme.palette[color].light, 0.6),
-    border: `1px solid ${(theme.vars || theme).palette[color].light}`,
-    [`& .${alertClasses.icon}`]: theme.vars ? {
-      color: theme.vars.palette.Alert[`${color}IconColor`]
-    } : {
-      color: theme.palette[color].main
-    }
-  }, color && ownerState.variant === 'filled' && _extends({
-    fontWeight: theme.typography.fontWeightMedium
-  }, theme.vars ? {
-    color: theme.vars.palette.Alert[`${color}FilledColor`],
-    backgroundColor: theme.vars.palette.Alert[`${color}FilledBg`]
-  } : {
-    backgroundColor: theme.palette.mode === 'dark' ? theme.palette[color].dark : theme.palette[color].main,
-    color: theme.palette.getContrastText(theme.palette[color].main)
-  }));
+    padding: '6px 16px',
+    variants: [...Object.entries(theme.palette).filter(([, value]) => value.main && value.light).map(([color]) => ({
+      props: {
+        colorSeverity: color,
+        variant: 'standard'
+      },
+      style: {
+        color: theme.vars ? theme.vars.palette.Alert[`${color}Color`] : getColor(theme.palette[color].light, 0.6),
+        backgroundColor: theme.vars ? theme.vars.palette.Alert[`${color}StandardBg`] : getBackgroundColor(theme.palette[color].light, 0.9),
+        [`& .${alertClasses.icon}`]: theme.vars ? {
+          color: theme.vars.palette.Alert[`${color}IconColor`]
+        } : {
+          color: theme.palette[color].main
+        }
+      }
+    })), ...Object.entries(theme.palette).filter(([, value]) => value.main && value.light).map(([color]) => ({
+      props: {
+        colorSeverity: color,
+        variant: 'outlined'
+      },
+      style: {
+        color: theme.vars ? theme.vars.palette.Alert[`${color}Color`] : getColor(theme.palette[color].light, 0.6),
+        border: `1px solid ${(theme.vars || theme).palette[color].light}`,
+        [`& .${alertClasses.icon}`]: theme.vars ? {
+          color: theme.vars.palette.Alert[`${color}IconColor`]
+        } : {
+          color: theme.palette[color].main
+        }
+      }
+    })), ...Object.entries(theme.palette).filter(([, value]) => value.main && value.dark).map(([color]) => ({
+      props: {
+        colorSeverity: color,
+        variant: 'filled'
+      },
+      style: _extends({
+        fontWeight: theme.typography.fontWeightMedium
+      }, theme.vars ? {
+        color: theme.vars.palette.Alert[`${color}FilledColor`],
+        backgroundColor: theme.vars.palette.Alert[`${color}FilledBg`]
+      } : {
+        backgroundColor: theme.palette.mode === 'dark' ? theme.palette[color].dark : theme.palette[color].main,
+        color: theme.palette.getContrastText(theme.palette[color].main)
+      })
+    }))]
+  });
 });
 const AlertIcon = styled('div', {
   name: 'MuiAlert',
@@ -154,7 +171,8 @@ const Alert = /*#__PURE__*/React.forwardRef(function Alert(inProps, ref) {
   const ownerState = _extends({}, props, {
     color,
     severity,
-    variant
+    variant,
+    colorSeverity: color || severity
   });
   const classes = useUtilityClasses(ownerState);
   const externalForwardedProps = {

package/modern/Alert/alertClasses.js

@@ -3,5 +3,5 @@ import generateUtilityClass from '@mui/utils/generateUtilityClass';
 export function getAlertUtilityClass(slot) {
   return generateUtilityClass('MuiAlert', slot);
 }
-const alertClasses = generateUtilityClasses('MuiAlert', ['root', 'action', 'icon', 'message', 'filled', 'filledSuccess', 'filledInfo', 'filledWarning', 'filledError', 'outlined', 'outlinedSuccess', 'outlinedInfo', 'outlinedWarning', 'outlinedError', 'standard', 'standardSuccess', 'standardInfo', 'standardWarning', 'standardError']);
+const alertClasses = generateUtilityClasses('MuiAlert', ['root', 'action', 'icon', 'message', 'filled', 'colorSuccess', 'colorInfo', 'colorWarning', 'colorError', 'filledSuccess', 'filledInfo', 'filledWarning', 'filledError', 'outlined', 'outlinedSuccess', 'outlinedInfo', 'outlinedWarning', 'outlinedError', 'standard', 'standardSuccess', 'standardInfo', 'standardWarning', 'standardError']);
 export default alertClasses;