@infinite-table/infinite-react 7.0.1 → 7.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/index.dev.js CHANGED
@@ -32,7 +32,8 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
32
32
 
33
33
  // ../node_modules/binary-search/index.js
34
34
  var require_binary_search = __commonJS({
35
- "../node_modules/binary-search/index.js"(exports, module2) {
35
+ "../node_modules/binary-search/index.js"(exports2, module2) {
36
+ "use strict";
36
37
  module2.exports = function(haystack, needle, comparator, low, high) {
37
38
  var mid, cmp;
38
39
  if (low === void 0)
@@ -65,8 +66,8 @@ var require_binary_search = __commonJS({
65
66
  });
66
67
 
67
68
  // src/index.tsx
68
- var src_exports = {};
69
- __export(src_exports, {
69
+ var index_exports = {};
70
+ __export(index_exports, {
70
71
  CellSelectionState: () => CellSelectionState,
71
72
  DataClient: () => DataClient,
72
73
  DataSource: () => DataSource,
@@ -95,6 +96,7 @@ __export(src_exports, {
95
96
  debug: () => debug,
96
97
  defaultFilterTypes: () => defaultFilterTypes2,
97
98
  eventMatchesKeyboardShortcut: () => eventMatchesKeyboardShortcut,
99
+ filterDataArray: () => filterDataArray,
98
100
  filterTypes: () => defaultFilterTypes2,
99
101
  flatten: () => flatten,
100
102
  getComponentStateRoot: () => buildManagedComponent,
@@ -118,6 +120,7 @@ __export(src_exports, {
118
120
  useInfiniteColumnFilterEditor: () => useInfiniteColumnFilterEditor,
119
121
  useInfiniteHeaderCell: () => useInfiniteHeaderCell,
120
122
  useInfinitePortalContainer: () => useInfinitePortalContainer,
123
+ useLayoutEffectWithChanges: () => useLayoutEffectWithChanges,
121
124
  useManagedDataSource: () => useManagedDataSource,
122
125
  useMasterRowInfo: () => useMasterRowInfo,
123
126
  useOverlay: () => useOverlay,
@@ -126,7 +129,7 @@ __export(src_exports, {
126
129
  useRowInfoReducers: () => useRowInfoReducers,
127
130
  useVisibleColumnSizes: () => useVisibleColumnSizes
128
131
  });
129
- module.exports = __toCommonJS(src_exports);
132
+ module.exports = __toCommonJS(index_exports);
130
133
 
131
134
  // src/components/utils/debounce.ts
132
135
  function debounce(fn, { wait }) {
@@ -215,7 +218,7 @@ var sortAscending = (a, b) => a - b;
215
218
 
216
219
  // src/utils/DeepMap/index.ts
217
220
  var SORT_ASC_REVISION = (p1, p2) => sortAscending(p1.revision, p2.revision);
218
- var DeepMap = class {
221
+ var DeepMap = class _DeepMap {
219
222
  constructor(initial) {
220
223
  this.map = /* @__PURE__ */ new Map();
221
224
  this.length = 0;
@@ -288,7 +291,7 @@ var DeepMap = class {
288
291
  this.fill(initial);
289
292
  }
290
293
  static clone(map2) {
291
- const clone = new DeepMap();
294
+ const clone = new _DeepMap();
292
295
  map2.visit((pair, keys) => {
293
296
  clone.set(keys, pair.value);
294
297
  });
@@ -1420,7 +1423,7 @@ var import_react5 = require("react");
1420
1423
  function AvoidReactDiffFn(props) {
1421
1424
  const [children, setChildren] = (0, import_react5.useState)(props.updater.get);
1422
1425
  const rafId = (0, import_react5.useRef)(null);
1423
- (0, import_react5.useEffect)(() => {
1426
+ (0, import_react5.useLayoutEffect)(() => {
1424
1427
  function onChange(children2) {
1425
1428
  if (props.useraf) {
1426
1429
  if (rafId.current != null) {
@@ -2524,6 +2527,10 @@ var MatrixBrain = class extends Logger {
2524
2527
  this.rowOffsetCache = [0];
2525
2528
  this.verticalRenderCount = void 0;
2526
2529
  this.verticalTotalSize = 0;
2530
+ this.verticalRenderRange = {
2531
+ startIndex: 0,
2532
+ endIndex: 0
2533
+ };
2527
2534
  }
2528
2535
  resetHorizontal() {
2529
2536
  this.colspanParent = /* @__PURE__ */ new Map();
@@ -2532,6 +2539,10 @@ var MatrixBrain = class extends Logger {
2532
2539
  this.colOffsetCache = [0];
2533
2540
  this.horizontalRenderCount = void 0;
2534
2541
  this.horizontalTotalSize = 0;
2542
+ this.horizontalRenderRange = {
2543
+ startIndex: 0,
2544
+ endIndex: 0
2545
+ };
2535
2546
  }
2536
2547
  getVirtualColIndex(colIndex, _opts) {
2537
2548
  return colIndex;
@@ -2991,7 +3002,7 @@ var GridCellForReact = class {
2991
3002
  return this.element;
2992
3003
  }
2993
3004
  };
2994
- var _GridCellPoolForReact = class extends Logger {
3005
+ var _GridCellPoolForReact = class _GridCellPoolForReact extends Logger {
2995
3006
  // for now, making this larger will create the cells, but on fast scrolling, those extra cells can tend to lag behind the scroll position as they are not updated
2996
3007
  constructor(debugId) {
2997
3008
  super(`${debugId}:GridCellPoolForReact`);
@@ -3108,8 +3119,8 @@ var _GridCellPoolForReact = class extends Logger {
3108
3119
  let cell = detachedCells.values().next().value;
3109
3120
  if (!cell) {
3110
3121
  this.poolSize += _GridCellPoolForReact.POOL_SIZE_INCREMENT;
3122
+ cell = detachedCells.values().next().value;
3111
3123
  }
3112
- cell = detachedCells.values().next().value;
3113
3124
  if (!cell) {
3114
3125
  this.error("No cells available in the pool!");
3115
3126
  }
@@ -3152,9 +3163,9 @@ var _GridCellPoolForReact = class extends Logger {
3152
3163
  }
3153
3164
  }
3154
3165
  };
3155
- var GridCellPoolForReact = _GridCellPoolForReact;
3156
3166
  // we'll grow the pool by this amount at a time
3157
- GridCellPoolForReact.POOL_SIZE_INCREMENT = 1;
3167
+ _GridCellPoolForReact.POOL_SIZE_INCREMENT = 1;
3168
+ var GridCellPoolForReact = _GridCellPoolForReact;
3158
3169
 
3159
3170
  // src/components/HeadlessTable/GridCellManager.ts
3160
3171
  var ASC_SORT = (a, b) => a - b;
@@ -3427,7 +3438,10 @@ var GridCellManager = class extends Logger {
3427
3438
  const [rowIndex, colIndex] = cellPos;
3428
3439
  this.matrix.visit((_, cellPos2) => {
3429
3440
  const [row, col] = cellPos2;
3430
- if (row >= rowIndex || col >= colIndex) {
3441
+ if (row > rowIndex) {
3442
+ this.detachCellAt(cellPos2);
3443
+ }
3444
+ if (row === rowIndex && col >= colIndex) {
3431
3445
  this.detachCellAt(cellPos2);
3432
3446
  }
3433
3447
  });
@@ -3541,7 +3555,7 @@ var ListRowForReact = class {
3541
3555
  return this.element;
3542
3556
  }
3543
3557
  };
3544
- var _ListRowPoolForReact = class extends Logger {
3558
+ var _ListRowPoolForReact = class _ListRowPoolForReact extends Logger {
3545
3559
  constructor(debugId) {
3546
3560
  super(`${debugId}:ListRowPoolForReact`);
3547
3561
  this.debugId = debugId;
@@ -3701,9 +3715,9 @@ var _ListRowPoolForReact = class extends Logger {
3701
3715
  }
3702
3716
  }
3703
3717
  };
3704
- var ListRowPoolForReact = _ListRowPoolForReact;
3705
3718
  // we'll grow the pool by this amount at a time
3706
- ListRowPoolForReact.POOL_SIZE_INCREMENT = 1;
3719
+ _ListRowPoolForReact.POOL_SIZE_INCREMENT = 1;
3720
+ var ListRowPoolForReact = _ListRowPoolForReact;
3707
3721
 
3708
3722
  // src/components/HeadlessTable/ListRowManager.ts
3709
3723
  var ListRowManager = class extends Logger {
@@ -5119,10 +5133,10 @@ function RawTableFn(props) {
5119
5133
  onRenderUpdater: props.onRenderUpdater
5120
5134
  } : createRenderer(brain);
5121
5135
  }, [brain, props.onRenderUpdater, props.renderer]);
5122
- (0, import_react6.useEffect)(() => {
5136
+ (0, import_react6.useLayoutEffect)(() => {
5123
5137
  renderer.cellHoverClassNames = props.cellHoverClassNames || [];
5124
5138
  }, [renderer, props.cellHoverClassNames]);
5125
- (0, import_react6.useEffect)(() => {
5139
+ (0, import_react6.useLayoutEffect)(() => {
5126
5140
  renderer.cellDetachedClassNames = props.cellDetachedClassNames || [];
5127
5141
  }, [renderer, props.cellDetachedClassNames]);
5128
5142
  (0, import_react6.useLayoutEffect)(() => {
@@ -5133,17 +5147,8 @@ function RawTableFn(props) {
5133
5147
  renderCell,
5134
5148
  renderDetailRow
5135
5149
  });
5136
- }, [
5137
- renderer,
5138
- brain,
5139
- renderCell,
5140
- renderDetailRow,
5141
- onRenderUpdater,
5142
- forceRerenderTimestamp
5143
- ]);
5144
- (0, import_react6.useEffect)(() => {
5145
- const remove = brain.onRenderRangeChange((renderRange) => {
5146
- renderer.renderRange(renderRange, {
5150
+ const remove = brain.onRenderRangeChange((renderRange2) => {
5151
+ renderer.renderRange(renderRange2, {
5147
5152
  force: false,
5148
5153
  // TODO should be false
5149
5154
  onRender: (items) => {
@@ -5158,7 +5163,14 @@ function RawTableFn(props) {
5158
5163
  });
5159
5164
  });
5160
5165
  return remove;
5161
- }, [renderCell, renderDetailRow, brain, onRenderUpdater]);
5166
+ }, [
5167
+ renderer,
5168
+ brain,
5169
+ renderCell,
5170
+ renderDetailRow,
5171
+ onRenderUpdater,
5172
+ forceRerenderTimestamp
5173
+ ]);
5162
5174
  return /* @__PURE__ */ React11.createElement(AvoidReactDiff, { updater: onRenderUpdater });
5163
5175
  }
5164
5176
  var RawTable = React11.memo(RawTableFn);
@@ -5181,13 +5193,11 @@ var useRerender = () => {
5181
5193
 
5182
5194
  // ../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js
5183
5195
  function toPrimitive(t, r) {
5184
- if ("object" != typeof t || !t)
5185
- return t;
5196
+ if ("object" != typeof t || !t) return t;
5186
5197
  var e = t[Symbol.toPrimitive];
5187
5198
  if (void 0 !== e) {
5188
5199
  var i = e.call(t, r || "default");
5189
- if ("object" != typeof i)
5190
- return i;
5200
+ if ("object" != typeof i) return i;
5191
5201
  throw new TypeError("@@toPrimitive must return a primitive value.");
5192
5202
  }
5193
5203
  return ("string" === r ? String : Number)(t);
@@ -5654,7 +5664,7 @@ var useEffectOnce = (effectCallback) => {
5654
5664
  const effectFunction = (0, import_react11.useCallback)(effectCallback, []);
5655
5665
  const effectCalled = (0, import_react11.useRef)(false);
5656
5666
  const componentRendered = (0, import_react11.useRef)(false);
5657
- const destroyFn = (0, import_react11.useRef)();
5667
+ const destroyFn = (0, import_react11.useRef)(void 0);
5658
5668
  const [_, rerender] = useRerender();
5659
5669
  if (effectCalled.current) {
5660
5670
  componentRendered.current = true;
@@ -5864,10 +5874,7 @@ function buildManagedComponent(config) {
5864
5874
  }) : newState;
5865
5875
  return result;
5866
5876
  };
5867
- const [state, dispatch] = (0, import_react14.useReducer)(
5868
- theReducer,
5869
- wholeState
5870
- );
5877
+ const [state, dispatch] = (0, import_react14.useReducer)(theReducer, wholeState);
5871
5878
  const getComponentState = useLatest(state);
5872
5879
  const { allowedControlledPropOverrides } = config;
5873
5880
  const actions = (0, import_react14.useMemo)(() => {
@@ -7976,7 +7983,7 @@ function mapToContinuation(args) {
7976
7983
  (arg) => arg instanceof CssContinuation ? arg : new CssContinuation(null, [arg])
7977
7984
  );
7978
7985
  }
7979
- var CssContinuation = class {
7986
+ var CssContinuation = class _CssContinuation {
7980
7987
  constructor(operation, operands = []) {
7981
7988
  this.__operands = [];
7982
7989
  this.__operation = null;
@@ -7984,19 +7991,19 @@ var CssContinuation = class {
7984
7991
  this.__operation = operation;
7985
7992
  }
7986
7993
  add(...args) {
7987
- return new CssContinuation("+", [this, ...args]);
7994
+ return new _CssContinuation("+", [this, ...args]);
7988
7995
  }
7989
7996
  subtract(...args) {
7990
- return new CssContinuation("-", [this, ...args]);
7997
+ return new _CssContinuation("-", [this, ...args]);
7991
7998
  }
7992
7999
  minus(...args) {
7993
8000
  return this.subtract(...args);
7994
8001
  }
7995
8002
  multiply(...args) {
7996
- return new CssContinuation("*", [this, ...args]);
8003
+ return new _CssContinuation("*", [this, ...args]);
7997
8004
  }
7998
8005
  divide(...args) {
7999
- return new CssContinuation("/", [this, ...args]);
8006
+ return new _CssContinuation("/", [this, ...args]);
8000
8007
  }
8001
8008
  __get(parent) {
8002
8009
  const { __operation, __operands } = this;
@@ -9613,7 +9620,7 @@ var React36 = __toESM(require("react"));
9613
9620
  var import_react23 = require("react");
9614
9621
  function InfiniteTableColumnEditor() {
9615
9622
  const { initialValue, setValue, confirmEdit, cancelEdit, readOnly } = useInfiniteColumnEditor();
9616
- const domRef = (0, import_react23.useRef)();
9623
+ const domRef = (0, import_react23.useRef)(null);
9617
9624
  const refCallback = React36.useCallback((node) => {
9618
9625
  domRef.current = node;
9619
9626
  if (node) {
@@ -11596,7 +11603,13 @@ function InfiniteTableHeaderFn(props) {
11596
11603
  const {
11597
11604
  computed,
11598
11605
  getState,
11599
- state: { headerBrain, headerOptions, showColumnFilters }
11606
+ state: {
11607
+ headerBrain,
11608
+ headerOptions,
11609
+ showColumnFilters,
11610
+ headerRenderer,
11611
+ headerOnRenderUpdater
11612
+ }
11600
11613
  } = useInfiniteTable();
11601
11614
  const { computedColumnsMap } = computed;
11602
11615
  const domRef = (0, import_react31.useRef)(null);
@@ -11697,6 +11710,8 @@ function InfiniteTableHeaderFn(props) {
11697
11710
  name: "header",
11698
11711
  renderCell,
11699
11712
  brain: headerBrain,
11713
+ renderer: headerRenderer,
11714
+ onRenderUpdater: headerOnRenderUpdater,
11700
11715
  cellHoverClassNames: EMPTY_ARR,
11701
11716
  cellDetachedClassNames: CELL_DETACHED_CLASSNAMES
11702
11717
  }
@@ -13419,7 +13434,7 @@ function getGroupKeysForDataItem(data, groupBy) {
13419
13434
  }
13420
13435
 
13421
13436
  // src/components/DataSource/RowSelectionState.ts
13422
- var RowSelectionState = class {
13437
+ var RowSelectionState = class _RowSelectionState {
13423
13438
  constructor(state, getConfig, _forTestingOnly) {
13424
13439
  this.selectedRows = null;
13425
13440
  this.deselectedRows = null;
@@ -13498,7 +13513,7 @@ var RowSelectionState = class {
13498
13513
  return this.getConfig().groupBy.length;
13499
13514
  }
13500
13515
  static from(rowSeleStateObject, getConfig, overrides) {
13501
- return new RowSelectionState(rowSeleStateObject, getConfig, overrides);
13516
+ return new _RowSelectionState(rowSeleStateObject, getConfig, overrides);
13502
13517
  }
13503
13518
  update(stateObject) {
13504
13519
  this.selectedRows = stateObject.selectedRows || null;
@@ -14780,6 +14795,34 @@ function useEffectWithChanges(fn, deps) {
14780
14795
  return result;
14781
14796
  }, useEffectDeps);
14782
14797
  }
14798
+ function useLayoutEffectWithChanges(fn, deps) {
14799
+ const prevRef = (0, import_react33.useRef)({});
14800
+ const oldValuesRef = (0, import_react33.useRef)({});
14801
+ const oldValues = oldValuesRef.current;
14802
+ const changesRef = (0, import_react33.useRef)({});
14803
+ const changes = changesRef.current;
14804
+ const useEffectDeps = [];
14805
+ for (const k in deps) {
14806
+ if (deps.hasOwnProperty(k)) {
14807
+ if (deps[k] !== prevRef.current[k]) {
14808
+ changes[k] = deps[k];
14809
+ oldValues[k] = prevRef.current[k];
14810
+ }
14811
+ useEffectDeps.push(deps[k]);
14812
+ }
14813
+ }
14814
+ prevRef.current = deps;
14815
+ (0, import_react33.useLayoutEffect)(() => {
14816
+ const changes2 = changesRef.current;
14817
+ let result = void 0;
14818
+ if (Object.keys(changes2).length !== 0) {
14819
+ result = fn(changes2, oldValues);
14820
+ }
14821
+ changesRef.current = {};
14822
+ oldValuesRef.current = {};
14823
+ return result;
14824
+ }, useEffectDeps);
14825
+ }
14783
14826
  function useEffectWithObject(fn, deps) {
14784
14827
  const useEffectDeps = [];
14785
14828
  for (const k in deps) {
@@ -15003,7 +15046,7 @@ function getPivotColumnsAndColumnGroups({
15003
15046
 
15004
15047
  // src/components/DataSource/DataSourceCache.ts
15005
15048
  var CLEAR_SYMBOL = Symbol("CLEAR");
15006
- var DataSourceCache = class {
15049
+ var DataSourceCache = class _DataSourceCache {
15007
15050
  constructor(options) {
15008
15051
  this.affectedFields = /* @__PURE__ */ new Set();
15009
15052
  this.allFieldsAffected = false;
@@ -15171,7 +15214,7 @@ var DataSourceCache = class {
15171
15214
  this.nodesKey = options.nodesKey;
15172
15215
  }
15173
15216
  static clone(cache, { light = false } = {}) {
15174
- const clone = new DataSourceCache({
15217
+ const clone = new _DataSourceCache({
15175
15218
  nodesKey: cache.nodesKey
15176
15219
  });
15177
15220
  clone.allFieldsAffected = cache.allFieldsAffected;
@@ -15369,7 +15412,7 @@ var TreeExpandState = class {
15369
15412
 
15370
15413
  // src/components/DataSource/TreeSelectionState.ts
15371
15414
  var shortestToLongest = (a, b) => a.length - b.length;
15372
- var TreeSelectionState = class {
15415
+ var TreeSelectionState = class _TreeSelectionState {
15373
15416
  constructor(state, getConfig) {
15374
15417
  this.selectedPaths = null;
15375
15418
  this.deselectedPaths = null;
@@ -15398,7 +15441,7 @@ var TreeSelectionState = class {
15398
15441
  return deepMapValue.items.length;
15399
15442
  }
15400
15443
  static from(treeSelectionState, getConfig) {
15401
- return new TreeSelectionState(treeSelectionState, getConfig);
15444
+ return new _TreeSelectionState(treeSelectionState, getConfig);
15402
15445
  }
15403
15446
  setConfigFn(getConfig) {
15404
15447
  this.getConfig = getConfig;
@@ -17031,7 +17074,7 @@ function filterTreeDataSource(params) {
17031
17074
  }
17032
17075
  return treeDataArray;
17033
17076
  }
17034
- function filterDataSource(params) {
17077
+ function filterDataArray(params) {
17035
17078
  const {
17036
17079
  filterTypes,
17037
17080
  operatorsByFilterType,
@@ -17257,7 +17300,7 @@ function concludeReducer(params) {
17257
17300
  if (state.devToolsDetected) {
17258
17301
  filterTimestamp = Date.now();
17259
17302
  }
17260
- dataArray = filterDataSource({
17303
+ dataArray = filterDataArray({
17261
17304
  // tree-related stuff
17262
17305
  getNodeChildren,
17263
17306
  isLeafNode,
@@ -19292,7 +19335,7 @@ var RowDetailState = class extends BooleanCollectionState {
19292
19335
  };
19293
19336
 
19294
19337
  // src/utils/FixedSizeMap.ts
19295
- var _FixedSizeMap = class {
19338
+ var _FixedSizeMap = class _FixedSizeMap {
19296
19339
  constructor(clone, size) {
19297
19340
  this.keysInOrder = [];
19298
19341
  if (typeof clone === "number") {
@@ -19350,8 +19393,8 @@ var _FixedSizeMap = class {
19350
19393
  return this;
19351
19394
  }
19352
19395
  };
19396
+ _FixedSizeMap.DEFAULT_SIZE = 10;
19353
19397
  var FixedSizeMap = _FixedSizeMap;
19354
- FixedSizeMap.DEFAULT_SIZE = 10;
19355
19398
 
19356
19399
  // src/components/DataSource/RowDetailCache.ts
19357
19400
  var RowDetailNoCacheStorage = class {
@@ -19511,8 +19554,7 @@ function realignColumnContextMenu(param) {
19511
19554
 
19512
19555
  // src/components/InfiniteTable/types/Utility.ts
19513
19556
  function notNullable(value) {
19514
- if (value === null || value === void 0)
19515
- return false;
19557
+ if (value === null || value === void 0) return false;
19516
19558
  const testDummyForCompileError = value;
19517
19559
  return true;
19518
19560
  }
@@ -22398,7 +22440,8 @@ function createBrains(debugId, wrapRowsHorizontally) {
22398
22440
  const brain = !wrapRowsHorizontally ? new MatrixBrain(debugChannel) : new HorizontalLayoutMatrixBrain(debugChannel, {
22399
22441
  isHeader: false
22400
22442
  });
22401
- const headerBrain = !wrapRowsHorizontally ? new MatrixBrain(debugChannel) : new HorizontalLayoutMatrixBrain(debugChannel, {
22443
+ const headerBrainChannel = `${debugChannel}:header`;
22444
+ const headerBrain = !wrapRowsHorizontally ? new MatrixBrain(headerBrainChannel) : new HorizontalLayoutMatrixBrain(headerBrainChannel, {
22402
22445
  isHeader: true,
22403
22446
  masterBrain: brain
22404
22447
  });
@@ -22408,30 +22451,40 @@ function createBrains(debugId, wrapRowsHorizontally) {
22408
22451
  scrollTop: 0
22409
22452
  });
22410
22453
  });
22411
- if (false) {
22412
- globalThis.brain = brain;
22413
- globalThis.headerBrain = headerBrain;
22414
- }
22415
22454
  const { renderer, onRenderUpdater } = createRenderer(brain);
22455
+ const { renderer: headerRenderer, onRenderUpdater: headerOnRenderUpdater } = createRenderer(headerBrain);
22416
22456
  brain.onAvailableSizeChange((size) => {
22417
22457
  headerBrain.update({ width: size.width });
22418
22458
  });
22419
- return { brain, headerBrain, renderer, onRenderUpdater };
22459
+ return {
22460
+ brain,
22461
+ headerBrain,
22462
+ renderer,
22463
+ onRenderUpdater,
22464
+ headerRenderer,
22465
+ headerOnRenderUpdater
22466
+ };
22420
22467
  }
22421
22468
  function initSetupState2({
22422
22469
  debugId,
22423
22470
  wrapRowsHorizontally
22424
22471
  }) {
22425
22472
  const columnsGeneratedForGrouping = {};
22426
- const { brain, headerBrain, renderer, onRenderUpdater } = createBrains(
22427
- debugId,
22428
- !!wrapRowsHorizontally
22429
- );
22473
+ const {
22474
+ brain,
22475
+ headerBrain,
22476
+ renderer,
22477
+ onRenderUpdater,
22478
+ headerRenderer,
22479
+ headerOnRenderUpdater
22480
+ } = createBrains(debugId, !!wrapRowsHorizontally);
22430
22481
  const domRef = (0, import_react42.createRef)();
22431
22482
  return {
22432
22483
  debugWarnings: /* @__PURE__ */ new Map(),
22433
22484
  renderer,
22434
22485
  onRenderUpdater,
22486
+ headerRenderer,
22487
+ headerOnRenderUpdater,
22435
22488
  devToolsDetected: !!globalThis.__INFINITE_TABLE_DEVTOOLS_HOOK__,
22436
22489
  propsCache: /* @__PURE__ */ new Map([]),
22437
22490
  lastRowToCollapseRef: { current: null },
@@ -22622,7 +22675,9 @@ var cleanupState = (state) => {
22622
22675
  state.brain.destroy();
22623
22676
  state.headerBrain.destroy();
22624
22677
  state.renderer.destroy();
22678
+ state.headerRenderer.destroy();
22625
22679
  state.onRenderUpdater.destroy();
22680
+ state.headerOnRenderUpdater.destroy();
22626
22681
  state.onFlashingDurationCSSVarChange.destroy();
22627
22682
  state.onRowHeightCSSVarChange.destroy();
22628
22683
  state.onColumnHeaderHeightCSSVarChange.destroy();
@@ -23925,7 +23980,7 @@ var useLicense = (licenseKey = "") => {
23925
23980
  }
23926
23981
  let valid2 = isValidLicense(licenseKey, {
23927
23982
  publishedAt: 1624970570587,
23928
- version: "7.0.1"
23983
+ version: "7.1.0"
23929
23984
  });
23930
23985
  if (!licenseKey && !valid2 && isInsidePlayground) {
23931
23986
  return true;
@@ -24791,7 +24846,7 @@ var import_react53 = require("react");
24791
24846
  var import_react_dom2 = require("react-dom");
24792
24847
 
24793
24848
  // src/utils/pageGeometry/Point.ts
24794
- var Point = class {
24849
+ var Point = class _Point {
24795
24850
  constructor(point) {
24796
24851
  this.top = 0;
24797
24852
  this.left = 0;
@@ -24799,10 +24854,10 @@ var Point = class {
24799
24854
  this.top = point.top;
24800
24855
  }
24801
24856
  static clone(point) {
24802
- return new Point(point);
24857
+ return new _Point(point);
24803
24858
  }
24804
24859
  static from(point) {
24805
- return new Point(point);
24860
+ return new _Point(point);
24806
24861
  }
24807
24862
  shift(shiftOptions) {
24808
24863
  if (shiftOptions.top != null) {
@@ -24908,14 +24963,14 @@ var PolyWithPoints = class {
24908
24963
  };
24909
24964
 
24910
24965
  // src/utils/pageGeometry/ConvexPoly.ts
24911
- var ConvexPoly = class extends PolyWithPoints {
24966
+ var ConvexPoly = class _ConvexPoly extends PolyWithPoints {
24967
+ static clone(points) {
24968
+ return new _ConvexPoly(points);
24969
+ }
24912
24970
  constructor(points) {
24913
24971
  super();
24914
24972
  this.points = points.map(Point.clone);
24915
24973
  }
24916
- static clone(points) {
24917
- return new ConvexPoly(points);
24918
- }
24919
24974
  getPoints() {
24920
24975
  return this.points;
24921
24976
  }
@@ -24928,7 +24983,7 @@ var ConvexPoly = class extends PolyWithPoints {
24928
24983
  };
24929
24984
 
24930
24985
  // src/utils/pageGeometry/Rectangle.ts
24931
- var Rectangle = class extends PolyWithPoints {
24986
+ var Rectangle = class _Rectangle extends PolyWithPoints {
24932
24987
  constructor(coordsAndSize) {
24933
24988
  super();
24934
24989
  this.top = 0;
@@ -24948,16 +25003,16 @@ var Rectangle = class extends PolyWithPoints {
24948
25003
  }
24949
25004
  }
24950
25005
  static fromDOMRect(rect) {
24951
- return new Rectangle(rect);
25006
+ return new _Rectangle(rect);
24952
25007
  }
24953
25008
  static clone(rect) {
24954
- return new Rectangle(rect);
25009
+ return new _Rectangle(rect);
24955
25010
  }
24956
25011
  static from(rect) {
24957
- return Rectangle.clone(rect);
25012
+ return _Rectangle.clone(rect);
24958
25013
  }
24959
25014
  static fromPoint(point) {
24960
- return Rectangle.from({
25015
+ return _Rectangle.from({
24961
25016
  top: point.top,
24962
25017
  left: point.left,
24963
25018
  width: 0,
@@ -27429,6 +27484,8 @@ function useToggleWrapRowsHorizontally() {
27429
27484
  actions.headerBrain = newBrains.headerBrain;
27430
27485
  actions.renderer = newBrains.renderer;
27431
27486
  actions.onRenderUpdater = newBrains.onRenderUpdater;
27487
+ actions.headerRenderer = newBrains.headerRenderer;
27488
+ actions.headerOnRenderUpdater = newBrains.headerOnRenderUpdater;
27432
27489
  }
27433
27490
  }, [oldWrapRowsHorizontally, wrapRowsHorizontally]);
27434
27491
  }
@@ -27805,7 +27862,7 @@ var DEVTOOLS_MESSAGES = {
27805
27862
  function listenForDevTools() {
27806
27863
  if (typeof window !== "undefined") {
27807
27864
  window.addEventListener("message", (event) => {
27808
- if (event && event.data && typeof event.data.source === "string" && event.data.source.startsWith("infinite-table-devtools-contentscript") && event.data.target === "infinite-table-page") {
27865
+ if (event && event.data && typeof event.data.source === "string" && typeof event.data.target === "string" && event.data.target === "infinite-table-page" && event.data.source.startsWith("infinite-table-devtools-contentscript")) {
27809
27866
  if (!window.__INFINITE_TABLE_DEVTOOLS_HOOK__) {
27810
27867
  setupHook();
27811
27868
  HOOK_FN_SETUP_CALLBACK(
@@ -28423,7 +28480,7 @@ function queryKeyToCacheKey(key) {
28423
28480
  }
28424
28481
  return key;
28425
28482
  }
28426
- var _DataClient = class {
28483
+ var _DataClient = class _DataClient {
28427
28484
  constructor(options) {
28428
28485
  this.queryCache = new DeepMap();
28429
28486
  this.removeQueryIfErrored = (query, stringifiedQueryKey) => {
@@ -28517,8 +28574,8 @@ var _DataClient = class {
28517
28574
  _DataClient.clients.delete(this.options.name);
28518
28575
  }
28519
28576
  };
28577
+ _DataClient.clients = /* @__PURE__ */ new Map();
28520
28578
  var DataClient = _DataClient;
28521
- DataClient.clients = /* @__PURE__ */ new Map();
28522
28579
 
28523
28580
  // src/components/InfiniteTable/eventHandlers/keyboardShortcuts.ts
28524
28581
  var instantEdit = {
@@ -28608,7 +28665,7 @@ function interceptMap(map2, fns) {
28608
28665
  }
28609
28666
 
28610
28667
  // src/utils/FixedSizeSet.ts
28611
- var _FixedSizeSet = class {
28668
+ var _FixedSizeSet = class _FixedSizeSet {
28612
28669
  constructor(clone, size) {
28613
28670
  this.orderRefs = [];
28614
28671
  if (typeof clone === "number") {
@@ -28663,11 +28720,11 @@ var _FixedSizeSet = class {
28663
28720
  return this;
28664
28721
  }
28665
28722
  };
28723
+ _FixedSizeSet.DEFAULT_SIZE = 10;
28666
28724
  var FixedSizeSet = _FixedSizeSet;
28667
- FixedSizeSet.DEFAULT_SIZE = 10;
28668
28725
 
28669
28726
  // src/utils/WeakFixedSizeSet.ts
28670
- var _WeakFixedSizeSet = class {
28727
+ var _WeakFixedSizeSet = class _WeakFixedSizeSet {
28671
28728
  constructor(clone, size) {
28672
28729
  this.orderRefs = [];
28673
28730
  if (typeof clone === "number") {
@@ -28723,8 +28780,8 @@ var _WeakFixedSizeSet = class {
28723
28780
  return this;
28724
28781
  }
28725
28782
  };
28783
+ _WeakFixedSizeSet.DEFAULT_SIZE = 10;
28726
28784
  var WeakFixedSizeSet = _WeakFixedSizeSet;
28727
- WeakFixedSizeSet.DEFAULT_SIZE = 10;
28728
28785
 
28729
28786
  // src/components/hooks/useEffectWhenSameDeps.ts
28730
28787
  var import_react68 = require("react");
@@ -28831,9 +28888,11 @@ var createFlashingColumnCellComponent = (options = {}) => {
28831
28888
  const oldValueRef = React73.useRef(value);
28832
28889
  const oldValue = initialRef.current ? null : oldValueRef.current;
28833
28890
  initialRef.current = false;
28834
- const flashTimeoutIdRef = React73.useRef();
28835
- const flashDirectionRef = React73.useRef();
28836
- const fadeTimeoutIdRef = React73.useRef();
28891
+ const flashTimeoutIdRef = React73.useRef(void 0);
28892
+ const flashDirectionRef = React73.useRef(
28893
+ void 0
28894
+ );
28895
+ const fadeTimeoutIdRef = React73.useRef(void 0);
28837
28896
  useEffectWhen(
28838
28897
  () => {
28839
28898
  if (value === oldValueRef.current) {
@@ -28925,6 +28984,7 @@ var components = {
28925
28984
  debug,
28926
28985
  defaultFilterTypes,
28927
28986
  eventMatchesKeyboardShortcut,
28987
+ filterDataArray,
28928
28988
  filterTypes,
28929
28989
  flatten,
28930
28990
  getComponentStateRoot,
@@ -28948,6 +29008,7 @@ var components = {
28948
29008
  useInfiniteColumnFilterEditor,
28949
29009
  useInfiniteHeaderCell,
28950
29010
  useInfinitePortalContainer,
29011
+ useLayoutEffectWithChanges,
28951
29012
  useManagedDataSource,
28952
29013
  useMasterRowInfo,
28953
29014
  useOverlay,