@openrewrite/recipes-react 0.2.9

package/dist/simplify-react-imports.js

@@ -0,0 +1,199 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SimplifyReactImports = void 0;
+const rewrite_1 = require("@openrewrite/rewrite");
+const javascript_1 = require("@openrewrite/rewrite/javascript");
+const java_1 = require("@openrewrite/rewrite/java");
+const javascript_2 = require("@openrewrite/rewrite/javascript");
+const REACT_EXPORTS = new Set([
+    'useState',
+    'useEffect',
+    'useContext',
+    'useReducer',
+    'useCallback',
+    'useMemo',
+    'useRef',
+    'useImperativeHandle',
+    'useLayoutEffect',
+    'useDebugValue',
+    'useDeferredValue',
+    'useTransition',
+    'useId',
+    'useSyncExternalStore',
+    'useInsertionEffect',
+    'useActionState',
+    'useFormStatus',
+    'useOptimistic',
+    'use',
+    'cache',
+    'Fragment',
+    'Suspense',
+    'StrictMode',
+    'Profiler',
+    'createContext',
+    'forwardRef',
+    'lazy',
+    'memo',
+    'startTransition',
+    'Children',
+    'cloneElement',
+    'createElement',
+    'createRef',
+    'isValidElement',
+]);
+function getReactMethodName(method) {
+    var _a, _b;
+    const methodName = (_a = method.name) === null || _a === void 0 ? void 0 : _a.simpleName;
+    if (!methodName || !REACT_EXPORTS.has(methodName))
+        return undefined;
+    const select = method.select;
+    if (!select)
+        return undefined;
+    const selectExpr = (_b = select.element) !== null && _b !== void 0 ? _b : select;
+    if ((selectExpr === null || selectExpr === void 0 ? void 0 : selectExpr.kind) !== java_1.J.Kind.Identifier)
+        return undefined;
+    const identifier = selectExpr;
+    if (identifier.simpleName !== 'React')
+        return undefined;
+    return methodName;
+}
+class SimplifyReactImports extends rewrite_1.Recipe {
+    constructor() {
+        super(...arguments);
+        this.name = "org.openrewrite.react.simplify-react-imports";
+        this.displayName = "Simplify `React.xxx` to direct imports";
+        this.description = "Converts `React.useState`, `React.useEffect`, and other React namespace accesses to direct named imports.";
+    }
+    editor() {
+        return __awaiter(this, void 0, void 0, function* () {
+            return new class extends javascript_1.JavaScriptVisitor {
+                constructor() {
+                    super(...arguments);
+                    this.usedExports = new Set();
+                    this.localIdentifiers = new Set();
+                }
+                visitJsCompilationUnit(cu, ctx) {
+                    const _super = Object.create(null, {
+                        visitJsCompilationUnit: { get: () => super.visitJsCompilationUnit }
+                    });
+                    return __awaiter(this, void 0, void 0, function* () {
+                        this.usedExports = new Set();
+                        this.localIdentifiers = new Set();
+                        yield this.collectLocalIdentifiers(cu, ctx);
+                        let result = yield _super.visitJsCompilationUnit.call(this, cu, ctx);
+                        for (const exportName of this.usedExports) {
+                            (0, javascript_1.maybeAddImport)(this, { module: "react", member: exportName, onlyIfReferenced: false });
+                        }
+                        return result;
+                    });
+                }
+                collectLocalIdentifiers(cu, ctx) {
+                    return __awaiter(this, void 0, void 0, function* () {
+                        const collector = new class extends javascript_1.JavaScriptVisitor {
+                            constructor(identifiers) {
+                                super();
+                                this.identifiers = identifiers;
+                            }
+                            visitVariableDeclarations(varDecl, ctx) {
+                                const _super = Object.create(null, {
+                                    visitVariableDeclarations: { get: () => super.visitVariableDeclarations }
+                                });
+                                return __awaiter(this, void 0, void 0, function* () {
+                                    for (const v of varDecl.variables) {
+                                        const name = v.element.name;
+                                        if (name.kind === java_1.J.Kind.Identifier) {
+                                            this.identifiers.add(name.simpleName);
+                                        }
+                                    }
+                                    return _super.visitVariableDeclarations.call(this, varDecl, ctx);
+                                });
+                            }
+                            visitMethodDeclaration(method, ctx) {
+                                const _super = Object.create(null, {
+                                    visitMethodDeclaration: { get: () => super.visitMethodDeclaration }
+                                });
+                                return __awaiter(this, void 0, void 0, function* () {
+                                    this.identifiers.add(method.name.simpleName);
+                                    return _super.visitMethodDeclaration.call(this, method, ctx);
+                                });
+                            }
+                            visitImportSpecifier(spec, ctx) {
+                                const _super = Object.create(null, {
+                                    visitImportSpecifier: { get: () => super.visitImportSpecifier }
+                                });
+                                return __awaiter(this, void 0, void 0, function* () {
+                                    const specifier = spec.specifier;
+                                    if (specifier.kind === javascript_2.JS.Kind.Alias) {
+                                        const alias = specifier;
+                                        const aliasIdent = alias.alias;
+                                        if (aliasIdent.kind === java_1.J.Kind.Identifier) {
+                                            this.identifiers.add(aliasIdent.simpleName);
+                                        }
+                                    }
+                                    else if (specifier.kind === java_1.J.Kind.Identifier) {
+                                    }
+                                    return _super.visitImportSpecifier.call(this, spec, ctx);
+                                });
+                            }
+                        }(this.localIdentifiers);
+                        yield collector.visit(cu, ctx);
+                    });
+                }
+                visitMethodInvocation(method, ctx) {
+                    const _super = Object.create(null, {
+                        visitMethodInvocation: { get: () => super.visitMethodInvocation }
+                    });
+                    return __awaiter(this, void 0, void 0, function* () {
+                        let m = yield _super.visitMethodInvocation.call(this, method, ctx);
+                        const methodName = getReactMethodName(m);
+                        if (!methodName) {
+                            return m;
+                        }
+                        if (this.localIdentifiers.has(methodName)) {
+                            return m;
+                        }
+                        this.usedExports.add(methodName);
+                        const result = Object.assign(Object.assign({}, m), { select: undefined, name: m.name });
+                        return result;
+                    });
+                }
+                visitFieldAccess(fieldAccess, ctx) {
+                    const _super = Object.create(null, {
+                        visitFieldAccess: { get: () => super.visitFieldAccess }
+                    });
+                    return __awaiter(this, void 0, void 0, function* () {
+                        let fa = yield _super.visitFieldAccess.call(this, fieldAccess, ctx);
+                        if (fa.target.kind !== java_1.J.Kind.Identifier) {
+                            return fa;
+                        }
+                        const target = fa.target;
+                        if (target.simpleName !== 'React') {
+                            return fa;
+                        }
+                        const memberName = fa.name.element.simpleName;
+                        if (!REACT_EXPORTS.has(memberName)) {
+                            return fa;
+                        }
+                        if (this.localIdentifiers.has(memberName)) {
+                            return fa;
+                        }
+                        this.usedExports.add(memberName);
+                        const identifier = Object.assign(Object.assign({}, fa.name.element), { prefix: fa.prefix });
+                        return identifier;
+                    });
+                }
+            }();
+        });
+    }
+}
+exports.SimplifyReactImports = SimplifyReactImports;
+//# sourceMappingURL=simplify-react-imports.js.map

