@taon-dev/ui 21.0.26 → 21.0.27

package/ts-source/browser-code-prod/taon-datatable/taon-datatable.component.ts

@@ -14,6 +14,7 @@ import { CommonModule } from '@angular/common';
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component, DestroyRef, ElementRef, EventEmitter, Input, OnInit, Output, TemplateRef, ViewChild, inject, } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { ActivatedRoute, Router } from '@angular/router';
 import { MatButtonModule } from '@angular/material/button';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatIconModule } from '@angular/material/icon';
@@ -25,6 +26,7 @@ import { Translation } from '@taon-dev/i18n/browser-prod';
 import { getDefaultModel } from 'ng2-rest/browser-prod';
 import { BehaviorSubject, Observable, Subject, catchError, debounceTime, distinctUntilChanged, finalize, from, map, of, startWith, switchMap, tap, } from 'rxjs';
 import { TaonBaseCrudController, TaonBaseEntity, TaonPaginationSort, TaonPaginationQuery, ClassHelpers__NS__asyncHandler, ClassHelpers__NS__ensureClassConfig, ClassHelpers__NS__ensureMethodConfig, ClassHelpers__NS__getClassConfig, ClassHelpers__NS__getClassFnFromObject, ClassHelpers__NS__getControllerConfigs, ClassHelpers__NS__getFullInternalName, ClassHelpers__NS__getMethodsNames, ClassHelpers__NS__getName, ClassHelpers__NS__getOrginalClass, ClassHelpers__NS__getUniqueKey, ClassHelpers__NS__hasParentClassWithName, ClassHelpers__NS__isContextClassObject, ClassHelpers__NS__mapFnError, ClassHelpers__NS__setName, Symbols__NS__classMethodsNames as TaonSymbols__NS__classMethodsNames, Symbols__NS__ctxInClassOrClassObj as TaonSymbols__NS__ctxInClassOrClassObj, Symbols__NS__fullClassNameStaticProperty as TaonSymbols__NS__fullClassNameStaticProperty, Symbols__NS__metadata__NS__className as TaonSymbols__NS__metadata__NS__className, Symbols__NS__metadata__NS__options__NS__controller as TaonSymbols__NS__metadata__NS__options__NS__controller, Symbols__NS__metadata__NS__options__NS__entity as TaonSymbols__NS__metadata__NS__options__NS__entity, Symbols__NS__metadata__NS__options__NS__migration as TaonSymbols__NS__metadata__NS__options__NS__migration, Symbols__NS__metadata__NS__options__NS__provider as TaonSymbols__NS__metadata__NS__options__NS__provider, Symbols__NS__metadata__NS__options__NS__repository as TaonSymbols__NS__metadata__NS__options__NS__repository, Symbols__NS__metadata__NS__options__NS__subscriber as TaonSymbols__NS__metadata__NS__options__NS__subscriber, Symbols__NS__old__NS__CIRCURAL_OBJECTS_MAP_BODY_PARAM as TaonSymbols__NS__old__NS__CIRCURAL_OBJECTS_MAP_BODY_PARAM, Symbols__NS__old__NS__CIRCURAL_OBJECTS_MAP_QUERY_PARAM as TaonSymbols__NS__old__NS__CIRCURAL_OBJECTS_MAP_QUERY_PARAM, Symbols__NS__old__NS__CLASS_DECORATOR_CONTEXT as TaonSymbols__NS__old__NS__CLASS_DECORATOR_CONTEXT, Symbols__NS__old__NS__ENDPOINT_META_CONFIG as TaonSymbols__NS__old__NS__ENDPOINT_META_CONFIG, Symbols__NS__old__NS__ERROR_MESSAGES_CLASS_NAME_MATCH as TaonSymbols__NS__old__NS__ERROR_MESSAGES_CLASS_NAME_MATCH, Symbols__NS__old__NS__HAS_TABLE_IN_DB as TaonSymbols__NS__old__NS__HAS_TABLE_IN_DB, Symbols__NS__old__NS__MAPPING_CONFIG_HEADER as TaonSymbols__NS__old__NS__MAPPING_CONFIG_HEADER, Symbols__NS__old__NS__MAPPING_CONFIG_HEADER_BODY_PARAMS as TaonSymbols__NS__old__NS__MAPPING_CONFIG_HEADER_BODY_PARAMS, Symbols__NS__old__NS__MAPPING_CONFIG_HEADER_QUERY_PARAMS as TaonSymbols__NS__old__NS__MAPPING_CONFIG_HEADER_QUERY_PARAMS, Symbols__NS__old__NS__MDC_KEY as TaonSymbols__NS__old__NS__MDC_KEY, Symbols__NS__old__NS__SOCKET_MSG as TaonSymbols__NS__old__NS__SOCKET_MSG, Symbols__NS__old__NS__WEBSQL_REST_PROGRESS_FUN as TaonSymbols__NS__old__NS__WEBSQL_REST_PROGRESS_FUN, Symbols__NS__old__NS__WEBSQL_REST_PROGRESS_FUN_DONE as TaonSymbols__NS__old__NS__WEBSQL_REST_PROGRESS_FUN_DONE, Symbols__NS__old__NS__WEBSQL_REST_PROGRESS_FUN_START as TaonSymbols__NS__old__NS__WEBSQL_REST_PROGRESS_FUN_START, Symbols__NS__old__NS__WEBSQL_REST_PROGRESS_TIMEOUT as TaonSymbols__NS__old__NS__WEBSQL_REST_PROGRESS_TIMEOUT, Symbols__NS__old__NS__X_TOTAL_COUNT as TaonSymbols__NS__old__NS__X_TOTAL_COUNT, Symbols__NS__orignalClassClonesObj as TaonSymbols__NS__orignalClassClonesObj, Symbols__NS__REALTIME as TaonSymbols__NS__REALTIME, Symbols__NS__taonInstanceId as TaonSymbols__NS__taonInstanceId, Taon__NS____FILE_RELATIVE_PATH, Taon__NS__asset, Taon__NS__assetsFrom, Taon__NS__assetsListFrom, Taon__NS__createContext, Taon__NS__createContextTemplate, Taon__NS__error, Taon__NS__getResponseValue, Taon__NS__isBrowser, Taon__NS__isElectron, Taon__NS__isNode, Taon__NS__isWebSQL, Taon__NS__LANG_IMPORT_MAP, Taon__NS__removeLoader, Taon__NS__Response, Taon__NS__ResponseHtml, Taon__NS__StartParams } from 'taon/browser-prod';
