import {Component, EventEmitter, Input, Output} from '@angular/core';
import {NgClass} from '@angular/common';

type ToggleButtonKind = "local" | "outside";

@Component({
  selector: 'app-toggle-button',
  imports: [
    NgClass
  ],
  templateUrl: './toggle-button.html',
  styleUrl: './toggle-button.scss'
})
export class ToggleButton {
  @Input() label: string = "(sans label)";
  @Input() kind: ToggleButtonKind = "local";
  @Input() active: boolean = false;
  @Input() icon: string = "";
  @Input() tooltip: string = "";
  @Output() stateChanged = new EventEmitter<boolean>();

  toggleState() {
    this.active = !this.active;
    this.stateChanged.emit(this.active);
  }
}
