const { h, app, onRemove } = closures;

function App() {
  return (
    h('div.monospace',
      h('h1', 'A simple app'),
      h(Counter, { initialCount: 0 })
    )
  );
}

// simple components
function Double({ count }) {
  return h('h2', count * 2);
}

// stateful components
function Counter({ initialCount }) {
  let count = initialCount;

  onRemove(() => {
    console.log('Unmounted Counter');
  });

  return () => [
    h('h2', count),
    h('h3', 'doubled:'),
    h(Double, { count }),
    h('button', { onclick: () => count += 1 }, 'increment')
  ];
}

app(h(App), document.body);