@mui/material 5.10.16 → 5.10.17

package/legacy/styles/experimental_extendTheme.js

@@ -1,8 +1,9 @@
+import _typeof from "@babel/runtime/helpers/esm/typeof";
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import { deepmerge } from '@mui/utils';
-import { colorChannel, alpha, darken, lighten, emphasize, unstable_createGetCssVar as systemCreateGetCssVar } from '@mui/system';
+import { private_safeColorChannel as safeColorChannel, private_safeAlpha as safeAlpha, private_safeDarken as safeDarken, private_safeLighten as safeLighten, private_safeEmphasize as safeEmphasize, unstable_createGetCssVar as systemCreateGetCssVar } from '@mui/system';
 import createThemeWithoutVars from './createTheme';
 import getOverlayAlpha from './getOverlayAlpha';
 var defaultDarkOverlays = _toConsumableArray(Array(25)).map(function (_, index) {
@@ -20,8 +21,18 @@ function assignNode(obj, keys) {
   });
 }
 function setColor(obj, key, defaultValue) {
-  obj[key] = obj[key] || defaultValue;
+  if (!obj[key] && defaultValue) {
+    obj[key] = defaultValue;
+  }
 }
+var silent = function silent(fn) {
+  try {
+    return fn();
+  } catch (error) {
+    // ignore error
+  }
+  return undefined;
+};
 export var createGetCssVar = function createGetCssVar() {
   var cssVarPrefix = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'mui';
   return systemCreateGetCssVar(cssVarPrefix);
@@ -87,22 +98,30 @@ export default function extendTheme() {
     // assign component variables
     assignNode(palette, ['Alert', 'AppBar', 'Avatar', 'Chip', 'FilledInput', 'LinearProgress', 'Skeleton', 'Slider', 'SnackbarContent', 'SpeedDialAction', 'StepConnector', 'StepContent', 'Switch', 'TableCell', 'Tooltip']);
     if (key === 'light') {
-      setColor(palette.Alert, 'errorColor', darken(palette.error.light, 0.6));
-      setColor(palette.Alert, 'infoColor', darken(palette.info.light, 0.6));
-      setColor(palette.Alert, 'successColor', darken(palette.success.light, 0.6));
-      setColor(palette.Alert, 'warningColor', darken(palette.warning.light, 0.6));
+      setColor(palette.Alert, 'errorColor', safeDarken(palette.error.light, 0.6));
+      setColor(palette.Alert, 'infoColor', safeDarken(palette.info.light, 0.6));
+      setColor(palette.Alert, 'successColor', safeDarken(palette.success.light, 0.6));
+      setColor(palette.Alert, 'warningColor', safeDarken(palette.warning.light, 0.6));
       setColor(palette.Alert, 'errorFilledBg', getCssVar('palette-error-main'));
       setColor(palette.Alert, 'infoFilledBg', getCssVar('palette-info-main'));
       setColor(palette.Alert, 'successFilledBg', getCssVar('palette-success-main'));
       setColor(palette.Alert, 'warningFilledBg', getCssVar('palette-warning-main'));
-      setColor(palette.Alert, 'errorFilledColor', lightPalette.getContrastText(palette.error.main));
-      setColor(palette.Alert, 'infoFilledColor', lightPalette.getContrastText(palette.info.main));
-      setColor(palette.Alert, 'successFilledColor', lightPalette.getContrastText(palette.success.main));
-      setColor(palette.Alert, 'warningFilledColor', lightPalette.getContrastText(palette.warning.main));
-      setColor(palette.Alert, 'errorStandardBg', lighten(palette.error.light, 0.9));
-      setColor(palette.Alert, 'infoStandardBg', lighten(palette.info.light, 0.9));
-      setColor(palette.Alert, 'successStandardBg', lighten(palette.success.light, 0.9));
-      setColor(palette.Alert, 'warningStandardBg', lighten(palette.warning.light, 0.9));
+      setColor(palette.Alert, 'errorFilledColor', silent(function () {
+        return lightPalette.getContrastText(palette.error.main);
+      }));
+      setColor(palette.Alert, 'infoFilledColor', silent(function () {
+        return lightPalette.getContrastText(palette.info.main);
+      }));
+      setColor(palette.Alert, 'successFilledColor', silent(function () {
+        return lightPalette.getContrastText(palette.success.main);
+      }));
+      setColor(palette.Alert, 'warningFilledColor', silent(function () {
+        return lightPalette.getContrastText(palette.warning.main);
+      }));
+      setColor(palette.Alert, 'errorStandardBg', safeLighten(palette.error.light, 0.9));
+      setColor(palette.Alert, 'infoStandardBg', safeLighten(palette.info.light, 0.9));
+      setColor(palette.Alert, 'successStandardBg', safeLighten(palette.success.light, 0.9));
+      setColor(palette.Alert, 'warningStandardBg', safeLighten(palette.warning.light, 0.9));
       setColor(palette.Alert, 'errorIconColor', getCssVar('palette-error-light'));
       setColor(palette.Alert, 'infoIconColor', getCssVar('palette-info-light'));
       setColor(palette.Alert, 'successIconColor', getCssVar('palette-success-light'));
@@ -115,52 +134,62 @@ export default function extendTheme() {
       setColor(palette.FilledInput, 'bg', 'rgba(0, 0, 0, 0.06)');
       setColor(palette.FilledInput, 'hoverBg', 'rgba(0, 0, 0, 0.09)');
       setColor(palette.FilledInput, 'disabledBg', 'rgba(0, 0, 0, 0.12)');
-      setColor(palette.LinearProgress, 'primaryBg', lighten(palette.primary.main, 0.62));
-      setColor(palette.LinearProgress, 'secondaryBg', lighten(palette.secondary.main, 0.62));
-      setColor(palette.LinearProgress, 'errorBg', lighten(palette.error.main, 0.62));
-      setColor(palette.LinearProgress, 'infoBg', lighten(palette.info.main, 0.62));
-      setColor(palette.LinearProgress, 'successBg', lighten(palette.success.main, 0.62));
-      setColor(palette.LinearProgress, 'warningBg', lighten(palette.warning.main, 0.62));
+      setColor(palette.LinearProgress, 'primaryBg', safeLighten(palette.primary.main, 0.62));
+      setColor(palette.LinearProgress, 'secondaryBg', safeLighten(palette.secondary.main, 0.62));
+      setColor(palette.LinearProgress, 'errorBg', safeLighten(palette.error.main, 0.62));
+      setColor(palette.LinearProgress, 'infoBg', safeLighten(palette.info.main, 0.62));
+      setColor(palette.LinearProgress, 'successBg', safeLighten(palette.success.main, 0.62));
+      setColor(palette.LinearProgress, 'warningBg', safeLighten(palette.warning.main, 0.62));
       setColor(palette.Skeleton, 'bg', "rgba(".concat(getCssVar('palette-text-primaryChannel'), " / 0.11)"));
-      setColor(palette.Slider, 'primaryTrack', lighten(palette.primary.main, 0.62));
-      setColor(palette.Slider, 'secondaryTrack', lighten(palette.secondary.main, 0.62));
-      setColor(palette.Slider, 'errorTrack', lighten(palette.error.main, 0.62));
-      setColor(palette.Slider, 'infoTrack', lighten(palette.info.main, 0.62));
-      setColor(palette.Slider, 'successTrack', lighten(palette.success.main, 0.62));
-      setColor(palette.Slider, 'warningTrack', lighten(palette.warning.main, 0.62));
-      var snackbarContentBackground = emphasize(palette.background.default, 0.8);
+      setColor(palette.Slider, 'primaryTrack', safeLighten(palette.primary.main, 0.62));
+      setColor(palette.Slider, 'secondaryTrack', safeLighten(palette.secondary.main, 0.62));
+      setColor(palette.Slider, 'errorTrack', safeLighten(palette.error.main, 0.62));
+      setColor(palette.Slider, 'infoTrack', safeLighten(palette.info.main, 0.62));
+      setColor(palette.Slider, 'successTrack', safeLighten(palette.success.main, 0.62));
+      setColor(palette.Slider, 'warningTrack', safeLighten(palette.warning.main, 0.62));
+      var snackbarContentBackground = safeEmphasize(palette.background.default, 0.8);
       setColor(palette.SnackbarContent, 'bg', snackbarContentBackground);
-      setColor(palette.SnackbarContent, 'color', lightPalette.getContrastText(snackbarContentBackground));
-      setColor(palette.SpeedDialAction, 'fabHoverBg', emphasize(palette.background.paper, 0.15));
+      setColor(palette.SnackbarContent, 'color', silent(function () {
+        return lightPalette.getContrastText(snackbarContentBackground);
+      }));
+      setColor(palette.SpeedDialAction, 'fabHoverBg', safeEmphasize(palette.background.paper, 0.15));
       setColor(palette.StepConnector, 'border', getCssVar('palette-grey-400'));
       setColor(palette.StepContent, 'border', getCssVar('palette-grey-400'));
       setColor(palette.Switch, 'defaultColor', getCssVar('palette-common-white'));
       setColor(palette.Switch, 'defaultDisabledColor', getCssVar('palette-grey-100'));
-      setColor(palette.Switch, 'primaryDisabledColor', lighten(palette.primary.main, 0.62));
-      setColor(palette.Switch, 'secondaryDisabledColor', lighten(palette.secondary.main, 0.62));
-      setColor(palette.Switch, 'errorDisabledColor', lighten(palette.error.main, 0.62));
-      setColor(palette.Switch, 'infoDisabledColor', lighten(palette.info.main, 0.62));
-      setColor(palette.Switch, 'successDisabledColor', lighten(palette.success.main, 0.62));
-      setColor(palette.Switch, 'warningDisabledColor', lighten(palette.warning.main, 0.62));
-      setColor(palette.TableCell, 'border', lighten(alpha(palette.divider, 1), 0.88));
-      setColor(palette.Tooltip, 'bg', alpha(palette.grey[700], 0.92));
+      setColor(palette.Switch, 'primaryDisabledColor', safeLighten(palette.primary.main, 0.62));
+      setColor(palette.Switch, 'secondaryDisabledColor', safeLighten(palette.secondary.main, 0.62));
+      setColor(palette.Switch, 'errorDisabledColor', safeLighten(palette.error.main, 0.62));
+      setColor(palette.Switch, 'infoDisabledColor', safeLighten(palette.info.main, 0.62));
+      setColor(palette.Switch, 'successDisabledColor', safeLighten(palette.success.main, 0.62));
+      setColor(palette.Switch, 'warningDisabledColor', safeLighten(palette.warning.main, 0.62));
+      setColor(palette.TableCell, 'border', safeLighten(safeAlpha(palette.divider, 1), 0.88));
+      setColor(palette.Tooltip, 'bg', safeAlpha(palette.grey[700], 0.92));
     } else {
-      setColor(palette.Alert, 'errorColor', lighten(palette.error.light, 0.6));
-      setColor(palette.Alert, 'infoColor', lighten(palette.info.light, 0.6));
-      setColor(palette.Alert, 'successColor', lighten(palette.success.light, 0.6));
-      setColor(palette.Alert, 'warningColor', lighten(palette.warning.light, 0.6));
+      setColor(palette.Alert, 'errorColor', safeLighten(palette.error.light, 0.6));
+      setColor(palette.Alert, 'infoColor', safeLighten(palette.info.light, 0.6));
+      setColor(palette.Alert, 'successColor', safeLighten(palette.success.light, 0.6));
+      setColor(palette.Alert, 'warningColor', safeLighten(palette.warning.light, 0.6));
       setColor(palette.Alert, 'errorFilledBg', getCssVar('palette-error-dark'));
       setColor(palette.Alert, 'infoFilledBg', getCssVar('palette-info-dark'));
       setColor(palette.Alert, 'successFilledBg', getCssVar('palette-success-dark'));
       setColor(palette.Alert, 'warningFilledBg', getCssVar('palette-warning-dark'));
-      setColor(palette.Alert, 'errorFilledColor', darkPalette.getContrastText(palette.error.dark));
-      setColor(palette.Alert, 'infoFilledColor', darkPalette.getContrastText(palette.info.dark));
-      setColor(palette.Alert, 'successFilledColor', darkPalette.getContrastText(palette.success.dark));
-      setColor(palette.Alert, 'warningFilledColor', darkPalette.getContrastText(palette.warning.dark));
-      setColor(palette.Alert, 'errorStandardBg', darken(palette.error.light, 0.9));
-      setColor(palette.Alert, 'infoStandardBg', darken(palette.info.light, 0.9));
-      setColor(palette.Alert, 'successStandardBg', darken(palette.success.light, 0.9));
-      setColor(palette.Alert, 'warningStandardBg', darken(palette.warning.light, 0.9));
+      setColor(palette.Alert, 'errorFilledColor', silent(function () {
+        return darkPalette.getContrastText(palette.error.dark);
+      }));
+      setColor(palette.Alert, 'infoFilledColor', silent(function () {
+        return darkPalette.getContrastText(palette.info.dark);
+      }));
+      setColor(palette.Alert, 'successFilledColor', silent(function () {
+        return darkPalette.getContrastText(palette.success.dark);
+      }));
+      setColor(palette.Alert, 'warningFilledColor', silent(function () {
+        return darkPalette.getContrastText(palette.warning.dark);
+      }));
+      setColor(palette.Alert, 'errorStandardBg', safeDarken(palette.error.light, 0.9));
+      setColor(palette.Alert, 'infoStandardBg', safeDarken(palette.info.light, 0.9));
+      setColor(palette.Alert, 'successStandardBg', safeDarken(palette.success.light, 0.9));
+      setColor(palette.Alert, 'warningStandardBg', safeDarken(palette.warning.light, 0.9));
       setColor(palette.Alert, 'errorIconColor', getCssVar('palette-error-main'));
       setColor(palette.Alert, 'infoIconColor', getCssVar('palette-info-main'));
       setColor(palette.Alert, 'successIconColor', getCssVar('palette-success-main'));
@@ -175,72 +204,76 @@ export default function extendTheme() {
       setColor(palette.FilledInput, 'bg', 'rgba(255, 255, 255, 0.09)');
       setColor(palette.FilledInput, 'hoverBg', 'rgba(255, 255, 255, 0.13)');
       setColor(palette.FilledInput, 'disabledBg', 'rgba(255, 255, 255, 0.12)');
-      setColor(palette.LinearProgress, 'primaryBg', darken(palette.primary.main, 0.5));
-      setColor(palette.LinearProgress, 'secondaryBg', darken(palette.secondary.main, 0.5));
-      setColor(palette.LinearProgress, 'errorBg', darken(palette.error.main, 0.5));
-      setColor(palette.LinearProgress, 'infoBg', darken(palette.info.main, 0.5));
-      setColor(palette.LinearProgress, 'successBg', darken(palette.success.main, 0.5));
-      setColor(palette.LinearProgress, 'warningBg', darken(palette.warning.main, 0.5));
+      setColor(palette.LinearProgress, 'primaryBg', safeDarken(palette.primary.main, 0.5));
+      setColor(palette.LinearProgress, 'secondaryBg', safeDarken(palette.secondary.main, 0.5));
+      setColor(palette.LinearProgress, 'errorBg', safeDarken(palette.error.main, 0.5));
+      setColor(palette.LinearProgress, 'infoBg', safeDarken(palette.info.main, 0.5));
+      setColor(palette.LinearProgress, 'successBg', safeDarken(palette.success.main, 0.5));
+      setColor(palette.LinearProgress, 'warningBg', safeDarken(palette.warning.main, 0.5));
       setColor(palette.Skeleton, 'bg', "rgba(".concat(getCssVar('palette-text-primaryChannel'), " / 0.13)"));
-      setColor(palette.Slider, 'primaryTrack', darken(palette.primary.main, 0.5));
-      setColor(palette.Slider, 'secondaryTrack', darken(palette.secondary.main, 0.5));
-      setColor(palette.Slider, 'errorTrack', darken(palette.error.main, 0.5));
-      setColor(palette.Slider, 'infoTrack', darken(palette.info.main, 0.5));
-      setColor(palette.Slider, 'successTrack', darken(palette.success.main, 0.5));
-      setColor(palette.Slider, 'warningTrack', darken(palette.warning.main, 0.5));
-      var _snackbarContentBackground = emphasize(palette.background.default, 0.98);
+      setColor(palette.Slider, 'primaryTrack', safeDarken(palette.primary.main, 0.5));
+      setColor(palette.Slider, 'secondaryTrack', safeDarken(palette.secondary.main, 0.5));
+      setColor(palette.Slider, 'errorTrack', safeDarken(palette.error.main, 0.5));
+      setColor(palette.Slider, 'infoTrack', safeDarken(palette.info.main, 0.5));
+      setColor(palette.Slider, 'successTrack', safeDarken(palette.success.main, 0.5));
+      setColor(palette.Slider, 'warningTrack', safeDarken(palette.warning.main, 0.5));
+      var _snackbarContentBackground = safeEmphasize(palette.background.default, 0.98);
       setColor(palette.SnackbarContent, 'bg', _snackbarContentBackground);
-      setColor(palette.SnackbarContent, 'color', darkPalette.getContrastText(_snackbarContentBackground));
-      setColor(palette.SpeedDialAction, 'fabHoverBg', emphasize(palette.background.paper, 0.15));
+      setColor(palette.SnackbarContent, 'color', silent(function () {
+        return darkPalette.getContrastText(_snackbarContentBackground);
+      }));
+      setColor(palette.SpeedDialAction, 'fabHoverBg', safeEmphasize(palette.background.paper, 0.15));
       setColor(palette.StepConnector, 'border', getCssVar('palette-grey-600'));
       setColor(palette.StepContent, 'border', getCssVar('palette-grey-600'));
       setColor(palette.Switch, 'defaultColor', getCssVar('palette-grey-300'));
       setColor(palette.Switch, 'defaultDisabledColor', getCssVar('palette-grey-600'));
-      setColor(palette.Switch, 'primaryDisabledColor', darken(palette.primary.main, 0.55));
-      setColor(palette.Switch, 'secondaryDisabledColor', darken(palette.secondary.main, 0.55));
-      setColor(palette.Switch, 'errorDisabledColor', darken(palette.error.main, 0.55));
-      setColor(palette.Switch, 'infoDisabledColor', darken(palette.info.main, 0.55));
-      setColor(palette.Switch, 'successDisabledColor', darken(palette.success.main, 0.55));
-      setColor(palette.Switch, 'warningDisabledColor', darken(palette.warning.main, 0.55));
-      setColor(palette.TableCell, 'border', darken(alpha(palette.divider, 1), 0.68));
-      setColor(palette.Tooltip, 'bg', alpha(palette.grey[700], 0.92));
+      setColor(palette.Switch, 'primaryDisabledColor', safeDarken(palette.primary.main, 0.55));
+      setColor(palette.Switch, 'secondaryDisabledColor', safeDarken(palette.secondary.main, 0.55));
+      setColor(palette.Switch, 'errorDisabledColor', safeDarken(palette.error.main, 0.55));
+      setColor(palette.Switch, 'infoDisabledColor', safeDarken(palette.info.main, 0.55));
+      setColor(palette.Switch, 'successDisabledColor', safeDarken(palette.success.main, 0.55));
+      setColor(palette.Switch, 'warningDisabledColor', safeDarken(palette.warning.main, 0.55));
+      setColor(palette.TableCell, 'border', safeDarken(safeAlpha(palette.divider, 1), 0.68));
+      setColor(palette.Tooltip, 'bg', safeAlpha(palette.grey[700], 0.92));
     }
-    palette.background.defaultChannel = colorChannel(palette.background.default); // MUI X - DataGrid needs this token.
+    setColor(palette.background, 'defaultChannel', safeColorChannel(palette.background.default, 'MUI: The value of `palette.background.default` should be one of these formats: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().')); // MUI X - DataGrid needs this token.
 
-    palette.common.backgroundChannel = colorChannel(palette.common.background);
-    palette.common.onBackgroundChannel = colorChannel(palette.common.onBackground);
-    palette.dividerChannel = colorChannel(palette.divider);
+    setColor(palette.common, 'backgroundChannel', safeColorChannel(palette.common.background, 'MUI: The value of `palette.common.background` should be one of these formats: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().'));
+    setColor(palette.common, 'onBackgroundChannel', safeColorChannel(palette.common.onBackground, 'MUI: The value of `palette.common.onBackground` should be one of these formats: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().'));
+    setColor(palette, 'dividerChannel', safeColorChannel(palette.divider, 'MUI: The value of `palette.divider` should be one of these formats: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().'));
     Object.keys(palette).forEach(function (color) {
       var colors = palette[color];
 
-      // Color palettes: primary, secondary, error, info, success, and warning
-      if (colors.main) {
-        palette[color].mainChannel = colorChannel(colors.main);
-      }
-      if (colors.light) {
-        palette[color].lightChannel = colorChannel(colors.light);
-      }
-      if (colors.dark) {
-        palette[color].darkChannel = colorChannel(colors.dark);
-      }
-      if (colors.contrastText) {
-        palette[color].contrastTextChannel = colorChannel(colors.contrastText);
-      }
+      // The default palettes (primary, secondary, error, info, success, and warning) errors are handled by the above `createTheme(...)`.
 
-      // Text colors: text.primary, text.secondary
-      if (colors.primary) {
-        palette[color].primaryChannel = colorChannel(colors.primary);
-      }
-      if (colors.secondary) {
-        palette[color].secondaryChannel = colorChannel(colors.secondary);
-      }
-
-      // Action colors: action.active, action.selected
-      if (colors.active) {
-        palette[color].activeChannel = colorChannel(colors.active);
-      }
-      if (colors.selected) {
-        palette[color].selectedChannel = colorChannel(colors.selected);
+      if (colors && _typeof(colors) === 'object') {
+        // Silent the error for custom palettes.
+        if (colors.main) {
+          setColor(palette[color], 'mainChannel', safeColorChannel(colors.main));
+        }
+        if (colors.light) {
+          setColor(palette[color], 'lightChannel', safeColorChannel(colors.light));
+        }
+        if (colors.dark) {
+          setColor(palette[color], 'darkChannel', safeColorChannel(colors.dark));
+        }
+        if (colors.contrastText) {
+          setColor(palette[color], 'contrastTextChannel', safeColorChannel(colors.contrastText));
+        }
+        if (color === 'text') {
+          // Text colors: text.primary, text.secondary
+          setColor(palette[color], 'primaryChannel', safeColorChannel(colors.primary, 'MUI: The value of `palette.text.primary` should be one of these formats: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().'));
+          setColor(palette[color], 'secondaryChannel', safeColorChannel(colors.secondary, 'MUI: The value of `palette.text.secondary` should be one of these formats: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().'));
+        }
+        if (color === 'action') {
+          // Action colors: action.active, action.selected
+          if (colors.active) {
+            setColor(palette[color], 'activeChannel', safeColorChannel(colors.active, 'MUI: The value of `palette.action.active` should be one of these formats: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().'));
+          }
+          if (colors.selected) {
+            setColor(palette[color], 'selectedChannel', safeColorChannel(colors.selected, 'MUI: The value of `palette.action.selected` should be one of these formats: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().'));
+          }
+        }
       }
     });
   });

package/legacy/utils/index.js

@@ -20,7 +20,9 @@ export { default as useIsFocusVisible } from './useIsFocusVisible';
 // eslint-disable-next-line @typescript-eslint/naming-convention
 export var unstable_ClassNameGenerator = {
   configure: function configure(generator) {
-    console.warn(['MUI: `ClassNameGenerator` import from `@mui/material/utils` is outdated and might cause unexpected issues.', '', "You should use `import { unstable_ClassNameGenerator } from '@mui/material/className'` instead", '', 'The detail of the issue: https://github.com/mui/material-ui/issues/30011#issuecomment-1024993401', '', 'The updated documentation: https://mui.com/guides/classname-generator/'].join('\n'));
+    if (process.env.NODE_ENV !== 'production') {
+      console.warn(['MUI: `ClassNameGenerator` import from `@mui/material/utils` is outdated and might cause unexpected issues.', '', "You should use `import { unstable_ClassNameGenerator } from '@mui/material/className'` instead", '', 'The detail of the issue: https://github.com/mui/material-ui/issues/30011#issuecomment-1024993401', '', 'The updated documentation: https://mui.com/guides/classname-generator/'].join('\n'));
+    }
     ClassNameGenerator.configure(generator);
   }
 };

package/locale/index.d.ts

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

package/locale/index.js

@@ -3663,26 +3663,26 @@ const zhTW = {
           }
           return '上一頁';
         },
-        labelRowsPerPage: '每頁行數:',
+        labelRowsPerPage: '每頁數量:',
         labelDisplayedRows: ({
           from,
           to,
           count
-        }) => `第 ${from} 條到第 ${to} 條，${count !== -1 ? `共 ${count} 條` : `至少 ${to} 條`}`
+        }) => `${from} ~ ${to} / ${count !== -1 ? count : `${to} 以上`}`
       }
     },
     MuiRating: {
       defaultProps: {
         getLabelText: value => `${value} 顆星`,
-        emptyLabelText: '無標簽'
+        emptyLabelText: '無標籤'
       }
     },
     MuiAutocomplete: {
       defaultProps: {
         clearText: '清空',
         closeText: '關閉',
-        loadingText: '載入中……',
-        noOptionsText: '没有可用選項',
+        loadingText: '載入中…',
+        noOptionsText: '沒有可用選項',
         openText: '打開'
       }
     },

