cax-design-system 3.0.1 → 3.0.2

package/fesm2022/cax-design-system-table.mjs

@@ -2686,13 +2686,13 @@ class Table {
         this.destroyResponsiveStyle();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: Table, deps: [{ token: DOCUMENT }, { token: PLATFORM_ID }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: TableService }, { token: i0.ChangeDetectorRef }, { token: i2.FilterService }, { token: i2.OverlayService }, { token: i2.caxConfig }, { token: i3$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.25", type: Table, isStandalone: true, selector: "cax-table", inputs: { fontSize: "fontSize", rowSize: "rowSize", frozenColumns: "frozenColumns", frozenValue: "frozenValue", style: "style", styleClass: "styleClass", tableStyle: "tableStyle", tableStyleClass: "tableStyleClass", paginator: ["paginator", "paginator", booleanAttribute], rowsPerPageOptions: "rowsPerPageOptions", paginatorPosition: "paginatorPosition", showPrevNext: ["showPrevNext", "showPrevNext", booleanAttribute], showResultsPerPage: ["showResultsPerPage", "showResultsPerPage", booleanAttribute], paginatorAlignment: "paginatorAlignment", defaultSortOrder: ["defaultSortOrder", "defaultSortOrder", numberAttribute], filterType: "filterType", sortType: "sortType", sortMode: "sortMode", resetPageOnSort: ["resetPageOnSort", "resetPageOnSort", booleanAttribute], selectionMode: "selectionMode", selectionPageOnly: ["selectionPageOnly", "selectionPageOnly", booleanAttribute], contextMenuSelection: "contextMenuSelection", contextMenuSelectionMode: "contextMenuSelectionMode", dataKey: "dataKey", metaKeySelection: ["metaKeySelection", "metaKeySelection", booleanAttribute], rowSelectable: "rowSelectable", rowTrackBy: "rowTrackBy", lazy: ["lazy", "lazy", booleanAttribute], lazyLoadOnInit: ["lazyLoadOnInit", "lazyLoadOnInit", booleanAttribute], compareSelectionBy: "compareSelectionBy", csvSeparator: "csvSeparator", exportFilename: "exportFilename", filters: "filters", globalFilterFields: "globalFilterFields", filterDelay: ["filterDelay", "filterDelay", numberAttribute], filterLocale: "filterLocale", expandedRowKeys: "expandedRowKeys", editingRowKeys: "editingRowKeys", rowExpandMode: "rowExpandMode", scrollable: ["scrollable", "scrollable", booleanAttribute], scrollDirection: "scrollDirection", rowGroupMode: "rowGroupMode", scrollHeight: "scrollHeight", virtualScroll: ["virtualScroll", "virtualScroll", booleanAttribute], virtualScrollItemSize: ["virtualScrollItemSize", "virtualScrollItemSize", numberAttribute], virtualScrollOptions: "virtualScrollOptions", virtualScrollDelay: ["virtualScrollDelay", "virtualScrollDelay", numberAttribute], frozenWidth: "frozenWidth", responsive: "responsive", contextMenu: "contextMenu", resizableColumns: ["resizableColumns", "resizableColumns", booleanAttribute], columnResizeMode: "columnResizeMode", reorderableColumns: ["reorderableColumns", "reorderableColumns", booleanAttribute], loading: ["loading", "loading", booleanAttribute], loadingIcon: "loadingIcon", showLoader: ["showLoader", "showLoader", booleanAttribute], rowHover: ["rowHover", "rowHover", booleanAttribute], customSort: ["customSort", "customSort", booleanAttribute], showInitialSortBadge: ["showInitialSortBadge", "showInitialSortBadge", booleanAttribute], autoLayout: ["autoLayout", "autoLayout", booleanAttribute], exportFunction: "exportFunction", exportHeader: "exportHeader", stateKey: "stateKey", stateStorage: "stateStorage", editMode: "editMode", groupRowsBy: "groupRowsBy", groupRowsByOrder: ["groupRowsByOrder", "groupRowsByOrder", numberAttribute], responsiveLayout: "responsiveLayout", breakpoint: "breakpoint", paginatorLocale: "paginatorLocale", value: "value", columns: "columns", first: "first", rows: "rows", totalRecords: "totalRecords", sortField: "sortField", sortOrder: "sortOrder", multiSortMeta: "multiSortMeta", selection: "selection", selectAll: "selectAll", virtualRowHeight: "virtualRowHeight" }, outputs: { contextMenuSelectionChange: "contextMenuSelectionChange", selectAllChange: "selectAllChange", selectionChange: "selectionChange", onRowSelect: "onRowSelect", onRowUnselect: "onRowUnselect", onPage: "onPage", onPerPageChange: "onPerPageChange", onPrevClick: "onPrevClick", onNextClick: "onNextClick", onSort: "onSort", onFilter: "onFilter", onLazyLoad: "onLazyLoad", onRowExpand: "onRowExpand", onRowCollapse: "onRowCollapse", onContextMenuSelect: "onContextMenuSelect", onColResize: "onColResize", onColReorder: "onColReorder", onRowReorder: "onRowReorder", onEditInit: "onEditInit", onEditComplete: "onEditComplete", onEditCancel: "onEditCancel", onHeaderCheckboxToggle: "onHeaderCheckboxToggle", sortFunction: "sortFunction", firstChange: "firstChange", rowsChange: "rowsChange", onStateSave: "onStateSave", onStateRestore: "onStateRestore" }, host: { classAttribute: "cax-element" }, queries: [{ propertyName: "templates", predicate: CaxTemplate }], viewQueries: [{ propertyName: "containerViewChild", first: true, predicate: ["container"], descendants: true }, { propertyName: "resizeHelperViewChild", first: true, predicate: ["resizeHelper"], descendants: true }, { propertyName: "reorderIndicatorUpViewChild", first: true, predicate: ["reorderIndicatorUp"], descendants: true }, { propertyName: "reorderIndicatorDownViewChild", first: true, predicate: ["reorderIndicatorDown"], descendants: true }, { propertyName: "wrapperViewChild", first: true, predicate: ["wrapper"], descendants: true }, { propertyName: "tableViewChild", first: true, predicate: ["table"], descendants: true }, { propertyName: "tableHeaderViewChild", first: true, predicate: ["thead"], descendants: true }, { propertyName: "tableFooterViewChild", first: true, predicate: ["tfoot"], descendants: true }, { propertyName: "scroller", first: true, predicate: ["scroller"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #container [ngStyle]=\"style\" [class]=\"styleClass\" [ngClass]=\"getTableClasses()\" [attr.id]=\"id\">\n    <div class=\"cax-datatable-loading-overlay cax-component-overlay\" *ngIf=\"loading && showLoader\">\n        <i *ngIf=\"loadingIcon\" [class]=\"'cax-datatable-loading-icon ' + loadingIcon\"></i>\n        <ng-container *ngIf=\"!loadingIcon\">\n            <SpinnerIcon *ngIf=\"!loadingIconTemplate\" [spin]=\"true\" [styleClass]=\"'cax-datatable-loading-icon'\" />\n            <span *ngIf=\"loadingIconTemplate\" class=\"cax-datatable-loading-icon\">\n                <ng-template *ngTemplateOutlet=\"loadingIconTemplate\"></ng-template>\n            </span>\n        </ng-container>\n    </div>\n    <div *ngIf=\"captionTemplate\" class=\"cax-datatable-header\">\n        <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n    </div>\n    <cax-tablePaginator\n        [rows]=\"rows\"\n        [first]=\"first\"\n        [totalRecords]=\"totalRecords\"\n        [rowsPerPageOptions]=\"rowsPerPageOptions\"\n        [showPrevNext]=\"showPrevNext\"\n        [showResultsPerPage]=\"showResultsPerPage\"\n        [alignment]=\"paginatorAlignment\"\n        (onPerPageChange)=\"onPageChange($event)\"\n        (onPrevClick)=\"onPrevClickChange($event)\"\n        (onNextClick)=\"onNextClickChange($event)\"\n        *ngIf=\"paginator && (paginatorPosition === 'top' || paginatorPosition == 'both')\"\n    ></cax-tablePaginator>\n\n    <div #wrapper class=\"cax-datatable-wrapper\" [ngStyle]=\"{ maxHeight: virtualScroll ? '' : scrollHeight }\">\n        <cax-scroller\n            #scroller\n            *ngIf=\"virtualScroll\"\n            [items]=\"processedData\"\n            [columns]=\"columns\"\n            [style]=\"{ height: scrollHeight !== 'flex' ? scrollHeight : undefined }\"\n            [scrollHeight]=\"scrollHeight !== 'flex' ? undefined : '100%'\"\n            [itemSize]=\"virtualScrollItemSize || _virtualRowHeight\"\n            [step]=\"rows\"\n            [delay]=\"lazy ? virtualScrollDelay : 0\"\n            [inline]=\"true\"\n            [autoSize]=\"true\"\n            [lazy]=\"lazy\"\n            (onLazyLoad)=\"onLazyItemLoad($event)\"\n            [loaderDisabled]=\"true\"\n            [showSpacer]=\"false\"\n            [showLoader]=\"loadingBodyTemplate\"\n            [options]=\"virtualScrollOptions\"\n        >\n            <ng-template caxTemplate=\"content\" let-items let-scrollerOptions=\"options\">\n                <ng-container *ngTemplateOutlet=\"buildInTable; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n            </ng-template>\n        </cax-scroller>\n        <ng-container *ngIf=\"!virtualScroll\">\n            <ng-container *ngTemplateOutlet=\"buildInTable; context: { $implicit: processedData, options: { columns } }\"></ng-container>\n        </ng-container>\n\n        <ng-template #buildInTable let-items let-scrollerOptions=\"options\">\n            <table\n                #table\n                role=\"table\"\n                [ngClass]=\"{ 'cax-datatable-table': true, 'cax-datatable-scrollable-table': scrollable, 'cax-datatable-resizable-table': resizableColumns, 'cax-datatable-resizable-table-fit': resizableColumns && columnResizeMode === 'fit' }\"\n                [class]=\"tableStyleClass\"\n                [ngStyle]=\"tableStyle\"\n                [attr.id]=\"id + '-table'\"\n            >\n                <ng-container *ngTemplateOutlet=\"colGroupTemplate; context: { $implicit: scrollerOptions.columns }\"></ng-container>\n                <thead role=\"rowgroup\" #thead class=\"cax-datatable-thead\">\n                    <ng-container *ngTemplateOutlet=\"headerGroupedTemplate || headerTemplate; context: { $implicit: scrollerOptions.columns }\"></ng-container>\n                </thead>\n                <tbody\n                    role=\"rowgroup\"\n                    class=\"cax-datatable-tbody cax-datatable-frozen-tbody\"\n                    *ngIf=\"frozenValue || frozenBodyTemplate\"\n                    [value]=\"frozenValue\"\n                    [frozenRows]=\"true\"\n                    [caxTableBody]=\"scrollerOptions.columns\"\n                    [caxTableBodyTemplate]=\"frozenBodyTemplate\"\n                    [frozen]=\"true\"\n                ></tbody>\n                <tbody\n                    role=\"rowgroup\"\n                    class=\"cax-datatable-tbody\"\n                    [ngClass]=\"scrollerOptions.contentStyleClass\"\n                    [ngStyle]=\"scrollerOptions.contentStyle\"\n                    [value]=\"dataToRender(scrollerOptions.rows)\"\n                    [caxTableBody]=\"scrollerOptions.columns\"\n                    [caxTableBodyTemplate]=\"bodyTemplate\"\n                    [scrollerOptions]=\"scrollerOptions\"\n                ></tbody>\n                <tbody\n                    role=\"rowgroup\"\n                    *ngIf=\"scrollerOptions.spacerStyle\"\n                    [ngStyle]=\"{ height: 'calc(' + scrollerOptions.spacerStyle.height + ' - ' + scrollerOptions.rows.length * scrollerOptions.itemSize + 'px)' }\"\n                    class=\"cax-datatable-scroller-spacer\"\n                ></tbody>\n                <tfoot role=\"rowgroup\" *ngIf=\"footerGroupedTemplate || footerTemplate\" #tfoot class=\"cax-datatable-tfoot\">\n                    <ng-container *ngTemplateOutlet=\"footerGroupedTemplate || footerTemplate; context: { $implicit: scrollerOptions.columns }\"></ng-container>\n                </tfoot>\n            </table>\n        </ng-template>\n    </div>\n\n    <cax-tablePaginator\n        [rows]=\"rows\"\n        [first]=\"first\"\n        [totalRecords]=\"totalRecords\"\n        [rowsPerPageOptions]=\"rowsPerPageOptions\"\n        [showPrevNext]=\"showPrevNext\"\n        [showResultsPerPage]=\"showResultsPerPage\"\n        [alignment]=\"paginatorAlignment\"\n        (onPerPageChange)=\"onPageChange($event)\"\n        (onPrevClick)=\"onPrevClickChange($event)\"\n        (onNextClick)=\"onNextClickChange($event)\"\n        *ngIf=\"paginator && (paginatorPosition === 'bottom' || paginatorPosition == 'both')\"\n    ></cax-tablePaginator>\n\n    <div *ngIf=\"summaryTemplate\" class=\"cax-datatable-footer\">\n        <ng-container *ngTemplateOutlet=\"summaryTemplate\"></ng-container>\n    </div>\n\n    <div\n        #resizeHelper\n        class=\"cax-column-resizer-helper\"\n        [ngStyle]=\"{\n                    display: 'none'\n                }\"\n        *ngIf=\"resizableColumns\"\n    ></div>\n    <span\n        #reorderIndicatorUp\n        class=\"cax-datatable-reorder-indicator-up\"\n        [ngStyle]=\"{\n                    display: 'none'\n                }\"\n        *ngIf=\"reorderableColumns\"\n    >\n        <ArrowDownIcon *ngIf=\"!reorderIndicatorUpIconTemplate\" />\n        <ng-template *ngTemplateOutlet=\"reorderIndicatorUpIconTemplate\"></ng-template>\n    </span>\n    <span\n        #reorderIndicatorDown\n        class=\"cax-datatable-reorder-indicator-down\"\n        [ngStyle]=\"{\n                    display: 'none'\n                }\"\n        *ngIf=\"reorderableColumns\"\n    >\n        <ArrowUpIcon *ngIf=\"!reorderIndicatorDownIconTemplate\" />\n        <ng-template *ngTemplateOutlet=\"reorderIndicatorDownIconTemplate\"></ng-template>\n    </span>\n</div>\n", styles: ["@layer cax{.cax-datatable{position:relative}.cax-datatable>.cax-datatable-wrapper{overflow:auto;border-radius:12px}.cax-datatable-wrapper::-webkit-scrollbar{width:10px;height:10px}.cax-datatable-wrapper::-webkit-scrollbar-track{background:var(--neutral-25);border-radius:12px}.cax-datatable-wrapper::-webkit-scrollbar-thumb{background:var(--neutral-100);border-radius:12px}.cax-datatable-table{border-spacing:0px;width:100%}.cax-datatable .cax-sortable-column{-webkit-user-select:none;user-select:none}.cax-datatable .cax-sortable-column .cax-column-title,.cax-datatable .cax-sortable-column .cax-sortable-column-icon,.cax-datatable .cax-sortable-column .cax-sortable-column-badge{vertical-align:middle}.cax-datatable thead th>div.flex{width:100%}.cax-datatable .cax-sortable-column .cax-icon-wrapper{display:inline}.cax-datatable .cax-sortable-column .cax-sortable-column-badge{display:inline-flex;align-items:center;justify-content:center}.cax-datatable-hoverable-rows .cax-selectable-row{cursor:pointer}.cax-datatable-scrollable>.cax-datatable-wrapper{position:relative}.cax-datatable-scrollable-table>.cax-datatable-thead{position:sticky;top:0;z-index:2}.cax-datatable-scrollable-table>.cax-datatable-frozen-tbody{position:sticky;z-index:1}.cax-datatable-scrollable-table>.cax-datatable-tfoot{position:sticky;bottom:0;z-index:1}.cax-datatable-scrollable .cax-frozen-column{position:sticky;z-index:20}.cax-datatable-scrollable th.cax-frozen-column{z-index:20;background:var(--neutral-75)}.cax-datatable-scrollable td.cax-frozen-column{z-index:20;background:var(--neutral-25)}.cax-datatable-flex-scrollable{display:flex;flex-direction:column;height:100%}.cax-datatable-flex-scrollable>.cax-datatable-wrapper{display:flex;flex-direction:column;flex:1;height:100%}.cax-datatable-scrollable-table>.cax-datatable-tbody>.cax-rowgroucax-header{position:sticky;z-index:2}.cax-datatable-resizable-table>.cax-datatable-thead>tr>th,.cax-datatable-resizable-table>.cax-datatable-tfoot>tr>td,.cax-datatable-resizable-table>.cax-datatable-tbody>tr>td{overflow:hidden;white-space:nowrap}.cax-datatable-resizable-table>.cax-datatable-thead>tr>th.cax-resizable-column:not(.cax-frozen-column){background-clip:padding-box;position:relative}.cax-datatable-resizable-table-fit>.cax-datatable-thead>tr>th.cax-resizable-column:last-child .cax-column-resizer{display:none}.cax-datatable .cax-column-resizer{display:block;position:absolute!important;top:0;right:0;margin:0;width:.5rem;height:100%;padding:0;cursor:col-resize;border:1px solid transparent}.cax-datatable .cax-column-resizer-helper{width:1px;position:absolute;z-index:10;display:none}.cax-datatable .cax-row-editor-init,.cax-datatable .cax-row-editor-save,.cax-datatable .cax-row-editor-cancel,.cax-datatable .cax-row-toggler{display:inline-flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.cax-datatable-reorder-indicator-up,.cax-datatable-reorder-indicator-down{position:absolute}.cax-datatable-reorderablerow-handle,[caxReorderableColumn]{cursor:move}.cax-datatable .cax-datatable-loading-overlay{position:absolute;display:flex;align-items:center;justify-content:center;z-index:3}.cax-column-filter-row{display:flex;align-items:center;width:100%}.cax-column-filter-row i{font-size:20px}cax-columnfilter{margin-left:auto;order:3;float:right}.cax-column-filter-menu{display:inline-flex;align-items:center;vertical-align:middle;margin-left:auto;order:3;float:right}.cax-column-filter-menu i{font-size:20px}.cax-column-filter-row cax-columnfilterformelement,cax-columnfilterformelement{flex:1 1 auto;display:contents}.cax-column-filter-menu-button,.cax-column-filter-clear-button{display:inline-flex;justify-content:center;align-items:center;cursor:pointer;text-decoration:none;overflow:hidden;position:relative}.cax-column-filter-menu-button:disabled{opacity:.5}.cax-column-filter-overlay{position:absolute;top:0;left:0;padding:16px;display:flex;flex-direction:column;gap:8px}.cax-column-filter-menu-container,.cax-column-filter-constraints,.cax-column-filter-constraint{display:flex;flex-direction:column;gap:8px}.cax-fluid{display:block}.cax-fluid .cax-inputtext,.cax-fluid .cax-dropdown,.cax-fluid .cax-inputnumber,.cax-fluid .cax-calendar,.cax-fluid .cax-dropdown .cax-dropdown-label{width:100%}.cax-fluid .cax-checkbox-icon{width:12px!important;height:12px!important}.cax-column-filter-row-items{margin:0;padding:0;list-style:none}.cax-column-filter-row-item{cursor:pointer}.cax-column-filter-add-button,.cax-column-filter-remove-button{justify-content:center}.cax-column-filter-add-button .cax-button-label,.cax-column-filter-remove-button .cax-button-label{flex-grow:0}.cax-column-filter-buttonbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:8px;border-top:1px solid var(--neutral-100)}.cax-column-filter-buttonbar .cax-button{width:auto;flex:1}.cax-datatable-tbody>tr>td>.cax-column-title{display:none}.cax-datatable-scroller-spacer{display:flex}.cax-datatable .cax-scroller .cax-scroller-loading{transform:none!important;min-height:0;position:sticky;top:0;left:0}}.cax-datatable .cax-editable-column .cax-inputtext{width:100%;box-shadow:none;border:0;padding:0;line-height:normal}.cax-datatable.cax-datatable-font-sm .cax-datatable-tbody>tr>td{font-size:12px}.cax-datatable.cax-datatable-font-sm .cax-datatable-tbody>tr>td .cax-inputtext{font-size:12px}.cax-datatable.cax-datatable-font-md .cax-datatable-tbody>tr>td{font-size:14px}.cax-datatable.cax-datatable-font-md .cax-datatable-tbody>tr>td .cax-inputtext{font-size:14px}.cax-datatable.cax-datatable-font-lg .cax-datatable-tbody>tr>td{font-size:16px}.cax-datatable.cax-datatable-font-lg .cax-datatable-tbody>tr>td .cax-inputtext{font-size:16px}.cax-datatable.cax-datatable-font-xl .cax-datatable-tbody>tr>td{font-size:18px}.cax-datatable.cax-datatable-font-xl .cax-datatable-tbody>tr>td .cax-inputtext{font-size:18px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:32px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:40px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:60px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:74px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:36px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:48px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:64px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:80px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:40px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:48px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:72px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:96px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:48px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:60px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:88px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:116px}.cax-cell-highlight-default{border:1px solid var(--primary-500)!important}.cax-cell-highlight-error{border:1px solid var(--error-600)!important}.cax-cell-background-error{background:var(--error-50)}.cax-sort-icon-button{border:0;width:28px;height:28px!important;display:flex;background:transparent;cursor:pointer;padding:0!important;align-items:center;justify-content:center;border-radius:4px}.cax-sort-icon-button i{font-size:20px}.cax-sort-icon-button:disabled{opacity:.5;cursor:context-menu}.cax-sort-icon-button:hover{background-color:var(--neutral-150)}.cax-sort-icon-button.cax-sort-icon-button-active{background-color:var(--primary-75)}cax-sorticon,cax-sortIcon{display:inline-flex;align-items:center;vertical-align:middle;margin-left:4px;order:2;float:right}.cax-column-filter-menu~.cax-column-filter-menu,.cax-column-filter-menu~cax-sorticon,.cax-column-filter-menu~cax-sortIcon,cax-sorticon~.cax-column-filter-menu,cax-sorticon~cax-sorticon,cax-sorticon~cax-sortIcon,cax-sortIcon~.cax-column-filter-menu,cax-sortIcon~cax-sorticon,cax-sortIcon~cax-sortIcon{margin-left:8px;float:right}.cax-table-checkbox-container{display:flex;justify-content:center}cax-cellEditor .cax-inputtextarea{height:100%!important}cax-cellEditor textarea:focus{outline:none!important}cax-cellEditor input:focus{outline:none!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: TablePaginatorModule }, { kind: "component", type: i5.TablePaginatorComponent, selector: "cax-tablePaginator", inputs: ["totalRecords", "rows", "rowsPerPageOptions", "first", "showPrevNext", "showResultsPerPage", "alignment"], outputs: ["onPerPageChange", "onPrevClick", "onNextClick"] }, { kind: "ngmodule", type: ScrollerModule }, { kind: "component", type: i6.Scroller, selector: "cax-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i2.CaxTemplate, selector: "[caxTemplate]", inputs: ["type", "caxTemplate"] }, { kind: "component", type: ArrowDownIcon, selector: "ArrowDownIcon" }, { kind: "component", type: ArrowUpIcon, selector: "ArrowUpIcon" }, { kind: "component", type: SpinnerIcon, selector: "SpinnerIcon" }, { kind: "component", type: TableBody, selector: "[caxTableBody]", inputs: ["caxTableBody", "caxTableBodyTemplate", "value", "frozen", "frozenRows", "scrollerOptions"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.25", type: Table, isStandalone: true, selector: "cax-table", inputs: { fontSize: "fontSize", rowSize: "rowSize", frozenColumns: "frozenColumns", frozenValue: "frozenValue", style: "style", styleClass: "styleClass", tableStyle: "tableStyle", tableStyleClass: "tableStyleClass", paginator: ["paginator", "paginator", booleanAttribute], rowsPerPageOptions: "rowsPerPageOptions", paginatorPosition: "paginatorPosition", showPrevNext: ["showPrevNext", "showPrevNext", booleanAttribute], showResultsPerPage: ["showResultsPerPage", "showResultsPerPage", booleanAttribute], paginatorAlignment: "paginatorAlignment", defaultSortOrder: ["defaultSortOrder", "defaultSortOrder", numberAttribute], filterType: "filterType", sortType: "sortType", sortMode: "sortMode", resetPageOnSort: ["resetPageOnSort", "resetPageOnSort", booleanAttribute], selectionMode: "selectionMode", selectionPageOnly: ["selectionPageOnly", "selectionPageOnly", booleanAttribute], contextMenuSelection: "contextMenuSelection", contextMenuSelectionMode: "contextMenuSelectionMode", dataKey: "dataKey", metaKeySelection: ["metaKeySelection", "metaKeySelection", booleanAttribute], rowSelectable: "rowSelectable", rowTrackBy: "rowTrackBy", lazy: ["lazy", "lazy", booleanAttribute], lazyLoadOnInit: ["lazyLoadOnInit", "lazyLoadOnInit", booleanAttribute], compareSelectionBy: "compareSelectionBy", csvSeparator: "csvSeparator", exportFilename: "exportFilename", filters: "filters", globalFilterFields: "globalFilterFields", filterDelay: ["filterDelay", "filterDelay", numberAttribute], filterLocale: "filterLocale", expandedRowKeys: "expandedRowKeys", editingRowKeys: "editingRowKeys", rowExpandMode: "rowExpandMode", scrollable: ["scrollable", "scrollable", booleanAttribute], scrollDirection: "scrollDirection", rowGroupMode: "rowGroupMode", scrollHeight: "scrollHeight", virtualScroll: ["virtualScroll", "virtualScroll", booleanAttribute], virtualScrollItemSize: ["virtualScrollItemSize", "virtualScrollItemSize", numberAttribute], virtualScrollOptions: "virtualScrollOptions", virtualScrollDelay: ["virtualScrollDelay", "virtualScrollDelay", numberAttribute], frozenWidth: "frozenWidth", responsive: "responsive", contextMenu: "contextMenu", resizableColumns: ["resizableColumns", "resizableColumns", booleanAttribute], columnResizeMode: "columnResizeMode", reorderableColumns: ["reorderableColumns", "reorderableColumns", booleanAttribute], loading: ["loading", "loading", booleanAttribute], loadingIcon: "loadingIcon", showLoader: ["showLoader", "showLoader", booleanAttribute], rowHover: ["rowHover", "rowHover", booleanAttribute], customSort: ["customSort", "customSort", booleanAttribute], showInitialSortBadge: ["showInitialSortBadge", "showInitialSortBadge", booleanAttribute], autoLayout: ["autoLayout", "autoLayout", booleanAttribute], exportFunction: "exportFunction", exportHeader: "exportHeader", stateKey: "stateKey", stateStorage: "stateStorage", editMode: "editMode", groupRowsBy: "groupRowsBy", groupRowsByOrder: ["groupRowsByOrder", "groupRowsByOrder", numberAttribute], responsiveLayout: "responsiveLayout", breakpoint: "breakpoint", paginatorLocale: "paginatorLocale", value: "value", columns: "columns", first: "first", rows: "rows", totalRecords: "totalRecords", sortField: "sortField", sortOrder: "sortOrder", multiSortMeta: "multiSortMeta", selection: "selection", selectAll: "selectAll", virtualRowHeight: "virtualRowHeight" }, outputs: { contextMenuSelectionChange: "contextMenuSelectionChange", selectAllChange: "selectAllChange", selectionChange: "selectionChange", onRowSelect: "onRowSelect", onRowUnselect: "onRowUnselect", onPage: "onPage", onPerPageChange: "onPerPageChange", onPrevClick: "onPrevClick", onNextClick: "onNextClick", onSort: "onSort", onFilter: "onFilter", onLazyLoad: "onLazyLoad", onRowExpand: "onRowExpand", onRowCollapse: "onRowCollapse", onContextMenuSelect: "onContextMenuSelect", onColResize: "onColResize", onColReorder: "onColReorder", onRowReorder: "onRowReorder", onEditInit: "onEditInit", onEditComplete: "onEditComplete", onEditCancel: "onEditCancel", onHeaderCheckboxToggle: "onHeaderCheckboxToggle", sortFunction: "sortFunction", firstChange: "firstChange", rowsChange: "rowsChange", onStateSave: "onStateSave", onStateRestore: "onStateRestore" }, host: { classAttribute: "cax-element" }, queries: [{ propertyName: "templates", predicate: CaxTemplate }], viewQueries: [{ propertyName: "containerViewChild", first: true, predicate: ["container"], descendants: true }, { propertyName: "resizeHelperViewChild", first: true, predicate: ["resizeHelper"], descendants: true }, { propertyName: "reorderIndicatorUpViewChild", first: true, predicate: ["reorderIndicatorUp"], descendants: true }, { propertyName: "reorderIndicatorDownViewChild", first: true, predicate: ["reorderIndicatorDown"], descendants: true }, { propertyName: "wrapperViewChild", first: true, predicate: ["wrapper"], descendants: true }, { propertyName: "tableViewChild", first: true, predicate: ["table"], descendants: true }, { propertyName: "tableHeaderViewChild", first: true, predicate: ["thead"], descendants: true }, { propertyName: "tableFooterViewChild", first: true, predicate: ["tfoot"], descendants: true }, { propertyName: "scroller", first: true, predicate: ["scroller"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #container [ngStyle]=\"style\" [class]=\"styleClass\" [ngClass]=\"getTableClasses()\" [attr.id]=\"id\">\n    <div class=\"cax-datatable-loading-overlay cax-component-overlay\" *ngIf=\"loading && showLoader\">\n        <i *ngIf=\"loadingIcon\" [class]=\"'cax-datatable-loading-icon ' + loadingIcon\"></i>\n        <ng-container *ngIf=\"!loadingIcon\">\n            <SpinnerIcon *ngIf=\"!loadingIconTemplate\" [spin]=\"true\" [styleClass]=\"'cax-datatable-loading-icon'\" />\n            <span *ngIf=\"loadingIconTemplate\" class=\"cax-datatable-loading-icon\">\n                <ng-template *ngTemplateOutlet=\"loadingIconTemplate\"></ng-template>\n            </span>\n        </ng-container>\n    </div>\n    <div *ngIf=\"captionTemplate\" class=\"cax-datatable-header\">\n        <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n    </div>\n    <cax-tablePaginator\n        [rows]=\"rows\"\n        [first]=\"first\"\n        [totalRecords]=\"totalRecords\"\n        [rowsPerPageOptions]=\"rowsPerPageOptions\"\n        [showPrevNext]=\"showPrevNext\"\n        [showResultsPerPage]=\"showResultsPerPage\"\n        [alignment]=\"paginatorAlignment\"\n        (onPerPageChange)=\"onPageChange($event)\"\n        (onPrevClick)=\"onPrevClickChange($event)\"\n        (onNextClick)=\"onNextClickChange($event)\"\n        *ngIf=\"paginator && (paginatorPosition === 'top' || paginatorPosition == 'both')\"\n    ></cax-tablePaginator>\n\n    <div #wrapper class=\"cax-datatable-wrapper\" [ngStyle]=\"{ maxHeight: virtualScroll ? '' : scrollHeight }\">\n        <cax-scroller\n            #scroller\n            *ngIf=\"virtualScroll\"\n            [items]=\"processedData\"\n            [columns]=\"columns\"\n            [style]=\"{ height: scrollHeight !== 'flex' ? scrollHeight : undefined }\"\n            [scrollHeight]=\"scrollHeight !== 'flex' ? undefined : '100%'\"\n            [itemSize]=\"virtualScrollItemSize || _virtualRowHeight\"\n            [step]=\"rows\"\n            [delay]=\"lazy ? virtualScrollDelay : 0\"\n            [inline]=\"true\"\n            [autoSize]=\"true\"\n            [lazy]=\"lazy\"\n            (onLazyLoad)=\"onLazyItemLoad($event)\"\n            [loaderDisabled]=\"true\"\n            [showSpacer]=\"false\"\n            [showLoader]=\"loadingBodyTemplate\"\n            [options]=\"virtualScrollOptions\"\n        >\n            <ng-template caxTemplate=\"content\" let-items let-scrollerOptions=\"options\">\n                <ng-container *ngTemplateOutlet=\"buildInTable; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n            </ng-template>\n        </cax-scroller>\n        <ng-container *ngIf=\"!virtualScroll\">\n            <ng-container *ngTemplateOutlet=\"buildInTable; context: { $implicit: processedData, options: { columns } }\"></ng-container>\n        </ng-container>\n\n        <ng-template #buildInTable let-items let-scrollerOptions=\"options\">\n            <table\n                #table\n                role=\"table\"\n                [ngClass]=\"{ 'cax-datatable-table': true, 'cax-datatable-scrollable-table': scrollable, 'cax-datatable-resizable-table': resizableColumns, 'cax-datatable-resizable-table-fit': resizableColumns && columnResizeMode === 'fit' }\"\n                [class]=\"tableStyleClass\"\n                [ngStyle]=\"tableStyle\"\n                [attr.id]=\"id + '-table'\"\n            >\n                <ng-container *ngTemplateOutlet=\"colGroupTemplate; context: { $implicit: scrollerOptions.columns }\"></ng-container>\n                <thead role=\"rowgroup\" #thead class=\"cax-datatable-thead\">\n                    <ng-container *ngTemplateOutlet=\"headerGroupedTemplate || headerTemplate; context: { $implicit: scrollerOptions.columns }\"></ng-container>\n                </thead>\n                <tbody\n                    role=\"rowgroup\"\n                    class=\"cax-datatable-tbody cax-datatable-frozen-tbody\"\n                    *ngIf=\"frozenValue || frozenBodyTemplate\"\n                    [value]=\"frozenValue\"\n                    [frozenRows]=\"true\"\n                    [caxTableBody]=\"scrollerOptions.columns\"\n                    [caxTableBodyTemplate]=\"frozenBodyTemplate\"\n                    [frozen]=\"true\"\n                ></tbody>\n                <tbody\n                    role=\"rowgroup\"\n                    class=\"cax-datatable-tbody\"\n                    [ngClass]=\"scrollerOptions.contentStyleClass\"\n                    [ngStyle]=\"scrollerOptions.contentStyle\"\n                    [value]=\"dataToRender(scrollerOptions.rows)\"\n                    [caxTableBody]=\"scrollerOptions.columns\"\n                    [caxTableBodyTemplate]=\"bodyTemplate\"\n                    [scrollerOptions]=\"scrollerOptions\"\n                ></tbody>\n                <tbody\n                    role=\"rowgroup\"\n                    *ngIf=\"scrollerOptions.spacerStyle\"\n                    [ngStyle]=\"{ height: 'calc(' + scrollerOptions.spacerStyle.height + ' - ' + scrollerOptions.rows.length * scrollerOptions.itemSize + 'px)' }\"\n                    class=\"cax-datatable-scroller-spacer\"\n                ></tbody>\n                <tfoot role=\"rowgroup\" *ngIf=\"footerGroupedTemplate || footerTemplate\" #tfoot class=\"cax-datatable-tfoot\">\n                    <ng-container *ngTemplateOutlet=\"footerGroupedTemplate || footerTemplate; context: { $implicit: scrollerOptions.columns }\"></ng-container>\n                </tfoot>\n            </table>\n        </ng-template>\n    </div>\n\n    <cax-tablePaginator\n        [rows]=\"rows\"\n        [first]=\"first\"\n        [totalRecords]=\"totalRecords\"\n        [rowsPerPageOptions]=\"rowsPerPageOptions\"\n        [showPrevNext]=\"showPrevNext\"\n        [showResultsPerPage]=\"showResultsPerPage\"\n        [alignment]=\"paginatorAlignment\"\n        (onPerPageChange)=\"onPageChange($event)\"\n        (onPrevClick)=\"onPrevClickChange($event)\"\n        (onNextClick)=\"onNextClickChange($event)\"\n        *ngIf=\"paginator && (paginatorPosition === 'bottom' || paginatorPosition == 'both')\"\n    ></cax-tablePaginator>\n\n    <div *ngIf=\"summaryTemplate\" class=\"cax-datatable-footer\">\n        <ng-container *ngTemplateOutlet=\"summaryTemplate\"></ng-container>\n    </div>\n\n    <div\n        #resizeHelper\n        class=\"cax-column-resizer-helper\"\n        [ngStyle]=\"{\n                    display: 'none'\n                }\"\n        *ngIf=\"resizableColumns\"\n    ></div>\n    <span\n        #reorderIndicatorUp\n        class=\"cax-datatable-reorder-indicator-up\"\n        [ngStyle]=\"{\n                    display: 'none'\n                }\"\n        *ngIf=\"reorderableColumns\"\n    >\n        <ArrowDownIcon *ngIf=\"!reorderIndicatorUpIconTemplate\" />\n        <ng-template *ngTemplateOutlet=\"reorderIndicatorUpIconTemplate\"></ng-template>\n    </span>\n    <span\n        #reorderIndicatorDown\n        class=\"cax-datatable-reorder-indicator-down\"\n        [ngStyle]=\"{\n                    display: 'none'\n                }\"\n        *ngIf=\"reorderableColumns\"\n    >\n        <ArrowUpIcon *ngIf=\"!reorderIndicatorDownIconTemplate\" />\n        <ng-template *ngTemplateOutlet=\"reorderIndicatorDownIconTemplate\"></ng-template>\n    </span>\n</div>\n", styles: ["@layer cax{.cax-datatable{position:relative}.cax-datatable>.cax-datatable-wrapper{overflow:auto;border-radius:12px}.cax-datatable-wrapper::-webkit-scrollbar{width:10px;height:10px}.cax-datatable-wrapper::-webkit-scrollbar-track{background:var(--neutral-25);border-radius:12px}.cax-datatable-wrapper::-webkit-scrollbar-thumb{background:var(--neutral-100);border-radius:12px}.cax-datatable-table{border-spacing:0px;width:100%}.cax-datatable .cax-sortable-column{-webkit-user-select:none;user-select:none}.cax-datatable .cax-sortable-column .cax-column-title,.cax-datatable .cax-sortable-column .cax-sortable-column-icon,.cax-datatable .cax-sortable-column .cax-sortable-column-badge{vertical-align:middle}.cax-datatable thead th>div.flex{width:100%}.cax-datatable .cax-sortable-column .cax-icon-wrapper{display:inline}.cax-datatable .cax-sortable-column .cax-sortable-column-badge{display:inline-flex;align-items:center;justify-content:center}.cax-datatable-hoverable-rows .cax-selectable-row{cursor:pointer}.cax-datatable-scrollable>.cax-datatable-wrapper{position:relative}.cax-datatable-scrollable-table>.cax-datatable-thead{position:sticky;top:0;z-index:30}.cax-datatable-scrollable-table>.cax-datatable-frozen-tbody{position:sticky;z-index:1}.cax-datatable-scrollable-table>.cax-datatable-tfoot{position:sticky;bottom:0;z-index:1}.cax-datatable-scrollable .cax-frozen-column{position:sticky;z-index:20}.cax-datatable-scrollable th.cax-frozen-column{z-index:31;background:var(--neutral-50)}.cax-datatable-scrollable td.cax-frozen-column{z-index:20;background:var(--neutral-25)}.cax-datatable-flex-scrollable{display:flex;flex-direction:column;height:100%}.cax-datatable-flex-scrollable>.cax-datatable-wrapper{display:flex;flex-direction:column;flex:1;height:100%}.cax-datatable-scrollable-table>.cax-datatable-tbody>.cax-rowgroucax-header{position:sticky;z-index:2}.cax-datatable-resizable-table>.cax-datatable-thead>tr>th,.cax-datatable-resizable-table>.cax-datatable-tfoot>tr>td,.cax-datatable-resizable-table>.cax-datatable-tbody>tr>td{overflow:hidden;white-space:nowrap}.cax-datatable-resizable-table>.cax-datatable-thead>tr>th.cax-resizable-column:not(.cax-frozen-column){background-clip:padding-box;position:relative}.cax-datatable-resizable-table-fit>.cax-datatable-thead>tr>th.cax-resizable-column:last-child .cax-column-resizer{display:none}.cax-datatable .cax-column-resizer{display:block;position:absolute!important;top:0;right:0;margin:0;width:.5rem;height:100%;padding:0;cursor:col-resize;border:1px solid transparent}.cax-datatable .cax-column-resizer-helper{width:1px;position:absolute;z-index:10;display:none}.cax-datatable .cax-row-editor-init,.cax-datatable .cax-row-editor-save,.cax-datatable .cax-row-editor-cancel,.cax-datatable .cax-row-toggler{display:inline-flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.cax-datatable-reorder-indicator-up,.cax-datatable-reorder-indicator-down{position:absolute}.cax-datatable-reorderablerow-handle,[caxReorderableColumn]{cursor:move}.cax-datatable .cax-datatable-loading-overlay{position:absolute;display:flex;align-items:center;justify-content:center;z-index:3}.cax-column-filter-row{display:flex;align-items:center;width:100%}.cax-column-filter-row i{font-size:20px}cax-columnfilter{margin-left:auto;order:3;float:right}.cax-column-filter-menu{display:inline-flex;align-items:center;vertical-align:middle;margin-left:auto;order:3;float:right}.cax-column-filter-menu i{font-size:20px}.cax-column-filter-row cax-columnfilterformelement,cax-columnfilterformelement{flex:1 1 auto;display:contents}.cax-column-filter-menu-button,.cax-column-filter-clear-button{display:inline-flex;justify-content:center;align-items:center;cursor:pointer;text-decoration:none;overflow:hidden;position:relative}.cax-column-filter-menu-button:disabled{opacity:.5}.cax-column-filter-overlay{position:absolute;top:0;left:0;padding:16px;display:flex;flex-direction:column;gap:8px}.cax-column-filter-menu-container,.cax-column-filter-constraints,.cax-column-filter-constraint{display:flex;flex-direction:column;gap:8px}.cax-fluid{display:block}.cax-fluid .cax-inputtext,.cax-fluid .cax-dropdown,.cax-fluid .cax-inputnumber,.cax-fluid .cax-calendar,.cax-fluid .cax-dropdown .cax-dropdown-label{width:100%}.cax-fluid .cax-checkbox-icon{width:12px!important;height:12px!important}.cax-column-filter-row-items{margin:0;padding:0;list-style:none}.cax-column-filter-row-item{cursor:pointer}.cax-column-filter-add-button,.cax-column-filter-remove-button{justify-content:center}.cax-column-filter-add-button .cax-button-label,.cax-column-filter-remove-button .cax-button-label{flex-grow:0}.cax-column-filter-buttonbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:8px;border-top:1px solid var(--neutral-100)}.cax-column-filter-buttonbar .cax-button{width:auto;flex:1}.cax-datatable-tbody>tr>td>.cax-column-title{display:none}.cax-datatable-scroller-spacer{display:flex}.cax-datatable .cax-scroller .cax-scroller-loading{transform:none!important;min-height:0;position:sticky;top:0;left:0}}.cax-datatable .cax-editable-column .cax-inputtext{width:100%;box-shadow:none;border:0;padding:0;line-height:normal}.cax-datatable.cax-datatable-font-sm .cax-datatable-tbody>tr>td{font-size:12px}.cax-datatable.cax-datatable-font-sm .cax-datatable-tbody>tr>td .cax-inputtext{font-size:12px}.cax-datatable.cax-datatable-font-md .cax-datatable-tbody>tr>td{font-size:14px}.cax-datatable.cax-datatable-font-md .cax-datatable-tbody>tr>td .cax-inputtext{font-size:14px}.cax-datatable.cax-datatable-font-lg .cax-datatable-tbody>tr>td{font-size:16px}.cax-datatable.cax-datatable-font-lg .cax-datatable-tbody>tr>td .cax-inputtext{font-size:16px}.cax-datatable.cax-datatable-font-xl .cax-datatable-tbody>tr>td{font-size:18px}.cax-datatable.cax-datatable-font-xl .cax-datatable-tbody>tr>td .cax-inputtext{font-size:18px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:32px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:40px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:60px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:74px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:36px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:48px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:64px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:80px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:40px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:48px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:72px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:96px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:48px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:60px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:88px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:116px}.cax-cell-highlight-default{border:1px solid var(--primary-500)!important}.cax-cell-highlight-error{border:1px solid var(--error-600)!important}.cax-cell-background-error{background:var(--error-50)}.cax-sort-icon-button{border:0;width:28px;height:28px!important;display:flex;background:transparent;cursor:pointer;padding:0!important;align-items:center;justify-content:center;border-radius:4px}.cax-sort-icon-button i{font-size:20px}.cax-sort-icon-button:disabled{opacity:.5;cursor:context-menu}.cax-sort-icon-button:hover{background-color:var(--neutral-150)}.cax-sort-icon-button.cax-sort-icon-button-active{background-color:var(--primary-75)}cax-sorticon,cax-sortIcon{display:inline-flex;align-items:center;vertical-align:middle;margin-left:4px;order:2;float:right}.cax-column-filter-menu~.cax-column-filter-menu,.cax-column-filter-menu~cax-sorticon,.cax-column-filter-menu~cax-sortIcon,cax-sorticon~.cax-column-filter-menu,cax-sorticon~cax-sorticon,cax-sorticon~cax-sortIcon,cax-sortIcon~.cax-column-filter-menu,cax-sortIcon~cax-sorticon,cax-sortIcon~cax-sortIcon{margin-left:8px;float:right}.cax-table-checkbox-container{display:flex;justify-content:center}cax-cellEditor .cax-inputtextarea{height:100%!important}cax-cellEditor textarea:focus{outline:none!important}cax-cellEditor input:focus{outline:none!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: TablePaginatorModule }, { kind: "component", type: i5.TablePaginatorComponent, selector: "cax-tablePaginator", inputs: ["totalRecords", "rows", "rowsPerPageOptions", "first", "showPrevNext", "showResultsPerPage", "alignment"], outputs: ["onPerPageChange", "onPrevClick", "onNextClick"] }, { kind: "ngmodule", type: ScrollerModule }, { kind: "component", type: i6.Scroller, selector: "cax-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i2.CaxTemplate, selector: "[caxTemplate]", inputs: ["type", "caxTemplate"] }, { kind: "component", type: ArrowDownIcon, selector: "ArrowDownIcon" }, { kind: "component", type: ArrowUpIcon, selector: "ArrowUpIcon" }, { kind: "component", type: SpinnerIcon, selector: "SpinnerIcon" }, { kind: "component", type: TableBody, selector: "[caxTableBody]", inputs: ["caxTableBody", "caxTableBodyTemplate", "value", "frozen", "frozenRows", "scrollerOptions"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: Table, decorators: [{
             type: Component,
             args: [{ selector: 'cax-table', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, standalone: true, imports: [CommonModule, TablePaginatorModule, ScrollerModule, ArrowDownIcon, ArrowUpIcon, SpinnerIcon, TableBody], host: {
                         class: 'cax-element'
-                    }, template: "<div #container [ngStyle]=\"style\" [class]=\"styleClass\" [ngClass]=\"getTableClasses()\" [attr.id]=\"id\">\n    <div class=\"cax-datatable-loading-overlay cax-component-overlay\" *ngIf=\"loading && showLoader\">\n        <i *ngIf=\"loadingIcon\" [class]=\"'cax-datatable-loading-icon ' + loadingIcon\"></i>\n        <ng-container *ngIf=\"!loadingIcon\">\n            <SpinnerIcon *ngIf=\"!loadingIconTemplate\" [spin]=\"true\" [styleClass]=\"'cax-datatable-loading-icon'\" />\n            <span *ngIf=\"loadingIconTemplate\" class=\"cax-datatable-loading-icon\">\n                <ng-template *ngTemplateOutlet=\"loadingIconTemplate\"></ng-template>\n            </span>\n        </ng-container>\n    </div>\n    <div *ngIf=\"captionTemplate\" class=\"cax-datatable-header\">\n        <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n    </div>\n    <cax-tablePaginator\n        [rows]=\"rows\"\n        [first]=\"first\"\n        [totalRecords]=\"totalRecords\"\n        [rowsPerPageOptions]=\"rowsPerPageOptions\"\n        [showPrevNext]=\"showPrevNext\"\n        [showResultsPerPage]=\"showResultsPerPage\"\n        [alignment]=\"paginatorAlignment\"\n        (onPerPageChange)=\"onPageChange($event)\"\n        (onPrevClick)=\"onPrevClickChange($event)\"\n        (onNextClick)=\"onNextClickChange($event)\"\n        *ngIf=\"paginator && (paginatorPosition === 'top' || paginatorPosition == 'both')\"\n    ></cax-tablePaginator>\n\n    <div #wrapper class=\"cax-datatable-wrapper\" [ngStyle]=\"{ maxHeight: virtualScroll ? '' : scrollHeight }\">\n        <cax-scroller\n            #scroller\n            *ngIf=\"virtualScroll\"\n            [items]=\"processedData\"\n            [columns]=\"columns\"\n            [style]=\"{ height: scrollHeight !== 'flex' ? scrollHeight : undefined }\"\n            [scrollHeight]=\"scrollHeight !== 'flex' ? undefined : '100%'\"\n            [itemSize]=\"virtualScrollItemSize || _virtualRowHeight\"\n            [step]=\"rows\"\n            [delay]=\"lazy ? virtualScrollDelay : 0\"\n            [inline]=\"true\"\n            [autoSize]=\"true\"\n            [lazy]=\"lazy\"\n            (onLazyLoad)=\"onLazyItemLoad($event)\"\n            [loaderDisabled]=\"true\"\n            [showSpacer]=\"false\"\n            [showLoader]=\"loadingBodyTemplate\"\n            [options]=\"virtualScrollOptions\"\n        >\n            <ng-template caxTemplate=\"content\" let-items let-scrollerOptions=\"options\">\n                <ng-container *ngTemplateOutlet=\"buildInTable; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n            </ng-template>\n        </cax-scroller>\n        <ng-container *ngIf=\"!virtualScroll\">\n            <ng-container *ngTemplateOutlet=\"buildInTable; context: { $implicit: processedData, options: { columns } }\"></ng-container>\n        </ng-container>\n\n        <ng-template #buildInTable let-items let-scrollerOptions=\"options\">\n            <table\n                #table\n                role=\"table\"\n                [ngClass]=\"{ 'cax-datatable-table': true, 'cax-datatable-scrollable-table': scrollable, 'cax-datatable-resizable-table': resizableColumns, 'cax-datatable-resizable-table-fit': resizableColumns && columnResizeMode === 'fit' }\"\n                [class]=\"tableStyleClass\"\n                [ngStyle]=\"tableStyle\"\n                [attr.id]=\"id + '-table'\"\n            >\n                <ng-container *ngTemplateOutlet=\"colGroupTemplate; context: { $implicit: scrollerOptions.columns }\"></ng-container>\n                <thead role=\"rowgroup\" #thead class=\"cax-datatable-thead\">\n                    <ng-container *ngTemplateOutlet=\"headerGroupedTemplate || headerTemplate; context: { $implicit: scrollerOptions.columns }\"></ng-container>\n                </thead>\n                <tbody\n                    role=\"rowgroup\"\n                    class=\"cax-datatable-tbody cax-datatable-frozen-tbody\"\n                    *ngIf=\"frozenValue || frozenBodyTemplate\"\n                    [value]=\"frozenValue\"\n                    [frozenRows]=\"true\"\n                    [caxTableBody]=\"scrollerOptions.columns\"\n                    [caxTableBodyTemplate]=\"frozenBodyTemplate\"\n                    [frozen]=\"true\"\n                ></tbody>\n                <tbody\n                    role=\"rowgroup\"\n                    class=\"cax-datatable-tbody\"\n                    [ngClass]=\"scrollerOptions.contentStyleClass\"\n                    [ngStyle]=\"scrollerOptions.contentStyle\"\n                    [value]=\"dataToRender(scrollerOptions.rows)\"\n                    [caxTableBody]=\"scrollerOptions.columns\"\n                    [caxTableBodyTemplate]=\"bodyTemplate\"\n                    [scrollerOptions]=\"scrollerOptions\"\n                ></tbody>\n                <tbody\n                    role=\"rowgroup\"\n                    *ngIf=\"scrollerOptions.spacerStyle\"\n                    [ngStyle]=\"{ height: 'calc(' + scrollerOptions.spacerStyle.height + ' - ' + scrollerOptions.rows.length * scrollerOptions.itemSize + 'px)' }\"\n                    class=\"cax-datatable-scroller-spacer\"\n                ></tbody>\n                <tfoot role=\"rowgroup\" *ngIf=\"footerGroupedTemplate || footerTemplate\" #tfoot class=\"cax-datatable-tfoot\">\n                    <ng-container *ngTemplateOutlet=\"footerGroupedTemplate || footerTemplate; context: { $implicit: scrollerOptions.columns }\"></ng-container>\n                </tfoot>\n            </table>\n        </ng-template>\n    </div>\n\n    <cax-tablePaginator\n        [rows]=\"rows\"\n        [first]=\"first\"\n        [totalRecords]=\"totalRecords\"\n        [rowsPerPageOptions]=\"rowsPerPageOptions\"\n        [showPrevNext]=\"showPrevNext\"\n        [showResultsPerPage]=\"showResultsPerPage\"\n        [alignment]=\"paginatorAlignment\"\n        (onPerPageChange)=\"onPageChange($event)\"\n        (onPrevClick)=\"onPrevClickChange($event)\"\n        (onNextClick)=\"onNextClickChange($event)\"\n        *ngIf=\"paginator && (paginatorPosition === 'bottom' || paginatorPosition == 'both')\"\n    ></cax-tablePaginator>\n\n    <div *ngIf=\"summaryTemplate\" class=\"cax-datatable-footer\">\n        <ng-container *ngTemplateOutlet=\"summaryTemplate\"></ng-container>\n    </div>\n\n    <div\n        #resizeHelper\n        class=\"cax-column-resizer-helper\"\n        [ngStyle]=\"{\n                    display: 'none'\n                }\"\n        *ngIf=\"resizableColumns\"\n    ></div>\n    <span\n        #reorderIndicatorUp\n        class=\"cax-datatable-reorder-indicator-up\"\n        [ngStyle]=\"{\n                    display: 'none'\n                }\"\n        *ngIf=\"reorderableColumns\"\n    >\n        <ArrowDownIcon *ngIf=\"!reorderIndicatorUpIconTemplate\" />\n        <ng-template *ngTemplateOutlet=\"reorderIndicatorUpIconTemplate\"></ng-template>\n    </span>\n    <span\n        #reorderIndicatorDown\n        class=\"cax-datatable-reorder-indicator-down\"\n        [ngStyle]=\"{\n                    display: 'none'\n                }\"\n        *ngIf=\"reorderableColumns\"\n    >\n        <ArrowUpIcon *ngIf=\"!reorderIndicatorDownIconTemplate\" />\n        <ng-template *ngTemplateOutlet=\"reorderIndicatorDownIconTemplate\"></ng-template>\n    </span>\n</div>\n", styles: ["@layer cax{.cax-datatable{position:relative}.cax-datatable>.cax-datatable-wrapper{overflow:auto;border-radius:12px}.cax-datatable-wrapper::-webkit-scrollbar{width:10px;height:10px}.cax-datatable-wrapper::-webkit-scrollbar-track{background:var(--neutral-25);border-radius:12px}.cax-datatable-wrapper::-webkit-scrollbar-thumb{background:var(--neutral-100);border-radius:12px}.cax-datatable-table{border-spacing:0px;width:100%}.cax-datatable .cax-sortable-column{-webkit-user-select:none;user-select:none}.cax-datatable .cax-sortable-column .cax-column-title,.cax-datatable .cax-sortable-column .cax-sortable-column-icon,.cax-datatable .cax-sortable-column .cax-sortable-column-badge{vertical-align:middle}.cax-datatable thead th>div.flex{width:100%}.cax-datatable .cax-sortable-column .cax-icon-wrapper{display:inline}.cax-datatable .cax-sortable-column .cax-sortable-column-badge{display:inline-flex;align-items:center;justify-content:center}.cax-datatable-hoverable-rows .cax-selectable-row{cursor:pointer}.cax-datatable-scrollable>.cax-datatable-wrapper{position:relative}.cax-datatable-scrollable-table>.cax-datatable-thead{position:sticky;top:0;z-index:2}.cax-datatable-scrollable-table>.cax-datatable-frozen-tbody{position:sticky;z-index:1}.cax-datatable-scrollable-table>.cax-datatable-tfoot{position:sticky;bottom:0;z-index:1}.cax-datatable-scrollable .cax-frozen-column{position:sticky;z-index:20}.cax-datatable-scrollable th.cax-frozen-column{z-index:20;background:var(--neutral-75)}.cax-datatable-scrollable td.cax-frozen-column{z-index:20;background:var(--neutral-25)}.cax-datatable-flex-scrollable{display:flex;flex-direction:column;height:100%}.cax-datatable-flex-scrollable>.cax-datatable-wrapper{display:flex;flex-direction:column;flex:1;height:100%}.cax-datatable-scrollable-table>.cax-datatable-tbody>.cax-rowgroucax-header{position:sticky;z-index:2}.cax-datatable-resizable-table>.cax-datatable-thead>tr>th,.cax-datatable-resizable-table>.cax-datatable-tfoot>tr>td,.cax-datatable-resizable-table>.cax-datatable-tbody>tr>td{overflow:hidden;white-space:nowrap}.cax-datatable-resizable-table>.cax-datatable-thead>tr>th.cax-resizable-column:not(.cax-frozen-column){background-clip:padding-box;position:relative}.cax-datatable-resizable-table-fit>.cax-datatable-thead>tr>th.cax-resizable-column:last-child .cax-column-resizer{display:none}.cax-datatable .cax-column-resizer{display:block;position:absolute!important;top:0;right:0;margin:0;width:.5rem;height:100%;padding:0;cursor:col-resize;border:1px solid transparent}.cax-datatable .cax-column-resizer-helper{width:1px;position:absolute;z-index:10;display:none}.cax-datatable .cax-row-editor-init,.cax-datatable .cax-row-editor-save,.cax-datatable .cax-row-editor-cancel,.cax-datatable .cax-row-toggler{display:inline-flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.cax-datatable-reorder-indicator-up,.cax-datatable-reorder-indicator-down{position:absolute}.cax-datatable-reorderablerow-handle,[caxReorderableColumn]{cursor:move}.cax-datatable .cax-datatable-loading-overlay{position:absolute;display:flex;align-items:center;justify-content:center;z-index:3}.cax-column-filter-row{display:flex;align-items:center;width:100%}.cax-column-filter-row i{font-size:20px}cax-columnfilter{margin-left:auto;order:3;float:right}.cax-column-filter-menu{display:inline-flex;align-items:center;vertical-align:middle;margin-left:auto;order:3;float:right}.cax-column-filter-menu i{font-size:20px}.cax-column-filter-row cax-columnfilterformelement,cax-columnfilterformelement{flex:1 1 auto;display:contents}.cax-column-filter-menu-button,.cax-column-filter-clear-button{display:inline-flex;justify-content:center;align-items:center;cursor:pointer;text-decoration:none;overflow:hidden;position:relative}.cax-column-filter-menu-button:disabled{opacity:.5}.cax-column-filter-overlay{position:absolute;top:0;left:0;padding:16px;display:flex;flex-direction:column;gap:8px}.cax-column-filter-menu-container,.cax-column-filter-constraints,.cax-column-filter-constraint{display:flex;flex-direction:column;gap:8px}.cax-fluid{display:block}.cax-fluid .cax-inputtext,.cax-fluid .cax-dropdown,.cax-fluid .cax-inputnumber,.cax-fluid .cax-calendar,.cax-fluid .cax-dropdown .cax-dropdown-label{width:100%}.cax-fluid .cax-checkbox-icon{width:12px!important;height:12px!important}.cax-column-filter-row-items{margin:0;padding:0;list-style:none}.cax-column-filter-row-item{cursor:pointer}.cax-column-filter-add-button,.cax-column-filter-remove-button{justify-content:center}.cax-column-filter-add-button .cax-button-label,.cax-column-filter-remove-button .cax-button-label{flex-grow:0}.cax-column-filter-buttonbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:8px;border-top:1px solid var(--neutral-100)}.cax-column-filter-buttonbar .cax-button{width:auto;flex:1}.cax-datatable-tbody>tr>td>.cax-column-title{display:none}.cax-datatable-scroller-spacer{display:flex}.cax-datatable .cax-scroller .cax-scroller-loading{transform:none!important;min-height:0;position:sticky;top:0;left:0}}.cax-datatable .cax-editable-column .cax-inputtext{width:100%;box-shadow:none;border:0;padding:0;line-height:normal}.cax-datatable.cax-datatable-font-sm .cax-datatable-tbody>tr>td{font-size:12px}.cax-datatable.cax-datatable-font-sm .cax-datatable-tbody>tr>td .cax-inputtext{font-size:12px}.cax-datatable.cax-datatable-font-md .cax-datatable-tbody>tr>td{font-size:14px}.cax-datatable.cax-datatable-font-md .cax-datatable-tbody>tr>td .cax-inputtext{font-size:14px}.cax-datatable.cax-datatable-font-lg .cax-datatable-tbody>tr>td{font-size:16px}.cax-datatable.cax-datatable-font-lg .cax-datatable-tbody>tr>td .cax-inputtext{font-size:16px}.cax-datatable.cax-datatable-font-xl .cax-datatable-tbody>tr>td{font-size:18px}.cax-datatable.cax-datatable-font-xl .cax-datatable-tbody>tr>td .cax-inputtext{font-size:18px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:32px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:40px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:60px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:74px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:36px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:48px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:64px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:80px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:40px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:48px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:72px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:96px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:48px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:60px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:88px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:116px}.cax-cell-highlight-default{border:1px solid var(--primary-500)!important}.cax-cell-highlight-error{border:1px solid var(--error-600)!important}.cax-cell-background-error{background:var(--error-50)}.cax-sort-icon-button{border:0;width:28px;height:28px!important;display:flex;background:transparent;cursor:pointer;padding:0!important;align-items:center;justify-content:center;border-radius:4px}.cax-sort-icon-button i{font-size:20px}.cax-sort-icon-button:disabled{opacity:.5;cursor:context-menu}.cax-sort-icon-button:hover{background-color:var(--neutral-150)}.cax-sort-icon-button.cax-sort-icon-button-active{background-color:var(--primary-75)}cax-sorticon,cax-sortIcon{display:inline-flex;align-items:center;vertical-align:middle;margin-left:4px;order:2;float:right}.cax-column-filter-menu~.cax-column-filter-menu,.cax-column-filter-menu~cax-sorticon,.cax-column-filter-menu~cax-sortIcon,cax-sorticon~.cax-column-filter-menu,cax-sorticon~cax-sorticon,cax-sorticon~cax-sortIcon,cax-sortIcon~.cax-column-filter-menu,cax-sortIcon~cax-sorticon,cax-sortIcon~cax-sortIcon{margin-left:8px;float:right}.cax-table-checkbox-container{display:flex;justify-content:center}cax-cellEditor .cax-inputtextarea{height:100%!important}cax-cellEditor textarea:focus{outline:none!important}cax-cellEditor input:focus{outline:none!important}\n"] }]
+                    }, template: "<div #container [ngStyle]=\"style\" [class]=\"styleClass\" [ngClass]=\"getTableClasses()\" [attr.id]=\"id\">\n    <div class=\"cax-datatable-loading-overlay cax-component-overlay\" *ngIf=\"loading && showLoader\">\n        <i *ngIf=\"loadingIcon\" [class]=\"'cax-datatable-loading-icon ' + loadingIcon\"></i>\n        <ng-container *ngIf=\"!loadingIcon\">\n            <SpinnerIcon *ngIf=\"!loadingIconTemplate\" [spin]=\"true\" [styleClass]=\"'cax-datatable-loading-icon'\" />\n            <span *ngIf=\"loadingIconTemplate\" class=\"cax-datatable-loading-icon\">\n                <ng-template *ngTemplateOutlet=\"loadingIconTemplate\"></ng-template>\n            </span>\n        </ng-container>\n    </div>\n    <div *ngIf=\"captionTemplate\" class=\"cax-datatable-header\">\n        <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n    </div>\n    <cax-tablePaginator\n        [rows]=\"rows\"\n        [first]=\"first\"\n        [totalRecords]=\"totalRecords\"\n        [rowsPerPageOptions]=\"rowsPerPageOptions\"\n        [showPrevNext]=\"showPrevNext\"\n        [showResultsPerPage]=\"showResultsPerPage\"\n        [alignment]=\"paginatorAlignment\"\n        (onPerPageChange)=\"onPageChange($event)\"\n        (onPrevClick)=\"onPrevClickChange($event)\"\n        (onNextClick)=\"onNextClickChange($event)\"\n        *ngIf=\"paginator && (paginatorPosition === 'top' || paginatorPosition == 'both')\"\n    ></cax-tablePaginator>\n\n    <div #wrapper class=\"cax-datatable-wrapper\" [ngStyle]=\"{ maxHeight: virtualScroll ? '' : scrollHeight }\">\n        <cax-scroller\n            #scroller\n            *ngIf=\"virtualScroll\"\n            [items]=\"processedData\"\n            [columns]=\"columns\"\n            [style]=\"{ height: scrollHeight !== 'flex' ? scrollHeight : undefined }\"\n            [scrollHeight]=\"scrollHeight !== 'flex' ? undefined : '100%'\"\n            [itemSize]=\"virtualScrollItemSize || _virtualRowHeight\"\n            [step]=\"rows\"\n            [delay]=\"lazy ? virtualScrollDelay : 0\"\n            [inline]=\"true\"\n            [autoSize]=\"true\"\n            [lazy]=\"lazy\"\n            (onLazyLoad)=\"onLazyItemLoad($event)\"\n            [loaderDisabled]=\"true\"\n            [showSpacer]=\"false\"\n            [showLoader]=\"loadingBodyTemplate\"\n            [options]=\"virtualScrollOptions\"\n        >\n            <ng-template caxTemplate=\"content\" let-items let-scrollerOptions=\"options\">\n                <ng-container *ngTemplateOutlet=\"buildInTable; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n            </ng-template>\n        </cax-scroller>\n        <ng-container *ngIf=\"!virtualScroll\">\n            <ng-container *ngTemplateOutlet=\"buildInTable; context: { $implicit: processedData, options: { columns } }\"></ng-container>\n        </ng-container>\n\n        <ng-template #buildInTable let-items let-scrollerOptions=\"options\">\n            <table\n                #table\n                role=\"table\"\n                [ngClass]=\"{ 'cax-datatable-table': true, 'cax-datatable-scrollable-table': scrollable, 'cax-datatable-resizable-table': resizableColumns, 'cax-datatable-resizable-table-fit': resizableColumns && columnResizeMode === 'fit' }\"\n                [class]=\"tableStyleClass\"\n                [ngStyle]=\"tableStyle\"\n                [attr.id]=\"id + '-table'\"\n            >\n                <ng-container *ngTemplateOutlet=\"colGroupTemplate; context: { $implicit: scrollerOptions.columns }\"></ng-container>\n                <thead role=\"rowgroup\" #thead class=\"cax-datatable-thead\">\n                    <ng-container *ngTemplateOutlet=\"headerGroupedTemplate || headerTemplate; context: { $implicit: scrollerOptions.columns }\"></ng-container>\n                </thead>\n                <tbody\n                    role=\"rowgroup\"\n                    class=\"cax-datatable-tbody cax-datatable-frozen-tbody\"\n                    *ngIf=\"frozenValue || frozenBodyTemplate\"\n                    [value]=\"frozenValue\"\n                    [frozenRows]=\"true\"\n                    [caxTableBody]=\"scrollerOptions.columns\"\n                    [caxTableBodyTemplate]=\"frozenBodyTemplate\"\n                    [frozen]=\"true\"\n                ></tbody>\n                <tbody\n                    role=\"rowgroup\"\n                    class=\"cax-datatable-tbody\"\n                    [ngClass]=\"scrollerOptions.contentStyleClass\"\n                    [ngStyle]=\"scrollerOptions.contentStyle\"\n                    [value]=\"dataToRender(scrollerOptions.rows)\"\n                    [caxTableBody]=\"scrollerOptions.columns\"\n                    [caxTableBodyTemplate]=\"bodyTemplate\"\n                    [scrollerOptions]=\"scrollerOptions\"\n                ></tbody>\n                <tbody\n                    role=\"rowgroup\"\n                    *ngIf=\"scrollerOptions.spacerStyle\"\n                    [ngStyle]=\"{ height: 'calc(' + scrollerOptions.spacerStyle.height + ' - ' + scrollerOptions.rows.length * scrollerOptions.itemSize + 'px)' }\"\n                    class=\"cax-datatable-scroller-spacer\"\n                ></tbody>\n                <tfoot role=\"rowgroup\" *ngIf=\"footerGroupedTemplate || footerTemplate\" #tfoot class=\"cax-datatable-tfoot\">\n                    <ng-container *ngTemplateOutlet=\"footerGroupedTemplate || footerTemplate; context: { $implicit: scrollerOptions.columns }\"></ng-container>\n                </tfoot>\n            </table>\n        </ng-template>\n    </div>\n\n    <cax-tablePaginator\n        [rows]=\"rows\"\n        [first]=\"first\"\n        [totalRecords]=\"totalRecords\"\n        [rowsPerPageOptions]=\"rowsPerPageOptions\"\n        [showPrevNext]=\"showPrevNext\"\n        [showResultsPerPage]=\"showResultsPerPage\"\n        [alignment]=\"paginatorAlignment\"\n        (onPerPageChange)=\"onPageChange($event)\"\n        (onPrevClick)=\"onPrevClickChange($event)\"\n        (onNextClick)=\"onNextClickChange($event)\"\n        *ngIf=\"paginator && (paginatorPosition === 'bottom' || paginatorPosition == 'both')\"\n    ></cax-tablePaginator>\n\n    <div *ngIf=\"summaryTemplate\" class=\"cax-datatable-footer\">\n        <ng-container *ngTemplateOutlet=\"summaryTemplate\"></ng-container>\n    </div>\n\n    <div\n        #resizeHelper\n        class=\"cax-column-resizer-helper\"\n        [ngStyle]=\"{\n                    display: 'none'\n                }\"\n        *ngIf=\"resizableColumns\"\n    ></div>\n    <span\n        #reorderIndicatorUp\n        class=\"cax-datatable-reorder-indicator-up\"\n        [ngStyle]=\"{\n                    display: 'none'\n                }\"\n        *ngIf=\"reorderableColumns\"\n    >\n        <ArrowDownIcon *ngIf=\"!reorderIndicatorUpIconTemplate\" />\n        <ng-template *ngTemplateOutlet=\"reorderIndicatorUpIconTemplate\"></ng-template>\n    </span>\n    <span\n        #reorderIndicatorDown\n        class=\"cax-datatable-reorder-indicator-down\"\n        [ngStyle]=\"{\n                    display: 'none'\n                }\"\n        *ngIf=\"reorderableColumns\"\n    >\n        <ArrowUpIcon *ngIf=\"!reorderIndicatorDownIconTemplate\" />\n        <ng-template *ngTemplateOutlet=\"reorderIndicatorDownIconTemplate\"></ng-template>\n    </span>\n</div>\n", styles: ["@layer cax{.cax-datatable{position:relative}.cax-datatable>.cax-datatable-wrapper{overflow:auto;border-radius:12px}.cax-datatable-wrapper::-webkit-scrollbar{width:10px;height:10px}.cax-datatable-wrapper::-webkit-scrollbar-track{background:var(--neutral-25);border-radius:12px}.cax-datatable-wrapper::-webkit-scrollbar-thumb{background:var(--neutral-100);border-radius:12px}.cax-datatable-table{border-spacing:0px;width:100%}.cax-datatable .cax-sortable-column{-webkit-user-select:none;user-select:none}.cax-datatable .cax-sortable-column .cax-column-title,.cax-datatable .cax-sortable-column .cax-sortable-column-icon,.cax-datatable .cax-sortable-column .cax-sortable-column-badge{vertical-align:middle}.cax-datatable thead th>div.flex{width:100%}.cax-datatable .cax-sortable-column .cax-icon-wrapper{display:inline}.cax-datatable .cax-sortable-column .cax-sortable-column-badge{display:inline-flex;align-items:center;justify-content:center}.cax-datatable-hoverable-rows .cax-selectable-row{cursor:pointer}.cax-datatable-scrollable>.cax-datatable-wrapper{position:relative}.cax-datatable-scrollable-table>.cax-datatable-thead{position:sticky;top:0;z-index:30}.cax-datatable-scrollable-table>.cax-datatable-frozen-tbody{position:sticky;z-index:1}.cax-datatable-scrollable-table>.cax-datatable-tfoot{position:sticky;bottom:0;z-index:1}.cax-datatable-scrollable .cax-frozen-column{position:sticky;z-index:20}.cax-datatable-scrollable th.cax-frozen-column{z-index:31;background:var(--neutral-50)}.cax-datatable-scrollable td.cax-frozen-column{z-index:20;background:var(--neutral-25)}.cax-datatable-flex-scrollable{display:flex;flex-direction:column;height:100%}.cax-datatable-flex-scrollable>.cax-datatable-wrapper{display:flex;flex-direction:column;flex:1;height:100%}.cax-datatable-scrollable-table>.cax-datatable-tbody>.cax-rowgroucax-header{position:sticky;z-index:2}.cax-datatable-resizable-table>.cax-datatable-thead>tr>th,.cax-datatable-resizable-table>.cax-datatable-tfoot>tr>td,.cax-datatable-resizable-table>.cax-datatable-tbody>tr>td{overflow:hidden;white-space:nowrap}.cax-datatable-resizable-table>.cax-datatable-thead>tr>th.cax-resizable-column:not(.cax-frozen-column){background-clip:padding-box;position:relative}.cax-datatable-resizable-table-fit>.cax-datatable-thead>tr>th.cax-resizable-column:last-child .cax-column-resizer{display:none}.cax-datatable .cax-column-resizer{display:block;position:absolute!important;top:0;right:0;margin:0;width:.5rem;height:100%;padding:0;cursor:col-resize;border:1px solid transparent}.cax-datatable .cax-column-resizer-helper{width:1px;position:absolute;z-index:10;display:none}.cax-datatable .cax-row-editor-init,.cax-datatable .cax-row-editor-save,.cax-datatable .cax-row-editor-cancel,.cax-datatable .cax-row-toggler{display:inline-flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.cax-datatable-reorder-indicator-up,.cax-datatable-reorder-indicator-down{position:absolute}.cax-datatable-reorderablerow-handle,[caxReorderableColumn]{cursor:move}.cax-datatable .cax-datatable-loading-overlay{position:absolute;display:flex;align-items:center;justify-content:center;z-index:3}.cax-column-filter-row{display:flex;align-items:center;width:100%}.cax-column-filter-row i{font-size:20px}cax-columnfilter{margin-left:auto;order:3;float:right}.cax-column-filter-menu{display:inline-flex;align-items:center;vertical-align:middle;margin-left:auto;order:3;float:right}.cax-column-filter-menu i{font-size:20px}.cax-column-filter-row cax-columnfilterformelement,cax-columnfilterformelement{flex:1 1 auto;display:contents}.cax-column-filter-menu-button,.cax-column-filter-clear-button{display:inline-flex;justify-content:center;align-items:center;cursor:pointer;text-decoration:none;overflow:hidden;position:relative}.cax-column-filter-menu-button:disabled{opacity:.5}.cax-column-filter-overlay{position:absolute;top:0;left:0;padding:16px;display:flex;flex-direction:column;gap:8px}.cax-column-filter-menu-container,.cax-column-filter-constraints,.cax-column-filter-constraint{display:flex;flex-direction:column;gap:8px}.cax-fluid{display:block}.cax-fluid .cax-inputtext,.cax-fluid .cax-dropdown,.cax-fluid .cax-inputnumber,.cax-fluid .cax-calendar,.cax-fluid .cax-dropdown .cax-dropdown-label{width:100%}.cax-fluid .cax-checkbox-icon{width:12px!important;height:12px!important}.cax-column-filter-row-items{margin:0;padding:0;list-style:none}.cax-column-filter-row-item{cursor:pointer}.cax-column-filter-add-button,.cax-column-filter-remove-button{justify-content:center}.cax-column-filter-add-button .cax-button-label,.cax-column-filter-remove-button .cax-button-label{flex-grow:0}.cax-column-filter-buttonbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:8px;border-top:1px solid var(--neutral-100)}.cax-column-filter-buttonbar .cax-button{width:auto;flex:1}.cax-datatable-tbody>tr>td>.cax-column-title{display:none}.cax-datatable-scroller-spacer{display:flex}.cax-datatable .cax-scroller .cax-scroller-loading{transform:none!important;min-height:0;position:sticky;top:0;left:0}}.cax-datatable .cax-editable-column .cax-inputtext{width:100%;box-shadow:none;border:0;padding:0;line-height:normal}.cax-datatable.cax-datatable-font-sm .cax-datatable-tbody>tr>td{font-size:12px}.cax-datatable.cax-datatable-font-sm .cax-datatable-tbody>tr>td .cax-inputtext{font-size:12px}.cax-datatable.cax-datatable-font-md .cax-datatable-tbody>tr>td{font-size:14px}.cax-datatable.cax-datatable-font-md .cax-datatable-tbody>tr>td .cax-inputtext{font-size:14px}.cax-datatable.cax-datatable-font-lg .cax-datatable-tbody>tr>td{font-size:16px}.cax-datatable.cax-datatable-font-lg .cax-datatable-tbody>tr>td .cax-inputtext{font-size:16px}.cax-datatable.cax-datatable-font-xl .cax-datatable-tbody>tr>td{font-size:18px}.cax-datatable.cax-datatable-font-xl .cax-datatable-tbody>tr>td .cax-inputtext{font-size:18px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:32px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:40px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:60px}.cax-datatable.cax-datatable-font-sm.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:74px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:36px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:48px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:64px}.cax-datatable.cax-datatable-font-md.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:80px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:40px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:48px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:72px}.cax-datatable.cax-datatable-font-lg.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:96px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-sm .cax-datatable-tbody>tr>td{height:48px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-md .cax-datatable-tbody>tr>td{height:60px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-lg .cax-datatable-tbody>tr>td{height:88px}.cax-datatable.cax-datatable-font-xl.cax-datatable-row-xl .cax-datatable-tbody>tr>td{height:116px}.cax-cell-highlight-default{border:1px solid var(--primary-500)!important}.cax-cell-highlight-error{border:1px solid var(--error-600)!important}.cax-cell-background-error{background:var(--error-50)}.cax-sort-icon-button{border:0;width:28px;height:28px!important;display:flex;background:transparent;cursor:pointer;padding:0!important;align-items:center;justify-content:center;border-radius:4px}.cax-sort-icon-button i{font-size:20px}.cax-sort-icon-button:disabled{opacity:.5;cursor:context-menu}.cax-sort-icon-button:hover{background-color:var(--neutral-150)}.cax-sort-icon-button.cax-sort-icon-button-active{background-color:var(--primary-75)}cax-sorticon,cax-sortIcon{display:inline-flex;align-items:center;vertical-align:middle;margin-left:4px;order:2;float:right}.cax-column-filter-menu~.cax-column-filter-menu,.cax-column-filter-menu~cax-sorticon,.cax-column-filter-menu~cax-sortIcon,cax-sorticon~.cax-column-filter-menu,cax-sorticon~cax-sorticon,cax-sorticon~cax-sortIcon,cax-sortIcon~.cax-column-filter-menu,cax-sortIcon~cax-sorticon,cax-sortIcon~cax-sortIcon{margin-left:8px;float:right}.cax-table-checkbox-container{display:flex;justify-content:center}cax-cellEditor .cax-inputtextarea{height:100%!important}cax-cellEditor textarea:focus{outline:none!important}cax-cellEditor input:focus{outline:none!important}\n"] }]
         }], ctorParameters: () => [{ type: Document, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]