@infinite-table/infinite-react 3.3.4 → 4.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
@@ -156,6 +156,7 @@ __export(src_exports, {
156
156
  useDataSource: () => useDataSource,
157
157
  useEffectWithChanges: () => useEffectWithChanges,
158
158
  useEffectWithObject: () => useEffectWithObject,
159
+ useGridScroll: () => useGridScroll,
159
160
  useInfiniteColumnCell: () => useInfiniteColumnCell,
160
161
  useInfiniteColumnEditor: () => useInfiniteColumnEditor,
161
162
  useInfiniteColumnFilterEditor: () => useInfiniteColumnFilterEditor,
@@ -163,7 +164,8 @@ __export(src_exports, {
163
164
  useMasterRowInfo: () => useMasterRowInfo,
164
165
  useOverlay: () => useOverlay,
165
166
  useOverlayPortal: () => useOverlayPortal,
166
- useRowInfoReducers: () => useRowInfoReducers
167
+ useRowInfoReducers: () => useRowInfoReducers,
168
+ useVisibleColumnSizes: () => useVisibleColumnSizes
167
169
  });
168
170
  module.exports = __toCommonJS(src_exports);
169
171
 
@@ -1215,9 +1217,10 @@ var useOnScroll = (domRef, onScroll) => {
1215
1217
  };
1216
1218
 
1217
1219
  // src/components/VirtualScrollContainer/VirtualScrollContainer.css.ts
1218
- var ScrollableCls = { true: "VirtualScrollContainer_getOverflowFor_true__1ueijco1", false: "VirtualScrollContainer_getOverflowFor_false__1ueijco2", visible: "VirtualScrollContainer_getOverflowFor_visible__1ueijco3", auto: "VirtualScrollContainer_getOverflowFor_auto__1ueijco4", hidden: "VirtualScrollContainer_getOverflowFor_hidden__1ueijco5" };
1219
- var ScrollableHorizontalCls = { true: "VirtualScrollContainer_getOverflowFor_true__1ueijco6", false: "VirtualScrollContainer_getOverflowFor_false__1ueijco7", visible: "VirtualScrollContainer_getOverflowFor_visible__1ueijco8", auto: "VirtualScrollContainer_getOverflowFor_auto__1ueijco9", hidden: "VirtualScrollContainer_getOverflowFor_hidden__1ueijcoa" };
1220
- var ScrollableVerticalCls = { true: "VirtualScrollContainer_getOverflowFor_true__1ueijcob", false: "VirtualScrollContainer_getOverflowFor_false__1ueijcoc", visible: "VirtualScrollContainer_getOverflowFor_visible__1ueijcod", auto: "VirtualScrollContainer_getOverflowFor_auto__1ueijcoe", hidden: "VirtualScrollContainer_getOverflowFor_hidden__1ueijcof" };
1220
+ var ScrollableCls = { true: "VirtualScrollContainer_getOverflowFor_true__1ueijco2", false: "VirtualScrollContainer_getOverflowFor_false__1ueijco3", visible: "VirtualScrollContainer_getOverflowFor_visible__1ueijco4", auto: "VirtualScrollContainer_getOverflowFor_auto__1ueijco5", hidden: "VirtualScrollContainer_getOverflowFor_hidden__1ueijco6" };
1221
+ var ScrollableHorizontalCls = { true: "VirtualScrollContainer_getOverflowFor_true__1ueijco7", false: "VirtualScrollContainer_getOverflowFor_false__1ueijco8", visible: "VirtualScrollContainer_getOverflowFor_visible__1ueijco9", auto: "VirtualScrollContainer_getOverflowFor_auto__1ueijcoa", hidden: "VirtualScrollContainer_getOverflowFor_hidden__1ueijcob" };
1222
+ var ScrollableVerticalCls = { true: "VirtualScrollContainer_getOverflowFor_true__1ueijcoc", false: "VirtualScrollContainer_getOverflowFor_false__1ueijcod", visible: "VirtualScrollContainer_getOverflowFor_visible__1ueijcoe", auto: "VirtualScrollContainer_getOverflowFor_auto__1ueijcof", hidden: "VirtualScrollContainer_getOverflowFor_hidden__1ueijcog" };
1223
+ var VirtualScrollContainerChildToScrollCls = "VirtualScrollContainer_VirtualScrollContainerChildToScrollCls__1ueijco1";
1221
1224
  var VirtualScrollContainerCls = "VirtualScrollContainer_VirtualScrollContainerCls__1ueijco0 utilities_boxSizingBorderBox__16lm1iw0";
1222
1225
 
1223
1226
  // src/components/VirtualScrollContainer/getScrollableClassName.ts
@@ -1426,7 +1429,7 @@ var internalProps = {
1426
1429
  };
1427
1430
 
1428
1431
  // src/components/InfiniteTable/vars.css.ts
1429
- var ThemeVars = { color: { accent: "var(--infinite-accent-color)", error: "var(--infinite-error-color)", color: "var(--infinite-color)" }, spacing: { "0": "var(--infinite-space-0)", "1": "var(--infinite-space-1)", "2": "var(--infinite-space-2)", "3": "var(--infinite-space-3)", "4": "var(--infinite-space-4)", "5": "var(--infinite-space-5)", "6": "var(--infinite-space-6)", "7": "var(--infinite-space-7)", "8": "var(--infinite-space-8)", "9": "var(--infinite-space-9)", "10": "var(--infinite-space-10)" }, fontSize: { "0": "var(--infinite-font-size-0)", "1": "var(--infinite-font-size-1)", "2": "var(--infinite-font-size-2)", "3": "var(--infinite-font-size-3)", "4": "var(--infinite-font-size-4)", "5": "var(--infinite-font-size-5)", "6": "var(--infinite-font-size-6)", "7": "var(--infinite-font-size-7)" }, fontFamily: "var(--infinite-font-family)", minHeight: "var(--infinite-min-height)", borderRadius: "var(--infinite-border-radius)", background: "var(--infinite-background)", iconSize: "var(--infinite-icon-size)", components: { LoadMask: { padding: "var(--infinite-load-mask-padding)", color: "var(--infinite-load-mask-color)", textBackground: "var(--infinite-load-mask-text-background)", overlayBackground: "var(--infinite-load-mask-overlay-background)", overlayOpacity: "var(--infinite-load-mask-overlay-opacity)", borderRadius: "var(--infinite-load-mask-border-radius)" }, Header: { background: "var(--infinite-header-background)", color: "var(--infinite-header-color)", columnHeaderHeight: "var(--infinite-column-header-height)" }, HeaderCell: { background: "var(--infinite-header-cell-background)", hoverBackground: "var(--infinite-header-cell-hover-background)", border: "var(--infinite-header-cell-border)", padding: "var(--infinite-header-cell-padding)", paddingX: "var(--infinite-header-cell-padding-x)", paddingY: "var(--infinite-header-cell-padding-y)", iconSize: "var(--infinite-header-cell-icon-size)", menuIconLineWidth: "var(--infinite-header-cell-menu-icon-line-width)", sortIconMargin: "var(--infinite-header-cell-sort-icon-margin)", borderRight: "var(--infinite-header-cell-border-right)", resizeHandleActiveAreaWidth: "var(--infinite-resize-handle-active-area-width)", resizeHandleWidth: "var(--infinite-resize-handle-width)", resizeHandleHoverBackground: "var(--infinite-resize-handle-hover-background)", resizeHandleConstrainedHoverBackground: "var(--infinite-resize-handle-constrained-hover-background)", filterOperatorPaddingX: "var(--infinite-filter-operator-padding-x)", filterEditorPaddingX: "var(--infinite-filter-editor-padding-x)", filterEditorMarginX: "var(--infinite-filter-editor-margin-x)", filterOperatorPaddingY: "var(--infinite-filter-operator-padding-y)", filterEditorPaddingY: "var(--infinite-filter-editor-padding-y)", filterEditorMarginY: "var(--infinite-filter-editor-margin-y)", filterEditorBackground: "var(--infinite-filter-editor-background)", filterEditorBorder: "var(--infinite-filter-editor-border)", filterEditorFocusBorderColor: "var(--infinite-filter-editor-focus-border-color)", filterEditorBorderRadius: "var(--infinite-filter-editor-border-radius)", filterEditorColor: "var(--infinite-filter-editor-color)" }, Cell: { padding: "var(--infinite-cell-padding)", borderWidth: "var(--infinite-cell-border-width)", border: "var(--infinite-cell-border)", borderLeft: "var(--infinite-cell-border-left)", borderRight: "var(--infinite-cell-border-right)", borderTop: "var(--infinite-cell-border-top)", borderInvisible: "var(--infinite-cell-border-invisible)", borderRadius: "var(--infinite-cell-border-radius)", reorderEffectDuration: "var(--infinite-column-reorder-effect-duration)", pinnedBorder: "var(--infinite-pinned-cell-border)", color: "var(--infinite-cell-color)", selectedBackground: "var(--infinite-selected-cell-background)", selectedBackgroundDefault: "var(--infinite-selected-cell-background-default)", selectedBackgroundAlpha: "var(--infinite-selected-cell-background-alpha)", selectedBackgroundAlphaWhenTableUnfocused: "var(--infinite-selected-cell-background-alpha--table-unfocused)", selectedBorderColor: "var(--infinite-selected-cell-border-color)", selectedBorderWidth: "var(--infinite-selected-cell-border-width)", selectedBorderStyle: "var(--infinite-selected-cell-border-style)", selectedBorder: "var(--infinite-selected-cell-border)", activeBackgroundAlpha: "var(--infinite-active-cell-background-alpha)", activeBackgroundAlphaWhenTableUnfocused: "var(--infinite-active-cell-background-alpha--table-unfocused)", activeBackground: "var(--infinite-active-cell-background)", activeBackgroundDefault: "var(--infinite-active-cell-background-default)", activeBorderColor: "var(--infinite-active-cell-border-color)", activeBorderWidth: "var(--infinite-active-cell-border-width)", activeBorderStyle: "var(--infinite-active-cell-border-style)", activeBorder: "var(--infinite-active-cell-border)" }, SelectionCheckBox: { marginInline: "var(--infinite-selection-checkbox-margin-inline)" }, Menu: { background: "var(--infinite-menu-background)", color: "var(--infinite-menu-color)", separatorColor: "var(--infinite-menu-separator-color)", padding: "var(--infinite-menu-padding)", cellPaddingVertical: "var(--infinite-menu-cell-padding-vertical)", cellPaddingHorizontal: "var(--infinite-menu-cell-padding-horizontal)", cellMarginVertical: "var(--infinite-menu-cell-margin-vertical)", itemDisabledBackground: "var(--infinite-menu-item-disabled-background)", itemActiveBackground: "var(--infinite-menu-item-active-background)", itemActiveOpacity: "var(--infinite-menu-item-active-opacity)", itemPressedOpacity: "var(--infinite-menu-item-pressed-opacity)", itemPressedBackground: "var(--infinite-menu-item-pressed-background)", itemDisabledOpacity: "var(--infinite-menu-item-disabled-opacity)", borderRadius: "var(--infinite-menu-border-radius)", shadowColor: "var(--infinite-menu-shadow-color)" }, RowDetail: { background: "var(--infinite-rowdetail-background)", padding: "var(--infinite-rowdetail-padding)", gridHeight: "var(--infinite-rowdetail-grid-height)" }, Row: { background: "var(--infinite-row-background)", oddBackground: "var(--infinite-row-odd-background)", selectedBackground: "var(--infinite-row-selected-background)", activeBackground: "var(--infinite-active-row-background)", activeBorderColor: "var(--infinite-active-row-border-color)", activeBorderWidth: "var(--infinite-active-row-border-width)", activeBorderStyle: "var(--infinite-active-row-border-style)", activeBorder: "var(--infinite-active-row-border)", activeBackgroundAlpha: "var(--infinite-active-row-background-alpha)", activeBackgroundAlphaWhenTableUnfocused: "var(--infinite-active-row-background-alpha--table-unfocused)", hoverBackground: "var(--infinite-row-hover-background)", selectedHoverBackground: "var(--infinite-row-selected-hover-background)", groupRowBackground: "var(--infinite-group-row-background)", groupRowColumnNesting: "var(--infinite-group-row-column-nesting)", groupNesting: "var(--infinite-dont-override-group-row-nesting-length)", pointerEventsWhileScrolling: "var(--infinite-row-pointer-events-while-scrolling)" }, ColumnCell: { background: "var(--infinite-column-cell-bg-dont-override)" } } };
1432
+ var ThemeVars = { color: { accent: "var(--infinite-accent-color)", error: "var(--infinite-error-color)", color: "var(--infinite-color)" }, spacing: { "0": "var(--infinite-space-0)", "1": "var(--infinite-space-1)", "2": "var(--infinite-space-2)", "3": "var(--infinite-space-3)", "4": "var(--infinite-space-4)", "5": "var(--infinite-space-5)", "6": "var(--infinite-space-6)", "7": "var(--infinite-space-7)", "8": "var(--infinite-space-8)", "9": "var(--infinite-space-9)", "10": "var(--infinite-space-10)" }, fontSize: { "0": "var(--infinite-font-size-0)", "1": "var(--infinite-font-size-1)", "2": "var(--infinite-font-size-2)", "3": "var(--infinite-font-size-3)", "4": "var(--infinite-font-size-4)", "5": "var(--infinite-font-size-5)", "6": "var(--infinite-font-size-6)", "7": "var(--infinite-font-size-7)" }, fontFamily: "var(--infinite-font-family)", minHeight: "var(--infinite-min-height)", borderRadius: "var(--infinite-border-radius)", background: "var(--infinite-background)", iconSize: "var(--infinite-icon-size)", runtime: { bodyWidth: "var(--infinite-runtime-body-content-width)", totalVisibleColumnsWidth: "var(--infinite-runtime-total-visible-columns-width)", visibleColumnsCount: "var(--infinite-runtime-visible-columns-count)" }, components: { LoadMask: { padding: "var(--infinite-load-mask-padding)", color: "var(--infinite-load-mask-color)", textBackground: "var(--infinite-load-mask-text-background)", overlayBackground: "var(--infinite-load-mask-overlay-background)", overlayOpacity: "var(--infinite-load-mask-overlay-opacity)", borderRadius: "var(--infinite-load-mask-border-radius)" }, Header: { background: "var(--infinite-header-background)", color: "var(--infinite-header-color)", columnHeaderHeight: "var(--infinite-column-header-height)" }, HeaderCell: { background: "var(--infinite-header-cell-background)", hoverBackground: "var(--infinite-header-cell-hover-background)", border: "var(--infinite-header-cell-border)", padding: "var(--infinite-header-cell-padding)", paddingX: "var(--infinite-header-cell-padding-x)", paddingY: "var(--infinite-header-cell-padding-y)", iconSize: "var(--infinite-header-cell-icon-size)", menuIconLineWidth: "var(--infinite-header-cell-menu-icon-line-width)", sortIconMargin: "var(--infinite-header-cell-sort-icon-margin)", borderRight: "var(--infinite-header-cell-border-right)", resizeHandleActiveAreaWidth: "var(--infinite-resize-handle-active-area-width)", resizeHandleWidth: "var(--infinite-resize-handle-width)", resizeHandleHoverBackground: "var(--infinite-resize-handle-hover-background)", resizeHandleConstrainedHoverBackground: "var(--infinite-resize-handle-constrained-hover-background)", filterOperatorPaddingX: "var(--infinite-filter-operator-padding-x)", filterEditorPaddingX: "var(--infinite-filter-editor-padding-x)", filterEditorMarginX: "var(--infinite-filter-editor-margin-x)", filterOperatorPaddingY: "var(--infinite-filter-operator-padding-y)", filterEditorPaddingY: "var(--infinite-filter-editor-padding-y)", filterEditorMarginY: "var(--infinite-filter-editor-margin-y)", filterEditorBackground: "var(--infinite-filter-editor-background)", filterEditorBorder: "var(--infinite-filter-editor-border)", filterEditorFocusBorderColor: "var(--infinite-filter-editor-focus-border-color)", filterEditorBorderRadius: "var(--infinite-filter-editor-border-radius)", filterEditorColor: "var(--infinite-filter-editor-color)" }, ActiveCellIndicator: { inset: "var(--infinite-active-cell-indicator-inset)" }, Cell: { padding: "var(--infinite-cell-padding)", borderWidth: "var(--infinite-cell-border-width)", border: "var(--infinite-cell-border)", borderLeft: "var(--infinite-cell-border-left)", borderRight: "var(--infinite-cell-border-right)", borderTop: "var(--infinite-cell-border-top)", borderInvisible: "var(--infinite-cell-border-invisible)", borderRadius: "var(--infinite-cell-border-radius)", reorderEffectDuration: "var(--infinite-column-reorder-effect-duration)", pinnedBorder: "var(--infinite-pinned-cell-border)", color: "var(--infinite-cell-color)", selectedBackground: "var(--infinite-selected-cell-background)", selectedBackgroundDefault: "var(--infinite-selected-cell-background-default)", selectedBackgroundAlpha: "var(--infinite-selected-cell-background-alpha)", selectedBackgroundAlphaWhenTableUnfocused: "var(--infinite-selected-cell-background-alpha--table-unfocused)", selectedBorderColor: "var(--infinite-selected-cell-border-color)", selectedBorderWidth: "var(--infinite-selected-cell-border-width)", selectedBorderStyle: "var(--infinite-selected-cell-border-style)", selectedBorder: "var(--infinite-selected-cell-border)", activeBackgroundAlpha: "var(--infinite-active-cell-background-alpha)", activeBackgroundAlphaWhenTableUnfocused: "var(--infinite-active-cell-background-alpha--table-unfocused)", activeBackground: "var(--infinite-active-cell-background)", activeBackgroundDefault: "var(--infinite-active-cell-background-default)", activeBorderColor: "var(--infinite-active-cell-border-color)", activeBorderWidth: "var(--infinite-active-cell-border-width)", activeBorderStyle: "var(--infinite-active-cell-border-style)", activeBorder: "var(--infinite-active-cell-border)" }, SelectionCheckBox: { marginInline: "var(--infinite-selection-checkbox-margin-inline)" }, Menu: { background: "var(--infinite-menu-background)", color: "var(--infinite-menu-color)", separatorColor: "var(--infinite-menu-separator-color)", padding: "var(--infinite-menu-padding)", cellPaddingVertical: "var(--infinite-menu-cell-padding-vertical)", cellPaddingHorizontal: "var(--infinite-menu-cell-padding-horizontal)", cellMarginVertical: "var(--infinite-menu-cell-margin-vertical)", itemDisabledBackground: "var(--infinite-menu-item-disabled-background)", itemActiveBackground: "var(--infinite-menu-item-active-background)", itemActiveOpacity: "var(--infinite-menu-item-active-opacity)", itemPressedOpacity: "var(--infinite-menu-item-pressed-opacity)", itemPressedBackground: "var(--infinite-menu-item-pressed-background)", itemDisabledOpacity: "var(--infinite-menu-item-disabled-opacity)", borderRadius: "var(--infinite-menu-border-radius)", shadowColor: "var(--infinite-menu-shadow-color)" }, RowDetail: { background: "var(--infinite-rowdetail-background)", padding: "var(--infinite-rowdetail-padding)", gridHeight: "var(--infinite-rowdetail-grid-height)" }, Row: { background: "var(--infinite-row-background)", oddBackground: "var(--infinite-row-odd-background)", selectedBackground: "var(--infinite-row-selected-background)", activeBackground: "var(--infinite-active-row-background)", activeBorderColor: "var(--infinite-active-row-border-color)", activeBorderWidth: "var(--infinite-active-row-border-width)", activeBorderStyle: "var(--infinite-active-row-border-style)", activeBorder: "var(--infinite-active-row-border)", activeBackgroundAlpha: "var(--infinite-active-row-background-alpha)", activeBackgroundAlphaWhenTableUnfocused: "var(--infinite-active-row-background-alpha--table-unfocused)", hoverBackground: "var(--infinite-row-hover-background)", selectedHoverBackground: "var(--infinite-row-selected-hover-background)", groupRowBackground: "var(--infinite-group-row-background)", groupRowColumnNesting: "var(--infinite-group-row-column-nesting)", groupNesting: "var(--infinite-dont-override-group-row-nesting-length)", pointerEventsWhileScrolling: "var(--infinite-row-pointer-events-while-scrolling)" }, ColumnCell: { background: "var(--infinite-column-cell-bg-dont-override)" } } };
1430
1433
  var columnHeaderHeightName = "column-header-height";
1431
1434
 
1432
1435
  // src/components/InfiniteTable/utils/infiniteDOMUtils.ts
@@ -4135,8 +4138,8 @@ var useRerender = () => {
4135
4138
  };
4136
4139
 
4137
4140
  // src/components/InfiniteTable/components/ActiveCellIndicator.css.ts
4138
- var ActiveCellIndicatorCls = { visible: "ActiveCellIndicator_ActiveCellIndicatorCls_visible__nxbq1c2 ActiveCellIndicator_ActiveCellIndicator__nxbq1c1 utilities_pointerEvents_none__16lm1iwl utilities_position_sticky__16lm1iw4 utilities_left_0__16lm1iw1e utilities_top_0__16lm1iw1c", hidden: "ActiveCellIndicator_ActiveCellIndicatorCls_hidden__nxbq1c3 ActiveCellIndicator_ActiveCellIndicator__nxbq1c1 utilities_pointerEvents_none__16lm1iwl utilities_position_sticky__16lm1iw4 utilities_left_0__16lm1iw1e utilities_top_0__16lm1iw1c" };
4139
- var ActiveIndicatorWrapperCls = "utilities_pointerEvents_none__16lm1iwl utilities_position_sticky__16lm1iw4 utilities_left_0__16lm1iw1e utilities_top_0__16lm1iw1c utilities_height_0__16lm1iw18 utilities_zIndex_1000000__16lm1iwu";
4141
+ var ActiveCellIndicatorCls = { visible: "ActiveCellIndicator_ActiveCellIndicatorCls_visible__nxbq1c2 ActiveCellIndicator_ActiveCellIndicator__nxbq1c1 utilities_pointerEvents_none__16lm1iwl utilities_position_absolute__16lm1iw2", hidden: "ActiveCellIndicator_ActiveCellIndicatorCls_hidden__nxbq1c3 ActiveCellIndicator_ActiveCellIndicator__nxbq1c1 utilities_pointerEvents_none__16lm1iwl utilities_position_absolute__16lm1iw2" };
4142
+ var ActiveIndicatorWrapperCls = "ActiveCellIndicator_ActiveIndicatorWrapperCls__nxbq1c0 utilities_pointerEvents_none__16lm1iwl utilities_position_sticky__16lm1iw4 utilities_left_0__16lm1iw1e utilities_top_0__16lm1iw1c utilities_height_0__16lm1iw18 utilities_zIndex_1000000__16lm1iwu";
4140
4143
 
4141
4144
  // src/components/InfiniteTable/components/ActiveRowIndicator.css.ts
4142
4145
  var ActiveRowIndicatorCls = { visible: "ActiveRowIndicator_ActiveRowIndicatorCls_visible__j26lrx1 ActiveRowIndicator_ActiveRowIndicator__j26lrx0 utilities_pointerEvents_none__16lm1iwl utilities_position_sticky__16lm1iw4 utilities_width_100%__16lm1iw1b utilities_top_0__16lm1iw1c utilities_left_0__16lm1iw1e", hidden: "ActiveRowIndicator_ActiveRowIndicatorCls_hidden__j26lrx2 ActiveRowIndicator_ActiveRowIndicator__j26lrx0 utilities_pointerEvents_none__16lm1iwl utilities_position_sticky__16lm1iw4 utilities_width_100%__16lm1iw1b utilities_top_0__16lm1iw1c utilities_left_0__16lm1iw1e" };
@@ -4206,13 +4209,6 @@ var import_react9 = require("react");
4206
4209
  var { rootClassName: rootClassName4 } = internalProps;
4207
4210
  var baseCls2 = `${rootClassName4}-ActiveCellIndicator`;
4208
4211
  var columnZIndexAtIndex2 = stripVar(InternalVars.columnZIndexAtIndex);
4209
- var ActiveStyle2 = {
4210
- [stripVar(InternalVars.activeCellOffsetX)]: InternalVars.activeCellColOffset,
4211
- [stripVar(InternalVars.activeCellOffsetY)]: InternalVars.activeCellRowOffset,
4212
- transform: `translate3d(${InternalVars.activeCellOffsetX}, ${InternalVars.activeCellOffsetY}, 0px)`,
4213
- width: InternalVars.activeCellColWidth,
4214
- height: InternalVars.activeCellRowHeight
4215
- };
4216
4212
  var reposition = (brain, activeCellIndex, rowHeight, domRef) => {
4217
4213
  if (activeCellIndex == null) {
4218
4214
  return;
@@ -4251,6 +4247,7 @@ var ActiveCellIndicatorFn = (props) => {
4251
4247
  "div",
4252
4248
  {
4253
4249
  className: ActiveIndicatorWrapperCls,
4250
+ ref: domRef,
4254
4251
  "data-name": "active-cell",
4255
4252
  style: active ? {
4256
4253
  zIndex: `var(${columnZIndexAtIndex2}-${props.activeCellIndex[1]})`
@@ -4259,10 +4256,8 @@ var ActiveCellIndicatorFn = (props) => {
4259
4256
  /* @__PURE__ */ React12.createElement(
4260
4257
  "div",
4261
4258
  {
4262
- ref: domRef,
4263
4259
  "data-name": "active-cell-indicator",
4264
- className: `${baseCls2} ${active ? ActiveCellIndicatorCls.visible : ActiveCellIndicatorCls.hidden}`,
4265
- style: active ? ActiveStyle2 : void 0
4260
+ className: `${baseCls2} ${active ? ActiveCellIndicatorCls.visible : ActiveCellIndicatorCls.hidden}`
4266
4261
  }
4267
4262
  )
4268
4263
  )
@@ -4293,6 +4288,10 @@ function useMatrixBrain(brain, brainOptions, fixedCellsInfo) {
4293
4288
  colspan: brainOptions.colspan
4294
4289
  });
4295
4290
  }
4291
+ var CHILD_TO_SCROLL_CLS = join(
4292
+ scrollTransformTargetCls,
4293
+ VirtualScrollContainerChildToScrollCls
4294
+ );
4296
4295
  function HeadlessTable(props) {
4297
4296
  const _a = props, {
4298
4297
  brain,
@@ -4371,7 +4370,7 @@ function HeadlessTable(props) {
4371
4370
  "div",
4372
4371
  {
4373
4372
  ref: domRef,
4374
- className: scrollTransformTargetCls,
4373
+ className: CHILD_TO_SCROLL_CLS,
4375
4374
  "data-name": "scroll-transform-target"
4376
4375
  },
4377
4376
  /* @__PURE__ */ React13.createElement(
@@ -4799,7 +4798,7 @@ function useComponentState() {
4799
4798
  return React14.useContext(Context);
4800
4799
  }
4801
4800
 
4802
- // src/components/InfiniteTable/components/InfiniteTableBody/InfiniteTableBody.tsx
4801
+ // src/components/InfiniteTable/components/InfiniteTableFooter/InfiniteTableFooter.tsx
4803
4802
  var React15 = __toESM(require("react"));
4804
4803
 
4805
4804
  // src/components/InfiniteTable/hooks/useInternalProps.ts
@@ -4826,49 +4825,25 @@ var userSelect = { none: "utilities_userSelect_none__16lm1iw17" };
4826
4825
  var visibility = { visible: "utilities_visibility_visible__16lm1iw20", hidden: "utilities_visibility_hidden__16lm1iw21" };
4827
4826
  var zIndex = { "1": "utilities_zIndex_1__16lm1iwo", "10": "utilities_zIndex_10__16lm1iwp", "100": "utilities_zIndex_100__16lm1iwq", "1000": "utilities_zIndex_1000__16lm1iwr", "10000": "utilities_zIndex_10000__16lm1iws", "100000": "utilities_zIndex_100000__16lm1iwt", "1000000": "utilities_zIndex_1000000__16lm1iwu", "10000000": "utilities_zIndex_10000000__16lm1iwv", "1k": "utilities_zIndex_1k__16lm1iww", "10k": "utilities_zIndex_10k__16lm1iwx", "100k": "utilities_zIndex_100k__16lm1iwy" };
4828
4827
 
4829
- // src/components/InfiniteTable/components/InfiniteTableBody/InfiniteTableBody.tsx
4830
- var InfiniteTableBody = React15.forwardRef(function InfiniteTableBody2(props, ref) {
4828
+ // src/components/InfiniteTable/components/InfiniteTableFooter/InfiniteTableFooter.tsx
4829
+ function InfiniteTableFooter(props) {
4831
4830
  const { rootClassName: rootClassName12 } = useInternalProps();
4832
4831
  return /* @__PURE__ */ React15.createElement(
4833
4832
  "div",
4834
- __spreadProps(__spreadValues({
4835
- ref
4836
- }, props), {
4833
+ __spreadProps(__spreadValues({}, props), {
4837
4834
  className: join(
4838
- `${rootClassName12}Body`,
4835
+ `${rootClassName12}Footer`,
4839
4836
  position.relative,
4840
- flex["1"],
4841
- transformTranslateZero,
4837
+ display.flex,
4838
+ flexFlow.row,
4842
4839
  props.className
4843
4840
  )
4844
4841
  })
4845
4842
  );
4846
- });
4847
-
4848
- // src/components/InfiniteTable/components/InfiniteTableFooter/InfiniteTableFooter.tsx
4849
- var React16 = __toESM(require("react"));
4850
- var InfiniteTableFooter = React16.forwardRef(
4851
- function InfiniteTableFooter2(props, ref) {
4852
- const { rootClassName: rootClassName12 } = useInternalProps();
4853
- return /* @__PURE__ */ React16.createElement(
4854
- "div",
4855
- __spreadProps(__spreadValues({
4856
- ref
4857
- }, props), {
4858
- className: join(
4859
- `${rootClassName12}Footer`,
4860
- position.relative,
4861
- display.flex,
4862
- flexFlow.row,
4863
- props.className
4864
- )
4865
- })
4866
- );
4867
- }
4868
- );
4843
+ }
4869
4844
 
4870
4845
  // src/components/InfiniteTable/components/InfiniteTableHeader/InfiniteTableHeaderCell.tsx
4871
- var React43 = __toESM(require("react"));
4846
+ var React42 = __toESM(require("react"));
4872
4847
  var import_react29 = require("react");
4873
4848
  var import_react_dom = require("react-dom");
4874
4849
 
@@ -4882,7 +4857,7 @@ function keyMirror(obj) {
4882
4857
  }
4883
4858
 
4884
4859
  // src/components/InfiniteTable/components/icons/Icon.tsx
4885
- var React17 = __toESM(require("react"));
4860
+ var React16 = __toESM(require("react"));
4886
4861
  var Icon = (props) => {
4887
4862
  var _a;
4888
4863
  const size = (_a = props.size) != null ? _a : `var(--infinite-icon-size)`;
@@ -4894,69 +4869,69 @@ var Icon = (props) => {
4894
4869
  }, props.style);
4895
4870
  return (
4896
4871
  //@ts-ignore
4897
- /* @__PURE__ */ React17.createElement("svg", __spreadProps(__spreadValues({ viewBox: "0 0 24 24" }, props), { style: style2 }), props.children)
4872
+ /* @__PURE__ */ React16.createElement("svg", __spreadProps(__spreadValues({ viewBox: "0 0 24 24" }, props), { style: style2 }), props.children)
4898
4873
  );
4899
4874
  };
4900
4875
 
4901
4876
  // src/components/InfiniteTable/components/icons/IncludesOperatorIcon.tsx
4902
- var React18 = __toESM(require("react"));
4877
+ var React17 = __toESM(require("react"));
4903
4878
  var IncludesOperatorIcon = (props) => {
4904
- return /* @__PURE__ */ React18.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React18.createElement("path", { d: "M5,4V7H10.5V19H13.5V7H19V4H5Z" }));
4879
+ return /* @__PURE__ */ React17.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React17.createElement("path", { d: "M5,4V7H10.5V19H13.5V7H19V4H5Z" }));
4905
4880
  };
4906
4881
 
4907
4882
  // src/components/InfiniteTable/components/icons/EndsWithOperatorIcon.tsx
4908
- var React19 = __toESM(require("react"));
4883
+ var React18 = __toESM(require("react"));
4909
4884
  var EndsWithOperatorIcon = (props) => {
4910
- return /* @__PURE__ */ React19.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React19.createElement("path", { d: "M11.14 4L6.43 16H8.36L9.32 13.43H14.67L15.64 16H17.57L12.86 4M12 6.29L14.03 11.71H9.96M20 14V18H2V20H22V14Z" }));
4885
+ return /* @__PURE__ */ React18.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React18.createElement("path", { d: "M11.14 4L6.43 16H8.36L9.32 13.43H14.67L15.64 16H17.57L12.86 4M12 6.29L14.03 11.71H9.96M20 14V18H2V20H22V14Z" }));
4911
4886
  };
4912
4887
 
4913
4888
  // src/components/InfiniteTable/components/icons/EqualOperatorIcon.tsx
4914
- var React20 = __toESM(require("react"));
4889
+ var React19 = __toESM(require("react"));
4915
4890
  var EqualOperatorIcon = (props) => {
4916
- return /* @__PURE__ */ React20.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React20.createElement("path", { d: "M19,10H5V8H19V10M19,16H5V14H19V16Z" }));
4891
+ return /* @__PURE__ */ React19.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React19.createElement("path", { d: "M19,10H5V8H19V10M19,16H5V14H19V16Z" }));
4917
4892
  };
4918
4893
 
4919
4894
  // src/components/InfiniteTable/components/icons/GTEOperatorIcon.tsx
4920
- var React21 = __toESM(require("react"));
4895
+ var React20 = __toESM(require("react"));
4921
4896
  var GTEOperatorIcon = (props) => {
4922
- return /* @__PURE__ */ React21.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React21.createElement("path", { d: "M6.5,2.27L20,10.14L6.5,18L5.5,16.27L16.03,10.14L5.5,4L6.5,2.27M20,20V22H5V20H20Z" }));
4897
+ return /* @__PURE__ */ React20.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React20.createElement("path", { d: "M6.5,2.27L20,10.14L6.5,18L5.5,16.27L16.03,10.14L5.5,4L6.5,2.27M20,20V22H5V20H20Z" }));
4923
4898
  };
4924
4899
 
4925
4900
  // src/components/InfiniteTable/components/icons/GTOperatorIcon.tsx
4926
- var React22 = __toESM(require("react"));
4901
+ var React21 = __toESM(require("react"));
4927
4902
  var GTOperatorIcon = (props) => {
4928
- return /* @__PURE__ */ React22.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React22.createElement("path", { d: "M5.5,4.14L4.5,5.86L15,12L4.5,18.14L5.5,19.86L19,12L5.5,4.14Z" }));
4903
+ return /* @__PURE__ */ React21.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React21.createElement("path", { d: "M5.5,4.14L4.5,5.86L15,12L4.5,18.14L5.5,19.86L19,12L5.5,4.14Z" }));
4929
4904
  };
