@one-paragon/angular-utilities 2.2.10 → 2.2.12

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 (11) hide show
  1. package/fesm2022/one-paragon-angular-utilities.mjs +74 -23
  2. package/fesm2022/one-paragon-angular-utilities.mjs.map +1 -1
  3. package/package.json +1 -1
  4. package/table-builder/classes/TableBuilderConfig.d.ts +1 -1
  5. package/table-builder/classes/TableState.d.ts +1 -0
  6. package/table-builder/components/generic-table/generic-table.component.d.ts +1 -1
  7. package/table-builder/components/table-container/table-container.component.d.ts +4 -1
  8. package/table-builder/interfaces/report-def.d.ts +1 -1
  9. package/table-builder/pipes/format-filter-value.pipe.d.ts +0 -1
  10. package/table-builder/services/all-values-filter-creator.service.d.ts +4 -0
  11. package/table-builder/services/link-creator.service.d.ts +0 -1
package/fesm2022/one-paragon-angular-utilities.mjs CHANGED
@@ -1016,6 +1016,7 @@ class KeysToDelete {
1016
1016
  this.props = null;
1017
1017
  this.showAll = null;
1018
1018
  this.minColumnWidth = null;
1019
+ this.allFilters = null;
1019
1020
  }
1020
1021
  }
1021
1022
  const keysToDelete = Object.keys(new KeysToDelete());
