D-Net

  SimpleChanges,

  ViewChild

} from "@angular/core";

import {HelperFunctions} from "../../utils/HelperFunctions.class";

import {Observable, of, Subscription} from "rxjs";

import {MatSelect} from "@angular/material/select";

                  </span>

                </mat-chip>

                <div [class.uk-hidden]="formControl.value" class="uk-width-expand uk-position-relative chip-input">

                         [matChipInputFor]="chipList" [matAutocompleteConnectedTo]="origin">

                  <div *ngIf="placeholder && !searchInput.value" class="placeholder uk-width-1-1"

                       (click)="searchInput.focus()">{{placeholder}}</div>

          <div [ngClass]="inputClass"

               [attr.uk-tooltip]="formControl.disabled?'title: This field is not editable; pos: bottom-left':null"

               [class.clickable]="formControl.enabled"

            <mat-form-field class="uk-width-1-1">

              <mat-chip-list #chipList>

                <mat-chip *ngFor="let chip of formAsArray.controls; let i=index" [selectable]="false"

                  </span>

                </mat-chip>

                <div class="uk-width-expand uk-position-relative chip-input">

                         [matChipInputFor]="chipList" [matAutocompleteConnectedTo]="origin"

                         [matChipInputAddOnBlur]="addExtraChips && searchControl.value"

                         (matChipInputTokenEnd)="add($event)">

  /** Textarea options */

  @Input('rows') rows: number = 3;

  /** Select | chips available options */

  @Input('hint') hint = null;

  @Input('placeholder') placeholder = '';

  @Input() inputClass: string = 'input-box';

  @Input() panelWidth: number = 300;

  @Input() panelClass: string = null;

  @Input() showOptionsOnEmpty: boolean = true;

  @Output() focusEmitter: EventEmitter<boolean> = new EventEmitter<boolean>();

  /** LogoUrl information */

  public secure: boolean = true;

      this.secure = (!this.initValue || this.initValue.includes('https://'));

    }

    if (this.type === 'chips' || this.type === 'autocomplete') {

        this.filteredOptions = of(this.options);

        this.subscriptions.push(this.searchControl.valueChanges.subscribe(value => {

          setTimeout(() => {

            this.searchInput.nativeElement.focus();

  }

  add(event: MatChipInputEvent) {

      this.stopPropagation();

      this.formAsArray.markAsDirty();

      this.searchControl.setValue('');

      this.searchInput.nativeElement.value = '';