@sumaris-net/ngx-components 2.6.4-alpha5 → 2.6.4-alpha6

package/src/app/shared/form/field.component.html

@@ -1,261 +0,0 @@
-<ng-container [ngSwitch]="type">
-
-  <!-- integer -->
-  <mat-form-field *ngSwitchCase="'integer'" [floatLabel]="floatLabel" [class]="classList">
-    <input matInput #matInput
-           type="number"
-           autocomplete="off"
-           [readonly]="readonly"
-           [min]="definition.minValue"
-           [max]="definition.maxValue"
-           pattern="-?[0-9]*"
-           step="1"
-           [appAutofocus]="autofocus"
-           [placeholder]="placeholder"
-           (keyup.enter)="onKeyupEnter.emit($event)"
-           (keypress)="filterNumberInput($event, false)"
-           [formControl]="formControl"
-           [required]="required"
-           [tabIndex]="tabindex"
-           (click)="selectInputContent($event)">
-    <mat-error *ngIf="formControl.hasError('required')" translate>ERROR.FIELD_REQUIRED</mat-error>
-    <mat-error *ngIf="formControl.hasError('min')">
-      {{(compact ? 'ERROR.FIELD_MIN_COMPACT' : 'ERROR.FIELD_MIN') | translate:formControl.errors['min'] }}</mat-error>
-    <mat-error *ngIf="formControl.hasError('max')">
-      {{(compact ? 'ERROR.FIELD_MAX_COMPACT' : 'ERROR.FIELD_MAX') | translate:formControl.errors['max'] }}</mat-error>
-    <mat-error *ngIf="formControl.hasError('pattern')">
-      {{'ERROR.FIELD_NOT_VALID_INTEGER'| translate }}</mat-error>
-    <mat-error *ngIf="formControl.hasError('integer')">
-      {{'ERROR.FIELD_NOT_VALID_INTEGER'| translate }}</mat-error>
-
-    <button matSuffix *ngIf="clearable"
-            mat-icon-button tabindex="-1"
-            type="button"
-            (click)="formControl.reset()"
-            [hidden]="formControl.disabled || (formControl|formGetValue|isNilOrBlank)">
-      <mat-icon>close</mat-icon>
-    </button>
-
-    <div matSuffix>
-      <ng-content select="[matSuffix]"></ng-content>
-    </div>
-  </mat-form-field>
-
-  <!-- double -->
-  <mat-form-field *ngSwitchCase="'double'" [floatLabel]="floatLabel" [class]="classList">
-
-    <input matInput #matInput
-           type="number"
-           decimal="true"
-           autocomplete="off"
-           [min]="definition.minValue"
-           [max]="definition.maxValue"
-           [appAutofocus]="autofocus"
-           [readonly]="readonly"
-           [placeholder]="placeholder"
-           [step]="numberInputStep"
-           (keypress)="filterNumberInput($event, true)"
-           [formControl]="formControl"
-           [required]="required"
-           [tabIndex]="tabindex"
-           (click)="selectInputContent($event)">
-    <mat-error *ngIf="formControl.hasError('required')" translate>ERROR.FIELD_REQUIRED</mat-error>
-    <mat-error *ngIf="formControl.hasError('decimal')" translate>ERROR.FIELD_NOT_VALID_DECIMAL</mat-error>
-    <mat-error *ngIf="formControl.hasError('min')">
-      {{ (compact ? 'ERROR.FIELD_MIN_COMPACT' : 'ERROR.FIELD_MIN')| translate:formControl.errors['min'] }}</mat-error>
-    <mat-error *ngIf="formControl.hasError('max')">
-      {{(compact ? 'ERROR.FIELD_MAX_COMPACT' : 'ERROR.FIELD_MAX') | translate:formControl.errors['max'] }}</mat-error>
-    <mat-error *ngIf="formControl.hasError('maxDecimals')">
-      {{ (compact ? 'ERROR.FIELD_MAXIMUM_DECIMALS_COMPACT' : 'ERROR.FIELD_MAXIMUM_DECIMALS')| translate:{maxDecimals:
-      definition.maximumNumberDecimals} }}</mat-error>
-
-    <button matSuffix *ngIf="clearable"
-            mat-icon-button tabindex="-1"
-            type="button"
-            (click)="formControl.reset()"
-            [hidden]="formControl.disabled || (formControl|formGetValue|isNilOrBlank)">
-      <mat-icon>close</mat-icon>
-    </button>
-    <div matSuffix>
-      <ng-content select="[matSuffix]"></ng-content>
-    </div>
-  </mat-form-field>
-
-  <!-- boolean -->
-  <mat-boolean-field *ngSwitchCase="'boolean'" #matInput
-                     [class]="classList"
-                     [formControl]="formControl"
-                     [placeholder]="placeholder"
-                     [floatLabel]="floatLabel"
-                     [required]="required"
-                     [compact]="compact"
-                     [tabindex]="tabindex"
-                     [readonly]="readonly">
-    <div matSuffix>
-      <ng-content select="[matSuffix]"></ng-content>
-    </div>
-  </mat-boolean-field>
-
-  <!-- date -->
-  <mat-date-field *ngSwitchCase="'date'" #matInput
-                  [class]="classList"
-                  [formControl]="formControl"
-                  [placeholder]="compact ? ('COMMON.DATE_PLACEHOLDER'|translate): placeholder"
-                  [floatLabel]="floatLabel"
-                  [required]="required"
-                  [clearable]="clearable"
-                  [readonly]="readonly"
-                  [compact]="compact"
-                  [tabindex]="tabindex"
-                  [autofocus]="autofocus">
-    <div matSuffix>
-      <ng-content select="[matSuffix]"></ng-content>
-    </div>
-  </mat-date-field>
-
-  <!-- date time -->
-  <mat-date-time-field *ngSwitchCase="'dateTime'" #matInput
-                       [class]="classList"
-                       [formControl]="formControl"
-                       [placeholder]="compact ? ('COMMON.DATE_TIME_PLACEHOLDER'|translate): placeholder"
-                       [floatLabel]="floatLabel"
-                       [required]="required"
-                       [clearable]="clearable"
-                       [readonly]="readonly"
-                       [compact]="compact"
-                       [tabindex]="tabindex"
-                       [autofocus]="autofocus">
-    <div matSuffix>
-      <ng-content select="[matSuffix]"></ng-content>
-    </div>
-  </mat-date-time-field>
-
-  <!-- enum -->
-  <mat-form-field *ngSwitchCase="'enum'" [floatLabel]="floatLabel" [class]="classList">
-    <mat-select [formControl]="formControl"
-                [placeholder]="placeholder"
-                [required]="required"
-                [tabindex]="tabindex"
-                (keyup.enter)="onKeyupEnter.emit($event)">
-      <mat-option *ngFor="let item of _values" [value]="item.key">{{ item.value | translate }}</mat-option>
-    </mat-select>
-
-    <mat-error *ngIf="formControl.hasError('required')" translate>ERROR.FIELD_REQUIRED</mat-error>
-
-    <div matSuffix>
-      <ng-content select="[matSuffix]"></ng-content>
-    </div>
-  </mat-form-field>
-
-  <!-- multi enum -->
-  <mat-chips-field *ngSwitchCase="'enums'"
-                   [class]="classList"
-                   [placeholder]="placeholder"
-                   [floatLabel]="floatLabel"
-                   [formControl]="formControl"
-                   [clearable]="clearable"
-                   [items]="_values"
-                   [displayAttributes]="definition.autocomplete?.attributes || ['key', 'value']"
-                   [config]="definition.autocomplete"
-                   [showAllOnFocus]="true"
-                   [required]="required"
-                   [chipColor]="chipColor">
-    <ng-content select="[matPrefix]"></ng-content>
-    <div matSuffix>
-      <ng-content select="[matSuffix]"></ng-content>
-    </div>
-  </mat-chips-field>
-
-  <!-- color -->
-  <mat-form-field *ngSwitchCase="'color'" [floatLabel]="floatLabel" [class]="classList">
-
-    <ion-icon margin-right name="color-fill" matPrefix></ion-icon>
-
-    <input matInput autocomplete="off"
-           [appAutofocus]="autofocus"
-           [formControl]="formControl"
-           [style.color]="getColorContrast(formControl.value)"
-           [style.background]="formControl.value"
-           [colorPicker]="formControl.value"
-           (colorPickerChange)="writeValue($event)"
-           [cpSaveClickOutside]="true"
-           cpPosition="top"
-           cpOutputFormat="hex"
-           [cpOKButton]="false"
-           [required]="required"/>
-    <mat-error *ngIf="formControl.hasError('required')" translate>ERROR.FIELD_REQUIRED</mat-error>
-  </mat-form-field>
-
-  <!-- string -->
-  <mat-form-field *ngSwitchCase="'string'" [floatLabel]="floatLabel" [class]="classList">
-    <input matInput #matInput
-           autocomplete="off"
-           [appAutofocus]="autofocus"
-           [formControl]="formControl"
-           [placeholder]="placeholder"
-           [required]="required"
-           [readonly]="readonly"
-           [tabIndex]="tabindex"
-           (click)="selectInputContent($event)"
-           (keypress)="filterAlphanumericalInput($event)"
-           (keyup.enter)="onKeyupEnter.emit($event)">
-    <mat-error *ngIf="formControl.hasError('required')" translate>ERROR.FIELD_REQUIRED</mat-error>
-
-    <button matSuffix *ngIf="clearable"
-            mat-icon-button tabindex="-1"
-            type="button"
-            (click)="formControl.reset()"
-            [hidden]="formControl.disabled || (formControl|formGetValue|isNilOrBlank)">
-      <mat-icon>close</mat-icon>
-    </button>
-
-    <div matSuffix>
-      <ng-content select="[matSuffix]"></ng-content>
-    </div>
-  </mat-form-field>
-
-  <!-- auto-complete -->
-  <mat-autocomplete-field *ngSwitchCase="'entity'"
-                          #autocompleteField
-                          [class]="classList"
-                          [autofocus]="autofocus"
-                          [placeholder]="placeholder"
-                          [floatLabel]="floatLabel"
-                          [formControl]="formControl"
-                          [config]="definition.autocomplete"
-                          [required]="required"
-                          [tabindex]="tabindex"
-                          [clearable]="clearable"
-                          (keyup.enter)="onKeyupEnter.emit($event)"
-                          [displayWith]="getDisplayValueFn(definition)">
-    <ng-content select="[matPrefix]"></ng-content>
-    <ng-content select="[matSuffix]"></ng-content>
-  </mat-autocomplete-field>
-
-  <!-- multi auto-complete -->
-  <mat-chips-field *ngSwitchCase="'entities'"
-                    [class]="classList"
-                    [placeholder]="placeholder"
-                    [floatLabel]="floatLabel"
-                    [formControl]="formControl"
-                    [config]="definition.autocomplete"
-                    [required]="required"
-                    [chipColor]="chipColor"
-                    [clearable]="clearable"
-                    [displayWith]="getDisplayValueFn(definition)">
-    <ng-content select="[matPrefix]"></ng-content>
-    <div matSuffix>
-      <ng-content select="[matSuffix]"></ng-content>
-    </div>
-  </mat-chips-field>
-
-  <!-- other -->
-  <div *ngSwitchDefault>
-    <mat-error *ngIf="type">Unknown type {{type}} for option {{definition.key}}. Please report this error.</mat-error>
-    <mat-error *ngIf="!type">Error on option field. Please check console log for details.</mat-error>
-    <div matSuffix>
-      <ng-content select="[matSuffix]"></ng-content>
-    </div>
-  </div>
-
-</ng-container>

