@mui/material 5.4.1 → 5.4.4

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 (246) hide show
  1. package/Accordion/accordionClasses.d.ts +18 -18
  2. package/AccordionActions/accordionActionsClasses.d.ts +10 -10
  3. package/AccordionDetails/accordionDetailsClasses.d.ts +8 -8
  4. package/AccordionSummary/accordionSummaryClasses.d.ts +22 -22
  5. package/Alert/alertClasses.d.ts +44 -44
  6. package/AlertTitle/alertTitleClasses.d.ts +8 -8
  7. package/AppBar/appBarClasses.d.ts +28 -28
  8. package/Autocomplete/autocompleteClasses.d.ts +54 -54
  9. package/Avatar/avatarClasses.d.ts +20 -20
  10. package/AvatarGroup/avatarGroupClasses.d.ts +10 -10
  11. package/BottomNavigation/BottomNavigation.js +0 -0
  12. package/BottomNavigation/bottomNavigationClasses.d.ts +8 -8
  13. package/BottomNavigationAction/bottomNavigationActionClasses.d.ts +14 -14
  14. package/Breadcrumbs/breadcrumbsClasses.d.ts +14 -14
  15. package/Button/buttonClasses.d.ts +76 -76
  16. package/ButtonBase/ButtonBase.d.ts +1 -1
  17. package/ButtonBase/ButtonBase.js +1 -1
  18. package/ButtonBase/buttonBaseClasses.d.ts +12 -12
  19. package/ButtonBase/touchRippleClasses.d.ts +20 -20
  20. package/ButtonGroup/ButtonGroupContext.d.ts +18 -18
  21. package/ButtonGroup/buttonGroupClasses.d.ts +58 -58
  22. package/CHANGELOG.md +177 -0
  23. package/Card/cardClasses.d.ts +8 -8
  24. package/CardActionArea/cardActionAreaClasses.d.ts +12 -12
  25. package/CardActions/cardActionsClasses.d.ts +10 -10
  26. package/CardContent/cardContentClasses.d.ts +8 -8
  27. package/CardHeader/cardHeaderClasses.d.ts +18 -18
  28. package/CardMedia/cardMediaClasses.d.ts +12 -12
  29. package/Checkbox/checkboxClasses.d.ts +18 -18
  30. package/Chip/Chip.js +1 -0
  31. package/Chip/chipClasses.d.ts +80 -80
  32. package/CircularProgress/circularProgressClasses.d.ts +26 -26
  33. package/ClickAwayListener/index.d.ts +2 -2
  34. package/Collapse/collapseClasses.d.ts +18 -18
  35. package/Container/containerClasses.d.ts +22 -22
  36. package/Dialog/Dialog.d.ts +4 -1
  37. package/Dialog/Dialog.js +10 -6
  38. package/Dialog/DialogContext.d.ts +6 -6
  39. package/Dialog/dialogClasses.d.ts +36 -36
  40. package/DialogActions/dialogActionsClasses.d.ts +10 -10
  41. package/DialogContent/dialogContentClasses.d.ts +10 -10
  42. package/DialogContentText/dialogContentTextClasses.d.ts +8 -8
  43. package/DialogTitle/dialogTitleClasses.d.ts +8 -8
  44. package/Divider/dividerClasses.d.ts +34 -34
  45. package/Drawer/Drawer.d.ts +4 -1
  46. package/Drawer/Drawer.js +11 -9
  47. package/Drawer/drawerClasses.d.ts +30 -30
  48. package/Fab/fabClasses.d.ts +26 -26
  49. package/Fade/Fade.d.ts +2 -2
  50. package/Fade/Fade.js +8 -8
  51. package/FilledInput/filledInputClasses.d.ts +40 -40
  52. package/FilledInput/filledInputClasses.js +5 -1
  53. package/FormControl/formControlClasses.d.ts +14 -14
  54. package/FormControlLabel/formControlLabelClasses.d.ts +20 -20
  55. package/FormGroup/formGroupClasses.d.ts +12 -12
  56. package/FormHelperText/formHelperTextClasses.d.ts +22 -22
  57. package/FormLabel/formLabelClasses.d.ts +22 -22
  58. package/Grid/gridClasses.d.ts +48 -48
  59. package/Icon/iconClasses.d.ts +24 -24
  60. package/IconButton/iconButtonClasses.d.ts +26 -26
  61. package/ImageList/imageListClasses.d.ts +16 -16
  62. package/ImageListItem/imageListItemClasses.d.ts +18 -18
  63. package/ImageListItemBar/imageListItemBarClasses.d.ts +30 -30
  64. package/Input/inputClasses.d.ts +34 -34
  65. package/Input/inputClasses.js +5 -1
  66. package/InputAdornment/inputAdornmentClasses.d.ts +24 -24
  67. package/InputBase/inputBaseClasses.d.ts +44 -44
  68. package/InputLabel/inputLabelClasses.d.ts +32 -32
  69. package/LinearProgress/linearProgressClasses.d.ts +42 -42
  70. package/Link/linkClasses.d.ts +18 -18
  71. package/List/listClasses.d.ts +14 -14
  72. package/ListItem/listItemClasses.d.ts +30 -30
  73. package/ListItemAvatar/listItemAvatarClasses.d.ts +10 -10
  74. package/ListItemButton/listItemButtonClasses.d.ts +22 -22
  75. package/ListItemIcon/listItemIconClasses.d.ts +10 -10
  76. package/ListItemSecondaryAction/listItemSecondaryActionClasses.d.ts +10 -10
  77. package/ListItemText/listItemTextClasses.d.ts +18 -18
  78. package/ListSubheader/listSubheaderClasses.d.ts +18 -18
  79. package/Menu/menuClasses.d.ts +12 -12
  80. package/MenuItem/menuItemClasses.d.ts +20 -20
  81. package/MobileStepper/mobileStepperClasses.d.ts +22 -22
  82. package/NativeSelect/nativeSelectClasses.d.ts +32 -32
  83. package/OutlinedInput/NotchedOutline.js +3 -1
  84. package/OutlinedInput/outlinedInputClasses.d.ts +36 -36
  85. package/OutlinedInput/outlinedInputClasses.js +5 -1
  86. package/Pagination/paginationClasses.d.ts +14 -14
  87. package/PaginationItem/paginationItemClasses.d.ts +42 -42
  88. package/Paper/paperClasses.d.ts +39 -39
  89. package/Popover/popoverClasses.d.ts +10 -10
  90. package/Popper/Popper.d.ts +17 -17
  91. package/Popper/Popper.js +1 -1
  92. package/README.md +1 -1
  93. package/Radio/radioClasses.d.ts +16 -16
  94. package/RadioGroup/RadioGroupContext.d.ts +11 -11
  95. package/RadioGroup/useRadioGroup.d.ts +4 -4
  96. package/Rating/ratingClasses.d.ts +40 -40
  97. package/ScopedCssBaseline/scopedCssBaselineClasses.d.ts +8 -8
  98. package/Select/Select.js +19 -7
  99. package/Select/selectClasses.d.ts +30 -30
  100. package/Skeleton/skeletonClasses.d.ts +24 -24
  101. package/Slide/Slide.d.ts +4 -4
  102. package/Slide/Slide.js +14 -14
  103. package/Snackbar/Snackbar.d.ts +2 -2
  104. package/Snackbar/Snackbar.js +8 -8
  105. package/Snackbar/snackbarClasses.d.ts +20 -20
  106. package/SnackbarContent/snackbarContentClasses.d.ts +12 -12
  107. package/SpeedDial/SpeedDial.d.ts +2 -2
  108. package/SpeedDial/SpeedDial.js +9 -7
  109. package/SpeedDial/speedDialClasses.d.ts +22 -22
  110. package/SpeedDialAction/speedDialActionClasses.d.ts +20 -20
  111. package/SpeedDialIcon/speedDialIconClasses.d.ts +18 -18
  112. package/Step/StepContext.d.ts +20 -0
  113. package/Step/StepContext.js +10 -2
  114. package/Step/index.d.ts +3 -0
  115. package/Step/index.js +3 -1
  116. package/Step/stepClasses.d.ts +16 -16
  117. package/StepButton/stepButtonClasses.d.ts +14 -14
  118. package/StepConnector/stepConnectorClasses.d.ts +26 -26
  119. package/StepContent/stepContentClasses.d.ts +12 -12
  120. package/StepIcon/stepIconClasses.d.ts +16 -16
  121. package/StepLabel/stepLabelClasses.d.ts +28 -28
  122. package/Stepper/stepperClasses.d.ts +14 -14
  123. package/SvgIcon/svgIconClasses.d.ts +24 -24
  124. package/SwipeableDrawer/SwipeableDrawer.js +8 -6
  125. package/Switch/switchClasses.d.ts +32 -32
  126. package/Tab/tabClasses.d.ts +26 -26
  127. package/TabScrollButton/tabScrollButtonClasses.d.ts +12 -12
  128. package/Table/tableClasses.d.ts +10 -10
  129. package/TableBody/tableBodyClasses.d.ts +8 -8
  130. package/TableCell/tableCellClasses.d.ts +32 -32
  131. package/TableContainer/tableContainerClasses.d.ts +8 -8
  132. package/TableFooter/tableFooterClasses.d.ts +8 -8
  133. package/TableHead/tableHeadClasses.d.ts +8 -8
  134. package/TablePagination/tablePaginationClasses.d.ts +28 -28
  135. package/TableRow/tableRowClasses.d.ts +16 -16
  136. package/TableSortLabel/tableSortLabelClasses.d.ts +16 -16
  137. package/Tabs/tabsClasses.d.ts +32 -32
  138. package/TextField/textFieldClasses.d.ts +8 -8
  139. package/ToggleButton/ToggleButton.d.ts +15 -0
  140. package/ToggleButton/ToggleButton.js +8 -2
  141. package/ToggleButton/toggleButtonClasses.d.ts +24 -24
  142. package/ToggleButtonGroup/toggleButtonGroupClasses.d.ts +18 -18
  143. package/Toolbar/toolbarClasses.d.ts +14 -14
  144. package/Tooltip/tooltipClasses.d.ts +30 -30
  145. package/Typography/typographyClasses.d.ts +50 -50
  146. package/Zoom/Zoom.d.ts +2 -2
  147. package/Zoom/Zoom.js +8 -8
  148. package/darkScrollbar/index.d.ts +28 -28
  149. package/index.d.ts +3 -0
  150. package/index.js +3 -1
  151. package/internal/switchBaseClasses.d.ts +12 -12
  152. package/legacy/BottomNavigation/BottomNavigation.js +0 -0
  153. package/legacy/ButtonBase/ButtonBase.js +1 -1
  154. package/legacy/Chip/Chip.js +1 -0
  155. package/legacy/Dialog/Dialog.js +10 -6
  156. package/legacy/Drawer/Drawer.js +11 -9
  157. package/legacy/Fade/Fade.js +8 -8
  158. package/legacy/FilledInput/filledInputClasses.js +5 -1
  159. package/legacy/Input/inputClasses.js +5 -1
  160. package/legacy/OutlinedInput/NotchedOutline.js +3 -1
  161. package/legacy/OutlinedInput/outlinedInputClasses.js +5 -1
  162. package/legacy/Popper/Popper.js +1 -1
  163. package/legacy/Select/Select.js +23 -7
  164. package/legacy/Slide/Slide.js +14 -14
  165. package/legacy/Snackbar/Snackbar.js +8 -8
  166. package/legacy/SpeedDial/SpeedDial.js +9 -7
  167. package/legacy/Step/StepContext.js +10 -2
  168. package/legacy/Step/index.js +3 -1
  169. package/legacy/SwipeableDrawer/SwipeableDrawer.js +8 -6
  170. package/legacy/ToggleButton/ToggleButton.js +8 -2
  171. package/legacy/Zoom/Zoom.js +8 -8
  172. package/legacy/index.js +3 -1
  173. package/legacy/locale/index.js +86 -78
  174. package/legacy/styles/makeStyles.js +1 -1
  175. package/legacy/styles/withStyles.js +1 -1
  176. package/legacy/styles/withTheme.js +1 -1
  177. package/locale/index.d.ts +68 -68
  178. package/locale/index.js +12 -6
  179. package/modern/BottomNavigation/BottomNavigation.js +0 -0
  180. package/modern/ButtonBase/ButtonBase.js +1 -1
  181. package/modern/Chip/Chip.js +1 -0
  182. package/modern/Dialog/Dialog.js +10 -6
  183. package/modern/Drawer/Drawer.js +11 -9
  184. package/modern/Fade/Fade.js +8 -8
  185. package/modern/FilledInput/filledInputClasses.js +5 -1
  186. package/modern/Input/inputClasses.js +5 -1
  187. package/modern/OutlinedInput/NotchedOutline.js +3 -1
  188. package/modern/OutlinedInput/outlinedInputClasses.js +5 -1
  189. package/modern/Popper/Popper.js +1 -1
  190. package/modern/Select/Select.js +19 -7
  191. package/modern/Slide/Slide.js +14 -14
  192. package/modern/Snackbar/Snackbar.js +8 -8
  193. package/modern/SpeedDial/SpeedDial.js +9 -7
  194. package/modern/Step/StepContext.js +10 -2
  195. package/modern/Step/index.js +3 -1
  196. package/modern/SwipeableDrawer/SwipeableDrawer.js +8 -6
  197. package/modern/ToggleButton/ToggleButton.js +8 -2
  198. package/modern/Zoom/Zoom.js +8 -8
  199. package/modern/index.js +3 -1
  200. package/modern/locale/index.js +12 -6
  201. package/modern/styles/makeStyles.js +1 -1
  202. package/modern/styles/withStyles.js +1 -1
  203. package/modern/styles/withTheme.js +1 -1
  204. package/node/BottomNavigation/BottomNavigation.js +0 -0
  205. package/node/ButtonBase/ButtonBase.js +1 -1
  206. package/node/Chip/Chip.js +1 -0
  207. package/node/Dialog/Dialog.js +11 -7
  208. package/node/Drawer/Drawer.js +11 -10
  209. package/node/Fade/Fade.js +7 -9
  210. package/node/FilledInput/filledInputClasses.js +7 -1
  211. package/node/Input/inputClasses.js +7 -1
  212. package/node/OutlinedInput/NotchedOutline.js +3 -1
  213. package/node/OutlinedInput/outlinedInputClasses.js +7 -1
  214. package/node/Popper/Popper.js +1 -1
  215. package/node/Select/Select.js +22 -9
  216. package/node/Slide/Slide.js +14 -16
  217. package/node/Snackbar/Snackbar.js +8 -9
  218. package/node/SpeedDial/SpeedDial.js +9 -7
  219. package/node/Step/StepContext.js +11 -1
  220. package/node/Step/index.js +22 -1
  221. package/node/SwipeableDrawer/SwipeableDrawer.js +8 -7
  222. package/node/ToggleButton/ToggleButton.js +8 -2
  223. package/node/Zoom/Zoom.js +7 -9
  224. package/node/index.js +22 -1
  225. package/node/locale/index.js +12 -6
  226. package/node/styles/makeStyles.js +1 -1
  227. package/node/styles/withStyles.js +1 -1
  228. package/node/styles/withTheme.js +1 -1
  229. package/package.json +6 -6
  230. package/styles/components.d.ts +0 -339
  231. package/styles/index.d.ts +3 -0
  232. package/styles/makeStyles.js +1 -1
  233. package/styles/withStyles.js +1 -1
  234. package/styles/withTheme.js +1 -1
  235. package/transitions/index.d.ts +1 -1
  236. package/transitions/transition.d.ts +13 -13
  237. package/transitions/utils.d.ts +23 -23
  238. package/umd/material-ui.development.js +2441 -2295
  239. package/umd/material-ui.production.min.js +21 -21
  240. package/useMediaQuery/useMediaQuery.d.ts +31 -31
  241. package/useTouchRipple/index.d.ts +1 -1
  242. package/useTouchRipple/useTouchRipple.d.ts +28 -28
  243. package/utils/getScrollbarSize.d.ts +2 -2
  244. package/utils/ownerDocument.d.ts +2 -2
  245. package/utils/ownerWindow.d.ts +2 -2
  246. package/utils/setRef.d.ts +2 -2
