import { Component, ChangeDetectionStrategy, Input, HostListener, ChangeDetectorRef } from '@angular/core';

@Component({
  selector: 'ui-radio-button',
  templateUrl: 'radio-button.component.html',
  styleUrls: ['radio-button.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class UiRadioButtonComponent {
  @Input() value: any;

  get icon() {
    return this.checked ? 'radio_checked' : 'radio';
  }

  checked: boolean;

  private onChange = (v: any) => {};

  constructor(private cdr: ChangeDetectorRef) {}

  registerOnChange(fn: any) {
    this.onChange = fn;
  }

  valueChanged(value: any) {
    this.checked = value == this.value;
    this.cdr.markForCheck();
  }

  @HostListener('click')
  select() {
    this.onChange(this.value);
  }
}
