@ngrdt/table 0.0.66

package/fesm2022/ngrdt-table.mjs

@@ -0,0 +1,1100 @@
+import * as i0 from '@angular/core';
+import { computed, untracked, input, Directive, ViewEncapsulation, ChangeDetectionStrategy, Component, inject, linkedSignal, booleanAttribute, signal, output, Injector, ChangeDetectorRef, Renderer2, afterRenderEffect, ElementRef, ViewChildren, ViewChild, effect, CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
+import { RdtRouterService } from '@ngrdt/router';
+import { signalStore, withState, withHooks, withComputed, withMethods, patchState } from '@ngrx/signals';
+import { withEntities, setAllEntities } from '@ngrx/signals/entities';
+import * as i1$1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i1 from '@angular/forms';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import * as i3 from '@angular/cdk/table';
+import { CdkTableModule } from '@angular/cdk/table';
+import * as i4 from '@ngrdt/forms';
+import { RdtCheckboxOutletDirective } from '@ngrdt/forms';
+import * as i2 from '@ngrdt/icon';
+import { RdtIconRegistryService, RdtIcon, RdtIconOutletDirective } from '@ngrdt/icon';
+import { RdtDateUtils, RdtObjectUtils } from '@ngrdt/utils';
+import { of, delay, combineLatest, map } from 'rxjs';
+import { toObservable } from '@angular/core/rxjs-interop';
+import { GovDesignSystemModule } from '@gov-design-system-ce/angular';
+
+const RDT_TABLE_PAGE_SIZE_OPTIONS = [20, 50, 100];
+const RDT_TABLE_DEFAULT_PAGE_SIZE = RDT_TABLE_PAGE_SIZE_OPTIONS[0];
+const RDT_TABLE_DEFAULT_NOT_FOUND_HEADER = 'Nic nenalezeno';
+const RDT_TABLE_DEFAULT_NOT_FOUND_MESSAGE = 'Nepodařilo se dohledat žádné výsledky, zkuste prosím hledaný výraz upravit.';
+const RDT_TABLE_DEFAULT_ERROR_MESSAGE = 'Při načítání dat došlo k chybě.';
+const RDT_TABLE_DEFAULT_ERROR_HEADER = 'Chyba';
+
+function isRdtTableMessage(obj) {
+    return (obj && typeof obj.header === 'string' && typeof obj.message === 'string');
+}
+
+const rdtTableInitialState = {
+    ready: false,
+    pageIndex: 0,
+    pageSize: RDT_TABLE_DEFAULT_PAGE_SIZE,
+    pageSizeOptions: RDT_TABLE_PAGE_SIZE_OPTIONS,
+    totalCount: 0,
+    selectedIds: {},
+    loading: true,
+    totalCountKnown: true,
+    displayedColumns: [],
+    datasource: null,
+    headerFilters: [],
+    staticFilters: [],
+    extendedFilter: null,
+    sort: null,
+    selectId: (item) => ('id' in item ? item.id : JSON.stringify(item)),
+    _fetchWhenDatasourceSet: false,
+    fetchError: null,
+    _fetchSubscription: null,
+};
+
+function getRdtTableStore(initialState = rdtTableInitialState) {
+    return signalStore(withState(initialState), withEntities(), withHooks({
+        onDestroy(store) {
+            store._fetchSubscription?.()?.unsubscribe();
+        },
+    }), withComputed((state) => ({
+        allFilters: computed(() => [
+            ...state.headerFilters(),
+            ...state.staticFilters(),
+            state.extendedFilter(),
+        ]),
+        pageCount: computed(() => {
+            const totalCount = state.totalCount();
+            const pageSize = state.pageSize();
+            return totalCount ? Math.ceil(totalCount / pageSize) : 0;
+        }),
+        selectedItems: computed(() => {
+            const selection = state.selectedIds();
+            const selectId = state.selectId();
+            if (!selection || !Object.keys(selection).length) {
+                return [];
+            }
+            return state.entities().filter((item) => selection[selectId(item)]);
+        }),
+        selectedAll: computed(() => {
+            const selection = state.selectedIds();
+            const items = state.entities();
+            if (!selection || !Object.keys(selection).length) {
+                return false;
+            }
+            return (items.length > 0 && items.length === Object.keys(selection).length);
+        }),
+        requestParams: computed(() => ({
+            filters: [...state.headerFilters(), ...state.staticFilters()],
+            extendedFilter: state.extendedFilter() ?? null,
+            sort: state.sort?.() ?? null,
+            pageIndex: state.pageIndex(),
+            pageSize: state.pageSize(),
+        })),
+        firstRowIndex: computed(() => {
+            const pageIndex = state.pageIndex();
+            const pageSize = state.pageSize();
+            return pageIndex * pageSize;
+        }),
+        lastRowIndex: computed(() => {
+            const startIndex = state.pageIndex() * state.pageSize();
+            const pageSize = state.pageSize();
+            return Math.min(startIndex + pageSize, state.totalCount()) - 1;
+        }),
+    })), withMethods((store) => ({
+        fetch() {
+            const datasource = untracked(store.datasource);
+            if (!datasource) {
+                patchState(store, { _fetchWhenDatasourceSet: true });
+                return;
+            }
+            untracked(store._fetchSubscription)?.unsubscribe();
+            const requestParams = untracked(store.requestParams);
+            const observer = this._getFetchObserver(requestParams);
+            patchState(store, { loading: true });
+            const sub = datasource.getData(requestParams).subscribe(observer);
+            patchState(store, { _fetchSubscription: sub });
+        },
+        _getFetchObserver(requestParams) {
+            return {
+                next: (page) => this._onFetchSuccess(page, requestParams),
+                error: (error) => this._onFetchError(error),
+                complete: () => this._onFetchComplete(),
+            };
+        },
+        _onFetchSuccess(page, requestParams) {
+            const selectId = untracked(store.selectId);
+            patchState(store, {
+                totalCount: page.totalCount ??
+                    Math.max(untracked(store.totalCount), page.pageIndex * requestParams.pageSize + page.data.length),
+                pageIndex: page.pageIndex,
+                totalCountKnown: page.totalCount !== null ||
+                    page.data.length < requestParams.pageSize,
+                loading: false,
+                _fetchSubscription: null,
+                fetchError: null,
+            });
+            patchState(store, setAllEntities(page.data, { selectId: selectId }));
+        },
+        _onFetchError(error) {
+            const selectId = untracked(store.selectId);
+            patchState(store, {
+                loading: false,
+                fetchError: getRdtTableError(error),
+                totalCount: 0,
+                totalCountKnown: true,
+                pageIndex: 0,
+                _fetchSubscription: null,
+            });
+            patchState(store, setAllEntities([], { selectId: selectId }));
+        },
+        _onFetchComplete() {
+            patchState(store, {
+                _fetchSubscription: null,
+                loading: false,
+            });
+        },
+        setPagination(pageSize, pageIndex) {
+            patchState(store, { pageSize, pageIndex });
+            this.unselectAll();
+        },
+        setSort(sort) {
+            patchState(store, {
+                sort,
+            });
+            this.unselectAll();
+        },
+        setHeaderFilters(filters) {
+            patchState(store, {
+                headerFilters: filters,
+            });
+            this.resetTotalCountKnown();
+            this.unselectAll();
+        },
+        setStaticFilters(filters) {
+            patchState(store, {
+                staticFilters: filters,
+            });
+            this.unselectAll();
+            this.resetTotalCountKnown();
+        },
+        setExtendedFilter(filters) {
+            patchState(store, {
+                extendedFilter: filters,
+            });
+            this.unselectAll();
+            this.resetTotalCountKnown();
+        },
+        setReady() {
+            const _fetchWhenDatasourceSet = untracked(store._fetchWhenDatasourceSet);
+            if (untracked(store.datasource) && _fetchWhenDatasourceSet) {
+                patchState(store, { ready: true, _fetchWhenDatasourceSet: false });
+                this.fetch();
+            }
+            else {
+                patchState(store, { ready: true });
+            }
+        },
+        setDatasource(datasource) {
+            untracked(store._fetchSubscription)?.unsubscribe();
+            const _fetchWhenDatasourceSet = untracked(store._fetchWhenDatasourceSet);
+            patchState(store, {
+                datasource,
+                _fetchSubscription: null,
+                fetchError: null,
+                totalCountKnown: datasource.totalCountKnown,
+            });
+            if (untracked(store.ready) && _fetchWhenDatasourceSet) {
+                patchState(store, { _fetchWhenDatasourceSet: false });
+                this.fetch();
+            }
+        },
+        selectAll() {
+            const items = untracked(store.entities);
+            const selectedIds = {};
+            items.forEach((item) => {
+                selectedIds[untracked(store.selectId)(item)] = true;
+            });
+            patchState(store, { selectedIds });
+        },
+        unselectAll() {
+            patchState(store, {
+                selectedIds: {},
+            });
+        },
+        toggleSelectAll() {
+            if (untracked(store.selectedAll)) {
+                this.unselectAll();
+            }
+            else {
+                this.selectAll();
+            }
+        },
+        resetTotalCountKnown() {
+            patchState(store, {
+                totalCountKnown: untracked(store.datasource)?.totalCountKnown ?? true,
+            });
+        },
+        toggleSelectItem(item) {
+            const selectId = untracked(store.selectId);
+            const oldIds = untracked(store.selectedIds);
+            const id = selectId(item);
+            const selectedIds = { ...oldIds, [id]: !oldIds[id] };
+            patchState(store, { selectedIds });
+        },
+        toggleSelectSingleItem(item) {
+            const selectId = untracked(store.selectId);
+            const oldIds = untracked(store.selectedIds);
+            const id = selectId(item);
+            if (oldIds[id]) {
+                patchState(store, { selectedIds: {} });
+            }
+            else {
+                patchState(store, { selectedIds: { [id]: true } });
+            }
+        },
+        cancelFetch() {
+            untracked(store._fetchSubscription)?.unsubscribe();
+            patchState(store, {
+                _fetchSubscription: null,
+                loading: false,
+                fetchError: null,
+            });
+        },
+        isSelected(item) {
+            const selectId = untracked(store.selectId);
+            return !!untracked(store.selectedIds)[selectId(item)];
+        },
+        getSortDirection(column) {
+            const currentSort = store.sort();
+            if (currentSort?.key === column.sortKey) {
+                return currentSort.direction;
+            }
+            return null;
+        },
+        resetHeaderFilters() {
+            this.setHeaderFilters([]);
+        },
+        toggleSort(column) {
+            const currentSort = untracked(store.sort);
+            const sortKey = column.sortKey ?? column.key;
+            let direction = 'asc';
+            if (currentSort?.key === sortKey) {
+                switch (currentSort.direction) {
+                    case 'asc':
+                        direction = 'desc';
+                        break;
+                    case 'desc':
+                        this.setSort(null);
+                        this.fetch();
+                        return;
+                }
+            }
+            else {
+                direction = 'asc';
+            }
+            const sort = {
+                key: column.key,
+                direction,
+                type: column.cellRendererParams?.dataType ?? 'string',
+            };
+            this.setSort(sort);
+            this.fetch();
+        },
+        setDisplayedColumns(displayedColumns) {
+            patchState(store, { displayedColumns });
+        },
+    })));
+}
+const RdtTableStore = getRdtTableStore();
+function getRdtTableError(error) {
+    if (isRdtTableMessage(error)) {
+        return error;
+    }
+    if (typeof error === 'string') {
+        return { message: error, header: RDT_TABLE_DEFAULT_ERROR_HEADER };
+    }
+    if (error && typeof error === 'object' && 'message' in error) {
+        return { message: error.message, header: RDT_TABLE_DEFAULT_ERROR_HEADER };
+    }
+    return {
+        header: RDT_TABLE_DEFAULT_ERROR_HEADER,
+        message: RDT_TABLE_DEFAULT_ERROR_MESSAGE,
+    };
+}
+
+function selectIdTransform(value) {
+    if (typeof value === 'function') {
+        return value;
+    }
+    return (item) => item[value];
+}
+
+/* import humanizeString from 'humanize-string'; */
+class RdtBaseColumnBuilder {
+    _key;
+    _header;
+    _sortable = false;
+    _sortKey;
+    _cellClass = '';
+    _cellStyle = '';
+    _headerStyle = '';
+    _headerClass = '';
+    _minWidth;
+    _maxWidth;
+    _interactive = () => false;
+    _sticky;
+    constructor(key) {
+        this._key = key;
+    }
+    withSticky(sticky = 'end') {
+        this._sticky = sticky;
+        return this;
+    }
+    withHeader(header) {
+        this._header = header;
+        return this;
+    }
+    withSortable(sortable = true) {
+        this._sortable = sortable;
+        return this;
+    }
+    withSortKey(sortKey) {
+        this._sortKey = sortKey;
+        return this;
+    }
+    withCellClass(cellClass) {
+        this._cellClass = cellClass;
+        return this;
+    }
+    withCellStyle(cellStyle) {
+        this._cellStyle = cellStyle;
+        return this;
+    }
+    withHeaderStyle(headerStyle) {
+        this._headerStyle = headerStyle;
+        return this;
+    }
+    withHeaderClass(headerClass) {
+        this._headerClass = headerClass;
+        return this;
+    }
+    withMinWidth(minWidth) {
+        this._minWidth = typeof minWidth === 'string' ? minWidth : `${minWidth}px`;
+        return this;
+    }
+    withMaxWidth(maxWidth) {
+        this._maxWidth = typeof maxWidth === 'string' ? maxWidth : `${maxWidth}px`;
+        return this;
+    }
+    withInteractive(interactive = true) {
+        this._interactive =
+            typeof interactive === 'function' ? interactive : () => interactive;
+        return this;
+    }
+    getCellClassFn() {
+        const cellClass = this._cellClass;
+        return typeof cellClass === 'function' ? cellClass : () => cellClass;
+    }
+    getCellStyleFn() {
+        const cellStyle = this._cellStyle;
+        return typeof cellStyle === 'function' ? cellStyle : () => cellStyle;
+    }
+    getSortKey() {
+        return this._sortKey ?? this._key;
+    }
+    getHeader() {
+        return this._header ?? this._key; /* ?? humanizeString(this._key); */
+    }
+    build() {
+        return {
+            key: this._key,
+            header: this.getHeader(),
+            sortable: this._sortable,
+            sortKey: this.getSortKey(),
+            cellClass: this.getCellClassFn(),
+            cellStyle: this.getCellStyleFn(),
+            headerStyle: this._headerStyle,
+            headerClass: this._headerClass,
+            cellRenderer: this.getCellRenderer(),
+            cellRendererParams: this.getCellRendererParams(),
+            interactive: this._interactive,
+            minWidth: this._minWidth,
+            maxWidth: this._maxWidth,
+            sticky: this._sticky,
+        };
+    }
+}
+
+class RdtBaseCellRendererComponent {
+    row = input.required();
+    index = input.required();
+    store = input.required();
+    cellRendererParams = input.required();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtBaseCellRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.0", type: RdtBaseCellRendererComponent, isStandalone: true, selector: "rdt-base-cell-renderer", inputs: { row: { classPropertyName: "row", publicName: "row", isSignal: true, isRequired: true, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: true, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: true, transformFunction: null }, cellRendererParams: { classPropertyName: "cellRendererParams", publicName: "cellRendererParams", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtBaseCellRendererComponent, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'rdt-base-cell-renderer',
+                }]
+        }] });
+
+class RdtStaticCellRendererComponent extends RdtBaseCellRendererComponent {
+    value = computed(() => this.cellRendererParams().valueFormatter(this.row()));
+    tooltip = computed(() => this.cellRendererParams().tooltipFormatter(this.row()));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtStaticCellRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.0", type: RdtStaticCellRendererComponent, isStandalone: false, selector: "rdt-static-cell-renderer", host: { classAttribute: "cell-value-base" }, usesInheritance: true, ngImport: i0, template: "@let val = value();\n{{ val }}\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtStaticCellRendererComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rdt-static-cell-renderer', host: {
+                        class: 'cell-value-base',
+                    }, standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "@let val = value();\n{{ val }}\n" }]
+        }] });
+
+class RdtStaticColumnBuilder extends RdtBaseColumnBuilder {
+    _dataType = 'string';
+    _valueFormatter;
+    _tooltipFormatter;
+    _enumValues;
+    _tooltipEnabled = true;
+    constructor(key) {
+        super(key);
+    }
+    withDataType(dataType) {
+        this._dataType = dataType;
+        return this;
+    }
+    withValueFormatter(formatter) {
+        this._valueFormatter = formatter;
+        return this;
+    }
+    withTooltipFormatter(formatter) {
+        this._tooltipFormatter = formatter;
+        return this;
+    }
+    withTooltipEnabled(enabled) {
+        this._tooltipEnabled = enabled;
+        return this;
+    }
+    withEnumValues(enumValues) {
+        this._enumValues = enumValues;
+        return this;
+    }
+    getCellRenderer() {
+        return RdtStaticCellRendererComponent;
+    }
+    formatNumber(value) {
+        let numericValue;
+        if (typeof value === 'number') {
+            numericValue = value;
+        }
+        else if (value == null) {
+            return '';
+        }
+        else if (typeof value === 'string') {
+            numericValue = Number(value);
+            if (isNaN(numericValue)) {
+                return value;
+            }
+        }
+        else {
+            return '';
+        }
+        return numericValue.toFixed(2).replace(/\.0+$/, '');
+    }
+    formatDecimal(value) {
+        if (typeof value === 'number') {
+            return value.toFixed(2);
+        }
+        else if (typeof value === 'string') {
+            const num = parseFloat(value);
+            return isNaN(num) ? value : num.toFixed(2);
+        }
+        return '';
+    }
+    formatDate(value) {
+        return RdtDateUtils.formatDate(value);
+    }
+    formatDateTime(date) {
+        if (date === null || date === undefined || date === '') {
+            return '';
+        }
+        const d = date instanceof Date ? date : new Date(date);
+        if (RdtDateUtils.isValidDate(d)) {
+            const year = d.getFullYear();
+            const month = `${d.getMonth() + 1}`.padStart(2, '0');
+            const day = `${d.getDate()}`.padStart(2, '0');
+            const hour = `${d.getHours()}`.padStart(2, '0');
+            const minute = `${d.getMinutes()}`.padStart(2, '0');
+            return `${day}.${month}.${year} ${hour}:${minute}`;
+        }
+        else {
+            return '';
+        }
+    }
+    formatBoolean(value) {
+        switch (value) {
+            case true:
+            case 'true':
+            case 1:
+            case '1':
+                return 'Ano';
+            case false:
+            case 'false':
+            case 0:
+            case '0':
+                return 'Ne';
+            default:
+                return '';
+        }
+    }
+    formatEnum(value) {
+        if (!this._enumValues) {
+            throw new Error('Enum values are not set');
+        }
+        return this._enumValues[value] || value;
+    }
+    getValueFormatter() {
+        if (this._valueFormatter) {
+            return this._valueFormatter;
+        }
+        switch (this._dataType) {
+            case 'boolean':
+                return (row) => this.formatBoolean(this.pluck(row, this._key));
+            case 'date':
+                return (row) => this.formatDate(this.pluck(row, this._key));
+            case 'date-time':
+                return (row) => this.formatDateTime(this.pluck(row, this._key));
+            case 'decimal':
+                return (row) => this.formatDecimal(this.pluck(row, this._key));
+            case 'enum':
+                return (row) => this.formatEnum(this.pluck(row, this._key));
+            case 'number':
+                return (row) => this.formatNumber(this.pluck(row, this._key));
+            default:
+                return (row) => this.pluck(row, this._key);
+        }
+    }
+    pluck(row, key) {
+        if (key in row) {
+            return row[key];
+        }
+        else {
+            return RdtObjectUtils.pluck(row, key);
+        }
+    }
+    getTooltipFormatter() {
+        return this._tooltipFormatter ?? this.getValueFormatter();
+    }
+    getCellRendererParams() {
+        return {
+            dataType: this._dataType,
+            valueFormatter: this.getValueFormatter(),
+            tooltipEnabled: this._tooltipEnabled,
+            tooltipFormatter: this.getTooltipFormatter(),
+        };
+    }
+}
+
+class RdtTableDatasource {
+    totalCountKnown = true;
+}
+
+class RdtTablePaginatorComponent {
+    store = inject(RdtTableStore);
+    iconRegistry = inject(RdtIconRegistryService);
+    from = computed(() => this.store.totalCount() > 0 ? this.store.firstRowIndex() + 1 : 0);
+    to = computed(() => this.store.lastRowIndex() + 1);
+    total = computed(() => this.store.totalCount());
+    pageSize = computed(() => this.store.pageSize());
+    currentPageNumber = computed(() => this.store.pageIndex() + 1);
+    pageSizeOptions = computed(() => this.store.pageSizeOptions().map((opt) => ({ label: `${opt}`, value: opt })));
+    pageCount = computed(() => this.store.pageCount());
+    skipRightIcon = this.iconRegistry.getIcon(RdtIcon.SkipRight);
+    skipDoubleRightIcon = this.iconRegistry.getIcon(RdtIcon.SkipDoubleRight);
+    skipLeftIcon = this.iconRegistry.getIcon(RdtIcon.SkipLeft);
+    skipDoubleLeftIcon = this.iconRegistry.getIcon(RdtIcon.SkipDoubleLeft);
+    pageWindow = computed(() => {
+        const pageCount = this.pageCount();
+        const current = this.currentPageNumber();
+        const windowSize = 2;
+        const start = Math.max(1, current - windowSize);
+        const end = Math.min(pageCount, current + windowSize);
+        const pages = [];
+        for (let i = start; i <= end; i++) {
+            pages.push(i);
+        }
+        return pages;
+    });
+    onPageSizeChange(event) {
+        const value = event.target.value;
+        const pageSize = parseInt(value);
+        this.store.setPagination(pageSize ?? 10, 0);
+        this.store.fetch();
+    }
+    onPageChange(pageNumber) {
+        const pageIndex = pageNumber - 1;
+        this.store.setPagination(this.pageSize(), pageIndex);
+        this.store.fetch();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtTablePaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: RdtTablePaginatorComponent, isStandalone: false, selector: "rdt-table-paginator", ngImport: i0, template: "@if (store.ready()) {\n<div\n  class=\"flex flex-row-reverse flex-wrap-reverse justify-between items-center gap-2\"\n  [class.invisible]=\"total() === 0\"\n>\n  <div class=\"paginator\">\n    <div class=\"paginator-info\">\n      Zobrazeno <b>{{ from() }} - {{ to() }} z\u00E1znam\u016F z {{ total() }}</b>\n    </div>\n    <div class=\"paginator-controls\">\n      <select\n        class=\"action-btn\"\n        [value]=\"pageSize()\"\n        (change)=\"onPageSizeChange($event)\"\n      >\n        @for (option of pageSizeOptions(); track $index) {\n        <option [value]=\"option.value\">{{ option.value }}</option>\n        }\n      </select>\n      <button\n        class=\"action-btn\"\n        [disabled]=\"currentPageNumber() === 1\"\n        (click)=\"onPageChange(1)\"\n      >\n        <ng-container\n          rdtIconOutlet\n          [inputs]=\"{ name: skipDoubleLeftIcon }\"\n        ></ng-container>\n        <!--         \u2039\u2039 -->\n      </button>\n      <button\n        class=\"action-btn\"\n        [disabled]=\"currentPageNumber() === 1\"\n        (click)=\"onPageChange(currentPageNumber() - 1)\"\n      >\n        <ng-container\n          rdtIconOutlet\n          [inputs]=\"{ name: skipLeftIcon }\"\n        ></ng-container>\n        <!--     \u2039 -->\n      </button>\n      @for (page of pageWindow(); track $index) {\n      <button\n        class=\"action-btn\"\n        [class.selected]=\"currentPageNumber() === page\"\n        [disabled]=\"currentPageNumber() === page\"\n        (click)=\"onPageChange(page)\"\n      >\n        {{ page }}\n      </button>\n      }\n      <button\n        class=\"action-btn\"\n        [disabled]=\"currentPageNumber() === pageCount()\"\n        (click)=\"onPageChange(currentPageNumber() + 1)\"\n      >\n        <ng-container\n          rdtIconOutlet\n          [inputs]=\"{ name: skipRightIcon }\"\n        ></ng-container>\n        <!--   \u203A -->\n      </button>\n      <button\n        class=\"action-btn\"\n        [disabled]=\"currentPageNumber() === pageCount()\"\n        (click)=\"onPageChange(pageCount())\"\n      >\n        <ng-container\n          rdtIconOutlet\n          [inputs]=\"{ name: skipDoubleRightIcon }\"\n        ></ng-container>\n        <!--     \u203A\u203A -->\n      </button>\n    </div>\n  </div>\n</div>\n}\n", styles: [".paginator{display:flex;flex-wrap:wrap;justify-content:space-between;margin:1rem 1rem 0}.paginator-controls{display:flex;gap:.3rem}.paginator-controls select{margin-right:10px}\n"], dependencies: [{ kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.RdtIconOutletDirective, selector: "[rdtIconOutlet]", exportAs: ["rdtIconOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtTablePaginatorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rdt-table-paginator', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, encapsulation: ViewEncapsulation.None, template: "@if (store.ready()) {\n<div\n  class=\"flex flex-row-reverse flex-wrap-reverse justify-between items-center gap-2\"\n  [class.invisible]=\"total() === 0\"\n>\n  <div class=\"paginator\">\n    <div class=\"paginator-info\">\n      Zobrazeno <b>{{ from() }} - {{ to() }} z\u00E1znam\u016F z {{ total() }}</b>\n    </div>\n    <div class=\"paginator-controls\">\n      <select\n        class=\"action-btn\"\n        [value]=\"pageSize()\"\n        (change)=\"onPageSizeChange($event)\"\n      >\n        @for (option of pageSizeOptions(); track $index) {\n        <option [value]=\"option.value\">{{ option.value }}</option>\n        }\n      </select>\n      <button\n        class=\"action-btn\"\n        [disabled]=\"currentPageNumber() === 1\"\n        (click)=\"onPageChange(1)\"\n      >\n        <ng-container\n          rdtIconOutlet\n          [inputs]=\"{ name: skipDoubleLeftIcon }\"\n        ></ng-container>\n        <!--         \u2039\u2039 -->\n      </button>\n      <button\n        class=\"action-btn\"\n        [disabled]=\"currentPageNumber() === 1\"\n        (click)=\"onPageChange(currentPageNumber() - 1)\"\n      >\n        <ng-container\n          rdtIconOutlet\n          [inputs]=\"{ name: skipLeftIcon }\"\n        ></ng-container>\n        <!--     \u2039 -->\n      </button>\n      @for (page of pageWindow(); track $index) {\n      <button\n        class=\"action-btn\"\n        [class.selected]=\"currentPageNumber() === page\"\n        [disabled]=\"currentPageNumber() === page\"\n        (click)=\"onPageChange(page)\"\n      >\n        {{ page }}\n      </button>\n      }\n      <button\n        class=\"action-btn\"\n        [disabled]=\"currentPageNumber() === pageCount()\"\n        (click)=\"onPageChange(currentPageNumber() + 1)\"\n      >\n        <ng-container\n          rdtIconOutlet\n          [inputs]=\"{ name: skipRightIcon }\"\n        ></ng-container>\n        <!--   \u203A -->\n      </button>\n      <button\n        class=\"action-btn\"\n        [disabled]=\"currentPageNumber() === pageCount()\"\n        (click)=\"onPageChange(pageCount())\"\n      >\n        <ng-container\n          rdtIconOutlet\n          [inputs]=\"{ name: skipDoubleRightIcon }\"\n        ></ng-container>\n        <!--     \u203A\u203A -->\n      </button>\n    </div>\n  </div>\n</div>\n}\n", styles: [".paginator{display:flex;flex-wrap:wrap;justify-content:space-between;margin:1rem 1rem 0}.paginator-controls{display:flex;gap:.3rem}.paginator-controls select{margin-right:10px}\n"] }]
+        }] });
+
+class RdtHeaderCellRendererComponent {
+    iconRegistry = inject(RdtIconRegistryService);
+    store = inject(RdtTableStore);
+    column = input.required();
+    sortDirection = computed(() => this.store.getSortDirection(this.column()));
+    sortAscIcon = this.iconRegistry.getIcon(RdtIcon.SortAsc);
+    sortDescIcon = this.iconRegistry.getIcon(RdtIcon.SortDesc);
+    sortEnabledIcon = this.iconRegistry.getIcon(RdtIcon.SortEnabled);
+    sort(event) {
+        if (this.column().sortable) {
+            event.stopPropagation();
+            this.store.toggleSort(this.column());
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtHeaderCellRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: RdtHeaderCellRendererComponent, isStandalone: false, selector: "rdt-header-cell-renderer", inputs: { column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class.sortable-header-cell": "column().sortable" } }, ngImport: i0, template: "@let col = column();\n<div class=\"space-between\">\n  <div class=\"table-header\">\n    <span\n      (click)=\"sort($event)\"\n      (keyup.enter)=\"sort($event)\"\n      class=\"header-cell-text\"\n      [attr.tabindex]=\"col.sortable ? 0 : -1\"\n      [attr.role]=\"col.sortable ? 'button' : 'presentation'\"\n    >\n      {{ col.header }}\n    </span>\n  </div>\n  @if (col.sortable) { @let direction = sortDirection(); @if (direction ===\n  'asc') {\n  <button class=\"action-btn\" (click)=\"sort($event)\">\n    <ng-container rdtIconOutlet [inputs]=\"{ name: sortAscIcon }\"></ng-container>\n  </button>\n  } @else if (direction === 'desc') {\n  <button class=\"action-btn\" (click)=\"sort($event)\">\n    <ng-container\n      rdtIconOutlet\n      [inputs]=\"{ name: sortDescIcon }\"\n    ></ng-container>\n  </button>\n  } @else {\n  <button class=\"action-btn\" (click)=\"sort($event)\">\n    <ng-container\n      rdtIconOutlet\n      [inputs]=\"{ name: sortEnabledIcon }\"\n    ></ng-container>\n  </button>\n  }}\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.RdtIconOutletDirective, selector: "[rdtIconOutlet]", exportAs: ["rdtIconOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtHeaderCellRendererComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rdt-header-cell-renderer', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[class.sortable-header-cell]': 'column().sortable',
+                    }, template: "@let col = column();\n<div class=\"space-between\">\n  <div class=\"table-header\">\n    <span\n      (click)=\"sort($event)\"\n      (keyup.enter)=\"sort($event)\"\n      class=\"header-cell-text\"\n      [attr.tabindex]=\"col.sortable ? 0 : -1\"\n      [attr.role]=\"col.sortable ? 'button' : 'presentation'\"\n    >\n      {{ col.header }}\n    </span>\n  </div>\n  @if (col.sortable) { @let direction = sortDirection(); @if (direction ===\n  'asc') {\n  <button class=\"action-btn\" (click)=\"sort($event)\">\n    <ng-container rdtIconOutlet [inputs]=\"{ name: sortAscIcon }\"></ng-container>\n  </button>\n  } @else if (direction === 'desc') {\n  <button class=\"action-btn\" (click)=\"sort($event)\">\n    <ng-container\n      rdtIconOutlet\n      [inputs]=\"{ name: sortDescIcon }\"\n    ></ng-container>\n  </button>\n  } @else {\n  <button class=\"action-btn\" (click)=\"sort($event)\">\n    <ng-container\n      rdtIconOutlet\n      [inputs]=\"{ name: sortEnabledIcon }\"\n    ></ng-container>\n  </button>\n  }}\n</div>\n" }]
+        }] });
+
+class RdtTableComponent {
+    router = inject(RdtRouterService);
+    itemIdFn = input.required({ transform: (selectIdTransform) });
+    colDefsInput = input([], { alias: 'colDefs' });
+    colDefs = linkedSignal(() => this.colDefsInput());
+    size = input('md');
+    selectMode = input('none');
+    showPaginator = input(true, { transform: booleanAttribute });
+    showSelectAll = input(true, { transform: booleanAttribute });
+    autoSize = input(true, { transform: booleanAttribute });
+    displayedColumns = input(undefined);
+    notFoundConfig = input({
+        header: RDT_TABLE_DEFAULT_NOT_FOUND_HEADER,
+        message: RDT_TABLE_DEFAULT_NOT_FOUND_MESSAGE,
+    });
+    usesDoubleClickInput = input(false, {
+        transform: booleanAttribute,
+        alias: 'usesDoubleClick',
+    });
+    usesDoubleClick = linkedSignal(() => this.usesDoubleClickInput());
+    tableEl;
+    headerCells = [];
+    defaultColumnWidth = 200; //px
+    savedColumnWidths = signal(new Map());
+    hasInitializedWidths = signal(false);
+    explicitWidthsApplied = signal(new Set());
+    rowDoubleClick = output();
+    selectKey = 'RdtTableSelectColumnKey';
+    allColumnKeys = computed(() => {
+        return this.colDefs().map((col) => col.key);
+    });
+    realDisplayedColumns = computed(() => {
+        const columns = this.displayedColumns() ?? this.allColumnKeys();
+        if (this.selectMode() !== 'none') {
+            return [this.selectKey, ...columns];
+        }
+        else {
+            return columns;
+        }
+    });
+    clickDebounceTime = computed(() => this.usesDoubleClick() ? 250 : 0);
+    getColumnWidth(col) {
+        return col?.width;
+    }
+    getMinColumnWidth(col) {
+        return col?.minWidth;
+    }
+    getMaxColumnWidth(col) {
+        if (!this.autoSize()) {
+            return col.maxWidth;
+        }
+        return col?.maxWidth ?? `${this.defaultColumnWidth}px`;
+    }
+    injector = inject(Injector);
+    cd = inject(ChangeDetectorRef);
+    renderer = inject(Renderer2);
+    store = inject(RdtTableStore);
+    dataChangeEffect = afterRenderEffect({
+        earlyRead: () => {
+            const data = this.store.entities();
+            const loading = this.store.loading();
+            if (!loading && this.autoSize() && data.length > 0) {
+                const table = this.tableEl?.nativeElement;
+                if (!table)
+                    return [];
+                return this.headerCells.map((cellRef, index) => {
+                    const col = cellRef.nativeElement;
+                    const colDefIndex = index - 1;
+                    const colDef = this.colDefs()[colDefIndex];
+                    const colWidth = col.getBoundingClientRect().width;
+                    return {
+                        col: col,
+                        index,
+                        colDef,
+                        colWidth,
+                        hasExplicitMinWidth: colDef?.minWidth !== undefined,
+                        hasExplicitMaxWidth: colDef?.maxWidth !== undefined,
+                    };
+                });
+            }
+            return [];
+        },
+        write: (measurementsSignal) => {
+            const measurements = measurementsSignal();
+            if (!measurements || measurements.length === 0)
+                return;
+            measurements.forEach(({ col, index, colDef, colWidth, hasExplicitMinWidth, hasExplicitMaxWidth, }) => {
+                if (hasExplicitMinWidth || hasExplicitMaxWidth) {
+                    if (colDef) {
+                        this.applyColumnWidths(col, index, colDef, hasExplicitMinWidth, hasExplicitMaxWidth);
+                    }
+                }
+                else {
+                    this.handleAutoSizing(col, index, colWidth);
+                }
+            });
+            this.hasInitializedWidths.set(true);
+        },
+    });
+    onCellDblClick(row, column) {
+        if (column.interactive(row)) {
+            return;
+        }
+        this.rowDoubleClick.emit(row);
+    }
+    onCellClick(row, column) {
+        if (column.interactive(row)) {
+            return;
+        }
+        this.onSelect(row);
+    }
+    onSelect(row) {
+        const mode = untracked(this.selectMode);
+        if (mode === 'multi') {
+            this.store.toggleSelectItem(row);
+        }
+        else if (mode === 'single') {
+            this.store.toggleSelectSingleItem(row);
+        }
+    }
+    selectAll() {
+        this.store.toggleSelectAll();
+    }
+    getCellCursor(row, column) {
+        if (column.interactive(row)) {
+            return 'default';
+        }
+        if (this.selectMode() !== 'none' || this.usesDoubleClick()) {
+            return 'pointer';
+        }
+        return 'default';
+    }
+    applyColumnWidths(col, index, colDef, hasExplicitMinWidth, hasExplicitMaxWidth) {
+        const { minWidth, maxWidth } = colDef;
+        if (!this.explicitWidthsApplied().has(index)) {
+            if (hasExplicitMinWidth) {
+                this.renderer.setStyle(col, 'minWidth', minWidth);
+            }
+            if (hasExplicitMaxWidth) {
+                this.renderer.setStyle(col, 'maxWidth', maxWidth);
+            }
+            this.renderer.setStyle(col, 'width', maxWidth ? maxWidth : minWidth);
+            this.explicitWidthsApplied.update((set) => new Set([...set, index]));
+        }
+    }
+    handleAutoSizing(col, index, colWidth) {
+        let finalWidth;
+        if (!this.hasInitializedWidths()) {
+            // first render
+            finalWidth =
+                colWidth < this.defaultColumnWidth ? colWidth : this.defaultColumnWidth;
+            this.savedColumnWidths.update((map) => new Map([...map, [index, finalWidth]]));
+        }
+        else {
+            // other renders
+            finalWidth =
+                this.savedColumnWidths().get(index) || this.defaultColumnWidth;
+        }
+        const widthPx = `${finalWidth}px`;
+        this.renderer.setStyle(col, 'width', widthPx);
+        this.renderer.setStyle(col, 'minWidth', widthPx);
+        this.renderer.setStyle(col, 'maxWidth', widthPx);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: RdtTableComponent, isStandalone: false, selector: "rdt-table", inputs: { itemIdFn: { classPropertyName: "itemIdFn", publicName: "itemIdFn", isSignal: true, isRequired: true, transformFunction: null }, colDefsInput: { classPropertyName: "colDefsInput", publicName: "colDefs", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, selectMode: { classPropertyName: "selectMode", publicName: "selectMode", isSignal: true, isRequired: false, transformFunction: null }, showPaginator: { classPropertyName: "showPaginator", publicName: "showPaginator", isSignal: true, isRequired: false, transformFunction: null }, showSelectAll: { classPropertyName: "showSelectAll", publicName: "showSelectAll", isSignal: true, isRequired: false, transformFunction: null }, autoSize: { classPropertyName: "autoSize", publicName: "autoSize", isSignal: true, isRequired: false, transformFunction: null }, displayedColumns: { classPropertyName: "displayedColumns", publicName: "displayedColumns", isSignal: true, isRequired: false, transformFunction: null }, notFoundConfig: { classPropertyName: "notFoundConfig", publicName: "notFoundConfig", isSignal: true, isRequired: false, transformFunction: null }, usesDoubleClickInput: { classPropertyName: "usesDoubleClickInput", publicName: "usesDoubleClick", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rowDoubleClick: "rowDoubleClick" }, providers: [RdtTableStore], viewQueries: [{ propertyName: "tableEl", first: true, predicate: ["tableEl"], descendants: true, read: ElementRef }, { propertyName: "headerCells", predicate: ["headerEl"], descendants: true, read: ElementRef }], exportAs: ["rdtTable"], ngImport: i0, template: "@let data = store.entities(); @let loading = store.loading() || !store.ready();\n<div [class]=\"'rdt-table--' + size()\" class=\"rdt-table-wrapper\">\n  <table cdk-table [dataSource]=\"loading ? data : data\" slot=\"table\" #tableEl>\n    @let colNames = realDisplayedColumns();\n    <tr cdk-header-row *cdkHeaderRowDef=\"colNames\"></tr>\n    <tr\n      cdk-row\n      *cdkRowDef=\"let row; columns: colNames\"\n      [class.row-selected]=\"store.isSelected(row)\"\n    ></tr>\n\n    <ng-container [cdkColumnDef]=\"selectKey\" [sticky]=\"true\">\n      @let mode = selectMode();\n      <th\n        cdk-header-cell\n        *cdkHeaderCellDef\n        class=\"rdt-select-column-header\"\n        #headerEl\n      >\n        @if (showSelectAll() && mode === 'multi') {\n        <ng-container\n          rdtCheckboxOutlet\n          [ngModel]=\"store.selectedAll()\"\n          (checkedChange)=\"selectAll()\"\n        ></ng-container>\n        }\n      </th>\n      <td\n        cdk-cell\n        *cdkCellDef=\"let row; let i = index\"\n        class=\"rdt-select-column-cell\"\n      >\n        <div class=\"rdt-select-column-cell-wrapper\">\n          <ng-container\n            rdtCheckboxOutlet\n            [ngModel]=\"store.isSelected(row)\"\n            (checkedChange)=\"onSelect(row)\"\n          ></ng-container>\n        </div>\n      </td>\n    </ng-container>\n\n    @for (column of colDefs(); track column.key) {\n    <ng-container\n      [cdkColumnDef]=\"column.key\"\n      [sticky]=\"column.sticky === 'start'\"\n      [stickyEnd]=\"column.sticky === 'end'\"\n    >\n      <th\n        cdk-header-cell\n        *cdkHeaderCellDef\n        [class]=\"column.headerClass\"\n        [style]=\"column.headerStyle\"\n        [style.min-width]=\"getMinColumnWidth(column)\"\n        [style.max-width]=\"getMaxColumnWidth(column)\"\n        [style.width]=\"getColumnWidth(column)\"\n        #headerEl\n      >\n        <rdt-header-cell-renderer [column]=\"column\" />\n      </th>\n\n      <td\n        cdk-cell\n        *cdkCellDef=\"let row; let i = index\"\n        [class]=\"column.cellClass(row)\"\n        [style]=\"column.cellStyle(row)\"\n        [style.min-width]=\"getMinColumnWidth(column)\"\n        [style.max-width]=\"getMaxColumnWidth(column)\"\n        [style.width]=\"getColumnWidth(column)\"\n        (click.double)=\"onCellDblClick(row, column)\"\n        (click.single)=\"onCellClick(row, column)\"\n        [style.cursor]=\"getCellCursor(row, column)\"\n      >\n        <!--  [debounceTime]=\"clickDebounceTime()\" -->\n        <ng-container\n          *ngComponentOutlet=\"\n              column.cellRenderer;\n              injector: injector;\n              inputs: {\n                row: row,\n                index: i,\n                store: store,\n                cellRendererParams: column.cellRendererParams,\n              }\n            \"\n        >\n        </ng-container>\n      </td>\n    </ng-container>\n    }\n  </table>\n  <!--   @if (loading) {\n  <div class=\"spinner-wrapper special-content\">\n    <rdt-spinner />\n  </div>\n  } -->\n  <!-- @else if (store.fetchError(); as error) {\n    <div class=\"error-wrapper special-content\">\n      <rdt-table-no-result type=\"error\" [config]=\"error\" />\n    </div>\n  } @else if (data.length === 0) {\n    <rdt-table-no-result type=\"not-found\" [config]=\"notFoundConfig()\" />\n  } -->\n</div>\n\n<!-- @if (showPaginator()) { -->\n<rdt-table-paginator />\n<!-- } -->\n", styles: [":root{--rdt-table-height-sm: 250px;--rdt-table-height-md: 350px;--rdt-table-height-lg: 500px;--rdt-table-cell-padding: .25em}table{width:100%}rdt-table .rdt-table--sm .special-content{height:calc(var(--rdt-table-height-sm) - var(--gov-text-xs-font-size) - 2 * var(--rdt-table-cell-padding))}rdt-table .rdt-table--md .special-content{height:calc(var(--rdt-table-height-md) - .75rem + 2 * var(--rdt-table-cell-padding))}rdt-table .rdt-table--lg .special-content{height:calc(var(--rdt-table-height-lg) - .75rem + 2 * var(--rdt-table-cell-padding))}rdt-table thead{z-index:9;position:sticky;top:0}rdt-table .action-btn{border:none;outline:none;border-radius:4px;background-color:#00000006;padding:4px 8px;font-weight:500}rdt-table .action-btn:hover{cursor:pointer;background-color:#00000013}rdt-table .action-btn.selected{background-color:#00000020;color:#000}rdt-table .space-between{display:flex;justify-content:space-between}rdt-table .spinner-wrapper{display:flex;justify-content:center;height:100%;align-items:center}rdt-table .no-records{height:100%}rdt-table .table-header{display:flex;align-items:center;gap:2px}rdt-table td.cdk-table-sticky{background:var(--gov-color-neutral-white)!important}rdt-table td,rdt-table th{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;overflow-wrap:anywhere}rdt-table td{padding:0!important}rdt-table .rdt-select-column-header,rdt-table .rdt-select-column-cell{width:calc(var(--gov-form-checkbox-core-xs-indicator-size, 1rem) + 2 * var(--rdt-table-cell-padding));padding:var(--rdt-table-cell-padding)!important}rdt-table .row-selected td{background-color:var(--gov-color-primary-100)!important}rdt-table .cell-value-base{display:block;width:100%;padding:.25rem .5rem;overflow:hidden;text-overflow:ellipsis}\n"], dependencies: [{ kind: "directive", type: i1$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.CdkTable, selector: "cdk-table, table[cdk-table]", inputs: ["trackBy", "dataSource", "multiTemplateDataRows", "fixedLayout"], outputs: ["contentChanged"], exportAs: ["cdkTable"] }, { kind: "directive", type: i3.CdkRowDef, selector: "[cdkRowDef]", inputs: ["cdkRowDefColumns", "cdkRowDefWhen"] }, { kind: "directive", type: i3.CdkCellDef, selector: "[cdkCellDef]" }, { kind: "directive", type: i3.CdkHeaderCellDef, selector: "[cdkHeaderCellDef]" }, { kind: "directive", type: i3.CdkColumnDef, selector: "[cdkColumnDef]", inputs: ["cdkColumnDef", "sticky", "stickyEnd"] }, { kind: "directive", type: i3.CdkCell, selector: "cdk-cell, td[cdk-cell]" }, { kind: "component", type: i3.CdkRow, selector: "cdk-row, tr[cdk-row]" }, { kind: "directive", type: i3.CdkHeaderCell, selector: "cdk-header-cell, th[cdk-header-cell]" }, { kind: "component", type: i3.CdkHeaderRow, selector: "cdk-header-row, tr[cdk-header-row]" }, { kind: "directive", type: i3.CdkHeaderRowDef, selector: "[cdkHeaderRowDef]", inputs: ["cdkHeaderRowDef", "cdkHeaderRowDefSticky"] }, { kind: "directive", type: i4.RdtCheckboxOutletDirective, selector: "[rdtCheckboxOutlet]", outputs: ["checkedChange"], exportAs: ["rdtCheckboxOutlet"] }, { kind: "component", type: RdtTablePaginatorComponent, selector: "rdt-table-paginator" }, { kind: "component", type: RdtHeaderCellRendererComponent, selector: "rdt-header-cell-renderer", inputs: ["column"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtTableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rdt-table', changeDetection: ChangeDetectionStrategy.OnPush, providers: [RdtTableStore], standalone: false, encapsulation: ViewEncapsulation.None, exportAs: 'rdtTable', template: "@let data = store.entities(); @let loading = store.loading() || !store.ready();\n<div [class]=\"'rdt-table--' + size()\" class=\"rdt-table-wrapper\">\n  <table cdk-table [dataSource]=\"loading ? data : data\" slot=\"table\" #tableEl>\n    @let colNames = realDisplayedColumns();\n    <tr cdk-header-row *cdkHeaderRowDef=\"colNames\"></tr>\n    <tr\n      cdk-row\n      *cdkRowDef=\"let row; columns: colNames\"\n      [class.row-selected]=\"store.isSelected(row)\"\n    ></tr>\n\n    <ng-container [cdkColumnDef]=\"selectKey\" [sticky]=\"true\">\n      @let mode = selectMode();\n      <th\n        cdk-header-cell\n        *cdkHeaderCellDef\n        class=\"rdt-select-column-header\"\n        #headerEl\n      >\n        @if (showSelectAll() && mode === 'multi') {\n        <ng-container\n          rdtCheckboxOutlet\n          [ngModel]=\"store.selectedAll()\"\n          (checkedChange)=\"selectAll()\"\n        ></ng-container>\n        }\n      </th>\n      <td\n        cdk-cell\n        *cdkCellDef=\"let row; let i = index\"\n        class=\"rdt-select-column-cell\"\n      >\n        <div class=\"rdt-select-column-cell-wrapper\">\n          <ng-container\n            rdtCheckboxOutlet\n            [ngModel]=\"store.isSelected(row)\"\n            (checkedChange)=\"onSelect(row)\"\n          ></ng-container>\n        </div>\n      </td>\n    </ng-container>\n\n    @for (column of colDefs(); track column.key) {\n    <ng-container\n      [cdkColumnDef]=\"column.key\"\n      [sticky]=\"column.sticky === 'start'\"\n      [stickyEnd]=\"column.sticky === 'end'\"\n    >\n      <th\n        cdk-header-cell\n        *cdkHeaderCellDef\n        [class]=\"column.headerClass\"\n        [style]=\"column.headerStyle\"\n        [style.min-width]=\"getMinColumnWidth(column)\"\n        [style.max-width]=\"getMaxColumnWidth(column)\"\n        [style.width]=\"getColumnWidth(column)\"\n        #headerEl\n      >\n        <rdt-header-cell-renderer [column]=\"column\" />\n      </th>\n\n      <td\n        cdk-cell\n        *cdkCellDef=\"let row; let i = index\"\n        [class]=\"column.cellClass(row)\"\n        [style]=\"column.cellStyle(row)\"\n        [style.min-width]=\"getMinColumnWidth(column)\"\n        [style.max-width]=\"getMaxColumnWidth(column)\"\n        [style.width]=\"getColumnWidth(column)\"\n        (click.double)=\"onCellDblClick(row, column)\"\n        (click.single)=\"onCellClick(row, column)\"\n        [style.cursor]=\"getCellCursor(row, column)\"\n      >\n        <!--  [debounceTime]=\"clickDebounceTime()\" -->\n        <ng-container\n          *ngComponentOutlet=\"\n              column.cellRenderer;\n              injector: injector;\n              inputs: {\n                row: row,\n                index: i,\n                store: store,\n                cellRendererParams: column.cellRendererParams,\n              }\n            \"\n        >\n        </ng-container>\n      </td>\n    </ng-container>\n    }\n  </table>\n  <!--   @if (loading) {\n  <div class=\"spinner-wrapper special-content\">\n    <rdt-spinner />\n  </div>\n  } -->\n  <!-- @else if (store.fetchError(); as error) {\n    <div class=\"error-wrapper special-content\">\n      <rdt-table-no-result type=\"error\" [config]=\"error\" />\n    </div>\n  } @else if (data.length === 0) {\n    <rdt-table-no-result type=\"not-found\" [config]=\"notFoundConfig()\" />\n  } -->\n</div>\n\n<!-- @if (showPaginator()) { -->\n<rdt-table-paginator />\n<!-- } -->\n", styles: [":root{--rdt-table-height-sm: 250px;--rdt-table-height-md: 350px;--rdt-table-height-lg: 500px;--rdt-table-cell-padding: .25em}table{width:100%}rdt-table .rdt-table--sm .special-content{height:calc(var(--rdt-table-height-sm) - var(--gov-text-xs-font-size) - 2 * var(--rdt-table-cell-padding))}rdt-table .rdt-table--md .special-content{height:calc(var(--rdt-table-height-md) - .75rem + 2 * var(--rdt-table-cell-padding))}rdt-table .rdt-table--lg .special-content{height:calc(var(--rdt-table-height-lg) - .75rem + 2 * var(--rdt-table-cell-padding))}rdt-table thead{z-index:9;position:sticky;top:0}rdt-table .action-btn{border:none;outline:none;border-radius:4px;background-color:#00000006;padding:4px 8px;font-weight:500}rdt-table .action-btn:hover{cursor:pointer;background-color:#00000013}rdt-table .action-btn.selected{background-color:#00000020;color:#000}rdt-table .space-between{display:flex;justify-content:space-between}rdt-table .spinner-wrapper{display:flex;justify-content:center;height:100%;align-items:center}rdt-table .no-records{height:100%}rdt-table .table-header{display:flex;align-items:center;gap:2px}rdt-table td.cdk-table-sticky{background:var(--gov-color-neutral-white)!important}rdt-table td,rdt-table th{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;overflow-wrap:anywhere}rdt-table td{padding:0!important}rdt-table .rdt-select-column-header,rdt-table .rdt-select-column-cell{width:calc(var(--gov-form-checkbox-core-xs-indicator-size, 1rem) + 2 * var(--rdt-table-cell-padding));padding:var(--rdt-table-cell-padding)!important}rdt-table .row-selected td{background-color:var(--gov-color-primary-100)!important}rdt-table .cell-value-base{display:block;width:100%;padding:.25rem .5rem;overflow:hidden;text-overflow:ellipsis}\n"] }]
+        }], propDecorators: { tableEl: [{
+                type: ViewChild,
+                args: ['tableEl', { static: false, read: ElementRef }]
+            }], headerCells: [{
+                type: ViewChildren,
+                args: ['headerEl', { read: ElementRef }]
+            }] } });
+
+class RdtTableNoStateDirective {
+    table = inject(RdtTableComponent, { self: true });
+    ngOnInit() {
+        this.table.store.setReady();
+        this.table.store.fetch();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtTableNoStateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.0", type: RdtTableNoStateDirective, isStandalone: false, selector: "rdt-table:not([queryParamsState])", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtTableNoStateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'rdt-table:not([queryParamsState])',
+                    standalone: false,
+                }]
+        }] });
+
+class RdtTableOfflineDatasource extends RdtTableDatasource {
+    _data;
+    constructor(_data) {
+        super();
+        this._data = _data;
+    }
+    set data(value) {
+        this._data = value;
+    }
+    get data() {
+        return this._data;
+    }
+    // This method first filters data according to filters,
+    // Then sorts the filtered data and finally paginates it.
+    getData(params) {
+        // Apply filtering
+        let filteredData = this._data;
+        if (params.filters) {
+            filteredData = filteredData.filter((item) => params.filters.every((filter) => this.applyFilter(filter, item)));
+        }
+        // Apply sorting
+        if (params.sort) {
+            filteredData = filteredData.sort(this.getSortFn(params.sort));
+        }
+        // Apply pagination
+        const start = params.pageIndex * params.pageSize;
+        const end = start + params.pageSize;
+        const paginatedData = filteredData.slice(start, end);
+        return of({
+            data: paginatedData,
+            totalCount: filteredData.length,
+            pageIndex: params.pageIndex,
+        }).pipe(delay(300));
+    }
+    compare(aValue, bValue, type) {
+        if (aValue == null && bValue == null) {
+            return 0;
+        }
+        else if (aValue == null) {
+            return 1; // nulls are considered greater
+        }
+        else if (bValue == null) {
+            return -1; // nulls are considered less
+        }
+        switch (type) {
+            case 'string':
+                return aValue.localeCompare(bValue);
+            case 'number':
+            case 'decimal':
+                return aValue - bValue;
+            case 'boolean':
+                return Number(aValue) - Number(bValue);
+            case 'date':
+                return new Date(aValue).getTime() - new Date(bValue).getTime();
+            case 'enum':
+                return typeof aValue === 'string' && typeof bValue === 'string'
+                    ? aValue.localeCompare(bValue)
+                    : aValue - bValue;
+            default:
+                return 0;
+        }
+    }
+    getSortFn(sort) {
+        return (a, b) => {
+            const aValue = RdtObjectUtils.pluck(a, sort.key);
+            const bValue = RdtObjectUtils.pluck(b, sort.key);
+            return (this.compare(aValue, bValue, sort.type) *
+                (sort.direction === 'asc' ? 1 : -1));
+        };
+    }
+    // TODO: Implementovat jako na BE
+    applyFilter(filter, item) {
+        const value = RdtObjectUtils.pluck(item, filter.key);
+        if (value === undefined || value === null) {
+            return false;
+        }
+        switch (filter.type) {
+            case 'string':
+                return String(value).includes(filter.value);
+            case 'number':
+                return value === filter.value;
+            case 'boolean':
+                return value === filter.value;
+            case 'date':
+                return (new Date(value).toDateString() ===
+                    new Date(filter.value).toDateString());
+            default:
+                return false;
+        }
+    }
+}
+
+class RdtTableOfflineDatasourceProviderDirective {
+    store = inject(RdtTableStore, { self: true });
+    data = input();
+    dataEffect = effect(() => {
+        const data = this.data();
+        if (data) {
+            this.store.setDatasource(new RdtTableOfflineDatasource(data));
+        }
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtTableOfflineDatasourceProviderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.0", type: RdtTableOfflineDatasourceProviderDirective, isStandalone: false, selector: "rdt-table[data]", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtTableOfflineDatasourceProviderDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'rdt-table[data]',
+                    standalone: false,
+                }]
+        }] });
+
+class RdtTableStateDirective {
+    table = inject(RdtTableComponent, { self: true });
+    elementRef = inject(ElementRef);
+    subscription;
+    storeObservable;
+    constructor() {
+        const store = this.table.store;
+        this.storeObservable = combineLatest([
+            toObservable(store.sort),
+            toObservable(store.headerFilters),
+            toObservable(store.pageSize),
+            toObservable(store.pageIndex),
+            toObservable(store.displayedColumns),
+        ]).pipe(map(([sort, headerFilters, pageSize, pageIndex, displayedColumns]) => ({
+            sort: sort,
+            headerFilters: headerFilters,
+            pageSize,
+            page: pageIndex,
+            displayedColumns,
+        })));
+    }
+    ngOnInit() {
+        this.readState().subscribe((state) => {
+            if (state) {
+                this.table.store.setSort(state.sort);
+                this.table.store.setHeaderFilters(state.headerFilters);
+                this.table.store.setPagination(state.pageSize ?? 0, state.page ?? 0);
+                this.table.store.setDisplayedColumns(state.displayedColumns ?? []);
+            }
+        });
+        this.subscription = this.storeObservable.subscribe((state) => {
+            this.writeState(state).subscribe();
+        });
+    }
+    ngOnDestroy() {
+        this.subscription?.unsubscribe();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtTableStateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.0", type: RdtTableStateDirective, isStandalone: false, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtTableStateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [] });
+
+class RdtTableModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.0", ngImport: i0, type: RdtTableModule, declarations: [RdtTableComponent,
+            RdtTablePaginatorComponent,
+            RdtHeaderCellRendererComponent,
+            RdtTableOfflineDatasourceProviderDirective,
+            RdtStaticCellRendererComponent,
+            /*     RdtTableActionBarComponent, */
+            RdtTableNoStateDirective], imports: [CommonModule,
+            FormsModule,
+            ReactiveFormsModule,
+            CdkTableModule,
+            GovDesignSystemModule,
+            RdtCheckboxOutletDirective,
+            RdtIconOutletDirective], exports: [RdtTableComponent,
+            RdtHeaderCellRendererComponent,
+            RdtTablePaginatorComponent,
+            RdtTableOfflineDatasourceProviderDirective,
+            RdtStaticCellRendererComponent,
+            RdtTableNoStateDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtTableModule, imports: [CommonModule,
+            FormsModule,
+            ReactiveFormsModule,
+            CdkTableModule,
+            GovDesignSystemModule] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtTableModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        RdtTableComponent,
+                        RdtTablePaginatorComponent,
+                        RdtHeaderCellRendererComponent,
+                        RdtTableOfflineDatasourceProviderDirective,
+                        RdtStaticCellRendererComponent,
+                        /*     RdtTableActionBarComponent, */
+                        RdtTableNoStateDirective,
+                        /*     RdtTableNoResultComponent,
+                        RdtTableQueryParamsStateDirective, */
+                    ],
+                    exports: [
+                        RdtTableComponent,
+                        RdtHeaderCellRendererComponent,
+                        RdtTablePaginatorComponent,
+                        RdtTableOfflineDatasourceProviderDirective,
+                        RdtStaticCellRendererComponent,
+                        RdtTableNoStateDirective,
+                    ],
+                    imports: [
+                        CommonModule,
+                        FormsModule,
+                        ReactiveFormsModule,
+                        CdkTableModule,
+                        GovDesignSystemModule,
+                        RdtCheckboxOutletDirective,
+                        RdtIconOutletDirective,
+                        /*  RdtMenuModule, */
+                        /*
+                        CsuSpinnerComponent,
+                        CsuButtonComponent,
+                        CsuCheckboxComponent,
+                        CsuClickDoubleDirective,
+                        CsuSelectComponent,
+                        CsuSelectOfflineProviderDirective, */
+                    ],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { RdtBaseCellRendererComponent, RdtBaseColumnBuilder, RdtHeaderCellRendererComponent, RdtStaticCellRendererComponent, RdtStaticColumnBuilder, RdtTableComponent, RdtTableDatasource, RdtTableModule, RdtTableNoStateDirective, RdtTableOfflineDatasourceProviderDirective, RdtTablePaginatorComponent, RdtTableStateDirective, RdtTableStore, isRdtTableMessage, rdtTableInitialState };
+//# sourceMappingURL=ngrdt-table.mjs.map