@sumaris-net/ngx-components 1.18.5 → 1.19.0

package/fesm2015/sumaris-net.ngx-components.js

@@ -1,12 +1,9 @@
-import * as i0 from '@angular/core';
-import { InjectionToken, EventEmitter, Component, forwardRef, ChangeDetectionStrategy, ChangeDetectorRef, Optional, Input, Output, ViewChild, Pipe, Injectable, Directive, Inject, NgModule, ElementRef, TemplateRef, ViewContainerRef, HostBinding, HostListener, ViewChildren, ComponentFactoryResolver, ApplicationRef, Injector, Renderer2, ViewEncapsulation } from '@angular/core';
-import * as i1$3 from '@angular/common';
+import { InjectionToken, EventEmitter, Component, forwardRef, ChangeDetectionStrategy, ChangeDetectorRef, Optional, Input, Output, ViewChild, ɵɵdefineInjectable, ɵɵinject, Pipe, Injectable, Directive, Inject, NgModule, ElementRef, TemplateRef, ViewContainerRef, HostBinding, HostListener, ViewChildren, ComponentFactoryResolver, ApplicationRef, INJECTOR, Injector, Renderer2, ViewEncapsulation } from '@angular/core';
 import { CommonModule, DOCUMENT, Location } from '@angular/common';
 import { CdkTableModule } from '@angular/cdk/table';
 import { A11yModule } from '@angular/cdk/a11y';
 import { OverlayModule, OverlayContainer, FullscreenOverlayContainer, Overlay } from '@angular/cdk/overlay';
 import { ScrollingModule } from '@angular/cdk/scrolling';
-import * as i1$2 from '@angular/material/core';
 import { DateAdapter, MatCommonModule, MatRippleModule } from '@angular/material/core';
 import { MatTableModule, MatTable, MatColumnDef } from '@angular/material/table';
 import { MatSortModule, MatSort } from '@angular/material/sort';
@@ -30,22 +27,17 @@ import { MatProgressBarModule } from '@angular/material/progress-bar';
 import { MatRadioModule } from '@angular/material/radio';
 import { MatBadgeModule } from '@angular/material/badge';
 import { MatSlideToggleModule } from '@angular/material/slide-toggle';
-import * as i2$1 from '@angular/material/dialog';
 import { MatDialogModule, MAT_DIALOG_DATA, MatDialog } from '@angular/material/dialog';
 import { MatAutocomplete, MatAutocompleteTrigger, MatAutocompleteModule, MAT_AUTOCOMPLETE_SCROLL_STRATEGY, MAT_AUTOCOMPLETE_DEFAULT_OPTIONS } from '@angular/material/autocomplete';
 import { __awaiter, __decorate } from 'tslib';
-import * as i1$6 from '@angular/forms';
 import { Validators, NG_VALUE_ACCESSOR, FormGroupDirective, AbstractControl, FormGroup, FormArray, FormControl, ReactiveFormsModule, FormBuilder } from '@angular/forms';
 import { timer, merge, fromEvent, BehaviorSubject, Subscription, Subject, isObservable, from, of, noop as noop$9, Observable, defer, forkJoin, combineLatest, EMPTY } from 'rxjs';
 import { filter, first, map, takeUntil, switchMap, startWith, debounceTime, takeWhile, tap, distinctUntilChanged, mergeMap, catchError, throttleTime, skip } from 'rxjs/operators';
 import { trigger, transition, style, animate, state } from '@angular/animations';
-import * as i1$1 from '@ngx-translate/core';
 import { TranslateService, TranslateModule } from '@ngx-translate/core';
-import * as i1$4 from '@ionic/angular';
 import { IonicModule, Platform, IonRouterOutlet, ModalController, PopoverController, IonicSafeString, createAnimation, ToastController, AlertController, IonicRouteStrategy, NavParams, MenuController, IonContent, IonInfiniteScroll } from '@ionic/angular';
 import * as momentImported from 'moment';
 import { isMoment } from 'moment';
-import * as i1 from '@angular/material-moment-adapter';
 import { MomentDateAdapter, MatMomentDateModule } from '@angular/material-moment-adapter';
 import * as momentTZImported from 'moment-timezone';
 import { Keyboard } from '@ionic-native/keyboard/ngx';
@@ -55,38 +47,32 @@ import { MatDatepickerModule } from '@angular/material/datepicker';
 import { MatDividerModule } from '@angular/material/divider';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { MatChipsModule } from '@angular/material/chips';
-import * as i3$3 from '@angular/router';
 import { Router, ActivatedRoute, RouterModule, RouteReuseStrategy } from '@angular/router';
-import * as i1$5 from '@angular/platform-browser';
 import { HammerGestureConfig, EventManager } from '@angular/platform-browser';
-import * as i2$2 from '@angular/common/http';
 import { HttpResponse, HttpClient, HttpHeaders, HttpEventType, HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http';
 import { ColorPickerModule } from 'ngx-color-picker';
-import { NativeAudio } from '@ionic-native/native-audio/ngx';
-import { Vibration } from '@ionic-native/vibration/ngx';
+import { NativeAudio as NativeAudio$1 } from '@ionic-native/native-audio/ngx';
+import { Vibration as Vibration$1 } from '@ionic-native/vibration/ngx';
 import { AudioManagement } from '@ionic-native/audio-management/ngx';
-import * as i2 from '@ionic-native/native-audio/ngx/index';
-import * as i3 from '@ionic-native/vibration/ngx/index';
-import * as i4 from '@ionic-native/audio-management/ngx/index';
+import { NativeAudio } from '@ionic-native/native-audio/ngx/index';
+import { Vibration } from '@ionic-native/vibration/ngx/index';
+import { AudioManagement as AudioManagement$1 } from '@ionic-native/audio-management/ngx/index';
 import * as uuidv4Imported from 'uuid/v4';
 import { DragDropModule } from '@angular/cdk/drag-drop';
 import { MarkdownModule } from 'ngx-markdown';
 import { sign, box, hash, verify } from 'tweetnacl';
-import * as i3$1 from '@ionic/storage';
 import { Storage, IonicStorageModule } from '@ionic/storage';
 import 'zone.js/dist/zone-error';
-import { SplashScreen } from '@ionic-native/splash-screen/ngx';
-import { Connection, Network } from '@ionic-native/network/ngx';
-import { CacheService, CacheModule } from 'ionic-cache';
-import * as i6 from 'ionic-cache/dist/cache.service';
-import * as i9 from '@ionic-native/network/ngx/index';
-import * as i10 from '@ionic-native/splash-screen/ngx/index';
-import { StatusBar } from '@ionic-native/status-bar/ngx';
-import * as i2$4 from '@angular/cdk/platform';
+import { SplashScreen as SplashScreen$1 } from '@ionic-native/splash-screen/ngx';
+import { Connection, Network as Network$1 } from '@ionic-native/network/ngx';
+import { CacheService as CacheService$1, CacheModule } from 'ionic-cache';
+import { CacheService } from 'ionic-cache/dist/cache.service';
+import { Network } from '@ionic-native/network/ngx/index';
+import { SplashScreen } from '@ionic-native/splash-screen/ngx/index';
+import { StatusBar as StatusBar$1 } from '@ionic-native/status-bar/ngx';
 import { Platform as Platform$1 } from '@angular/cdk/platform';
-import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';
+import { InAppBrowser as InAppBrowser$1 } from '@ionic-native/in-app-browser/ngx';
 import { ApolloLink, NetworkStatus, InMemoryCache, ApolloClient, gql } from '@apollo/client/core';
-import * as i2$3 from 'apollo-angular';
 import { Apollo } from 'apollo-angular';
 import { WebSocketLink } from '@apollo/client/link/ws';
 import { getMainDefinition } from '@apollo/client/utilities';
@@ -94,14 +80,13 @@ import { RetryLink } from '@apollo/client/link/retry';
 import QueueLink from 'apollo-link-queue';
 import SerializingLink from 'apollo-link-serialize';
 import loggerLink from 'apollo-link-logger';
-import * as i3$2 from 'apollo-angular/http';
 import { HttpLink } from 'apollo-angular/http';
 import { IonicStorageWrapper, persistCache } from 'apollo3-cache-persist';
-import { NotificationVisibility, Downloader } from '@ionic-native/downloader/ngx';
-import * as i14 from '@ionic-native/status-bar/ngx/index';
-import * as i15 from '@ionic-native/keyboard/ngx/index';
-import * as i17 from '@ionic-native/in-app-browser/ngx/index';
-import * as i18 from '@ionic-native/downloader/ngx/index';
+import { NotificationVisibility, Downloader as Downloader$1 } from '@ionic-native/downloader/ngx';
+import { StatusBar } from '@ionic-native/status-bar/ngx/index';
+import { Keyboard as Keyboard$1 } from '@ionic-native/keyboard/ngx/index';
+import { InAppBrowser } from '@ionic-native/in-app-browser/ngx/index';
+import { Downloader } from '@ionic-native/downloader/ngx/index';
 import { CdkTextareaAutosize } from '@angular/cdk/text-field';
 import { ValidatorService, TableDataSource } from '@e-is/ngx-material-table';
 import { SelectionModel } from '@angular/cdk/collections';
@@ -1088,7 +1073,7 @@ const isIpad = (win) => {
     }
     return false;
 };
-const ɵ0$c = isIpad;
+const ɵ0 = isIpad;
 const isIOS = (win) => testUserAgent(win, /iPhone|iPod/i) || isIpad(win);
 const isAndroid = (win) => testUserAgent(win, /android|sink/i);
 const isCordova = (win) => !!(win['cordova'] || win['phonegap'] || win['PhoneGap']);
@@ -1147,14 +1132,14 @@ class MatAutocompleteFieldUtils {
         return isNotNil(o1 === null || o1 === void 0 ? void 0 : o1.id) && o1.id === (o2 === null || o2 === void 0 ? void 0 : o2.id);
     }
 }
-const noop$8 = (_) => { };
-const ɵ0$b = noop$8;
+const noop = (_) => { };
+const ɵ0$1 = noop;
 class MatAutocompleteField {
     constructor(cd, formGroupDir) {
         this.cd = cd;
         this.formGroupDir = formGroupDir;
-        this._onChangeCallback = noop$8;
-        this._onTouchedCallback = noop$8;
+        this._onChangeCallback = noop;
+        this._onTouchedCallback = noop;
         this.logPrefix = '[mat-autocomplete] ';
         this.formControlName = null;
         this.required = false;
@@ -1896,11 +1881,14 @@ class DateFormatPipe {
         const date = isMoment(value) ? value : this.dateAdapter.parse(value, DATE_ISO_PATTERN);
         return date && this.dateAdapter.format(date, pattern) || '';
     }
-    format(date, displayFormat) {
-        return this.dateAdapter.format(date, displayFormat);
+    format(date, pattern) {
+        return this.dateAdapter.format(date, pattern);
+    }
+    parse(value, parseFormat) {
+        return isMoment(value) ? value : this.dateAdapter.parse(value, parseFormat || DATE_ISO_PATTERN);
     }
 }
-DateFormatPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function DateFormatPipe_Factory() { return new DateFormatPipe(i0.ɵɵinject(i1.MomentDateAdapter), i0.ɵɵinject(i1$1.TranslateService)); }, token: DateFormatPipe, providedIn: "root" });
+DateFormatPipe.ɵprov = ɵɵdefineInjectable({ factory: function DateFormatPipe_Factory() { return new DateFormatPipe(ɵɵinject(MomentDateAdapter), ɵɵinject(TranslateService)); }, token: DateFormatPipe, providedIn: "root" });
 DateFormatPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'dateFormat'
@@ -1912,7 +1900,7 @@ DateFormatPipe.ctorParameters = () => [
     { type: TranslateService }
 ];
 
-const moment$7 = momentImported;
+const moment = momentImported;
 class DateDiffDurationPipe {
     constructor(dateAdapter, translate) {
         this.dateAdapter = dateAdapter;
@@ -1928,17 +1916,17 @@ class DateDiffDurationPipe {
         return this.format(startDate, endDate);
     }
     format(startDate, endDate) {
-        const duration = moment$7.duration(endDate.diff(startDate));
+        const duration = moment.duration(endDate.diff(startDate));
         if (duration.asMinutes() < 0)
             return '';
-        const timeDuration = moment$7(0)
+        const timeDuration = moment(0)
             .hour(duration.hours())
             .minute(duration.minutes());
         const days = Math.floor(duration.asDays());
         return (days > 0 ? days.toString() + (this.dayUnit + ' ') : '') + timeDuration.format('HH:mm');
     }
 }
-DateDiffDurationPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function DateDiffDurationPipe_Factory() { return new DateDiffDurationPipe(i0.ɵɵinject(i1$2.DateAdapter), i0.ɵɵinject(i1$1.TranslateService)); }, token: DateDiffDurationPipe, providedIn: "root" });
+DateDiffDurationPipe.ɵprov = ɵɵdefineInjectable({ factory: function DateDiffDurationPipe_Factory() { return new DateDiffDurationPipe(ɵɵinject(DateAdapter), ɵɵinject(TranslateService)); }, token: DateDiffDurationPipe, providedIn: "root" });
 DateDiffDurationPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'dateDiffDuration'
@@ -1959,7 +1947,7 @@ class DateFromNowPipe {
         return date ? date.fromNow(args && args.withoutSuffix) : '';
     }
 }
-DateFromNowPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function DateFromNowPipe_Factory() { return new DateFromNowPipe(i0.ɵɵinject(i1.MomentDateAdapter)); }, token: DateFromNowPipe, providedIn: "root" });
+DateFromNowPipe.ɵprov = ɵɵdefineInjectable({ factory: function DateFromNowPipe_Factory() { return new DateFromNowPipe(ɵɵinject(MomentDateAdapter)); }, token: DateFromNowPipe, providedIn: "root" });
 DateFromNowPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'dateFromNow'
@@ -2028,7 +2016,7 @@ function formatToDD(value, opts) {
                 value *= -1;
         }
     }
-    let degrees = roundFloat$1(value, opts.maxDecimals).toString();
+    let degrees = roundFloat(value, opts.maxDecimals).toString();
     // Add sign
     let sign = negative ? '-' : '+';
     if (opts.placeholderChar) {
@@ -2079,7 +2067,7 @@ function formatToDDMMSS(value, opts) {
     }
     let degrees = Math.trunc(value);
     let minutes = Math.trunc((value - degrees) * 60);
-    let seconds = roundFloat$1(((value - degrees) * 60 - minutes) * 60, opts.maxDecimals);
+    let seconds = roundFloat(((value - degrees) * 60 - minutes) * 60, opts.maxDecimals);
     while (seconds >= 60) {
         seconds -= 60;
         minutes += 1;
@@ -2147,7 +2135,7 @@ function formatToDDMM(value, opts) {
         }
     }
     let degrees = Math.trunc(value);
-    let minutes = roundFloat$1((value - degrees) * 60, opts.maxDecimals);
+    let minutes = roundFloat((value - degrees) * 60, opts.maxDecimals);
     while (minutes >= 60) {
         minutes -= 60;
         degrees += 1;
@@ -2198,15 +2186,15 @@ function parseLatitudeOrLongitude(input, pattern, maxDecimals, placeholderChar)
         return NaN;
     }
     if (pattern === 'DD')
-        return roundFloat$1(degrees, maxDecimals);
+        return roundFloat(degrees, maxDecimals);
     const minutes = (pattern === 'DDMMSS' || pattern === 'DDMM') && parts[1] && parseFloat(parts[1].replace(/,/g, '.')) || 0;
     const seconds = (pattern === 'DDMMSS') && parts[2] && parseFloat(parts[2].replace(/,/g, '.')) || 0;
     const direction = ((pattern === 'DDMMSS') && parts[3]) || ((pattern === 'DDMM') && parts[2]) || undefined;
     const sign = (direction && (direction === 's' || direction === 'S' || direction === 'w' || direction === 'W')) ? -1 : 1;
     degrees = sign * (degrees + minutes / 60 + seconds / (60 * 60));
-    return roundFloat$1(degrees, maxDecimals);
+    return roundFloat(degrees, maxDecimals);
 }
-function roundFloat$1(input, maxDecimals) {
+function roundFloat(input, maxDecimals) {
     if (maxDecimals > 0) {
         const powDecimal = Math.pow(10, maxDecimals);
         return Math.trunc(input * powDecimal + 0.5) / powDecimal;
@@ -2226,7 +2214,7 @@ class LatLongFormatPipe {
         return ((!args.type || args.type !== 'latitude') ? formatLongitude : formatLatitude)(value, args);
     }
 }
-LatLongFormatPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function LatLongFormatPipe_Factory() { return new LatLongFormatPipe(); }, token: LatLongFormatPipe, providedIn: "root" });
+LatLongFormatPipe.ɵprov = ɵɵdefineInjectable({ factory: function LatLongFormatPipe_Factory() { return new LatLongFormatPipe(); }, token: LatLongFormatPipe, providedIn: "root" });
 LatLongFormatPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'latLongFormat'
@@ -2238,7 +2226,7 @@ class LatitudeFormatPipe {
         this.transform = formatLatitude;
     }
 }
-LatitudeFormatPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function LatitudeFormatPipe_Factory() { return new LatitudeFormatPipe(); }, token: LatitudeFormatPipe, providedIn: "root" });
+LatitudeFormatPipe.ɵprov = ɵɵdefineInjectable({ factory: function LatitudeFormatPipe_Factory() { return new LatitudeFormatPipe(); }, token: LatitudeFormatPipe, providedIn: "root" });
 LatitudeFormatPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'latitudeFormat'
@@ -2250,7 +2238,7 @@ class LongitudeFormatPipe {
         this.transform = formatLongitude;
     }
 }
-LongitudeFormatPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function LongitudeFormatPipe_Factory() { return new LongitudeFormatPipe(); }, token: LongitudeFormatPipe, providedIn: "root" });
+LongitudeFormatPipe.ɵprov = ɵɵdefineInjectable({ factory: function LongitudeFormatPipe_Factory() { return new LongitudeFormatPipe(); }, token: LongitudeFormatPipe, providedIn: "root" });
 LongitudeFormatPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'longitudeFormat'
@@ -2270,7 +2258,7 @@ class NumberFormatPipe {
         }
     }
 }
-NumberFormatPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function NumberFormatPipe_Factory() { return new NumberFormatPipe(); }, token: NumberFormatPipe, providedIn: "root" });
+NumberFormatPipe.ɵprov = ɵɵdefineInjectable({ factory: function NumberFormatPipe_Factory() { return new NumberFormatPipe(); }, token: NumberFormatPipe, providedIn: "root" });
 NumberFormatPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'numberFormat'
@@ -2310,7 +2298,7 @@ class HighlightPipe {
         }
     }
 }
-HighlightPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function HighlightPipe_Factory() { return new HighlightPipe(); }, token: HighlightPipe, providedIn: "root" });
+HighlightPipe.ɵprov = ɵɵdefineInjectable({ factory: function HighlightPipe_Factory() { return new HighlightPipe(); }, token: HighlightPipe, providedIn: "root" });
 HighlightPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'highlight'
@@ -2375,7 +2363,7 @@ FileSizePipe.decorators = [
     { type: Pipe, args: [{ name: 'fileSize' },] }
 ];
 
-const moment$6 = momentImported;
+const moment$1 = momentImported;
 const tz = momentTZImported;
 const DATE_UNIX_TIMESTAMP = 'X';
 const DATE_UNIX_MS_TIMESTAMP = 'x';
@@ -2386,10 +2374,10 @@ class DateUtils {
         this.toDuration = toDuration;
     }
     static min(date1, date2) {
-        return date1 && date2 && date1.isSameOrBefore(date2) ? date1 : date2;
+        return date1 && (!date2 || date1.isSameOrBefore(date2)) ? date1 : date2;
     }
     static max(date1, date2) {
-        return !date1 ? date2 : (!date2 || date1.isSameOrAfter(date2) ? date1 : date2);
+        return date1 && (!date2 || date1.isSameOrAfter(date2)) ? date1 : date2;
     }
     static equals(date1, date2) {
         return DateUtils.isSame(date1, date2);
@@ -2452,32 +2440,32 @@ function fromDateISOString(value) {
     if (!value || isMoment(value))
         return value;
     // Parse the input value, as a ISO date time
-    const date = moment$6(value, DATE_ISO_PATTERN);
+    const date = moment$1(value, DATE_ISO_PATTERN);
     if (date.isValid())
         return date;
     // Not valid: trying to convert from unix timestamp
     if (typeof value === 'string') {
         console.warn('Wrong date format - Trying to convert from local time: ' + value);
         if (value.length === 10) {
-            return moment$6(value, DATE_UNIX_TIMESTAMP);
+            return moment$1(value, DATE_UNIX_TIMESTAMP);
         }
         else if (value.length === 13) {
-            return moment$6(value, DATE_UNIX_MS_TIMESTAMP);
+            return moment$1(value, DATE_UNIX_MS_TIMESTAMP);
         }
     }
     console.warn('Unable to parse date: ' + value);
     return undefined;
 }
 function fromUnixTimestamp(timeInSec) {
-    return moment$6(timeInSec, DATE_UNIX_TIMESTAMP);
+    return moment$1(timeInSec, DATE_UNIX_TIMESTAMP);
 }
 function fromUnixMsTimestamp(timeInMs) {
-    return moment$6(timeInMs, DATE_UNIX_MS_TIMESTAMP);
+    return moment$1(timeInMs, DATE_UNIX_MS_TIMESTAMP);
 }
 function toDuration(value, unit) {
     if (!value)
         return undefined;
-    const duration = moment$6.duration(value, unit);
+    const duration = moment$1.duration(value, unit);
     // fix 990+ ms
     if (duration.milliseconds() >= 990) {
         duration.add(1000 - duration.milliseconds(), 'ms');
@@ -2506,7 +2494,7 @@ class DurationPipe {
         return (days > 0 ? days.toString() + (this.dayUnit + ' ') : '') + hour + ':' + minute;
     }
 }
-DurationPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function DurationPipe_Factory() { return new DurationPipe(i0.ɵɵinject(i1$1.TranslateService)); }, token: DurationPipe, providedIn: "root" });
+DurationPipe.ɵprov = ɵɵdefineInjectable({ factory: function DurationPipe_Factory() { return new DurationPipe(ɵɵinject(TranslateService)); }, token: DurationPipe, providedIn: "root" });
 DurationPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'duration'
@@ -2527,7 +2515,7 @@ class MathAbsPipe {
         }
     }
 }
-MathAbsPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function MathAbsPipe_Factory() { return new MathAbsPipe(); }, token: MathAbsPipe, providedIn: "root" });
+MathAbsPipe.ɵprov = ɵɵdefineInjectable({ factory: function MathAbsPipe_Factory() { return new MathAbsPipe(); }, token: MathAbsPipe, providedIn: "root" });
 MathAbsPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'mathAbs'
@@ -2539,7 +2527,7 @@ class EvenPipe {
         return val % 2 === 0;
     }
 }
-EvenPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function EvenPipe_Factory() { return new EvenPipe(); }, token: EvenPipe, providedIn: "root" });
+EvenPipe.ɵprov = ɵɵdefineInjectable({ factory: function EvenPipe_Factory() { return new EvenPipe(); }, token: EvenPipe, providedIn: "root" });
 EvenPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'even'
@@ -2551,7 +2539,7 @@ class OddPipe {
         return val % 2 !== 0;
     }
 }
-OddPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function OddPipe_Factory() { return new OddPipe(); }, token: OddPipe, providedIn: "root" });
+OddPipe.ɵprov = ɵɵdefineInjectable({ factory: function OddPipe_Factory() { return new OddPipe(); }, token: OddPipe, providedIn: "root" });
 OddPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'odd'
@@ -2659,7 +2647,7 @@ class MapGetPipe {
         return val[key];
     }
 }
-MapGetPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function MapGetPipe_Factory() { return new MapGetPipe(); }, token: MapGetPipe, providedIn: "root" });
+MapGetPipe.ɵprov = ɵɵdefineInjectable({ factory: function MapGetPipe_Factory() { return new MapGetPipe(); }, token: MapGetPipe, providedIn: "root" });
 MapGetPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'mapGet'
@@ -2673,7 +2661,7 @@ class MapKeysPipe {
         return Object.keys(map);
     }
 }
-MapKeysPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function MapKeysPipe_Factory() { return new MapKeysPipe(); }, token: MapKeysPipe, providedIn: "root" });
+MapKeysPipe.ɵprov = ɵɵdefineInjectable({ factory: function MapKeysPipe_Factory() { return new MapKeysPipe(); }, token: MapKeysPipe, providedIn: "root" });
 MapKeysPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'mapKeys'
@@ -2687,7 +2675,7 @@ class MapValuesPipe {
         return Object.values(map);
     }
 }
-MapValuesPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function MapValuesPipe_Factory() { return new MapValuesPipe(); }, token: MapValuesPipe, providedIn: "root" });
+MapValuesPipe.ɵprov = ɵɵdefineInjectable({ factory: function MapValuesPipe_Factory() { return new MapValuesPipe(); }, token: MapValuesPipe, providedIn: "root" });
 MapValuesPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'mapValues'
@@ -2700,7 +2688,7 @@ class IsNotNilOrBlankPipe {
         return isNotNilOrBlank(value);
     }
 }
-IsNotNilOrBlankPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function IsNotNilOrBlankPipe_Factory() { return new IsNotNilOrBlankPipe(); }, token: IsNotNilOrBlankPipe, providedIn: "root" });
+IsNotNilOrBlankPipe.ɵprov = ɵɵdefineInjectable({ factory: function IsNotNilOrBlankPipe_Factory() { return new IsNotNilOrBlankPipe(); }, token: IsNotNilOrBlankPipe, providedIn: "root" });
 IsNotNilOrBlankPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'isNotNilOrBlank'
@@ -2712,7 +2700,7 @@ class IsNilOrBlankPipe {
         return isNilOrBlank(value);
     }
 }
-IsNilOrBlankPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function IsNilOrBlankPipe_Factory() { return new IsNilOrBlankPipe(); }, token: IsNilOrBlankPipe, providedIn: "root" });
+IsNilOrBlankPipe.ɵprov = ɵɵdefineInjectable({ factory: function IsNilOrBlankPipe_Factory() { return new IsNilOrBlankPipe(); }, token: IsNilOrBlankPipe, providedIn: "root" });
 IsNilOrBlankPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'isNilOrBlank'
@@ -2724,7 +2712,7 @@ class ToStringPipe {
         return (value !== null && value !== undefined) ? value.toString() : '';
     }
 }
-ToStringPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function ToStringPipe_Factory() { return new ToStringPipe(); }, token: ToStringPipe, providedIn: "root" });
+ToStringPipe.ɵprov = ɵɵdefineInjectable({ factory: function ToStringPipe_Factory() { return new ToStringPipe(); }, token: ToStringPipe, providedIn: "root" });
 ToStringPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'toString'
@@ -2736,7 +2724,7 @@ class StrLengthPipe {
         return value && value.length || 0;
     }
 }
-StrLengthPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function StrLengthPipe_Factory() { return new StrLengthPipe(); }, token: StrLengthPipe, providedIn: "root" });
+StrLengthPipe.ɵprov = ɵɵdefineInjectable({ factory: function StrLengthPipe_Factory() { return new StrLengthPipe(); }, token: StrLengthPipe, providedIn: "root" });
 StrLengthPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'strLength'
@@ -2748,7 +2736,7 @@ class StrIncludesPipe {
         return (value === null || value === void 0 ? void 0 : value.includes(searchString, position)) || false;
     }
 }
-StrIncludesPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function StrIncludesPipe_Factory() { return new StrIncludesPipe(); }, token: StrIncludesPipe, providedIn: "root" });
+StrIncludesPipe.ɵprov = ɵɵdefineInjectable({ factory: function StrIncludesPipe_Factory() { return new StrIncludesPipe(); }, token: StrIncludesPipe, providedIn: "root" });
 StrIncludesPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'strIncludes'
@@ -2825,7 +2813,7 @@ class TranslateContextService {
         return translations[keys[keys.length - 1]]; // Return the last keys translation
     }
 }
-TranslateContextService.ɵprov = i0.ɵɵdefineInjectable({ factory: function TranslateContextService_Factory() { return new TranslateContextService(i0.ɵɵinject(i1$1.TranslateService)); }, token: TranslateContextService, providedIn: "root" });
+TranslateContextService.ɵprov = ɵɵdefineInjectable({ factory: function TranslateContextService_Factory() { return new TranslateContextService(ɵɵinject(TranslateService)); }, token: TranslateContextService, providedIn: "root" });
 TranslateContextService.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -2875,7 +2863,7 @@ class PropertyGetPipe {
         args && args.defaultValue);
     }
 }
-PropertyGetPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function PropertyGetPipe_Factory() { return new PropertyGetPipe(); }, token: PropertyGetPipe, providedIn: "root" });
+PropertyGetPipe.ɵprov = ɵɵdefineInjectable({ factory: function PropertyGetPipe_Factory() { return new PropertyGetPipe(); }, token: PropertyGetPipe, providedIn: "root" });
 PropertyGetPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'propertyGet'
@@ -2900,7 +2888,7 @@ NgInitDirective.propDecorators = {
     ngInit: [{ type: Output }]
 };
 
-const moment$5 = momentImported;
+const moment$2 = momentImported;
 // @dynamic
 class SharedValidators {
     static getDoubleRegexp(maxDecimals) {
@@ -2981,7 +2969,7 @@ class SharedValidators {
     }
     static validDate(control) {
         const value = control.value;
-        const date = !value || moment$5.isMoment(value) ? value : moment$5(control.value, DATE_ISO_PATTERN);
+        const date = !value || moment$2.isMoment(value) ? value : moment$2(value, DATE_ISO_PATTERN);
         if (date && (!date.isValid() || date.year() < 1970)) {
             return { validDate: true };
         }
@@ -4093,7 +4081,7 @@ class FormErrorTranslator {
         return errorKey;
     }
 }
-FormErrorTranslator.ɵprov = i0.ɵɵdefineInjectable({ factory: function FormErrorTranslator_Factory() { return new FormErrorTranslator(i0.ɵɵinject(i1$1.TranslateService), i0.ɵɵinject(APP_FORM_ERROR_I18N_KEYS, 8)); }, token: FormErrorTranslator, providedIn: "root" });
+FormErrorTranslator.ɵprov = ɵɵdefineInjectable({ factory: function FormErrorTranslator_Factory() { return new FormErrorTranslator(ɵɵinject(TranslateService), ɵɵinject(APP_FORM_ERROR_I18N_KEYS, 8)); }, token: FormErrorTranslator, providedIn: "root" });
 FormErrorTranslator.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -4173,7 +4161,7 @@ class FormGetPipe {
         return form.get(path);
     }
 }
-FormGetPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function FormGetPipe_Factory() { return new FormGetPipe(); }, token: FormGetPipe, providedIn: "root" });
+FormGetPipe.ɵprov = ɵɵdefineInjectable({ factory: function FormGetPipe_Factory() { return new FormGetPipe(); }, token: FormGetPipe, providedIn: "root" });
 FormGetPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'formGet'
@@ -4185,7 +4173,7 @@ class FormGetControlPipe {
         return form.get(path);
     }
 }
-FormGetControlPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function FormGetControlPipe_Factory() { return new FormGetControlPipe(); }, token: FormGetControlPipe, providedIn: "root" });
+FormGetControlPipe.ɵprov = ɵɵdefineInjectable({ factory: function FormGetControlPipe_Factory() { return new FormGetControlPipe(); }, token: FormGetControlPipe, providedIn: "root" });
 FormGetControlPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'formGetControl'
@@ -4197,7 +4185,7 @@ class FormGetArrayPipe {
         return form.get(path);
     }
 }
-FormGetArrayPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function FormGetArrayPipe_Factory() { return new FormGetArrayPipe(); }, token: FormGetArrayPipe, providedIn: "root" });
+FormGetArrayPipe.ɵprov = ɵɵdefineInjectable({ factory: function FormGetArrayPipe_Factory() { return new FormGetArrayPipe(); }, token: FormGetArrayPipe, providedIn: "root" });
 FormGetArrayPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'formGetArray'
@@ -4209,7 +4197,7 @@ class FormGetGroupPipe {
         return form.get(path);
     }
 }
-FormGetGroupPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function FormGetGroupPipe_Factory() { return new FormGetGroupPipe(); }, token: FormGetGroupPipe, providedIn: "root" });
+FormGetGroupPipe.ɵprov = ɵɵdefineInjectable({ factory: function FormGetGroupPipe_Factory() { return new FormGetGroupPipe(); }, token: FormGetGroupPipe, providedIn: "root" });
 FormGetGroupPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'formGetGroup'
@@ -4538,9 +4526,9 @@ function parseDuration(input, maxDecimals, placeholderChar) {
     const hour = parseInt(durationParts[0] || '0');
     const minute = parseInt(durationParts[1] || '0');
     const value = hour + (minute + 0.5) / 60;
-    return roundFloat(value, maxDecimals);
+    return roundFloat$1(value, maxDecimals);
 }
