@mui/material 5.5.3 → 5.6.2

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 (530) hide show
  1. package/Accordion/Accordion.d.ts +4 -4
  2. package/Accordion/Accordion.js +1 -1
  3. package/Accordion/accordionClasses.d.ts +18 -18
  4. package/AccordionActions/AccordionActions.d.ts +2 -2
  5. package/AccordionActions/accordionActionsClasses.d.ts +10 -10
  6. package/AccordionDetails/AccordionDetails.d.ts +2 -2
  7. package/AccordionDetails/accordionDetailsClasses.d.ts +8 -8
  8. package/AccordionSummary/AccordionSummary.d.ts +3 -3
  9. package/AccordionSummary/accordionSummaryClasses.d.ts +22 -22
  10. package/Alert/Alert.d.ts +5 -5
  11. package/Alert/Alert.js +2 -2
  12. package/Alert/alertClasses.d.ts +44 -44
  13. package/AlertTitle/AlertTitle.d.ts +2 -2
  14. package/AlertTitle/alertTitleClasses.d.ts +8 -8
  15. package/AppBar/AppBar.d.ts +4 -4
  16. package/AppBar/AppBar.js +1 -1
  17. package/AppBar/appBarClasses.d.ts +28 -28
  18. package/Autocomplete/Autocomplete.d.ts +8 -8
  19. package/Autocomplete/Autocomplete.js +8 -6
  20. package/Autocomplete/autocompleteClasses.d.ts +54 -54
  21. package/Avatar/Avatar.d.ts +2 -2
  22. package/Avatar/avatarClasses.d.ts +20 -20
  23. package/AvatarGroup/AvatarGroup.d.ts +2 -2
  24. package/AvatarGroup/avatarGroupClasses.d.ts +10 -10
  25. package/Backdrop/Backdrop.d.ts +3 -3
  26. package/Backdrop/backdropClasses.d.ts +10 -10
  27. package/Badge/Badge.d.ts +25 -12
  28. package/Badge/Badge.js +48 -24
  29. package/Badge/badgeClasses.d.ts +24 -0
  30. package/Badge/badgeClasses.js +8 -0
  31. package/Badge/index.d.ts +3 -0
  32. package/Badge/index.js +2 -1
  33. package/BottomNavigation/BottomNavigation.d.ts +2 -2
  34. package/BottomNavigation/BottomNavigation.js +0 -0
  35. package/BottomNavigation/bottomNavigationClasses.d.ts +8 -8
  36. package/BottomNavigationAction/BottomNavigationAction.d.ts +3 -3
  37. package/BottomNavigationAction/bottomNavigationActionClasses.d.ts +14 -14
  38. package/Breadcrumbs/Breadcrumbs.d.ts +3 -3
  39. package/Breadcrumbs/Breadcrumbs.js +1 -1
  40. package/Breadcrumbs/breadcrumbsClasses.d.ts +14 -14
  41. package/Button/Button.d.ts +5 -5
  42. package/Button/Button.js +102 -97
  43. package/Button/buttonClasses.d.ts +76 -76
  44. package/ButtonBase/ButtonBase.d.ts +2 -2
  45. package/ButtonBase/buttonBaseClasses.d.ts +12 -12
  46. package/ButtonBase/touchRippleClasses.d.ts +20 -20
  47. package/ButtonGroup/ButtonGroup.d.ts +3 -3
  48. package/ButtonGroup/ButtonGroup.js +1 -1
  49. package/ButtonGroup/ButtonGroupContext.d.ts +18 -18
  50. package/ButtonGroup/buttonGroupClasses.d.ts +58 -58
  51. package/CHANGELOG.md +210 -32
  52. package/Card/Card.d.ts +3 -3
  53. package/Card/cardClasses.d.ts +8 -8
  54. package/CardActionArea/CardActionArea.d.ts +3 -3
  55. package/CardActionArea/cardActionAreaClasses.d.ts +12 -12
  56. package/CardActions/CardActions.d.ts +2 -2
  57. package/CardActions/cardActionsClasses.d.ts +10 -10
  58. package/CardContent/CardContent.d.ts +2 -2
  59. package/CardContent/cardContentClasses.d.ts +8 -8
  60. package/CardHeader/CardHeader.d.ts +2 -2
  61. package/CardHeader/cardHeaderClasses.d.ts +18 -18
  62. package/CardMedia/CardMedia.d.ts +2 -2
  63. package/CardMedia/cardMediaClasses.d.ts +12 -12
  64. package/Checkbox/Checkbox.d.ts +5 -5
  65. package/Checkbox/Checkbox.js +1 -1
  66. package/Checkbox/checkboxClasses.d.ts +18 -18
  67. package/Chip/Chip.d.ts +3 -3
  68. package/Chip/Chip.js +1 -1
  69. package/Chip/chipClasses.d.ts +80 -80
  70. package/CircularProgress/CircularProgress.d.ts +3 -3
  71. package/CircularProgress/CircularProgress.js +1 -1
  72. package/CircularProgress/circularProgressClasses.d.ts +26 -26
  73. package/ClickAwayListener/index.d.ts +2 -2
  74. package/Collapse/Collapse.d.ts +5 -5
  75. package/Collapse/Collapse.js +1 -1
  76. package/Collapse/collapseClasses.d.ts +18 -18
  77. package/Container/Container.d.ts +2 -2
  78. package/Container/containerClasses.d.ts +22 -22
  79. package/CssBaseline/CssBaseline.d.ts +2 -2
  80. package/Dialog/Dialog.d.ts +6 -5
  81. package/Dialog/Dialog.js +3 -2
  82. package/Dialog/DialogContext.d.ts +6 -6
  83. package/Dialog/dialogClasses.d.ts +36 -36
  84. package/DialogActions/DialogActions.d.ts +2 -2
  85. package/DialogActions/dialogActionsClasses.d.ts +10 -10
  86. package/DialogContent/DialogContent.d.ts +2 -2
  87. package/DialogContent/dialogContentClasses.d.ts +10 -10
  88. package/DialogContentText/DialogContentText.d.ts +3 -3
  89. package/DialogContentText/dialogContentTextClasses.d.ts +8 -8
  90. package/DialogTitle/DialogTitle.d.ts +2 -2
  91. package/DialogTitle/dialogTitleClasses.d.ts +8 -8
  92. package/Divider/Divider.d.ts +3 -3
  93. package/Divider/dividerClasses.d.ts +34 -34
  94. package/Drawer/Drawer.d.ts +6 -6
  95. package/Drawer/Drawer.js +4 -4
  96. package/Drawer/drawerClasses.d.ts +30 -30
  97. package/Fab/Fab.d.ts +4 -4
  98. package/Fab/Fab.js +1 -1
  99. package/Fab/fabClasses.d.ts +26 -26
  100. package/Fade/Fade.d.ts +3 -3
  101. package/Fade/Fade.js +1 -1
  102. package/FilledInput/FilledInput.d.ts +3 -3
  103. package/FilledInput/FilledInput.js +5 -3
  104. package/FilledInput/filledInputClasses.d.ts +40 -40
  105. package/FormControl/FormControl.d.ts +7 -7
  106. package/FormControl/FormControl.js +2 -2
  107. package/FormControl/formControlClasses.d.ts +14 -14
  108. package/FormControlLabel/FormControlLabel.d.ts +4 -4
  109. package/FormControlLabel/formControlLabelClasses.d.ts +20 -20
  110. package/FormGroup/FormGroup.d.ts +3 -3
  111. package/FormGroup/formGroupClasses.d.ts +12 -12
  112. package/FormHelperText/FormHelperText.d.ts +2 -2
  113. package/FormHelperText/formHelperTextClasses.d.ts +22 -22
  114. package/FormLabel/FormLabel.d.ts +5 -5
  115. package/FormLabel/FormLabel.js +1 -1
  116. package/FormLabel/formLabelClasses.d.ts +22 -22
  117. package/GlobalStyles/GlobalStyles.d.ts +2 -2
  118. package/Grid/Grid.d.ts +2 -2
  119. package/Grid/gridClasses.d.ts +48 -48
  120. package/Grow/Grow.d.ts +5 -5
  121. package/Grow/Grow.js +8 -8
  122. package/Hidden/Hidden.d.ts +2 -2
  123. package/Icon/Icon.d.ts +4 -4
  124. package/Icon/Icon.js +1 -1
  125. package/Icon/iconClasses.d.ts +24 -24
  126. package/IconButton/IconButton.d.ts +5 -5
  127. package/IconButton/IconButton.js +2 -2
  128. package/IconButton/iconButtonClasses.d.ts +26 -26
  129. package/ImageList/ImageList.d.ts +2 -2
  130. package/ImageList/imageListClasses.d.ts +16 -16
  131. package/ImageListItem/ImageListItem.d.ts +2 -2
  132. package/ImageListItem/imageListItemClasses.d.ts +18 -18
  133. package/ImageListItemBar/ImageListItemBar.d.ts +2 -2
  134. package/ImageListItemBar/imageListItemBarClasses.d.ts +30 -30
  135. package/Input/Input.d.ts +3 -3
  136. package/Input/Input.js +5 -3
  137. package/Input/inputClasses.d.ts +34 -34
  138. package/InputAdornment/InputAdornment.d.ts +2 -2
  139. package/InputAdornment/inputAdornmentClasses.d.ts +24 -24
  140. package/InputBase/InputBase.d.ts +4 -4
  141. package/InputBase/InputBase.js +2 -2
  142. package/InputBase/inputBaseClasses.d.ts +44 -44
  143. package/InputLabel/InputLabel.d.ts +3 -3
  144. package/InputLabel/InputLabel.js +1 -1
  145. package/InputLabel/inputLabelClasses.d.ts +32 -32
  146. package/LinearProgress/LinearProgress.d.ts +3 -3
  147. package/LinearProgress/LinearProgress.js +1 -1
  148. package/LinearProgress/linearProgressClasses.d.ts +42 -42
  149. package/Link/Link.d.ts +5 -5
  150. package/Link/Link.js +15 -6
  151. package/Link/linkClasses.d.ts +18 -18
  152. package/List/List.d.ts +3 -3
  153. package/List/listClasses.d.ts +14 -14
  154. package/ListItem/ListItem.d.ts +8 -8
  155. package/ListItem/ListItem.js +4 -4
  156. package/ListItem/listItemClasses.d.ts +30 -30
  157. package/ListItemAvatar/ListItemAvatar.d.ts +2 -2
  158. package/ListItemAvatar/listItemAvatarClasses.d.ts +10 -10
  159. package/ListItemButton/ListItemButton.d.ts +3 -3
  160. package/ListItemButton/ListItemButton.js +1 -0
  161. package/ListItemButton/listItemButtonClasses.d.ts +22 -22
  162. package/ListItemIcon/ListItemIcon.d.ts +2 -2
  163. package/ListItemIcon/listItemIconClasses.d.ts +10 -10
  164. package/ListItemSecondaryAction/ListItemSecondaryAction.d.ts +2 -2
  165. package/ListItemSecondaryAction/listItemSecondaryActionClasses.d.ts +10 -10
  166. package/ListItemText/ListItemText.d.ts +2 -2
  167. package/ListItemText/listItemTextClasses.d.ts +18 -18
  168. package/ListSubheader/ListSubheader.d.ts +2 -2
  169. package/ListSubheader/listSubheaderClasses.d.ts +18 -18
  170. package/Menu/Menu.d.ts +6 -6
  171. package/Menu/Menu.js +2 -2
  172. package/Menu/menuClasses.d.ts +12 -12
  173. package/MenuItem/MenuItem.d.ts +3 -3
  174. package/MenuItem/menuItemClasses.d.ts +20 -20
  175. package/MenuList/MenuList.d.ts +4 -4
  176. package/MenuList/MenuList.js +1 -1
  177. package/MobileStepper/MobileStepper.d.ts +3 -3
  178. package/MobileStepper/mobileStepperClasses.d.ts +22 -22
  179. package/Modal/Modal.d.ts +8 -8
  180. package/Modal/Modal.js +7 -6
  181. package/NativeSelect/NativeSelect.d.ts +3 -3
  182. package/NativeSelect/nativeSelectClasses.d.ts +32 -32
  183. package/OutlinedInput/OutlinedInput.d.ts +3 -3
  184. package/OutlinedInput/OutlinedInput.js +2 -2
  185. package/OutlinedInput/outlinedInputClasses.d.ts +36 -36
  186. package/Pagination/Pagination.d.ts +4 -4
  187. package/Pagination/Pagination.js +2 -2
  188. package/Pagination/paginationClasses.d.ts +14 -14
  189. package/PaginationItem/PaginationItem.d.ts +3 -3
  190. package/PaginationItem/PaginationItem.js +1 -1
  191. package/PaginationItem/paginationItemClasses.d.ts +42 -42
  192. package/Paper/Paper.d.ts +3 -3
  193. package/Paper/paperClasses.d.ts +39 -39
  194. package/Popover/Popover.d.ts +6 -6
  195. package/Popover/Popover.js +2 -2
  196. package/Popover/popoverClasses.d.ts +10 -10
  197. package/Popper/Popper.d.ts +29 -29
  198. package/Popper/Popper.js +4 -4
  199. package/README.md +7 -8
  200. package/Radio/Radio.d.ts +4 -4
  201. package/Radio/Radio.js +1 -1
  202. package/Radio/radioClasses.d.ts +16 -16
  203. package/RadioGroup/RadioGroup.d.ts +3 -3
  204. package/RadioGroup/RadioGroupContext.d.ts +11 -11
  205. package/RadioGroup/useRadioGroup.d.ts +4 -4
  206. package/Rating/Rating.d.ts +3 -3
  207. package/Rating/Rating.js +1 -1
  208. package/Rating/ratingClasses.d.ts +40 -40
  209. package/ScopedCssBaseline/ScopedCssBaseline.d.ts +2 -2
  210. package/ScopedCssBaseline/scopedCssBaselineClasses.d.ts +8 -8
  211. package/Select/Select.d.ts +5 -5
  212. package/Select/Select.js +2 -2
  213. package/Select/SelectInput.js +24 -3
  214. package/Select/selectClasses.d.ts +30 -30
  215. package/Skeleton/Skeleton.d.ts +2 -2
  216. package/Skeleton/skeletonClasses.d.ts +24 -24
  217. package/Slide/Slide.d.ts +4 -4
  218. package/Slide/Slide.js +1 -1
  219. package/Slider/Slider.d.ts +4 -4
  220. package/Slider/Slider.js +1 -1
  221. package/Snackbar/Snackbar.d.ts +4 -4
  222. package/Snackbar/Snackbar.js +2 -2
  223. package/Snackbar/snackbarClasses.d.ts +20 -20
  224. package/SnackbarContent/SnackbarContent.d.ts +3 -3
  225. package/SnackbarContent/snackbarContentClasses.d.ts +12 -12
  226. package/SpeedDial/SpeedDial.d.ts +4 -4
  227. package/SpeedDial/SpeedDial.js +2 -2
  228. package/SpeedDial/speedDialClasses.d.ts +22 -22
  229. package/SpeedDialAction/SpeedDialAction.d.ts +5 -5
  230. package/SpeedDialAction/SpeedDialAction.js +2 -2
  231. package/SpeedDialAction/speedDialActionClasses.d.ts +20 -20
  232. package/SpeedDialIcon/SpeedDialIcon.d.ts +2 -2
  233. package/SpeedDialIcon/speedDialIconClasses.d.ts +18 -18
  234. package/Stack/Stack.d.ts +2 -2
  235. package/Step/Step.d.ts +2 -2
  236. package/Step/StepContext.d.ts +20 -20
  237. package/Step/stepClasses.d.ts +16 -16
  238. package/StepButton/StepButton.d.ts +3 -3
  239. package/StepButton/stepButtonClasses.d.ts +14 -14
  240. package/StepConnector/StepConnector.d.ts +2 -2
  241. package/StepConnector/stepConnectorClasses.d.ts +26 -26
  242. package/StepContent/StepContent.d.ts +3 -3
  243. package/StepContent/StepContent.js +1 -1
  244. package/StepContent/stepContentClasses.d.ts +12 -12
  245. package/StepIcon/StepIcon.d.ts +2 -2
  246. package/StepIcon/stepIconClasses.d.ts +16 -16
  247. package/StepLabel/StepLabel.d.ts +4 -4
  248. package/StepLabel/StepLabel.js +2 -2
  249. package/StepLabel/stepLabelClasses.d.ts +28 -28
  250. package/Stepper/Stepper.d.ts +2 -2
  251. package/Stepper/stepperClasses.d.ts +14 -14
  252. package/SvgIcon/SvgIcon.d.ts +4 -4
  253. package/SvgIcon/SvgIcon.js +1 -1
  254. package/SvgIcon/svgIconClasses.d.ts +24 -24
  255. package/SwipeableDrawer/SwipeableDrawer.d.ts +3 -3
  256. package/Switch/Switch.d.ts +5 -5
  257. package/Switch/Switch.js +1 -1
  258. package/Switch/switchClasses.d.ts +32 -32
  259. package/Tab/Tab.d.ts +3 -3
  260. package/Tab/tabClasses.d.ts +26 -26
  261. package/TabScrollButton/TabScrollButton.d.ts +2 -2
  262. package/TabScrollButton/tabScrollButtonClasses.d.ts +12 -12
  263. package/Table/Table.d.ts +2 -2
  264. package/Table/tableClasses.d.ts +10 -10
  265. package/TableBody/TableBody.d.ts +2 -2
  266. package/TableBody/tableBodyClasses.d.ts +8 -8
  267. package/TableCell/TableCell.d.ts +2 -2
  268. package/TableCell/tableCellClasses.d.ts +32 -32
  269. package/TableContainer/TableContainer.d.ts +2 -2
  270. package/TableContainer/tableContainerClasses.d.ts +8 -8
  271. package/TableFooter/TableFooter.d.ts +2 -2
  272. package/TableFooter/tableFooterClasses.d.ts +8 -8
  273. package/TableHead/TableHead.d.ts +2 -2
  274. package/TableHead/tableHeadClasses.d.ts +8 -8
  275. package/TablePagination/TablePagination.d.ts +9 -9
  276. package/TablePagination/TablePagination.js +6 -6
  277. package/TablePagination/TablePaginationActions.d.ts +1 -1
  278. package/TablePagination/TablePaginationActions.js +3 -3
  279. package/TablePagination/tablePaginationClasses.d.ts +28 -28
  280. package/TableRow/TableRow.d.ts +2 -2
  281. package/TableRow/tableRowClasses.d.ts +16 -16
  282. package/TableSortLabel/TableSortLabel.d.ts +3 -3
  283. package/TableSortLabel/tableSortLabelClasses.d.ts +16 -16
  284. package/Tabs/Tabs.d.ts +3 -3
  285. package/Tabs/Tabs.js +1 -1
  286. package/Tabs/tabsClasses.d.ts +32 -32
  287. package/TextField/TextField.d.ts +21 -22
  288. package/TextField/TextField.js +13 -13
  289. package/TextField/textFieldClasses.d.ts +8 -8
  290. package/ToggleButton/ToggleButton.d.ts +4 -4
  291. package/ToggleButton/ToggleButton.js +1 -1
  292. package/ToggleButton/toggleButtonClasses.d.ts +24 -24
  293. package/ToggleButtonGroup/ToggleButtonGroup.d.ts +3 -3
  294. package/ToggleButtonGroup/ToggleButtonGroup.js +1 -1
  295. package/ToggleButtonGroup/toggleButtonGroupClasses.d.ts +18 -18
  296. package/Toolbar/Toolbar.d.ts +2 -2
  297. package/Toolbar/toolbarClasses.d.ts +14 -14
  298. package/Tooltip/Tooltip.d.ts +4 -4
  299. package/Tooltip/Tooltip.js +2 -2
  300. package/Tooltip/tooltipClasses.d.ts +30 -30
  301. package/Typography/Typography.d.ts +3 -3
  302. package/Typography/typographyClasses.d.ts +50 -50
  303. package/Zoom/Zoom.d.ts +3 -3
  304. package/Zoom/Zoom.js +1 -1
  305. package/className/index.d.ts +8 -8
  306. package/darkScrollbar/index.d.ts +28 -28
  307. package/index.js +1 -1
  308. package/internal/switchBaseClasses.d.ts +12 -12
  309. package/legacy/Accordion/Accordion.js +1 -1
  310. package/legacy/Alert/Alert.js +2 -2
  311. package/legacy/AppBar/AppBar.js +1 -1
  312. package/legacy/Autocomplete/Autocomplete.js +8 -6
  313. package/legacy/Badge/Badge.js +49 -24
  314. package/legacy/Badge/badgeClasses.js +8 -0
  315. package/legacy/Badge/index.js +2 -1
  316. package/legacy/BottomNavigation/BottomNavigation.js +0 -0
  317. package/legacy/Breadcrumbs/Breadcrumbs.js +1 -1
  318. package/legacy/Button/Button.js +31 -30
  319. package/legacy/ButtonGroup/ButtonGroup.js +1 -1
  320. package/legacy/Checkbox/Checkbox.js +1 -1
  321. package/legacy/Chip/Chip.js +1 -1
  322. package/legacy/CircularProgress/CircularProgress.js +1 -1
  323. package/legacy/Collapse/Collapse.js +1 -1
  324. package/legacy/Dialog/Dialog.js +3 -2
  325. package/legacy/Drawer/Drawer.js +4 -4
  326. package/legacy/Fab/Fab.js +1 -1
  327. package/legacy/Fade/Fade.js +1 -1
  328. package/legacy/FilledInput/FilledInput.js +5 -3
  329. package/legacy/FormControl/FormControl.js +2 -2
  330. package/legacy/FormLabel/FormLabel.js +1 -1
  331. package/legacy/Grow/Grow.js +8 -8
  332. package/legacy/Icon/Icon.js +1 -1
  333. package/legacy/IconButton/IconButton.js +2 -2
  334. package/legacy/Input/Input.js +5 -3
  335. package/legacy/InputBase/InputBase.js +2 -2
  336. package/legacy/InputLabel/InputLabel.js +1 -1
  337. package/legacy/LinearProgress/LinearProgress.js +1 -1
  338. package/legacy/Link/Link.js +16 -5
  339. package/legacy/ListItem/ListItem.js +4 -4
  340. package/legacy/ListItemButton/ListItemButton.js +1 -0
  341. package/legacy/Menu/Menu.js +2 -2
  342. package/legacy/MenuList/MenuList.js +1 -1
  343. package/legacy/Modal/Modal.js +7 -6
  344. package/legacy/OutlinedInput/OutlinedInput.js +2 -2
  345. package/legacy/Pagination/Pagination.js +2 -2
  346. package/legacy/PaginationItem/PaginationItem.js +1 -1
  347. package/legacy/Popover/Popover.js +2 -2
  348. package/legacy/Popper/Popper.js +4 -4
  349. package/legacy/Radio/Radio.js +1 -1
  350. package/legacy/Rating/Rating.js +1 -1
  351. package/legacy/Select/Select.js +2 -2
  352. package/legacy/Select/SelectInput.js +26 -3
  353. package/legacy/Slide/Slide.js +1 -1
  354. package/legacy/Slider/Slider.js +1 -1
  355. package/legacy/Snackbar/Snackbar.js +2 -2
  356. package/legacy/SpeedDial/SpeedDial.js +2 -2
  357. package/legacy/SpeedDialAction/SpeedDialAction.js +2 -2
  358. package/legacy/StepContent/StepContent.js +1 -1
  359. package/legacy/StepLabel/StepLabel.js +2 -2
  360. package/legacy/SvgIcon/SvgIcon.js +1 -1
  361. package/legacy/Switch/Switch.js +1 -1
  362. package/legacy/TablePagination/TablePagination.js +6 -6
  363. package/legacy/TablePagination/TablePaginationActions.js +3 -3
  364. package/legacy/Tabs/Tabs.js +1 -1
  365. package/legacy/TextField/TextField.js +13 -13
  366. package/legacy/ToggleButton/ToggleButton.js +1 -1
  367. package/legacy/ToggleButtonGroup/ToggleButtonGroup.js +1 -1
  368. package/legacy/Tooltip/Tooltip.js +2 -2
  369. package/legacy/Zoom/Zoom.js +1 -1
  370. package/legacy/index.js +1 -1
  371. package/legacy/locale/index.js +115 -111
  372. package/legacy/styles/CssVarsProvider.js +31 -0
  373. package/legacy/styles/experimental_extendTheme.js +96 -0
  374. package/legacy/styles/index.js +3 -1
  375. package/locale/index.d.ts +71 -71
  376. package/locale/index.js +6 -3
  377. package/modern/Accordion/Accordion.js +1 -1
  378. package/modern/Alert/Alert.js +2 -2
  379. package/modern/AppBar/AppBar.js +1 -1
  380. package/modern/Autocomplete/Autocomplete.js +8 -6
  381. package/modern/Badge/Badge.js +45 -21
  382. package/modern/Badge/badgeClasses.js +8 -0
  383. package/modern/Badge/index.js +2 -1
  384. package/modern/BottomNavigation/BottomNavigation.js +0 -0
  385. package/modern/Breadcrumbs/Breadcrumbs.js +1 -1
  386. package/modern/Button/Button.js +30 -29
  387. package/modern/ButtonGroup/ButtonGroup.js +1 -1
  388. package/modern/Checkbox/Checkbox.js +1 -1
  389. package/modern/Chip/Chip.js +1 -1
  390. package/modern/CircularProgress/CircularProgress.js +1 -1
  391. package/modern/Collapse/Collapse.js +1 -1
  392. package/modern/Dialog/Dialog.js +3 -2
  393. package/modern/Drawer/Drawer.js +4 -4
  394. package/modern/Fab/Fab.js +1 -1
  395. package/modern/Fade/Fade.js +1 -1
  396. package/modern/FilledInput/FilledInput.js +5 -3
  397. package/modern/FormControl/FormControl.js +2 -2
  398. package/modern/FormLabel/FormLabel.js +1 -1
  399. package/modern/Grow/Grow.js +8 -8
  400. package/modern/Icon/Icon.js +1 -1
  401. package/modern/IconButton/IconButton.js +2 -2
  402. package/modern/Input/Input.js +5 -3
  403. package/modern/InputBase/InputBase.js +2 -2
  404. package/modern/InputLabel/InputLabel.js +1 -1
  405. package/modern/LinearProgress/LinearProgress.js +1 -1
  406. package/modern/Link/Link.js +15 -6
  407. package/modern/ListItem/ListItem.js +4 -4
  408. package/modern/ListItemButton/ListItemButton.js +1 -0
  409. package/modern/Menu/Menu.js +2 -2
  410. package/modern/MenuList/MenuList.js +1 -1
  411. package/modern/Modal/Modal.js +7 -6
  412. package/modern/OutlinedInput/OutlinedInput.js +2 -2
  413. package/modern/Pagination/Pagination.js +2 -2
  414. package/modern/PaginationItem/PaginationItem.js +1 -1
  415. package/modern/Popover/Popover.js +2 -2
  416. package/modern/Popper/Popper.js +4 -4
  417. package/modern/Radio/Radio.js +1 -1
  418. package/modern/Rating/Rating.js +1 -1
  419. package/modern/Select/Select.js +2 -2
  420. package/modern/Select/SelectInput.js +24 -3
  421. package/modern/Slide/Slide.js +1 -1
  422. package/modern/Slider/Slider.js +1 -1
  423. package/modern/Snackbar/Snackbar.js +2 -2
  424. package/modern/SpeedDial/SpeedDial.js +2 -2
  425. package/modern/SpeedDialAction/SpeedDialAction.js +2 -2
  426. package/modern/StepContent/StepContent.js +1 -1
  427. package/modern/StepLabel/StepLabel.js +2 -2
  428. package/modern/SvgIcon/SvgIcon.js +1 -1
  429. package/modern/Switch/Switch.js +1 -1
  430. package/modern/TablePagination/TablePagination.js +6 -6
  431. package/modern/TablePagination/TablePaginationActions.js +3 -3
  432. package/modern/Tabs/Tabs.js +1 -1
  433. package/modern/TextField/TextField.js +13 -13
  434. package/modern/ToggleButton/ToggleButton.js +1 -1
  435. package/modern/ToggleButtonGroup/ToggleButtonGroup.js +1 -1
  436. package/modern/Tooltip/Tooltip.js +2 -2
  437. package/modern/Zoom/Zoom.js +1 -1
  438. package/modern/index.js +1 -1
  439. package/modern/locale/index.js +6 -3
  440. package/modern/styles/CssVarsProvider.js +28 -0
  441. package/modern/styles/experimental_extendTheme.js +89 -0
  442. package/modern/styles/index.js +3 -1
  443. package/node/Accordion/Accordion.js +1 -1
  444. package/node/Alert/Alert.js +2 -2
  445. package/node/AppBar/AppBar.js +1 -1
  446. package/node/Autocomplete/Autocomplete.js +8 -6
  447. package/node/Badge/Badge.js +58 -34
  448. package/node/Badge/badgeClasses.js +22 -0
  449. package/node/Badge/index.js +17 -5
  450. package/node/BottomNavigation/BottomNavigation.js +0 -0
  451. package/node/Breadcrumbs/Breadcrumbs.js +1 -1
  452. package/node/Button/Button.js +102 -97
  453. package/node/ButtonGroup/ButtonGroup.js +1 -1
  454. package/node/Checkbox/Checkbox.js +1 -1
  455. package/node/Chip/Chip.js +1 -1
  456. package/node/CircularProgress/CircularProgress.js +1 -1
  457. package/node/Collapse/Collapse.js +1 -1
  458. package/node/Dialog/Dialog.js +3 -2
  459. package/node/Drawer/Drawer.js +4 -4
  460. package/node/Fab/Fab.js +1 -1
  461. package/node/Fade/Fade.js +1 -1
  462. package/node/FilledInput/FilledInput.js +5 -3
  463. package/node/FormControl/FormControl.js +2 -2
  464. package/node/FormLabel/FormLabel.js +1 -1
  465. package/node/Grow/Grow.js +8 -8
  466. package/node/Icon/Icon.js +1 -1
  467. package/node/IconButton/IconButton.js +2 -2
  468. package/node/Input/Input.js +5 -3
  469. package/node/InputBase/InputBase.js +2 -2
  470. package/node/InputLabel/InputLabel.js +1 -1
  471. package/node/LinearProgress/LinearProgress.js +1 -1
  472. package/node/Link/Link.js +16 -6
  473. package/node/ListItem/ListItem.js +4 -4
  474. package/node/ListItemButton/ListItemButton.js +1 -0
  475. package/node/Menu/Menu.js +2 -2
  476. package/node/MenuList/MenuList.js +1 -1
  477. package/node/Modal/Modal.js +7 -6
  478. package/node/OutlinedInput/OutlinedInput.js +2 -2
  479. package/node/Pagination/Pagination.js +2 -2
  480. package/node/PaginationItem/PaginationItem.js +1 -1
  481. package/node/Popover/Popover.js +2 -2
  482. package/node/Popper/Popper.js +4 -4
  483. package/node/Radio/Radio.js +1 -1
  484. package/node/Rating/Rating.js +1 -1
  485. package/node/Select/Select.js +2 -2
  486. package/node/Select/SelectInput.js +24 -3
  487. package/node/Slide/Slide.js +1 -1
  488. package/node/Slider/Slider.js +1 -1
  489. package/node/Snackbar/Snackbar.js +2 -2
  490. package/node/SpeedDial/SpeedDial.js +2 -2
  491. package/node/SpeedDialAction/SpeedDialAction.js +2 -2
  492. package/node/StepContent/StepContent.js +1 -1
  493. package/node/StepLabel/StepLabel.js +2 -2
  494. package/node/SvgIcon/SvgIcon.js +1 -1
  495. package/node/Switch/Switch.js +1 -1
  496. package/node/TablePagination/TablePagination.js +6 -6
  497. package/node/TablePagination/TablePaginationActions.js +3 -3
  498. package/node/Tabs/Tabs.js +1 -1
  499. package/node/TextField/TextField.js +13 -13
  500. package/node/ToggleButton/ToggleButton.js +1 -1
  501. package/node/ToggleButtonGroup/ToggleButtonGroup.js +1 -1
  502. package/node/Tooltip/Tooltip.js +2 -2
  503. package/node/Zoom/Zoom.js +1 -1
  504. package/node/index.js +1 -1
  505. package/node/locale/index.js +6 -3
  506. package/node/styles/CssVarsProvider.js +41 -0
  507. package/node/styles/experimental_extendTheme.js +105 -0
  508. package/node/styles/index.js +58 -0
  509. package/package.json +9 -9
  510. package/styles/CssVarsProvider.d.ts +28 -0
  511. package/styles/CssVarsProvider.js +28 -0
  512. package/styles/ThemeProvider.d.ts +1 -1
  513. package/styles/createPalette.d.ts +26 -0
  514. package/styles/createTheme.d.ts +1 -1
  515. package/styles/experimental_extendTheme.d.ts +90 -0
  516. package/styles/experimental_extendTheme.js +91 -0
  517. package/styles/index.d.ts +5 -0
  518. package/styles/index.js +3 -1
  519. package/transitions/index.d.ts +1 -1
  520. package/transitions/transition.d.ts +13 -13
  521. package/transitions/utils.d.ts +23 -23
  522. package/umd/material-ui.development.js +1297 -438
  523. package/umd/material-ui.production.min.js +21 -21
  524. package/useMediaQuery/useMediaQuery.d.ts +31 -31
  525. package/useTouchRipple/index.d.ts +1 -1
  526. package/useTouchRipple/useTouchRipple.d.ts +28 -28
  527. package/utils/getScrollbarSize.d.ts +2 -2
  528. package/utils/ownerDocument.d.ts +2 -2
  529. package/utils/ownerWindow.d.ts +2 -2
  530. package/utils/setRef.d.ts +2 -2
