feat: conditionally replace JSX attributes only when new value is defined

[codergon]

Summary

This PR improves JSX attribute replacement by ensuring that attributes are only replaced when the new value is defined. Previously, attributes such as fill were always replaced with props.fill, leading to unintended behavior when props.fill was undefined.

Motivation

• While working on a React Native app, I had the following configuration in my .svgrc file:

  {
    "replaceAttrValues": {
      "white": "{props.fill}"
    }
  }

• I wanted to use a transformed SVG that had two colors. However, when passing a color like <MySvgIcon fill="red" />, both colors in the SVG were replaced with "red" instead of preserving their distinct values.

• When not passing a color (which is what I intended), undefined was assigned to fill, causing the SVG to render incorrectly.

Test Plan

• Verified that attributes are only replaced when a new value is defined.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
svgr	❌ Failed (Inspect)			Mar 6, 2025 1:58pm