@@ -1,8 +1,8 @@
1
- export interface CardContentClasses {
2
- /** Styles applied to the root element. */
3
- root: string;
4
- }
5
- export declare type CardContentClassKey = keyof CardContentClasses;
6
- export declare function getCardContentUtilityClass(slot: string): string;
7
- declare const cardContentClasses: CardContentClasses;
8
- export default cardContentClasses;
1
+ export interface CardContentClasses {
2
+ /** Styles applied to the root element. */
3
+ root: string;
4
+ }
5
+ export declare type CardContentClassKey = keyof CardContentClasses;
6
+ export declare function getCardContentUtilityClass(slot: string): string;
7
+ declare const cardContentClasses: CardContentClasses;
8
+ export default cardContentClasses;
@@ -1,18 +1,18 @@
1
- export interface CardHeaderClasses {
2
- /** Styles applied to the root element. */
3
- root: string;
4
- /** Styles applied to the avatar element. */
5
- avatar: string;
6
- /** Styles applied to the action element. */
7
- action: string;
8
- /** Styles applied to the content wrapper element. */
9
- content: string;
10
- /** Styles applied to the title Typography element. */
11
- title: string;
12
- /** Styles applied to the subheader Typography element. */
13
- subheader: string;
14
- }
15
- export declare type CardHeaderClassKey = keyof CardHeaderClasses;
16
- export declare function getCardHeaderUtilityClass(slot: string): string;
17
- declare const cardHeaderClasses: CardHeaderClasses;
18
- export default cardHeaderClasses;
1
+ export interface CardHeaderClasses {
2
+ /** Styles applied to the root element. */
3
+ root: string;
4
+ /** Styles applied to the avatar element. */
5
+ avatar: string;
6
+ /** Styles applied to the action element. */
7
+ action: string;
8
+ /** Styles applied to the content wrapper element. */
9
+ content: string;
10
+ /** Styles applied to the title Typography element. */
11
+ title: string;
12
+ /** Styles applied to the subheader Typography element. */
13
+ subheader: string;
14
+ }
15
+ export declare type CardHeaderClassKey = keyof CardHeaderClasses;
16
+ export declare function getCardHeaderUtilityClass(slot: string): string;
17
+ declare const cardHeaderClasses: CardHeaderClasses;
18
+ export default cardHeaderClasses;
@@ -1,12 +1,12 @@
1
- export interface CardMediaClasses {
2
- /** Styles applied to the root element. */
3
- root: string;
4
- /** Styles applied to the root element if `component="video, audio, picture, iframe, or img"`. */
5
- media: string;
6
- /** Styles applied to the root element if `component="picture or img"`. */
7
- img: string;
8
- }
9
- export declare type CardMediaClassKey = keyof CardMediaClasses;
10
- export declare function getCardMediaUtilityClass(slot: string): string;
11
- declare const cardMediaClasses: CardMediaClasses;
12
- export default cardMediaClasses;
1
+ export interface CardMediaClasses {
2
+ /** Styles applied to the root element. */
3
+ root: string;
4
+ /** Styles applied to the root element if `component="video, audio, picture, iframe, or img"`. */
5
+ media: string;
6
+ /** Styles applied to the root element if `component="picture or img"`. */
7
+ img: string;
8
+ }
9
+ export declare type CardMediaClassKey = keyof CardMediaClasses;
10
+ export declare function getCardMediaUtilityClass(slot: string): string;
11
+ declare const cardMediaClasses: CardMediaClasses;
12
+ export default cardMediaClasses;
@@ -1,18 +1,18 @@
1
- export interface CheckboxClasses {
2
- /** Styles applied to the root element. */
3
- root: string;
4
- /** State class applied to the root element if `checked={true}`. */
5
- checked: string;
6
- /** State class applied to the root element if `disabled={true}`. */
7
- disabled: string;
8
- /** State class applied to the root element if `indeterminate={true}`. */
9
- indeterminate: string;
10
- /** Styles applied to the root element if `color="primary"`. */
11
- colorPrimary: string;
12
- /** Styles applied to the root element if `color="secondary"`. */
13
- colorSecondary: string;
14
- }
15
- export declare type CheckboxClassKey = keyof CheckboxClasses;
16
- export declare function getCheckboxUtilityClass(slot: string): string;
17
- declare const checkboxClasses: CheckboxClasses;
18
- export default checkboxClasses;
1
+ export interface CheckboxClasses {
2
+ /** Styles applied to the root element. */
3
+ root: string;
4
+ /** State class applied to the root element if `checked={true}`. */
5
+ checked: string;
6
+ /** State class applied to the root element if `disabled={true}`. */
7
+ disabled: string;
8
+ /** State class applied to the root element if `indeterminate={true}`. */
9
+ indeterminate: string;
10
+ /** Styles applied to the root element if `color="primary"`. */
11
+ colorPrimary: string;
12
+ /** Styles applied to the root element if `color="secondary"`. */
13
+ colorSecondary: string;
14
+ }
15
+ export declare type CheckboxClassKey = keyof CheckboxClasses;
16
+ export declare function getCheckboxUtilityClass(slot: string): string;
17
+ declare const checkboxClasses: CheckboxClasses;
18
+ export default checkboxClasses;
package/Chip/Chip.js CHANGED
@@ -79,6 +79,7 @@ const ChipRoot = styled('div', {
79
79
  }) => {
80
80
  const deleteIconColor = alpha(theme.palette.text.primary, 0.26);
81
81
  return _extends({
82
+ maxWidth: '100%',
82
83
  fontFamily: theme.typography.fontFamily,
83
84
  fontSize: theme.typography.pxToRem(13),
84
85
  display: 'inline-flex',
@@ -1,80 +1,80 @@
1
- export interface ChipClasses {
2
- /** Styles applied to the root element. */
3
- root: string;
4
- /** Styles applied to the root element if `size="small"`. */
5
- sizeSmall: string;
6
- /** Styles applied to the root element if `size="medium"`. */
7
- sizeMedium: string;
8
- /** Styles applied to the root element if `color="primary"`. */
9
- colorPrimary: string;
10
- /** Styles applied to the root element if `color="secondary"`. */
11
- colorSecondary: string;
12
- /** State class applied to the root element if `disabled={true}`. */
13
- disabled: string;
14
- /** Styles applied to the root element if `onClick` is defined or `clickable={true}`. */
15
- clickable: string;
16
- /** Styles applied to the root element if `onClick` and `color="primary"` is defined or `clickable={true}`. */
17
- clickableColorPrimary: string;
18
- /** Styles applied to the root element if `onClick` and `color="secondary"` is defined or `clickable={true}`. */
19
- clickableColorSecondary: string;
20
- /** Styles applied to the root element if `onDelete` is defined. */
21
- deletable: string;
22
- /** Styles applied to the root element if `onDelete` and `color="primary"` is defined. */
23
- deletableColorPrimary: string;
24
- /** Styles applied to the root element if `onDelete` and `color="secondary"` is defined. */
25
- deletableColorSecondary: string;
26
- /** Styles applied to the root element if `variant="outlined"`. */
27
- outlined: string;
28
- /** Styles applied to the root element if `variant="filled"`. */
29
- filled: string;
30
- /** Styles applied to the root element if `variant="outlined"` and `color="primary"`. */
31
- outlinedPrimary: string;
32
- /** Styles applied to the root element if `variant="outlined"` and `color="secondary"`. */
33
- outlinedSecondary: string;
34
- /** Styles applied to the avatar element. */
35
- avatar: string;
36
- /** Styles applied to the avatar element if `size="small"`. */
37
- avatarSmall: string;
38
- /** Styles applied to the avatar element if `size="medium"`. */
39
- avatarMedium: string;
40
- /** Styles applied to the avatar element if `color="primary"`. */
41
- avatarColorPrimary: string;
42
- /** Styles applied to the avatar element if `color="secondary"`. */
43
- avatarColorSecondary: string;
44
- /** Styles applied to the icon element. */
45
- icon: string;
46
- /** Styles applied to the icon element if `size="small"`. */
47
- iconSmall: string;
48
- /** Styles applied to the icon element if `size="medium"`. */
49
- iconMedium: string;
50
- /** Styles applied to the icon element if `color="primary"`. */
51
- iconColorPrimary: string;
52
- /** Styles applied to the icon element if `color="secondary"`. */
53
- iconColorSecondary: string;
54
- /** Styles applied to the label `span` element. */
55
- label: string;
56
- /** Styles applied to the label `span` element if `size="small"`. */
57
- labelSmall: string;
58
- /** Styles applied to the label `span` element if `size="medium"`. */
59
- labelMedium: string;
60
- /** Styles applied to the deleteIcon element. */
61
- deleteIcon: string;
62
- /** Styles applied to the deleteIcon element if `size="small"`. */
63
- deleteIconSmall: string;
64
- /** Styles applied to the deleteIcon element if `size="medium"`. */
65
- deleteIconMedium: string;
66
- /** Styles applied to the deleteIcon element if `color="primary"` and `variant="filled"`. */
67
- deleteIconColorPrimary: string;
68
- /** Styles applied to the deleteIcon element if `color="secondary"` and `variant="filled"`. */
69
- deleteIconColorSecondary: string;
70
- /** Styles applied to the deleteIcon element if `color="primary"` and `variant="outlined"`. */
71
- deleteIconOutlinedColorPrimary: string;
72
- /** Styles applied to the deleteIcon element if `color="secondary"` and `variant="outlined"`. */
73
- deleteIconOutlinedColorSecondary: string;
74
- /** State class applied to the root element if keyboard focused. */
75
- focusVisible: string;
76
- }
77
- export declare type ChipClassKey = keyof ChipClasses;
78
- export declare function getChipUtilityClass(slot: string): string;
79
- declare const chipClasses: ChipClasses;
80
- export default chipClasses;
1
+ export interface ChipClasses {
2
+ /** Styles applied to the root element. */
3
+ root: string;
4
+ /** Styles applied to the root element if `size="small"`. */
5
+ sizeSmall: string;
6
+ /** Styles applied to the root element if `size="medium"`. */
7
+ sizeMedium: string;
8
+ /** Styles applied to the root element if `color="primary"`. */
9
+ colorPrimary: string;
10
+ /** Styles applied to the root element if `color="secondary"`. */
11
+ colorSecondary: string;
12
+ /** State class applied to the root element if `disabled={true}`. */
13
+ disabled: string;
14
+ /** Styles applied to the root element if `onClick` is defined or `clickable={true}`. */
15
+ clickable: string;
16
+ /** Styles applied to the root element if `onClick` and `color="primary"` is defined or `clickable={true}`. */
17
+ clickableColorPrimary: string;
18
+ /** Styles applied to the root element if `onClick` and `color="secondary"` is defined or `clickable={true}`. */
19
+ clickableColorSecondary: string;
20
+ /** Styles applied to the root element if `onDelete` is defined. */
21
+ deletable: string;
22
+ /** Styles applied to the root element if `onDelete` and `color="primary"` is defined. */
23
+ deletableColorPrimary: string;
24
+ /** Styles applied to the root element if `onDelete` and `color="secondary"` is defined. */
25
+ deletableColorSecondary: string;
26
+ /** Styles applied to the root element if `variant="outlined"`. */
27
+ outlined: string;
28
+ /** Styles applied to the root element if `variant="filled"`. */
29
+ filled: string;
30
+ /** Styles applied to the root element if `variant="outlined"` and `color="primary"`. */
31
+ outlinedPrimary: string;
32
+ /** Styles applied to the root element if `variant="outlined"` and `color="secondary"`. */
33
+ outlinedSecondary: string;
34
+ /** Styles applied to the avatar element. */
35
+ avatar: string;
36
+ /** Styles applied to the avatar element if `size="small"`. */
37
+ avatarSmall: string;
38
+ /** Styles applied to the avatar element if `size="medium"`. */
39
+ avatarMedium: string;
40
+ /** Styles applied to the avatar element if `color="primary"`. */
41
+ avatarColorPrimary: string;
42
+ /** Styles applied to the avatar element if `color="secondary"`. */
43
+ avatarColorSecondary: string;
44
+ /** Styles applied to the icon element. */
45
+ icon: string;
46
+ /** Styles applied to the icon element if `size="small"`. */
47
+ iconSmall: string;
48
+ /** Styles applied to the icon element if `size="medium"`. */
49
+ iconMedium: string;
50
+ /** Styles applied to the icon element if `color="primary"`. */
51
+ iconColorPrimary: string;
52
+ /** Styles applied to the icon element if `color="secondary"`. */
53
+ iconColorSecondary: string;
54
+ /** Styles applied to the label `span` element. */
55
+ label: string;
56
+ /** Styles applied to the label `span` element if `size="small"`. */
57
+ labelSmall: string;
58
+ /** Styles applied to the label `span` element if `size="medium"`. */
59
+ labelMedium: string;
60
+ /** Styles applied to the deleteIcon element. */
61
+ deleteIcon: string;
62
+ /** Styles applied to the deleteIcon element if `size="small"`. */
63
+ deleteIconSmall: string;
64
+ /** Styles applied to the deleteIcon element if `size="medium"`. */
65
+ deleteIconMedium: string;
66
+ /** Styles applied to the deleteIcon element if `color="primary"` and `variant="filled"`. */
67
+ deleteIconColorPrimary: string;
68
+ /** Styles applied to the deleteIcon element if `color="secondary"` and `variant="filled"`. */
69
+ deleteIconColorSecondary: string;
70
+ /** Styles applied to the deleteIcon element if `color="primary"` and `variant="outlined"`. */
71
+ deleteIconOutlinedColorPrimary: string;
72
+ /** Styles applied to the deleteIcon element if `color="secondary"` and `variant="outlined"`. */
73
+ deleteIconOutlinedColorSecondary: string;
74
+ /** State class applied to the root element if keyboard focused. */
75
+ focusVisible: string;
76
+ }
77
+ export declare type ChipClassKey = keyof ChipClasses;
78
+ export declare function getChipUtilityClass(slot: string): string;
79
+ declare const chipClasses: ChipClasses;
80
+ export default chipClasses;
@@ -1,26 +1,26 @@
1
- export interface CircularProgressClasses {
2
- /** Styles applied to the root element. */
3
- root: string;
4
- /** Styles applied to the root element if `variant="determinate"`. */
5
- determinate: string;
6
- /** Styles applied to the root element if `variant="indeterminate"`. */
7
- indeterminate: string;
8
- /** Styles applied to the root element if `color="primary"`. */
9
- colorPrimary: string;
10
- /** Styles applied to the root element if `color="secondary"`. */
11
- colorSecondary: string;
12
- /** Styles applied to the svg element. */
13
- svg: string;
14
- /** Styles applied to the `circle` svg path. */
15
- circle: string;
16
- /** Styles applied to the `circle` svg path if `variant="determinate"`. */
17
- circleDeterminate: string;
18
- /** Styles applied to the `circle` svg path if `variant="indeterminate"`. */
19
- circleIndeterminate: string;
20
- /** Styles applied to the `circle` svg path if `disableShrink={true}`. */
21
- circleDisableShrink: string;
22
- }
23
- export declare type CircularProgressClassKey = keyof CircularProgressClasses;
24
- export declare function getCircularProgressUtilityClass(slot: string): string;
25
- declare const circularProgressClasses: CircularProgressClasses;
26
- export default circularProgressClasses;
1
+ export interface CircularProgressClasses {
2
+ /** Styles applied to the root element. */
3
+ root: string;
4
+ /** Styles applied to the root element if `variant="determinate"`. */
5
+ determinate: string;
6
+ /** Styles applied to the root element if `variant="indeterminate"`. */
7
+ indeterminate: string;
8
+ /** Styles applied to the root element if `color="primary"`. */
9
+ colorPrimary: string;
10
+ /** Styles applied to the root element if `color="secondary"`. */
11
+ colorSecondary: string;
12
+ /** Styles applied to the svg element. */
13
+ svg: string;
14
+ /** Styles applied to the `circle` svg path. */
15
+ circle: string;
16
+ /** Styles applied to the `circle` svg path if `variant="determinate"`. */
17
+ circleDeterminate: string;
18
+ /** Styles applied to the `circle` svg path if `variant="indeterminate"`. */
19
+ circleIndeterminate: string;
20
+ /** Styles applied to the `circle` svg path if `disableShrink={true}`. */
21
+ circleDisableShrink: string;
22
+ }
23
+ export declare type CircularProgressClassKey = keyof CircularProgressClasses;
24
+ export declare function getCircularProgressUtilityClass(slot: string): string;
25
+ declare const circularProgressClasses: CircularProgressClasses;
26
+ export default circularProgressClasses;
@@ -1,2 +1,2 @@
1
- export { default } from '@mui/base/ClickAwayListener';
2
- export * from '@mui/base/ClickAwayListener';
1
+ export { default } from '@mui/base/ClickAwayListener';
2
+ export * from '@mui/base/ClickAwayListener';
@@ -1,18 +1,18 @@
1
- export interface CollapseClasses {
2
- /** Styles applied to the root element. */
3
- root: string;
4
- /** State class applied to the root element if `orientation="horizontal"`. */
5
- horizontal: string;
6
- /** Styles applied to the root element when the transition has entered. */
7
- entered: string;
8
- /** Styles applied to the root element when the transition has exited and `collapsedSize` = 0px. */
9
- hidden: string;
10
- /** Styles applied to the outer wrapper element. */
11
- wrapper: string;
12
- /** Styles applied to the inner wrapper element. */
13
- wrapperInner: string;
14
- }
15
- export declare type CollapseClassKey = keyof CollapseClasses;
16
- export declare function getCollapseUtilityClass(slot: string): string;
17
- declare const collapseClasses: CollapseClasses;
18
- export default collapseClasses;
1
+ export interface CollapseClasses {
2
+ /** Styles applied to the root element. */
3
+ root: string;
4
+ /** State class applied to the root element if `orientation="horizontal"`. */
5
+ horizontal: string;
6
+ /** Styles applied to the root element when the transition has entered. */
7
+ entered: string;
8
+ /** Styles applied to the root element when the transition has exited and `collapsedSize` = 0px. */
9
+ hidden: string;
10
+ /** Styles applied to the outer wrapper element. */
11
+ wrapper: string;
12
+ /** Styles applied to the inner wrapper element. */
13
+ wrapperInner: string;
14
+ }
15
+ export declare type CollapseClassKey = keyof CollapseClasses;
16
+ export declare function getCollapseUtilityClass(slot: string): string;
17
+ declare const collapseClasses: CollapseClasses;
18
+ export default collapseClasses;
@@ -1,22 +1,22 @@
1
- export interface ContainerClasses {
2
- /** Styles applied to the root element. */
3
- root: string;
4
- /** Styles applied to the root element if `disableGutters={true}`. */
5
- disableGutters: string;
6
- /** Styles applied to the root element if `fixed={true}`. */
7
- fixed: string;
8
- /** Styles applied to the root element if `maxWidth="xs"`. */
9
- maxWidthXs: string;
10
- /** Styles applied to the root element if `maxWidth="sm"`. */
11
- maxWidthSm: string;
12
- /** Styles applied to the root element if `maxWidth="md"`. */
13
- maxWidthMd: string;
14
- /** Styles applied to the root element if `maxWidth="lg"`. */
15
- maxWidthLg: string;
16
- /** Styles applied to the root element if `maxWidth="xl"`. */
17
- maxWidthXl: string;
18
- }
19
- export declare type ContainerClassKey = keyof ContainerClasses;
20
- export declare function getContainerUtilityClass(slot: string): string;
21
- declare const containerClasses: ContainerClasses;
22
- export default containerClasses;
1
+ export interface ContainerClasses {
2
+ /** Styles applied to the root element. */
3
+ root: string;
4
+ /** Styles applied to the root element if `disableGutters={true}`. */
5
+ disableGutters: string;
6
+ /** Styles applied to the root element if `fixed={true}`. */
7
+ fixed: string;
8
+ /** Styles applied to the root element if `maxWidth="xs"`. */
9
+ maxWidthXs: string;
10
+ /** Styles applied to the root element if `maxWidth="sm"`. */
11
+ maxWidthSm: string;
12
+ /** Styles applied to the root element if `maxWidth="md"`. */
13
+ maxWidthMd: string;
14
+ /** Styles applied to the root element if `maxWidth="lg"`. */
15
+ maxWidthLg: string;
16
+ /** Styles applied to the root element if `maxWidth="xl"`. */
17
+ maxWidthXl: string;
18
+ }
19
+ export declare type ContainerClassKey = keyof ContainerClasses;
20
+ export declare function getContainerUtilityClass(slot: string): string;
21
+ declare const containerClasses: ContainerClasses;
22
+ export default containerClasses;
@@ -92,7 +92,10 @@ export interface DialogProps extends StandardProps<ModalProps, 'children'> {
92
92
  /**
93
93
  * The duration for the transition, in milliseconds.
94
94
  * You may specify a single timeout for all transitions, or individually with an object.
95
- * @default { enter: duration.enteringScreen, exit: duration.leavingScreen }
95
+ * @default {
96
+ * enter: theme.transitions.duration.enteringScreen,
97
+ * exit: theme.transitions.duration.leavingScreen,
98
+ * }
96
99
  */
97
100
  transitionDuration?: TransitionProps['timeout'];
98
101
  /**
package/Dialog/Dialog.js CHANGED
@@ -9,13 +9,13 @@ import { unstable_useId as useId } from '@mui/utils';
9
9
  import capitalize from '../utils/capitalize';
10
10
  import Modal from '../Modal';
11
11
  import Fade from '../Fade';
12
- import { duration } from '../styles/createTransitions';
13
12
  import Paper from '../Paper';
14
13
  import useThemeProps from '../styles/useThemeProps';
15
14
  import styled from '../styles/styled';
16
15
  import dialogClasses, { getDialogUtilityClass } from './dialogClasses';
17
16
  import DialogContext from './DialogContext';
18
17
  import Backdrop from '../Backdrop';
18
+ import useTheme from '../styles/useTheme';
19
19
  import { jsx as _jsx } from "react/jsx-runtime";
20
20
  const DialogBackdrop = styled(Backdrop, {
21
21
  name: 'MuiDialog',
@@ -146,10 +146,6 @@ const DialogPaper = styled(Paper, {
146
146
  maxWidth: '100%'
147
147
  }
148
148
  }));
149
- const defaultTransitionDuration = {
150
- enter: duration.enteringScreen,
151
- exit: duration.leavingScreen
152
- };
153
149
  /**
154
150
  * Dialogs are overlaid modal paper based components with a backdrop.
155
151
  */
@@ -159,6 +155,11 @@ const Dialog = /*#__PURE__*/React.forwardRef(function Dialog(inProps, ref) {
159
155
  props: inProps,
160
156
  name: 'MuiDialog'
161
157
  });
158
+ const theme = useTheme();
159
+ const defaultTransitionDuration = {
160
+ enter: theme.transitions.duration.enteringScreen,
161
+ exit: theme.transitions.duration.leavingScreen
162
+ };
162
163
 
163
164
  const {
164
165
  'aria-describedby': ariaDescribedby,
@@ -399,7 +400,10 @@ process.env.NODE_ENV !== "production" ? Dialog.propTypes
399
400
  /**
400
401
  * The duration for the transition, in milliseconds.
401
402
  * You may specify a single timeout for all transitions, or individually with an object.
402
- * @default { enter: duration.enteringScreen, exit: duration.leavingScreen }
403
+ * @default {
404
+ * enter: theme.transitions.duration.enteringScreen,
405
+ * exit: theme.transitions.duration.leavingScreen,
406
+ * }
403
407
  */
404
408
  transitionDuration: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
405
409
  appear: PropTypes.number,
@@ -1,6 +1,6 @@
1
- /// <reference types="react" />
2
- interface DialogContextValue {
3
- titleId?: string;
4
- }
5
- declare const DialogContext: import("react").Context<DialogContextValue>;
6
- export default DialogContext;
1
+ /// <reference types="react" />
2
+ interface DialogContextValue {
3
+ titleId?: string;
4
+ }
5
+ declare const DialogContext: import("react").Context<DialogContextValue>;
6
+ export default DialogContext;
@@ -1,36 +1,36 @@
1
- export interface DialogClasses {
2
- /** Styles applied to the root element. */
3
- root: string;
4
- /** Styles applied to the container element if `scroll="paper"`. */
5
- scrollPaper: string;
6
- /** Styles applied to the container element if `scroll="body"`. */
7
- scrollBody: string;
8
- /** Styles applied to the container element. */
9
- container: string;
10
- /** Styles applied to the Paper component. */
11
- paper: string;
12
- /** Styles applied to the Paper component if `scroll="paper"`. */
13
- paperScrollPaper: string;
14
- /** Styles applied to the Paper component if `scroll="body"`. */
15
- paperScrollBody: string;
16
- /** Styles applied to the Paper component if `maxWidth=false`. */
17
- paperWidthFalse: string;
18
- /** Styles applied to the Paper component if `maxWidth="xs"`. */
19
- paperWidthXs: string;
20
- /** Styles applied to the Paper component if `maxWidth="sm"`. */
21
- paperWidthSm: string;
22
- /** Styles applied to the Paper component if `maxWidth="md"`. */
23
- paperWidthMd: string;
24
- /** Styles applied to the Paper component if `maxWidth="lg"`. */
25
- paperWidthLg: string;
26
- /** Styles applied to the Paper component if `maxWidth="xl"`. */
27
- paperWidthXl: string;
28
- /** Styles applied to the Paper component if `fullWidth={true}`. */
29
- paperFullWidth: string;
30
- /** Styles applied to the Paper component if `fullScreen={true}`. */
31
- paperFullScreen: string;
32
- }
33
- export declare type DialogClassKey = keyof DialogClasses;
34
- export declare function getDialogUtilityClass(slot: string): string;
35
- declare const dialogClasses: DialogClasses;
36
- export default dialogClasses;
1
+ export interface DialogClasses {
2
+ /** Styles applied to the root element. */
3
+ root: string;
4
+ /** Styles applied to the container element if `scroll="paper"`. */
5
+ scrollPaper: string;
6
+ /** Styles applied to the container element if `scroll="body"`. */
7
+ scrollBody: string;
8
+ /** Styles applied to the container element. */
9
+ container: string;
10
+ /** Styles applied to the Paper component. */
11
+ paper: string;
12
+ /** Styles applied to the Paper component if `scroll="paper"`. */
13
+ paperScrollPaper: string;
14
+ /** Styles applied to the Paper component if `scroll="body"`. */
15
+ paperScrollBody: string;
16
+ /** Styles applied to the Paper component if `maxWidth=false`. */
17
+ paperWidthFalse: string;
18
+ /** Styles applied to the Paper component if `maxWidth="xs"`. */
19
+ paperWidthXs: string;
20
+ /** Styles applied to the Paper component if `maxWidth="sm"`. */
21
+ paperWidthSm: string;
22
+ /** Styles applied to the Paper component if `maxWidth="md"`. */
23
+ paperWidthMd: string;
24
+ /** Styles applied to the Paper component if `maxWidth="lg"`. */
25
+ paperWidthLg: string;
26
+ /** Styles applied to the Paper component if `maxWidth="xl"`. */
27
+ paperWidthXl: string;
28
+ /** Styles applied to the Paper component if `fullWidth={true}`. */
29
+ paperFullWidth: string;
30
+ /** Styles applied to the Paper component if `fullScreen={true}`. */
31
+ paperFullScreen: string;
32
+ }
33
+ export declare type DialogClassKey = keyof DialogClasses;
34
+ export declare function getDialogUtilityClass(slot: string): string;
35
+ declare const dialogClasses: DialogClasses;
36
+ export default dialogClasses;
@@ -1,10 +1,10 @@
1
- export interface DialogActionsClasses {
2
- /** Styles applied to the root element. */
3
- root: string;
4
- /** Styles applied to the root element unless `disableSpacing={true}`. */
5
- spacing: string;
6
- }
7
- export declare type DialogActionsClassKey = keyof DialogActionsClasses;
8
- export declare function getDialogActionsUtilityClass(slot: string): string;
9
- declare const dialogActionsClasses: DialogActionsClasses;
10
- export default dialogActionsClasses;
1
+ export interface DialogActionsClasses {
2
+ /** Styles applied to the root element. */
3
+ root: string;
4
+ /** Styles applied to the root element unless `disableSpacing={true}`. */
5
+ spacing: string;
6
+ }
7
+ export declare type DialogActionsClassKey = keyof DialogActionsClasses;
8
+ export declare function getDialogActionsUtilityClass(slot: string): string;
9
+ declare const dialogActionsClasses: DialogActionsClasses;
10
+ export default dialogActionsClasses;
@@ -1,10 +1,10 @@
1
- export interface DialogContentClasses {
2
- /** Styles applied to the root element. */
3
- root: string;
4
- /** Styles applied to the root element if `dividers={true}`. */
5
- dividers: string;
6
- }
7
- export declare type DialogContentClassKey = keyof DialogContentClasses;
8
- export declare function getDialogContentUtilityClass(slot: string): string;
9
- declare const dialogContentClasses: DialogContentClasses;
10
- export default dialogContentClasses;
1
+ export interface DialogContentClasses {
2
+ /** Styles applied to the root element. */
3
+ root: string;
4
+ /** Styles applied to the root element if `dividers={true}`. */
5
+ dividers: string;
6
+ }
7
+ export declare type DialogContentClassKey = keyof DialogContentClasses;
8
+ export declare function getDialogContentUtilityClass(slot: string): string;
9
+ declare const dialogContentClasses: DialogContentClasses;
10
+ export default dialogContentClasses;