@onecx/angular-accelerator 6.0.0-rc.15 → 6.0.0-rc.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (24) hide show
  1. package/fesm2022/onecx-angular-accelerator-testing.mjs +6 -40
  2. package/fesm2022/onecx-angular-accelerator-testing.mjs.map +1 -1
  3. package/fesm2022/onecx-angular-accelerator.mjs +50 -486
  4. package/fesm2022/onecx-angular-accelerator.mjs.map +1 -1
  5. package/index.d.ts +1 -11
  6. package/lib/angular-accelerator.module.d.ts +27 -29
  7. package/lib/components/interactive-data-view/interactive-data-view.component.d.ts +53 -0
  8. package/lib/utils/dateutils.d.ts +0 -4
  9. package/package.json +8 -8
  10. package/testing/filter-view.harness.d.ts +1 -1
  11. package/testing/index.d.ts +0 -1
  12. package/testing/interactive-data-view.harness.d.ts +1 -1
  13. package/lib/components/button-dialog/button-dialog.component.d.ts +0 -47
  14. package/lib/components/data-loading-error/data-loading-error.component.d.ts +0 -8
  15. package/lib/injection-tokens/has-permission-checker.d.ts +0 -13
  16. package/lib/services/translation-cache.service.d.ts +0 -19
  17. package/lib/utils/async-translate-loader.utils.d.ts +0 -12
  18. package/lib/utils/caching-translate-loader.utils.d.ts +0 -16
  19. package/lib/utils/create-remote-component-and-mfe-translate-loader.utils.d.ts +0 -6
  20. package/lib/utils/create-remote-component-translate-loader.utils.d.ts +0 -5
  21. package/lib/utils/create-translate-loader.utils.d.ts +0 -8
  22. package/lib/utils/translate.combined.loader.d.ts +0 -12
  23. package/testing/button-dialog.harness.d.ts +0 -17
  24. /package/lib/components/{button-dialog → dialog}/dialog-message-content/dialog-message-content.component.d.ts +0 -0
package/fesm2022/onecx-angular-accelerator.mjs CHANGED
@@ -1,15 +1,14 @@
1
- import { HAS_PERMISSION_CHECKER, SKIP_STYLE_SCOPING, getScopeIdentifier, dataStyleIdKey, dataNoPortalLayoutStylesKey, providePermissionChecker, TRANSLATION_PATH, provideTranslationConnectionService } from '@onecx/angular-utils';
2
- export { AlwaysGrantPermissionChecker, HAS_PERMISSION_CHECKER } from '@onecx/angular-utils';
3
1
  import * as i0 from '@angular/core';
4
2
  import { inject, ElementRef, Input, Directive, Renderer2, ViewContainerRef, TemplateRef, HostListener, EventEmitter, Output, Injectable, Injector, LOCALE_ID, Pipe, ContentChild, ViewEncapsulation, Component, ViewChild, ContentChildren, NgZone, ChangeDetectorRef, ViewChildren, QueryList, isDevMode, Type, NgModule, APP_INITIALIZER } from '@angular/core';
5
3
  import { UserService, AppStateService, ConfigurationService, CONFIG_KEY, ShellCapabilityService, Capability, AppConfigService } from '@onecx/angular-integration-interface';
4
+ import { HAS_PERMISSION_CHECKER, SKIP_STYLE_SCOPING, getScopeIdentifier, dataStyleIdKey, dataNoPortalLayoutStylesKey, providePermissionChecker, TRANSLATION_PATH, provideTranslationConnectionService } from '@onecx/angular-utils';
6
5
  import { HttpClient } from '@angular/common/http';
7
6
  import * as i3 from '@angular/forms';
8
7
  import { FormGroupDirective, FormControlName, FormsModule, ReactiveFormsModule } from '@angular/forms';
9
- import { BehaviorSubject, map, filter, concat, of, from, combineLatest, startWith, debounceTime, mergeMap, first, forkJoin, shareReplay, switchMap, toArray, withLatestFrom, ReplaySubject, timestamp, distinctUntilChanged, isObservable, tap, firstValueFrom, skip, defaultIfEmpty, catchError } from 'rxjs';
10
- import { SyncableTopic, getLocation, isValidDate as isValidDate$1, getUTCDateWithoutTimezoneIssues } from '@onecx/accelerator';
8
+ import { BehaviorSubject, map, filter, concat, of, from, combineLatest, startWith, debounceTime, mergeMap, first, forkJoin, shareReplay, switchMap, toArray, withLatestFrom, ReplaySubject, timestamp, distinctUntilChanged, isObservable, firstValueFrom, skip } from 'rxjs';
9
+ import { SyncableTopic, getLocation, isValidDate, getUTCDateWithoutTimezoneIssues } from '@onecx/accelerator';
11
10
  import * as i1 from '@angular/common';
12
- import { DatePipe, DecimalPipe, CurrencyPipe, formatDate, CommonModule, Location } from '@angular/common';
11
+ import { DatePipe, DecimalPipe, CurrencyPipe, formatDate, CommonModule } from '@angular/common';
13
12
  import * as i2$1 from 'primeng/button';
14
13
  import { ButtonModule } from 'primeng/button';
15
14
  import * as i5 from 'primeng/skeleton';
@@ -64,12 +63,6 @@ import { TimelineModule } from 'primeng/timeline';
64
63
  import { DynamicDialogConfig, DynamicDialogRef, DialogService } from 'primeng/dynamicdialog';
65
64
  import { EventsTopic } from '@onecx/integration-interface';
66
65
  import { providePrimeNG } from 'primeng/config';
67
- import { TranslateHttpLoader } from '@ngx-translate/http-loader';
68
-
69
- /**
70
- * This checker always returns true, basically disabling the permission system on the UI side
71
- * @deprecated Please import from `@onecx/angular-utils` instead.
72
- */
73
66
 