package/dist/simplify-react-imports.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"simplify-react-imports.js","sourceRoot":"","sources":["../src/simplify-react-imports.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -0,0 +1,39 @@
+{
+  "name": "@openrewrite/recipes-react",
+  "version": "0.2.9",
+  "license": "Moderne Source Available License",
+  "description": "OpenRewrite recipes for React.",
+  "homepage": "https://github.com/openrewrite/rewrite",
+  "main": "./dist/src/index.js",
+  "types": "./dist/src/index.d.ts",
+  "files": [
+    "dist/src/**",
+    "src/**"
+  ],
+  "exports": {
+    ".": "./dist/src/index.js"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "prebuild": "bun -e \"require('fs').rmSync('dist',{recursive:true,force:true})\" && bun -e \"require('fs').rmSync('tsconfig.build.tsbuildinfo',{force:true})\"",
+    "build": "tsc --build tsconfig.build.json",
+    "dev": "tsc --watch -p tsconfig.json",
+    "test": "npm run build && jest",
+    "ci:test": "NODE_OPTIONS=--max-old-space-size=6144 jest --runInBand"
+  },
+  "dependencies": {
+    "@openrewrite/rewrite": "next",
+    "mutative": "^1.1.0"
+  },
+  "devDependencies": {
+    "@types/jest": "^29.5.13",
+    "bun": "^1.3.5",
+    "jest": "^29.7.0",
+    "tmp-promise": "^3.0.3",
+    "ts-jest": "^29.2.5",
+    "ts-node": "^10.9.2",
+    "typescript": "^5.6.2"
+  }
+}

package/src/index.ts

@@ -0,0 +1,149 @@
+import {CategoryDescriptor, JavaScript, RecipeMarketplace} from "@openrewrite/rewrite";
+
+// React 19
+import {RemoveForwardRef} from './react19/remove-forward-ref';
+import {RemoveReactFC} from './react19/remove-react-fc';
+import {ReplaceActImport} from './react19/replace-act-import';
+import {RemoveContextProvider} from './react19/remove-context-provider';
+import {UseContextHook} from './react19/use-context-hook';
+import {ReplaceUseFormState} from './react19/replace-use-form-state';
+import {ReplaceStringRef} from './react19/replace-string-ref';
+import {ReplaceDefaultProps} from './react19/replace-default-props';
+import {ReplaceReactDomHydrate} from './react19/replace-reactdom-hydrate';
+import {UseRefRequiredInitial} from './react19/use-ref-required-initial';
+import {RemovePropTypes} from './react19/remove-prop-types';
+import {NoImplicitRefCallbackReturn} from './react19/no-implicit-ref-callback-return';
+import {DeprecatedReactTypes} from './react19/deprecated-react-types';
+import {FindLegacyContextAPI} from './react19/find-legacy-context-api';
+import {FindDeprecatedReactDomAPIs} from './react19/find-deprecated-reactdom-apis';
+import {FindContextConsumer} from './react19/find-context-consumer';
+import {UpgradeToReact19} from './react19/upgrade-to-react-19';
+
+import {FindElementRef} from './react19/find-element-ref';
+import {ReplaceReactShallowRenderer} from './react19/replace-react-shallow-renderer';
+
+// React 18
+import {ReplaceReactDomRender} from './react18/replace-reactdom-render';
+import {RemoveUnstableBatchedUpdates} from './react18/remove-unstable-batched-updates';
+import {ReplaceUnmountComponentAtNode} from './react18/replace-unmount-component-at-node';
+import {ReplaceRenderCallback} from './react18/replace-render-callback';
+import {UpgradeToReact18} from './react18/upgrade-to-react-18';
+
+// React 17
+import {RenameUnsafeLifecycles} from './react17/rename-unsafe-lifecycles';
+import {UpdateReactImports} from './react17/update-react-imports';
+import {RemoveEventPersist} from './react17/remove-event-persist';
+import {UpgradeToReact17} from './react17/upgrade-to-react-17';
+
+// React 16
+import {ErrorBoundaries} from './react16/error-boundaries';
+import {FindDomNode} from './react16/find-dom-node';
+import {ReactPropTypes} from './react16/react-prop-types';
+import {ReactDomFactories} from './react16/react-dom-factories';
+import {ReactToReactDom} from './react16/react-to-react-dom';
+import {ReplaceCreateFactory} from './react16/replace-create-factory';
+import {UpgradeToReact16} from './react16/upgrade-to-react-16';
+
+// Refactoring
+import {CreateClassToES6} from './refactoring/create-class-to-es6';
+import {ClassToFunctional} from './refactoring/class-to-functional';
+import {ManualBindToArrow} from './refactoring/manual-bind-to-arrow';
+import {CreateElementToJsx} from './refactoring/create-element-to-jsx';
+import {SortComp} from './refactoring/sort-comp';
+import {PureRenderMixin} from './refactoring/pure-render-mixin';
+
+// React Native
+import {ViewPropTypes} from './react-native/view-prop-types';
+
+// Search & Analysis
+import {FindReactComponent} from './search/find-react-component';
+import {FindHookUsage} from './search/find-hook-usage';
+import {FindPropUsage} from './search/find-prop-usage';
+import {FindServerRenderingUsage} from './search/find-server-rendering-usage';
+
+// General
+import {SimplifyReactImports} from './simplify-react-imports';
+import {SimplifyObjectPatternProperty} from './simplify-object-pattern-property';
+import {ChangeComponentPropValue} from './migration/change-component-prop-value';
+
+// Categories
+const React: CategoryDescriptor[] = [...JavaScript, {displayName: "React"}];
+const ReactMigrate: CategoryDescriptor[] = [...React, {displayName: "Migrate"}];
+const React16: CategoryDescriptor[] = [...ReactMigrate, {displayName: "React 16"}];
+const React17: CategoryDescriptor[] = [...ReactMigrate, {displayName: "React 17"}];
+const React18: CategoryDescriptor[] = [...ReactMigrate, {displayName: "React 18"}];
+const React19: CategoryDescriptor[] = [...ReactMigrate, {displayName: "React 19"}];
+const ReactMigration: CategoryDescriptor[] = [...React, {displayName: "Migration"}];
+const ReactRefactoring: CategoryDescriptor[] = [...React, {displayName: "Refactoring"}];
+const ReactNative: CategoryDescriptor[] = [...React, {displayName: "React Native"}];
+const ReactSearch: CategoryDescriptor[] = [...React, {displayName: "Search"}];
+const JavaScriptCleanup: CategoryDescriptor[] = [...JavaScript, {displayName: "Cleanup"}];
+
+export async function activate(marketplace: RecipeMarketplace) {
+    // React 19
+    await marketplace.install(RemoveForwardRef, React19);
+    await marketplace.install(RemoveReactFC, React19);
+    await marketplace.install(ReplaceActImport, React19);
+    await marketplace.install(RemoveContextProvider, React19);
+    await marketplace.install(UseContextHook, React19);
+    await marketplace.install(ReplaceUseFormState, React19);
+    await marketplace.install(ReplaceStringRef, React19);
+    await marketplace.install(ReplaceDefaultProps, React19);
+    await marketplace.install(ReplaceReactDomHydrate, React19);
+    await marketplace.install(UseRefRequiredInitial, React19);
+    await marketplace.install(RemovePropTypes, React19);
+    await marketplace.install(NoImplicitRefCallbackReturn, React19);
+    await marketplace.install(DeprecatedReactTypes, React19);
+    await marketplace.install(FindLegacyContextAPI, React19);
+    await marketplace.install(FindDeprecatedReactDomAPIs, React19);
+    await marketplace.install(FindContextConsumer, React19);
+    await marketplace.install(FindElementRef, React19);
+    await marketplace.install(ReplaceReactShallowRenderer, React19);
+    await marketplace.install(UpgradeToReact19, ReactMigrate);
+
+    // React 18
+    await marketplace.install(ReplaceReactDomRender, React18);
+    await marketplace.install(RemoveUnstableBatchedUpdates, React18);
+    await marketplace.install(ReplaceUnmountComponentAtNode, React18);
+    await marketplace.install(ReplaceRenderCallback, React18);
+    await marketplace.install(UpgradeToReact18, ReactMigrate);
+
+    // React 17
+    await marketplace.install(RenameUnsafeLifecycles, React17);
+    await marketplace.install(UpdateReactImports, React17);
+    await marketplace.install(RemoveEventPersist, React17);
+    await marketplace.install(UpgradeToReact17, ReactMigrate);
+
+    // React 16
+    await marketplace.install(ErrorBoundaries, React16);
+    await marketplace.install(FindDomNode, React16);
+    await marketplace.install(ReactPropTypes, React16);
+    await marketplace.install(ReactDomFactories, React16);
+    await marketplace.install(ReactToReactDom, React16);
+    await marketplace.install(ReplaceCreateFactory, React16);
+    await marketplace.install(UpgradeToReact16, ReactMigrate);
+
+    // Refactoring
+    await marketplace.install(CreateClassToES6, ReactRefactoring);
+    await marketplace.install(ClassToFunctional, ReactRefactoring);
+    await marketplace.install(ManualBindToArrow, ReactRefactoring);
+    await marketplace.install(CreateElementToJsx, ReactRefactoring);
+    await marketplace.install(SortComp, ReactRefactoring);
+    await marketplace.install(PureRenderMixin, ReactRefactoring);
+
+    // React Native
+    await marketplace.install(ViewPropTypes, ReactNative);
+
+    // Search & Analysis
+    await marketplace.install(FindReactComponent, ReactSearch);
+    await marketplace.install(FindHookUsage, ReactSearch);
+    await marketplace.install(FindPropUsage, ReactSearch);
+    await marketplace.install(FindServerRenderingUsage, ReactSearch);
+
+    // General
+    await marketplace.install(SimplifyReactImports, React);
+    await marketplace.install(SimplifyObjectPatternProperty, JavaScriptCleanup);
+    await marketplace.install(ChangeComponentPropValue, ReactMigration);
+}
+
+export {ChangeComponentPropValue} from './migration/change-component-prop-value';

package/src/migration/change-component-prop-value.ts

@@ -0,0 +1,268 @@
+import {ExecutionContext, Option, Recipe, TreeVisitor} from "@openrewrite/rewrite";
+import {JavaScriptVisitor, JS, JSX} from "@openrewrite/rewrite/javascript";
+import {J, isIdentifier} from "@openrewrite/rewrite/java";
+import {create} from "mutative";
+
+/**
+ * Changes literal prop values on React components during library upgrades.
+ *
+ * This recipe is useful when upgrading UI libraries that rename prop values
+ * (e.g., Material-UI, Ant Design). It only transforms literal string values,
+ * skipping variables and expressions to avoid unintended changes.
+ *
+ * @example
+ * // Exact match
+ * const recipe = new ChangeComponentPropValue({
+ *     componentName: "Button",
+ *     propName: "variant",
+ *     oldValue: "outlined",
+ *     newValue: "outlined-primary"
+ * });
+ * // Before: <Button variant="outlined">Click me</Button>
+ * // After:  <Button variant="outlined-primary">Click me</Button>
+ *
+ * @example
+ * // Regex with capture groups
+ * const recipe = new ChangeComponentPropValue({
+ *     componentName: "Button",
+ *     propName: "variant",
+ *     oldValue: "^(outlined|text|contained)$",
+ *     newValue: "$1-primary",
+ *     regex: true
+ * });
+ * // Before: <Button variant="outlined">Click me</Button>
+ * // After:  <Button variant="outlined-primary">Click me</Button>
+ *
+ * @example
+ * // Change all values (omit oldValue)
+ * const recipe = new ChangeComponentPropValue({
+ *     componentName: "Button",
+ *     propName: "variant",
+ *     newValue: "primary"
+ * });
+ * // Before: <Button variant="outlined">Click me</Button>
+ * // After:  <Button variant="primary">Click me</Button>
+ */
+export class ChangeComponentPropValue extends Recipe {
+    readonly name = "org.openrewrite.react.migration.change-component-prop-value";
+    readonly displayName: string = "Change React component prop value";
+    readonly description: string = "Changes literal prop values on React components. Useful for library upgrades where prop values were renamed (e.g., Material-UI, Ant Design).";
+
+    @Option({
+        displayName: "Component name",
+        description: "The name of the React component to target",
+        example: "Button"
+    })
+    componentName!: string;
+
+    @Option({
+        displayName: "Prop name",
+        description: "The name of the prop whose value should be changed",
+        example: "variant"
+    })
+    propName!: string;
+
+    @Option({
+        displayName: "Old value",
+        description: "The old value to match. If `regex` is `true`, interpreted as a regular expression pattern. Supports `/pattern/flags` format for specifying regex flags (e.g., `/pattern/i` for case-insensitive). If not provided, matches all values.",
+        example: "outlined",
+        required: false
+    })
+    oldValue?: string;
+
+    @Option({
+        displayName: "New value",
+        description: "The new value to replace with. Can use `$1`, `$2`, etc. to reference capture groups if `regex` is `true`.",
+        example: "outlined-primary"
+    })
+    newValue!: string;
+
+    @Option({
+        displayName: "Regex",
+        description: "If `true`, `oldValue` is interpreted as a regex pattern. Capture groups can be referenced in newValue using `$1`, `$2`, etc.",
+        required: false
+    })
+    regex?: boolean;
+
+    constructor(options?: {
+        componentName?: string;
+        propName?: string;
+        oldValue?: string;
+        newValue?: string;
+        regex?: boolean;
+    }) {
+        super(options);
+    }
+
+    async editor(): Promise<TreeVisitor<any, ExecutionContext>> {
+        const componentName = this.componentName;
+        const propName = this.propName;
+        const oldValue = this.oldValue;
+        const newValue = this.newValue;
+        const isRegex = this.regex ?? false;
+
+        // Build matcher based on regex flag and oldValue
+        let matcher: ((value: string) => string | null);
+
+        if (!oldValue) {
+            // No old value specified - match all values
+            matcher = (value: string) => newValue;
+        } else if (isRegex) {
+            // Compile regex pattern, supporting /pattern/flags format
+            let pattern = oldValue;
+            let flags = '';
+
+            // Check if pattern is in /pattern/flags format
+            const regexMatch = oldValue.match(/^\/(.+?)\/([gimsuvy]*)$/);
+            if (regexMatch) {
+                pattern = regexMatch[1];
+                flags = regexMatch[2];
+            }
+
+            const regex = new RegExp(pattern, flags);
+
+            matcher = (value: string) => {
+                const match = value.match(regex);
+                if (match) {
+                    // Replace $1, $2, etc. with capture groups
+                    return newValue.replace(/\$(\d+)/g, (_, num) => match[parseInt(num)] || '');
+                }
+                return null;
+            };
+        } else {
+            // Literal string match
+            matcher = (value: string) => value === oldValue ? newValue : null;
+        }
+
+        return new class extends JavaScriptVisitor<ExecutionContext> {
+            // FIXME: This manual import tracking should be removed once type attribution preserves
+            // module/package origin information. Currently, JSX element types show as generic
+            // function types (𝑓) without preserving where they were imported from. Ideally, we
+            // should be able to match components by checking if their type originates from the
+            // expected module (e.g., @mui/material.Button), which would automatically handle
+            // all import patterns (named, aliased, default, namespace) without manual tracking.
+            private componentAliases = new Map<string, string>();
+
+            override async visitCompilationUnit(cu: J.CompilationUnit, p: ExecutionContext): Promise<J | undefined> {
+                // Reset aliases for each file
+                this.componentAliases.clear();
+                return super.visitCompilationUnit(cu, p);
+            }
+
+            override async visitImportSpecifier(spec: JS.ImportSpecifier, p: ExecutionContext): Promise<J | undefined> {
+                // Track named imports with potential aliases
+                const specifier = spec.specifier;
+
+                if (specifier.kind === JS.Kind.Alias) {
+                    const alias = specifier as JS.Alias;
+                    const propertyName = alias.propertyName.element;
+
+                    if (isIdentifier(propertyName) && propertyName.simpleName === componentName) {
+                        // Aliased import: import { Button as CustomButton }
+                        const aliasIdent = alias.alias;
+                        if (isIdentifier(aliasIdent)) {
+                            this.componentAliases.set(aliasIdent.simpleName, componentName);
+                        }
+                    }
+                } else if (isIdentifier(specifier) && specifier.simpleName === componentName) {
+                    // Direct import: import { Button }
+                    this.componentAliases.set(componentName, componentName);
+                }
+
+                return super.visitImportSpecifier(spec, p);
+            }
+
+            override async visitImportClause(clause: JS.ImportClause, p: ExecutionContext): Promise<J | undefined> {
+                // Track default imports
+                if (clause.name) {
+                    const identifier = clause.name.element;
+                    if (isIdentifier(identifier) && identifier.simpleName === componentName) {
+                        // Default import: import Button from '...'
+                        this.componentAliases.set(componentName, componentName);
+                    }
+                }
+
+                return super.visitImportClause(clause, p);
+            }
+
+            override async visitJsxAttribute(attribute: JSX.Attribute, p: ExecutionContext): Promise<J | undefined> {
+                // Visit children first
+                const attr = await super.visitJsxAttribute(attribute, p) as JSX.Attribute;
+
+                // Check if this is the prop we're looking for
+                const key = attr.key;
+                if (!isIdentifier(key) || key.simpleName !== propName) {
+                    return attr;
+                }
+
+                // Verify this attribute belongs to the target component
+                const tag = this.cursor.firstEnclosing((t): t is JSX.Tag =>
+                    t.kind === JS.Kind.JsxTag
+                );
+                if (!tag) {
+                    return attr;
+                }
+
+                if (!this.isTargetComponent(tag)) {
+                    return attr;
+                }
+
+                // Check if the value is a literal we should replace
+                if (!attr.value) {
+                    return attr;
+                }
+
+                const value = attr.value.element;
+                const newValue = this.getReplacementValue(value);
+                if (!newValue) {
+                    return attr;
+                }
+
+                // Replace the value
+                return create(attr, draft => {
+                    if (draft.value) {
+                        draft.value.element = newValue;
+                    }
+                });
+            }
+
+            private isTargetComponent(tag: JSX.Tag): boolean {
+                const openName = tag.openName.element;
+
+                if (isIdentifier(openName)) {
+                    const tagName = openName.simpleName;
+                    // Check if tagName matches our component or is an alias for it
+                    return tagName === componentName ||
+                           this.componentAliases.get(tagName) === componentName;
+                } else if (openName.kind === J.Kind.FieldAccess) {
+                    const fieldAccess = openName as J.FieldAccess;
+                    const nameIdent = fieldAccess.name.element;
+                    if (isIdentifier(nameIdent)) {
+                        return nameIdent.simpleName === componentName;
+                    }
+                }
+
+                return false;
+            }
+
+            private getReplacementValue(value: J): J | null {
+                // Only handle string literals (quoted values)
+                if (value.kind === J.Kind.Literal) {
+                    const literal = value as J.Literal;
+                    const literalValue = literal.value;
+                    if (typeof literalValue === 'string') {
+                        const replacement = matcher(literalValue);
+                        if (replacement !== null) {
+                            return create(literal, draft => {
+                                draft.value = replacement;
+                                draft.valueSource = `"${replacement}"`;
+                            });
+                        }
+                    }
+                }
+
+                return null;
+            }
+        }();
+    }
+}