package/modern/Fab/Fab.js

@@ -64,11 +64,6 @@ const FabRoot = styled(ButtonBase, {
   },
   [`&.${fabClasses.focusVisible}`]: {
     boxShadow: (theme.vars || theme).shadows[6]
-  },
-  [`&.${fabClasses.disabled}`]: {
-    color: (theme.vars || theme).palette.action.disabled,
-    boxShadow: (theme.vars || theme).shadows[0],
-    backgroundColor: (theme.vars || theme).palette.action.disabledBackground
   }
 }, ownerState.size === 'small' && {
   width: 40,
@@ -110,6 +105,14 @@ const FabRoot = styled(ButtonBase, {
       backgroundColor: (theme.vars || theme).palette[ownerState.color].main
     }
   }
+}), ({
+  theme
+}) => ({
+  [`&.${fabClasses.disabled}`]: {
+    color: (theme.vars || theme).palette.action.disabled,
+    boxShadow: (theme.vars || theme).shadows[0],
+    backgroundColor: (theme.vars || theme).palette.action.disabledBackground
+  }
 }));
 const Fab = /*#__PURE__*/React.forwardRef(function Fab(inProps, ref) {
   const props = useThemeProps({

package/modern/Rating/Rating.js

@@ -101,7 +101,9 @@ const RatingRoot = styled('span', {
 const RatingLabel = styled('label', {
   name: 'MuiRating',
   slot: 'Label',
-  overridesResolver: (props, styles) => styles.label
+  overridesResolver: ({
+    ownerState
+  }, styles) => [styles.label, ownerState.emptyValueFocused && styles.labelEmptyValueActive]
 })(({
   ownerState
 }) => _extends({

package/modern/Slider/Slider.js

@@ -327,7 +327,12 @@ const SliderMark = styled('span', {
   name: 'MuiSlider',
   slot: 'Mark',
   shouldForwardProp: prop => slotShouldForwardProp(prop) && prop !== 'markActive',
-  overridesResolver: (props, styles) => styles.mark
+  overridesResolver: (props, styles) => {
+    const {
+      markActive
+    } = props;
+    return [styles.mark, markActive && styles.markActive];
+  }
 })(({
   theme,
   ownerState,

package/modern/index.js

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

package/modern/locale/index.js

@@ -3612,26 +3612,26 @@ export const zhTW = {
           }
           return '上一頁';
         },
-        labelRowsPerPage: '每頁行數:',
+        labelRowsPerPage: '每頁數量:',
         labelDisplayedRows: ({
           from,
           to,
           count
-        }) => `第 ${from} 條到第 ${to} 條，${count !== -1 ? `共 ${count} 條` : `至少 ${to} 條`}`
+        }) => `${from} ~ ${to} / ${count !== -1 ? count : `${to} 以上`}`
       }
     },
     MuiRating: {
       defaultProps: {
         getLabelText: value => `${value} 顆星`,
-        emptyLabelText: '無標簽'
+        emptyLabelText: '無標籤'
       }
     },
     MuiAutocomplete: {
       defaultProps: {
         clearText: '清空',
         closeText: '關閉',
-        loadingText: '載入中……',
-        noOptionsText: '没有可用選項',
+        loadingText: '載入中…',
+        noOptionsText: '沒有可用選項',
         openText: '打開'
       }
     },