@@ -1037,6 +1038,7 @@ const defaultTableState = {
1037
1038
  notPersistedTableSettings: new NotPersistedTableSettings(),
1038
1039
  pageSize: 10,
1039
1040
  linkMaps: {},
1041
+ allFilters: {},
1040
1042
  groupBy: [],
1041
1043
  currentPage: 0,
1042
1044
  props: {},
@@ -3130,7 +3132,10 @@ class InListFilterComponent {
3130
3132
  this.$metaData = computed(() => this.tableState.$getMetaData(this.$key())());
3131
3133
  this.$keyValues = computed(() => {
3132
3134
  const metaData = this.$metaData();
3133
- if (metaData?.additional?.filterOptions?.filterableValues) {
3135
+ if (metaData?.additional?.filterOptions?.filterableValues === 'all values') {
3136
+ return this.tableState.selectSignal(s => s.allFilters)()[metaData.key].map(f => ({ key: f, value: f }));
3137
+ }
3138
+ else if (metaData?.additional?.filterOptions?.filterableValues) {
3134
3139
  return metaData.additional.filterOptions.filterableValues.map(value => ({ key: value, value }));
3135
3140
  }
3136
3141
  else if (metaData?.fieldType === FieldType.Enum) {
@@ -3489,7 +3494,6 @@ function currencyFormatter(amt) {
3489
3494
  class FormatFilterValuePipe {
3490
3495
  constructor() {
3491
3496
  this.tableState = inject(TableStore);
3492
- this.datePipe = inject(DatePipe);
3493
3497
  }
3494
3498
  transform(value, key, filterType) {
3495
3499
  return computed(() => transform(value, this.tableState.$getMetaData(key)(), filterType));
@@ -3813,7 +3817,10 @@ class ColumnHeaderMenuComponent {
3813
3817
  this.$currentFilterType.set(filterType);
3814
3818
  }
3815
3819
  onEnter(filter, metaData) {
3816
- if (filter.filterValue != undefined && this.$currentFilterType()) {
3820
+ if (this.$currentFilterType() === FilterType.In && !filter.filterValue.length) {
3821
+ this.tableState.removeFilter(`header-column-${metaData.key}`);
3822
+ }
3823
+ else if (filter.filterValue != undefined && this.$currentFilterType()) {
3817
3824
  this.tableState.addFilter({
3818
3825
  fieldType: this.$fieldType(),
3819
3826
  filterId: `header-column-${metaData.key}`,
@@ -4095,7 +4102,7 @@ let tbGroupBy = (data, groupByKeys, level = 1, parentGroupName) => {
4095
4102
  };
4096
4103
  function groupData(groupByKey, groupData, level = 1, parentGroupName) {
4097
4104
  const getter = getFactory(groupByKey);
4098
- const groupedDataDict = supportsGroupBy ? Object.groupBy(groupData, d => getter(d) ?? 'BLANK') : groupBy(groupData, groupByKey);
4105
+ const groupedDataDict = supportsGroupBy ? Object.groupBy(groupData, d => getter(d) ?? null) : groupBy(groupData, groupByKey);
4099
4106
  const groupedDataArr = Object.entries(groupedDataDict).map(([name, groupData]) => {
4100
4107
  const uniqueName = parentGroupName ? `${parentGroupName}-${name}` : `${name}`;
4101
4108
  return {
@@ -4372,9 +4379,9 @@ class GenericTableComponent {
4372
4379
  }
4373
4380
  }
4374
4381
  });
4375
- this.getTransform = (key, val) => computed(() => {
4382
+ this.getGroupHeaderTransform = (key, val) => computed(() => {
4376
4383
  if (val == undefined || val === 'null')
4377
- return '';
4384
+ return 'BLANK';
4378
4385
  try {
4379
4386
  return createTransformer(this.state.$getMetaData(key)(), this.config, true, true)({ [`${key}`]: val }) || val;
4380
4387
  }
@@ -4519,14 +4526,14 @@ class GenericTableComponent {
4519
4526
  }
4520
4527
  }
4521
4528
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: GenericTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
4522
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: GenericTableComponent, isStandalone: true, selector: "tb-generic-table", inputs: { $displayDataLength: { classPropertyName: "$displayDataLength", publicName: "displayDataLength", isSignal: true, isRequired: true, transformFunction: null }, $data: { classPropertyName: "$data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, $rows: { classPropertyName: "$rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, $columnInfos: { classPropertyName: "$columnInfos", publicName: "columnInfos", isSignal: true, isRequired: true, transformFunction: null }, $dataSource: { classPropertyName: "$dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, $trackBy: { classPropertyName: "$trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection$: "selection" }, viewQueries: [{ propertyName: "$headerRow", first: true, predicate: MatHeaderRowDef, descendants: true, isSignal: true }, { propertyName: "$footerRow", first: true, predicate: MatFooterRowDef, descendants: true, isSignal: true }, { propertyName: "$table", first: true, predicate: MatTable, descendants: true, isSignal: true }, { propertyName: "$dropList", first: true, predicate: CdkDropList, descendants: true, isSignal: true }], ngImport: i0, template: "<mat-table\r\n #table\r\n cdkDropList\r\n cdkDropListLockAxis='x'\r\n cdkDropListOrientation=\"horizontal\"\r\n class=\"table-drag-list\"\r\n [dataSource]=\"$dataSource()\"\r\n [trackBy]=\"$trackByFunction()\"\r\n [style]=\"$tableWidth()\"\r\n (cdkDropListDropped)=\"drop($event)\"\r\n>\r\n\r\n <!-- select column -->\r\n <ng-container matColumnDef=\"select\">\r\n @let selection = $selection();\r\n <mat-header-cell *matHeaderCellDef class=\"select-column\">\r\n <mat-checkbox [checked]=\"!!($masterToggleChecked())\"\r\n [indeterminate]=\"$masterToggleIndeterminate()\"\r\n [matTooltip]=\"$selectAllMessage()\"\r\n (change)=\"$event ? masterToggle() : null\" />\r\n </mat-header-cell>\r\n\r\n <mat-cell *matCellDef=\"let row\" class=\"select-column\">\r\n <mat-checkbox\r\n [checked]=\"selection.isSelected(row)\"\r\n (click)=\"$event.stopPropagation()\"\r\n (change)=\"$event ? selection.toggle(row) : null\"/>\r\n </mat-cell>\r\n\r\n <mat-footer-cell *matFooterCellDef class=\"select-column\">\r\n {{ selection.selected.length }}\r\n </mat-footer-cell>\r\n </ng-container>\r\n\r\n\r\n <!-- index column -->\r\n <ng-container matColumnDef=\"index\">\r\n <mat-header-cell *matHeaderCellDef class=\"f-mat-header-cell\" class=\"index-column\">#\r\n </mat-header-cell>\r\n <mat-cell *matCellDef=\"let i = index; let t\" class=\"index-column\">\r\n {{ 1 + i + $offsetIndex() }}\r\n </mat-cell>\r\n <mat-footer-cell *matFooterCellDef class=\"index-column\" />\r\n </ng-container>\r\n\r\n <!-- Grouping -->\r\n <ng-container matColumnDef=\"groupHeader\">\r\n <mat-cell *matCellDef=\"let row\">\r\n @let expanded = (state.$getIsExpanded | func : row.key : row.uniqueName );\r\n <div [style.paddingLeft]=\"row.padding + 'px !important'\">\r\n @if($hasSelectColumn())\r\n {\r\n @let contains = (allOfGroupSelected | func : row.uniqueName)();\r\n <mat-checkbox [checked]=\"!!contains.containsAll\"\r\n [indeterminate]=\"!!contains.containsSome && !contains.containsAll\"\r\n [matTooltip]=\"toggleGroupMessage | func : contains.length : contains.containsAll\"\r\n (change)=\"$event ? toggleGroup(row.uniqueName, contains.containsAll) : null\" />\r\n }\r\n <button mat-icon-button (click)=\"setExpanded(row.key, row.uniqueName, !expanded());\">\r\n @if (!expanded())\r\n {\r\n <mat-icon>chevron_right</mat-icon>\r\n }\r\n @else\r\n {\r\n <mat-icon>expand_more</mat-icon>\r\n }\r\n </button>\r\n {{ row.custom ? row.groupHeaderDisplay : ((getTransform | func : row.key : row.groupHeaderDisplay)() + ` (${row.length})`) }}\r\n </div>\r\n <div style=\"flex-grow: 1\">\r\n <ng-container *ngTemplateOutlet=\"state.$props().groupHeaderTemplate!; context: { element: row }\" />\r\n </div>\r\n </mat-cell>\r\n </ng-container>\r\n\r\n <mat-row\r\n *matRowDef=\"let row; columns: $keys(); let i = index\"\r\n [style.height]=\"$rowHeight()\"\r\n [style.min-height]=\"$rowHeight()\"\r\n [styler]=\"$rowStyles()\"\r\n [element]=\"row\"\r\n [conditionalClasses]=\"$rowClasses()\"\r\n (click)=\"rowClicked(row, $event)\"\r\n />\r\n\r\n <!-- group row -->\r\n <mat-row *matRowDef=\"let row; columns: ['groupHeader']; when: isGroupHeader\"\r\n style=\"background-color: unset;\"\r\n [style.height]=\"state.$props().groupHeaderHeight ? state.$props().groupHeaderHeight + 'px' : $groupHeaderHeight()\" [style.min-height]=\"state.$props().groupHeaderHeight ? state.$props().groupHeaderHeight + 'px' : $groupHeaderHeight()\"/>\r\n</mat-table>\r\n\r\n<mat-header-row *matHeaderRowDef=\"$keys(); sticky: state.$props().isSticky\" [style.height]=\"$headerHeight()\"\r\n [style.min-height]=\"$headerHeight()\" [style.top.px]=\"($offset()! * -1)\"/>\r\n<mat-footer-row *matFooterRowDef=\"$keys(); sticky: $stickyFooter() \" [style.height]=\"$footerHeight()\"\r\n [style.min-height]=\"$footerHeight()\"\r\n [style.bottom.px]=\"$stickyFooter() ? ($offset()) : undefined\"/>\r\n", styles: [":host{--mat-paginator-container-size: var(tb-paginator-container-size, initial)}.select-column{min-width:var(--tb-min-select-column-width, 42px)}.index-column{min-width:var(--tb-min-index-column-width, 42px)}.mat-mdc-row:nth-child(odd){background-color:var(--tb-odd-row-background-color, #cdeefe)}.page-amounts{color:#0000008a;font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;margin-right:.2rem}:host::ng-deep .table-drag-list.cdk-drop-list-dragging .drag-header:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}:host::ng-deep .mdc-data-table__cell,:host::ng-deep .mdc-data-table__header-cell{padding:var(--tb-cell-padding, 0 0 0 .2rem);line-height:var(--tb-cell-line-height, normal)}::ng-deep .op-date-time-input{line-height:3rem;font-size:.9rem;font-family:Roboto,Helvetica Neue,sans-serif;padding-left:.2rem;width:12rem}\n"], dependencies: [{ kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i1$6.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i1$6.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1$6.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i1$6.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i1$6.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1$6.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i1$6.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i1$6.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "directive", type: i1$6.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1$6.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i1$6.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "component", type: i1$6.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i1$6.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i1$6.MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i5.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: FunctionPipe, name: "func" }, { kind: "directive", type: StylerDirective, selector: "[styler]", inputs: ["element", "styler"] }, { kind: "directive", type: ConditionalClassesDirective, selector: "[conditionalClasses]", inputs: ["element", "conditionalClasses"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4529
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: GenericTableComponent, isStandalone: true, selector: "tb-generic-table", inputs: { $displayDataLength: { classPropertyName: "$displayDataLength", publicName: "displayDataLength", isSignal: true, isRequired: true, transformFunction: null }, $data: { classPropertyName: "$data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, $rows: { classPropertyName: "$rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, $columnInfos: { classPropertyName: "$columnInfos", publicName: "columnInfos", isSignal: true, isRequired: true, transformFunction: null }, $dataSource: { classPropertyName: "$dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, $trackBy: { classPropertyName: "$trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection$: "selection" }, viewQueries: [{ propertyName: "$headerRow", first: true, predicate: MatHeaderRowDef, descendants: true, isSignal: true }, { propertyName: "$footerRow", first: true, predicate: MatFooterRowDef, descendants: true, isSignal: true }, { propertyName: "$table", first: true, predicate: MatTable, descendants: true, isSignal: true }, { propertyName: "$dropList", first: true, predicate: CdkDropList, descendants: true, isSignal: true }], ngImport: i0, template: "<mat-table\r\n #table\r\n cdkDropList\r\n cdkDropListLockAxis='x'\r\n cdkDropListOrientation=\"horizontal\"\r\n class=\"table-drag-list\"\r\n [dataSource]=\"$dataSource()\"\r\n [trackBy]=\"$trackByFunction()\"\r\n [style]=\"$tableWidth()\"\r\n (cdkDropListDropped)=\"drop($event)\"\r\n>\r\n\r\n <!-- select column -->\r\n <ng-container matColumnDef=\"select\">\r\n @let selection = $selection();\r\n <mat-header-cell *matHeaderCellDef class=\"select-column\">\r\n <mat-checkbox [checked]=\"!!($masterToggleChecked())\"\r\n [indeterminate]=\"$masterToggleIndeterminate()\"\r\n [matTooltip]=\"$selectAllMessage()\"\r\n (change)=\"$event ? masterToggle() : null\" />\r\n </mat-header-cell>\r\n\r\n <mat-cell *matCellDef=\"let row\" class=\"select-column\">\r\n <mat-checkbox\r\n [checked]=\"selection.isSelected(row)\"\r\n (click)=\"$event.stopPropagation()\"\r\n (change)=\"$event ? selection.toggle(row) : null\"/>\r\n </mat-cell>\r\n\r\n <mat-footer-cell *matFooterCellDef class=\"select-column\">\r\n {{ selection.selected.length }}\r\n </mat-footer-cell>\r\n </ng-container>\r\n\r\n\r\n <!-- index column -->\r\n <ng-container matColumnDef=\"index\">\r\n <mat-header-cell *matHeaderCellDef class=\"f-mat-header-cell\" class=\"index-column\">#\r\n </mat-header-cell>\r\n <mat-cell *matCellDef=\"let i = index; let t\" class=\"index-column\">\r\n {{ 1 + i + $offsetIndex() }}\r\n </mat-cell>\r\n <mat-footer-cell *matFooterCellDef class=\"index-column\" />\r\n </ng-container>\r\n\r\n <!-- Grouping -->\r\n <ng-container matColumnDef=\"groupHeader\">\r\n <mat-cell *matCellDef=\"let row\">\r\n @let expanded = (state.$getIsExpanded | func : row.key : row.uniqueName );\r\n <div [style.paddingLeft]=\"row.padding + 'px !important'\">\r\n @if($hasSelectColumn())\r\n {\r\n @let contains = (allOfGroupSelected | func : row.uniqueName)();\r\n <mat-checkbox [checked]=\"!!contains.containsAll\"\r\n [indeterminate]=\"!!contains.containsSome && !contains.containsAll\"\r\n [matTooltip]=\"toggleGroupMessage | func : contains.length : contains.containsAll\"\r\n (change)=\"$event ? toggleGroup(row.uniqueName, contains.containsAll) : null\" />\r\n }\r\n <button mat-icon-button (click)=\"setExpanded(row.key, row.uniqueName, !expanded());\">\r\n @if (!expanded())\r\n {\r\n <mat-icon>chevron_right</mat-icon>\r\n }\r\n @else\r\n {\r\n <mat-icon>expand_more</mat-icon>\r\n }\r\n </button>\r\n {{ row.custom ? row.groupHeaderDisplay : ((getGroupHeaderTransform | func : row.key : row.groupHeaderDisplay)() + ` (${row.length})`) }}\r\n </div>\r\n <div style=\"flex-grow: 1\">\r\n <ng-container *ngTemplateOutlet=\"state.$props().groupHeaderTemplate!; context: { element: row }\" />\r\n </div>\r\n </mat-cell>\r\n </ng-container>\r\n\r\n <mat-row\r\n *matRowDef=\"let row; columns: $keys(); let i = index\"\r\n [style.height]=\"$rowHeight()\"\r\n [style.min-height]=\"$rowHeight()\"\r\n [styler]=\"$rowStyles()\"\r\n [element]=\"row\"\r\n [conditionalClasses]=\"$rowClasses()\"\r\n (click)=\"rowClicked(row, $event)\"\r\n />\r\n\r\n <!-- group row -->\r\n <mat-row *matRowDef=\"let row; columns: ['groupHeader']; when: isGroupHeader\"\r\n style=\"background-color: unset;\"\r\n [style.height]=\"state.$props().groupHeaderHeight ? state.$props().groupHeaderHeight + 'px' : $groupHeaderHeight()\" [style.min-height]=\"state.$props().groupHeaderHeight ? state.$props().groupHeaderHeight + 'px' : $groupHeaderHeight()\"/>\r\n</mat-table>\r\n\r\n<mat-header-row *matHeaderRowDef=\"$keys(); sticky: state.$props().isSticky\" [style.height]=\"$headerHeight()\"\r\n [style.min-height]=\"$headerHeight()\" [style.top.px]=\"($offset()! * -1)\"/>\r\n<mat-footer-row *matFooterRowDef=\"$keys(); sticky: $stickyFooter() \" [style.height]=\"$footerHeight()\"\r\n [style.min-height]=\"$footerHeight()\"\r\n [style.bottom.px]=\"$stickyFooter() ? ($offset()) : undefined\"/>\r\n", styles: [":host{--mat-paginator-container-size: var(tb-paginator-container-size, initial)}.select-column{min-width:var(--tb-min-select-column-width, 42px)}.index-column{min-width:var(--tb-min-index-column-width, 42px)}.mat-mdc-row:nth-child(odd){background-color:var(--tb-odd-row-background-color, #cdeefe)}.page-amounts{color:#0000008a;font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;margin-right:.2rem}:host::ng-deep .table-drag-list.cdk-drop-list-dragging .drag-header:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}:host::ng-deep .mdc-data-table__cell,:host::ng-deep .mdc-data-table__header-cell{padding:var(--tb-cell-padding, 0 0 0 .2rem);line-height:var(--tb-cell-line-height, normal)}::ng-deep .op-date-time-input{line-height:3rem;font-size:.9rem;font-family:Roboto,Helvetica Neue,sans-serif;padding-left:.2rem;width:12rem}\n"], dependencies: [{ kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i1$6.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i1$6.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1$6.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i1$6.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i1$6.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1$6.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i1$6.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i1$6.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "directive", type: i1$6.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1$6.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i1$6.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "component", type: i1$6.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i1$6.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i1$6.MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i5.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: FunctionPipe, name: "func" }, { kind: "directive", type: StylerDirective, selector: "[styler]", inputs: ["element", "styler"] }, { kind: "directive", type: ConditionalClassesDirective, selector: "[conditionalClasses]", inputs: ["element", "conditionalClasses"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4523
4530
  }
4524
4531
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: GenericTableComponent, decorators: [{
4525
4532
  type: Component,
4526
4533
  args: [{ selector: 'tb-generic-table', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
4527
4534
  MatTableModule, DragDropModule, MatCheckboxModule, MatButtonModule, MatIconModule, NgTemplateOutlet,
4528
4535
  MatTooltipModule, FunctionPipe, StylerDirective, ConditionalClassesDirective
4529
- ], template: "<mat-table\r\n #table\r\n cdkDropList\r\n cdkDropListLockAxis='x'\r\n cdkDropListOrientation=\"horizontal\"\r\n class=\"table-drag-list\"\r\n [dataSource]=\"$dataSource()\"\r\n [trackBy]=\"$trackByFunction()\"\r\n [style]=\"$tableWidth()\"\r\n (cdkDropListDropped)=\"drop($event)\"\r\n>\r\n\r\n <!-- select column -->\r\n <ng-container matColumnDef=\"select\">\r\n @let selection = $selection();\r\n <mat-header-cell *matHeaderCellDef class=\"select-column\">\r\n <mat-checkbox [checked]=\"!!($masterToggleChecked())\"\r\n [indeterminate]=\"$masterToggleIndeterminate()\"\r\n [matTooltip]=\"$selectAllMessage()\"\r\n (change)=\"$event ? masterToggle() : null\" />\r\n </mat-header-cell>\r\n\r\n <mat-cell *matCellDef=\"let row\" class=\"select-column\">\r\n <mat-checkbox\r\n [checked]=\"selection.isSelected(row)\"\r\n (click)=\"$event.stopPropagation()\"\r\n (change)=\"$event ? selection.toggle(row) : null\"/>\r\n </mat-cell>\r\n\r\n <mat-footer-cell *matFooterCellDef class=\"select-column\">\r\n {{ selection.selected.length }}\r\n </mat-footer-cell>\r\n </ng-container>\r\n\r\n\r\n <!-- index column -->\r\n <ng-container matColumnDef=\"index\">\r\n <mat-header-cell *matHeaderCellDef class=\"f-mat-header-cell\" class=\"index-column\">#\r\n </mat-header-cell>\r\n <mat-cell *matCellDef=\"let i = index; let t\" class=\"index-column\">\r\n {{ 1 + i + $offsetIndex() }}\r\n </mat-cell>\r\n <mat-footer-cell *matFooterCellDef class=\"index-column\" />\r\n </ng-container>\r\n\r\n <!-- Grouping -->\r\n <ng-container matColumnDef=\"groupHeader\">\r\n <mat-cell *matCellDef=\"let row\">\r\n @let expanded = (state.$getIsExpanded | func : row.key : row.uniqueName );\r\n <div [style.paddingLeft]=\"row.padding + 'px !important'\">\r\n @if($hasSelectColumn())\r\n {\r\n @let contains = (allOfGroupSelected | func : row.uniqueName)();\r\n <mat-checkbox [checked]=\"!!contains.containsAll\"\r\n [indeterminate]=\"!!contains.containsSome && !contains.containsAll\"\r\n [matTooltip]=\"toggleGroupMessage | func : contains.length : contains.containsAll\"\r\n (change)=\"$event ? toggleGroup(row.uniqueName, contains.containsAll) : null\" />\r\n }\r\n <button mat-icon-button (click)=\"setExpanded(row.key, row.uniqueName, !expanded());\">\r\n @if (!expanded())\r\n {\r\n <mat-icon>chevron_right</mat-icon>\r\n }\r\n @else\r\n {\r\n <mat-icon>expand_more</mat-icon>\r\n }\r\n </button>\r\n {{ row.custom ? row.groupHeaderDisplay : ((getTransform | func : row.key : row.groupHeaderDisplay)() + ` (${row.length})`) }}\r\n </div>\r\n <div style=\"flex-grow: 1\">\r\n <ng-container *ngTemplateOutlet=\"state.$props().groupHeaderTemplate!; context: { element: row }\" />\r\n </div>\r\n </mat-cell>\r\n </ng-container>\r\n\r\n <mat-row\r\n *matRowDef=\"let row; columns: $keys(); let i = index\"\r\n [style.height]=\"$rowHeight()\"\r\n [style.min-height]=\"$rowHeight()\"\r\n [styler]=\"$rowStyles()\"\r\n [element]=\"row\"\r\n [conditionalClasses]=\"$rowClasses()\"\r\n (click)=\"rowClicked(row, $event)\"\r\n />\r\n\r\n <!-- group row -->\r\n <mat-row *matRowDef=\"let row; columns: ['groupHeader']; when: isGroupHeader\"\r\n style=\"background-color: unset;\"\r\n [style.height]=\"state.$props().groupHeaderHeight ? state.$props().groupHeaderHeight + 'px' : $groupHeaderHeight()\" [style.min-height]=\"state.$props().groupHeaderHeight ? state.$props().groupHeaderHeight + 'px' : $groupHeaderHeight()\"/>\r\n</mat-table>\r\n\r\n<mat-header-row *matHeaderRowDef=\"$keys(); sticky: state.$props().isSticky\" [style.height]=\"$headerHeight()\"\r\n [style.min-height]=\"$headerHeight()\" [style.top.px]=\"($offset()! * -1)\"/>\r\n<mat-footer-row *matFooterRowDef=\"$keys(); sticky: $stickyFooter() \" [style.height]=\"$footerHeight()\"\r\n [style.min-height]=\"$footerHeight()\"\r\n [style.bottom.px]=\"$stickyFooter() ? ($offset()) : undefined\"/>\r\n", styles: [":host{--mat-paginator-container-size: var(tb-paginator-container-size, initial)}.select-column{min-width:var(--tb-min-select-column-width, 42px)}.index-column{min-width:var(--tb-min-index-column-width, 42px)}.mat-mdc-row:nth-child(odd){background-color:var(--tb-odd-row-background-color, #cdeefe)}.page-amounts{color:#0000008a;font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;margin-right:.2rem}:host::ng-deep .table-drag-list.cdk-drop-list-dragging .drag-header:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}:host::ng-deep .mdc-data-table__cell,:host::ng-deep .mdc-data-table__header-cell{padding:var(--tb-cell-padding, 0 0 0 .2rem);line-height:var(--tb-cell-line-height, normal)}::ng-deep .op-date-time-input{line-height:3rem;font-size:.9rem;font-family:Roboto,Helvetica Neue,sans-serif;padding-left:.2rem;width:12rem}\n"] }]
4536
+ ], template: "<mat-table\r\n #table\r\n cdkDropList\r\n cdkDropListLockAxis='x'\r\n cdkDropListOrientation=\"horizontal\"\r\n class=\"table-drag-list\"\r\n [dataSource]=\"$dataSource()\"\r\n [trackBy]=\"$trackByFunction()\"\r\n [style]=\"$tableWidth()\"\r\n (cdkDropListDropped)=\"drop($event)\"\r\n>\r\n\r\n <!-- select column -->\r\n <ng-container matColumnDef=\"select\">\r\n @let selection = $selection();\r\n <mat-header-cell *matHeaderCellDef class=\"select-column\">\r\n <mat-checkbox [checked]=\"!!($masterToggleChecked())\"\r\n [indeterminate]=\"$masterToggleIndeterminate()\"\r\n [matTooltip]=\"$selectAllMessage()\"\r\n (change)=\"$event ? masterToggle() : null\" />\r\n </mat-header-cell>\r\n\r\n <mat-cell *matCellDef=\"let row\" class=\"select-column\">\r\n <mat-checkbox\r\n [checked]=\"selection.isSelected(row)\"\r\n (click)=\"$event.stopPropagation()\"\r\n (change)=\"$event ? selection.toggle(row) : null\"/>\r\n </mat-cell>\r\n\r\n <mat-footer-cell *matFooterCellDef class=\"select-column\">\r\n {{ selection.selected.length }}\r\n </mat-footer-cell>\r\n </ng-container>\r\n\r\n\r\n <!-- index column -->\r\n <ng-container matColumnDef=\"index\">\r\n <mat-header-cell *matHeaderCellDef class=\"f-mat-header-cell\" class=\"index-column\">#\r\n </mat-header-cell>\r\n <mat-cell *matCellDef=\"let i = index; let t\" class=\"index-column\">\r\n {{ 1 + i + $offsetIndex() }}\r\n </mat-cell>\r\n <mat-footer-cell *matFooterCellDef class=\"index-column\" />\r\n </ng-container>\r\n\r\n <!-- Grouping -->\r\n <ng-container matColumnDef=\"groupHeader\">\r\n <mat-cell *matCellDef=\"let row\">\r\n @let expanded = (state.$getIsExpanded | func : row.key : row.uniqueName );\r\n <div [style.paddingLeft]=\"row.padding + 'px !important'\">\r\n @if($hasSelectColumn())\r\n {\r\n @let contains = (allOfGroupSelected | func : row.uniqueName)();\r\n <mat-checkbox [checked]=\"!!contains.containsAll\"\r\n [indeterminate]=\"!!contains.containsSome && !contains.containsAll\"\r\n [matTooltip]=\"toggleGroupMessage | func : contains.length : contains.containsAll\"\r\n (change)=\"$event ? toggleGroup(row.uniqueName, contains.containsAll) : null\" />\r\n }\r\n <button mat-icon-button (click)=\"setExpanded(row.key, row.uniqueName, !expanded());\">\r\n @if (!expanded())\r\n {\r\n <mat-icon>chevron_right</mat-icon>\r\n }\r\n @else\r\n {\r\n <mat-icon>expand_more</mat-icon>\r\n }\r\n </button>\r\n {{ row.custom ? row.groupHeaderDisplay : ((getGroupHeaderTransform | func : row.key : row.groupHeaderDisplay)() + ` (${row.length})`) }}\r\n </div>\r\n <div style=\"flex-grow: 1\">\r\n <ng-container *ngTemplateOutlet=\"state.$props().groupHeaderTemplate!; context: { element: row }\" />\r\n </div>\r\n </mat-cell>\r\n </ng-container>\r\n\r\n <mat-row\r\n *matRowDef=\"let row; columns: $keys(); let i = index\"\r\n [style.height]=\"$rowHeight()\"\r\n [style.min-height]=\"$rowHeight()\"\r\n [styler]=\"$rowStyles()\"\r\n [element]=\"row\"\r\n [conditionalClasses]=\"$rowClasses()\"\r\n (click)=\"rowClicked(row, $event)\"\r\n />\r\n\r\n <!-- group row -->\r\n <mat-row *matRowDef=\"let row; columns: ['groupHeader']; when: isGroupHeader\"\r\n style=\"background-color: unset;\"\r\n [style.height]=\"state.$props().groupHeaderHeight ? state.$props().groupHeaderHeight + 'px' : $groupHeaderHeight()\" [style.min-height]=\"state.$props().groupHeaderHeight ? state.$props().groupHeaderHeight + 'px' : $groupHeaderHeight()\"/>\r\n</mat-table>\r\n\r\n<mat-header-row *matHeaderRowDef=\"$keys(); sticky: state.$props().isSticky\" [style.height]=\"$headerHeight()\"\r\n [style.min-height]=\"$headerHeight()\" [style.top.px]=\"($offset()! * -1)\"/>\r\n<mat-footer-row *matFooterRowDef=\"$keys(); sticky: $stickyFooter() \" [style.height]=\"$footerHeight()\"\r\n [style.min-height]=\"$footerHeight()\"\r\n [style.bottom.px]=\"$stickyFooter() ? ($offset()) : undefined\"/>\r\n", styles: [":host{--mat-paginator-container-size: var(tb-paginator-container-size, initial)}.select-column{min-width:var(--tb-min-select-column-width, 42px)}.index-column{min-width:var(--tb-min-index-column-width, 42px)}.mat-mdc-row:nth-child(odd){background-color:var(--tb-odd-row-background-color, #cdeefe)}.page-amounts{color:#0000008a;font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;margin-right:.2rem}:host::ng-deep .table-drag-list.cdk-drop-list-dragging .drag-header:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}:host::ng-deep .mdc-data-table__cell,:host::ng-deep .mdc-data-table__header-cell{padding:var(--tb-cell-padding, 0 0 0 .2rem);line-height:var(--tb-cell-line-height, normal)}::ng-deep .op-date-time-input{line-height:3rem;font-size:.9rem;font-family:Roboto,Helvetica Neue,sans-serif;padding-left:.2rem;width:12rem}\n"] }]
4530
4537
  }] });
4531
4538
 
4532
4539
  function downloadData(data, filename, mimeType) {
@@ -4565,12 +4572,12 @@ class ExportToCsvService {
4565
4572
  if (!md.additional?.link)
4566
4573
  return;
4567
4574
  const exportForCol = merge$1({}, this.$exportSettings(), md.additional?.export);
4568
- return exportForCol.mapLink === 'add link' || exportForCol.mapLink === 'add excell';
4575
+ return exportForCol.mapLink === 'add link' || exportForCol.mapLink === 'add excel';
4569
4576
  }).map(md => {
4570
4577
  const exportForCol = merge$1({}, this.$exportSettings(), md.additional?.export);
4571
4578
  const newCol = cloneDeep(md);
4572
4579
  newCol.additional.export ??= {};
4573
- newCol.additional.export.mapLink = exportForCol.mapLink === 'add link' ? 'as link' : 'as excell',
4580
+ newCol.additional.export.mapLink = exportForCol.mapLink === 'add link' ? 'as link' : 'as excel',
4574
4581
  newCol.displayName = newCol.additional.export.linkColumnName || ((newCol.displayName || newCol.key) + ' - (Link)');
4575
4582
  return newCol;
4576
4583
  });
@@ -4592,7 +4599,7 @@ class ExportToCsvService {
4592
4599
  const transform = meta.transform;
4593
4600
  return isPipe(transform) ? transform.transform(val) : transform(val);
4594
4601
  }
4595
- if (meta.additional?.link && exportForCol.mapLink === 'as link' || exportForCol.mapLink === 'as excell') {
4602
+ if (meta.additional?.link && exportForCol.mapLink === 'as link' || exportForCol.mapLink === 'as excel') {
4596
4603
  let mapper = this.state.$getLinkInfo(meta)()?.link;
4597
4604
  if (mapper) {
4598
4605
  let mapped = mapper(row);
@@ -4600,7 +4607,7 @@ class ExportToCsvService {
4600
4607
  const bet = mapped.startsWith('/') ? '' : '/';
4601
4608
  mapped = `${exportForCol.linkDomainPrefix}${bet}${mapped}`;
4602
4609
  }
4603
- if (exportForCol.mapLink === 'as excell') {
4610
+ if (exportForCol.mapLink === 'as excel') {
4604
4611
  mapped = this.cleanValForCsv(`=HYPERLINK("${mapped}", "${mapped}")`);
4605
4612
  }
4606
4613
  return mapped;
@@ -5854,6 +5861,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
5854
5861
  }]
5855
5862
  }], ctorParameters: () => [] });
5856
5863
 
5864
+ function buildInAllValuesFilter(config, previousMeta, currentMeta, data, metaTimestamp, dataTimestamp, currentAllFilters) {
5865
+ const currentAll = currentMeta.filter(m => m.additional?.filterOptions?.filterableValues === 'all values');
5866
+ if (dataTimestamp > metaTimestamp) {
5867
+ return currentAll.reduce((dict, md) => {
5868
+ dict[md.key] = buildFilter(data, md, config);
5869
+ return dict;
5870
+ }, {});
5871
+ }
5872
+ const previousAll = previousMeta.filter(m => m.additional?.filterOptions?.filterableValues === 'all values');
5873
+ const newCurrent = currentAll.filter(c => previousAll.every(p => c.key !== p.key));
5874
+ if (newCurrent.length) {
5875
+ const c = { ...currentAllFilters };
5876
+ newCurrent.forEach(md => c[md.key] = buildFilter(data, md, config));
5877
+ return c;
5878
+ }
5879
+ return currentAllFilters;
5880
+ }
5881
+ function buildFilter(data, metaData, config) {
5882
+ const map = createTransformer(metaData, config, true, true);
5883
+ return [...new Map(data.map(v => {
5884
+ const mappedV = map(v);
5885
+ return [mappedV?.toString(), mappedV];
5886
+ })).values()].filter(v => v != undefined).sort();
5887
+ }
5888
+
5857
5889
  class TableContainerComponent {
5858
5890
  constructor() {
5859
5891
  this.state = inject(TableStore);
@@ -5863,6 +5895,7 @@ class TableContainerComponent {
5863
5895
  this.injector = inject(Injector);
5864
5896
  this.elementRef = inject(ElementRef);
5865
5897
  this.exportToCsvService = inject(ExportToCsvService);
5898
+ this.config = inject(TableBuilderConfigToken);
5866
5899
  this.dataSource = new TableBuilderDataSource(this.state, this.dataStore);
5867
5900
  this.$filterDirectives = contentChildren(TableFilterDirective, { descendants: true });
5868
5901
  this.$customFilterDirectives = contentChildren(TableCustomFilterDirective, { descendants: true });
@@ -6062,6 +6095,23 @@ class TableContainerComponent {
6062
6095
  const mappedCustomCellMetaDatas = customCellMetaDatas.map(md => mergeCustomCellMetaData(md, tableBuilderMetaData.find(item => item.key === md.key)));
6063
6096
  return [...tableBuilderMetaData, ...mappedCustomCellMetaDatas];
6064
6097
  });
6098
+ this.$allMetaDataTimeStamped = linkedSignal({
6099
+ source: this.$allMetaDatas,
6100
+ computation: (curr, previous) => {
6101
+ return { timestamp: Date.now(), value: curr || [], previous: previous?.value.value || [] };
6102
+ }
6103
+ });
6104
+ this.#setUpAllValuesFilters = effect(() => {
6105
+ const data = this.$allDataTimeStamped();
6106
+ const allMeta = this.$allMetaDataTimeStamped();
6107
+ if (!data)
6108
+ return;
6109
+ untracked(() => {
6110
+ const currentAll = computed(() => this.state.selectSignal(s => s.allFilters)())();
6111
+ const mapped = buildInAllValuesFilter(this.config, allMeta.previous, allMeta.value, data.value, allMeta.timestamp, data.timestamp, currentAll);
6112
+ this.state.patchState({ allFilters: mapped });
6113
+ });
6114
+ });
6065
6115
  this.$preds = computed(() => {
6066
6116
  const predicateInputFilters = this.$inputFilters().filter(isFunction);
6067
6117
  const notSavableFilterDirectives = this.$allFilterDirectives()
@@ -6075,22 +6125,22 @@ class TableContainerComponent {
6075
6125
  source: this.$preds,
6076
6126
  computation: (curr, previous) => {
6077
6127
  if (!previous?.value)
6078
- return ({ value: updateFilterPredicateState({ allFilters: [] }, curr), timestamp: new Date().getTime() });
6079
- return ({ value: updateFilterPredicateState(previous.value.value, curr), timestamp: new Date().getTime() });
6128
+ return ({ value: updateFilterPredicateState({ allFilters: [] }, curr), timestamp: Date.now() });
6129
+ return ({ value: updateFilterPredicateState(previous.value.value, curr), timestamp: Date.now() });
6080
6130
  }
6081
6131
  });
6082
6132
  this.$savableFiltersState = linkedSignal({
6083
6133
  source: this.state.$filters,
6084
6134
  computation: (curr, previous) => {
6085
6135
  if (!previous?.value)
6086
- return ({ value: updateFilterInfoState({ allFilters: {} }, curr), timestamp: new Date().getTime() });
6087
- return ({ value: updateFilterInfoState(previous.value.value, curr), timestamp: new Date().getTime() });
6136
+ return ({ value: updateFilterInfoState({ allFilters: {} }, curr), timestamp: Date.now() });
6137
+ return ({ value: updateFilterInfoState(previous.value.value, curr), timestamp: Date.now() });
6088
6138
  }
6089
6139
  });
6090
6140
  this.$allFilterStatesTimeStamped = computed(() => {
6091
6141
  if (!this.$isInitializationState(InitializationState.Ready)())
6092
6142
  return undefined;
6093
- return ({ value: updateFilterState(this.$savableFiltersState(), this.$predicateFiltersState()), timestamp: new Date().getTime() });
6143
+ return ({ value: updateFilterState(this.$savableFiltersState(), this.$predicateFiltersState()), timestamp: Date.now() });
6094
6144
  });
6095
6145
  this.$sortStateTimeStamped = linkedSignal({
6096
6146
  source: computed(() => this.$isInitializationState(InitializationState.Ready)() && this.state.$getSorts()),
@@ -6098,8 +6148,8 @@ class TableContainerComponent {
6098
6148
  if (!curr)
6099
6149
  return undefined;
6100
6150
  if (!prev?.value)
6101
- return ({ value: updateSortState(initialSortState, curr), timestamp: new Date().getTime() });
6102
- return ({ value: updateSortState(prev.value.value, curr), timestamp: new Date().getTime() });
6151
+ return ({ value: updateSortState(initialSortState, curr), timestamp: Date.now() });
6152
+ return ({ value: updateSortState(prev.value.value, curr), timestamp: Date.now() });
6103
6153
  }
6104
6154
  });
6105
6155
  this.$allData = computed(() => (this.$tableBuilder()?.$initialized() && this.$tableBuilder()?.$data()) || []);
@@ -6109,7 +6159,7 @@ class TableContainerComponent {
6109
6159
  return undefined;
6110
6160
  return ({
6111
6161
  value: data,
6112
- timestamp: new Date().getTime()
6162
+ timestamp: Date.now()
6113
6163
  });
6114
6164
  });
6115
6165
  this.$allTimeStamped = computed(() => {
@@ -6133,11 +6183,11 @@ class TableContainerComponent {
6133
6183
  const { data, filter, sort } = values;
6134
6184
  const val = prev?.value?.value || data.value;
6135
6185
  const filteredData = sortAndFilterData(data, filter, sort, !prev?.value, val);
6136
- return ({ value: filteredData, timestamp: new Date().getTime() });
6186
+ return ({ value: filteredData, timestamp: Date.now() });
6137
6187
  }
6138
6188
  });
6139
- this.$timestampedGroups = computed(() => ({ value: this.state.$groupByKeys(), timestamp: new Date().getTime() }));
6140
- this.$timestampedExpanded = computed(() => ({ value: this.state.$expandGroups(), timestamp: new Date().getTime() }));
6189
+ this.$timestampedGroups = computed(() => ({ value: this.state.$groupByKeys(), timestamp: Date.now() }));
6190
+ this.$timestampedExpanded = computed(() => ({ value: this.state.$expandGroups(), timestamp: Date.now() }));
6141
6191
  this.$dataAndGroupsTimestamped = computed(() => {
6142
6192
  const data = this.$sortedAndFilteredData();
6143
6193
  const groups = this.$timestampedGroups();
@@ -6182,6 +6232,7 @@ class TableContainerComponent {
6182
6232
  #setFilteredDataLengthEffect;
6183
6233
  #setDataSourceDataEffect;
6184
6234
  #destroyRef;
6235
+ #setUpAllValuesFilters;
6185
6236
  static { this.headerId = 'tb-header-wrapper'; }
6186
6237
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TableContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
6187
6238
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TableContainerComponent, isStandalone: true, selector: "tb-table-container", inputs: { $tableBuilder: { classPropertyName: "$tableBuilder", publicName: "tableBuilder", isSignal: true, isRequired: true, transformFunction: null }, $tableIdInput: { classPropertyName: "$tableIdInput", publicName: "tableId", isSignal: true, isRequired: false, transformFunction: null }, $trackByInput: { classPropertyName: "$trackByInput", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null }, $inputFilters: { classPropertyName: "$inputFilters", publicName: "inputFilters", isSignal: true, isRequired: false, transformFunction: null }, $indexColumnInput: { classPropertyName: "$indexColumnInput", publicName: "indexColumn", isSignal: true, isRequired: false, transformFunction: null }, $selectionColumnInput: { classPropertyName: "$selectionColumnInput", publicName: "selectionColumn", isSignal: true, isRequired: false, transformFunction: null }, $stickyHeaderInput: { classPropertyName: "$stickyHeaderInput", publicName: "stickyHeader", isSignal: true, isRequired: false, transformFunction: null }, $stickyFooterInput: { classPropertyName: "$stickyFooterInput", publicName: "stickyFooter", isSignal: true, isRequired: false, transformFunction: null }, $groupHeaderTemplate: { classPropertyName: "$groupHeaderTemplate", publicName: "groupHeaderTemplate", isSignal: true, isRequired: false, transformFunction: null }, $groupHeaderHeight: { classPropertyName: "$groupHeaderHeight", publicName: "groupHeaderHeight", isSignal: true, isRequired: false, transformFunction: null }, $pageSize: { classPropertyName: "$pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection$: "selection", onStateReset$: "onStateReset", onSaveState$: "onSaveState", state$: "state", data$: "data" }, providers: [TableStore, ExportToCsvService, WrapperFilterStore, DataStore], queries: [{ propertyName: "$filterDirectives", predicate: TableFilterDirective, descendants: true, isSignal: true }, { propertyName: "$customFilterDirectives", predicate: TableCustomFilterDirective, descendants: true, isSignal: true }, { propertyName: "_$customRows", predicate: (MatRowDef), isSignal: true }, { propertyName: "$customCells", predicate: CustomCellDirective, isSignal: true }], viewQueries: [{ propertyName: "$paginatorComponent", first: true, predicate: PaginatorComponent, descendants: true, isSignal: true }, { propertyName: "$genericTable", first: true, predicate: GenericTableComponent, descendants: true, isSignal: true }, { propertyName: "$menu", first: true, predicate: MatMenu, descendants: true, isSignal: true }], ngImport: i0, template: "@let tableId = $tableId();\r\n@let tableSettings = state.$tableSettings();\r\n\r\n<ng-content select=\"[before]\" />\r\n<ng-container multiSort>\r\n <div class=\"tb-header-wrapper\" [id]=\"headerId\">\r\n <div class=\"title\">\r\n @if ((!$collapsedHeader()) || tableSettings.showTitleWhenHeaderCollapsed)\r\n {\r\n <ng-content select=\".tb-header-title\"/>\r\n }\r\n </div>\r\n @if(state.$groupByKeys().length)\r\n {\r\n <group-by-list />\r\n }\r\n <div class=\"flx-row-end\">\r\n <lib-filter-list />\r\n @if (!tableSettings.hideHeader)\r\n {\r\n @if (!$collapsedHeader())\r\n {\r\n <ng-container *ngTemplateOutlet=\"headerMenu\"/>\r\n <button mat-icon-button color='primary' [matMenuTriggerFor]=\"l.menu()\">\r\n <mat-icon>more_vert</mat-icon>\r\n </button>\r\n\r\n <lib-table-header-menu #l/>\r\n\r\n }\r\n @else\r\n {\r\n <mat-icon color=\"primary\" class=\"flat-menu-button pointer\" [matMenuTriggerFor]=\"mainMenu\">more_horiz</mat-icon>\r\n <mat-menu #mainMenu='matMenu'>\r\n <div class=\"flex-column\">\r\n <ng-container *ngTemplateOutlet=\"headerMenu; injector menuInjector\"/>\r\n </div>\r\n <lib-table-header-menu />\r\n </mat-menu>\r\n }\r\n <mat-icon class=\"collapse-icon header\" [matTooltip]=\"$collapsedHeader() ? 'expand' : 'collapse'\"\r\n (click)=\"state.toggleCollapseHeader()\">\r\n {{$collapsedHeader() ? 'expand_less' : 'expand_more'}}\r\n </mat-icon>\r\n }\r\n\r\n </div>\r\n </div>\r\n\r\n @if($useVirtual())\r\n {\r\n <tb-virtual-scroll-container class=\"scrollable\">\r\n <tb-generic-table [rows]=\"$customRows()\" [data]=\"$data()!\" [displayDataLength]=\"$displayDataLength()\"\r\n [columnInfos]='$myColumns()' [trackBy]=\"$trackBy()\" [dataSource]=\"dataSource\" (selection)='selection$.emit($event)' />\r\n </tb-virtual-scroll-container>\r\n }\r\n @else\r\n {\r\n <tb-generic-table [rows]=\"$customRows()\" [data]=\"$data()!\" [displayDataLength]=\"$displayDataLength()\"\r\n [columnInfos]='$myColumns()' [trackBy]=\"$trackBy()\" [dataSource]=\"dataSource\" (selection)='selection$.emit($event)' />\r\n }\r\n @if(tableSettings.usePaginator)\r\n {\r\n <div class=\"paginator\">\r\n <tb-paginator #tbPaginator />\r\n\r\n <mat-icon class=\"collapse-icon footer\" [matTooltip]=\"$collapsedFooter() ? 'expand' : 'collapse'\"\r\n (click)=\"state.toggleCollapseFooter()\">\r\n {{$collapsedFooter() ? 'expand_more' : 'expand_less'}}\r\n </mat-icon>\r\n </div>\r\n }\r\n\r\n <ng-template #headerMenu>\r\n @if (!tableSettings.hideFilter) {<tb-filter-displayer/>}\r\n @if (!tableSettings.hideColumnSettings) {<tb-col-displayer/>}\r\n @if (!tableSettings.hideSort) {<tb-sort-menu/>}\r\n @if (!!tableId) {<tb-profiles-menu [tableId]=\"tableId\"/>}\r\n </ng-template>\r\n\r\n</ng-container>\r\n", styles: [".tb-header-wrapper{display:flex;flex-direction:row;width:100%}.flx-row-end{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;margin-left:auto}.flat-menu{line-height:initial;height:initial}.pointer{cursor:pointer}.add-key{width:90%}.paginator{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;background-color:#fff;bottom:0;position:sticky;border-top:.5px solid rgba(0,0,0,.12)}.profiles-menu{visibility:hidden;width:0px;height:0px;display:block;overflow:hidden;position:absolute;top:50px}\n", ".collapse-icon{font-size:16px;height:16px;color:#3f51b5;align-self:flex-start}.collapse-icon:hover{cursor:pointer}.hide{display:none}.paginator-row{display:flex;align-items:center}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PaginatorComponent, selector: "tb-paginator" }, { kind: "directive", type: MultiSortDirective, selector: "[multiSort]", inputs: ["matSortDisabled"], exportAs: ["multiSort"] }, { kind: "component", type: GroupByListComponent, selector: "group-by-list" }, { kind: "component", type: FilterChipsComponent, selector: "lib-filter-list" }, { kind: "component", type: GenFilterDisplayerComponent, selector: "tb-filter-displayer" }, { kind: "component", type: GenColDisplayerComponent, selector: "tb-col-displayer" }, { kind: "component", type: SortMenuComponent, selector: "tb-sort-menu" }, { kind: "component", type: GenericTableComponent, selector: "tb-generic-table", inputs: ["displayDataLength", "data", "rows", "columnInfos", "dataSource", "trackBy"], outputs: ["selection"] }, { kind: "component", type: ProfilesMenuComponent, selector: "tb-profiles-menu", inputs: ["tableId", "isMatMenuChild"] }, { kind: "component", type: TableHeaderMenuComponent, selector: "lib-table-header-menu" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$4.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: i1$4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: VirtualScrollContainer, selector: "tb-virtual-scroll-container" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }