@onecx/angular-accelerator 4.42.0 → 4.43.0

package/fesm2020/onecx-angular-accelerator.mjs

@@ -2109,14 +2109,32 @@ class DataViewComponent {
     get _customTableCell() {
         return this.customTableCellTemplate || this.customTableCellChildTemplate;
     }
-    get _tableDateCell() {
-        return this.tableDateCellTemplate || this.tableDateCellChildTemplate;
+    /**
+     * @deprecated Will be replaced by dateTableCellTemplate
+     */
+    get tableDateCellTemplate() {
+        return this.dateTableCellTemplate;
+    }
+    set tableDateCellTemplate(value) {
+        this.dateTableCellTemplate = value;
+    }
+    get _dateTableCell() {
+        return this.dateTableCellTemplate || this.dateTableCellChildTemplate || this.tableDateCellChildTemplate;
     }
     get _tableCell() {
         return this.tableCellTemplate || this.tableCellChildTemplate;
     }
-    get _tableTranslationKeyCell() {
-        return this.tableTranslationKeyCellTemplate || this.tableTranslationKeyCellChildTemplate;
+    /**
+     * @deprecated Will be replaced by translationKeyTableCellTemplate
+     */
+    get tableTranslationKeyCellTemplate() {
+        return this.translationKeyTableCellTemplate;
+    }
+    set tableTranslationKeyCellTemplate(value) {
+        this.translationKeyTableCellTemplate = value;
+    }
+    get _translationKeyTableCell() {
+        return this.translationKeyTableCellTemplate || this.translationKeyTableCellChildTemplate || this.tableTranslationKeyCellChildTemplate;
     }
     get _gridItemSubtitleLines() {
         return this.gridItemSubtitleLinesTemplate || this.gridItemSubtitleLinesChildTemplate;
@@ -2130,8 +2148,17 @@ class DataViewComponent {
     get _listItem() {
         return this.listItemTemplate || this.listItemChildTemplate;
     }
+    /**
+     * @deprecated Will be replaced by relativeDateTableCellTemplate
+     */
+    get tableRelativeDateCellTemplate() {
+        return this.relativeDateTableCellTemplate;
+    }
+    set tableRelativeDateCellTemplate(value) {
+        this.relativeDateTableCellTemplate = value;
+    }
     get _tableRelativeDateCell() {
-        return this.tableRelativeDateCellTemplate || this.tableRelativeDateCellChildTemplate;
+        return this.relativeDateTableCellTemplate || this.relativeDateTableCellChildTemplate || this.tableRelativeDateCellChildTemplate;
     }
     get viewItemObserved() {
         return this.injector.get('InteractiveDataViewComponent', null)?.viewItem.observed || this.viewItem.observed;
@@ -2283,10 +2310,10 @@ class DataViewComponent {
     }
 }
 DataViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DataViewComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
-DataViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DataViewComponent, selector: "ocx-data-view", inputs: { deletePermission: "deletePermission", editPermission: "editPermission", viewPermission: "viewPermission", deleteActionVisibleField: "deleteActionVisibleField", deleteActionEnabledField: "deleteActionEnabledField", viewActionVisibleField: "viewActionVisibleField", viewActionEnabledField: "viewActionEnabledField", editActionVisibleField: "editActionVisibleField", editActionEnabledField: "editActionEnabledField", data: "data", name: "name", titleLineId: "titleLineId", subtitleLineIds: "subtitleLineIds", layout: "layout", columns: "columns", emptyResultsMessage: "emptyResultsMessage", clientSideSorting: "clientSideSorting", clientSideFiltering: "clientSideFiltering", fallbackImage: "fallbackImage", filters: "filters", sortField: "sortField", sortDirection: "sortDirection", listGridPaginator: "listGridPaginator", tablePaginator: "tablePaginator", page: "page", totalRecordsOnServer: "totalRecordsOnServer", currentPageShowingKey: "currentPageShowingKey", currentPageShowingWithTotalOnServerKey: "currentPageShowingWithTotalOnServerKey", selectedRows: "selectedRows", frozenActionColumn: "frozenActionColumn", actionColumnPosition: "actionColumnPosition", paginator: "paginator", sortStates: "sortStates", pageSizes: "pageSizes", pageSize: "pageSize", stringTableCellTemplate: "stringTableCellTemplate", numberTableCellTemplate: "numberTableCellTemplate", customTableCellTemplate: "customTableCellTemplate", tableDateCellTemplate: "tableDateCellTemplate", tableCellTemplate: "tableCellTemplate", tableTranslationKeyCellTemplate: "tableTranslationKeyCellTemplate", gridItemSubtitleLinesTemplate: "gridItemSubtitleLinesTemplate", listItemSubtitleLinesTemplate: "listItemSubtitleLinesTemplate", gridItemTemplate: "gridItemTemplate", listItemTemplate: "listItemTemplate", tableRelativeDateCellTemplate: "tableRelativeDateCellTemplate", additionalActions: "additionalActions" }, outputs: { filtered: "filtered", sorted: "sorted", deleteItem: "deleteItem", viewItem: "viewItem", editItem: "editItem", selectionChanged: "selectionChanged", pageChanged: "pageChanged" }, providers: [{ provide: 'DataViewComponent', useExisting: DataViewComponent }], queries: [{ propertyName: "stringTableCellChildTemplate", first: true, predicate: ["stringTableCell"], descendants: true }, { propertyName: "numberTableCellChildTemplate", first: true, predicate: ["numberTableCell"], descendants: true }, { propertyName: "customTableCellChildTemplate", first: true, predicate: ["customTableCell"], descendants: true }, { propertyName: "tableDateCellChildTemplate", first: true, predicate: ["tableDateCell"], descendants: true }, { propertyName: "tableCellChildTemplate", first: true, predicate: ["tableCell"], descendants: true }, { propertyName: "tableTranslationKeyCellChildTemplate", first: true, predicate: ["tableTranslationKeyCell"], descendants: true }, { propertyName: "gridItemSubtitleLinesChildTemplate", first: true, predicate: ["gridItemSubtitleLines"], descendants: true }, { propertyName: "listItemSubtitleLinesChildTemplate", first: true, predicate: ["listItemSubtitleLines"], descendants: true }, { propertyName: "gridItemChildTemplate", first: true, predicate: ["gridItem"], descendants: true }, { propertyName: "listItemChildTemplate", first: true, predicate: ["listItem"], descendants: true }, { propertyName: "tableRelativeDateCellChildTemplate", first: true, predicate: ["tableRelativeDateCell"], descendants: true }], viewQueries: [{ propertyName: "listGrid", first: true, predicate: DataListGridComponent, descendants: true }, { propertyName: "dataTable", first: true, predicate: DataTableComponent, descendants: true }], ngImport: i0, template: "<div *ngIf=\"layout !== 'table'\">\n  <ocx-data-list-grid\n    #ocxdatalistgrid\n    [name]=\"name\"\n    [data]=\"data\"\n    [columns]=\"columns\"\n    [filters]=\"filters\"\n    [sortDirection]=\"sortDirection\"\n    [sortField]=\"sortField\"\n    [sortStates]=\"sortStates\"\n    [clientSideFiltering]=\"clientSideFiltering\"\n    [clientSideSorting]=\"clientSideSorting\"\n    [titleLineId]=\"titleLineId || firstColumnId\"\n    [subtitleLineIds]=\"subtitleLineIds\"\n    [clientSideSorting]=\"true\"\n    [pageSizes]=\"pageSizes\"\n    [pageSize]=\"pageSize\"\n    [paginator]=\"listGridPaginator\"\n    [page]=\"page\"\n    (pageChanged)=\"onPageChange($event)\"\n    [emptyResultsMessage]=\"emptyResultsMessage\"\n    [layout]=\"layout\"\n    [deletePermission]=\"deletePermission\"\n    [editPermission]=\"editPermission\"\n    [viewPermission]=\"viewPermission\"\n    [deleteActionEnabledField]=\"deleteActionEnabledField\"\n    [deleteActionVisibleField]=\"deleteActionVisibleField\"\n    [editActionEnabledField]=\"editActionEnabledField\"\n    [editActionVisibleField]=\"editActionVisibleField\"\n    [viewActionEnabledField]=\"viewActionEnabledField\"\n    [viewActionVisibleField]=\"viewActionVisibleField\"\n    [additionalActions]=\"additionalActions\"\n    [gridItemSubtitleLinesTemplate]=\"_gridItemSubtitleLines ? gridItemSubtitleLines : undefined\"\n    [listItemSubtitleLinesTemplate]=\"_listItemSubtitleLines ? listItemSubtitleLines : undefined\"\n    [listItemTemplate]=\"_listItem ? listItem : undefined\"\n    [gridItemTemplate]=\"_gridItem ? gridItem  : undefined\"\n    [totalRecordsOnServer]=\"totalRecordsOnServer\"\n  >\n  </ocx-data-list-grid>\n  <ng-template #listItemSubtitleLines let-item>\n    <ng-container\n      *ngIf=\"_listItemSubtitleLines\"\n      [ngTemplateOutlet]=\"_listItemSubtitleLines\"\n      [ngTemplateOutletContext]=\"{$implicit:item}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #gridItemSubtitleLines let-item>\n    <ng-container\n      *ngIf=\"_gridItemSubtitleLines\"\n      [ngTemplateOutlet]=\"_gridItemSubtitleLines\"\n      [ngTemplateOutletContext]=\"{$implicit:item}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #gridItem let-item>\n    <ng-container *ngIf=\"_gridItem\" [ngTemplateOutlet]=\"_gridItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n    </ng-container\n  ></ng-template>\n  <ng-template #listItem let-item>\n    <ng-container *ngIf=\"_listItem\" [ngTemplateOutlet]=\"_listItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n    </ng-container\n  ></ng-template>\n</div>\n\n<div *ngIf=\"layout === 'table'\">\n  <ocx-data-table\n    #ocxdatatable\n    [rows]=\"data\"\n    [columns]=\"columns\"\n    [filters]=\"filters\"\n    [sortDirection]=\"sortDirection\"\n    [sortColumn]=\"sortField\"\n    [sortStates]=\"sortStates\"\n    [clientSideFiltering]=\"clientSideFiltering\"\n    [clientSideSorting]=\"clientSideSorting\"\n    [pageSizes]=\"pageSizes\"\n    [pageSize]=\"pageSize\"\n    [paginator]=\"tablePaginator\"\n    [page]=\"page\"\n    (pageChanged)=\"onPageChange($event)\"\n    [selectedRows]=\"selectedRows\"\n    [frozenActionColumn]=\"frozenActionColumn\"\n    [actionColumnPosition]=\"actionColumnPosition\"\n    [emptyResultsMessage]=\"emptyResultsMessage\"\n    [name]=\"name\"\n    [deletePermission]=\"deletePermission\"\n    [editPermission]=\"editPermission\"\n    [viewPermission]=\"viewPermission\"\n    [deleteActionEnabledField]=\"deleteActionEnabledField\"\n    [deleteActionVisibleField]=\"deleteActionVisibleField\"\n    [editActionEnabledField]=\"editActionEnabledField\"\n    [editActionVisibleField]=\"editActionVisibleField\"\n    [viewActionEnabledField]=\"viewActionEnabledField\"\n    [viewActionVisibleField]=\"viewActionVisibleField\"\n    [additionalActions]=\"additionalActions\"\n    [stringCellTemplate]=\"_stringTableCell ? stringCell : undefined\"\n    [numberCellTemplate]=\"_numberTableCell ? numberCell : undefined\"\n    [customCellTemplate]=\"_customTableCell ? customCell : undefined\"\n    [dateCellTemplate]=\"_tableDateCell ? dateCell : undefined\"\n    [relativeDateCellTemplate]=\"_tableRelativeDateCell ? relativeDateCell : undefined\"\n    [cellTemplate]=\"_tableCell ? cell : undefined\"\n    [translationKeyCellTemplate]=\"_tableTranslationKeyCell ? translationKeyCell : undefined\"\n    (sorted)=\"sorting($event)\"\n    (filtered)=\"filtering($event)\"\n    [totalRecordsOnServer]=\"totalRecordsOnServer\"\n    [currentPageShowingKey]=\"currentPageShowingKey\"\n    [currentPageShowingWithTotalOnServerKey]=\"currentPageShowingWithTotalOnServerKey\"\n  >\n  </ocx-data-table>\n  <ng-template #stringCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_stringTableCell\"\n      [ngTemplateOutlet]=\"_stringTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #numberCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_numberTableCell\"\n      [ngTemplateOutlet]=\"_numberTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #customCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_customTableCell\"\n      [ngTemplateOutlet]=\"_customTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #dateCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_tableDateCell\"\n      [ngTemplateOutlet]=\"_tableDateCell\"\n      [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #relativeDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_tableRelativeDateCell\"\n      [ngTemplateOutlet]=\"_tableRelativeDateCell\"\n      [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #cell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_tableCell\"\n      [ngTemplateOutlet]=\"_tableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #translationKeyCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_tableTranslationKeyCell\"\n      [ngTemplateOutlet]=\"_tableTranslationKeyCell\"\n      [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DataListGridComponent, selector: "ocx-data-list-grid", inputs: ["titleLineId", "subtitleLineIds", "clientSideSorting", "clientSideFiltering", "sortStates", "pageSizes", "pageSize", "emptyResultsMessage", "fallbackImage", "layout", "viewPermission", "editPermission", "deletePermission", "deleteActionVisibleField", "deleteActionEnabledField", "viewActionVisibleField", "viewActionEnabledField", "editActionVisibleField", "editActionEnabledField", "viewMenuItemKey", "editMenuItemKey", "deleteMenuItemKey", "paginator", "page", "columns", "name", "totalRecordsOnServer", "currentPageShowingKey", "currentPageShowingWithTotalOnServerKey", "data", "filters", "sortDirection", "sortField", "gridItemSubtitleLinesTemplate", "listItemSubtitleLinesTemplate", "listItemTemplate", "gridItemTemplate", "additionalActions"], outputs: ["viewItem", "editItem", "deleteItem", "pageChanged"] }, { kind: "component", type: DataTableComponent, selector: "ocx-data-table", inputs: ["rows", "selectedRows", "filters", "sortDirection", "sortColumn", "columns", "clientSideFiltering", "clientSideSorting", "sortStates", "pageSizes", "pageSize", "emptyResultsMessage", "name", "deletePermission", "viewPermission", "editPermission", "deleteActionVisibleField", "deleteActionEnabledField", "viewActionVisibleField", "viewActionEnabledField", "editActionVisibleField", "editActionEnabledField", "paginator", "page", "totalRecordsOnServer", "currentPageShowingKey", "currentPageShowingWithTotalOnServerKey", "stringCellTemplate", "numberCellTemplate", "customCellTemplate", "dateCellTemplate", "relativeDateCellTemplate", "cellTemplate", "translationKeyCellTemplate", "additionalActions", "frozenActionColumn", "actionColumnPosition"], outputs: ["filtered", "sorted", "viewTableRow", "editTableRow", "deleteTableRow", "selectionChanged", "pageChanged"] }] });
+DataViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DataViewComponent, selector: "ocx-data-view", inputs: { deletePermission: "deletePermission", editPermission: "editPermission", viewPermission: "viewPermission", deleteActionVisibleField: "deleteActionVisibleField", deleteActionEnabledField: "deleteActionEnabledField", viewActionVisibleField: "viewActionVisibleField", viewActionEnabledField: "viewActionEnabledField", editActionVisibleField: "editActionVisibleField", editActionEnabledField: "editActionEnabledField", data: "data", name: "name", titleLineId: "titleLineId", subtitleLineIds: "subtitleLineIds", layout: "layout", columns: "columns", emptyResultsMessage: "emptyResultsMessage", clientSideSorting: "clientSideSorting", clientSideFiltering: "clientSideFiltering", fallbackImage: "fallbackImage", filters: "filters", sortField: "sortField", sortDirection: "sortDirection", listGridPaginator: "listGridPaginator", tablePaginator: "tablePaginator", page: "page", totalRecordsOnServer: "totalRecordsOnServer", currentPageShowingKey: "currentPageShowingKey", currentPageShowingWithTotalOnServerKey: "currentPageShowingWithTotalOnServerKey", selectedRows: "selectedRows", frozenActionColumn: "frozenActionColumn", actionColumnPosition: "actionColumnPosition", paginator: "paginator", sortStates: "sortStates", pageSizes: "pageSizes", pageSize: "pageSize", stringTableCellTemplate: "stringTableCellTemplate", numberTableCellTemplate: "numberTableCellTemplate", customTableCellTemplate: "customTableCellTemplate", dateTableCellTemplate: "dateTableCellTemplate", tableDateCellTemplate: "tableDateCellTemplate", tableCellTemplate: "tableCellTemplate", translationKeyTableCellTemplate: "translationKeyTableCellTemplate", tableTranslationKeyCellTemplate: "tableTranslationKeyCellTemplate", gridItemSubtitleLinesTemplate: "gridItemSubtitleLinesTemplate", listItemSubtitleLinesTemplate: "listItemSubtitleLinesTemplate", gridItemTemplate: "gridItemTemplate", listItemTemplate: "listItemTemplate", relativeDateTableCellTemplate: "relativeDateTableCellTemplate", tableRelativeDateCellTemplate: "tableRelativeDateCellTemplate", additionalActions: "additionalActions" }, outputs: { filtered: "filtered", sorted: "sorted", deleteItem: "deleteItem", viewItem: "viewItem", editItem: "editItem", selectionChanged: "selectionChanged", pageChanged: "pageChanged" }, providers: [{ provide: 'DataViewComponent', useExisting: DataViewComponent }], queries: [{ propertyName: "stringTableCellChildTemplate", first: true, predicate: ["stringTableCell"], descendants: true }, { propertyName: "numberTableCellChildTemplate", first: true, predicate: ["numberTableCell"], descendants: true }, { propertyName: "customTableCellChildTemplate", first: true, predicate: ["customTableCell"], descendants: true }, { propertyName: "tableDateCellChildTemplate", first: true, predicate: ["tableDateCell"], descendants: true }, { propertyName: "dateTableCellChildTemplate", first: true, predicate: ["dateTableCell"], descendants: true }, { propertyName: "tableCellChildTemplate", first: true, predicate: ["tableCell"], descendants: true }, { propertyName: "tableTranslationKeyCellChildTemplate", first: true, predicate: ["tableTranslationKeyCell"], descendants: true }, { propertyName: "translationKeyTableCellChildTemplate", first: true, predicate: ["translationKeyTableCell"], descendants: true }, { propertyName: "gridItemSubtitleLinesChildTemplate", first: true, predicate: ["gridItemSubtitleLines"], descendants: true }, { propertyName: "listItemSubtitleLinesChildTemplate", first: true, predicate: ["listItemSubtitleLines"], descendants: true }, { propertyName: "gridItemChildTemplate", first: true, predicate: ["gridItem"], descendants: true }, { propertyName: "listItemChildTemplate", first: true, predicate: ["listItem"], descendants: true }, { propertyName: "tableRelativeDateCellChildTemplate", first: true, predicate: ["tableRelativeDateCell"], descendants: true }, { propertyName: "relativeDateTableCellChildTemplate", first: true, predicate: ["relativeDateTableCell"], descendants: true }], viewQueries: [{ propertyName: "listGrid", first: true, predicate: DataListGridComponent, descendants: true }, { propertyName: "dataTable", first: true, predicate: DataTableComponent, descendants: true }], ngImport: i0, template: "<div *ngIf=\"layout !== 'table'\">\n  <ocx-data-list-grid\n    #ocxdatalistgrid\n    [name]=\"name\"\n    [data]=\"data\"\n    [columns]=\"columns\"\n    [filters]=\"filters\"\n    [sortDirection]=\"sortDirection\"\n    [sortField]=\"sortField\"\n    [sortStates]=\"sortStates\"\n    [clientSideFiltering]=\"clientSideFiltering\"\n    [clientSideSorting]=\"clientSideSorting\"\n    [titleLineId]=\"titleLineId || firstColumnId\"\n    [subtitleLineIds]=\"subtitleLineIds\"\n    [clientSideSorting]=\"true\"\n    [pageSizes]=\"pageSizes\"\n    [pageSize]=\"pageSize\"\n    [paginator]=\"listGridPaginator\"\n    [page]=\"page\"\n    (pageChanged)=\"onPageChange($event)\"\n    [emptyResultsMessage]=\"emptyResultsMessage\"\n    [layout]=\"layout\"\n    [deletePermission]=\"deletePermission\"\n    [editPermission]=\"editPermission\"\n    [viewPermission]=\"viewPermission\"\n    [deleteActionEnabledField]=\"deleteActionEnabledField\"\n    [deleteActionVisibleField]=\"deleteActionVisibleField\"\n    [editActionEnabledField]=\"editActionEnabledField\"\n    [editActionVisibleField]=\"editActionVisibleField\"\n    [viewActionEnabledField]=\"viewActionEnabledField\"\n    [viewActionVisibleField]=\"viewActionVisibleField\"\n    [additionalActions]=\"additionalActions\"\n    [gridItemSubtitleLinesTemplate]=\"_gridItemSubtitleLines ? gridItemSubtitleLines : undefined\"\n    [listItemSubtitleLinesTemplate]=\"_listItemSubtitleLines ? listItemSubtitleLines : undefined\"\n    [listItemTemplate]=\"_listItem ? listItem : undefined\"\n    [gridItemTemplate]=\"_gridItem ? gridItem  : undefined\"\n    [totalRecordsOnServer]=\"totalRecordsOnServer\"\n  >\n  </ocx-data-list-grid>\n  <ng-template #listItemSubtitleLines let-item>\n    <ng-container\n      *ngIf=\"_listItemSubtitleLines\"\n      [ngTemplateOutlet]=\"_listItemSubtitleLines\"\n      [ngTemplateOutletContext]=\"{$implicit:item}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #gridItemSubtitleLines let-item>\n    <ng-container\n      *ngIf=\"_gridItemSubtitleLines\"\n      [ngTemplateOutlet]=\"_gridItemSubtitleLines\"\n      [ngTemplateOutletContext]=\"{$implicit:item}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #gridItem let-item>\n    <ng-container *ngIf=\"_gridItem\" [ngTemplateOutlet]=\"_gridItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n    </ng-container\n  ></ng-template>\n  <ng-template #listItem let-item>\n    <ng-container *ngIf=\"_listItem\" [ngTemplateOutlet]=\"_listItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n    </ng-container\n  ></ng-template>\n</div>\n\n<div *ngIf=\"layout === 'table'\">\n  <ocx-data-table\n    #ocxdatatable\n    [rows]=\"data\"\n    [columns]=\"columns\"\n    [filters]=\"filters\"\n    [sortDirection]=\"sortDirection\"\n    [sortColumn]=\"sortField\"\n    [sortStates]=\"sortStates\"\n    [clientSideFiltering]=\"clientSideFiltering\"\n    [clientSideSorting]=\"clientSideSorting\"\n    [pageSizes]=\"pageSizes\"\n    [pageSize]=\"pageSize\"\n    [paginator]=\"tablePaginator\"\n    [page]=\"page\"\n    (pageChanged)=\"onPageChange($event)\"\n    [selectedRows]=\"selectedRows\"\n    [frozenActionColumn]=\"frozenActionColumn\"\n    [actionColumnPosition]=\"actionColumnPosition\"\n    [emptyResultsMessage]=\"emptyResultsMessage\"\n    [name]=\"name\"\n    [deletePermission]=\"deletePermission\"\n    [editPermission]=\"editPermission\"\n    [viewPermission]=\"viewPermission\"\n    [deleteActionEnabledField]=\"deleteActionEnabledField\"\n    [deleteActionVisibleField]=\"deleteActionVisibleField\"\n    [editActionEnabledField]=\"editActionEnabledField\"\n    [editActionVisibleField]=\"editActionVisibleField\"\n    [viewActionEnabledField]=\"viewActionEnabledField\"\n    [viewActionVisibleField]=\"viewActionVisibleField\"\n    [additionalActions]=\"additionalActions\"\n    [stringCellTemplate]=\"_stringTableCell ? stringCell : undefined\"\n    [numberCellTemplate]=\"_numberTableCell ? numberCell : undefined\"\n    [customCellTemplate]=\"_customTableCell ? customCell : undefined\"\n    [dateCellTemplate]=\"_tableDateCell ? dateCell : undefined\"\n    [relativeDateCellTemplate]=\"_tableRelativeDateCell ? relativeDateCell : undefined\"\n    [cellTemplate]=\"_tableCell ? cell : undefined\"\n    [translationKeyCellTemplate]=\"_tableTranslationKeyCell ? translationKeyCell : undefined\"\n    (sorted)=\"sorting($event)\"\n    (filtered)=\"filtering($event)\"\n    [totalRecordsOnServer]=\"totalRecordsOnServer\"\n    [currentPageShowingKey]=\"currentPageShowingKey\"\n    [currentPageShowingWithTotalOnServerKey]=\"currentPageShowingWithTotalOnServerKey\"\n  >\n  </ocx-data-table>\n  <ng-template #stringCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_stringTableCell\"\n      [ngTemplateOutlet]=\"_stringTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #numberCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_numberTableCell\"\n      [ngTemplateOutlet]=\"_numberTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #customCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_customTableCell\"\n      [ngTemplateOutlet]=\"_customTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #dateCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_dateTableCell\"\n      [ngTemplateOutlet]=\"_dateTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #relativeDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_relativeDateTableCell\"\n      [ngTemplateOutlet]=\"_relativeDateTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #cell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_tableCell\"\n      [ngTemplateOutlet]=\"_tableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #translationKeyCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_translationKeyTableCell\"\n      [ngTemplateOutlet]=\"_translationKeyTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DataListGridComponent, selector: "ocx-data-list-grid", inputs: ["titleLineId", "subtitleLineIds", "clientSideSorting", "clientSideFiltering", "sortStates", "pageSizes", "pageSize", "emptyResultsMessage", "fallbackImage", "layout", "viewPermission", "editPermission", "deletePermission", "deleteActionVisibleField", "deleteActionEnabledField", "viewActionVisibleField", "viewActionEnabledField", "editActionVisibleField", "editActionEnabledField", "viewMenuItemKey", "editMenuItemKey", "deleteMenuItemKey", "paginator", "page", "columns", "name", "totalRecordsOnServer", "currentPageShowingKey", "currentPageShowingWithTotalOnServerKey", "data", "filters", "sortDirection", "sortField", "gridItemSubtitleLinesTemplate", "listItemSubtitleLinesTemplate", "listItemTemplate", "gridItemTemplate", "additionalActions"], outputs: ["viewItem", "editItem", "deleteItem", "pageChanged"] }, { kind: "component", type: DataTableComponent, selector: "ocx-data-table", inputs: ["rows", "selectedRows", "filters", "sortDirection", "sortColumn", "columns", "clientSideFiltering", "clientSideSorting", "sortStates", "pageSizes", "pageSize", "emptyResultsMessage", "name", "deletePermission", "viewPermission", "editPermission", "deleteActionVisibleField", "deleteActionEnabledField", "viewActionVisibleField", "viewActionEnabledField", "editActionVisibleField", "editActionEnabledField", "paginator", "page", "totalRecordsOnServer", "currentPageShowingKey", "currentPageShowingWithTotalOnServerKey", "stringCellTemplate", "numberCellTemplate", "customCellTemplate", "dateCellTemplate", "relativeDateCellTemplate", "cellTemplate", "translationKeyCellTemplate", "additionalActions", "frozenActionColumn", "actionColumnPosition"], outputs: ["filtered", "sorted", "viewTableRow", "editTableRow", "deleteTableRow", "selectionChanged", "pageChanged"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DataViewComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ocx-data-view', providers: [{ provide: 'DataViewComponent', useExisting: DataViewComponent }], template: "<div *ngIf=\"layout !== 'table'\">\n  <ocx-data-list-grid\n    #ocxdatalistgrid\n    [name]=\"name\"\n    [data]=\"data\"\n    [columns]=\"columns\"\n    [filters]=\"filters\"\n    [sortDirection]=\"sortDirection\"\n    [sortField]=\"sortField\"\n    [sortStates]=\"sortStates\"\n    [clientSideFiltering]=\"clientSideFiltering\"\n    [clientSideSorting]=\"clientSideSorting\"\n    [titleLineId]=\"titleLineId || firstColumnId\"\n    [subtitleLineIds]=\"subtitleLineIds\"\n    [clientSideSorting]=\"true\"\n    [pageSizes]=\"pageSizes\"\n    [pageSize]=\"pageSize\"\n    [paginator]=\"listGridPaginator\"\n    [page]=\"page\"\n    (pageChanged)=\"onPageChange($event)\"\n    [emptyResultsMessage]=\"emptyResultsMessage\"\n    [layout]=\"layout\"\n    [deletePermission]=\"deletePermission\"\n    [editPermission]=\"editPermission\"\n    [viewPermission]=\"viewPermission\"\n    [deleteActionEnabledField]=\"deleteActionEnabledField\"\n    [deleteActionVisibleField]=\"deleteActionVisibleField\"\n    [editActionEnabledField]=\"editActionEnabledField\"\n    [editActionVisibleField]=\"editActionVisibleField\"\n    [viewActionEnabledField]=\"viewActionEnabledField\"\n    [viewActionVisibleField]=\"viewActionVisibleField\"\n    [additionalActions]=\"additionalActions\"\n    [gridItemSubtitleLinesTemplate]=\"_gridItemSubtitleLines ? gridItemSubtitleLines : undefined\"\n    [listItemSubtitleLinesTemplate]=\"_listItemSubtitleLines ? listItemSubtitleLines : undefined\"\n    [listItemTemplate]=\"_listItem ? listItem : undefined\"\n    [gridItemTemplate]=\"_gridItem ? gridItem  : undefined\"\n    [totalRecordsOnServer]=\"totalRecordsOnServer\"\n  >\n  </ocx-data-list-grid>\n  <ng-template #listItemSubtitleLines let-item>\n    <ng-container\n      *ngIf=\"_listItemSubtitleLines\"\n      [ngTemplateOutlet]=\"_listItemSubtitleLines\"\n      [ngTemplateOutletContext]=\"{$implicit:item}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #gridItemSubtitleLines let-item>\n    <ng-container\n      *ngIf=\"_gridItemSubtitleLines\"\n      [ngTemplateOutlet]=\"_gridItemSubtitleLines\"\n      [ngTemplateOutletContext]=\"{$implicit:item}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #gridItem let-item>\n    <ng-container *ngIf=\"_gridItem\" [ngTemplateOutlet]=\"_gridItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n    </ng-container\n  ></ng-template>\n  <ng-template #listItem let-item>\n    <ng-container *ngIf=\"_listItem\" [ngTemplateOutlet]=\"_listItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n    </ng-container\n  ></ng-template>\n</div>\n\n<div *ngIf=\"layout === 'table'\">\n  <ocx-data-table\n    #ocxdatatable\n    [rows]=\"data\"\n    [columns]=\"columns\"\n    [filters]=\"filters\"\n    [sortDirection]=\"sortDirection\"\n    [sortColumn]=\"sortField\"\n    [sortStates]=\"sortStates\"\n    [clientSideFiltering]=\"clientSideFiltering\"\n    [clientSideSorting]=\"clientSideSorting\"\n    [pageSizes]=\"pageSizes\"\n    [pageSize]=\"pageSize\"\n    [paginator]=\"tablePaginator\"\n    [page]=\"page\"\n    (pageChanged)=\"onPageChange($event)\"\n    [selectedRows]=\"selectedRows\"\n    [frozenActionColumn]=\"frozenActionColumn\"\n    [actionColumnPosition]=\"actionColumnPosition\"\n    [emptyResultsMessage]=\"emptyResultsMessage\"\n    [name]=\"name\"\n    [deletePermission]=\"deletePermission\"\n    [editPermission]=\"editPermission\"\n    [viewPermission]=\"viewPermission\"\n    [deleteActionEnabledField]=\"deleteActionEnabledField\"\n    [deleteActionVisibleField]=\"deleteActionVisibleField\"\n    [editActionEnabledField]=\"editActionEnabledField\"\n    [editActionVisibleField]=\"editActionVisibleField\"\n    [viewActionEnabledField]=\"viewActionEnabledField\"\n    [viewActionVisibleField]=\"viewActionVisibleField\"\n    [additionalActions]=\"additionalActions\"\n    [stringCellTemplate]=\"_stringTableCell ? stringCell : undefined\"\n    [numberCellTemplate]=\"_numberTableCell ? numberCell : undefined\"\n    [customCellTemplate]=\"_customTableCell ? customCell : undefined\"\n    [dateCellTemplate]=\"_tableDateCell ? dateCell : undefined\"\n    [relativeDateCellTemplate]=\"_tableRelativeDateCell ? relativeDateCell : undefined\"\n    [cellTemplate]=\"_tableCell ? cell : undefined\"\n    [translationKeyCellTemplate]=\"_tableTranslationKeyCell ? translationKeyCell : undefined\"\n    (sorted)=\"sorting($event)\"\n    (filtered)=\"filtering($event)\"\n    [totalRecordsOnServer]=\"totalRecordsOnServer\"\n    [currentPageShowingKey]=\"currentPageShowingKey\"\n    [currentPageShowingWithTotalOnServerKey]=\"currentPageShowingWithTotalOnServerKey\"\n  >\n  </ocx-data-table>\n  <ng-template #stringCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_stringTableCell\"\n      [ngTemplateOutlet]=\"_stringTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #numberCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_numberTableCell\"\n      [ngTemplateOutlet]=\"_numberTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #customCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_customTableCell\"\n      [ngTemplateOutlet]=\"_customTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #dateCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_tableDateCell\"\n      [ngTemplateOutlet]=\"_tableDateCell\"\n      [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #relativeDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_tableRelativeDateCell\"\n      [ngTemplateOutlet]=\"_tableRelativeDateCell\"\n      [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #cell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_tableCell\"\n      [ngTemplateOutlet]=\"_tableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #translationKeyCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_tableTranslationKeyCell\"\n      [ngTemplateOutlet]=\"_tableTranslationKeyCell\"\n      [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n</div>\n" }]
+            args: [{ selector: 'ocx-data-view', providers: [{ provide: 'DataViewComponent', useExisting: DataViewComponent }], template: "<div *ngIf=\"layout !== 'table'\">\n  <ocx-data-list-grid\n    #ocxdatalistgrid\n    [name]=\"name\"\n    [data]=\"data\"\n    [columns]=\"columns\"\n    [filters]=\"filters\"\n    [sortDirection]=\"sortDirection\"\n    [sortField]=\"sortField\"\n    [sortStates]=\"sortStates\"\n    [clientSideFiltering]=\"clientSideFiltering\"\n    [clientSideSorting]=\"clientSideSorting\"\n    [titleLineId]=\"titleLineId || firstColumnId\"\n    [subtitleLineIds]=\"subtitleLineIds\"\n    [clientSideSorting]=\"true\"\n    [pageSizes]=\"pageSizes\"\n    [pageSize]=\"pageSize\"\n    [paginator]=\"listGridPaginator\"\n    [page]=\"page\"\n    (pageChanged)=\"onPageChange($event)\"\n    [emptyResultsMessage]=\"emptyResultsMessage\"\n    [layout]=\"layout\"\n    [deletePermission]=\"deletePermission\"\n    [editPermission]=\"editPermission\"\n    [viewPermission]=\"viewPermission\"\n    [deleteActionEnabledField]=\"deleteActionEnabledField\"\n    [deleteActionVisibleField]=\"deleteActionVisibleField\"\n    [editActionEnabledField]=\"editActionEnabledField\"\n    [editActionVisibleField]=\"editActionVisibleField\"\n    [viewActionEnabledField]=\"viewActionEnabledField\"\n    [viewActionVisibleField]=\"viewActionVisibleField\"\n    [additionalActions]=\"additionalActions\"\n    [gridItemSubtitleLinesTemplate]=\"_gridItemSubtitleLines ? gridItemSubtitleLines : undefined\"\n    [listItemSubtitleLinesTemplate]=\"_listItemSubtitleLines ? listItemSubtitleLines : undefined\"\n    [listItemTemplate]=\"_listItem ? listItem : undefined\"\n    [gridItemTemplate]=\"_gridItem ? gridItem  : undefined\"\n    [totalRecordsOnServer]=\"totalRecordsOnServer\"\n  >\n  </ocx-data-list-grid>\n  <ng-template #listItemSubtitleLines let-item>\n    <ng-container\n      *ngIf=\"_listItemSubtitleLines\"\n      [ngTemplateOutlet]=\"_listItemSubtitleLines\"\n      [ngTemplateOutletContext]=\"{$implicit:item}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #gridItemSubtitleLines let-item>\n    <ng-container\n      *ngIf=\"_gridItemSubtitleLines\"\n      [ngTemplateOutlet]=\"_gridItemSubtitleLines\"\n      [ngTemplateOutletContext]=\"{$implicit:item}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #gridItem let-item>\n    <ng-container *ngIf=\"_gridItem\" [ngTemplateOutlet]=\"_gridItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n    </ng-container\n  ></ng-template>\n  <ng-template #listItem let-item>\n    <ng-container *ngIf=\"_listItem\" [ngTemplateOutlet]=\"_listItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n    </ng-container\n  ></ng-template>\n</div>\n\n<div *ngIf=\"layout === 'table'\">\n  <ocx-data-table\n    #ocxdatatable\n    [rows]=\"data\"\n    [columns]=\"columns\"\n    [filters]=\"filters\"\n    [sortDirection]=\"sortDirection\"\n    [sortColumn]=\"sortField\"\n    [sortStates]=\"sortStates\"\n    [clientSideFiltering]=\"clientSideFiltering\"\n    [clientSideSorting]=\"clientSideSorting\"\n    [pageSizes]=\"pageSizes\"\n    [pageSize]=\"pageSize\"\n    [paginator]=\"tablePaginator\"\n    [page]=\"page\"\n    (pageChanged)=\"onPageChange($event)\"\n    [selectedRows]=\"selectedRows\"\n    [frozenActionColumn]=\"frozenActionColumn\"\n    [actionColumnPosition]=\"actionColumnPosition\"\n    [emptyResultsMessage]=\"emptyResultsMessage\"\n    [name]=\"name\"\n    [deletePermission]=\"deletePermission\"\n    [editPermission]=\"editPermission\"\n    [viewPermission]=\"viewPermission\"\n    [deleteActionEnabledField]=\"deleteActionEnabledField\"\n    [deleteActionVisibleField]=\"deleteActionVisibleField\"\n    [editActionEnabledField]=\"editActionEnabledField\"\n    [editActionVisibleField]=\"editActionVisibleField\"\n    [viewActionEnabledField]=\"viewActionEnabledField\"\n    [viewActionVisibleField]=\"viewActionVisibleField\"\n    [additionalActions]=\"additionalActions\"\n    [stringCellTemplate]=\"_stringTableCell ? stringCell : undefined\"\n    [numberCellTemplate]=\"_numberTableCell ? numberCell : undefined\"\n    [customCellTemplate]=\"_customTableCell ? customCell : undefined\"\n    [dateCellTemplate]=\"_tableDateCell ? dateCell : undefined\"\n    [relativeDateCellTemplate]=\"_tableRelativeDateCell ? relativeDateCell : undefined\"\n    [cellTemplate]=\"_tableCell ? cell : undefined\"\n    [translationKeyCellTemplate]=\"_tableTranslationKeyCell ? translationKeyCell : undefined\"\n    (sorted)=\"sorting($event)\"\n    (filtered)=\"filtering($event)\"\n    [totalRecordsOnServer]=\"totalRecordsOnServer\"\n    [currentPageShowingKey]=\"currentPageShowingKey\"\n    [currentPageShowingWithTotalOnServerKey]=\"currentPageShowingWithTotalOnServerKey\"\n  >\n  </ocx-data-table>\n  <ng-template #stringCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_stringTableCell\"\n      [ngTemplateOutlet]=\"_stringTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #numberCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_numberTableCell\"\n      [ngTemplateOutlet]=\"_numberTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #customCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_customTableCell\"\n      [ngTemplateOutlet]=\"_customTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #dateCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_dateTableCell\"\n      [ngTemplateOutlet]=\"_dateTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #relativeDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_relativeDateTableCell\"\n      [ngTemplateOutlet]=\"_relativeDateTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #cell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_tableCell\"\n      [ngTemplateOutlet]=\"_tableCell\"\n      [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n  <ng-template #translationKeyCell let-rowObject=\"rowObject\" let-column=\"column\">\n    <ng-container\n      *ngIf=\"_translationKeyTableCell\"\n      [ngTemplateOutlet]=\"_translationKeyTableCell\"\n      [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n    >\n    </ng-container\n  ></ng-template>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { listGrid: [{
                 type: ViewChild,
                 args: [DataListGridComponent]
@@ -2378,21 +2405,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
             }], customTableCellChildTemplate: [{
                 type: ContentChild,
                 args: ['customTableCell']
+            }], dateTableCellTemplate: [{
+                type: Input
             }], tableDateCellTemplate: [{
                 type: Input
             }], tableDateCellChildTemplate: [{
                 type: ContentChild,
                 args: ['tableDateCell']
+            }], dateTableCellChildTemplate: [{
+                type: ContentChild,
+                args: ['dateTableCell']
             }], tableCellTemplate: [{
                 type: Input
             }], tableCellChildTemplate: [{
                 type: ContentChild,
                 args: ['tableCell']
+            }], translationKeyTableCellTemplate: [{
+                type: Input
             }], tableTranslationKeyCellTemplate: [{
                 type: Input
             }], tableTranslationKeyCellChildTemplate: [{
                 type: ContentChild,
                 args: ['tableTranslationKeyCell']
+            }], translationKeyTableCellChildTemplate: [{
+                type: ContentChild,
+                args: ['translationKeyTableCell']
             }], gridItemSubtitleLinesTemplate: [{
                 type: Input
             }], gridItemSubtitleLinesChildTemplate: [{
@@ -2413,11 +2450,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
             }], listItemChildTemplate: [{
                 type: ContentChild,
                 args: ['listItem']
+            }], relativeDateTableCellTemplate: [{
+                type: Input
             }], tableRelativeDateCellTemplate: [{
                 type: Input
             }], tableRelativeDateCellChildTemplate: [{
                 type: ContentChild,
                 args: ['tableRelativeDateCell']
+            }], relativeDateTableCellChildTemplate: [{
+                type: ContentChild,
+                args: ['relativeDateTableCell']
             }], additionalActions: [{
                 type: Input
             }], filtered: [{
@@ -2756,13 +2798,22 @@ class InteractiveDataViewComponent {
         return this.customTableCell;
     }
     get _tableDateCell() {
-        return this.tableDateCell;
+        return this.dateTableCell ?? this.tableDateCell;
+    }
+    get _dateTableCell() {
+        return this.dateTableCell;
     }
     get _tableRelativeDateCell() {
-        return this.tableRelativeDateCell;
+        return this.relativeDateTableCell ?? this.tableRelativeDateCell;
+    }
+    get _relativeDateTableCell() {
+        return this.relativeDateTableCell;
     }
     get _tableTranslationKeyCell() {
-        return this.tableTranslationKeyCell;
+        return this.translationKeyTableCell ?? this.tableTranslationKeyCell;
+    }
+    get _translationKeyTableCell() {
+        return this.translationKeyTableCell;
     }
     get _gridItem() {
         return this.gridItem;
@@ -2882,10 +2933,10 @@ class InteractiveDataViewComponent {
     }
 }
 InteractiveDataViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: InteractiveDataViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-InteractiveDataViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: InteractiveDataViewComponent, selector: "ocx-interactive-data-view", inputs: { deletePermission: "deletePermission", editPermission: "editPermission", viewPermission: "viewPermission", deleteActionVisibleField: "deleteActionVisibleField", deleteActionEnabledField: "deleteActionEnabledField", viewActionVisibleField: "viewActionVisibleField", viewActionEnabledField: "viewActionEnabledField", editActionVisibleField: "editActionVisibleField", editActionEnabledField: "editActionEnabledField", name: "name", titleLineId: "titleLineId", subtitleLineIds: "subtitleLineIds", supportedViewLayouts: "supportedViewLayouts", columns: "columns", emptyResultsMessage: "emptyResultsMessage", clientSideSorting: "clientSideSorting", clientSideFiltering: "clientSideFiltering", fallbackImage: "fallbackImage", filters: "filters", sortDirection: "sortDirection", sortField: "sortField", sortStates: "sortStates", pageSizes: "pageSizes", pageSize: "pageSize", totalRecordsOnServer: "totalRecordsOnServer", layout: "layout", defaultGroupKey: "defaultGroupKey", customGroupKey: "customGroupKey", groupSelectionNoGroupSelectedKey: "groupSelectionNoGroupSelectedKey", currentPageShowingKey: "currentPageShowingKey", currentPageShowingWithTotalOnServerKey: "currentPageShowingWithTotalOnServerKey", additionalActions: "additionalActions", listGridPaginator: "listGridPaginator", tablePaginator: "tablePaginator", page: "page", selectedRows: "selectedRows", displayedColumns: "displayedColumns", frozenActionColumn: "frozenActionColumn", actionColumnPosition: "actionColumnPosition", paginator: "paginator", data: "data" }, outputs: { filtered: "filtered", sorted: "sorted", deleteItem: "deleteItem", viewItem: "viewItem", editItem: "editItem", dataViewLayoutChange: "dataViewLayoutChange", displayedColumnsChange: "displayedColumnsChange", selectionChanged: "selectionChanged", pageChanged: "pageChanged" }, providers: [{ provide: 'InteractiveDataViewComponent', useExisting: InteractiveDataViewComponent }], queries: [{ propertyName: "tableCell", first: true, predicate: ["tableCell"], descendants: true }, { propertyName: "tableDateCell", first: true, predicate: ["tableDateCell"], descendants: true }, { propertyName: "tableRelativeDateCell", first: true, predicate: ["tableRelativeDateCell"], descendants: true }, { propertyName: "tableTranslationKeyCell", first: true, predicate: ["tableTranslationKeyCell"], descendants: true }, { propertyName: "gridItemSubtitleLines", first: true, predicate: ["gridItemSubtitleLines"], descendants: true }, { propertyName: "listItemSubtitleLines", first: true, predicate: ["listItemSubtitleLines"], descendants: true }, { propertyName: "stringTableCell", first: true, predicate: ["stringTableCell"], descendants: true }, { propertyName: "numberTableCell", first: true, predicate: ["numberTableCell"], descendants: true }, { propertyName: "customTableCell", first: true, predicate: ["customTableCell"], descendants: true }, { propertyName: "gridItem", first: true, predicate: ["gridItem"], descendants: true }, { propertyName: "listItem", first: true, predicate: ["listItem"], descendants: true }, { propertyName: "topCenter", first: true, predicate: ["topCenter"], descendants: true }], viewQueries: [{ propertyName: "dataView", first: true, predicate: DataViewComponent, descendants: true }], ngImport: i0, template: "<div class=\"p-3 border-bottom-1 surface-border\">\n  <div class=\"flex flex-wrap justify-content-between align-items-center py-1 gap-2\">\n    <ocx-data-layout-selection\n      [supportedViewLayouts]=\"supportedViewLayouts\"\n      [layout]=\"layout\"\n      (dataViewLayoutChange)=\"onDataViewLayoutChange($event)\"\n    ></ocx-data-layout-selection>\n\n    <div *ngIf=\"topCenter\">\n      <ng-container [ngTemplateOutlet]=\"topCenter\"> </ng-container>\n    </div>\n\n    <div *ngIf=\"layout !== 'table'\" class=\"flex align-items-center gap-2\">\n      <ocx-data-list-grid-sorting\n        [sortDirection]=\"sortDirection\"\n        [sortField]=\"sortField\"\n        [columns]=\"columns\"\n        [sortStates]=\"sortStates\"\n        (sortChange)=\"onSortChange($event)\"\n        (sortDirectionChange)=\"onSortDirectionChange($event)\"\n      ></ocx-data-list-grid-sorting>\n    </div>\n\n    <div *ngIf=\"layout === 'table'\" class=\"flex flex-wrap justify-content-between align-items-center gap-2\">\n      <ocx-column-group-selection\n        [selectedGroupKey]=\"selectedGroupKey\"\n        [columns]=\"columns\"\n        [defaultGroupKey]=\"defaultGroupKey\"\n        [customGroupKey]=\"customGroupKey\"\n        [placeholderKey]=\"groupSelectionNoGroupSelectedKey\"\n        (groupSelectionChanged)=\"onColumnGroupSelectionChange($event)\"\n      ></ocx-column-group-selection>\n\n      <ocx-custom-group-column-selector\n        [columns]=\"columns\"\n        [displayedColumns]=\"displayedColumns\"\n        (columnSelectionChanged)=\"onColumnSelectionChange($event)\"\n        [frozenActionColumn]=\"frozenActionColumn\"\n        [actionColumnPosition]=\"actionColumnPosition\"\n        (actionColumnConfigChanged)=\"onActionColumnConfigChange($event)\"\n      ></ocx-custom-group-column-selector>\n    </div>\n  </div>\n</div>\n<div class=\"p-3\">\n  <ocx-data-view\n    [columns]=\"displayedColumns\"\n    [sortStates]=\"sortStates\"\n    [sortField]=\"sortField\"\n    [filters]=\"filters\"\n    [data]=\"data\"\n    [sortDirection]=\"sortDirection\"\n    [titleLineId]=\"titleLineId || firstColumnId\"\n    [subtitleLineIds]=\"subtitleLineIds\"\n    [clientSideSorting]=\"clientSideSorting\"\n    [clientSideFiltering]=\"clientSideFiltering\"\n    [pageSizes]=\"pageSizes\"\n    [pageSize]=\"pageSize\"\n    [emptyResultsMessage]=\"emptyResultsMessage\"\n    [layout]=\"layout\"\n    [name]=\"name\"\n    [deletePermission]=\"deletePermission\"\n    [editPermission]=\"editPermission\"\n    [viewPermission]=\"viewPermission\"\n    [deleteActionEnabledField]=\"deleteActionEnabledField\"\n    [deleteActionVisibleField]=\"deleteActionVisibleField\"\n    [editActionEnabledField]=\"editActionEnabledField\"\n    [editActionVisibleField]=\"editActionVisibleField\"\n    [viewActionEnabledField]=\"viewActionEnabledField\"\n    [viewActionVisibleField]=\"viewActionVisibleField\"\n    [additionalActions]=\"additionalActions\"\n    [listGridPaginator]=\"listGridPaginator\"\n    [tablePaginator]=\"tablePaginator\"\n    [page]=\"page\"\n    (pageChanged)=\"onPageChange($event)\"\n    [selectedRows]=\"selectedRows\"\n    [frozenActionColumn]=\"frozenActionColumn\"\n    [actionColumnPosition]=\"actionColumnPosition\"\n    [stringTableCellTemplate]=\"_stringTableCell ? stringTableCell : undefined\"\n    [numberTableCellTemplate]=\"_numberTableCell ? numberTableCell : undefined\"\n    [customTableCellTemplate]=\"_customTableCell ? customTableCell : undefined\"\n    [tableDateCellTemplate]=\"_tableDateCell ? tableDateCell : undefined\"\n    [tableRelativeDateCellTemplate]=\"_tableRelativeDateCell ? tableRelativeDateCell : undefined\"\n    [tableCellTemplate]=\"_tableCell ? tableCell : undefined\"\n    [tableTranslationKeyCellTemplate]=\"_tableTranslationKeyCell ? tableTranslationKeyCell : undefined\"\n    [gridItemSubtitleLinesTemplate]=\"_gridItemSubtitleLines ? gridItemSubtitleLines : undefined\"\n    [listItemSubtitleLinesTemplate]=\"_listItemSubtitleLines ? listItemSubtitleLines : undefined\"\n    [listItemTemplate]=\"_listItem? listItem : undefined\"\n    [gridItemTemplate]=\"_gridItem? gridItem  : undefined\"\n    (sorted)=\"sorting($event)\"\n    (filtered)=\"filtering($event)\"\n    [totalRecordsOnServer]=\"totalRecordsOnServer\"\n    [currentPageShowingKey]=\"currentPageShowingKey\"\n    [currentPageShowingWithTotalOnServerKey]=\"currentPageShowingWithTotalOnServerKey\"\n  >\n  </ocx-data-view>\n</div>\n<ng-template #stringTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_stringTableCell\"\n    [ngTemplateOutlet]=\"_stringTableCell\"\n    [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableDateCell\"\n    [ngTemplateOutlet]=\"_tableDateCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableRelativeDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableRelativeDateCell\"\n    [ngTemplateOutlet]=\"_tableRelativeDateCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableCell\"\n    [ngTemplateOutlet]=\"_tableCell\"\n    [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableTranslationKeyCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableTranslationKeyCell\"\n    [ngTemplateOutlet]=\"_tableTranslationKeyCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #gridItemSubtitleLines let-item>\n  <ng-container\n    *ngIf=\"_gridItemSubtitleLines\"\n    [ngTemplateOutlet]=\"_gridItemSubtitleLines\"\n    [ngTemplateOutletContext]=\"{$implicit:item}\"\n  >\n  </ng-container>\n</ng-template>\n<ng-template #listItemSubtitleLines let-item>\n  <ng-container\n    *ngIf=\"_listItemSubtitleLines\"\n    [ngTemplateOutlet]=\"_listItemSubtitleLines\"\n    [ngTemplateOutletContext]=\"{$implicit:item}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #gridItem let-item>\n  <ng-container *ngIf=\"_gridItem\" [ngTemplateOutlet]=\"_gridItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n  </ng-container\n></ng-template>\n<ng-template #listItem let-item>\n  <ng-container *ngIf=\"_listItem\" [ngTemplateOutlet]=\"_listItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n  </ng-container\n></ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ColumnGroupSelectionComponent, selector: "ocx-column-group-selection", inputs: ["selectedGroupKey", "columns", "placeholderKey", "defaultGroupKey", "customGroupKey"], outputs: ["groupSelectionChanged"] }, { kind: "component", type: CustomGroupColumnSelectorComponent, selector: "ocx-custom-group-column-selector", inputs: ["columns", "displayedColumns", "dialogTitle", "openButtonTitle", "saveButtonLabel", "cancelButtonLabel", "activeColumnsLabel", "inactiveColumnsLabel", "frozenActionColumn", "actionColumnPosition"], outputs: ["columnSelectionChanged", "actionColumnConfigChanged"] }, { kind: "component", type: DataLayoutSelectionComponent, selector: "ocx-data-layout-selection", inputs: ["supportedViewLayouts", "layout"], outputs: ["dataViewLayoutChange"] }, { kind: "component", type: DataListGridSortingComponent, selector: "ocx-data-list-grid-sorting", inputs: ["columns", "sortStates", "sortDirection", "sortField"], outputs: ["sortChange", "sortDirectionChange", "columnsChange"] }, { kind: "component", type: DataViewComponent, selector: "ocx-data-view", inputs: ["deletePermission", "editPermission", "viewPermission", "deleteActionVisibleField", "deleteActionEnabledField", "viewActionVisibleField", "viewActionEnabledField", "editActionVisibleField", "editActionEnabledField", "data", "name", "titleLineId", "subtitleLineIds", "layout", "columns", "emptyResultsMessage", "clientSideSorting", "clientSideFiltering", "fallbackImage", "filters", "sortField", "sortDirection", "listGridPaginator", "tablePaginator", "page", "totalRecordsOnServer", "currentPageShowingKey", "currentPageShowingWithTotalOnServerKey", "selectedRows", "frozenActionColumn", "actionColumnPosition", "paginator", "sortStates", "pageSizes", "pageSize", "stringTableCellTemplate", "numberTableCellTemplate", "customTableCellTemplate", "tableDateCellTemplate", "tableCellTemplate", "tableTranslationKeyCellTemplate", "gridItemSubtitleLinesTemplate", "listItemSubtitleLinesTemplate", "gridItemTemplate", "listItemTemplate", "tableRelativeDateCellTemplate", "additionalActions"], outputs: ["filtered", "sorted", "deleteItem", "viewItem", "editItem", "selectionChanged", "pageChanged"] }] });
+InteractiveDataViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: InteractiveDataViewComponent, selector: "ocx-interactive-data-view", inputs: { deletePermission: "deletePermission", editPermission: "editPermission", viewPermission: "viewPermission", deleteActionVisibleField: "deleteActionVisibleField", deleteActionEnabledField: "deleteActionEnabledField", viewActionVisibleField: "viewActionVisibleField", viewActionEnabledField: "viewActionEnabledField", editActionVisibleField: "editActionVisibleField", editActionEnabledField: "editActionEnabledField", name: "name", titleLineId: "titleLineId", subtitleLineIds: "subtitleLineIds", supportedViewLayouts: "supportedViewLayouts", columns: "columns", emptyResultsMessage: "emptyResultsMessage", clientSideSorting: "clientSideSorting", clientSideFiltering: "clientSideFiltering", fallbackImage: "fallbackImage", filters: "filters", sortDirection: "sortDirection", sortField: "sortField", sortStates: "sortStates", pageSizes: "pageSizes", pageSize: "pageSize", totalRecordsOnServer: "totalRecordsOnServer", layout: "layout", defaultGroupKey: "defaultGroupKey", customGroupKey: "customGroupKey", groupSelectionNoGroupSelectedKey: "groupSelectionNoGroupSelectedKey", currentPageShowingKey: "currentPageShowingKey", currentPageShowingWithTotalOnServerKey: "currentPageShowingWithTotalOnServerKey", additionalActions: "additionalActions", listGridPaginator: "listGridPaginator", tablePaginator: "tablePaginator", page: "page", selectedRows: "selectedRows", displayedColumns: "displayedColumns", frozenActionColumn: "frozenActionColumn", actionColumnPosition: "actionColumnPosition", paginator: "paginator", data: "data" }, outputs: { filtered: "filtered", sorted: "sorted", deleteItem: "deleteItem", viewItem: "viewItem", editItem: "editItem", dataViewLayoutChange: "dataViewLayoutChange", displayedColumnsChange: "displayedColumnsChange", selectionChanged: "selectionChanged", pageChanged: "pageChanged" }, providers: [{ provide: 'InteractiveDataViewComponent', useExisting: InteractiveDataViewComponent }], queries: [{ propertyName: "tableCell", first: true, predicate: ["tableCell"], descendants: true }, { propertyName: "tableDateCell", first: true, predicate: ["tableDateCell"], descendants: true }, { propertyName: "dateTableCell", first: true, predicate: ["dateTableCell"], descendants: true }, { propertyName: "tableRelativeDateCell", first: true, predicate: ["tableRelativeDateCell"], descendants: true }, { propertyName: "relativeDateTableCell", first: true, predicate: ["relativeDateTableCell"], descendants: true }, { propertyName: "tableTranslationKeyCell", first: true, predicate: ["tableTranslationKeyCell"], descendants: true }, { propertyName: "translationKeyTableCell", first: true, predicate: ["translationKeyTableCell"], descendants: true }, { propertyName: "gridItemSubtitleLines", first: true, predicate: ["gridItemSubtitleLines"], descendants: true }, { propertyName: "listItemSubtitleLines", first: true, predicate: ["listItemSubtitleLines"], descendants: true }, { propertyName: "stringTableCell", first: true, predicate: ["stringTableCell"], descendants: true }, { propertyName: "numberTableCell", first: true, predicate: ["numberTableCell"], descendants: true }, { propertyName: "customTableCell", first: true, predicate: ["customTableCell"], descendants: true }, { propertyName: "gridItem", first: true, predicate: ["gridItem"], descendants: true }, { propertyName: "listItem", first: true, predicate: ["listItem"], descendants: true }, { propertyName: "topCenter", first: true, predicate: ["topCenter"], descendants: true }], viewQueries: [{ propertyName: "dataView", first: true, predicate: DataViewComponent, descendants: true }], ngImport: i0, template: "<div class=\"p-3 border-bottom-1 surface-border\">\n  <div class=\"flex flex-wrap justify-content-between align-items-center py-1 gap-2\">\n    <ocx-data-layout-selection\n      [supportedViewLayouts]=\"supportedViewLayouts\"\n      [layout]=\"layout\"\n      (dataViewLayoutChange)=\"onDataViewLayoutChange($event)\"\n    ></ocx-data-layout-selection>\n\n    <div *ngIf=\"topCenter\">\n      <ng-container [ngTemplateOutlet]=\"topCenter\"> </ng-container>\n    </div>\n\n    <div *ngIf=\"layout !== 'table'\" class=\"flex align-items-center gap-2\">\n      <ocx-data-list-grid-sorting\n        [sortDirection]=\"sortDirection\"\n        [sortField]=\"sortField\"\n        [columns]=\"columns\"\n        [sortStates]=\"sortStates\"\n        (sortChange)=\"onSortChange($event)\"\n        (sortDirectionChange)=\"onSortDirectionChange($event)\"\n      ></ocx-data-list-grid-sorting>\n    </div>\n\n    <div *ngIf=\"layout === 'table'\" class=\"flex flex-wrap justify-content-between align-items-center gap-2\">\n      <ocx-column-group-selection\n        [selectedGroupKey]=\"selectedGroupKey\"\n        [columns]=\"columns\"\n        [defaultGroupKey]=\"defaultGroupKey\"\n        [customGroupKey]=\"customGroupKey\"\n        [placeholderKey]=\"groupSelectionNoGroupSelectedKey\"\n        (groupSelectionChanged)=\"onColumnGroupSelectionChange($event)\"\n      ></ocx-column-group-selection>\n\n      <ocx-custom-group-column-selector\n        [columns]=\"columns\"\n        [displayedColumns]=\"displayedColumns\"\n        (columnSelectionChanged)=\"onColumnSelectionChange($event)\"\n        [frozenActionColumn]=\"frozenActionColumn\"\n        [actionColumnPosition]=\"actionColumnPosition\"\n        (actionColumnConfigChanged)=\"onActionColumnConfigChange($event)\"\n      ></ocx-custom-group-column-selector>\n    </div>\n  </div>\n</div>\n<div class=\"p-3\">\n  <ocx-data-view\n    [columns]=\"displayedColumns\"\n    [sortStates]=\"sortStates\"\n    [sortField]=\"sortField\"\n    [filters]=\"filters\"\n    [data]=\"data\"\n    [sortDirection]=\"sortDirection\"\n    [titleLineId]=\"titleLineId || firstColumnId\"\n    [subtitleLineIds]=\"subtitleLineIds\"\n    [clientSideSorting]=\"clientSideSorting\"\n    [clientSideFiltering]=\"clientSideFiltering\"\n    [pageSizes]=\"pageSizes\"\n    [pageSize]=\"pageSize\"\n    [emptyResultsMessage]=\"emptyResultsMessage\"\n    [layout]=\"layout\"\n    [name]=\"name\"\n    [deletePermission]=\"deletePermission\"\n    [editPermission]=\"editPermission\"\n    [viewPermission]=\"viewPermission\"\n    [deleteActionEnabledField]=\"deleteActionEnabledField\"\n    [deleteActionVisibleField]=\"deleteActionVisibleField\"\n    [editActionEnabledField]=\"editActionEnabledField\"\n    [editActionVisibleField]=\"editActionVisibleField\"\n    [viewActionEnabledField]=\"viewActionEnabledField\"\n    [viewActionVisibleField]=\"viewActionVisibleField\"\n    [additionalActions]=\"additionalActions\"\n    [listGridPaginator]=\"listGridPaginator\"\n    [tablePaginator]=\"tablePaginator\"\n    [page]=\"page\"\n    (pageChanged)=\"onPageChange($event)\"\n    [selectedRows]=\"selectedRows\"\n    [frozenActionColumn]=\"frozenActionColumn\"\n    [actionColumnPosition]=\"actionColumnPosition\"\n    [stringTableCellTemplate]=\"_stringTableCell ? stringTableCell : undefined\"\n    [numberTableCellTemplate]=\"_numberTableCell ? numberTableCell : undefined\"\n    [customTableCellTemplate]=\"_customTableCell ? customTableCell : undefined\"\n    [dateTableCellTemplate]=\"_dateTableCell ? dateTableCell : _tableDateCell ? tableDateCell : undefined\"\n    [relativeDateTableCellTemplate]=\"_relativeDateTableCell ? relativeDateTableCell : _tableRelativeDateCell ? tableRelativeDateCell : undefined\"\n    [tableCellTemplate]=\"_tableCell ? tableCell : undefined\"\n    [translationKeyTableCellTemplate]=\"_translationKeyTableCell ? translationKeyTableCell : _tableTranslationKeyCell ? tableTranslationKeyCell : undefined\"\n    [gridItemSubtitleLinesTemplate]=\"_gridItemSubtitleLines ? gridItemSubtitleLines : undefined\"\n    [listItemSubtitleLinesTemplate]=\"_listItemSubtitleLines ? listItemSubtitleLines : undefined\"\n    [listItemTemplate]=\"_listItem? listItem : undefined\"\n    [gridItemTemplate]=\"_gridItem? gridItem  : undefined\"\n    (sorted)=\"sorting($event)\"\n    (filtered)=\"filtering($event)\"\n    [totalRecordsOnServer]=\"totalRecordsOnServer\"\n    [currentPageShowingKey]=\"currentPageShowingKey\"\n    [currentPageShowingWithTotalOnServerKey]=\"currentPageShowingWithTotalOnServerKey\"\n  >\n  </ocx-data-view>\n</div>\n<ng-template #stringTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_stringTableCell\"\n    [ngTemplateOutlet]=\"_stringTableCell\"\n    [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableDateCell\"\n    [ngTemplateOutlet]=\"_tableDateCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #dateTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_dateTableCell\"\n    [ngTemplateOutlet]=\"_dateTableCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableRelativeDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableRelativeDateCell\"\n    [ngTemplateOutlet]=\"_tableRelativeDateCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #relativeDateTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_relativeDateTableCell\"\n    [ngTemplateOutlet]=\"_relativeDateTableCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableCell\"\n    [ngTemplateOutlet]=\"_tableCell\"\n    [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableTranslationKeyCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableTranslationKeyCell\"\n    [ngTemplateOutlet]=\"_tableTranslationKeyCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #translationKeyTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_translationKeyTableCell\"\n    [ngTemplateOutlet]=\"_translationKeyTableCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #gridItemSubtitleLines let-item>\n  <ng-container\n    *ngIf=\"_gridItemSubtitleLines\"\n    [ngTemplateOutlet]=\"_gridItemSubtitleLines\"\n    [ngTemplateOutletContext]=\"{$implicit:item}\"\n  >\n  </ng-container>\n</ng-template>\n<ng-template #listItemSubtitleLines let-item>\n  <ng-container\n    *ngIf=\"_listItemSubtitleLines\"\n    [ngTemplateOutlet]=\"_listItemSubtitleLines\"\n    [ngTemplateOutletContext]=\"{$implicit:item}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #gridItem let-item>\n  <ng-container *ngIf=\"_gridItem\" [ngTemplateOutlet]=\"_gridItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n  </ng-container\n></ng-template>\n<ng-template #listItem let-item>\n  <ng-container *ngIf=\"_listItem\" [ngTemplateOutlet]=\"_listItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n  </ng-container\n></ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ColumnGroupSelectionComponent, selector: "ocx-column-group-selection", inputs: ["selectedGroupKey", "columns", "placeholderKey", "defaultGroupKey", "customGroupKey"], outputs: ["groupSelectionChanged"] }, { kind: "component", type: CustomGroupColumnSelectorComponent, selector: "ocx-custom-group-column-selector", inputs: ["columns", "displayedColumns", "dialogTitle", "openButtonTitle", "saveButtonLabel", "cancelButtonLabel", "activeColumnsLabel", "inactiveColumnsLabel", "frozenActionColumn", "actionColumnPosition"], outputs: ["columnSelectionChanged", "actionColumnConfigChanged"] }, { kind: "component", type: DataLayoutSelectionComponent, selector: "ocx-data-layout-selection", inputs: ["supportedViewLayouts", "layout"], outputs: ["dataViewLayoutChange"] }, { kind: "component", type: DataListGridSortingComponent, selector: "ocx-data-list-grid-sorting", inputs: ["columns", "sortStates", "sortDirection", "sortField"], outputs: ["sortChange", "sortDirectionChange", "columnsChange"] }, { kind: "component", type: DataViewComponent, selector: "ocx-data-view", inputs: ["deletePermission", "editPermission", "viewPermission", "deleteActionVisibleField", "deleteActionEnabledField", "viewActionVisibleField", "viewActionEnabledField", "editActionVisibleField", "editActionEnabledField", "data", "name", "titleLineId", "subtitleLineIds", "layout", "columns", "emptyResultsMessage", "clientSideSorting", "clientSideFiltering", "fallbackImage", "filters", "sortField", "sortDirection", "listGridPaginator", "tablePaginator", "page", "totalRecordsOnServer", "currentPageShowingKey", "currentPageShowingWithTotalOnServerKey", "selectedRows", "frozenActionColumn", "actionColumnPosition", "paginator", "sortStates", "pageSizes", "pageSize", "stringTableCellTemplate", "numberTableCellTemplate", "customTableCellTemplate", "dateTableCellTemplate", "tableDateCellTemplate", "tableCellTemplate", "translationKeyTableCellTemplate", "tableTranslationKeyCellTemplate", "gridItemSubtitleLinesTemplate", "listItemSubtitleLinesTemplate", "gridItemTemplate", "listItemTemplate", "relativeDateTableCellTemplate", "tableRelativeDateCellTemplate", "additionalActions"], outputs: ["filtered", "sorted", "deleteItem", "viewItem", "editItem", "selectionChanged", "pageChanged"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: InteractiveDataViewComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ocx-interactive-data-view', providers: [{ provide: 'InteractiveDataViewComponent', useExisting: InteractiveDataViewComponent }], template: "<div class=\"p-3 border-bottom-1 surface-border\">\n  <div class=\"flex flex-wrap justify-content-between align-items-center py-1 gap-2\">\n    <ocx-data-layout-selection\n      [supportedViewLayouts]=\"supportedViewLayouts\"\n      [layout]=\"layout\"\n      (dataViewLayoutChange)=\"onDataViewLayoutChange($event)\"\n    ></ocx-data-layout-selection>\n\n    <div *ngIf=\"topCenter\">\n      <ng-container [ngTemplateOutlet]=\"topCenter\"> </ng-container>\n    </div>\n\n    <div *ngIf=\"layout !== 'table'\" class=\"flex align-items-center gap-2\">\n      <ocx-data-list-grid-sorting\n        [sortDirection]=\"sortDirection\"\n        [sortField]=\"sortField\"\n        [columns]=\"columns\"\n        [sortStates]=\"sortStates\"\n        (sortChange)=\"onSortChange($event)\"\n        (sortDirectionChange)=\"onSortDirectionChange($event)\"\n      ></ocx-data-list-grid-sorting>\n    </div>\n\n    <div *ngIf=\"layout === 'table'\" class=\"flex flex-wrap justify-content-between align-items-center gap-2\">\n      <ocx-column-group-selection\n        [selectedGroupKey]=\"selectedGroupKey\"\n        [columns]=\"columns\"\n        [defaultGroupKey]=\"defaultGroupKey\"\n        [customGroupKey]=\"customGroupKey\"\n        [placeholderKey]=\"groupSelectionNoGroupSelectedKey\"\n        (groupSelectionChanged)=\"onColumnGroupSelectionChange($event)\"\n      ></ocx-column-group-selection>\n\n      <ocx-custom-group-column-selector\n        [columns]=\"columns\"\n        [displayedColumns]=\"displayedColumns\"\n        (columnSelectionChanged)=\"onColumnSelectionChange($event)\"\n        [frozenActionColumn]=\"frozenActionColumn\"\n        [actionColumnPosition]=\"actionColumnPosition\"\n        (actionColumnConfigChanged)=\"onActionColumnConfigChange($event)\"\n      ></ocx-custom-group-column-selector>\n    </div>\n  </div>\n</div>\n<div class=\"p-3\">\n  <ocx-data-view\n    [columns]=\"displayedColumns\"\n    [sortStates]=\"sortStates\"\n    [sortField]=\"sortField\"\n    [filters]=\"filters\"\n    [data]=\"data\"\n    [sortDirection]=\"sortDirection\"\n    [titleLineId]=\"titleLineId || firstColumnId\"\n    [subtitleLineIds]=\"subtitleLineIds\"\n    [clientSideSorting]=\"clientSideSorting\"\n    [clientSideFiltering]=\"clientSideFiltering\"\n    [pageSizes]=\"pageSizes\"\n    [pageSize]=\"pageSize\"\n    [emptyResultsMessage]=\"emptyResultsMessage\"\n    [layout]=\"layout\"\n    [name]=\"name\"\n    [deletePermission]=\"deletePermission\"\n    [editPermission]=\"editPermission\"\n    [viewPermission]=\"viewPermission\"\n    [deleteActionEnabledField]=\"deleteActionEnabledField\"\n    [deleteActionVisibleField]=\"deleteActionVisibleField\"\n    [editActionEnabledField]=\"editActionEnabledField\"\n    [editActionVisibleField]=\"editActionVisibleField\"\n    [viewActionEnabledField]=\"viewActionEnabledField\"\n    [viewActionVisibleField]=\"viewActionVisibleField\"\n    [additionalActions]=\"additionalActions\"\n    [listGridPaginator]=\"listGridPaginator\"\n    [tablePaginator]=\"tablePaginator\"\n    [page]=\"page\"\n    (pageChanged)=\"onPageChange($event)\"\n    [selectedRows]=\"selectedRows\"\n    [frozenActionColumn]=\"frozenActionColumn\"\n    [actionColumnPosition]=\"actionColumnPosition\"\n    [stringTableCellTemplate]=\"_stringTableCell ? stringTableCell : undefined\"\n    [numberTableCellTemplate]=\"_numberTableCell ? numberTableCell : undefined\"\n    [customTableCellTemplate]=\"_customTableCell ? customTableCell : undefined\"\n    [tableDateCellTemplate]=\"_tableDateCell ? tableDateCell : undefined\"\n    [tableRelativeDateCellTemplate]=\"_tableRelativeDateCell ? tableRelativeDateCell : undefined\"\n    [tableCellTemplate]=\"_tableCell ? tableCell : undefined\"\n    [tableTranslationKeyCellTemplate]=\"_tableTranslationKeyCell ? tableTranslationKeyCell : undefined\"\n    [gridItemSubtitleLinesTemplate]=\"_gridItemSubtitleLines ? gridItemSubtitleLines : undefined\"\n    [listItemSubtitleLinesTemplate]=\"_listItemSubtitleLines ? listItemSubtitleLines : undefined\"\n    [listItemTemplate]=\"_listItem? listItem : undefined\"\n    [gridItemTemplate]=\"_gridItem? gridItem  : undefined\"\n    (sorted)=\"sorting($event)\"\n    (filtered)=\"filtering($event)\"\n    [totalRecordsOnServer]=\"totalRecordsOnServer\"\n    [currentPageShowingKey]=\"currentPageShowingKey\"\n    [currentPageShowingWithTotalOnServerKey]=\"currentPageShowingWithTotalOnServerKey\"\n  >\n  </ocx-data-view>\n</div>\n<ng-template #stringTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_stringTableCell\"\n    [ngTemplateOutlet]=\"_stringTableCell\"\n    [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableDateCell\"\n    [ngTemplateOutlet]=\"_tableDateCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableRelativeDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableRelativeDateCell\"\n    [ngTemplateOutlet]=\"_tableRelativeDateCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableCell\"\n    [ngTemplateOutlet]=\"_tableCell\"\n    [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableTranslationKeyCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableTranslationKeyCell\"\n    [ngTemplateOutlet]=\"_tableTranslationKeyCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #gridItemSubtitleLines let-item>\n  <ng-container\n    *ngIf=\"_gridItemSubtitleLines\"\n    [ngTemplateOutlet]=\"_gridItemSubtitleLines\"\n    [ngTemplateOutletContext]=\"{$implicit:item}\"\n  >\n  </ng-container>\n</ng-template>\n<ng-template #listItemSubtitleLines let-item>\n  <ng-container\n    *ngIf=\"_listItemSubtitleLines\"\n    [ngTemplateOutlet]=\"_listItemSubtitleLines\"\n    [ngTemplateOutletContext]=\"{$implicit:item}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #gridItem let-item>\n  <ng-container *ngIf=\"_gridItem\" [ngTemplateOutlet]=\"_gridItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n  </ng-container\n></ng-template>\n<ng-template #listItem let-item>\n  <ng-container *ngIf=\"_listItem\" [ngTemplateOutlet]=\"_listItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n  </ng-container\n></ng-template>\n" }]
+            args: [{ selector: 'ocx-interactive-data-view', providers: [{ provide: 'InteractiveDataViewComponent', useExisting: InteractiveDataViewComponent }], template: "<div class=\"p-3 border-bottom-1 surface-border\">\n  <div class=\"flex flex-wrap justify-content-between align-items-center py-1 gap-2\">\n    <ocx-data-layout-selection\n      [supportedViewLayouts]=\"supportedViewLayouts\"\n      [layout]=\"layout\"\n      (dataViewLayoutChange)=\"onDataViewLayoutChange($event)\"\n    ></ocx-data-layout-selection>\n\n    <div *ngIf=\"topCenter\">\n      <ng-container [ngTemplateOutlet]=\"topCenter\"> </ng-container>\n    </div>\n\n    <div *ngIf=\"layout !== 'table'\" class=\"flex align-items-center gap-2\">\n      <ocx-data-list-grid-sorting\n        [sortDirection]=\"sortDirection\"\n        [sortField]=\"sortField\"\n        [columns]=\"columns\"\n        [sortStates]=\"sortStates\"\n        (sortChange)=\"onSortChange($event)\"\n        (sortDirectionChange)=\"onSortDirectionChange($event)\"\n      ></ocx-data-list-grid-sorting>\n    </div>\n\n    <div *ngIf=\"layout === 'table'\" class=\"flex flex-wrap justify-content-between align-items-center gap-2\">\n      <ocx-column-group-selection\n        [selectedGroupKey]=\"selectedGroupKey\"\n        [columns]=\"columns\"\n        [defaultGroupKey]=\"defaultGroupKey\"\n        [customGroupKey]=\"customGroupKey\"\n        [placeholderKey]=\"groupSelectionNoGroupSelectedKey\"\n        (groupSelectionChanged)=\"onColumnGroupSelectionChange($event)\"\n      ></ocx-column-group-selection>\n\n      <ocx-custom-group-column-selector\n        [columns]=\"columns\"\n        [displayedColumns]=\"displayedColumns\"\n        (columnSelectionChanged)=\"onColumnSelectionChange($event)\"\n        [frozenActionColumn]=\"frozenActionColumn\"\n        [actionColumnPosition]=\"actionColumnPosition\"\n        (actionColumnConfigChanged)=\"onActionColumnConfigChange($event)\"\n      ></ocx-custom-group-column-selector>\n    </div>\n  </div>\n</div>\n<div class=\"p-3\">\n  <ocx-data-view\n    [columns]=\"displayedColumns\"\n    [sortStates]=\"sortStates\"\n    [sortField]=\"sortField\"\n    [filters]=\"filters\"\n    [data]=\"data\"\n    [sortDirection]=\"sortDirection\"\n    [titleLineId]=\"titleLineId || firstColumnId\"\n    [subtitleLineIds]=\"subtitleLineIds\"\n    [clientSideSorting]=\"clientSideSorting\"\n    [clientSideFiltering]=\"clientSideFiltering\"\n    [pageSizes]=\"pageSizes\"\n    [pageSize]=\"pageSize\"\n    [emptyResultsMessage]=\"emptyResultsMessage\"\n    [layout]=\"layout\"\n    [name]=\"name\"\n    [deletePermission]=\"deletePermission\"\n    [editPermission]=\"editPermission\"\n    [viewPermission]=\"viewPermission\"\n    [deleteActionEnabledField]=\"deleteActionEnabledField\"\n    [deleteActionVisibleField]=\"deleteActionVisibleField\"\n    [editActionEnabledField]=\"editActionEnabledField\"\n    [editActionVisibleField]=\"editActionVisibleField\"\n    [viewActionEnabledField]=\"viewActionEnabledField\"\n    [viewActionVisibleField]=\"viewActionVisibleField\"\n    [additionalActions]=\"additionalActions\"\n    [listGridPaginator]=\"listGridPaginator\"\n    [tablePaginator]=\"tablePaginator\"\n    [page]=\"page\"\n    (pageChanged)=\"onPageChange($event)\"\n    [selectedRows]=\"selectedRows\"\n    [frozenActionColumn]=\"frozenActionColumn\"\n    [actionColumnPosition]=\"actionColumnPosition\"\n    [stringTableCellTemplate]=\"_stringTableCell ? stringTableCell : undefined\"\n    [numberTableCellTemplate]=\"_numberTableCell ? numberTableCell : undefined\"\n    [customTableCellTemplate]=\"_customTableCell ? customTableCell : undefined\"\n    [dateTableCellTemplate]=\"_dateTableCell ? dateTableCell : _tableDateCell ? tableDateCell : undefined\"\n    [relativeDateTableCellTemplate]=\"_relativeDateTableCell ? relativeDateTableCell : _tableRelativeDateCell ? tableRelativeDateCell : undefined\"\n    [tableCellTemplate]=\"_tableCell ? tableCell : undefined\"\n    [translationKeyTableCellTemplate]=\"_translationKeyTableCell ? translationKeyTableCell : _tableTranslationKeyCell ? tableTranslationKeyCell : undefined\"\n    [gridItemSubtitleLinesTemplate]=\"_gridItemSubtitleLines ? gridItemSubtitleLines : undefined\"\n    [listItemSubtitleLinesTemplate]=\"_listItemSubtitleLines ? listItemSubtitleLines : undefined\"\n    [listItemTemplate]=\"_listItem? listItem : undefined\"\n    [gridItemTemplate]=\"_gridItem? gridItem  : undefined\"\n    (sorted)=\"sorting($event)\"\n    (filtered)=\"filtering($event)\"\n    [totalRecordsOnServer]=\"totalRecordsOnServer\"\n    [currentPageShowingKey]=\"currentPageShowingKey\"\n    [currentPageShowingWithTotalOnServerKey]=\"currentPageShowingWithTotalOnServerKey\"\n  >\n  </ocx-data-view>\n</div>\n<ng-template #stringTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_stringTableCell\"\n    [ngTemplateOutlet]=\"_stringTableCell\"\n    [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableDateCell\"\n    [ngTemplateOutlet]=\"_tableDateCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #dateTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_dateTableCell\"\n    [ngTemplateOutlet]=\"_dateTableCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableRelativeDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableRelativeDateCell\"\n    [ngTemplateOutlet]=\"_tableRelativeDateCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #relativeDateTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_relativeDateTableCell\"\n    [ngTemplateOutlet]=\"_relativeDateTableCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableCell\"\n    [ngTemplateOutlet]=\"_tableCell\"\n    [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #tableTranslationKeyCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_tableTranslationKeyCell\"\n    [ngTemplateOutlet]=\"_tableTranslationKeyCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #translationKeyTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n  <ng-container\n    *ngIf=\"_translationKeyTableCell\"\n    [ngTemplateOutlet]=\"_translationKeyTableCell\"\n    [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #gridItemSubtitleLines let-item>\n  <ng-container\n    *ngIf=\"_gridItemSubtitleLines\"\n    [ngTemplateOutlet]=\"_gridItemSubtitleLines\"\n    [ngTemplateOutletContext]=\"{$implicit:item}\"\n  >\n  </ng-container>\n</ng-template>\n<ng-template #listItemSubtitleLines let-item>\n  <ng-container\n    *ngIf=\"_listItemSubtitleLines\"\n    [ngTemplateOutlet]=\"_listItemSubtitleLines\"\n    [ngTemplateOutletContext]=\"{$implicit:item}\"\n  >\n  </ng-container\n></ng-template>\n<ng-template #gridItem let-item>\n  <ng-container *ngIf=\"_gridItem\" [ngTemplateOutlet]=\"_gridItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n  </ng-container\n></ng-template>\n<ng-template #listItem let-item>\n  <ng-container *ngIf=\"_listItem\" [ngTemplateOutlet]=\"_listItem\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n  </ng-container\n></ng-template>\n" }]
         }], propDecorators: { dataView: [{
                 type: ViewChild,
                 args: [DataViewComponent]
@@ -2973,12 +3024,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
             }], tableDateCell: [{
                 type: ContentChild,
                 args: ['tableDateCell']
+            }], dateTableCell: [{
+                type: ContentChild,
+                args: ['dateTableCell']
             }], tableRelativeDateCell: [{
                 type: ContentChild,
                 args: ['tableRelativeDateCell']
+            }], relativeDateTableCell: [{
+                type: ContentChild,
+                args: ['relativeDateTableCell']
             }], tableTranslationKeyCell: [{
                 type: ContentChild,
                 args: ['tableTranslationKeyCell']
+            }], translationKeyTableCell: [{
+                type: ContentChild,
+                args: ['translationKeyTableCell']
             }], gridItemSubtitleLines: [{
                 type: ContentChild,
                 args: ['gridItemSubtitleLines']