@alaarab/ogrid-react 2.4.2 → 2.5.1

package/dist/types/components/FormulaBar.d.ts

@@ -21,5 +21,7 @@ export interface FormulaBarProps {
     onCancel: () => void;
     /** Start editing the formula bar. */
     startEditing: () => void;
+    /** External ref for the input element (for cursor position tracking). */
+    inputRef?: React.RefObject<HTMLInputElement | null>;
 }
-export declare function FormulaBar({ cellRef, formulaText, isEditing, onInputChange, onCommit, onCancel, startEditing, }: FormulaBarProps): React.ReactElement;
+export declare function FormulaBar({ cellRef, formulaText, isEditing, onInputChange, onCommit, onCancel, startEditing, inputRef: externalInputRef, }: FormulaBarProps): React.ReactElement;

package/dist/types/components/FormulaRefOverlay.d.ts

@@ -5,7 +5,7 @@
  * Uses the same container measurement pattern as MarchingAntsOverlay.
  */
 import * as React from 'react';
-import { type FormulaReference } from '@alaarab/ogrid-core';
+import { type FormulaReference } from '@alaarab/ogrid-core/formula';
 export interface FormulaRefOverlayProps {
     /** Ref to the positioned container that wraps the table. */
     containerRef: React.RefObject<HTMLElement | null>;

package/dist/types/hooks/useDataGridInteraction.d.ts

@@ -57,6 +57,8 @@ export interface UseDataGridInteractionParams<T> {
     hasFormula?: (col: number, row: number) => boolean;
     /** Sets or clears a formula for a flat column + row. */
     setFormula?: (col: number, row: number, formula: string | null) => void;
+    /** Called when a cell is clicked during formula editing to insert a cell reference. */
+    onFormulaInsertReference?: (reference: string) => boolean;
 }
 export interface UseDataGridInteractionResult<T> {
     interaction: DataGridCellInteractionState;

package/dist/types/hooks/useDataGridLayout.d.ts

@@ -1,5 +1,6 @@
 import type { RefObject } from 'react';
 import type { RowId, IColumnDef } from '../types';
+import type { IResponsiveColumnsConfig } from '@alaarab/ogrid-core';
 import type { DataGridLayoutState, DataGridPinningState } from './useDataGridState';
 export interface UseDataGridLayoutParams<T> {
     columns: unknown[];
@@ -17,6 +18,7 @@ export interface UseDataGridLayoutParams<T> {
     sortBy?: string;
     sortDirection?: 'asc' | 'desc';
     onColumnSort?: (columnKey: string, direction?: 'asc' | 'desc' | null) => void;
+    responsiveColumns?: boolean | IResponsiveColumnsConfig;
     wrapperRef: RefObject<HTMLDivElement | null>;
 }
 export interface UseDataGridLayoutResult<T> {

package/dist/types/hooks/useFormulaBar.d.ts

@@ -3,7 +3,7 @@
  *
  * Manages the formula bar text, editing mode, and reference extraction.
  */
-import { type FormulaReference } from '@alaarab/ogrid-core';
+import { type FormulaReference } from '@alaarab/ogrid-core/formula';
 export interface UseFormulaBarParams {
     /** Active cell column index (0-based). */
     activeCol: number | null;
@@ -39,5 +39,13 @@ export interface UseFormulaBarResult {
     referencedCells: FormulaReference[];
     /** Whether the formula bar is actively being edited (for click-to-insert-ref guards). */
     isFormulaBarEditing: React.MutableRefObject<boolean>;
+    /**
+     * Insert a cell reference into the formula text at the current cursor position.
+     * Called by cell click handlers when the formula bar is in formula-edit mode.
+     * Returns true if the reference was inserted, false if not in formula-edit mode.
+     */
+    insertReference: (reference: string) => boolean;
+    /** Ref to the formula bar input element — set by the FormulaBar component for cursor tracking. */
+    inputRef: React.RefObject<HTMLInputElement | null>;
 }
 export declare function useFormulaBar(params: UseFormulaBarParams): UseFormulaBarResult;

package/dist/types/types/dataGridTypes.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from 'react';
 import type { IColumnDef, IColumnGroupDef, ICellValueChangedEvent } from './columnTypes';
-import type { IFormulaFunction, IRecalcResult, IGridDataAccessor, IAuditEntry, IAuditTrail } from '@alaarab/ogrid-core';
+import type { IFormulaFunction, IRecalcResult, IGridDataAccessor, IAuditEntry, IAuditTrail, IResponsiveColumnsConfig } from '@alaarab/ogrid-core';
 export type { RowId, UserLike, UserLikeInput, FilterValue, IFilters, IFetchParams, IPageResult, IDataSource, IGridColumnState, RowSelectionMode, IRowSelectionChangeEvent, StatusBarPanel, IStatusBarProps, IActiveCell, ISelectionRange, SideBarPanelId, ISideBarDef, ISheetDef, IVirtualScrollConfig, IColumnReorderConfig, IOGridApi, } from '@alaarab/ogrid-core';
 export { toUserLike, isInSelectionRange, normalizeSelectionRange } from '@alaarab/ogrid-core';
 import type { RowId, UserLike, IFilters, FilterValue, RowSelectionMode, IRowSelectionChangeEvent, IStatusBarProps, IDataSource, ISideBarDef, ISheetDef, IVirtualScrollConfig } from '@alaarab/ogrid-core';
@@ -77,6 +77,14 @@ interface IOGridBaseProps<T> {
     pageSizeOptions?: number[];
     /** Enable column reordering via drag-and-drop on header cells. Default: false. */
     columnReorder?: boolean;
+    /**
+     * Enable responsive column hiding. Columns with `responsivePriority` are
+     * auto-hidden when the container narrows below breakpoint thresholds.
+     * - `true`: use default breakpoints (576/768/992/1200px)
+     * - `IResponsiveColumnsConfig`: custom breakpoints
+     * - `false` / omitted: disabled
+     */
+    responsiveColumns?: boolean | IResponsiveColumnsConfig;
     /** Virtual scrolling configuration. When provided, only visible rows are rendered for large datasets. */
     virtualScroll?: IVirtualScrollConfig;
     /** Fixed row height in pixels. Overrides default row height (36px). */
@@ -206,6 +214,8 @@ export interface IOGridDataGridProps<T> {
     };
     /** Enable column reordering via drag-and-drop on header cells. Default: false. */
     columnReorder?: boolean;
+    /** Responsive column hiding config (passed from IOGridBaseProps). */
+    responsiveColumns?: boolean | IResponsiveColumnsConfig;
     /** Virtual scrolling configuration. When provided, only visible rows are rendered for large datasets. */
     virtualScroll?: IVirtualScrollConfig;
     /** Fixed row height in pixels. Overrides default row height (36px). */
@@ -240,4 +250,9 @@ export interface IOGridDataGridProps<T> {
     formulaVersion?: number;
     /** Cell references to highlight (from active formula in formula bar). */
     formulaReferences?: import('@alaarab/ogrid-core').FormulaReference[];
+    /**
+     * Called when a cell is clicked during formula editing to insert a cell reference.
+     * Accepts a cell reference string (e.g. "A1") and returns true if the reference was inserted.
+     */
+    onFormulaInsertReference?: (reference: string) => boolean;
 }

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

@@ -59,7 +59,7 @@ export declare function getCellInteractionProps(descriptor: CellRenderDescriptor
     role?: "button" | undefined;
     onDoubleClick?: (() => void) | undefined;
     tabIndex: number;
-    onMouseDown: (e: React.MouseEvent) => void;
+    onPointerDown: (e: React.PointerEvent) => void;
     onClick: () => void;
     onContextMenu: (e: React.MouseEvent) => void;
     'data-in-range'?: "true" | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alaarab/ogrid-react",
-  "version": "2.4.2",
+  "version": "2.5.1",
   "description": "OGrid React – React hooks, headless components, and utilities for OGrid data grids.",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",
@@ -39,7 +39,7 @@
     "node": ">=18"
   },
   "dependencies": {
-    "@alaarab/ogrid-core": "2.4.2",
+    "@alaarab/ogrid-core": "2.5.1",
     "@tanstack/react-virtual": "^3.0.0"
   },
   "peerDependencies": {