@igo2/common 20.2.0 → 21.0.0-next.10

package/fesm2022/igo2-common-entity.mjs

@@ -6,7 +6,7 @@ import { ObjectUtils, uuid, StringUtils } from '@igo2/utils';
 import { map, catchError, throwError, ReplaySubject, BehaviorSubject, combineLatest, of, Observable } from 'rxjs';
 import { t } from 'typy';
 import { map as map$1, skip, debounceTime, catchError as catchError$1, tap } from 'rxjs/operators';
-import { AsyncPipe, NgClass, NgStyle } from '@angular/common';
+import { AsyncPipe, NgClass } from '@angular/common';
 import { MatOptionModule, ErrorStateMatcher, DateAdapter, MatNativeDateModule } from '@angular/material/core';
 import * as i1 from '@angular/material/form-field';
 import { MatFormFieldModule, MatFormFieldControl } from '@angular/material/form-field';
@@ -202,11 +202,11 @@ class EntityService {
     }
     buildUrl(field) {
         const relation = field.relation;
-        if (relation.url)
+        if (relation?.url)
             return relation.url;
         const baseUrl = this.configService.getConfig('edition.url');
-        if (!relation.table) {
-            return;
+        if (!relation?.table) {
+            return undefined;
         }
         return baseUrl ? baseUrl + relation.table : relation.table;
     }
@@ -216,7 +216,9 @@ class EntityService {
             ? ObjectUtils.resolve(options, path.list)
             : options;
         return items.map((item) => {
-            const id = path?.id ? ObjectUtils.resolve(item, path.id) : item.id;
+            const id = path?.id
+                ? ObjectUtils.resolve(item, path.id)
+                : item.id;
             const value = path?.value
                 ? ObjectUtils.resolve(item, path.value)
                 : item.value;
@@ -225,7 +227,7 @@ class EntityService {
     }
     getRelationFilterParamName(field, relation) {
         const param = relation.params;
-        if (param.field !== field) {
+        if (param?.field !== field) {
             return field;
         }
         return param?.name ?? field;
@@ -243,10 +245,10 @@ class EntityService {
         }
         return value?.split(',').map((v) => v.trim()) ?? [];
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EntityService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EntityService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EntityService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EntityService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EntityService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EntityService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -1161,8 +1163,8 @@ class EntityStoreWatcher {
      */
     setupObservers() {
         this.teardownObservers();
-        this.entities$$ = this.store.entities$.subscribe(() => this.onEntitiesChange());
-        this.state$$ = this.store.state.change$
+        this.entities$$ = this.store?.entities$.subscribe(() => this.onEntitiesChange());
+        this.state$$ = this.store?.state.change$
             .pipe(skip(1))
             .subscribe(() => this.onStateChange());
     }
@@ -1192,7 +1194,9 @@ class EntityStoreWatcher {
      */
     onStateChange() {
         let changesDetected = false;
-        const storeIndex = this.store.state.index;
+        const storeIndex = this.store?.state.index;
+        if (!storeIndex)
+            return;
         const innerIndex = this.innerStateIndex;
         if (storeIndex.size !== innerIndex.size) {
             changesDetected = this.detectChanges();
@@ -1209,7 +1213,7 @@ class EntityStoreWatcher {
                     changesDetected = this.detectChanges();
                 }
             }
-            this.innerStateIndex.set(key, Object.assign({}, storeValue));
+            this.innerStateIndex.set(key, Object.assign({}, storeValue || {}));
         }
     }
     /**
@@ -1298,7 +1302,9 @@ class EntityTransaction {
                 return;
             }
             else if (existingOperation.type === EntityOperationType.Update) {
-                previous = existingOperation.previous;
+                if (existingOperation.previous) {
+                    previous = existingOperation.previous;
+                }
             }
         }
         this.doUpdate(previous, current, store, meta);
@@ -1811,35 +1817,35 @@ class EntitySelectorComponent {
     /**
      * Entity store
      */
-    store = input(undefined, ...(ngDevMode ? [{ debugName: "store" }] : []));
+    store = input(...(ngDevMode ? [undefined, { debugName: "store" }] : /* istanbul ignore next */ []));
     /**
      * Title accessor
      */
-    titleAccessor = input(getEntityTitle, ...(ngDevMode ? [{ debugName: "titleAccessor" }] : []));
+    titleAccessor = input(getEntityTitle, ...(ngDevMode ? [{ debugName: "titleAccessor" }] : /* istanbul ignore next */ []));
     /**
      * Text to display when nothing is selected
      */
-    emptyText = input(undefined, ...(ngDevMode ? [{ debugName: "emptyText" }] : []));
+    emptyText = input(...(ngDevMode ? [undefined, { debugName: "emptyText" }] : /* istanbul ignore next */ []));
     /**
      * Wheter selecting many entities is allowed
      */
-    multi = input(false, ...(ngDevMode ? [{ debugName: "multi" }] : []));
+    multi = input(false, ...(ngDevMode ? [{ debugName: "multi" }] : /* istanbul ignore next */ []));
     /**
      * Text to display for the select all option
      */
-    multiAllText = input('All', ...(ngDevMode ? [{ debugName: "multiAllText" }] : []));
+    multiAllText = input('All', ...(ngDevMode ? [{ debugName: "multiAllText" }] : /* istanbul ignore next */ []));
     /**
      * Text to display for the select none option
      */
-    multiNoneText = input('None', ...(ngDevMode ? [{ debugName: "multiNoneText" }] : []));
+    multiNoneText = input('None', ...(ngDevMode ? [{ debugName: "multiNoneText" }] : /* istanbul ignore next */ []));
     /**
      * Field placeholder
      */
-    placeholder = input(undefined, ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+    placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
     /**
      * Wheter the selector is disabled or not
      */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     /**
      * Event emitted when the selection changes
      */
@@ -1849,13 +1855,16 @@ class EntitySelectorComponent {
      * @internal
      */
     ngOnInit() {
-        this.watcher = new EntityStoreWatcher(this.store(), this.cdRef);
-        this.selected$$ = this.store()
-            .stateView.manyBy$((record) => record.state.selected === true)
-            .subscribe((records) => {
-            const entities = records.map((record) => record.entity);
-            this.onSelectFromStore(entities);
-        });
+        const store = this.store();
+        if (store) {
+            this.watcher = new EntityStoreWatcher(store, this.cdRef);
+            this.selected$$ = store.stateView
+                .manyBy$((record) => record.state.selected === true)
+                .subscribe((records) => {
+                const entities = records.map((record) => record.entity);
+                this.onSelectFromStore(entities);
+            });
+        }
     }
     /**
      * Unsubscribe to the selected entity and destroy the store watcher
@@ -1874,7 +1883,7 @@ class EntitySelectorComponent {
         const multiSelect = values.find((_value) => _value === this.multiSelectValue);
         let entities = values.filter((_value) => _value !== this.multiSelectValue);
         const store = this.store();
-        if (multiSelect !== undefined) {
+        if (store && multiSelect !== undefined) {
             if (entities.length === store.count) {
                 entities = [];
             }
@@ -1883,11 +1892,13 @@ class EntitySelectorComponent {
             }
         }
         entities = entities.filter((entity) => entity !== this.emptyValue);
-        if (entities.length === 0) {
-            store.state.updateAll({ selected: false });
-        }
-        else {
-            store.state.updateMany(entities, { selected: true }, true);
+        if (store) {
+            if (entities.length === 0) {
+                store.state.updateAll({ selected: false });
+            }
+            else {
+                store.state.updateMany(entities, { selected: true }, true);
+            }
         }
         const value = this.multi() ? entities : event.value;
         this.selectedChange.emit({ selected: true, value });
@@ -1904,6 +1915,9 @@ class EntitySelectorComponent {
     }
     updateMultiToggleWithEntities(entities) {
         const store = this.store();
+        if (!store) {
+            return;
+        }
         const multiNoneText = this.multiNoneText();
         const multiAllText = this.multiAllText();
         if (entities.length === store.count &&
@@ -1915,23 +1929,23 @@ class EntitySelectorComponent {
             this.multiText$.next(multiAllText);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EntitySelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: EntitySelectorComponent, isStandalone: true, selector: "igo-entity-selector", inputs: { store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, titleAccessor: { classPropertyName: "titleAccessor", publicName: "titleAccessor", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, multi: { classPropertyName: "multi", publicName: "multi", isSignal: true, isRequired: false, transformFunction: null }, multiAllText: { classPropertyName: "multiAllText", publicName: "multiAllText", isSignal: true, isRequired: false, transformFunction: null }, multiNoneText: { classPropertyName: "multiNoneText", publicName: "multiNoneText", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, 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    @if (emptyText() !== undefined && multi() === false) {\n      <mat-option [value]=\"emptyValue\">{{ emptyText() }}</mat-option>\n    }\n    @if (multi() === true) {\n      <mat-option [value]=\"multiSelectValue\">{{\n        multiText$ | async\n      }}</mat-option>\n    }\n    @for (record of store().stateView.all$() | async; track record) {\n      <mat-option [value]=\"record.entity\">\n        {{ titleAccessor()(record.entity) }}\n      </mat-option>\n    }\n  </mat-select>\n</mat-form-field>\n", styles: [":host{--mat-form-field-container-height: 48px;--mat-form-field-container-vertical-padding: 12px}mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EntitySelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: EntitySelectorComponent, isStandalone: true, selector: "igo-entity-selector", inputs: { store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, titleAccessor: { classPropertyName: "titleAccessor", publicName: "titleAccessor", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, multi: { classPropertyName: "multi", publicName: "multi", isSignal: true, isRequired: false, transformFunction: null }, multiAllText: { classPropertyName: "multiAllText", publicName: "multiAllText", isSignal: true, isRequired: false, transformFunction: null }, multiNoneText: { classPropertyName: "multiNoneText", publicName: "multiNoneText", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, 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    @if (emptyText() !== undefined && multi() === false) {\n      <mat-option [value]=\"emptyValue\">{{ emptyText() }}</mat-option>\n    }\n    @if (multi() === true) {\n      <mat-option [value]=\"multiSelectValue\">{{\n        multiText$ | async\n      }}</mat-option>\n    }\n    @for (record of store()?.stateView?.all$() | async; track record) {\n      <mat-option [value]=\"record.entity\">\n        {{ titleAccessor()(record.entity) }}\n      </mat-option>\n    }\n  </mat-select>\n</mat-form-field>\n", styles: [":host{--mat-form-field-container-height: 48px;--mat-form-field-container-vertical-padding: 12px}mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EntitySelectorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EntitySelectorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-entity-selector', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatFormFieldModule, MatSelectModule, MatOptionModule, AsyncPipe], 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    @if (emptyText() !== undefined && multi() === false) {\n      <mat-option [value]=\"emptyValue\">{{ emptyText() }}</mat-option>\n    }\n    @if (multi() === true) {\n      <mat-option [value]=\"multiSelectValue\">{{\n        multiText$ | async\n      }}</mat-option>\n    }\n    @for (record of store().stateView.all$() | async; track record) {\n      <mat-option [value]=\"record.entity\">\n        {{ titleAccessor()(record.entity) }}\n      </mat-option>\n    }\n  </mat-select>\n</mat-form-field>\n", styles: [":host{--mat-form-field-container-height: 48px;--mat-form-field-container-vertical-padding: 12px}mat-form-field{width:100%}\n"] }]
+            args: [{ selector: 'igo-entity-selector', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatFormFieldModule, MatSelectModule, MatOptionModule, AsyncPipe], 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    @if (emptyText() !== undefined && multi() === false) {\n      <mat-option [value]=\"emptyValue\">{{ emptyText() }}</mat-option>\n    }\n    @if (multi() === true) {\n      <mat-option [value]=\"multiSelectValue\">{{\n        multiText$ | async\n      }}</mat-option>\n    }\n    @for (record of store()?.stateView?.all$() | async; track record) {\n      <mat-option [value]=\"record.entity\">\n        {{ titleAccessor()(record.entity) }}\n      </mat-option>\n    }\n  </mat-select>\n</mat-form-field>\n", styles: [":host{--mat-form-field-container-height: 48px;--mat-form-field-container-vertical-padding: 12px}mat-form-field{width:100%}\n"] }]
         }], propDecorators: { store: [{ type: i0.Input, args: [{ isSignal: true, alias: "store", required: false }] }], titleAccessor: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleAccessor", required: false }] }], emptyText: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyText", required: false }] }], multi: [{ type: i0.Input, args: [{ isSignal: true, alias: "multi", required: false }] }], multiAllText: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiAllText", required: false }] }], multiNoneText: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiNoneText", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], selectedChange: [{ type: i0.Output, args: ["selectedChange"] }] } });
 
 /**
  * @deprecated import the EntitySelectorComponent directly
  */
 class IgoEntitySelectorModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoEntitySelectorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: IgoEntitySelectorModule, imports: [EntitySelectorComponent], exports: [EntitySelectorComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoEntitySelectorModule, imports: [EntitySelectorComponent] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoEntitySelectorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.14", ngImport: i0, type: IgoEntitySelectorModule, imports: [EntitySelectorComponent], exports: [EntitySelectorComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoEntitySelectorModule, imports: [EntitySelectorComponent] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoEntitySelectorModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoEntitySelectorModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [EntitySelectorComponent],
@@ -1951,27 +1965,30 @@ class EntityTablePaginatorComponent {
     count$$;
     entitySortChange$$;
     paginationLabelTranslation$$ = [];
-    entitySortChange$ = input(new BehaviorSubject(false), ...(ngDevMode ? [{ debugName: "entitySortChange$" }] : []));
+    entitySortChange$ = input(new BehaviorSubject(false), ...(ngDevMode ? [{ debugName: "entitySortChange$" }] : /* istanbul ignore next */ []));
     /**
      * Entity store
      */
-    store = input(undefined, ...(ngDevMode ? [{ debugName: "store" }] : []));
+    store = input(...(ngDevMode ? [undefined, { debugName: "store" }] : /* istanbul ignore next */ []));
     /**
      * Paginator options
      */
-    paginatorOptions = input(undefined, ...(ngDevMode ? [{ debugName: "paginatorOptions" }] : []));
+    paginatorOptions = input(...(ngDevMode ? [undefined, { debugName: "paginatorOptions" }] : /* istanbul ignore next */ []));
     length = 0;
     /**
      * Paginator emitted.
      */
     paginatorChange = output();
-    paginator = viewChild(MatPaginator, ...(ngDevMode ? [{ debugName: "paginator" }] : []));
+    paginator = viewChild(MatPaginator, ...(ngDevMode ? [{ debugName: "paginator" }] : /* istanbul ignore next */ []));
     ngOnChanges() {
         this.unsubscribeAll();
-        this.count$$ = this.store().stateView.count$.subscribe((count) => {
-            this.length = count;
-            this.emitPaginator();
-        });
+        const store = this.store();
+        if (store) {
+            this.count$$ = store.stateView.count$.subscribe((count) => {
+                this.length = count;
+                this.emitPaginator();
+            });
+        }
         this.entitySortChange$$ = this.entitySortChange$().subscribe(() => {
             const paginator = this.paginator();
             if (paginator) {
@@ -2003,28 +2020,40 @@ class EntityTablePaginatorComponent {
         this.paginationLabelTranslation$$.push(this.languageService.translate
             .get('igo.common.paginator.firstPageLabel')
             .subscribe((label) => {
-            this.paginator()._intl.firstPageLabel = label;
+            const p = this.paginator();
+            if (p)
+                p._intl.firstPageLabel = label;
         }));
-        this.paginator()._intl.getRangeLabel = this.rangeLabel;
+        const p = this.paginator();
+        if (p)
+            p._intl.getRangeLabel = this.rangeLabel;
         this.paginationLabelTranslation$$.push(this.languageService.translate
             .get('igo.common.paginator.itemsPerPageLabel')
             .subscribe((label) => {
-            this.paginator()._intl.itemsPerPageLabel = label;
+            const p = this.paginator();
+            if (p)
+                p._intl.itemsPerPageLabel = label;
         }));
         this.paginationLabelTranslation$$.push(this.languageService.translate
             .get('igo.common.paginator.lastPageLabel')
             .subscribe((label) => {
-            this.paginator()._intl.lastPageLabel = label;
+            const p = this.paginator();
+            if (p)
+                p._intl.lastPageLabel = label;
         }));
         this.paginationLabelTranslation$$.push(this.languageService.translate
             .get('igo.common.paginator.nextPageLabel')
             .subscribe((label) => {
-            this.paginator()._intl.nextPageLabel = label;
+            const p = this.paginator();
+            if (p)
+                p._intl.nextPageLabel = label;
         }));
         this.paginationLabelTranslation$$.push(this.languageService.translate
             .get('igo.common.paginator.previousPageLabel')
             .subscribe((label) => {
-            this.paginator()._intl.previousPageLabel = label;
+            const p = this.paginator();
+            if (p)
+                p._intl.previousPageLabel = label;
         }));
     }
     rangeLabel = (page, pageSize, length) => {
@@ -2057,12 +2086,14 @@ class EntityTablePaginatorComponent {
         this.unsubscribeAll();
     }
     emitPaginator() {
-        this.paginatorChange.emit(this.paginator());
+        const p = this.paginator();
+        if (p)
+            this.paginatorChange.emit(p);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EntityTablePaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.19", type: EntityTablePaginatorComponent, isStandalone: true, selector: "igo-entity-table-paginator", inputs: { entitySortChange$: { classPropertyName: "entitySortChange$", publicName: "entitySortChange$", isSignal: true, isRequired: false, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, paginatorOptions: { classPropertyName: "paginatorOptions", publicName: "paginatorOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { paginatorChange: "paginatorChange" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: 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", styles: [":host ::ng-deep .mat-mdc-paginator-container{min-height:unset}\n"], dependencies: [{ kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i1$1.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EntityTablePaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.14", type: EntityTablePaginatorComponent, isStandalone: true, selector: "igo-entity-table-paginator", inputs: { entitySortChange$: { classPropertyName: "entitySortChange$", publicName: "entitySortChange$", isSignal: true, isRequired: false, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, paginatorOptions: { classPropertyName: "paginatorOptions", publicName: "paginatorOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { paginatorChange: "paginatorChange" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: 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", styles: [":host ::ng-deep .mat-mdc-paginator-container{min-height:unset}\n"], dependencies: [{ kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i1$1.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EntityTablePaginatorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EntityTablePaginatorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igo-entity-table-paginator', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatPaginatorModule], 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", styles: [":host ::ng-deep .mat-mdc-paginator-container{min-height:unset}\n"] }]
         }], propDecorators: { entitySortChange$: [{ type: i0.Input, args: [{ isSignal: true, alias: "entitySortChange$", required: false }] }], store: [{ type: i0.Input, args: [{ isSignal: true, alias: "store", required: false }] }], paginatorOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginatorOptions", required: false }] }], paginatorChange: [{ type: i0.Output, args: ["paginatorChange"] }], paginator: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatPaginator), { isSignal: true }] }] } });
@@ -2084,15 +2115,15 @@ class EntityTableRowDirective {
     /**
      * Whether a row supports selection
      */
-    selection = input(false, ...(ngDevMode ? [{ debugName: "selection" }] : []));
+    selection = input(false, ...(ngDevMode ? [{ debugName: "selection" }] : /* istanbul ignore next */ []));
     /**
      * Whether clicking a row should select it (if selection is true)
      */
-    selectOnClick = input(true, ...(ngDevMode ? [{ debugName: "selectOnClick" }] : []));
+    selectOnClick = input(true, ...(ngDevMode ? [{ debugName: "selectOnClick" }] : /* istanbul ignore next */ []));
     /**
      * Whether the selected row should be highlighted
      */
-    highlightSelection = input(true, ...(ngDevMode ? [{ debugName: "highlightSelection" }] : []));
+    highlightSelection = input(true, ...(ngDevMode ? [{ debugName: "highlightSelection" }] : /* istanbul ignore next */ []));
     /**
      * Whether a row is selected
      */
@@ -2113,7 +2144,7 @@ class EntityTableRowDirective {
     /**
      * Scroll behavior on selection
      */
-    scrollBehavior = input(EntityTableScrollBehavior.Auto, ...(ngDevMode ? [{ debugName: "scrollBehavior" }] : []));
+    scrollBehavior = input(EntityTableScrollBehavior.Auto, ...(ngDevMode ? [{ debugName: "scrollBehavior" }] : /* istanbul ignore next */ []));
     /**
      * Event emitted when a row is selected
      */
@@ -2171,14 +2202,13 @@ class EntityTableRowDirective {
     removeCls(cls) {
         this.renderer.removeClass(this.el.nativeElement, cls);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EntityTableRowDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.19", type: EntityTableRowDirective, isStandalone: true, selector: "[igoEntityTableRow]", inputs: { selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, selectOnClick: { classPropertyName: "selectOnClick", publicName: "selectOnClick", isSignal: true, isRequired: false, transformFunction: null }, highlightSelection: { classPropertyName: "highlightSelection", publicName: "highlightSelection", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: false, isRequired: false, transformFunction: null }, scrollBehavior: { classPropertyName: "scrollBehavior", publicName: "scrollBehavior", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { select: "select" }, host: { listeners: { "click": "onClick()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EntityTableRowDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.14", type: EntityTableRowDirective, isStandalone: true, selector: "[igoEntityTableRow]", inputs: { selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, selectOnClick: { classPropertyName: "selectOnClick", publicName: "selectOnClick", isSignal: true, isRequired: false, transformFunction: null }, highlightSelection: { classPropertyName: "highlightSelection", publicName: "highlightSelection", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: false, isRequired: false, transformFunction: null }, scrollBehavior: { classPropertyName: "scrollBehavior", publicName: "scrollBehavior", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { select: "select" }, host: { listeners: { "click": "onClick()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EntityTableRowDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EntityTableRowDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[igoEntityTableRow]',
-                    standalone: true
+                    selector: '[igoEntityTableRow]'
                 }]
         }], propDecorators: { selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }], selectOnClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectOnClick", required: false }] }], highlightSelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "highlightSelection", required: false }] }], selected: [{
                 type: Input
@@ -2232,7 +2262,7 @@ class EntityTableComponent {
     /**
      * Entity store
      */
-    store = input(undefined, ...(ngDevMode ? [{ debugName: "store" }] : []));
+    store = input(...(ngDevMode ? [undefined, { debugName: "store" }] : /* istanbul ignore next */ []));
     /**
      * Table paginator
      */
@@ -2247,23 +2277,23 @@ class EntityTableComponent {
     /**
      * Table template
      */
-    template = input(undefined, ...(ngDevMode ? [{ debugName: "template" }] : []));
+    template = input(...(ngDevMode ? [undefined, { debugName: "template" }] : /* istanbul ignore next */ []));
     /**
      * Scroll behavior on selection
      */
-    scrollBehavior = input(EntityTableScrollBehavior.Auto, ...(ngDevMode ? [{ debugName: "scrollBehavior" }] : []));
+    scrollBehavior = input(EntityTableScrollBehavior.Auto, ...(ngDevMode ? [{ debugName: "scrollBehavior" }] : /* istanbul ignore next */ []));
     /**
      * Whether nulls should be first when sorting
      */
-    sortNullsFirst = input(false, ...(ngDevMode ? [{ debugName: "sortNullsFirst" }] : []));
+    sortNullsFirst = input(false, ...(ngDevMode ? [{ debugName: "sortNullsFirst" }] : /* istanbul ignore next */ []));
     /**
      * Show the table paginator or not. False by default.
      */
-    withPaginator = input(false, ...(ngDevMode ? [{ debugName: "withPaginator" }] : []));
+    withPaginator = input(false, ...(ngDevMode ? [{ debugName: "withPaginator" }] : /* istanbul ignore next */ []));
     /**
      * Paginator options
      */
-    paginatorOptions = input(undefined, ...(ngDevMode ? [{ debugName: "paginatorOptions" }] : []));
+    paginatorOptions = input(...(ngDevMode ? [undefined, { debugName: "paginatorOptions" }] : /* istanbul ignore next */ []));
     /**
      * Event emitted when an entity (row) is clicked
      */
@@ -2282,8 +2312,8 @@ class EntityTableComponent {
      */
     get headers() {
         let columns = this.template()
-            .columns.filter((column) => column.visible !== false)
-            .map((column) => column.name);
+            ?.columns.filter((column) => column.visible !== false)
+            .map((column) => column.name) ?? [];
         if (this.selectionCheckbox === true) {
             columns = ['selectionCheckbox'].concat(columns);
         }
@@ -2299,21 +2329,21 @@ class EntityTableComponent {
      * @internal
      */
     get selection() {
-        return this.template().selection || false;
+        return this.template()?.selection || false;
     }
     /**
      * Whether a selection checkbox should be displayed
      * @internal
      */
     get selectionCheckbox() {
-        return this.template().selectionCheckbox || false;
+        return this.template()?.selectionCheckbox || false;
     }
     /**
      * Whether selection many entities should eb supported
      * @internal
      */
     get selectMany() {
-        return this.template().selectMany || false;
+        return this.template()?.selectMany || false;
     }
     /**
      * Whether selection many entities should eb supported
@@ -2321,11 +2351,11 @@ class EntityTableComponent {
      */
     get fixedHeader() {
         const template = this.template();
-        return template.fixedHeader === undefined ? true : template.fixedHeader;
+        return template?.fixedHeader === undefined ? true : template.fixedHeader;
     }
     get tableHeight() {
         const template = this.template();
-        return template.tableHeight ? template.tableHeight : 'auto';
+        return template?.tableHeight ? template.tableHeight : 'auto';
     }
     constructor() {
         this.dateAdapter.setLocale('fr-CA');
@@ -2338,7 +2368,7 @@ class EntityTableComponent {
         this.handleDatasource();
         this.dataSource.paginator = this.paginator;
         this.store()
-            .state.change$.pipe(debounceTime(100))
+            ?.state.change$.pipe(debounceTime(100))
             .subscribe(() => {
             this.handleDatasource();
             this.refresh();
@@ -2358,7 +2388,7 @@ class EntityTableComponent {
      */
     onValueChange(column, record, event) {
         const key = this.getColumnKeyWithoutPropertiesTag(column);
-        record.entity.properties[key] = event.target.value;
+        record.entity.properties[key] = event.target?.value;
     }
     /**
      * Process boolean value change (edition)
@@ -2397,7 +2427,7 @@ class EntityTableComponent {
      */
     enableEdit(record) {
         const item = record.entity.properties || record.entity;
-        this.template().columns.forEach((column) => {
+        this.template()?.columns.forEach((column) => {
             column.title =
                 column.validation?.mandatory && !column.title.includes('*')
                     ? column.title + ' *'
@@ -2428,7 +2458,7 @@ class EntityTableComponent {
                 this.filteredOptions[column.name] = new Observable();
                 this.filteredOptions[column.name] = this.formGroup.controls[column.name].valueChanges.pipe(map$1((value) => {
                     if (value?.length) {
-                        return column.domainValues?.filter((option) => {
+                        return (column.domainValues?.filter((option) => {
                             const filterNormalized = value
                                 ? value
                                     .toLowerCase()
@@ -2440,11 +2470,12 @@ class EntityTableComponent {
                                 .normalize('NFD')
                                 .replace(/[\u0300-\u036f]/g, '');
                             return featureNameNormalized.includes(filterNormalized);
-                        });
+                        }) ?? []);
                     }
+                    return [];
                 }));
                 let formControlValue = item[key];
-                column.domainValues.forEach((option) => {
+                column.domainValues?.forEach((option) => {
                     if (typeof formControlValue === 'string' &&
                         StringUtils.isValidNumber(formControlValue) &&
                         !StringUtils.isOctalNumber(formControlValue)) {
@@ -2487,17 +2518,18 @@ class EntityTableComponent {
     handleDatasource() {
         this.unsubscribeStore();
         this.selection$$ = this.store()
-            .stateView.manyBy$((record) => record.state.selected === true)
+            ?.stateView.manyBy$((record) => record.state.selected === true)
             .subscribe((records) => {
             const firstSelected = records[0];
             const firstSelectedStateviewPosition = this.store()
-                .stateView.all()
+                ?.stateView.all()
                 .indexOf(firstSelected);
             const pageMax = this.paginator
                 ? this.paginator.pageSize * (this.paginator.pageIndex + 1)
                 : 0;
             const pageMin = this.paginator ? pageMax - this.paginator.pageSize : 0;
             if (this.paginator &&
+                firstSelectedStateviewPosition !== undefined &&
                 (firstSelectedStateviewPosition < pageMin ||
                     firstSelectedStateviewPosition >= pageMax)) {
                 const pageToReach = Math.floor(firstSelectedStateviewPosition / this.paginator.pageSize);
@@ -2506,7 +2538,7 @@ class EntityTableComponent {
             this.selectionState$.next(this.computeSelectionState(records));
         });
         this.dataSource$$ = this.store()
-            .stateView.all$()
+            ?.stateView.all$()
             .subscribe((all) => {
             if (all[0]) {
                 this.enableEdit(all[0]);
@@ -2514,7 +2546,7 @@ class EntityTableComponent {
             this.dataSource.data = all.map((record) => {
                 return {
                     record,
-                    cellData: this.template().columns.reduce((cellData, column) => {
+                    cellData: (this.template()?.columns.reduce((cellData, column) => {
                         const value = this.getValue(record, column);
                         cellData[column.name] = {
                             class: this.getCellClass(record, column),
@@ -2523,7 +2555,7 @@ class EntityTableComponent {
                             isImg: this.isImg(value)
                         };
                         return cellData;
-                    }, {})
+                    }, {}) ?? {})
                 };
             });
         });
@@ -2571,9 +2603,9 @@ class EntityTableComponent {
      */
     onSort(event) {
         const direction = event.direction;
-        const column = this.template().columns.find((c) => c.name === event.active);
-        if (direction === 'asc' || direction === 'desc') {
-            this.store().stateView.sort({
+        const column = this.template()?.columns.find((c) => c.name === event.active);
+        if (column && (direction === 'asc' || direction === 'desc')) {
+            this.store()?.stateView.sort({
                 valueAccessor: (record) => this.getValue(record, column),
                 direction,
                 nullsFirst: this.sortNullsFirst()
@@ -2582,7 +2614,7 @@ class EntityTableComponent {
             this.entitySortChange$.next(true);
         }
         else {
-            this.store().stateView.sort(undefined);
+            this.store()?.stateView.sort(undefined);
         }
     }
     /**
@@ -2591,7 +2623,7 @@ class EntityTableComponent {
      * @internal
      */
     onRowClick(record) {
-        this.lastRecordCheckedKey = this.store().stateView.getKey(record);
+        this.lastRecordCheckedKey = this.store()?.stateView.getKey(record);
         this.entityClick.emit(record.entity);
     }
     /**
@@ -2606,7 +2638,7 @@ class EntityTableComponent {
             return;
         }
         const entity = record.entity;
-        this.store().state.update(entity, { selected: true }, true);
+        this.store()?.state.update(entity, { selected: true }, true);
         this.entitySelectChange.emit({ added: [entity] });
     }
     /**
@@ -2618,9 +2650,11 @@ class EntityTableComponent {
         if (this.selection === false) {
             return;
         }
-        const entities = this.store().view.all();
+        const entities = this.store()?.view.all();
+        if (entities === undefined)
+            return;
         this.entitySelectChange.emit({ added: [entities] });
-        this.store().state.updateMany(entities, { selected: toggle });
+        this.store()?.state.updateMany(entities, { selected: toggle });
     }
     /**
      * When an entity is toggled, select or unselect it in the store. On select,
@@ -2635,11 +2669,11 @@ class EntityTableComponent {
         }
         const entity = record.entity;
         const exclusive = toggle === true && !this.selectMany;
-        this.store().state.update(entity, { selected: toggle }, exclusive);
+        this.store()?.state.update(entity, { selected: toggle }, exclusive);
         if (toggle === true) {
             this.entitySelectChange.emit({ added: [entity] });
         }
-        this.lastRecordCheckedKey = this.store().stateView.getKey(record);
+        this.lastRecordCheckedKey = this.store()?.stateView.getKey(record);
     }
     /**
      * When an entity is toggled, select or unselect it in the store. On select,
@@ -2661,21 +2695,25 @@ class EntityTableComponent {
         // See https://github.com/angular/components/issues/6232
         const range = window.document.createRange();
         range.selectNode(event.target);
-        window.getSelection().removeAllRanges();
-        window.getSelection().addRange(range);
+        window.getSelection()?.removeAllRanges();
+        window.getSelection()?.addRange(range);
         event.stopImmediatePropagation();
-        const records = this.store().stateView.all();
+        const records = this.store()?.stateView.all();
+        if (!records)
+            return;
         const recordIndex = records.indexOf(record);
-        const lastRecordChecked = this.store().stateView.get(this.lastRecordCheckedKey);
-        const lastRecordIndex = records.indexOf(lastRecordChecked);
+        const lastRecordChecked = this.store()?.stateView.get(this.lastRecordCheckedKey);
+        const lastRecordIndex = lastRecordChecked
+            ? records.indexOf(lastRecordChecked)
+            : -1;
         const indexes = [recordIndex, lastRecordIndex];
         const selectRecords = records.slice(Math.min(...indexes), Math.max(...indexes) + 1);
         const entities = selectRecords.map((_record) => _record.entity);
-        this.store().state.updateMany(entities, { selected: toggle });
+        this.store()?.state.updateMany(entities, { selected: toggle });
         if (toggle === true) {
             this.entitySelectChange.emit({ added: entities });
         }
-        this.lastRecordCheckedKey = this.store().stateView.getKey(record);
+        this.lastRecordCheckedKey = this.store()?.stateView.getKey(record);
     }
     /**
      * Compute the selection state
@@ -2687,7 +2725,7 @@ class EntityTableComponent {
         const selectionCount = selectedRecords.length;
         return selectionCount === 0
             ? states.None
-            : selectionCount === this.store().stateView.count
+            : selectionCount === this.store()?.stateView.count
                 ? states.All
                 : states.Some;
     }
@@ -2701,7 +2739,7 @@ class EntityTableComponent {
         let sortable = column.sort;
         if (sortable === undefined) {
             const template = this.template();
-            sortable = template.sort === undefined ? false : template.sort;
+            sortable = template?.sort === undefined ? false : template.sort;
         }
         return sortable;
     }
@@ -2717,20 +2755,15 @@ class EntityTableComponent {
     }
     isImg(value) {
         if (this.isUrl(value)) {
-            return (['jpg', 'png', 'gif'].indexOf(value.split('.').pop().toLowerCase()) !==
-                -1);
-        }
-        else {
-            return false;
+            return (['jpg', 'png', 'gif'].indexOf(value.split('.').pop()?.toLowerCase() ?? '') !== -1);
         }
+        return false;
     }
     isUrl(value) {
         if (typeof value === 'string') {
             return (value.slice(0, 8) === 'https://' || value.slice(0, 7) === 'http://');
         }
-        else {
-            return false;
-        }
+        return false;
     }
     /**
      * Method to access an entity's values
@@ -2746,10 +2779,10 @@ class EntityTableComponent {
             return column.valueAccessor(entity, record);
         }
         const template = this.template();
-        if (template.valueAccessor !== undefined) {
+        if (template?.valueAccessor !== undefined) {
             return template.valueAccessor(entity, column.name, record);
         }
-        value = this.store().getProperty(entity, column.name);
+        value = this.store()?.getProperty(entity, column.name);
         if (column.type === 'boolean') {
             if (value === undefined || value === null || value === '') {
                 value = false;
@@ -2774,7 +2807,7 @@ class EntityTableComponent {
             if (column.multiple) {
                 let list_id;
                 typeof value === 'string'
-                    ? (list_id = value.match(/[\w.-]+/g).map(Number))
+                    ? (list_id = (value.match(/[\w.-]+/g) ?? []).map(Number))
                     : (list_id = value);
                 const list_option = [];
                 column.domainValues.forEach((option) => {
@@ -2857,9 +2890,10 @@ class EntityTableComponent {
      * @internal
      */
     getValidationAttributeValue(column, validationType) {
+        const validation = column.validation;
         if (column.validation !== undefined &&
-            column.validation[validationType] !== undefined) {
-            return column.validation[validationType];
+            validation[validationType] !== undefined) {
+            return validation[validationType];
         }
         else {
             return false;
@@ -2896,7 +2930,7 @@ class EntityTableComponent {
      * @internal
      */
     getHeaderClass() {
-        const func = this.template().headerClassFunc;
+        const func = this.template()?.headerClassFunc;
         if (func instanceof Function) {
             return func();
         }
@@ -2910,7 +2944,7 @@ class EntityTableComponent {
      */
     getRowClass(record) {
         const entity = record.entity;
-        const func = this.template().rowClassFunc;
+        const func = this.template()?.rowClassFunc;
         if (func instanceof Function) {
             return func(entity, record);
         }
@@ -2926,7 +2960,7 @@ class EntityTableComponent {
     getCellClass(record, column) {
         const entity = record.entity;
         const cls = {};
-        const tableFunc = this.template().cellClassFunc;
+        const tableFunc = this.template()?.cellClassFunc;
         if (tableFunc instanceof Function) {
             Object.assign(cls, tableFunc(entity, column, record));
         }
@@ -2957,14 +2991,14 @@ class EntityTableComponent {
         }
         return column;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EntityTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: EntityTableComponent, isStandalone: true, selector: "igo-entity-table", inputs: { store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, paginator: { classPropertyName: "paginator", publicName: "paginator", isSignal: false, isRequired: false, transformFunction: null }, template: { classPropertyName: "template", publicName: "template", isSignal: true, isRequired: false, transformFunction: null }, scrollBehavior: { classPropertyName: "scrollBehavior", publicName: "scrollBehavior", isSignal: true, isRequired: false, transformFunction: null }, sortNullsFirst: { classPropertyName: "sortNullsFirst", publicName: "sortNullsFirst", isSignal: true, isRequired: false, transformFunction: null }, withPaginator: { classPropertyName: "withPaginator", publicName: "withPaginator", isSignal: true, isRequired: false, transformFunction: null }, paginatorOptions: { classPropertyName: "paginatorOptions", publicName: "paginatorOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { entityClick: "entityClick", entitySelectChange: "entitySelectChange", entitySortChange: "entitySortChange" }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EntityTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: EntityTableComponent, isStandalone: true, selector: "igo-entity-table", inputs: { store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, paginator: { classPropertyName: "paginator", publicName: "paginator", isSignal: false, isRequired: false, transformFunction: null }, template: { classPropertyName: "template", publicName: "template", isSignal: true, isRequired: false, transformFunction: null }, scrollBehavior: { classPropertyName: "scrollBehavior", publicName: "scrollBehavior", isSignal: true, isRequired: false, transformFunction: null }, sortNullsFirst: { classPropertyName: "sortNullsFirst", publicName: "sortNullsFirst", isSignal: true, isRequired: false, transformFunction: null }, withPaginator: { classPropertyName: "withPaginator", publicName: "withPaginator", isSignal: true, isRequired: false, transformFunction: null }, paginatorOptions: { classPropertyName: "paginatorOptions", publicName: "paginatorOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { entityClick: "entityClick", entitySelectChange: "entitySelectChange", entitySortChange: "entitySortChange" }, providers: [
             { provide: MatFormFieldControl, useExisting: EntityTableComponent },
             provideMomentDateAdapter()
-        ], 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        @if (selectMany) {\n          @let selectionState = selectionState$ | async;\n          @if (selectionState) {\n            <mat-checkbox\n              (change)=\"onToggleRows($event.checked)\"\n              [checked]=\"selectionState === entityTableSelectionState.All\"\n              [indeterminate]=\"\n                selectionState === entityTableSelectionState.Some\n              \"\n            />\n          }\n        }\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      </td>\n    </ng-container>\n\n    @for (column of template().columns; track column) {\n      <ng-container [matColumnDef]=\"column.name\">\n        @if (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        } @else {\n          <th\n            mat-header-cell\n            *matHeaderCellDef\n            [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n          >\n            {{ column.title }}\n          </th>\n        }\n\n        @let columnRenderer = getColumnRenderer(column);\n        @if (columnRenderer) {\n          @switch (columnRenderer) {\n            @case (entityTableColumnRenderer.HTML) {\n              <ng-container *matCellDef=\"let row\">\n                @if (!row.cellData[column.name].isUrl) {\n                  <td\n                    mat-cell\n                    class=\"mat-cell-text\"\n                    [ngClass]=\"row.cellData[column.name].class\"\n                    [innerHTML]=\"row.cellData[column.name].value\"\n                  ></td>\n                } @else {\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                      @if (row.cellData[column.name].isImg) {\n                        <img\n                          igoImageError\n                          src=\"{{\n                            row.cellData[column.name].value\n                              | secureImage\n                              | async\n                          }}\"\n                          width=\"50\"\n                          heigth=\"auto\"\n                        />\n                      } @else {\n                        <span>{{ 'igo.geo.targetHtmlUrl' | translate }} </span>\n                      }\n                      >\n                    </a>\n                  </td>\n                }\n              </ng-container>\n            }\n            @case (entityTableColumnRenderer.UnsanitizedHTML) {\n              <ng-container *matCellDef=\"let row\">\n                @if (isEdition(row.record)) {\n                  <td\n                    mat-cell\n                    class=\"mat-cell-text edition\"\n                    [formGroup]=\"formGroup\"\n                    [ngClass]=\"row.cellData[column.name].class\"\n                  >\n                    @switch (column.type) {\n                      @case ('date') {\n                        <div class=\"date-picker\">\n                          <mat-datepicker-toggle matSuffix [for]=\"picker\" />\n                          <input\n                            matInput\n                            [matDatepicker]=\"picker\"\n                            [formControlName]=\"column.name\"\n                            value=\"{{ row.cellData[column.name].value }}\"\n                            (dateChange)=\"\n                              onDateChange(column.name, row.record, $event)\n                            \"\n                          />\n                          <mat-datepicker #picker />\n                        </div>\n                      }\n                      @case ('time') {\n                        <input\n                          matInput\n                          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                      }\n                      @case ('number') {\n                        <input\n                          matInput\n                          type=\"number\"\n                          class=\"class_number_edition\"\n                          [formControlName]=\"column.name\"\n                          step=\"{{ column.step }}\"\n                          value=\"{{ row.cellData[column.name].value }}\"\n                          (input)=\"\n                            onValueChange(column.name, row.record, $event)\n                          \"\n                          readonly=\"{{\n                            getValidationAttributeValue(column, 'readonly')\n                          }}\"\n                          required=\"{{\n                            getValidationAttributeValue(column, 'mandatory')\n                          }}\"\n                          min=\"{{\n                            getValidationAttributeValue(column, 'minValue')\n                          }}\"\n                          max=\"{{\n                            getValidationAttributeValue(column, 'maxValue')\n                          }}\"\n                        />\n                      }\n                      @case ('boolean') {\n                        <mat-checkbox\n                          [formControlName]=\"column.name\"\n                          [checked]=\"row.cellData[column.name].value\"\n                          (change)=\"\n                            onBooleanValueChange(\n                              column.name,\n                              row.record,\n                              $event\n                            )\n                          \"\n                        />\n                      }\n                      @case ('list') {\n                        <mat-select\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                      }\n                      @case ('autocomplete') {\n                        <input\n                          matInput\n                          type=\"text\"\n                          [formControlName]=\"column.name\"\n                          [matAutocomplete]=\"auto\"\n                          required=\"{{\n                            getValidationAttributeValue(column, 'mandatory')\n                          }}\"\n                          value=\"{{ row.cellData[column.name].value }}\"\n                          readonly=\"{{\n                            getValidationAttributeValue(column, 'readonly')\n                          }}\"\n                        />\n                        <mat-autocomplete\n                          #auto=\"matAutocomplete\"\n                          (optionSelected)=\"\n                            onAutocompleteValueChange(\n                              column,\n                              row.record,\n                              $event\n                            )\n                          \"\n                          panelWidth=\"430px\"\n                        >\n                          <mat-option\n                            *ngFor=\"\n                              let option of filteredOptions[column.name] | async\n                            \"\n                            [value]=\"option.id\"\n                          >\n                            {{ option.value }}\n                          </mat-option>\n                        </mat-autocomplete>\n                      }\n                      @default {\n                        <input\n                          matInput\n                          type=\"text\"\n                          [formControlName]=\"column.name\"\n                          value=\"{{ row.cellData[column.name].value }}\"\n                          (input)=\"\n                            onValueChange(column.name, row.record, $event)\n                          \"\n                          readonly=\"{{\n                            getValidationAttributeValue(column, 'readonly')\n                          }}\"\n                          required=\"{{\n                            getValidationAttributeValue(column, 'mandatory')\n                          }}\"\n                        />\n                      }\n                    }\n                  </td>\n                } @else {\n                  @if (!row.cellData[column.name].isUrl) {\n                    <td\n                      mat-cell\n                      class=\"mat-cell-text\"\n                      [ngClass]=\"row.cellData[column.name].class\"\n                      [innerHTML]=\"\n                        row.cellData[column.name].value | sanitizeHtml\n                      \"\n                    ></td>\n                  } @else {\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                        @if (row.cellData[column.name].isImg) {\n                          <img\n                            igoImageError\n                            src=\"{{\n                              row.cellData[column.name].value\n                                | secureImage\n                                | async\n                            }}\"\n                            width=\"50\"\n                            heigth=\"auto\"\n                          />\n                        } @else {\n                          ><span\n                            >{{ 'igo.geo.targetHtmlUrl' | translate }}\n                          </span>\n                        }\n                        >\n                      </a>\n                    </td>\n                  }\n                }\n              </ng-container>\n            }\n            @case (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                @if (column.onClick) {\n                  <mat-icon (click)=\"column.onClick($event)\">{{\n                    row.cellData[column.name].value || column.icon\n                  }}</mat-icon>\n                } @else {\n                  <mat-icon>{{\n                    row.cellData[column.name].value || column.icon\n                  }}</mat-icon>\n                }\n              </td>\n            }\n            @case (entityTableColumnRenderer.ButtonGroup) {\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                  @for (\n                    button of row.cellData[column.name].value;\n                    track button\n                  ) {\n                    @if (\n                      isEdition(row.record) === button.editMode ||\n                      button.editMode === undefined\n                    ) {\n                      <span>\n                        @if (button.style === 'mat-icon-button') {\n                          <button\n                            igoStopPropagation\n                            mat-icon-button\n                            [color]=\"button.color\"\n                            (mousedown)=\"\n                              onButtonClick(button.click, row.record)\n                            \"\n                            [disabled]=\"button.disabled\"\n                          >\n                            <mat-icon>{{ button.icon }}</mat-icon>\n                          </button>\n                        } @else {\n                          <button\n                            igoStopPropagation\n                            mat-mini-fab\n                            [color]=\"button.color\"\n                            (mousedown)=\"\n                              onButtonClick(button.click, row.record)\n                            \"\n                            [disabled]=\"button.disabled\"\n                          >\n                            <mat-icon>{{ button.icon }}</mat-icon>\n                          </button>\n                        }\n                      </span>\n                    }\n                  }\n                </td>\n              </ng-container>\n            }\n            @default {\n              <ng-container *matCellDef=\"let row\">\n                @if (!row.cellData[column.name].isUrl) {\n                  <td\n                    mat-cell\n                    class=\"mat-cell-text\"\n                    [ngClass]=\"row.cellData[column.name].class\"\n                  >\n                    {{ row.cellData[column.name].value }}\n                  </td>\n                } @else {\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                      @if (row.cellData[column.name].isImg) {\n                        <img\n                          igoImageError\n                          src=\"{{\n                            row.cellData[column.name].value\n                              | secureImage\n                              | async\n                          }}\"\n                          width=\"50\"\n                          heigth=\"auto\"\n                        />\n                      } @else {\n                        <span>{{\n                          'igo.common.entity-table.targetHtmlUrl' | translate\n                        }}</span>\n                      }\n                      >\n                    </a>\n                  </td>\n                }\n              </ng-container>\n            }\n          }\n        }\n      </ng-container>\n    }\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  @if (withPaginator()) {\n    <igo-entity-table-paginator\n      [store]=\"store()\"\n      [paginatorOptions]=\"paginatorOptions()\"\n      [entitySortChange$]=\"entitySortChange$\"\n      (paginatorChange)=\"paginatorChange($event)\"\n    />\n  }\n</div>\n", styles: [":host{width:100%;height:100%;display:block;--mat-table-header-container-height: 52px}: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}.table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}.mat-cell-text{overflow:hidden;word-wrap:break-word}table.igo-entity-table-with-selection tr:hover{-moz-box-shadow:2px 0px 2px 0px #dddddd;-webkit-box-shadow:2px 0px 2px 0px #dddddd;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd;cursor:pointer}table button{margin:7px}.class_hidden{visibility:hidden}.class_display_none{display:none}.class_boolean,.class_icon,.class_number{text-align:center;padding-right:35px!important}.class_string,.class_text,.class_number_edition{text-align:left}td.edition{background:#a6a6a633}input{border-bottom:1px solid darkgrey}table.igo-entity-table-with-selection tr.igo-entity-table-row-highlighted{background-color:var(--mat-sys-primary-container);color:var(--mat-sys-on-primary-container)}\n"], dependencies: [{ kind: "component", type: EntityTablePaginatorComponent, selector: "igo-entity-table-paginator", inputs: ["entitySortChange$", "store", "paginatorOptions"], outputs: ["paginatorChange"] }, { kind: "directive", type: EntityTableRowDirective, selector: "[igoEntityTableRow]", inputs: ["selection", "selectOnClick", "highlightSelection", "selected", "scrollBehavior"], outputs: ["select"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$2.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: ImageErrorDirective, selector: "[igoImageError]", inputs: ["errorImageUrl", "hideError"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i2$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i2$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatMiniFabButton, selector: "button[mat-mini-fab], a[mat-mini-fab], button[matMiniFab], a[matMiniFab]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: i1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i8.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i9.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: // For the DateAdapter provider
-                MatOptionModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i10.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i10.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i11.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i11.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i11.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i11.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i11.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i11.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i11.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i11.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i11.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i11.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i12.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: StopPropagationDirective, selector: "[igoStopPropagation]" }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }, { kind: "pipe", type: SecureImagePipe, name: "secureImage" }, { kind: "pipe", type: i13.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], usesOnChanges: true, ngImport: i0, template: "<div class=\"table-container\" [style.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        @if (selectMany) {\n          @let selectionState = selectionState$ | async;\n          @if (selectionState) {\n            <mat-checkbox\n              (change)=\"onToggleRows($event.checked)\"\n              [checked]=\"selectionState === entityTableSelectionState.All\"\n              [indeterminate]=\"\n                selectionState === entityTableSelectionState.Some\n              \"\n            />\n          }\n        }\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      </td>\n    </ng-container>\n\n    @let template = this.template();\n    @if (template) {\n      @for (column of template.columns; track column) {\n        <ng-container [matColumnDef]=\"column.name\">\n          @if (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          } @else {\n            <th\n              mat-header-cell\n              *matHeaderCellDef\n              [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n            >\n              {{ column.title }}\n            </th>\n          }\n\n          @let columnRenderer = getColumnRenderer(column);\n          @if (columnRenderer) {\n            @switch (columnRenderer) {\n              @case (entityTableColumnRenderer.HTML) {\n                <ng-container *matCellDef=\"let row\">\n                  @if (!row.cellData[column.name].isUrl) {\n                    <td\n                      mat-cell\n                      class=\"mat-cell-text\"\n                      [ngClass]=\"row.cellData[column.name].class\"\n                      [innerHTML]=\"row.cellData[column.name].value\"\n                    ></td>\n                  } @else {\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                        @if (row.cellData[column.name].isImg) {\n                          <img\n                            igoImageError\n                            src=\"{{\n                              row.cellData[column.name].value\n                                | secureImage\n                                | async\n                            }}\"\n                            width=\"50\"\n                            heigth=\"auto\"\n                          />\n                        } @else {\n                          <span\n                            >{{ 'igo.geo.targetHtmlUrl' | translate }}\n                          </span>\n                        }\n                      </a>\n                    </td>\n                  }\n                </ng-container>\n              }\n              @case (entityTableColumnRenderer.UnsanitizedHTML) {\n                <ng-container *matCellDef=\"let row\">\n                  @if (isEdition(row.record)) {\n                    <td\n                      mat-cell\n                      class=\"mat-cell-text edition\"\n                      [formGroup]=\"formGroup\"\n                      [ngClass]=\"row.cellData[column.name].class\"\n                    >\n                      @switch (column.type) {\n                        @case ('date') {\n                          <div class=\"date-picker\">\n                            <mat-datepicker-toggle matSuffix [for]=\"picker\" />\n                            <input\n                              matInput\n                              [matDatepicker]=\"picker\"\n                              [formControlName]=\"column.name\"\n                              value=\"{{ row.cellData[column.name].value }}\"\n                              (dateChange)=\"\n                                onDateChange(column.name, row.record, $event)\n                              \"\n                            />\n                            <mat-datepicker #picker />\n                          </div>\n                        }\n                        @case ('time') {\n                          <input\n                            matInput\n                            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                        }\n                        @case ('number') {\n                          <input\n                            matInput\n                            type=\"number\"\n                            class=\"class_number_edition\"\n                            [formControlName]=\"column.name\"\n                            step=\"{{ column.step }}\"\n                            value=\"{{ row.cellData[column.name].value }}\"\n                            (input)=\"\n                              onValueChange(column.name, row.record, $event)\n                            \"\n                            readonly=\"{{\n                              getValidationAttributeValue(column, 'readonly')\n                            }}\"\n                            required=\"{{\n                              getValidationAttributeValue(column, 'mandatory')\n                            }}\"\n                            min=\"{{\n                              getValidationAttributeValue(column, 'minValue')\n                            }}\"\n                            max=\"{{\n                              getValidationAttributeValue(column, 'maxValue')\n                            }}\"\n                          />\n                        }\n                        @case ('boolean') {\n                          <mat-checkbox\n                            [formControlName]=\"column.name\"\n                            [checked]=\"row.cellData[column.name].value\"\n                            (change)=\"\n                              onBooleanValueChange(\n                                column.name,\n                                row.record,\n                                $event\n                              )\n                            \"\n                          />\n                        }\n                        @case ('list') {\n                          <mat-select\n                            required=\"{{\n                              getValidationAttributeValue(column, 'mandatory')\n                            }}\"\n                            [formControlName]=\"column.name\"\n                            [multiple]=\"column.multiple\"\n                            (selectionChange)=\"\n                              onSelectValueChange(\n                                column.name,\n                                row.record,\n                                $event\n                              )\n                            \"\n                            [value]=\"row.cellData[column.name].value\"\n                          >\n                            @for (\n                              option of $any(column).domainValues;\n                              track option\n                            ) {\n                              <mat-option\n                                [value]=\"option.id\"\n                                [disabled]=\"option.disabled\"\n                              >\n                                {{ option.value }}\n                              </mat-option>\n                            }\n                          </mat-select>\n                        }\n                        @case ('autocomplete') {\n                          <input\n                            matInput\n                            type=\"text\"\n                            [formControlName]=\"column.name\"\n                            [matAutocomplete]=\"auto\"\n                            required=\"{{\n                              getValidationAttributeValue(column, 'mandatory')\n                            }}\"\n                            value=\"{{ row.cellData[column.name].value }}\"\n                            readonly=\"{{\n                              getValidationAttributeValue(column, 'readonly')\n                            }}\"\n                          />\n                          <mat-autocomplete\n                            #auto=\"matAutocomplete\"\n                            (optionSelected)=\"\n                              onAutocompleteValueChange(\n                                column,\n                                row.record,\n                                $event\n                              )\n                            \"\n                            panelWidth=\"430px\"\n                          >\n                            @for (\n                              option of filteredOptions[column.name] | async;\n                              track option\n                            ) {\n                              <mat-option [value]=\"option.id\">\n                                {{ option.value }}\n                              </mat-option>\n                            }\n                          </mat-autocomplete>\n                        }\n                        @default {\n                          <input\n                            matInput\n                            type=\"text\"\n                            [formControlName]=\"column.name\"\n                            value=\"{{ row.cellData[column.name].value }}\"\n                            (input)=\"\n                              onValueChange(column.name, row.record, $event)\n                            \"\n                            readonly=\"{{\n                              getValidationAttributeValue(column, 'readonly')\n                            }}\"\n                            required=\"{{\n                              getValidationAttributeValue(column, 'mandatory')\n                            }}\"\n                          />\n                        }\n                      }\n                    </td>\n                  } @else {\n                    @if (!row.cellData[column.name].isUrl) {\n                      <td\n                        mat-cell\n                        class=\"mat-cell-text\"\n                        [ngClass]=\"row.cellData[column.name].class\"\n                        [innerHTML]=\"\n                          row.cellData[column.name].value | sanitizeHtml\n                        \"\n                      ></td>\n                    } @else {\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                          @if (row.cellData[column.name].isImg) {\n                            <img\n                              igoImageError\n                              src=\"{{\n                                row.cellData[column.name].value\n                                  | secureImage\n                                  | async\n                              }}\"\n                              width=\"50\"\n                              heigth=\"auto\"\n                            />\n                          } @else {\n                            ><span\n                              >{{ 'igo.geo.targetHtmlUrl' | translate }}\n                            </span>\n                          }\n                          >\n                        </a>\n                      </td>\n                    }\n                  }\n                </ng-container>\n              }\n              @case (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                  @if (column.onClick) {\n                    <mat-icon (click)=\"column.onClick($event)\">{{\n                      row.cellData[column.name].value || column.icon\n                    }}</mat-icon>\n                  } @else {\n                    <mat-icon>{{\n                      row.cellData[column.name].value || column.icon\n                    }}</mat-icon>\n                  }\n                </td>\n              }\n              @case (entityTableColumnRenderer.ButtonGroup) {\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                    @for (\n                      button of row.cellData[column.name].value;\n                      track button\n                    ) {\n                      @if (\n                        isEdition(row.record) === button.editMode ||\n                        button.editMode === undefined\n                      ) {\n                        <span>\n                          @if (button.style === 'mat-icon-button') {\n                            <button\n                              igoStopPropagation\n                              mat-icon-button\n                              [color]=\"button.color\"\n                              (mousedown)=\"\n                                onButtonClick(button.click, row.record)\n                              \"\n                              [disabled]=\"button.disabled\"\n                            >\n                              <mat-icon>{{ button.icon }}</mat-icon>\n                            </button>\n                          } @else {\n                            <button\n                              igoStopPropagation\n                              mat-mini-fab\n                              [color]=\"button.color\"\n                              (mousedown)=\"\n                                onButtonClick(button.click, row.record)\n                              \"\n                              [disabled]=\"button.disabled\"\n                            >\n                              <mat-icon>{{ button.icon }}</mat-icon>\n                            </button>\n                          }\n                        </span>\n                      }\n                    }\n                  </td>\n                </ng-container>\n              }\n              @default {\n                <ng-container *matCellDef=\"let row\">\n                  @if (!row.cellData[column.name].isUrl) {\n                    <td\n                      mat-cell\n                      class=\"mat-cell-text\"\n                      [ngClass]=\"row.cellData[column.name].class\"\n                    >\n                      {{ row.cellData[column.name].value }}\n                    </td>\n                  } @else {\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                        @if (row.cellData[column.name].isImg) {\n                          <img\n                            igoImageError\n                            src=\"{{\n                              row.cellData[column.name].value\n                                | secureImage\n                                | async\n                            }}\"\n                            width=\"50\"\n                            heigth=\"auto\"\n                          />\n                        } @else {\n                          <span>{{\n                            'igo.common.entity-table.targetHtmlUrl' | translate\n                          }}</span>\n                        }\n                        >\n                      </a>\n                    </td>\n                  }\n                </ng-container>\n              }\n            }\n          }\n        </ng-container>\n      }\n    }\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  @if (withPaginator()) {\n    <igo-entity-table-paginator\n      [store]=\"store()\"\n      [paginatorOptions]=\"paginatorOptions()\"\n      [entitySortChange$]=\"entitySortChange$\"\n      (paginatorChange)=\"paginatorChange($event)\"\n    />\n  }\n</div>\n", styles: [":host{width:100%;height:100%;display:block;--mat-table-header-container-height: 52px}: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}.table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}.mat-cell-text{overflow:hidden;word-wrap:break-word}table.igo-entity-table-with-selection tr:hover{-moz-box-shadow:2px 0px 2px 0px #dddddd;-webkit-box-shadow:2px 0px 2px 0px #dddddd;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd;cursor:pointer}table button{margin:7px}.class_hidden{visibility:hidden}.class_display_none{display:none}.class_boolean,.class_icon,.class_number{text-align:center;padding-right:35px!important}.class_string,.class_text,.class_number_edition{text-align:left}td.edition{background:#a6a6a633}input{border-bottom:1px solid darkgrey}table.igo-entity-table-with-selection tr.igo-entity-table-row-highlighted{background-color:var(--mat-sys-primary-container);color:var(--mat-sys-on-primary-container)}\n"], dependencies: [{ kind: "component", type: EntityTablePaginatorComponent, selector: "igo-entity-table-paginator", inputs: ["entitySortChange$", "store", "paginatorOptions"], outputs: ["paginatorChange"] }, { kind: "directive", type: EntityTableRowDirective, selector: "[igoEntityTableRow]", inputs: ["selection", "selectOnClick", "highlightSelection", "selected", "scrollBehavior"], outputs: ["select"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$2.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: ImageErrorDirective, selector: "[igoImageError]", inputs: ["errorImageUrl", "hideError"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i2$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i2$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatMiniFabButton, selector: "button[mat-mini-fab], a[mat-mini-fab], button[matMiniFab], a[matMiniFab]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: i1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i8.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i9.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: // For the DateAdapter provider
+                MatOptionModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i10.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i10.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i11.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i11.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i11.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i11.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i11.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i11.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i11.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i11.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i11.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i11.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i12.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: StopPropagationDirective, selector: "[igoStopPropagation]" }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }, { kind: "pipe", type: SecureImagePipe, name: "secureImage" }, { kind: "pipe", type: i13.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EntityTableComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EntityTableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igo-entity-table', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         { provide: MatFormFieldControl, useExisting: EntityTableComponent },
@@ -2989,13 +3023,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                         MatTableModule,
                         MatTooltipModule,
                         NgClass,
-                        NgStyle,
                         ReactiveFormsModule,
                         SanitizeHtmlPipe,
                         SecureImagePipe,
                         StopPropagationDirective,
                         IgoLanguageModule
-                    ], 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        @if (selectMany) {\n          @let selectionState = selectionState$ | async;\n          @if (selectionState) {\n            <mat-checkbox\n              (change)=\"onToggleRows($event.checked)\"\n              [checked]=\"selectionState === entityTableSelectionState.All\"\n              [indeterminate]=\"\n                selectionState === entityTableSelectionState.Some\n              \"\n            />\n          }\n        }\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      </td>\n    </ng-container>\n\n    @for (column of template().columns; track column) {\n      <ng-container [matColumnDef]=\"column.name\">\n        @if (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        } @else {\n          <th\n            mat-header-cell\n            *matHeaderCellDef\n            [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n          >\n            {{ column.title }}\n          </th>\n        }\n\n        @let columnRenderer = getColumnRenderer(column);\n        @if (columnRenderer) {\n          @switch (columnRenderer) {\n            @case (entityTableColumnRenderer.HTML) {\n              <ng-container *matCellDef=\"let row\">\n                @if (!row.cellData[column.name].isUrl) {\n                  <td\n                    mat-cell\n                    class=\"mat-cell-text\"\n                    [ngClass]=\"row.cellData[column.name].class\"\n                    [innerHTML]=\"row.cellData[column.name].value\"\n                  ></td>\n                } @else {\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                      @if (row.cellData[column.name].isImg) {\n                        <img\n                          igoImageError\n                          src=\"{{\n                            row.cellData[column.name].value\n                              | secureImage\n                              | async\n                          }}\"\n                          width=\"50\"\n                          heigth=\"auto\"\n                        />\n                      } @else {\n                        <span>{{ 'igo.geo.targetHtmlUrl' | translate }} </span>\n                      }\n                      >\n                    </a>\n                  </td>\n                }\n              </ng-container>\n            }\n            @case (entityTableColumnRenderer.UnsanitizedHTML) {\n              <ng-container *matCellDef=\"let row\">\n                @if (isEdition(row.record)) {\n                  <td\n                    mat-cell\n                    class=\"mat-cell-text edition\"\n                    [formGroup]=\"formGroup\"\n                    [ngClass]=\"row.cellData[column.name].class\"\n                  >\n                    @switch (column.type) {\n                      @case ('date') {\n                        <div class=\"date-picker\">\n                          <mat-datepicker-toggle matSuffix [for]=\"picker\" />\n                          <input\n                            matInput\n                            [matDatepicker]=\"picker\"\n                            [formControlName]=\"column.name\"\n                            value=\"{{ row.cellData[column.name].value }}\"\n                            (dateChange)=\"\n                              onDateChange(column.name, row.record, $event)\n                            \"\n                          />\n                          <mat-datepicker #picker />\n                        </div>\n                      }\n                      @case ('time') {\n                        <input\n                          matInput\n                          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                      }\n                      @case ('number') {\n                        <input\n                          matInput\n                          type=\"number\"\n                          class=\"class_number_edition\"\n                          [formControlName]=\"column.name\"\n                          step=\"{{ column.step }}\"\n                          value=\"{{ row.cellData[column.name].value }}\"\n                          (input)=\"\n                            onValueChange(column.name, row.record, $event)\n                          \"\n                          readonly=\"{{\n                            getValidationAttributeValue(column, 'readonly')\n                          }}\"\n                          required=\"{{\n                            getValidationAttributeValue(column, 'mandatory')\n                          }}\"\n                          min=\"{{\n                            getValidationAttributeValue(column, 'minValue')\n                          }}\"\n                          max=\"{{\n                            getValidationAttributeValue(column, 'maxValue')\n                          }}\"\n                        />\n                      }\n                      @case ('boolean') {\n                        <mat-checkbox\n                          [formControlName]=\"column.name\"\n                          [checked]=\"row.cellData[column.name].value\"\n                          (change)=\"\n                            onBooleanValueChange(\n                              column.name,\n                              row.record,\n                              $event\n                            )\n                          \"\n                        />\n                      }\n                      @case ('list') {\n                        <mat-select\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                      }\n                      @case ('autocomplete') {\n                        <input\n                          matInput\n                          type=\"text\"\n                          [formControlName]=\"column.name\"\n                          [matAutocomplete]=\"auto\"\n                          required=\"{{\n                            getValidationAttributeValue(column, 'mandatory')\n                          }}\"\n                          value=\"{{ row.cellData[column.name].value }}\"\n                          readonly=\"{{\n                            getValidationAttributeValue(column, 'readonly')\n                          }}\"\n                        />\n                        <mat-autocomplete\n                          #auto=\"matAutocomplete\"\n                          (optionSelected)=\"\n                            onAutocompleteValueChange(\n                              column,\n                              row.record,\n                              $event\n                            )\n                          \"\n                          panelWidth=\"430px\"\n                        >\n                          <mat-option\n                            *ngFor=\"\n                              let option of filteredOptions[column.name] | async\n                            \"\n                            [value]=\"option.id\"\n                          >\n                            {{ option.value }}\n                          </mat-option>\n                        </mat-autocomplete>\n                      }\n                      @default {\n                        <input\n                          matInput\n                          type=\"text\"\n                          [formControlName]=\"column.name\"\n                          value=\"{{ row.cellData[column.name].value }}\"\n                          (input)=\"\n                            onValueChange(column.name, row.record, $event)\n                          \"\n                          readonly=\"{{\n                            getValidationAttributeValue(column, 'readonly')\n                          }}\"\n                          required=\"{{\n                            getValidationAttributeValue(column, 'mandatory')\n                          }}\"\n                        />\n                      }\n                    }\n                  </td>\n                } @else {\n                  @if (!row.cellData[column.name].isUrl) {\n                    <td\n                      mat-cell\n                      class=\"mat-cell-text\"\n                      [ngClass]=\"row.cellData[column.name].class\"\n                      [innerHTML]=\"\n                        row.cellData[column.name].value | sanitizeHtml\n                      \"\n                    ></td>\n                  } @else {\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                        @if (row.cellData[column.name].isImg) {\n                          <img\n                            igoImageError\n                            src=\"{{\n                              row.cellData[column.name].value\n                                | secureImage\n                                | async\n                            }}\"\n                            width=\"50\"\n                            heigth=\"auto\"\n                          />\n                        } @else {\n                          ><span\n                            >{{ 'igo.geo.targetHtmlUrl' | translate }}\n                          </span>\n                        }\n                        >\n                      </a>\n                    </td>\n                  }\n                }\n              </ng-container>\n            }\n            @case (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                @if (column.onClick) {\n                  <mat-icon (click)=\"column.onClick($event)\">{{\n                    row.cellData[column.name].value || column.icon\n                  }}</mat-icon>\n                } @else {\n                  <mat-icon>{{\n                    row.cellData[column.name].value || column.icon\n                  }}</mat-icon>\n                }\n              </td>\n            }\n            @case (entityTableColumnRenderer.ButtonGroup) {\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                  @for (\n                    button of row.cellData[column.name].value;\n                    track button\n                  ) {\n                    @if (\n                      isEdition(row.record) === button.editMode ||\n                      button.editMode === undefined\n                    ) {\n                      <span>\n                        @if (button.style === 'mat-icon-button') {\n                          <button\n                            igoStopPropagation\n                            mat-icon-button\n                            [color]=\"button.color\"\n                            (mousedown)=\"\n                              onButtonClick(button.click, row.record)\n                            \"\n                            [disabled]=\"button.disabled\"\n                          >\n                            <mat-icon>{{ button.icon }}</mat-icon>\n                          </button>\n                        } @else {\n                          <button\n                            igoStopPropagation\n                            mat-mini-fab\n                            [color]=\"button.color\"\n                            (mousedown)=\"\n                              onButtonClick(button.click, row.record)\n                            \"\n                            [disabled]=\"button.disabled\"\n                          >\n                            <mat-icon>{{ button.icon }}</mat-icon>\n                          </button>\n                        }\n                      </span>\n                    }\n                  }\n                </td>\n              </ng-container>\n            }\n            @default {\n              <ng-container *matCellDef=\"let row\">\n                @if (!row.cellData[column.name].isUrl) {\n                  <td\n                    mat-cell\n                    class=\"mat-cell-text\"\n                    [ngClass]=\"row.cellData[column.name].class\"\n                  >\n                    {{ row.cellData[column.name].value }}\n                  </td>\n                } @else {\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                      @if (row.cellData[column.name].isImg) {\n                        <img\n                          igoImageError\n                          src=\"{{\n                            row.cellData[column.name].value\n                              | secureImage\n                              | async\n                          }}\"\n                          width=\"50\"\n                          heigth=\"auto\"\n                        />\n                      } @else {\n                        <span>{{\n                          'igo.common.entity-table.targetHtmlUrl' | translate\n                        }}</span>\n                      }\n                      >\n                    </a>\n                  </td>\n                }\n              </ng-container>\n            }\n          }\n        }\n      </ng-container>\n    }\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  @if (withPaginator()) {\n    <igo-entity-table-paginator\n      [store]=\"store()\"\n      [paginatorOptions]=\"paginatorOptions()\"\n      [entitySortChange$]=\"entitySortChange$\"\n      (paginatorChange)=\"paginatorChange($event)\"\n    />\n  }\n</div>\n", styles: [":host{width:100%;height:100%;display:block;--mat-table-header-container-height: 52px}: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}.table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}.mat-cell-text{overflow:hidden;word-wrap:break-word}table.igo-entity-table-with-selection tr:hover{-moz-box-shadow:2px 0px 2px 0px #dddddd;-webkit-box-shadow:2px 0px 2px 0px #dddddd;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd;cursor:pointer}table button{margin:7px}.class_hidden{visibility:hidden}.class_display_none{display:none}.class_boolean,.class_icon,.class_number{text-align:center;padding-right:35px!important}.class_string,.class_text,.class_number_edition{text-align:left}td.edition{background:#a6a6a633}input{border-bottom:1px solid darkgrey}table.igo-entity-table-with-selection tr.igo-entity-table-row-highlighted{background-color:var(--mat-sys-primary-container);color:var(--mat-sys-on-primary-container)}\n"] }]
+                    ], template: "<div class=\"table-container\" [style.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        @if (selectMany) {\n          @let selectionState = selectionState$ | async;\n          @if (selectionState) {\n            <mat-checkbox\n              (change)=\"onToggleRows($event.checked)\"\n              [checked]=\"selectionState === entityTableSelectionState.All\"\n              [indeterminate]=\"\n                selectionState === entityTableSelectionState.Some\n              \"\n            />\n          }\n        }\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      </td>\n    </ng-container>\n\n    @let template = this.template();\n    @if (template) {\n      @for (column of template.columns; track column) {\n        <ng-container [matColumnDef]=\"column.name\">\n          @if (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          } @else {\n            <th\n              mat-header-cell\n              *matHeaderCellDef\n              [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n            >\n              {{ column.title }}\n            </th>\n          }\n\n          @let columnRenderer = getColumnRenderer(column);\n          @if (columnRenderer) {\n            @switch (columnRenderer) {\n              @case (entityTableColumnRenderer.HTML) {\n                <ng-container *matCellDef=\"let row\">\n                  @if (!row.cellData[column.name].isUrl) {\n                    <td\n                      mat-cell\n                      class=\"mat-cell-text\"\n                      [ngClass]=\"row.cellData[column.name].class\"\n                      [innerHTML]=\"row.cellData[column.name].value\"\n                    ></td>\n                  } @else {\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                        @if (row.cellData[column.name].isImg) {\n                          <img\n                            igoImageError\n                            src=\"{{\n                              row.cellData[column.name].value\n                                | secureImage\n                                | async\n                            }}\"\n                            width=\"50\"\n                            heigth=\"auto\"\n                          />\n                        } @else {\n                          <span\n                            >{{ 'igo.geo.targetHtmlUrl' | translate }}\n                          </span>\n                        }\n                      </a>\n                    </td>\n                  }\n                </ng-container>\n              }\n              @case (entityTableColumnRenderer.UnsanitizedHTML) {\n                <ng-container *matCellDef=\"let row\">\n                  @if (isEdition(row.record)) {\n                    <td\n                      mat-cell\n                      class=\"mat-cell-text edition\"\n                      [formGroup]=\"formGroup\"\n                      [ngClass]=\"row.cellData[column.name].class\"\n                    >\n                      @switch (column.type) {\n                        @case ('date') {\n                          <div class=\"date-picker\">\n                            <mat-datepicker-toggle matSuffix [for]=\"picker\" />\n                            <input\n                              matInput\n                              [matDatepicker]=\"picker\"\n                              [formControlName]=\"column.name\"\n                              value=\"{{ row.cellData[column.name].value }}\"\n                              (dateChange)=\"\n                                onDateChange(column.name, row.record, $event)\n                              \"\n                            />\n                            <mat-datepicker #picker />\n                          </div>\n                        }\n                        @case ('time') {\n                          <input\n                            matInput\n                            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                        }\n                        @case ('number') {\n                          <input\n                            matInput\n                            type=\"number\"\n                            class=\"class_number_edition\"\n                            [formControlName]=\"column.name\"\n                            step=\"{{ column.step }}\"\n                            value=\"{{ row.cellData[column.name].value }}\"\n                            (input)=\"\n                              onValueChange(column.name, row.record, $event)\n                            \"\n                            readonly=\"{{\n                              getValidationAttributeValue(column, 'readonly')\n                            }}\"\n                            required=\"{{\n                              getValidationAttributeValue(column, 'mandatory')\n                            }}\"\n                            min=\"{{\n                              getValidationAttributeValue(column, 'minValue')\n                            }}\"\n                            max=\"{{\n                              getValidationAttributeValue(column, 'maxValue')\n                            }}\"\n                          />\n                        }\n                        @case ('boolean') {\n                          <mat-checkbox\n                            [formControlName]=\"column.name\"\n                            [checked]=\"row.cellData[column.name].value\"\n                            (change)=\"\n                              onBooleanValueChange(\n                                column.name,\n                                row.record,\n                                $event\n                              )\n                            \"\n                          />\n                        }\n                        @case ('list') {\n                          <mat-select\n                            required=\"{{\n                              getValidationAttributeValue(column, 'mandatory')\n                            }}\"\n                            [formControlName]=\"column.name\"\n                            [multiple]=\"column.multiple\"\n                            (selectionChange)=\"\n                              onSelectValueChange(\n                                column.name,\n                                row.record,\n                                $event\n                              )\n                            \"\n                            [value]=\"row.cellData[column.name].value\"\n                          >\n                            @for (\n                              option of $any(column).domainValues;\n                              track option\n                            ) {\n                              <mat-option\n                                [value]=\"option.id\"\n                                [disabled]=\"option.disabled\"\n                              >\n                                {{ option.value }}\n                              </mat-option>\n                            }\n                          </mat-select>\n                        }\n                        @case ('autocomplete') {\n                          <input\n                            matInput\n                            type=\"text\"\n                            [formControlName]=\"column.name\"\n                            [matAutocomplete]=\"auto\"\n                            required=\"{{\n                              getValidationAttributeValue(column, 'mandatory')\n                            }}\"\n                            value=\"{{ row.cellData[column.name].value }}\"\n                            readonly=\"{{\n                              getValidationAttributeValue(column, 'readonly')\n                            }}\"\n                          />\n                          <mat-autocomplete\n                            #auto=\"matAutocomplete\"\n                            (optionSelected)=\"\n                              onAutocompleteValueChange(\n                                column,\n                                row.record,\n                                $event\n                              )\n                            \"\n                            panelWidth=\"430px\"\n                          >\n                            @for (\n                              option of filteredOptions[column.name] | async;\n                              track option\n                            ) {\n                              <mat-option [value]=\"option.id\">\n                                {{ option.value }}\n                              </mat-option>\n                            }\n                          </mat-autocomplete>\n                        }\n                        @default {\n                          <input\n                            matInput\n                            type=\"text\"\n                            [formControlName]=\"column.name\"\n                            value=\"{{ row.cellData[column.name].value }}\"\n                            (input)=\"\n                              onValueChange(column.name, row.record, $event)\n                            \"\n                            readonly=\"{{\n                              getValidationAttributeValue(column, 'readonly')\n                            }}\"\n                            required=\"{{\n                              getValidationAttributeValue(column, 'mandatory')\n                            }}\"\n                          />\n                        }\n                      }\n                    </td>\n                  } @else {\n                    @if (!row.cellData[column.name].isUrl) {\n                      <td\n                        mat-cell\n                        class=\"mat-cell-text\"\n                        [ngClass]=\"row.cellData[column.name].class\"\n                        [innerHTML]=\"\n                          row.cellData[column.name].value | sanitizeHtml\n                        \"\n                      ></td>\n                    } @else {\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                          @if (row.cellData[column.name].isImg) {\n                            <img\n                              igoImageError\n                              src=\"{{\n                                row.cellData[column.name].value\n                                  | secureImage\n                                  | async\n                              }}\"\n                              width=\"50\"\n                              heigth=\"auto\"\n                            />\n                          } @else {\n                            ><span\n                              >{{ 'igo.geo.targetHtmlUrl' | translate }}\n                            </span>\n                          }\n                          >\n                        </a>\n                      </td>\n                    }\n                  }\n                </ng-container>\n              }\n              @case (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                  @if (column.onClick) {\n                    <mat-icon (click)=\"column.onClick($event)\">{{\n                      row.cellData[column.name].value || column.icon\n                    }}</mat-icon>\n                  } @else {\n                    <mat-icon>{{\n                      row.cellData[column.name].value || column.icon\n                    }}</mat-icon>\n                  }\n                </td>\n              }\n              @case (entityTableColumnRenderer.ButtonGroup) {\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                    @for (\n                      button of row.cellData[column.name].value;\n                      track button\n                    ) {\n                      @if (\n                        isEdition(row.record) === button.editMode ||\n                        button.editMode === undefined\n                      ) {\n                        <span>\n                          @if (button.style === 'mat-icon-button') {\n                            <button\n                              igoStopPropagation\n                              mat-icon-button\n                              [color]=\"button.color\"\n                              (mousedown)=\"\n                                onButtonClick(button.click, row.record)\n                              \"\n                              [disabled]=\"button.disabled\"\n                            >\n                              <mat-icon>{{ button.icon }}</mat-icon>\n                            </button>\n                          } @else {\n                            <button\n                              igoStopPropagation\n                              mat-mini-fab\n                              [color]=\"button.color\"\n                              (mousedown)=\"\n                                onButtonClick(button.click, row.record)\n                              \"\n                              [disabled]=\"button.disabled\"\n                            >\n                              <mat-icon>{{ button.icon }}</mat-icon>\n                            </button>\n                          }\n                        </span>\n                      }\n                    }\n                  </td>\n                </ng-container>\n              }\n              @default {\n                <ng-container *matCellDef=\"let row\">\n                  @if (!row.cellData[column.name].isUrl) {\n                    <td\n                      mat-cell\n                      class=\"mat-cell-text\"\n                      [ngClass]=\"row.cellData[column.name].class\"\n                    >\n                      {{ row.cellData[column.name].value }}\n                    </td>\n                  } @else {\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                        @if (row.cellData[column.name].isImg) {\n                          <img\n                            igoImageError\n                            src=\"{{\n                              row.cellData[column.name].value\n                                | secureImage\n                                | async\n                            }}\"\n                            width=\"50\"\n                            heigth=\"auto\"\n                          />\n                        } @else {\n                          <span>{{\n                            'igo.common.entity-table.targetHtmlUrl' | translate\n                          }}</span>\n                        }\n                        >\n                      </a>\n                    </td>\n                  }\n                </ng-container>\n              }\n            }\n          }\n        </ng-container>\n      }\n    }\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  @if (withPaginator()) {\n    <igo-entity-table-paginator\n      [store]=\"store()\"\n      [paginatorOptions]=\"paginatorOptions()\"\n      [entitySortChange$]=\"entitySortChange$\"\n      (paginatorChange)=\"paginatorChange($event)\"\n    />\n  }\n</div>\n", styles: [":host{width:100%;height:100%;display:block;--mat-table-header-container-height: 52px}: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}.table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}.mat-cell-text{overflow:hidden;word-wrap:break-word}table.igo-entity-table-with-selection tr:hover{-moz-box-shadow:2px 0px 2px 0px #dddddd;-webkit-box-shadow:2px 0px 2px 0px #dddddd;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd;cursor:pointer}table button{margin:7px}.class_hidden{visibility:hidden}.class_display_none{display:none}.class_boolean,.class_icon,.class_number{text-align:center;padding-right:35px!important}.class_string,.class_text,.class_number_edition{text-align:left}td.edition{background:#a6a6a633}input{border-bottom:1px solid darkgrey}table.igo-entity-table-with-selection tr.igo-entity-table-row-highlighted{background-color:var(--mat-sys-primary-container);color:var(--mat-sys-on-primary-container)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { store: [{ type: i0.Input, args: [{ isSignal: true, alias: "store", required: false }] }], paginator: [{
                 type: Input
             }], template: [{ type: i0.Input, args: [{ isSignal: true, alias: "template", required: false }] }], scrollBehavior: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollBehavior", required: false }] }], sortNullsFirst: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortNullsFirst", required: false }] }], withPaginator: [{ type: i0.Input, args: [{ isSignal: true, alias: "withPaginator", required: false }] }], paginatorOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginatorOptions", required: false }] }], entityClick: [{ type: i0.Output, args: ["entityClick"] }], entitySelectChange: [{ type: i0.Output, args: ["entitySelectChange"] }], entitySortChange: [{ type: i0.Output, args: ["entitySortChange"] }] } });
@@ -3004,11 +3037,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
  * @deprecated import the EntityTableComponent directly
  */
 class IgoEntityTableModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoEntityTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: IgoEntityTableModule, imports: [EntityTableComponent], exports: [EntityTableComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoEntityTableModule, imports: [EntityTableComponent] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoEntityTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.14", ngImport: i0, type: IgoEntityTableModule, imports: [EntityTableComponent], exports: [EntityTableComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoEntityTableModule, imports: [EntityTableComponent] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoEntityTableModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoEntityTableModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [EntityTableComponent],
@@ -3020,11 +3053,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
  * @deprecated import the EntityTablePaginatorComponent directly
  */
 class IgoEntityTablePaginatorModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoEntityTablePaginatorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: IgoEntityTablePaginatorModule, imports: [EntityTablePaginatorComponent], exports: [EntityTablePaginatorComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoEntityTablePaginatorModule, imports: [EntityTablePaginatorComponent] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoEntityTablePaginatorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.14", ngImport: i0, type: IgoEntityTablePaginatorModule, imports: [EntityTablePaginatorComponent], exports: [EntityTablePaginatorComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoEntityTablePaginatorModule, imports: [EntityTablePaginatorComponent] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoEntityTablePaginatorModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoEntityTablePaginatorModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [EntityTablePaginatorComponent],
@@ -3041,15 +3074,15 @@ const ENTITY_DIRECTIVES = [
  * @deprecated import the components directly or ENTITY_DIRECTIVES for every components/directives
  */
 class IgoEntityModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoEntityModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: IgoEntityModule, imports: [EntitySelectorComponent,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoEntityModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.14", ngImport: i0, type: IgoEntityModule, imports: [EntitySelectorComponent,
             EntityTableComponent,
             EntityTablePaginatorComponent], exports: [EntitySelectorComponent,
             EntityTableComponent,
             EntityTablePaginatorComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoEntityModule, imports: [ENTITY_DIRECTIVES] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoEntityModule, imports: [ENTITY_DIRECTIVES] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoEntityModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoEntityModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...ENTITY_DIRECTIVES],