@azrico/reactgrid 1.5.2 → 1.6.0

package/CHANGELOG.md

@@ -0,0 +1,10 @@
+# Changelog
+
+All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
+
+### 1.6.0 (2026-10-14)
+
+* Pass `filterValue`, `sortInfo` and `groupBy` to a `dataSource` function next to `skip`, `limit`, `cached_data` and `last_cache_info`, so header filters can drive a server-side search.
+* With `gridOptions.remoteFilter` / `remoteSort`, a filter or sort change invalidates the data cache and calls `dataSource` again. Local filtering and sorting still reuse the cached rows.
+* Export the typed `AzDataSourceParams` and `AzDataSourceFunc` for the `dataSource` and `details_dataSource` props.
+* Re-export `SelectFilter`, `NumberFilter`, `DateFilter` and `BoolFilter` for `column.filterEditor`.

package/dist/index.d.ts

@@ -1,5 +1,9 @@
 export * from './src/views/DataGrid';
 export * from './src/types/types';
 export { get_row_id, set_row_id, get_col_name, get_col_header } from './src/func/func_grid';
+export { default as SelectFilter } from '@inovua/reactdatagrid-enterprise/SelectFilter';
+export { default as NumberFilter } from '@inovua/reactdatagrid-enterprise/NumberFilter';
+export { default as DateFilter } from '@inovua/reactdatagrid-enterprise/DateFilter';
+export { default as BoolFilter } from '@inovua/reactdatagrid-enterprise/BoolFilter';
 import { AzGrid } from './src/views/DataGrid';
 export default AzGrid;

package/dist/index.js

@@ -7,8 +7,36 @@ var _exportNames = {
   get_row_id: true,
   set_row_id: true,
   get_col_name: true,
-  get_col_header: true
+  get_col_header: true,
+  SelectFilter: true,
+  NumberFilter: true,
+  DateFilter: true,
+  BoolFilter: true
 };
+Object.defineProperty(exports, "BoolFilter", {
+  enumerable: true,
+  get: function () {
+    return _BoolFilter.default;
+  }
+});
+Object.defineProperty(exports, "DateFilter", {
+  enumerable: true,
+  get: function () {
+    return _DateFilter.default;
+  }
+});
+Object.defineProperty(exports, "NumberFilter", {
+  enumerable: true,
+  get: function () {
+    return _NumberFilter.default;
+  }
+});
+Object.defineProperty(exports, "SelectFilter", {
+  enumerable: true,
+  get: function () {
+    return _SelectFilter.default;
+  }
+});
 exports.default = void 0;
 Object.defineProperty(exports, "get_col_header", {
   enumerable: true,
@@ -59,4 +87,10 @@ Object.keys(_types).forEach(function (key) {
   });
 });
 var _func_grid = require("./src/func/func_grid");
