HTML

<bitty-7-0 data-connect="ClickCounter">
  <button data-use="count">Start Counting</button>
</bitty-7-0>

JavaScript

window.ClickCounter = class {
  #counter = 0;

  count(_, el) {
    this.#counter += 1;
    el.innerHTML = `Clicks: ${this.#counter}`;
  }
};

Notes

• This example shows how to keep track of values (aka maintaining state).

• The window.ClickCounter class defines a private field variable named #counter to keep track of the number of clicks.

• Each time the button is used the this.#counter += 1; lines adds one to the #coutner.

• Then, the el.innerHTML ... line displays update the button with the new value.