feat(codemod): add preview import codemods for products, core, combined (#20253)

matthewgallo · Gururajj77 · tay1orjones · web-flow · commit b33d0ba4af09 · 2025-08-22T17:08:02.000Z
* feat(codemod): add codemod for ibm-product pdlc export changes

* chore(codemod): format

* fix(codemod): update fixtures

* chore(codemod): update naming

Co-authored-by: Taylor Jones &lt;tay1orjones@users.noreply.github.com&gt;

* fix(codemod): remove page header to avoid clashes b/w two versions

* feat(codemod): add core codemod and combined version

* refactor(codemod): update combined codemod

* refactor(codemod): update combined codemod

* fix(codemod): cjs changes

* chore(codemod): update naming to be more clear

---------

Co-authored-by: Gururaj J &lt;89023023+Gururajj77@users.noreply.github.com&gt;
Co-authored-by: Taylor Jones &lt;tay1orjones@users.noreply.github.com&gt;
diff --git a/packages/upgrade/src/upgrades.js b/packages/upgrade/src/upgrades.js
@@ -664,6 +664,97 @@ export const upgrades = [
           });
         },
       },
+      {
+        name: 'rename-ibm-products-imports-to-preview',
+        description: 'Update imports after PDLC status integration',
+        migrate: async (options) => {
+          const transform = path.join(
+            TRANSFORM_DIR,
+            'ibm-products-update-pdlc-status.js'
+          );
+          const paths =
+            Array.isArray(options.paths) && options.paths.length > 0
+              ? options.paths
+              : await glob(['**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx'], {
+                  cwd: options.workspaceDir,
+                  ignore: [
+                    '**/es/**',
+                    '**/lib/**',
+                    '**/umd/**',
+                    '**/node_modules/**',
+                    '**/storybook-static/**',
+                  ],
+                });
+
+          await run({
+            dry: !options.write,
+            transform,
+            paths,
+            verbose: options.verbose,
+          });
+        },
+      },
+      {
+        name: 'rename-carbon-imports-to-preview',
+        description: 'Update imports after PDLC status integration',
+        migrate: async (options) => {
+          const transform = path.join(
+            TRANSFORM_DIR,
+            'rename-imports-to-preview.js'
+          );
+          const paths =
+            Array.isArray(options.paths) && options.paths.length > 0
+              ? options.paths
+              : await glob(['**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx'], {
+                  cwd: options.workspaceDir,
+                  ignore: [
+                    '**/es/**',
+                    '**/lib/**',
+                    '**/umd/**',
+                    '**/node_modules/**',
+                    '**/storybook-static/**',
+                  ],
+                });
+
+          await run({
+            dry: !options.write,
+            transform,
+            paths,
+            verbose: options.verbose,
+          });
+        },
+      },
+      {
+        name: 'rename-imports-to-preview',
+        description:
+          'Update imports after PDLC status integration both `@carbon/react` and `@carbon/ibm-products`, this assumes both packages are upgraded together to adopt the preview export naming',
+        migrate: async (options) => {
+          const transform = path.join(
+            TRANSFORM_DIR,
+            'rename-imports-to-preview-core-and-products.js'
+          );
+          const paths =
+            Array.isArray(options.paths) && options.paths.length > 0
+              ? options.paths
+              : await glob(['**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx'], {
+                  cwd: options.workspaceDir,
+                  ignore: [
+                    '**/es/**',
+                    '**/lib/**',
+                    '**/umd/**',
+                    '**/node_modules/**',
+                    '**/storybook-static/**',
+                  ],
+                });
+
+          await run({
+            dry: !options.write,
+            transform,
+            paths,
+            verbose: options.verbose,
+          });
+        },
+      },
       {
         name: 'enable-v12-structured-list-visible-icons',
         description: `
diff --git a/packages/upgrade/transforms/__testfixtures__/ibm-products-update-pdlc-status.input.js b/packages/upgrade/transforms/__testfixtures__/ibm-products-update-pdlc-status.input.js
@@ -0,0 +1,2 @@
+// eslint-disable-next-line no-unused-vars
+import { Tearsheet, SearchBar } from '@carbon/ibm-products';
diff --git a/packages/upgrade/transforms/__testfixtures__/ibm-products-update-pdlc-status.output.js b/packages/upgrade/transforms/__testfixtures__/ibm-products-update-pdlc-status.output.js
@@ -0,0 +1,2 @@
+// eslint-disable-next-line no-unused-vars
+import { Tearsheet, previewCandidate__SearchBar } from '@carbon/ibm-products';
diff --git a/packages/upgrade/transforms/__testfixtures__/rename-imports-to-preview-core-and-products.input.js b/packages/upgrade/transforms/__testfixtures__/rename-imports-to-preview-core-and-products.input.js
@@ -0,0 +1,4 @@
+// eslint-disable-next-line no-unused-vars
+import { unstable__FluidTimePicker } from '@carbon/react';
+// eslint-disable-next-line no-unused-vars
+import { Tearsheet, SearchBar } from '@carbon/ibm-products';
diff --git a/packages/upgrade/transforms/__testfixtures__/rename-imports-to-preview-core-and-products.output.js b/packages/upgrade/transforms/__testfixtures__/rename-imports-to-preview-core-and-products.output.js
@@ -0,0 +1,4 @@
+// eslint-disable-next-line no-unused-vars
+import { preview__FluidTimePicker } from '@carbon/react';
+// eslint-disable-next-line no-unused-vars
+import { Tearsheet, previewCandidate__SearchBar } from '@carbon/ibm-products';
diff --git a/packages/upgrade/transforms/__testfixtures__/rename-imports-to-preview.input.js b/packages/upgrade/transforms/__testfixtures__/rename-imports-to-preview.input.js
@@ -0,0 +1,2 @@
+// eslint-disable-next-line no-unused-vars
+import { unstable__FluidTimePicker } from '@carbon/react';
diff --git a/packages/upgrade/transforms/__testfixtures__/rename-imports-to-preview.output.js b/packages/upgrade/transforms/__testfixtures__/rename-imports-to-preview.output.js
@@ -0,0 +1,2 @@
+// eslint-disable-next-line no-unused-vars
+import { preview__FluidTimePicker } from '@carbon/react';
diff --git a/packages/upgrade/transforms/__tests__/ibm-products-update-pdlc-status-test.js b/packages/upgrade/transforms/__tests__/ibm-products-update-pdlc-status-test.js
@@ -0,0 +1,12 @@
+/**
+ * Copyright IBM Corp. 2025, 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+const { defineTest } = require('jscodeshift/dist/testUtils');
+
+defineTest(__dirname, 'ibm-products-update-pdlc-status');
diff --git a/packages/upgrade/transforms/__tests__/rename-imports-to-preview-core-and-products-test.js b/packages/upgrade/transforms/__tests__/rename-imports-to-preview-core-and-products-test.js
@@ -0,0 +1,12 @@
+/**
+ * Copyright IBM Corp. 2025, 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+const { defineTest } = require('jscodeshift/dist/testUtils');
+
+defineTest(__dirname, 'rename-imports-to-preview-core-and-products');
diff --git a/packages/upgrade/transforms/__tests__/rename-imports-to-preview-test.js b/packages/upgrade/transforms/__tests__/rename-imports-to-preview-test.js
@@ -0,0 +1,12 @@
+/**
+ * Copyright IBM Corp. 2025, 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+const { defineTest } = require('jscodeshift/dist/testUtils');
+
+defineTest(__dirname, 'rename-imports-to-preview');
diff --git a/packages/upgrade/transforms/ibm-products-update-pdlc-status.js b/packages/upgrade/transforms/ibm-products-update-pdlc-status.js
@@ -0,0 +1,44 @@
+/**
+ * Copyright IBM Corp. 2025, 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+const { productsPreviewMap } = require('./nonStableMapping');
+
+/**
+ * Updates imports for non-stable components
+ *
+ * @example
+ * Before:
+ * import { SearchBar, InlineTip } from '@carbon/ibm-products';
+ *
+ * After:
+ * import { previewCandidate__SearchBar, previewCandidate__InlineTip } from "@carbon/ibm-products";
+ */
+
+const nonStableComponentKeys = Object.keys(productsPreviewMap);
+
+function transformer(file, api) {
+  const j = api.jscodeshift;
+
+  return j(file.source)
+    .find(j.ImportDeclaration, {
+      source: {
+        value: '@carbon/ibm-products',
+      },
+    })
+    .find(j.ImportSpecifier)
+    .filter(
+      (path) => !!nonStableComponentKeys.includes(path.node.imported.name)
+    )
+    .replaceWith((path) =>
+      j.importSpecifier(
+        j.identifier(productsPreviewMap[path.node.imported.name])
+      )
+    )
+    .toSource();
+}
+
+module.exports = transformer;
diff --git a/packages/upgrade/transforms/nonStableMapping.js b/packages/upgrade/transforms/nonStableMapping.js
@@ -0,0 +1,34 @@
+/**
+ * Copyright IBM Corp. 2025, 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+exports.reactPreviewMap = {
+  unstable__FluidTimePicker: 'preview__FluidTimePicker',
+};
+
+exports.productsPreviewMap = {
+  BigNumber: 'previewCandidate__BigNumber',
+  BigNumbers: 'previewCandidate__BigNumber',
+  Coachmark: 'previewCandidate__Coachmark',
+  ConditionBuilder: 'previewCandidate__ConditionBuilder',
+  DataSpreadsheet: 'previewCandidate__DataSpreadsheet',
+  Decorator: 'previewCandidate__Decorator',
+  DelimitedList: 'previewCandidate__DelimitedList',
+  GetStartedCard: 'previewCandidate__GetStartedCard',
+  GuideBanner: 'previewCandidate__Guidebanner',
+  GuidebannerElement: 'previewCandidate__GuidebannerElement',
+  GuidebannerElementButton: 'previewCandidate__GuidebannerElementButton',
+  GuidebannerElementLink: 'previewCandidate__GuidebannerElementLink',
+  InlineTip: 'previewCandidate__InlineTip',
+  InlineTipButton: 'previewCandidate__InlineTipButton',
+  InlineTipLink: 'previewCandidate__InlineTipLink',
+  NonLinearReading: 'previewCandidate__NonLinearReading',
+  SearchBar: 'previewCandidate__SearchBar',
+  Toolbar: 'previewCandidate__Toolbar',
+  ToolbarButton: 'previewCandidate__ToolbarButton',
+  ToolbarGroup: 'previewCandidate__ToolbarGroup',
+  TruncatedList: 'previewCandidate__TruncatedList',
+};
diff --git a/packages/upgrade/transforms/rename-imports-to-preview-core-and-products.js b/packages/upgrade/transforms/rename-imports-to-preview-core-and-products.js
@@ -0,0 +1,48 @@
+/**
+ * Copyright IBM Corp. 2025, 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+const { reactPreviewMap, productsPreviewMap } = require('./nonStableMapping');
+
+/**
+ * Updates imports for non-stable components
+ *
+ * @example
+ * Before:
+ * import { unstable__FluidTimePicker } from '@carbon/react';
+ * import { SearchBar } from '@carbon/ibm-products';
+ *
+ * After:
+ * import { preview__FluidTimePicker } from "@carbon/react";
+ * import { previewCandidate__SearchBar } from '@carbon/ibm-products';
+ */
+
+const allPreviews = { ...reactPreviewMap, ...productsPreviewMap };
+const nonStableKeys = Object.keys(allPreviews);
+
+const carbonPackages = ['@carbon/react', '@carbon/ibm-products'];
+
+function transformer(file, api) {
+  const j = api.jscodeshift;
+  const root = j(file.source);
+
+  carbonPackages.forEach((p) => {
+    root
+      .find(j.ImportDeclaration, {
+        source: {
+          value: p,
+        },
+      })
+      .find(j.ImportSpecifier)
+      .filter((path) => !!nonStableKeys.includes(path.node.imported.name))
+      .replaceWith((path) =>
+        j.importSpecifier(j.identifier(allPreviews[path.node.imported.name]))
+      );
+  });
+  return root.toSource();
+}
+
+module.exports = transformer;
diff --git a/packages/upgrade/transforms/rename-imports-to-preview.js b/packages/upgrade/transforms/rename-imports-to-preview.js
@@ -0,0 +1,42 @@
+/**
+ * Copyright IBM Corp. 2025, 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+const { reactPreviewMap } = require('./nonStableMapping');
+
+/**
+ * Updates imports for non-stable components
+ *
+ * @example
+ * Before:
+ * import { unstable__FluidTimePicker } from '@carbon/react';
+ *
+ * After:
+ * import { preview__FluidTimePicker } from "@carbon/react";
+ */
+
+const nonStableComponentKeys = Object.keys(reactPreviewMap);
+
+function transformer(file, api) {
+  const j = api.jscodeshift;
+
+  return j(file.source)
+    .find(j.ImportDeclaration, {
+      source: {
+        value: '@carbon/react',
+      },
+    })
+    .find(j.ImportSpecifier)
+    .filter(
+      (path) => !!nonStableComponentKeys.includes(path.node.imported.name)
+    )
+    .replaceWith((path) =>
+      j.importSpecifier(j.identifier(reactPreviewMap[path.node.imported.name]))
+    )
+    .toSource();
+}
+
+module.exports = transformer;

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,2 @@`
	`1`	`+// eslint-disable-next-line no-unused-vars`
	`2`	`+import { Tearsheet, SearchBar } from '@carbon/ibm-products';`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,2 @@`
	`1`	`+// eslint-disable-next-line no-unused-vars`
	`2`	`+import { Tearsheet, previewCandidate__SearchBar } from '@carbon/ibm-products';`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,2 @@`
	`1`	`+// eslint-disable-next-line no-unused-vars`
	`2`	`+import { unstable__FluidTimePicker } from '@carbon/react';`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,2 @@`
	`1`	`+// eslint-disable-next-line no-unused-vars`
	`2`	`+import { preview__FluidTimePicker } from '@carbon/react';`