@mui/material 6.0.0-alpha.8 → 6.0.0-beta.0

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 (629) hide show
  1. package/Accordion/Accordion.d.ts +3 -5
  2. package/Accordion/Accordion.js +3 -5
  3. package/AccordionActions/AccordionActions.d.ts +3 -3
  4. package/AccordionActions/AccordionActions.js +3 -3
  5. package/AccordionDetails/AccordionDetails.d.ts +3 -3
  6. package/AccordionDetails/AccordionDetails.js +3 -3
  7. package/AccordionSummary/AccordionSummary.d.ts +3 -3
  8. package/AccordionSummary/AccordionSummary.js +3 -3
  9. package/Alert/Alert.d.ts +16 -7
  10. package/Alert/Alert.js +3 -3
  11. package/AlertTitle/AlertTitle.d.ts +6 -6
  12. package/AlertTitle/AlertTitle.js +3 -3
  13. package/AppBar/AppBar.d.ts +3 -3
  14. package/AppBar/AppBar.js +5 -9
  15. package/Autocomplete/Autocomplete.d.ts +4 -9
  16. package/Autocomplete/Autocomplete.js +13 -26
  17. package/Avatar/Avatar.d.ts +2 -3
  18. package/Avatar/Avatar.js +6 -5
  19. package/AvatarGroup/AvatarGroup.d.ts +53 -20
  20. package/AvatarGroup/AvatarGroup.js +40 -21
  21. package/Backdrop/Backdrop.d.ts +5 -8
  22. package/Backdrop/Backdrop.js +5 -8
  23. package/Badge/Badge.d.ts +3 -3
  24. package/Badge/Badge.js +3 -3
  25. package/BottomNavigation/BottomNavigation.d.ts +2 -2
  26. package/BottomNavigation/BottomNavigation.js +3 -3
  27. package/BottomNavigationAction/BottomNavigationAction.d.ts +3 -3
  28. package/BottomNavigationAction/BottomNavigationAction.js +3 -3
  29. package/Box/Box.d.ts +2 -2
  30. package/Breadcrumbs/Breadcrumbs.d.ts +3 -3
  31. package/Breadcrumbs/Breadcrumbs.js +3 -3
  32. package/Button/Button.d.ts +5 -5
  33. package/Button/Button.js +3 -3
  34. package/ButtonBase/ButtonBase.d.ts +3 -3
  35. package/ButtonBase/ButtonBase.js +23 -52
  36. package/ButtonBase/TouchRipple.js +3 -3
  37. package/ButtonGroup/ButtonGroup.d.ts +2 -2
  38. package/ButtonGroup/ButtonGroup.js +3 -3
  39. package/CHANGELOG.md +407 -3
  40. package/Card/Card.d.ts +3 -3
  41. package/Card/Card.js +3 -3
  42. package/CardActionArea/CardActionArea.d.ts +3 -3
  43. package/CardActionArea/CardActionArea.js +3 -3
  44. package/CardActions/CardActions.d.ts +3 -3
  45. package/CardActions/CardActions.js +3 -3
  46. package/CardContent/CardContent.d.ts +2 -2
  47. package/CardContent/CardContent.js +3 -3
  48. package/CardHeader/CardHeader.d.ts +3 -3
  49. package/CardHeader/CardHeader.js +3 -3
  50. package/CardMedia/CardMedia.d.ts +2 -2
  51. package/CardMedia/CardMedia.js +3 -3
  52. package/Checkbox/Checkbox.d.ts +5 -5
  53. package/Checkbox/Checkbox.js +3 -3
  54. package/Chip/Chip.d.ts +5 -5
  55. package/Chip/Chip.js +3 -5
  56. package/CircularProgress/CircularProgress.d.ts +3 -3
  57. package/CircularProgress/CircularProgress.js +3 -3
  58. package/Collapse/Collapse.d.ts +6 -6
  59. package/Collapse/Collapse.js +3 -4
  60. package/Container/Container.d.ts +2 -2
  61. package/CssBaseline/CssBaseline.d.ts +3 -3
  62. package/CssBaseline/CssBaseline.js +66 -8
  63. package/DefaultPropsProvider/DefaultPropsProvider.d.ts +15 -0
  64. package/DefaultPropsProvider/DefaultPropsProvider.js +29 -0
  65. package/DefaultPropsProvider/index.d.ts +1 -0
  66. package/DefaultPropsProvider/index.js +1 -0
  67. package/DefaultPropsProvider/package.json +6 -0
  68. package/Dialog/Dialog.d.ts +4 -4
  69. package/Dialog/Dialog.js +4 -7
  70. package/DialogActions/DialogActions.d.ts +3 -3
  71. package/DialogActions/DialogActions.js +3 -3
  72. package/DialogContent/DialogContent.d.ts +3 -3
  73. package/DialogContent/DialogContent.js +3 -3
  74. package/DialogContentText/DialogContentText.d.ts +3 -3
  75. package/DialogContentText/DialogContentText.js +3 -3
  76. package/DialogTitle/DialogTitle.d.ts +3 -3
  77. package/DialogTitle/DialogTitle.js +3 -3
  78. package/Divider/Divider.d.ts +3 -3
  79. package/Divider/Divider.js +3 -3
  80. package/Drawer/Drawer.d.ts +4 -4
  81. package/Drawer/Drawer.js +3 -4
  82. package/Fab/Fab.d.ts +3 -3
  83. package/Fab/Fab.js +3 -3
  84. package/Fade/Fade.d.ts +4 -4
  85. package/Fade/Fade.js +1 -1
  86. package/FilledInput/FilledInput.d.ts +4 -4
  87. package/FilledInput/FilledInput.js +13 -11
  88. package/FilledInput/filledInputClasses.d.ts +1 -13
  89. package/FilledInput/filledInputClasses.js +1 -1
  90. package/FormControl/FormControl.d.ts +6 -6
  91. package/FormControl/FormControl.js +3 -3
  92. package/FormControlLabel/FormControlLabel.d.ts +5 -5
  93. package/FormControlLabel/FormControlLabel.js +3 -3
  94. package/FormGroup/FormGroup.d.ts +4 -4
  95. package/FormGroup/FormGroup.js +3 -3
  96. package/FormHelperText/FormHelperText.d.ts +2 -2
  97. package/FormHelperText/FormHelperText.js +3 -3
  98. package/FormLabel/FormLabel.d.ts +4 -4
  99. package/FormLabel/FormLabel.js +3 -3
  100. package/GlobalStyles/GlobalStyles.d.ts +3 -3
  101. package/Grid/Grid.d.ts +3 -2
  102. package/Grid/Grid.js +8 -13
  103. package/Grow/Grow.d.ts +6 -6
  104. package/Grow/Grow.js +1 -1
  105. package/Hidden/Hidden.d.ts +4 -2
  106. package/Hidden/Hidden.js +2 -0
  107. package/Hidden/hiddenCssClasses.d.ts +3 -0
  108. package/Icon/Icon.d.ts +3 -3
  109. package/Icon/Icon.js +3 -3
  110. package/IconButton/IconButton.d.ts +4 -4
  111. package/IconButton/IconButton.js +3 -5
  112. package/ImageList/ImageList.d.ts +2 -2
  113. package/ImageList/ImageList.js +3 -11
  114. package/ImageListItem/ImageListItem.d.ts +2 -2
  115. package/ImageListItem/ImageListItem.js +3 -3
  116. package/ImageListItemBar/ImageListItemBar.d.ts +3 -3
  117. package/ImageListItemBar/ImageListItemBar.js +3 -3
  118. package/InitColorSchemeScript/InitColorSchemeScript.d.ts +10 -0
  119. package/InitColorSchemeScript/InitColorSchemeScript.js +16 -0
  120. package/InitColorSchemeScript/index.d.ts +1 -0
  121. package/InitColorSchemeScript/index.js +1 -0
  122. package/InitColorSchemeScript/package.json +6 -0
  123. package/Input/Input.d.ts +4 -4
  124. package/Input/Input.js +5 -9
  125. package/InputAdornment/InputAdornment.d.ts +2 -2
  126. package/InputAdornment/InputAdornment.js +3 -5
  127. package/InputBase/InputBase.d.ts +5 -7
  128. package/InputBase/InputBase.js +31 -40
  129. package/InputLabel/InputLabel.d.ts +3 -3
  130. package/InputLabel/InputLabel.js +3 -3
  131. package/LinearProgress/LinearProgress.d.ts +3 -3
  132. package/LinearProgress/LinearProgress.js +3 -3
  133. package/Link/Link.d.ts +4 -4
  134. package/Link/Link.js +7 -18
  135. package/List/List.d.ts +3 -3
  136. package/List/List.js +3 -3
  137. package/ListItem/ListItem.d.ts +7 -15
  138. package/ListItem/ListItem.js +9 -17
  139. package/ListItemAvatar/ListItemAvatar.d.ts +3 -3
  140. package/ListItemAvatar/ListItemAvatar.js +3 -3
  141. package/ListItemButton/ListItemButton.d.ts +3 -3
  142. package/ListItemButton/ListItemButton.js +3 -3
  143. package/ListItemIcon/ListItemIcon.d.ts +3 -3
  144. package/ListItemIcon/ListItemIcon.js +3 -3
  145. package/ListItemSecondaryAction/ListItemSecondaryAction.d.ts +7 -3
  146. package/ListItemSecondaryAction/ListItemSecondaryAction.js +5 -3
  147. package/ListItemText/ListItemText.d.ts +5 -3
  148. package/ListItemText/ListItemText.js +3 -3
  149. package/ListSubheader/ListSubheader.d.ts +2 -2
  150. package/ListSubheader/ListSubheader.js +3 -3
  151. package/Menu/Menu.d.ts +5 -5
  152. package/Menu/Menu.js +4 -7
  153. package/MenuItem/MenuItem.d.ts +3 -3
  154. package/MenuItem/MenuItem.js +3 -3
  155. package/MenuList/MenuList.d.ts +4 -4
  156. package/MobileStepper/MobileStepper.d.ts +4 -4
  157. package/MobileStepper/MobileStepper.js +3 -3
  158. package/Modal/Modal.d.ts +10 -12
  159. package/Modal/Modal.js +32 -24
  160. package/NativeSelect/NativeSelect.d.ts +4 -4
  161. package/NativeSelect/NativeSelectInput.js +0 -4
  162. package/OutlinedInput/OutlinedInput.d.ts +6 -4
  163. package/OutlinedInput/OutlinedInput.js +4 -5
  164. package/OverridableComponent.d.ts +2 -2
  165. package/Pagination/Pagination.d.ts +3 -3
  166. package/Pagination/Pagination.js +3 -3
  167. package/PaginationItem/PaginationItem.d.ts +2 -2
  168. package/PaginationItem/PaginationItem.js +3 -3
  169. package/Paper/Paper.d.ts +3 -3
  170. package/Paper/Paper.js +3 -4
  171. package/PigmentContainer/PigmentContainer.d.ts +55 -0
  172. package/PigmentContainer/PigmentContainer.js +98 -0
  173. package/PigmentContainer/index.d.ts +3 -0
  174. package/PigmentContainer/index.js +3 -0
  175. package/PigmentContainer/package.json +6 -0
  176. package/PigmentGrid/PigmentGrid.d.ts +108 -0
  177. package/PigmentGrid/PigmentGrid.js +149 -0
  178. package/PigmentGrid/index.d.ts +3 -0
  179. package/PigmentGrid/index.js +3 -0
  180. package/{useTouchRipple → PigmentGrid}/package.json +1 -1
  181. package/PigmentHidden/PigmentHidden.d.ts +97 -0
  182. package/PigmentHidden/PigmentHidden.js +278 -0
  183. package/PigmentHidden/index.d.ts +2 -0
  184. package/PigmentHidden/index.js +2 -0
  185. package/PigmentHidden/package.json +6 -0
  186. package/PigmentStack/PigmentStack.d.ts +51 -0
  187. package/PigmentStack/PigmentStack.js +81 -0
  188. package/PigmentStack/index.d.ts +3 -0
  189. package/PigmentStack/index.js +3 -0
  190. package/PigmentStack/package.json +6 -0
  191. package/Popover/Popover.d.ts +21 -26
  192. package/Popover/Popover.js +30 -29
  193. package/Popper/Popper.d.ts +8 -4
  194. package/Popper/Popper.js +14 -9
  195. package/Radio/Radio.d.ts +4 -4
  196. package/Radio/Radio.js +3 -3
  197. package/RadioGroup/RadioGroup.d.ts +4 -4
  198. package/Rating/Rating.d.ts +3 -3
  199. package/Rating/Rating.js +8 -15
  200. package/ScopedCssBaseline/ScopedCssBaseline.d.ts +2 -2
  201. package/ScopedCssBaseline/ScopedCssBaseline.js +24 -11
  202. package/Select/Select.d.ts +4 -4
  203. package/Skeleton/Skeleton.d.ts +2 -2
  204. package/Skeleton/Skeleton.js +3 -3
  205. package/Slide/Slide.d.ts +5 -5
  206. package/Slide/Slide.js +1 -1
  207. package/Slider/Slider.d.ts +3 -3
  208. package/Slider/Slider.js +4 -4
  209. package/Slider/SliderValueLabel.types.d.ts +1 -1
  210. package/Snackbar/Snackbar.d.ts +3 -3
  211. package/Snackbar/Snackbar.js +3 -4
  212. package/SnackbarContent/SnackbarContent.d.ts +4 -4
  213. package/SnackbarContent/SnackbarContent.js +3 -3
  214. package/SpeedDial/SpeedDial.d.ts +3 -5
  215. package/SpeedDial/SpeedDial.js +3 -6
  216. package/SpeedDialAction/SpeedDialAction.d.ts +4 -4
  217. package/SpeedDialAction/SpeedDialAction.js +3 -3
  218. package/SpeedDialIcon/SpeedDialIcon.d.ts +5 -3
  219. package/SpeedDialIcon/SpeedDialIcon.js +3 -3
  220. package/Stack/Stack.d.ts +2 -2
  221. package/Step/Step.d.ts +2 -2
  222. package/Step/Step.js +3 -3
  223. package/StepButton/StepButton.d.ts +3 -3
  224. package/StepButton/StepButton.js +3 -3
  225. package/StepConnector/StepConnector.d.ts +4 -4
  226. package/StepConnector/StepConnector.js +3 -3
  227. package/StepContent/StepContent.d.ts +3 -3
  228. package/StepContent/StepContent.js +3 -3
  229. package/StepIcon/StepIcon.d.ts +3 -3
  230. package/StepIcon/StepIcon.js +3 -3
  231. package/StepLabel/StepLabel.d.ts +3 -5
  232. package/StepLabel/StepLabel.js +3 -7
  233. package/Stepper/Stepper.d.ts +2 -2
  234. package/Stepper/Stepper.js +7 -5
  235. package/Stepper/stepperClasses.d.ts +2 -0
  236. package/Stepper/stepperClasses.js +1 -1
  237. package/SvgIcon/SvgIcon.d.ts +3 -3
  238. package/SvgIcon/SvgIcon.js +3 -3
  239. package/SwipeableDrawer/SwipeableDrawer.d.ts +3 -3
  240. package/SwipeableDrawer/SwipeableDrawer.js +3 -3
  241. package/Switch/Switch.d.ts +5 -5
  242. package/Switch/Switch.js +3 -3
  243. package/Tab/Tab.d.ts +4 -4
  244. package/Tab/Tab.js +14 -10
  245. package/Tab/tabClasses.d.ts +5 -1
  246. package/Tab/tabClasses.js +1 -1
  247. package/TabScrollButton/TabScrollButton.d.ts +3 -3
  248. package/TabScrollButton/TabScrollButton.js +3 -3
  249. package/Table/Table.d.ts +2 -2
  250. package/Table/Table.js +3 -3
  251. package/TableBody/TableBody.d.ts +2 -2
  252. package/TableBody/TableBody.js +3 -3
  253. package/TableCell/TableCell.d.ts +3 -3
  254. package/TableCell/TableCell.js +3 -3
  255. package/TableContainer/TableContainer.d.ts +2 -2
  256. package/TableContainer/TableContainer.js +3 -3
  257. package/TableFooter/TableFooter.d.ts +2 -2
  258. package/TableFooter/TableFooter.js +3 -3
  259. package/TableHead/TableHead.d.ts +2 -2
  260. package/TableHead/TableHead.js +3 -3
  261. package/TablePagination/TablePagination.d.ts +4 -4
  262. package/TablePagination/TablePagination.js +3 -3
  263. package/TableRow/TableRow.d.ts +2 -2
  264. package/TableRow/TableRow.js +3 -3
  265. package/TableSortLabel/TableSortLabel.d.ts +3 -3
  266. package/TableSortLabel/TableSortLabel.js +4 -4
  267. package/TableSortLabel/tableSortLabelClasses.d.ts +10 -2
  268. package/TableSortLabel/tableSortLabelClasses.js +1 -1
  269. package/Tabs/Tabs.d.ts +2 -2
  270. package/Tabs/Tabs.js +5 -14
  271. package/TextField/TextField.d.ts +11 -11
  272. package/TextField/TextField.js +3 -3
  273. package/ToggleButton/ToggleButton.d.ts +3 -3
  274. package/ToggleButton/ToggleButton.js +3 -3
  275. package/ToggleButtonGroup/ToggleButtonGroup.d.ts +3 -3
  276. package/ToggleButtonGroup/ToggleButtonGroup.js +3 -3
  277. package/Toolbar/Toolbar.d.ts +2 -2
  278. package/Toolbar/Toolbar.js +3 -3
  279. package/Tooltip/Tooltip.d.ts +5 -7
  280. package/Tooltip/Tooltip.js +9 -22
  281. package/Typography/Typography.d.ts +3 -3
  282. package/Typography/Typography.js +4 -4
  283. package/Zoom/Zoom.d.ts +4 -4
  284. package/Zoom/Zoom.js +1 -1
  285. package/index.js +1 -1
  286. package/locale/index.d.ts +1 -0
  287. package/locale/index.js +74 -1
  288. package/modern/Accordion/Accordion.js +3 -5
  289. package/modern/AccordionActions/AccordionActions.js +3 -3
  290. package/modern/AccordionDetails/AccordionDetails.js +3 -3
  291. package/modern/AccordionSummary/AccordionSummary.js +3 -3
  292. package/modern/Alert/Alert.js +3 -3
  293. package/modern/AlertTitle/AlertTitle.js +3 -3
  294. package/modern/AppBar/AppBar.js +5 -9
  295. package/modern/Autocomplete/Autocomplete.js +13 -26
  296. package/modern/Avatar/Avatar.js +6 -5
  297. package/modern/AvatarGroup/AvatarGroup.js +40 -21
  298. package/modern/Backdrop/Backdrop.js +5 -8
  299. package/modern/Badge/Badge.js +3 -3
  300. package/modern/BottomNavigation/BottomNavigation.js +3 -3
  301. package/modern/BottomNavigationAction/BottomNavigationAction.js +3 -3
  302. package/modern/Breadcrumbs/Breadcrumbs.js +3 -3
  303. package/modern/Button/Button.js +3 -3
  304. package/modern/ButtonBase/ButtonBase.js +23 -52
  305. package/modern/ButtonBase/TouchRipple.js +3 -3
  306. package/modern/ButtonGroup/ButtonGroup.js +3 -3
  307. package/modern/Card/Card.js +3 -3
  308. package/modern/CardActionArea/CardActionArea.js +3 -3
  309. package/modern/CardActions/CardActions.js +3 -3
  310. package/modern/CardContent/CardContent.js +3 -3
  311. package/modern/CardHeader/CardHeader.js +3 -3
  312. package/modern/CardMedia/CardMedia.js +3 -3
  313. package/modern/Checkbox/Checkbox.js +3 -3
  314. package/modern/Chip/Chip.js +3 -5
  315. package/modern/CircularProgress/CircularProgress.js +3 -3
  316. package/modern/Collapse/Collapse.js +3 -4
  317. package/modern/CssBaseline/CssBaseline.js +66 -8
  318. package/modern/DefaultPropsProvider/DefaultPropsProvider.js +29 -0
  319. package/modern/DefaultPropsProvider/index.js +1 -0
  320. package/modern/Dialog/Dialog.js +4 -7
  321. package/modern/DialogActions/DialogActions.js +3 -3
  322. package/modern/DialogContent/DialogContent.js +3 -3
  323. package/modern/DialogContentText/DialogContentText.js +3 -3
  324. package/modern/DialogTitle/DialogTitle.js +3 -3
  325. package/modern/Divider/Divider.js +3 -3
  326. package/modern/Drawer/Drawer.js +3 -4
  327. package/modern/Fab/Fab.js +3 -3
  328. package/modern/Fade/Fade.js +1 -1
  329. package/modern/FilledInput/FilledInput.js +13 -11
  330. package/modern/FilledInput/filledInputClasses.js +1 -1
  331. package/modern/FormControl/FormControl.js +3 -3
  332. package/modern/FormControlLabel/FormControlLabel.js +3 -3
  333. package/modern/FormGroup/FormGroup.js +3 -3
  334. package/modern/FormHelperText/FormHelperText.js +3 -3
  335. package/modern/FormLabel/FormLabel.js +3 -3
  336. package/modern/Grid/Grid.js +8 -13
  337. package/modern/Grow/Grow.js +1 -1
  338. package/modern/Hidden/Hidden.js +2 -0
  339. package/modern/Icon/Icon.js +3 -3
  340. package/modern/IconButton/IconButton.js +3 -5
  341. package/modern/ImageList/ImageList.js +3 -11
  342. package/modern/ImageListItem/ImageListItem.js +3 -3
  343. package/modern/ImageListItemBar/ImageListItemBar.js +3 -3
  344. package/modern/InitColorSchemeScript/InitColorSchemeScript.js +16 -0
  345. package/modern/InitColorSchemeScript/index.js +1 -0
  346. package/modern/Input/Input.js +5 -9
  347. package/modern/InputAdornment/InputAdornment.js +3 -5
  348. package/modern/InputBase/InputBase.js +31 -40
  349. package/modern/InputLabel/InputLabel.js +3 -3
  350. package/modern/LinearProgress/LinearProgress.js +3 -3
  351. package/modern/Link/Link.js +7 -18
  352. package/modern/List/List.js +3 -3
  353. package/modern/ListItem/ListItem.js +9 -17
  354. package/modern/ListItemAvatar/ListItemAvatar.js +3 -3
  355. package/modern/ListItemButton/ListItemButton.js +3 -3
  356. package/modern/ListItemIcon/ListItemIcon.js +3 -3
  357. package/modern/ListItemSecondaryAction/ListItemSecondaryAction.js +5 -3
  358. package/modern/ListItemText/ListItemText.js +3 -3
  359. package/modern/ListSubheader/ListSubheader.js +3 -3
  360. package/modern/Menu/Menu.js +4 -7
  361. package/modern/MenuItem/MenuItem.js +3 -3
  362. package/modern/MobileStepper/MobileStepper.js +3 -3
  363. package/modern/Modal/Modal.js +32 -24
  364. package/modern/NativeSelect/NativeSelectInput.js +0 -4
  365. package/modern/OutlinedInput/OutlinedInput.js +4 -5
  366. package/modern/Pagination/Pagination.js +3 -3
  367. package/modern/PaginationItem/PaginationItem.js +3 -3
  368. package/modern/Paper/Paper.js +3 -4
  369. package/modern/PigmentContainer/PigmentContainer.js +98 -0
  370. package/modern/PigmentContainer/index.js +3 -0
  371. package/modern/PigmentGrid/PigmentGrid.js +149 -0
  372. package/modern/PigmentGrid/index.js +3 -0
  373. package/modern/PigmentHidden/PigmentHidden.js +278 -0
  374. package/modern/PigmentHidden/index.js +2 -0
  375. package/modern/PigmentStack/PigmentStack.js +81 -0
  376. package/modern/PigmentStack/index.js +3 -0
  377. package/modern/Popover/Popover.js +30 -29
  378. package/modern/Popper/Popper.js +14 -9
  379. package/modern/Radio/Radio.js +3 -3
  380. package/modern/Rating/Rating.js +8 -15
  381. package/modern/ScopedCssBaseline/ScopedCssBaseline.js +24 -11
  382. package/modern/Skeleton/Skeleton.js +3 -3
  383. package/modern/Slide/Slide.js +1 -1
  384. package/modern/Slider/Slider.js +4 -4
  385. package/modern/Snackbar/Snackbar.js +3 -4
  386. package/modern/SnackbarContent/SnackbarContent.js +3 -3
  387. package/modern/SpeedDial/SpeedDial.js +3 -6
  388. package/modern/SpeedDialAction/SpeedDialAction.js +3 -3
  389. package/modern/SpeedDialIcon/SpeedDialIcon.js +3 -3
  390. package/modern/Step/Step.js +3 -3
  391. package/modern/StepButton/StepButton.js +3 -3
  392. package/modern/StepConnector/StepConnector.js +3 -3
  393. package/modern/StepContent/StepContent.js +3 -3
  394. package/modern/StepIcon/StepIcon.js +3 -3
  395. package/modern/StepLabel/StepLabel.js +3 -7
  396. package/modern/Stepper/Stepper.js +7 -5
  397. package/modern/Stepper/stepperClasses.js +1 -1
  398. package/modern/SvgIcon/SvgIcon.js +3 -3
  399. package/modern/SwipeableDrawer/SwipeableDrawer.js +3 -3
  400. package/modern/Switch/Switch.js +3 -3
  401. package/modern/Tab/Tab.js +14 -10
  402. package/modern/Tab/tabClasses.js +1 -1
  403. package/modern/TabScrollButton/TabScrollButton.js +3 -3
  404. package/modern/Table/Table.js +3 -3
  405. package/modern/TableBody/TableBody.js +3 -3
  406. package/modern/TableCell/TableCell.js +3 -3
  407. package/modern/TableContainer/TableContainer.js +3 -3
  408. package/modern/TableFooter/TableFooter.js +3 -3
  409. package/modern/TableHead/TableHead.js +3 -3
  410. package/modern/TablePagination/TablePagination.js +3 -3
  411. package/modern/TableRow/TableRow.js +3 -3
  412. package/modern/TableSortLabel/TableSortLabel.js +4 -4
  413. package/modern/TableSortLabel/tableSortLabelClasses.js +1 -1
  414. package/modern/Tabs/Tabs.js +5 -14
  415. package/modern/TextField/TextField.js +3 -3
  416. package/modern/ToggleButton/ToggleButton.js +3 -3
  417. package/modern/ToggleButtonGroup/ToggleButtonGroup.js +3 -3
  418. package/modern/Toolbar/Toolbar.js +3 -3
  419. package/modern/Tooltip/Tooltip.js +9 -22
  420. package/modern/Typography/Typography.js +4 -4
  421. package/modern/Zoom/Zoom.js +1 -1
  422. package/modern/index.js +1 -1
  423. package/modern/locale/index.js +74 -1
  424. package/modern/styles/CssVarsProvider.js +35 -12
  425. package/modern/styles/createTheme.js +1 -1
  426. package/modern/styles/createTransitions.js +2 -2
  427. package/modern/styles/experimental_extendTheme.js +8 -354
  428. package/modern/styles/extendTheme.js +358 -0
  429. package/modern/styles/index.js +3 -2
  430. package/modern/styles/responsiveFontSizes.js +3 -0
  431. package/modern/styles/stringifyTheme.js +55 -0
  432. package/modern/useLazyRipple/index.js +3 -0
  433. package/modern/useLazyRipple/useLazyRipple.js +85 -0
  434. package/modern/usePagination/usePagination.js +1 -1
  435. package/modern/utils/index.js +0 -1
  436. package/modern/zero-styled/index.js +24 -5
  437. package/node/Accordion/Accordion.js +2 -4
  438. package/node/AccordionActions/AccordionActions.js +2 -2
  439. package/node/AccordionDetails/AccordionDetails.js +2 -2
  440. package/node/AccordionSummary/AccordionSummary.js +2 -2
  441. package/node/Alert/Alert.js +2 -2
  442. package/node/AlertTitle/AlertTitle.js +2 -2
  443. package/node/AppBar/AppBar.js +4 -8
  444. package/node/Autocomplete/Autocomplete.js +12 -25
  445. package/node/Avatar/Avatar.js +5 -4
  446. package/node/AvatarGroup/AvatarGroup.js +39 -20
  447. package/node/Backdrop/Backdrop.js +4 -7
  448. package/node/Badge/Badge.js +2 -2
  449. package/node/BottomNavigation/BottomNavigation.js +2 -2
  450. package/node/BottomNavigationAction/BottomNavigationAction.js +2 -2
  451. package/node/Breadcrumbs/Breadcrumbs.js +2 -2
  452. package/node/Button/Button.js +2 -2
  453. package/node/ButtonBase/ButtonBase.js +22 -51
  454. package/node/ButtonBase/TouchRipple.js +2 -2
  455. package/node/ButtonGroup/ButtonGroup.js +2 -2
  456. package/node/Card/Card.js +2 -2
  457. package/node/CardActionArea/CardActionArea.js +2 -2
  458. package/node/CardActions/CardActions.js +2 -2
  459. package/node/CardContent/CardContent.js +2 -2
  460. package/node/CardHeader/CardHeader.js +2 -2
  461. package/node/CardMedia/CardMedia.js +2 -2
  462. package/node/Checkbox/Checkbox.js +2 -2
  463. package/node/Chip/Chip.js +2 -4
  464. package/node/CircularProgress/CircularProgress.js +2 -2
  465. package/node/Collapse/Collapse.js +3 -4
  466. package/node/CssBaseline/CssBaseline.js +70 -10
  467. package/node/DefaultPropsProvider/DefaultPropsProvider.js +38 -0
  468. package/node/DefaultPropsProvider/index.js +20 -0
  469. package/node/Dialog/Dialog.js +4 -7
  470. package/node/DialogActions/DialogActions.js +2 -2
  471. package/node/DialogContent/DialogContent.js +2 -2
  472. package/node/DialogContentText/DialogContentText.js +2 -2
  473. package/node/DialogTitle/DialogTitle.js +2 -2
  474. package/node/Divider/Divider.js +2 -2
  475. package/node/Drawer/Drawer.js +3 -4
  476. package/node/Fab/Fab.js +2 -2
  477. package/node/Fade/Fade.js +2 -2
  478. package/node/FilledInput/FilledInput.js +12 -10
  479. package/node/FilledInput/filledInputClasses.js +1 -1
  480. package/node/FormControl/FormControl.js +2 -2
  481. package/node/FormControlLabel/FormControlLabel.js +2 -2
  482. package/node/FormGroup/FormGroup.js +2 -2
  483. package/node/FormHelperText/FormHelperText.js +2 -2
  484. package/node/FormLabel/FormLabel.js +2 -2
  485. package/node/Grid/Grid.js +8 -13
  486. package/node/Grow/Grow.js +2 -2
  487. package/node/Hidden/Hidden.js +2 -0
  488. package/node/Icon/Icon.js +2 -2
  489. package/node/IconButton/IconButton.js +2 -4
  490. package/node/ImageList/ImageList.js +2 -10
  491. package/node/ImageListItem/ImageListItem.js +2 -2
  492. package/node/ImageListItemBar/ImageListItemBar.js +2 -2
  493. package/node/InitColorSchemeScript/InitColorSchemeScript.js +25 -0
  494. package/node/InitColorSchemeScript/index.js +13 -0
  495. package/node/Input/Input.js +4 -8
  496. package/node/InputAdornment/InputAdornment.js +2 -4
  497. package/node/InputBase/InputBase.js +30 -39
  498. package/node/InputLabel/InputLabel.js +2 -2
  499. package/node/LinearProgress/LinearProgress.js +2 -2
  500. package/node/Link/Link.js +7 -18
  501. package/node/List/List.js +2 -2
  502. package/node/ListItem/ListItem.js +8 -16
  503. package/node/ListItemAvatar/ListItemAvatar.js +2 -2
  504. package/node/ListItemButton/ListItemButton.js +2 -2
  505. package/node/ListItemIcon/ListItemIcon.js +2 -2
  506. package/node/ListItemSecondaryAction/ListItemSecondaryAction.js +4 -2
  507. package/node/ListItemText/ListItemText.js +2 -2
  508. package/node/ListSubheader/ListSubheader.js +2 -2
  509. package/node/Menu/Menu.js +3 -6
  510. package/node/MenuItem/MenuItem.js +2 -2
  511. package/node/MobileStepper/MobileStepper.js +2 -2
  512. package/node/Modal/Modal.js +31 -24
  513. package/node/NativeSelect/NativeSelectInput.js +0 -4
  514. package/node/OutlinedInput/OutlinedInput.js +3 -4
  515. package/node/Pagination/Pagination.js +2 -2
  516. package/node/PaginationItem/PaginationItem.js +2 -2
  517. package/node/Paper/Paper.js +3 -4
  518. package/node/PigmentContainer/PigmentContainer.js +108 -0
  519. package/node/PigmentContainer/index.js +36 -0
  520. package/node/PigmentGrid/PigmentGrid.js +159 -0
  521. package/node/PigmentGrid/index.js +36 -0
  522. package/node/PigmentHidden/PigmentHidden.js +287 -0
  523. package/node/PigmentHidden/index.js +26 -0
  524. package/node/PigmentStack/PigmentStack.js +91 -0
  525. package/node/PigmentStack/index.js +36 -0
  526. package/node/Popover/Popover.js +29 -28
  527. package/node/Popper/Popper.js +15 -10
  528. package/node/Radio/Radio.js +2 -2
  529. package/node/Rating/Rating.js +6 -13
  530. package/node/ScopedCssBaseline/ScopedCssBaseline.js +27 -13
  531. package/node/Skeleton/Skeleton.js +2 -2
  532. package/node/Slide/Slide.js +2 -2
  533. package/node/Slider/Slider.js +3 -3
  534. package/node/Snackbar/Snackbar.js +3 -4
  535. package/node/SnackbarContent/SnackbarContent.js +2 -2
  536. package/node/SpeedDial/SpeedDial.js +3 -6
  537. package/node/SpeedDialAction/SpeedDialAction.js +2 -2
  538. package/node/SpeedDialIcon/SpeedDialIcon.js +2 -2
  539. package/node/Step/Step.js +2 -2
  540. package/node/StepButton/StepButton.js +2 -2
  541. package/node/StepConnector/StepConnector.js +2 -2
  542. package/node/StepContent/StepContent.js +2 -2
  543. package/node/StepIcon/StepIcon.js +2 -2
  544. package/node/StepLabel/StepLabel.js +2 -6
  545. package/node/Stepper/Stepper.js +6 -4
  546. package/node/Stepper/stepperClasses.js +1 -1
  547. package/node/SvgIcon/SvgIcon.js +2 -2
  548. package/node/SwipeableDrawer/SwipeableDrawer.js +4 -4
  549. package/node/Switch/Switch.js +2 -2
  550. package/node/Tab/Tab.js +13 -9
  551. package/node/Tab/tabClasses.js +1 -1
  552. package/node/TabScrollButton/TabScrollButton.js +2 -2
  553. package/node/Table/Table.js +2 -2
  554. package/node/TableBody/TableBody.js +2 -2
  555. package/node/TableCell/TableCell.js +2 -2
  556. package/node/TableContainer/TableContainer.js +2 -2
  557. package/node/TableFooter/TableFooter.js +2 -2
  558. package/node/TableHead/TableHead.js +2 -2
  559. package/node/TablePagination/TablePagination.js +2 -2
  560. package/node/TableRow/TableRow.js +2 -2
  561. package/node/TableSortLabel/TableSortLabel.js +3 -3
  562. package/node/TableSortLabel/tableSortLabelClasses.js +1 -1
  563. package/node/Tabs/Tabs.js +5 -14
  564. package/node/TextField/TextField.js +2 -2
  565. package/node/ToggleButton/ToggleButton.js +2 -2
  566. package/node/ToggleButtonGroup/ToggleButtonGroup.js +2 -2
  567. package/node/Toolbar/Toolbar.js +2 -2
  568. package/node/Tooltip/Tooltip.js +9 -22
  569. package/node/Typography/Typography.js +4 -4
  570. package/node/Zoom/Zoom.js +2 -2
  571. package/node/index.js +1 -1
  572. package/node/locale/index.js +75 -2
  573. package/node/styles/CssVarsProvider.js +41 -14
  574. package/node/styles/createTheme.js +1 -1
  575. package/node/styles/createTransitions.js +2 -2
  576. package/node/styles/experimental_extendTheme.js +9 -360
  577. package/node/styles/extendTheme.js +370 -0
  578. package/node/styles/index.js +18 -1
  579. package/node/styles/responsiveFontSizes.js +3 -0
  580. package/node/styles/stringifyTheme.js +62 -0
  581. package/node/{useTouchRipple → useLazyRipple}/index.js +2 -2
  582. package/node/useLazyRipple/useLazyRipple.js +104 -0
  583. package/node/usePagination/usePagination.js +1 -1
  584. package/node/utils/index.js +0 -7
  585. package/node/zero-styled/index.js +33 -5
  586. package/package.json +24 -8
  587. package/styles/CssVarsProvider.d.ts +5 -3
  588. package/styles/CssVarsProvider.js +35 -12
  589. package/styles/createTheme.js +1 -1
  590. package/styles/createTransitions.js +2 -2
  591. package/styles/experimental_extendTheme.js +8 -354
  592. package/styles/{experimental_extendTheme.d.ts → extendTheme.d.ts} +1 -2
  593. package/styles/extendTheme.js +358 -0
  594. package/styles/index.d.ts +3 -2
  595. package/styles/index.js +3 -2
  596. package/styles/responsiveFontSizes.d.ts +3 -4
  597. package/styles/responsiveFontSizes.js +3 -0
  598. package/styles/stringifyTheme.d.ts +20 -0
  599. package/styles/stringifyTheme.js +55 -0
  600. package/themeCssVarsAugmentation/index.d.ts +1 -1
  601. package/types/OverridableComponentAugmentation.d.ts +2 -2
  602. package/useLazyRipple/index.d.ts +1 -0
  603. package/useLazyRipple/index.js +3 -0
  604. package/useLazyRipple/package.json +6 -0
  605. package/useLazyRipple/useLazyRipple.d.ts +32 -0
  606. package/useLazyRipple/useLazyRipple.js +85 -0
  607. package/usePagination/usePagination.js +1 -1
  608. package/utils/index.d.ts +0 -1
  609. package/utils/index.js +0 -1
  610. package/zero-styled/index.d.ts +10 -2
  611. package/zero-styled/index.js +24 -5
  612. package/modern/useMediaQuery/useMediaQueryTheme.js +0 -8
  613. package/modern/useTouchRipple/index.js +0 -3
  614. package/modern/useTouchRipple/useTouchRipple.js +0 -94
  615. package/modern/utils/scrollLeft.js +0 -1
  616. package/modern/utils/useIsFocusVisible.js +0 -4
  617. package/node/useMediaQuery/useMediaQueryTheme.js +0 -13
  618. package/node/useTouchRipple/useTouchRipple.js +0 -105
  619. package/node/utils/scrollLeft.js +0 -18
  620. package/node/utils/useIsFocusVisible.js +0 -10
  621. package/useMediaQuery/useMediaQueryTheme.d.ts +0 -3
  622. package/useMediaQuery/useMediaQueryTheme.js +0 -8
  623. package/useTouchRipple/index.d.ts +0 -1
  624. package/useTouchRipple/index.js +0 -3
  625. package/useTouchRipple/useTouchRipple.d.ts +0 -28
  626. package/useTouchRipple/useTouchRipple.js +0 -94
  627. package/utils/scrollLeft.js +0 -1
  628. package/utils/useIsFocusVisible.d.ts +0 -3
  629. package/utils/useIsFocusVisible.js +0 -4
