// counter.component.ts
import { Component } from '@angular/core';

@Component({
  selector: 'app-counter',
  standalone: true,
  template: `
    <p>Count: {{ count }}</p>
    <button (click)="increment()">+1</button>
    <button (click)="decrement()">-1</button>
    <button (click)="reset()">Reset</button>
  `,
})
export class CounterComponent {
  count = 0;

  increment() {
    this.count++;
  }

  decrement() {
    this.count--;
  }

  reset() {
    this.count = 0;
  }
}

/*
  Notes:
  - Each button is event-bound to its own method — increment(),
    decrement(), reset() — exactly mirroring the three separate
    handlers in the equivalent React Counter from Fundamentals Ch 3.
  - No setCount-style function exists here; methods just reassign
    this.count directly, and the template updates automatically.
*/