@alaarab/ogrid-angular-material 2.0.5 → 2.0.7

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

@@ -4,7 +4,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { Component, Input, Output, EventEmitter, ViewChild } from '@angular/core';
+import { Component, input, viewChild, ChangeDetectionStrategy } from '@angular/core';
 import { MatMenuModule, MatMenuTrigger } from '@angular/material/menu';
 import { MatButtonModule } from '@angular/material/button';
 import { MatIconModule } from '@angular/material/icon';
@@ -15,65 +15,44 @@ import { COLUMN_HEADER_MENU_ITEMS } from '@alaarab/ogrid-core';
  */
 let ColumnHeaderMenuComponent = class ColumnHeaderMenuComponent {
     constructor() {
-        this.canPinLeft = true;
-        this.canPinRight = true;
-        this.canUnpin = false;
-        this.pinLeft = new EventEmitter();
-        this.pinRight = new EventEmitter();
-        this.unpin = new EventEmitter();
+        this.columnId = input.required();
+        this.canPinLeft = input(true);
+        this.canPinRight = input(true);
+        this.canUnpin = input(false);
+        this.onPinLeft = input(undefined);
+        this.onPinRight = input(undefined);
+        this.onUnpin = input(undefined);
+        this.menuTrigger = viewChild(MatMenuTrigger);
         this.menuItems = COLUMN_HEADER_MENU_ITEMS;
     }
     handlePinLeft() {
-        if (this.canPinLeft) {
-            this.pinLeft.emit();
+        if (this.canPinLeft()) {
+            this.onPinLeft()?.();
         }
     }
     handlePinRight() {
-        if (this.canPinRight) {
-            this.pinRight.emit();
+        if (this.canPinRight()) {
+            this.onPinRight()?.();
         }
     }
     handleUnpin() {
-        if (this.canUnpin) {
-            this.unpin.emit();
+        if (this.canUnpin()) {
+            this.onUnpin()?.();
         }
     }
 };
-__decorate([
-    Input()
-], ColumnHeaderMenuComponent.prototype, "columnId", void 0);
-__decorate([
-    Input()
-], ColumnHeaderMenuComponent.prototype, "canPinLeft", void 0);
-__decorate([
-    Input()
-], ColumnHeaderMenuComponent.prototype, "canPinRight", void 0);
-__decorate([
-    Input()
-], ColumnHeaderMenuComponent.prototype, "canUnpin", void 0);
-__decorate([
-    Output()
-], ColumnHeaderMenuComponent.prototype, "pinLeft", void 0);
-__decorate([
-    Output()
-], ColumnHeaderMenuComponent.prototype, "pinRight", void 0);
-__decorate([
-    Output()
-], ColumnHeaderMenuComponent.prototype, "unpin", void 0);
-__decorate([
-    ViewChild(MatMenuTrigger)
-], ColumnHeaderMenuComponent.prototype, "menuTrigger", void 0);
 ColumnHeaderMenuComponent = __decorate([
     Component({
         selector: 'column-header-menu',
         standalone: true,
         imports: [MatMenuModule, MatButtonModule, MatIconModule],
+        changeDetection: ChangeDetectionStrategy.OnPush,
         template: `
     <button
       mat-icon-button
       [matMenuTriggerFor]="menu"
       class="column-header-menu-trigger"
-      [attr.aria-label]="'Column options for ' + columnId"
+      [attr.aria-label]="'Column options for ' + columnId()"
     >
       <mat-icon>more_vert</mat-icon>
     </button>
@@ -81,21 +60,21 @@ ColumnHeaderMenuComponent = __decorate([
     <mat-menu #menu="matMenu">
       <button
         mat-menu-item
-        [disabled]="!canPinLeft"
+        [disabled]="!canPinLeft()"
         (click)="handlePinLeft()"
       >
         {{ menuItems[0].label }}
       </button>
       <button
         mat-menu-item
-        [disabled]="!canPinRight"
+        [disabled]="!canPinRight()"
         (click)="handlePinRight()"
       >
         {{ menuItems[1].label }}
       </button>
       <button
         mat-menu-item
-        [disabled]="!canUnpin"
+        [disabled]="!canUnpin()"
         (click)="handleUnpin()"
       >
         {{ menuItems[2].label }}

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

@@ -4,301 +4,30 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { Component, input, signal, computed, effect, ChangeDetectionStrategy, viewChild, } from '@angular/core';
-import { DataGridStateService, ColumnReorderService, VirtualScrollService, MarchingAntsOverlayComponent, buildHeaderRows, CHECKBOX_COLUMN_WIDTH, ROW_NUMBER_COLUMN_WIDTH, DEFAULT_MIN_COLUMN_WIDTH, getHeaderFilterConfig, getCellRenderDescriptor, resolveCellDisplayContent, resolveCellStyle, } from '@alaarab/ogrid-angular';
+import { Component, input, viewChild, ChangeDetectionStrategy, } from '@angular/core';
+import { BaseDataGridTableComponent, DataGridStateService, MarchingAntsOverlayComponent, CHECKBOX_COLUMN_WIDTH, ROW_NUMBER_COLUMN_WIDTH, } from '@alaarab/ogrid-angular';
 import { ColumnHeaderFilterComponent } from '../column-header-filter/column-header-filter.component';
 import { ColumnHeaderMenuComponent } from '../column-header-menu/column-header-menu.component';
 /**
  * DataGridTable component using native HTML table with Material Design-inspired styling.
  * Standalone component — this is the workhorse of the grid.
  */
-let DataGridTableComponent = class DataGridTableComponent {
+let DataGridTableComponent = class DataGridTableComponent extends BaseDataGridTableComponent {
     constructor() {
+        super();
         this.propsInput = input.required({ alias: 'props' });
         this.wrapperRef = viewChild('wrapperEl');
         this.tableContainerRef = viewChild('tableContainerEl');
-        this.stateService = new DataGridStateService();
-        this.columnReorderService = new ColumnReorderService();
-        this.virtualScrollService = new VirtualScrollService();
-        this.lastMouseShift = false;
-        this.columnSizingVersion = signal(0);
-        // --- Delegated state ---
-        this.state = computed(() => this.stateService.getState());
-        this.items = computed(() => this.propsInput()?.items ?? []);
-        this.getRowId = computed(() => this.propsInput()?.getRowId ?? ((item) => item['id']));
-        this.isLoading = computed(() => this.propsInput()?.isLoading ?? false);
-        this.loadingMessage = computed(() => 'Loading\u2026');
-        this.freezeRows = computed(() => this.propsInput()?.freezeRows);
-        this.freezeCols = computed(() => this.propsInput()?.freezeCols);
-        this.layoutModeFit = computed(() => (this.propsInput()?.layoutMode ?? 'fill') === 'content');
-        this.ariaLabel = computed(() => this.propsInput()?.['aria-label'] ?? 'Data grid');
-        this.ariaLabelledBy = computed(() => this.propsInput()?.['aria-labelledby']);
-        this.emptyState = computed(() => this.propsInput()?.emptyState);
-        this.currentPage = computed(() => this.propsInput()?.currentPage ?? 1);
-        this.pageSize = computed(() => this.propsInput()?.pageSize ?? 25);
-        this.rowNumberOffset = computed(() => this.hasRowNumbersCol() ? (this.currentPage() - 1) * this.pageSize() : 0);
-        // State service outputs
-        this.visibleCols = computed(() => this.state().layout.visibleCols);
-        this.hasCheckboxCol = computed(() => this.state().layout.hasCheckboxCol);
-        this.hasRowNumbersCol = computed(() => this.state().layout.hasRowNumbersCol);
-        this.colOffset = computed(() => this.state().layout.colOffset);
-        this.containerWidth = computed(() => this.state().layout.containerWidth);
-        this.minTableWidth = computed(() => this.state().layout.minTableWidth);
-        this.desiredTableWidth = computed(() => this.state().layout.desiredTableWidth);
-        this.columnSizingOverrides = computed(() => this.state().layout.columnSizingOverrides);
-        this.selectedRowIds = computed(() => this.state().rowSelection.selectedRowIds);
-        this.allSelected = computed(() => this.state().rowSelection.allSelected);
-        this.someSelected = computed(() => this.state().rowSelection.someSelected);
-        this.editingCell = computed(() => this.state().editing.editingCell);
-        this.pendingEditorValue = computed(() => this.state().editing.pendingEditorValue);
-        this.activeCell = computed(() => this.state().interaction.activeCell);
-        this.selectionRange = computed(() => this.state().interaction.selectionRange);
-        this.hasCellSelection = computed(() => this.state().interaction.hasCellSelection);
-        this.cutRange = computed(() => this.state().interaction.cutRange);
-        this.copyRange = computed(() => this.state().interaction.copyRange);
-        this.canUndo = computed(() => this.state().interaction.canUndo);
-        this.canRedo = computed(() => this.state().interaction.canRedo);
-        this.isDragging = computed(() => this.state().interaction.isDragging);
-        this.menuPosition = computed(() => this.state().contextMenu.menuPosition);
-        this.statusBarConfig = computed(() => this.state().viewModels.statusBarConfig);
-        this.showEmptyInGrid = computed(() => this.state().viewModels.showEmptyInGrid);
-        this.headerFilterInput = computed(() => this.state().viewModels.headerFilterInput);
-        this.cellDescriptorInput = computed(() => this.state().viewModels.cellDescriptorInput);
-        this.allowOverflowX = computed(() => {
-            const p = this.propsInput();
-            if (p?.suppressHorizontalScroll)
-                return false;
-            const cw = this.containerWidth();
-            const mtw = this.minTableWidth();
-            const dtw = this.desiredTableWidth();
-            return cw > 0 && (mtw > cw || dtw > cw);
-        });
-        this.selectionCellCount = computed(() => {
-            const sr = this.selectionRange();
-            if (!sr)
-                return undefined;
-            return (Math.abs(sr.endRow - sr.startRow) + 1) * (Math.abs(sr.endCol - sr.startCol) + 1);
-        });
-        // Header rows from column definition
-        this.headerRows = computed(() => {
-            const p = this.propsInput();
-            if (!p)
-                return [];
-            return buildHeaderRows(p.columns, p.visibleColumns);
-        });
-        // Pre-computed column layouts
-        this.columnLayouts = computed(() => {
-            const cols = this.visibleCols();
-            const fc = this.freezeCols();
-            const props = this.propsInput();
-            const pinnedCols = props?.pinnedColumns ?? {};
-            return cols.map((col, colIdx) => {
-                const isFreezeCol = fc != null && fc >= 1 && colIdx < fc;
-                const runtimePinned = pinnedCols[col.columnId];
-                const pinnedLeft = runtimePinned === 'left' || (isFreezeCol && colIdx === 0);
-                const pinnedRight = runtimePinned === 'right';
-                const w = this.getColumnWidth(col);
-                return {
-                    col,
-                    pinnedLeft,
-                    pinnedRight,
-                    minWidth: col.minWidth ?? DEFAULT_MIN_COLUMN_WIDTH,
-                    width: w,
-                };
-            });
-        });
-        // Wire props and wrapper element to state service
-        effect(() => {
-            const p = this.propsInput();
-            if (p)
-                this.stateService.props.set(p);
-        });
-        effect(() => {
-            const el = this.wrapperRef()?.nativeElement;
-            if (el) {
-                this.stateService.wrapperEl.set(el);
-                this.columnReorderService.wrapperEl.set(el);
-            }
-        });
-        // Wire column reorder service inputs
-        effect(() => {
-            const p = this.propsInput();
-            if (p) {
-                const cols = this.visibleCols();
-                this.columnReorderService.columns.set(cols);
-                this.columnReorderService.columnOrder.set(p.columnOrder);
-                this.columnReorderService.onColumnOrderChange.set(p.onColumnOrderChange);
-                this.columnReorderService.enabled.set(!!p.onColumnOrderChange);
-            }
-        });
-        // Wire virtual scroll service inputs
-        effect(() => {
-            const p = this.propsInput();
-            if (p) {
-                this.virtualScrollService.totalRows.set(p.items.length);
-            }
-        });
+        this.initBase();
     }
-    // --- Helper methods ---
-    asColumnDef(colDef) {
-        return colDef;
+    getProps() {
+        return this.propsInput();
     }
-    visibleColIndex(col) {
-        return this.visibleCols().indexOf(col);
+    getWrapperRef() {
+        return this.wrapperRef();
     }
-    getColumnWidth(col) {
-        const overrides = this.columnSizingOverrides();
-        const override = overrides[col.columnId];
-        if (override)
-            return override.widthPx;
-        return col.defaultWidth ?? col.minWidth ?? DEFAULT_MIN_COLUMN_WIDTH;
-    }
-    getFilterConfig(col) {
-        return getHeaderFilterConfig(col, this.headerFilterInput());
-    }
-    getCellDescriptor(item, col, rowIndex, colIdx) {
-        return getCellRenderDescriptor(item, col, rowIndex, colIdx, this.cellDescriptorInput());
-    }
-    resolveCellContent(col, item, displayValue) {
-        return resolveCellDisplayContent(col, item, displayValue);
-    }
-    resolveCellStyleFn(col, item) {
-        return resolveCellStyle(col, item);
-    }
-    getSelectValues(col) {
-        const params = col.cellEditorParams;
-        if (params && typeof params === 'object' && 'values' in params) {
-            return params.values.map(String);
-        }
-        return [];
-    }
-    formatDateForInput(value) {
-        if (!value)
-            return '';
-        const d = new Date(String(value));
-        if (Number.isNaN(d.getTime()))
-            return '';
-        return d.toISOString().split('T')[0];
-    }
-    // --- Event handlers ---
-    onWrapperMouseDown(event) {
-        this.lastMouseShift = event.shiftKey;
-    }
-    onGridKeyDown(event) {
-        this.state().interaction.handleGridKeyDown(event);
-    }
-    onCellMouseDown(event, rowIndex, globalColIndex) {
-        this.state().interaction.handleCellMouseDown(event, rowIndex, globalColIndex);
-    }
-    onCellClick(rowIndex, globalColIndex) {
-        this.state().interaction.setActiveCell({ rowIndex, columnIndex: globalColIndex });
-    }
-    onCellContextMenu(event) {
-        this.state().contextMenu.handleCellContextMenu(event);
-    }
-    onCellDblClick(rowId, columnId) {
-        this.state().editing.setEditingCell({ rowId, columnId });
-    }
-    onFillHandleMouseDown(event) {
-        this.state().interaction.handleFillHandleMouseDown(event);
-    }
-    onResizeStart(event, col) {
-        event.preventDefault();
-        const startX = event.clientX;
-        const startWidth = this.getColumnWidth(col);
-        const minWidth = col.minWidth ?? DEFAULT_MIN_COLUMN_WIDTH;
-        const onMove = (e) => {
-            const delta = e.clientX - startX;
-            const newWidth = Math.max(minWidth, startWidth + delta);
-            const overrides = { ...this.columnSizingOverrides(), [col.columnId]: { widthPx: newWidth } };
-            this.state().layout.setColumnSizingOverrides(overrides);
-            this.columnSizingVersion.update(v => v + 1);
-        };
-        const onUp = () => {
-            window.removeEventListener('mousemove', onMove);
-            window.removeEventListener('mouseup', onUp);
-            const finalWidth = this.getColumnWidth(col);
-            this.state().layout.onColumnResized?.(col.columnId, finalWidth);
-        };
-        window.addEventListener('mousemove', onMove);
-        window.addEventListener('mouseup', onUp);
-    }
-    onSelectAllChange(event) {
-        const checked = event.target.checked;
-        this.state().rowSelection.handleSelectAll(!!checked);
-    }
-    onRowClick(event, rowId) {
-        const p = this.propsInput();
-        if (p?.rowSelection !== 'single')
-            return;
-        const ids = this.selectedRowIds();
-        this.state().rowSelection.updateSelection(ids.has(rowId) ? new Set() : new Set([rowId]));
-    }
-    onRowCheckboxChange(rowId, event, rowIndex) {
-        const checked = event.target.checked;
-        this.state().rowSelection.handleRowCheckboxChange(rowId, checked, rowIndex, this.lastMouseShift);
-    }
-    commitEdit(item, columnId, oldValue, newValue, rowIndex, globalColIndex) {
-        this.state().editing.commitCellEdit(item, columnId, oldValue, newValue, rowIndex, globalColIndex);
-    }
-    cancelEdit() {
-        this.state().editing.setEditingCell(null);
-    }
-    onEditorKeydown(event, item, columnId, oldValue, rowIndex, globalColIndex) {
-        if (event.key === 'Enter') {
-            event.preventDefault();
-            const newValue = event.target.value;
-            this.commitEdit(item, columnId, oldValue, newValue, rowIndex, globalColIndex);
-        }
-        else if (event.key === 'Escape') {
-            event.preventDefault();
-            this.cancelEdit();
-        }
-    }
-    closeContextMenu() {
-        this.state().contextMenu.closeContextMenu();
-    }
-    handleCopy() {
-        this.state().interaction.handleCopy();
-    }
-    handleCut() {
-        this.state().interaction.handleCut();
-    }
-    handlePaste() {
-        void this.state().interaction.handlePaste();
-    }
-    handleSelectAllCells() {
-        this.state().interaction.handleSelectAllCells();
-    }
-    onUndo() {
-        this.state().interaction.onUndo?.();
-    }
-    onRedo() {
-        this.state().interaction.onRedo?.();
-    }
-    onHeaderMouseDown(columnId, event) {
-        this.columnReorderService.handleHeaderMouseDown(columnId, event);
-    }
-    // --- Column pinning methods ---
-    onPinColumn(columnId, side) {
-        const props = this.propsInput();
-        props?.onColumnPinned?.(columnId, side);
-    }
-    onUnpinColumn(columnId) {
-        const props = this.propsInput();
-        props?.onColumnPinned?.(columnId, null);
-    }
-    isPinned(columnId) {
-        const props = this.propsInput();
-        return props?.pinnedColumns?.[columnId];
-    }
-    getPinState(columnId) {
-        const pinned = this.isPinned(columnId);
-        return {
-            canPinLeft: pinned !== 'left',
-            canPinRight: pinned !== 'right',
-            canUnpin: !!pinned,
-        };
+    getTableContainerRef() {
+        return this.tableContainerRef();
     }
 };
 DataGridTableComponent = __decorate([

package/dist/types/column-header-menu/column-header-menu.component.d.ts

@@ -1,18 +1,17 @@
-import { EventEmitter } from '@angular/core';
 import { MatMenuTrigger } from '@angular/material/menu';
 /**
  * Column header dropdown menu for pin/unpin actions.
  * Uses Angular Material MatMenu.
  */
 export declare class ColumnHeaderMenuComponent {
-    columnId: string;
-    canPinLeft: boolean;
-    canPinRight: boolean;
-    canUnpin: boolean;
-    pinLeft: EventEmitter<void>;
-    pinRight: EventEmitter<void>;
-    unpin: EventEmitter<void>;
-    menuTrigger?: MatMenuTrigger;
+    readonly columnId: import("@angular/core").InputSignal<string>;
+    readonly canPinLeft: import("@angular/core").InputSignal<boolean>;
+    readonly canPinRight: import("@angular/core").InputSignal<boolean>;
+    readonly canUnpin: import("@angular/core").InputSignal<boolean>;
+    readonly onPinLeft: import("@angular/core").InputSignal<(() => void) | undefined>;
+    readonly onPinRight: import("@angular/core").InputSignal<(() => void) | undefined>;
+    readonly onUnpin: import("@angular/core").InputSignal<(() => void) | undefined>;
+    readonly menuTrigger: import("@angular/core").Signal<MatMenuTrigger | undefined>;
     readonly menuItems: import("@alaarab/ogrid-core").IColumnHeaderMenuItem[];
     handlePinLeft(): void;
     handlePinRight(): void;

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

@@ -1,143 +1,16 @@
-import { ColumnReorderService, VirtualScrollService } from '@alaarab/ogrid-angular';
-import type { IOGridDataGridProps, IColumnDef, RowId, CellRenderDescriptor, HeaderFilterConfig } from '@alaarab/ogrid-angular';
+import { ElementRef } from '@angular/core';
+import { BaseDataGridTableComponent } from '@alaarab/ogrid-angular';
+import type { IOGridDataGridProps } from '@alaarab/ogrid-angular';
 /**
  * DataGridTable component using native HTML table with Material Design-inspired styling.
  * Standalone component — this is the workhorse of the grid.
  */
-export declare class DataGridTableComponent<T> {
+export declare class DataGridTableComponent<T> extends BaseDataGridTableComponent<T> {
     readonly propsInput: import("@angular/core").InputSignal<IOGridDataGridProps<T>>;
     private readonly wrapperRef;
     private readonly tableContainerRef;
-    private readonly stateService;
-    readonly columnReorderService: ColumnReorderService<T>;
-    readonly virtualScrollService: VirtualScrollService;
-    private lastMouseShift;
-    private columnSizingVersion;
     constructor();
-    private readonly state;
-    readonly items: import("@angular/core").Signal<T[]>;
-    readonly getRowId: import("@angular/core").Signal<(item: T) => RowId>;
-    readonly isLoading: import("@angular/core").Signal<boolean>;
-    readonly loadingMessage: import("@angular/core").Signal<string>;
-    readonly freezeRows: import("@angular/core").Signal<number | undefined>;
-    readonly freezeCols: import("@angular/core").Signal<number | undefined>;
-    readonly layoutModeFit: import("@angular/core").Signal<boolean>;
-    readonly ariaLabel: import("@angular/core").Signal<string>;
-    readonly ariaLabelledBy: import("@angular/core").Signal<string | undefined>;
-    readonly emptyState: import("@angular/core").Signal<{
-        onClearAll: () => void;
-        hasActiveFilters: boolean;
-        message?: string;
-        render?: import("@angular/core").TemplateRef<unknown>;
-    } | undefined>;
-    readonly currentPage: import("@angular/core").Signal<number>;
-    readonly pageSize: import("@angular/core").Signal<number>;
-    readonly rowNumberOffset: import("@angular/core").Signal<number>;
-    readonly visibleCols: import("@angular/core").Signal<IColumnDef<T>[]>;
-    readonly hasCheckboxCol: import("@angular/core").Signal<boolean>;
-    readonly hasRowNumbersCol: import("@angular/core").Signal<boolean>;
-    readonly colOffset: import("@angular/core").Signal<number>;
-    readonly containerWidth: import("@angular/core").Signal<number>;
-    readonly minTableWidth: import("@angular/core").Signal<number>;
-    readonly desiredTableWidth: import("@angular/core").Signal<number>;
-    readonly columnSizingOverrides: import("@angular/core").Signal<Record<string, {
-        widthPx: number;
-    }>>;
-    readonly selectedRowIds: import("@angular/core").Signal<Set<RowId>>;
-    readonly allSelected: import("@angular/core").Signal<boolean>;
-    readonly someSelected: import("@angular/core").Signal<boolean>;
-    readonly editingCell: import("@angular/core").Signal<{
-        rowId: RowId;
-        columnId: string;
-    } | null>;
-    readonly pendingEditorValue: import("@angular/core").Signal<unknown>;
-    readonly activeCell: import("@angular/core").Signal<import("@alaarab/ogrid-core").IActiveCell | null>;
-    readonly selectionRange: import("@angular/core").Signal<import("@alaarab/ogrid-core").ISelectionRange | null>;
-    readonly hasCellSelection: import("@angular/core").Signal<boolean>;
-    readonly cutRange: import("@angular/core").Signal<import("@alaarab/ogrid-core").ISelectionRange | null>;
-    readonly copyRange: import("@angular/core").Signal<import("@alaarab/ogrid-core").ISelectionRange | null>;
-    readonly canUndo: import("@angular/core").Signal<boolean>;
-    readonly canRedo: import("@angular/core").Signal<boolean>;
-    readonly isDragging: import("@angular/core").Signal<boolean>;
-    readonly menuPosition: import("@angular/core").Signal<{
-        x: number;
-        y: number;
-    } | null>;
-    readonly statusBarConfig: import("@angular/core").Signal<import("@alaarab/ogrid-core").IStatusBarProps | null>;
-    readonly showEmptyInGrid: import("@angular/core").Signal<boolean>;
-    readonly headerFilterInput: import("@angular/core").Signal<{
-        sortBy?: string;
-        sortDirection: "asc" | "desc";
-        onColumnSort: (columnKey: string) => void;
-        filters: import("@alaarab/ogrid-core").IFilters;
-        onFilterChange: (key: string, value: import("@alaarab/ogrid-core").FilterValue | undefined) => void;
-        filterOptions: Record<string, string[]>;
-        loadingFilterOptions: Record<string, boolean>;
-        peopleSearch?: (query: string) => Promise<import("@alaarab/ogrid-core").UserLike[]>;
-    }>;
-    readonly cellDescriptorInput: import("@angular/core").Signal<{
-        editingCell: {
-            rowId: RowId;
-            columnId: string;
-        } | null;
-        activeCell: import("@alaarab/ogrid-core").IActiveCell | null;
-        selectionRange: import("@alaarab/ogrid-core").ISelectionRange | null;
-        cutRange: import("@alaarab/ogrid-core").ISelectionRange | null;
-        copyRange: import("@alaarab/ogrid-core").ISelectionRange | null;
-        colOffset: number;
-        itemsLength: number;
-        getRowId: (item: T) => RowId;
-        editable?: boolean;
-        onCellValueChanged?: ((event: import("@alaarab/ogrid-core").ICellValueChangedEvent<T>) => void) | undefined;
-        isDragging: boolean;
-    }>;
-    readonly allowOverflowX: import("@angular/core").Signal<boolean>;
-    readonly selectionCellCount: import("@angular/core").Signal<number | undefined>;
-    readonly headerRows: import("@angular/core").Signal<import("@alaarab/ogrid-core").HeaderRow<T>[]>;
-    readonly columnLayouts: import("@angular/core").Signal<{
-        col: IColumnDef<T>;
-        pinnedLeft: boolean;
-        pinnedRight: boolean;
-        minWidth: number;
-        width: number;
-    }[]>;
-    asColumnDef(colDef: unknown): IColumnDef<T>;
-    visibleColIndex(col: IColumnDef<T>): number;
-    getColumnWidth(col: IColumnDef<T>): number;
-    getFilterConfig(col: IColumnDef<T>): HeaderFilterConfig;
-    getCellDescriptor(item: T, col: IColumnDef<T>, rowIndex: number, colIdx: number): CellRenderDescriptor;
-    resolveCellContent(col: IColumnDef<T>, item: T, displayValue: unknown): string;
-    resolveCellStyleFn(col: IColumnDef<T>, item: T): Record<string, string> | undefined;
-    getSelectValues(col: IColumnDef<T>): string[];
-    formatDateForInput(value: unknown): string;
-    onWrapperMouseDown(event: MouseEvent): void;
-    onGridKeyDown(event: KeyboardEvent): void;
-    onCellMouseDown(event: MouseEvent, rowIndex: number, globalColIndex: number): void;
-    onCellClick(rowIndex: number, globalColIndex: number): void;
-    onCellContextMenu(event: MouseEvent): void;
-    onCellDblClick(rowId: RowId, columnId: string): void;
-    onFillHandleMouseDown(event: MouseEvent): void;
-    onResizeStart(event: MouseEvent, col: IColumnDef<T>): void;
-    onSelectAllChange(event: Event): void;
-    onRowClick(event: MouseEvent, rowId: RowId): void;
-    onRowCheckboxChange(rowId: RowId, event: Event, rowIndex: number): void;
-    commitEdit(item: T, columnId: string, oldValue: unknown, newValue: unknown, rowIndex: number, globalColIndex: number): void;
-    cancelEdit(): void;
-    onEditorKeydown(event: KeyboardEvent, item: T, columnId: string, oldValue: unknown, rowIndex: number, globalColIndex: number): void;
-    closeContextMenu(): void;
-    handleCopy(): void;
-    handleCut(): void;
-    handlePaste(): void;
-    handleSelectAllCells(): void;
-    onUndo(): void;
-    onRedo(): void;
-    onHeaderMouseDown(columnId: string, event: MouseEvent): void;
-    onPinColumn(columnId: string, side: 'left' | 'right'): void;
-    onUnpinColumn(columnId: string): void;
-    isPinned(columnId: string): 'left' | 'right' | undefined;
-    getPinState(columnId: string): {
-        canPinLeft: boolean;
-        canPinRight: boolean;
-        canUnpin: boolean;
-    };
+    protected getProps(): IOGridDataGridProps<T> | undefined;
+    protected getWrapperRef(): ElementRef<HTMLElement> | undefined;
+    protected getTableContainerRef(): ElementRef<HTMLElement> | undefined;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alaarab/ogrid-angular-material",
-  "version": "2.0.5",
+  "version": "2.0.7",
   "description": "OGrid Angular Material – MatTable-based data grid with sorting, filtering, pagination, column chooser, and CSV export.",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",
@@ -22,7 +22,7 @@
   "files": ["dist", "README.md", "LICENSE"],
   "engines": { "node": ">=18" },
   "dependencies": {
-    "@alaarab/ogrid-angular": "2.0.5"
+    "@alaarab/ogrid-angular": "2.0.7"
   },
   "peerDependencies": {
     "@angular/core": "^21.0.0",
@@ -39,9 +39,10 @@
     "@angular/material": "^21.1.4",
     "@angular/cdk": "^21.1.4",
     "@angular/animations": "^21.1.4",
-    "rxjs": "^7.8.0",
+    "rxjs": "^7.8.2",
     "zone.js": "^0.15.0",
-    "typescript": "^5.7.3"
+    "typescript": "^5.9.3"
   },
+  "sideEffects": false,
   "publishConfig": { "access": "public" }
 }