@mui/x-codemod 6.0.0-beta.4 → 6.0.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/README.md
CHANGED
|
@@ -201,7 +201,7 @@ If you were always using the same text value in all your components, consider mo
|
|
|
201
201
|
</LocalizationProvider>
|
|
202
202
|
```
|
|
203
203
|
|
|
204
|
-
You can find more details about Date and Time breaking changes in [the migration guide](https://
|
|
204
|
+
You can find more details about Date and Time breaking changes in [the migration guide](https://mui.com/x/migration/migration-pickers-v5/).
|
|
205
205
|
|
|
206
206
|
#### `replace-tabs-props`
|
|
207
207
|
|
|
@@ -381,7 +381,7 @@ Rename toolbar related translation keys, removing `Default` part from them to be
|
|
|
381
381
|
npx @mui/x-codemod v6.0.0/pickers/rename-default-toolbar-title-localeText <path>
|
|
382
382
|
```
|
|
383
383
|
|
|
384
|
-
#### `rename-components-to-slots`
|
|
384
|
+
#### `rename-components-to-slots-pickers`
|
|
385
385
|
|
|
386
386
|
Renames the `components` and `componentsProps` props to `slots` and `slotProps`, respectively.
|
|
387
387
|
|
|
@@ -680,4 +680,23 @@ Replace `onCellFocusOut` prop with `componentsProps.cell.onBlur`.
|
|
|
680
680
|
npx @mui/x-codemod v6.0.0/data-grid/replace-onCellFocusOut-prop <path>
|
|
681
681
|
```
|
|
682
682
|
|
|
683
|
-
|
|
683
|
+
#### `rename-components-to-slots-data-grid`
|
|
684
|
+
|
|
685
|
+
Renames the `components` and `componentsProps` props to `slots` and `slotProps`, respectively.
|
|
686
|
+
|
|
687
|
+
This change only affects data grid components.
|
|
688
|
+
|
|
689
|
+
```diff
|
|
690
|
+
<DataGrid
|
|
691
|
+
- components={{ Toolbar: CustomToolbar }}
|
|
692
|
+
+ slots={{ toolbar: CustomToolbar }}
|
|
693
|
+
- componentsProps={{ actionBar: { actions: ['clear'] } }}
|
|
694
|
+
+ slotProps={{ actionBar: { actions: ['clear'] } }}
|
|
695
|
+
/>;
|
|
696
|
+
```
|
|
697
|
+
|
|
698
|
+
```sh
|
|
699
|
+
npx @mui/x-codemod v6.0.0/data-grid/rename-components-to-slots <path>
|
|
700
|
+
```
|
|
701
|
+
|
|
702
|
+
You can find more details about Data Grid breaking change in [the migration guide](https://mui.com/x/migration/migration-data-grid-v5/).
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mui/x-codemod",
|
|
3
|
-
"version": "6.0.0
|
|
3
|
+
"version": "6.0.0",
|
|
4
4
|
"bin": "./codemod.js",
|
|
5
5
|
"private": false,
|
|
6
6
|
"author": "MUI Team",
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
"directory": "packages/x-codemod"
|
|
26
26
|
},
|
|
27
27
|
"license": "MIT",
|
|
28
|
-
"homepage": "https://github.com/mui/mui-x/
|
|
28
|
+
"homepage": "https://github.com/mui/mui-x/blob/-/packages/x-codemod",
|
|
29
29
|
"funding": {
|
|
30
30
|
"type": "opencollective",
|
|
31
31
|
"url": "https://opencollective.com/mui"
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
"@babel/traverse": "^7.20.13",
|
|
37
37
|
"jscodeshift": "0.13.1",
|
|
38
38
|
"jscodeshift-add-imports": "^1.0.10",
|
|
39
|
-
"yargs": "^17.
|
|
39
|
+
"yargs": "^17.7.1"
|
|
40
40
|
},
|
|
41
41
|
"devDependencies": {
|
|
42
42
|
"@types/jscodeshift": "^0.11.5"
|
|
@@ -8,7 +8,7 @@ exports.default = transformer;
|
|
|
8
8
|
var _removeObjectProperty = _interopRequireDefault(require("../../../util/removeObjectProperty"));
|
|
9
9
|
const componentsNames = ['DataGrid', 'DataGridPro', 'DataGridPremium'];
|
|
10
10
|
const propName = 'experimentalFeatures';
|
|
11
|
-
const
|
|
11
|
+
const propKeys = ['newEditingApi', 'rowPinning', 'aggregation'];
|
|
12
12
|
function transformer(file, api, options) {
|
|
13
13
|
const j = api.jscodeshift;
|
|
14
14
|
const root = j(file.source);
|
|
@@ -16,12 +16,14 @@ function transformer(file, api, options) {
|
|
|
16
16
|
quote: 'single',
|
|
17
17
|
trailingComma: true
|
|
18
18
|
};
|
|
19
|
-
(
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
19
|
+
propKeys.forEach(propKey => {
|
|
20
|
+
(0, _removeObjectProperty.default)({
|
|
21
|
+
root,
|
|
22
|
+
j,
|
|
23
|
+
propName,
|
|
24
|
+
componentsNames,
|
|
25
|
+
propKey
|
|
26
|
+
});
|
|
25
27
|
});
|
|
26
28
|
return root.toSource(printOptions);
|
|
27
29
|
}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = transformer;
|
|
7
|
+
var _renameIdentifiers = require("../../../util/renameIdentifiers");
|
|
8
|
+
const preRequisites = {
|
|
9
|
+
components: ['DataGrid', 'DataGridPro', 'DataGridPremium'],
|
|
10
|
+
packageRegex: /@mui\/x-data-grid(-pro|-premium)?/
|
|
11
|
+
};
|
|
12
|
+
function transformComponentsProp(attributeNode) {
|
|
13
|
+
attributeNode.value.name.name = 'slots';
|
|
14
|
+
const valueExpression = attributeNode.value.value.expression;
|
|
15
|
+
if (!valueExpression || valueExpression.type !== 'ObjectExpression') {
|
|
16
|
+
return;
|
|
17
|
+
}
|
|
18
|
+
valueExpression.properties.forEach(property => {
|
|
19
|
+
property.key.name = property.key.name[0].toLowerCase() + property.key.name.slice(1);
|
|
20
|
+
if (property.shorthand) {
|
|
21
|
+
property.shorthand = false;
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
}
|
|
25
|
+
function transformComponentsPropsProp(attributeNode) {
|
|
26
|
+
attributeNode.value.name.name = 'slotProps';
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
/**
|
|
30
|
+
* @param {import('jscodeshift').FileInfo} file
|
|
31
|
+
* @param {import('jscodeshift').API} api
|
|
32
|
+
*/
|
|
33
|
+
function transformer(file, api, options) {
|
|
34
|
+
const j = api.jscodeshift;
|
|
35
|
+
const root = j(file.source);
|
|
36
|
+
const printOptions = options.printOptions || {
|
|
37
|
+
quote: 'single',
|
|
38
|
+
trailingComma: true
|
|
39
|
+
};
|
|
40
|
+
const isGridUsed = (0, _renameIdentifiers.checkPreRequisitesSatisfied)(j, root, preRequisites);
|
|
41
|
+
if (isGridUsed) {
|
|
42
|
+
root.find(j.JSXElement).filter(path => {
|
|
43
|
+
return preRequisites.components.includes(path.value.openingElement.name.name);
|
|
44
|
+
}).find(j.JSXAttribute).forEach(attribute => {
|
|
45
|
+
// Only remove props from components in componentNames. Not nested ones.
|
|
46
|
+
if (!preRequisites.components.includes(attribute.parent.value.name.name)) {
|
|
47
|
+
return;
|
|
48
|
+
}
|
|
49
|
+
if (attribute.value.name.name === 'components') {
|
|
50
|
+
transformComponentsProp(attribute);
|
|
51
|
+
} else if (attribute.value.name.name === 'componentsProps') {
|
|
52
|
+
transformComponentsPropsProp(attribute);
|
|
53
|
+
}
|
|
54
|
+
});
|
|
55
|
+
}
|
|
56
|
+
return root.toSource(printOptions);
|
|
57
|
+
}
|
|
@@ -14,7 +14,8 @@ const renamedIdentifiers = {
|
|
|
14
14
|
linkOperatorInputProps: 'logicOperatorInputProps',
|
|
15
15
|
linkOperator: 'logicOperator',
|
|
16
16
|
linkOperators: 'logicOperators',
|
|
17
|
-
setFilterLinkOperator: 'setFilterLogicOperator'
|
|
17
|
+
setFilterLinkOperator: 'setFilterLogicOperator',
|
|
18
|
+
getRowIndex: 'getRowIndexRelativeToVisibleRows'
|
|
18
19
|
};
|
|
19
20
|
const PACKAGE_REGEXP = /@mui\/x-data-grid(-pro|-premium)?/;
|
|
20
21
|
const GridComponents = ['DataGrid', 'DataGridPro', 'DataGridPremium'];
|
|
@@ -38,6 +39,14 @@ const preRequisiteUsages = {
|
|
|
38
39
|
possiblePaths: ['componentsProps.filter'],
|
|
39
40
|
components: GridComponents,
|
|
40
41
|
packageRegex: PACKAGE_REGEXP
|
|
42
|
+
},
|
|
43
|
+
setFilterLinkOperator: {
|
|
44
|
+
components: GridComponents,
|
|
45
|
+
packageRegex: PACKAGE_REGEXP
|
|
46
|
+
},
|
|
47
|
+
getRowIndex: {
|
|
48
|
+
components: GridComponents,
|
|
49
|
+
packageRegex: PACKAGE_REGEXP
|
|
41
50
|
}
|
|
42
51
|
};
|
|
43
52
|
const renamedLiterals = {
|