@sumaris-net/ngx-components 2.4.0 → 2.4.1

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sumaris-net/ngx-components",
   "description": "SUMARiS Angular components",
-  "version": "2.4.0",
+  "version": "2.4.1",
   "author": "contact@e-is.pro",
   "license": "AGPL-3.0",
   "readmeFilename": "README.md",

package/public_api.d.ts

@@ -233,6 +233,7 @@ export * from './src/app/shared/material/latlong/testing/latlong.test';
 export * from './src/app/shared/material/swipe/testing/swipe.test';
 export * from './src/app/shared/material/datetime/testing/mat-date-time.test';
 export * from './src/app/shared/material/datetime/testing/mat-date.test';
+export * from './src/app/shared/material/datetime/testing/mat-dateshort.test';
 export * from './src/app/shared/material/chips/testing/chips.test';
 export * from './src/app/shared/material/numpad/testing/numpad.test';
 export * from './src/app/shared/testing/observable.test';

package/src/app/core/form/entity/entity-editor.class.d.ts

@@ -38,7 +38,7 @@ export interface AppError {
     message?: string;
 }
 export interface AppErrorWithDetails extends AppError {
-    details?: AppError & {
+    details: AppError & {
         errors?: FormErrors;
     };
 }

package/src/app/core/form/form.utils.d.ts

@@ -259,7 +259,7 @@ export declare class AppFormArray<T extends Entity<T>, C extends AbstractControl
         onlySelf?: boolean;
         emitEvent?: boolean;
     }): void;
