Change React component prop value
Recipe ID
org.openrewrite.react.migration.change-component-prop-valueArtifact@openrewrite/recipes-reactChanges literal prop values on React components. Useful for library upgrades where prop values were renamed (e.g., Material-UI, Ant Design).
Single recipeProprietary
Usage
You’ll need the Moderne CLI configured before running the command below.
mod run . --recipe org.openrewrite.react.migration.change-component-prop-value --recipe-option "componentName=Button" --recipe-option "propName=variant" --recipe-option "newValue=outlined-primary"If the recipe isn’t available locally, install it with:
mod config recipes npm install @openrewrite/recipes-reactOptions
| Name | Type | Description |
|---|---|---|
componentNamerequired | | The name of the React component to target e.g. Button |
propNamerequired | | The name of the prop whose value should be changed e.g. variant |
oldValue | | 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.e.g. outlined |
newValuerequired | | The new value to replace with. Can use $1, $2, etc. to reference capture groups if regex is true.e.g. outlined-primary |
regex | | If true, oldValue is interpreted as a regex pattern. Capture groups can be referenced in newValue using $1, $2, etc. |