import { Maybe } from '@/core';
import { UikitLabelComponent } from '@/uikit';
import { Component, Input } from '@angular/core';
import { FormControl } from '@angular/forms';

@Component({
  selector: 'app-checkbox',
  templateUrl: 'checkbox.component.html',
  imports: [UikitLabelComponent],
})
export class AppCheckboxComponent {
  @Input({ required: true }) control!: FormControl<Maybe<any>>;
  @Input({ required: true }) name!: string;
  @Input({ required: true }) label!: string;
  @Input() disabled = false;
  @Input() size?: 'small' | 'large';
  @Input() showErrors = true;
  @Input() hint?: string;

  get checked() {
    return this.control.value === 'true' || this.control.value === true;
  }

  onChange(checked: boolean) {
    this.control.setValue(checked ? 'true' : 'false');
    this.control.markAsDirty();
    this.control.markAsTouched();
  }
}
