@devopmaat/badaboom 1.4.1 → 1.4.3

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.
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { InjectionToken, Input, HostBinding, Component, EventEmitter, Output, inject, Injectable, makeEnvironmentProviders, input, signal, Directive, Injector, Pipe, viewChild, contentChildren, effect, computed, output, Optional, Self, HostListener, LOCALE_ID, Inject, DestroyRef, ChangeDetectorRef, ElementRef } from '@angular/core';
2
+ import { InjectionToken, Input, HostBinding, Component, EventEmitter, Output, inject, Injectable, makeEnvironmentProviders, input, signal, Directive, Injector, Pipe, viewChild, contentChildren, DestroyRef, effect, computed, output, Optional, Self, HostListener, LOCALE_ID, Inject, ChangeDetectorRef, ElementRef } from '@angular/core';
3
3
  import { HttpClient, HttpErrorResponse, provideHttpClient, withInterceptors } from '@angular/common/http';
4
4
  import * as i2$4 from '@angular/router';
5
5
  import { Router, RouterOutlet, provideRouter, ActivatedRoute, NavigationStart, NavigationEnd, RouterModule, RouterLink } from '@angular/router';
@@ -26,7 +26,7 @@ import { MatMenuTrigger, MatMenuModule } from '@angular/material/menu';
26
26
  import * as i4 from '@angular/material/sort';
27
27
  import { MatSortModule } from '@angular/material/sort';
28
28
  import * as i2$1 from '@angular/material/table';
29
- import { MatTableModule } from '@angular/material/table';
29
+ import { MatTableModule, MatTableDataSource } from '@angular/material/table';
30
30
  import * as i5$1 from '@angular/material/sidenav';
31
31
  import { MatSidenavModule } from '@angular/material/sidenav';
32
32
  import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
@@ -1137,47 +1137,40 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
1137
1137
  class BdbPaginatorV2Component {
1138
1138
  constructor() {
1139
1139
  this.dataSource = input.required(...(ngDevMode ? [{ debugName: "dataSource" }] : []));
1140
- this._onDestroy = new Subject();
1141
- this._disabled = false;
1142
- }
1143
- set disabled(disabled) {
1144
- this._disabled = disabled;
1145
- }
1146
- get disabled() {
1147
- return this._disabled;
1140
+ this.destroyRef = inject(DestroyRef);
1141
+ this.disabled = signal(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
1142
+ this.pageSize = signal(undefined, ...(ngDevMode ? [{ debugName: "pageSize" }] : []));
1143
+ this.page = signal(undefined, ...(ngDevMode ? [{ debugName: "page" }] : []));
1144
+ this.length = signal(undefined, ...(ngDevMode ? [{ debugName: "length" }] : []));
1148
1145
  }
1149
1146
  ngOnInit() {
1150
1147
  this.dataSource()
1151
- .response$.pipe(takeUntil(this._onDestroy))
1148
+ .response$.pipe(takeUntilDestroyed(this.destroyRef))
1152
1149
  .subscribe({
1153
1150
  next: (x) => {
1154
1151
  if (x === undefined) {
1155
- this.disabled = true;
1152
+ this.disabled.set(true);
1156
1153
  }
1157
1154
  else {
1158
- this.disabled = false;
1159
- this.pageSize = x.pageSize;
1160
- this.page = x.page;
1161
- this.length = x.count;
1155
+ this.disabled.set(false);
1156
+ this.pageSize.set(x.pageSize);
1157
+ this.page.set(x.page);
1158
+ this.length.set(x.count);
1162
1159
  }
1163
1160
  },
1164
1161
  });
1165
1162
  }
1166
- ngOnDestroy() {
1167
- this._onDestroy.next();
1168
- this._onDestroy.complete();
1169
- }
1170
1163
  changePage(event) {
1171
1164
  this.dataSource().page = event.pageIndex;
1172
1165
  this.dataSource().pageSize = event.pageSize;
1173
1166
  this.dataSource().load();
1174
1167
  }
1175
1168
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: BdbPaginatorV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1176
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: BdbPaginatorV2Component, isStandalone: true, selector: "bdb-paginator-v2", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<mat-paginator\r\n [pageSize]=\"pageSize\"\r\n [pageIndex]=\"page\"\r\n [length]=\"length\"\r\n [disabled]=\"disabled\"\r\n (page)=\"changePage($event)\"\r\n [pageSizeOptions]=\"[5, 10, 15, 20, 25]\"\r\n [hidePageSize]=\"true\">\r\n</mat-paginator>\r\n", styles: [":host{--mat-paginator-container-background-color: transparent}\n"], dependencies: [{ kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i1$3.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }] }); }
1169
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: BdbPaginatorV2Component, isStandalone: true, selector: "bdb-paginator-v2", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<mat-paginator\r\n [pageSize]=\"pageSize()\"\r\n [pageIndex]=\"page()\"\r\n [length]=\"length()\"\r\n [disabled]=\"disabled()\"\r\n (page)=\"changePage($event)\"\r\n [pageSizeOptions]=\"[5, 10, 15, 20, 25]\"\r\n [hidePageSize]=\"true\">\r\n</mat-paginator>\r\n", styles: [":host{--mat-paginator-container-background-color: transparent}\n"], dependencies: [{ kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i1$3.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }] }); }
1177
1170
  }
