@mui/x-codemod 9.0.0-alpha.0 → 9.0.0-alpha.1

package/CHANGELOG.md

@@ -1,5 +1,123 @@
 # Changelog
 
+## 9.0.0-alpha.1
+
+_Feb 26, 2026_
+
+We'd like to extend a big thank you to the 18 contributors who made this release possible. Here are some highlights ✨:
+
+- ⚡️ Improved dynamic data support and cache invalidation in lazy loading for Data Grid Pro
+- ⌨️ Keyboard support for selecting day, month, and year in Date Pickers
+- 📊 Axis tooltip sorting and control improvements in Charts
+- 🐞 Bugfixes and internal improvements
+
+Special thanks go out to these community members for their valuable contributions:
+@EllGree, @lion1963
+
+The following team members contributed to this release:
+@alexfauquette, @arminmeh, @brijeshb42, @cherniavskii, @dav-is, @flaviendelangle, @Janpot, @JCQuintas, @mapache-salvaje, @MBilalShafi, @michelengelen, @noraleonte, @rita-codes, @sai6855, @siriwatknp, @ZeeshanTamboli
+
+### Data Grid
+
+#### `@mui/x-data-grid@9.0.0-alpha.1`
+
+- [DataGrid] Forward rest props in `GridFilterInputMultipleValue` (#21407) @siriwatknp
+- [DataGrid] Preserve key input during row edit when using `rowModesModel` (#20759) @michelengelen
+- [DataGrid] Remove double rtl inversion logic for columns pinning (#21371) @siriwatknp
+
+#### `@mui/x-data-grid-pro@9.0.0-alpha.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@9.0.0-alpha.1`, plus:
+
+- [DataGridPro] Fix number input visibility in header filters (#21328) @michelengelen
+- [DataGridPro] Improve dynamic data support and cache invalidation in lazy loading (#21282) @MBilalShafi
+
+#### `@mui/x-data-grid-premium@9.0.0-alpha.1` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@9.0.0-alpha.1`.
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@9.0.0-alpha.1`
+
+- [DatePicker] Add keyboard support for selecting day, month, and year (#20859) @michelengelen
+
+#### `@mui/x-date-pickers-pro@9.0.0-alpha.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@9.0.0-alpha.1`, plus:
+
+- [DateRangePicker] Fix timezone update issue leading to `invalidRange` error (#20863) @michelengelen
+
+### Charts
+
+#### `@mui/x-charts@9.0.0-alpha.1`
+
+- [charts] Add `sort` props to the axis tooltip (#21293) @alexfauquette
+- [charts] Controll axis tooltip (#21351) @alexfauquette
+- [charts] De duplicate keyboard focus handler function (#21267) @sai6855
+- [charts] Make `type` optional in identifiers (#21311) @alexfauquette
+- [charts] Move ref to the root component (#21396) @alexfauquette
+- [charts] Refactor loading and no data overlays to use a shared OverlayText component (#21414) @sai6855
+- [charts] Require series ids to be unique (#21330) @alexfauquette
+- [charts] Set `showMark` as `false` by default (#21373) @alexfauquette
+- [charts] Use `createGetNextIndexFocusedItem()` util in Funnel and RangeBar charts (#21390) @sai6855
+- [charts] Remove unnecessary string concatenation (#21418) @sai6855
+
+#### `@mui/x-charts-pro@9.0.0-alpha.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-charts@9.0.0-alpha.1`.
+
+#### `@mui/x-charts-premium@9.0.0-alpha.1` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-charts-pro@9.0.0-alpha.1`.
+
+### Tree View
+
+#### `@mui/x-tree-view@9.0.0-alpha.1`
+
+- [tree view] Focus item sibling on unmount instead of the 1st item (#21254) @flaviendelangle
+
+#### `@mui/x-tree-view-pro@9.0.0-alpha.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-tree-view@9.0.0-alpha.1`.
+
+### Codemod
+
+#### `@mui/x-codemod@9.0.0-alpha.1`
+
+Internal changes.
+
+### Docs
+
+- [docs] Fix external 301s (#21377) @Janpot
+- [docs] Show premium in the overview (#21343) @alexfauquette
+- [docs][charts] Revise the useLegend hook doc (#21352) @mapache-salvaje
+- [docs][charts] Revise the axis hooks doc (#21317) @mapache-salvaje
+- [docs][charts] Revise the scale hooks doc (#21316) @mapache-salvaje
+- [docs][charts] Revise the series hooks doc (#21353) @mapache-salvaje
+- [docs][charts] Revise the useDataset doc (#21336) @mapache-salvaje
+- [docs][charts] Revise the useDrawingArea doc (#21333) @mapache-salvaje
+
+### Core
+
+- [core] Update docs deploy script to the `docs-next` branch (#21341) @siriwatknp
+- [code-infra] Cleanup unused babel plugins (#21453) @brijeshb42
+- [code-infra] Do not append `x` to the last version for the compare API (#21408) @arminmeh
+- [code-infra] Upgrade react-docgen to v8 X (#21155) @JCQuintas
+- [code-infra] Modernize codemod (#21096) @JCQuintas
+- [docs-infra] Fix current version detection logic (#21417) @cherniavskii
+- [docs-infra] Reapply Cookie Banner (#21281) @dav-is
+- [internal] Headless filtering plugin (#21302) @arminmeh
+- [internal] Headless pagination plugin (#21183) @arminmeh
+- [internal] Headless virtualization followups (#21327) @cherniavskii
+- [internal] Keep cached data for disabled pipe processors (#21348) @arminmeh
+- [internal] Remove autoprefixer package (#21440) @ZeeshanTamboli
+
+### Miscellaneous
+
+- [l10n] Fix Czech (csCZ) locale: sort/filter labels are swapped (#21400) @EllGree
+- [l10n] Improve Ukrainian (uk-UA) locale (#21366) @lion1963
+
 ## 9.0.0-alpha.0
 
 _Feb 16, 2026_

package/README.md

@@ -97,6 +97,7 @@ The list includes these transformers
 - [`replace-heatmap-hide-legend-false`](#replace-heatmap-hide-legend-false)
 - [`rename-chart-api-import`](#rename-chart-api-import)
 - [`rename-id-to-series-id`](#rename-id-to-series-id)
+- [`replace-show-mark-default`](#replace-show-mark-default)
 
 ### `replace-heatmap-hide-legend-false`
 
@@ -165,6 +166,17 @@ Here is the list of slots and components that are impacted by the renaming:
 | mark          | MarkElement                              |
 | lineHighlight | LineHighlightElement                     |
 
+#### `replace-show-mark-default`
+
+Add `showMark: true` to line series when not defined to keep the same default behavior.
+
+```diff
+- <LineChart series={[{ data: [/* ... */] }]} />
++ <LineChart series={[{ data: [/* ... */] showMark: true }]} />
+- <ChartDataProvider series={[{ type: 'line', data: [/* ... */] }]} />
++ <ChartDataProvider series={[{ type: 'line', data: [/* ... */] showMark: true }]} />
+```
+
 ## v8.0.0
 
 ### 🚀 `preset-safe` for v8.0.0

package/codemod.js

@@ -2,13 +2,11 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _child_process = _interopRequireDefault(require("child_process"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _fs = require("fs");
 var _path = _interopRequireDefault(require("path"));
 var _yargs = _interopRequireDefault(require("yargs"));
-const jscodeshiftPackage = require('jscodeshift/package.json');
-const jscodeshiftDirectory = _path.default.dirname(require.resolve('jscodeshift'));
-const jscodeshiftExecutable = _path.default.join(jscodeshiftDirectory, jscodeshiftPackage.bin.jscodeshift);
+var _Runner = require("jscodeshift/src/Runner");
 async function runTransform(transform, files, flags, codemodFlags) {
   const transformerSrcPath = _path.default.resolve(__dirname, './src', transform);
   const transformerBuildPath = _path.default.resolve(__dirname, transform);
@@ -27,13 +25,25 @@ async function runTransform(transform, files, flags, codemodFlags) {
       throw buildPathError;
     }
   }
-  const args = [
-  // can't directly spawn `jscodeshiftExecutable` due to https://github.com/facebook/jscodeshift/issues/424
-  jscodeshiftExecutable, '--transform', transformerPath, ...codemodFlags, '--extensions', 'js,ts,jsx,tsx', '--parser', flags.parser || 'tsx', '--ignore-pattern', '**/node_modules/**', ...flags.jscodeshift];
-  args.push(...files);
+
+  // Parse additional jscodeshift options from flags
+  const additionalOptions = {};
+  [...codemodFlags, ...flags.jscodeshift].forEach(flag => {
+    const match = flag.match(/^--([^=]+)(?:=(.*))?$/);
+    if (match) {
+      const [, key, value] = match;
+      additionalOptions[key] = value ?? true;
+    }
+  });
+  const options = (0, _extends2.default)({
+    extensions: 'js,ts,jsx,tsx',
+    parser: flags.parser || 'tsx',
+    ignorePattern: ['**/node_modules/**', ...(additionalOptions.ignorePattern || [])],
+    verbose: 2
+  }, additionalOptions);
 
   // eslint-disable-next-line no-console -- debug information
-  console.log(`Executing command: jscodeshift ${args.join(' ')}`);
+  console.log(`Running jscodeshift with transform: ${transformerPath}`);
   console.warn(`
 ====================================
 IMPORTANT NOTICE ABOUT CODEMOD USAGE
@@ -42,14 +52,12 @@ Not all use cases are covered by codemods. In some scenarios, like props spreadi
 
 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 formatting or console errors.
 `);
-  const jscodeshiftProcess = _child_process.default.spawnSync('node', args, {
-    stdio: 'inherit'
-  });
-  if (jscodeshiftProcess.error) {
-    throw jscodeshiftProcess.error;
+  const result = await (0, _Runner.run)(transformerPath, files, options);
+  if (result.error > 0) {
+    process.exit(1);
   }
 }
 function run(argv) {

package/package.json

@@ -1,9 +1,8 @@
 {
   "name": "@mui/x-codemod",
-  "version": "9.0.0-alpha.0",
+  "version": "9.0.0-alpha.1",
   "author": "MUI Team",
   "description": "Codemod scripts for MUI X.",
-  "bin": "./codemod.js",
   "keywords": [
     "react",
     "react-component",
@@ -41,5 +40,6 @@
   "type": "commonjs",
   "exports": {
     "./package.json": "./package.json"
-  }
+  },
+  "bin": "./codemod.js"
 }

package/util/renameImports.js

@@ -23,7 +23,7 @@ const getMatchingNestedImport = (path, parameters) => {
 };
 const getMatchingRootImport = (path, parameters) => {
   return parameters.imports.find(importConfig => {
-    return importConfig.importsMapping.hasOwnProperty(path.node.imported.name);
+    return importConfig.importsMapping.hasOwnProperty(path.node.imported.name.toString());
   });
 };
 

package/v6.0.0/data-grid/column-menu-components-rename/index.js

@@ -29,7 +29,7 @@ function transformer(file, api, options) {
   // Rename the import specifiers
   // - import { GridFilterMenuItem } from '@mui/x-data-grid'
   // + import { GridColumnMenuFilterItem } from '@mui/x-data-grid'
-  matchingImports.find(j.ImportSpecifier).filter(path => VARIABLES.hasOwnProperty(path.node.imported.name)).replaceWith(path => j.importSpecifier(j.identifier(VARIABLES[path.node.imported.name])));
+  matchingImports.find(j.ImportSpecifier).filter(path => VARIABLES.hasOwnProperty(path.node.imported.name.toString())).replaceWith(path => j.importSpecifier(j.identifier(VARIABLES[path.node.imported.name.toString()])));
 
   // Rename the import usage
   // - <GridFilterMenuItem />

package/v7.0.0/pickers/rename-slots-types/index.js

@@ -124,7 +124,7 @@ function transformer(file, api, options) {
   // Rename the import specifiers
   // - import { DayCalendarSlotsComponent } from '@mui/x-date-pickers'
   // + import { DayCalendarSlots } from '@mui/x-date-pickers'
-  matchingImports.find(j.ImportSpecifier).filter(path => Object.keys(rename).includes(path.node.imported.name)).replaceWith(path => j.importSpecifier(j.identifier(rename[path.node.imported.name]), path.value.local));
+  matchingImports.find(j.ImportSpecifier).filter(path => Object.keys(rename).includes(path.node.imported.name.toString())).replaceWith(path => j.importSpecifier(j.identifier(rename[path.node.imported.name.toString()]), path.value.local));
 
   // Rename the import usage
   // - DayCalendarSlotsComponent

package/v8.0.0/charts/rename-label-and-tick-font-size/index.js

@@ -19,7 +19,7 @@ function transformer(file, api, options) {
     return typeof node.source.value === 'string' && node.source.value.startsWith('@mui/x-charts');
   }).forEach(path => {
     path.node.specifiers?.forEach(node => {
-      root.findJSXElements(node.local?.name).forEach(elementPath => {
+      root.findJSXElements(node.local?.name.toString()).forEach(elementPath => {
         if (elementPath.node.type !== 'JSXElement') {
           return;
         }

package/v8.0.0/charts/rename-legend-to-slots-legend/index.js

@@ -19,7 +19,7 @@ function transformer(file, api, options) {
     return typeof node.source.value === 'string' && node.source.value.startsWith('@mui/x-charts');
   }).forEach(path => {
     path.node.specifiers?.forEach(node => {
-      root.findJSXElements(node.local?.name).forEach(elementPath => {
+      root.findJSXElements(node.local?.name.toString()).forEach(elementPath => {
         if (elementPath.node.type !== 'JSXElement') {
           return;
         }

package/v8.0.0/charts/replace-legend-direction-values/index.js

@@ -19,7 +19,7 @@ function transformer(file, api, options) {
     return typeof node.source.value === 'string' && node.source.value.startsWith('@mui/x-charts');
   }).forEach(path => {
     path.node.specifiers?.forEach(node => {
-      root.findJSXElements(node.local?.name).forEach(elementPath => {
+      root.findJSXElements(node.local?.name.toString()).forEach(elementPath => {
         if (elementPath.node.type !== 'JSXElement') {
           return;
         }

package/v8.0.0/charts/replace-legend-hidden-slot-prop/index.js

@@ -18,7 +18,7 @@ function transformer(file, api, options) {
     return typeof node.source.value === 'string' && node.source.value.startsWith('@mui/x-charts');
   }).forEach(path => {
     path.node.specifiers?.forEach(node => {
-      root.findJSXElements(node.local?.name).forEach(elementPath => {
+      root.findJSXElements(node.local?.name.toString()).forEach(elementPath => {
         if (elementPath.node.type !== 'JSXElement') {
           return;
         }

package/v8.0.0/charts/replace-legend-position-values/index.js

@@ -19,7 +19,7 @@ function transformer(file, api, options) {
     return typeof node.source.value === 'string' && node.source.value.startsWith('@mui/x-charts');
   }).forEach(path => {
     path.node.specifiers?.forEach(node => {
-      root.findJSXElements(node.local?.name).forEach(elementPath => {
+      root.findJSXElements(node.local?.name.toString()).forEach(elementPath => {
         if (elementPath.node.type !== 'JSXElement') {
           return;
         }

package/v8.0.0/data-grid/add-showToolbar-prop/index.js

@@ -16,9 +16,9 @@ function transformer(file, api, options) {
   // Find relevant DataGrid imports
   const importedDataGrids = new Set();
   root.find(j.ImportDeclaration).forEach(path => {
-    if (dataGridSources.has(path.node.source.value)) {
+    if (dataGridSources.has(path.node.source.value?.toString() ?? '')) {
       path.node.specifiers?.forEach(specifier => {
-        if (specifier.type === 'ImportSpecifier' && dataGridComponents.has(specifier.imported.name)) {
+        if (specifier.type === 'ImportSpecifier' && dataGridComponents.has(specifier.imported.name.toString())) {
           const localName = specifier.local?.name;
           if (localName) {
             importedDataGrids.add(localName);

package/v9.0.0/charts/preset-safe/index.js

@@ -9,9 +9,10 @@ exports.testConfig = void 0;
 var renameIdToSeriesId = _interopRequireWildcard(require("../rename-id-to-series-id"));
 var renameChartApiImport = _interopRequireWildcard(require("../rename-chart-api-import"));
 var replaceHeatmapHideLegend = _interopRequireWildcard(require("../replace-heatmap-hide-legend-false"));
+var replaceShowMarkDefault = _interopRequireWildcard(require("../replace-show-mark-default"));
 const allModules = [
 // Add other transforms here as they are created
-replaceHeatmapHideLegend, renameIdToSeriesId, renameChartApiImport];
+replaceHeatmapHideLegend, replaceShowMarkDefault, renameIdToSeriesId, renameChartApiImport];
 function transformer(file, api, options) {
   allModules.forEach(module => {
     file.source = module.default(file, api, options);

package/v9.0.0/charts/replace-show-mark-default/index.js

@@ -0,0 +1,91 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = transformer;
+exports.testConfig = void 0;
+var _path = _interopRequireDefault(require("path"));
+var _readFile = _interopRequireDefault(require("../../../util/readFile"));
+const COMPONENT_NAMES = ['LineChart', 'LineChartPro', 'LineChartPremium'];
+const PROVIDER_NAMES = ['ChartDataProvider', 'ChartDataProviderPro', 'ChartDataProviderPremium',
+// With the new naming to be sure codemod order does not matter
+'ChartsDataProvider', 'ChartsDataProviderPro', 'ChartsDataProviderPremium',
+// The component that includes the data provider.
+'ChartsContainer', 'ChartsContainerPro', 'ChartsContainerPremium'];
+
+/**
+ * Codemod for v9.0.0: Updates line series objects to preserve v8 behavior after the `showMark` default changes from true to false.
+ *
+ * If `showMark` is not defined, adds `showMark: true` to preserve v8 behavior.
+ *
+ * The `showmMark: false` cases are left unchanged to stay idempotent.
+ *
+ * Ths codemod applies on LineChart components and providers when series type is set to 'line'.
+ */
+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(p => COMPONENT_NAMES.includes(p.value.openingElement.name.name)).forEach(p => {
+    const seriesAttr = p.value.openingElement.attributes?.find(attr => attr.type === 'JSXAttribute' && attr.name.name === 'series');
+    if (!seriesAttr || seriesAttr.type !== 'JSXAttribute') {
+      return;
+    }
+    const seriesValue = seriesAttr.value;
+    if (!seriesValue || seriesValue.type !== 'JSXExpressionContainer') {
+      return;
+    }
+    const expr = seriesValue.expression;
+    if (expr.type !== 'ArrayExpression') {
+      return;
+    }
+    expr.elements.forEach(element => {
+      if (!element || element.type !== 'ObjectExpression') {
+        return;
+      }
+      const hasShowMark = element.properties.some(prop => prop.type === 'ObjectProperty' && prop.key.type === 'Identifier' && prop.key.name === 'showMark');
+      if (!hasShowMark) {
+        element.properties.push(j.objectProperty(j.identifier('showMark'), j.booleanLiteral(true)));
+      }
+    });
+  });
+  root.find(j.JSXElement).filter(p => PROVIDER_NAMES.includes(p.value.openingElement.name.name)).forEach(p => {
+    const seriesAttr = p.value.openingElement.attributes?.find(attr => attr.type === 'JSXAttribute' && attr.name.name === 'series');
+    if (!seriesAttr || seriesAttr.type !== 'JSXAttribute') {
+      return;
+    }
+    const seriesValue = seriesAttr.value;
+    if (!seriesValue || seriesValue.type !== 'JSXExpressionContainer') {
+      return;
+    }
+    const expr = seriesValue.expression;
+    if (expr.type !== 'ArrayExpression') {
+      return;
+    }
+    expr.elements.forEach(element => {
+      if (!element || element.type !== 'ObjectExpression') {
+        return;
+      }
+      const lineSeriesType = element.properties.some(prop => prop.type === 'ObjectProperty' && prop.key.type === 'Identifier' && prop.key.name === 'type' && prop.value.type === 'StringLiteral' && prop.value.value === 'line');
+      const hasShowMark = element.properties.some(prop => prop.type === 'ObjectProperty' && prop.key.type === 'Identifier' && prop.key.name === 'showMark');
+      if (lineSeriesType && !hasShowMark) {
+        element.properties.push(j.objectProperty(j.identifier('showMark'), j.booleanLiteral(true)));
+      }
+    });
+  });
+  return root.toSource(printOptions);
+}
+const testConfig = () => ({
+  name: 'replace-show-mark-default',
+  specFiles: [{
+    name: 'imports',
+    actual: (0, _readFile.default)(_path.default.join(__dirname, 'actual.spec.tsx')),
+    expected: (0, _readFile.default)(_path.default.join(__dirname, 'expected.spec.tsx'))
+  }]
+});
+exports.testConfig = testConfig;