npm - @sumaris-net/ngx-components - Versions diffs - 2.4.117 → 2.4.119 - Mend

@sumaris-net/ngx-components 2.4.117 → 2.4.119

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

Files changed (29) hide show

package/esm2020/src/app/core/settings/settings.page.mjs CHANGED Viewed

@@ -294,7 +294,7 @@ export class SettingsPage extends AppForm {
 SettingsPage.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SettingsPage, deps: [{ token: i0.Injector }, { token: i1.PlatformService }, { token: i2.NavController }, { token: i3.LocalSettingsValidatorService }, { token: i2.AlertController }, { token: i4.TranslateService }, { token: i5.UntypedFormBuilder }, { token: i6.AccountService }, { token: i7.LocalSettingsService }, { token: i0.ChangeDetectorRef }, { token: i8.NetworkService }, { token: APP_LOCALES }, { token: APP_SETTINGS_MENU_ITEMS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
 SettingsPage.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SettingsPage, selector: "page-settings", providers: [
         { provide: ValidatorService, useExisting: LocalSettingsValidatorService },
-    ], usesInheritance: true, ngImport: i0, template: "<app-toolbar [title]=\"'SETTINGS.TITLE'|translate\" color=\"primary\"\n             [hasValidate]=\"dirty && !saving\"\n             [hasClose]=\"!dirty && !saving\"\n             (onValidate)=\"save($event)\"\n             (onClose)=\"close($event)\">\n\n  <ion-buttons slot=\"end\">\n    <!-- options menu -->\n    <ion-button [matMenuTriggerFor]=\"optionsMenu\"\n                *ngIf=\"!saving\"\n                [disabled]=\"saving\">\n      <mat-icon slot=\"icon-only\">more_vert</mat-icon>\n    </ion-button>\n  </ion-buttons>\n</app-toolbar>\n\n<!-- Options menu -->\n<mat-menu #optionsMenu=\"matMenu\">\n  <!-- Clear cache -->\n  <button mat-menu-item (click)=\"clearCache($event)\">\n    <mat-icon><ion-icon name=\"trash-outline\"></ion-icon></mat-icon>\n    <ion-label translate>SETTINGS.BTN_CLEAR_CACHE</ion-label>\n  </button>\n\n  <!-- Reset -->\n  <button mat-menu-item\n          [disabled]=\"!dirty\"\n          (click)=\"cancel($event)\">\n    <mat-icon><ion-icon name=\"refresh\"></ion-icon></mat-icon>\n    <mat-label translate>COMMON.BTN_RESET</mat-label>\n  </button>\n\n  <!-- additional items -->\n  <ng-container *ngIf=\"!loading\">\n    <ng-container *ngFor=\"let item of menuItems\">\n      <a *ngIf=\"item.path\"\n         mat-menu-item\n         class=\"{{item.cssClass}} {{item.color}}\"\n         (click)=\"executeAction($event, item)\">\n        <mat-icon *ngIf=\"item.icon\"><ion-icon [name]=\"item.icon\"></ion-icon></mat-icon>\n        <mat-icon *ngIf=\"item.matIcon\">{{item.matIcon}}</mat-icon>\n        <mat-label translate>{{item.title}}</mat-label>\n      </a>\n      <!-- divider -->\n      <mat-divider *ngIf=\"!item.path && !item.action\"\n                   class=\"{{item.cssClass}} {{item.color}}\">\n        <mat-label translate>{{item.title}}</mat-label>\n      </mat-divider>\n    </ng-container>\n  </ng-container>\n</mat-menu>\n\n<ion-content>\n\n  <form [formGroup]=\"form\" novalidate (ngSubmit)=\"save($event)\" class=\"form-container\">\n\n    <ion-grid class=\"ion-no-padding\">\n      <ion-row class=\"ion-no-padding\">\n\n        <!-- left  margin -->\n        <ion-col size=\"0\" size-lg=\"2\">&nbsp;\n        </ion-col>\n\n        <ion-col class=\"ion-padding\">\n\n          <!-- error -->\n          <ion-item *ngIf=\"error\" 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          <p [innerHTML]=\"'SETTINGS.DESCRIPTION'|translate\"></p>\n\n          <!-- account inheritance (desktop) -->\n          <mat-form-field [hidden]=\"!isLogin\" *ngIf=\"!mobile; else accountInheritanceMobile\">\n            <input matInput hidden formControlName=\"accountInheritance\" type=\"text\">\n\n            <!-- check box (if desktop) -->\n            <mat-checkbox\n              *ngIf=\"!mobile; else accountInheritanceMobile\"\n              (change)=\"setAccountInheritance($event.checked)\"\n              [checked]=\"accountInheritance\">\n              <span translate>SETTINGS.INHERIT_FROM_ACCOUNT</span>\n            </mat-checkbox>\n\n            <mat-error *ngIf=\"form.controls.accountInheritance.hasError('required')\" translate>ERROR.FIELD_REQUIRED\n            </mat-error>\n          </mat-form-field>\n\n          <!-- account inheritance (if mobile) -->\n          <ng-template #accountInheritanceMobile>\n            <mat-form-field [hidden]=\"!isLogin\">\n              <input matInput hidden formControlName=\"accountInheritance\" type=\"text\">\n\n              <!-- slide toggle  -->\n              <ion-text translate>SETTINGS.INHERIT_FROM_ACCOUNT</ion-text>\n              <mat-slide-toggle matSuffix\n                                (change)=\"setAccountInheritance($event.checked)\"\n                                [checked]=\"accountInheritance\">\n\n              </mat-slide-toggle>\n              <mat-error *ngIf=\"form.controls.accountInheritance.hasError('required')\" translate>ERROR.FIELD_REQUIRED\n              </mat-error>\n            </mat-form-field>\n          </ng-template>\n\n          <!-- locale -->\n          <mat-form-field>\n            <mat-select [placeholder]=\"'SETTINGS.LOCALE'|translate\" formControlName=\"locale\" required>\n              <mat-option *ngFor=\"let item of locales\" [value]=\"item.key\">\n                {{item.value}}\n              </mat-option>\n            </mat-select>\n            <mat-error *ngIf=\"form.controls.locale.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n          </mat-form-field>\n\n          <!-- Network entry -->\n          <h3>\n            <ion-text translate>SETTINGS.NETWORK_DIVIDER</ion-text>\n          </h3>\n\n          <!-- Peer address -->\n          <mat-form-field>\n            <input matInput type=\"text\" [placeholder]=\"'SETTINGS.PEER_URL'|translate\"\n                   formControlName=\"peerUrl\"\n                   required>\n\n            <button mat-icon-button type=\"button\" matSuffix (click)=\"showSelectPeerModal()\" tabindex=\"-1\"\n                    [title]=\"'SETTINGS.BTN_CHANGE_PEER'|translate\">\n              <mat-icon>search</mat-icon>\n            </button>\n\n            <mat-error *ngIf=\"form.controls.peerUrl.hasError('required')\"\n                       translate>ERROR.FIELD_REQUIRED\n            </mat-error>\n            <mat-error *ngIf=\"form.controls.peerUrl.hasError('peerAlive')\"\n                       translate>SETTINGS.ERROR.PEER_NOT_REACHABLE\n            </mat-error>\n            <mat-error *ngIf=\"form.controls.peerUrl.hasError('peerNotCompatible')\"\n                       translate>SETTINGS.ERROR.PEER_NOT_COMPATIBLE\n            </mat-error>\n          </mat-form-field>\n\n          <!-- Offline mode (if mobile) -->\n          <mat-form-field *ngIf=\"mobile\">\n            <input matInput hidden formControlName=\"accountInheritance\" type=\"text\">\n\n            <!-- slide toggle  -->\n            <ion-text translate>SETTINGS.OFFLINE_MODE</ion-text>\n            <mat-slide-toggle matSuffix\n                              (change)=\"network.setForceOffline($event.checked)\"\n                              [checked]=\"network.offline\">\n\n            </mat-slide-toggle>\n          </mat-form-field>\n\n          <!-- Data entry -->\n          <h3>\n            <ion-text translate>SETTINGS.DATA_ENTRY_DIVIDER</ion-text>\n          </h3>\n\n          <!-- Usage mode -->\n          <mat-form-field>\n            <mat-select [placeholder]=\"'SETTINGS.USAGE_MODE'|translate\" formControlName=\"usageMode\"\n                        required>\n              <mat-option *ngFor=\"let item of usageModes\" [value]=\"item\">\n                {{'SETTINGS.USAGE_MODES.'+item|translate}}\n              </mat-option>\n            </mat-select>\n            <mat-error *ngIf=\"form.controls.usageMode.hasError('required')\"\n                       translate>ERROR.FIELD_REQUIRED\n            </mat-error>\n          </mat-form-field>\n\n          <!-- lat/long format-->\n          <mat-form-field>\n            <mat-select [placeholder]=\"'SETTINGS.LAT_LONG_FORMAT'|translate\" formControlName=\"latLongFormat\"\n                        required>\n              <mat-option *ngFor=\"let item of latLongFormats\" [value]=\"item\">\n                {{'COMMON.LAT_LONG.'+item+'_PLACEHOLDER'|translate}}\n              </mat-option>\n            </mat-select>\n            <mat-error\n              *ngIf=\"form.controls.latLongFormat.hasError('required')\"\n              translate>ERROR.FIELD_REQUIRED\n            </mat-error>\n          </mat-form-field>\n\n          <!-- fields options -->\n          <ion-grid formArrayName=\"properties\" class=\"ion-no-padding\">\n            <ion-row class=\"ion-no-padding\">\n              <ion-col class=\"ion-no-padding ion-align-self-end\" size=\"12\">\n                <span class=\"toolbar-spacer\"></span>\n\n                <!-- Show more options -->\n                <ion-button color=\"light\" *ngIf=\"propertiesForm?.length === 0\"\n                            [title]=\"'SETTINGS.BTN_SHOW_MORE_HELP'|translate\"\n                            (click)=\"propertiesFormHelper.add()\">\n                  <ion-label translate>COMMON.BTN_SHOW_MORE</ion-label>\n                  <mat-icon slot=\"end\">arrow_drop_down</mat-icon>\n                </ion-button>\n              </ion-col>\n            </ion-row>\n\n            <!-- Fields options -->\n            <ng-container *ngFor=\"let propertyForm of propertiesForm?.controls; let i=index\">\n              <ion-row class=\"ion-no-padding\" [formGroupName]=\"i\">\n\n                <!-- property key -->\n                <ion-col class=\"ion-no-padding\">\n                  <mat-form-field>\n                    <mat-select formControlName=\"key\"\n                                [placeholder]=\" 'SETTINGS.PROPERTY_KEY'|translate\">\n                      <mat-option *ngFor=\"let item of propertyDefinitions\" [value]=\"item.key\">{{ item.label | translate }}\n                      </mat-option>\n                    </mat-select>\n                  </mat-form-field>\n                </ion-col>\n\n                <!-- property value -->\n                <ion-col class=\"ion-no-padding\" padding-left>\n                  <app-form-field *ngIf=\"getPropertyDefinition(i); let definition\"\n                                  floatLabel=\"never\"\n                                  [definition]=\"definition\"\n                                  [formControl]=\"propertyForm|formGetControl:'value'\"\n                                  [placeholder]=\"'SETTINGS.PROPERTY_VALUE' | translate\"\n                                  [required]=\"true\">\n                  </app-form-field>\n                </ion-col>\n                <ion-col size=\"2\" class=\"ion-no-padding\">\n                  <button type=\"button\" mat-icon-button color=\"light\"\n                          [disabled]=\"loading\"\n                          [title]=\"'COMMON.BTN_DELETE'|translate\"\n                          (click)=\"removePropertyAt(i)\">\n                    <mat-icon>close</mat-icon>\n                  </button>\n                  <button *ngIf=\"propertiesFormHelper.isLast(i)\"\n                          type=\"button\"\n                          mat-icon-button\n                          color=\"light\"\n                          [disabled]=\"loading\"\n                           [title]=\"'SETTINGS.BTN_ADD_PROPERTY'|translate\"\n                          (click)=\"propertiesFormHelper.add()\">\n                    <mat-icon>add</mat-icon>\n                  </button>\n                </ion-col>\n              </ion-row>\n            </ng-container>\n          </ion-grid>\n        </ion-col>\n\n        <!-- right margin -->\n        <ion-col size=\"0\" size-lg=\"2\">&nbsp;\n        </ion-col>\n      </ion-row>\n    </ion-grid>\n\n\n  </form>\n</ion-content>\n\n<ion-footer hidden-xs hidden-sm hidden-mobile>\n  <app-form-buttons-bar (onCancel)=\"cancel()\" (onSave)=\"save($event)\" [disabled]=\"!form.dirty || saving\"></app-form-buttons-bar>\n</ion-footer>\n", dependencies: [{ kind: "directive", type: i9.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i2.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i2.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i2.IonFooter, selector: "ion-footer", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i2.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { kind: "component", type: i2.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2.IonRow, selector: "ion-row" }, { kind: "component", type: i2.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i4.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i5.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i5.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: i10.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i10.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i10.MatLabel, selector: "mat-label" }, { kind: "directive", type: i10.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i11.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i12.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i13.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i14.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i15.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i15.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i15.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i16.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i17.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i18.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i19.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "component", type: i20.ToolbarComponent, selector: "app-toolbar", inputs: ["progressBarMode", "title", "color", "class", "backHref", "defaultBackHref", "hasValidate", "hasClose", "hasSearch", "canGoBack", "canShowMenu"], outputs: ["onValidate", "onClose", "onValidateAndClose", "onBackClick", "onSearch"] }, { kind: "component", type: i21.AppFormField, selector: "app-form-field", inputs: ["definition", "required", "readonly", "disabled", "formControl", "formControlName", "placeholder", "compact", "floatLabel", "tabindex", "autofocus", "clearable", "chipColor", "debug", "class"], outputs: ["keyup.enter"] }, { kind: "component", type: i22.FormButtonsBarComponent, selector: "app-form-buttons-bar", inputs: ["disabled", "disabledCancel", "classList"], outputs: ["onCancel", "onSave", "onNext", "onBack"] }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }, { kind: "pipe", type: i23.FormGetControlPipe, name: "formGetControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    ], usesInheritance: true, ngImport: i0, template: "<app-toolbar [title]=\"'SETTINGS.TITLE'|translate\" color=\"primary\"\n             [hasValidate]=\"dirty && !saving\"\n             [hasClose]=\"!dirty && !saving\"\n             (onValidate)=\"save($event)\"\n             (onClose)=\"close($event)\">\n\n  <ion-buttons slot=\"end\">\n    <!-- options menu -->\n    <ion-button [matMenuTriggerFor]=\"optionsMenu\"\n                *ngIf=\"!saving\"\n                [disabled]=\"saving\">\n      <mat-icon slot=\"icon-only\">more_vert</mat-icon>\n    </ion-button>\n  </ion-buttons>\n</app-toolbar>\n\n<!-- Options menu -->\n<mat-menu #optionsMenu=\"matMenu\">\n  <!-- Clear cache -->\n  <button mat-menu-item (click)=\"clearCache($event)\">\n    <mat-icon><ion-icon name=\"trash-outline\"></ion-icon></mat-icon>\n    <ion-label translate>SETTINGS.BTN_CLEAR_CACHE</ion-label>\n  </button>\n\n  <!-- Reset -->\n  <button mat-menu-item\n          [disabled]=\"!dirty\"\n          (click)=\"cancel($event)\">\n    <mat-icon><ion-icon name=\"refresh\"></ion-icon></mat-icon>\n    <mat-label translate>COMMON.BTN_RESET</mat-label>\n  </button>\n\n  <!-- additional items -->\n  <ng-container *ngIf=\"!loading\">\n    <ng-container *ngFor=\"let item of menuItems\">\n      <a *ngIf=\"item.path\"\n         mat-menu-item\n         class=\"{{item.cssClass}} {{item.color}}\"\n         (click)=\"executeAction($event, item)\">\n        <mat-icon *ngIf=\"item.icon\"><ion-icon [name]=\"item.icon\"></ion-icon></mat-icon>\n        <mat-icon *ngIf=\"item.matIcon\">{{item.matIcon}}</mat-icon>\n        <mat-label translate>{{item.title}}</mat-label>\n      </a>\n      <!-- divider -->\n      <mat-divider *ngIf=\"!item.path && !item.action\"\n                   class=\"{{item.cssClass}} {{item.color}}\">\n        <mat-label translate>{{item.title}}</mat-label>\n      </mat-divider>\n    </ng-container>\n  </ng-container>\n</mat-menu>\n\n<ion-content>\n\n  <form [formGroup]=\"form\" novalidate (ngSubmit)=\"save($event)\" class=\"form-container\">\n\n    <ion-grid class=\"ion-no-padding\">\n      <ion-row class=\"ion-no-padding\">\n\n        <!-- left  margin -->\n        <ion-col size=\"0\" size-lg=\"2\">&nbsp;\n        </ion-col>\n\n        <ion-col class=\"ion-padding\">\n\n          <!-- error -->\n          <ion-item *ngIf=\"error\" 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          <p [innerHTML]=\"'SETTINGS.DESCRIPTION'|translate\"></p>\n\n          <!-- account inheritance (desktop) -->\n          <mat-form-field [hidden]=\"!isLogin\" *ngIf=\"!mobile; else accountInheritanceMobile\">\n            <input matInput hidden formControlName=\"accountInheritance\" type=\"text\">\n\n            <!-- check box (if desktop) -->\n            <mat-checkbox\n              *ngIf=\"!mobile; else accountInheritanceMobile\"\n              (change)=\"setAccountInheritance($event.checked)\"\n              [checked]=\"accountInheritance\">\n              <span translate>SETTINGS.INHERIT_FROM_ACCOUNT</span>\n            </mat-checkbox>\n\n            <mat-error *ngIf=\"form.controls.accountInheritance.hasError('required')\" translate>ERROR.FIELD_REQUIRED\n            </mat-error>\n          </mat-form-field>\n\n          <!-- account inheritance (if mobile) -->\n          <ng-template #accountInheritanceMobile>\n            <mat-form-field [hidden]=\"!isLogin\">\n              <input matInput hidden formControlName=\"accountInheritance\" type=\"text\">\n\n              <!-- slide toggle  -->\n              <ion-text translate>SETTINGS.INHERIT_FROM_ACCOUNT</ion-text>\n              <mat-slide-toggle matSuffix\n                                (change)=\"setAccountInheritance($event.checked)\"\n                                [checked]=\"accountInheritance\">\n\n              </mat-slide-toggle>\n              <mat-error *ngIf=\"form.controls.accountInheritance.hasError('required')\" translate>ERROR.FIELD_REQUIRED\n              </mat-error>\n            </mat-form-field>\n          </ng-template>\n\n          <!-- locale -->\n          <mat-form-field>\n            <mat-select [placeholder]=\"'SETTINGS.LOCALE'|translate\" formControlName=\"locale\" required>\n              <mat-option *ngFor=\"let item of locales\" [value]=\"item.key\">\n                {{item.value}}\n              </mat-option>\n            </mat-select>\n            <mat-error *ngIf=\"form.controls.locale.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n          </mat-form-field>\n\n          <!-- Network entry -->\n          <h3>\n            <ion-text translate>SETTINGS.NETWORK_DIVIDER</ion-text>\n          </h3>\n\n          <!-- Peer address -->\n          <mat-form-field>\n            <input matInput type=\"text\" [placeholder]=\"'SETTINGS.PEER_URL'|translate\"\n                   formControlName=\"peerUrl\"\n                   required>\n\n            <button mat-icon-button type=\"button\" matSuffix (click)=\"showSelectPeerModal()\" tabindex=\"-1\"\n                    [title]=\"'SETTINGS.BTN_CHANGE_PEER'|translate\">\n              <mat-icon>search</mat-icon>\n            </button>\n\n            <mat-error *ngIf=\"form.controls.peerUrl.hasError('required')\"\n                       translate>ERROR.FIELD_REQUIRED\n            </mat-error>\n            <mat-error *ngIf=\"form.controls.peerUrl.hasError('peerAlive')\"\n                       translate>SETTINGS.ERROR.PEER_NOT_REACHABLE\n            </mat-error>\n            <mat-error *ngIf=\"form.controls.peerUrl.hasError('peerNotCompatible')\"\n                       translate>SETTINGS.ERROR.PEER_NOT_COMPATIBLE\n            </mat-error>\n          </mat-form-field>\n\n          <!-- Offline mode (if mobile) -->\n          <mat-form-field *ngIf=\"mobile\">\n            <input matInput hidden formControlName=\"accountInheritance\" type=\"text\">\n\n            <!-- slide toggle  -->\n            <ion-text translate>SETTINGS.OFFLINE_MODE</ion-text>\n            <mat-slide-toggle matSuffix\n                              (change)=\"network.setForceOffline($event.checked)\"\n                              [checked]=\"network.offline\">\n\n            </mat-slide-toggle>\n          </mat-form-field>\n\n          <!-- Data entry -->\n          <h3>\n            <ion-text translate>SETTINGS.DATA_ENTRY_DIVIDER</ion-text>\n          </h3>\n\n          <!-- Usage mode -->\n          <mat-form-field>\n            <mat-select [placeholder]=\"'SETTINGS.USAGE_MODE'|translate\" formControlName=\"usageMode\"\n                        required>\n              <mat-option *ngFor=\"let item of usageModes\" [value]=\"item\">\n                {{'SETTINGS.USAGE_MODES.'+item|translate}}\n              </mat-option>\n            </mat-select>\n            <mat-error *ngIf=\"form.controls.usageMode.hasError('required')\"\n                       translate>ERROR.FIELD_REQUIRED\n            </mat-error>\n          </mat-form-field>\n\n          <!-- lat/long format-->\n          <mat-form-field>\n            <mat-select [placeholder]=\"'SETTINGS.LAT_LONG_FORMAT'|translate\" formControlName=\"latLongFormat\"\n                        required>\n              <mat-option *ngFor=\"let item of latLongFormats\" [value]=\"item\">\n                {{'COMMON.LAT_LONG.'+item+'_PLACEHOLDER'|translate}}\n              </mat-option>\n            </mat-select>\n            <mat-error\n              *ngIf=\"form.controls.latLongFormat.hasError('required')\"\n              translate>ERROR.FIELD_REQUIRED\n            </mat-error>\n          </mat-form-field>\n\n          <!-- fields options -->\n          <ion-grid formArrayName=\"properties\" class=\"ion-no-padding\">\n            <ion-row class=\"ion-no-padding\">\n              <ion-col class=\"ion-no-padding ion-align-self-end\" size=\"12\">\n                <span class=\"toolbar-spacer\"></span>\n\n                <!-- Show more options -->\n                <ion-button color=\"light\" *ngIf=\"propertiesForm?.length === 0\"\n                            [title]=\"'SETTINGS.BTN_SHOW_MORE_HELP'|translate\"\n                            (click)=\"propertiesFormHelper.add()\">\n                  <ion-label translate>COMMON.BTN_SHOW_MORE</ion-label>\n                  <mat-icon slot=\"end\">arrow_drop_down</mat-icon>\n                </ion-button>\n              </ion-col>\n            </ion-row>\n\n            <!-- Fields options -->\n            <ng-container *ngFor=\"let propertyForm of propertiesForm?.controls; let i=index\">\n              <ion-row class=\"ion-no-padding\" [formGroupName]=\"i\">\n\n                <!-- property key -->\n                <ion-col class=\"ion-no-padding\">\n                  <mat-form-field>\n                    <mat-select formControlName=\"key\"\n                                [placeholder]=\" 'SETTINGS.PROPERTY_KEY'|translate\">\n                      <mat-option *ngFor=\"let item of propertyDefinitions\" [value]=\"item.key\">{{ item.label | translate }}\n                      </mat-option>\n                    </mat-select>\n                  </mat-form-field>\n                </ion-col>\n\n                <!-- property value -->\n                <ion-col class=\"ion-no-padding\" padding-left>\n                  <app-form-field *ngIf=\"getPropertyDefinition(i); let definition\"\n                                  floatLabel=\"never\"\n                                  [definition]=\"definition\"\n                                  [formControl]=\"propertyForm|formGetControl:'value'\"\n                                  [placeholder]=\"'SETTINGS.PROPERTY_VALUE' | translate\"\n                                  [required]=\"true\">\n                  </app-form-field>\n                </ion-col>\n                <ion-col size=\"2\" class=\"ion-no-padding\">\n                  <button type=\"button\" mat-icon-button color=\"light\"\n                          [disabled]=\"loading\"\n                          [title]=\"'COMMON.BTN_DELETE'|translate\"\n                          (click)=\"removePropertyAt(i)\">\n                    <mat-icon>close</mat-icon>\n                  </button>\n                  <button *ngIf=\"propertiesFormHelper.isLast(i)\"\n                          type=\"button\"\n                          mat-icon-button\n                          color=\"light\"\n                          [disabled]=\"loading\"\n                           [title]=\"'SETTINGS.BTN_ADD_PROPERTY'|translate\"\n                          (click)=\"propertiesFormHelper.add()\">\n                    <mat-icon>add</mat-icon>\n                  </button>\n                </ion-col>\n              </ion-row>\n            </ng-container>\n          </ion-grid>\n        </ion-col>\n\n        <!-- right margin -->\n        <ion-col size=\"0\" size-lg=\"2\">&nbsp;\n        </ion-col>\n      </ion-row>\n    </ion-grid>\n\n\n  </form>\n</ion-content>\n\n<ion-footer hidden-xs hidden-sm hidden-mobile>\n  <app-form-buttons-bar (onCancel)=\"cancel()\" (onSave)=\"save($event)\" [disabled]=\"!form.dirty || saving\"></app-form-buttons-bar>\n</ion-footer>\n", dependencies: [{ kind: "directive", type: i9.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i2.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i2.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i2.IonFooter, selector: "ion-footer", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i2.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { kind: "component", type: i2.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2.IonRow, selector: "ion-row" }, { kind: "component", type: i2.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i4.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i5.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i5.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: i10.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i10.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i10.MatLabel, selector: "mat-label" }, { kind: "directive", type: i10.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i11.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i12.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i13.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i14.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i15.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i15.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i15.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i16.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i17.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i18.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i19.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "component", type: i20.ToolbarComponent, selector: "app-toolbar", inputs: ["progressBarMode", "title", "color", "class", "backHref", "defaultBackHref", "hasValidate", "hasClose", "hasSearch", "canGoBack", "canShowMenu"], outputs: ["onValidate", "onClose", "onValidateAndClose", "onBackClick", "onSearch"] }, { kind: "component", type: i21.AppFormField, selector: "app-form-field", inputs: ["definition", "required", "readonly", "disabled", "formControl", "formControlName", "placeholder", "compact", "floatLabel", "tabindex", "autofocus", "clearable", "chipColor", "debug", "class"], outputs: ["keyup.enter"] }, { kind: "component", type: i22.FormButtonsBarComponent, selector: "app-form-buttons-bar", inputs: ["disabled", "disabledCancel", "classList", "saveButtonColor", "backText", "cancelText", "nextText", "showBack", "showCancel", "showNext", "showSave", "showSaveAndClose", "showSaveAndNext"], outputs: ["onCancel", "onSave", "onNext", "onBack", "onSaveAndClose", "onSaveAndNext"] }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }, { kind: "pipe", type: i23.FormGetControlPipe, name: "formGetControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SettingsPage, decorators: [{
             type: Component,
             args: [{ selector: 'page-settings', providers: [