@sumaris-net/ngx-components 18.23.58 → 18.23.59

package/esm2022/src/app/core/form/buttons/form-buttons-bar.component.mjs

@@ -65,10 +65,10 @@ export class FormButtonsBarComponent {
         this.onSaveAndNext.complete();
         this.onSaveAndClose.complete();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FormButtonsBarComponent, deps: [{ token: i1.Hotkeys }, { token: i2.MenuService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FormButtonsBarComponent, selector: "app-form-buttons-bar", inputs: { disabled: "disabled", disabledCancel: "disabledCancel", disabledEscape: "disabledEscape", classList: "classList", saveButtonColor: "saveButtonColor", backText: "backText", cancelText: "cancelText", nextText: "nextText", showBack: "showBack", showCancel: "showCancel", showNext: "showNext", showSave: "showSave" }, outputs: { onCancel: "onCancel", onSave: "onSave", onNext: "onNext", onBack: "onBack", onSaveAndClose: "onSaveAndClose", onSaveAndNext: "onSaveAndNext" }, providers: [{ provide: FormButtonsBarToken, useExisting: FormButtonsBarComponent }], ngImport: i0, template: "<ion-toolbar [class]=\"classList\">\n  <ion-row class=\"ion-no-padding\" nowrap>\n    <!-- show menu button -->\n    <ion-col size=\"auto\" class=\"hidden-xs hidden-sm\">\n      <ion-menu-toggle>\n        <button\n          mat-icon-button\n          color=\"accent\"\n          [title]=\"!showTooltip ? ('COMMON.BTN_SHOW_MENU' | translate) : ''\"\n          [matTooltip]=\"showTooltip ? ('COMMON.BTN_SHOW_MENU' | translate) : ''\"\n          (click)=\"menu.toggleSplitPaneWhen()\"\n        >\n          <mat-icon><span>&#xbb;</span></mat-icon>\n        </button>\n      </ion-menu-toggle>\n    </ion-col>\n\n    <ion-col class=\"app-form-buttons-bar-content\">\n      <ng-content></ng-content>\n    </ion-col>\n\n    <ion-col size=\"auto\" class=\"app-form-buttons-bar-buttons\">\n      <ng-content select=\"[slot=end]\"></ng-content>\n\n      <!-- back -->\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        (click)=\"onBack.emit($event)\"\n        (keyup.enter)=\"onBack.emit($event)\"\n        *ngIf=\"showBack && onBack.observed\"\n        class=\"back\"\n      >\n        <ion-label>{{ backText | translate }}</ion-label>\n      </ion-button>\n\n      <!-- cancel -->\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        *ngIf=\"showCancel\"\n        (click)=\"onCancel.emit($event)\"\n        (keyup.enter)=\"onCancel.emit($event)\"\n        [disabled]=\"disabledCancel\"\n        class=\"cancel\"\n      >\n        <ion-icon slot=\"start\" name=\"refresh\"></ion-icon>\n        <ion-label>{{ cancelText | translate }}</ion-label>\n      </ion-button>\n\n      <!-- next -->\n      <ion-button\n        fill=\"solid\"\n        *ngIf=\"showNext && onNext.observed\"\n        (click)=\"onNext.emit($event)\"\n        (keyup.enter)=\"onNext.emit($event)\"\n        class=\"next\"\n      >\n        <ion-label>{{ nextText | translate }}</ion-label>\n        <ion-icon slot=\"end\" name=\"arrow-forward\"></ion-icon>\n      </ion-button>\n\n      <!-- save -->\n      @if (showSave && onSave.observed) {\n        <ion-button\n          [fill]=\"disabled ? 'clear' : 'solid'\"\n          (click)=\"onSave.emit($event)\"\n          (keyup.enter)=\"onSave.emit($event)\"\n          [color]=\"saveButtonColor\"\n          [disabled]=\"disabled\"\n          [title]=\"!showTooltip ? ('COMMON.BTN_SAVE_WITH_SHORTCUT_HELP' | translate) : ''\"\n          [matTooltip]=\"showTooltip ? ('COMMON.BTN_SAVE_WITH_SHORTCUT_HELP' | translate) : ''\"\n          class=\"save\"\n        >\n          <ion-label>\n            <span [innerHTML]=\"'COMMON.BTN_SAVE_WITH_SHORTCUT' | translate\"></span>\n          </ion-label>\n        </ion-button>\n      }\n\n      <ng-content select=\"[slot=afterSave]\"></ng-content>\n    </ion-col>\n  </ion-row>\n</ion-toolbar>\n", styles: [":host{width:100%}:host ion-toolbar{height:var(--app-form-buttons-bar-height);padding:0 6px}:host ion-col{padding:0}:host ion-col:has(ion-button){align-content:center}:host ion-col ion-button{margin-top:0;margin-bottom:0}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.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: i4.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: i4.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i4.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i4.IonMenuToggle, selector: "ion-menu-toggle", inputs: ["autoHide", "menu"] }, { kind: "component", type: i4.IonRow, selector: "ion-row" }, { kind: "component", type: i4.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i8.TranslatePipe, name: "translate" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormButtonsBarComponent, deps: [{ token: i1.Hotkeys }, { token: i2.MenuService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FormButtonsBarComponent, selector: "app-form-buttons-bar", inputs: { disabled: "disabled", disabledCancel: "disabledCancel", disabledEscape: "disabledEscape", classList: "classList", saveButtonColor: "saveButtonColor", backText: "backText", cancelText: "cancelText", nextText: "nextText", showBack: "showBack", showCancel: "showCancel", showNext: "showNext", showSave: "showSave" }, outputs: { onCancel: "onCancel", onSave: "onSave", onNext: "onNext", onBack: "onBack", onSaveAndClose: "onSaveAndClose", onSaveAndNext: "onSaveAndNext" }, providers: [{ provide: FormButtonsBarToken, useExisting: FormButtonsBarComponent }], ngImport: i0, template: "<ion-toolbar [class]=\"classList\">\n  <ion-row class=\"ion-no-padding\" nowrap>\n    <!-- show menu button -->\n    <ion-col size=\"auto\" class=\"hidden-xs hidden-sm\">\n      <ion-menu-toggle>\n        <button\n          mat-icon-button\n          color=\"accent\"\n          [title]=\"!showTooltip ? ('COMMON.BTN_SHOW_MENU' | translate) : ''\"\n          [matTooltip]=\"showTooltip ? ('COMMON.BTN_SHOW_MENU' | translate) : ''\"\n          (click)=\"menu.toggleSplitPaneWhen()\"\n        >\n          <mat-icon><span>&#xbb;</span></mat-icon>\n        </button>\n      </ion-menu-toggle>\n    </ion-col>\n\n    <ion-col class=\"app-form-buttons-bar-content\">\n      <ng-content></ng-content>\n    </ion-col>\n\n    <ion-col size=\"auto\" class=\"app-form-buttons-bar-buttons\">\n      <ng-content select=\"[slot=end]\"></ng-content>\n\n      <!-- back -->\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        (click)=\"onBack.emit($event)\"\n        (keyup.enter)=\"onBack.emit($event)\"\n        *ngIf=\"showBack && onBack.observed\"\n        class=\"back\"\n      >\n        <ion-label>{{ backText | translate }}</ion-label>\n      </ion-button>\n\n      <!-- cancel -->\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        *ngIf=\"showCancel\"\n        (click)=\"onCancel.emit($event)\"\n        (keyup.enter)=\"onCancel.emit($event)\"\n        [disabled]=\"disabledCancel\"\n        class=\"cancel\"\n      >\n        <ion-icon slot=\"start\" name=\"refresh\"></ion-icon>\n        <ion-label>{{ cancelText | translate }}</ion-label>\n      </ion-button>\n\n      <!-- next -->\n      <ion-button\n        fill=\"solid\"\n        *ngIf=\"showNext && onNext.observed\"\n        (click)=\"onNext.emit($event)\"\n        (keyup.enter)=\"onNext.emit($event)\"\n        class=\"next\"\n      >\n        <ion-label>{{ nextText | translate }}</ion-label>\n        <ion-icon slot=\"end\" name=\"arrow-forward\"></ion-icon>\n      </ion-button>\n\n      <!-- save -->\n      @if (showSave && onSave.observed) {\n        <ion-button\n          [fill]=\"disabled ? 'clear' : 'solid'\"\n          (click)=\"onSave.emit($event)\"\n          (keyup.enter)=\"onSave.emit($event)\"\n          [color]=\"saveButtonColor\"\n          [disabled]=\"disabled\"\n          [title]=\"!showTooltip ? ('COMMON.BTN_SAVE_WITH_SHORTCUT_HELP' | translate) : ''\"\n          [matTooltip]=\"showTooltip ? ('COMMON.BTN_SAVE_WITH_SHORTCUT_HELP' | translate) : ''\"\n          class=\"save\"\n        >\n          <ion-label>\n            <span [innerHTML]=\"'COMMON.BTN_SAVE_WITH_SHORTCUT' | translate\"></span>\n          </ion-label>\n        </ion-button>\n      }\n\n      <ng-content select=\"[slot=afterSave]\"></ng-content>\n    </ion-col>\n  </ion-row>\n</ion-toolbar>\n", styles: [":host{width:100%}:host ion-toolbar{height:var(--app-form-buttons-bar-height);padding:0 6px}:host ion-col{padding:0}:host ion-col:has(ion-button){align-content:center}:host ion-col ion-button{margin-top:0;margin-bottom:0}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.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: i4.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: i4.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i4.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i4.IonMenuToggle, selector: "ion-menu-toggle", inputs: ["autoHide", "menu"] }, { kind: "component", type: i4.IonRow, selector: "ion-row" }, { kind: "component", type: i4.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i8.TranslatePipe, name: "translate" }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FormButtonsBarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormButtonsBarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-form-buttons-bar', providers: [{ provide: FormButtonsBarToken, useExisting: FormButtonsBarComponent }], template: "<ion-toolbar [class]=\"classList\">\n  <ion-row class=\"ion-no-padding\" nowrap>\n    <!-- show menu button -->\n    <ion-col size=\"auto\" class=\"hidden-xs hidden-sm\">\n      <ion-menu-toggle>\n        <button\n          mat-icon-button\n          color=\"accent\"\n          [title]=\"!showTooltip ? ('COMMON.BTN_SHOW_MENU' | translate) : ''\"\n          [matTooltip]=\"showTooltip ? ('COMMON.BTN_SHOW_MENU' | translate) : ''\"\n          (click)=\"menu.toggleSplitPaneWhen()\"\n        >\n          <mat-icon><span>&#xbb;</span></mat-icon>\n        </button>\n      </ion-menu-toggle>\n    </ion-col>\n\n    <ion-col class=\"app-form-buttons-bar-content\">\n      <ng-content></ng-content>\n    </ion-col>\n\n    <ion-col size=\"auto\" class=\"app-form-buttons-bar-buttons\">\n      <ng-content select=\"[slot=end]\"></ng-content>\n\n      <!-- back -->\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        (click)=\"onBack.emit($event)\"\n        (keyup.enter)=\"onBack.emit($event)\"\n        *ngIf=\"showBack && onBack.observed\"\n        class=\"back\"\n      >\n        <ion-label>{{ backText | translate }}</ion-label>\n      </ion-button>\n\n      <!-- cancel -->\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        *ngIf=\"showCancel\"\n        (click)=\"onCancel.emit($event)\"\n        (keyup.enter)=\"onCancel.emit($event)\"\n        [disabled]=\"disabledCancel\"\n        class=\"cancel\"\n      >\n        <ion-icon slot=\"start\" name=\"refresh\"></ion-icon>\n        <ion-label>{{ cancelText | translate }}</ion-label>\n      </ion-button>\n\n      <!-- next -->\n      <ion-button\n        fill=\"solid\"\n        *ngIf=\"showNext && onNext.observed\"\n        (click)=\"onNext.emit($event)\"\n        (keyup.enter)=\"onNext.emit($event)\"\n        class=\"next\"\n      >\n        <ion-label>{{ nextText | translate }}</ion-label>\n        <ion-icon slot=\"end\" name=\"arrow-forward\"></ion-icon>\n      </ion-button>\n\n      <!-- save -->\n      @if (showSave && onSave.observed) {\n        <ion-button\n          [fill]=\"disabled ? 'clear' : 'solid'\"\n          (click)=\"onSave.emit($event)\"\n          (keyup.enter)=\"onSave.emit($event)\"\n          [color]=\"saveButtonColor\"\n          [disabled]=\"disabled\"\n          [title]=\"!showTooltip ? ('COMMON.BTN_SAVE_WITH_SHORTCUT_HELP' | translate) : ''\"\n          [matTooltip]=\"showTooltip ? ('COMMON.BTN_SAVE_WITH_SHORTCUT_HELP' | translate) : ''\"\n          class=\"save\"\n        >\n          <ion-label>\n            <span [innerHTML]=\"'COMMON.BTN_SAVE_WITH_SHORTCUT' | translate\"></span>\n          </ion-label>\n        </ion-button>\n      }\n\n      <ng-content select=\"[slot=afterSave]\"></ng-content>\n    </ion-col>\n  </ion-row>\n</ion-toolbar>\n", styles: [":host{width:100%}:host ion-toolbar{height:var(--app-form-buttons-bar-height);padding:0 6px}:host ion-col{padding:0}:host ion-col:has(ion-button){align-content:center}:host ion-col ion-button{margin-top:0;margin-bottom:0}\n"] }]
         }], ctorParameters: () => [{ type: i1.Hotkeys }, { type: i2.MenuService }], propDecorators: { disabled: [{

package/esm2022/src/app/core/form/buttons/form-buttons-bar.module.mjs

@@ -5,15 +5,15 @@ import { TranslateModule } from '@ngx-translate/core';
 import * as i0 from "@angular/core";
 import * as i1 from "@ngx-translate/core";
 export class AppFormButtonsBarModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppFormButtonsBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: AppFormButtonsBarModule, declarations: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppFormButtonsBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: AppFormButtonsBarModule, declarations: [
             // Components
             FormButtonsBarComponent], imports: [SharedModule, i1.TranslateModule], exports: [TranslateModule,
             // Components
             FormButtonsBarComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppFormButtonsBarModule, imports: [SharedModule, TranslateModule.forChild(), TranslateModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppFormButtonsBarModule, imports: [SharedModule, TranslateModule.forChild(), TranslateModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppFormButtonsBarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppFormButtonsBarModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [SharedModule, TranslateModule.forChild()],

package/esm2022/src/app/core/form/entity/editor.class.mjs

@@ -248,10 +248,10 @@ export class AppEditor extends AppFormContainer {
             throw new Error("Missing toastController in component's constructor");
         await Toasts.show(this.toastController, this.translate, opts);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppEditor, deps: [{ token: i1.ActivatedRoute, optional: true }, { token: i1.Router }, { token: i2.NavController }, { token: i2.AlertController }, { token: i3.TranslateService }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: AppEditor, viewQueries: [{ propertyName: "toolbar", first: true, predicate: ToolbarToken, descendants: true }, { propertyName: "formButtonsBar", first: true, predicate: FormButtonsBarToken, descendants: true, static: true }, { propertyName: "content", first: true, predicate: IonContent, descendants: true, static: true }], usesInheritance: true, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppEditor, deps: [{ token: i1.ActivatedRoute, optional: true }, { token: i1.Router }, { token: i2.NavController }, { token: i2.AlertController }, { token: i3.TranslateService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: AppEditor, viewQueries: [{ propertyName: "toolbar", first: true, predicate: ToolbarToken, descendants: true }, { propertyName: "formButtonsBar", first: true, predicate: FormButtonsBarToken, descendants: true, static: true }, { propertyName: "content", first: true, predicate: IonContent, descendants: true, static: true }], usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppEditor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppEditor, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: i1.ActivatedRoute, decorators: [{
                     type: Optional

package/esm2022/src/app/core/form/entity/entity-editor-modal.class.mjs

@@ -391,10 +391,10 @@ export class AppEntityEditorModal extends AppTabEditor {
             this.markForCheck();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppEntityEditorModal, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: AppEntityEditorModal, inputs: { data: "data", mobile: "mobile", usageMode: "usageMode", onAfterModalInit: "onAfterModalInit", onDelete: "onDelete", i18nSuffix: "i18nSuffix", isNew: "isNew", isNewData: "isNewData", disabled: "disabled" }, usesInheritance: true, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppEntityEditorModal, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: AppEntityEditorModal, inputs: { data: "data", mobile: "mobile", usageMode: "usageMode", onAfterModalInit: "onAfterModalInit", onDelete: "onDelete", i18nSuffix: "i18nSuffix", isNew: "isNew", isNewData: "isNewData", disabled: "disabled" }, usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppEntityEditorModal, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppEntityEditorModal, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: i0.Injector }, { type: undefined }, { type: undefined, decorators: [{
                     type: Optional

package/esm2022/src/app/core/form/entity/entity-editor.class.mjs

@@ -737,10 +737,10 @@ export class AppEntityEditor extends AppTabEditor {
             this.markForCheck();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppEntityEditor, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: AppEntityEditor, usesInheritance: true, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppEntityEditor, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: AppEntityEditor, usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppEntityEditor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppEntityEditor, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: i0.Injector }, { type: undefined }, { type: undefined }, { type: AppEditorOptions, decorators: [{
                     type: Optional

package/esm2022/src/app/core/form/entity/entity-metadata.component.mjs

@@ -11,10 +11,10 @@ import * as i6 from "../../services/pipes/person-to-string.pipe";
 export class EntityMetadataComponent {
     value;
     showRecorder = true;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EntityMetadataComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: EntityMetadataComponent, selector: "app-entity-metadata", inputs: { value: "value", showRecorder: "showRecorder" }, ngImport: i0, template: "@if (value?.id) {\n  <ion-card @fadeInAnimation>\n    <!-- recorder -->\n    @if (showRecorder && (value.recorderDepartment || value.recorderPerson)) {\n      <ion-item color=\"transparent\">\n        <!-- recorder avatar -->\n        @if (value.recorderPerson; as recorderPerson) {\n          <ion-avatar slot=\"start\">\n            @if (recorderPerson.avatar; as avatarUrl) {\n              <ion-img [src]=\"avatarUrl\"/>\n            } @else if (recorderPerson?.id | isNotNil) {\n              <svg width=\"38\" height=\"38\" [data-jdenticon-value]=\"recorderPerson.id\"></svg>\n            }\n          </ion-avatar>\n        }\n\n        <!-- recorder name -->\n        <ion-label>\n          <ion-card-subtitle translate>COMMON.RECORDER</ion-card-subtitle>\n          @if (value.recorderPerson; as recorderPerson) {\n            <ion-card-title class=\"ion-text-nowrap\">\n              {{ recorderPerson | personToString }}\n            </ion-card-title>\n            @if (value.recorderDepartment) {\n              <ion-card-subtitle>{{ value.recorderDepartment.label || value.recorderDepartment.name }}</ion-card-subtitle>\n            }\n          } @else if (value.recorderDepartment) {\n            <ion-card-title>{{ value.recorderDepartment.label || value.recorderDepartment.name }}</ion-card-title>\n          }\n\n\n        </ion-label>\n\n        <ng-content select=\"[recorderSuffix]\"></ng-content>\n      </ion-item>\n    }\n\n    <ng-content select=\"[afterRecorder]\"></ng-content>\n\n    <ion-card-content>\n      <ion-label class=\"ion-text-wrap status\">\n        <!-- creation date -->\n        @if (value.creationDate) {\n          <ion-text>\n            <ion-icon name=\"calendar\"></ion-icon>\n            &nbsp;\n            <span translate>COMMON.CREATED_ON</span>\n            <span>\n            &nbsp;\n            <b>{{ value.creationDate | dateFormat: {time: true} }}</b>\n          </span>\n          </ion-text>\n        }\n\n        <!-- update date -->\n        @if (value.updateDate != value.creationDate && value.updateDate; as updateDate) {\n          <ion-text>\n            @if (value.creationDate) {\n              <br/>\n            }\n            <ion-label>\n              <ion-icon name=\"time-outline\"></ion-icon>\n              &nbsp;\n              <span translate>COMMON.UPDATED_ON</span>\n              <span>&nbsp;{{ updateDate | dateFormat: {time: true, seconds: true} }}</span>\n            </ion-label>\n          </ion-text>\n        }\n      </ion-label>\n\n      <ng-content></ng-content>\n    </ion-card-content>\n  </ion-card>\n}\n", styles: ["ion-card{background-color:var(--ion-color-light-tint)}ion-card ion-item ion-avatar{--avatar-border-width: 1px;--avatar-border-opacity: .5;--avatar-size: 40px;--avatar-svg-background-color: var(--ion-background-color);--avatar-img-background-color: var(--ion-color-secondary);height:var(--avatar-size, 40px);width:var(--avatar-size, 40px);border:solid var(--avatar-border-width, 1px) rgba(var(--ion-color-secondary-rgb),var(--avatar-border-opacity, .5))}ion-card ion-item ion-avatar ::ng-deep ion-img img{background-color:var(--avatar-img-background-color)}ion-card ion-item ion-avatar svg{background-color:var(--avatar-svg-background-color);border-radius:50%;height:calc(var(--avatar-size, 40px) - var(--avatar-border-width, 1px) * 2);width:calc(var(--avatar-size, 40px) - var(--avatar-border-width, 1px) * 2)}ion-card ion-item ion-card-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}ion-card ion-card-content{background-color:var(--ion-color-light-tint)}ion-card ion-card-content ion-label.status,ion-card ion-card-content * ion-label.status{font-size:12px!important;color:var(--ion-color-step-850)}\n"], dependencies: [{ kind: "component", type: i1.IonAvatar, selector: "ion-avatar" }, { kind: "component", type: i1.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i1.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }, { kind: "component", type: i1.IonCardSubtitle, selector: "ion-card-subtitle", inputs: ["color", "mode"] }, { kind: "component", type: i1.IonCardTitle, selector: "ion-card-title", inputs: ["color", "mode"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1.IonImg, selector: "ion-img", inputs: ["alt", "src"] }, { kind: "component", type: i1.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: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i2.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "directive", type: i3.SvgJdenticonDirective, selector: "svg[data-jdenticon-hash],svg[data-jdenticon-value]", inputs: ["data-jdenticon-hash", "data-jdenticon-value", "width", "height"] }, { kind: "pipe", type: i4.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i5.IsNotNilPipe, name: "isNotNil" }, { kind: "pipe", type: i6.PersonToStringPipe, name: "personToString" }], animations: [fadeInAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EntityMetadataComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: EntityMetadataComponent, selector: "app-entity-metadata", inputs: { value: "value", showRecorder: "showRecorder" }, ngImport: i0, template: "@if (value?.id) {\n  <ion-card @fadeInAnimation>\n    <!-- recorder -->\n    @if (showRecorder && (value.recorderDepartment || value.recorderPerson)) {\n      <ion-item color=\"transparent\">\n        <!-- recorder avatar -->\n        @if (value.recorderPerson; as recorderPerson) {\n          <ion-avatar slot=\"start\">\n            @if (recorderPerson.avatar; as avatarUrl) {\n              <ion-img [src]=\"avatarUrl\"/>\n            } @else if (recorderPerson?.id | isNotNil) {\n              <svg width=\"38\" height=\"38\" [data-jdenticon-value]=\"recorderPerson.id\"></svg>\n            }\n          </ion-avatar>\n        }\n\n        <!-- recorder name -->\n        <ion-label>\n          <ion-card-subtitle translate>COMMON.RECORDER</ion-card-subtitle>\n          @if (value.recorderPerson; as recorderPerson) {\n            <ion-card-title class=\"ion-text-nowrap\">\n              {{ recorderPerson | personToString }}\n            </ion-card-title>\n            @if (value.recorderDepartment) {\n              <ion-card-subtitle>{{ value.recorderDepartment.label || value.recorderDepartment.name }}</ion-card-subtitle>\n            }\n          } @else if (value.recorderDepartment) {\n            <ion-card-title>{{ value.recorderDepartment.label || value.recorderDepartment.name }}</ion-card-title>\n          }\n\n\n        </ion-label>\n\n        <ng-content select=\"[recorderSuffix]\"></ng-content>\n      </ion-item>\n    }\n\n    <ng-content select=\"[afterRecorder]\"></ng-content>\n\n    <ion-card-content>\n      <ion-label class=\"ion-text-wrap status\">\n        <!-- creation date -->\n        @if (value.creationDate) {\n          <ion-text>\n            <ion-icon name=\"calendar\"></ion-icon>\n            &nbsp;\n            <span translate>COMMON.CREATED_ON</span>\n            <span>\n            &nbsp;\n            <b>{{ value.creationDate | dateFormat: {time: true} }}</b>\n          </span>\n          </ion-text>\n        }\n\n        <!-- update date -->\n        @if (value.updateDate != value.creationDate && value.updateDate; as updateDate) {\n          <ion-text>\n            @if (value.creationDate) {\n              <br/>\n            }\n            <ion-label>\n              <ion-icon name=\"time-outline\"></ion-icon>\n              &nbsp;\n              <span translate>COMMON.UPDATED_ON</span>\n              <span>&nbsp;{{ updateDate | dateFormat: {time: true, seconds: true} }}</span>\n            </ion-label>\n          </ion-text>\n        }\n      </ion-label>\n\n      <ng-content></ng-content>\n    </ion-card-content>\n  </ion-card>\n}\n", styles: ["ion-card{background-color:var(--ion-color-light-tint)}ion-card ion-item ion-avatar{--avatar-border-width: 1px;--avatar-border-opacity: .5;--avatar-size: 40px;--avatar-svg-background-color: var(--ion-background-color);--avatar-img-background-color: var(--ion-color-secondary);height:var(--avatar-size, 40px);width:var(--avatar-size, 40px);border:solid var(--avatar-border-width, 1px) rgba(var(--ion-color-secondary-rgb),var(--avatar-border-opacity, .5))}ion-card ion-item ion-avatar ::ng-deep ion-img img{background-color:var(--avatar-img-background-color)}ion-card ion-item ion-avatar svg{background-color:var(--avatar-svg-background-color);border-radius:50%;height:calc(var(--avatar-size, 40px) - var(--avatar-border-width, 1px) * 2);width:calc(var(--avatar-size, 40px) - var(--avatar-border-width, 1px) * 2)}ion-card ion-item ion-card-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}ion-card ion-card-content{background-color:var(--ion-color-light-tint)}ion-card ion-card-content ion-label.status,ion-card ion-card-content * ion-label.status{font-size:12px!important;color:var(--ion-color-step-850)}\n"], dependencies: [{ kind: "component", type: i1.IonAvatar, selector: "ion-avatar" }, { kind: "component", type: i1.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i1.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }, { kind: "component", type: i1.IonCardSubtitle, selector: "ion-card-subtitle", inputs: ["color", "mode"] }, { kind: "component", type: i1.IonCardTitle, selector: "ion-card-title", inputs: ["color", "mode"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1.IonImg, selector: "ion-img", inputs: ["alt", "src"] }, { kind: "component", type: i1.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: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i2.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "directive", type: i3.SvgJdenticonDirective, selector: "svg[data-jdenticon-hash],svg[data-jdenticon-value]", inputs: ["data-jdenticon-hash", "data-jdenticon-value", "width", "height"] }, { kind: "pipe", type: i4.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i5.IsNotNilPipe, name: "isNotNil" }, { kind: "pipe", type: i6.PersonToStringPipe, name: "personToString" }], animations: [fadeInAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EntityMetadataComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EntityMetadataComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-entity-metadata', animations: [fadeInAnimation], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (value?.id) {\n  <ion-card @fadeInAnimation>\n    <!-- recorder -->\n    @if (showRecorder && (value.recorderDepartment || value.recorderPerson)) {\n      <ion-item color=\"transparent\">\n        <!-- recorder avatar -->\n        @if (value.recorderPerson; as recorderPerson) {\n          <ion-avatar slot=\"start\">\n            @if (recorderPerson.avatar; as avatarUrl) {\n              <ion-img [src]=\"avatarUrl\"/>\n            } @else if (recorderPerson?.id | isNotNil) {\n              <svg width=\"38\" height=\"38\" [data-jdenticon-value]=\"recorderPerson.id\"></svg>\n            }\n          </ion-avatar>\n        }\n\n        <!-- recorder name -->\n        <ion-label>\n          <ion-card-subtitle translate>COMMON.RECORDER</ion-card-subtitle>\n          @if (value.recorderPerson; as recorderPerson) {\n            <ion-card-title class=\"ion-text-nowrap\">\n              {{ recorderPerson | personToString }}\n            </ion-card-title>\n            @if (value.recorderDepartment) {\n              <ion-card-subtitle>{{ value.recorderDepartment.label || value.recorderDepartment.name }}</ion-card-subtitle>\n            }\n          } @else if (value.recorderDepartment) {\n            <ion-card-title>{{ value.recorderDepartment.label || value.recorderDepartment.name }}</ion-card-title>\n          }\n\n\n        </ion-label>\n\n        <ng-content select=\"[recorderSuffix]\"></ng-content>\n      </ion-item>\n    }\n\n    <ng-content select=\"[afterRecorder]\"></ng-content>\n\n    <ion-card-content>\n      <ion-label class=\"ion-text-wrap status\">\n        <!-- creation date -->\n        @if (value.creationDate) {\n          <ion-text>\n            <ion-icon name=\"calendar\"></ion-icon>\n            &nbsp;\n            <span translate>COMMON.CREATED_ON</span>\n            <span>\n            &nbsp;\n            <b>{{ value.creationDate | dateFormat: {time: true} }}</b>\n          </span>\n          </ion-text>\n        }\n\n        <!-- update date -->\n        @if (value.updateDate != value.creationDate && value.updateDate; as updateDate) {\n          <ion-text>\n            @if (value.creationDate) {\n              <br/>\n            }\n            <ion-label>\n              <ion-icon name=\"time-outline\"></ion-icon>\n              &nbsp;\n              <span translate>COMMON.UPDATED_ON</span>\n              <span>&nbsp;{{ updateDate | dateFormat: {time: true, seconds: true} }}</span>\n            </ion-label>\n          </ion-text>\n        }\n      </ion-label>\n\n      <ng-content></ng-content>\n    </ion-card-content>\n  </ion-card>\n}\n", styles: ["ion-card{background-color:var(--ion-color-light-tint)}ion-card ion-item ion-avatar{--avatar-border-width: 1px;--avatar-border-opacity: .5;--avatar-size: 40px;--avatar-svg-background-color: var(--ion-background-color);--avatar-img-background-color: var(--ion-color-secondary);height:var(--avatar-size, 40px);width:var(--avatar-size, 40px);border:solid var(--avatar-border-width, 1px) rgba(var(--ion-color-secondary-rgb),var(--avatar-border-opacity, .5))}ion-card ion-item ion-avatar ::ng-deep ion-img img{background-color:var(--avatar-img-background-color)}ion-card ion-item ion-avatar svg{background-color:var(--avatar-svg-background-color);border-radius:50%;height:calc(var(--avatar-size, 40px) - var(--avatar-border-width, 1px) * 2);width:calc(var(--avatar-size, 40px) - var(--avatar-border-width, 1px) * 2)}ion-card ion-item ion-card-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}ion-card ion-card-content{background-color:var(--ion-color-light-tint)}ion-card ion-card-content ion-label.status,ion-card ion-card-content * ion-label.status{font-size:12px!important;color:var(--ion-color-step-850)}\n"] }]
         }], propDecorators: { value: [{

package/esm2022/src/app/core/form/entity/entity.module.mjs

@@ -7,15 +7,15 @@ import { CorePipesModule } from "../../services/pipes/pipes.module";
 import * as i0 from "@angular/core";
 import * as i1 from "@ngx-translate/core";
 export class AppEntityFormModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppEntityFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: AppEntityFormModule, declarations: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppEntityFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: AppEntityFormModule, declarations: [
             // Other components
             EntityMetadataComponent], imports: [SharedModule, i1.TranslateModule, NgxJdenticonModule, CorePipesModule], exports: [TranslateModule,
             // Components
             EntityMetadataComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppEntityFormModule, imports: [SharedModule, TranslateModule.forChild(), NgxJdenticonModule, CorePipesModule, TranslateModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppEntityFormModule, imports: [SharedModule, TranslateModule.forChild(), NgxJdenticonModule, CorePipesModule, TranslateModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppEntityFormModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppEntityFormModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [SharedModule, TranslateModule.forChild(), NgxJdenticonModule, CorePipesModule],

package/esm2022/src/app/core/form/entity/tab-editor.class.mjs

@@ -168,10 +168,10 @@ export class AppTabEditor extends AppEditor {
             state: { animated: false },
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppTabEditor, deps: [{ token: i1.ActivatedRoute, optional: true }, { token: i1.Router }, { token: i2.NavController }, { token: i2.AlertController }, { token: i3.TranslateService }, { token: AppTabEditorOptions, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: AppTabEditor, inputs: { queryTabIndexParamName: "queryTabIndexParamName", selectedTabIndex: "selectedTabIndex" }, outputs: { selectedTabIndexChange: "selectedTabIndexChange" }, viewQueries: [{ propertyName: "tabGroup", first: true, predicate: ["tabGroup"], descendants: true, static: true }], usesInheritance: true, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppTabEditor, deps: [{ token: i1.ActivatedRoute, optional: true }, { token: i1.Router }, { token: i2.NavController }, { token: i2.AlertController }, { token: i3.TranslateService }, { token: AppTabEditorOptions, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: AppTabEditor, inputs: { queryTabIndexParamName: "queryTabIndexParamName", selectedTabIndex: "selectedTabIndex" }, outputs: { selectedTabIndexChange: "selectedTabIndexChange" }, viewQueries: [{ propertyName: "tabGroup", first: true, predicate: ["tabGroup"], descendants: true, static: true }], usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppTabEditor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppTabEditor, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: i1.ActivatedRoute, decorators: [{
                     type: Optional

package/esm2022/src/app/core/form/form-container.class.mjs

@@ -336,10 +336,10 @@ export class AppFormContainer {
             console.warn(`${prefix} Unknown children sub-form: `, c);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppFormContainer, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: AppFormContainer, inputs: { debug: "debug" }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppFormContainer, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: AppFormContainer, inputs: { debug: "debug" }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppFormContainer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppFormContainer, decorators: [{
             type: Directive
         }], ctorParameters: () => [], propDecorators: { debug: [{
                 type: Input

package/esm2022/src/app/core/form/form.class.mjs

@@ -319,10 +319,10 @@ export class AppForm {
             }
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppForm, deps: [{ token: i0.Injector }, { token: i1.UntypedFormGroup }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.2.14", type: AppForm, inputs: { debug: ["debug", "debug", booleanAttribute], tabindex: ["tabindex", "tabindex", numberAttribute], errorTranslateOptions: "errorTranslateOptions", form: "form" }, outputs: { onCancel: "onCancel", onSubmit: "onSubmit" }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppForm, deps: [{ token: i0.Injector }, { token: i1.UntypedFormGroup }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.2.13", type: AppForm, inputs: { debug: ["debug", "debug", booleanAttribute], tabindex: ["tabindex", "tabindex", numberAttribute], errorTranslateOptions: "errorTranslateOptions", form: "form" }, outputs: { onCancel: "onCancel", onSubmit: "onSubmit" }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppForm, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppForm, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.UntypedFormGroup }], propDecorators: { debug: [{
                 type: Input,

package/esm2022/src/app/core/form/form.module.mjs

@@ -11,8 +11,8 @@ import { AppTextFormModule } from './text/text-form.module';
 import * as i0 from "@angular/core";
 import * as i1 from "@ngx-translate/core";
 export class AppFormModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: AppFormModule, imports: [SharedModule, i1.TranslateModule, 
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: AppFormModule, imports: [SharedModule, i1.TranslateModule, 
             // Sub modules
             AppEntityFormModule,
             AppListFormModule,
@@ -28,7 +28,7 @@ export class AppFormModule {
             AppTextFormModule,
             AppTextPopoverModule,
             AppFormButtonsBarModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppFormModule, imports: [SharedModule,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppFormModule, imports: [SharedModule,
             TranslateModule.forChild(),
             // Sub modules
             AppEntityFormModule,
@@ -46,7 +46,7 @@ export class AppFormModule {
             AppTextPopoverModule,
             AppFormButtonsBarModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppFormModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppFormModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/esm2022/src/app/core/form/list/list.form.mjs

@@ -212,10 +212,10 @@ export class AppListForm extends AppForm {
     markForCheck() {
         this.cd.markForCheck();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppListForm, deps: [{ token: i0.Injector }, { token: i1.UntypedFormBuilder }, { token: i2.DateAdapter }, { token: i3.LocalSettingsService }, { token: i0.ChangeDetectorRef }, { token: i1.FormGroupDirective, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: AppListForm, selector: "app-list-form", inputs: { formArrayName: "formArrayName", formArray: "formArray", options: "options", displayWithFn: ["displayWith", "displayWithFn"], equalsFn: ["equals", "equalsFn"], isEmptyFn: ["isEmpty", "isEmptyFn"] }, outputs: { onNewItem: "onNewItem", selectionChanges: "selectionChanges" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!loading; else listSkeleton\">\n  <!-- List -->\n  <ion-list class=\"ion-no-padding\">\n    <ng-container *ngFor=\"let itemControl of itemControls; index as i; last as last\">\n      <ion-item\n        *ngIf=\"itemControl.value; let item\"\n        [class.disabled]=\"disabled\"\n        tappable\n        (click)=\"onItemClick($event, item)\"\n        [color]=\"selection.isSelected(item) ? 'secondary100' : undefined\"\n        [button]=\"selectionChanges.observers | isNotEmptyArray\"\n      >\n        <ion-label>{{ displayWith(item) }}</ion-label>\n\n        <!-- buttons -->\n        <ion-buttons slot=\"end\" *ngIf=\"enabled\" class=\"action-buttons\">\n          <ion-button fill=\"clear\" (click)=\"removeAt(i)\">\n            <ion-icon slot=\"icon-only\" name=\"trash\"></ion-icon>\n          </ion-button>\n\n          <ion-button\n            *ngFor=\"let button of options.buttons\"\n            fill=\"clear\"\n            [color]=\"button.color\"\n            [class.cdk-visually-hidden]=\"button.disabled | async\"\n            (click)=\"onItemButtonClick(button, $event, item, i)\"\n            [title]=\"!showTooltip ? (button.title || '' | translate) : ''\"\n            [matTooltip]=\"showTooltip ? (button.title || '' | translate) : ''\"\n          >\n            <ion-icon slot=\"icon-only\" [name]=\"button.icon\"></ion-icon>\n          </ion-button>\n        </ion-buttons>\n      </ion-item>\n    </ng-container>\n  </ion-list>\n\n  <!-- Add button -->\n  <ion-button\n    color=\"tertiary\"\n    fill=\"clear\"\n    *ngIf=\"enabled && onNewItem.observed; else emptyText\"\n    [title]=\"!showTooltip ? ('COMMON.BTN_ADD' | translate) : ''\"\n    [matTooltip]=\"showTooltip ? ('COMMON.BTN_ADD' | translate) : ''\"\n    (click)=\"onNewClick($event)\"\n  >\n    <ion-icon slot=\"start\" name=\"add\"></ion-icon>\n    <ion-label translate>COMMON.BTN_ADD</ion-label>\n  </ion-button>\n\n  <!-- Empty (if readonly) -->\n  <ng-template #emptyText>\n    <ion-text *ngIf=\"!length\" color=\"medium\"><i translate>COMMON.EMPTY_OPTION</i></ion-text>\n  </ng-template>\n</ng-container>\n\n<ng-template #listSkeleton>\n  <ion-list>\n    <ng-container *ngTemplateOutlet=\"itemSkeleton\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"itemSkeleton\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"itemSkeleton\"></ng-container>\n  </ion-list>\n</ng-template>\n\n<ng-template #itemSkeleton>\n  <ion-item>\n    <ion-label>\n      <ion-skeleton-text animated style=\"width: 60%\"></ion-skeleton-text>\n    </ion-label>\n  </ion-item>\n</ng-template>\n", styles: [":host{--ion-item-background-selected: var(--ion-color-secondary100);--ion-item-color-selected: var(--ion-color-secondary100-contrast)}ion-item.disabled ion-label{color:var(--ion-color-medium-shade, grey)}ion-item{--min-height: 48px;background-color:var(--ion-item-background)}ion-item ion-text,ion-item ion-label{color:var(--ion-item-color)}ion-item .action-buttons{visibility:hidden;display:none}ion-item:hover{height:var(--min-height);--ion-item-background-color: var(--ion-color-light);--ion-item-color: var(--ion-color-light-contrast)}ion-item:hover .action-buttons{margin-top:-1px;visibility:visible;display:block}ion-item.selected{--ion-item-background-color-hover: var(--ion-item-background-selected) !important;--ion-item-color-hover: var(--ion-item-color-selected) !important}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.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: i5.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i5.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i5.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: i5.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i5.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i5.IonSkeletonText, selector: "ion-skeleton-text", inputs: ["animated"] }, { kind: "component", type: i5.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i6.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TranslatePipe, name: "translate" }, { kind: "pipe", type: i8.NotEmptyArrayPipe, name: "isNotEmptyArray" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppListForm, deps: [{ token: i0.Injector }, { token: i1.UntypedFormBuilder }, { token: i2.DateAdapter }, { token: i3.LocalSettingsService }, { token: i0.ChangeDetectorRef }, { token: i1.FormGroupDirective, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: AppListForm, selector: "app-list-form", inputs: { formArrayName: "formArrayName", formArray: "formArray", options: "options", displayWithFn: ["displayWith", "displayWithFn"], equalsFn: ["equals", "equalsFn"], isEmptyFn: ["isEmpty", "isEmptyFn"] }, outputs: { onNewItem: "onNewItem", selectionChanges: "selectionChanges" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!loading; else listSkeleton\">\n  <!-- List -->\n  <ion-list class=\"ion-no-padding\">\n    <ng-container *ngFor=\"let itemControl of itemControls; index as i; last as last\">\n      <ion-item\n        *ngIf=\"itemControl.value; let item\"\n        [class.disabled]=\"disabled\"\n        tappable\n        (click)=\"onItemClick($event, item)\"\n        [color]=\"selection.isSelected(item) ? 'secondary100' : undefined\"\n        [button]=\"selectionChanges.observers | isNotEmptyArray\"\n      >\n        <ion-label>{{ displayWith(item) }}</ion-label>\n\n        <!-- buttons -->\n        <ion-buttons slot=\"end\" *ngIf=\"enabled\" class=\"action-buttons\">\n          <ion-button fill=\"clear\" (click)=\"removeAt(i)\">\n            <ion-icon slot=\"icon-only\" name=\"trash\"></ion-icon>\n          </ion-button>\n\n          <ion-button\n            *ngFor=\"let button of options.buttons\"\n            fill=\"clear\"\n            [color]=\"button.color\"\n            [class.cdk-visually-hidden]=\"button.disabled | async\"\n            (click)=\"onItemButtonClick(button, $event, item, i)\"\n            [title]=\"!showTooltip ? (button.title || '' | translate) : ''\"\n            [matTooltip]=\"showTooltip ? (button.title || '' | translate) : ''\"\n          >\n            <ion-icon slot=\"icon-only\" [name]=\"button.icon\"></ion-icon>\n          </ion-button>\n        </ion-buttons>\n      </ion-item>\n    </ng-container>\n  </ion-list>\n\n  <!-- Add button -->\n  <ion-button\n    color=\"tertiary\"\n    fill=\"clear\"\n    *ngIf=\"enabled && onNewItem.observed; else emptyText\"\n    [title]=\"!showTooltip ? ('COMMON.BTN_ADD' | translate) : ''\"\n    [matTooltip]=\"showTooltip ? ('COMMON.BTN_ADD' | translate) : ''\"\n    (click)=\"onNewClick($event)\"\n  >\n    <ion-icon slot=\"start\" name=\"add\"></ion-icon>\n    <ion-label translate>COMMON.BTN_ADD</ion-label>\n  </ion-button>\n\n  <!-- Empty (if readonly) -->\n  <ng-template #emptyText>\n    <ion-text *ngIf=\"!length\" color=\"medium\"><i translate>COMMON.EMPTY_OPTION</i></ion-text>\n  </ng-template>\n</ng-container>\n\n<ng-template #listSkeleton>\n  <ion-list>\n    <ng-container *ngTemplateOutlet=\"itemSkeleton\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"itemSkeleton\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"itemSkeleton\"></ng-container>\n  </ion-list>\n</ng-template>\n\n<ng-template #itemSkeleton>\n  <ion-item>\n    <ion-label>\n      <ion-skeleton-text animated style=\"width: 60%\"></ion-skeleton-text>\n    </ion-label>\n  </ion-item>\n</ng-template>\n", styles: [":host{--ion-item-background-selected: var(--ion-color-secondary100);--ion-item-color-selected: var(--ion-color-secondary100-contrast)}ion-item.disabled ion-label{color:var(--ion-color-medium-shade, grey)}ion-item{--min-height: 48px;background-color:var(--ion-item-background)}ion-item ion-text,ion-item ion-label{color:var(--ion-item-color)}ion-item .action-buttons{visibility:hidden;display:none}ion-item:hover{height:var(--min-height);--ion-item-background-color: var(--ion-color-light);--ion-item-color: var(--ion-color-light-contrast)}ion-item:hover .action-buttons{margin-top:-1px;visibility:visible;display:block}ion-item.selected{--ion-item-background-color-hover: var(--ion-item-background-selected) !important;--ion-item-color-hover: var(--ion-item-color-selected) !important}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.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: i5.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i5.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i5.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: i5.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i5.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i5.IonSkeletonText, selector: "ion-skeleton-text", inputs: ["animated"] }, { kind: "component", type: i5.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i6.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TranslatePipe, name: "translate" }, { kind: "pipe", type: i8.NotEmptyArrayPipe, name: "isNotEmptyArray" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppListForm, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppListForm, decorators: [{
             type: Component,
             args: [{ selector: 'app-list-form', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!loading; else listSkeleton\">\n  <!-- List -->\n  <ion-list class=\"ion-no-padding\">\n    <ng-container *ngFor=\"let itemControl of itemControls; index as i; last as last\">\n      <ion-item\n        *ngIf=\"itemControl.value; let item\"\n        [class.disabled]=\"disabled\"\n        tappable\n        (click)=\"onItemClick($event, item)\"\n        [color]=\"selection.isSelected(item) ? 'secondary100' : undefined\"\n        [button]=\"selectionChanges.observers | isNotEmptyArray\"\n      >\n        <ion-label>{{ displayWith(item) }}</ion-label>\n\n        <!-- buttons -->\n        <ion-buttons slot=\"end\" *ngIf=\"enabled\" class=\"action-buttons\">\n          <ion-button fill=\"clear\" (click)=\"removeAt(i)\">\n            <ion-icon slot=\"icon-only\" name=\"trash\"></ion-icon>\n          </ion-button>\n\n          <ion-button\n            *ngFor=\"let button of options.buttons\"\n            fill=\"clear\"\n            [color]=\"button.color\"\n            [class.cdk-visually-hidden]=\"button.disabled | async\"\n            (click)=\"onItemButtonClick(button, $event, item, i)\"\n            [title]=\"!showTooltip ? (button.title || '' | translate) : ''\"\n            [matTooltip]=\"showTooltip ? (button.title || '' | translate) : ''\"\n          >\n            <ion-icon slot=\"icon-only\" [name]=\"button.icon\"></ion-icon>\n          </ion-button>\n        </ion-buttons>\n      </ion-item>\n    </ng-container>\n  </ion-list>\n\n  <!-- Add button -->\n  <ion-button\n    color=\"tertiary\"\n    fill=\"clear\"\n    *ngIf=\"enabled && onNewItem.observed; else emptyText\"\n    [title]=\"!showTooltip ? ('COMMON.BTN_ADD' | translate) : ''\"\n    [matTooltip]=\"showTooltip ? ('COMMON.BTN_ADD' | translate) : ''\"\n    (click)=\"onNewClick($event)\"\n  >\n    <ion-icon slot=\"start\" name=\"add\"></ion-icon>\n    <ion-label translate>COMMON.BTN_ADD</ion-label>\n  </ion-button>\n\n  <!-- Empty (if readonly) -->\n  <ng-template #emptyText>\n    <ion-text *ngIf=\"!length\" color=\"medium\"><i translate>COMMON.EMPTY_OPTION</i></ion-text>\n  </ng-template>\n</ng-container>\n\n<ng-template #listSkeleton>\n  <ion-list>\n    <ng-container *ngTemplateOutlet=\"itemSkeleton\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"itemSkeleton\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"itemSkeleton\"></ng-container>\n  </ion-list>\n</ng-template>\n\n<ng-template #itemSkeleton>\n  <ion-item>\n    <ion-label>\n      <ion-skeleton-text animated style=\"width: 60%\"></ion-skeleton-text>\n    </ion-label>\n  </ion-item>\n</ng-template>\n", styles: [":host{--ion-item-background-selected: var(--ion-color-secondary100);--ion-item-color-selected: var(--ion-color-secondary100-contrast)}ion-item.disabled ion-label{color:var(--ion-color-medium-shade, grey)}ion-item{--min-height: 48px;background-color:var(--ion-item-background)}ion-item ion-text,ion-item ion-label{color:var(--ion-item-color)}ion-item .action-buttons{visibility:hidden;display:none}ion-item:hover{height:var(--min-height);--ion-item-background-color: var(--ion-color-light);--ion-item-color: var(--ion-color-light-contrast)}ion-item:hover .action-buttons{margin-top:-1px;visibility:visible;display:block}ion-item.selected{--ion-item-background-color-hover: var(--ion-item-background-selected) !important;--ion-item-color-hover: var(--ion-item-color-selected) !important}\n"] }]
         }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.UntypedFormBuilder }, { type: i2.DateAdapter }, { type: i3.LocalSettingsService }, { type: i0.ChangeDetectorRef }, { type: i1.FormGroupDirective, decorators: [{

package/esm2022/src/app/core/form/list/list.module.mjs

@@ -5,15 +5,15 @@ import { TranslateModule } from '@ngx-translate/core';
 import * as i0 from "@angular/core";
 import * as i1 from "@ngx-translate/core";
 export class AppListFormModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppListFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: AppListFormModule, declarations: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppListFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: AppListFormModule, declarations: [
             // Other components
             AppListForm], imports: [SharedModule, i1.TranslateModule], exports: [TranslateModule,
             // Components
             AppListForm] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppListFormModule, imports: [SharedModule, TranslateModule.forChild(), TranslateModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppListFormModule, imports: [SharedModule, TranslateModule.forChild(), TranslateModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppListFormModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppListFormModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [SharedModule, TranslateModule.forChild()],

package/esm2022/src/app/core/form/properties/properties-file.service.mjs

@@ -120,10 +120,10 @@ export class PropertiesFileService {
             throw new Error("Missing toastController in component's constructor");
         return Toasts.show(this.toastController, this.translate, opts);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PropertiesFileService, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: PropertiesFileService, inputs: { i18nColumnPrefix: "i18nColumnPrefix", importPolicy: "importPolicy" }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PropertiesFileService, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: PropertiesFileService, inputs: { i18nColumnPrefix: "i18nColumnPrefix", importPolicy: "importPolicy" }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PropertiesFileService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PropertiesFileService, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: i0.Injector }], propDecorators: { i18nColumnPrefix: [{
                 type: Input

package/esm2022/src/app/core/form/properties/properties.form.mjs

@@ -336,10 +336,10 @@ export class AppPropertiesForm extends AppForm {
     isEmptyProperty(obj) {
         return isNil(obj?.key) || isNil(obj.value);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppPropertiesForm, deps: [{ token: i0.Injector }, { token: i1.UntypedFormBuilder }, { token: i2.DateAdapter }, { token: i0.ChangeDetectorRef }, { token: i3.PropertyValidator }, { token: i1.FormGroupDirective, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: AppPropertiesForm, selector: "app-properties-form", inputs: { showToolbar: ["showToolbar", "showToolbar", booleanAttribute], formArrayName: "formArrayName", formArray: "formArray", options: "options", chipColor: "chipColor", mobile: ["mobile", "mobile", booleanAttribute], appearance: "appearance", subscriptSizing: "subscriptSizing", showHintKey: ["showHintKey", "showHintKey", booleanAttribute], hintKeyPrefix: "hintKeyPrefix", showMoreButton: ["showMoreButton", "showMoreButton", booleanAttribute], addButtonText: "addButtonText", addButtonTitle: "addButtonTitle", showAddButton: ["showAddButton", "showAddButton", booleanAttribute], panelClass: "panelClass", panelWidth: "panelWidth", canDownload: ["canDownload", "canDownload", booleanAttribute], canImport: ["canImport", "canImport", booleanAttribute], showMoreButtonTitle: "showMoreButtonTitle", definitions: "definitions", importPolicy: "importPolicy" }, providers: [{ provide: PropertyValidator, useClass: PropertyValidator }, RxState], usesInheritance: true, ngImport: i0, template: "@if (showToolbar) {\n  <mat-toolbar>\n    <div class=\"toolbar-spacer\"></div>\n\n    <ion-item lines=\"none\" (click)=\"toggleShowHintKeys()\">\n      <ion-label color=\"dark\">{{ 'FILE.PROPERTIES.BTN_SHOW_HINT_KEY' | translate }}</ion-label>\n      <ion-toggle color=\"primary\" [checked]=\"showHintKey\"></ion-toggle>\n    </ion-item>\n\n    <!-- options sub menu -->\n    @if (canDownload || canImport) {\n      <button\n        slot=\"end\"\n        mat-icon-button\n        [matMenuTriggerFor]=\"optionsMenu\"\n        [title]=\"!showTooltip ? ('COMMON.BTN_OPTIONS' | translate) : ''\"\n        [matTooltip]=\"showTooltip ? ('COMMON.BTN_OPTIONS' | translate) : ''\"\n      >\n        <mat-icon>more_vert</mat-icon>\n      </button>\n    }\n  </mat-toolbar>\n}\n\n<!-- Options menu -->\n<mat-menu #optionsMenu=\"matMenu\">\n  <!-- Download as CSV -->\n  @if (canDownload) {\n    <button mat-menu-item [disabled]=\"loading\" [matMenuTriggerFor]=\"downloadMenu\">\n      <mat-icon>download</mat-icon>\n      <ion-label translate>COMMON.BTN_DOWNLOAD_DOTS</ion-label>\n    </button>\n  }\n\n  <!-- Import from file -->\n  @if (canImport) {\n    <button mat-menu-item [disabled]=\"loading || disabled\" [matMenuTriggerFor]=\"importMenu\">\n      <mat-icon>upload</mat-icon>\n      <ion-label translate>COMMON.BTN_IMPORT_FROM_FILE_DOTS</ion-label>\n    </button>\n  }\n</mat-menu>\n\n<!-- Download menu -->\n<mat-menu #downloadMenu=\"matMenu\">\n  <button mat-menu-item [disabled]=\"loading\" (click)=\"exportToCsv()\">\n    <ion-label translate>FILE.PROPERTIES.BTN_DOWNLOAD_AS_CSV</ion-label>\n  </button>\n</mat-menu>\n\n<!-- Import menu -->\n<mat-menu #importMenu=\"matMenu\">\n  <!-- import from file -->\n  <button mat-menu-item (click)=\"importFromCsv($event)\">\n    <ion-label translate>FILE.PROPERTIES.BTN_IMPORT_FROM_CSV</ion-label>\n  </button>\n\n  <!-- import policy -->\n  <mat-divider></mat-divider>\n  <button mat-menu-item [matMenuTriggerFor]=\"importPolicyMenu\">\n    <ion-label translate>FILE.UPLOAD.BTN_IMPORT_POLICY_DOTS</ion-label>\n  </button>\n</mat-menu>\n\n<!-- Import policy menu -->\n<mat-menu #importPolicyMenu=\"matMenu\" class=\"ion-no-padding\">\n  <ng-template matMenuContent>\n    <!-- header-->\n    <ion-row class=\"mat-menu-header ion-no-padding column\">\n      <ion-col>\n        <ion-label translate>FILE.UPLOAD.IMPORT_POLICY.TITLE</ion-label>\n      </ion-col>\n    </ion-row>\n    @for (policy of _importPolicies; track policy) {\n      <button mat-menu-item (click)=\"importPolicy = policy\">\n        <mat-icon>{{ importPolicy === policy ? 'check_box' : 'check_box_outline_blank' }}</mat-icon>\n        <ion-label>{{ 'FILE.UPLOAD.IMPORT_POLICY.' + policy | uppercase | translate }}</ion-label>\n      </button>\n    }\n  </ng-template>\n</mat-menu>\n\n<!-- Properties -->\n<form [formGroup]=\"form\" class=\"form-container\">\n  @if (loadingSubject | async) {\n    <ion-list [inset]=\"mobile\">\n      <ng-container *ngTemplateOutlet=\"propertyRowSkeleton\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"propertyRowSkeleton\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"propertyRowSkeleton\"></ng-container>\n    </ion-list>\n  } @else {\n    <ion-list formArrayName=\"properties\" [inset]=\"mobile\">\n      <!-- Show more options -->\n      @if ((_definitionKeys$ | async | isNotEmptyArray) && formArray?.length === 0) {\n        <ion-item lines=\"none\">\n          <ion-button\n            color=\"light\"\n            [title]=\"!showTooltip ? (addButtonTitle | translate) : ''\"\n            [matTooltip]=\"showTooltip ? (addButtonTitle | translate) : ''\"\n            (click)=\"_helper.add()\"\n          >\n            <ion-label>{{ addButtonText | translate }}</ion-label>\n            <mat-icon slot=\"end\">arrow_drop_down</mat-icon>\n          </ion-button>\n        </ion-item>\n      }\n\n      @for (fieldForm of fieldForms; track i; let i = $index) {\n        <ion-item lines=\"none\" [class.outline]=\"appearance === 'outline'\">\n          <ion-grid class=\"ion-no-padding\">\n            <ion-row [formGroupName]=\"i\" class=\"ion-no-padding\">\n              @let definition = getDefinitionAt(i);\n\n              <!-- property key -->\n              @if (fieldForm | formGetControl: 'key'; as control) {\n                <ion-col\n                  size=\"12\"\n                  size-sm=\"6\"\n                  [title]=\"!showTooltip ? ((definition | propertyGet: 'label' | translate) || '') : ''\"\n                  [matTooltip]=\"showTooltip ? ((definition | propertyGet: 'label' | translate) || '') : ''\"\n                  class=\"ion-no-padding\"\n                >\n                  <mat-autocomplete-field\n                    floatLabel=\"auto\"\n                    [formControl]=\"control\"\n                    [appearance]=\"appearance\"\n                    [subscriptSizing]=\"showHintKey ? 'fixed' : subscriptSizing\"\n                    (selectionChange)=\"updateDefinitionAt(i)\"\n                    [tabindex]=\"tabindex + i * 2\"\n                    [config]=\"_autocompleteConfig\"\n                    [placeholder]=\"'SETTINGS.PROPERTY_KEY' | translate\"\n                    [required]=\"true\"\n                    (focus)=\"_focusedControlIndex = i\"\n                    [readonly]=\"definition?.disabled\"\n                    [mobile]=\"mobile\"\n                    [panelClass]=\"panelClass\"\n                    [panelWidth]=\"panelWidth\"\n                  >\n                    <mat-hint [class.cdk-visually-hidden]=\"!showHintKey\">\n                      @let keyValue = control.value;\n                      {{ hintKeyPrefix || '' }}{{ keyValue?.key || keyValue || '' }}\n                    </mat-hint>\n                  </mat-autocomplete-field>\n                </ion-col>\n              }\n\n              <!-- property value -->\n              <ion-col size=\"\" size-sm=\"\" class=\"ion-no-padding ion-padding-start-xs\">\n                @if (definition) {\n                  <app-form-field\n                    floatLabel=\"auto\"\n                    [label]=\"mobile ? ('SETTINGS.PROPERTY_VALUE' | translate) : ' '\"\n                    [appearance]=\"appearance\"\n                    [subscriptSizing]=\"subscriptSizing\"\n                    [definition]=\"definition\"\n                    [formControl]=\"fieldForm | formGetControl: 'value'\"\n                    [placeholder]=\"'SETTINGS.PROPERTY_VALUE' | translate\"\n                    [chipColor]=\"chipColor\"\n                    [required]=\"true\"\n                    [hideRequiredMarker]=\"true\"\n                    [tabindex]=\"tabindex + i * 2 + 1\"\n                    [readonly]=\"definition?.disabled\"\n                    [panelClass]=\"panelClass\"\n                    [panelWidth]=\"panelWidth\"\n                  ></app-form-field>\n                } @else {\n                  <!-- unknown definition -->\n                  <mat-form-field [appearance]=\"appearance\" [subscriptSizing]=\"subscriptSizing\">\n                    @if (mobile) {\n                      <mat-label>{{ 'SETTINGS.PROPERTY_VALUE' | translate }}</mat-label>\n                    }\n                    <input\n                      type=\"text\"\n                      matInput\n                      [formControl]=\"fieldForm | formGetControl: 'value'\"\n                      [placeholder]=\"mobile ? '' : ('SETTINGS.PROPERTY_VALUE' | translate)\"\n                      [required]=\"true\"\n                      [tabindex]=\"20 + i * 2 + 1\"\n                    />\n                  </mat-form-field>\n                }\n              </ion-col>\n\n              <ion-col size=\"auto\" class=\"ion-no-padding\">\n                @if (_helper.isLast(i)) {\n                  <button\n                    type=\"button\"\n                    mat-icon-button\n                    color=\"light\"\n                    [disabled]=\"\n                      disabled || (fieldForm.value | asBoolean: isEmptyProperty) || (_definitionKeys | isEmptyArray)\n                    \"\n                    [title]=\"!showTooltip ? ('SETTINGS.BTN_ADD_PROPERTY' | translate) : ''\"\n                    [matTooltip]=\"showTooltip ? ('SETTINGS.BTN_ADD_PROPERTY' | translate) : ''\"\n                    (click)=\"_helper.add()\"\n                    [tabindex]=\"20 + i * 2 + 2\"\n                  >\n                    <mat-icon>add</mat-icon>\n                  </button>\n                }\n                <button\n                  type=\"button\"\n                  mat-icon-button\n                  color=\"light\"\n                  [disabled]=\"definition?.disabled || disabled\"\n                  [title]=\"!showTooltip ? ('COMMON.BTN_DELETE' | translate) : ''\"\n                  [matTooltip]=\"showTooltip ? ('COMMON.BTN_DELETE' | translate) : ''\"\n                  (click)=\"removeAt(i)\"\n                  [tabindex]=\"-1\"\n                >\n                  <mat-icon>close</mat-icon>\n                </button>\n              </ion-col>\n            </ion-row>\n          </ion-grid>\n        </ion-item>\n      }\n    </ion-list>\n  }\n</form>\n\n<ng-template #propertyRowSkeleton>\n  <ion-item lines=\"none\">\n    <ion-grid class=\"ion-no-padding\">\n      <ion-row class=\"ion-no-padding\">\n        <!-- property key -->\n        <ion-col size=\"6\" class=\"ion-no-padding\">\n          <mat-form-field [subscriptSizing]=\"subscriptSizing\">\n            <input matInput hidden disabled />\n            <ion-skeleton-text [animated]=\"true\" style=\"width: 60%\"></ion-skeleton-text>\n            <ion-icon name=\"arrow-dropdown\" matSuffix></ion-icon>\n          </mat-form-field>\n        </ion-col>\n        <!-- value -->\n        <ion-col class=\"ion-no-padding\">\n          <mat-form-field [subscriptSizing]=\"subscriptSizing\">\n            <input matInput hidden disabled />\n            <ion-skeleton-text [animated]=\"true\" style=\"width: 60%\"></ion-skeleton-text>\n          </mat-form-field>\n        </ion-col>\n        <!-- buttons -->\n        <ion-col size=\"auto\">\n          <button type=\"button\" mat-icon-button color=\"light\" disabled>\n            <mat-icon>close</mat-icon>\n          </button>\n        </ion-col>\n      </ion-row>\n    </ion-grid>\n  </ion-item>\n</ng-template>\n", styles: [":host ion-item ion-row ion-col{--ion-padding-start: 0;min-width:48px}:host ion-item.outline{overflow:visible}:host ion-item.outline ion-grid,:host ion-item.outline ion-row,:host ion-item.outline ion-col{overflow:visible}\n"], dependencies: [{ kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.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: i5.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: i5.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i5.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i5.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: i5.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i5.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i5.IonRow, selector: "ion-row" }, { kind: "component", type: i5.IonSkeletonText, selector: "ion-skeleton-text", inputs: ["animated"] }, { kind: "component", type: i5.IonToggle, selector: "ion-toggle", inputs: ["alignment", "checked", "color", "disabled", "enableOnOffLabels", "justify", "labelPlacement", "legacy", "mode", "name", "value"] }, { kind: "directive", type: i5.BooleanValueAccessor, selector: "ion-checkbox,ion-toggle" }, { kind: "directive", type: i6.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7.MatLabel, selector: "mat-label" }, { kind: "directive", type: i7.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i7.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i8.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: i9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i11.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i12.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i12.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i12.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i12.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i13.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: i14.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i15.MatAutocompleteField, selector: "mat-autocomplete-field", inputs: ["equals", "logPrefix", "formControl", "formControlName", "floatLabel", "label", "appearance", "subscriptSizing", "placeholder", "suggestFn", "required", "hideRequiredMarker", "mobile", "clearable", "debounceTime", "displaySeparator", "displayWith", "displayAttributes", "displayColumnSizes", "displayColumnNames", "highlightAccent", "showAllOnFocus", "showPanelOnFocus", "reloadItemsOnFocus", "clearInvalidValueOnBlur", "autofocus", "config", "i18nPrefix", "noResultMessage", "panelClass", "panelWidth", "disableRipple", "matAutocompletePosition", "multiple", "fetchMoreThreshold", "suggestLengthThreshold", "showLoadingSpinner", "debug", "showSearchBar", "stickySearchBar", "applyImplicitValue", "dropButtonTitle", "clearButtonTitle", "trimSearchText", "splitSearchText", "selectInputContentOnFocus", "selectInputContentOnFocusDelay", "previewImplicitValue", "showFavorites", "toggleFavoriteTitle", "favoriteItems", "colSizes", "class", "filter", "readonly", "tabindex", "items"], outputs: ["click", "blur", "focus", "dropButtonClick", "keydown.escape", "keydown.backspace", "keyup.enter", "arrowUp", "arrowDown", "enter", "selectionChange", "openedChange", "toggleFavorite"] }, { kind: "component", type: i16.AppFormField, selector: "app-form-field", inputs: ["definition", "readonly", "disabled", "formControl", "formControlName", "placeholder", "compact", "required", "hideRequiredMarker", "floatLabel", "label", "appearance", "subscriptSizing", "tabindex", "autofocus", "clearable", "chipColor", "class", "debug", "panelClass", "panelWidth"], outputs: ["keyup.enter"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i6.TranslatePipe, name: "translate" }, { kind: "pipe", type: i17.PropertyGetPipe, name: "propertyGet" }, { kind: "pipe", type: i18.NotEmptyArrayPipe, name: "isNotEmptyArray" }, { kind: "pipe", type: i18.EmptyArrayPipe, name: "isEmptyArray" }, { kind: "pipe", type: i19.FormGetControlPipe, name: "formGetControl" }, { kind: "pipe", type: i20.AsBooleanPipe, name: "asBoolean" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppPropertiesForm, deps: [{ token: i0.Injector }, { token: i1.UntypedFormBuilder }, { token: i2.DateAdapter }, { token: i0.ChangeDetectorRef }, { token: i3.PropertyValidator }, { token: i1.FormGroupDirective, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AppPropertiesForm, selector: "app-properties-form", inputs: { showToolbar: ["showToolbar", "showToolbar", booleanAttribute], formArrayName: "formArrayName", formArray: "formArray", options: "options", chipColor: "chipColor", mobile: ["mobile", "mobile", booleanAttribute], appearance: "appearance", subscriptSizing: "subscriptSizing", showHintKey: ["showHintKey", "showHintKey", booleanAttribute], hintKeyPrefix: "hintKeyPrefix", showMoreButton: ["showMoreButton", "showMoreButton", booleanAttribute], addButtonText: "addButtonText", addButtonTitle: "addButtonTitle", showAddButton: ["showAddButton", "showAddButton", booleanAttribute], panelClass: "panelClass", panelWidth: "panelWidth", canDownload: ["canDownload", "canDownload", booleanAttribute], canImport: ["canImport", "canImport", booleanAttribute], showMoreButtonTitle: "showMoreButtonTitle", definitions: "definitions", importPolicy: "importPolicy" }, providers: [{ provide: PropertyValidator, useClass: PropertyValidator }, RxState], usesInheritance: true, ngImport: i0, template: "@if (showToolbar) {\n  <mat-toolbar>\n    <div class=\"toolbar-spacer\"></div>\n\n    <ion-item lines=\"none\" (click)=\"toggleShowHintKeys()\">\n      <ion-label color=\"dark\">{{ 'FILE.PROPERTIES.BTN_SHOW_HINT_KEY' | translate }}</ion-label>\n      <ion-toggle color=\"primary\" [checked]=\"showHintKey\"></ion-toggle>\n    </ion-item>\n\n    <!-- options sub menu -->\n    @if (canDownload || canImport) {\n      <button\n        slot=\"end\"\n        mat-icon-button\n        [matMenuTriggerFor]=\"optionsMenu\"\n        [title]=\"!showTooltip ? ('COMMON.BTN_OPTIONS' | translate) : ''\"\n        [matTooltip]=\"showTooltip ? ('COMMON.BTN_OPTIONS' | translate) : ''\"\n      >\n        <mat-icon>more_vert</mat-icon>\n      </button>\n    }\n  </mat-toolbar>\n}\n\n<!-- Options menu -->\n<mat-menu #optionsMenu=\"matMenu\">\n  <!-- Download as CSV -->\n  @if (canDownload) {\n    <button mat-menu-item [disabled]=\"loading\" [matMenuTriggerFor]=\"downloadMenu\">\n      <mat-icon>download</mat-icon>\n      <ion-label translate>COMMON.BTN_DOWNLOAD_DOTS</ion-label>\n    </button>\n  }\n\n  <!-- Import from file -->\n  @if (canImport) {\n    <button mat-menu-item [disabled]=\"loading || disabled\" [matMenuTriggerFor]=\"importMenu\">\n      <mat-icon>upload</mat-icon>\n      <ion-label translate>COMMON.BTN_IMPORT_FROM_FILE_DOTS</ion-label>\n    </button>\n  }\n</mat-menu>\n\n<!-- Download menu -->\n<mat-menu #downloadMenu=\"matMenu\">\n  <button mat-menu-item [disabled]=\"loading\" (click)=\"exportToCsv()\">\n    <ion-label translate>FILE.PROPERTIES.BTN_DOWNLOAD_AS_CSV</ion-label>\n  </button>\n</mat-menu>\n\n<!-- Import menu -->\n<mat-menu #importMenu=\"matMenu\">\n  <!-- import from file -->\n  <button mat-menu-item (click)=\"importFromCsv($event)\">\n    <ion-label translate>FILE.PROPERTIES.BTN_IMPORT_FROM_CSV</ion-label>\n  </button>\n\n  <!-- import policy -->\n  <mat-divider></mat-divider>\n  <button mat-menu-item [matMenuTriggerFor]=\"importPolicyMenu\">\n    <ion-label translate>FILE.UPLOAD.BTN_IMPORT_POLICY_DOTS</ion-label>\n  </button>\n</mat-menu>\n\n<!-- Import policy menu -->\n<mat-menu #importPolicyMenu=\"matMenu\" class=\"ion-no-padding\">\n  <ng-template matMenuContent>\n    <!-- header-->\n    <ion-row class=\"mat-menu-header ion-no-padding column\">\n      <ion-col>\n        <ion-label translate>FILE.UPLOAD.IMPORT_POLICY.TITLE</ion-label>\n      </ion-col>\n    </ion-row>\n    @for (policy of _importPolicies; track policy) {\n      <button mat-menu-item (click)=\"importPolicy = policy\">\n        <mat-icon>{{ importPolicy === policy ? 'check_box' : 'check_box_outline_blank' }}</mat-icon>\n        <ion-label>{{ 'FILE.UPLOAD.IMPORT_POLICY.' + policy | uppercase | translate }}</ion-label>\n      </button>\n    }\n  </ng-template>\n</mat-menu>\n\n<!-- Properties -->\n<form [formGroup]=\"form\" class=\"form-container\">\n  @if (loadingSubject | async) {\n    <ion-list [inset]=\"mobile\">\n      <ng-container *ngTemplateOutlet=\"propertyRowSkeleton\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"propertyRowSkeleton\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"propertyRowSkeleton\"></ng-container>\n    </ion-list>\n  } @else {\n    <ion-list formArrayName=\"properties\" [inset]=\"mobile\">\n      <!-- Show more options -->\n      @if ((_definitionKeys$ | async | isNotEmptyArray) && formArray?.length === 0) {\n        <ion-item lines=\"none\">\n          <ion-button\n            color=\"light\"\n            [title]=\"!showTooltip ? (addButtonTitle | translate) : ''\"\n            [matTooltip]=\"showTooltip ? (addButtonTitle | translate) : ''\"\n            (click)=\"_helper.add()\"\n          >\n            <ion-label>{{ addButtonText | translate }}</ion-label>\n            <mat-icon slot=\"end\">arrow_drop_down</mat-icon>\n          </ion-button>\n        </ion-item>\n      }\n\n      @for (fieldForm of fieldForms; track i; let i = $index) {\n        <ion-item lines=\"none\" [class.outline]=\"appearance === 'outline'\">\n          <ion-grid class=\"ion-no-padding\">\n            <ion-row [formGroupName]=\"i\" class=\"ion-no-padding\">\n              @let definition = getDefinitionAt(i);\n\n              <!-- property key -->\n              @if (fieldForm | formGetControl: 'key'; as control) {\n                <ion-col\n                  size=\"12\"\n                  size-sm=\"6\"\n                  [title]=\"!showTooltip ? ((definition | propertyGet: 'label' | translate) || '') : ''\"\n                  [matTooltip]=\"showTooltip ? ((definition | propertyGet: 'label' | translate) || '') : ''\"\n                  class=\"ion-no-padding\"\n                >\n                  <mat-autocomplete-field\n                    floatLabel=\"auto\"\n                    [formControl]=\"control\"\n                    [appearance]=\"appearance\"\n                    [subscriptSizing]=\"showHintKey ? 'fixed' : subscriptSizing\"\n                    (selectionChange)=\"updateDefinitionAt(i)\"\n                    [tabindex]=\"tabindex + i * 2\"\n                    [config]=\"_autocompleteConfig\"\n                    [placeholder]=\"'SETTINGS.PROPERTY_KEY' | translate\"\n                    [required]=\"true\"\n                    (focus)=\"_focusedControlIndex = i\"\n                    [readonly]=\"definition?.disabled\"\n                    [mobile]=\"mobile\"\n                    [panelClass]=\"panelClass\"\n                    [panelWidth]=\"panelWidth\"\n                  >\n                    <mat-hint [class.cdk-visually-hidden]=\"!showHintKey\">\n                      @let keyValue = control.value;\n                      {{ hintKeyPrefix || '' }}{{ keyValue?.key || keyValue || '' }}\n                    </mat-hint>\n                  </mat-autocomplete-field>\n                </ion-col>\n              }\n\n              <!-- property value -->\n              <ion-col size=\"\" size-sm=\"\" class=\"ion-no-padding ion-padding-start-xs\">\n                @if (definition) {\n                  <app-form-field\n                    floatLabel=\"auto\"\n                    [label]=\"mobile ? ('SETTINGS.PROPERTY_VALUE' | translate) : ' '\"\n                    [appearance]=\"appearance\"\n                    [subscriptSizing]=\"subscriptSizing\"\n                    [definition]=\"definition\"\n                    [formControl]=\"fieldForm | formGetControl: 'value'\"\n                    [placeholder]=\"'SETTINGS.PROPERTY_VALUE' | translate\"\n                    [chipColor]=\"chipColor\"\n                    [required]=\"true\"\n                    [hideRequiredMarker]=\"true\"\n                    [tabindex]=\"tabindex + i * 2 + 1\"\n                    [readonly]=\"definition?.disabled\"\n                    [panelClass]=\"panelClass\"\n                    [panelWidth]=\"panelWidth\"\n                  ></app-form-field>\n                } @else {\n                  <!-- unknown definition -->\n                  <mat-form-field [appearance]=\"appearance\" [subscriptSizing]=\"subscriptSizing\">\n                    @if (mobile) {\n                      <mat-label>{{ 'SETTINGS.PROPERTY_VALUE' | translate }}</mat-label>\n                    }\n                    <input\n                      type=\"text\"\n                      matInput\n                      [formControl]=\"fieldForm | formGetControl: 'value'\"\n                      [placeholder]=\"mobile ? '' : ('SETTINGS.PROPERTY_VALUE' | translate)\"\n                      [required]=\"true\"\n                      [tabindex]=\"20 + i * 2 + 1\"\n                    />\n                  </mat-form-field>\n                }\n              </ion-col>\n\n              <ion-col size=\"auto\" class=\"ion-no-padding\">\n                @if (_helper.isLast(i)) {\n                  <button\n                    type=\"button\"\n                    mat-icon-button\n                    color=\"light\"\n                    [disabled]=\"\n                      disabled || (fieldForm.value | asBoolean: isEmptyProperty) || (_definitionKeys | isEmptyArray)\n                    \"\n                    [title]=\"!showTooltip ? ('SETTINGS.BTN_ADD_PROPERTY' | translate) : ''\"\n                    [matTooltip]=\"showTooltip ? ('SETTINGS.BTN_ADD_PROPERTY' | translate) : ''\"\n                    (click)=\"_helper.add()\"\n                    [tabindex]=\"20 + i * 2 + 2\"\n                  >\n                    <mat-icon>add</mat-icon>\n                  </button>\n                }\n                <button\n                  type=\"button\"\n                  mat-icon-button\n                  color=\"light\"\n                  [disabled]=\"definition?.disabled || disabled\"\n                  [title]=\"!showTooltip ? ('COMMON.BTN_DELETE' | translate) : ''\"\n                  [matTooltip]=\"showTooltip ? ('COMMON.BTN_DELETE' | translate) : ''\"\n                  (click)=\"removeAt(i)\"\n                  [tabindex]=\"-1\"\n                >\n                  <mat-icon>close</mat-icon>\n                </button>\n              </ion-col>\n            </ion-row>\n          </ion-grid>\n        </ion-item>\n      }\n    </ion-list>\n  }\n</form>\n\n<ng-template #propertyRowSkeleton>\n  <ion-item lines=\"none\">\n    <ion-grid class=\"ion-no-padding\">\n      <ion-row class=\"ion-no-padding\">\n        <!-- property key -->\n        <ion-col size=\"6\" class=\"ion-no-padding\">\n          <mat-form-field [subscriptSizing]=\"subscriptSizing\">\n            <input matInput hidden disabled />\n            <ion-skeleton-text [animated]=\"true\" style=\"width: 60%\"></ion-skeleton-text>\n            <ion-icon name=\"arrow-dropdown\" matSuffix></ion-icon>\n          </mat-form-field>\n        </ion-col>\n        <!-- value -->\n        <ion-col class=\"ion-no-padding\">\n          <mat-form-field [subscriptSizing]=\"subscriptSizing\">\n            <input matInput hidden disabled />\n            <ion-skeleton-text [animated]=\"true\" style=\"width: 60%\"></ion-skeleton-text>\n          </mat-form-field>\n        </ion-col>\n        <!-- buttons -->\n        <ion-col size=\"auto\">\n          <button type=\"button\" mat-icon-button color=\"light\" disabled>\n            <mat-icon>close</mat-icon>\n          </button>\n        </ion-col>\n      </ion-row>\n    </ion-grid>\n  </ion-item>\n</ng-template>\n", styles: [":host ion-item ion-row ion-col{--ion-padding-start: 0;min-width:48px}:host ion-item.outline{overflow:visible}:host ion-item.outline ion-grid,:host ion-item.outline ion-row,:host ion-item.outline ion-col{overflow:visible}\n"], dependencies: [{ kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.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: i5.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: i5.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i5.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i5.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: i5.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i5.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i5.IonRow, selector: "ion-row" }, { kind: "component", type: i5.IonSkeletonText, selector: "ion-skeleton-text", inputs: ["animated"] }, { kind: "component", type: i5.IonToggle, selector: "ion-toggle", inputs: ["alignment", "checked", "color", "disabled", "enableOnOffLabels", "justify", "labelPlacement", "legacy", "mode", "name", "value"] }, { kind: "directive", type: i5.BooleanValueAccessor, selector: "ion-checkbox,ion-toggle" }, { kind: "directive", type: i6.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7.MatLabel, selector: "mat-label" }, { kind: "directive", type: i7.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i7.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i8.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: i9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i11.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i12.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i12.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i12.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i12.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i13.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: i14.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i15.MatAutocompleteField, selector: "mat-autocomplete-field", inputs: ["equals", "logPrefix", "formControl", "formControlName", "floatLabel", "label", "appearance", "subscriptSizing", "placeholder", "suggestFn", "required", "hideRequiredMarker", "mobile", "clearable", "debounceTime", "displaySeparator", "displayWith", "displayAttributes", "displayColumnSizes", "displayColumnNames", "highlightAccent", "showAllOnFocus", "showPanelOnFocus", "reloadItemsOnFocus", "clearInvalidValueOnBlur", "autofocus", "config", "i18nPrefix", "noResultMessage", "panelClass", "panelWidth", "disableRipple", "matAutocompletePosition", "multiple", "fetchMoreThreshold", "suggestLengthThreshold", "showLoadingSpinner", "debug", "showSearchBar", "stickySearchBar", "applyImplicitValue", "dropButtonTitle", "clearButtonTitle", "trimSearchText", "splitSearchText", "selectInputContentOnFocus", "selectInputContentOnFocusDelay", "previewImplicitValue", "showFavorites", "toggleFavoriteTitle", "favoriteItems", "colSizes", "class", "filter", "readonly", "tabindex", "items"], outputs: ["click", "blur", "focus", "dropButtonClick", "keydown.escape", "keydown.backspace", "keyup.enter", "arrowUp", "arrowDown", "enter", "selectionChange", "openedChange", "toggleFavorite"] }, { kind: "component", type: i16.AppFormField, selector: "app-form-field", inputs: ["definition", "readonly", "disabled", "formControl", "formControlName", "placeholder", "compact", "required", "hideRequiredMarker", "floatLabel", "label", "appearance", "subscriptSizing", "tabindex", "autofocus", "clearable", "chipColor", "class", "debug", "panelClass", "panelWidth"], outputs: ["keyup.enter"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i6.TranslatePipe, name: "translate" }, { kind: "pipe", type: i17.PropertyGetPipe, name: "propertyGet" }, { kind: "pipe", type: i18.NotEmptyArrayPipe, name: "isNotEmptyArray" }, { kind: "pipe", type: i18.EmptyArrayPipe, name: "isEmptyArray" }, { kind: "pipe", type: i19.FormGetControlPipe, name: "formGetControl" }, { kind: "pipe", type: i20.AsBooleanPipe, name: "asBoolean" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppPropertiesForm, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppPropertiesForm, decorators: [{
             type: Component,
             args: [{ selector: 'app-properties-form', providers: [{ provide: PropertyValidator, useClass: PropertyValidator }, RxState], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (showToolbar) {\n  <mat-toolbar>\n    <div class=\"toolbar-spacer\"></div>\n\n    <ion-item lines=\"none\" (click)=\"toggleShowHintKeys()\">\n      <ion-label color=\"dark\">{{ 'FILE.PROPERTIES.BTN_SHOW_HINT_KEY' | translate }}</ion-label>\n      <ion-toggle color=\"primary\" [checked]=\"showHintKey\"></ion-toggle>\n    </ion-item>\n\n    <!-- options sub menu -->\n    @if (canDownload || canImport) {\n      <button\n        slot=\"end\"\n        mat-icon-button\n        [matMenuTriggerFor]=\"optionsMenu\"\n        [title]=\"!showTooltip ? ('COMMON.BTN_OPTIONS' | translate) : ''\"\n        [matTooltip]=\"showTooltip ? ('COMMON.BTN_OPTIONS' | translate) : ''\"\n      >\n        <mat-icon>more_vert</mat-icon>\n      </button>\n    }\n  </mat-toolbar>\n}\n\n<!-- Options menu -->\n<mat-menu #optionsMenu=\"matMenu\">\n  <!-- Download as CSV -->\n  @if (canDownload) {\n    <button mat-menu-item [disabled]=\"loading\" [matMenuTriggerFor]=\"downloadMenu\">\n      <mat-icon>download</mat-icon>\n      <ion-label translate>COMMON.BTN_DOWNLOAD_DOTS</ion-label>\n    </button>\n  }\n\n  <!-- Import from file -->\n  @if (canImport) {\n    <button mat-menu-item [disabled]=\"loading || disabled\" [matMenuTriggerFor]=\"importMenu\">\n      <mat-icon>upload</mat-icon>\n      <ion-label translate>COMMON.BTN_IMPORT_FROM_FILE_DOTS</ion-label>\n    </button>\n  }\n</mat-menu>\n\n<!-- Download menu -->\n<mat-menu #downloadMenu=\"matMenu\">\n  <button mat-menu-item [disabled]=\"loading\" (click)=\"exportToCsv()\">\n    <ion-label translate>FILE.PROPERTIES.BTN_DOWNLOAD_AS_CSV</ion-label>\n  </button>\n</mat-menu>\n\n<!-- Import menu -->\n<mat-menu #importMenu=\"matMenu\">\n  <!-- import from file -->\n  <button mat-menu-item (click)=\"importFromCsv($event)\">\n    <ion-label translate>FILE.PROPERTIES.BTN_IMPORT_FROM_CSV</ion-label>\n  </button>\n\n  <!-- import policy -->\n  <mat-divider></mat-divider>\n  <button mat-menu-item [matMenuTriggerFor]=\"importPolicyMenu\">\n    <ion-label translate>FILE.UPLOAD.BTN_IMPORT_POLICY_DOTS</ion-label>\n  </button>\n</mat-menu>\n\n<!-- Import policy menu -->\n<mat-menu #importPolicyMenu=\"matMenu\" class=\"ion-no-padding\">\n  <ng-template matMenuContent>\n    <!-- header-->\n    <ion-row class=\"mat-menu-header ion-no-padding column\">\n      <ion-col>\n        <ion-label translate>FILE.UPLOAD.IMPORT_POLICY.TITLE</ion-label>\n      </ion-col>\n    </ion-row>\n    @for (policy of _importPolicies; track policy) {\n      <button mat-menu-item (click)=\"importPolicy = policy\">\n        <mat-icon>{{ importPolicy === policy ? 'check_box' : 'check_box_outline_blank' }}</mat-icon>\n        <ion-label>{{ 'FILE.UPLOAD.IMPORT_POLICY.' + policy | uppercase | translate }}</ion-label>\n      </button>\n    }\n  </ng-template>\n</mat-menu>\n\n<!-- Properties -->\n<form [formGroup]=\"form\" class=\"form-container\">\n  @if (loadingSubject | async) {\n    <ion-list [inset]=\"mobile\">\n      <ng-container *ngTemplateOutlet=\"propertyRowSkeleton\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"propertyRowSkeleton\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"propertyRowSkeleton\"></ng-container>\n    </ion-list>\n  } @else {\n    <ion-list formArrayName=\"properties\" [inset]=\"mobile\">\n      <!-- Show more options -->\n      @if ((_definitionKeys$ | async | isNotEmptyArray) && formArray?.length === 0) {\n        <ion-item lines=\"none\">\n          <ion-button\n            color=\"light\"\n            [title]=\"!showTooltip ? (addButtonTitle | translate) : ''\"\n            [matTooltip]=\"showTooltip ? (addButtonTitle | translate) : ''\"\n            (click)=\"_helper.add()\"\n          >\n            <ion-label>{{ addButtonText | translate }}</ion-label>\n            <mat-icon slot=\"end\">arrow_drop_down</mat-icon>\n          </ion-button>\n        </ion-item>\n      }\n\n      @for (fieldForm of fieldForms; track i; let i = $index) {\n        <ion-item lines=\"none\" [class.outline]=\"appearance === 'outline'\">\n          <ion-grid class=\"ion-no-padding\">\n            <ion-row [formGroupName]=\"i\" class=\"ion-no-padding\">\n              @let definition = getDefinitionAt(i);\n\n              <!-- property key -->\n              @if (fieldForm | formGetControl: 'key'; as control) {\n                <ion-col\n                  size=\"12\"\n                  size-sm=\"6\"\n                  [title]=\"!showTooltip ? ((definition | propertyGet: 'label' | translate) || '') : ''\"\n                  [matTooltip]=\"showTooltip ? ((definition | propertyGet: 'label' | translate) || '') : ''\"\n                  class=\"ion-no-padding\"\n                >\n                  <mat-autocomplete-field\n                    floatLabel=\"auto\"\n                    [formControl]=\"control\"\n                    [appearance]=\"appearance\"\n                    [subscriptSizing]=\"showHintKey ? 'fixed' : subscriptSizing\"\n                    (selectionChange)=\"updateDefinitionAt(i)\"\n                    [tabindex]=\"tabindex + i * 2\"\n                    [config]=\"_autocompleteConfig\"\n                    [placeholder]=\"'SETTINGS.PROPERTY_KEY' | translate\"\n                    [required]=\"true\"\n                    (focus)=\"_focusedControlIndex = i\"\n                    [readonly]=\"definition?.disabled\"\n                    [mobile]=\"mobile\"\n                    [panelClass]=\"panelClass\"\n                    [panelWidth]=\"panelWidth\"\n                  >\n                    <mat-hint [class.cdk-visually-hidden]=\"!showHintKey\">\n                      @let keyValue = control.value;\n                      {{ hintKeyPrefix || '' }}{{ keyValue?.key || keyValue || '' }}\n                    </mat-hint>\n                  </mat-autocomplete-field>\n                </ion-col>\n              }\n\n              <!-- property value -->\n              <ion-col size=\"\" size-sm=\"\" class=\"ion-no-padding ion-padding-start-xs\">\n                @if (definition) {\n                  <app-form-field\n                    floatLabel=\"auto\"\n                    [label]=\"mobile ? ('SETTINGS.PROPERTY_VALUE' | translate) : ' '\"\n                    [appearance]=\"appearance\"\n                    [subscriptSizing]=\"subscriptSizing\"\n                    [definition]=\"definition\"\n                    [formControl]=\"fieldForm | formGetControl: 'value'\"\n                    [placeholder]=\"'SETTINGS.PROPERTY_VALUE' | translate\"\n                    [chipColor]=\"chipColor\"\n                    [required]=\"true\"\n                    [hideRequiredMarker]=\"true\"\n                    [tabindex]=\"tabindex + i * 2 + 1\"\n                    [readonly]=\"definition?.disabled\"\n                    [panelClass]=\"panelClass\"\n                    [panelWidth]=\"panelWidth\"\n                  ></app-form-field>\n                } @else {\n                  <!-- unknown definition -->\n                  <mat-form-field [appearance]=\"appearance\" [subscriptSizing]=\"subscriptSizing\">\n                    @if (mobile) {\n                      <mat-label>{{ 'SETTINGS.PROPERTY_VALUE' | translate }}</mat-label>\n                    }\n                    <input\n                      type=\"text\"\n                      matInput\n                      [formControl]=\"fieldForm | formGetControl: 'value'\"\n                      [placeholder]=\"mobile ? '' : ('SETTINGS.PROPERTY_VALUE' | translate)\"\n                      [required]=\"true\"\n                      [tabindex]=\"20 + i * 2 + 1\"\n                    />\n                  </mat-form-field>\n                }\n              </ion-col>\n\n              <ion-col size=\"auto\" class=\"ion-no-padding\">\n                @if (_helper.isLast(i)) {\n                  <button\n                    type=\"button\"\n                    mat-icon-button\n                    color=\"light\"\n                    [disabled]=\"\n                      disabled || (fieldForm.value | asBoolean: isEmptyProperty) || (_definitionKeys | isEmptyArray)\n                    \"\n                    [title]=\"!showTooltip ? ('SETTINGS.BTN_ADD_PROPERTY' | translate) : ''\"\n                    [matTooltip]=\"showTooltip ? ('SETTINGS.BTN_ADD_PROPERTY' | translate) : ''\"\n                    (click)=\"_helper.add()\"\n                    [tabindex]=\"20 + i * 2 + 2\"\n                  >\n                    <mat-icon>add</mat-icon>\n                  </button>\n                }\n                <button\n                  type=\"button\"\n                  mat-icon-button\n                  color=\"light\"\n                  [disabled]=\"definition?.disabled || disabled\"\n                  [title]=\"!showTooltip ? ('COMMON.BTN_DELETE' | translate) : ''\"\n                  [matTooltip]=\"showTooltip ? ('COMMON.BTN_DELETE' | translate) : ''\"\n                  (click)=\"removeAt(i)\"\n                  [tabindex]=\"-1\"\n                >\n                  <mat-icon>close</mat-icon>\n                </button>\n              </ion-col>\n            </ion-row>\n          </ion-grid>\n        </ion-item>\n      }\n    </ion-list>\n  }\n</form>\n\n<ng-template #propertyRowSkeleton>\n  <ion-item lines=\"none\">\n    <ion-grid class=\"ion-no-padding\">\n      <ion-row class=\"ion-no-padding\">\n        <!-- property key -->\n        <ion-col size=\"6\" class=\"ion-no-padding\">\n          <mat-form-field [subscriptSizing]=\"subscriptSizing\">\n            <input matInput hidden disabled />\n            <ion-skeleton-text [animated]=\"true\" style=\"width: 60%\"></ion-skeleton-text>\n            <ion-icon name=\"arrow-dropdown\" matSuffix></ion-icon>\n          </mat-form-field>\n        </ion-col>\n        <!-- value -->\n        <ion-col class=\"ion-no-padding\">\n          <mat-form-field [subscriptSizing]=\"subscriptSizing\">\n            <input matInput hidden disabled />\n            <ion-skeleton-text [animated]=\"true\" style=\"width: 60%\"></ion-skeleton-text>\n          </mat-form-field>\n        </ion-col>\n        <!-- buttons -->\n        <ion-col size=\"auto\">\n          <button type=\"button\" mat-icon-button color=\"light\" disabled>\n            <mat-icon>close</mat-icon>\n          </button>\n        </ion-col>\n      </ion-row>\n    </ion-grid>\n  </ion-item>\n</ng-template>\n", styles: [":host ion-item ion-row ion-col{--ion-padding-start: 0;min-width:48px}:host ion-item.outline{overflow:visible}:host ion-item.outline ion-grid,:host ion-item.outline ion-row,:host ion-item.outline ion-col{overflow:visible}\n"] }]
         }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.UntypedFormBuilder }, { type: i2.DateAdapter }, { type: i0.ChangeDetectorRef }, { type: i3.PropertyValidator }, { type: i1.FormGroupDirective, decorators: [{