@infinite-table/infinite-react 4.1.1 → 4.2.1-canary.0

package/index.d.ts

@@ -2046,6 +2046,10 @@ interface DataSourceApi<T> {
 }
 declare type DataSourcePropRowInfoReducers<T> = Record<string, DataSourceRowInfoReducer<T>>;
 declare type DataSourceRowInfoReducer<T> = DataSourceRawReducer<InfiniteTableRowInfo<T>, any>;
+declare type DataSourcePropShouldReloadDataObject<T> = {
+    [key in keyof Pick<DataSourceDataParams<T>, 'sortInfo' | 'pivotBy' | 'groupBy' | 'filterValue'>]: boolean;
+};
+declare type DataSourcePropShouldReloadData<T> = DataSourcePropShouldReloadDataObject<T>;
 declare type DataSourceProps<T> = {
     debugId?: string;
     children: React$1.ReactNode | ((contextData: DataSourceState<T>) => React$1.ReactNode);
@@ -2100,9 +2104,19 @@ declare type DataSourceProps<T> = {
     livePaginationCursor?: DataSourcePropLivePaginationCursor<T>;
     onLivePaginationCursorChange?: (livePaginationCursor: DataSourceLivePaginationCursorValue) => void;
     filterFunction?: DataSourcePropFilterFunction<T>;
+    /**
+     * @deprecated Use shouldReloadData.sortInfo instead
+     */
     sortMode?: 'local' | 'remote';
+    /**
+     * @deprecated Use shouldReloadData.filterValue instead
+     */
     filterMode?: 'local' | 'remote';
+    /**
+     * @deprecated Use shouldReloadData.groupBy instead
+     */
     groupMode?: 'local' | 'remote';
+    shouldReloadData?: DataSourcePropShouldReloadData<T>;
     filterValue?: DataSourcePropFilterValue<T>;
     defaultFilterValue?: DataSourcePropFilterValue<T>;
     onFilterValueChange?: (filterValue: DataSourcePropFilterValue<T>) => void;
@@ -2199,9 +2213,11 @@ interface DataSourceState<T> extends DataSourceSetupState<T>, DataSourceDerivedS
 declare type DataSourceDerivedState<T> = {
     toPrimaryKey: (data: T) => any;
     operatorsByFilterType: Record<string, Record<string, DataSourceFilterOperator<T>>>;
-    sortMode: NonUndefined<DataSourceProps<T>['sortMode']>;
-    filterMode: NonUndefined<DataSourceProps<T>['filterMode']>;
-    groupMode: NonUndefined<DataSourceProps<T>['groupMode']>;
+    sortMode: 'local' | 'remote';
+    filterMode: 'local' | 'remote';
+    groupMode: 'local' | 'remote';
+    pivotMode: 'local' | 'remote';
+    shouldReloadData: NonUndefined<Required<DataSourcePropShouldReloadData<T>>>;
     groupRowsState: GroupRowsState<T>;
     multiSort: boolean;
     controlledSort: boolean;
@@ -3334,4 +3350,4 @@ declare const components: {
     NumberFilterEditor: typeof NumberFilterEditor;
 };
 
-export { AdvancedAlignable, CellSelectionState, CellSelectionStateObject, ColumnTypeWithInherit, DataSource, DataSourceAction, DataSourceActionType, DataSourceAggregationReducer, DataSourceApi, DataSourceCRUDParam, DataSourceComponentActions, DataSourceContextValue, DataSourceData, DataSourceDataParams, DataSourceDataParamsChanges, DataSourceDerivedState, DataSourceFilterFunctionParam, DataSourceFilterOperator, DataSourceFilterOperatorFunction, DataSourceFilterOperatorFunctionParam, DataSourceFilterType, DataSourceFilterValueItem, DataSourceFilterValueItemValueGetter, DataSourceGroupBy, DataSourceGroupRowsList, DataSourceInsertParam, DataSourceLivePaginationCursorFn, DataSourceLivePaginationCursorParams, DataSourceLivePaginationCursorValue, DataSourceMappedState, DataSourceMappings, DataSourceMasterDetailContextValue, DataSourcePivotBy, DataSourcePropAggregationReducers, DataSourcePropCellSelection, DataSourcePropCellSelection_MultiCell, DataSourcePropCellSelection_SingleCell, DataSourcePropFilterFunction, DataSourcePropFilterTypes, DataSourcePropFilterValue, DataSourcePropGroupBy, DataSourcePropGroupRowsStateObject, DataSourcePropIsRowSelected, DataSourcePropLivePaginationCursor, DataSourcePropMultiRowSelectionChangeParamType, DataSourcePropOnCellSelectionChange, DataSourcePropOnCellSelectionChange_MultiCell, DataSourcePropOnCellSelectionChange_SingleCell, DataSourcePropOnRowSelectionChange, DataSourcePropOnRowSelectionChange_MultiRow, DataSourcePropOnRowSelectionChange_SingleRow, DataSourcePropPivotBy, DataSourcePropRowInfoReducers, DataSourcePropRowSelection, DataSourcePropRowSelection_MultiRow, DataSourcePropRowSelection_SingleRow, DataSourcePropSelectionMode, DataSourcePropSortFn, DataSourcePropSortInfo, DataSourcePropSortTypes, DataSourceProps, DataSourceRawReducer, DataSourceRemoteData, DataSourceRowInfoReducer, DataSourceSetupState, DataSourceSingleSortInfo, DataSourceSortInfo, DataSourceState, DebugLogger, DeepMap, ElementContainerGetter, FixedSizeSet, GroupRowsState, InfiniteColumnEditorContextType, InfiniteTable, InfiniteTableAction, InfiniteTableActionType, InfiniteTableApi, InfiniteTableClassName, InfiniteTableColumn, InfiniteTableColumnAggregator, InfiniteTableColumnApi, InfiniteTableColumnCellContextType, InfiniteTableColumnComparer, InfiniteTableColumnGroup, InfiniteTableColumnRenderFunctionForGroupRows, InfiniteTableColumnRenderFunctionForNormalRows, InfiniteTableColumnRenderValueParam, InfiniteTableColumnRowspanParam, InfiniteTableColumnSizingOptions, InfiniteTableColumnValueFormatterParams, InfiniteTableColumnValueGetterParams, InfiniteTableComponent, InfiniteTableComputedColumn, InfiniteTableComputedValues, InfiniteTableContextValue, InfiniteTableGroupColumnBase, InfiniteTableGroupColumnFunction, InfiniteTableGroupColumnGetterOptions, InfiniteTablePivotColumn, InfiniteTablePropAutoSizeColumnsKey, InfiniteTablePropColumnGroups, InfiniteTablePropColumnOrder, InfiniteTablePropColumnPinning, InfiniteTablePropColumnSizing, InfiniteTablePropColumnTypes, InfiniteTablePropColumnVisibility, InfiniteTablePropColumns, InfiniteTablePropComponents, InfiniteTablePropGetCellContextMenuItems, InfiniteTablePropGetColumnMenuItems, InfiniteTablePropGroupColumn, InfiniteTablePropGroupRenderStrategy, InfiniteTablePropHeaderOptions, InfiniteTablePropKeyboardNavigation, InfiniteTablePropKeyboardShorcut, InfiniteTablePropMultiSortBehavior, InfiniteTablePropRowClassName, InfiniteTablePropRowStyle, InfiniteTableProps, InfiniteTableRowClassNameFn, InfiniteTableRowInfo, InfiniteTableRowStyleFn, InfiniteTableState, InfiniteTable_HasGrouping_RowInfoGroup, InfiniteTable_HasGrouping_RowInfoNormal, LazyGroupDataDeepMap, LazyGroupDataItem, LazyRowInfoGroup, Menu, MenuChildrenFnParam, MenuColumn, MenuColumnRenderParam, MenuDecoration, MenuIconProps, MenuItemActionContext, MenuItemDefinition, MenuItemObject, MenuProps, MenuRenderable, MenuRuntimeItem, MenuRuntimeItemSelectable, MenuSeparator, OverlayShowParams, RowDetailCache, RowDetailState, RowDetailStateObject, RowSelectionState, Scrollbars, ShowOverlayFn, WeakFixedSizeSet, components, debounce, debug, defaultFilterTypes, eventMatchesKeyboardShortcut, defaultFilterTypes as filterTypes, flatten, getComponentStateRoot, group, interceptMap, keyboardShortcuts, multisort, useComponentState, useDataSource, useEffectWithChanges, useEffectWithObject, useGridScroll, useInfiniteColumnCell, useInfiniteColumnEditor, useInfiniteColumnFilterEditor, useInfiniteHeaderCell, useMasterRowInfo, useOverlay, useOverlayPortal, useRowInfoReducers, useVisibleColumnSizes };
+export { AdvancedAlignable, CellSelectionState, CellSelectionStateObject, ColumnTypeWithInherit, DataSource, DataSourceAction, DataSourceActionType, DataSourceAggregationReducer, DataSourceApi, DataSourceCRUDParam, DataSourceComponentActions, DataSourceContextValue, DataSourceData, DataSourceDataParams, DataSourceDataParamsChanges, DataSourceDerivedState, DataSourceFilterFunctionParam, DataSourceFilterOperator, DataSourceFilterOperatorFunction, DataSourceFilterOperatorFunctionParam, DataSourceFilterType, DataSourceFilterValueItem, DataSourceFilterValueItemValueGetter, DataSourceGroupBy, DataSourceGroupRowsList, DataSourceInsertParam, DataSourceLivePaginationCursorFn, DataSourceLivePaginationCursorParams, DataSourceLivePaginationCursorValue, DataSourceMappedState, DataSourceMappings, DataSourceMasterDetailContextValue, DataSourcePivotBy, DataSourcePropAggregationReducers, DataSourcePropCellSelection, DataSourcePropCellSelection_MultiCell, DataSourcePropCellSelection_SingleCell, DataSourcePropFilterFunction, DataSourcePropFilterTypes, DataSourcePropFilterValue, DataSourcePropGroupBy, DataSourcePropGroupRowsStateObject, DataSourcePropIsRowSelected, DataSourcePropLivePaginationCursor, DataSourcePropMultiRowSelectionChangeParamType, DataSourcePropOnCellSelectionChange, DataSourcePropOnCellSelectionChange_MultiCell, DataSourcePropOnCellSelectionChange_SingleCell, DataSourcePropOnRowSelectionChange, DataSourcePropOnRowSelectionChange_MultiRow, DataSourcePropOnRowSelectionChange_SingleRow, DataSourcePropPivotBy, DataSourcePropRowInfoReducers, DataSourcePropRowSelection, DataSourcePropRowSelection_MultiRow, DataSourcePropRowSelection_SingleRow, DataSourcePropSelectionMode, DataSourcePropShouldReloadData, DataSourcePropShouldReloadDataObject, DataSourcePropSortFn, DataSourcePropSortInfo, DataSourcePropSortTypes, DataSourceProps, DataSourceRawReducer, DataSourceRemoteData, DataSourceRowInfoReducer, DataSourceSetupState, DataSourceSingleSortInfo, DataSourceSortInfo, DataSourceState, DebugLogger, DeepMap, ElementContainerGetter, FixedSizeSet, GroupRowsState, InfiniteColumnEditorContextType, InfiniteTable, InfiniteTableAction, InfiniteTableActionType, InfiniteTableApi, InfiniteTableClassName, InfiniteTableColumn, InfiniteTableColumnAggregator, InfiniteTableColumnApi, InfiniteTableColumnCellContextType, InfiniteTableColumnComparer, InfiniteTableColumnGroup, InfiniteTableColumnRenderFunctionForGroupRows, InfiniteTableColumnRenderFunctionForNormalRows, InfiniteTableColumnRenderValueParam, InfiniteTableColumnRowspanParam, InfiniteTableColumnSizingOptions, InfiniteTableColumnValueFormatterParams, InfiniteTableColumnValueGetterParams, InfiniteTableComponent, InfiniteTableComputedColumn, InfiniteTableComputedValues, InfiniteTableContextValue, InfiniteTableGroupColumnBase, InfiniteTableGroupColumnFunction, InfiniteTableGroupColumnGetterOptions, InfiniteTablePivotColumn, InfiniteTablePropAutoSizeColumnsKey, InfiniteTablePropColumnGroups, InfiniteTablePropColumnOrder, InfiniteTablePropColumnPinning, InfiniteTablePropColumnSizing, InfiniteTablePropColumnTypes, InfiniteTablePropColumnVisibility, InfiniteTablePropColumns, InfiniteTablePropComponents, InfiniteTablePropGetCellContextMenuItems, InfiniteTablePropGetColumnMenuItems, InfiniteTablePropGroupColumn, InfiniteTablePropGroupRenderStrategy, InfiniteTablePropHeaderOptions, InfiniteTablePropKeyboardNavigation, InfiniteTablePropKeyboardShorcut, InfiniteTablePropMultiSortBehavior, InfiniteTablePropRowClassName, InfiniteTablePropRowStyle, InfiniteTableProps, InfiniteTableRowClassNameFn, InfiniteTableRowInfo, InfiniteTableRowStyleFn, InfiniteTableState, InfiniteTable_HasGrouping_RowInfoGroup, InfiniteTable_HasGrouping_RowInfoNormal, LazyGroupDataDeepMap, LazyGroupDataItem, LazyRowInfoGroup, Menu, MenuChildrenFnParam, MenuColumn, MenuColumnRenderParam, MenuDecoration, MenuIconProps, MenuItemActionContext, MenuItemDefinition, MenuItemObject, MenuProps, MenuRenderable, MenuRuntimeItem, MenuRuntimeItemSelectable, MenuSeparator, OverlayShowParams, RowDetailCache, RowDetailState, RowDetailStateObject, RowSelectionState, Scrollbars, ShowOverlayFn, WeakFixedSizeSet, components, debounce, debug, defaultFilterTypes, eventMatchesKeyboardShortcut, defaultFilterTypes as filterTypes, flatten, getComponentStateRoot, group, interceptMap, keyboardShortcuts, multisort, useComponentState, useDataSource, useEffectWithChanges, useEffectWithObject, useGridScroll, useInfiniteColumnCell, useInfiniteColumnEditor, useInfiniteColumnFilterEditor, useInfiniteHeaderCell, useMasterRowInfo, useOverlay, useOverlayPortal, useRowInfoReducers, useVisibleColumnSizes };

package/index.dev.js

@@ -851,7 +851,7 @@ function debugPackage(channelName) {
     let lastMessageTimestamp = 0;
     const isEnabled = () => enabled != null ? enabled : isLoggingEnabled(channel, storageKeyValue);
     const color = getNextColor(debug.colors);
-    const logger = Object.defineProperties(
+    const logger2 = Object.defineProperties(
       (...args) => {
         if (isLoggingEnabled(channel, storageKeyValue)) {
           const now = Date.now();
@@ -928,8 +928,8 @@ function debugPackage(channelName) {
         }
       }
     );
-    loggers.set(channelParts, logger);
-    return logger;
+    loggers.set(channelParts, logger2);
+    return logger2;
   }
   return debugFactory(channelName);
 }
@@ -4504,7 +4504,6 @@ var notifyChange = (props, callbackPropName, values) => {
     callbackProp(...values);
   }
 };
-var debug3 = dbg("rerender");
 var ComponentContext;
 function getComponentStateContext() {
   if (ComponentContext) {
@@ -4753,7 +4752,8 @@ function getComponentStateRoot(config) {
         }
       });
       if (updatedPropsToStateCount > 0 || newMappedStateCount > 0) {
-        debug3(
+        const logger2 = config.debugName ? dbg(`${config.debugName}:rerender`) : dbg("rerender");
+        logger2(
           "Triggered by new values for the following props",
           ...[
             ...Object.keys(newMappedState != null ? newMappedState : {}),
@@ -12188,7 +12188,7 @@ function getRowSelectionApi(param) {
 }
 
 // src/components/DataSource/CellSelectionState.ts
-var debug4 = dbg("CellSelectionState");
+var debug3 = dbg("CellSelectionState");
 var WILDCARD = "*";
 var CellSelectionState = class {
   constructor(clone) {
@@ -12449,7 +12449,7 @@ var CellSelectionState = class {
       console.error(
         `CellSelectionState.isCellSelected should not be called with wildcard`
       );
-      debug4(
+      debug3(
         `CellSelectionState.isCellSelected should not be called with wildcard`
       );
       return false;
@@ -13779,8 +13779,7 @@ function useLoadData() {
     notifyScrollbarsChange,
     refetchKey,
     sortInfo,
-    sortMode,
-    groupMode,
+    shouldReloadData,
     groupBy,
     pivotBy,
     filterValue,
@@ -13851,11 +13850,12 @@ function useLoadData() {
     });
   }, [filterValue, filterMode, filterTypes]);
   const depsObject = {
-    sortInfo: sortMode === "remote" ? sortInfo : null,
-    groupBy: groupMode === "remote" ? groupBy : null,
-    pivotBy,
+    // #sortMode_vs_shouldReloadData.sortInfo
+    sortInfo: shouldReloadData.sortInfo ? sortInfo : null,
+    groupBy: shouldReloadData.groupBy ? groupBy : null,
+    pivotBy: shouldReloadData.pivotBy ? pivotBy : null,
     refetchKey,
-    filterValue: computedFilterValue,
+    filterValue: shouldReloadData.filterValue ? computedFilterValue : null,
     cursorId: livePagination ? stateCursorId : null
   };
   const initialRef = (0, import_react35.useRef)(true);
@@ -14095,6 +14095,36 @@ function lazyLoadRange(options, cache) {
   }, initialPromise);
 }
 
+// src/utils/logger.ts
+var log = debug("InfiniteTable");
+var COLOR_WARN_VALUE = `#eb9316`;
+var warnChannel = "Warn";
+var errorChannel = "Error";
+var infoChannel = "Info";
+var successChannel = "Success";
+var logChannel = "Logs";
+var logger = log.extend(logChannel);
+var infoLogger = logger.extend(infoChannel);
+var warnLogger = logger.extend(warnChannel);
+var errorLogger = logger.extend(errorChannel);
+var successLogger = logger.extend(successChannel);
+var logColorWarn = COLOR_WARN_VALUE;
+var warn = (message, logger2) => {
+  logger2 = logger2 ? logger2.extend(warnChannel) : warnLogger;
+  logger2(log.color(logColorWarn, message));
+};
+var doOnceFlags = new DeepMap();
+var doOnce = (func, ...keys) => {
+  if (doOnceFlags.has(keys)) {
+    return;
+  }
+  doOnceFlags.set(keys, true);
+  func();
+};
+var warnOnce = (message, key = message, logger2) => {
+  doOnce(() => warn(message, logger2), key, "warn");
+};
+
 // src/components/utils/discardCallsWithEqualArg.ts
 var map = /* @__PURE__ */ new WeakMap();
 var getCompareDefault = (a) => a;
@@ -14205,6 +14235,7 @@ var normalizeSortInfo = (initialSortInfo, weakMap3) => {
 };
 
 // src/components/DataSource/state/getInitialState.ts
+var DataSourceLogger = dbg("DataSource");
 var defaultCursorId = Symbol("cursorId");
 function initSetupState() {
   const now = Date.now();
@@ -14335,7 +14366,7 @@ function getLivePaginationCursorValue(livePaginationCursorProp, state) {
 }
 var weakMap = /* @__PURE__ */ new WeakMap();
 function deriveStateFromProps(params) {
-  var _a, _b, _c, _d;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
   const { props, state, oldState } = params;
   const controlledSort = isControlledValue(props.sortInfo);
   const controlledFilter = isControlledValue(props.filterValue);
@@ -14424,18 +14455,61 @@ function deriveStateFromProps(params) {
       collapsedRows: []
     }
   );
+  const { shouldReloadData = {} } = props;
+  const propsGroupMode = (_b = props.groupMode) != null ? _b : shouldReloadData.groupBy != null ? shouldReloadData.groupBy ? "remote" : "local" : void 0;
+  const propsSortMode = ((_c = props.sortMode) != null ? _c : shouldReloadData.sortInfo != null) ? shouldReloadData.sortInfo ? "remote" : "local" : void 0;
+  const propsFilterMode = ((_d = props.filterMode) != null ? _d : shouldReloadData.filterValue != null) ? shouldReloadData.filterValue ? "remote" : "local" : void 0;
+  if (props.groupMode) {
+    warnOnce(
+      `"groupMode" prop is deprecated for the <DataSource />, use "shouldReloadData.groupBy: true|false" instead`,
+      "groupMode deprecated",
+      DataSourceLogger
+    );
+  }
+  if (props.sortMode) {
+    warnOnce(
+      `"sortMode" prop is deprecated for the <DataSource />, use "shouldReloadData.sortInfo: true|false" instead`,
+      "sortMode deprecated",
+      DataSourceLogger
+    );
+  }
+  if (props.filterMode) {
+    warnOnce(
+      `"filterMode" prop is deprecated for the <DataSource />, use "shouldReloadData.filterValue: true|false" instead`,
+      "filterMode deprecated",
+      DataSourceLogger
+    );
+  }
+  const groupMode = typeof props.data === "function" ? propsGroupMode != null ? propsGroupMode : "local" : "local";
+  const sortMode = props.sortFunction ? "local" : propsSortMode != null ? propsSortMode : controlledSort ? "remote" : "local";
+  const filterMode = typeof props.filterFunction === "function" ? "local" : propsFilterMode != null ? propsFilterMode : typeof props.data === "function" ? "remote" : "local";
+  const pivotMode = shouldReloadData.pivotBy ? "remote" : "local";
   const result = {
     selectionMode,
     groupRowsState,
+    shouldReloadData: {
+      // #sortMode_vs_shouldReloadData.sortInfo
+      // we reconstruct this object
+      // and don't default to the computed filterMode, sortMode, groupMode and pivotMode
+      // as computed above
+      // since we want a subtle difference between the computed sortMode and shouldReloadData.sortInfo (for example)
+      // difference: sortMode will be local when sortFunction is provided, however, the user may want to reload data when sortInfo changes
+      // and thus the data will be refetched, but will be sorted locally
+      filterValue: (_f = (_e = props.shouldReloadData) == null ? void 0 : _e.filterValue) != null ? _f : filterMode === "remote",
+      sortInfo: (_h = (_g = props.shouldReloadData) == null ? void 0 : _g.sortInfo) != null ? _h : sortMode === "remote",
+      groupBy: (_j = (_i = props.shouldReloadData) == null ? void 0 : _i.groupBy) != null ? _j : groupMode === "remote",
+      pivotBy: (_l = (_k = props.shouldReloadData) == null ? void 0 : _k.pivotBy) != null ? _l : pivotMode === "remote"
+    },
     rowSelection: rowSelectionState,
     cellSelection: cellSelectionState,
+    groupMode,
+    sortMode,
+    filterMode,
+    pivotMode,
     toPrimaryKey,
     operatorsByFilterType,
     controlledSort,
     controlledFilter,
-    groupMode: typeof props.data === "function" ? (_b = props.groupMode) != null ? _b : "local" : "local",
-    sortMode: props.sortFunction ? "local" : (_c = props.sortMode) != null ? _c : controlledSort ? "remote" : "local",
-    filterMode: typeof props.filterFunction === "function" ? "local" : (_d = props.filterMode) != null ? _d : typeof props.data === "function" ? "remote" : "local",
     multiSort: Array.isArray(
       controlledSort ? props.sortInfo : props.defaultSortInfo
     ),
@@ -14971,6 +15045,7 @@ function DataSourceWithContext(props) {
   return /* @__PURE__ */ React50.createElement(React50.Fragment, null, children);
 }
 var DataSourceRoot = getComponentStateRoot({
+  debugName: "DataSource",
   //@ts-ignore
   initSetupState,
   //@ts-ignore
@@ -17070,13 +17145,13 @@ function useColumnRowspan(computedVisibleColumns) {
 
 // src/components/InfiniteTable/hooks/useColumnSizeFn.ts
 var import_react42 = require("react");
-var debug5 = dbg("useColumnSizeFn");
+var debug4 = dbg("useColumnSizeFn");
 function useColumnSizeFn(columns) {
   const columnSize = (0, import_react42.useCallback)(
     (index) => {
       const column = columns[index];
       if (false) {
-        debug5("cannot find column at index", index, columns);
+        debug4("cannot find column at index", index, columns);
       }
       return column ? column.computedWidth : 0;
     },
@@ -18636,7 +18711,7 @@ var useLicense = (licenseKey = "") => {
     }
     let valid2 = isValidLicense(licenseKey, {
       publishedAt: 1624970570587,
-      version: "4.1.1"
+      version: "4.2.1-canary.0"
     });
     if (!licenseKey && !valid2 && isInsidePlayground) {
       return true;

package/index.dev.mjs

@@ -799,7 +799,7 @@ function debugPackage(channelName) {
     let lastMessageTimestamp = 0;
     const isEnabled = () => enabled != null ? enabled : isLoggingEnabled(channel, storageKeyValue);
     const color = getNextColor(debug.colors);
-    const logger = Object.defineProperties(
+    const logger2 = Object.defineProperties(
       (...args) => {
         if (isLoggingEnabled(channel, storageKeyValue)) {
           const now = Date.now();
@@ -876,8 +876,8 @@ function debugPackage(channelName) {
         }
       }
     );
-    loggers.set(channelParts, logger);
-    return logger;
+    loggers.set(channelParts, logger2);
+    return logger2;
   }
   return debugFactory(channelName);
 }
@@ -4471,7 +4471,6 @@ var notifyChange = (props, callbackPropName, values) => {
     callbackProp(...values);
   }
 };
-var debug3 = dbg("rerender");
 var ComponentContext;
 function getComponentStateContext() {
   if (ComponentContext) {
@@ -4720,7 +4719,8 @@ function getComponentStateRoot(config) {
         }
       });
       if (updatedPropsToStateCount > 0 || newMappedStateCount > 0) {
-        debug3(
+        const logger2 = config.debugName ? dbg(`${config.debugName}:rerender`) : dbg("rerender");
+        logger2(
           "Triggered by new values for the following props",
           ...[
             ...Object.keys(newMappedState != null ? newMappedState : {}),
@@ -12155,7 +12155,7 @@ function getRowSelectionApi(param) {
 }
 
 // src/components/DataSource/CellSelectionState.ts
-var debug4 = dbg("CellSelectionState");
+var debug3 = dbg("CellSelectionState");
 var WILDCARD = "*";
 var CellSelectionState = class {
   constructor(clone) {
@@ -12416,7 +12416,7 @@ var CellSelectionState = class {
       console.error(
         `CellSelectionState.isCellSelected should not be called with wildcard`
       );
-      debug4(
+      debug3(
         `CellSelectionState.isCellSelected should not be called with wildcard`
       );
       return false;
@@ -13746,8 +13746,7 @@ function useLoadData() {
     notifyScrollbarsChange,
     refetchKey,
     sortInfo,
-    sortMode,
-    groupMode,
+    shouldReloadData,
     groupBy,
     pivotBy,
     filterValue,
@@ -13818,11 +13817,12 @@ function useLoadData() {
     });
   }, [filterValue, filterMode, filterTypes]);
   const depsObject = {
-    sortInfo: sortMode === "remote" ? sortInfo : null,
-    groupBy: groupMode === "remote" ? groupBy : null,
-    pivotBy,
+    // #sortMode_vs_shouldReloadData.sortInfo
+    sortInfo: shouldReloadData.sortInfo ? sortInfo : null,
+    groupBy: shouldReloadData.groupBy ? groupBy : null,
+    pivotBy: shouldReloadData.pivotBy ? pivotBy : null,
     refetchKey,
-    filterValue: computedFilterValue,
+    filterValue: shouldReloadData.filterValue ? computedFilterValue : null,
     cursorId: livePagination ? stateCursorId : null
   };
   const initialRef = useRef21(true);
@@ -14062,6 +14062,36 @@ function lazyLoadRange(options, cache) {
   }, initialPromise);
 }
 
+// src/utils/logger.ts
+var log = debug("InfiniteTable");
+var COLOR_WARN_VALUE = `#eb9316`;
+var warnChannel = "Warn";
+var errorChannel = "Error";
+var infoChannel = "Info";
+var successChannel = "Success";
+var logChannel = "Logs";
+var logger = log.extend(logChannel);
+var infoLogger = logger.extend(infoChannel);
+var warnLogger = logger.extend(warnChannel);
+var errorLogger = logger.extend(errorChannel);
+var successLogger = logger.extend(successChannel);
+var logColorWarn = COLOR_WARN_VALUE;
+var warn = (message, logger2) => {
+  logger2 = logger2 ? logger2.extend(warnChannel) : warnLogger;
+  logger2(log.color(logColorWarn, message));
+};
+var doOnceFlags = new DeepMap();
+var doOnce = (func, ...keys) => {
+  if (doOnceFlags.has(keys)) {
+    return;
+  }
+  doOnceFlags.set(keys, true);
+  func();
+};
+var warnOnce = (message, key = message, logger2) => {
+  doOnce(() => warn(message, logger2), key, "warn");
+};
+
 // src/components/utils/discardCallsWithEqualArg.ts
 var map = /* @__PURE__ */ new WeakMap();
 var getCompareDefault = (a) => a;
@@ -14172,6 +14202,7 @@ var normalizeSortInfo = (initialSortInfo, weakMap3) => {
 };
 
 // src/components/DataSource/state/getInitialState.ts
+var DataSourceLogger = dbg("DataSource");
 var defaultCursorId = Symbol("cursorId");
 function initSetupState() {
   const now = Date.now();
@@ -14302,7 +14333,7 @@ function getLivePaginationCursorValue(livePaginationCursorProp, state) {
 }
 var weakMap = /* @__PURE__ */ new WeakMap();
 function deriveStateFromProps(params) {
-  var _a, _b, _c, _d;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
   const { props, state, oldState } = params;
   const controlledSort = isControlledValue(props.sortInfo);
   const controlledFilter = isControlledValue(props.filterValue);
@@ -14391,18 +14422,61 @@ function deriveStateFromProps(params) {
       collapsedRows: []
     }
   );
+  const { shouldReloadData = {} } = props;
+  const propsGroupMode = (_b = props.groupMode) != null ? _b : shouldReloadData.groupBy != null ? shouldReloadData.groupBy ? "remote" : "local" : void 0;
+  const propsSortMode = ((_c = props.sortMode) != null ? _c : shouldReloadData.sortInfo != null) ? shouldReloadData.sortInfo ? "remote" : "local" : void 0;
+  const propsFilterMode = ((_d = props.filterMode) != null ? _d : shouldReloadData.filterValue != null) ? shouldReloadData.filterValue ? "remote" : "local" : void 0;
+  if (props.groupMode) {
+    warnOnce(
+      `"groupMode" prop is deprecated for the <DataSource />, use "shouldReloadData.groupBy: true|false" instead`,
+      "groupMode deprecated",
+      DataSourceLogger
+    );
+  }
+  if (props.sortMode) {
+    warnOnce(
+      `"sortMode" prop is deprecated for the <DataSource />, use "shouldReloadData.sortInfo: true|false" instead`,
+      "sortMode deprecated",
+      DataSourceLogger
+    );
+  }
+  if (props.filterMode) {
+    warnOnce(
+      `"filterMode" prop is deprecated for the <DataSource />, use "shouldReloadData.filterValue: true|false" instead`,
+      "filterMode deprecated",
+      DataSourceLogger
+    );
+  }
+  const groupMode = typeof props.data === "function" ? propsGroupMode != null ? propsGroupMode : "local" : "local";
+  const sortMode = props.sortFunction ? "local" : propsSortMode != null ? propsSortMode : controlledSort ? "remote" : "local";
+  const filterMode = typeof props.filterFunction === "function" ? "local" : propsFilterMode != null ? propsFilterMode : typeof props.data === "function" ? "remote" : "local";
+  const pivotMode = shouldReloadData.pivotBy ? "remote" : "local";
   const result = {
     selectionMode,
     groupRowsState,
+    shouldReloadData: {
+      // #sortMode_vs_shouldReloadData.sortInfo
+      // we reconstruct this object
+      // and don't default to the computed filterMode, sortMode, groupMode and pivotMode
+      // as computed above
+      // since we want a subtle difference between the computed sortMode and shouldReloadData.sortInfo (for example)
+      // difference: sortMode will be local when sortFunction is provided, however, the user may want to reload data when sortInfo changes
+      // and thus the data will be refetched, but will be sorted locally
+      filterValue: (_f = (_e = props.shouldReloadData) == null ? void 0 : _e.filterValue) != null ? _f : filterMode === "remote",
+      sortInfo: (_h = (_g = props.shouldReloadData) == null ? void 0 : _g.sortInfo) != null ? _h : sortMode === "remote",
+      groupBy: (_j = (_i = props.shouldReloadData) == null ? void 0 : _i.groupBy) != null ? _j : groupMode === "remote",
+      pivotBy: (_l = (_k = props.shouldReloadData) == null ? void 0 : _k.pivotBy) != null ? _l : pivotMode === "remote"
+    },
     rowSelection: rowSelectionState,
     cellSelection: cellSelectionState,
+    groupMode,
+    sortMode,
+    filterMode,
+    pivotMode,
     toPrimaryKey,
     operatorsByFilterType,
     controlledSort,
     controlledFilter,
-    groupMode: typeof props.data === "function" ? (_b = props.groupMode) != null ? _b : "local" : "local",
-    sortMode: props.sortFunction ? "local" : (_c = props.sortMode) != null ? _c : controlledSort ? "remote" : "local",
-    filterMode: typeof props.filterFunction === "function" ? "local" : (_d = props.filterMode) != null ? _d : typeof props.data === "function" ? "remote" : "local",
     multiSort: Array.isArray(
       controlledSort ? props.sortInfo : props.defaultSortInfo
     ),
@@ -14938,6 +15012,7 @@ function DataSourceWithContext(props) {
   return /* @__PURE__ */ React50.createElement(React50.Fragment, null, children);
 }
 var DataSourceRoot = getComponentStateRoot({
+  debugName: "DataSource",
   //@ts-ignore
   initSetupState,
   //@ts-ignore
@@ -17041,13 +17116,13 @@ function useColumnRowspan(computedVisibleColumns) {
 
 // src/components/InfiniteTable/hooks/useColumnSizeFn.ts
 import { useCallback as useCallback20 } from "react";
-var debug5 = dbg("useColumnSizeFn");
+var debug4 = dbg("useColumnSizeFn");
 function useColumnSizeFn(columns) {
   const columnSize = useCallback20(
     (index) => {
       const column = columns[index];
       if (false) {
-        debug5("cannot find column at index", index, columns);
+        debug4("cannot find column at index", index, columns);
       }
       return column ? column.computedWidth : 0;
     },
@@ -18607,7 +18682,7 @@ var useLicense = (licenseKey = "") => {
     }
     let valid2 = isValidLicense(licenseKey, {
       publishedAt: 1624970570587,
-      version: "4.1.1"
+      version: "4.2.1-canary.0"
     });
     if (!licenseKey && !valid2 && isInsidePlayground) {
       return true;