@mui/codemod 5.15.11 → 5.15.13
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 +533 -6
- package/node/deprecations/alert-classes/alert-classes.js +58 -0
- package/node/deprecations/alert-classes/index.js +13 -0
- package/node/deprecations/alert-classes/postcss-plugin.js +38 -0
- package/node/deprecations/alert-classes/postcss.config.js +8 -0
- package/node/deprecations/alert-classes/test-cases/actual.js +27 -0
- package/node/deprecations/alert-classes/test-cases/expected.js +27 -0
- package/node/deprecations/alert-props/test-cases/actual.js +17 -0
- package/node/deprecations/alert-props/test-cases/expected.js +12 -1
- package/node/deprecations/alert-props/test-cases/theme.actual.js +21 -0
- package/node/deprecations/alert-props/test-cases/theme.expected.js +17 -1
- package/node/deprecations/all/deprecations-all.js +6 -0
- package/node/deprecations/all/postcss.config.js +10 -1
- package/node/deprecations/button-classes/button-classes.js +69 -0
- package/node/deprecations/button-classes/index.js +13 -0
- package/node/deprecations/button-classes/postcss-plugin.js +126 -0
- package/node/deprecations/button-classes/postcss.config.js +8 -0
- package/node/deprecations/button-classes/test-cases/actual.js +69 -0
- package/node/deprecations/button-classes/test-cases/expected.js +69 -0
- package/node/deprecations/chip-classes/chip-classes.js +77 -0
- package/node/deprecations/chip-classes/index.js +13 -0
- package/node/deprecations/chip-classes/postcss-plugin.js +105 -0
- package/node/deprecations/chip-classes/postcss.config.js +8 -0
- package/node/deprecations/chip-classes/test-cases/actual.js +55 -0
- package/node/deprecations/chip-classes/test-cases/expected.js +55 -0
- package/node/deprecations/slider-props/index.js +13 -0
- package/node/deprecations/slider-props/slider-props.js +22 -0
- package/node/deprecations/slider-props/test-cases/actual.js +60 -0
- package/node/deprecations/slider-props/test-cases/expected.js +44 -0
- package/node/deprecations/slider-props/test-cases/theme.actual.js +73 -0
- package/node/deprecations/slider-props/test-cases/theme.expected.js +58 -0
- package/node/deprecations/utils/replaceComponentsWithSlots.js +11 -1
- package/package.json +4 -4
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = transformer;
|
|
7
|
+
var _postcssPlugin = require("./postcss-plugin");
|
|
8
|
+
/**
|
|
9
|
+
* @param {import('jscodeshift').FileInfo} file
|
|
10
|
+
* @param {import('jscodeshift').API} api
|
|
11
|
+
*/
|
|
12
|
+
function transformer(file, api, options) {
|
|
13
|
+
const j = api.jscodeshift;
|
|
14
|
+
const root = j(file.source);
|
|
15
|
+
const printOptions = options.printOptions;
|
|
16
|
+
_postcssPlugin.classes.forEach(({
|
|
17
|
+
deprecatedClass,
|
|
18
|
+
replacementSelector
|
|
19
|
+
}) => {
|
|
20
|
+
const replacementSelectorPrefix = '&';
|
|
21
|
+
root.find(j.ImportDeclaration).filter(path => path.node.source.value.match(/^@mui\/material\/Chip$/)).forEach(path => {
|
|
22
|
+
path.node.specifiers.forEach(specifier => {
|
|
23
|
+
if (specifier.type === 'ImportSpecifier' && specifier.imported.name === 'chipClasses') {
|
|
24
|
+
const deprecatedAtomicClass = deprecatedClass.replace(`${deprecatedClass.split('-')[0]}-`, '');
|
|
25
|
+
root.find(j.MemberExpression, {
|
|
26
|
+
object: {
|
|
27
|
+
name: specifier.local.name
|
|
28
|
+
},
|
|
29
|
+
property: {
|
|
30
|
+
name: deprecatedAtomicClass
|
|
31
|
+
}
|
|
32
|
+
}).forEach(memberExpression => {
|
|
33
|
+
const parent = memberExpression.parentPath.parentPath.value;
|
|
34
|
+
if (parent.type === j.TemplateLiteral.name) {
|
|
35
|
+
const memberExpressionIndex = parent.expressions.findIndex(expression => expression === memberExpression.value);
|
|
36
|
+
const precedingTemplateElement = parent.quasis[memberExpressionIndex];
|
|
37
|
+
const atomicClasses = replacementSelector.replaceAll('MuiChip-', '').replaceAll(replacementSelectorPrefix, '').replaceAll(' > ', '').split('.').filter(Boolean);
|
|
38
|
+
if (precedingTemplateElement.value.raw.endsWith(deprecatedClass.startsWith(' ') ? `${replacementSelectorPrefix} .` : `${replacementSelectorPrefix}.`)) {
|
|
39
|
+
const atomicClassesArgs = [memberExpressionIndex, 1, ...atomicClasses.map(atomicClass => j.memberExpression(memberExpression.value.object, j.identifier(atomicClass)))];
|
|
40
|
+
parent.expressions.splice(...atomicClassesArgs);
|
|
41
|
+
if (replacementSelector.includes(' > ')) {
|
|
42
|
+
const quasisArgs = [memberExpressionIndex, 1, j.templateElement({
|
|
43
|
+
raw: precedingTemplateElement.value.raw.replace(' ', ''),
|
|
44
|
+
cooked: precedingTemplateElement.value.cooked.replace(' ', '')
|
|
45
|
+
}, false), j.templateElement({
|
|
46
|
+
raw: ' > .',
|
|
47
|
+
cooked: ' > .'
|
|
48
|
+
}, false)];
|
|
49
|
+
if (atomicClasses.length === 3) {
|
|
50
|
+
quasisArgs.splice(3, 0, j.templateElement({
|
|
51
|
+
raw: '.',
|
|
52
|
+
cooked: '.'
|
|
53
|
+
}, false));
|
|
54
|
+
}
|
|
55
|
+
parent.quasis.splice(...quasisArgs);
|
|
56
|
+
} else {
|
|
57
|
+
parent.quasis.splice(memberExpressionIndex, 1, j.templateElement({
|
|
58
|
+
raw: precedingTemplateElement.value.raw,
|
|
59
|
+
cooked: precedingTemplateElement.value.cooked
|
|
60
|
+
}, false), j.templateElement({
|
|
61
|
+
raw: '.',
|
|
62
|
+
cooked: '.'
|
|
63
|
+
}, false));
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
});
|
|
68
|
+
}
|
|
69
|
+
});
|
|
70
|
+
});
|
|
71
|
+
const selectorRegex = new RegExp(`^${replacementSelectorPrefix}${deprecatedClass}`);
|
|
72
|
+
root.find(j.Literal, literal => typeof literal.value === 'string' && literal.value.match(selectorRegex)).forEach(path => {
|
|
73
|
+
path.replace(j.literal(path.value.value.replace(selectorRegex, `${replacementSelectorPrefix}${replacementSelector}`)));
|
|
74
|
+
});
|
|
75
|
+
});
|
|
76
|
+
return root.toSource(printOptions);
|
|
77
|
+
}
|
|
@@ -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 _chipClasses.default;
|
|
11
|
+
}
|
|
12
|
+
});
|
|
13
|
+
var _chipClasses = _interopRequireDefault(require("./chip-classes"));
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
const classes = [{
|
|
4
|
+
deprecatedClass: '.MuiChip-clickableColorPrimary',
|
|
5
|
+
replacementSelector: '.MuiChip-clickable.MuiChip-colorPrimary'
|
|
6
|
+
}, {
|
|
7
|
+
deprecatedClass: '.MuiChip-clickableColorSecondary',
|
|
8
|
+
replacementSelector: '.MuiChip-clickable.MuiChip-colorSecondary'
|
|
9
|
+
}, {
|
|
10
|
+
deprecatedClass: '.MuiChip-deletableColorPrimary',
|
|
11
|
+
replacementSelector: '.MuiChip-deletable.MuiChip-colorPrimary'
|
|
12
|
+
}, {
|
|
13
|
+
deprecatedClass: '.MuiChip-deletableColorSecondary',
|
|
14
|
+
replacementSelector: '.MuiChip-deletable.MuiChip-colorSecondary'
|
|
15
|
+
}, {
|
|
16
|
+
deprecatedClass: '.MuiChip-outlinedPrimary',
|
|
17
|
+
replacementSelector: '.MuiChip-outlined.MuiChip-colorPrimary'
|
|
18
|
+
}, {
|
|
19
|
+
deprecatedClass: '.MuiChip-outlinedSecondary',
|
|
20
|
+
replacementSelector: '.MuiChip-outlined.MuiChip-colorSecondary'
|
|
21
|
+
}, {
|
|
22
|
+
deprecatedClass: '.MuiChip-filledPrimary',
|
|
23
|
+
replacementSelector: '.MuiChip-filled.MuiChip-colorPrimary'
|
|
24
|
+
}, {
|
|
25
|
+
deprecatedClass: '.MuiChip-filledSecondary',
|
|
26
|
+
replacementSelector: '.MuiChip-filled.MuiChip-colorSecondary'
|
|
27
|
+
}, {
|
|
28
|
+
deprecatedClass: ' .MuiChip-avatarSmall',
|
|
29
|
+
replacementSelector: '.MuiChip-sizeSmall > .MuiChip-avatar'
|
|
30
|
+
}, {
|
|
31
|
+
deprecatedClass: ' .MuiChip-avatarMedium',
|
|
32
|
+
replacementSelector: '.MuiChip-sizeMedium > .MuiChip-avatar'
|
|
33
|
+
}, {
|
|
34
|
+
deprecatedClass: ' .MuiChip-avatarColorPrimary',
|
|
35
|
+
replacementSelector: '.MuiChip-colorPrimary > .MuiChip-avatar'
|
|
36
|
+
}, {
|
|
37
|
+
deprecatedClass: ' .MuiChip-avatarColorSecondary',
|
|
38
|
+
replacementSelector: '.MuiChip-colorSecondary > .MuiChip-avatar'
|
|
39
|
+
}, {
|
|
40
|
+
deprecatedClass: ' .MuiChip-iconSmall',
|
|
41
|
+
replacementSelector: '.MuiChip-sizeSmall > .MuiChip-icon'
|
|
42
|
+
}, {
|
|
43
|
+
deprecatedClass: ' .MuiChip-iconMedium',
|
|
44
|
+
replacementSelector: '.MuiChip-sizeMedium > .MuiChip-icon'
|
|
45
|
+
}, {
|
|
46
|
+
deprecatedClass: ' .MuiChip-iconColorPrimary',
|
|
47
|
+
replacementSelector: '.MuiChip-colorPrimary > .MuiChip-icon'
|
|
48
|
+
}, {
|
|
49
|
+
deprecatedClass: ' .MuiChip-iconColorSecondary',
|
|
50
|
+
replacementSelector: '.MuiChip-colorSecondary > .MuiChip-icon'
|
|
51
|
+
}, {
|
|
52
|
+
deprecatedClass: ' .MuiChip-labelSmall',
|
|
53
|
+
replacementSelector: '.MuiChip-sizeSmall > .MuiChip-label'
|
|
54
|
+
}, {
|
|
55
|
+
deprecatedClass: ' .MuiChip-labelMedium',
|
|
56
|
+
replacementSelector: '.MuiChip-sizeMedium > .MuiChip-label'
|
|
57
|
+
}, {
|
|
58
|
+
deprecatedClass: ' .MuiChip-deleteIconSmall',
|
|
59
|
+
replacementSelector: '.MuiChip-sizeSmall > .MuiChip-deleteIcon'
|
|
60
|
+
}, {
|
|
61
|
+
deprecatedClass: ' .MuiChip-deleteIconMedium',
|
|
62
|
+
replacementSelector: '.MuiChip-sizeMedium > .MuiChip-deleteIcon'
|
|
63
|
+
}, {
|
|
64
|
+
deprecatedClass: ' .MuiChip-deleteIconColorPrimary',
|
|
65
|
+
replacementSelector: '.MuiChip-colorPrimary > .MuiChip-deleteIcon'
|
|
66
|
+
}, {
|
|
67
|
+
deprecatedClass: ' .MuiChip-deleteIconColorSecondary',
|
|
68
|
+
replacementSelector: '.MuiChip-colorSecondary > .MuiChip-deleteIcon'
|
|
69
|
+
}, {
|
|
70
|
+
deprecatedClass: ' .MuiChip-deleteIconOutlinedColorPrimary',
|
|
71
|
+
replacementSelector: '.MuiChip-outlined.MuiChip-colorPrimary > .MuiChip-deleteIcon'
|
|
72
|
+
}, {
|
|
73
|
+
deprecatedClass: ' .MuiChip-deleteIconOutlinedColorSecondary',
|
|
74
|
+
replacementSelector: '.MuiChip-outlined.MuiChip-colorSecondary > .MuiChip-deleteIcon'
|
|
75
|
+
}, {
|
|
76
|
+
deprecatedClass: ' .MuiChip-deleteIconFilledColorPrimary',
|
|
77
|
+
replacementSelector: '.MuiChip-filled.MuiChip-colorPrimary > .MuiChip-deleteIcon'
|
|
78
|
+
}, {
|
|
79
|
+
deprecatedClass: ' .MuiChip-deleteIconFilledColorSecondary',
|
|
80
|
+
replacementSelector: '.MuiChip-filled.MuiChip-colorSecondary > .MuiChip-deleteIcon'
|
|
81
|
+
}];
|
|
82
|
+
const plugin = () => {
|
|
83
|
+
return {
|
|
84
|
+
postcssPlugin: `Replace deperecated Chip classes with new classes`,
|
|
85
|
+
Rule(rule) {
|
|
86
|
+
const {
|
|
87
|
+
selector
|
|
88
|
+
} = rule;
|
|
89
|
+
classes.forEach(({
|
|
90
|
+
deprecatedClass,
|
|
91
|
+
replacementSelector
|
|
92
|
+
}) => {
|
|
93
|
+
const selectorRegex = new RegExp(`${deprecatedClass}`);
|
|
94
|
+
if (selector.match(selectorRegex)) {
|
|
95
|
+
rule.selector = selector.replace(selectorRegex, replacementSelector);
|
|
96
|
+
}
|
|
97
|
+
});
|
|
98
|
+
}
|
|
99
|
+
};
|
|
100
|
+
};
|
|
101
|
+
plugin.postcss = true;
|
|
102
|
+
module.exports = {
|
|
103
|
+
plugin,
|
|
104
|
+
classes
|
|
105
|
+
};
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _Chip = require("@mui/material/Chip");
|
|
4
|
+
'&.MuiChip-clickableColorPrimary';
|
|
5
|
+
'&.MuiChip-clickableColorSecondary';
|
|
6
|
+
'&.MuiChip-deletableColorPrimary';
|
|
7
|
+
'&.MuiChip-deletableColorSecondary';
|
|
8
|
+
'&.MuiChip-outlinedPrimary';
|
|
9
|
+
'&.MuiChip-outlinedSecondary';
|
|
10
|
+
'&.MuiChip-filledPrimary';
|
|
11
|
+
'&.MuiChip-filledSecondary';
|
|
12
|
+
'& .MuiChip-avatarSmall';
|
|
13
|
+
'& .MuiChip-avatarMedium';
|
|
14
|
+
'& .MuiChip-avatarColorPrimary';
|
|
15
|
+
'& .MuiChip-avatarColorSecondary';
|
|
16
|
+
'& .MuiChip-iconSmall';
|
|
17
|
+
'& .MuiChip-iconMedium';
|
|
18
|
+
'& .MuiChip-iconColorPrimary';
|
|
19
|
+
'& .MuiChip-iconColorSecondary';
|
|
20
|
+
'& .MuiChip-labelSmall';
|
|
21
|
+
'& .MuiChip-labelMedium';
|
|
22
|
+
'& .MuiChip-deleteIconSmall';
|
|
23
|
+
'& .MuiChip-deleteIconMedium';
|
|
24
|
+
'& .MuiChip-deleteIconColorPrimary';
|
|
25
|
+
'& .MuiChip-deleteIconColorSecondary';
|
|
26
|
+
'& .MuiChip-deleteIconFilledColorPrimary';
|
|
27
|
+
'& .MuiChip-deleteIconFilledColorSecondary';
|
|
28
|
+
'& .MuiChip-deleteIconOutlinedColorPrimary';
|
|
29
|
+
'& .MuiChip-deleteIconOutlinedColorSecondary';
|
|
30
|
+
`&.${_Chip.chipClasses.clickableColorPrimary}`;
|
|
31
|
+
`&.${_Chip.chipClasses.clickableColorSecondary}`;
|
|
32
|
+
`&.${_Chip.chipClasses.deletableColorPrimary}`;
|
|
33
|
+
`&.${_Chip.chipClasses.deletableColorSecondary}`;
|
|
34
|
+
`&.${_Chip.chipClasses.outlinedPrimary}`;
|
|
35
|
+
`&.${_Chip.chipClasses.outlinedSecondary}`;
|
|
36
|
+
`&.${_Chip.chipClasses.filledPrimary}`;
|
|
37
|
+
`&.${_Chip.chipClasses.filledSecondary}`;
|
|
38
|
+
`& .${_Chip.chipClasses.avatarSmall}`;
|
|
39
|
+
`& .${_Chip.chipClasses.avatarMedium}`;
|
|
40
|
+
`& .${_Chip.chipClasses.avatarColorPrimary}`;
|
|
41
|
+
`& .${_Chip.chipClasses.avatarColorSecondary}`;
|
|
42
|
+
`& .${_Chip.chipClasses.iconSmall}`;
|
|
43
|
+
`& .${_Chip.chipClasses.iconMedium}`;
|
|
44
|
+
`& .${_Chip.chipClasses.iconColorPrimary}`;
|
|
45
|
+
`& .${_Chip.chipClasses.iconColorSecondary}`;
|
|
46
|
+
`& .${_Chip.chipClasses.labelSmall}`;
|
|
47
|
+
`& .${_Chip.chipClasses.labelMedium}`;
|
|
48
|
+
`& .${_Chip.chipClasses.deleteIconSmall}`;
|
|
49
|
+
`& .${_Chip.chipClasses.deleteIconMedium}`;
|
|
50
|
+
`& .${_Chip.chipClasses.deleteIconColorPrimary}`;
|
|
51
|
+
`& .${_Chip.chipClasses.deleteIconColorSecondary}`;
|
|
52
|
+
`& .${_Chip.chipClasses.deleteIconFilledColorPrimary}`;
|
|
53
|
+
`& .${_Chip.chipClasses.deleteIconFilledColorSecondary}`;
|
|
54
|
+
`& .${_Chip.chipClasses.deleteIconOutlinedColorPrimary}`;
|
|
55
|
+
`& .${_Chip.chipClasses.deleteIconOutlinedColorSecondary}`;
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _Chip = require("@mui/material/Chip");
|
|
4
|
+
"&.MuiChip-clickable.MuiChip-colorPrimary";
|
|
5
|
+
"&.MuiChip-clickable.MuiChip-colorSecondary";
|
|
6
|
+
"&.MuiChip-deletable.MuiChip-colorPrimary";
|
|
7
|
+
"&.MuiChip-deletable.MuiChip-colorSecondary";
|
|
8
|
+
"&.MuiChip-outlined.MuiChip-colorPrimary";
|
|
9
|
+
"&.MuiChip-outlined.MuiChip-colorSecondary";
|
|
10
|
+
"&.MuiChip-filled.MuiChip-colorPrimary";
|
|
11
|
+
"&.MuiChip-filled.MuiChip-colorSecondary";
|
|
12
|
+
"&.MuiChip-sizeSmall > .MuiChip-avatar";
|
|
13
|
+
"&.MuiChip-sizeMedium > .MuiChip-avatar";
|
|
14
|
+
"&.MuiChip-colorPrimary > .MuiChip-avatar";
|
|
15
|
+
"&.MuiChip-colorSecondary > .MuiChip-avatar";
|
|
16
|
+
"&.MuiChip-sizeSmall > .MuiChip-icon";
|
|
17
|
+
"&.MuiChip-sizeMedium > .MuiChip-icon";
|
|
18
|
+
"&.MuiChip-colorPrimary > .MuiChip-icon";
|
|
19
|
+
"&.MuiChip-colorSecondary > .MuiChip-icon";
|
|
20
|
+
"&.MuiChip-sizeSmall > .MuiChip-label";
|
|
21
|
+
"&.MuiChip-sizeMedium > .MuiChip-label";
|
|
22
|
+
"&.MuiChip-sizeSmall > .MuiChip-deleteIcon";
|
|
23
|
+
"&.MuiChip-sizeMedium > .MuiChip-deleteIcon";
|
|
24
|
+
"&.MuiChip-colorPrimary > .MuiChip-deleteIcon";
|
|
25
|
+
"&.MuiChip-colorSecondary > .MuiChip-deleteIcon";
|
|
26
|
+
"&.MuiChip-filled.MuiChip-colorPrimary > .MuiChip-deleteIcon";
|
|
27
|
+
"&.MuiChip-filled.MuiChip-colorSecondary > .MuiChip-deleteIcon";
|
|
28
|
+
"&.MuiChip-outlined.MuiChip-colorPrimary > .MuiChip-deleteIcon";
|
|
29
|
+
"&.MuiChip-outlined.MuiChip-colorSecondary > .MuiChip-deleteIcon";
|
|
30
|
+
`&.${_Chip.chipClasses.clickable}.${_Chip.chipClasses.colorPrimary}`;
|
|
31
|
+
`&.${_Chip.chipClasses.clickable}.${_Chip.chipClasses.colorSecondary}`;
|
|
32
|
+
`&.${_Chip.chipClasses.deletable}.${_Chip.chipClasses.colorPrimary}`;
|
|
33
|
+
`&.${_Chip.chipClasses.deletable}.${_Chip.chipClasses.colorSecondary}`;
|
|
34
|
+
`&.${_Chip.chipClasses.outlined}.${_Chip.chipClasses.colorPrimary}`;
|
|
35
|
+
`&.${_Chip.chipClasses.outlined}.${_Chip.chipClasses.colorSecondary}`;
|
|
36
|
+
`&.${_Chip.chipClasses.filled}.${_Chip.chipClasses.colorPrimary}`;
|
|
37
|
+
`&.${_Chip.chipClasses.filled}.${_Chip.chipClasses.colorSecondary}`;
|
|
38
|
+
`&.${_Chip.chipClasses.sizeSmall} > .${_Chip.chipClasses.avatar}`;
|
|
39
|
+
`&.${_Chip.chipClasses.sizeMedium} > .${_Chip.chipClasses.avatar}`;
|
|
40
|
+
`&.${_Chip.chipClasses.colorPrimary} > .${_Chip.chipClasses.avatar}`;
|
|
41
|
+
`&.${_Chip.chipClasses.colorSecondary} > .${_Chip.chipClasses.avatar}`;
|
|
42
|
+
`&.${_Chip.chipClasses.sizeSmall} > .${_Chip.chipClasses.icon}`;
|
|
43
|
+
`&.${_Chip.chipClasses.sizeMedium} > .${_Chip.chipClasses.icon}`;
|
|
44
|
+
`&.${_Chip.chipClasses.colorPrimary} > .${_Chip.chipClasses.icon}`;
|
|
45
|
+
`&.${_Chip.chipClasses.colorSecondary} > .${_Chip.chipClasses.icon}`;
|
|
46
|
+
`&.${_Chip.chipClasses.sizeSmall} > .${_Chip.chipClasses.label}`;
|
|
47
|
+
`&.${_Chip.chipClasses.sizeMedium} > .${_Chip.chipClasses.label}`;
|
|
48
|
+
`&.${_Chip.chipClasses.sizeSmall} > .${_Chip.chipClasses.deleteIcon}`;
|
|
49
|
+
`&.${_Chip.chipClasses.sizeMedium} > .${_Chip.chipClasses.deleteIcon}`;
|
|
50
|
+
`&.${_Chip.chipClasses.colorPrimary} > .${_Chip.chipClasses.deleteIcon}`;
|
|
51
|
+
`&.${_Chip.chipClasses.colorSecondary} > .${_Chip.chipClasses.deleteIcon}`;
|
|
52
|
+
`&.${_Chip.chipClasses.filled}.${_Chip.chipClasses.colorPrimary} > .${_Chip.chipClasses.deleteIcon}`;
|
|
53
|
+
`&.${_Chip.chipClasses.filled}.${_Chip.chipClasses.colorSecondary} > .${_Chip.chipClasses.deleteIcon}`;
|
|
54
|
+
`&.${_Chip.chipClasses.outlined}.${_Chip.chipClasses.colorPrimary} > .${_Chip.chipClasses.deleteIcon}`;
|
|
55
|
+
`&.${_Chip.chipClasses.outlined}.${_Chip.chipClasses.colorSecondary} > .${_Chip.chipClasses.deleteIcon}`;
|
|
@@ -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 _sliderProps.default;
|
|
11
|
+
}
|
|
12
|
+
});
|
|
13
|
+
var _sliderProps = _interopRequireDefault(require("./slider-props"));
|
|
@@ -0,0 +1,22 @@
|
|
|
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 _replaceComponentsWithSlots = _interopRequireDefault(require("../utils/replaceComponentsWithSlots"));
|
|
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, _replaceComponentsWithSlots.default)(j, {
|
|
18
|
+
root,
|
|
19
|
+
componentName: 'Slider'
|
|
20
|
+
});
|
|
21
|
+
return root.toSource(printOptions);
|
|
22
|
+
}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _Slider = _interopRequireDefault(require("@mui/material/Slider"));
|
|
5
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
6
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Slider.default, {
|
|
7
|
+
components: {
|
|
8
|
+
Track: ComponentsTrack
|
|
9
|
+
},
|
|
10
|
+
componentsProps: {
|
|
11
|
+
track: componentsTrackProps
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Slider.default, {
|
|
15
|
+
slots: {
|
|
16
|
+
rail: SlotsRail
|
|
17
|
+
},
|
|
18
|
+
components: {
|
|
19
|
+
Track: ComponentsTrack
|
|
20
|
+
},
|
|
21
|
+
slotProps: {
|
|
22
|
+
rail: slotsRailProps
|
|
23
|
+
},
|
|
24
|
+
componentsProps: {
|
|
25
|
+
track: componentsTrackProps
|
|
26
|
+
}
|
|
27
|
+
});
|
|
28
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Slider.default, {
|
|
29
|
+
slots: {
|
|
30
|
+
rail: SlotsRail,
|
|
31
|
+
track: SlotsTrack
|
|
32
|
+
},
|
|
33
|
+
components: {
|
|
34
|
+
Track: ComponentsTrack
|
|
35
|
+
},
|
|
36
|
+
slotProps: {
|
|
37
|
+
rail: slotsRailProps,
|
|
38
|
+
track: slotsTrackProps
|
|
39
|
+
},
|
|
40
|
+
componentsProps: {
|
|
41
|
+
track: componentsTrackProps
|
|
42
|
+
}
|
|
43
|
+
});
|
|
44
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Slider.default, {
|
|
45
|
+
slots: {
|
|
46
|
+
rail: SlotsRail,
|
|
47
|
+
track: SlotsTrack
|
|
48
|
+
},
|
|
49
|
+
components: {
|
|
50
|
+
Track: ComponentsTrack
|
|
51
|
+
},
|
|
52
|
+
slotProps: {
|
|
53
|
+
rail: slotsRailProps,
|
|
54
|
+
track: slotsTrackProps
|
|
55
|
+
},
|
|
56
|
+
componentsProps: {
|
|
57
|
+
track: componentsTrackProps,
|
|
58
|
+
rail: componentsRailProps
|
|
59
|
+
}
|
|
60
|
+
});
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
5
|
+
var _Slider = _interopRequireDefault(require("@mui/material/Slider"));
|
|
6
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
7
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Slider.default, {
|
|
8
|
+
slots: {
|
|
9
|
+
track: ComponentsTrack
|
|
10
|
+
},
|
|
11
|
+
slotProps: {
|
|
12
|
+
track: componentsTrackProps
|
|
13
|
+
}
|
|
14
|
+
});
|
|
15
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Slider.default, {
|
|
16
|
+
slots: {
|
|
17
|
+
rail: SlotsRail,
|
|
18
|
+
track: ComponentsTrack
|
|
19
|
+
},
|
|
20
|
+
slotProps: {
|
|
21
|
+
rail: slotsRailProps,
|
|
22
|
+
track: componentsTrackProps
|
|
23
|
+
}
|
|
24
|
+
});
|
|
25
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Slider.default, {
|
|
26
|
+
slots: {
|
|
27
|
+
rail: SlotsRail,
|
|
28
|
+
track: SlotsTrack
|
|
29
|
+
},
|
|
30
|
+
slotProps: {
|
|
31
|
+
rail: slotsRailProps,
|
|
32
|
+
track: (0, _extends2.default)({}, componentsTrackProps, slotsTrackProps)
|
|
33
|
+
}
|
|
34
|
+
});
|
|
35
|
+
/*#__PURE__*/(0, _jsxRuntime.jsx)(_Slider.default, {
|
|
36
|
+
slots: {
|
|
37
|
+
rail: SlotsRail,
|
|
38
|
+
track: SlotsTrack
|
|
39
|
+
},
|
|
40
|
+
slotProps: {
|
|
41
|
+
track: (0, _extends2.default)({}, componentsTrackProps, slotsTrackProps),
|
|
42
|
+
rail: (0, _extends2.default)({}, componentsRailProps, slotsRailProps)
|
|
43
|
+
}
|
|
44
|
+
});
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
fn({
|
|
4
|
+
MuiSlider: {
|
|
5
|
+
defaultProps: {
|
|
6
|
+
components: {
|
|
7
|
+
Track: ComponentsTrack
|
|
8
|
+
},
|
|
9
|
+
componentsProps: {
|
|
10
|
+
track: componentsTrackProps
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
});
|
|
15
|
+
fn({
|
|
16
|
+
MuiSlider: {
|
|
17
|
+
defaultProps: {
|
|
18
|
+
components: {
|
|
19
|
+
Track: ComponentsTrack
|
|
20
|
+
},
|
|
21
|
+
slots: {
|
|
22
|
+
rail: SlotsRail
|
|
23
|
+
},
|
|
24
|
+
componentsProps: {
|
|
25
|
+
track: componentsTrackProps
|
|
26
|
+
},
|
|
27
|
+
slotProps: {
|
|
28
|
+
rail: slotsRailProps
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
});
|
|
33
|
+
fn({
|
|
34
|
+
MuiSlider: {
|
|
35
|
+
defaultProps: {
|
|
36
|
+
components: {
|
|
37
|
+
Track: ComponentsTrack
|
|
38
|
+
},
|
|
39
|
+
slots: {
|
|
40
|
+
rail: SlotsRail,
|
|
41
|
+
track: SlotsTrack
|
|
42
|
+
},
|
|
43
|
+
componentsProps: {
|
|
44
|
+
track: componentsTrackProps
|
|
45
|
+
},
|
|
46
|
+
slotProps: {
|
|
47
|
+
rail: slotsRailProps,
|
|
48
|
+
track: slotsTrackProps
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
});
|
|
53
|
+
fn({
|
|
54
|
+
MuiSlider: {
|
|
55
|
+
defaultProps: {
|
|
56
|
+
components: {
|
|
57
|
+
Track: ComponentsTrack
|
|
58
|
+
},
|
|
59
|
+
slots: {
|
|
60
|
+
rail: SlotsRail,
|
|
61
|
+
track: SlotsTrack
|
|
62
|
+
},
|
|
63
|
+
componentsProps: {
|
|
64
|
+
track: componentsTrackProps,
|
|
65
|
+
rail: componentsRailProps
|
|
66
|
+
},
|
|
67
|
+
slotProps: {
|
|
68
|
+
rail: slotsRailProps,
|
|
69
|
+
track: slotsTrackProps
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
});
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
5
|
+
fn({
|
|
6
|
+
MuiSlider: {
|
|
7
|
+
defaultProps: {
|
|
8
|
+
slots: {
|
|
9
|
+
track: ComponentsTrack
|
|
10
|
+
},
|
|
11
|
+
slotProps: {
|
|
12
|
+
track: componentsTrackProps
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
});
|
|
17
|
+
fn({
|
|
18
|
+
MuiSlider: {
|
|
19
|
+
defaultProps: {
|
|
20
|
+
slots: {
|
|
21
|
+
track: ComponentsTrack,
|
|
22
|
+
rail: SlotsRail
|
|
23
|
+
},
|
|
24
|
+
slotProps: {
|
|
25
|
+
track: componentsTrackProps,
|
|
26
|
+
rail: slotsRailProps
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
fn({
|
|
32
|
+
MuiSlider: {
|
|
33
|
+
defaultProps: {
|
|
34
|
+
slots: {
|
|
35
|
+
track: SlotsTrack,
|
|
36
|
+
rail: SlotsRail
|
|
37
|
+
},
|
|
38
|
+
slotProps: {
|
|
39
|
+
track: (0, _extends2.default)({}, componentsTrackProps, slotsTrackProps),
|
|
40
|
+
rail: slotsRailProps
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
});
|
|
45
|
+
fn({
|
|
46
|
+
MuiSlider: {
|
|
47
|
+
defaultProps: {
|
|
48
|
+
slots: {
|
|
49
|
+
track: SlotsTrack,
|
|
50
|
+
rail: SlotsRail
|
|
51
|
+
},
|
|
52
|
+
slotProps: {
|
|
53
|
+
track: (0, _extends2.default)({}, componentsTrackProps, slotsTrackProps),
|
|
54
|
+
rail: (0, _extends2.default)({}, componentsRailProps, slotsRailProps)
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
});
|
|
@@ -76,6 +76,16 @@ function replaceJsxComponentsPropsProp(j, element) {
|
|
|
76
76
|
key: prop.key.name,
|
|
77
77
|
expression: prop.value
|
|
78
78
|
});
|
|
79
|
+
} else {
|
|
80
|
+
attr.value.expression.properties = attr.value.expression.properties.filter(p => {
|
|
81
|
+
var _p$key;
|
|
82
|
+
return (p == null || (_p$key = p.key) == null ? void 0 : _p$key.name) !== prop.key.name;
|
|
83
|
+
});
|
|
84
|
+
(0, _assignObject.default)(j, {
|
|
85
|
+
target: attr,
|
|
86
|
+
key: prop.key.name,
|
|
87
|
+
expression: j.objectExpression([j.spreadElement(prop.value), j.spreadElement(slotProps[prop.key.name])])
|
|
88
|
+
});
|
|
79
89
|
}
|
|
80
90
|
});
|
|
81
91
|
}
|
|
@@ -137,7 +147,7 @@ function replaceDefaultPropsComponentsPropsProp(j, defaultPropsPathCollection) {
|
|
|
137
147
|
const existingSlots = defaultPropsProperties.find(prop => prop.key.name === 'slotProps');
|
|
138
148
|
const slots = existingSlots ? existingSlots.value.properties.reduce((acc, prop) => {
|
|
139
149
|
return (0, _extends2.default)({}, acc, {
|
|
140
|
-
[prop.key.name]: prop.value
|
|
150
|
+
[prop.key.name]: components[prop.key.name] ? j.objectExpression([j.spreadElement(components[prop.key.name]), j.spreadElement(prop.value)]) : prop.value
|
|
141
151
|
});
|
|
142
152
|
}, {}) : {};
|
|
143
153
|
const updatedSlots = j.objectExpression(Object.entries((0, _extends2.default)({}, components, slots)).map(([slot, value]) => {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mui/codemod",
|
|
3
|
-
"version": "5.15.
|
|
3
|
+
"version": "5.15.13",
|
|
4
4
|
"bin": "./codemod.js",
|
|
5
5
|
"private": false,
|
|
6
6
|
"author": "MUI Team",
|
|
@@ -29,12 +29,12 @@
|
|
|
29
29
|
"@babel/traverse": "^7.23.9",
|
|
30
30
|
"jscodeshift": "^0.13.1",
|
|
31
31
|
"jscodeshift-add-imports": "^1.0.10",
|
|
32
|
-
"postcss": "^8.4.
|
|
33
|
-
"postcss-cli": "^8.
|
|
32
|
+
"postcss": "^8.4.35",
|
|
33
|
+
"postcss-cli": "^8.3.1",
|
|
34
34
|
"yargs": "^17.7.2"
|
|
35
35
|
},
|
|
36
36
|
"devDependencies": {
|
|
37
|
-
"@types/chai": "^4.3.
|
|
37
|
+
"@types/chai": "^4.3.12",
|
|
38
38
|
"@types/jscodeshift": "0.11.5",
|
|
39
39
|
"chai": "^4.4.1"
|
|
40
40
|
},
|