A transform that swaps one component for another

[simonhildebrandt]

I'd like to replace components in the output with others, so that I can add features to them.

eg. rect ➡ Rect, and I supply Rect, which provides a wrapped rect, with added features.

I didn't see a transform that seemed to do this - would it be quickest to write my own?

(Thanks for a terrific tool, BTW. 😄 )

[simonhildebrandt]

Here's what I hacked together - seems to work OK...

function replaceJSXTags(_config, options) {
  return {
    visitor: {
      JSXOpeningElement(path) {
        if (options[path.node.name.name]) {
          path.node.name.name = options[path.node.name.name];
        }
      },
      JSXClosingElement(path) {
        if (options[path.node.name.name]) {
          path.node.name.name = options[path.node.name.name];
        }
      }
    }
  }
}

module.exports = replaceJSXTags;

[gregberge]

Yeah seems good to me!

[simonhildebrandt]

Really? I assumed anyone who had ever written one of these would call it hot garbage. 😅