@alaarab/ogrid-angular-primeng 2.5.9 → 2.6.1

package/dist/esm/datagrid-table/datagrid-table.component.js

@@ -0,0 +1,1229 @@
+import { Component, Input, signal, computed, effect, ViewChild, ChangeDetectionStrategy, ViewEncapsulation, } from '@angular/core';
+import { BaseDataGridTableComponent, DataGridStateService, ColumnReorderService, VirtualScrollService, StatusBarComponent, GridContextMenuComponent, MarchingAntsOverlayComponent, EmptyStateComponent, FormulaRefOverlayComponent, DEFAULT_MIN_COLUMN_WIDTH, ROW_NUMBER_COLUMN_ID, ROW_NUMBER_COLUMN_MIN_WIDTH, indexToColumnLetter, formatCellReference, } from '@alaarab/ogrid-angular';
+import { ColumnHeaderFilterComponent } from '../column-header-filter/column-header-filter.component';
+import { ColumnHeaderMenuComponent } from '../column-header-menu/column-header-menu.component';
+import { InlineCellEditorComponent } from './inline-cell-editor.component';
+import { PopoverCellEditorComponent } from './popover-cell-editor.component';
+import * as i0 from "@angular/core";
+const _c0 = ["wrapper"];
+const _c1 = ["tableContainer"];
+const _c2 = () => [];
+const _forTrack0 = ($index, $item) => $item.columnId;
+const _forTrack1 = ($index, $item) => ($item.columnDef == null ? null : $item.columnDef.columnId) ?? $index;
+function DataGridTableComponent_Conditional_9_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "th", 14);
+} }
+function DataGridTableComponent_Conditional_9_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "th", 14);
+} }
+function DataGridTableComponent_Conditional_9_For_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "th", 14);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ɵ$index_24_r2 = ctx.$index;
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", ctx_r2.getColumnLetter(ɵ$index_24_r2), " ");
+} }
+function DataGridTableComponent_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "tr", 6);
+    i0.ɵɵconditionalCreate(1, DataGridTableComponent_Conditional_9_Conditional_1_Template, 1, 0, "th", 14);
+    i0.ɵɵconditionalCreate(2, DataGridTableComponent_Conditional_9_Conditional_2_Template, 1, 0, "th", 14);
+    i0.ɵɵrepeaterCreate(3, DataGridTableComponent_Conditional_9_For_4_Template, 2, 1, "th", 14, _forTrack0);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.hasCheckboxCol() ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.hasRowNumbersCol() ? 2 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r2.visibleCols());
+} }
+function DataGridTableComponent_For_11_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "th", 15)(1, "input", 18);
+    i0.ɵɵlistener("change", function DataGridTableComponent_For_11_Conditional_1_Template_input_change_1_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onSelectAllChangePrimeng($event.target.checked)); });
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("checked", ctx_r2.allSelected())("indeterminate", ctx_r2.someSelected() && !ctx_r2.allSelected());
+} }
+function DataGridTableComponent_For_11_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "th");
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵattribute("rowSpan", ctx_r2.headerRows().length - 1);
+} }
+function DataGridTableComponent_For_11_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "th", 19);
+    i0.ɵɵtext(1, " # ");
+    i0.ɵɵelementStart(2, "div", 20);
+    i0.ɵɵlistener("pointerdown", function DataGridTableComponent_For_11_Conditional_3_Template_div_pointerdown_2_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onResizeRowNumber($event)); })("dblclick", function DataGridTableComponent_For_11_Conditional_3_Template_div_dblclick_2_listener($event) { i0.ɵɵrestoreView(_r5); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵstyleProp("width", ctx_r2.getRowNumberWidth(), "px")("min-width", ctx_r2.getRowNumberWidth(), "px")("max-width", ctx_r2.getRowNumberWidth(), "px");
+} }
+function DataGridTableComponent_For_11_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "th", 17);
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵattribute("rowSpan", ctx_r2.headerRows().length - 1);
+} }
+function DataGridTableComponent_For_11_For_6_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "th", 21);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const cell_r6 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵattribute("colSpan", cell_r6.colSpan);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", cell_r6.label, " ");
+} }
+function DataGridTableComponent_For_11_For_6_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵdeclareLet(0);
+    i0.ɵɵelementStart(1, "th", 23);
+    i0.ɵɵlistener("pointerdown", function DataGridTableComponent_For_11_For_6_Conditional_1_Template_th_pointerdown_1_listener($event) { i0.ɵɵrestoreView(_r7); const col_r8 = i0.ɵɵreadContextLet(0); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onHeaderMouseDown(col_r8.columnId, $event)); });
+    i0.ɵɵelementStart(2, "div", 24);
+    i0.ɵɵelement(3, "ogrid-primeng-column-header-filter", 25)(4, "column-header-menu", 26);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "div", 27);
+    i0.ɵɵlistener("pointerdown", function DataGridTableComponent_For_11_For_6_Conditional_1_Template_div_pointerdown_5_listener($event) { i0.ɵɵrestoreView(_r7); const col_r8 = i0.ɵɵreadContextLet(0); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onResizeStartPrimeng($event, col_r8)); })("dblclick", function DataGridTableComponent_For_11_For_6_Conditional_1_Template_div_dblclick_5_listener($event) { i0.ɵɵrestoreView(_r7); const col_r8 = i0.ɵɵreadContextLet(0); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onResizeDoubleClick($event, col_r8)); });
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const cell_r6 = i0.ɵɵnextContext().$implicit;
+    const ɵ$index_28_r9 = i0.ɵɵnextContext().$index;
+    const ctx_r2 = i0.ɵɵnextContext();
+    const col_r10 = i0.ɵɵstoreLet(ctx_r2.asColumnDef(cell_r6.columnDef));
+    const pinned_r11 = ctx_r2.isPinned(col_r10.columnId);
+    const config_r12 = ctx_r2.getFilterConfig(col_r10);
+    const sortState_r13 = ctx_r2.getSortState(col_r10.columnId);
+    const ariaSort_r14 = sortState_r13 === "asc" ? "ascending" : sortState_r13 === "desc" ? "descending" : null;
+    i0.ɵɵadvance();
+    i0.ɵɵstyleProp("min-width", ctx_r2.getEffectiveMinWidth(col_r10), "px")("width", ctx_r2.getColumnWidth(col_r10), "px")("max-width", ctx_r2.getColumnWidth(col_r10), "px")("left", pinned_r11 === "left" ? ctx_r2.getPinnedLeftOffset(col_r10.columnId) : null, "px")("right", pinned_r11 === "right" ? ctx_r2.getPinnedRightOffset(col_r10.columnId) : null, "px")("cursor", ctx_r2.columnReorderService.isDragging() ? "grabbing" : "grab");
+    i0.ɵɵclassProp("ogrid-th-pinned-left", pinned_r11 === "left")("ogrid-th-pinned-right", pinned_r11 === "right");
+    i0.ɵɵattribute("data-column-id", col_r10.columnId)("aria-sort", ariaSort_r14)("rowSpan", ctx_r2.headerRows().length > 1 && ɵ$index_28_r9 < ctx_r2.headerRows().length - 1 ? ctx_r2.headerRows().length - ɵ$index_28_r9 : null);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("columnKey", col_r10.columnId)("columnName", col_r10.name)("filterType", config_r12.filterType)("isSorted", config_r12.isSorted ?? false)("isSortedDescending", config_r12.isSortedDescending ?? false)("onSort", config_r12.onSort)("selectedValues", config_r12.selectedValues)("onFilterChange", config_r12.onFilterChange)("options", config_r12.options ?? i0.ɵɵpureFunction0(46, _c2))("isLoadingOptions", config_r12.isLoadingOptions ?? false)("textValue", config_r12.textValue ?? "")("onTextChange", config_r12.onTextChange)("selectedUser", config_r12.selectedUser)("onUserChange", config_r12.onUserChange)("peopleSearch", config_r12.peopleSearch)("dateValue", config_r12.dateValue)("onDateChange", config_r12.onDateChange);
+    const colPinState_r15 = ctx_r2.getPinState(col_r10.columnId);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("columnId", col_r10.columnId)("canPinLeft", colPinState_r15.canPinLeft)("canPinRight", colPinState_r15.canPinRight)("canUnpin", colPinState_r15.canUnpin)("currentSort", sortState_r13)("isSortable", col_r10.sortable !== false)("isResizable", col_r10.resizable !== false)("handlers", ctx_r2.getColumnMenuHandlersMemoized(col_r10.columnId));
+    i0.ɵɵadvance();
+    i0.ɵɵattribute("aria-label", "Resize " + col_r10.name);
+} }
+function DataGridTableComponent_For_11_For_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, DataGridTableComponent_For_11_For_6_Conditional_0_Template, 2, 2, "th", 21)(1, DataGridTableComponent_For_11_For_6_Conditional_1_Template, 6, 47, "th", 22);
+} if (rf & 2) {
+    const cell_r6 = ctx.$implicit;
+    i0.ɵɵconditional(cell_r6.isGroup ? 0 : 1);
+} }
+function DataGridTableComponent_For_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "tr");
+    i0.ɵɵconditionalCreate(1, DataGridTableComponent_For_11_Conditional_1_Template, 2, 2, "th", 15);
+    i0.ɵɵconditionalCreate(2, DataGridTableComponent_For_11_Conditional_2_Template, 1, 1, "th");
+    i0.ɵɵconditionalCreate(3, DataGridTableComponent_For_11_Conditional_3_Template, 3, 6, "th", 16);
+    i0.ɵɵconditionalCreate(4, DataGridTableComponent_For_11_Conditional_4_Template, 1, 1, "th", 17);
+    i0.ɵɵrepeaterCreate(5, DataGridTableComponent_For_11_For_6_Template, 2, 1, null, null, _forTrack1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const row_r16 = ctx.$implicit;
+    const ɵ$index_28_r9 = ctx.$index;
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ɵ$index_28_r9 === ctx_r2.headerRows().length - 1 && ctx_r2.hasCheckboxCol() ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ɵ$index_28_r9 === 0 && ɵ$index_28_r9 < ctx_r2.headerRows().length - 1 && ctx_r2.hasCheckboxCol() ? 2 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ɵ$index_28_r9 === ctx_r2.headerRows().length - 1 && ctx_r2.hasRowNumbersCol() ? 3 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ɵ$index_28_r9 === 0 && ɵ$index_28_r9 < ctx_r2.headerRows().length - 1 && ctx_r2.hasRowNumbersCol() ? 4 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(row_r16);
+} }
+function DataGridTableComponent_Conditional_12_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "tr");
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵstyleProp("height", ctx_r2.vsTopSpacerHeight(), "px");
+} }
+function DataGridTableComponent_Conditional_12_For_3_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r19 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "td", 35);
+    i0.ɵɵlistener("click", function DataGridTableComponent_Conditional_12_For_3_Conditional_3_Template_td_click_0_listener($event) { i0.ɵɵrestoreView(_r19); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelementStart(1, "input", 36);
+    i0.ɵɵlistener("change", function DataGridTableComponent_Conditional_12_For_3_Conditional_3_Template_input_change_1_listener($event) { i0.ɵɵrestoreView(_r19); const item_r18 = i0.ɵɵnextContext().$implicit; const rowIndex_r20 = i0.ɵɵreadContextLet(0); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onRowCheckboxChangePrimeng(item_r18, $event.target.checked, rowIndex_r20, $event)); });
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    i0.ɵɵnextContext();
+    const rowIndex_r20 = i0.ɵɵreadContextLet(0);
+    const isSelected_r21 = i0.ɵɵreadContextLet(1);
+    i0.ɵɵattribute("data-row-index", rowIndex_r20)("data-col-index", 0);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("checked", isSelected_r21);
+    i0.ɵɵattribute("aria-label", "Select row " + (rowIndex_r20 + 1));
+} }
+function DataGridTableComponent_Conditional_12_For_3_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "td", 37);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    i0.ɵɵnextContext();
+    const rowIndex_r20 = i0.ɵɵreadContextLet(0);
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵstyleProp("width", ctx_r2.getRowNumberWidth(), "px")("min-width", ctx_r2.getRowNumberWidth(), "px")("max-width", ctx_r2.getRowNumberWidth(), "px");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", ctx_r2.rowNumberOffset() + rowIndex_r20 + 1, " ");
+} }
+function DataGridTableComponent_Conditional_12_For_3_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "td");
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(3);
+    i0.ɵɵstyleProp("width", ctx_r2.vsLeftSpacerWidth(), "px")("min-width", ctx_r2.vsLeftSpacerWidth(), "px")("max-width", ctx_r2.vsLeftSpacerWidth(), "px")("padding", "0");
+} }
+function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r22 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 39)(1, "ogrid-primeng-inline-cell-editor", 42);
+    i0.ɵɵlistener("commit", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_2_Template_ogrid_primeng_inline_cell_editor_commit_1_listener($event) { i0.ɵɵrestoreView(_r22); const col_r23 = i0.ɵɵnextContext().$implicit; const descriptor_r24 = i0.ɵɵreadContextLet(1); const item_r18 = i0.ɵɵnextContext().$implicit; const rowIndex_r20 = i0.ɵɵreadContextLet(0); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.commitEdit(item_r18, col_r23.columnId, descriptor_r24.value, $event, rowIndex_r20, descriptor_r24.globalColIndex)); })("cancel", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_2_Template_ogrid_primeng_inline_cell_editor_cancel_1_listener() { i0.ɵɵrestoreView(_r22); const ctx_r2 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r2.cancelEdit()); });
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const col_r23 = i0.ɵɵnextContext().$implicit;
+    const descriptor_r24 = i0.ɵɵreadContextLet(1);
+    const item_r18 = i0.ɵɵnextContext().$implicit;
+    const rowIndex_r20 = i0.ɵɵreadContextLet(0);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("value", descriptor_r24.value)("item", item_r18)("column", col_r23)("rowIndex", rowIndex_r20)("editorType", descriptor_r24.editorType ?? "text");
+} }
+function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "ogrid-primeng-popover-cell-editor", 40);
+} if (rf & 2) {
+    const col_r23 = i0.ɵɵnextContext().$implicit;
+    const descriptor_r24 = i0.ɵɵreadContextLet(1);
+    const item_r18 = i0.ɵɵnextContext().$implicit;
+    const rowIndex_r20 = i0.ɵɵreadContextLet(0);
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    const editorProps_r25 = ctx_r2.buildPopoverEditorProps(item_r18, col_r23, descriptor_r24);
+    i0.ɵɵproperty("item", item_r18)("column", col_r23)("rowIndex", rowIndex_r20)("globalColIndex", descriptor_r24.globalColIndex)("displayValue", descriptor_r24.displayValue)("editorProps", editorProps_r25)("onCancel", ctx_r2.cancelEditHandler);
+} }
+function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r27 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "input", 47);
+    i0.ɵɵlistener("change", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_1_Template_input_change_0_listener() { i0.ɵɵrestoreView(_r27); const col_r23 = i0.ɵɵnextContext(2).$implicit; const descriptor_r24 = i0.ɵɵreadContextLet(1); const item_r18 = i0.ɵɵnextContext().$implicit; const rowIndex_r20 = i0.ɵɵreadContextLet(0); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(descriptor_r24.canEditAny ? ctx_r2.commitBooleanEdit(item_r18, col_r23.columnId, !!descriptor_r24.displayValue, rowIndex_r20, descriptor_r24.globalColIndex) : null); })("pointerdown", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_1_Template_input_pointerdown_0_listener($event) { i0.ɵɵrestoreView(_r27); i0.ɵɵnextContext(2); const descriptor_r24 = i0.ɵɵreadContextLet(1); i0.ɵɵnextContext(); const rowIndex_r20 = i0.ɵɵreadContextLet(0); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onBooleanCheckboxPointerDown($event, rowIndex_r20, descriptor_r24.globalColIndex)); })("click", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_1_Template_input_click_0_listener($event) { i0.ɵɵrestoreView(_r27); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    i0.ɵɵnextContext(2);
+    const descriptor_r24 = i0.ɵɵreadContextLet(1);
+    i0.ɵɵstyleProp("cursor", descriptor_r24.canEditAny ? "pointer" : "default");
+    i0.ɵɵproperty("checked", !!descriptor_r24.displayValue)("disabled", !descriptor_r24.canEditAny);
+    i0.ɵɵattribute("aria-label", descriptor_r24.displayValue ? "Checked" : "Unchecked");
+} }
+function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span");
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const col_r23 = i0.ɵɵnextContext(2).$implicit;
+    const descriptor_r24 = i0.ɵɵreadContextLet(1);
+    const item_r18 = i0.ɵɵnextContext().$implicit;
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵstyleMap(ctx_r2.resolveCellStyleFn(col_r23, item_r18, descriptor_r24.displayValue));
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx_r2.resolveCellContent(col_r23, item_r18, descriptor_r24.displayValue));
+} }
+function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r28 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 48);
+    i0.ɵɵlistener("pointerdown", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_3_Template_div_pointerdown_0_listener($event) { i0.ɵɵrestoreView(_r28); const ctx_r2 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r2.onFillHandleMouseDown($event)); });
+    i0.ɵɵelementEnd();
+} }
+function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    const _r26 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 43);
+    i0.ɵɵlistener("pointerdown", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Template_div_pointerdown_0_listener($event) { i0.ɵɵrestoreView(_r26); i0.ɵɵnextContext(); const descriptor_r24 = i0.ɵɵreadContextLet(1); i0.ɵɵnextContext(); const rowIndex_r20 = i0.ɵɵreadContextLet(0); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onCellMouseDown($event, rowIndex_r20, descriptor_r24.globalColIndex)); })("click", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r26); i0.ɵɵnextContext(); const descriptor_r24 = i0.ɵɵreadContextLet(1); i0.ɵɵnextContext(); const rowIndex_r20 = i0.ɵɵreadContextLet(0); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onCellClick(rowIndex_r20, descriptor_r24.globalColIndex)); })("dblclick", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Template_div_dblclick_0_listener() { i0.ɵɵrestoreView(_r26); const col_r23 = i0.ɵɵnextContext().$implicit; const descriptor_r24 = i0.ɵɵreadContextLet(1); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(descriptor_r24.canEditAny ? ctx_r2.onCellDblClick(descriptor_r24.rowId, col_r23.columnId) : null); })("contextmenu", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Template_div_contextmenu_0_listener($event) { i0.ɵɵrestoreView(_r26); const ctx_r2 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r2.onCellContextMenu($event)); });
+    i0.ɵɵconditionalCreate(1, DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_1_Template, 1, 5, "input", 44)(2, DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_2_Template, 2, 3, "span", 45);
+    i0.ɵɵconditionalCreate(3, DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_3_Template, 1, 0, "div", 46);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const col_r23 = i0.ɵɵnextContext().$implicit;
+    const descriptor_r24 = i0.ɵɵreadContextLet(1);
+    i0.ɵɵnextContext();
+    const rowIndex_r20 = i0.ɵɵreadContextLet(0);
+    i0.ɵɵstyleProp("cursor", descriptor_r24.canEditAny ? "cell" : "default")("background", descriptor_r24.isInRange && !descriptor_r24.isActive ? "var(--ogrid-range-bg, rgba(33, 115, 70, 0.08))" : descriptor_r24.isActive && descriptor_r24.isInRange ? "var(--ogrid-bg, #fff)" : null)("outline", descriptor_r24.isActive && !descriptor_r24.isInRange ? "2px solid var(--ogrid-selection, #217346)" : null)("outline-offset", descriptor_r24.isActive && !descriptor_r24.isInRange ? "-2px" : null);
+    i0.ɵɵattribute("data-row-index", rowIndex_r20)("data-col-index", descriptor_r24.globalColIndex)("data-active-cell", descriptor_r24.isActive ? "true" : null)("data-in-range", descriptor_r24.isInRange ? "true" : null)("tabindex", descriptor_r24.isActive ? 0 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(col_r23.type === "boolean" ? 1 : 2);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(descriptor_r24.canEditAny && descriptor_r24.isSelectionEndCell ? 3 : -1);
+} }
+function DataGridTableComponent_Conditional_12_For_3_For_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "td", 38);
+    i0.ɵɵdeclareLet(1);
+    i0.ɵɵconditionalCreate(2, DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_2_Template, 2, 5, "div", 39)(3, DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_3_Template, 1, 7, "ogrid-primeng-popover-cell-editor", 40)(4, DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Template, 4, 15, "div", 41);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const col_r23 = ctx.$implicit;
+    const item_r18 = i0.ɵɵnextContext().$implicit;
+    const rowIndex_r20 = i0.ɵɵreadContextLet(0);
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    const pinned_r29 = ctx_r2.isPinned(col_r23.columnId);
+    i0.ɵɵstyleProp("min-width", ctx_r2.getEffectiveMinWidth(col_r23), "px")("width", ctx_r2.getColumnWidth(col_r23), "px")("max-width", ctx_r2.getColumnWidth(col_r23), "px")("left", pinned_r29 === "left" ? ctx_r2.getPinnedLeftOffset(col_r23.columnId) : null, "px")("right", pinned_r29 === "right" ? ctx_r2.getPinnedRightOffset(col_r23.columnId) : null, "px")("text-align", col_r23.type === "numeric" ? "right" : null);
+    i0.ɵɵclassProp("ogrid-td-pinned-left", pinned_r29 === "left")("ogrid-td-pinned-right", pinned_r29 === "right");
+    i0.ɵɵattribute("data-column-id", col_r23.columnId);
+    i0.ɵɵadvance();
+    const descriptor_r30 = i0.ɵɵstoreLet(ctx_r2.getCellDescriptor(item_r18, col_r23, rowIndex_r20, ctx_r2.getGlobalColIndex(col_r23)));
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(descriptor_r30.mode === "editing-inline" ? 2 : descriptor_r30.mode === "editing-popover" ? 3 : 4);
+} }
+function DataGridTableComponent_Conditional_12_For_3_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "td");
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(3);
+    i0.ɵɵstyleProp("width", ctx_r2.vsRightSpacerWidth(), "px")("min-width", ctx_r2.vsRightSpacerWidth(), "px")("max-width", ctx_r2.vsRightSpacerWidth(), "px")("padding", "0");
+} }
+function DataGridTableComponent_Conditional_12_For_3_Template(rf, ctx) { if (rf & 1) {
+    const _r17 = i0.ɵɵgetCurrentView();
+    i0.ɵɵdeclareLet(0)(1);
+    i0.ɵɵelementStart(2, "tr", 30);
+    i0.ɵɵlistener("click", function DataGridTableComponent_Conditional_12_For_3_Template_tr_click_2_listener($event) { const item_r18 = i0.ɵɵrestoreView(_r17).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onRowClickPrimeng($event, item_r18)); });
+    i0.ɵɵconditionalCreate(3, DataGridTableComponent_Conditional_12_For_3_Conditional_3_Template, 2, 4, "td", 31);
+    i0.ɵɵconditionalCreate(4, DataGridTableComponent_Conditional_12_For_3_Conditional_4_Template, 2, 7, "td", 32);
+    i0.ɵɵconditionalCreate(5, DataGridTableComponent_Conditional_12_For_3_Conditional_5_Template, 1, 8, "td", 33);
+    i0.ɵɵrepeaterCreate(6, DataGridTableComponent_Conditional_12_For_3_For_7_Template, 5, 19, "td", 34, _forTrack0);
+    i0.ɵɵconditionalCreate(8, DataGridTableComponent_Conditional_12_For_3_Conditional_8_Template, 1, 8, "td", 33);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const item_r18 = ctx.$implicit;
+    const ɵ$index_76_r31 = ctx.$index;
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵstoreLet(ctx_r2.vsStartIndex() + ɵ$index_76_r31);
+    const rowId_r32 = ctx_r2.getRowIdInput(item_r18);
+    i0.ɵɵadvance();
+    const isSelected_r33 = i0.ɵɵstoreLet(ctx_r2.selectedRowIds().has(rowId_r32));
+    i0.ɵɵadvance();
+    i0.ɵɵstyleProp("background", isSelected_r33 ? "var(--ogrid-selected-bg, #e8f0fe)" : null);
+    i0.ɵɵattribute("data-row-id", rowId_r32)("aria-selected", isSelected_r33 || null);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.hasCheckboxCol() ? 3 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.hasRowNumbersCol() ? 4 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.vsColumnsEnabled() && ctx_r2.vsLeftSpacerWidth() > 0 ? 5 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r2.vsVisibleCols());
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r2.vsColumnsEnabled() && ctx_r2.vsRightSpacerWidth() > 0 ? 8 : -1);
+} }
+function DataGridTableComponent_Conditional_12_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "tr");
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵstyleProp("height", ctx_r2.vsBottomSpacerHeight(), "px");
+} }
+function DataGridTableComponent_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "tbody");
+    i0.ɵɵconditionalCreate(1, DataGridTableComponent_Conditional_12_Conditional_1_Template, 1, 2, "tr", 28);
+    i0.ɵɵrepeaterCreate(2, DataGridTableComponent_Conditional_12_For_3_Template, 9, 10, "tr", 29, i0.ɵɵcomponentInstance().trackByRowId, true);
+    i0.ɵɵconditionalCreate(4, DataGridTableComponent_Conditional_12_Conditional_4_Template, 1, 2, "tr", 28);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.vsEnabled() && ctx_r2.vsTopSpacerHeight() > 0 ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r2.vsVisibleItems());
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r2.vsEnabled() && ctx_r2.vsBottomSpacerHeight() > 0 ? 4 : -1);
+} }
+function DataGridTableComponent_Conditional_14_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "ogrid-formula-ref-overlay", 8);
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("containerEl", ctx_r2.tableContainerEl())("references", ctx_r2.formulaReferences())("colOffset", ctx_r2.colOffset());
+} }
+function DataGridTableComponent_Conditional_15_Template(rf, ctx) { if (rf & 1) {
+    const _r34 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 9)(1, "div")(2, "div", 49);
+    i0.ɵɵtext(3, "No results found");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "ogrid-empty-state", 50);
+    i0.ɵɵlistener("clearAll", function DataGridTableComponent_Conditional_15_Template_ogrid_empty_state_clearAll_4_listener() { let tmp_5_0; i0.ɵɵrestoreView(_r34); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView((tmp_5_0 = ctx_r2.emptyState()) == null ? null : tmp_5_0.onClearAll()); });
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    let tmp_4_0;
+    let tmp_5_0;
+    let tmp_6_0;
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(4);
+    i0.ɵɵproperty("message", (tmp_4_0 = ctx_r2.emptyState()) == null ? null : tmp_4_0.message)("hasActiveFilters", ((tmp_5_0 = ctx_r2.emptyState()) == null ? null : tmp_5_0.hasActiveFilters) ?? false)("render", (tmp_6_0 = ctx_r2.emptyState()) == null ? null : tmp_6_0.render);
+} }
+function DataGridTableComponent_Conditional_16_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "div", 51);
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵstyleProp("left", ctx_r2.columnReorderService.dropIndicatorX(), "px");
+} }
+function DataGridTableComponent_Conditional_17_Template(rf, ctx) { if (rf & 1) {
+    const _r35 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "ogrid-context-menu", 52);
+    i0.ɵɵlistener("copyAction", function DataGridTableComponent_Conditional_17_Template_ogrid_context_menu_copyAction_0_listener() { i0.ɵɵrestoreView(_r35); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.handleCopy()); })("cutAction", function DataGridTableComponent_Conditional_17_Template_ogrid_context_menu_cutAction_0_listener() { i0.ɵɵrestoreView(_r35); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.handleCut()); })("pasteAction", function DataGridTableComponent_Conditional_17_Template_ogrid_context_menu_pasteAction_0_listener() { i0.ɵɵrestoreView(_r35); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.handlePaste()); })("selectAllAction", function DataGridTableComponent_Conditional_17_Template_ogrid_context_menu_selectAllAction_0_listener() { i0.ɵɵrestoreView(_r35); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.handleSelectAllCells()); })("undoAction", function DataGridTableComponent_Conditional_17_Template_ogrid_context_menu_undoAction_0_listener() { i0.ɵɵrestoreView(_r35); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onUndo()); })("redoAction", function DataGridTableComponent_Conditional_17_Template_ogrid_context_menu_redoAction_0_listener() { i0.ɵɵrestoreView(_r35); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onRedo()); })("closeAction", function DataGridTableComponent_Conditional_17_Template_ogrid_context_menu_closeAction_0_listener() { i0.ɵɵrestoreView(_r35); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.closeContextMenu()); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("x", ctx_r2.menuPosition().x)("y", ctx_r2.menuPosition().y)("hasSelection", ctx_r2.hasCellSelection())("canUndoProp", ctx_r2.canUndo())("canRedoProp", ctx_r2.canRedo())("classNames", ctx_r2.contextMenuClasses);
+} }
+function DataGridTableComponent_Conditional_19_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "ogrid-status-bar", 12);
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    const sbConfig_r36 = i0.ɵɵreadContextLet(18);
+    i0.ɵɵproperty("totalCount", sbConfig_r36.totalCount)("filteredCount", sbConfig_r36.filteredCount)("selectedCount", sbConfig_r36.selectedCount ?? ctx_r2.selectedRowIds().size)("selectedCellCount", ctx_r2.selectionCellCount())("aggregation", sbConfig_r36.aggregation)("suppressRowCount", sbConfig_r36.suppressRowCount)("classNames", ctx_r2.statusBarClasses);
+} }
+function DataGridTableComponent_Conditional_20_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 13)(1, "div", 53)(2, "span", 54);
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(ctx_r2.loadingMessage());
+} }
+export class DataGridTableComponent extends BaseDataGridTableComponent {
+    constructor() {
+        super();
+        this.sortBy = undefined;
+        this.sortDirection = 'asc';
+        this.columnOrder = undefined;
+        this.onColumnOrderChange = undefined;
+        this.onColumnResized = undefined;
+        this.onColumnPinned = undefined;
+        this.pinnedColumnsInput = undefined;
+        this.initialColumnWidths = undefined;
+        this.layoutMode = 'fill';
+        this.suppressHorizontalScroll = undefined;
+        this.stickyHeaderInput = undefined;
+        this.columnReorder = undefined;
+        this.isLoadingInput = false;
+        this.loadingMessageInput = 'Loading\u2026';
+        this.editable = undefined;
+        this.cellSelection = undefined;
+        this.onCellValueChanged = undefined;
+        this.onUndoInput = undefined;
+        this.onRedoInput = undefined;
+        this.canUndoInput = undefined;
+        this.canRedoInput = undefined;
+        this.rowSelectionMode = 'none';
+        this.selectedRows = undefined;
+        this.onSelectionChange = undefined;
+        this.statusBar = undefined;
+        this.filterOptions = {};
+        this.loadingFilterOptions = {};
+        this.peopleSearch = undefined;
+        this.getUserByEmail = undefined;
+        this.emptyStateInput = undefined;
+        this.onCellError = undefined;
+        this.ariaLabelInput = undefined;
+        this.ariaLabelledByInput = undefined;
+        this.showRowNumbers = false;
+        this.showColumnLettersInput = false;
+        this.showNameBoxInput = false;
+        this.onActiveCellChange = undefined;
+        this.formulaReferencesInput = undefined;
+        this.currentPageInput = 1;
+        this.pageSizeInput = 25;
+        this.defaultMinWidth = DEFAULT_MIN_COLUMN_WIDTH;
+        this.statusBarClasses = {
+            statusBar: 'ogrid-status-bar',
+            statusBarItem: 'ogrid-status-bar-item',
+            statusBarLabel: 'ogrid-status-bar-label',
+            statusBarValue: 'ogrid-status-bar-value',
+        };
+        this.contextMenuClasses = {
+            contextMenu: 'ogrid-context-menu',
+            contextMenuItem: 'ogrid-context-menu-item',
+            contextMenuItemLabel: 'ogrid-context-menu-item-label',
+            contextMenuItemShortcut: 'ogrid-context-menu-item-shortcut',
+            contextMenuDivider: 'ogrid-context-menu-divider',
+        };
+        // PrimeNG uses flat number overrides for column sizing
+        this.primengColumnSizingOverrides = signal({}, ...(ngDevMode ? [{ debugName: "primengColumnSizingOverrides" }] : []));
+        this.propsSignal = signal(undefined, ...(ngDevMode ? [{ debugName: "propsSignal" }] : []));
+        this.resizeStartX = 0;
+        this.resizeColumnId = '';
+        this.resizeStartWidth = 0;
+        // Bound method reference for template
+        this.cancelEditHandler = () => this.cancelEdit();
+        this.showColumnLetters = computed(() => !!this.getProps()?.showColumnLetters, ...(ngDevMode ? [{ debugName: "showColumnLetters" }] : []));
+        this.formulaReferences = computed(() => this.getProps()?.formulaReferences, ...(ngDevMode ? [{ debugName: "formulaReferences" }] : []));
+        // --- PrimeNG-specific computed signals ---
+        this.resolvedAriaLabel = computed(() => this.ariaLabelInput ?? (this.ariaLabelledByInput ? undefined : 'Data grid'), ...(ngDevMode ? [{ debugName: "resolvedAriaLabel" }] : []));
+        this.tableWidthStyle = computed(() => {
+            if (this.showEmptyInGrid())
+                return '100%';
+            if (this.allowOverflowX())
+                return 'fit-content';
+            if (this.layoutMode === 'content')
+                return 'fit-content';
+            return '100%';
+        }, ...(ngDevMode ? [{ debugName: "tableWidthStyle" }] : []));
+        this.tableMinWidthStyle = computed(() => {
+            if (this.showEmptyInGrid())
+                return '100%';
+            if (this.allowOverflowX())
+                return 'max-content';
+            if (this.layoutMode === 'content')
+                return 'max-content';
+            return '100%';
+        }, ...(ngDevMode ? [{ debugName: "tableMinWidthStyle" }] : []));
+        this.initBase();
+        // Watch active cell and notify parent via onActiveCellChange when cellReferences is enabled
+        effect(() => {
+            const props = this.getProps();
+            const onActiveCellChange = props?.onActiveCellChange;
+            if (!onActiveCellChange)
+                return;
+            const ac = this.activeCell();
+            if (ac) {
+                const colIndex = ac.columnIndex - this.colOffset();
+                const rowNumber = ac.rowIndex + 1;
+                onActiveCellChange(formatCellReference(colIndex, rowNumber));
+            }
+            else {
+                onActiveCellChange(null);
+            }
+        });
+    }
+    ngOnChanges(changes) {
+        // Initialize column sizing from initial widths
+        if (changes['initialColumnWidths']) {
+            const iw = this.initialColumnWidths;
+            if (iw) {
+                this.primengColumnSizingOverrides.set({ ...iw });
+            }
+        }
+        // Rebuild props and only set if values actually changed (shallow compare)
+        const next = this.buildProps();
+        const prev = this.propsSignal();
+        if (!prev || !this.shallowEqual(prev, next)) {
+            this.propsSignal.set(next);
+        }
+    }
+    /** Shallow-compare two props objects by their top-level keys. */
+    shallowEqual(a, b) {
+        const aObj = a;
+        const bObj = b;
+        const keysA = Object.keys(aObj);
+        const keysB = Object.keys(bObj);
+        if (keysA.length !== keysB.length)
+            return false;
+        for (const key of keysA) {
+            if (aObj[key] !== bObj[key])
+                return false;
+        }
+        return true;
+    }
+    // --- Abstract method implementations ---
+    getProps() {
+        return this.propsSignal();
+    }
+    getWrapperRef() {
+        return this.wrapperRef;
+    }
+    getTableContainerRef() {
+        return this.tableContainerRefEl;
+    }
+    // --- Column width override (PrimeNG uses flat number instead of { widthPx }) ---
+    getColumnWidth(col) {
+        const override = this.primengColumnSizingOverrides()[col.columnId];
+        if (override)
+            return override;
+        return col.idealWidth ?? col.defaultWidth ?? col.minWidth ?? DEFAULT_MIN_COLUMN_WIDTH;
+    }
+    // --- PrimeNG-specific helpers ---
+    trackByRowId(_index, item) {
+        return this.getRowIdInput(item);
+    }
+    // --- PrimeNG-specific event handlers ---
+    onSelectAllChangePrimeng(checked) {
+        this.state().rowSelection.handleSelectAll(checked);
+    }
+    onRowClickPrimeng(e, item) {
+        if (this.rowSelectionMode !== 'single')
+            return;
+        const rowId = this.getRowIdInput(item);
+        const ids = this.selectedRowIds();
+        this.state().rowSelection.updateSelection(ids.has(rowId) ? new Set() : new Set([rowId]));
+    }
+    onRowCheckboxChangePrimeng(item, checked, rowIndex, _e) {
+        const rowId = this.getRowIdInput(item);
+        this.state().rowSelection.handleRowCheckboxChange(rowId, checked, rowIndex, this.lastMouseShift);
+    }
+    onResizeStartPrimeng(e, col) {
+        e.preventDefault();
+        // Clear cell selection before resize so selection outlines don't persist during drag
+        this.state().interaction.setActiveCell?.(null);
+        this.state().interaction.setSelectionRange?.(null);
+        this.getWrapperRef()?.nativeElement.focus({ preventScroll: true });
+        this.resizeStartX = e.clientX;
+        this.resizeColumnId = col.columnId;
+        this.resizeStartWidth = col.columnId === ROW_NUMBER_COLUMN_ID ? this.getRowNumberWidth() : this.getColumnWidth(col);
+        const onMove = (me) => {
+            const delta = me.clientX - this.resizeStartX;
+            const minW = col.columnId === ROW_NUMBER_COLUMN_ID ? ROW_NUMBER_COLUMN_MIN_WIDTH : (col.minWidth ?? DEFAULT_MIN_COLUMN_WIDTH);
+            const newWidth = Math.max(minW, this.resizeStartWidth + delta);
+            this.primengColumnSizingOverrides.update((prev) => ({ ...prev, [this.resizeColumnId]: newWidth }));
+            this.columnSizingVersion.update(v => v + 1);
+        };
+        const onUp = () => {
+            window.removeEventListener('pointermove', onMove, true);
+            window.removeEventListener('pointerup', onUp, true);
+            const finalWidth = this.primengColumnSizingOverrides()[this.resizeColumnId];
+            if (finalWidth) {
+                this.onColumnResized?.(this.resizeColumnId, finalWidth);
+                const overrides = {};
+                for (const [id, w] of Object.entries(this.primengColumnSizingOverrides())) {
+                    overrides[id] = { widthPx: w };
+                }
+                this.state().layout.setColumnSizingOverrides(overrides);
+            }
+        };
+        window.addEventListener('pointermove', onMove, true);
+        window.addEventListener('pointerup', onUp, true);
+    }
+    onResizeRowNumber(event) {
+        event.stopPropagation();
+        this.onResizeStartPrimeng(event, { columnId: ROW_NUMBER_COLUMN_ID, name: '#' });
+    }
+    getRowNumberWidth() {
+        const override = this.primengColumnSizingOverrides()[ROW_NUMBER_COLUMN_ID];
+        if (override)
+            return override;
+        return super.getRowNumberWidth();
+    }
+    // --- Build props ---
+    buildProps() {
+        return {
+            items: this.itemsInput,
+            columns: this.columns,
+            getRowId: this.getRowIdInput,
+            sortBy: this.sortBy,
+            sortDirection: this.sortDirection,
+            onColumnSort: this.onColumnSort,
+            visibleColumns: this.visibleColumns,
+            columnOrder: this.columnOrder,
+            onColumnOrderChange: this.onColumnOrderChange,
+            onColumnResized: this.onColumnResized,
+            onColumnPinned: this.onColumnPinned,
+            pinnedColumns: this.pinnedColumnsInput,
+            initialColumnWidths: this.initialColumnWidths,
+            layoutMode: this.layoutMode,
+            suppressHorizontalScroll: this.suppressHorizontalScroll,
+            columnReorder: this.columnReorder,
+            isLoading: this.isLoadingInput,
+            loadingMessage: this.loadingMessageInput,
+            editable: this.editable,
+            cellSelection: this.cellSelection,
+            onCellValueChanged: this.onCellValueChanged,
+            onUndo: this.onUndoInput,
+            onRedo: this.onRedoInput,
+            canUndo: this.canUndoInput,
+            canRedo: this.canRedoInput,
+            rowSelection: this.rowSelectionMode,
+            selectedRows: this.selectedRows,
+            onSelectionChange: this.onSelectionChange,
+            showRowNumbers: this.showRowNumbers,
+            showColumnLetters: this.showColumnLettersInput,
+            showNameBox: this.showNameBoxInput,
+            onActiveCellChange: this.onActiveCellChange,
+            currentPage: this.currentPageInput,
+            pageSize: this.pageSizeInput,
+            statusBar: this.statusBar,
+            filters: this.filters,
+            onFilterChange: this.onFilterChange,
+            filterOptions: this.filterOptions,
+            loadingFilterOptions: this.loadingFilterOptions,
+            peopleSearch: this.peopleSearch,
+            getUserByEmail: this.getUserByEmail,
+            emptyState: this.emptyStateInput,
+            onCellError: this.onCellError,
+            stickyHeader: this.stickyHeaderInput,
+            'aria-label': this.ariaLabelInput,
+            'aria-labelledby': this.ariaLabelledByInput,
+            formulaReferences: this.formulaReferencesInput,
+        };
+    }
+    getColumnLetter(colIdx) {
+        return indexToColumnLetter(colIdx);
+    }
+    static { this.ɵfac = function DataGridTableComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || DataGridTableComponent)(); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DataGridTableComponent, selectors: [["ogrid-primeng-datagrid-table"]], viewQuery: function DataGridTableComponent_Query(rf, ctx) { if (rf & 1) {
+            i0.ɵɵviewQuery(_c0, 5)(_c1, 5);
+        } if (rf & 2) {
+            let _t;
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.wrapperRef = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.tableContainerRefEl = _t.first);
+        } }, inputs: { itemsInput: [0, "items", "itemsInput"], columns: "columns", getRowIdInput: [0, "getRowId", "getRowIdInput"], sortBy: "sortBy", sortDirection: "sortDirection", onColumnSort: "onColumnSort", visibleColumns: "visibleColumns", columnOrder: "columnOrder", onColumnOrderChange: "onColumnOrderChange", onColumnResized: "onColumnResized", onColumnPinned: "onColumnPinned", pinnedColumnsInput: [0, "pinnedColumns", "pinnedColumnsInput"], initialColumnWidths: "initialColumnWidths", layoutMode: "layoutMode", suppressHorizontalScroll: "suppressHorizontalScroll", stickyHeaderInput: "stickyHeaderInput", columnReorder: "columnReorder", isLoadingInput: [0, "isLoading", "isLoadingInput"], loadingMessageInput: [0, "loadingMessage", "loadingMessageInput"], editable: "editable", cellSelection: "cellSelection", onCellValueChanged: "onCellValueChanged", onUndoInput: [0, "onUndo", "onUndoInput"], onRedoInput: [0, "onRedo", "onRedoInput"], canUndoInput: [0, "canUndo", "canUndoInput"], canRedoInput: [0, "canRedo", "canRedoInput"], rowSelectionMode: [0, "rowSelection", "rowSelectionMode"], selectedRows: "selectedRows", onSelectionChange: "onSelectionChange", statusBar: "statusBar", filters: "filters", onFilterChange: "onFilterChange", filterOptions: "filterOptions", loadingFilterOptions: "loadingFilterOptions", peopleSearch: "peopleSearch", getUserByEmail: "getUserByEmail", emptyStateInput: [0, "emptyState", "emptyStateInput"], onCellError: "onCellError", ariaLabelInput: [0, "aria-label", "ariaLabelInput"], ariaLabelledByInput: [0, "aria-labelledby", "ariaLabelledByInput"], showRowNumbers: "showRowNumbers", showColumnLettersInput: [0, "showColumnLetters", "showColumnLettersInput"], showNameBoxInput: [0, "showNameBox", "showNameBoxInput"], onActiveCellChange: "onActiveCellChange", formulaReferencesInput: [0, "formulaReferences", "formulaReferencesInput"], currentPageInput: [0, "currentPage", "currentPageInput"], pageSizeInput: [0, "pageSize", "pageSizeInput"] }, features: [i0.ɵɵProvidersFeature([DataGridStateService, ColumnReorderService, VirtualScrollService]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 21, vars: 36, consts: [["wrapper", ""], ["tableContainer", ""], [1, "ogrid-root"], ["tabindex", "0", "role", "region", "data-ogrid-scroll-container", "", 1, "ogrid-scroll-wrapper", 3, "contextmenu", "keydown", "pointerdown", "scroll"], [1, "ogrid-table-wrapper"], ["role", "grid", 1, "ogrid-table"], [1, "ogrid-column-letter-row"], [3, "containerEl", "selectionRange", "copyRange", "cutRange", "colOffset", "columnSizingVersion", "items", "visibleColumns", "columnOrder"], [3, "containerEl", "references", "colOffset"], [1, "ogrid-empty-container"], [1, "ogrid-drop-indicator", 3, "left"], [3, "x", "y", "hasSelection", "canUndoProp", "canRedoProp", "classNames"], [3, "totalCount", "filteredCount", "selectedCount", "selectedCellCount", "aggregation", "suppressRowCount", "classNames"], ["aria-live", "polite", 1, "ogrid-loading-overlay"], [1, "ogrid-column-letter-cell"], ["scope", "col", "rowSpan", "1", 1, "ogrid-checkbox-header"], ["scope", "col", "rowSpan", "1", 1, "ogrid-row-number-header", 3, "width", "min-width", "max-width"], [1, "ogrid-row-number-spacer"], ["type", "checkbox", "aria-label", "Select all rows", 3, "change", "checked", "indeterminate"], ["scope", "col", "rowSpan", "1", 1, "ogrid-row-number-header"], ["role", "separator", "aria-label", "Resize row numbers", 1, "ogrid-resize-handle", 3, "pointerdown", "dblclick"], ["scope", "colgroup", 1, "ogrid-column-group-header"], ["scope", "col", 1, "ogrid-header-cell", 3, "ogrid-th-pinned-left", "ogrid-th-pinned-right", "min-width", "width", "max-width", "left", "right", "cursor"], ["scope", "col", 1, "ogrid-header-cell", 3, "pointerdown"], [1, "ogrid-header-content"], [3, "columnKey", "columnName", "filterType", "isSorted", "isSortedDescending", "onSort", "selectedValues", "onFilterChange", "options", "isLoadingOptions", "textValue", "onTextChange", "selectedUser", "onUserChange", "peopleSearch", "dateValue", "onDateChange"], [3, "columnId", "canPinLeft", "canPinRight", "canUnpin", "currentSort", "isSortable", "isResizable", "handlers"], ["role", "separator", 1, "ogrid-resize-handle", 3, "pointerdown", "dblclick"], [3, "height"], [3, "background"], [3, "click"], [1, "ogrid-checkbox-cell"], [1, "ogrid-row-number-cell", 3, "width", "min-width", "max-width"], [3, "width", "minWidth", "maxWidth", "padding"], [1, "ogrid-data-cell", 3, "ogrid-td-pinned-left", "ogrid-td-pinned-right", "min-width", "width", "max-width", "left", "right", "text-align"], [1, "ogrid-checkbox-cell", 3, "click"], ["type", "checkbox", 3, "change", "checked"], [1, "ogrid-row-number-cell"], [1, "ogrid-data-cell"], [1, "ogrid-editing-cell"], [3, "item", "column", "rowIndex", "globalColIndex", "displayValue", "editorProps", "onCancel"], [1, "ogrid-cell-content", 3, "cursor", "background", "outline", "outline-offset"], [3, "commit", "cancel", "value", "item", "column", "rowIndex", "editorType"], [1, "ogrid-cell-content", 3, "pointerdown", "click", "dblclick", "contextmenu"], ["type", "checkbox", 2, "margin", "0", "outline", "none", 3, "checked", "disabled", "cursor"], [3, "style"], ["aria-label", "Fill handle", 1, "ogrid-fill-handle"], ["type", "checkbox", 2, "margin", "0", "outline", "none", 3, "change", "pointerdown", "click", "checked", "disabled"], ["aria-label", "Fill handle", 1, "ogrid-fill-handle", 3, "pointerdown"], [1, "ogrid-empty-title"], [3, "clearAll", "message", "hasActiveFilters", "render"], [1, "ogrid-drop-indicator"], [3, "copyAction", "cutAction", "pasteAction", "selectAllAction", "undoAction", "redoAction", "closeAction", "x", "y", "hasSelection", "canUndoProp", "canRedoProp", "classNames"], [1, "ogrid-loading-content"], [1, "ogrid-loading-text"]], template: function DataGridTableComponent_Template(rf, ctx) { if (rf & 1) {
+            const _r1 = i0.ɵɵgetCurrentView();
+            i0.ɵɵelementStart(0, "div", 2)(1, "div", 3, 0);
+            i0.ɵɵlistener("contextmenu", function DataGridTableComponent_Template_div_contextmenu_1_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView($event.preventDefault()); })("keydown", function DataGridTableComponent_Template_div_keydown_1_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onGridKeyDown($event)); })("pointerdown", function DataGridTableComponent_Template_div_pointerdown_1_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onWrapperMouseDown($event)); })("scroll", function DataGridTableComponent_Template_div_scroll_1_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onWrapperScroll($event)); });
+            i0.ɵɵelementStart(3, "div", 4)(4, "div", 4)(5, "div", 4, 1)(7, "table", 5)(8, "thead");
+            i0.ɵɵconditionalCreate(9, DataGridTableComponent_Conditional_9_Template, 5, 2, "tr", 6);
+            i0.ɵɵrepeaterCreate(10, DataGridTableComponent_For_11_Template, 7, 4, "tr", null, i0.ɵɵrepeaterTrackByIndex);
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(12, DataGridTableComponent_Conditional_12_Template, 5, 2, "tbody");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelement(13, "ogrid-marching-ants-overlay", 7);
+            i0.ɵɵconditionalCreate(14, DataGridTableComponent_Conditional_14_Template, 1, 3, "ogrid-formula-ref-overlay", 8);
+            i0.ɵɵconditionalCreate(15, DataGridTableComponent_Conditional_15_Template, 5, 3, "div", 9);
+            i0.ɵɵelementEnd()()()();
+            i0.ɵɵconditionalCreate(16, DataGridTableComponent_Conditional_16_Template, 1, 2, "div", 10);
+            i0.ɵɵconditionalCreate(17, DataGridTableComponent_Conditional_17_Template, 1, 6, "ogrid-context-menu", 11);
+            i0.ɵɵdeclareLet(18);
+            i0.ɵɵconditionalCreate(19, DataGridTableComponent_Conditional_19_Template, 1, 7, "ogrid-status-bar", 12);
+            i0.ɵɵconditionalCreate(20, DataGridTableComponent_Conditional_20_Template, 4, 1, "div", 13);
+            i0.ɵɵelementEnd();
+        } if (rf & 2) {
+            i0.ɵɵadvance();
+            i0.ɵɵstyleProp("--data-table-column-count", ctx.state().layout.totalColCount)("--ogrid-row-height", ctx.rowHeightCssVar());
+            i0.ɵɵclassProp("ogrid-scroll-wrapper--loading-empty", ctx.isLoading() && ctx.items().length === 0);
+            i0.ɵɵattribute("aria-label", ctx.resolvedAriaLabel())("aria-labelledby", ctx.ariaLabelledBy())("data-empty", ctx.showEmptyInGrid() ? "true" : null)("data-column-count", ctx.state().layout.totalColCount)("data-overflow-x", ctx.allowOverflowX() ? "true" : "false")("data-virtual-scroll", ctx.vsEnabled() ? "" : null)("data-has-selection", ctx.rowSelectionMode !== "none" ? "true" : null);
+            i0.ɵɵadvance(3);
+            i0.ɵɵclassProp("loading-dimmed", ctx.isLoading() && ctx.items().length > 0);
+            i0.ɵɵadvance(3);
+            i0.ɵɵattribute("data-virtual-scroll", ctx.vsEnabled() ? "" : null);
+            i0.ɵɵadvance();
+            i0.ɵɵclassMap(ctx.stickyHeader() ? "ogrid-thead ogrid-sticky-header" : "ogrid-thead");
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.showColumnLetters() ? 9 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵrepeater(ctx.headerRows());
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(!ctx.showEmptyInGrid() ? 12 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("containerEl", ctx.tableContainerEl())("selectionRange", ctx.state().interaction.selectionRange)("copyRange", ctx.state().interaction.copyRange)("cutRange", ctx.state().interaction.cutRange)("colOffset", ctx.state().layout.colOffset)("columnSizingVersion", ctx.columnSizingVersion())("items", ctx.items())("visibleColumns", ctx.propsVisibleColumns())("columnOrder", ctx.propsColumnOrder());
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.formulaReferences() && ctx.formulaReferences().length > 0 ? 14 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.showEmptyInGrid() && ctx.emptyState() ? 15 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.columnReorderService.isDragging() && ctx.columnReorderService.dropIndicatorX() !== null ? 16 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.menuPosition() ? 17 : -1);
+            i0.ɵɵadvance();
+            const sbConfig_r37 = i0.ɵɵstoreLet(ctx.statusBarConfig());
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(sbConfig_r37 ? 19 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.isLoading() ? 20 : -1);
+        } }, dependencies: [StatusBarComponent,
+            GridContextMenuComponent,
+            MarchingAntsOverlayComponent,
+            EmptyStateComponent,
+            FormulaRefOverlayComponent,
+            ColumnHeaderFilterComponent,
+            ColumnHeaderMenuComponent,
+            InlineCellEditorComponent,
+            PopoverCellEditorComponent], styles: ["\n    :host { display: block; }\n    .ogrid-root {\n      position: relative;\n      flex: 1;\n      min-height: 0;\n      display: flex;\n      flex-direction: column;\n      overflow: hidden;\n    }\n    .ogrid-scroll-wrapper {\n      overflow: auto;\n      position: relative;\n      background: var(--ogrid-bg, #ffffff);\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n      outline: none;\n    }\n    .ogrid-scroll-wrapper:focus-visible { outline: none; }\n    .ogrid-scroll-wrapper[data-virtual-scroll] { flex: 1; min-height: 0; }\n    .ogrid-scroll-wrapper--loading-empty { min-height: 200px; }\n    .ogrid-table-wrapper {\n      position: relative;\n      overflow-x: clip;\n    }\n    .ogrid-table {\n      width: var(--data-table-width, 100%);\n      min-width: var(--data-table-min-width, 100%);\n      border-collapse: collapse;\n      table-layout: fixed;\n    }\n    .ogrid-table tr th:first-child,\n    .ogrid-table tr td:first-child { border-left: none; }\n    .ogrid-table tbody tr { height: var(--ogrid-row-height, auto); }\n    .ogrid-thead {\n      z-index: 3;\n      background: var(--ogrid-header-bg, #f5f5f5);\n    }\n    .ogrid-sticky-header { position: sticky; top: 0; }\n    .ogrid-sticky-header .ogrid-checkbox-header,\n    .ogrid-sticky-header .ogrid-row-number-header { position: sticky; top: 0; }\n    .ogrid-checkbox-header {\n      width: 48px;\n      min-width: 48px;\n      max-width: 48px;\n      text-align: center;\n      background: var(--ogrid-header-bg, #f5f5f5);\n      border-bottom: 2px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      z-index: 3;\n    }\n    .ogrid-row-number-header {\n      text-align: center;\n      font-weight: 600;\n      background: var(--ogrid-header-bg, #f5f5f5);\n      border-bottom: 2px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      z-index: 3;\n      position: relative;\n    }\n    .ogrid-row-number-spacer {\n      background: var(--ogrid-header-bg, #f5f5f5);\n    }\n    .ogrid-column-group-header {\n      text-align: center;\n      font-weight: 600;\n      background: var(--ogrid-header-bg, #f5f5f5);\n      border-bottom: 2px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      padding: 6px 10px;\n    }\n    .ogrid-header-cell {\n      background: var(--ogrid-header-bg, #f5f5f5);\n      border-bottom: 2px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      padding: 0;\n      position: relative;\n      user-select: none;\n    }\n    .ogrid-header-content {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n      padding: 6px 10px;\n    }\n    .ogrid-resize-handle {\n      position: absolute;\n      top: 0;\n      right: 0;\n      bottom: 0;\n      width: 4px;\n      cursor: col-resize;\n      touch-action: none;\n    }\n    @media (pointer: coarse) {\n      .ogrid-resize-handle { width: 16px; right: -6px; }\n    }\n    .ogrid-checkbox-cell {\n      width: 48px;\n      min-width: 48px;\n      max-width: 48px;\n      padding: 6px 4px;\n      text-align: center;\n      border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n    }\n    .ogrid-row-number-cell {\n      padding: 6px;\n      text-align: center;\n      font-weight: 600;\n      font-variant-numeric: tabular-nums;\n      color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6));\n      background: var(--ogrid-header-bg, rgba(0, 0, 0, 0.04));\n      border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      position: sticky;\n      left: 0;\n      z-index: 3;\n    }\n    .ogrid-data-cell {\n      padding: 0;\n      border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      position: relative;\n    }\n    .ogrid-data-cell:has(> [data-active-cell]),\n    .ogrid-data-cell:has(> .ogrid-editing-cell) { z-index: 2; }\n    .ogrid-cell-content {\n      padding: var(--ogrid-cell-padding, 6px 10px);\n      min-height: 20px;\n      cursor: default;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n    .ogrid-editing-cell {\n      width: 100%; height: 100%; display: flex; align-items: center; box-sizing: border-box;\n      outline: 2px solid var(--ogrid-selection-color, #217346); outline-offset: -1px;\n      z-index: 2; position: relative; background: var(--ogrid-bg, #fff); overflow: hidden; padding: 0;\n    }\n    .ogrid-scroll-wrapper [data-drag-range] { background: var(--ogrid-range-bg, rgba(33, 115, 70, 0.12)); }\n    .ogrid-fill-handle {\n      position: absolute;\n      bottom: -3px;\n      right: -3px;\n      width: 7px;\n      height: 7px;\n      background: var(--ogrid-selection, #217346);\n      cursor: crosshair;\n      touch-action: none;\n      z-index: 2;\n    }\n    @media (pointer: coarse) {\n      .ogrid-fill-handle { width: 14px; height: 14px; right: -7px; bottom: -7px; border-radius: 2px; }\n    }\n    .ogrid-empty-container {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      padding: 48px 24px;\n      text-align: center;\n      color: var(--ogrid-fg-muted, rgba(0, 0, 0, 0.5));\n    }\n    .ogrid-empty-title {\n      font-weight: 600;\n      margin-bottom: 8px;\n    }\n    .ogrid-status-bar {\n      display: flex;\n      align-items: center;\n      gap: 16px;\n      width: 100%;\n      min-height: 33px;\n      padding: 6px 12px;\n      box-sizing: border-box;\n      font-size: 12px;\n      line-height: 20px;\n      color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6));\n      background: var(--ogrid-header-bg, #f5f5f5);\n      border-top: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n    }\n    .ogrid-status-bar-item {\n      display: inline-flex;\n      align-items: center;\n      gap: 4px;\n    }\n    .ogrid-status-bar-item:not(:last-child)::after {\n      content: '';\n      width: 1px;\n      height: 14px;\n      margin-left: 12px;\n      background: var(--ogrid-border, rgba(0, 0, 0, 0.12));\n    }\n    .ogrid-status-bar-label {\n      color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6));\n    }\n    .ogrid-status-bar-value {\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n      font-weight: 600;\n    }\n    .ogrid-loading-overlay {\n      position: absolute;\n      inset: 0;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: var(--ogrid-loading-overlay, rgba(255, 255, 255, 0.7));\n      z-index: 10;\n    }\n    .ogrid-loading-content {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      color: var(--ogrid-fg, #242424);\n    }\n    .ogrid-loading-text {\n      font-size: 14px;\n    }\n    .loading-dimmed {\n      opacity: 0.5;\n      pointer-events: none;\n    }\n    .ogrid-drop-indicator {\n      position: absolute;\n      top: 0;\n      bottom: 0;\n      width: 3px;\n      background: var(--ogrid-primary, #217346);\n      pointer-events: none;\n      z-index: 100;\n      transition: left 0.05s;\n    }\n    .ogrid-th-pinned-left {\n      position: sticky;\n      top: 0;\n      left: 0;\n      z-index: 10;\n      background: var(--ogrid-header-bg, #f5f5f5);\n      border-right: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      box-shadow: 2px 0 4px -1px rgba(0, 0, 0, 0.1);\n    }\n    .ogrid-th-pinned-right {\n      position: sticky;\n      top: 0;\n      right: 0;\n      z-index: 10;\n      background: var(--ogrid-header-bg, #f5f5f5);\n      border-left: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      box-shadow: -2px 0 4px -1px rgba(0, 0, 0, 0.1);\n    }\n    .ogrid-td-pinned-left {\n      position: sticky;\n      left: 0;\n      z-index: 5;\n      background: var(--ogrid-bg, #fff);\n      border-right: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      box-shadow: 2px 0 4px -1px rgba(0, 0, 0, 0.1);\n    }\n    .ogrid-td-pinned-right {\n      position: sticky;\n      right: 0;\n      z-index: 5;\n      background: var(--ogrid-bg, #fff);\n      border-left: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      box-shadow: -2px 0 4px -1px rgba(0, 0, 0, 0.1);\n    }\n    ::ng-deep th:focus-visible,\n    ::ng-deep td:focus-visible {\n      outline: 2px solid var(--primary-color, #6366f1);\n      outline-offset: -2px;\n      z-index: 11;\n    }\n    ::ng-deep .p-button:focus-visible,\n    ::ng-deep button:focus-visible {\n      outline: 2px solid var(--primary-color, #6366f1);\n      outline-offset: 2px;\n    }\n\n    /* Context menu */\n    .ogrid-context-menu {\n      position: fixed;\n      z-index: 1000;\n      min-width: 160px;\n      padding: 4px 0;\n      background: var(--ogrid-bg, #fff);\n      border: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      border-radius: 6px;\n      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n    }\n    .ogrid-context-menu-item {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      gap: 24px;\n      width: 100%;\n      padding: 6px 12px;\n      border: none;\n      background: none;\n      font-size: 13px;\n      text-align: left;\n      cursor: pointer;\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n    }\n    .ogrid-context-menu-item:hover:not(:disabled) {\n      background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04));\n    }\n    .ogrid-context-menu-item:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n    .ogrid-context-menu-item-label {\n      flex: 1;\n    }\n    .ogrid-context-menu-item-shortcut {\n      color: var(--ogrid-fg-muted, rgba(0, 0, 0, 0.5));\n      font-size: 0.85em;\n    }\n    .ogrid-context-menu-divider {\n      height: 1px;\n      margin: 4px 0;\n      background: var(--ogrid-border, rgba(0, 0, 0, 0.12));\n    }\n    ::ng-deep .p-checkbox:focus-visible {\n      outline: 2px solid var(--primary-color, #6366f1);\n      outline-offset: 2px;\n    }\n\n    /* PrimeNG Menu popup overrides.\n       Double-class selectors (0,2,0) beat PrimeNG's single-class (0,1,0) defaults. */\n    .p-menu.p-menu {\n      background: var(--ogrid-bg, #ffffff);\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n      border: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      border-radius: 4px;\n      padding: 4px 0;\n    }\n    .p-menu-overlay.p-menu-overlay {\n      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3), 0 0 0 1px var(--ogrid-border, rgba(0, 0, 0, 0.12));\n    }\n    .p-menu-item-content.p-menu-item-content {\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n    }\n    .p-menu-item-link.p-menu-item-link {\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n      padding: 6px 12px;\n    }\n    .p-menu-item-label.p-menu-item-label {\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n      font-size: 0.875rem;\n    }\n    .p-menu-item:not(.p-disabled) .p-menu-item-content.p-menu-item-content:hover {\n      background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04));\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n    }\n    .p-menu-separator.p-menu-separator {\n      border-color: var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      margin: 4px 0;\n    }\n    .ogrid-column-letter-cell {\n      text-align: center;\n      font-size: 11px;\n      font-weight: 500;\n      color: var(--ogrid-fg-muted, rgba(0, 0, 0, 0.4));\n      padding: 2px 4px;\n      background: var(--ogrid-column-letter-bg, var(--ogrid-header-bg, #f5f5f5));\n      border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      user-select: none;\n      font-variant-numeric: tabular-nums;\n    }\n    /* Reveal column menu trigger on header hover without layout shift.\n       The button always takes up space (visibility: hidden); shown when column is hovered. */\n    @media (hover: hover) {\n      th:hover .column-header-menu-trigger { visibility: visible; }\n    }\n  "], encapsulation: 2, changeDetection: 0 }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DataGridTableComponent, [{
+        type: Component,
+        args: [{ selector: 'ogrid-primeng-datagrid-table', standalone: true, imports: [
+                    StatusBarComponent,
+                    GridContextMenuComponent,
+                    MarchingAntsOverlayComponent,
+                    EmptyStateComponent,
+                    FormulaRefOverlayComponent,
+                    ColumnHeaderFilterComponent,
+                    ColumnHeaderMenuComponent,
+                    InlineCellEditorComponent,
+                    PopoverCellEditorComponent,
+                ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [DataGridStateService, ColumnReorderService, VirtualScrollService], template: `
+    <div class="ogrid-root">
+      <div
+        #wrapper
+        tabindex="0"
+        role="region"
+        class="ogrid-scroll-wrapper"
+        [class.ogrid-scroll-wrapper--loading-empty]="isLoading() && items().length === 0"
+        [attr.aria-label]="resolvedAriaLabel()"
+        [attr.aria-labelledby]="ariaLabelledBy()"
+        [attr.data-empty]="showEmptyInGrid() ? 'true' : null"
+        [attr.data-column-count]="state().layout.totalColCount"
+        [attr.data-overflow-x]="allowOverflowX() ? 'true' : 'false'"
+        [attr.data-virtual-scroll]="vsEnabled() ? '' : null"
+        data-ogrid-scroll-container
+        [attr.data-has-selection]="rowSelectionMode !== 'none' ? 'true' : null"
+        (contextmenu)="$event.preventDefault()"
+        (keydown)="onGridKeyDown($event)"
+        (pointerdown)="onWrapperMouseDown($event)"
+        (scroll)="onWrapperScroll($event)"
+        [style.--data-table-column-count]="state().layout.totalColCount"
+        [style.--ogrid-row-height]="rowHeightCssVar()"
+      >
+        <div class="ogrid-table-wrapper">
+          <div [class.loading-dimmed]="isLoading() && items().length > 0" class="ogrid-table-wrapper">
+            <div #tableContainer class="ogrid-table-wrapper">
+              <table class="ogrid-table" role="grid" [attr.data-virtual-scroll]="vsEnabled() ? '' : null">
+                <thead [class]="stickyHeader() ? 'ogrid-thead ogrid-sticky-header' : 'ogrid-thead'">
+                  @if (showColumnLetters()) {
+                    <tr class="ogrid-column-letter-row">
+                      @if (hasCheckboxCol()) {
+                        <th class="ogrid-column-letter-cell"></th>
+                      }
+                      @if (hasRowNumbersCol()) {
+                        <th class="ogrid-column-letter-cell"></th>
+                      }
+                      @for (col of visibleCols(); track col.columnId; let colIdx = $index) {
+                        <th class="ogrid-column-letter-cell">
+                          {{ getColumnLetter(colIdx) }}
+                        </th>
+                      }
+                    </tr>
+                  }
+                  @for (row of headerRows(); track $index; let rowIdx = $index) {
+                    <tr>
+                      @if (rowIdx === headerRows().length - 1 && hasCheckboxCol()) {
+                        <th scope="col" rowSpan="1" class="ogrid-checkbox-header">
+                          <input
+                            type="checkbox"
+                            [checked]="allSelected()"
+                            [indeterminate]="someSelected() && !allSelected()"
+                            (change)="onSelectAllChangePrimeng($any($event.target).checked)"
+                            aria-label="Select all rows"
+                          />
+                        </th>
+                      }
+                      @if (rowIdx === 0 && rowIdx < headerRows().length - 1 && hasCheckboxCol()) {
+                        <th [attr.rowSpan]="headerRows().length - 1"></th>
+                      }
+                      @if (rowIdx === headerRows().length - 1 && hasRowNumbersCol()) {
+                        <th scope="col" rowSpan="1" class="ogrid-row-number-header"
+                          [style.width.px]="getRowNumberWidth()"
+                          [style.min-width.px]="getRowNumberWidth()"
+                          [style.max-width.px]="getRowNumberWidth()"
+                        >
+                          #
+                          <div
+                            class="ogrid-resize-handle"
+                            role="separator"
+                            aria-label="Resize row numbers"
+                            (pointerdown)="onResizeRowNumber($event)"
+                            (dblclick)="$event.stopPropagation()"
+                          ></div>
+                        </th>
+                      }
+                      @if (rowIdx === 0 && rowIdx < headerRows().length - 1 && hasRowNumbersCol()) {
+                        <th [attr.rowSpan]="headerRows().length - 1" class="ogrid-row-number-spacer"></th>
+                      }
+                      @for (cell of row; track cell.columnDef?.columnId ?? $index; let cellIdx = $index) {
+                        @if (cell.isGroup) {
+                          <th
+                            [attr.colSpan]="cell.colSpan"
+                            scope="colgroup"
+                            class="ogrid-column-group-header"
+                          >
+                            {{ cell.label }}
+                          </th>
+                        } @else {
+                          @let col = asColumnDef(cell.columnDef);
+                          @let pinned = isPinned(col.columnId);
+                          @let config = getFilterConfig(col);
+                          @let sortState = getSortState(col.columnId);
+                          @let ariaSort = sortState === 'asc' ? 'ascending' : sortState === 'desc' ? 'descending' : null;
+                          <th
+                            scope="col"
+                            class="ogrid-header-cell"
+                            [attr.data-column-id]="col.columnId"
+                            [attr.aria-sort]="ariaSort"
+                            [attr.rowSpan]="headerRows().length > 1 && rowIdx < headerRows().length - 1 ? headerRows().length - rowIdx : null"
+                            [class.ogrid-th-pinned-left]="pinned === 'left'"
+                            [class.ogrid-th-pinned-right]="pinned === 'right'"
+                            [style.min-width.px]="getEffectiveMinWidth(col)"
+                            [style.width.px]="getColumnWidth(col)"
+                            [style.max-width.px]="getColumnWidth(col)"
+                            [style.left.px]="pinned === 'left' ? getPinnedLeftOffset(col.columnId) : null"
+                            [style.right.px]="pinned === 'right' ? getPinnedRightOffset(col.columnId) : null"
+                            [style.cursor]="columnReorderService.isDragging() ? 'grabbing' : 'grab'"
+                            (pointerdown)="onHeaderMouseDown(col.columnId, $event)"
+                          >
+                            <div class="ogrid-header-content">
+                              <ogrid-primeng-column-header-filter
+                                [columnKey]="col.columnId"
+                                [columnName]="col.name"
+                                [filterType]="config.filterType"
+                                [isSorted]="config.isSorted ?? false"
+                                [isSortedDescending]="config.isSortedDescending ?? false"
+                                [onSort]="config.onSort"
+                                [selectedValues]="config.selectedValues"
+                                [onFilterChange]="config.onFilterChange"
+                                [options]="config.options ?? []"
+                                [isLoadingOptions]="config.isLoadingOptions ?? false"
+                                [textValue]="config.textValue ?? ''"
+                                [onTextChange]="config.onTextChange"
+                                [selectedUser]="config.selectedUser"
+                                [onUserChange]="config.onUserChange"
+                                [peopleSearch]="config.peopleSearch"
+                                [dateValue]="config.dateValue"
+                                [onDateChange]="config.onDateChange"
+                              ></ogrid-primeng-column-header-filter>
+                              @let colPinState = getPinState(col.columnId);
+                              <column-header-menu
+                                [columnId]="col.columnId"
+                                [canPinLeft]="colPinState.canPinLeft"
+                                [canPinRight]="colPinState.canPinRight"
+                                [canUnpin]="colPinState.canUnpin"
+                                [currentSort]="sortState"
+                                [isSortable]="col.sortable !== false"
+                                [isResizable]="col.resizable !== false"
+                                [handlers]="getColumnMenuHandlersMemoized(col.columnId)"
+                              />
+                            </div>
+                            <div
+                              class="ogrid-resize-handle"
+                              role="separator"
+                              (pointerdown)="onResizeStartPrimeng($event, col)"
+                              (dblclick)="onResizeDoubleClick($event, col)"
+                              [attr.aria-label]="'Resize ' + col.name"
+                            ></div>
+                          </th>
+                        }
+                      }
+                    </tr>
+                  }
+                </thead>
+
+                @if (!showEmptyInGrid()) {
+                  <tbody>
+                    @if (vsEnabled() && vsTopSpacerHeight() > 0) {
+                      <tr [style.height.px]="vsTopSpacerHeight()"></tr>
+                    }
+                    @for (item of vsVisibleItems(); track trackByRowId($index, item); let localIdx = $index) {
+                      @let rowIndex = vsStartIndex() + localIdx;
+                      @let rowId = getRowIdInput(item);
+                      @let isSelected = selectedRowIds().has(rowId);
+                      <tr
+                        [attr.data-row-id]="rowId"
+                        [attr.aria-selected]="isSelected || null"
+                        [style.background]="isSelected ? 'var(--ogrid-selected-bg, #e8f0fe)' : null"
+                        (click)="onRowClickPrimeng($event, item)"
+                      >
+                        @if (hasCheckboxCol()) {
+                          <td
+                            class="ogrid-checkbox-cell"
+                            [attr.data-row-index]="rowIndex"
+                            [attr.data-col-index]="0"
+                            (click)="$event.stopPropagation()"
+                          >
+                            <input
+                              type="checkbox"
+                              [checked]="isSelected"
+                              (change)="onRowCheckboxChangePrimeng(item, $any($event.target).checked, rowIndex, $event)"
+                              [attr.aria-label]="'Select row ' + (rowIndex + 1)"
+                            />
+                          </td>
+                        }
+                        @if (hasRowNumbersCol()) {
+                          <td class="ogrid-row-number-cell"
+                            [style.width.px]="getRowNumberWidth()"
+                            [style.min-width.px]="getRowNumberWidth()"
+                            [style.max-width.px]="getRowNumberWidth()"
+                          >
+                            {{ rowNumberOffset() + rowIndex + 1 }}
+                          </td>
+                        }
+                        @if (vsColumnsEnabled() && vsLeftSpacerWidth() > 0) {
+                          <td [style.width.px]="vsLeftSpacerWidth()" [style.minWidth.px]="vsLeftSpacerWidth()" [style.maxWidth.px]="vsLeftSpacerWidth()" [style.padding]="'0'"></td>
+                        }
+                        @for (col of vsVisibleCols(); track col.columnId) {
+                          @let pinned = isPinned(col.columnId);
+                          <td
+                            [attr.data-column-id]="col.columnId"
+                            [class.ogrid-td-pinned-left]="pinned === 'left'"
+                            [class.ogrid-td-pinned-right]="pinned === 'right'"
+                            class="ogrid-data-cell"
+                            [style.min-width.px]="getEffectiveMinWidth(col)"
+                            [style.width.px]="getColumnWidth(col)"
+                            [style.max-width.px]="getColumnWidth(col)"
+                            [style.left.px]="pinned === 'left' ? getPinnedLeftOffset(col.columnId) : null"
+                            [style.right.px]="pinned === 'right' ? getPinnedRightOffset(col.columnId) : null"
+                            [style.text-align]="col.type === 'numeric' ? 'right' : null"
+                          >
+                            @let descriptor = getCellDescriptor(item, col, rowIndex, getGlobalColIndex(col));
+                            @if (descriptor.mode === 'editing-inline') {
+                              <div class="ogrid-editing-cell">
+                              <ogrid-primeng-inline-cell-editor
+                                [value]="descriptor.value"
+                                [item]="item"
+                                [column]="col"
+                                [rowIndex]="rowIndex"
+                                [editorType]="descriptor.editorType ?? 'text'"
+                                (commit)="commitEdit(item, col.columnId, descriptor.value, $event, rowIndex, descriptor.globalColIndex)"
+                                (cancel)="cancelEdit()"
+                              ></ogrid-primeng-inline-cell-editor>
+                              </div>
+                            } @else if (descriptor.mode === 'editing-popover') {
+                              @let editorProps = buildPopoverEditorProps(item, col, descriptor);
+                              <ogrid-primeng-popover-cell-editor
+                                [item]="item"
+                                [column]="col"
+                                [rowIndex]="rowIndex"
+                                [globalColIndex]="descriptor.globalColIndex"
+                                [displayValue]="descriptor.displayValue"
+                                [editorProps]="editorProps"
+                                [onCancel]="cancelEditHandler"
+                              ></ogrid-primeng-popover-cell-editor>
+                            } @else {
+                              <div
+                                [attr.data-row-index]="rowIndex"
+                                [attr.data-col-index]="descriptor.globalColIndex"
+                                [attr.data-active-cell]="descriptor.isActive ? 'true' : null"
+                                [attr.data-in-range]="descriptor.isInRange ? 'true' : null"
+                                [attr.tabindex]="descriptor.isActive ? 0 : -1"
+                                (pointerdown)="onCellMouseDown($event, rowIndex, descriptor.globalColIndex)"
+                                (click)="onCellClick(rowIndex, descriptor.globalColIndex)"
+                                (dblclick)="descriptor.canEditAny ? onCellDblClick(descriptor.rowId, col.columnId) : null"
+                                (contextmenu)="onCellContextMenu($event)"
+                                class="ogrid-cell-content"
+                                [style.cursor]="descriptor.canEditAny ? 'cell' : 'default'"
+                                [style.background]="descriptor.isInRange && !descriptor.isActive ? 'var(--ogrid-range-bg, rgba(33, 115, 70, 0.08))' : (descriptor.isActive && descriptor.isInRange ? 'var(--ogrid-bg, #fff)' : null)"
+                                [style.outline]="descriptor.isActive && !descriptor.isInRange ? '2px solid var(--ogrid-selection, #217346)' : null"
+                                [style.outline-offset]="descriptor.isActive && !descriptor.isInRange ? '-2px' : null"
+                              >
+                                @if (col.type === 'boolean') {
+                                  <input type="checkbox" [checked]="!!descriptor.displayValue" [disabled]="!descriptor.canEditAny" (change)="descriptor.canEditAny ? commitBooleanEdit(item, col.columnId, !!descriptor.displayValue, rowIndex, descriptor.globalColIndex) : null" (pointerdown)="onBooleanCheckboxPointerDown($event, rowIndex, descriptor.globalColIndex)" (click)="$event.stopPropagation()" style="margin:0;outline:none" [style.cursor]="descriptor.canEditAny ? 'pointer' : 'default'" [attr.aria-label]="descriptor.displayValue ? 'Checked' : 'Unchecked'" />
+                                } @else {
+                                  <span [style]="resolveCellStyleFn(col, item, descriptor.displayValue)">{{ resolveCellContent(col, item, descriptor.displayValue) }}</span>
+                                }
+                                @if (descriptor.canEditAny && descriptor.isSelectionEndCell) {
+                                  <div
+                                    (pointerdown)="onFillHandleMouseDown($event)"
+                                    class="ogrid-fill-handle"
+                                    aria-label="Fill handle"
+                                  ></div>
+                                }
+                              </div>
+                            }
+                          </td>
+                        }
+                        @if (vsColumnsEnabled() && vsRightSpacerWidth() > 0) {
+                          <td [style.width.px]="vsRightSpacerWidth()" [style.minWidth.px]="vsRightSpacerWidth()" [style.maxWidth.px]="vsRightSpacerWidth()" [style.padding]="'0'"></td>
+                        }
+                      </tr>
+                    }
+                    @if (vsEnabled() && vsBottomSpacerHeight() > 0) {
+                      <tr [style.height.px]="vsBottomSpacerHeight()"></tr>
+                    }
+                  </tbody>
+                }
+              </table>
+
+              <ogrid-marching-ants-overlay
+                [containerEl]="tableContainerEl()"
+                [selectionRange]="state().interaction.selectionRange"
+                [copyRange]="state().interaction.copyRange"
+                [cutRange]="state().interaction.cutRange"
+                [colOffset]="state().layout.colOffset"
+                [columnSizingVersion]="columnSizingVersion()"
+                [items]="items()"
+                [visibleColumns]="propsVisibleColumns()"
+                [columnOrder]="propsColumnOrder()"
+              ></ogrid-marching-ants-overlay>
+
+              @if (formulaReferences() && formulaReferences()!.length > 0) {
+                <ogrid-formula-ref-overlay
+                  [containerEl]="tableContainerEl()"
+                  [references]="formulaReferences()!"
+                  [colOffset]="colOffset()"
+                />
+              }
+
+              @if (showEmptyInGrid() && emptyState()) {
+                <div class="ogrid-empty-container">
+                  <div>
+                    <div class="ogrid-empty-title">No results found</div>
+                    <ogrid-empty-state
+                      [message]="emptyState()?.message"
+                      [hasActiveFilters]="emptyState()?.hasActiveFilters ?? false"
+                      [render]="emptyState()?.render"
+                      (clearAll)="emptyState()?.onClearAll()"
+                    ></ogrid-empty-state>
+                  </div>
+                </div>
+              }
+            </div>
+          </div>
+        </div>
+      </div>
+
+      @if (columnReorderService.isDragging() && columnReorderService.dropIndicatorX() !== null) {
+        <div class="ogrid-drop-indicator" [style.left.px]="columnReorderService.dropIndicatorX()"></div>
+      }
+
+      @if (menuPosition()) {
+        <ogrid-context-menu
+          [x]="menuPosition()!.x"
+          [y]="menuPosition()!.y"
+          [hasSelection]="hasCellSelection()"
+          [canUndoProp]="canUndo()"
+          [canRedoProp]="canRedo()"
+          [classNames]="contextMenuClasses"
+          (copyAction)="handleCopy()"
+          (cutAction)="handleCut()"
+          (pasteAction)="handlePaste()"
+          (selectAllAction)="handleSelectAllCells()"
+          (undoAction)="onUndo()"
+          (redoAction)="onRedo()"
+          (closeAction)="closeContextMenu()"
+        ></ogrid-context-menu>
+      }
+
+      @let sbConfig = statusBarConfig();
+      @if (sbConfig) {
+        <ogrid-status-bar
+          [totalCount]="sbConfig.totalCount"
+          [filteredCount]="sbConfig.filteredCount"
+          [selectedCount]="sbConfig.selectedCount ?? selectedRowIds().size"
+          [selectedCellCount]="selectionCellCount()"
+          [aggregation]="sbConfig.aggregation"
+          [suppressRowCount]="sbConfig.suppressRowCount"
+          [classNames]="statusBarClasses"
+        ></ogrid-status-bar>
+      }
+
+      @if (isLoading()) {
+        <div class="ogrid-loading-overlay" aria-live="polite">
+          <div class="ogrid-loading-content">
+            <span class="ogrid-loading-text">{{ loadingMessage() }}</span>
+          </div>
+        </div>
+      }
+    </div>
+  `, styles: ["\n    :host { display: block; }\n    .ogrid-root {\n      position: relative;\n      flex: 1;\n      min-height: 0;\n      display: flex;\n      flex-direction: column;\n      overflow: hidden;\n    }\n    .ogrid-scroll-wrapper {\n      overflow: auto;\n      position: relative;\n      background: var(--ogrid-bg, #ffffff);\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n      outline: none;\n    }\n    .ogrid-scroll-wrapper:focus-visible { outline: none; }\n    .ogrid-scroll-wrapper[data-virtual-scroll] { flex: 1; min-height: 0; }\n    .ogrid-scroll-wrapper--loading-empty { min-height: 200px; }\n    .ogrid-table-wrapper {\n      position: relative;\n      overflow-x: clip;\n    }\n    .ogrid-table {\n      width: var(--data-table-width, 100%);\n      min-width: var(--data-table-min-width, 100%);\n      border-collapse: collapse;\n      table-layout: fixed;\n    }\n    .ogrid-table tr th:first-child,\n    .ogrid-table tr td:first-child { border-left: none; }\n    .ogrid-table tbody tr { height: var(--ogrid-row-height, auto); }\n    .ogrid-thead {\n      z-index: 3;\n      background: var(--ogrid-header-bg, #f5f5f5);\n    }\n    .ogrid-sticky-header { position: sticky; top: 0; }\n    .ogrid-sticky-header .ogrid-checkbox-header,\n    .ogrid-sticky-header .ogrid-row-number-header { position: sticky; top: 0; }\n    .ogrid-checkbox-header {\n      width: 48px;\n      min-width: 48px;\n      max-width: 48px;\n      text-align: center;\n      background: var(--ogrid-header-bg, #f5f5f5);\n      border-bottom: 2px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      z-index: 3;\n    }\n    .ogrid-row-number-header {\n      text-align: center;\n      font-weight: 600;\n      background: var(--ogrid-header-bg, #f5f5f5);\n      border-bottom: 2px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      z-index: 3;\n      position: relative;\n    }\n    .ogrid-row-number-spacer {\n      background: var(--ogrid-header-bg, #f5f5f5);\n    }\n    .ogrid-column-group-header {\n      text-align: center;\n      font-weight: 600;\n      background: var(--ogrid-header-bg, #f5f5f5);\n      border-bottom: 2px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      padding: 6px 10px;\n    }\n    .ogrid-header-cell {\n      background: var(--ogrid-header-bg, #f5f5f5);\n      border-bottom: 2px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      padding: 0;\n      position: relative;\n      user-select: none;\n    }\n    .ogrid-header-content {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n      padding: 6px 10px;\n    }\n    .ogrid-resize-handle {\n      position: absolute;\n      top: 0;\n      right: 0;\n      bottom: 0;\n      width: 4px;\n      cursor: col-resize;\n      touch-action: none;\n    }\n    @media (pointer: coarse) {\n      .ogrid-resize-handle { width: 16px; right: -6px; }\n    }\n    .ogrid-checkbox-cell {\n      width: 48px;\n      min-width: 48px;\n      max-width: 48px;\n      padding: 6px 4px;\n      text-align: center;\n      border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n    }\n    .ogrid-row-number-cell {\n      padding: 6px;\n      text-align: center;\n      font-weight: 600;\n      font-variant-numeric: tabular-nums;\n      color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6));\n      background: var(--ogrid-header-bg, rgba(0, 0, 0, 0.04));\n      border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      position: sticky;\n      left: 0;\n      z-index: 3;\n    }\n    .ogrid-data-cell {\n      padding: 0;\n      border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      position: relative;\n    }\n    .ogrid-data-cell:has(> [data-active-cell]),\n    .ogrid-data-cell:has(> .ogrid-editing-cell) { z-index: 2; }\n    .ogrid-cell-content {\n      padding: var(--ogrid-cell-padding, 6px 10px);\n      min-height: 20px;\n      cursor: default;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n    .ogrid-editing-cell {\n      width: 100%; height: 100%; display: flex; align-items: center; box-sizing: border-box;\n      outline: 2px solid var(--ogrid-selection-color, #217346); outline-offset: -1px;\n      z-index: 2; position: relative; background: var(--ogrid-bg, #fff); overflow: hidden; padding: 0;\n    }\n    .ogrid-scroll-wrapper [data-drag-range] { background: var(--ogrid-range-bg, rgba(33, 115, 70, 0.12)); }\n    .ogrid-fill-handle {\n      position: absolute;\n      bottom: -3px;\n      right: -3px;\n      width: 7px;\n      height: 7px;\n      background: var(--ogrid-selection, #217346);\n      cursor: crosshair;\n      touch-action: none;\n      z-index: 2;\n    }\n    @media (pointer: coarse) {\n      .ogrid-fill-handle { width: 14px; height: 14px; right: -7px; bottom: -7px; border-radius: 2px; }\n    }\n    .ogrid-empty-container {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      padding: 48px 24px;\n      text-align: center;\n      color: var(--ogrid-fg-muted, rgba(0, 0, 0, 0.5));\n    }\n    .ogrid-empty-title {\n      font-weight: 600;\n      margin-bottom: 8px;\n    }\n    .ogrid-status-bar {\n      display: flex;\n      align-items: center;\n      gap: 16px;\n      width: 100%;\n      min-height: 33px;\n      padding: 6px 12px;\n      box-sizing: border-box;\n      font-size: 12px;\n      line-height: 20px;\n      color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6));\n      background: var(--ogrid-header-bg, #f5f5f5);\n      border-top: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n    }\n    .ogrid-status-bar-item {\n      display: inline-flex;\n      align-items: center;\n      gap: 4px;\n    }\n    .ogrid-status-bar-item:not(:last-child)::after {\n      content: '';\n      width: 1px;\n      height: 14px;\n      margin-left: 12px;\n      background: var(--ogrid-border, rgba(0, 0, 0, 0.12));\n    }\n    .ogrid-status-bar-label {\n      color: var(--ogrid-fg-secondary, rgba(0, 0, 0, 0.6));\n    }\n    .ogrid-status-bar-value {\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n      font-weight: 600;\n    }\n    .ogrid-loading-overlay {\n      position: absolute;\n      inset: 0;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: var(--ogrid-loading-overlay, rgba(255, 255, 255, 0.7));\n      z-index: 10;\n    }\n    .ogrid-loading-content {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      color: var(--ogrid-fg, #242424);\n    }\n    .ogrid-loading-text {\n      font-size: 14px;\n    }\n    .loading-dimmed {\n      opacity: 0.5;\n      pointer-events: none;\n    }\n    .ogrid-drop-indicator {\n      position: absolute;\n      top: 0;\n      bottom: 0;\n      width: 3px;\n      background: var(--ogrid-primary, #217346);\n      pointer-events: none;\n      z-index: 100;\n      transition: left 0.05s;\n    }\n    .ogrid-th-pinned-left {\n      position: sticky;\n      top: 0;\n      left: 0;\n      z-index: 10;\n      background: var(--ogrid-header-bg, #f5f5f5);\n      border-right: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      box-shadow: 2px 0 4px -1px rgba(0, 0, 0, 0.1);\n    }\n    .ogrid-th-pinned-right {\n      position: sticky;\n      top: 0;\n      right: 0;\n      z-index: 10;\n      background: var(--ogrid-header-bg, #f5f5f5);\n      border-left: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      box-shadow: -2px 0 4px -1px rgba(0, 0, 0, 0.1);\n    }\n    .ogrid-td-pinned-left {\n      position: sticky;\n      left: 0;\n      z-index: 5;\n      background: var(--ogrid-bg, #fff);\n      border-right: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      box-shadow: 2px 0 4px -1px rgba(0, 0, 0, 0.1);\n    }\n    .ogrid-td-pinned-right {\n      position: sticky;\n      right: 0;\n      z-index: 5;\n      background: var(--ogrid-bg, #fff);\n      border-left: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      box-shadow: -2px 0 4px -1px rgba(0, 0, 0, 0.1);\n    }\n    ::ng-deep th:focus-visible,\n    ::ng-deep td:focus-visible {\n      outline: 2px solid var(--primary-color, #6366f1);\n      outline-offset: -2px;\n      z-index: 11;\n    }\n    ::ng-deep .p-button:focus-visible,\n    ::ng-deep button:focus-visible {\n      outline: 2px solid var(--primary-color, #6366f1);\n      outline-offset: 2px;\n    }\n\n    /* Context menu */\n    .ogrid-context-menu {\n      position: fixed;\n      z-index: 1000;\n      min-width: 160px;\n      padding: 4px 0;\n      background: var(--ogrid-bg, #fff);\n      border: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      border-radius: 6px;\n      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n    }\n    .ogrid-context-menu-item {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      gap: 24px;\n      width: 100%;\n      padding: 6px 12px;\n      border: none;\n      background: none;\n      font-size: 13px;\n      text-align: left;\n      cursor: pointer;\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n    }\n    .ogrid-context-menu-item:hover:not(:disabled) {\n      background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04));\n    }\n    .ogrid-context-menu-item:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n    .ogrid-context-menu-item-label {\n      flex: 1;\n    }\n    .ogrid-context-menu-item-shortcut {\n      color: var(--ogrid-fg-muted, rgba(0, 0, 0, 0.5));\n      font-size: 0.85em;\n    }\n    .ogrid-context-menu-divider {\n      height: 1px;\n      margin: 4px 0;\n      background: var(--ogrid-border, rgba(0, 0, 0, 0.12));\n    }\n    ::ng-deep .p-checkbox:focus-visible {\n      outline: 2px solid var(--primary-color, #6366f1);\n      outline-offset: 2px;\n    }\n\n    /* PrimeNG Menu popup overrides.\n       Double-class selectors (0,2,0) beat PrimeNG's single-class (0,1,0) defaults. */\n    .p-menu.p-menu {\n      background: var(--ogrid-bg, #ffffff);\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n      border: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      border-radius: 4px;\n      padding: 4px 0;\n    }\n    .p-menu-overlay.p-menu-overlay {\n      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3), 0 0 0 1px var(--ogrid-border, rgba(0, 0, 0, 0.12));\n    }\n    .p-menu-item-content.p-menu-item-content {\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n    }\n    .p-menu-item-link.p-menu-item-link {\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n      padding: 6px 12px;\n    }\n    .p-menu-item-label.p-menu-item-label {\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n      font-size: 0.875rem;\n    }\n    .p-menu-item:not(.p-disabled) .p-menu-item-content.p-menu-item-content:hover {\n      background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04));\n      color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));\n    }\n    .p-menu-separator.p-menu-separator {\n      border-color: var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      margin: 4px 0;\n    }\n    .ogrid-column-letter-cell {\n      text-align: center;\n      font-size: 11px;\n      font-weight: 500;\n      color: var(--ogrid-fg-muted, rgba(0, 0, 0, 0.4));\n      padding: 2px 4px;\n      background: var(--ogrid-column-letter-bg, var(--ogrid-header-bg, #f5f5f5));\n      border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));\n      user-select: none;\n      font-variant-numeric: tabular-nums;\n    }\n    /* Reveal column menu trigger on header hover without layout shift.\n       The button always takes up space (visibility: hidden); shown when column is hovered. */\n    @media (hover: hover) {\n      th:hover .column-header-menu-trigger { visibility: visible; }\n    }\n  "] }]
+    }], () => [], { wrapperRef: [{
+            type: ViewChild,
+            args: ['wrapper']
+        }], tableContainerRefEl: [{
+            type: ViewChild,
+            args: ['tableContainer']
+        }], itemsInput: [{
+            type: Input,
+            args: [{ required: true, alias: 'items' }]
+        }], columns: [{
+            type: Input,
+            args: [{ required: true }]
+        }], getRowIdInput: [{
+            type: Input,
+            args: [{ required: true, alias: 'getRowId' }]
+        }], sortBy: [{
+            type: Input
+        }], sortDirection: [{
+            type: Input
+        }], onColumnSort: [{
+            type: Input,
+            args: [{ required: true }]
+        }], visibleColumns: [{
+            type: Input,
+            args: [{ required: true }]
+        }], columnOrder: [{
+            type: Input
+        }], onColumnOrderChange: [{
+            type: Input
+        }], onColumnResized: [{
+            type: Input
+        }], onColumnPinned: [{
+            type: Input
+        }], pinnedColumnsInput: [{
+            type: Input,
+            args: [{ alias: 'pinnedColumns' }]
+        }], initialColumnWidths: [{
+            type: Input
+        }], layoutMode: [{
+            type: Input
+        }], suppressHorizontalScroll: [{
+            type: Input
+        }], stickyHeaderInput: [{
+            type: Input
+        }], columnReorder: [{
+            type: Input
+        }], isLoadingInput: [{
+            type: Input,
+            args: [{ alias: 'isLoading' }]
+        }], loadingMessageInput: [{
+            type: Input,
+            args: [{ alias: 'loadingMessage' }]
+        }], editable: [{
+            type: Input
+        }], cellSelection: [{
+            type: Input
+        }], onCellValueChanged: [{
+            type: Input
+        }], onUndoInput: [{
+            type: Input,
+            args: [{ alias: 'onUndo' }]
+        }], onRedoInput: [{
+            type: Input,
+            args: [{ alias: 'onRedo' }]
+        }], canUndoInput: [{
+            type: Input,
+            args: [{ alias: 'canUndo' }]
+        }], canRedoInput: [{
+            type: Input,
+            args: [{ alias: 'canRedo' }]
+        }], rowSelectionMode: [{
+            type: Input,
+            args: [{ alias: 'rowSelection' }]
+        }], selectedRows: [{
+            type: Input
+        }], onSelectionChange: [{
+            type: Input
+        }], statusBar: [{
+            type: Input
+        }], filters: [{
+            type: Input,
+            args: [{ required: true }]
+        }], onFilterChange: [{
+            type: Input,
+            args: [{ required: true }]
+        }], filterOptions: [{
+            type: Input
+        }], loadingFilterOptions: [{
+            type: Input
+        }], peopleSearch: [{
+            type: Input
+        }], getUserByEmail: [{
+            type: Input
+        }], emptyStateInput: [{
+            type: Input,
+            args: [{ alias: 'emptyState' }]
+        }], onCellError: [{
+            type: Input
+        }], ariaLabelInput: [{
+            type: Input,
+            args: [{ alias: 'aria-label' }]
+        }], ariaLabelledByInput: [{
+            type: Input,
+            args: [{ alias: 'aria-labelledby' }]
+        }], showRowNumbers: [{
+            type: Input
+        }], showColumnLettersInput: [{
+            type: Input,
+            args: [{ alias: 'showColumnLetters' }]
+        }], showNameBoxInput: [{
+            type: Input,
+            args: [{ alias: 'showNameBox' }]
+        }], onActiveCellChange: [{
+            type: Input
+        }], formulaReferencesInput: [{
+            type: Input,
+            args: [{ alias: 'formulaReferences' }]
+        }], currentPageInput: [{
+            type: Input,
+            args: [{ alias: 'currentPage' }]
+        }], pageSizeInput: [{
+            type: Input,
+            args: [{ alias: 'pageSize' }]
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(DataGridTableComponent, { className: "DataGridTableComponent", filePath: "datagrid-table/datagrid-table.component.ts", lineNumber: 788 }); })();