@mui/material 5.10.15 → 5.10.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (169) hide show
  1. package/Accordion/accordionClasses.d.ts +1 -1
  2. package/AccordionActions/accordionActionsClasses.d.ts +1 -1
  3. package/AccordionDetails/accordionDetailsClasses.d.ts +1 -1
  4. package/AccordionSummary/accordionSummaryClasses.d.ts +1 -1
  5. package/Alert/alertClasses.d.ts +1 -1
  6. package/AlertTitle/alertTitleClasses.d.ts +1 -1
  7. package/AppBar/appBarClasses.d.ts +1 -1
  8. package/Autocomplete/autocompleteClasses.d.ts +1 -1
  9. package/Avatar/avatarClasses.d.ts +1 -1
  10. package/AvatarGroup/avatarGroupClasses.d.ts +1 -1
  11. package/Backdrop/backdropClasses.d.ts +1 -1
  12. package/Badge/badgeClasses.d.ts +1 -1
  13. package/BottomNavigation/bottomNavigationClasses.d.ts +1 -1
  14. package/BottomNavigationAction/bottomNavigationActionClasses.d.ts +1 -1
  15. package/Breadcrumbs/breadcrumbsClasses.d.ts +1 -1
  16. package/Button/buttonClasses.d.ts +1 -1
  17. package/ButtonBase/buttonBaseClasses.d.ts +1 -1
  18. package/ButtonBase/touchRippleClasses.d.ts +1 -1
  19. package/ButtonGroup/buttonGroupClasses.d.ts +1 -1
  20. package/CHANGELOG.md +121 -1
  21. package/Card/cardClasses.d.ts +1 -1
  22. package/CardActionArea/cardActionAreaClasses.d.ts +1 -1
  23. package/CardActions/cardActionsClasses.d.ts +1 -1
  24. package/CardContent/cardContentClasses.d.ts +1 -1
  25. package/CardHeader/cardHeaderClasses.d.ts +1 -1
  26. package/CardMedia/cardMediaClasses.d.ts +1 -1
  27. package/Checkbox/checkboxClasses.d.ts +1 -1
  28. package/Chip/Chip.d.ts +10 -0
  29. package/Chip/Chip.js +15 -2
  30. package/Chip/chipClasses.d.ts +1 -1
  31. package/CircularProgress/circularProgressClasses.d.ts +1 -1
  32. package/Collapse/collapseClasses.d.ts +1 -1
  33. package/Dialog/dialogClasses.d.ts +1 -1
  34. package/DialogActions/dialogActionsClasses.d.ts +1 -1
  35. package/DialogContent/dialogContentClasses.d.ts +1 -1
  36. package/DialogContentText/dialogContentTextClasses.d.ts +1 -1
  37. package/DialogTitle/dialogTitleClasses.d.ts +1 -1
  38. package/Divider/dividerClasses.d.ts +1 -1
  39. package/Drawer/drawerClasses.d.ts +1 -1
  40. package/Fab/Fab.js +8 -5
  41. package/Fab/fabClasses.d.ts +1 -1
  42. package/FilledInput/filledInputClasses.d.ts +1 -1
  43. package/FormControl/FormControlContext.d.ts +17 -0
  44. package/FormControl/FormControlContext.js +1 -1
  45. package/FormControl/formControlClasses.d.ts +1 -1
  46. package/FormControl/index.d.ts +3 -1
  47. package/FormControl/useFormControl.d.ts +1 -24
  48. package/FormControlLabel/formControlLabelClasses.d.ts +1 -1
  49. package/FormGroup/formGroupClasses.d.ts +1 -1
  50. package/FormHelperText/formHelperTextClasses.d.ts +1 -1
  51. package/FormLabel/formLabelClasses.d.ts +1 -1
  52. package/Grid/gridClasses.d.ts +1 -1
  53. package/Icon/iconClasses.d.ts +1 -1
  54. package/IconButton/iconButtonClasses.d.ts +9 -1
  55. package/IconButton/iconButtonClasses.js +1 -1
  56. package/ImageList/imageListClasses.d.ts +1 -1
  57. package/ImageListItem/imageListItemClasses.d.ts +1 -1
  58. package/ImageListItemBar/imageListItemBarClasses.d.ts +1 -1
  59. package/Input/inputClasses.d.ts +1 -1
  60. package/InputAdornment/inputAdornmentClasses.d.ts +1 -1
  61. package/InputBase/inputBaseClasses.d.ts +1 -1
  62. package/InputLabel/inputLabelClasses.d.ts +1 -1
  63. package/LinearProgress/linearProgressClasses.d.ts +1 -1
  64. package/Link/linkClasses.d.ts +1 -1
  65. package/List/listClasses.d.ts +1 -1
  66. package/ListItem/listItemClasses.d.ts +1 -1
  67. package/ListItemAvatar/listItemAvatarClasses.d.ts +1 -1
  68. package/ListItemButton/listItemButtonClasses.d.ts +1 -1
  69. package/ListItemIcon/listItemIconClasses.d.ts +1 -1
  70. package/ListItemSecondaryAction/listItemSecondaryActionClasses.d.ts +1 -1
  71. package/ListItemText/listItemTextClasses.d.ts +1 -1
  72. package/ListSubheader/listSubheaderClasses.d.ts +1 -1
  73. package/Menu/menuClasses.d.ts +1 -1
  74. package/MenuItem/menuItemClasses.d.ts +1 -1
  75. package/MobileStepper/mobileStepperClasses.d.ts +1 -1
  76. package/NativeSelect/nativeSelectClasses.d.ts +1 -1
  77. package/OutlinedInput/outlinedInputClasses.d.ts +1 -1
  78. package/Pagination/paginationClasses.d.ts +1 -1
  79. package/PaginationItem/paginationItemClasses.d.ts +1 -1
  80. package/Paper/paperClasses.d.ts +1 -1
  81. package/Popover/popoverClasses.d.ts +1 -1
  82. package/Popper/Popper.d.ts +2 -2
  83. package/README.md +0 -9
  84. package/Radio/radioClasses.d.ts +1 -1
  85. package/Rating/Rating.js +3 -1
  86. package/Rating/ratingClasses.d.ts +1 -1
  87. package/ScopedCssBaseline/scopedCssBaselineClasses.d.ts +1 -1
  88. package/Select/selectClasses.d.ts +1 -1
  89. package/Skeleton/skeletonClasses.d.ts +1 -1
  90. package/Slider/Slider.js +6 -1
  91. package/Snackbar/snackbarClasses.d.ts +1 -1
  92. package/SnackbarContent/snackbarContentClasses.d.ts +1 -1
  93. package/SpeedDial/speedDialClasses.d.ts +1 -1
  94. package/SpeedDialAction/speedDialActionClasses.d.ts +1 -1
  95. package/SpeedDialIcon/speedDialIconClasses.d.ts +1 -1
  96. package/Step/stepClasses.d.ts +1 -1
  97. package/StepButton/stepButtonClasses.d.ts +1 -1
  98. package/StepConnector/stepConnectorClasses.d.ts +1 -1
  99. package/StepContent/stepContentClasses.d.ts +1 -1
  100. package/StepIcon/stepIconClasses.d.ts +1 -1
  101. package/StepLabel/stepLabelClasses.d.ts +1 -1
  102. package/Stepper/stepperClasses.d.ts +1 -1
  103. package/SvgIcon/svgIconClasses.d.ts +1 -1
  104. package/SwipeableDrawer/SwipeableDrawer.js +3 -1
  105. package/Switch/switchClasses.d.ts +1 -1
  106. package/Tab/tabClasses.d.ts +1 -1
  107. package/TabScrollButton/tabScrollButtonClasses.d.ts +1 -1
  108. package/Table/tableClasses.d.ts +1 -1
  109. package/TableBody/tableBodyClasses.d.ts +1 -1
  110. package/TableCell/tableCellClasses.d.ts +1 -1
  111. package/TableContainer/tableContainerClasses.d.ts +1 -1
  112. package/TableFooter/tableFooterClasses.d.ts +1 -1
  113. package/TableHead/tableHeadClasses.d.ts +1 -1
  114. package/TablePagination/tablePaginationClasses.d.ts +1 -1
  115. package/TableRow/tableRowClasses.d.ts +1 -1
  116. package/TableSortLabel/tableSortLabelClasses.d.ts +1 -1
  117. package/Tabs/tabsClasses.d.ts +1 -1
  118. package/TextField/textFieldClasses.d.ts +1 -1
  119. package/ToggleButton/toggleButtonClasses.d.ts +1 -1
  120. package/ToggleButtonGroup/toggleButtonGroupClasses.d.ts +1 -1
  121. package/Toolbar/toolbarClasses.d.ts +1 -1
  122. package/Tooltip/tooltipClasses.d.ts +1 -1
  123. package/Typography/typographyClasses.d.ts +1 -1
  124. package/Unstable_Grid2/Grid2Props.d.ts +2 -2
  125. package/Unstable_Grid2/grid2Classes.d.ts +1 -1
  126. package/esm/Chip/Chip.js +15 -2
  127. package/esm/Fab/Fab.js +8 -5
  128. package/esm/FormControl/FormControlContext.js +1 -2
  129. package/esm/IconButton/iconButtonClasses.js +1 -1
  130. package/esm/Rating/Rating.js +3 -1
  131. package/esm/Slider/Slider.js +6 -1
  132. package/esm/SwipeableDrawer/SwipeableDrawer.js +3 -1
  133. package/esm/locale/index.js +5 -5
  134. package/esm/styles/experimental_extendTheme.js +115 -103
  135. package/esm/utils/index.js +3 -1
  136. package/index.js +1 -1
  137. package/internal/switchBaseClasses.d.ts +1 -1
  138. package/legacy/Chip/Chip.js +15 -1
  139. package/legacy/Fab/Fab.js +11 -8
  140. package/legacy/FormControl/FormControlContext.js +1 -2
  141. package/legacy/IconButton/iconButtonClasses.js +1 -1
  142. package/legacy/Rating/Rating.js +10 -9
  143. package/legacy/Slider/Slider.js +2 -1
  144. package/legacy/SwipeableDrawer/SwipeableDrawer.js +3 -1
  145. package/legacy/index.js +1 -1
  146. package/legacy/locale/index.js +5 -5
  147. package/legacy/styles/experimental_extendTheme.js +136 -103
  148. package/legacy/utils/index.js +3 -1
  149. package/locale/index.js +5 -5
  150. package/modern/Chip/Chip.js +15 -2
  151. package/modern/Fab/Fab.js +8 -5
  152. package/modern/FormControl/FormControlContext.js +1 -2
  153. package/modern/IconButton/iconButtonClasses.js +1 -1
  154. package/modern/Rating/Rating.js +3 -1
  155. package/modern/Slider/Slider.js +6 -1
  156. package/modern/SwipeableDrawer/SwipeableDrawer.js +3 -1
  157. package/modern/index.js +1 -1
  158. package/modern/locale/index.js +5 -5
  159. package/modern/styles/experimental_extendTheme.js +115 -103
  160. package/modern/utils/index.js +3 -1
  161. package/package.json +6 -6
  162. package/styles/CssVarsProvider.d.ts +3 -1
  163. package/styles/experimental_extendTheme.js +114 -102
  164. package/styles/responsiveFontSizes.d.ts +2 -2
  165. package/transitions/transition.d.ts +3 -3
  166. package/umd/material-ui.development.js +265 -150
  167. package/umd/material-ui.production.min.js +20 -20
  168. package/useMediaQuery/useMediaQuery.d.ts +1 -1
  169. package/utils/index.js +3 -1
