@alaarab/ogrid-angular-primeng 2.4.1 → 2.5.0

package/dist/esm/index.js

@@ -1,74 +1,4 @@
-import { INLINE_CELL_EDITOR_STYLES, INLINE_CELL_EDITOR_TEMPLATE, POPOVER_CELL_EDITOR_OVERLAY_STYLES, POPOVER_CELL_EDITOR_TEMPLATE, OGRID_THEME_VARS_CSS, DataGridStateService, ColumnReorderService, VirtualScrollService, StatusBarComponent, GridContextMenuComponent, MarchingAntsOverlayComponent, EmptyStateComponent, FormulaRefOverlayComponent, OGridService, OGridLayoutComponent, BaseColumnHeaderFilterComponent, BaseColumnHeaderMenuComponent, BaseInlineCellEditorComponent, BasePopoverCellEditorComponent, BaseDataGridTableComponent, DEFAULT_MIN_COLUMN_WIDTH, formatCellReference, ROW_NUMBER_COLUMN_ID, indexToColumnLetter, BaseColumnChooserComponent, BasePaginationControlsComponent, ROW_NUMBER_COLUMN_MIN_WIDTH } from '@alaarab/ogrid-angular';
-export { AUTOSIZE_EXTRA_PX, AUTOSIZE_MAX_PX, BaseColumnChooserComponent, BaseColumnHeaderFilterComponent, BaseDataGridTableComponent, BaseInlineCellEditorComponent, BaseOGridComponent, BasePaginationControlsComponent, BasePopoverCellEditorComponent, CELL_PADDING, CHECKBOX_COLUMN_WIDTH, COLUMN_HEADER_MENU_ITEMS, ColumnReorderService, DEFAULT_DEBOUNCE_MS, DEFAULT_MIN_COLUMN_WIDTH, DataGridEditingHelper, DataGridInteractionHelper, DataGridLayoutHelper, DataGridStateService, EmptyStateComponent, GRID_BORDER_RADIUS, GRID_CONTEXT_MENU_ITEMS, GridContextMenuComponent, INLINE_CELL_EDITOR_STYLES, INLINE_CELL_EDITOR_TEMPLATE, MAX_PAGE_BUTTONS, MarchingAntsOverlayComponent, OGRID_THEME_VARS_CSS, OGridLayoutComponent, OGridService, PAGE_SIZE_OPTIONS, PEOPLE_SEARCH_DEBOUNCE_MS, POPOVER_CELL_EDITOR_OVERLAY_STYLES, POPOVER_CELL_EDITOR_TEMPLATE, ROW_NUMBER_COLUMN_WIDTH, SIDEBAR_TRANSITION_MS, SideBarComponent, StatusBarComponent, UndoRedoStack, VirtualScrollService, Z_INDEX, applyCellDeletion, applyCutClear, applyFillValues, applyPastedValues, applyRangeRowSelection, areGridRowPropsEqual, booleanParser, buildCsvHeader, buildCsvRows, buildHeaderRows, buildInlineEditorProps, buildPopoverEditorProps, calculateDropTarget, clampSelectionToBounds, computeAggregations, computeArrowNavigation, computeAutoScrollSpeed, computeNextSortState, computeRowSelectionState, computeTabNavigation, computeTotalHeight, computeVisibleRange, createDebouncedCallback, createDebouncedSignal, createLatestCallback, currencyParser, dateParser, debounce, deriveFilterOptionsFromData, emailParser, escapeCsvValue, exportToCsv, findCtrlArrowTarget, flattenColumns, formatCellValueForTsv, formatSelectionAsTsv, formatShortcut, getCellRenderDescriptor, getCellValue, getColumnHeaderMenuItems, getContextMenuHandlers, getDataGridStatusBarConfig, getFilterField, getHeaderFilterConfig, getMultiSelectFilterFields, getPaginationViewModel, getPinStateForColumn, getScrollTopForRow, getStatusBarParts, injectGlobalStyles, isFilterConfig, isInSelectionRange, isRowInRange, measureColumnContentWidth, measureRange, mergeFilter, normalizeSelectionRange, numberParser, parseTsvClipboard, parseValue, processClientSideData, rangesEqual, reorderColumnArray, resolveCellDisplayContent, resolveCellStyle, toUserLike, triggerCsvDownload, validateColumns, validateRowIds } from '@alaarab/ogrid-angular';
-import { ViewChild, Component, ChangeDetectionStrategy, Input, ViewEncapsulation, inject, DestroyRef, effect, computed, signal } from '@angular/core';
-import { ButtonModule } from 'primeng/button';
-import { MenuModule } from 'primeng/menu';
-
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-var ColumnHeaderFilterComponent = class extends BaseColumnHeaderFilterComponent {
-  constructor() {
-    super();
-    this.destroyRef = inject(DestroyRef);
-    this.clickOutsideHandler = (e) => {
-      const trigger = this.filterTrigger?.nativeElement;
-      const panel = this.filterPanel?.nativeElement;
-      if (trigger && !trigger.contains(e.target) && (!panel || !panel.contains(e.target))) {
-        this.isFilterOpen.set(false);
-      }
-    };
-    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 {
-        document.removeEventListener("mousedown", this.clickOutsideHandler, true);
-      }
-    });
-    this.destroyRef.onDestroy(() => {
-      document.removeEventListener("mousedown", this.clickOutsideHandler, true);
-    });
-  }
-  getHeaderEl() {
-    return this.filterTrigger;
-  }
-  handleSortClick() {
-    this.onSort?.();
-  }
-  toggleFilter() {
-    this.isFilterOpen.update((v) => !v);
-  }
-  // Adapter methods for template compatibility
-  handleSelectAllOptions() {
-    this.handleSelectAllFiltered();
-  }
-};
-__decorateClass([
-  ViewChild("filterTrigger")
-], ColumnHeaderFilterComponent.prototype, "filterTrigger", 2);
-__decorateClass([
-  ViewChild("filterPanel")
-], ColumnHeaderFilterComponent.prototype, "filterPanel", 2);
-ColumnHeaderFilterComponent = __decorateClass([
-  Component({
-    selector: "ogrid-primeng-column-header-filter",
-    standalone: true,
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    template: `
+import {INLINE_CELL_EDITOR_STYLES,INLINE_CELL_EDITOR_TEMPLATE,POPOVER_CELL_EDITOR_OVERLAY_STYLES,POPOVER_CELL_EDITOR_TEMPLATE,OGRID_THEME_VARS_CSS,DataGridStateService,ColumnReorderService,VirtualScrollService,StatusBarComponent,GridContextMenuComponent,MarchingAntsOverlayComponent,EmptyStateComponent,FormulaRefOverlayComponent,OGridService,OGridLayoutComponent,BaseColumnHeaderFilterComponent,BaseColumnHeaderMenuComponent,BaseInlineCellEditorComponent,BasePopoverCellEditorComponent,BaseDataGridTableComponent,DEFAULT_MIN_COLUMN_WIDTH,formatCellReference,ROW_NUMBER_COLUMN_ID,indexToColumnLetter,BaseColumnChooserComponent,BasePaginationControlsComponent,ROW_NUMBER_COLUMN_MIN_WIDTH}from'@alaarab/ogrid-angular';export{AUTOSIZE_EXTRA_PX,AUTOSIZE_MAX_PX,BaseColumnChooserComponent,BaseColumnHeaderFilterComponent,BaseDataGridTableComponent,BaseInlineCellEditorComponent,BaseOGridComponent,BasePaginationControlsComponent,BasePopoverCellEditorComponent,CELL_PADDING,CHECKBOX_COLUMN_WIDTH,COLUMN_HEADER_MENU_ITEMS,ColumnReorderService,DEFAULT_DEBOUNCE_MS,DEFAULT_MIN_COLUMN_WIDTH,DataGridEditingHelper,DataGridInteractionHelper,DataGridLayoutHelper,DataGridStateService,EmptyStateComponent,GRID_BORDER_RADIUS,GRID_CONTEXT_MENU_ITEMS,GridContextMenuComponent,INLINE_CELL_EDITOR_STYLES,INLINE_CELL_EDITOR_TEMPLATE,MAX_PAGE_BUTTONS,MarchingAntsOverlayComponent,OGRID_THEME_VARS_CSS,OGridLayoutComponent,OGridService,PAGE_SIZE_OPTIONS,PEOPLE_SEARCH_DEBOUNCE_MS,POPOVER_CELL_EDITOR_OVERLAY_STYLES,POPOVER_CELL_EDITOR_TEMPLATE,ROW_NUMBER_COLUMN_WIDTH,SIDEBAR_TRANSITION_MS,SideBarComponent,StatusBarComponent,UndoRedoStack,VirtualScrollService,Z_INDEX,applyCellDeletion,applyCutClear,applyFillValues,applyPastedValues,applyRangeRowSelection,areGridRowPropsEqual,booleanParser,buildCsvHeader,buildCsvRows,buildHeaderRows,buildInlineEditorProps,buildPopoverEditorProps,calculateDropTarget,clampSelectionToBounds,computeAggregations,computeArrowNavigation,computeAutoScrollSpeed,computeNextSortState,computeRowSelectionState,computeTabNavigation,computeTotalHeight,computeVisibleRange,createDebouncedCallback,createDebouncedSignal,createLatestCallback,currencyParser,dateParser,debounce,deriveFilterOptionsFromData,emailParser,escapeCsvValue,exportToCsv,findCtrlArrowTarget,flattenColumns,formatCellValueForTsv,formatSelectionAsTsv,formatShortcut,getCellRenderDescriptor,getCellValue,getColumnHeaderMenuItems,getContextMenuHandlers,getDataGridStatusBarConfig,getFilterField,getHeaderFilterConfig,getMultiSelectFilterFields,getPaginationViewModel,getPinStateForColumn,getScrollTopForRow,getStatusBarParts,injectGlobalStyles,isFilterConfig,isInSelectionRange,isRowInRange,measureColumnContentWidth,measureRange,mergeFilter,normalizeSelectionRange,numberParser,parseTsvClipboard,parseValue,processClientSideData,rangesEqual,reorderColumnArray,resolveCellDisplayContent,resolveCellStyle,toUserLike,triggerCsvDownload,validateColumns,validateRowIds}from'@alaarab/ogrid-angular';import {ViewChild,Component,ChangeDetectionStrategy,Input,ViewEncapsulation,inject,DestroyRef,effect,computed,signal}from'@angular/core';import {ButtonModule}from'primeng/button';import {MenuModule}from'primeng/menu';var E=Object.defineProperty;var O=Object.getOwnPropertyDescriptor;var e=(d,l,o,r)=>{for(var n=r>1?void 0:r?O(l,o):l,a=d.length-1,s;a>=0;a--)(s=d[a])&&(n=(r?s(l,o,n):s(n))||n);return r&&n&&E(l,o,n),n};var p=class extends BaseColumnHeaderFilterComponent{constructor(){super();this.destroyRef=inject(DestroyRef);this.clickOutsideHandler=o=>{let r=this.filterTrigger?.nativeElement,n=this.filterPanel?.nativeElement;r&&!r.contains(o.target)&&(!n||!n.contains(o.target))&&this.isFilterOpen.set(false);};effect(()=>{if(this.isFilterOpen()){this.tempTextValue.set(this.textValue??""),this.searchText.set("");let o=this.selectedValues;this.tempSelected.set(new Set(o??[]));let r=this.dateValue;this.tempDateFrom.set(r?.from??""),this.tempDateTo.set(r?.to??""),document.addEventListener("mousedown",this.clickOutsideHandler,true);}else document.removeEventListener("mousedown",this.clickOutsideHandler,true);}),this.destroyRef.onDestroy(()=>{document.removeEventListener("mousedown",this.clickOutsideHandler,true);});}getHeaderEl(){return this.filterTrigger}handleSortClick(){this.onSort?.();}toggleFilter(){this.isFilterOpen.update(o=>!o);}handleSelectAllOptions(){this.handleSelectAllFiltered();}};e([ViewChild("filterTrigger")],p.prototype,"filterTrigger",2),e([ViewChild("filterPanel")],p.prototype,"filterPanel",2),p=e([Component({selector:"ogrid-primeng-column-header-filter",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,template:`
     <div style="display:flex;align-items:center;flex:1;min-width:0;gap:4px">
       <div style="flex:1;min-width:0;overflow:hidden">
         <span style="overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block" [title]="columnName" data-header-label>
@@ -245,46 +175,14 @@ ColumnHeaderFilterComponent = __decorateClass([
         }
       </div>
     </div>
-  `,
-    styles: [`
+  `,styles:[`
     :host {
       display: flex;
       position: relative;
       flex: 1;
       min-width: 0;
     }
-  `]
-  })
-], ColumnHeaderFilterComponent);
-var ColumnHeaderMenuComponent = class extends BaseColumnHeaderMenuComponent {
-  constructor() {
-    super(...arguments);
-    this.menuModel = computed(() => {
-      const result = [];
-      for (const item of this.menuItems()) {
-        result.push({
-          label: item.label,
-          disabled: item.disabled,
-          command: () => this.handleMenuItemClick(item.id)
-        });
-        if (item.divider) {
-          result.push({ separator: true });
-        }
-      }
-      return result;
-    });
-  }
-};
-__decorateClass([
-  ViewChild("menu")
-], ColumnHeaderMenuComponent.prototype, "menuRef", 2);
-ColumnHeaderMenuComponent = __decorateClass([
-  Component({
-    selector: "column-header-menu",
-    standalone: true,
-    imports: [ButtonModule, MenuModule],
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    template: `
+  `]})],p);var c=class extends BaseColumnHeaderMenuComponent{constructor(){super(...arguments);this.menuModel=computed(()=>{let o=[];for(let r of this.menuItems())o.push({label:r.label,disabled:r.disabled,command:()=>this.handleMenuItemClick(r.id)}),r.divider&&o.push({separator:true});return o});}};e([ViewChild("menu")],c.prototype,"menuRef",2),c=e([Component({selector:"column-header-menu",standalone:true,imports:[ButtonModule,MenuModule],changeDetection:ChangeDetectionStrategy.OnPush,template:`
     <button
       pButton
       type="button"
@@ -300,8 +198,7 @@ ColumnHeaderMenuComponent = __decorateClass([
       [popup]="true"
       appendTo="body"
     ></p-menu>
-  `,
-    styles: [`
+  `,styles:[`
     .column-header-menu-trigger {
       padding: 0.25rem;
       min-width: 24px;
@@ -317,459 +214,14 @@ ColumnHeaderMenuComponent = __decorateClass([
       background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04));
       color: var(--ogrid-fg, rgba(0, 0, 0, 0.87));
     }
-  `]
-  })
-], ColumnHeaderMenuComponent);
-var InlineCellEditorComponent = class extends BaseInlineCellEditorComponent {
-};
-InlineCellEditorComponent = __decorateClass([
-  Component({
-    selector: "ogrid-primeng-inline-cell-editor",
-    standalone: true,
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    template: INLINE_CELL_EDITOR_TEMPLATE,
-    styles: [INLINE_CELL_EDITOR_STYLES]
-  })
-], InlineCellEditorComponent);
-var PopoverCellEditorComponent = class extends BasePopoverCellEditorComponent {
-};
-PopoverCellEditorComponent = __decorateClass([
-  Component({
-    selector: "ogrid-primeng-popover-cell-editor",
-    standalone: true,
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    template: POPOVER_CELL_EDITOR_TEMPLATE,
-    styles: [`
+  `]})],c);var g=class extends BaseInlineCellEditorComponent{};g=e([Component({selector:"ogrid-primeng-inline-cell-editor",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,template:INLINE_CELL_EDITOR_TEMPLATE,styles:[INLINE_CELL_EDITOR_STYLES]})],g);var u=class extends BasePopoverCellEditorComponent{};u=e([Component({selector:"ogrid-primeng-popover-cell-editor",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,template:POPOVER_CELL_EDITOR_TEMPLATE,styles:[`
     ${POPOVER_CELL_EDITOR_OVERLAY_STYLES}
     .ogrid-popover-anchor {
       padding: 6px 10px; min-height: 20px; cursor: default; overflow: hidden;
       text-overflow: ellipsis; white-space: nowrap;
       outline: 2px solid var(--ogrid-selection, #217346); outline-offset: -2px;
     }
-  `]
-  })
-], PopoverCellEditorComponent);
-
-// src/datagrid-table/datagrid-table.component.ts
-var DataGridTableComponent = class extends BaseDataGridTableComponent {
-  constructor() {
-    super();
-    this.sortBy = void 0;
-    this.sortDirection = "asc";
-    this.columnOrder = void 0;
-    this.onColumnOrderChange = void 0;
-    this.onColumnResized = void 0;
-    this.onColumnPinned = void 0;
-    this.pinnedColumnsInput = void 0;
-    this.initialColumnWidths = void 0;
-    this.layoutMode = "fill";
-    this.suppressHorizontalScroll = void 0;
-    this.stickyHeaderInput = void 0;
-    this.columnReorder = void 0;
-    this.isLoadingInput = false;
-    this.loadingMessageInput = "Loading\u2026";
-    this.editable = void 0;
-    this.cellSelection = void 0;
-    this.onCellValueChanged = void 0;
-    this.onUndoInput = void 0;
-    this.onRedoInput = void 0;
-    this.canUndoInput = void 0;
-    this.canRedoInput = void 0;
-    this.rowSelectionMode = "none";
-    this.selectedRows = void 0;
-    this.onSelectionChange = void 0;
-    this.statusBar = void 0;
-    this.filterOptions = {};
-    this.loadingFilterOptions = {};
-    this.peopleSearch = void 0;
-    this.getUserByEmail = void 0;
-    this.emptyStateInput = void 0;
-    this.onCellError = void 0;
-    this.ariaLabelInput = void 0;
-    this.ariaLabelledByInput = void 0;
-    this.showRowNumbers = false;
-    this.showColumnLettersInput = false;
-    this.showNameBoxInput = false;
-    this.onActiveCellChange = void 0;
-    this.formulaReferencesInput = void 0;
-    this.currentPageInput = 1;
-    this.pageSizeInput = 25;
-    this.defaultMinWidth = DEFAULT_MIN_COLUMN_WIDTH;
-    this.statusBarClasses = {
-      statusBar: "ogrid-status-bar",
-      statusBarItem: "ogrid-status-bar-item",
-      statusBarLabel: "ogrid-status-bar-label",
-      statusBarValue: "ogrid-status-bar-value"
-    };
-    this.contextMenuClasses = {
-      contextMenu: "ogrid-context-menu",
-      contextMenuItem: "ogrid-context-menu-item",
-      contextMenuItemLabel: "ogrid-context-menu-item-label",
-      contextMenuItemShortcut: "ogrid-context-menu-item-shortcut",
-      contextMenuDivider: "ogrid-context-menu-divider"
-    };
-    // PrimeNG uses flat number overrides for column sizing
-    this.primengColumnSizingOverrides = signal({});
-    this.propsSignal = signal(void 0);
-    this.resizeStartX = 0;
-    this.resizeColumnId = "";
-    this.resizeStartWidth = 0;
-    // Bound method reference for template
-    this.cancelEditHandler = () => this.cancelEdit();
-    this.showColumnLetters = computed(() => !!this.getProps()?.showColumnLetters);
-    this.formulaReferences = computed(() => this.getProps()?.formulaReferences);
-    // --- PrimeNG-specific computed signals ---
-    this.resolvedAriaLabel = computed(
-      () => this.ariaLabelInput ?? (this.ariaLabelledByInput ? void 0 : "Data grid")
-    );
-    this.tableWidthStyle = computed(() => {
-      if (this.showEmptyInGrid()) return "100%";
-      if (this.allowOverflowX()) return "fit-content";
-      if (this.layoutMode === "content") return "fit-content";
-      return "100%";
-    });
-    this.tableMinWidthStyle = computed(() => {
-      if (this.showEmptyInGrid()) return "100%";
-      if (this.allowOverflowX()) return "max-content";
-      if (this.layoutMode === "content") return "max-content";
-      return "100%";
-    });
-    this.initBase();
-    effect(() => {
-      const props = this.getProps();
-      const onActiveCellChange = props?.onActiveCellChange;
-      if (!onActiveCellChange) return;
-      const ac = this.activeCell();
-      if (ac) {
-        const colIndex = ac.columnIndex - this.colOffset();
-        const rowNumber = ac.rowIndex + 1;
-        onActiveCellChange(formatCellReference(colIndex, rowNumber));
-      } else {
-        onActiveCellChange(null);
-      }
-    });
-  }
-  ngOnChanges(changes) {
-    if (changes["initialColumnWidths"]) {
-      const iw = this.initialColumnWidths;
-      if (iw) {
-        this.primengColumnSizingOverrides.set({ ...iw });
-      }
-    }
-    const next = this.buildProps();
-    const prev = this.propsSignal();
-    if (!prev || !this.shallowEqual(prev, next)) {
-      this.propsSignal.set(next);
-    }
-  }
-  /** Shallow-compare two props objects by their top-level keys. */
-  shallowEqual(a, b) {
-    const aObj = a;
-    const bObj = b;
-    const keysA = Object.keys(aObj);
-    const keysB = Object.keys(bObj);
-    if (keysA.length !== keysB.length) return false;
-    for (const key of keysA) {
-      if (aObj[key] !== bObj[key]) return false;
-    }
-    return true;
-  }
-  // --- Abstract method implementations ---
-  getProps() {
-    return this.propsSignal();
-  }
-  getWrapperRef() {
-    return this.wrapperRef;
-  }
-  getTableContainerRef() {
-    return this.tableContainerRefEl;
-  }
-  // --- Column width override (PrimeNG uses flat number instead of { widthPx }) ---
-  getColumnWidth(col) {
-    const override = this.primengColumnSizingOverrides()[col.columnId];
-    if (override) return override;
-    return col.idealWidth ?? col.defaultWidth ?? col.minWidth ?? DEFAULT_MIN_COLUMN_WIDTH;
-  }
-  // --- PrimeNG-specific helpers ---
-  trackByRowId(_index, item) {
-    return this.getRowIdInput(item);
-  }
-  // --- PrimeNG-specific event handlers ---
-  onSelectAllChangePrimeng(checked) {
-    this.state().rowSelection.handleSelectAll(checked);
-  }
-  onRowClickPrimeng(e, item) {
-    if (this.rowSelectionMode !== "single") return;
-    const rowId = this.getRowIdInput(item);
-    const ids = this.selectedRowIds();
-    this.state().rowSelection.updateSelection(ids.has(rowId) ? /* @__PURE__ */ new Set() : /* @__PURE__ */ new Set([rowId]));
-  }
-  onRowCheckboxChangePrimeng(item, checked, rowIndex, _e) {
-    const rowId = this.getRowIdInput(item);
-    this.state().rowSelection.handleRowCheckboxChange(rowId, checked, rowIndex, this.lastMouseShift);
-  }
-  onResizeStartPrimeng(e, col) {
-    e.preventDefault();
-    this.state().interaction.setActiveCell?.(null);
-    this.state().interaction.setSelectionRange?.(null);
-    this.getWrapperRef()?.nativeElement.focus({ preventScroll: true });
-    this.resizeStartX = e.clientX;
-    this.resizeColumnId = col.columnId;
-    this.resizeStartWidth = col.columnId === ROW_NUMBER_COLUMN_ID ? this.getRowNumberWidth() : this.getColumnWidth(col);
-    const onMove = (me) => {
-      const delta = me.clientX - this.resizeStartX;
-      const minW = col.columnId === ROW_NUMBER_COLUMN_ID ? ROW_NUMBER_COLUMN_MIN_WIDTH : col.minWidth ?? DEFAULT_MIN_COLUMN_WIDTH;
-      const newWidth = Math.max(minW, this.resizeStartWidth + delta);
-      this.primengColumnSizingOverrides.update((prev) => ({ ...prev, [this.resizeColumnId]: newWidth }));
-      this.columnSizingVersion.update((v) => v + 1);
-    };
-    const onUp = () => {
-      window.removeEventListener("mousemove", onMove, true);
-      window.removeEventListener("mouseup", onUp, true);
-      const finalWidth = this.primengColumnSizingOverrides()[this.resizeColumnId];
-      if (finalWidth) {
-        this.onColumnResized?.(this.resizeColumnId, finalWidth);
-        const overrides = {};
-        for (const [id, w] of Object.entries(this.primengColumnSizingOverrides())) {
-          overrides[id] = { widthPx: w };
-        }
-        this.state().layout.setColumnSizingOverrides(overrides);
-      }
-    };
-    window.addEventListener("mousemove", onMove, true);
-    window.addEventListener("mouseup", onUp, true);
-  }
-  onResizeRowNumber(event) {
-    event.stopPropagation();
-    this.onResizeStartPrimeng(event, { columnId: ROW_NUMBER_COLUMN_ID, name: "#" });
-  }
-  getRowNumberWidth() {
-    const override = this.primengColumnSizingOverrides()[ROW_NUMBER_COLUMN_ID];
-    if (override) return override;
-    return super.getRowNumberWidth();
-  }
-  // --- Build props ---
-  buildProps() {
-    return {
-      items: this.itemsInput,
-      columns: this.columns,
-      getRowId: this.getRowIdInput,
-      sortBy: this.sortBy,
-      sortDirection: this.sortDirection,
-      onColumnSort: this.onColumnSort,
-      visibleColumns: this.visibleColumns,
-      columnOrder: this.columnOrder,
-      onColumnOrderChange: this.onColumnOrderChange,
-      onColumnResized: this.onColumnResized,
-      onColumnPinned: this.onColumnPinned,
-      pinnedColumns: this.pinnedColumnsInput,
-      initialColumnWidths: this.initialColumnWidths,
-      layoutMode: this.layoutMode,
-      suppressHorizontalScroll: this.suppressHorizontalScroll,
-      columnReorder: this.columnReorder,
-      isLoading: this.isLoadingInput,
-      loadingMessage: this.loadingMessageInput,
-      editable: this.editable,
-      cellSelection: this.cellSelection,
-      onCellValueChanged: this.onCellValueChanged,
-      onUndo: this.onUndoInput,
-      onRedo: this.onRedoInput,
-      canUndo: this.canUndoInput,
-      canRedo: this.canRedoInput,
-      rowSelection: this.rowSelectionMode,
-      selectedRows: this.selectedRows,
-      onSelectionChange: this.onSelectionChange,
-      showRowNumbers: this.showRowNumbers,
-      showColumnLetters: this.showColumnLettersInput,
-      showNameBox: this.showNameBoxInput,
-      onActiveCellChange: this.onActiveCellChange,
-      currentPage: this.currentPageInput,
-      pageSize: this.pageSizeInput,
-      statusBar: this.statusBar,
-      filters: this.filters,
-      onFilterChange: this.onFilterChange,
-      filterOptions: this.filterOptions,
-      loadingFilterOptions: this.loadingFilterOptions,
-      peopleSearch: this.peopleSearch,
-      getUserByEmail: this.getUserByEmail,
-      emptyState: this.emptyStateInput,
-      onCellError: this.onCellError,
-      stickyHeader: this.stickyHeaderInput,
-      "aria-label": this.ariaLabelInput,
-      "aria-labelledby": this.ariaLabelledByInput,
-      formulaReferences: this.formulaReferencesInput
-    };
-  }
-  getColumnLetter(colIdx) {
-    return indexToColumnLetter(colIdx);
-  }
-};
-__decorateClass([
-  ViewChild("wrapper")
-], DataGridTableComponent.prototype, "wrapperRef", 2);
-__decorateClass([
-  ViewChild("tableContainer")
-], DataGridTableComponent.prototype, "tableContainerRefEl", 2);
-__decorateClass([
-  Input({ required: true, alias: "items" })
-], DataGridTableComponent.prototype, "itemsInput", 2);
-__decorateClass([
-  Input({ required: true })
-], DataGridTableComponent.prototype, "columns", 2);
-__decorateClass([
-  Input({ required: true, alias: "getRowId" })
-], DataGridTableComponent.prototype, "getRowIdInput", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "sortBy", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "sortDirection", 2);
-__decorateClass([
-  Input({ required: true })
-], DataGridTableComponent.prototype, "onColumnSort", 2);
-__decorateClass([
-  Input({ required: true })
-], DataGridTableComponent.prototype, "visibleColumns", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "columnOrder", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "onColumnOrderChange", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "onColumnResized", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "onColumnPinned", 2);
-__decorateClass([
-  Input({ alias: "pinnedColumns" })
-], DataGridTableComponent.prototype, "pinnedColumnsInput", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "initialColumnWidths", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "layoutMode", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "suppressHorizontalScroll", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "stickyHeaderInput", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "columnReorder", 2);
-__decorateClass([
-  Input({ alias: "isLoading" })
-], DataGridTableComponent.prototype, "isLoadingInput", 2);
-__decorateClass([
-  Input({ alias: "loadingMessage" })
-], DataGridTableComponent.prototype, "loadingMessageInput", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "editable", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "cellSelection", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "onCellValueChanged", 2);
-__decorateClass([
-  Input({ alias: "onUndo" })
-], DataGridTableComponent.prototype, "onUndoInput", 2);
-__decorateClass([
-  Input({ alias: "onRedo" })
-], DataGridTableComponent.prototype, "onRedoInput", 2);
-__decorateClass([
-  Input({ alias: "canUndo" })
-], DataGridTableComponent.prototype, "canUndoInput", 2);
-__decorateClass([
-  Input({ alias: "canRedo" })
-], DataGridTableComponent.prototype, "canRedoInput", 2);
-__decorateClass([
-  Input({ alias: "rowSelection" })
-], DataGridTableComponent.prototype, "rowSelectionMode", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "selectedRows", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "onSelectionChange", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "statusBar", 2);
-__decorateClass([
-  Input({ required: true })
-], DataGridTableComponent.prototype, "filters", 2);
-__decorateClass([
-  Input({ required: true })
-], DataGridTableComponent.prototype, "onFilterChange", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "filterOptions", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "loadingFilterOptions", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "peopleSearch", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "getUserByEmail", 2);
-__decorateClass([
-  Input({ alias: "emptyState" })
-], DataGridTableComponent.prototype, "emptyStateInput", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "onCellError", 2);
-__decorateClass([
-  Input({ alias: "aria-label" })
-], DataGridTableComponent.prototype, "ariaLabelInput", 2);
-__decorateClass([
-  Input({ alias: "aria-labelledby" })
-], DataGridTableComponent.prototype, "ariaLabelledByInput", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "showRowNumbers", 2);
-__decorateClass([
-  Input({ alias: "showColumnLetters" })
-], DataGridTableComponent.prototype, "showColumnLettersInput", 2);
-__decorateClass([
-  Input({ alias: "showNameBox" })
-], DataGridTableComponent.prototype, "showNameBoxInput", 2);
-__decorateClass([
-  Input()
-], DataGridTableComponent.prototype, "onActiveCellChange", 2);
-__decorateClass([
-  Input({ alias: "formulaReferences" })
-], DataGridTableComponent.prototype, "formulaReferencesInput", 2);
-__decorateClass([
-  Input({ alias: "currentPage" })
-], DataGridTableComponent.prototype, "currentPageInput", 2);
-__decorateClass([
-  Input({ alias: "pageSize" })
-], DataGridTableComponent.prototype, "pageSizeInput", 2);
-DataGridTableComponent = __decorateClass([
-  Component({
-    selector: "ogrid-primeng-datagrid-table",
-    standalone: true,
-    imports: [
-      StatusBarComponent,
-      GridContextMenuComponent,
-      MarchingAntsOverlayComponent,
-      EmptyStateComponent,
-      FormulaRefOverlayComponent,
-      ColumnHeaderFilterComponent,
-      ColumnHeaderMenuComponent,
-      InlineCellEditorComponent,
-      PopoverCellEditorComponent
-    ],
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    encapsulation: ViewEncapsulation.None,
-    providers: [DataGridStateService, ColumnReorderService, VirtualScrollService],
-    template: `
+  `]})],u);var t=class extends BaseDataGridTableComponent{constructor(){super();this.sortBy=void 0;this.sortDirection="asc";this.columnOrder=void 0;this.onColumnOrderChange=void 0;this.onColumnResized=void 0;this.onColumnPinned=void 0;this.pinnedColumnsInput=void 0;this.initialColumnWidths=void 0;this.layoutMode="fill";this.suppressHorizontalScroll=void 0;this.stickyHeaderInput=void 0;this.columnReorder=void 0;this.isLoadingInput=false;this.loadingMessageInput="Loading\u2026";this.editable=void 0;this.cellSelection=void 0;this.onCellValueChanged=void 0;this.onUndoInput=void 0;this.onRedoInput=void 0;this.canUndoInput=void 0;this.canRedoInput=void 0;this.rowSelectionMode="none";this.selectedRows=void 0;this.onSelectionChange=void 0;this.statusBar=void 0;this.filterOptions={};this.loadingFilterOptions={};this.peopleSearch=void 0;this.getUserByEmail=void 0;this.emptyStateInput=void 0;this.onCellError=void 0;this.ariaLabelInput=void 0;this.ariaLabelledByInput=void 0;this.showRowNumbers=false;this.showColumnLettersInput=false;this.showNameBoxInput=false;this.onActiveCellChange=void 0;this.formulaReferencesInput=void 0;this.currentPageInput=1;this.pageSizeInput=25;this.defaultMinWidth=DEFAULT_MIN_COLUMN_WIDTH;this.statusBarClasses={statusBar:"ogrid-status-bar",statusBarItem:"ogrid-status-bar-item",statusBarLabel:"ogrid-status-bar-label",statusBarValue:"ogrid-status-bar-value"};this.contextMenuClasses={contextMenu:"ogrid-context-menu",contextMenuItem:"ogrid-context-menu-item",contextMenuItemLabel:"ogrid-context-menu-item-label",contextMenuItemShortcut:"ogrid-context-menu-item-shortcut",contextMenuDivider:"ogrid-context-menu-divider"};this.primengColumnSizingOverrides=signal({});this.propsSignal=signal(void 0);this.resizeStartX=0;this.resizeColumnId="";this.resizeStartWidth=0;this.cancelEditHandler=()=>this.cancelEdit();this.showColumnLetters=computed(()=>!!this.getProps()?.showColumnLetters);this.formulaReferences=computed(()=>this.getProps()?.formulaReferences);this.resolvedAriaLabel=computed(()=>this.ariaLabelInput??(this.ariaLabelledByInput?void 0:"Data grid"));this.tableWidthStyle=computed(()=>this.showEmptyInGrid()?"100%":this.allowOverflowX()||this.layoutMode==="content"?"fit-content":"100%");this.tableMinWidthStyle=computed(()=>this.showEmptyInGrid()?"100%":this.allowOverflowX()||this.layoutMode==="content"?"max-content":"100%");this.initBase(),effect(()=>{let r=this.getProps()?.onActiveCellChange;if(!r)return;let n=this.activeCell();if(n){let a=n.columnIndex-this.colOffset(),s=n.rowIndex+1;r(formatCellReference(a,s));}else r(null);});}ngOnChanges(o){if(o.initialColumnWidths){let a=this.initialColumnWidths;a&&this.primengColumnSizingOverrides.set({...a});}let r=this.buildProps(),n=this.propsSignal();(!n||!this.shallowEqual(n,r))&&this.propsSignal.set(r);}shallowEqual(o,r){let n=o,a=r,s=Object.keys(n),f=Object.keys(a);if(s.length!==f.length)return  false;for(let b of s)if(n[b]!==a[b])return  false;return  true}getProps(){return this.propsSignal()}getWrapperRef(){return this.wrapperRef}getTableContainerRef(){return this.tableContainerRefEl}getColumnWidth(o){let r=this.primengColumnSizingOverrides()[o.columnId];return r||(o.idealWidth??o.defaultWidth??o.minWidth??DEFAULT_MIN_COLUMN_WIDTH)}trackByRowId(o,r){return this.getRowIdInput(r)}onSelectAllChangePrimeng(o){this.state().rowSelection.handleSelectAll(o);}onRowClickPrimeng(o,r){if(this.rowSelectionMode!=="single")return;let n=this.getRowIdInput(r),a=this.selectedRowIds();this.state().rowSelection.updateSelection(a.has(n)?new Set:new Set([n]));}onRowCheckboxChangePrimeng(o,r,n,a){let s=this.getRowIdInput(o);this.state().rowSelection.handleRowCheckboxChange(s,r,n,this.lastMouseShift);}onResizeStartPrimeng(o,r){o.preventDefault(),this.state().interaction.setActiveCell?.(null),this.state().interaction.setSelectionRange?.(null),this.getWrapperRef()?.nativeElement.focus({preventScroll:true}),this.resizeStartX=o.clientX,this.resizeColumnId=r.columnId,this.resizeStartWidth=r.columnId===ROW_NUMBER_COLUMN_ID?this.getRowNumberWidth():this.getColumnWidth(r);let n=s=>{let f=s.clientX-this.resizeStartX,b=r.columnId===ROW_NUMBER_COLUMN_ID?ROW_NUMBER_COLUMN_MIN_WIDTH:r.minWidth??DEFAULT_MIN_COLUMN_WIDTH,C=Math.max(b,this.resizeStartWidth+f);this.primengColumnSizingOverrides.update(w=>({...w,[this.resizeColumnId]:C})),this.columnSizingVersion.update(w=>w+1);},a=()=>{window.removeEventListener("pointermove",n,true),window.removeEventListener("pointerup",a,true);let s=this.primengColumnSizingOverrides()[this.resizeColumnId];if(s){this.onColumnResized?.(this.resizeColumnId,s);let f={};for(let[b,C]of Object.entries(this.primengColumnSizingOverrides()))f[b]={widthPx:C};this.state().layout.setColumnSizingOverrides(f);}};window.addEventListener("pointermove",n,true),window.addEventListener("pointerup",a,true);}onResizeRowNumber(o){o.stopPropagation(),this.onResizeStartPrimeng(o,{columnId:ROW_NUMBER_COLUMN_ID,name:"#"});}getRowNumberWidth(){let o=this.primengColumnSizingOverrides()[ROW_NUMBER_COLUMN_ID];return o||super.getRowNumberWidth()}buildProps(){return {items:this.itemsInput,columns:this.columns,getRowId:this.getRowIdInput,sortBy:this.sortBy,sortDirection:this.sortDirection,onColumnSort:this.onColumnSort,visibleColumns:this.visibleColumns,columnOrder:this.columnOrder,onColumnOrderChange:this.onColumnOrderChange,onColumnResized:this.onColumnResized,onColumnPinned:this.onColumnPinned,pinnedColumns:this.pinnedColumnsInput,initialColumnWidths:this.initialColumnWidths,layoutMode:this.layoutMode,suppressHorizontalScroll:this.suppressHorizontalScroll,columnReorder:this.columnReorder,isLoading:this.isLoadingInput,loadingMessage:this.loadingMessageInput,editable:this.editable,cellSelection:this.cellSelection,onCellValueChanged:this.onCellValueChanged,onUndo:this.onUndoInput,onRedo:this.onRedoInput,canUndo:this.canUndoInput,canRedo:this.canRedoInput,rowSelection:this.rowSelectionMode,selectedRows:this.selectedRows,onSelectionChange:this.onSelectionChange,showRowNumbers:this.showRowNumbers,showColumnLetters:this.showColumnLettersInput,showNameBox:this.showNameBoxInput,onActiveCellChange:this.onActiveCellChange,currentPage:this.currentPageInput,pageSize:this.pageSizeInput,statusBar:this.statusBar,filters:this.filters,onFilterChange:this.onFilterChange,filterOptions:this.filterOptions,loadingFilterOptions:this.loadingFilterOptions,peopleSearch:this.peopleSearch,getUserByEmail:this.getUserByEmail,emptyState:this.emptyStateInput,onCellError:this.onCellError,stickyHeader:this.stickyHeaderInput,"aria-label":this.ariaLabelInput,"aria-labelledby":this.ariaLabelledByInput,formulaReferences:this.formulaReferencesInput}}getColumnLetter(o){return indexToColumnLetter(o)}};e([ViewChild("wrapper")],t.prototype,"wrapperRef",2),e([ViewChild("tableContainer")],t.prototype,"tableContainerRefEl",2),e([Input({required:true,alias:"items"})],t.prototype,"itemsInput",2),e([Input({required:true})],t.prototype,"columns",2),e([Input({required:true,alias:"getRowId"})],t.prototype,"getRowIdInput",2),e([Input()],t.prototype,"sortBy",2),e([Input()],t.prototype,"sortDirection",2),e([Input({required:true})],t.prototype,"onColumnSort",2),e([Input({required:true})],t.prototype,"visibleColumns",2),e([Input()],t.prototype,"columnOrder",2),e([Input()],t.prototype,"onColumnOrderChange",2),e([Input()],t.prototype,"onColumnResized",2),e([Input()],t.prototype,"onColumnPinned",2),e([Input({alias:"pinnedColumns"})],t.prototype,"pinnedColumnsInput",2),e([Input()],t.prototype,"initialColumnWidths",2),e([Input()],t.prototype,"layoutMode",2),e([Input()],t.prototype,"suppressHorizontalScroll",2),e([Input()],t.prototype,"stickyHeaderInput",2),e([Input()],t.prototype,"columnReorder",2),e([Input({alias:"isLoading"})],t.prototype,"isLoadingInput",2),e([Input({alias:"loadingMessage"})],t.prototype,"loadingMessageInput",2),e([Input()],t.prototype,"editable",2),e([Input()],t.prototype,"cellSelection",2),e([Input()],t.prototype,"onCellValueChanged",2),e([Input({alias:"onUndo"})],t.prototype,"onUndoInput",2),e([Input({alias:"onRedo"})],t.prototype,"onRedoInput",2),e([Input({alias:"canUndo"})],t.prototype,"canUndoInput",2),e([Input({alias:"canRedo"})],t.prototype,"canRedoInput",2),e([Input({alias:"rowSelection"})],t.prototype,"rowSelectionMode",2),e([Input()],t.prototype,"selectedRows",2),e([Input()],t.prototype,"onSelectionChange",2),e([Input()],t.prototype,"statusBar",2),e([Input({required:true})],t.prototype,"filters",2),e([Input({required:true})],t.prototype,"onFilterChange",2),e([Input()],t.prototype,"filterOptions",2),e([Input()],t.prototype,"loadingFilterOptions",2),e([Input()],t.prototype,"peopleSearch",2),e([Input()],t.prototype,"getUserByEmail",2),e([Input({alias:"emptyState"})],t.prototype,"emptyStateInput",2),e([Input()],t.prototype,"onCellError",2),e([Input({alias:"aria-label"})],t.prototype,"ariaLabelInput",2),e([Input({alias:"aria-labelledby"})],t.prototype,"ariaLabelledByInput",2),e([Input()],t.prototype,"showRowNumbers",2),e([Input({alias:"showColumnLetters"})],t.prototype,"showColumnLettersInput",2),e([Input({alias:"showNameBox"})],t.prototype,"showNameBoxInput",2),e([Input()],t.prototype,"onActiveCellChange",2),e([Input({alias:"formulaReferences"})],t.prototype,"formulaReferencesInput",2),e([Input({alias:"currentPage"})],t.prototype,"currentPageInput",2),e([Input({alias:"pageSize"})],t.prototype,"pageSizeInput",2),t=e([Component({selector:"ogrid-primeng-datagrid-table",standalone:true,imports:[StatusBarComponent,GridContextMenuComponent,MarchingAntsOverlayComponent,EmptyStateComponent,FormulaRefOverlayComponent,p,c,g,u],changeDetection:ChangeDetectionStrategy.OnPush,encapsulation:ViewEncapsulation.None,providers:[DataGridStateService,ColumnReorderService,VirtualScrollService],template:`
     <div class="ogrid-root">
       <div
         #wrapper
@@ -785,7 +237,7 @@ DataGridTableComponent = __decorateClass([
         [attr.data-has-selection]="rowSelectionMode !== 'none' ? 'true' : null"
         (contextmenu)="$event.preventDefault()"
         (keydown)="onGridKeyDown($event)"
-        (mousedown)="onWrapperMouseDown($event)"
+        (pointerdown)="onWrapperMouseDown($event)"
         (scroll)="onWrapperScroll($event)"
         [style.--data-table-column-count]="state().layout.totalColCount"
         [style.--ogrid-row-height]="rowHeightCssVar()"
@@ -835,7 +287,7 @@ DataGridTableComponent = __decorateClass([
                           #
                           <div
                             class="ogrid-resize-handle"
-                            (mousedown)="onResizeRowNumber($event)"
+                            (pointerdown)="onResizeRowNumber($event)"
                             (dblclick)="$event.stopPropagation()"
                           ></div>
                         </th>
@@ -872,7 +324,7 @@ DataGridTableComponent = __decorateClass([
                             [style.left.px]="pinned === 'left' ? getPinnedLeftOffset(col.columnId) : null"
                             [style.right.px]="pinned === 'right' ? getPinnedRightOffset(col.columnId) : null"
                             [style.cursor]="columnReorderService.isDragging() ? 'grabbing' : 'grab'"
-                            (mousedown)="onHeaderMouseDown(col.columnId, $event)"
+                            (pointerdown)="onHeaderMouseDown(col.columnId, $event)"
                           >
                             <div class="ogrid-header-content">
                               <ogrid-primeng-column-header-filter
@@ -908,7 +360,7 @@ DataGridTableComponent = __decorateClass([
                             </div>
                             <div
                               class="ogrid-resize-handle"
-                              (mousedown)="onResizeStartPrimeng($event, col)"
+                              (pointerdown)="onResizeStartPrimeng($event, col)"
                               (dblclick)="onResizeDoubleClick($event, col)"
                               [attr.aria-label]="'Resize ' + col.name"
                             ></div>
@@ -1006,7 +458,7 @@ DataGridTableComponent = __decorateClass([
                                 [attr.data-active-cell]="descriptor.isActive ? 'true' : null"
                                 [attr.data-in-range]="descriptor.isInRange ? 'true' : null"
                                 [attr.tabindex]="descriptor.isActive ? 0 : -1"
-                                (mousedown)="onCellMouseDown($event, rowIndex, descriptor.globalColIndex)"
+                                (pointerdown)="onCellMouseDown($event, rowIndex, descriptor.globalColIndex)"
                                 (click)="onCellClick(rowIndex, descriptor.globalColIndex)"
                                 (dblclick)="descriptor.canEditAny ? onCellDblClick(descriptor.rowId, col.columnId) : null"
                                 (contextmenu)="onCellContextMenu($event)"
@@ -1023,7 +475,7 @@ DataGridTableComponent = __decorateClass([
                                 }
                                 @if (descriptor.canEditAny && descriptor.isSelectionEndCell) {
                                   <div
-                                    (mousedown)="onFillHandleMouseDown($event)"
+                                    (pointerdown)="onFillHandleMouseDown($event)"
                                     class="ogrid-fill-handle"
                                     aria-label="Fill handle"
                                   ></div>
@@ -1125,8 +577,7 @@ DataGridTableComponent = __decorateClass([
         </div>
       }
     </div>
-  `,
-    styles: [OGRID_THEME_VARS_CSS, `
+  `,styles:[OGRID_THEME_VARS_CSS,`
     :host { display: block; }
     .ogrid-root {
       position: relative;
@@ -1210,6 +661,10 @@ DataGridTableComponent = __decorateClass([
       bottom: 0;
       width: 4px;
       cursor: col-resize;
+      touch-action: none;
+    }
+    @media (pointer: coarse) {
+      .ogrid-resize-handle { width: 16px; right: -6px; }
     }
     .ogrid-checkbox-cell {
       width: 48px;
@@ -1258,8 +713,12 @@ DataGridTableComponent = __decorateClass([
       height: 7px;
       background: var(--ogrid-selection, #217346);
       cursor: crosshair;
+      touch-action: none;
       z-index: 2;
     }
+    @media (pointer: coarse) {
+      .ogrid-fill-handle { width: 14px; height: 14px; right: -7px; bottom: -7px; border-radius: 2px; }
+    }
     .ogrid-empty-container {
       display: flex;
       align-items: center;
@@ -1441,21 +900,7 @@ DataGridTableComponent = __decorateClass([
       user-select: none;
       font-variant-numeric: tabular-nums;
     }
-  `]
-  })
-], DataGridTableComponent);
-var ColumnChooserComponent = class extends BaseColumnChooserComponent {
-  // PrimeNG uses 'open' instead of 'isOpen'
-  get open() {
-    return this.isOpen;
-  }
-};
-ColumnChooserComponent = __decorateClass([
-  Component({
-    selector: "ogrid-primeng-column-chooser",
-    standalone: true,
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    template: `
+  `]})],t);var m=class extends BaseColumnChooserComponent{get open(){return this.isOpen}};m=e([Component({selector:"ogrid-primeng-column-chooser",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,template:`
     <div style="position:relative;display:inline-block">
       <button
         type="button"
@@ -1505,24 +950,14 @@ ColumnChooserComponent = __decorateClass([
         </div>
       }
     </div>
-  `
-  })
-], ColumnChooserComponent);
-var PaginationControlsComponent = class extends BasePaginationControlsComponent {
-};
-PaginationControlsComponent = __decorateClass([
-  Component({
-    selector: "ogrid-primeng-pagination-controls",
-    standalone: true,
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    template: `
+  `})],m);var h=class extends BasePaginationControlsComponent{};h=e([Component({selector:"ogrid-primeng-pagination-controls",standalone:true,changeDetection:ChangeDetectionStrategy.OnPush,template:`
     @if (vm()) {
-      <div style="display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--ogrid-fg, #242424)">
-        <div>
+      <div class="ogrid-pagination" style="display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--ogrid-fg, #242424)">
+        <div class="ogrid-pagination__info">
           Showing {{ vm()!.startItem }} to {{ vm()!.endItem }} of {{ totalCount.toLocaleString() }} {{ labelPlural() }}
         </div>
 
-        <div style="display:flex;align-items:center;gap:4px" role="navigation" aria-label="Pagination">
+        <div class="ogrid-pagination__pages" style="display:flex;align-items:center;gap:4px" role="navigation" aria-label="Pagination">
           <button
             type="button"
             class="p-button p-button-text p-button-sm"
@@ -1592,7 +1027,7 @@ PaginationControlsComponent = __decorateClass([
           >&raquo;</button>
         </div>
 
-        <div style="display:flex;align-items:center;gap:6px">
+        <div class="ogrid-pagination__size" style="display:flex;align-items:center;gap:6px">
           <span style="font-size:12px">Rows</span>
           <select
             [value]="'' + pageSize"
@@ -1607,63 +1042,15 @@ PaginationControlsComponent = __decorateClass([
         </div>
       </div>
     }
-  `
-  })
-], PaginationControlsComponent);
-
-// src/ogrid/ogrid.component.ts
-var OGridComponent = class {
-  constructor() {
-    this.service = inject(OGridService);
-    this.propsSignal = signal(void 0);
-    // Stable callback references (avoid re-creating every template eval)
-    this.onColumnSortFn = (columnKey, direction) => this.service.handleSort(columnKey, direction);
-    this.onColumnResizedFn = (columnId, width) => this.service.handleColumnResized(columnId, width);
-    this.onColumnPinnedFn = (columnId, pinned) => this.service.handleColumnPinned(columnId, pinned);
-    this.onSelectionChangeFn = (event) => this.service.handleSelectionChange(event);
-    this.onFilterChangeFn = (key, value) => this.service.handleFilterChange(key, value);
-    this.clearAllFiltersFn = () => this.service.setFilters({});
-    this.emptyStateComputed = computed(() => ({
-      hasActiveFilters: this.service.hasActiveFilters(),
-      onClearAll: this.clearAllFiltersFn,
-      message: this.service.emptyState()?.message,
-      render: this.service.emptyState()?.render
-    }));
-    effect(() => {
-      const p = this.propsSignal();
-      if (p) this.service.configure(p);
-    });
-  }
-  set props(value) {
-    this.propsSignal.set(value);
-  }
-  get showToolbar() {
-    return this.service.columnChooserPlacement() === "toolbar" || this.service.toolbar() != null || this.service.fullScreen();
-  }
-  get emptyStateObj() {
-    return this.emptyStateComputed();
-  }
-  onPageSizeChange(size) {
-    this.service.setPageSize(size);
-  }
-};
-__decorateClass([
-  Input({ required: true })
-], OGridComponent.prototype, "props", 1);
-OGridComponent = __decorateClass([
-  Component({
-    selector: "ogrid-primeng",
-    standalone: true,
-    imports: [
-      OGridLayoutComponent,
-      DataGridTableComponent,
-      ColumnChooserComponent,
-      PaginationControlsComponent
-    ],
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    providers: [OGridService],
-    styles: [`:host { display: block; height: 100%; }`],
-    template: `
+  `,styles:[`
+    :host { display: block; }
+    @media (max-width: 576px) {
+      .ogrid-pagination { flex-direction: column; align-items: stretch; gap: 6px; padding: 6px 8px; font-size: 12px; }
+      .ogrid-pagination__pages { order: -1; justify-content: center; }
+      .ogrid-pagination__info { text-align: center; font-size: 11px; }
+      .ogrid-pagination__size { font-size: 11px; justify-content: center; }
+    }
+  `]})],h);var v=class{constructor(){this.service=inject(OGridService);this.propsSignal=signal(void 0);this.onColumnSortFn=(l,o)=>this.service.handleSort(l,o);this.onColumnResizedFn=(l,o)=>this.service.handleColumnResized(l,o);this.onColumnPinnedFn=(l,o)=>this.service.handleColumnPinned(l,o);this.onSelectionChangeFn=l=>this.service.handleSelectionChange(l);this.onFilterChangeFn=(l,o)=>this.service.handleFilterChange(l,o);this.clearAllFiltersFn=()=>this.service.setFilters({});this.emptyStateComputed=computed(()=>({hasActiveFilters:this.service.hasActiveFilters(),onClearAll:this.clearAllFiltersFn,message:this.service.emptyState()?.message,render:this.service.emptyState()?.render}));effect(()=>{let l=this.propsSignal();l&&this.service.configure(l);});}set props(l){this.propsSignal.set(l);}get showToolbar(){return this.service.columnChooserPlacement()==="toolbar"||this.service.toolbar()!=null||this.service.fullScreen()}get emptyStateObj(){return this.emptyStateComputed()}onPageSizeChange(l){this.service.setPageSize(l);}};e([Input({required:true})],v.prototype,"props",1),v=e([Component({selector:"ogrid-primeng",standalone:true,imports:[OGridLayoutComponent,t,m,h],changeDetection:ChangeDetectionStrategy.OnPush,providers:[OGridService],styles:[":host { display: block; height: 100%; }"],template:`
     <ogrid-layout
       [className]="service.className()"
       [hasToolbar]="showToolbar"
@@ -1747,8 +1134,4 @@ OGridComponent = __decorateClass([
         ></ogrid-primeng-pagination-controls>
       </div>
     </ogrid-layout>
-  `
-  })
-], OGridComponent);
-
-export { ColumnChooserComponent, ColumnHeaderFilterComponent, ColumnHeaderMenuComponent, DataGridTableComponent, InlineCellEditorComponent, OGridComponent, PaginationControlsComponent, PopoverCellEditorComponent };
+  `})],v);export{m as ColumnChooserComponent,p as ColumnHeaderFilterComponent,c as ColumnHeaderMenuComponent,t as DataGridTableComponent,g as InlineCellEditorComponent,v as OGridComponent,h as PaginationControlsComponent,u as PopoverCellEditorComponent};

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

@@ -102,8 +102,8 @@ export declare class DataGridTableComponent<T = unknown> extends BaseDataGridTab
     onSelectAllChangePrimeng(checked: boolean): void;
     onRowClickPrimeng(e: MouseEvent, item: T): void;
     onRowCheckboxChangePrimeng(item: T, checked: boolean, rowIndex: number, _e: Event): void;
-    onResizeStartPrimeng(e: MouseEvent, col: IColumnDef<T>): void;
-    onResizeRowNumber(event: MouseEvent): void;
+    onResizeStartPrimeng(e: PointerEvent, col: IColumnDef<T>): void;
+    onResizeRowNumber(event: PointerEvent): void;
     getRowNumberWidth(): number;
     private buildProps;
     getColumnLetter(colIdx: number): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alaarab/ogrid-angular-primeng",
-  "version": "2.4.1",
+  "version": "2.5.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.4.1"
+    "@alaarab/ogrid-angular": "2.5.0"
   },
   "peerDependencies": {
     "@angular/core": "^21.0.0",