1178
1171
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: BdbPaginatorV2Component, decorators: [{
1179
1172
  type: Component,
1180
- args: [{ selector: 'bdb-paginator-v2', imports: [MatPaginatorModule], template: "<mat-paginator\r\n [pageSize]=\"pageSize\"\r\n [pageIndex]=\"page\"\r\n [length]=\"length\"\r\n [disabled]=\"disabled\"\r\n (page)=\"changePage($event)\"\r\n [pageSizeOptions]=\"[5, 10, 15, 20, 25]\"\r\n [hidePageSize]=\"true\">\r\n</mat-paginator>\r\n", styles: [":host{--mat-paginator-container-background-color: transparent}\n"] }]
1173
+ args: [{ selector: 'bdb-paginator-v2', imports: [MatPaginatorModule], template: "<mat-paginator\r\n [pageSize]=\"pageSize()\"\r\n [pageIndex]=\"page()\"\r\n [length]=\"length()\"\r\n [disabled]=\"disabled()\"\r\n (page)=\"changePage($event)\"\r\n [pageSizeOptions]=\"[5, 10, 15, 20, 25]\"\r\n [hidePageSize]=\"true\">\r\n</mat-paginator>\r\n", styles: [":host{--mat-paginator-container-background-color: transparent}\n"] }]
1181
1174
  }], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }] } });
1182
1175
 
