@alaarab/ogrid-angular-primeng 2.6.1 → 2.7.0

package/dist/esm/column-header-filter/column-header-filter.component.js

@@ -222,16 +222,8 @@ export class ColumnHeaderFilterComponent extends BaseColumnHeaderFilterComponent
                 this.isFilterOpen.set(false);
             }
         };
-        // Sync temp values when filter opens
         effect(() => {
             if (this.isFilterOpen()) {
-                this.tempTextValue.set(this.textValue ?? '');
-                this.searchText.set('');
-                const sv = this.selectedValues;
-                this.tempSelected.set(new Set(sv ?? []));
-                const dv = this.dateValue;
-                this.tempDateFrom.set(dv?.from ?? '');
-                this.tempDateTo.set(dv?.to ?? '');
                 document.addEventListener('mousedown', this.clickOutsideHandler, true);
             }
             else {

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

@@ -60,6 +60,7 @@ function DataGridTableComponent_For_11_Conditional_2_Template(rf, ctx) { if (rf
 function DataGridTableComponent_For_11_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "th", 19);
+    i0.ɵɵlistener("pointerdown", function DataGridTableComponent_For_11_Conditional_3_Template_th_pointerdown_0_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onNonDataSurfacePointerDown($event)); })("mousedown", function DataGridTableComponent_For_11_Conditional_3_Template_th_mousedown_0_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onNonDataSurfacePointerDown($event)); })("selectstart", function DataGridTableComponent_For_11_Conditional_3_Template_th_selectstart_0_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onNonDataSurfaceSelectStart($event)); });
     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()); });
@@ -105,7 +106,7 @@ function DataGridTableComponent_For_11_For_6_Conditional_1_Template(rf, ctx) { i
     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.ɵɵstyleProp("min-width", ctx_r2.getEffectiveMinWidth(col_r10), "px")("width", col_r10.width ?? ctx_r2.getColumnWidth(col_r10) + "px")("max-width", col_r10.width ? null : 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);
@@ -168,7 +169,9 @@ function DataGridTableComponent_Conditional_12_For_3_Conditional_3_Template(rf,
     i0.ɵɵattribute("aria-label", "Select row " + (rowIndex_r20 + 1));
 } }
 function DataGridTableComponent_Conditional_12_For_3_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    const _r22 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "td", 37);
