I have a wordpress backend which powers a react front end.

In my wordpress backend, I am trying to build the capability to define pages of react code which I can then dynamically render on the front end. I've figured most of the process out, parsing the HTML of the page with Cheerio and then turning that into react components (using a lookup table with a library of react components and returning the one set on the page).

However, my next goal is to handle more difficult cases, such as JSX style definitions:

<ComponentA
   otherComponents={[<CompB />, <CompC />] />
   

Code like this won't play well with a HTML Parsing library such as cheerio. I am trying to figure out how I can get this to some sort of 'object' form so I can understand it on the javascript side. Prior, cheerio allowed me to parse through each parent and child.

Are there any good Text->JSX Tools available which might assist with this? I realistically don't need JSX, I just need to be able to parse it from text to then dynamically generate my react components