1183
1176
  class BdbQueryInputV2Component {
@@ -1304,25 +1297,25 @@ class BdbTableV2Component {
1304
1297
  if (!selection) {
1305
1298
  return false;
1306
1299
  }
1307
- return this.dataSource()?.every((x) => selection.isSelected(x)) ?? false;
1300
+ return this.dataSource()?.data.every((x) => selection.isSelected(x)) ?? false;
1308
1301
  }
1309
1302
  anySelected() {
1310
1303
  const selection = this.selection();
1311
1304
  if (!selection) {
1312
1305
  return false;
1313
1306
  }
1314
- return this.dataSource()?.some((x) => selection.isSelected(x)) ?? false;
1307
+ return this.dataSource()?.data.some((x) => selection.isSelected(x)) ?? false;
1315
1308
  }
1316
1309
  toggleAllRows() {
1317
1310
  const selection = this.selection();
1318
- if (!(selection && this.dataSource)) {
1311
+ if (!(selection && this.dataSource())) {
1319
1312
  return;
1320
1313
  }
1321
1314
  if (this.isAllSelected()) {
1322
- selection.deselect(...this.dataSource());
1315
+ selection.deselect(...this.dataSource().data);
1323
1316
  }
1324
1317
  else {
1325
- selection.select(...this.dataSource());
1318
+ selection.select(...this.dataSource().data);
1326
1319
  }
1327
1320
  }
1328
1321
  rowClass(row) {
@@ -1367,12 +1360,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
1367
1360
  class BdbGridComponent {
1368
1361
  constructor() {
1369
1362
  this.dataSource = input.required(...(ngDevMode ? [{ debugName: "dataSource" }] : []));
1370
- this.columns = [];
1371
- this.displayedColumns = [];
1363
+ this.columns = input([], ...(ngDevMode ? [{ debugName: "columns" }] : []));
1364
+ this.displayedColumns = input([], ...(ngDevMode ? [{ debugName: "displayedColumns" }] : []));
1365
+ this.selection = input(undefined, ...(ngDevMode ? [{ debugName: "selection" }] : []));
1372
1366
  this.contextActions = input([], ...(ngDevMode ? [{ debugName: "contextActions" }] : []));
1373
1367
  this.contextAction = output();
1374
1368
  this.rowColor = input(...(ngDevMode ? [undefined, { debugName: "rowColor" }] : []));
1375
- this.rowClick = new EventEmitter();
1369
+ this.rowClick = output();
1370
+ this.filterDrawerOpen = false;
1376
1371
  this.filterDrawerOpened = output();
1377
1372
  this.cellTemplates = contentChildren(BdbCellDirective, { ...(ngDevMode ? { debugName: "cellTemplates" } : {}), descendants: true });
1378
1373
  }
@@ -1381,7 +1376,7 @@ class BdbGridComponent {
1381
1376
  }
1382
1377
  sortChange(event) {
1383
1378
  const dataSource = this.dataSource();
1384
- const column = this.columns.find(x => x.id === event.active);
1379
+ const column = this.columns().find(x => x.id === event.active);
1385
1380
  if (column && dataSource) {
1386
1381
  dataSource.sortField = column.id;
1387
1382
  dataSource.sortDirection = event.direction === '' ? 'asc' : event.direction;
@@ -1389,7 +1384,7 @@ class BdbGridComponent {
1389
1384
  }
1390
1385
  }
1391
1386
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: BdbGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1392
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: BdbGridComponent, isStandalone: true, selector: "bdb-grid", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: false, isRequired: false, transformFunction: null }, displayedColumns: { classPropertyName: "displayedColumns", publicName: "displayedColumns", isSignal: false, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: false, isRequired: false, transformFunction: null }, contextActions: { classPropertyName: "contextActions", publicName: "contextActions", isSignal: true, isRequired: false, transformFunction: null }, rowColor: { classPropertyName: "rowColor", publicName: "rowColor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { contextAction: "contextAction", rowClick: "rowClick", filterDrawerOpened: "filterDrawerOpened" }, queries: [{ propertyName: "cellTemplates", predicate: BdbCellDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<mat-toolbar>\r\n <button mat-icon-button (click)=\"filterDrawerOpen = !filterDrawerOpen; filterDrawerOpened.emit(filterDrawerOpen)\">\r\n @if (filterDrawerOpen) {\r\n <mat-icon>filter_alt</mat-icon>\r\n } @else {\r\n <mat-icon>filter_arrow_right</mat-icon>\r\n }\r\n </button>\r\n <div style=\"flex: 1; display: flex; align-items: center; gap: 8px\">\r\n <ng-content select=\"toolbar-item\"></ng-content>\r\n </div>\r\n <bdb-paginator-v2 [dataSource]=\"dataSource()\"></bdb-paginator-v2>\r\n <bdb-query-input-v2 [dataSource]=\"dataSource()\"></bdb-query-input-v2>\r\n</mat-toolbar>\r\n\r\n<mat-drawer-container class=\"filter-drawer\">\r\n <mat-drawer mode=\"side\" [opened]=\"filterDrawerOpen\">\r\n <ng-content select=\"filter-drawer\"></ng-content>\r\n </mat-drawer>\r\n <mat-drawer-content>\r\n <bdb-table-v2\r\n [columns]=\"columns\"\r\n [dataSource]=\"dataSource().data\"\r\n [error]=\"dataSource().error()\"\r\n [displayedColumns]=\"displayedColumns\"\r\n [selection]=\"selection\"\r\n [rowColor]=\"rowColor()\"\r\n [contextActions]=\"contextActions()\"\r\n (contextAction)=\"contextAction.emit($event)\"\r\n (rowClick)=\"rowClick.emit($event)\"\r\n (sortChange)=\"sortChange($event)\">\r\n @for (cellTemplate of cellTemplates(); track cellTemplate.bdbCellDef) {\r\n <ng-template bdbCellDef=\"{{ cellTemplate.bdbCellDef }}\" let-element>\r\n <ng-container *ngTemplateOutlet=\"cellTemplate.templateRef; context: { $implicit: element }\"></ng-container>\r\n </ng-template>\r\n }\r\n </bdb-table-v2>\r\n </mat-drawer-content>\r\n</mat-drawer-container>\r\n", styles: [":host{display:flex;flex-direction:column;justify-content:stretch;flex:0 1 100%}:host mat-toolbar{flex:0 0 auto;display:flex;flex-direction:row;gap:8px;justify-content:start;align-items:center}:host bdb-table{display:contents;flex:0 1 100%}:host bdb-query-input{--mdc-filled-text-field-container-color: var(--mat-sys-surface-container-lowest)}:host bdb-paginator{flex:0 0 auto}.filter-drawer{flex-grow:1;--mat-sidenav-content-background-color: var(--mat-sys-surface)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i2$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i5$1.MatDrawer, selector: "mat-drawer", inputs: ["position", "mode", "disableClose", "autoFocus", "opened"], outputs: ["openedChange", "opened", "openedStart", "closed", "closedStart", "positionChanged"], exportAs: ["matDrawer"] }, { kind: "component", type: i5$1.MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: i5$1.MatDrawerContent, selector: "mat-drawer-content" }, { kind: "component", type: BdbTableV2Component, selector: "bdb-table-v2", inputs: ["dataSource", "columns", "displayedColumns", "selection", "selectOnRowClick", "contextActions", "rowColor", "error", "matSortDisabled", "trackBy"], outputs: ["contextAction", "rowClick", "sortChange"] }, { kind: "directive", type: BdbCellDirective, selector: "ng-template[bdbCellDef]", inputs: ["bdbCellDef"] }, { kind: "component", type: BdbQueryInputV2Component, selector: "bdb-query-input-v2[dataSource]", inputs: ["dataSource"] }, { kind: "component", type: BdbPaginatorV2Component, selector: "bdb-paginator-v2", inputs: ["dataSource"] }] }); }
1387
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: BdbGridComponent, isStandalone: true, selector: "bdb-grid", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, displayedColumns: { classPropertyName: "displayedColumns", publicName: "displayedColumns", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, contextActions: { classPropertyName: "contextActions", publicName: "contextActions", isSignal: true, isRequired: false, transformFunction: null }, rowColor: { classPropertyName: "rowColor", publicName: "rowColor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { contextAction: "contextAction", rowClick: "rowClick", filterDrawerOpened: "filterDrawerOpened" }, queries: [{ propertyName: "cellTemplates", predicate: BdbCellDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<mat-toolbar>\r\n <button mat-icon-button (click)=\"filterDrawerOpen = !filterDrawerOpen; filterDrawerOpened.emit(filterDrawerOpen)\">\r\n @if (filterDrawerOpen) {\r\n <mat-icon>filter_alt</mat-icon>\r\n } @else {\r\n <mat-icon>filter_arrow_right</mat-icon>\r\n }\r\n </button>\r\n <div style=\"flex: 1; display: flex; align-items: center; gap: 8px\">\r\n <ng-content select=\"toolbar-item\"></ng-content>\r\n </div>\r\n <bdb-paginator-v2 [dataSource]=\"dataSource()\"></bdb-paginator-v2>\r\n <bdb-query-input-v2 [dataSource]=\"dataSource()\"></bdb-query-input-v2>\r\n</mat-toolbar>\r\n\r\n<mat-drawer-container class=\"filter-drawer\">\r\n <mat-drawer mode=\"side\" [opened]=\"filterDrawerOpen\">\r\n <ng-content select=\"filter-drawer\"></ng-content>\r\n </mat-drawer>\r\n <mat-drawer-content>\r\n <bdb-table-v2\r\n [columns]=\"columns()\"\r\n [dataSource]=\"dataSource()\"\r\n [error]=\"dataSource().error()\"\r\n [displayedColumns]=\"displayedColumns()\"\r\n [selection]=\"selection()\"\r\n [rowColor]=\"rowColor()\"\r\n [contextActions]=\"contextActions()\"\r\n (contextAction)=\"contextAction.emit($event)\"\r\n (rowClick)=\"rowClick.emit($event)\"\r\n (sortChange)=\"sortChange($event)\">\r\n @for (cellTemplate of cellTemplates(); track cellTemplate.bdbCellDef) {\r\n <ng-template bdbCellDef=\"{{ cellTemplate.bdbCellDef }}\" let-element>\r\n <ng-container *ngTemplateOutlet=\"cellTemplate.templateRef; context: { $implicit: element }\"></ng-container>\r\n </ng-template>\r\n }\r\n </bdb-table-v2>\r\n </mat-drawer-content>\r\n</mat-drawer-container>\r\n", styles: [":host{display:flex;flex-direction:column;justify-content:stretch;flex:0 1 100%}:host mat-toolbar{flex:0 0 auto;display:flex;flex-direction:row;gap:8px;justify-content:start;align-items:center}:host bdb-table{display:contents;flex:0 1 100%}:host bdb-query-input{--mdc-filled-text-field-container-color: var(--mat-sys-surface-container-lowest)}:host bdb-paginator{flex:0 0 auto}.filter-drawer{flex-grow:1;--mat-sidenav-content-background-color: var(--mat-sys-surface)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i2$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i5$1.MatDrawer, selector: "mat-drawer", inputs: ["position", "mode", "disableClose", "autoFocus", "opened"], outputs: ["openedChange", "opened", "openedStart", "closed", "closedStart", "positionChanged"], exportAs: ["matDrawer"] }, { kind: "component", type: i5$1.MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: i5$1.MatDrawerContent, selector: "mat-drawer-content" }, { kind: "component", type: BdbTableV2Component, selector: "bdb-table-v2", inputs: ["dataSource", "columns", "displayedColumns", "selection", "selectOnRowClick", "contextActions", "rowColor", "error", "matSortDisabled", "trackBy"], outputs: ["contextAction", "rowClick", "sortChange"] }, { kind: "directive", type: BdbCellDirective, selector: "ng-template[bdbCellDef]", inputs: ["bdbCellDef"] }, { kind: "component", type: BdbQueryInputV2Component, selector: "bdb-query-input-v2[dataSource]", inputs: ["dataSource"] }, { kind: "component", type: BdbPaginatorV2Component, selector: "bdb-paginator-v2", inputs: ["dataSource"] }] }); }
1393
1388
  }
1394
1389
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: BdbGridComponent, decorators: [{
1395
1390
  type: Component,
@@ -1404,16 +1399,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
1404
1399
  BdbCellDirective,
1405
1400
  BdbQueryInputV2Component,
1406
1401
  BdbPaginatorV2Component,
1407
- ], template: "<mat-toolbar>\r\n <button mat-icon-button (click)=\"filterDrawerOpen = !filterDrawerOpen; filterDrawerOpened.emit(filterDrawerOpen)\">\r\n @if (filterDrawerOpen) {\r\n <mat-icon>filter_alt</mat-icon>\r\n } @else {\r\n <mat-icon>filter_arrow_right</mat-icon>\r\n }\r\n </button>\r\n <div style=\"flex: 1; display: flex; align-items: center; gap: 8px\">\r\n <ng-content select=\"toolbar-item\"></ng-content>\r\n </div>\r\n <bdb-paginator-v2 [dataSource]=\"dataSource()\"></bdb-paginator-v2>\r\n <bdb-query-input-v2 [dataSource]=\"dataSource()\"></bdb-query-input-v2>\r\n</mat-toolbar>\r\n\r\n<mat-drawer-container class=\"filter-drawer\">\r\n <mat-drawer mode=\"side\" [opened]=\"filterDrawerOpen\">\r\n <ng-content select=\"filter-drawer\"></ng-content>\r\n </mat-drawer>\r\n <mat-drawer-content>\r\n <bdb-table-v2\r\n [columns]=\"columns\"\r\n [dataSource]=\"dataSource().data\"\r\n [error]=\"dataSource().error()\"\r\n [displayedColumns]=\"displayedColumns\"\r\n [selection]=\"selection\"\r\n [rowColor]=\"rowColor()\"\r\n [contextActions]=\"contextActions()\"\r\n (contextAction)=\"contextAction.emit($event)\"\r\n (rowClick)=\"rowClick.emit($event)\"\r\n (sortChange)=\"sortChange($event)\">\r\n @for (cellTemplate of cellTemplates(); track cellTemplate.bdbCellDef) {\r\n <ng-template bdbCellDef=\"{{ cellTemplate.bdbCellDef }}\" let-element>\r\n <ng-container *ngTemplateOutlet=\"cellTemplate.templateRef; context: { $implicit: element }\"></ng-container>\r\n </ng-template>\r\n }\r\n </bdb-table-v2>\r\n </mat-drawer-content>\r\n</mat-drawer-container>\r\n", styles: [":host{display:flex;flex-direction:column;justify-content:stretch;flex:0 1 100%}:host mat-toolbar{flex:0 0 auto;display:flex;flex-direction:row;gap:8px;justify-content:start;align-items:center}:host bdb-table{display:contents;flex:0 1 100%}:host bdb-query-input{--mdc-filled-text-field-container-color: var(--mat-sys-surface-container-lowest)}:host bdb-paginator{flex:0 0 auto}.filter-drawer{flex-grow:1;--mat-sidenav-content-background-color: var(--mat-sys-surface)}\n"] }]
1408
- }], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], columns: [{
1409
- type: Input
1410
- }], displayedColumns: [{
1411
- type: Input
1412
- }], selection: [{
1413
- type: Input
1414
- }], contextActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "contextActions", required: false }] }], contextAction: [{ type: i0.Output, args: ["contextAction"] }], rowColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowColor", required: false }] }], rowClick: [{
1415
- type: Output
1416
- }], filterDrawerOpened: [{ type: i0.Output, args: ["filterDrawerOpened"] }], cellTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => BdbCellDirective), { ...{ descendants: true }, isSignal: true }] }] } });
1402
+ ], template: "<mat-toolbar>\r\n <button mat-icon-button (click)=\"filterDrawerOpen = !filterDrawerOpen; filterDrawerOpened.emit(filterDrawerOpen)\">\r\n @if (filterDrawerOpen) {\r\n <mat-icon>filter_alt</mat-icon>\r\n } @else {\r\n <mat-icon>filter_arrow_right</mat-icon>\r\n }\r\n </button>\r\n <div style=\"flex: 1; display: flex; align-items: center; gap: 8px\">\r\n <ng-content select=\"toolbar-item\"></ng-content>\r\n </div>\r\n <bdb-paginator-v2 [dataSource]=\"dataSource()\"></bdb-paginator-v2>\r\n <bdb-query-input-v2 [dataSource]=\"dataSource()\"></bdb-query-input-v2>\r\n</mat-toolbar>\r\n\r\n<mat-drawer-container class=\"filter-drawer\">\r\n <mat-drawer mode=\"side\" [opened]=\"filterDrawerOpen\">\r\n <ng-content select=\"filter-drawer\"></ng-content>\r\n </mat-drawer>\r\n <mat-drawer-content>\r\n <bdb-table-v2\r\n [columns]=\"columns()\"\r\n [dataSource]=\"dataSource()\"\r\n [error]=\"dataSource().error()\"\r\n [displayedColumns]=\"displayedColumns()\"\r\n [selection]=\"selection()\"\r\n [rowColor]=\"rowColor()\"\r\n [contextActions]=\"contextActions()\"\r\n (contextAction)=\"contextAction.emit($event)\"\r\n (rowClick)=\"rowClick.emit($event)\"\r\n (sortChange)=\"sortChange($event)\">\r\n @for (cellTemplate of cellTemplates(); track cellTemplate.bdbCellDef) {\r\n <ng-template bdbCellDef=\"{{ cellTemplate.bdbCellDef }}\" let-element>\r\n <ng-container *ngTemplateOutlet=\"cellTemplate.templateRef; context: { $implicit: element }\"></ng-container>\r\n </ng-template>\r\n }\r\n </bdb-table-v2>\r\n </mat-drawer-content>\r\n</mat-drawer-container>\r\n", styles: [":host{display:flex;flex-direction:column;justify-content:stretch;flex:0 1 100%}:host mat-toolbar{flex:0 0 auto;display:flex;flex-direction:row;gap:8px;justify-content:start;align-items:center}:host bdb-table{display:contents;flex:0 1 100%}:host bdb-query-input{--mdc-filled-text-field-container-color: var(--mat-sys-surface-container-lowest)}:host bdb-paginator{flex:0 0 auto}.filter-drawer{flex-grow:1;--mat-sidenav-content-background-color: var(--mat-sys-surface)}\n"] }]
1403
+ }], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], displayedColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayedColumns", required: false }] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }], contextActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "contextActions", required: false }] }], contextAction: [{ type: i0.Output, args: ["contextAction"] }], rowColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowColor", required: false }] }], rowClick: [{ type: i0.Output, args: ["rowClick"] }], filterDrawerOpened: [{ type: i0.Output, args: ["filterDrawerOpened"] }], cellTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => BdbCellDirective), { ...{ descendants: true }, isSignal: true }] }] } });
1417
1404
 