74
67
  class OcxContentContainerDirective {
75
68
  constructor() {
@@ -1035,7 +1028,15 @@ class TooltipOnOverflowDirective extends Tooltip {
1035
1028
  }
1036
1029
  ngAfterViewInit() {
1037
1030
  super.ngAfterViewInit();
1038
- this.mutationObserver.observe(this.el.nativeElement, { subtree: true, characterData: true, childList: true });
1031
+ setTimeout(() => {
1032
+ // Needed to ensure change detection picks up the correct state of 'disabled'
1033
+ // Without this the tooltip for some elements won't update properly
1034
+ this.zone.run(() => {
1035
+ this.disabled = this.el.nativeElement.scrollWidth <= this.el.nativeElement.offsetWidth;
1036
+ this.setOption({ disabled: this.disabled });
1037
+ }, this);
1038
+ this.mutationObserver.observe(this.el.nativeElement, { subtree: true, characterData: true, childList: true });
1039
+ }, 0);
1039
1040
  }
1040
1041
  constructor() {
1041
1042
  const zone = inject(NgZone);
@@ -2322,11 +2323,11 @@ class DataListGridComponent extends DataSortBase {
2322
2323
  return this.templatesObservables[column.id];
2323
2324
  }
2324
2325
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DataListGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2325
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.11", type: DataListGridComponent, isStandalone: false, selector: "ocx-data-list-grid", inputs: { titleLineId: "titleLineId", subtitleLineIds: "subtitleLineIds", clientSideSorting: "clientSideSorting", clientSideFiltering: "clientSideFiltering", sortStates: "sortStates", pageSizes: "pageSizes", pageSize: "pageSize", showAllOption: "showAllOption", emptyResultsMessage: "emptyResultsMessage", fallbackImage: "fallbackImage", layout: "layout", viewPermission: "viewPermission", editPermission: "editPermission", deletePermission: "deletePermission", deleteActionVisibleField: "deleteActionVisibleField", deleteActionEnabledField: "deleteActionEnabledField", viewActionVisibleField: "viewActionVisibleField", viewActionEnabledField: "viewActionEnabledField", editActionVisibleField: "editActionVisibleField", editActionEnabledField: "editActionEnabledField", viewMenuItemKey: "viewMenuItemKey", editMenuItemKey: "editMenuItemKey", deleteMenuItemKey: "deleteMenuItemKey", paginator: "paginator", page: "page", columns: "columns", name: "name", totalRecordsOnServer: "totalRecordsOnServer", currentPageShowingKey: "currentPageShowingKey", currentPageShowingWithTotalOnServerKey: "currentPageShowingWithTotalOnServerKey", data: "data", filters: "filters", sortDirection: "sortDirection", sortField: "sortField", gridItemSubtitleLinesTemplate: "gridItemSubtitleLinesTemplate", listItemSubtitleLinesTemplate: "listItemSubtitleLinesTemplate", listItemTemplate: "listItemTemplate", gridItemTemplate: "gridItemTemplate", listValueTemplate: "listValueTemplate", translationKeyListValueTemplate: "translationKeyListValueTemplate", numberListValueTemplate: "numberListValueTemplate", relativeDateListValueTemplate: "relativeDateListValueTemplate", customListValueTemplate: "customListValueTemplate", stringListValueTemplate: "stringListValueTemplate", dateListValueTemplate: "dateListValueTemplate", additionalActions: "additionalActions", parentTemplates: "parentTemplates" }, outputs: { viewItem: "viewItem", editItem: "editItem", deleteItem: "deleteItem", pageChanged: "pageChanged", pageSizeChanged: "pageSizeChanged", componentStateChanged: "componentStateChanged" }, queries: [{ propertyName: "gridItemSubtitleLinesChildTemplate", first: true, predicate: ["gridItemSubtitleLines"], descendants: true }, { propertyName: "listItemSubtitleLinesChildTemplate", first: true, predicate: ["listItemSubtitleLines"], descendants: true }, { propertyName: "listItemChildTemplate", first: true, predicate: ["listItem"], descendants: true }, { propertyName: "gridItemChildTemplate", first: true, predicate: ["gridItem"], descendants: true }, { propertyName: "listValueChildTemplate", first: true, predicate: ["listValue"], descendants: true }, { propertyName: "translationKeyListValueChildTemplate", first: true, predicate: ["translationKeyListValue"], descendants: true }, { propertyName: "numberListValueChildTemplate", first: true, predicate: ["numberListValue"], descendants: true }, { propertyName: "relativeDateListValueChildTemplate", first: true, predicate: ["relativeDateListValue"], descendants: true }, { propertyName: "customListValueChildTemplate", first: true, predicate: ["customListValue"], descendants: true }, { propertyName: "stringListValueChildTemplate", first: true, predicate: ["stringListValue"], descendants: true }, { propertyName: "dateListValueChildTemplate", first: true, predicate: ["dateListValue"], descendants: true }, { propertyName: "templates", predicate: PrimeTemplate }], viewQueries: [{ propertyName: "viewTemplates", predicate: PrimeTemplate, descendants: true }], usesInheritance: true, ngImport: i0, template: "@if ((displayedPageSize$ | async); as displayedPageSize) { @if ((columnTemplates$ | async) ?? {}; as columnTemplates) {\n<p-dataView\n [value]=\"(displayedItems$ | async) ?? []\"\n [paginator]=\"paginator\"\n [first]=\"page * displayedPageSize\"\n (onPage)=\"onPageChange($event)\"\n [rows]=\"displayedPageSize\"\n [layout]=\"layout\"\n [showCurrentPageReport]=\"true\"\n currentPageReportTemplate=\"{{ (totalRecordsOnServer ? currentPageShowingWithTotalOnServerKey : currentPageShowingKey) | translate:params }}\"\n [rowsPerPageOptions]=\"this.pageSizes ?? []\"\n id=\"dataListGrid_{{name}}\"\n paginatorDropdownAppendTo=\"body\"\n>\n <ng-template #grid let-rows>\n <div class=\"grid grid-cols-12 gap-4\">\n @for (item of rows; track item) {\n <ng-container\n [ngTemplateOutlet]=\"_gridItem ? _gridItem : defaultGridItem\"\n [ngTemplateOutletContext]=\"{$implicit:item}\"\n ></ng-container>\n }\n </div>\n </ng-template>\n <ng-template #list let-rows>\n <div class=\"p-grid p-nogutter grid grid-nogutter\">\n @for (item of rows; track item; let first = $first) { @defer (on viewport; on idle){\n <ng-container\n [ngTemplateOutlet]=\"_listItem ? _listItem : defaultListItem\"\n [ngTemplateOutletContext]=\"{\n item:item,\n first:first,\n columnTemplates: columnTemplates\n }\"\n ></ng-container>\n } @placeholder {\n <div style=\"width: 100%; height: 80px\"></div>\n } }\n </div>\n </ng-template>\n <ng-template pTemplate=\"empty\">\n <span>{{ emptyResultsMessage || (\"OCX_DATA_LIST_GRID.EMPTY_RESULT\" | translate) }}</span>\n </ng-template>\n</p-dataView>\n} }\n\n<ng-template #defaultGridItem let-item>\n <div class=\"col-12 lg:col-6 xl:col-4 p-1 flex justify-content-center grid-border-divider\">\n <div class=\"data-grid-item card flex flex-column justify-content-between w-12 lg:w-11 mb-4 mt-4 align-self-stretch\">\n <div class=\"flex justify-content-center mb-3\">\n <img\n class=\"image\"\n src=\"{{ item.imagePath || (fallbackImagePath$ | async) }}\"\n (error)=\"imgError(item)\"\n alt=\"{{resolveFieldData(item, titleLineId)|| ''}}\"\n />\n </div>\n <div class=\"flex flex-row justify-content-between align-items-center\">\n <div class=\"data-grid-items flex-row\">\n <div class=\"item-name font-medium mr-3 text-2xl\">\n <a [routerLink]=\"\" (click)=\"onViewRow(item)\">{{ resolveFieldData(item, titleLineId) || '' }}</a>\n </div>\n <ng-container\n [ngTemplateOutlet]=\"_gridItemSubtitleLines ? _gridItemSubtitleLines : defaultGridItemSubtitleLines\"\n [ngTemplateOutletContext]=\"{$implicit:item}\"\n ></ng-container>\n </div>\n <div>\n <p-menu #menu [model]=\"gridMenuItems\" [popup]=\"true\" appendTo=\"body\"></p-menu>\n <button\n pButton\n (click)=\"setSelectedItem(item); updateGridMenuItems(true); menu.toggle($event)\"\n icon=\"pi pi-ellipsis-v\"\n [attr.aria-label]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_ARIA_LABEL' | translate\"\n class=\"more-actions-menu-button menu-btn\"\n [attr.name]=\"'data-grid-item-menu-button'\"\n [pTooltip]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_TOOLTIP' | translate\"\n tooltipPosition=\"top\"\n ></button>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n<ng-template #defaultGridItemSubtitleLines let-item>\n @for (subtitleLineId of subtitleLineIds; track subtitleLineId) {\n <div class=\"subtitleLine edit-time text-xl my-3\">{{ resolveFieldData(item, subtitleLineId) }}</div>\n }\n</ng-template>\n<ng-template #defaultListItem let-item=\"item\" let-first=\"first\" let-columnTemplates=\"columnTemplates\">\n @if (columnTemplates) {\n <div class=\"col-12\">\n <div class=\"data-list-items p-1\" [ngClass]=\"{ 'list-border-divider': !first }\">\n <div class=\"item-name-row flex flex-row justify-content-between\">\n <div class=\"item-name mr-3 text-2xl font-medium align-content-center\">\n @if (titleLineId) {\n <span>{{ resolveFieldData(item, titleLineId) || '' }}</span>\n }\n </div>\n <div class=\"flex flex-row\">\n @if (viewItemObserved && (!viewActionVisibleField || fieldIsTruthy(item, viewActionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-viewButton\"\n type=\"button\"\n icon=\"pi pi-eye\"\n pButton\n class=\"p-button-rounded p-button-text mb-1 mr-2 viewListItemButton\"\n [pTooltip]=\"(viewMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.VIEW') | translate\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: !!viewActionEnabledField && !fieldIsTruthy(item, viewActionEnabledField)\n }\"\n [attr.aria-label]=\"(viewMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.VIEW') | translate\"\n (click)=\"onViewRow(item)\"\n *ocxIfPermission=\"viewPermission\"\n [disabled]=\"!!viewActionEnabledField && !fieldIsTruthy(item, viewActionEnabledField)\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } @if (editItemObserved && (!editActionVisibleField || fieldIsTruthy(item, editActionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-editButton\"\n type=\"button\"\n class=\"p-button-rounded p-button-text mb-1 mr-2 editListItemButton\"\n icon=\"pi pi-pencil\"\n pButton\n [pTooltip]=\"(editMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.EDIT') | translate\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: !!editActionEnabledField && !fieldIsTruthy(item, editActionEnabledField)\n }\"\n [attr.aria-label]=\"(editMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.EDIT') | translate\"\n (click)=\"onEditRow(item)\"\n *ocxIfPermission=\"editPermission\"\n [disabled]=\"!!editActionEnabledField && !fieldIsTruthy(item, editActionEnabledField)\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } @if (deleteItemObserved && (!deleteActionVisibleField || fieldIsTruthy(item, deleteActionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-deleteButton\"\n type=\"button\"\n icon=\"pi pi-trash\"\n class=\"p-button-rounded p-button-text p-button-danger mb-1 mr-2 deleteListItemButton\"\n pButton\n [pTooltip]=\"(deleteMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.DELETE') | translate\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: !!deleteActionEnabledField && !fieldIsTruthy(item, deleteActionEnabledField)\n }\"\n [attr.aria-label]=\"(deleteMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.DELETE') | translate\"\n (click)=\"onDeleteRow(item)\"\n *ocxIfPermission=\"deletePermission\"\n [disabled]=\"!!deleteActionEnabledField && !fieldIsTruthy(item, deleteActionEnabledField)\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } @for (action of inlineListActions$ | async; track action) { @if ((!action.actionVisibleField ||\n fieldIsTruthy(item, action.actionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-{{action.id ? action.id.concat('ActionButton') : 'inlineActionButton'}}\"\n *ocxIfPermission=\"action.permission\"\n pButton\n class=\"p-button-rounded p-button-text\"\n [ngClass]=\"action.classes\"\n [icon]=\"action.icon || ''\"\n (click)=\"action.callback(item)\"\n [pTooltip]=\"action.labelKey ? (action.labelKey | translate) : ''\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: action.disabled || (!!action.actionEnabledField && !fieldIsTruthy(item, action.actionEnabledField))\n }\"\n [attr.aria-label]=\"action.labelKey ? (action.labelKey | translate) : ''\"\n [disabled]=\"action.disabled || (!!action.actionEnabledField && !fieldIsTruthy(item, action.actionEnabledField))\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } } @if (hasVisibleOverflowMenuItems(item) | async) {\n <p-menu #menu [model]=\"(overflowMenuItems$ | async) || []\" [popup]=\"true\" appendTo=\"body\"></p-menu>\n <button\n pButton\n class=\"p-button-rounded p-button-text\"\n [icon]=\"'pi pi-ellipsis-v'\"\n (click)=\"toggleOverflowMenu($event, menu, item)\"\n [attr.aria-label]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_ARIA_LABEL' | translate\"\n [pTooltip]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_TOOLTIP' | translate\"\n tooltipPosition=\"top\"\n ></button>\n }\n </div>\n </div>\n <div class=\"text-base font-light my-1\">\n <ng-container\n [ngTemplateOutlet]=\"_listItemSubtitleLines ? _listItemSubtitleLines : defaultListItemSubtitleLines\"\n [ngTemplateOutletContext]=\"{$implicit:item}\"\n ></ng-container>\n </div>\n <div class=\"flex flex-wrap\">\n @for (col of getFilteredColumns(); track col) {\n <div class=\"w-12rem my-2 mr-2\">\n <div class=\"font-bold\" [ocxTooltipOnOverflow]=\"col.nameKey | translate\" tooltipPosition=\"top\">\n {{ col.nameKey | translate }}\n </div>\n <div\n [ocxTooltipOnOverflow]=\"col.columnType === columnType.TRANSLATION_KEY ? (resolveFieldData(item,col.id) | translate) : resolveFieldData(item, col.id)\"\n tooltipPosition=\"top\"\n >\n @defer(on viewport;){\n <ng-container\n [ngTemplateOutlet]=\"_listValue ? _listValue: defaultListValue\"\n [ngTemplateOutletContext]=\"{\n rowObject: item,\n column: col,\n columnTemplates: columnTemplates\n }\"\n >\n </ng-container>\n } @placeholder {\n <p-skeleton width=\"5rem\" />\n }\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n }\n</ng-template>\n<ng-template #defaultListItemSubtitleLines let-item=\"$implicit\">\n @for (subtitleLineId of subtitleLineIds; track subtitleLineId) {\n <div class=\"subtitleLine text-xl my-3\">{{ resolveFieldData(item, subtitleLineId) }}</div>\n }\n</ng-template>\n\n<ng-template #defaultListValue let-rowObject=\"rowObject\" let-column=\"column\" let-columnTemplates=\"columnTemplates\">\n @if (columnTemplates[column.id]) {\n <ng-container\n [ngTemplateOutlet]=\"columnTemplates[column.id]\"\n [ngTemplateOutletContext]=\"{\n rowObject: rowObject,\n column: column\n }\"\n >\n </ng-container>\n }\n</ng-template>\n\n<ng-template pTemplate=\"defaultStringListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) }} </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultNumberListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) | number }} </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultCustomListValue\" let-rowObject=\"rowObject\" let-column=\"column\"> </ng-template>\n\n<ng-template pTemplate=\"defaultDateListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) | date: column.dateFormat ?? 'medium' }} </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultRelativeDateListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container>\n {{ 'OCX_DATA_TABLE.EDITED' | translate }} {{ resolveFieldData(rowObject, column.id) | timeago }}\n </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultTranslationKeyListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) | translate }} </ng-container>\n</ng-template>\n", styles: [".image{width:100%;height:100%}.menu-btn{cursor:pointer;min-width:4rem}.list-border-divider{border-top:.0625rem;border-top-style:solid;border-color:var(--p-surface-200)}.grid-border-divider{border:.0625rem;border-style:solid;border-color:var(--p-surface-200)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i4$3.DataView, selector: "p-dataView, p-dataview, p-data-view", inputs: ["paginator", "rows", "totalRecords", "pageLinks", "rowsPerPageOptions", "paginatorPosition", "paginatorStyleClass", "alwaysShowPaginator", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showFirstLastIcon", "showPageLinks", "lazy", "lazyLoadOnInit", "emptyMessage", "style", "styleClass", "gridStyleClass", "trackBy", "filterBy", "filterLocale", "loading", "loadingIcon", "first", "sortField", "sortOrder", "value", "layout"], outputs: ["onLazyLoad", "onPage", "onSort", "onChangeLayout"] }, { kind: "component", type: i4.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "component", type: i5.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "directive", type: i4$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i8$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: IfPermissionDirective, selector: "[ocxIfPermission], [ocxIfNotPermission]", inputs: ["ocxIfPermission", "ocxIfNotPermission", "onMissingPermission", "ocxIfPermissionPermissions", "ocxIfNotPermissionPermissions", "ocxIfPermissionElseTemplate", "ocxIfNotPermissionElseTemplate"] }, { kind: "directive", type: TooltipOnOverflowDirective, selector: "[ocxTooltipOnOverflow]", inputs: ["ocxTooltipOnOverflow"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1.DatePipe, name: "date" }, { kind: "pipe", type: i8.TranslatePipe, name: "translate" }, { kind: "pipe", type: OcxTimeAgoPipe, name: "timeago" }], deferBlockDependencies: [() => [i1.NgTemplateOutlet], () => [i1.NgTemplateOutlet]] }); }
2326
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.11", type: DataListGridComponent, isStandalone: false, selector: "ocx-data-list-grid", inputs: { titleLineId: "titleLineId", subtitleLineIds: "subtitleLineIds", clientSideSorting: "clientSideSorting", clientSideFiltering: "clientSideFiltering", sortStates: "sortStates", pageSizes: "pageSizes", pageSize: "pageSize", showAllOption: "showAllOption", emptyResultsMessage: "emptyResultsMessage", fallbackImage: "fallbackImage", layout: "layout", viewPermission: "viewPermission", editPermission: "editPermission", deletePermission: "deletePermission", deleteActionVisibleField: "deleteActionVisibleField", deleteActionEnabledField: "deleteActionEnabledField", viewActionVisibleField: "viewActionVisibleField", viewActionEnabledField: "viewActionEnabledField", editActionVisibleField: "editActionVisibleField", editActionEnabledField: "editActionEnabledField", viewMenuItemKey: "viewMenuItemKey", editMenuItemKey: "editMenuItemKey", deleteMenuItemKey: "deleteMenuItemKey", paginator: "paginator", page: "page", columns: "columns", name: "name", totalRecordsOnServer: "totalRecordsOnServer", currentPageShowingKey: "currentPageShowingKey", currentPageShowingWithTotalOnServerKey: "currentPageShowingWithTotalOnServerKey", data: "data", filters: "filters", sortDirection: "sortDirection", sortField: "sortField", gridItemSubtitleLinesTemplate: "gridItemSubtitleLinesTemplate", listItemSubtitleLinesTemplate: "listItemSubtitleLinesTemplate", listItemTemplate: "listItemTemplate", gridItemTemplate: "gridItemTemplate", listValueTemplate: "listValueTemplate", translationKeyListValueTemplate: "translationKeyListValueTemplate", numberListValueTemplate: "numberListValueTemplate", relativeDateListValueTemplate: "relativeDateListValueTemplate", customListValueTemplate: "customListValueTemplate", stringListValueTemplate: "stringListValueTemplate", dateListValueTemplate: "dateListValueTemplate", additionalActions: "additionalActions", parentTemplates: "parentTemplates" }, outputs: { viewItem: "viewItem", editItem: "editItem", deleteItem: "deleteItem", pageChanged: "pageChanged", pageSizeChanged: "pageSizeChanged", componentStateChanged: "componentStateChanged" }, queries: [{ propertyName: "gridItemSubtitleLinesChildTemplate", first: true, predicate: ["gridItemSubtitleLines"], descendants: true }, { propertyName: "listItemSubtitleLinesChildTemplate", first: true, predicate: ["listItemSubtitleLines"], descendants: true }, { propertyName: "listItemChildTemplate", first: true, predicate: ["listItem"], descendants: true }, { propertyName: "gridItemChildTemplate", first: true, predicate: ["gridItem"], descendants: true }, { propertyName: "listValueChildTemplate", first: true, predicate: ["listValue"], descendants: true }, { propertyName: "translationKeyListValueChildTemplate", first: true, predicate: ["translationKeyListValue"], descendants: true }, { propertyName: "numberListValueChildTemplate", first: true, predicate: ["numberListValue"], descendants: true }, { propertyName: "relativeDateListValueChildTemplate", first: true, predicate: ["relativeDateListValue"], descendants: true }, { propertyName: "customListValueChildTemplate", first: true, predicate: ["customListValue"], descendants: true }, { propertyName: "stringListValueChildTemplate", first: true, predicate: ["stringListValue"], descendants: true }, { propertyName: "dateListValueChildTemplate", first: true, predicate: ["dateListValue"], descendants: true }, { propertyName: "templates", predicate: PrimeTemplate }], viewQueries: [{ propertyName: "viewTemplates", predicate: PrimeTemplate, descendants: true }], usesInheritance: true, ngImport: i0, template: "@if ((displayedPageSize$ | async); as displayedPageSize) { @if ((columnTemplates$ | async) ?? {}; as columnTemplates) {\n<p-dataView\n [value]=\"(displayedItems$ | async) ?? []\"\n [paginator]=\"paginator\"\n [first]=\"page * displayedPageSize\"\n (onPage)=\"onPageChange($event)\"\n [rows]=\"displayedPageSize\"\n [layout]=\"layout\"\n [showCurrentPageReport]=\"true\"\n currentPageReportTemplate=\"{{ (totalRecordsOnServer ? currentPageShowingWithTotalOnServerKey : currentPageShowingKey) | translate:params }}\"\n [rowsPerPageOptions]=\"this.pageSizes ?? []\"\n id=\"dataListGrid_{{name}}\"\n paginatorDropdownAppendTo=\"body\"\n>\n <ng-template #grid let-rows>\n <div class=\"grid grid-cols-12 gap-4\">\n @for (item of rows; track item) {\n <ng-container\n [ngTemplateOutlet]=\"_gridItem ? _gridItem : defaultGridItem\"\n [ngTemplateOutletContext]=\"{$implicit:item}\"\n ></ng-container>\n }\n </div>\n </ng-template>\n <ng-template #list let-rows>\n <div class=\"p-grid p-nogutter grid grid-nogutter\">\n @for (item of rows; track item; let first = $first) { @defer (on viewport; on idle){\n <ng-container\n [ngTemplateOutlet]=\"_listItem ? _listItem : defaultListItem\"\n [ngTemplateOutletContext]=\"{\n $implicit: item,\n item:item,\n first:first,\n columnTemplates: columnTemplates\n }\"\n ></ng-container>\n } @placeholder {\n <div style=\"width: 100%; height: 80px\"></div>\n } }\n </div>\n </ng-template>\n <ng-template pTemplate=\"empty\">\n <span>{{ emptyResultsMessage || (\"OCX_DATA_LIST_GRID.EMPTY_RESULT\" | translate) }}</span>\n </ng-template>\n</p-dataView>\n} }\n\n<ng-template #defaultGridItem let-item>\n <div class=\"col-12 lg:col-6 xl:col-4 p-1 flex justify-content-center grid-border-divider\">\n <div class=\"data-grid-item card flex flex-column justify-content-between w-12 lg:w-11 mb-4 mt-4 align-self-stretch\">\n <div class=\"flex justify-content-center mb-3\">\n <img\n class=\"image\"\n src=\"{{ item.imagePath || (fallbackImagePath$ | async) }}\"\n (error)=\"imgError(item)\"\n alt=\"{{resolveFieldData(item, titleLineId)|| ''}}\"\n />\n </div>\n <div class=\"flex flex-row justify-content-between align-items-center\">\n <div class=\"data-grid-items flex-row\">\n <div class=\"item-name font-medium mr-3 text-2xl\">\n <a [routerLink]=\"\" (click)=\"onViewRow(item)\">{{ resolveFieldData(item, titleLineId) || '' }}</a>\n </div>\n <ng-container\n [ngTemplateOutlet]=\"_gridItemSubtitleLines ? _gridItemSubtitleLines : defaultGridItemSubtitleLines\"\n [ngTemplateOutletContext]=\"{$implicit:item}\"\n ></ng-container>\n </div>\n <div>\n <p-menu #menu [model]=\"gridMenuItems\" [popup]=\"true\" appendTo=\"body\"></p-menu>\n <button\n pButton\n (click)=\"setSelectedItem(item); updateGridMenuItems(true); menu.toggle($event)\"\n icon=\"pi pi-ellipsis-v\"\n [attr.aria-label]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_ARIA_LABEL' | translate\"\n class=\"more-actions-menu-button menu-btn\"\n [attr.name]=\"'data-grid-item-menu-button'\"\n [pTooltip]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_TOOLTIP' | translate\"\n tooltipPosition=\"top\"\n ></button>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n<ng-template #defaultGridItemSubtitleLines let-item>\n @for (subtitleLineId of subtitleLineIds; track subtitleLineId) {\n <div class=\"subtitleLine edit-time text-xl my-3\">{{ resolveFieldData(item, subtitleLineId) }}</div>\n }\n</ng-template>\n<ng-template #defaultListItem let-item=\"item\" let-first=\"first\" let-columnTemplates=\"columnTemplates\">\n @if (columnTemplates) {\n <div class=\"col-12\">\n <div class=\"data-list-items p-1\" [ngClass]=\"{ 'list-border-divider': !first }\">\n <div class=\"item-name-row flex flex-row justify-content-between\">\n <div class=\"item-name mr-3 text-2xl font-medium align-content-center\">\n @if (titleLineId) {\n <span>{{ resolveFieldData(item, titleLineId) || '' }}</span>\n }\n </div>\n <div class=\"flex flex-row\">\n @if (viewItemObserved && (!viewActionVisibleField || fieldIsTruthy(item, viewActionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-viewButton\"\n type=\"button\"\n icon=\"pi pi-eye\"\n pButton\n class=\"p-button-rounded p-button-text mb-1 mr-2 viewListItemButton\"\n [pTooltip]=\"(viewMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.VIEW') | translate\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: !!viewActionEnabledField && !fieldIsTruthy(item, viewActionEnabledField)\n }\"\n [attr.aria-label]=\"(viewMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.VIEW') | translate\"\n (click)=\"onViewRow(item)\"\n *ocxIfPermission=\"viewPermission\"\n [disabled]=\"!!viewActionEnabledField && !fieldIsTruthy(item, viewActionEnabledField)\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } @if (editItemObserved && (!editActionVisibleField || fieldIsTruthy(item, editActionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-editButton\"\n type=\"button\"\n class=\"p-button-rounded p-button-text mb-1 mr-2 editListItemButton\"\n icon=\"pi pi-pencil\"\n pButton\n [pTooltip]=\"(editMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.EDIT') | translate\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: !!editActionEnabledField && !fieldIsTruthy(item, editActionEnabledField)\n }\"\n [attr.aria-label]=\"(editMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.EDIT') | translate\"\n (click)=\"onEditRow(item)\"\n *ocxIfPermission=\"editPermission\"\n [disabled]=\"!!editActionEnabledField && !fieldIsTruthy(item, editActionEnabledField)\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } @if (deleteItemObserved && (!deleteActionVisibleField || fieldIsTruthy(item, deleteActionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-deleteButton\"\n type=\"button\"\n icon=\"pi pi-trash\"\n class=\"p-button-rounded p-button-text p-button-danger mb-1 mr-2 deleteListItemButton\"\n pButton\n [pTooltip]=\"(deleteMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.DELETE') | translate\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: !!deleteActionEnabledField && !fieldIsTruthy(item, deleteActionEnabledField)\n }\"\n [attr.aria-label]=\"(deleteMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.DELETE') | translate\"\n (click)=\"onDeleteRow(item)\"\n *ocxIfPermission=\"deletePermission\"\n [disabled]=\"!!deleteActionEnabledField && !fieldIsTruthy(item, deleteActionEnabledField)\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } @for (action of inlineListActions$ | async; track action) { @if ((!action.actionVisibleField ||\n fieldIsTruthy(item, action.actionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-{{action.id ? action.id.concat('ActionButton') : 'inlineActionButton'}}\"\n *ocxIfPermission=\"action.permission\"\n pButton\n class=\"p-button-rounded p-button-text\"\n [ngClass]=\"action.classes\"\n [icon]=\"action.icon || ''\"\n (click)=\"action.callback(item)\"\n [pTooltip]=\"action.labelKey ? (action.labelKey | translate) : ''\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: action.disabled || (!!action.actionEnabledField && !fieldIsTruthy(item, action.actionEnabledField))\n }\"\n [attr.aria-label]=\"action.labelKey ? (action.labelKey | translate) : ''\"\n [disabled]=\"action.disabled || (!!action.actionEnabledField && !fieldIsTruthy(item, action.actionEnabledField))\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } } @if (hasVisibleOverflowMenuItems(item) | async) {\n <p-menu #menu [model]=\"(overflowMenuItems$ | async) || []\" [popup]=\"true\" appendTo=\"body\"></p-menu>\n <button\n pButton\n class=\"p-button-rounded p-button-text\"\n [icon]=\"'pi pi-ellipsis-v'\"\n (click)=\"toggleOverflowMenu($event, menu, item)\"\n [attr.aria-label]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_ARIA_LABEL' | translate\"\n [pTooltip]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_TOOLTIP' | translate\"\n tooltipPosition=\"top\"\n ></button>\n }\n </div>\n </div>\n <div class=\"text-base font-light my-1\">\n <ng-container\n [ngTemplateOutlet]=\"_listItemSubtitleLines ? _listItemSubtitleLines : defaultListItemSubtitleLines\"\n [ngTemplateOutletContext]=\"{$implicit:item}\"\n ></ng-container>\n </div>\n <div class=\"flex flex-wrap\">\n @for (col of getFilteredColumns(); track col) {\n <div class=\"w-12rem my-2 mr-2\">\n <div class=\"font-bold\" [ocxTooltipOnOverflow]=\"col.nameKey | translate\" tooltipPosition=\"top\">\n {{ col.nameKey | translate }}\n </div>\n <div\n [ocxTooltipOnOverflow]=\"col.columnType === columnType.TRANSLATION_KEY ? (resolveFieldData(item,col.id) | translate) : resolveFieldData(item, col.id)\"\n tooltipPosition=\"top\"\n >\n @defer(on viewport;){\n <ng-container\n [ngTemplateOutlet]=\"_listValue ? _listValue: defaultListValue\"\n [ngTemplateOutletContext]=\"{\n rowObject: item,\n column: col,\n columnTemplates: columnTemplates\n }\"\n >\n </ng-container>\n } @placeholder {\n <p-skeleton width=\"5rem\" />\n }\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n }\n</ng-template>\n<ng-template #defaultListItemSubtitleLines let-item=\"$implicit\">\n @for (subtitleLineId of subtitleLineIds; track subtitleLineId) {\n <div class=\"subtitleLine text-xl my-3\">{{ resolveFieldData(item, subtitleLineId) }}</div>\n }\n</ng-template>\n\n<ng-template #defaultListValue let-rowObject=\"rowObject\" let-column=\"column\" let-columnTemplates=\"columnTemplates\">\n @if (columnTemplates[column.id]) {\n <ng-container\n [ngTemplateOutlet]=\"columnTemplates[column.id]\"\n [ngTemplateOutletContext]=\"{\n rowObject: rowObject,\n column: column\n }\"\n >\n </ng-container>\n }\n</ng-template>\n\n<ng-template pTemplate=\"defaultStringListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) }} </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultNumberListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) | number }} </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultCustomListValue\" let-rowObject=\"rowObject\" let-column=\"column\"> </ng-template>\n\n<ng-template pTemplate=\"defaultDateListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) | date: column.dateFormat ?? 'medium' }} </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultRelativeDateListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container>\n {{ 'OCX_DATA_TABLE.EDITED' | translate }} {{ resolveFieldData(rowObject, column.id) | timeago }}\n </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultTranslationKeyListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) | translate }} </ng-container>\n</ng-template>\n", styles: [".image{width:100%;height:100%}.menu-btn{cursor:pointer;min-width:4rem}.list-border-divider{border-top:.0625rem;border-top-style:solid;border-color:var(--p-surface-200)}.grid-border-divider{border:.0625rem;border-style:solid;border-color:var(--p-surface-200)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i4$3.DataView, selector: "p-dataView, p-dataview, p-data-view", inputs: ["paginator", "rows", "totalRecords", "pageLinks", "rowsPerPageOptions", "paginatorPosition", "paginatorStyleClass", "alwaysShowPaginator", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showFirstLastIcon", "showPageLinks", "lazy", "lazyLoadOnInit", "emptyMessage", "style", "styleClass", "gridStyleClass", "trackBy", "filterBy", "filterLocale", "loading", "loadingIcon", "first", "sortField", "sortOrder", "value", "layout"], outputs: ["onLazyLoad", "onPage", "onSort", "onChangeLayout"] }, { kind: "component", type: i4.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "component", type: i5.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "directive", type: i4$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i8$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: IfPermissionDirective, selector: "[ocxIfPermission], [ocxIfNotPermission]", inputs: ["ocxIfPermission", "ocxIfNotPermission", "onMissingPermission", "ocxIfPermissionPermissions", "ocxIfNotPermissionPermissions", "ocxIfPermissionElseTemplate", "ocxIfNotPermissionElseTemplate"] }, { kind: "directive", type: TooltipOnOverflowDirective, selector: "[ocxTooltipOnOverflow]", inputs: ["ocxTooltipOnOverflow"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1.DatePipe, name: "date" }, { kind: "pipe", type: i8.TranslatePipe, name: "translate" }, { kind: "pipe", type: OcxTimeAgoPipe, name: "timeago" }], deferBlockDependencies: [() => [i1.NgTemplateOutlet], () => [i1.NgTemplateOutlet]] }); }
2326
2327
  }
