@alaarab/ogrid-js 2.0.22 → 2.1.0

package/dist/types/index.d.ts

@@ -1,8 +1,12 @@
 export * from '@alaarab/ogrid-core';
 export type { IColumnDef, IColumnGroupDef, ICellEditorContext } from './types/columnTypes';
-export type { OGridOptions, OGridEvents, IJsOGridApi } from './types/gridTypes';
+export type { OGridOptions, OGridEvents, IJsOGridApi, CellEvent } from './types/gridTypes';
 export { debounce } from './utils';
 export { OGrid } from './OGrid';
+export { OGridEventWiring } from './OGridEventWiring';
+export type { InteractionResult, EventWiringCallbacks } from './OGridEventWiring';
+export { OGridRendering } from './OGridRendering';
+export type { OGridRenderingContext } from './OGridRendering';
 export { GridState } from './state/GridState';
 export { EventEmitter } from './state/EventEmitter';
 export { SelectionState } from './state/SelectionState';
@@ -12,6 +16,7 @@ export { UndoRedoState } from './state/UndoRedoState';
 export { ColumnResizeState } from './state/ColumnResizeState';
 export { TableLayoutState } from './state/TableLayoutState';
 export { TableRenderer } from './renderer/TableRenderer';
+export type { TableRendererInteractionState } from './renderer/TableRenderer';
 export { PaginationControls } from './components/PaginationControls';
 export { StatusBar } from './components/StatusBar';
 export { ColumnChooser } from './components/ColumnChooser';

package/dist/types/renderer/TableRenderer.d.ts

@@ -1,4 +1,4 @@
-import type { RowId } from '../types/gridTypes';
+import type { RowId, CellEvent } from '../types/gridTypes';
 import type { IActiveCell, ISelectionRange } from '@alaarab/ogrid-core';
 import type { GridState } from '../state/GridState';
 import type { HeaderFilterState, HeaderFilterConfig } from '../state/HeaderFilterState';
@@ -13,10 +13,10 @@ export interface TableRendererInteractionState {
         columnId: string;
     } | null;
     columnWidths: Record<string, number>;
-    onCellClick?: (rowIndex: number, colIndex: number, e: MouseEvent) => void;
-    onCellMouseDown?: (rowIndex: number, colIndex: number, e: MouseEvent) => void;
-    onCellDoubleClick?: (rowIndex: number, colIndex: number, rowId: RowId, columnId: string) => void;
-    onCellContextMenu?: (rowIndex: number, colIndex: number, e: MouseEvent) => void;
+    onCellClick?: (cellEvent: CellEvent) => void;
+    onCellMouseDown?: (cellEvent: CellEvent) => void;
+    onCellDoubleClick?: (cellEvent: CellEvent) => void;
+    onCellContextMenu?: (cellEvent: CellEvent) => void;
     onResizeStart?: (columnId: string, clientX: number, currentWidth: number) => void;
     onFillHandleMouseDown?: (e: MouseEvent) => void;
     rowSelectionMode?: 'single' | 'multiple' | 'none';