@@ -1066,9 +1066,12 @@ const etEE = {
1066
1066
 
1067
1067
  return 'Vali eelmine lehekülg';
1068
1068
  },
1069
- labelRowsPerPage: 'Ridu leheküljel:' // labelDisplayedRows: ({ from, to, count }) =>
1070
- // `${from}–${to} / ${count !== -1 ? count : `more than ${to}`}`,
1071
-
1069
+ labelRowsPerPage: 'Ridu leheküljel:',
1070
+ labelDisplayedRows: ({
1071
+ from,
1072
+ to,
1073
+ count
1074
+ }) => `${from}–${to} / ${count !== -1 ? count : `rohkem kui ${to}`}`
1072
1075
  }
1073
1076
  },
1074
1077
  MuiRating: {
@@ -0,0 +1,41 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.useColorScheme = exports.getInitColorSchemeScript = exports.Experimental_CssVarsProvider = void 0;
9
+
10
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
11
+
12
+ var _system = require("@mui/system");
13
+
14
+ var _experimental_extendTheme = _interopRequireDefault(require("./experimental_extendTheme"));
15
+
16
+ var _createTypography = _interopRequireDefault(require("./createTypography"));
17
+
18
+ /* eslint-disable @typescript-eslint/naming-convention */
19
+ const defaultTheme = (0, _experimental_extendTheme.default)();
20
+ const {
21
+ CssVarsProvider: Experimental_CssVarsProvider,
22
+ useColorScheme,
23
+ getInitColorSchemeScript
24
+ } = (0, _system.unstable_createCssVarsProvider)({
25
+ theme: defaultTheme,
26
+ defaultColorScheme: {
27
+ light: 'light',
28
+ dark: 'dark'
29
+ },
30
+ prefix: 'md',
31
+ resolveTheme: theme => {
32
+ const newTheme = (0, _extends2.default)({}, theme, {
33
+ typography: (0, _createTypography.default)(theme.palette, theme.typography)
34
+ });
35
+ return newTheme;
36
+ },
37
+ shouldSkipGeneratingVar: keys => !!keys[0].match(/(typography|mixins|breakpoints|direction|transitions)/)
38
+ });
39
+ exports.getInitColorSchemeScript = getInitColorSchemeScript;
40
+ exports.useColorScheme = useColorScheme;
41
+ exports.Experimental_CssVarsProvider = Experimental_CssVarsProvider;
@@ -0,0 +1,105 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.defaultOpacity = exports.default = void 0;
9
+
10
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
11
+
12
+ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
13
+
14
+ var _utils = require("@mui/utils");
15
+
16
+ var _system = require("@mui/system");
17
+
18
+ var _createTheme = _interopRequireDefault(require("./createTheme"));
19
+
20
+ var _createPalette = _interopRequireDefault(require("./createPalette"));
21
+
22
+ const _excluded = ["colorSchemes", "opacity"],
23
+ _excluded2 = ["palette"];
24
+ const defaultOpacity = {
25
+ active: 0.54,
26
+ hover: 0.04,
27
+ selected: 0.08,
28
+ disabled: 0.26,
29
+ focus: 0.12
30
+ };
31
+ exports.defaultOpacity = defaultOpacity;
32
+
33
+ function createTheme(options = {}, ...args) {
34
+ var _colorSchemesInput$li, _colorSchemesInput$da;
35
+
36
+ const {
37
+ colorSchemes: colorSchemesInput = {},
38
+ opacity: opacityInput = {}
39
+ } = options,
40
+ input = (0, _objectWithoutPropertiesLoose2.default)(options, _excluded); // eslint-disable-next-line prefer-const
41
+
42
+ let _createThemeWithoutVa = (0, _createTheme.default)((0, _extends2.default)({}, input, colorSchemesInput.light && {
43
+ palette: (_colorSchemesInput$li = colorSchemesInput.light) == null ? void 0 : _colorSchemesInput$li.palette
44
+ })),
45
+ {
46
+ palette: lightPalette
47
+ } = _createThemeWithoutVa,
48
+ muiTheme = (0, _objectWithoutPropertiesLoose2.default)(_createThemeWithoutVa, _excluded2);
49
+
50
+ const {
51
+ palette: darkPalette
52
+ } = (0, _createTheme.default)({
53
+ palette: (0, _extends2.default)({
54
+ mode: 'dark'
55
+ }, (_colorSchemesInput$da = colorSchemesInput.dark) == null ? void 0 : _colorSchemesInput$da.palette)
56
+ });
57
+ colorSchemesInput.light = {
58
+ palette: lightPalette
59
+ };
60
+ colorSchemesInput.dark = {
61
+ palette: darkPalette
62
+ };
63
+ const colorSchemes = {};
64
+ Object.keys(colorSchemesInput).forEach(key => {
65
+ const palette = (0, _createPalette.default)(colorSchemesInput[key].palette);
66
+ Object.keys(palette).forEach(color => {
67
+ const colors = palette[color];
68
+
69
+ if (colors.main) {
70
+ palette[color].mainChannel = (0, _system.colorChannel)(colors.main);
71
+ }
72
+
73
+ if (colors.light) {
74
+ palette[color].lightChannel = (0, _system.colorChannel)(colors.light);
75
+ }
76
+
77
+ if (colors.dark) {
78
+ palette[color].darkChannel = (0, _system.colorChannel)(colors.dark);
79
+ }
80
+
81
+ if (colors.primary) {
82
+ palette[color].primaryChannel = (0, _system.colorChannel)(colors.primary);
83
+ }
84
+
85
+ if (colors.secondary) {
86
+ palette[color].secondaryChannel = (0, _system.colorChannel)(colors.secondary);
87
+ }
88
+
89
+ if (colors.disabled) {
90
+ palette[color].disabledChannel = (0, _system.colorChannel)(colors.disabled);
91
+ }
92
+ });
93
+ colorSchemes[key] = {
94
+ palette
95
+ };
96
+ });
97
+ const opacity = (0, _extends2.default)({}, defaultOpacity, opacityInput);
98
+ muiTheme.colorSchemes = colorSchemes;
99
+ muiTheme.opacity = opacity;
100
+ muiTheme = args.reduce((acc, argument) => (0, _utils.deepmerge)(acc, argument), muiTheme);
101
+ return muiTheme;
102
+ }
103
+
104
+ var _default = createTheme;
105
+ exports.default = _default;
@@ -5,6 +5,42 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
+ var _exportNames = {
9
+ adaptV4Theme: true,
10
+ hexToRgb: true,
11
+ rgbToHex: true,
12
+ hslToRgb: true,
13
+ decomposeColor: true,
14
+ recomposeColor: true,
15
+ getContrastRatio: true,
16
+ getLuminance: true,
17
+ emphasize: true,
18
+ alpha: true,
19
+ darken: true,
20
+ lighten: true,
21
+ css: true,
22
+ keyframes: true,
23
+ experimental_sx: true,
24
+ StyledEngineProvider: true,
25
+ createTheme: true,
26
+ createMuiTheme: true,
27
+ unstable_createMuiStrictModeTheme: true,
28
+ createStyles: true,
29
+ unstable_getUnit: true,
30
+ unstable_toUnitless: true,
31
+ responsiveFontSizes: true,
32
+ duration: true,
33
+ easing: true,
34
+ useTheme: true,
35
+ useThemeProps: true,
36
+ styled: true,
37
+ experimentalStyled: true,
38
+ ThemeProvider: true,
39
+ makeStyles: true,
40
+ withStyles: true,
41
+ withTheme: true,
42
+ experimental_extendTheme: true
43
+ };
8
44
  Object.defineProperty(exports, "StyledEngineProvider", {
9
45
  enumerable: true,
10
46
  get: function () {
@@ -89,6 +125,12 @@ Object.defineProperty(exports, "experimentalStyled", {
89
125
  return _styled.default;
90
126
  }
91
127
  });
128
+ Object.defineProperty(exports, "experimental_extendTheme", {
129
+ enumerable: true,
130
+ get: function () {
131
+ return _experimental_extendTheme.default;
132
+ }
133
+ });
92
134
  Object.defineProperty(exports, "experimental_sx", {
93
135
  enumerable: true,
94
136
  get: function () {
@@ -234,6 +276,22 @@ var _withStyles = _interopRequireDefault(require("./withStyles"));
234
276
 
235
277
  var _withTheme = _interopRequireDefault(require("./withTheme"));
236
278
 
279
+ var _CssVarsProvider = require("./CssVarsProvider");
280
+
281
+ Object.keys(_CssVarsProvider).forEach(function (key) {
282
+ if (key === "default" || key === "__esModule") return;
283
+ if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
284
+ if (key in exports && exports[key] === _CssVarsProvider[key]) return;
285
+ Object.defineProperty(exports, key, {
286
+ enumerable: true,
287
+ get: function () {
288
+ return _CssVarsProvider[key];
289
+ }
290
+ });
291
+ });
292
+
293
+ var _experimental_extendTheme = _interopRequireDefault(require("./experimental_extendTheme"));
294
+
237
295
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
238
296
 
239
297
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
package/package.json CHANGED
@@ -1,9 +1,9 @@
1
1
  {
2
2
  "name": "@mui/material",
3
- "version": "5.5.3",
3
+ "version": "5.6.2",
4
4
  "private": false,
5
5
  "author": "MUI Team",
6
- "description": "Quickly build beautiful React apps. MUI is a simple and customizable component library to build faster, beautiful, and more accessible React applications. Follow your own design system, or start with Material Design.",
6
+ "description": "React components that implement Google's Material Design.",
7
7
  "main": "./node/index.js",
8
8
  "keywords": [
9
9
  "react",
@@ -21,7 +21,7 @@
21
21
  "bugs": {
22
22
  "url": "https://github.com/mui/material-ui/issues"
23
23
  },
24
- "homepage": "https://mui.com/",
24
+ "homepage": "https://mui.com/material-ui/getting-started/installation/",
25
25
  "funding": {
26
26
  "type": "opencollective",
27
27
  "url": "https://opencollective.com/mui"
@@ -29,9 +29,9 @@
29
29
  "peerDependencies": {
30
30
  "@emotion/react": "^11.5.0",
31
31
  "@emotion/styled": "^11.3.0",
32
- "@types/react": "^16.8.6 || ^17.0.0",
33
- "react": "^17.0.0",
34
- "react-dom": "^17.0.0"
32
+ "@types/react": "^17.0.0 || ^18.0.0",
33
+ "react": "^17.0.0 || ^18.0.0",
34
+ "react-dom": "^17.0.0 || ^18.0.0"
35
35
  },
36
36
  "peerDependenciesMeta": {
37
37
  "@types/react": {
@@ -46,10 +46,10 @@
46
46
  },
47
47
  "dependencies": {
48
48
  "@babel/runtime": "^7.17.2",
49
- "@mui/base": "5.0.0-alpha.74",
50
- "@mui/system": "^5.5.3",
49
+ "@mui/base": "5.0.0-alpha.77",
50
+ "@mui/system": "^5.6.2",
51
51
  "@mui/types": "^7.1.3",
52
- "@mui/utils": "^5.5.3",
52
+ "@mui/utils": "^5.6.1",
53
53
  "@types/react-transition-group": "^4.4.4",
54
54
  "clsx": "^1.1.1",
55
55
  "csstype": "^3.0.11",
@@ -0,0 +1,28 @@
1
+ /* eslint-disable @typescript-eslint/naming-convention */
2
+ import { CreateCssVarsProviderResult } from '@mui/system';
3
+ import { ThemeOptions, SupportedColorScheme } from './experimental_extendTheme';
4
+ import { PaletteWithChannels } from './createPalette';
5
+
6
+ export interface ThemeInput extends Omit<ThemeOptions, 'colorSchemes'> {
7
+ colorSchemes: Partial<
8
+ Record<
9
+ SupportedColorScheme,
10
+ {
11
+ palette: PaletteWithChannels;
12
+ }
13
+ >
14
+ >;
15
+ }
16
+
17
+ type MDCreateCssVarsProviderResult = CreateCssVarsProviderResult<SupportedColorScheme, ThemeInput>;
18
+
19
+ declare const useColorScheme: MDCreateCssVarsProviderResult['useColorScheme'];
20
+ declare const getInitColorSchemeScript: MDCreateCssVarsProviderResult['getInitColorSchemeScript'];
21
+
22
+ /**
23
+ * This component is an experimental Theme Provider that generates CSS variabels out of the theme tokens.
24
+ * It should preferably be used at **the root of your component tree**.
25
+ */
26
+ declare const Experimental_CssVarsProvider: MDCreateCssVarsProviderResult['CssVarsProvider'];
27
+
28
+ export { useColorScheme, getInitColorSchemeScript, Experimental_CssVarsProvider };
@@ -0,0 +1,28 @@
1
+ import _extends from "@babel/runtime/helpers/esm/extends";
2
+
3
+ /* eslint-disable @typescript-eslint/naming-convention */
4
+ import { unstable_createCssVarsProvider as createCssVarsProvider } from '@mui/system';
5
+ import experimental_extendTheme from './experimental_extendTheme';
6
+ import createTypography from './createTypography';
7
+ const defaultTheme = experimental_extendTheme();
8
+ const {
9
+ CssVarsProvider: Experimental_CssVarsProvider,
10
+ useColorScheme,
11
+ getInitColorSchemeScript
12
+ } = createCssVarsProvider({
13
+ theme: defaultTheme,
14
+ defaultColorScheme: {
15
+ light: 'light',
16
+ dark: 'dark'
17
+ },
18
+ prefix: 'md',
19
+ resolveTheme: theme => {
20
+ const newTheme = _extends({}, theme, {
21
+ typography: createTypography(theme.palette, theme.typography)
22
+ });
23
+
24
+ return newTheme;
25
+ },
26
+ shouldSkipGeneratingVar: keys => !!keys[0].match(/(typography|mixins|breakpoints|direction|transitions)/)
27
+ });
28
+ export { useColorScheme, getInitColorSchemeScript, Experimental_CssVarsProvider };
@@ -10,7 +10,7 @@ export interface ThemeProviderProps<Theme = DefaultTheme> {
10
10
  * It should preferably be used at **the root of your component tree**.
11
11
  * API:
12
12
  *
13
- * - [ThemeProvider API](/customization/theming/#themeprovider)
13
+ * - [ThemeProvider API](/material-ui/customization/theming/#themeprovider)
14
14
  */
15
15
  export default function ThemeProvider<T = DefaultTheme>(
16
16
  props: ThemeProviderProps<T>,
@@ -98,6 +98,32 @@ export interface Palette {
98
98
  augmentColor: (options: PaletteAugmentColorOptions) => PaletteColor;
99
99
  }
100
100
 
101
+ export interface Channels {
102
+ mainChannel: string;
103
+ lightChannel: string;
104
+ darkChannel: string;
105
+ }
106
+
107
+ export interface PaletteWithChannels {
108
+ common: CommonColors;
109
+ mode: PaletteMode;
110
+ contrastThreshold: number;
111
+ tonalOffset: PaletteTonalOffset;
112
+ primary: PaletteColor & Channels;
113
+ secondary: PaletteColor & Channels;
114
+ error: PaletteColor & Channels;
115
+ warning: PaletteColor & Channels;
116
+ info: PaletteColor & Channels;
117
+ success: PaletteColor & Channels;
118
+ grey: Color;
119
+ text: TypeText & { primaryChannel: string; secondaryChannel: string; disabledChannel: string };
120
+ divider: TypeDivider;
121
+ action: TypeAction & { disabledChannel: string };
122
+ background: TypeBackground;
123
+ getContrastText: (background: string) => string;
124
+ augmentColor: (options: PaletteAugmentColorOptions) => PaletteColor;
125
+ }
126
+
101
127
  export type PartialTypeObject = { [P in keyof TypeObject]?: Partial<TypeObject[P]> };
102
128
 
103
129
  export interface PaletteOptions {
@@ -32,7 +32,7 @@ interface BaseTheme extends SystemTheme {
32
32
  export {};
33
33
 
34
34
  /**
35
- * Our [TypeScript guide on theme customization](https://mui.com/guides/typescript/#customization-of-theme) explains in detail how you would add custom properties.
35
+ * Our [TypeScript guide on theme customization](https://mui.com/material-ui/guides/typescript/#customization-of-theme) explains in detail how you would add custom properties.
36
36
  */
37
37
  export interface Theme extends BaseTheme {
38
38
  components?: Components<BaseTheme>;
@@ -0,0 +1,90 @@
1
+ /* eslint-disable @typescript-eslint/naming-convention */
2
+ import { ThemeOptions as SystemThemeOptions, Theme as SystemTheme } from '@mui/system';
3
+ import { OverridableStringUnion } from '@mui/types';
4
+ import { Mixins, MixinsOptions } from './createMixins';
5
+ import { Palette, PaletteOptions } from './createPalette';
6
+ import { Typography, TypographyOptions } from './createTypography';
7
+ import { Shadows } from './shadows';
8
+ import { Transitions, TransitionsOptions } from './createTransitions';
9
+ import { ZIndex, ZIndexOptions } from './zIndex';
10
+ import { Components } from './components';
11
+
12
+ /**
13
+ * default MD color-schemes
14
+ */
15
+ export type DefaultColorScheme = 'light' | 'dark';
16
+
17
+ /**
18
+ * The application can add more color-scheme by extending this interface via module augmentation
19
+ *
20
+ * Ex.
21
+ * declare module @mui/material/styles {
22
+ * interface ColorSchemeOverrides {
23
+ * foo: true;
24
+ * }
25
+ * }
26
+ *
27
+ * // SupportedColorScheme = 'light' | 'dark' | 'foo';
28
+ */
29
+ export interface ColorSchemeOverrides {}
30
+ export type ExtendedColorScheme = OverridableStringUnion<never, ColorSchemeOverrides>;
31
+
32
+ /**
33
+ * All color-schemes that the application has
34
+ */
35
+ export type SupportedColorScheme = DefaultColorScheme | ExtendedColorScheme;
36
+
37
+ export interface ThemeOptions extends Omit<SystemThemeOptions, 'zIndex'> {
38
+ mixins?: MixinsOptions;
39
+ components?: Components<BaseTheme>;
40
+ // palette?: PaletteOptions;
41
+ colorSchemes?: Record<SupportedColorScheme, { palette: PaletteOptions }>;
42
+ shadows?: Shadows;
43
+ transitions?: TransitionsOptions;
44
+ typography?: TypographyOptions | ((palette: Palette) => TypographyOptions);
45
+ zIndex?: ZIndexOptions;
46
+ unstable_strictMode?: boolean;
47
+ opacity?: {
48
+ active?: number;
49
+ hover?: number;
50
+ selected?: number;
51
+ disabled?: number;
52
+ focus?: number;
53
+ };
54
+ }
55
+
56
+ interface BaseTheme extends SystemTheme {
57
+ mixins: Mixins;
58
+ palette: Palette;
59
+ shadows: Shadows;
60
+ transitions: Transitions;
61
+ typography: Typography;
62
+ zIndex: ZIndex;
63
+ unstable_strictMode?: boolean;
64
+ colorSchemes: Record<string, { palette: Palette }>;
65
+ opacity: {
66
+ active: number;
67
+ hover: number;
68
+ selected: number;
69
+ disabled: number;
70
+ focus: number;
71
+ };
72
+ }
73
+
74
+ // shut off automatic exporting for the `BaseTheme` above
75
+ export {};
76
+
77
+ /**
78
+ * Our [TypeScript guide on theme customization](https://mui.com/material-ui/guides/typescript/#customization-of-theme) explains in detail how you would add custom properties.
79
+ */
80
+ export interface Theme extends BaseTheme {
81
+ components?: Components<BaseTheme>;
82
+ }
83
+
84
+ /**
85
+ * Generate a theme base on the options received.
86
+ * @param options Takes an incomplete theme object and adds the missing parts.
87
+ * @param args Deep merge the arguments with the about to be returned theme.
88
+ * @returns A complete, ready-to-use theme object.
89
+ */
90
+ export default function experimental_extendTheme(options?: ThemeOptions, ...args: object[]): Theme;
@@ -0,0 +1,91 @@
1
+ import _extends from "@babel/runtime/helpers/esm/extends";
2
+ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3
+ const _excluded = ["colorSchemes", "opacity"],
4
+ _excluded2 = ["palette"];
5
+ import { deepmerge } from '@mui/utils';
6
+ import { colorChannel } from '@mui/system';
7
+ import createThemeWithoutVars from './createTheme';
8
+ import createPalette from './createPalette';
9
+ export const defaultOpacity = {
10
+ active: 0.54,
11
+ hover: 0.04,
12
+ selected: 0.08,
13
+ disabled: 0.26,
14
+ focus: 0.12
15
+ };
16
+
17
+ function createTheme(options = {}, ...args) {
18
+ var _colorSchemesInput$li, _colorSchemesInput$da;
19
+
20
+ const {
21
+ colorSchemes: colorSchemesInput = {},
22
+ opacity: opacityInput = {}
23
+ } = options,
24
+ input = _objectWithoutPropertiesLoose(options, _excluded); // eslint-disable-next-line prefer-const
25
+
26
+
27
+ let _createThemeWithoutVa = createThemeWithoutVars(_extends({}, input, colorSchemesInput.light && {
28
+ palette: (_colorSchemesInput$li = colorSchemesInput.light) == null ? void 0 : _colorSchemesInput$li.palette
29
+ })),
30
+ {
31
+ palette: lightPalette
32
+ } = _createThemeWithoutVa,
33
+ muiTheme = _objectWithoutPropertiesLoose(_createThemeWithoutVa, _excluded2);
34
+
35
+ const {
36
+ palette: darkPalette
37
+ } = createThemeWithoutVars({
38
+ palette: _extends({
39
+ mode: 'dark'
40
+ }, (_colorSchemesInput$da = colorSchemesInput.dark) == null ? void 0 : _colorSchemesInput$da.palette)
41
+ });
42
+ colorSchemesInput.light = {
43
+ palette: lightPalette
44
+ };
45
+ colorSchemesInput.dark = {
46
+ palette: darkPalette
47
+ };
48
+ const colorSchemes = {};
49
+ Object.keys(colorSchemesInput).forEach(key => {
50
+ const palette = createPalette(colorSchemesInput[key].palette);
51
+ Object.keys(palette).forEach(color => {
52
+ const colors = palette[color];
53
+
54
+ if (colors.main) {
55
+ palette[color].mainChannel = colorChannel(colors.main);
56
+ }
57
+
58
+ if (colors.light) {
59
+ palette[color].lightChannel = colorChannel(colors.light);
60
+ }
61
+
62
+ if (colors.dark) {
63
+ palette[color].darkChannel = colorChannel(colors.dark);
64
+ }
65
+
66
+ if (colors.primary) {
67
+ palette[color].primaryChannel = colorChannel(colors.primary);
68
+ }
69
+
70
+ if (colors.secondary) {
71
+ palette[color].secondaryChannel = colorChannel(colors.secondary);
72
+ }
73
+
74
+ if (colors.disabled) {
75
+ palette[color].disabledChannel = colorChannel(colors.disabled);
76
+ }
77
+ });
78
+ colorSchemes[key] = {
79
+ palette
80
+ };
81
+ });
82
+
83
+ const opacity = _extends({}, defaultOpacity, opacityInput);
84
+
85
+ muiTheme.colorSchemes = colorSchemes;
86
+ muiTheme.opacity = opacity;
87
+ muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
88
+ return muiTheme;
89
+ }
90
+
91
+ export default createTheme;
package/styles/index.d.ts CHANGED
@@ -89,3 +89,8 @@ export interface StyledComponentProps<ClassKey extends string = string> {
89
89
  export { default as makeStyles } from './makeStyles';
90
90
  export { default as withStyles } from './withStyles';
91
91
  export { default as withTheme } from './withTheme';
92
+
93
+ export * from './CssVarsProvider';
94
+
95
+ export { default as experimental_extendTheme } from './experimental_extendTheme';
96
+ export * from './experimental_extendTheme';
package/styles/index.js CHANGED
@@ -16,4 +16,6 @@ export { StyledEngineProvider } from '@mui/system'; // The legacy utilities from
16
16
 
17
17
  export { default as makeStyles } from './makeStyles';
18
18
  export { default as withStyles } from './withStyles';
19
- export { default as withTheme } from './withTheme';
19
+ export { default as withTheme } from './withTheme';
20
+ export * from './CssVarsProvider';
21
+ export { default as experimental_extendTheme } from './experimental_extendTheme';
@@ -1 +1 @@
1
- export * from './transition';
1
+ export * from './transition';
@@ -1,13 +1,13 @@
1
- import { TransitionProps as _TransitionProps, TransitionActions } from 'react-transition-group/Transition';
2
- import * as React from 'react';
3
- export declare type TransitionHandlerKeys = 'onEnter' | 'onEntering' | 'onEntered' | 'onExit' | 'onExiting' | 'onExited';
4
- export declare type TransitionHandlerProps = Pick<_TransitionProps, TransitionHandlerKeys>;
5
- export interface EasingProps {
6
- easing: string | {
7
- enter?: string;
8
- exit?: string;
9
- };
10
- }
11
- export declare type TransitionKeys = 'in' | 'mountOnEnter' | 'unmountOnExit' | 'timeout' | 'easing' | 'addEndListener' | TransitionHandlerKeys;
12
- export interface TransitionProps extends TransitionActions, Partial<Pick<_TransitionProps & EasingProps, TransitionKeys>>, React.HTMLAttributes<HTMLElement> {
13
- }
1
+ import { TransitionProps as _TransitionProps, TransitionActions } from 'react-transition-group/Transition';
2
+ import * as React from 'react';
3
+ export declare type TransitionHandlerKeys = 'onEnter' | 'onEntering' | 'onEntered' | 'onExit' | 'onExiting' | 'onExited';
4
+ export declare type TransitionHandlerProps = Pick<_TransitionProps, TransitionHandlerKeys>;
5
+ export interface EasingProps {
6
+ easing: string | {
7
+ enter?: string;
8
+ exit?: string;
9
+ };
10
+ }
11
+ export declare type TransitionKeys = 'in' | 'mountOnEnter' | 'unmountOnExit' | 'timeout' | 'easing' | 'addEndListener' | TransitionHandlerKeys;
12
+ export interface TransitionProps extends TransitionActions, Partial<Pick<_TransitionProps & EasingProps, TransitionKeys>>, React.HTMLAttributes<HTMLElement> {
13
+ }