primeng 18.0.5-lts → 18.0.7-lts

package/fesm2022/primeng-table.mjs

@@ -2,7 +2,7 @@ import { trigger, transition, style, animate } from '@angular/animations';
 import * as i1 from '@angular/common';
 import { isPlatformBrowser, DOCUMENT, CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Injectable, EventEmitter, inject, NgZone, numberAttribute, booleanAttribute, ViewEncapsulation, ChangeDetectionStrategy, Component, ContentChild, ContentChildren, ViewChild, Output, Input, Directive, HostListener, PLATFORM_ID, Inject, Optional, forwardRef, ElementRef, NgModule } from '@angular/core';
+import { Injectable, EventEmitter, inject, NgZone, numberAttribute, booleanAttribute, ViewEncapsulation, ChangeDetectionStrategy, Component, ContentChild, ContentChildren, ViewChild, Output, Input, Directive, PLATFORM_ID, Inject, ElementRef, HostListener, Optional, forwardRef, NgModule } from '@angular/core';
 import * as i5 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
 import * as i3 from 'primeng/api';
@@ -175,7 +175,7 @@ const theme = ({ dt }) => `
     cursor: move;
 }
 
-.p-datatable-mask {
+.p-datatable-mask.p-overlay-mask {
     position: absolute;
     display: flex;
     align-items: center;
@@ -629,7 +629,7 @@ p-datatable-gridlines .p-datatable-tbody > tr:last-child > td {
 
 .p-datatable-tbody > tr.p-datatable-row-selected .p-datatable-row-toggle-button:hover {
     background: ${dt('datatable.row.toggle.button.selected.hover.background')};
-    ${dt('datatable.row.toggle.button.selected.hover.color')};
+    color: ${dt('datatable.row.toggle.button.selected.hover.color')};
 }
 
 .p-datatable-row-toggle-button:focus-visible {
@@ -1154,7 +1154,7 @@ function Table_p_scroller_7_Template(rf, ctx) { if (rf & 1) {
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵstyleMap(i0.ɵɵpureFunction1(15, _c41, ctx_r0.scrollHeight !== "flex" ? ctx_r0.scrollHeight : undefined));
-    i0.ɵɵproperty("items", ctx_r0.processedData)("columns", ctx_r0.columns)("scrollHeight", ctx_r0.scrollHeight !== "flex" ? undefined : "100%")("itemSize", ctx_r0.virtualScrollItemSize || ctx_r0._virtualRowHeight)("step", ctx_r0.rows)("delay", ctx_r0.lazy ? ctx_r0.virtualScrollDelay : 0)("inline", true)("lazy", ctx_r0.lazy)("loaderDisabled", true)("showSpacer", false)("showLoader", ctx_r0.loadingBodyTemplate || ctx_r0._loadingBodyTemplate)("options", ctx_r0.virtualScrollOptions)("autoSize", true);
+    i0.ɵɵproperty("items", ctx_r0.processedData)("columns", ctx_r0.columns)("scrollHeight", ctx_r0.scrollHeight !== "flex" ? undefined : "100%")("itemSize", ctx_r0.virtualScrollItemSize || ctx_r0._virtualRowHeight)("step", ctx_r0.rows)("delay", ctx_r0.lazy ? ctx_r0.virtualScrollDelay : 0)("inline", true)("autoSize", true)("lazy", ctx_r0.lazy)("loaderDisabled", true)("showSpacer", false)("showLoader", ctx_r0.loadingBodyTemplate || ctx_r0._loadingBodyTemplate)("options", ctx_r0.virtualScrollOptions);
 } }
 function Table_ng_container_8_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0);
@@ -1720,6 +1720,7 @@ const _c56 = ["removeruleicon"];
 const _c57 = ["addruleicon"];
 const _c58 = ["clearfiltericon"];
 const _c59 = ["clearBtn"];
+const _c60 = a0 => ({ hasFilter: a0 });
 function ColumnFilter_p_columnFilterFormElement_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "p-columnFilterFormElement", 8);
 } if (rf & 2) {
@@ -1740,10 +1741,10 @@ function ColumnFilter_p_button_2_ng_template_1_span_1_Template(rf, ctx) { if (rf
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.filterIconTemplate || ctx_r0._filterIconTemplate);
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.filterIconTemplate || ctx_r0._filterIconTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c60, ctx_r0.hasFilter));
 } }
 function ColumnFilter_p_button_2_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, ColumnFilter_p_button_2_ng_template_1_FilterIcon_0_Template, 1, 0, "FilterIcon", 10)(1, ColumnFilter_p_button_2_ng_template_1_span_1_Template, 2, 1, "span", 11);
+    i0.ɵɵtemplate(0, ColumnFilter_p_button_2_ng_template_1_FilterIcon_0_Template, 1, 0, "FilterIcon", 10)(1, ColumnFilter_p_button_2_ng_template_1_span_1_Template, 2, 4, "span", 11);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("ngIf", !ctx_r0.filterIconTemplate && !ctx_r0._filterIconTemplate);
@@ -1770,7 +1771,7 @@ function ColumnFilter_p_button_3_ng_template_1_1_Template(rf, ctx) { if (rf & 1)
     i0.ɵɵtemplate(0, ColumnFilter_p_button_3_ng_template_1_1_ng_template_0_Template, 0, 0, "ng-template");
 } }
 function ColumnFilter_p_button_3_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, ColumnFilter_p_button_3_ng_template_1_FilterSlashIcon_0_Template, 1, 0, "FilterSlashIcon", 10)(1, ColumnFilter_p_button_3_ng_template_1_1_Template, 1, 0, null, 13);
+    i0.ɵɵtemplate(0, ColumnFilter_p_button_3_ng_template_1_FilterSlashIcon_0_Template, 1, 0, "FilterSlashIcon", 10)(1, ColumnFilter_p_button_3_ng_template_1_1_Template, 1, 0, null, 15);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("ngIf", !ctx_r0.clearFilterIconTemplate && !ctx_r0._clearFilterIconTemplate);
@@ -1859,7 +1860,7 @@ function ColumnFilter_div_4_ng_template_3_div_2_p_button_4_Template(rf, ctx) { i
     const _r12 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "p-button", 28);
     i0.ɵɵlistener("onClick", function ColumnFilter_div_4_ng_template_3_div_2_p_button_4_Template_p_button_onClick_0_listener() { i0.ɵɵrestoreView(_r12); const fieldConstraint_r11 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.removeConstraint(fieldConstraint_r11)); });
-    i0.ɵɵtemplate(1, ColumnFilter_div_4_ng_template_3_div_2_p_button_4_TrashIcon_1_Template, 1, 0, "TrashIcon", 10)(2, ColumnFilter_div_4_ng_template_3_div_2_p_button_4_2_Template, 1, 0, null, 13);
+    i0.ɵɵtemplate(1, ColumnFilter_div_4_ng_template_3_div_2_p_button_4_TrashIcon_1_Template, 1, 0, "TrashIcon", 10)(2, ColumnFilter_div_4_ng_template_3_div_2_p_button_4_2_Template, 1, 0, null, 15);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(4);
@@ -1898,7 +1899,7 @@ function ColumnFilter_div_4_ng_template_3_div_3_Template(rf, ctx) { if (rf & 1)
     const _r13 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div")(1, "p-button", 29);
     i0.ɵɵlistener("onClick", function ColumnFilter_div_4_ng_template_3_div_3_Template_p_button_onClick_1_listener() { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.addConstraint()); });
-    i0.ɵɵtemplate(2, ColumnFilter_div_4_ng_template_3_div_3_PlusIcon_2_Template, 1, 0, "PlusIcon", 10)(3, ColumnFilter_div_4_ng_template_3_div_3_3_Template, 1, 0, null, 13);
+    i0.ɵɵtemplate(2, ColumnFilter_div_4_ng_template_3_div_3_PlusIcon_2_Template, 1, 0, "PlusIcon", 10)(3, ColumnFilter_div_4_ng_template_3_div_3_3_Template, 1, 0, null, 15);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(3);
@@ -1960,9 +1961,9 @@ function ColumnFilter_div_4_ng_container_5_Template(rf, ctx) { if (rf & 1) {
 } }
 function ColumnFilter_div_4_Template(rf, ctx) { if (rf & 1) {
     const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 15);
+    i0.ɵɵelementStart(0, "div", 16);
     i0.ɵɵlistener("click", function ColumnFilter_div_4_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onContentClick()); })("@overlayAnimation.start", function ColumnFilter_div_4_Template_div_animation_overlayAnimation_start_0_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onOverlayAnimationStart($event)); })("@overlayAnimation.done", function ColumnFilter_div_4_Template_div_animation_overlayAnimation_done_0_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onOverlayAnimationEnd($event)); })("keydown.escape", function ColumnFilter_div_4_Template_div_keydown_escape_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onEscape()); });
-    i0.ɵɵtemplate(1, ColumnFilter_div_4_ng_container_1_Template, 1, 0, "ng-container", 16)(2, ColumnFilter_div_4_ul_2_Template, 5, 5, "ul", 17)(3, ColumnFilter_div_4_ng_template_3_Template, 7, 7, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor)(5, ColumnFilter_div_4_ng_container_5_Template, 1, 0, "ng-container", 16);
+    i0.ɵɵtemplate(1, ColumnFilter_div_4_ng_container_1_Template, 1, 0, "ng-container", 13)(2, ColumnFilter_div_4_ul_2_Template, 5, 5, "ul", 17)(3, ColumnFilter_div_4_ng_template_3_Template, 7, 7, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor)(5, ColumnFilter_div_4_ng_container_5_Template, 1, 0, "ng-container", 13);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const menu_r16 = i0.ɵɵreference(4);
@@ -1976,7 +1977,7 @@ function ColumnFilter_div_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(3);
     i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.footerTemplate || ctx_r0._footerTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction1(12, _c44, ctx_r0.field));
 } }
-const _c60 = (a0, a1, a2, a3, a4, a5, a6, a7, a8, a9, a10, a11, a12, a13, a14, a15) => ({ $implicit: a0, filterCallback: a1, type: a2, field: a3, filterConstraint: a4, placeholder: a5, minFractionDigits: a6, maxFractionDigits: a7, prefix: a8, suffix: a9, locale: a10, localeMatcher: a11, currency: a12, currencyDisplay: a13, useGrouping: a14, showButtons: a15 });
+const _c61 = (a0, a1, a2, a3, a4, a5, a6, a7, a8, a9, a10, a11, a12, a13, a14, a15) => ({ $implicit: a0, filterCallback: a1, type: a2, field: a3, filterConstraint: a4, placeholder: a5, minFractionDigits: a6, maxFractionDigits: a7, prefix: a8, suffix: a9, locale: a10, localeMatcher: a11, currency: a12, currencyDisplay: a13, useGrouping: a14, showButtons: a15 });
 function ColumnFilterFormElement_ng_container_0_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0);
 } }
@@ -1987,7 +1988,7 @@ function ColumnFilterFormElement_ng_container_0_Template(rf, ctx) { if (rf & 1)
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.filterTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunctionV(2, _c60, [ctx_r0.filterConstraint.value, ctx_r0.filterCallback, ctx_r0.type, ctx_r0.field, ctx_r0.filterConstraint, ctx_r0.placeholder, ctx_r0.minFractionDigits, ctx_r0.maxFractionDigits, ctx_r0.prefix, ctx_r0.suffix, ctx_r0.locale, ctx_r0.localeMatcher, ctx_r0.currency, ctx_r0.currencyDisplay, ctx_r0.useGrouping, ctx_r0.showButtons]));
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.filterTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunctionV(2, _c61, [ctx_r0.filterConstraint.value, ctx_r0.filterCallback, ctx_r0.type, ctx_r0.field, ctx_r0.filterConstraint, ctx_r0.placeholder, ctx_r0.minFractionDigits, ctx_r0.maxFractionDigits, ctx_r0.prefix, ctx_r0.suffix, ctx_r0.locale, ctx_r0.localeMatcher, ctx_r0.currency, ctx_r0.currencyDisplay, ctx_r0.useGrouping, ctx_r0.showButtons]));
 } }
 function ColumnFilterFormElement_ng_template_1_input_1_Template(rf, ctx) { if (rf & 1) {
     const _r2 = i0.ɵɵgetCurrentView();
@@ -2015,7 +2016,7 @@ function ColumnFilterFormElement_ng_template_1_p_checkbox_3_Template(rf, ctx) {
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("indeterminate", true)("binary", true)("ngModel", ctx_r0.filterConstraint == null ? null : ctx_r0.filterConstraint.value);
+    i0.ɵɵproperty("indeterminate", (ctx_r0.filterConstraint == null ? null : ctx_r0.filterConstraint.value) === null)("binary", true)("ngModel", ctx_r0.filterConstraint == null ? null : ctx_r0.filterConstraint.value);
 } }
 function ColumnFilterFormElement_ng_template_1_p_datepicker_4_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
@@ -3443,7 +3444,7 @@ class Table extends BaseComponent {
             }
         }
     }
-    selectRange(event, rowIndex) {
+    selectRange(event, rowIndex, isMetaKeySelection) {
         let rangeStart, rangeEnd;
         if (this.anchorRowIndex > rowIndex) {
             rangeStart = rowIndex;
@@ -3464,7 +3465,7 @@ class Table extends BaseComponent {
         let rangeRowsData = [];
         for (let i = rangeStart; i <= rangeEnd; i++) {
             let rangeRowData = this.filteredValue ? this.filteredValue[i] : this.value[i];
-            if (!this.isSelected(rangeRowData)) {
+            if (!this.isSelected(rangeRowData) && !isMetaKeySelection) {
                 if (!this.isRowSelectable(rangeRowData, rowIndex)) {
                     continue;
                 }
@@ -4322,7 +4323,11 @@ class Table extends BaseComponent {
     }
     saveColumnWidths(state) {
         let widths = [];
-        let headers = DomHandler.find(this.containerViewChild?.nativeElement, '.p-datatable-thead > tr > th');
+        let headers = [];
+        const container = this.containerViewChild?.nativeElement;
+        if (container) {
+            headers = DomHandler.find(container, '.p-datatable-thead > tr > th');
+        }
         headers.forEach((header) => widths.push(DomHandler.getOuterWidth(header)));
         state.columnWidths = widths.join(',');
         if (this.columnResizeMode === 'expand') {
@@ -4556,7 +4561,7 @@ class Table extends BaseComponent {
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.tableHeaderViewChild = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.tableFooterViewChild = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.scroller = _t.first);
-        } }, inputs: { frozenColumns: "frozenColumns", frozenValue: "frozenValue", style: "style", styleClass: "styleClass", tableStyle: "tableStyle", tableStyleClass: "tableStyleClass", paginator: [2, "paginator", "paginator", booleanAttribute], pageLinks: [2, "pageLinks", "pageLinks", numberAttribute], rowsPerPageOptions: "rowsPerPageOptions", alwaysShowPaginator: [2, "alwaysShowPaginator", "alwaysShowPaginator", booleanAttribute], paginatorPosition: "paginatorPosition", paginatorStyleClass: "paginatorStyleClass", paginatorDropdownAppendTo: "paginatorDropdownAppendTo", paginatorDropdownScrollHeight: "paginatorDropdownScrollHeight", currentPageReportTemplate: "currentPageReportTemplate", showCurrentPageReport: [2, "showCurrentPageReport", "showCurrentPageReport", booleanAttribute], showJumpToPageDropdown: [2, "showJumpToPageDropdown", "showJumpToPageDropdown", booleanAttribute], showJumpToPageInput: [2, "showJumpToPageInput", "showJumpToPageInput", booleanAttribute], showFirstLastIcon: [2, "showFirstLastIcon", "showFirstLastIcon", booleanAttribute], showPageLinks: [2, "showPageLinks", "showPageLinks", booleanAttribute], defaultSortOrder: [2, "defaultSortOrder", "defaultSortOrder", numberAttribute], sortMode: "sortMode", resetPageOnSort: [2, "resetPageOnSort", "resetPageOnSort", booleanAttribute], selectionMode: "selectionMode", selectionPageOnly: [2, "selectionPageOnly", "selectionPageOnly", booleanAttribute], contextMenuSelection: "contextMenuSelection", contextMenuSelectionMode: "contextMenuSelectionMode", dataKey: "dataKey", metaKeySelection: [2, "metaKeySelection", "metaKeySelection", booleanAttribute], rowSelectable: "rowSelectable", rowTrackBy: "rowTrackBy", lazy: [2, "lazy", "lazy", booleanAttribute], lazyLoadOnInit: [2, "lazyLoadOnInit", "lazyLoadOnInit", booleanAttribute], compareSelectionBy: "compareSelectionBy", csvSeparator: "csvSeparator", exportFilename: "exportFilename", filters: "filters", globalFilterFields: "globalFilterFields", filterDelay: [2, "filterDelay", "filterDelay", numberAttribute], filterLocale: "filterLocale", expandedRowKeys: "expandedRowKeys", editingRowKeys: "editingRowKeys", rowExpandMode: "rowExpandMode", scrollable: [2, "scrollable", "scrollable", booleanAttribute], scrollDirection: "scrollDirection", rowGroupMode: "rowGroupMode", scrollHeight: "scrollHeight", virtualScroll: [2, "virtualScroll", "virtualScroll", booleanAttribute], virtualScrollItemSize: [2, "virtualScrollItemSize", "virtualScrollItemSize", numberAttribute], virtualScrollOptions: "virtualScrollOptions", virtualScrollDelay: [2, "virtualScrollDelay", "virtualScrollDelay", numberAttribute], frozenWidth: "frozenWidth", responsive: "responsive", contextMenu: "contextMenu", resizableColumns: [2, "resizableColumns", "resizableColumns", booleanAttribute], columnResizeMode: "columnResizeMode", reorderableColumns: [2, "reorderableColumns", "reorderableColumns", booleanAttribute], loading: [2, "loading", "loading", booleanAttribute], loadingIcon: "loadingIcon", showLoader: [2, "showLoader", "showLoader", booleanAttribute], rowHover: [2, "rowHover", "rowHover", booleanAttribute], customSort: [2, "customSort", "customSort", booleanAttribute], showInitialSortBadge: [2, "showInitialSortBadge", "showInitialSortBadge", booleanAttribute], autoLayout: [2, "autoLayout", "autoLayout", booleanAttribute], exportFunction: "exportFunction", exportHeader: "exportHeader", stateKey: "stateKey", stateStorage: "stateStorage", editMode: "editMode", groupRowsBy: "groupRowsBy", size: "size", showGridlines: [2, "showGridlines", "showGridlines", booleanAttribute], stripedRows: [2, "stripedRows", "stripedRows", booleanAttribute], groupRowsByOrder: [2, "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", virtualRowHeight: "virtualRowHeight", selectAll: "selectAll" }, outputs: { contextMenuSelectionChange: "contextMenuSelectionChange", selectAllChange: "selectAllChange", selectionChange: "selectionChange", onRowSelect: "onRowSelect", onRowUnselect: "onRowUnselect", onPage: "onPage", 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" }, features: [i0.ɵɵProvidersFeature([TableService, TableStyle]), i0.ɵɵInputTransformsFeature, i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 16, vars: 17, consts: [["container", ""], ["wrapper", ""], ["buildInTable", ""], ["scroller", ""], ["content", ""], ["table", ""], ["thead", ""], ["tfoot", ""], ["resizeHelper", ""], ["reorderIndicatorUp", ""], ["reorderIndicatorDown", ""], [3, "ngStyle", "ngClass"], [3, "ngClass", 4, "ngIf"], [3, "rows", "first", "totalRecords", "pageLinkSize", "alwaysShow", "rowsPerPageOptions", "templateLeft", "templateRight", "dropdownAppendTo", "dropdownScrollHeight", "currentPageReportTemplate", "showFirstLastIcon", "dropdownItemTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showPageLinks", "styleClass", "locale", "onPageChange", 4, "ngIf"], [3, "ngClass", "ngStyle"], [3, "items", "columns", "style", "scrollHeight", "itemSize", "step", "delay", "inline", "lazy", "loaderDisabled", "showSpacer", "showLoader", "options", "autoSize", "onLazyLoad", 4, "ngIf"], [4, "ngIf"], ["style", "display:none", 3, "ngClass", 4, "ngIf"], ["style", "display: none;", 3, "ngClass", 4, "ngIf"], [3, "ngClass"], [3, "class", 4, "ngIf"], [3, "spin", "styleClass", 4, "ngIf"], [3, "spin", "styleClass"], [4, "ngTemplateOutlet"], [3, "onPageChange", "rows", "first", "totalRecords", "pageLinkSize", "alwaysShow", "rowsPerPageOptions", "templateLeft", "templateRight", "dropdownAppendTo", "dropdownScrollHeight", "currentPageReportTemplate", "showFirstLastIcon", "dropdownItemTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showPageLinks", "styleClass", "locale"], ["pTemplate", "dropdownicon"], ["pTemplate", "firstpagelinkicon"], ["pTemplate", "previouspagelinkicon"], ["pTemplate", "lastpagelinkicon"], ["pTemplate", "nextpagelinkicon"], [3, "onLazyLoad", "items", "columns", "scrollHeight", "itemSize", "step", "delay", "inline", "lazy", "loaderDisabled", "showSpacer", "showLoader", "options", "autoSize"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], ["role", "table", 3, "ngClass"], ["role", "rowgroup", 3, "ngClass", "ngStyle"], ["role", "rowgroup", 3, "ngClass", "value", "frozenRows", "pTableBody", "pTableBodyTemplate", "frozen", 4, "ngIf"], ["role", "rowgroup", 3, "ngClass", "value", "pTableBody", "pTableBodyTemplate", "scrollerOptions"], ["role", "rowgroup", 3, "style", "ngClass", 4, "ngIf"], ["role", "rowgroup", 3, "ngClass", 4, "ngIf"], ["role", "rowgroup", 3, "ngClass", "value", "frozenRows", "pTableBody", "pTableBodyTemplate", "frozen"], ["role", "rowgroup", 3, "ngClass"], [2, "display", "none", 3, "ngClass"]], template: function Table_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { frozenColumns: "frozenColumns", frozenValue: "frozenValue", style: "style", styleClass: "styleClass", tableStyle: "tableStyle", tableStyleClass: "tableStyleClass", paginator: [2, "paginator", "paginator", booleanAttribute], pageLinks: [2, "pageLinks", "pageLinks", numberAttribute], rowsPerPageOptions: "rowsPerPageOptions", alwaysShowPaginator: [2, "alwaysShowPaginator", "alwaysShowPaginator", booleanAttribute], paginatorPosition: "paginatorPosition", paginatorStyleClass: "paginatorStyleClass", paginatorDropdownAppendTo: "paginatorDropdownAppendTo", paginatorDropdownScrollHeight: "paginatorDropdownScrollHeight", currentPageReportTemplate: "currentPageReportTemplate", showCurrentPageReport: [2, "showCurrentPageReport", "showCurrentPageReport", booleanAttribute], showJumpToPageDropdown: [2, "showJumpToPageDropdown", "showJumpToPageDropdown", booleanAttribute], showJumpToPageInput: [2, "showJumpToPageInput", "showJumpToPageInput", booleanAttribute], showFirstLastIcon: [2, "showFirstLastIcon", "showFirstLastIcon", booleanAttribute], showPageLinks: [2, "showPageLinks", "showPageLinks", booleanAttribute], defaultSortOrder: [2, "defaultSortOrder", "defaultSortOrder", numberAttribute], sortMode: "sortMode", resetPageOnSort: [2, "resetPageOnSort", "resetPageOnSort", booleanAttribute], selectionMode: "selectionMode", selectionPageOnly: [2, "selectionPageOnly", "selectionPageOnly", booleanAttribute], contextMenuSelection: "contextMenuSelection", contextMenuSelectionMode: "contextMenuSelectionMode", dataKey: "dataKey", metaKeySelection: [2, "metaKeySelection", "metaKeySelection", booleanAttribute], rowSelectable: "rowSelectable", rowTrackBy: "rowTrackBy", lazy: [2, "lazy", "lazy", booleanAttribute], lazyLoadOnInit: [2, "lazyLoadOnInit", "lazyLoadOnInit", booleanAttribute], compareSelectionBy: "compareSelectionBy", csvSeparator: "csvSeparator", exportFilename: "exportFilename", filters: "filters", globalFilterFields: "globalFilterFields", filterDelay: [2, "filterDelay", "filterDelay", numberAttribute], filterLocale: "filterLocale", expandedRowKeys: "expandedRowKeys", editingRowKeys: "editingRowKeys", rowExpandMode: "rowExpandMode", scrollable: [2, "scrollable", "scrollable", booleanAttribute], scrollDirection: "scrollDirection", rowGroupMode: "rowGroupMode", scrollHeight: "scrollHeight", virtualScroll: [2, "virtualScroll", "virtualScroll", booleanAttribute], virtualScrollItemSize: [2, "virtualScrollItemSize", "virtualScrollItemSize", numberAttribute], virtualScrollOptions: "virtualScrollOptions", virtualScrollDelay: [2, "virtualScrollDelay", "virtualScrollDelay", numberAttribute], frozenWidth: "frozenWidth", responsive: "responsive", contextMenu: "contextMenu", resizableColumns: [2, "resizableColumns", "resizableColumns", booleanAttribute], columnResizeMode: "columnResizeMode", reorderableColumns: [2, "reorderableColumns", "reorderableColumns", booleanAttribute], loading: [2, "loading", "loading", booleanAttribute], loadingIcon: "loadingIcon", showLoader: [2, "showLoader", "showLoader", booleanAttribute], rowHover: [2, "rowHover", "rowHover", booleanAttribute], customSort: [2, "customSort", "customSort", booleanAttribute], showInitialSortBadge: [2, "showInitialSortBadge", "showInitialSortBadge", booleanAttribute], autoLayout: [2, "autoLayout", "autoLayout", booleanAttribute], exportFunction: "exportFunction", exportHeader: "exportHeader", stateKey: "stateKey", stateStorage: "stateStorage", editMode: "editMode", groupRowsBy: "groupRowsBy", size: "size", showGridlines: [2, "showGridlines", "showGridlines", booleanAttribute], stripedRows: [2, "stripedRows", "stripedRows", booleanAttribute], groupRowsByOrder: [2, "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", virtualRowHeight: "virtualRowHeight", selectAll: "selectAll" }, outputs: { contextMenuSelectionChange: "contextMenuSelectionChange", selectAllChange: "selectAllChange", selectionChange: "selectionChange", onRowSelect: "onRowSelect", onRowUnselect: "onRowUnselect", onPage: "onPage", 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" }, features: [i0.ɵɵProvidersFeature([TableService, TableStyle]), i0.ɵɵInputTransformsFeature, i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 16, vars: 17, consts: [["container", ""], ["wrapper", ""], ["buildInTable", ""], ["scroller", ""], ["content", ""], ["table", ""], ["thead", ""], ["tfoot", ""], ["resizeHelper", ""], ["reorderIndicatorUp", ""], ["reorderIndicatorDown", ""], [3, "ngStyle", "ngClass"], [3, "ngClass", 4, "ngIf"], [3, "rows", "first", "totalRecords", "pageLinkSize", "alwaysShow", "rowsPerPageOptions", "templateLeft", "templateRight", "dropdownAppendTo", "dropdownScrollHeight", "currentPageReportTemplate", "showFirstLastIcon", "dropdownItemTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showPageLinks", "styleClass", "locale", "onPageChange", 4, "ngIf"], [3, "ngClass", "ngStyle"], [3, "items", "columns", "style", "scrollHeight", "itemSize", "step", "delay", "inline", "autoSize", "lazy", "loaderDisabled", "showSpacer", "showLoader", "options", "onLazyLoad", 4, "ngIf"], [4, "ngIf"], ["style", "display:none", 3, "ngClass", 4, "ngIf"], ["style", "display: none;", 3, "ngClass", 4, "ngIf"], [3, "ngClass"], [3, "class", 4, "ngIf"], [3, "spin", "styleClass", 4, "ngIf"], [3, "spin", "styleClass"], [4, "ngTemplateOutlet"], [3, "onPageChange", "rows", "first", "totalRecords", "pageLinkSize", "alwaysShow", "rowsPerPageOptions", "templateLeft", "templateRight", "dropdownAppendTo", "dropdownScrollHeight", "currentPageReportTemplate", "showFirstLastIcon", "dropdownItemTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showPageLinks", "styleClass", "locale"], ["pTemplate", "dropdownicon"], ["pTemplate", "firstpagelinkicon"], ["pTemplate", "previouspagelinkicon"], ["pTemplate", "lastpagelinkicon"], ["pTemplate", "nextpagelinkicon"], [3, "onLazyLoad", "items", "columns", "scrollHeight", "itemSize", "step", "delay", "inline", "autoSize", "lazy", "loaderDisabled", "showSpacer", "showLoader", "options"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], ["role", "table", 3, "ngClass"], ["role", "rowgroup", 3, "ngClass", "ngStyle"], ["role", "rowgroup", 3, "ngClass", "value", "frozenRows", "pTableBody", "pTableBodyTemplate", "frozen", 4, "ngIf"], ["role", "rowgroup", 3, "ngClass", "value", "pTableBody", "pTableBodyTemplate", "scrollerOptions"], ["role", "rowgroup", 3, "style", "ngClass", 4, "ngIf"], ["role", "rowgroup", 3, "ngClass", 4, "ngIf"], ["role", "rowgroup", 3, "ngClass", "value", "frozenRows", "pTableBody", "pTableBodyTemplate", "frozen"], ["role", "rowgroup", 3, "ngClass"], [2, "display", "none", 3, "ngClass"]], template: function Table_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 11, 0);
             i0.ɵɵtemplate(2, Table_div_2_Template, 3, 3, "div", 12)(3, Table_div_3_Template, 2, 2, "div", 12)(4, Table_p_paginator_4_Template, 6, 24, "p-paginator", 13);
             i0.ɵɵelementStart(5, "div", 14, 1);
@@ -4668,13 +4673,13 @@ class Table extends BaseComponent {
                     [step]="rows"
                     [delay]="lazy ? virtualScrollDelay : 0"
                     [inline]="true"
+                    [autoSize]="true"
                     [lazy]="lazy"
                     (onLazyLoad)="onLazyItemLoad($event)"
                     [loaderDisabled]="true"
                     [showSpacer]="false"
                     [showLoader]="loadingBodyTemplate || _loadingBodyTemplate"
                     [options]="virtualScrollOptions"
-                    [autoSize]="true"
                 >
                     <ng-template #content let-items let-scrollerOptions="options">
                         <ng-container *ngTemplateOutlet="buildInTable; context: { $implicit: items, options: scrollerOptions }"></ng-container>
@@ -5434,7 +5439,9 @@ class RowGroupHeader {
     }], () => [{ type: Table }], null); })();
 class FrozenColumn {
     el;
-    zone;
+    renderer;
+    document;
+    platformId;
     get frozen() {
         return this._frozen;
     }
@@ -5443,16 +5450,41 @@ class FrozenColumn {
         Promise.resolve(null).then(() => this.updateStickyPosition());
     }
     alignFrozen = 'left';
-    constructor(el, zone) {
+    resizeListener;
+    resizeObserver;
+    constructor(el, renderer, document, platformId) {
         this.el = el;
-        this.zone = zone;
+        this.renderer = renderer;
+        this.document = document;
+        this.platformId = platformId;
     }
     ngAfterViewInit() {
-        this.zone.runOutsideAngular(() => {
-            setTimeout(() => {
+        this.bindResizeListener();
+        this.observeChanges();
+    }
+    bindResizeListener() {
+        if (isPlatformBrowser(this.platformId)) {
+            if (!this.resizeListener) {
+                this.resizeListener = this.renderer.listen(this.document.defaultView, 'resize', () => {
+                    this.recalculateColumns();
+                });
+            }
+        }
+    }
+    unbindResizeListener() {
+        if (this.resizeListener) {
+            this.resizeListener();
+            this.resizeListener = null;
+        }
+    }
+    observeChanges() {
+        if (isPlatformBrowser(this.platformId)) {
+            const resizeObserver = new ResizeObserver(() => {
                 this.recalculateColumns();
-            }, 1000);
-        });
+            });
+            resizeObserver.observe(this.el.nativeElement);
+            this.resizeObserver = resizeObserver;
+        }
     }
     recalculateColumns() {
         const siblings = DomHandler.siblings(this.el.nativeElement);
@@ -5462,22 +5494,30 @@ class FrozenColumn {
             this.updateStickyPosition();
         }, time);
     }
+    ngOnDestroy() {
+        this.unbindResizeListener();
+        if (this.resizeObserver) {
+            this.resizeObserver.disconnect();
+        }
+    }
     _frozen = true;
     updateStickyPosition() {
         if (this._frozen) {
             if (this.alignFrozen === 'right') {
                 let right = 0;
-                let next = this.el.nativeElement.nextElementSibling;
-                if (next) {
-                    right = DomHandler.getOuterWidth(next) + (parseFloat(next.style.right) || 0);
+                let sibling = this.el.nativeElement.nextElementSibling;
+                while (sibling) {
+                    right += DomHandler.getOuterWidth(sibling);
+                    sibling = sibling.nextElementSibling;
                 }
                 this.el.nativeElement.style.right = right + 'px';
             }
             else {
                 let left = 0;
-                let prev = this.el.nativeElement.previousElementSibling;
-                if (prev) {
-                    left = DomHandler.getOuterWidth(prev) + (parseFloat(prev.style.left) || 0);
+                let sibling = this.el.nativeElement.previousElementSibling;
+                while (sibling) {
+                    left += DomHandler.getOuterWidth(sibling);
+                    sibling = sibling.previousElementSibling;
                 }
                 this.el.nativeElement.style.left = left + 'px';
             }
@@ -5491,28 +5531,31 @@ class FrozenColumn {
             }
         }
     }
-    static ɵfac = function FrozenColumn_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || FrozenColumn)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
-    static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: FrozenColumn, selectors: [["", "pFrozenColumn", ""]], hostVars: 4, hostBindings: function FrozenColumn_HostBindings(rf, ctx) { if (rf & 1) {
-            i0.ɵɵlistener("resize", function FrozenColumn_resize_HostBindingHandler($event) { return ctx.recalculateColumns($event); }, false, i0.ɵɵresolveWindow);
-        } if (rf & 2) {
+    static ɵfac = function FrozenColumn_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || FrozenColumn)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(DOCUMENT), i0.ɵɵdirectiveInject(PLATFORM_ID)); };
+    static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: FrozenColumn, selectors: [["", "pFrozenColumn", ""]], hostVars: 4, hostBindings: function FrozenColumn_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵclassProp("p-datatable-frozen-column", ctx.frozen)("p-datatable-frozen-column-left", ctx.alignFrozen === "left");
         } }, inputs: { frozen: "frozen", alignFrozen: "alignFrozen" } });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FrozenColumn, [{
         type: Directive,
         args: [{ selector: '[pFrozenColumn]', host: { '[class.p-datatable-frozen-column]': 'frozen', '[class.p-datatable-frozen-column-left]': 'alignFrozen === "left"' } }]
-    }], () => [{ type: i0.ElementRef }, { type: i0.NgZone }], { frozen: [{
+    }], () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: Document, decorators: [{
+                type: Inject,
+                args: [DOCUMENT]
+            }] }, { type: undefined, decorators: [{
+                type: Inject,
+                args: [PLATFORM_ID]
+            }] }], { frozen: [{
             type: Input
         }], alignFrozen: [{
             type: Input
-        }], recalculateColumns: [{
-            type: HostListener,
-            args: ['window:resize', ['$event']]
         }] }); })();
 class SortableColumn {
     dt;
+    #elementRef = inject(ElementRef);
     field;
     pSortableColumnDisabled;
+    role = this.#elementRef.nativeElement?.tagName !== 'TH' ? 'columnheader' : null;
     sorted;
     sortOrder;
     subscription;
@@ -5573,7 +5616,7 @@ class SortableColumn {
     static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: SortableColumn, selectors: [["", "pSortableColumn", ""]], hostVars: 7, hostBindings: function SortableColumn_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("click", function SortableColumn_click_HostBindingHandler($event) { return ctx.onClick($event); })("keydown.space", function SortableColumn_keydown_space_HostBindingHandler($event) { return ctx.onEnterKey($event); })("keydown.enter", function SortableColumn_keydown_enter_HostBindingHandler($event) { return ctx.onEnterKey($event); });
         } if (rf & 2) {
-            i0.ɵɵattribute("tabindex", ctx.isEnabled() ? "0" : null)("role", "columnheader")("aria-sort", ctx.sortOrder);
+            i0.ɵɵattribute("tabindex", ctx.isEnabled() ? "0" : null)("role", ctx.role)("aria-sort", ctx.sortOrder);
             i0.ɵɵclassProp("p-datatable-sortable-column", ctx.isEnabled())("p-datatable-column-sorted", ctx.sorted);
         } }, inputs: { field: [0, "pSortableColumn", "field"], pSortableColumnDisabled: [2, "pSortableColumnDisabled", "pSortableColumnDisabled", booleanAttribute] }, features: [i0.ɵɵInputTransformsFeature] });
 }
@@ -5581,7 +5624,7 @@ class SortableColumn {
         type: Directive,
         args: [{
                 selector: '[pSortableColumn]',
-                host: { '[class.p-datatable-sortable-column]': 'isEnabled()', '[class.p-datatable-column-sorted]': 'sorted', '[attr.tabindex]': 'isEnabled() ? "0" : null', '[attr.role]': '"columnheader"', '[attr.aria-sort]': 'sortOrder' }
+                host: { '[class.p-datatable-sortable-column]': 'isEnabled()', '[class.p-datatable-column-sorted]': 'sorted', '[attr.tabindex]': 'isEnabled() ? "0" : null', '[attr.role]': 'role', '[attr.aria-sort]': 'sortOrder' }
             }]
     }], () => [{ type: Table }], { field: [{
             type: Input,
@@ -5752,7 +5795,7 @@ class SelectableRow {
                 if (event.code === 'KeyA' && (event.metaKey || event.ctrlKey) && this.dt.selectionMode === 'multiple') {
                     const data = this.dt.dataToRender(this.dt.processedData);
                     this.dt.selection = [...data];
-                    this.dt.selectRange(event, data.length - 1);
+                    this.dt.selectRange(event, data.length - 1, true);
                     event.preventDefault();
                 }
                 break;
@@ -5852,7 +5895,7 @@ class SelectableRow {
     findNextSelectableRow(row) {
         let nextRow = row.nextElementSibling;
         if (nextRow) {
-            if (DomHandler.hasClass(nextRow, 'p-selectable-row'))
+            if (DomHandler.hasClass(nextRow, 'p-datatable-selectable-row'))
                 return nextRow;
             else
                 return this.findNextSelectableRow(nextRow);
@@ -5864,7 +5907,7 @@ class SelectableRow {
     findPrevSelectableRow(row) {
         let prevRow = row.previousElementSibling;
         if (prevRow) {
-            if (DomHandler.hasClass(prevRow, 'p-selectable-row'))
+            if (DomHandler.hasClass(prevRow, 'p-datatable-selectable-row'))
                 return prevRow;
             else
                 return this.findPrevSelectableRow(prevRow);
@@ -6794,7 +6837,7 @@ class TableRadioButton {
         this.cd = cd;
         this.subscription = this.dt.tableService.selectionSource$.subscribe(() => {
             this.checked = this.dt.isSelected(this.value);
-            this.ariaLabel = this.ariaLabel || this.dt.config.translation.aria ? (this.checked ? this.dt.config.translation.aria.selectRow : this.dt.config.translation.aria.unselectRow) : undefined;
+            this.ariaLabel = this.ariaLabel || (this.dt.config.translation.aria ? (this.checked ? this.dt.config.translation.aria.selectRow : this.dt.config.translation.aria.unselectRow) : undefined);
             this.cd.markForCheck();
         });
     }
@@ -6877,7 +6920,7 @@ class TableCheckbox {
         this.cd = cd;
         this.subscription = this.dt.tableService.selectionSource$.subscribe(() => {
             this.checked = this.dt.isSelected(this.value) && !this.disabled;
-            this.ariaLabel = this.ariaLabel || this.dt.config.translation.aria ? (this.checked ? this.dt.config.translation.aria.selectRow : this.dt.config.translation.aria.unselectRow) : undefined;
+            this.ariaLabel = this.ariaLabel || (this.dt.config.translation.aria ? (this.checked ? this.dt.config.translation.aria.selectRow : this.dt.config.translation.aria.unselectRow) : undefined);
             this.cd.markForCheck();
         });
     }
@@ -6968,7 +7011,7 @@ class TableHeaderCheckbox {
         this.cd = cd;
         this.valueChangeSubscription = this.dt.tableService.valueSource$.subscribe(() => {
             this.checked = this.updateCheckedState();
-            this.ariaLabel = this.ariaLabel || this.dt.config.translation.aria ? (this.checked ? this.dt.config.translation.aria.selectAll : this.dt.config.translation.aria.unselectAll) : undefined;
+            this.ariaLabel = this.ariaLabel || (this.dt.config.translation.aria ? (this.checked ? this.dt.config.translation.aria.selectAll : this.dt.config.translation.aria.unselectAll) : undefined);
         });
         this.selectionChangeSubscription = this.dt.tableService.selectionSource$.subscribe(() => {
             this.checked = this.updateCheckedState();
@@ -7800,7 +7843,7 @@ class ColumnFilter extends BaseComponent {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.icon = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.clearButtonViewChild = _t.first);
-        } }, inputs: { field: "field", type: "type", display: "display", showMenu: [2, "showMenu", "showMenu", booleanAttribute], matchMode: "matchMode", operator: "operator", showOperator: [2, "showOperator", "showOperator", booleanAttribute], showClearButton: [2, "showClearButton", "showClearButton", booleanAttribute], showApplyButton: [2, "showApplyButton", "showApplyButton", booleanAttribute], showMatchModes: [2, "showMatchModes", "showMatchModes", booleanAttribute], showAddButton: [2, "showAddButton", "showAddButton", booleanAttribute], hideOnClear: [2, "hideOnClear", "hideOnClear", booleanAttribute], placeholder: "placeholder", matchModeOptions: "matchModeOptions", maxConstraints: [2, "maxConstraints", "maxConstraints", numberAttribute], minFractionDigits: [2, "minFractionDigits", "minFractionDigits", (value) => numberAttribute(value, null)], maxFractionDigits: [2, "maxFractionDigits", "maxFractionDigits", (value) => numberAttribute(value, null)], prefix: "prefix", suffix: "suffix", locale: "locale", localeMatcher: "localeMatcher", currency: "currency", currencyDisplay: "currencyDisplay", useGrouping: [2, "useGrouping", "useGrouping", booleanAttribute], showButtons: [2, "showButtons", "showButtons", booleanAttribute], ariaLabel: "ariaLabel", filterButtonProps: "filterButtonProps" }, outputs: { onShow: "onShow", onHide: "onHide" }, features: [i0.ɵɵInputTransformsFeature, i0.ɵɵInheritDefinitionFeature], decls: 5, vars: 5, consts: [["icon", ""], ["menu", ""], ["clearBtn", ""], [3, "ngClass"], ["class", "p-fluid", 3, "type", "field", "ariaLabel", "filterConstraint", "filterTemplate", "placeholder", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping", "showButtons", 4, "ngIf"], [3, "styleClass", "ariaLabel", "buttonProps", "click", "keydown", 4, "ngIf"], [3, "styleClass", "ariaLabel", "buttonProps", "onClick", 4, "ngIf"], ["role", "dialog", 3, "ngClass", "id", "click", "keydown.escape", 4, "ngIf"], [1, "p-fluid", 3, "type", "field", "ariaLabel", "filterConstraint", "filterTemplate", "placeholder", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping", "showButtons"], [3, "click", "keydown", "styleClass", "ariaLabel", "buttonProps"], [4, "ngIf"], ["class", "pi-filter-icon", 4, "ngIf"], [1, "pi-filter-icon"], [4, "ngTemplateOutlet"], [3, "onClick", "styleClass", "ariaLabel", "buttonProps"], ["role", "dialog", 3, "click", "keydown.escape", "ngClass", "id"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [3, "ngClass", 4, "ngIf", "ngIfElse"], [3, "ngClass", "p-datatable-filter-constraint-selected", "click", "keydown", "keydown.enter", 4, "ngFor", "ngForOf"], [3, "click", "keydown", "keydown.enter", "ngClass"], [3, "ngClass", 4, "ngIf"], [3, "ngClass", 4, "ngFor", "ngForOf"], [3, "outlined", "label", "buttonProps", "onClick", 4, "ngIf"], ["size", "small", 3, "label", "buttonProps", "onClick", 4, "ngIf"], [3, "ngModelChange", "options", "ngModel", "styleClass"], [3, "options", "ngModel", "styleClass", "ngModelChange", 4, "ngIf"], [3, "type", "field", "filterConstraint", "filterTemplate", "placeholder", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping"], ["severity", "danger", "size", "small", 3, "styleClass", "text", "ariaLabel", "label", "buttonProps", "onClick", 4, "ngIf"], ["severity", "danger", "size", "small", 3, "onClick", "styleClass", "text", "ariaLabel", "label", "buttonProps"], ["type", "button", "size", "small", 3, "onClick", "label", "styleClass", "text", "buttonProps"], [3, "onClick", "outlined", "label", "buttonProps"], ["size", "small", 3, "onClick", "label", "buttonProps"]], template: function ColumnFilter_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { field: "field", type: "type", display: "display", showMenu: [2, "showMenu", "showMenu", booleanAttribute], matchMode: "matchMode", operator: "operator", showOperator: [2, "showOperator", "showOperator", booleanAttribute], showClearButton: [2, "showClearButton", "showClearButton", booleanAttribute], showApplyButton: [2, "showApplyButton", "showApplyButton", booleanAttribute], showMatchModes: [2, "showMatchModes", "showMatchModes", booleanAttribute], showAddButton: [2, "showAddButton", "showAddButton", booleanAttribute], hideOnClear: [2, "hideOnClear", "hideOnClear", booleanAttribute], placeholder: "placeholder", matchModeOptions: "matchModeOptions", maxConstraints: [2, "maxConstraints", "maxConstraints", numberAttribute], minFractionDigits: [2, "minFractionDigits", "minFractionDigits", (value) => numberAttribute(value, null)], maxFractionDigits: [2, "maxFractionDigits", "maxFractionDigits", (value) => numberAttribute(value, null)], prefix: "prefix", suffix: "suffix", locale: "locale", localeMatcher: "localeMatcher", currency: "currency", currencyDisplay: "currencyDisplay", useGrouping: [2, "useGrouping", "useGrouping", booleanAttribute], showButtons: [2, "showButtons", "showButtons", booleanAttribute], ariaLabel: "ariaLabel", filterButtonProps: "filterButtonProps" }, outputs: { onShow: "onShow", onHide: "onHide" }, features: [i0.ɵɵInputTransformsFeature, i0.ɵɵInheritDefinitionFeature], decls: 5, vars: 5, consts: [["icon", ""], ["menu", ""], ["clearBtn", ""], [3, "ngClass"], ["class", "p-fluid", 3, "type", "field", "ariaLabel", "filterConstraint", "filterTemplate", "placeholder", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping", "showButtons", 4, "ngIf"], [3, "styleClass", "ariaLabel", "buttonProps", "click", "keydown", 4, "ngIf"], [3, "styleClass", "ariaLabel", "buttonProps", "onClick", 4, "ngIf"], ["role", "dialog", 3, "ngClass", "id", "click", "keydown.escape", 4, "ngIf"], [1, "p-fluid", 3, "type", "field", "ariaLabel", "filterConstraint", "filterTemplate", "placeholder", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping", "showButtons"], [3, "click", "keydown", "styleClass", "ariaLabel", "buttonProps"], [4, "ngIf"], ["class", "pi-filter-icon", 4, "ngIf"], [1, "pi-filter-icon"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [3, "onClick", "styleClass", "ariaLabel", "buttonProps"], [4, "ngTemplateOutlet"], ["role", "dialog", 3, "click", "keydown.escape", "ngClass", "id"], [3, "ngClass", 4, "ngIf", "ngIfElse"], [3, "ngClass", "p-datatable-filter-constraint-selected", "click", "keydown", "keydown.enter", 4, "ngFor", "ngForOf"], [3, "click", "keydown", "keydown.enter", "ngClass"], [3, "ngClass", 4, "ngIf"], [3, "ngClass", 4, "ngFor", "ngForOf"], [3, "outlined", "label", "buttonProps", "onClick", 4, "ngIf"], ["size", "small", 3, "label", "buttonProps", "onClick", 4, "ngIf"], [3, "ngModelChange", "options", "ngModel", "styleClass"], [3, "options", "ngModel", "styleClass", "ngModelChange", 4, "ngIf"], [3, "type", "field", "filterConstraint", "filterTemplate", "placeholder", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping"], ["severity", "danger", "size", "small", 3, "styleClass", "text", "ariaLabel", "label", "buttonProps", "onClick", 4, "ngIf"], ["severity", "danger", "size", "small", 3, "onClick", "styleClass", "text", "ariaLabel", "label", "buttonProps"], ["type", "button", "size", "small", 3, "onClick", "label", "styleClass", "text", "buttonProps"], [3, "onClick", "outlined", "label", "buttonProps"], ["size", "small", 3, "onClick", "label", "buttonProps"]], template: function ColumnFilter_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 3);
             i0.ɵɵtemplate(1, ColumnFilter_p_columnFilterFormElement_1_Template, 1, 16, "p-columnFilterFormElement", 4)(2, ColumnFilter_p_button_2_Template, 3, 6, "p-button", 5)(3, ColumnFilter_p_button_3_Template, 3, 3, "p-button", 6)(4, ColumnFilter_div_4_Template, 6, 14, "div", 7);
             i0.ɵɵelementEnd();
@@ -7859,7 +7902,7 @@ class ColumnFilter extends BaseComponent {
                 <ng-template #icon>
                     <FilterIcon *ngIf="!filterIconTemplate && !_filterIconTemplate" />
                     <span class="pi-filter-icon" *ngIf="filterIconTemplate || _filterIconTemplate">
-                        <ng-template *ngTemplateOutlet="filterIconTemplate || _filterIconTemplate"></ng-template>
+                        <ng-template *ngTemplateOutlet="filterIconTemplate || _filterIconTemplate; context: { hasFilter: hasFilter }"></ng-template>
                     </span>
                 </ng-template>
             </p-button>
@@ -8192,7 +8235,7 @@ class ColumnFilterFormElement {
                     [currencyDisplay]="currencyDisplay"
                     [useGrouping]="useGrouping"
                 ></p-inputNumber>
-                <p-checkbox [indeterminate]="true" [binary]="true" *ngSwitchCase="'boolean'" [ngModel]="filterConstraint?.value" (ngModelChange)="onModelChange($event)" />
+                <p-checkbox [indeterminate]="filterConstraint?.value === null" [binary]="true" *ngSwitchCase="'boolean'" [ngModel]="filterConstraint?.value" (ngModelChange)="onModelChange($event)" />
 
                 <p-datepicker [ariaLabel]="ariaLabel" *ngSwitchCase="'date'" [placeholder]="placeholder" [ngModel]="filterConstraint?.value" (ngModelChange)="onModelChange($event)" appendTo="body"></p-datepicker>
             </ng-container>