fancy-af-button-stencil.tsx

import { Component, Prop, h, Listen, State } from "@stencil/core";

@Component({
  tag: "fancy-af-button",
  styleUrl: "fancy-af-button.css",
  shadow: true
})
export class FancyAFButton {
  @State() clickedCount: number = 0;

  @Prop() title: string;

  @Listen("click", { capture: true })
  handleClick() {
    this.clickedCount += 1;
  }
  render() {
    return (
      <button>
        <span>{this.title}</span>
        <span> {this.clickedCount}</span>
      </button>
    );
  }
}