1418
1405
  class BdbSearchInputComponent {
1419
1406
  // MatFormFieldControl required properties
@@ -3135,7 +3122,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
3135
3122
  /// <summary>
3136
3123
  /// A data source that can be used with the BdbTableComponent, that supports persistence of the state (e.g. in queryParameters).
3137
3124
  /// </summary>
3138
- class BdbDataSourceV2 {
3125
+ class BdbDataSourceV2 extends MatTableDataSource {
3139
3126
  get state() {
3140
3127
  return {
3141
3128
  pageSize: this.pageSize == this.defaultPageSize ? undefined : this.pageSize,
@@ -3159,9 +3146,6 @@ class BdbDataSourceV2 {
3159
3146
  this.sortDirection === state.sortDirection &&
3160
3147
  this.query === state.query);
3161
3148
  }
3162
- get data() {
3163
- return this.responseSubject.getValue()?.rows ?? [];
3164
- }
3165
3149
  get identifier() {
3166
3150
  return this._identifier;
3167
3151
  }
@@ -3170,7 +3154,7 @@ class BdbDataSourceV2 {
3170
3154
  this.setPersistence();
3171
3155
  }
3172
3156
  constructor() {
3173
- // abstract service: BdbServiceR<BdbEntity, TEntity>;
3157
+ super();
3174
3158
  this.destroyRef = inject(DestroyRef);
3175
3159
  this.router = inject(Router);
3176
3160
  this.route = inject(ActivatedRoute);
@@ -3183,6 +3167,7 @@ class BdbDataSourceV2 {
3183
3167
  this.request$ = this.requestSubject.asObservable();
3184
3168
  this.responseSubject = new BehaviorSubject(undefined);
3185
3169
  this.response$ = this.responseSubject.asObservable();
3170
+ this.dataSubject = new BehaviorSubject([]);
3186
3171
  this._loading = signal(false, ...(ngDevMode ? [{ debugName: "_loading" }] : []));
3187
3172
  this.loading = this._loading.asReadonly();
3188
3173
  this._error = signal(undefined, ...(ngDevMode ? [{ debugName: "_error" }] : []));
@@ -3196,15 +3181,13 @@ class BdbDataSourceV2 {
3196
3181
  return of({ page: 0, count: 0, rows: [], pageSize: 15 });
3197
3182
  }), tap$1(response => {
3198
3183
  this.responseSubject.next(response);
3184
+ this.dataSubject.next(response.rows);
3199
3185
  }), finalize(() => this._loading.set(false)))))
3200
3186
  .subscribe();
3201
3187
  }
3202
- disconnect() {
3203
- return;
3204
- }
3205
3188
  // Connects the data source to the table.
3206
3189
  connect() {
3207
- return this.responseSubject.asObservable().pipe(map(x => x?.rows ?? []));
3190
+ return this.dataSubject;
3208
3191
  }
3209
3192
  load(loadOptions = {}) {
3210
3193
  this.requestSubject.next([this.createRequest(), loadOptions]);