Integrating with reactive system components

[dineug]

Project: lit-observable

import { defineComponent, html, observable } from '@dineug/lit-observable';

defineComponent('my-counter', {
  render() {
    const state = observable({ count: 0 });

    const onIncrement = () => {
      state.count++;
    };

    return () => html`
      <button @click=${onIncrement}>Increment</button>
      <span>${state.count}</span>
    `;
  },
});

const myCounter = document.createElement('my-counter');
document.body.appendChild(myCounter);