4930
4905
 
4931
4906
  // src/components/InfiniteTable/components/icons/LTEOperatorIcon.tsx
4932
- var React23 = __toESM(require("react"));
4907
+ var React22 = __toESM(require("react"));
4933
4908
  var LTEOperatorIcon = (props) => {
4934
- return /* @__PURE__ */ React23.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React23.createElement("path", { d: "M18.5,2.27L5,10.14L18.5,18L19.5,16.27L8.97,10.14L19.5,4L18.5,2.27M5,20V22H20V20H5Z" }));
4909
+ return /* @__PURE__ */ React22.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React22.createElement("path", { d: "M18.5,2.27L5,10.14L18.5,18L19.5,16.27L8.97,10.14L19.5,4L18.5,2.27M5,20V22H20V20H5Z" }));
4935
4910
  };
4936
4911
 
4937
4912
  // src/components/InfiniteTable/components/icons/LTOperatorIcon.tsx
4938
- var React24 = __toESM(require("react"));
4913
+ var React23 = __toESM(require("react"));
4939
4914
  var LTOperatorIcon = (props) => {
4940
- return /* @__PURE__ */ React24.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React24.createElement("path", { d: "M18.5,4.14L19.5,5.86L8.97,12L19.5,18.14L18.5,19.86L5,12L18.5,4.14Z" }));
4915
+ return /* @__PURE__ */ React23.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React23.createElement("path", { d: "M18.5,4.14L19.5,5.86L8.97,12L19.5,18.14L18.5,19.86L5,12L18.5,4.14Z" }));
4941
4916
  };
4942
4917
 
4943
4918
  // src/components/InfiniteTable/components/icons/NotEqualOperatorIcon.tsx
4944
- var React25 = __toESM(require("react"));
4919
+ var React24 = __toESM(require("react"));
4945
4920
  var NotEqualOperatorIcon = (props) => {
4946
- return /* @__PURE__ */ React25.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React25.createElement("path", { d: "M21,10H9V8H21V10M21,16H9V14H21V16M4,5H6V16H4V5M6,18V20H4V18H6Z" }));
4921
+ return /* @__PURE__ */ React24.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React24.createElement("path", { d: "M21,10H9V8H21V10M21,16H9V14H21V16M4,5H6V16H4V5M6,18V20H4V18H6Z" }));
4947
4922
  };
4948
4923
 
4949
4924
  // src/components/InfiniteTable/components/icons/StartsWithOperatorIcon.tsx
4950
- var React26 = __toESM(require("react"));
4925
+ var React25 = __toESM(require("react"));
4951
4926
  var StartsWithOperatorIcon = (props) => {
4952
- return /* @__PURE__ */ React26.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React26.createElement("path", { d: "M11.14 4L6.43 16H8.36L9.32 13.43H14.67L15.64 16H17.57L12.86 4M12 6.29L14.03 11.71H9.96M4 18V15H2V20H22V18Z" }));
4927
+ return /* @__PURE__ */ React25.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React25.createElement("path", { d: "M11.14 4L6.43 16H8.36L9.32 13.43H14.67L15.64 16H17.57L12.86 4M12 6.29L14.03 11.71H9.96M4 18V15H2V20H22V18Z" }));
4953
4928
  };
4954
4929
 
4955
4930
  // src/components/InfiniteTable/components/FilterEditors.tsx
4956
- var React30 = __toESM(require("react"));
4931
+ var React29 = __toESM(require("react"));
4957
4932
 
4958
4933
  // src/components/InfiniteTable/components/InfiniteTableHeader/InfiniteTableColumnHeaderFilter.tsx
4959
- var React29 = __toESM(require("react"));
4934
+ var React28 = __toESM(require("react"));
4960
4935
  var import_react20 = require("react");
4961
4936
 
4962
4937
  // src/components/InfiniteTable/hooks/useInfiniteTable.ts
@@ -4989,7 +4964,7 @@ var useInfiniteTableState = () => {
4989
4964
  };
4990
4965
 
4991
4966
  // src/components/InfiniteTable/components/icons/FilterIcon.tsx
4992
- var React27 = __toESM(require("react"));
4967
+ var React26 = __toESM(require("react"));
4993
4968
  var import_react18 = require("react");
4994
4969
 
4995
4970
  // ../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js
@@ -5163,7 +5138,7 @@ function FilterIcon(props) {
5163
5138
  return null;
5164
5139
  }
5165
5140
  const indexStyle = {};