+import { TaonStor__NS__awaitAll, TaonStor__NS__inFile, TaonStor__NS__inIndexedDbStorage, TaonStor__NS__inJson, TaonStor__NS__inLocalstorage, TaonStor__NS__inSessionStorage } from 'taon-storage/browser-prod';
 import { json5, ___NS__add, ___NS__after, ___NS__ary, ___NS__assign, ___NS__assignIn, ___NS__assignInWith, ___NS__assignWith, ___NS__at, ___NS__attempt, ___NS__before, ___NS__bind, ___NS__bindAll, ___NS__bindKey, ___NS__camelCase, ___NS__capitalize, ___NS__castArray, ___NS__ceil, ___NS__chain, ___NS__chunk, ___NS__clamp, ___NS__clone, ___NS__cloneDeep, ___NS__cloneDeepWith, ___NS__cloneWith, ___NS__compact, ___NS__concat, ___NS__cond, ___NS__conforms, ___NS__conformsTo, ___NS__constant, ___NS__countBy, ___NS__create, ___NS__curry, ___NS__curryRight, ___NS__debounce, ___NS__deburr, ___NS__defaults, ___NS__defaultsDeep, ___NS__defaultTo, ___NS__defer, ___NS__delay, ___NS__difference, ___NS__differenceBy, ___NS__differenceWith, ___NS__divide, ___NS__drop, ___NS__dropRight, ___NS__dropRightWhile, ___NS__dropWhile, ___NS__each, ___NS__eachRight, ___NS__endsWith, ___NS__entries, ___NS__entriesIn, ___NS__eq, ___NS__escape, ___NS__escapeRegExp, ___NS__every, ___NS__extend, ___NS__extendWith, ___NS__fill, ___NS__filter, ___NS__find, ___NS__findIndex, ___NS__findKey, ___NS__findLast, ___NS__findLastIndex, ___NS__findLastKey, ___NS__first, ___NS__flatMap, ___NS__flatMapDeep, ___NS__flatMapDepth, ___NS__flatten, ___NS__flattenDeep, ___NS__flattenDepth, ___NS__flip, ___NS__floor, ___NS__flow, ___NS__flowRight, ___NS__forEach, ___NS__forEachRight, ___NS__forIn, ___NS__forInRight, ___NS__forOwn, ___NS__forOwnRight, ___NS__fromPairs, ___NS__functions, ___NS__functionsIn, ___NS__get, ___NS__groupBy, ___NS__gt, ___NS__gte, ___NS__has, ___NS__hasIn, ___NS__head, ___NS__identity, ___NS__includes, ___NS__indexOf, ___NS__initial, ___NS__inRange, ___NS__intersection, ___NS__intersectionBy, ___NS__intersectionWith, ___NS__invert, ___NS__invertBy, ___NS__invoke, ___NS__invokeMap, ___NS__isArguments, ___NS__isArray, ___NS__isArrayBuffer, ___NS__isArrayLike, ___NS__isArrayLikeObject, ___NS__isBoolean, ___NS__isBuffer, ___NS__isDate, ___NS__isElement, ___NS__isEmpty, ___NS__isEqual, ___NS__isEqualWith, ___NS__isError, ___NS__isFinite, ___NS__isFunction, ___NS__isInteger, ___NS__isLeafObject, ___NS__isLength, ___NS__isMap, ___NS__isMatch, ___NS__isMatchWith, ___NS__isNaN, ___NS__isNative, ___NS__isNil, ___NS__isNull, ___NS__isNumber, ___NS__isObject, ___NS__isObjectLike, ___NS__isPlainObject, ___NS__isRegExp, ___NS__isSafeInteger, ___NS__isSet, ___NS__isString, ___NS__isSymbol, ___NS__isTypedArray, ___NS__isUndefined, ___NS__isWeakMap, ___NS__isWeakSet, ___NS__iteratee, ___NS__join, ___NS__kebabCase, ___NS__keyBy, ___NS__keys, ___NS__keysIn, ___NS__last, ___NS__lastIndexOf, ___NS__lowerCase, ___NS__lowerFirst, ___NS__lt, ___NS__lte, ___NS__map, ___NS__mapKeys, ___NS__mapValues, ___NS__matches, ___NS__matchesProperty, ___NS__max, ___NS__maxBy, ___NS__mean, ___NS__meanBy, ___NS__memoize, ___NS__merge, ___NS__mergeWith, ___NS__method, ___NS__methodOf, ___NS__min, ___NS__minBy, ___NS__mixin, ___NS__multiply, ___NS__negate, ___NS__noop, ___NS__now, ___NS__nth, ___NS__nthArg, ___NS__omit, ___NS__omitBy, ___NS__once, ___NS__orderBy, ___NS__over, ___NS__overArgs, ___NS__overEvery, ___NS__overSome, ___NS__pad, ___NS__padEnd, ___NS__padStart, ___NS__parseInt, ___NS__partial, ___NS__partialRight, ___NS__partition, ___NS__pick, ___NS__pickBy, ___NS__property, ___NS__propertyOf, ___NS__pull, ___NS__pullAll, ___NS__pullAllBy, ___NS__pullAllWith, ___NS__pullAt, ___NS__random, ___NS__range, ___NS__rangeRight, ___NS__rearg, ___NS__reduce, ___NS__reduceRight, ___NS__reject, ___NS__remove, ___NS__repeat, ___NS__replace, ___NS__rest, ___NS__result, ___NS__reverse, ___NS__round, ___NS__sample, ___NS__sampleSize, ___NS__set, ___NS__setWith, ___NS__shuffle, ___NS__size, ___NS__slice, ___NS__snakeCase, ___NS__some, ___NS__sortBy, ___NS__sortedIndex, ___NS__sortedIndexBy, ___NS__sortedIndexOf, ___NS__sortedLastIndex, ___NS__sortedLastIndexBy, ___NS__sortedLastIndexOf, ___NS__sortedUniq, ___NS__sortedUniqBy, ___NS__split, ___NS__spread, ___NS__startCase, ___NS__startsWith, ___NS__stubArray, ___NS__stubFalse, ___NS__stubObject, ___NS__stubString, ___NS__stubTrue, ___NS__subtract, ___NS__sum, ___NS__sumBy, ___NS__tail, ___NS__take, ___NS__takeRight, ___NS__takeRightWhile, ___NS__takeWhile, ___NS__tap, ___NS__template, ___NS__templateSettings, ___NS__throttle, ___NS__thru, ___NS__times, ___NS__toArray, ___NS__toFinite, ___NS__toInteger, ___NS__toLength, ___NS__toLower, ___NS__toNumber, ___NS__toPairs, ___NS__toPairsIn, ___NS__toPath, ___NS__toPlainObject, ___NS__toSafeInteger, ___NS__toString, ___NS__toUpper, ___NS__transform, ___NS__trim, ___NS__trimEnd, ___NS__trimStart, ___NS__truncate, ___NS__unary, ___NS__unescape, ___NS__union, ___NS__unionBy, ___NS__unionWith, ___NS__uniq, ___NS__uniqBy, ___NS__uniqueId, ___NS__uniqWith, ___NS__unset, ___NS__unzip, ___NS__unzipWith, ___NS__update, ___NS__updateWith, ___NS__upperCase, ___NS__upperFirst, ___NS__values, ___NS__valuesIn, ___NS__without, ___NS__words, ___NS__wrap, ___NS__xor, ___NS__xorBy, ___NS__xorWith, ___NS__zip, ___NS__zipObject, ___NS__zipObjectDeep, ___NS__zipWith } from 'tnp-core/browser-prod';
 const t = Translation.for('src/lib/taon-datatable/taon-datatable.component.ts', { "src/lib/taon-datatable/taon-datatable.component.html": { "en-US": async () => (await import('./i18n/taon-datatable.component.html.en-US.i18n.data')).default, "pl-PL": async () => (await import('./i18n/taon-datatable.component.html.pl-PL.i18n.data')).default, "de-DE": async () => (await import('./i18n/taon-datatable.component.html.de-DE.i18n.data')).default }, "src/lib/taon-datatable/taon-datatable.component.ts": { "en-US": async () => (await import('./i18n/taon-datatable.component.ts.en-US.i18n.data')).default, "pl-PL": async () => (await import('./i18n/taon-datatable.component.ts.pl-PL.i18n.data')).default, "de-DE": async () => (await import('./i18n/taon-datatable.component.ts.de-DE.i18n.data')).default } } as any);
 const defaultColumns: MtxGridColumn[] = [
@@ -38,6 +40,17 @@ const defaultColumns: MtxGridColumn[] = [
     },
 ];
 type SearchMode = 'simple' | 'advanced';
