crap.js

const hyperx = require('hyperx')

const hx = hyperx((componentName, properties, children) => {
  return ['createElement', componentName, properties, children]
}, (children) => {
  return ['createFragment', children]
})

class Header {
  async fetch (ctx) {
    return {}
  }

  mapToChildProps (data) {
    return {}
  }

  render (data, children) {
    return `header ${children}`
  }
}

class Buttons {
  async fetch (ctx) {
    return {}
  }

  render (data) {
    return 'buttons'
  }
}

const result = hx`
  <Header>
    <Buttons />
    <Buttons />
    <Buttons />
  </Header>
`

console.log(result)