20 lines
534 B
JavaScript
20 lines
534 B
JavaScript
// @ts-check
|
|
import WebComponent from "../src/WebComponent.js";
|
|
|
|
export class HelloWorld extends WebComponent {
|
|
static properties = ["count", "emotion"];
|
|
|
|
onInit() {
|
|
this.props.count = 0;
|
|
this.onclick = () => ++this.props.count;
|
|
}
|
|
|
|
get template() {
|
|
const label = this.props.count ? `Clicked ${this.props.count}` : "World";
|
|
const emote = this.props.emotion === "sad" ? ". 😭" : "! 🙌";
|
|
|
|
return `<button id="btn">Hello ${label}${emote}</button>`;
|
|
}
|
|
}
|
|
|
|
customElements.define("hello-world", HelloWorld);
|