@mui/material 6.2.1 → 6.3.1
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/AccordionSummary/AccordionSummary.js +4 -3
- package/AppBar/AppBar.d.ts +1 -1
- package/AppBar/AppBar.js +1 -1
- package/Autocomplete/Autocomplete.js +36 -49
- package/Backdrop/Backdrop.js +1 -9
- package/CHANGELOG.md +77 -0
- package/Collapse/Collapse.js +5 -4
- package/Fade/Fade.js +5 -2
- package/FilledInput/FilledInput.js +1 -3
- package/Grow/Grow.js +5 -2
- package/Icon/Icon.js +1 -3
- package/Input/Input.js +1 -3
- package/OutlinedInput/OutlinedInput.js +1 -3
- package/Select/selectClasses.d.ts +9 -3
- package/Slide/Slide.js +5 -2
- package/StepContent/StepContent.d.ts +31 -2
- package/StepContent/StepContent.js +39 -7
- package/StepLabel/StepLabel.js +1 -3
- package/SvgIcon/SvgIcon.js +1 -3
- package/TablePagination/TablePagination.d.ts +134 -18
- package/TablePagination/TablePagination.js +89 -33
- package/TableSortLabel/TableSortLabel.d.ts +43 -1
- package/TableSortLabel/TableSortLabel.js +40 -7
- package/Tooltip/Tooltip.js +1 -1
- package/Zoom/Zoom.js +5 -2
- package/index.js +1 -1
- package/modern/AccordionSummary/AccordionSummary.js +4 -3
- package/modern/AppBar/AppBar.js +1 -1
- package/modern/Autocomplete/Autocomplete.js +36 -49
- package/modern/Backdrop/Backdrop.js +1 -9
- package/modern/Collapse/Collapse.js +5 -4
- package/modern/Fade/Fade.js +5 -2
- package/modern/FilledInput/FilledInput.js +1 -3
- package/modern/Grow/Grow.js +5 -2
- package/modern/Icon/Icon.js +1 -3
- package/modern/Input/Input.js +1 -3
- package/modern/OutlinedInput/OutlinedInput.js +1 -3
- package/modern/Slide/Slide.js +5 -2
- package/modern/StepContent/StepContent.js +39 -7
- package/modern/StepLabel/StepLabel.js +1 -3
- package/modern/SvgIcon/SvgIcon.js +1 -3
- package/modern/TablePagination/TablePagination.js +89 -33
- package/modern/TableSortLabel/TableSortLabel.js +40 -7
- package/modern/Tooltip/Tooltip.js +1 -1
- package/modern/Zoom/Zoom.js +5 -2
- package/modern/index.js +1 -1
- package/modern/version/index.js +2 -2
- package/node/AccordionSummary/AccordionSummary.js +4 -3
- package/node/AppBar/AppBar.js +1 -1
- package/node/Autocomplete/Autocomplete.js +36 -49
- package/node/Backdrop/Backdrop.js +1 -9
- package/node/Collapse/Collapse.js +5 -4
- package/node/Fade/Fade.js +5 -2
- package/node/FilledInput/FilledInput.js +1 -3
- package/node/Grow/Grow.js +5 -2
- package/node/Icon/Icon.js +1 -3
- package/node/Input/Input.js +1 -3
- package/node/OutlinedInput/OutlinedInput.js +1 -3
- package/node/Slide/Slide.js +5 -2
- package/node/StepContent/StepContent.js +39 -7
- package/node/StepLabel/StepLabel.js +1 -3
- package/node/SvgIcon/SvgIcon.js +1 -3
- package/node/TablePagination/TablePagination.js +89 -33
- package/node/TableSortLabel/TableSortLabel.js +40 -7
- package/node/Tooltip/Tooltip.js +1 -1
- package/node/Zoom/Zoom.js +5 -2
- package/node/index.js +1 -1
- package/node/version/index.js +2 -2
- package/package.json +6 -6
- package/useAutocomplete/useAutocomplete.d.ts +20 -5
- package/version/index.js +2 -2
|
@@ -38,6 +38,7 @@ const AccordionSummaryRoot = styled(ButtonBase, {
|
|
|
38
38
|
};
|
|
39
39
|
return {
|
|
40
40
|
display: 'flex',
|
|
41
|
+
width: '100%',
|
|
41
42
|
minHeight: 48,
|
|
42
43
|
padding: theme.spacing(0, 2),
|
|
43
44
|
transition: theme.transitions.create(['min-height', 'background-color'], transition),
|
|
@@ -60,7 +61,7 @@ const AccordionSummaryRoot = styled(ButtonBase, {
|
|
|
60
61
|
}]
|
|
61
62
|
};
|
|
62
63
|
}));
|
|
63
|
-
const AccordionSummaryContent = styled('
|
|
64
|
+
const AccordionSummaryContent = styled('span', {
|
|
64
65
|
name: 'MuiAccordionSummary',
|
|
65
66
|
slot: 'Content',
|
|
66
67
|
overridesResolver: (props, styles) => styles.content
|
|
@@ -68,6 +69,7 @@ const AccordionSummaryContent = styled('div', {
|
|
|
68
69
|
theme
|
|
69
70
|
}) => ({
|
|
70
71
|
display: 'flex',
|
|
72
|
+
textAlign: 'start',
|
|
71
73
|
flexGrow: 1,
|
|
72
74
|
margin: '12px 0',
|
|
73
75
|
variants: [{
|
|
@@ -82,7 +84,7 @@ const AccordionSummaryContent = styled('div', {
|
|
|
82
84
|
}
|
|
83
85
|
}]
|
|
84
86
|
})));
|
|
85
|
-
const AccordionSummaryExpandIconWrapper = styled('
|
|
87
|
+
const AccordionSummaryExpandIconWrapper = styled('span', {
|
|
86
88
|
name: 'MuiAccordionSummary',
|
|
87
89
|
slot: 'ExpandIconWrapper',
|
|
88
90
|
overridesResolver: (props, styles) => styles.expandIconWrapper
|
|
@@ -137,7 +139,6 @@ const AccordionSummary = /*#__PURE__*/React.forwardRef(function AccordionSummary
|
|
|
137
139
|
focusRipple: false,
|
|
138
140
|
disableRipple: true,
|
|
139
141
|
disabled: disabled,
|
|
140
|
-
component: "div",
|
|
141
142
|
"aria-expanded": expanded,
|
|
142
143
|
className: clsx(classes.root, className),
|
|
143
144
|
focusVisibleClassName: clsx(classes.focusVisible, focusVisibleClassName),
|
package/AppBar/AppBar.d.ts
CHANGED
|
@@ -30,7 +30,7 @@ export interface AppBarOwnProps {
|
|
|
30
30
|
enableColorOnDark?: boolean;
|
|
31
31
|
/**
|
|
32
32
|
* The positioning type. The behavior of the different options is described
|
|
33
|
-
* [in the MDN web docs](https://developer.mozilla.org/en-US/docs/
|
|
33
|
+
* [in the MDN web docs](https://developer.mozilla.org/en-US/docs/Web/CSS/position).
|
|
34
34
|
* Note: `sticky` is not universally supported and will fall back to `static` when unavailable.
|
|
35
35
|
* @default 'fixed'
|
|
36
36
|
*/
|
package/AppBar/AppBar.js
CHANGED
|
@@ -214,7 +214,7 @@ process.env.NODE_ENV !== "production" ? AppBar.propTypes /* remove-proptypes */
|
|
|
214
214
|
enableColorOnDark: PropTypes.bool,
|
|
215
215
|
/**
|
|
216
216
|
* The positioning type. The behavior of the different options is described
|
|
217
|
-
* [in the MDN web docs](https://developer.mozilla.org/en-US/docs/
|
|
217
|
+
* [in the MDN web docs](https://developer.mozilla.org/en-US/docs/Web/CSS/position).
|
|
218
218
|
* Note: `sticky` is not universally supported and will fall back to `static` when unavailable.
|
|
219
219
|
* @default 'fixed'
|
|
220
220
|
*/
|
|
@@ -650,53 +650,6 @@ const Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps
|
|
|
650
650
|
};
|
|
651
651
|
const clearIndicatorSlotProps = externalForwardedProps.slotProps.clearIndicator;
|
|
652
652
|
const popupIndicatorSlotProps = externalForwardedProps.slotProps.popupIndicator;
|
|
653
|
-
const renderAutocompletePopperChildren = children => /*#__PURE__*/_jsx(AutocompletePopper, {
|
|
654
|
-
as: PopperSlot,
|
|
655
|
-
...popperProps,
|
|
656
|
-
children: /*#__PURE__*/_jsx(AutocompletePaper, {
|
|
657
|
-
as: PaperSlot,
|
|
658
|
-
...paperProps,
|
|
659
|
-
children: children
|
|
660
|
-
})
|
|
661
|
-
});
|
|
662
|
-
let autocompletePopper = null;
|
|
663
|
-
if (groupedOptions.length > 0) {
|
|
664
|
-
autocompletePopper = renderAutocompletePopperChildren(
|
|
665
|
-
/*#__PURE__*/
|
|
666
|
-
// TODO v7: remove `as` prop and move ListboxComponentProp to externalForwardedProps or remove ListboxComponentProp entirely
|
|
667
|
-
// https://github.com/mui/material-ui/pull/43994#issuecomment-2401945800
|
|
668
|
-
_jsx(ListboxSlot, {
|
|
669
|
-
as: ListboxComponentProp,
|
|
670
|
-
...listboxProps,
|
|
671
|
-
children: groupedOptions.map((option, index) => {
|
|
672
|
-
if (groupBy) {
|
|
673
|
-
return renderGroup({
|
|
674
|
-
key: option.key,
|
|
675
|
-
group: option.group,
|
|
676
|
-
children: option.options.map((option2, index2) => renderListOption(option2, option.index + index2))
|
|
677
|
-
});
|
|
678
|
-
}
|
|
679
|
-
return renderListOption(option, index);
|
|
680
|
-
})
|
|
681
|
-
}));
|
|
682
|
-
} else if (loading && groupedOptions.length === 0) {
|
|
683
|
-
autocompletePopper = renderAutocompletePopperChildren(/*#__PURE__*/_jsx(AutocompleteLoading, {
|
|
684
|
-
className: classes.loading,
|
|
685
|
-
ownerState: ownerState,
|
|
686
|
-
children: loadingText
|
|
687
|
-
}));
|
|
688
|
-
} else if (groupedOptions.length === 0 && !freeSolo && !loading) {
|
|
689
|
-
autocompletePopper = renderAutocompletePopperChildren(/*#__PURE__*/_jsx(AutocompleteNoOptions, {
|
|
690
|
-
className: classes.noOptions,
|
|
691
|
-
ownerState: ownerState,
|
|
692
|
-
role: "presentation",
|
|
693
|
-
onMouseDown: event => {
|
|
694
|
-
// Prevent input blur when interacting with the "no options" content
|
|
695
|
-
event.preventDefault();
|
|
696
|
-
},
|
|
697
|
-
children: noOptionsText
|
|
698
|
-
}));
|
|
699
|
-
}
|
|
700
653
|
return /*#__PURE__*/_jsxs(React.Fragment, {
|
|
701
654
|
children: [/*#__PURE__*/_jsx(AutocompleteRoot, {
|
|
702
655
|
ref: ref,
|
|
@@ -750,7 +703,41 @@ const Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps
|
|
|
750
703
|
...getInputProps()
|
|
751
704
|
}
|
|
752
705
|
})
|
|
753
|
-
}), anchorEl ?
|
|
706
|
+
}), anchorEl ? /*#__PURE__*/_jsx(AutocompletePopper, {
|
|
707
|
+
as: PopperSlot,
|
|
708
|
+
...popperProps,
|
|
709
|
+
children: /*#__PURE__*/_jsxs(AutocompletePaper, {
|
|
710
|
+
as: PaperSlot,
|
|
711
|
+
...paperProps,
|
|
712
|
+
children: [loading && groupedOptions.length === 0 ? /*#__PURE__*/_jsx(AutocompleteLoading, {
|
|
713
|
+
className: classes.loading,
|
|
714
|
+
ownerState: ownerState,
|
|
715
|
+
children: loadingText
|
|
716
|
+
}) : null, groupedOptions.length === 0 && !freeSolo && !loading ? /*#__PURE__*/_jsx(AutocompleteNoOptions, {
|
|
717
|
+
className: classes.noOptions,
|
|
718
|
+
ownerState: ownerState,
|
|
719
|
+
role: "presentation",
|
|
720
|
+
onMouseDown: event => {
|
|
721
|
+
// Prevent input blur when interacting with the "no options" content
|
|
722
|
+
event.preventDefault();
|
|
723
|
+
},
|
|
724
|
+
children: noOptionsText
|
|
725
|
+
}) : null, groupedOptions.length > 0 ? /*#__PURE__*/_jsx(ListboxSlot, {
|
|
726
|
+
as: ListboxComponentProp,
|
|
727
|
+
...listboxProps,
|
|
728
|
+
children: groupedOptions.map((option, index) => {
|
|
729
|
+
if (groupBy) {
|
|
730
|
+
return renderGroup({
|
|
731
|
+
key: option.key,
|
|
732
|
+
group: option.group,
|
|
733
|
+
children: option.options.map((option2, index2) => renderListOption(option2, option.index + index2))
|
|
734
|
+
});
|
|
735
|
+
}
|
|
736
|
+
return renderListOption(option, index);
|
|
737
|
+
})
|
|
738
|
+
}) : null]
|
|
739
|
+
})
|
|
740
|
+
}) : null]
|
|
754
741
|
});
|
|
755
742
|
});
|
|
756
743
|
process.env.NODE_ENV !== "production" ? Autocomplete.propTypes /* remove-proptypes */ = {
|
|
@@ -952,7 +939,7 @@ process.env.NODE_ENV !== "production" ? Autocomplete.propTypes /* remove-proptyp
|
|
|
952
939
|
* If provided, the options will be grouped under the returned string.
|
|
953
940
|
* The groupBy value is also used as the text for group headings when `renderGroup` is not provided.
|
|
954
941
|
*
|
|
955
|
-
* @param {Value}
|
|
942
|
+
* @param {Value} option The Autocomplete option.
|
|
956
943
|
* @returns {string}
|
|
957
944
|
*/
|
|
958
945
|
groupBy: PropTypes.func,
|
package/Backdrop/Backdrop.js
CHANGED
|
@@ -10,13 +10,6 @@ import useSlot from "../utils/useSlot.js";
|
|
|
10
10
|
import Fade from "../Fade/index.js";
|
|
11
11
|
import { getBackdropUtilityClass } from "./backdropClasses.js";
|
|
12
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
|
-
const removeOwnerState = props => {
|
|
14
|
-
const {
|
|
15
|
-
ownerState,
|
|
16
|
-
...rest
|
|
17
|
-
} = props;
|
|
18
|
-
return rest;
|
|
19
|
-
};
|
|
20
13
|
const useUtilityClasses = ownerState => {
|
|
21
14
|
const {
|
|
22
15
|
classes,
|
|
@@ -105,12 +98,11 @@ const Backdrop = /*#__PURE__*/React.forwardRef(function Backdrop(inProps, ref) {
|
|
|
105
98
|
externalForwardedProps,
|
|
106
99
|
ownerState
|
|
107
100
|
});
|
|
108
|
-
const transitionPropsRemoved = removeOwnerState(transitionProps);
|
|
109
101
|
return /*#__PURE__*/_jsx(TransitionSlot, {
|
|
110
102
|
in: open,
|
|
111
103
|
timeout: transitionDuration,
|
|
112
104
|
...other,
|
|
113
|
-
...
|
|
105
|
+
...transitionProps,
|
|
114
106
|
children: /*#__PURE__*/_jsx(RootSlot, {
|
|
115
107
|
"aria-hidden": true,
|
|
116
108
|
...rootProps,
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,82 @@
|
|
|
1
1
|
# [Versions](https://mui.com/versions/)
|
|
2
2
|
|
|
3
|
+
## 6.3.1
|
|
4
|
+
|
|
5
|
+
<!-- generated comparing v6.3.0..master -->
|
|
6
|
+
|
|
7
|
+
_Jan 3, 2025_
|
|
8
|
+
|
|
9
|
+
A big thanks to the 8 contributors who made this release possible.
|
|
10
|
+
|
|
11
|
+
### `@mui/material@6.3.1`
|
|
12
|
+
|
|
13
|
+
- [Autocomplete] Revert: Fix options list rendering in freeSolo mode (#44858) @ZeeshanTamboli
|
|
14
|
+
- [Tooltip] Warn instead of error when trigger is disabled (#44846) @yash49
|
|
15
|
+
- [TableSortLabel] Add slots and slotProps (#44728) @sai6855
|
|
16
|
+
- [Select] Deprecate composed classes (#44925) @sai6855
|
|
17
|
+
|
|
18
|
+
### Docs
|
|
19
|
+
|
|
20
|
+
- [material-ui][Accordion] Update `Anatomy` section in Accordion docs (#44849) @ZeeshanTamboli
|
|
21
|
+
- [material-ui][CardActionArea] Added demo in docs of cards for adding props to CardActionArea (#44789) @siddhantantil39
|
|
22
|
+
- [material-ui][Grid2] Add interactive demo for Grid v2 (#44820) @yash49
|
|
23
|
+
- [material-ui][Select] Update docs to reflect the omission of placeholder prop (#44856) @adityaparab
|
|
24
|
+
- [joy-ui] Fix Color mode button on Theme builder (#44864) @komkanit
|
|
25
|
+
- Fix 301 redirections @oliviertassinari
|
|
26
|
+
|
|
27
|
+
### Core
|
|
28
|
+
|
|
29
|
+
- [examples] Update Next.js examples Next.js and React versions (#44852) @DiegoAndai
|
|
30
|
+
- [code-infra] Prevent wrong nested imports in Base UI (#44426) @oliviertassinari
|
|
31
|
+
- [docs-infra] Add vale coverage for App Router and Page Router (060c55c) @oliviertassinari
|
|
32
|
+
- Sync with other repos (1b9300f) @oliviertassinari
|
|
33
|
+
- Fix docs:build to work in docs folder too (6b923a4) @oliviertassinari
|
|
34
|
+
- Setup React 18 CI tests (#44868) @DiegoAndai
|
|
35
|
+
- Update test to use public API (#44875) @oliviertassinari
|
|
36
|
+
|
|
37
|
+
All contributors of this release in alphabetical order: @adityaparab, @DiegoAndai, @komkanit, @oliviertassinari, @sai6855, @siddhantantil39, @yash49, @ZeeshanTamboli
|
|
38
|
+
|
|
39
|
+
## 6.3.0
|
|
40
|
+
|
|
41
|
+
<!-- generated comparing v6.2.1..master -->
|
|
42
|
+
|
|
43
|
+
_Dec 23, 2024_
|
|
44
|
+
|
|
45
|
+
A big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
|
|
46
|
+
|
|
47
|
+
- Fix invalid HTML structure in the Accordion component (#44408) @ZeeshanTamboli
|
|
48
|
+
The HTML elements of the Accordion summary have been updated:
|
|
49
|
+
- the root element is now button (previously div).
|
|
50
|
+
- summary content and the icon wrapper are now span (previously div).
|
|
51
|
+
This will only impact you if you used the HTML element as selectors in your styles.
|
|
52
|
+
|
|
53
|
+
### `@mui/material@6.3.0`
|
|
54
|
+
|
|
55
|
+
- [Accordion] Fix invalid HTML inside heading (#44408) @ZeeshanTamboli
|
|
56
|
+
- [useAutocomplete] Improve TS typing of `groupedOptions` prop (#44657) @lewxdev
|
|
57
|
+
- Prevent `ownerState` propagation for transition slots (#44401) @ZeeshanTamboli
|
|
58
|
+
- [StepContent] Add slots and slotProps (#44742) @sai6855
|
|
59
|
+
- [TablePagination] Add the rest of `slots` and `slotProps`. (#44570) @siriwatknp
|
|
60
|
+
|
|
61
|
+
### `@mui/system@6.3.0`
|
|
62
|
+
|
|
63
|
+
- Set `before` directly without using prepend for global styles (#44648) @siriwatknp
|
|
64
|
+
|
|
65
|
+
### Docs
|
|
66
|
+
|
|
67
|
+
- [material-ui] Improve `theme.applyStyles()` docs (#44658) @DiegoAndai
|
|
68
|
+
- [material-ui] Update MD callout (#43958) @aarongarciah
|
|
69
|
+
|
|
70
|
+
### Core
|
|
71
|
+
|
|
72
|
+
- Remove unnecessary conditional around `.muiName =` (#44071) @Janpot
|
|
73
|
+
- [blog] Material UI: 2024 EOY updates blog post (#44722) @alelthomas
|
|
74
|
+
- Fix quickstart command in pigment docs (#44806) @yash49
|
|
75
|
+
- [docs-infra] Remove Next.js production profiler (#44823) @romgrk
|
|
76
|
+
- [docs-infra] Remove no longer support `optimizeFonts` Next.js option (#44802) @LukasTy
|
|
77
|
+
|
|
78
|
+
All contributors of this release in alphabetical order: @aarongarciah, @alelthomas, @DiegoAndai, @Janpot, @lewxdev, @LukasTy, @romgrk, @sai6855, @siriwatknp, @yash49, @ZeeshanTamboli
|
|
79
|
+
|
|
3
80
|
## 6.2.1
|
|
4
81
|
|
|
5
82
|
<!-- generated comparing v6.2.0..master -->
|
package/Collapse/Collapse.js
CHANGED
|
@@ -272,7 +272,10 @@ const Collapse = /*#__PURE__*/React.forwardRef(function Collapse(inProps, ref) {
|
|
|
272
272
|
nodeRef: nodeRef,
|
|
273
273
|
timeout: timeout === 'auto' ? null : timeout,
|
|
274
274
|
...other,
|
|
275
|
-
children: (state,
|
|
275
|
+
children: (state, {
|
|
276
|
+
ownerState: incomingOwnerState,
|
|
277
|
+
...restChildProps
|
|
278
|
+
}) => /*#__PURE__*/_jsx(CollapseRoot, {
|
|
276
279
|
as: component,
|
|
277
280
|
className: clsx(classes.root, className, {
|
|
278
281
|
'entered': classes.entered,
|
|
@@ -283,13 +286,11 @@ const Collapse = /*#__PURE__*/React.forwardRef(function Collapse(inProps, ref) {
|
|
|
283
286
|
...style
|
|
284
287
|
},
|
|
285
288
|
ref: handleRef,
|
|
286
|
-
...childProps,
|
|
287
|
-
// `ownerState` is set after `childProps` to override any existing `ownerState` property in `childProps`
|
|
288
|
-
// that might have been forwarded from the Transition component.
|
|
289
289
|
ownerState: {
|
|
290
290
|
...ownerState,
|
|
291
291
|
state
|
|
292
292
|
},
|
|
293
|
+
...restChildProps,
|
|
293
294
|
children: /*#__PURE__*/_jsx(CollapseWrapper, {
|
|
294
295
|
ownerState: {
|
|
295
296
|
...ownerState,
|
package/Fade/Fade.js
CHANGED
|
@@ -114,7 +114,10 @@ const Fade = /*#__PURE__*/React.forwardRef(function Fade(props, ref) {
|
|
|
114
114
|
addEndListener: handleAddEndListener,
|
|
115
115
|
timeout: timeout,
|
|
116
116
|
...other,
|
|
117
|
-
children: (state,
|
|
117
|
+
children: (state, {
|
|
118
|
+
ownerState,
|
|
119
|
+
...restChildProps
|
|
120
|
+
}) => {
|
|
118
121
|
return /*#__PURE__*/React.cloneElement(children, {
|
|
119
122
|
style: {
|
|
120
123
|
opacity: 0,
|
|
@@ -124,7 +127,7 @@ const Fade = /*#__PURE__*/React.forwardRef(function Fade(props, ref) {
|
|
|
124
127
|
...children.props.style
|
|
125
128
|
},
|
|
126
129
|
ref: handleRef,
|
|
127
|
-
...
|
|
130
|
+
...restChildProps
|
|
128
131
|
});
|
|
129
132
|
}
|
|
130
133
|
});
|
|
@@ -512,7 +512,5 @@ process.env.NODE_ENV !== "production" ? FilledInput.propTypes /* remove-proptype
|
|
|
512
512
|
*/
|
|
513
513
|
value: PropTypes.any
|
|
514
514
|
} : void 0;
|
|
515
|
-
|
|
516
|
-
FilledInput.muiName = 'Input';
|
|
517
|
-
}
|
|
515
|
+
FilledInput.muiName = 'Input';
|
|
518
516
|
export default FilledInput;
|
package/Grow/Grow.js
CHANGED
|
@@ -163,7 +163,10 @@ const Grow = /*#__PURE__*/React.forwardRef(function Grow(props, ref) {
|
|
|
163
163
|
addEndListener: handleAddEndListener,
|
|
164
164
|
timeout: timeout === 'auto' ? null : timeout,
|
|
165
165
|
...other,
|
|
166
|
-
children: (state,
|
|
166
|
+
children: (state, {
|
|
167
|
+
ownerState,
|
|
168
|
+
...restChildProps
|
|
169
|
+
}) => {
|
|
167
170
|
return /*#__PURE__*/React.cloneElement(children, {
|
|
168
171
|
style: {
|
|
169
172
|
opacity: 0,
|
|
@@ -174,7 +177,7 @@ const Grow = /*#__PURE__*/React.forwardRef(function Grow(props, ref) {
|
|
|
174
177
|
...children.props.style
|
|
175
178
|
},
|
|
176
179
|
ref: handleRef,
|
|
177
|
-
...
|
|
180
|
+
...restChildProps
|
|
178
181
|
});
|
|
179
182
|
}
|
|
180
183
|
});
|
package/Icon/Icon.js
CHANGED
|
@@ -181,7 +181,5 @@ process.env.NODE_ENV !== "production" ? Icon.propTypes /* remove-proptypes */ =
|
|
|
181
181
|
*/
|
|
182
182
|
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
|
|
183
183
|
} : void 0;
|
|
184
|
-
|
|
185
|
-
Icon.muiName = 'Icon';
|
|
186
|
-
}
|
|
184
|
+
Icon.muiName = 'Icon';
|
|
187
185
|
export default Icon;
|
package/Input/Input.js
CHANGED
|
@@ -406,7 +406,5 @@ process.env.NODE_ENV !== "production" ? OutlinedInput.propTypes /* remove-propty
|
|
|
406
406
|
*/
|
|
407
407
|
value: PropTypes.any
|
|
408
408
|
} : void 0;
|
|
409
|
-
|
|
410
|
-
OutlinedInput.muiName = 'Input';
|
|
411
|
-
}
|
|
409
|
+
OutlinedInput.muiName = 'Input';
|
|
412
410
|
export default OutlinedInput;
|
|
@@ -19,11 +19,17 @@ export interface SelectClasses {
|
|
|
19
19
|
icon: string;
|
|
20
20
|
/** Styles applied to the icon component if the popup is open. */
|
|
21
21
|
iconOpen: string;
|
|
22
|
-
/** Styles applied to the icon component if `variant="filled"`.
|
|
22
|
+
/** Styles applied to the icon component if `variant="filled"`.
|
|
23
|
+
* @deprecated Combine the [.MuiSelect-icon](/material-ui/api/select/#select-classes-icon) and [.MuiSelect-filled](/material-ui/api/select/#select-classes-filled) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
|
|
24
|
+
*/
|
|
23
25
|
iconFilled: string;
|
|
24
|
-
/** Styles applied to the icon component if `variant="outlined"`.
|
|
26
|
+
/** Styles applied to the icon component if `variant="outlined"`.
|
|
27
|
+
* @deprecated Combine the [.MuiSelect-icon](/material-ui/api/select/#select-classes-icon) and [.MuiSelect-outlined](/material-ui/api/select/#select-classes-outlined) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
|
|
28
|
+
*/
|
|
25
29
|
iconOutlined: string;
|
|
26
|
-
/** Styles applied to the icon component if `variant="standard"`.
|
|
30
|
+
/** Styles applied to the icon component if `variant="standard"`.
|
|
31
|
+
* @deprecated Combine the [.MuiSelect-icon](/material-ui/api/select/#select-classes-icon) and [.MuiSelect-standard](/material-ui/api/select/#select-classes-standard) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
|
|
32
|
+
*/
|
|
27
33
|
iconStandard: string;
|
|
28
34
|
/** Styles applied to the underlying native input component. */
|
|
29
35
|
nativeInput: string;
|
package/Slide/Slide.js
CHANGED
|
@@ -217,7 +217,10 @@ const Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {
|
|
|
217
217
|
in: inProp,
|
|
218
218
|
timeout: timeout,
|
|
219
219
|
...other,
|
|
220
|
-
children: (state,
|
|
220
|
+
children: (state, {
|
|
221
|
+
ownerState,
|
|
222
|
+
...restChildProps
|
|
223
|
+
}) => {
|
|
221
224
|
return /*#__PURE__*/React.cloneElement(children, {
|
|
222
225
|
ref: handleRef,
|
|
223
226
|
style: {
|
|
@@ -225,7 +228,7 @@ const Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {
|
|
|
225
228
|
...style,
|
|
226
229
|
...children.props.style
|
|
227
230
|
},
|
|
228
|
-
...
|
|
231
|
+
...restChildProps
|
|
229
232
|
});
|
|
230
233
|
}
|
|
231
234
|
});
|
|
@@ -1,11 +1,38 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { SxProps } from '@mui/system';
|
|
3
|
-
import { InternalStandardProps as StandardProps } from '..';
|
|
3
|
+
import { CollapseProps, InternalStandardProps as StandardProps } from '..';
|
|
4
4
|
import { Theme } from '../styles';
|
|
5
5
|
import { TransitionProps } from '../transitions/transition';
|
|
6
6
|
import { StepContentClasses } from './stepContentClasses';
|
|
7
|
+
import { CreateSlotsAndSlotProps, SlotProps } from '../utils/types';
|
|
7
8
|
|
|
8
|
-
export interface
|
|
9
|
+
export interface StepContentSlots {
|
|
10
|
+
/**
|
|
11
|
+
* The component that renders the transition slot.
|
|
12
|
+
* [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
|
|
13
|
+
* @default Collapse
|
|
14
|
+
*/
|
|
15
|
+
transition?: React.JSXElementConstructor<
|
|
16
|
+
TransitionProps & { children?: React.ReactElement<unknown, any> }
|
|
17
|
+
>;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
export type StepContentSlotsAndSlotProps = CreateSlotsAndSlotProps<
|
|
21
|
+
StepContentSlots,
|
|
22
|
+
{
|
|
23
|
+
/**
|
|
24
|
+
* Props forwared to the transition slot.
|
|
25
|
+
* By default, the available props are based on the [Collapse](https://mui.com/material-ui/api/collapse/#props) component
|
|
26
|
+
*/
|
|
27
|
+
transition: SlotProps<React.ElementType<CollapseProps>, {}, StepContentOwnerState>;
|
|
28
|
+
}
|
|
29
|
+
>;
|
|
30
|
+
|
|
31
|
+
export interface StepContentOwnerState extends StepContentProps {}
|
|
32
|
+
|
|
33
|
+
export interface StepContentProps
|
|
34
|
+
extends StandardProps<React.HTMLAttributes<HTMLDivElement>>,
|
|
35
|
+
StepContentSlotsAndSlotProps {
|
|
9
36
|
/**
|
|
10
37
|
* The content of the component.
|
|
11
38
|
*/
|
|
@@ -22,6 +49,7 @@ export interface StepContentProps extends StandardProps<React.HTMLAttributes<HTM
|
|
|
22
49
|
* The component used for the transition.
|
|
23
50
|
* [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
|
|
24
51
|
* @default Collapse
|
|
52
|
+
* @deprecated Use `slots.transition` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
|
|
25
53
|
*/
|
|
26
54
|
TransitionComponent?: React.JSXElementConstructor<
|
|
27
55
|
TransitionProps & { children: React.ReactElement<unknown, any> }
|
|
@@ -37,6 +65,7 @@ export interface StepContentProps extends StandardProps<React.HTMLAttributes<HTM
|
|
|
37
65
|
/**
|
|
38
66
|
* Props applied to the transition element.
|
|
39
67
|
* By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
|
|
68
|
+
* @deprecated Use `slotProps.transition` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
|
|
40
69
|
*/
|
|
41
70
|
TransitionProps?: TransitionProps;
|
|
42
71
|
}
|
|
@@ -11,6 +11,7 @@ import Collapse from "../Collapse/index.js";
|
|
|
11
11
|
import StepperContext from "../Stepper/StepperContext.js";
|
|
12
12
|
import StepContext from "../Step/StepContext.js";
|
|
13
13
|
import { getStepContentUtilityClass } from "./stepContentClasses.js";
|
|
14
|
+
import useSlot from "../utils/useSlot.js";
|
|
14
15
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
15
16
|
const useUtilityClasses = ownerState => {
|
|
16
17
|
const {
|
|
@@ -66,6 +67,8 @@ const StepContent = /*#__PURE__*/React.forwardRef(function StepContent(inProps,
|
|
|
66
67
|
TransitionComponent = Collapse,
|
|
67
68
|
transitionDuration: transitionDurationProp = 'auto',
|
|
68
69
|
TransitionProps,
|
|
70
|
+
slots = {},
|
|
71
|
+
slotProps = {},
|
|
69
72
|
...other
|
|
70
73
|
} = props;
|
|
71
74
|
const {
|
|
@@ -90,19 +93,32 @@ const StepContent = /*#__PURE__*/React.forwardRef(function StepContent(inProps,
|
|
|
90
93
|
if (transitionDurationProp === 'auto' && !TransitionComponent.muiSupportAuto) {
|
|
91
94
|
transitionDuration = undefined;
|
|
92
95
|
}
|
|
96
|
+
const externalForwardedProps = {
|
|
97
|
+
slots,
|
|
98
|
+
slotProps: {
|
|
99
|
+
transition: TransitionProps,
|
|
100
|
+
...slotProps
|
|
101
|
+
}
|
|
102
|
+
};
|
|
103
|
+
const [TransitionSlot, transitionProps] = useSlot('transition', {
|
|
104
|
+
elementType: StepContentTransition,
|
|
105
|
+
externalForwardedProps,
|
|
106
|
+
ownerState,
|
|
107
|
+
className: classes.transition,
|
|
108
|
+
additionalProps: {
|
|
109
|
+
in: active || expanded,
|
|
110
|
+
timeout: transitionDuration,
|
|
111
|
+
unmountOnExit: true
|
|
112
|
+
}
|
|
113
|
+
});
|
|
93
114
|
return /*#__PURE__*/_jsx(StepContentRoot, {
|
|
94
115
|
className: clsx(classes.root, className),
|
|
95
116
|
ref: ref,
|
|
96
117
|
ownerState: ownerState,
|
|
97
118
|
...other,
|
|
98
|
-
children: /*#__PURE__*/_jsx(
|
|
119
|
+
children: /*#__PURE__*/_jsx(TransitionSlot, {
|
|
99
120
|
as: TransitionComponent,
|
|
100
|
-
|
|
101
|
-
className: classes.transition,
|
|
102
|
-
ownerState: ownerState,
|
|
103
|
-
timeout: transitionDuration,
|
|
104
|
-
unmountOnExit: true,
|
|
105
|
-
...TransitionProps,
|
|
121
|
+
...transitionProps,
|
|
106
122
|
children: children
|
|
107
123
|
})
|
|
108
124
|
});
|
|
@@ -124,6 +140,20 @@ process.env.NODE_ENV !== "production" ? StepContent.propTypes /* remove-proptype
|
|
|
124
140
|
* @ignore
|
|
125
141
|
*/
|
|
126
142
|
className: PropTypes.string,
|
|
143
|
+
/**
|
|
144
|
+
* The props used for each slot inside.
|
|
145
|
+
* @default {}
|
|
146
|
+
*/
|
|
147
|
+
slotProps: PropTypes.shape({
|
|
148
|
+
transition: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
|
|
149
|
+
}),
|
|
150
|
+
/**
|
|
151
|
+
* The components used for each slot inside.
|
|
152
|
+
* @default {}
|
|
153
|
+
*/
|
|
154
|
+
slots: PropTypes.shape({
|
|
155
|
+
transition: PropTypes.elementType
|
|
156
|
+
}),
|
|
127
157
|
/**
|
|
128
158
|
* The system prop that allows defining system overrides as well as additional CSS styles.
|
|
129
159
|
*/
|
|
@@ -132,6 +162,7 @@ process.env.NODE_ENV !== "production" ? StepContent.propTypes /* remove-proptype
|
|
|
132
162
|
* The component used for the transition.
|
|
133
163
|
* [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
|
|
134
164
|
* @default Collapse
|
|
165
|
+
* @deprecated Use `slots.transition` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
|
|
135
166
|
*/
|
|
136
167
|
TransitionComponent: PropTypes.elementType,
|
|
137
168
|
/**
|
|
@@ -149,6 +180,7 @@ process.env.NODE_ENV !== "production" ? StepContent.propTypes /* remove-proptype
|
|
|
149
180
|
/**
|
|
150
181
|
* Props applied to the transition element.
|
|
151
182
|
* By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
|
|
183
|
+
* @deprecated Use `slotProps.transition` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
|
|
152
184
|
*/
|
|
153
185
|
TransitionProps: PropTypes.object
|
|
154
186
|
} : void 0;
|
package/StepLabel/StepLabel.js
CHANGED
|
@@ -267,7 +267,5 @@ process.env.NODE_ENV !== "production" ? StepLabel.propTypes /* remove-proptypes
|
|
|
267
267
|
*/
|
|
268
268
|
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
|
|
269
269
|
} : void 0;
|
|
270
|
-
|
|
271
|
-
StepLabel.muiName = 'StepLabel';
|
|
272
|
-
}
|
|
270
|
+
StepLabel.muiName = 'StepLabel';
|
|
273
271
|
export default StepLabel;
|
package/SvgIcon/SvgIcon.js
CHANGED