CounterComponent

counterComponent.ts

import { bootstrap, Component, rValue, createComponent } from 'revact';

class Counter extends Component {
  reactive = {
    counter: rValue(0)
  } 

  template = {
    tag: "span",
    textValue: this.reactive.counter,
    listeners: {
      click: () => {
        this.reactive.counter.value++
      }
    }
  }
}

function createCounter() {
  return createComponent(Counter)
}

bootstrap('#first', createCounter)
bootstrap('#second', () => ({
  tag: "div",
  children: [
    {
      tag: "textNode",
      textValue: "Counter:"
    },
    createCounter(),
  ]
}))