-function roundFloat(input, maxDecimals) {
+function roundFloat$1(input, maxDecimals) {
     if (maxDecimals > 0) {
         const powDecimal = Math.pow(10, maxDecimals);
         return Math.trunc(input * powDecimal + 0.5) / powDecimal;
@@ -4564,17 +4552,17 @@ const MASKS = {
         DD: [/[+-]/, /\d/, /\d/, /\d/, '.', /\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/, '°']
     }
 };
-const noop$7 = () => {
+const noop$1 = () => {
 };
-const ɵ0$a = noop$7;
+const ɵ0$2 = noop$1;
 class MatLatLongField {
     constructor(translate, formBuilder, cd, formGroupDir) {
         this.translate = translate;
         this.formBuilder = formBuilder;
         this.cd = cd;
         this.formGroupDir = formGroupDir;
-        this._onChangeCallback = noop$7;
-        this._onTouchedCallback = noop$7;
+        this._onChangeCallback = noop$1;
+        this._onTouchedCallback = noop$1;
         this._subscription = new Subscription();
         this.disabling = false;
         this.writing = false;
@@ -4910,14 +4898,14 @@ SharedMatLatLongModule.decorators = [
             },] }
 ];
 
-const DEFAULT_VALUE_ACCESSOR$5 = {
+const DEFAULT_VALUE_ACCESSOR = {
     provide: NG_VALUE_ACCESSOR,
     useExisting: forwardRef(() => MatDate),
     multi: true
 };
-const DAY_MASK$2 = [/\d/, /\d/, '/', /\d/, /\d/, '/', /\d/, /\d/, /\d/, /\d/];
-const noop$6 = () => { };
-const ɵ0$9 = noop$6;
+const TEXT_MASK = [/\d/, /\d/, '/', /\d/, /\d/, '/', /\d/, /\d/, /\d/, /\d/];
+const noop$2 = () => { };
+const ɵ0$3 = noop$2;
 class MatDate {
     constructor(dateAdapter, translate, formBuilder, cd, keyboard, formGroupDir) {
         this.dateAdapter = dateAdapter;
@@ -4926,13 +4914,13 @@ class MatDate {
         this.cd = cd;
         this.keyboard = keyboard;
         this.formGroupDir = formGroupDir;
-        this._onChangeCallback = noop$6;
-        this._onTouchedCallback = noop$6;
+        this._onChangeCallback = noop$2;
+        this._onTouchedCallback = noop$2;
         this._subscription = new Subscription();
         this._writing = true;
         this._disabling = false;
         this._readonly = false;
-        this.dayMask = DAY_MASK$2;
+        this.mask = TEXT_MASK;
         this.floatLabel = 'auto';
         this.compact = false;
         this.placeholderChar = DEFAULT_PLACEHOLDER_CHAR;
@@ -4977,22 +4965,24 @@ class MatDate {
             this.formControl.setValidators(this.required ? [this.formControl.validator, Validators.required, SharedValidators.validDate] :
                 [this.formControl.validator, SharedValidators.validDate]);
         }
-        // Create the day control
-        this.dayControl = this.formBuilder.control(null, () => this.formControl.errors);
+        // Create the text control
+        this.textControl = this.formBuilder.control(null, 
+        // Important: should copy errors from the model formControl
+        () => this.formControl.errors);
         // Get patterns to display date
         this.updatePattern(this.translate.instant('COMMON.DATE_PATTERN'));
         this._subscription.add(this.translate.get('COMMON.DATE_PATTERN')
             .subscribe((pattern) => this.updatePattern(pattern)));
-        this._subscription.add(this.dayControl.valueChanges
+        this._subscription.add(this.textControl.valueChanges
             .subscribe((value) => this.onFormChange(value)));
         // Listen status changes (when done outside the component  - e.g. when setErrors() is calling on the formControl)
         this._subscription.add(this.formControl.statusChanges
             .pipe(filter((_) => !this.readonly && !this._writing && !this._disabling) // Skip
         )
             .subscribe(() => {
-            this.dayControl.updateValueAndValidity({ emitEvent: false });
-            if (this.formControl.touched && !this.dayControl.touched) {
-                this.dayControl.markAsTouched();
+            this.textControl.updateValueAndValidity({ emitEvent: false });
+            if (this.formControl.touched && !this.textControl.touched) {
+                this.textControl.markAsTouched();
             }
             this.markForCheck();
         }));
@@ -5008,27 +4998,25 @@ class MatDate {
         this._writing = true;
         // DEBUG
         //console.debug("[mat-date] writeValue() with:", value);
-        // Convert into date, and clone if necessary
-        const date = isMoment(value) ? value.clone() : fromDateISOString(value);
+        // Convert into date
+        // Important: do a clone()
+        let date = isMoment(value) ? value.clone() : fromDateISOString(value);
         if (!date || !date.isValid()) {
-            this.dayControl.patchValue(null, { emitEvent: false });
+            this.textControl.patchValue(null, { emitEvent: false });
             if (this.formControl.value) {
                 this.formControl.patchValue(null, { emitEvent: false });
                 this._onChangeCallback(null);
             }
         }
         else {
-            // Format day
-            let day = date && this.timezone
-                // Move to the expected TZ (keeping local hour - e.g. midnight)
-                ? date.tz(this.timezone)
-                // Not TZ: important: do a clone
-                : date;
-            day = day.startOf('day');
-            const dayStr = this.dateAdapter.format(day, this.dayPattern);
-            if (this.dayControl.value !== dayStr) {
-                // Update control
-                this.dayControl.patchValue(dayStr, { emitEvent: false });
+            // Move to the expected TZ (keeping local hour - e.g. midnight)
+            date = (this.timezone && date.tz(this.timezone) || date)
+                // Reset hour
+                .startOf('day');
+            const dayStr = this.dateAdapter.format(date, this.datePattern);
+            if (this.textControl.value !== dayStr) {
+                // Update day control
+                this.textControl.patchValue(dayStr, { emitEvent: false });
             }
         }
         this._writing = false;
@@ -5045,10 +5033,10 @@ class MatDate {
             return;
         this._disabling = true;
         if (isDisabled) {
-            this.dayControl.disable({ emitEvent: false });
+            this.textControl.disable({ emitEvent: false });
         }
         else {
-            this.dayControl.enable({ emitEvent: false });
+            this.textControl.enable({ emitEvent: false });
         }
         this._disabling = false;
         this.markForCheck();
@@ -5065,12 +5053,12 @@ class MatDate {
                 .locale(this.locale) // set as time as locale time
                 .minute(0).seconds(0).millisecond(0) // Reset hour
                 .utc(true);
-            dateStr = this.dateAdapter.format(date, this.dayPattern) || null;
+            dateStr = this.dateAdapter.format(date, this.datePattern) || null;
         }
-        if (this.dayControl.value !== dateStr) {
+        if (this.textControl.value !== dateStr) {
             // DEBUG
             //console.debug("[mat-date] onDatePickerChange() new value:", dateStr);
-            this.dayControl.setValue(dateStr, {
+            this.textControl.setValue(dateStr, {
                 emitEvent: true // Will call onFormChange
             });
         }
@@ -5115,7 +5103,7 @@ class MatDate {
         });
     }
     clear() {
-        this.dayControl.patchValue(null, { emitEvent: false });
+        this.textControl.patchValue(null, { emitEvent: false });
         this.formControl.setValue(null, { emitEvent: false });
         this._onChangeCallback(null);
         this.markAsTouched();
@@ -5124,43 +5112,70 @@ class MatDate {
     /* -- private method -- */
     updatePattern(pattern) {
         pattern = pattern !== 'COMMON.DATE_PATTERN' ? pattern : 'L';
-        if (this.displayPattern !== pattern) {
-            this.displayPattern = pattern;
-            this.dayPattern = pattern;
+        if (this.datePattern !== pattern) {
+            this.datePattern = pattern;
             this.markForCheck();
         }
     }
     checkIfTouched(opts) {
-        if (this.dayControl.touched) {
+        if (this.textControl.touched) {
             this._onTouchedCallback();
             if (!opts || opts.emitEvent !== false) {
                 this.markForCheck();
             }
         }
     }
-    onFormChange(dayStr) {
+    onFormChange(value) {
         if (this._writing)
             return; // Skip if call by self
         this._writing = true;
-        if (this.dayControl.invalid) {
-            this.formControl.markAsPending({ onlySelf: true });
-            this.formControl.setErrors(Object.assign(Object.assign({}, this.formControl.errors), this.dayControl.errors));
-            this.formControl.markAsDirty();
-            this._writing = false;
-            return;
-        }
-        // Make to remove placeholder chars
-        while (dayStr && dayStr.indexOf(this.placeholderChar) !== -1) {
-            dayStr = dayStr.replace(this.placeholderChar, '');
+        // DEBUG
+        //console.debug(`[mat-date-time] onFormChange() from event: ${event} - controls values: `, [dayStr, time]);
+        /*if (this.dayControl.invalid) {
+          this.formControl.markAsPending({onlySelf: true});
+          this.formControl.setErrors({
+            ...this.formControl.errors,
+            ...this.dayControl.errors
+          });
+          this.formControl.markAsDirty();
+          this._writing = false;
+          return;
+        }*/
+        if (value) {
+            // Make to remove placeholder chars
+            while (value.indexOf(this.placeholderChar) !== -1) {
+                value = value.replace(this.placeholderChar, '');
+            }
+            // Force '0' for empty month (otherwise moment will use the current month)
+            value = value.replace('//', '/0/')
+                // Force '0' for empty year (otherwise moment will use the current year)
+                .replace(/\/$/, '/0');
         }
-        // Parse day
-        let dayDate = dayStr && this.dateAdapter.parse(dayStr, this.dayPattern);
+        // Parse date (strict = false)
+        let date = isNotNilOrBlank(value) && this.dateAdapter.parse(value, this.datePattern) || null;
         // Move to the expected TZ, and keep the local hour (= midnight) to have midnight at local time
-        dayDate = dayDate && (this.timezone ? dayDate.tz(this.timezone, true) : dayDate);
-        dayDate = dayDate && dayDate
+        date = date && (this.timezone ? date.tz(this.timezone, true) : date) || null;
+        date = date && date
             .startOf('day') // Reset hour
-            .utc(); // Convert to UTC (avoid TZ offset in final string)
-        this.emitChange(dayDate);
+            .utc() // Convert to UTC (avoid TZ offset in final string)
+            || null;
+        // Convert to model value (ISO date string)
+        // IMPORTANT: If date is invalid, then keep the invalid string value
+        // to allow SharedValidators.validDate() to raise an error
+        const formControlValue = date && date.isValid() ? toDateISOString(date) : (value || null);
+        if (this.formControl.value !== formControlValue) {
+            // DEBUG
+            //console.debug('[mat-date] Emit new value: ' + dateStr);
+            // Apply to form control. => Will call writeValue()
+            // NOT NEED, because a formControl should NOT be used by multiple fields
+            //this.formControl.setValue(dateStr, {emitEvent: false})
+            // Changes comes from inside function: use the callback
+            this._onChangeCallback(formControlValue);
+            // Check if need to update controls
+            this.checkIfTouched();
+        }
+        // Force the day control to update its validity (same errors as formControl - see ngOnInit())
+        this.textControl.updateValueAndValidity();
         this._writing = false;
     }
     waitKeyboardHide(waitKeyboardDelay) {
@@ -5177,21 +5192,6 @@ class MatDate {
             }
         });
     }
-    emitChange(value) {
-        // Get the model value
-        const dateStr = toDateISOString(value) || null;
-        if (this.formControl.value !== dateStr) {
-            // DEBUG
-            //console.debug('[mat-date] Emit new value: ' + dateStr);
-            // Apply to form control. => Will call writeValue()
-            // NOT NEED, because a formControl should NOT be used by multiple fields
-            //this.formControl.setValue(dateStr, {emitEvent: false})
-            // Changes comes from inside function: use the callback
-            this._onChangeCallback(dateStr);
-            // Check if need to update controls
-            this.checkIfTouched();
-        }
-    }
     updateTabIndex() {
         if (isNil(this._tabindex) || this._tabindex === -1)
             return; // skip
@@ -5204,7 +5204,7 @@ class MatDate {
         });
     }
     markAsTouched(opts) {
-        this.dayControl.markAsTouched(opts);
+        this.textControl.markAsTouched(opts);
         this._onTouchedCallback();
         this.markForCheck();
     }
@@ -5218,16 +5218,16 @@ class MatDate {
 MatDate.decorators = [
     { type: Component, args: [{
                 selector: 'mat-date-field',
-                template: "<!-- readonly -->\n<mat-form-field *ngIf=\"readonly; else writable\"\n                [floatLabel]=\"floatLabel\"\n                class=\"mat-form-field-disabled\">\n\n  <div matPrefix>\n    <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n  </div>\n\n  <input matInput hidden type=\"text\"\n         readonly\n         [placeholder]=\"placeholder\"\n         [formControl]=\"formControl\">\n  <ion-text>{{formControl.value|dateFormat: {pattern: displayPattern} }}</ion-text>\n</mat-form-field>\n\n<!-- writable -->\n<ng-template #writable>\n  <mat-form-field [floatLabel]=\"floatLabel\">\n\n    <mat-label>{{placeholder}}</mat-label>\n\n    <div matPrefix>\n      <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n    </div>\n\n    <input matInput #matInput autocomplete=\"off\" type=\"text\"\n           *ngIf=\"!mobile\"\n           [formControl]=\"dayControl\"\n           [textMask]=\"{mask: dayMask, keepCharPositions: true, placeholderChar: placeholderChar}\"\n           [placeholder]=\"'COMMON.DATE_PLACEHOLDER'|translate\"\n           (blur)=\"checkIfTouched()\"\n           (keyup.arrowdown)=\"openDatePicker($event, datePicker)\"\n           (keyup.escape)=\"preventEvent($event)\"\n           [required]=\"required\"\n           [tabindex]=\"tabindex\"\n           [appAutofocus]=\"autofocus\">\n    <input matInput #matInput autocomplete=\"off\" type=\"text\"\n           *ngIf=\"mobile\"\n           [formControl]=\"dayControl\"\n           (click)=\"openDatePickerIfMobile($event, datePicker)\"\n           [required]=\"required\"\n           [tabindex]=\"tabindex\"\n           readonly>\n\n    <!-- Hide the final input -->\n    <input matInput type=\"text\" [formControl]=\"formControl\"\n           hidden\n           [matDatepicker]=\"datePicker\"\n           [matDatepickerFilter]=\"datePickerFilter\"\n           (dateChange)=\"onDatePickerChange($event)\">\n\n    <button type=\"button\" mat-icon-button tabindex=\"-1\" matSuffix\n            (click)=\"openDatePicker($event, datePicker)\"\n            [disabled]=\"formControl.disabled\">\n      <div *ngIf=\"mobile; then iconDate; else iconDesktop\"></div>\n    </button>\n    <button matSuffix mat-icon-button tabindex=\"-1\"\n            type=\"button\"\n            *ngIf=\"clearable\"\n            (click)=\"clear()\"\n            [hidden]=\"formControl.disabled || !formControl.value\">\n      <mat-icon>close</mat-icon>\n    </button>\n\n    <!-- errors -->\n    <mat-error *ngIf=\"formControl.touched && formControl.errors|mapKeys|arrayFirst; let errorKey\">\n      <ng-container [ngSwitch]=\"errorKey\">\n        <span *ngSwitchCase=\"'required'\" translate>ERROR.FIELD_REQUIRED</span>\n        <span *ngSwitchCase=\"'validDate'\" translate>ERROR.FIELD_NOT_VALID_DATE_TIME</span>\n        <span *ngSwitchCase=\"'dateIsAfter'\">{{'ERROR.FIELD_NOT_VALID_DATE_AFTER' | translate: formControl.errors.dateIsAfter }}</span>\n        <span *ngSwitchCase=\"'dateIsBefore'\">{{'ERROR.FIELD_NOT_VALID_DATE_BEFORE' | translate: formControl.errors.dateIsBefore }}</span>\n        <span *ngSwitchCase=\"'dateRange'\" translate>ERROR.FIELD_NOT_VALID_DATE_RANGE</span>\n        <span *ngSwitchCase=\"'dateMaxDuration'\" translate>ERROR.FIELD_NOT_VALID_DATE_MAX_DURATION</span>\n        <span *ngSwitchCase=\"'dateMinDuration'\" translate>ERROR.FIELD_NOT_VALID_DATE_MIN_DURATION</span>\n        <span *ngSwitchCase=\"'msg'\">{{(formControl.errors.msg?.key || formControl.errors.msg) | translate: formControl.errors.msg?.params}}</span>\n      </ng-container>\n    </mat-error>\n    <ng-content select=\"mat-error\"></ng-content>\n\n    <!-- mat hint -->\n    <div class=\"mat-form-field-hint-wrapper\" [class.cdk-visually-hidden]=\"formControl.invalid\">\n      <div class=\"mat-form-field-hint-spacer\"></div>\n      <ng-content select=\"mat-hint\"></ng-content>\n    </div>\n  </mat-form-field>\n\n  <mat-datepicker #datePicker\n                  [touchUi]=\"mobile\"\n                  [disabled]=\"formControl.disabled\"\n                  [startAt]=\"startDate\"\n                  ></mat-datepicker>\n\n\n\n</ng-template>\n\n<ng-template #iconDesktop>\n  <mat-icon>keyboard_arrow_down</mat-icon>\n</ng-template>\n\n<ng-template #iconDate>\n  <mat-icon>date_range</mat-icon>\n</ng-template>\n\n<ng-template #matPrefixTemplate>\n  <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n",
+                template: "<!-- readonly -->\n<mat-form-field *ngIf=\"readonly; else writable\"\n                [floatLabel]=\"floatLabel\"\n                class=\"mat-form-field-disabled\">\n\n  <div matPrefix>\n    <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n  </div>\n\n  <input matInput hidden type=\"text\"\n         readonly\n         [placeholder]=\"placeholder\"\n         [formControl]=\"formControl\">\n  <ion-text>{{formControl.value|dateFormat: {pattern: datePattern} }}</ion-text>\n</mat-form-field>\n\n<!-- writable -->\n<ng-template #writable>\n  <mat-form-field [floatLabel]=\"floatLabel\">\n\n    <mat-label>{{placeholder}}</mat-label>\n\n    <div matPrefix>\n      <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n    </div>\n\n    <input matInput #matInput autocomplete=\"off\" type=\"text\"\n           *ngIf=\"!mobile\"\n           [formControl]=\"textControl\"\n           [textMask]=\"{mask: mask, keepCharPositions: true, placeholderChar: placeholderChar}\"\n           [placeholder]=\"'COMMON.DATE_PLACEHOLDER'|translate\"\n           (blur)=\"checkIfTouched()\"\n           (keyup.arrowdown)=\"openDatePicker($event, datePicker)\"\n           (keyup.escape)=\"preventEvent($event)\"\n           [required]=\"required\"\n           [tabindex]=\"tabindex\"\n           [appAutofocus]=\"autofocus\">\n    <input matInput #matInput autocomplete=\"off\" type=\"text\"\n           *ngIf=\"mobile\"\n           [formControl]=\"textControl\"\n           (click)=\"openDatePickerIfMobile($event, datePicker)\"\n           [required]=\"required\"\n           [tabindex]=\"tabindex\"\n           readonly>\n\n    <!-- Hide the final input -->\n    <input matInput type=\"text\" [formControl]=\"formControl\"\n           hidden\n           [matDatepicker]=\"datePicker\"\n           [matDatepickerFilter]=\"datePickerFilter\"\n           (dateChange)=\"onDatePickerChange($event)\">\n\n    <button type=\"button\" mat-icon-button tabindex=\"-1\" matSuffix\n            (click)=\"openDatePicker($event, datePicker)\"\n            [disabled]=\"formControl.disabled\">\n      <div *ngIf=\"mobile; then iconDate; else iconDesktop\"></div>\n    </button>\n    <button matSuffix mat-icon-button tabindex=\"-1\"\n            type=\"button\"\n            *ngIf=\"clearable\"\n            (click)=\"clear()\"\n            [hidden]=\"formControl.disabled || !formControl.value\">\n      <mat-icon>close</mat-icon>\n    </button>\n\n    <!-- errors -->\n    <mat-error *ngIf=\"formControl.touched && formControl.errors|mapKeys|arrayFirst; let errorKey\">\n      <ng-container [ngSwitch]=\"errorKey\">\n        <span *ngSwitchCase=\"'required'\" translate>ERROR.FIELD_REQUIRED</span>\n        <span *ngSwitchCase=\"'validDate'\" translate>ERROR.FIELD_NOT_VALID_DATE</span>\n        <span *ngSwitchCase=\"'dateIsAfter'\">{{'ERROR.FIELD_NOT_VALID_DATE_AFTER' | translate: formControl.errors.dateIsAfter }}</span>\n        <span *ngSwitchCase=\"'dateIsBefore'\">{{'ERROR.FIELD_NOT_VALID_DATE_BEFORE' | translate: formControl.errors.dateIsBefore }}</span>\n        <span *ngSwitchCase=\"'dateRange'\" translate>ERROR.FIELD_NOT_VALID_DATE_RANGE</span>\n        <span *ngSwitchCase=\"'dateMaxDuration'\" translate>ERROR.FIELD_NOT_VALID_DATE_MAX_DURATION</span>\n        <span *ngSwitchCase=\"'dateMinDuration'\" translate>ERROR.FIELD_NOT_VALID_DATE_MIN_DURATION</span>\n        <span *ngSwitchCase=\"'msg'\">{{(formControl.errors.msg?.key || formControl.errors.msg) | translate: formControl.errors.msg?.params}}</span>\n      </ng-container>\n    </mat-error>\n    <ng-content select=\"mat-error\"></ng-content>\n\n    <!-- mat hint -->\n    <div class=\"mat-form-field-hint-wrapper\" [class.cdk-visually-hidden]=\"formControl.invalid\">\n      <div class=\"mat-form-field-hint-spacer\"></div>\n      <ng-content select=\"mat-hint\"></ng-content>\n    </div>\n  </mat-form-field>\n\n  <mat-datepicker #datePicker\n                  [touchUi]=\"mobile\"\n                  [disabled]=\"formControl.disabled\"\n                  [startAt]=\"startDate\"\n                  ></mat-datepicker>\n\n\n\n</ng-template>\n\n<ng-template #iconDesktop>\n  <mat-icon>keyboard_arrow_down</mat-icon>\n</ng-template>\n\n<ng-template #iconDate>\n  <mat-icon>date_range</mat-icon>\n</ng-template>\n\n<ng-template #matPrefixTemplate>\n  <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n",
                 providers: [
-                    DEFAULT_VALUE_ACCESSOR$5,
+                    DEFAULT_VALUE_ACCESSOR,
                 ],
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 styles: [":host{display:inline-block;width:100%;position:relative}:host [no-padding]{--ion-grid-column-padding:0}:host [nowrap]{flex-wrap:nowrap}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}mat-form-field .datetime-md,mat-form-field ion-datetime{padding:0!important}ion-col.day{min-width:100px}ion-col.day .mat-form-field-subscript-wrapper{overflow:visible;right:-64px;width:calc(100% + 64px)}ion-col.day .mat-form-field-subscript-wrapper .mat-form-field-hint-wrapper{display:flex}ion-col.day .mat-form-field-subscript-wrapper .mat-form-field-hint-wrapper .mat-form-field-hint-spacer{flex:1 0 1em}ion-col.hour{min-width:55px;max-width:65px}ion-col.hour mat-form-field{width:100%}ion-col.hour mat-form-field input[type=text],ion-col.hour mat-form-field mat-label{text-align:left;min-width:50px}mat-form-field.mat-form-field-disabled ion-col.day{min-width:100px}.hour .mat-form-field-label{max-width:40px}.hour mat-form-field.mat-form-field-should-float .mat-form-field-placeholder{max-width:inherit}mat-error{text-align:right;width:100%}"]
             },] }
 ];
 MatDate.ctorParameters = () => [
-    { type: DateAdapter },
+    { type: MomentDateAdapter },
     { type: TranslateService },
     { type: FormBuilder },
     { type: ChangeDetectorRef },
@@ -5254,16 +5254,16 @@ MatDate.propDecorators = {
     matInputs: [{ type: ViewChildren, args: ['matInput',] }]
 };
 
-const DEFAULT_VALUE_ACCESSOR$4 = {
+const DEFAULT_VALUE_ACCESSOR$1 = {
     provide: NG_VALUE_ACCESSOR,
     useExisting: forwardRef(() => MatDateTime),
     multi: true
 };
-const DAY_MASK$1 = [/\d/, /\d/, '/', /\d/, /\d/, '/', /\d/, /\d/, /\d/, /\d/];
+const DAY_MASK = [/\d/, /\d/, '/', /\d/, /\d/, '/', /\d/, /\d/, /\d/, /\d/];
 const HOUR_REGEXP = /^[012][0-9][:][012345][0-9]$/;
-const HOUR_MASK$1 = [/[012]/, /\d/, ':', /[012345]/, /\d/];
-const noop$5 = () => { };
-const ɵ0$8 = noop$5;
+const HOUR_MASK = [/[012]/, /\d/, ':', /[012345]/, /\d/];
+const noop$3 = () => { };
+const ɵ0$4 = noop$3;
 class MatDateTime {
     constructor(dateAdapter, translate, formBuilder, cd, keyboard, formGroupDir) {
         this.dateAdapter = dateAdapter;
@@ -5272,14 +5272,14 @@ class MatDateTime {
         this.cd = cd;
         this.keyboard = keyboard;
         this.formGroupDir = formGroupDir;
-        this._onChangeCallback = noop$5;
-        this._onTouchedCallback = noop$5;
+        this._onChangeCallback = noop$3;
+        this._onTouchedCallback = noop$3;
         this._subscription = new Subscription();
         this._writing = true;
         this._disabling = false;
         this._readonly = false;
-        this.dayMask = DAY_MASK$1;
-        this.hourMask = HOUR_MASK$1;
+        this.dayMask = DAY_MASK;
+        this.hourMask = HOUR_MASK;
         this.floatLabel = 'auto';
         this.compact = false;
         this.placeholderChar = DEFAULT_PLACEHOLDER_CHAR;
@@ -5593,14 +5593,14 @@ MatDateTime.decorators = [
                 selector: 'mat-date-time-field',
                 template: "<!-- readonly -->\n<mat-form-field *ngIf=\"readonly; else writable\"\n                [floatLabel]=\"floatLabel\"\n                class=\"mat-form-field-disabled\">\n\n  <div matPrefix>\n    <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n  </div>\n\n  <input matInput hidden type=\"text\"\n         readonly\n         [placeholder]=\"placeholder\"\n         [formControl]=\"formControl\">\n  <ion-text>{{formControl.value|dateFormat: {pattern: displayPattern} }}</ion-text>\n</mat-form-field>\n\n<!-- writable + time -->\n<ng-template #writable >\n  <ion-grid class=\"ion-no-padding\">\n    <ion-row class=\"ion-no-padding no-wrap\" nowrap>\n\n      <!-- day -->\n      <ion-col class=\"day ion-no-padding\">\n        <mat-form-field [floatLabel]=\"floatLabel\"\n                        [class.mat-form-field-invalid]=\"formControl.touched && formControl.invalid\">\n\n          <mat-label>{{placeholder}}</mat-label>\n\n          <div matPrefix>\n            <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n          </div>\n\n          <input matInput #matInput autocomplete=\"off\" type=\"text\"\n                 *ngIf=\"!mobile\"\n                 [formControl]=\"dayControl\"\n                 [textMask]=\"{mask: dayMask, keepCharPositions: true, placeholderChar: placeholderChar}\"\n                 [placeholder]=\"'COMMON.DATE_PLACEHOLDER'|translate\"\n                 (blur)=\"checkIfTouched()\"\n                 (keyup.arrowdown)=\"openDatePicker($event, datePicker)\"\n                 (keyup.escape)=\"preventEvent($event)\"\n                 [required]=\"required\"\n                 [tabindex]=\"tabindex\"\n                 [appAutofocus]=\"autofocus\">\n          <input matInput #matInput autocomplete=\"off\" type=\"text\"\n                 *ngIf=\"mobile\"\n                 [formControl]=\"dayControl\"\n                 (click)=\"openDatePickerIfMobile($event, datePicker)\"\n                 [required]=\"required\"\n                 [tabindex]=\"tabindex\"\n                 readonly>\n\n          <!-- Hide the final input -->\n          <input matInput type=\"text\" [formControl]=\"formControl\"\n                 hidden\n                 [matDatepicker]=\"datePicker\"\n                 [matDatepickerFilter]=\"datePickerFilter\"\n                 (dateChange)=\"onDatePickerChange($event)\">\n\n          <button type=\"button\" mat-icon-button tabindex=\"-1\" matSuffix\n                  (click)=\"openDatePicker($event, datePicker)\"\n                  [disabled]=\"formControl.disabled\">\n            <div *ngIf=\"mobile; then iconDate; else iconDesktop\"></div>\n          </button>\n          <button matSuffix mat-icon-button tabindex=\"-1\"\n                  type=\"button\"\n                  *ngIf=\"clearable\"\n                  (click)=\"clear()\"\n                  [hidden]=\"formControl.disabled || !formControl.value\">\n            <mat-icon>close</mat-icon>\n          </button>\n        </mat-form-field>\n        <mat-datepicker #datePicker\n                        [touchUi]=\"mobile\"\n                        [disabled]=\"formControl.disabled\"\n                        [startAt]=\"startDate\"></mat-datepicker>\n        <div class=\"mat-form-field-subscript mat-form-field-subscript-wrapper\" >\n          <!-- errors -->\n          <ng-container [ngSwitch]=\"formControl.touched && formControl.errors|mapKeys|arrayFirst\">\n            <mat-error *ngSwitchCase=\"'required'\" translate>ERROR.FIELD_REQUIRED</mat-error>\n            <mat-error *ngSwitchCase=\"'validDate'\" translate>ERROR.FIELD_NOT_VALID_DATE_TIME</mat-error>\n            <mat-error *ngSwitchCase=\"'dateIsAfter'\">{{'ERROR.FIELD_NOT_VALID_DATE_AFTER' | translate: formControl.errors.dateIsAfter }}</mat-error>\n            <mat-error *ngSwitchCase=\"'dateIsBefore'\">{{'ERROR.FIELD_NOT_VALID_DATE_BEFORE' | translate: formControl.errors.dateIsBefore }}</mat-error>\n            <mat-error *ngSwitchCase=\"'dateRange'\" translate>ERROR.FIELD_NOT_VALID_DATE_RANGE</mat-error>\n            <mat-error *ngSwitchCase=\"'dateMaxDuration'\" translate>ERROR.FIELD_NOT_VALID_DATE_MAX_DURATION</mat-error>\n            <mat-error *ngSwitchCase=\"'dateMinDuration'\" translate>ERROR.FIELD_NOT_VALID_DATE_MIN_DURATION</mat-error>\n            <mat-error *ngSwitchCase=\"'msg'\">{{(formControl.errors.msg?.key || formControl.errors.msg) | translate: formControl.errors.msg?.params}}</mat-error>\n          </ng-container>\n          <ng-content select=\"mat-error\"></ng-content>\n\n          <!-- mat hint -->\n          <div class=\"mat-form-field-hint-wrapper\" [class.cdk-visually-hidden]=\"formControl.invalid\">\n            <div class=\"mat-form-field-hint-spacer\"></div>\n            <ng-content select=\"mat-hint\"></ng-content>\n          </div>\n        </div>\n\n      </ion-col>\n\n      <!-- hour -->\n      <ion-col class=\"hour ion-no-padding\">\n        <mat-form-field [floatLabel]=\"floatLabel\"\n                        [class.mat-form-field-invalid]=\"formControl.touched && (hourControl.invalid || formControl.invalid)\">\n          <mat-label *ngIf=\"placeholder && floatLabel != 'never'\" translate>COMMON.TIME</mat-label>\n          <input matInput #matInput type=\"text\"\n                 *ngIf=\"!mobile\"\n                 [formControl]=\"hourControl\"\n                 autocomplete=\"off\"\n                 min=\"0\" max=\"23\"\n                 [textMask]=\"{mask: hourMask, keepCharPositions: true, placeholderChar: placeholderChar, guide: true}\"\n                 [placeholder]=\"'COMMON.TIME_PLACEHOLDER'|translate\"\n                 [required]=\"required\"\n                 (keyup.arrowdown)=\"openTimePicker($event)\"\n                 (keyup.escape)=\"preventEvent($event)\"\n                 (blur)=\"checkIfTouched()\"\n                 [tabindex]=\"tabindex !== undefined ? tabindex+1 : undefined\">\n\n          <input matInput #matInput type=\"text\"\n                 *ngIf=\"mobile\"\n                 [formControl]=\"hourControl\"\n                 (click)=\"openTimePickerIfMobile($event)\"\n                 readonly>\n\n          <input matInput type=\"text\"\n                 [formControl]=\"hourControl\"\n                 hidden\n                 [ngxTimepicker]=\"timePicker\"\n                 [format]=\"24\">\n\n          <button matSuffix type=\"button\" mat-icon-button\n                  tabindex=\"-1\"\n                  *ngIf=\"!compact && !mobile\"\n                  [disabled]=\"formControl.disabled\"\n                  (click)=\"openTimePicker($event)\" >\n            <mat-icon>keyboard_arrow_down</mat-icon>\n          </button>\n          <button matSuffix type=\"button\" mat-icon-button\n                  tabindex=\"-1\"\n                  *ngIf=\"!compact && mobile\"\n                  [disabled]=\"formControl.disabled\"\n                  (click)=\"openTimePickerIfMobile($event)\">\n            <mat-icon>access_time</mat-icon>\n          </button>\n\n          <ngx-material-timepicker #timePicker [@.disabled]=\"true\"\n                                   (timeSet)=\"onTimePickerChange($event)\"\n                                   [ESC]=\"!mobile\"\n                                   [defaultTime]=\"'00:00'\"\n                                   [cancelBtnTmpl]=\"timePickerCancelButton\"\n                                   [confirmBtnTmpl]=\"timePickerOkButton\"\n                                   [preventOverlayClick]=\"mobile\"\n                                   [enableKeyboardInput]=\"false\"\n                                   [disableAnimation]=\"true\">\n            <!-- cancel button -->\n            <ng-template #timePickerCancelButton>\n              <ion-button fill=\"clear\" color=\"dark\">\n                <ion-label translate>COMMON.BTN_CANCEL</ion-label>\n              </ion-button>\n            </ng-template>\n\n            <!-- confirm button -->\n            <ng-template #timePickerOkButton>\n              <ion-button fill=\"solid\" color=\"tertiary\">\n                <ion-label translate>COMMON.BTN_VALIDATE</ion-label>\n              </ion-button>\n            </ng-template>\n\n          </ngx-material-timepicker>\n        </mat-form-field>\n      </ion-col>\n    </ion-row>\n  </ion-grid>\n\n\n</ng-template>\n\n<ng-template #iconDesktop>\n  <mat-icon>keyboard_arrow_down</mat-icon>\n</ng-template>\n\n<ng-template #iconDate>\n  <mat-icon>date_range</mat-icon>\n</ng-template>\n\n<ng-template #matPrefixTemplate>\n  <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n",
                 providers: [
-                    DEFAULT_VALUE_ACCESSOR$4,
+                    DEFAULT_VALUE_ACCESSOR$1,
                 ],
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 styles: [":host{display:inline-block;width:100%;position:relative;--ion-grid-column-padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}mat-form-field .datetime-md{padding:0!important}ion-row.no-wrap{flex-wrap:nowrap}ion-col.day{min-width:100px}ion-col.day .mat-form-field-subscript-wrapper{overflow:visible;right:-64px;width:calc(100% + 64px)}ion-col.day .mat-form-field-subscript-wrapper .mat-form-field-hint-wrapper{display:flex}ion-col.day .mat-form-field-subscript-wrapper .mat-form-field-hint-wrapper .mat-form-field-hint-spacer{flex:1 0 1em}ion-col.hour{min-width:55px;max-width:65px}ion-col.hour mat-form-field{width:100%}ion-col.hour mat-form-field input[type=text],ion-col.hour mat-form-field mat-label{text-align:left;min-width:50px}mat-form-field.mat-form-field-disabled ion-col.day{min-width:100px}.hour .mat-form-field-label{max-width:40px}.hour mat-form-field.mat-form-field-should-float .mat-form-field-placeholder{max-width:inherit}mat-error{text-align:right;width:100%}"]
             },] }
 ];
 MatDateTime.ctorParameters = () => [
-    { type: DateAdapter },
+    { type: MomentDateAdapter },
     { type: TranslateService },
     { type: FormBuilder },
     { type: ChangeDetectorRef },
@@ -5627,15 +5627,15 @@ MatDateTime.propDecorators = {
     matInputs: [{ type: ViewChildren, args: ['matInput',] }]
 };
 
-const DEFAULT_VALUE_ACCESSOR$3 = {
+const DEFAULT_VALUE_ACCESSOR$2 = {
     provide: NG_VALUE_ACCESSOR,
     useExisting: forwardRef(() => MatDateShort),
     multi: true
 };
-const DAY_MASK = [/\d/, /\d/, /\d/, /\d/];
+const DAY_MASK$1 = [/\d/, /\d/, /\d/, /\d/];
 const noop$4 = () => {
 };
-const ɵ0$7 = noop$4;
+const ɵ0$5 = noop$4;
 class MatDateShort {
     constructor(dateAdapter, translate, formBuilder, cd, keyboard, formGroupDir) {
         this.dateAdapter = dateAdapter;
@@ -5648,7 +5648,7 @@ class MatDateShort {
         this._onTouchedCallback = noop$4;
         this.writing = true;
         this.disabling = false;
-        this.dayMask = DAY_MASK;
+        this.dayMask = DAY_MASK$1;
         this.disabled = false;
         this.floatLabel = 'auto';
         this.readonly = false;
@@ -5893,7 +5893,7 @@ MatDateShort.decorators = [
                 selector: 'mat-date-short-field',
                 template: "<!-- readonly -->\n<mat-form-field *ngIf=\"readonly else writable\">\n  <input matInput hidden type=\"text\" readonly=\"true\" [formControl]=\"formControl\">\n  <ion-text>{{formControl.value|dateFormat: {pattern: displayPattern} }}</ion-text>\n</mat-form-field>\n\n<ng-template #writable>\n  <mat-form-field [floatLabel]=\"floatLabel\">\n\n    <mat-label>{{placeholder}}</mat-label>\n\n    <div matPrefix><ng-content select=\"[matPrefix]\"></ng-content></div>\n\n    <input matInput #matInput autocomplete=\"off\" type=\"text\"\n           *ngIf=\"!mobile\"\n           [formControl]=\"dayControl\"\n           [textMask]=\"{mask: dayMask, keepCharPositions: true, placeholderChar: placeholderChar}\"\n           [placeholder]=\"'COMMON.DATE_YEAR_PLACEHOLDER'|translate\"\n           (blur)=\"checkIfTouched()\"\n           (keyup.arrowdown)=\"openDatePicker($event, datePicker1)\"\n           (keyup.escape)=\"preventEvent($event)\"\n           (click)=\"matInput.select()\"\n           [required]=\"required\"\n           [tabindex]=\"tabindex\">\n    <input matInput #matInput autocomplete=\"off\" type=\"text\"\n           *ngIf=\"mobile\"\n           [formControl]=\"dayControl\"\n           (click)=\"openDatePickerIfMobile($event, datePicker1)\"\n           [required]=\"required\"\n           [tabindex]=\"tabindex\"\n           readonly>\n\n    <!-- Hide the final control -->\n    <input matInput type=\"text\"\n           [formControl]=\"formControl\"\n           hidden\n           [matDatepicker]=\"datePicker1\"\n           (dateChange)=\"onDatePickerChange($event)\">\n\n\n    <button matSuffix mat-icon-button tabindex=\"-1\"\n            type=\"button\"\n            (click)=\"openDatePicker($event, datePicker1)\"\n            [disabled]=\"formControl.disabled\">\n      <div *ngIf=\"mobile; then iconDate; else iconDesktop\"></div>\n    </button>\n    <button matSuffix mat-icon-button tabindex=\"-1\"\n            type=\"button\"\n            *ngIf=\"clearable\"\n            (click)=\"writeValue(null)\"\n            [hidden]=\"formControl.disabled || !formControl.value\">\n      <mat-icon>close</mat-icon>\n    </button>\n\n    <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n    <mat-error *ngIf=\"formControl.hasError('validDate')\" translate>ERROR.FIELD_NOT_VALID_DATE</mat-error>\n    <mat-error *ngIf=\"formControl.hasError('dateIsAfter')\">{{'ERROR.FIELD_NOT_VALID_DATE_AFTER' | translate: formControl.errors.dateIsAfter }}</mat-error>\n    <mat-error *ngIf=\"formControl.hasError('dateRange')\" translate>ERROR.FIELD_NOT_VALID_DATE_RANGE</mat-error>\n    <mat-error *ngIf=\"!formControl.hasError('dateRange') && formControl.hasError('dateMaxDuration')\" translate>ERROR.FIELD_NOT_VALID_DATE_MAX_DURATION</mat-error>\n    <mat-error *ngIf=\"!formControl.hasError('dateRange') && formControl.hasError('dateMinDuration')\" translate>ERROR.FIELD_NOT_VALID_DATE_MIN_DURATION</mat-error>\n    <mat-error *ngIf=\"formControl.hasError('msg')\">{{formControl.errors.msg}}</mat-error>\n    <ng-content select=\"mat-error\"></ng-content>\n  </mat-form-field>\n\n  <mat-datepicker #datePicker1\n                  startView=\"multi-year\"\n                  [touchUi]=\"mobile\"\n                  [disabled]=\"formControl.disabled\"\n                  (yearSelected)=\"closeDatePicker($event, datePicker1)\"\n                  [startAt]=\"startDate\"></mat-datepicker>\n\n  <ng-template #iconDesktop>\n    <mat-icon>keyboard_arrow_down</mat-icon>\n  </ng-template>\n\n  <ng-template #iconDate>\n    <mat-icon>date_range</mat-icon>\n  </ng-template>\n\n</ng-template>\n",
                 providers: [
-                    DEFAULT_VALUE_ACCESSOR$3,
+                    DEFAULT_VALUE_ACCESSOR$2,
                 ],
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 styles: [":host{display:inline-block;width:100%;position:relative}:host [no-padding]{--ion-grid-column-padding:0}:host [nowrap]{flex-wrap:nowrap}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}mat-form-field .datetime-md,mat-form-field ion-datetime{padding:0!important}ion-col.day{min-width:100px}ion-col.day .mat-form-field-subscript-wrapper{overflow:visible;right:-64px;width:calc(100% + 64px)}ion-col.day .mat-form-field-subscript-wrapper .mat-form-field-hint-wrapper{display:flex}ion-col.day .mat-form-field-subscript-wrapper .mat-form-field-hint-wrapper .mat-form-field-hint-spacer{flex:1 0 1em}ion-col.hour{min-width:55px;max-width:65px}ion-col.hour mat-form-field{width:100%}ion-col.hour mat-form-field input[type=text],ion-col.hour mat-form-field mat-label{text-align:left;min-width:50px}mat-form-field.mat-form-field-disabled ion-col.day{min-width:100px}.hour .mat-form-field-label{max-width:40px}.hour mat-form-field.mat-form-field-should-float .mat-form-field-placeholder{max-width:inherit}mat-error{text-align:right;width:100%}"]
@@ -5961,16 +5961,16 @@ SharedMatDateTimeModule.decorators = [
             },] }
 ];
 
-const DEFAULT_VALUE_ACCESSOR$2 = {
+const DEFAULT_VALUE_ACCESSOR$3 = {
     provide: NG_VALUE_ACCESSOR,
     useExisting: forwardRef(() => MatDuration),
     multi: true
 };
 const HOUR_TIME_PATTERN = /[0-9]\d\d:[0-5]\d/;
-const HOUR_MASK = [/\d/, /\d/, /\d/, ':', /[0-5]/, /\d/];
-const noop$3 = () => {
+const HOUR_MASK$1 = [/\d/, /\d/, /\d/, ':', /[0-5]/, /\d/];
+const noop$5 = () => {
 };
-const ɵ0$6 = noop$3;
+const ɵ0$6 = noop$5;
 class MatDuration {
     constructor(platform, dateAdapter, translate, formBuilder, cd, formGroupDir) {
         this.dateAdapter = dateAdapter;
@@ -5979,11 +5979,11 @@ class MatDuration {
         this.cd = cd;
         this.formGroupDir = formGroupDir;
         this._subscription = new Subscription();
-        this._onChangeCallback = noop$3;
-        this._onTouchedCallback = noop$3;
+        this._onChangeCallback = noop$5;
+        this._onTouchedCallback = noop$5;
         this.writing = true;
         this.disabling = false;
-        this.hourMask = HOUR_MASK;
+        this.hourMask = HOUR_MASK$1;
         this.disabled = false;
         this.floatLabel = 'auto';
         this.readonly = false;
@@ -6163,7 +6163,7 @@ MatDuration.decorators = [
                 selector: 'mat-duration-field',
                 template: "<!-- readonly -->\n<mat-form-field *ngIf=\"readonly else writable\">\n  <input matInput hidden type=\"text\" readonly=\"true\" [formControl]=\"formControl\">\n  <ion-text>{{ formControl.value|duration }}</ion-text>\n</mat-form-field>\n\n<!-- writable -->\n<ng-template #writable>\n  <mat-form-field [floatLabel]=\"floatLabel\"\n                  [class.mat-form-field-disabled]=\"formControl.disabled\"\n                  [class.mat-form-field-invalid]=\"formControl.touched && formControl.invalid\">\n    <mat-label *ngIf=\"placeholder && floatLabel != 'never'\" translate>COMMON.TIME</mat-label>\n\n    <div matPrefix><ng-content select=\"[matPrefix]\"></ng-content></div>\n\n    <input matInput #matInput type=\"text\"\n           autocomplete=\"off\"\n           [formControl]=\"textControl\"\n           [textMask]=\"{mask: hourMask, keepCharPositions: true, placeholderChar: placeholderChar, guide: true}\"\n           [placeholder]=\"'COMMON.DURATION_PLACEHOLDER'|translate\"\n           [required]=\"required\"\n           (keydown.tab)=\"moveCaretToSeparator($event, true)\"\n           (keydown.shift.tab)=\"moveCaretToSeparator($event, false)\"\n           (keyup.escape)=\"preventEvent($event)\"\n           (blur)=\"checkIfTouched()\"\n           [tabindex]=\"tabindex !== undefined ? tabindex+1 : undefined\">\n\n\n    <!-- errors -->\n    <mat-error *ngIf=\"!formControl.hasError('required') && textControl.hasError('pattern')\" translate>ERROR.FIELD_NOT_VALID_PATTERN</mat-error>\n    <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n    <mat-error *ngIf=\"formControl.hasError('min')\">\n      {{(compact ? 'ERROR.FIELD_MIN_COMPACT' : 'ERROR.FIELD_MIN') | translate:formControl.errors.min }}</mat-error>\n    <mat-error *ngIf=\"formControl.hasError('max')\">\n      {{(compact ? 'ERROR.FIELD_MAX_COMPACT' : 'ERROR.FIELD_MAX') | translate:formControl.errors.max }}</mat-error>\n\n    <ng-content select=\"mat-error\"></ng-content>\n  </mat-form-field>\n</ng-template>\n\n",
                 providers: [
-                    DEFAULT_VALUE_ACCESSOR$2,
+                    DEFAULT_VALUE_ACCESSOR$3,
                 ],
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 styles: [":host{display:inline-block;min-width:140px;position:relative;--ion-grid-column-padding:0}:host,mat-form-field{width:100%}mat-form-field .mat-form-field-subscript-wrapper{overflow:visible;top:100%}mat-form-field .mat-form-field-subscript-wrapper .mat-form-field-hint-wrapper{display:flex}mat-form-field .mat-form-field-subscript-wrapper .mat-form-field-hint-wrapper .mat-form-field-hint-spacer{flex:1 0 1em}mat-error{text-align:right;width:100%}"]
@@ -6220,22 +6220,22 @@ SharedMatDurationModule.decorators = [
             },] }
 ];
 
-const DEFAULT_VALUE_ACCESSOR$1 = {
+const DEFAULT_VALUE_ACCESSOR$4 = {
     provide: NG_VALUE_ACCESSOR,
     useExisting: forwardRef(() => MatBooleanField),
     multi: true
 };
-const noop$2 = () => {
+const noop$6 = () => {
 };
-const ɵ0$5 = noop$2;
+const ɵ0$7 = noop$6;
 class MatBooleanField {
     constructor(translate, formBuilder, cd, formGroupDir) {
         this.translate = translate;
         this.formBuilder = formBuilder;
         this.cd = cd;
         this.formGroupDir = formGroupDir;
-        this._onChangeCallback = noop$2;
-        this._onTouchedCallback = noop$2;
+        this._onChangeCallback = noop$6;
+        this._onTouchedCallback = noop$6;
         this._writing = false;
         this.showRadio = false;
         this.disabled = false;
@@ -6398,7 +6398,7 @@ MatBooleanField.decorators = [
                 selector: 'mat-boolean-field',
                 template: "<mat-form-field  *ngIf=\"readonly; else writable\"\n                 [floatLabel]=\"floatLabel\"\n                 class=\"mat-form-field-disabled {{classList}}\">\n  <div matPrefix>\n    <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n  </div>\n  <input matInput hidden type=\"text\" readonly\n         [placeholder]=\"placeholder\"\n         [formControl]=\"formControl\">\n  <ion-text>{{(formControl.value == null && 'COMMON.EMPTY_OPTION' || (formControl.value === true && yesLabel) || noLabel) | translate }}</ion-text>\n  <div matSuffix>\n    <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n  </div>\n</mat-form-field>\n\n<ng-template #writable>\n  <ng-container [ngSwitch]=\"style\">\n\n    <!-- Radio -->\n    <mat-form-field *ngSwitchCase=\"'radio'\"\n                    [floatLabel]=\"showRadio && (!floatLabel || floatLabel === 'auto') ? 'always': floatLabel\"\n                    class=\"mat-boolean-field mat-boolean-field-radio {{classList}}\">\n      <mat-label *ngIf=\"placeholder && floatLabel!=='never'\">\n        {{placeholder}}\n        <span [hidden]=\"showRadio\">({{yesLabel|translate}}/{{'COMMON.NO'|translate}})</span>\n      </mat-label>\n      <div matPrefix>\n        <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n      </div>\n      <input matInput #fakeInput type=\"text\" readonly=\"true\"\n             [formControl]=\"formControl\"\n             (focus)=\"_onFocusFakeInput($event)\"\n             [required]=\"required\"\n             [class.cdk-visually-hidden]=\"showRadio\"\n             [tabindex]=\"tabindex\">\n\n      <!-- radio button -->\n      <mat-radio-group [hidden]=\"!showRadio\"\n                       [formControl]=\"formControl\"\n                       (change)=\"onRadioValueChanged($event)\">\n        <mat-radio-button #yesButton [value]=\"true\">\n          <span>{{yesLabel|translate}}</span>\n        </mat-radio-button>&nbsp;\n        <mat-radio-button #noButton [value]=\"false\">\n          <span>{{noLabel|translate}}</span>\n        </mat-radio-button>\n      </mat-radio-group>\n\n      <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n\n      <div matSuffix>\n        <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n      </div>\n    </mat-form-field>\n\n    <!-- Checkbox -->\n    <mat-form-field *ngSwitchCase=\"'checkbox'\"\n                    [floatLabel]=\"floatLabel\"\n                    class=\"mat-boolean-field mat-boolean-field-checkbox {{classList}}\">\n      <mat-label *ngIf=\"placeholder && !showRadio\">\n        {{placeholder}}\n      </mat-label>\n      <div matPrefix>\n        <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n      </div>\n      <input matInput #matInput\n             [formControl]=\"formControl\"\n             (focus)=\"_onFocusFakeInput($event)\"\n             [required]=\"required\"\n             [class.cdk-visually-hidden]=\"showRadio\"\n             [tabindex]=\"tabindex\">\n\n      <ion-label>&nbsp;</ion-label>\n\n      <!-- checkbox, when compact -->\n      <mat-checkbox #checkboxButton\n                    [formControl]=\"formControl\"\n                    (change)=\"onCheckboxValueChanged($event)\"\n                    [indeterminate]=\"value===undefined\"\n                    [hidden]=\"!showRadio\"\n                    [tabindex]=\"tabindex\">\n      </mat-checkbox>\n\n      <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n\n      <div matSuffix>\n        <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n      </div>\n    </mat-form-field>\n\n    <!-- Buttons -->\n    <mat-form-field *ngSwitchCase=\"'button'\"\n                    [floatLabel]=\"floatLabel === 'never' ? 'never' : 'always'\"\n                    class=\"mat-boolean-field mat-boolean-field-button {{classList}}\">\n      <div matPrefix>\n        <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n      </div>\n      <input matInput type=\"text\" hidden\n             [formControl]=\"formControl\"\n             [placeholder]=\"placeholder\"\n             [required]=\"required\">\n      <div class=\"mat-form-field-buttons\"\n           [style.--buttons-col-count]=\"buttonsColCount\"\n           *ngIf=\"!formControl.disabled; else disabledLabel\">\n        <!-- yes -->\n        <ion-button class=\"mat-form-field-button\"\n                    [tabindex]=\"_tabindex\"\n                    (click)=\"writeValue(true, $event)\"\n                    (keyup.enter)=\"writeValue(true, $event)\"\n                    [color]=\"_value == null ? 'tertiary' : (_value === true) ? 'accent' : 'light'\">\n          <ion-icon *ngIf=\"showButtonIcons && yesIcon; let icon\" slot=\"start\" [name]=\"icon\"></ion-icon>\n          {{yesLabel|translate}}\n        </ion-button>\n\n        <!-- No button -->\n        <ion-button class=\"mat-form-field-button\"\n                    [tabindex]=\"_tabindex !== undefined ? (_tabindex + 1) : undefined\"\n                    (click)=\"writeValue(false, $event)\"\n                    (keyup.enter)=\"writeValue(false, $event)\"\n                    [color]=\"_value == null ? 'tertiary' : (_value === false) ? 'accent' : 'light'\">\n          <ion-icon *ngIf=\"showButtonIcons && noIcon; let icon\" slot=\"start\" [name]=\"icon\"></ion-icon>\n          {{noLabel|translate}}\n        </ion-button>\n      </div>\n      <ng-template #disabledLabel>\n        <ion-label><i translate>COMMON.EMPTY_OPTION</i></ion-label>\n      </ng-template>\n\n      <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n      <div matSuffix>\n        <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n      </div>\n\n    </mat-form-field>\n  </ng-container>\n\n</ng-template>\n\n\n<ng-template #matPrefixTemplate>\n  <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n<ng-template #matSuffixTemplate>\n  <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n",
                 providers: [
-                    DEFAULT_VALUE_ACCESSOR$1
+                    DEFAULT_VALUE_ACCESSOR$4
                 ],
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 styles: [":host{width:100%}.mat-form-field.mat-boolean-field-radio{margin-top:-2px}.mat-form-field.mat-boolean-field-button{margin-top:-4px}.mat-form-field .mat-form-field-buttons{width:100%;display:flex;flex-flow:row wrap;justify-content:flex-start;align-items:center}.mat-form-field .mat-form-field-buttons .mat-form-field-button{--flex-basis:calc(100% / var(--buttons-col-count, 2));flex:0 1 var(--flex-basis);max-width:min(var(--flex-basis),150px);white-space:normal;padding:0 2px;height:40px}"]
@@ -6644,7 +6644,7 @@ class MatNumpadDomService {
         this.appRef.detachView(this.componentRef.hostView);
     }
 }
-MatNumpadDomService.ɵprov = i0.ɵɵdefineInjectable({ factory: function MatNumpadDomService_Factory() { return new MatNumpadDomService(i0.ɵɵinject(i0.ComponentFactoryResolver), i0.ɵɵinject(i0.ApplicationRef), i0.ɵɵinject(i0.INJECTOR), i0.ɵɵinject(i1$3.DOCUMENT, 8)); }, token: MatNumpadDomService, providedIn: "root" });
+MatNumpadDomService.ɵprov = ɵɵdefineInjectable({ factory: function MatNumpadDomService_Factory() { return new MatNumpadDomService(ɵɵinject(ComponentFactoryResolver), ɵɵinject(ApplicationRef), ɵɵinject(INJECTOR), ɵɵinject(DOCUMENT, 8)); }, token: MatNumpadDomService, providedIn: "root" });
 MatNumpadDomService.decorators = [
     { type: Injectable, args: [{
                 providedIn: 'root'
@@ -7008,7 +7008,7 @@ SharedMatNumpadModule.decorators = [
             },] }
 ];
 
-const DEFAULT_VALUE_ACCESSOR = {
+const DEFAULT_VALUE_ACCESSOR$5 = {
     provide: NG_VALUE_ACCESSOR,
     useExisting: forwardRef(() => MatSwipeField),
     multi: true
@@ -7271,7 +7271,7 @@ MatSwipeField.decorators = [
     { type: Component, args: [{
                 selector: 'mat-swipe-field',
                 template: "<mat-form-field [floatLabel]=\"showSlides && (!floatLabel || floatLabel === 'auto') ? 'always': floatLabel\"\n                [class]=\"classList\"\n                [class.mat-form-field-disabled]=\"disabled\">\n  <mat-label *ngIf=\"placeholder && floatLabel!=='never'\">\n    {{placeholder}}\n  </mat-label>\n  <input matInput #fakeInput type=\"text\"\n         [formControl]=\"formControl\"\n         [readonly]=\"true\"\n         (focus)=\"_onFocusFakeInput($event)\"\n         [required]=\"required\"\n         [class.cdk-visually-hidden]=\"showSlides\"\n         [tabindex]=\"tabindex\">\n\n  <div class=\"slides-container\" [class.hidden]=\"!showSlides\">\n    <ion-slides #slides\n                [options]=\"slidesOptions\"\n                (ionSlidesDidLoad)=\"slidesLoaded()\"\n                (ionSlideReachStart)=\"reachStart(true)\"\n                (ionSlideReachEnd)=\"reachEnd(true)\"\n                (ionSlideNextEnd)=\"reachStart(false)\"\n                (ionSlidePrevEnd)=\"reachEnd(false)\"\n                (ionSlideDidChange)=\"slideChanged()\"\n    >\n      <ion-slide *ngFor=\"let item of $items | async\">\n        <ion-label>{{ displayWith(item) }}</ion-label>\n      </ion-slide>\n\n    </ion-slides>\n  </div>\n\n  <button #prevButton\n          mat-icon-button\n          type=\"button\"\n          class=\"button-prev\"\n          [hidden]=\"!showSlides\"\n          [disabled]=\"previousDisabled\"\n          (click)=\"previous()\">\n    <mat-icon>chevron_left</mat-icon>\n  </button>\n  <button #nextButton\n          mat-icon-button\n          type=\"button\"\n          class=\"button-next\"\n          [hidden]=\"!showSlides\"\n          [disabled]=\"nextDisabled\"\n          (click)=\"next()\">\n    <mat-icon>chevron_right</mat-icon>\n  </button>\n\n  <button matSuffix mat-icon-button tabindex=\"-1\"\n          type=\"button\"\n          *ngIf=\"clearable\"\n          (click)=\"clearValue($event)\"\n          [hidden]=\"disabled || !formControl.value\">\n    <mat-icon>close</mat-icon>\n  </button>\n\n  <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n  <mat-error *ngIf=\"formControl.hasError('entity')\" translate>ERROR.FIELD_INVALID</mat-error>\n\n</mat-form-field>\n",
-                providers: [DEFAULT_VALUE_ACCESSOR],
+                providers: [DEFAULT_VALUE_ACCESSOR$5],
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 styles: [":host{display:inline-block;width:100%;position:relative}input.hidden{display:none}.slides-container .swiper-slide{font-size:16px!important}.slides-container.hidden{visibility:hidden;height:0!important}.button-next,.button-prev{position:absolute;top:calc(50% - 20px);z-index:10}.button-prev{left:0;right:auto}.button-next{left:auto;right:0}"]
             },] }
@@ -7329,14 +7329,14 @@ SharedMatSwipeModule.decorators = [
             },] }
 ];
 
-const noop$1 = () => { };
-const ɵ0$4 = noop$1;
+const noop$7 = () => { };
+const ɵ0$8 = noop$7;
 class MatChipsField {
     constructor(cd, formGroupDir) {
         this.cd = cd;
         this.formGroupDir = formGroupDir;
-        this._onChangeCallback = noop$1;
-        this._onTouchedCallback = noop$1;
+        this._onChangeCallback = noop$7;
+        this._onTouchedCallback = noop$7;
         this.logPrefix = '[mat-chips] ';
         this.formControlName = null;
         this.required = false;
@@ -8208,7 +8208,7 @@ class ProgressBarService {
         }
     }
 }
-ProgressBarService.ɵprov = i0.ɵɵdefineInjectable({ factory: function ProgressBarService_Factory() { return new ProgressBarService(); }, token: ProgressBarService, providedIn: "root" });
+ProgressBarService.ɵprov = ɵɵdefineInjectable({ factory: function ProgressBarService_Factory() { return new ProgressBarService(); }, token: ProgressBarService, providedIn: "root" });
 ProgressBarService.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -8252,7 +8252,7 @@ class AppGestureConfig extends HammerGestureConfig {
         return mc;
     }
 }
-AppGestureConfig.ɵprov = i0.ɵɵdefineInjectable({ factory: function AppGestureConfig_Factory() { return new AppGestureConfig(); }, token: AppGestureConfig, providedIn: "root" });
+AppGestureConfig.ɵprov = ɵɵdefineInjectable({ factory: function AppGestureConfig_Factory() { return new AppGestureConfig(); }, token: AppGestureConfig, providedIn: "root" });
 AppGestureConfig.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -8477,7 +8477,7 @@ class MatPaginatorI18n extends MatPaginatorIntl {
         this.previousPageLabel = this.translate.instant('COMMON.PAGINATOR.PREVIOUS_PAGE');
     }
 }
-MatPaginatorI18n.ɵprov = i0.ɵɵdefineInjectable({ factory: function MatPaginatorI18n_Factory() { return new MatPaginatorI18n(i0.ɵɵinject(i1$1.TranslateService)); }, token: MatPaginatorI18n, providedIn: "root" });
+MatPaginatorI18n.ɵprov = ɵɵdefineInjectable({ factory: function MatPaginatorI18n_Factory() { return new MatPaginatorI18n(ɵɵinject(TranslateService)); }, token: MatPaginatorI18n, providedIn: "root" });
 MatPaginatorI18n.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -8567,17 +8567,17 @@ function getColorContrast(color, bw) {
     return rgbArrayToHex(rgb.map(v => 255 - v));
 }
 
-const noop = () => {
+const noop$8 = () => {
 };
-const ɵ0$3 = noop;
+const ɵ0$9 = noop$8;
 class AppFormField {
     constructor(translate, cd, injector, formGroupDir) {
         this.translate = translate;
         this.cd = cd;
         this.injector = injector;
         this.formGroupDir = formGroupDir;
-        this._onChangeCallback = noop;
-        this._onTouchedCallback = noop;
+        this._onChangeCallback = noop$8;
+        this._onTouchedCallback = noop$8;
         this.readonly = false;
         this.compact = false;
         this.floatLabel = 'auto';
@@ -9013,14 +9013,14 @@ class AudioProvider extends StartableService {
         });
     }
 }
-AudioProvider.ɵprov = i0.ɵɵdefineInjectable({ factory: function AudioProvider_Factory() { return new AudioProvider(i0.ɵɵinject(i1$4.Platform), i0.ɵɵinject(i2.NativeAudio, 8), i0.ɵɵinject(i3.Vibration, 8), i0.ɵɵinject(i4.AudioManagement, 8)); }, token: AudioProvider, providedIn: "root" });
+AudioProvider.ɵprov = ɵɵdefineInjectable({ factory: function AudioProvider_Factory() { return new AudioProvider(ɵɵinject(Platform), ɵɵinject(NativeAudio, 8), ɵɵinject(Vibration, 8), ɵɵinject(AudioManagement$1, 8)); }, token: AudioProvider, providedIn: "root" });
 AudioProvider.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
 AudioProvider.ctorParameters = () => [
     { type: Platform },
-    { type: NativeAudio, decorators: [{ type: Optional }] },
-    { type: Vibration, decorators: [{ type: Optional }] },
+    { type: NativeAudio$1, decorators: [{ type: Optional }] },
+    { type: Vibration$1, decorators: [{ type: Optional }] },
     { type: AudioManagement, decorators: [{ type: Optional }] }
 ];
 
@@ -9105,7 +9105,7 @@ class Hotkeys {
         });
     }
 }
-Hotkeys.ɵprov = i0.ɵɵdefineInjectable({ factory: function Hotkeys_Factory() { return new Hotkeys(i0.ɵɵinject(i1$5.EventManager), i0.ɵɵinject(i2$1.MatDialog), i0.ɵɵinject(i1$3.DOCUMENT), i0.ɵɵinject(i1$4.ModalController), i0.ɵɵinject(i1$4.PopoverController)); }, token: Hotkeys, providedIn: "root" });
+Hotkeys.ɵprov = ɵɵdefineInjectable({ factory: function Hotkeys_Factory() { return new Hotkeys(ɵɵinject(EventManager), ɵɵinject(MatDialog), ɵɵinject(DOCUMENT), ɵɵinject(ModalController), ɵɵinject(PopoverController)); }, token: Hotkeys, providedIn: "root" });
 Hotkeys.decorators = [
     { type: Injectable, args: [{
                 providedIn: 'root'
@@ -9280,7 +9280,7 @@ class Base64ImageReader {
     }
 }
 
-const uuidv4$1 = uuidv4Imported;
+const uuidv4 = uuidv4Imported;
 class FileService {
     constructor(platform, 
     //private transfer: FileTransfer,
@@ -9317,7 +9317,7 @@ class FileService {
             const lastSlashIndex = source.lastIndexOf('/');
             if (lastSlashIndex === -1)
                 throw new Error('Invalid URL: ' + source);
-            const fileName = lastSlashIndex < (source.length - 1) && source.substring(lastSlashIndex + 1) || uuidv4$1();
+            const fileName = lastSlashIndex < (source.length - 1) && source.substring(lastSlashIndex + 1) || uuidv4();
             // Download into the file system
             if (responseType === 'file' && this.canUseFileSystem) {
                 console.warn(`WARN: [file] Fetching image {${source}} in local file...`);
@@ -9373,7 +9373,7 @@ class FileService {
         this._started = true;
     }
 }
-FileService.ɵprov = i0.ɵɵdefineInjectable({ factory: function FileService_Factory() { return new FileService(i0.ɵɵinject(i1$4.Platform), i0.ɵɵinject(i2$2.HttpClient), i0.ɵɵinject(ENVIRONMENT)); }, token: FileService, providedIn: "root" });
+FileService.ɵprov = ɵɵdefineInjectable({ factory: function FileService_Factory() { return new FileService(ɵɵinject(Platform), ɵɵinject(HttpClient), ɵɵinject(ENVIRONMENT)); }, token: FileService, providedIn: "root" });
 FileService.decorators = [
     { type: Injectable, args: [{
                 providedIn: 'root',
@@ -9539,7 +9539,7 @@ class Base58 {
 Base58.alphabet = '123456789ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz';
 
 const scrypt = require('scrypt-async');
-const sha256$1 = require('hash.js/lib/hash/sha/256');
+const sha256 = require('hash.js/lib/hash/sha/256');
 const sha512 = require('hash.js/lib/hash/sha/512');
 const nacl = {
     sign,
@@ -9643,7 +9643,7 @@ class CryptoService {
      * Hash (using SHA256) a message
      */
     sha256(message) {
-        return sha256$1().update(message).digest('hex');
+        return sha256().update(message).digest('hex');
     }
     /**
      * Hash (using SHA512) a message
@@ -9656,7 +9656,7 @@ class CryptoService {
         return nacl.util.encodeBase64(m);
     }
 }
-CryptoService.ɵprov = i0.ɵɵdefineInjectable({ factory: function CryptoService_Factory() { return new CryptoService(); }, token: CryptoService, providedIn: "root" });
+CryptoService.ɵprov = ɵɵdefineInjectable({ factory: function CryptoService_Factory() { return new CryptoService(); }, token: CryptoService, providedIn: "root" });
 CryptoService.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -10416,7 +10416,7 @@ SelectPeerModal.propDecorators = {
     onRefresh: [{ type: Input }]
 };
 
-const moment$4 = momentImported;
+const moment$3 = momentImported;
 const SETTINGS_STORAGE_KEY = 'settings';
 const SETTINGS_TRANSIENT_PROPERTIES = ['mobile', 'touchUi' /*deprecated*/];
 // fixme: this constant points to static environment
@@ -10659,11 +10659,11 @@ class LocalSettingsService extends StartableService {
         if (!feature) {
             feature = {
                 name: featureName.toLowerCase(),
-                lastSyncDate: moment$4().toISOString()
+                lastSyncDate: moment$3().toISOString()
             };
         }
         else {
-            feature.lastSyncDate = moment$4().toISOString();
+            feature.lastSyncDate = moment$3().toISOString();
         }
         this.saveOfflineFeature(feature);
     }
@@ -10824,7 +10824,7 @@ class LocalSettingsService extends StartableService {
         if (!page || !page.title || !page.path)
             throw Error('Missing required argument \'page\', \'page.path\' or \'page.title\'');
         // Set time
-        page.time = page.time || moment$4();
+        page.time = page.time || moment$3();
         // Clean the title (remove <small> tags)
         if (!opts || opts.removeTitleSmallTag !== false) {
             const tagIndex = page.title.indexOf('</small>');
@@ -10840,18 +10840,18 @@ class LocalSettingsService extends StartableService {
         return page;
     }
 }
-LocalSettingsService.ɵprov = i0.ɵɵdefineInjectable({ factory: function LocalSettingsService_Factory() { return new LocalSettingsService(i0.ɵɵinject(i1$1.TranslateService), i0.ɵɵinject(i1$4.Platform), i0.ɵɵinject(i3$1.Storage), i0.ɵɵinject(ENVIRONMENT), i0.ɵɵinject(APP_LOCAL_SETTINGS, 8), i0.ɵɵinject(APP_LOCAL_SETTINGS_OPTIONS, 8)); }, token: LocalSettingsService, providedIn: "root" });
+LocalSettingsService.ɵprov = ɵɵdefineInjectable({ factory: function LocalSettingsService_Factory() { return new LocalSettingsService(ɵɵinject(TranslateService), ɵɵinject(Platform), ɵɵinject(Storage), ɵɵinject(ENVIRONMENT), ɵɵinject(APP_LOCAL_SETTINGS, 8), ɵɵinject(APP_LOCAL_SETTINGS_OPTIONS, 8)); }, token: LocalSettingsService, providedIn: "root" });
 LocalSettingsService.decorators = [
     { type: Injectable, args: [{
-                providedIn: 'root',
-                deps: [APP_LOCAL_SETTINGS, APP_LOCAL_SETTINGS_OPTIONS]
+                providedIn: 'root'
+                //deps: [APP_LOCAL_SETTINGS, APP_LOCAL_SETTINGS_OPTIONS]
             },] }
 ];
 LocalSettingsService.ctorParameters = () => [
     { type: TranslateService },
     { type: Platform },
     { type: Storage },
-    { type: undefined, decorators: [{ type: Inject, args: [ENVIRONMENT,] }] },
+    { type: Environment, decorators: [{ type: Inject, args: [ENVIRONMENT,] }] },
     { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [APP_LOCAL_SETTINGS,] }] },
     { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [APP_LOCAL_SETTINGS_OPTIONS,] }] }
 ];
@@ -11557,7 +11557,7 @@ class NetworkService extends StartableService {
         });
     }
 }
-NetworkService.ɵprov = i0.ɵɵdefineInjectable({ factory: function NetworkService_Factory() { return new NetworkService(i0.ɵɵinject(i1$3.DOCUMENT), i0.ɵɵinject(i1$4.Platform), i0.ɵɵinject(i1$4.ModalController), i0.ɵɵinject(CryptoService), i0.ɵɵinject(i3$1.Storage), i0.ɵɵinject(LocalSettingsService), i0.ɵɵinject(i6.CacheService), i0.ɵɵinject(i2$2.HttpClient), i0.ɵɵinject(ENVIRONMENT), i0.ɵɵinject(i9.Network, 8), i0.ɵɵinject(i10.SplashScreen, 8), i0.ɵɵinject(i1$1.TranslateService, 8), i0.ɵɵinject(i1$4.ToastController, 8)); }, token: NetworkService, providedIn: "root" });
+NetworkService.ɵprov = ɵɵdefineInjectable({ factory: function NetworkService_Factory() { return new NetworkService(ɵɵinject(DOCUMENT), ɵɵinject(Platform), ɵɵinject(ModalController), ɵɵinject(CryptoService), ɵɵinject(Storage), ɵɵinject(LocalSettingsService), ɵɵinject(CacheService), ɵɵinject(HttpClient), ɵɵinject(ENVIRONMENT), ɵɵinject(Network, 8), ɵɵinject(SplashScreen, 8), ɵɵinject(TranslateService, 8), ɵɵinject(ToastController, 8)); }, token: NetworkService, providedIn: "root" });
 NetworkService.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -11568,16 +11568,16 @@ NetworkService.ctorParameters = () => [
     { type: CryptoService },
     { type: Storage },
     { type: LocalSettingsService },
-    { type: CacheService },
+    { type: CacheService$1 },
     { type: HttpClient },
     { type: undefined, decorators: [{ type: Inject, args: [ENVIRONMENT,] }] },
-    { type: Network, decorators: [{ type: Optional }] },
-    { type: SplashScreen, decorators: [{ type: Optional }] },
+    { type: Network$1, decorators: [{ type: Optional }] },
+    { type: SplashScreen$1, decorators: [{ type: Optional }] },
     { type: TranslateService, decorators: [{ type: Optional }] },
     { type: ToastController, decorators: [{ type: Optional }] }
 ];
 
-const ErrorCodes$2 = {
+const ErrorCodes = {
     UNKNOWN_ERROR: 0,
     LOAD_ACCOUNT_ERROR: 1,
     BAD_PASSWORD: 2,
@@ -11929,7 +11929,7 @@ class EntityStore {
                 }
                 catch (err) {
                     console.error(err);
-                    throw { code: ErrorCodes$2.ENTITY_STORAGE_MIGRATION_FAILED, message: 'ERROR.ENTITY_STORAGE_MIGRATION_FAILED', details: err };
+                    throw { code: ErrorCodes.ENTITY_STORAGE_MIGRATION_FAILED, message: 'ERROR.ENTITY_STORAGE_MIGRATION_FAILED', details: err };
                 }
             }
             // Emit update event
@@ -12503,7 +12503,7 @@ class EntitiesStorage extends StartableService {
 }
 EntitiesStorage.TRASH_PREFIX = 'Trash#';
 EntitiesStorage.REMOTE_PREFIX = 'Remote#';
-EntitiesStorage.ɵprov = i0.ɵɵdefineInjectable({ factory: function EntitiesStorage_Factory() { return new EntitiesStorage(i0.ɵɵinject(i1$4.Platform), i0.ɵɵinject(ProgressBarService), i0.ɵɵinject(i3$1.Storage), i0.ɵɵinject(ENVIRONMENT), i0.ɵɵinject(APP_LOCAL_STORAGE_TYPE_POLICIES, 8)); }, token: EntitiesStorage, providedIn: "root" });
+EntitiesStorage.ɵprov = ɵɵdefineInjectable({ factory: function EntitiesStorage_Factory() { return new EntitiesStorage(ɵɵinject(Platform), ɵɵinject(ProgressBarService), ɵɵinject(Storage), ɵɵinject(ENVIRONMENT), ɵɵinject(APP_LOCAL_STORAGE_TYPE_POLICIES, 8)); }, token: EntitiesStorage, providedIn: "root" });
 EntitiesStorage.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -12640,10 +12640,10 @@ function referentialToString(obj, properties) {
 function referentialsToString(values, properties, separator) {
     return (values || []).map(v => referentialToString(v, properties)).join(separator || ', ');
 }
-const ɵ0$2 = StatusIds.ENABLE, ɵ1 = StatusIds.DISABLE, ɵ2 = StatusIds.TEMPORARY;
+const ɵ0$a = StatusIds.ENABLE, ɵ1 = StatusIds.DISABLE, ɵ2 = StatusIds.TEMPORARY;
 const StatusList = Object.freeze([
     {
-        id: ɵ0$2,
+        id: ɵ0$a,
         icon: 'checkmark',
         label: 'REFERENTIAL.STATUS_ENUM.ENABLE'
     },
@@ -12918,7 +12918,7 @@ function accountToString(data) {
             (data.lastName || '')) || '';
 }
 
-const uuidv4 = uuidv4Imported;
+const uuidv4$1 = uuidv4Imported;
 const _global = typeof global !== 'undefined' ? global : (typeof window !== 'undefined' ? window : {});
 const NativeWebSocket = _global.WebSocket || _global.MozWebSocket;
 /**
@@ -12962,7 +12962,7 @@ function createTrackerLink(opts) {
         // Skip if not tracked
         if (!context || !context.tracked)
             return forward(operation);
-        const id = context.serializationKey || uuidv4();
+        const id = context.serializationKey || uuidv4$1();
         console.debug(`[apollo-tracker-link] Watching tracked query {${operation.operationName}#${id}}`);
         // Clean context, before calling JSON.stringify (remove unused attributes)
         const cleanContext = Object.assign(Object.assign({}, context), { optimisticResponse: null, cache: null });
@@ -13625,7 +13625,7 @@ class GraphqlService extends StartableService {
         (err.networkError && ((err.networkError.error && this.toAppError(err.networkError.error))
             || this.toAppError(err.networkError)
             || (err.networkError.error && this.createAppErrorByCode(err.networkError.error.status))
-            || this.createAppErrorByCode(ErrorCodes$2.UNKNOWN_NETWORK_ERROR)))
+            || this.createAppErrorByCode(ErrorCodes.UNKNOWN_NETWORK_ERROR)))
             // If graphQL: try to convert the first error found
             || (err.graphQLErrors && err.graphQLErrors.length && this.toAppError(err.graphQLErrors[0]))
             || this.toAppError(err)
@@ -13633,7 +13633,7 @@ class GraphqlService extends StartableService {
             || (err.graphQLErrors && err.graphQLErrors[0])
             || err;
         console.error('[graphql] ' + (error && error.message || error), error.stack || '');
-        if (error && error.code === ErrorCodes$2.UNKNOWN_NETWORK_ERROR && err.networkError && err.networkError.message) {
+        if (error && error.code === ErrorCodes.UNKNOWN_NETWORK_ERROR && err.networkError && err.networkError.message) {
             console.error('[graphql] original error: ' + err.networkError.message);
             this.onNetworkError.next(error);
         }
@@ -13669,7 +13669,7 @@ class GraphqlService extends StartableService {
                 return 'ERROR.UNAUTHORIZED';
             case ServerErrorCodes.FORBIDDEN:
                 return 'ERROR.FORBIDDEN';
-            case ErrorCodes$2.UNKNOWN_NETWORK_ERROR:
+            case ErrorCodes.UNKNOWN_NETWORK_ERROR:
                 return 'ERROR.UNKNOWN_NETWORK_ERROR';
             case ServerErrorCodes.BAD_UPDATE_DATE:
                 return 'ERROR.BAD_UPDATE_DATE';
@@ -13700,7 +13700,7 @@ class GraphqlService extends StartableService {
         return undefined;
     }
 }
-GraphqlService.ɵprov = i0.ɵɵdefineInjectable({ factory: function GraphqlService_Factory() { return new GraphqlService(i0.ɵɵinject(i1$4.Platform), i0.ɵɵinject(i2$3.Apollo), i0.ɵɵinject(i3$2.HttpLink), i0.ɵɵinject(NetworkService), i0.ɵɵinject(i3$1.Storage), i0.ɵɵinject(CryptoService), i0.ɵɵinject(ENVIRONMENT), i0.ɵɵinject(APP_GRAPHQL_TYPE_POLICIES, 8)); }, token: GraphqlService, providedIn: "root" });
+GraphqlService.ɵprov = ɵɵdefineInjectable({ factory: function GraphqlService_Factory() { return new GraphqlService(ɵɵinject(Platform), ɵɵinject(Apollo), ɵɵinject(HttpLink), ɵɵinject(NetworkService), ɵɵinject(Storage), ɵɵinject(CryptoService), ɵɵinject(ENVIRONMENT), ɵɵinject(APP_GRAPHQL_TYPE_POLICIES, 8)); }, token: GraphqlService, providedIn: "root" });
 GraphqlService.decorators = [
     { type: Injectable, args: [{
                 providedIn: 'root'
@@ -13717,7 +13717,7 @@ GraphqlService.ctorParameters = () => [
     { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [APP_GRAPHQL_TYPE_POLICIES,] }] }
 ];
 
-const sha256 = require('hash.js/lib/hash/sha/256');
+const sha256$1 = require('hash.js/lib/hash/sha/256');
 class BaseGraphqlServiceOptions {
 }
 // eslint-disable-next-line @angular-eslint/directive-class-suffix
@@ -13868,8 +13868,8 @@ class BaseGraphqlService extends StartableService {
     }
     /* -- protected methods -- */
     computeMutableWatchQueryId(opts) {
-        const queryName = opts.queryName || sha256().update(JSON.stringify(opts.query)).digest('hex').substring(0, 8);
-        const variablesKey = opts.variables && sha256().update(JSON.stringify(opts.variables)).digest('hex').substring(0, 8) || '';
+        const queryName = opts.queryName || sha256$1().update(JSON.stringify(opts.query)).digest('hex').substring(0, 8);
+        const variablesKey = opts.variables && sha256$1().update(JSON.stringify(opts.variables)).digest('hex').substring(0, 8) || '';
         return [queryName, opts.arrayFieldName, variablesKey].join('|');
     }
     findMutableWatchQueries(opts) {
@@ -13939,7 +13939,7 @@ const DEFAULT_AVATAR_IMAGE = 'assets/img/person.png';
 /* ------------------------------------
  * GraphQL queries
  * ------------------------------------*/
-const Fragments$1 = {
+const Fragments = {
     account: gql `
     fragment AccountFragment on AccountVO {
       id
@@ -13974,14 +13974,14 @@ const Fragments$1 = {
   }`
 };
 // Load account query
-const LoadQuery$1 = gql `
+const LoadQuery = gql `
   query Account {
     data: account {
       ...AccountFragment
     }
   }
-  ${Fragments$1.account}
-  ${Fragments$1.settings}
+  ${Fragments.account}
+  ${Fragments.settings}
 `;
 // Check email query
 const IsEmailExistsQuery = gql `
@@ -13996,21 +13996,21 @@ const AccountMutations = {
       ...AccountFragment
     }
   }
-  ${Fragments$1.account}
-  ${Fragments$1.settings}`,
+  ${Fragments.account}
+  ${Fragments.settings}`,
     create: gql `mutation CreateAccount($data:AccountVOInput){
     data: createAccount(account: $data){
       ...AccountFragment
     }
   }
-  ${Fragments$1.account}
-  ${Fragments$1.settings}`,
+  ${Fragments.account}
+  ${Fragments.settings}`,
     saveSettings: gql `mutation SaveSettings($data:UserSettingsVOInput){
     data: saveSettings(settings: $data){
       ...UserSettingsFragment
     }
   }
-  ${Fragments$1.settings}`
+  ${Fragments.settings}`
 };
 // Sent confirmation email
 const SendConfirmEmailMutation = gql `
@@ -14325,7 +14325,7 @@ class AccountService extends BaseGraphqlService {
             catch (error) {
                 console.error(error);
                 this.resetData();
-                throw { code: ErrorCodes$2.UNKNOWN_ERROR, message: 'ERROR.SCRYPT_ERROR' };
+                throw { code: ErrorCodes.UNKNOWN_ERROR, message: 'ERROR.SCRYPT_ERROR' };
             }
             // Store pubkey+keypair
             this._cache.pubkey = Base58.encode(keypair.publicKey);
@@ -14359,7 +14359,7 @@ class AccountService extends BaseGraphqlService {
             }
             catch (err) {
                 // If account not found, check if email is valid
-                if (err && +(err.code) === ErrorCodes$2.LOAD_ACCOUNT_ERROR) {
+                if (err && +(err.code) === ErrorCodes.LOAD_ACCOUNT_ERROR) {
                     // Check email exists
                     if (data.username.indexOf('@') !== -1) {
                         let isEmailExists;
@@ -14371,11 +14371,11 @@ class AccountService extends BaseGraphqlService {
                         }
                         // Email not exists (no account)
                         if (!isEmailExists) {
-                            throw { code: ErrorCodes$2.UNKNOWN_ACCOUNT_EMAIL, message: 'ERROR.UNKNOWN_ACCOUNT_EMAIL' };
+                            throw { code: ErrorCodes.UNKNOWN_ACCOUNT_EMAIL, message: 'ERROR.UNKNOWN_ACCOUNT_EMAIL' };
                         }
                     }
                     // Email exists, so error = 'bad password'
-                    throw { code: ErrorCodes$2.BAD_PASSWORD, message: 'ERROR.BAD_PASSWORD' };
+                    throw { code: ErrorCodes.BAD_PASSWORD, message: 'ERROR.BAD_PASSWORD' };
                 }
                 throw err; // resend the first error
             }
@@ -14521,8 +14521,8 @@ class AccountService extends BaseGraphqlService {
             // Load remotely
             else {
                 const { data } = yield this.graphql.query({
-                    query: LoadQuery$1,
-                    error: { code: ErrorCodes$2.LOAD_ACCOUNT_ERROR, message: 'ERROR.LOAD_ACCOUNT_ERROR' },
+                    query: LoadQuery,
+                    error: { code: ErrorCodes.LOAD_ACCOUNT_ERROR, message: 'ERROR.LOAD_ACCOUNT_ERROR' },
                     fetchPolicy: opts && opts.fetchPolicy || 'no-cache' || undefined
                 });
                 json = data;
@@ -14549,7 +14549,7 @@ class AccountService extends BaseGraphqlService {
         return __awaiter(this, void 0, void 0, function* () {
             const isEmailExists = yield this.isEmailExists(email);
             if (isEmailExists) {
-                throw { code: ErrorCodes$2.EMAIL_ALREADY_REGISTERED, message: 'ERROR.EMAIL_ALREADY_REGISTERED' };
+                throw { code: ErrorCodes.EMAIL_ALREADY_REGISTERED, message: 'ERROR.EMAIL_ALREADY_REGISTERED' };
             }
         });
     }
@@ -14585,7 +14585,7 @@ class AccountService extends BaseGraphqlService {
                     locale
                 },
                 error: {
-                    code: ErrorCodes$2.SENT_CONFIRMATION_EMAIL_FAILED,
+                    code: ErrorCodes.SENT_CONFIRMATION_EMAIL_FAILED,
                     message: 'ERROR.SENT_ACCOUNT_CONFIRMATION_EMAIL_FAILED'
                 }
             });
@@ -14601,7 +14601,7 @@ class AccountService extends BaseGraphqlService {
                     code
                 },
                 error: {
-                    code: ErrorCodes$2.CONFIRM_EMAIL_FAILED,
+                    code: ErrorCodes.CONFIRM_EMAIL_FAILED,
                     message: 'ERROR.CONFIRM_ACCOUNT_EMAIL_FAILED'
                 }
             });
@@ -14680,7 +14680,7 @@ class AccountService extends BaseGraphqlService {
                     throw error;
                 console.error(error);
                 throw {
-                    code: ErrorCodes$2.LOAD_ACCOUNT_ERROR,
+                    code: ErrorCodes.LOAD_ACCOUNT_ERROR,
                     message: 'ERROR.LOAD_ACCOUNT_ERROR'
                 };
             }
@@ -14850,7 +14850,7 @@ class AccountService extends BaseGraphqlService {
             if (!isNew) {
                 const existingAccount = yield this.load({ fetchPolicy: 'network-only' });
                 if (!existingAccount || !existingAccount.updateDate) {
-                    throw { code: ErrorCodes$2.ACCOUNT_NOT_EXISTS, message: 'ERROR.ACCOUNT_NOT_EXISTS' };
+                    throw { code: ErrorCodes.ACCOUNT_NOT_EXISTS, message: 'ERROR.ACCOUNT_NOT_EXISTS' };
                 }
                 this.copyIdAndUpdateDate(existingAccount, account);
             }
@@ -14862,7 +14862,7 @@ class AccountService extends BaseGraphqlService {
                 mutation: isNew ? AccountMutations.create : AccountMutations.save,
                 variables: { data: json },
                 error: {
-                    code: ErrorCodes$2.SAVE_ACCOUNT_ERROR,
+                    code: ErrorCodes.SAVE_ACCOUNT_ERROR,
                     message: 'ERROR.SAVE_ACCOUNT_ERROR'
                 }
             });
@@ -14889,7 +14889,7 @@ class AccountService extends BaseGraphqlService {
                 mutation: AccountMutations.saveSettings,
                 variables: { data: json },
                 error: {
-                    code: ErrorCodes$2.SAVE_SETTINGS_ERROR,
+                    code: ErrorCodes.SAVE_SETTINGS_ERROR,
                     message: 'ERROR.SAVE_SETTINGS_ERROR'
                 }
             });
@@ -14911,7 +14911,7 @@ class AccountService extends BaseGraphqlService {
             if (counter > 4) {
                 if (this._debug)
                     console.debug(`[account] Failed to authentication on pod (after ${counter} attempts)`);
-                throw { code: ErrorCodes$2.AUTH_SERVER_ERROR, message: 'ERROR.AUTH_SERVER_ERROR' };
+                throw { code: ErrorCodes.AUTH_SERVER_ERROR, message: 'ERROR.AUTH_SERVER_ERROR' };
             }
             // Check if valid
             if (token) {
@@ -14921,7 +14921,7 @@ class AccountService extends BaseGraphqlService {
                         token
                     },
                     error: {
-                        code: ErrorCodes$2.UNAUTHORIZED,
+                        code: ErrorCodes.UNAUTHORIZED,
                         message: 'ERROR.UNAUTHORIZED'
                     },
                     fetchPolicy: 'no-cache'
@@ -14937,7 +14937,7 @@ class AccountService extends BaseGraphqlService {
             }
             // Generate a new token
             const challengeError = {
-                code: ErrorCodes$2.AUTH_CHALLENGE_ERROR,
+                code: ErrorCodes.AUTH_CHALLENGE_ERROR,
                 message: 'ERROR.AUTH_CHALLENGE_ERROR'
             };
             const data = yield this.graphql.query({
@@ -15015,7 +15015,7 @@ class AccountService extends BaseGraphqlService {
             query: AccountSubscriptions.listenChanges,
             variables,
             error: {
-                code: ErrorCodes$2.SUBSCRIBE_ACCOUNT_ERROR,
+                code: ErrorCodes.SUBSCRIBE_ACCOUNT_ERROR,
                 message: 'ERROR.ACCOUNT.SUBSCRIBE_ERROR'
             }
         }).pipe(map(({ data }) => data), 
@@ -15044,7 +15044,7 @@ class AccountService extends BaseGraphqlService {
         return Toasts.show(this.toastController, this.translate, opts);
     }
 }
-AccountService.ɵprov = i0.ɵɵdefineInjectable({ factory: function AccountService_Factory() { return new AccountService(i0.ɵɵinject(CryptoService), i0.ɵɵinject(NetworkService), i0.ɵɵinject(GraphqlService), i0.ɵɵinject(LocalSettingsService), i0.ɵɵinject(i3$1.Storage), i0.ɵɵinject(FileService), i0.ɵɵinject(i1$1.TranslateService, 8), i0.ɵɵinject(i1$4.ToastController, 8), i0.ɵɵinject(ENVIRONMENT)); }, token: AccountService, providedIn: "root" });
+AccountService.ɵprov = ɵɵdefineInjectable({ factory: function AccountService_Factory() { return new AccountService(ɵɵinject(CryptoService), ɵɵinject(NetworkService), ɵɵinject(GraphqlService), ɵɵinject(LocalSettingsService), ɵɵinject(Storage), ɵɵinject(FileService), ɵɵinject(TranslateService, 8), ɵɵinject(ToastController, 8), ɵɵinject(ENVIRONMENT)); }, token: AccountService, providedIn: "root" });
 AccountService.decorators = [
     { type: Injectable, args: [{ providedIn: 'root', deps: [ENVIRONMENT] },] }
 ];
@@ -15312,7 +15312,7 @@ const CONFIGURATION_STORAGE_KEY = 'configuration';
 /* ------------------------------------
  * GraphQL queries
  * ------------------------------------*/
-const Fragments = {
+const Fragments$1 = {
     config: gql `
     fragment ConfigFragment on ConfigurationVO {
       id
@@ -15339,13 +15339,13 @@ const Fragments = {
     }
   `
 };
-const LoadQuery = gql `
+const LoadQuery$1 = gql `
 query Configuration{
   data: configuration{
     ...ConfigFragment
   }
 }
-  ${Fragments.config}
+  ${Fragments$1.config}
 `;
 // Save (create or update) account mutation
 const SaveMutation = gql `
@@ -15354,7 +15354,7 @@ const SaveMutation = gql `
        ...ConfigFragment
     }
   }
-  ${Fragments.config}
+  ${Fragments$1.config}
 `;
 const ClearCache = gql `
   query ClearCache($name: String) {
@@ -15405,12 +15405,12 @@ class ConfigService extends BaseGraphqlService {
         return __awaiter(this, void 0, void 0, function* () {
             const now = Date.now();
             console.debug('[config] Loading Pod configuration...');
-            const query = opts && opts.query || LoadQuery;
+            const query = opts && opts.query || LoadQuery$1;
             const variables = opts && opts.variables || undefined;
             const res = yield this.graphql.query({
                 query,
                 variables,
-                error: { code: ErrorCodes$2.LOAD_CONFIG_ERROR, message: 'ERROR.LOAD_CONFIG_ERROR' },
+                error: { code: ErrorCodes.LOAD_CONFIG_ERROR, message: 'ERROR.LOAD_CONFIG_ERROR' },
                 fetchPolicy: opts && opts.fetchPolicy || undefined /*default*/
             });
             const data = res && res.data ? Configuration.fromObject(res.data) : undefined;
@@ -15443,7 +15443,7 @@ class ConfigService extends BaseGraphqlService {
                     data: json
                 },
                 error: {
-                    code: ErrorCodes$2.SAVE_CONFIG_ERROR,
+                    code: ErrorCodes.SAVE_CONFIG_ERROR,
                     message: 'ERROR.SAVE_CONFIG_ERROR'
                 }
             });
@@ -15469,7 +15469,7 @@ class ConfigService extends BaseGraphqlService {
             const res = yield this.graphql.query({
                 query: CacheStatistics,
                 variables: null,
-                error: { code: ErrorCodes$2.LOAD_CONFIG_ERROR, message: 'ERROR.LOAD_CONFIG_ERROR' },
+                error: { code: ErrorCodes.LOAD_CONFIG_ERROR, message: 'ERROR.LOAD_CONFIG_ERROR' },
                 fetchPolicy: 'network-only'
             });
             const data = res && res.cacheStatistics || undefined;
@@ -15485,7 +15485,7 @@ class ConfigService extends BaseGraphqlService {
             const res = yield this.graphql.query({
                 query: ClearCache,
                 variables,
-                error: { code: ErrorCodes$2.LOAD_CONFIG_ERROR, message: 'ERROR.LOAD_CONFIG_ERROR' },
+                error: { code: ErrorCodes.LOAD_CONFIG_ERROR, message: 'ERROR.LOAD_CONFIG_ERROR' },
                 fetchPolicy: 'no-cache'
             });
             const data = res && res.clearCache || undefined;
@@ -15644,7 +15644,7 @@ class ConfigService extends BaseGraphqlService {
         });
     }
 }
-ConfigService.ɵprov = i0.ɵɵdefineInjectable({ factory: function ConfigService_Factory() { return new ConfigService(i0.ɵɵinject(i1$4.Platform), i0.ɵɵinject(GraphqlService), i0.ɵɵinject(i3$1.Storage), i0.ɵɵinject(NetworkService), i0.ɵɵinject(FileService), i0.ɵɵinject(i1$4.ToastController), i0.ɵɵinject(i1$1.TranslateService), i0.ɵɵinject(AccountService), i0.ɵɵinject(ENVIRONMENT), i0.ɵɵinject(APP_CONFIG_OPTIONS, 8)); }, token: ConfigService, providedIn: "root" });
+ConfigService.ɵprov = ɵɵdefineInjectable({ factory: function ConfigService_Factory() { return new ConfigService(ɵɵinject(Platform), ɵɵinject(GraphqlService), ɵɵinject(Storage), ɵɵinject(NetworkService), ɵɵinject(FileService), ɵɵinject(ToastController), ɵɵinject(TranslateService), ɵɵinject(AccountService), ɵɵinject(ENVIRONMENT), ɵɵinject(APP_CONFIG_OPTIONS, 8)); }, token: ConfigService, providedIn: "root" });
 ConfigService.decorators = [
     { type: Injectable, args: [{
                 providedIn: 'root',
@@ -15664,7 +15664,7 @@ ConfigService.ctorParameters = () => [
     { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [APP_CONFIG_OPTIONS,] }] }
 ];
 
-const moment$3 = momentImported;
+const moment$4 = momentImported;
 const AndroidOsEnvironment = Object.freeze({
     DIRECTORY_DOWNLOADS: 'Download',
     DIRECTORY_DOWNLOADS_OLD: 'Downloads',
@@ -15899,16 +15899,16 @@ class PlatformService extends StartableService {
                 }
                 // config moment lib
                 try {
-                    moment$3.locale(event.lang);
+                    moment$4.locale(event.lang);
                     console.debug('[platform] Use locale {' + event.lang + '}');
                 }
                 // If error, fallback to en
                 catch (err) {
-                    moment$3.locale('en');
+                    moment$4.locale('en');
                     console.warn('[platform] Unknown local for moment lib. Using default [en]');
                 }
                 // Config date adapter
-                this.dateAdapter.setLocale(moment$3.locale());
+                this.dateAdapter.setLocale(moment$4.locale());
             }
         });
         this.settings.onChange.subscribe(data => {
@@ -15947,8 +15947,7 @@ class PlatformService extends StartableService {
                 (_a = this.checkAppVersionTimer) === null || _a === void 0 ? void 0 : _a.unsubscribe(); // Stop timer if exists
                 return; // Skip
             }
-            const peer = undefined; // location.origin + this.environment.baseUrl;
-            const remoteVersion = yield this.networkService.getAppVersion(peer);
+            const remoteVersion = yield this.networkService.getAppVersion();
             if (isNilOrBlank(remoteVersion)) {
                 if (production && !silent)
                     console.error('[platform] Cannot load remote app version. Skipping version check');
@@ -15957,7 +15956,7 @@ class PlatformService extends StartableService {
             }
             if (VersionUtils.isCompatible(remoteVersion, actualVersion)) {
                 if (!silent)
-                    console.info('[platform] Checking remote app version [OK]');
+                    console.info(`[platform] Checking remote app version [OK] {remote: '${remoteVersion}', actual: '${actualVersion}'}`);
                 return;
             }
             // If newer version exists
@@ -16109,7 +16108,7 @@ class PlatformService extends StartableService {
         });
     }
 }
-PlatformService.ɵprov = i0.ɵɵdefineInjectable({ factory: function PlatformService_Factory() { return new PlatformService(i0.ɵɵinject(i1$4.Platform), i0.ɵɵinject(i2$4.Platform), i0.ɵɵinject(i1$4.ToastController), i0.ɵɵinject(i1$1.TranslateService), i0.ɵɵinject(i1.MomentDateAdapter), i0.ɵɵinject(EntitiesStorage), i0.ɵɵinject(LocalSettingsService), i0.ɵɵinject(NetworkService), i0.ɵɵinject(AccountService), i0.ɵɵinject(ConfigService), i0.ɵɵinject(i6.CacheService), i0.ɵɵinject(i3$1.Storage), i0.ɵɵinject(AudioProvider), i0.ɵɵinject(ENVIRONMENT), i0.ɵɵinject(i14.StatusBar, 8), i0.ɵɵinject(i15.Keyboard, 8), i0.ɵɵinject(i10.SplashScreen, 8), i0.ɵɵinject(i17.InAppBrowser, 8), i0.ɵɵinject(i18.Downloader, 8)); }, token: PlatformService, providedIn: "root" });
+PlatformService.ɵprov = ɵɵdefineInjectable({ factory: function PlatformService_Factory() { return new PlatformService(ɵɵinject(Platform), ɵɵinject(Platform$1), ɵɵinject(ToastController), ɵɵinject(TranslateService), ɵɵinject(MomentDateAdapter), ɵɵinject(EntitiesStorage), ɵɵinject(LocalSettingsService), ɵɵinject(NetworkService), ɵɵinject(AccountService), ɵɵinject(ConfigService), ɵɵinject(CacheService), ɵɵinject(Storage), ɵɵinject(AudioProvider), ɵɵinject(ENVIRONMENT), ɵɵinject(StatusBar, 8), ɵɵinject(Keyboard$1, 8), ɵɵinject(SplashScreen, 8), ɵɵinject(InAppBrowser, 8), ɵɵinject(Downloader, 8)); }, token: PlatformService, providedIn: "root" });
 PlatformService.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -16124,15 +16123,15 @@ PlatformService.ctorParameters = () => [
     { type: NetworkService },
     { type: AccountService },
     { type: ConfigService },
-    { type: CacheService },
+    { type: CacheService$1 },
     { type: Storage },
     { type: AudioProvider },
     { type: undefined, decorators: [{ type: Inject, args: [ENVIRONMENT,] }] },
-    { type: StatusBar, decorators: [{ type: Optional }] },
+    { type: StatusBar$1, decorators: [{ type: Optional }] },
     { type: Keyboard, decorators: [{ type: Optional }] },
-    { type: SplashScreen, decorators: [{ type: Optional }] },
-    { type: InAppBrowser, decorators: [{ type: Optional }] },
-    { type: Downloader, decorators: [{ type: Optional }] }
+    { type: SplashScreen$1, decorators: [{ type: Optional }] },
+    { type: InAppBrowser$1, decorators: [{ type: Optional }] },
+    { type: Downloader$1, decorators: [{ type: Optional }] }
 ];
 
 class AppHelpModal {
@@ -16196,7 +16195,7 @@ class MatStepperI18n extends MatStepperIntl {
         this.optionalLabel = this.translate.instant('COMMON.OPTIONAL');
     }
 }
-MatStepperI18n.ɵprov = i0.ɵɵdefineInjectable({ factory: function MatStepperI18n_Factory() { return new MatStepperI18n(i0.ɵɵinject(i1$1.TranslateService)); }, token: MatStepperI18n, providedIn: "root" });
+MatStepperI18n.ɵprov = ɵɵdefineInjectable({ factory: function MatStepperI18n_Factory() { return new MatStepperI18n(ɵɵinject(TranslateService)); }, token: MatStepperI18n, providedIn: "root" });
 MatStepperI18n.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -18032,7 +18031,7 @@ function state2side(state) {
             return 1;
     }
 }
-const ɵ0$1 = (defaultStateSize) => [
+const ɵ0$b = (defaultStateSize) => [
     Math.round((rgbArrayMap.red[0] - 50) / defaultStateSize),
     Math.round((255 - rgbArrayMap.red[1]) / defaultStateSize),
     Math.round((255 - rgbArrayMap.red[2]) / defaultStateSize)
@@ -18040,7 +18039,7 @@ const ɵ0$1 = (defaultStateSize) => [
 const SCALE_OPTIONS_DEFAULT = {
     startColor: rgbArrayMap.red,
     startStates: [0, 2, 3],
-    startStepsFn: ɵ0$1
+    startStepsFn: ɵ0$b
 };
 /**
  * Internal function, that create a colors scale, using iteration
@@ -18837,7 +18836,7 @@ class UserSettingsValidatorService extends AppValidatorService {
         });
     }
 }
-UserSettingsValidatorService.ɵprov = i0.ɵɵdefineInjectable({ factory: function UserSettingsValidatorService_Factory() { return new UserSettingsValidatorService(i0.ɵɵinject(i1$6.FormBuilder)); }, token: UserSettingsValidatorService, providedIn: "root" });
+UserSettingsValidatorService.ɵprov = ɵɵdefineInjectable({ factory: function UserSettingsValidatorService_Factory() { return new UserSettingsValidatorService(ɵɵinject(FormBuilder)); }, token: UserSettingsValidatorService, providedIn: "root" });
 UserSettingsValidatorService.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -18881,7 +18880,7 @@ class AccountValidatorService extends AppValidatorService {
         return validatorFns.length ? Validators.compose(validatorFns) : validatorFns.length === 1 ? validatorFns[0] : undefined;
     }
 }
-AccountValidatorService.ɵprov = i0.ɵɵdefineInjectable({ factory: function AccountValidatorService_Factory() { return new AccountValidatorService(i0.ɵɵinject(i1$6.FormBuilder), i0.ɵɵinject(AccountService)); }, token: AccountValidatorService, providedIn: "root" });
+AccountValidatorService.ɵprov = ɵɵdefineInjectable({ factory: function AccountValidatorService_Factory() { return new AccountValidatorService(ɵɵinject(FormBuilder), ɵɵinject(AccountService)); }, token: AccountValidatorService, providedIn: "root" });
 AccountValidatorService.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -19446,7 +19445,7 @@ class LocalSettingsValidatorService extends AppValidatorService {
         });
     }
 }
-LocalSettingsValidatorService.ɵprov = i0.ɵɵdefineInjectable({ factory: function LocalSettingsValidatorService_Factory() { return new LocalSettingsValidatorService(i0.ɵɵinject(i1$6.FormBuilder), i0.ɵɵinject(NetworkService)); }, token: LocalSettingsValidatorService, providedIn: "root" });
+LocalSettingsValidatorService.ɵprov = ɵɵdefineInjectable({ factory: function LocalSettingsValidatorService_Factory() { return new LocalSettingsValidatorService(ɵɵinject(FormBuilder), ɵɵinject(NetworkService)); }, token: LocalSettingsValidatorService, providedIn: "root" });
 LocalSettingsValidatorService.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -20065,7 +20064,7 @@ class IsOnFieldModePipe {
         return value === 'FIELD';
     }
 }
-IsOnFieldModePipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function IsOnFieldModePipe_Factory() { return new IsOnFieldModePipe(); }, token: IsOnFieldModePipe, providedIn: "root" });
+IsOnFieldModePipe.ɵprov = ɵɵdefineInjectable({ factory: function IsOnFieldModePipe_Factory() { return new IsOnFieldModePipe(); }, token: IsOnFieldModePipe, providedIn: "root" });
 IsOnFieldModePipe.decorators = [
     { type: Pipe, args: [{
                 name: 'isOnField'
@@ -20077,7 +20076,7 @@ class IsNotOnFieldModePipe {
         return value !== 'FIELD';
     }
 }
-IsNotOnFieldModePipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function IsNotOnFieldModePipe_Factory() { return new IsNotOnFieldModePipe(); }, token: IsNotOnFieldModePipe, providedIn: "root" });
+IsNotOnFieldModePipe.ɵprov = ɵɵdefineInjectable({ factory: function IsNotOnFieldModePipe_Factory() { return new IsNotOnFieldModePipe(); }, token: IsNotOnFieldModePipe, providedIn: "root" });
 IsNotOnFieldModePipe.decorators = [
     { type: Pipe, args: [{
                 name: 'isNotOnField'
@@ -20092,7 +20091,7 @@ class PersonToStringPipe {
         return PersonUtils.personToString(value);
     }
 }
-PersonToStringPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function PersonToStringPipe_Factory() { return new PersonToStringPipe(); }, token: PersonToStringPipe, providedIn: "root" });
+PersonToStringPipe.ɵprov = ɵɵdefineInjectable({ factory: function PersonToStringPipe_Factory() { return new PersonToStringPipe(); }, token: PersonToStringPipe, providedIn: "root" });
 PersonToStringPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'personToString'
@@ -20477,7 +20476,7 @@ class IsLoginAccountPipe {
         return value && value.pubkey && true;
     }
 }
-IsLoginAccountPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function IsLoginAccountPipe_Factory() { return new IsLoginAccountPipe(); }, token: IsLoginAccountPipe, providedIn: "root" });
+IsLoginAccountPipe.ɵprov = ɵɵdefineInjectable({ factory: function IsLoginAccountPipe_Factory() { return new IsLoginAccountPipe(); }, token: IsLoginAccountPipe, providedIn: "root" });
 IsLoginAccountPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'isLogin'
@@ -20489,7 +20488,7 @@ class AccountToStringPipe {
         return accountToString(value);
     }
 }
-AccountToStringPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function AccountToStringPipe_Factory() { return new AccountToStringPipe(); }, token: AccountToStringPipe, providedIn: "root" });
+AccountToStringPipe.ɵprov = ɵɵdefineInjectable({ factory: function AccountToStringPipe_Factory() { return new AccountToStringPipe(); }, token: AccountToStringPipe, providedIn: "root" });
 AccountToStringPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'accountToString'
@@ -20504,7 +20503,7 @@ class DepartmentToStringPipe {
         return departmentToString(value);
     }
 }
-DepartmentToStringPipe.ɵprov = i0.ɵɵdefineInjectable({ factory: function DepartmentToStringPipe_Factory() { return new DepartmentToStringPipe(); }, token: DepartmentToStringPipe, providedIn: "root" });
+DepartmentToStringPipe.ɵprov = ɵɵdefineInjectable({ factory: function DepartmentToStringPipe_Factory() { return new DepartmentToStringPipe(); }, token: DepartmentToStringPipe, providedIn: "root" });
 DepartmentToStringPipe.decorators = [
     { type: Pipe, args: [{
                 name: 'departmentToString'
@@ -20600,7 +20599,7 @@ class MenuService {
         this._visibleSubject.next(value);
     }
 }
-MenuService.ɵprov = i0.ɵɵdefineInjectable({ factory: function MenuService_Factory() { return new MenuService(); }, token: MenuService, providedIn: "root" });
+MenuService.ɵprov = ɵɵdefineInjectable({ factory: function MenuService_Factory() { return new MenuService(); }, token: MenuService, providedIn: "root" });
 MenuService.decorators = [
     { type: Injectable, args: [{
                 providedIn: 'root'
@@ -21056,7 +21055,7 @@ class AuthGuardService {
         }));
     }
 }
-AuthGuardService.ɵprov = i0.ɵɵdefineInjectable({ factory: function AuthGuardService_Factory() { return new AuthGuardService(i0.ɵɵinject(AccountService), i0.ɵɵinject(i1$4.ModalController), i0.ɵɵinject(i3$3.Router), i0.ɵɵinject(ENVIRONMENT)); }, token: AuthGuardService, providedIn: "root" });
+AuthGuardService.ɵprov = ɵɵdefineInjectable({ factory: function AuthGuardService_Factory() { return new AuthGuardService(ɵɵinject(AccountService), ɵɵinject(ModalController), ɵɵinject(Router), ɵɵinject(ENVIRONMENT)); }, token: AuthGuardService, providedIn: "root" });
 AuthGuardService.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -21098,7 +21097,7 @@ class BaseEntityService extends BaseGraphqlService {
             query,
             variables: { id },
             fetchPolicy: opts && opts.fetchPolicy || undefined,
-            error: { code: ErrorCodes$2.LOAD_DATA_ERROR, message: 'REFERENTIAL.ERROR.LOAD_DATA_ERROR' }
+            error: { code: ErrorCodes.LOAD_DATA_ERROR, message: 'REFERENTIAL.ERROR.LOAD_DATA_ERROR' }
         })
             .pipe(map(({ data }) => (!opts || opts.toEntity !== false)
             ? (data && this.fromObject(data))
@@ -21113,7 +21112,7 @@ class BaseEntityService extends BaseGraphqlService {
                 query,
                 variables: { id },
                 fetchPolicy: opts && opts.fetchPolicy || undefined,
-                error: { code: ErrorCodes$2.LOAD_DATA_ERROR, message: 'REFERENTIAL.ERROR.LOAD_DATA_ERROR' }
+                error: { code: ErrorCodes.LOAD_DATA_ERROR, message: 'REFERENTIAL.ERROR.LOAD_DATA_ERROR' }
             });
             // Convert to entity
             return (!opts || opts.toEntity !== false)
@@ -21144,7 +21143,7 @@ class BaseEntityService extends BaseGraphqlService {
             totalFieldName: withTotal ? 'total' : undefined,
             insertFilterFn: filter && filter.asFilterFn(),
             variables,
-            error: { code: ErrorCodes$2.LOAD_DATA_ERROR, message: 'REFERENTIAL.ERROR.LOAD_DATA_ERROR' },
+            error: { code: ErrorCodes.LOAD_DATA_ERROR, message: 'REFERENTIAL.ERROR.LOAD_DATA_ERROR' },
             fetchPolicy: opts && opts.fetchPolicy || undefined
         })
             .pipe(map(({ data, total }) => {
@@ -21180,7 +21179,7 @@ class BaseEntityService extends BaseGraphqlService {
             const { data, total } = yield this.graphql.query({
                 query,
                 variables,
-                error: { code: ErrorCodes$2.LOAD_DATA_ERROR, message: 'ERROR.LOAD_DATA_ERROR' },
+                error: { code: ErrorCodes.LOAD_DATA_ERROR, message: 'ERROR.LOAD_DATA_ERROR' },
                 fetchPolicy: opts && opts.fetchPolicy || 'network-only'
             });
             const entities = (!opts || opts.toEntity !== false) ?
@@ -21219,7 +21218,7 @@ class BaseEntityService extends BaseGraphqlService {
                 variables: {
                     filter: filter && filter.asPodObject()
                 },
-                error: { code: ErrorCodes$2.LOAD_DATA_ERROR, message: 'ERROR.COUNT_DATA_ERROR' },
+                error: { code: ErrorCodes.LOAD_DATA_ERROR, message: 'ERROR.COUNT_DATA_ERROR' },
                 fetchPolicy: opts && opts.fetchPolicy || 'network-only'
             });
             return res.total;
@@ -21255,7 +21254,7 @@ class BaseEntityService extends BaseGraphqlService {
                 variables: {
                     data: json
                 },
-                error: { code: ErrorCodes$2.SAVE_DATA_ERROR, message: 'ERROR.SAVE_DATA_ERROR' },
+                error: { code: ErrorCodes.SAVE_DATA_ERROR, message: 'ERROR.SAVE_DATA_ERROR' },
                 update: (proxy, { data }) => {
                     const savedEntities = data && data.data;
                     if (savedEntities) {
@@ -21311,7 +21310,7 @@ class BaseEntityService extends BaseGraphqlService {
                 variables: {
                     data: json
                 },
-                error: { code: ErrorCodes$2.SAVE_DATA_ERROR, message: 'ERROR.SAVE_DATA_ERROR' },
+                error: { code: ErrorCodes.SAVE_DATA_ERROR, message: 'ERROR.SAVE_DATA_ERROR' },
                 update: (cache, { data }) => {
                     // Update entity
                     const savedEntity = data && data.data;
@@ -21359,7 +21358,7 @@ class BaseEntityService extends BaseGraphqlService {
                 refetchQueries: this.getRefetchQueriesForMutation(opts),
                 awaitRefetchQueries: opts && opts.awaitRefetchQueries,
                 variables: { ids },
-                error: { code: ErrorCodes$2.DELETE_DATA_ERROR, message: 'ERROR.DELETE_DATA_ERROR' },
+                error: { code: ErrorCodes.DELETE_DATA_ERROR, message: 'ERROR.DELETE_DATA_ERROR' },
                 update: (cache, res) => {
                     // Remove from cache
                     if (this.watchQueriesUpdatePolicy === 'update-cache') {
@@ -21400,7 +21399,7 @@ class BaseEntityService extends BaseGraphqlService {
                 refetchQueries: this.getRefetchQueriesForMutation(opts),
                 awaitRefetchQueries: opts && opts.awaitRefetchQueries,
                 variables: { id },
-                error: { code: ErrorCodes$2.DELETE_DATA_ERROR, message: 'ERROR.DELETE_DATA_ERROR' },
+                error: { code: ErrorCodes.DELETE_DATA_ERROR, message: 'ERROR.DELETE_DATA_ERROR' },
                 update: (proxy, res) => {
                     // Remove from cache
                     if (this.watchQueriesUpdatePolicy === 'update-cache') {
@@ -21436,7 +21435,7 @@ class BaseEntityService extends BaseGraphqlService {
             fetchPolicy: opts && opts.fetchPolicy || 'no-cache',
             variables,
             error: {
-                code: ErrorCodes$2.SUBSCRIBE_DATA_ERROR,
+                code: ErrorCodes.SUBSCRIBE_DATA_ERROR,
                 message: 'ERROR.SUBSCRIBE_DATA_ERROR'
             }
         })
@@ -21622,7 +21621,7 @@ class EntitiesTableDataSource extends TableDataSource {
                     if (this._debug)
                         invalidRows.forEach(row => AppTableUtils.logRowErrors(row, `[table-datasource] ${this._logTypeName} row #${row.id}`));
                     // Stop with an error
-                    throw { code: ErrorCodes$2.TABLE_INVALID_ROW_ERROR, message: 'ERROR.TABLE_INVALID_ROW_ERROR' };
+                    throw { code: ErrorCodes.TABLE_INVALID_ROW_ERROR, message: 'ERROR.TABLE_INVALID_ROW_ERROR' };
                 }
                 this._editingRowCount = 0;
                 let data;
@@ -22493,14 +22492,14 @@ class AppTable {
         return __awaiter(this, void 0, void 0, function* () {
             opts = Object.assign({ keepEditing: this.keepEditedRowOnSave }, opts);
             if (this.readOnly) {
-                throw { code: ErrorCodes$2.TABLE_READ_ONLY, message: 'ERROR.TABLE_READ_ONLY' };
+                throw { code: ErrorCodes.TABLE_READ_ONLY, message: 'ERROR.TABLE_READ_ONLY' };
             }
             this.resetError();
             // Keep edited row id (should be done BEFORE confirmEditCreate() )
             this.previouslyEditedRowId = opts.keepEditing ? ((((_a = this.editedRow) === null || _a === void 0 ? void 0 : _a.editing) ? this.editedRow.id : undefined) || ((_b = this.singleSelectedRow) === null || _b === void 0 ? void 0 : _b.id)) : undefined;
             const previouslyEditedData = opts.keepEditing ? (isNotNil(this.previouslyEditedRowId) && ((_c = this.editedRow) === null || _c === void 0 ? void 0 : _c.currentData) || ((_d = this.singleSelectedRow) === null || _d === void 0 ? void 0 : _d.currentData)) : undefined;
             if (!this.confirmEditCreate()) {
-                throw { code: ErrorCodes$2.TABLE_INVALID_ROW_ERROR, message: 'ERROR.TABLE_INVALID_ROW_ERROR' };
+                throw { code: ErrorCodes.TABLE_INVALID_ROW_ERROR, message: 'ERROR.TABLE_INVALID_ROW_ERROR' };
             }
             // Mark as saving
             this.markAsSaving();
@@ -22619,7 +22618,7 @@ class AppTable {
         var _a;
         return __awaiter(this, void 0, void 0, function* () {
             if (this.readOnly) {
-                throw { code: ErrorCodes$2.TABLE_READ_ONLY, message: 'ERROR.TABLE_READ_ONLY' };
+                throw { code: ErrorCodes.TABLE_READ_ONLY, message: 'ERROR.TABLE_READ_ONLY' };
             }
             if (event === null || event === void 0 ? void 0 : event.defaultPrevented)
                 return 0; // SKip
@@ -24199,7 +24198,7 @@ class AppEntityEditor extends AppTabEditor {
                 try {
                     const data = yield this.dataService.load(id, opts);
                     if (!data)
-                        throw { code: ErrorCodes$2.DATA_NOT_FOUND_ERROR, message: 'ERROR.DATA_NO_FOUND' };
+                        throw { code: ErrorCodes.DATA_NOT_FOUND_ERROR, message: 'ERROR.DATA_NO_FOUND' };
                     this._usageMode = this.computeUsageMode(data);
                     yield this.onEntityLoaded(data, opts);
                     yield this.updateView(data, opts);
@@ -24753,9 +24752,10 @@ AppInMemoryTable.propDecorators = {
     canDelete: [{ type: Input }]
 };
 
-const ErrorCodes$1 = {
+const SocialErrorCodes = {
     LOAD_USER_EVENTS_ERROR: 50000,
-    SAVE_USER_EVENT_ERROR: 50001
+    SAVE_USER_EVENT_ERROR: 50001,
+    SEND_MESSAGE_ERROR: 50003
 };
 
 var UserEvent_1;
@@ -24799,7 +24799,7 @@ UserEvent = UserEvent_1 = __decorate([
     EntityClass({ typename: 'UserEventVO' })
 ], UserEvent);
 
-const SocialFragments = {
+const UserEventFragments = {
     userEvent: gql `fragment UserEventFragment on UserEventVO {
     id
     issuer
@@ -24850,7 +24850,7 @@ let UserEventFilter = class UserEventFilter extends EntityFilter {
     }
 };
 UserEventFilter = __decorate([
-    EntityClass({ typename: 'UserEventVO' })
+    EntityClass({ typename: 'UserEventFilterVO' })
 ], UserEventFilter);
 const SaveQuery = gql `
   mutation SaveUserEvent($data: UserEventVOInput){
@@ -24858,7 +24858,7 @@ const SaveQuery = gql `
       ...UserEventFragment
     }
   }
-  ${SocialFragments.userEvent}
+  ${UserEventFragments.userEvent}
 `;
 const LoadAllQuery = gql `
   query UserEvents($filter: UserEventFilterVOInput, $page: PageInput){
@@ -24866,7 +24866,7 @@ const LoadAllQuery = gql `
       ...LightUserEventFragment
     }
   }
-  ${SocialFragments.lightUserEvent}
+  ${UserEventFragments.lightUserEvent}
 `;
 const DeleteByIdsMutation = gql `
   mutation DeleteUserEvents($ids:[Int]){
@@ -24879,7 +24879,7 @@ const LoadAllWithContentQuery = gql `
       ...UserEventFragment
     }
   }
-  ${SocialFragments.userEvent}
+  ${UserEventFragments.userEvent}
 `;
 class UserEventService extends BaseGraphqlService {
     constructor(graphql, accountService, network, translate, toastController, environment) {
@@ -24892,7 +24892,7 @@ class UserEventService extends BaseGraphqlService {
         this.environment = environment;
         this._userEventActions = [];
         // For DEV only
-        this._debug = !environment.production;
+        this._debug = environment && !environment.production;
     }
     /**
      *
@@ -24929,7 +24929,7 @@ class UserEventService extends BaseGraphqlService {
                 filter: filter && filter.asPodObject()
             },
             arrayFieldName: 'data',
-            error: { code: ErrorCodes$1.LOAD_USER_EVENTS_ERROR, message: 'SOCIAL.ERROR.LOAD_USER_EVENTS_ERROR' },
+            error: { code: SocialErrorCodes.LOAD_USER_EVENTS_ERROR, message: 'SOCIAL.ERROR.LOAD_USER_EVENTS_ERROR' },
             fetchPolicy: options && options.fetchPolicy || undefined
         })
             .pipe(map(res => {
@@ -24967,7 +24967,7 @@ class UserEventService extends BaseGraphqlService {
                 variables: {
                     data: json
                 },
-                error: { code: ErrorCodes$1.SAVE_USER_EVENT_ERROR, message: 'SOCIAL.ERROR.SAVE_USER_EVENT_ERROR' },
+                error: { code: SocialErrorCodes.SAVE_USER_EVENT_ERROR, message: 'SOCIAL.ERROR.SAVE_USER_EVENT_ERROR' },
                 update: (proxy, { data }) => {
                     // Update entity
                     const savedEntity = data && data.data;
@@ -25151,7 +25151,7 @@ class UserEventService extends BaseGraphqlService {
         EntityUtils.copyIdAndUpdateDate(source, target);
     }
 }
-UserEventService.ɵprov = i0.ɵɵdefineInjectable({ factory: function UserEventService_Factory() { return new UserEventService(i0.ɵɵinject(GraphqlService), i0.ɵɵinject(AccountService), i0.ɵɵinject(NetworkService), i0.ɵɵinject(i1$1.TranslateService), i0.ɵɵinject(i1$4.ToastController), i0.ɵɵinject(ENVIRONMENT)); }, token: UserEventService, providedIn: "root" });
+UserEventService.ɵprov = ɵɵdefineInjectable({ factory: function UserEventService_Factory() { return new UserEventService(ɵɵinject(GraphqlService), ɵɵinject(AccountService), ɵɵinject(NetworkService), ɵɵinject(TranslateService), ɵɵinject(ToastController), ɵɵinject(ENVIRONMENT, 8)); }, token: UserEventService, providedIn: "root" });
 UserEventService.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -25161,7 +25161,7 @@ UserEventService.ctorParameters = () => [
     { type: NetworkService },
     { type: TranslateService },
     { type: ToastController },
-    { type: undefined, decorators: [{ type: Inject, args: [ENVIRONMENT,] }] }
+    { type: Environment, decorators: [{ type: Optional }, { type: Inject, args: [ENVIRONMENT,] }] }
 ];
 
 const ICONS_MAP = {
@@ -25288,7 +25288,7 @@ class UserEventsTable extends AppTable {
 UserEventsTable.decorators = [
     { type: Component, args: [{
                 selector: 'app-user-events-table',
-                template: "\n<!-- Type = options menu -->\n<mat-menu #optionsMenu=\"matMenu\" xPosition=\"after\">\n\n  <!-- display columns -->\n  <button mat-menu-item\n          (click)=\"openSelectColumnsModal($event)\">\n    <mat-icon>view_column</mat-icon>\n    <ion-label translate>COMMON.DISPLAYED_COLUMNS_DOTS</ion-label>\n  </button>\n\n</mat-menu>\n\n<!-- top header -->\n<mat-toolbar>\n\n  <ng-container *ngIf=\"!selection.hasValue(); else hasSelection\">\n\n    <button mat-icon-button [title]=\"'COMMON.BTN_REFRESH'|translate\" (click)=\"onRefresh.emit()\">\n      <mat-icon>refresh</mat-icon>\n    </button>\n\n  </ng-container>\n\n  <!-- if row selection -->\n  <ng-template #hasSelection>\n\n    <!-- delete -->\n    <button mat-icon-button class=\"hidden-xs hidden-sm\" *ngIf=\"canDelete\"\n            [title]=\"'COMMON.BTN_DELETE'|translate\" (click)=\"deleteSelection($event)\">\n      <mat-icon>delete</mat-icon>\n    </button>\n  </ng-template>\n\n  <!-- error -->\n  <ion-item *ngIf=\"error\" hidden-xs hidden-sm hidden-mobile lines=\"none\">\n    <ion-icon color=\"danger\" slot=\"start\" name=\"alert-circle\"></ion-icon>\n    <ion-label color=\"danger\" class=\"error\" [innerHTML]=\"error|translate\"></ion-label>\n  </ion-item>\n\n  <div class=\"toolbar-spacer\"></div>\n\n  <button mat-icon-button\n          [title]=\"'COMMON.BTN_OPTIONS'|translate\"\n          [matMenuTriggerFor]=\"optionsMenu\">\n    <mat-icon>more_vert</mat-icon>\n  </button>\n</mat-toolbar>\n\n\n<mat-table [dataSource]=\"dataSource\" matSort\n           [matSortActive]=\"defaultSortBy\"\n           [matSortDirection]=\"defaultSortDirection\"\n           matSortDisableClear [trackBy]=\"trackByFn\">\n\n  <!-- select -->\n  <ng-container matColumnDef=\"select\">\n    <mat-header-cell *matHeaderCellDef [class.cdk-visually-hidden]=\"!canEdit\">\n      <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\"\n                    [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\n      </mat-checkbox>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\" [class.cdk-visually-hidden]=\"!canEdit\">\n      <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(row) : null\" [checked]=\"selection.isSelected(row)\">\n      </mat-checkbox>\n    </mat-cell>\n  </ng-container>\n\n  <!-- id -->\n  <ng-container matColumnDef=\"id\">\n    <mat-header-cell *matHeaderCellDef mat-sort-header [class.cdk-visually-hidden]=\"!isAdmin\">\n      <app-loading-spinner [loading]=\"loadingSubject|async\"><ion-label>#</ion-label></app-loading-spinner>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\" [class.cdk-visually-hidden]=\"!isAdmin\">{{ row.currentData.id | mathAbs }}</mat-cell>\n  </ng-container>\n\n  <!-- creationDate -->\n  <ng-container matColumnDef=\"creationDate\">\n    <mat-header-cell *matHeaderCellDef mat-sort-header>\n      <ion-label translate>SOCIAL.USER_EVENT.CREATION_DATE</ion-label>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\">\n      <ion-text>\n        {{row.currentData.creationDate | dateFromNow }}<br/>\n        <ion-text color=\"medium\"><small>{{row.currentData.creationDate | dateFormat: {time: true} }}</small></ion-text>\n      </ion-text>\n    </mat-cell>\n  </ng-container>\n\n  <!-- icon -->\n  <ng-container matColumnDef=\"icon\">\n    <mat-header-cell *matHeaderCellDef>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row;\">\n      <ng-container *ngIf=\"getIcon(row.currentData); let details\">\n        <ion-icon slot=\"start\" *ngIf=\"details.icon\" [name]=\"details.icon\"></ion-icon>\n        <mat-icon slot=\"start\" *ngIf=\"details.matIcon\">{{details.matIcon}}</mat-icon>\n      </ng-container>\n    </mat-cell>\n  </ng-container>\n\n  <!-- event type -->\n  <ng-container matColumnDef=\"eventType\">\n    <mat-header-cell *matHeaderCellDef mat-sort-header>\n      <ion-label translate>SOCIAL.USER_EVENT.EVENT_TYPE</ion-label>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row;\">\n      <span>{{'SOCIAL.EVENT_TYPE_ENUM.' + row.currentData.eventType | translate}}</span>\n    </mat-cell>\n  </ng-container>\n\n  <!-- message -->\n  <ng-container matColumnDef=\"message\">\n    <mat-header-cell *matHeaderCellDef>\n      <ion-label translate>SOCIAL.USER_EVENT.MESSAGE</ion-label>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row;\">\n      <ng-container *ngIf=\"getDetail(row.currentData); let details\">\n        <ion-text [innerHTML]=\"details.title|translate\">\n        </ion-text>\n      </ng-container>\n    </mat-cell>\n  </ng-container>\n\n  <!-- Actions buttons column -->\n  <ng-container matColumnDef=\"actions\">\n    <mat-header-cell *matHeaderCellDef>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\">\n      <ng-container *ngIf=\"getDetail(row.currentData); let details\">\n        <button mat-icon-button color=\"light\"\n                *ngFor=\"let action of details.actions\"\n                [title]=\"action.title |translate\"\n                [color]=\"action.color\"\n                (click)=\"doAction(action, row)\">\n          <ion-icon slot=\"start\" *ngIf=\"action.icon\" [name]=\"action.icon\"></ion-icon>\n          <mat-icon slot=\"start\" *ngIf=\"action.matIcon\">{{action.matIcon}}</mat-icon>\n        </button>\n      </ng-container>\n    </mat-cell>\n  </ng-container>\n\n  <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n  <mat-row *matRowDef=\"let row; columns: displayedColumns;\"\n           class=\"mat-row-disabled\"\n           (click)=\"clickRow($event, row)\"></mat-row>\n\n</mat-table>\n\n<ion-row class=\"ion-no-padding\">\n  <ion-col></ion-col>\n  <ion-col class=\"ion-no-padding\" size=\"auto\">\n    <mat-paginator [length]=\"totalRowCount\" [pageSize]=\"defaultPageSize\" [pageSizeOptions]=\"defaultPageSizeOptions\" showFirstLastButtons>\n    </mat-paginator>\n  </ion-col>\n</ion-row>\n",
+                template: "\n<!-- Type = options menu -->\n<mat-menu #optionsMenu=\"matMenu\" xPosition=\"after\">\n\n  <!-- display columns -->\n  <button mat-menu-item\n          (click)=\"openSelectColumnsModal($event)\">\n    <mat-icon>view_column</mat-icon>\n    <ion-label translate>COMMON.DISPLAYED_COLUMNS_DOTS</ion-label>\n  </button>\n\n</mat-menu>\n\n<!-- top header -->\n<mat-toolbar>\n\n  <ng-container *ngIf=\"!selection.hasValue(); else hasSelection\">\n\n    <button mat-icon-button [title]=\"'COMMON.BTN_REFRESH'|translate\" (click)=\"onRefresh.emit()\">\n      <mat-icon>refresh</mat-icon>\n    </button>\n\n  </ng-container>\n\n  <!-- if row selection -->\n  <ng-template #hasSelection>\n\n    <!-- delete -->\n    <button mat-icon-button class=\"hidden-xs hidden-sm\" *ngIf=\"canDelete\"\n            [title]=\"'COMMON.BTN_DELETE'|translate\" (click)=\"deleteSelection($event)\">\n      <mat-icon>delete</mat-icon>\n    </button>\n  </ng-template>\n\n  <!-- error -->\n  <ion-item *ngIf=\"error\" hidden-xs hidden-sm hidden-mobile lines=\"none\">\n    <ion-icon color=\"danger\" slot=\"start\" name=\"alert-circle\"></ion-icon>\n    <ion-label color=\"danger\" class=\"error\" [innerHTML]=\"error|translate\"></ion-label>\n  </ion-item>\n\n  <div class=\"toolbar-spacer\"></div>\n\n  <button mat-icon-button\n          [title]=\"'COMMON.BTN_OPTIONS'|translate\"\n          [matMenuTriggerFor]=\"optionsMenu\">\n    <mat-icon>more_vert</mat-icon>\n  </button>\n</mat-toolbar>\n\n\n<mat-table [dataSource]=\"dataSource\" matSort\n           [matSortActive]=\"defaultSortBy\"\n           [matSortDirection]=\"defaultSortDirection\"\n           matSortDisableClear [trackBy]=\"trackByFn\">\n\n  <!-- select -->\n  <ng-container matColumnDef=\"select\">\n    <mat-header-cell *matHeaderCellDef [class.cdk-visually-hidden]=\"!canEdit\">\n      <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\"\n                    [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\n      </mat-checkbox>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\" [class.cdk-visually-hidden]=\"!canEdit\">\n      <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(row) : null\" [checked]=\"selection.isSelected(row)\">\n      </mat-checkbox>\n    </mat-cell>\n  </ng-container>\n\n  <!-- id -->\n  <ng-container matColumnDef=\"id\">\n    <mat-header-cell *matHeaderCellDef mat-sort-header [class.cdk-visually-hidden]=\"!isAdmin\">\n      <app-loading-spinner [loading]=\"loadingSubject|async\"><ion-label>#</ion-label></app-loading-spinner>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\" [class.cdk-visually-hidden]=\"!isAdmin\">{{ row.currentData.id | mathAbs }}</mat-cell>\n  </ng-container>\n\n  <!-- creationDate -->\n  <ng-container matColumnDef=\"creationDate\">\n    <mat-header-cell *matHeaderCellDef mat-sort-header>\n      <ion-label translate>SOCIAL.USER_EVENT.CREATION_DATE</ion-label>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\">\n      <ion-text>\n        {{row.currentData.creationDate | dateFromNow }}<br/>\n        <ion-text color=\"medium\"><small>{{row.currentData.creationDate | dateFormat: {time: true} }}</small></ion-text>\n      </ion-text>\n    </mat-cell>\n  </ng-container>\n\n  <!-- icon -->\n  <ng-container matColumnDef=\"icon\">\n    <mat-header-cell *matHeaderCellDef>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row;\">\n      <ng-container *ngIf=\"getIcon(row.currentData); let details\">\n        <ion-icon slot=\"start\" *ngIf=\"details.icon\" [name]=\"details.icon\"></ion-icon>\n        <mat-icon slot=\"start\" *ngIf=\"details.matIcon\">{{details.matIcon}}</mat-icon>\n      </ng-container>\n    </mat-cell>\n  </ng-container>\n\n  <!-- event type -->\n  <ng-container matColumnDef=\"eventType\">\n    <mat-header-cell *matHeaderCellDef mat-sort-header>\n      <ion-label translate>SOCIAL.USER_EVENT.EVENT_TYPE</ion-label>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row;\">\n      <span>{{'SOCIAL.USER_EVENT.TYPE_ENUM.' + row.currentData.eventType | translate}}</span>\n    </mat-cell>\n  </ng-container>\n\n  <!-- message -->\n  <ng-container matColumnDef=\"message\">\n    <mat-header-cell *matHeaderCellDef>\n      <ion-label translate>SOCIAL.USER_EVENT.MESSAGE</ion-label>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row;\">\n      <ng-container *ngIf=\"getDetail(row.currentData); let details\">\n        <ion-text [innerHTML]=\"details.title|translate\">\n        </ion-text>\n      </ng-container>\n    </mat-cell>\n  </ng-container>\n\n  <!-- Actions buttons column -->\n  <ng-container matColumnDef=\"actions\">\n    <mat-header-cell *matHeaderCellDef>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\">\n      <ng-container *ngIf=\"getDetail(row.currentData); let details\">\n        <button mat-icon-button color=\"light\"\n                *ngFor=\"let action of details.actions\"\n                [title]=\"action.title |translate\"\n                [color]=\"action.color\"\n                (click)=\"doAction(action, row)\">\n          <ion-icon slot=\"start\" *ngIf=\"action.icon\" [name]=\"action.icon\"></ion-icon>\n          <mat-icon slot=\"start\" *ngIf=\"action.matIcon\">{{action.matIcon}}</mat-icon>\n        </button>\n      </ng-container>\n    </mat-cell>\n  </ng-container>\n\n  <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n  <mat-row *matRowDef=\"let row; columns: displayedColumns;\"\n           class=\"mat-row-disabled\"\n           (click)=\"clickRow($event, row)\"></mat-row>\n\n</mat-table>\n\n<ion-row class=\"ion-no-padding\">\n  <ion-col></ion-col>\n  <ion-col class=\"ion-no-padding\" size=\"auto\">\n    <mat-paginator [length]=\"totalRowCount\" [pageSize]=\"defaultPageSize\" [pageSizeOptions]=\"defaultPageSizeOptions\" showFirstLastButtons>\n    </mat-paginator>\n  </ion-col>\n</ion-row>\n",
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 styles: [".mat-header-row .mat-column-icon,.mat-row .mat-column-icon{max-width:40px;padding-left:0}.mat-header-row .mat-column-icon ion-icon,.mat-header-row .mat-column-icon mat-icon,.mat-row .mat-column-icon ion-icon,.mat-row .mat-column-icon mat-icon{font-size:1.2em;height:1.2em;width:1.2em}.mat-header-row .mat-column-creationDate,.mat-row .mat-column-creationDate{min-width:100px;max-width:120px}"]
             },] }
@@ -25308,32 +25308,309 @@ UserEventsTable.propDecorators = {
     defaultSortDirection: [{ type: Input }]
 };
 
-class SocialModule {
-    static forRoot() {
-        console.debug('[social] Creating module (root)');
-        return {
-            ngModule: SocialModule,
-            providers: [
-                UserEventService
-            ]
-        };
+const MessageTypes = {
+    INBOX_MESSAGE: 'INBOX_MESSAGE',
+    EMAIL: 'EMAIL',
+    FEED: 'FEED',
+};
+const MessageTypeList = Object.freeze([
+    {
+        id: MessageTypes.INBOX_MESSAGE,
+        icon: 'notifications',
+        label: 'SOCIAL.MESSAGE.TYPE_ENUM.INBOX_MESSAGE'
+    },
+    {
+        id: MessageTypes.EMAIL,
+        icon: 'mail',
+        label: 'SOCIAL.MESSAGE.TYPE_ENUM.EMAIL'
+    },
+    {
+        id: MessageTypes.FEED,
+        icon: 'paper',
+        label: 'SOCIAL.MESSAGE.TYPE_ENUM.FEED'
+    }
+]);
+// @dynamic
+let Message = class Message extends Entity {
+    constructor() {
+        super();
+    }
+    fromObject(source, opts) {
+        super.fromObject(source, opts);
+        this.type = source.type;
+        this.issuer = source.issuer && Person.fromObject(source.issuer);
+        this.recipients = source.recipients && source.recipients.map(Person.fromObject);
+        this.subject = source.subject;
+        this.body = source.body;
+    }
+    asObject(opts) {
+        const target = super.asObject(opts);
+        target.recipients = this.recipients && this.recipients.map(p => p.asObject(opts));
+        return target;
+    }
+};
+Message = __decorate([
+    EntityClass({ typename: 'MessageVO' })
+], Message);
+// @dynamic
+let MessageFilter = class MessageFilter extends EntityFilter {
+    fromObject(source, opts) {
+        super.fromObject(source, opts);
+    }
+    buildFilter() {
+        const filterFns = super.buildFilter();
+        return filterFns;
+    }
+};
+MessageFilter = __decorate([
+    EntityClass({ typename: 'MessageFilterVO' })
+], MessageFilter);
+
+class MessageModal {
+    constructor(settings, viewCtrl, accountService, cd) {
+        this.settings = settings;
+        this.viewCtrl = viewCtrl;
+        this.accountService = accountService;
+        this.cd = cd;
+        this.mobile = this.settings.mobile;
+    }
+    ngOnInit() {
+        this.canSelectType = toBoolean(this.canSelectType, this.accountService.isAdmin());
+    }
+    ngAfterViewInit() {
+        this.form.markAsReady({ emitEvent: false });
+        if (this.data) {
+            this.data.type = this.data.type || MessageTypes.INBOX_MESSAGE;
+            this.form.setValue(this.data);
+        }
+        this.form.markAsLoaded();
+        this.form.enable();
+    }
+    cancel(event) {
+        this.viewCtrl.dismiss();
+    }
+    doSubmit(event) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.form.disabled)
+                return;
+            if (!this.form.valid) {
+                yield AppFormUtils.waitWhilePending(this.form);
+                if (this.form.invalid) {
+                    AppFormUtils.logFormErrors(this.form.form, '[message-modal] ');
+                    this.form.markAllAsTouched();
+                    return;
+                }
+            }
+            this.markAsLoading();
+            try {
+                const data = this.form.value;
+                // Disable the form
+                this.form.disable();
+                const entity = Message.fromObject(data);
+                return this.viewCtrl.dismiss(entity);
+            }
+            catch (err) {
+                this.form.error = err && err.message || err;
+                this.markAsLoaded();
+                // Enable the form
+                this.form.enable();
+                // Reset form error on next changes
+                firstNotNilPromise(this.form.form.valueChanges).then(() => {
+                    this.form.error = null;
+                    this.markForCheck();
+                });
+                return;
+            }
+        });
+    }
+    markForCheck() {
+        this.cd.markForCheck();
+    }
+    markAsLoading(opts) {
+        this.form.markAsLoading(opts);
+    }
+    markAsLoaded(opts) {
+        this.form.markAsLoaded(opts);
     }
 }
+MessageModal.decorators = [
+    { type: Component, args: [{
+                selector: 'app-message-modal',
+                template: "<ion-header>\n  <ion-toolbar color=\"secondary\">\n    <ion-buttons slot=\"start\">\n      <ion-button class=\"back-button\" (click)=\"cancel($event)\" visible-xs visible-sm visible-mobile>\n        <ion-icon slot=\"icon-only\" name=\"arrow-back\"></ion-icon>\n      </ion-button>\n    </ion-buttons>\n\n    <ion-title>\n      {{'SOCIAL.MESSAGE.NEW.TITLE' | translate}}\n    </ion-title>\n\n    <ion-buttons slot=\"end\">\n\n      <ion-button class=\"back-button\" (click)=\"doSubmit($event)\"\n                  [disabled]=\"!form.valid\"\n                  visible-xs visible-sm visible-mobile>\n        <ion-icon slot=\"icon-only\" name=\"checkmark\"></ion-icon>\n      </ion-button>\n    </ion-buttons>\n  </ion-toolbar>\n</ion-header>\n\n\n<ion-content class=\"ion-padding\" >\n\n  <ion-item *ngIf=\"form.error\" visible-xs visible-sm visible-mobile lines=\"none\">\n    <ion-icon color=\"danger\" slot=\"start\" name=\"alert-circle\"></ion-icon>\n    <ion-label color=\"danger\" class=\"error\" [innerHTML]=\"form.error|translate\"></ion-label>\n  </ion-item>\n\n  <app-message-form #form (onSubmit)=\"doSubmit($event)\"\n                    (onCancel)=\"cancel($event)\"\n                    [canSelectType]=\"canSelectType\"\n                    [suggestFn]=\"suggestFn\">\n  </app-message-form>\n\n</ion-content>\n\n\n<ion-footer hidden-xs hidden-sm hidden-mobile>\n\n  <ion-toolbar>\n\n    <ion-row class=\"ion-no-padding\" nowrap>\n      <ion-col></ion-col>\n\n      <!-- buttons -->\n      <ion-col size=\"auto\">\n        <ion-button fill=\"clear\" color=\"dark\" (click)=\"cancel($event)\">\n          <ion-label translate>COMMON.BTN_CANCEL</ion-label>\n        </ion-button>\n\n        <ion-button [fill]=\"form.invalid ? 'clear' : 'solid'\"\n                    [disabled]=\"form.loading || form.invalid\"\n                    (keyup.enter)=\"doSubmit($event)\"\n                    (click)=\"doSubmit($event)\" color=\"tertiary\">\n          <ion-label translate>COMMON.BTN_SEND</ion-label>\n        </ion-button>\n      </ion-col>\n    </ion-row>\n\n\n  </ion-toolbar>\n</ion-footer>\n",
+                changeDetection: ChangeDetectionStrategy.OnPush
+            },] }
+];
+MessageModal.ctorParameters = () => [
+    { type: LocalSettingsService },
+    { type: ModalController },
+    { type: AccountService },
+    { type: ChangeDetectorRef }
+];
+MessageModal.propDecorators = {
+    suggestFn: [{ type: Input }],
+    data: [{ type: Input }],
+    canSelectType: [{ type: Input }],
+    form: [{ type: ViewChild, args: ['form', { static: true },] }]
+};
+
+class MessageForm extends AppForm {
+    constructor(injector, formBuilder, cd) {
+        super(injector);
+        this.formBuilder = formBuilder;
+        this.cd = cd;
+        this.subjectMinLength = 5;
+        this.subjectMaxLength = 255;
+        this.bodyMaxLength = 2000;
+        this.bodyAutoHeight = true;
+        this.canSelectType = false;
+        this.types = MessageTypeList;
+        this.mobile = this.settings.mobile;
+    }
+    ngOnInit() {
+        this.setForm(this.formBuilder.group({
+            type: [MessageTypes.INBOX_MESSAGE, Validators.required],
+            recipients: [null, Validators.required],
+            subject: [null, this.subjectMaxLength
+                    ? Validators.compose([Validators.required, Validators.minLength(this.subjectMinLength), Validators.maxLength(this.subjectMaxLength)])
+                    : Validators.required],
+            body: [null, this.bodyMaxLength
+                    ? Validators.compose([Validators.maxLength(this.bodyMaxLength)])
+                    : Validators.required]
+        }));
+        const personAttributes = this.settings.getFieldDisplayAttributes('person', ['lastName', 'firstName', 'department.name']);
+        this.registerAutocompleteField('recipients', {
+            showAllOnFocus: false,
+            suggestFn: this.suggestFn,
+            filter: {
+                statusIds: [StatusIds.TEMPORARY, StatusIds.ENABLE]
+            },
+            attributes: personAttributes,
+            displayWith: PersonUtils.personToString,
+            multiple: true,
+            mobile: this.mobile
+        });
+    }
+    isSamePerson(o1, o2) {
+        return EntityUtils.equals(o1, o2, 'id');
+    }
+    markForCheck() {
+        this.cd.markForCheck();
+    }
+}
+MessageForm.decorators = [
+    { type: Component, args: [{
+                selector: 'app-message-form',
+                template: "\n\n<form [formGroup]=\"form\" class=\"form-container\">\n\n  <!-- type -->\n  <mat-form-field *ngIf=\"canSelectType\">\n    <mat-select formControlName=\"type\" [placeholder]=\"'SOCIAL.MESSAGE.TYPE'|translate\">\n      <mat-option *ngFor=\"let item of types\" [value]=\"item.id\">\n        <ion-icon [name]=\"item.icon\"></ion-icon>\n        {{ item.label |translate }}\n      </mat-option>\n    </mat-select>\n  </mat-form-field>\n\n  <!-- Recipients -->\n  <mat-chips-field *ngIf=\"(form.controls.type.valueChanges|async) !== 'FEED'\"\n                   formControlName=\"recipients\"\n                   [placeholder]=\"'SOCIAL.MESSAGE.RECIPIENTS'|translate\"\n                   [config]=\"autocompleteFields.recipients\"\n                   [equals]=\"isSamePerson\">\n  </mat-chips-field>\n\n  <!-- Subject -->\n  <mat-form-field>\n    <input matInput type=\"text\"\n           [placeholder]=\"'SOCIAL.MESSAGE.SUBJECT'|translate\"\n           formControlName=\"subject\"\n           autocomplete=\"off\"\n           required>\n    <mat-error *ngIf=\"form.controls.subject.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n    <mat-error *ngIf=\"form.controls.subject.hasError('minlength')\">\n      {{ 'ERROR.FIELD_MIN_LENGTH_COMPACT'|translate }}\n    </mat-error>\n    <mat-error *ngIf=\"form.controls.subject.hasError('maxlength')\">\n      {{ 'ERROR.FIELD_MAX_LENGTH_COMPACT'|translate }}\n    </mat-error>\n    <mat-hint *ngIf=\"subjectMaxLength\" align=\"end\">\n      {{ 'INFO.TEXT_PROGRESS' | translate: { current: form.controls.subject.value?.length || 0, max: subjectMaxLength } }}\n    </mat-hint>\n  </mat-form-field>\n\n  <!-- Body -->\n  <mat-form-field floatLabel=\"never\">\n    <textarea matInput type=\"text\"\n              [placeholder]=\"'SOCIAL.MESSAGE.BODY_HELP'|translate\"\n              formControlName=\"body\"\n              [class.fixed-height]=\"!bodyAutoHeight\"\n              [cdkTextareaAutosize]=\"bodyAutoHeight\"\n              (keydown.control.enter)=\"doSubmit($event)\"\n    >\n    </textarea>\n    <mat-error *ngIf=\"form.controls.body.hasError('maxlength')\">\n      {{ 'ERROR.FIELD_MAX_LENGTH' | translate: form.controls.body.errors.maxlength }}\n    </mat-error>\n    <mat-hint *ngIf=\"bodyMaxLength\" align=\"end\">\n      {{ 'INFO.TEXT_PROGRESS' | translate: { current: form.controls.body.value?.length || 0, max: bodyMaxLength } }}\n    </mat-hint>\n  </mat-form-field>\n\n</form>\n",
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                styles: ["textarea.fixed-height{height:11.5em}textarea{min-height:11.5em}"]
+            },] }
+];
+MessageForm.ctorParameters = () => [
+    { type: Injector },
+    { type: FormBuilder },
+    { type: ChangeDetectorRef }
+];
+MessageForm.propDecorators = {
+    suggestFn: [{ type: Input }],
+    subjectMinLength: [{ type: Input }],
+    subjectMaxLength: [{ type: Input }],
+    bodyMaxLength: [{ type: Input }],
+    bodyAutoHeight: [{ type: Input }],
+    canSelectType: [{ type: Input }]
+};
+
+class SocialModule {
+}
 SocialModule.decorators = [
     { type: NgModule, args: [{
                 imports: [
                     CommonModule,
-                    CoreModule
+                    CoreModule,
+                    SharedModule
                 ],
                 declarations: [
-                    UserEventsTable
+                    UserEventsTable,
+                    MessageModal,
+                    MessageForm
                 ],
                 exports: [
-                    UserEventsTable
+                    UserEventsTable,
+                    MessageModal
                 ]
             },] }
 ];
 
+const Mutations = {
+    send: gql `mutation SendMessage($data: MessageVOInput){
+    done: sendMessage(message: $data)
+  }`
+};
+class MessageService extends BaseGraphqlService {
+    constructor(graphql, translate, toastController, environment) {
+        super(graphql, environment);
+        this.graphql = graphql;
+        this.translate = translate;
+        this.toastController = toastController;
+        this.environment = environment;
+        // For DEV only
+        this._debug = !environment.production;
+    }
+    /**
+     * Send a message to recipient(s)
+     *
+     * @param entity
+     * @param opts
+     */
+    send(entity, opts) {
+        return __awaiter(this, void 0, void 0, function* () {
+            // Transform into json
+            const data = entity.asObject(MINIFY_ENTITY_FOR_POD);
+            const now = Date.now();
+            if (this._debug)
+                console.debug(`[message-service] Send message...`, data);
+            try {
+                const { done } = yield this.graphql.mutate({
+                    mutation: Mutations.send,
+                    variables: { data },
+                    error: { code: SocialErrorCodes.SEND_MESSAGE_ERROR, message: 'SOCIAL.ERROR.SEND_MESSAGE_ERROR' }
+                });
+                if (this._debug)
+                    console.debug(`[message-service] Send message [OK] in ${Date.now() - now}ms`);
+                if (done && (!opts || opts.showToast !== false)) {
+                    yield this.showToast({ type: 'info', message: 'SOCIAL.INFO.MESSAGE_SENT' });
+                }
+                return done;
+            }
+            catch (err) {
+                const error = err && err.message || err;
+                console.error(error);
+                // Show error
+                if (!opts || opts.showToast !== false) {
+                    let message = error || 'SOCIAL.ERROR.SEND_MESSAGE_ERROR';
+                    yield this.showToast({ type: 'error', message });
+                }
+                return false;
+            }
+        });
+    }
+    /* -- protected methods -- */
+    showToast(opts) {
+        return __awaiter(this, void 0, void 0, function* () {
+            return Toasts.show(this.toastController, this.translate, Object.assign({ type: 'info', message: 'SOCIAL.INFO.MESSAGE_SENT' }, opts));
+        });
+    }
+}
+MessageService.ɵprov = ɵɵdefineInjectable({ factory: function MessageService_Factory() { return new MessageService(ɵɵinject(GraphqlService), ɵɵinject(TranslateService), ɵɵinject(ToastController), ɵɵinject(ENVIRONMENT, 8)); }, token: MessageService, providedIn: "root" });
+MessageService.decorators = [
+    { type: Injectable, args: [{ providedIn: 'root' },] }
+];
+MessageService.ctorParameters = () => [
+    { type: GraphqlService },
+    { type: TranslateService },
+    { type: ToastController },
+    { type: Environment, decorators: [{ type: Optional }, { type: Inject, args: [ENVIRONMENT,] }] }
+];
+
 var PersonFilter_1;
 // @dynamic
 let PersonFilter = PersonFilter_1 = class PersonFilter extends EntityFilter {
@@ -25532,7 +25809,7 @@ class PersonService extends BaseEntityService {
         return target;
     }
 }
-PersonService.ɵprov = i0.ɵɵdefineInjectable({ factory: function PersonService_Factory() { return new PersonService(i0.ɵɵinject(GraphqlService), i0.ɵɵinject(PlatformService), i0.ɵɵinject(NetworkService), i0.ɵɵinject(EntitiesStorage)); }, token: PersonService, providedIn: "root" });
+PersonService.ɵprov = ɵɵdefineInjectable({ factory: function PersonService_Factory() { return new PersonService(ɵɵinject(GraphqlService), ɵɵinject(PlatformService), ɵɵinject(NetworkService), ɵɵinject(EntitiesStorage)); }, token: PersonService, providedIn: "root" });
 PersonService.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -25563,7 +25840,7 @@ class PersonValidatorService {
         return this.formBuilder.group(formConfig);
     }
 }
-PersonValidatorService.ɵprov = i0.ɵɵdefineInjectable({ factory: function PersonValidatorService_Factory() { return new PersonValidatorService(i0.ɵɵinject(i1$6.FormBuilder), i0.ɵɵinject(AccountValidatorService)); }, token: PersonValidatorService, providedIn: "root" });
+PersonValidatorService.ɵprov = ɵɵdefineInjectable({ factory: function PersonValidatorService_Factory() { return new PersonValidatorService(ɵɵinject(FormBuilder), ɵɵinject(AccountValidatorService)); }, token: PersonValidatorService, providedIn: "root" });
 PersonValidatorService.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
@@ -25573,7 +25850,7 @@ PersonValidatorService.ctorParameters = () => [
 ];
 
 class UsersPage extends AppTable {
-    constructor(injector, accountService, validatorService, configService, dataService, cd, formBuilder, environment) {
+    constructor(injector, formBuilder, accountService, validatorService, configService, dataService, messageService, cd, environment) {
         super(injector, RESERVED_START_COLUMNS
             .concat([
             'avatar',
@@ -25598,16 +25875,17 @@ class UsersPage extends AppTable {
         this.validatorService = validatorService;
         this.configService = configService;
         this.dataService = dataService;
+        this.messageService = messageService;
         this.cd = cd;
-        this.canEdit = false;
         this.profiles = [...PRIORITIZED_AUTHORITIES].reverse();
-        this.filterCriteriaCount = 0;
         this.statusList = StatusList;
         this.statusById = StatusById;
+        this.filterCriteriaCount = 0;
         this.useSticky = false;
         this.referentialToString = referentialToString;
-        this.inlineEdition = accountService.isAdmin(); // Allow inline edition only if admin
         this.canEdit = accountService.isAdmin();
+        this.canSendMessage = this.canEdit;
+        this.inlineEdition = this.canEdit;
         this.confirmBeforeDelete = true;
         this.autoLoad = false; // Wait config loading
         this.i18nColumnPrefix = 'USER.';
@@ -25700,6 +25978,39 @@ class UsersPage extends AppTable {
         formControl.setValue(null);
         return false;
     }
+    openComposeMessageModal(event) {
+        return __awaiter(this, void 0, void 0, function* () {
+            // Get recipients
+            const recipients = (this.selection.selected || [])
+                .map(row => row.currentData)
+                .map(Person.fromObject)
+                .map(p => {
+                var _a;
+                const target = p.asObject({ minify: true });
+                target.department = (_a = p.department) === null || _a === void 0 ? void 0 : _a.asObject();
+                return target;
+            });
+            const hasTopModal = !!(yield this.modalCtrl.getTop());
+            const modal = yield this.modalCtrl.create({
+                component: MessageModal,
+                componentProps: {
+                    suggestFn: (value, filter, sortBy, sortDirection) => this.dataService.suggest(value, filter, sortBy, sortDirection),
+                    data: {
+                        recipients
+                    }
+                },
+                cssClass: hasTopModal && 'stack-modal'
+            });
+            // Open the modal
+            yield modal.present();
+            // On dismiss
+            const { data } = yield modal.onDidDismiss();
+            if (!data || !(data instanceof Message))
+                return; // CANCELLED
+            console.info('[users] received message to send: ', data);
+            yield this.messageService.send(data);
+        });
+    }
     /* -- protected methods -- */
     markForCheck() {
         this.cd.markForCheck();
@@ -25708,7 +26019,7 @@ class UsersPage extends AppTable {
 UsersPage.decorators = [
     { type: Component, args: [{
                 selector: 'app-users-table',
-                template: "<app-toolbar [title]=\"'USER.LIST.TITLE'|translate\"\n             color=\"primary\"\n             [canGoBack]=\"false\"\n             [hasValidate]=\"!(loadingSubject|async) && dirty\"\n             (onValidate)=\"save()\">\n  <ion-buttons slot=\"end\">\n    <ng-container *ngIf=\"!selection.hasValue(); else hasSelection\">\n      <!-- Add -->\n      <button mat-icon-button\n              *ngIf=\"canEdit && !mobile\"\n              [title]=\"'COMMON.BTN_ADD'|translate\"\n              (click)=\"addRow()\">\n        <mat-icon>add</mat-icon>\n      </button>\n\n      <!-- Refresh -->\n      <button mat-icon-button *ngIf=\"!mobile\"\n              [title]=\"'COMMON.BTN_REFRESH'|translate\"\n              (click)=\"onRefresh.emit()\">\n        <mat-icon>refresh</mat-icon>\n      </button>\n\n      <!-- reset filter -->\n      <button mat-icon-button (click)=\"resetFilter()\"\n              *ngIf=\"filterCriteriaCount\">\n        <mat-icon color=\"accent\">filter_list_alt</mat-icon>\n        <mat-icon class=\"icon-secondary\" style=\"left: 16px; top: 5px; font-weight: bold;\">close</mat-icon>\n      </button>\n\n      <!-- show filter -->\n      <button mat-icon-button (click)=\"filterExpansionPanel.toggle()\">\n        <mat-icon *ngIf=\"filterCriteriaCount; else emptyFilter\"\n                  [matBadge]=\"filterCriteriaCount\"\n                  matBadgeColor=\"accent\"\n                  matBadgeSize=\"small\"\n                  matBadgePosition=\"above after\">filter_list_alt\n        </mat-icon>\n        <ng-template #emptyFilter>\n          <mat-icon>filter_list_alt</mat-icon>\n        </ng-template>\n      </button>\n    </ng-container>\n\n    <ng-template #hasSelection>\n      <!-- delete -->\n      <button mat-icon-button\n              class=\"hidden-xs hidden-sm\"\n              [title]=\"'COMMON.BTN_DELETE'|translate\"\n              (click)=\"deleteSelection($event)\">\n        <mat-icon>delete</mat-icon>\n      </button>\n    </ng-template>\n  </ion-buttons>\n</app-toolbar>\n\n<ion-content class=\"ion-no-padding\">\n\n  <!-- error -->\n  <ion-item *ngIf=\"errorSubject|async ; let error\" lines=\"none\" @slideUpDownAnimation>\n    <ion-icon color=\"danger\" slot=\"start\" name=\"alert-circle\"></ion-icon>\n    <ion-label color=\"danger\" class=\"error\" [innerHTML]=\"error|translate\"></ion-label>\n  </ion-item>\n\n  <!-- search -->\n  <mat-expansion-panel #filterExpansionPanel class=\"ion-no-padding filter-panel filter-panel-floating\">\n    <form class=\"form-container ion-padding\" [formGroup]=\"filterForm\" (ngSubmit)=\"onRefresh.emit()\">\n      <ion-grid>\n        <ion-row>\n          <ion-col>\n            <!-- search -->\n            <mat-form-field>\n              <input matInput [placeholder]=\"'USER.LIST.FILTER.SEARCH'|translate\" formControlName=\"searchText\">\n\n              <button mat-icon-button matSuffix tabindex=\"-1\"\n                      type=\"button\"\n                      (click)=\"clearControlValue($event, filterForm.controls.searchText)\"\n                      [hidden]=\"filterForm.controls.searchText.disabled || !filterForm.controls.searchText.value\">\n                <mat-icon>close</mat-icon>\n              </button>\n            </mat-form-field>\n          </ion-col>\n\n          <ion-col>\n            <!-- status -->\n            <mat-form-field>\n              <mat-select formControlName=\"statusId\" [placeholder]=\"'USER.STATUS'|translate\">\n                <mat-option [value]=\"null\"><i><span translate>COMMON.EMPTY_OPTION</span></i></mat-option>\n                <mat-option *ngFor=\"let item of statusList\" [value]=\"item.id\">\n                  <ion-icon [name]=\"item.icon\"></ion-icon>\n                  {{ item.label |translate }}\n                </mat-option>\n              </mat-select>\n\n              <button mat-icon-button matSuffix tabindex=\"-1\"\n                      type=\"button\"\n                      (click)=\"clearControlValue($event, filterForm.controls.statusId)\"\n                      [hidden]=\"filterForm.controls.statusId.disabled || !filterForm.controls.statusId.value\">\n                <mat-icon>close</mat-icon>\n              </button>\n            </mat-form-field>\n          </ion-col>\n        </ion-row>\n      </ion-grid>\n    </form>\n\n    <mat-action-row>\n      <!-- Counter  -->\n      <ion-label [hidden]=\"(loadingSubject|async) || filterForm.dirty\"\n                 [color]=\"empty && 'danger'\"\n                 class=\"ion-padding\">\n        {{ (totalRowCount ? 'COMMON.RESULT_COUNT' : 'COMMON.NO_RESULT') | translate: {\n        count: (totalRowCount |\n          numberFormat)\n      } }}\n      </ion-label>\n\n      <div class=\"toolbar-spacer\"></div>\n\n      <!-- Close panel -->\n      <ion-button mat-button fill=\"clear\" color=\"dark\"\n                  (click)=\"filterExpansionPanel.close()\"\n                  [disabled]=\"loadingSubject|async\">\n        <ion-text translate>COMMON.BTN_CLOSE</ion-text>\n      </ion-button>\n\n      <!-- Search button -->\n      <ion-button mat-button\n                  [color]=\"filterForm.dirty ? 'tertiary' : 'dark'\"\n                  [fill]=\"filterForm.dirty ? 'solid' : 'clear'\"\n                  (click)=\"applyFilterAndClosePanel($event)\"\n                  [disabled]=\"loadingSubject|async\">\n        <ion-text translate>COMMON.BTN_APPLY</ion-text>\n      </ion-button>\n\n    </mat-action-row>\n  </mat-expansion-panel>\n\n  <!-- error -->\n  <ion-item *ngIf=\"error\" visible-xs visible-sm visible-mobile lines=\"none\">\n    <ion-icon color=\"danger\" slot=\"start\" name=\"alert-circle\"></ion-icon>\n    <ion-label color=\"danger\" class=\"error\" [innerHTML]=\"error|translate\"></ion-label>\n  </ion-item>\n\n  <div class=\"table-container\">\n    <table #table mat-table matSort\n           [dataSource]=\"dataSource\"\n           [matSortActive]=\"defaultSortBy\" [matSortDirection]=\"defaultSortDirection\"\n           matSortDisableClear [trackBy]=\"trackByFn\">\n\n      <ng-container matColumnDef=\"select\" [sticky]=\"useSticky\">\n        <th mat-header-cell *matHeaderCellDef [class.cdk-visually-hidden]=\"!inlineEdition\">\n          <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\"\n                        [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\n          </mat-checkbox>\n        </th>\n        <td mat-cell *matCellDef=\"let row\" [class.cdk-visually-hidden]=\"!inlineEdition\">\n          <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(row) : null\" [checked]=\"selection.isSelected(row)\">\n          </mat-checkbox>\n        </td>\n      </ng-container>\n\n      <!-- Id Column -->\n      <ng-container matColumnDef=\"id\" [sticky]=\"useSticky\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>\n          <ion-label>#</ion-label>\n        </th>\n        <td mat-cell *matCellDef=\"let row\">{{ row.currentData.id }}</td>\n      </ng-container>\n\n      <!-- avatar Column -->\n      <ng-container matColumnDef=\"avatar\" [sticky]=\"useSticky\">\n        <th mat-header-cell *matHeaderCellDef></th>\n        <td mat-cell *matCellDef=\"let row\">\n          <div class=\"avatar\" *ngIf=\"row.currentData.avatar; else generateIcon\"\n               [ngStyle]=\"{'background-image':'url('+row.currentData.avatar+')'}\"></div>\n          <ng-template #generateIcon>\n            <div class=\"avatar\">\n              <svg width=\"38\" width=\"38\" [data-jdenticon-value]=\"row.currentData.id\"></svg>\n            </div>\n          </ng-template>\n        </td>\n      </ng-container>\n\n      <!-- lastName  -->\n      <ng-container matColumnDef=\"lastName\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>\n          <span translate>USER.LAST_NAME</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\" (click)=\"focusColumn='lastName'\">\n          <mat-form-field floatLabel=\"never\">\n            <input matInput\n                   [formControl]=\"row.validator.controls['lastName']\"\n                   [placeholder]=\"'USER.LAST_NAME'|translate\"\n                   [readonly]=\"!row.editing\"\n                   [appAutofocus]=\"row.editing && focusColumn==='lastName'\">\n            <mat-error *ngIf=\"row.validator.controls['lastName'].hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n            <mat-error *ngIf=\"row.validator.controls['lastName'].hasError('minlength')\">\n              <span>{{'ERROR.FIELD_MIN_LENGTH' | translate: {minLength: 2} }}</span>\n            </mat-error>\n          </mat-form-field>\n\n        </td>\n\n      </ng-container>\n\n      <!-- firstname -->\n      <ng-container matColumnDef=\"firstName\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>\n          <span translate>USER.FIRST_NAME</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\"\n\n            (click)=\"focusColumn='firstName'\">\n          <mat-form-field floatLabel=\"never\">\n            <input matInput [formControl]=\"row.validator.controls['firstName']\"\n                   [placeholder]=\"'USER.FIRST_NAME'|translate\"\n                   [readonly]=\"!row.editing\"\n                   [appAutofocus]=\"row.editing && focusColumn==='firstName'\">\n            <mat-error *ngIf=\"row.validator.controls['firstName'].hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n            <mat-error *ngIf=\"row.validator.controls['firstName'].hasError('minlength')\">\n              <span>{{'ERROR.FIELD_MIN_LENGTH' | translate: {minLength: 2} }}</span>\n            </mat-error>\n          </mat-form-field>\n        </td>\n      </ng-container>\n\n      <!-- email  -->\n      <ng-container matColumnDef=\"email\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>\n          <span translate>USER.EMAIL</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\" (click)=\"focusColumn='email'\">\n          <mat-form-field floatLabel=\"never\">\n            <input matInput [formControl]=\"row.validator.controls['email']\"\n                   [placeholder]=\"'USER.EMAIL'|translate\"\n                   [readonly]=\"!row.editing\"\n                   [appAutofocus]=\"row.editing && focusColumn==='email'\">\n            <mat-error *ngIf=\"row.validator.controls['email'].hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n            <mat-error *ngIf=\"row.validator.controls['email'].hasError('email')\">\n              <span translate>ERROR.FIELD_NOT_VALID_EMAIL</span>\n            </mat-error>\n          </mat-form-field>\n        </td>\n      </ng-container>\n\n      <!-- additional fields -->\n      <ng-container *ngFor=\"let definition of additionalFields\" [matColumnDef]=\"definition.key\">\n        <th mat-header-cell *matHeaderCellDef>\n          <span>{{definition.label|translate}}</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\"\n            (click)=\"focusColumn=definition.key\">\n          <app-form-field floatLabel=\"never\"\n                          [definition]=\"definition\"\n                          [formControl]=\"row.validator.controls[definition.key]\"\n                          [required]=\"definition.extra?.account?.required\"\n                          [autofocus]=\"row.editing && focusColumn===definition.ke\">\n          </app-form-field>\n        </td>\n      </ng-container>\n\n      <!-- profile column  -->\n      <ng-container matColumnDef=\"profile\">\n        <th mat-header-cell *matHeaderCellDef>\n          <span translate>USER.PROFILE</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\"\n            (click)=\"focusColumn='profile'\">\n          <mat-form-field floatLabel=\"never\">\n            <mat-select [formControl]=\"row.validator.controls['mainProfile']\"\n                        [placeholder]=\"'USER.PROFILE'|translate\">\n              <mat-option *ngFor=\"let item of profiles\" [value]=\"item\">\n                {{ ('USER.PROFILE_ENUM.' + item) | uppercase |translate }}\n              </mat-option>\n            </mat-select>\n            <mat-error *ngIf=\"row.validator.controls['mainProfile'].hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n          </mat-form-field>\n        </td>\n      </ng-container>\n\n      <!-- Status column  -->\n      <ng-container matColumnDef=\"status\">\n        <th mat-header-cell *matHeaderCellDef>\n          <span translate>USER.STATUS</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\"\n            (click)=\"focusColumn='status'\">\n          <mat-form-field floatLabel=\"never\">\n            <ion-icon matPrefix *ngIf=\"row.validator.controls['statusId'].value &gt;=0\" [name]=\"statusById[row.validator.controls['statusId'].value]?.icon\"></ion-icon>\n\n            <mat-select [formControl]=\"row.validator.controls['statusId']\"\n                        [placeholder]=\"'REFERENTIAL.STATUS'|translate\">\n              <mat-select-trigger>\n                <span *ngIf=\"row.validator.controls['statusId'].value &gt;=0\">\n                  {{ statusById[row.validator.controls['statusId'].value]?.label | translate}}</span>\n              </mat-select-trigger>\n              <mat-option *ngFor=\"let item of statusList\" [value]=\"item.id\">\n                <ion-icon [name]=\"item.icon\"></ion-icon>\n                {{ item.label |translate }}\n              </mat-option>\n            </mat-select>\n            <mat-error *ngIf=\"row.validator.controls['statusId'].hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n          </mat-form-field>\n        </td>\n      </ng-container>\n\n      <!-- username -->\n      <ng-container matColumnDef=\"username\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>\n          <span translate>USER.USERNAME</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\"\n            (click)=\"focusColumn='username'\">\n          <mat-form-field floatLabel=\"never\" >\n            <input matInput [formControl]=\"row.validator.controls.username\"\n                   [placeholder]=\"'USER.USERNAME'|translate\"\n                   [readonly]=\"!row.editing\"\n                   [appAutofocus]=\"row.editing && focusColumn==='username'\">\n            <mat-error *ngIf=\"row.validator.controls.username.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n          </mat-form-field>\n        </td>\n      </ng-container>\n\n      <!-- username extranet -->\n      <ng-container matColumnDef=\"usernameExtranet\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>\n          <span translate>USER.USERNAME_EXTRANET</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\"\n            (click)=\"focusColumn='usernameExtranet'\">\n          <mat-form-field floatLabel=\"never\">\n            <input matInput [formControl]=\"row.validator.controls.usernameExtranet\"\n                   [placeholder]=\"'USER.USERNAME_EXTRANET'|translate\"\n                   [readonly]=\"!row.editing\"\n                   [appAutofocus]=\"row.editing && focusColumn==='usernameExtranet'\">\n            <mat-error *ngIf=\"row.validator.controls.usernameExtranet.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n          </mat-form-field>\n        </td>\n      </ng-container>\n\n      <!-- pubkey  -->\n      <ng-container matColumnDef=\"pubkey\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>\n          <span translate>USER.PUBKEY</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\"\n            [title]=\"row.validator.controls['pubkey'].value\"\n            (click)=\"focusColumn='pubkey'\">\n          <mat-form-field floatLabel=\"never\"  >\n            <input matInput [formControl]=\"row.validator.controls['pubkey']\" [placeholder]=\"'USER.PUBKEY'|translate\"\n                   [readonly]=\"!row.editing\" autocomplete=\"off\">\n            <mat-error *ngIf=\"row.validator.controls['pubkey'].hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n            <mat-error *ngIf=\"row.validator.controls['pubkey'].hasError('pubkey')\">\n              <span translate>ERROR.FIELD_NOT_VALID_PUBKEY</span>\n            </mat-error>\n          </mat-form-field>\n        </td>\n      </ng-container>\n\n      <!-- Actions buttons column -->\n      <app-actions-column [stickyEnd]=\"useSticky\"\n                          (optionsClick)=\"openSelectColumnsModal($event)\"\n                          (cancelOrDeleteClick)=\"cancelOrDelete($event.event, $event.row)\"\n                          (confirmAndAddClick)=\"confirmAndAdd($event.event, $event.row)\"\n                          (backward)=\"confirmAndBackward($event.event, $event.row)\"\n                          (forward)=\"confirmAndForward($event.event, $event.row)\"\n                          [canCancel]=\"false\">\n      </app-actions-column>\n\n      <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\n      <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"\n          [class.mat-row-error]=\"row.validator.invalid\"\n          [class.mat-row-dirty]=\"row.currentData.dirty\"\n          [class.mat-row-disabled]=\"!row.editing\"\n          (click)=\"clickRow($event, row)\"\n          (keydown.escape)=\"escapeEditingRow($event)\"\n          [cdkTrapFocus]=\"row.validator.invalid\"></tr>\n    </table>\n\n    <ng-container *ngIf=\"loadingSubject|async; else noResult\">\n      <ion-item>\n        <ion-skeleton-text animated></ion-skeleton-text>\n      </ion-item>\n    </ng-container>\n\n    <ng-template #noResult>\n      <ion-item *ngIf=\"totalRowCount === 0\">\n        <ion-text color=\"danger\" class=\"text-italic\" translate>COMMON.NO_RESULT</ion-text>\n      </ion-item>\n    </ng-template>\n  </div>\n</ion-content>\n\n<ion-footer>\n  <mat-paginator class=\"mat-paginator-footer\"\n                 [length]=\"totalRowCount\" [pageSize]=\"defaultPageSize\"\n                 [pageSizeOptions]=\"defaultPageSizeOptions\" showFirstLastButtons>\n  </mat-paginator>\n\n  <app-form-buttons-bar *ngIf=\"!mobile && inlineEdition\"\n                        (onCancel)=\"onRefresh.emit()\" (onSave)=\"save()\" [disabled]=\"(loadingSubject|async) || !dirty\"></app-form-buttons-bar>\n</ion-footer>\n\n<ion-fab slot=\"fixed\" vertical=\"bottom\" horizontal=\"end\" *ngIf=\"mobile\">\n  <ion-fab-button color=\"tertiary\" (click)=\"addRow()\">\n    <ion-icon name=\"add\"></ion-icon>\n  </ion-fab-button>\n</ion-fab>\n",
+                template: "<app-toolbar [title]=\"'USER.LIST.TITLE'|translate\"\n             color=\"primary\"\n             [canGoBack]=\"false\"\n             [hasValidate]=\"!(loadingSubject|async) && dirty\"\n             (onValidate)=\"save()\">\n  <ion-buttons slot=\"end\">\n\n    <!-- Compose message -->\n    <button mat-icon-button *ngIf=\"canSendMessage\"\n            [title]=\"'USER.LIST.BTN_SEND_MESSAGE'|translate\"\n            (click)=\"openComposeMessageModal($event)\">\n      <ion-icon name=\"mail\" slot=\"icon-only\"></ion-icon>\n    </button>\n\n    <ng-container *ngIf=\"!selection.hasValue(); else hasSelection\">\n      <!-- Add -->\n      <button mat-icon-button\n              *ngIf=\"canEdit && !mobile\"\n              [title]=\"'COMMON.BTN_ADD'|translate\"\n              (click)=\"addRow()\">\n        <mat-icon>add</mat-icon>\n      </button>\n\n      <!-- Refresh -->\n      <button mat-icon-button *ngIf=\"!mobile\"\n              [title]=\"'COMMON.BTN_REFRESH'|translate\"\n              (click)=\"onRefresh.emit()\">\n        <mat-icon>refresh</mat-icon>\n      </button>\n\n      <!-- reset filter -->\n      <button mat-icon-button (click)=\"resetFilter()\"\n              *ngIf=\"filterCriteriaCount\">\n        <mat-icon color=\"accent\">filter_list_alt</mat-icon>\n        <mat-icon class=\"icon-secondary\" style=\"left: 16px; top: 5px; font-weight: bold;\">close</mat-icon>\n      </button>\n\n      <!-- show filter -->\n      <button mat-icon-button (click)=\"filterExpansionPanel.toggle()\">\n        <mat-icon *ngIf=\"filterCriteriaCount; else emptyFilter\"\n                  [matBadge]=\"filterCriteriaCount\"\n                  matBadgeColor=\"accent\"\n                  matBadgeSize=\"small\"\n                  matBadgePosition=\"above after\">filter_list_alt\n        </mat-icon>\n        <ng-template #emptyFilter>\n          <mat-icon>filter_list_alt</mat-icon>\n        </ng-template>\n      </button>\n    </ng-container>\n\n    <ng-template #hasSelection>\n\n      <!-- delete -->\n      <button mat-icon-button\n              class=\"hidden-xs hidden-sm\"\n              [title]=\"'COMMON.BTN_DELETE'|translate\"\n              (click)=\"deleteSelection($event)\">\n        <mat-icon>delete</mat-icon>\n      </button>\n    </ng-template>\n  </ion-buttons>\n</app-toolbar>\n\n<ion-content class=\"ion-no-padding\">\n\n  <!-- error -->\n  <ion-item *ngIf=\"errorSubject|async ; let error\" lines=\"none\" @slideUpDownAnimation>\n    <ion-icon color=\"danger\" slot=\"start\" name=\"alert-circle\"></ion-icon>\n    <ion-label color=\"danger\" class=\"error\" [innerHTML]=\"error|translate\"></ion-label>\n  </ion-item>\n\n  <!-- search -->\n  <mat-expansion-panel #filterExpansionPanel class=\"ion-no-padding filter-panel filter-panel-floating\">\n    <form class=\"form-container ion-padding\" [formGroup]=\"filterForm\" (ngSubmit)=\"onRefresh.emit()\">\n      <ion-grid>\n        <ion-row>\n          <ion-col>\n            <!-- search -->\n            <mat-form-field>\n              <input matInput [placeholder]=\"'USER.LIST.FILTER.SEARCH'|translate\" formControlName=\"searchText\">\n\n              <button mat-icon-button matSuffix tabindex=\"-1\"\n                      type=\"button\"\n                      (click)=\"clearControlValue($event, filterForm.controls.searchText)\"\n                      [hidden]=\"filterForm.controls.searchText.disabled || !filterForm.controls.searchText.value\">\n                <mat-icon>close</mat-icon>\n              </button>\n            </mat-form-field>\n          </ion-col>\n\n          <ion-col>\n            <!-- status -->\n            <mat-form-field>\n              <mat-select formControlName=\"statusId\" [placeholder]=\"'USER.STATUS'|translate\">\n                <mat-option [value]=\"null\"><i><span translate>COMMON.EMPTY_OPTION</span></i></mat-option>\n                <mat-option *ngFor=\"let item of statusList\" [value]=\"item.id\">\n                  <ion-icon [name]=\"item.icon\"></ion-icon>\n                  {{ item.label |translate }}\n                </mat-option>\n              </mat-select>\n\n              <button mat-icon-button matSuffix tabindex=\"-1\"\n                      type=\"button\"\n                      (click)=\"clearControlValue($event, filterForm.controls.statusId)\"\n                      [hidden]=\"filterForm.controls.statusId.disabled || !filterForm.controls.statusId.value\">\n                <mat-icon>close</mat-icon>\n              </button>\n            </mat-form-field>\n          </ion-col>\n        </ion-row>\n      </ion-grid>\n    </form>\n\n    <mat-action-row>\n      <!-- Counter  -->\n      <ion-label [hidden]=\"(loadingSubject|async) || filterForm.dirty\"\n                 [color]=\"empty && 'danger'\"\n                 class=\"ion-padding\">\n        {{ (totalRowCount ? 'COMMON.RESULT_COUNT' : 'COMMON.NO_RESULT') | translate: {\n        count: (totalRowCount |\n          numberFormat)\n      } }}\n      </ion-label>\n\n      <div class=\"toolbar-spacer\"></div>\n\n      <!-- Close panel -->\n      <ion-button mat-button fill=\"clear\" color=\"dark\"\n                  (click)=\"filterExpansionPanel.close()\"\n                  [disabled]=\"loadingSubject|async\">\n        <ion-text translate>COMMON.BTN_CLOSE</ion-text>\n      </ion-button>\n\n      <!-- Search button -->\n      <ion-button mat-button\n                  [color]=\"filterForm.dirty ? 'tertiary' : 'dark'\"\n                  [fill]=\"filterForm.dirty ? 'solid' : 'clear'\"\n                  (click)=\"applyFilterAndClosePanel($event)\"\n                  [disabled]=\"loadingSubject|async\">\n        <ion-text translate>COMMON.BTN_APPLY</ion-text>\n      </ion-button>\n\n    </mat-action-row>\n  </mat-expansion-panel>\n\n  <!-- error -->\n  <ion-item *ngIf=\"error\" visible-xs visible-sm visible-mobile lines=\"none\">\n    <ion-icon color=\"danger\" slot=\"start\" name=\"alert-circle\"></ion-icon>\n    <ion-label color=\"danger\" class=\"error\" [innerHTML]=\"error|translate\"></ion-label>\n  </ion-item>\n\n  <div class=\"table-container\">\n    <table #table mat-table matSort\n           [dataSource]=\"dataSource\"\n           [matSortActive]=\"defaultSortBy\" [matSortDirection]=\"defaultSortDirection\"\n           matSortDisableClear [trackBy]=\"trackByFn\">\n\n      <ng-container matColumnDef=\"select\" [sticky]=\"useSticky\">\n        <th mat-header-cell *matHeaderCellDef [class.cdk-visually-hidden]=\"!inlineEdition\">\n          <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\"\n                        [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\n          </mat-checkbox>\n        </th>\n        <td mat-cell *matCellDef=\"let row\" [class.cdk-visually-hidden]=\"!inlineEdition\">\n          <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(row) : null\" [checked]=\"selection.isSelected(row)\">\n          </mat-checkbox>\n        </td>\n      </ng-container>\n\n      <!-- Id Column -->\n      <ng-container matColumnDef=\"id\" [sticky]=\"useSticky\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>\n          <ion-label>#</ion-label>\n        </th>\n        <td mat-cell *matCellDef=\"let row\">{{ row.currentData.id }}</td>\n      </ng-container>\n\n      <!-- avatar Column -->\n      <ng-container matColumnDef=\"avatar\" [sticky]=\"useSticky\">\n        <th mat-header-cell *matHeaderCellDef></th>\n        <td mat-cell *matCellDef=\"let row\">\n          <div class=\"avatar\" *ngIf=\"row.currentData.avatar; else generateIcon\"\n               [ngStyle]=\"{'background-image':'url('+row.currentData.avatar+')'}\"></div>\n          <ng-template #generateIcon>\n            <div class=\"avatar\">\n              <svg width=\"38\" width=\"38\" [data-jdenticon-value]=\"row.currentData.id\"></svg>\n            </div>\n          </ng-template>\n        </td>\n      </ng-container>\n\n      <!-- lastName  -->\n      <ng-container matColumnDef=\"lastName\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>\n          <span translate>USER.LAST_NAME</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\" (click)=\"focusColumn='lastName'\">\n          <mat-form-field floatLabel=\"never\">\n            <input matInput\n                   [formControl]=\"row.validator.controls['lastName']\"\n                   [placeholder]=\"'USER.LAST_NAME'|translate\"\n                   [readonly]=\"!row.editing\"\n                   [appAutofocus]=\"row.editing && focusColumn==='lastName'\">\n            <mat-error *ngIf=\"row.validator.controls['lastName'].hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n            <mat-error *ngIf=\"row.validator.controls['lastName'].hasError('minlength')\">\n              <span>{{'ERROR.FIELD_MIN_LENGTH' | translate: {minLength: 2} }}</span>\n            </mat-error>\n          </mat-form-field>\n\n        </td>\n\n      </ng-container>\n\n      <!-- firstname -->\n      <ng-container matColumnDef=\"firstName\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>\n          <span translate>USER.FIRST_NAME</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\"\n\n            (click)=\"focusColumn='firstName'\">\n          <mat-form-field floatLabel=\"never\">\n            <input matInput [formControl]=\"row.validator.controls['firstName']\"\n                   [placeholder]=\"'USER.FIRST_NAME'|translate\"\n                   [readonly]=\"!row.editing\"\n                   [appAutofocus]=\"row.editing && focusColumn==='firstName'\">\n            <mat-error *ngIf=\"row.validator.controls['firstName'].hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n            <mat-error *ngIf=\"row.validator.controls['firstName'].hasError('minlength')\">\n              <span>{{'ERROR.FIELD_MIN_LENGTH' | translate: {minLength: 2} }}</span>\n            </mat-error>\n          </mat-form-field>\n        </td>\n      </ng-container>\n\n      <!-- email  -->\n      <ng-container matColumnDef=\"email\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>\n          <span translate>USER.EMAIL</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\" (click)=\"focusColumn='email'\">\n          <mat-form-field floatLabel=\"never\">\n            <input matInput [formControl]=\"row.validator.controls['email']\"\n                   [placeholder]=\"'USER.EMAIL'|translate\"\n                   [readonly]=\"!row.editing\"\n                   [appAutofocus]=\"row.editing && focusColumn==='email'\">\n            <mat-error *ngIf=\"row.validator.controls['email'].hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n            <mat-error *ngIf=\"row.validator.controls['email'].hasError('email')\">\n              <span translate>ERROR.FIELD_NOT_VALID_EMAIL</span>\n            </mat-error>\n          </mat-form-field>\n        </td>\n      </ng-container>\n\n      <!-- additional fields -->\n      <ng-container *ngFor=\"let definition of additionalFields\" [matColumnDef]=\"definition.key\">\n        <th mat-header-cell *matHeaderCellDef>\n          <span>{{definition.label|translate}}</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\"\n            (click)=\"focusColumn=definition.key\">\n          <app-form-field floatLabel=\"never\"\n                          [definition]=\"definition\"\n                          [formControl]=\"row.validator.controls[definition.key]\"\n                          [required]=\"definition.extra?.account?.required\"\n                          [autofocus]=\"row.editing && focusColumn===definition.ke\">\n          </app-form-field>\n        </td>\n      </ng-container>\n\n      <!-- profile column  -->\n      <ng-container matColumnDef=\"profile\">\n        <th mat-header-cell *matHeaderCellDef>\n          <span translate>USER.PROFILE</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\"\n            (click)=\"focusColumn='profile'\">\n          <mat-form-field floatLabel=\"never\">\n            <mat-select [formControl]=\"row.validator.controls['mainProfile']\"\n                        [placeholder]=\"'USER.PROFILE'|translate\">\n              <mat-option *ngFor=\"let item of profiles\" [value]=\"item\">\n                {{ ('USER.PROFILE_ENUM.' + item) | uppercase |translate }}\n              </mat-option>\n            </mat-select>\n            <mat-error *ngIf=\"row.validator.controls['mainProfile'].hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n          </mat-form-field>\n        </td>\n      </ng-container>\n\n      <!-- Status column  -->\n      <ng-container matColumnDef=\"status\">\n        <th mat-header-cell *matHeaderCellDef>\n          <span translate>USER.STATUS</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\"\n            (click)=\"focusColumn='status'\">\n          <mat-form-field floatLabel=\"never\">\n            <ion-icon matPrefix *ngIf=\"row.validator.controls['statusId'].value &gt;=0\" [name]=\"statusById[row.validator.controls['statusId'].value]?.icon\"></ion-icon>\n\n            <mat-select [formControl]=\"row.validator.controls['statusId']\"\n                        [placeholder]=\"'REFERENTIAL.STATUS'|translate\">\n              <mat-select-trigger>\n                <span *ngIf=\"row.validator.controls['statusId'].value &gt;=0\">\n                  {{ statusById[row.validator.controls['statusId'].value]?.label | translate}}</span>\n              </mat-select-trigger>\n              <mat-option *ngFor=\"let item of statusList\" [value]=\"item.id\">\n                <ion-icon [name]=\"item.icon\"></ion-icon>\n                {{ item.label |translate }}\n              </mat-option>\n            </mat-select>\n            <mat-error *ngIf=\"row.validator.controls['statusId'].hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n          </mat-form-field>\n        </td>\n      </ng-container>\n\n      <!-- username -->\n      <ng-container matColumnDef=\"username\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>\n          <span translate>USER.USERNAME</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\"\n            (click)=\"focusColumn='username'\">\n          <mat-form-field floatLabel=\"never\" >\n            <input matInput [formControl]=\"row.validator.controls.username\"\n                   [placeholder]=\"'USER.USERNAME'|translate\"\n                   [readonly]=\"!row.editing\"\n                   [appAutofocus]=\"row.editing && focusColumn==='username'\">\n            <mat-error *ngIf=\"row.validator.controls.username.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n          </mat-form-field>\n        </td>\n      </ng-container>\n\n      <!-- username extranet -->\n      <ng-container matColumnDef=\"usernameExtranet\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>\n          <span translate>USER.USERNAME_EXTRANET</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\"\n            (click)=\"focusColumn='usernameExtranet'\">\n          <mat-form-field floatLabel=\"never\">\n            <input matInput [formControl]=\"row.validator.controls.usernameExtranet\"\n                   [placeholder]=\"'USER.USERNAME_EXTRANET'|translate\"\n                   [readonly]=\"!row.editing\"\n                   [appAutofocus]=\"row.editing && focusColumn==='usernameExtranet'\">\n            <mat-error *ngIf=\"row.validator.controls.usernameExtranet.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n          </mat-form-field>\n        </td>\n      </ng-container>\n\n      <!-- pubkey  -->\n      <ng-container matColumnDef=\"pubkey\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>\n          <span translate>USER.PUBKEY</span>\n        </th>\n        <td mat-cell *matCellDef=\"let row\"\n            [title]=\"row.validator.controls.pubkey.valueChanges|async\"\n            (click)=\"focusColumn='pubkey'\">\n          <mat-form-field floatLabel=\"never\">\n            <input matInput [formControl]=\"row.validator.controls['pubkey']\" [placeholder]=\"'USER.PUBKEY'|translate\"\n                   [readonly]=\"!row.editing\" autocomplete=\"off\">\n            <mat-error *ngIf=\"row.validator.controls.pubkey.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n            <mat-error *ngIf=\"row.validator.controls.pubkey.hasError('pubkey')\">\n              <span translate>ERROR.FIELD_NOT_VALID_PUBKEY</span>\n            </mat-error>\n          </mat-form-field>\n        </td>\n      </ng-container>\n\n      <!-- Actions buttons column -->\n      <app-actions-column [stickyEnd]=\"useSticky\"\n                          (optionsClick)=\"openSelectColumnsModal($event)\"\n                          (cancelOrDeleteClick)=\"cancelOrDelete($event.event, $event.row)\"\n                          (confirmAndAddClick)=\"confirmAndAdd($event.event, $event.row)\"\n                          (backward)=\"confirmAndBackward($event.event, $event.row)\"\n                          (forward)=\"confirmAndForward($event.event, $event.row)\"\n                          [canCancel]=\"false\">\n      </app-actions-column>\n\n      <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\n      <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"\n          [class.mat-row-error]=\"row.validator.invalid\"\n          [class.mat-row-dirty]=\"row.currentData.dirty\"\n          [class.mat-row-disabled]=\"!row.editing\"\n          (click)=\"clickRow($event, row)\"\n          (keydown.escape)=\"escapeEditingRow($event)\"\n          [cdkTrapFocus]=\"row.validator.invalid\"></tr>\n    </table>\n\n    <ng-container *ngIf=\"loadingSubject|async; else noResult\">\n      <ion-item>\n        <ion-skeleton-text animated></ion-skeleton-text>\n      </ion-item>\n    </ng-container>\n\n    <ng-template #noResult>\n      <ion-item *ngIf=\"totalRowCount === 0\">\n        <ion-text color=\"danger\" class=\"text-italic\" translate>COMMON.NO_RESULT</ion-text>\n      </ion-item>\n    </ng-template>\n  </div>\n</ion-content>\n\n<ion-footer>\n  <mat-paginator class=\"mat-paginator-footer\"\n                 [length]=\"totalRowCount\" [pageSize]=\"defaultPageSize\"\n                 [pageSizeOptions]=\"defaultPageSizeOptions\" showFirstLastButtons>\n  </mat-paginator>\n\n  <app-form-buttons-bar *ngIf=\"!mobile && inlineEdition\"\n                        (onCancel)=\"onRefresh.emit()\" (onSave)=\"save()\" [disabled]=\"(loadingSubject|async) || !dirty\"></app-form-buttons-bar>\n</ion-footer>\n\n<ion-fab slot=\"fixed\" vertical=\"bottom\" horizontal=\"end\" *ngIf=\"mobile\">\n  <ion-fab-button color=\"tertiary\" (click)=\"addRow()\">\n    <ion-icon name=\"add\"></ion-icon>\n  </ion-fab-button>\n</ion-fab>\n",
                 providers: [
                     { provide: ValidatorService, useExisting: PersonValidatorService }
                 ],
@@ -25719,12 +26030,13 @@ UsersPage.decorators = [
 ];
 UsersPage.ctorParameters = () => [
     { type: Injector },
+    { type: FormBuilder },
     { type: AccountService },
     { type: ValidatorService },
     { type: ConfigService },
     { type: PersonService },
+    { type: MessageService },
     { type: ChangeDetectorRef },
-    { type: FormBuilder },
     { type: undefined, decorators: [{ type: Inject, args: [ENVIRONMENT,] }] }
 ];
 UsersPage.propDecorators = {
@@ -25751,22 +26063,24 @@ AdminModule.decorators = [
                     UsersPage
                 ],
                 exports: [
+                    SocialModule,
                     UsersPage
                 ]
             },] }
 ];
 AdminModule.ctorParameters = () => [];
 
-const ɵ0 = {
+const ɵ0$c = {
     profile: 'ADMIN'
 };
-const routes$5 = [
+const routes = [
     {
         path: 'users',
         pathMatch: 'full',
         component: UsersPage,
         canActivate: [AuthGuardService],
-        data: ɵ0
+        canDeactivate: [ComponentDirtyGuard],
+        data: ɵ0$c
     }
 ];
 class AdminRoutingModule {
@@ -25776,33 +26090,27 @@ AdminRoutingModule.decorators = [
                 imports: [
                     SharedRoutingModule,
                     AdminModule,
-                    RouterModule.forChild(routes$5)
+                    RouterModule.forChild(routes)
                 ],
                 exports: [RouterModule]
             },] }
 ];
 
-const ErrorCodes = {
-    LOAD_PERSONS_ERROR: 100,
-    SAVE_PERSONS_ERROR: 101,
-    DELETE_PERSONS_ERROR: 102,
-};
-
-class EntityTestClass$1 {
+class EntityTestClass {
 }
-const FAKE_ENTITIES$1 = [
+const FAKE_ENTITIES = [
     { id: 1, label: 'AAA', name: 'Item A', description: 'Very long description A', comments: 'Very very long comments... again for A' },
     { id: 2, label: 'BBB', name: 'Item B', description: 'Very long description B', comments: 'Very very long comments... again for B' },
     { id: 3, label: 'CCC', name: 'Item C', description: 'Very long description C', comments: 'Very very long comments... again for C' }
 ];
-function deepCopy$1(values, size) {
+function deepCopy(values, size) {
     if (isNil(size)) {
-        return (values || FAKE_ENTITIES$1).map(entity => Object.assign({}, entity));
+        return (values || FAKE_ENTITIES).map(entity => Object.assign({}, entity));
     }
     let result = [];
     let i = 1;
     while (result.length < size) {
-        result = result.concat((values || FAKE_ENTITIES$1).map(entity => {
+        result = result.concat((values || FAKE_ENTITIES).map(entity => {
             const name = entity.name + ' #' + i;
             return Object.assign(Object.assign({}, entity), { id: i++, name });
         }));
@@ -25812,7 +26120,7 @@ function deepCopy$1(values, size) {
 class AutocompleteTestPage {
     constructor(formBuilder) {
         this.formBuilder = formBuilder;
-        this._items = deepCopy$1(FAKE_ENTITIES$1, 100);
+        this._items = deepCopy(FAKE_ENTITIES, 100);
         this._$items = new BehaviorSubject(undefined);
         this.autocompleteFields = new MatAutocompleteConfigHolder();
         this.memoryHide = false;
@@ -25857,7 +26165,7 @@ class AutocompleteTestPage {
         });
         // From items
         this.autocompleteFields.add('entity-items-large', {
-            items: FAKE_ENTITIES$1.slice(),
+            items: FAKE_ENTITIES.slice(),
             attributes: ['label', 'name', 'description', 'comments'],
             displayWith: this.entityToString
         });
@@ -25876,13 +26184,13 @@ class AutocompleteTestPage {
     loadData() {
         return __awaiter(this, void 0, void 0, function* () {
             const data = {
-                entity: deepCopy$1(FAKE_ENTITIES$1)[0],
+                entity: deepCopy(FAKE_ENTITIES)[0],
                 // This item is NOT in the items list => i should be displayed anyway
                 missingEntity: {
                     id: -1, label: '??', name: 'Missing item'
                 },
-                disableEntity: deepCopy$1(FAKE_ENTITIES$1)[2],
-                entities: deepCopy$1(FAKE_ENTITIES$1)
+                disableEntity: deepCopy(FAKE_ENTITIES)[2],
+                entities: deepCopy(FAKE_ENTITIES)
             };
             this.form.setValue(data);
             // Load observables
@@ -26029,13 +26337,13 @@ LatLongTestPage.ctorParameters = () => [
     { type: FormBuilder }
 ];
 
-const moment$2 = momentImported;
+const moment$5 = momentImported;
 class SwipeTestPage {
     constructor(formBuilder, dateFormatPipe) {
         this.formBuilder = formBuilder;
         this.dateFormatPipe = dateFormatPipe;
         this.$dates = new BehaviorSubject(undefined);
-        this._today = moment$2().startOf('day');
+        this._today = moment$5().startOf('day');
         this.form = formBuilder.group({
             empty: [null, Validators.required],
             date: [null, Validators.compose([Validators.required, SharedValidators.validDate])],
@@ -26048,7 +26356,7 @@ class SwipeTestPage {
     ngOnInit() {
         const dates = [];
         for (let d = 0; d < 7; d++) {
-            dates[d] = moment$2(this._today).add(d - 3, 'day');
+            dates[d] = moment$5(this._today).add(d - 3, 'day');
         }
         this.$dates.next(dates);
         this.loadData();
@@ -26089,7 +26397,7 @@ SwipeTestPage.ctorParameters = () => [
     { type: DateFormatPipe }
 ];
 
-const moment$1 = momentImported;
+const moment$6 = momentImported;
 class DateTimeTestPage {
     constructor(platform, formBuilder, cd) {
         this.platform = platform;
@@ -26120,7 +26428,7 @@ class DateTimeTestPage {
     // Load the form with data
     loadData() {
         return __awaiter(this, void 0, void 0, function* () {
-            const now = moment$1();
+            const now = moment$6();
             const data = {
                 empty: toDateISOString(now.clone().add(2, 'hours')),
                 enable: toDateISOString(now),
@@ -26181,9 +26489,9 @@ DateTimeTestPage.ctorParameters = () => [
     { type: ChangeDetectorRef }
 ];
 
-class EntityTestClass {
+class EntityTestClass$1 {
 }
-const FAKE_ENTITIES = [
+const FAKE_ENTITIES$1 = [
     { id: 1, label: 'AAA', name: 'Item A' },
     { id: 2, label: 'BBB', name: 'Item B' },
     { id: 3, label: 'CCC', name: 'Item C' },
@@ -26192,14 +26500,14 @@ const FAKE_ENTITIES = [
     { id: 6, label: 'FFF', name: 'Item F' },
     { id: 7, label: 'GGG', name: 'Item G' }
 ];
-function deepCopy(values, size) {
+function deepCopy$1(values, size) {
     if (isNil(size)) {
-        return (values || FAKE_ENTITIES).map(entity => Object.assign({}, entity));
+        return (values || FAKE_ENTITIES$1).map(entity => Object.assign({}, entity));
     }
     let result = [];
     let i = 1;
     while (result.length < size) {
-        result = result.concat((values || FAKE_ENTITIES).map(entity => {
+        result = result.concat((values || FAKE_ENTITIES$1).map(entity => {
             const name = entity.name + ' #' + i;
             return Object.assign(Object.assign({}, entity), { id: i++, name });
         }));
@@ -26209,7 +26517,7 @@ function deepCopy(values, size) {
 class ChipsTestPage {
     constructor(formBuilder) {
         this.formBuilder = formBuilder;
-        this._items = deepCopy(FAKE_ENTITIES, 100);
+        this._items = deepCopy$1(FAKE_ENTITIES$1, 100);
         this._$items = new BehaviorSubject(undefined);
         this.autocompleteFields = new MatAutocompleteConfigHolder();
         this.form = formBuilder.group({
@@ -26248,7 +26556,7 @@ class ChipsTestPage {
     // Load the form with data
     loadData() {
         return __awaiter(this, void 0, void 0, function* () {
-            const items = deepCopy(FAKE_ENTITIES);
+            const items = deepCopy$1(FAKE_ENTITIES$1);
             const data = {
                 entity: items.slice(0, 1),
                 entityInitial: items.slice(1, 2),
@@ -26364,7 +26672,7 @@ NumpadTestPage.ctorParameters = () => [
     { type: FormBuilder }
 ];
 
-const moment = momentImported;
+const moment$7 = momentImported;
 class DateTestPage {
     constructor(formBuilder, cd) {
         this.formBuilder = formBuilder;
@@ -26376,7 +26684,8 @@ class DateTestPage {
         this.timezone = 'Indian/Mahe';
         this.stringify = JSON.stringify;
         this.form = formBuilder.group({
-            empty: [null, Validators.required],
+            empty: [null, SharedValidators.validDate],
+            emptyRequired: [null, Validators.compose([Validators.required, SharedValidators.validDate])],
             enable: [null, Validators.required],
             disable: [null, Validators.required],
             readonly: [null],
@@ -26396,10 +26705,11 @@ class DateTestPage {
     // Load the form with data
     loadData() {
         return __awaiter(this, void 0, void 0, function* () {
-            const now = moment();
+            const now = moment$7();
             const nowAtMahe = now.clone().tz(this.timezone).startOf('day');
             const data = {
-                empty: toDateISOString(now.clone().add(2, 'hours')),
+                empty: null,
+                emptyRequired: null,
                 enable: toDateISOString(now),
                 disable: now.clone(),
                 readonly: now.clone(),
@@ -26453,7 +26763,7 @@ class DateTestPage {
 DateTestPage.decorators = [
     { type: Component, args: [{
                 selector: 'app-data-test',
-                template: "<ion-header>\n  <ion-toolbar color=\"primary\">\n\n    <ion-buttons slot=\"start\">\n      <ion-back-button></ion-back-button>\n    </ion-buttons>\n\n    <ion-title>Date field test page</ion-title>\n  </ion-toolbar>\n</ion-header>\n\n<ion-content class=\"ion-padding\">\n\n  <form class=\"form-container\" [formGroup]=\"form\" (ngSubmit)=\"doSubmit($event)\">\n\n    <ion-grid>\n\n      <!-- debugging memory leak -->\n      <ion-row><ion-col><ion-text><h4>Debug memory leak</h4></ion-text></ion-col></ion-row>\n      <ion-row>\n        <ion-col size=\"2\">\n          <ion-button *ngIf=\"!memoryTimer\" (click)=\"startMemoryTimer()\">Start timer</ion-button>\n          <ion-button *ngIf=\"memoryTimer\" (click)=\"stopMemoryTimer()\">Stop timer</ion-button>\n        </ion-col>\n        <ion-col size=\"2\">\n          <mat-form-field floatLabel=\"never\">\n            <input matInput type=\"text\" hidden>\n            <mat-checkbox (change)=\"memoryMobile=$event.checked\" [value]=\"memoryMobile\">\n              Mobile ?\n            </mat-checkbox>\n          </mat-form-field>\n        </ion-col>\n        <ion-col>\n          <mat-date-field formControlName=\"empty\"\n                               *ngIf=\"!memoryHide\"\n                               placeholder=\"Date\"\n                               [required]=\"true\"\n                               [mobile]=\"memoryMobile\"\n                               [clearable]=\"true\">\n            <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n          </mat-date-field>\n        </ion-col>\n      </ion-row>\n\n      <!-- Mobile mode -->\n      <ion-row><ion-col><ion-text><h4>Mobile mode</h4></ion-text></ion-col></ion-row>\n      <ion-row>\n        <ion-col>\n\n          <!-- Empty value -->\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  Empty value\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.empty.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"empty\"\n                                   placeholder=\"Date\"\n                                   [required]=\"true\"\n                                   [mobile]=\"true\"\n                                   [clearable]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- Enable  -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  With value\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.enable.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"enable\"\n                                   placeholder=\"Date\"\n                                   [required]=\"true\"\n                                   [mobile]=\"true\"\n                                   [clearable]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- Disable -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  Disable\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.disable.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"disable\"\n                                   placeholder=\"Date\"\n                                   [required]=\"true\"\n                                   [mobile]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- TimeZone  -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  TimeZone\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>timezone=\"{{timezone}}\" value=\"{{stringify(form.controls.timezone.value)}}\"</pre></small>\n                  <pre>Should display using the browser TZ,<br/>but serialize/deserialize for the given TZ</pre>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field #readonlyField formControlName=\"timezone\"\n                              placeholder=\"Date\"\n                              [mobile]=\"true\"\n                              [clearable]=\"true\"\n                              [timezone]=\"timezone\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n      </ion-row>\n      <!-- debug console -->\n      <ion-row>\n        <!-- buttons -->\n        <ion-col size=\"2\">\n          <!-- submit form -->\n          <ion-button (click)=\"doSubmit($event)\"\n                      fill=\"outline\">\n            <ion-icon name=\"checkmark\" slot=\"icon-only\"></ion-icon>\n          </ion-button>\n\n          <!-- clear log  -->\n          <ion-button (click)=\"clearLogPanel()\"\n                      fill=\"outline\">\n            <ion-icon name=\"trash\" slot=\"icon-only\"></ion-icon>\n          </ion-button>\n        </ion-col>\n        <ion-col size=\"10\" *ngIf=\"showLogPanel\">\n          <ion-text color=\"primary\">Log:<br/></ion-text>\n          <div class=\"ion-padding-start\">\n            <ion-text color=\"medium\">\n              <small [innerHTML]=\"logContent\"></small>\n            </ion-text>\n          </div>\n        </ion-col>\n      </ion-row>\n\n      <hr/>\n\n      <!-- Desktop mode -->\n      <ion-row><ion-col><ion-text><h4>Desktop mode</h4></ion-text></ion-col></ion-row>\n      <ion-row>\n        <ion-col>\n\n          <!-- Empty value -->\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  Empty value\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.empty.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"empty\"\n                                   placeholder=\"Date\"\n                                   [required]=\"true\"\n                                   [mobile]=\"false\"\n                                   [clearable]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- Enable  -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  With value\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.enable.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"enable\"\n                                   placeholder=\"Date\"\n                                   [required]=\"true\"\n                                   [mobile]=\"false\"\n                                   [clearable]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- Disable -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  Disable\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.disable.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"disable\"\n                                   placeholder=\"Date\"\n                                   [required]=\"true\"\n                                   [mobile]=\"false\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- TimeZone  -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  TimeZone\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>timezone=\"{{timezone}}\" value={{stringify(form.controls.timezone.value)}}</pre></small>\n                  <pre>Should display using the browser TZ,<br/>but serialize/deserialize for the given TZ</pre>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field #readonlyField formControlName=\"timezone\"\n                              placeholder=\"Date\"\n                              [mobile]=\"false\"\n                              [clearable]=\"true\"\n                              [timezone]=\"timezone\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- Readonly  -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  Readonly toggle\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.readonly.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-checkbox (change)=\"readonlyField.readonly=$event.checked\" [checked]=\"readonlyField.readonly\">\n              </mat-checkbox>\n\n              <mat-date-field #readonlyField formControlName=\"readonly\"\n                                   placeholder=\"Date\"\n                                   [readonly]=\"true\"\n                                   [mobile]=\"false\"\n                                   [clearable]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n      </ion-row>\n    </ion-grid>\n  </form>\n\n</ion-content>\n"
+                template: "<ion-header>\n  <ion-toolbar color=\"primary\">\n\n    <ion-buttons slot=\"start\">\n      <ion-back-button></ion-back-button>\n    </ion-buttons>\n\n    <ion-title>Date field test page</ion-title>\n  </ion-toolbar>\n</ion-header>\n\n<ion-content class=\"ion-padding\">\n\n  <form class=\"form-container\" [formGroup]=\"form\" (ngSubmit)=\"doSubmit($event)\">\n\n\n    <ion-grid>\n\n      <!-- debugging memory leak -->\n      <ion-row><ion-col><ion-text><h4>Debug memory leak</h4></ion-text></ion-col></ion-row>\n      <ion-row>\n        <ion-col size=\"2\">\n          <ion-button *ngIf=\"!memoryTimer\" (click)=\"startMemoryTimer()\">Start timer</ion-button>\n          <ion-button *ngIf=\"memoryTimer\" (click)=\"stopMemoryTimer()\">Stop timer</ion-button>\n        </ion-col>\n        <ion-col size=\"2\">\n          <mat-form-field floatLabel=\"never\">\n            <input matInput type=\"text\" hidden>\n            <mat-checkbox (change)=\"memoryMobile=$event.checked\" [value]=\"memoryMobile\">\n              Mobile ?\n            </mat-checkbox>\n          </mat-form-field>\n        </ion-col>\n        <ion-col>\n          <mat-date-field formControlName=\"empty\"\n                               *ngIf=\"!memoryHide\"\n                               placeholder=\"Date\"\n                               [required]=\"true\"\n                               [mobile]=\"memoryMobile\"\n                               [clearable]=\"true\">\n            <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n          </mat-date-field>\n        </ion-col>\n      </ion-row>\n\n      <!-- Mobile mode -->\n      <ion-row><ion-col><ion-text><h4>Mobile mode</h4></ion-text></ion-col></ion-row>\n      <ion-row>\n        <ion-col>\n\n          <!-- Empty value -->\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  Empty value\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.empty.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"empty\"\n                                   placeholder=\"Date\"\n                                   [mobile]=\"true\"\n                                   [clearable]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <ion-col>\n\n          <!-- Empty value -->\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  Empty value (required)\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.emptyRequired.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"emptyRequired\"\n                              placeholder=\"Date\"\n                              [required]=\"true\"\n                              [mobile]=\"true\"\n                              [clearable]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- Enable  -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  With value\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.enable.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"enable\"\n                                   placeholder=\"Date\"\n                                   [required]=\"true\"\n                                   [mobile]=\"true\"\n                                   [clearable]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- Disable -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  Disable\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.disable.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"disable\"\n                                   placeholder=\"Date\"\n                                   [required]=\"true\"\n                                   [mobile]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- TimeZone  -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  TimeZone\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>timezone=\"{{timezone}}\" value=\"{{stringify(form.controls.timezone.value)}}\"</pre></small>\n                  <pre>Should display using the browser TZ,<br/>but serialize/deserialize for the given TZ</pre>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"timezone\"\n                              placeholder=\"Date\"\n                              [mobile]=\"true\"\n                              [clearable]=\"true\"\n                              [timezone]=\"timezone\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- Readonly  -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  Readonly toggle\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.readonly.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-checkbox (change)=\"mobileReadonlyField.readonly=$event.checked\" [checked]=\"mobileReadonlyField.readonly\">\n              </mat-checkbox>\n\n              <mat-date-field #mobileReadonlyField formControlName=\"readonly\"\n                              placeholder=\"Date\"\n                              [readonly]=\"true\"\n                              [mobile]=\"true\"\n                              [clearable]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n      </ion-row>\n      <!-- debug console -->\n      <ion-row>\n        <!-- buttons -->\n        <ion-col size=\"2\">\n          <!-- submit form -->\n          <ion-button (click)=\"doSubmit($event)\"\n                      fill=\"outline\">\n            <ion-icon name=\"checkmark\" slot=\"icon-only\"></ion-icon>\n          </ion-button>\n\n          <!-- clear log  -->\n          <ion-button (click)=\"clearLogPanel()\"\n                      fill=\"outline\">\n            <ion-icon name=\"trash\" slot=\"icon-only\"></ion-icon>\n          </ion-button>\n        </ion-col>\n        <ion-col size=\"10\" *ngIf=\"showLogPanel\">\n          <ion-text color=\"primary\">Log:<br/></ion-text>\n          <div class=\"ion-padding-start\">\n            <ion-text color=\"medium\">\n              <small [innerHTML]=\"logContent\"></small>\n            </ion-text>\n          </div>\n        </ion-col>\n      </ion-row>\n\n      <hr/>\n\n      <!-- Desktop mode -->\n      <ion-row><ion-col><ion-text><h4>Desktop mode</h4></ion-text></ion-col></ion-row>\n      <ion-row>\n        <ion-col>\n\n          <!-- Empty value -->\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  Empty value\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.empty.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"empty\"\n                               placeholder=\"Date\"\n                               [mobile]=\"false\"\n                               [clearable]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <ion-col>\n\n          <!-- Empty value -->\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  Empty value (required)\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.emptyRequired.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"emptyRequired\"\n                              placeholder=\"Date\"\n                              [required]=\"true\"\n                              [mobile]=\"false\"\n                              [clearable]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- Enable  -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  With value\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.enable.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"enable\"\n                                   placeholder=\"Date\"\n                                   [required]=\"true\"\n                                   [mobile]=\"false\"\n                                   [clearable]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- Disable -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  Disable\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.disable.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"disable\"\n                                   placeholder=\"Date\"\n                                   [required]=\"true\"\n                                   [mobile]=\"false\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- TimeZone  -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  TimeZone\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>timezone=\"{{timezone}}\" value={{stringify(form.controls.timezone.value)}}</pre></small>\n                  <pre>Should display using the browser TZ,<br/>but serialize/deserialize for the given TZ</pre>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-date-field formControlName=\"timezone\"\n                              placeholder=\"Date\"\n                              [mobile]=\"false\"\n                              [clearable]=\"true\"\n                              [timezone]=\"timezone\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n        <!-- Readonly  -->\n        <ion-col>\n          <ion-card>\n            <ion-card-header>\n              <ion-card-title>\n                <ion-label color=\"primary\">\n                  Readonly toggle\n                </ion-label>\n              </ion-card-title>\n              <ion-card-subtitle>\n                <ion-text color=\"medium\">\n                  <small><pre>{{stringify(form.controls.readonly.value)}}</pre></small>\n                </ion-text>\n              </ion-card-subtitle>\n            </ion-card-header>\n            <ion-card-content>\n              <mat-checkbox (change)=\"desktopReadonlyField.readonly=$event.checked\" [checked]=\"desktopReadonlyField.readonly\">\n              </mat-checkbox>\n\n              <mat-date-field #desktopReadonlyField formControlName=\"readonly\"\n                                   placeholder=\"Date\"\n                                   [readonly]=\"true\"\n                                   [mobile]=\"false\"\n                                   [clearable]=\"true\">\n                <ion-icon matPrefix name=\"calendar-outline\"></ion-icon>\n              </mat-date-field>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n\n      </ion-row>\n    </ion-grid>\n\n  </form>\n</ion-content>\n"
             },] }
 ];
 DateTestPage.ctorParameters = () => [
@@ -26473,7 +26783,7 @@ const SHARED_MATERIAL_TESTING_PAGES = [
     { label: 'Shared directives', divider: true },
     { label: 'Badge icon directive', page: '/testing/shared/badge-icon' }
 ];
-const routes$4 = [
+const routes$1 = [
     {
         path: '',
         pathMatch: 'full',
@@ -26530,7 +26840,7 @@ MaterialTestingModule.decorators = [
                     ReactiveFormsModule,
                     SharedMaterialModule,
                     TranslateModule.forChild(),
-                    RouterModule.forChild(routes$4)
+                    RouterModule.forChild(routes$1)
                 ],
                 declarations: [
                     DateTimeTestPage,
@@ -26591,7 +26901,7 @@ ToastTestingPage.ctorParameters = () => [
     { type: TranslateService }
 ];
 
-const routes$3 = [
+const routes$2 = [
     {
         path: 'toast',
         pathMatch: 'full',
@@ -26606,7 +26916,7 @@ ToastTestingModule.decorators = [
                     CommonModule,
                     IonicModule,
                     TranslateModule.forChild(),
-                    RouterModule.forChild(routes$3)
+                    RouterModule.forChild(routes$2)
                 ],
                 declarations: [
                     ToastTestingPage
@@ -26669,7 +26979,7 @@ UploadFileTestingPage.ctorParameters = () => [
     { type: PopoverController }
 ];
 
-const routes$2 = [
+const routes$3 = [
     {
         path: 'upload-file',
         pathMatch: 'full',
@@ -26684,7 +26994,7 @@ UploadFileTestingModule.decorators = [
                     CommonModule,
                     IonicModule,
                     TranslateModule.forChild(),
-                    RouterModule.forChild(routes$2)
+                    RouterModule.forChild(routes$3)
                 ],
                 declarations: [
                     UploadFileTestingPage
@@ -27065,7 +27375,7 @@ TextPopoverTestingPage.ctorParameters = () => [
     { type: PopoverController }
 ];
 
-const routes$1 = [
+const routes$4 = [
     {
         path: 'text-popover',
         pathMatch: 'full',
@@ -27080,7 +27390,7 @@ TextPopoverTestingModule.decorators = [
                     CommonModule,
                     IonicModule,
                     TranslateModule.forChild(),
-                    RouterModule.forChild(routes$1)
+                    RouterModule.forChild(routes$4)
                 ],
                 declarations: [
                     TextPopoverTestingPage
@@ -27097,7 +27407,7 @@ const CORE_TESTING_PAGES = [
     { label: 'Table', page: '/testing/core/table' },
     { label: 'Text popover', page: '/testing/core/text-popover' }
 ];
-const routes = [
+const routes$5 = [
     {
         path: '',
         pathMatch: 'full',
@@ -27121,7 +27431,7 @@ CoreTestingModule.decorators = [
                 imports: [
                     CommonModule,
                     TranslateModule.forChild(),
-                    RouterModule.forChild(routes),
+                    RouterModule.forChild(routes$5),
                     // Sub modules
                     TableTestingModule,
                     TextPopoverTestingModule
@@ -27141,5 +27451,5 @@ CoreTestingModule.decorators = [
  * Generated bundle index. Do not edit.
  */
 
-export { APP_ABOUT_DEVELOPERS, APP_ABOUT_PARTNERS, APP_CONFIG_OPTIONS, APP_FORM_ERROR_I18N_KEYS, APP_GRAPHQL_TYPE_POLICIES, APP_HOME_BUTTONS, APP_LOCALES, APP_LOCAL_SETTINGS, APP_LOCAL_SETTINGS_OPTIONS, APP_LOCAL_STORAGE_TYPE_POLICIES, APP_MENU_ITEMS, APP_TESTING_PAGES, AboutModal, Account, AccountPage, AccountService, AccountToStringPipe, ActionsColumnComponent, AdminModule, AdminRoutingModule, Alerts, AndroidOsEnvironment, AnimationState, AppEditor, AppEditorOptions, AppEntityEditor, AppForm, AppFormField, AppFormProvider, AppFormUtils, AppGestureConfig, AppGraphQLModule, AppHelpModal, AppInMemoryTable, AppInstallUpgradeCard, AppListForm, AppLoadingSpinner, AppMenuModule, AppNullForm, AppPropertiesForm, AppTabEditor, AppTabEditorOptions, AppTable, AppTableDataSourceOptions, AppTableUtils, AppValidatorService, AppendToInputDirective, ArrayFilterPipe, ArrayFirstPipe, ArrayIncludesPipe, ArrayLengthPipe, ArrayPluckPipe, AudioProvider, AuthForm, AuthGuardService, AuthModal, AutocompleteTestPage, AutofocusDirective, Base58, BaseEntityService, BaseGraphqlService, BaseGraphqlServiceOptions, BaseReferential, Beans, CORE_CONFIG_OPTIONS, CORE_TESTING_PAGES, CellValueChangeListener, ChipsTestPage, Color, ColorScale, ComponentDirtyGuard, ConfigService, Configuration, CoreModule, CoreTestingModule, CryptoService, DATE_ISO_PATTERN, DATE_UNIX_MS_TIMESTAMP, DATE_UNIX_TIMESTAMP, DEFAULT_PAGE_SIZE, DEFAULT_PAGE_SIZE_OPTIONS, DEFAULT_PLACEHOLDER_CHAR, DEFAULT_REQUIRED_COLUMNS, DateDiffDurationPipe, DateFormatPipe, DateFromNowPipe, DateTimeTestPage, DateUtils, Department, DepartmentToStringPipe, DragAndDropDirective, DurationPipe, ENTITIES_STORAGE_KEY_PREFIX, ENVIRONMENT, EmptyArrayPipe, EntitiesService, EntitiesStorage, EntitiesTableDataSource, Entity, EntityClass, EntityClasses, EntityFilter, EntityFilterUtils, EntityMetadataComponent, EntityStore, EntityUtils, Environment, ErrorCodes, EvenPipe, FileResponse, FileService, FileSizePipe, FilesUtils, FormArrayHelper, FormButtonsBarComponent, FormButtonsBarToken, FormErrorTranslatePipe, FormErrorTranslator, FormFieldValuesHolder, FormGetArrayPipe, FormGetControlPipe, FormGetGroupPipe, FormGetPipe, Fragments, GraphqlService, HAMMER_PRESS_TIME, HAMMER_TAP_TIME, HighlightPipe, HomePage, Hotkeys, HotkeysDialogComponent, InMemoryEntitiesService, IsLoginAccountPipe, IsNilOrBlankPipe, IsNotNilOrBlankPipe, IsNotOnFieldModePipe, IsOnFieldModePipe, JobUtils, KEYBOARD_HIDE_DELAY_MS, LAT_LONG_DEFAULT_MAX_DECIMALS, LAT_LONG_PATTERNS, LatLongFormatPipe, LatLongTestPage, LatitudeFormatPipe, LocalSettingsService, LongitudeFormatPipe, MINIFY_ENTITY_FOR_LOCAL_STORAGE, MINIFY_ENTITY_FOR_POD, MapGetPipe, MapKeysPipe, MapValuesPipe, MatAutocompleteConfigHolder, MatAutocompleteField, MatBadgeIconDirective, MatBooleanField, MatChipsField, MatDate, MatDateShort, MatDateTime, MatDuration, MatLatLongField, MatNumpadComponent, MatNumpadContainerComponent, MatNumpadContent, MatPaginatorI18n, MatStepperI18n, MatSwipeField, MaterialTestingModule, MathAbsPipe, MenuComponent, MenuItems, MenuService, ModalToolbarComponent, NetworkService, NgInitDirective, NgVarDirective, NotEmptyArrayPipe, NumberFormatPipe, NumpadDirective, OddPipe, PRIORITIZED_AUTHORITIES, PUBKEY_REGEXP, Peer, Person, PersonFilter, PersonFragments, PersonService, PersonToStringPipe, PersonUtils, PersonValidatorService, PlatformService, ProgressBarService, ProgressInterceptor, PropertyGetPipe, RESERVED_END_COLUMNS, RESERVED_START_COLUMNS, Referential, ReferentialFilter, ReferentialRef, ReferentialUtils, ReferentialValidatorService, RegisterConfirmPage, SETTINGS_DISPLAY_COLUMNS, SETTINGS_FILTER, SETTINGS_PAGE_SIZE, SETTINGS_SORTED_COLUMN, SETTINGS_STORAGE_KEY, SETTINGS_TRANSIENT_PROPERTIES, SHARED_MATERIAL_TESTING_PAGES, SHARED_TESTING_PAGES, SPACE_PLACEHOLDER_CHAR, SelectPeerModal, SettingsPage, SharedAsyncValidators, SharedDirectivesModule, SharedFormArrayValidators, SharedFormGroupValidators, SharedHotkeysModule, SharedMatAutocompleteModule, SharedMatBadgeIconModule, SharedMatBooleanModule, SharedMatChipsModule, SharedMatDateTimeModule, SharedMatDurationModule, SharedMatLatLongModule, SharedMatNumpadModule, SharedMatSwipeModule, SharedMaterialModule, SharedModule, SharedPipesModule, SharedRoutingModule, SharedTestingModule, SharedTestsPage, SharedValidators, SocialModule, Software, StartableService, StatusById, StatusIds, StatusList, StrIncludesPipe, StrLengthPipe, SwipeTestPage, TableSelectColumnsComponent, TableTestPage, TableTestingModule, TextForm, TextPopover, TextPopoverTestingModule, TextPopoverTestingPage, ToStringPipe, Toasts, ToolbarComponent, ToolbarToken, TranslatablePipe, TranslateContextPipe, TranslateContextService, UploadFile, UploadFileComponent, UploadFilePopover, UploadFileTestingModule, UploadFileTestingPage, UserEvent, UserEventFilter, UserEventService, UserEventTypes, UserEventsTable, UserSettings, UsersPage, accountToString, adaptValueToControl, addValueInArray, arrayDistinct, arrayGroupBy, arraySize, asInputElement, canHaveFocus, capitalizeFirstLetter, chainPromises, changeCaseToUnderscore, clearValueInArray, copyEntity2Form, createPromiseEvent, createPromiseEventEmitter, departmentToString, departmentsToString, disableControls, emitPromiseEvent, entityToString, equals, equalsOrNil, fadeInAnimation, fadeInOutAnimation, filterFalse, filterNotNil, filterNumberInput, filterTrue, firstArrayValue, firstFalse, firstFalsePromise, firstNotNil, firstNotNilPromise, firstTrue, firstTruePromise, focusInput, focusNextInput, focusPreviousInput, formatLatitude, formatLongitude, fromDateISOString, fromScrollEndEvent, fromUnixMsTimestamp, fromUnixTimestamp, getCaretPosition, getColorContrast, getColorShade, getColorTint, getConnectionType, getControlFromPath, getFocusableInputElements, getFormErrors, getFormValueFromEntity, getProperty, getPropertyByPath, getPropertyByPathAsString, getRandomImage, hexToRgb, hexToRgbArray, isAndroid, isBlankString, isControlHasInput, isCordova, isEmptyArray, isIOS, isInputElement, isInstanceOf, isInt, isMobile, isNil, isNilOrBlank, isNilOrNaN, isNotEmptyArray, isNotNil, isNotNilBoolean, isNotNilOrBlank, isNotNilOrNaN, isNotNilString, isNumber, isNumberRange, isProgressEvent, isResponseEvent, isTouchUi, isWindows, joinProperties, joinPropertiesPath, logFormErrors, markAllAsTouched, markAsUntouched, markControlAsTouched, markFormGroupAsTouched, matchMedia, matchUpperCase, mergeLoadResult, mixHex, moveInputCaretToSeparator, noTrailingSlash, notNilOrDefault, nullIfUndefined, parseLatitudeOrLongitude, propertiesPathComparator, propertyComparator, propertyPathComparator, referentialToString, referentialsToString, remove, removeAll, removeDiacritics, removeDuplicatesFromArray, removeEnd, removeValueInArray, replaceAll, resetCalculatedValue, resizeArray, rgbArrayToHex, rgbToHex, round, scrollFactory, selectInputContent, selectInputRange, setCalculatedValue, setTabIndex, sleep, slideInOutAnimation, slideUpDownAnimation, sort, splitById, splitByProperty, startsWithUpperCase, suggestFromArray, suggestFromStringArray, tabindexComparator, testUserAgent, toBoolean, toDateISOString, toDuration, toFloat, toInt, toNotNil, toNumber, trimEmptyToNull, uncapitalizeFirstLetter, updateValueAndValidity, waitFor, waitForTrue, waitIdle, waitWhilePending, ɵ0$c as ɵ0, CustomReuseStrategy as ɵa, MatNumpadDomService as ɵb, isFocusableElement as ɵc, RegisterForm as ɵd, AccountValidatorService as ɵe, RegisterModal as ɵf, UserSettingsValidatorService as ɵg, LocalSettingsValidatorService as ɵh, AppIconComponent as ɵi, DateTestPage as ɵj, NumpadTestPage as ɵk, MatBadgeIconTestPage as ɵl, ToastTestingModule as ɵm, ToastTestingPage as ɵn };
+export { APP_ABOUT_DEVELOPERS, APP_ABOUT_PARTNERS, APP_CONFIG_OPTIONS, APP_FORM_ERROR_I18N_KEYS, APP_GRAPHQL_TYPE_POLICIES, APP_HOME_BUTTONS, APP_LOCALES, APP_LOCAL_SETTINGS, APP_LOCAL_SETTINGS_OPTIONS, APP_LOCAL_STORAGE_TYPE_POLICIES, APP_MENU_ITEMS, APP_TESTING_PAGES, AboutModal, Account, AccountPage, AccountService, AccountToStringPipe, ActionsColumnComponent, AdminModule, AdminRoutingModule, Alerts, AndroidOsEnvironment, AnimationState, AppEditor, AppEditorOptions, AppEntityEditor, AppForm, AppFormField, AppFormProvider, AppFormUtils, AppGestureConfig, AppGraphQLModule, AppHelpModal, AppInMemoryTable, AppInstallUpgradeCard, AppListForm, AppLoadingSpinner, AppMenuModule, AppNullForm, AppPropertiesForm, AppTabEditor, AppTabEditorOptions, AppTable, AppTableDataSourceOptions, AppTableUtils, AppValidatorService, AppendToInputDirective, ArrayFilterPipe, ArrayFirstPipe, ArrayIncludesPipe, ArrayLengthPipe, ArrayPluckPipe, AudioProvider, AuthForm, AuthGuardService, AuthModal, AutocompleteTestPage, AutofocusDirective, Base58, BaseEntityService, BaseGraphqlService, BaseGraphqlServiceOptions, BaseReferential, Beans, CORE_CONFIG_OPTIONS, CORE_TESTING_PAGES, CellValueChangeListener, ChipsTestPage, Color, ColorScale, ComponentDirtyGuard, ConfigService, Configuration, CoreModule, CoreTestingModule, CryptoService, DATE_ISO_PATTERN, DATE_UNIX_MS_TIMESTAMP, DATE_UNIX_TIMESTAMP, DEFAULT_PAGE_SIZE, DEFAULT_PAGE_SIZE_OPTIONS, DEFAULT_PLACEHOLDER_CHAR, DEFAULT_REQUIRED_COLUMNS, DateDiffDurationPipe, DateFormatPipe, DateFromNowPipe, DateTimeTestPage, DateUtils, Department, DepartmentToStringPipe, DragAndDropDirective, DurationPipe, ENTITIES_STORAGE_KEY_PREFIX, ENVIRONMENT, EmptyArrayPipe, EntitiesService, EntitiesStorage, EntitiesTableDataSource, Entity, EntityClass, EntityClasses, EntityFilter, EntityFilterUtils, EntityMetadataComponent, EntityStore, EntityUtils, Environment, EvenPipe, FileResponse, FileService, FileSizePipe, FilesUtils, FormArrayHelper, FormButtonsBarComponent, FormButtonsBarToken, FormErrorTranslatePipe, FormErrorTranslator, FormFieldValuesHolder, FormGetArrayPipe, FormGetControlPipe, FormGetGroupPipe, FormGetPipe, Fragments$1 as Fragments, GraphqlService, HAMMER_PRESS_TIME, HAMMER_TAP_TIME, HighlightPipe, HomePage, Hotkeys, HotkeysDialogComponent, InMemoryEntitiesService, IsLoginAccountPipe, IsNilOrBlankPipe, IsNotNilOrBlankPipe, IsNotOnFieldModePipe, IsOnFieldModePipe, JobUtils, KEYBOARD_HIDE_DELAY_MS, LAT_LONG_DEFAULT_MAX_DECIMALS, LAT_LONG_PATTERNS, LatLongFormatPipe, LatLongTestPage, LatitudeFormatPipe, LocalSettingsService, LongitudeFormatPipe, MINIFY_ENTITY_FOR_LOCAL_STORAGE, MINIFY_ENTITY_FOR_POD, MapGetPipe, MapKeysPipe, MapValuesPipe, MatAutocompleteConfigHolder, MatAutocompleteField, MatBadgeIconDirective, MatBooleanField, MatChipsField, MatDate, MatDateShort, MatDateTime, MatDuration, MatLatLongField, MatNumpadComponent, MatNumpadContainerComponent, MatNumpadContent, MatPaginatorI18n, MatStepperI18n, MatSwipeField, MaterialTestingModule, MathAbsPipe, MenuComponent, MenuItems, MenuService, Message, MessageFilter, MessageForm, MessageModal, MessageService, MessageTypeList, MessageTypes, ModalToolbarComponent, NetworkService, NgInitDirective, NgVarDirective, NotEmptyArrayPipe, NumberFormatPipe, NumpadDirective, OddPipe, PRIORITIZED_AUTHORITIES, PUBKEY_REGEXP, Peer, Person, PersonFilter, PersonFragments, PersonService, PersonToStringPipe, PersonUtils, PersonValidatorService, PlatformService, ProgressBarService, ProgressInterceptor, PropertyGetPipe, RESERVED_END_COLUMNS, RESERVED_START_COLUMNS, Referential, ReferentialFilter, ReferentialRef, ReferentialUtils, ReferentialValidatorService, RegisterConfirmPage, SETTINGS_DISPLAY_COLUMNS, SETTINGS_FILTER, SETTINGS_PAGE_SIZE, SETTINGS_SORTED_COLUMN, SETTINGS_STORAGE_KEY, SETTINGS_TRANSIENT_PROPERTIES, SHARED_MATERIAL_TESTING_PAGES, SHARED_TESTING_PAGES, SPACE_PLACEHOLDER_CHAR, SelectPeerModal, SettingsPage, SharedAsyncValidators, SharedDirectivesModule, SharedFormArrayValidators, SharedFormGroupValidators, SharedHotkeysModule, SharedMatAutocompleteModule, SharedMatBadgeIconModule, SharedMatBooleanModule, SharedMatChipsModule, SharedMatDateTimeModule, SharedMatDurationModule, SharedMatLatLongModule, SharedMatNumpadModule, SharedMatSwipeModule, SharedMaterialModule, SharedModule, SharedPipesModule, SharedRoutingModule, SharedTestingModule, SharedTestsPage, SharedValidators, SocialErrorCodes, SocialModule, Software, StartableService, StatusById, StatusIds, StatusList, StrIncludesPipe, StrLengthPipe, SwipeTestPage, TableSelectColumnsComponent, TableTestPage, TableTestingModule, TextForm, TextPopover, TextPopoverTestingModule, TextPopoverTestingPage, ToStringPipe, Toasts, ToolbarComponent, ToolbarToken, TranslatablePipe, TranslateContextPipe, TranslateContextService, UploadFile, UploadFileComponent, UploadFilePopover, UploadFileTestingModule, UploadFileTestingPage, UserEvent, UserEventFilter, UserEventFragments, UserEventService, UserEventTypes, UserEventsTable, UserSettings, UsersPage, accountToString, adaptValueToControl, addValueInArray, arrayDistinct, arrayGroupBy, arraySize, asInputElement, canHaveFocus, capitalizeFirstLetter, chainPromises, changeCaseToUnderscore, clearValueInArray, copyEntity2Form, createPromiseEvent, createPromiseEventEmitter, departmentToString, departmentsToString, disableControls, emitPromiseEvent, entityToString, equals, equalsOrNil, fadeInAnimation, fadeInOutAnimation, filterFalse, filterNotNil, filterNumberInput, filterTrue, firstArrayValue, firstFalse, firstFalsePromise, firstNotNil, firstNotNilPromise, firstTrue, firstTruePromise, focusInput, focusNextInput, focusPreviousInput, formatLatitude, formatLongitude, fromDateISOString, fromScrollEndEvent, fromUnixMsTimestamp, fromUnixTimestamp, getCaretPosition, getColorContrast, getColorShade, getColorTint, getConnectionType, getControlFromPath, getFocusableInputElements, getFormErrors, getFormValueFromEntity, getProperty, getPropertyByPath, getPropertyByPathAsString, getRandomImage, hexToRgb, hexToRgbArray, isAndroid, isBlankString, isControlHasInput, isCordova, isEmptyArray, isIOS, isInputElement, isInstanceOf, isInt, isMobile, isNil, isNilOrBlank, isNilOrNaN, isNotEmptyArray, isNotNil, isNotNilBoolean, isNotNilOrBlank, isNotNilOrNaN, isNotNilString, isNumber, isNumberRange, isProgressEvent, isResponseEvent, isTouchUi, isWindows, joinProperties, joinPropertiesPath, logFormErrors, markAllAsTouched, markAsUntouched, markControlAsTouched, markFormGroupAsTouched, matchMedia, matchUpperCase, mergeLoadResult, mixHex, moveInputCaretToSeparator, noTrailingSlash, notNilOrDefault, nullIfUndefined, parseLatitudeOrLongitude, propertiesPathComparator, propertyComparator, propertyPathComparator, referentialToString, referentialsToString, remove, removeAll, removeDiacritics, removeDuplicatesFromArray, removeEnd, removeValueInArray, replaceAll, resetCalculatedValue, resizeArray, rgbArrayToHex, rgbToHex, round, scrollFactory, selectInputContent, selectInputRange, setCalculatedValue, setTabIndex, sleep, slideInOutAnimation, slideUpDownAnimation, sort, splitById, splitByProperty, startsWithUpperCase, suggestFromArray, suggestFromStringArray, tabindexComparator, testUserAgent, toBoolean, toDateISOString, toDuration, toFloat, toInt, toNotNil, toNumber, trimEmptyToNull, uncapitalizeFirstLetter, updateValueAndValidity, waitFor, waitForTrue, waitIdle, waitWhilePending, ɵ0, CustomReuseStrategy as ɵa, MatNumpadDomService as ɵb, isFocusableElement as ɵc, RegisterForm as ɵd, AccountValidatorService as ɵe, RegisterModal as ɵf, UserSettingsValidatorService as ɵg, LocalSettingsValidatorService as ɵh, AppIconComponent as ɵi, DateTestPage as ɵj, NumpadTestPage as ɵk, MatBadgeIconTestPage as ɵl, ToastTestingModule as ɵm, ToastTestingPage as ɵn };
 //# sourceMappingURL=sumaris-net.ngx-components.js.map