2327
2328
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DataListGridComponent, decorators: [{
2328
2329
  type: Component,
2329
- args: [{ standalone: false, selector: 'ocx-data-list-grid', template: "@if ((displayedPageSize$ | async); as displayedPageSize) { @if ((columnTemplates$ | async) ?? {}; as columnTemplates) {\n<p-dataView\n [value]=\"(displayedItems$ | async) ?? []\"\n [paginator]=\"paginator\"\n [first]=\"page * displayedPageSize\"\n (onPage)=\"onPageChange($event)\"\n [rows]=\"displayedPageSize\"\n [layout]=\"layout\"\n [showCurrentPageReport]=\"true\"\n currentPageReportTemplate=\"{{ (totalRecordsOnServer ? currentPageShowingWithTotalOnServerKey : currentPageShowingKey) | translate:params }}\"\n [rowsPerPageOptions]=\"this.pageSizes ?? []\"\n id=\"dataListGrid_{{name}}\"\n paginatorDropdownAppendTo=\"body\"\n>\n <ng-template #grid let-rows>\n <div class=\"grid grid-cols-12 gap-4\">\n @for (item of rows; track item) {\n <ng-container\n [ngTemplateOutlet]=\"_gridItem ? _gridItem : defaultGridItem\"\n [ngTemplateOutletContext]=\"{$implicit:item}\"\n ></ng-container>\n }\n </div>\n </ng-template>\n <ng-template #list let-rows>\n <div class=\"p-grid p-nogutter grid grid-nogutter\">\n @for (item of rows; track item; let first = $first) { @defer (on viewport; on idle){\n <ng-container\n [ngTemplateOutlet]=\"_listItem ? _listItem : defaultListItem\"\n [ngTemplateOutletContext]=\"{\n item:item,\n first:first,\n columnTemplates: columnTemplates\n }\"\n ></ng-container>\n } @placeholder {\n <div style=\"width: 100%; height: 80px\"></div>\n } }\n </div>\n </ng-template>\n <ng-template pTemplate=\"empty\">\n <span>{{ emptyResultsMessage || (\"OCX_DATA_LIST_GRID.EMPTY_RESULT\" | translate) }}</span>\n </ng-template>\n</p-dataView>\n} }\n\n<ng-template #defaultGridItem let-item>\n <div class=\"col-12 lg:col-6 xl:col-4 p-1 flex justify-content-center grid-border-divider\">\n <div class=\"data-grid-item card flex flex-column justify-content-between w-12 lg:w-11 mb-4 mt-4 align-self-stretch\">\n <div class=\"flex justify-content-center mb-3\">\n <img\n class=\"image\"\n src=\"{{ item.imagePath || (fallbackImagePath$ | async) }}\"\n (error)=\"imgError(item)\"\n alt=\"{{resolveFieldData(item, titleLineId)|| ''}}\"\n />\n </div>\n <div class=\"flex flex-row justify-content-between align-items-center\">\n <div class=\"data-grid-items flex-row\">\n <div class=\"item-name font-medium mr-3 text-2xl\">\n <a [routerLink]=\"\" (click)=\"onViewRow(item)\">{{ resolveFieldData(item, titleLineId) || '' }}</a>\n </div>\n <ng-container\n [ngTemplateOutlet]=\"_gridItemSubtitleLines ? _gridItemSubtitleLines : defaultGridItemSubtitleLines\"\n [ngTemplateOutletContext]=\"{$implicit:item}\"\n ></ng-container>\n </div>\n <div>\n <p-menu #menu [model]=\"gridMenuItems\" [popup]=\"true\" appendTo=\"body\"></p-menu>\n <button\n pButton\n (click)=\"setSelectedItem(item); updateGridMenuItems(true); menu.toggle($event)\"\n icon=\"pi pi-ellipsis-v\"\n [attr.aria-label]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_ARIA_LABEL' | translate\"\n class=\"more-actions-menu-button menu-btn\"\n [attr.name]=\"'data-grid-item-menu-button'\"\n [pTooltip]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_TOOLTIP' | translate\"\n tooltipPosition=\"top\"\n ></button>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n<ng-template #defaultGridItemSubtitleLines let-item>\n @for (subtitleLineId of subtitleLineIds; track subtitleLineId) {\n <div class=\"subtitleLine edit-time text-xl my-3\">{{ resolveFieldData(item, subtitleLineId) }}</div>\n }\n</ng-template>\n<ng-template #defaultListItem let-item=\"item\" let-first=\"first\" let-columnTemplates=\"columnTemplates\">\n @if (columnTemplates) {\n <div class=\"col-12\">\n <div class=\"data-list-items p-1\" [ngClass]=\"{ 'list-border-divider': !first }\">\n <div class=\"item-name-row flex flex-row justify-content-between\">\n <div class=\"item-name mr-3 text-2xl font-medium align-content-center\">\n @if (titleLineId) {\n <span>{{ resolveFieldData(item, titleLineId) || '' }}</span>\n }\n </div>\n <div class=\"flex flex-row\">\n @if (viewItemObserved && (!viewActionVisibleField || fieldIsTruthy(item, viewActionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-viewButton\"\n type=\"button\"\n icon=\"pi pi-eye\"\n pButton\n class=\"p-button-rounded p-button-text mb-1 mr-2 viewListItemButton\"\n [pTooltip]=\"(viewMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.VIEW') | translate\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: !!viewActionEnabledField && !fieldIsTruthy(item, viewActionEnabledField)\n }\"\n [attr.aria-label]=\"(viewMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.VIEW') | translate\"\n (click)=\"onViewRow(item)\"\n *ocxIfPermission=\"viewPermission\"\n [disabled]=\"!!viewActionEnabledField && !fieldIsTruthy(item, viewActionEnabledField)\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } @if (editItemObserved && (!editActionVisibleField || fieldIsTruthy(item, editActionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-editButton\"\n type=\"button\"\n class=\"p-button-rounded p-button-text mb-1 mr-2 editListItemButton\"\n icon=\"pi pi-pencil\"\n pButton\n [pTooltip]=\"(editMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.EDIT') | translate\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: !!editActionEnabledField && !fieldIsTruthy(item, editActionEnabledField)\n }\"\n [attr.aria-label]=\"(editMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.EDIT') | translate\"\n (click)=\"onEditRow(item)\"\n *ocxIfPermission=\"editPermission\"\n [disabled]=\"!!editActionEnabledField && !fieldIsTruthy(item, editActionEnabledField)\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } @if (deleteItemObserved && (!deleteActionVisibleField || fieldIsTruthy(item, deleteActionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-deleteButton\"\n type=\"button\"\n icon=\"pi pi-trash\"\n class=\"p-button-rounded p-button-text p-button-danger mb-1 mr-2 deleteListItemButton\"\n pButton\n [pTooltip]=\"(deleteMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.DELETE') | translate\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: !!deleteActionEnabledField && !fieldIsTruthy(item, deleteActionEnabledField)\n }\"\n [attr.aria-label]=\"(deleteMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.DELETE') | translate\"\n (click)=\"onDeleteRow(item)\"\n *ocxIfPermission=\"deletePermission\"\n [disabled]=\"!!deleteActionEnabledField && !fieldIsTruthy(item, deleteActionEnabledField)\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } @for (action of inlineListActions$ | async; track action) { @if ((!action.actionVisibleField ||\n fieldIsTruthy(item, action.actionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-{{action.id ? action.id.concat('ActionButton') : 'inlineActionButton'}}\"\n *ocxIfPermission=\"action.permission\"\n pButton\n class=\"p-button-rounded p-button-text\"\n [ngClass]=\"action.classes\"\n [icon]=\"action.icon || ''\"\n (click)=\"action.callback(item)\"\n [pTooltip]=\"action.labelKey ? (action.labelKey | translate) : ''\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: action.disabled || (!!action.actionEnabledField && !fieldIsTruthy(item, action.actionEnabledField))\n }\"\n [attr.aria-label]=\"action.labelKey ? (action.labelKey | translate) : ''\"\n [disabled]=\"action.disabled || (!!action.actionEnabledField && !fieldIsTruthy(item, action.actionEnabledField))\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } } @if (hasVisibleOverflowMenuItems(item) | async) {\n <p-menu #menu [model]=\"(overflowMenuItems$ | async) || []\" [popup]=\"true\" appendTo=\"body\"></p-menu>\n <button\n pButton\n class=\"p-button-rounded p-button-text\"\n [icon]=\"'pi pi-ellipsis-v'\"\n (click)=\"toggleOverflowMenu($event, menu, item)\"\n [attr.aria-label]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_ARIA_LABEL' | translate\"\n [pTooltip]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_TOOLTIP' | translate\"\n tooltipPosition=\"top\"\n ></button>\n }\n </div>\n </div>\n <div class=\"text-base font-light my-1\">\n <ng-container\n [ngTemplateOutlet]=\"_listItemSubtitleLines ? _listItemSubtitleLines : defaultListItemSubtitleLines\"\n [ngTemplateOutletContext]=\"{$implicit:item}\"\n ></ng-container>\n </div>\n <div class=\"flex flex-wrap\">\n @for (col of getFilteredColumns(); track col) {\n <div class=\"w-12rem my-2 mr-2\">\n <div class=\"font-bold\" [ocxTooltipOnOverflow]=\"col.nameKey | translate\" tooltipPosition=\"top\">\n {{ col.nameKey | translate }}\n </div>\n <div\n [ocxTooltipOnOverflow]=\"col.columnType === columnType.TRANSLATION_KEY ? (resolveFieldData(item,col.id) | translate) : resolveFieldData(item, col.id)\"\n tooltipPosition=\"top\"\n >\n @defer(on viewport;){\n <ng-container\n [ngTemplateOutlet]=\"_listValue ? _listValue: defaultListValue\"\n [ngTemplateOutletContext]=\"{\n rowObject: item,\n column: col,\n columnTemplates: columnTemplates\n }\"\n >\n </ng-container>\n } @placeholder {\n <p-skeleton width=\"5rem\" />\n }\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n }\n</ng-template>\n<ng-template #defaultListItemSubtitleLines let-item=\"$implicit\">\n @for (subtitleLineId of subtitleLineIds; track subtitleLineId) {\n <div class=\"subtitleLine text-xl my-3\">{{ resolveFieldData(item, subtitleLineId) }}</div>\n }\n</ng-template>\n\n<ng-template #defaultListValue let-rowObject=\"rowObject\" let-column=\"column\" let-columnTemplates=\"columnTemplates\">\n @if (columnTemplates[column.id]) {\n <ng-container\n [ngTemplateOutlet]=\"columnTemplates[column.id]\"\n [ngTemplateOutletContext]=\"{\n rowObject: rowObject,\n column: column\n }\"\n >\n </ng-container>\n }\n</ng-template>\n\n<ng-template pTemplate=\"defaultStringListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) }} </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultNumberListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) | number }} </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultCustomListValue\" let-rowObject=\"rowObject\" let-column=\"column\"> </ng-template>\n\n<ng-template pTemplate=\"defaultDateListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) | date: column.dateFormat ?? 'medium' }} </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultRelativeDateListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container>\n {{ 'OCX_DATA_TABLE.EDITED' | translate }} {{ resolveFieldData(rowObject, column.id) | timeago }}\n </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultTranslationKeyListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) | translate }} </ng-container>\n</ng-template>\n", styles: [".image{width:100%;height:100%}.menu-btn{cursor:pointer;min-width:4rem}.list-border-divider{border-top:.0625rem;border-top-style:solid;border-color:var(--p-surface-200)}.grid-border-divider{border:.0625rem;border-style:solid;border-color:var(--p-surface-200)}\n"] }]
2330
+ args: [{ standalone: false, selector: 'ocx-data-list-grid', template: "@if ((displayedPageSize$ | async); as displayedPageSize) { @if ((columnTemplates$ | async) ?? {}; as columnTemplates) {\n<p-dataView\n [value]=\"(displayedItems$ | async) ?? []\"\n [paginator]=\"paginator\"\n [first]=\"page * displayedPageSize\"\n (onPage)=\"onPageChange($event)\"\n [rows]=\"displayedPageSize\"\n [layout]=\"layout\"\n [showCurrentPageReport]=\"true\"\n currentPageReportTemplate=\"{{ (totalRecordsOnServer ? currentPageShowingWithTotalOnServerKey : currentPageShowingKey) | translate:params }}\"\n [rowsPerPageOptions]=\"this.pageSizes ?? []\"\n id=\"dataListGrid_{{name}}\"\n paginatorDropdownAppendTo=\"body\"\n>\n <ng-template #grid let-rows>\n <div class=\"grid grid-cols-12 gap-4\">\n @for (item of rows; track item) {\n <ng-container\n [ngTemplateOutlet]=\"_gridItem ? _gridItem : defaultGridItem\"\n [ngTemplateOutletContext]=\"{$implicit:item}\"\n ></ng-container>\n }\n </div>\n </ng-template>\n <ng-template #list let-rows>\n <div class=\"p-grid p-nogutter grid grid-nogutter\">\n @for (item of rows; track item; let first = $first) { @defer (on viewport; on idle){\n <ng-container\n [ngTemplateOutlet]=\"_listItem ? _listItem : defaultListItem\"\n [ngTemplateOutletContext]=\"{\n $implicit: item,\n item:item,\n first:first,\n columnTemplates: columnTemplates\n }\"\n ></ng-container>\n } @placeholder {\n <div style=\"width: 100%; height: 80px\"></div>\n } }\n </div>\n </ng-template>\n <ng-template pTemplate=\"empty\">\n <span>{{ emptyResultsMessage || (\"OCX_DATA_LIST_GRID.EMPTY_RESULT\" | translate) }}</span>\n </ng-template>\n</p-dataView>\n} }\n\n<ng-template #defaultGridItem let-item>\n <div class=\"col-12 lg:col-6 xl:col-4 p-1 flex justify-content-center grid-border-divider\">\n <div class=\"data-grid-item card flex flex-column justify-content-between w-12 lg:w-11 mb-4 mt-4 align-self-stretch\">\n <div class=\"flex justify-content-center mb-3\">\n <img\n class=\"image\"\n src=\"{{ item.imagePath || (fallbackImagePath$ | async) }}\"\n (error)=\"imgError(item)\"\n alt=\"{{resolveFieldData(item, titleLineId)|| ''}}\"\n />\n </div>\n <div class=\"flex flex-row justify-content-between align-items-center\">\n <div class=\"data-grid-items flex-row\">\n <div class=\"item-name font-medium mr-3 text-2xl\">\n <a [routerLink]=\"\" (click)=\"onViewRow(item)\">{{ resolveFieldData(item, titleLineId) || '' }}</a>\n </div>\n <ng-container\n [ngTemplateOutlet]=\"_gridItemSubtitleLines ? _gridItemSubtitleLines : defaultGridItemSubtitleLines\"\n [ngTemplateOutletContext]=\"{$implicit:item}\"\n ></ng-container>\n </div>\n <div>\n <p-menu #menu [model]=\"gridMenuItems\" [popup]=\"true\" appendTo=\"body\"></p-menu>\n <button\n pButton\n (click)=\"setSelectedItem(item); updateGridMenuItems(true); menu.toggle($event)\"\n icon=\"pi pi-ellipsis-v\"\n [attr.aria-label]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_ARIA_LABEL' | translate\"\n class=\"more-actions-menu-button menu-btn\"\n [attr.name]=\"'data-grid-item-menu-button'\"\n [pTooltip]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_TOOLTIP' | translate\"\n tooltipPosition=\"top\"\n ></button>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n<ng-template #defaultGridItemSubtitleLines let-item>\n @for (subtitleLineId of subtitleLineIds; track subtitleLineId) {\n <div class=\"subtitleLine edit-time text-xl my-3\">{{ resolveFieldData(item, subtitleLineId) }}</div>\n }\n</ng-template>\n<ng-template #defaultListItem let-item=\"item\" let-first=\"first\" let-columnTemplates=\"columnTemplates\">\n @if (columnTemplates) {\n <div class=\"col-12\">\n <div class=\"data-list-items p-1\" [ngClass]=\"{ 'list-border-divider': !first }\">\n <div class=\"item-name-row flex flex-row justify-content-between\">\n <div class=\"item-name mr-3 text-2xl font-medium align-content-center\">\n @if (titleLineId) {\n <span>{{ resolveFieldData(item, titleLineId) || '' }}</span>\n }\n </div>\n <div class=\"flex flex-row\">\n @if (viewItemObserved && (!viewActionVisibleField || fieldIsTruthy(item, viewActionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-viewButton\"\n type=\"button\"\n icon=\"pi pi-eye\"\n pButton\n class=\"p-button-rounded p-button-text mb-1 mr-2 viewListItemButton\"\n [pTooltip]=\"(viewMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.VIEW') | translate\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: !!viewActionEnabledField && !fieldIsTruthy(item, viewActionEnabledField)\n }\"\n [attr.aria-label]=\"(viewMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.VIEW') | translate\"\n (click)=\"onViewRow(item)\"\n *ocxIfPermission=\"viewPermission\"\n [disabled]=\"!!viewActionEnabledField && !fieldIsTruthy(item, viewActionEnabledField)\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } @if (editItemObserved && (!editActionVisibleField || fieldIsTruthy(item, editActionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-editButton\"\n type=\"button\"\n class=\"p-button-rounded p-button-text mb-1 mr-2 editListItemButton\"\n icon=\"pi pi-pencil\"\n pButton\n [pTooltip]=\"(editMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.EDIT') | translate\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: !!editActionEnabledField && !fieldIsTruthy(item, editActionEnabledField)\n }\"\n [attr.aria-label]=\"(editMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.EDIT') | translate\"\n (click)=\"onEditRow(item)\"\n *ocxIfPermission=\"editPermission\"\n [disabled]=\"!!editActionEnabledField && !fieldIsTruthy(item, editActionEnabledField)\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } @if (deleteItemObserved && (!deleteActionVisibleField || fieldIsTruthy(item, deleteActionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-deleteButton\"\n type=\"button\"\n icon=\"pi pi-trash\"\n class=\"p-button-rounded p-button-text p-button-danger mb-1 mr-2 deleteListItemButton\"\n pButton\n [pTooltip]=\"(deleteMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.DELETE') | translate\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: !!deleteActionEnabledField && !fieldIsTruthy(item, deleteActionEnabledField)\n }\"\n [attr.aria-label]=\"(deleteMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.DELETE') | translate\"\n (click)=\"onDeleteRow(item)\"\n *ocxIfPermission=\"deletePermission\"\n [disabled]=\"!!deleteActionEnabledField && !fieldIsTruthy(item, deleteActionEnabledField)\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } @for (action of inlineListActions$ | async; track action) { @if ((!action.actionVisibleField ||\n fieldIsTruthy(item, action.actionVisibleField))) {\n <button\n id=\"{{resolveFieldData(item, 'id')}}-{{action.id ? action.id.concat('ActionButton') : 'inlineActionButton'}}\"\n *ocxIfPermission=\"action.permission\"\n pButton\n class=\"p-button-rounded p-button-text\"\n [ngClass]=\"action.classes\"\n [icon]=\"action.icon || ''\"\n (click)=\"action.callback(item)\"\n [pTooltip]=\"action.labelKey ? (action.labelKey | translate) : ''\"\n tooltipPosition=\"top\"\n [tooltipOptions]=\"{\n disabled: action.disabled || (!!action.actionEnabledField && !fieldIsTruthy(item, action.actionEnabledField))\n }\"\n [attr.aria-label]=\"action.labelKey ? (action.labelKey | translate) : ''\"\n [disabled]=\"action.disabled || (!!action.actionEnabledField && !fieldIsTruthy(item, action.actionEnabledField))\"\n [attr.name]=\"'data-list-action-button'\"\n ></button>\n } } @if (hasVisibleOverflowMenuItems(item) | async) {\n <p-menu #menu [model]=\"(overflowMenuItems$ | async) || []\" [popup]=\"true\" appendTo=\"body\"></p-menu>\n <button\n pButton\n class=\"p-button-rounded p-button-text\"\n [icon]=\"'pi pi-ellipsis-v'\"\n (click)=\"toggleOverflowMenu($event, menu, item)\"\n [attr.aria-label]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_ARIA_LABEL' | translate\"\n [pTooltip]=\"'OCX_DATA_LIST_GRID.MORE_ACTIONS_TOOLTIP' | translate\"\n tooltipPosition=\"top\"\n ></button>\n }\n </div>\n </div>\n <div class=\"text-base font-light my-1\">\n <ng-container\n [ngTemplateOutlet]=\"_listItemSubtitleLines ? _listItemSubtitleLines : defaultListItemSubtitleLines\"\n [ngTemplateOutletContext]=\"{$implicit:item}\"\n ></ng-container>\n </div>\n <div class=\"flex flex-wrap\">\n @for (col of getFilteredColumns(); track col) {\n <div class=\"w-12rem my-2 mr-2\">\n <div class=\"font-bold\" [ocxTooltipOnOverflow]=\"col.nameKey | translate\" tooltipPosition=\"top\">\n {{ col.nameKey | translate }}\n </div>\n <div\n [ocxTooltipOnOverflow]=\"col.columnType === columnType.TRANSLATION_KEY ? (resolveFieldData(item,col.id) | translate) : resolveFieldData(item, col.id)\"\n tooltipPosition=\"top\"\n >\n @defer(on viewport;){\n <ng-container\n [ngTemplateOutlet]=\"_listValue ? _listValue: defaultListValue\"\n [ngTemplateOutletContext]=\"{\n rowObject: item,\n column: col,\n columnTemplates: columnTemplates\n }\"\n >\n </ng-container>\n } @placeholder {\n <p-skeleton width=\"5rem\" />\n }\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n }\n</ng-template>\n<ng-template #defaultListItemSubtitleLines let-item=\"$implicit\">\n @for (subtitleLineId of subtitleLineIds; track subtitleLineId) {\n <div class=\"subtitleLine text-xl my-3\">{{ resolveFieldData(item, subtitleLineId) }}</div>\n }\n</ng-template>\n\n<ng-template #defaultListValue let-rowObject=\"rowObject\" let-column=\"column\" let-columnTemplates=\"columnTemplates\">\n @if (columnTemplates[column.id]) {\n <ng-container\n [ngTemplateOutlet]=\"columnTemplates[column.id]\"\n [ngTemplateOutletContext]=\"{\n rowObject: rowObject,\n column: column\n }\"\n >\n </ng-container>\n }\n</ng-template>\n\n<ng-template pTemplate=\"defaultStringListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) }} </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultNumberListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) | number }} </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultCustomListValue\" let-rowObject=\"rowObject\" let-column=\"column\"> </ng-template>\n\n<ng-template pTemplate=\"defaultDateListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) | date: column.dateFormat ?? 'medium' }} </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultRelativeDateListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container>\n {{ 'OCX_DATA_TABLE.EDITED' | translate }} {{ resolveFieldData(rowObject, column.id) | timeago }}\n </ng-container>\n</ng-template>\n\n<ng-template pTemplate=\"defaultTranslationKeyListValue\" let-rowObject=\"rowObject\" let-column=\"column\">\n <ng-container> {{ resolveFieldData(rowObject, column.id) | translate }} </ng-container>\n</ng-template>\n", styles: [".image{width:100%;height:100%}.menu-btn{cursor:pointer;min-width:4rem}.list-border-divider{border-top:.0625rem;border-top-style:solid;border-color:var(--p-surface-200)}.grid-border-divider{border:.0625rem;border-style:solid;border-color:var(--p-surface-200)}\n"] }]
2330
2331
  }], ctorParameters: () => [], propDecorators: { titleLineId: [{
2331
2332
  type: Input
2332
2333
  }], subtitleLineIds: [{
@@ -3152,7 +3153,7 @@ class DataTableComponent extends DataSortBase {
3152
3153
  return true;
3153
3154
  }
3154
3155
  const d = new Date(value);
3155
- return isValidDate$1(d);
3156
+ return isValidDate(d);
3156
3157
  }
3157
3158
  getColumnTypeTemplate(templates, columnType, templateType) {
3158
3159
  let template;
@@ -4930,91 +4931,91 @@ class InteractiveDataViewComponent {
4930
4931
  this.templates$.value?.forEach((item) => {
4931
4932
  switch (item.getType()) {
4932
4933
  case 'tableCell':
4933
- this.tableCell = item.template;
4934
+ this.primeNgTableCell = item.template;
4934
4935
  break;
4935
4936
  case 'tableDateCell':
4936
- this.tableDateCell = item.template;
4937
+ this.primeNgTableDateCell = item.template;
4937
4938
  break;
4938
4939
  case 'dateTableCell':
4939
- this.dateTableCell = item.template;
4940
+ this.primeNgDateTableCell = item.template;
4940
4941
  break;
4941
4942
  case 'tableRelativeDateCell':
4942
- this.tableRelativeDateCell = item.template;
4943
+ this.primeNgTableRelativeDateCell = item.template;
4943
4944
  break;
4944
4945
  case 'relativeDateTableCell':
4945
- this.relativeDateTableCell = item.template;
4946
+ this.primeNgRelativeDateTableCell = item.template;
4946
4947
  break;
4947
4948
  case 'tableTranslationKeyCell':
4948
- this.tableTranslationKeyCell = item.template;
4949
+ this.primeNgTableTranslationKeyCell = item.template;
4949
4950
  break;
4950
4951
  case 'translationKeyTableCell':
4951
- this.translationKeyTableCell = item.template;
4952
+ this.primeNgTranslationKeyTableCell = item.template;
4952
4953
  break;
4953
4954
  case 'gridItemSubtitleLines':
4954
- this.gridItemSubtitleLines = item.template;
4955
+ this.primeNgGridItemSubtitleLines = item.template;
4955
4956
  break;
4956
4957
  case 'listItemSubtitleLines':
4957
- this.listItemSubtitleLines = item.template;
4958
+ this.primeNgListItemSubtitleLines = item.template;
4958
4959
  break;
4959
4960
  case 'stringTableCell':
4960
- this.stringTableCell = item.template;
4961
+ this.primeNgStringTableCell = item.template;
4961
4962
  break;
4962
4963
  case 'numberTableCell':
4963
- this.numberTableCell = item.template;
4964
+ this.primeNgNumberTableCell = item.template;
4964
4965
  break;
4965
4966
  case 'customTableCell':
4966
- this.customTableCell = item.template;
4967
+ this.primeNgCustomTableCell = item.template;
4967
4968
  break;
4968
4969
  case 'gridItem':
4969
- this.gridItem = item.template;
4970
+ this.primeNgGridItem = item.template;
4970
4971
  break;
4971
4972
  case 'listItem':
4972
- this.listItem = item.template;
4973
+ this.primeNgListItem = item.template;
4973
4974
  break;
4974
4975
  case 'topCenter':
4975
- this.topCenter = item.template;
4976
+ this.primeNgTopCenter = item.template;
4976
4977
  break;
4977
4978
  case 'listValue':
4978
- this.listValue = item.template;
4979
+ this.primeNgListValue = item.template;
4979
4980
  break;
4980
4981
  case 'translationKeyListValue':
4981
- this.translationKeyListValue = item.template;
4982
+ this.primeNgTranslationKeyListValue = item.template;
4982
4983
  break;
4983
4984
  case 'numberListValue':
4984
- this.numberListValue = item.template;
4985
+ this.primeNgNumberListValue = item.template;
4985
4986
  break;
4986
4987
  case 'relativeDateListValue':
4987
- this.relativeDateListValue = item.template;
4988
+ this.primeNgRelativeDateListValue = item.template;
4988
4989
  break;
4989
4990
  case 'customListValue':
4990
- this.customListValue = item.template;
4991
+ this.primeNgCustomListValue = item.template;
4991
4992
  break;
4992
4993
  case 'stringListValue':
4993
- this.stringListValue = item.template;
4994
+ this.primeNgStringListValue = item.template;
4994
4995
  break;
4995
4996
  case 'dateListValue':
4996
- this.dateListValue = item.template;
4997
+ this.primeNgDateListValue = item.template;
4997
4998
  break;
4998
4999
  case 'tableFilterCell':
4999
- this.tableFilterCell = item.template;
5000
+ this.primeNgTableFilterCell = item.template;
5000
5001
  break;
5001
5002
  case 'dateTableFilterCell':
5002
- this.dateTableFilterCell = item.template;
5003
+ this.primeNgDateTableFilterCell = item.template;
5003
5004
  break;
5004
5005
  case 'relativeDateTableFilterCell':
5005
- this.relativeDateTableFilterCell = item.template;
5006
+ this.primeNgRelativeDateTableFilterCell = item.template;
5006
5007
  break;
5007
5008
  case 'translationKeyTableFilterCell':
5008
- this.translationKeyTableFilterCell = item.template;
5009
+ this.primeNgTranslationKeyTableFilterCell = item.template;
5009
5010
  break;
5010
5011
  case 'stringTableFilterCell':
5011
- this.stringTableFilterCell = item.template;
5012
+ this.primeNgStringTableFilterCell = item.template;
5012
5013
  break;
5013
5014
  case 'numberTableFilterCell':
5014
- this.numberTableFilterCell = item.template;
5015
+ this.primeNgNumberTableFilterCell = item.template;
5015
5016
  break;
5016
5017
  case 'customTableFilterCell':
5017
- this.customTableFilterCell = item.template;
5018
+ this.primeNgCustomTableFilterCell = item.template;
5018
5019
  break;
5019
5020
  }
5020
5021
  });
@@ -5120,11 +5121,11 @@ class InteractiveDataViewComponent {
5120
5121
  this.pageSizeChanged.emit(event);
5121
5122
  }
5122
5123
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: InteractiveDataViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5123
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.11", type: InteractiveDataViewComponent, isStandalone: false, selector: "ocx-interactive-data-view", inputs: { searchConfigPermission: "searchConfigPermission", deletePermission: "deletePermission", editPermission: "editPermission", viewPermission: "viewPermission", deleteActionVisibleField: "deleteActionVisibleField", deleteActionEnabledField: "deleteActionEnabledField", viewActionVisibleField: "viewActionVisibleField", viewActionEnabledField: "viewActionEnabledField", editActionVisibleField: "editActionVisibleField", editActionEnabledField: "editActionEnabledField", tableSelectionEnabledField: "tableSelectionEnabledField", tableAllowSelectAll: "tableAllowSelectAll", 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", showAllOption: "showAllOption", totalRecordsOnServer: "totalRecordsOnServer", layout: "layout", defaultGroupKey: "defaultGroupKey", customGroupKey: "customGroupKey", groupSelectionNoGroupSelectedKey: "groupSelectionNoGroupSelectedKey", currentPageShowingKey: "currentPageShowingKey", currentPageShowingWithTotalOnServerKey: "currentPageShowingWithTotalOnServerKey", additionalActions: "additionalActions", listGridPaginator: "listGridPaginator", tablePaginator: "tablePaginator", disableFilterView: "disableFilterView", filterViewDisplayMode: "filterViewDisplayMode", filterViewChipStyleClass: "filterViewChipStyleClass", filterViewTableStyle: "filterViewTableStyle", filterViewPanelStyle: "filterViewPanelStyle", selectDisplayedChips: "selectDisplayedChips", page: "page", selectedRows: "selectedRows", displayedColumnKeys: "displayedColumnKeys", displayedColumns: "displayedColumns", frozenActionColumn: "frozenActionColumn", actionColumnPosition: "actionColumnPosition", headerStyleClass: "headerStyleClass", contentStyleClass: "contentStyleClass", paginator: "paginator", data: "data" }, outputs: { filtered: "filtered", sorted: "sorted", deleteItem: "deleteItem", viewItem: "viewItem", editItem: "editItem", dataViewLayoutChange: "dataViewLayoutChange", displayedColumnsChange: "displayedColumnsChange", displayedColumnKeysChange: "displayedColumnKeysChange", selectionChanged: "selectionChanged", pageChanged: "pageChanged", pageSizeChanged: "pageSizeChanged", componentStateChanged: "componentStateChanged" }, 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 }, { propertyName: "listValue", first: true, predicate: ["listValue"], descendants: true }, { propertyName: "translationKeyListValue", first: true, predicate: ["translationKeyListValue"], descendants: true }, { propertyName: "numberListValue", first: true, predicate: ["numberListValue"], descendants: true }, { propertyName: "relativeDateListValue", first: true, predicate: ["relativeDateListValue"], descendants: true }, { propertyName: "customListValue", first: true, predicate: ["customListValue"], descendants: true }, { propertyName: "stringListValue", first: true, predicate: ["stringListValue"], descendants: true }, { propertyName: "dateListValue", first: true, predicate: ["dateListValue"], descendants: true }, { propertyName: "tableFilterCell", first: true, predicate: ["tableFilterCell"], descendants: true }, { propertyName: "dateTableFilterCell", first: true, predicate: ["dateTableFilterCell"], descendants: true }, { propertyName: "relativeDateTableFilterCell", first: true, predicate: ["relativeDateTableFilterCell"], descendants: true }, { propertyName: "translationKeyTableFilterCell", first: true, predicate: ["translationKeyTableFilterCell"], descendants: true }, { propertyName: "stringTableFilterCell", first: true, predicate: ["stringTableFilterCell"], descendants: true }, { propertyName: "numberTableFilterCell", first: true, predicate: ["numberTableFilterCell"], descendants: true }, { propertyName: "customTableFilterCell", first: true, predicate: ["customTableFilterCell"], descendants: true }, { propertyName: "templates", predicate: PrimeTemplate }], viewQueries: [{ propertyName: "dataView", first: true, predicate: DataViewComponent, descendants: true }], ngImport: i0, template: "<div class=\"p-3 border-bottom-1 surface-border\" [ngClass]=\"headerStyleClass\" id=\"interactiveDataViewHeader\">\n <div class=\"flex flex-wrap justify-content-between align-items-center py-1 gap-2\">\n <div class=\"flex flex-wrap justify-content-start align-items-center gap-2\">\n <ocx-data-layout-selection\n [supportedViewLayouts]=\"supportedViewLayouts\"\n [layout]=\"layout\"\n (dataViewLayoutChange)=\"onDataViewLayoutChange($event)\"\n (componentStateChanged)=\"dataLayoutComponentState$.next($event)\"\n ></ocx-data-layout-selection>\n @if (!disableFilterView) {\n <ocx-filter-view\n [filters]=\"filters\"\n [columns]=\"columns\"\n [templates]=\"templates$ | async\"\n [displayMode]=\"filterViewDisplayMode\"\n [selectDisplayedChips]=\"selectDisplayedChips\"\n [chipStyleClass]=\"filterViewChipStyleClass\"\n [tableStyle]=\"filterViewTableStyle\"\n (filtered)=\"filtering($event)\"\n (componentStateChanged)=\"filterViewComponentState$.next($event)\"\n ></ocx-filter-view>\n }\n </div>\n\n @if (topCenter) {\n <div>\n <ng-container [ngTemplateOutlet]=\"topCenter\"> </ng-container>\n </div>\n } @if (layout !== 'table') {\n <div class=\"flex align-items-center gap-2\">\n <ocx-data-list-grid-sorting\n [sortDirection]=\"sortDirection\"\n [sortField]=\"sortField\"\n [columns]=\"(displayedColumns$ | async) ?? []\"\n [sortStates]=\"sortStates\"\n (sortChange)=\"onSortChange($event)\"\n (sortDirectionChange)=\"onSortDirectionChange($event)\"\n (componentStateChanged)=\"dataListGridSortingComponentState$.next($event)\"\n ></ocx-data-list-grid-sorting>\n </div>\n }\n\n <div\n [ngStyle]=\"layout !== 'table' ? {\n 'position': 'absolute'\n } : {}\"\n class=\"flex flex-wrap justify-content-between align-items-center gap-2\"\n >\n @if (isColumnGroupSelectionComponentDefined$ | async) { @if (displayedColumnKeys$ | async; as displayedColumnKeys)\n {\n <ocx-slot\n [ngStyle]=\"layout !== 'table' ? {'display' : 'none'} : {}\"\n *ocxIfPermission=\"searchConfigPermission; elseTemplate: defaultColumnGroupSelectionComponent\"\n name=\"{{columnGroupSlotName}}\"\n [inputs]=\"{ placeholderKey: groupSelectionNoGroupSelectedKey, defaultGroupKey: defaultGroupKey, customGroupKey: customGroupKey, columns: columns, selectedGroupKey: selectedGroupKey, layout: layout, displayedColumnsIds: displayedColumnKeys }\"\n [outputs]=\"{ groupSelectionChanged: groupSelectionChangedSlotEmitter }\"\n >\n <ng-template #skeleton>\n <div class=\"flex\">\n <p-skeleton width=\"18rem\" height=\"3rem\"></p-skeleton>\n </div>\n </ng-template>\n </ocx-slot>\n } } @else {\n <ng-container [ngTemplateOutlet]=\"defaultColumnGroupSelectionComponent\"></ng-container>\n } @if (layout === 'table') {\n <ocx-custom-group-column-selector\n [columns]=\"columns\"\n [displayedColumns]=\"(displayedColumns$ | async) ?? []\"\n [customGroupKey]=\"customGroupKey\"\n (columnSelectionChanged)=\"onColumnSelectionChange($event)\"\n [frozenActionColumn]=\"frozenActionColumn\"\n [actionColumnPosition]=\"actionColumnPosition\"\n (actionColumnConfigChanged)=\"onActionColumnConfigChange($event)\"\n (componentStateChanged)=\"customGroupColumnSelectorComponentState$.next($event)\"\n ></ocx-custom-group-column-selector>\n }\n </div>\n </div>\n</div>\n<div class=\"p-3\" [ngClass]=\"contentStyleClass\" id=\"interactiveDataViewContent\">\n <ocx-data-view\n [columns]=\"(displayedColumns$ | async) ?? []\"\n [sortStates]=\"sortStates\"\n [sortField]=\"sortField\"\n [filters]=\"filters\"\n [data]=\"data\"\n [sortDirection]=\"sortDirection\"\n [titleLineId]=\"titleLineId\"\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 (pageSizeChanged)=\"onPageSizeChange($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 [listValueTemplate]=\"_listValue ? listValue : undefined\"\n [translationKeyListValueTemplate]=\"_translationKeyListValue ? translationKeyListValue : undefined\"\n [numberListValueTemplate]=\"_numberListValue ? numberListValue : undefined\"\n [relativeDateListValueTemplate]=\"_relativeDateListValue ? relativeDateListValue : undefined\"\n [customListValueTemplate]=\"_customListValue ? customListValue : undefined\"\n [stringListValueTemplate]=\"_stringListValue ? stringListValue : undefined\"\n [dateListValueTemplate]=\"_dateListValue ? dateListValue : undefined\"\n [gridItemTemplate]=\"_gridItem ? gridItem : undefined\"\n [tableFilterCellTemplate]=\"_tableFilterCell ? tableFilterCell : undefined\"\n [dateTableFilterCellTemplate]=\"_dateTableFilterCell ? dateTableFilterCell : undefined\"\n [customTableFilterCellTemplate]=\"_customTableFilterCell ? customTableFilterCell : undefined\"\n [numberTableFilterCellTemplate]=\"_numberTableFilterCell ? numberTableFilterCell : undefined\"\n [stringTableFilterCellTemplate]=\"_stringTableFilterCell ? stringTableFilterCell : undefined\"\n [relativeDateTableFilterCellTemplate]=\"_relativeDateTableFilterCell ? relativeDateTableFilterCell : undefined\"\n [translationKeyTableFilterCellTemplate]=\"_translationKeyTableFilterCell ? translationKeyTableFilterCell : undefined\"\n (sorted)=\"sorting($event)\"\n (filtered)=\"filtering($event)\"\n [totalRecordsOnServer]=\"totalRecordsOnServer\"\n [currentPageShowingKey]=\"currentPageShowingKey\"\n [currentPageShowingWithTotalOnServerKey]=\"currentPageShowingWithTotalOnServerKey\"\n (componentStateChanged)=\"dataViewComponentState$.next($event)\"\n [parentTemplates]=\"templates$ | async\"\n [tableAllowSelectAll]=\"tableAllowSelectAll\"\n [tableSelectionEnabledField]=\"tableSelectionEnabledField\"\n >\n </ocx-data-view>\n</div>\n\n<ng-template #defaultColumnGroupSelectionComponent>\n @if (layout === 'table') {\n <ocx-column-group-selection\n [selectedGroupKey]=\"selectedGroupKey ?? defaultGroupKey\"\n [columns]=\"columns\"\n [defaultGroupKey]=\"defaultGroupKey !== customGroupKey ? defaultGroupKey : ''\"\n [customGroupKey]=\"customGroupKey\"\n [placeholderKey]=\"groupSelectionNoGroupSelectedKey\"\n (groupSelectionChanged)=\"onColumnGroupSelectionChange($event)\"\n (componentStateChanged)=\"columnGroupSelectionComponentState$.next($event)\"\n ></ocx-column-group-selection>\n }\n</ng-template>\n\n<ng-template #stringTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_stringTableCell) {\n <ng-container [ngTemplateOutlet]=\"_stringTableCell\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #tableDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableDateCell) {\n <ng-container [ngTemplateOutlet]=\"_tableDateCell\" [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #dateTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_dateTableCell) {\n <ng-container [ngTemplateOutlet]=\"_dateTableCell\" [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #tableRelativeDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableRelativeDateCell) {\n <ng-container\n [ngTemplateOutlet]=\"_tableRelativeDateCell\"\n [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #relativeDateTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_relativeDateTableCell) {\n <ng-container\n [ngTemplateOutlet]=\"_relativeDateTableCell\"\n [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #tableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableCell) {\n <ng-container [ngTemplateOutlet]=\"_tableCell\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #tableTranslationKeyCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableTranslationKeyCell) {\n <ng-container\n [ngTemplateOutlet]=\"_tableTranslationKeyCell\"\n [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #translationKeyTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_translationKeyTableCell) {\n <ng-container\n [ngTemplateOutlet]=\"_translationKeyTableCell\"\n [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #gridItemSubtitleLines let-item>\n @if (_gridItemSubtitleLines) {\n <ng-container [ngTemplateOutlet]=\"_gridItemSubtitleLines\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n </ng-container>\n }\n</ng-template>\n<ng-template #listItemSubtitleLines let-item>\n @if (_listItemSubtitleLines) {\n <ng-container [ngTemplateOutlet]=\"_listItemSubtitleLines\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #gridItem let-item>\n @if (_gridItem) {\n <ng-container [ngTemplateOutlet]=\"_gridItem\" [ngTemplateOutletContext]=\"{$implicit:item}\"> </ng-container>\n }</ng-template\n>\n<ng-template #listItem let-item>\n @if (_listItem) {\n <ng-container [ngTemplateOutlet]=\"_listItem\" [ngTemplateOutletContext]=\"{$implicit:item}\"> </ng-container>\n }</ng-template\n>\n<ng-template #listValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_listValue) {\n <ng-container [ngTemplateOutlet]=\"_listValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #translationKeyListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_translationKeyListValue) {\n <ng-container\n [ngTemplateOutlet]=\"_translationKeyListValue\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #numberListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_numberListValue) {\n <ng-container [ngTemplateOutlet]=\"_numberListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #relativeDateListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_relativeDateListValue) {\n <ng-container\n [ngTemplateOutlet]=\"_relativeDateListValue\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #customListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_customListValue) {\n <ng-container [ngTemplateOutlet]=\"_customListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #stringListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_stringListValue) {\n <ng-container [ngTemplateOutlet]=\"_stringListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #dateListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_dateListValue) {\n <ng-container [ngTemplateOutlet]=\"_dateListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n\n<ng-template #stringTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_stringTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_stringTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #numberTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_numberTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_numberTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #customTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_customTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_customTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #dateTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_dateTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_dateTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #relativeDateTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_relativeDateTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_relativeDateTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #translationKeyTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_translationKeyTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_translationKeyTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i5.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: i5$1.SlotComponent, selector: "ocx-slot[name]", inputs: ["name", "slotStyles", "slotClasses", "inputs", "outputs"] }, { kind: "component", type: ColumnGroupSelectionComponent, selector: "ocx-column-group-selection", inputs: ["selectedGroupKey", "columns", "placeholderKey", "defaultGroupKey", "customGroupKey"], outputs: ["groupSelectionChanged", "componentStateChanged"] }, { kind: "component", type: CustomGroupColumnSelectorComponent, selector: "ocx-custom-group-column-selector", inputs: ["columns", "displayedColumns", "customGroupKey", "dialogTitle", "dialogTitleKey", "openButtonTitle", "openButtonTitleKey", "openButtonAriaLabel", "openButtonAriaLabelKey", "saveButtonLabel", "saveButtonLabelKey", "saveButtonAriaLabel", "saveButtonAriaLabelKey", "cancelButtonLabel", "cancelButtonLabelKey", "cancelButtonAriaLabel", "cancelButtonAriaLabelKey", "activeColumnsLabel", "activeColumnsLabelKey", "inactiveColumnsLabel", "inactiveColumnsLabelKey", "frozenActionColumn", "actionColumnPosition"], outputs: ["columnSelectionChanged", "actionColumnConfigChanged", "componentStateChanged"] }, { kind: "component", type: DataLayoutSelectionComponent, selector: "ocx-data-layout-selection", inputs: ["supportedViewLayouts", "layout"], outputs: ["dataViewLayoutChange", "componentStateChanged"] }, { kind: "component", type: DataListGridSortingComponent, selector: "ocx-data-list-grid-sorting", inputs: ["columns", "sortStates", "sortDirection", "sortField"], outputs: ["sortChange", "sortDirectionChange", "componentStateChanged", "columnsChange"] }, { kind: "component", type: DataViewComponent, selector: "ocx-data-view", inputs: ["deletePermission", "editPermission", "viewPermission", "deleteActionVisibleField", "deleteActionEnabledField", "viewActionVisibleField", "viewActionEnabledField", "editActionVisibleField", "editActionEnabledField", "tableSelectionEnabledField", "tableAllowSelectAll", "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", "showAllOption", "stringTableCellTemplate", "numberTableCellTemplate", "customTableCellTemplate", "dateTableCellTemplate", "tableDateCellTemplate", "tableCellTemplate", "translationKeyTableCellTemplate", "tableTranslationKeyCellTemplate", "gridItemSubtitleLinesTemplate", "listItemSubtitleLinesTemplate", "gridItemTemplate", "listItemTemplate", "relativeDateTableCellTemplate", "tableRelativeDateCellTemplate", "listValueTemplate", "translationKeyListValueTemplate", "numberListValueTemplate", "relativeDateListValueTemplate", "customListValueTemplate", "stringListValueTemplate", "dateListValueTemplate", "tableFilterCellTemplate", "dateTableFilterCellTemplate", "relativeDateTableFilterCellTemplate", "translationKeyTableFilterCellTemplate", "stringTableFilterCellTemplate", "numberTableFilterCellTemplate", "customTableFilterCellTemplate", "additionalActions", "parentTemplates"], outputs: ["filtered", "sorted", "deleteItem", "viewItem", "editItem", "selectionChanged", "pageChanged", "pageSizeChanged", "componentStateChanged"] }, { kind: "directive", type: IfPermissionDirective, selector: "[ocxIfPermission], [ocxIfNotPermission]", inputs: ["ocxIfPermission", "ocxIfNotPermission", "onMissingPermission", "ocxIfPermissionPermissions", "ocxIfNotPermissionPermissions", "ocxIfPermissionElseTemplate", "ocxIfNotPermissionElseTemplate"] }, { kind: "component", type: FilterViewComponent, selector: "ocx-filter-view", inputs: ["filters", "columns", "displayMode", "selectDisplayedChips", "chipStyleClass", "tableStyle", "panelStyle", "templates"], outputs: ["filtered", "componentStateChanged"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
5124
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.11", type: InteractiveDataViewComponent, isStandalone: false, selector: "ocx-interactive-data-view", inputs: { searchConfigPermission: "searchConfigPermission", deletePermission: "deletePermission", editPermission: "editPermission", viewPermission: "viewPermission", deleteActionVisibleField: "deleteActionVisibleField", deleteActionEnabledField: "deleteActionEnabledField", viewActionVisibleField: "viewActionVisibleField", viewActionEnabledField: "viewActionEnabledField", editActionVisibleField: "editActionVisibleField", editActionEnabledField: "editActionEnabledField", tableSelectionEnabledField: "tableSelectionEnabledField", tableAllowSelectAll: "tableAllowSelectAll", 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", showAllOption: "showAllOption", totalRecordsOnServer: "totalRecordsOnServer", layout: "layout", defaultGroupKey: "defaultGroupKey", customGroupKey: "customGroupKey", groupSelectionNoGroupSelectedKey: "groupSelectionNoGroupSelectedKey", currentPageShowingKey: "currentPageShowingKey", currentPageShowingWithTotalOnServerKey: "currentPageShowingWithTotalOnServerKey", additionalActions: "additionalActions", listGridPaginator: "listGridPaginator", tablePaginator: "tablePaginator", disableFilterView: "disableFilterView", filterViewDisplayMode: "filterViewDisplayMode", filterViewChipStyleClass: "filterViewChipStyleClass", filterViewTableStyle: "filterViewTableStyle", filterViewPanelStyle: "filterViewPanelStyle", selectDisplayedChips: "selectDisplayedChips", page: "page", selectedRows: "selectedRows", displayedColumnKeys: "displayedColumnKeys", displayedColumns: "displayedColumns", frozenActionColumn: "frozenActionColumn", actionColumnPosition: "actionColumnPosition", headerStyleClass: "headerStyleClass", contentStyleClass: "contentStyleClass", paginator: "paginator", data: "data" }, outputs: { filtered: "filtered", sorted: "sorted", deleteItem: "deleteItem", viewItem: "viewItem", editItem: "editItem", dataViewLayoutChange: "dataViewLayoutChange", displayedColumnsChange: "displayedColumnsChange", displayedColumnKeysChange: "displayedColumnKeysChange", selectionChanged: "selectionChanged", pageChanged: "pageChanged", pageSizeChanged: "pageSizeChanged", componentStateChanged: "componentStateChanged" }, 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 }, { propertyName: "listValue", first: true, predicate: ["listValue"], descendants: true }, { propertyName: "translationKeyListValue", first: true, predicate: ["translationKeyListValue"], descendants: true }, { propertyName: "numberListValue", first: true, predicate: ["numberListValue"], descendants: true }, { propertyName: "relativeDateListValue", first: true, predicate: ["relativeDateListValue"], descendants: true }, { propertyName: "customListValue", first: true, predicate: ["customListValue"], descendants: true }, { propertyName: "stringListValue", first: true, predicate: ["stringListValue"], descendants: true }, { propertyName: "dateListValue", first: true, predicate: ["dateListValue"], descendants: true }, { propertyName: "tableFilterCell", first: true, predicate: ["tableFilterCell"], descendants: true }, { propertyName: "dateTableFilterCell", first: true, predicate: ["dateTableFilterCell"], descendants: true }, { propertyName: "relativeDateTableFilterCell", first: true, predicate: ["relativeDateTableFilterCell"], descendants: true }, { propertyName: "translationKeyTableFilterCell", first: true, predicate: ["translationKeyTableFilterCell"], descendants: true }, { propertyName: "stringTableFilterCell", first: true, predicate: ["stringTableFilterCell"], descendants: true }, { propertyName: "numberTableFilterCell", first: true, predicate: ["numberTableFilterCell"], descendants: true }, { propertyName: "customTableFilterCell", first: true, predicate: ["customTableFilterCell"], descendants: true }, { propertyName: "templates", predicate: PrimeTemplate }], viewQueries: [{ propertyName: "dataView", first: true, predicate: DataViewComponent, descendants: true }], ngImport: i0, template: "<div class=\"p-3 border-bottom-1 surface-border\" [ngClass]=\"headerStyleClass\" id=\"interactiveDataViewHeader\">\n <div class=\"flex flex-wrap justify-content-between align-items-center py-1 gap-2\">\n <div class=\"flex flex-wrap justify-content-start align-items-center gap-2\">\n <ocx-data-layout-selection\n [supportedViewLayouts]=\"supportedViewLayouts\"\n [layout]=\"layout\"\n (dataViewLayoutChange)=\"onDataViewLayoutChange($event)\"\n (componentStateChanged)=\"dataLayoutComponentState$.next($event)\"\n ></ocx-data-layout-selection>\n @if (!disableFilterView) {\n <ocx-filter-view\n [filters]=\"filters\"\n [columns]=\"columns\"\n [templates]=\"templates$ | async\"\n [displayMode]=\"filterViewDisplayMode\"\n [selectDisplayedChips]=\"selectDisplayedChips\"\n [chipStyleClass]=\"filterViewChipStyleClass\"\n [tableStyle]=\"filterViewTableStyle\"\n (filtered)=\"filtering($event)\"\n (componentStateChanged)=\"filterViewComponentState$.next($event)\"\n ></ocx-filter-view>\n }\n </div>\n\n @if (topCenter) {\n <div>\n <ng-container [ngTemplateOutlet]=\"topCenter\"> </ng-container>\n </div>\n } @if (layout !== 'table') {\n <div class=\"flex align-items-center gap-2\">\n <ocx-data-list-grid-sorting\n [sortDirection]=\"sortDirection\"\n [sortField]=\"sortField\"\n [columns]=\"(displayedColumns$ | async) ?? []\"\n [sortStates]=\"sortStates\"\n (sortChange)=\"onSortChange($event)\"\n (sortDirectionChange)=\"onSortDirectionChange($event)\"\n (componentStateChanged)=\"dataListGridSortingComponentState$.next($event)\"\n ></ocx-data-list-grid-sorting>\n </div>\n }\n\n <div\n [ngStyle]=\"layout !== 'table' ? {\n 'position': 'absolute'\n } : {}\"\n class=\"flex flex-wrap justify-content-between align-items-center gap-2\"\n >\n @if (isColumnGroupSelectionComponentDefined$ | async) { @if (displayedColumnKeys$ | async; as displayedColumnKeys)\n {\n <ocx-slot\n [ngStyle]=\"layout !== 'table' ? {'display' : 'none'} : {}\"\n *ocxIfPermission=\"searchConfigPermission; elseTemplate: defaultColumnGroupSelectionComponent\"\n name=\"{{columnGroupSlotName}}\"\n [inputs]=\"{ placeholderKey: groupSelectionNoGroupSelectedKey, defaultGroupKey: defaultGroupKey, customGroupKey: customGroupKey, columns: columns, selectedGroupKey: selectedGroupKey, layout: layout, displayedColumnsIds: displayedColumnKeys }\"\n [outputs]=\"{ groupSelectionChanged: groupSelectionChangedSlotEmitter }\"\n >\n <ng-template #skeleton>\n <div class=\"flex\">\n <p-skeleton width=\"18rem\" height=\"3rem\"></p-skeleton>\n </div>\n </ng-template>\n </ocx-slot>\n } } @else {\n <ng-container [ngTemplateOutlet]=\"defaultColumnGroupSelectionComponent\"></ng-container>\n } @if (layout === 'table') {\n <ocx-custom-group-column-selector\n [columns]=\"columns\"\n [displayedColumns]=\"(displayedColumns$ | async) ?? []\"\n [customGroupKey]=\"customGroupKey\"\n (columnSelectionChanged)=\"onColumnSelectionChange($event)\"\n [frozenActionColumn]=\"frozenActionColumn\"\n [actionColumnPosition]=\"actionColumnPosition\"\n (actionColumnConfigChanged)=\"onActionColumnConfigChange($event)\"\n (componentStateChanged)=\"customGroupColumnSelectorComponentState$.next($event)\"\n ></ocx-custom-group-column-selector>\n }\n </div>\n </div>\n</div>\n<div class=\"p-3\" [ngClass]=\"contentStyleClass\" id=\"interactiveDataViewContent\">\n <ocx-data-view\n [columns]=\"(displayedColumns$ | async) ?? []\"\n [sortStates]=\"sortStates\"\n [sortField]=\"sortField\"\n [filters]=\"filters\"\n [data]=\"data\"\n [sortDirection]=\"sortDirection\"\n [titleLineId]=\"titleLineId\"\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 (pageSizeChanged)=\"onPageSizeChange($event)\"\n [selectedRows]=\"selectedRows\"\n [frozenActionColumn]=\"frozenActionColumn\"\n [actionColumnPosition]=\"actionColumnPosition\"\n [stringTableCellTemplate]=\"primeNgStringTableCell ?? _stringTableCell\"\n [numberTableCellTemplate]=\"primeNgNumberTableCell ?? _numberTableCell\"\n [customTableCellTemplate]=\"primeNgCustomTableCell ?? _customTableCell\"\n [dateTableCellTemplate]=\"primeNgDateTableCell ?? _dateTableCell ?? primeNgTableDateCell ?? _tableDateCell\"\n [relativeDateTableCellTemplate]=\"primeNgRelativeDateTableCell ?? _relativeDateTableCell ?? primeNgTableRelativeDateCell ?? _tableRelativeDateCell\"\n [tableCellTemplate]=\"primeNgTableCell ?? _tableCell\"\n [translationKeyTableCellTemplate]=\"primeNgTranslationKeyTableCell ?? _translationKeyTableCell ?? primeNgTableTranslationKeyCell ?? _tableTranslationKeyCell\"\n [gridItemSubtitleLinesTemplate]=\"primeNgGridItemSubtitleLines ?? _gridItemSubtitleLines\"\n [listItemSubtitleLinesTemplate]=\"primeNgListItemSubtitleLines ?? _listItemSubtitleLines\"\n [listItemTemplate]=\"primeNgListItem ?? _listItem\"\n [listValueTemplate]=\"primeNgListValue ?? _listValue\"\n [translationKeyListValueTemplate]=\"primeNgTranslationKeyListValue ?? _translationKeyListValue\"\n [numberListValueTemplate]=\"primeNgNumberListValue ?? _numberListValue\"\n [relativeDateListValueTemplate]=\"primeNgRelativeDateListValue ?? _relativeDateListValue\"\n [customListValueTemplate]=\"primeNgCustomListValue ?? _customListValue\"\n [stringListValueTemplate]=\"primeNgStringListValue ?? _stringListValue\"\n [dateListValueTemplate]=\"primeNgDateListValue ?? _dateListValue\"\n [gridItemTemplate]=\"primeNgGridItem ?? _gridItem\"\n [tableFilterCellTemplate]=\"primeNgTableFilterCell ?? _tableFilterCell\"\n [dateTableFilterCellTemplate]=\"primeNgDateTableFilterCell ?? _dateTableFilterCell\"\n [customTableFilterCellTemplate]=\"primeNgCustomTableFilterCell ?? _customTableFilterCell\"\n [numberTableFilterCellTemplate]=\"primeNgNumberTableFilterCell ?? _numberTableFilterCell\"\n [stringTableFilterCellTemplate]=\"primeNgStringTableFilterCell ?? _stringTableFilterCell\"\n [relativeDateTableFilterCellTemplate]=\"primeNgRelativeDateTableFilterCell ?? _relativeDateTableFilterCell\"\n [translationKeyTableFilterCellTemplate]=\"primeNgTranslationKeyTableFilterCell ?? _translationKeyTableFilterCell\"\n (sorted)=\"sorting($event)\"\n (filtered)=\"filtering($event)\"\n [totalRecordsOnServer]=\"totalRecordsOnServer\"\n [currentPageShowingKey]=\"currentPageShowingKey\"\n [currentPageShowingWithTotalOnServerKey]=\"currentPageShowingWithTotalOnServerKey\"\n (componentStateChanged)=\"dataViewComponentState$.next($event)\"\n [parentTemplates]=\"templates$ | async\"\n [tableAllowSelectAll]=\"tableAllowSelectAll\"\n [tableSelectionEnabledField]=\"tableSelectionEnabledField\"\n >\n </ocx-data-view>\n</div>\n\n<ng-template #defaultColumnGroupSelectionComponent>\n @if (layout === 'table') {\n <ocx-column-group-selection\n [selectedGroupKey]=\"selectedGroupKey ?? defaultGroupKey\"\n [columns]=\"columns\"\n [defaultGroupKey]=\"defaultGroupKey !== customGroupKey ? defaultGroupKey : ''\"\n [customGroupKey]=\"customGroupKey\"\n [placeholderKey]=\"groupSelectionNoGroupSelectedKey\"\n (groupSelectionChanged)=\"onColumnGroupSelectionChange($event)\"\n (componentStateChanged)=\"columnGroupSelectionComponentState$.next($event)\"\n ></ocx-column-group-selection>\n }\n</ng-template>\n\n<ng-template #stringTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_stringTableCell) {\n <ng-container [ngTemplateOutlet]=\"_stringTableCell\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #numberTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_numberTableCell) {\n <ng-container [ngTemplateOutlet]=\"_numberTableCell\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #tableDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableDateCell) {\n <ng-container [ngTemplateOutlet]=\"_tableDateCell\" [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #dateTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_dateTableCell) {\n <ng-container [ngTemplateOutlet]=\"_dateTableCell\" [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #tableRelativeDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableRelativeDateCell) {\n <ng-container\n [ngTemplateOutlet]=\"_tableRelativeDateCell\"\n [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #relativeDateTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_relativeDateTableCell) {\n <ng-container\n [ngTemplateOutlet]=\"_relativeDateTableCell\"\n [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #tableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableCell) {\n <ng-container [ngTemplateOutlet]=\"_tableCell\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #tableTranslationKeyCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableTranslationKeyCell) {\n <ng-container\n [ngTemplateOutlet]=\"_tableTranslationKeyCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #translationKeyTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_translationKeyTableCell) {\n <ng-container\n [ngTemplateOutlet]=\"_translationKeyTableCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #gridItemSubtitleLines let-item>\n @if (_gridItemSubtitleLines) {\n <ng-container [ngTemplateOutlet]=\"_gridItemSubtitleLines\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n </ng-container>\n }\n</ng-template>\n<ng-template #listItemSubtitleLines let-item>\n @if (_listItemSubtitleLines) {\n <ng-container [ngTemplateOutlet]=\"_listItemSubtitleLines\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #gridItem let-item>\n @if (_gridItem) {\n <ng-container [ngTemplateOutlet]=\"_gridItem\" [ngTemplateOutletContext]=\"{$implicit:item}\"> </ng-container>\n }</ng-template\n>\n<ng-template #listItem let-item>\n @if (_listItem) {\n <ng-container [ngTemplateOutlet]=\"_listItem\" [ngTemplateOutletContext]=\"{$implicit:item}\"> </ng-container>\n }</ng-template\n>\n<ng-template #listValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_listValue) {\n <ng-container [ngTemplateOutlet]=\"_listValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #translationKeyListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_translationKeyListValue) {\n <ng-container\n [ngTemplateOutlet]=\"_translationKeyListValue\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #numberListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_numberListValue) {\n <ng-container [ngTemplateOutlet]=\"_numberListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #relativeDateListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_relativeDateListValue) {\n <ng-container\n [ngTemplateOutlet]=\"_relativeDateListValue\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #customListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_customListValue) {\n <ng-container [ngTemplateOutlet]=\"_customListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #stringListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_stringListValue) {\n <ng-container [ngTemplateOutlet]=\"_stringListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #dateListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_dateListValue) {\n <ng-container [ngTemplateOutlet]=\"_dateListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n\n<ng-template #stringTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_stringTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_stringTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #numberTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_numberTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_numberTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #customTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_customTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_customTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #dateTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_dateTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_dateTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #relativeDateTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_relativeDateTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_relativeDateTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #translationKeyTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_translationKeyTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_translationKeyTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i5.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: i5$1.SlotComponent, selector: "ocx-slot[name]", inputs: ["name", "slotStyles", "slotClasses", "inputs", "outputs"] }, { kind: "component", type: ColumnGroupSelectionComponent, selector: "ocx-column-group-selection", inputs: ["selectedGroupKey", "columns", "placeholderKey", "defaultGroupKey", "customGroupKey"], outputs: ["groupSelectionChanged", "componentStateChanged"] }, { kind: "component", type: CustomGroupColumnSelectorComponent, selector: "ocx-custom-group-column-selector", inputs: ["columns", "displayedColumns", "customGroupKey", "dialogTitle", "dialogTitleKey", "openButtonTitle", "openButtonTitleKey", "openButtonAriaLabel", "openButtonAriaLabelKey", "saveButtonLabel", "saveButtonLabelKey", "saveButtonAriaLabel", "saveButtonAriaLabelKey", "cancelButtonLabel", "cancelButtonLabelKey", "cancelButtonAriaLabel", "cancelButtonAriaLabelKey", "activeColumnsLabel", "activeColumnsLabelKey", "inactiveColumnsLabel", "inactiveColumnsLabelKey", "frozenActionColumn", "actionColumnPosition"], outputs: ["columnSelectionChanged", "actionColumnConfigChanged", "componentStateChanged"] }, { kind: "component", type: DataLayoutSelectionComponent, selector: "ocx-data-layout-selection", inputs: ["supportedViewLayouts", "layout"], outputs: ["dataViewLayoutChange", "componentStateChanged"] }, { kind: "component", type: DataListGridSortingComponent, selector: "ocx-data-list-grid-sorting", inputs: ["columns", "sortStates", "sortDirection", "sortField"], outputs: ["sortChange", "sortDirectionChange", "componentStateChanged", "columnsChange"] }, { kind: "component", type: DataViewComponent, selector: "ocx-data-view", inputs: ["deletePermission", "editPermission", "viewPermission", "deleteActionVisibleField", "deleteActionEnabledField", "viewActionVisibleField", "viewActionEnabledField", "editActionVisibleField", "editActionEnabledField", "tableSelectionEnabledField", "tableAllowSelectAll", "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", "showAllOption", "stringTableCellTemplate", "numberTableCellTemplate", "customTableCellTemplate", "dateTableCellTemplate", "tableDateCellTemplate", "tableCellTemplate", "translationKeyTableCellTemplate", "tableTranslationKeyCellTemplate", "gridItemSubtitleLinesTemplate", "listItemSubtitleLinesTemplate", "gridItemTemplate", "listItemTemplate", "relativeDateTableCellTemplate", "tableRelativeDateCellTemplate", "listValueTemplate", "translationKeyListValueTemplate", "numberListValueTemplate", "relativeDateListValueTemplate", "customListValueTemplate", "stringListValueTemplate", "dateListValueTemplate", "tableFilterCellTemplate", "dateTableFilterCellTemplate", "relativeDateTableFilterCellTemplate", "translationKeyTableFilterCellTemplate", "stringTableFilterCellTemplate", "numberTableFilterCellTemplate", "customTableFilterCellTemplate", "additionalActions", "parentTemplates"], outputs: ["filtered", "sorted", "deleteItem", "viewItem", "editItem", "selectionChanged", "pageChanged", "pageSizeChanged", "componentStateChanged"] }, { kind: "directive", type: IfPermissionDirective, selector: "[ocxIfPermission], [ocxIfNotPermission]", inputs: ["ocxIfPermission", "ocxIfNotPermission", "onMissingPermission", "ocxIfPermissionPermissions", "ocxIfNotPermissionPermissions", "ocxIfPermissionElseTemplate", "ocxIfNotPermissionElseTemplate"] }, { kind: "component", type: FilterViewComponent, selector: "ocx-filter-view", inputs: ["filters", "columns", "displayMode", "selectDisplayedChips", "chipStyleClass", "tableStyle", "panelStyle", "templates"], outputs: ["filtered", "componentStateChanged"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
5124
5125
  }