@@ -48,6 +48,8 @@ export declare class TableRenderer<T> {
     private _tbodyMousedownHandler;
     private _tbodyDblclickHandler;
     private _tbodyContextmenuHandler;
+    private _theadClickHandler;
+    private _theadMousedownHandler;
     private lastActiveCell;
     private lastSelectionRange;
     private lastCopyRange;
@@ -70,6 +72,9 @@ export declare class TableRenderer<T> {
     private getCellFromEvent;
     private attachBodyDelegation;
     private detachBodyDelegation;
+    /** Attach delegated event listeners to <thead> for sort clicks, resize, reorder, and filter icon clicks. */
+    private attachHeaderDelegation;
+    private detachHeaderDelegation;
     getWrapperElement(): HTMLDivElement | null;
     /** Full render — creates the table structure from scratch. */
     render(): void;
@@ -93,6 +98,8 @@ export declare class TableRenderer<T> {
     private renderBody;
     /** Get the table element (used by ColumnReorderState for header cell queries). */
     getTableElement(): HTMLTableElement | null;
+    /** Get the current onResizeStart handler from interaction state (avoids bracket notation access). */
+    getOnResizeStart(): ((columnId: string, clientX: number, currentWidth: number) => void) | undefined;
     /** Update the drop indicator position during column reorder. */
     updateDropIndicator(x: number | null, isDragging: boolean): void;
     destroy(): void;

package/dist/types/state/EventEmitter.d.ts

@@ -3,7 +3,7 @@ export declare class EventEmitter<TEvents extends Record<string, unknown> = Reco
     private handlers;
     on<K extends keyof TEvents>(event: K, handler: EventHandler<TEvents[K]>): void;
     off<K extends keyof TEvents>(event: K, handler: EventHandler<TEvents[K]>): void;
-    emit<K extends keyof TEvents>(event: K, data: TEvents[K]): void;
+    emit<K extends keyof TEvents>(event: K, ...args: TEvents[K] extends undefined ? [] : [TEvents[K]]): void;
     removeAllListeners(event?: keyof TEvents): void;
 }
 export {};

package/dist/types/state/FillHandleState.d.ts

@@ -42,7 +42,7 @@ export declare class FillHandleState<T> {
     startFillDrag(e: MouseEvent): void;
     private onMouseMove;
     private onMouseUp;
-    private applyFillValues;
+    private applyFillValuesFromCore;
     private resolveRange;
     private applyDragAttrs;
     private clearDragAttrs;

package/dist/types/state/GridState.d.ts

@@ -24,8 +24,12 @@ export declare class GridState<T> {
     private _onError?;
     private _onFirstDataRendered?;
     private _firstDataRendered;
+    private _rowHeight?;
+    private _ariaLabel?;
     private _filterOptions;
     private _columnOrder;
+    private _visibleColsCache;
+    private _visibleColsDirty;
     constructor(options: OGridOptions<T>);
     get data(): T[];
     get page(): number;
@@ -43,7 +47,9 @@ export declare class GridState<T> {
     get isServerSide(): boolean;
     get filterOptions(): Record<string, string[]>;
     get columnOrder(): string[];
-    /** Get the visible columns in display order (respects column reorder). */
+    get rowHeight(): number | undefined;
+    get ariaLabel(): string | undefined;
+    /** Get the visible columns in display order (respects column reorder). Memoized via dirty flag. */
     get visibleColumnDefs(): IColumnDef<T>[];
     /** Get processed (sorted, filtered, paginated) items for current page. */
     getProcessedItems(): {

package/dist/types/state/HeaderFilterState.d.ts

@@ -38,6 +38,8 @@ export declare class HeaderFilterState {
     } | null;
     setFilters(filters: IFilters): void;
     setFilterOptions(options: Record<string, string[]>): void;
+    /** Allow OGrid to update the popover element reference after rendering (for click-outside detection). */
+    setPopoverEl(el: HTMLElement | null): void;
     getFilterOptions(filterField: string): string[];
     getFilteredOptions(filterField: string): string[];
     hasActiveFilter(config: HeaderFilterConfig): boolean;

package/dist/types/types/gridTypes.d.ts

@@ -1,6 +1,19 @@
 import type { IColumnDef, IColumnGroupDef, ICellValueChangedEvent } from './columnTypes';
 import type { RowId, IFilters, IDataSource, RowSelectionMode, IRowSelectionChangeEvent, IOGridApi, ISideBarDef, IStatusBarProps, IVirtualScrollConfig } from '@alaarab/ogrid-core';
 export type { RowId, UserLike, UserLikeInput, FilterValue, IFilters, IFetchParams, IPageResult, IDataSource, IGridColumnState, RowSelectionMode, IRowSelectionChangeEvent, StatusBarPanel, IStatusBarProps, IActiveCell, ISelectionRange, SideBarPanelId, ISideBarDef, IVirtualScrollConfig, IOGridApi, } from '@alaarab/ogrid-core';
+/** Standardized cell event parameter for cell interaction callbacks. */
+export interface CellEvent {
+    /** Zero-based row index within the current page. */
+    rowIndex: number;
+    /** Zero-based column index among visible columns. */
+    colIndex: number;
+    /** The original DOM mouse event, when available. */
+    event?: MouseEvent;
+    /** Typed row identifier (string or number). Present for double-click events. */
+    rowId?: RowId;
+    /** Column identifier string. Present for double-click events. */
+    columnId?: string;
+}
 /** Extended API for the vanilla JS package (adds methods not in the core IOGridApi). */
 export interface IJsOGridApi<T> extends IOGridApi<T> {
     /** Export displayed rows to CSV and trigger a download. */
@@ -93,6 +106,8 @@ export interface OGridOptions<T> {
     pageSizeOptions?: number[];
     /** Initial column display order (array of column ids). */
     columnOrder?: string[];
+    /** Accessible label for the grid wrapper element. */
+    ariaLabel?: string;
     /** Callback fired when column order changes. */
     onColumnOrderChange?: (order: string[]) => void;
     /** Callback fired when a column is resized. */

package/dist/types/utils/getCellCoordinates.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Extracts row and column indices from a cell element's data attributes.
+ * Returns null if the element lacks the attributes or they are not valid numbers.
+ */
+export declare function getCellCoordinates(cell: Element): {
+    rowIndex: number;
+    colIndex: number;
+} | null;

package/dist/types/utils/index.d.ts

@@ -1 +1,2 @@
 export { debounce } from './debounce';
+export { getCellCoordinates } from './getCellCoordinates';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alaarab/ogrid-js",
-  "version": "2.0.22",
+  "version": "2.1.0",
   "description": "OGrid vanilla JS – framework-free data grid with sorting, filtering, pagination, and spreadsheet-style editing.",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",
@@ -36,10 +36,17 @@
     "node": ">=18"
   },
   "dependencies": {
-    "@alaarab/ogrid-core": "2.0.22"
+    "@alaarab/ogrid-core": "2.1.0"
   },
-  "sideEffects": false,
+  "sideEffects": ["**/*.css"],
   "publishConfig": {
     "access": "public"
-  }
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/alaarab/ogrid.git",
+    "directory": "packages/js"
+  },
+  "homepage": "https://ogrid.dev",
+  "bugs": "https://github.com/alaarab/ogrid/issues"
 }