Datepicker with custom ControlValueAccessor

@Component({
  selector: 'adm-datepicker',
  templateUrl: './datepicker.component.html',
  styleUrls: ['./datepicker.component.less'],
  providers: [
    {
      provide: NG_VALUE_ACCESSOR,
      useExisting: forwardRef(() => DatepickerComponent),
      multi: true,
    },
  ],
  // viewProviders: [
  //   {
  //     provide: ControlContainer,
  //     useFactory: (container: ControlContainer) => container,
  //     deps: [[ControlContainer, new Optional(), new Host(), new SkipSelf()]]
  //   }
  // ],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class DatepickerComponent implements OnInit, OnDestroy, ControlValueAccessor {
  onChange: (value: Date) => void;
  onTouched: () => void;

  @Input() maskConfig: TextMaskConfig = {
    mask: false
  };
  Icons = Icons;

  @ViewChild(BsDatepickerDirective, { static: true })
  protected bsDatepickerDirective: BsDatepickerDirective;
  /**
   * Filter on paste from clipboard
   */
  @Input() inputFilter: InputFilter;
  /**
   * Placeholder
   */
  @Input() placeholder: string;
  /**
   * Size of input field
   */
  @Input() nzSize: NzSizeLDSType = 'default';
  /**
   * Disable input field
   */
  @Input() disabled: boolean;
  /**
   * Config object for datepicker
   */
  @Input() bsConfig: Partial<BsDatepickerConfig> = {
    dateInputFormat: DateTimeFormat.DATE,
  };
  /**
   * Placement of a datepicker. Accepts: "top", "bottom", "left", "right"
   */
  @Input() placement: 'top' | 'bottom' | 'left' | 'right' = 'bottom';
  /**
   * Specifies events that should trigger. Supports a space separated list of
   * event names.
   */
  @Input() triggers: string = 'click';
  /**
   * Close datepicker on outside click
   */
  @Input() outsideClick: boolean = true;
  /**
   * A selector specifying the element the datepicker should be appended to.
   */
  @Input() container: string = 'body';
  /**
   * Close picker on click ESC button
   */
  @Input() outsideEsc: boolean = true;
  /**
   * Minimum date which is available for selection
   */
  @Input() minDate: Date;
  /**
   * Maximum date which is available for selection
   */
  @Input() maxDate: Date;
  /**
   * Minimum view mode : day, month, or year
   */
  @Input() minMode: BsDatepickerViewMode;
  /**
   * Disable Certain days in the week
   */
  @Input() daysDisabled: number[];
  /**
   * Disable specific dates
   */
  @Input() datesDisabled: Date[];
  /**
   * Enable specific dates
   */
  @Input() datesEnabled: Date[];
  /**
   * Date custom classes
   */
  @Input() dateCustomClasses: DatepickerDateCustomClasses[];
  /**
   * Emits an event when the datepicker is shown
   */
  @Output() onShown: EventEmitter<any> = new EventEmitter<any>();
  /**
   * Emits an event when the datepicker is hidden
   */
  @Output() onHidden: EventEmitter<any> = new EventEmitter<any>();
  value: Date;
  /**
   *
   */
  set bsValue(value: Date) {
    if(value !== this.value) {
      this.value = this.normalizeValue(value);

      // if (isNaN(this.value.getTime())) {
      //   this?.ngControl?.control?.setErrors({
      //     invalid: 'Неверный формат даты'
      //   });
      // } else {
      //   this?.ngControl?.control?.setErrors({ });
      // }
      //
      // this?.ngControl?.control?.setValue?.(this.value);
      // this?.ngControl?.control?.markAsTouched({ onlySelf: true });

      this.onChange?.(this.value);
    }
  }
  get bsValue(): Date {
    return this.value;
  }
  /**
   * Picker's value
   */
  /**
   * Returns whether or not the datepicker is currently being shown
   */
  get isOpen(): boolean {
    return this?.bsDatepickerDirective?.isOpen;
  }
  /**
   * Indicates whether datepicker's content is enabled or not
   */
  get isDisabled(): boolean {
    return this?.bsDatepickerDirective?.isDisabled;
  }
  set isDisabled(value: boolean) {
    this.bsDatepickerDirective.isDisabled = value;
  }

  constructor(
    protected bsLocaleService: BsLocaleService,
    protected cdr: ChangeDetectorRef,
    // @Optional() @Self() protected ngControl: NgControl,
  ) {
    // ngControl.valueAccessor = this;
  }

  ngOnDestroy(): void {
        throw new Error('Method not implemented.');
    }

  ngOnInit() {
    this.bsLocaleService.use('ru');

    // this?.ngControl?.control?.setValidators()
    // this?.ngControl?.valueChanges?.pipe?.(
    //   untilDestroyed(this)
    // ).subscribe(value => this.writeValue(value));
  }

  /**
   * Opens an element’s datepicker. This is considered a “manual” triggering of the datepicker.
   */
  show() {
    this?.bsDatepickerDirective?.show?.();
    this.detectChanges();
  }

  /**
   * Closes an element’s datepicker. This is considered a “manual” triggering of the datepicker.
   */
  hide() {
    this?.bsDatepickerDirective?.hide?.();
    this.detectChanges();
  }

  /**
   * Toggles an element’s datepicker. This is considered a “manual” triggering of the datepicker.
   */
  toggle() {
    this?.bsDatepickerDirective?.toggle?.();
    this.detectChanges();
  }

  detectChanges() {
    this.cdr.markForCheck();
  }

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

  registerOnTouched(fn: any): void {
    this.onTouched = fn;
  }

  setDisabledState(isDisabled: boolean): void {
    this.disabled = isDisabled;
    this.isDisabled = isDisabled;

    this.detectChanges();
  }

  protected normalizeValue(value: Date) {
    if (value) {
      return typeof value === 'string' ? new Date(value) : value;
    }

    return null;
  }

  writeValue(value: Date): void {
    if(value !== this.value) {
      this.value = this.normalizeValue(value);
      this.detectChanges();
    }
  }

  @HostListener('blur')
  onBlur() {
    this?.onTouched?.();
    // this?.ngControl?.control?.markAsTouched({ onlySelf: true });
  }
}