{"size": 759, "ext": "js", "max_stars_repo_path": "samples/getting-started/state-hooks/simple-counter-with-store.js", "max_stars_repo_name": "hofjs/hofjs.github.io", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "samples/getting-started/state-hooks/simple-counter-with-store.js", "max_issues_repo_name": "hofjs/hofjs.github.io", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "samples/getting-started/state-hooks/simple-counter-with-store.js", "max_forks_repo_name": "hofjs/hofjs.github.io", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 39.9473684211, "max_line_length": 90, "alphanum_fraction": 0.6455862978}
customElements.define("simple-counter", class extends HofHtmlElement {
    sharedCounter = counterStoreWithHooks;

    sharedCounterBeforePropertyChanged(newValue, oldValue) {
        return Math.random() < 0.5;
    }

    sharedCounterAfterPropertyChanged(property, newValue, oldValue) {
        console.log(`sharedCounter.${property} changed from ${oldValue} -> ${newValue}`);
    }

    templates = html`
        <div>Count: ${this.sharedCounter.count}</div>
        <div>Inverse count: ${-this.sharedCounter.count}</div>
        <div>Doubled count: ${this.sharedCounter.doubled}</div>
        <button onclick="${this.sharedCounter.increment}">++</button>
        <button onclick="${() => this.sharedCounter.count--}">--</button>
    `
})