@@ -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,14 +95,34 @@ 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:
88
109
  *
89
- * - [Avatar](https://mui.com/material-ui/react-avatar/)
110
+ * - [Avatar](https://next.mui.com/material-ui/react-avatar/)
90
111
  *
91
112
  * API:
92
113
  *
93
- * - [AvatarGroup API](https://mui.com/material-ui/api/avatar-group/)
114
+ * - [AvatarGroup API](https://next.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;
@@ -6,15 +6,16 @@ import { isFragment } from 'react-is';
6
6
  import clsx from 'clsx';
7
7
  import chainPropTypes from '@mui/utils/chainPropTypes';
8
8
  import composeClasses from '@mui/utils/composeClasses';
9
- import { styled, createUseThemeProps } from '../zero-styled';
9
+ import { styled } from '../zero-styled';
10
+ import { useDefaultProps } from '../DefaultPropsProvider';
10
11
  import Avatar, { avatarClasses } from '../Avatar';
11
12
  import avatarGroupClasses, { getAvatarGroupUtilityClass } from './avatarGroupClasses';
13
+ import useSlot from '../utils/useSlot';
12
14
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
15
  const SPACINGS = {
14
16
  small: -16,
15
17
  medium: -8
16
18
  };
17
- const useThemeProps = createUseThemeProps('MuiAlert');
18
19
  const useUtilityClasses = ownerState => {
19
20
  const {
20
21
  classes
@@ -47,7 +48,7 @@ const AvatarGroupRoot = styled('div', {
47
48
  }
48
49
  }));
49
50
  const AvatarGroup = /*#__PURE__*/React.forwardRef(function AvatarGroup(inProps, ref) {
50
- const props = useThemeProps({
51
+ const props = useDefaultProps({
51
52
  props: inProps,
52
53
  name: 'MuiAvatarGroup'
53
54
  });
@@ -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.
@@ -52,8 +52,7 @@ export interface BackdropOwnProps
52
52
  /**
53
53
  * The components used for each slot inside.
54
54
  *
55
- * This prop is an alias for the `slots` prop.
56
- * It's recommended to use the `slots` prop instead.
55
+ * @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.
57
56
  *
58
57
  * @default {}
59
58
  */
@@ -64,8 +63,7 @@ export interface BackdropOwnProps
64
63
  * The extra props for the slot components.
65
64
  * You can override the existing props or add new ones.
66
65
  *
67
- * This prop is an alias for the `slotProps` prop.
68
- * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
66
+ * @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.
69
67
  *
70
68
  * @default {}
71
69
  */
@@ -99,7 +97,6 @@ export interface BackdropOwnProps
99
97
  * The component used for the transition.
100
98
  * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
101
99
  * @default Fade
102
- * @deprecated Use `slots.transition` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
103
100
  */
104
101
  TransitionComponent?: React.JSXElementConstructor<
105
102
  TransitionProps & {
@@ -124,12 +121,12 @@ export declare const BackdropRoot: React.FC<BackdropRootProps>;
124
121
  *
125
122
  * Demos:
126
123
  *
127
- * - [Backdrop](https://mui.com/material-ui/react-backdrop/)
124
+ * - [Backdrop](https://next.mui.com/material-ui/react-backdrop/)
128
125
  *
129
126
  * API:
130
127
  *
131
- * - [Backdrop API](https://mui.com/material-ui/api/backdrop/)
132
- * - inherits [Fade API](https://mui.com/material-ui/api/fade/)
128
+ * - [Backdrop API](https://next.mui.com/material-ui/api/backdrop/)
129
+ * - inherits [Fade API](https://next.mui.com/material-ui/api/fade/)
133
130
  */
134
131
  declare const Backdrop: OverridableComponent<BackdropTypeMap>;
135
132
 
@@ -4,12 +4,12 @@ import * as React from 'react';
4
4
  import PropTypes from 'prop-types';
5
5
  import clsx from 'clsx';
6
6
  import composeClasses from '@mui/utils/composeClasses';
7
- import { styled, createUseThemeProps } from '../zero-styled';
7
+ import { styled } from '../zero-styled';
8
+ import { useDefaultProps } from '../DefaultPropsProvider';
8
9
  import useSlot from '../utils/useSlot';
9
10
  import Fade from '../Fade';
10
11
  import { getBackdropUtilityClass } from './backdropClasses';
11
12
  import { jsx as _jsx } from "react/jsx-runtime";
12
- const useThemeProps = createUseThemeProps('MuiBackdrop');
13
13
  const useUtilityClasses = ownerState => {
14
14
  const {
15
15
  classes,
@@ -50,7 +50,7 @@ const BackdropRoot = styled('div', {
50
50
  }]
51
51
  });
52
52
  const Backdrop = /*#__PURE__*/React.forwardRef(function Backdrop(inProps, ref) {
53
- const props = useThemeProps({
53
+ const props = useDefaultProps({
54
54
  props: inProps,
55
55
  name: 'MuiBackdrop'
56
56
  });
@@ -138,8 +138,7 @@ process.env.NODE_ENV !== "production" ? Backdrop.propTypes /* remove-proptypes *
138
138
  /**
139
139
  * The components used for each slot inside.
140
140
  *
141
- * This prop is an alias for the `slots` prop.
142
- * It's recommended to use the `slots` prop instead.
141
+ * @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.
143
142
  *
144
143
  * @default {}
145
144
  */
@@ -150,8 +149,7 @@ process.env.NODE_ENV !== "production" ? Backdrop.propTypes /* remove-proptypes *
150
149
  * The extra props for the slot components.
151
150
  * You can override the existing props or add new ones.
152
151
  *
153
- * This prop is an alias for the `slotProps` prop.
154
- * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
152
+ * @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.
155
153
  *
156
154
  * @default {}
157
155
  */
@@ -192,7 +190,6 @@ process.env.NODE_ENV !== "production" ? Backdrop.propTypes /* remove-proptypes *
192
190
  * The component used for the transition.
193
191
  * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
194
192
  * @default Fade
195
- * @deprecated Use `slots.transition` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
196
193
  */
197
194
  TransitionComponent: PropTypes.elementType,
198
195
  /**
package/Badge/Badge.d.ts CHANGED
@@ -162,12 +162,12 @@ export declare const BadgeMark: React.FC<BadgeBadgeProps>;
162
162
  *
163
163
  * Demos:
164
164
  *
165
- * - [Avatar](https://mui.com/material-ui/react-avatar/)
166
- * - [Badge](https://mui.com/material-ui/react-badge/)
165
+ * - [Avatar](https://next.mui.com/material-ui/react-avatar/)
166
+ * - [Badge](https://next.mui.com/material-ui/react-badge/)
167
167
  *
168
168
  * API:
169
169
  *
170
- * - [Badge API](https://mui.com/material-ui/api/badge/)
170
+ * - [Badge API](https://next.mui.com/material-ui/api/badge/)
171
171
  */
172
172
  declare const Badge: OverridableComponent<BadgeTypeMap>;
173
173
 
package/Badge/Badge.js CHANGED
@@ -7,13 +7,13 @@ import usePreviousProps from '@mui/utils/usePreviousProps';
7
7
  import composeClasses from '@mui/utils/composeClasses';
8
8
  import { useBadge } from '@mui/base/useBadge';
9
9
  import { useSlotProps } from '@mui/base/utils';
10
- import { styled, createUseThemeProps } from '../zero-styled';
10
+ import { styled } from '../zero-styled';
11
+ import { useDefaultProps } from '../DefaultPropsProvider';
11
12
  import capitalize from '../utils/capitalize';
12
13
  import badgeClasses, { getBadgeUtilityClass } from './badgeClasses';
13
14
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
14
15
  const RADIUS_STANDARD = 10;
15
16
  const RADIUS_DOT = 4;
16
- const useThemeProps = createUseThemeProps('MuiBadge');
17
17
  const useUtilityClasses = ownerState => {
18
18
  const {
19
19
  color,
@@ -209,7 +209,7 @@ const BadgeBadge = styled('span', {
209
209
  }]
210
210
  }));
211
211
  const Badge = /*#__PURE__*/React.forwardRef(function Badge(inProps, ref) {
212
- const props = useThemeProps({
212
+ const props = useDefaultProps({
213
213
  props: inProps,
214
214
  name: 'MuiBadge'
215
215
  });
@@ -47,11 +47,11 @@ export interface BottomNavigationTypeMap<
47
47
  *
48
48
  * Demos:
49
49
  *
50
- * - [Bottom Navigation](https://mui.com/material-ui/react-bottom-navigation/)
50
+ * - [Bottom Navigation](https://next.mui.com/material-ui/react-bottom-navigation/)
51
51
  *
52
52
  * API:
53
53
  *
54
- * - [BottomNavigation API](https://mui.com/material-ui/api/bottom-navigation/)
54
+ * - [BottomNavigation API](https://next.mui.com/material-ui/api/bottom-navigation/)
55
55
  */
56
56
  declare const BottomNavigation: OverridableComponent<BottomNavigationTypeMap>;
57
57
 
@@ -5,10 +5,10 @@ import { isFragment } from 'react-is';
5
5
  import PropTypes from 'prop-types';
6
6
  import clsx from 'clsx';
7
7
  import composeClasses from '@mui/utils/composeClasses';
8
- import { styled, createUseThemeProps } from '../zero-styled';
8
+ import { styled } from '../zero-styled';
9
+ import { useDefaultProps } from '../DefaultPropsProvider';
9
10
  import { getBottomNavigationUtilityClass } from './bottomNavigationClasses';
10
11
  import { jsx as _jsx } from "react/jsx-runtime";
11
- const useThemeProps = createUseThemeProps('MuiBottomNavigation');
12
12
  const useUtilityClasses = ownerState => {
13
13
  const {
14
14
  classes
@@ -31,7 +31,7 @@ const BottomNavigationRoot = styled('div', {
31
31
  backgroundColor: (theme.vars || theme).palette.background.paper
32
32
  }));
33
33
  const BottomNavigation = /*#__PURE__*/React.forwardRef(function BottomNavigation(inProps, ref) {
34
- const props = useThemeProps({
34
+ const props = useDefaultProps({
35
35
  props: inProps,
36
36
  name: 'MuiBottomNavigation'
37
37
  });
@@ -53,12 +53,12 @@ export type BottomNavigationActionTypeMap<
53
53
  *
54
54
  * Demos:
55
55
  *
56
- * - [Bottom Navigation](https://mui.com/material-ui/react-bottom-navigation/)
56
+ * - [Bottom Navigation](https://next.mui.com/material-ui/react-bottom-navigation/)
57
57
  *
58
58
  * API:
59
59
  *
60
- * - [BottomNavigationAction API](https://mui.com/material-ui/api/bottom-navigation-action/)
61
- * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/)
60
+ * - [BottomNavigationAction API](https://next.mui.com/material-ui/api/bottom-navigation-action/)
61
+ * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/)
62
62
  */
63
63
  declare const BottomNavigationAction: ExtendButtonBase<
64
64
  BottomNavigationActionTypeMap<{}, ButtonBaseTypeMap['defaultComponent']>
@@ -4,12 +4,12 @@ import * as React from 'react';
4
4
  import PropTypes from 'prop-types';
5
5
  import clsx from 'clsx';
6
6
  import composeClasses from '@mui/utils/composeClasses';
7
- import { styled, createUseThemeProps } from '../zero-styled';
7
+ import { styled } from '../zero-styled';
8
+ import { useDefaultProps } from '../DefaultPropsProvider';
8
9
  import ButtonBase from '../ButtonBase';
9
10
  import unsupportedProp from '../utils/unsupportedProp';
10
11
  import bottomNavigationActionClasses, { getBottomNavigationActionUtilityClass } from './bottomNavigationActionClasses';
11
12
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
12
- const useThemeProps = createUseThemeProps('MuiBottomNavigationAction');
13
13
  const useUtilityClasses = ownerState => {
14
14
  const {
15
15
  classes,
@@ -92,7 +92,7 @@ const BottomNavigationActionLabel = styled('span', {
92
92
  }]
93
93
  }));
94
94
  const BottomNavigationAction = /*#__PURE__*/React.forwardRef(function BottomNavigationAction(inProps, ref) {
95
- const props = useThemeProps({
95
+ const props = useDefaultProps({
96
96
  props: inProps,
97
97
  name: 'MuiBottomNavigationAction'
98
98
  });
package/Box/Box.d.ts CHANGED
@@ -7,11 +7,11 @@ import { Theme as MaterialTheme } from '../styles';
7
7
  *
8
8
  * Demos:
9
9
  *
10
- * - [Box](https://mui.com/material-ui/react-box/)
10
+ * - [Box](https://next.mui.com/material-ui/react-box/)
11
11
  *
12
12
  * API:
13
13
  *
14
- * - [Box API](https://mui.com/material-ui/api/box/)
14
+ * - [Box API](https://next.mui.com/material-ui/api/box/)
15
15
  */
16
16
  declare const Box: OverridableComponent<BoxTypeMap<{}, 'div', MaterialTheme>>;
17
17
 
@@ -91,12 +91,12 @@ export interface BreadcrumbsTypeMap<
91
91
  *
92
92
  * Demos:
93
93
  *
94
- * - [Breadcrumbs](https://mui.com/material-ui/react-breadcrumbs/)
94
+ * - [Breadcrumbs](https://next.mui.com/material-ui/react-breadcrumbs/)
95
95
  *
96
96
  * API:
97
97
  *
98
- * - [Breadcrumbs API](https://mui.com/material-ui/api/breadcrumbs/)
99
- * - inherits [Typography API](https://mui.com/material-ui/api/typography/)
98
+ * - [Breadcrumbs API](https://next.mui.com/material-ui/api/breadcrumbs/)
99
+ * - inherits [Typography API](https://next.mui.com/material-ui/api/typography/)
100
100
  */
101
101
  declare const Breadcrumbs: OverridableComponent<BreadcrumbsTypeMap>;
102
102
 
@@ -7,12 +7,12 @@ import clsx from 'clsx';
7
7
  import integerPropType from '@mui/utils/integerPropType';
8
8
  import { useSlotProps } from '@mui/base/utils';
9
9
  import composeClasses from '@mui/utils/composeClasses';
10
- import { styled, createUseThemeProps } from '../zero-styled';
10
+ import { styled } from '../zero-styled';
11
+ import { useDefaultProps } from '../DefaultPropsProvider';
11
12
  import Typography from '../Typography';
12
13
  import BreadcrumbCollapsed from './BreadcrumbCollapsed';
13
14
  import breadcrumbsClasses, { getBreadcrumbsUtilityClass } from './breadcrumbsClasses';
14
15
  import { jsx as _jsx } from "react/jsx-runtime";
15
- const useThemeProps = createUseThemeProps('MuiBreadcrumbs');
16
16
  const useUtilityClasses = ownerState => {
17
17
  const {
18
18
  classes
@@ -72,7 +72,7 @@ function insertSeparators(items, className, separator, ownerState) {
72
72
  }, []);
73
73
  }
74
74
  const Breadcrumbs = /*#__PURE__*/React.forwardRef(function Breadcrumbs(inProps, ref) {
75
- const props = useThemeProps({
75
+ const props = useDefaultProps({
76
76
  props: inProps,
77
77
  name: 'MuiBreadcrumbs'
78
78
  });
@@ -104,20 +104,20 @@ 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
  /**
111
111
  *
112
112
  * Demos:
113
113
  *
114
- * - [Button Group](https://mui.com/material-ui/react-button-group/)
115
- * - [Button](https://mui.com/material-ui/react-button/)
114
+ * - [Button Group](https://next.mui.com/material-ui/react-button-group/)
115
+ * - [Button](https://next.mui.com/material-ui/react-button/)
116
116
  *
117
117
  * API:
118
118
  *
119
- * - [Button API](https://mui.com/material-ui/api/button/)
120
- * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/)
119
+ * - [Button API](https://next.mui.com/material-ui/api/button/)
120
+ * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/)
121
121
  */
122
122
  declare const Button: ExtendButtonBase<ButtonTypeMap>;
123
123
 
package/Button/Button.js CHANGED
@@ -7,14 +7,14 @@ import resolveProps from '@mui/utils/resolveProps';
7
7
  import composeClasses from '@mui/utils/composeClasses';
8
8
  import { alpha } from '@mui/system/colorManipulator';
9
9
  import rootShouldForwardProp from '../styles/rootShouldForwardProp';
10
- import { styled, createUseThemeProps } from '../zero-styled';
10
+ import { styled } from '../zero-styled';
11
+ import { useDefaultProps } from '../DefaultPropsProvider';
11
12
  import ButtonBase from '../ButtonBase';
12
13
  import capitalize from '../utils/capitalize';
13
14
  import buttonClasses, { getButtonUtilityClass } from './buttonClasses';
14
15
  import ButtonGroupContext from '../ButtonGroup/ButtonGroupContext';
15
16
  import ButtonGroupButtonContext from '../ButtonGroup/ButtonGroupButtonContext';
16
17
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
17
- const useThemeProps = createUseThemeProps('MuiButton');
18
18
  const useUtilityClasses = ownerState => {
19
19
  const {
20
20
  color,
@@ -313,7 +313,7 @@ const Button = /*#__PURE__*/React.forwardRef(function Button(inProps, ref) {
313
313
  const contextProps = React.useContext(ButtonGroupContext);
314
314
  const buttonGroupButtonContextPositionClassName = React.useContext(ButtonGroupButtonContext);
315
315
  const resolvedProps = resolveProps(contextProps, inProps);
316
- const props = useThemeProps({
316
+ const props = useDefaultProps({
317
317
  props: resolvedProps,
318
318
  name: 'MuiButton'
319
319
  });
@@ -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
  /**
@@ -115,11 +115,11 @@ export type ExtendButtonBase<TypeMap extends OverridableTypeMap> = ((
115
115
  *
116
116
  * Demos:
117
117
  *
118
- * - [Button](https://mui.com/material-ui/react-button/)
118
+ * - [Button](https://next.mui.com/material-ui/react-button/)
119
119
  *
120
120
  * API:
121
121
  *
122
- * - [ButtonBase API](https://mui.com/material-ui/api/button-base/)
122
+ * - [ButtonBase API](https://next.mui.com/material-ui/api/button-base/)
123
123
  */
124
124
  declare const ButtonBase: ExtendButtonBase<ButtonBaseTypeMap>;
125
125