htm support

[ericclemmons]

In #16, I found that it's pretty trivial to automatically instrument https://github.com/developit/htm's vdom output to use benefit.

The rough code is:

  import { html, render } from 'https://unpkg.com/htm/preact/standalone.mjs';

  const { cx } = benefit()

  // ! TODO Make this a utility of benefit
  const styleWithHtml = (...args) => {
    const vdom = html(...args);

    (function replaceClassWithBenefit(vdom) {
      if (vdom.attributes && vdom.attributes.class) {
        vdom.attributes.class = cx(vdom.attributes.class)
      }

      if (vdom.children) {
        vdom.children.forEach((child) => replaceClassWithBenefit(child))
      }
    })(vdom);

    return vdom
  }

  const vdom = styleWithHtml`
    <main class="antialiased">Howdy</main>
  `

  render(vdom, document.body)

```

Obviously, what we'd like to do is have a wrapper kinda like:

```
import { html, render } from 'https://unpkg.com/htm/preact/standalone.mjs';
const { styleWithHtml } = benefit()

const styled = styleWithHtml(html)

const vdom = styled`...`
```