@mui/x-codemod 6.0.0-beta.2 → 6.0.0-beta.4

package/README.md

@@ -416,7 +416,11 @@ The list includes these transformers
 - [`row-selection-props-rename`](#row-selection-props-rename)
 - [`rename-rowsPerPageOptions-prop`](#rename-rowsPerPageOptions-prop)
 - [`remove-disableExtendRowFullWidth-prop`](#remove-disableExtendRowFullWidth-prop)
+- [`rename-linkOperators-logicOperators`](#rename-linkOperators-logicOperators)
+- [`rename-filter-item-props`](#rename-filter-item-props)
 - [`rename-selectors-and-events`](#rename-selectors-and-events)
+- [`remove-stabilized-experimentalFeatures`](#remove-stabilized-experimentalFeatures)
+- [`replace-onCellFocusOut-prop`](#replace-onCellFocusOut-prop)
 
 #### `column-menu-components-rename`
 
@@ -497,13 +501,109 @@ Remove `disableExtendRowFullWidth` prop which is no longer supported.
 npx @mui/x-codemod v6.0.0/data-grid/remove-disableExtendRowFullWidth-prop <path>
 ```
 
+#### `rename-linkOperators-logicOperators`
+
+Rename `linkOperators` related props to `logicOperators` and rename classes.
+
+```diff
+ const [filterModel, setFilterModel] = React.useState<GridFilterModel>({
+    items: [],
+-   linkOperator: GridLinkOperator.Or,
+-   quickFilterLogicOperator: GridLinkOperator.Or,
++   logicOperator: GridLogicOperator.Or,
++   quickFilterLogicOperator: GridLogicOperator.Or,
+  });
+- apiRef.current.setFilterLinkOperator('and')
+- const localeText = apiRef.current.getLocaleText('filterPanelLinkOperator')
++ apiRef.current.setFilterLogicOperator('and')
++ const localeText = apiRef.current.getLocaleText('filterPanelLogicOperator')
+ <DataGrid
+  initialState={{
+    filter: {
+      filterModel: {
+        items: [],
+-       linkOperator: GridLinkOperator.Or,
+-       quickFilterLogicOperator: GridLinkOperator.Or,
++       logicOperator: GridLogicOperator.Or,
++       quickFilterLogicOperator: GridLogicOperator.Or,
+      },
+    },
+  }}
+  filterModel={filterModel}
+  componentsProps={{
+    filter: {
+-     linkOperators: [GridLinkOperator.And],
++     logicOperators: [GridLogicOperator.And],
+      filterFormProps: {
+-       linkOperatorInputProps: {
++       logicOperatorInputProps: {
+          variant: 'outlined',
+          size: 'small',
+        },
+      },
+    },
+  }}
+  sx={{
+-   '& .MuiDataGrid-filterFormLinkOperatorInput': { mr: 2 },
+-   '& .MuiDataGrid-withBorder': { borderColor: '#456' },
++   '& .MuiDataGrid-filterFormLogicOperatorInput': { mr: 2 },
++   '& .MuiDataGrid-withBorderColor': { borderColor: '#456' },
+  }}
+ />
+```
+
+```sh
+npx @mui/x-codemod v6.0.0/data-grid/rename-linkOperators-logicOperators <path>
+```
+
+#### `rename-filter-item-props`
+
+Rename filter item props to the new values.
+
+```diff
+ <DataGrid
+  columns={columns}
+  rows={rows}
+  initialState={{
+    filter: {
+      filterModel: {
+        items: [
+          {
+-           columnField: 'column',
+-           operatorValue: 'contains',
++           field: 'column',
++           operator: 'contains',
+            value: 'a',
+          },
+        ],
+      },
+    },
+  }}
+  filterModel={{
+    items: [
+      {
+-       columnField: 'column',
+-       operatorValue: 'contains',
++       field: 'column',
++       operator: 'contains',
+        value: 'a',
+      },
+    ],
+  }}
+ />
+```
+
+```sh
+npx @mui/x-codemod v6.0.0/data-grid/rename-filter-item-props <path>
+```
+
 #### `rename-selectors-and-events`
 
 Rename selectors and events.
 
 ```diff
  function App() {
--  useGridApiEventHandler('selectionChange', handleEvent);
+-  useGridApiEventHandler(apiRef, 'selectionChange', handleEvent);
 -  apiRef.current.subscribeEvent('selectionChange', handleEvent);
 -  const selection = useGridSelector(apiRef, gridSelectionStateSelector);
 -  const sortedRowIds = useGridSelector(apiRef, gridVisibleSortedRowIdsSelector);
@@ -511,7 +611,12 @@ Rename selectors and events.
 -  const rowCount = useGridSelector(apiRef, gridVisibleRowCountSelector);
 -  const sortedTopLevelRowEntries = useGridSelector(apiRef, gridVisibleSortedTopLevelRowEntriesSelector);
 -  const topLevelRowCount = useGridSelector(apiRef, gridVisibleTopLevelRowCountSelector);
-+  useGridApiEventHandler('rowSelectionChange', handleEvent);
+-  const allGridColumnsFields = useGridSelector(apiRef, allGridColumnsFieldsSelector);
+-  const allGridColumns = useGridSelector(apiRef, allGridColumnsSelector);
+-  const visibleGridColumns = useGridSelector(apiRef, visibleGridColumnsSelector);
+-  const filterableGridColumns = useGridSelector(apiRef, filterableGridColumnsSelector);
+-  const getGridNumericColumn = useGridSelector(apiRef, getGridNumericColumnOperators);
++  useGridApiEventHandler(apiRef, 'rowSelectionChange', handleEvent);
 +  apiRef.current.subscribeEvent('rowSelectionChange', handleEvent);
 +  const selection = useGridSelector(apiRef, gridRowSelectionStateSelector);
 +  const sortedRowIds = useGridSelector(apiRef, gridExpandedSortedRowIdsSelector);
@@ -519,6 +624,11 @@ Rename selectors and events.
 +  const rowCount = useGridSelector(apiRef, gridExpandedRowCountSelector);
 +  const sortedTopLevelRowEntries = useGridSelector(apiRef, gridFilteredSortedTopLevelRowEntriesSelector);
 +  const topLevelRowCount = useGridSelector(apiRef, gridFilteredTopLevelRowCountSelector);
++  const allGridColumnsFields = useGridSelector(apiRef, gridColumnFieldsSelector);
++  const allGridColumns = useGridSelector(apiRef, gridColumnDefinitionsSelector);
++  const visibleGridColumns = useGridSelector(apiRef, gridVisibleColumnDefinitionsSelector);
++  const filterableGridColumns = useGridSelector(apiRef, gridFilterableColumnDefinitionsSelector);
++  const getGridNumericColumn = useGridSelector(apiRef, getGridNumericOperators);
  }
 ```
 
@@ -526,4 +636,48 @@ Rename selectors and events.
 npx @mui/x-codemod v6.0.0/data-grid/rename-selectors-and-events <path>
 ```
 
+#### `remove-stabilized-experimentalFeatures`
+
+Remove feature flags for stabilized `experimentalFeatures`.
+
+```diff
+ <DataGrid
+-  experimentalFeatures={{
+-    newEditingApi: true,
+-  }}
+ />
+```
+
+```diff
+ <DataGrid
+  experimentalFeatures={{
+-   newEditingApi: true,
+    columnGrouping: true,
+  }}
+ />
+```
+
+```sh
+npx @mui/x-codemod v6.0.0/data-grid/remove-stabilized-experimentalFeatures <path>
+```
+
+#### `replace-onCellFocusOut-prop`
+
+Replace `onCellFocusOut` prop with `componentsProps.cell.onBlur`.
+
+```diff
+ <DataGrid
+-  onCellFocusOut={handleBlur}
++  componentsProps={{
++    cell: {
++      onBlur: handleBlur,
++    },
++  }}
+ />
+```
+
+```sh
+npx @mui/x-codemod v6.0.0/data-grid/replace-onCellFocusOut-prop <path>
+```
+
 You can find more details about Data Grid breaking change in [the migration guide](https://next.mui.com/x/migration/migration-data-grid-v5/).

package/codemod.js

@@ -34,6 +34,17 @@ async function runTransform(transform, files, flags, codemodFlags) {
 
   // eslint-disable-next-line no-console -- debug information
   console.log(`Executing command: jscodeshift ${args.join(' ')}`);
+  console.warn(`
+====================================
+IMPORTANT NOTICE ABOUT CODEMOD USAGE
+====================================
+Not all use cases are covered by codemods. In some scenarios, like props spreading, cross-file dependencies and etc., the changes are not properly identified and therefore must be handled manually.
+
+For example, if a codemod tries to rename a prop, but this prop is hidden with the spread operator, it won't be transformed as expected.
+<DatePicker {...pickerProps} />
+  
+After running the codemods, make sure to test your application and that you don't have any console errors.
+`);
   const jscodeshiftProcess = _child_process.default.spawnSync('node', args, {
     stdio: 'inherit'
   });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-codemod",
-  "version": "6.0.0-beta.2",
+  "version": "6.0.0-beta.4",
   "bin": "./codemod.js",
   "private": false,
   "author": "MUI Team",
@@ -32,8 +32,8 @@
   },
   "dependencies": {
     "@babel/core": "^7.20.12",
-    "@babel/runtime": "^7.20.7",
-    "@babel/traverse": "^7.20.12",
+    "@babel/runtime": "^7.20.13",
+    "@babel/traverse": "^7.20.13",
     "jscodeshift": "0.13.1",
     "jscodeshift-add-imports": "^1.0.10",
     "yargs": "^17.6.2"

package/util/removeObjectProperty.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = removeObjectProperty;
+function removeObjectProperty({
+  root,
+  propName,
+  componentsNames,
+  propKey,
+  j
+}) {
+  root.find(j.JSXElement).filter(path => {
+    return componentsNames.includes(path.value.openingElement.name.name);
+  }).forEach(element => {
+    const targetAttribute = element.value.openingElement.attributes.find(attribute => attribute.name.name === propName);
+    if (!targetAttribute) {
+      return;
+    }
+    const definedKeys = [];
+    const objectProperties = j(targetAttribute).find(j.Property);
+    objectProperties.forEach(path => {
+      const objectKey = path.value.key.name;
+      definedKeys.push(objectKey);
+    });
+    if (definedKeys.length === 1 && definedKeys[0] === propKey) {
+      // only that property is defined, remove the whole prop
+      j(element).find(j.JSXAttribute).filter(a => a.value.name.name === propName).forEach(path => {
+        j(path).remove();
+      });
+    } else {
+      objectProperties.forEach(path => {
+        if (path.value.key.name === propKey) {
+          j(path).remove();
+        }
+      });
+    }
+  });
+}

package/util/renameCSSClasses.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = renameCSSClasses;
+function renameCSSClasses({
+  root,
+  j,
+  renamedClasses
+}) {
+  root.find(j.Literal).filter(path => !!Object.keys(renamedClasses).find(className => {
+    const literal = path.node.value;
+    return typeof literal === 'string' && literal.includes(className) && !literal.includes(renamedClasses[className]);
+  })).replaceWith(path => {
+    const literal = path.node.value;
+    const targetClassKey = Object.keys(renamedClasses).find(className => literal.includes(className));
+    return j.literal(literal.replace(targetClassKey, renamedClasses[targetClassKey]));
+  });
+}

package/util/renameIdentifiers.js

@@ -0,0 +1,91 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.checkPreRequisitesSatisfied = void 0;
+exports.default = renameIdentifiers;
+exports.matchImport = void 0;
+/* eslint-disable no-underscore-dangle */
+
+const matchImport = (path, regex) => (path.node.source.value.toString() || '').match(regex);
+exports.matchImport = matchImport;
+const findDeepASTPath = (j, currentPath, currentIdentifiers) => {
+  if (!currentIdentifiers.length) {
+    return true;
+  }
+  const target = j(currentPath).find(j.Identifier).filter(path => path.value.name === currentIdentifiers[0]);
+  if (target.__paths.length === 0) {
+    return false;
+  }
+  return findDeepASTPath(j, currentPath, currentIdentifiers.slice(1));
+};
+
+/**
+ * Checks if all pre-requisites are satisfied for the given path `root`.
+ * For it to be satisfied, at least one condition of all the pre-requisites must be fulfilled.
+ *
+ * @param {*} j
+ * @param {*} root
+ * @param {PreRequisiteUsage} preReqs
+ * @returns {boolean}
+ */
+const checkPreRequisitesSatisfied = (j, root, preReqs) => {
+  if (preReqs.packageRegex || preReqs.components) {
+    // check if any of the components is imported from a package which satisfies `preReqs.packageRegex`
+    const imports = root.find(j.ImportDeclaration);
+    const matchingImports = preReqs.packageRegex ? imports.filter(path => !!matchImport(path, preReqs.packageRegex)) : imports;
+    if (!matchingImports.__paths.length) {
+      return false;
+    }
+    // check if any of the `preReqs.components` is imported from the matching imports
+    const satisfyingImports = preReqs.components?.length ? matchingImports.find(j.Identifier).filter(path => preReqs.components.includes(path.node.name)) : matchingImports;
+    if (!satisfyingImports.__paths.length) {
+      return false;
+    }
+  }
+  if (!preReqs.possiblePaths?.length) {
+    return true;
+  }
+  const allComponents = root.find(j.JSXElement);
+  const matchingComponents = preReqs.components?.length ? allComponents.filter(path => preReqs.components.includes(path.node.openingElement.name.name)) : allComponents;
+  const matchingAttributes = matchingComponents.find(j.JSXAttribute)
+  // filter by props first
+  .filter(attribute => preReqs.possiblePaths.map(path => path.split('.')[0]).includes(attribute.node.name.name))
+  // filter by nested levels
+  .filter(attribute => findDeepASTPath(j, attribute, preReqs.possiblePaths.find(path => path.startsWith(attribute.node.name.name)).split('.').slice(1)));
+  return matchingAttributes.__paths.length > 0;
+};
+
+/**
+ * Renames identifiers based on the `identifiers` object passed plus an optional `preRequisiteUsages` object
+ * to control renaming based on certain conditions.
+ *
+ * @export renameIdentifiers
+ * @param {RenameIdentifiersArgs} {
+ *   root, // jscodeshift root
+ *   identifiers, // object of identifiers to rename
+ *   preRequisiteUsages, // an optional list of pre-requisite to control renaming based on certain conditions
+ *                       // if any of the pre-requisites is satisfied then the identifier will be renamed
+ *                       // for more details, see the type definition of `PreRequisiteUsage`
+ *   j, // jscodeshift
+ * }
+ */
+exports.checkPreRequisitesSatisfied = checkPreRequisitesSatisfied;
+function renameIdentifiers({
+  root,
+  identifiers,
+  preRequisiteUsages,
+  j
+}) {
+  root.find(j.Identifier).filter(path => !!identifiers[path.node.name]).replaceWith(path => {
+    if (!preRequisiteUsages || !preRequisiteUsages[path.node.name]) {
+      return j.importSpecifier(j.identifier(identifiers[path.node.name]));
+    }
+    const shouldReplace = checkPreRequisitesSatisfied(j, root, preRequisiteUsages[path.node.name]);
+    if (shouldReplace) {
+      return j.importSpecifier(j.identifier(identifiers[path.node.name]));
+    }
+    return j.importSpecifier(j.identifier(path.node.name));
+  });
+}

package/v6.0.0/data-grid/preset-safe/index.js

@@ -9,12 +9,20 @@ var _columnMenuComponentsRename = _interopRequireDefault(require("../column-menu
 var _rowSelectionPropsRename = _interopRequireDefault(require("../row-selection-props-rename"));
 var _renameRowsPerPageOptionsProp = _interopRequireDefault(require("../rename-rowsPerPageOptions-prop"));
 var _removeDisableExtendRowFullWidthProp = _interopRequireDefault(require("../remove-disableExtendRowFullWidth-prop"));
+var _renameLinkOperatorsLogicOperators = _interopRequireDefault(require("../rename-linkOperators-logicOperators"));
+var _renameFilterItemProps = _interopRequireDefault(require("../rename-filter-item-props"));
 var _renameSelectorsAndEvents = _interopRequireDefault(require("../rename-selectors-and-events"));
+var _removeStabilizedExperimentalFeatures = _interopRequireDefault(require("../remove-stabilized-experimentalFeatures"));
+var _replaceOnCellFocusOutProp = _interopRequireDefault(require("../replace-onCellFocusOut-prop"));
 function transformer(file, api, options) {
   file.source = (0, _columnMenuComponentsRename.default)(file, api, options);
   file.source = (0, _rowSelectionPropsRename.default)(file, api, options);
   file.source = (0, _renameRowsPerPageOptionsProp.default)(file, api, options);
   file.source = (0, _removeDisableExtendRowFullWidthProp.default)(file, api, options);
+  file.source = (0, _renameLinkOperatorsLogicOperators.default)(file, api, options);
+  file.source = (0, _renameFilterItemProps.default)(file, api, options);
   file.source = (0, _renameSelectorsAndEvents.default)(file, api, options);
+  file.source = (0, _removeStabilizedExperimentalFeatures.default)(file, api, options);
+  file.source = (0, _replaceOnCellFocusOutProp.default)(file, api, options);
   return file.source;
 }

package/v6.0.0/data-grid/remove-stabilized-experimentalFeatures/index.js

@@ -0,0 +1,27 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = transformer;
+var _removeObjectProperty = _interopRequireDefault(require("../../../util/removeObjectProperty"));
+const componentsNames = ['DataGrid', 'DataGridPro', 'DataGridPremium'];
+const propName = 'experimentalFeatures';
+const propKey = 'newEditingApi';
+function transformer(file, api, options) {
+  const j = api.jscodeshift;
+  const root = j(file.source);
+  const printOptions = options.printOptions || {
+    quote: 'single',
+    trailingComma: true
+  };
+  (0, _removeObjectProperty.default)({
+    root,
+    j,
+    propName,
+    componentsNames,
+    propKey
+  });
+  return root.toSource(printOptions);
+}

package/v6.0.0/data-grid/rename-filter-item-props/index.js

@@ -0,0 +1,53 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = transformer;
+var _renameIdentifiers = _interopRequireDefault(require("../../../util/renameIdentifiers"));
+const renamedIdentifiers = {
+  columnField: 'field',
+  operatorValue: 'operator'
+};
+const PACKAGE_REGEXP = /@mui\/x-data-grid(-pro|-premium)?/;
+const GridComponents = ['DataGrid', 'DataGridPro', 'DataGridPremium'];
+const preRequisiteUsages = {
+  columnField: {
+    possiblePaths: ['initialState', 'filterModel', 'onFilterModelChange'],
+    components: GridComponents,
+    packageRegex: PACKAGE_REGEXP
+  },
+  operatorValue: {
+    possiblePaths: ['initialState', 'filterModel', 'onFilterModelChange'],
+    components: GridComponents,
+    packageRegex: PACKAGE_REGEXP
+  }
+};
+function transformer(file, api, options) {
+  const j = api.jscodeshift;
+  const root = j(file.source);
+  const printOptions = options.printOptions || {
+    quote: 'single',
+    trailingComma: true
+  };
+
+  // <DataGrid(Pro|Premium)
+  //   filterModel={{
+  //     items: [{
+  // -     columnField: 'name',
+  // +     field: 'name',
+  // -     operatorValue: 'contains',
+  // +     operator: 'contains',
+  //       value: 'a'
+  //     }]
+  //   }}
+  // />
+  (0, _renameIdentifiers.default)({
+    root,
+    j,
+    preRequisiteUsages,
+    identifiers: renamedIdentifiers
+  });
+  return root.toSource(printOptions);
+}

package/v6.0.0/data-grid/rename-linkOperators-logicOperators/index.js

@@ -0,0 +1,97 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = transform;
+var _renameCSSClasses = _interopRequireDefault(require("../../../util/renameCSSClasses"));
+var _renameIdentifiers = _interopRequireWildcard(require("../../../util/renameIdentifiers"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+const renamedIdentifiers = {
+  GridLinkOperator: 'GridLogicOperator',
+  linkOperatorInputProps: 'logicOperatorInputProps',
+  linkOperator: 'logicOperator',
+  linkOperators: 'logicOperators',
+  setFilterLinkOperator: 'setFilterLogicOperator'
+};
+const PACKAGE_REGEXP = /@mui\/x-data-grid(-pro|-premium)?/;
+const GridComponents = ['DataGrid', 'DataGridPro', 'DataGridPremium'];
+const preRequisiteUsages = {
+  GridLinkOperator: {
+    possiblePaths: ['initialState.filter', 'filterModel', 'componentsProps.filter'],
+    components: GridComponents,
+    packageRegex: PACKAGE_REGEXP
+  },
+  linkOperatorInputProps: {
+    possiblePaths: ['componentsProps.filter'],
+    components: GridComponents,
+    packageRegex: PACKAGE_REGEXP
+  },
+  linkOperator: {
+    possiblePaths: ['initialState.filter', 'filterModel', 'componentsProps.filter'],
+    components: GridComponents,
+    packageRegex: PACKAGE_REGEXP
+  },
+  linkOperators: {
+    possiblePaths: ['componentsProps.filter'],
+    components: GridComponents,
+    packageRegex: PACKAGE_REGEXP
+  }
+};
+const renamedLiterals = {
+  filterPanelLinkOperator: 'filterPanelLogicOperator'
+};
+const renamedClasses = {
+  'MuiDataGrid-filterFormLinkOperatorInput': 'MuiDataGrid-filterFormLogicOperatorInput',
+  'MuiDataGrid-withBorder': 'MuiDataGrid-withBorderColor'
+};
+function transform(file, api, options) {
+  const j = api.jscodeshift;
+  const root = j(file.source);
+  const printOptions = options.printOptions || {
+    quote: 'single',
+    trailingComma: true
+  };
+  const matchingImports = root.find(j.ImportDeclaration).filter(path => !!(0, _renameIdentifiers.matchImport)(path, PACKAGE_REGEXP));
+  if (matchingImports.length > 0) {
+    // Rename the identifiers
+    // <DataGrid
+    //  componentsProps={{
+    //    filter: {
+    // -   linkOperators: [GridLinkOperator.And],
+    // +   logicOperators: [GridLogicOperator.And],
+    //      filterFormProps: {
+    // -      linkOperatorInputProps: {
+    // +      logicOperatorInputProps: {
+    //          variant: 'outlined',
+    //          size: 'small',
+    //        },
+    //      },
+    //    },
+    //  }}
+    // />
+    (0, _renameIdentifiers.default)({
+      j,
+      root,
+      identifiers: renamedIdentifiers,
+      preRequisiteUsages
+    });
+
+    // Rename the literals
+    // - apiRef.current.getLocaleText('filterPanelLinkOperator')
+    // + apiRef.current.getLocaleText('filterPanelLogicOperator')
+    root.find(j.Literal).filter(path => !!renamedLiterals[path.node.value]).replaceWith(path => j.literal(renamedLiterals[path.node.value]));
+
+    // Rename the classes
+    // - 'MuiDataGrid-filterFormLinkOperatorInput'
+    // + 'MuiDataGrid-filterFormLogicOperatorInput'
+    (0, _renameCSSClasses.default)({
+      j,
+      root,
+      renamedClasses
+    });
+  }
+  return root.toSource(printOptions);
+}

package/v6.0.0/data-grid/rename-selectors-and-events/index.js

@@ -4,18 +4,28 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = transformer;
+var _renameIdentifiers = require("../../../util/renameIdentifiers");
 const renamedSelectors = {
   gridSelectionStateSelector: 'gridRowSelectionStateSelector',
   gridVisibleSortedRowIdsSelector: 'gridExpandedSortedRowIdsSelector',
   gridVisibleSortedRowEntriesSelector: 'gridExpandedSortedRowEntriesSelector',
   gridVisibleRowCountSelector: 'gridExpandedRowCountSelector',
   gridVisibleSortedTopLevelRowEntriesSelector: 'gridFilteredSortedTopLevelRowEntriesSelector',
-  gridVisibleTopLevelRowCountSelector: 'gridFilteredTopLevelRowCountSelector'
+  gridVisibleTopLevelRowCountSelector: 'gridFilteredTopLevelRowCountSelector',
+  allGridColumnsFieldsSelector: 'gridColumnFieldsSelector',
+  allGridColumnsSelector: 'gridColumnDefinitionsSelector',
+  visibleGridColumnsSelector: 'gridVisibleColumnDefinitionsSelector',
+  filterableGridColumnsSelector: 'gridFilterableColumnDefinitionsSelector',
+  getGridNumericColumnOperators: 'getGridNumericOperators'
 };
 const renamedEvents = {
   selectionChange: 'rowSelectionChange',
   rowsScroll: 'scrollPositionChange'
 };
+const preRequisites = {
+  components: ['DataGrid', 'DataGridPro', 'DataGridPremium'],
+  packageRegex: /@mui\/x-data-grid(-pro|-premium)?/
+};
 function transformer(file, api, options) {
   const j = api.jscodeshift;
   const root = j(file.source);
@@ -23,17 +33,19 @@ function transformer(file, api, options) {
     quote: 'single',
     trailingComma: true
   };
+  const isGridUsed = (0, _renameIdentifiers.checkPreRequisitesSatisfied)(j, root, preRequisites);
+  if (isGridUsed) {
+    // Rename the import and usage of renamed selectors
+    // - import { gridSelectionStateSelector } from '@mui/x-data-grid'
+    // + import { gridRowSelectionStateSelector } from '@mui/x-data-grid'
+    root.find(j.Identifier).filter(path => !!renamedSelectors[path.node.name]).replaceWith(path => j.identifier(renamedSelectors[path.node.name]));
 
-  // Rename the import and usage of renamed selectors
-  // - import { gridSelectionStateSelector } from '@mui/x-data-grid'
-  // + import { gridRowSelectionStateSelector } from '@mui/x-data-grid'
-  root.find(j.Identifier).filter(path => !!renamedSelectors[path.node.name]).replaceWith(path => j.identifier(renamedSelectors[path.node.name]));
-
-  // Rename the usage of renamed event literals
-  // - useGridApiEventHandler('selectionChange', handleEvent);
-  // - apiRef.current.subscribeEvent('selectionChange', handleEvent);
-  // + useGridApiEventHandler('rowSelectionChange', handleEvent);
-  // + apiRef.current.subscribeEvent('rowSelectionChange', handleEvent);
-  root.find(j.CallExpression).find(j.Literal).filter(path => !!renamedEvents[path.node.value]).replaceWith(path => j.literal(renamedEvents[path.node.value]));
+    // Rename the usage of renamed event literals
+    // - useGridApiEventHandler(apiRef, 'selectionChange', handleEvent);
+    // - apiRef.current.subscribeEvent('selectionChange', handleEvent);
+    // + useGridApiEventHandler(apiRef, 'rowSelectionChange', handleEvent);
+    // + apiRef.current.subscribeEvent('rowSelectionChange', handleEvent);
+    root.find(j.CallExpression).find(j.Literal).filter(path => !!renamedEvents[path.node.value]).replaceWith(path => j.literal(renamedEvents[path.node.value]));
+  }
   return root.toSource(printOptions);
 }

package/v6.0.0/data-grid/replace-onCellFocusOut-prop/index.js

@@ -0,0 +1,40 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = transformer;
+var _removeProps = _interopRequireDefault(require("../../../util/removeProps"));
+var _addComponentsSlots = require("../../../util/addComponentsSlots");
+const componentNames = ['DataGrid', 'DataGridPro', 'DataGridPremium'];
+const propsToRename = {
+  onCellFocusOut: {
+    prop: 'componentsProps',
+    path: 'cell.onBlur'
+  }
+};
+function transformer(file, api, options) {
+  const j = api.jscodeshift;
+  const root = j(file.source);
+  const printOptions = options.printOptions || {
+    quote: 'single',
+    trailingComma: true
+  };
+  root.find(j.JSXElement).filter(path => {
+    return componentNames.includes(path.value.openingElement.name.name);
+  }).forEach(path => {
+    const attributesToTransform = j(path).find(j.JSXAttribute).filter(attribute => Object.keys(propsToRename).includes(attribute.value.name.name));
+    attributesToTransform.forEach(attribute => {
+      const attributeName = attribute.value.name.name;
+      const value = attribute.value.value?.type === 'JSXExpressionContainer' ? attribute.value.value.expression : attribute.value.value;
+      (0, _addComponentsSlots.transformNestedProp)(path, propsToRename[attributeName].prop, propsToRename[attributeName].path, value, j);
+    });
+  });
+  return (0, _removeProps.default)({
+    root,
+    j,
+    props: Object.keys(propsToRename),
+    componentNames
+  }).toSource(printOptions);
+}

package/util/renameClassKey.js

@@ -1,29 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = renameClassKey;
-function renameClassKey({
-  root,
-  componentName,
-  classes,
-  printOptions
-}) {
-  const source = root.findJSXElements(componentName).forEach(path => {
-    path.node.openingElement.attributes?.forEach(node => {
-      if (node.type === 'JSXAttribute' && node.name.name === 'classes') {
-        // @ts-expect-error
-        node.value?.expression?.properties?.forEach(subNode => {
-          if (Object.keys(classes).includes(subNode.key.name)) {
-            subNode.key.name = classes[subNode.key.name];
-          }
-        });
-      }
-    });
-  }).toSource(printOptions);
-  return Object.entries(classes).reduce((result, [currentKey, newKey]) => {
-    const regex = new RegExp(`.Mui${componentName}-${currentKey}`, 'gm');
-    return result.replace(regex, `.Mui${componentName}-${newKey}`);
-  }, source);
-}