@mui/codemod 6.0.0-alpha.6 → 6.0.0-alpha.8
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/README.md +125 -0
- package/node/deprecations/accordion-props/test-cases/actual.js +6 -3
- package/node/deprecations/accordion-props/test-cases/expected.js +14 -10
- package/node/deprecations/accordion-props/test-cases/theme.expected.js +8 -7
- package/node/deprecations/alert-props/test-cases/expected.js +12 -4
- package/node/deprecations/alert-props/test-cases/theme.expected.js +12 -5
- package/node/deprecations/all/deprecations-all.js +6 -0
- package/node/deprecations/all/postcss.config.js +4 -1
- package/node/deprecations/autocomplete-props/autocomplete-props.js +54 -0
- package/node/deprecations/autocomplete-props/index.js +13 -0
- package/node/deprecations/autocomplete-props/test-cases/actual.js +97 -0
- package/node/deprecations/autocomplete-props/test-cases/expected.js +103 -0
- package/node/deprecations/autocomplete-props/test-cases/theme.actual.js +65 -0
- package/node/deprecations/autocomplete-props/test-cases/theme.expected.js +69 -0
- package/node/deprecations/avatar-props/test-cases/expected.js +8 -6
- package/node/deprecations/avatar-props/test-cases/theme.expected.js +8 -7
- package/node/deprecations/backdrop-props/test-cases/actual.js +3 -2
- package/node/deprecations/backdrop-props/test-cases/expected.js +3 -3
- package/node/deprecations/badge-props/test-cases/expected.js +12 -5
- package/node/deprecations/badge-props/test-cases/theme.expected.js +12 -5
- package/node/deprecations/circular-progress-classes/circular-progress-classes.js +77 -0
- package/node/deprecations/circular-progress-classes/index.js +13 -0
- package/node/deprecations/circular-progress-classes/postcss-plugin.js +33 -0
- package/node/deprecations/circular-progress-classes/postcss.config.js +8 -0
- package/node/deprecations/circular-progress-classes/test-cases/actual.js +7 -0
- package/node/deprecations/circular-progress-classes/test-cases/expected.js +7 -0
- package/node/deprecations/divider-props/divider-props.js +36 -30
- package/node/deprecations/divider-props/test-cases/actual.js +3 -0
- package/node/deprecations/divider-props/test-cases/expected.js +3 -0
- package/node/deprecations/divider-props/test-cases/theme.actual.js +7 -0
- package/node/deprecations/divider-props/test-cases/theme.expected.js +7 -0
- package/node/deprecations/form-control-label-props/test-cases/expected.js +4 -2
- package/node/deprecations/form-control-label-props/test-cases/theme.expected.js +4 -3
- package/node/deprecations/slider-props/test-cases/expected.js +12 -4
- package/node/deprecations/slider-props/test-cases/theme.expected.js +12 -5
- package/node/deprecations/speed-dial-props/test-cases/actual.js +3 -2
- package/node/deprecations/speed-dial-props/test-cases/expected.js +3 -3
- package/node/deprecations/step-label-props/test-cases/expected.js +8 -3
- package/node/deprecations/step-label-props/test-cases/theme.expected.js +8 -4
- package/node/deprecations/text-field-props/index.js +13 -0
- package/node/deprecations/text-field-props/test-cases/actual.js +27 -0
- package/node/deprecations/text-field-props/test-cases/expected.js +31 -0
- package/node/deprecations/text-field-props/test-cases/theme.actual.js +13 -0
- package/node/deprecations/text-field-props/test-cases/theme.expected.js +15 -0
- package/node/deprecations/text-field-props/text-field-props.js +48 -0
- package/node/deprecations/utils/replaceComponentsWithSlots.js +29 -17
- package/node/util/migrateToVariants.js +50 -31
- package/node/v5.0.0/badge-overlap-value.test/actual.js +3 -4
- package/node/v5.0.0/badge-overlap-value.test/expected.js +3 -4
- package/node/v5.0.0/base-remove-component-prop.test/actual.js +4 -4
- package/node/v5.0.0/base-remove-component-prop.test/expected.js +4 -4
- package/node/v5.0.0/box-sx-prop.test/actual.js +4 -4
- package/node/v5.0.0/box-sx-prop.test/expected.js +3 -3
- package/node/v5.0.0/create-theme.test/custom-fn.actual.js +3 -4
- package/node/v5.0.0/create-theme.test/custom-fn.expected.js +3 -4
- package/node/v5.0.0/jss-to-styled.test/first.actual.js +11 -14
- package/node/v5.0.0/jss-to-styled.test/first.expected.js +11 -14
- package/node/v5.0.0/jss-to-styled.test/seventh.actual.js +4 -4
- package/node/v5.0.0/jss-to-styled.test/seventh.expected.js +4 -4
- package/node/v5.0.0/jss-to-styled.test/sixth.actual.js +3 -3
- package/node/v5.0.0/jss-to-styled.test/sixth.expected.js +3 -3
- package/node/v5.0.0/jss-to-styled.test/withCreateStyles.actual.js +3 -3
- package/node/v5.0.0/jss-to-styled.test/withCreateStyles.expected.js +3 -4
- package/node/v5.0.0/jss-to-styled.test/withCreateStyles1.actual.js +3 -3
- package/node/v5.0.0/jss-to-styled.test/withCreateStyles1.expected.js +3 -4
- package/node/v5.0.0/jss-to-styled.test/withCreateStyles2.actual.js +3 -3
- package/node/v5.0.0/jss-to-styled.test/withCreateStyles2.expected.js +3 -4
- package/node/v5.0.0/jss-to-styled.test/withCreateStyles3.actual.js +3 -3
- package/node/v5.0.0/jss-to-styled.test/withCreateStyles3.expected.js +3 -4
- package/node/v5.0.0/jss-to-tss-react.test/actual-mixins-pattern.js +6 -5
- package/node/v5.0.0/jss-to-tss-react.test/expected-mixins-pattern.js +6 -5
- package/node/v5.0.0/preset-safe.test/actual.js +6 -4
- package/node/v5.0.0/preset-safe.test/expected.js +9 -6
- package/node/v5.0.0/table-props.test/actual.js +4 -5
- package/node/v5.0.0/table-props.test/expected.js +4 -5
- package/node/v5.0.0/theme-spacing.test/large-actual.js +10 -10
- package/node/v5.0.0/theme-spacing.test/large-expected.js +10 -10
- package/node/v5.0.0/variant-prop.test/actual.js +12 -6
- package/node/v5.0.0/variant-prop.test/expected.js +15 -12
- package/node/v5.0.0/with-mobile-dialog.test/expected.js +6 -5
- package/node/v5.0.0/with-width.test/expected.js +6 -5
- package/node/v6.0.0/styled/test-cases/BasicStyled.actual.js +55 -44
- package/node/v6.0.0/styled/test-cases/BasicStyled.expected.js +5 -6
- package/node/v6.0.0/styled/test-cases/ConditionalStyled.actual.js +80 -70
- package/node/v6.0.0/styled/test-cases/ConditionalStyled.expected.js +7 -6
- package/node/v6.0.0/styled/test-cases/NestedSpread.actual.js +32 -26
- package/node/v6.0.0/styled/test-cases/NestedSpread.expected.js +7 -6
- package/node/v6.0.0/styled/test-cases/ThemePaletteMode.expected.js +28 -26
- package/node/v6.0.0/styled/test-cases/VariantAndModeStyled.actual.js +6 -5
- package/node/v6.0.0/styled/test-cases/VariantAndModeStyled.expected.js +8 -8
- package/node/v6.0.0/theme-v6/test-cases/basicTheme.actual.js +254 -225
- package/node/v6.0.0/theme-v6/test-cases/basicTheme.expected.js +180 -162
- package/node/v6.0.0/theme-v6/test-cases/themeVariants.actual.js +23 -21
- package/node/v6.0.0/theme-v6/test-cases/themeVariants.expected.js +20 -19
- package/package.json +5 -5
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
5
4
|
var _SpeedDial = _interopRequireDefault(require("@mui/material/SpeedDial"));
|
|
6
5
|
var _material = require("@mui/material");
|
|
7
6
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
@@ -31,9 +30,10 @@ var _jsxRuntime = require("react/jsx-runtime");
|
|
|
31
30
|
}
|
|
32
31
|
});
|
|
33
32
|
/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.SpeedDial, {
|
|
34
|
-
slots:
|
|
33
|
+
slots: {
|
|
34
|
+
...outerSlots,
|
|
35
35
|
transition: CustomTransition
|
|
36
|
-
}
|
|
36
|
+
},
|
|
37
37
|
slotProps: {
|
|
38
38
|
transition: CustomTransitionProps
|
|
39
39
|
}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
5
4
|
var _StepLabel = _interopRequireDefault(require("@mui/material/StepLabel"));
|
|
6
5
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
7
6
|
/*#__PURE__*/(0, _jsxRuntime.jsx)(_StepLabel.default, {
|
|
@@ -14,7 +13,10 @@ var _jsxRuntime = require("react/jsx-runtime");
|
|
|
14
13
|
label: SlotsLabel
|
|
15
14
|
},
|
|
16
15
|
slotProps: {
|
|
17
|
-
label:
|
|
16
|
+
label: {
|
|
17
|
+
...componentsLabelProps,
|
|
18
|
+
...slotLabelProps
|
|
19
|
+
}
|
|
18
20
|
}
|
|
19
21
|
});
|
|
20
22
|
/*#__PURE__*/(0, _jsxRuntime.jsx)(_StepLabel.default, {
|
|
@@ -29,7 +31,10 @@ var _jsxRuntime = require("react/jsx-runtime");
|
|
|
29
31
|
stepIcon: StepIconComponent
|
|
30
32
|
},
|
|
31
33
|
slotProps: {
|
|
32
|
-
label:
|
|
34
|
+
label: {
|
|
35
|
+
...componentsLabelProps,
|
|
36
|
+
...slotLabelProps
|
|
37
|
+
},
|
|
33
38
|
stepIcon: StepIconProps
|
|
34
39
|
}
|
|
35
40
|
});
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
5
3
|
fn({
|
|
6
4
|
MuiStepLabel: {
|
|
7
5
|
defaultProps: {
|
|
@@ -15,7 +13,10 @@ fn({
|
|
|
15
13
|
MuiStepLabel: {
|
|
16
14
|
defaultProps: {
|
|
17
15
|
slotProps: {
|
|
18
|
-
label:
|
|
16
|
+
label: {
|
|
17
|
+
...componentsLabelProps,
|
|
18
|
+
...slotLabelProps
|
|
19
|
+
}
|
|
19
20
|
}
|
|
20
21
|
}
|
|
21
22
|
}
|
|
@@ -36,7 +37,10 @@ fn({
|
|
|
36
37
|
MuiStepLabel: {
|
|
37
38
|
defaultProps: {
|
|
38
39
|
slotProps: {
|
|
39
|
-
label:
|
|
40
|
+
label: {
|
|
41
|
+
...componentsLabelProps,
|
|
42
|
+
...slotLabelProps
|
|
43
|
+
},
|
|
40
44
|
stepIcon: StepIconProps
|
|
41
45
|
},
|
|
42
46
|
slots: {
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
Object.defineProperty(exports, "default", {
|
|
8
|
+
enumerable: true,
|
|
9
|
+
get: function () {
|
|
10
|
+
return _textFieldProps.default;
|
|
11
|
+
}
|
|
12
|
+
});
|
|
13
|
+
var _textFieldProps = _interopRequireDefault(require("./text-field-props"));
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
|
|
5
|
+
var _material = require("@mui/material");
|
|
6
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
7
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
8
|
+
InputProps: CustomInputProps,
|
|
9
|
+
inputProps: CustomHtmlInputProps,
|
|
10
|
+
SelectProps: CustomSelectProps,
|
|
11
|
+
InputLabelProps: CustomInputLabelProps,
|
|
12
|
+
FormHelperTextProps: CustomFormHelperProps
|
|
13
|
+
});
|
|
14
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, {
|
|
15
|
+
InputProps: CustomInputProps,
|
|
16
|
+
inputProps: CustomHtmlInputProps,
|
|
17
|
+
SelectProps: CustomSelectProps,
|
|
18
|
+
InputLabelProps: CustomInputLabelProps,
|
|
19
|
+
FormHelperTextProps: CustomFormHelperProps
|
|
20
|
+
});
|
|
21
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(NonMuiTextField, {
|
|
22
|
+
InputProps: CustomInputProps,
|
|
23
|
+
inputProps: CustomHtmlInputProps,
|
|
24
|
+
SelectProps: CustomSelectProps,
|
|
25
|
+
InputLabelProps: CustomInputLabelProps,
|
|
26
|
+
FormHelperTextProps: CustomFormHelperProps
|
|
27
|
+
});
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
|
|
5
|
+
var _material = require("@mui/material");
|
|
6
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
7
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
8
|
+
slotProps: {
|
|
9
|
+
input: CustomInputProps,
|
|
10
|
+
htmlInput: CustomHtmlInputProps,
|
|
11
|
+
select: CustomSelectProps,
|
|
12
|
+
inputLabel: CustomInputLabelProps,
|
|
13
|
+
formHelperText: CustomFormHelperProps
|
|
14
|
+
}
|
|
15
|
+
});
|
|
16
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, {
|
|
17
|
+
slotProps: {
|
|
18
|
+
input: CustomInputProps,
|
|
19
|
+
htmlInput: CustomHtmlInputProps,
|
|
20
|
+
select: CustomSelectProps,
|
|
21
|
+
inputLabel: CustomInputLabelProps,
|
|
22
|
+
formHelperText: CustomFormHelperProps
|
|
23
|
+
}
|
|
24
|
+
});
|
|
25
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(NonMuiTextField, {
|
|
26
|
+
InputProps: CustomInputProps,
|
|
27
|
+
inputProps: CustomHtmlInputProps,
|
|
28
|
+
SelectProps: CustomSelectProps,
|
|
29
|
+
InputLabelProps: CustomInputLabelProps,
|
|
30
|
+
FormHelperTextProps: CustomFormHelperProps
|
|
31
|
+
});
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
fn({
|
|
4
|
+
MuiTextField: {
|
|
5
|
+
defaultProps: {
|
|
6
|
+
InputProps: CustomInputProps,
|
|
7
|
+
inputProps: CustomHtmlInputProps,
|
|
8
|
+
SelectProps: CustomSelectProps,
|
|
9
|
+
InputLabelProps: CustomInputLabelProps,
|
|
10
|
+
FormHelperTextProps: CustomFormHelperProps
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
});
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
fn({
|
|
4
|
+
MuiTextField: {
|
|
5
|
+
defaultProps: {
|
|
6
|
+
slotProps: {
|
|
7
|
+
input: CustomInputProps,
|
|
8
|
+
htmlInput: CustomHtmlInputProps,
|
|
9
|
+
select: CustomSelectProps,
|
|
10
|
+
inputLabel: CustomInputLabelProps,
|
|
11
|
+
formHelperText: CustomFormHelperProps
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
});
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.default = transformer;
|
|
8
|
+
var _movePropIntoSlotProps = _interopRequireDefault(require("../utils/movePropIntoSlotProps"));
|
|
9
|
+
/**
|
|
10
|
+
* @param {import('jscodeshift').FileInfo} file
|
|
11
|
+
* @param {import('jscodeshift').API} api
|
|
12
|
+
*/
|
|
13
|
+
function transformer(file, api, options) {
|
|
14
|
+
const j = api.jscodeshift;
|
|
15
|
+
const root = j(file.source);
|
|
16
|
+
const printOptions = options.printOptions;
|
|
17
|
+
(0, _movePropIntoSlotProps.default)(j, {
|
|
18
|
+
root,
|
|
19
|
+
componentName: 'TextField',
|
|
20
|
+
propName: 'InputProps',
|
|
21
|
+
slotName: 'input'
|
|
22
|
+
});
|
|
23
|
+
(0, _movePropIntoSlotProps.default)(j, {
|
|
24
|
+
root,
|
|
25
|
+
componentName: 'TextField',
|
|
26
|
+
propName: 'inputProps',
|
|
27
|
+
slotName: 'htmlInput'
|
|
28
|
+
});
|
|
29
|
+
(0, _movePropIntoSlotProps.default)(j, {
|
|
30
|
+
root,
|
|
31
|
+
componentName: 'TextField',
|
|
32
|
+
propName: 'SelectProps',
|
|
33
|
+
slotName: 'select'
|
|
34
|
+
});
|
|
35
|
+
(0, _movePropIntoSlotProps.default)(j, {
|
|
36
|
+
root,
|
|
37
|
+
componentName: 'TextField',
|
|
38
|
+
propName: 'InputLabelProps',
|
|
39
|
+
slotName: 'inputLabel'
|
|
40
|
+
});
|
|
41
|
+
(0, _movePropIntoSlotProps.default)(j, {
|
|
42
|
+
root,
|
|
43
|
+
componentName: 'TextField',
|
|
44
|
+
propName: 'FormHelperTextProps',
|
|
45
|
+
slotName: 'formHelperText'
|
|
46
|
+
});
|
|
47
|
+
return root.toSource(printOptions);
|
|
48
|
+
}
|
|
@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.default = replaceComponentsWithSlots;
|
|
8
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
8
|
var _findComponentJSX = _interopRequireDefault(require("../../util/findComponentJSX"));
|
|
10
9
|
var _findComponentDefaultProps = _interopRequireDefault(require("../../util/findComponentDefaultProps"));
|
|
11
10
|
var _assignObject = _interopRequireDefault(require("../../util/assignObject"));
|
|
@@ -19,9 +18,10 @@ function replaceJsxComponentsProp(j, elementPath) {
|
|
|
19
18
|
if (index !== -1) {
|
|
20
19
|
const removed = element.openingElement.attributes.splice(index, 1);
|
|
21
20
|
const camelCaseComponents = removed[0].value.expression.properties.reduce((acc, prop) => {
|
|
22
|
-
return
|
|
21
|
+
return {
|
|
22
|
+
...acc,
|
|
23
23
|
[componentsKeyToSlotsKey(prop.key.name)]: prop.value
|
|
24
|
-
}
|
|
24
|
+
};
|
|
25
25
|
}, {});
|
|
26
26
|
let hasNode = false;
|
|
27
27
|
element.openingElement.attributes.forEach(attr => {
|
|
@@ -29,9 +29,10 @@ function replaceJsxComponentsProp(j, elementPath) {
|
|
|
29
29
|
if (((_attr$name = attr.name) == null ? void 0 : _attr$name.name) === 'slots') {
|
|
30
30
|
hasNode = true;
|
|
31
31
|
const slots = attr.value.expression.properties.reduce((acc, prop) => {
|
|
32
|
-
return
|
|
32
|
+
return {
|
|
33
|
+
...acc,
|
|
33
34
|
[prop.key.name]: prop.value
|
|
34
|
-
}
|
|
35
|
+
};
|
|
35
36
|
}, {});
|
|
36
37
|
Object.entries(camelCaseComponents).forEach(([slot, value]) => {
|
|
37
38
|
if (!slots[slot]) {
|
|
@@ -65,9 +66,10 @@ function replaceJsxComponentsPropsProp(j, element) {
|
|
|
65
66
|
if (((_attr$name2 = attr.name) == null ? void 0 : _attr$name2.name) === 'slotProps') {
|
|
66
67
|
hasNode = true;
|
|
67
68
|
const slotProps = attr.value.expression.properties.reduce((acc, prop) => {
|
|
68
|
-
return
|
|
69
|
+
return {
|
|
70
|
+
...acc,
|
|
69
71
|
[prop.key.name]: prop.value
|
|
70
|
-
}
|
|
72
|
+
};
|
|
71
73
|
}, {});
|
|
72
74
|
removed[0].value.expression.properties.forEach(prop => {
|
|
73
75
|
if (!slotProps[prop.key.name]) {
|
|
@@ -109,17 +111,22 @@ function replaceDefaultPropsComponentsProp(j, defaultPropsPathCollection) {
|
|
|
109
111
|
properties: defaultPropsProperties
|
|
110
112
|
} = path.parent.value;
|
|
111
113
|
const components = path.value.value.properties.reduce((acc, prop) => {
|
|
112
|
-
return
|
|
114
|
+
return {
|
|
115
|
+
...acc,
|
|
113
116
|
[componentsKeyToSlotsKey(prop.key.name)]: prop.value
|
|
114
|
-
}
|
|
117
|
+
};
|
|
115
118
|
}, {});
|
|
116
119
|
const existingSlots = defaultPropsProperties.find(prop => prop.key.name === 'slots');
|
|
117
120
|
const slots = existingSlots ? existingSlots.value.properties.reduce((acc, prop) => {
|
|
118
|
-
return
|
|
121
|
+
return {
|
|
122
|
+
...acc,
|
|
119
123
|
[prop.key.name]: prop.value
|
|
120
|
-
}
|
|
124
|
+
};
|
|
121
125
|
}, {}) : {};
|
|
122
|
-
const updatedSlots = j.objectExpression(Object.entries(
|
|
126
|
+
const updatedSlots = j.objectExpression(Object.entries({
|
|
127
|
+
...components,
|
|
128
|
+
...slots
|
|
129
|
+
}).map(([slot, value]) => {
|
|
123
130
|
return j.objectProperty(j.identifier(slot), value);
|
|
124
131
|
}));
|
|
125
132
|
if (existingSlots) {
|
|
@@ -140,17 +147,22 @@ function replaceDefaultPropsComponentsPropsProp(j, defaultPropsPathCollection) {
|
|
|
140
147
|
properties: defaultPropsProperties
|
|
141
148
|
} = path.parent.value;
|
|
142
149
|
const components = path.value.value.properties.reduce((acc, prop) => {
|
|
143
|
-
return
|
|
150
|
+
return {
|
|
151
|
+
...acc,
|
|
144
152
|
[prop.key.name]: prop.value
|
|
145
|
-
}
|
|
153
|
+
};
|
|
146
154
|
}, {});
|
|
147
155
|
const existingSlots = defaultPropsProperties.find(prop => prop.key.name === 'slotProps');
|
|
148
156
|
const slots = existingSlots ? existingSlots.value.properties.reduce((acc, prop) => {
|
|
149
|
-
return
|
|
157
|
+
return {
|
|
158
|
+
...acc,
|
|
150
159
|
[prop.key.name]: components[prop.key.name] ? j.objectExpression([j.spreadElement(components[prop.key.name]), j.spreadElement(prop.value)]) : prop.value
|
|
151
|
-
}
|
|
160
|
+
};
|
|
152
161
|
}, {}) : {};
|
|
153
|
-
const updatedSlots = j.objectExpression(Object.entries(
|
|
162
|
+
const updatedSlots = j.objectExpression(Object.entries({
|
|
163
|
+
...components,
|
|
164
|
+
...slots
|
|
165
|
+
}).map(([slot, value]) => {
|
|
154
166
|
return j.objectProperty(j.identifier(slot), value);
|
|
155
167
|
}));
|
|
156
168
|
if (existingSlots) {
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
6
|
exports.default = migrateToVariants;
|
|
8
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
7
|
const MAX_DEPTH = 20;
|
|
10
8
|
/**
|
|
11
9
|
*
|
|
@@ -23,9 +21,10 @@ function migrateToVariants(j, styles) {
|
|
|
23
21
|
return upperBuildStyle(j.objectExpression([j.objectProperty(key, styleExpression)]));
|
|
24
22
|
}
|
|
25
23
|
if (key.type === 'TemplateLiteral' || key.type === 'CallExpression') {
|
|
26
|
-
return upperBuildStyle(j.objectExpression([
|
|
24
|
+
return upperBuildStyle(j.objectExpression([{
|
|
25
|
+
...j.objectProperty(key, styleExpression),
|
|
27
26
|
computed: true
|
|
28
|
-
}
|
|
27
|
+
}]));
|
|
29
28
|
}
|
|
30
29
|
}
|
|
31
30
|
return upperBuildStyle ? upperBuildStyle(styleExpression) : styleExpression;
|
|
@@ -48,7 +47,9 @@ function migrateToVariants(j, styles) {
|
|
|
48
47
|
* @param {import('ast-types').namedTypes.UnaryExpression | import('ast-types').namedTypes.MemberExpression | import('ast-types').namedTypes.Identifier} node
|
|
49
48
|
*/
|
|
50
49
|
function getObjectKey(node) {
|
|
51
|
-
let tempNode =
|
|
50
|
+
let tempNode = {
|
|
51
|
+
...node
|
|
52
|
+
};
|
|
52
53
|
while (tempNode.type === 'UnaryExpression') {
|
|
53
54
|
tempNode = tempNode.argument;
|
|
54
55
|
}
|
|
@@ -90,14 +91,16 @@ function migrateToVariants(j, styles) {
|
|
|
90
91
|
return j.unaryExpression('!', node);
|
|
91
92
|
}
|
|
92
93
|
if (node.operator === '===') {
|
|
93
|
-
return
|
|
94
|
+
return {
|
|
95
|
+
...node,
|
|
94
96
|
operator: '!=='
|
|
95
|
-
}
|
|
97
|
+
};
|
|
96
98
|
}
|
|
97
99
|
if (node.operator === '!==') {
|
|
98
|
-
return
|
|
100
|
+
return {
|
|
101
|
+
...node,
|
|
99
102
|
operator: '==='
|
|
100
|
-
}
|
|
103
|
+
};
|
|
101
104
|
}
|
|
102
105
|
if (node.operator === '!') {
|
|
103
106
|
var _node$argument;
|
|
@@ -128,7 +131,8 @@ function migrateToVariants(j, styles) {
|
|
|
128
131
|
return result;
|
|
129
132
|
}
|
|
130
133
|
function buildArrowFunctionAST(params, body) {
|
|
131
|
-
return j.arrowFunctionExpression([j.objectPattern([...params].map(k => (
|
|
134
|
+
return j.arrowFunctionExpression([j.objectPattern([...params].map(k => ({
|
|
135
|
+
...j.objectProperty(j.identifier(k), j.identifier(k)),
|
|
132
136
|
shorthand: true
|
|
133
137
|
})))], body);
|
|
134
138
|
}
|
|
@@ -152,7 +156,9 @@ function migrateToVariants(j, styles) {
|
|
|
152
156
|
const properties = [];
|
|
153
157
|
const variables = new Set();
|
|
154
158
|
let isAllEqual = true;
|
|
155
|
-
let tempNode =
|
|
159
|
+
let tempNode = {
|
|
160
|
+
...node
|
|
161
|
+
};
|
|
156
162
|
function assignProperties(_node) {
|
|
157
163
|
if (_node.type === 'BinaryExpression') {
|
|
158
164
|
variables.add(getObjectKey(_node.left).name);
|
|
@@ -191,7 +197,9 @@ function migrateToVariants(j, styles) {
|
|
|
191
197
|
assignProperties(tempNode.left);
|
|
192
198
|
break;
|
|
193
199
|
}
|
|
194
|
-
tempNode =
|
|
200
|
+
tempNode = {
|
|
201
|
+
...tempNode.left
|
|
202
|
+
};
|
|
195
203
|
}
|
|
196
204
|
}
|
|
197
205
|
if (!isAllEqual) {
|
|
@@ -259,7 +267,8 @@ function migrateToVariants(j, styles) {
|
|
|
259
267
|
const modeStyles = {}; // to collect styles from `theme.palette.mode === '...'`
|
|
260
268
|
data.node.properties.forEach(prop => {
|
|
261
269
|
if (prop.type === 'ObjectProperty') {
|
|
262
|
-
recurseObjectExpression(
|
|
270
|
+
recurseObjectExpression({
|
|
271
|
+
...data,
|
|
263
272
|
node: prop.value,
|
|
264
273
|
parentNode: data.node,
|
|
265
274
|
key: prop.key,
|
|
@@ -268,13 +277,14 @@ function migrateToVariants(j, styles) {
|
|
|
268
277
|
prop.value = newValue;
|
|
269
278
|
},
|
|
270
279
|
modeStyles
|
|
271
|
-
})
|
|
280
|
+
});
|
|
272
281
|
} else {
|
|
273
|
-
recurseObjectExpression(
|
|
282
|
+
recurseObjectExpression({
|
|
283
|
+
...data,
|
|
274
284
|
node: prop,
|
|
275
285
|
parentNode: data.node,
|
|
276
286
|
buildStyle: createBuildStyle(prop.key, data.buildStyle)
|
|
277
|
-
})
|
|
287
|
+
});
|
|
278
288
|
}
|
|
279
289
|
});
|
|
280
290
|
appendPaletteModeStyles(data.node, modeStyles);
|
|
@@ -288,7 +298,8 @@ function migrateToVariants(j, styles) {
|
|
|
288
298
|
const mode = data.node.argument.left.right.value;
|
|
289
299
|
data.node.argument.right.properties.forEach(prop => {
|
|
290
300
|
if (prop.type === 'ObjectProperty') {
|
|
291
|
-
recurseObjectExpression(
|
|
301
|
+
recurseObjectExpression({
|
|
302
|
+
...data,
|
|
292
303
|
node: prop.value,
|
|
293
304
|
parentNode: data.node.argument.right,
|
|
294
305
|
key: prop.key,
|
|
@@ -296,13 +307,14 @@ function migrateToVariants(j, styles) {
|
|
|
296
307
|
replaceValue: newValue => {
|
|
297
308
|
prop.value = newValue;
|
|
298
309
|
}
|
|
299
|
-
})
|
|
310
|
+
});
|
|
300
311
|
} else {
|
|
301
|
-
recurseObjectExpression(
|
|
312
|
+
recurseObjectExpression({
|
|
313
|
+
...data,
|
|
302
314
|
node: prop,
|
|
303
315
|
parentNode: data.node.argument.right,
|
|
304
316
|
buildStyle: createBuildStyle(prop.key, data.buildStyle, mode)
|
|
305
|
-
})
|
|
317
|
+
});
|
|
306
318
|
}
|
|
307
319
|
});
|
|
308
320
|
appendPaletteModeStyles(data.parentNode, {
|
|
@@ -326,7 +338,8 @@ function migrateToVariants(j, styles) {
|
|
|
326
338
|
if (variant.style.type === 'ObjectExpression') {
|
|
327
339
|
variant.style.properties.forEach(prop => {
|
|
328
340
|
if (prop.type === 'ObjectProperty') {
|
|
329
|
-
recurseObjectExpression(
|
|
341
|
+
recurseObjectExpression({
|
|
342
|
+
...data,
|
|
330
343
|
node: prop.value,
|
|
331
344
|
parentNode: variant.style,
|
|
332
345
|
props: variant.props,
|
|
@@ -336,14 +349,15 @@ function migrateToVariants(j, styles) {
|
|
|
336
349
|
prop.value = newValue;
|
|
337
350
|
},
|
|
338
351
|
modeStyles
|
|
339
|
-
})
|
|
352
|
+
});
|
|
340
353
|
} else {
|
|
341
|
-
recurseObjectExpression(
|
|
354
|
+
recurseObjectExpression({
|
|
355
|
+
...data,
|
|
342
356
|
node: prop,
|
|
343
357
|
parentNode: variant.style,
|
|
344
358
|
props: variant.props,
|
|
345
359
|
buildStyle: createBuildStyle(prop.key, data.buildStyle)
|
|
346
|
-
})
|
|
360
|
+
});
|
|
347
361
|
}
|
|
348
362
|
});
|
|
349
363
|
}
|
|
@@ -353,10 +367,11 @@ function migrateToVariants(j, styles) {
|
|
|
353
367
|
removeProperty(data.parentNode, data.node);
|
|
354
368
|
}
|
|
355
369
|
if (data.node.argument.type === 'ConditionalExpression') {
|
|
356
|
-
recurseObjectExpression(
|
|
370
|
+
recurseObjectExpression({
|
|
371
|
+
...data,
|
|
357
372
|
node: data.node.argument,
|
|
358
373
|
parentNode: data.node
|
|
359
|
-
})
|
|
374
|
+
});
|
|
360
375
|
removeProperty(data.parentNode, data.node);
|
|
361
376
|
}
|
|
362
377
|
}
|
|
@@ -419,7 +434,8 @@ function migrateToVariants(j, styles) {
|
|
|
419
434
|
if (((_data$parentNode3 = data.parentNode) == null ? void 0 : _data$parentNode3.type) === 'ObjectExpression') {
|
|
420
435
|
const modeStyles = {};
|
|
421
436
|
data.node.expressions.forEach((expression, index) => {
|
|
422
|
-
recurseObjectExpression(
|
|
437
|
+
recurseObjectExpression({
|
|
438
|
+
...data,
|
|
423
439
|
node: expression,
|
|
424
440
|
parentNode: data.parentNode,
|
|
425
441
|
buildStyle: createBuildStyle(data.key, data.buildStyle),
|
|
@@ -427,13 +443,16 @@ function migrateToVariants(j, styles) {
|
|
|
427
443
|
data.node.expressions[index] = newValue;
|
|
428
444
|
},
|
|
429
445
|
modeStyles
|
|
430
|
-
})
|
|
446
|
+
});
|
|
431
447
|
});
|
|
432
448
|
if (data.modeStyles) {
|
|
433
449
|
Object.entries(modeStyles).forEach(([mode, objectStyles]) => {
|
|
434
|
-
const clonedNode =
|
|
435
|
-
|
|
436
|
-
|
|
450
|
+
const clonedNode = {
|
|
451
|
+
...data.node,
|
|
452
|
+
expressions: data.node.expressions.map(expression => ({
|
|
453
|
+
...expression
|
|
454
|
+
}))
|
|
455
|
+
};
|
|
437
456
|
clonedNode.expressions = objectStyles.map(item => item.value);
|
|
438
457
|
if (!data.modeStyles[mode]) {
|
|
439
458
|
data.modeStyles[mode] = [];
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
5
3
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
6
4
|
/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
7
5
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Badge, {
|
|
@@ -31,9 +29,10 @@ var _jsxRuntime = require("react/jsx-runtime");
|
|
|
31
29
|
'& .MuiBadge-anchorOriginBottomLeftCircle': {}
|
|
32
30
|
}
|
|
33
31
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(Badge, {
|
|
34
|
-
classes:
|
|
32
|
+
classes: {
|
|
33
|
+
...badgeClasses,
|
|
35
34
|
badge: badgeClasses.badge
|
|
36
|
-
}
|
|
35
|
+
},
|
|
37
36
|
children: icon
|
|
38
37
|
})]
|
|
39
38
|
});
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
5
3
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
6
4
|
/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
7
5
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Badge, {
|
|
@@ -31,9 +29,10 @@ var _jsxRuntime = require("react/jsx-runtime");
|
|
|
31
29
|
'& .MuiBadge-anchorOriginBottomLeftCircular': {}
|
|
32
30
|
}
|
|
33
31
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(Badge, {
|
|
34
|
-
classes:
|
|
32
|
+
classes: {
|
|
33
|
+
...badgeClasses,
|
|
35
34
|
badge: badgeClasses.badge
|
|
36
|
-
}
|
|
35
|
+
},
|
|
37
36
|
children: icon
|
|
38
37
|
})]
|
|
39
38
|
});
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
5
4
|
var _Input = _interopRequireDefault(require("@mui/material/Input"));
|
|
6
5
|
var _Input2 = _interopRequireDefault(require("@mui/base/Input"));
|
|
7
6
|
var _Switch = _interopRequireDefault(require("@mui/base/Switch"));
|
|
@@ -15,9 +14,10 @@ var _jsxRuntime = require("react/jsx-runtime");
|
|
|
15
14
|
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Input2.default, {
|
|
16
15
|
component: CustomRoot
|
|
17
16
|
});
|
|
18
|
-
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Input2.default,
|
|
19
|
-
component: CustomRoot
|
|
20
|
-
|
|
17
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Input2.default, {
|
|
18
|
+
component: CustomRoot,
|
|
19
|
+
...others
|
|
20
|
+
});
|
|
21
21
|
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Switch.default, {
|
|
22
22
|
component: CustomRoot,
|
|
23
23
|
randomProp: "1",
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
5
4
|
var _Input = _interopRequireDefault(require("@mui/material/Input"));
|
|
6
5
|
var _Input2 = _interopRequireDefault(require("@mui/base/Input"));
|
|
7
6
|
var _Switch = _interopRequireDefault(require("@mui/base/Switch"));
|
|
@@ -17,11 +16,12 @@ var _jsxRuntime = require("react/jsx-runtime");
|
|
|
17
16
|
root: CustomRoot
|
|
18
17
|
}
|
|
19
18
|
});
|
|
20
|
-
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Input2.default,
|
|
19
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Input2.default, {
|
|
21
20
|
slots: {
|
|
22
21
|
root: CustomRoot
|
|
23
|
-
}
|
|
24
|
-
|
|
22
|
+
},
|
|
23
|
+
...others
|
|
24
|
+
});
|
|
25
25
|
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Switch.default, {
|
|
26
26
|
slots: {
|
|
27
27
|
root: CustomRoot
|
|
@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.default = BoxComponent;
|
|
8
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
8
|
var React = _interopRequireWildcard(require("react"));
|
|
10
9
|
var _Box = _interopRequireDefault(require("@material-ui/core/Box"));
|
|
11
10
|
var _Button2 = _interopRequireDefault(require("@material-ui/core/Button"));
|
|
@@ -34,8 +33,9 @@ function BoxComponent(props) {
|
|
|
34
33
|
component: "span",
|
|
35
34
|
children: "Save"
|
|
36
35
|
}))
|
|
37
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default,
|
|
38
|
-
p: [1, 2, 4]
|
|
39
|
-
|
|
36
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
|
|
37
|
+
p: [1, 2, 4],
|
|
38
|
+
...props
|
|
39
|
+
})]
|
|
40
40
|
});
|
|
41
41
|
}
|