@mui/material 6.0.0-alpha.8 → 6.0.0-dev.20240529-082515-213b5e33ab

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 (124) hide show
  1. package/AccordionActions/AccordionActions.d.ts +1 -1
  2. package/AccordionDetails/AccordionDetails.d.ts +1 -1
  3. package/Alert/Alert.d.ts +1 -1
  4. package/AlertTitle/AlertTitle.d.ts +3 -3
  5. package/Autocomplete/Autocomplete.d.ts +1 -1
  6. package/Avatar/Avatar.js +3 -1
  7. package/AvatarGroup/AvatarGroup.d.ts +51 -18
  8. package/AvatarGroup/AvatarGroup.js +37 -18
  9. package/Button/Button.d.ts +1 -1
  10. package/ButtonBase/ButtonBase.d.ts +1 -1
  11. package/CardActions/CardActions.d.ts +1 -1
  12. package/CardHeader/CardHeader.d.ts +1 -1
  13. package/Checkbox/Checkbox.d.ts +1 -1
  14. package/Chip/Chip.d.ts +3 -3
  15. package/CircularProgress/CircularProgress.d.ts +1 -1
  16. package/Collapse/Collapse.d.ts +1 -1
  17. package/CssBaseline/CssBaseline.d.ts +1 -1
  18. package/Dialog/Dialog.d.ts +1 -1
  19. package/DialogActions/DialogActions.d.ts +1 -1
  20. package/DialogContent/DialogContent.d.ts +1 -1
  21. package/Drawer/Drawer.d.ts +1 -1
  22. package/Fade/Fade.d.ts +1 -1
  23. package/FilledInput/FilledInput.d.ts +1 -1
  24. package/FormControlLabel/FormControlLabel.d.ts +1 -1
  25. package/FormGroup/FormGroup.d.ts +1 -1
  26. package/GlobalStyles/GlobalStyles.d.ts +1 -1
  27. package/Grid/Grid.d.ts +1 -0
  28. package/Grid/Grid.js +1 -0
  29. package/Grow/Grow.d.ts +1 -1
  30. package/Hidden/Hidden.d.ts +2 -0
  31. package/Hidden/Hidden.js +2 -0
  32. package/ImageListItemBar/ImageListItemBar.d.ts +1 -1
  33. package/Input/Input.d.ts +1 -1
  34. package/InputBase/InputBase.d.ts +1 -1
  35. package/LinearProgress/LinearProgress.d.ts +1 -1
  36. package/ListItem/ListItem.d.ts +4 -12
  37. package/ListItem/ListItem.js +6 -14
  38. package/ListItemAvatar/ListItemAvatar.d.ts +1 -1
  39. package/ListItemIcon/ListItemIcon.d.ts +1 -1
  40. package/ListItemSecondaryAction/ListItemSecondaryAction.d.ts +5 -1
  41. package/ListItemSecondaryAction/ListItemSecondaryAction.js +2 -0
  42. package/ListItemText/ListItemText.d.ts +3 -1
  43. package/Menu/Menu.d.ts +1 -1
  44. package/MobileStepper/MobileStepper.d.ts +1 -1
  45. package/Modal/Modal.d.ts +1 -1
  46. package/NativeSelect/NativeSelect.d.ts +1 -1
  47. package/OutlinedInput/OutlinedInput.d.ts +3 -1
  48. package/OverridableComponent.d.ts +2 -2
  49. package/Pagination/Pagination.d.ts +1 -1
  50. package/Popover/Popover.d.ts +1 -1
  51. package/Popper/Popper.d.ts +4 -0
  52. package/Popper/Popper.js +4 -0
  53. package/Radio/Radio.d.ts +1 -1
  54. package/RadioGroup/RadioGroup.d.ts +1 -1
  55. package/Rating/Rating.d.ts +1 -1
  56. package/Select/Select.d.ts +1 -1
  57. package/Slide/Slide.d.ts +1 -1
  58. package/Slider/Slider.d.ts +1 -1
  59. package/Slider/Slider.js +1 -1
  60. package/Slider/SliderValueLabel.types.d.ts +1 -1
  61. package/Snackbar/Snackbar.d.ts +1 -1
  62. package/SnackbarContent/SnackbarContent.d.ts +1 -1
  63. package/SpeedDial/SpeedDial.d.ts +1 -1
  64. package/SpeedDialAction/SpeedDialAction.d.ts +1 -1
  65. package/SpeedDialIcon/SpeedDialIcon.d.ts +3 -1
  66. package/StepConnector/StepConnector.d.ts +2 -2
  67. package/StepContent/StepContent.d.ts +1 -1
  68. package/StepIcon/StepIcon.d.ts +1 -1
  69. package/StepLabel/StepLabel.d.ts +1 -1
  70. package/Switch/Switch.d.ts +1 -1
  71. package/Tab/Tab.d.ts +1 -1
  72. package/TabScrollButton/TabScrollButton.d.ts +1 -1
  73. package/TableCell/TableCell.d.ts +1 -1
  74. package/TextField/TextField.d.ts +1 -1
  75. package/ToggleButtonGroup/ToggleButtonGroup.d.ts +1 -1
  76. package/Tooltip/Tooltip.d.ts +3 -5
  77. package/Tooltip/Tooltip.js +2 -4
  78. package/Zoom/Zoom.d.ts +1 -1
  79. package/index.js +1 -1
  80. package/locale/index.d.ts +1 -0
  81. package/locale/index.js +74 -1
  82. package/modern/Avatar/Avatar.js +3 -1
  83. package/modern/AvatarGroup/AvatarGroup.js +37 -18
  84. package/modern/Grid/Grid.js +1 -0
  85. package/modern/Hidden/Hidden.js +2 -0
  86. package/modern/ListItem/ListItem.js +6 -14
  87. package/modern/ListItemSecondaryAction/ListItemSecondaryAction.js +2 -0
  88. package/modern/Popper/Popper.js +4 -0
  89. package/modern/Slider/Slider.js +1 -1
  90. package/modern/Tooltip/Tooltip.js +2 -4
  91. package/modern/index.js +1 -1
  92. package/modern/locale/index.js +74 -1
  93. package/modern/styles/CssVarsProvider.js +17 -6
  94. package/modern/styles/experimental_extendTheme.js +8 -354
  95. package/modern/styles/extendTheme.js +355 -0
  96. package/modern/styles/index.js +2 -1
  97. package/modern/styles/responsiveFontSizes.js +3 -0
  98. package/node/Avatar/Avatar.js +3 -1
  99. package/node/AvatarGroup/AvatarGroup.js +37 -18
  100. package/node/Grid/Grid.js +1 -0
  101. package/node/Hidden/Hidden.js +2 -0
  102. package/node/ListItem/ListItem.js +6 -14
  103. package/node/ListItemSecondaryAction/ListItemSecondaryAction.js +2 -0
  104. package/node/Popper/Popper.js +4 -0
  105. package/node/Slider/Slider.js +1 -1
  106. package/node/Tooltip/Tooltip.js +2 -4
  107. package/node/index.js +1 -1
  108. package/node/locale/index.js +75 -2
  109. package/node/styles/CssVarsProvider.js +22 -7
  110. package/node/styles/experimental_extendTheme.js +9 -360
  111. package/node/styles/extendTheme.js +367 -0
  112. package/node/styles/index.js +10 -0
  113. package/node/styles/responsiveFontSizes.js +3 -0
  114. package/package.json +6 -6
  115. package/styles/CssVarsProvider.d.ts +3 -2
  116. package/styles/CssVarsProvider.js +17 -6
  117. package/styles/experimental_extendTheme.js +8 -354
  118. package/styles/{experimental_extendTheme.d.ts → extendTheme.d.ts} +1 -2
  119. package/styles/extendTheme.js +355 -0
  120. package/styles/index.d.ts +2 -2
  121. package/styles/index.js +2 -1
  122. package/styles/responsiveFontSizes.js +3 -0
  123. package/themeCssVarsAugmentation/index.d.ts +1 -1
  124. package/types/OverridableComponentAugmentation.d.ts +2 -2
