@onecx/angular-accelerator 4.44.4 → 4.45.0

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.
@@ -13,13 +13,14 @@ import * as i1$1 from '@ngx-translate/core';
13
13
  import { TranslateService, TranslatePipe, TranslateModule } from '@ngx-translate/core';
14
14
  import * as i2$1 from 'primeng/api';
15
15
  import { PrimeIcons } from 'primeng/api';
16
- import { BehaviorSubject, filter, concat, of, map, combineLatest, mergeMap, first, tap, firstValueFrom, skip, defaultIfEmpty, forkJoin } from 'rxjs';
16
+ import { BehaviorSubject, map, filter, concat, of, combineLatest, mergeMap, first, tap, firstValueFrom, skip, defaultIfEmpty, forkJoin } from 'rxjs';
17
17
  import * as i3$1 from '@onecx/angular-integration-interface';
18
18
  import { UserService } from '@onecx/angular-integration-interface';
19
19
  import { __decorate, __metadata } from 'tslib';
20
20
  import * as i1$2 from '@angular/router';
21
21
  import { NavigationEnd, Router, ActivatedRoute, RouterModule } from '@angular/router';
22
22
  import { untilDestroyed, UntilDestroy } from '@ngneat/until-destroy';
23
+ import { SyncableTopic, isValidDate as isValidDate$1 } from '@onecx/accelerator';
23
24
  import * as i5 from 'primeng/breadcrumb';
24
25
  import { BreadcrumbModule } from 'primeng/breadcrumb';
25
26
  import * as i8 from 'primeng/menu';
@@ -34,7 +35,6 @@ import * as i6$1 from 'primeng/selectbutton';
34
35
  import { SelectButtonModule } from 'primeng/selectbutton';
35
36
  import * as i7 from 'primeng/dataview';
36
37
  import { DataViewModule } from 'primeng/dataview';
37
- import { isValidDate as isValidDate$1, SyncableTopic } from '@onecx/accelerator';
38
38
  import * as i7$1 from 'primeng/table';
39
39
  import { TableModule } from 'primeng/table';
40
40
  import * as i9 from 'primeng/multiselect';
@@ -243,14 +243,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
243
243
  type: Output
244
244
  }] } });
245
245
 
246
+ // This topic is defined here and not in integration-interface, because
247
+ // it is not used as framework independent integration but for improving
248
+ // angular specific things
249
+ class ManualBreadcrumbsTopic extends SyncableTopic {
250
+ constructor() {
251
+ super('manualBreadcrumbs', 1);
252
+ }
253
+ }
246
254
  let BreadcrumbService = class BreadcrumbService {
247
255
  constructor(router, activeRoute, translateService) {
248
256
  this.router = router;
249
257
  this.activeRoute = activeRoute;
250
258
  this.translateService = translateService;
251
- this.itemsSource = new BehaviorSubject([]);
259
+ this.itemsSource$ = new ManualBreadcrumbsTopic();
252
260
  this.generatedItemsSource = new BehaviorSubject([]);
253
- this.itemsHandler = this.itemsSource.asObservable();
261
+ this.itemsHandler = this.itemsSource$.pipe(map((manualBreadcrumbs) => manualBreadcrumbs.menuItems));
254
262
  this.generateBreadcrumbs(this.activeRoute.snapshot);
255
263
  this.router.events
256
264
  .pipe(untilDestroyed(this), filter((e) => e instanceof NavigationEnd))
@@ -323,15 +331,19 @@ let BreadcrumbService = class BreadcrumbService {
323
331
  ];
324
332
  if (translationKeys.length) {
325
333
  this.translateService.get(translationKeys).subscribe((translations) => {
326
- this.itemsSource.next(items.map((i) => ({
327
- ...i,
328
- label: translations[i.labelKey || ''] || i.label,
329
- title: translations[i.titleKey || ''] || i.title,
330
- })));
334
+ this.itemsSource$.publish({
335
+ menuItems: items.map((i) => ({
336
+ ...i,
337
+ label: translations[i.labelKey || ''] || i.label,
338
+ title: translations[i.titleKey || ''] || i.title,
339
+ })),
340
+ });
331
341
  });
332
342
  }
333
343
  else {
334
- this.itemsSource.next(items);
344
+ this.itemsSource$.publish({
345
+ menuItems: items,
346
+ });
335
347
  }
336
348
  }
337
349
  };
@@ -339,7 +351,9 @@ BreadcrumbService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", versio
339
351
  BreadcrumbService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BreadcrumbService, providedIn: 'any' });
