@igo2/common 16.2.0 → 16.3.0

package/fesm2022/igo2-common.mjs

@@ -229,11 +229,11 @@ class ActionbarItemComponent {
         this.icon$.next(icon);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionbarItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ActionbarItemComponent, selector: "igo-actionbar-item", inputs: { action: "action", color: "color", withTitle: "withTitle", withIcon: "withIcon", withTooltip: "withTooltip", disabled: "disabled", noDisplay: "noDisplay" }, outputs: { trigger: "trigger" }, ngImport: i0, template: "<mat-list-item\n  *ngIf=\"!action.checkbox\"\n  class=\"actionbar-item\"\n  matTooltipClass=\"actionbarItemTooltip\"\n  matTooltipShowDelay=\"500\"\n  [matTooltip]=\"withTooltip ? ((tooltip$ | async) || title | translate) : ''\"\n  [ngClass]=\"ngClass$ | async\"\n  (click)=\"onClick()\"\n>\n  <button\n    *ngIf=\"withIcon\"\n    matListItemAvatar\n    mat-icon-button\n    [color]=\"color\"\n    [disabled]=\"disabled$ | async\"\n    [disableRipple]=\"true\"\n  >\n    <mat-icon *ngIf=\"withIcon\" svgIcon=\"{{ icon$ | async }}\"></mat-icon>\n  </button>\n  <span *ngIf=\"withTitle\" matLine>{{ title | translate }}</span>\n</mat-list-item>\n\n<mat-list-item\n  class=\"item-checkbox\"\n  *ngIf=\"action.checkbox\"\n  matTooltipClass=\"actionbarItemTooltip\"\n  matTooltipShowDelay=\"500\"\n  [matTooltip]=\"withTooltip ? ((tooltip$ | async) || title | translate) : ''\"\n  [ngClass]=\"ngClass$ | async\"\n>\n  <mat-checkbox\n    *ngIf=\"withTitle\"\n    (change)=\"action.handler()\"\n    [checked]=\"checkCondition$ | async\"\n  >\n    {{ title | translate }}\n  </mat-checkbox>\n</mat-list-item>\n", styles: [":host ::ng-deep mat-list-item:hover{cursor:pointer}:host mat-list-item.igo-actionbar-item-disabled{color:#00000042;cursor:default!important}:host mat-list-item.igo-actionbar-item-no-display{display:none}:host mat-list-item ::ng-deep button[matlistitemavatar]{margin-left:4px}:host mat-list-item ::ng-deep button .mat-mdc-button-persistent-ripple{display:none}:host .item-checkbox ::ng-deep mat-checkbox label{margin-left:28px}:host .actionbar-item [matline]{padding-left:16px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i2$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i2$1.MatListItemAvatar, selector: "[matListItemAvatar]" }, { kind: "component", type: i6$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ActionbarItemComponent, selector: "igo-actionbar-item", inputs: { action: "action", color: "color", withTitle: "withTitle", withIcon: "withIcon", withTooltip: "withTooltip", disabled: "disabled", noDisplay: "noDisplay" }, outputs: { trigger: "trigger" }, ngImport: i0, template: "<mat-list-item\r\n  *ngIf=\"!action.checkbox\"\r\n  class=\"actionbar-item\"\r\n  matTooltipClass=\"actionbarItemTooltip\"\r\n  matTooltipShowDelay=\"500\"\r\n  [matTooltip]=\"withTooltip ? ((tooltip$ | async) || title | translate) : ''\"\r\n  [ngClass]=\"ngClass$ | async\"\r\n  (click)=\"onClick()\"\r\n>\r\n  <button\r\n    *ngIf=\"withIcon\"\r\n    matListItemAvatar\r\n    mat-icon-button\r\n    [color]=\"color\"\r\n    [disabled]=\"disabled$ | async\"\r\n    [disableRipple]=\"true\"\r\n  >\r\n    <mat-icon *ngIf=\"withIcon\" svgIcon=\"{{ icon$ | async }}\"></mat-icon>\r\n  </button>\r\n  <span *ngIf=\"withTitle\" matLine>{{ title | translate }}</span>\r\n</mat-list-item>\r\n\r\n<mat-list-item\r\n  class=\"item-checkbox\"\r\n  *ngIf=\"action.checkbox\"\r\n  matTooltipClass=\"actionbarItemTooltip\"\r\n  matTooltipShowDelay=\"500\"\r\n  [matTooltip]=\"withTooltip ? ((tooltip$ | async) || title | translate) : ''\"\r\n  [ngClass]=\"ngClass$ | async\"\r\n>\r\n  <mat-checkbox\r\n    *ngIf=\"withTitle\"\r\n    (change)=\"action.handler()\"\r\n    [checked]=\"checkCondition$ | async\"\r\n  >\r\n    {{ title | translate }}\r\n  </mat-checkbox>\r\n</mat-list-item>\r\n", styles: [":host ::ng-deep mat-list-item:hover{cursor:pointer}:host mat-list-item.igo-actionbar-item-disabled{color:#00000042;cursor:default!important}:host mat-list-item.igo-actionbar-item-no-display{display:none}:host mat-list-item ::ng-deep button[matlistitemavatar]{margin-left:4px}:host mat-list-item ::ng-deep button .mat-mdc-button-persistent-ripple{display:none}:host .item-checkbox ::ng-deep mat-checkbox label{margin-left:28px}:host .actionbar-item [matline]{padding-left:16px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i2$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i2$1.MatListItemAvatar, selector: "[matListItemAvatar]" }, { kind: "component", type: i6$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionbarItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-actionbar-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-list-item\n  *ngIf=\"!action.checkbox\"\n  class=\"actionbar-item\"\n  matTooltipClass=\"actionbarItemTooltip\"\n  matTooltipShowDelay=\"500\"\n  [matTooltip]=\"withTooltip ? ((tooltip$ | async) || title | translate) : ''\"\n  [ngClass]=\"ngClass$ | async\"\n  (click)=\"onClick()\"\n>\n  <button\n    *ngIf=\"withIcon\"\n    matListItemAvatar\n    mat-icon-button\n    [color]=\"color\"\n    [disabled]=\"disabled$ | async\"\n    [disableRipple]=\"true\"\n  >\n    <mat-icon *ngIf=\"withIcon\" svgIcon=\"{{ icon$ | async }}\"></mat-icon>\n  </button>\n  <span *ngIf=\"withTitle\" matLine>{{ title | translate }}</span>\n</mat-list-item>\n\n<mat-list-item\n  class=\"item-checkbox\"\n  *ngIf=\"action.checkbox\"\n  matTooltipClass=\"actionbarItemTooltip\"\n  matTooltipShowDelay=\"500\"\n  [matTooltip]=\"withTooltip ? ((tooltip$ | async) || title | translate) : ''\"\n  [ngClass]=\"ngClass$ | async\"\n>\n  <mat-checkbox\n    *ngIf=\"withTitle\"\n    (change)=\"action.handler()\"\n    [checked]=\"checkCondition$ | async\"\n  >\n    {{ title | translate }}\n  </mat-checkbox>\n</mat-list-item>\n", styles: [":host ::ng-deep mat-list-item:hover{cursor:pointer}:host mat-list-item.igo-actionbar-item-disabled{color:#00000042;cursor:default!important}:host mat-list-item.igo-actionbar-item-no-display{display:none}:host mat-list-item ::ng-deep button[matlistitemavatar]{margin-left:4px}:host mat-list-item ::ng-deep button .mat-mdc-button-persistent-ripple{display:none}:host .item-checkbox ::ng-deep mat-checkbox label{margin-left:28px}:host .actionbar-item [matline]{padding-left:16px}\n"] }]
+            args: [{ selector: 'igo-actionbar-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-list-item\r\n  *ngIf=\"!action.checkbox\"\r\n  class=\"actionbar-item\"\r\n  matTooltipClass=\"actionbarItemTooltip\"\r\n  matTooltipShowDelay=\"500\"\r\n  [matTooltip]=\"withTooltip ? ((tooltip$ | async) || title | translate) : ''\"\r\n  [ngClass]=\"ngClass$ | async\"\r\n  (click)=\"onClick()\"\r\n>\r\n  <button\r\n    *ngIf=\"withIcon\"\r\n    matListItemAvatar\r\n    mat-icon-button\r\n    [color]=\"color\"\r\n    [disabled]=\"disabled$ | async\"\r\n    [disableRipple]=\"true\"\r\n  >\r\n    <mat-icon *ngIf=\"withIcon\" svgIcon=\"{{ icon$ | async }}\"></mat-icon>\r\n  </button>\r\n  <span *ngIf=\"withTitle\" matLine>{{ title | translate }}</span>\r\n</mat-list-item>\r\n\r\n<mat-list-item\r\n  class=\"item-checkbox\"\r\n  *ngIf=\"action.checkbox\"\r\n  matTooltipClass=\"actionbarItemTooltip\"\r\n  matTooltipShowDelay=\"500\"\r\n  [matTooltip]=\"withTooltip ? ((tooltip$ | async) || title | translate) : ''\"\r\n  [ngClass]=\"ngClass$ | async\"\r\n>\r\n  <mat-checkbox\r\n    *ngIf=\"withTitle\"\r\n    (change)=\"action.handler()\"\r\n    [checked]=\"checkCondition$ | async\"\r\n  >\r\n    {{ title | translate }}\r\n  </mat-checkbox>\r\n</mat-list-item>\r\n", styles: [":host ::ng-deep mat-list-item:hover{cursor:pointer}:host mat-list-item.igo-actionbar-item-disabled{color:#00000042;cursor:default!important}:host mat-list-item.igo-actionbar-item-no-display{display:none}:host mat-list-item ::ng-deep button[matlistitemavatar]{margin-left:4px}:host mat-list-item ::ng-deep button .mat-mdc-button-persistent-ripple{display:none}:host .item-checkbox ::ng-deep mat-checkbox label{margin-left:28px}:host .actionbar-item [matline]{padding-left:16px}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { action: [{
                 type: Input
             }], color: [{
@@ -2010,11 +2010,11 @@ class EntitySelectorComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EntitySelectorComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EntitySelectorComponent, selector: "igo-entity-selector", inputs: { store: "store", titleAccessor: "titleAccessor", emptyText: "emptyText", multi: "multi", multiAllText: "multiAllText", multiNoneText: "multiNoneText", placeholder: "placeholder", disabled: "disabled" }, outputs: { selectedChange: "selectedChange" }, ngImport: i0, template: "<mat-form-field class=\"igo-entity-selector\" subscriptSizing=\"dynamic\">\n  <mat-select\n    [disabled]=\"disabled\"\n    [value]=\"selected$ | async\"\n    [multiple]=\"multi\"\n    [placeholder]=\"placeholder\"\n    (selectionChange)=\"onSelectionChange($event)\"\n  >\n    <mat-option\n      *ngIf=\"emptyText !== undefined && multi === false\"\n      [value]=\"emptyValue\"\n      >{{ emptyText }}</mat-option\n    >\n    <mat-option *ngIf=\"multi === true\" [value]=\"multiSelectValue\">{{\n      multiText$ | async\n    }}</mat-option>\n    <ng-template ngFor let-record [ngForOf]=\"store.stateView.all$() | async\">\n      <mat-option [value]=\"record.entity\">\n        {{ titleAccessor(record.entity) }}\n      </mat-option>\n    </ng-template>\n  </mat-select>\n</mat-form-field>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i3$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EntitySelectorComponent, selector: "igo-entity-selector", inputs: { store: "store", titleAccessor: "titleAccessor", emptyText: "emptyText", multi: "multi", multiAllText: "multiAllText", multiNoneText: "multiNoneText", placeholder: "placeholder", disabled: "disabled" }, outputs: { selectedChange: "selectedChange" }, ngImport: i0, template: "<mat-form-field class=\"igo-entity-selector\" subscriptSizing=\"dynamic\">\r\n  <mat-select\r\n    [disabled]=\"disabled\"\r\n    [value]=\"selected$ | async\"\r\n    [multiple]=\"multi\"\r\n    [placeholder]=\"placeholder\"\r\n    (selectionChange)=\"onSelectionChange($event)\"\r\n  >\r\n    <mat-option\r\n      *ngIf=\"emptyText !== undefined && multi === false\"\r\n      [value]=\"emptyValue\"\r\n      >{{ emptyText }}</mat-option\r\n    >\r\n    <mat-option *ngIf=\"multi === true\" [value]=\"multiSelectValue\">{{\r\n      multiText$ | async\r\n    }}</mat-option>\r\n    <ng-template ngFor let-record [ngForOf]=\"store.stateView.all$() | async\">\r\n      <mat-option [value]=\"record.entity\">\r\n        {{ titleAccessor(record.entity) }}\r\n      </mat-option>\r\n    </ng-template>\r\n  </mat-select>\r\n</mat-form-field>\r\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i3$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EntitySelectorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-entity-selector', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field class=\"igo-entity-selector\" subscriptSizing=\"dynamic\">\n  <mat-select\n    [disabled]=\"disabled\"\n    [value]=\"selected$ | async\"\n    [multiple]=\"multi\"\n    [placeholder]=\"placeholder\"\n    (selectionChange)=\"onSelectionChange($event)\"\n  >\n    <mat-option\n      *ngIf=\"emptyText !== undefined && multi === false\"\n      [value]=\"emptyValue\"\n      >{{ emptyText }}</mat-option\n    >\n    <mat-option *ngIf=\"multi === true\" [value]=\"multiSelectValue\">{{\n      multiText$ | async\n    }}</mat-option>\n    <ng-template ngFor let-record [ngForOf]=\"store.stateView.all$() | async\">\n      <mat-option [value]=\"record.entity\">\n        {{ titleAccessor(record.entity) }}\n      </mat-option>\n    </ng-template>\n  </mat-select>\n</mat-form-field>\n", styles: ["mat-form-field{width:100%}\n"] }]
+            args: [{ selector: 'igo-entity-selector', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field class=\"igo-entity-selector\" subscriptSizing=\"dynamic\">\r\n  <mat-select\r\n    [disabled]=\"disabled\"\r\n    [value]=\"selected$ | async\"\r\n    [multiple]=\"multi\"\r\n    [placeholder]=\"placeholder\"\r\n    (selectionChange)=\"onSelectionChange($event)\"\r\n  >\r\n    <mat-option\r\n      *ngIf=\"emptyText !== undefined && multi === false\"\r\n      [value]=\"emptyValue\"\r\n      >{{ emptyText }}</mat-option\r\n    >\r\n    <mat-option *ngIf=\"multi === true\" [value]=\"multiSelectValue\">{{\r\n      multiText$ | async\r\n    }}</mat-option>\r\n    <ng-template ngFor let-record [ngForOf]=\"store.stateView.all$() | async\">\r\n      <mat-option [value]=\"record.entity\">\r\n        {{ titleAccessor(record.entity) }}\r\n      </mat-option>\r\n    </ng-template>\r\n  </mat-select>\r\n</mat-form-field>\r\n", styles: ["mat-form-field{width:100%}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { store: [{
                 type: Input
             }], titleAccessor: [{
@@ -2180,11 +2180,11 @@ class EntityTablePaginatorComponent {
         this.paginatorChange.emit(this.paginator);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EntityTablePaginatorComponent, deps: [{ token: i1$1.LanguageService }, { token: i1$1.MediaService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EntityTablePaginatorComponent, selector: "igo-entity-table-paginator", inputs: { entitySortChange$: "entitySortChange$", store: "store", paginatorOptions: "paginatorOptions" }, outputs: { page: "page", paginatorChange: "paginatorChange" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<mat-paginator\n  [disabled]=\"disabled\"\n  [hidePageSize]=\"hidePageSize\"\n  [length]=\"length\"\n  [pageIndex]=\"pageIndex\"\n  [pageSize]=\"pageSize\"\n  [pageSizeOptions]=\"pageSizeOptions\"\n  [showFirstLastButtons]=\"showFirstLastButtons\"\n  (page)=\"emitPaginator()\"\n>\n</mat-paginator>\n", styles: [":host ::ng-deep .mat-mdc-paginator-container{min-height:unset}\n"], dependencies: [{ kind: "component", type: i2$2.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EntityTablePaginatorComponent, selector: "igo-entity-table-paginator", inputs: { entitySortChange$: "entitySortChange$", store: "store", paginatorOptions: "paginatorOptions" }, outputs: { page: "page", paginatorChange: "paginatorChange" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<mat-paginator\r\n  [disabled]=\"disabled\"\r\n  [hidePageSize]=\"hidePageSize\"\r\n  [length]=\"length\"\r\n  [pageIndex]=\"pageIndex\"\r\n  [pageSize]=\"pageSize\"\r\n  [pageSizeOptions]=\"pageSizeOptions\"\r\n  [showFirstLastButtons]=\"showFirstLastButtons\"\r\n  (page)=\"emitPaginator()\"\r\n>\r\n</mat-paginator>\r\n", styles: [":host ::ng-deep .mat-mdc-paginator-container{min-height:unset}\n"], dependencies: [{ kind: "component", type: i2$2.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EntityTablePaginatorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-entity-table-paginator', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-paginator\n  [disabled]=\"disabled\"\n  [hidePageSize]=\"hidePageSize\"\n  [length]=\"length\"\n  [pageIndex]=\"pageIndex\"\n  [pageSize]=\"pageSize\"\n  [pageSizeOptions]=\"pageSizeOptions\"\n  [showFirstLastButtons]=\"showFirstLastButtons\"\n  (page)=\"emitPaginator()\"\n>\n</mat-paginator>\n", styles: [":host ::ng-deep .mat-mdc-paginator-container{min-height:unset}\n"] }]
+            args: [{ selector: 'igo-entity-table-paginator', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-paginator\r\n  [disabled]=\"disabled\"\r\n  [hidePageSize]=\"hidePageSize\"\r\n  [length]=\"length\"\r\n  [pageIndex]=\"pageIndex\"\r\n  [pageSize]=\"pageSize\"\r\n  [pageSizeOptions]=\"pageSizeOptions\"\r\n  [showFirstLastButtons]=\"showFirstLastButtons\"\r\n  (page)=\"emitPaginator()\"\r\n>\r\n</mat-paginator>\r\n", styles: [":host ::ng-deep .mat-mdc-paginator-container{min-height:unset}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.LanguageService }, { type: i1$1.MediaService }]; }, propDecorators: { entitySortChange$: [{
                 type: Input
             }], store: [{
@@ -3206,13 +3206,13 @@ class EntityTableComponent {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EntityTableComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$4.UntypedFormBuilder }, { token: i2$3.FocusMonitor }, { token: i0.ElementRef }, { token: i1$4.NgControl, optional: true, self: true }, { token: i1$4.NgForm, optional: true }, { token: i1$4.FormControlName, optional: true }, { token: i3$2.ErrorStateMatcher }, { token: i3$2.DateAdapter }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EntityTableComponent, selector: "igo-entity-table", inputs: { store: "store", paginator: "paginator", template: "template", scrollBehavior: "scrollBehavior", sortNullsFirst: "sortNullsFirst", withPaginator: "withPaginator", paginatorOptions: "paginatorOptions" }, outputs: { entityClick: "entityClick", entitySelectChange: "entitySelectChange", entitySortChange: "entitySortChange" }, providers: [
             { provide: MatFormFieldControl, useExisting: EntityTableComponent }
-        ], usesOnChanges: true, ngImport: i0, template: "<div class=\"table-container\" [ngStyle]=\"{ height: tableHeight }\">\n  <table\n    id=\"currentWorkspaceTable\"\n    mat-table\n    matSort\n    [ngClass]=\"getTableClass()\"\n    [dataSource]=\"dataSource\"\n    [trackBy]=\"getTrackByFunction()\"\n    (matSortChange)=\"onSort($event)\"\n  >\n    <ng-container matColumnDef=\"selectionCheckbox\" class=\"mat-cell-checkbox\">\n      <th mat-header-cell *matHeaderCellDef>\n        <ng-container *ngIf=\"selectMany\">\n          <ng-container *ngIf=\"selectionState$ | async as selectionState\">\n            <mat-checkbox\n              (change)=\"onToggleRows($event.checked)\"\n              [checked]=\"selectionState === entityTableSelectionState.All\"\n              [indeterminate]=\"\n                selectionState === entityTableSelectionState.Some\n              \"\n            >\n            </mat-checkbox>\n          </ng-container>\n        </ng-container>\n      </th>\n      <td mat-cell *matCellDef=\"let row\">\n        <mat-checkbox\n          (mousedown)=\"$event.shiftKey ? $event.preventDefault() : null\"\n          (click)=\"\n            $event.shiftKey\n              ? onShiftToggleRow(!rowIsSelected(row.record), row.record, $event)\n              : $event.stopPropagation()\n          \"\n          (change)=\"onToggleRow($event.checked, row.record)\"\n          [checked]=\"rowIsSelected(row.record)\"\n        >\n        </mat-checkbox>\n      </td>\n    </ng-container>\n\n    <ng-container\n      [matColumnDef]=\"column.name\"\n      *ngFor=\"let column of template.columns\"\n    >\n      <ng-container *ngIf=\"columnIsSortable(column)\">\n        <th\n          mat-header-cell\n          *matHeaderCellDef\n          mat-sort-header\n          [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n        >\n          {{ column.title }}\n        </th>\n      </ng-container>\n\n      <ng-container *ngIf=\"!columnIsSortable(column)\">\n        <th\n          mat-header-cell\n          *matHeaderCellDef\n          [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n        >\n          {{ column.title }}\n        </th>\n      </ng-container>\n\n      <ng-container *ngIf=\"getColumnRenderer(column) as columnRenderer\">\n        <ng-container\n          *ngIf=\"columnRenderer === entityTableColumnRenderer.Default\"\n        >\n          <ng-container *matCellDef=\"let row\">\n            <td\n              mat-cell\n              class=\"mat-cell-text\"\n              *ngIf=\"!row.cellData[column.name].isUrl; else isAnUrlDefault\"\n              [ngClass]=\"row.cellData[column.name].class\"\n            >\n              {{ row.cellData[column.name].value }}\n            </td>\n            <ng-template #isAnUrlDefault>\n              <td\n                mat-cell\n                class=\"mat-cell-text\"\n                [ngClass]=\"row.cellData[column.name].class\"\n              >\n                <a\n                  href=\"{{ row.cellData[column.name].value }}\"\n                  target=\"_blank\"\n                  rel=\"noopener noreferrer\"\n                  (click)=\"$event.stopPropagation()\"\n                >\n                  <img\n                    igoImageError\n                    *ngIf=\"row.cellData[column.name].isImg; else notImg\"\n                    src=\"{{\n                      row.cellData[column.name].value | secureImage | async\n                    }}\"\n                    width=\"50\"\n                    heigth=\"auto\"\n                  />\n                  <ng-template #notImg\n                    ><span\n                      >{{ 'igo.common.entity-table.targetHtmlUrl' | translate }}\n                    </span></ng-template\n                  >\n                </a>\n              </td>\n            </ng-template>\n          </ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"columnRenderer === entityTableColumnRenderer.HTML\">\n          <ng-container *matCellDef=\"let row\">\n            <td\n              mat-cell\n              class=\"mat-cell-text\"\n              *ngIf=\"!row.cellData[column.name].isUrl; else isAnUrlHTML\"\n              [ngClass]=\"row.cellData[column.name].class\"\n              [innerHTML]=\"row.cellData[column.name].value\"\n            ></td>\n            <ng-template #isAnUrlHTML>\n              <td\n                mat-cell\n                class=\"mat-cell-text\"\n                [ngClass]=\"row.cellData[column.name].class\"\n              >\n                <a\n                  href=\"{{ row.cellData[column.name].value }}\"\n                  target=\"_blank\"\n                  rel=\"noopener noreferrer\"\n                  (click)=\"$event.stopPropagation()\"\n                >\n                  <img\n                    igoImageError\n                    *ngIf=\"row.cellData[column.name].isImg; else notImg\"\n                    src=\"{{\n                      row.cellData[column.name].value | secureImage | async\n                    }}\"\n                    width=\"50\"\n                    heigth=\"auto\"\n                  />\n                  <ng-template #notImg\n                    ><span\n                      >{{ 'igo.geo.targetHtmlUrl' | translate }}\n                    </span></ng-template\n                  >\n                </a>\n              </td>\n            </ng-template>\n          </ng-container>\n        </ng-container>\n        <ng-container\n          *ngIf=\"columnRenderer === entityTableColumnRenderer.UnsanitizedHTML\"\n        >\n          <ng-container *matCellDef=\"let row\">\n            <td\n              mat-cell\n              class=\"mat-cell-text edition\"\n              [formGroup]=\"formGroup\"\n              *ngIf=\"isEdition(row.record); else isUnsanitizedHTML\"\n              [ngClass]=\"row.cellData[column.name].class\"\n            >\n              <div class=\"date-picker\" *ngIf=\"column.type === 'date'\">\n                <mat-datepicker-toggle\n                  matSuffix\n                  [for]=\"picker\"\n                ></mat-datepicker-toggle>\n                <input\n                  matInput\n                  [matDatepicker]=\"picker\"\n                  [formControlName]=\"column.name\"\n                  value=\"{{ row.cellData[column.name].value }}\"\n                  (dateChange)=\"onDateChange(column.name, row.record, $event)\"\n                />\n                <mat-datepicker #picker></mat-datepicker>\n              </div>\n              <input\n                matInput\n                type=\"time\"\n                *ngIf=\"column.type === 'time'\"\n                [formControlName]=\"column.name\"\n                step=\"900\"\n                (focus)=\"column.onFocus($event)\"\n                (keypress)=\"column.onChange($event)\"\n                (blur)=\"column.onBlur($event)\"\n              />\n              <input\n                matInput\n                type=\"number\"\n                class=\"class_number_edition\"\n                *ngIf=\"column.type === 'number'\"\n                [formControlName]=\"column.name\"\n                step=\"{{ column.step }}\"\n                value=\"{{ row.cellData[column.name].value }}\"\n                (input)=\"onValueChange(column.name, row.record, $event)\"\n                readonly=\"{{ getValidationAttributeValue(column, 'readonly') }}\"\n                required=\"{{\n                  getValidationAttributeValue(column, 'mandatory')\n                }}\"\n                min=\"{{ getValidationAttributeValue(column, 'minValue') }}\"\n                max=\"{{ getValidationAttributeValue(column, 'maxValue') }}\"\n              />\n              <input\n                matInput\n                type=\"text\"\n                *ngIf=\"!column.type || column.type === 'string'\"\n                [formControlName]=\"column.name\"\n                value=\"{{ row.cellData[column.name].value }}\"\n                (input)=\"onValueChange(column.name, row.record, $event)\"\n                readonly=\"{{ getValidationAttributeValue(column, 'readonly') }}\"\n                required=\"{{\n                  getValidationAttributeValue(column, 'mandatory')\n                }}\"\n              />\n              <mat-checkbox\n                *ngIf=\"column.type === 'boolean'\"\n                [formControlName]=\"column.name\"\n                [checked]=\"row.cellData[column.name].value\"\n                (change)=\"onBooleanValueChange(column.name, row.record, $event)\"\n              ></mat-checkbox>\n              <mat-select\n                *ngIf=\"column.type === 'list'\"\n                required=\"{{\n                  getValidationAttributeValue(column, 'mandatory')\n                }}\"\n                [formControlName]=\"column.name\"\n                [multiple]=\"column.multiple\"\n                (selectionChange)=\"\n                  onSelectValueChange(column.name, row.record, $event)\n                \"\n                [value]=\"row.cellData[column.name].value\"\n              >\n                <mat-option\n                  *ngFor=\"let option of column.domainValues\"\n                  [value]=\"option.id\"\n                  [disabled]=\"option.disabled\"\n                >\n                  {{ option.value }}\n                </mat-option>\n              </mat-select>\n              <input\n                matInput\n                type=\"text\"\n                [formControlName]=\"column.name\"\n                *ngIf=\"column.type === 'autocomplete'\"\n                [matAutocomplete]=\"auto\"\n                required=\"{{\n                  getValidationAttributeValue(column, 'mandatory')\n                }}\"\n                value=\"{{ row.cellData[column.name].value }}\"\n                readonly=\"{{ getValidationAttributeValue(column, 'readonly') }}\"\n              />\n              <mat-autocomplete\n                #auto=\"matAutocomplete\"\n                (optionSelected)=\"\n                  onAutocompleteValueChange(column, row.record, $event)\n                \"\n                panelWidth=\"430px\"\n              >\n                <mat-option\n                  *ngFor=\"let option of filteredOptions[column.name] | async\"\n                  [value]=\"option.id\"\n                >\n                  {{ option.value }}\n                </mat-option>\n              </mat-autocomplete>\n            </td>\n            <ng-template #isUnsanitizedHTML>\n              <td\n                mat-cell\n                class=\"mat-cell-text\"\n                *ngIf=\"\n                  !row.cellData[column.name].isUrl;\n                  else isAnUrlUnsanitizedHTML\n                \"\n                [ngClass]=\"row.cellData[column.name].class\"\n                [innerHTML]=\"row.cellData[column.name].value | sanitizeHtml\"\n              ></td>\n              <ng-template #isAnUrlUnsanitizedHTML>\n                <td\n                  mat-cell\n                  class=\"mat-cell-text\"\n                  [ngClass]=\"row.cellData[column.name].class\"\n                >\n                  <a\n                    href=\"{{ row.cellData[column.name].value }}\"\n                    target=\"_blank\"\n                    rel=\"noopener noreferrer\"\n                    (click)=\"$event.stopPropagation()\"\n                  >\n                    <img\n                      igoImageError\n                      *ngIf=\"row.cellData[column.name].isImg; else notImg\"\n                      src=\"{{\n                        row.cellData[column.name].value | secureImage | async\n                      }}\"\n                      width=\"50\"\n                      heigth=\"auto\"\n                    />\n                    <ng-template #notImg\n                      ><span\n                        >{{ 'igo.geo.targetHtmlUrl' | translate }}\n                      </span></ng-template\n                    >\n                  </a>\n                </td>\n              </ng-template>\n            </ng-template>\n          </ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"columnRenderer === entityTableColumnRenderer.Icon\">\n          <td\n            mat-cell\n            *matCellDef=\"let row\"\n            class=\"mat-cell-text\"\n            [ngClass]=\"row.cellData[column.name].class\"\n          >\n            <mat-icon\n              *ngIf=\"column.onClick\"\n              svgIcon=\"{{ row.cellData[column.name].value || column.icon }}\"\n              (click)=\"column.onClick($event)\"\n            ></mat-icon>\n            <mat-icon\n              *ngIf=\"!column.onClick\"\n              svgIcon=\"{{ row.cellData[column.name].value || column.icon }}\"\n            ></mat-icon>\n          </td>\n        </ng-container>\n        <ng-container\n          *ngIf=\"columnRenderer === entityTableColumnRenderer.ButtonGroup\"\n        >\n          <ng-container *matCellDef=\"let row\">\n            <td\n              mat-cell\n              class=\"mat-cell-text\"\n              [ngClass]=\"row.cellData[column.name].class\"\n            >\n              <span *ngFor=\"let button of row.cellData[column.name].value\">\n                <ng-container\n                  *ngIf=\"\n                    isEdition(row.record) === button.editMode ||\n                    button.editMode === undefined\n                  \"\n                >\n                  <button\n                    *ngIf=\"button.style === 'mat-icon-button'\"\n                    igoStopPropagation\n                    mat-icon-button\n                    [color]=\"button.color\"\n                    (mousedown)=\"onButtonClick(button.click, row.record)\"\n                    [disabled]=\"button.disabled\"\n                  >\n                    <mat-icon svgIcon=\"{{ button.icon }}\"></mat-icon>\n                  </button>\n                  <button\n                    *ngIf=\"button.style !== 'mat-icon-button'\"\n                    igoStopPropagation\n                    mat-mini-fab\n                    [color]=\"button.color\"\n                    (mousedown)=\"onButtonClick(button.click, row.record)\"\n                    [disabled]=\"button.disabled\"\n                  >\n                    <mat-icon svgIcon=\"{{ button.icon }}\"></mat-icon>\n                  </button>\n                </ng-container>\n              </span>\n            </td>\n          </ng-container>\n        </ng-container>\n      </ng-container>\n    </ng-container>\n\n    <tr\n      mat-header-row\n      *matHeaderRowDef=\"headers; sticky: fixedHeader\"\n      [ngClass]=\"getHeaderClass()\"\n    ></tr>\n    <tr\n      mat-row\n      igoEntityTableRow\n      *matRowDef=\"let row; columns: headers\"\n      [scrollBehavior]=\"scrollBehavior\"\n      [ngClass]=\"getRowClass(row.record)\"\n      [selection]=\"selection\"\n      [selected]=\"rowIsSelected(row.record)\"\n      (select)=\"onRowSelect(row.record)\"\n      (click)=\"onRowClick(row.record)\"\n    ></tr>\n  </table>\n  <igo-entity-table-paginator\n    *ngIf=\"withPaginator\"\n    [store]=\"store\"\n    [paginatorOptions]=\"paginatorOptions\"\n    [entitySortChange$]=\"entitySortChange$\"\n    (paginatorChange)=\"paginatorChange($event)\"\n  >\n  </igo-entity-table-paginator>\n</div>\n", styles: [":host{width:100%;height:100%;display:block}:host.table-compact tr.mat-mdc-header-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:36px}:host.table-compact tr.mat-mdc-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:28px}:host .table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}:host .mat-cell-text{overflow:hidden;word-wrap:break-word}:host entity-table table.igo-entity-table-with-selection tr:hover{-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd;cursor:pointer}:host table button{margin:7px}:host .class_hidden{visibility:hidden}:host .class_display_none{display:none}:host .class_boolean,:host .class_icon,:host .class_number{text-align:center;padding-right:35px!important}:host .class_string,:host .class_text,:host .class_number_edition{text-align:left}:host td.edition{background:#a6a6a633}:host input{border-bottom:1px solid darkgrey}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i5.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i6$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple", "hideSingleSelectionIndicator"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i6$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "directive", type: i7$1.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i7$1.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i2.MatMiniFabButton, selector: "button[mat-mini-fab]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i3$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "directive", type: StopPropagationDirective, selector: "[igoStopPropagation]" }, { kind: "component", type: EntityTablePaginatorComponent, selector: "igo-entity-table-paginator", inputs: ["entitySortChange$", "store", "paginatorOptions"], outputs: ["page", "paginatorChange"] }, { kind: "directive", type: ImageErrorDirective, selector: "[igoImageError]", inputs: ["errorImageUrl", "hideError"] }, { kind: "directive", type: i1$4.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$4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$4.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i5$1.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: i17.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i17.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i17.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "directive", type: EntityTableRowDirective, selector: "[igoEntityTableRow]", inputs: ["selection", "selectOnClick", "highlightSelection", "selected", "scrollBehavior"], outputs: ["select"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }, { kind: "pipe", type: SecureImagePipe, name: "secureImage" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], usesOnChanges: true, ngImport: i0, template: "<div class=\"table-container\" [ngStyle]=\"{ height: tableHeight }\">\r\n  <table\r\n    id=\"currentWorkspaceTable\"\r\n    mat-table\r\n    matSort\r\n    [ngClass]=\"getTableClass()\"\r\n    [dataSource]=\"dataSource\"\r\n    [trackBy]=\"getTrackByFunction()\"\r\n    (matSortChange)=\"onSort($event)\"\r\n  >\r\n    <ng-container matColumnDef=\"selectionCheckbox\" class=\"mat-cell-checkbox\">\r\n      <th mat-header-cell *matHeaderCellDef>\r\n        <ng-container *ngIf=\"selectMany\">\r\n          <ng-container *ngIf=\"selectionState$ | async as selectionState\">\r\n            <mat-checkbox\r\n              (change)=\"onToggleRows($event.checked)\"\r\n              [checked]=\"selectionState === entityTableSelectionState.All\"\r\n              [indeterminate]=\"\r\n                selectionState === entityTableSelectionState.Some\r\n              \"\r\n            >\r\n            </mat-checkbox>\r\n          </ng-container>\r\n        </ng-container>\r\n      </th>\r\n      <td mat-cell *matCellDef=\"let row\">\r\n        <mat-checkbox\r\n          (mousedown)=\"$event.shiftKey ? $event.preventDefault() : null\"\r\n          (click)=\"\r\n            $event.shiftKey\r\n              ? onShiftToggleRow(!rowIsSelected(row.record), row.record, $event)\r\n              : $event.stopPropagation()\r\n          \"\r\n          (change)=\"onToggleRow($event.checked, row.record)\"\r\n          [checked]=\"rowIsSelected(row.record)\"\r\n        >\r\n        </mat-checkbox>\r\n      </td>\r\n    </ng-container>\r\n\r\n    <ng-container\r\n      [matColumnDef]=\"column.name\"\r\n      *ngFor=\"let column of template.columns\"\r\n    >\r\n      <ng-container *ngIf=\"columnIsSortable(column)\">\r\n        <th\r\n          mat-header-cell\r\n          *matHeaderCellDef\r\n          mat-sort-header\r\n          [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\r\n        >\r\n          {{ column.title }}\r\n        </th>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"!columnIsSortable(column)\">\r\n        <th\r\n          mat-header-cell\r\n          *matHeaderCellDef\r\n          [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\r\n        >\r\n          {{ column.title }}\r\n        </th>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"getColumnRenderer(column) as columnRenderer\">\r\n        <ng-container\r\n          *ngIf=\"columnRenderer === entityTableColumnRenderer.Default\"\r\n        >\r\n          <ng-container *matCellDef=\"let row\">\r\n            <td\r\n              mat-cell\r\n              class=\"mat-cell-text\"\r\n              *ngIf=\"!row.cellData[column.name].isUrl; else isAnUrlDefault\"\r\n              [ngClass]=\"row.cellData[column.name].class\"\r\n            >\r\n              {{ row.cellData[column.name].value }}\r\n            </td>\r\n            <ng-template #isAnUrlDefault>\r\n              <td\r\n                mat-cell\r\n                class=\"mat-cell-text\"\r\n                [ngClass]=\"row.cellData[column.name].class\"\r\n              >\r\n                <a\r\n                  href=\"{{ row.cellData[column.name].value }}\"\r\n                  target=\"_blank\"\r\n                  rel=\"noopener noreferrer\"\r\n                  (click)=\"$event.stopPropagation()\"\r\n                >\r\n                  <img\r\n                    igoImageError\r\n                    *ngIf=\"row.cellData[column.name].isImg; else notImg\"\r\n                    src=\"{{\r\n                      row.cellData[column.name].value | secureImage | async\r\n                    }}\"\r\n                    width=\"50\"\r\n                    heigth=\"auto\"\r\n                  />\r\n                  <ng-template #notImg\r\n                    ><span\r\n                      >{{ 'igo.common.entity-table.targetHtmlUrl' | translate }}\r\n                    </span></ng-template\r\n                  >\r\n                </a>\r\n              </td>\r\n            </ng-template>\r\n          </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"columnRenderer === entityTableColumnRenderer.HTML\">\r\n          <ng-container *matCellDef=\"let row\">\r\n            <td\r\n              mat-cell\r\n              class=\"mat-cell-text\"\r\n              *ngIf=\"!row.cellData[column.name].isUrl; else isAnUrlHTML\"\r\n              [ngClass]=\"row.cellData[column.name].class\"\r\n              [innerHTML]=\"row.cellData[column.name].value\"\r\n            ></td>\r\n            <ng-template #isAnUrlHTML>\r\n              <td\r\n                mat-cell\r\n                class=\"mat-cell-text\"\r\n                [ngClass]=\"row.cellData[column.name].class\"\r\n              >\r\n                <a\r\n                  href=\"{{ row.cellData[column.name].value }}\"\r\n                  target=\"_blank\"\r\n                  rel=\"noopener noreferrer\"\r\n                  (click)=\"$event.stopPropagation()\"\r\n                >\r\n                  <img\r\n                    igoImageError\r\n                    *ngIf=\"row.cellData[column.name].isImg; else notImg\"\r\n                    src=\"{{\r\n                      row.cellData[column.name].value | secureImage | async\r\n                    }}\"\r\n                    width=\"50\"\r\n                    heigth=\"auto\"\r\n                  />\r\n                  <ng-template #notImg\r\n                    ><span\r\n                      >{{ 'igo.geo.targetHtmlUrl' | translate }}\r\n                    </span></ng-template\r\n                  >\r\n                </a>\r\n              </td>\r\n            </ng-template>\r\n          </ng-container>\r\n        </ng-container>\r\n        <ng-container\r\n          *ngIf=\"columnRenderer === entityTableColumnRenderer.UnsanitizedHTML\"\r\n        >\r\n          <ng-container *matCellDef=\"let row\">\r\n            <td\r\n              mat-cell\r\n              class=\"mat-cell-text edition\"\r\n              [formGroup]=\"formGroup\"\r\n              *ngIf=\"isEdition(row.record); else isUnsanitizedHTML\"\r\n              [ngClass]=\"row.cellData[column.name].class\"\r\n            >\r\n              <div class=\"date-picker\" *ngIf=\"column.type === 'date'\">\r\n                <mat-datepicker-toggle\r\n                  matSuffix\r\n                  [for]=\"picker\"\r\n                ></mat-datepicker-toggle>\r\n                <input\r\n                  matInput\r\n                  [matDatepicker]=\"picker\"\r\n                  [formControlName]=\"column.name\"\r\n                  value=\"{{ row.cellData[column.name].value }}\"\r\n                  (dateChange)=\"onDateChange(column.name, row.record, $event)\"\r\n                />\r\n                <mat-datepicker #picker></mat-datepicker>\r\n              </div>\r\n              <input\r\n                matInput\r\n                type=\"time\"\r\n                *ngIf=\"column.type === 'time'\"\r\n                [formControlName]=\"column.name\"\r\n                step=\"900\"\r\n                (focus)=\"column.onFocus($event)\"\r\n                (keypress)=\"column.onChange($event)\"\r\n                (blur)=\"column.onBlur($event)\"\r\n              />\r\n              <input\r\n                matInput\r\n                type=\"number\"\r\n                class=\"class_number_edition\"\r\n                *ngIf=\"column.type === 'number'\"\r\n                [formControlName]=\"column.name\"\r\n                step=\"{{ column.step }}\"\r\n                value=\"{{ row.cellData[column.name].value }}\"\r\n                (input)=\"onValueChange(column.name, row.record, $event)\"\r\n                readonly=\"{{ getValidationAttributeValue(column, 'readonly') }}\"\r\n                required=\"{{\r\n                  getValidationAttributeValue(column, 'mandatory')\r\n                }}\"\r\n                min=\"{{ getValidationAttributeValue(column, 'minValue') }}\"\r\n                max=\"{{ getValidationAttributeValue(column, 'maxValue') }}\"\r\n              />\r\n              <input\r\n                matInput\r\n                type=\"text\"\r\n                *ngIf=\"!column.type || column.type === 'string'\"\r\n                [formControlName]=\"column.name\"\r\n                value=\"{{ row.cellData[column.name].value }}\"\r\n                (input)=\"onValueChange(column.name, row.record, $event)\"\r\n                readonly=\"{{ getValidationAttributeValue(column, 'readonly') }}\"\r\n                required=\"{{\r\n                  getValidationAttributeValue(column, 'mandatory')\r\n                }}\"\r\n              />\r\n              <mat-checkbox\r\n                *ngIf=\"column.type === 'boolean'\"\r\n                [formControlName]=\"column.name\"\r\n                [checked]=\"row.cellData[column.name].value\"\r\n                (change)=\"onBooleanValueChange(column.name, row.record, $event)\"\r\n              ></mat-checkbox>\r\n              <mat-select\r\n                *ngIf=\"column.type === 'list'\"\r\n                required=\"{{\r\n                  getValidationAttributeValue(column, 'mandatory')\r\n                }}\"\r\n                [formControlName]=\"column.name\"\r\n                [multiple]=\"column.multiple\"\r\n                (selectionChange)=\"\r\n                  onSelectValueChange(column.name, row.record, $event)\r\n                \"\r\n                [value]=\"row.cellData[column.name].value\"\r\n              >\r\n                <mat-option\r\n                  *ngFor=\"let option of column.domainValues\"\r\n                  [value]=\"option.id\"\r\n                  [disabled]=\"option.disabled\"\r\n                >\r\n                  {{ option.value }}\r\n                </mat-option>\r\n              </mat-select>\r\n              <input\r\n                matInput\r\n                type=\"text\"\r\n                [formControlName]=\"column.name\"\r\n                *ngIf=\"column.type === 'autocomplete'\"\r\n                [matAutocomplete]=\"auto\"\r\n                required=\"{{\r\n                  getValidationAttributeValue(column, 'mandatory')\r\n                }}\"\r\n                value=\"{{ row.cellData[column.name].value }}\"\r\n                readonly=\"{{ getValidationAttributeValue(column, 'readonly') }}\"\r\n              />\r\n              <mat-autocomplete\r\n                #auto=\"matAutocomplete\"\r\n                (optionSelected)=\"\r\n                  onAutocompleteValueChange(column, row.record, $event)\r\n                \"\r\n                panelWidth=\"430px\"\r\n              >\r\n                <mat-option\r\n                  *ngFor=\"let option of filteredOptions[column.name] | async\"\r\n                  [value]=\"option.id\"\r\n                >\r\n                  {{ option.value }}\r\n                </mat-option>\r\n              </mat-autocomplete>\r\n            </td>\r\n            <ng-template #isUnsanitizedHTML>\r\n              <td\r\n                mat-cell\r\n                class=\"mat-cell-text\"\r\n                *ngIf=\"\r\n                  !row.cellData[column.name].isUrl;\r\n                  else isAnUrlUnsanitizedHTML\r\n                \"\r\n                [ngClass]=\"row.cellData[column.name].class\"\r\n                [innerHTML]=\"row.cellData[column.name].value | sanitizeHtml\"\r\n              ></td>\r\n              <ng-template #isAnUrlUnsanitizedHTML>\r\n                <td\r\n                  mat-cell\r\n                  class=\"mat-cell-text\"\r\n                  [ngClass]=\"row.cellData[column.name].class\"\r\n                >\r\n                  <a\r\n                    href=\"{{ row.cellData[column.name].value }}\"\r\n                    target=\"_blank\"\r\n                    rel=\"noopener noreferrer\"\r\n                    (click)=\"$event.stopPropagation()\"\r\n                  >\r\n                    <img\r\n                      igoImageError\r\n                      *ngIf=\"row.cellData[column.name].isImg; else notImg\"\r\n                      src=\"{{\r\n                        row.cellData[column.name].value | secureImage | async\r\n                      }}\"\r\n                      width=\"50\"\r\n                      heigth=\"auto\"\r\n                    />\r\n                    <ng-template #notImg\r\n                      ><span\r\n                        >{{ 'igo.geo.targetHtmlUrl' | translate }}\r\n                      </span></ng-template\r\n                    >\r\n                  </a>\r\n                </td>\r\n              </ng-template>\r\n            </ng-template>\r\n          </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"columnRenderer === entityTableColumnRenderer.Icon\">\r\n          <td\r\n            mat-cell\r\n            *matCellDef=\"let row\"\r\n            class=\"mat-cell-text\"\r\n            [ngClass]=\"row.cellData[column.name].class\"\r\n          >\r\n            <mat-icon\r\n              *ngIf=\"column.onClick\"\r\n              svgIcon=\"{{ row.cellData[column.name].value || column.icon }}\"\r\n              (click)=\"column.onClick($event)\"\r\n            ></mat-icon>\r\n            <mat-icon\r\n              *ngIf=\"!column.onClick\"\r\n              svgIcon=\"{{ row.cellData[column.name].value || column.icon }}\"\r\n            ></mat-icon>\r\n          </td>\r\n        </ng-container>\r\n        <ng-container\r\n          *ngIf=\"columnRenderer === entityTableColumnRenderer.ButtonGroup\"\r\n        >\r\n          <ng-container *matCellDef=\"let row\">\r\n            <td\r\n              mat-cell\r\n              class=\"mat-cell-text\"\r\n              [ngClass]=\"row.cellData[column.name].class\"\r\n            >\r\n              <span *ngFor=\"let button of row.cellData[column.name].value\">\r\n                <ng-container\r\n                  *ngIf=\"\r\n                    isEdition(row.record) === button.editMode ||\r\n                    button.editMode === undefined\r\n                  \"\r\n                >\r\n                  <button\r\n                    *ngIf=\"button.style === 'mat-icon-button'\"\r\n                    igoStopPropagation\r\n                    mat-icon-button\r\n                    [color]=\"button.color\"\r\n                    (mousedown)=\"onButtonClick(button.click, row.record)\"\r\n                    [disabled]=\"button.disabled\"\r\n                  >\r\n                    <mat-icon svgIcon=\"{{ button.icon }}\"></mat-icon>\r\n                  </button>\r\n                  <button\r\n                    *ngIf=\"button.style !== 'mat-icon-button'\"\r\n                    igoStopPropagation\r\n                    mat-mini-fab\r\n                    [color]=\"button.color\"\r\n                    (mousedown)=\"onButtonClick(button.click, row.record)\"\r\n                    [disabled]=\"button.disabled\"\r\n                  >\r\n                    <mat-icon svgIcon=\"{{ button.icon }}\"></mat-icon>\r\n                  </button>\r\n                </ng-container>\r\n              </span>\r\n            </td>\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n    </ng-container>\r\n\r\n    <tr\r\n      mat-header-row\r\n      *matHeaderRowDef=\"headers; sticky: fixedHeader\"\r\n      [ngClass]=\"getHeaderClass()\"\r\n    ></tr>\r\n    <tr\r\n      mat-row\r\n      igoEntityTableRow\r\n      *matRowDef=\"let row; columns: headers\"\r\n      [scrollBehavior]=\"scrollBehavior\"\r\n      [ngClass]=\"getRowClass(row.record)\"\r\n      [selection]=\"selection\"\r\n      [selected]=\"rowIsSelected(row.record)\"\r\n      (select)=\"onRowSelect(row.record)\"\r\n      (click)=\"onRowClick(row.record)\"\r\n    ></tr>\r\n  </table>\r\n  <igo-entity-table-paginator\r\n    *ngIf=\"withPaginator\"\r\n    [store]=\"store\"\r\n    [paginatorOptions]=\"paginatorOptions\"\r\n    [entitySortChange$]=\"entitySortChange$\"\r\n    (paginatorChange)=\"paginatorChange($event)\"\r\n  >\r\n  </igo-entity-table-paginator>\r\n</div>\r\n", styles: [":host{width:100%;height:100%;display:block}:host.table-compact tr.mat-mdc-header-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:36px}:host.table-compact tr.mat-mdc-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:28px}:host .table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}:host .mat-cell-text{overflow:hidden;word-wrap:break-word}:host entity-table table.igo-entity-table-with-selection tr:hover{-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd;cursor:pointer}:host table button{margin:7px}:host .class_hidden{visibility:hidden}:host .class_display_none{display:none}:host .class_boolean,:host .class_icon,:host .class_number{text-align:center;padding-right:35px!important}:host .class_string,:host .class_text,:host .class_number_edition{text-align:left}:host td.edition{background:#a6a6a633}:host input{border-bottom:1px solid darkgrey}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i5.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i6$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple", "hideSingleSelectionIndicator"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i6$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "directive", type: i7$1.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i7$1.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i2.MatMiniFabButton, selector: "button[mat-mini-fab]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i3$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "directive", type: StopPropagationDirective, selector: "[igoStopPropagation]" }, { kind: "component", type: EntityTablePaginatorComponent, selector: "igo-entity-table-paginator", inputs: ["entitySortChange$", "store", "paginatorOptions"], outputs: ["page", "paginatorChange"] }, { kind: "directive", type: ImageErrorDirective, selector: "[igoImageError]", inputs: ["errorImageUrl", "hideError"] }, { kind: "directive", type: i1$4.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$4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$4.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i5$1.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: i17.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i17.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i17.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "directive", type: EntityTableRowDirective, selector: "[igoEntityTableRow]", inputs: ["selection", "selectOnClick", "highlightSelection", "selected", "scrollBehavior"], outputs: ["select"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }, { kind: "pipe", type: SecureImagePipe, name: "secureImage" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EntityTableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igo-entity-table', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         { provide: MatFormFieldControl, useExisting: EntityTableComponent }
-                    ], template: "<div class=\"table-container\" [ngStyle]=\"{ height: tableHeight }\">\n  <table\n    id=\"currentWorkspaceTable\"\n    mat-table\n    matSort\n    [ngClass]=\"getTableClass()\"\n    [dataSource]=\"dataSource\"\n    [trackBy]=\"getTrackByFunction()\"\n    (matSortChange)=\"onSort($event)\"\n  >\n    <ng-container matColumnDef=\"selectionCheckbox\" class=\"mat-cell-checkbox\">\n      <th mat-header-cell *matHeaderCellDef>\n        <ng-container *ngIf=\"selectMany\">\n          <ng-container *ngIf=\"selectionState$ | async as selectionState\">\n            <mat-checkbox\n              (change)=\"onToggleRows($event.checked)\"\n              [checked]=\"selectionState === entityTableSelectionState.All\"\n              [indeterminate]=\"\n                selectionState === entityTableSelectionState.Some\n              \"\n            >\n            </mat-checkbox>\n          </ng-container>\n        </ng-container>\n      </th>\n      <td mat-cell *matCellDef=\"let row\">\n        <mat-checkbox\n          (mousedown)=\"$event.shiftKey ? $event.preventDefault() : null\"\n          (click)=\"\n            $event.shiftKey\n              ? onShiftToggleRow(!rowIsSelected(row.record), row.record, $event)\n              : $event.stopPropagation()\n          \"\n          (change)=\"onToggleRow($event.checked, row.record)\"\n          [checked]=\"rowIsSelected(row.record)\"\n        >\n        </mat-checkbox>\n      </td>\n    </ng-container>\n\n    <ng-container\n      [matColumnDef]=\"column.name\"\n      *ngFor=\"let column of template.columns\"\n    >\n      <ng-container *ngIf=\"columnIsSortable(column)\">\n        <th\n          mat-header-cell\n          *matHeaderCellDef\n          mat-sort-header\n          [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n        >\n          {{ column.title }}\n        </th>\n      </ng-container>\n\n      <ng-container *ngIf=\"!columnIsSortable(column)\">\n        <th\n          mat-header-cell\n          *matHeaderCellDef\n          [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n        >\n          {{ column.title }}\n        </th>\n      </ng-container>\n\n      <ng-container *ngIf=\"getColumnRenderer(column) as columnRenderer\">\n        <ng-container\n          *ngIf=\"columnRenderer === entityTableColumnRenderer.Default\"\n        >\n          <ng-container *matCellDef=\"let row\">\n            <td\n              mat-cell\n              class=\"mat-cell-text\"\n              *ngIf=\"!row.cellData[column.name].isUrl; else isAnUrlDefault\"\n              [ngClass]=\"row.cellData[column.name].class\"\n            >\n              {{ row.cellData[column.name].value }}\n            </td>\n            <ng-template #isAnUrlDefault>\n              <td\n                mat-cell\n                class=\"mat-cell-text\"\n                [ngClass]=\"row.cellData[column.name].class\"\n              >\n                <a\n                  href=\"{{ row.cellData[column.name].value }}\"\n                  target=\"_blank\"\n                  rel=\"noopener noreferrer\"\n                  (click)=\"$event.stopPropagation()\"\n                >\n                  <img\n                    igoImageError\n                    *ngIf=\"row.cellData[column.name].isImg; else notImg\"\n                    src=\"{{\n                      row.cellData[column.name].value | secureImage | async\n                    }}\"\n                    width=\"50\"\n                    heigth=\"auto\"\n                  />\n                  <ng-template #notImg\n                    ><span\n                      >{{ 'igo.common.entity-table.targetHtmlUrl' | translate }}\n                    </span></ng-template\n                  >\n                </a>\n              </td>\n            </ng-template>\n          </ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"columnRenderer === entityTableColumnRenderer.HTML\">\n          <ng-container *matCellDef=\"let row\">\n            <td\n              mat-cell\n              class=\"mat-cell-text\"\n              *ngIf=\"!row.cellData[column.name].isUrl; else isAnUrlHTML\"\n              [ngClass]=\"row.cellData[column.name].class\"\n              [innerHTML]=\"row.cellData[column.name].value\"\n            ></td>\n            <ng-template #isAnUrlHTML>\n              <td\n                mat-cell\n                class=\"mat-cell-text\"\n                [ngClass]=\"row.cellData[column.name].class\"\n              >\n                <a\n                  href=\"{{ row.cellData[column.name].value }}\"\n                  target=\"_blank\"\n                  rel=\"noopener noreferrer\"\n                  (click)=\"$event.stopPropagation()\"\n                >\n                  <img\n                    igoImageError\n                    *ngIf=\"row.cellData[column.name].isImg; else notImg\"\n                    src=\"{{\n                      row.cellData[column.name].value | secureImage | async\n                    }}\"\n                    width=\"50\"\n                    heigth=\"auto\"\n                  />\n                  <ng-template #notImg\n                    ><span\n                      >{{ 'igo.geo.targetHtmlUrl' | translate }}\n                    </span></ng-template\n                  >\n                </a>\n              </td>\n            </ng-template>\n          </ng-container>\n        </ng-container>\n        <ng-container\n          *ngIf=\"columnRenderer === entityTableColumnRenderer.UnsanitizedHTML\"\n        >\n          <ng-container *matCellDef=\"let row\">\n            <td\n              mat-cell\n              class=\"mat-cell-text edition\"\n              [formGroup]=\"formGroup\"\n              *ngIf=\"isEdition(row.record); else isUnsanitizedHTML\"\n              [ngClass]=\"row.cellData[column.name].class\"\n            >\n              <div class=\"date-picker\" *ngIf=\"column.type === 'date'\">\n                <mat-datepicker-toggle\n                  matSuffix\n                  [for]=\"picker\"\n                ></mat-datepicker-toggle>\n                <input\n                  matInput\n                  [matDatepicker]=\"picker\"\n                  [formControlName]=\"column.name\"\n                  value=\"{{ row.cellData[column.name].value }}\"\n                  (dateChange)=\"onDateChange(column.name, row.record, $event)\"\n                />\n                <mat-datepicker #picker></mat-datepicker>\n              </div>\n              <input\n                matInput\n                type=\"time\"\n                *ngIf=\"column.type === 'time'\"\n                [formControlName]=\"column.name\"\n                step=\"900\"\n                (focus)=\"column.onFocus($event)\"\n                (keypress)=\"column.onChange($event)\"\n                (blur)=\"column.onBlur($event)\"\n              />\n              <input\n                matInput\n                type=\"number\"\n                class=\"class_number_edition\"\n                *ngIf=\"column.type === 'number'\"\n                [formControlName]=\"column.name\"\n                step=\"{{ column.step }}\"\n                value=\"{{ row.cellData[column.name].value }}\"\n                (input)=\"onValueChange(column.name, row.record, $event)\"\n                readonly=\"{{ getValidationAttributeValue(column, 'readonly') }}\"\n                required=\"{{\n                  getValidationAttributeValue(column, 'mandatory')\n                }}\"\n                min=\"{{ getValidationAttributeValue(column, 'minValue') }}\"\n                max=\"{{ getValidationAttributeValue(column, 'maxValue') }}\"\n              />\n              <input\n                matInput\n                type=\"text\"\n                *ngIf=\"!column.type || column.type === 'string'\"\n                [formControlName]=\"column.name\"\n                value=\"{{ row.cellData[column.name].value }}\"\n                (input)=\"onValueChange(column.name, row.record, $event)\"\n                readonly=\"{{ getValidationAttributeValue(column, 'readonly') }}\"\n                required=\"{{\n                  getValidationAttributeValue(column, 'mandatory')\n                }}\"\n              />\n              <mat-checkbox\n                *ngIf=\"column.type === 'boolean'\"\n                [formControlName]=\"column.name\"\n                [checked]=\"row.cellData[column.name].value\"\n                (change)=\"onBooleanValueChange(column.name, row.record, $event)\"\n              ></mat-checkbox>\n              <mat-select\n                *ngIf=\"column.type === 'list'\"\n                required=\"{{\n                  getValidationAttributeValue(column, 'mandatory')\n                }}\"\n                [formControlName]=\"column.name\"\n                [multiple]=\"column.multiple\"\n                (selectionChange)=\"\n                  onSelectValueChange(column.name, row.record, $event)\n                \"\n                [value]=\"row.cellData[column.name].value\"\n              >\n                <mat-option\n                  *ngFor=\"let option of column.domainValues\"\n                  [value]=\"option.id\"\n                  [disabled]=\"option.disabled\"\n                >\n                  {{ option.value }}\n                </mat-option>\n              </mat-select>\n              <input\n                matInput\n                type=\"text\"\n                [formControlName]=\"column.name\"\n                *ngIf=\"column.type === 'autocomplete'\"\n                [matAutocomplete]=\"auto\"\n                required=\"{{\n                  getValidationAttributeValue(column, 'mandatory')\n                }}\"\n                value=\"{{ row.cellData[column.name].value }}\"\n                readonly=\"{{ getValidationAttributeValue(column, 'readonly') }}\"\n              />\n              <mat-autocomplete\n                #auto=\"matAutocomplete\"\n                (optionSelected)=\"\n                  onAutocompleteValueChange(column, row.record, $event)\n                \"\n                panelWidth=\"430px\"\n              >\n                <mat-option\n                  *ngFor=\"let option of filteredOptions[column.name] | async\"\n                  [value]=\"option.id\"\n                >\n                  {{ option.value }}\n                </mat-option>\n              </mat-autocomplete>\n            </td>\n            <ng-template #isUnsanitizedHTML>\n              <td\n                mat-cell\n                class=\"mat-cell-text\"\n                *ngIf=\"\n                  !row.cellData[column.name].isUrl;\n                  else isAnUrlUnsanitizedHTML\n                \"\n                [ngClass]=\"row.cellData[column.name].class\"\n                [innerHTML]=\"row.cellData[column.name].value | sanitizeHtml\"\n              ></td>\n              <ng-template #isAnUrlUnsanitizedHTML>\n                <td\n                  mat-cell\n                  class=\"mat-cell-text\"\n                  [ngClass]=\"row.cellData[column.name].class\"\n                >\n                  <a\n                    href=\"{{ row.cellData[column.name].value }}\"\n                    target=\"_blank\"\n                    rel=\"noopener noreferrer\"\n                    (click)=\"$event.stopPropagation()\"\n                  >\n                    <img\n                      igoImageError\n                      *ngIf=\"row.cellData[column.name].isImg; else notImg\"\n                      src=\"{{\n                        row.cellData[column.name].value | secureImage | async\n                      }}\"\n                      width=\"50\"\n                      heigth=\"auto\"\n                    />\n                    <ng-template #notImg\n                      ><span\n                        >{{ 'igo.geo.targetHtmlUrl' | translate }}\n                      </span></ng-template\n                    >\n                  </a>\n                </td>\n              </ng-template>\n            </ng-template>\n          </ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"columnRenderer === entityTableColumnRenderer.Icon\">\n          <td\n            mat-cell\n            *matCellDef=\"let row\"\n            class=\"mat-cell-text\"\n            [ngClass]=\"row.cellData[column.name].class\"\n          >\n            <mat-icon\n              *ngIf=\"column.onClick\"\n              svgIcon=\"{{ row.cellData[column.name].value || column.icon }}\"\n              (click)=\"column.onClick($event)\"\n            ></mat-icon>\n            <mat-icon\n              *ngIf=\"!column.onClick\"\n              svgIcon=\"{{ row.cellData[column.name].value || column.icon }}\"\n            ></mat-icon>\n          </td>\n        </ng-container>\n        <ng-container\n          *ngIf=\"columnRenderer === entityTableColumnRenderer.ButtonGroup\"\n        >\n          <ng-container *matCellDef=\"let row\">\n            <td\n              mat-cell\n              class=\"mat-cell-text\"\n              [ngClass]=\"row.cellData[column.name].class\"\n            >\n              <span *ngFor=\"let button of row.cellData[column.name].value\">\n                <ng-container\n                  *ngIf=\"\n                    isEdition(row.record) === button.editMode ||\n                    button.editMode === undefined\n                  \"\n                >\n                  <button\n                    *ngIf=\"button.style === 'mat-icon-button'\"\n                    igoStopPropagation\n                    mat-icon-button\n                    [color]=\"button.color\"\n                    (mousedown)=\"onButtonClick(button.click, row.record)\"\n                    [disabled]=\"button.disabled\"\n                  >\n                    <mat-icon svgIcon=\"{{ button.icon }}\"></mat-icon>\n                  </button>\n                  <button\n                    *ngIf=\"button.style !== 'mat-icon-button'\"\n                    igoStopPropagation\n                    mat-mini-fab\n                    [color]=\"button.color\"\n                    (mousedown)=\"onButtonClick(button.click, row.record)\"\n                    [disabled]=\"button.disabled\"\n                  >\n                    <mat-icon svgIcon=\"{{ button.icon }}\"></mat-icon>\n                  </button>\n                </ng-container>\n              </span>\n            </td>\n          </ng-container>\n        </ng-container>\n      </ng-container>\n    </ng-container>\n\n    <tr\n      mat-header-row\n      *matHeaderRowDef=\"headers; sticky: fixedHeader\"\n      [ngClass]=\"getHeaderClass()\"\n    ></tr>\n    <tr\n      mat-row\n      igoEntityTableRow\n      *matRowDef=\"let row; columns: headers\"\n      [scrollBehavior]=\"scrollBehavior\"\n      [ngClass]=\"getRowClass(row.record)\"\n      [selection]=\"selection\"\n      [selected]=\"rowIsSelected(row.record)\"\n      (select)=\"onRowSelect(row.record)\"\n      (click)=\"onRowClick(row.record)\"\n    ></tr>\n  </table>\n  <igo-entity-table-paginator\n    *ngIf=\"withPaginator\"\n    [store]=\"store\"\n    [paginatorOptions]=\"paginatorOptions\"\n    [entitySortChange$]=\"entitySortChange$\"\n    (paginatorChange)=\"paginatorChange($event)\"\n  >\n  </igo-entity-table-paginator>\n</div>\n", styles: [":host{width:100%;height:100%;display:block}:host.table-compact tr.mat-mdc-header-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:36px}:host.table-compact tr.mat-mdc-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:28px}:host .table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}:host .mat-cell-text{overflow:hidden;word-wrap:break-word}:host entity-table table.igo-entity-table-with-selection tr:hover{-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd;cursor:pointer}:host table button{margin:7px}:host .class_hidden{visibility:hidden}:host .class_display_none{display:none}:host .class_boolean,:host .class_icon,:host .class_number{text-align:center;padding-right:35px!important}:host .class_string,:host .class_text,:host .class_number_edition{text-align:left}:host td.edition{background:#a6a6a633}:host input{border-bottom:1px solid darkgrey}\n"] }]
+                    ], template: "<div class=\"table-container\" [ngStyle]=\"{ height: tableHeight }\">\r\n  <table\r\n    id=\"currentWorkspaceTable\"\r\n    mat-table\r\n    matSort\r\n    [ngClass]=\"getTableClass()\"\r\n    [dataSource]=\"dataSource\"\r\n    [trackBy]=\"getTrackByFunction()\"\r\n    (matSortChange)=\"onSort($event)\"\r\n  >\r\n    <ng-container matColumnDef=\"selectionCheckbox\" class=\"mat-cell-checkbox\">\r\n      <th mat-header-cell *matHeaderCellDef>\r\n        <ng-container *ngIf=\"selectMany\">\r\n          <ng-container *ngIf=\"selectionState$ | async as selectionState\">\r\n            <mat-checkbox\r\n              (change)=\"onToggleRows($event.checked)\"\r\n              [checked]=\"selectionState === entityTableSelectionState.All\"\r\n              [indeterminate]=\"\r\n                selectionState === entityTableSelectionState.Some\r\n              \"\r\n            >\r\n            </mat-checkbox>\r\n          </ng-container>\r\n        </ng-container>\r\n      </th>\r\n      <td mat-cell *matCellDef=\"let row\">\r\n        <mat-checkbox\r\n          (mousedown)=\"$event.shiftKey ? $event.preventDefault() : null\"\r\n          (click)=\"\r\n            $event.shiftKey\r\n              ? onShiftToggleRow(!rowIsSelected(row.record), row.record, $event)\r\n              : $event.stopPropagation()\r\n          \"\r\n          (change)=\"onToggleRow($event.checked, row.record)\"\r\n          [checked]=\"rowIsSelected(row.record)\"\r\n        >\r\n        </mat-checkbox>\r\n      </td>\r\n    </ng-container>\r\n\r\n    <ng-container\r\n      [matColumnDef]=\"column.name\"\r\n      *ngFor=\"let column of template.columns\"\r\n    >\r\n      <ng-container *ngIf=\"columnIsSortable(column)\">\r\n        <th\r\n          mat-header-cell\r\n          *matHeaderCellDef\r\n          mat-sort-header\r\n          [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\r\n        >\r\n          {{ column.title }}\r\n        </th>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"!columnIsSortable(column)\">\r\n        <th\r\n          mat-header-cell\r\n          *matHeaderCellDef\r\n          [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\r\n        >\r\n          {{ column.title }}\r\n        </th>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"getColumnRenderer(column) as columnRenderer\">\r\n        <ng-container\r\n          *ngIf=\"columnRenderer === entityTableColumnRenderer.Default\"\r\n        >\r\n          <ng-container *matCellDef=\"let row\">\r\n            <td\r\n              mat-cell\r\n              class=\"mat-cell-text\"\r\n              *ngIf=\"!row.cellData[column.name].isUrl; else isAnUrlDefault\"\r\n              [ngClass]=\"row.cellData[column.name].class\"\r\n            >\r\n              {{ row.cellData[column.name].value }}\r\n            </td>\r\n            <ng-template #isAnUrlDefault>\r\n              <td\r\n                mat-cell\r\n                class=\"mat-cell-text\"\r\n                [ngClass]=\"row.cellData[column.name].class\"\r\n              >\r\n                <a\r\n                  href=\"{{ row.cellData[column.name].value }}\"\r\n                  target=\"_blank\"\r\n                  rel=\"noopener noreferrer\"\r\n                  (click)=\"$event.stopPropagation()\"\r\n                >\r\n                  <img\r\n                    igoImageError\r\n                    *ngIf=\"row.cellData[column.name].isImg; else notImg\"\r\n                    src=\"{{\r\n                      row.cellData[column.name].value | secureImage | async\r\n                    }}\"\r\n                    width=\"50\"\r\n                    heigth=\"auto\"\r\n                  />\r\n                  <ng-template #notImg\r\n                    ><span\r\n                      >{{ 'igo.common.entity-table.targetHtmlUrl' | translate }}\r\n                    </span></ng-template\r\n                  >\r\n                </a>\r\n              </td>\r\n            </ng-template>\r\n          </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"columnRenderer === entityTableColumnRenderer.HTML\">\r\n          <ng-container *matCellDef=\"let row\">\r\n            <td\r\n              mat-cell\r\n              class=\"mat-cell-text\"\r\n              *ngIf=\"!row.cellData[column.name].isUrl; else isAnUrlHTML\"\r\n              [ngClass]=\"row.cellData[column.name].class\"\r\n              [innerHTML]=\"row.cellData[column.name].value\"\r\n            ></td>\r\n            <ng-template #isAnUrlHTML>\r\n              <td\r\n                mat-cell\r\n                class=\"mat-cell-text\"\r\n                [ngClass]=\"row.cellData[column.name].class\"\r\n              >\r\n                <a\r\n                  href=\"{{ row.cellData[column.name].value }}\"\r\n                  target=\"_blank\"\r\n                  rel=\"noopener noreferrer\"\r\n                  (click)=\"$event.stopPropagation()\"\r\n                >\r\n                  <img\r\n                    igoImageError\r\n                    *ngIf=\"row.cellData[column.name].isImg; else notImg\"\r\n                    src=\"{{\r\n                      row.cellData[column.name].value | secureImage | async\r\n                    }}\"\r\n                    width=\"50\"\r\n                    heigth=\"auto\"\r\n                  />\r\n                  <ng-template #notImg\r\n                    ><span\r\n                      >{{ 'igo.geo.targetHtmlUrl' | translate }}\r\n                    </span></ng-template\r\n                  >\r\n                </a>\r\n              </td>\r\n            </ng-template>\r\n          </ng-container>\r\n        </ng-container>\r\n        <ng-container\r\n          *ngIf=\"columnRenderer === entityTableColumnRenderer.UnsanitizedHTML\"\r\n        >\r\n          <ng-container *matCellDef=\"let row\">\r\n            <td\r\n              mat-cell\r\n              class=\"mat-cell-text edition\"\r\n              [formGroup]=\"formGroup\"\r\n              *ngIf=\"isEdition(row.record); else isUnsanitizedHTML\"\r\n              [ngClass]=\"row.cellData[column.name].class\"\r\n            >\r\n              <div class=\"date-picker\" *ngIf=\"column.type === 'date'\">\r\n                <mat-datepicker-toggle\r\n                  matSuffix\r\n                  [for]=\"picker\"\r\n                ></mat-datepicker-toggle>\r\n                <input\r\n                  matInput\r\n                  [matDatepicker]=\"picker\"\r\n                  [formControlName]=\"column.name\"\r\n                  value=\"{{ row.cellData[column.name].value }}\"\r\n                  (dateChange)=\"onDateChange(column.name, row.record, $event)\"\r\n                />\r\n                <mat-datepicker #picker></mat-datepicker>\r\n              </div>\r\n              <input\r\n                matInput\r\n                type=\"time\"\r\n                *ngIf=\"column.type === 'time'\"\r\n                [formControlName]=\"column.name\"\r\n                step=\"900\"\r\n                (focus)=\"column.onFocus($event)\"\r\n                (keypress)=\"column.onChange($event)\"\r\n                (blur)=\"column.onBlur($event)\"\r\n              />\r\n              <input\r\n                matInput\r\n                type=\"number\"\r\n                class=\"class_number_edition\"\r\n                *ngIf=\"column.type === 'number'\"\r\n                [formControlName]=\"column.name\"\r\n                step=\"{{ column.step }}\"\r\n                value=\"{{ row.cellData[column.name].value }}\"\r\n                (input)=\"onValueChange(column.name, row.record, $event)\"\r\n                readonly=\"{{ getValidationAttributeValue(column, 'readonly') }}\"\r\n                required=\"{{\r\n                  getValidationAttributeValue(column, 'mandatory')\r\n                }}\"\r\n                min=\"{{ getValidationAttributeValue(column, 'minValue') }}\"\r\n                max=\"{{ getValidationAttributeValue(column, 'maxValue') }}\"\r\n              />\r\n              <input\r\n                matInput\r\n                type=\"text\"\r\n                *ngIf=\"!column.type || column.type === 'string'\"\r\n                [formControlName]=\"column.name\"\r\n                value=\"{{ row.cellData[column.name].value }}\"\r\n                (input)=\"onValueChange(column.name, row.record, $event)\"\r\n                readonly=\"{{ getValidationAttributeValue(column, 'readonly') }}\"\r\n                required=\"{{\r\n                  getValidationAttributeValue(column, 'mandatory')\r\n                }}\"\r\n              />\r\n              <mat-checkbox\r\n                *ngIf=\"column.type === 'boolean'\"\r\n                [formControlName]=\"column.name\"\r\n                [checked]=\"row.cellData[column.name].value\"\r\n                (change)=\"onBooleanValueChange(column.name, row.record, $event)\"\r\n              ></mat-checkbox>\r\n              <mat-select\r\n                *ngIf=\"column.type === 'list'\"\r\n                required=\"{{\r\n                  getValidationAttributeValue(column, 'mandatory')\r\n                }}\"\r\n                [formControlName]=\"column.name\"\r\n                [multiple]=\"column.multiple\"\r\n                (selectionChange)=\"\r\n                  onSelectValueChange(column.name, row.record, $event)\r\n                \"\r\n                [value]=\"row.cellData[column.name].value\"\r\n              >\r\n                <mat-option\r\n                  *ngFor=\"let option of column.domainValues\"\r\n                  [value]=\"option.id\"\r\n                  [disabled]=\"option.disabled\"\r\n                >\r\n                  {{ option.value }}\r\n                </mat-option>\r\n              </mat-select>\r\n              <input\r\n                matInput\r\n                type=\"text\"\r\n                [formControlName]=\"column.name\"\r\n                *ngIf=\"column.type === 'autocomplete'\"\r\n                [matAutocomplete]=\"auto\"\r\n                required=\"{{\r\n                  getValidationAttributeValue(column, 'mandatory')\r\n                }}\"\r\n                value=\"{{ row.cellData[column.name].value }}\"\r\n                readonly=\"{{ getValidationAttributeValue(column, 'readonly') }}\"\r\n              />\r\n              <mat-autocomplete\r\n                #auto=\"matAutocomplete\"\r\n                (optionSelected)=\"\r\n                  onAutocompleteValueChange(column, row.record, $event)\r\n                \"\r\n                panelWidth=\"430px\"\r\n              >\r\n                <mat-option\r\n                  *ngFor=\"let option of filteredOptions[column.name] | async\"\r\n                  [value]=\"option.id\"\r\n                >\r\n                  {{ option.value }}\r\n                </mat-option>\r\n              </mat-autocomplete>\r\n            </td>\r\n            <ng-template #isUnsanitizedHTML>\r\n              <td\r\n                mat-cell\r\n                class=\"mat-cell-text\"\r\n                *ngIf=\"\r\n                  !row.cellData[column.name].isUrl;\r\n                  else isAnUrlUnsanitizedHTML\r\n                \"\r\n                [ngClass]=\"row.cellData[column.name].class\"\r\n                [innerHTML]=\"row.cellData[column.name].value | sanitizeHtml\"\r\n              ></td>\r\n              <ng-template #isAnUrlUnsanitizedHTML>\r\n                <td\r\n                  mat-cell\r\n                  class=\"mat-cell-text\"\r\n                  [ngClass]=\"row.cellData[column.name].class\"\r\n                >\r\n                  <a\r\n                    href=\"{{ row.cellData[column.name].value }}\"\r\n                    target=\"_blank\"\r\n                    rel=\"noopener noreferrer\"\r\n                    (click)=\"$event.stopPropagation()\"\r\n                  >\r\n                    <img\r\n                      igoImageError\r\n                      *ngIf=\"row.cellData[column.name].isImg; else notImg\"\r\n                      src=\"{{\r\n                        row.cellData[column.name].value | secureImage | async\r\n                      }}\"\r\n                      width=\"50\"\r\n                      heigth=\"auto\"\r\n                    />\r\n                    <ng-template #notImg\r\n                      ><span\r\n                        >{{ 'igo.geo.targetHtmlUrl' | translate }}\r\n                      </span></ng-template\r\n                    >\r\n                  </a>\r\n                </td>\r\n              </ng-template>\r\n            </ng-template>\r\n          </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"columnRenderer === entityTableColumnRenderer.Icon\">\r\n          <td\r\n            mat-cell\r\n            *matCellDef=\"let row\"\r\n            class=\"mat-cell-text\"\r\n            [ngClass]=\"row.cellData[column.name].class\"\r\n          >\r\n            <mat-icon\r\n              *ngIf=\"column.onClick\"\r\n              svgIcon=\"{{ row.cellData[column.name].value || column.icon }}\"\r\n              (click)=\"column.onClick($event)\"\r\n            ></mat-icon>\r\n            <mat-icon\r\n              *ngIf=\"!column.onClick\"\r\n              svgIcon=\"{{ row.cellData[column.name].value || column.icon }}\"\r\n            ></mat-icon>\r\n          </td>\r\n        </ng-container>\r\n        <ng-container\r\n          *ngIf=\"columnRenderer === entityTableColumnRenderer.ButtonGroup\"\r\n        >\r\n          <ng-container *matCellDef=\"let row\">\r\n            <td\r\n              mat-cell\r\n              class=\"mat-cell-text\"\r\n              [ngClass]=\"row.cellData[column.name].class\"\r\n            >\r\n              <span *ngFor=\"let button of row.cellData[column.name].value\">\r\n                <ng-container\r\n                  *ngIf=\"\r\n                    isEdition(row.record) === button.editMode ||\r\n                    button.editMode === undefined\r\n                  \"\r\n                >\r\n                  <button\r\n                    *ngIf=\"button.style === 'mat-icon-button'\"\r\n                    igoStopPropagation\r\n                    mat-icon-button\r\n                    [color]=\"button.color\"\r\n                    (mousedown)=\"onButtonClick(button.click, row.record)\"\r\n                    [disabled]=\"button.disabled\"\r\n                  >\r\n                    <mat-icon svgIcon=\"{{ button.icon }}\"></mat-icon>\r\n                  </button>\r\n                  <button\r\n                    *ngIf=\"button.style !== 'mat-icon-button'\"\r\n                    igoStopPropagation\r\n                    mat-mini-fab\r\n                    [color]=\"button.color\"\r\n                    (mousedown)=\"onButtonClick(button.click, row.record)\"\r\n                    [disabled]=\"button.disabled\"\r\n                  >\r\n                    <mat-icon svgIcon=\"{{ button.icon }}\"></mat-icon>\r\n                  </button>\r\n                </ng-container>\r\n              </span>\r\n            </td>\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n    </ng-container>\r\n\r\n    <tr\r\n      mat-header-row\r\n      *matHeaderRowDef=\"headers; sticky: fixedHeader\"\r\n      [ngClass]=\"getHeaderClass()\"\r\n    ></tr>\r\n    <tr\r\n      mat-row\r\n      igoEntityTableRow\r\n      *matRowDef=\"let row; columns: headers\"\r\n      [scrollBehavior]=\"scrollBehavior\"\r\n      [ngClass]=\"getRowClass(row.record)\"\r\n      [selection]=\"selection\"\r\n      [selected]=\"rowIsSelected(row.record)\"\r\n      (select)=\"onRowSelect(row.record)\"\r\n      (click)=\"onRowClick(row.record)\"\r\n    ></tr>\r\n  </table>\r\n  <igo-entity-table-paginator\r\n    *ngIf=\"withPaginator\"\r\n    [store]=\"store\"\r\n    [paginatorOptions]=\"paginatorOptions\"\r\n    [entitySortChange$]=\"entitySortChange$\"\r\n    (paginatorChange)=\"paginatorChange($event)\"\r\n  >\r\n  </igo-entity-table-paginator>\r\n</div>\r\n", styles: [":host{width:100%;height:100%;display:block}:host.table-compact tr.mat-mdc-header-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:36px}:host.table-compact tr.mat-mdc-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:28px}:host .table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}:host .mat-cell-text{overflow:hidden;word-wrap:break-word}:host entity-table table.igo-entity-table-with-selection tr:hover{-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd;cursor:pointer}:host table button{margin:7px}:host .class_hidden{visibility:hidden}:host .class_display_none{display:none}:host .class_boolean,:host .class_icon,:host .class_number{text-align:center;padding-right:35px!important}:host .class_string,:host .class_text,:host .class_number_edition{text-align:left}:host td.edition{background:#a6a6a633}:host input{border-bottom:1px solid darkgrey}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$4.UntypedFormBuilder }, { type: i2$3.FocusMonitor }, { type: i0.ElementRef }, { type: i1$4.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -3449,11 +3449,11 @@ class ActionbarComponent {
         this.elRef.nativeElement.scrollBy(0, -52);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionbarComponent, deps: [{ token: i1$5.Overlay }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$1.MediaService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ActionbarComponent, selector: "igo-actionbar", inputs: { store: "store", mode: "mode", withToggleButton: "withToggleButton", horizontal: "horizontal", color: "color", iconColor: "iconColor", withTitle: "withTitle", withTooltip: "withTooltip", scrollActive: "scrollActive", withIcon: "withIcon", icon: "icon", xPosition: "xPosition", yPosition: "yPosition", overlayClass: "overlayClass" }, host: { properties: { "class.is-collapsed": "this.isCollapsed", "class.with-title": "this.withTitleClass", "class.with-icon": "this.withIconClass", "class.horizontal": "this.horizontalClass" } }, usesOnChanges: true, ngImport: i0, template: "<div\n  *ngIf=\"heightCondition && positionConditionTop && isDesktop\"\n  id=\"topChevron\"\n>\n  <button\n    mat-icon-button\n    tooltip-position=\"below\"\n    matTooltipShowDelay=\"500\"\n    [matTooltip]=\"'igo.common.actionbar.scrollUp' | translate\"\n    (click)=\"scrollUp()\"\n  >\n    <mat-icon svgIcon=\"chevron-up\"></mat-icon>\n  </button>\n</div>\n<mat-list *ngIf=\"mode === actionbarMode.Dock\" matListItemIcon>\n  <igo-actionbar-item\n    *ngIf=\"withToggleButton\"\n    color=\"accent\"\n    [withTitle]=\"false\"\n    [withIcon]=\"true\"\n    [color]=\"color\"\n    [disabled]=\"store.view.empty\"\n    [action]=\"toggleCollapseAction\"\n    (trigger)=\"onTriggerAction(toggleCollapseAction)\"\n  >\n  </igo-actionbar-item>\n\n  <ng-template\n    #buttonContent\n    *ngIf=\"!collapsed\"\n    ngFor\n    let-action\n    [ngForOf]=\"store.view.all$() | async\"\n  >\n    <igo-actionbar-item\n      color=\"accent\"\n      [withTitle]=\"withTitle\"\n      [withIcon]=\"withIcon\"\n      [withTooltip]=\"withTooltip\"\n      [color]=\"color\"\n      [disabled]=\"store.state.get(action).disabled\"\n      [action]=\"action\"\n      (trigger)=\"onTriggerAction(action)\"\n    >\n    </igo-actionbar-item>\n  </ng-template>\n</mat-list>\n\n<div\n  *ngIf=\"heightCondition && positionConditionLow && isDesktop\"\n  id=\"lowChevron\"\n>\n  <button\n    mat-icon-button\n    tooltip-position=\"below\"\n    matTooltipShowDelay=\"500\"\n    [matTooltip]=\"'igo.common.actionbar.scrollDown' | translate\"\n    (click)=\"scrollDown()\"\n  >\n    <mat-icon svgIcon=\"chevron-down\"></mat-icon>\n  </button>\n</div>\n\n<div *ngIf=\"mode === actionbarMode.Overlay\">\n  <button\n    class=\"buttonOverlay\"\n    mat-icon-button\n    tooltip-position=\"below\"\n    matTooltipShowDelay=\"500\"\n    [matTooltip]=\"'igo.common.actionbar.icon' | translate\"\n    [matMenuTriggerFor]=\"actionbarMenu\"\n    [disabled]=\"store.view.empty\"\n    [color]=\"iconColor\"\n  >\n    <mat-icon [svgIcon]=\"icon\"></mat-icon>\n  </button>\n\n  <mat-menu\n    #actionbarMenu=\"matMenu\"\n    class=\"igo-compact-menu igo-no-min-width-menu\"\n    overlapTrigger=\"true\"\n    [xPosition]=\"xPosition\"\n    [yPosition]=\"yPosition\"\n    [class]=\"overlayClass\"\n  >\n    <mat-list>\n      <ng-template ngFor let-action [ngForOf]=\"store.view.all$() | async\">\n        <igo-actionbar-item\n          color=\"accent\"\n          [withTitle]=\"withTitle\"\n          [withIcon]=\"withIcon\"\n          [color]=\"color\"\n          [action]=\"action\"\n          (trigger)=\"onTriggerAction(action)\"\n        >\n        </igo-actionbar-item>\n      </ng-template>\n    </mat-list>\n  </mat-menu>\n</div>\n<mat-card\n  *ngIf=\"mode === actionbarMode.Context\"\n  class=\"context-menu-card mat-elevation-z4\"\n>\n  <mat-list>\n    <ng-template ngFor let-action [ngForOf]=\"store.view.all$() | async\">\n      <igo-actionbar-item\n        color=\"accent\"\n        [withTitle]=\"withTitle\"\n        [withIcon]=\"withIcon\"\n        [color]=\"color\"\n        [action]=\"action\"\n        (trigger)=\"onTriggerAction(action)\"\n      >\n      </igo-actionbar-item>\n      <br />\n    </ng-template>\n  </mat-list>\n</mat-card>\n", styles: [":host{display:block;height:100%;overflow:auto;position:relative}:host.horizontal{max-width:100%;overflow:unset}:host.horizontal mat-list{width:auto;white-space:nowrap}:host.horizontal igo-actionbar-item{display:inline-block}:host mat-list{padding-top:0}:host .buttonOverlay{margin:0}:host .context-menu-card{padding:8px 3px;margin:10px}:host #topChevron{position:sticky;top:0;background-color:#fff;z-index:3;display:flex;justify-content:center}@media all and (-ms-high-contrast: none),(-ms-high-contrast: active){:host #topChevron{position:fixed;top:unset}}@supports (-ms-accelerator: true){:host #topChevron{position:fixed;top:unset}}:host #lowChevron{position:sticky;bottom:0;background-color:#fff;z-index:3;display:flex;justify-content:center}:host .igo-actionbar-overlay{min-width:inherit!important;padding-top:0;padding-bottom:0}:host .igo-actionbar-overlay .mat-mdc-list{padding-top:0}:host .igo-actionbar-overlay .mat-mdc-menu-content:not(:empty){padding-top:0;padding-bottom:0}:host ::ng-deep .mdc-list-item__primary-text{white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;line-height:18px;-webkit-box-orient:vertical;-webkit-line-clamp:2}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i7$2.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "directive", type: i7$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i2$1.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "directive", type: i2$1.MatListItemIcon, selector: "[matListItemIcon]" }, { kind: "component", type: i9.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: ActionbarItemComponent, selector: "igo-actionbar-item", inputs: ["action", "color", "withTitle", "withIcon", "withTooltip", "disabled", "noDisplay"], outputs: ["trigger"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ActionbarComponent, selector: "igo-actionbar", inputs: { store: "store", mode: "mode", withToggleButton: "withToggleButton", horizontal: "horizontal", color: "color", iconColor: "iconColor", withTitle: "withTitle", withTooltip: "withTooltip", scrollActive: "scrollActive", withIcon: "withIcon", icon: "icon", xPosition: "xPosition", yPosition: "yPosition", overlayClass: "overlayClass" }, host: { properties: { "class.is-collapsed": "this.isCollapsed", "class.with-title": "this.withTitleClass", "class.with-icon": "this.withIconClass", "class.horizontal": "this.horizontalClass" } }, usesOnChanges: true, ngImport: i0, template: "<div\r\n  *ngIf=\"heightCondition && positionConditionTop && isDesktop\"\r\n  id=\"topChevron\"\r\n>\r\n  <button\r\n    mat-icon-button\r\n    tooltip-position=\"below\"\r\n    matTooltipShowDelay=\"500\"\r\n    [matTooltip]=\"'igo.common.actionbar.scrollUp' | translate\"\r\n    (click)=\"scrollUp()\"\r\n  >\r\n    <mat-icon svgIcon=\"chevron-up\"></mat-icon>\r\n  </button>\r\n</div>\r\n<mat-list *ngIf=\"mode === actionbarMode.Dock\" matListItemIcon>\r\n  <igo-actionbar-item\r\n    *ngIf=\"withToggleButton\"\r\n    color=\"accent\"\r\n    [withTitle]=\"false\"\r\n    [withIcon]=\"true\"\r\n    [color]=\"color\"\r\n    [disabled]=\"store.view.empty\"\r\n    [action]=\"toggleCollapseAction\"\r\n    (trigger)=\"onTriggerAction(toggleCollapseAction)\"\r\n  >\r\n  </igo-actionbar-item>\r\n\r\n  <ng-template\r\n    #buttonContent\r\n    *ngIf=\"!collapsed\"\r\n    ngFor\r\n    let-action\r\n    [ngForOf]=\"store.view.all$() | async\"\r\n  >\r\n    <igo-actionbar-item\r\n      color=\"accent\"\r\n      [withTitle]=\"withTitle\"\r\n      [withIcon]=\"withIcon\"\r\n      [withTooltip]=\"withTooltip\"\r\n      [color]=\"color\"\r\n      [disabled]=\"store.state.get(action).disabled\"\r\n      [action]=\"action\"\r\n      (trigger)=\"onTriggerAction(action)\"\r\n    >\r\n    </igo-actionbar-item>\r\n  </ng-template>\r\n</mat-list>\r\n\r\n<div\r\n  *ngIf=\"heightCondition && positionConditionLow && isDesktop\"\r\n  id=\"lowChevron\"\r\n>\r\n  <button\r\n    mat-icon-button\r\n    tooltip-position=\"below\"\r\n    matTooltipShowDelay=\"500\"\r\n    [matTooltip]=\"'igo.common.actionbar.scrollDown' | translate\"\r\n    (click)=\"scrollDown()\"\r\n  >\r\n    <mat-icon svgIcon=\"chevron-down\"></mat-icon>\r\n  </button>\r\n</div>\r\n\r\n<div *ngIf=\"mode === actionbarMode.Overlay\">\r\n  <button\r\n    class=\"buttonOverlay\"\r\n    mat-icon-button\r\n    tooltip-position=\"below\"\r\n    matTooltipShowDelay=\"500\"\r\n    [matTooltip]=\"'igo.common.actionbar.icon' | translate\"\r\n    [matMenuTriggerFor]=\"actionbarMenu\"\r\n    [disabled]=\"store.view.empty\"\r\n    [color]=\"iconColor\"\r\n  >\r\n    <mat-icon [svgIcon]=\"icon\"></mat-icon>\r\n  </button>\r\n\r\n  <mat-menu\r\n    #actionbarMenu=\"matMenu\"\r\n    class=\"igo-compact-menu igo-no-min-width-menu\"\r\n    overlapTrigger=\"true\"\r\n    [xPosition]=\"xPosition\"\r\n    [yPosition]=\"yPosition\"\r\n    [class]=\"overlayClass\"\r\n  >\r\n    <mat-list>\r\n      <ng-template ngFor let-action [ngForOf]=\"store.view.all$() | async\">\r\n        <igo-actionbar-item\r\n          color=\"accent\"\r\n          [withTitle]=\"withTitle\"\r\n          [withIcon]=\"withIcon\"\r\n          [color]=\"color\"\r\n          [action]=\"action\"\r\n          (trigger)=\"onTriggerAction(action)\"\r\n        >\r\n        </igo-actionbar-item>\r\n      </ng-template>\r\n    </mat-list>\r\n  </mat-menu>\r\n</div>\r\n<mat-card\r\n  *ngIf=\"mode === actionbarMode.Context\"\r\n  class=\"context-menu-card mat-elevation-z4\"\r\n>\r\n  <mat-list>\r\n    <ng-template ngFor let-action [ngForOf]=\"store.view.all$() | async\">\r\n      <igo-actionbar-item\r\n        color=\"accent\"\r\n        [withTitle]=\"withTitle\"\r\n        [withIcon]=\"withIcon\"\r\n        [color]=\"color\"\r\n        [action]=\"action\"\r\n        (trigger)=\"onTriggerAction(action)\"\r\n      >\r\n      </igo-actionbar-item>\r\n      <br />\r\n    </ng-template>\r\n  </mat-list>\r\n</mat-card>\r\n", styles: [":host{display:block;height:100%;overflow:auto;position:relative}:host.horizontal{max-width:100%;overflow:unset}:host.horizontal mat-list{width:auto;white-space:nowrap}:host.horizontal igo-actionbar-item{display:inline-block}:host mat-list{padding-top:0}:host .buttonOverlay{margin:0}:host .context-menu-card{padding:8px 3px;margin:10px}:host #topChevron{position:sticky;top:0;background-color:#fff;z-index:3;display:flex;justify-content:center}@media all and (-ms-high-contrast: none),(-ms-high-contrast: active){:host #topChevron{position:fixed;top:unset}}@supports (-ms-accelerator: true){:host #topChevron{position:fixed;top:unset}}:host #lowChevron{position:sticky;bottom:0;background-color:#fff;z-index:3;display:flex;justify-content:center}:host .igo-actionbar-overlay{min-width:inherit!important;padding-top:0;padding-bottom:0}:host .igo-actionbar-overlay .mat-mdc-list{padding-top:0}:host .igo-actionbar-overlay .mat-mdc-menu-content:not(:empty){padding-top:0;padding-bottom:0}:host ::ng-deep .mdc-list-item__primary-text{white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;line-height:18px;-webkit-box-orient:vertical;-webkit-line-clamp:2}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i7$2.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "directive", type: i7$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i2$1.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "directive", type: i2$1.MatListItemIcon, selector: "[matListItemIcon]" }, { kind: "component", type: i9.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: ActionbarItemComponent, selector: "igo-actionbar-item", inputs: ["action", "color", "withTitle", "withIcon", "withTooltip", "disabled", "noDisplay"], outputs: ["trigger"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-actionbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  *ngIf=\"heightCondition && positionConditionTop && isDesktop\"\n  id=\"topChevron\"\n>\n  <button\n    mat-icon-button\n    tooltip-position=\"below\"\n    matTooltipShowDelay=\"500\"\n    [matTooltip]=\"'igo.common.actionbar.scrollUp' | translate\"\n    (click)=\"scrollUp()\"\n  >\n    <mat-icon svgIcon=\"chevron-up\"></mat-icon>\n  </button>\n</div>\n<mat-list *ngIf=\"mode === actionbarMode.Dock\" matListItemIcon>\n  <igo-actionbar-item\n    *ngIf=\"withToggleButton\"\n    color=\"accent\"\n    [withTitle]=\"false\"\n    [withIcon]=\"true\"\n    [color]=\"color\"\n    [disabled]=\"store.view.empty\"\n    [action]=\"toggleCollapseAction\"\n    (trigger)=\"onTriggerAction(toggleCollapseAction)\"\n  >\n  </igo-actionbar-item>\n\n  <ng-template\n    #buttonContent\n    *ngIf=\"!collapsed\"\n    ngFor\n    let-action\n    [ngForOf]=\"store.view.all$() | async\"\n  >\n    <igo-actionbar-item\n      color=\"accent\"\n      [withTitle]=\"withTitle\"\n      [withIcon]=\"withIcon\"\n      [withTooltip]=\"withTooltip\"\n      [color]=\"color\"\n      [disabled]=\"store.state.get(action).disabled\"\n      [action]=\"action\"\n      (trigger)=\"onTriggerAction(action)\"\n    >\n    </igo-actionbar-item>\n  </ng-template>\n</mat-list>\n\n<div\n  *ngIf=\"heightCondition && positionConditionLow && isDesktop\"\n  id=\"lowChevron\"\n>\n  <button\n    mat-icon-button\n    tooltip-position=\"below\"\n    matTooltipShowDelay=\"500\"\n    [matTooltip]=\"'igo.common.actionbar.scrollDown' | translate\"\n    (click)=\"scrollDown()\"\n  >\n    <mat-icon svgIcon=\"chevron-down\"></mat-icon>\n  </button>\n</div>\n\n<div *ngIf=\"mode === actionbarMode.Overlay\">\n  <button\n    class=\"buttonOverlay\"\n    mat-icon-button\n    tooltip-position=\"below\"\n    matTooltipShowDelay=\"500\"\n    [matTooltip]=\"'igo.common.actionbar.icon' | translate\"\n    [matMenuTriggerFor]=\"actionbarMenu\"\n    [disabled]=\"store.view.empty\"\n    [color]=\"iconColor\"\n  >\n    <mat-icon [svgIcon]=\"icon\"></mat-icon>\n  </button>\n\n  <mat-menu\n    #actionbarMenu=\"matMenu\"\n    class=\"igo-compact-menu igo-no-min-width-menu\"\n    overlapTrigger=\"true\"\n    [xPosition]=\"xPosition\"\n    [yPosition]=\"yPosition\"\n    [class]=\"overlayClass\"\n  >\n    <mat-list>\n      <ng-template ngFor let-action [ngForOf]=\"store.view.all$() | async\">\n        <igo-actionbar-item\n          color=\"accent\"\n          [withTitle]=\"withTitle\"\n          [withIcon]=\"withIcon\"\n          [color]=\"color\"\n          [action]=\"action\"\n          (trigger)=\"onTriggerAction(action)\"\n        >\n        </igo-actionbar-item>\n      </ng-template>\n    </mat-list>\n  </mat-menu>\n</div>\n<mat-card\n  *ngIf=\"mode === actionbarMode.Context\"\n  class=\"context-menu-card mat-elevation-z4\"\n>\n  <mat-list>\n    <ng-template ngFor let-action [ngForOf]=\"store.view.all$() | async\">\n      <igo-actionbar-item\n        color=\"accent\"\n        [withTitle]=\"withTitle\"\n        [withIcon]=\"withIcon\"\n        [color]=\"color\"\n        [action]=\"action\"\n        (trigger)=\"onTriggerAction(action)\"\n      >\n      </igo-actionbar-item>\n      <br />\n    </ng-template>\n  </mat-list>\n</mat-card>\n", styles: [":host{display:block;height:100%;overflow:auto;position:relative}:host.horizontal{max-width:100%;overflow:unset}:host.horizontal mat-list{width:auto;white-space:nowrap}:host.horizontal igo-actionbar-item{display:inline-block}:host mat-list{padding-top:0}:host .buttonOverlay{margin:0}:host .context-menu-card{padding:8px 3px;margin:10px}:host #topChevron{position:sticky;top:0;background-color:#fff;z-index:3;display:flex;justify-content:center}@media all and (-ms-high-contrast: none),(-ms-high-contrast: active){:host #topChevron{position:fixed;top:unset}}@supports (-ms-accelerator: true){:host #topChevron{position:fixed;top:unset}}:host #lowChevron{position:sticky;bottom:0;background-color:#fff;z-index:3;display:flex;justify-content:center}:host .igo-actionbar-overlay{min-width:inherit!important;padding-top:0;padding-bottom:0}:host .igo-actionbar-overlay .mat-mdc-list{padding-top:0}:host .igo-actionbar-overlay .mat-mdc-menu-content:not(:empty){padding-top:0;padding-bottom:0}:host ::ng-deep .mdc-list-item__primary-text{white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;line-height:18px;-webkit-box-orient:vertical;-webkit-line-clamp:2}\n"] }]
+            args: [{ selector: 'igo-actionbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  *ngIf=\"heightCondition && positionConditionTop && isDesktop\"\r\n  id=\"topChevron\"\r\n>\r\n  <button\r\n    mat-icon-button\r\n    tooltip-position=\"below\"\r\n    matTooltipShowDelay=\"500\"\r\n    [matTooltip]=\"'igo.common.actionbar.scrollUp' | translate\"\r\n    (click)=\"scrollUp()\"\r\n  >\r\n    <mat-icon svgIcon=\"chevron-up\"></mat-icon>\r\n  </button>\r\n</div>\r\n<mat-list *ngIf=\"mode === actionbarMode.Dock\" matListItemIcon>\r\n  <igo-actionbar-item\r\n    *ngIf=\"withToggleButton\"\r\n    color=\"accent\"\r\n    [withTitle]=\"false\"\r\n    [withIcon]=\"true\"\r\n    [color]=\"color\"\r\n    [disabled]=\"store.view.empty\"\r\n    [action]=\"toggleCollapseAction\"\r\n    (trigger)=\"onTriggerAction(toggleCollapseAction)\"\r\n  >\r\n  </igo-actionbar-item>\r\n\r\n  <ng-template\r\n    #buttonContent\r\n    *ngIf=\"!collapsed\"\r\n    ngFor\r\n    let-action\r\n    [ngForOf]=\"store.view.all$() | async\"\r\n  >\r\n    <igo-actionbar-item\r\n      color=\"accent\"\r\n      [withTitle]=\"withTitle\"\r\n      [withIcon]=\"withIcon\"\r\n      [withTooltip]=\"withTooltip\"\r\n      [color]=\"color\"\r\n      [disabled]=\"store.state.get(action).disabled\"\r\n      [action]=\"action\"\r\n      (trigger)=\"onTriggerAction(action)\"\r\n    >\r\n    </igo-actionbar-item>\r\n  </ng-template>\r\n</mat-list>\r\n\r\n<div\r\n  *ngIf=\"heightCondition && positionConditionLow && isDesktop\"\r\n  id=\"lowChevron\"\r\n>\r\n  <button\r\n    mat-icon-button\r\n    tooltip-position=\"below\"\r\n    matTooltipShowDelay=\"500\"\r\n    [matTooltip]=\"'igo.common.actionbar.scrollDown' | translate\"\r\n    (click)=\"scrollDown()\"\r\n  >\r\n    <mat-icon svgIcon=\"chevron-down\"></mat-icon>\r\n  </button>\r\n</div>\r\n\r\n<div *ngIf=\"mode === actionbarMode.Overlay\">\r\n  <button\r\n    class=\"buttonOverlay\"\r\n    mat-icon-button\r\n    tooltip-position=\"below\"\r\n    matTooltipShowDelay=\"500\"\r\n    [matTooltip]=\"'igo.common.actionbar.icon' | translate\"\r\n    [matMenuTriggerFor]=\"actionbarMenu\"\r\n    [disabled]=\"store.view.empty\"\r\n    [color]=\"iconColor\"\r\n  >\r\n    <mat-icon [svgIcon]=\"icon\"></mat-icon>\r\n  </button>\r\n\r\n  <mat-menu\r\n    #actionbarMenu=\"matMenu\"\r\n    class=\"igo-compact-menu igo-no-min-width-menu\"\r\n    overlapTrigger=\"true\"\r\n    [xPosition]=\"xPosition\"\r\n    [yPosition]=\"yPosition\"\r\n    [class]=\"overlayClass\"\r\n  >\r\n    <mat-list>\r\n      <ng-template ngFor let-action [ngForOf]=\"store.view.all$() | async\">\r\n        <igo-actionbar-item\r\n          color=\"accent\"\r\n          [withTitle]=\"withTitle\"\r\n          [withIcon]=\"withIcon\"\r\n          [color]=\"color\"\r\n          [action]=\"action\"\r\n          (trigger)=\"onTriggerAction(action)\"\r\n        >\r\n        </igo-actionbar-item>\r\n      </ng-template>\r\n    </mat-list>\r\n  </mat-menu>\r\n</div>\r\n<mat-card\r\n  *ngIf=\"mode === actionbarMode.Context\"\r\n  class=\"context-menu-card mat-elevation-z4\"\r\n>\r\n  <mat-list>\r\n    <ng-template ngFor let-action [ngForOf]=\"store.view.all$() | async\">\r\n      <igo-actionbar-item\r\n        color=\"accent\"\r\n        [withTitle]=\"withTitle\"\r\n        [withIcon]=\"withIcon\"\r\n        [color]=\"color\"\r\n        [action]=\"action\"\r\n        (trigger)=\"onTriggerAction(action)\"\r\n      >\r\n      </igo-actionbar-item>\r\n      <br />\r\n    </ng-template>\r\n  </mat-list>\r\n</mat-card>\r\n", styles: [":host{display:block;height:100%;overflow:auto;position:relative}:host.horizontal{max-width:100%;overflow:unset}:host.horizontal mat-list{width:auto;white-space:nowrap}:host.horizontal igo-actionbar-item{display:inline-block}:host mat-list{padding-top:0}:host .buttonOverlay{margin:0}:host .context-menu-card{padding:8px 3px;margin:10px}:host #topChevron{position:sticky;top:0;background-color:#fff;z-index:3;display:flex;justify-content:center}@media all and (-ms-high-contrast: none),(-ms-high-contrast: active){:host #topChevron{position:fixed;top:unset}}@supports (-ms-accelerator: true){:host #topChevron{position:fixed;top:unset}}:host #lowChevron{position:sticky;bottom:0;background-color:#fff;z-index:3;display:flex;justify-content:center}:host .igo-actionbar-overlay{min-width:inherit!important;padding-top:0;padding-bottom:0}:host .igo-actionbar-overlay .mat-mdc-list{padding-top:0}:host .igo-actionbar-overlay .mat-mdc-menu-content:not(:empty){padding-top:0;padding-bottom:0}:host ::ng-deep .mdc-list-item__primary-text{white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;line-height:18px;-webkit-box-orient:vertical;-webkit-line-clamp:2}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$5.Overlay }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$1.MediaService }]; }, propDecorators: { store: [{
                 type: Input
             }], mode: [{
@@ -3564,11 +3564,11 @@ class BackdropComponent {
     _shown;
     constructor() { }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BackdropComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: BackdropComponent, selector: "igo-backdrop", inputs: { shown: "shown" }, ngImport: i0, template: "<div [ngClass]=\"{ 'igo-backdrop-shown': shown }\"></div>\n", styles: [":host>div{position:absolute;inset:0;background-color:#64646480;z-index:2;display:none}:host>div.igo-backdrop-shown{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: BackdropComponent, selector: "igo-backdrop", inputs: { shown: "shown" }, ngImport: i0, template: "<div [ngClass]=\"{ 'igo-backdrop-shown': shown }\"></div>\r\n", styles: [":host>div{position:absolute;inset:0;background-color:#64646480;z-index:2;display:none}:host>div.igo-backdrop-shown{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BackdropComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-backdrop', template: "<div [ngClass]=\"{ 'igo-backdrop-shown': shown }\"></div>\n", styles: [":host>div{position:absolute;inset:0;background-color:#64646480;z-index:2;display:none}:host>div.igo-backdrop-shown{display:block}\n"] }]
+            args: [{ selector: 'igo-backdrop', template: "<div [ngClass]=\"{ 'igo-backdrop-shown': shown }\"></div>\r\n", styles: [":host>div{position:absolute;inset:0;background-color:#64646480;z-index:2;display:none}:host>div.igo-backdrop-shown{display:block}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { shown: [{
                 type: Input
             }] } });
@@ -3922,11 +3922,11 @@ class CollapsibleComponent {
     _collapsed = false;
     toggle = new EventEmitter();
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CollapsibleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CollapsibleComponent, selector: "igo-collapsible", inputs: { title: "title", collapsed: "collapsed" }, outputs: { toggle: "toggle" }, ngImport: i0, template: "<mat-list-item>\n  <mat-icon\n    svgIcon=\"chevron-up\"\n    class=\"igo-chevron\"\n    matListItemIcon\n    igoCollapse\n    [target]=\"content\"\n    [collapsed]=\"collapsed\"\n    (toggle)=\"collapsed = $event\"\n  >\n  </mat-icon>\n  <span matListItemTitle>{{ title }}</span>\n</mat-list-item>\n\n<div #content>\n  <ng-content></ng-content>\n</div>\n", styles: [":host ::ng-deep .mat-mdc-list .mat-mdc-list-item.mat-mdc-list-item-avatar{height:auto;width:auto;padding:0}mat-list-item{overflow:hidden}\n"], dependencies: [{ kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i2$1.MatListItemIcon, selector: "[matListItemIcon]" }, { kind: "directive", type: i2$1.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "directive", type: CollapseDirective, selector: "[igoCollapse]", inputs: ["target", "collapsed"], outputs: ["toggle"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CollapsibleComponent, selector: "igo-collapsible", inputs: { title: "title", collapsed: "collapsed" }, outputs: { toggle: "toggle" }, ngImport: i0, template: "<mat-list-item>\r\n  <mat-icon\r\n    svgIcon=\"chevron-up\"\r\n    class=\"igo-chevron\"\r\n    matListItemIcon\r\n    igoCollapse\r\n    [target]=\"content\"\r\n    [collapsed]=\"collapsed\"\r\n    (toggle)=\"collapsed = $event\"\r\n  >\r\n  </mat-icon>\r\n  <span matListItemTitle>{{ title }}</span>\r\n</mat-list-item>\r\n\r\n<div #content>\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [":host ::ng-deep .mat-mdc-list .mat-mdc-list-item.mat-mdc-list-item-avatar{height:auto;width:auto;padding:0}mat-list-item{overflow:hidden}\n"], dependencies: [{ kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i2$1.MatListItemIcon, selector: "[matListItemIcon]" }, { kind: "directive", type: i2$1.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "directive", type: CollapseDirective, selector: "[igoCollapse]", inputs: ["target", "collapsed"], outputs: ["toggle"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CollapsibleComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-collapsible', template: "<mat-list-item>\n  <mat-icon\n    svgIcon=\"chevron-up\"\n    class=\"igo-chevron\"\n    matListItemIcon\n    igoCollapse\n    [target]=\"content\"\n    [collapsed]=\"collapsed\"\n    (toggle)=\"collapsed = $event\"\n  >\n  </mat-icon>\n  <span matListItemTitle>{{ title }}</span>\n</mat-list-item>\n\n<div #content>\n  <ng-content></ng-content>\n</div>\n", styles: [":host ::ng-deep .mat-mdc-list .mat-mdc-list-item.mat-mdc-list-item-avatar{height:auto;width:auto;padding:0}mat-list-item{overflow:hidden}\n"] }]
+            args: [{ selector: 'igo-collapsible', template: "<mat-list-item>\r\n  <mat-icon\r\n    svgIcon=\"chevron-up\"\r\n    class=\"igo-chevron\"\r\n    matListItemIcon\r\n    igoCollapse\r\n    [target]=\"content\"\r\n    [collapsed]=\"collapsed\"\r\n    (toggle)=\"collapsed = $event\"\r\n  >\r\n  </mat-icon>\r\n  <span matListItemTitle>{{ title }}</span>\r\n</mat-list-item>\r\n\r\n<div #content>\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [":host ::ng-deep .mat-mdc-list .mat-mdc-list-item.mat-mdc-list-item-avatar{height:auto;width:auto;padding:0}mat-list-item{overflow:hidden}\n"] }]
         }], propDecorators: { title: [{
                 type: Input
             }], collapsed: [{
@@ -3965,11 +3965,11 @@ class ConfirmDialogComponent {
         this.dialogRef = dialogRef;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConfirmDialogComponent, deps: [{ token: i1$6.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ConfirmDialogComponent, selector: "igo-confirm-dialog", ngImport: i0, template: "<h2 mat-dialog-title class=\"mat-typography\">\n  {{ titleKey | translate }}\n</h2>\n<div mat-dialog-content class=\"mat-typography\">\n  {{ confirmMessage | translate }}\n</div>\n<div mat-dialog-actions>\n  <button mat-raised-button color=\"primary\" (click)=\"dialogRef.close(true)\">\n    {{ proccessKey | translate }}\n  </button>\n  <button mat-flat-button (click)=\"dialogRef.close(false)\">\n    {{ cancelKey | translate }}\n  </button>\n</div>\n", styles: ["h2{margin:5px 0 10px}div[mat-dialog-content]{max-width:200px}div[mat-dialog-actions]{margin:10px 0 0}\n"], dependencies: [{ kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1$6.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$6.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ConfirmDialogComponent, selector: "igo-confirm-dialog", ngImport: i0, template: "<h2 mat-dialog-title class=\"mat-typography\">\r\n  {{ titleKey | translate }}\r\n</h2>\r\n<div mat-dialog-content class=\"mat-typography\">\r\n  {{ confirmMessage | translate }}\r\n</div>\r\n<div mat-dialog-actions>\r\n  <button mat-raised-button color=\"primary\" (click)=\"dialogRef.close(true)\">\r\n    {{ proccessKey | translate }}\r\n  </button>\r\n  <button mat-flat-button (click)=\"dialogRef.close(false)\">\r\n    {{ cancelKey | translate }}\r\n  </button>\r\n</div>\r\n", styles: ["h2{margin:5px 0 10px}div[mat-dialog-content]{max-width:200px}div[mat-dialog-actions]{margin:10px 0 0}\n"], dependencies: [{ kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1$6.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$6.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConfirmDialogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-confirm-dialog', template: "<h2 mat-dialog-title class=\"mat-typography\">\n  {{ titleKey | translate }}\n</h2>\n<div mat-dialog-content class=\"mat-typography\">\n  {{ confirmMessage | translate }}\n</div>\n<div mat-dialog-actions>\n  <button mat-raised-button color=\"primary\" (click)=\"dialogRef.close(true)\">\n    {{ proccessKey | translate }}\n  </button>\n  <button mat-flat-button (click)=\"dialogRef.close(false)\">\n    {{ cancelKey | translate }}\n  </button>\n</div>\n", styles: ["h2{margin:5px 0 10px}div[mat-dialog-content]{max-width:200px}div[mat-dialog-actions]{margin:10px 0 0}\n"] }]
+            args: [{ selector: 'igo-confirm-dialog', template: "<h2 mat-dialog-title class=\"mat-typography\">\r\n  {{ titleKey | translate }}\r\n</h2>\r\n<div mat-dialog-content class=\"mat-typography\">\r\n  {{ confirmMessage | translate }}\r\n</div>\r\n<div mat-dialog-actions>\r\n  <button mat-raised-button color=\"primary\" (click)=\"dialogRef.close(true)\">\r\n    {{ proccessKey | translate }}\r\n  </button>\r\n  <button mat-flat-button (click)=\"dialogRef.close(false)\">\r\n    {{ cancelKey | translate }}\r\n  </button>\r\n</div>\r\n", styles: ["h2{margin:5px 0 10px}div[mat-dialog-content]{max-width:200px}div[mat-dialog-actions]{margin:10px 0 0}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$6.MatDialogRef }]; } });
 
 class ConfirmDialogService {
@@ -4509,14 +4509,14 @@ let FormFieldSelectComponent = class FormFieldSelectComponent {
         this.disabled$.next(disabled);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldSelectComponent, selector: "igo-form-field-select", inputs: { choices: "choices", multiple: "multiple", formControl: "formControl", placeholder: "placeholder", errors: "errors", disableSwitch: "disableSwitch" }, ngImport: i0, template: "<mat-form-field>\n  <mat-select\n    [multiple]=\"multiple\"\n    [required]=\"required\"\n    [placeholder]=\"placeholder\"\n    [formControl]=\"formControl\"\n  >\n    <mat-option *ngFor=\"let choice of choices$ | async\" [value]=\"choice.value\">\n      {{ choice.title }}\n    </mat-option>\n  </mat-select>\n  <mat-icon\n    *ngIf=\"disableSwitch === true\"\n    class=\"igo-form-disable-switch\"\n    [svgIcon]=\"\n      (disabled$ | async) === true\n        ? 'checkbox-blank-outline'\n        : 'checkbox-marked-outline'\n    \"\n    (click)=\"onDisableSwitchClick()\"\n    matPrefix\n  >\n  </mat-icon>\n  <mat-error *ngIf=\"formControl.errors\">{{\n    getErrorMessage() | translate\n  }}</mat-error>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "component", type: i3$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldSelectComponent, selector: "igo-form-field-select", inputs: { choices: "choices", multiple: "multiple", formControl: "formControl", placeholder: "placeholder", errors: "errors", disableSwitch: "disableSwitch" }, ngImport: i0, template: "<mat-form-field>\r\n  <mat-select\r\n    [multiple]=\"multiple\"\r\n    [required]=\"required\"\r\n    [placeholder]=\"placeholder\"\r\n    [formControl]=\"formControl\"\r\n  >\r\n    <mat-option *ngFor=\"let choice of choices$ | async\" [value]=\"choice.value\">\r\n      {{ choice.title }}\r\n    </mat-option>\r\n  </mat-select>\r\n  <mat-icon\r\n    *ngIf=\"disableSwitch === true\"\r\n    class=\"igo-form-disable-switch\"\r\n    [svgIcon]=\"\r\n      (disabled$ | async) === true\r\n        ? 'checkbox-blank-outline'\r\n        : 'checkbox-marked-outline'\r\n    \"\r\n    (click)=\"onDisableSwitchClick()\"\r\n    matPrefix\r\n  >\r\n  </mat-icon>\r\n  <mat-error *ngIf=\"formControl.errors\">{{\r\n    getErrorMessage() | translate\r\n  }}</mat-error>\r\n</mat-form-field>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "component", type: i3$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 FormFieldSelectComponent = __decorate([
     IgoFormFieldComponent('select')
 ], FormFieldSelectComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldSelectComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-form-field-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field>\n  <mat-select\n    [multiple]=\"multiple\"\n    [required]=\"required\"\n    [placeholder]=\"placeholder\"\n    [formControl]=\"formControl\"\n  >\n    <mat-option *ngFor=\"let choice of choices$ | async\" [value]=\"choice.value\">\n      {{ choice.title }}\n    </mat-option>\n  </mat-select>\n  <mat-icon\n    *ngIf=\"disableSwitch === true\"\n    class=\"igo-form-disable-switch\"\n    [svgIcon]=\"\n      (disabled$ | async) === true\n        ? 'checkbox-blank-outline'\n        : 'checkbox-marked-outline'\n    \"\n    (click)=\"onDisableSwitchClick()\"\n    matPrefix\n  >\n  </mat-icon>\n  <mat-error *ngIf=\"formControl.errors\">{{\n    getErrorMessage() | translate\n  }}</mat-error>\n</mat-form-field>\n" }]
+            args: [{ selector: 'igo-form-field-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field>\r\n  <mat-select\r\n    [multiple]=\"multiple\"\r\n    [required]=\"required\"\r\n    [placeholder]=\"placeholder\"\r\n    [formControl]=\"formControl\"\r\n  >\r\n    <mat-option *ngFor=\"let choice of choices$ | async\" [value]=\"choice.value\">\r\n      {{ choice.title }}\r\n    </mat-option>\r\n  </mat-select>\r\n  <mat-icon\r\n    *ngIf=\"disableSwitch === true\"\r\n    class=\"igo-form-disable-switch\"\r\n    [svgIcon]=\"\r\n      (disabled$ | async) === true\r\n        ? 'checkbox-blank-outline'\r\n        : 'checkbox-marked-outline'\r\n    \"\r\n    (click)=\"onDisableSwitchClick()\"\r\n    matPrefix\r\n  >\r\n  </mat-icon>\r\n  <mat-error *ngIf=\"formControl.errors\">{{\r\n    getErrorMessage() | translate\r\n  }}</mat-error>\r\n</mat-form-field>\r\n" }]
         }], propDecorators: { choices: [{
                 type: Input
             }], multiple: [{
@@ -4606,7 +4606,7 @@ let FormFieldTextComponent = class FormFieldTextComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldTextComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldTextComponent, selector: "igo-form-field-text", inputs: { formControl: "formControl", placeholder: "placeholder", isPassword: "isPassword", errors: "errors", disableSwitch: "disableSwitch" }, ngImport: i0, template: "<mat-form-field>\n  <input\n    matInput\n    (blur)=\"delayedHide(0)\"\n    [type]=\"isPassword ? (hide ? 'password' : 'text') : 'text'\"\n    [required]=\"isPassword ? 'true' : required\"\n    [placeholder]=\"placeholder\"\n    [formControl]=\"formControl\"\n    (change)=\"delayedHide()\"\n  />\n  <mat-icon\n    *ngIf=\"disableSwitch === true\"\n    class=\"igo-form-disable-switch\"\n    [svgIcon]=\"\n      (disabled$ | async) === true\n        ? 'checkbox-blank-outline'\n        : 'checkbox-marked-outline'\n    \"\n    (click)=\"onDisableSwitchClick()\"\n    matPrefix\n  >\n  </mat-icon>\n\n  <button\n    type=\"button\"\n    *ngIf=\"isPassword\"\n    matSuffix\n    mat-icon-button\n    (click)=\"togglePassword()\"\n  >\n    <mat-icon color=\"primary\" [svgIcon]=\"hide ? 'eye-off' : 'eye'\"></mat-icon>\n  </button>\n\n  <mat-error *ngIf=\"formControl.errors\">{{\n    getErrorMessage() | translate\n  }}</mat-error>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i5$1.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: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldTextComponent, selector: "igo-form-field-text", inputs: { formControl: "formControl", placeholder: "placeholder", isPassword: "isPassword", errors: "errors", disableSwitch: "disableSwitch" }, ngImport: i0, template: "<mat-form-field>\r\n  <input\r\n    matInput\r\n    (blur)=\"delayedHide(0)\"\r\n    [type]=\"isPassword ? (hide ? 'password' : 'text') : 'text'\"\r\n    [required]=\"isPassword ? 'true' : required\"\r\n    [placeholder]=\"placeholder\"\r\n    [formControl]=\"formControl\"\r\n    (change)=\"delayedHide()\"\r\n  />\r\n  <mat-icon\r\n    *ngIf=\"disableSwitch === true\"\r\n    class=\"igo-form-disable-switch\"\r\n    [svgIcon]=\"\r\n      (disabled$ | async) === true\r\n        ? 'checkbox-blank-outline'\r\n        : 'checkbox-marked-outline'\r\n    \"\r\n    (click)=\"onDisableSwitchClick()\"\r\n    matPrefix\r\n  >\r\n  </mat-icon>\r\n\r\n  <button\r\n    type=\"button\"\r\n    *ngIf=\"isPassword\"\r\n    matSuffix\r\n    mat-icon-button\r\n    (click)=\"togglePassword()\"\r\n  >\r\n    <mat-icon color=\"primary\" [svgIcon]=\"hide ? 'eye-off' : 'eye'\"></mat-icon>\r\n  </button>\r\n\r\n  <mat-error *ngIf=\"formControl.errors\">{{\r\n    getErrorMessage() | translate\r\n  }}</mat-error>\r\n</mat-form-field>\r\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i5$1.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: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 FormFieldTextComponent = __decorate([
     IgoFormFieldComponent('text'),
@@ -4614,7 +4614,7 @@ FormFieldTextComponent = __decorate([
 ], FormFieldTextComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldTextComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-form-field-text', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field>\n  <input\n    matInput\n    (blur)=\"delayedHide(0)\"\n    [type]=\"isPassword ? (hide ? 'password' : 'text') : 'text'\"\n    [required]=\"isPassword ? 'true' : required\"\n    [placeholder]=\"placeholder\"\n    [formControl]=\"formControl\"\n    (change)=\"delayedHide()\"\n  />\n  <mat-icon\n    *ngIf=\"disableSwitch === true\"\n    class=\"igo-form-disable-switch\"\n    [svgIcon]=\"\n      (disabled$ | async) === true\n        ? 'checkbox-blank-outline'\n        : 'checkbox-marked-outline'\n    \"\n    (click)=\"onDisableSwitchClick()\"\n    matPrefix\n  >\n  </mat-icon>\n\n  <button\n    type=\"button\"\n    *ngIf=\"isPassword\"\n    matSuffix\n    mat-icon-button\n    (click)=\"togglePassword()\"\n  >\n    <mat-icon color=\"primary\" [svgIcon]=\"hide ? 'eye-off' : 'eye'\"></mat-icon>\n  </button>\n\n  <mat-error *ngIf=\"formControl.errors\">{{\n    getErrorMessage() | translate\n  }}</mat-error>\n</mat-form-field>\n" }]
+            args: [{ selector: 'igo-form-field-text', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field>\r\n  <input\r\n    matInput\r\n    (blur)=\"delayedHide(0)\"\r\n    [type]=\"isPassword ? (hide ? 'password' : 'text') : 'text'\"\r\n    [required]=\"isPassword ? 'true' : required\"\r\n    [placeholder]=\"placeholder\"\r\n    [formControl]=\"formControl\"\r\n    (change)=\"delayedHide()\"\r\n  />\r\n  <mat-icon\r\n    *ngIf=\"disableSwitch === true\"\r\n    class=\"igo-form-disable-switch\"\r\n    [svgIcon]=\"\r\n      (disabled$ | async) === true\r\n        ? 'checkbox-blank-outline'\r\n        : 'checkbox-marked-outline'\r\n    \"\r\n    (click)=\"onDisableSwitchClick()\"\r\n    matPrefix\r\n  >\r\n  </mat-icon>\r\n\r\n  <button\r\n    type=\"button\"\r\n    *ngIf=\"isPassword\"\r\n    matSuffix\r\n    mat-icon-button\r\n    (click)=\"togglePassword()\"\r\n  >\r\n    <mat-icon color=\"primary\" [svgIcon]=\"hide ? 'eye-off' : 'eye'\"></mat-icon>\r\n  </button>\r\n\r\n  <mat-error *ngIf=\"formControl.errors\">{{\r\n    getErrorMessage() | translate\r\n  }}</mat-error>\r\n</mat-form-field>\r\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { formControl: [{
                 type: Input
             }], placeholder: [{
@@ -4677,14 +4677,14 @@ let FormFieldTextareaComponent = class FormFieldTextareaComponent {
         this.disabled$.next(disabled);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldTextareaComponent, selector: "igo-form-field-textarea", inputs: { formControl: "formControl", placeholder: "placeholder", errors: "errors", disableSwitch: "disableSwitch" }, ngImport: i0, template: "<mat-form-field>\n  <textarea\n    matInput\n    [required]=\"required\"\n    [placeholder]=\"placeholder\"\n    [formControl]=\"formControl\"\n  >\n  </textarea>\n  <mat-icon\n    *ngIf=\"disableSwitch === true\"\n    class=\"igo-form-disable-switch\"\n    [svgIcon]=\"\n      (disabled$ | async) === true\n        ? 'checkbox-blank-outline'\n        : 'checkbox-marked-outline'\n    \"\n    (click)=\"onDisableSwitchClick()\"\n    matPrefix\n  >\n  </mat-icon>\n  <mat-error *ngIf=\"formControl.errors\">{{\n    getErrorMessage() | translate\n  }}</mat-error>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i5$1.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: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldTextareaComponent, selector: "igo-form-field-textarea", inputs: { formControl: "formControl", placeholder: "placeholder", errors: "errors", disableSwitch: "disableSwitch" }, ngImport: i0, template: "<mat-form-field>\r\n  <textarea\r\n    matInput\r\n    [required]=\"required\"\r\n    [placeholder]=\"placeholder\"\r\n    [formControl]=\"formControl\"\r\n  >\r\n  </textarea>\r\n  <mat-icon\r\n    *ngIf=\"disableSwitch === true\"\r\n    class=\"igo-form-disable-switch\"\r\n    [svgIcon]=\"\r\n      (disabled$ | async) === true\r\n        ? 'checkbox-blank-outline'\r\n        : 'checkbox-marked-outline'\r\n    \"\r\n    (click)=\"onDisableSwitchClick()\"\r\n    matPrefix\r\n  >\r\n  </mat-icon>\r\n  <mat-error *ngIf=\"formControl.errors\">{{\r\n    getErrorMessage() | translate\r\n  }}</mat-error>\r\n</mat-form-field>\r\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i5$1.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: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 FormFieldTextareaComponent = __decorate([
     IgoFormFieldComponent('textarea')
 ], FormFieldTextareaComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldTextareaComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-form-field-textarea', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field>\n  <textarea\n    matInput\n    [required]=\"required\"\n    [placeholder]=\"placeholder\"\n    [formControl]=\"formControl\"\n  >\n  </textarea>\n  <mat-icon\n    *ngIf=\"disableSwitch === true\"\n    class=\"igo-form-disable-switch\"\n    [svgIcon]=\"\n      (disabled$ | async) === true\n        ? 'checkbox-blank-outline'\n        : 'checkbox-marked-outline'\n    \"\n    (click)=\"onDisableSwitchClick()\"\n    matPrefix\n  >\n  </mat-icon>\n  <mat-error *ngIf=\"formControl.errors\">{{\n    getErrorMessage() | translate\n  }}</mat-error>\n</mat-form-field>\n" }]
+            args: [{ selector: 'igo-form-field-textarea', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field>\r\n  <textarea\r\n    matInput\r\n    [required]=\"required\"\r\n    [placeholder]=\"placeholder\"\r\n    [formControl]=\"formControl\"\r\n  >\r\n  </textarea>\r\n  <mat-icon\r\n    *ngIf=\"disableSwitch === true\"\r\n    class=\"igo-form-disable-switch\"\r\n    [svgIcon]=\"\r\n      (disabled$ | async) === true\r\n        ? 'checkbox-blank-outline'\r\n        : 'checkbox-marked-outline'\r\n    \"\r\n    (click)=\"onDisableSwitchClick()\"\r\n    matPrefix\r\n  >\r\n  </mat-icon>\r\n  <mat-error *ngIf=\"formControl.errors\">{{\r\n    getErrorMessage() | translate\r\n  }}</mat-error>\r\n</mat-form-field>\r\n" }]
         }], propDecorators: { formControl: [{
                 type: Input
             }], placeholder: [{
@@ -4822,11 +4822,11 @@ class FormFieldComponent {
         return this.fieldSubscribers;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldComponent, deps: [{ token: FormFieldService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldComponent, selector: "igo-form-field", inputs: { field: "field" }, ngImport: i0, template: "<ng-container *ngIf=\"field !== undefined\">\n  <igo-dynamic-outlet\n    [component]=\"getFieldComponent()\"\n    [inputs]=\"getFieldInputs()\"\n    [subscribers]=\"getFieldSubscribers()\"\n  >\n  </igo-dynamic-outlet>\n</ng-container>\n", styles: ["::ng-deep mat-form-field{width:100%}::ng-deep .igo-form-disable-switch{margin-right:8px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DynamicOutletComponent, selector: "igo-dynamic-outlet", inputs: ["component", "inputs", "subscribers"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldComponent, selector: "igo-form-field", inputs: { field: "field" }, ngImport: i0, template: "<ng-container *ngIf=\"field !== undefined\">\r\n  <igo-dynamic-outlet\r\n    [component]=\"getFieldComponent()\"\r\n    [inputs]=\"getFieldInputs()\"\r\n    [subscribers]=\"getFieldSubscribers()\"\r\n  >\r\n  </igo-dynamic-outlet>\r\n</ng-container>\r\n", styles: ["::ng-deep mat-form-field{width:100%}::ng-deep .igo-form-disable-switch{margin-right:8px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DynamicOutletComponent, selector: "igo-dynamic-outlet", inputs: ["component", "inputs", "subscribers"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-form-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"field !== undefined\">\n  <igo-dynamic-outlet\n    [component]=\"getFieldComponent()\"\n    [inputs]=\"getFieldInputs()\"\n    [subscribers]=\"getFieldSubscribers()\"\n  >\n  </igo-dynamic-outlet>\n</ng-container>\n", styles: ["::ng-deep mat-form-field{width:100%}::ng-deep .igo-form-disable-switch{margin-right:8px}\n"] }]
+            args: [{ selector: 'igo-form-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"field !== undefined\">\r\n  <igo-dynamic-outlet\r\n    [component]=\"getFieldComponent()\"\r\n    [inputs]=\"getFieldInputs()\"\r\n    [subscribers]=\"getFieldSubscribers()\"\r\n  >\r\n  </igo-dynamic-outlet>\r\n</ng-container>\r\n", styles: ["::ng-deep mat-form-field{width:100%}::ng-deep .igo-form-disable-switch{margin-right:8px}\n"] }]
         }], ctorParameters: function () { return [{ type: FormFieldService }]; }, propDecorators: { field: [{
                 type: Input
             }] } });
@@ -4948,11 +4948,11 @@ class FormGroupComponent {
         return getControlErrorMessage(this.formControl, options.errors || {});
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormGroupComponent, selector: "igo-form-group", inputs: { group: "group", errors: "errors" }, ngImport: i0, template: "<div *ngIf=\"group && group.fields.length > 0\" class=\"igo-form-group-fields\">\n  <div\n    *ngFor=\"let field of group.fields\"\n    class=\"igo-form-field-wrapper\"\n    [ngClass]=\"getFieldNgClass(field)\"\n  >\n    <igo-form-field [field]=\"field\"></igo-form-field>\n  </div>\n</div>\n\n<div class=\"igo-form-group-extra-content\">\n  <ng-content></ng-content>\n</div>\n\n<mat-error *ngIf=\"formControl.errors\">{{\n  getErrorMessage() | translate\n}}</mat-error>\n", styles: [":host{width:100%;height:100%;display:block;overflow:auto;padding:10px 5px;box-sizing:border-box}:host .igo-form-field-colspan-2{width:100%}:host .igo-form-field-colspan-1{width:50%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: FormFieldComponent, selector: "igo-form-field", inputs: ["field"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormGroupComponent, selector: "igo-form-group", inputs: { group: "group", errors: "errors" }, ngImport: i0, template: "<div *ngIf=\"group && group.fields.length > 0\" class=\"igo-form-group-fields\">\r\n  <div\r\n    *ngFor=\"let field of group.fields\"\r\n    class=\"igo-form-field-wrapper\"\r\n    [ngClass]=\"getFieldNgClass(field)\"\r\n  >\r\n    <igo-form-field [field]=\"field\"></igo-form-field>\r\n  </div>\r\n</div>\r\n\r\n<div class=\"igo-form-group-extra-content\">\r\n  <ng-content></ng-content>\r\n</div>\r\n\r\n<mat-error *ngIf=\"formControl.errors\">{{\r\n  getErrorMessage() | translate\r\n}}</mat-error>\r\n", styles: [":host{width:100%;height:100%;display:block;overflow:auto;padding:10px 5px;box-sizing:border-box}:host .igo-form-field-colspan-2{width:100%}:host .igo-form-field-colspan-1{width:50%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: FormFieldComponent, selector: "igo-form-field", inputs: ["field"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormGroupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-form-group', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"group && group.fields.length > 0\" class=\"igo-form-group-fields\">\n  <div\n    *ngFor=\"let field of group.fields\"\n    class=\"igo-form-field-wrapper\"\n    [ngClass]=\"getFieldNgClass(field)\"\n  >\n    <igo-form-field [field]=\"field\"></igo-form-field>\n  </div>\n</div>\n\n<div class=\"igo-form-group-extra-content\">\n  <ng-content></ng-content>\n</div>\n\n<mat-error *ngIf=\"formControl.errors\">{{\n  getErrorMessage() | translate\n}}</mat-error>\n", styles: [":host{width:100%;height:100%;display:block;overflow:auto;padding:10px 5px;box-sizing:border-box}:host .igo-form-field-colspan-2{width:100%}:host .igo-form-field-colspan-1{width:50%}\n"] }]
+            args: [{ selector: 'igo-form-group', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"group && group.fields.length > 0\" class=\"igo-form-group-fields\">\r\n  <div\r\n    *ngFor=\"let field of group.fields\"\r\n    class=\"igo-form-field-wrapper\"\r\n    [ngClass]=\"getFieldNgClass(field)\"\r\n  >\r\n    <igo-form-field [field]=\"field\"></igo-form-field>\r\n  </div>\r\n</div>\r\n\r\n<div class=\"igo-form-group-extra-content\">\r\n  <ng-content></ng-content>\r\n</div>\r\n\r\n<mat-error *ngIf=\"formControl.errors\">{{\r\n  getErrorMessage() | translate\r\n}}</mat-error>\r\n", styles: [":host{width:100%;height:100%;display:block;overflow:auto;padding:10px 5px;box-sizing:border-box}:host .igo-form-field-colspan-2{width:100%}:host .igo-form-field-colspan-1{width:50%}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { group: [{
                 type: Input
             }], errors: [{
@@ -5065,11 +5065,11 @@ class FormComponent {
         this.form.control.reset();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormComponent, selector: "igo-form", inputs: { form: "form", formData: "formData", autocomplete: "autocomplete" }, outputs: { submitForm: "submitForm" }, viewQueries: [{ propertyName: "buttons", first: true, predicate: ["buttons"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<form\n  [autocomplete]=\"autocomplete\"\n  [formGroup]=\"form.control\"\n  (ngSubmit)=\"onSubmit()\"\n>\n  <div\n    class=\"igo-form-body\"\n    [ngClass]=\"{ 'igo-form-body-with-buttons': hasButtons }\"\n  >\n    <div class=\"igo-form-content\">\n      <ng-content></ng-content>\n    </div>\n    <div #buttons class=\"igo-form-buttons\">\n      <ng-content select=\"[formButtons]\"></ng-content>\n    </div>\n  </div>\n</form>\n", styles: [":host{display:block}form{width:100%;height:100%}.igo-form-body,.igo-form-content{height:100%}.igo-form-body-with-buttons .igo-form-content{height:calc(100% - 56px)}.igo-form-content{display:flex}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormComponent, selector: "igo-form", inputs: { form: "form", formData: "formData", autocomplete: "autocomplete" }, outputs: { submitForm: "submitForm" }, viewQueries: [{ propertyName: "buttons", first: true, predicate: ["buttons"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<form\r\n  [autocomplete]=\"autocomplete\"\r\n  [formGroup]=\"form.control\"\r\n  (ngSubmit)=\"onSubmit()\"\r\n>\r\n  <div\r\n    class=\"igo-form-body\"\r\n    [ngClass]=\"{ 'igo-form-body-with-buttons': hasButtons }\"\r\n  >\r\n    <div class=\"igo-form-content\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n    <div #buttons class=\"igo-form-buttons\">\r\n      <ng-content select=\"[formButtons]\"></ng-content>\r\n    </div>\r\n  </div>\r\n</form>\r\n", styles: [":host{display:block}form{width:100%;height:100%}.igo-form-body,.igo-form-content{height:100%}.igo-form-body-with-buttons .igo-form-content{height:calc(100% - 56px)}.igo-form-content{display:flex}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-form', changeDetection: ChangeDetectionStrategy.OnPush, template: "<form\n  [autocomplete]=\"autocomplete\"\n  [formGroup]=\"form.control\"\n  (ngSubmit)=\"onSubmit()\"\n>\n  <div\n    class=\"igo-form-body\"\n    [ngClass]=\"{ 'igo-form-body-with-buttons': hasButtons }\"\n  >\n    <div class=\"igo-form-content\">\n      <ng-content></ng-content>\n    </div>\n    <div #buttons class=\"igo-form-buttons\">\n      <ng-content select=\"[formButtons]\"></ng-content>\n    </div>\n  </div>\n</form>\n", styles: [":host{display:block}form{width:100%;height:100%}.igo-form-body,.igo-form-content{height:100%}.igo-form-body-with-buttons .igo-form-content{height:calc(100% - 56px)}.igo-form-content{display:flex}\n"] }]
+            args: [{ selector: 'igo-form', changeDetection: ChangeDetectionStrategy.OnPush, template: "<form\r\n  [autocomplete]=\"autocomplete\"\r\n  [formGroup]=\"form.control\"\r\n  (ngSubmit)=\"onSubmit()\"\r\n>\r\n  <div\r\n    class=\"igo-form-body\"\r\n    [ngClass]=\"{ 'igo-form-body-with-buttons': hasButtons }\"\r\n  >\r\n    <div class=\"igo-form-content\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n    <div #buttons class=\"igo-form-buttons\">\r\n      <ng-content select=\"[formButtons]\"></ng-content>\r\n    </div>\r\n  </div>\r\n</form>\r\n", styles: [":host{display:block}form{width:100%;height:100%}.igo-form-body,.igo-form-content{height:100%}.igo-form-body-with-buttons .igo-form-content{height:calc(100% - 56px)}.igo-form-content{display:flex}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { form: [{
                 type: Input
             }], formData: [{
@@ -5184,11 +5184,11 @@ class SelectValueCheckRadioDialogComponent {
         this.formGroup.setValue(choices);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SelectValueCheckRadioDialogComponent, deps: [{ token: i1$4.UntypedFormBuilder }, { token: i1$1.LanguageService }, { token: i1$6.MatDialogRef }, { token: MAT_DIALOG_DATA, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SelectValueCheckRadioDialogComponent, selector: "igo-select-value-check-radio-dialog", ngImport: i0, template: "<h1 mat-dialog-title>{{ data.title | translate }}</h1>\n\n<form class=\"igo-form\" [formGroup]=\"formGroup\">\n  <section class=\"choices-section\">\n    <ng-template\n      *ngIf=\"data.type === 'checkbox'\"\n      ngFor\n      let-choice\n      let-i=\"index\"\n      [ngForOf]=\"data.choices\"\n    >\n      <mat-checkbox formControlName=\"{{ choice.value }}\">{{\n        choice.title || choice.value\n      }}</mat-checkbox>\n    </ng-template>\n\n    <mat-radio-group *ngIf=\"data.type === 'radio'\" (change)=\"onChange($event)\">\n      <mat-radio-button\n        *ngFor=\"let choice of data.choices\"\n        [value]=\"choice.value\"\n      >\n        {{ choice.title || choice.value }}\n      </mat-radio-button>\n    </mat-radio-group>\n  </section>\n  <div mat-dialog-actions>\n    <div class=\"button-group\">\n      <button mat-raised-button type=\"button\" (click)=\"cancel()\">\n        {{ data.cancelButtonText | translate }}\n      </button>\n      <button\n        [disabled]=\"isDisabled$ | async\"\n        id=\"processBtnDialog\"\n        mat-raised-button\n        type=\"button\"\n        color=\"primary\"\n        (click)=\"save()\"\n      >\n        {{ data.processButtonText | translate }}\n      </button>\n    </div>\n  </div>\n</form>\n", styles: [":host::ng-deep div[mat-dialog-actions]{margin:10px 0 0}:host::ng-deep section.choices-section{max-width:auto;display:grid;grid-template-columns:auto auto;grid-gap:0px;padding:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i7$3.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { kind: "component", type: i7$3.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$6.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SelectValueCheckRadioDialogComponent, selector: "igo-select-value-check-radio-dialog", ngImport: i0, template: "<h1 mat-dialog-title>{{ data.title | translate }}</h1>\r\n\r\n<form class=\"igo-form\" [formGroup]=\"formGroup\">\r\n  <section class=\"choices-section\">\r\n    <ng-template\r\n      *ngIf=\"data.type === 'checkbox'\"\r\n      ngFor\r\n      let-choice\r\n      let-i=\"index\"\r\n      [ngForOf]=\"data.choices\"\r\n    >\r\n      <mat-checkbox formControlName=\"{{ choice.value }}\">{{\r\n        choice.title || choice.value\r\n      }}</mat-checkbox>\r\n    </ng-template>\r\n\r\n    <mat-radio-group *ngIf=\"data.type === 'radio'\" (change)=\"onChange($event)\">\r\n      <mat-radio-button\r\n        *ngFor=\"let choice of data.choices\"\r\n        [value]=\"choice.value\"\r\n      >\r\n        {{ choice.title || choice.value }}\r\n      </mat-radio-button>\r\n    </mat-radio-group>\r\n  </section>\r\n  <div mat-dialog-actions>\r\n    <div class=\"button-group\">\r\n      <button mat-raised-button type=\"button\" (click)=\"cancel()\">\r\n        {{ data.cancelButtonText | translate }}\r\n      </button>\r\n      <button\r\n        [disabled]=\"isDisabled$ | async\"\r\n        id=\"processBtnDialog\"\r\n        mat-raised-button\r\n        type=\"button\"\r\n        color=\"primary\"\r\n        (click)=\"save()\"\r\n      >\r\n        {{ data.processButtonText | translate }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</form>\r\n", styles: [":host::ng-deep div[mat-dialog-actions]{margin:10px 0 0}:host::ng-deep section.choices-section{max-width:auto;display:grid;grid-template-columns:auto auto;grid-gap:0px;padding:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i7$3.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { kind: "component", type: i7$3.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$6.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SelectValueCheckRadioDialogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-select-value-check-radio-dialog', template: "<h1 mat-dialog-title>{{ data.title | translate }}</h1>\n\n<form class=\"igo-form\" [formGroup]=\"formGroup\">\n  <section class=\"choices-section\">\n    <ng-template\n      *ngIf=\"data.type === 'checkbox'\"\n      ngFor\n      let-choice\n      let-i=\"index\"\n      [ngForOf]=\"data.choices\"\n    >\n      <mat-checkbox formControlName=\"{{ choice.value }}\">{{\n        choice.title || choice.value\n      }}</mat-checkbox>\n    </ng-template>\n\n    <mat-radio-group *ngIf=\"data.type === 'radio'\" (change)=\"onChange($event)\">\n      <mat-radio-button\n        *ngFor=\"let choice of data.choices\"\n        [value]=\"choice.value\"\n      >\n        {{ choice.title || choice.value }}\n      </mat-radio-button>\n    </mat-radio-group>\n  </section>\n  <div mat-dialog-actions>\n    <div class=\"button-group\">\n      <button mat-raised-button type=\"button\" (click)=\"cancel()\">\n        {{ data.cancelButtonText | translate }}\n      </button>\n      <button\n        [disabled]=\"isDisabled$ | async\"\n        id=\"processBtnDialog\"\n        mat-raised-button\n        type=\"button\"\n        color=\"primary\"\n        (click)=\"save()\"\n      >\n        {{ data.processButtonText | translate }}\n      </button>\n    </div>\n  </div>\n</form>\n", styles: [":host::ng-deep div[mat-dialog-actions]{margin:10px 0 0}:host::ng-deep section.choices-section{max-width:auto;display:grid;grid-template-columns:auto auto;grid-gap:0px;padding:5px}\n"] }]
+            args: [{ selector: 'igo-select-value-check-radio-dialog', template: "<h1 mat-dialog-title>{{ data.title | translate }}</h1>\r\n\r\n<form class=\"igo-form\" [formGroup]=\"formGroup\">\r\n  <section class=\"choices-section\">\r\n    <ng-template\r\n      *ngIf=\"data.type === 'checkbox'\"\r\n      ngFor\r\n      let-choice\r\n      let-i=\"index\"\r\n      [ngForOf]=\"data.choices\"\r\n    >\r\n      <mat-checkbox formControlName=\"{{ choice.value }}\">{{\r\n        choice.title || choice.value\r\n      }}</mat-checkbox>\r\n    </ng-template>\r\n\r\n    <mat-radio-group *ngIf=\"data.type === 'radio'\" (change)=\"onChange($event)\">\r\n      <mat-radio-button\r\n        *ngFor=\"let choice of data.choices\"\r\n        [value]=\"choice.value\"\r\n      >\r\n        {{ choice.title || choice.value }}\r\n      </mat-radio-button>\r\n    </mat-radio-group>\r\n  </section>\r\n  <div mat-dialog-actions>\r\n    <div class=\"button-group\">\r\n      <button mat-raised-button type=\"button\" (click)=\"cancel()\">\r\n        {{ data.cancelButtonText | translate }}\r\n      </button>\r\n      <button\r\n        [disabled]=\"isDisabled$ | async\"\r\n        id=\"processBtnDialog\"\r\n        mat-raised-button\r\n        type=\"button\"\r\n        color=\"primary\"\r\n        (click)=\"save()\"\r\n      >\r\n        {{ data.processButtonText | translate }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</form>\r\n", styles: [":host::ng-deep div[mat-dialog-actions]{margin:10px 0 0}:host::ng-deep section.choices-section{max-width:auto;display:grid;grid-template-columns:auto auto;grid-gap:0px;padding:5px}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$4.UntypedFormBuilder }, { type: i1$1.LanguageService }, { type: i1$6.MatDialogRef }, { type: undefined, decorators: [{
                     type: Optional
                 }, {
@@ -5376,11 +5376,11 @@ class FormDialogComponent {
         this.dialogRef.close();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormDialogComponent, deps: [{ token: i1$1.LanguageService }, { token: i1$6.MatDialogRef }, { token: FormService }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormDialogComponent, selector: "igo-form-dialog", ngImport: i0, template: "<h1 mat-dialog-title>{{ data.title | translate }}</h1>\n\n<igo-form\n  *ngIf=\"form$ | async as form\"\n  [form]=\"form\"\n  [formData]=\"data$ | async\"\n  (submitForm)=\"onSubmit($event)\"\n>\n  <div *ngIf=\"form.fields.length\" class=\"form-dialog-container\">\n    <igo-form-field\n      *ngFor=\"let field of form.fields\"\n      [field]=\"field\"\n    ></igo-form-field>\n    <igo-form-group\n      *ngFor=\"let group of form.groups\"\n      [group]=\"group\"\n    ></igo-form-group>\n  </div>\n\n  <div formButtons mat-dialog-actions>\n    <button mat-stroked-button type=\"button\" color=\"primary\" (click)=\"cancel()\">\n      {{ data.cancelButtonText | translate }}\n    </button>\n    <button mat-flat-button type=\"submit\" color=\"primary\">\n      {{ data.processButtonText | translate }}\n    </button>\n  </div>\n</igo-form>\n<div>\n  <igo-custom-html\n    *ngIf=\"data.notice && data.notice !== ''\"\n    [html]=\"data.notice\"\n  >\n  </igo-custom-html>\n</div>\n", styles: [":host div[mat-dialog-actions]{margin:10px 0 0}:host .form-dialog-container{width:100%;padding:10px}:host .form-dialog-container igo-form-field,:host .form-dialog-container igo-form-group{display:block;height:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1$6.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: CustomHtmlComponent, selector: "igo-custom-html", inputs: ["html"] }, { kind: "component", type: FormComponent, selector: "igo-form", inputs: ["form", "formData", "autocomplete"], outputs: ["submitForm"] }, { kind: "component", type: FormGroupComponent, selector: "igo-form-group", inputs: ["group", "errors"] }, { kind: "component", type: FormFieldComponent, selector: "igo-form-field", inputs: ["field"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormDialogComponent, selector: "igo-form-dialog", ngImport: i0, template: "<h1 mat-dialog-title>{{ data.title | translate }}</h1>\r\n\r\n<igo-form\r\n  *ngIf=\"form$ | async as form\"\r\n  [form]=\"form\"\r\n  [formData]=\"data$ | async\"\r\n  (submitForm)=\"onSubmit($event)\"\r\n>\r\n  <div *ngIf=\"form.fields.length\" class=\"form-dialog-container\">\r\n    <igo-form-field\r\n      *ngFor=\"let field of form.fields\"\r\n      [field]=\"field\"\r\n    ></igo-form-field>\r\n    <igo-form-group\r\n      *ngFor=\"let group of form.groups\"\r\n      [group]=\"group\"\r\n    ></igo-form-group>\r\n  </div>\r\n\r\n  <div formButtons mat-dialog-actions>\r\n    <button mat-stroked-button type=\"button\" color=\"primary\" (click)=\"cancel()\">\r\n      {{ data.cancelButtonText | translate }}\r\n    </button>\r\n    <button mat-flat-button type=\"submit\" color=\"primary\">\r\n      {{ data.processButtonText | translate }}\r\n    </button>\r\n  </div>\r\n</igo-form>\r\n<div>\r\n  <igo-custom-html\r\n    *ngIf=\"data.notice && data.notice !== ''\"\r\n    [html]=\"data.notice\"\r\n  >\r\n  </igo-custom-html>\r\n</div>\r\n", styles: [":host div[mat-dialog-actions]{margin:10px 0 0}:host .form-dialog-container{width:100%;padding:10px}:host .form-dialog-container igo-form-field,:host .form-dialog-container igo-form-group{display:block;height:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1$6.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: CustomHtmlComponent, selector: "igo-custom-html", inputs: ["html"] }, { kind: "component", type: FormComponent, selector: "igo-form", inputs: ["form", "formData", "autocomplete"], outputs: ["submitForm"] }, { kind: "component", type: FormGroupComponent, selector: "igo-form-group", inputs: ["group", "errors"] }, { kind: "component", type: FormFieldComponent, selector: "igo-form-field", inputs: ["field"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormDialogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-form-dialog', template: "<h1 mat-dialog-title>{{ data.title | translate }}</h1>\n\n<igo-form\n  *ngIf=\"form$ | async as form\"\n  [form]=\"form\"\n  [formData]=\"data$ | async\"\n  (submitForm)=\"onSubmit($event)\"\n>\n  <div *ngIf=\"form.fields.length\" class=\"form-dialog-container\">\n    <igo-form-field\n      *ngFor=\"let field of form.fields\"\n      [field]=\"field\"\n    ></igo-form-field>\n    <igo-form-group\n      *ngFor=\"let group of form.groups\"\n      [group]=\"group\"\n    ></igo-form-group>\n  </div>\n\n  <div formButtons mat-dialog-actions>\n    <button mat-stroked-button type=\"button\" color=\"primary\" (click)=\"cancel()\">\n      {{ data.cancelButtonText | translate }}\n    </button>\n    <button mat-flat-button type=\"submit\" color=\"primary\">\n      {{ data.processButtonText | translate }}\n    </button>\n  </div>\n</igo-form>\n<div>\n  <igo-custom-html\n    *ngIf=\"data.notice && data.notice !== ''\"\n    [html]=\"data.notice\"\n  >\n  </igo-custom-html>\n</div>\n", styles: [":host div[mat-dialog-actions]{margin:10px 0 0}:host .form-dialog-container{width:100%;padding:10px}:host .form-dialog-container igo-form-field,:host .form-dialog-container igo-form-group{display:block;height:auto}\n"] }]
+            args: [{ selector: 'igo-form-dialog', template: "<h1 mat-dialog-title>{{ data.title | translate }}</h1>\r\n\r\n<igo-form\r\n  *ngIf=\"form$ | async as form\"\r\n  [form]=\"form\"\r\n  [formData]=\"data$ | async\"\r\n  (submitForm)=\"onSubmit($event)\"\r\n>\r\n  <div *ngIf=\"form.fields.length\" class=\"form-dialog-container\">\r\n    <igo-form-field\r\n      *ngFor=\"let field of form.fields\"\r\n      [field]=\"field\"\r\n    ></igo-form-field>\r\n    <igo-form-group\r\n      *ngFor=\"let group of form.groups\"\r\n      [group]=\"group\"\r\n    ></igo-form-group>\r\n  </div>\r\n\r\n  <div formButtons mat-dialog-actions>\r\n    <button mat-stroked-button type=\"button\" color=\"primary\" (click)=\"cancel()\">\r\n      {{ data.cancelButtonText | translate }}\r\n    </button>\r\n    <button mat-flat-button type=\"submit\" color=\"primary\">\r\n      {{ data.processButtonText | translate }}\r\n    </button>\r\n  </div>\r\n</igo-form>\r\n<div>\r\n  <igo-custom-html\r\n    *ngIf=\"data.notice && data.notice !== ''\"\r\n    [html]=\"data.notice\"\r\n  >\r\n  </igo-custom-html>\r\n</div>\r\n", styles: [":host div[mat-dialog-actions]{margin:10px 0 0}:host .form-dialog-container{width:100%;padding:10px}:host .form-dialog-container igo-form-field,:host .form-dialog-container igo-form-group{display:block;height:auto}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.LanguageService }, { type: i1$6.MatDialogRef }, { type: FormService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -5900,11 +5900,11 @@ class FlexibleComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FlexibleComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.MediaService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FlexibleComponent, selector: "igo-flexible", inputs: { initial: "initial", collapsed: "collapsed", expanded: "expanded", initialMobile: "initialMobile", collapsedMobile: "collapsedMobile", expandedMobile: "expandedMobile", direction: "direction", state: "state" }, viewQueries: [{ propertyName: "main", first: true, predicate: ["flexibleMain"], descendants: true, static: true }], ngImport: i0, template: "<div #flexibleMain class=\"igo-flexible-main {{ state }} {{ direction }}\">\n  <div class=\"igo-container\">\n    <ng-content></ng-content>\n  </div>\n</div>\n<div class=\"igo-flexible-fill\">\n  <div>\n    <div class=\"igo-container\">\n      <ng-content select=\"[igoFlexibleFill]\"></ng-content>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:flex;height:100%;width:100%}:host.column{flex-direction:column}:host.row{flex-direction:row}:host .igo-flexible-main{flex:0 0 auto;overflow:hidden}:host .igo-flexible-main.column{transition:height .25s ease-in}:host .igo-flexible-main.row{transition:width .25s ease-in}:host .igo-flexible-fill>div{position:absolute;inset:0}:host .igo-container{height:100%;overflow:hidden;position:relative}:host ::ng-deep .igo-flexible-fill{flex:1 1 auto;overflow:hidden;position:relative}:host ::ng-deep .igo-content{height:100%;width:100%;overflow:auto}:host ::ng-deep igo-panel{height:100%}\n"] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FlexibleComponent, selector: "igo-flexible", inputs: { initial: "initial", collapsed: "collapsed", expanded: "expanded", initialMobile: "initialMobile", collapsedMobile: "collapsedMobile", expandedMobile: "expandedMobile", direction: "direction", state: "state" }, viewQueries: [{ propertyName: "main", first: true, predicate: ["flexibleMain"], descendants: true, static: true }], ngImport: i0, template: "<div #flexibleMain class=\"igo-flexible-main {{ state }} {{ direction }}\">\r\n  <div class=\"igo-container\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n</div>\r\n<div class=\"igo-flexible-fill\">\r\n  <div>\r\n    <div class=\"igo-container\">\r\n      <ng-content select=\"[igoFlexibleFill]\"></ng-content>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [":host{display:flex;height:100%;width:100%}:host.column{flex-direction:column}:host.row{flex-direction:row}:host .igo-flexible-main{flex:0 0 auto;overflow:hidden}:host .igo-flexible-main.column{transition:height .25s ease-in}:host .igo-flexible-main.row{transition:width .25s ease-in}:host .igo-flexible-fill>div{position:absolute;inset:0}:host .igo-container{height:100%;overflow:hidden;position:relative}:host ::ng-deep .igo-flexible-fill{flex:1 1 auto;overflow:hidden;position:relative}:host ::ng-deep .igo-content{height:100%;width:100%;overflow:auto}:host ::ng-deep igo-panel{height:100%}\n"] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FlexibleComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-flexible', template: "<div #flexibleMain class=\"igo-flexible-main {{ state }} {{ direction }}\">\n  <div class=\"igo-container\">\n    <ng-content></ng-content>\n  </div>\n</div>\n<div class=\"igo-flexible-fill\">\n  <div>\n    <div class=\"igo-container\">\n      <ng-content select=\"[igoFlexibleFill]\"></ng-content>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:flex;height:100%;width:100%}:host.column{flex-direction:column}:host.row{flex-direction:row}:host .igo-flexible-main{flex:0 0 auto;overflow:hidden}:host .igo-flexible-main.column{transition:height .25s ease-in}:host .igo-flexible-main.row{transition:width .25s ease-in}:host .igo-flexible-fill>div{position:absolute;inset:0}:host .igo-container{height:100%;overflow:hidden;position:relative}:host ::ng-deep .igo-flexible-fill{flex:1 1 auto;overflow:hidden;position:relative}:host ::ng-deep .igo-content{height:100%;width:100%;overflow:auto}:host ::ng-deep igo-panel{height:100%}\n"] }]
+            args: [{ selector: 'igo-flexible', template: "<div #flexibleMain class=\"igo-flexible-main {{ state }} {{ direction }}\">\r\n  <div class=\"igo-container\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n</div>\r\n<div class=\"igo-flexible-fill\">\r\n  <div>\r\n    <div class=\"igo-container\">\r\n      <ng-content select=\"[igoFlexibleFill]\"></ng-content>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [":host{display:flex;height:100%;width:100%}:host.column{flex-direction:column}:host.row{flex-direction:row}:host .igo-flexible-main{flex:0 0 auto;overflow:hidden}:host .igo-flexible-main.column{transition:height .25s ease-in}:host .igo-flexible-main.row{transition:width .25s ease-in}:host .igo-flexible-fill>div{position:absolute;inset:0}:host .igo-container{height:100%;overflow:hidden;position:relative}:host ::ng-deep .igo-flexible-fill{flex:1 1 auto;overflow:hidden;position:relative}:host ::ng-deep .igo-content{height:100%;width:100%;overflow:auto}:host ::ng-deep igo-panel{height:100%}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$1.MediaService }]; }, propDecorators: { main: [{
                 type: ViewChild,
                 args: ['flexibleMain', { static: true }]
@@ -5953,11 +5953,11 @@ class HomeButtonComponent {
         this.unselectButton.emit();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HomeButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HomeButtonComponent, selector: "igo-home-button", outputs: { unselectButton: "unselectButton" }, ngImport: i0, template: "<button\n  id=\"homeButton\"\n  mat-icon-button\n  tooltip-position=\"below\"\n  matTooltipShowDelay=\"500\"\n  [matTooltip]=\"'igo.context.sidenav.mainMenu' | translate\"\n  (click)=\"onUnselectButtonClick()\"\n>\n  <mat-icon svgIcon=\"home\"></mat-icon>\n</button>\n", styles: ["#homeButton{border-radius:0}\n"], dependencies: [{ kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HomeButtonComponent, selector: "igo-home-button", outputs: { unselectButton: "unselectButton" }, ngImport: i0, template: "<button\r\n  id=\"homeButton\"\r\n  mat-icon-button\r\n  tooltip-position=\"below\"\r\n  matTooltipShowDelay=\"500\"\r\n  [matTooltip]=\"'igo.context.sidenav.mainMenu' | translate\"\r\n  (click)=\"onUnselectButtonClick()\"\r\n>\r\n  <mat-icon svgIcon=\"home\"></mat-icon>\r\n</button>\r\n", styles: ["#homeButton{border-radius:0}\n"], dependencies: [{ kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HomeButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-home-button', template: "<button\n  id=\"homeButton\"\n  mat-icon-button\n  tooltip-position=\"below\"\n  matTooltipShowDelay=\"500\"\n  [matTooltip]=\"'igo.context.sidenav.mainMenu' | translate\"\n  (click)=\"onUnselectButtonClick()\"\n>\n  <mat-icon svgIcon=\"home\"></mat-icon>\n</button>\n", styles: ["#homeButton{border-radius:0}\n"] }]
+            args: [{ selector: 'igo-home-button', template: "<button\r\n  id=\"homeButton\"\r\n  mat-icon-button\r\n  tooltip-position=\"below\"\r\n  matTooltipShowDelay=\"500\"\r\n  [matTooltip]=\"'igo.context.sidenav.mainMenu' | translate\"\r\n  (click)=\"onUnselectButtonClick()\"\r\n>\r\n  <mat-icon svgIcon=\"home\"></mat-icon>\r\n</button>\r\n", styles: ["#homeButton{border-radius:0}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { unselectButton: [{
                 type: Output
             }] } });
@@ -6824,11 +6824,11 @@ class InteractiveTourComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: InteractiveTourComponent, deps: [{ token: InteractiveTourService }, { token: ToolService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: InteractiveTourComponent, selector: "igo-interactive-tour", inputs: { tourToStart: "tourToStart", styleButton: "styleButton", discoverTitleInLocale$: "discoverTitleInLocale$" }, ngImport: i0, template: "<ng-container *ngIf=\"showTourButton\">\n  <button\n    *ngIf=\"styleButton === 'icon'; else raisedButton\"\n    (click)=\"startInteractiveTour()\"\n    [ngClass]=\"getClass()\"\n    color=\"primary\"\n    mat-icon-button\n    tooltip-position=\"below\"\n    matTooltipShowDelay=\"500\"\n    [matTooltip]=\"\n      disabledTourButton\n        ? ('igo.common.interactiveTour.disaledTooltipTourToolButton'\n          | translate)\n        : ('igo.common.interactiveTour.tooltipTourToolButton' | translate)\n    \"\n    [disabled]=\"disabledTourButton\"\n  >\n    <mat-icon iconPositionEnd svgIcon=\"presentation-play\"> </mat-icon>\n  </button>\n\n  <ng-template #raisedButton>\n    <button\n      (click)=\"startInteractiveTour()\"\n      [ngClass]=\"getClass()\"\n      color=\"primary\"\n      mat-raised-button\n      tooltip-position=\"below\"\n      matTooltipShowDelay=\"500\"\n      [disabled]=\"disabledTourButton\"\n    >\n      {{ 'igo.common.interactiveTour.buttonTitle' | translate }}\n      {{ discoverTitleInLocale$ | async | translate }}\n      <mat-icon\n        iconPositionEnd\n        svgIcon=\"presentation-play\"\n        [matTooltip]=\"\n          disabledTourButton\n            ? ('igo.common.interactiveTour.disaledTooltipTourToolButton'\n              | translate)\n            : ('igo.common.interactiveTour.tooltipTourToolButton' | translate)\n        \"\n      >\n      </mat-icon>\n    </button>\n  </ng-template>\n</ng-container>\n", styles: ["igo-interactive-tour>button.mat-mdc-raised-button.tour-button-tool-icon{box-shadow:none}.shepherd-has-title .shepherd-content .shepherd-header{padding:.5em .75em}.shepherd-title{margin:0!important;font-weight:revert!important}.shepherd-progress{margin-right:15px;color:#737373}.shepherd-text{font-size:14px!important}.shepherd-element{border:1px solid;border-color:#474747;box-shadow:4px 5px #65656599}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: InteractiveTourComponent, selector: "igo-interactive-tour", inputs: { tourToStart: "tourToStart", styleButton: "styleButton", discoverTitleInLocale$: "discoverTitleInLocale$" }, ngImport: i0, template: "<ng-container *ngIf=\"showTourButton\">\r\n  <button\r\n    *ngIf=\"styleButton === 'icon'; else raisedButton\"\r\n    (click)=\"startInteractiveTour()\"\r\n    [ngClass]=\"getClass()\"\r\n    color=\"primary\"\r\n    mat-icon-button\r\n    tooltip-position=\"below\"\r\n    matTooltipShowDelay=\"500\"\r\n    [matTooltip]=\"\r\n      disabledTourButton\r\n        ? ('igo.common.interactiveTour.disaledTooltipTourToolButton'\r\n          | translate)\r\n        : ('igo.common.interactiveTour.tooltipTourToolButton' | translate)\r\n    \"\r\n    [disabled]=\"disabledTourButton\"\r\n  >\r\n    <mat-icon iconPositionEnd svgIcon=\"presentation-play\"> </mat-icon>\r\n  </button>\r\n\r\n  <ng-template #raisedButton>\r\n    <button\r\n      (click)=\"startInteractiveTour()\"\r\n      [ngClass]=\"getClass()\"\r\n      color=\"primary\"\r\n      mat-raised-button\r\n      tooltip-position=\"below\"\r\n      matTooltipShowDelay=\"500\"\r\n      [disabled]=\"disabledTourButton\"\r\n    >\r\n      {{ 'igo.common.interactiveTour.buttonTitle' | translate }}\r\n      {{ discoverTitleInLocale$ | async | translate }}\r\n      <mat-icon\r\n        iconPositionEnd\r\n        svgIcon=\"presentation-play\"\r\n        [matTooltip]=\"\r\n          disabledTourButton\r\n            ? ('igo.common.interactiveTour.disaledTooltipTourToolButton'\r\n              | translate)\r\n            : ('igo.common.interactiveTour.tooltipTourToolButton' | translate)\r\n        \"\r\n      >\r\n      </mat-icon>\r\n    </button>\r\n  </ng-template>\r\n</ng-container>\r\n", styles: ["igo-interactive-tour>button.mat-mdc-raised-button.tour-button-tool-icon{box-shadow:none}.shepherd-has-title .shepherd-content .shepherd-header{padding:.5em .75em}.shepherd-title{margin:0!important;font-weight:revert!important}.shepherd-progress{margin-right:15px;color:#737373}.shepherd-text{font-size:14px!important}.shepherd-element{border:1px solid;border-color:#474747;box-shadow:4px 5px #65656599}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: InteractiveTourComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-interactive-tour', encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"showTourButton\">\n  <button\n    *ngIf=\"styleButton === 'icon'; else raisedButton\"\n    (click)=\"startInteractiveTour()\"\n    [ngClass]=\"getClass()\"\n    color=\"primary\"\n    mat-icon-button\n    tooltip-position=\"below\"\n    matTooltipShowDelay=\"500\"\n    [matTooltip]=\"\n      disabledTourButton\n        ? ('igo.common.interactiveTour.disaledTooltipTourToolButton'\n          | translate)\n        : ('igo.common.interactiveTour.tooltipTourToolButton' | translate)\n    \"\n    [disabled]=\"disabledTourButton\"\n  >\n    <mat-icon iconPositionEnd svgIcon=\"presentation-play\"> </mat-icon>\n  </button>\n\n  <ng-template #raisedButton>\n    <button\n      (click)=\"startInteractiveTour()\"\n      [ngClass]=\"getClass()\"\n      color=\"primary\"\n      mat-raised-button\n      tooltip-position=\"below\"\n      matTooltipShowDelay=\"500\"\n      [disabled]=\"disabledTourButton\"\n    >\n      {{ 'igo.common.interactiveTour.buttonTitle' | translate }}\n      {{ discoverTitleInLocale$ | async | translate }}\n      <mat-icon\n        iconPositionEnd\n        svgIcon=\"presentation-play\"\n        [matTooltip]=\"\n          disabledTourButton\n            ? ('igo.common.interactiveTour.disaledTooltipTourToolButton'\n              | translate)\n            : ('igo.common.interactiveTour.tooltipTourToolButton' | translate)\n        \"\n      >\n      </mat-icon>\n    </button>\n  </ng-template>\n</ng-container>\n", styles: ["igo-interactive-tour>button.mat-mdc-raised-button.tour-button-tool-icon{box-shadow:none}.shepherd-has-title .shepherd-content .shepherd-header{padding:.5em .75em}.shepherd-title{margin:0!important;font-weight:revert!important}.shepherd-progress{margin-right:15px;color:#737373}.shepherd-text{font-size:14px!important}.shepherd-element{border:1px solid;border-color:#474747;box-shadow:4px 5px #65656599}\n"] }]
+            args: [{ selector: 'igo-interactive-tour', encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"showTourButton\">\r\n  <button\r\n    *ngIf=\"styleButton === 'icon'; else raisedButton\"\r\n    (click)=\"startInteractiveTour()\"\r\n    [ngClass]=\"getClass()\"\r\n    color=\"primary\"\r\n    mat-icon-button\r\n    tooltip-position=\"below\"\r\n    matTooltipShowDelay=\"500\"\r\n    [matTooltip]=\"\r\n      disabledTourButton\r\n        ? ('igo.common.interactiveTour.disaledTooltipTourToolButton'\r\n          | translate)\r\n        : ('igo.common.interactiveTour.tooltipTourToolButton' | translate)\r\n    \"\r\n    [disabled]=\"disabledTourButton\"\r\n  >\r\n    <mat-icon iconPositionEnd svgIcon=\"presentation-play\"> </mat-icon>\r\n  </button>\r\n\r\n  <ng-template #raisedButton>\r\n    <button\r\n      (click)=\"startInteractiveTour()\"\r\n      [ngClass]=\"getClass()\"\r\n      color=\"primary\"\r\n      mat-raised-button\r\n      tooltip-position=\"below\"\r\n      matTooltipShowDelay=\"500\"\r\n      [disabled]=\"disabledTourButton\"\r\n    >\r\n      {{ 'igo.common.interactiveTour.buttonTitle' | translate }}\r\n      {{ discoverTitleInLocale$ | async | translate }}\r\n      <mat-icon\r\n        iconPositionEnd\r\n        svgIcon=\"presentation-play\"\r\n        [matTooltip]=\"\r\n          disabledTourButton\r\n            ? ('igo.common.interactiveTour.disaledTooltipTourToolButton'\r\n              | translate)\r\n            : ('igo.common.interactiveTour.tooltipTourToolButton' | translate)\r\n        \"\r\n      >\r\n      </mat-icon>\r\n    </button>\r\n  </ng-template>\r\n</ng-container>\r\n", styles: ["igo-interactive-tour>button.mat-mdc-raised-button.tour-button-tool-icon{box-shadow:none}.shepherd-has-title .shepherd-content .shepherd-header{padding:.5em .75em}.shepherd-title{margin:0!important;font-weight:revert!important}.shepherd-progress{margin-right:15px;color:#737373}.shepherd-text{font-size:14px!important}.shepherd-element{border:1px solid;border-color:#474747;box-shadow:4px 5px #65656599}\n"] }]
         }], ctorParameters: function () { return [{ type: InteractiveTourService }, { type: ToolService }]; }, propDecorators: { tourToStart: [{
                 type: Input
             }], styleButton: [{
@@ -6917,11 +6917,11 @@ class JsonDialogComponent {
         return (baseKey ? baseKey + '.' : '') + key;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: JsonDialogComponent, deps: [{ token: i1$6.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: JsonDialogComponent, selector: "igo-json-dialog", ngImport: i0, template: "<h1 mat-dialog-title class=\"mat-typography\">{{ title }}</h1>\n\n<div mat-dialog-content class=\"mat-typography\">\n  <ng-container\n    *ngTemplateOutlet=\"loopObject; context: { obj: data }\"\n  ></ng-container>\n\n  <ng-template #loopObject let-obj=\"obj\" let-baseKey=\"baseKey\">\n    <ng-container *ngFor=\"let property of obj | keyvalue\">\n      <ng-container\n        *ngIf=\"ignoreKeys.indexOf(getKey(baseKey, property.key)) === -1\"\n      >\n        <ng-container *ngIf=\"isObject(property.value); else notObject\">\n          <ng-container\n            *ngTemplateOutlet=\"\n              loopObject;\n              context: {\n                obj: property.value,\n                baseKey: getKey(baseKey, property.key)\n              }\n            \"\n          ></ng-container>\n        </ng-container>\n\n        <ng-template #notObject>\n          <p>\n            <span\n              ><b>{{ getKey(baseKey, property.key) }}</b> : </span\n            ><span class=\"propertyValue\" [innerHtml]=\"property.value\"></span>\n          </p>\n        </ng-template>\n      </ng-container>\n    </ng-container>\n  </ng-template>\n</div>\n\n<div mat-dialog-actions>\n  <button mat-button color=\"primary\" (click)=\"dialogRef.close(false)\">\n    OK\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1$6.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$6.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: JsonDialogComponent, selector: "igo-json-dialog", ngImport: i0, template: "<h1 mat-dialog-title class=\"mat-typography\">{{ title }}</h1>\r\n\r\n<div mat-dialog-content class=\"mat-typography\">\r\n  <ng-container\r\n    *ngTemplateOutlet=\"loopObject; context: { obj: data }\"\r\n  ></ng-container>\r\n\r\n  <ng-template #loopObject let-obj=\"obj\" let-baseKey=\"baseKey\">\r\n    <ng-container *ngFor=\"let property of obj | keyvalue\">\r\n      <ng-container\r\n        *ngIf=\"ignoreKeys.indexOf(getKey(baseKey, property.key)) === -1\"\r\n      >\r\n        <ng-container *ngIf=\"isObject(property.value); else notObject\">\r\n          <ng-container\r\n            *ngTemplateOutlet=\"\r\n              loopObject;\r\n              context: {\r\n                obj: property.value,\r\n                baseKey: getKey(baseKey, property.key)\r\n              }\r\n            \"\r\n          ></ng-container>\r\n        </ng-container>\r\n\r\n        <ng-template #notObject>\r\n          <p>\r\n            <span\r\n              ><b>{{ getKey(baseKey, property.key) }}</b> : </span\r\n            ><span class=\"propertyValue\" [innerHtml]=\"property.value\"></span>\r\n          </p>\r\n        </ng-template>\r\n      </ng-container>\r\n    </ng-container>\r\n  </ng-template>\r\n</div>\r\n\r\n<div mat-dialog-actions>\r\n  <button mat-button color=\"primary\" (click)=\"dialogRef.close(false)\">\r\n    OK\r\n  </button>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1$6.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$6.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: JsonDialogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-json-dialog', template: "<h1 mat-dialog-title class=\"mat-typography\">{{ title }}</h1>\n\n<div mat-dialog-content class=\"mat-typography\">\n  <ng-container\n    *ngTemplateOutlet=\"loopObject; context: { obj: data }\"\n  ></ng-container>\n\n  <ng-template #loopObject let-obj=\"obj\" let-baseKey=\"baseKey\">\n    <ng-container *ngFor=\"let property of obj | keyvalue\">\n      <ng-container\n        *ngIf=\"ignoreKeys.indexOf(getKey(baseKey, property.key)) === -1\"\n      >\n        <ng-container *ngIf=\"isObject(property.value); else notObject\">\n          <ng-container\n            *ngTemplateOutlet=\"\n              loopObject;\n              context: {\n                obj: property.value,\n                baseKey: getKey(baseKey, property.key)\n              }\n            \"\n          ></ng-container>\n        </ng-container>\n\n        <ng-template #notObject>\n          <p>\n            <span\n              ><b>{{ getKey(baseKey, property.key) }}</b> : </span\n            ><span class=\"propertyValue\" [innerHtml]=\"property.value\"></span>\n          </p>\n        </ng-template>\n      </ng-container>\n    </ng-container>\n  </ng-template>\n</div>\n\n<div mat-dialog-actions>\n  <button mat-button color=\"primary\" (click)=\"dialogRef.close(false)\">\n    OK\n  </button>\n</div>\n" }]
+            args: [{ selector: 'igo-json-dialog', template: "<h1 mat-dialog-title class=\"mat-typography\">{{ title }}</h1>\r\n\r\n<div mat-dialog-content class=\"mat-typography\">\r\n  <ng-container\r\n    *ngTemplateOutlet=\"loopObject; context: { obj: data }\"\r\n  ></ng-container>\r\n\r\n  <ng-template #loopObject let-obj=\"obj\" let-baseKey=\"baseKey\">\r\n    <ng-container *ngFor=\"let property of obj | keyvalue\">\r\n      <ng-container\r\n        *ngIf=\"ignoreKeys.indexOf(getKey(baseKey, property.key)) === -1\"\r\n      >\r\n        <ng-container *ngIf=\"isObject(property.value); else notObject\">\r\n          <ng-container\r\n            *ngTemplateOutlet=\"\r\n              loopObject;\r\n              context: {\r\n                obj: property.value,\r\n                baseKey: getKey(baseKey, property.key)\r\n              }\r\n            \"\r\n          ></ng-container>\r\n        </ng-container>\r\n\r\n        <ng-template #notObject>\r\n          <p>\r\n            <span\r\n              ><b>{{ getKey(baseKey, property.key) }}</b> : </span\r\n            ><span class=\"propertyValue\" [innerHtml]=\"property.value\"></span>\r\n          </p>\r\n        </ng-template>\r\n      </ng-container>\r\n    </ng-container>\r\n  </ng-template>\r\n</div>\r\n\r\n<div mat-dialog-actions>\r\n  <button mat-button color=\"primary\" (click)=\"dialogRef.close(false)\">\r\n    OK\r\n  </button>\r\n</div>\r\n" }]
         }], ctorParameters: function () { return [{ type: i1$6.MatDialogRef }]; } });
 
 class JsonDialogService {
@@ -7353,11 +7353,11 @@ class ListComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ListComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ListComponent, selector: "igo-list", inputs: { navigation: "navigation", selection: "selection" }, host: { listeners: { "document:keydown": "handleKeyboardEvent($event)", "document:enter": "handleKeyboardEvent($event)" } }, queries: [{ propertyName: "listItems", predicate: ListItemDirective, descendants: true }], ngImport: i0, template: "<mat-list\n  igoClickout\n  [ngClass]=\"{ selectable: selection }\"\n  (clickout)=\"disableNavigation()\"\n  (click)=\"enableNavigation()\"\n>\n  <ng-content></ng-content>\n</mat-list>\n", styles: [":host{display:block;height:100%;overflow:auto;position:relative}:host mat-list{padding-top:0}:host ::ng-deep .mat-mdc-list .mat-mdc-list-item .mdc-list-item__primary-text{white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;max-height:36px;line-height:18px;-webkit-box-orient:vertical;-webkit-line-clamp:2}:host ::ng-deep .mat-mdc-list .mat-mdc-list-item.mdc-list-item--with-leading-icon{height:48px}:host ::ng-deep .mat-mdc-list ::ng-deep igo-collapsible>.mat-mdc-list-item>.mdc-list-item__primary-text>.mat-mdc-list-item{font-weight:700;opacity:.9}:host mat-list.selectable ::ng-deep [igolistitem]:not(.igo-list-item-disabled) mat-list-item:hover{cursor:pointer}:host ::ng-deep [igolistitem]:focus{outline:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2$1.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "directive", type: ClickoutDirective, selector: "[igoClickout]", outputs: ["clickout"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ListComponent, selector: "igo-list", inputs: { navigation: "navigation", selection: "selection" }, host: { listeners: { "document:keydown": "handleKeyboardEvent($event)", "document:enter": "handleKeyboardEvent($event)" } }, queries: [{ propertyName: "listItems", predicate: ListItemDirective, descendants: true }], ngImport: i0, template: "<mat-list\r\n  igoClickout\r\n  [ngClass]=\"{ selectable: selection }\"\r\n  (clickout)=\"disableNavigation()\"\r\n  (click)=\"enableNavigation()\"\r\n>\r\n  <ng-content></ng-content>\r\n</mat-list>\r\n", styles: [":host{display:block;height:100%;overflow:auto;position:relative}:host mat-list{padding-top:0}:host ::ng-deep .mat-mdc-list .mat-mdc-list-item .mdc-list-item__primary-text{white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;max-height:36px;line-height:18px;-webkit-box-orient:vertical;-webkit-line-clamp:2}:host ::ng-deep .mat-mdc-list .mat-mdc-list-item.mdc-list-item--with-leading-icon{height:48px}:host ::ng-deep .mat-mdc-list ::ng-deep igo-collapsible>.mat-mdc-list-item>.mdc-list-item__primary-text>.mat-mdc-list-item{font-weight:700;opacity:.9}:host mat-list.selectable ::ng-deep [igolistitem]:not(.igo-list-item-disabled) mat-list-item:hover{cursor:pointer}:host ::ng-deep [igolistitem]:focus{outline:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2$1.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "directive", type: ClickoutDirective, selector: "[igoClickout]", outputs: ["clickout"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-list', template: "<mat-list\n  igoClickout\n  [ngClass]=\"{ selectable: selection }\"\n  (clickout)=\"disableNavigation()\"\n  (click)=\"enableNavigation()\"\n>\n  <ng-content></ng-content>\n</mat-list>\n", styles: [":host{display:block;height:100%;overflow:auto;position:relative}:host mat-list{padding-top:0}:host ::ng-deep .mat-mdc-list .mat-mdc-list-item .mdc-list-item__primary-text{white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;max-height:36px;line-height:18px;-webkit-box-orient:vertical;-webkit-line-clamp:2}:host ::ng-deep .mat-mdc-list .mat-mdc-list-item.mdc-list-item--with-leading-icon{height:48px}:host ::ng-deep .mat-mdc-list ::ng-deep igo-collapsible>.mat-mdc-list-item>.mdc-list-item__primary-text>.mat-mdc-list-item{font-weight:700;opacity:.9}:host mat-list.selectable ::ng-deep [igolistitem]:not(.igo-list-item-disabled) mat-list-item:hover{cursor:pointer}:host ::ng-deep [igolistitem]:focus{outline:none}\n"] }]
+            args: [{ selector: 'igo-list', template: "<mat-list\r\n  igoClickout\r\n  [ngClass]=\"{ selectable: selection }\"\r\n  (clickout)=\"disableNavigation()\"\r\n  (click)=\"enableNavigation()\"\r\n>\r\n  <ng-content></ng-content>\r\n</mat-list>\r\n", styles: [":host{display:block;height:100%;overflow:auto;position:relative}:host mat-list{padding-top:0}:host ::ng-deep .mat-mdc-list .mat-mdc-list-item .mdc-list-item__primary-text{white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;max-height:36px;line-height:18px;-webkit-box-orient:vertical;-webkit-line-clamp:2}:host ::ng-deep .mat-mdc-list .mat-mdc-list-item.mdc-list-item--with-leading-icon{height:48px}:host ::ng-deep .mat-mdc-list ::ng-deep igo-collapsible>.mat-mdc-list-item>.mdc-list-item__primary-text>.mat-mdc-list-item{font-weight:700;opacity:.9}:host mat-list.selectable ::ng-deep [igolistitem]:not(.igo-list-item-disabled) mat-list-item:hover{cursor:pointer}:host ::ng-deep [igolistitem]:focus{outline:none}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { navigation: [{
                 type: Input
             }], selection: [{
@@ -7404,11 +7404,11 @@ class PanelComponent {
     _withHeader = true;
     cursorPointer = false;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PanelComponent, selector: "igo-panel", inputs: { title: "title", withHeader: "withHeader", cursorPointer: "cursorPointer" }, host: { properties: { "class.igo-panel-with-header": "this.withHeader" } }, ngImport: i0, template: "<div\n  *ngIf=\"withHeader\"\n  class=\"igo-panel-header\"\n  title=\"\"\n  [ngClass]=\"{ 'igo-cursor-pointer': cursorPointer === true }\"\n>\n  <div class=\"panel-left\">\n    <ng-content select=\"[panelLeftButton]\"></ng-content>\n  </div>\n  <h3 class=\"igo-panel-title\">\n    {{ title }}\n    <ng-content select=\"[panelHeader]\"></ng-content>\n  </h3>\n  <div class=\"panel-right\">\n    <ng-content select=\"[panelRightButton]\"></ng-content>\n  </div>\n</div>\n<div class=\"igo-panel-content\" title=\"\">\n  <ng-content></ng-content>\n</div>\n", styles: [":host{display:flex;flex-direction:column;overflow:hidden}:host igo-interactive-tour{position:absolute;top:0;right:0}:host .igo-panel-header{display:flex;justify-content:space-between;align-items:center;height:48px;text-align:center}:host .igo-panel-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;margin:0;font-weight:600;flex:1}:host .igo-panel-content{flex:1;overflow:auto}:host .igo-cursor-pointer{cursor:pointer}:host .panel-left,:host .panel-right{display:flex;min-width:40px}:host .panel-right:not(:empty){padding-right:4px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PanelComponent, selector: "igo-panel", inputs: { title: "title", withHeader: "withHeader", cursorPointer: "cursorPointer" }, host: { properties: { "class.igo-panel-with-header": "this.withHeader" } }, ngImport: i0, template: "<div\r\n  *ngIf=\"withHeader\"\r\n  class=\"igo-panel-header\"\r\n  title=\"\"\r\n  [ngClass]=\"{ 'igo-cursor-pointer': cursorPointer === true }\"\r\n>\r\n  <div class=\"panel-left\">\r\n    <ng-content select=\"[panelLeftButton]\"></ng-content>\r\n  </div>\r\n  <h3 class=\"igo-panel-title\">\r\n    {{ title }}\r\n    <ng-content select=\"[panelHeader]\"></ng-content>\r\n  </h3>\r\n  <div class=\"panel-right\">\r\n    <ng-content select=\"[panelRightButton]\"></ng-content>\r\n  </div>\r\n</div>\r\n<div class=\"igo-panel-content\" title=\"\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [":host{display:flex;flex-direction:column;overflow:hidden}:host igo-interactive-tour{position:absolute;top:0;right:0}:host .igo-panel-header{display:flex;justify-content:space-between;align-items:center;height:48px;text-align:center}:host .igo-panel-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;margin:0;font-weight:600;flex:1}:host .igo-panel-content{flex:1;overflow:auto}:host .igo-cursor-pointer{cursor:pointer}:host .panel-left,:host .panel-right{display:flex;min-width:40px}:host .panel-right:not(:empty){padding-right:4px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-panel', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  *ngIf=\"withHeader\"\n  class=\"igo-panel-header\"\n  title=\"\"\n  [ngClass]=\"{ 'igo-cursor-pointer': cursorPointer === true }\"\n>\n  <div class=\"panel-left\">\n    <ng-content select=\"[panelLeftButton]\"></ng-content>\n  </div>\n  <h3 class=\"igo-panel-title\">\n    {{ title }}\n    <ng-content select=\"[panelHeader]\"></ng-content>\n  </h3>\n  <div class=\"panel-right\">\n    <ng-content select=\"[panelRightButton]\"></ng-content>\n  </div>\n</div>\n<div class=\"igo-panel-content\" title=\"\">\n  <ng-content></ng-content>\n</div>\n", styles: [":host{display:flex;flex-direction:column;overflow:hidden}:host igo-interactive-tour{position:absolute;top:0;right:0}:host .igo-panel-header{display:flex;justify-content:space-between;align-items:center;height:48px;text-align:center}:host .igo-panel-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;margin:0;font-weight:600;flex:1}:host .igo-panel-content{flex:1;overflow:auto}:host .igo-cursor-pointer{cursor:pointer}:host .panel-left,:host .panel-right{display:flex;min-width:40px}:host .panel-right:not(:empty){padding-right:4px}\n"] }]
+            args: [{ selector: 'igo-panel', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  *ngIf=\"withHeader\"\r\n  class=\"igo-panel-header\"\r\n  title=\"\"\r\n  [ngClass]=\"{ 'igo-cursor-pointer': cursorPointer === true }\"\r\n>\r\n  <div class=\"panel-left\">\r\n    <ng-content select=\"[panelLeftButton]\"></ng-content>\r\n  </div>\r\n  <h3 class=\"igo-panel-title\">\r\n    {{ title }}\r\n    <ng-content select=\"[panelHeader]\"></ng-content>\r\n  </h3>\r\n  <div class=\"panel-right\">\r\n    <ng-content select=\"[panelRightButton]\"></ng-content>\r\n  </div>\r\n</div>\r\n<div class=\"igo-panel-content\" title=\"\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [":host{display:flex;flex-direction:column;overflow:hidden}:host igo-interactive-tour{position:absolute;top:0;right:0}:host .igo-panel-header{display:flex;justify-content:space-between;align-items:center;height:48px;text-align:center}:host .igo-panel-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;margin:0;font-weight:600;flex:1}:host .igo-panel-content{flex:1;overflow:auto}:host .igo-cursor-pointer{cursor:pointer}:host .panel-left,:host .panel-right{display:flex;min-width:40px}:host .panel-right:not(:empty){padding-right:4px}\n"] }]
         }], propDecorators: { title: [{
                 type: Input
             }], withHeader: [{
@@ -7523,11 +7523,11 @@ class SpinnerComponent {
         this.shown = false;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SpinnerComponent, selector: "igo-spinner", inputs: { shown: "shown" }, ngImport: i0, template: "<div\n  [ngClass]=\"{\n    'igo-spinner-container': true,\n    'igo-spinner-shown': (shown$ | async)\n  }\"\n>\n  <div class=\"igo-spinner-background\"></div>\n  <mat-progress-spinner\n    diameter=\"40\"\n    mode=\"indeterminate\"\n  ></mat-progress-spinner>\n</div>\n", styles: [":host .igo-spinner-container{display:none;position:relative;pointer-events:none}:host .igo-spinner-container.igo-spinner-shown{display:block}:host mat-progress-spinner{height:40px;width:40px;border-radius:50%}:host .igo-spinner-background{height:36px;width:36px;border-radius:50%;border:4px solid #ffffff;position:absolute;top:2px;left:2px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2$4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SpinnerComponent, selector: "igo-spinner", inputs: { shown: "shown" }, ngImport: i0, template: "<div\r\n  [ngClass]=\"{\r\n    'igo-spinner-container': true,\r\n    'igo-spinner-shown': (shown$ | async)\r\n  }\"\r\n>\r\n  <div class=\"igo-spinner-background\"></div>\r\n  <mat-progress-spinner\r\n    diameter=\"40\"\r\n    mode=\"indeterminate\"\r\n  ></mat-progress-spinner>\r\n</div>\r\n", styles: [":host .igo-spinner-container{display:none;position:relative;pointer-events:none}:host .igo-spinner-container.igo-spinner-shown{display:block}:host mat-progress-spinner{height:40px;width:40px;border-radius:50%}:host .igo-spinner-background{height:36px;width:36px;border-radius:50%;border:4px solid #ffffff;position:absolute;top:2px;left:2px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2$4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SpinnerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-spinner', template: "<div\n  [ngClass]=\"{\n    'igo-spinner-container': true,\n    'igo-spinner-shown': (shown$ | async)\n  }\"\n>\n  <div class=\"igo-spinner-background\"></div>\n  <mat-progress-spinner\n    diameter=\"40\"\n    mode=\"indeterminate\"\n  ></mat-progress-spinner>\n</div>\n", styles: [":host .igo-spinner-container{display:none;position:relative;pointer-events:none}:host .igo-spinner-container.igo-spinner-shown{display:block}:host mat-progress-spinner{height:40px;width:40px;border-radius:50%}:host .igo-spinner-background{height:36px;width:36px;border-radius:50%;border:4px solid #ffffff;position:absolute;top:2px;left:2px}\n"] }]
+            args: [{ selector: 'igo-spinner', template: "<div\r\n  [ngClass]=\"{\r\n    'igo-spinner-container': true,\r\n    'igo-spinner-shown': (shown$ | async)\r\n  }\"\r\n>\r\n  <div class=\"igo-spinner-background\"></div>\r\n  <mat-progress-spinner\r\n    diameter=\"40\"\r\n    mode=\"indeterminate\"\r\n  ></mat-progress-spinner>\r\n</div>\r\n", styles: [":host .igo-spinner-container{display:none;position:relative;pointer-events:none}:host .igo-spinner-container.igo-spinner-shown{display:block}:host mat-progress-spinner{height:40px;width:40px;border-radius:50%}:host .igo-spinner-background{height:36px;width:36px;border-radius:50%;border:4px solid #ffffff;position:absolute;top:2px;left:2px}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { shown: [{
                 type: Input
             }] } });
@@ -7772,11 +7772,11 @@ class TableComponent {
         action.click(row);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TableComponent, selector: "igo-table", inputs: { database: "database", model: "model", hasFilterInput: "hasFilterInput" }, outputs: { select: "select" }, viewQueries: [{ propertyName: "filter", first: true, predicate: ["filter"], descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"table-box\">\n  <div class=\"table-header\" *ngIf=\"hasFilterInput\">\n    <mat-form-field floatPlaceholder=\"never\">\n      <input\n        matInput\n        #filter\n        [placeholder]=\"'igo.common.table.filter' | translate\"\n      />\n    </mat-form-field>\n  </div>\n\n  <div class=\"table-container\">\n    <table mat-table #table [dataSource]=\"dataSource\" matSort>\n      <!-- Checkbox Column -->\n      <ng-container matColumnDef=\"selectionCheckbox\">\n        <th mat-header-cell *matHeaderCellDef>\n          <mat-checkbox\n            (change)=\"$event ? masterToggle() : null\"\n            [checked]=\"selection.hasValue() && isAllSelected()\"\n            [indeterminate]=\"selection.hasValue() && !isAllSelected()\"\n          >\n          </mat-checkbox>\n        </th>\n        <td mat-cell *matCellDef=\"let row\">\n          <mat-checkbox\n            (click)=\"$event.stopPropagation()\"\n            (change)=\"$event ? selection.toggle(row) : null\"\n            [checked]=\"selection.isSelected(row)\"\n          >\n          </mat-checkbox>\n        </td>\n      </ng-container>\n\n      <ng-container\n        [matColumnDef]=\"column.name\"\n        *ngFor=\"let column of model.columns\"\n      >\n        <ng-container *ngIf=\"column.sortable\">\n          <th mat-header-cell *matHeaderCellDef mat-sort-header>\n            {{ column.title }}\n          </th>\n        </ng-container>\n\n        <ng-container *ngIf=\"!column.sortable\">\n          <th mat-header-cell *matHeaderCellDef>{{ column.title }}</th>\n        </ng-container>\n\n        <ng-container *ngIf=\"!column.html; else cellHTML\">\n          <td\n            mat-cell\n            *matCellDef=\"let row\"\n            class=\"mat-cell-text\"\n            [ngClass]=\"\n              model.cellClassFunc ? model.cellClassFunc(row, column) : {}\n            \"\n          >\n            {{ getValue(row, column.name) }}\n          </td>\n        </ng-container>\n\n        <ng-template #cellHTML>\n          <td\n            mat-cell\n            *matCellDef=\"let row\"\n            class=\"mat-cell-text\"\n            [ngClass]=\"\n              model.cellClassFunc ? model.cellClassFunc(row, column) : {}\n            \"\n            [innerHTML]=\"getValue(row, column.name)\"\n          ></td>\n        </ng-template>\n      </ng-container>\n\n      <!-- Action Column -->\n      <ng-container matColumnDef=\"action\">\n        <th mat-header-cell *matHeaderCellDef></th>\n        <td mat-cell *matCellDef=\"let row\">\n          <button\n            *ngFor=\"let action of model.actions\"\n            mat-mini-fab\n            [color]=\"getActionColor(action.color)\"\n            (click)=\"handleClickAction($event, action, row)\"\n          >\n            <mat-icon svgIcon=\"{{ action.icon }}\"></mat-icon>\n          </button>\n        </td>\n      </ng-container>\n\n      <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n      <tr\n        mat-row\n        *matRowDef=\"let row; columns: displayedColumns\"\n        [ngClass]=\"model.rowClassFunc ? model.rowClassFunc(row) : {}\"\n        (click)=\"selection.toggle(row)\"\n      ></tr>\n    </table>\n  </div>\n</div>\n", styles: [":host{width:100%;height:100%;display:block}.table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}.table-box{height:100%;display:flex;flex-direction:column}.table-header{min-height:64px;max-width:500px;display:flex;flex:0 1 auto;align-items:baseline;padding:8px 24px 0;font-size:20px;justify-content:space-between}tr[mat-header-row],tr[mat-row]{height:60px}.mat-cell-text{overflow:hidden;word-wrap:break-word}td[mat-cell]{padding-right:15px}th.mat-mdc-header-cell{padding-right:5px}button{margin-right:10px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2.MatMiniFabButton, selector: "button[mat-mini-fab]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5$1.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: "directive", type: i7$1.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i7$1.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i6$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TableComponent, selector: "igo-table", inputs: { database: "database", model: "model", hasFilterInput: "hasFilterInput" }, outputs: { select: "select" }, viewQueries: [{ propertyName: "filter", first: true, predicate: ["filter"], descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"table-box\">\r\n  <div class=\"table-header\" *ngIf=\"hasFilterInput\">\r\n    <mat-form-field floatPlaceholder=\"never\">\r\n      <input\r\n        matInput\r\n        #filter\r\n        [placeholder]=\"'igo.common.table.filter' | translate\"\r\n      />\r\n    </mat-form-field>\r\n  </div>\r\n\r\n  <div class=\"table-container\">\r\n    <table mat-table #table [dataSource]=\"dataSource\" matSort>\r\n      <!-- Checkbox Column -->\r\n      <ng-container matColumnDef=\"selectionCheckbox\">\r\n        <th mat-header-cell *matHeaderCellDef>\r\n          <mat-checkbox\r\n            (change)=\"$event ? masterToggle() : null\"\r\n            [checked]=\"selection.hasValue() && isAllSelected()\"\r\n            [indeterminate]=\"selection.hasValue() && !isAllSelected()\"\r\n          >\r\n          </mat-checkbox>\r\n        </th>\r\n        <td mat-cell *matCellDef=\"let row\">\r\n          <mat-checkbox\r\n            (click)=\"$event.stopPropagation()\"\r\n            (change)=\"$event ? selection.toggle(row) : null\"\r\n            [checked]=\"selection.isSelected(row)\"\r\n          >\r\n          </mat-checkbox>\r\n        </td>\r\n      </ng-container>\r\n\r\n      <ng-container\r\n        [matColumnDef]=\"column.name\"\r\n        *ngFor=\"let column of model.columns\"\r\n      >\r\n        <ng-container *ngIf=\"column.sortable\">\r\n          <th mat-header-cell *matHeaderCellDef mat-sort-header>\r\n            {{ column.title }}\r\n          </th>\r\n        </ng-container>\r\n\r\n        <ng-container *ngIf=\"!column.sortable\">\r\n          <th mat-header-cell *matHeaderCellDef>{{ column.title }}</th>\r\n        </ng-container>\r\n\r\n        <ng-container *ngIf=\"!column.html; else cellHTML\">\r\n          <td\r\n            mat-cell\r\n            *matCellDef=\"let row\"\r\n            class=\"mat-cell-text\"\r\n            [ngClass]=\"\r\n              model.cellClassFunc ? model.cellClassFunc(row, column) : {}\r\n            \"\r\n          >\r\n            {{ getValue(row, column.name) }}\r\n          </td>\r\n        </ng-container>\r\n\r\n        <ng-template #cellHTML>\r\n          <td\r\n            mat-cell\r\n            *matCellDef=\"let row\"\r\n            class=\"mat-cell-text\"\r\n            [ngClass]=\"\r\n              model.cellClassFunc ? model.cellClassFunc(row, column) : {}\r\n            \"\r\n            [innerHTML]=\"getValue(row, column.name)\"\r\n          ></td>\r\n        </ng-template>\r\n      </ng-container>\r\n\r\n      <!-- Action Column -->\r\n      <ng-container matColumnDef=\"action\">\r\n        <th mat-header-cell *matHeaderCellDef></th>\r\n        <td mat-cell *matCellDef=\"let row\">\r\n          <button\r\n            *ngFor=\"let action of model.actions\"\r\n            mat-mini-fab\r\n            [color]=\"getActionColor(action.color)\"\r\n            (click)=\"handleClickAction($event, action, row)\"\r\n          >\r\n            <mat-icon svgIcon=\"{{ action.icon }}\"></mat-icon>\r\n          </button>\r\n        </td>\r\n      </ng-container>\r\n\r\n      <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\r\n      <tr\r\n        mat-row\r\n        *matRowDef=\"let row; columns: displayedColumns\"\r\n        [ngClass]=\"model.rowClassFunc ? model.rowClassFunc(row) : {}\"\r\n        (click)=\"selection.toggle(row)\"\r\n      ></tr>\r\n    </table>\r\n  </div>\r\n</div>\r\n", styles: [":host{width:100%;height:100%;display:block}.table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}.table-box{height:100%;display:flex;flex-direction:column}.table-header{min-height:64px;max-width:500px;display:flex;flex:0 1 auto;align-items:baseline;padding:8px 24px 0;font-size:20px;justify-content:space-between}tr[mat-header-row],tr[mat-row]{height:60px}.mat-cell-text{overflow:hidden;word-wrap:break-word}td[mat-cell]{padding-right:15px}th.mat-mdc-header-cell{padding-right:5px}button{margin-right:10px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2.MatMiniFabButton, selector: "button[mat-mini-fab]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5$1.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: "directive", type: i7$1.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i7$1.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i6$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-table', template: "<div class=\"table-box\">\n  <div class=\"table-header\" *ngIf=\"hasFilterInput\">\n    <mat-form-field floatPlaceholder=\"never\">\n      <input\n        matInput\n        #filter\n        [placeholder]=\"'igo.common.table.filter' | translate\"\n      />\n    </mat-form-field>\n  </div>\n\n  <div class=\"table-container\">\n    <table mat-table #table [dataSource]=\"dataSource\" matSort>\n      <!-- Checkbox Column -->\n      <ng-container matColumnDef=\"selectionCheckbox\">\n        <th mat-header-cell *matHeaderCellDef>\n          <mat-checkbox\n            (change)=\"$event ? masterToggle() : null\"\n            [checked]=\"selection.hasValue() && isAllSelected()\"\n            [indeterminate]=\"selection.hasValue() && !isAllSelected()\"\n          >\n          </mat-checkbox>\n        </th>\n        <td mat-cell *matCellDef=\"let row\">\n          <mat-checkbox\n            (click)=\"$event.stopPropagation()\"\n            (change)=\"$event ? selection.toggle(row) : null\"\n            [checked]=\"selection.isSelected(row)\"\n          >\n          </mat-checkbox>\n        </td>\n      </ng-container>\n\n      <ng-container\n        [matColumnDef]=\"column.name\"\n        *ngFor=\"let column of model.columns\"\n      >\n        <ng-container *ngIf=\"column.sortable\">\n          <th mat-header-cell *matHeaderCellDef mat-sort-header>\n            {{ column.title }}\n          </th>\n        </ng-container>\n\n        <ng-container *ngIf=\"!column.sortable\">\n          <th mat-header-cell *matHeaderCellDef>{{ column.title }}</th>\n        </ng-container>\n\n        <ng-container *ngIf=\"!column.html; else cellHTML\">\n          <td\n            mat-cell\n            *matCellDef=\"let row\"\n            class=\"mat-cell-text\"\n            [ngClass]=\"\n              model.cellClassFunc ? model.cellClassFunc(row, column) : {}\n            \"\n          >\n            {{ getValue(row, column.name) }}\n          </td>\n        </ng-container>\n\n        <ng-template #cellHTML>\n          <td\n            mat-cell\n            *matCellDef=\"let row\"\n            class=\"mat-cell-text\"\n            [ngClass]=\"\n              model.cellClassFunc ? model.cellClassFunc(row, column) : {}\n            \"\n            [innerHTML]=\"getValue(row, column.name)\"\n          ></td>\n        </ng-template>\n      </ng-container>\n\n      <!-- Action Column -->\n      <ng-container matColumnDef=\"action\">\n        <th mat-header-cell *matHeaderCellDef></th>\n        <td mat-cell *matCellDef=\"let row\">\n          <button\n            *ngFor=\"let action of model.actions\"\n            mat-mini-fab\n            [color]=\"getActionColor(action.color)\"\n            (click)=\"handleClickAction($event, action, row)\"\n          >\n            <mat-icon svgIcon=\"{{ action.icon }}\"></mat-icon>\n          </button>\n        </td>\n      </ng-container>\n\n      <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n      <tr\n        mat-row\n        *matRowDef=\"let row; columns: displayedColumns\"\n        [ngClass]=\"model.rowClassFunc ? model.rowClassFunc(row) : {}\"\n        (click)=\"selection.toggle(row)\"\n      ></tr>\n    </table>\n  </div>\n</div>\n", styles: [":host{width:100%;height:100%;display:block}.table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}.table-box{height:100%;display:flex;flex-direction:column}.table-header{min-height:64px;max-width:500px;display:flex;flex:0 1 auto;align-items:baseline;padding:8px 24px 0;font-size:20px;justify-content:space-between}tr[mat-header-row],tr[mat-row]{height:60px}.mat-cell-text{overflow:hidden;word-wrap:break-word}td[mat-cell]{padding-right:15px}th.mat-mdc-header-cell{padding-right:5px}button{margin-right:10px}\n"] }]
+            args: [{ selector: 'igo-table', template: "<div class=\"table-box\">\r\n  <div class=\"table-header\" *ngIf=\"hasFilterInput\">\r\n    <mat-form-field floatPlaceholder=\"never\">\r\n      <input\r\n        matInput\r\n        #filter\r\n        [placeholder]=\"'igo.common.table.filter' | translate\"\r\n      />\r\n    </mat-form-field>\r\n  </div>\r\n\r\n  <div class=\"table-container\">\r\n    <table mat-table #table [dataSource]=\"dataSource\" matSort>\r\n      <!-- Checkbox Column -->\r\n      <ng-container matColumnDef=\"selectionCheckbox\">\r\n        <th mat-header-cell *matHeaderCellDef>\r\n          <mat-checkbox\r\n            (change)=\"$event ? masterToggle() : null\"\r\n            [checked]=\"selection.hasValue() && isAllSelected()\"\r\n            [indeterminate]=\"selection.hasValue() && !isAllSelected()\"\r\n          >\r\n          </mat-checkbox>\r\n        </th>\r\n        <td mat-cell *matCellDef=\"let row\">\r\n          <mat-checkbox\r\n            (click)=\"$event.stopPropagation()\"\r\n            (change)=\"$event ? selection.toggle(row) : null\"\r\n            [checked]=\"selection.isSelected(row)\"\r\n          >\r\n          </mat-checkbox>\r\n        </td>\r\n      </ng-container>\r\n\r\n      <ng-container\r\n        [matColumnDef]=\"column.name\"\r\n        *ngFor=\"let column of model.columns\"\r\n      >\r\n        <ng-container *ngIf=\"column.sortable\">\r\n          <th mat-header-cell *matHeaderCellDef mat-sort-header>\r\n            {{ column.title }}\r\n          </th>\r\n        </ng-container>\r\n\r\n        <ng-container *ngIf=\"!column.sortable\">\r\n          <th mat-header-cell *matHeaderCellDef>{{ column.title }}</th>\r\n        </ng-container>\r\n\r\n        <ng-container *ngIf=\"!column.html; else cellHTML\">\r\n          <td\r\n            mat-cell\r\n            *matCellDef=\"let row\"\r\n            class=\"mat-cell-text\"\r\n            [ngClass]=\"\r\n              model.cellClassFunc ? model.cellClassFunc(row, column) : {}\r\n            \"\r\n          >\r\n            {{ getValue(row, column.name) }}\r\n          </td>\r\n        </ng-container>\r\n\r\n        <ng-template #cellHTML>\r\n          <td\r\n            mat-cell\r\n            *matCellDef=\"let row\"\r\n            class=\"mat-cell-text\"\r\n            [ngClass]=\"\r\n              model.cellClassFunc ? model.cellClassFunc(row, column) : {}\r\n            \"\r\n            [innerHTML]=\"getValue(row, column.name)\"\r\n          ></td>\r\n        </ng-template>\r\n      </ng-container>\r\n\r\n      <!-- Action Column -->\r\n      <ng-container matColumnDef=\"action\">\r\n        <th mat-header-cell *matHeaderCellDef></th>\r\n        <td mat-cell *matCellDef=\"let row\">\r\n          <button\r\n            *ngFor=\"let action of model.actions\"\r\n            mat-mini-fab\r\n            [color]=\"getActionColor(action.color)\"\r\n            (click)=\"handleClickAction($event, action, row)\"\r\n          >\r\n            <mat-icon svgIcon=\"{{ action.icon }}\"></mat-icon>\r\n          </button>\r\n        </td>\r\n      </ng-container>\r\n\r\n      <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\r\n      <tr\r\n        mat-row\r\n        *matRowDef=\"let row; columns: displayedColumns\"\r\n        [ngClass]=\"model.rowClassFunc ? model.rowClassFunc(row) : {}\"\r\n        (click)=\"selection.toggle(row)\"\r\n      ></tr>\r\n    </table>\r\n  </div>\r\n</div>\r\n", styles: [":host{width:100%;height:100%;display:block}.table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}.table-box{height:100%;display:flex;flex-direction:column}.table-header{min-height:64px;max-width:500px;display:flex;flex:0 1 auto;align-items:baseline;padding:8px 24px 0;font-size:20px;justify-content:space-between}tr[mat-header-row],tr[mat-row]{height:60px}.mat-cell-text{overflow:hidden;word-wrap:break-word}td[mat-cell]{padding-right:15px}th.mat-mdc-header-cell{padding-right:5px}button{margin-right:10px}\n"] }]
         }], propDecorators: { database: [{
                 type: Input
             }], model: [{
@@ -8069,11 +8069,11 @@ class ToolboxComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ToolboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ToolboxComponent, selector: "igo-toolbox", inputs: { toolbox: "toolbox", animate: "animate", color: "color" }, host: { properties: { "class.color-grey": "this.classColorGrey", "class.color-primary": "this.classColorPrimary" } }, ngImport: i0, template: "<igo-actionbar\n  *ngIf=\"(toolbar$ | async).length > 0\"\n  [store]=\"actionStore\"\n  [withIcon]=\"true\"\n  [withTitle]=\"toolbarWithTitle$ | async\"\n  [withTooltip]=\"(toolbarWithTitle$ | async) === false\"\n  [scrollActive]=\"toolbarWithTitle$ | async\"\n  [horizontal]=\"false\"\n>\n</igo-actionbar>\n\n<div\n  *ngIf=\"activeTool$ | async as tool\"\n  class=\"igo-tool-container mat-body-1\"\n  [ngClass]=\"{\n    'igo-tool-container-with-toolbar': !actionStore.empty,\n    'igo-tool-container-with-animation': animate\n  }\"\n  [@toolSlideInOut]=\"animation$ | async\"\n  (@toolSlideInOut.start)=\"onAnimationStart()\"\n  (@toolSlideInOut.done)=\"onAnimationComplete()\"\n>\n  <igo-dynamic-outlet\n    [component]=\"tool.component\"\n    [inputs]=\"getToolInputs(tool)\"\n  >\n  </igo-dynamic-outlet>\n</div>\n", styles: [":host{display:block;position:relative;overflow:hidden;width:100%;height:100%}:host ::ng-deep .mdc-list-item--with-leading-avatar .mdc-list-item__start{margin:0}:host .igo-tool-container{position:absolute;inset:0;margin-bottom:0}:host .igo-tool-container-with-animation{transform:translate3d(100%,0,0)}:host .igo-tool-container-with-toolbar{left:50px}:host igo-actionbar{height:100%}:host igo-actionbar.with-title{width:100%;overflow:auto}:host igo-actionbar:not(.with-title){width:48px;overflow:hidden;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd}@media only screen and (orientation:portrait) and (max-width: 599px),only screen and (orientation:landscape) and (max-width: 959px){:host igo-actionbar:not(.with-title){overflow:auto}}:host igo-dynamic-outlet{overflow:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ActionbarComponent, selector: "igo-actionbar", inputs: ["store", "mode", "withToggleButton", "horizontal", "color", "iconColor", "withTitle", "withTooltip", "scrollActive", "withIcon", "icon", "xPosition", "yPosition", "overlayClass"] }, { kind: "component", type: DynamicOutletComponent, selector: "igo-dynamic-outlet", inputs: ["component", "inputs", "subscribers"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], animations: [toolSlideInOut()], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ToolboxComponent, selector: "igo-toolbox", inputs: { toolbox: "toolbox", animate: "animate", color: "color" }, host: { properties: { "class.color-grey": "this.classColorGrey", "class.color-primary": "this.classColorPrimary" } }, ngImport: i0, template: "<igo-actionbar\r\n  *ngIf=\"(toolbar$ | async).length > 0\"\r\n  [store]=\"actionStore\"\r\n  [withIcon]=\"true\"\r\n  [withTitle]=\"toolbarWithTitle$ | async\"\r\n  [withTooltip]=\"(toolbarWithTitle$ | async) === false\"\r\n  [scrollActive]=\"toolbarWithTitle$ | async\"\r\n  [horizontal]=\"false\"\r\n>\r\n</igo-actionbar>\r\n\r\n<div\r\n  *ngIf=\"activeTool$ | async as tool\"\r\n  class=\"igo-tool-container mat-body-1\"\r\n  [ngClass]=\"{\r\n    'igo-tool-container-with-toolbar': !actionStore.empty,\r\n    'igo-tool-container-with-animation': animate\r\n  }\"\r\n  [@toolSlideInOut]=\"animation$ | async\"\r\n  (@toolSlideInOut.start)=\"onAnimationStart()\"\r\n  (@toolSlideInOut.done)=\"onAnimationComplete()\"\r\n>\r\n  <igo-dynamic-outlet\r\n    [component]=\"tool.component\"\r\n    [inputs]=\"getToolInputs(tool)\"\r\n  >\r\n  </igo-dynamic-outlet>\r\n</div>\r\n", styles: [":host{display:block;position:relative;overflow:hidden;width:100%;height:100%}:host ::ng-deep .mdc-list-item--with-leading-avatar .mdc-list-item__start{margin:0}:host .igo-tool-container{position:absolute;inset:0;margin-bottom:0}:host .igo-tool-container-with-animation{transform:translate3d(100%,0,0)}:host .igo-tool-container-with-toolbar{left:50px}:host igo-actionbar{height:100%}:host igo-actionbar.with-title{width:100%;overflow:auto}:host igo-actionbar:not(.with-title){width:48px;overflow:hidden;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd}@media only screen and (orientation:portrait) and (max-width: 599px),only screen and (orientation:landscape) and (max-width: 959px){:host igo-actionbar:not(.with-title){overflow:auto}}:host igo-dynamic-outlet{overflow:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ActionbarComponent, selector: "igo-actionbar", inputs: ["store", "mode", "withToggleButton", "horizontal", "color", "iconColor", "withTitle", "withTooltip", "scrollActive", "withIcon", "icon", "xPosition", "yPosition", "overlayClass"] }, { kind: "component", type: DynamicOutletComponent, selector: "igo-dynamic-outlet", inputs: ["component", "inputs", "subscribers"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], animations: [toolSlideInOut()], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ToolboxComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-toolbox', animations: [toolSlideInOut()], changeDetection: ChangeDetectionStrategy.OnPush, template: "<igo-actionbar\n  *ngIf=\"(toolbar$ | async).length > 0\"\n  [store]=\"actionStore\"\n  [withIcon]=\"true\"\n  [withTitle]=\"toolbarWithTitle$ | async\"\n  [withTooltip]=\"(toolbarWithTitle$ | async) === false\"\n  [scrollActive]=\"toolbarWithTitle$ | async\"\n  [horizontal]=\"false\"\n>\n</igo-actionbar>\n\n<div\n  *ngIf=\"activeTool$ | async as tool\"\n  class=\"igo-tool-container mat-body-1\"\n  [ngClass]=\"{\n    'igo-tool-container-with-toolbar': !actionStore.empty,\n    'igo-tool-container-with-animation': animate\n  }\"\n  [@toolSlideInOut]=\"animation$ | async\"\n  (@toolSlideInOut.start)=\"onAnimationStart()\"\n  (@toolSlideInOut.done)=\"onAnimationComplete()\"\n>\n  <igo-dynamic-outlet\n    [component]=\"tool.component\"\n    [inputs]=\"getToolInputs(tool)\"\n  >\n  </igo-dynamic-outlet>\n</div>\n", styles: [":host{display:block;position:relative;overflow:hidden;width:100%;height:100%}:host ::ng-deep .mdc-list-item--with-leading-avatar .mdc-list-item__start{margin:0}:host .igo-tool-container{position:absolute;inset:0;margin-bottom:0}:host .igo-tool-container-with-animation{transform:translate3d(100%,0,0)}:host .igo-tool-container-with-toolbar{left:50px}:host igo-actionbar{height:100%}:host igo-actionbar.with-title{width:100%;overflow:auto}:host igo-actionbar:not(.with-title){width:48px;overflow:hidden;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd}@media only screen and (orientation:portrait) and (max-width: 599px),only screen and (orientation:landscape) and (max-width: 959px){:host igo-actionbar:not(.with-title){overflow:auto}}:host igo-dynamic-outlet{overflow:auto}\n"] }]
+            args: [{ selector: 'igo-toolbox', animations: [toolSlideInOut()], changeDetection: ChangeDetectionStrategy.OnPush, template: "<igo-actionbar\r\n  *ngIf=\"(toolbar$ | async).length > 0\"\r\n  [store]=\"actionStore\"\r\n  [withIcon]=\"true\"\r\n  [withTitle]=\"toolbarWithTitle$ | async\"\r\n  [withTooltip]=\"(toolbarWithTitle$ | async) === false\"\r\n  [scrollActive]=\"toolbarWithTitle$ | async\"\r\n  [horizontal]=\"false\"\r\n>\r\n</igo-actionbar>\r\n\r\n<div\r\n  *ngIf=\"activeTool$ | async as tool\"\r\n  class=\"igo-tool-container mat-body-1\"\r\n  [ngClass]=\"{\r\n    'igo-tool-container-with-toolbar': !actionStore.empty,\r\n    'igo-tool-container-with-animation': animate\r\n  }\"\r\n  [@toolSlideInOut]=\"animation$ | async\"\r\n  (@toolSlideInOut.start)=\"onAnimationStart()\"\r\n  (@toolSlideInOut.done)=\"onAnimationComplete()\"\r\n>\r\n  <igo-dynamic-outlet\r\n    [component]=\"tool.component\"\r\n    [inputs]=\"getToolInputs(tool)\"\r\n  >\r\n  </igo-dynamic-outlet>\r\n</div>\r\n", styles: [":host{display:block;position:relative;overflow:hidden;width:100%;height:100%}:host ::ng-deep .mdc-list-item--with-leading-avatar .mdc-list-item__start{margin:0}:host .igo-tool-container{position:absolute;inset:0;margin-bottom:0}:host .igo-tool-container-with-animation{transform:translate3d(100%,0,0)}:host .igo-tool-container-with-toolbar{left:50px}:host igo-actionbar{height:100%}:host igo-actionbar.with-title{width:100%;overflow:auto}:host igo-actionbar:not(.with-title){width:48px;overflow:hidden;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd}@media only screen and (orientation:portrait) and (max-width: 599px),only screen and (orientation:landscape) and (max-width: 959px){:host igo-actionbar:not(.with-title){overflow:auto}}:host igo-dynamic-outlet{overflow:auto}\n"] }]
         }], propDecorators: { toolbox: [{
                 type: Input
             }], animate: [{
@@ -8235,11 +8235,11 @@ class WidgetOutletComponent {
         this.widget = undefined;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: WidgetOutletComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: WidgetOutletComponent, selector: "igo-widget-outlet", inputs: { widget: "widget", inputs: "inputs", subscribers: "subscribers" }, outputs: { complete: "complete", cancel: "cancel" }, ngImport: i0, template: "<igo-dynamic-outlet\n  *ngIf=\"widget\"\n  [component]=\"widget\"\n  [inputs]=\"inputs\"\n  [subscribers]=\"getEffectiveSubscribers()\"\n>\n</igo-dynamic-outlet>\n", styles: [":host igo-dynamic-outlet{height:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DynamicOutletComponent, selector: "igo-dynamic-outlet", inputs: ["component", "inputs", "subscribers"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: WidgetOutletComponent, selector: "igo-widget-outlet", inputs: { widget: "widget", inputs: "inputs", subscribers: "subscribers" }, outputs: { complete: "complete", cancel: "cancel" }, ngImport: i0, template: "<igo-dynamic-outlet\r\n  *ngIf=\"widget\"\r\n  [component]=\"widget\"\r\n  [inputs]=\"inputs\"\r\n  [subscribers]=\"getEffectiveSubscribers()\"\r\n>\r\n</igo-dynamic-outlet>\r\n", styles: [":host igo-dynamic-outlet{height:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DynamicOutletComponent, selector: "igo-dynamic-outlet", inputs: ["component", "inputs", "subscribers"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: WidgetOutletComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-widget-outlet', changeDetection: ChangeDetectionStrategy.OnPush, template: "<igo-dynamic-outlet\n  *ngIf=\"widget\"\n  [component]=\"widget\"\n  [inputs]=\"inputs\"\n  [subscribers]=\"getEffectiveSubscribers()\"\n>\n</igo-dynamic-outlet>\n", styles: [":host igo-dynamic-outlet{height:100%}\n"] }]
+            args: [{ selector: 'igo-widget-outlet', changeDetection: ChangeDetectionStrategy.OnPush, template: "<igo-dynamic-outlet\r\n  *ngIf=\"widget\"\r\n  [component]=\"widget\"\r\n  [inputs]=\"inputs\"\r\n  [subscribers]=\"getEffectiveSubscribers()\"\r\n>\r\n</igo-dynamic-outlet>\r\n", styles: [":host igo-dynamic-outlet{height:100%}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { widget: [{
                 type: Input
             }], inputs: [{
@@ -8353,11 +8353,11 @@ class WorkspaceSelectorComponent {
         this.selectedChange.emit({ selected: true, value: workspace });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: WorkspaceSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: WorkspaceSelectorComponent, selector: "igo-workspace-selector", inputs: { store: "store", disabled: "disabled" }, outputs: { selectedChange: "selectedChange" }, ngImport: i0, template: "<igo-entity-selector\n  [store]=\"store\"\n  [multi]=\"false\"\n  [titleAccessor]=\"getWorkspaceTitle\"\n  [disabled]=\"disabled\"\n  (selectedChange)=\"onSelectedChange($event)\"\n>\n</igo-entity-selector>\n", styles: ["igo-entity-selector ::ng-deep mat-form-field .mat-mdc-form-field-infix{padding:0}\n"], dependencies: [{ kind: "component", type: EntitySelectorComponent, selector: "igo-entity-selector", inputs: ["store", "titleAccessor", "emptyText", "multi", "multiAllText", "multiNoneText", "placeholder", "disabled"], outputs: ["selectedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: WorkspaceSelectorComponent, selector: "igo-workspace-selector", inputs: { store: "store", disabled: "disabled" }, outputs: { selectedChange: "selectedChange" }, ngImport: i0, template: "<igo-entity-selector\r\n  [store]=\"store\"\r\n  [multi]=\"false\"\r\n  [titleAccessor]=\"getWorkspaceTitle\"\r\n  [disabled]=\"disabled\"\r\n  (selectedChange)=\"onSelectedChange($event)\"\r\n>\r\n</igo-entity-selector>\r\n", styles: ["igo-entity-selector ::ng-deep mat-form-field .mat-mdc-form-field-infix{padding:0}\n"], dependencies: [{ kind: "component", type: EntitySelectorComponent, selector: "igo-entity-selector", inputs: ["store", "titleAccessor", "emptyText", "multi", "multiAllText", "multiNoneText", "placeholder", "disabled"], outputs: ["selectedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: WorkspaceSelectorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-workspace-selector', changeDetection: ChangeDetectionStrategy.OnPush, template: "<igo-entity-selector\n  [store]=\"store\"\n  [multi]=\"false\"\n  [titleAccessor]=\"getWorkspaceTitle\"\n  [disabled]=\"disabled\"\n  (selectedChange)=\"onSelectedChange($event)\"\n>\n</igo-entity-selector>\n", styles: ["igo-entity-selector ::ng-deep mat-form-field .mat-mdc-form-field-infix{padding:0}\n"] }]
+            args: [{ selector: 'igo-workspace-selector', changeDetection: ChangeDetectionStrategy.OnPush, template: "<igo-entity-selector\r\n  [store]=\"store\"\r\n  [multi]=\"false\"\r\n  [titleAccessor]=\"getWorkspaceTitle\"\r\n  [disabled]=\"disabled\"\r\n  (selectedChange)=\"onSelectedChange($event)\"\r\n>\r\n</igo-entity-selector>\r\n", styles: ["igo-entity-selector ::ng-deep mat-form-field .mat-mdc-form-field-infix{padding:0}\n"] }]
         }], propDecorators: { store: [{
                 type: Input
             }], disabled: [{
@@ -8583,11 +8583,11 @@ class WorkspaceWidgetOutletComponent {
         this.deactivateWidget.emit(widget);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: WorkspaceWidgetOutletComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: WorkspaceWidgetOutletComponent, selector: "igo-workspace-widget-outlet", inputs: { workspace: "workspace" }, outputs: { deactivateWidget: "deactivateWidget" }, ngImport: i0, template: "<ng-container *ngIf=\"widget$ | async as widget\">\n  <igo-widget-outlet\n    [widget]=\"widget\"\n    [inputs]=\"widgetInputs$ | async\"\n    [subscribers]=\"widgetSubscribers$ | async\"\n    (cancel)=\"onWidgetCancel(widget)\"\n    (complete)=\"onWidgetComplete(widget)\"\n  >\n  </igo-widget-outlet>\n</ng-container>\n", styles: ["igo-widget-outlet{height:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WidgetOutletComponent, selector: "igo-widget-outlet", inputs: ["widget", "inputs", "subscribers"], outputs: ["complete", "cancel"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: WorkspaceWidgetOutletComponent, selector: "igo-workspace-widget-outlet", inputs: { workspace: "workspace" }, outputs: { deactivateWidget: "deactivateWidget" }, ngImport: i0, template: "<ng-container *ngIf=\"widget$ | async as widget\">\r\n  <igo-widget-outlet\r\n    [widget]=\"widget\"\r\n    [inputs]=\"widgetInputs$ | async\"\r\n    [subscribers]=\"widgetSubscribers$ | async\"\r\n    (cancel)=\"onWidgetCancel(widget)\"\r\n    (complete)=\"onWidgetComplete(widget)\"\r\n  >\r\n  </igo-widget-outlet>\r\n</ng-container>\r\n", styles: ["igo-widget-outlet{height:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WidgetOutletComponent, selector: "igo-widget-outlet", inputs: ["widget", "inputs", "subscribers"], outputs: ["complete", "cancel"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: WorkspaceWidgetOutletComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-workspace-widget-outlet', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"widget$ | async as widget\">\n  <igo-widget-outlet\n    [widget]=\"widget\"\n    [inputs]=\"widgetInputs$ | async\"\n    [subscribers]=\"widgetSubscribers$ | async\"\n    (cancel)=\"onWidgetCancel(widget)\"\n    (complete)=\"onWidgetComplete(widget)\"\n  >\n  </igo-widget-outlet>\n</ng-container>\n", styles: ["igo-widget-outlet{height:100%}\n"] }]
+            args: [{ selector: 'igo-workspace-widget-outlet', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"widget$ | async as widget\">\r\n  <igo-widget-outlet\r\n    [widget]=\"widget\"\r\n    [inputs]=\"widgetInputs$ | async\"\r\n    [subscribers]=\"widgetSubscribers$ | async\"\r\n    (cancel)=\"onWidgetCancel(widget)\"\r\n    (complete)=\"onWidgetComplete(widget)\"\r\n  >\r\n  </igo-widget-outlet>\r\n</ng-container>\r\n", styles: ["igo-widget-outlet{height:100%}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { workspace: [{
                 type: Input
             }], deactivateWidget: [{
@@ -8689,7 +8689,7 @@ class ColorPickerFormFieldComponent {
                 useExisting: forwardRef(() => ColorPickerFormFieldComponent),
                 multi: true
             }
-        ], ngImport: i0, template: "<mat-form-field\n  class=\"fill-field\"\n  floatLabel=\"always\"\n  tooltip-position=\"below\"\n  matTooltipShowDelay=\"500\"\n  subscriptSizing=\"dynamic\"\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n  (click)=\"isOpen = !isOpen\"\n>\n  <mat-label>{{ colorPicker }}</mat-label>\n  <input\n    type=\"text\"\n    matInput\n    [readonly]=\"true\"\n    [style.background]=\"colorPicker\"\n  />\n</mat-form-field>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"isOpen\"\n  [cdkConnectedOverlayHasBackdrop]=\"true\"\n  (backdropClick)=\"isOpen = false\"\n  cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n>\n  <div class=\"picker\">\n    <color-chrome (onChange)=\"handleChange($event)\" [color]=\"colorPicker\">\n    </color-chrome>\n    <div class=\"buttons\">\n      <button mat-flat-button color=\"primary\" (click)=\"handleClick($event)\">\n        {{ 'igo.common.confirmDialog.applyBtn' | translate }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n", styles: [".picker{left:100%;position:absolute;top:100%;background-color:#fff;border-radius:8px;overflow:hidden;box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f}.picker ::ng-deep .chrome-picker{box-shadow:none}.picker .buttons{padding:4px 12px 8px;display:flex;justify-content:flex-end}\n"], dependencies: [{ kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i5$1.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: "directive", type: i1$5.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$5.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: i5$2.ChromeComponent, selector: "color-chrome", inputs: ["disableAlpha"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
+        ], ngImport: i0, template: "<mat-form-field\r\n  class=\"fill-field\"\r\n  floatLabel=\"always\"\r\n  tooltip-position=\"below\"\r\n  matTooltipShowDelay=\"500\"\r\n  subscriptSizing=\"dynamic\"\r\n  cdkOverlayOrigin\r\n  #trigger=\"cdkOverlayOrigin\"\r\n  (click)=\"isOpen = !isOpen\"\r\n>\r\n  <mat-label>{{ colorPicker }}</mat-label>\r\n  <input\r\n    type=\"text\"\r\n    matInput\r\n    [readonly]=\"true\"\r\n    [style.background]=\"colorPicker\"\r\n  />\r\n</mat-form-field>\r\n\r\n<ng-template\r\n  cdkConnectedOverlay\r\n  [cdkConnectedOverlayOrigin]=\"trigger\"\r\n  [cdkConnectedOverlayOpen]=\"isOpen\"\r\n  [cdkConnectedOverlayHasBackdrop]=\"true\"\r\n  (backdropClick)=\"isOpen = false\"\r\n  cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\r\n>\r\n  <div class=\"picker\">\r\n    <color-chrome (onChange)=\"handleChange($event)\" [color]=\"colorPicker\">\r\n    </color-chrome>\r\n    <div class=\"buttons\">\r\n      <button mat-flat-button color=\"primary\" (click)=\"handleClick($event)\">\r\n        {{ 'igo.common.confirmDialog.applyBtn' | translate }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n", styles: [".picker{left:100%;position:absolute;top:100%;background-color:#fff;border-radius:8px;overflow:hidden;box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f}.picker ::ng-deep .chrome-picker{box-shadow:none}.picker .buttons{padding:4px 12px 8px;display:flex;justify-content:flex-end}\n"], dependencies: [{ kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i5$1.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: "directive", type: i1$5.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$5.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: i5$2.ChromeComponent, selector: "color-chrome", inputs: ["disableAlpha"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorPickerFormFieldComponent, decorators: [{
             type: Component,
@@ -8699,7 +8699,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                             useExisting: forwardRef(() => ColorPickerFormFieldComponent),
                             multi: true
                         }
-                    ], template: "<mat-form-field\n  class=\"fill-field\"\n  floatLabel=\"always\"\n  tooltip-position=\"below\"\n  matTooltipShowDelay=\"500\"\n  subscriptSizing=\"dynamic\"\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n  (click)=\"isOpen = !isOpen\"\n>\n  <mat-label>{{ colorPicker }}</mat-label>\n  <input\n    type=\"text\"\n    matInput\n    [readonly]=\"true\"\n    [style.background]=\"colorPicker\"\n  />\n</mat-form-field>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"isOpen\"\n  [cdkConnectedOverlayHasBackdrop]=\"true\"\n  (backdropClick)=\"isOpen = false\"\n  cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n>\n  <div class=\"picker\">\n    <color-chrome (onChange)=\"handleChange($event)\" [color]=\"colorPicker\">\n    </color-chrome>\n    <div class=\"buttons\">\n      <button mat-flat-button color=\"primary\" (click)=\"handleClick($event)\">\n        {{ 'igo.common.confirmDialog.applyBtn' | translate }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n", styles: [".picker{left:100%;position:absolute;top:100%;background-color:#fff;border-radius:8px;overflow:hidden;box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f}.picker ::ng-deep .chrome-picker{box-shadow:none}.picker .buttons{padding:4px 12px 8px;display:flex;justify-content:flex-end}\n"] }]
+                    ], template: "<mat-form-field\r\n  class=\"fill-field\"\r\n  floatLabel=\"always\"\r\n  tooltip-position=\"below\"\r\n  matTooltipShowDelay=\"500\"\r\n  subscriptSizing=\"dynamic\"\r\n  cdkOverlayOrigin\r\n  #trigger=\"cdkOverlayOrigin\"\r\n  (click)=\"isOpen = !isOpen\"\r\n>\r\n  <mat-label>{{ colorPicker }}</mat-label>\r\n  <input\r\n    type=\"text\"\r\n    matInput\r\n    [readonly]=\"true\"\r\n    [style.background]=\"colorPicker\"\r\n  />\r\n</mat-form-field>\r\n\r\n<ng-template\r\n  cdkConnectedOverlay\r\n  [cdkConnectedOverlayOrigin]=\"trigger\"\r\n  [cdkConnectedOverlayOpen]=\"isOpen\"\r\n  [cdkConnectedOverlayHasBackdrop]=\"true\"\r\n  (backdropClick)=\"isOpen = false\"\r\n  cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\r\n>\r\n  <div class=\"picker\">\r\n    <color-chrome (onChange)=\"handleChange($event)\" [color]=\"colorPicker\">\r\n    </color-chrome>\r\n    <div class=\"buttons\">\r\n      <button mat-flat-button color=\"primary\" (click)=\"handleClick($event)\">\r\n        {{ 'igo.common.confirmDialog.applyBtn' | translate }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n", styles: [".picker{left:100%;position:absolute;top:100%;background-color:#fff;border-radius:8px;overflow:hidden;box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f}.picker ::ng-deep .chrome-picker{box-shadow:none}.picker .buttons{padding:4px 12px 8px;display:flex;justify-content:flex-end}\n"] }]
         }], propDecorators: { outputFormat: [{
                 type: Input
             }], colorChange: [{