@mui/x-codemod 6.0.0-alpha.11 → 6.0.0-alpha.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-codemod",
-  "version": "6.0.0-alpha.11",
+  "version": "6.0.0-alpha.13",
   "bin": "./codemod.js",
   "private": false,
   "author": "MUI Team",
@@ -31,9 +31,9 @@
     "url": "https://opencollective.com/mui"
   },
   "dependencies": {
-    "@babel/core": "^7.20.2",
-    "@babel/runtime": "^7.20.1",
-    "@babel/traverse": "^7.20.1",
+    "@babel/core": "^7.20.5",
+    "@babel/runtime": "^7.20.6",
+    "@babel/traverse": "^7.20.5",
     "jscodeshift": "0.13.1",
     "jscodeshift-add-imports": "^1.0.10",
     "yargs": "^17.6.2"

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

@@ -7,10 +7,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = transformer;
 var _localizationProviderRenameLocale = _interopRequireDefault(require("../localization-provider-rename-locale"));
 var _textPropsToLocaleText = _interopRequireDefault(require("../text-props-to-localeText"));
+var _viewComponentsRename = _interopRequireDefault(require("../view-components-rename"));
 function transformer(file, api, options) {
   file.source = (0, _localizationProviderRenameLocale.default)(file, api, options);
 
   // Should be run before the renaming of components such as `ClockPicker` to `TimeClock`.
   file.source = (0, _textPropsToLocaleText.default)(file, api, options);
+  file.source = (0, _viewComponentsRename.default)(file, api, options);
   return file.source;
 }

package/v6.0.0/view-components-rename/index.js

@@ -0,0 +1,83 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = transformer;
+const SUB_PACKAGES = {
+  CalendarPicker: 'DateCalendar',
+  CalendarPickerSkeleton: 'DayCalendarSkeleton',
+  MonthPicker: 'MonthCalendar',
+  YearPicker: 'YearCalendar',
+  ClockPicker: 'TimeClock'
+};
+const VARIABLES = {
+  // Date Calendar
+  CalendarPicker: 'DateCalendar',
+  CalendarPickerProps: 'DateCalendarProps',
+  CalendarPickerSlotsComponent: 'DateCalendarSlotsComponent',
+  CalendarPickerSlotsComponentsProps: 'DateCalendarSlotsComponentsProps',
+  CalendarPickerClasses: 'DateCalendarClasses',
+  CalendarPickerClassKey: 'DateCalendarClassKey',
+  calendarPickerClasses: 'dateCalendarClasses',
+  getCalendarPickerUtilityClass: 'getDateCalendarUtilityClass',
+  // Month Calendar
+  MonthPicker: 'MonthCalendar',
+  MonthPickerProps: 'MonthCalendarProps',
+  MonthPickerClasses: 'MonthCalendarClasses',
+  MonthPickerClassKey: 'MonthCalendarClassKey',
+  monthPickerClasses: 'monthCalendarClasses',
+  getMonthPickerUtilityClass: 'getMonthCalendarUtilityClass',
+  YearPicker: 'YearCalendar',
+  YearPickerProps: 'YearCalendarProps',
+  YearPickerClasses: 'YearCalendarClasses',
+  YearPickerClassKey: 'YearCalendarClassKey',
+  yearPickerClasses: 'yearCalendarClasses',
+  getYearPickerUtilityClass: 'getYearCalendarUtilityClass',
+  ClockPicker: 'TimeClock',
+  ClockPickerProps: 'TimeClockProps',
+  ClockPickerClasses: 'TimeClockClasses',
+  ClockPickerClassKey: 'TimeClockClassKey',
+  clockPickerClasses: 'timeClockClasses',
+  getClockPickerUtilityClass: 'getTimeClockUtilityClass',
+  CalendarPickerSkeleton: 'DayCalendarSkeleton',
+  CalendarPickerSkeletonProps: 'DayCalendarSkeletonProps',
+  CalendarPickerSkeletonClasses: 'DayCalendarSkeletonClasses',
+  CalendarPickerSkeletonClassKey: 'DayCalendarSkeletonClassKey',
+  calendarPickerSkeletonClasses: 'dayCalendarSkeletonClasses',
+  getCalendarPickerSkeletonUtilityClass: 'getDayCalendarSkeletonUtilityClass'
+};
+const PACKAGE_REGEXP = /@mui\/x-date-pickers(-pro|)(\/(.*)|)/;
+const matchImport = path => (path.node.source.value?.toString() ?? '').match(PACKAGE_REGEXP);
+function transformer(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 => !!matchImport(path));
+
+  // Rename the import specifiers
+  // - import { MonthPicker } from '@mui/x-date-pickers/MonthPicker'
+  // + import { MonthCalendar } from '@mui/x-date-pickers/MonthPicker'
+  matchingImports.find(j.ImportSpecifier).filter(path => !!VARIABLES[path.node.imported.name]).replaceWith(path => j.importSpecifier(j.identifier(VARIABLES[path.node.imported.name])));
+
+  // Rename the nested import declarations
+  // - import {} from '@mui/x-date-pickers/MonthPicker'
+  // + import {} from '@mui/x-date-pickers/MonthCalendar'
+  matchingImports.filter(path => !!SUB_PACKAGES[matchImport(path)?.[3] ?? '']).replaceWith(path => {
+    const subPackage = matchImport(path)[3];
+    const importPath = path.node.source.value?.toString() ?? '';
+    return j.importDeclaration(path.node.specifiers,
+    // copy over the existing import specifiers
+    j.stringLiteral(importPath.replace(subPackage, SUB_PACKAGES[subPackage])) // Replace the source with our new source
+    );
+  });
+
+  // Rename the import usage
+  // - <CalendarPicker />
+  // + <DateCalendar />
+  root.find(j.Identifier).filter(path => !!VARIABLES[path.node.name]).replaceWith(path => j.identifier(VARIABLES[path.node.name]));
+  return root.toSource(printOptions);
+}