+type TablePaginationPersistence = 'none' | 'query-params' | 'local-storage' | 'session-storage';
+type TableFilterPersistence = 'none' | 'query-params';
+interface TablePaginationState {
+    pageNumber: number;
+    pageSize: number;
+}
+interface TablePaginationStorage {
+    (): TablePaginationState;
+    ready(): Promise<void>;
+    set(value: TablePaginationState): Promise<void>;
+}
 @Component({
     selector: 'taon-datatable',
     standalone: true,
@@ -61,6 +74,8 @@ export class TaonDatatableComponent implements OnInit {
     readonly t = t.for(this);
     private readonly cdr = inject(ChangeDetectorRef);
     private readonly destroyRef = inject(DestroyRef);
+    private readonly route = inject(ActivatedRoute);
+    private readonly router = inject(Router);
     @Input()
     pageNumber = 1;
     @Input()
@@ -85,6 +100,14 @@ export class TaonDatatableComponent implements OnInit {
     @Input()
     searchMode: SearchMode = 'advanced';
     @Input()
+    filtersTemplate?: TemplateRef<unknown>;
+    @Input()
+    storeTablePagination: TablePaginationPersistence = 'none';
+    @Input()
+    storeTableFilters: TableFilterPersistence = 'none';
+    @Input()
+    tableId?: string;
+    @Input()
     callQueryMethod?: string;
     private _data?: any[];
     @Input()
@@ -119,6 +142,7 @@ export class TaonDatatableComponent implements OnInit {
     private readonly searchChange$ = new Subject<string>();
     readonly data$: Observable<any[]> = this.reload$.pipe(switchMap(() => this.loadData()));
     expandedRows = new Set<any>();
+    private paginationStorage?: TablePaginationStorage;
     get entity(): typeof TaonBaseEntity | undefined {
         return this.entityCrudController?.entityClassResolveFn();
     }
@@ -143,10 +167,17 @@ export class TaonDatatableComponent implements OnInit {
         this.showPaginator = ___NS__isBoolean(this.showPaginator)
             ? this.showPaginator
             : Boolean(this.entity) || this.offlineMode;
+        if (this.storeTableFilters === 'query-params') {
+            this.columnFilters = this.readQueryFilters();
+        }
+        void this.restorePagination().then(() => this.subscribeToData());
+    }
+    private subscribeToData(): void {
         this.searchChange$
             .pipe(debounceTime(400), distinctUntilChanged(), tap(search => {
             this.searchValue = search;
             this.pageNumber = 1;
+            this.persistPagination();
             this.reload();
         }), takeUntilDestroyed(this.destroyRef))
             .subscribe();
@@ -162,10 +193,12 @@ export class TaonDatatableComponent implements OnInit {
         this.searchValue = '';
         this.columnFilters = {};
         this.pageNumber = 1;
+        this.persistCurrentTableState();
         this.reload();
     }
     applyAdvancedFilters(): void {
         this.pageNumber = 1;
+        this.persistCurrentTableState();
         this.reload();
     }
     toggleAdvancedSearch(): void {
@@ -174,8 +207,147 @@ export class TaonDatatableComponent implements OnInit {
     getNextPage(event: PageEvent): void {
         this.pageNumber = event.pageIndex + 1;
         this.pageSize = event.pageSize;
+        this.persistPagination();
         this.reload();
     }
+    private get tableIdentity(): string {
+        const explicitId = this.tableId?.trim();
+        if (explicitId) {
+            return explicitId;
+        }
+        const routePath = this.route.pathFromRoot
+            .map(route => route.snapshot.url.map(segment => segment.path).join('/'))
+            .filter(Boolean)
+            .join('/');
+        const entityName = this.entity ? ClassHelpers__NS__getName(this.entity) : 'table';
+        return `${entityName}-${routePath || 'root'}`;
+    }
+    private get queryParamPrefix(): string {
+        return `dt.${encodeURIComponent(this.tableIdentity)}`;
+    }
+    private async restorePagination(): Promise<void> {
+        const prefix = this.queryParamPrefix;
+        if (this.storeTablePagination === 'query-params') {
+            const pageNumber = Number(this.route.snapshot.queryParamMap.get(`${prefix}.page`));
+            const pageSize = Number(this.route.snapshot.queryParamMap.get(`${prefix}.pageSize`));
+            if (Number.isSafeInteger(pageNumber) && pageNumber > 0) {
+                this.pageNumber = pageNumber;
+            }
+            if (Number.isSafeInteger(pageSize) && pageSize > 0) {
+                this.pageSize = pageSize;
+            }
+            return;
+        }
+        if (this.storeTablePagination !== 'local-storage' &&
+            this.storeTablePagination !== 'session-storage') {
+            return;
+        }
+        const options = {
+            keyOrPath: `datatable-${this.tableIdentity}-pagination`,
+            defaultValue: {
+                pageNumber: this.pageNumber,
+                pageSize: this.pageSize,
+            },
+        };
+        this.paginationStorage =
+            this.storeTablePagination === 'local-storage'
+                ? TaonStor__NS__inLocalstorage(options, TaonDatatableComponent)
+                : TaonStor__NS__inSessionStorage(options, TaonDatatableComponent);
+        try {
+            await this.paginationStorage.ready();
+            const state = this.paginationStorage();
+            if (Number.isSafeInteger(state.pageNumber) && state.pageNumber > 0) {
+                this.pageNumber = state.pageNumber;
+            }
+            if (Number.isSafeInteger(state.pageSize) && state.pageSize > 0) {
+                this.pageSize = state.pageSize;
+            }
+        }
+        catch (error) {
+            console.error('[taon-datatable] Unable to restore pagination state', error);
+        }
+    }
+    private persistPagination(): void {
+        const state = {
+            pageNumber: this.pageNumber,
+            pageSize: this.pageSize,
+        };
+        if (this.storeTablePagination === 'query-params') {
+            this.updateQueryParams({
+                [`${this.queryParamPrefix}.page`]: String(state.pageNumber),
+                [`${this.queryParamPrefix}.pageSize`]: String(state.pageSize),
+            });
+        }
+        else if (this.paginationStorage) {
+            void this.paginationStorage.set(state).catch(error => {
+                console.error('[taon-datatable] Unable to persist pagination state', error);
+            });
+        }
+    }
+    private readQueryFilters(): Record<string, string> {
+        const filterPrefix = `${this.queryParamPrefix}.filter.`;
+        const filters: Record<string, string> = {};
+        for (const key of this.route.snapshot.queryParamMap.keys) {
+            if (!key.startsWith(filterPrefix)) {
+                continue;
+            }
+            try {
+                const field = decodeURIComponent(key.slice(filterPrefix.length));
+                const value = this.route.snapshot.queryParamMap.get(key);
+                if (field && value !== null) {
+                    filters[field] = value;
+                }
+            }
+            catch (error) {
+                console.error('[taon-datatable] Invalid filter query parameter', error);
+            }
+        }
+        return filters;
+    }
+    private persistFilters(): void {
+        if (this.storeTableFilters !== 'query-params') {
+            return;
+        }
+        this.updateQueryParams(this.filterQueryUpdates());
+    }
+    private persistCurrentTableState(): void {
+        if (this.storeTablePagination === 'query-params' &&
+            this.storeTableFilters === 'query-params') {
+            this.updateQueryParams({
+                [`${this.queryParamPrefix}.page`]: String(this.pageNumber),
+                [`${this.queryParamPrefix}.pageSize`]: String(this.pageSize),
+                ...this.filterQueryUpdates(),
+            });
+            return;
+        }
+        this.persistPagination();
+        this.persistFilters();
+    }
+    private filterQueryUpdates(): Record<string, string | null> {
+        const filterPrefix = `${this.queryParamPrefix}.filter.`;
+        const updates: Record<string, string | null> = {};
+        for (const key of this.route.snapshot.queryParamMap.keys) {
+            if (key.startsWith(filterPrefix)) {
+                updates[key] = null;
+            }
+        }
+        for (const [field, value] of Object.entries(this.cleanFilters(this.columnFilters))) {
+            updates[`${filterPrefix}${encodeURIComponent(field)}`] = value;
+        }
+        return updates;
+    }
+    private updateQueryParams(queryParams: Record<string, string | null>): void {
+        void this.router
+            .navigate([], {
+            relativeTo: this.route,
+            queryParams,
+            queryParamsHandling: 'merge',
+            replaceUrl: true,
+        })
+            .catch(error => {
+            console.error('[taon-datatable] Unable to update table query parameters', error);
+        });
+    }
     sortChanged(event: any): void {
         const field = event?.active ?? event?.field;
         const direction = event?.direction ?? '';

package/ts-source/websql-code/build-info._auto-generated_.ts

@@ -15,4 +15,4 @@ export const APP_ID = 'com.domain.example.ui';
 export const BUILD_BASE_HREF = '';
 export const PROJECT_NPM_NAME = '@taon-dev/ui';
 export const CURRENT_PACKAGE_TAON_VERSION = 'v21';
-export const CURRENT_PACKAGE_VERSION = '21.0.26';
+export const CURRENT_PACKAGE_VERSION = '21.0.27';

package/ts-source/websql-code/index._auto-generated_.ts

@@ -14,6 +14,7 @@ export * from './build-info._auto-generated_';
 export * from './my-organization-proj';
 export * from './start-cli';
 export * from './directives/taon-horizontal-wheel-scrolling.directive';
+export * from './taon-admin-layout/taon-admin-content-footer.service';
 export * from './taon-admin-layout/taon-admin-layout.component';
 export * from './taon-admin-layout/taon-admin-layout.models';
 export * from './taon-admin-layout/taon-admin-menu-context';

package/ts-source/websql-code/taon-admin-layout/taon-admin-content-footer.service.ts

@@ -0,0 +1,20 @@
+// @ts-nocheck
+/* ============================================================================
+
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:watch:lib
+  inside @taon-dev/ui project repository
+  for watch development of third party modules like this.
+  
+ * ========================================================================== */
+
+import { Injectable, TemplateRef, signal } from '@angular/core';
+@Injectable({ providedIn: 'root' })
+export class TaonAdminContentFooterService {
+    readonly currentTemplate = signal<TemplateRef<unknown> | undefined>(undefined);
+    setTemplate(template?: TemplateRef<unknown>): void {
+        this.currentTemplate.set(template);
+    }
+}

package/ts-source/websql-code/taon-admin-layout/taon-admin-layout.component.html

@@ -228,7 +228,10 @@
       
 
       <footer class="admin-content-footer">
-        <ng-content select="[contentFooter]" />
+        <ng-container
+          [ngTemplateOutlet]="
+            taonAdminContentFooterService.currentTemplate()
+          " />
       </footer>
     </main>
   </div>

package/ts-source/websql-code/taon-admin-layout/taon-admin-layout.component.ts

@@ -19,6 +19,7 @@ import { NavigationEnd, Route, Router, RouterLink, RouterOutlet, Routes, } from
 import { Translation } from '@taon-dev/i18n/websql';
 import { filter, Subscription } from 'rxjs';
 import { Taon } from 'taon/websql';
+import { TaonAdminContentFooterService } from './taon-admin-content-footer.service';
 import { resolveTaonAdminMenuItem, TaonAdminRoute, } from './taon-admin-layout.models';
 import { TaonAdminMenuContext } from './taon-admin-menu-context';
 import { TaonAdminPageTabsComponent } from './taon-admin-page-tabs.component';
@@ -43,6 +44,7 @@ export class TaonAdminLayoutComponent implements OnInit, AfterViewInit, OnDestro
     protected readonly t = t.for(this);
     protected readonly menuContext = inject(TaonAdminMenuContext, { optional: true }) ??
         new TaonAdminMenuContext();
+    protected readonly taonAdminContentFooterService = inject(TaonAdminContentFooterService);
     private _routes: Routes = [];
     @Input({ required: true })
     set routes(routes: Routes) {

package/ts-source/websql-code/taon-datatable/i18n/taon-datatable.component.html.de-DE.i18n.data.ts

@@ -36,17 +36,17 @@ export default {
         },
         {
             "gettextString": "Clear",
-            "lineNumber": 101,
+            "lineNumber": 108,
             "translation": "Klar"
         },
         {
             "gettextString": "Apply filters",
-            "lineNumber": 111,
+            "lineNumber": 118,
             "translation": "Filter anwenden"
         },
         {
             "gettextString": "Loading...",
-            "lineNumber": 128,
+            "lineNumber": 135,
             "translation": "Lade..."
         }
     ]

package/ts-source/websql-code/taon-datatable/i18n/taon-datatable.component.html.de-DE.po

@@ -12,14 +12,14 @@ msgstr "Filter"
 msgid "Add"
 msgstr "Hinzufügen"
 
-#: src/lib/taon-datatable/taon-datatable.component.html:101
+#: src/lib/taon-datatable/taon-datatable.component.html:108
 msgid "Clear"
 msgstr "Klar"
 
-#: src/lib/taon-datatable/taon-datatable.component.html:111
+#: src/lib/taon-datatable/taon-datatable.component.html:118
 msgid "Apply filters"
 msgstr "Filter anwenden"
 
-#: src/lib/taon-datatable/taon-datatable.component.html:128
+#: src/lib/taon-datatable/taon-datatable.component.html:135
 msgid "Loading..."
 msgstr "Lade..."

package/ts-source/websql-code/taon-datatable/i18n/taon-datatable.component.html.en-US.i18n.data.ts

@@ -36,17 +36,17 @@ export default {
         },
         {
             "gettextString": "Clear",
-            "lineNumber": 101,
+            "lineNumber": 108,
             "translation": "Clear"
         },
         {
             "gettextString": "Apply filters",
-            "lineNumber": 111,
+            "lineNumber": 118,
             "translation": "Apply filters"
         },
         {
             "gettextString": "Loading...",
-            "lineNumber": 128,
+            "lineNumber": 135,
             "translation": "Loading..."
         }
     ]

package/ts-source/websql-code/taon-datatable/i18n/taon-datatable.component.html.en-US.po

@@ -12,14 +12,14 @@ msgstr "Filters"
 msgid "Add"
 msgstr "Add"
 
-#: src/lib/taon-datatable/taon-datatable.component.html:101
+#: src/lib/taon-datatable/taon-datatable.component.html:108
 msgid "Clear"
 msgstr "Clear"
 
-#: src/lib/taon-datatable/taon-datatable.component.html:111
+#: src/lib/taon-datatable/taon-datatable.component.html:118
 msgid "Apply filters"
 msgstr "Apply filters"
 
-#: src/lib/taon-datatable/taon-datatable.component.html:128
+#: src/lib/taon-datatable/taon-datatable.component.html:135
 msgid "Loading..."
 msgstr "Loading..."

package/ts-source/websql-code/taon-datatable/i18n/taon-datatable.component.html.pl-PL.i18n.data.ts

@@ -36,17 +36,17 @@ export default {
         },
         {
             "gettextString": "Clear",
-            "lineNumber": 101,
+            "lineNumber": 108,
             "translation": "Jasne"
         },
         {
             "gettextString": "Apply filters",
-            "lineNumber": 111,
+            "lineNumber": 118,
             "translation": "Wykorzystanie filtrów"
         },
         {
             "gettextString": "Loading...",
-            "lineNumber": 128,
+            "lineNumber": 135,
             "translation": "Ładowanie..."
         }
     ]

package/ts-source/websql-code/taon-datatable/i18n/taon-datatable.component.html.pl-PL.po

@@ -12,14 +12,14 @@ msgstr "Filtry"
 msgid "Add"
 msgstr "Dodać"
 
-#: src/lib/taon-datatable/taon-datatable.component.html:101
+#: src/lib/taon-datatable/taon-datatable.component.html:108
 msgid "Clear"
 msgstr "Jasne"
 
-#: src/lib/taon-datatable/taon-datatable.component.html:111
+#: src/lib/taon-datatable/taon-datatable.component.html:118
 msgid "Apply filters"
 msgstr "Wykorzystanie filtrów"
 
-#: src/lib/taon-datatable/taon-datatable.component.html:128
+#: src/lib/taon-datatable/taon-datatable.component.html:135
 msgid "Loading..."
 msgstr "Ładowanie..."

package/ts-source/websql-code/taon-datatable/i18n/taon-datatable.component.ts.de-DE.i18n.data.ts

@@ -24,17 +24,17 @@ export default {
     "tags": [
         {
             "gettextString": "ID",
-            "lineNumber": 59,
+            "lineNumber": 61,
             "translation": "Ausweis"
         },
         {
             "gettextString": "NAME",
-            "lineNumber": 63,
+            "lineNumber": 65,
             "translation": "Name"
         },
         {
             "gettextString": "No records found",
-            "lineNumber": 110
+            "lineNumber": 135
         }
     ]
 };

package/ts-source/websql-code/taon-datatable/i18n/taon-datatable.component.ts.de-DE.po

@@ -4,14 +4,14 @@ msgstr ""
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 
-#: src/lib/taon-datatable/taon-datatable.component.ts:59
+#: src/lib/taon-datatable/taon-datatable.component.ts:61
 msgid "ID"
 msgstr "Ausweis"
 
-#: src/lib/taon-datatable/taon-datatable.component.ts:63
+#: src/lib/taon-datatable/taon-datatable.component.ts:65
 msgid "NAME"
 msgstr "Name"
 
-#: src/lib/taon-datatable/taon-datatable.component.ts:110
+#: src/lib/taon-datatable/taon-datatable.component.ts:135
 msgid "No records found"
 msgstr ""

package/ts-source/websql-code/taon-datatable/i18n/taon-datatable.component.ts.en-US.i18n.data.ts

@@ -24,17 +24,17 @@ export default {
     "tags": [
         {
             "gettextString": "ID",
-            "lineNumber": 59,
+            "lineNumber": 61,
             "translation": "ID"
         },
         {
             "gettextString": "NAME",
-            "lineNumber": 63,
+            "lineNumber": 65,
             "translation": "NAME"
         },
         {
             "gettextString": "No records found",
-            "lineNumber": 110
+            "lineNumber": 135
         }
     ]
 };

package/ts-source/websql-code/taon-datatable/i18n/taon-datatable.component.ts.en-US.po

@@ -4,14 +4,14 @@ msgstr ""
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 
-#: src/lib/taon-datatable/taon-datatable.component.ts:59
+#: src/lib/taon-datatable/taon-datatable.component.ts:61
 msgid "ID"
 msgstr "ID"
 
-#: src/lib/taon-datatable/taon-datatable.component.ts:63
+#: src/lib/taon-datatable/taon-datatable.component.ts:65
 msgid "NAME"
 msgstr "NAME"
 
-#: src/lib/taon-datatable/taon-datatable.component.ts:110
+#: src/lib/taon-datatable/taon-datatable.component.ts:135
 msgid "No records found"
 msgstr ""

package/ts-source/websql-code/taon-datatable/i18n/taon-datatable.component.ts.pl-PL.i18n.data.ts

@@ -24,17 +24,17 @@ export default {
     "tags": [
         {
             "gettextString": "ID",
-            "lineNumber": 59,
+            "lineNumber": 61,
             "translation": "Posiadanie dowodu"
         },
         {
             "gettextString": "NAME",
-            "lineNumber": 63,
+            "lineNumber": 65,
             "translation": "Nazwa"
         },
         {
             "gettextString": "No records found",
-            "lineNumber": 110,
+            "lineNumber": 135,
             "translation": "Nie znalezionie nic"
         }
     ]

package/ts-source/websql-code/taon-datatable/i18n/taon-datatable.component.ts.pl-PL.po

@@ -4,14 +4,14 @@ msgstr ""
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 
-#: src/lib/taon-datatable/taon-datatable.component.ts:59
+#: src/lib/taon-datatable/taon-datatable.component.ts:61
 msgid "ID"
 msgstr "Posiadanie dowodu"
 
-#: src/lib/taon-datatable/taon-datatable.component.ts:63
+#: src/lib/taon-datatable/taon-datatable.component.ts:65
 msgid "NAME"
 msgstr "Nazwa"
 
-#: src/lib/taon-datatable/taon-datatable.component.ts:110
+#: src/lib/taon-datatable/taon-datatable.component.ts:135
 msgid "No records found"
 msgstr "Nie znalezionie nic"

package/ts-source/websql-code/taon-datatable/taon-datatable.component.html

@@ -87,20 +87,27 @@
   @if (!hideSearch && searchMode === 'advanced' && advancedSearchOpened) {
     <div
       class="grid grid-cols-1 gap-3 rounded-lg border border-gray-200 bg-gray-50 p-4 shadow-sm dark:border-gray-700 dark:bg-gray-800 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
-      @for (column of filterableColumns; track column.field) {
-        <mat-form-field
-          appearance="outline"
-          subscriptSizing="dynamic"
-          class="w-full">
-          <mat-label>
-            {{ column.header }}
-          </mat-label>
-
-          <input
-            matInput
-            [(ngModel)]="columnFilters[$any(column.field)]"
-            (keyup.enter)="applyAdvancedFilters()" />
-        </mat-form-field>
+      @if (filtersTemplate) {
+        <ng-container
+          [ngTemplateOutlet]="filtersTemplate"
+          [ngTemplateOutletContext]="{ filters: columnFilters }">
+        </ng-container>
+      } @else {
+        @for (column of filterableColumns; track column.field) {
+          <mat-form-field
+            appearance="outline"
+            subscriptSizing="dynamic"
+            class="w-full">
+            <mat-label>
+              {{ column.header }}
+            </mat-label>
+
+            <input
+              matInput
+              [(ngModel)]="columnFilters[$any(column.field)]"
+              (keyup.enter)="applyAdvancedFilters()" />
+          </mat-form-field>
+        }
       }
 
       <div