React/19/Replace Default Props

Last update

Dec 15, 2024

Replaces default props with ES6 default parameters.

Example

Before

const Button = ({ size, color }) => {
  return <button style={{ color, fontSize: size }}>Click me</button>;
};

Button.defaultProps = {
  size: "16px",
  color: "blue",
};

After

const Button = ({ size = "16px", color = "blue" }) => {
  return <button style={{ color, fontSize: size }}>Click me</button>;
};

Replaces default props with ES6 default parameters.

Example

Before

const Button = ({ size, color }) => {
  return <button style={{ color, fontSize: size }}>Click me</button>;
};

Button.defaultProps = {
  size: "16px",
  color: "blue",
};

After

const Button = ({ size = "16px", color = "blue" }) => {
  return <button style={{ color, fontSize: size }}>Click me</button>;
};

Build custom codemods

Use AI-powered codemod studio and automate undifferentiated tasks for yourself, colleagues or the community

Get Started Now