import {
  Component,
  input,
  output,
  HostListener
} from '@angular/core';
import { ThemeNodeDirective } from '../../../domains/theme';

@Component({
  selector: 'app-confirm-dialog',
  standalone: true,
  imports: [ThemeNodeDirective],
  templateUrl: './confirm-dialog.component.html',
  host: {
    style: 'display: contents;'
  }
})
export class ConfirmDialogComponent {
  title = input.required<string>();
  confirmLabel = input<string>('Confirm');
  cancelLabel = input<string>('Cancel');
  variant = input<'primary' | 'danger'>('primary');
  widthClass = input<string>('w-[320px]');
  confirmed = output<undefined>();
  cancelled = output<undefined>();

  @HostListener('document:keydown.escape')
  onEscape(): void {
    this.cancelled.emit(undefined);
  }
}
