replace-prop-value

replace-prop-value

This universal codemod provides possibility to replace any prop value in any component

import Component from "carbon-react/lib/components/component";

- <Component prop="something" />
+ <Component prop="something different" />

It's likely that props might be assigned in a different manners, therefore this codemod accounts for several prop patterns.

<Component prop="something" />

<Component prop={"something"} />

const value = "something";

<Component prop={value} />;

const props = { prop: "something" };

<Component {...props} />;

<Component {...{ prop: "something" }} />

const prop = "something";

<Component {...{ prop }} />;

const value = "something";

<Component {...{ prop: value }} />;

If there is a pattern that you use that is not transformed, please file a feature request.

Usage

Components imported as a default import:

npx carbon-codemod replace-prop-value <target> <component-import-path> <prop> <old-value> <new-value>

npx carbon-codemod replace-prop-value src carbon-react/lib/components/button prop oldValue newValue

Components imported as a named import:

npx carbon-codemod replace-prop-value <target> <component-import-path> <prop> <old-value> <new-value> -i <component-import-name>

npx carbon-codemod replace-prop-value src carbon-react/lib/components/accordion prop oldValue newValue -i Accordion

Note: To use a numeric value as a string as old-value or new-value, format it as \"string\" on the command line, i.e.:

npx carbon-codemod replace-prop-value src carbon-react/lib/components/tile padding \"2\" \"3\"

Examples

npx carbon-codemod replace-prop-value src carbon-react/lib/components/tile padding 2 4

npx carbon-codemod replace-prop-value src carbon-react/lib/components/tile padding XL 10px