5125
5126
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: InteractiveDataViewComponent, decorators: [{
5126
5127
  type: Component,
5127
- args: [{ standalone: false, selector: 'ocx-interactive-data-view', providers: [{ provide: 'InteractiveDataViewComponent', useExisting: InteractiveDataViewComponent }], template: "<div class=\"p-3 border-bottom-1 surface-border\" [ngClass]=\"headerStyleClass\" id=\"interactiveDataViewHeader\">\n <div class=\"flex flex-wrap justify-content-between align-items-center py-1 gap-2\">\n <div class=\"flex flex-wrap justify-content-start align-items-center gap-2\">\n <ocx-data-layout-selection\n [supportedViewLayouts]=\"supportedViewLayouts\"\n [layout]=\"layout\"\n (dataViewLayoutChange)=\"onDataViewLayoutChange($event)\"\n (componentStateChanged)=\"dataLayoutComponentState$.next($event)\"\n ></ocx-data-layout-selection>\n @if (!disableFilterView) {\n <ocx-filter-view\n [filters]=\"filters\"\n [columns]=\"columns\"\n [templates]=\"templates$ | async\"\n [displayMode]=\"filterViewDisplayMode\"\n [selectDisplayedChips]=\"selectDisplayedChips\"\n [chipStyleClass]=\"filterViewChipStyleClass\"\n [tableStyle]=\"filterViewTableStyle\"\n (filtered)=\"filtering($event)\"\n (componentStateChanged)=\"filterViewComponentState$.next($event)\"\n ></ocx-filter-view>\n }\n </div>\n\n @if (topCenter) {\n <div>\n <ng-container [ngTemplateOutlet]=\"topCenter\"> </ng-container>\n </div>\n } @if (layout !== 'table') {\n <div class=\"flex align-items-center gap-2\">\n <ocx-data-list-grid-sorting\n [sortDirection]=\"sortDirection\"\n [sortField]=\"sortField\"\n [columns]=\"(displayedColumns$ | async) ?? []\"\n [sortStates]=\"sortStates\"\n (sortChange)=\"onSortChange($event)\"\n (sortDirectionChange)=\"onSortDirectionChange($event)\"\n (componentStateChanged)=\"dataListGridSortingComponentState$.next($event)\"\n ></ocx-data-list-grid-sorting>\n </div>\n }\n\n <div\n [ngStyle]=\"layout !== 'table' ? {\n 'position': 'absolute'\n } : {}\"\n class=\"flex flex-wrap justify-content-between align-items-center gap-2\"\n >\n @if (isColumnGroupSelectionComponentDefined$ | async) { @if (displayedColumnKeys$ | async; as displayedColumnKeys)\n {\n <ocx-slot\n [ngStyle]=\"layout !== 'table' ? {'display' : 'none'} : {}\"\n *ocxIfPermission=\"searchConfigPermission; elseTemplate: defaultColumnGroupSelectionComponent\"\n name=\"{{columnGroupSlotName}}\"\n [inputs]=\"{ placeholderKey: groupSelectionNoGroupSelectedKey, defaultGroupKey: defaultGroupKey, customGroupKey: customGroupKey, columns: columns, selectedGroupKey: selectedGroupKey, layout: layout, displayedColumnsIds: displayedColumnKeys }\"\n [outputs]=\"{ groupSelectionChanged: groupSelectionChangedSlotEmitter }\"\n >\n <ng-template #skeleton>\n <div class=\"flex\">\n <p-skeleton width=\"18rem\" height=\"3rem\"></p-skeleton>\n </div>\n </ng-template>\n </ocx-slot>\n } } @else {\n <ng-container [ngTemplateOutlet]=\"defaultColumnGroupSelectionComponent\"></ng-container>\n } @if (layout === 'table') {\n <ocx-custom-group-column-selector\n [columns]=\"columns\"\n [displayedColumns]=\"(displayedColumns$ | async) ?? []\"\n [customGroupKey]=\"customGroupKey\"\n (columnSelectionChanged)=\"onColumnSelectionChange($event)\"\n [frozenActionColumn]=\"frozenActionColumn\"\n [actionColumnPosition]=\"actionColumnPosition\"\n (actionColumnConfigChanged)=\"onActionColumnConfigChange($event)\"\n (componentStateChanged)=\"customGroupColumnSelectorComponentState$.next($event)\"\n ></ocx-custom-group-column-selector>\n }\n </div>\n </div>\n</div>\n<div class=\"p-3\" [ngClass]=\"contentStyleClass\" id=\"interactiveDataViewContent\">\n <ocx-data-view\n [columns]=\"(displayedColumns$ | async) ?? []\"\n [sortStates]=\"sortStates\"\n [sortField]=\"sortField\"\n [filters]=\"filters\"\n [data]=\"data\"\n [sortDirection]=\"sortDirection\"\n [titleLineId]=\"titleLineId\"\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 (pageSizeChanged)=\"onPageSizeChange($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 [listValueTemplate]=\"_listValue ? listValue : undefined\"\n [translationKeyListValueTemplate]=\"_translationKeyListValue ? translationKeyListValue : undefined\"\n [numberListValueTemplate]=\"_numberListValue ? numberListValue : undefined\"\n [relativeDateListValueTemplate]=\"_relativeDateListValue ? relativeDateListValue : undefined\"\n [customListValueTemplate]=\"_customListValue ? customListValue : undefined\"\n [stringListValueTemplate]=\"_stringListValue ? stringListValue : undefined\"\n [dateListValueTemplate]=\"_dateListValue ? dateListValue : undefined\"\n [gridItemTemplate]=\"_gridItem ? gridItem : undefined\"\n [tableFilterCellTemplate]=\"_tableFilterCell ? tableFilterCell : undefined\"\n [dateTableFilterCellTemplate]=\"_dateTableFilterCell ? dateTableFilterCell : undefined\"\n [customTableFilterCellTemplate]=\"_customTableFilterCell ? customTableFilterCell : undefined\"\n [numberTableFilterCellTemplate]=\"_numberTableFilterCell ? numberTableFilterCell : undefined\"\n [stringTableFilterCellTemplate]=\"_stringTableFilterCell ? stringTableFilterCell : undefined\"\n [relativeDateTableFilterCellTemplate]=\"_relativeDateTableFilterCell ? relativeDateTableFilterCell : undefined\"\n [translationKeyTableFilterCellTemplate]=\"_translationKeyTableFilterCell ? translationKeyTableFilterCell : undefined\"\n (sorted)=\"sorting($event)\"\n (filtered)=\"filtering($event)\"\n [totalRecordsOnServer]=\"totalRecordsOnServer\"\n [currentPageShowingKey]=\"currentPageShowingKey\"\n [currentPageShowingWithTotalOnServerKey]=\"currentPageShowingWithTotalOnServerKey\"\n (componentStateChanged)=\"dataViewComponentState$.next($event)\"\n [parentTemplates]=\"templates$ | async\"\n [tableAllowSelectAll]=\"tableAllowSelectAll\"\n [tableSelectionEnabledField]=\"tableSelectionEnabledField\"\n >\n </ocx-data-view>\n</div>\n\n<ng-template #defaultColumnGroupSelectionComponent>\n @if (layout === 'table') {\n <ocx-column-group-selection\n [selectedGroupKey]=\"selectedGroupKey ?? defaultGroupKey\"\n [columns]=\"columns\"\n [defaultGroupKey]=\"defaultGroupKey !== customGroupKey ? defaultGroupKey : ''\"\n [customGroupKey]=\"customGroupKey\"\n [placeholderKey]=\"groupSelectionNoGroupSelectedKey\"\n (groupSelectionChanged)=\"onColumnGroupSelectionChange($event)\"\n (componentStateChanged)=\"columnGroupSelectionComponentState$.next($event)\"\n ></ocx-column-group-selection>\n }\n</ng-template>\n\n<ng-template #stringTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_stringTableCell) {\n <ng-container [ngTemplateOutlet]=\"_stringTableCell\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #tableDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableDateCell) {\n <ng-container [ngTemplateOutlet]=\"_tableDateCell\" [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #dateTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_dateTableCell) {\n <ng-container [ngTemplateOutlet]=\"_dateTableCell\" [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #tableRelativeDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableRelativeDateCell) {\n <ng-container\n [ngTemplateOutlet]=\"_tableRelativeDateCell\"\n [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #relativeDateTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_relativeDateTableCell) {\n <ng-container\n [ngTemplateOutlet]=\"_relativeDateTableCell\"\n [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #tableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableCell) {\n <ng-container [ngTemplateOutlet]=\"_tableCell\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #tableTranslationKeyCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableTranslationKeyCell) {\n <ng-container\n [ngTemplateOutlet]=\"_tableTranslationKeyCell\"\n [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #translationKeyTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_translationKeyTableCell) {\n <ng-container\n [ngTemplateOutlet]=\"_translationKeyTableCell\"\n [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #gridItemSubtitleLines let-item>\n @if (_gridItemSubtitleLines) {\n <ng-container [ngTemplateOutlet]=\"_gridItemSubtitleLines\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n </ng-container>\n }\n</ng-template>\n<ng-template #listItemSubtitleLines let-item>\n @if (_listItemSubtitleLines) {\n <ng-container [ngTemplateOutlet]=\"_listItemSubtitleLines\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #gridItem let-item>\n @if (_gridItem) {\n <ng-container [ngTemplateOutlet]=\"_gridItem\" [ngTemplateOutletContext]=\"{$implicit:item}\"> </ng-container>\n }</ng-template\n>\n<ng-template #listItem let-item>\n @if (_listItem) {\n <ng-container [ngTemplateOutlet]=\"_listItem\" [ngTemplateOutletContext]=\"{$implicit:item}\"> </ng-container>\n }</ng-template\n>\n<ng-template #listValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_listValue) {\n <ng-container [ngTemplateOutlet]=\"_listValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #translationKeyListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_translationKeyListValue) {\n <ng-container\n [ngTemplateOutlet]=\"_translationKeyListValue\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #numberListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_numberListValue) {\n <ng-container [ngTemplateOutlet]=\"_numberListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #relativeDateListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_relativeDateListValue) {\n <ng-container\n [ngTemplateOutlet]=\"_relativeDateListValue\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #customListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_customListValue) {\n <ng-container [ngTemplateOutlet]=\"_customListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #stringListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_stringListValue) {\n <ng-container [ngTemplateOutlet]=\"_stringListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #dateListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_dateListValue) {\n <ng-container [ngTemplateOutlet]=\"_dateListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n\n<ng-template #stringTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_stringTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_stringTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #numberTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_numberTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_numberTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #customTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_customTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_customTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #dateTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_dateTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_dateTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #relativeDateTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_relativeDateTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_relativeDateTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #translationKeyTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_translationKeyTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_translationKeyTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n" }]
5128
+ args: [{ standalone: false, selector: 'ocx-interactive-data-view', providers: [{ provide: 'InteractiveDataViewComponent', useExisting: InteractiveDataViewComponent }], template: "<div class=\"p-3 border-bottom-1 surface-border\" [ngClass]=\"headerStyleClass\" id=\"interactiveDataViewHeader\">\n <div class=\"flex flex-wrap justify-content-between align-items-center py-1 gap-2\">\n <div class=\"flex flex-wrap justify-content-start align-items-center gap-2\">\n <ocx-data-layout-selection\n [supportedViewLayouts]=\"supportedViewLayouts\"\n [layout]=\"layout\"\n (dataViewLayoutChange)=\"onDataViewLayoutChange($event)\"\n (componentStateChanged)=\"dataLayoutComponentState$.next($event)\"\n ></ocx-data-layout-selection>\n @if (!disableFilterView) {\n <ocx-filter-view\n [filters]=\"filters\"\n [columns]=\"columns\"\n [templates]=\"templates$ | async\"\n [displayMode]=\"filterViewDisplayMode\"\n [selectDisplayedChips]=\"selectDisplayedChips\"\n [chipStyleClass]=\"filterViewChipStyleClass\"\n [tableStyle]=\"filterViewTableStyle\"\n (filtered)=\"filtering($event)\"\n (componentStateChanged)=\"filterViewComponentState$.next($event)\"\n ></ocx-filter-view>\n }\n </div>\n\n @if (topCenter) {\n <div>\n <ng-container [ngTemplateOutlet]=\"topCenter\"> </ng-container>\n </div>\n } @if (layout !== 'table') {\n <div class=\"flex align-items-center gap-2\">\n <ocx-data-list-grid-sorting\n [sortDirection]=\"sortDirection\"\n [sortField]=\"sortField\"\n [columns]=\"(displayedColumns$ | async) ?? []\"\n [sortStates]=\"sortStates\"\n (sortChange)=\"onSortChange($event)\"\n (sortDirectionChange)=\"onSortDirectionChange($event)\"\n (componentStateChanged)=\"dataListGridSortingComponentState$.next($event)\"\n ></ocx-data-list-grid-sorting>\n </div>\n }\n\n <div\n [ngStyle]=\"layout !== 'table' ? {\n 'position': 'absolute'\n } : {}\"\n class=\"flex flex-wrap justify-content-between align-items-center gap-2\"\n >\n @if (isColumnGroupSelectionComponentDefined$ | async) { @if (displayedColumnKeys$ | async; as displayedColumnKeys)\n {\n <ocx-slot\n [ngStyle]=\"layout !== 'table' ? {'display' : 'none'} : {}\"\n *ocxIfPermission=\"searchConfigPermission; elseTemplate: defaultColumnGroupSelectionComponent\"\n name=\"{{columnGroupSlotName}}\"\n [inputs]=\"{ placeholderKey: groupSelectionNoGroupSelectedKey, defaultGroupKey: defaultGroupKey, customGroupKey: customGroupKey, columns: columns, selectedGroupKey: selectedGroupKey, layout: layout, displayedColumnsIds: displayedColumnKeys }\"\n [outputs]=\"{ groupSelectionChanged: groupSelectionChangedSlotEmitter }\"\n >\n <ng-template #skeleton>\n <div class=\"flex\">\n <p-skeleton width=\"18rem\" height=\"3rem\"></p-skeleton>\n </div>\n </ng-template>\n </ocx-slot>\n } } @else {\n <ng-container [ngTemplateOutlet]=\"defaultColumnGroupSelectionComponent\"></ng-container>\n } @if (layout === 'table') {\n <ocx-custom-group-column-selector\n [columns]=\"columns\"\n [displayedColumns]=\"(displayedColumns$ | async) ?? []\"\n [customGroupKey]=\"customGroupKey\"\n (columnSelectionChanged)=\"onColumnSelectionChange($event)\"\n [frozenActionColumn]=\"frozenActionColumn\"\n [actionColumnPosition]=\"actionColumnPosition\"\n (actionColumnConfigChanged)=\"onActionColumnConfigChange($event)\"\n (componentStateChanged)=\"customGroupColumnSelectorComponentState$.next($event)\"\n ></ocx-custom-group-column-selector>\n }\n </div>\n </div>\n</div>\n<div class=\"p-3\" [ngClass]=\"contentStyleClass\" id=\"interactiveDataViewContent\">\n <ocx-data-view\n [columns]=\"(displayedColumns$ | async) ?? []\"\n [sortStates]=\"sortStates\"\n [sortField]=\"sortField\"\n [filters]=\"filters\"\n [data]=\"data\"\n [sortDirection]=\"sortDirection\"\n [titleLineId]=\"titleLineId\"\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 (pageSizeChanged)=\"onPageSizeChange($event)\"\n [selectedRows]=\"selectedRows\"\n [frozenActionColumn]=\"frozenActionColumn\"\n [actionColumnPosition]=\"actionColumnPosition\"\n [stringTableCellTemplate]=\"primeNgStringTableCell ?? _stringTableCell\"\n [numberTableCellTemplate]=\"primeNgNumberTableCell ?? _numberTableCell\"\n [customTableCellTemplate]=\"primeNgCustomTableCell ?? _customTableCell\"\n [dateTableCellTemplate]=\"primeNgDateTableCell ?? _dateTableCell ?? primeNgTableDateCell ?? _tableDateCell\"\n [relativeDateTableCellTemplate]=\"primeNgRelativeDateTableCell ?? _relativeDateTableCell ?? primeNgTableRelativeDateCell ?? _tableRelativeDateCell\"\n [tableCellTemplate]=\"primeNgTableCell ?? _tableCell\"\n [translationKeyTableCellTemplate]=\"primeNgTranslationKeyTableCell ?? _translationKeyTableCell ?? primeNgTableTranslationKeyCell ?? _tableTranslationKeyCell\"\n [gridItemSubtitleLinesTemplate]=\"primeNgGridItemSubtitleLines ?? _gridItemSubtitleLines\"\n [listItemSubtitleLinesTemplate]=\"primeNgListItemSubtitleLines ?? _listItemSubtitleLines\"\n [listItemTemplate]=\"primeNgListItem ?? _listItem\"\n [listValueTemplate]=\"primeNgListValue ?? _listValue\"\n [translationKeyListValueTemplate]=\"primeNgTranslationKeyListValue ?? _translationKeyListValue\"\n [numberListValueTemplate]=\"primeNgNumberListValue ?? _numberListValue\"\n [relativeDateListValueTemplate]=\"primeNgRelativeDateListValue ?? _relativeDateListValue\"\n [customListValueTemplate]=\"primeNgCustomListValue ?? _customListValue\"\n [stringListValueTemplate]=\"primeNgStringListValue ?? _stringListValue\"\n [dateListValueTemplate]=\"primeNgDateListValue ?? _dateListValue\"\n [gridItemTemplate]=\"primeNgGridItem ?? _gridItem\"\n [tableFilterCellTemplate]=\"primeNgTableFilterCell ?? _tableFilterCell\"\n [dateTableFilterCellTemplate]=\"primeNgDateTableFilterCell ?? _dateTableFilterCell\"\n [customTableFilterCellTemplate]=\"primeNgCustomTableFilterCell ?? _customTableFilterCell\"\n [numberTableFilterCellTemplate]=\"primeNgNumberTableFilterCell ?? _numberTableFilterCell\"\n [stringTableFilterCellTemplate]=\"primeNgStringTableFilterCell ?? _stringTableFilterCell\"\n [relativeDateTableFilterCellTemplate]=\"primeNgRelativeDateTableFilterCell ?? _relativeDateTableFilterCell\"\n [translationKeyTableFilterCellTemplate]=\"primeNgTranslationKeyTableFilterCell ?? _translationKeyTableFilterCell\"\n (sorted)=\"sorting($event)\"\n (filtered)=\"filtering($event)\"\n [totalRecordsOnServer]=\"totalRecordsOnServer\"\n [currentPageShowingKey]=\"currentPageShowingKey\"\n [currentPageShowingWithTotalOnServerKey]=\"currentPageShowingWithTotalOnServerKey\"\n (componentStateChanged)=\"dataViewComponentState$.next($event)\"\n [parentTemplates]=\"templates$ | async\"\n [tableAllowSelectAll]=\"tableAllowSelectAll\"\n [tableSelectionEnabledField]=\"tableSelectionEnabledField\"\n >\n </ocx-data-view>\n</div>\n\n<ng-template #defaultColumnGroupSelectionComponent>\n @if (layout === 'table') {\n <ocx-column-group-selection\n [selectedGroupKey]=\"selectedGroupKey ?? defaultGroupKey\"\n [columns]=\"columns\"\n [defaultGroupKey]=\"defaultGroupKey !== customGroupKey ? defaultGroupKey : ''\"\n [customGroupKey]=\"customGroupKey\"\n [placeholderKey]=\"groupSelectionNoGroupSelectedKey\"\n (groupSelectionChanged)=\"onColumnGroupSelectionChange($event)\"\n (componentStateChanged)=\"columnGroupSelectionComponentState$.next($event)\"\n ></ocx-column-group-selection>\n }\n</ng-template>\n\n<ng-template #stringTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_stringTableCell) {\n <ng-container [ngTemplateOutlet]=\"_stringTableCell\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #numberTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_numberTableCell) {\n <ng-container [ngTemplateOutlet]=\"_numberTableCell\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #tableDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableDateCell) {\n <ng-container [ngTemplateOutlet]=\"_tableDateCell\" [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #dateTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_dateTableCell) {\n <ng-container [ngTemplateOutlet]=\"_dateTableCell\" [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #tableRelativeDateCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableRelativeDateCell) {\n <ng-container\n [ngTemplateOutlet]=\"_tableRelativeDateCell\"\n [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #relativeDateTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_relativeDateTableCell) {\n <ng-container\n [ngTemplateOutlet]=\"_relativeDateTableCell\"\n [ngTemplateOutletContext]=\"{rowObject:rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #tableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableCell) {\n <ng-container [ngTemplateOutlet]=\"_tableCell\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #tableTranslationKeyCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_tableTranslationKeyCell) {\n <ng-container\n [ngTemplateOutlet]=\"_tableTranslationKeyCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #translationKeyTableCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_translationKeyTableCell) {\n <ng-container\n [ngTemplateOutlet]=\"_translationKeyTableCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #gridItemSubtitleLines let-item>\n @if (_gridItemSubtitleLines) {\n <ng-container [ngTemplateOutlet]=\"_gridItemSubtitleLines\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n </ng-container>\n }\n</ng-template>\n<ng-template #listItemSubtitleLines let-item>\n @if (_listItemSubtitleLines) {\n <ng-container [ngTemplateOutlet]=\"_listItemSubtitleLines\" [ngTemplateOutletContext]=\"{$implicit:item}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #gridItem let-item>\n @if (_gridItem) {\n <ng-container [ngTemplateOutlet]=\"_gridItem\" [ngTemplateOutletContext]=\"{$implicit:item}\"> </ng-container>\n }</ng-template\n>\n<ng-template #listItem let-item>\n @if (_listItem) {\n <ng-container [ngTemplateOutlet]=\"_listItem\" [ngTemplateOutletContext]=\"{$implicit:item}\"> </ng-container>\n }</ng-template\n>\n<ng-template #listValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_listValue) {\n <ng-container [ngTemplateOutlet]=\"_listValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #translationKeyListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_translationKeyListValue) {\n <ng-container\n [ngTemplateOutlet]=\"_translationKeyListValue\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #numberListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_numberListValue) {\n <ng-container [ngTemplateOutlet]=\"_numberListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #relativeDateListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_relativeDateListValue) {\n <ng-container\n [ngTemplateOutlet]=\"_relativeDateListValue\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #customListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_customListValue) {\n <ng-container [ngTemplateOutlet]=\"_customListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #stringListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_stringListValue) {\n <ng-container [ngTemplateOutlet]=\"_stringListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n<ng-template #dateListValue let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_dateListValue) {\n <ng-container [ngTemplateOutlet]=\"_dateListValue\" [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\">\n </ng-container>\n }</ng-template\n>\n\n<ng-template #stringTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_stringTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_stringTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #numberTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_numberTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_numberTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #customTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_customTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_customTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #dateTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_dateTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_dateTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #relativeDateTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_relativeDateTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_relativeDateTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n<ng-template #translationKeyTableFilterCell let-rowObject=\"rowObject\" let-column=\"column\">\n @if (_translationKeyTableFilterCell) {\n <ng-container\n [ngTemplateOutlet]=\"_translationKeyTableFilterCell\"\n [ngTemplateOutletContext]=\"{rowObject: rowObject, column:column}\"\n >\n </ng-container>\n }</ng-template\n>\n" }]
5128
5129
  }], ctorParameters: () => [], propDecorators: { dataView: [{
5129
5130
  type: ViewChild,
5130
5131
  args: [DataViewComponent]
@@ -5368,32 +5369,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
5368
5369
  type: Input
5369
5370
  }] } });