@@ -33,4 +33,4 @@ export interface AccordionActionsProps extends StandardProps<React.HTMLAttribute
33
33
  *
34
34
  * - [AccordionActions API](https://mui.com/material-ui/api/accordion-actions/)
35
35
  */
36
- export default function AccordionActions(props: AccordionActionsProps): JSX.Element;
36
+ export default function AccordionActions(props: AccordionActionsProps): React.JSX.Element;
@@ -28,4 +28,4 @@ export interface AccordionDetailsProps extends StandardProps<React.HTMLAttribute
28
28
  *
29
29
  * - [AccordionDetails API](https://mui.com/material-ui/api/accordion-details/)
30
30
  */
31
- export default function AccordionDetails(props: AccordionDetailsProps): JSX.Element;
31
+ export default function AccordionDetails(props: AccordionDetailsProps): React.JSX.Element;
package/Alert/Alert.d.ts CHANGED
@@ -133,4 +133,4 @@ export interface AlertOwnerState extends AlertProps {}
133
133
  * - [Alert API](https://mui.com/material-ui/api/alert/)
134
134
  * - inherits [Paper API](https://mui.com/material-ui/api/paper/)
135
135
  */
136
- export default function Alert(props: AlertProps): JSX.Element;
136
+ export default function Alert(props: AlertProps): React.JSX.Element;
@@ -1,9 +1,9 @@
1
1
  import * as React from 'react';
2
2
  import { SxProps } from '@mui/system';
3
- import { InternalStandardProps as StandardProps, Theme } from '..';
3
+ import { Theme, TypographyProps } from '..';
4
4
  import { AlertTitleClasses } from './alertTitleClasses';
5
5
 
6
- export interface AlertTitleProps extends StandardProps<React.HTMLAttributes<HTMLDivElement>> {
6
+ export interface AlertTitleProps extends TypographyProps<'div'> {
7
7
  /**
8
8
  * The content of the component.
9
9
  */
@@ -29,4 +29,4 @@ export interface AlertTitleProps extends StandardProps<React.HTMLAttributes<HTML
29
29
  * - [AlertTitle API](https://mui.com/material-ui/api/alert-title/)
30
30
  * - inherits [Typography API](https://mui.com/material-ui/api/typography/)
31
31
  */
32
- export default function AlertTitle(props: AlertTitleProps): JSX.Element;
32
+ export default function AlertTitle(props: AlertTitleProps): React.JSX.Element;
@@ -372,4 +372,4 @@ export default function Autocomplete<
372
372
  ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent'],
373
373
  >(
374
374
  props: AutocompleteProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>,
375
- ): JSX.Element;
375
+ ): React.JSX.Element;
package/Avatar/Avatar.js CHANGED
@@ -175,6 +175,8 @@ const Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
175
175
  component,
176
176
  variant
177
177
  };
178
+ // This issue explains why this is required: https://github.com/mui/material-ui/issues/42184
179
+ delete ownerState.ownerState;
178
180
  const classes = useUtilityClasses(ownerState);
179
181
  const [ImgSlot, imgSlotProps] = useSlot('img', {
180
182
  className: classes.img,
@@ -214,10 +216,10 @@ const Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
214
216
  }
215
217
  return /*#__PURE__*/_jsx(AvatarRoot, {
216
218
  as: component,
217
- ownerState: ownerState,
218
219
  className: clsx(classes.root, className),
219
220
  ref: ref,
220
221
  ...other,
222
+ ownerState: ownerState,
221
223
  children: children
222
224
  });
223
225
  });
@@ -1,14 +1,40 @@
1
1
  import * as React from 'react';
2
- import { OverridableStringUnion } from '@mui/types';
2
+ import {
3
+ OverridableComponent,
4
+ OverridableStringUnion,
5
+ OverrideProps,
6
+ PartiallyRequired,
7
+ } from '@mui/types';
3
8
  import { SxProps } from '@mui/system';
4
- import { InternalStandardProps as StandardProps, Theme } from '@mui/material';
9
+ import { Theme } from '@mui/material';
5
10
  import { AvatarGroupClasses } from './avatarGroupClasses';
6
11
  import Avatar from '../Avatar';
12
+ import { CreateSlotsAndSlotProps, SlotProps } from '../utils/types';
7
13
 
8
14
  export interface AvatarGroupPropsVariantOverrides {}
9
15
 
10
16
  export interface AvatarGroupComponentsPropsOverrides {}
11
- export interface AvatarGroupProps extends StandardProps<React.HTMLAttributes<HTMLDivElement>> {
17
+
18
+ export interface AvatarGroupSlots {
19
+ surplus?: React.ElementType;
20
+ }
21
+
22
+ export type AvatarGroupSlotsAndSlotProps = CreateSlotsAndSlotProps<
23
+ AvatarGroupSlots,
24
+ {
25
+ /**
26
+ * @deprecated use `slotProps.surplus` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
27
+ * */
28
+ additionalAvatar: React.ComponentPropsWithRef<typeof Avatar> &
29
+ AvatarGroupComponentsPropsOverrides;
30
+ surplus: SlotProps<
31
+ React.ElementType<React.ComponentPropsWithRef<typeof Avatar>>,
32
+ AvatarGroupComponentsPropsOverrides,
33
+ AvatarGroupOwnerState
34
+ >;
35
+ }
36
+ >;
37
+ export interface AvatarGroupOwnProps extends AvatarGroupSlotsAndSlotProps {
12
38
  /**
13
39
  * The avatars to stack.
14
40
  */
@@ -27,9 +53,8 @@ export interface AvatarGroupProps extends StandardProps<React.HTMLAttributes<HTM
27
53
  * You can override the existing props or add new ones.
28
54
  *
29
55
  * This prop is an alias for the `slotProps` prop.
30
- * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
31
56
  *
32
- * @default {}
57
+ * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
33
58
  */
34
59
  componentsProps?: {
35
60
  additionalAvatar?: React.ComponentPropsWithRef<typeof Avatar> &
@@ -46,18 +71,6 @@ export interface AvatarGroupProps extends StandardProps<React.HTMLAttributes<HTM
46
71
  * @returns {React.ReactNode} custom element to display
47
72
  */
48
73
  renderSurplus?: (surplus: number) => React.ReactNode;
49
- /**
50
- * The extra props for the slot components.
51
- * You can override the existing props or add new ones.
52
- *
53
- * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
54
- *
55
- * @default {}
56
- */
57
- slotProps?: {
58
- additionalAvatar?: React.ComponentPropsWithRef<typeof Avatar> &
59
- AvatarGroupComponentsPropsOverrides;
60
- };
61
74
  /**
62
75
  * Spacing between avatars.
63
76
  * @default 'medium'
@@ -82,6 +95,14 @@ export interface AvatarGroupProps extends StandardProps<React.HTMLAttributes<HTM
82
95
  >;
83
96
  }
84
97
 
98
+ export interface AvatarGroupTypeMap<
99
+ AdditionalProps = {},
100
+ RootComponent extends React.ElementType = 'div',
101
+ > {
102
+ props: AdditionalProps & AvatarGroupOwnProps;
103
+ defaultComponent: RootComponent;
104
+ }
105
+
85
106
  /**
86
107
  *
87
108
  * Demos:
@@ -92,4 +113,16 @@ export interface AvatarGroupProps extends StandardProps<React.HTMLAttributes<HTM
92
113
  *
93
114
  * - [AvatarGroup API](https://mui.com/material-ui/api/avatar-group/)
94
115
  */
95
- export default function AvatarGroup(props: AvatarGroupProps): JSX.Element;
116
+ declare const AvatarGroup: OverridableComponent<AvatarGroupTypeMap>;
117
+
118
+ export type AvatarGroupProps<
119
+ RootComponent extends React.ElementType = AvatarGroupTypeMap['defaultComponent'],
120
+ AdditionalProps = {},
121
+ > = OverrideProps<AvatarGroupTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
122
+ component?: React.ElementType;
123
+ };
124
+
125
+ export interface AvatarGroupOwnerState
126
+ extends PartiallyRequired<AvatarGroupProps, 'max' | 'spacing' | 'component' | 'variant'> {}
127
+
128
+ export default AvatarGroup;
@@ -9,6 +9,7 @@ import composeClasses from '@mui/utils/composeClasses';
9
9
  import { styled, createUseThemeProps } from '../zero-styled';
10
10
  import Avatar, { avatarClasses } from '../Avatar';
11
11
  import avatarGroupClasses, { getAvatarGroupUtilityClass } from './avatarGroupClasses';
12
+ import useSlot from '../utils/useSlot';
12
13
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
14
  const SPACINGS = {
14
15
  small: -16,
@@ -55,10 +56,11 @@ const AvatarGroup = /*#__PURE__*/React.forwardRef(function AvatarGroup(inProps,
55
56
  children: childrenProp,
56
57
  className,
57
58
  component = 'div',
58
- componentsProps = {},
59
+ componentsProps,
59
60
  max = 5,
60
61
  renderSurplus,
61
62
  slotProps = {},
63
+ slots = {},
62
64
  spacing = 'medium',
63
65
  total,
64
66
  variant = 'circular',
@@ -89,22 +91,36 @@ const AvatarGroup = /*#__PURE__*/React.forwardRef(function AvatarGroup(inProps,
89
91
  const maxAvatars = Math.min(children.length, clampedMax - 1);
90
92
  const extraAvatars = Math.max(totalAvatars - clampedMax, totalAvatars - maxAvatars, 0);
91
93
  const extraAvatarsElement = renderSurplus ? renderSurplus(extraAvatars) : `+${extraAvatars}`;
92
- const additionalAvatarSlotProps = slotProps.additionalAvatar ?? componentsProps.additionalAvatar;
93
94
  const marginValue = ownerState.spacing && SPACINGS[ownerState.spacing] !== undefined ? SPACINGS[ownerState.spacing] : -ownerState.spacing || -8;
95
+ const externalForwardedProps = {
96
+ slots,
97
+ slotProps: {
98
+ surplus: slotProps.additionalAvatar ?? componentsProps?.additionalAvatar,
99
+ ...componentsProps,
100
+ ...slotProps
101
+ }
102
+ };
103
+ const [SurplusSlot, surplusProps] = useSlot('surplus', {
104
+ elementType: Avatar,
105
+ externalForwardedProps,
106
+ className: classes.avatar,
107
+ ownerState,
108
+ additionalProps: {
109
+ variant,
110
+ style: {
111
+ '--AvatarRoot-spacing': marginValue ? `${marginValue}px` : undefined,
112
+ ...other.style
113
+ }
114
+ }
115
+ });
94
116
  return /*#__PURE__*/_jsxs(AvatarGroupRoot, {
95
117
  as: component,
96
118
  ownerState: ownerState,
97
119
  className: clsx(classes.root, className),
98
120
  ref: ref,
99
121
  ...other,
100
- children: [extraAvatars ? /*#__PURE__*/_jsx(Avatar, {
101
- variant: variant,
102
- ...additionalAvatarSlotProps,
103
- className: clsx(classes.avatar, additionalAvatarSlotProps?.className),
104
- style: {
105
- '--AvatarRoot-spacing': marginValue ? `${marginValue}px` : undefined,
106
- ...other.style
107
- },
122
+ children: [extraAvatars ? /*#__PURE__*/_jsx(SurplusSlot, {
123
+ ...surplusProps,
108
124
  children: extraAvatarsElement
109
125
  }) : null, children.slice(0, maxAvatars).reverse().map(child => {
110
126
  return /*#__PURE__*/React.cloneElement(child, {
@@ -141,9 +157,8 @@ process.env.NODE_ENV !== "production" ? AvatarGroup.propTypes /* remove-proptype
141
157
  * You can override the existing props or add new ones.
142
158
  *
143
159
  * This prop is an alias for the `slotProps` prop.
144
- * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
145
160
  *
146
- * @default {}
161
+ * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
147
162
  */
148
163
  componentsProps: PropTypes.shape({
149
164
  additionalAvatar: PropTypes.object
@@ -165,15 +180,19 @@ process.env.NODE_ENV !== "production" ? AvatarGroup.propTypes /* remove-proptype
165
180
  */
166
181
  renderSurplus: PropTypes.func,
167
182
  /**
168
- * The extra props for the slot components.
169
- * You can override the existing props or add new ones.
170
- *
171
- * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
172
- *
183
+ * The props used for each slot inside.
173
184
  * @default {}
174
185
  */
175
186
  slotProps: PropTypes.shape({
176
- additionalAvatar: PropTypes.object
187
+ additionalAvatar: PropTypes.object,
188
+ surplus: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
189
+ }),
190
+ /**
191
+ * The components used for each slot inside.
192
+ * @default {}
193
+ */
194
+ slots: PropTypes.shape({
195
+ surplus: PropTypes.elementType
177
196
  }),
178
197
  /**
179
198
  * Spacing between avatars.
@@ -104,7 +104,7 @@ export interface ExtendButtonTypeMap<TypeMap extends OverridableTypeMap> {
104
104
 
105
105
  export type ExtendButton<TypeMap extends OverridableTypeMap> = ((
106
106
  props: { href: string } & OverrideProps<ExtendButtonBaseTypeMap<TypeMap>, 'a'>,
107
- ) => JSX.Element) &
107
+ ) => React.JSX.Element) &
108
108
  OverridableComponent<ExtendButtonBaseTypeMap<TypeMap>>;
109
109
 
110
110
  /**
@@ -105,7 +105,7 @@ export interface ExtendButtonBaseTypeMap<TypeMap extends OverridableTypeMap> {
105
105
 
106
106
  export type ExtendButtonBase<TypeMap extends OverridableTypeMap> = ((
107
107
  props: { href: string } & OverrideProps<ExtendButtonBaseTypeMap<TypeMap>, 'a'>,
108
- ) => JSX.Element) &
108
+ ) => React.JSX.Element) &
109
109
  OverridableComponent<ExtendButtonBaseTypeMap<TypeMap>>;
110
110
 
111
111
  /**
@@ -33,4 +33,4 @@ export interface CardActionsProps extends StandardProps<React.HTMLAttributes<HTM
33
33
  *
34
34
  * - [CardActions API](https://mui.com/material-ui/api/card-actions/)
35
35
  */
36
- export default function CardActions(props: CardActionsProps): JSX.Element;
36
+ export default function CardActions(props: CardActionsProps): React.JSX.Element;
@@ -98,7 +98,7 @@ export interface OverridableCardHeader extends OverridableComponent<CardHeaderTy
98
98
  TitleTypographyComponent,
99
99
  SubheaderTypographyComponent
100
100
  >,
101
- ): JSX.Element;
101
+ ): React.JSX.Element;
102
102
  }
103
103
 
104
104
  export type CardHeaderProps<
@@ -115,4 +115,4 @@ export interface CheckboxProps
115
115
  * - [Checkbox API](https://mui.com/material-ui/api/checkbox/)
116
116
  * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/)
117
117
  */
118
- export default function Checkbox(props: CheckboxProps): JSX.Element;
118
+ export default function Checkbox(props: CheckboxProps): React.JSX.Element;
package/Chip/Chip.d.ts CHANGED
@@ -15,7 +15,7 @@ export interface ChipOwnProps {
15
15
  /**
16
16
  * The Avatar element to display.
17
17
  */
18
- avatar?: React.ReactElement;
18
+ avatar?: React.ReactElement<any>;
19
19
  /**
20
20
  * This prop isn't supported.
21
21
  * Use the `component` prop if you need to change the children structure.
@@ -47,7 +47,7 @@ export interface ChipOwnProps {
47
47
  /**
48
48
  * Override the default delete icon element. Shown only if `onDelete` is set.
49
49
  */
50
- deleteIcon?: React.ReactElement;
50
+ deleteIcon?: React.ReactElement<any>;
51
51
  /**
52
52
  * If `true`, the component is disabled.
53
53
  * @default false
@@ -56,7 +56,7 @@ export interface ChipOwnProps {
56
56
  /**
57
57
  * Icon element.
58
58
  */
59
- icon?: React.ReactElement;
59
+ icon?: React.ReactElement<any>;
60
60
  /**
61
61
  * The content of the component.
62
62
  */
@@ -73,4 +73,4 @@ export interface CircularProgressProps
73
73
  *
74
74
  * - [CircularProgress API](https://mui.com/material-ui/api/circular-progress/)
75
75
  */
76
- export default function CircularProgress(props: CircularProgressProps): JSX.Element;
76
+ export default function CircularProgress(props: CircularProgressProps): React.JSX.Element;
@@ -69,4 +69,4 @@ export interface CollapseProps extends StandardProps<TransitionProps, 'timeout'>
69
69
  * - inherits [Transition API](https://reactcommunity.org/react-transition-group/transition/#Transition-props)
70
70
  */
71
71
 
72
- export default function Collapse(props: CollapseProps): JSX.Element;
72
+ export default function Collapse(props: CollapseProps): React.JSX.Element;
@@ -26,4 +26,4 @@ export interface CssBaselineProps extends StyledComponentProps<never> {
26
26
  *
27
27
  * - [CssBaseline API](https://mui.com/material-ui/api/css-baseline/)
28
28
  */
29
- export default function CssBaseline(props: CssBaselineProps): JSX.Element;
29
+ export default function CssBaseline(props: CssBaselineProps): React.JSX.Element;
@@ -118,4 +118,4 @@ export interface DialogProps extends StandardProps<ModalProps, 'children'> {
118
118
  * - [Dialog API](https://mui.com/material-ui/api/dialog/)
119
119
  * - inherits [Modal API](https://mui.com/material-ui/api/modal/)
120
120
  */
121
- export default function Dialog(props: DialogProps): JSX.Element;
121
+ export default function Dialog(props: DialogProps): React.JSX.Element;
@@ -33,4 +33,4 @@ export interface DialogActionsProps extends StandardProps<React.HTMLAttributes<H
33
33
  *
34
34
  * - [DialogActions API](https://mui.com/material-ui/api/dialog-actions/)
35
35
  */
36
- export default function DialogActions(props: DialogActionsProps): JSX.Element;
36
+ export default function DialogActions(props: DialogActionsProps): React.JSX.Element;
@@ -33,4 +33,4 @@ export interface DialogContentProps extends StandardProps<React.HTMLAttributes<H
33
33
  *
34
34
  * - [DialogContent API](https://mui.com/material-ui/api/dialog-content/)
35
35
  */
36
- export default function DialogContent(props: DialogContentProps): JSX.Element;
36
+ export default function DialogContent(props: DialogContentProps): React.JSX.Element;
@@ -85,4 +85,4 @@ export interface DrawerProps extends StandardProps<ModalProps, 'open' | 'childre
85
85
  *
86
86
  * - [Drawer API](https://mui.com/material-ui/api/drawer/)
87
87
  */
88
- export default function Drawer(props: DrawerProps): JSX.Element;
88
+ export default function Drawer(props: DrawerProps): React.JSX.Element;
package/Fade/Fade.d.ts CHANGED
@@ -46,4 +46,4 @@ export interface FadeProps extends Omit<TransitionProps, 'children'> {
46
46
  * - [Fade API](https://mui.com/material-ui/api/fade/)
47
47
  * - inherits [Transition API](https://reactcommunity.org/react-transition-group/transition/#Transition-props)
48
48
  */
49
- export default function Fade(props: FadeProps): JSX.Element;
49
+ export default function Fade(props: FadeProps): React.JSX.Element;
@@ -37,6 +37,6 @@ export interface FilledInputProps extends StandardProps<InputBaseProps> {
37
37
  * - [FilledInput API](https://mui.com/material-ui/api/filled-input/)
38
38
  * - inherits [InputBase API](https://mui.com/material-ui/api/input-base/)
39
39
  */
40
- declare const FilledInput: ((props: FilledInputProps) => JSX.Element) & { muiName: string };
40
+ declare const FilledInput: ((props: FilledInputProps) => React.JSX.Element) & { muiName: string };
41
41
 
42
42
  export default FilledInput;
@@ -106,4 +106,4 @@ export interface FormControlLabelProps
106
106
  *
107
107
  * - [FormControlLabel API](https://mui.com/material-ui/api/form-control-label/)
108
108
  */
109
- export default function FormControlLabel(props: FormControlLabelProps): JSX.Element;
109
+ export default function FormControlLabel(props: FormControlLabelProps): React.JSX.Element;
@@ -37,4 +37,4 @@ export interface FormGroupProps extends StandardProps<React.HTMLAttributes<HTMLD
37
37
  *
38
38
  * - [FormGroup API](https://mui.com/material-ui/api/form-group/)
39
39
  */
40
- export default function FormGroup(props: FormGroupProps): JSX.Element;
40
+ export default function FormGroup(props: FormGroupProps): React.JSX.Element;
@@ -18,4 +18,4 @@ export interface GlobalStylesProps {
18
18
  *
19
19
  * - [GlobalStyles API](https://mui.com/material-ui/api/global-styles/)
20
20
  */
21
- export default function GlobalStyles(props: GlobalStylesProps): React.ReactElement;
21
+ export default function GlobalStyles(props: GlobalStylesProps): React.ReactElement<any>;
package/Grid/Grid.d.ts CHANGED
@@ -139,6 +139,7 @@ export interface GridOwnProps extends SystemProps<Theme>, Breakpoints {
139
139
  * Defines the `flex-wrap` style property.
140
140
  * It's applied for all screen sizes.
141
141
  * @default 'wrap'
142
+ * @deprecated Use `flexWrap` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
142
143
  */
143
144
  wrap?: GridWrap;
144
145
  /**
package/Grid/Grid.js CHANGED
@@ -530,6 +530,7 @@ process.env.NODE_ENV !== "production" ? Grid.propTypes /* remove-proptypes */ =
530
530
  * Defines the `flex-wrap` style property.
531
531
  * It's applied for all screen sizes.
532
532
  * @default 'wrap'
533
+ * @deprecated Use `flexWrap` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
533
534
  */
534
535
  wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap']),
535
536
  /**
package/Grow/Grow.d.ts CHANGED
@@ -47,4 +47,4 @@ export interface GrowProps extends Omit<TransitionProps, 'timeout'> {
47
47
  * - [Grow API](https://mui.com/material-ui/api/grow/)
48
48
  * - inherits [Transition API](https://reactcommunity.org/react-transition-group/transition/#Transition-props)
49
49
  */
50
- export default function Grow(props: GrowProps): JSX.Element;
50
+ export default function Grow(props: GrowProps): React.JSX.Element;
@@ -90,6 +90,8 @@ export interface HiddenProps {
90
90
  * API:
91
91
  *
92
92
  * - [Hidden API](https://mui.com/material-ui/api/hidden/)
93
+ *
94
+ * @deprecated The Hidden component was deprecated in Material UI v5. To learn more, see [the Hidden section](/material-ui/migration/v5-component-changes/#hidden) of the migration docs.
93
95
  */
94
96
  declare const Hidden: React.JSXElementConstructor<HiddenProps>;
95
97
 
package/Hidden/Hidden.js CHANGED
@@ -7,6 +7,8 @@ import HiddenCss from './HiddenCss';
7
7
 
8
8
  /**
9
9
  * Responsively hides children based on the selected implementation.
10
+ *
11
+ * @deprecated The Hidden component was deprecated in Material UI v5. To learn more, see [the Hidden section](/material-ui/migration/v5-component-changes/#hidden) of the migration docs.
10
12
  */
11
13
  import { jsx as _jsx } from "react/jsx-runtime";
12
14
  function Hidden(props) {
@@ -48,4 +48,4 @@ export interface ImageListItemBarProps
48
48
  *
49
49
  * - [ImageListItemBar API](https://mui.com/material-ui/api/image-list-item-bar/)
50
50
  */
51
- export default function ImageListItemBar(props: ImageListItemBarProps): JSX.Element;
51
+ export default function ImageListItemBar(props: ImageListItemBarProps): React.JSX.Element;
package/Input/Input.d.ts CHANGED
@@ -30,6 +30,6 @@ export interface InputProps extends StandardProps<InputBaseProps> {
30
30
  * - [Input API](https://mui.com/material-ui/api/input/)
31
31
  * - inherits [InputBase API](https://mui.com/material-ui/api/input-base/)
32
32
  */
33
- declare const Input: ((props: InputProps) => JSX.Element) & { muiName: string };
33
+ declare const Input: ((props: InputProps) => React.JSX.Element) & { muiName: string };
34
34
 
35
35
  export default Input;
@@ -263,4 +263,4 @@ export interface InputBaseComponentProps
263
263
  *
264
264
  * - [InputBase API](https://mui.com/material-ui/api/input-base/)
265
265
  */
266
- export default function InputBase(props: InputBaseProps): JSX.Element;
266
+ export default function InputBase(props: InputBaseProps): React.JSX.Element;
@@ -59,4 +59,4 @@ export interface LinearProgressProps
59
59
  *
60
60
  * - [LinearProgress API](https://mui.com/material-ui/api/linear-progress/)
61
61
  */
62
- export default function LinearProgress(props: LinearProgressProps): JSX.Element;
62
+ export default function LinearProgress(props: LinearProgressProps): React.JSX.Element;
@@ -35,13 +35,13 @@ export interface ListItemBaseProps {
35
35
  /**
36
36
  * The container component used when a `ListItemSecondaryAction` is the last child.
37
37
  * @default 'li'
38
- * @deprecated
38
+ * @deprecated Use the `component` or `slots.root` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
39
39
  */
40
40
  ContainerComponent?: React.ElementType<React.HTMLAttributes<HTMLDivElement>>;
41
41
  /**
42
42
  * Props applied to the container component if used.
43
43
  * @default {}
44
- * @deprecated
44
+ * @deprecated Use the `slotProps.root` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
45
45
  */
46
46
  ContainerProps?: React.HTMLAttributes<HTMLDivElement>;
47
47
  /**
@@ -91,9 +91,7 @@ export interface ListItemOwnProps extends ListItemBaseProps {
91
91
  /**
92
92
  * The components used for each slot inside.
93
93
  *
94
- * This prop is an alias for the `slots` prop.
95
- * It's recommended to use the `slots` prop instead.
96
- *
94
+ * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
97
95
  * @default {}
98
96
  */
99
97
  components?: {
@@ -103,9 +101,7 @@ export interface ListItemOwnProps extends ListItemBaseProps {
103
101
  * The extra props for the slot components.
104
102
  * You can override the existing props or add new ones.
105
103
  *
106
- * This prop is an alias for the `slotProps` prop.
107
- * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
108
- *
104
+ * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
109
105
  * @default {}
110
106
  */
111
107
  componentsProps?: {
@@ -115,8 +111,6 @@ export interface ListItemOwnProps extends ListItemBaseProps {
115
111
  * The extra props for the slot components.
116
112
  * You can override the existing props or add new ones.
117
113
  *
118
- * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
119
- *
120
114
  * @default {}
121
115
  */
122
116
  slotProps?: {
@@ -125,8 +119,6 @@ export interface ListItemOwnProps extends ListItemBaseProps {
125
119
  /**
126
120
  * The components used for each slot inside.
127
121
  *
128
- * This prop is an alias for the `components` prop, which will be deprecated in the future.
129
- *
130
122
  * @default {}
131
123
  */
132
124
  slots?: {
@@ -223,7 +223,7 @@ const ListItem = /*#__PURE__*/React.forwardRef(function ListItem(inProps, ref) {
223
223
  }, [autoFocus]);
224
224
  const children = React.Children.toArray(childrenProp);
225
225
 
226
- // v4 implementation, deprecated in v5, will be removed in v6
226
+ // v4 implementation, deprecated in v6, will be removed in v7
227
227
  const hasSecondaryAction = children.length && isMuiElement(children[children.length - 1], ['ListItemSecondaryAction']);
228
228
  const ownerState = {
229
229
  ...props,
@@ -254,7 +254,7 @@ const ListItem = /*#__PURE__*/React.forwardRef(function ListItem(inProps, ref) {
254
254
  Component = ButtonBase;
255
255
  }
256
256
 
257
- // v4 implementation, deprecated in v5, will be removed in v6
257
+ // v4 implementation, deprecated in v6, will be removed in v7
258
258
  if (hasSecondaryAction) {
259
259
  // Use div by default.
260
260
  Component = !componentProps.component && !componentProp ? 'div' : Component;
@@ -372,9 +372,7 @@ process.env.NODE_ENV !== "production" ? ListItem.propTypes /* remove-proptypes *
372
372
  /**
373
373
  * The components used for each slot inside.
374
374
  *
375
- * This prop is an alias for the `slots` prop.
376
- * It's recommended to use the `slots` prop instead.
377
- *
375
+ * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
378
376
  * @default {}
379
377
  */
380
378
  components: PropTypes.shape({
@@ -384,9 +382,7 @@ process.env.NODE_ENV !== "production" ? ListItem.propTypes /* remove-proptypes *
384
382
  * The extra props for the slot components.
385
383
  * You can override the existing props or add new ones.
386
384
  *
387
- * This prop is an alias for the `slotProps` prop.
388
- * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
389
- *
385
+ * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
390
386
  * @default {}
391
387
  */
392
388
  componentsProps: PropTypes.shape({
@@ -395,13 +391,13 @@ process.env.NODE_ENV !== "production" ? ListItem.propTypes /* remove-proptypes *
395
391
  /**
396
392
  * The container component used when a `ListItemSecondaryAction` is the last child.
397
393
  * @default 'li'
398
- * @deprecated
394
+ * @deprecated Use the `component` or `slots.root` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
399
395
  */
400
396
  ContainerComponent: elementTypeAcceptingRef,
401
397
  /**
402
398
  * Props applied to the container component if used.
403
399
  * @default {}
404
- * @deprecated
400
+ * @deprecated Use the `slotProps.root` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
405
401
  */
406
402
  ContainerProps: PropTypes.object,
407
403
  /**
@@ -449,8 +445,6 @@ process.env.NODE_ENV !== "production" ? ListItem.propTypes /* remove-proptypes *
449
445
  * The extra props for the slot components.
450
446
  * You can override the existing props or add new ones.
451
447
  *
452
- * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
453
- *
454
448
  * @default {}
455
449
  */
456
450
  slotProps: PropTypes.shape({
@@ -459,8 +453,6 @@ process.env.NODE_ENV !== "production" ? ListItem.propTypes /* remove-proptypes *
459
453
  /**
460
454
  * The components used for each slot inside.
461
455
  *
462
- * This prop is an alias for the `components` prop, which will be deprecated in the future.
463
- *
464
456
  * @default {}
465
457
  */
466
458
  slots: PropTypes.shape({