npm - @colijnit/corecomponents_v12 - Versions diffs - 12.2.25 → 12.2.27 - Mend

@colijnit/corecomponents_v12 12.2.25 → 12.2.27

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1276) hide show

package/projects/corecomponents/src/lib/components/base/base-input.component.ts DELETED Viewed

@@ -1,988 +0,0 @@
-import {
-  AfterViewInit,
-  ChangeDetectorRef,
-  ComponentFactory,
-  ComponentFactoryResolver,
-  ComponentRef, ContentChild,
-  Directive,
-  ElementRef,
-  EventEmitter,
-  HostBinding,
-  HostListener,
-  Injectable,
-  Input,
-  OnDestroy,
-  OnInit,
-  Optional,
-  Output,
-  ViewChild,
-  ViewContainerRef
-} from "@angular/core";
-import {AsyncValidatorFn, FormControl, NgModel, ValidatorFn} from "@angular/forms";
-import {isNill} from "../../core/function/is-nill.function";
-import {notNill} from "../../core/function/not-nill.function";
-import {InputBoolean, InputBooleanDecorator} from "../../core/decorator/input-boolean.decorator";
-import {requiredValidator} from "../../core/validator/required.validator";
-import {precisionScaleValidator} from "../../core/validator/precision-scale.validator";
-import {maxStringLengthValidator} from "../../core/validator/max-string-length.validator";
-import {StringUtils} from "../../core/utils/string-utils";
-import {Subscription} from "rxjs";
-import {FormInputUserModelChangeListenerService} from "../../core/service/form-input-user-change-listener.service";
-import {NumberUtils} from "../../core/utils/number-utils";
-import {NgZoneWrapperService} from "../../core/service/ng-zone-wrapper.service";
-import {CoreComponentsIcon} from "../../core/enum/core-components-icon.enum";
-import {FormComponent} from "../form/form.component";
-import {ValidationErrorComponent} from "../validation-error/validation-error.component";
-import {ScreenConfigAdapterComponent} from "../../interfaces/screen-config-adapter.component.interface";
-import {OverlayService} from '../../service/overlay.service';
-import {CommitButtonsComponent} from './commit-buttons/commit-buttons.component';
-/**
- * Abstract base class for all concrete form input components that contain a native <input> element. Provides common data and functionality, such as
- * adding self as a control to the parent form.
- */
-@Directive()
-@Injectable()
-export abstract class BaseInputComponent<T> implements OnInit, OnDestroy, AfterViewInit, ScreenConfigAdapterComponent {
-  public readonly icons: typeof CoreComponentsIcon = CoreComponentsIcon;
-  @ViewChild("validationError", {read: ViewContainerRef})
-  public validationErrorContainer: ViewContainerRef;
-  @ViewChild(NgModel, {static: true})
-  public _ngModel: NgModel;
-  public get ngModel(): NgModel {
-    if (this._myFormInputInstance) {
-      return this._myFormInputInstance.ngModel;
-    } else {
-      return this._ngModel;
-    }
-  }
-  public static BaseFormInputComponentIndex: number = 0;
-  public static HiddenClass: string = "hidden";
-  @Input()
-  public showSaveCancel: boolean = false;
-  @Input()
-  public set model(value: T) {
-    if (!this._initialModelSet) {
-      this._initialModel = this._model;
-      this._initialModelSet = true;
-    }
-    this._model = value;
-    this.canSaveOrCancel = this._model !== this._initialModel;
-    this._modelDirtyForCommit = this._model !== this._initialModel;
-    this._clearErrorComponent();
-    this.modelSet();
-  }
-  public get model(): T {
-    return this._model;
-  }
-  @Input()
-  public label: string;
-  @Input() @InputBoolean()
-  public noValidation: boolean = false;
-  @Input() @InputBoolean()
-  public initFocus: boolean;
-  @Input() @InputBoolean()
-  public noClickFocus: boolean;
-  // used to link field to business object for deep-validation
-  @Input()
-  public businessObjectId: any;
-  // @Input()
-  // public errorMessage: ValidationMessage;
-  public name: string;
-  @Input()
-  public set disabled(disabled: boolean) {
-    if (disabled === this._disabled) {
-      return;
-    }
-    this._disabled = InputBooleanDecorator.InputValueToBoolean(disabled);
-    this._updateControlValidatorsAndOwnFlags();
-  }
-  public get disabled(): boolean {
-    return this._disabled;
-  }
-  @Input()
-  public set maxLength(maxLength: number) {
-    this.setMaxLength(maxLength);
-  }
-  public get maxLength(): number {
-    return notNill(this.forcedMaxLength) ? this.forcedMaxLength : this._maxLength;
-  }
-  @Input()
-  public forcedMaxLength: number;
-  @Input()
-  public set readonly(readonly: boolean) {
-    if (this._forceReadonly !== undefined || readonly === this._readonly) {
-      return;
-    }
-    this._readonly = InputBooleanDecorator.InputValueToBoolean(readonly);
-    this._updateControlValidatorsAndOwnFlags();
-    if (this._hasOnPushCdStrategy) {
-      this.detectChanges();
-    }
-  }
-  public get readonly(): boolean {
-    return this.forceReadonly || this._readonly;
-  }
-  @Input()
-  public set forceReadonly(forceReadonly: boolean) {
-    if (forceReadonly === this._forceReadonly) {
-      return;
-    }
-    this._forceReadonly = InputBooleanDecorator.InputValueToBoolean(forceReadonly);
-    this._updateControlValidatorsAndOwnFlags();
-  }
-  public get forceReadonly(): boolean {
-    return this._forceReadonly;
-  }
-  @Input()
-  public set required(required: boolean) {
-    if (required === this._required) {
-      return;
-    }
-    this._required = InputBooleanDecorator.InputValueToBoolean(required);
-    this._updateControlValidatorsAndOwnFlags();
-  }
-  public get required(): boolean {
-    return this.forceRequired || this._required;
-  }
-  @Input() @InputBoolean()
-  public forceRequired: boolean = false;  // a force outside of [cfgName]'s influence
-  @Input()
-  public set validators(validators: ValidatorFn[]) {
-    if (validators === this._validators) {
-      return;
-    }
-    this._validators = validators;
-    this._updateControlValidatorsAndOwnFlags();
-  }
-  public get validators(): ValidatorFn[] {
-    return this._validators;
-  }
-  @Input()
-  public set asyncValidators(validators: AsyncValidatorFn[]) {
-    this._asyncValidators = validators;
-    this._updateControlValidatorsAndOwnFlags();
-  }
-  public get asyncValidators(): AsyncValidatorFn[] {
-    return this._asyncValidators;
-  }
-  @Input() @HostBinding("class." + BaseInputComponent.HiddenClass)
-  public set hidden(hidden: boolean) {
-    if (hidden === this._hidden) {
-      return;
-    }
-    this._hidden = hidden;
-    this._addOrRemoveSelfFromForm();
-    if (!this._destroyed) {
-      if (hidden) {
-        this.changeDetector.detach();
-      } else {
-        this.changeDetector.reattach();
-        if (this._hasOnPushCdStrategy) {
-          this.detectChangesAfterAngular();
-        }
-      }
-    }
-    this.hiddenChange.emit(hidden);
-  }
-  public get hidden(): boolean {
-    return this._hidden;
-  }
-  // no custom setter logic as with the other 'screen config props', because concrete form input components handle this themselves.
-  @Input()
-  public set decimals(value: number) {
-    this._decimals = value;
-  }
-  public get decimals(): number {
-    return this._decimals;
-  }
-  @Input()
-  public icon: CoreComponentsIcon;
-  @Input()
-  public customCssClass: string;
-  // Goal: ability to emulate the red background of input fields (form-submitted invalid state)
-  @Input() @HostBinding("class.cc-red-error-background")
-  public redErrorBackground: boolean = false;
-  @Input()
-  set myFormInputInstance(value: BaseInputComponent<T>) {
-    if (value === this._myFormInputInstance) {
-      return;
-    }
-    this._myFormInputInstance = value;
-    this._updateControlValidatorsAndOwnFlags();
-  }
-  get myFormInputInstance(): BaseInputComponent<T> {
-    return this._myFormInputInstance;
-  }
-  @Input()
-  public commitOnBlur: boolean = true;
-  // @Output()
-  // public commit: EventEmitter<any> = new EventEmitter<any>();
-  @Output()
-  public readonly nativeBlur: EventEmitter<any> = new EventEmitter();
-  @Output()
-  public readonly blur: EventEmitter<any> = new EventEmitter();
-  // emits when the enter button on keyboard was pressed while this form input had focussed
-  @Output()
-  public readonly enter: EventEmitter<any> = new EventEmitter();
-  @Output()
-  public readonly focus: EventEmitter<any> = new EventEmitter();
-  @Output()
-  public readonly keyDown: EventEmitter<any> = new EventEmitter();
-  @Output()
-  public readonly keyUp: EventEmitter<any> = new EventEmitter();
-  @Output()
-  public readonly modelChange: EventEmitter<any> = new EventEmitter<any>();
-  @Output()
-  public readonly userModelChange: EventEmitter<any> = new EventEmitter<any>();
-  @Output()
-  public readonly hiddenChange: EventEmitter<boolean> = new EventEmitter<boolean>();
-  @HostBinding("class.cc-input-focused")
-  public focused: boolean = false;
-  public formComponent: FormComponent;
-  @HostBinding("class.form-input")
-  public formInput: boolean = true;
-  @Input() @InputBoolean() @HostBinding("class.custom-width")
-  public customWidth: boolean = false;
-  @Input() @InputBoolean() @HostBinding('class.custom-height')
-  public customHeight: boolean = false;
-  @Input() @InputBoolean()
-  public noTriangleGraphic: boolean = false;
-  @Input() @InputBoolean()
-  public keepFocussed: boolean = false;
-  @Input() @InputBoolean() @HostBinding("class.half-width")
-  public halfWidth: boolean = false;
-  @Input() @InputBoolean() @HostBinding("class.full-width-important")
-  public fullWidth: boolean = false;
-  @Input() @InputBoolean()
-  public excludeUserModelChange: boolean = false;
-  @Input() @InputBoolean()
-  public noFormGroupControl: boolean = false;
-  @HostBinding("class.form-submitted")
-  public get formSubmitted(): boolean {
-    return this.formComponent && this.formComponent.submitted;
-  }
-  @HostBinding("class.hasnolabel")
-  public get hasNoLabel(): boolean {
-    return isNill(this.label);
-  }
-  @HostBinding("class.hasvalue")
-  public get hasValue(): boolean {
-    return (!Array.isArray(this.model) && !!this.model || StringUtils.IsStringWithLength(this.model) || NumberUtils.IsNumber(this.model)) ||
-        (Array.isArray(this.model) && this.model.length > 0);
-  }
-  @HostBinding("class.invalid")
-  public get invalid(): boolean {
-    return this._checkState() && !this.control.valid;
-  }
-  @HostBinding("class.disabled")
-  public get isDisabled(): boolean {
-    return this._disabled;
-  }
-  @HostBinding("class.read-only")
-  public get isReadonly(): boolean {
-    return this.readonly;
-  }
-  @HostBinding("class.required")
-  public get isRequired(): boolean {
-    return this.required;
-  }
-  @HostBinding("class.cc-touched-invalid")
-  public get touchedInvalid(): boolean {
-    return this._controlExists() && this.control.touched && !this.control.valid;
-  }
-  @HostBinding("class.valid")
-  public get valid(): boolean {
-    return this._checkState() && this.control.valid;
-  }
-  @HostBinding("class.no-validation")
-  public get validationDisabled(): boolean {
-    return this.readonly || this.disabled || this.noValidation;
-  }
-  @HostListener("click", ["$event"])
-  onClick(event: MouseEvent): void {
-    if (this.canChange && !this.noClickFocus) {
-      this.requestFocus();
-      if (!this.excludeUserModelChange) {
-        this.markAsUserTouched();
-      }
-    }
-  }
-  @HostListener("focusin")
-  onFocusIn(): void {
-    if (!this.excludeUserModelChange) {
-      this.markAsUserTouched();
-    }
-  }
-  // @HostListener("document:scroll")
-  // public handleDocumentScroll(): void {
-  //   this._positionValidationError();
-  // }
-  // @HostListener("window:resize")
-  // public handleWindowResize(): void {
-  //   this._positionValidationError();
-  // }
-  @HostListener("keydown", ["$event"])
-  public handleKeyDown(event: KeyboardEvent): void {
-    this.keyDown.next(event);
-    if (this.showSaveCancel && this.canSaveOrCancel) {
-      this._handleKeyDown(event);
-    }
-    // this._positionValidationError();
-  }
-  public get canChange(): boolean {
-    return !this.readonly && !this.disabled;
-  }
-  public get control(): FormControl {
-    return this._myFormInputInstance ? this._myFormInputInstance.control : this.ngModel && this.ngModel.control;
-  }
-  public get formInputInstance(): BaseInputComponent<T> {
-    return this._myFormInputInstance || this;
-  }
-  public get isDestroyed(): boolean {
-    return this._destroyed;
-  }
-  public input: HTMLInputElement | HTMLTextAreaElement;
-  public keepFocus: boolean = false;
-  public set canSaveOrCancel(value: boolean) {
-    this._canSaveOrCancel = value;
-    if (this.showSaveCancel && this.focused && this._canSaveOrCancel) {
-      if (!this._commitButtonsComponentRef) {
-        this._commitButtonsComponentRef = this.overlayService.createComponent(CommitButtonsComponent,
-            {
-              parentForOverlay: this.elementRef,
-              committing: false,
-              commitFinished: false
-            }, {
-              commitClick: (event) => this._handleCommit(event),
-              cancelClick: (event) => this.cancelClick(event)
-            });
-      }
-    } else {
-      this.overlayService.removeComponent(this._commitButtonsComponentRef);
-      this._commitButtonsComponentRef = undefined;
-    }
-  }
-  public get canSaveOrCancel(): boolean {
-    return this._canSaveOrCancel;
-  }
-  // @implements ConfigurationAdapterComponent
-  public objectConfigName: string;
-  public validationError: string = "";
-  protected _markedAsUserTouched: boolean = false;
-  protected _destroyed: boolean = false;
-  protected _hasOnPushCdStrategy: boolean = false;
-  protected _model: T;
-  protected _modelDirtyForCommit: boolean = false;
-  protected _initialModel: T;
-  protected _initialModelSet: boolean = false;
-  private _myFormInputInstance: BaseInputComponent<T>;
-  private _errorValidationComponent: ComponentRef<ValidationErrorComponent>;
-  private _decimals: number;
-  private _hidden: boolean;
-  private _disabled: boolean;
-  private _maxLength: number;
-  private _readonly: boolean;
-  private _required: boolean;
-  private _forceReadonly: boolean = undefined;
-  private _validators: ValidatorFn[] = [];
-  private _asyncValidators: AsyncValidatorFn[] = [];
-  private _speechSub: Subscription;
-  private _modelChangeSub: Subscription;
-  private _formAnySubmitSub: Subscription;
-  private _formReadonlyChangeSub: Subscription;
-  private _clearMarkedAsUserTouchedSub: Subscription;
-  private _canSaveOrCancel: boolean = false;
-  private _commitButtonsComponentRef: ComponentRef<any>;
-  private _validationComponentRef: ComponentRef<any>;
-  constructor(
-    protected changeDetector: ChangeDetectorRef,
-    protected componentFactoryResolver: ComponentFactoryResolver,
-    protected overlayService: OverlayService,
-    @Optional() protected formUserChangeListener?: FormInputUserModelChangeListenerService,
-    @Optional() protected ngZoneWrapper?: NgZoneWrapperService,
-    @Optional() public elementRef?: ElementRef,
-  ) {
-    BaseInputComponent.BaseFormInputComponentIndex++;
-    this.name = BaseInputComponent.BaseFormInputComponentIndex.toString();
-    if (this.formUserChangeListener) {
-      this._clearMarkedAsUserTouchedSub = this.formUserChangeListener.clearAllMarkedAsUserTouched.subscribe(() => {
-        this._markedAsUserTouched = false;
-      });
-    }
-  }
-  ngOnInit(): void {
-    this._modelChangeSub = this.modelChange.subscribe((val: any) => {
-      this.model = val;
-    });
-  }
-  ngAfterViewInit(): void {
-    this._prepareInput();
-    this._updateControlValidatorsAndOwnFlags();
-    this._addOrRemoveSelfFromForm();
-    if (this.formComponent) {
-      this.readonly = this.readonly || this.formComponent.readonly;
-      this._formReadonlyChangeSub = this.formComponent.readonlyChange.subscribe((isFormReadonly: boolean) => {
-        this.readonly = isFormReadonly;
-      });
-    }
-    if (this.initFocus) {
-      setTimeout(this.requestFocus.bind(this));
-    }
-  }
-  ngOnDestroy(): void {
-    this._removeSelfFromForm();
-    if (this.input) {
-      this.input.removeEventListener('blur', (event) => this.doBlur(event));
-      this.input.removeEventListener('focus', (event) => this.doFocus(event));
-    }
-    this._destroyed = true;
-    this._clearErrorComponent();
-    // if (this.tooltipManager && this.elementRef) {
-    //     this.tooltipManager.destroyErrorTooltipOfElement(this.elementRef.nativeElement);
-    // }
-    if (this._modelChangeSub) {
-      this._modelChangeSub.unsubscribe();
-    }
-    if (this._speechSub) {
-      this._speechSub.unsubscribe();
-    }
-    if (this._formAnySubmitSub) {
-      this._formAnySubmitSub.unsubscribe();
-    }
-    if (this._formReadonlyChangeSub) {
-      this._formReadonlyChangeSub.unsubscribe();
-    }
-    if (this._clearMarkedAsUserTouchedSub) {
-      this._clearMarkedAsUserTouchedSub.unsubscribe();
-    }
-    // this._removeSelfFromForm();
-    this.elementRef = undefined;
-    this.changeDetector = undefined;
-    this.input = undefined;
-  }
-  // descendents should override this
-  public commit = async (model: any): Promise<boolean> => {
-    return Promise.resolve(true);
-  }
-  public cancelClick(event?: MouseEvent): void {
-    this.keepFocus = true;
-    if (this._initialModelSet) {
-      this.model = this._initialModel;
-    }
-    this.keepFocus = false;
-  }
-  public showValidationError(error: string): void {
-    this.validationError = error;
-    this._validationComponentRef = this.overlayService.createComponent(ValidationErrorComponent, {parentForOverlay: this.elementRef, error: error});
-  }
-  /**
-   * Emits a modelChange event with given value, indicating that the model of this form input
-   * has changed and its new value is given value. Also emits userModelChange if markedAsUserTouched.
-   */
-  public setModel(value: any): void {
-    this.model = value;
-    this.modelChange.emit(value);
-    if (this.control) {
-      this.control.markAsDirty({onlySelf: true});
-    }
-    if (this.formComponent) {
-      this.formComponent.formGroup.markAsDirty({onlySelf: true});
-    }
-    if (this._markedAsUserTouched && this.formUserChangeListener) {
-      this.formUserChangeListener.userModelChange.next(value);
-      this.userModelChange.next(value);
-    }
-    if (this._hasOnPushCdStrategy) {
-      this.detectChanges();
-    }
-  }
-  public requestFocus(): void {
-    if (this.canChange && this.input) {
-      this.input.focus();
-      this.focused = true;
-      if (this._hasOnPushCdStrategy) {
-        this.markForCheck();
-      }
-    }
-  }
-  public doFocus(event?: any): any {
-    if (this.disabled) {
-      return;
-    }
-    this._initialModelSet = false;
-    this.focused = true;
-    this.canSaveOrCancel = false;
-    if (this._hasOnPushCdStrategy) {
-      this.markForCheck();
-    }
-    this.focus.next();
-  }
-  public async doBlur(event?: any, handleCommit: boolean = true): Promise<any> {
-    if (this.showSaveCancel && handleCommit && this._modelDirtyForCommit) {
-      await this._handleCommit(event, false);
-    }
-    setTimeout(() => {
-      if (this.keepFocus || this.keepFocussed) {
-        if (event) {
-          event.preventDefault;
-        }
-        return false;
-      }
-      this.focused = false;
-      if (this._hasOnPushCdStrategy) {
-        this.markForCheck();
-      }
-      if (this.input) {
-        this.input.blur();
-      }
-      this.blur.next();
-    }, 200);
-  }
-  public detectChanges(): void {
-    if (!this._destroyed) {
-      this.changeDetector.detectChanges();
-    }
-  }
-  public markForCheck(): void {
-    if (!this._destroyed) {
-      this.changeDetector.markForCheck();
-    }
-  }
-  public detectChangesAfterAngular(): void {
-    if (!!this.ngZoneWrapper) {
-      this.ngZoneWrapper.setTimeoutOutsideAngular(() => {
-        if (!this._destroyed) {
-          if (this._hasOnPushCdStrategy) {
-            this.changeDetector.markForCheck();
-          }
-          this.changeDetector.detectChanges();
-        }
-      });
-    }
-  }
-  /**
-   * Links the given formComp.submit event to the firing of detectChanges() of given change detector. This is a 'utility-like' method,
-   * but we manage the actual subscription (with UNSUBSCRIBE()!) on this base class.
-   * @param formComp The form whose submit we want to link with the call of .detectChanges() on given change detector ref.
-   * @param changeDetectorRef This should be given as param. I choose not to make this part of our (BaseFormInputComponent) constructor,
-   * because we already have 21 extenders.
-   */
-  // public linkFormAnySubmitWithDetectChanges(formComp: FormComponent, changeDetectorRef: ChangeDetectorRef): void {
-  //     if (formComp && changeDetectorRef) {
-  //         this._formAnySubmitSub = formComp.anySubmit.subscribe((() => {
-  //             if (!this._destroyed) {
-  //                 changeDetectorRef.detectChanges();
-  //             }
-  //         }));
-  //     }
-  // }
-  public markAsUserTouched(): void {
-    this._markedAsUserTouched = true;
-    this.redErrorBackground = false; // not sure if this is the right place to do that
-  }
-  public clearMarkedAsUserTouched(): void {
-    this._markedAsUserTouched = false;
-  }
-  protected modelSet(): void {
-  }
-  //used for descendents, because descendents can't set super properties, see InputNumberComponent
-  protected setMaxLength(maxLength: number): void {
-    if (notNill(this.forcedMaxLength) || maxLength === this._maxLength) {
-      return;
-    }
-    if (!isNaN(maxLength)) {
-      this._maxLength = maxLength;
-      this._updateControlValidatorsAndOwnFlags();
-    }
-  }
-  protected _markAsOnPush(): void {
-    this._hasOnPushCdStrategy = true;
-  }
-  protected _checkState(): boolean {
-    if (this.ngModel) {
-      return this.formSubmitted || (this._controlExists() && this.control.touched);
-    } else {
-      return false;
-    }
-  }
-  // Place validators onto our Angular's FormControl.
-  protected _updateControlValidatorsAndOwnFlags(): void {
-    const er: ElementRef = this.myFormInputInstance ? this.myFormInputInstance.elementRef : this.elementRef;
-    // if (this.tooltipManager && er) {
-    //     this.tooltipManager.destroyErrorTooltipOfElement(er.nativeElement);
-    // }
-    this._setNativeRequired(this.required);
-    this._setNativeMaxLength(this.maxLength);
-    this._setNativeDisabled(this.disabled);
-    this._setNativeReadOnly(this.readonly || this.forceReadonly);
-    this.redErrorBackground = false;
-    if (this._controlExists()) {
-      const validators: ValidatorFn[] = [];
-      // add required
-      if (this.required) {
-        validators.push(requiredValidator);
-      }
-      // add maxlength
-      if (notNill(this._maxLength)) {
-        if (this.decimals) {
-          validators.push(precisionScaleValidator(this._maxLength, this.decimals));
-        } else {
-          validators.push(maxStringLengthValidator(this._maxLength));
-        }
-      }
-      // add @Input()-ed validators
-      validators.push(...this._validators);
-      if (this._validators) {
-        this._validators.forEach(validator => {
-          if (validator === requiredValidator) {
-            this._required = true;
-            this._setNativeRequired(true);
-          }
-        });
-      }
-      this.control.setValidators(validators);
-      this.control.setAsyncValidators(this._asyncValidators);
-      this.control.updateValueAndValidity();
-    }
-  }
-  private async _handleCommit(event?: MouseEvent, doBlur: boolean = true): Promise<boolean> {
-    if (!this.showSaveCancel || (!this._modelDirtyForCommit)) {
-      return true;
-    }
-    this.keepFocus = true;
-    if (this._commitButtonsComponentRef) {
-      this._commitButtonsComponentRef.instance.commitFinished = false;
-      this._commitButtonsComponentRef.instance.committing = true;
-    }
-    this._modelDirtyForCommit = false;
-    const success: boolean = await this.commit(this.model);
-    this.keepFocus = false;
-    await this._commitFinished();
-    if (success && doBlur) {
-      this.doBlur(event, false);
-    }
-    return success;
-  }
-  private _commitFinished(): Promise<void> {
-    return new Promise((resolve: Function) => {
-      if (this._commitButtonsComponentRef) {
-        this._commitButtonsComponentRef.instance.commitFinished = true;
-        this._commitButtonsComponentRef.instance.committing = false;
-        setTimeout(() => {
-          // this._commitButtonsComponentRef.instance.commitFinished = false;
-          this.overlayService.removeComponent(this._commitButtonsComponentRef);
-          resolve();
-        }, 800);
-      } else {
-        resolve();
-      }
-    });
-  }
-  private _clearErrorComponent(): void {
-    this.overlayService.removeComponent(this._validationComponentRef);
-  }
-  // whether this.ngModel.control has safe access
-  private _controlExists(): boolean {
-    return this.ngModel && !!this.control;
-  }
-  private _controlIsValid(): boolean {
-    return this._controlExists() && this.control.valid;
-  }
-  private _setNativeDisabled(disabled: boolean): void {
-    if (this.input) {
-      this.input.disabled = disabled;
-    }
-  }
-  private _setNativeMaxLength(maxlength: number): void {
-    if (this.input && !isNaN(maxlength)) {
-      this.input.maxLength = maxlength;
-    }
-  }
-  protected _setNativeReadOnly(readonly: boolean): void {
-    if (this.input) {
-      this.input.readOnly = readonly;
-    }
-  }
-  private _setNativeRequired(required: boolean): void {
-    if (this.input) {
-      this.input.required = required;
-    }
-  }
-  private _subscribeToSpeechInput(): void {
-    // this._speechSub = this.speechInput.speechInput.subscribe((data) => {
-    //     if (this.focused && this._controlExists()) {
-    //         const val: string = this.control.value;
-    //         this.setModel((StringUtils.IsString(val) ? val : '') + data);
-    //     }
-    // });
-  }
-  private _addOrRemoveSelfFromForm(): void {
-    if (this.hidden) {
-      this._removeSelfFromForm();
-    } else {
-      this._addSelfToForm();
-    }
-  }
-  private _updateSelfInForm(): void {
-    if (this.formComponent) {
-      this.formComponent.updateFormInput(this);
-    }
-  }
-  private _removeSelfFromForm(): void {
-    if (this.formComponent && this.ngModel) {
-      this.formComponent.removeFormInput(this);
-    }
-  }
-  private _addSelfToForm(): void {
-    if (this.formComponent && this.ngModel && !this.noFormGroupControl) {
-      this.formComponent.removeFormInput(this); // preventing there are two controls in formgroup when myFormInputInstance is (being) set
-      this.formComponent.addFormInput(this.myFormInputInstance ? this.myFormInputInstance : this);
-    }
-  }
-  private _prepareInput(): void {
-    if (this.elementRef && this.elementRef.nativeElement) {
-      //try to find input element
-      this._findInputNode(this.elementRef.nativeElement.children);
-      if (this.input) {
-        this.input.addEventListener('blur', (event) => this.doBlur(event));
-        this.input.addEventListener('focus', (event) => this.doFocus(event));
-      }
-    }
-  }
-  private _findInputNode(nodes): void {
-    for (let i = 0; i < nodes.length; i++) {
-      const node = nodes[i];
-      if (node instanceof HTMLInputElement || node instanceof HTMLTextAreaElement) {
-        this.input = node;
-        break;
-      } else if (node.children.length > 0) {
-        this._findInputNode(node.children);
-      }
-    }
-  }
-  private _positionValidationError(): void {
-    if (this.elementRef && this.elementRef.nativeElement && this._errorValidationComponent) {
-      const clientRect: ClientRect = this.elementRef.nativeElement.getBoundingClientRect();
-      this._errorValidationComponent.instance.top = clientRect.bottom;
-      this._errorValidationComponent.instance.left = clientRect.left;
-    }
-  }
-  protected async _handleKeyDown(event: KeyboardEvent): Promise<any> {
-    switch (event.code) {
-      case 'Enter':
-      case 'NumpadEnter':
-        if (!event.shiftKey) {
-            event.preventDefault();
-            await this._handleCommit();
-            return false;
-        }
-        return true;
-      case 'Tab':
-        const nextSiblingToFocus = event.shiftKey ? (event.currentTarget as any).previousSibling : (event.currentTarget as any).nextSibling;
-        event.preventDefault();
-        const success: boolean = await this._handleCommit();
-        if (success) {
-          if (nextSiblingToFocus) {
-            try {
-              this._setFocusOnNextPossibleInput(nextSiblingToFocus, event.shiftKey);
-            } catch (e) {
-            }
-          }
-        }
-        return false;
-      case 'Escape':
-        this.cancelClick();
-        event.preventDefault();
-        return false;
-    }
-  }
-  private _createNewFocusEvent(element: any): Event {
-    let eventType = "onfocusin" in element ? "focusin" : "focus",
-      bubbles = "onfocusin" in element,
-      focusEvent;
-    if ("createEvent" in document) {
-      focusEvent = document.createEvent("Event");
-      focusEvent.initEvent(eventType, bubbles, true);
-    } else if ("Event" in window) {
-      focusEvent = new Event(eventType, { bubbles: bubbles, cancelable: true });
-    }
-    return focusEvent;
-  }
-  private _setFocusOnNextPossibleInput(element: any, previous: boolean): void {
-    let elementColl = element.getElementsByTagName('input');
-    if (!elementColl || elementColl.length < 1) {
-     elementColl = element.getElementsByTagName('textarea');
-    }
-    if (elementColl && elementColl.length > 0) {
-      const inputElement = elementColl[0];
-      if (inputElement.disabled || inputElement.readOnly) {
-        this._setFocusOnNextPossibleInput(previous ? element.previousSibling : element.nextSibling, previous);
-      } else {
-        const focusEvent = this._createNewFocusEvent(element);
-        inputElement.focus();
-        inputElement.dispatchEvent(focusEvent);
-      }
-    }
-  }
-}