@carbon/upgrade 11.23.0-rc.0 → 11.23.0

package/cli.js

@@ -52641,6 +52641,49 @@ var upgrades = [
           });
         }
       },
+      {
+        name: "slug-prop-to-decorator-prop",
+        description: `
+          Replace slug prop with decorator
+          
+          Transforms:
+          <Component slug="value">
+            content
+          </Component>
+      
+          Into:
+          <Component decorator="value">
+            content
+          </Component>
+        `,
+        migrate: async (options) => {
+          const transform = import_path2.default.join(
+            TRANSFORM_DIR,
+            "slug-prop-to-decorator-prop.js"
+          );
+          const paths = Array.isArray(options.paths) && options.paths.length > 0 ? options.paths : await (0, import_fast_glob2.default)(["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"], {
+            cwd: options.workspaceDir,
+            ignore: [
+              "**/es/**",
+              "**/lib/**",
+              "**/umd/**",
+              "**/node_modules/**",
+              "**/storybook-static/**",
+              "**/dist/**",
+              "**/build/**",
+              "**/*.d.ts",
+              "**/coverage/**"
+            ]
+          });
+          await run2({
+            dry: !options.write,
+            transform,
+            paths,
+            verbose: options.verbose,
+            parser: "tsx"
+          });
+        }
+      },
       {
         name: "refactor-light-to-layer",
         description: `
@@ -52886,7 +52929,7 @@ var upgrades = [
 var package_default = {
   name: "@carbon/upgrade",
   description: "A tool for upgrading Carbon versions",
-  version: "11.23.0-rc.0",
+  version: "11.23.0",
   license: "Apache-2.0",
   bin: {
     "carbon-upgrade": "./bin/carbon-upgrade.js"

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/upgrade",
   "description": "A tool for upgrading Carbon versions",
-  "version": "11.23.0-rc.0",
+  "version": "11.23.0",
   "license": "Apache-2.0",
   "bin": {
     "carbon-upgrade": "./bin/carbon-upgrade.js"
@@ -61,5 +61,5 @@
     "@ibm/telemetry-js": "^1.5.0",
     "jscodeshift": "^17.0.0"
   },
-  "gitHead": "9cf96c5f68ef9216d1c73a5dfb7bdb3bd007b0c1"
+  "gitHead": "fd1b7ab668473833c250488e0f7fc4feb55f1d88"
 }

package/transforms/__testfixtures__/slug-prop-to-decorator-prop.input.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import { Dropdown, Checkbox, Tag } from '@carbon/react';
+
+function TestComponent() {
+  return (
+    //prettier-ignore
+    <div>
+      {/* Basic Dropdown usage */}
+      <Dropdown
+        label="Select an option"
+        slug="dropdown-1"
+        items={['Option 1', 'Option 2']}
+        id="dropdown-1"
+        titleText="Dropdown"
+      />
+      {/* Checkbox with expression */}
+      <Checkbox
+        labelText="Check me"
+        slug={'checkbox-1'}
+        id="checkbox-1"
+      />
+      {/* Tag with string literal */}
+      <Tag slug={'static-tag'} type="red">
+        Important
+      </Tag>
+      {/* Nested structure */}
+      <div>
+        <Tag slug="tag-1" type="blue">
+          Active
+        </Tag>
+        <Checkbox
+          slug="checkbox-2"
+          labelText="Enable feature"
+          id="checkbox-2"
+        />
+      </div>
+    </div>
+  );
+}
+
+export default TestComponent;

package/transforms/__testfixtures__/slug-prop-to-decorator-prop.input.tsx

@@ -0,0 +1,41 @@
+import React from 'react';
+import { Dropdown, Checkbox, Tag } from '@carbon/react';
+
+const TestComponent: React.FC = () => {
+  return (
+    //prettier-ignore
+    <div>
+      {/* Basic Dropdown usage */}
+      <Dropdown
+        label="Select an option"
+        slug="dropdown-1"
+        items={['Option 1', 'Option 2']}
+        id="dropdown-1"
+        titleText="Dropdown"
+      />
+      {/* Checkbox with expression */}
+      <Checkbox
+        labelText="Check me"
+        slug={'checkbox-1'}
+        id="checkbox-1"
+      />
+      {/* Tag with string literal */}
+      <Tag slug={'static-tag'} type="red">
+        Important
+      </Tag>
+      {/* Nested structure */}
+      <div>
+        <Tag slug="tag-1" type="blue">
+          Active
+        </Tag>
+        <Checkbox
+          slug="checkbox-2"
+          labelText="Enable feature"
+          id="checkbox-2"
+        />
+      </div>
+    </div>
+  );
+};
+
+export default TestComponent;

package/transforms/__testfixtures__/slug-prop-to-decorator-prop.output.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import { Dropdown, Checkbox, Tag } from '@carbon/react';
+
+function TestComponent() {
+  return (
+    //prettier-ignore
+    (<div>
+      {/* Basic Dropdown usage */}
+      <Dropdown
+        label="Select an option"
+        decorator="dropdown-1"
+        items={['Option 1', 'Option 2']}
+        id="dropdown-1"
+        titleText="Dropdown"
+      />
+      {/* Checkbox with expression */}
+      <Checkbox
+        labelText="Check me"
+        decorator={'checkbox-1'}
+        id="checkbox-1"
+      />
+      {/* Tag with string literal */}
+      <Tag decorator={'static-tag'} type="red">
+        Important
+      </Tag>
+      {/* Nested structure */}
+      <div>
+        <Tag decorator="tag-1" type="blue">
+          Active
+        </Tag>
+        <Checkbox
+          decorator="checkbox-2"
+          labelText="Enable feature"
+          id="checkbox-2"
+        />
+      </div>
+    </div>)
+  );
+}
+
+export default TestComponent;

package/transforms/__testfixtures__/slug-prop-to-decorator-prop.output.tsx

@@ -0,0 +1,41 @@
+import React from 'react';
+import { Dropdown, Checkbox, Tag } from '@carbon/react';
+
+const TestComponent: React.FC = () => {
+  return (
+    //prettier-ignore
+    (<div>
+      {/* Basic Dropdown usage */}
+      <Dropdown
+        label="Select an option"
+        decorator="dropdown-1"
+        items={['Option 1', 'Option 2']}
+        id="dropdown-1"
+        titleText="Dropdown"
+      />
+      {/* Checkbox with expression */}
+      <Checkbox
+        labelText="Check me"
+        decorator={'checkbox-1'}
+        id="checkbox-1"
+      />
+      {/* Tag with string literal */}
+      <Tag decorator={'static-tag'} type="red">
+        Important
+      </Tag>
+      {/* Nested structure */}
+      <div>
+        <Tag decorator="tag-1" type="blue">
+          Active
+        </Tag>
+        <Checkbox
+          decorator="checkbox-2"
+          labelText="Enable feature"
+          id="checkbox-2"
+        />
+      </div>
+    </div>)
+  );
+};
+
+export default TestComponent;

package/transforms/__tests__/slug-prop-to-decorator-prop-test.js

@@ -0,0 +1,12 @@
+/**
+ * Copyright IBM Corp. 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, 'slug-prop-to-decorator-prop');

package/transforms/slug-prop-to-decorator-prop.js

@@ -0,0 +1,47 @@
+/**
+ * Copyright IBM Corp. 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.
+ *
+ * Replace slug prop with decorator
+ */
+
+'use strict';
+
+const defaultOptions = {
+  quote: 'single',
+  trailingComma: true,
+};
+
+function transform(fileInfo, api, options) {
+  const j = api.jscodeshift;
+  const root = j(fileInfo.source);
+  const printOptions = options.printOptions || defaultOptions;
+
+  // Early return if no JSX elements with slug prop found
+  if (!root.find(j.JSXAttribute, { name: { name: 'slug' } }).size()) {
+    return null;
+  }
+
+  // Replace slug with decorator
+  root
+    .find(j.JSXAttribute, {
+      name: { name: 'slug' },
+    })
+    .forEach((path) => {
+      // Create new decorator attribute with same value as slug
+      const newAttribute = j.jsxAttribute(
+        j.jsxIdentifier('decorator'),
+        path.node.value
+      );
+
+      // Replace the slug attribute with decorator
+      j(path).replaceWith(newAttribute);
+    });
+
+  return root.toSource(printOptions);
+}
+
+module.exports = transform;
+module.exports.parser = 'tsx';