@mui/material 5.14.8 → 5.14.9

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 (45) hide show
  1. package/AlertTitle/AlertTitle.d.ts +1 -0
  2. package/Breadcrumbs/Breadcrumbs.d.ts +1 -0
  3. package/Button/Button.js +4 -1
  4. package/ButtonGroup/ButtonGroup.js +86 -54
  5. package/ButtonGroup/ButtonGroupButtonContext.d.ts +6 -0
  6. package/ButtonGroup/ButtonGroupButtonContext.js +9 -0
  7. package/ButtonGroup/buttonGroupClasses.d.ts +6 -0
  8. package/ButtonGroup/buttonGroupClasses.js +1 -1
  9. package/CHANGELOG.md +124 -19
  10. package/DialogTitle/DialogTitle.d.ts +1 -0
  11. package/Modal/Modal.js +1 -1
  12. package/README.md +9 -198
  13. package/Slider/Slider.js +9 -86
  14. package/Tabs/Tabs.js +1 -4
  15. package/index.js +1 -1
  16. package/legacy/Button/Button.js +4 -1
  17. package/legacy/ButtonGroup/ButtonGroup.js +81 -56
  18. package/legacy/ButtonGroup/ButtonGroupButtonContext.js +9 -0
  19. package/legacy/ButtonGroup/buttonGroupClasses.js +1 -1
  20. package/legacy/Modal/Modal.js +3 -1
  21. package/legacy/Slider/Slider.js +9 -86
  22. package/legacy/Tabs/Tabs.js +1 -4
  23. package/legacy/index.js +1 -1
  24. package/legacy/useTouchRipple/useTouchRipple.js +4 -4
  25. package/modern/Button/Button.js +4 -1
  26. package/modern/ButtonGroup/ButtonGroup.js +86 -54
  27. package/modern/ButtonGroup/ButtonGroupButtonContext.js +9 -0
  28. package/modern/ButtonGroup/buttonGroupClasses.js +1 -1
  29. package/modern/Modal/Modal.js +1 -1
  30. package/modern/Slider/Slider.js +9 -86
  31. package/modern/Tabs/Tabs.js +1 -4
  32. package/modern/index.js +1 -1
  33. package/node/Button/Button.js +4 -1
  34. package/node/ButtonGroup/ButtonGroup.js +86 -54
  35. package/node/ButtonGroup/ButtonGroupButtonContext.js +18 -0
  36. package/node/ButtonGroup/buttonGroupClasses.js +1 -1
  37. package/node/Modal/Modal.js +1 -1
  38. package/node/Slider/Slider.js +3 -73
  39. package/node/Tabs/Tabs.js +1 -4
  40. package/node/index.js +1 -1
  41. package/node/useTouchRipple/useTouchRipple.js +4 -4
  42. package/package.json +16 -16
  43. package/umd/material-ui.development.js +209 -232
  44. package/umd/material-ui.production.min.js +18 -18
  45. package/useTouchRipple/useTouchRipple.js +4 -4
package/AlertTitle/AlertTitle.d.ts CHANGED
@@ -27,5 +27,6 @@ export interface AlertTitleProps extends StandardProps<React.HTMLAttributes<HTML
27
27
  * API:
28
28
  *