5166
- return /* @__PURE__ */ React27.createElement(
5141
+ return /* @__PURE__ */ React26.createElement(
5167
5142
  "div",
5168
5143
  {
5169
5144
  "data-name": "filter-icon",
@@ -5175,7 +5150,7 @@ function FilterIcon(props) {
5175
5150
  `${InfiniteTableIconClassName}-sort`
5176
5151
  )
5177
5152
  },
5178
- showIndex ? /* @__PURE__ */ React27.createElement(
5153
+ showIndex ? /* @__PURE__ */ React26.createElement(
5179
5154
  "div",
5180
5155
  {
5181
5156
  "data-name": "index",
@@ -5184,9 +5159,9 @@ function FilterIcon(props) {
5184
5159
  },
5185
5160
  index
5186
5161
  ) : null,
5187
- /* @__PURE__ */ React27.createElement("div", { style: __spreadValues({ width: sizes[0] }, lineStyle) }),
5188
- /* @__PURE__ */ React27.createElement("div", { style: __spreadValues({ width: sizes[1] }, lineStyle) }),
5189
- /* @__PURE__ */ React27.createElement("div", { style: __spreadValues({ width: sizes[2] }, lineStyle) })
5162
+ /* @__PURE__ */ React26.createElement("div", { style: __spreadValues({ width: sizes[0] }, lineStyle) }),
5163
+ /* @__PURE__ */ React26.createElement("div", { style: __spreadValues({ width: sizes[1] }, lineStyle) }),
5164
+ /* @__PURE__ */ React26.createElement("div", { style: __spreadValues({ width: sizes[2] }, lineStyle) })
5190
5165
  );
5191
5166
  }
5192
5167
 
@@ -5711,11 +5686,11 @@ var getComputedColumns = ({
5711
5686
  {}
5712
5687
  );
5713
5688
  const normalizedColumnOrder = adjustColumnOrderForPinning(
5714
- columnOrder === true ? [...columns.keys()] : columnOrder,
5689
+ columnOrder === true ? Object.keys(columns) : columnOrder,
5715
5690
  columnPinning
5716
5691
  );
5717
5692
  const visibleColumnOrder = normalizedColumnOrder.filter((colId) => {
5718
- const col = columns.get(colId);
5693
+ const col = columns[colId];
5719
5694
  if (!col) {
5720
5695
  logError(
5721
5696
  `Column with id "${colId}" specified in columnOrder array cannot be found in the columns map.`
@@ -5732,7 +5707,7 @@ var getComputedColumns = ({
5732
5707
  const columnIdsToVisibleIndex = /* @__PURE__ */ new Map();
5733
5708
  const visibleColumnsArray = visibleColumnOrder.map(
5734
5709
  (columnId, index) => {
5735
- const col = columns.get(columnId);
5710
+ const col = columns[columnId];
5736
5711
  columnIdsToVisibleIndex.set(columnId, index);
5737
5712
  return col;
5738
5713
  }
@@ -5753,7 +5728,7 @@ var getComputedColumns = ({
5753
5728
  );
5754
5729
  function getColSize(colId) {
5755
5730
  var _a, _b, _c, _d, _e, _f;
5756
- const column = columns.get(colId);
5731
+ const column = columns[colId];
5757
5732
  const colType = getColumnComputedType(column, columnTypes);
5758
5733
  const colTypeSizing = {
5759
5734
  minWidth: colType == null ? void 0 : colType.minWidth,
@@ -5844,7 +5819,8 @@ var getComputedColumns = ({
5844
5819
  orderedColumns.set(id, c);
5845
5820
  });
5846
5821
  const columnIdsInitialColumnOrder = [];
5847
- columns.forEach((c, key) => {
5822
+ Object.keys(columns).forEach((key) => {
5823
+ const c = columns[key];
5848
5824
  columnIdsInitialColumnOrder.push(key);
5849
5825
  if (!orderedColumns.has(key)) {
5850
5826
  orderedColumns.set(key, c);
@@ -6244,14 +6220,14 @@ function InfiniteTableColumnHeaderFilter(props) {
6244
6220
  const FilterEditor = props.filterEditor;
6245
6221
  const FilterOperatorSwitch = props.filterOperatorSwitch;
6246
6222
  const [focused, setFocused] = (0, import_react20.useState)(false);
6247
- const onFocus = React29.useCallback(() => {
6223
+ const onFocus = React28.useCallback(() => {
6248
6224
  setFocused(true);
6249
6225
  }, []);
6250
- const onBlur = React29.useCallback(() => {
6226
+ const onBlur = React28.useCallback(() => {
6251
6227
  setFocused(false);
6252
6228
  }, []);
6253
6229
  const active = filterOperatorMenuVisibleForColumnId === column.id || focused;
6254
- return /* @__PURE__ */ React29.createElement(
6230
+ return /* @__PURE__ */ React28.createElement(
6255
6231
  "div",
6256
6232
  {
6257
6233
  onPointerUp: stopPropagation,
@@ -6265,14 +6241,14 @@ function InfiniteTableColumnHeaderFilter(props) {
6265
6241
  )}`,
6266
6242
  style: { height: props.columnHeaderHeight }
6267
6243
  },
6268
- /* @__PURE__ */ React29.createElement(InfiniteTableColumnHeaderFilterContext.Provider, { value: props }, /* @__PURE__ */ React29.createElement(FilterOperatorSwitch, null), /* @__PURE__ */ React29.createElement(FilterEditor, null))
6244
+ /* @__PURE__ */ React28.createElement(InfiniteTableColumnHeaderFilterContext.Provider, { value: props }, /* @__PURE__ */ React28.createElement(FilterOperatorSwitch, null), /* @__PURE__ */ React28.createElement(FilterEditor, null))
6269
6245
  );
6270
6246
  }
6271
6247
  function InfiniteTableFilterOperatorSwitch() {
6272
6248
  var _a, _b;
6273
6249
  const { columnApi, disabled, operator } = useInfiniteColumnFilterEditor();
6274
6250
  const Icon2 = (_b = (_a = operator == null ? void 0 : operator.components) == null ? void 0 : _a.Icon) != null ? _b : FilterIcon;
6275
- return /* @__PURE__ */ React29.createElement(
6251
+ return /* @__PURE__ */ React28.createElement(
6276
6252
  "div",
6277
6253
  {
6278
6254
  "data-name": "filter-operator",
@@ -6290,7 +6266,7 @@ function InfiniteTableFilterOperatorSwitch() {
6290
6266
  disabled ? `${InfiniteTableColumnHeaderFilterOperatorClassName}--disabled` : ""
6291
6267
  )
6292
6268
  },
6293
- /* @__PURE__ */ React29.createElement(
6269
+ /* @__PURE__ */ React28.createElement(
6294
6270
  Icon2,
6295
6271
  {
6296
6272
  size: 20,
@@ -6302,7 +6278,7 @@ function InfiniteTableFilterOperatorSwitch() {
6302
6278
  );
6303
6279
  }
6304
6280
  function InfiniteTableColumnHeaderFilterEmpty() {
6305
- return /* @__PURE__ */ React29.createElement(
6281
+ return /* @__PURE__ */ React28.createElement(
6306
6282
  "div",
6307
6283
  {
6308
6284
  onPointerUp: stopPropagation,
@@ -6319,7 +6295,7 @@ function useInfiniteColumnFilterEditor() {
6319
6295
  const context = useInfiniteTable();
6320
6296
  const { column, columnApi } = useInfiniteHeaderCell();
6321
6297
  const columnLabel = getColumnLabel(column, context);
6322
- const filterContextValue = React29.useContext(
6298
+ const filterContextValue = React28.useContext(
6323
6299
  InfiniteTableColumnHeaderFilterContext
6324
6300
  );
6325
6301
  const { columnFilterType, filterTypes, columnFilterValue } = filterContextValue;
@@ -6327,17 +6303,17 @@ function useInfiniteColumnFilterEditor() {
6327
6303
  const [theValue, setTheValue] = (0, import_react20.useState)(
6328
6304
  (_a = columnFilterValue == null ? void 0 : columnFilterValue.filter.value) != null ? _a : ""
6329
6305
  );
6330
- const onInputChange = React29.useCallback(
6306
+ const onInputChange = React28.useCallback(
6331
6307
  (filterValue) => {
6332
6308
  setTheValue(filterValue);
6333
6309
  filterContextValue.onChange(filterValue);
6334
6310
  },
6335
6311
  [filterContextValue.onChange]
6336
6312
  );
6337
- const clearValue = React29.useCallback(() => {
6313
+ const clearValue = React28.useCallback(() => {
6338
6314
  context.api.clearColumnFilter(column.id);
6339
6315
  }, [column.id]);
6340
- const removeColumnFilter = React29.useCallback(() => {
6316
+ const removeColumnFilter = React28.useCallback(() => {
6341
6317
  context.api.removeColumnFilter(column.id);
6342
6318
  }, [column.id]);
6343
6319
  (0, import_react20.useEffect)(() => {
@@ -6380,7 +6356,7 @@ function useInfiniteColumnFilterEditor() {
6380
6356
  // src/components/InfiniteTable/components/FilterEditors.tsx
6381
6357
  function StringFilterEditor() {
6382
6358
  const { ariaLabel, value, setValue, className, disabled } = useInfiniteColumnFilterEditor();
6383
- return /* @__PURE__ */ React30.createElement(
6359
+ return /* @__PURE__ */ React29.createElement(
6384
6360
  "input",
6385
6361
  {
6386
6362
  "data-xxx": true,
@@ -6397,7 +6373,7 @@ function StringFilterEditor() {
6397
6373
  }
6398
6374
  function NumberFilterEditor() {
6399
6375
  const { ariaLabel, value, setValue, className, disabled } = useInfiniteColumnFilterEditor();
6400
- return /* @__PURE__ */ React30.createElement(
6376
+ return /* @__PURE__ */ React29.createElement(
6401
6377
  "input",
6402
6378
  {
6403
6379
  "aria-label": ariaLabel,
@@ -6638,6 +6614,17 @@ var rafFn = (fn) => {
6638
6614
  };
6639
6615
 
6640
6616
  // src/components/InfiniteTable/hooks/useDOMProps.ts
6617
+ var publicRuntimeVars = {
6618
+ bodyWidth: { name: stripVar(ThemeVars.runtime.bodyWidth), value: "" },
6619
+ totalVisibleColumnsWidth: {
6620
+ name: stripVar(ThemeVars.runtime.totalVisibleColumnsWidth),
6621
+ value: ""
6622
+ },
6623
+ visibleColumnsCount: {
6624
+ name: stripVar(ThemeVars.runtime.visibleColumnsCount),
6625
+ value: ""
6626
+ }
6627
+ };
6641
6628
  var scrollbarWidthHorizontal = stripVar(
6642
6629
  InternalVars.scrollbarWidthHorizontal
6643
6630
  );
@@ -6693,6 +6680,7 @@ function useDOMProps(initialDOMProps) {
6693
6680
  computedPinnedStartColumns,
6694
6681
  computedPinnedEndColumns,
6695
6682
  computedVisibleColumns,
6683
+ computedUnpinnedColumnsWidth,
6696
6684
  scrollbars
6697
6685
  } = computed;
6698
6686
  const prevPinnedEndCols = [];
@@ -6718,6 +6706,9 @@ function useDOMProps(initialDOMProps) {
6718
6706
  },
6719
6707
  {}
6720
6708
  );
6709
+ cssVars[publicRuntimeVars.bodyWidth.name] = `calc(${InternalVars.bodyWidth} - ${InternalVars.scrollbarWidthVertical})`;
6710
+ cssVars[publicRuntimeVars.totalVisibleColumnsWidth.name] = `${computedPinnedStartColumnsWidth + computedPinnedEndColumnsWidth + computedUnpinnedColumnsWidth}px`;
6711
+ cssVars[publicRuntimeVars.visibleColumnsCount.name] = computedVisibleColumns.length;
6721
6712
  if (activeCellIndex != null) {
6722
6713
  cssVars[activeCellColWidth] = `var(${getCSSVarNameForColWidth(
6723
6714
  activeCellIndex[1]
@@ -7457,14 +7448,14 @@ var useColumnPointerEvents = ({
7457
7448
  };
7458
7449
 
7459
7450
  // src/components/InfiniteTable/utils/RenderHookComponentForInfinite.tsx
7460
- var React38 = __toESM(require("react"));
7451
+ var React37 = __toESM(require("react"));
7461
7452
 
7462
7453
  // src/components/InfiniteTable/components/InfiniteTableRow/InfiniteTableColumnCell.tsx
7463
- var React37 = __toESM(require("react"));
7454
+ var React36 = __toESM(require("react"));
7464
7455
  var import_react25 = require("react");
7465
7456
 
7466
7457
  // src/components/InfiniteTable/utils/getColumnForGroupBy.tsx
7467
- var React33 = __toESM(require("react"));
7458
+ var React32 = __toESM(require("react"));
7468
7459
 
7469
7460
  // src/components/DataSource/state/rowInfoStatus.ts
7470
7461
  var showLoadingIcon = (rowInfo) => {
@@ -7475,7 +7466,7 @@ var showLoadingIcon = (rowInfo) => {
7475
7466
  };
7476
7467
 
7477
7468
  // src/components/InfiniteTable/components/icons/ExpanderIcon.tsx
7478
- var React31 = __toESM(require("react"));
7469
+ var React30 = __toESM(require("react"));
7479
7470
  var import_react22 = require("react");
7480
7471
 
7481
7472
  // src/components/InfiniteTable/components/icons/ExpanderIcon.css.ts
@@ -7496,12 +7487,12 @@ function ExpanderIcon(props) {
7496
7487
  setExpanded(!expanded);
7497
7488
  }
7498
7489
  };
7499
- React31.useEffect(() => {
7490
+ React30.useEffect(() => {
7500
7491
  if (isControlled("expanded", props)) {
7501
7492
  setExpanded(props.expanded);
7502
7493
  }
7503
7494
  }, [props.expanded]);
7504
- return /* @__PURE__ */ React31.createElement(
7495
+ return /* @__PURE__ */ React30.createElement(
7505
7496
  "svg",
7506
7497
  {
7507
7498
  "data-name": "expander-icon",
@@ -7524,19 +7515,19 @@ function ExpanderIcon(props) {
7524
7515
  `InfiniteIcon-expander--${direction === "end" ? "end" : "start"}`
7525
7516
  )
7526
7517
  },
7527
- /* @__PURE__ */ React31.createElement("path", { d: "M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z" })
7518
+ /* @__PURE__ */ React30.createElement("path", { d: "M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z" })
7528
7519
  );
7529
7520
  }
7530
7521
 
7531
7522
  // src/components/InfiniteTable/components/icons/LoadingIcon.tsx
7532
- var React32 = __toESM(require("react"));
7523
+ var React31 = __toESM(require("react"));
7533
7524
 
7534
7525
  // src/components/InfiniteTable/components/icons/LoadingIcon.css.ts
7535
7526
  var LoadingIconCls = "utilities_stroke_accentColor__16lm1iwb utilities_flex_none__16lm1iwn utilities_cursor_pointer__16lm1iwi";
7536
7527
 
7537
7528
  // src/components/InfiniteTable/components/icons/LoadingIcon.tsx
7538
7529
  var LoadingIcon = (props) => {
7539
- return /* @__PURE__ */ React32.createElement(
7530
+ return /* @__PURE__ */ React31.createElement(
7540
7531
  "svg",
7541
7532
  {
7542
7533
  xmlns: "http://www.w3.org/2000/svg",
@@ -7556,7 +7547,7 @@ var LoadingIcon = (props) => {
7556
7547
  "InfiniteIcon-loading"
7557
7548
  )
7558
7549
  },
7559
- /* @__PURE__ */ React32.createElement(
7550
+ /* @__PURE__ */ React31.createElement(
7560
7551
  "circle",
7561
7552
  {
7562
7553
  cx: "50",
@@ -7566,7 +7557,7 @@ var LoadingIcon = (props) => {
7566
7557
  r: "35",
7567
7558
  strokeDasharray: "164.93361431346415 56.97787143782138"
7568
7559
  },
7569
- /* @__PURE__ */ React32.createElement(
7560
+ /* @__PURE__ */ React31.createElement(
7570
7561
  "animateTransform",
7571
7562
  {
7572
7563
  attributeName: "transform",
@@ -7611,11 +7602,11 @@ function getGroupColumnRender({
7611
7602
  );
7612
7603
  if (groupRenderStrategy === "multi-column") {
7613
7604
  if (groupIndexForColumn + 1 !== groupRowInfo.groupNesting && groupRowInfo.isGroupRow) {
7614
- return selectionCheckBox ? /* @__PURE__ */ React33.createElement("div", { className }, selectionCheckBox) : null;
7605
+ return selectionCheckBox ? /* @__PURE__ */ React32.createElement("div", { className }, selectionCheckBox) : null;
7615
7606
  }
7616
7607
  } else if (groupRenderStrategy === "single-column" && !groupRowInfo.isGroupRow) {
7617
7608
  }
7618
- return /* @__PURE__ */ React33.createElement("div", { className }, groupIcon, selectionCheckBox, /* @__PURE__ */ React33.createElement("div", { className: cssEllipsisClassName }, valueToRender != null ? valueToRender : null));
7609
+ return /* @__PURE__ */ React32.createElement("div", { className }, groupIcon, selectionCheckBox, /* @__PURE__ */ React32.createElement("div", { className: cssEllipsisClassName }, valueToRender != null ? valueToRender : null));
7619
7610
  };
7620
7611
  }
7621
7612
  function getGroupColumnRenderGroupIcon({
@@ -7664,9 +7655,9 @@ function getGroupColumnRenderGroupIcon({
7664
7655
  const showExpanderIcon = pivotBy ? (((_b = groupRowInfo.groupKeys) == null ? void 0 : _b.length) || 0) < (groupBy == null ? void 0 : groupBy.length) : (((_c = groupRowInfo.groupKeys) == null ? void 0 : _c.length) || 0) <= (groupBy == null ? void 0 : groupBy.length);
7665
7656
  const isLoading = showLoadingIcon(groupRowInfo);
7666
7657
  if (isLoading) {
7667
- icon = /* @__PURE__ */ React33.createElement(LoadingIcon, null);
7658
+ icon = /* @__PURE__ */ React32.createElement(LoadingIcon, null);
7668
7659
  } else if (showExpanderIcon) {
7669
- const defaultIcon = /* @__PURE__ */ React33.createElement(
7660
+ const defaultIcon = /* @__PURE__ */ React32.createElement(
7670
7661
  ExpanderIcon,
7671
7662
  {
7672
7663
  expanded: !collapsed,
@@ -7680,7 +7671,7 @@ function getGroupColumnRenderGroupIcon({
7680
7671
  }
7681
7672
  if (initialRenderGroupIcon) {
7682
7673
  renderOptions.renderBag.groupIcon = icon;
7683
- icon = /* @__PURE__ */ React33.createElement(
7674
+ icon = /* @__PURE__ */ React32.createElement(
7684
7675
  RenderCellHookComponent,
7685
7676
  {
7686
7677
  render: initialRenderGroupIcon,
@@ -7760,7 +7751,7 @@ var ColumnCellSelectionIndicatorRecipe = createRuntimeFn({ defaultClassName: "ce
7760
7751
  var SelectionCheckboxCls = "cell_SelectionCheckboxCls__1eexc2a7";
7761
7752
 
7762
7753
  // src/components/InfiniteTable/components/CheckBox.tsx
7763
- var React34 = __toESM(require("react"));
7754
+ var React33 = __toESM(require("react"));
7764
7755
  var import_react23 = require("react");
7765
7756
 
7766
7757
  // src/components/InfiniteTable/components/CheckBox.css.ts
@@ -7799,7 +7790,7 @@ function InfiniteCheckBoxComponent() {
7799
7790
  (0, import_react23.useEffect)(() => {
7800
7791
  inputRef.current.indeterminate = checked == null;
7801
7792
  }, [checked]);
7802
- return /* @__PURE__ */ React34.createElement(
7793
+ return /* @__PURE__ */ React33.createElement(
7803
7794
  "input",
7804
7795
  __spreadProps(__spreadValues({}, domProps), {
7805
7796
  className: join("InfiniteCheckBox", CheckBoxCls, domProps == null ? void 0 : domProps.className),
@@ -7817,7 +7808,7 @@ function InfiniteCheckBoxComponent() {
7817
7808
  );
7818
7809
  }
7819
7810
  function InfiniteCheckBox(props) {
7820
- return /* @__PURE__ */ React34.createElement(InfiniteCheckBoxRoot, __spreadValues({}, props), /* @__PURE__ */ React34.createElement(InfiniteCheckBoxComponent, null));
7811
+ return /* @__PURE__ */ React33.createElement(InfiniteCheckBoxRoot, __spreadValues({}, props), /* @__PURE__ */ React33.createElement(InfiniteCheckBoxComponent, null));
7821
7812
  }
7822
7813
 
7823
7814
  // src/components/InfiniteTable/components/InfiniteTableRow/columnRendering.tsx
@@ -8128,7 +8119,7 @@ function getFormattedValueContextForCell(options) {
8128
8119
  }
8129
8120
 
8130
8121
  // src/components/InfiniteTable/components/InfiniteTableRow/InfiniteTableCell.tsx
8131
- var React35 = __toESM(require("react"));
8122
+ var React34 = __toESM(require("react"));
8132
8123
  var { rootClassName: rootClassName5 } = internalProps;
8133
8124
  var InfiniteTableCellClassName = `${rootClassName5}Cell`;
8134
8125
  var InfiniteTableCellContentClassName = `${rootClassName5}Cell_content`;
@@ -8187,7 +8178,7 @@ function InfiniteTableCellFn(props) {
8187
8178
  // ? `${InfiniteTableCellClassName}--shifting ${CellClsVariants.shifting}`
8188
8179
  // : '',
8189
8180
  ),
8190
- children: /* @__PURE__ */ React35.createElement(React35.Fragment, null, beforeChildren, /* @__PURE__ */ React35.createElement(
8181
+ children: /* @__PURE__ */ React34.createElement(React34.Fragment, null, beforeChildren, /* @__PURE__ */ React34.createElement(
8191
8182
  "div",
8192
8183
  {
8193
8184
  className: join(
@@ -8205,21 +8196,21 @@ function InfiniteTableCellFn(props) {
8205
8196
  }
8206
8197
  const RenderComponent = cellType === "body" ? (_b = column.components) == null ? void 0 : _b.ColumnCell : (_c = column.components) == null ? void 0 : _c.HeaderCell;
8207
8198
  if (RenderComponent) {
8208
- return /* @__PURE__ */ React35.createElement(RenderComponent, __spreadValues({}, finalDOMProps));
8199
+ return /* @__PURE__ */ React34.createElement(RenderComponent, __spreadValues({}, finalDOMProps));
8209
8200
  }
8210
- return /* @__PURE__ */ React35.createElement("div", __spreadProps(__spreadValues({}, finalDOMProps), { ref: domRef }));
8201
+ return /* @__PURE__ */ React34.createElement("div", __spreadProps(__spreadValues({}, finalDOMProps), { ref: domRef }));
8211
8202
  }
8212
- var InfiniteTableCell = React35.memo(
8203
+ var InfiniteTableCell = React34.memo(
8213
8204
  InfiniteTableCellFn
8214
8205
  );
8215
8206
 
8216
8207
  // src/components/InfiniteTable/components/InfiniteTableRow/InfiniteTableColumnEditor.tsx
8217
- var React36 = __toESM(require("react"));
8208
+ var React35 = __toESM(require("react"));
8218
8209
  var import_react24 = require("react");
8219
8210
  function InfiniteTableColumnEditor() {
8220
8211
  const { initialValue, setValue, confirmEdit, cancelEdit, readOnly } = useInfiniteColumnEditor();
8221
8212
  const domRef = (0, import_react24.useRef)();
8222
- const refCallback = React36.useCallback((node) => {
8213
+ const refCallback = React35.useCallback((node) => {
8223
8214
  domRef.current = node;
8224
8215
  if (node) {
8225
8216
  node.focus();
@@ -8235,7 +8226,7 @@ function InfiniteTableColumnEditor() {
8235
8226
  event.stopPropagation();
8236
8227
  }
8237
8228
  }, []);
8238
- return /* @__PURE__ */ React36.createElement(React36.Fragment, null, /* @__PURE__ */ React36.createElement(
8229
+ return /* @__PURE__ */ React35.createElement(React35.Fragment, null, /* @__PURE__ */ React35.createElement(
8239
8230
  "input",
8240
8231
  {
8241
8232
  readOnly,
@@ -8255,11 +8246,11 @@ function InfiniteTableColumnEditor() {
8255
8246
  // src/components/InfiniteTable/components/InfiniteTableRow/InfiniteTableColumnCell.tsx
8256
8247
  var { rootClassName: rootClassName6 } = internalProps;
8257
8248
  var columnZIndexAtIndex4 = stripVar(InternalVars.columnZIndexAtIndex);
8258
- var InfiniteTableColumnCellContext = React37.createContext(null);
8249
+ var InfiniteTableColumnCellContext = React36.createContext(null);
8259
8250
  var InfiniteTableColumnCellClassName = `${rootClassName6}ColumnCell`;
8260
8251
  var defaultRenderRowDetailIcon = (params) => {
8261
8252
  const { toggleCurrentRowDetails, rowDetailState } = params;
8262
- return /* @__PURE__ */ React37.createElement(
8253
+ return /* @__PURE__ */ React36.createElement(
8263
8254
  ExpanderIcon,
8264
8255
  {
8265
8256
  style: {
@@ -8280,7 +8271,7 @@ var defaultRenderSelectionCheckBox = (params) => {
8280
8271
  } = params;
8281
8272
  if (rowInfo.isGroupRow && !column.groupByForColumn) {
8282
8273
  }
8283
- return /* @__PURE__ */ React37.createElement(
8274
+ return /* @__PURE__ */ React36.createElement(
8284
8275
  InfiniteCheckBox,
8285
8276
  {
8286
8277
  domProps: {
@@ -8332,7 +8323,7 @@ function InfiniteTableColumnCellFn(props) {
8332
8323
  showZebraRows
8333
8324
  } = props;
8334
8325
  if (!column) {
8335
- return /* @__PURE__ */ React37.createElement("div", { ref: domRef }, "no column");
8326
+ return /* @__PURE__ */ React36.createElement("div", { ref: domRef }, "no column");
8336
8327
  }
8337
8328
  const { rowSelected } = rowInfo;
8338
8329
  const {
@@ -8379,7 +8370,7 @@ function InfiniteTableColumnCellFn(props) {
8379
8370
  } = colRenderingParams;
8380
8371
  const { align: align2, verticalAlign } = renderParams;
8381
8372
  const renderParam = renderParams;
8382
- const renderParamRef = React37.useRef(renderParam);
8373
+ const renderParamRef = React36.useRef(renderParam);
8383
8374
  const onClick = (0, import_react25.useCallback)(
8384
8375
  (event) => {
8385
8376
  const colIndex = column.computedVisibleIndex;
@@ -8433,7 +8424,7 @@ function InfiniteTableColumnCellFn(props) {
8433
8424
  [rowInfo]
8434
8425
  );
8435
8426
  const EditorComponent = (_b = (_a = column.components) == null ? void 0 : _a.Editor) != null ? _b : InfiniteTableColumnEditor;
8436
- const editor = inEdit ? /* @__PURE__ */ React37.createElement(CellEditorContextComponent, { contextValue: renderParam }, /* @__PURE__ */ React37.createElement(EditorComponent, null)) : null;
8427
+ const editor = inEdit ? /* @__PURE__ */ React36.createElement(CellEditorContextComponent, { contextValue: renderParam }, /* @__PURE__ */ React36.createElement(EditorComponent, null)) : null;
8437
8428
  const renderChildren = (0, import_react25.useCallback)(
8438
8429
  once(() => {
8439
8430
  if (hidden) {
@@ -8443,7 +8434,7 @@ function InfiniteTableColumnCellFn(props) {
8443
8434
  return null;
8444
8435
  }
8445
8436
  if (renderFunctions.renderGroupIcon) {
8446
- renderParam.renderBag.groupIcon = /* @__PURE__ */ React37.createElement(
8437
+ renderParam.renderBag.groupIcon = /* @__PURE__ */ React36.createElement(
8447
8438
  RenderCellHookComponent,
8448
8439
  {
8449
8440
  render: renderFunctions.renderGroupIcon,
@@ -8454,7 +8445,7 @@ function InfiniteTableColumnCellFn(props) {
8454
8445
  );
8455
8446
  }
8456
8447
  if (renderFunctions.renderSelectionCheckBox && selectionMode == "multi-row") {
8457
- renderParam.renderBag.selectionCheckBox = /* @__PURE__ */ React37.createElement(
8448
+ renderParam.renderBag.selectionCheckBox = /* @__PURE__ */ React36.createElement(
8458
8449
  RenderCellHookComponent,
8459
8450
  {
8460
8451
  render: defaultRenderSelectionCheckBox,
@@ -8462,7 +8453,7 @@ function InfiniteTableColumnCellFn(props) {
8462
8453
  }
8463
8454
  );
8464
8455
  if (renderFunctions.renderSelectionCheckBox !== true) {
8465
- renderParam.renderBag.selectionCheckBox = /* @__PURE__ */ React37.createElement(
8456
+ renderParam.renderBag.selectionCheckBox = /* @__PURE__ */ React36.createElement(
8466
8457
  RenderCellHookComponent,
8467
8458
  {
8468
8459
  render: renderFunctions.renderSelectionCheckBox,
@@ -8474,7 +8465,7 @@ function InfiniteTableColumnCellFn(props) {
8474
8465
  }
8475
8466
  }
8476
8467
  if (renderFunctions.renderRowDetailIcon) {
8477
- renderParam.renderBag.rowDetailsIcon = /* @__PURE__ */ React37.createElement(
8468
+ renderParam.renderBag.rowDetailsIcon = /* @__PURE__ */ React36.createElement(
8478
8469
  RenderCellHookComponent,
8479
8470
  {
8480
8471
  render: defaultRenderRowDetailIcon,
@@ -8484,7 +8475,7 @@ function InfiniteTableColumnCellFn(props) {
8484
8475
  }
8485
8476
  );
8486
8477
  if (typeof renderFunctions.renderRowDetailIcon === "function") {
8487
- renderParam.renderBag.rowDetailsIcon = /* @__PURE__ */ React37.createElement(
8478
+ renderParam.renderBag.rowDetailsIcon = /* @__PURE__ */ React36.createElement(
8488
8479
  RenderCellHookComponent,
8489
8480
  {
8490
8481
  render: renderFunctions.renderRowDetailIcon,
@@ -8496,7 +8487,7 @@ function InfiniteTableColumnCellFn(props) {
8496
8487
  }
8497
8488
  }
8498
8489
  if (renderFunctions.renderValue) {
8499
- renderParam.renderBag.value = /* @__PURE__ */ React37.createElement(
8490
+ renderParam.renderBag.value = /* @__PURE__ */ React36.createElement(
8500
8491
  RenderCellHookComponent,
8501
8492
  {
8502
8493
  render: renderFunctions.renderValue,
@@ -8507,7 +8498,7 @@ function InfiniteTableColumnCellFn(props) {
8507
8498
  );
8508
8499
  }
8509
8500
  if (rowInfo.isGroupRow && renderFunctions.renderGroupValue) {
8510
- renderParam.renderBag.value = /* @__PURE__ */ React37.createElement(
8501
+ renderParam.renderBag.value = /* @__PURE__ */ React36.createElement(
8511
8502
  RenderCellHookComponent,
8512
8503
  {
8513
8504
  render: renderFunctions.renderGroupValue,
@@ -8518,7 +8509,7 @@ function InfiniteTableColumnCellFn(props) {
8518
8509
  );
8519
8510
  }
8520
8511
  if (!rowInfo.isGroupRow && renderFunctions.renderLeafValue) {
8521
- renderParam.renderBag.value = /* @__PURE__ */ React37.createElement(
8512
+ renderParam.renderBag.value = /* @__PURE__ */ React36.createElement(
8522
8513
  RenderCellHookComponent,
8523
8514
  {
8524
8515
  render: renderFunctions.renderLeafValue,
@@ -8533,9 +8524,9 @@ function InfiniteTableColumnCellFn(props) {
8533
8524
  if (valueToRender instanceof Date) {
8534
8525
  valueToRender = valueToRender.toLocaleDateString();
8535
8526
  }
8536
- const all = /* @__PURE__ */ React37.createElement(React37.Fragment, null, align2 !== "end" ? renderParam.renderBag.groupIcon : null, align2 !== "end" ? renderParam.renderBag.rowDetailsIcon : null, align2 !== "end" ? renderParam.renderBag.selectionCheckBox : null, valueToRender, align2 === "end" ? renderParam.renderBag.selectionCheckBox : null, align2 === "end" ? renderParam.renderBag.rowDetailsIcon : null, align2 === "end" ? renderParam.renderBag.groupIcon : null);
8527
+ const all = /* @__PURE__ */ React36.createElement(React36.Fragment, null, align2 !== "end" ? renderParam.renderBag.groupIcon : null, align2 !== "end" ? renderParam.renderBag.rowDetailsIcon : null, align2 !== "end" ? renderParam.renderBag.selectionCheckBox : null, valueToRender, align2 === "end" ? renderParam.renderBag.selectionCheckBox : null, align2 === "end" ? renderParam.renderBag.rowDetailsIcon : null, align2 === "end" ? renderParam.renderBag.groupIcon : null);
8537
8528
  if (column.render) {
8538
- return /* @__PURE__ */ React37.createElement(
8529
+ return /* @__PURE__ */ React36.createElement(
8539
8530
  RenderCellHookComponent,
8540
8531
  {
8541
8532
  render: column.render,
@@ -8697,16 +8688,16 @@ function InfiniteTableColumnCellFn(props) {
8697
8688
  return (
8698
8689
  // this context is here for supporting useInfiniteColumnCell to be used
8699
8690
  // with a custom column component, specified via column.components.ColumnCell
8700
- /* @__PURE__ */ React37.createElement(
8691
+ /* @__PURE__ */ React36.createElement(
8701
8692
  ContextProvider,
8702
8693
  {
8703
8694
  value: renderParamRef.current
8704
8695
  },
8705
- /* @__PURE__ */ React37.createElement(InfiniteTableCell, __spreadValues({}, cellProps))
8696
+ /* @__PURE__ */ React36.createElement(InfiniteTableCell, __spreadValues({}, cellProps))
8706
8697
  )
8707
8698
  );
8708
8699
  }
8709
- var InfiniteTableColumnCell = React37.memo(
8700
+ var InfiniteTableColumnCell = React36.memo(
8710
8701
  InfiniteTableColumnCellFn
8711
8702
  );
8712
8703
  function useInfiniteColumnCell() {
@@ -8721,14 +8712,14 @@ function useInfiniteColumnEditor() {
8721
8712
  state: { editingValueRef, editingCell }
8722
8713
  } = useInfiniteTable();
8723
8714
  const { column, rowInfo } = useInfiniteColumnCell();
8724
- const [initialValue] = React37.useState(() => editingCell == null ? void 0 : editingCell.value);
8725
- const [currentValue, setCurrentValue] = React37.useState(initialValue);
8715
+ const [initialValue] = React36.useState(() => editingCell == null ? void 0 : editingCell.value);
8716
+ const [currentValue, setCurrentValue] = React36.useState(initialValue);
8726
8717
  const readOnly = editingCell ? !editingCell.active && !!editingCell.waiting : false;
8727
- const setValue = React37.useCallback((value) => {
8718
+ const setValue = React36.useCallback((value) => {
8728
8719
  editingValueRef.current = value;
8729
8720
  setCurrentValue(value);
8730
8721
  }, []);
8731
- React37.useLayoutEffect(() => {
8722
+ React36.useLayoutEffect(() => {
8732
8723
  editingValueRef.current = initialValue;
8733
8724
  }, []);
8734
8725
  const confirmEdit = api.confirmEdit;
@@ -8757,7 +8748,7 @@ function RenderHookComponent(props) {
8757
8748
  // src/components/InfiniteTable/utils/RenderHookComponentForInfinite.tsx
8758
8749
  function RenderCellHookComponent(props) {
8759
8750
  const ContextProvider = InfiniteTableColumnCellContext.Provider;
8760
- return /* @__PURE__ */ React38.createElement(ContextProvider, { value: props.renderParam }, /* @__PURE__ */ React38.createElement(
8751
+ return /* @__PURE__ */ React37.createElement(ContextProvider, { value: props.renderParam }, /* @__PURE__ */ React37.createElement(
8761
8752
  RenderHookComponent,
8762
8753
  {
8763
8754
  render: props.render,
@@ -8767,11 +8758,11 @@ function RenderCellHookComponent(props) {
8767
8758
  }
8768
8759
  function CellEditorContextComponent(props) {
8769
8760
  const ContextProvider = InfiniteTableColumnCellContext.Provider;
8770
- return /* @__PURE__ */ React38.createElement(ContextProvider, { value: props.contextValue }, props.children);
8761
+ return /* @__PURE__ */ React37.createElement(ContextProvider, { value: props.contextValue }, props.children);
8771
8762
  }
8772
8763
  function RenderHeaderCellHookComponent(props) {
8773
8764
  const ContextProvider = InfiniteTableHeaderCellContext.Provider;
8774
- return /* @__PURE__ */ React38.createElement(ContextProvider, { value: props.renderParam }, /* @__PURE__ */ React38.createElement(
8765
+ return /* @__PURE__ */ React37.createElement(ContextProvider, { value: props.renderParam }, /* @__PURE__ */ React37.createElement(
8775
8766
  RenderHookComponent,
8776
8767
  {
8777
8768
  render: props.render,
@@ -8781,7 +8772,7 @@ function RenderHeaderCellHookComponent(props) {
8781
8772
  }
8782
8773
 
8783
8774
  // src/components/InfiniteTable/components/icons/MenuIcon.tsx
8784
- var React39 = __toESM(require("react"));
8775
+ var React38 = __toESM(require("react"));
8785
8776
  var defaultLineStyle2 = {
8786
8777
  width: "100%",
8787
8778
  pointerEvents: "none"
@@ -8805,7 +8796,7 @@ function MenuIcon(props) {
8805
8796
  const lineStyle = __spreadValues(__spreadProps(__spreadValues({}, defaultLineStyle2), {
8806
8797
  borderTop: `${ThemeVars.components.HeaderCell.menuIconLineWidth} solid currentColor`
8807
8798
  }), props.lineStyle);
8808
- return /* @__PURE__ */ React39.createElement(
8799
+ return /* @__PURE__ */ React38.createElement(
8809
8800
  "div",
8810
8801
  __spreadProps(__spreadValues(__spreadProps(__spreadValues({}, domProps), {
8811
8802
  style: style2
@@ -8821,12 +8812,12 @@ function MenuIcon(props) {
8821
8812
  `${InfiniteTableIconClassName}-menu`
8822
8813
  )
8823
8814
  }),
8824
- children != null ? children : /* @__PURE__ */ React39.createElement(React39.Fragment, null, /* @__PURE__ */ React39.createElement("div", { className: lineClassName, style: lineStyle }), /* @__PURE__ */ React39.createElement("div", { className: lineClassName, style: lineStyle }), /* @__PURE__ */ React39.createElement("div", { className: lineClassName, style: lineStyle }))
8815
+ children != null ? children : /* @__PURE__ */ React38.createElement(React38.Fragment, null, /* @__PURE__ */ React38.createElement("div", { className: lineClassName, style: lineStyle }), /* @__PURE__ */ React38.createElement("div", { className: lineClassName, style: lineStyle }), /* @__PURE__ */ React38.createElement("div", { className: lineClassName, style: lineStyle }))
8825
8816
  );
8826
8817
  }
8827
8818
 
8828
8819
  // src/components/InfiniteTable/components/icons/SortIcon.tsx
8829
- var React40 = __toESM(require("react"));
8820
+ var React39 = __toESM(require("react"));
8830
8821
  var import_react26 = require("react");
8831
8822
 
8832
8823
  // src/components/InfiniteTable/components/icons/SortIcon.css.ts
@@ -8885,7 +8876,7 @@ function SortIcon(props) {
8885
8876
  if (direction === -1) {
8886
8877
  indexStyle.top = "100%";
8887
8878
  }
8888
- return /* @__PURE__ */ React40.createElement(
8879
+ return /* @__PURE__ */ React39.createElement(
8889
8880
  "div",
8890
8881
  {
8891
8882
  "data-name": "sort-icon",
@@ -8897,7 +8888,7 @@ function SortIcon(props) {
8897
8888
  `${InfiniteTableIconClassName}-sort`
8898
8889
  )
8899
8890
  },
8900
- showIndex ? /* @__PURE__ */ React40.createElement(
8891
+ showIndex ? /* @__PURE__ */ React39.createElement(
8901
8892
  "div",
8902
8893
  {
8903
8894
  "data-name": "index",
@@ -8906,25 +8897,25 @@ function SortIcon(props) {
8906
8897
  },
8907
8898
  index
8908
8899
  ) : null,
8909
- /* @__PURE__ */ React40.createElement(
8900
+ /* @__PURE__ */ React39.createElement(
8910
8901
  "div",
8911
8902
  {
8912
8903
  style: __spreadValues({ width: sizes[0] }, lineStyle),
8913
8904
  onTransitionEnd
8914
8905
  }
8915
8906
  ),
8916
- /* @__PURE__ */ React40.createElement("div", { style: __spreadValues({ width: sizes[1] }, lineStyle) }),
8917
- /* @__PURE__ */ React40.createElement("div", { style: __spreadValues({ width: sizes[2] }, lineStyle) })
8907
+ /* @__PURE__ */ React39.createElement("div", { style: __spreadValues({ width: sizes[1] }, lineStyle) }),
8908
+ /* @__PURE__ */ React39.createElement("div", { style: __spreadValues({ width: sizes[2] }, lineStyle) })
8918
8909
  );
8919
8910
  }
8920
8911
 
8921
8912
  // src/components/InfiniteTable/components/InfiniteTableHeader/useColumnResizeHandle.tsx
8922
- var React42 = __toESM(require("react"));
8913
+ var React41 = __toESM(require("react"));
8923
8914
  var import_react28 = require("react");
8924
8915
 
8925
8916
  // src/components/InfiniteTable/components/InfiniteTableHeader/ResizeHandle/index.tsx
8926
8917
  var import_react27 = require("react");
8927
- var React41 = __toESM(require("react"));
8918
+ var React40 = __toESM(require("react"));
8928
8919
 
8929
8920
  // src/components/InfiniteTable/components/InfiniteTableHeader/ResizeHandle/columnResizer.ts
8930
8921
  function getColumnResizer(colIndex, {
@@ -9099,7 +9090,7 @@ function ResizeHandleFn(props) {
9099
9090
  right: computedPinned === "start" ? void 0 : 0
9100
9091
  //ThemeVars.components.HeaderCell.resizeHandleWidth,
9101
9092
  } : computedPinned === "end" && computedFirstInCategory ? { right: void 0 } : void 0;
9102
- return /* @__PURE__ */ React41.createElement(
9093
+ return /* @__PURE__ */ React40.createElement(
9103
9094
  "div",
9104
9095
  {
9105
9096
  ref: domRef,
@@ -9112,7 +9103,7 @@ function ResizeHandleFn(props) {
9112
9103
  )}`,
9113
9104
  onPointerDown
9114
9105
  },
9115
- /* @__PURE__ */ React41.createElement(
9106
+ /* @__PURE__ */ React40.createElement(
9116
9107
  "div",
9117
9108
  {
9118
9109
  style: style2,
@@ -9126,7 +9117,7 @@ function ResizeHandleFn(props) {
9126
9117
  )
9127
9118
  );
9128
9119
  }
9129
- var ResizeHandle = React41.memo(ResizeHandleFn);
9120
+ var ResizeHandle = React40.memo(ResizeHandleFn);
9130
9121
 
9131
9122
  // src/components/InfiniteTable/components/InfiniteTableHeader/useColumnResizeHandle.tsx
9132
9123
  function useColumnResizeHandle(column) {
@@ -9190,7 +9181,7 @@ function useColumnResizeHandle(column) {
9190
9181
  },
9191
9182
  [computeResizeForDiff]
9192
9183
  );
9193
- const resizeHandle = column.computedResizable ? /* @__PURE__ */ React42.createElement(
9184
+ const resizeHandle = column.computedResizable ? /* @__PURE__ */ React41.createElement(
9194
9185
  ResizeHandle,
9195
9186
  {
9196
9187
  columns: computedVisibleColumns,
@@ -9209,7 +9200,7 @@ var InfiniteTableHeaderCellClassName = `${rootClassName2}HeaderCell`;
9209
9200
  var defaultRenderSelectionCheckBox2 = (params) => {
9210
9201
  const { allRowsSelected, someRowsSelected, api } = params;
9211
9202
  const selected = allRowsSelected ? true : someRowsSelected ? null : false;
9212
- return /* @__PURE__ */ React43.createElement(
9203
+ return /* @__PURE__ */ React42.createElement(
9213
9204
  InfiniteCheckBox,
9214
9205
  {
9215
9206
  domProps: {
@@ -9226,9 +9217,9 @@ var defaultRenderSelectionCheckBox2 = (params) => {
9226
9217
  }
9227
9218
  );
9228
9219
  };
9229
- var InfiniteTableHeaderCellContext = React43.createContext(null);
9220
+ var InfiniteTableHeaderCellContext = React42.createContext(null);
9230
9221
  var columnZIndexAtIndex5 = stripVar(InternalVars.columnZIndexAtIndex);
9231
- var spacer = /* @__PURE__ */ React43.createElement("div", { className: flex["1"] });
9222
+ var spacer = /* @__PURE__ */ React42.createElement("div", { className: flex["1"] });
9232
9223
  var InfiniteHeaderCellDataAttributes = keyMirror({
9233
9224
  "data-name": ``,
9234
9225
  "data-field": ``,
@@ -9265,7 +9256,7 @@ function InfiniteTableHeaderCell(props) {
9265
9256
  const dragging = columnReorderDragColumnId === column.id;
9266
9257
  const { onResize, height, width, headerOptions, columnsMap } = props;
9267
9258
  const sortInfo = column.computedSortInfo;
9268
- let header = column.header;
9259
+ const header = column.header;
9269
9260
  const ref = (0, import_react29.useCallback)(
9270
9261
  (node) => {
9271
9262
  var _a2;
@@ -9289,7 +9280,7 @@ function InfiniteTableHeaderCell(props) {
9289
9280
  getState
9290
9281
  });
9291
9282
  const computedSortable = columnApi.isSortable();
9292
- const sortIcon = computedSortable && (column.computedSorted || alwaysShow) ? /* @__PURE__ */ React43.createElement(
9283
+ const sortIcon = computedSortable && (column.computedSorted || alwaysShow) ? /* @__PURE__ */ React42.createElement(
9293
9284
  SortIcon,
9294
9285
  {
9295
9286
  index: column.computedMultiSort ? column.computedSortIndex + 1 : void 0,
@@ -9306,7 +9297,7 @@ function InfiniteTableHeaderCell(props) {
9306
9297
  }
9307
9298
  ) : null;
9308
9299
  const filtered = column.computedFilterable && column.computedFiltered;
9309
- const filterIcon = filtered ? /* @__PURE__ */ React43.createElement(FilterIcon, null) : null;
9300
+ const filterIcon = filtered ? /* @__PURE__ */ React42.createElement(FilterIcon, null) : null;
9310
9301
  const headerCSSEllipsis = (_e = (_d = column.headerCssEllipsis) != null ? _d : column.cssEllipsis) != null ? _e : true;
9311
9302
  const menuIconProps = {
9312
9303
  reserveSpaceWhenHidden: align2 === "center",
@@ -9326,7 +9317,7 @@ function InfiniteTableHeaderCell(props) {
9326
9317
  }
9327
9318
  };
9328
9319
  const MenuIconCmp = ((_f = column.components) == null ? void 0 : _f.MenuIcon) || (components2 == null ? void 0 : components2.MenuIcon) || MenuIcon;
9329
- const menuIcon = /* @__PURE__ */ React43.createElement(MenuIconCmp, __spreadValues({}, menuIconProps));
9320
+ const menuIcon = /* @__PURE__ */ React42.createElement(MenuIconCmp, __spreadValues({}, menuIconProps));
9330
9321
  const initialRenderParam = {
9331
9322
  dragging,
9332
9323
  domRef: ref,
@@ -9357,7 +9348,7 @@ function InfiniteTableHeaderCell(props) {
9357
9348
  renderBag: __spreadValues({}, initialRenderParam.renderBag)
9358
9349
  });
9359
9350
  if (column.renderSortIcon) {
9360
- renderParam2.renderBag.sortIcon = /* @__PURE__ */ React43.createElement(
9351
+ renderParam2.renderBag.sortIcon = /* @__PURE__ */ React42.createElement(
9361
9352
  RenderHeaderCellHookComponent,
9362
9353
  {
9363
9354
  render: column.renderSortIcon,
@@ -9368,7 +9359,7 @@ function InfiniteTableHeaderCell(props) {
9368
9359
  );
9369
9360
  }
9370
9361
  if (column.renderFilterIcon) {
9371
- renderParam2.renderBag.filterIcon = /* @__PURE__ */ React43.createElement(
9362
+ renderParam2.renderBag.filterIcon = /* @__PURE__ */ React42.createElement(
9372
9363
  RenderHeaderCellHookComponent,
9373
9364
  {
9374
9365
  render: column.renderFilterIcon,
@@ -9379,7 +9370,7 @@ function InfiniteTableHeaderCell(props) {
9379
9370
  );
9380
9371
  }
9381
9372
  if (typeof column.renderMenuIcon === "function") {
9382
- renderParam2.renderBag.menuIcon = /* @__PURE__ */ React43.createElement(
9373
+ renderParam2.renderBag.menuIcon = /* @__PURE__ */ React42.createElement(
9383
9374
  RenderHeaderCellHookComponent,
9384
9375
  {
9385
9376
  render: (param) => {
@@ -9391,7 +9382,7 @@ function InfiniteTableHeaderCell(props) {
9391
9382
  if (result.type === MenuIconCmp || result.type === MenuIcon) {
9392
9383
  return result;
9393
9384
  }
9394
- return /* @__PURE__ */ React43.createElement(MenuIconCmp, __spreadValues({}, menuIconProps), result);
9385
+ return /* @__PURE__ */ React42.createElement(MenuIconCmp, __spreadValues({}, menuIconProps), result);
9395
9386
  }
9396
9387
  return null;
9397
9388
  },
@@ -9402,7 +9393,7 @@ function InfiniteTableHeaderCell(props) {
9402
9393
  );
9403
9394
  }
9404
9395
  if (column.renderSelectionCheckBox && selectionMode === "multi-row") {
9405
- renderParam2.renderBag.selectionCheckBox = /* @__PURE__ */ React43.createElement(
9396
+ renderParam2.renderBag.selectionCheckBox = /* @__PURE__ */ React42.createElement(
9406
9397
  RenderHeaderCellHookComponent,
9407
9398
  {
9408
9399
  render: defaultRenderSelectionCheckBox2,
@@ -9413,7 +9404,7 @@ function InfiniteTableHeaderCell(props) {
9413
9404
  );
9414
9405
  const renderHeaderSelectionCheckBox = (_a2 = column.renderHeaderSelectionCheckBox) != null ? _a2 : column.renderSelectionCheckBox;
9415
9406
  if (renderHeaderSelectionCheckBox && renderHeaderSelectionCheckBox !== true) {
9416
- renderParam2.renderBag.selectionCheckBox = /* @__PURE__ */ React43.createElement(
9407
+ renderParam2.renderBag.selectionCheckBox = /* @__PURE__ */ React42.createElement(
9417
9408
  RenderHeaderCellHookComponent,
9418
9409
  {
9419
9410
  render: renderHeaderSelectionCheckBox,
@@ -9425,7 +9416,7 @@ function InfiniteTableHeaderCell(props) {
9425
9416
  }
9426
9417
  }
9427
9418
  if (header instanceof Function) {
9428
- renderParam2.renderBag.header = /* @__PURE__ */ React43.createElement(
9419
+ renderParam2.renderBag.header = /* @__PURE__ */ React42.createElement(
9429
9420
  RenderHeaderCellHookComponent,
9430
9421
  {
9431
9422
  render: header,
@@ -9436,10 +9427,10 @@ function InfiniteTableHeaderCell(props) {
9436
9427
  );
9437
9428
  }
9438
9429
  const theMenuIcon = column.renderMenuIcon === false ? null : renderParam2.renderBag.menuIcon;
9439
- const headerContent = headerCSSEllipsis ? /* @__PURE__ */ React43.createElement("div", { className: cssEllipsisClassName }, renderParam2.renderBag.header) : renderParam2.renderBag.header;
9440
- const all = /* @__PURE__ */ React43.createElement(React43.Fragment, null, align2 === "center" ? spacer : null, renderParam2.renderBag.selectionCheckBox, headerContent, renderParam2.renderBag.sortIcon, renderParam2.renderBag.filterIcon, align2 === "center" ? spacer : null, align2 !== "center" ? spacer : null, theMenuIcon);
9430
+ const headerContent = headerCSSEllipsis ? /* @__PURE__ */ React42.createElement("div", { className: cssEllipsisClassName }, renderParam2.renderBag.header) : renderParam2.renderBag.header;
9431
+ const all = /* @__PURE__ */ React42.createElement(React42.Fragment, null, align2 === "center" ? spacer : null, renderParam2.renderBag.selectionCheckBox, headerContent, renderParam2.renderBag.sortIcon, renderParam2.renderBag.filterIcon, align2 === "center" ? spacer : null, align2 !== "center" ? spacer : null, theMenuIcon);
9441
9432
  if (column.renderHeader) {
9442
- return /* @__PURE__ */ React43.createElement(
9433
+ return /* @__PURE__ */ React42.createElement(
9443
9434
  RenderHeaderCellHookComponent,
9444
9435
  {
9445
9436
  render: column.renderHeader,
@@ -9476,7 +9467,7 @@ function InfiniteTableHeaderCell(props) {
9476
9467
  });
9477
9468
  let draggingProxy = null;
9478
9469
  if (dragging && proxyPosition) {
9479
- draggingProxy = /* @__PURE__ */ React43.createElement(
9470
+ draggingProxy = /* @__PURE__ */ React42.createElement(
9480
9471
  "div",
9481
9472
  {
9482
9473
  key: column.id,
@@ -9500,7 +9491,7 @@ function InfiniteTableHeaderCell(props) {
9500
9491
  verticalAlign,
9501
9492
  align: align2
9502
9493
  };
9503
- const debouncedOnFilterValueChange = React43.useMemo(() => {
9494
+ const debouncedOnFilterValueChange = React42.useMemo(() => {
9504
9495
  const fn = (filterValue) => {
9505
9496
  api.setColumnFilter(column.id, filterValue);
9506
9497
  };
@@ -9526,7 +9517,7 @@ function InfiniteTableHeaderCell(props) {
9526
9517
  "data-sort": column.computedSortedAsc ? "asc" : column.computedSortedDesc ? "desc" : "none",
9527
9518
  "data-sort-index": `${(_p = column.computedSortIndex) != null ? _p : -1}`
9528
9519
  };
9529
- return /* @__PURE__ */ React43.createElement(ContextProvider, { value: renderParam }, /* @__PURE__ */ React43.createElement(
9520
+ return /* @__PURE__ */ React42.createElement(ContextProvider, { value: renderParam }, /* @__PURE__ */ React42.createElement(
9530
9521
  InfiniteTableCell,
9531
9522
  __spreadProps(__spreadValues({
9532
9523
  domRef: ref,
@@ -9568,7 +9559,7 @@ function InfiniteTableHeaderCell(props) {
9568
9559
  CellCls
9569
9560
  ),
9570
9561
  cssEllipsis: headerCSSEllipsis,
9571
- afterChildren: /* @__PURE__ */ React43.createElement(React43.Fragment, null, showColumnFilters ? column.computedFilterable ? /* @__PURE__ */ React43.createElement(
9562
+ afterChildren: /* @__PURE__ */ React42.createElement(React42.Fragment, null, showColumnFilters ? column.computedFilterable ? /* @__PURE__ */ React42.createElement(
9572
9563
  InfiniteTableColumnHeaderFilter,
9573
9564
  {
9574
9565
  filterEditor: FilterEditor,
@@ -9581,7 +9572,7 @@ function InfiniteTableHeaderCell(props) {
9581
9572
  columnFilterValue: column.computedFilterValue,
9582
9573
  columnHeaderHeight
9583
9574
  }
9584
- ) : /* @__PURE__ */ React43.createElement(InfiniteTableColumnHeaderFilterEmpty, null) : null, resizeHandle),
9575
+ ) : /* @__PURE__ */ React42.createElement(InfiniteTableColumnHeaderFilterEmpty, null) : null, resizeHandle),
9585
9576
  renderChildren
9586
9577
  })
9587
9578
  ), draggingProxy);
@@ -9594,7 +9585,7 @@ function useInfiniteHeaderCell() {
9594
9585
  }
9595
9586
 
9596
9587
  // src/components/InfiniteTable/components/InfiniteTableHeader/InfiniteTableHeaderWrapper.tsx
9597
- var React48 = __toESM(require("react"));
9588
+ var React47 = __toESM(require("react"));
9598
9589
 
9599
9590
  // src/components/InfiniteTable/components/InfiniteTableHeader/buildColumnAndGroupTree.ts
9600
9591
  function buildColumnAndGroupTree(columns, columnGroups, columnGroupsDepthsMap, columnGroupsMaxDepth) {
@@ -9623,7 +9614,7 @@ function buildColumnAndGroupTree(columns, columnGroups, columnGroupsDepthsMap, c
9623
9614
  let colGroupItem;
9624
9615
  let prevGroupItem = colItem;
9625
9616
  while (groupId) {
9626
- const colGroup = columnGroups.get(groupId);
9617
+ const colGroup = columnGroups[groupId];
9627
9618
  if (colGroup) {
9628
9619
  parentGroups.add(groupId);
9629
9620
  const groupAbsoluteId = [colId, ...parentGroups];
@@ -9700,19 +9691,19 @@ function assignGroupOffsetsAndComputedWidths(items, groupOffset = 0) {
9700
9691
  }
9701
9692
 
9702
9693
  // src/components/InfiniteTable/components/InfiniteTableHeader/InfiniteTableHeader.tsx
9703
- var React47 = __toESM(require("react"));
9694
+ var React46 = __toESM(require("react"));
9704
9695
  var import_react32 = require("react");
9705
9696
 
9706
9697
  // src/components/InfiniteTable/components/InfiniteTableHeader/InfiniteTableHeaderGroup.tsx
9707
- var React46 = __toESM(require("react"));
9698
+ var React45 = __toESM(require("react"));
9708
9699
 
9709
9700
  // src/components/InfiniteTable/components/InfiniteTableHeader/useColumnGroupResizeHandle.tsx
9710
- var React45 = __toESM(require("react"));
9701
+ var React44 = __toESM(require("react"));
9711
9702
  var import_react31 = require("react");
9712
9703
 
9713
9704
  // src/components/InfiniteTable/components/InfiniteTableHeader/ResizeHandle/GroupResizeHandle.tsx
9714
9705
  var import_react30 = require("react");
9715
- var React44 = __toESM(require("react"));
9706
+ var React43 = __toESM(require("react"));
9716
9707
  var { rootClassName: rootClassName8 } = internalProps;
9717
9708
  var InfiniteTableHeaderCellResizeHandleCls2 = `${rootClassName8}HeaderCell_ResizeHandle`;
9718
9709
  function GroupResizeHandleFn(props) {
@@ -9781,7 +9772,7 @@ function GroupResizeHandleFn(props) {
9781
9772
  const style2 = (computedPinned === false || computedPinned === "start") && computedLastInCategory ? {
9782
9773
  right: computedPinned === "start" ? void 0 : ThemeVars.components.HeaderCell.resizeHandleWidth
9783
9774
  } : computedPinned === "end" && computedFirstInCategory ? { right: void 0 } : void 0;
9784
- return /* @__PURE__ */ React44.createElement(
9775
+ return /* @__PURE__ */ React43.createElement(
9785
9776
  "div",
9786
9777
  {
9787
9778
  ref: domRef,
@@ -9794,7 +9785,7 @@ function GroupResizeHandleFn(props) {
9794
9785
  )}`,
9795
9786
  onPointerDown
9796
9787
  },
9797
- /* @__PURE__ */ React44.createElement(
9788
+ /* @__PURE__ */ React43.createElement(
9798
9789
  "div",
9799
9790
  {
9800
9791
  style: __spreadValues(__spreadValues({}, style2), props.style),
@@ -9805,7 +9796,7 @@ function GroupResizeHandleFn(props) {
9805
9796
  )
9806
9797
  );
9807
9798
  }
9808
- var GroupResizeHandle = React44.memo(
9799
+ var GroupResizeHandle = React43.memo(
9809
9800
  GroupResizeHandleFn
9810
9801
  );
9811
9802
 
@@ -9864,7 +9855,7 @@ function useColumnGroupResizeHandle(groupColumns, config) {
9864
9855
  [computeResizeForDiff]
9865
9856
  );
9866
9857
  const groupResizable = groupColumns.some((c) => c.computedResizable);
9867
- const resizeHandle = groupResizable ? /* @__PURE__ */ React45.createElement(
9858
+ const resizeHandle = groupResizable ? /* @__PURE__ */ React44.createElement(
9868
9859
  GroupResizeHandle,
9869
9860
  {
9870
9861
  brain: bodyBrain,
@@ -9904,7 +9895,7 @@ function InfiniteTableHeaderGroup(props) {
9904
9895
  (col) => `var(${columnWidthAtIndex5}-${col.computedVisibleIndex})`
9905
9896
  ).join(" + ") + " )" : `var(${columnWidthAtIndex5}-${firstColumn.computedVisibleIndex})`;
9906
9897
  const zIndex2 = `calc(var(${columnZIndexAtIndex6}-${firstColumn.computedVisibleIndex}) + ${columnGroupsMaxDepth - columnGroup.depth})`;
9907
- return /* @__PURE__ */ React46.createElement(
9898
+ return /* @__PURE__ */ React45.createElement(
9908
9899
  "div",
9909
9900
  {
9910
9901
  ref: props.domRef,
@@ -9913,7 +9904,7 @@ function InfiniteTableHeaderGroup(props) {
9913
9904
  style: { width, height },
9914
9905
  "data-z-index": zIndex2
9915
9906
  },
9916
- /* @__PURE__ */ React46.createElement(
9907
+ /* @__PURE__ */ React45.createElement(
9917
9908
  "div",
9918
9909
  {
9919
9910
  className: join(
@@ -9995,7 +9986,7 @@ function InfiniteTableHeaderFn(props) {
9995
9986
  computedWidth: colGroupItem.computedWidth,
9996
9987
  groupOffset: colGroupItem.groupOffset
9997
9988
  });
9998
- return /* @__PURE__ */ React47.createElement(
9989
+ return /* @__PURE__ */ React46.createElement(
9999
9990
  InfiniteTableHeaderGroup,
10000
9991
  {
10001
9992
  bodyBrain,
@@ -10008,7 +9999,7 @@ function InfiniteTableHeaderFn(props) {
10008
9999
  }
10009
10000
  );
10010
10001
  }
10011
- return /* @__PURE__ */ React47.createElement(
10002
+ return /* @__PURE__ */ React46.createElement(
10012
10003
  InfiniteTableHeaderCell,
10013
10004
  {
10014
10005
  domRef: domRef2,
@@ -10032,7 +10023,7 @@ function InfiniteTableHeaderFn(props) {
10032
10023
  showColumnFilters
10033
10024
  ]
10034
10025
  );
10035
- return /* @__PURE__ */ React47.createElement("div", __spreadValues({}, domProps), /* @__PURE__ */ React47.createElement(
10026
+ return /* @__PURE__ */ React46.createElement("div", __spreadValues({}, domProps), /* @__PURE__ */ React46.createElement(
10036
10027
  RawTable,
10037
10028
  {
10038
10029
  name: "header",
@@ -10042,7 +10033,7 @@ function InfiniteTableHeaderFn(props) {
10042
10033
  }
10043
10034
  ));
10044
10035
  }
10045
- var InfiniteTableHeader = React47.memo(
10036
+ var InfiniteTableHeader = React46.memo(
10046
10037
  InfiniteTableHeaderFn
10047
10038
  );
10048
10039
 
@@ -10065,10 +10056,10 @@ function TableHeaderWrapper(props) {
10065
10056
  showColumnFilters
10066
10057
  }
10067
10058
  } = tableContextValue;
10068
- const rows = !computedColumnGroups || !computedColumnGroups.size ? 1 : columnGroupsMaxDepth + 2;
10059
+ const rows = !computedColumnGroups || !Object.keys(computedColumnGroups).length ? 1 : columnGroupsMaxDepth + 2;
10069
10060
  const height = rows * columnHeaderHeight + (showColumnFilters ? columnHeaderHeight : 0);
10070
- const columnAndGroupTreeInfo = React48.useMemo(() => {
10071
- if (!computedColumnGroups || !computedColumnGroups.size) {
10061
+ const columnAndGroupTreeInfo = React47.useMemo(() => {
10062
+ if (!computedColumnGroups || !Object.keys(computedColumnGroups).length) {
10072
10063
  return void 0;
10073
10064
  }
10074
10065
  return buildColumnAndGroupTree(
@@ -10078,7 +10069,7 @@ function TableHeaderWrapper(props) {
10078
10069
  columnGroupsMaxDepth
10079
10070
  );
10080
10071
  }, [computedVisibleColumns, computedColumnGroups, columnGroupsDepthsMap]);
10081
- const cellspan = React48.useCallback(
10072
+ const cellspan = React47.useCallback(
10082
10073
  ({ rowIndex, colIndex }) => {
10083
10074
  const column = computedVisibleColumns[colIndex];
10084
10075
  const rowspan2 = 1;
@@ -10116,15 +10107,15 @@ function TableHeaderWrapper(props) {
10116
10107
  columnGroupsDepthsMap
10117
10108
  ]
10118
10109
  );
10119
- const rowspan = React48.useCallback(
10110
+ const rowspan = React47.useCallback(
10120
10111
  ({ rowIndex, colIndex }) => cellspan({ rowIndex, colIndex }).rowspan,
10121
10112
  [cellspan]
10122
10113
  );
10123
- const colspan = React48.useCallback(
10114
+ const colspan = React47.useCallback(
10124
10115
  ({ rowIndex, colIndex }) => cellspan({ rowIndex, colIndex }).colspan,
10125
10116
  [cellspan]
10126
10117
  );
10127
- const rowHeight = React48.useCallback(
10118
+ const rowHeight = React47.useCallback(
10128
10119
  (index) => {
10129
10120
  return showColumnFilters ? index < rows - 1 ? columnHeaderHeight : 2 * columnHeaderHeight : columnHeaderHeight;
10130
10121
  },
@@ -10146,7 +10137,7 @@ function TableHeaderWrapper(props) {
10146
10137
  fixedColsStart: computedPinnedStartColumns.length
10147
10138
  }
10148
10139
  );
10149
- const header = /* @__PURE__ */ React48.createElement(
10140
+ const header = /* @__PURE__ */ React47.createElement(
10150
10141
  InfiniteTableHeader,
10151
10142
  {
10152
10143
  columns: computedVisibleColumns,
@@ -10157,7 +10148,7 @@ function TableHeaderWrapper(props) {
10157
10148
  columnAndGroupTreeInfo
10158
10149
  }
10159
10150
  );
10160
- const verticalScrollbarPlaceholder = scrollbars.vertical && getScrollbarWidth() ? /* @__PURE__ */ React48.createElement(
10151
+ const verticalScrollbarPlaceholder = scrollbars.vertical && getScrollbarWidth() ? /* @__PURE__ */ React47.createElement(
10161
10152
  "div",
10162
10153
  {
10163
10154
  className: HeaderScrollbarPlaceholderCls,
@@ -10167,7 +10158,7 @@ function TableHeaderWrapper(props) {
10167
10158
  }
10168
10159
  }
10169
10160
  ) : null;
10170
- return /* @__PURE__ */ React48.createElement(
10161
+ return /* @__PURE__ */ React47.createElement(
10171
10162
  "div",
10172
10163
  {
10173
10164
  className: HeaderWrapperCls,
@@ -10181,7 +10172,7 @@ function TableHeaderWrapper(props) {
10181
10172
  }
10182
10173
 
10183
10174
  // src/components/InfiniteTable/components/InfiniteTableLicenseFooter/index.tsx
10184
- var React49 = __toESM(require("react"));
10175
+ var React48 = __toESM(require("react"));
10185
10176
  var import_react33 = require("react");
10186
10177
 
10187
10178
  // src/components/utils/decamelize.ts
@@ -10224,11 +10215,11 @@ var enforceStyle = (node, style2) => {
10224
10215
  );
10225
10216
  }
10226
10217
  };
10227
- var InfiniteTableLicenseFooter = React49.forwardRef(
10218
+ var InfiniteTableLicenseFooter = React48.forwardRef(
10228
10219
  function InfiniteTableLicenseFooter2(props, ref) {
10229
10220
  const { rootClassName: rootClassName12 } = useInternalProps();
10230
- const domRef = React49.useRef(null);
10231
- const domCallback = React49.useCallback((node) => {
10221
+ const domRef = React48.useRef(null);
10222
+ const domCallback = React48.useCallback((node) => {
10232
10223
  domRef.current = node;
10233
10224
  if (!ref) {
10234
10225
  return;
@@ -10256,7 +10247,7 @@ var InfiniteTableLicenseFooter = React49.forwardRef(
10256
10247
  clearInterval(intervalId);
10257
10248
  };
10258
10249
  }, []);
10259
- return /* @__PURE__ */ React49.createElement(
10250
+ return /* @__PURE__ */ React48.createElement(
10260
10251
  "div",
10261
10252
  __spreadProps(__spreadValues({
10262
10253
  ref: domCallback
@@ -10270,7 +10261,7 @@ var InfiniteTableLicenseFooter = React49.forwardRef(
10270
10261
  }),
10271
10262
  "Powered by",
10272
10263
  " ",
10273
- /* @__PURE__ */ React49.createElement(
10264
+ /* @__PURE__ */ React48.createElement(
10274
10265
  "a",
10275
10266
  {
10276
10267
  href: "https://infinite-table.com",
@@ -10285,7 +10276,7 @@ var InfiniteTableLicenseFooter = React49.forwardRef(
10285
10276
  );
10286
10277
 
10287
10278
  // src/components/InfiniteTable/components/LoadMask.tsx
10288
- var React50 = __toESM(require("react"));
10279
+ var React49 = __toESM(require("react"));
10289
10280
 
10290
10281
  // src/components/InfiniteTable/components/LoadMask.css.ts
10291
10282
  var LoadMaskCls = { visible: "LoadMask_LoadMaskCls_visible__qy58ya1 LoadMask_LoadMaskBaseCls__qy58ya0 utilities_position_absolute__16lm1iw2 utilities_top_0__16lm1iw1c utilities_left_0__16lm1iw1e utilities_right_0__16lm1iw1j utilities_bottom_0__16lm1iw1h", hidden: "LoadMask_LoadMaskCls_hidden__qy58ya2 LoadMask_LoadMaskBaseCls__qy58ya0 utilities_position_absolute__16lm1iw2 utilities_top_0__16lm1iw1c utilities_left_0__16lm1iw1e utilities_right_0__16lm1iw1j utilities_bottom_0__16lm1iw1h" };
@@ -10297,16 +10288,16 @@ var { rootClassName: rootClassName10 } = internalProps;
10297
10288
  var baseCls3 = `${rootClassName10}-LoadMask`;
10298
10289
  function LoadMaskFn(props) {
10299
10290
  const { visible, children = "Loading" } = props;
10300
- return /* @__PURE__ */ React50.createElement(
10291
+ return /* @__PURE__ */ React49.createElement(
10301
10292
  "div",
10302
10293
  {
10303
10294
  className: `${LoadMaskCls[visible ? "visible" : "hidden"]} ${baseCls3}`
10304
10295
  },
10305
- /* @__PURE__ */ React50.createElement("div", { className: `${LoadMaskOverlayCls} ${baseCls3}-Overlay` }),
10306
- /* @__PURE__ */ React50.createElement("div", { className: `${LoadMaskTextCls} ${baseCls3}-Text` }, children)
10296
+ /* @__PURE__ */ React49.createElement("div", { className: `${LoadMaskOverlayCls} ${baseCls3}-Overlay` }),
10297
+ /* @__PURE__ */ React49.createElement("div", { className: `${LoadMaskTextCls} ${baseCls3}-Text` }, children)
10307
10298
  );
10308
10299
  }
10309
- var LoadMask = React50.memo(LoadMaskFn);
10300
+ var LoadMask = React49.memo(LoadMaskFn);
10310
10301
 
10311
10302
  // src/utils/deepClone.ts
10312
10303
  function cloneArray(arr) {
@@ -10978,7 +10969,7 @@ function enhancedFlatten(param) {
10978
10969
  }
10979
10970
 
10980
10971
  // src/components/DataSource/index.tsx
10981
- var React51 = __toESM(require("react"));
10972
+ var React50 = __toESM(require("react"));
10982
10973
  var import_react36 = require("react");
10983
10974
 
10984
10975
  // src/utils/multisort/sortTypes.ts
@@ -11801,46 +11792,25 @@ function getPivotColumnsAndColumnGroups({
11801
11792
  reducer: () => null
11802
11793
  });
11803
11794
  }
11804
- const columns = /* @__PURE__ */ new Map([
11805
- // [
11806
- // 'labels',
11807
- // {
11808
- // header: 'Row labels',
11809
- // pivotBy,
11810
- // valueGetter: (params) => {
11811
- // const { rowInfo } = params;
11812
- // if (!rowInfo.data) {
11813
- // // TODO replace with loading spinner
11814
- // return 'Loading ...';
11815
- // }
11816
- // return rowInfo.groupKeys
11817
- // ? rowInfo.groupKeys[rowInfo.groupKeys?.length - 1]
11818
- // : null;
11819
- // },
11820
- // },
11821
- // ],
11822
- ]);
11823
- const columnGroups = /* @__PURE__ */ new Map();
11795
+ const columns = {};
11796
+ const columnGroups = {};
11824
11797
  const addGrandTotalColumns = once(function() {
11825
11798
  aggregationReducers.forEach((reducer, index) => {
11826
- columns.set(
11827
- `total:${reducer.id}`,
11828
- prepareColumn({
11829
- header: `${reducer.name || reducer.id} total`,
11830
- pivotBy,
11831
- pivotColumn: true,
11832
- pivotTotalColumn: true,
11833
- pivotAggregator: reducer,
11834
- pivotAggregatorIndex: index,
11835
- pivotGroupKeys: [],
11836
- pivotGroupKey: "",
11837
- pivotIndex: -1,
11838
- valueFormatter: ({ rowInfo }) => {
11839
- var _a;
11840
- return rowInfo.isGroupRow ? (_a = rowInfo.reducerResults) == null ? void 0 : _a[reducer.id] : null;
11841
- }
11842
- })
11843
- );
11799
+ columns[`total:${reducer.id}`] = prepareColumn({
11800
+ header: `${reducer.name || reducer.id} total`,
11801
+ pivotBy,
11802
+ pivotColumn: true,
11803
+ pivotTotalColumn: true,
11804
+ pivotAggregator: reducer,
11805
+ pivotAggregatorIndex: index,
11806
+ pivotGroupKeys: [],
11807
+ pivotGroupKey: "",
11808
+ pivotIndex: -1,
11809
+ valueFormatter: ({ rowInfo }) => {
11810
+ var _a;
11811
+ return rowInfo.isGroupRow ? (_a = rowInfo.reducerResults) == null ? void 0 : _a[reducer.id] : null;
11812
+ }
11813
+ });
11844
11814
  });
11845
11815
  });
11846
11816
  if (!pivotLength && pivotTotalColumnPosition === "start" || pivotGrandTotalColumnPosition === "start") {
@@ -11860,18 +11830,15 @@ function getPivotColumnsAndColumnGroups({
11860
11830
  const columnGroupId = parentColumnGroupId;
11861
11831
  parentColumnGroupId = keys.join("/");
11862
11832
  const pivotGroupKey = keys[keys.length - 1];
11863
- columnGroups.set(
11864
- parentColumnGroupId,
11865
- prepareColumnGroup({
11866
- header: `${pivotGroupKey}`,
11867
- columnGroup: columnGroupId,
11868
- pivotBy,
11869
- pivotGroupKeys: keys,
11870
- pivotByAtIndex: pivotByForColumn,
11871
- pivotIndex: keys.length - 1,
11872
- pivotGroupKey
11873
- })
11874
- );
11833
+ columnGroups[parentColumnGroupId] = prepareColumnGroup({
11834
+ header: `${pivotGroupKey}`,
11835
+ columnGroup: columnGroupId,
11836
+ pivotBy,
11837
+ pivotGroupKeys: keys,
11838
+ pivotByAtIndex: pivotByForColumn,
11839
+ pivotIndex: keys.length - 1,
11840
+ pivotGroupKey
11841
+ });
11875
11842
  }
11876
11843
  aggregationReducers.forEach((reducer, index) => {
11877
11844
  const header = isSingleAggregationColumn ? `${keys[keys.length - 1]}` : reducer.name || reducer.id;
@@ -11897,42 +11864,36 @@ function getPivotColumnsAndColumnGroups({
11897
11864
  }
11898
11865
  });
11899
11866
  const columnId = `${reducer.id}:${keys.join("/")}`;
11900
- columns.set(columnId, computedPivotColumn);
11867
+ columns[columnId] = computedPivotColumn;
11901
11868
  });
11902
11869
  } else {
11903
11870
  const colGroupId = keys.join("/");
11904
11871
  const parentKeys = keys.slice(0, -1);
11905
- columnGroups.set(
11906
- colGroupId,
11907
- prepareColumnGroup({
11908
- columnGroup: parentKeys.length ? parentKeys.join("/") : void 0,
11909
- header: `${keys[keys.length - 1]}`,
11910
- pivotBy,
11911
- pivotGroupKeys: keys,
11912
- pivotIndex: keys.length - 1,
11913
- pivotByAtIndex: pivotBy[keys.length - 1],
11914
- pivotGroupKey: keys[keys.length - 1]
11915
- })
11916
- );
11872
+ columnGroups[colGroupId] = prepareColumnGroup({
11873
+ columnGroup: parentKeys.length ? parentKeys.join("/") : void 0,
11874
+ header: `${keys[keys.length - 1]}`,
11875
+ pivotBy,
11876
+ pivotGroupKeys: keys,
11877
+ pivotIndex: keys.length - 1,
11878
+ pivotByAtIndex: pivotBy[keys.length - 1],
11879
+ pivotGroupKey: keys[keys.length - 1]
11880
+ });
11917
11881
  if (pivotTotalColumnPosition !== false) {
11918
11882
  const pivotByForColumn = pivotBy[keys.length - 1];
11919
11883
  let columnGroupId = parentKeys.length ? parentKeys.join("/") : void 0;
11920
11884
  if (!isSingleAggregationColumn) {
11921
11885
  const parentGroupForTotalsGroup = columnGroupId;
11922
11886
  columnGroupId = `total:${keys.join("/")}`;
11923
- columnGroups.set(
11924
- columnGroupId,
11925
- prepareColumnGroup({
11926
- header: `${keys[keys.length - 1]} total`,
11927
- columnGroup: parentGroupForTotalsGroup,
11928
- pivotBy,
11929
- pivotTotalColumnGroup: true,
11930
- pivotGroupKeys: keys,
11931
- pivotIndex: keys.length - 1,
11932
- pivotByAtIndex: pivotByForColumn,
11933
- pivotGroupKey: keys[keys.length - 1]
11934
- })
11935
- );
11887
+ columnGroups[columnGroupId] = prepareColumnGroup({
11888
+ header: `${keys[keys.length - 1]} total`,
11889
+ columnGroup: parentGroupForTotalsGroup,
11890
+ pivotBy,
11891
+ pivotTotalColumnGroup: true,
11892
+ pivotGroupKeys: keys,
11893
+ pivotIndex: keys.length - 1,
11894
+ pivotByAtIndex: pivotByForColumn,
11895
+ pivotGroupKey: keys[keys.length - 1]
11896
+ });
11936
11897
  }
11937
11898
  aggregationReducers.forEach((reducer, index) => {
11938
11899
  const header = isSingleAggregationColumn ? `${keys[keys.length - 1]} total ` : `${reducer.name || reducer.id} total`;
@@ -11957,10 +11918,7 @@ function getPivotColumnsAndColumnGroups({
11957
11918
  return (_b = (_a = rowInfo.pivotValuesMap) == null ? void 0 : _a.get(keys)) == null ? void 0 : _b.reducerResults[reducer.id];
11958
11919
  }
11959
11920
  });
11960
- columns.set(
11961
- `total:${reducer.id}:${keys.join("/")}`,
11962
- computedPivotColumn
11963
- );
11921
+ columns[`total:${reducer.id}:${keys.join("/")}`] = computedPivotColumn;
11964
11922
  });
11965
11923
  }
11966
11924
  }
@@ -15008,7 +14966,7 @@ function DataSourceWithContext(props) {
15008
14966
  var _a;
15009
14967
  (_a = componentState.onReady) == null ? void 0 : _a.call(componentState, api);
15010
14968
  }, []);
15011
- return /* @__PURE__ */ React51.createElement(React51.Fragment, null, children);
14969
+ return /* @__PURE__ */ React50.createElement(React50.Fragment, null, children);
15012
14970
  }
15013
14971
  var DataSourceRoot = getComponentStateRoot({
15014
14972
  //@ts-ignore
@@ -15038,7 +14996,7 @@ function DataSourceCmp({
15038
14996
  const { componentState, componentActions, assignState } = useComponentState();
15039
14997
  componentState.getDataSourceMasterContextRef.current = getDataSourceMasterContext;
15040
14998
  const getState = useLatest(componentState);
15041
- const [api] = React51.useState(() => {
14999
+ const [api] = React50.useState(() => {
15042
15000
  return getDataSourceApi({ getState, actions: componentActions });
15043
15001
  });
15044
15002
  const contextValue = {
@@ -15090,13 +15048,13 @@ function DataSourceCmp({
15090
15048
  });
15091
15049
  }
15092
15050
  }, [componentState.originalDataArrayChangedInfo]);
15093
- return /* @__PURE__ */ React51.createElement(DataSourceContext.Provider, { value: contextValue }, /* @__PURE__ */ React51.createElement(DataSourceWithContext, { children }));
15051
+ return /* @__PURE__ */ React50.createElement(DataSourceContext.Provider, { value: contextValue }, /* @__PURE__ */ React50.createElement(DataSourceWithContext, { children }));
15094
15052
  }
15095
15053
  function DataSource(props) {
15096
15054
  const masterContext = useMasterDetailContext();
15097
15055
  const isDetail = !!masterContext;
15098
15056
  const key = isDetail ? masterContext.masterRowInfo.id : "master";
15099
- return /* @__PURE__ */ React51.createElement(DataSourceRoot, __spreadProps(__spreadValues({}, props), { key }), /* @__PURE__ */ React51.createElement(DataSourceCmp, { children: props.children, isDetail }));
15057
+ return /* @__PURE__ */ React50.createElement(DataSourceRoot, __spreadProps(__spreadValues({}, props), { key }), /* @__PURE__ */ React50.createElement(DataSourceCmp, { children: props.children, isDetail }));
15100
15058
  }
15101
15059
  function useRowInfoReducers() {
15102
15060
  const { rowInfoReducerResults } = useDataSource();
@@ -15418,7 +15376,8 @@ function getRowDetailApi(param) {
15418
15376
  return !rowDetailApi.isRowDetailCollapsed(pk);
15419
15377
  },
15420
15378
  collapseRowDetail(pk) {
15421
- const currentState = getState().rowDetailState;
15379
+ const componentState = getState();
15380
+ const currentState = componentState.rowDetailState;
15422
15381
  if (!currentState) {
15423
15382
  console.error(
15424
15383
  `Cannot collapse row details via rowDetailState, as no props.rowDetailState is provided.`
@@ -15427,10 +15386,13 @@ function getRowDetailApi(param) {
15427
15386
  }
15428
15387
  const state = new RowDetailState(currentState);
15429
15388
  state.collapseRowDetails(pk);
15389
+ componentState.lastRowToExpandRef.current = null;
15390
+ componentState.lastRowToCollapseRef.current = pk;
15430
15391
  actions.rowDetailState = state;
15431
15392
  },
15432
15393
  expandRowDetail(pk) {
15433
- const currentState = getState().rowDetailState;
15394
+ const componentState = getState();
15395
+ const currentState = componentState.rowDetailState;
15434
15396
  if (!currentState) {
15435
15397
  console.error(
15436
15398
  `Cannot expand row details via rowDetailState, as no props.rowDetailState is provided.`
@@ -15439,6 +15401,8 @@ function getRowDetailApi(param) {
15439
15401
  }
15440
15402
  const state = new RowDetailState(currentState);
15441
15403
  state.expandRowDetails(pk);
15404
+ componentState.lastRowToCollapseRef.current = null;
15405
+ componentState.lastRowToExpandRef.current = pk;
15442
15406
  actions.rowDetailState = state;
15443
15407
  },
15444
15408
  toggleRowDetail(pk) {
@@ -16467,7 +16431,7 @@ function useAutoSizeColumns() {
16467
16431
  // src/components/InfiniteTable/hooks/useCellRendering.tsx
16468
16432
  var import_react39 = require("react");
16469
16433
  var import_react40 = require("react");
16470
- var React53 = __toESM(require("react"));
16434
+ var React52 = __toESM(require("react"));
16471
16435
 
16472
16436
  // src/components/InfiniteTable/hooks/useYourBrain.ts
16473
16437
  function useYourBrain(param) {
@@ -16504,7 +16468,7 @@ function useYourBrain(param) {
16504
16468
  }
16505
16469
 
16506
16470
  // src/components/InfiniteTable/components/InfiniteTableRow/InfiniteTableDetailRow.tsx
16507
- var React52 = __toESM(require("react"));
16471
+ var React51 = __toESM(require("react"));
16508
16472
 
16509
16473
  // src/components/InfiniteTable/components/rowDetail.css.ts
16510
16474
  var RowDetailRecipe = createRuntimeFn({ defaultClassName: "rowDetail_RowDetailRecipe__evqes20", variantClassNames: {}, defaultVariants: {}, compoundVariants: [] });
@@ -16641,7 +16605,7 @@ function InfiniteTableDetailRowFn(props) {
16641
16605
  rowDetailsCache,
16642
16606
  rowInfo
16643
16607
  });
16644
- return /* @__PURE__ */ React52.createElement(DataSourceMasterDetailContext.Provider, { value: masterDetailContextValue }, /* @__PURE__ */ React52.createElement(
16608
+ return /* @__PURE__ */ React51.createElement(DataSourceMasterDetailContext.Provider, { value: masterDetailContextValue }, /* @__PURE__ */ React51.createElement(
16645
16609
  "div",
16646
16610
  {
16647
16611
  ref: domRef,
@@ -16650,6 +16614,7 @@ function InfiniteTableDetailRowFn(props) {
16650
16614
  position: "absolute",
16651
16615
  top: `${detailOffset}px`,
16652
16616
  left: 0,
16617
+ // TODO see #rowDetailWidth
16653
16618
  width: `calc(${InternalVars.bodyWidth} - ${InternalVars.scrollbarWidthVertical})`,
16654
16619
  height: rowDetailHeight
16655
16620
  }
@@ -16657,7 +16622,7 @@ function InfiniteTableDetailRowFn(props) {
16657
16622
  rowDetailRenderer(rowInfo, currentRowCache)
16658
16623
  ));
16659
16624
  }
16660
- var InfiniteTableDetailRow = React52.memo(
16625
+ var InfiniteTableDetailRow = React51.memo(
16661
16626
  InfiniteTableDetailRowFn
16662
16627
  );
16663
16628
 
@@ -16816,7 +16781,7 @@ function useCellRendering(param) {
16816
16781
  cellStyle,
16817
16782
  cellClassName
16818
16783
  };
16819
- return /* @__PURE__ */ React53.createElement(InfiniteTableColumnCell, __spreadValues({}, cellProps));
16784
+ return /* @__PURE__ */ React52.createElement(InfiniteTableColumnCell, __spreadValues({}, cellProps));
16820
16785
  },
16821
16786
  [
16822
16787
  rowHeight,
@@ -16847,10 +16812,10 @@ function useCellRendering(param) {
16847
16812
  const dataArray2 = getData();
16848
16813
  const rowInfo = dataArray2[rowIndex];
16849
16814
  if (!rowInfo || !isRowDetailsExpanded(rowInfo) || !computedRowSizeCacheForDetails) {
16850
- return /* @__PURE__ */ React53.createElement("div", { ref: domRef, className: visibility.hidden });
16815
+ return /* @__PURE__ */ React52.createElement("div", { ref: domRef, className: visibility.hidden });
16851
16816
  }
16852
16817
  const { rowDetailHeight: rowDetailHeight2, rowHeight: rowHeight2 } = computedRowSizeCacheForDetails.getSize(rowIndex);
16853
- return /* @__PURE__ */ React53.createElement(
16818
+ return /* @__PURE__ */ React52.createElement(
16854
16819
  InfiniteTableDetailRow,
16855
16820
  {
16856
16821
  rowInfo,
@@ -16879,7 +16844,7 @@ function useCellRendering(param) {
16879
16844
  }
16880
16845
 
16881
16846
  // src/components/InfiniteTable/hooks/useComputed.ts
16882
- var import_react52 = require("react");
16847
+ var import_react49 = require("react");
16883
16848
 
16884
16849
  // src/components/InfiniteTable/utils/MultiCellSelector.ts
16885
16850
  var MultiCellSelector = class {
@@ -17070,134 +17035,11 @@ var MultiRowSelector = class {
17070
17035
  }
17071
17036
  };
17072
17037
 
17073
- // src/components/InfiniteTable/hooks/useColumnGroups.ts
17074
- var import_react42 = require("react");
17075
-
17076
- // src/components/hooks/useInterceptedMap.ts
17077
- var import_react41 = require("react");
17078
- function interceptMap(map2, fns) {
17079
- const { set, delete: deleteKey, clear } = map2;
17080
- if (fns.set) {
17081
- map2.set = (key, value) => {
17082
- set.call(map2, key, value);
17083
- fns.set(key, value);
17084
- return map2;
17085
- };
17086
- }
17087
- if (fns.delete) {
17088
- map2.delete = (key) => {
17089
- const removed = deleteKey.call(map2, key);
17090
- fns.delete(key);
17091
- return removed;
17092
- };
17093
- }
17094
- if (fns.clear || fns.beforeClear) {
17095
- map2.clear = () => {
17096
- if (fns.beforeClear) {
17097
- fns.beforeClear(map2);
17098
- }
17099
- const result = clear.call(map2);
17100
- if (fns.clear) {
17101
- fns.clear();
17102
- }
17103
- return result;
17104
- };
17105
- }
17106
- return () => {
17107
- if (set) {
17108
- map2.set = set;
17109
- }
17110
- if (deleteKey) {
17111
- map2.delete = deleteKey;
17112
- }
17113
- if (clear) {
17114
- map2.clear = clear;
17115
- }
17116
- };
17117
- }
17118
-
17119
- // src/components/InfiniteTable/state/computeColumnGroupsDepths.ts
17120
- function computeColumnGroupsDepths(columnGroups) {
17121
- const map2 = /* @__PURE__ */ new Map();
17122
- columnGroups.forEach((colGroup, colGroupId) => {
17123
- let parentGroupId = colGroup.columnGroup;
17124
- let depth = 0;
17125
- while (parentGroupId) {
17126
- const parent = columnGroups.get(parentGroupId);
17127
- if (!parent) {
17128
- if (false) {
17129
- console.warn(`Cannot find column group ${parentGroupId}`);
17130
- }
17131
- break;
17132
- }
17133
- depth++;
17134
- parentGroupId = parent.columnGroup;
17135
- }
17136
- map2.set(colGroupId, depth);
17137
- });
17138
- return map2;
17139
- }
17140
-
17141
- // src/components/InfiniteTable/hooks/useColumnGroups.ts
17142
- function useColumnGroups() {
17143
- const {
17144
- componentState: {
17145
- computedColumnGroups,
17146
- collapsedColumnGroups
17147
- },
17148
- componentActions,
17149
- getComponentState
17150
- } = useComponentState();
17151
- (0, import_react42.useEffect)(() => {
17152
- const recompute = () => {
17153
- componentActions.columnGroupsDepthsMap = computeColumnGroupsDepths(computedColumnGroups);
17154
- };
17155
- const update = rafFn(recompute);
17156
- return interceptMap(computedColumnGroups, {
17157
- clear: update,
17158
- delete: update,
17159
- set: update
17160
- });
17161
- }, [computedColumnGroups]);
17162
- (0, import_react42.useEffect)(() => {
17163
- return interceptMap(collapsedColumnGroups, {
17164
- set: (key, visibleCol) => {
17165
- const colIds = key.slice(1);
17166
- const columnVisibility = __spreadValues({}, getComponentState().columnVisibility);
17167
- colIds.forEach((colId) => {
17168
- columnVisibility[colId] = false;
17169
- });
17170
- delete columnVisibility[visibleCol];
17171
- componentActions.columnVisibility = columnVisibility;
17172
- },
17173
- beforeClear: (currentCollapsedGroups) => {
17174
- const columnVisibility = __spreadValues({}, getComponentState().columnVisibility);
17175
- const keys = [...currentCollapsedGroups.keys()];
17176
- keys.forEach((key) => {
17177
- const colIds = key.slice(1);
17178
- colIds.forEach((colId) => {
17179
- delete columnVisibility[colId];
17180
- });
17181
- });
17182
- componentActions.columnVisibility = columnVisibility;
17183
- },
17184
- delete: (key) => {
17185
- const columnVisibility = __spreadValues({}, getComponentState().columnVisibility);
17186
- const colIds = key.slice(1);
17187
- colIds.forEach((colId) => {
17188
- delete columnVisibility[colId];
17189
- });
17190
- componentActions.columnVisibility = columnVisibility;
17191
- }
17192
- });
17193
- }, [collapsedColumnGroups]);
17194
- }
17195
-
17196
17038
  // src/components/InfiniteTable/hooks/useColumnRowspan.ts
17197
- var import_react43 = require("react");
17039
+ var import_react41 = require("react");
17198
17040
  function useColumnRowspan(computedVisibleColumns) {
17199
17041
  const { getState: getDataSourceState } = useDataSourceContextValue();
17200
- const rowspan = (0, import_react43.useMemo)(() => {
17042
+ const rowspan = (0, import_react41.useMemo)(() => {
17201
17043
  const colsWithRowspan = computedVisibleColumns.filter(
17202
17044
  (col) => typeof col.rowspan === "function"
17203
17045
  );
@@ -17225,10 +17067,10 @@ function useColumnRowspan(computedVisibleColumns) {
17225
17067
  }
17226
17068
 
17227
17069
  // src/components/InfiniteTable/hooks/useColumnSizeFn.ts
17228
- var import_react44 = require("react");
17070
+ var import_react42 = require("react");
17229
17071
  var debug5 = dbg("useColumnSizeFn");
17230
17072
  function useColumnSizeFn(columns) {
17231
- const columnSize = (0, import_react44.useCallback)(
17073
+ const columnSize = (0, import_react42.useCallback)(
17232
17074
  (index) => {
17233
17075
  const column = columns[index];
17234
17076
  if (false) {
@@ -17242,10 +17084,10 @@ function useColumnSizeFn(columns) {
17242
17084
  }
17243
17085
 
17244
17086
  // src/components/InfiniteTable/hooks/useColumnsWhen.ts
17245
- var import_react47 = require("react");
17087
+ var import_react45 = require("react");
17246
17088
 
17247
17089
  // src/components/InfiniteTable/state/getInitialState.ts
17248
- var import_react45 = require("react");
17090
+ var import_react43 = require("react");
17249
17091
 
17250
17092
  // src/components/VirtualBrain/ScrollListener.ts
17251
17093
  var initialScrollPosition = {
@@ -17282,29 +17124,34 @@ var ScrollListener = class {
17282
17124
  }
17283
17125
  };
17284
17126
 
17285
- // src/components/InfiniteTable/utils/toMap.ts
17286
- function toMap(mapOrObject, weakMapCache) {
17287
- if (!mapOrObject) {
17288
- return /* @__PURE__ */ new Map();
17289
- }
17290
- if (mapOrObject instanceof Map) {
17291
- return mapOrObject;
17292
- }
17293
- if (weakMapCache && weakMapCache.has(mapOrObject)) {
17294
- return weakMapCache.get(mapOrObject);
17295
- }
17296
- const result = new Map(Object.entries(mapOrObject));
17297
- if (weakMapCache) {
17298
- weakMapCache.set(mapOrObject, result);
17299
- }
17300
- return result;
17301
- }
17302
-
17127
+ // src/components/InfiniteTable/state/computeColumnGroupsDepths.ts
17128
+ function computeColumnGroupsDepths(columnGroups) {
17129
+ const map2 = /* @__PURE__ */ new Map();
17130
+ Object.keys(columnGroups).forEach((colGroupId) => {
17131
+ const colGroup = columnGroups[colGroupId];
17132
+ let parentGroupId = colGroup.columnGroup;
17133
+ let depth = 0;
17134
+ while (parentGroupId) {
17135
+ const parent = columnGroups[parentGroupId];
17136
+ if (!parent) {
17137
+ if (false) {
17138
+ console.warn(`Cannot find column group ${parentGroupId}`);
17139
+ }
17140
+ break;
17141
+ }
17142
+ depth++;
17143
+ parentGroupId = parent.columnGroup;
17144
+ }
17145
+ map2.set(colGroupId, depth);
17146
+ });
17147
+ return map2;
17148
+ }
17149
+
17303
17150
  // src/components/InfiniteTable/state/rowDetailRendererFromComponent.tsx
17304
- var React54 = __toESM(require("react"));
17151
+ var React53 = __toESM(require("react"));
17305
17152
  function getRowDetailRendererFromComponent(RowDetail) {
17306
17153
  return (rowInfo, cache) => {
17307
- return /* @__PURE__ */ React54.createElement(RowDetail, { key: rowInfo.id, rowInfo, cache });
17154
+ return /* @__PURE__ */ React53.createElement(RowDetail, { key: rowInfo.id, rowInfo, cache });
17308
17155
  };
17309
17156
  }
17310
17157
 
@@ -17328,7 +17175,7 @@ function getCellSelector(cellPosition) {
17328
17175
  function initSetupState2({
17329
17176
  debugId
17330
17177
  }) {
17331
- const columnsGeneratedForGrouping = /* @__PURE__ */ new Map();
17178
+ const columnsGeneratedForGrouping = {};
17332
17179
  const brain = new MatrixBrain(debugId);
17333
17180
  const headerBrain = new MatrixBrain("header");
17334
17181
  brain.onScroll((scrollPosition) => {
@@ -17348,11 +17195,13 @@ function initSetupState2({
17348
17195
  if (false) {
17349
17196
  globalThis.renderer = renderer;
17350
17197
  }
17351
- const domRef = (0, import_react45.createRef)();
17198
+ const domRef = (0, import_react43.createRef)();
17352
17199
  return {
17353
17200
  renderer,
17354
17201
  onRenderUpdater,
17355
17202
  propsCache: /* @__PURE__ */ new Map([]),
17203
+ lastRowToCollapseRef: { current: null },
17204
+ lastRowToExpandRef: { current: null },
17356
17205
  cellContextMenuVisibleFor: null,
17357
17206
  contextMenuVisibleFor: null,
17358
17207
  columnMenuVisibleForColumnId: null,
@@ -17368,12 +17217,12 @@ function initSetupState2({
17368
17217
  brain,
17369
17218
  headerBrain,
17370
17219
  domRef,
17371
- columnMenuTargetRef: (0, import_react45.createRef)(),
17372
- editingValueRef: (0, import_react45.createRef)(),
17373
- scrollerDOMRef: (0, import_react45.createRef)(),
17374
- portalDOMRef: (0, import_react45.createRef)(),
17375
- focusDetectDOMRef: (0, import_react45.createRef)(),
17376
- activeCellIndicatorDOMRef: (0, import_react45.createRef)(),
17220
+ columnMenuTargetRef: (0, import_react43.createRef)(),
17221
+ editingValueRef: (0, import_react43.createRef)(),
17222
+ scrollerDOMRef: (0, import_react43.createRef)(),
17223
+ portalDOMRef: (0, import_react43.createRef)(),
17224
+ focusDetectDOMRef: (0, import_react43.createRef)(),
17225
+ activeCellIndicatorDOMRef: (0, import_react43.createRef)(),
17377
17226
  onColumnMenuClick: buildSubscriptionCallback(),
17378
17227
  cellContextMenu: buildSubscriptionCallback(),
17379
17228
  contextMenu: buildSubscriptionCallback(),
@@ -17404,7 +17253,7 @@ function initSetupState2({
17404
17253
  editingCell: null
17405
17254
  };
17406
17255
  }
17407
- var forwardProps4 = (setupState) => {
17256
+ var forwardProps4 = (_setupState) => {
17408
17257
  return {
17409
17258
  debugId: 1,
17410
17259
  scrollTopKey: 1,
@@ -17490,7 +17339,7 @@ var forwardProps4 = (setupState) => {
17490
17339
  rowHeight: (rowHeight) => typeof rowHeight === "number" || typeof rowHeight === "function" ? rowHeight : 0,
17491
17340
  rowDetailHeight: (rowDetailHeight) => typeof rowDetailHeight === "number" || typeof rowDetailHeight === "function" ? rowDetailHeight : 300,
17492
17341
  columnHeaderHeight: (columnHeaderHeight) => typeof columnHeaderHeight === "number" ? columnHeaderHeight : 30,
17493
- columns: (columns) => toMap(columns, setupState.propsCache.get("columns")),
17342
+ columns: 1,
17494
17343
  columnVisibility: (columnVisibility) => columnVisibility != null ? columnVisibility : {},
17495
17344
  // TODO check if columnPinning works when the value for a pinned col is `true` instead of `"start"`
17496
17345
  columnSizing: (columnSizing) => columnSizing || {},
@@ -17504,7 +17353,7 @@ var forwardProps4 = (setupState) => {
17504
17353
  onEditPersistSuccess: 1,
17505
17354
  multiSortBehavior: (multiSortBehavior) => multiSortBehavior != null ? multiSortBehavior : "replace",
17506
17355
  collapsedColumnGroups: (collapsedColumnGroups) => collapsedColumnGroups != null ? collapsedColumnGroups : /* @__PURE__ */ new Map(),
17507
- columnGroups: (columnGroups) => toMap(columnGroups, setupState.propsCache.get("columnGroups"))
17356
+ columnGroups: 1
17508
17357
  };
17509
17358
  };
17510
17359
  function getGroupRenderStrategy(options) {
@@ -17553,6 +17402,21 @@ function getGroupByMap(groupBy) {
17553
17402
  }, /* @__PURE__ */ new Map());
17554
17403
  }
17555
17404
  var weakMap2 = /* @__PURE__ */ new WeakMap();
17405
+ function getMappedCallbacks2() {
17406
+ return {
17407
+ rowDetailState: (rowDetailState, state) => {
17408
+ return {
17409
+ callbackParams: [
17410
+ rowDetailState,
17411
+ {
17412
+ expandRow: state.lastRowToExpandRef.current,
17413
+ collapseRow: state.lastRowToCollapseRef.current
17414
+ }
17415
+ ]
17416
+ };
17417
+ }
17418
+ };
17419
+ }
17556
17420
  var mapPropsToState = (params) => {
17557
17421
  var _a, _b, _c, _d, _e;
17558
17422
  const { props, state, oldState, parentState } = params;
@@ -17621,26 +17485,22 @@ var mapPropsToState = (params) => {
17621
17485
  };
17622
17486
 
17623
17487
  // src/components/InfiniteTable/state/getColumnVisibilityForHideEmptyGroupColumns.ts
17624
- function getGroupColumnsMapForComputedColumns(computedColumns, groupByMap) {
17625
- const computedGroupColumns = /* @__PURE__ */ new Map();
17626
- computedColumns.forEach(
17627
- (column, colId) => {
17628
- const col = column;
17629
- if (!col.groupByForColumn || Array.isArray(col.groupByForColumn)) {
17630
- return;
17631
- }
17632
- const { groupByForColumn } = col;
17633
- const field = groupByForColumn.field || groupByForColumn.groupField;
17634
- const groupInfoForColumn = field ? groupByMap.get(field) : null;
17635
- if (!groupInfoForColumn) {
17636
- return;
17637
- }
17638
- computedGroupColumns.set(
17639
- colId,
17640
- column
17641
- );
17488
+ function getGroupColumnsForComputedColumns(computedColumns, groupByMap) {
17489
+ const computedGroupColumns = {};
17490
+ Object.keys(computedColumns).forEach((colId) => {
17491
+ const column = computedColumns[colId];
17492
+ const col = column;
17493
+ if (!col.groupByForColumn || Array.isArray(col.groupByForColumn)) {
17494
+ return;
17642
17495
  }
17643
- );
17496
+ const { groupByForColumn } = col;
17497
+ const field = groupByForColumn.field || groupByForColumn.groupField;
17498
+ const groupInfoForColumn = field ? groupByMap.get(field) : null;
17499
+ if (!groupInfoForColumn) {
17500
+ return;
17501
+ }
17502
+ computedGroupColumns[colId] = column;
17503
+ });
17644
17504
  return computedGroupColumns;
17645
17505
  }
17646
17506
  function getColumnVisibilityForHideEmptyGroupColumns(params) {
@@ -17654,13 +17514,11 @@ function getColumnVisibilityForHideEmptyGroupColumns(params) {
17654
17514
  } = params;
17655
17515
  const columnVisibility = __spreadValues({}, params.columnVisibility);
17656
17516
  if (!hideEmptyGroupColumns) {
17657
- computedGroupColumns.forEach(
17658
- (_column, colId) => {
17659
- if (columnVisibility[colId] === false) {
17660
- delete columnVisibility[colId];
17661
- }
17517
+ Object.keys(computedGroupColumns).forEach((colId) => {
17518
+ if (columnVisibility[colId] === false) {
17519
+ delete columnVisibility[colId];
17662
17520
  }
17663
- );
17521
+ });
17664
17522
  return columnVisibility;
17665
17523
  }
17666
17524
  if (!groupRowsIndexesInDataArray || !groupRowsIndexesInDataArray.length) {
@@ -17683,42 +17541,41 @@ function getColumnVisibilityForHideEmptyGroupColumns(params) {
17683
17541
  break;
17684
17542
  }
17685
17543
  }
17686
- computedGroupColumns.forEach(
17687
- (column, colId) => {
17688
- const { groupByForColumn } = column;
17689
- if (Array.isArray(groupByForColumn)) {
17690
- return;
17691
- }
17692
- const field = groupByForColumn.field || groupByForColumn.groupField;
17693
- if (!field) {
17694
- return;
17544
+ Object.keys(computedGroupColumns).forEach((colId) => {
17545
+ const column = computedGroupColumns[colId];
17546
+ const { groupByForColumn } = column;
17547
+ if (Array.isArray(groupByForColumn)) {
17548
+ return;
17549
+ }
17550
+ const field = groupByForColumn.field || groupByForColumn.groupField;
17551
+ if (!field) {
17552
+ return;
17553
+ }
17554
+ const groupInfoForColumn = groupByMap.get(field);
17555
+ const index = groupInfoForColumn.groupIndex;
17556
+ const shouldBeHidden = index > expandedGroupsLevel && hideEmptyGroupColumns;
17557
+ if (shouldBeHidden) {
17558
+ if (columnVisibility[colId] !== false) {
17559
+ columnVisibility[colId] = false;
17695
17560
  }
17696
- const groupInfoForColumn = groupByMap.get(field);
17697
- const index = groupInfoForColumn.groupIndex;
17698
- const shouldBeHidden = index > expandedGroupsLevel && hideEmptyGroupColumns;
17699
- if (shouldBeHidden) {
17700
- if (columnVisibility[colId] !== false) {
17701
- columnVisibility[colId] = false;
17702
- }
17703
- } else {
17704
- if (columnVisibility.hasOwnProperty(colId)) {
17705
- delete columnVisibility[colId];
17706
- }
17561
+ } else {
17562
+ if (columnVisibility.hasOwnProperty(colId)) {
17563
+ delete columnVisibility[colId];
17707
17564
  }
17708
17565
  }
17709
- );
17566
+ });
17710
17567
  return columnVisibility;
17711
17568
  }
17712
17569
 
17713
17570
  // src/components/InfiniteTable/hooks/useToggleGroupRow.ts
17714
- var import_react46 = require("react");
17571
+ var import_react44 = require("react");
17715
17572
  function useToggleGroupRow() {
17716
17573
  const {
17717
17574
  getState: getDataSourceState,
17718
17575
  componentActions: dataSourceActions,
17719
17576
  getDataSourceMasterContext
17720
17577
  } = useDataSourceContextValue();
17721
- const toggleGroupRow = (0, import_react46.useCallback)((groupKeys) => {
17578
+ const toggleGroupRow = (0, import_react44.useCallback)((groupKeys) => {
17722
17579
  const state = getDataSourceState();
17723
17580
  const newState = new GroupRowsState(state.groupRowsState);
17724
17581
  newState.toggleGroupRow(groupKeys);
@@ -17758,7 +17615,7 @@ function useToggleGroupRow() {
17758
17615
 
17759
17616
  // src/components/InfiniteTable/hooks/useColumnsWhen.ts
17760
17617
  function useGroupByMap(groupBy) {
17761
- return (0, import_react47.useMemo)(() => getGroupByMap(groupBy), [groupBy]);
17618
+ return (0, import_react45.useMemo)(() => getGroupByMap(groupBy), [groupBy]);
17762
17619
  }
17763
17620
  function useColumnsWhen() {
17764
17621
  const {
@@ -17772,13 +17629,13 @@ function useColumnsWhen() {
17772
17629
  pivotGrandTotalColumnPosition
17773
17630
  }
17774
17631
  } = useComponentState();
17775
- (0, import_react47.useEffect)(() => {
17632
+ (0, import_react45.useEffect)(() => {
17776
17633
  dataSourceActions.generateGroupRows = groupRenderStrategy !== "inline";
17777
17634
  }, [groupRenderStrategy]);
17778
- (0, import_react47.useEffect)(() => {
17635
+ (0, import_react45.useEffect)(() => {
17779
17636
  dataSourceActions.pivotTotalColumnPosition = pivotTotalColumnPosition;
17780
17637
  }, [pivotTotalColumnPosition]);
17781
- (0, import_react47.useEffect)(() => {
17638
+ (0, import_react45.useEffect)(() => {
17782
17639
  if (pivotGrandTotalColumnPosition != void 0) {
17783
17640
  dataSourceActions.pivotGrandTotalColumnPosition = pivotGrandTotalColumnPosition;
17784
17641
  }
@@ -17796,12 +17653,13 @@ function useColumnsWhenInlineGroupRenderStrategy(groupByMap) {
17796
17653
  componentState: { columns, groupRenderStrategy }
17797
17654
  } = useComponentState();
17798
17655
  function computeColumnsWhenInlineGroupRenderStrategy(columns2, groupByMap2, groupRenderStrategy2, toggleGroupRow2) {
17799
- const computedColumns = /* @__PURE__ */ new Map();
17656
+ const computedColumns = {};
17800
17657
  if (groupRenderStrategy2 !== "inline") {
17801
17658
  return;
17802
17659
  }
17803
- columns2.forEach((column, id) => {
17660
+ Object.keys(columns2).forEach((id) => {
17804
17661
  var _a, _b;
17662
+ const column = columns2[id];
17805
17663
  let base = {};
17806
17664
  const groupByForColumn = groupByMap2.get(column.field);
17807
17665
  if (groupByForColumn && groupRenderStrategy2 === "inline") {
@@ -17855,11 +17713,11 @@ function useColumnsWhenInlineGroupRenderStrategy(groupByMap) {
17855
17713
  };
17856
17714
  }
17857
17715
  const clone = __spreadValues(__spreadValues({}, base), column);
17858
- computedColumns.set(id, clone);
17716
+ computedColumns[id] = clone;
17859
17717
  });
17860
- return computedColumns.size === 0 ? void 0 : computedColumns;
17718
+ return Object.keys(computedColumns).length === 0 ? void 0 : computedColumns;
17861
17719
  }
17862
- (0, import_react47.useEffect)(() => {
17720
+ (0, import_react45.useEffect)(() => {
17863
17721
  const update = () => {
17864
17722
  componentActions.columnsWhenInlineGroupRenderStrategy = computeColumnsWhenInlineGroupRenderStrategy(
17865
17723
  columns,
@@ -17869,11 +17727,6 @@ function useColumnsWhenInlineGroupRenderStrategy(groupByMap) {
17869
17727
  );
17870
17728
  };
17871
17729
  update();
17872
- return interceptMap(columns, {
17873
- set: update,
17874
- delete: update,
17875
- clear: update
17876
- });
17877
17730
  }, [columns, groupByMap, groupRenderStrategy, toggleGroupRow]);
17878
17731
  }
17879
17732
  function useColumnsWhenGrouping() {
@@ -17895,7 +17748,7 @@ function useColumnsWhenGrouping() {
17895
17748
  getComponentState
17896
17749
  } = useComponentState();
17897
17750
  const toggleGroupRow = useToggleGroupRow();
17898
- (0, import_react47.useEffect)(() => {
17751
+ (0, import_react45.useEffect)(() => {
17899
17752
  const update = () => {
17900
17753
  const { columns: columnsWhenGrouping, groupColumnIds } = getColumnsWhenGrouping({
17901
17754
  columns,
@@ -17930,11 +17783,6 @@ function useColumnsWhenGrouping() {
17930
17783
  }
17931
17784
  };
17932
17785
  update();
17933
- return interceptMap(columns, {
17934
- set: update,
17935
- delete: update,
17936
- clear: update
17937
- });
17938
17786
  }, [
17939
17787
  columns,
17940
17788
  groupBy,
@@ -17971,12 +17819,12 @@ function useHideColumns(groupByMap) {
17971
17819
  groupRenderStrategy
17972
17820
  }
17973
17821
  } = useComponentState();
17974
- (0, import_react47.useLayoutEffect)(() => {
17822
+ (0, import_react45.useLayoutEffect)(() => {
17975
17823
  if (groupRenderStrategy !== "multi-column") {
17976
17824
  return;
17977
17825
  }
17978
17826
  const currentState = getComponentState();
17979
- const computedGroupColumns = getGroupColumnsMapForComputedColumns(
17827
+ const computedGroupColumns = getGroupColumnsForComputedColumns(
17980
17828
  computedColumns,
17981
17829
  groupByMap
17982
17830
  );
@@ -18004,7 +17852,7 @@ function useHideColumns(groupByMap) {
18004
17852
  hideEmptyGroupColumns ? groupRowsIndexesInDataArray : null,
18005
17853
  hideEmptyGroupColumns
18006
17854
  ]);
18007
- (0, import_react47.useEffect)(() => {
17855
+ (0, import_react45.useEffect)(() => {
18008
17856
  const isGrouped = groupBy.length > 0;
18009
17857
  const currentState = getComponentState();
18010
17858
  const {
@@ -18017,7 +17865,8 @@ function useHideColumns(groupByMap) {
18017
17865
  let updatedVisibilityWhenGrouping = false;
18018
17866
  let newlyHiddenColumns = /* @__PURE__ */ new Set();
18019
17867
  let newlyDisplayedColumns = /* @__PURE__ */ new Set();
18020
- computedColumns.forEach((col, id) => {
17868
+ Object.keys(computedColumns).forEach((id) => {
17869
+ const col = computedColumns[id];
18021
17870
  if (col.defaultHiddenWhenGroupedBy || hideColumnWhenGrouped2 != null) {
18022
17871
  const hideWhenGrouped = col.defaultHiddenWhenGroupedBy === "*" && isGrouped || (col.defaultHiddenWhenGroupedBy === true || hideColumnWhenGrouped2) && col.field && groupByMap.get(col.field) || typeof col.defaultHiddenWhenGroupedBy === "string" && groupByMap.get(col.defaultHiddenWhenGroupedBy) || typeof col.defaultHiddenWhenGroupedBy === "object" && Object.keys(col.defaultHiddenWhenGroupedBy).reduce(
18023
17872
  (acc, field) => acc || groupByMap.has(field),
@@ -18076,7 +17925,7 @@ function getColumnsWhenGrouping(params) {
18076
17925
  if (groupRenderStrategy === "inline") {
18077
17926
  return { columns: void 0, groupColumnIds: [] };
18078
17927
  }
18079
- const computedColumns = /* @__PURE__ */ new Map();
17928
+ const computedColumns = {};
18080
17929
  const groupColumnIds = [];
18081
17930
  if (groupRenderStrategy === "multi-column") {
18082
17931
  groupBy.forEach((groupByForColumn, groupIndexForColumn, arr) => {
@@ -18095,7 +17944,7 @@ function getColumnsWhenGrouping(params) {
18095
17944
  );
18096
17945
  const groupColumnId = generatedGroupColumn.id || `group-by-${groupByForColumn.field || groupByForColumn.groupField}`;
18097
17946
  groupColumnIds.push(groupColumnId);
18098
- computedColumns.set(groupColumnId, generatedGroupColumn);
17947
+ computedColumns[groupColumnId] = generatedGroupColumn;
18099
17948
  });
18100
17949
  } else if (groupRenderStrategy === "single-column" && groupBy.length) {
18101
17950
  const singleGroupColumn = getSingleGroupColumn(
@@ -18111,17 +17960,19 @@ function getColumnsWhenGrouping(params) {
18111
17960
  );
18112
17961
  const groupColumnId = singleGroupColumn.id || "group-by";
18113
17962
  groupColumnIds.push(groupColumnId);
18114
- computedColumns.set(groupColumnId, singleGroupColumn);
17963
+ computedColumns[groupColumnId] = singleGroupColumn;
18115
17964
  }
18116
17965
  if (pivotColumns) {
18117
17966
  const columnsByField = {};
18118
- columns.forEach((col) => {
17967
+ Object.keys(columns).forEach((colId) => {
17968
+ const col = columns[colId];
18119
17969
  if (col.field) {
18120
17970
  columnsByField[col.field] = col;
18121
17971
  }
18122
17972
  });
18123
- pivotColumns.forEach((col, key) => {
17973
+ Object.keys(pivotColumns).forEach((key) => {
18124
17974
  var _a, _b;
17975
+ const col = pivotColumns[key];
18125
17976
  const isSimpleTotalColumn = col.pivotTotalColumn && col.columnGroup;
18126
17977
  const isGrandTotalColumn = col.pivotTotalColumn && !col.columnGroup;
18127
17978
  if (isSimpleTotalColumn && pivotTotalColumnPosition === false) {
@@ -18143,7 +17994,7 @@ function getColumnsWhenGrouping(params) {
18143
17994
  }
18144
17995
  }
18145
17996
  if (column.inheritFromColumn !== false) {
18146
- const colToInheritFrom = typeof column.inheritFromColumn === "string" ? columns.get(column.inheritFromColumn) : ((_a = column.pivotAggregator) == null ? void 0 : _a.field) ? columnsByField[(_b = column.pivotAggregator) == null ? void 0 : _b.field] : void 0;
17997
+ const colToInheritFrom = typeof column.inheritFromColumn === "string" ? columns[column.inheritFromColumn] : ((_a = column.pivotAggregator) == null ? void 0 : _a.field) ? columnsByField[(_b = column.pivotAggregator) == null ? void 0 : _b.field] : void 0;
18147
17998
  column = __spreadValues(__spreadValues({}, colToInheritFrom), column);
18148
17999
  }
18149
18000
  if (!column.render && column.renderValue) {
@@ -18151,38 +18002,22 @@ function getColumnsWhenGrouping(params) {
18151
18002
  return column.renderValue(renderOptions);
18152
18003
  };
18153
18004
  }
18154
- computedColumns.set(key, column);
18005
+ computedColumns[key] = column;
18155
18006
  });
18156
18007
  } else {
18157
- columns.forEach((col, colId) => {
18158
- computedColumns.set(colId, col);
18008
+ Object.keys(columns).forEach((colId) => {
18009
+ const col = columns[colId];
18010
+ computedColumns[colId] = col;
18159
18011
  });
18160
18012
  }
18161
18013
  return {
18162
- columns: computedColumns.size ? computedColumns : void 0,
18014
+ columns: Object.keys(computedColumns).length ? computedColumns : void 0,
18163
18015
  groupColumnIds
18164
18016
  };
18165
18017
  }
18166
18018
 
18167
18019
  // src/components/InfiniteTable/hooks/useComputedColumns.ts
18168
- var import_react49 = require("react");
18169
-
18170
- // src/components/InfiniteTable/hooks/useRerenderOnKeyChange.ts
18171
- var import_react48 = require("react");
18172
- var useRerenderOnKeyChange = (map2) => {
18173
- const [renderId, rerender] = useRerender();
18174
- (0, import_react48.useEffect)(() => {
18175
- const update = rafFn(rerender);
18176
- return interceptMap(map2, {
18177
- set: update,
18178
- clear: update,
18179
- delete: update
18180
- });
18181
- }, [map2]);
18182
- return renderId;
18183
- };
18184
-
18185
- // src/components/InfiniteTable/hooks/useComputedColumns.ts
18020
+ var import_react46 = require("react");
18186
18021
  var useComputedColumns = ({
18187
18022
  columns,
18188
18023
  bodySize,
@@ -18214,7 +18049,7 @@ var useComputedColumns = ({
18214
18049
  columnVisibilityAssumeVisible,
18215
18050
  columnSizing
18216
18051
  }) => {
18217
- const columnsRenderId = useRerenderOnKeyChange(columns);
18052
+ const columnsRenderId = 1;
18218
18053
  const {
18219
18054
  computedRemainingSpace,
18220
18055
  computedColumnOrder,
@@ -18234,7 +18069,7 @@ var useComputedColumns = ({
18234
18069
  computedColumnsMap,
18235
18070
  computedColumnsMapInInitialOrder,
18236
18071
  fieldsToColumn
18237
- } = (0, import_react49.useMemo)(() => {
18072
+ } = (0, import_react46.useMemo)(() => {
18238
18073
  return getComputedColumns({
18239
18074
  columns,
18240
18075
  scrollbarWidth: scrollbarWidth2,
@@ -18318,7 +18153,7 @@ var useComputedColumns = ({
18318
18153
  };
18319
18154
 
18320
18155
  // src/components/InfiniteTable/hooks/useComputedRowHeight.ts
18321
- var import_react50 = require("react");
18156
+ var import_react47 = require("react");
18322
18157
  var RowSizeCache = class {
18323
18158
  constructor() {
18324
18159
  this.rowHeight = /* @__PURE__ */ new Map();
@@ -18404,7 +18239,7 @@ function getComputedRowHeight(param, cache) {
18404
18239
  return result;
18405
18240
  }
18406
18241
  function useComputedRowHeight(param) {
18407
- return (0, import_react50.useMemo)(() => {
18242
+ return (0, import_react47.useMemo)(() => {
18408
18243
  const computedRowSizeCache = new RowSizeCache();
18409
18244
  const computedRowHeight = getComputedRowHeight(param, computedRowSizeCache);
18410
18245
  return {
@@ -18421,7 +18256,7 @@ function useComputedRowHeight(param) {
18421
18256
  }
18422
18257
 
18423
18258
  // src/components/InfiniteTable/hooks/useScrollbars.ts
18424
- var import_react51 = require("react");
18259
+ var import_react48 = require("react");
18425
18260
  var INITIAL_SCROLLBARS = {
18426
18261
  vertical: false,
18427
18262
  horizontal: false
@@ -18429,8 +18264,8 @@ var INITIAL_SCROLLBARS = {
18429
18264
  function useScrollbars(brain) {
18430
18265
  const { getComponentState: getInfiniteTableState } = useComponentState();
18431
18266
  const { getState: getDataSourceState } = useDataSourceContextValue();
18432
- const [scrollbars, setScrollbars] = (0, import_react51.useState)(INITIAL_SCROLLBARS);
18433
- (0, import_react51.useEffect)(() => {
18267
+ const [scrollbars, setScrollbars] = (0, import_react48.useState)(INITIAL_SCROLLBARS);
18268
+ (0, import_react48.useEffect)(() => {
18434
18269
  return brain.onRenderCountChange(() => {
18435
18270
  const { scrollTopMax, scrollLeftMax } = brain;
18436
18271
  setScrollbars({
@@ -18439,7 +18274,7 @@ function useScrollbars(brain) {
18439
18274
  });
18440
18275
  });
18441
18276
  }, [brain]);
18442
- (0, import_react51.useLayoutEffect)(() => {
18277
+ (0, import_react48.useLayoutEffect)(() => {
18443
18278
  const dataSourceState = getDataSourceState();
18444
18279
  const { onScrollbarsChange } = getInfiniteTableState();
18445
18280
  const { notifyScrollbarsChange } = dataSourceState;
@@ -18479,7 +18314,7 @@ function useComputed() {
18479
18314
  bodySize,
18480
18315
  showSeparatePivotColumnForSingleAggregation
18481
18316
  } = componentState;
18482
- (0, import_react52.useState)(() => {
18317
+ (0, import_react49.useState)(() => {
18483
18318
  componentState.onRowHeightCSSVarChange.onChange((rowHeight2) => {
18484
18319
  if (rowHeight2) {
18485
18320
  componentActions.rowHeight = rowHeight2;
@@ -18498,11 +18333,10 @@ function useComputed() {
18498
18333
  }
18499
18334
  );
18500
18335
  });
18501
- (0, import_react52.useEffect)(() => {
18336
+ (0, import_react49.useEffect)(() => {
18502
18337
  dataSourceActions.showSeparatePivotColumnForSingleAggregation = showSeparatePivotColumnForSingleAggregation;
18503
18338
  }, [showSeparatePivotColumnForSingleAggregation]);
18504
18339
  const { multiSort, filterValue, filterTypes } = dataSourceState;
18505
- useColumnGroups();
18506
18340
  const { toggleGroupRow } = useColumnsWhen();
18507
18341
  const columns = componentState.computedColumns;
18508
18342
  const {
@@ -18566,14 +18400,14 @@ function useComputed() {
18566
18400
  const scrollbars = useScrollbars(brain);
18567
18401
  const computedPinnedStartOverflow = computedPinnedStartWidth ? computedPinnedStartColumnsWidth > computedPinnedStartWidth : false;
18568
18402
  const computedPinnedEndOverflow = computedPinnedEndWidth ? computedPinnedEndColumnsWidth > computedPinnedEndWidth : false;
18569
- const [multiRowSelector] = (0, import_react52.useState)(() => {
18403
+ const [multiRowSelector] = (0, import_react49.useState)(() => {
18570
18404
  const multiRowSelector2 = new MultiRowSelector({
18571
18405
  getIdForIndex: (index) => getDataSourceState().dataArray[index].id
18572
18406
  });
18573
18407
  return multiRowSelector2;
18574
18408
  });
18575
18409
  const getComputedVisibleColumns = useLatest(computedVisibleColumns);
18576
- const [multiCellSelector] = (0, import_react52.useState)(() => {
18410
+ const [multiCellSelector] = (0, import_react49.useState)(() => {
18577
18411
  return new MultiCellSelector({
18578
18412
  getPrimaryKeyByIndex: dataSourceApi.getPrimaryKeyByIndex,
18579
18413
  getColumnIdByIndex: (colIndex) => {
@@ -18623,7 +18457,7 @@ function useComputed() {
18623
18457
  }
18624
18458
 
18625
18459
  // src/components/InfiniteTable/hooks/useLicense/useLicense.ts
18626
- var import_react53 = require("react");
18460
+ var import_react50 = require("react");
18627
18461
 
18628
18462
  // src/components/InfiniteTable/hooks/useLicense/crc32.ts
18629
18463
  var DEFAULT_ReversedPolynomial = 3988292384;
@@ -18794,13 +18628,13 @@ var isInsidePlayground = isInsideSandbox() || isInsideSandpack();
18794
18628
  var useLicense = (licenseKey = "") => {
18795
18629
  const masterContext = useMasterDetailContext();
18796
18630
  const isDetail = !!masterContext;
18797
- const valid = (0, import_react53.useMemo)(() => {
18631
+ const valid = (0, import_react50.useMemo)(() => {
18798
18632
  if (isDetail) {
18799
18633
  return true;
18800
18634
  }
18801
18635
  let valid2 = isValidLicense(licenseKey, {
18802
18636
  publishedAt: 1624970570587,
18803
- version: "3.3.4"
18637
+ version: "4.1.0"
18804
18638
  });
18805
18639
  if (!licenseKey && !valid2 && isInsidePlayground) {
18806
18640
  return true;
@@ -18811,18 +18645,18 @@ var useLicense = (licenseKey = "") => {
18811
18645
  };
18812
18646
 
18813
18647
  // src/components/InfiniteTable/hooks/useScrollToActiveCell.ts
18814
- var import_react54 = require("react");
18648
+ var import_react51 = require("react");
18815
18649
  var RETRIES = 10;
18816
18650
  function useScrollToActiveCell(activeCellIndex, dataCount, imperativeApi) {
18817
- const didScrollRef = (0, import_react54.useRef)(false);
18818
- const rafId = (0, import_react54.useRef)(null);
18819
- (0, import_react54.useEffect)(() => {
18651
+ const didScrollRef = (0, import_react51.useRef)(false);
18652
+ const rafId = (0, import_react51.useRef)(null);
18653
+ (0, import_react51.useEffect)(() => {
18820
18654
  if (activeCellIndex != null) {
18821
18655
  didScrollRef.current = false;
18822
18656
  cancelRaf(rafId.current);
18823
18657
  }
18824
18658
  }, [activeCellIndex]);
18825
- (0, import_react54.useEffect)(() => {
18659
+ (0, import_react51.useEffect)(() => {
18826
18660
  if (activeCellIndex != null && !didScrollRef.current) {
18827
18661
  let tryScroll2 = function(times = 0) {
18828
18662
  times++;
@@ -18850,18 +18684,18 @@ function useScrollToActiveCell(activeCellIndex, dataCount, imperativeApi) {
18850
18684
  }
18851
18685
 
18852
18686
  // src/components/InfiniteTable/hooks/useScrollToActiveRow.ts
18853
- var import_react55 = require("react");
18687
+ var import_react52 = require("react");
18854
18688
  var RETRIES2 = 10;
18855
18689
  function useScrollToActiveRow(activeRowIndex, dataCount, imperativeApi) {
18856
- const didScrollRef = (0, import_react55.useRef)(false);
18857
- const rafId = (0, import_react55.useRef)(null);
18858
- (0, import_react55.useEffect)(() => {
18690
+ const didScrollRef = (0, import_react52.useRef)(false);
18691
+ const rafId = (0, import_react52.useRef)(null);
18692
+ (0, import_react52.useEffect)(() => {
18859
18693
  if (activeRowIndex != null) {
18860
18694
  didScrollRef.current = false;
18861
18695
  cancelAnimationFrame(rafId.current);
18862
18696
  }
18863
18697
  }, [activeRowIndex]);
18864
- (0, import_react55.useEffect)(() => {
18698
+ (0, import_react52.useEffect)(() => {
18865
18699
  if (activeRowIndex != null && !didScrollRef.current) {
18866
18700
  let tryScroll2 = function(times = 0) {
18867
18701
  times++;
@@ -18890,7 +18724,7 @@ function useScrollToActiveRow(activeRowIndex, dataCount, imperativeApi) {
18890
18724
  var toCSSVarName = (value) => `--infinite-${value}`;
18891
18725
 
18892
18726
  // src/components/InfiniteTable/eventHandlers/index.ts
18893
- var import_react56 = require("react");
18727
+ var import_react53 = require("react");
18894
18728
 
18895
18729
  // src/components/InfiniteTable/eventHandlers/onCellClick.ts
18896
18730
  function onCellClick(context, event) {
@@ -19753,7 +19587,7 @@ function useEventHandlersContext() {
19753
19587
  componentActions: dataSourceActions,
19754
19588
  api: dataSourceApi
19755
19589
  } = useDataSourceContextValue();
19756
- const context = (0, import_react56.useMemo)(() => {
19590
+ const context = (0, import_react53.useMemo)(() => {
19757
19591
  const context2 = {
19758
19592
  getComputed,
19759
19593
  getDataSourceMasterContext,
@@ -19781,7 +19615,7 @@ function useEventHandlersContext() {
19781
19615
  }
19782
19616
  function handleDOMEvents() {
19783
19617
  const context = useEventHandlersContext();
19784
- (0, import_react56.useEffect)(() => {
19618
+ (0, import_react53.useEffect)(() => {
19785
19619
  const removeOnKeyDown = context.getState().keyDown.onChange((event) => {
19786
19620
  onKeyDown(context, event);
19787
19621
  });
@@ -19825,7 +19659,7 @@ function handleDOMEvents() {
19825
19659
  }
19826
19660
  function subscribeToDOMEvents() {
19827
19661
  const { getState } = useInfiniteTable();
19828
- const onKeyDown2 = (0, import_react56.useCallback)((event) => {
19662
+ const onKeyDown2 = (0, import_react53.useCallback)((event) => {
19829
19663
  getState().keyDown(event);
19830
19664
  }, []);
19831
19665
  return { onKeyDown: onKeyDown2 };
@@ -19836,11 +19670,11 @@ function useDOMEventHandlers() {
19836
19670
  }
19837
19671
 
19838
19672
  // src/components/InfiniteTable/hooks/useColumnMenu.ts
19839
- var import_react61 = require("react");
19673
+ var import_react58 = require("react");
19840
19674
 
19841
19675
  // src/components/hooks/useOverlay/index.tsx
19842
- var React55 = __toESM(require("react"));
19843
- var import_react57 = require("react");
19676
+ var React54 = __toESM(require("react"));
19677
+ var import_react54 = require("react");
19844
19678
  var import_react_dom2 = require("react-dom");
19845
19679
 
19846
19680
  // src/utils/pageGeometry/Point.ts
@@ -20225,22 +20059,22 @@ function retrieveElement(elementGetter) {
20225
20059
  });
20226
20060
  }
20227
20061
  function DefaultOverlayPortal(props) {
20228
- return /* @__PURE__ */ React55.createElement("div", { style: { position: "fixed", top: 0, left: 0 } }, props.children);
20062
+ return /* @__PURE__ */ React54.createElement("div", { style: { position: "fixed", top: 0, left: 0 } }, props.children);
20229
20063
  }
20230
20064
  function OverlayContent(props) {
20231
- const nodeRef = React55.useRef(null);
20232
- (0, import_react57.useEffect)(() => {
20065
+ const nodeRef = React54.useRef(null);
20066
+ (0, import_react54.useEffect)(() => {
20233
20067
  return props.realign.onChange((handle) => {
20234
20068
  if (nodeRef.current && handle) {
20235
20069
  alignOverlayNode(nodeRef.current, handle);
20236
20070
  }
20237
20071
  });
20238
20072
  }, [props.realign]);
20239
- return /* @__PURE__ */ React55.createElement(
20073
+ return /* @__PURE__ */ React54.createElement(
20240
20074
  "div",
20241
20075
  {
20242
20076
  style: { position: "absolute", top: 0, left: 0 },
20243
- ref: (0, import_react57.useCallback)((node) => {
20077
+ ref: (0, import_react54.useCallback)((node) => {
20244
20078
  if (node) {
20245
20079
  alignOverlayNode(node, props);
20246
20080
  }
@@ -20290,8 +20124,8 @@ function alignOverlayNode(node, params) {
20290
20124
  });
20291
20125
  }
20292
20126
  function useOverlayPortal(content, portalContainer) {
20293
- const [container, setContainer] = (0, import_react57.useState)(null);
20294
- (0, import_react57.useLayoutEffect)(() => {
20127
+ const [container, setContainer] = (0, import_react54.useState)(null);
20128
+ (0, import_react54.useLayoutEffect)(() => {
20295
20129
  function getContainer() {
20296
20130
  return __async(this, null, function* () {
20297
20131
  const container2 = portalContainer ? yield retrieveElement(portalContainer) : null;
@@ -20307,22 +20141,22 @@ function useOverlayPortal(content, portalContainer) {
20307
20141
  }, [portalContainer]);
20308
20142
  return portalContainer ? container ? (0, import_react_dom2.createPortal)(content, container) : (
20309
20143
  // we're probably still fetching the container
20310
- /* @__PURE__ */ React55.createElement(React55.Fragment, null)
20311
- ) : portalContainer === null || portalContainer === false ? content : /* @__PURE__ */ React55.createElement(DefaultOverlayPortal, null, content);
20144
+ /* @__PURE__ */ React54.createElement(React54.Fragment, null)
20145
+ ) : portalContainer === null || portalContainer === false ? content : /* @__PURE__ */ React54.createElement(DefaultOverlayPortal, null, content);
20312
20146
  }
20313
20147
  function getIdForReactOnlyChild(children) {
20314
- if (React55.Children.count(children) === 1) {
20315
- const child = React55.Children.only(children);
20316
- if (React55.isValidElement(child)) {
20148
+ if (React54.Children.count(children) === 1) {
20149
+ const child = React54.Children.only(children);
20150
+ if (React54.isValidElement(child)) {
20317
20151
  return child.props.id || child.key;
20318
20152
  }
20319
20153
  }
20320
20154
  return null;
20321
20155
  }
20322
20156
  function injectPortalContainerAndConstrainInMenuChild(children, portalContainer, constrainTo) {
20323
- if (React55.Children.count(children) === 1) {
20324
- const child = React55.Children.only(children);
20325
- if (React55.isValidElement(child) && child.type[propToIdentifyMenu]) {
20157
+ if (React54.Children.count(children) === 1) {
20158
+ const child = React54.Children.only(children);
20159
+ if (React54.isValidElement(child) && child.type[propToIdentifyMenu]) {
20326
20160
  const newProps = {};
20327
20161
  if (child.props.portalContainer === void 0) {
20328
20162
  newProps.portalContainer = portalContainer;
@@ -20330,7 +20164,7 @@ function injectPortalContainerAndConstrainInMenuChild(children, portalContainer,
20330
20164
  if (child.props.constrainTo === void 0) {
20331
20165
  newProps.constrainTo = constrainTo;
20332
20166
  }
20333
- return React55.cloneElement(child, newProps);
20167
+ return React54.cloneElement(child, newProps);
20334
20168
  }
20335
20169
  }
20336
20170
  return children;
@@ -20339,14 +20173,14 @@ globalThis.allhandles = {};
20339
20173
  globalThis.thehandles = {};
20340
20174
  function useOverlay(params) {
20341
20175
  const rootParams = params;
20342
- const [handles] = (0, import_react57.useState)(() => /* @__PURE__ */ new Map());
20343
- const [handleToRealign, setHandleToRealign] = (0, import_react57.useState)(null);
20344
- const [realignTimestamp, setRealignTimestamp] = (0, import_react57.useState)(0);
20345
- const getContentForPortal = (0, import_react57.useCallback)(() => {
20176
+ const [handles] = (0, import_react54.useState)(() => /* @__PURE__ */ new Map());
20177
+ const [handleToRealign, setHandleToRealign] = (0, import_react54.useState)(null);
20178
+ const [realignTimestamp, setRealignTimestamp] = (0, import_react54.useState)(0);
20179
+ const getContentForPortal = (0, import_react54.useCallback)(() => {
20346
20180
  const contentForPortal = [];
20347
20181
  for (const [_2, handle] of handles) {
20348
20182
  contentForPortal.push(
20349
- /* @__PURE__ */ React55.createElement(OverlayContent, __spreadProps(__spreadValues({}, handle), { key: handle.key }))
20183
+ /* @__PURE__ */ React54.createElement(OverlayContent, __spreadProps(__spreadValues({}, handle), { key: handle.key }))
20350
20184
  );
20351
20185
  }
20352
20186
  return contentForPortal;
@@ -20356,7 +20190,7 @@ function useOverlay(params) {
20356
20190
  getContentForPortal(),
20357
20191
  params.portalContainer
20358
20192
  );
20359
- const showOverlay = (0, import_react57.useCallback)(
20193
+ const showOverlay = (0, import_react54.useCallback)(
20360
20194
  (content, params2) => {
20361
20195
  const id = params2.id || getIdForReactOnlyChild(content) || getChangeDetect();
20362
20196
  const key = `${id}`;
@@ -20391,7 +20225,7 @@ function useOverlay(params) {
20391
20225
  },
20392
20226
  [handles, rootParams.portalContainer, updateContent]
20393
20227
  );
20394
- React55.useEffect(() => {
20228
+ React54.useEffect(() => {
20395
20229
  if (handleToRealign) {
20396
20230
  const handle = handles.get(handleToRealign);
20397
20231
  if (handle) {
@@ -20410,7 +20244,7 @@ function useOverlay(params) {
20410
20244
  handles.clear();
20411
20245
  updateContent();
20412
20246
  };
20413
- React55.useEffect(() => {
20247
+ React54.useEffect(() => {
20414
20248
  }, []);
20415
20249
  return {
20416
20250
  portal,
@@ -20422,16 +20256,16 @@ function useOverlay(params) {
20422
20256
  }
20423
20257
 
20424
20258
  // src/components/InfiniteTable/utils/getMenuForColumn.tsx
20425
- var React61 = __toESM(require("react"));
20259
+ var React60 = __toESM(require("react"));
20426
20260
 
20427
20261
  // src/components/Menu/index.tsx
20428
- var React59 = __toESM(require("react"));
20262
+ var React58 = __toESM(require("react"));
20429
20263
 
20430
20264
  // src/components/Menu/getMenuState.tsx
20431
- var React57 = __toESM(require("react"));
20265
+ var React56 = __toESM(require("react"));
20432
20266
 
20433
20267
  // src/components/Menu/childrenToRuntimeItems.tsx
20434
- var React56 = __toESM(require("react"));
20268
+ var React55 = __toESM(require("react"));
20435
20269
 
20436
20270
  // src/components/Menu/MenuItem.tsx
20437
20271
  function MenuItem(_props) {
@@ -20450,7 +20284,7 @@ var MenuSeparatorCls = "MenuCls_MenuSeparatorCls__db3arfd";
20450
20284
  // src/components/Menu/childrenToRuntimeItems.tsx
20451
20285
  var SEPARATOR = "-";
20452
20286
  function MenuSeparator() {
20453
- return /* @__PURE__ */ React56.createElement("hr", { className: MenuSeparatorCls });
20287
+ return /* @__PURE__ */ React55.createElement("hr", { className: MenuSeparatorCls });
20454
20288
  }
20455
20289
  var toRuntimeItem = ({
20456
20290
  columns,
@@ -20459,7 +20293,7 @@ var toRuntimeItem = ({
20459
20293
  menuId
20460
20294
  }, item) => {
20461
20295
  const menuItem = item && (item.key != null || item.label != null) ? item : null;
20462
- const menuDecoration = menuItem === null ? item === SEPARATOR ? /* @__PURE__ */ React56.createElement(MenuSeparator, null) : item : null;
20296
+ const menuDecoration = menuItem === null ? item === SEPARATOR ? /* @__PURE__ */ React55.createElement(MenuSeparator, null) : item : null;
20463
20297
  const runtimeItem = menuItem != null ? {
20464
20298
  type: "item",
20465
20299
  parentMenuId: menuId,
@@ -20487,7 +20321,7 @@ var toRuntimeItem = ({
20487
20321
  return runtimeItem;
20488
20322
  };
20489
20323
  function childrenToRuntimeItems(context, children) {
20490
- return React56.Children.map(children, (child) => {
20324
+ return React55.Children.map(children, (child) => {
20491
20325
  if (child) {
20492
20326
  if (child.props.__is_menu_item || child.type === MenuItem) {
20493
20327
  const itemProps = __spreadValues({}, child.props);
@@ -20510,7 +20344,7 @@ function childrenToRuntimeItems(context, children) {
20510
20344
  // src/components/Menu/getMenuState.tsx
20511
20345
  var SUBMENU_COL_NAME = "submenu";
20512
20346
  function getInitialMenuState() {
20513
- const domRef = React57.createRef();
20347
+ const domRef = React56.createRef();
20514
20348
  return {
20515
20349
  keyboardActiveItemKey: null,
20516
20350
  activeItemKey: null,
@@ -20565,7 +20399,7 @@ var deriveStateFromProps2 = (params) => {
20565
20399
  columns.push({
20566
20400
  name: SUBMENU_COL_NAME,
20567
20401
  render: ({ domProps, item }) => {
20568
- return item.menu ? /* @__PURE__ */ React57.createElement("div", __spreadValues({}, domProps), /* @__PURE__ */ React57.createElement(ExpanderIcon, { expanded: false })) : /* @__PURE__ */ React57.createElement("div", __spreadValues({}, domProps));
20402
+ return item.menu ? /* @__PURE__ */ React56.createElement("div", __spreadValues({}, domProps), /* @__PURE__ */ React56.createElement(ExpanderIcon, { expanded: false })) : /* @__PURE__ */ React56.createElement("div", __spreadValues({}, domProps));
20569
20403
  }
20570
20404
  });
20571
20405
  }
@@ -20582,8 +20416,8 @@ var deriveStateFromProps2 = (params) => {
20582
20416
  };
20583
20417
 
20584
20418
  // src/components/Menu/Menu.tsx
20585
- var React58 = __toESM(require("react"));
20586
- var import_react60 = require("react");
20419
+ var React57 = __toESM(require("react"));
20420
+ var import_react57 = require("react");
20587
20421
 
20588
20422
  // src/utils/pageGeometry/Triangle.ts
20589
20423
  var Triangle = class extends ConvexPoly {
@@ -20802,24 +20636,24 @@ var MenuTriangleContext = class {
20802
20636
  };
20803
20637
 
20804
20638
  // src/components/Menu/MenuContext.ts
20805
- var import_react58 = require("react");
20806
- var MenuContext = (0, import_react58.createContext)(null);
20639
+ var import_react55 = require("react");
20640
+ var MenuContext = (0, import_react55.createContext)(null);
20807
20641
  function useMenuContext() {
20808
- const contextValue = (0, import_react58.useContext)(MenuContext);
20642
+ const contextValue = (0, import_react55.useContext)(MenuContext);
20809
20643
  return contextValue;
20810
20644
  }
20811
20645
 
20812
20646
  // src/components/hooks/useMounted.ts
20813
- var import_react59 = require("react");
20647
+ var import_react56 = require("react");
20814
20648
  function useMounted() {
20815
- let mountedRef = (0, import_react59.useRef)(true);
20816
- (0, import_react59.useEffect)(() => {
20649
+ let mountedRef = (0, import_react56.useRef)(true);
20650
+ (0, import_react56.useEffect)(() => {
20817
20651
  mountedRef.current = true;
20818
20652
  return () => {
20819
20653
  mountedRef.current = false;
20820
20654
  };
20821
20655
  }, []);
20822
- const isMounted = (0, import_react59.useCallback)(() => mountedRef.current, []);
20656
+ const isMounted = (0, import_react56.useCallback)(() => mountedRef.current, []);
20823
20657
  return isMounted;
20824
20658
  }
20825
20659
 
@@ -20842,7 +20676,7 @@ function renderSubmenuForItem(item, config) {
20842
20676
  if (typeof itemMenu === "function") {
20843
20677
  itemMenu = itemMenu();
20844
20678
  }
20845
- return /* @__PURE__ */ React58.createElement(
20679
+ return /* @__PURE__ */ React57.createElement(
20846
20680
  Menu,
20847
20681
  __spreadProps(__spreadValues({
20848
20682
  key: overlayId,
@@ -20915,7 +20749,7 @@ function useSubmenus({
20915
20749
  onItemActivate
20916
20750
  }) {
20917
20751
  const { getState } = useMenuContext();
20918
- const [{ onItemEnter, onItemLeave }] = (0, import_react60.useState)(() => {
20752
+ const [{ onItemEnter, onItemLeave }] = (0, import_react57.useState)(() => {
20919
20753
  return new MenuTriangleContext({
20920
20754
  parentMenuId: getState().parentMenuId,
20921
20755
  onItemActivate: (itemKey) => {
@@ -20946,8 +20780,8 @@ function useSubmenus({
20946
20780
  }).getHandlers();
20947
20781
  });
20948
20782
  return {
20949
- onItemEnter: (0, import_react60.useCallback)(onItemEnter, []),
20950
- onItemLeave: (0, import_react60.useCallback)(onItemLeave, [])
20783
+ onItemEnter: (0, import_react57.useCallback)(onItemEnter, []),
20784
+ onItemLeave: (0, import_react57.useCallback)(onItemLeave, [])
20951
20785
  };
20952
20786
  }
20953
20787
  function MenuComponent(props) {
@@ -20972,16 +20806,16 @@ function MenuComponent(props) {
20972
20806
  componentActions,
20973
20807
  getState
20974
20808
  } = useMenuContext();
20975
- const setKeyboardActiveItemKey = (0, import_react60.useCallback)((key) => {
20809
+ const setKeyboardActiveItemKey = (0, import_react57.useCallback)((key) => {
20976
20810
  componentActions.keyboardActiveItemKey = key;
20977
20811
  }, []);
20978
- const setActiveItemKey = (0, import_react60.useCallback)((key) => {
20812
+ const setActiveItemKey = (0, import_react57.useCallback)((key) => {
20979
20813
  componentActions.activeItemKey = key;
20980
20814
  }, []);
20981
20815
  const isMounted = useMounted();
20982
- const [submenuApi, setSubmenuApi] = (0, import_react60.useState)(null);
20816
+ const [submenuApi, setSubmenuApi] = (0, import_react57.useState)(null);
20983
20817
  let renderedChildren = null;
20984
- (0, import_react60.useLayoutEffect)(() => {
20818
+ (0, import_react57.useLayoutEffect)(() => {
20985
20819
  const { runtimeItems: runtimeItems2 } = getState();
20986
20820
  const activeItem = runtimeItems2.filter(
20987
20821
  (item) => item.type === "item" && activeItemKey === item.key
@@ -21055,7 +20889,7 @@ function MenuComponent(props) {
21055
20889
  setActiveItemKey(key);
21056
20890
  }
21057
20891
  });
21058
- renderedChildren = runtimeItems.map((runtimeItem, index) => /* @__PURE__ */ React58.createElement(
20892
+ renderedChildren = runtimeItems.map((runtimeItem, index) => /* @__PURE__ */ React57.createElement(
21059
20893
  RuntimeItemRenderer,
21060
20894
  {
21061
20895
  key: runtimeItem.type === "item" ? runtimeItem.key : index,
@@ -21192,7 +21026,7 @@ function MenuComponent(props) {
21192
21026
  function onMenuBlur() {
21193
21027
  componentActions.focused = false;
21194
21028
  }
21195
- const onMenuFocus = (0, import_react60.useCallback)(function() {
21029
+ const onMenuFocus = (0, import_react57.useCallback)(function() {
21196
21030
  componentActions.focused = true;
21197
21031
  setTimeout(() => {
21198
21032
  var _a, _b;
@@ -21203,13 +21037,13 @@ function MenuComponent(props) {
21203
21037
  }
21204
21038
  });
21205
21039
  }, []);
21206
- const shouldSelectFirstItemOnFocus = (0, import_react60.useRef)(true);
21207
- const hideAll = (0, import_react60.useCallback)(() => {
21040
+ const shouldSelectFirstItemOnFocus = (0, import_react57.useRef)(true);
21041
+ const hideAll = (0, import_react57.useCallback)(() => {
21208
21042
  var _a;
21209
21043
  const state = getState();
21210
21044
  (_a = state.onHideIntent) == null ? void 0 : _a.call(state, state);
21211
21045
  }, [getState]);
21212
- const [api] = (0, import_react60.useState)(() => {
21046
+ const [api] = (0, import_react57.useState)(() => {
21213
21047
  const result2 = {
21214
21048
  hideMenu: hideAll,
21215
21049
  focus: () => {
@@ -21228,7 +21062,7 @@ function MenuComponent(props) {
21228
21062
  };
21229
21063
  return result2;
21230
21064
  });
21231
- const refCallback = (0, import_react60.useCallback)((node) => {
21065
+ const refCallback = (0, import_react57.useCallback)((node) => {
21232
21066
  if (node) {
21233
21067
  domRef.current = node;
21234
21068
  onShow == null ? void 0 : onShow(getState(), api);
@@ -21240,7 +21074,7 @@ function MenuComponent(props) {
21240
21074
  domRef.current = node;
21241
21075
  }
21242
21076
  }, []);
21243
- const result = /* @__PURE__ */ React58.createElement("div", { className: display.contents }, /* @__PURE__ */ React58.createElement(
21077
+ const result = /* @__PURE__ */ React57.createElement("div", { className: display.contents }, /* @__PURE__ */ React57.createElement(
21244
21078
  "div",
21245
21079
  __spreadProps(__spreadValues({}, domProps), {
21246
21080
  "data-menu-id": menuId,
@@ -21272,12 +21106,12 @@ function MenuComponent(props) {
21272
21106
  return destroyed ? null : result;
21273
21107
  }
21274
21108
  function RuntimeItemRenderer(props) {
21275
- const [pressed, setPressed] = React58.useState(false);
21109
+ const [pressed, setPressed] = React57.useState(false);
21276
21110
  const { columns, item, index, active, keyboardActive } = props;
21277
21111
  const key = item.type === "item" ? item.value.key : index;
21278
21112
  let content = null;
21279
21113
  if (item.type === "decoration") {
21280
- content = /* @__PURE__ */ React58.createElement("div", { style: item.style }, item.value);
21114
+ content = /* @__PURE__ */ React57.createElement("div", { style: item.style }, item.value);
21281
21115
  } else {
21282
21116
  let spanIndex = 0;
21283
21117
  content = columns.map((col, i) => {
@@ -21338,7 +21172,7 @@ function RuntimeItemRenderer(props) {
21338
21172
  }
21339
21173
  }
21340
21174
  };
21341
- return col.render ? /* @__PURE__ */ React58.createElement(
21175
+ return col.render ? /* @__PURE__ */ React57.createElement(
21342
21176
  RenderHookComponent,
21343
21177
  {
21344
21178
  key: `${key}-${field}`,
@@ -21350,10 +21184,10 @@ function RuntimeItemRenderer(props) {
21350
21184
  domProps
21351
21185
  }
21352
21186
  }
21353
- ) : /* @__PURE__ */ React58.createElement("div", __spreadValues({ key: `${key}-${field}` }, domProps), target[field]);
21187
+ ) : /* @__PURE__ */ React57.createElement("div", __spreadValues({ key: `${key}-${field}` }, domProps), target[field]);
21354
21188
  }).filter(Boolean);
21355
21189
  }
21356
- return /* @__PURE__ */ React58.createElement("div", { className: MenuRowCls }, content);
21190
+ return /* @__PURE__ */ React57.createElement("div", { className: MenuRowCls }, content);
21357
21191
  }
21358
21192
 
21359
21193
  // src/components/Menu/index.tsx
@@ -21367,12 +21201,12 @@ var MenuRoot = getComponentStateRoot({
21367
21201
  function MenuContextProvider(props) {
21368
21202
  const { componentActions, componentState } = useComponentState();
21369
21203
  const getState = useLatest(componentState);
21370
- return /* @__PURE__ */ React59.createElement(
21204
+ return /* @__PURE__ */ React58.createElement(
21371
21205
  MenuContext.Provider,
21372
21206
  {
21373
21207
  value: { componentActions, componentState, getState }
21374
21208
  },
21375
- /* @__PURE__ */ React59.createElement(MenuComponent, { domProps: props.domProps })
21209
+ /* @__PURE__ */ React58.createElement(MenuComponent, { domProps: props.domProps })
21376
21210
  );
21377
21211
  }
21378
21212
  function Menu(props) {
@@ -21414,24 +21248,24 @@ function Menu(props) {
21414
21248
  //@ts-ignore
21415
21249
  "__is_infinite_menu_component"
21416
21250
  ]);
21417
- const menu = /* @__PURE__ */ React59.createElement(
21251
+ const menu = /* @__PURE__ */ React58.createElement(
21418
21252
  MenuRoot,
21419
21253
  __spreadValues({
21420
21254
  addSubmenuColumnIfNeeded,
21421
21255
  bubbleActionsFromSubmenus,
21422
21256
  wrapLabels
21423
21257
  }, props),
21424
- /* @__PURE__ */ React59.createElement(MenuContextProvider, { domProps })
21258
+ /* @__PURE__ */ React58.createElement(MenuContextProvider, { domProps })
21425
21259
  );
21426
21260
  if (false) {
21427
- return /* @__PURE__ */ React59.createElement(React59.StrictMode, null, menu);
21261
+ return /* @__PURE__ */ React58.createElement(React58.StrictMode, null, menu);
21428
21262
  }
21429
21263
  return menu;
21430
21264
  }
21431
21265
  Menu[propToIdentifyMenu] = true;
21432
21266
 
21433
21267
  // src/components/InfiniteTable/utils/defaultGetColumnMenuItems.tsx
21434
- var React60 = __toESM(require("react"));
21268
+ var React59 = __toESM(require("react"));
21435
21269
  function defaultGetColumnMenuItems(_items, params) {
21436
21270
  const { columnApi, column, getComputed, api } = params;
21437
21271
  const sortable = columnApi.isSortable();
@@ -21518,7 +21352,7 @@ function defaultGetColumnMenuItems(_items, params) {
21518
21352
  colItems.push({
21519
21353
  key: id,
21520
21354
  label,
21521
- check: /* @__PURE__ */ React60.createElement(
21355
+ check: /* @__PURE__ */ React59.createElement(
21522
21356
  InfiniteCheckBox,
21523
21357
  {
21524
21358
  key: col.id,
@@ -21581,7 +21415,7 @@ function getMenuForColumn(columnId, context, onHideIntent) {
21581
21415
  if (!items || !items.length) {
21582
21416
  return null;
21583
21417
  }
21584
- return /* @__PURE__ */ React61.createElement(
21418
+ return /* @__PURE__ */ React60.createElement(
21585
21419
  MenuCmp,
21586
21420
  {
21587
21421
  autoFocus: true,
@@ -21652,7 +21486,7 @@ function useColumnMenu() {
21652
21486
  } = useOverlay({
21653
21487
  portalContainer: masterContext ? masterContext.getMasterState().portalDOMRef.current : false
21654
21488
  });
21655
- (0, import_react61.useEffect)(() => {
21489
+ (0, import_react58.useEffect)(() => {
21656
21490
  const { actions: actions2, getState: getState2 } = context;
21657
21491
  const state = getState2();
21658
21492
  return state.onColumnMenuClick.onChange((info) => {
@@ -21667,7 +21501,7 @@ function useColumnMenu() {
21667
21501
  });
21668
21502
  }, []);
21669
21503
  const { columnMenuVisibleForColumnId, columnMenuVisibleKey } = getState();
21670
- (0, import_react61.useEffect)(() => {
21504
+ (0, import_react58.useEffect)(() => {
21671
21505
  const { columnMenuVisibleForColumnId: columnMenuVisibleForColumnId2, columnMenuTargetRef } = getState();
21672
21506
  if (columnMenuVisibleForColumnId2) {
21673
21507
  let handleMouseDown2 = function(event) {
@@ -21701,8 +21535,8 @@ function useColumnMenu() {
21701
21535
  }
21702
21536
 
21703
21537
  // src/components/InfiniteTable/components/FocusDetect.tsx
21704
- var React62 = __toESM(require("react"));
21705
- var import_react62 = require("react");
21538
+ var React61 = __toESM(require("react"));
21539
+ var import_react59 = require("react");
21706
21540
  var style = {
21707
21541
  width: 0,
21708
21542
  height: 0,
@@ -21722,7 +21556,7 @@ function FocusDetect() {
21722
21556
  } = useInfiniteTable();
21723
21557
  const { getState: getDataSourceState, getDataSourceMasterContext } = useDataSourceContextValue();
21724
21558
  const { focusDetectDOMRef } = getState();
21725
- const onFocus = (0, import_react62.useCallback)(() => __async(this, null, function* () {
21559
+ const onFocus = (0, import_react59.useCallback)(() => __async(this, null, function* () {
21726
21560
  const context = {
21727
21561
  getDataSourceState,
21728
21562
  getDataSourceMasterContext,
@@ -21735,7 +21569,7 @@ function FocusDetect() {
21735
21569
  };
21736
21570
  focusLastFocusableCell(context);
21737
21571
  }), []);
21738
- return /* @__PURE__ */ React62.createElement(
21572
+ return /* @__PURE__ */ React61.createElement(
21739
21573
  "div",
21740
21574
  {
21741
21575
  onFocus,
@@ -21747,13 +21581,13 @@ function FocusDetect() {
21747
21581
  }
21748
21582
 
21749
21583
  // src/components/InfiniteTable/hooks/useEditingCallbackProps.ts
21750
- var import_react63 = require("react");
21584
+ var import_react60 = require("react");
21751
21585
  function useOnEditCancelled() {
21752
21586
  const context = useInfiniteTable();
21753
21587
  const { getState } = context;
21754
21588
  const { editingCell } = getState();
21755
21589
  const cancelled = editingCell && !editingCell.active ? editingCell.cancelled : void 0;
21756
- (0, import_react63.useEffect)(() => {
21590
+ (0, import_react60.useEffect)(() => {
21757
21591
  if (cancelled) {
21758
21592
  const { rowIndex, columnId, initialValue } = getState().editingCell;
21759
21593
  const { onEditCancelled } = getState();
@@ -21773,7 +21607,7 @@ function useOnEditRejected() {
21773
21607
  state: { editingCell }
21774
21608
  } = context;
21775
21609
  const rejected = editingCell && !editingCell.active && editingCell.accepted instanceof Error ? editingCell.accepted : void 0;
21776
- (0, import_react63.useEffect)(() => {
21610
+ (0, import_react60.useEffect)(() => {
21777
21611
  if (rejected) {
21778
21612
  const { rowIndex, columnId, value, initialValue } = getState().editingCell;
21779
21613
  const { onEditRejected } = getState();
@@ -21795,7 +21629,7 @@ function useFocusOnEditStop() {
21795
21629
  } = context;
21796
21630
  const active = editingCell == null ? void 0 : editingCell.active;
21797
21631
  const prevActive = usePrevious(active);
21798
- (0, import_react63.useEffect)(() => {
21632
+ (0, import_react60.useEffect)(() => {
21799
21633
  if (!active && prevActive) {
21800
21634
  context.api.focus();
21801
21635
  }
@@ -21808,7 +21642,7 @@ function useOnEditAccepted() {
21808
21642
  getState
21809
21643
  } = context;
21810
21644
  const accepted = editingCell && !editingCell.active && !editingCell.cancelled && editingCell.accepted === true;
21811
- (0, import_react63.useEffect)(() => {
21645
+ (0, import_react60.useEffect)(() => {
21812
21646
  var _a, _b;
21813
21647
  if (accepted) {
21814
21648
  const { editingCell: editingCell2 } = getState();
@@ -21832,7 +21666,7 @@ function useOnEditPersisted() {
21832
21666
  getState
21833
21667
  } = context;
21834
21668
  const persisted = editingCell ? editingCell.persisted : void 0;
21835
- (0, import_react63.useEffect)(() => {
21669
+ (0, import_react60.useEffect)(() => {
21836
21670
  if (persisted) {
21837
21671
  const { editingCell: editingCell2, onEditPersistError, onEditPersistSuccess } = getState();
21838
21672
  if (!editingCell2) {
@@ -21863,21 +21697,21 @@ function useEditingCallbackProps() {
21863
21697
  }
21864
21698
 
21865
21699
  // src/components/InfiniteTable/hooks/useColumnFilterOperatorMenu.ts
21866
- var import_react64 = require("react");
21700
+ var import_react61 = require("react");
21867
21701
 
21868
21702
  // src/components/InfiniteTable/utils/getFilterOperatorMenuForColumn.tsx
21869
- var React65 = __toESM(require("react"));
21703
+ var React64 = __toESM(require("react"));
21870
21704
 
21871
21705
  // src/components/InfiniteTable/components/icons/ClearIcon.tsx
21872
- var React63 = __toESM(require("react"));
21706
+ var React62 = __toESM(require("react"));
21873
21707
  var ClearIcon = (props) => {
21874
- return /* @__PURE__ */ React63.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React63.createElement("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }));
21708
+ return /* @__PURE__ */ React62.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React62.createElement("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }));
21875
21709
  };
21876
21710
 
21877
21711
  // src/components/InfiniteTable/components/icons/DoneIcon.tsx
21878
- var React64 = __toESM(require("react"));
21712
+ var React63 = __toESM(require("react"));
21879
21713
  var DoneIcon = (props) => {
21880
- return /* @__PURE__ */ React64.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React64.createElement("path", { d: "m9.55 19-6.725-6.725L5.25 9.85l4.3 4.325 9.225-9.225 2.425 2.4Z" }));
21714
+ return /* @__PURE__ */ React63.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React63.createElement("path", { d: "m9.55 19-6.725-6.725L5.25 9.85l4.3 4.325 9.225-9.225 2.425 2.4Z" }));
21881
21715
  };
21882
21716
 
21883
21717
  // src/components/InfiniteTable/utils/getFilterOperatorMenuForColumn.tsx
@@ -21923,12 +21757,12 @@ function getFilterOperatorMenuForColumn(columnId, context, onHideIntent) {
21923
21757
  const IconCmp = (_b = (_a2 = operator.components) == null ? void 0 : _a2.Icon) != null ? _b : FilterIcon;
21924
21758
  return {
21925
21759
  key,
21926
- icon: /* @__PURE__ */ React65.createElement(IconCmp, null),
21927
- label: /* @__PURE__ */ React65.createElement(React65.Fragment, null, (_c = operator.label) != null ? _c : operator.name),
21760
+ icon: /* @__PURE__ */ React64.createElement(IconCmp, null),
21761
+ label: /* @__PURE__ */ React64.createElement(React64.Fragment, null, (_c = operator.label) != null ? _c : operator.name),
21928
21762
  onAction: () => {
21929
21763
  api.setColumnFilterOperator(columnId, key);
21930
21764
  },
21931
- checked: checked ? /* @__PURE__ */ React65.createElement(DoneIcon, { size: 16 }) : null
21765
+ checked: checked ? /* @__PURE__ */ React64.createElement(DoneIcon, { size: 16 }) : null
21932
21766
  };
21933
21767
  });
21934
21768
  const firstItems = [
@@ -21943,7 +21777,7 @@ function getFilterOperatorMenuForColumn(columnId, context, onHideIntent) {
21943
21777
  {
21944
21778
  key: "reset",
21945
21779
  label: "Reset",
21946
- icon: /* @__PURE__ */ React65.createElement(ClearIcon, null),
21780
+ icon: /* @__PURE__ */ React64.createElement(ClearIcon, null),
21947
21781
  disabled: !column.computedFiltered,
21948
21782
  onAction: () => {
21949
21783
  api.clearColumnFilter(columnId);
@@ -21965,7 +21799,7 @@ function getFilterOperatorMenuForColumn(columnId, context, onHideIntent) {
21965
21799
  filterTypes
21966
21800
  };
21967
21801
  const items = getFilterOperatorMenuItems ? getFilterOperatorMenuItems(defaultItems, param) : defaultItems;
21968
- return /* @__PURE__ */ React65.createElement(
21802
+ return /* @__PURE__ */ React64.createElement(
21969
21803
  MenuCmp,
21970
21804
  {
21971
21805
  autoFocus: true,
@@ -22006,7 +21840,7 @@ function useColumnFilterOperatorMenu() {
22006
21840
  } = useOverlay({
22007
21841
  portalContainer: masterContext ? masterContext.getMasterState().portalDOMRef.current : false
22008
21842
  });
22009
- (0, import_react64.useEffect)(() => {
21843
+ (0, import_react61.useEffect)(() => {
22010
21844
  const { actions: actions2, getState: getState2 } = context;
22011
21845
  const state = getState2();
22012
21846
  return state.onFilterOperatorMenuClick.onChange((info) => {
@@ -22042,7 +21876,7 @@ function useColumnFilterOperatorMenu() {
22042
21876
  actions2.filterOperatorMenuVisibleForColumnId = column.id;
22043
21877
  });
22044
21878
  }, []);
22045
- (0, import_react64.useEffect)(() => {
21879
+ (0, import_react61.useEffect)(() => {
22046
21880
  const { filterOperatorMenuVisibleForColumnId } = getState();
22047
21881
  if (filterOperatorMenuVisibleForColumnId) {
22048
21882
  let handleMouseDown2 = function(event) {
@@ -22069,10 +21903,10 @@ function useColumnFilterOperatorMenu() {
22069
21903
  }
22070
21904
 
22071
21905
  // src/components/InfiniteTable/hooks/useContextMenu.ts
22072
- var import_react65 = require("react");
21906
+ var import_react62 = require("react");
22073
21907
 
22074
21908
  // src/components/InfiniteTable/utils/getCellContextMenu.tsx
22075
- var React66 = __toESM(require("react"));
21909
+ var React65 = __toESM(require("react"));
22076
21910
  function getCellContextMenu(cellLocation, context, onHideIntent) {
22077
21911
  var _a;
22078
21912
  const { columnId, rowIndex, event } = cellLocation;
@@ -22112,7 +21946,7 @@ function getCellContextMenu(cellLocation, context, onHideIntent) {
22112
21946
  }
22113
21947
  return {
22114
21948
  preventDefault: true,
22115
- menu: /* @__PURE__ */ React66.createElement(
21949
+ menu: /* @__PURE__ */ React65.createElement(
22116
21950
  MenuCmp,
22117
21951
  {
22118
21952
  columns: menuColumns,
@@ -22167,7 +22001,7 @@ function getTableContextMenu(menuLocation, context, onHideIntent) {
22167
22001
  }
22168
22002
  return {
22169
22003
  preventDefault: true,
22170
- menu: /* @__PURE__ */ React66.createElement(
22004
+ menu: /* @__PURE__ */ React65.createElement(
22171
22005
  MenuCmp,
22172
22006
  {
22173
22007
  columns: menuColumns,
@@ -22214,7 +22048,7 @@ function useCellContextMenu() {
22214
22048
  } = useOverlay({
22215
22049
  portalContainer: masterContext ? masterContext.getMasterState().portalDOMRef.current : false
22216
22050
  });
22217
- (0, import_react65.useEffect)(() => {
22051
+ (0, import_react62.useEffect)(() => {
22218
22052
  const { actions: actions2, getState: getState2, getDataSourceState } = context;
22219
22053
  const state = getState2();
22220
22054
  return state.cellContextMenu.onChange((info) => {
@@ -22264,7 +22098,7 @@ function useCellContextMenu() {
22264
22098
  }
22265
22099
  });
22266
22100
  }, []);
22267
- (0, import_react65.useEffect)(() => {
22101
+ (0, import_react62.useEffect)(() => {
22268
22102
  const { cellContextMenuVisibleFor } = getState();
22269
22103
  if (cellContextMenuVisibleFor) {
22270
22104
  let handleMouseDown2 = function(event) {
@@ -22300,7 +22134,7 @@ function useTableContextMenu() {
22300
22134
  } = useOverlay({
22301
22135
  portalContainer: masterContext ? masterContext.getMasterState().portalDOMRef.current : false
22302
22136
  });
22303
- (0, import_react65.useEffect)(() => {
22137
+ (0, import_react62.useEffect)(() => {
22304
22138
  const { actions: actions2, getState: getState2 } = context;
22305
22139
  const state = getState2();
22306
22140
  return state.contextMenu.onChange((info) => {
@@ -22345,7 +22179,7 @@ function useTableContextMenu() {
22345
22179
  }
22346
22180
  });
22347
22181
  }, []);
22348
- (0, import_react65.useEffect)(() => {
22182
+ (0, import_react62.useEffect)(() => {
22349
22183
  const { contextMenuVisibleFor } = getState();
22350
22184
  if (contextMenuVisibleFor) {
22351
22185
  let handleMouseDown2 = function(event) {
@@ -22371,6 +22205,83 @@ function useTableContextMenu() {
22371
22205
  return { menuPortal };
22372
22206
  }
22373
22207
 
22208
+ // src/components/InfiniteTable/components/HScrollSyncContent.tsx
22209
+ var import_react64 = require("react");
22210
+ var React66 = __toESM(require("react"));
22211
+
22212
+ // src/components/InfiniteTable/hooks/useGridScroll.ts
22213
+ var import_react63 = require("react");
22214
+ function useGridScroll(onScroll, deps) {
22215
+ const {
22216
+ state: { brain }
22217
+ } = useInfiniteTable();
22218
+ const memoizedOnScroll = (0, import_react63.useCallback)(onScroll, deps);
22219
+ (0, import_react63.useEffect)(() => {
22220
+ const removeOnScroll = brain.onScroll(memoizedOnScroll);
22221
+ return removeOnScroll;
22222
+ }, [brain, memoizedOnScroll]);
22223
+ }
22224
+
22225
+ // src/components/InfiniteTable/components/HScrollSyncContent.css.ts
22226
+ var HScrollSyncContentCls = "HScrollSyncContent_HScrollSyncContentCls__yzx0vj0";
22227
+
22228
+ // src/components/InfiniteTable/components/HScrollSyncContent.tsx
22229
+ function HScrollSyncContent(props) {
22230
+ const _a = props, { width, maxWidth, minWidth, scrollable } = _a, domProps = __objRest(_a, ["width", "maxWidth", "minWidth", "scrollable"]);
22231
+ const domRef = (0, import_react64.useRef)(null);
22232
+ useGridScroll(
22233
+ (scrollPos) => {
22234
+ if (domRef.current && scrollable !== false) {
22235
+ domRef.current.style.transform = `translate3d(${-scrollPos.scrollLeft}px, 0px, 0px)`;
22236
+ }
22237
+ },
22238
+ [scrollable]
22239
+ );
22240
+ const style2 = __spreadValues({}, domProps.style);
22241
+ if (width === "column") {
22242
+ style2.width = ThemeVars.runtime.totalVisibleColumnsWidth;
22243
+ } else if (width === "viewport") {
22244
+ style2.width = ThemeVars.runtime.bodyWidth;
22245
+ }
22246
+ if (minWidth === "column") {
22247
+ style2.minWidth = ThemeVars.runtime.totalVisibleColumnsWidth;
22248
+ } else if (minWidth === "viewport") {
22249
+ style2.minWidth = ThemeVars.runtime.bodyWidth;
22250
+ }
22251
+ if (maxWidth === "column") {
22252
+ style2.maxWidth = ThemeVars.runtime.totalVisibleColumnsWidth;
22253
+ } else if (maxWidth === "viewport") {
22254
+ style2.maxWidth = ThemeVars.runtime.bodyWidth;
22255
+ }
22256
+ return /* @__PURE__ */ React66.createElement(
22257
+ "div",
22258
+ __spreadProps(__spreadValues({
22259
+ ref: domRef
22260
+ }, domProps), {
22261
+ className: domProps.className ? join(domProps.className, HScrollSyncContentCls) : HScrollSyncContentCls,
22262
+ style: style2
22263
+ }),
22264
+ domProps.children
22265
+ );
22266
+ }
22267
+
22268
+ // src/components/InfiniteTable/hooks/useVisibleColumnSizes.ts
22269
+ var columnWidthAtIndex6 = stripVar(InternalVars.columnWidthAtIndex);
22270
+ var columnOffsetAtIndex5 = stripVar(InternalVars.columnOffsetAtIndex);
22271
+ function useVisibleColumnSizes() {
22272
+ const context = useInfiniteTable();
22273
+ return context.computed.computedVisibleColumns.map((column) => {
22274
+ return {
22275
+ id: column.id,
22276
+ width: column.computedWidth,
22277
+ cssVarForWidth: `var(${columnWidthAtIndex6}-${column.computedVisibleIndex})`,
22278
+ offset: column.computedOffset,
22279
+ cssVarForOffset: `var(${columnOffsetAtIndex5}-${column.computedVisibleIndex})`,
22280
+ pinned: column.computedPinned
22281
+ };
22282
+ });
22283
+ }
22284
+
22374
22285
  // src/components/InfiniteTable/index.tsx
22375
22286
  var InfiniteTableClassName = internalProps.rootClassName;
22376
22287
  var HOVERED_CLASS_NAMES = [RowHoverCls, "InfiniteColumnCell--hovered"];
@@ -22388,44 +22299,154 @@ var InfiniteTableRoot = getComponentStateRoot({
22388
22299
  rowHeight: true,
22389
22300
  columnHeaderHeight: true
22390
22301
  },
22302
+ //@ts-ignore
22303
+ mappedCallbacks: getMappedCallbacks2(),
22391
22304
  // @ts-ignore
22392
22305
  getParentState: () => useDataSource(),
22393
22306
  debugName: "InfiniteTable"
22394
22307
  });
22308
+ function InfiniteTableHeader2() {
22309
+ const context = useInfiniteTable();
22310
+ const { state: componentState, getComputed } = context;
22311
+ const { header, brain, headerBrain } = componentState;
22312
+ const { scrollbars } = getComputed();
22313
+ return header ? /* @__PURE__ */ React67.createElement(
22314
+ TableHeaderWrapper,
22315
+ {
22316
+ bodyBrain: brain,
22317
+ headerBrain,
22318
+ scrollbars
22319
+ }
22320
+ ) : null;
22321
+ }
22322
+ var InfiniteTableBodyCls = join(
22323
+ `${rootClassName2}Body`,
22324
+ position.relative,
22325
+ flex["1"],
22326
+ transformTranslateZero
22327
+ );
22328
+ function InfiniteTableBodyContainer(props) {
22329
+ return /* @__PURE__ */ React67.createElement(
22330
+ "div",
22331
+ __spreadProps(__spreadValues({}, props), {
22332
+ className: props.className ? join(InfiniteTableBodyCls, props.className) : InfiniteTableBodyCls
22333
+ })
22334
+ );
22335
+ }
22336
+ function InfiniteTableBody() {
22337
+ var _a;
22338
+ const context = useInfiniteTable();
22339
+ const masterContext = useMasterDetailContext();
22340
+ const { state: componentState, getComputed, api } = context;
22341
+ const {
22342
+ renderer,
22343
+ onRenderUpdater,
22344
+ debugId,
22345
+ keyboardNavigation,
22346
+ activeRowIndex,
22347
+ loadingText,
22348
+ scrollStopDelay,
22349
+ brain,
22350
+ scrollerDOMRef,
22351
+ components: components2,
22352
+ bodySize,
22353
+ activeCellIndex,
22354
+ rowDetailRenderer
22355
+ } = componentState;
22356
+ const LoadMaskCmp = (_a = components2 == null ? void 0 : components2.LoadMask) != null ? _a : LoadMask;
22357
+ const computed = getComputed();
22358
+ const { computedRowHeight, computedRowSizeCacheForDetails } = computed;
22359
+ const activeCellRowHeight = (computedRowSizeCacheForDetails == null ? void 0 : computedRowSizeCacheForDetails.getRowHeight) || computedRowHeight;
22360
+ const {
22361
+ componentState: { loading }
22362
+ } = useDataSourceContextValue();
22363
+ const onContextMenu = React67.useCallback((event) => {
22364
+ const state = context.getState();
22365
+ const target = event.target;
22366
+ if (!masterContext && event._from_row_detail) {
22367
+ return;
22368
+ }
22369
+ if (masterContext) {
22370
+ event._from_row_detail = true;
22371
+ }
22372
+ const cell = selectParentUntil(
22373
+ target,
22374
+ getCellSelector(),
22375
+ state.domRef.current
22376
+ );
22377
+ let columnId;
22378
+ let colIndex;
22379
+ let rowId;
22380
+ let rowIndex;
22381
+ if (cell) {
22382
+ colIndex = Number(cell.dataset.colIndex);
22383
+ rowIndex = Number(cell.dataset.rowIndex);
22384
+ columnId = context.getComputed().computedVisibleColumns[colIndex].id;
22385
+ rowId = context.dataSourceApi.getRowInfoArray()[rowIndex].id;
22386
+ }
22387
+ const param = {
22388
+ columnId,
22389
+ colIndex,
22390
+ rowId,
22391
+ rowIndex,
22392
+ event,
22393
+ target: cell != null ? cell : event.target
22394
+ };
22395
+ if (cell) {
22396
+ state.cellContextMenu(param);
22397
+ }
22398
+ state.contextMenu(param);
22399
+ }, []);
22400
+ const { renderCell, renderDetailRow } = useCellRendering({
22401
+ imperativeApi: api,
22402
+ getComputed,
22403
+ domRef: componentState.domRef,
22404
+ bodySize,
22405
+ computed
22406
+ });
22407
+ return /* @__PURE__ */ React67.createElement(InfiniteTableBodyContainer, { onContextMenu }, /* @__PURE__ */ React67.createElement(
22408
+ HeadlessTable,
22409
+ {
22410
+ debugId,
22411
+ tabIndex: 0,
22412
+ activeRowIndex: componentState.ready && keyboardNavigation === "row" ? activeRowIndex : null,
22413
+ activeCellIndex: componentState.ready && keyboardNavigation === "cell" && // we want to hide the active cell indicator while column reodering is happening
22414
+ !componentState.columnReorderDragColumnId ? activeCellIndex : null,
22415
+ scrollStopDelay,
22416
+ renderer,
22417
+ onRenderUpdater,
22418
+ brain,
22419
+ activeCellRowHeight,
22420
+ renderCell,
22421
+ renderDetailRow: rowDetailRenderer ? renderDetailRow : void 0,
22422
+ cellHoverClassNames: HOVERED_CLASS_NAMES,
22423
+ scrollerDOMRef
22424
+ }
22425
+ ), /* @__PURE__ */ React67.createElement(LoadMaskCmp, { visible: loading }, loadingText));
22426
+ }
22395
22427
  var InfiniteTableComponent = React67.memo(
22396
22428
  function InfiniteTableComponent2() {
22397
- var _a;
22398
22429
  const context = useInfiniteTable();
22399
22430
  const masterContext = useMasterDetailContext();
22400
- const { state: componentState, getComputed, computed, api } = context;
22431
+ const { state: componentState, api, children: initialChildren } = context;
22401
22432
  const {
22402
- componentState: { loading, dataArray },
22433
+ componentState: { dataArray },
22403
22434
  getState: getDataSourceState,
22404
22435
  componentActions: dataSourceActions
22405
22436
  } = useDataSourceContextValue();
22406
22437
  const {
22407
22438
  domRef,
22408
- scrollerDOMRef,
22409
22439
  portalDOMRef,
22410
- loadingText,
22411
- rowDetailRenderer,
22412
- header,
22413
22440
  onRowHeightCSSVarChange,
22414
22441
  onRowDetailHeightCSSVarChange,
22415
22442
  onColumnHeaderHeightCSSVarChange,
22416
22443
  rowHeightCSSVar,
22417
22444
  rowDetailHeightCSSVar,
22418
22445
  columnHeaderHeightCSSVar,
22419
- components: components2,
22420
22446
  scrollStopDelay,
22421
22447
  brain,
22422
- headerBrain,
22423
- renderer,
22424
- keyboardNavigation,
22425
22448
  activeRowIndex,
22426
- activeCellIndex,
22427
- onRenderUpdater,
22428
- debugId
22449
+ activeCellIndex
22429
22450
  } = componentState;
22430
22451
  let { licenseKey } = componentState;
22431
22452
  if (!licenseKey && InfiniteTable.licenseKey) {
@@ -22434,16 +22455,6 @@ var InfiniteTableComponent = React67.memo(
22434
22455
  useScrollToActiveRow(activeRowIndex, dataArray.length, api);
22435
22456
  useScrollToActiveCell(activeCellIndex, dataArray.length, api);
22436
22457
  const { onKeyDown: onKeyDown2 } = useDOMEventHandlers();
22437
- const { bodySize } = componentState;
22438
- const { scrollbars, computedRowHeight, computedRowSizeCacheForDetails } = computed;
22439
- const activeCellRowHeight = (computedRowSizeCacheForDetails == null ? void 0 : computedRowSizeCacheForDetails.getRowHeight) || computedRowHeight;
22440
- const { renderCell, renderDetailRow } = useCellRendering({
22441
- imperativeApi: api,
22442
- getComputed,
22443
- domRef: componentState.domRef,
22444
- bodySize,
22445
- computed
22446
- });
22447
22458
  React67.useEffect(() => {
22448
22459
  const dataSourceState = getDataSourceState();
22449
22460
  const onChange = debounce(
@@ -22459,7 +22470,6 @@ var InfiniteTableComponent = React67.memo(
22459
22470
  }, [brain, scrollStopDelay]);
22460
22471
  const licenseValid = useLicense(licenseKey);
22461
22472
  const domProps = useDOMProps(componentState.domProps);
22462
- const LoadMaskCmp = (_a = components2 == null ? void 0 : components2.LoadMask) != null ? _a : LoadMask;
22463
22473
  React67.useEffect(() => {
22464
22474
  brain.setScrollStopDelay(scrollStopDelay);
22465
22475
  dataSourceActions.scrollStopDelayUpdatedByTable = scrollStopDelay;
@@ -22483,74 +22493,13 @@ var InfiniteTableComponent = React67.memo(
22483
22493
  globalThis.infiniteApi = context.api;
22484
22494
  }
22485
22495
  }, [componentState.ready]);
22486
- const onContextMenu = React67.useCallback((event) => {
22487
- const state = context.getState();
22488
- const target = event.target;
22489
- if (!masterContext && event._from_row_detail) {
22490
- return;
22491
- }
22492
- if (masterContext) {
22493
- event._from_row_detail = true;
22494
- }
22495
- const cell = selectParentUntil(
22496
- target,
22497
- getCellSelector(),
22498
- state.domRef.current
22499
- );
22500
- let columnId;
22501
- let colIndex;
22502
- let rowId;
22503
- let rowIndex;
22504
- if (cell) {
22505
- colIndex = Number(cell.dataset.colIndex);
22506
- rowIndex = Number(cell.dataset.rowIndex);
22507
- columnId = context.getComputed().computedVisibleColumns[colIndex].id;
22508
- rowId = context.dataSourceApi.getRowInfoArray()[rowIndex].id;
22509
- }
22510
- const param = {
22511
- columnId,
22512
- colIndex,
22513
- rowId,
22514
- rowIndex,
22515
- event,
22516
- target: cell != null ? cell : event.target
22517
- };
22518
- if (cell) {
22519
- state.cellContextMenu(param);
22520
- }
22521
- state.contextMenu(param);
22522
- }, []);
22523
22496
  React67.useEffect(() => {
22524
22497
  if (masterContext) {
22525
22498
  portalDOMRef.current = masterContext.getMasterState().portalDOMRef.current;
22526
22499
  }
22527
22500
  }, []);
22528
- return /* @__PURE__ */ React67.createElement("div", __spreadValues({ onKeyDown: onKeyDown2, ref: domRef }, domProps), header ? /* @__PURE__ */ React67.createElement(
22529
- TableHeaderWrapper,
22530
- {
22531
- bodyBrain: brain,
22532
- headerBrain,
22533
- scrollbars
22534
- }
22535
- ) : null, /* @__PURE__ */ React67.createElement(InfiniteTableBody, { onContextMenu }, /* @__PURE__ */ React67.createElement(
22536
- HeadlessTable,
22537
- {
22538
- debugId,
22539
- tabIndex: 0,
22540
- activeRowIndex: componentState.ready && keyboardNavigation === "row" ? activeRowIndex : null,
22541
- activeCellIndex: componentState.ready && keyboardNavigation === "cell" && // we want to hide the active cell indicator while column reodering is happening
22542
- !componentState.columnReorderDragColumnId ? activeCellIndex : null,
22543
- scrollStopDelay,
22544
- renderer,
22545
- onRenderUpdater,
22546
- brain,
22547
- activeCellRowHeight,
22548
- renderCell,
22549
- renderDetailRow: rowDetailRenderer ? renderDetailRow : void 0,
22550
- cellHoverClassNames: HOVERED_CLASS_NAMES,
22551
- scrollerDOMRef
22552
- }
22553
- ), /* @__PURE__ */ React67.createElement(LoadMaskCmp, { visible: loading }, loadingText)), /* @__PURE__ */ React67.createElement(
22501
+ const children = initialChildren != null ? initialChildren : /* @__PURE__ */ React67.createElement(React67.Fragment, null, /* @__PURE__ */ React67.createElement(InfiniteTableHeader2, null), /* @__PURE__ */ React67.createElement(InfiniteTableBody, null));
22502
+ return /* @__PURE__ */ React67.createElement("div", __spreadValues({ onKeyDown: onKeyDown2, ref: domRef }, domProps), children, /* @__PURE__ */ React67.createElement(
22554
22503
  "div",
22555
22504
  {
22556
22505
  ref: portalDOMRef,
@@ -22584,10 +22533,12 @@ var InfiniteTableComponent = React67.memo(
22584
22533
  varName: columnHeaderHeightCSSVar,
22585
22534
  onChange: onColumnHeaderHeightCSSVarChange
22586
22535
  }
22587
- ) : null, /* @__PURE__ */ React67.createElement(InfiniteTableFooter, null), licenseValid ? null : /* @__PURE__ */ React67.createElement(InfiniteTableLicenseFooter, null), /* @__PURE__ */ React67.createElement(FocusDetect, null));
22536
+ ) : null, licenseValid ? null : /* @__PURE__ */ React67.createElement(InfiniteTableLicenseFooter, null), /* @__PURE__ */ React67.createElement(FocusDetect, null));
22588
22537
  }
22589
22538
  );
22590
- function InfiniteTableContextProvider() {
22539
+ function InfiniteTableContextProvider({
22540
+ children
22541
+ }) {
22591
22542
  const { componentActions, componentState } = useComponentState();
22592
22543
  const { scrollerDOMRef, scrollTopKey } = componentState;
22593
22544
  const computed = useComputed();
@@ -22627,7 +22578,8 @@ function InfiniteTableContextProvider() {
22627
22578
  getComputed,
22628
22579
  getState,
22629
22580
  api: imperativeApi,
22630
- dataSourceApi
22581
+ dataSourceApi,
22582
+ children
22631
22583
  };
22632
22584
  useResizeObserver(
22633
22585
  scrollerDOMRef,
@@ -22660,7 +22612,7 @@ var InfiniteTable = function(props) {
22660
22612
  rowHeight: DEFAULT_ROW_HEIGHT,
22661
22613
  columnHeaderHeight: DEFAULT_COLUMN_HEADER_HEIGHT
22662
22614
  }, props),
22663
- /* @__PURE__ */ React67.createElement(InfiniteTableContextProvider, null)
22615
+ /* @__PURE__ */ React67.createElement(InfiniteTableContextProvider, { children: props.children })
22664
22616
  )
22665
22617
  );
22666
22618
  if (false) {
@@ -22668,6 +22620,10 @@ var InfiniteTable = function(props) {
22668
22620
  }
22669
22621
  return table;
22670
22622
  };
22623
+ InfiniteTable.Header = InfiniteTableHeader2;
22624
+ InfiniteTable.Body = InfiniteTableBody;
22625
+ InfiniteTable.HScrollSyncContent = HScrollSyncContent;
22626
+ InfiniteTable.Footer = () => /* @__PURE__ */ React67.createElement(InfiniteTableFooter, null);
22671
22627
 
22672
22628
  // src/components/InfiniteTable/eventHandlers/keyboardShortcuts.ts
22673
22629
  var instantEdit = {
@@ -22713,6 +22669,49 @@ var keyboardShortcuts = {
22713
22669
  instantEdit
22714
22670
  };
22715
22671
 
22672
+ // src/components/hooks/useInterceptedMap.ts
22673
+ var import_react65 = require("react");
22674
+ function interceptMap(map2, fns) {
22675
+ const { set, delete: deleteKey, clear } = map2;
22676
+ if (fns.set) {
22677
+ map2.set = (key, value) => {
22678
+ set.call(map2, key, value);
22679
+ fns.set(key, value);
22680
+ return map2;
22681
+ };
22682
+ }
22683
+ if (fns.delete) {
22684
+ map2.delete = (key) => {
22685
+ const removed = deleteKey.call(map2, key);
22686
+ fns.delete(key);
22687
+ return removed;
22688
+ };
22689
+ }
22690
+ if (fns.clear || fns.beforeClear) {
22691
+ map2.clear = () => {
22692
+ if (fns.beforeClear) {
22693
+ fns.beforeClear(map2);
22694
+ }
22695
+ const result = clear.call(map2);
22696
+ if (fns.clear) {
22697
+ fns.clear();
22698
+ }
22699
+ return result;
22700
+ };
22701
+ }
22702
+ return () => {
22703
+ if (set) {
22704
+ map2.set = set;
22705
+ }
22706
+ if (deleteKey) {
22707
+ map2.delete = deleteKey;
22708
+ }
22709
+ if (clear) {
22710
+ map2.clear = clear;
22711
+ }
22712
+ };
22713
+ }
22714
+
22716
22715
  // src/utils/FixedSizeSet.ts
22717
22716
  var _FixedSizeSet = class {
22718
22717
  constructor(clone, size) {
@@ -22872,6 +22871,7 @@ var components = {
22872
22871
  useDataSource,
22873
22872
  useEffectWithChanges,
22874
22873
  useEffectWithObject,
22874
+ useGridScroll,
22875
22875
  useInfiniteColumnCell,
22876
22876
  useInfiniteColumnEditor,
22877
22877
  useInfiniteColumnFilterEditor,
@@ -22879,6 +22879,7 @@ var components = {
22879
22879
  useMasterRowInfo,
22880
22880
  useOverlay,
22881
22881
  useOverlayPortal,
22882
- useRowInfoReducers
22882
+ useRowInfoReducers,
22883
+ useVisibleColumnSizes
22883
22884
  });
22884
22885
  //!collapsed || lazyLoad;