@mui/codemod 9.0.0-alpha.0 → 9.0.0-alpha.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +265 -0
- package/README.md +141 -8
- package/codemod.js +68 -124
- package/deprecations/autocomplete-props/autocomplete-props.js +195 -0
- package/deprecations/autocomplete-props/test-cases/actual.js +31 -0
- package/deprecations/autocomplete-props/test-cases/expected.js +31 -0
- package/deprecations/autocomplete-props/test-cases/package.actual.js +11 -0
- package/deprecations/autocomplete-props/test-cases/package.expected.js +11 -0
- package/deprecations/autocomplete-props/test-cases/render-input-package.actual.js +34 -0
- package/deprecations/autocomplete-props/test-cases/render-input-package.expected.js +40 -0
- package/deprecations/autocomplete-props/test-cases/render-input.actual.js +81 -0
- package/deprecations/autocomplete-props/test-cases/render-input.expected.js +92 -0
- package/deprecations/autocomplete-props/test-cases/theme.actual.js +15 -0
- package/deprecations/autocomplete-props/test-cases/theme.expected.js +15 -0
- package/deprecations/circular-progress-classes/circular-progress-classes.js +16 -1
- package/deprecations/circular-progress-classes/postcss-plugin.js +2 -2
- package/deprecations/circular-progress-classes/test-cases/expected.js +4 -4
- package/deprecations/circular-progress-classes/test-cases/package.expected.js +4 -4
- package/deprecations/tabs-props/tabs-props.js +44 -0
- package/deprecations/tabs-props/test-cases/actual.js +11 -0
- package/deprecations/tabs-props/test-cases/expected.js +11 -0
- package/deprecations/tabs-props/test-cases/package.actual.js +6 -0
- package/deprecations/tabs-props/test-cases/package.expected.js +6 -0
- package/deprecations/tabs-props/test-cases/theme.actual.js +10 -0
- package/deprecations/tabs-props/test-cases/theme.expected.js +10 -0
- package/package.json +7 -6
- package/v5.0.0/path-imports.js +0 -5
- package/v5.0.0/top-level-imports.js +1 -5
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
var _TextField = _interopRequireDefault(require("@org/ui/material/TextField"));
|
|
5
|
+
var _Autocomplete = _interopRequireDefault(require("@org/ui/material/Autocomplete"));
|
|
6
|
+
var _material = require("@org/ui/material");
|
|
7
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
8
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
|
|
9
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
10
|
+
...params,
|
|
11
|
+
slotProps: {
|
|
12
|
+
...params.slotProps,
|
|
13
|
+
htmlInput: {
|
|
14
|
+
...params.slotProps.htmlInput,
|
|
15
|
+
autoComplete: 'new-password'
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
})
|
|
19
|
+
});
|
|
20
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
|
|
21
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
22
|
+
...params,
|
|
23
|
+
slotProps: {
|
|
24
|
+
...params.slotProps,
|
|
25
|
+
htmlInput: {
|
|
26
|
+
...params.slotProps.htmlInput,
|
|
27
|
+
autoComplete: 'new-password'
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
})
|
|
31
|
+
});
|
|
32
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomAutocomplete, {
|
|
33
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
34
|
+
...params,
|
|
35
|
+
inputProps: {
|
|
36
|
+
...params.inputProps,
|
|
37
|
+
autoComplete: 'new-password'
|
|
38
|
+
}
|
|
39
|
+
})
|
|
40
|
+
});
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
5
|
+
var React = _interopRequireWildcard(require("react"));
|
|
6
|
+
var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
|
|
7
|
+
var _Autocomplete = _interopRequireDefault(require("@mui/material/Autocomplete"));
|
|
8
|
+
var _material = require("@mui/material");
|
|
9
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
10
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
|
|
11
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
12
|
+
...params,
|
|
13
|
+
InputProps: {
|
|
14
|
+
...params.InputProps,
|
|
15
|
+
endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
|
|
16
|
+
children: params.InputProps.endAdornment
|
|
17
|
+
})
|
|
18
|
+
}
|
|
19
|
+
})
|
|
20
|
+
});
|
|
21
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
|
|
22
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
23
|
+
...params,
|
|
24
|
+
inputProps: {
|
|
25
|
+
...params.inputProps,
|
|
26
|
+
autoComplete: 'new-password'
|
|
27
|
+
}
|
|
28
|
+
})
|
|
29
|
+
});
|
|
30
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
|
|
31
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
32
|
+
...params,
|
|
33
|
+
slotProps: {
|
|
34
|
+
input: {
|
|
35
|
+
...params.InputProps,
|
|
36
|
+
type: 'search'
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
})
|
|
40
|
+
});
|
|
41
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
|
|
42
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
43
|
+
...params,
|
|
44
|
+
slotProps: {
|
|
45
|
+
inputLabel: {
|
|
46
|
+
...params.InputLabelProps,
|
|
47
|
+
shrink: true
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
})
|
|
51
|
+
});
|
|
52
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
|
|
53
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
54
|
+
ref: params.InputProps.ref,
|
|
55
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
|
|
56
|
+
...params.inputProps
|
|
57
|
+
})
|
|
58
|
+
})
|
|
59
|
+
});
|
|
60
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
|
|
61
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
62
|
+
...params,
|
|
63
|
+
InputProps: {
|
|
64
|
+
...params.InputProps,
|
|
65
|
+
endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
|
|
66
|
+
children: params.InputProps.endAdornment
|
|
67
|
+
})
|
|
68
|
+
}
|
|
69
|
+
})
|
|
70
|
+
});
|
|
71
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomAutocomplete, {
|
|
72
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
73
|
+
...params,
|
|
74
|
+
InputProps: {
|
|
75
|
+
...params.InputProps,
|
|
76
|
+
endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
|
|
77
|
+
children: params.InputProps.endAdornment
|
|
78
|
+
})
|
|
79
|
+
}
|
|
80
|
+
})
|
|
81
|
+
});
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
5
|
+
var React = _interopRequireWildcard(require("react"));
|
|
6
|
+
var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
|
|
7
|
+
var _Autocomplete = _interopRequireDefault(require("@mui/material/Autocomplete"));
|
|
8
|
+
var _material = require("@mui/material");
|
|
9
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
10
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
|
|
11
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
12
|
+
...params,
|
|
13
|
+
slotProps: {
|
|
14
|
+
...params.slotProps,
|
|
15
|
+
input: {
|
|
16
|
+
...params.slotProps.input,
|
|
17
|
+
endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
|
|
18
|
+
children: params.slotProps.input.endAdornment
|
|
19
|
+
})
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
})
|
|
23
|
+
});
|
|
24
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
|
|
25
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
26
|
+
...params,
|
|
27
|
+
slotProps: {
|
|
28
|
+
...params.slotProps,
|
|
29
|
+
htmlInput: {
|
|
30
|
+
...params.slotProps.htmlInput,
|
|
31
|
+
autoComplete: 'new-password'
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
})
|
|
35
|
+
});
|
|
36
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
|
|
37
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
38
|
+
...params,
|
|
39
|
+
slotProps: {
|
|
40
|
+
...params.slotProps,
|
|
41
|
+
input: {
|
|
42
|
+
...params.slotProps.input,
|
|
43
|
+
type: 'search'
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
})
|
|
47
|
+
});
|
|
48
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
|
|
49
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
50
|
+
...params,
|
|
51
|
+
slotProps: {
|
|
52
|
+
...params.slotProps,
|
|
53
|
+
inputLabel: {
|
|
54
|
+
...params.slotProps.inputLabel,
|
|
55
|
+
shrink: true
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
})
|
|
59
|
+
});
|
|
60
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
|
|
61
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
62
|
+
ref: params.slotProps.input.ref,
|
|
63
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
|
|
64
|
+
...params.slotProps.htmlInput
|
|
65
|
+
})
|
|
66
|
+
})
|
|
67
|
+
});
|
|
68
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
|
|
69
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
70
|
+
...params,
|
|
71
|
+
slotProps: {
|
|
72
|
+
...params.slotProps,
|
|
73
|
+
input: {
|
|
74
|
+
...params.slotProps.input,
|
|
75
|
+
endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
|
|
76
|
+
children: params.slotProps.input.endAdornment
|
|
77
|
+
})
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
})
|
|
81
|
+
});
|
|
82
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomAutocomplete, {
|
|
83
|
+
renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
|
|
84
|
+
...params,
|
|
85
|
+
InputProps: {
|
|
86
|
+
...params.InputProps,
|
|
87
|
+
endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
|
|
88
|
+
children: params.InputProps.endAdornment
|
|
89
|
+
})
|
|
90
|
+
}
|
|
91
|
+
})
|
|
92
|
+
});
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
3
4
|
fn({
|
|
4
5
|
MuiAutocomplete: {
|
|
5
6
|
defaultProps: {
|
|
@@ -12,6 +13,13 @@ fn({
|
|
|
12
13
|
ListboxProps: {
|
|
13
14
|
height: 12
|
|
14
15
|
},
|
|
16
|
+
renderTags: (value, getTagProps, ownerState) => value.map((option, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Chip, {
|
|
17
|
+
label: option.label,
|
|
18
|
+
"data-focused": ownerState.focused,
|
|
19
|
+
...getTagProps({
|
|
20
|
+
index
|
|
21
|
+
})
|
|
22
|
+
})),
|
|
15
23
|
componentsProps: {
|
|
16
24
|
clearIndicator: {
|
|
17
25
|
width: 10
|
|
@@ -41,6 +49,13 @@ fn({
|
|
|
41
49
|
ListboxProps: {
|
|
42
50
|
height: 12
|
|
43
51
|
},
|
|
52
|
+
renderTags: (value, getTagProps, ownerState) => value.map((option, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Chip, {
|
|
53
|
+
label: option.label,
|
|
54
|
+
"data-focused": ownerState.focused,
|
|
55
|
+
...getTagProps({
|
|
56
|
+
index
|
|
57
|
+
})
|
|
58
|
+
})),
|
|
44
59
|
slotProps: {
|
|
45
60
|
popupIndicator: {
|
|
46
61
|
width: 20
|
|
@@ -1,8 +1,16 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
3
4
|
fn({
|
|
4
5
|
MuiAutocomplete: {
|
|
5
6
|
defaultProps: {
|
|
7
|
+
renderValue: (value, getItemProps, ownerState) => value.map((option, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Chip, {
|
|
8
|
+
label: option.label,
|
|
9
|
+
"data-focused": ownerState.focused,
|
|
10
|
+
...getItemProps({
|
|
11
|
+
index
|
|
12
|
+
})
|
|
13
|
+
})),
|
|
6
14
|
slots: {
|
|
7
15
|
paper: CustomPaper,
|
|
8
16
|
popper: CustomPopper
|
|
@@ -36,6 +44,13 @@ fn({
|
|
|
36
44
|
fn({
|
|
37
45
|
MuiAutocomplete: {
|
|
38
46
|
defaultProps: {
|
|
47
|
+
renderValue: (value, getItemProps, ownerState) => value.map((option, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Chip, {
|
|
48
|
+
label: option.label,
|
|
49
|
+
"data-focused": ownerState.focused,
|
|
50
|
+
...getItemProps({
|
|
51
|
+
index
|
|
52
|
+
})
|
|
53
|
+
})),
|
|
39
54
|
slotProps: {
|
|
40
55
|
clearIndicator: {
|
|
41
56
|
width: 10
|
|
@@ -34,7 +34,7 @@ function transformer(file, api, options) {
|
|
|
34
34
|
if (parent.type === j.TemplateLiteral.name) {
|
|
35
35
|
const memberExpressionIndex = parent.expressions.findIndex(expression => expression === memberExpression.value);
|
|
36
36
|
const precedingTemplateElement = parent.quasis[memberExpressionIndex];
|
|
37
|
-
const atomicClasses = replacementSelector.replaceAll('MuiCircularProgress-', '').replaceAll(replacementSelectorPrefix, '').replaceAll(' > ', '').split('.').filter(Boolean);
|
|
37
|
+
const atomicClasses = replacementSelector.replaceAll('MuiCircularProgress-', '').replaceAll(replacementSelectorPrefix, '').replaceAll(' > ', '').replaceAll(' ', '').split('.').filter(Boolean);
|
|
38
38
|
if (precedingTemplateElement.value.raw.endsWith(deprecatedClass.startsWith(' ') ? `${replacementSelectorPrefix} .` : `${replacementSelectorPrefix}.`)) {
|
|
39
39
|
const atomicClassesArgs = [memberExpressionIndex, 1, ...atomicClasses.map(atomicClass => j.memberExpression(memberExpression.value.object, j.identifier(atomicClass)))];
|
|
40
40
|
parent.expressions.splice(...atomicClassesArgs);
|
|
@@ -53,6 +53,21 @@ function transformer(file, api, options) {
|
|
|
53
53
|
}, false));
|
|
54
54
|
}
|
|
55
55
|
parent.quasis.splice(...quasisArgs);
|
|
56
|
+
} else if (replacementSelector.includes(' .')) {
|
|
57
|
+
const quasisArgs = [memberExpressionIndex, 1, j.templateElement({
|
|
58
|
+
raw: precedingTemplateElement.value.raw.replace(/ \.$/, '.'),
|
|
59
|
+
cooked: precedingTemplateElement.value.cooked.replace(/ \.$/, '.')
|
|
60
|
+
}, false), j.templateElement({
|
|
61
|
+
raw: ' .',
|
|
62
|
+
cooked: ' .'
|
|
63
|
+
}, false)];
|
|
64
|
+
if (atomicClasses.length === 3) {
|
|
65
|
+
quasisArgs.splice(3, 0, j.templateElement({
|
|
66
|
+
raw: ' .',
|
|
67
|
+
cooked: ' .'
|
|
68
|
+
}, false));
|
|
69
|
+
}
|
|
70
|
+
parent.quasis.splice(...quasisArgs);
|
|
56
71
|
} else {
|
|
57
72
|
parent.quasis.splice(memberExpressionIndex, 1, j.templateElement({
|
|
58
73
|
raw: precedingTemplateElement.value.raw,
|
|
@@ -2,10 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
const classes = [{
|
|
4
4
|
deprecatedClass: ' .MuiCircularProgress-circleDeterminate',
|
|
5
|
-
replacementSelector: '.MuiCircularProgress-determinate
|
|
5
|
+
replacementSelector: '.MuiCircularProgress-determinate .MuiCircularProgress-circle'
|
|
6
6
|
}, {
|
|
7
7
|
deprecatedClass: ' .MuiCircularProgress-circleIndeterminate',
|
|
8
|
-
replacementSelector: '.MuiCircularProgress-indeterminate
|
|
8
|
+
replacementSelector: '.MuiCircularProgress-indeterminate .MuiCircularProgress-circle'
|
|
9
9
|
}];
|
|
10
10
|
const plugin = () => {
|
|
11
11
|
return {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _CircularProgress = require("@mui/material/CircularProgress");
|
|
4
|
-
"&.MuiCircularProgress-determinate
|
|
5
|
-
"&.MuiCircularProgress-indeterminate
|
|
6
|
-
`&.${_CircularProgress.circularProgressClasses.determinate}
|
|
7
|
-
`&.${_CircularProgress.circularProgressClasses.indeterminate}
|
|
4
|
+
"&.MuiCircularProgress-determinate .MuiCircularProgress-circle";
|
|
5
|
+
"&.MuiCircularProgress-indeterminate .MuiCircularProgress-circle";
|
|
6
|
+
`&.${_CircularProgress.circularProgressClasses.determinate} .${_CircularProgress.circularProgressClasses.circle}`;
|
|
7
|
+
`&.${_CircularProgress.circularProgressClasses.indeterminate} .${_CircularProgress.circularProgressClasses.circle}`;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _CircularProgress = require("@org/ui/material/CircularProgress");
|
|
4
|
-
"&.MuiCircularProgress-determinate
|
|
5
|
-
"&.MuiCircularProgress-indeterminate
|
|
6
|
-
`&.${_CircularProgress.circularProgressClasses.determinate}
|
|
7
|
-
`&.${_CircularProgress.circularProgressClasses.indeterminate}
|
|
4
|
+
"&.MuiCircularProgress-determinate .MuiCircularProgress-circle";
|
|
5
|
+
"&.MuiCircularProgress-indeterminate .MuiCircularProgress-circle";
|
|
6
|
+
`&.${_CircularProgress.circularProgressClasses.determinate} .${_CircularProgress.circularProgressClasses.circle}`;
|
|
7
|
+
`&.${_CircularProgress.circularProgressClasses.indeterminate} .${_CircularProgress.circularProgressClasses.circle}`;
|
|
@@ -7,6 +7,37 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.default = transformer;
|
|
8
8
|
var _movePropIntoSlots = _interopRequireDefault(require("../utils/movePropIntoSlots"));
|
|
9
9
|
var _movePropIntoSlotProps = _interopRequireDefault(require("../utils/movePropIntoSlotProps"));
|
|
10
|
+
var _findComponentJSX = _interopRequireDefault(require("../../util/findComponentJSX"));
|
|
11
|
+
var _findComponentDefaultProps = _interopRequireDefault(require("../../util/findComponentDefaultProps"));
|
|
12
|
+
const slotKeyRenames = {
|
|
13
|
+
StartScrollButtonIcon: 'startScrollButtonIcon',
|
|
14
|
+
EndScrollButtonIcon: 'endScrollButtonIcon'
|
|
15
|
+
};
|
|
16
|
+
function renameSlotKey(property) {
|
|
17
|
+
const name = property.key?.name || property.key?.value;
|
|
18
|
+
if (name && slotKeyRenames[name]) {
|
|
19
|
+
property.key.name = slotKeyRenames[name];
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
function renameJsxSlotKeys(j, element, attributeName) {
|
|
23
|
+
element.openingElement.attributes.forEach(attr => {
|
|
24
|
+
if (attr.type === 'JSXAttribute' && attr.name?.name === attributeName && attr.value?.expression?.type === 'ObjectExpression') {
|
|
25
|
+
attr.value.expression.properties.forEach(renameSlotKey);
|
|
26
|
+
}
|
|
27
|
+
});
|
|
28
|
+
}
|
|
29
|
+
function renameDefaultPropsSlotKeys(j, defaultPropsPathCollection, attributeName) {
|
|
30
|
+
defaultPropsPathCollection.find(j.ObjectProperty, {
|
|
31
|
+
key: {
|
|
32
|
+
name: attributeName
|
|
33
|
+
}
|
|
34
|
+
}).forEach(path => {
|
|
35
|
+
if (path.value.value.type === 'ObjectExpression') {
|
|
36
|
+
path.value.value.properties.forEach(renameSlotKey);
|
|
37
|
+
}
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
|
|
10
41
|
/**
|
|
11
42
|
* @param {import('jscodeshift').FileInfo} file
|
|
12
43
|
* @param {import('jscodeshift').API} api
|
|
@@ -36,5 +67,18 @@ function transformer(file, api, options) {
|
|
|
36
67
|
propName: 'TabIndicatorProps',
|
|
37
68
|
slotName: 'indicator'
|
|
38
69
|
});
|
|
70
|
+
(0, _findComponentJSX.default)(j, {
|
|
71
|
+
root,
|
|
72
|
+
packageName: options.packageName,
|
|
73
|
+
componentName: 'Tabs'
|
|
74
|
+
}, elementPath => {
|
|
75
|
+
renameJsxSlotKeys(j, elementPath.node, 'slots');
|
|
76
|
+
});
|
|
77
|
+
const defaultPropsPathCollection = (0, _findComponentDefaultProps.default)(j, {
|
|
78
|
+
root,
|
|
79
|
+
packageName: options.packageName,
|
|
80
|
+
componentName: 'Tabs'
|
|
81
|
+
});
|
|
82
|
+
renameDefaultPropsSlotKeys(j, defaultPropsPathCollection, 'slots');
|
|
39
83
|
return root.toSource(printOptions);
|
|
40
84
|
}
|
|
@@ -22,6 +22,17 @@ var _jsxRuntime = require("react/jsx-runtime");
|
|
|
22
22
|
className: 'indicator'
|
|
23
23
|
}
|
|
24
24
|
});
|
|
25
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tabs.default, {
|
|
26
|
+
slots: {
|
|
27
|
+
StartScrollButtonIcon: CustomIcon,
|
|
28
|
+
EndScrollButtonIcon: CustomIcon2
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tabs, {
|
|
32
|
+
slots: {
|
|
33
|
+
StartScrollButtonIcon: CustomIcon
|
|
34
|
+
}
|
|
35
|
+
});
|
|
25
36
|
/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomTabs, {
|
|
26
37
|
ScrollButtonComponent: CustomScrollButton,
|
|
27
38
|
TabScrollButtonProps: {
|
|
@@ -30,6 +30,17 @@ var _jsxRuntime = require("react/jsx-runtime");
|
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
32
|
});
|
|
33
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tabs.default, {
|
|
34
|
+
slots: {
|
|
35
|
+
startScrollButtonIcon: CustomIcon,
|
|
36
|
+
endScrollButtonIcon: CustomIcon2
|
|
37
|
+
}
|
|
38
|
+
});
|
|
39
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tabs, {
|
|
40
|
+
slots: {
|
|
41
|
+
startScrollButtonIcon: CustomIcon
|
|
42
|
+
}
|
|
43
|
+
});
|
|
33
44
|
/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomTabs, {
|
|
34
45
|
ScrollButtonComponent: CustomScrollButton,
|
|
35
46
|
TabScrollButtonProps: {
|
|
@@ -22,6 +22,12 @@ var _jsxRuntime = require("react/jsx-runtime");
|
|
|
22
22
|
className: 'indicator'
|
|
23
23
|
}
|
|
24
24
|
});
|
|
25
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tabs.default, {
|
|
26
|
+
slots: {
|
|
27
|
+
StartScrollButtonIcon: CustomIcon,
|
|
28
|
+
EndScrollButtonIcon: CustomIcon2
|
|
29
|
+
}
|
|
30
|
+
});
|
|
25
31
|
/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomTabs, {
|
|
26
32
|
ScrollButtonComponent: CustomScrollButton,
|
|
27
33
|
TabScrollButtonProps: {
|
|
@@ -30,6 +30,12 @@ var _jsxRuntime = require("react/jsx-runtime");
|
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
32
|
});
|
|
33
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tabs.default, {
|
|
34
|
+
slots: {
|
|
35
|
+
startScrollButtonIcon: CustomIcon,
|
|
36
|
+
endScrollButtonIcon: CustomIcon2
|
|
37
|
+
}
|
|
38
|
+
});
|
|
33
39
|
/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomTabs, {
|
|
34
40
|
ScrollButtonComponent: CustomScrollButton,
|
|
35
41
|
TabScrollButtonProps: {
|
package/package.json
CHANGED
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mui/codemod",
|
|
3
|
-
"version": "9.0.0-alpha.
|
|
3
|
+
"version": "9.0.0-alpha.4",
|
|
4
4
|
"author": "MUI Team",
|
|
5
5
|
"description": "Codemod scripts for Material UI.",
|
|
6
|
-
"bin": "./codemod.js",
|
|
7
6
|
"keywords": [
|
|
8
7
|
"react",
|
|
9
8
|
"react-component",
|
|
@@ -23,12 +22,13 @@
|
|
|
23
22
|
"url": "https://opencollective.com/mui-org"
|
|
24
23
|
},
|
|
25
24
|
"dependencies": {
|
|
26
|
-
"@babel/core": "^7.
|
|
25
|
+
"@babel/core": "^7.29.0",
|
|
27
26
|
"@babel/runtime": "^7.28.6",
|
|
28
|
-
"@babel/traverse": "^7.
|
|
27
|
+
"@babel/traverse": "^7.29.0",
|
|
28
|
+
"@mui/material-v5": "npm:@mui/material@5.18.0",
|
|
29
29
|
"jscodeshift": "^17.1.2",
|
|
30
30
|
"jscodeshift-add-imports": "^1.0.11",
|
|
31
|
-
"postcss": "^8.5.
|
|
31
|
+
"postcss": "^8.5.8",
|
|
32
32
|
"postcss-cli": "^11.0.1",
|
|
33
33
|
"yargs": "^17.7.2"
|
|
34
34
|
},
|
|
@@ -42,5 +42,6 @@
|
|
|
42
42
|
"type": "commonjs",
|
|
43
43
|
"exports": {
|
|
44
44
|
"./package.json": "./package.json"
|
|
45
|
-
}
|
|
45
|
+
},
|
|
46
|
+
"bin": "./codemod.js"
|
|
46
47
|
}
|
package/v5.0.0/path-imports.js
CHANGED
|
@@ -6,11 +6,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.default = transformer;
|
|
8
8
|
var _jscodeshiftAddImports = _interopRequireDefault(require("jscodeshift-add-imports"));
|
|
9
|
-
// istanbul ignore next
|
|
10
|
-
if (globalThis.MUI_TEST_ENV) {
|
|
11
|
-
const resolve = require.resolve;
|
|
12
|
-
require.resolve = source => resolve(source.replace(/^@mui\/material\/modern/, '../../../mui-material/src'));
|
|
13
|
-
}
|
|
14
9
|
const barrelImportsToTransform = {
|
|
15
10
|
material: {},
|
|
16
11
|
'icons-material': {}
|
|
@@ -12,11 +12,7 @@ function transformer(fileInfo, api, options) {
|
|
|
12
12
|
const j = api.jscodeshift;
|
|
13
13
|
const importModule = options.importModule || '@mui/material';
|
|
14
14
|
const targetModule = options.targetModule || '@mui/material';
|
|
15
|
-
|
|
16
|
-
if (globalThis.MUI_TEST_ENV) {
|
|
17
|
-
resolveModule = resolveModule.replace(/^@mui\/material/, '@mui/material-v5');
|
|
18
|
-
}
|
|
19
|
-
const whitelist = (0, _getJSExports.default)(require.resolve(`${resolveModule}/modern`, {
|
|
15
|
+
const whitelist = (0, _getJSExports.default)(require.resolve(`@mui/material-v5/modern`, {
|
|
20
16
|
paths: [(0, _path.dirname)(fileInfo.path)]
|
|
21
17
|
}));
|
|
22
18
|
const printOptions = options.printOptions || {
|