package/src/app/shared/form/field.component.scss

@@ -1,7 +0,0 @@
-:host {
-  display: inline-block;
-  position: relative;
-}
-button[hidden] {
-  display: none;
-}

package/src/app/shared/form/field.component.ts

@@ -1,318 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  ChangeDetectorRef,
-  Component,
-  ElementRef,
-  EventEmitter,
-  forwardRef, InjectionToken, Injector,
-  Input,
-  OnInit,
-  Optional,
-  Output,
-  ViewChild
-} from '@angular/core';
-import {ControlValueAccessor, UntypedFormControl, FormGroupDirective, NG_VALUE_ACCESSOR, Validators} from '@angular/forms';
-import {FloatLabelType} from '@angular/material/form-field';
-import {arrayDistinct, isBlankString, isNilOrBlank, isNotEmptyArray, isNotNil, isNotNilBoolean, isNotNilOrBlank, joinPropertiesPath, toBoolean} from '../functions';
-import { DisplayFn, FormFieldDefinition, FormFieldType } from './field.model';
-import {TranslateService} from '@ngx-translate/core';
-import {getColorContrast} from '../graph/colors.utils';
-import {asInputElement, filterNumberInput, selectInputContent} from '../inputs';
-import {toDateISOString} from '../dates';
-import {Property} from '../types';
-import {ThemePalette} from '@angular/material/core';
-import {PredefinedColors} from '@ionic/core';
-import { MatAutocompleteField } from '../material/autocomplete/material.autocomplete';
-import {isNonEmptyArray} from '@apollo/client/utilities';
-
-const noop = () => {
-};
-
-@Component({
-  selector: 'app-form-field',
-  styleUrls: ['./field.component.scss'],
-  templateUrl: './field.component.html',
-  providers: [
-    {
-      provide: NG_VALUE_ACCESSOR,
-      useExisting: forwardRef(() => AppFormField),
-      multi: true
-    }
-  ],
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class AppFormField implements OnInit, ControlValueAccessor {
-
-  private _onChangeCallback: (_: any) => void = noop;
-  private _onTouchedCallback: () => void = noop;
-  private _definition: FormFieldDefinition;
-
-  protected _values: Property[];
-
-  protected type: FormFieldType;
-  protected numberInputStep: string;
-
-  @Input()
-  set definition(value: FormFieldDefinition) {
-    if (!value || this._definition === value) return; // Skip is same or nil
-    this._definition = value;
-    this._onDefinitionChanged(value);
-  }
-
-  get definition(): FormFieldDefinition {
-    return this._definition;
-  }
-
-  @Input() required: boolean;
-  @Input() readonly = false;
-  @Input() disabled: boolean;
-  @Input() formControl: UntypedFormControl;
-  @Input() formControlName: string;
-  @Input() placeholder: string;
-  @Input() compact = false;
-  @Input() floatLabel: FloatLabelType = 'auto';
-  @Input() tabindex: number;
-  @Input() autofocus: boolean;
-
-  @Input() clearable: boolean;
-  @Input() chipColor: ThemePalette | PredefinedColors = null;
-  @Input() debug = false;
-
-  @Input('class') classList: string;
-
-  @Output('keyup.enter')
-  onKeyupEnter = new EventEmitter<any>();
-
-  get value(): any {
-    return this.formControl.value;
-  }
-
-  @ViewChild('matInput') matInput: ElementRef;
-  @ViewChild('autocompleteField') autocompleteField: MatAutocompleteField;
-
-  constructor(
-    protected translate: TranslateService,
-    protected cd: ChangeDetectorRef,
-    protected injector: Injector,
-    @Optional() private formGroupDir: FormGroupDirective
-  ) {
-
-  }
-
-  ngOnInit() {
-
-    this.checkAndResolveFormControl();
-
-    if (!this._definition) throw new Error('Missing mandatory attribute \'definition\' in <app-form-field>.');
-    if (typeof this._definition !== 'object') throw new Error('Invalid attribute \'definition\' in <app-form-field>. Should be an object.');
-    this._onDefinitionChanged(this._definition, {emitEvent: false});
-
-  }
-
-  writeValue(obj: any): void {
-    if ((this.type === 'integer' || this.type === 'double') && Number.isNaN(obj)) {
-      // DEBUG
-      //if (this.debug) console.debug("WARN: trying to set NaN value, in an <app-form-field>! Reset to null");
-
-      obj = null;
-    }
-    else if (this.type === 'boolean' && typeof obj === 'string') {
-      obj = (obj !== 'false');
-    }
-    else if (this.type === 'date') {
-      obj = toDateISOString(obj);
-    }
-    else if (this.type === 'enums' && isNotNil(obj)) {
-      let changes = false;
-      if (typeof obj === 'string') {
-        obj = obj.split(',');
-        changes = true;
-      }
-      const updatedArray = (obj || []).map(item => {
-        if (typeof item === 'string') {
-          changes = true;
-          return this._values.find(v => v.key === item);
-        }
-        return item;
-      }).filter(isNotNil);
-      if (changes) {
-        obj = updatedArray;
-      }
-    }
-    else if (this.type === 'entity' && isNilOrBlank(obj)) {
-      obj = null;
-    }
-    if (obj !== this.formControl.value) {
-      // DEBUG
-      //if (this.debug) console.debug("Set <app-form-field> value: ", obj);
-
-      this.formControl.patchValue(obj, {emitEvent: false});
-      this._onChangeCallback(obj);
-    }
-
-    this.cd.markForCheck();
-  }
-
-  registerOnChange(fn: any): void {
-    this._onChangeCallback = fn;
-  }
-
-  registerOnTouched(fn: any): void {
-    this._onTouchedCallback = fn;
-  }
-
-  setDisabledState(isDisabled: boolean): void {
-    if (this.disabled === isDisabled) return;
-    this.disabled = isDisabled;
-    this.cd.markForCheck();
-  }
-
-  markAsTouched() {
-    if (this.formControl.touched) {
-      this.cd.markForCheck();
-      this._onTouchedCallback();
-    }
-  }
-
-  filterAlphanumericalInput(event: KeyboardEvent) {
-    if (event.keyCode === 13 /*=Enter*/ && this.onKeyupEnter.observers.length > 0) {
-      this.onKeyupEnter.emit(event);
-      return;
-    }
-    // Add features (e.g. check against a pattern)
-  }
-
-  focus() {
-    if (this.matInput) this.matInput.nativeElement.focus();
-    else if (this.autocompleteField) this.autocompleteField.focus();
-  }
-
-  filterNumberInput = filterNumberInput;
-  selectInputContent = selectInputContent;
-
-  getDisplayValueFn(definition: FormFieldDefinition): DisplayFn {
-    if (definition.autocomplete && definition.autocomplete.displayWith) {
-      return (obj: any) => definition.autocomplete.displayWith(obj);
-    }
-    const attributes = definition.autocomplete && definition.autocomplete.attributes || ['label', 'name'];
-    return (obj: any) => obj && joinPropertiesPath(obj, attributes);
-  }
-
-  getColorContrast(color: string): string | undefined {
-    return isNotNilOrBlank(color) ? getColorContrast(color, true) : undefined;
-  }
-
-  /**
-   * Allow to reload values, if not detected
-   * @param value
-   */
-  reloadItems(value?: any) {
-    if (!this._definition) return;
-
-    this._onDefinitionChanged(this._definition);
-
-    if (this.autocompleteField) {
-      setTimeout(() => this.autocompleteField?.reloadItems(value));
-    }
-  }
-
-  /* -- protected method -- */
-
-  protected computeNumberInputStep(definition: FormFieldDefinition): string {
-
-    if (definition.maximumNumberDecimals > 0) {
-      let step = '0.';
-      if (definition.maximumNumberDecimals > 1) {
-        for (let i = 0; i < definition.maximumNumberDecimals - 1; i++) {
-          step += '0';
-        }
-      }
-      step += '1';
-      return step;
-    } else {
-      return '1';
-    }
-  }
-
-  protected computeValuesFromToken(token: InjectionToken<(string|Property)[]>): any[] {
-    const values = this.injector.get(token);
-    return Array.isArray(values) ? this.computeValues(values) : [];
-  }
-
-  protected computeValues(values: (string|Property)[]): Property[] {
-    if (!values) return [];
-    return values.map(v =>  (typeof v === 'string')
-      ? <Property>{key: v, value: v}
-      : <Property>{key: v.key, value: this.translate.instant(v.value)}
-    );
-  }
-
-  protected checkAndResolveFormControl() {
-    if (this.formControl) return; // OK, there is a control
-
-    if (this.formGroupDir) {
-      // Try to find using definition.key, as formControlName
-      if (!this.formControlName && this._definition.key) {
-        this.formControlName = this._definition.key;
-      }
-      const formControlName = (this.formGroupDir.directives || []).find(d => this.formControlName && d.name === this.formControlName);
-      this.formControl = formControlName && formControlName.control;
-      if (!this.formControl) {
-        this.formControl = this.formGroupDir.form.get(this.formControlName) as UntypedFormControl;
-      }
-    }
-
-    if (!this.formControl) {
-      throw new Error('Missing attribute \'formControl\' or \'formControlName\' in <app-form-field> component.');
-    }
-  }
-
-  protected _onDefinitionChanged(definition: FormFieldDefinition, opts?: {emitEvent?: boolean}) {
-
-    this.type = definition.type;
-    if (!this.type) throw new Error('Invalid attribute \'definition\' in <app-form-field>. Missing type !');
-
-    this.placeholder = this.placeholder || (this._definition.label && this.translate.instant(this._definition.label));
-    this.required = isNotNilBoolean(this.required) ? this.required : (this._definition.required || this.formControl?.validator === Validators.required || isBlankString(this.required));
-    this.disabled = toBoolean(this.disabled, toBoolean(this._definition.disabled, false));
-
-    // double
-    if (this.type === 'double') {
-      this.numberInputStep = this.computeNumberInputStep(definition);
-    }
-
-    // enum (or enums)
-    else if (this.type === 'enum' || this.type === 'enums') {
-      // Resolve enum values
-      if (definition.values instanceof InjectionToken) {
-        this._values = this.computeValuesFromToken(definition.values);
-      }
-      else {
-        this._values = this.computeValues(definition.values as (string[]|Property[]));
-      }
-    }
-
-    // Repaint
-    if (!opts || opts.emitEvent !== false) {
-      this.cd.markForCheck();
-    }
-
-    // Recompute tab index, because if type changed, then matInput can have changed
-    this.updateTabIndex(100);
-  }
-
-  protected updateTabIndex(timeout?: number) {
-    if (this.tabindex && this.tabindex !== -1) {
-      setTimeout(() => {
-        const element = asInputElement(this.matInput);
-        if (element) {
-          element.tabIndex = this.tabindex;
-          this.cd.markForCheck();
-        }
-        else if (this.autocompleteField) {
-          this.autocompleteField.tabindex = this.tabindex;
-        }
-      }, timeout || 0);
-    }
-  }
-}

package/src/app/shared/form/field.model.ts

@@ -1,64 +0,0 @@
-import {ObjectMap, Property} from '../types';
-import {isNotNil} from '../functions';
-import {InjectionToken} from '@angular/core';
-import {MatAutocompleteFieldConfig} from '../material/autocomplete/material.autocomplete.config';
-import {UserProfileLabel} from '../../core/services/model/person.model';
-
-export declare type DisplayFn = (obj: any) => string;
-
-export declare type EqualsFn = (o1: any, o2: any) => boolean;
-
-export declare type CompareFn = (o1: any, o2: any) => number;
-
-export declare type FormFieldType = 'integer' | 'double' | 'boolean' | 'string' | 'enum' | 'enums' | 'color' | 'peer' | 'entity' | 'entities' | 'date' | 'dateTime';
-
-export declare interface FormFieldDefinition<K = string, T = FormFieldType, E = any> {
-  key: K;
-  type: T;
-  label: string;
-  minValue?: number;
-  maxValue?: number;
-  maximumNumberDecimals?: number;
-  defaultValue?: any;
-  isTransient?: boolean; // Useful only for remote configuration
-  values?: (string|Property)[] | InjectionToken<(string|Property)[]>;
-  autocomplete?: MatAutocompleteFieldConfig<E>;
-  disabled?: boolean;
-  required?: boolean;
-  extra?: {
-    [key: string]: {
-      disabled?: boolean;
-      required: boolean;
-    };
-  };
-  minProfile?: UserProfileLabel;
-}
-export declare type FormFieldDefinitionMap = ObjectMap<FormFieldDefinition>;
-
-
-export abstract class FormFieldValuesHolder {
-  getAsBoolean(data: ObjectMap, definition: FormFieldDefinition): boolean {
-    const value = this.get(data, definition);
-    return isNotNil(value) ? (value && value !== 'false') : undefined;
-  }
-
-  getAsInt(data: any, definition: FormFieldDefinition): number {
-    const value = this.get(data, definition);
-    return isNotNil(value) ? parseInt(value) : undefined;
-  }
-
-  getAsNumbers(data: any, definition: FormFieldDefinition): number[] {
-    const value = this.get(data, definition);
-    if (typeof value === 'string') return value.split(',').map(parseFloat) || undefined;
-    return isNotNil(value) ? [parseFloat(value)] : undefined;
-  }
-
-  getAsStrings(data: any, definition: FormFieldDefinition): string[] {
-    const value = this.get(data, definition);
-    return value && value.split(',') || undefined;
-  }
-
-  get<T = string>(data: any, definition: FormFieldDefinition): T {
-    return isNotNil(data[definition.key]) ? data[definition.key] : (definition.defaultValue || undefined);
-  }
-}

package/src/app/shared/form/loading-spinner.ts

@@ -1,16 +0,0 @@
-import {Component, Input} from '@angular/core';
-
-@Component({
-  selector: 'app-loading-spinner',
-  template: `
-    <ion-spinner *ngIf="loading; else content" [color]="color" [name]="name"></ion-spinner>
-    <ng-template #content>
-      <ng-content></ng-content>
-    </ng-template>
-  `
-})
-export class AppLoadingSpinner  {
-  @Input() loading = false;
-  @Input() color: string | undefined = 'secondary';
-  @Input() name: 'bubbles' | 'circles' | 'circular' | 'crescent' | 'dots' | 'lines' | 'lines-small' | undefined;
-}