-    patchValue(values: any[], options?: {
+    patchValue(values: any[] | null | undefined, options?: {
         onlySelf?: boolean;
         emitEvent?: boolean;
     }): void;

package/src/app/shared/dates.d.ts

@@ -10,7 +10,7 @@ export declare class DateUtils {
     static fromDateISOString: typeof fromDateISOString;
     static toDuration: typeof toDuration;
     static min(date1: Moment, date2: Moment): Moment;
-    static max(date1: Moment, date2: Moment): Moment;
+    static max(date1: Moment | string, date2: Moment | string): Moment;
     static equals(date1: Moment | string, date2: Moment | string): boolean;
     static isSame(date1: Moment | string, date2: Moment | string, granularity?: unitOfTime.StartOf): boolean;
     /**

package/src/app/shared/events.d.ts

@@ -1,8 +1,8 @@
 import { EventEmitter } from '@angular/core';
 import { Observable } from 'rxjs';
 export interface PromiseEventPayload<R = any> {
-    success: (R: any) => void;
-    error: (err: any) => void;
+    success: (value?: R) => void;
+    error: (reason?: any) => void;
 }
 export declare type PromiseEvent<R = any, D = void> = CustomEvent<PromiseEventPayload<R> & D>;
 export declare function createPromiseEventEmitter<R = any, D = void>(): EventEmitter<PromiseEvent<R, D>>;

package/src/app/shared/material/datetime/material.date.d.ts

@@ -15,7 +15,7 @@ export declare class MatDate implements OnInit, AfterViewInit, OnDestroy, Contro
     private formGroupDir;
     private _onChangeCallback;
     private _onTouchedCallback;
-    private _subscription;
+    private readonly _subscription;
     private _writing;
     private _disabling;
     private _tabindex;
@@ -70,5 +70,5 @@ export declare class MatDate implements OnInit, AfterViewInit, OnDestroy, Contro
     private markAsDirty;
     private markForCheck;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatDate, [null, null, null, null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatDate, "mat-date-field", never, { "mobile": "mobile"; "formControl": "formControl"; "formControlName": "formControlName"; "placeholder": "placeholder"; "floatLabel": "floatLabel"; "appearance": "appearance"; "required": "required"; "compact": "compact"; "placeholderChar": "placeholderChar"; "autofocus": "autofocus"; "startDate": "startDate"; "clearable": "clearable"; "timezone": "timezone"; "datePickerFilter": "datePickerFilter"; "readonly": "readonly"; "tabindex": "tabindex"; }, {}, never, ["mat-error", "mat-hint", "[matPrefix]"], false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatDate, "mat-date-field", never, { "mobile": "mobile"; "formControl": "formControl"; "formControlName": "formControlName"; "placeholder": "placeholder"; "floatLabel": "floatLabel"; "appearance": "appearance"; "required": "required"; "compact": "compact"; "placeholderChar": "placeholderChar"; "autofocus": "autofocus"; "startDate": "startDate"; "clearable": "clearable"; "timezone": "timezone"; "datePickerFilter": "datePickerFilter"; "readonly": "readonly"; "tabindex": "tabindex"; }, {}, never, ["mat-error", "mat-hint", "[matPrefix]", "[matSuffix]"], false>;
 }

package/src/app/shared/material/datetime/material.dateshort.d.ts

@@ -1,11 +1,11 @@
-import { ChangeDetectorRef, ElementRef, OnInit, QueryList } from '@angular/core';
+import { ChangeDetectorRef, ElementRef, OnInit } from '@angular/core';
 import { ControlValueAccessor, FormGroupDirective, UntypedFormBuilder, UntypedFormControl } from '@angular/forms';
 import { TranslateService } from '@ngx-translate/core';
 import { Moment } from 'moment/moment';
 import { InputElement } from '../../inputs';
 import { FloatLabelType, MatFormFieldAppearance } from '@angular/material/form-field';
-import { MatDatepicker } from '@angular/material/datepicker';
-import { DateAdapter } from '@angular/material/core';
+import { DateFilterFn, MatDatepicker, MatDatepickerInputEvent } from '@angular/material/datepicker';
+import { MomentDateAdapter } from '@angular/material-moment-adapter';
 import * as i0 from "@angular/core";
 export declare class MatDateShort implements OnInit, ControlValueAccessor, InputElement {
     private dateAdapter;
@@ -15,53 +15,61 @@ export declare class MatDateShort implements OnInit, ControlValueAccessor, Input
     private formGroupDir;
     private _onChangeCallback;
     private _onTouchedCallback;
-    protected writing: boolean;
-    protected disabling: boolean;
-    protected _tabindex: number;
-    protected keyboardHideDelay: number;
-    dayControl: UntypedFormControl;
-    displayPattern: string;
-    dayPattern: string;
-    _value: Moment;
+    private readonly _subscription;
+    private _writing;
+    private _disabling;
+    private _tabindex;
+    private _readonly;
+    textControl: UntypedFormControl;
+    datePattern: string;
     locale: string;
-    dayMask: RegExp[];
+    readonly mask: RegExp[];
     mobile: boolean;
-    disabled: boolean;
     formControl: UntypedFormControl;
     formControlName: string;
     placeholder: string;
     floatLabel: FloatLabelType;
     appearance: MatFormFieldAppearance;
-    readonly: boolean;
     required: boolean;
     compact: boolean;
     placeholderChar: string;
+    autofocus: boolean;
+    startDate: Moment | null;
+    clearable: boolean;
+    datePickerFilter: DateFilterFn<Moment>;
+    set readonly(value: boolean);
+    get readonly(): boolean;
     set tabindex(value: number);
     get tabindex(): number;
-    startDate: Date;
-    clearable: boolean;
-    datePicker1: MatDatepicker<Moment>;
-    datePicker2: MatDatepicker<Moment>;
-    matInputs: QueryList<ElementRef>;
     get value(): any;
-    constructor(dateAdapter: DateAdapter<Moment>, translate: TranslateService, formBuilder: UntypedFormBuilder, cd: ChangeDetectorRef, formGroupDir: FormGroupDirective);
+    get disabled(): boolean;
+    datePicker: MatDatepicker<Moment>;
+    _matInput: ElementRef;
+    constructor(dateAdapter: MomentDateAdapter, translate: TranslateService, formBuilder: UntypedFormBuilder, cd: ChangeDetectorRef, formGroupDir: FormGroupDirective);
     ngOnInit(): void;
-    writeValue(obj: any): void;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    writeValue(value: any): void;
     registerOnChange(fn: any): void;
     registerOnTouched(fn: any): void;
     setDisabledState(isDisabled: boolean): void;
-    onDatePickerChange(event: any): void;
+    openDatePicker(): void;
+    focus(): void;
+    clear(): void;
+    protected _onDatePickerChange(event: MatDatepickerInputEvent<Moment>): void;
+    protected _checkIfTouched(opts?: {
+        emitEvent?: boolean;
+    }): void;
+    protected _openDatePickerIfMobile(event: Event): Promise<void>;
+    protected _closeDatePicker(eventData: any): void;
+    protected _preventEvent(event: Event): void;
     private updatePattern;
     private onFormChange;
-    checkIfTouched(): void;
-    openDatePickerIfMobile(event: Event, datePicker?: MatDatepicker<any>): Promise<void>;
-    openDatePicker(event?: Event, datePicker?: MatDatepicker<any>): void;
-    closeDatePicker(eventData: any, matDatepicker?: any): void;
-    preventEvent(event: Event): void;
-    focus(): void;
-    protected waitKeyboardHide(waitKeyboardDelay: boolean): Promise<void>;
-    protected updateTabIndex(): void;
-    protected markForCheck(): void;
+    private waitKeyboardHide;
+    private updateTabIndex;
+    private markAsTouched;
+    private markAsDirty;
+    private markForCheck;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatDateShort, [null, null, null, null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatDateShort, "mat-date-short-field", never, { "mobile": "mobile"; "disabled": "disabled"; "formControl": "formControl"; "formControlName": "formControlName"; "placeholder": "placeholder"; "floatLabel": "floatLabel"; "appearance": "appearance"; "readonly": "readonly"; "required": "required"; "compact": "compact"; "placeholderChar": "placeholderChar"; "tabindex": "tabindex"; "startDate": "startDate"; "clearable": "clearable"; }, {}, never, ["[matPrefix]", "mat-error", "[matPrefix]", "[matSuffix]"], false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatDateShort, "mat-date-short-field", never, { "mobile": "mobile"; "formControl": "formControl"; "formControlName": "formControlName"; "placeholder": "placeholder"; "floatLabel": "floatLabel"; "appearance": "appearance"; "required": "required"; "compact": "compact"; "placeholderChar": "placeholderChar"; "autofocus": "autofocus"; "startDate": "startDate"; "clearable": "clearable"; "datePickerFilter": "datePickerFilter"; "readonly": "readonly"; "tabindex": "tabindex"; }, {}, never, ["mat-error", "mat-hint", "[matPrefix]", "[matSuffix]"], false>;
 }

package/src/app/shared/material/datetime/testing/mat-dateshort.test.d.ts

@@ -0,0 +1,29 @@
+import { ChangeDetectorRef, OnInit } from '@angular/core';
+import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
+import 'moment-timezone';
+import { Subscription } from 'rxjs';
+import * as i0 from "@angular/core";
+export declare class DateShortTestPage implements OnInit {
+    protected formBuilder: UntypedFormBuilder;
+    protected cd: ChangeDetectorRef;
+    showLogPanel: boolean;
+    logContent: string;
+    memoryHide: boolean;
+    memoryMobile: boolean;
+    memoryTimer: Subscription;
+    form: UntypedFormGroup;
+    constructor(formBuilder: UntypedFormBuilder, cd: ChangeDetectorRef);
+    ngOnInit(): void;
+    loadData(): Promise<void>;
+    doSubmit(event: any): void;
+    log(message: string): void;
+    clearLogPanel(): void;
+    startMemoryTimer(): void;
+    stopMemoryTimer(): void;
+    stringify: {
+        (value: any, replacer?: (this: any, key: string, value: any) => any, space?: string | number): string;
+        (value: any, replacer?: (string | number)[], space?: string | number): string;
+    };
+    static ɵfac: i0.ɵɵFactoryDeclaration<DateShortTestPage, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DateShortTestPage, "app-data-short-test", never, {}, {}, never, never, false>;
+}

package/src/app/shared/material/material.testing.module.d.ts

@@ -2,23 +2,24 @@ import { TestingPage } from '../testing/tests.page';
 import * as i0 from "@angular/core";
 import * as i1 from "./datetime/testing/mat-date-time.test";
 import * as i2 from "./datetime/testing/mat-date.test";
-import * as i3 from "./autocomplete/testing/autocomplete.test";
-import * as i4 from "./latlong/testing/latlong.test";
-import * as i5 from "./numpad/testing/numpad.test";
-import * as i6 from "./swipe/testing/swipe.test";
-import * as i7 from "./chips/testing/chips.test";
-import * as i8 from "./badge/badge.test";
-import * as i9 from "../testing/observable.test";
-import * as i10 from "@angular/common";
-import * as i11 from "@ionic/angular";
-import * as i12 from "@angular/forms";
-import * as i13 from "./material.module";
-import * as i14 from "@ngx-translate/core";
-import * as i15 from "@angular/router";
-import * as i16 from "../pipes/pipes.module";
+import * as i3 from "./datetime/testing/mat-dateshort.test";
+import * as i4 from "./autocomplete/testing/autocomplete.test";
+import * as i5 from "./latlong/testing/latlong.test";
+import * as i6 from "./numpad/testing/numpad.test";
+import * as i7 from "./swipe/testing/swipe.test";
+import * as i8 from "./chips/testing/chips.test";
+import * as i9 from "./badge/badge.test";
+import * as i10 from "../testing/observable.test";
+import * as i11 from "@angular/common";
+import * as i12 from "@ionic/angular";
+import * as i13 from "@angular/forms";
+import * as i14 from "./material.module";
+import * as i15 from "@ngx-translate/core";
+import * as i16 from "@angular/router";
+import * as i17 from "../pipes/pipes.module";
 export declare const SHARED_MATERIAL_TESTING_PAGES: TestingPage[];
 export declare class MaterialTestingModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<MaterialTestingModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<MaterialTestingModule, [typeof i1.DateTimeTestPage, typeof i2.DateTestPage, typeof i3.AutocompleteTestPage, typeof i4.LatLongTestPage, typeof i5.NumpadTestPage, typeof i6.SwipeTestPage, typeof i7.ChipsTestPage, typeof i8.MatBadgeTestPage, typeof i9.ObservableTestPage], [typeof i10.CommonModule, typeof i11.IonicModule, typeof i12.ReactiveFormsModule, typeof i13.SharedMaterialModule, typeof i14.TranslateModule, typeof i15.RouterModule, typeof i16.SharedPipesModule], [typeof i13.SharedMaterialModule, typeof i15.RouterModule, typeof i1.DateTimeTestPage, typeof i2.DateTestPage, typeof i3.AutocompleteTestPage, typeof i4.LatLongTestPage, typeof i5.NumpadTestPage, typeof i6.SwipeTestPage, typeof i7.ChipsTestPage, typeof i9.ObservableTestPage]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<MaterialTestingModule, [typeof i1.DateTimeTestPage, typeof i2.DateTestPage, typeof i3.DateShortTestPage, typeof i4.AutocompleteTestPage, typeof i5.LatLongTestPage, typeof i6.NumpadTestPage, typeof i7.SwipeTestPage, typeof i8.ChipsTestPage, typeof i9.MatBadgeTestPage, typeof i10.ObservableTestPage], [typeof i11.CommonModule, typeof i12.IonicModule, typeof i13.ReactiveFormsModule, typeof i14.SharedMaterialModule, typeof i15.TranslateModule, typeof i16.RouterModule, typeof i17.SharedPipesModule], [typeof i14.SharedMaterialModule, typeof i16.RouterModule, typeof i1.DateTimeTestPage, typeof i2.DateTestPage, typeof i3.DateShortTestPage, typeof i4.AutocompleteTestPage, typeof i5.LatLongTestPage, typeof i6.NumpadTestPage, typeof i7.SwipeTestPage, typeof i8.ChipsTestPage, typeof i10.ObservableTestPage]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<MaterialTestingModule>;
 }

package/src/app/shared/pipes/date-format.pipe.d.ts

@@ -14,7 +14,7 @@ export declare abstract class AbstractDateFormat {
         pattern?: string;
         time?: boolean;
         seconds?: boolean;
-    }): string;
+    }): string | Promise<string>;
     protected _updateTranslations(translations: any): void;
     protected _getTranslationValue(translations: any, key: string, defaultValue: string): string;
 }

package/src/theme/_ngx-components.scss

@@ -132,6 +132,7 @@ ion-menu.menu-side-left {
 .form-container,
 form.form-container {
   color: $app-form-color;
+  @include font-size(16px);
 
   .mat-form-field-disabled,
   .mat-input-element:disabled {
@@ -151,29 +152,32 @@ form.form-container {
   }
 
   mat-form-field {
-    @include font-size-important(16px);
+    //@include font-size-important(16px);
 
     ion-icon[matPrefix],
     mat-icon[matPrefix],
     .mat-form-field-prefix ion-icon,
     .mat-form-field-prefix .mat-icon {
-      font-size: 150%;
+      $font-size: calculateRem(24px);
+      $margin-vertical: calculateRem(4px);
+      font-size: $font-size !important;
       line-height: 1.125;
-      margin-left: 5px;
-      margin-right: 5px;
-      height: 1em;
+      height: $font-size;
+      width: $font-size;
+      margin-left: $margin-vertical;
+      margin-right: $margin-vertical;
       position: relative;
-      bottom: -3px;
+      bottom: calc(calc(1rem - $font-size) / 2);
     }
 
     ion-icon[matSuffix],
     mat-icon[matSuffix],
     .mat-form-field-suffix ion-icon,
     .mat-form-field-suffix .mat-icon {
-      //width: 0.8em !important;
 
       &.large {
-        font-size: 150%;
+        $font-size: calculateRem(24px);
+        font-size: $font-size;
         line-height: 1.125;
       }
     }
@@ -242,6 +246,8 @@ mat-form-field {
 
 // --- mat-date-time
 mat-date-time-field {
+  //@include font-size-important(16px);
+
   // Need for errors injected using the <ng-content> tag
   mat-error {
     text-align: end;
@@ -1310,7 +1316,7 @@ ion-modal.modal-fullscreen {
 .mat-cell {
   /* smaller size, for the comment icon */
   mat-icon.comment {
-    font-size: 16pt;
+    @include font-size(16pt);
     height: 100%;
     vertical-align: center;
     color: var(--ion-color-tertiary, grey);