+    i0.ɵɵlistener("pointerdown", function DataGridTableComponent_Conditional_12_For_3_Conditional_4_Template_td_pointerdown_0_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onNonDataSurfacePointerDown($event)); })("mousedown", function DataGridTableComponent_Conditional_12_For_3_Conditional_4_Template_td_mousedown_0_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onNonDataSurfacePointerDown($event)); })("selectstart", function DataGridTableComponent_Conditional_12_For_3_Conditional_4_Template_td_selectstart_0_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onNonDataSurfaceSelectStart($event)); });
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -186,97 +189,99 @@ function DataGridTableComponent_Conditional_12_For_3_Conditional_5_Template(rf,
     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();
+    const _r24 = 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.ɵɵlistener("commit", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_2_Template_ogrid_primeng_inline_cell_editor_commit_1_listener($event) { i0.ɵɵrestoreView(_r24); const col_r25 = i0.ɵɵnextContext().$implicit; const descriptor_r26 = 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_r25.columnId, descriptor_r26.value, $event, rowIndex_r20, descriptor_r26.globalColIndex)); })("cancel", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_2_Template_ogrid_primeng_inline_cell_editor_cancel_1_listener() { i0.ɵɵrestoreView(_r24); 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 col_r25 = i0.ɵɵnextContext().$implicit;
+    const descriptor_r26 = 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");
+    i0.ɵɵproperty("value", descriptor_r26.value)("item", item_r18)("column", col_r25)("rowIndex", rowIndex_r20)("editorType", descriptor_r26.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 col_r25 = i0.ɵɵnextContext().$implicit;
+    const descriptor_r26 = 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);
+    const editorProps_r27 = ctx_r2.buildPopoverEditorProps(item_r18, col_r25, descriptor_r26);
+    i0.ɵɵproperty("item", item_r18)("column", col_r25)("rowIndex", rowIndex_r20)("globalColIndex", descriptor_r26.globalColIndex)("displayValue", descriptor_r26.displayValue)("editorProps", editorProps_r27)("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();
+    const _r29 = 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.ɵɵlistener("change", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_1_Template_input_change_0_listener() { i0.ɵɵrestoreView(_r29); const col_r25 = i0.ɵɵnextContext(2).$implicit; const descriptor_r26 = 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_r26.canEditAny ? ctx_r2.commitBooleanEdit(item_r18, col_r25.columnId, !!descriptor_r26.displayValue, rowIndex_r20, descriptor_r26.globalColIndex) : null); })("pointerdown", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_1_Template_input_pointerdown_0_listener($event) { i0.ɵɵrestoreView(_r29); i0.ɵɵnextContext(2); const descriptor_r26 = 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_r26.globalColIndex)); })("click", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_1_Template_input_click_0_listener($event) { i0.ɵɵrestoreView(_r29); 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");
+    const descriptor_r26 = i0.ɵɵreadContextLet(1);
+    i0.ɵɵstyleProp("cursor", descriptor_r26.canEditAny ? "pointer" : "default");
+    i0.ɵɵproperty("checked", !!descriptor_r26.displayValue)("disabled", !descriptor_r26.canEditAny);
+    i0.ɵɵattribute("aria-label", descriptor_r26.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 col_r25 = i0.ɵɵnextContext(2).$implicit;
+    const descriptor_r26 = 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.ɵɵstyleMap(ctx_r2.resolveCellStyleFn(col_r25, item_r18, descriptor_r26.displayValue));
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(ctx_r2.resolveCellContent(col_r23, item_r18, descriptor_r24.displayValue));
+    i0.ɵɵtextInterpolate(ctx_r2.resolveCellContent(col_r25, item_r18, descriptor_r26.displayValue));
 } }
 function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    const _r28 = i0.ɵɵgetCurrentView();
+    const _r30 = 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.ɵɵlistener("pointerdown", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Conditional_3_Template_div_pointerdown_0_listener($event) { i0.ɵɵrestoreView(_r30); 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();
+    const _r28 = 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.ɵɵlistener("pointerdown", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Template_div_pointerdown_0_listener($event) { i0.ɵɵrestoreView(_r28); i0.ɵɵnextContext(); const descriptor_r26 = 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_r26.globalColIndex)); })("click", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r28); i0.ɵɵnextContext(); const descriptor_r26 = 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_r26.globalColIndex)); })("dblclick", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Template_div_dblclick_0_listener() { i0.ɵɵrestoreView(_r28); const col_r25 = i0.ɵɵnextContext().$implicit; const descriptor_r26 = i0.ɵɵreadContextLet(1); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(descriptor_r26.canEditAny ? ctx_r2.onCellDblClick(descriptor_r26.rowId, col_r25.columnId) : null); })("contextmenu", function DataGridTableComponent_Conditional_12_For_3_For_7_Conditional_4_Template_div_contextmenu_0_listener($event) { i0.ɵɵrestoreView(_r28); 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);
+    const col_r25 = i0.ɵɵnextContext().$implicit;
+    const descriptor_r26 = 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.ɵɵstyleProp("cursor", descriptor_r26.canEditAny ? "cell" : "default")("background", descriptor_r26.isInRange && !descriptor_r26.isActive ? "var(--ogrid-range-bg, rgba(33, 115, 70, 0.08))" : descriptor_r26.isActive && descriptor_r26.isInRange ? "var(--ogrid-bg, #fff)" : null)("outline", descriptor_r26.isActive && !descriptor_r26.isInRange ? "2px solid var(--ogrid-selection, #217346)" : null)("outline-offset", descriptor_r26.isActive && !descriptor_r26.isInRange ? "-2px" : null);
+    i0.ɵɵattribute("data-row-index", rowIndex_r20)("data-col-index", descriptor_r26.globalColIndex)("data-active-cell", descriptor_r26.isActive ? "true" : null)("data-in-range", descriptor_r26.isInRange ? "true" : null)("tabindex", descriptor_r26.isActive ? 0 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(col_r23.type === "boolean" ? 1 : 2);
+    i0.ɵɵconditional(col_r25.type === "boolean" ? 1 : 2);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(descriptor_r24.canEditAny && descriptor_r24.isSelectionEndCell ? 3 : -1);
+    i0.ɵɵconditional(descriptor_r26.canEditAny && descriptor_r26.isSelectionEndCell ? 3 : -1);
 } }
 function DataGridTableComponent_Conditional_12_For_3_For_7_Template(rf, ctx) { if (rf & 1) {
+    const _r23 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "td", 38);
+    i0.ɵɵlistener("pointerdown", function DataGridTableComponent_Conditional_12_For_3_For_7_Template_td_pointerdown_0_listener($event) { i0.ɵɵrestoreView(_r23); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onNonDataSurfacePointerDown($event)); })("mousedown", function DataGridTableComponent_Conditional_12_For_3_For_7_Template_td_mousedown_0_listener($event) { i0.ɵɵrestoreView(_r23); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onNonDataSurfacePointerDown($event)); })("selectstart", function DataGridTableComponent_Conditional_12_For_3_For_7_Template_td_selectstart_0_listener($event) { i0.ɵɵrestoreView(_r23); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onNonDataSurfaceSelectStart($event)); });
     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 col_r25 = 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);
+    const pinned_r31 = ctx_r2.isPinned(col_r25.columnId);
+    i0.ɵɵstyleProp("min-width", ctx_r2.getEffectiveMinWidth(col_r25), "px")("width", col_r25.width ?? ctx_r2.getColumnWidth(col_r25) + "px")("max-width", col_r25.width ? null : ctx_r2.getColumnWidth(col_r25) + "px")("left", pinned_r31 === "left" ? ctx_r2.getPinnedLeftOffset(col_r25.columnId) : null, "px")("right", pinned_r31 === "right" ? ctx_r2.getPinnedRightOffset(col_r25.columnId) : null, "px")("text-align", col_r25.type === "numeric" ? "right" : null);
+    i0.ɵɵclassProp("ogrid-td-pinned-left", pinned_r31 === "left")("ogrid-td-pinned-right", pinned_r31 === "right");
+    i0.ɵɵattribute("data-column-id", col_r25.columnId);
     i0.ɵɵadvance();
-    const descriptor_r30 = i0.ɵɵstoreLet(ctx_r2.getCellDescriptor(item_r18, col_r23, rowIndex_r20, ctx_r2.getGlobalColIndex(col_r23)));
+    const descriptor_r32 = i0.ɵɵstoreLet(ctx_r2.getCellDescriptor(item_r18, col_r25, rowIndex_r20, ctx_r2.getGlobalColIndex(col_r25)));
     i0.ɵɵadvance();
-    i0.ɵɵconditional(descriptor_r30.mode === "editing-inline" ? 2 : descriptor_r30.mode === "editing-popover" ? 3 : 4);
+    i0.ɵɵconditional(descriptor_r32.mode === "editing-inline" ? 2 : descriptor_r32.mode === "editing-popover" ? 3 : 4);
 } }
 function DataGridTableComponent_Conditional_12_For_3_Conditional_8_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "td");
