@stemy/ngx-utils 13.6.5 → 13.6.7

package/fesm2020/stemy-ngx-utils.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, TemplateRef, PLATFORM_ID, Injectable, Inject, Optional, Injector, EventEmitter, isDevMode, ErrorHandler, NgZone, Pipe, Directive, Input, Output, HostBinding, HostListener, Component, ContentChildren, ViewChild, ContentChild, APP_INITIALIZER, NgModule } from '@angular/core';
+import { InjectionToken, PLATFORM_ID, Injectable, Inject, Optional, Injector, EventEmitter, isDevMode, ErrorHandler, NgZone, Pipe, Directive, Input, Output, HostBinding, HostListener, Component, ContentChildren, ViewChild, ContentChild, APP_INITIALIZER, NgModule } from '@angular/core';
 import 'reflect-metadata';
 import moment from 'moment';
 import { first, skipWhile, mergeMap, timeout, map } from 'rxjs/operators';
@@ -391,9 +391,6 @@ var StorageMode;
 const TOASTER_SERVICE = new InjectionToken("toaster-service");
 const PROMISE_SERVICE = new InjectionToken("promise-service");
 const WASI_IMPLEMENTATION = new InjectionToken("wasi-implementation");
-// --- Unordered list ---
-class UnorederedListTemplate extends TemplateRef {
-}
 // --- Reflect utils ---
 function FactoryDependencies(...dependencies) {
     return function (target, method) {
@@ -1709,7 +1706,7 @@ class AuthGuard {
         for (const subConfig of config) {
             if (subConfig.path)
                 path.push(subConfig.path);
-            const loadedChildren = (subConfig["_loadedConfig"] || { routes: null }).routes;
+            const loadedChildren = (subConfig["_loadedConfig"] || { routes: null }).routes || subConfig["_loadedRoutes"];
             const match = this.getConfig(route, subConfig.children || loadedChildren, path);
             if (!match) {
                 if (subConfig.path)
@@ -4941,7 +4938,9 @@ class UnorderedListItemDirective {
             this.valueIsObject = ObjectUtils.isObject(this.item.value);
             this.valueType = ObjectUtils.getType(this.item.value);
             const context = this;
-            const template = this.templates.find(t => t.type == this.type && ObjectUtils.evaluate(t.selector, context)) || this.defaultTemplates[this.type];
+            const template = this
+                .templates
+                .find(t => t.type == this.type && ObjectUtils.evaluate(t.selector, context))?.templateRef || this.defaultTemplates[this.type];
             // Set view
             this.viewContainer.clear();
             this.viewContainer.createEmbeddedView(template, context);
@@ -4993,24 +4992,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
                 type: Input
             }] } });
 
-class UnorderedListTemplateDirective extends UnorederedListTemplate {
-    constructor(elementRef, templateRef) {
-        super();
-        this.elementRef = elementRef;
+class UnorderedListTemplateDirective {
+    constructor(templateRef) {
         this.templateRef = templateRef;
     }
-    createEmbeddedView(context) {
-        return this.templateRef.createEmbeddedView(context);
-    }
 }
-UnorderedListTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: UnorderedListTemplateDirective, deps: [{ token: i0.ElementRef }, { token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
-UnorderedListTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.4.0", type: UnorderedListTemplateDirective, selector: "ng-template[type][selector]", inputs: { type: "type", selector: "selector" }, usesInheritance: true, ngImport: i0 });
+UnorderedListTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: UnorderedListTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
+UnorderedListTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.4.0", type: UnorderedListTemplateDirective, selector: "ng-template[type][selector]", inputs: { type: "type", selector: "selector" }, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: UnorderedListTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "ng-template[type][selector]"
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.TemplateRef }]; }, propDecorators: { type: [{
+        }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; }, propDecorators: { type: [{
                 type: Input
             }], selector: [{
                 type: Input
@@ -5168,13 +5162,15 @@ class DynamicTableComponent {
     constructor() {
         this.loadData = (page, itemsPerPage) => {
             const orderBy = this.realColumns[this.orderBy]?.sort;
-            return this.dataLoader(page, itemsPerPage, orderBy, this.orderDescending, this.filter);
+            return this.dataLoader(page, itemsPerPage, orderBy, this.orderDescending, this.filter, this.query);
         };
         this.dataLoader = this.loadLocalData;
         this.placeholder = "";
         this.tableId = UniqueUtils.uuid();
         this.templates = {};
         this.filter = "";
+        this.query = {};
+        this.hasQuery = false;
         this.testId = "table";
         this.realColumns = {};
     }
@@ -5208,7 +5204,9 @@ class DynamicTableComponent {
         if (changes.columns) {
             const columns = changes.columns.currentValue || [];
             this.realColumns = ObjectUtils.isArray(columns) ? columns.reduce((result, column) => {
-                result[column] = column;
+                if (!ObjectUtils.isString(column) || column.length == 0)
+                    return result;
+                result[column] = { title: `title.${column}`, sort: column };
                 return result;
             }, {}) : Object.keys(columns).reduce((result, key) => {
                 const value = columns[key];
@@ -5220,6 +5218,7 @@ class DynamicTableComponent {
             this.cols = Object.keys(this.realColumns);
             this.orderBy = this.orderBy in this.realColumns ? this.orderBy : this.cols[0];
         }
+        this.hasQuery = this.cols.some(col => this.realColumns[col].filter);
         if (changes.orderBy && this.realColumns) {
             this.orderBy = this.orderBy in this.realColumns ? this.orderBy : this.cols[0];
         }
@@ -5241,6 +5240,15 @@ class DynamicTableComponent {
         this.orderBy = column;
         this.refresh();
     }
+    updateQuery(col, value) {
+        if (!value) {
+            delete this.query[col];
+        }
+        else {
+            this.query[col] = value;
+        }
+        this.refresh();
+    }
     loadLocalData(page, rowsPerPage, orderBy, orderDescending, filter) {
         if (!this.data) {
             return Promise.resolve({
@@ -5273,10 +5281,10 @@ class DynamicTableComponent {
     }
 }
 DynamicTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: DynamicTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DynamicTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: DynamicTableComponent, selector: "dynamic-table", inputs: { label: "label", placeholder: "placeholder", dataLoader: "dataLoader", data: "data", parallelData: "parallelData", columns: "columns", showFilter: "showFilter", itemsPerPage: "itemsPerPage", updateTime: "updateTime", maxPages: "maxPages", directionLinks: "directionLinks", boundaryLinks: "boundaryLinks", orderBy: "orderBy", orderDescending: "orderDescending", testId: "testId" }, queries: [{ propertyName: "rowTemplate", first: true, predicate: ["rowTemplate"], descendants: true, static: true }, { propertyName: "wrapperTemplate", first: true, predicate: ["wrapperTemplate"], descendants: true, static: true }, { propertyName: "filterTemplate", first: true, predicate: ["filterTemplate"], descendants: true, static: true }, { propertyName: "templateDirectives", predicate: DynamicTableTemplateDirective }], viewQueries: [{ propertyName: "columnsTemplate", first: true, predicate: ["columnsTemplate"], descendants: true, static: true }, { propertyName: "defaultRowTemplate", first: true, predicate: ["defaultRowTemplate"], descendants: true, static: true }, { propertyName: "defaultWrapperTemplate", first: true, predicate: ["defaultWrapperTemplate"], descendants: true, static: true }, { propertyName: "defaultFilterTemplate", first: true, predicate: ["defaultFilterTemplate"], descendants: true, static: true }, { propertyName: "pagination", first: true, predicate: ["pagination"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"dynamic-table\" #pagination=\"pagination\" [pagination]=\"loadData\" [itemsPerPage]=\"itemsPerPage\" [updateTime]=\"updateTime\">\r\n    <ng-template #defaultFilterTemplate let-table>\r\n        <div class=\"table-search\" *ngIf=\"table.showFilter\">\r\n            <label *ngIf=\"label\" [attr.for]=\"tableId\">{{ label | translate }}</label>\r\n            <input type=\"text\"\r\n                   class=\"form-control\"\r\n                   [attr.id]=\"tableId\"\r\n                   [attr.data-testid]=\"testId + '-filter-input'\"\r\n                   [placeholder]=\"placeholder | translate\"\r\n                   [ngModel]=\"table.filter\"\r\n                   (ngModelChange)=\"table.setFilter($event)\"/>\r\n        </div>\r\n    </ng-template>\r\n    <ng-container [ngxTemplateOutlet]=\"filterTemplate || defaultFilterTemplate\" [context]=\"this\"></ng-container>\r\n    <pagination-menu [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n    <div class=\"table-responsive\">\r\n        <ng-template #columnTemplate let-context let-column=\"column\" let-template=\"template\">\r\n            <ng-template #defaultTemplate let-column=\"column\" let-item=\"item\">\r\n                <span>{{ item[column] == undefined || item[column] == null ? '-' : item[column] }}</span>\r\n            </ng-template>\r\n            <ng-template #pureTemplate>\r\n                <ng-container [ngxTemplateOutlet]=\"template.ref\" [context]=\"context\"></ng-container>\r\n            </ng-template>\r\n            <td [ngClass]=\"'column-' + column\"\r\n                [attr.data-testid]=\"testId + '-' + column + '-' + context.rowIndex\" *ngIf=\"!template || !template.pure; else pureTemplate\">\r\n                <ng-container [ngxTemplateOutlet]=\"!template ? defaultTemplate : template.ref\" [context]=\"context\"></ng-container>\r\n            </td>\r\n        </ng-template>\r\n\r\n        <ng-template #columnsTemplate let-context>\r\n            <ng-container *ngFor=\"let column of cols\"\r\n                          [ngxTemplateOutlet]=\"columnTemplate\"\r\n                          [context]=\"context\"\r\n                          [additionalContext]=\"{\r\n                            template: templates[column],\r\n                            column: column\r\n                          }\"></ng-container>\r\n        </ng-template>\r\n\r\n        <ng-template #defaultRowTemplate let-context>\r\n            <tr>\r\n                <ng-container [ngxTemplateOutlet]=\"columnsTemplate\" [context]=\"context\"></ng-container>\r\n            </tr>\r\n        </ng-template>\r\n\r\n        <ng-template #defaultWrapperTemplate>\r\n            <table class=\"table table-striped\">\r\n                <thead>\r\n                    <tr>\r\n                        <th *ngFor=\"let column of cols\" [ngClass]=\"'column-' + column\">\r\n                            <ng-template #defaultCol>\r\n                                <span>{{ realColumns[column].title | translate }}</span>\r\n                            </ng-template>\r\n                            <a *ngIf=\"realColumns[column].sort; else defaultCol\" (click)=\"setOrder(column)\">\r\n                                <span>{{ realColumns[column].title | translate }}</span>\r\n                                <i *ngIf=\"orderBy == column\"\r\n                                   [icon]=\"orderDescending ? 'sort-desc' : 'sort-asc'\"\r\n                                   [ngClass]=\"orderBy == column ? (orderDescending ? 'sort-desc': 'sort-asc') : ''\"></i>\r\n                            </a>\r\n                        </th>\r\n                    </tr>\r\n                </thead>\r\n                <tbody>\r\n                    <ng-container *paginationItem=\"let context\"\r\n                                  [ngxTemplateOutlet]=\"rowTemplate\"\r\n                                  [context]=\"context\"\r\n                                  [additionalContext]=\"this\"></ng-container>\r\n                </tbody>\r\n            </table>\r\n        </ng-template>\r\n\r\n        <ng-container [ngxTemplateOutlet]=\"wrapperTemplate || defaultWrapperTemplate\"\r\n                      [context]=\"this\"></ng-container>\r\n    </div>\r\n    <pagination-menu [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n</div>\r\n", components: [{ type: PaginationMenuComponent, selector: "pagination-menu", inputs: ["maxSize", "urlParam", "directionLinks", "boundaryLinks"] }], directives: [{ type: PaginationDirective, selector: "[pagination]", inputs: ["pagination", "page", "itemsPerPage", "updateTime", "waitFor"], outputs: ["pageChange", "onRefresh"], exportAs: ["pagination"] }, { type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: NgxTemplateOutletDirective, selector: "[ngxTemplateOutlet]", inputs: ["context", "additionalContext", "ngxTemplateOutlet"] }, { type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: IconDirective, selector: "[icon]", inputs: ["icon", "activeIcon", "active"], outputs: ["activeChange"] }, { type: PaginationItemDirective, selector: "[paginationItem]" }], pipes: { "translate": TranslatePipe } });
+DynamicTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: DynamicTableComponent, selector: "dynamic-table", inputs: { label: "label", placeholder: "placeholder", dataLoader: "dataLoader", data: "data", parallelData: "parallelData", columns: "columns", showFilter: "showFilter", itemsPerPage: "itemsPerPage", updateTime: "updateTime", maxPages: "maxPages", directionLinks: "directionLinks", boundaryLinks: "boundaryLinks", orderBy: "orderBy", orderDescending: "orderDescending", testId: "testId" }, queries: [{ propertyName: "rowTemplate", first: true, predicate: ["rowTemplate"], descendants: true, static: true }, { propertyName: "wrapperTemplate", first: true, predicate: ["wrapperTemplate"], descendants: true, static: true }, { propertyName: "filterTemplate", first: true, predicate: ["filterTemplate"], descendants: true, static: true }, { propertyName: "templateDirectives", predicate: DynamicTableTemplateDirective }], viewQueries: [{ propertyName: "columnsTemplate", first: true, predicate: ["columnsTemplate"], descendants: true, static: true }, { propertyName: "defaultRowTemplate", first: true, predicate: ["defaultRowTemplate"], descendants: true, static: true }, { propertyName: "defaultWrapperTemplate", first: true, predicate: ["defaultWrapperTemplate"], descendants: true, static: true }, { propertyName: "defaultFilterTemplate", first: true, predicate: ["defaultFilterTemplate"], descendants: true, static: true }, { propertyName: "pagination", first: true, predicate: ["pagination"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"dynamic-table\" #pagination=\"pagination\" [pagination]=\"loadData\" [itemsPerPage]=\"itemsPerPage\" [updateTime]=\"updateTime\">\r\n    <ng-template #defaultFilterTemplate let-table>\r\n        <div class=\"table-search\" *ngIf=\"table.showFilter\">\r\n            <label *ngIf=\"label\" [attr.for]=\"tableId\">{{ label | translate }}</label>\r\n            <input type=\"text\"\r\n                   class=\"form-control\"\r\n                   [attr.id]=\"tableId\"\r\n                   [attr.data-testid]=\"testId + '-filter-input'\"\r\n                   [placeholder]=\"placeholder | translate\"\r\n                   [ngModel]=\"table.filter\"\r\n                   (ngModelChange)=\"table.setFilter($event)\"/>\r\n        </div>\r\n    </ng-template>\r\n    <ng-container [ngxTemplateOutlet]=\"filterTemplate || defaultFilterTemplate\" [context]=\"this\"></ng-container>\r\n    <pagination-menu [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n    <div class=\"table-responsive\">\r\n        <ng-template #columnTemplate let-context let-column=\"column\" let-template=\"template\">\r\n            <ng-template #defaultTemplate let-column=\"column\" let-item=\"item\">\r\n                <span>{{ item[column] == undefined || item[column] == null ? '-' : item[column] }}</span>\r\n            </ng-template>\r\n            <ng-template #pureTemplate>\r\n                <ng-container [ngxTemplateOutlet]=\"template.ref\" [context]=\"context\"></ng-container>\r\n            </ng-template>\r\n            <td [ngClass]=\"'column-' + column\"\r\n                [attr.data-testid]=\"testId + '-' + column + '-' + context.rowIndex\" *ngIf=\"!template || !template.pure; else pureTemplate\">\r\n                <ng-container [ngxTemplateOutlet]=\"!template ? defaultTemplate : template.ref\" [context]=\"context\"></ng-container>\r\n            </td>\r\n        </ng-template>\r\n\r\n        <ng-template #columnsTemplate let-context>\r\n            <ng-container *ngFor=\"let column of cols\"\r\n                          [ngxTemplateOutlet]=\"columnTemplate\"\r\n                          [context]=\"context\"\r\n                          [additionalContext]=\"{\r\n                            template: templates[column],\r\n                            column: column\r\n                          }\"></ng-container>\r\n        </ng-template>\r\n\r\n        <ng-template #defaultRowTemplate let-context>\r\n            <tr>\r\n                <ng-container [ngxTemplateOutlet]=\"columnsTemplate\" [context]=\"context\"></ng-container>\r\n            </tr>\r\n        </ng-template>\r\n\r\n        <ng-template #defaultWrapperTemplate>\r\n            <table class=\"table table-striped\">\r\n                <thead>\r\n                    <tr>\r\n                        <th *ngFor=\"let column of cols\" [ngClass]=\"'column-' + column\">\r\n                            <ng-template #defaultCol>\r\n                                <span>{{ realColumns[column].title | translate }}</span>\r\n                            </ng-template>\r\n                            <a *ngIf=\"realColumns[column].sort; else defaultCol\" (click)=\"setOrder(column)\">\r\n                                <span>{{ realColumns[column].title | translate }}</span>\r\n                                <i *ngIf=\"orderBy == column\"\r\n                                   [icon]=\"orderDescending ? 'sort-desc' : 'sort-asc'\"\r\n                                   [ngClass]=\"orderBy == column ? (orderDescending ? 'sort-desc': 'sort-asc') : ''\"></i>\r\n                            </a>\r\n                        </th>\r\n                    </tr>\r\n                    <tr *ngIf=\"hasQuery\">\r\n                        <th *ngFor=\"let column of cols\" [ngClass]=\"['column-' + column, 'filter-column']\">\r\n                            <input type=\"text\"\r\n                                   class=\"form-control\"\r\n                                   [attr.data-testid]=\"testId + '-filter-' + column\"\r\n                                   [placeholder]=\"realColumns[column].title | translate\"\r\n                                   [ngModel]=\"query[column]\"\r\n                                   (ngModelChange)=\"updateQuery(column, $event)\"/>\r\n                        </th>\r\n                    </tr>\r\n                </thead>\r\n                <tbody>\r\n                    <ng-container *paginationItem=\"let context\"\r\n                                  [ngxTemplateOutlet]=\"rowTemplate\"\r\n                                  [context]=\"context\"\r\n                                  [additionalContext]=\"this\"></ng-container>\r\n                </tbody>\r\n            </table>\r\n        </ng-template>\r\n\r\n        <ng-container [ngxTemplateOutlet]=\"wrapperTemplate || defaultWrapperTemplate\"\r\n                      [context]=\"this\"></ng-container>\r\n    </div>\r\n    <pagination-menu [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n</div>\r\n", components: [{ type: PaginationMenuComponent, selector: "pagination-menu", inputs: ["maxSize", "urlParam", "directionLinks", "boundaryLinks"] }], directives: [{ type: PaginationDirective, selector: "[pagination]", inputs: ["pagination", "page", "itemsPerPage", "updateTime", "waitFor"], outputs: ["pageChange", "onRefresh"], exportAs: ["pagination"] }, { type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: NgxTemplateOutletDirective, selector: "[ngxTemplateOutlet]", inputs: ["context", "additionalContext", "ngxTemplateOutlet"] }, { type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: IconDirective, selector: "[icon]", inputs: ["icon", "activeIcon", "active"], outputs: ["activeChange"] }, { type: PaginationItemDirective, selector: "[paginationItem]" }], pipes: { "translate": TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: DynamicTableComponent, decorators: [{
             type: Component,
-            args: [{ selector: "dynamic-table", template: "<div class=\"dynamic-table\" #pagination=\"pagination\" [pagination]=\"loadData\" [itemsPerPage]=\"itemsPerPage\" [updateTime]=\"updateTime\">\r\n    <ng-template #defaultFilterTemplate let-table>\r\n        <div class=\"table-search\" *ngIf=\"table.showFilter\">\r\n            <label *ngIf=\"label\" [attr.for]=\"tableId\">{{ label | translate }}</label>\r\n            <input type=\"text\"\r\n                   class=\"form-control\"\r\n                   [attr.id]=\"tableId\"\r\n                   [attr.data-testid]=\"testId + '-filter-input'\"\r\n                   [placeholder]=\"placeholder | translate\"\r\n                   [ngModel]=\"table.filter\"\r\n                   (ngModelChange)=\"table.setFilter($event)\"/>\r\n        </div>\r\n    </ng-template>\r\n    <ng-container [ngxTemplateOutlet]=\"filterTemplate || defaultFilterTemplate\" [context]=\"this\"></ng-container>\r\n    <pagination-menu [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n    <div class=\"table-responsive\">\r\n        <ng-template #columnTemplate let-context let-column=\"column\" let-template=\"template\">\r\n            <ng-template #defaultTemplate let-column=\"column\" let-item=\"item\">\r\n                <span>{{ item[column] == undefined || item[column] == null ? '-' : item[column] }}</span>\r\n            </ng-template>\r\n            <ng-template #pureTemplate>\r\n                <ng-container [ngxTemplateOutlet]=\"template.ref\" [context]=\"context\"></ng-container>\r\n            </ng-template>\r\n            <td [ngClass]=\"'column-' + column\"\r\n                [attr.data-testid]=\"testId + '-' + column + '-' + context.rowIndex\" *ngIf=\"!template || !template.pure; else pureTemplate\">\r\n                <ng-container [ngxTemplateOutlet]=\"!template ? defaultTemplate : template.ref\" [context]=\"context\"></ng-container>\r\n            </td>\r\n        </ng-template>\r\n\r\n        <ng-template #columnsTemplate let-context>\r\n            <ng-container *ngFor=\"let column of cols\"\r\n                          [ngxTemplateOutlet]=\"columnTemplate\"\r\n                          [context]=\"context\"\r\n                          [additionalContext]=\"{\r\n                            template: templates[column],\r\n                            column: column\r\n                          }\"></ng-container>\r\n        </ng-template>\r\n\r\n        <ng-template #defaultRowTemplate let-context>\r\n            <tr>\r\n                <ng-container [ngxTemplateOutlet]=\"columnsTemplate\" [context]=\"context\"></ng-container>\r\n            </tr>\r\n        </ng-template>\r\n\r\n        <ng-template #defaultWrapperTemplate>\r\n            <table class=\"table table-striped\">\r\n                <thead>\r\n                    <tr>\r\n                        <th *ngFor=\"let column of cols\" [ngClass]=\"'column-' + column\">\r\n                            <ng-template #defaultCol>\r\n                                <span>{{ realColumns[column].title | translate }}</span>\r\n                            </ng-template>\r\n                            <a *ngIf=\"realColumns[column].sort; else defaultCol\" (click)=\"setOrder(column)\">\r\n                                <span>{{ realColumns[column].title | translate }}</span>\r\n                                <i *ngIf=\"orderBy == column\"\r\n                                   [icon]=\"orderDescending ? 'sort-desc' : 'sort-asc'\"\r\n                                   [ngClass]=\"orderBy == column ? (orderDescending ? 'sort-desc': 'sort-asc') : ''\"></i>\r\n                            </a>\r\n                        </th>\r\n                    </tr>\r\n                </thead>\r\n                <tbody>\r\n                    <ng-container *paginationItem=\"let context\"\r\n                                  [ngxTemplateOutlet]=\"rowTemplate\"\r\n                                  [context]=\"context\"\r\n                                  [additionalContext]=\"this\"></ng-container>\r\n                </tbody>\r\n            </table>\r\n        </ng-template>\r\n\r\n        <ng-container [ngxTemplateOutlet]=\"wrapperTemplate || defaultWrapperTemplate\"\r\n                      [context]=\"this\"></ng-container>\r\n    </div>\r\n    <pagination-menu [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n</div>\r\n" }]
+            args: [{ selector: "dynamic-table", template: "<div class=\"dynamic-table\" #pagination=\"pagination\" [pagination]=\"loadData\" [itemsPerPage]=\"itemsPerPage\" [updateTime]=\"updateTime\">\r\n    <ng-template #defaultFilterTemplate let-table>\r\n        <div class=\"table-search\" *ngIf=\"table.showFilter\">\r\n            <label *ngIf=\"label\" [attr.for]=\"tableId\">{{ label | translate }}</label>\r\n            <input type=\"text\"\r\n                   class=\"form-control\"\r\n                   [attr.id]=\"tableId\"\r\n                   [attr.data-testid]=\"testId + '-filter-input'\"\r\n                   [placeholder]=\"placeholder | translate\"\r\n                   [ngModel]=\"table.filter\"\r\n                   (ngModelChange)=\"table.setFilter($event)\"/>\r\n        </div>\r\n    </ng-template>\r\n    <ng-container [ngxTemplateOutlet]=\"filterTemplate || defaultFilterTemplate\" [context]=\"this\"></ng-container>\r\n    <pagination-menu [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n    <div class=\"table-responsive\">\r\n        <ng-template #columnTemplate let-context let-column=\"column\" let-template=\"template\">\r\n            <ng-template #defaultTemplate let-column=\"column\" let-item=\"item\">\r\n                <span>{{ item[column] == undefined || item[column] == null ? '-' : item[column] }}</span>\r\n            </ng-template>\r\n            <ng-template #pureTemplate>\r\n                <ng-container [ngxTemplateOutlet]=\"template.ref\" [context]=\"context\"></ng-container>\r\n            </ng-template>\r\n            <td [ngClass]=\"'column-' + column\"\r\n                [attr.data-testid]=\"testId + '-' + column + '-' + context.rowIndex\" *ngIf=\"!template || !template.pure; else pureTemplate\">\r\n                <ng-container [ngxTemplateOutlet]=\"!template ? defaultTemplate : template.ref\" [context]=\"context\"></ng-container>\r\n            </td>\r\n        </ng-template>\r\n\r\n        <ng-template #columnsTemplate let-context>\r\n            <ng-container *ngFor=\"let column of cols\"\r\n                          [ngxTemplateOutlet]=\"columnTemplate\"\r\n                          [context]=\"context\"\r\n                          [additionalContext]=\"{\r\n                            template: templates[column],\r\n                            column: column\r\n                          }\"></ng-container>\r\n        </ng-template>\r\n\r\n        <ng-template #defaultRowTemplate let-context>\r\n            <tr>\r\n                <ng-container [ngxTemplateOutlet]=\"columnsTemplate\" [context]=\"context\"></ng-container>\r\n            </tr>\r\n        </ng-template>\r\n\r\n        <ng-template #defaultWrapperTemplate>\r\n            <table class=\"table table-striped\">\r\n                <thead>\r\n                    <tr>\r\n                        <th *ngFor=\"let column of cols\" [ngClass]=\"'column-' + column\">\r\n                            <ng-template #defaultCol>\r\n                                <span>{{ realColumns[column].title | translate }}</span>\r\n                            </ng-template>\r\n                            <a *ngIf=\"realColumns[column].sort; else defaultCol\" (click)=\"setOrder(column)\">\r\n                                <span>{{ realColumns[column].title | translate }}</span>\r\n                                <i *ngIf=\"orderBy == column\"\r\n                                   [icon]=\"orderDescending ? 'sort-desc' : 'sort-asc'\"\r\n                                   [ngClass]=\"orderBy == column ? (orderDescending ? 'sort-desc': 'sort-asc') : ''\"></i>\r\n                            </a>\r\n                        </th>\r\n                    </tr>\r\n                    <tr *ngIf=\"hasQuery\">\r\n                        <th *ngFor=\"let column of cols\" [ngClass]=\"['column-' + column, 'filter-column']\">\r\n                            <input type=\"text\"\r\n                                   class=\"form-control\"\r\n                                   [attr.data-testid]=\"testId + '-filter-' + column\"\r\n                                   [placeholder]=\"realColumns[column].title | translate\"\r\n                                   [ngModel]=\"query[column]\"\r\n                                   (ngModelChange)=\"updateQuery(column, $event)\"/>\r\n                        </th>\r\n                    </tr>\r\n                </thead>\r\n                <tbody>\r\n                    <ng-container *paginationItem=\"let context\"\r\n                                  [ngxTemplateOutlet]=\"rowTemplate\"\r\n                                  [context]=\"context\"\r\n                                  [additionalContext]=\"this\"></ng-container>\r\n                </tbody>\r\n            </table>\r\n        </ng-template>\r\n\r\n        <ng-container [ngxTemplateOutlet]=\"wrapperTemplate || defaultWrapperTemplate\"\r\n                      [context]=\"this\"></ng-container>\r\n    </div>\r\n    <pagination-menu [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n</div>\r\n" }]
         }], ctorParameters: function () { return []; }, propDecorators: { label: [{
                 type: Input
             }], placeholder: [{
@@ -5742,5 +5750,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { API_SERVICE, APP_BASE_URL, AUTH_SERVICE, AclService, AjaxRequestHandler, ApiService, ArrayUtils, AsyncMethodBase, AsyncMethodDirective, AuthGuard, BASE_CONFIG, BackgroundDirective, BaseHttpClient, BaseHttpService, CONFIG_SERVICE, CanvasColor, CanvasUtils, ChunkPipe, Circle, ConfigService, ConsoleToasterService, DateUtils, DynamicTableComponent, DynamicTableTemplateDirective, ERROR_HANDLER, EXPRESS_REQUEST, EntriesPipe, ErrorHandlerService, EventsService, ExtraItemPropertiesPipe, FactoryDependencies, FileSystemEntry, FileUtils, FilterPipe, FindPipe, FormatNumberPipe, FormatterService, GLOBAL_TEMPLATES, GenericValue, GetOffsetPipe, GetTypePipe, GlobalTemplateDirective, GlobalTemplatePipe, GlobalTemplateService, GroupByPipe, HttpPromise, ICON_SERVICE, IConfiguration, IconDirective, IconService, Initializer, IsTypePipe, JSONfn, JoinPipe, KeysPipe, LANGUAGE_SERVICE, LanguageService, LoaderUtils, LocalHttpService, MapPipe, MathUtils, MaxPipe, MinPipe, NgxTemplateOutletDirective, NgxUtilsModule, ObjectType, ObjectUtils, ObservableUtils, OpenApiService, PROMISE_SERVICE, PaginationDirective, PaginationItemContext, PaginationItemDirective, PaginationMenuComponent, Point, PopPipe, PromiseService, RESIZE_DELAY, RESIZE_STRATEGY, ROOT_ELEMENT, Rect, ReducePipe, ReflectUtils, RemapPipe, ReplacePipe, ResizeEventPlugin, ResourceIfContext, ResourceIfDirective, ReversePipe, RoundPipe, SCRIPT_PARAMS, SafeHtmlPipe, ScrollEventPlugin, SetUtils, ShiftPipe, SplitPipe, StateService, StaticAuthService, StaticLanguageService, StickyClassDirective, StickyDirective, StorageMode, StorageService, StringUtils, TOASTER_SERVICE, TimerUtils, TranslatePipe, TranslatedUrlSerializer, UniqueUtils, UniversalService, UnorderedListComponent, UnorderedListItemDirective, UnorderedListTemplateDirective, UnorederedListTemplate, ValuedPromise, ValuesPipe, Vector, WASI_IMPLEMENTATION, WasmService };
+export { API_SERVICE, APP_BASE_URL, AUTH_SERVICE, AclService, AjaxRequestHandler, ApiService, ArrayUtils, AsyncMethodBase, AsyncMethodDirective, AuthGuard, BASE_CONFIG, BackgroundDirective, BaseHttpClient, BaseHttpService, CONFIG_SERVICE, CanvasColor, CanvasUtils, ChunkPipe, Circle, ConfigService, ConsoleToasterService, DateUtils, DynamicTableComponent, DynamicTableTemplateDirective, ERROR_HANDLER, EXPRESS_REQUEST, EntriesPipe, ErrorHandlerService, EventsService, ExtraItemPropertiesPipe, FactoryDependencies, FileSystemEntry, FileUtils, FilterPipe, FindPipe, FormatNumberPipe, FormatterService, GLOBAL_TEMPLATES, GenericValue, GetOffsetPipe, GetTypePipe, GlobalTemplateDirective, GlobalTemplatePipe, GlobalTemplateService, GroupByPipe, HttpPromise, ICON_SERVICE, IConfiguration, IconDirective, IconService, Initializer, IsTypePipe, JSONfn, JoinPipe, KeysPipe, LANGUAGE_SERVICE, LanguageService, LoaderUtils, LocalHttpService, MapPipe, MathUtils, MaxPipe, MinPipe, NgxTemplateOutletDirective, NgxUtilsModule, ObjectType, ObjectUtils, ObservableUtils, OpenApiService, PROMISE_SERVICE, PaginationDirective, PaginationItemContext, PaginationItemDirective, PaginationMenuComponent, Point, PopPipe, PromiseService, RESIZE_DELAY, RESIZE_STRATEGY, ROOT_ELEMENT, Rect, ReducePipe, ReflectUtils, RemapPipe, ReplacePipe, ResizeEventPlugin, ResourceIfContext, ResourceIfDirective, ReversePipe, RoundPipe, SCRIPT_PARAMS, SafeHtmlPipe, ScrollEventPlugin, SetUtils, ShiftPipe, SplitPipe, StateService, StaticAuthService, StaticLanguageService, StickyClassDirective, StickyDirective, StorageMode, StorageService, StringUtils, TOASTER_SERVICE, TimerUtils, TranslatePipe, TranslatedUrlSerializer, UniqueUtils, UniversalService, UnorderedListComponent, UnorderedListItemDirective, UnorderedListTemplateDirective, ValuedPromise, ValuesPipe, Vector, WASI_IMPLEMENTATION, WasmService };
 //# sourceMappingURL=stemy-ngx-utils.mjs.map