@mui/material 6.0.1 → 6.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Accordion/Accordion.d.ts +2 -2
- package/Alert/Alert.d.ts +2 -2
- package/Alert/Alert.js +4 -3
- package/AppBar/AppBar.js +2 -1
- package/Autocomplete/Autocomplete.d.ts +8 -6
- package/Autocomplete/Autocomplete.js +4 -4
- package/Avatar/Avatar.d.ts +1 -1
- package/AvatarGroup/AvatarGroup.d.ts +1 -1
- package/Backdrop/Backdrop.d.ts +2 -2
- package/Badge/Badge.js +2 -1
- package/Button/Button.js +2 -1
- package/ButtonGroup/ButtonGroup.js +3 -2
- package/CHANGELOG.md +127 -15130
- package/Checkbox/Checkbox.js +3 -2
- package/Chip/Chip.js +6 -5
- package/CircularProgress/CircularProgress.js +2 -1
- package/Dialog/Dialog.js +1 -0
- package/Fab/Fab.js +2 -1
- package/FilledInput/FilledInput.js +2 -1
- package/FormControl/FormControl.d.ts +4 -4
- package/FormControlLabel/FormControlLabel.d.ts +1 -1
- package/FormLabel/FormLabel.js +2 -1
- package/Grid/Grid.d.ts +0 -1
- package/Grid/Grid.js +0 -1
- package/Icon/Icon.js +2 -1
- package/IconButton/IconButton.js +3 -2
- package/Input/Input.js +2 -1
- package/InputAdornment/InputAdornment.js +1 -1
- package/InputBase/InputBase.js +1 -1
- package/LinearProgress/LinearProgress.js +6 -5
- package/Link/Link.js +2 -1
- package/MenuList/MenuList.js +8 -0
- package/Modal/Modal.d.ts +4 -4
- package/NoSsr/NoSsr.d.ts +4 -4
- package/NoSsr/NoSsr.js +4 -4
- package/OutlinedInput/OutlinedInput.js +2 -1
- package/PaginationItem/PaginationItem.d.ts +4 -4
- package/PaginationItem/PaginationItem.js +3 -2
- package/Popover/Popover.d.ts +27 -4
- package/Popover/Popover.js +20 -0
- package/Portal/Portal.js +1 -1
- package/Radio/Radio.js +19 -3
- package/Slider/Slider.js +4 -3
- package/SpeedDial/SpeedDial.d.ts +1 -1
- package/SpeedDialIcon/SpeedDialIcon.js +1 -1
- package/StepButton/StepButton.js +1 -1
- package/StepLabel/StepLabel.d.ts +2 -2
- package/Switch/Switch.js +2 -1
- package/TextField/TextField.d.ts +13 -13
- package/ToggleButton/ToggleButton.js +2 -1
- package/Typography/Typography.js +2 -1
- package/index.js +1 -1
- package/internal/svg-icons/Add.js +1 -1
- package/internal/svg-icons/ArrowDownward.js +1 -1
- package/internal/svg-icons/ArrowDropDown.js +1 -1
- package/internal/svg-icons/Cancel.js +1 -1
- package/internal/svg-icons/CheckBox.js +1 -1
- package/internal/svg-icons/CheckBoxOutlineBlank.js +1 -1
- package/internal/svg-icons/CheckCircle.js +1 -1
- package/internal/svg-icons/Close.js +1 -1
- package/internal/svg-icons/ErrorOutline.js +1 -1
- package/internal/svg-icons/FirstPage.js +1 -1
- package/internal/svg-icons/IndeterminateCheckBox.js +1 -1
- package/internal/svg-icons/InfoOutlined.js +1 -1
- package/internal/svg-icons/KeyboardArrowLeft.js +1 -1
- package/internal/svg-icons/KeyboardArrowRight.js +1 -1
- package/internal/svg-icons/LastPage.js +1 -1
- package/internal/svg-icons/MoreHoriz.js +1 -1
- package/internal/svg-icons/NavigateBefore.js +1 -1
- package/internal/svg-icons/NavigateNext.js +1 -1
- package/internal/svg-icons/Person.js +1 -1
- package/internal/svg-icons/RadioButtonChecked.js +1 -1
- package/internal/svg-icons/RadioButtonUnchecked.js +1 -1
- package/internal/svg-icons/ReportProblemOutlined.js +1 -1
- package/internal/svg-icons/Star.js +1 -1
- package/internal/svg-icons/StarBorder.js +1 -1
- package/internal/svg-icons/SuccessOutlined.js +1 -1
- package/internal/svg-icons/Warning.js +1 -1
- package/modern/Alert/Alert.js +4 -3
- package/modern/AppBar/AppBar.js +2 -1
- package/modern/Autocomplete/Autocomplete.js +4 -4
- package/modern/Badge/Badge.js +2 -1
- package/modern/Button/Button.js +2 -1
- package/modern/ButtonGroup/ButtonGroup.js +3 -2
- package/modern/Checkbox/Checkbox.js +3 -2
- package/modern/Chip/Chip.js +6 -5
- package/modern/CircularProgress/CircularProgress.js +2 -1
- package/modern/Dialog/Dialog.js +1 -0
- package/modern/Fab/Fab.js +2 -1
- package/modern/FilledInput/FilledInput.js +2 -1
- package/modern/FormLabel/FormLabel.js +2 -1
- package/modern/Grid/Grid.js +0 -1
- package/modern/Icon/Icon.js +2 -1
- package/modern/IconButton/IconButton.js +3 -2
- package/modern/Input/Input.js +2 -1
- package/modern/InputAdornment/InputAdornment.js +1 -1
- package/modern/InputBase/InputBase.js +1 -1
- package/modern/LinearProgress/LinearProgress.js +6 -5
- package/modern/Link/Link.js +2 -1
- package/modern/MenuList/MenuList.js +8 -0
- package/modern/NoSsr/NoSsr.js +4 -4
- package/modern/OutlinedInput/OutlinedInput.js +2 -1
- package/modern/PaginationItem/PaginationItem.js +3 -2
- package/modern/Popover/Popover.js +20 -0
- package/modern/Portal/Portal.js +1 -1
- package/modern/Radio/Radio.js +19 -3
- package/modern/Slider/Slider.js +4 -3
- package/modern/SpeedDialIcon/SpeedDialIcon.js +1 -1
- package/modern/StepButton/StepButton.js +1 -1
- package/modern/Switch/Switch.js +2 -1
- package/modern/ToggleButton/ToggleButton.js +2 -1
- package/modern/Typography/Typography.js +2 -1
- package/modern/index.js +1 -1
- package/modern/internal/svg-icons/Add.js +1 -1
- package/modern/internal/svg-icons/ArrowDownward.js +1 -1
- package/modern/internal/svg-icons/ArrowDropDown.js +1 -1
- package/modern/internal/svg-icons/Cancel.js +1 -1
- package/modern/internal/svg-icons/CheckBox.js +1 -1
- package/modern/internal/svg-icons/CheckBoxOutlineBlank.js +1 -1
- package/modern/internal/svg-icons/CheckCircle.js +1 -1
- package/modern/internal/svg-icons/Close.js +1 -1
- package/modern/internal/svg-icons/ErrorOutline.js +1 -1
- package/modern/internal/svg-icons/FirstPage.js +1 -1
- package/modern/internal/svg-icons/IndeterminateCheckBox.js +1 -1
- package/modern/internal/svg-icons/InfoOutlined.js +1 -1
- package/modern/internal/svg-icons/KeyboardArrowLeft.js +1 -1
- package/modern/internal/svg-icons/KeyboardArrowRight.js +1 -1
- package/modern/internal/svg-icons/LastPage.js +1 -1
- package/modern/internal/svg-icons/MoreHoriz.js +1 -1
- package/modern/internal/svg-icons/NavigateBefore.js +1 -1
- package/modern/internal/svg-icons/NavigateNext.js +1 -1
- package/modern/internal/svg-icons/Person.js +1 -1
- package/modern/internal/svg-icons/RadioButtonChecked.js +1 -1
- package/modern/internal/svg-icons/RadioButtonUnchecked.js +1 -1
- package/modern/internal/svg-icons/ReportProblemOutlined.js +1 -1
- package/modern/internal/svg-icons/Star.js +1 -1
- package/modern/internal/svg-icons/StarBorder.js +1 -1
- package/modern/internal/svg-icons/SuccessOutlined.js +1 -1
- package/modern/internal/svg-icons/Warning.js +1 -1
- package/modern/styles/ThemeProviderWithVars.js +5 -3
- package/modern/styles/createGetSelector.js +2 -2
- package/modern/styles/createTheme.js +22 -3
- package/modern/utils/createSimplePaletteValueFilter.js +41 -0
- package/modern/utils/createSvgIcon.js +1 -1
- package/modern/version/index.js +4 -5
- package/node/Alert/Alert.js +4 -3
- package/node/AppBar/AppBar.js +2 -1
- package/node/Autocomplete/Autocomplete.js +4 -4
- package/node/Badge/Badge.js +2 -1
- package/node/Button/Button.js +2 -1
- package/node/ButtonGroup/ButtonGroup.js +3 -2
- package/node/Checkbox/Checkbox.js +3 -2
- package/node/Chip/Chip.js +6 -5
- package/node/CircularProgress/CircularProgress.js +2 -1
- package/node/Dialog/Dialog.js +1 -0
- package/node/Fab/Fab.js +2 -1
- package/node/FilledInput/FilledInput.js +2 -1
- package/node/FormLabel/FormLabel.js +2 -1
- package/node/Grid/Grid.js +0 -1
- package/node/Icon/Icon.js +2 -1
- package/node/IconButton/IconButton.js +3 -2
- package/node/Input/Input.js +2 -1
- package/node/InputAdornment/InputAdornment.js +1 -1
- package/node/InputBase/InputBase.js +1 -1
- package/node/LinearProgress/LinearProgress.js +6 -5
- package/node/Link/Link.js +2 -1
- package/node/MenuList/MenuList.js +8 -0
- package/node/NoSsr/NoSsr.js +4 -4
- package/node/OutlinedInput/OutlinedInput.js +2 -1
- package/node/PaginationItem/PaginationItem.js +3 -2
- package/node/Popover/Popover.js +20 -0
- package/node/Portal/Portal.js +1 -1
- package/node/Radio/Radio.js +19 -3
- package/node/Slider/Slider.js +4 -3
- package/node/SpeedDialIcon/SpeedDialIcon.js +1 -1
- package/node/StepButton/StepButton.js +1 -1
- package/node/Switch/Switch.js +2 -1
- package/node/ToggleButton/ToggleButton.js +2 -1
- package/node/Typography/Typography.js +2 -1
- package/node/index.js +1 -1
- package/node/internal/svg-icons/Add.js +1 -1
- package/node/internal/svg-icons/ArrowDownward.js +1 -1
- package/node/internal/svg-icons/ArrowDropDown.js +1 -1
- package/node/internal/svg-icons/Cancel.js +1 -1
- package/node/internal/svg-icons/CheckBox.js +1 -1
- package/node/internal/svg-icons/CheckBoxOutlineBlank.js +1 -1
- package/node/internal/svg-icons/CheckCircle.js +1 -1
- package/node/internal/svg-icons/Close.js +1 -1
- package/node/internal/svg-icons/ErrorOutline.js +1 -1
- package/node/internal/svg-icons/FirstPage.js +1 -1
- package/node/internal/svg-icons/IndeterminateCheckBox.js +1 -1
- package/node/internal/svg-icons/InfoOutlined.js +1 -1
- package/node/internal/svg-icons/KeyboardArrowLeft.js +1 -1
- package/node/internal/svg-icons/KeyboardArrowRight.js +1 -1
- package/node/internal/svg-icons/LastPage.js +1 -1
- package/node/internal/svg-icons/MoreHoriz.js +1 -1
- package/node/internal/svg-icons/NavigateBefore.js +1 -1
- package/node/internal/svg-icons/NavigateNext.js +1 -1
- package/node/internal/svg-icons/Person.js +1 -1
- package/node/internal/svg-icons/RadioButtonChecked.js +1 -1
- package/node/internal/svg-icons/RadioButtonUnchecked.js +1 -1
- package/node/internal/svg-icons/ReportProblemOutlined.js +1 -1
- package/node/internal/svg-icons/Star.js +1 -1
- package/node/internal/svg-icons/StarBorder.js +1 -1
- package/node/internal/svg-icons/SuccessOutlined.js +1 -1
- package/node/internal/svg-icons/Warning.js +1 -1
- package/node/styles/ThemeProviderWithVars.js +5 -3
- package/node/styles/createTheme.js +22 -3
- package/node/utils/createSimplePaletteValueFilter.js +47 -0
- package/node/utils/createSvgIcon.js +1 -1
- package/node/version/index.js +5 -6
- package/package.json +7 -7
- package/styles/ThemeProviderWithVars.js +5 -3
- package/styles/createGetSelector.js +2 -2
- package/styles/createTheme.js +22 -3
- package/utils/createSimplePaletteValueFilter.d.ts +12 -0
- package/utils/createSimplePaletteValueFilter.js +41 -0
- package/utils/createSvgIcon.js +1 -1
- package/utils/memoTheme.d.ts +1 -1
- package/utils/types.d.ts +3 -2
- package/version/index.d.ts +1 -2
- package/version/index.js +4 -5
package/Radio/Radio.js
CHANGED
|
@@ -10,11 +10,13 @@ import SwitchBase from "../internal/SwitchBase.js";
|
|
|
10
10
|
import RadioButtonIcon from "./RadioButtonIcon.js";
|
|
11
11
|
import capitalize from "../utils/capitalize.js";
|
|
12
12
|
import createChainedFunction from "../utils/createChainedFunction.js";
|
|
13
|
+
import useFormControl from "../FormControl/useFormControl.js";
|
|
13
14
|
import useRadioGroup from "../RadioGroup/useRadioGroup.js";
|
|
14
15
|
import radioClasses, { getRadioUtilityClass } from "./radioClasses.js";
|
|
15
16
|
import rootShouldForwardProp from "../styles/rootShouldForwardProp.js";
|
|
16
17
|
import { styled } from "../zero-styled/index.js";
|
|
17
18
|
import memoTheme from "../utils/memoTheme.js";
|
|
19
|
+
import createSimplePaletteValueFilter from "../utils/createSimplePaletteValueFilter.js";
|
|
18
20
|
import { useDefaultProps } from "../DefaultPropsProvider/index.js";
|
|
19
21
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
20
22
|
const useUtilityClasses = ownerState => {
|
|
@@ -51,6 +53,7 @@ const RadioRoot = styled(SwitchBase, {
|
|
|
51
53
|
variants: [{
|
|
52
54
|
props: {
|
|
53
55
|
color: 'default',
|
|
56
|
+
disabled: false,
|
|
54
57
|
disableRipple: false
|
|
55
58
|
},
|
|
56
59
|
style: {
|
|
@@ -58,9 +61,10 @@ const RadioRoot = styled(SwitchBase, {
|
|
|
58
61
|
backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.activeChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette.action.active, theme.palette.action.hoverOpacity)
|
|
59
62
|
}
|
|
60
63
|
}
|
|
61
|
-
}, ...Object.entries(theme.palette).filter((
|
|
64
|
+
}, ...Object.entries(theme.palette).filter(createSimplePaletteValueFilter()).map(([color]) => ({
|
|
62
65
|
props: {
|
|
63
66
|
color,
|
|
67
|
+
disabled: false,
|
|
64
68
|
disableRipple: false
|
|
65
69
|
},
|
|
66
70
|
style: {
|
|
@@ -68,9 +72,10 @@ const RadioRoot = styled(SwitchBase, {
|
|
|
68
72
|
backgroundColor: theme.vars ? `rgba(${theme.vars.palette[color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[color].main, theme.palette.action.hoverOpacity)
|
|
69
73
|
}
|
|
70
74
|
}
|
|
71
|
-
})), ...Object.entries(theme.palette).filter((
|
|
75
|
+
})), ...Object.entries(theme.palette).filter(createSimplePaletteValueFilter()).map(([color]) => ({
|
|
72
76
|
props: {
|
|
73
|
-
color
|
|
77
|
+
color,
|
|
78
|
+
disabled: false
|
|
74
79
|
},
|
|
75
80
|
style: {
|
|
76
81
|
[`&.${radioClasses.checked}`]: {
|
|
@@ -118,11 +123,21 @@ const Radio = /*#__PURE__*/React.forwardRef(function Radio(inProps, ref) {
|
|
|
118
123
|
onChange: onChangeProp,
|
|
119
124
|
size = 'medium',
|
|
120
125
|
className,
|
|
126
|
+
disabled: disabledProp,
|
|
121
127
|
disableRipple = false,
|
|
122
128
|
...other
|
|
123
129
|
} = props;
|
|
130
|
+
const muiFormControl = useFormControl();
|
|
131
|
+
let disabled = disabledProp;
|
|
132
|
+
if (muiFormControl) {
|
|
133
|
+
if (typeof disabled === 'undefined') {
|
|
134
|
+
disabled = muiFormControl.disabled;
|
|
135
|
+
}
|
|
136
|
+
}
|
|
137
|
+
disabled ??= false;
|
|
124
138
|
const ownerState = {
|
|
125
139
|
...props,
|
|
140
|
+
disabled,
|
|
126
141
|
disableRipple,
|
|
127
142
|
color,
|
|
128
143
|
size
|
|
@@ -148,6 +163,7 @@ const Radio = /*#__PURE__*/React.forwardRef(function Radio(inProps, ref) {
|
|
|
148
163
|
checkedIcon: /*#__PURE__*/React.cloneElement(checkedIcon, {
|
|
149
164
|
fontSize: defaultCheckedIcon.props.fontSize ?? size
|
|
150
165
|
}),
|
|
166
|
+
disabled: disabled,
|
|
151
167
|
ownerState: ownerState,
|
|
152
168
|
classes: classes,
|
|
153
169
|
name: name,
|
package/Slider/Slider.js
CHANGED
|
@@ -16,6 +16,7 @@ import { useDefaultProps } from "../DefaultPropsProvider/index.js";
|
|
|
16
16
|
import slotShouldForwardProp from "../styles/slotShouldForwardProp.js";
|
|
17
17
|
import shouldSpreadAdditionalProps from "../utils/shouldSpreadAdditionalProps.js";
|
|
18
18
|
import capitalize from "../utils/capitalize.js";
|
|
19
|
+
import createSimplePaletteValueFilter from "../utils/createSimplePaletteValueFilter.js";
|
|
19
20
|
import BaseSliderValueLabel from "./SliderValueLabel.js";
|
|
20
21
|
import sliderClasses, { getSliderUtilityClass } from "./sliderClasses.js";
|
|
21
22
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
@@ -54,7 +55,7 @@ export const SliderRoot = styled('span', {
|
|
|
54
55
|
transition: 'none'
|
|
55
56
|
}
|
|
56
57
|
},
|
|
57
|
-
variants: [...Object.entries(theme.palette).filter((
|
|
58
|
+
variants: [...Object.entries(theme.palette).filter(createSimplePaletteValueFilter()).map(([color]) => ({
|
|
58
59
|
props: {
|
|
59
60
|
color
|
|
60
61
|
},
|
|
@@ -210,7 +211,7 @@ export const SliderTrack = styled('span', {
|
|
|
210
211
|
style: {
|
|
211
212
|
display: 'none'
|
|
212
213
|
}
|
|
213
|
-
}, ...Object.entries(theme.palette).filter((
|
|
214
|
+
}, ...Object.entries(theme.palette).filter(createSimplePaletteValueFilter()).map(([color]) => ({
|
|
214
215
|
props: {
|
|
215
216
|
color,
|
|
216
217
|
track: 'inverted'
|
|
@@ -309,7 +310,7 @@ export const SliderThumb = styled('span', {
|
|
|
309
310
|
left: '50%',
|
|
310
311
|
transform: 'translate(-50%, 50%)'
|
|
311
312
|
}
|
|
312
|
-
}, ...Object.entries(theme.palette).filter((
|
|
313
|
+
}, ...Object.entries(theme.palette).filter(createSimplePaletteValueFilter()).map(([color]) => ({
|
|
313
314
|
props: {
|
|
314
315
|
color
|
|
315
316
|
},
|
package/SpeedDial/SpeedDial.d.ts
CHANGED
|
@@ -16,7 +16,7 @@ export interface SpeedDialSlots {
|
|
|
16
16
|
* [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
|
|
17
17
|
* @default {}
|
|
18
18
|
*/
|
|
19
|
-
transition
|
|
19
|
+
transition: React.JSXElementConstructor<
|
|
20
20
|
TransitionProps & { children: React.ReactElement<unknown, any> }
|
|
21
21
|
>;
|
|
22
22
|
}
|
|
@@ -104,7 +104,7 @@ const SpeedDialIcon = /*#__PURE__*/React.forwardRef(function SpeedDialIcon(inPro
|
|
|
104
104
|
const ownerState = props;
|
|
105
105
|
const classes = useUtilityClasses(ownerState);
|
|
106
106
|
function formatIcon(icon, newClassName) {
|
|
107
|
-
if (
|
|
107
|
+
if (/*#__PURE__*/React.isValidElement(icon)) {
|
|
108
108
|
return /*#__PURE__*/React.cloneElement(icon, {
|
|
109
109
|
className: newClassName
|
|
110
110
|
});
|
package/StepButton/StepButton.js
CHANGED
|
@@ -82,7 +82,7 @@ const StepButton = /*#__PURE__*/React.forwardRef(function StepButton(inProps, re
|
|
|
82
82
|
icon,
|
|
83
83
|
optional
|
|
84
84
|
};
|
|
85
|
-
const child = isMuiElement(children, ['StepLabel']) ? (
|
|
85
|
+
const child = isMuiElement(children, ['StepLabel']) ? (/*#__PURE__*/React.cloneElement(children, childProps)) : /*#__PURE__*/_jsx(StepLabel, {
|
|
86
86
|
...childProps,
|
|
87
87
|
children: children
|
|
88
88
|
});
|
package/StepLabel/StepLabel.d.ts
CHANGED
|
@@ -11,11 +11,11 @@ export interface StepLabelSlots {
|
|
|
11
11
|
* The component that renders the label.
|
|
12
12
|
* @default span
|
|
13
13
|
*/
|
|
14
|
-
label
|
|
14
|
+
label: React.ElementType;
|
|
15
15
|
/**
|
|
16
16
|
* The component to render in place of the [`StepIcon`](https://mui.com/material-ui/api/step-icon/).
|
|
17
17
|
*/
|
|
18
|
-
stepIcon
|
|
18
|
+
stepIcon: React.ElementType<StepIconProps>;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
21
|
export type StepLabelSlotsAndSlotProps = CreateSlotsAndSlotProps<
|
package/Switch/Switch.js
CHANGED
|
@@ -8,6 +8,7 @@ import refType from '@mui/utils/refType';
|
|
|
8
8
|
import composeClasses from '@mui/utils/composeClasses';
|
|
9
9
|
import { alpha, darken, lighten } from '@mui/system/colorManipulator';
|
|
10
10
|
import capitalize from "../utils/capitalize.js";
|
|
11
|
+
import createSimplePaletteValueFilter from "../utils/createSimplePaletteValueFilter.js";
|
|
11
12
|
import SwitchBase from "../internal/SwitchBase.js";
|
|
12
13
|
import { styled } from "../zero-styled/index.js";
|
|
13
14
|
import memoTheme from "../utils/memoTheme.js";
|
|
@@ -146,7 +147,7 @@ const SwitchSwitchBase = styled(SwitchBase, {
|
|
|
146
147
|
backgroundColor: 'transparent'
|
|
147
148
|
}
|
|
148
149
|
},
|
|
149
|
-
variants: [...Object.entries(theme.palette).filter(([
|
|
150
|
+
variants: [...Object.entries(theme.palette).filter(createSimplePaletteValueFilter(['light'])) // check all the used fields in the style below
|
|
150
151
|
.map(([color]) => ({
|
|
151
152
|
props: {
|
|
152
153
|
color
|
package/TextField/TextField.d.ts
CHANGED
|
@@ -22,27 +22,27 @@ export interface TextFieldSlots {
|
|
|
22
22
|
* The component that renders the input.
|
|
23
23
|
* @default OutlinedInput
|
|
24
24
|
*/
|
|
25
|
-
input
|
|
25
|
+
input: React.ElementType;
|
|
26
26
|
/**
|
|
27
27
|
* The component that renders the input's label.
|
|
28
28
|
* @default InputLabel
|
|
29
29
|
*/
|
|
30
|
-
inputLabel
|
|
30
|
+
inputLabel: React.ElementType;
|
|
31
31
|
/**
|
|
32
32
|
* The html input element.
|
|
33
33
|
* @default 'input'
|
|
34
34
|
*/
|
|
35
|
-
htmlInput
|
|
35
|
+
htmlInput: React.ElementType;
|
|
36
36
|
/**
|
|
37
37
|
* The component that renders the helper text.
|
|
38
38
|
* @default FormHelperText
|
|
39
39
|
*/
|
|
40
|
-
formHelperText
|
|
40
|
+
formHelperText: React.ElementType;
|
|
41
41
|
/**
|
|
42
42
|
* The component that renders the select.
|
|
43
43
|
* @default Select
|
|
44
44
|
*/
|
|
45
|
-
select
|
|
45
|
+
select: React.ElementType;
|
|
46
46
|
}
|
|
47
47
|
|
|
48
48
|
export type TextFieldSlotsAndSlotProps<InputPropsType> = CreateSlotsAndSlotProps<
|
|
@@ -299,12 +299,12 @@ export type TextFieldOwnerState = BaseTextFieldProps;
|
|
|
299
299
|
* It's important to understand that the text field is a simple abstraction
|
|
300
300
|
* on top of the following components:
|
|
301
301
|
*
|
|
302
|
-
* *
|
|
303
|
-
* *
|
|
304
|
-
* *
|
|
305
|
-
* *
|
|
306
|
-
* *
|
|
307
|
-
* *
|
|
302
|
+
* * [FormControl](https://mui.com/material-ui/api/form-control/)
|
|
303
|
+
* * [InputLabel](https://mui.com/material-ui/api/input-label/)
|
|
304
|
+
* * [FilledInput](https://mui.com/material-ui/api/filled-input/)
|
|
305
|
+
* * [OutlinedInput](https://mui.com/material-ui/api/outlined-input/)
|
|
306
|
+
* * [Input](https://mui.com/material-ui/api/input/)
|
|
307
|
+
* * [FormHelperText](https://mui.com/material-ui/api/form-helper-text/)
|
|
308
308
|
*
|
|
309
309
|
* If you wish to alter the props applied to the `input` element, you can do so as follows:
|
|
310
310
|
*
|
|
@@ -319,8 +319,8 @@ export type TextFieldOwnerState = BaseTextFieldProps;
|
|
|
319
319
|
* For advanced cases, please look at the source of TextField by clicking on the
|
|
320
320
|
* "Edit this page" button above. Consider either:
|
|
321
321
|
*
|
|
322
|
-
* *
|
|
323
|
-
* *
|
|
322
|
+
* * using the upper case props for passing values directly to the components
|
|
323
|
+
* * using the underlying components directly as shown in the demos
|
|
324
324
|
*
|
|
325
325
|
* Demos:
|
|
326
326
|
*
|
|
@@ -11,6 +11,7 @@ import ButtonBase from "../ButtonBase/index.js";
|
|
|
11
11
|
import capitalize from "../utils/capitalize.js";
|
|
12
12
|
import { styled } from "../zero-styled/index.js";
|
|
13
13
|
import memoTheme from "../utils/memoTheme.js";
|
|
14
|
+
import createSimplePaletteValueFilter from "../utils/createSimplePaletteValueFilter.js";
|
|
14
15
|
import { useDefaultProps } from "../DefaultPropsProvider/index.js";
|
|
15
16
|
import toggleButtonClasses, { getToggleButtonUtilityClass } from "./toggleButtonClasses.js";
|
|
16
17
|
import ToggleButtonGroupContext from "../ToggleButtonGroup/ToggleButtonGroupContext.js";
|
|
@@ -77,7 +78,7 @@ const ToggleButtonRoot = styled(ButtonBase, {
|
|
|
77
78
|
}
|
|
78
79
|
}
|
|
79
80
|
}
|
|
80
|
-
}, ...Object.entries(theme.palette).filter((
|
|
81
|
+
}, ...Object.entries(theme.palette).filter(createSimplePaletteValueFilter()).map(([color]) => ({
|
|
81
82
|
props: {
|
|
82
83
|
color
|
|
83
84
|
},
|
package/Typography/Typography.js
CHANGED
|
@@ -8,6 +8,7 @@ import { styled, internal_createExtendSxProp } from "../zero-styled/index.js";
|
|
|
8
8
|
import memoTheme from "../utils/memoTheme.js";
|
|
9
9
|
import { useDefaultProps } from "../DefaultPropsProvider/index.js";
|
|
10
10
|
import capitalize from "../utils/capitalize.js";
|
|
11
|
+
import createSimplePaletteValueFilter from "../utils/createSimplePaletteValueFilter.js";
|
|
11
12
|
import { getTypographyUtilityClass } from "./typographyClasses.js";
|
|
12
13
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
14
|
const v6Colors = {
|
|
@@ -64,7 +65,7 @@ export const TypographyRoot = styled('span', {
|
|
|
64
65
|
variant
|
|
65
66
|
},
|
|
66
67
|
style: value
|
|
67
|
-
})), ...Object.entries(theme.palette).filter((
|
|
68
|
+
})), ...Object.entries(theme.palette).filter(createSimplePaletteValueFilter()).map(([color]) => ({
|
|
68
69
|
props: {
|
|
69
70
|
color
|
|
70
71
|
},
|
package/index.js
CHANGED
|
@@ -7,6 +7,6 @@ import { createSvgIcon } from "../../utils/index.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"
|
|
12
12
|
}), 'Add');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
|
|
12
12
|
}), 'ArrowDownward');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M7 10l5 5 5-5z"
|
|
12
12
|
}), 'ArrowDropDown');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"
|
|
12
12
|
}), 'Cancel');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
|
|
12
12
|
}), 'CheckBox');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
|
|
12
12
|
}), 'CheckBoxOutlineBlank');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M12 0a12 12 0 1 0 0 24 12 12 0 0 0 0-24zm-2 17l-5-5 1.4-1.4 3.6 3.6 7.6-7.6L19 8l-9 9z"
|
|
12
12
|
}), 'CheckCircle');
|
|
@@ -9,6 +9,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
9
9
|
* Alias to `Clear`.
|
|
10
10
|
*/
|
|
11
11
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
12
|
-
export default createSvgIcon(
|
|
12
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
13
13
|
d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
|
|
14
14
|
}), 'Close');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M11 15h2v2h-2zm0-8h2v6h-2zm.99-5C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"
|
|
12
12
|
}), 'ErrorOutline');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M18.41 16.59L13.82 12l4.59-4.59L17 6l-6 6 6 6zM6 6h2v12H6z"
|
|
12
12
|
}), 'FirstPage');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10H7v-2h10v2z"
|
|
12
12
|
}), 'IndeterminateCheckBox');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20, 12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10, 10 0 0,0 12,2M11,17H13V11H11V17Z"
|
|
12
12
|
}), 'InfoOutlined');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z"
|
|
12
12
|
}), 'KeyboardArrowLeft');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"
|
|
12
12
|
}), 'KeyboardArrowRight');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M5.59 7.41L10.18 12l-4.59 4.59L7 18l6-6-6-6zM16 6h2v12h-2z"
|
|
12
12
|
}), 'LastPage');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"
|
|
12
12
|
}), 'MoreHoriz');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"
|
|
12
12
|
}), 'NavigateBefore');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"
|
|
12
12
|
}), 'NavigateNext');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
|
|
12
12
|
}), 'Person');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M8.465 8.465C9.37 7.56 10.62 7 12 7C14.76 7 17 9.24 17 12C17 13.38 16.44 14.63 15.535 15.535C14.63 16.44 13.38 17 12 17C9.24 17 7 14.76 7 12C7 10.62 7.56 9.37 8.465 8.465Z"
|
|
12
12
|
}), 'RadioButtonChecked');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"
|
|
12
12
|
}), 'RadioButtonUnchecked');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M12 5.99L19.53 19H4.47L12 5.99M12 2L1 21h22L12 2zm1 14h-2v2h2v-2zm0-6h-2v4h2v-4z"
|
|
12
12
|
}), 'ReportProblemOutlined');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"
|
|
12
12
|
}), 'Star');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M22 9.24l-7.19-.62L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21 12 17.27 18.18 21l-1.63-7.03L22 9.24zM12 15.4l-3.76 2.27 1-4.28-3.32-2.88 4.38-.38L12 6.1l1.71 4.04 4.38.38-3.32 2.88 1 4.28L12 15.4z"
|
|
12
12
|
}), 'StarBorder');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4C12.76,4 13.5,4.11 14.2, 4.31L15.77,2.74C14.61,2.26 13.34,2 12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0, 0 22,12M7.91,10.08L6.5,11.5L11,16L21,6L19.59,4.58L11,13.17L7.91,10.08Z"
|
|
12
12
|
}), 'SuccessOutlined');
|
|
@@ -7,6 +7,6 @@ import createSvgIcon from "../../utils/createSvgIcon.js";
|
|
|
7
7
|
* @ignore - internal component.
|
|
8
8
|
*/
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
export default createSvgIcon(
|
|
10
|
+
export default createSvgIcon(/*#__PURE__*/_jsx("path", {
|
|
11
11
|
d: "M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z"
|
|
12
12
|
}), 'Warning');
|
package/modern/Alert/Alert.js
CHANGED
|
@@ -10,6 +10,7 @@ import memoTheme from "../utils/memoTheme.js";
|
|
|
10
10
|
import { useDefaultProps } from "../DefaultPropsProvider/index.js";
|
|
11
11
|
import useSlot from "../utils/useSlot.js";
|
|
12
12
|
import capitalize from "../utils/capitalize.js";
|
|
13
|
+
import createSimplePaletteValueFilter from "../utils/createSimplePaletteValueFilter.js";
|
|
13
14
|
import Paper from "../Paper/index.js";
|
|
14
15
|
import alertClasses, { getAlertUtilityClass } from "./alertClasses.js";
|
|
15
16
|
import IconButton from "../IconButton/index.js";
|
|
@@ -53,7 +54,7 @@ const AlertRoot = styled(Paper, {
|
|
|
53
54
|
backgroundColor: 'transparent',
|
|
54
55
|
display: 'flex',
|
|
55
56
|
padding: '6px 16px',
|
|
56
|
-
variants: [...Object.entries(theme.palette).filter(([
|
|
57
|
+
variants: [...Object.entries(theme.palette).filter(createSimplePaletteValueFilter(['light'])).map(([color]) => ({
|
|
57
58
|
props: {
|
|
58
59
|
colorSeverity: color,
|
|
59
60
|
variant: 'standard'
|
|
@@ -67,7 +68,7 @@ const AlertRoot = styled(Paper, {
|
|
|
67
68
|
color: theme.palette[color].main
|
|
68
69
|
}
|
|
69
70
|
}
|
|
70
|
-
})), ...Object.entries(theme.palette).filter(([
|
|
71
|
+
})), ...Object.entries(theme.palette).filter(createSimplePaletteValueFilter(['light'])).map(([color]) => ({
|
|
71
72
|
props: {
|
|
72
73
|
colorSeverity: color,
|
|
73
74
|
variant: 'outlined'
|
|
@@ -81,7 +82,7 @@ const AlertRoot = styled(Paper, {
|
|
|
81
82
|
color: theme.palette[color].main
|
|
82
83
|
}
|
|
83
84
|
}
|
|
84
|
-
})), ...Object.entries(theme.palette).filter(([
|
|
85
|
+
})), ...Object.entries(theme.palette).filter(createSimplePaletteValueFilter(['dark'])).map(([color]) => ({
|
|
85
86
|
props: {
|
|
86
87
|
colorSeverity: color,
|
|
87
88
|
variant: 'filled'
|
package/modern/AppBar/AppBar.js
CHANGED
|
@@ -8,6 +8,7 @@ import { styled } from "../zero-styled/index.js";
|
|
|
8
8
|
import memoTheme from "../utils/memoTheme.js";
|
|
9
9
|
import { useDefaultProps } from "../DefaultPropsProvider/index.js";
|
|
10
10
|
import capitalize from "../utils/capitalize.js";
|
|
11
|
+
import createSimplePaletteValueFilter from "../utils/createSimplePaletteValueFilter.js";
|
|
11
12
|
import Paper from "../Paper/index.js";
|
|
12
13
|
import { getAppBarUtilityClass } from "./appBarClasses.js";
|
|
13
14
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
@@ -114,7 +115,7 @@ const AppBarRoot = styled(Paper, {
|
|
|
114
115
|
'--AppBar-color': theme.vars ? theme.vars.palette.text.primary : theme.palette.getContrastText(theme.palette.grey[900])
|
|
115
116
|
})
|
|
116
117
|
}
|
|
117
|
-
}, ...Object.entries(theme.palette).filter(([
|
|
118
|
+
}, ...Object.entries(theme.palette).filter(createSimplePaletteValueFilter(['contrastText'])).map(([color]) => ({
|
|
118
119
|
props: {
|
|
119
120
|
color
|
|
120
121
|
},
|
|
@@ -604,7 +604,7 @@ const Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps
|
|
|
604
604
|
const more = startAdornment.length - limitTags;
|
|
605
605
|
if (!focused && more > 0) {
|
|
606
606
|
startAdornment = startAdornment.splice(0, limitTags);
|
|
607
|
-
startAdornment.push(
|
|
607
|
+
startAdornment.push(/*#__PURE__*/_jsx("span", {
|
|
608
608
|
className: classes.tag,
|
|
609
609
|
children: getLimitTagsText(more)
|
|
610
610
|
}, startAdornment.length));
|
|
@@ -662,7 +662,7 @@ const Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps
|
|
|
662
662
|
});
|
|
663
663
|
let autocompletePopper = null;
|
|
664
664
|
if (groupedOptions.length > 0) {
|
|
665
|
-
autocompletePopper = renderAutocompletePopperChildren(
|
|
665
|
+
autocompletePopper = renderAutocompletePopperChildren(/*#__PURE__*/_jsx(AutocompleteListbox, {
|
|
666
666
|
as: ListboxSlot,
|
|
667
667
|
...listboxProps,
|
|
668
668
|
children: groupedOptions.map((option, index) => {
|
|
@@ -677,13 +677,13 @@ const Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps
|
|
|
677
677
|
})
|
|
678
678
|
}));
|
|
679
679
|
} else if (loading && groupedOptions.length === 0) {
|
|
680
|
-
autocompletePopper = renderAutocompletePopperChildren(
|
|
680
|
+
autocompletePopper = renderAutocompletePopperChildren(/*#__PURE__*/_jsx(AutocompleteLoading, {
|
|
681
681
|
className: classes.loading,
|
|
682
682
|
ownerState: ownerState,
|
|
683
683
|
children: loadingText
|
|
684
684
|
}));
|
|
685
685
|
} else if (groupedOptions.length === 0 && !freeSolo && !loading) {
|
|
686
|
-
autocompletePopper = renderAutocompletePopperChildren(
|
|
686
|
+
autocompletePopper = renderAutocompletePopperChildren(/*#__PURE__*/_jsx(AutocompleteNoOptions, {
|
|
687
687
|
className: classes.noOptions,
|
|
688
688
|
ownerState: ownerState,
|
|
689
689
|
role: "presentation",
|
package/modern/Badge/Badge.js
CHANGED
|
@@ -9,6 +9,7 @@ import useSlotProps from '@mui/utils/useSlotProps';
|
|
|
9
9
|
import useBadge from "./useBadge.js";
|
|
10
10
|
import { styled } from "../zero-styled/index.js";
|
|
11
11
|
import memoTheme from "../utils/memoTheme.js";
|
|
12
|
+
import createSimplePaletteValueFilter from "../utils/createSimplePaletteValueFilter.js";
|
|
12
13
|
import { useDefaultProps } from "../DefaultPropsProvider/index.js";
|
|
13
14
|
import capitalize from "../utils/capitalize.js";
|
|
14
15
|
import badgeClasses, { getBadgeUtilityClass } from "./badgeClasses.js";
|
|
@@ -75,7 +76,7 @@ const BadgeBadge = styled('span', {
|
|
|
75
76
|
easing: theme.transitions.easing.easeInOut,
|
|
76
77
|
duration: theme.transitions.duration.enteringScreen
|
|
77
78
|
}),
|
|
78
|
-
variants: [...Object.entries(theme.palette).filter(([
|
|
79
|
+
variants: [...Object.entries(theme.palette).filter(createSimplePaletteValueFilter(['contrastText'])).map(([color]) => ({
|
|
79
80
|
props: {
|
|
80
81
|
color
|
|
81
82
|
},
|