29
29
  * - [AlertTitle API](https://mui.com/material-ui/api/alert-title/)
30
+ * - inherits [Typography API](https://mui.com/material-ui/api/typography/)
30
31
  */
31
32
  export default function AlertTitle(props: AlertTitleProps): JSX.Element;
package/Breadcrumbs/Breadcrumbs.d.ts CHANGED
@@ -96,6 +96,7 @@ export interface BreadcrumbsTypeMap<
96
96
  * API:
97
97
  *
98
98
  * - [Breadcrumbs API](https://mui.com/material-ui/api/breadcrumbs/)
99
+ * - inherits [Typography API](https://mui.com/material-ui/api/typography/)
99
100
  */
100
101
  declare const Breadcrumbs: OverridableComponent<BreadcrumbsTypeMap>;
101
102
 
package/Button/Button.js CHANGED
@@ -15,6 +15,7 @@ import ButtonBase from '../ButtonBase';
15
15
  import capitalize from '../utils/capitalize';
16
16
  import buttonClasses, { getButtonUtilityClass } from './buttonClasses';
17
17
  import ButtonGroupContext from '../ButtonGroup/ButtonGroupContext';
18
+ import ButtonGroupButtonContext from '../ButtonGroup/ButtonGroupButtonContext';
18
19
  import { jsx as _jsx } from "react/jsx-runtime";
19
20
  import { jsxs as _jsxs } from "react/jsx-runtime";
20
21
  const useUtilityClasses = ownerState => {
@@ -221,6 +222,7 @@ const ButtonEndIcon = styled('span', {
221
222
  const Button = /*#__PURE__*/React.forwardRef(function Button(inProps, ref) {
222
223
  // props priority: `inProps` > `contextProps` > `themeDefaultProps`
223
224
  const contextProps = React.useContext(ButtonGroupContext);
225
+ const buttonGroupButtonContextPositionClassName = React.useContext(ButtonGroupButtonContext);
224
226
  const resolvedProps = resolveProps(contextProps, inProps);
225
227
  const props = useThemeProps({
226
228
  props: resolvedProps,
@@ -265,9 +267,10 @@ const Button = /*#__PURE__*/React.forwardRef(function Button(inProps, ref) {
265
267
  ownerState: ownerState,
266
268
  children: endIconProp
267
269
  });
270
+ const positionClassName = buttonGroupButtonContextPositionClassName || '';
268
271
  return /*#__PURE__*/_jsxs(ButtonRoot, _extends({
269
272
  ownerState: ownerState,
270
- className: clsx(contextProps.className, classes.root, className),
273
+ className: clsx(contextProps.className, classes.root, className, positionClassName),
271
274
  component: component,
272
275
  disabled: disabled,
273
276
  focusRipple: !disableFocusRipple,
package/ButtonGroup/ButtonGroup.js CHANGED
@@ -13,6 +13,7 @@ import styled from '../styles/styled';
13
13
  import useThemeProps from '../styles/useThemeProps';
14
14
  import buttonGroupClasses, { getButtonGroupUtilityClass } from './buttonGroupClasses';
15
15
  import ButtonGroupContext from './ButtonGroupContext';
16
+ import ButtonGroupButtonContext from './ButtonGroupButtonContext';
16
17
  import { jsx as _jsx } from "react/jsx-runtime";
17
18
  const overridesResolver = (props, styles) => {
18
19
  const {
@@ -28,6 +29,12 @@ const overridesResolver = (props, styles) => {
28
29
  [`& .${buttonGroupClasses.grouped}`]: styles[`grouped${capitalize(ownerState.variant)}${capitalize(ownerState.orientation)}`]
29
30
  }, {
30
31
  [`& .${buttonGroupClasses.grouped}`]: styles[`grouped${capitalize(ownerState.variant)}${capitalize(ownerState.color)}`]
32
+ }, {
33
+ [`& .${buttonGroupClasses.firstButton}`]: styles.firstButton
34
+ }, {
35
+ [`& .${buttonGroupClasses.lastButton}`]: styles.lastButton
36
+ }, {
37
+ [`& .${buttonGroupClasses.middleButton}`]: styles.middleButton
31
38
  }, styles.root, styles[ownerState.variant], ownerState.disableElevation === true && styles.disableElevation, ownerState.fullWidth && styles.fullWidth, ownerState.orientation === 'vertical' && styles.vertical];
32
39
  };
33
40
  const useUtilityClasses = ownerState => {
@@ -42,7 +49,10 @@ const useUtilityClasses = ownerState => {
42
49
  } = ownerState;
43
50
  const slots = {
44
51
  root: ['root', variant, orientation === 'vertical' && 'vertical', fullWidth && 'fullWidth', disableElevation && 'disableElevation'],
45
- grouped: ['grouped', `grouped${capitalize(orientation)}`, `grouped${capitalize(variant)}`, `grouped${capitalize(variant)}${capitalize(orientation)}`, `grouped${capitalize(variant)}${capitalize(color)}`, disabled && 'disabled']
52
+ grouped: ['grouped', `grouped${capitalize(orientation)}`, `grouped${capitalize(variant)}`, `grouped${capitalize(variant)}${capitalize(orientation)}`, `grouped${capitalize(variant)}${capitalize(color)}`, disabled && 'disabled'],
53
+ firstButton: ['firstButton'],
54
+ lastButton: ['lastButton'],
55
+ middleButton: ['middleButton']
46
56
  };
47
57
  return composeClasses(slots, getButtonGroupUtilityClass, classes);
48
58
  };
@@ -67,63 +77,63 @@ const ButtonGroupRoot = styled('div', {
67
77
  }, {
68
78
  [`& .${buttonGroupClasses.grouped}`]: _extends({
69
79
  minWidth: 40,
70
- '&:not(:first-of-type)': _extends({}, ownerState.orientation === 'horizontal' && {
71
- borderTopLeftRadius: 0,
72
- borderBottomLeftRadius: 0
73
- }, ownerState.orientation === 'vertical' && {
74
- borderTopRightRadius: 0,
75
- borderTopLeftRadius: 0
76
- }, ownerState.variant === 'outlined' && ownerState.orientation === 'horizontal' && {
77
- marginLeft: -1
78
- }, ownerState.variant === 'outlined' && ownerState.orientation === 'vertical' && {
79
- marginTop: -1
80
- }),
81
- '&:not(:last-of-type)': _extends({}, ownerState.orientation === 'horizontal' && {
82
- borderTopRightRadius: 0,
83
- borderBottomRightRadius: 0
84
- }, ownerState.orientation === 'vertical' && {
85
- borderBottomRightRadius: 0,
86
- borderBottomLeftRadius: 0
87
- }, ownerState.variant === 'text' && ownerState.orientation === 'horizontal' && {
88
- borderRight: theme.vars ? `1px solid rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : `1px solid ${theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'}`,
89
- [`&.${buttonGroupClasses.disabled}`]: {
90
- borderRight: `1px solid ${(theme.vars || theme).palette.action.disabled}`
91
- }
92
- }, ownerState.variant === 'text' && ownerState.orientation === 'vertical' && {
93
- borderBottom: theme.vars ? `1px solid rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : `1px solid ${theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'}`,
94
- [`&.${buttonGroupClasses.disabled}`]: {
95
- borderBottom: `1px solid ${(theme.vars || theme).palette.action.disabled}`
96
- }
97
- }, ownerState.variant === 'text' && ownerState.color !== 'inherit' && {
98
- borderColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / 0.5)` : alpha(theme.palette[ownerState.color].main, 0.5)
99
- }, ownerState.variant === 'outlined' && ownerState.orientation === 'horizontal' && {
100
- borderRightColor: 'transparent'
101
- }, ownerState.variant === 'outlined' && ownerState.orientation === 'vertical' && {
102
- borderBottomColor: 'transparent'
103
- }, ownerState.variant === 'contained' && ownerState.orientation === 'horizontal' && {
104
- borderRight: `1px solid ${(theme.vars || theme).palette.grey[400]}`,
105
- [`&.${buttonGroupClasses.disabled}`]: {
106
- borderRight: `1px solid ${(theme.vars || theme).palette.action.disabled}`
107
- }
108
- }, ownerState.variant === 'contained' && ownerState.orientation === 'vertical' && {
109
- borderBottom: `1px solid ${(theme.vars || theme).palette.grey[400]}`,
110
- [`&.${buttonGroupClasses.disabled}`]: {
111
- borderBottom: `1px solid ${(theme.vars || theme).palette.action.disabled}`
112
- }
113
- }, ownerState.variant === 'contained' && ownerState.color !== 'inherit' && {
114
- borderColor: (theme.vars || theme).palette[ownerState.color].dark
115
- }, {
116
- '&:hover': _extends({}, ownerState.variant === 'outlined' && ownerState.orientation === 'horizontal' && {
117
- borderRightColor: 'currentColor'
118
- }, ownerState.variant === 'outlined' && ownerState.orientation === 'vertical' && {
119
- borderBottomColor: 'currentColor'
120
- })
121
- }),
122
80
  '&:hover': _extends({}, ownerState.variant === 'contained' && {
123
81
  boxShadow: 'none'
124
82
  })
125
83
  }, ownerState.variant === 'contained' && {
126
84
  boxShadow: 'none'
85
+ }),
86
+ [`& .${buttonGroupClasses.firstButton},& .${buttonGroupClasses.middleButton}`]: _extends({}, ownerState.orientation === 'horizontal' && {
87
+ borderTopRightRadius: 0,
88
+ borderBottomRightRadius: 0
89
+ }, ownerState.orientation === 'vertical' && {
90
+ borderBottomRightRadius: 0,
91
+ borderBottomLeftRadius: 0
92
+ }, ownerState.variant === 'text' && ownerState.orientation === 'horizontal' && {
93
+ borderRight: theme.vars ? `1px solid rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : `1px solid ${theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'}`,
94
+ [`&.${buttonGroupClasses.disabled}`]: {
95
+ borderRight: `1px solid ${(theme.vars || theme).palette.action.disabled}`
96
+ }
97
+ }, ownerState.variant === 'text' && ownerState.orientation === 'vertical' && {
98
+ borderBottom: theme.vars ? `1px solid rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : `1px solid ${theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'}`,
99
+ [`&.${buttonGroupClasses.disabled}`]: {
100
+ borderBottom: `1px solid ${(theme.vars || theme).palette.action.disabled}`
101
+ }
102
+ }, ownerState.variant === 'text' && ownerState.color !== 'inherit' && {
103
+ borderColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / 0.5)` : alpha(theme.palette[ownerState.color].main, 0.5)
104
+ }, ownerState.variant === 'outlined' && ownerState.orientation === 'horizontal' && {
105
+ borderRightColor: 'transparent'
106
+ }, ownerState.variant === 'outlined' && ownerState.orientation === 'vertical' && {
107
+ borderBottomColor: 'transparent'
108
+ }, ownerState.variant === 'contained' && ownerState.orientation === 'horizontal' && {
109
+ borderRight: `1px solid ${(theme.vars || theme).palette.grey[400]}`,
110
+ [`&.${buttonGroupClasses.disabled}`]: {
111
+ borderRight: `1px solid ${(theme.vars || theme).palette.action.disabled}`
112
+ }
113
+ }, ownerState.variant === 'contained' && ownerState.orientation === 'vertical' && {
114
+ borderBottom: `1px solid ${(theme.vars || theme).palette.grey[400]}`,
115
+ [`&.${buttonGroupClasses.disabled}`]: {
116
+ borderBottom: `1px solid ${(theme.vars || theme).palette.action.disabled}`
117
+ }
118
+ }, ownerState.variant === 'contained' && ownerState.color !== 'inherit' && {
119
+ borderColor: (theme.vars || theme).palette[ownerState.color].dark
120
+ }, {
121
+ '&:hover': _extends({}, ownerState.variant === 'outlined' && ownerState.orientation === 'horizontal' && {
122
+ borderRightColor: 'currentColor'
123
+ }, ownerState.variant === 'outlined' && ownerState.orientation === 'vertical' && {
124
+ borderBottomColor: 'currentColor'
125
+ })
126
+ }),
127
+ [`& .${buttonGroupClasses.lastButton},& .${buttonGroupClasses.middleButton}`]: _extends({}, ownerState.orientation === 'horizontal' && {
128
+ borderTopLeftRadius: 0,
129
+ borderBottomLeftRadius: 0
130
+ }, ownerState.orientation === 'vertical' && {
131
+ borderTopRightRadius: 0,
132
+ borderTopLeftRadius: 0
133
+ }, ownerState.variant === 'outlined' && ownerState.orientation === 'horizontal' && {
134
+ marginLeft: -1
135
+ }, ownerState.variant === 'outlined' && ownerState.orientation === 'vertical' && {
136
+ marginTop: -1
127
137
  })
128
138
  }));
129
139
  const ButtonGroup = /*#__PURE__*/React.forwardRef(function ButtonGroup(inProps, ref) {
@@ -170,6 +180,20 @@ const ButtonGroup = /*#__PURE__*/React.forwardRef(function ButtonGroup(inProps,
170
180
  size,
171
181
  variant
172
182
  }), [color, disabled, disableElevation, disableFocusRipple, disableRipple, fullWidth, size, variant, classes.grouped]);
183
+ const getButtonPositionClassName = (index, childrenParam) => {
184
+ const isFirstButton = index === 0;
185
+ const isLastButton = index === React.Children.count(childrenParam) - 1;
186
+ if (isFirstButton && isLastButton) {
187
+ return '';
188
+ }
189
+ if (isFirstButton) {
190
+ return classes.firstButton;
191
+ }
192
+ if (isLastButton) {
193
+ return classes.lastButton;
194
+ }
195
+ return classes.middleButton;
196
+ };
173
197
  return /*#__PURE__*/_jsx(ButtonGroupRoot, _extends({
174
198
  as: component,
175
199
  role: "group",
@@ -179,7 +203,15 @@ const ButtonGroup = /*#__PURE__*/React.forwardRef(function ButtonGroup(inProps,
179
203
  }, other, {
180
204
  children: /*#__PURE__*/_jsx(ButtonGroupContext.Provider, {
181
205
  value: context,
182
- children: children
206
+ children: React.Children.map(children, (child, index) => {
207
+ if (! /*#__PURE__*/React.isValidElement(child)) {
208
+ return child;
209
+ }
210
+ return /*#__PURE__*/_jsx(ButtonGroupButtonContext.Provider, {
211
+ value: getButtonPositionClassName(index, children),
212
+ children: child
213
+ });
214
+ })
183
215
  })
184
216
  }));
185
217
  });
package/ButtonGroup/ButtonGroupButtonContext.d.ts ADDED
@@ -0,0 +1,6 @@
1
+ import * as React from 'react';
2
+ /**
3
+ * @ignore - internal component.
4
+ */
5
+ declare const ButtonGroupButtonContext: React.Context<string | undefined>;
6
+ export default ButtonGroupButtonContext;
package/ButtonGroup/ButtonGroupButtonContext.js ADDED
@@ -0,0 +1,9 @@
1
+ import * as React from 'react';
2
+ /**
3
+ * @ignore - internal component.
4
+ */
5
+ const ButtonGroupButtonContext = /*#__PURE__*/React.createContext(undefined);
6
+ if (process.env.NODE_ENV !== 'production') {
7
+ ButtonGroupButtonContext.displayName = 'ButtonGroupButtonContext';
8
+ }
9
+ export default ButtonGroupButtonContext;
package/ButtonGroup/buttonGroupClasses.d.ts CHANGED
@@ -11,6 +11,8 @@ export interface ButtonGroupClasses {
11
11
  disableElevation: string;
12
12
  /** State class applied to the child elements if `disabled={true}`. */
13
13
  disabled: string;
14
+ /** Styles applied to the first button in the button group. */
15
+ firstButton: string;
14
16
  /** Styles applied to the root element if `fullWidth={true}`. */
15
17
  fullWidth: string;
16
18
  /** Styles applied to the root element if `orientation="vertical"`. */
@@ -51,6 +53,10 @@ export interface ButtonGroupClasses {
51
53
  groupedContainedPrimary: string;
52
54
  /** Styles applied to the children if `variant="contained"` and `color="secondary"`. */
53
55
  groupedContainedSecondary: string;
56
+ /** Styles applied to the last button in the button group. */
57
+ lastButton: string;
58
+ /** Styles applied to buttons in the middle of the button group. */
59
+ middleButton: string;
54
60
  }
55
61
  export type ButtonGroupClassKey = keyof ButtonGroupClasses;
56
62
  export declare function getButtonGroupUtilityClass(slot: string): string;
package/ButtonGroup/buttonGroupClasses.js CHANGED
@@ -3,5 +3,5 @@ import generateUtilityClass from '../generateUtilityClass';
3
3
  export function getButtonGroupUtilityClass(slot) {
4
4
  return generateUtilityClass('MuiButtonGroup', slot);
5
5
  }
6
- const buttonGroupClasses = generateUtilityClasses('MuiButtonGroup', ['root', 'contained', 'outlined', 'text', 'disableElevation', 'disabled', 'fullWidth', 'vertical', 'grouped', 'groupedHorizontal', 'groupedVertical', 'groupedText', 'groupedTextHorizontal', 'groupedTextVertical', 'groupedTextPrimary', 'groupedTextSecondary', 'groupedOutlined', 'groupedOutlinedHorizontal', 'groupedOutlinedVertical', 'groupedOutlinedPrimary', 'groupedOutlinedSecondary', 'groupedContained', 'groupedContainedHorizontal', 'groupedContainedVertical', 'groupedContainedPrimary', 'groupedContainedSecondary']);
6
+ const buttonGroupClasses = generateUtilityClasses('MuiButtonGroup', ['root', 'contained', 'outlined', 'text', 'disableElevation', 'disabled', 'firstButton', 'fullWidth', 'vertical', 'grouped', 'groupedHorizontal', 'groupedVertical', 'groupedText', 'groupedTextHorizontal', 'groupedTextVertical', 'groupedTextPrimary', 'groupedTextSecondary', 'groupedOutlined', 'groupedOutlinedHorizontal', 'groupedOutlinedVertical', 'groupedOutlinedPrimary', 'groupedOutlinedSecondary', 'groupedContained', 'groupedContainedHorizontal', 'groupedContainedVertical', 'groupedContainedPrimary', 'groupedContainedSecondary', 'lastButton', 'middleButton']);
7
7
  export default buttonGroupClasses;
package/CHANGELOG.md CHANGED
@@ -1,5 +1,110 @@
1
1
  # [Versions](https://mui.com/versions/)
2
2
 
3
+ ## 5.14.9
4
+
5
+ <!-- generated comparing v5.14.8..master -->
6
+
7
+ _Sep 13, 2023_
8
+
9
+ A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨:
10
+
11
+ - 🎉 Added the [`Drawer` component](https://mui.com/joy-ui/react-drawer/) to Joy UI (#38169) @mnajdova
12
+ - ✨ Material UI's [`ButtonGroup` component](https://mui.com/material-ui/react-button-group/) now styles button elements within it correctly (#38520) @ZeeshanTamboli
13
+
14
+ ### `@mui/material@5.14.9`
15
+
16
+ - &#8203;<!-- 44 -->[ButtonGroup] Determine first, last and middle buttons to support different elements with correct styling (#38520) @ZeeshanTamboli
17
+ - &#8203;<!-- 07 -->[Modal] Fix console warning when onTransitionEnter , onTransitionExit provided (#38868) @sai6855
18
+ - &#8203;<!-- 54 -->Revert "[Autocomplete] Type multiple values with readonly arrays." (#38827) @mnajdova
19
+ - &#8203;<!-- 57 -->[Tabs] Scrollable tabs shouldn't crash when customizing their styles in the theme with slot callbacks (#38544) @brentertz
20
+ - &#8203;<!-- 59 -->[AlertTitle][BreadCrumbs] Fix inheritance message in docs (#38876) @sai6855
21
+
22
+ ### `@mui/base@5.0.0-beta.15`
23
+
24
+ - &#8203;<!-- 63 -->[useSnackbar] Align externalProps handling (#38935) @mj12albert
25
+ - &#8203;<!-- 48 -->[useInput] Align ExternalProps naming (#38849) @mj12albert
26
+ - &#8203;<!-- 13 -->[FocusTrap] Refactor & cleanup (#38878) @mnajdova
27
+ - &#8203;<!-- 12 -->[FocusTrap] Fix `disableEnforceFocus` behavior (#38816) @mnajdova
28
+ - &#8203;<!-- 06 -->[Switch] Simplify source (#38910) @oliviertassinari
29
+
30
+ ### `@mui/joy@5.0.0-beta.6`
31
+
32
+ - &#8203;<!-- 15 -->[Drawer] Add Drawer component (#38169) @mnajdova
33
+ - &#8203;<!-- 11 -->Reduce height of some variants (#38527) @zanivan
34
+ - &#8203;<!-- 10 -->Refine the default theme color palette (#38416) @zanivan
35
+ - &#8203;<!-- 34 -->[Dialog] Add `DialogActions`, `DialogTitle` and `DialogContent` (#38382) @siriwatknp
36
+ - &#8203;<!-- 60 -->[AccordionGroup] Add missing `variant` and `color` classes (#38814) @sai6855
37
+
38
+ ### `@mui/lab@5.0.0-alpha.144`
39
+
40
+ - &#8203;<!-- 09 -->Add TypeScript deprecations (#38833) @oliviertassinari
41
+ - &#8203;<!-- 08 -->Fix `@mui/x-tree-view` dependency (#38822) @flaviendelangle
42
+
43
+ ### `@mui/system@5.14.9`
44
+
45
+ - &#8203;<!-- 05 -->Remove dead code (#38884) @oliviertassinari
46
+ - &#8203;<!-- 04 -->Remove getInitColorSchemeScript leading spaces (#38794) @oliviertassinari
47
+
48
+ ### `@mui/zero-vite-plugin@0.0.1-alpha.0`
49
+
50
+ - &#8203;<!-- 02 -->[vite] Create a package for vite plugin (#38685) @brijeshb42
51
+
52
+ ### Docs
53
+
54
+ - &#8203;<!-- 53 -->[docs][base-ui] Improve recommended usage guide (#38570) @oliviertassinari
55
+ - &#8203;<!-- 52 -->[docs][base-ui] Create hooks contribution guide (#38679) @michaldudak
56
+ - &#8203;<!-- 51 -->[docs][base-ui] Structure and style revisions for Component docs (#38826) @samuelsycamore
57
+ - &#8203;<!-- 50 -->[docs][base-ui] Add Number Input to the all components page (#38839) @danilo-leal
58
+ - &#8203;<!-- 49 -->[docs][base-ui] Mark Popup with the Preview tag (#38851) @michaldudak
59
+ - &#8203;<!-- 47 -->[blog] Polish component reference name @oliviertassinari
60
+ - &#8203;<!-- 46 -->[blog] Fix missing card (#38834) @oliviertassinari
61
+ - &#8203;<!-- 45 -->[Button][docs][material-ui] Update the file upload demo (#38823) @danilo-leal
62
+ - &#8203;<!-- 33 -->[docs][DialogTitle] Fix props docs doesn't mention it extends `Typography` props (#38856) @sai6855
63
+ - &#8203;<!-- 32 -->[docs] Improve npm experience (#38906) @oliviertassinari
64
+ - &#8203;<!-- 31 -->[docs] Fix redirection to Base UI URLs @oliviertassinari
65
+ - &#8203;<!-- 30 -->[docs] Fix use of callouts (#38747) @oliviertassinari
66
+ - &#8203;<!-- 29 -->[docs] Fix 301 links for SEO @oliviertassinari
67
+ - &#8203;<!-- 28 -->[docs] Remove flag from installation page @oliviertassinari
68
+ - &#8203;<!-- 27 -->[docs] Fix strange break line on mobile in between product name @oliviertassinari
69
+ - &#8203;<!-- 26 -->[docs] Clearer npm package homepages (#38864) @oliviertassinari
70
+ - &#8203;<!-- 25 -->[docs] enableColorScheme prop was removed (#38795) @oliviertassinari
71
+ - &#8203;<!-- 24 -->[docs] Fix a11y issues in tables demos (#38829) @michaldudak
72
+ - &#8203;<!-- 62 -->[docs][joy-ui] Refine the Messages template (#38807) @zanivan
73
+ - &#8203;<!-- 22 -->[docs][joy-ui] Fix copy on the Tutorial page (#38907) @danilo-leal
74
+ - &#8203;<!-- 21 -->[docs][joy-ui] Fix grammar and update Usage section in color inversion page (#38850) @ZeeshanTamboli
75
+ - &#8203;<!-- 20 -->[docs][joy-ui] Revise the Lists page (#36324) @LadyBluenotes
76
+ - &#8203;<!-- 19 -->[docs][joy-ui] Refine the Profile Dashboard template (#38599) @zanivan
77
+ - &#8203;<!-- 18 -->[docs][material-ui] Revise the Paper component docs (#38841) @danilo-leal
78
+ - &#8203;<!-- 17 -->[docs][material-ui] Revise the Typography page (#38543) @danilo-leal
79
+ - &#8203;<!-- 16 -->[docs][material-ui] Revise and split up "Styled engine" doc (#37774) @samuelsycamore
80
+ - &#8203;<!-- 03 -->[TextareaAutosize][docs] Fix component creation in render (#38577) @oliviertassinari
81
+
82
+ ### Examples
83
+
84
+ - &#8203;<!-- 14 -->[examples] Add shortcut to open example in online IDE (#38572) @oliviertassinari
85
+ - &#8203;<!-- 61 -->[examples][base-ui] Add Base UI + Vite + Tailwind CSS example in TypeScript (#37595) @dvkam
86
+
87
+ ### Core
88
+
89
+ - &#8203;<!-- 65 -->[core] Remove package declaration from same package dependencies (#38951) @DiegoAndai
90
+ - &#8203;<!-- 64 -->[core] Remove workspace dependencies from root package.json (#38940) @michaldudak
91
+ - &#8203;<!-- 43 -->[core] Fix prop-types generation (#38831) @flaviendelangle
92
+ - &#8203;<!-- 42 -->[core] Move types packages to docs' devDependencies (#38914) @michaldudak
93
+ - &#8203;<!-- 41 -->[core] Improve DX when browsing the package on npm and GitHub @oliviertassinari
94
+ - &#8203;<!-- 40 -->[core] TrapFocus was renamed to FocusTrap @oliviertassinari
95
+ - &#8203;<!-- 39 -->[core] Add types extension for clarity @oliviertassinari
96
+ - &#8203;<!-- 38 -->[core] Hoist rewriteImportPaths to parent scope @oliviertassinari
97
+ - &#8203;<!-- 37 -->[core] Bump aws-cli orb to 4.1 (#38857) @Janpot
98
+ - &#8203;<!-- 36 -->[core] Explicitly define package dependencies (#38859) @michaldudak
99
+ - &#8203;<!-- 35 -->[core] Fix yarn docs:create-playground script @oliviertassinari
100
+ - &#8203;<!-- 56 -->[docs-infra] Improve show code button affordance (#38824) @danilo-leal
101
+ - &#8203;<!-- 55 -->[docs–infra] Fix callout container width (#38880) @oliviertassinari
102
+ - &#8203;<!-- 23 -->[docs-infra] Catch duplicated trailing splashes in links (#38758) @oliviertassinari
103
+ - &#8203;<!-- 01 -->[website] add Michel Engelen to the about us page (#38818) @michelengelen
104
+ - &#8203;<!-- 58 -->[website] Add a templates & design kits section to the Material UI page (#38617) @danilo-leal
105
+
106
+ All contributors of this release in alphabetical order: @brentertz, @brijeshb42, @danilo-leal, @DiegoAndai, @dvkam, @flaviendelangle, @Janpot, @LadyBluenotes, @michaldudak, @michelengelen, @mj12albert, @mnajdova, @oliviertassinari, @sai6855, @samuelsycamore, @siriwatknp, @zanivan, @ZeeshanTamboli
107
+
3
108
  ## 5.14.8
4
109
 
5
110
  <!-- generated comparing v5.14.7..master -->
@@ -670,7 +775,7 @@ _Jul 11, 2023_
670
775
 
671
776
  A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨:
672
777
 
673
- - 💫 Material UI, Joy UI, and Base UI are compatible with [NextJS App Router](https://nextjs.org/docs/app) (#37656) @mj12albert
778
+ - 💫 Material UI, Joy UI, and Base UI are compatible with [Next.js App Router](https://nextjs.org/docs/app) (#37656) @mj12albert
674
779
  - 📚 Added new guides for integrating with Next.js 13 App Router (#37656) @mj12albert
675
780
  - Ⓜ️ [Material UI guide](https://mui.com/material-ui/guides/next-js-app-router/)
676
781
  - 🅙 [Joy UI guide](https://mui.com/joy-ui/integrations/next-js-app-router/)
@@ -1471,7 +1576,7 @@ _Apr 11, 2023_
1471
1576
 
1472
1577
  A big thanks to the 9 contributors who made this release possible. Here are some highlights ✨:
1473
1578
 
1474
- - 💫 Added [theme scope](https://mui.com/material-ui/guides/styled-engine/#theme-scoping) for using multiple design systems (#36664) @siriwatknp
1579
+ - 💫 Added [theme scope](https://mui.com/material-ui/guides/theme-scoping/) for using multiple design systems (#36664) @siriwatknp
1475
1580
  - 🐛 bug fixes and 📚 documentation improvements.
1476
1581
 
1477
1582
  ### `@mui/system@5.12.0`
@@ -1959,7 +2064,7 @@ A big thanks to the 15 contributors who made this release possible. Here are som
1959
2064
  - &#8203;<!-- 20 -->[docs][joy] List slots in API documentation (#36271) @hbjORbj
1960
2065
  - &#8203;<!-- 19 -->[docs][joy] Build API documentations (#36008) @hbjORbj
1961
2066
  - &#8203;<!-- 18 -->[examples] Update Next.js examples to use built-in font (#36315) @Juneezee
1962
- - &#8203;<!-- 17 -->[examples] Update curl link in `material-next-ts-v4-v5-migration` example README (#36321) @ZeeshanTamboli
2067
+ - &#8203;<!-- 17 -->[examples] Update curl link in `material-ui-nextjs-ts-v4-v5-migration` example README (#36321) @ZeeshanTamboli
1963
2068
  - &#8203;<!-- 16 -->[examples] Convert Next.js \_document class components to function components (#36109) @ossan-engineer
1964
2069
 
1965
2070
  ### Core
@@ -3217,7 +3322,7 @@ A big thanks to the 7 contributors who made this release possible. Here are some
3217
3322
 
3218
3323
  ### `@mui/base@5.0.0-alpha.101`
3219
3324
 
3220
- - &#8203;<!-- 01 -->[TrapFocus] Restore the previously exported type from @mui/material (#34601) @michaldudak
3325
+ - &#8203;<!-- 01 -->[FocusTrap] Restore the previously exported type from @mui/material (#34601) @michaldudak
3221
3326
 
3222
3327
  ### `@mui/joy@5.0.0-alpha.49`
3223
3328
 
@@ -3333,7 +3438,7 @@ A big thanks to the 21 contributors who made this release possible. Here are som
3333
3438
 
3334
3439
  #### Breaking changes
3335
3440
 
3336
- - [TrapFocus] Rename TrapFocus to FocusTrap (#34216) @kabernardes
3441
+ - [FocusTrap] Rename TrapFocus to FocusTrap (#34216) @kabernardes
3337
3442
 
3338
3443
  ```diff
3339
3444
  -import TrapFocus from '@mui/base/TrapFocus';
@@ -3575,7 +3680,7 @@ A big thanks to the 16 contributors who made this release possible. Here are som
3575
3680
 
3576
3681
  - [Button][base] Prevent too many ref updates (#33882) @michaldudak
3577
3682
  - [Select][base] Fix typo in listbox blur event handler (#34120) @ZeeshanTamboli
3578
- - [TrapFocus] Improve tab test and simplify demo (#34008) @EthanStandel
3683
+ - [FocusTrap] Improve tab test and simplify demo (#34008) @EthanStandel
3579
3684
 
3580
3685
  ### `@mui/joy@5.0.0-alpha.43`
3581
3686
 
@@ -3681,7 +3786,7 @@ A big thanks to the 18 contributors who made this release possible. This release
3681
3786
 
3682
3787
  ### `@mui/base@5.0.0-alpha.93`
3683
3788
 
3684
- - &#8203;<!-- 31 -->[TrapFocus] Removes invisible tabbable elements from (#33543) @EthanStandel
3789
+ - &#8203;<!-- 31 -->[FocusTrap] Removes invisible tabbable elements from (#33543) @EthanStandel
3685
3790
  - &#8203;<!-- 30 -->[Input][base] Pass the rows prop to the underlying textarea (#33873) @michaldudak
3686
3791
  - &#8203;<!-- 06 -->[SelectUnstyled] Add ability to post the select's value when submitting a form (#33697) @michaldudak
3687
3792
 
@@ -5026,7 +5131,7 @@ A big thanks to the 17 contributors who made this release possible. Here are som
5026
5131
  );
5027
5132
  ```
5028
5133
 
5029
- - &#8203;<!-- 03 -->[TrapFocus] Move docs to Base and drop the Unstyled prefix (#31954) @michaldudak
5134
+ - &#8203;<!-- 03 -->[FocusTrap] Move docs to Base and drop the Unstyled prefix (#31954) @michaldudak
5030
5135
 
5031
5136
  Removed the `Unstyled_` prefix from the Base export (it remains in the Material UI export, though).
5032
5137
 
@@ -7993,7 +8098,7 @@ A big thanks to the 11 contributors who made this release possible. Here are som
7993
8098
  ### `@material-ui/unstyled@5.0.0-alpha.37`
7994
8099
 
7995
8100
  - &#8203;<!-- 04 -->[Slider] Improve TS definition (#26642) @mnajdova
7996
- - &#8203;<!-- 21 -->[TrapFocus] Capture nodeToRestore via relatedTarget (#26696) @eps1lon
8101
+ - &#8203;<!-- 21 -->[FocusTrap] Capture nodeToRestore via relatedTarget (#26696) @eps1lon
7997
8102
 
7998
8103
  ### `@material-ui/icons@5.0.0-alpha.37`
7999
8104
 
@@ -9063,7 +9168,7 @@ A big thanks to the 19 contributors who made this release possible. Here are som
9063
9168
  - &#8203;<!-- 28 -->[Timeline] Migrate TimelineContent to emotion (#25781) @siriwatknp
9064
9169
  - &#8203;<!-- 53 -->[Timeline] Migrate TimelineItem to emotion (#25822) @vicasas
9065
9170
  - &#8203;<!-- 47 -->[Timeline] Migrate TimelineOppositeContent to emotion (#25816) @vicasas
9066
- - &#8203;<!-- 54 -->[TrapFocus] Make isEnabled and getDoc optional (#25784) @m4theushw
9171
+ - &#8203;<!-- 54 -->[FocusTrap] Make isEnabled and getDoc optional (#25784) @m4theushw
9067
9172
 
9068
9173
  ### `@material-ui/styled-engine@5.0.0-alpha.31`
9069
9174
 
@@ -9545,7 +9650,7 @@ A big thanks to the 26 contributors who made this release possible. Here are som
9545
9650
  ### `@material-ui/unstyled@5.0.0-alpha.26`
9546
9651
 
9547
9652
  - &#8203;<!-- 033 -->[Portal] Migrate to unstyled (#24890) @povilass
9548
- - &#8203;<!-- 047 -->[TrapFocus] Migrate to unstyled (#24957) @povilass
9653
+ - &#8203;<!-- 047 -->[FocusTrap] Migrate to unstyled (#24957) @povilass
9549
9654
  - &#8203;<!-- 060 -->[Backdrop] Migrate to unstyled (#24985) @povilass
9550
9655
  - &#8203;<!-- 078 -->[Modal] Migrate to emotion + unstyled (#24857) @povilass
9551
9656
 
@@ -10142,7 +10247,7 @@ A big thanks to the 14 contributors who made this release possible. Here are som
10142
10247
  - [ButtonBase] Migrate styles to emotion (#24100) @mnajdova
10143
10248
  - [Button] Migrate styles to emotion (#24107) @mnajdova
10144
10249
  - [unstyled] Add utils for generating utility classes (#24126) @mnajdova
10145
- - [TrapFocus] Fix trap to only focus on tabbable elements (#23364) @gregnb
10250
+ - [FocusTrap] Fix trap to only focus on tabbable elements (#23364) @gregnb
10146
10251
  - [Link] Improve integration with Next.js (#24121) @kelvinsanchez15
10147
10252
  - [Select] Fix overflow showing scrollbar (#24085) @Segebre
10148
10253
  - [Slider] Fix circular type reference in SliderValueLabel (#24190) @eps1lon
@@ -12075,9 +12180,9 @@ Here are some highlights ✨:
12075
12180
  - [Tabs] Document how to make scroll icons visible (#22255) @Sorgrum
12076
12181
  - [TextField] Add hidden label to multi-line filled textfield (#22284) @fakeharahman
12077
12182
  - [Toolbar] Custom variant (#22217) @mnajdova
12078
- - [TrapFocus] Entangle effects (#22155) @eps1lon
12079
- - [TrapFocus] Fix compatibility issues with React 17 (#22270) @eps1lon
12080
- - [TrapFocus] Prevent possible crash in React 17 (#22262) @eps1lon
12183
+ - [FocusTrap] Entangle effects (#22155) @eps1lon
12184
+ - [FocusTrap] Fix compatibility issues with React 17 (#22270) @eps1lon
12185
+ - [FocusTrap] Prevent possible crash in React 17 (#22262) @eps1lon
12081
12186
 
12082
12187
  ### `@material-ui/icons@v5.0.0-alpha.7`
12083
12188
 
@@ -12162,7 +12267,7 @@ Here are some highlights ✨:
12162
12267
 
12163
12268
  More details in [the documentation](https://mui.com/material-ui/customization/components/#adding-new-component-variants) and [RFC](#21749).
12164
12269
 
12165
- - 👮 Add documentation for the [TrapFocus](https://mui.com/components/trap-focus/) component (#22062) @oliviertassinari.
12270
+ - 👮 Add documentation for the [FocusTrap](https://mui.com/base-ui/react-focus-trap/) component (#22062) @oliviertassinari.
12166
12271
  - ⚛️ Prepare support for React v17 (#22093, #22105, #22143, #22111) @eps1lon.
12167
12272
  - 🚧 We have undertaken breaking changes.
12168
12273
 
@@ -12339,7 +12444,7 @@ Here are some highlights ✨:
12339
12444
  - [CssBaseline] Add text size adjust property (#22089) @Tolsee
12340
12445
  - [l10n] Add Greek (el-GR) locale (#21988) @tmanolat
12341
12446
  - [Table] Cell small's right padding is bigger than medium (#22017) @adamlaurencik
12342
- - [TrapFocus] Add documentation (#22062) @oliviertassinari
12447
+ - [FocusTrap] Add documentation (#22062) @oliviertassinari
12343
12448
  - [Typography] Add custom variants support (#22006) @mnajdova
12344
12449
  - [useIsFocusVisible] Remove focus-visible if focus is re-targetted (#22102) @eps1lon
12345
12450
  - [core] Fix various potential issues with multiple windows (#22159) @scottander
@@ -12535,7 +12640,7 @@ A big thanks to the 14 contributors who made this release possible.
12535
12640
  - [List] Fix secondary action position when disableGutters={true} (#21732) @kgregory
12536
12641
  - [TablePagination] Fix broken labelling if SelectProps provided ids (#21703) @eps1lon
12537
12642
  - [theme] Fix custom breakpoint in CSS Media Queries (#21759) @nkrivous
12538
- - [TrapFocus] Fix disableAutoFocus prop (#21612) @oliviertassinari
12643
+ - [FocusTrap] Fix disableAutoFocus prop (#21612) @oliviertassinari
12539
12644
 
12540
12645
  ### `@material-ui/lab@v5.0.0-alpha.3`
12541
12646
 
@@ -12610,7 +12715,7 @@ A big thanks to the 16 contributors who made this release possible.
12610
12715
  - [MenuItem] Add types for ListItemClasses (#21654) @eps1lon
12611
12716
  - [Slider] Fix cannot read property 'focus' of null (#21653) @mageprincess
12612
12717
  - [TextField] Fix CSS isolation issue (#21665) @Codetalker777
12613
- - [TrapFocus] Fix portal support (#21610) @mnajdova
12718
+ - [FocusTrap] Fix portal support (#21610) @mnajdova
12614
12719
  - [TypeScript] Fix version support (#21640) @jakubfiglak
12615
12720
 
12616
12721
  ### `@material-ui/lab@v5.0.0-alpha.2`
package/DialogTitle/DialogTitle.d.ts CHANGED
@@ -37,6 +37,7 @@ export interface DialogTitleTypeMap<
37
37
  * API:
38
38
  *
39
39
  * - [DialogTitle API](https://mui.com/material-ui/api/dialog-title/)
40
+ * - inherits [Typography API](https://mui.com/material-ui/api/typography/)
40
41
  */
41
42
  declare const DialogTitle: OverridableComponent<DialogTitleTypeMap>;
42
43
 
package/Modal/Modal.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
4
4
  import _extends from "@babel/runtime/helpers/esm/extends";
5
- const _excluded = ["BackdropComponent", "BackdropProps", "classes", "className", "closeAfterTransition", "children", "container", "component", "components", "componentsProps", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "onBackdropClick", "onClose", "open", "slotProps", "slots", "theme"];
5
+ const _excluded = ["BackdropComponent", "BackdropProps", "classes", "className", "closeAfterTransition", "children", "container", "component", "components", "componentsProps", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "onBackdropClick", "onClose", "onTransitionEnter", "onTransitionExited", "open", "slotProps", "slots", "theme"];
6
6
  import * as React from 'react';
7
7
  import PropTypes from 'prop-types';
8
8
  import clsx from 'clsx';