+var _SelectFilter = _interopRequireDefault(require("@inovua/reactdatagrid-enterprise/SelectFilter"));
+var _NumberFilter = _interopRequireDefault(require("@inovua/reactdatagrid-enterprise/NumberFilter"));
+var _DateFilter = _interopRequireDefault(require("@inovua/reactdatagrid-enterprise/DateFilter"));
+var _BoolFilter = _interopRequireDefault(require("@inovua/reactdatagrid-enterprise/BoolFilter"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// filter editors for column.filterEditor, so consumers don't import @inovua directly
 var _default = exports.default = _DataGrid.AzGrid;

package/dist/src/func/func_grid.d.ts

@@ -3,7 +3,10 @@ export type MakeWriteable<Type> = {
     -readonly [Key in keyof Type]: Type[Key];
 };
 export type ModifyFields<T, R> = Omit<T, keyof R> & R;
-export declare function ApplyDataSource(datasource: any, props: any): Promise<any>;
+export declare function ApplyDataSource(datasource: any, props: any, remote?: {
+    remoteFilter?: boolean;
+    remoteSort?: boolean;
+}): Promise<any>;
 /**
  * merges together all different props for columns
  * to build a single final column data array

package/dist/src/func/func_grid.js

@@ -25,13 +25,17 @@ const defaultColumnOptions = {
   lockable: false,
   editable: false
 };
-async function ApplyDataSource(datasource, props) {
+async function ApplyDataSource(datasource, props, remote = {}) {
   let result_data = undefined;
   let isUsingCache = false;
+  //filter/sort are only part of the key when they are sent to a remote dataSource,
+  //local filtering/sorting keeps reusing the cached rows
   const cacheInfo = {
     ds: datasource,
     skip: props.skip,
-    limit: props.limit
+    limit: props.limit,
+    filterValue: remote.remoteFilter ? props.filterValue : undefined,
+    sortInfo: remote.remoteSort ? props.sortInfo : undefined
   };
   //check if we can used cached data
   //if the datasource is changed since last render, we should invalidate cache
@@ -284,7 +288,10 @@ function get_default_key() {
 }
 //check if two cache objects are the same
 function validateCache(current, old, looseCheck = false) {
-  if (!old || !(0, _object.object_equals)(current, old)) return false;
+  //deep compare skip/limit/filterValue/sortInfo, array order matters (sort priority)
+  if (!old || !(0, _object.object_equals)(current, old, {
+    strictArrayCheck: true
+  })) return false;
   if (looseCheck) return true;
   if (current.ds != old.ds) return false;
   return true;

package/dist/src/hooks/useDatasource.js

@@ -8,14 +8,25 @@ var _react = _interopRequireDefault(require("react"));
 var _func_grid = require("../func/func_grid");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function useDataSource(ds, props) {
+  var _props$gridOptions, _props$gridOptions2;
   const cached_data = _react.default.useRef();
   const last_cache_info = _react.default.useRef();
+  // filter/sort only change the result when the grid sends them to the dataSource
+  const remoteFilter = !!(props !== null && props !== void 0 && (_props$gridOptions = props.gridOptions) !== null && _props$gridOptions !== void 0 && _props$gridOptions.remoteFilter);
+  const remoteSort = !!(props !== null && props !== void 0 && (_props$gridOptions2 = props.gridOptions) !== null && _props$gridOptions2 !== void 0 && _props$gridOptions2.remoteSort);
   return _react.default.useCallback(async dt => {
-    return await (0, _func_grid.ApplyDataSource)(ds, {
+    const params = {
       skip: dt === null || dt === void 0 ? void 0 : dt.skip,
       limit: dt === null || dt === void 0 ? void 0 : dt.limit,
+      filterValue: dt === null || dt === void 0 ? void 0 : dt.filterValue,
+      sortInfo: dt === null || dt === void 0 ? void 0 : dt.sortInfo,
+      groupBy: dt === null || dt === void 0 ? void 0 : dt.groupBy,
       cached_data: cached_data,
       last_cache_info: last_cache_info
+    };
+    return await (0, _func_grid.ApplyDataSource)(ds, params, {
+      remoteFilter,
+      remoteSort
     });
-  }, [ds]);
+  }, [ds, remoteFilter, remoteSort]);
 }

package/dist/src/types/types.d.ts

@@ -1,7 +1,7 @@
 import { ModifyFields } from '../func/func_grid';
 import { ConvertableToMenuItem } from '@azrico/controls/context-menu';
 import React from 'react';
-import { TypeCellSelection, TypeColumn, TypeDataGridProps, TypeDataSource, TypeEditInfo, TypeFilterTypes, TypeFilterValue, TypeRowDetailsInfo, TypeRowProps, TypeRowSelection, TypeComputedProps } from '@inovua/reactdatagrid-community/types';
+import { TypeCellSelection, TypeColumn, TypeDataGridProps, TypeDataSource, TypeEditInfo, TypeFilterTypes, TypeFilterValue, TypeRowDetailsInfo, TypeRowProps, TypeRowSelection, TypeComputedProps, TypeSortInfo, TypeGroupBy } from '@inovua/reactdatagrid-community/types';
 import { TypeOnSelectionChangeArg } from '@inovua/reactdatagrid-community/types/TypeDataGridProps';
 export type ColumnDefinition = TypeColumn;
 export type CellDefinition = any;
@@ -44,9 +44,21 @@ export type AzGridOptions = Partial<TypeDataGridProps> & {
         [key: string]: any;
     };
 };
+/** arguments passed to a dataSource function */
+export type AzDataSourceParams = {
+    skip?: number;
+    limit?: number;
+    /** current header filters, filter.value is an array of selected ids for a multi-select SelectFilter */
+    filterValue?: TypeFilterValue;
+    sortInfo?: TypeSortInfo;
+    groupBy?: TypeGroupBy;
+    cached_data: React.MutableRefObject<any>;
+    last_cache_info: React.MutableRefObject<any>;
+};
+export type AzDataSourceFunc = (args: AzDataSourceParams) => any[] | Promise<any[] | any>;
 export type AzGridProps = {
-    dataSource?: any[] | ((args: any) => any[] | Promise<any[] | any>);
-    details_dataSource?: any[] | ((args: any) => any[] | Promise<any[] | any>);
+    dataSource?: any[] | AzDataSourceFunc;
+    details_dataSource?: any[] | AzDataSourceFunc;
     details_columns?: LooseColumnDefinition[];
     details_filter?: FilterValues;
     licenseKey?: string;

package/index.ts

@@ -1,6 +1,11 @@
 export * from './src/views/DataGrid';
 export * from './src/types/types';
 export { get_row_id, set_row_id, get_col_name, get_col_header } from './src/func/func_grid';
+// filter editors for column.filterEditor, so consumers don't import @inovua directly
+export { default as SelectFilter } from '@inovua/reactdatagrid-enterprise/SelectFilter';
+export { default as NumberFilter } from '@inovua/reactdatagrid-enterprise/NumberFilter';
+export { default as DateFilter } from '@inovua/reactdatagrid-enterprise/DateFilter';
+export { default as BoolFilter } from '@inovua/reactdatagrid-enterprise/BoolFilter';
 
 import { AzGrid } from './src/views/DataGrid';
 export default AzGrid;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@azrico/reactgrid",
-	"version": "1.5.2",
+	"version": "1.6.0",
 	"main": "dist/index.js",
 	"description": "React Datagrid",
 	"author": "Azrideus <MehrdadTavangar@gmail.com>",

package/src/func/func_grid.ts

@@ -17,12 +17,24 @@ const defaultColumnOptions: ColumnDefinition = {
 	editable: false,
 };
 
-export async function ApplyDataSource(datasource, props) {
+export async function ApplyDataSource(
+	datasource,
+	props,
+	remote: { remoteFilter?: boolean; remoteSort?: boolean } = {}
+) {
 	let result_data: any = undefined;
 
 	let isUsingCache = false;
 
-	const cacheInfo = { ds: datasource, skip: props.skip, limit: props.limit };
+	//filter/sort are only part of the key when they are sent to a remote dataSource,
+	//local filtering/sorting keeps reusing the cached rows
+	const cacheInfo = {
+		ds: datasource,
+		skip: props.skip,
+		limit: props.limit,
+		filterValue: remote.remoteFilter ? props.filterValue : undefined,
+		sortInfo: remote.remoteSort ? props.sortInfo : undefined,
+	};
 	//check if we can used cached data
 	//if the datasource is changed since last render, we should invalidate cache
 	if (!validateCache(props.last_cache_info.current, cacheInfo, props.looseCacheCheck)) {
@@ -289,7 +301,8 @@ export function get_default_key() {
 
 //check if two cache objects are the same
 export function validateCache(current: any, old: any, looseCheck = false) {
-	if (!old || !object_equals(current, old)) return false;
+	//deep compare skip/limit/filterValue/sortInfo, array order matters (sort priority)
+	if (!old || !object_equals(current, old, { strictArrayCheck: true })) return false;
 
 	if (looseCheck) return true;
 

package/src/hooks/useDatasource.ts

@@ -1,25 +1,32 @@
-import React from 'react';
-import { AzGridProps, DataGridWrapperProps, GridType } from '../types/types';
-import {
-	applyColumnData,
-	ApplyDataSource,
-	find_realData,
-	get_row_id,
-} from '../func/func_grid';
-import { func_selection } from '../func/func_child';
-
-export function useDataSource(ds: any, props: AzGridProps) {
-	const cached_data = React.useRef<any>();
-	const last_cache_info = React.useRef<any>();
-	return React.useCallback(
-		async (dt) => {
-			return await ApplyDataSource(ds, {
-				skip: dt?.skip,
-				limit: dt?.limit,
-				cached_data: cached_data,
-				last_cache_info: last_cache_info,
-			});
-		},
-		[ds]
-	);
-}
+import React from 'react';
+import { AzDataSourceParams, AzGridProps, DataGridWrapperProps, GridType } from '../types/types';
+import {
+	applyColumnData,
+	ApplyDataSource,
+	find_realData,
+	get_row_id,
+} from '../func/func_grid';
+import { func_selection } from '../func/func_child';
+
+export function useDataSource(ds: any, props: AzGridProps) {
+	const cached_data = React.useRef<any>();
+	const last_cache_info = React.useRef<any>();
+	// filter/sort only change the result when the grid sends them to the dataSource
+	const remoteFilter = !!props?.gridOptions?.remoteFilter;
+	const remoteSort = !!props?.gridOptions?.remoteSort;
+	return React.useCallback(
+		async (dt) => {
+			const params: AzDataSourceParams = {
+				skip: dt?.skip,
+				limit: dt?.limit,
+				filterValue: dt?.filterValue,
+				sortInfo: dt?.sortInfo,
+				groupBy: dt?.groupBy,
+				cached_data: cached_data,
+				last_cache_info: last_cache_info,
+			};
+			return await ApplyDataSource(ds, params, { remoteFilter, remoteSort });
+		},
+		[ds, remoteFilter, remoteSort]
+	);
+}

package/src/types/types.ts

@@ -13,6 +13,8 @@ import {
 	TypeRowProps,
 	TypeRowSelection,
 	TypeComputedProps,
+	TypeSortInfo,
+	TypeGroupBy,
 } from '@inovua/reactdatagrid-community/types';
 
 import { TypeOnSelectionChangeArg } from '@inovua/reactdatagrid-community/types/TypeDataGridProps';
@@ -58,10 +60,22 @@ export type AzGridOptions = Partial<TypeDataGridProps> & {
 	/** extra DOM props for the header row */
 	headerProps?: { [key: string]: any };
 };
+/** arguments passed to a dataSource function */
+export type AzDataSourceParams = {
+	skip?: number;
+	limit?: number;
+	/** current header filters, filter.value is an array of selected ids for a multi-select SelectFilter */
+	filterValue?: TypeFilterValue;
+	sortInfo?: TypeSortInfo;
+	groupBy?: TypeGroupBy;
+	cached_data: React.MutableRefObject<any>;
+	last_cache_info: React.MutableRefObject<any>;
+};
+export type AzDataSourceFunc = (args: AzDataSourceParams) => any[] | Promise<any[] | any>;
 /* -------------------------------------------------------------------------- */
 export type AzGridProps = {
-	dataSource?: any[] | ((args: any) => any[] | Promise<any[] | any>);
-	details_dataSource?: any[] | ((args: any) => any[] | Promise<any[] | any>); //details is rendered under each row
+	dataSource?: any[] | AzDataSourceFunc;
+	details_dataSource?: any[] | AzDataSourceFunc; //details is rendered under each row
 	details_columns?: LooseColumnDefinition[];
 	details_filter?: FilterValues;