@mui/material 7.0.0-beta.3 → 7.0.0-beta.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Accordion/Accordion.d.ts +13 -2
- package/Accordion/Accordion.js +18 -6
- package/AccordionSummary/AccordionSummary.d.ts +39 -4
- package/AccordionSummary/AccordionSummary.js +67 -16
- package/CHANGELOG.md +60 -0
- package/ListItemText/ListItemText.d.ts +10 -0
- package/ListItemText/ListItemText.js +14 -5
- package/SpeedDial/SpeedDial.d.ts +10 -0
- package/SpeedDial/SpeedDial.js +40 -11
- package/SpeedDialAction/SpeedDialAction.js +1 -1
- package/TextareaAutosize/TextareaAutosize.js +25 -14
- package/Tooltip/Tooltip.d.ts +1 -1
- package/Tooltip/Tooltip.js +1 -1
- package/Typography/Typography.d.ts +3 -3
- package/esm/Accordion/Accordion.d.ts +13 -2
- package/esm/Accordion/Accordion.js +18 -6
- package/esm/AccordionSummary/AccordionSummary.d.ts +39 -4
- package/esm/AccordionSummary/AccordionSummary.js +67 -16
- package/esm/ListItemText/ListItemText.d.ts +10 -0
- package/esm/ListItemText/ListItemText.js +14 -5
- package/esm/SpeedDial/SpeedDial.d.ts +10 -0
- package/esm/SpeedDial/SpeedDial.js +40 -11
- package/esm/SpeedDialAction/SpeedDialAction.js +1 -1
- package/esm/TextareaAutosize/TextareaAutosize.js +26 -15
- package/esm/Tooltip/Tooltip.d.ts +1 -1
- package/esm/Tooltip/Tooltip.js +1 -1
- package/esm/Typography/Typography.d.ts +3 -3
- package/esm/index.js +1 -1
- package/esm/styles/ThemeProvider.d.ts +6 -0
- package/esm/styles/ThemeProvider.js +11 -0
- package/esm/styles/adaptV4Theme.d.ts +2 -2
- package/esm/styles/createThemeNoVars.d.ts +3 -3
- package/esm/styles/createTypography.d.ts +4 -4
- package/esm/styles/index.d.ts +1 -1
- package/esm/styles/responsiveFontSizes.d.ts +3 -3
- package/esm/useScrollTrigger/useScrollTrigger.d.ts +1 -1
- package/esm/useScrollTrigger/useScrollTrigger.js +3 -0
- package/esm/version/index.js +2 -2
- package/index.js +1 -1
- package/modern/Accordion/Accordion.d.ts +13 -2
- package/modern/Accordion/Accordion.js +18 -6
- package/modern/AccordionSummary/AccordionSummary.d.ts +39 -4
- package/modern/AccordionSummary/AccordionSummary.js +67 -16
- package/modern/ListItemText/ListItemText.d.ts +10 -0
- package/modern/ListItemText/ListItemText.js +14 -5
- package/modern/SpeedDial/SpeedDial.d.ts +10 -0
- package/modern/SpeedDial/SpeedDial.js +40 -11
- package/modern/SpeedDialAction/SpeedDialAction.js +1 -1
- package/modern/TextareaAutosize/TextareaAutosize.js +26 -15
- package/modern/Tooltip/Tooltip.d.ts +1 -1
- package/modern/Tooltip/Tooltip.js +1 -1
- package/modern/Typography/Typography.d.ts +3 -3
- package/modern/index.js +1 -1
- package/modern/styles/ThemeProvider.d.ts +6 -0
- package/modern/styles/ThemeProvider.js +11 -0
- package/modern/styles/adaptV4Theme.d.ts +2 -2
- package/modern/styles/createThemeNoVars.d.ts +3 -3
- package/modern/styles/createTypography.d.ts +4 -4
- package/modern/styles/index.d.ts +1 -1
- package/modern/styles/responsiveFontSizes.d.ts +3 -3
- package/modern/useScrollTrigger/useScrollTrigger.d.ts +1 -1
- package/modern/useScrollTrigger/useScrollTrigger.js +3 -0
- package/modern/version/index.js +2 -2
- package/package.json +6 -6
- package/styles/ThemeProvider.d.ts +6 -0
- package/styles/ThemeProvider.js +11 -0
- package/styles/adaptV4Theme.d.ts +2 -2
- package/styles/createThemeNoVars.d.ts +3 -3
- package/styles/createTypography.d.ts +4 -4
- package/styles/index.d.ts +1 -1
- package/styles/responsiveFontSizes.d.ts +3 -3
- package/tsconfig.build.tsbuildinfo +1 -1
- package/useScrollTrigger/useScrollTrigger.d.ts +1 -1
- package/useScrollTrigger/useScrollTrigger.js +3 -0
- package/version/index.js +2 -2
package/Accordion/Accordion.d.ts
CHANGED
|
@@ -4,9 +4,14 @@ import { Theme } from "../index.js";
|
|
|
4
4
|
import { TransitionProps } from "../transitions/transition.js";
|
|
5
5
|
import { AccordionClasses } from "./accordionClasses.js";
|
|
6
6
|
import { OverridableComponent, OverrideProps } from "../OverridableComponent/index.js";
|
|
7
|
-
import { ExtendPaperTypeMap } from "../Paper/Paper.js";
|
|
7
|
+
import { ExtendPaperTypeMap, PaperProps } from "../Paper/Paper.js";
|
|
8
8
|
import { CreateSlotsAndSlotProps, SlotComponentProps, SlotProps } from "../utils/types.js";
|
|
9
9
|
export interface AccordionSlots {
|
|
10
|
+
/**
|
|
11
|
+
* The component that renders the root.
|
|
12
|
+
* @default Paper
|
|
13
|
+
*/
|
|
14
|
+
root: React.ElementType;
|
|
10
15
|
/**
|
|
11
16
|
* The component that renders the heading.
|
|
12
17
|
* @default 'h3'
|
|
@@ -19,9 +24,15 @@ export interface AccordionSlots {
|
|
|
19
24
|
*/
|
|
20
25
|
transition: React.ElementType;
|
|
21
26
|
}
|
|
22
|
-
export interface
|
|
27
|
+
export interface AccordionRootSlotPropsOverrides {}
|
|
23
28
|
export interface AccordionHeadingSlotPropsOverrides {}
|
|
29
|
+
export interface AccordionTransitionSlotPropsOverrides {}
|
|
24
30
|
export type AccordionSlotsAndSlotProps = CreateSlotsAndSlotProps<AccordionSlots, {
|
|
31
|
+
/**
|
|
32
|
+
* Props forwarded to the root slot.
|
|
33
|
+
* By default, the avaible props are based on the Paper element.
|
|
34
|
+
*/
|
|
35
|
+
root: SlotProps<React.ElementType<PaperProps>, AccordionRootSlotPropsOverrides, AccordionOwnerState>;
|
|
25
36
|
/**
|
|
26
37
|
* Props forwarded to the heading slot.
|
|
27
38
|
* By default, the avaible props are based on the h3 element.
|
package/Accordion/Accordion.js
CHANGED
|
@@ -192,6 +192,20 @@ const Accordion = /*#__PURE__*/React.forwardRef(function Accordion(inProps, ref)
|
|
|
192
192
|
slots: backwardCompatibleSlots,
|
|
193
193
|
slotProps: backwardCompatibleSlotProps
|
|
194
194
|
};
|
|
195
|
+
const [RootSlot, rootProps] = (0, _useSlot.default)('root', {
|
|
196
|
+
elementType: AccordionRoot,
|
|
197
|
+
externalForwardedProps: {
|
|
198
|
+
...externalForwardedProps,
|
|
199
|
+
...other
|
|
200
|
+
},
|
|
201
|
+
className: (0, _clsx.default)(classes.root, className),
|
|
202
|
+
shouldForwardComponentProp: true,
|
|
203
|
+
ownerState,
|
|
204
|
+
ref,
|
|
205
|
+
additionalProps: {
|
|
206
|
+
square
|
|
207
|
+
}
|
|
208
|
+
});
|
|
195
209
|
const [AccordionHeadingSlot, accordionProps] = (0, _useSlot.default)('heading', {
|
|
196
210
|
elementType: AccordionHeading,
|
|
197
211
|
externalForwardedProps,
|
|
@@ -203,12 +217,8 @@ const Accordion = /*#__PURE__*/React.forwardRef(function Accordion(inProps, ref)
|
|
|
203
217
|
externalForwardedProps,
|
|
204
218
|
ownerState
|
|
205
219
|
});
|
|
206
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(
|
|
207
|
-
|
|
208
|
-
ref: ref,
|
|
209
|
-
ownerState: ownerState,
|
|
210
|
-
square: square,
|
|
211
|
-
...other,
|
|
220
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(RootSlot, {
|
|
221
|
+
...rootProps,
|
|
212
222
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(AccordionHeadingSlot, {
|
|
213
223
|
...accordionProps,
|
|
214
224
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_AccordionContext.default.Provider, {
|
|
@@ -288,6 +298,7 @@ process.env.NODE_ENV !== "production" ? Accordion.propTypes /* remove-proptypes
|
|
|
288
298
|
*/
|
|
289
299
|
slotProps: _propTypes.default.shape({
|
|
290
300
|
heading: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
|
|
301
|
+
root: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
|
|
291
302
|
transition: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object])
|
|
292
303
|
}),
|
|
293
304
|
/**
|
|
@@ -296,6 +307,7 @@ process.env.NODE_ENV !== "production" ? Accordion.propTypes /* remove-proptypes
|
|
|
296
307
|
*/
|
|
297
308
|
slots: _propTypes.default.shape({
|
|
298
309
|
heading: _propTypes.default.elementType,
|
|
310
|
+
root: _propTypes.default.elementType,
|
|
299
311
|
transition: _propTypes.default.elementType
|
|
300
312
|
}),
|
|
301
313
|
/**
|
|
@@ -1,13 +1,47 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { SxProps } from '@mui/system';
|
|
3
|
-
import { ExtendButtonBase, ExtendButtonBaseTypeMap } from "../ButtonBase/index.js";
|
|
3
|
+
import { ButtonBaseProps, ExtendButtonBase, ExtendButtonBaseTypeMap } from "../ButtonBase/index.js";
|
|
4
4
|
import { OverrideProps } from "../OverridableComponent/index.js";
|
|
5
|
-
import { Theme } from "../index.js";
|
|
5
|
+
import { CreateSlotsAndSlotProps, SlotProps, Theme } from "../index.js";
|
|
6
6
|
import { AccordionSummaryClasses } from "./accordionSummaryClasses.js";
|
|
7
|
-
export interface
|
|
7
|
+
export interface AccordionSummarySlots {
|
|
8
8
|
/**
|
|
9
|
-
* The
|
|
9
|
+
* The component that renders the root slot.
|
|
10
|
+
* @default ButtonBase
|
|
10
11
|
*/
|
|
12
|
+
root: React.ElementType;
|
|
13
|
+
/**
|
|
14
|
+
* The component that renders the content slot.
|
|
15
|
+
* @default div
|
|
16
|
+
*/
|
|
17
|
+
content: React.ElementType;
|
|
18
|
+
/**
|
|
19
|
+
* The component that renders the expand icon wrapper slot.
|
|
20
|
+
* @default div
|
|
21
|
+
*/
|
|
22
|
+
expandIconWrapper: React.ElementType;
|
|
23
|
+
}
|
|
24
|
+
export interface AccordionSummaryRootSlotPropsOverrides {}
|
|
25
|
+
export interface AccordionSummaryContentSlotPropsOverrides {}
|
|
26
|
+
export interface AccordionSummaryExpandIconWrapperSlotPropsOverrides {}
|
|
27
|
+
export type AccordionSummarySlotsAndSlotProps = CreateSlotsAndSlotProps<AccordionSummarySlots, {
|
|
28
|
+
/**
|
|
29
|
+
* Props forwarded to the root slot.
|
|
30
|
+
* By default, the avaible props are based on the [ButtonBase](https://mui.com/material-ui/api/button-base/#props) component.
|
|
31
|
+
*/
|
|
32
|
+
root: SlotProps<React.ElementType<ButtonBaseProps>, AccordionSummaryRootSlotPropsOverrides, AccordionSummaryOwnerState>;
|
|
33
|
+
/**
|
|
34
|
+
* Props forwarded to the content slot.
|
|
35
|
+
* By default, the avaible props are based on a div element.
|
|
36
|
+
*/
|
|
37
|
+
content: SlotProps<'div', AccordionSummaryContentSlotPropsOverrides, AccordionSummaryOwnerState>;
|
|
38
|
+
/**
|
|
39
|
+
* Props forwarded to the expand icon wrapper slot.
|
|
40
|
+
* By default, the avaible props are based on a div element.
|
|
41
|
+
*/
|
|
42
|
+
expandIconWrapper: SlotProps<'div', AccordionSummaryExpandIconWrapperSlotPropsOverrides, AccordionSummaryOwnerState>;
|
|
43
|
+
}>;
|
|
44
|
+
export interface AccordionSummaryOwnProps extends AccordionSummarySlotsAndSlotProps {
|
|
11
45
|
children?: React.ReactNode;
|
|
12
46
|
/**
|
|
13
47
|
* Override or extend the styles applied to the component.
|
|
@@ -26,6 +60,7 @@ export type AccordionSummaryTypeMap<AdditionalProps = {}, RootComponent extends
|
|
|
26
60
|
props: AdditionalProps & AccordionSummaryOwnProps;
|
|
27
61
|
defaultComponent: RootComponent;
|
|
28
62
|
}>;
|
|
63
|
+
export interface AccordionSummaryOwnerState extends Omit<AccordionSummaryProps, 'slots' | 'slotProps'> {}
|
|
29
64
|
|
|
30
65
|
/**
|
|
31
66
|
*
|
|
@@ -17,6 +17,7 @@ var _DefaultPropsProvider = require("../DefaultPropsProvider");
|
|
|
17
17
|
var _ButtonBase = _interopRequireDefault(require("../ButtonBase"));
|
|
18
18
|
var _AccordionContext = _interopRequireDefault(require("../Accordion/AccordionContext"));
|
|
19
19
|
var _accordionSummaryClasses = _interopRequireWildcard(require("./accordionSummaryClasses"));
|
|
20
|
+
var _useSlot = _interopRequireDefault(require("../utils/useSlot"));
|
|
20
21
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
21
22
|
const useUtilityClasses = ownerState => {
|
|
22
23
|
const {
|
|
@@ -119,6 +120,8 @@ const AccordionSummary = /*#__PURE__*/React.forwardRef(function AccordionSummary
|
|
|
119
120
|
expandIcon,
|
|
120
121
|
focusVisibleClassName,
|
|
121
122
|
onClick,
|
|
123
|
+
slots,
|
|
124
|
+
slotProps,
|
|
122
125
|
...other
|
|
123
126
|
} = props;
|
|
124
127
|
const {
|
|
@@ -142,24 +145,54 @@ const AccordionSummary = /*#__PURE__*/React.forwardRef(function AccordionSummary
|
|
|
142
145
|
disableGutters
|
|
143
146
|
};
|
|
144
147
|
const classes = useUtilityClasses(ownerState);
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
148
|
+
const externalForwardedProps = {
|
|
149
|
+
slots,
|
|
150
|
+
slotProps
|
|
151
|
+
};
|
|
152
|
+
const [RootSlot, rootSlotProps] = (0, _useSlot.default)('root', {
|
|
153
|
+
ref,
|
|
154
|
+
shouldForwardComponentProp: true,
|
|
150
155
|
className: (0, _clsx.default)(classes.root, className),
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
156
|
+
elementType: AccordionSummaryRoot,
|
|
157
|
+
externalForwardedProps: {
|
|
158
|
+
...externalForwardedProps,
|
|
159
|
+
...other
|
|
160
|
+
},
|
|
161
|
+
ownerState,
|
|
162
|
+
additionalProps: {
|
|
163
|
+
focusRipple: false,
|
|
164
|
+
disableRipple: true,
|
|
165
|
+
disabled,
|
|
166
|
+
'aria-expanded': expanded,
|
|
167
|
+
focusVisibleClassName: (0, _clsx.default)(classes.focusVisible, focusVisibleClassName)
|
|
168
|
+
},
|
|
169
|
+
getSlotProps: handlers => ({
|
|
170
|
+
...handlers,
|
|
171
|
+
onClick: event => {
|
|
172
|
+
handlers.onClick?.(event);
|
|
173
|
+
handleChange(event);
|
|
174
|
+
}
|
|
175
|
+
})
|
|
176
|
+
});
|
|
177
|
+
const [ContentSlot, contentSlotProps] = (0, _useSlot.default)('content', {
|
|
178
|
+
className: classes.content,
|
|
179
|
+
elementType: AccordionSummaryContent,
|
|
180
|
+
externalForwardedProps,
|
|
181
|
+
ownerState
|
|
182
|
+
});
|
|
183
|
+
const [ExpandIconWrapperSlot, expandIconWrapperSlotProps] = (0, _useSlot.default)('expandIconWrapper', {
|
|
184
|
+
className: classes.expandIconWrapper,
|
|
185
|
+
elementType: AccordionSummaryExpandIconWrapper,
|
|
186
|
+
externalForwardedProps,
|
|
187
|
+
ownerState
|
|
188
|
+
});
|
|
189
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(RootSlot, {
|
|
190
|
+
...rootSlotProps,
|
|
191
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ContentSlot, {
|
|
192
|
+
...contentSlotProps,
|
|
159
193
|
children: children
|
|
160
|
-
}), expandIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
161
|
-
|
|
162
|
-
ownerState: ownerState,
|
|
194
|
+
}), expandIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(ExpandIconWrapperSlot, {
|
|
195
|
+
...expandIconWrapperSlotProps,
|
|
163
196
|
children: expandIcon
|
|
164
197
|
})]
|
|
165
198
|
});
|
|
@@ -198,6 +231,24 @@ process.env.NODE_ENV !== "production" ? AccordionSummary.propTypes /* remove-pro
|
|
|
198
231
|
* @ignore
|
|
199
232
|
*/
|
|
200
233
|
onClick: _propTypes.default.func,
|
|
234
|
+
/**
|
|
235
|
+
* The props used for each slot inside.
|
|
236
|
+
* @default {}
|
|
237
|
+
*/
|
|
238
|
+
slotProps: _propTypes.default.shape({
|
|
239
|
+
content: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
|
|
240
|
+
expandIconWrapper: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
|
|
241
|
+
root: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object])
|
|
242
|
+
}),
|
|
243
|
+
/**
|
|
244
|
+
* The components used for each slot inside.
|
|
245
|
+
* @default {}
|
|
246
|
+
*/
|
|
247
|
+
slots: _propTypes.default.shape({
|
|
248
|
+
content: _propTypes.default.elementType,
|
|
249
|
+
expandIconWrapper: _propTypes.default.elementType,
|
|
250
|
+
root: _propTypes.default.elementType
|
|
251
|
+
}),
|
|
201
252
|
/**
|
|
202
253
|
* The system prop that allows defining system overrides as well as additional CSS styles.
|
|
203
254
|
*/
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,65 @@
|
|
|
1
1
|
# [Versions](https://mui.com/versions/)
|
|
2
2
|
|
|
3
|
+
## 7.0.0-beta.4
|
|
4
|
+
|
|
5
|
+
<!-- generated comparing v7.0.0-beta.3..master -->
|
|
6
|
+
|
|
7
|
+
_Mar 13, 2025_
|
|
8
|
+
|
|
9
|
+
A big thanks to the 10 contributors who made this release possible.
|
|
10
|
+
This release contains bug fixes 🐛 and improvements to the new package layout 🏗️.
|
|
11
|
+
|
|
12
|
+
### `@mui/material@7.0.0-beta.4`
|
|
13
|
+
|
|
14
|
+
- [Accordion] Add missing `root` slot (#45532) @sai6855
|
|
15
|
+
- [AccordionSummary] Add slots and slotProps (#45559) @sai6855
|
|
16
|
+
- [ListItemText] Add missing `root` slot (#45540) @sai6855
|
|
17
|
+
- [SpeedDial] Add missing `root` slot (#45541) @sai6855
|
|
18
|
+
- [Tooltip] Allow auto placement on tooltip (#45399) @Jtaks
|
|
19
|
+
- [useScrollTrigger] Do nothing if target is null (#45441) @vipierozan99
|
|
20
|
+
- [TextareaAutosize] Fix ResizeObserver causing infinite `selectionchange` loop (#45351) @mj12albert
|
|
21
|
+
- Fix negative input for CSS variables spacing array (#45550) @siriwatknp
|
|
22
|
+
- Add missing deprecations in deprecations-all file (#45505) @sai6855
|
|
23
|
+
- Rename some `@mui/material/styles/createTypography` exports (#45558) @Janpot
|
|
24
|
+
|
|
25
|
+
### `@mui/icons-material@7.0.0-beta.4`
|
|
26
|
+
|
|
27
|
+
- Remove unused icon names from the download script (#45453) @yermartee
|
|
28
|
+
|
|
29
|
+
### `@mui/system@7.0.0-beta.4`
|
|
30
|
+
|
|
31
|
+
- Prevent nested non-vars theme inheritance (#45545) @siriwatknp
|
|
32
|
+
- Disable theme recalculation as default behavior (#45405) @siriwatknp
|
|
33
|
+
- Fix package layout inconsistencies (#45491) @DiegoAndai
|
|
34
|
+
|
|
35
|
+
### `@mui/styled-engine@7.0.0-beta.4`
|
|
36
|
+
|
|
37
|
+
- Add `enableCssLayer` prop to StyledEngineProvider (#45428) @siriwatknp
|
|
38
|
+
|
|
39
|
+
### `@mui/types@7.3.0`
|
|
40
|
+
|
|
41
|
+
- [code-infra] Fix type resolution for @mui/types (#45513) @Janpot
|
|
42
|
+
|
|
43
|
+
### `@mui/utils@7.0.0-beta.4`
|
|
44
|
+
|
|
45
|
+
- Fix package layout inconsistencies (#45491) @DiegoAndai
|
|
46
|
+
- Use correct iri-reference homepage format (#45472) @dahiro
|
|
47
|
+
|
|
48
|
+
### Docs
|
|
49
|
+
|
|
50
|
+
- [Backdrop] Fix component name in migration guide (#45506) @sai6855
|
|
51
|
+
- [TextField] Add HTML input section to TextField page (#45439) @siriwatknp
|
|
52
|
+
|
|
53
|
+
### Core
|
|
54
|
+
|
|
55
|
+
- [code-infra] Convert a few docs modules to ts (#45548) @Janpot
|
|
56
|
+
- [code-infra] Remove more CJS modules from the docs (#45557) @Janpot
|
|
57
|
+
- [code-infra] Remove nested imports from theme augmentation (#45514) @Janpot
|
|
58
|
+
- [docs-infra] Add @ts-ignore to avoid type checking for MUI X (#45555) @siriwatknp
|
|
59
|
+
- [blog] Fix author end-of-year updates (#45533) @oliviertassinari
|
|
60
|
+
|
|
61
|
+
All contributors of this release in alphabetical order: @dahiro, @DiegoAndai, @Janpot, @Jtaks, @mj12albert, @oliviertassinari, @sai6855, @siriwatknp, @vipierozan99, @yermartee
|
|
62
|
+
|
|
3
63
|
## 7.0.0-beta.3
|
|
4
64
|
|
|
5
65
|
<!-- generated comparing v7.0.0-beta.2..master -->
|
|
@@ -5,6 +5,11 @@ import { TypographyProps } from "../Typography/index.js";
|
|
|
5
5
|
import { ListItemTextClasses } from "./listItemTextClasses.js";
|
|
6
6
|
import { CreateSlotsAndSlotProps, SlotProps } from "../utils/types.js";
|
|
7
7
|
export interface ListItemTextSlots {
|
|
8
|
+
/**
|
|
9
|
+
* The component that renders the root slot.
|
|
10
|
+
* @default 'div'
|
|
11
|
+
*/
|
|
12
|
+
root?: React.ElementType;
|
|
8
13
|
/**
|
|
9
14
|
* The component that renders the primary slot.
|
|
10
15
|
* @default Typography
|
|
@@ -17,6 +22,11 @@ export interface ListItemTextSlots {
|
|
|
17
22
|
secondary?: React.ElementType;
|
|
18
23
|
}
|
|
19
24
|
export type ListItemTextSlotsAndSlotProps = CreateSlotsAndSlotProps<ListItemTextSlots, {
|
|
25
|
+
/**
|
|
26
|
+
* Props forwared to the root slot.
|
|
27
|
+
* By default, the available props are based on `div` element.
|
|
28
|
+
*/
|
|
29
|
+
root: SlotProps<'div', {}, ListItemTextOwnerState>;
|
|
20
30
|
/**
|
|
21
31
|
* Props forwared to the primary slot (as long as disableTypography is not `true`)
|
|
22
32
|
* By default, the available props are based on the [Typography](https://mui.com/material-ui/api/typography/#props) component
|
|
@@ -114,6 +114,16 @@ const ListItemText = /*#__PURE__*/React.forwardRef(function ListItemText(inProps
|
|
|
114
114
|
...slotProps
|
|
115
115
|
}
|
|
116
116
|
};
|
|
117
|
+
const [RootSlot, rootSlotProps] = (0, _useSlot.default)('root', {
|
|
118
|
+
className: (0, _clsx.default)(classes.root, className),
|
|
119
|
+
elementType: ListItemTextRoot,
|
|
120
|
+
externalForwardedProps: {
|
|
121
|
+
...externalForwardedProps,
|
|
122
|
+
...other
|
|
123
|
+
},
|
|
124
|
+
ownerState,
|
|
125
|
+
ref
|
|
126
|
+
});
|
|
117
127
|
const [PrimarySlot, primarySlotProps] = (0, _useSlot.default)('primary', {
|
|
118
128
|
className: classes.primary,
|
|
119
129
|
elementType: _Typography.default,
|
|
@@ -142,11 +152,8 @@ const ListItemText = /*#__PURE__*/React.forwardRef(function ListItemText(inProps
|
|
|
142
152
|
children: secondary
|
|
143
153
|
});
|
|
144
154
|
}
|
|
145
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(
|
|
146
|
-
|
|
147
|
-
ownerState: ownerState,
|
|
148
|
-
ref: ref,
|
|
149
|
-
...other,
|
|
155
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(RootSlot, {
|
|
156
|
+
...rootSlotProps,
|
|
150
157
|
children: [primary, secondary]
|
|
151
158
|
});
|
|
152
159
|
});
|
|
@@ -207,6 +214,7 @@ process.env.NODE_ENV !== "production" ? ListItemText.propTypes /* remove-proptyp
|
|
|
207
214
|
*/
|
|
208
215
|
slotProps: _propTypes.default.shape({
|
|
209
216
|
primary: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
|
|
217
|
+
root: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
|
|
210
218
|
secondary: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object])
|
|
211
219
|
}),
|
|
212
220
|
/**
|
|
@@ -215,6 +223,7 @@ process.env.NODE_ENV !== "production" ? ListItemText.propTypes /* remove-proptyp
|
|
|
215
223
|
*/
|
|
216
224
|
slots: _propTypes.default.shape({
|
|
217
225
|
primary: _propTypes.default.elementType,
|
|
226
|
+
root: _propTypes.default.elementType,
|
|
218
227
|
secondary: _propTypes.default.elementType
|
|
219
228
|
}),
|
|
220
229
|
/**
|
package/SpeedDial/SpeedDial.d.ts
CHANGED
|
@@ -9,6 +9,11 @@ import { CreateSlotsAndSlotProps, SlotComponentProps } from "../utils/types.js";
|
|
|
9
9
|
export type CloseReason = 'toggle' | 'blur' | 'mouseLeave' | 'escapeKeyDown';
|
|
10
10
|
export type OpenReason = 'toggle' | 'focus' | 'mouseEnter';
|
|
11
11
|
export interface SpeedDialSlots {
|
|
12
|
+
/**
|
|
13
|
+
* The component that renders the root slot.
|
|
14
|
+
* @default 'div'
|
|
15
|
+
*/
|
|
16
|
+
root: React.ElementType;
|
|
12
17
|
/**
|
|
13
18
|
* The component that renders the transition.
|
|
14
19
|
* [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
|
|
@@ -17,6 +22,11 @@ export interface SpeedDialSlots {
|
|
|
17
22
|
transition: React.ElementType;
|
|
18
23
|
}
|
|
19
24
|
export type SpeedDialSlotsAndSlotProps = CreateSlotsAndSlotProps<SpeedDialSlots, {
|
|
25
|
+
/**
|
|
26
|
+
* Props forwarded to the root slot.
|
|
27
|
+
* By default, the avaible props are based on div element.
|
|
28
|
+
*/
|
|
29
|
+
root: SlotComponentProps<'div', React.HTMLAttributes<HTMLDivElement>, SpeedDialOwnerState>;
|
|
20
30
|
/**
|
|
21
31
|
* Props forwarded to the transition slot.
|
|
22
32
|
* By default, the avaible props are based on the [Zoom](https://mui.com/material-ui/api/zoom/#props) component.
|
package/SpeedDial/SpeedDial.js
CHANGED
|
@@ -379,22 +379,49 @@ const SpeedDial = /*#__PURE__*/React.forwardRef(function SpeedDial(inProps, ref)
|
|
|
379
379
|
slots: backwardCompatibleSlots,
|
|
380
380
|
slotProps: backwardCompatibleSlotProps
|
|
381
381
|
};
|
|
382
|
+
const [RootSlot, rootSlotProps] = (0, _useSlot.default)('root', {
|
|
383
|
+
elementType: SpeedDialRoot,
|
|
384
|
+
externalForwardedProps: {
|
|
385
|
+
...externalForwardedProps,
|
|
386
|
+
...other
|
|
387
|
+
},
|
|
388
|
+
ownerState,
|
|
389
|
+
ref,
|
|
390
|
+
className: (0, _clsx.default)(classes.root, className),
|
|
391
|
+
additionalProps: {
|
|
392
|
+
role: 'presentation'
|
|
393
|
+
},
|
|
394
|
+
getSlotProps: handlers => ({
|
|
395
|
+
...handlers,
|
|
396
|
+
onKeyDown: event => {
|
|
397
|
+
handlers.onKeyDown?.(event);
|
|
398
|
+
handleKeyDown(event);
|
|
399
|
+
},
|
|
400
|
+
onBlur: event => {
|
|
401
|
+
handlers.onBlur?.(event);
|
|
402
|
+
handleClose(event);
|
|
403
|
+
},
|
|
404
|
+
onFocus: event => {
|
|
405
|
+
handlers.onFocus?.(event);
|
|
406
|
+
handleOpen(event);
|
|
407
|
+
},
|
|
408
|
+
onMouseEnter: event => {
|
|
409
|
+
handlers.onMouseEnter?.(event);
|
|
410
|
+
handleOpen(event);
|
|
411
|
+
},
|
|
412
|
+
onMouseLeave: event => {
|
|
413
|
+
handlers.onMouseLeave?.(event);
|
|
414
|
+
handleClose(event);
|
|
415
|
+
}
|
|
416
|
+
})
|
|
417
|
+
});
|
|
382
418
|
const [TransitionSlot, transitionProps] = (0, _useSlot.default)('transition', {
|
|
383
419
|
elementType: _Zoom.default,
|
|
384
420
|
externalForwardedProps,
|
|
385
421
|
ownerState
|
|
386
422
|
});
|
|
387
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(
|
|
388
|
-
|
|
389
|
-
ref: ref,
|
|
390
|
-
role: "presentation",
|
|
391
|
-
onKeyDown: handleKeyDown,
|
|
392
|
-
onBlur: handleClose,
|
|
393
|
-
onFocus: handleOpen,
|
|
394
|
-
onMouseEnter: handleOpen,
|
|
395
|
-
onMouseLeave: handleClose,
|
|
396
|
-
ownerState: ownerState,
|
|
397
|
-
...other,
|
|
423
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(RootSlot, {
|
|
424
|
+
...rootSlotProps,
|
|
398
425
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(TransitionSlot, {
|
|
399
426
|
in: !hidden,
|
|
400
427
|
timeout: transitionDuration,
|
|
@@ -514,6 +541,7 @@ process.env.NODE_ENV !== "production" ? SpeedDial.propTypes /* remove-proptypes
|
|
|
514
541
|
* @default {}
|
|
515
542
|
*/
|
|
516
543
|
slotProps: _propTypes.default.shape({
|
|
544
|
+
root: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
|
|
517
545
|
transition: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object])
|
|
518
546
|
}),
|
|
519
547
|
/**
|
|
@@ -521,6 +549,7 @@ process.env.NODE_ENV !== "production" ? SpeedDial.propTypes /* remove-proptypes
|
|
|
521
549
|
* @default {}
|
|
522
550
|
*/
|
|
523
551
|
slots: _propTypes.default.shape({
|
|
552
|
+
root: _propTypes.default.elementType,
|
|
524
553
|
transition: _propTypes.default.elementType
|
|
525
554
|
}),
|
|
526
555
|
/**
|
|
@@ -348,7 +348,7 @@ process.env.NODE_ENV !== "production" ? SpeedDialAction.propTypes /* remove-prop
|
|
|
348
348
|
* @default 'left'
|
|
349
349
|
* @deprecated Use `slotProps.tooltip.placement` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
|
|
350
350
|
*/
|
|
351
|
-
tooltipPlacement: _propTypes.default.oneOf(['bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),
|
|
351
|
+
tooltipPlacement: _propTypes.default.oneOf(['auto-end', 'auto-start', 'auto', 'bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),
|
|
352
352
|
/**
|
|
353
353
|
* Label to display in the tooltip.
|
|
354
354
|
* @deprecated Use `slotProps.tooltip.title` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
|
|
@@ -119,6 +119,15 @@ const TextareaAutosize = /*#__PURE__*/React.forwardRef(function TextareaAutosize
|
|
|
119
119
|
overflowing
|
|
120
120
|
};
|
|
121
121
|
}, [maxRows, minRows, props.placeholder]);
|
|
122
|
+
const didHeightChange = (0, _utils.unstable_useEventCallback)(() => {
|
|
123
|
+
const textarea = textareaRef.current;
|
|
124
|
+
const textareaStyles = calculateTextareaStyles();
|
|
125
|
+
if (!textarea || !textareaStyles || isEmpty(textareaStyles)) {
|
|
126
|
+
return false;
|
|
127
|
+
}
|
|
128
|
+
const outerHeightStyle = textareaStyles.outerHeightStyle;
|
|
129
|
+
return heightRef.current != null && heightRef.current !== outerHeightStyle;
|
|
130
|
+
});
|
|
122
131
|
const syncHeight = React.useCallback(() => {
|
|
123
132
|
const textarea = textareaRef.current;
|
|
124
133
|
const textareaStyles = calculateTextareaStyles();
|
|
@@ -134,37 +143,39 @@ const TextareaAutosize = /*#__PURE__*/React.forwardRef(function TextareaAutosize
|
|
|
134
143
|
}, [calculateTextareaStyles]);
|
|
135
144
|
const frameRef = React.useRef(-1);
|
|
136
145
|
(0, _utils.unstable_useEnhancedEffect)(() => {
|
|
137
|
-
const
|
|
146
|
+
const debouncedHandleResize = (0, _utils.unstable_debounce)(syncHeight);
|
|
138
147
|
const textarea = textareaRef?.current;
|
|
139
148
|
if (!textarea) {
|
|
140
149
|
return undefined;
|
|
141
150
|
}
|
|
142
151
|
const containerWindow = (0, _utils.unstable_ownerWindow)(textarea);
|
|
143
|
-
containerWindow.addEventListener('resize',
|
|
152
|
+
containerWindow.addEventListener('resize', debouncedHandleResize);
|
|
144
153
|
let resizeObserver;
|
|
145
154
|
if (typeof ResizeObserver !== 'undefined') {
|
|
146
155
|
resizeObserver = new ResizeObserver(() => {
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
+
if (didHeightChange()) {
|
|
157
|
+
// avoid "ResizeObserver loop completed with undelivered notifications" error
|
|
158
|
+
// by temporarily unobserving the textarea element while manipulating the height
|
|
159
|
+
// and reobserving one frame later
|
|
160
|
+
resizeObserver.unobserve(textarea);
|
|
161
|
+
cancelAnimationFrame(frameRef.current);
|
|
162
|
+
syncHeight();
|
|
163
|
+
frameRef.current = requestAnimationFrame(() => {
|
|
164
|
+
resizeObserver.observe(textarea);
|
|
165
|
+
});
|
|
166
|
+
}
|
|
156
167
|
});
|
|
157
168
|
resizeObserver.observe(textarea);
|
|
158
169
|
}
|
|
159
170
|
return () => {
|
|
160
|
-
|
|
171
|
+
debouncedHandleResize.clear();
|
|
161
172
|
cancelAnimationFrame(frameRef.current);
|
|
162
|
-
containerWindow.removeEventListener('resize',
|
|
173
|
+
containerWindow.removeEventListener('resize', debouncedHandleResize);
|
|
163
174
|
if (resizeObserver) {
|
|
164
175
|
resizeObserver.disconnect();
|
|
165
176
|
}
|
|
166
177
|
};
|
|
167
|
-
}, [calculateTextareaStyles, syncHeight]);
|
|
178
|
+
}, [calculateTextareaStyles, syncHeight, didHeightChange]);
|
|
168
179
|
(0, _utils.unstable_useEnhancedEffect)(() => {
|
|
169
180
|
syncHeight();
|
|
170
181
|
});
|
package/Tooltip/Tooltip.d.ts
CHANGED
|
@@ -178,7 +178,7 @@ export interface TooltipProps extends StandardProps<React.HTMLAttributes<HTMLDiv
|
|
|
178
178
|
* Tooltip placement.
|
|
179
179
|
* @default 'bottom'
|
|
180
180
|
*/
|
|
181
|
-
placement?: '
|
|
181
|
+
placement?: PopperProps['placement'];
|
|
182
182
|
/**
|
|
183
183
|
* The component used for the popper.
|
|
184
184
|
* @deprecated use the `slots.popper` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
|
package/Tooltip/Tooltip.js
CHANGED
|
@@ -849,7 +849,7 @@ process.env.NODE_ENV !== "production" ? Tooltip.propTypes /* remove-proptypes */
|
|
|
849
849
|
* Tooltip placement.
|
|
850
850
|
* @default 'bottom'
|
|
851
851
|
*/
|
|
852
|
-
placement: _propTypes.default.oneOf(['bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),
|
|
852
|
+
placement: _propTypes.default.oneOf(['auto-end', 'auto-start', 'auto', 'bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),
|
|
853
853
|
/**
|
|
854
854
|
* The component used for the popper.
|
|
855
855
|
* @deprecated use the `slots.popper` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
|
|
@@ -3,7 +3,7 @@ import { OverridableStringUnion } from '@mui/types';
|
|
|
3
3
|
import { SxProps, SystemProps } from '@mui/system';
|
|
4
4
|
import { Theme, TypeText } from "../styles/index.js";
|
|
5
5
|
import { OverrideProps, OverridableComponent } from "../OverridableComponent/index.js";
|
|
6
|
-
import {
|
|
6
|
+
import { TypographyVariant } from "../styles/createTypography.js";
|
|
7
7
|
import { TypographyClasses } from "./typographyClasses.js";
|
|
8
8
|
export interface TypographyPropsVariantOverrides {}
|
|
9
9
|
export interface TypographyPropsColorOverrides {}
|
|
@@ -54,7 +54,7 @@ export interface TypographyOwnProps extends Omit<SystemProps<Theme>, 'color'> {
|
|
|
54
54
|
* Applies the theme typography styles.
|
|
55
55
|
* @default 'body1'
|
|
56
56
|
*/
|
|
57
|
-
variant?: OverridableStringUnion<
|
|
57
|
+
variant?: OverridableStringUnion<TypographyVariant | 'inherit', TypographyPropsVariantOverrides>;
|
|
58
58
|
/**
|
|
59
59
|
* The component maps the variant prop to a range of different HTML element types.
|
|
60
60
|
* For instance, subtitle1 to `<h6>`.
|
|
@@ -74,7 +74,7 @@ export interface TypographyOwnProps extends Omit<SystemProps<Theme>, 'color'> {
|
|
|
74
74
|
* inherit: 'p',
|
|
75
75
|
* }
|
|
76
76
|
*/
|
|
77
|
-
variantMapping?: Partial<Record<OverridableStringUnion<
|
|
77
|
+
variantMapping?: Partial<Record<OverridableStringUnion<TypographyVariant | 'inherit', TypographyPropsVariantOverrides>, string>>;
|
|
78
78
|
}
|
|
79
79
|
export interface TypographyTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'span'> {
|
|
80
80
|
props: AdditionalProps & TypographyOwnProps;
|
|
@@ -4,9 +4,14 @@ import { Theme } from "../index.js";
|
|
|
4
4
|
import { TransitionProps } from "../transitions/transition.js";
|
|
5
5
|
import { AccordionClasses } from "./accordionClasses.js";
|
|
6
6
|
import { OverridableComponent, OverrideProps } from "../OverridableComponent/index.js";
|
|
7
|
-
import { ExtendPaperTypeMap } from "../Paper/Paper.js";
|
|
7
|
+
import { ExtendPaperTypeMap, PaperProps } from "../Paper/Paper.js";
|
|
8
8
|
import { CreateSlotsAndSlotProps, SlotComponentProps, SlotProps } from "../utils/types.js";
|
|
9
9
|
export interface AccordionSlots {
|
|
10
|
+
/**
|
|
11
|
+
* The component that renders the root.
|
|
12
|
+
* @default Paper
|
|
13
|
+
*/
|
|
14
|
+
root: React.ElementType;
|
|
10
15
|
/**
|
|
11
16
|
* The component that renders the heading.
|
|
12
17
|
* @default 'h3'
|
|
@@ -19,9 +24,15 @@ export interface AccordionSlots {
|
|
|
19
24
|
*/
|
|
20
25
|
transition: React.ElementType;
|
|
21
26
|
}
|
|
22
|
-
export interface
|
|
27
|
+
export interface AccordionRootSlotPropsOverrides {}
|
|
23
28
|
export interface AccordionHeadingSlotPropsOverrides {}
|
|
29
|
+
export interface AccordionTransitionSlotPropsOverrides {}
|
|
24
30
|
export type AccordionSlotsAndSlotProps = CreateSlotsAndSlotProps<AccordionSlots, {
|
|
31
|
+
/**
|
|
32
|
+
* Props forwarded to the root slot.
|
|
33
|
+
* By default, the avaible props are based on the Paper element.
|
|
34
|
+
*/
|
|
35
|
+
root: SlotProps<React.ElementType<PaperProps>, AccordionRootSlotPropsOverrides, AccordionOwnerState>;
|
|
25
36
|
/**
|
|
26
37
|
* Props forwarded to the heading slot.
|
|
27
38
|
* By default, the avaible props are based on the h3 element.
|