@@ -3,7 +3,7 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
3
3
  const _excluded = ["colorSchemes", "cssVarPrefix"],
4
4
  _excluded2 = ["palette"];
5
5
  import { deepmerge } from '@mui/utils';
6
- import { colorChannel, alpha, darken, lighten, emphasize, unstable_createGetCssVar as systemCreateGetCssVar } from '@mui/system';
6
+ 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';
7
7
  import createThemeWithoutVars from './createTheme';
8
8
  import getOverlayAlpha from './getOverlayAlpha';
9
9
  const defaultDarkOverlays = [...Array(25)].map((_, index) => {
@@ -21,8 +21,18 @@ function assignNode(obj, keys) {
21
21
  });
22
22
  }
23
23
  function setColor(obj, key, defaultValue) {
24
- obj[key] = obj[key] || defaultValue;
24
+ if (!obj[key] && defaultValue) {
25
+ obj[key] = defaultValue;
26
+ }
25
27
  }
28
+ const silent = fn => {
29
+ try {
30
+ return fn();
31
+ } catch (error) {
32
+ // ignore error
33
+ }
34
+ return undefined;
35
+ };
26
36
  export const createGetCssVar = (cssVarPrefix = 'mui') => systemCreateGetCssVar(cssVarPrefix);
27
37
  export default function extendTheme(options = {}, ...args) {
28
38
  const {
@@ -86,22 +96,22 @@ export default function extendTheme(options = {}, ...args) {
86
96
  // assign component variables
87
97
  assignNode(palette, ['Alert', 'AppBar', 'Avatar', 'Chip', 'FilledInput', 'LinearProgress', 'Skeleton', 'Slider', 'SnackbarContent', 'SpeedDialAction', 'StepConnector', 'StepContent', 'Switch', 'TableCell', 'Tooltip']);
88
98
  if (key === 'light') {
89
- setColor(palette.Alert, 'errorColor', darken(palette.error.light, 0.6));
90
- setColor(palette.Alert, 'infoColor', darken(palette.info.light, 0.6));
91
- setColor(palette.Alert, 'successColor', darken(palette.success.light, 0.6));
92
- setColor(palette.Alert, 'warningColor', darken(palette.warning.light, 0.6));
99
+ setColor(palette.Alert, 'errorColor', safeDarken(palette.error.light, 0.6));
100
+ setColor(palette.Alert, 'infoColor', safeDarken(palette.info.light, 0.6));
101
+ setColor(palette.Alert, 'successColor', safeDarken(palette.success.light, 0.6));
102
+ setColor(palette.Alert, 'warningColor', safeDarken(palette.warning.light, 0.6));
93
103
  setColor(palette.Alert, 'errorFilledBg', getCssVar('palette-error-main'));
94
104
  setColor(palette.Alert, 'infoFilledBg', getCssVar('palette-info-main'));
95
105
  setColor(palette.Alert, 'successFilledBg', getCssVar('palette-success-main'));
96
106
  setColor(palette.Alert, 'warningFilledBg', getCssVar('palette-warning-main'));
97
- setColor(palette.Alert, 'errorFilledColor', lightPalette.getContrastText(palette.error.main));
98
- setColor(palette.Alert, 'infoFilledColor', lightPalette.getContrastText(palette.info.main));
99
- setColor(palette.Alert, 'successFilledColor', lightPalette.getContrastText(palette.success.main));
100
- setColor(palette.Alert, 'warningFilledColor', lightPalette.getContrastText(palette.warning.main));
101
- setColor(palette.Alert, 'errorStandardBg', lighten(palette.error.light, 0.9));
102
- setColor(palette.Alert, 'infoStandardBg', lighten(palette.info.light, 0.9));
103
- setColor(palette.Alert, 'successStandardBg', lighten(palette.success.light, 0.9));
104
- setColor(palette.Alert, 'warningStandardBg', lighten(palette.warning.light, 0.9));
107
+ setColor(palette.Alert, 'errorFilledColor', silent(() => lightPalette.getContrastText(palette.error.main)));
108
+ setColor(palette.Alert, 'infoFilledColor', silent(() => lightPalette.getContrastText(palette.info.main)));
109
+ setColor(palette.Alert, 'successFilledColor', silent(() => lightPalette.getContrastText(palette.success.main)));
110
+ setColor(palette.Alert, 'warningFilledColor', silent(() => lightPalette.getContrastText(palette.warning.main)));
111
+ setColor(palette.Alert, 'errorStandardBg', safeLighten(palette.error.light, 0.9));
112
+ setColor(palette.Alert, 'infoStandardBg', safeLighten(palette.info.light, 0.9));
113
+ setColor(palette.Alert, 'successStandardBg', safeLighten(palette.success.light, 0.9));
114
+ setColor(palette.Alert, 'warningStandardBg', safeLighten(palette.warning.light, 0.9));
105
115
  setColor(palette.Alert, 'errorIconColor', getCssVar('palette-error-light'));
106
116
  setColor(palette.Alert, 'infoIconColor', getCssVar('palette-info-light'));
107
117
  setColor(palette.Alert, 'successIconColor', getCssVar('palette-success-light'));
@@ -114,52 +124,52 @@ export default function extendTheme(options = {}, ...args) {
114
124
  setColor(palette.FilledInput, 'bg', 'rgba(0, 0, 0, 0.06)');
115
125
  setColor(palette.FilledInput, 'hoverBg', 'rgba(0, 0, 0, 0.09)');
116
126
  setColor(palette.FilledInput, 'disabledBg', 'rgba(0, 0, 0, 0.12)');
117
- setColor(palette.LinearProgress, 'primaryBg', lighten(palette.primary.main, 0.62));
118
- setColor(palette.LinearProgress, 'secondaryBg', lighten(palette.secondary.main, 0.62));
119
- setColor(palette.LinearProgress, 'errorBg', lighten(palette.error.main, 0.62));
120
- setColor(palette.LinearProgress, 'infoBg', lighten(palette.info.main, 0.62));
121
- setColor(palette.LinearProgress, 'successBg', lighten(palette.success.main, 0.62));
122
- setColor(palette.LinearProgress, 'warningBg', lighten(palette.warning.main, 0.62));
127
+ setColor(palette.LinearProgress, 'primaryBg', safeLighten(palette.primary.main, 0.62));
128
+ setColor(palette.LinearProgress, 'secondaryBg', safeLighten(palette.secondary.main, 0.62));
129
+ setColor(palette.LinearProgress, 'errorBg', safeLighten(palette.error.main, 0.62));
130
+ setColor(palette.LinearProgress, 'infoBg', safeLighten(palette.info.main, 0.62));
131
+ setColor(palette.LinearProgress, 'successBg', safeLighten(palette.success.main, 0.62));
132
+ setColor(palette.LinearProgress, 'warningBg', safeLighten(palette.warning.main, 0.62));
123
133
  setColor(palette.Skeleton, 'bg', `rgba(${getCssVar('palette-text-primaryChannel')} / 0.11)`);
124
- setColor(palette.Slider, 'primaryTrack', lighten(palette.primary.main, 0.62));
125
- setColor(palette.Slider, 'secondaryTrack', lighten(palette.secondary.main, 0.62));
126
- setColor(palette.Slider, 'errorTrack', lighten(palette.error.main, 0.62));
127
- setColor(palette.Slider, 'infoTrack', lighten(palette.info.main, 0.62));
128
- setColor(palette.Slider, 'successTrack', lighten(palette.success.main, 0.62));
129
- setColor(palette.Slider, 'warningTrack', lighten(palette.warning.main, 0.62));
130
- const snackbarContentBackground = emphasize(palette.background.default, 0.8);
134
+ setColor(palette.Slider, 'primaryTrack', safeLighten(palette.primary.main, 0.62));
135
+ setColor(palette.Slider, 'secondaryTrack', safeLighten(palette.secondary.main, 0.62));
136
+ setColor(palette.Slider, 'errorTrack', safeLighten(palette.error.main, 0.62));
137
+ setColor(palette.Slider, 'infoTrack', safeLighten(palette.info.main, 0.62));
138
+ setColor(palette.Slider, 'successTrack', safeLighten(palette.success.main, 0.62));
139
+ setColor(palette.Slider, 'warningTrack', safeLighten(palette.warning.main, 0.62));
140
+ const snackbarContentBackground = safeEmphasize(palette.background.default, 0.8);
131
141
  setColor(palette.SnackbarContent, 'bg', snackbarContentBackground);
132
- setColor(palette.SnackbarContent, 'color', lightPalette.getContrastText(snackbarContentBackground));
133
- setColor(palette.SpeedDialAction, 'fabHoverBg', emphasize(palette.background.paper, 0.15));
142
+ setColor(palette.SnackbarContent, 'color', silent(() => lightPalette.getContrastText(snackbarContentBackground)));
143
+ setColor(palette.SpeedDialAction, 'fabHoverBg', safeEmphasize(palette.background.paper, 0.15));
134
144
  setColor(palette.StepConnector, 'border', getCssVar('palette-grey-400'));
135
145
  setColor(palette.StepContent, 'border', getCssVar('palette-grey-400'));
136
146
  setColor(palette.Switch, 'defaultColor', getCssVar('palette-common-white'));
137
147
  setColor(palette.Switch, 'defaultDisabledColor', getCssVar('palette-grey-100'));
138
- setColor(palette.Switch, 'primaryDisabledColor', lighten(palette.primary.main, 0.62));
139
- setColor(palette.Switch, 'secondaryDisabledColor', lighten(palette.secondary.main, 0.62));
140
- setColor(palette.Switch, 'errorDisabledColor', lighten(palette.error.main, 0.62));
141
- setColor(palette.Switch, 'infoDisabledColor', lighten(palette.info.main, 0.62));
142
- setColor(palette.Switch, 'successDisabledColor', lighten(palette.success.main, 0.62));
143
- setColor(palette.Switch, 'warningDisabledColor', lighten(palette.warning.main, 0.62));
144
- setColor(palette.TableCell, 'border', lighten(alpha(palette.divider, 1), 0.88));
145
- setColor(palette.Tooltip, 'bg', alpha(palette.grey[700], 0.92));
148
+ setColor(palette.Switch, 'primaryDisabledColor', safeLighten(palette.primary.main, 0.62));
149
+ setColor(palette.Switch, 'secondaryDisabledColor', safeLighten(palette.secondary.main, 0.62));
150
+ setColor(palette.Switch, 'errorDisabledColor', safeLighten(palette.error.main, 0.62));
151
+ setColor(palette.Switch, 'infoDisabledColor', safeLighten(palette.info.main, 0.62));
152
+ setColor(palette.Switch, 'successDisabledColor', safeLighten(palette.success.main, 0.62));
153
+ setColor(palette.Switch, 'warningDisabledColor', safeLighten(palette.warning.main, 0.62));
154
+ setColor(palette.TableCell, 'border', safeLighten(safeAlpha(palette.divider, 1), 0.88));
155
+ setColor(palette.Tooltip, 'bg', safeAlpha(palette.grey[700], 0.92));
146
156
  } else {
147
- setColor(palette.Alert, 'errorColor', lighten(palette.error.light, 0.6));
148
- setColor(palette.Alert, 'infoColor', lighten(palette.info.light, 0.6));
149
- setColor(palette.Alert, 'successColor', lighten(palette.success.light, 0.6));
150
- setColor(palette.Alert, 'warningColor', lighten(palette.warning.light, 0.6));
157
+ setColor(palette.Alert, 'errorColor', safeLighten(palette.error.light, 0.6));
158
+ setColor(palette.Alert, 'infoColor', safeLighten(palette.info.light, 0.6));
159
+ setColor(palette.Alert, 'successColor', safeLighten(palette.success.light, 0.6));
160
+ setColor(palette.Alert, 'warningColor', safeLighten(palette.warning.light, 0.6));
151
161
  setColor(palette.Alert, 'errorFilledBg', getCssVar('palette-error-dark'));
152
162
  setColor(palette.Alert, 'infoFilledBg', getCssVar('palette-info-dark'));
153
163
  setColor(palette.Alert, 'successFilledBg', getCssVar('palette-success-dark'));
154
164
  setColor(palette.Alert, 'warningFilledBg', getCssVar('palette-warning-dark'));
155
- setColor(palette.Alert, 'errorFilledColor', darkPalette.getContrastText(palette.error.dark));
156
- setColor(palette.Alert, 'infoFilledColor', darkPalette.getContrastText(palette.info.dark));
157
- setColor(palette.Alert, 'successFilledColor', darkPalette.getContrastText(palette.success.dark));
158
- setColor(palette.Alert, 'warningFilledColor', darkPalette.getContrastText(palette.warning.dark));
159
- setColor(palette.Alert, 'errorStandardBg', darken(palette.error.light, 0.9));
160
- setColor(palette.Alert, 'infoStandardBg', darken(palette.info.light, 0.9));
161
- setColor(palette.Alert, 'successStandardBg', darken(palette.success.light, 0.9));
162
- setColor(palette.Alert, 'warningStandardBg', darken(palette.warning.light, 0.9));
165
+ setColor(palette.Alert, 'errorFilledColor', silent(() => darkPalette.getContrastText(palette.error.dark)));
166
+ setColor(palette.Alert, 'infoFilledColor', silent(() => darkPalette.getContrastText(palette.info.dark)));
167
+ setColor(palette.Alert, 'successFilledColor', silent(() => darkPalette.getContrastText(palette.success.dark)));
168
+ setColor(palette.Alert, 'warningFilledColor', silent(() => darkPalette.getContrastText(palette.warning.dark)));
169
+ setColor(palette.Alert, 'errorStandardBg', safeDarken(palette.error.light, 0.9));
170
+ setColor(palette.Alert, 'infoStandardBg', safeDarken(palette.info.light, 0.9));
171
+ setColor(palette.Alert, 'successStandardBg', safeDarken(palette.success.light, 0.9));
172
+ setColor(palette.Alert, 'warningStandardBg', safeDarken(palette.warning.light, 0.9));
163
173
  setColor(palette.Alert, 'errorIconColor', getCssVar('palette-error-main'));
164
174
  setColor(palette.Alert, 'infoIconColor', getCssVar('palette-info-main'));
165
175
  setColor(palette.Alert, 'successIconColor', getCssVar('palette-success-main'));
@@ -174,72 +184,74 @@ export default function extendTheme(options = {}, ...args) {
174
184
  setColor(palette.FilledInput, 'bg', 'rgba(255, 255, 255, 0.09)');
175
185
  setColor(palette.FilledInput, 'hoverBg', 'rgba(255, 255, 255, 0.13)');
176
186
  setColor(palette.FilledInput, 'disabledBg', 'rgba(255, 255, 255, 0.12)');
177
- setColor(palette.LinearProgress, 'primaryBg', darken(palette.primary.main, 0.5));
178
- setColor(palette.LinearProgress, 'secondaryBg', darken(palette.secondary.main, 0.5));
179
- setColor(palette.LinearProgress, 'errorBg', darken(palette.error.main, 0.5));
180
- setColor(palette.LinearProgress, 'infoBg', darken(palette.info.main, 0.5));
181
- setColor(palette.LinearProgress, 'successBg', darken(palette.success.main, 0.5));
182
- setColor(palette.LinearProgress, 'warningBg', darken(palette.warning.main, 0.5));
187
+ setColor(palette.LinearProgress, 'primaryBg', safeDarken(palette.primary.main, 0.5));
188
+ setColor(palette.LinearProgress, 'secondaryBg', safeDarken(palette.secondary.main, 0.5));
189
+ setColor(palette.LinearProgress, 'errorBg', safeDarken(palette.error.main, 0.5));
190
+ setColor(palette.LinearProgress, 'infoBg', safeDarken(palette.info.main, 0.5));
191
+ setColor(palette.LinearProgress, 'successBg', safeDarken(palette.success.main, 0.5));
192
+ setColor(palette.LinearProgress, 'warningBg', safeDarken(palette.warning.main, 0.5));
183
193
  setColor(palette.Skeleton, 'bg', `rgba(${getCssVar('palette-text-primaryChannel')} / 0.13)`);
184
- setColor(palette.Slider, 'primaryTrack', darken(palette.primary.main, 0.5));
185
- setColor(palette.Slider, 'secondaryTrack', darken(palette.secondary.main, 0.5));
186
- setColor(palette.Slider, 'errorTrack', darken(palette.error.main, 0.5));
187
- setColor(palette.Slider, 'infoTrack', darken(palette.info.main, 0.5));
188
- setColor(palette.Slider, 'successTrack', darken(palette.success.main, 0.5));
189
- setColor(palette.Slider, 'warningTrack', darken(palette.warning.main, 0.5));
190
- const snackbarContentBackground = emphasize(palette.background.default, 0.98);
194
+ setColor(palette.Slider, 'primaryTrack', safeDarken(palette.primary.main, 0.5));
195
+ setColor(palette.Slider, 'secondaryTrack', safeDarken(palette.secondary.main, 0.5));
196
+ setColor(palette.Slider, 'errorTrack', safeDarken(palette.error.main, 0.5));
197
+ setColor(palette.Slider, 'infoTrack', safeDarken(palette.info.main, 0.5));
198
+ setColor(palette.Slider, 'successTrack', safeDarken(palette.success.main, 0.5));
199
+ setColor(palette.Slider, 'warningTrack', safeDarken(palette.warning.main, 0.5));
200
+ const snackbarContentBackground = safeEmphasize(palette.background.default, 0.98);
191
201
  setColor(palette.SnackbarContent, 'bg', snackbarContentBackground);
192
- setColor(palette.SnackbarContent, 'color', darkPalette.getContrastText(snackbarContentBackground));
193
- setColor(palette.SpeedDialAction, 'fabHoverBg', emphasize(palette.background.paper, 0.15));
202
+ setColor(palette.SnackbarContent, 'color', silent(() => darkPalette.getContrastText(snackbarContentBackground)));
203
+ setColor(palette.SpeedDialAction, 'fabHoverBg', safeEmphasize(palette.background.paper, 0.15));
194
204
  setColor(palette.StepConnector, 'border', getCssVar('palette-grey-600'));
195
205
  setColor(palette.StepContent, 'border', getCssVar('palette-grey-600'));
196
206
  setColor(palette.Switch, 'defaultColor', getCssVar('palette-grey-300'));
197
207
  setColor(palette.Switch, 'defaultDisabledColor', getCssVar('palette-grey-600'));
198
- setColor(palette.Switch, 'primaryDisabledColor', darken(palette.primary.main, 0.55));
199
- setColor(palette.Switch, 'secondaryDisabledColor', darken(palette.secondary.main, 0.55));
200
- setColor(palette.Switch, 'errorDisabledColor', darken(palette.error.main, 0.55));
201
- setColor(palette.Switch, 'infoDisabledColor', darken(palette.info.main, 0.55));
202
- setColor(palette.Switch, 'successDisabledColor', darken(palette.success.main, 0.55));
203
- setColor(palette.Switch, 'warningDisabledColor', darken(palette.warning.main, 0.55));
204
- setColor(palette.TableCell, 'border', darken(alpha(palette.divider, 1), 0.68));
205
- setColor(palette.Tooltip, 'bg', alpha(palette.grey[700], 0.92));
208
+ setColor(palette.Switch, 'primaryDisabledColor', safeDarken(palette.primary.main, 0.55));
209
+ setColor(palette.Switch, 'secondaryDisabledColor', safeDarken(palette.secondary.main, 0.55));
210
+ setColor(palette.Switch, 'errorDisabledColor', safeDarken(palette.error.main, 0.55));
211
+ setColor(palette.Switch, 'infoDisabledColor', safeDarken(palette.info.main, 0.55));
212
+ setColor(palette.Switch, 'successDisabledColor', safeDarken(palette.success.main, 0.55));
213
+ setColor(palette.Switch, 'warningDisabledColor', safeDarken(palette.warning.main, 0.55));
214
+ setColor(palette.TableCell, 'border', safeDarken(safeAlpha(palette.divider, 1), 0.68));
215
+ setColor(palette.Tooltip, 'bg', safeAlpha(palette.grey[700], 0.92));
206
216
  }
207
- palette.background.defaultChannel = colorChannel(palette.background.default); // MUI X - DataGrid needs this token.
217
+ 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.
208
218
 
209
- palette.common.backgroundChannel = colorChannel(palette.common.background);
210
- palette.common.onBackgroundChannel = colorChannel(palette.common.onBackground);
211
- palette.dividerChannel = colorChannel(palette.divider);
219
+ 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().'));
220
+ 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().'));
221
+ 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().'));
212
222
  Object.keys(palette).forEach(color => {
213
223
  const colors = palette[color];
214
224
 
215
- // Color palettes: primary, secondary, error, info, success, and warning
216
- if (colors.main) {
217
- palette[color].mainChannel = colorChannel(colors.main);
218
- }
219
- if (colors.light) {
220
- palette[color].lightChannel = colorChannel(colors.light);
221
- }
222
- if (colors.dark) {
223
- palette[color].darkChannel = colorChannel(colors.dark);
224
- }
225
- if (colors.contrastText) {
226
- palette[color].contrastTextChannel = colorChannel(colors.contrastText);
227
- }
228
-
229
- // Text colors: text.primary, text.secondary
230
- if (colors.primary) {
231
- palette[color].primaryChannel = colorChannel(colors.primary);
232
- }
233
- if (colors.secondary) {
234
- palette[color].secondaryChannel = colorChannel(colors.secondary);
235
- }
225
+ // The default palettes (primary, secondary, error, info, success, and warning) errors are handled by the above `createTheme(...)`.
236
226
 
237
- // Action colors: action.active, action.selected
238
- if (colors.active) {
239
- palette[color].activeChannel = colorChannel(colors.active);
240
- }
241
- if (colors.selected) {
242
- palette[color].selectedChannel = colorChannel(colors.selected);
227
+ if (colors && typeof colors === 'object') {
228
+ // Silent the error for custom palettes.
229
+ if (colors.main) {
230
+ setColor(palette[color], 'mainChannel', safeColorChannel(colors.main));
231
+ }
232
+ if (colors.light) {
233
+ setColor(palette[color], 'lightChannel', safeColorChannel(colors.light));
234
+ }
235
+ if (colors.dark) {
236
+ setColor(palette[color], 'darkChannel', safeColorChannel(colors.dark));
237
+ }
238
+ if (colors.contrastText) {
239
+ setColor(palette[color], 'contrastTextChannel', safeColorChannel(colors.contrastText));
240
+ }
241
+ if (color === 'text') {
242
+ // Text colors: text.primary, text.secondary
243
+ 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().'));
244
+ 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().'));
245
+ }
246
+ if (color === 'action') {
247
+ // Action colors: action.active, action.selected
248
+ if (colors.active) {
249
+ 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().'));
250
+ }
251
+ if (colors.selected) {
252
+ 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().'));
253
+ }
254
+ }
243
255
  }
244
256
  });
245
257
  });
@@ -20,7 +20,9 @@ export { default as useIsFocusVisible } from './useIsFocusVisible';
20
20
  // eslint-disable-next-line @typescript-eslint/naming-convention
21
21
  export const unstable_ClassNameGenerator = {
22
22
  configure: generator => {
23
- 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'));
23
+ if (process.env.NODE_ENV !== 'production') {
24
+ 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'));
25
+ }
24
26
  ClassNameGenerator.configure(generator);
25
27
  }
26
28
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mui/material",
3
- "version": "5.10.15",
3
+ "version": "5.10.17",
4
4
  "private": false,
5
5
  "author": "MUI Team",
6
6
  "description": "React components that implement Google's Material Design.",
@@ -46,11 +46,11 @@
46
46
  },
47
47
  "dependencies": {
48
48
  "@babel/runtime": "^7.20.1",
49
- "@mui/base": "5.0.0-alpha.107",
50
- "@mui/core-downloads-tracker": "^5.10.15",
51
- "@mui/system": "^5.10.15",
52
- "@mui/types": "^7.2.1",
53
- "@mui/utils": "^5.10.15",
49
+ "@mui/base": "5.0.0-alpha.109",
50
+ "@mui/core-downloads-tracker": "^5.10.17",
51
+ "@mui/system": "^5.10.17",
52
+ "@mui/types": "^7.2.2",
53
+ "@mui/utils": "^5.10.16",
54
54
  "@types/react-transition-group": "^4.4.5",
55
55
  "clsx": "^1.2.1",
56
56
  "csstype": "^3.1.1",
@@ -7,8 +7,10 @@ declare const CssVarsProvider: (props: import("react").PropsWithChildren<Partial
7
7
  colorSchemes: Record<SupportedColorScheme, Record<string, any>>;
8
8
  } | undefined;
9
9
  documentNode?: Document | null | undefined;
10
- colorSchemeNode?: Document | HTMLElement | null | undefined;
10
+ colorSchemeNode?: Element | null | undefined;
11
11
  colorSchemeSelector?: string | undefined;
12
12
  storageWindow?: Window | null | undefined;
13
+ disableNestedContext?: boolean | undefined;
14
+ disableStyleSheetGeneration?: boolean | undefined;
13
15
  }>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, useColorScheme: () => import("@mui/system").ColorSchemeContextValue<SupportedColorScheme>, getInitColorSchemeScript: typeof import("@mui/system").getInitColorSchemeScript;
14
16
  export { useColorScheme, getInitColorSchemeScript, shouldSkipGeneratingVar, CssVarsProvider as Experimental_CssVarsProvider, };