@@ -297,15 +302,15 @@ function DataGridTableComponent_Conditional_12_For_3_Template(rf, ctx) { if (rf
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const item_r18 = ctx.$implicit;
-    const ɵ$index_76_r31 = ctx.$index;
+    const ɵ$index_76_r33 = 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.ɵɵstoreLet(ctx_r2.vsStartIndex() + ɵ$index_76_r33);
+    const rowId_r34 = ctx_r2.getRowIdInput(item_r18);
     i0.ɵɵadvance();
-    const isSelected_r33 = i0.ɵɵstoreLet(ctx_r2.selectedRowIds().has(rowId_r32));
+    const isSelected_r35 = i0.ɵɵstoreLet(ctx_r2.selectedRowIds().has(rowId_r34));
     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.ɵɵstyleProp("background", isSelected_r35 ? "var(--ogrid-selected-bg, #e8f0fe)" : null);
+    i0.ɵɵattribute("data-row-id", rowId_r34)("aria-selected", isSelected_r35 || null);
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r2.hasCheckboxCol() ? 3 : -1);
     i0.ɵɵadvance();
@@ -345,12 +350,12 @@ function DataGridTableComponent_Conditional_14_Template(rf, ctx) { if (rf & 1) {
     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();
+    const _r36 = 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.ɵɵlistener("clearAll", function DataGridTableComponent_Conditional_15_Template_ogrid_empty_state_clearAll_4_listener() { let tmp_5_0; i0.ɵɵrestoreView(_r36); 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;
@@ -367,9 +372,9 @@ function DataGridTableComponent_Conditional_16_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵstyleProp("left", ctx_r2.columnReorderService.dropIndicatorX(), "px");
 } }
 function DataGridTableComponent_Conditional_17_Template(rf, ctx) { if (rf & 1) {
-    const _r35 = i0.ɵɵgetCurrentView();
+    const _r37 = 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.ɵɵlistener("copyAction", function DataGridTableComponent_Conditional_17_Template_ogrid_context_menu_copyAction_0_listener() { i0.ɵɵrestoreView(_r37); 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(_r37); 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(_r37); 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(_r37); 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(_r37); 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(_r37); 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(_r37); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.closeContextMenu()); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
@@ -379,8 +384,8 @@ 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);
+    const sbConfig_r38 = i0.ɵɵreadContextLet(18);
+    i0.ɵɵproperty("totalCount", sbConfig_r38.totalCount)("filteredCount", sbConfig_r38.filteredCount)("selectedCount", sbConfig_r38.selectedCount ?? ctx_r2.selectedRowIds().size)("selectedCellCount", ctx_r2.selectionCellCount())("aggregation", sbConfig_r38.aggregation)("suppressRowCount", sbConfig_r38.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);
@@ -431,6 +436,16 @@ export class DataGridTableComponent extends BaseDataGridTableComponent {
         this.showColumnLettersInput = false;
         this.showNameBoxInput = false;
         this.onActiveCellChange = undefined;
+        this.formulas = undefined;
+        this.getFormulaValue = undefined;
+        this.hasFormula = undefined;
+        this.getFormula = undefined;
+        this.setFormula = undefined;
+        this.onFormulaCellChanged = undefined;
+        this.getPrecedents = undefined;
+        this.getDependents = undefined;
+        this.getAuditTrail = undefined;
+        this.formulaVersion = undefined;
         this.formulaReferencesInput = undefined;
         this.currentPageInput = 1;
         this.pageSizeInput = 25;
@@ -638,6 +653,16 @@ export class DataGridTableComponent extends BaseDataGridTableComponent {
             showColumnLetters: this.showColumnLettersInput,
             showNameBox: this.showNameBoxInput,
             onActiveCellChange: this.onActiveCellChange,
+            formulas: this.formulas,
+            getFormulaValue: this.getFormulaValue,
+            hasFormula: this.hasFormula,
+            getFormula: this.getFormula,
+            setFormula: this.setFormula,
+            onFormulaCellChanged: this.onFormulaCellChanged,
+            getPrecedents: this.getPrecedents,
+            getDependents: this.getDependents,
+            getAuditTrail: this.getAuditTrail,
+            formulaVersion: this.formulaVersion,
             currentPage: this.currentPageInput,
             pageSize: this.pageSizeInput,
             statusBar: this.statusBar,
@@ -665,7 +690,7 @@ export class DataGridTableComponent extends BaseDataGridTableComponent {
             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) {
+        } }, 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", formulas: "formulas", getFormulaValue: "getFormulaValue", hasFormula: "hasFormula", getFormula: "getFormula", setFormula: "setFormula", onFormulaCellChanged: "onFormulaCellChanged", getPrecedents: "getPrecedents", getDependents: "getDependents", getAuditTrail: "getAuditTrail", formulaVersion: "formulaVersion", 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", 3, "pointerdown", "mousedown", "selectstart"], ["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", 2, "user-select", "none", "-webkit-user-select", "none", 3, "width", "min-width", "max-width"], [3, "width", "minWidth", "maxWidth", "padding"], [1, "ogrid-data-cell", 2, "user-select", "none", "-webkit-user-select", "none", 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", 2, "user-select", "none", "-webkit-user-select", "none", 3, "pointerdown", "mousedown", "selectstart"], [1, "ogrid-data-cell", 2, "user-select", "none", "-webkit-user-select", "none", 3, "pointerdown", "mousedown", "selectstart"], [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)); });
@@ -713,9 +738,9 @@ export class DataGridTableComponent extends BaseDataGridTableComponent {
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.menuPosition() ? 17 : -1);
             i0.ɵɵadvance();
-            const sbConfig_r37 = i0.ɵɵstoreLet(ctx.statusBarConfig());
+            const sbConfig_r39 = i0.ɵɵstoreLet(ctx.statusBarConfig());
             i0.ɵɵadvance();
-            i0.ɵɵconditional(sbConfig_r37 ? 19 : -1);
+            i0.ɵɵconditional(sbConfig_r39 ? 19 : -1);
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.isLoading() ? 20 : -1);
         } }, dependencies: [StatusBarComponent,
@@ -726,7 +751,7 @@ export class DataGridTableComponent extends BaseDataGridTableComponent {
             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 }); }
+            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      user-select: none;\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      user-select: none;\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      user-select: none;\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,
@@ -804,6 +829,9 @@ export class DataGridTableComponent extends BaseDataGridTableComponent {
                           [style.width.px]="getRowNumberWidth()"
                           [style.min-width.px]="getRowNumberWidth()"
                           [style.max-width.px]="getRowNumberWidth()"
+                          (pointerdown)="onNonDataSurfacePointerDown($event)"
+                          (mousedown)="onNonDataSurfacePointerDown($event)"
+                          (selectstart)="onNonDataSurfaceSelectStart($event)"
                         >
                           #
                           <div
@@ -842,8 +870,8 @@ export class DataGridTableComponent extends BaseDataGridTableComponent {
                             [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.width]="col.width ?? (getColumnWidth(col) + 'px')"
+                            [style.max-width]="col.width ? null : (getColumnWidth(col) + 'px')"
                             [style.left.px]="pinned === 'left' ? getPinnedLeftOffset(col.columnId) : null"
                             [style.right.px]="pinned === 'right' ? getPinnedRightOffset(col.columnId) : null"
                             [style.cursor]="columnReorderService.isDragging() ? 'grabbing' : 'grab'"
@@ -927,9 +955,13 @@ export class DataGridTableComponent extends BaseDataGridTableComponent {
                         }
                         @if (hasRowNumbersCol()) {
                           <td class="ogrid-row-number-cell"
+                            style="user-select: none; -webkit-user-select: none;"
                             [style.width.px]="getRowNumberWidth()"
                             [style.min-width.px]="getRowNumberWidth()"
                             [style.max-width.px]="getRowNumberWidth()"
+                            (pointerdown)="onNonDataSurfacePointerDown($event)"
+                            (mousedown)="onNonDataSurfacePointerDown($event)"
+                            (selectstart)="onNonDataSurfaceSelectStart($event)"
                           >
                             {{ rowNumberOffset() + rowIndex + 1 }}
                           </td>
@@ -944,12 +976,16 @@ export class DataGridTableComponent extends BaseDataGridTableComponent {
                             [class.ogrid-td-pinned-left]="pinned === 'left'"
                             [class.ogrid-td-pinned-right]="pinned === 'right'"
                             class="ogrid-data-cell"
+                            style="user-select: none; -webkit-user-select: none;"
                             [style.min-width.px]="getEffectiveMinWidth(col)"
-                            [style.width.px]="getColumnWidth(col)"
-                            [style.max-width.px]="getColumnWidth(col)"
+                            [style.width]="col.width ?? (getColumnWidth(col) + 'px')"
+                            [style.max-width]="col.width ? null : (getColumnWidth(col) + 'px')"
                             [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"
+                            (pointerdown)="onNonDataSurfacePointerDown($event)"
+                            (mousedown)="onNonDataSurfacePointerDown($event)"
+                            (selectstart)="onNonDataSurfaceSelectStart($event)"
                           >
                             @let descriptor = getCellDescriptor(item, col, rowIndex, getGlobalColIndex(col));
                             @if (descriptor.mode === 'editing-inline') {
@@ -1101,7 +1137,7 @@ export class DataGridTableComponent extends BaseDataGridTableComponent {
         </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  "] }]
+  `, 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      user-select: none;\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      user-select: none;\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      user-select: none;\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']
@@ -1216,6 +1252,26 @@ export class DataGridTableComponent extends BaseDataGridTableComponent {
             args: [{ alias: 'showNameBox' }]
         }], onActiveCellChange: [{
             type: Input
+        }], formulas: [{
+            type: Input
+        }], getFormulaValue: [{
+            type: Input
+        }], hasFormula: [{
+            type: Input
+        }], getFormula: [{
+            type: Input
+        }], setFormula: [{
+            type: Input
+        }], onFormulaCellChanged: [{
+            type: Input
+        }], getPrecedents: [{
+            type: Input
+        }], getDependents: [{
+            type: Input
+        }], getAuditTrail: [{
+            type: Input
+        }], formulaVersion: [{
+            type: Input
         }], formulaReferencesInput: [{
             type: Input,
             args: [{ alias: 'formulaReferences' }]
@@ -1226,4 +1282,4 @@ export class DataGridTableComponent extends BaseDataGridTableComponent {
             type: Input,
             args: [{ alias: 'pageSize' }]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(DataGridTableComponent, { className: "DataGridTableComponent", filePath: "datagrid-table/datagrid-table.component.ts", lineNumber: 788 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(DataGridTableComponent, { className: "DataGridTableComponent", filePath: "datagrid-table/datagrid-table.component.ts", lineNumber: 802 }); })();

package/dist/esm/ogrid/ogrid.component.js

@@ -51,7 +51,7 @@ export class OGridComponent {
         this.service.setPageSize(size);
     }
     static { this.ɵfac = function OGridComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || OGridComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: OGridComponent, selectors: [["ogrid-primeng"]], inputs: { props: "props" }, features: [i0.ɵɵProvidersFeature([OGridService])], ngContentSelectors: _c1, decls: 7, vars: 60, consts: [[3, "className", "hasToolbar", "hasToolbarBelow", "hasPagination", "sideBar", "fullScreen", "showNameBox", "activeCellRef", "formulaBar", "sheetDefs", "activeSheet", "onSheetChange", "onSheetAdd"], ["toolbarEnd", ""], [3, "columns", "visibleColumns"], [3, "items", "columns", "getRowId", "sortBy", "sortDirection", "onColumnSort", "visibleColumns", "columnOrder", "onColumnOrderChange", "onColumnResized", "onColumnPinned", "editable", "cellSelection", "onCellValueChanged", "onUndo", "onRedo", "canUndo", "canRedo", "rowSelection", "selectedRows", "onSelectionChange", "statusBar", "isLoading", "filters", "onFilterChange", "filterOptions", "loadingFilterOptions", "peopleSearch", "getUserByEmail", "layoutMode", "suppressHorizontalScroll", "stickyHeaderInput", "columnReorder", "aria-label", "aria-labelledby", "emptyState", "showRowNumbers", "showColumnLetters", "showNameBox", "onActiveCellChange", "formulaReferences"], ["pagination", ""], [3, "pageChange", "pageSizeChange", "currentPage", "pageSize", "totalCount", "pageSizeOptions", "entityLabelPlural"], [3, "visibilityChange", "columns", "visibleColumns"]], template: function OGridComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: OGridComponent, selectors: [["ogrid-primeng"]], inputs: { props: "props" }, features: [i0.ɵɵProvidersFeature([OGridService])], ngContentSelectors: _c1, decls: 7, vars: 71, consts: [[3, "className", "hasToolbar", "hasToolbarBelow", "hasPagination", "sideBar", "fullScreen", "showNameBox", "activeCellRef", "formulaBar", "sheetDefs", "activeSheet", "onSheetChange", "onSheetAdd"], ["toolbarEnd", ""], [3, "columns", "visibleColumns"], [3, "items", "columns", "getRowId", "sortBy", "sortDirection", "onColumnSort", "visibleColumns", "columnOrder", "onColumnOrderChange", "onColumnResized", "onColumnPinned", "pinnedColumns", "editable", "cellSelection", "onCellValueChanged", "onUndo", "onRedo", "canUndo", "canRedo", "rowSelection", "selectedRows", "onSelectionChange", "statusBar", "isLoading", "filters", "onFilterChange", "filterOptions", "loadingFilterOptions", "peopleSearch", "getUserByEmail", "layoutMode", "suppressHorizontalScroll", "stickyHeaderInput", "columnReorder", "aria-label", "aria-labelledby", "emptyState", "showRowNumbers", "showColumnLetters", "showNameBox", "onActiveCellChange", "formulas", "getFormulaValue", "hasFormula", "getFormula", "setFormula", "onFormulaCellChanged", "getPrecedents", "getDependents", "getAuditTrail", "formulaVersion", "formulaReferences"], ["pagination", ""], [3, "pageChange", "pageSizeChange", "currentPage", "pageSize", "totalCount", "pageSizeOptions", "entityLabelPlural"], [3, "visibilityChange", "columns", "visibleColumns"]], template: function OGridComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef(_c0);
             i0.ɵɵelementStart(0, "ogrid-layout", 0);
             i0.ɵɵprojection(1, 0, ["toolbar", ""]);
@@ -63,15 +63,15 @@ export class OGridComponent {
             i0.ɵɵlistener("pageChange", function OGridComponent_Template_ogrid_primeng_pagination_controls_pageChange_6_listener($event) { return ctx.service.setPage($event); })("pageSizeChange", function OGridComponent_Template_ogrid_primeng_pagination_controls_pageSizeChange_6_listener($event) { return ctx.onPageSizeChange($event); });
             i0.ɵɵelementEnd()()();
         } if (rf & 2) {
-            let tmp_41_0;
             let tmp_42_0;
+            let tmp_43_0;
             i0.ɵɵproperty("className", ctx.service.className())("hasToolbar", ctx.showToolbar)("hasToolbarBelow", false)("hasPagination", true)("sideBar", ctx.service.sideBarProps())("fullScreen", ctx.service.fullScreen())("showNameBox", !!(ctx.service.cellReferences() && !ctx.service.formulasEnabled()))("activeCellRef", ctx.service.activeCellRef())("formulaBar", ctx.service.formulasEnabled() ? ctx.service.formulaBarState() : null)("sheetDefs", ctx.service.sheetDefs())("activeSheet", ctx.service.activeSheet())("onSheetChange", ctx.service.onSheetChange())("onSheetAdd", ctx.service.onSheetAdd());
             i0.ɵɵadvance(3);
             i0.ɵɵconditional(ctx.service.columnChooserPlacement() === "toolbar" ? 3 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("items", ctx.service.displayItems())("columns", ctx.service.columnsProp())("getRowId", ctx.service.getRowId())("sortBy", ctx.service.sort().field)("sortDirection", ctx.service.sort().direction)("onColumnSort", ctx.onColumnSortFn)("visibleColumns", ctx.service.visibleColumns())("columnOrder", ctx.service.columnOrder())("onColumnOrderChange", ctx.service.onColumnOrderChange())("onColumnResized", ctx.onColumnResizedFn)("onColumnPinned", ctx.onColumnPinnedFn)("editable", ctx.service.editable())("cellSelection", ctx.service.cellSelection())("onCellValueChanged", ctx.service.onCellValueChanged())("onUndo", ctx.service.onUndo())("onRedo", ctx.service.onRedo())("canUndo", ctx.service.canUndo())("canRedo", ctx.service.canRedo())("rowSelection", ctx.service.rowSelection())("selectedRows", ctx.service.effectiveSelectedRows())("onSelectionChange", ctx.onSelectionChangeFn)("statusBar", ctx.service.statusBarConfig())("isLoading", ctx.service.isLoadingResolved())("filters", ctx.service.filters())("onFilterChange", ctx.onFilterChangeFn)("filterOptions", ctx.service.clientFilterOptions())("loadingFilterOptions", ctx.service.loadingFilterOptions())("peopleSearch", (tmp_41_0 = ctx.service.dataSource()) == null ? null : tmp_41_0.searchPeople == null ? null : tmp_41_0.searchPeople.bind(ctx.service.dataSource()))("getUserByEmail", (tmp_42_0 = ctx.service.dataSource()) == null ? null : tmp_42_0.getUserByEmail == null ? null : tmp_42_0.getUserByEmail.bind(ctx.service.dataSource()))("layoutMode", ctx.service.layoutMode())("suppressHorizontalScroll", ctx.service.suppressHorizontalScroll())("stickyHeaderInput", ctx.service.stickyHeader())("columnReorder", ctx.service.columnReorder());
+            i0.ɵɵproperty("items", ctx.service.displayItems())("columns", ctx.service.columnsProp())("getRowId", ctx.service.getRowId())("sortBy", ctx.service.sort().field)("sortDirection", ctx.service.sort().direction)("onColumnSort", ctx.onColumnSortFn)("visibleColumns", ctx.service.visibleColumns())("columnOrder", ctx.service.columnOrder())("onColumnOrderChange", ctx.service.onColumnOrderChange())("onColumnResized", ctx.onColumnResizedFn)("onColumnPinned", ctx.onColumnPinnedFn)("pinnedColumns", ctx.service.dataGridProps().pinnedColumns)("editable", ctx.service.editable())("cellSelection", ctx.service.cellSelection())("onCellValueChanged", ctx.service.onCellValueChanged())("onUndo", ctx.service.onUndo())("onRedo", ctx.service.onRedo())("canUndo", ctx.service.canUndo())("canRedo", ctx.service.canRedo())("rowSelection", ctx.service.rowSelection())("selectedRows", ctx.service.effectiveSelectedRows())("onSelectionChange", ctx.onSelectionChangeFn)("statusBar", ctx.service.statusBarConfig())("isLoading", ctx.service.isLoadingResolved())("filters", ctx.service.filters())("onFilterChange", ctx.onFilterChangeFn)("filterOptions", ctx.service.clientFilterOptions())("loadingFilterOptions", ctx.service.loadingFilterOptions())("peopleSearch", (tmp_42_0 = ctx.service.dataSource()) == null ? null : tmp_42_0.searchPeople == null ? null : tmp_42_0.searchPeople.bind(ctx.service.dataSource()))("getUserByEmail", (tmp_43_0 = ctx.service.dataSource()) == null ? null : tmp_43_0.getUserByEmail == null ? null : tmp_43_0.getUserByEmail.bind(ctx.service.dataSource()))("layoutMode", ctx.service.layoutMode())("suppressHorizontalScroll", ctx.service.suppressHorizontalScroll())("stickyHeaderInput", ctx.service.stickyHeader())("columnReorder", ctx.service.columnReorder());
             i0.ɵɵariaProperty("aria-label", ctx.service.ariaLabel())("aria-labelledby", ctx.service.ariaLabelledBy());
-            i0.ɵɵproperty("emptyState", ctx.emptyStateObj)("showRowNumbers", ctx.service.dataGridProps().showRowNumbers ?? false)("showColumnLetters", ctx.service.dataGridProps().showColumnLetters ?? false)("showNameBox", ctx.service.dataGridProps().showNameBox ?? false)("onActiveCellChange", ctx.service.dataGridProps().onActiveCellChange)("formulaReferences", ctx.service.dataGridProps().formulaReferences);
+            i0.ɵɵproperty("emptyState", ctx.emptyStateObj)("showRowNumbers", ctx.service.dataGridProps().showRowNumbers ?? false)("showColumnLetters", ctx.service.dataGridProps().showColumnLetters ?? false)("showNameBox", ctx.service.dataGridProps().showNameBox ?? false)("onActiveCellChange", ctx.service.dataGridProps().onActiveCellChange)("formulas", ctx.service.dataGridProps().formulas)("getFormulaValue", ctx.service.dataGridProps().getFormulaValue)("hasFormula", ctx.service.dataGridProps().hasFormula)("getFormula", ctx.service.dataGridProps().getFormula)("setFormula", ctx.service.dataGridProps().setFormula)("onFormulaCellChanged", ctx.service.dataGridProps().onFormulaCellChanged)("getPrecedents", ctx.service.dataGridProps().getPrecedents)("getDependents", ctx.service.dataGridProps().getDependents)("getAuditTrail", ctx.service.dataGridProps().getAuditTrail)("formulaVersion", ctx.service.dataGridProps().formulaVersion)("formulaReferences", ctx.service.dataGridProps().formulaReferences);
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("currentPage", ctx.service.pagination().page)("pageSize", ctx.service.pagination().pageSize)("totalCount", ctx.service.pagination().displayTotalCount)("pageSizeOptions", ctx.service.pageSizeOptions())("entityLabelPlural", ctx.service.entityLabelPlural());
         } }, dependencies: [OGridLayoutComponent,
@@ -126,6 +126,7 @@ export class OGridComponent {
         [onColumnOrderChange]="service.onColumnOrderChange()"
         [onColumnResized]="onColumnResizedFn"
         [onColumnPinned]="onColumnPinnedFn"
+        [pinnedColumns]="service.dataGridProps().pinnedColumns"
         [editable]="service.editable()"
         [cellSelection]="service.cellSelection()"
         [onCellValueChanged]="service.onCellValueChanged()"
@@ -155,6 +156,16 @@ export class OGridComponent {
         [showColumnLetters]="service.dataGridProps().showColumnLetters ?? false"
         [showNameBox]="service.dataGridProps().showNameBox ?? false"
         [onActiveCellChange]="service.dataGridProps().onActiveCellChange"
+        [formulas]="service.dataGridProps().formulas"
+        [getFormulaValue]="service.dataGridProps().getFormulaValue"
+        [hasFormula]="service.dataGridProps().hasFormula"
+        [getFormula]="service.dataGridProps().getFormula"
+        [setFormula]="service.dataGridProps().setFormula"
+        [onFormulaCellChanged]="service.dataGridProps().onFormulaCellChanged"
+        [getPrecedents]="service.dataGridProps().getPrecedents"
+        [getDependents]="service.dataGridProps().getDependents"
+        [getAuditTrail]="service.dataGridProps().getAuditTrail"
+        [formulaVersion]="service.dataGridProps().formulaVersion"
         [formulaReferences]="service.dataGridProps().formulaReferences"
       ></ogrid-primeng-datagrid-table>
 
@@ -175,4 +186,4 @@ export class OGridComponent {
             type: Input,
             args: [{ required: true }]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(OGridComponent, { className: "OGridComponent", filePath: "ogrid/ogrid.component.ts", lineNumber: 109 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(OGridComponent, { className: "OGridComponent", filePath: "ogrid/ogrid.component.ts", lineNumber: 120 }); })();

package/dist/types/datagrid-table/datagrid-table.component.d.ts

@@ -63,6 +63,16 @@ export declare class DataGridTableComponent<T = unknown> extends BaseDataGridTab
     showColumnLettersInput: boolean;
     showNameBoxInput: boolean;
     onActiveCellChange: ((ref: string | null) => void) | undefined;
+    formulas: boolean | undefined;
+    getFormulaValue: ((col: number, row: number) => unknown) | undefined;
+    hasFormula: ((col: number, row: number) => boolean) | undefined;
+    getFormula: ((col: number, row: number) => string | undefined) | undefined;
+    setFormula: ((col: number, row: number, formula: string | null) => void) | undefined;
+    onFormulaCellChanged: ((col: number, row: number) => void) | undefined;
+    getPrecedents: ((col: number, row: number) => import('@alaarab/ogrid-core').IAuditEntry[]) | undefined;
+    getDependents: ((col: number, row: number) => import('@alaarab/ogrid-core').IAuditEntry[]) | undefined;
+    getAuditTrail: ((col: number, row: number) => import('@alaarab/ogrid-core').IAuditTrail | null) | undefined;
+    formulaVersion: number | undefined;
     formulaReferencesInput: import('@alaarab/ogrid-core').FormulaReference[] | undefined;
     currentPageInput: number;
     pageSizeInput: number;
@@ -109,5 +119,5 @@ export declare class DataGridTableComponent<T = unknown> extends BaseDataGridTab
     private buildProps;
     getColumnLetter(colIdx: number): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<DataGridTableComponent<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DataGridTableComponent<any>, "ogrid-primeng-datagrid-table", never, { "itemsInput": { "alias": "items"; "required": true; }; "columns": { "alias": "columns"; "required": true; }; "getRowIdInput": { "alias": "getRowId"; "required": true; }; "sortBy": { "alias": "sortBy"; "required": false; }; "sortDirection": { "alias": "sortDirection"; "required": false; }; "onColumnSort": { "alias": "onColumnSort"; "required": true; }; "visibleColumns": { "alias": "visibleColumns"; "required": true; }; "columnOrder": { "alias": "columnOrder"; "required": false; }; "onColumnOrderChange": { "alias": "onColumnOrderChange"; "required": false; }; "onColumnResized": { "alias": "onColumnResized"; "required": false; }; "onColumnPinned": { "alias": "onColumnPinned"; "required": false; }; "pinnedColumnsInput": { "alias": "pinnedColumns"; "required": false; }; "initialColumnWidths": { "alias": "initialColumnWidths"; "required": false; }; "layoutMode": { "alias": "layoutMode"; "required": false; }; "suppressHorizontalScroll": { "alias": "suppressHorizontalScroll"; "required": false; }; "stickyHeaderInput": { "alias": "stickyHeaderInput"; "required": false; }; "columnReorder": { "alias": "columnReorder"; "required": false; }; "isLoadingInput": { "alias": "isLoading"; "required": false; }; "loadingMessageInput": { "alias": "loadingMessage"; "required": false; }; "editable": { "alias": "editable"; "required": false; }; "cellSelection": { "alias": "cellSelection"; "required": false; }; "onCellValueChanged": { "alias": "onCellValueChanged"; "required": false; }; "onUndoInput": { "alias": "onUndo"; "required": false; }; "onRedoInput": { "alias": "onRedo"; "required": false; }; "canUndoInput": { "alias": "canUndo"; "required": false; }; "canRedoInput": { "alias": "canRedo"; "required": false; }; "rowSelectionMode": { "alias": "rowSelection"; "required": false; }; "selectedRows": { "alias": "selectedRows"; "required": false; }; "onSelectionChange": { "alias": "onSelectionChange"; "required": false; }; "statusBar": { "alias": "statusBar"; "required": false; }; "filters": { "alias": "filters"; "required": true; }; "onFilterChange": { "alias": "onFilterChange"; "required": true; }; "filterOptions": { "alias": "filterOptions"; "required": false; }; "loadingFilterOptions": { "alias": "loadingFilterOptions"; "required": false; }; "peopleSearch": { "alias": "peopleSearch"; "required": false; }; "getUserByEmail": { "alias": "getUserByEmail"; "required": false; }; "emptyStateInput": { "alias": "emptyState"; "required": false; }; "onCellError": { "alias": "onCellError"; "required": false; }; "ariaLabelInput": { "alias": "aria-label"; "required": false; }; "ariaLabelledByInput": { "alias": "aria-labelledby"; "required": false; }; "showRowNumbers": { "alias": "showRowNumbers"; "required": false; }; "showColumnLettersInput": { "alias": "showColumnLetters"; "required": false; }; "showNameBoxInput": { "alias": "showNameBox"; "required": false; }; "onActiveCellChange": { "alias": "onActiveCellChange"; "required": false; }; "formulaReferencesInput": { "alias": "formulaReferences"; "required": false; }; "currentPageInput": { "alias": "currentPage"; "required": false; }; "pageSizeInput": { "alias": "pageSize"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DataGridTableComponent<any>, "ogrid-primeng-datagrid-table", never, { "itemsInput": { "alias": "items"; "required": true; }; "columns": { "alias": "columns"; "required": true; }; "getRowIdInput": { "alias": "getRowId"; "required": true; }; "sortBy": { "alias": "sortBy"; "required": false; }; "sortDirection": { "alias": "sortDirection"; "required": false; }; "onColumnSort": { "alias": "onColumnSort"; "required": true; }; "visibleColumns": { "alias": "visibleColumns"; "required": true; }; "columnOrder": { "alias": "columnOrder"; "required": false; }; "onColumnOrderChange": { "alias": "onColumnOrderChange"; "required": false; }; "onColumnResized": { "alias": "onColumnResized"; "required": false; }; "onColumnPinned": { "alias": "onColumnPinned"; "required": false; }; "pinnedColumnsInput": { "alias": "pinnedColumns"; "required": false; }; "initialColumnWidths": { "alias": "initialColumnWidths"; "required": false; }; "layoutMode": { "alias": "layoutMode"; "required": false; }; "suppressHorizontalScroll": { "alias": "suppressHorizontalScroll"; "required": false; }; "stickyHeaderInput": { "alias": "stickyHeaderInput"; "required": false; }; "columnReorder": { "alias": "columnReorder"; "required": false; }; "isLoadingInput": { "alias": "isLoading"; "required": false; }; "loadingMessageInput": { "alias": "loadingMessage"; "required": false; }; "editable": { "alias": "editable"; "required": false; }; "cellSelection": { "alias": "cellSelection"; "required": false; }; "onCellValueChanged": { "alias": "onCellValueChanged"; "required": false; }; "onUndoInput": { "alias": "onUndo"; "required": false; }; "onRedoInput": { "alias": "onRedo"; "required": false; }; "canUndoInput": { "alias": "canUndo"; "required": false; }; "canRedoInput": { "alias": "canRedo"; "required": false; }; "rowSelectionMode": { "alias": "rowSelection"; "required": false; }; "selectedRows": { "alias": "selectedRows"; "required": false; }; "onSelectionChange": { "alias": "onSelectionChange"; "required": false; }; "statusBar": { "alias": "statusBar"; "required": false; }; "filters": { "alias": "filters"; "required": true; }; "onFilterChange": { "alias": "onFilterChange"; "required": true; }; "filterOptions": { "alias": "filterOptions"; "required": false; }; "loadingFilterOptions": { "alias": "loadingFilterOptions"; "required": false; }; "peopleSearch": { "alias": "peopleSearch"; "required": false; }; "getUserByEmail": { "alias": "getUserByEmail"; "required": false; }; "emptyStateInput": { "alias": "emptyState"; "required": false; }; "onCellError": { "alias": "onCellError"; "required": false; }; "ariaLabelInput": { "alias": "aria-label"; "required": false; }; "ariaLabelledByInput": { "alias": "aria-labelledby"; "required": false; }; "showRowNumbers": { "alias": "showRowNumbers"; "required": false; }; "showColumnLettersInput": { "alias": "showColumnLetters"; "required": false; }; "showNameBoxInput": { "alias": "showNameBox"; "required": false; }; "onActiveCellChange": { "alias": "onActiveCellChange"; "required": false; }; "formulas": { "alias": "formulas"; "required": false; }; "getFormulaValue": { "alias": "getFormulaValue"; "required": false; }; "hasFormula": { "alias": "hasFormula"; "required": false; }; "getFormula": { "alias": "getFormula"; "required": false; }; "setFormula": { "alias": "setFormula"; "required": false; }; "onFormulaCellChanged": { "alias": "onFormulaCellChanged"; "required": false; }; "getPrecedents": { "alias": "getPrecedents"; "required": false; }; "getDependents": { "alias": "getDependents"; "required": false; }; "getAuditTrail": { "alias": "getAuditTrail"; "required": false; }; "formulaVersion": { "alias": "formulaVersion"; "required": false; }; "formulaReferencesInput": { "alias": "formulaReferences"; "required": false; }; "currentPageInput": { "alias": "currentPage"; "required": false; }; "pageSizeInput": { "alias": "pageSize"; "required": false; }; }, {}, never, never, true, never>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alaarab/ogrid-angular-primeng",
-  "version": "2.6.1",
+  "version": "2.7.0",
   "description": "OGrid PrimeNG – PrimeNG Table-based data grid with sorting, filtering, pagination, column chooser, and CSV export.",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",
@@ -37,7 +37,7 @@
     "node": ">=18"
   },
   "dependencies": {
-    "@alaarab/ogrid-angular": "2.6.1"
+    "@alaarab/ogrid-angular": "2.7.0"
   },
   "peerDependencies": {
     "@angular/core": "^21.0.0",