vel-child-component.js

// main.js

const vel = require('vel')
const testElement = require('./test-element')

const el = vel(function (h, state) {
  return h.html(`<div>
    <h1>clicked ${String(state.n)} times</h1>
    <button onclick=${onclick}>click me!</button>
    ${testElement(h, state, el)}
  </div>`)

  function onclick () {
    el({ n: state.n + 1 })
  }
})

document.querySelector('#content').appendChild(el({ n: 0 }))

// test-element.js

module.exports = function (h, state, el) {
  return h.html(`
    <button onclick=${onclick}>
      child button  adds two instead
    </button>
  `)

  function onclick () {
    el({ n: state.n + 2 })
  }
}