Render to and from AST

[yandeu]

Would be nice to convert Nano JSX to and from an AST.

const App = () => {
  return (
    <div>
      <h1 style="color: blue;">title</h1>
      <p>paragraph</p>
    </div>
  )
}

const tree = renderToTree(<App />)

// tree would be something like this:
{
  type: 'FC',
  name: 'App',
  children: [
    {
      type: 'html',
      name: 'div',
      children: [
        { type: 'html', name: 'h1', body: 'title', props: { style: 'color: blue;' } },
        { type: 'html', name: 'p', body: 'paragraph' }
      ]
    }
  ]
}

// modify the tree if needed and render it to html
const html = renderFromTree(tree)

[jcayzac]

If you followed the conventions of unifiedjs for the tree nodes and attributes, you could use all the plugins in that ecosystem to modify your tree.