5370
5371
 
5371
- /**
5372
- * Show this data not found page component if the main entity of a page could not be loaded.
5373
- */
5374
- class DataLoadingErrorComponent {
5375
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DataLoadingErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5376
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.11", type: DataLoadingErrorComponent, isStandalone: false, selector: "ocx-data-loading-error", ngImport: i0, template: `<div class="p-4">
5377
- <h1>{{ 'OCX_DATA_LOADING_ERROR.TITLE' | translate }}</h1>
5378
- <div style="white-space: pre-line">
5379
- {{ 'OCX_DATA_LOADING_ERROR.MESSAGE' | translate }}
5380
- </div>
5381
- </div> `, isInline: true, dependencies: [{ kind: "pipe", type: i8.TranslatePipe, name: "translate" }] }); }
5382
- }
5383
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: DataLoadingErrorComponent, decorators: [{
5384
- type: Component,
5385
- args: [{
5386
- standalone: false,
5387
- selector: 'ocx-data-loading-error',
5388
- template: `<div class="p-4">
5389
- <h1>{{ 'OCX_DATA_LOADING_ERROR.TITLE' | translate }}</h1>
5390
- <div style="white-space: pre-line">
5391
- {{ 'OCX_DATA_LOADING_ERROR.MESSAGE' | translate }}
5392
- </div>
5393
- </div> `,
5394
- }]
5395
- }] });
5396
-
5397
5372
  class DialogMessageContentComponent {
5398
5373
  constructor() {
5399
5374
  this.message = 'message';
@@ -5414,245 +5389,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
5414
5389
  type: Input
5415
5390
  }] } });
5416
5391
 
5417
- class ButtonDialogComponent {
5418
- constructor() {
5419
- this.dynamicDialogConfig = inject(DynamicDialogConfig);
5420
- this.dynamicDialogRef = inject(DynamicDialogRef);
5421
- this.defaultPrimaryButtonDetails = {
5422
- key: 'OCX_BUTTON_DIALOG.CONFIRM',
5423
- };
5424
- this.defaultSecondaryButtonDetails = {
5425
- key: 'OCX_BUTTON_DIALOG.CANCEL',
5426
- };
5427
- this.defaultDialogData = {
5428
- component: DialogMessageContentComponent,
5429
- config: {
5430
- primaryButtonDetails: this.defaultPrimaryButtonDetails,
5431
- secondaryButtonIncluded: true,
5432
- secondaryButtonDetails: this.defaultSecondaryButtonDetails,
5433
- },
5434
- componentData: {},
5435
- };
5436
- this.config = {};
5437
- this.resultEmitter = new EventEmitter();
5438
- this.dialogData = this.defaultDialogData;
5439
- this.customButtonsDisabled$ = new BehaviorSubject({});
5440
- this.leftCustomButtons = [];
5441
- this.rightCustomButtons = [];
5442
- }
5443
- set secondaryButton(content) {
5444
- if (content) {
5445
- this._secondaryButton = content;
5446
- }
5447
- }
5448
- get secondaryButton() {
5449
- return this._secondaryButton;
5450
- }
5451
- ngAfterViewInit() {
5452
- if (this.dialogData.config.autoFocusButton === 'primary' || !this.dialogData.config.autoFocusButton) {
5453
- this.primaryButton.element.nativeElement.focus();
5454
- }
5455
- else if (this.dialogData.config.autoFocusButton === 'secondary') {
5456
- this.secondaryButton.element.nativeElement.focus();
5457
- }
5458
- else if (this.dialogData.config.autoFocusButton === 'custom') {
5459
- const button = this.customButtons.find((customButton) => {
5460
- return customButton.nativeElement.id === this.dialogData.config.autoFocusButtonCustomId;
5461
- });
5462
- setTimeout(() => {
5463
- button?.nativeElement.focus();
5464
- });
5465
- }
5466
- }
5467
- ngOnInit() {
5468
- this.loadComponent();
5469
- }
5470
- primaryButtonAction() {
5471
- return this.buttonAction('primary');
5472
- }
5473
- secondaryButtonAction() {
5474
- return this.buttonAction('secondary');
5475
- }
5476
- customButtonAction(button) {
5477
- return this.buttonAction(`custom`, button.id);
5478
- }
5479
- resolveCustomButtonDisabled(customButtonsDisabled, buttonId) {
5480
- return buttonId in customButtonsDisabled ? customButtonsDisabled[buttonId] : true;
5481
- }
5482
- loadComponent() {
5483
- if (this.dynamicDialogConfig.data) {
5484
- this.setUpDialogDataForDynamicConfig();
5485
- }
5486
- else {
5487
- this.setUpDialogDataForInput();
5488
- }
5489
- }
5490
- setUpDialogDataForDynamicConfig() {
5491
- const dynamicConfigData = this.dynamicDialogConfig.data;
5492
- if (dynamicConfigData.config) {
5493
- const dialogConfig = dynamicConfigData.config;
5494
- if (!!dialogConfig.primaryButtonDetails && !!dialogConfig.primaryButtonDetails.key) {
5495
- this.dialogData.config.primaryButtonDetails = dialogConfig.primaryButtonDetails;
5496
- }
5497
- if (dialogConfig.secondaryButtonIncluded !== undefined) {
5498
- this.dialogData.config.secondaryButtonIncluded = dialogConfig.secondaryButtonIncluded;
5499
- }
5500
- if (!!dialogConfig.secondaryButtonDetails && !!dialogConfig.secondaryButtonDetails.key) {
5501
- this.dialogData.config.secondaryButtonDetails = dialogConfig.secondaryButtonDetails;
5502
- }
5503
- this.dialogData.config.autoFocusButton = dialogConfig.autoFocusButton;
5504
- this.dialogData.config.autoFocusButtonCustomId = dialogConfig.autoFocusButtonCustomId;
5505
- }
5506
- if (dynamicConfigData.component) {
5507
- this.dialogData.component = dynamicConfigData.component;
5508
- }
5509
- if (dynamicConfigData.componentData) {
5510
- this.dialogData.componentData = dynamicConfigData.componentData;
5511
- }
5512
- this.setupCustomButtons(dynamicConfigData);
5513
- const viewContainerRef = this.dialogHost;
5514
- viewContainerRef.clear();
5515
- if (this.dialogData.component) {
5516
- const componentRef = viewContainerRef.createComponent(this.dialogData.component);
5517
- if (this.isDialogPrimaryButtonDisabledImplemented(componentRef.instance)) {
5518
- this.primaryButtonDisabled$ = componentRef.instance.primaryButtonEnabled.pipe(startWith(false), map((isEnabled) => !isEnabled));
5519
- }
5520
- if (this.isDialogSecondaryButtonDisabledImplemented(componentRef.instance)) {
5521
- this.secondaryButtonDisabled$ = componentRef.instance.secondaryButtonEnabled.pipe(startWith(false), map((isEnabled) => !isEnabled));
5522
- }
5523
- if (this.isDialogCustomButtonDisabledImplemented(componentRef.instance)) {
5524
- const initCustomButtons = {};
5525
- this.rightCustomButtons.concat(this.leftCustomButtons).map((button) => {
5526
- initCustomButtons[button.id] = true;
5527
- });
5528
- this.customButtonsDisabled$.next(initCustomButtons);
5529
- componentRef.instance.customButtonEnabled
5530
- .pipe(withLatestFrom(this.customButtonsDisabled$), map(([buttonEnabled, customButtonsDisabled]) => {
5531
- if (customButtonsDisabled[buttonEnabled.id] !== !buttonEnabled.enabled) {
5532
- customButtonsDisabled[buttonEnabled.id] = !buttonEnabled.enabled;
5533
- }
5534
- return customButtonsDisabled;
5535
- }))
5536
- .subscribe(this.customButtonsDisabled$);
5537
- }
5538
- //populate container
5539
- Object.keys(this.dialogData.componentData).forEach((k) => {
5540
- componentRef.setInput(k, this.dialogData.componentData[k]);
5541
- });
5542
- this.componentRef = componentRef;
5543
- }
5544
- }
5545
- setUpDialogDataForInput() {
5546
- this.dialogData.component = undefined;
5547
- this.dialogData.componentData = undefined;
5548
- if (this.config) {
5549
- if (!!this.config.primaryButtonDetails && !!this.config.primaryButtonDetails.key) {
5550
- this.dialogData.config.primaryButtonDetails = this.config.primaryButtonDetails;
5551
- }
5552
- if (this.config.secondaryButtonIncluded) {
5553
- this.dialogData.config.secondaryButtonIncluded = this.config.secondaryButtonIncluded;
5554
- }
5555
- if (!!this.config.secondaryButtonDetails && !!this.config.secondaryButtonDetails.key) {
5556
- this.dialogData.config.secondaryButtonDetails = this.config.secondaryButtonDetails;
5557
- }
5558
- }
5559
- this.dialogData.config.customButtons = this.config.customButtons;
5560
- this.setupCustomButtons(this.dialogData);
5561
- }
5562
- buttonAction(resultButtonClickedName, buttonId) {
5563
- if (!this.componentRef) {
5564
- this.resultEmitter.emit(resultButtonClickedName);
5565
- return;
5566
- }
5567
- const state = {
5568
- button: resultButtonClickedName,
5569
- result: undefined,
5570
- id: buttonId,
5571
- };
5572
- this.resolveButtonClick(state);
5573
- }
5574
- setupCustomButtons(dialogData) {
5575
- this.leftCustomButtons = dialogData.config.customButtons?.filter((button) => button.alignment === 'left') ?? [];
5576
- this.rightCustomButtons = dialogData.config.customButtons?.filter((button) => button.alignment === 'right') ?? [];
5577
- }
5578
- resolveButtonClick(state) {
5579
- const component = this.componentRef.instance;
5580
- const hasDialogResult = this.isDialogResultImplemented(component);
5581
- if (hasDialogResult) {
5582
- state.result = component.dialogResult;
5583
- }
5584
- const closeResult = state;
5585
- // check if component implements DialogButtonClicked
5586
- if (this.isDialogButtonClickedImplemented(component)) {
5587
- const buttonResult = component.ocxDialogButtonClicked(state);
5588
- // If undefined or void is returned, close dialog and return result
5589
- if (buttonResult === undefined) {
5590
- if (hasDialogResult) {
5591
- closeResult.result = component.dialogResult;
5592
- }
5593
- return this.dynamicDialogRef.close(closeResult);
5594
- }
5595
- this.toObservable(buttonResult).subscribe((result) => {
5596
- if (result === true) {
5597
- if (hasDialogResult) {
5598
- closeResult.result = component.dialogResult;
5599
- }
5600
- this.dynamicDialogRef.close(closeResult);
5601
- }
5602
- });
5603
- }
5604
- else {
5605
- return this.dynamicDialogRef.close(closeResult);
5606
- }
5607
- }
5608
- toObservable(ocxDialogButtonClickedResult) {
5609
- if (ocxDialogButtonClickedResult === undefined) {
5610
- return of(true);
5611
- }
5612
- if (isObservable(ocxDialogButtonClickedResult)) {
5613
- return ocxDialogButtonClickedResult;
5614
- }
5615
- return from(Promise.resolve(ocxDialogButtonClickedResult));
5616
- }
5617
- isDialogResultImplemented(component) {
5618
- return 'dialogResult' in component;
5619
- }
5620
- isDialogButtonClickedImplemented(component) {
5621
- return typeof component.ocxDialogButtonClicked === 'function';
5622
- }
5623
- isDialogPrimaryButtonDisabledImplemented(component) {
5624
- return 'primaryButtonEnabled' in component;
5625
- }
5626
- isDialogSecondaryButtonDisabledImplemented(component) {
5627
- return 'secondaryButtonEnabled' in component;
5628
- }
5629
- isDialogCustomButtonDisabledImplemented(component) {
5630
- return 'customButtonEnabled' in component;
5631
- }
5632
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: ButtonDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5633
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.11", type: ButtonDialogComponent, isStandalone: false, selector: "ocx-button-dialog", inputs: { config: "config" }, outputs: { resultEmitter: "resultEmitter" }, viewQueries: [{ propertyName: "dialogHost", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "primaryButton", first: true, predicate: ["primaryButton"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "secondaryButton", first: true, predicate: ["secondaryButton"], descendants: true, read: ViewContainerRef }, { propertyName: "customButtons", predicate: ["customButton"], descendants: true }], ngImport: i0, template: "<div>\n <div class=\"buttonDialogScrollableContent\">\n <ng-container #container></ng-container>\n <ng-content></ng-content>\n </div>\n <div class=\"w-full flex-row justify-content-end flex flex-wrap gap-2\">\n @for (button of leftCustomButtons; track button; let i = $index) {\n <div [ngStyle]=\"{'margin-right': (i === leftCustomButtons.length - 1) ? 'auto' : 0}\">\n <ng-container *ngTemplateOutlet=\"customButtonTemplate; context: {button: button}\"> </ng-container>\n </div>\n }\n @for (button of rightCustomButtons; track button) {\n <div>\n <ng-container *ngTemplateOutlet=\"customButtonTemplate; context: {button: button}\"> </ng-container>\n </div>\n }\n <div>\n @if (dialogData.config.secondaryButtonIncluded) {\n <button\n #secondaryButton\n id=\"{{dialogData.config.secondaryButtonDetails?.id ?? 'buttonDialogSecondaryButton'}}\"\n pButton\n [icon]=\"dialogData.config.secondaryButtonDetails!.icon !== undefined ? dialogData.config.secondaryButtonDetails!.icon : ''\"\n (click)=\"secondaryButtonAction()\"\n [label]=\"dialogData.config.secondaryButtonDetails!.key | translate:dialogData.config.secondaryButtonDetails?.parameters\"\n [disabled]=\"secondaryButtonDisabled$ | async\"\n [pTooltip]=\"dialogData.config.secondaryButtonDetails!.tooltipKey ? (dialogData.config.secondaryButtonDetails!.tooltipKey | translate) : null\"\n [tooltipPosition]=\"dialogData.config.secondaryButtonDetails?.tooltipPosition ?? ''\"\n [attr.aria-label]=\"dialogData.config.secondaryButtonDetails!.key | translate:dialogData.config.secondaryButtonDetails?.parameters\"\n ></button>\n }\n </div>\n <div>\n <button\n #primaryButton\n id=\"{{dialogData.config.primaryButtonDetails?.id ?? 'buttonDialogPrimaryButton'}}\"\n pButton\n [icon]=\"dialogData.config.primaryButtonDetails!.icon !== undefined ? dialogData.config.primaryButtonDetails!.icon : ''\"\n (click)=\"primaryButtonAction()\"\n [label]=\"dialogData.config.primaryButtonDetails!.key | translate:dialogData.config.primaryButtonDetails?.parameters\"\n [disabled]=\"primaryButtonDisabled$ | async\"\n [pTooltip]=\"dialogData.config.primaryButtonDetails!.tooltipKey ? (dialogData.config.primaryButtonDetails!.tooltipKey | translate) : null\"\n [tooltipPosition]=\"dialogData.config.primaryButtonDetails?.tooltipPosition ?? ''\"\n [attr.aria-label]=\"dialogData.config.primaryButtonDetails!.key | translate:dialogData.config.primaryButtonDetails?.parameters\"\n ></button>\n </div>\n </div>\n</div>\n\n<ng-template #customButtonTemplate let-button=\"button\">\n <button\n #customButton\n id=\"{{button.id}}\"\n pButton\n [icon]=\"button.icon !== undefined ? button.icon : ''\"\n (click)=\"customButtonAction(button)\"\n [label]=\"button.key | translate:button.parameters\"\n [disabled]=\"resolveCustomButtonDisabled((customButtonsDisabled$ | async) ?? {}, button.id)\"\n [pTooltip]=\"button.tooltipKey ? (button.tooltipKey | translate) : null\"\n [tooltipPosition]=\"button.tooltipPosition ?? ''\"\n [attr.aria-label]=\"button.key | translate:button.parameters\"\n ></button>\n</ng-template>\n", styles: [".buttonDialogScrollableContent{overflow:auto;max-height:500px;margin-bottom:20px}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "directive", type: i4$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i8.TranslatePipe, name: "translate" }] }); }
5634
- }
5635
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: ButtonDialogComponent, decorators: [{
5636
- type: Component,
5637
- args: [{ standalone: false, selector: 'ocx-button-dialog', template: "<div>\n <div class=\"buttonDialogScrollableContent\">\n <ng-container #container></ng-container>\n <ng-content></ng-content>\n </div>\n <div class=\"w-full flex-row justify-content-end flex flex-wrap gap-2\">\n @for (button of leftCustomButtons; track button; let i = $index) {\n <div [ngStyle]=\"{'margin-right': (i === leftCustomButtons.length - 1) ? 'auto' : 0}\">\n <ng-container *ngTemplateOutlet=\"customButtonTemplate; context: {button: button}\"> </ng-container>\n </div>\n }\n @for (button of rightCustomButtons; track button) {\n <div>\n <ng-container *ngTemplateOutlet=\"customButtonTemplate; context: {button: button}\"> </ng-container>\n </div>\n }\n <div>\n @if (dialogData.config.secondaryButtonIncluded) {\n <button\n #secondaryButton\n id=\"{{dialogData.config.secondaryButtonDetails?.id ?? 'buttonDialogSecondaryButton'}}\"\n pButton\n [icon]=\"dialogData.config.secondaryButtonDetails!.icon !== undefined ? dialogData.config.secondaryButtonDetails!.icon : ''\"\n (click)=\"secondaryButtonAction()\"\n [label]=\"dialogData.config.secondaryButtonDetails!.key | translate:dialogData.config.secondaryButtonDetails?.parameters\"\n [disabled]=\"secondaryButtonDisabled$ | async\"\n [pTooltip]=\"dialogData.config.secondaryButtonDetails!.tooltipKey ? (dialogData.config.secondaryButtonDetails!.tooltipKey | translate) : null\"\n [tooltipPosition]=\"dialogData.config.secondaryButtonDetails?.tooltipPosition ?? ''\"\n [attr.aria-label]=\"dialogData.config.secondaryButtonDetails!.key | translate:dialogData.config.secondaryButtonDetails?.parameters\"\n ></button>\n }\n </div>\n <div>\n <button\n #primaryButton\n id=\"{{dialogData.config.primaryButtonDetails?.id ?? 'buttonDialogPrimaryButton'}}\"\n pButton\n [icon]=\"dialogData.config.primaryButtonDetails!.icon !== undefined ? dialogData.config.primaryButtonDetails!.icon : ''\"\n (click)=\"primaryButtonAction()\"\n [label]=\"dialogData.config.primaryButtonDetails!.key | translate:dialogData.config.primaryButtonDetails?.parameters\"\n [disabled]=\"primaryButtonDisabled$ | async\"\n [pTooltip]=\"dialogData.config.primaryButtonDetails!.tooltipKey ? (dialogData.config.primaryButtonDetails!.tooltipKey | translate) : null\"\n [tooltipPosition]=\"dialogData.config.primaryButtonDetails?.tooltipPosition ?? ''\"\n [attr.aria-label]=\"dialogData.config.primaryButtonDetails!.key | translate:dialogData.config.primaryButtonDetails?.parameters\"\n ></button>\n </div>\n </div>\n</div>\n\n<ng-template #customButtonTemplate let-button=\"button\">\n <button\n #customButton\n id=\"{{button.id}}\"\n pButton\n [icon]=\"button.icon !== undefined ? button.icon : ''\"\n (click)=\"customButtonAction(button)\"\n [label]=\"button.key | translate:button.parameters\"\n [disabled]=\"resolveCustomButtonDisabled((customButtonsDisabled$ | async) ?? {}, button.id)\"\n [pTooltip]=\"button.tooltipKey ? (button.tooltipKey | translate) : null\"\n [tooltipPosition]=\"button.tooltipPosition ?? ''\"\n [attr.aria-label]=\"button.key | translate:button.parameters\"\n ></button>\n</ng-template>\n", styles: [".buttonDialogScrollableContent{overflow:auto;max-height:500px;margin-bottom:20px}\n"] }]
5638
- }], propDecorators: { config: [{
5639
- type: Input
5640
- }], resultEmitter: [{
5641
- type: Output
5642
- }], dialogHost: [{
5643
- type: ViewChild,
5644
- args: ['container', { static: true, read: ViewContainerRef }]
5645
- }], primaryButton: [{
5646
- type: ViewChild,
5647
- args: ['primaryButton', { static: true, read: ViewContainerRef }]
5648
- }], secondaryButton: [{
5649
- type: ViewChild,
5650
- args: ['secondaryButton', { static: false, read: ViewContainerRef }]
5651
- }], customButtons: [{
5652
- type: ViewChildren,
5653
- args: ['customButton']
5654
- }] } });
5655
-
5656
5392
  class DialogContentComponent {
5657
5393
  constructor() {
5658
5394
  this.dynamicDialogConfig = inject(DynamicDialogConfig);
@@ -5981,46 +5717,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
5981
5717
  type: Input
5982
5718
  }] } });
5983
5719
 
5984
- // This topic is defined here and not in integration-interface, because
5985
- // it is not used as framework independent integration but for improving
5986
- // angular specific things
5987
- class TranslationCacheTopic extends SyncableTopic {
5988
- constructor() {
5989
- super('translationCache', 2);
5990
- }
5991
- }
5992
- /**
5993
- * @deprecated Please import from `@onecx/angular-utils` instead.
5994
- */
5995
- class TranslationCacheService {
5996
- constructor() {
5997
- this.translationTopic$ = new TranslationCacheTopic();
5998
- window['onecxTranslations'] ??= {};
5999
- }
6000
- ngOnDestroy() {
6001
- this.translationTopic$.destroy();
6002
- }
6003
- getTranslationFile(url, cacheMissFunction) {
6004
- if (window['onecxTranslations'][url]) {
6005
- return of(window['onecxTranslations'][url]);
6006
- }
6007
- if (window['onecxTranslations'][url] === null) {
6008
- return this.translationTopic$.pipe(filter((messageUrl) => messageUrl === url), map(() => window['onecxTranslations'][url]), first());
6009
- }
6010
- window['onecxTranslations'][url] = null;
6011
- return cacheMissFunction().pipe(tap((t) => {
6012
- window['onecxTranslations'][url] = t;
6013
- this.translationTopic$.publish(url);
6014
- }), map(() => window['onecxTranslations'][url]), first());
6015
- }
6016
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: TranslationCacheService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
6017
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: TranslationCacheService, providedIn: 'root' }); }
6018
- }
6019
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: TranslationCacheService, decorators: [{
6020
- type: Injectable,
6021
- args: [{ providedIn: 'root' }]
6022
- }], ctorParameters: () => [] });
6023
-
6024
5720
  class PortalDialogService {
6025
5721
  constructor() {
6026
5722
  this.dialogService = inject(DialogService);
@@ -6238,12 +5934,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
6238
5934
  providedIn: 'root',
6239
5935
  }]
6240
5936
  }] });
6241
- /**
6242
- * @deprecated Will be removed. Please use isValidDate() from @onecx/accelerator
6243
- */
6244
- function isValidDate(value) {
6245
- return value instanceof Date && !isNaN(value);
6246
- }
6247
5937
 
6248
5938
  class ExportDataService {
6249
5939
  constructor() {
@@ -6572,7 +6262,6 @@ class AngularAcceleratorModule {
6572
6262
  SearchHeaderComponent,
6573
6263
  DiagramComponent,
6574
6264
  GroupByCountDiagramComponent,
6575
- DataLoadingErrorComponent,
6576
6265
  OcxContentComponent,
6577
6266
  OcxContentContainerComponent,
6578
6267
  IfPermissionDirective,
@@ -6589,7 +6278,6 @@ class AngularAcceleratorModule {
6589
6278
  LoadingIndicatorComponent,
6590
6279
  LoadingIndicatorDirective,
6591
6280
  BasicDirective,
6592
- ButtonDialogComponent,
6593
6281
  DialogFooterComponent,
6594
6282
  DialogContentComponent,
6595
6283
  DialogInlineComponent,
@@ -6612,7 +6300,6 @@ class AngularAcceleratorModule {
6612
6300
  SearchHeaderComponent,
6613
6301
  DiagramComponent,
6614
6302
  GroupByCountDiagramComponent,
6615
- DataLoadingErrorComponent,
6616
6303
  OcxContentComponent,
6617
6304
  OcxContentContainerComponent,
6618
6305
  IfPermissionDirective,
@@ -6629,7 +6316,6 @@ class AngularAcceleratorModule {
6629
6316
  LoadingIndicatorComponent,
6630
6317
  LoadingIndicatorDirective,
6631
6318
  BasicDirective,
6632
- ButtonDialogComponent,
6633
6319
  DialogFooterComponent,
6634
6320
  DialogContentComponent,
6635
6321
  DialogInlineComponent,
@@ -6694,7 +6380,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
6694
6380
  SearchHeaderComponent,
6695
6381
  DiagramComponent,
6696
6382
  GroupByCountDiagramComponent,
6697
- DataLoadingErrorComponent,
6698
6383
  OcxContentComponent,
6699
6384
  OcxContentContainerComponent,
6700
6385
  IfPermissionDirective,
@@ -6711,7 +6396,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
6711
6396
  LoadingIndicatorComponent,
6712
6397
  LoadingIndicatorDirective,
6713
6398
  BasicDirective,
6714
- ButtonDialogComponent,
6715
6399
  DialogFooterComponent,
6716
6400
  DialogContentComponent,
6717
6401
  DialogInlineComponent,
@@ -6757,7 +6441,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
6757
6441
  SearchHeaderComponent,
6758
6442
  DiagramComponent,
6759
6443
  GroupByCountDiagramComponent,
6760
- DataLoadingErrorComponent,
6761
6444
  OcxContentComponent,
6762
6445
  OcxContentContainerComponent,
6763
6446
  IfPermissionDirective,
@@ -6774,7 +6457,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
6774
6457
  LoadingIndicatorComponent,
6775
6458
  LoadingIndicatorDirective,
6776
6459
  BasicDirective,
6777
- ButtonDialogComponent,
6778
6460
  DialogFooterComponent,
6779
6461
  DialogContentComponent,
6780
6462
  DialogInlineComponent,
@@ -6790,37 +6472,6 @@ const atLeastOneFieldFilledValidator = (form) => {
6790
6472
  return null;
6791
6473
  };
6792
6474
 
6793
- /**
6794
- * @deprecated Please import from `@onecx/angular-utils` instead.
6795
- */
6796
- class AsyncTranslateLoader {
6797
- static { this.lastTimerId = 0; }
6798
- constructor(translateLoader$) {
6799
- this.translateLoader$ = translateLoader$;
6800
- this.timerId = AsyncTranslateLoader.lastTimerId++;
6801
- }
6802
- getTranslation(lang) {
6803
- return this.translateLoader$.pipe(tap(() => console.time('AsyncTranslateLoader_' + this.timerId)), defaultIfEmpty(undefined), first(), mergeMap((translateLoader) => translateLoader?.getTranslation(lang) ?? of({})), tap(() => console.timeEnd('AsyncTranslateLoader_' + this.timerId)));
6804
- }
6805
- }
6806
-
6807
- /**
6808
- * @deprecated Please import from `@onecx/angular-utils` instead.
6809
- */
6810
- class CachingTranslateLoader {
6811
- constructor(translationCache, http, prefix, suffix) {
6812
- this.translationCache = translationCache;
6813
- this.http = http;
6814
- this.prefix = prefix;
6815
- this.suffix = suffix;
6816
- this.translateLoader = new TranslateHttpLoader(this.http, this.prefix, this.suffix);
6817
- }
6818
- getTranslation(lang) {
6819
- const url = `${this.prefix}${lang}${this.suffix}`;
6820
- return this.translationCache.getTranslationFile(url, () => this.translateLoader.getTranslation(lang));
6821
- }
6822
- }
6823
-
6824
6475
  /* eslint-disable @typescript-eslint/no-unused-vars */
6825
6476
  class DataOperationStrategy {
6826
6477
  endsWith(column, value, target) {
@@ -6902,94 +6553,6 @@ class DataOperationStrategy {
6902
6553
  }
6903
6554
  }
6904
6555
 
6905
- /**
6906
- * @deprecated Please import from `@onecx/angular-utils` instead.
6907
- */
6908
- class TranslateCombinedLoader {
6909
- constructor(...loaders) {
6910
- this._loaders = loaders;
6911
- }
6912
- getTranslation(lang) {
6913
- return forkJoin(this._loaders.map((l) => l.getTranslation(lang).pipe(catchError(err => {
6914
- console.error('Failed to load translation file', l, err);
6915
- return of({});
6916
- })))).pipe(map((allTranslations) => {
6917
- let result = {};
6918
- allTranslations.forEach((translations) => {
6919
- result = this.mergeDeep(result, translations);
6920
- });
6921
- return result;
6922
- }));
6923
- }
6924
- isObject(item) {
6925
- return item && typeof item === 'object' && !Array.isArray(item);
6926
- }
6927
- mergeDeep(target, source) {
6928
- const output = Object.assign({}, target);
6929
- if (this.isObject(target) && this.isObject(source)) {
6930
- Object.keys(source).forEach((key) => {
6931
- if (this.isObject(source[key])) {
6932
- if (!(key in target))
6933
- Object.assign(output, { [key]: source[key] });
6934
- else
6935
- output[key] = this.mergeDeep(target[key], source[key]);
6936
- }
6937
- else {
6938
- Object.assign(output, { [key]: source[key] });
6939
- }
6940
- });
6941
- }
6942
- return output;
6943
- }
6944
- }
6945
-
6946
- let lastTranslateLoaderTimerId$1 = 0;
6947
- /**
6948
- * @deprecated Please import from `@onecx/angular-utils` instead.
6949
- */
6950
- function createTranslateLoader(http, appStateService, translationCacheService) {
6951
- const ts = translationCacheService ?? inject(TranslationCacheService);
6952
- const timerId = lastTranslateLoaderTimerId$1++;
6953
- console.time('createTranslateLoader_' + timerId);
6954
- return new AsyncTranslateLoader(combineLatest([appStateService.currentMfe$.asObservable(), appStateService.globalLoading$.asObservable()]).pipe(filter(([, isLoading]) => !isLoading), map(([currentMfe]) => {
6955
- return new TranslateCombinedLoader(
6956
- // translations of shell or of app in standalone mode
6957
- new CachingTranslateLoader(ts, http, `./assets/i18n/`, '.json'),
6958
- // translations of portal-integration-angular of app
6959
- new CachingTranslateLoader(ts, http, Location.joinWithSlash(currentMfe.remoteBaseUrl, `onecx-portal-lib/assets/i18n/`), '.json'),
6960
- // translations of portal-integration-angular of shell
6961
- new CachingTranslateLoader(ts, http, `./onecx-portal-lib/assets/i18n/`, '.json'),
6962
- // Primelocale Translations
6963
- new CachingTranslateLoader(ts, http, Location.joinWithSlash(currentMfe.remoteBaseUrl, `onecx-portal-lib/assets/i18n/primeng/`), '.json'),
6964
- // translations of the app
6965
- new CachingTranslateLoader(ts, http, Location.joinWithSlash(currentMfe.remoteBaseUrl, `assets/i18n/`), '.json'));
6966
- }), tap(() => console.timeEnd('createTranslateLoader_' + timerId))));
6967
- }
6968
-
6969
- let lastTranslateLoaderTimerId = 0;
6970
- function createRemoteComponentTranslateLoader(http, baseUrlReplaySubject$, translationCacheService) {
6971
- const ts = translationCacheService ?? inject(TranslationCacheService);
6972
- const timerId = lastTranslateLoaderTimerId++;
6973
- console.time('createRemoteComponentTranslateLoader_' + timerId);
6974
- return new AsyncTranslateLoader(baseUrlReplaySubject$.pipe(map((baseUrl) => {
6975
- return new TranslateCombinedLoader(
6976
- // translations of shell or of app in standalone mode
6977
- new CachingTranslateLoader(ts, http, `./assets/i18n/`, '.json'),
6978
- // translations of portal-integration-angular of app
6979
- new CachingTranslateLoader(ts, http, Location.joinWithSlash(baseUrl, `onecx-portal-lib/assets/i18n/`), '.json'),
6980
- // translations of portal-integration-angular of shell
6981
- new CachingTranslateLoader(ts, http, `./onecx-portal-lib/assets/i18n/`, '.json'),
6982
- // translations of the app
6983
- new CachingTranslateLoader(ts, http, Location.joinWithSlash(baseUrl, `assets/i18n/`), '.json'));
6984
- }), tap(() => console.timeEnd('createRemoteComponentTranslateLoader_' + timerId))));
6985
- }
6986
-
6987
- function createRemoteComponentAndMfeTranslateLoader(httpClient, baseUrl, translationCacheService, appStateService) {
6988
- return new AsyncTranslateLoader(appStateService.currentMfe$.pipe(map((currentMfe) => {
6989
- return new TranslateCombinedLoader(createRemoteComponentTranslateLoader(httpClient, baseUrl, translationCacheService), new CachingTranslateLoader(translationCacheService, httpClient, Location.joinWithSlash(currentMfe.remoteBaseUrl, 'assets/i18n/'), '.json'));
6990
- })));
6991
- }
6992
-
6993
6556
  function enumToDropdownOptions(translateService, enumType, translationKeyPrefix) {
6994
6557
  return translateService.get(Object.values(enumType).map((v) => translationKeyPrefix + v)).pipe(map((translations) => Object.values(enumType).map((v) => ({
6995
6558
  label: translations[translationKeyPrefix + v],
@@ -7014,7 +6577,7 @@ function buildSearchCriteria(formRawValue, datePickers, { removeNullValues = fal
7014
6577
  if (value == null && removeNullValues) {
7015
6578
  return acc;
7016
6579
  }
7017
- if (isValidDate$1(value) && !_hasShowTime(datePickers, key)) {
6580
+ if (isValidDate(value) && !_hasShowTime(datePickers, key)) {
7018
6581
  value = getUTCDateWithoutTimezoneIssues(value);
7019
6582
  }
7020
6583
  return {
@@ -7059,10 +6622,11 @@ class ImageLogoUrlUtils {
7059
6622
  }
7060
6623
 
7061
6624
  // injection tokens + related utilities
6625
+ // directives
7062
6626
 
7063
6627
  /**
7064
6628
  * Generated bundle index. Do not edit.
7065
6629
  */
7066
6630
 
7067
- export { AdvancedDirective, AngularAcceleratorMissingTranslationHandler, AngularAcceleratorModule, AngularAcceleratorPrimeNgModule, AsyncTranslateLoader, BasicDirective, BreadcrumbService, ButtonDialogComponent, CachingTranslateLoader, ColorUtils, ColumnGroupSelectionComponent, ColumnType, CustomGroupColumnSelectorComponent, DataLayoutSelectionComponent, DataListGridComponent, DataListGridSortingComponent, DataLoadingErrorComponent, DataOperationStrategy, DataTableComponent, DataViewComponent, DateUtils, DiagramComponent, DialogContentComponent, DialogFooterComponent, DialogInlineComponent, DialogMessageContentComponent, DynamicPipe, ExportDataService, FilterType, FilterViewComponent, GlobalErrorComponent, GroupByCountDiagramComponent, IfBreakpointDirective, IfPermissionDirective, ImageLogoUrlUtils, InteractiveDataViewComponent, LifecycleComponent, LoadingIndicatorComponent, LoadingIndicatorDirective, ObjectUtils, OcxContentComponent, OcxContentContainerComponent, OcxContentContainerDirective, OcxContentDirective, OcxTimeAgoPipe, PageHeaderComponent, PortalDialogService, RelativeDatePipe, SearchHeaderComponent, SrcDirective, TemplateDirective, TemplateType, TooltipOnOverflowDirective, TranslateCombinedLoader, TranslationCacheService, atLeastOneFieldFilledValidator, buildSearchCriteria, createRemoteComponentAndMfeTranslateLoader, createRemoteComponentTranslateLoader, createTranslateLoader, enumToDropdownOptions, findEntryWithKeyword, findTemplate, flattenObject, isValidDate, limit, providePortalDialogService, removeKeyword, searchPrefixWithSpecialChars };
6631
+ export { AdvancedDirective, AngularAcceleratorMissingTranslationHandler, AngularAcceleratorModule, AngularAcceleratorPrimeNgModule, BasicDirective, BreadcrumbService, ColorUtils, ColumnGroupSelectionComponent, ColumnType, CustomGroupColumnSelectorComponent, DataLayoutSelectionComponent, DataListGridComponent, DataListGridSortingComponent, DataOperationStrategy, DataTableComponent, DataViewComponent, DateUtils, DiagramComponent, DialogContentComponent, DialogFooterComponent, DialogInlineComponent, DialogMessageContentComponent, DynamicPipe, ExportDataService, FilterType, FilterViewComponent, GlobalErrorComponent, GroupByCountDiagramComponent, IfBreakpointDirective, IfPermissionDirective, ImageLogoUrlUtils, InteractiveDataViewComponent, LifecycleComponent, LoadingIndicatorComponent, LoadingIndicatorDirective, ObjectUtils, OcxContentComponent, OcxContentContainerComponent, OcxContentContainerDirective, OcxContentDirective, OcxTimeAgoPipe, PageHeaderComponent, PortalDialogService, RelativeDatePipe, SearchHeaderComponent, SrcDirective, TemplateDirective, TemplateType, TooltipOnOverflowDirective, atLeastOneFieldFilledValidator, buildSearchCriteria, enumToDropdownOptions, findEntryWithKeyword, findTemplate, flattenObject, limit, providePortalDialogService, removeKeyword, searchPrefixWithSpecialChars };
7068
6632
  //# sourceMappingURL=onecx-angular-accelerator.mjs.map