340
352
  BreadcrumbService = __decorate([
341
353
  UntilDestroy(),
342
- __metadata("design:paramtypes", [Router, ActivatedRoute, TranslateService])
354
+ __metadata("design:paramtypes", [Router,
355
+ ActivatedRoute,
356
+ TranslateService])
343
357
  ], BreadcrumbService);
344
358
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BreadcrumbService, decorators: [{
345
359
  type: Injectable,
@@ -627,6 +641,8 @@ class SearchHeaderComponent {
627
641
  this.viewMode = 'basic';
628
642
  this.manualBreadcrumbs = false;
629
643
  this._actions = [];
644
+ this.searchButtonDisabled = false;
645
+ this.resetButtonDisabled = false;
630
646
  this.searched = new EventEmitter();
631
647
  this.resetted = new EventEmitter();
632
648
  this.selectedSearchConfigChanged = new EventEmitter();
@@ -707,10 +723,10 @@ class SearchHeaderComponent {
707
723
  }
708
724
  }
709
725
  SearchHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SearchHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
710
- SearchHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SearchHeaderComponent, selector: "ocx-search-header", inputs: { searchConfigs: "searchConfigs", header: "header", headline: "headline", subheader: "subheader", viewMode: "viewMode", manualBreadcrumbs: "manualBreadcrumbs", actions: "actions" }, outputs: { searched: "searched", resetted: "resetted", selectedSearchConfigChanged: "selectedSearchConfigChanged", viewModeChanged: "viewModeChanged" }, queries: [{ propertyName: "additionalToolbarContent", first: true, predicate: ["additionalToolbarContent"], descendants: true }, { propertyName: "additionalToolbarContentLeft", first: true, predicate: ["additionalToolbarContentLeft"], descendants: true }], viewQueries: [{ propertyName: "searchParameterFields", first: true, predicate: ["searchParameterFields"], descendants: true }], ngImport: i0, template: "<ocx-page-header\n [header]=\"header || ('OCX_SEARCH_HEADER.HEADER' | translate)\"\n [subheader]=\"subheader\"\n [manualBreadcrumbs]=\"manualBreadcrumbs\"\n [actions]=\"headerActions\"\n>\n <ng-template #additionalToolbarContentLeft>\n <ocx-search-config [searchConfigs]=\"searchConfigs\" (selectedSearchConfigChanged)=\"confirmSearchConfig($event)\">\n </ocx-search-config>\n <ng-container *ngIf=\"_additionalToolbarContentLeft\" [ngTemplateOutlet]=\"_additionalToolbarContentLeft\"></ng-container>\n </ng-template>\n <ng-template #additionalToolbarContent>\n <ng-container *ngIf=\"_additionalToolbarContent\" [ngTemplateOutlet]=\"_additionalToolbarContent\"></ng-container>\n </ng-template>\n <div class=\"search-criteria-container\">\n <div #searchParameterFields>\n <ng-content></ng-content>\n <div class=\"search-criteria-buttons\">\n <p-button\n id=\"resetButton\"\n *ngIf=\"resetted.observed\"\n (onClick)=\"onResetClicked()\"\n label=\"{{ 'OCX_SEARCH_HEADER.RESET_BUTTON.TEXT' | translate }}\"\n icon=\"pi pi-eraser\"\n [ariaLabel]=\"'OCX_SEARCH_HEADER.RESET_BUTTON.DETAIL' | translate\"\n title=\"{{ 'OCX_SEARCH_HEADER.RESET_BUTTON.DETAIL' | translate }}\"\n >\n </p-button>\n\n <p-button\n id=\"searchButton\"\n (onClick)=\"onSearchClicked()\"\n label=\"{{ 'OCX_SEARCH_HEADER.SEARCH_BUTTON.TEXT' | translate }}\"\n icon=\"pi pi-search\"\n [ariaLabel]=\"'OCX_SEARCH_HEADER.SEARCH_BUTTON.DETAIL' | translate\"\n title=\"{{ 'OCX_SEARCH_HEADER.SEARCH_BUTTON.DETAIL' | translate }}\"\n >\n </p-button>\n </div>\n </div>\n </div>\n</ocx-page-header>\n", styles: [".search-criteria-buttons{display:flex;flex-flow:row;align-items:flex-start;gap:.5rem;margin-top:.5rem}.search-criteria-container{width:100%;display:flex}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i6.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "style", "styleClass", "badgeClass", "ariaLabel"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: SearchConfigComponent, selector: "ocx-search-config", inputs: ["searchConfigs", "placeholderKey"], outputs: ["selectedSearchConfigChanged"] }, { kind: "component", type: PageHeaderComponent, selector: "ocx-page-header", inputs: ["header", "loading", "figureBackground", "showFigure", "figureImage", "disableDefaultActions", "subheader", "actions", "objectDetails", "showBreadcrumbs", "manualBreadcrumbs", "enableGridView", "gridLayoutDesktopColumns"], outputs: ["save"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
726
+ SearchHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SearchHeaderComponent, selector: "ocx-search-header", inputs: { searchConfigs: "searchConfigs", header: "header", headline: "headline", subheader: "subheader", viewMode: "viewMode", manualBreadcrumbs: "manualBreadcrumbs", actions: "actions", searchButtonDisabled: "searchButtonDisabled", resetButtonDisabled: "resetButtonDisabled" }, outputs: { searched: "searched", resetted: "resetted", selectedSearchConfigChanged: "selectedSearchConfigChanged", viewModeChanged: "viewModeChanged" }, queries: [{ propertyName: "additionalToolbarContent", first: true, predicate: ["additionalToolbarContent"], descendants: true }, { propertyName: "additionalToolbarContentLeft", first: true, predicate: ["additionalToolbarContentLeft"], descendants: true }], viewQueries: [{ propertyName: "searchParameterFields", first: true, predicate: ["searchParameterFields"], descendants: true }], ngImport: i0, template: "<ocx-page-header\n [header]=\"header || ('OCX_SEARCH_HEADER.HEADER' | translate)\"\n [subheader]=\"subheader\"\n [manualBreadcrumbs]=\"manualBreadcrumbs\"\n [actions]=\"headerActions\"\n>\n <ng-template #additionalToolbarContentLeft>\n <ocx-search-config [searchConfigs]=\"searchConfigs\" (selectedSearchConfigChanged)=\"confirmSearchConfig($event)\">\n </ocx-search-config>\n <ng-container\n *ngIf=\"_additionalToolbarContentLeft\"\n [ngTemplateOutlet]=\"_additionalToolbarContentLeft\"\n ></ng-container>\n </ng-template>\n <ng-template #additionalToolbarContent>\n <ng-container *ngIf=\"_additionalToolbarContent\" [ngTemplateOutlet]=\"_additionalToolbarContent\"></ng-container>\n </ng-template>\n <div class=\"search-criteria-container\">\n <div #searchParameterFields>\n <ng-content></ng-content>\n <div class=\"search-criteria-buttons\">\n <p-button\n id=\"resetButton\"\n *ngIf=\"resetted.observed\"\n (onClick)=\"onResetClicked()\"\n label=\"{{ 'OCX_SEARCH_HEADER.RESET_BUTTON.TEXT' | translate }}\"\n icon=\"pi pi-eraser\"\n [ariaLabel]=\"'OCX_SEARCH_HEADER.RESET_BUTTON.DETAIL' | translate\"\n title=\"{{ 'OCX_SEARCH_HEADER.RESET_BUTTON.DETAIL' | translate }}\"\n [disabled]=\"resetButtonDisabled\"\n >\n </p-button>\n\n <p-button\n id=\"searchButton\"\n (onClick)=\"onSearchClicked()\"\n label=\"{{ 'OCX_SEARCH_HEADER.SEARCH_BUTTON.TEXT' | translate }}\"\n icon=\"pi pi-search\"\n [ariaLabel]=\"'OCX_SEARCH_HEADER.SEARCH_BUTTON.DETAIL' | translate\"\n title=\"{{ 'OCX_SEARCH_HEADER.SEARCH_BUTTON.DETAIL' | translate }}\"\n [disabled]=\"searchButtonDisabled\"\n >\n </p-button>\n </div>\n </div>\n </div>\n</ocx-page-header>\n", styles: [".search-criteria-buttons{display:flex;flex-flow:row;align-items:flex-start;gap:.5rem;margin-top:.5rem}.search-criteria-container{width:100%;display:flex}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i6.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "style", "styleClass", "badgeClass", "ariaLabel"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: SearchConfigComponent, selector: "ocx-search-config", inputs: ["searchConfigs", "placeholderKey"], outputs: ["selectedSearchConfigChanged"] }, { kind: "component", type: PageHeaderComponent, selector: "ocx-page-header", inputs: ["header", "loading", "figureBackground", "showFigure", "figureImage", "disableDefaultActions", "subheader", "actions", "objectDetails", "showBreadcrumbs", "manualBreadcrumbs", "enableGridView", "gridLayoutDesktopColumns"], outputs: ["save"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
711
727
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SearchHeaderComponent, decorators: [{
712
728
  type: Component,
713
- args: [{ selector: 'ocx-search-header', template: "<ocx-page-header\n [header]=\"header || ('OCX_SEARCH_HEADER.HEADER' | translate)\"\n [subheader]=\"subheader\"\n [manualBreadcrumbs]=\"manualBreadcrumbs\"\n [actions]=\"headerActions\"\n>\n <ng-template #additionalToolbarContentLeft>\n <ocx-search-config [searchConfigs]=\"searchConfigs\" (selectedSearchConfigChanged)=\"confirmSearchConfig($event)\">\n </ocx-search-config>\n <ng-container *ngIf=\"_additionalToolbarContentLeft\" [ngTemplateOutlet]=\"_additionalToolbarContentLeft\"></ng-container>\n </ng-template>\n <ng-template #additionalToolbarContent>\n <ng-container *ngIf=\"_additionalToolbarContent\" [ngTemplateOutlet]=\"_additionalToolbarContent\"></ng-container>\n </ng-template>\n <div class=\"search-criteria-container\">\n <div #searchParameterFields>\n <ng-content></ng-content>\n <div class=\"search-criteria-buttons\">\n <p-button\n id=\"resetButton\"\n *ngIf=\"resetted.observed\"\n (onClick)=\"onResetClicked()\"\n label=\"{{ 'OCX_SEARCH_HEADER.RESET_BUTTON.TEXT' | translate }}\"\n icon=\"pi pi-eraser\"\n [ariaLabel]=\"'OCX_SEARCH_HEADER.RESET_BUTTON.DETAIL' | translate\"\n title=\"{{ 'OCX_SEARCH_HEADER.RESET_BUTTON.DETAIL' | translate }}\"\n >\n </p-button>\n\n <p-button\n id=\"searchButton\"\n (onClick)=\"onSearchClicked()\"\n label=\"{{ 'OCX_SEARCH_HEADER.SEARCH_BUTTON.TEXT' | translate }}\"\n icon=\"pi pi-search\"\n [ariaLabel]=\"'OCX_SEARCH_HEADER.SEARCH_BUTTON.DETAIL' | translate\"\n title=\"{{ 'OCX_SEARCH_HEADER.SEARCH_BUTTON.DETAIL' | translate }}\"\n >\n </p-button>\n </div>\n </div>\n </div>\n</ocx-page-header>\n", styles: [".search-criteria-buttons{display:flex;flex-flow:row;align-items:flex-start;gap:.5rem;margin-top:.5rem}.search-criteria-container{width:100%;display:flex}\n"] }]
729
+ args: [{ selector: 'ocx-search-header', template: "<ocx-page-header\n [header]=\"header || ('OCX_SEARCH_HEADER.HEADER' | translate)\"\n [subheader]=\"subheader\"\n [manualBreadcrumbs]=\"manualBreadcrumbs\"\n [actions]=\"headerActions\"\n>\n <ng-template #additionalToolbarContentLeft>\n <ocx-search-config [searchConfigs]=\"searchConfigs\" (selectedSearchConfigChanged)=\"confirmSearchConfig($event)\">\n </ocx-search-config>\n <ng-container\n *ngIf=\"_additionalToolbarContentLeft\"\n [ngTemplateOutlet]=\"_additionalToolbarContentLeft\"\n ></ng-container>\n </ng-template>\n <ng-template #additionalToolbarContent>\n <ng-container *ngIf=\"_additionalToolbarContent\" [ngTemplateOutlet]=\"_additionalToolbarContent\"></ng-container>\n </ng-template>\n <div class=\"search-criteria-container\">\n <div #searchParameterFields>\n <ng-content></ng-content>\n <div class=\"search-criteria-buttons\">\n <p-button\n id=\"resetButton\"\n *ngIf=\"resetted.observed\"\n (onClick)=\"onResetClicked()\"\n label=\"{{ 'OCX_SEARCH_HEADER.RESET_BUTTON.TEXT' | translate }}\"\n icon=\"pi pi-eraser\"\n [ariaLabel]=\"'OCX_SEARCH_HEADER.RESET_BUTTON.DETAIL' | translate\"\n title=\"{{ 'OCX_SEARCH_HEADER.RESET_BUTTON.DETAIL' | translate }}\"\n [disabled]=\"resetButtonDisabled\"\n >\n </p-button>\n\n <p-button\n id=\"searchButton\"\n (onClick)=\"onSearchClicked()\"\n label=\"{{ 'OCX_SEARCH_HEADER.SEARCH_BUTTON.TEXT' | translate }}\"\n icon=\"pi pi-search\"\n [ariaLabel]=\"'OCX_SEARCH_HEADER.SEARCH_BUTTON.DETAIL' | translate\"\n title=\"{{ 'OCX_SEARCH_HEADER.SEARCH_BUTTON.DETAIL' | translate }}\"\n [disabled]=\"searchButtonDisabled\"\n >\n </p-button>\n </div>\n </div>\n </div>\n</ocx-page-header>\n", styles: [".search-criteria-buttons{display:flex;flex-flow:row;align-items:flex-start;gap:.5rem;margin-top:.5rem}.search-criteria-container{width:100%;display:flex}\n"] }]
714
730
  }], propDecorators: { searchConfigs: [{
715
731
  type: Input
716
732
  }], header: [{
@@ -725,6 +741,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
725
741
  type: Input
726
742
  }], actions: [{
727
743
  type: Input
744
+ }], searchButtonDisabled: [{
745
+ type: Input
746
+ }], resetButtonDisabled: [{
747
+ type: Input
728
748
  }], searched: [{
729
749
  type: Output
730
750
  }], resetted: [{
@@ -1169,6 +1189,7 @@ class DataListGridComponent extends DataSortBase {
1169
1189
  return this._data$.getValue();
1170
1190
  }
1171
1191
  set data(value) {
1192
+ !this._data$.getValue().length ?? this.resetPage();
1172
1193
  this._originalData = [...value];
1173
1194
  this._data$.next([...value]);
1174
1195
  }
@@ -1176,6 +1197,7 @@ class DataListGridComponent extends DataSortBase {
1176
1197
  return this._filters$.getValue();
1177
1198
  }
1178
1199
  set filters(value) {
1200
+ !this._filters$.getValue().length ?? this.resetPage();
1179
1201
  this._filters$.next(value);
1180
1202
  }
1181
1203
  get sortDirection() {
@@ -1409,6 +1431,10 @@ class DataListGridComponent extends DataSortBase {
1409
1431
  this.page = page;
1410
1432
  this.pageChanged.emit(page);
1411
1433
  }
1434
+ resetPage() {
1435
+ this.page = 0;
1436
+ this.pageChanged.emit(this.page);
1437
+ }
1412
1438
  fieldIsTruthy(object, key) {
1413
1439
  return !!this.resolveFieldData(object, key);
1414
1440
  }
@@ -1719,6 +1745,7 @@ class DataTableComponent extends DataSortBase {
1719
1745
  return this._rows$.getValue();
1720
1746
  }
1721
1747
  set rows(value) {
1748
+ !this._rows$.getValue().length ?? this.resetPage();
1722
1749
  this._rows$.next(value);
1723
1750
  }
1724
1751
  get selectedRows() {
@@ -1731,6 +1758,7 @@ class DataTableComponent extends DataSortBase {
1731
1758
  return this._filters$.getValue();
1732
1759
  }
1733
1760
  set filters(value) {
1761
+ !this._filters$.getValue().length ?? this.resetPage();
1734
1762
  this._filters$.next(value);
1735
1763
  }
1736
1764
  get sortDirection() {
@@ -1933,6 +1961,7 @@ class DataTableComponent extends DataSortBase {
1933
1961
  this.filters = filters;
1934
1962
  }
1935
1963
  this.filtered.emit(filters);
1964
+ this.resetPage();
1936
1965
  }
1937
1966
  getSelectedFilters(columnId) {
1938
1967
  return this.filters.filter((filter) => filter.columnId === columnId).map((filter) => filter.value);
@@ -1967,6 +1996,10 @@ class DataTableComponent extends DataSortBase {
1967
1996
  this.page = page;
1968
1997
  this.pageChanged.emit(page);
1969
1998
  }
1999
+ resetPage() {
2000
+ this.page = 0;
2001
+ this.pageChanged.emit(this.page);
2002
+ }
1970
2003
  fieldIsTruthy(object, key) {
1971
2004
  return !!ObjectUtils.resolveFieldData(object, key);
1972
2005
  }