@infinite-table/infinite-react 4.3.4 → 4.3.6

package/index.css

@@ -1043,7 +1043,7 @@
   user-select: none;
 }
 
-/* vanilla-extract-css-ns:src/components/InfiniteTable/components/cell.css.ts.vanilla.css?source=#H4sIAAAAAAAAA82XzW7bMBCE73kKIacYKAPZSdNCPRU+5ZoAvQoUuZLZ0FyVpGwnRd+9ICVLsv4spy3Qm20N5xsuyRV9y0DKmKEstuqrFJlag5TP9lVCzEBZ0HG8BDiwFQ2Dn1dB8L0wVqSvhKGyoGwUlKovV7+ubsetjKXa1k7LYadUwoF45Rk3ULz2Wp33CspvqcR9FGjcEw070AYairNeS/ONakGVNbHZiNQKldWUO0+xmiojrEAVBRJSG9yF4daM23BNs6xtc9+zUaj6OWr9R6/PKedCZVGwo/qGEKFSoYQF4oaQ6uHCTTNBzUETF21Y3BK0B2iRbaZHeMXCB32snrucxzox9KFfoUhWOxVUk/FL153SQ68E/nOKetsL4A2IhjIDpCkwS3ihqRu4aMr2DBKY+229AfaS4KEN/OSBW6ozoYhQUijoTdUcDQirHMjJgBarmVVNfVRcMGpRPwETOdTkz1GUQIoafIJ6a15fu9LneJw/TQzKwoL7VSgDNgpC97lcRkYluwnzQ0Cm1mcvuN0s/JpWi3nxuByFO8gEdqCsOe7MIEgoe8k0FoqPlA14ZVkLCYeUFvJkj3nSOYeW9ENXSpkVu4H0Y0J30Cd1A3VYtBMb12vmJfbSOYm9sE2Z5d9z/u/K9g+qNCNgVc15dIYS+5UcoE8KW/QxnXshlg8X5Y66oHX4wxunVJqmjdCTNtJuyMdDFV7EcH2lg2BDCKd7H8Fi3gHAEMBi/j7/BK3FbQeRDSFK5SSl07Q3VbOW2D+bfpeUKzvhRN1l5eSOoibuKKD4hNcOtBWMSn8B6tyicu/qaURY2JrhG9QZz3bOHyOO0xnfINE0dq+N2uitXIPxN4c/RvXjqWqW7siblMtwjjtyPpOgcf9cNYzY6qLZCsvlHFDdbObRUqGN7XDuu6fCHz1NuSjM9LXMS9ovrWrDX2wwmlfSXtyHbtyyGf1J3ssdpgv8hPtOe1jyTupJjMV8isFwm7uFjsPGX/bac4+QC6VO30qzIKsGoroN+m8x7htGfuZ/3m+6Y/cRMg4AAA== */
+/* vanilla-extract-css-ns:src/components/InfiniteTable/components/cell.css.ts.vanilla.css?source=#H4sIAAAAAAAAA81Xy27bMBC85yuEnmKgDGQnTQv3VOSUawL0KlDkSmZDkSq58iNF/70gJUuyXpbTFOhNloYzw13ucn3DQMqIaVlk6psUqXoAKZ/xICFioBBMFC0B9mxFw+DXVRD8KCyK5ECYVggK10GJ+nr1++pmnMoiNVgzLYeZEgl74pFn2EDxmmt1nisofyVS79aB0TtiYAvGQqPiqB+k/U6NoAptZDciQaHSWuXWq6ChygoUWq0DCQkGt2GY2XEabmiatmnuejRKq76PGv/J43PKuVDpOthSc02IUIlQAoG4JaT6uHDbjLXhYIizNgxuAdoLjEg30ys8YuGNPlbfnc9jnJj2pg9QxKutCqrN+NR1t3TfC4F/TrTJegY8ATFQeoAkAYaEF4a6hYsmbM8ggbl3DxtgL7HetwU/e8GMmlQoIpQUCnpbtUcCwioGcrKgpdXsqlZ9VFwwito8ARM51Mpf1usYEm3AO6iP5ocPLvS5Pu6fxlbLAsG9FcoCroPQPZdpZFSy6zDfB2QqPzvBcbPwOa2SefG6XAtXyAS2oNAeT2YQxJS9pEYXio+EDXhFWQMJh4QW8uSMeaVzDC3oxy6UMhTbAfdjQFfok7iBOCzajq3rNfMce+gcxx7YVpnF32P+78L2D6I0w2AVzXnqTEvdj+SA+iSwpT6Gcxdi+XFRnqgLWocv3iih0jZthJ60kXZDPhZVeJGG6ysdCTYk4XBvU0CddwRgSAB1/jb+WCPqrCORDkmUyEmVTtPeVM1a6n5t+lNSZnaCibph5WRGURMzCig+wbUFg4JR6QegzhSVe1avRgRCZocnqDOcbZ8/RxinPb5CbGgnGYcyCeNXh6+j+vNUOEt6dyvV7K/vza55E4RlOIddcz5Twejdc9WPIjRFE6Plco5Q3cvmqSXCWOzo3HWLzle2oVwUdnrq85D2nVjV08UEo34l7dm979ote93f+L2cYTrAT3rXOfBL3nE9KYM6n9JgOstdoqOw4Ze97t9TyIVSp5feLJFVI6K6/f+9NO4ajfzM38g/4zQQypEOAAA= */
 .cell_columnAlignCellStyle_center__1eexc2a0 {
   justify-content: center;
 }
@@ -1107,6 +1107,9 @@
 .cell_ColumnCellRecipe_verticalAlign_end__1eexc2aq {
   align-items: flex-end;
 }
+.cell_ColumnCellRecipe_zebra_false__1eexc2ay {
+  background: var(--infinite-row-background);
+}
 .cell_ColumnCellRecipe_zebra_even__1eexc2az {
   background: var(--infinite-row-background);
 }

package/index.d.ts

@@ -1400,6 +1400,7 @@ interface InfiniteTableMappedState<T> {
     onCellClick: InfiniteTableProps<T>['onCellClick'];
     rowDetailCache: RowDetailCache<RowDetailCacheKey, RowDetailCacheEntry>;
     headerOptions: NonUndefined<InfiniteTableProps<T>['headerOptions']>;
+    draggableColumnsRestrictTo: NonUndefined<InfiniteTableProps<T>['draggableColumnsRestrictTo']>;
     onScrollbarsChange: InfiniteTableProps<T>['onScrollbarsChange'];
     getContextMenuItems: InfiniteTableProps<T>['getContextMenuItems'];
     getCellContextMenuItems: InfiniteTableProps<T>['getCellContextMenuItems'];
@@ -1474,6 +1475,7 @@ interface InfiniteTableMappedState<T> {
     columnHeaderHeight: number;
     licenseKey: NonUndefined<InfiniteTableProps<T>['licenseKey']>;
     columnVisibility: InfiniteTablePropColumnVisibility;
+    columnGroupVisibility: NonUndefined<InfiniteTableProps<T>['columnGroupVisibility']>;
     columnSizing: InfiniteTablePropColumnSizing;
     columnTypes: InfiniteTablePropColumnTypes<T>;
     columnGroups: InfiniteTablePropColumnGroups;
@@ -4749,6 +4751,7 @@ declare type LoadMaskProps = {
 declare type InfiniteTablePropColumnOrderNormalized = string[];
 declare type InfiniteTablePropColumnOrder = InfiniteTablePropColumnOrderNormalized | true;
 declare type InfiniteTablePropColumnVisibility = Record<string, false>;
+declare type InfiniteTablePropColumnGroupVisibility = Record<string, boolean>;
 declare type InfiniteTableColumnPinnedValues = false | 'start' | 'end';
 declare type InfiniteTablePropColumnPinning = Record<string, true | 'start' | 'end'>;
 declare type InfiniteTableRowStylingFnParams<T> = {
@@ -5091,6 +5094,7 @@ interface InfiniteTableProps<T> {
     groupRenderStrategy?: InfiniteTablePropGroupRenderStrategy;
     hideEmptyGroupColumns?: boolean;
     columnVisibility?: InfiniteTablePropColumnVisibility;
+    columnGroupVisibility?: InfiniteTablePropColumnGroupVisibility;
     defaultColumnVisibility?: InfiniteTablePropColumnVisibility;
     pinnedStartMaxWidth?: number;
     pinnedEndMaxWidth?: number;
@@ -5169,6 +5173,7 @@ interface InfiniteTableProps<T> {
     activeCellIndex?: [number, number] | null;
     defaultActiveCellIndex?: [number, number] | null;
     draggableColumns?: boolean;
+    draggableColumnsRestrictTo?: false | 'group';
     header?: boolean;
     headerOptions?: InfiniteTablePropHeaderOptions;
     focusedClassName?: string;
@@ -5402,4 +5407,4 @@ declare const components: {
     NumberFilterEditor: typeof NumberFilterEditor;
 };
 
-export { AdvancedAlignable, CellSelectionState, CellSelectionStateObject, ColumnTypeWithInherit, DataClient, DataSource, DataSourceAction, DataSourceActionType, DataSourceAggregationReducer, DataSourceApi, DataSourceCRUDParam, DataSourceComponentActions, DataSourceContextValue, DataSourceData, DataSourceDataParams, DataSourceDataParamsChanges, DataSourceDerivedState, DataSourceFilterFunctionParam, DataSourceFilterOperator, DataSourceFilterOperatorFunction, DataSourceFilterOperatorFunctionParam, DataSourceFilterType, DataSourceFilterValueItem, DataSourceFilterValueItemValueGetter, DataSourceGroupBy, DataSourceGroupRowsList, DataSourceInsertParam, DataSourceLivePaginationCursorFn, DataSourceLivePaginationCursorParams, DataSourceLivePaginationCursorValue, DataSourceMappedState, DataSourceMappings, DataSourceMasterDetailContextValue, DataSourcePivotBy, DataSourcePropAggregationReducers, DataSourcePropCellSelection, DataSourcePropCellSelection_MultiCell, DataSourcePropCellSelection_SingleCell, DataSourcePropFilterFunction, DataSourcePropFilterTypes, DataSourcePropFilterValue, DataSourcePropGroupBy, DataSourcePropGroupRowsStateObject, DataSourcePropIsRowSelected, DataSourcePropLivePaginationCursor, DataSourcePropMultiRowSelectionChangeParamType, DataSourcePropOnCellSelectionChange, DataSourcePropOnCellSelectionChange_MultiCell, DataSourcePropOnCellSelectionChange_SingleCell, DataSourcePropOnRowSelectionChange, DataSourcePropOnRowSelectionChange_MultiRow, DataSourcePropOnRowSelectionChange_SingleRow, DataSourcePropPivotBy, DataSourcePropRowInfoReducers, DataSourcePropRowSelection, DataSourcePropRowSelection_MultiRow, DataSourcePropRowSelection_SingleRow, DataSourcePropSelectionMode, DataSourcePropShouldReloadData, DataSourcePropShouldReloadDataObject, DataSourcePropSortFn, DataSourcePropSortInfo, DataSourcePropSortTypes, DataSourceProps, DataSourcePropsWithChildren, DataSourceRawReducer, DataSourceRemoteData, DataSourceRowInfoReducer, DataSourceSetupState, DataSourceSingleSortInfo, DataSourceSortInfo, DataSourceState, DebugLogger, DeepMap, ElementContainerGetter, FixedSizeSet, GroupRowsState, InfiniteColumnEditorContextType, InfiniteTable, InfiniteTableAction, InfiniteTableActionType, InfiniteTableApi, InfiniteTableClassName, InfiniteTableColumn, InfiniteTableColumnAggregator, InfiniteTableColumnApi, InfiniteTableColumnCellContextType, InfiniteTableColumnComparer, InfiniteTableColumnGroup, InfiniteTableColumnRenderFunctionForGroupRows, InfiniteTableColumnRenderFunctionForNormalRows, InfiniteTableColumnRenderValueParam, InfiniteTableColumnRowspanParam, InfiniteTableColumnSizingOptions, InfiniteTableColumnValueFormatterParams, InfiniteTableColumnValueGetterParams, InfiniteTableComponent, InfiniteTableComputedColumn, InfiniteTableComputedValues, InfiniteTableContextValue, InfiniteTableGroupColumnBase, InfiniteTableGroupColumnFunction, InfiniteTableGroupColumnGetterOptions, InfiniteTablePivotColumn, InfiniteTablePropAutoSizeColumnsKey, InfiniteTablePropColumnGroups, InfiniteTablePropColumnOrder, InfiniteTablePropColumnPinning, InfiniteTablePropColumnSizing, InfiniteTablePropColumnTypes, InfiniteTablePropColumnVisibility, InfiniteTablePropColumns, InfiniteTablePropComponents, InfiniteTablePropGetCellContextMenuItems, InfiniteTablePropGetColumnMenuItems, InfiniteTablePropGroupColumn, InfiniteTablePropGroupRenderStrategy, InfiniteTablePropHeaderOptions, InfiniteTablePropKeyboardNavigation, InfiniteTablePropKeyboardShorcut, InfiniteTablePropMultiSortBehavior, InfiniteTablePropRowClassName, InfiniteTablePropRowStyle, InfiniteTableProps, InfiniteTableRowClassNameFn, InfiniteTableRowInfo, InfiniteTableRowStyleFn, InfiniteTableState, InfiniteTable_HasGrouping_RowInfoGroup, InfiniteTable_HasGrouping_RowInfoNormal, LazyGroupDataDeepMap, LazyGroupDataItem, LazyRowInfoGroup, Menu, MenuChildrenFnParam, MenuColumn, MenuColumnRenderParam, MenuDecoration, MenuIconProps, MenuItemActionContext, MenuItemDefinition, MenuItemObject, MenuProps, MenuRenderable, MenuRuntimeItem, MenuRuntimeItemSelectable, MenuSeparator, OverlayShowParams, RowDetailCache, RowDetailState, RowDetailStateObject, RowSelectionState, ScrollStopInfo, Scrollbars, ShowOverlayFn, TableRenderRange, WeakFixedSizeSet, components, debounce, debug, defaultFilterTypes, eventMatchesKeyboardShortcut, defaultFilterTypes as filterTypes, flatten, buildManagedComponent as getComponentStateRoot, group, interceptMap, keyboardShortcuts, multisort, queryKeyToCacheKey, useManagedComponentState as useComponentState, useDataSourceInternal, useDataSourceState, useEffectWithChanges, useEffectWithObject, useGridScroll, useInfiniteColumnCell, useInfiniteColumnEditor, useInfiniteColumnFilterEditor, useInfiniteHeaderCell, useManagedDataSource, useMasterRowInfo, useOverlay, useOverlayPortal, useRowInfoReducers, useVisibleColumnSizes };
+export { AdvancedAlignable, CellSelectionState, CellSelectionStateObject, ColumnTypeWithInherit, DataClient, DataSource, DataSourceAction, DataSourceActionType, DataSourceAggregationReducer, DataSourceApi, DataSourceCRUDParam, DataSourceComponentActions, DataSourceContextValue, DataSourceData, DataSourceDataParams, DataSourceDataParamsChanges, DataSourceDerivedState, DataSourceFilterFunctionParam, DataSourceFilterOperator, DataSourceFilterOperatorFunction, DataSourceFilterOperatorFunctionParam, DataSourceFilterType, DataSourceFilterValueItem, DataSourceFilterValueItemValueGetter, DataSourceGroupBy, DataSourceGroupRowsList, DataSourceInsertParam, DataSourceLivePaginationCursorFn, DataSourceLivePaginationCursorParams, DataSourceLivePaginationCursorValue, DataSourceMappedState, DataSourceMappings, DataSourceMasterDetailContextValue, DataSourcePivotBy, DataSourcePropAggregationReducers, DataSourcePropCellSelection, DataSourcePropCellSelection_MultiCell, DataSourcePropCellSelection_SingleCell, DataSourcePropFilterFunction, DataSourcePropFilterTypes, DataSourcePropFilterValue, DataSourcePropGroupBy, DataSourcePropGroupRowsStateObject, DataSourcePropIsRowSelected, DataSourcePropLivePaginationCursor, DataSourcePropMultiRowSelectionChangeParamType, DataSourcePropOnCellSelectionChange, DataSourcePropOnCellSelectionChange_MultiCell, DataSourcePropOnCellSelectionChange_SingleCell, DataSourcePropOnRowSelectionChange, DataSourcePropOnRowSelectionChange_MultiRow, DataSourcePropOnRowSelectionChange_SingleRow, DataSourcePropPivotBy, DataSourcePropRowInfoReducers, DataSourcePropRowSelection, DataSourcePropRowSelection_MultiRow, DataSourcePropRowSelection_SingleRow, DataSourcePropSelectionMode, DataSourcePropShouldReloadData, DataSourcePropShouldReloadDataObject, DataSourcePropSortFn, DataSourcePropSortInfo, DataSourcePropSortTypes, DataSourceProps, DataSourcePropsWithChildren, DataSourceRawReducer, DataSourceRemoteData, DataSourceRowInfoReducer, DataSourceSetupState, DataSourceSingleSortInfo, DataSourceSortInfo, DataSourceState, DebugLogger, DeepMap, ElementContainerGetter, FixedSizeSet, GroupRowsState, InfiniteColumnEditorContextType, InfiniteTable, InfiniteTableAction, InfiniteTableActionType, InfiniteTableApi, InfiniteTableClassName, InfiniteTableColumn, InfiniteTableColumnAggregator, InfiniteTableColumnApi, InfiniteTableColumnCellContextType, InfiniteTableColumnComparer, InfiniteTableColumnGroup, InfiniteTableColumnRenderFunctionForGroupRows, InfiniteTableColumnRenderFunctionForNormalRows, InfiniteTableColumnRenderValueParam, InfiniteTableColumnRowspanParam, InfiniteTableColumnSizingOptions, InfiniteTableColumnValueFormatterParams, InfiniteTableColumnValueGetterParams, InfiniteTableComponent, InfiniteTableComputedColumn, InfiniteTableComputedValues, InfiniteTableContextValue, InfiniteTableGroupColumnBase, InfiniteTableGroupColumnFunction, InfiniteTableGroupColumnGetterOptions, InfiniteTablePivotColumn, InfiniteTablePropAutoSizeColumnsKey, InfiniteTablePropColumnGroupVisibility, InfiniteTablePropColumnGroups, InfiniteTablePropColumnOrder, InfiniteTablePropColumnPinning, InfiniteTablePropColumnSizing, InfiniteTablePropColumnTypes, InfiniteTablePropColumnVisibility, InfiniteTablePropColumns, InfiniteTablePropComponents, InfiniteTablePropGetCellContextMenuItems, InfiniteTablePropGetColumnMenuItems, InfiniteTablePropGroupColumn, InfiniteTablePropGroupRenderStrategy, InfiniteTablePropHeaderOptions, InfiniteTablePropKeyboardNavigation, InfiniteTablePropKeyboardShorcut, InfiniteTablePropMultiSortBehavior, InfiniteTablePropRowClassName, InfiniteTablePropRowStyle, InfiniteTableProps, InfiniteTableRowClassNameFn, InfiniteTableRowInfo, InfiniteTableRowStyleFn, InfiniteTableState, InfiniteTable_HasGrouping_RowInfoGroup, InfiniteTable_HasGrouping_RowInfoNormal, LazyGroupDataDeepMap, LazyGroupDataItem, LazyRowInfoGroup, Menu, MenuChildrenFnParam, MenuColumn, MenuColumnRenderParam, MenuDecoration, MenuIconProps, MenuItemActionContext, MenuItemDefinition, MenuItemObject, MenuProps, MenuRenderable, MenuRuntimeItem, MenuRuntimeItemSelectable, MenuSeparator, OverlayShowParams, RowDetailCache, RowDetailState, RowDetailStateObject, RowSelectionState, ScrollStopInfo, Scrollbars, ShowOverlayFn, TableRenderRange, WeakFixedSizeSet, components, debounce, debug, defaultFilterTypes, eventMatchesKeyboardShortcut, defaultFilterTypes as filterTypes, flatten, buildManagedComponent as getComponentStateRoot, group, interceptMap, keyboardShortcuts, multisort, queryKeyToCacheKey, useManagedComponentState as useComponentState, useDataSourceInternal, useDataSourceState, useEffectWithChanges, useEffectWithObject, useGridScroll, useInfiniteColumnCell, useInfiniteColumnEditor, useInfiniteColumnFilterEditor, useInfiniteHeaderCell, useManagedDataSource, useMasterRowInfo, useOverlay, useOverlayPortal, useRowInfoReducers, useVisibleColumnSizes };

package/index.dev.js

@@ -6950,6 +6950,7 @@ function reorderColumnsOnDrag(params) {
     infiniteDOMNode,
     brain,
     dragColumnHeaderTargetRect,
+    draggableColumnsRestrictTo,
     tableRect,
     setProxyPosition,
     api: imperativeApi
@@ -6978,8 +6979,9 @@ function reorderColumnsOnDrag(params) {
     const scrollLeft2 = brain.getScrollPosition().scrollLeft;
     return col.computedOffset >= scrollLeft2 + getCurrentPinnedWidth("start") && col.computedOffset + col.computedWidth < scrollLeft2 + tableRect.width - getCurrentPinnedWidth("end");
   }
-  const getBreakPoints = (columns) => {
-    const breakpoints = [];
+  const getBreakPoints = (columns, options) => {
+    const { restrictToParentGroup, dragColumn: dragColumn2 } = options;
+    let breakpoints = [];
     columns.forEach((c) => {
       const b = {
         columnId: c.id,
@@ -6993,6 +6995,26 @@ function reorderColumnsOnDrag(params) {
         breakpoints.push(b);
       }
     });
+    if (restrictToParentGroup) {
+      let checkAllowedColumnsInDirection2 = function(colIndex, dir2, disallowedTargets2) {
+        const col = columns[colIndex];
+        if (!col) {
+          return;
+        }
+        if (col.columnGroup !== dragColumn2.columnGroup) {
+          disallowedTargets2.add(col.id);
+        }
+        checkAllowedColumnsInDirection2(colIndex + dir2, dir2, disallowedTargets2);
+      };
+      var checkAllowedColumnsInDirection = checkAllowedColumnsInDirection2;
+      const dragColIndex = dragColumn2.computedVisibleIndex;
+      const disallowedTargets = /* @__PURE__ */ new Set();
+      checkAllowedColumnsInDirection2(dragColIndex - 1, -1, disallowedTargets);
+      checkAllowedColumnsInDirection2(dragColIndex + 1, 1, disallowedTargets);
+      breakpoints = breakpoints.filter((b) => {
+        return !disallowedTargets.has(b.columnId);
+      });
+    }
     return breakpoints;
   };
   const initialPinnedStartCount = computedPinnedStartColumns.length;
@@ -7171,7 +7193,10 @@ function reorderColumnsOnDrag(params) {
           imperativeApi.scrollLeft = value;
         }
       });
-      const breakpoints = getBreakPoints(computedVisibleColumns);
+      const breakpoints = getBreakPoints(computedVisibleColumns, {
+        dragColumn,
+        restrictToParentGroup: draggableColumnsRestrictTo === "group"
+      });
       let currentPos = dir === -1 ? dragColumn.computedOffset + diffX : dragColumn.computedOffset + dragColumn.computedWidth + diffX;
       let idx = (0, import_binary_search2.default)(
         breakpoints,
@@ -7330,7 +7355,7 @@ var useColumnPointerEvents = ({
       if (((_a2 = e.target) == null ? void 0 : _a2.tagName) === "INPUT") {
         return;
       }
-      const { brain } = getState();
+      const { brain, draggableColumnsRestrictTo } = getState();
       const {
         computedVisibleColumns,
         computedVisibleColumnsMap,
@@ -7352,6 +7377,7 @@ var useColumnPointerEvents = ({
       let didDragAtLeastOnce = false;
       const dragger = reorderColumnsOnDrag({
         brain,
+        draggableColumnsRestrictTo,
         columnOffsetAtIndexCSSVar: columnOffsetAtIndex4,
         columnWidthAtIndexCSSVar: columnWidthAtIndex3,
         computedPinnedEndColumns,
@@ -9960,6 +9986,7 @@ function InfiniteTableHeaderFn(props) {
   } = props;
   const {
     computed,
+    getState,
     state: { headerBrain, headerOptions, showColumnFilters }
   } = useInfiniteTable();
   const { computedColumnsMap } = computed;
@@ -10012,7 +10039,8 @@ function InfiniteTableHeaderFn(props) {
           computedWidth: colGroupItem.computedWidth,
           groupOffset: colGroupItem.groupOffset
         });
-        return /* @__PURE__ */ React46.createElement(
+        const visible = getState().columnGroupVisibility[colGroupItem.id] !== false;
+        return visible ? /* @__PURE__ */ React46.createElement(
           InfiniteTableHeaderGroup,
           {
             bodyBrain,
@@ -10023,7 +10051,7 @@ function InfiniteTableHeaderFn(props) {
             height,
             columnGroup: computedColumnGroup
           }
-        );
+        ) : null;
       }
       return /* @__PURE__ */ React46.createElement(
         InfiniteTableHeaderCell,
@@ -14883,136 +14911,6 @@ function useDataSourceInternal(props) {
   };
 }
 
-// src/utils/FixedSizeMap.ts
-var _FixedSizeMap = class {
-  constructor(clone, size) {
-    this.keysInOrder = [];
-    if (typeof clone === "number") {
-      this.maxSize = clone;
-      this.currentMap = /* @__PURE__ */ new Map();
-    } else {
-      this.maxSize = size != null ? size : _FixedSizeMap.DEFAULT_SIZE;
-      if (clone) {
-        const arr = Array.from(clone);
-        if (this.maxSize < arr.length) {
-          arr.slice(arr.length - this.maxSize);
-        }
-        this.currentMap = /* @__PURE__ */ new Map();
-        arr.forEach(([k, v]) => {
-          this.set(k, v);
-        });
-      } else {
-        this.currentMap = /* @__PURE__ */ new Map();
-      }
-    }
-  }
-  values() {
-    return this.currentMap.values();
-  }
-  get size() {
-    return this.currentMap.size;
-  }
-  delete(key) {
-    if (this.currentMap.has(key)) {
-      this.currentMap.delete(key);
-      this.keysInOrder = this.keysInOrder.filter((k) => k !== key);
-      return true;
-    }
-    return false;
-  }
-  has(key) {
-    return this.currentMap.has(key);
-  }
-  get(key) {
-    return this.currentMap.get(key);
-  }
-  set(key, el) {
-    if (this.has(key)) {
-      this.delete(key);
-    }
-    const canAddCount = this.maxSize - this.currentMap.size;
-    if (canAddCount <= 0) {
-      const [removedKey] = this.keysInOrder.splice(0, 1);
-      if (removedKey != void 0) {
-        this.currentMap.delete(removedKey);
-      }
-    }
-    this.keysInOrder.push(key);
-    this.currentMap.set(key, el);
-    return this;
-  }
-};
-var FixedSizeMap = _FixedSizeMap;
-FixedSizeMap.DEFAULT_SIZE = 10;
-
-// src/components/DataSource/RowDetailCache.ts
-var RowDetailNoCacheStorage = class {
-  add(_key, _value) {
-    return;
-  }
-  get(_key) {
-    return void 0;
-  }
-  delete(_key) {
-    return;
-  }
-  has(_key) {
-    return false;
-  }
-};
-var RowDetailFixedSizeCacheStorage = class {
-  constructor(maxSize) {
-    this.storage = new FixedSizeMap(maxSize);
-  }
-  add(key, value) {
-    this.storage.set(key, value);
-  }
-  get(key) {
-    return this.storage.get(key);
-  }
-  delete(key) {
-    this.storage.delete(key);
-  }
-  has(key) {
-    return this.storage.has(key);
-  }
-};
-var RowDetailFullCacheStorage = class {
-  constructor() {
-    this.storage = /* @__PURE__ */ new Map();
-  }
-  add(key, value) {
-    this.storage.set(key, value);
-  }
-  get(key) {
-    return this.storage.get(key);
-  }
-  delete(key) {
-    this.storage.delete(key);
-  }
-  has(key) {
-    return this.storage.has(key);
-  }
-};
-var RowDetailCache = class {
-  // public instanceIndex: number = 0;
-  constructor(cache) {
-    this.cacheStorage = cache === false ? new RowDetailNoCacheStorage() : cache === true ? new RowDetailFullCacheStorage() : typeof cache === "number" ? new RowDetailFixedSizeCacheStorage(cache) : new RowDetailFixedSizeCacheStorage(5);
-  }
-  add(key, value) {
-    this.cacheStorage.add(key, value);
-  }
-  get(key) {
-    return this.cacheStorage.get(key);
-  }
-  delete(key) {
-    this.cacheStorage.delete(key);
-  }
-  has(key) {
-    return this.cacheStorage.has(key);
-  }
-};
-
 // src/components/DataSource/BooleanCollectionState.ts
 var BooleanCollectionState = class {
   constructor(state) {
@@ -15210,6 +15108,136 @@ var RowDetailState = class extends BooleanCollectionState {
   }
 };
 
+// src/utils/FixedSizeMap.ts
+var _FixedSizeMap = class {
+  constructor(clone, size) {
+    this.keysInOrder = [];
+    if (typeof clone === "number") {
+      this.maxSize = clone;
+      this.currentMap = /* @__PURE__ */ new Map();
+    } else {
+      this.maxSize = size != null ? size : _FixedSizeMap.DEFAULT_SIZE;
+      if (clone) {
+        const arr = Array.from(clone);
+        if (this.maxSize < arr.length) {
+          arr.slice(arr.length - this.maxSize);
+        }
+        this.currentMap = /* @__PURE__ */ new Map();
+        arr.forEach(([k, v]) => {
+          this.set(k, v);
+        });
+      } else {
+        this.currentMap = /* @__PURE__ */ new Map();
+      }
+    }
+  }
+  values() {
+    return this.currentMap.values();
+  }
+  get size() {
+    return this.currentMap.size;
+  }
+  delete(key) {
+    if (this.currentMap.has(key)) {
+      this.currentMap.delete(key);
+      this.keysInOrder = this.keysInOrder.filter((k) => k !== key);
+      return true;
+    }
+    return false;
+  }
+  has(key) {
+    return this.currentMap.has(key);
+  }
+  get(key) {
+    return this.currentMap.get(key);
+  }
+  set(key, el) {
+    if (this.has(key)) {
+      this.delete(key);
+    }
+    const canAddCount = this.maxSize - this.currentMap.size;
+    if (canAddCount <= 0) {
+      const [removedKey] = this.keysInOrder.splice(0, 1);
+      if (removedKey != void 0) {
+        this.currentMap.delete(removedKey);
+      }
+    }
+    this.keysInOrder.push(key);
+    this.currentMap.set(key, el);
+    return this;
+  }
+};
+var FixedSizeMap = _FixedSizeMap;
+FixedSizeMap.DEFAULT_SIZE = 10;
+
+// src/components/DataSource/RowDetailCache.ts
+var RowDetailNoCacheStorage = class {
+  add(_key, _value) {
+    return;
+  }
+  get(_key) {
+    return void 0;
+  }
+  delete(_key) {
+    return;
+  }
+  has(_key) {
+    return false;
+  }
+};
+var RowDetailFixedSizeCacheStorage = class {
+  constructor(maxSize) {
+    this.storage = new FixedSizeMap(maxSize);
+  }
+  add(key, value) {
+    this.storage.set(key, value);
+  }
+  get(key) {
+    return this.storage.get(key);
+  }
+  delete(key) {
+    this.storage.delete(key);
+  }
+  has(key) {
+    return this.storage.has(key);
+  }
+};
+var RowDetailFullCacheStorage = class {
+  constructor() {
+    this.storage = /* @__PURE__ */ new Map();
+  }
+  add(key, value) {
+    this.storage.set(key, value);
+  }
+  get(key) {
+    return this.storage.get(key);
+  }
+  delete(key) {
+    this.storage.delete(key);
+  }
+  has(key) {
+    return this.storage.has(key);
+  }
+};
+var RowDetailCache = class {
+  // public instanceIndex: number = 0;
+  constructor(cache) {
+    this.cacheStorage = cache === false ? new RowDetailNoCacheStorage() : cache === true ? new RowDetailFullCacheStorage() : typeof cache === "number" ? new RowDetailFixedSizeCacheStorage(cache) : new RowDetailFixedSizeCacheStorage(5);
+  }
+  add(key, value) {
+    this.cacheStorage.add(key, value);
+  }
+  get(key) {
+    return this.cacheStorage.get(key);
+  }
+  delete(key) {
+    this.cacheStorage.delete(key);
+  }
+  has(key) {
+    return this.cacheStorage.has(key);
+  }
+};
+
 // src/components/DataSource/types.ts
 var DataSourceActionType = /* @__PURE__ */ ((DataSourceActionType2) => {
   DataSourceActionType2["INIT"] = "INIT";
@@ -17333,12 +17361,18 @@ var ScrollListener = class {
 };
 
 // src/components/InfiniteTable/state/computeColumnGroupsDepths.ts
-function computeColumnGroupsDepths(columnGroups) {
+function computeColumnGroupsDepths(columnGroups, columnGroupVisibility) {
   const map2 = /* @__PURE__ */ new Map();
+  function isVisible(colGroupId) {
+    return columnGroupVisibility[colGroupId] !== false;
+  }
   Object.keys(columnGroups).forEach((colGroupId) => {
     const colGroup = columnGroups[colGroupId];
     let parentGroupId = colGroup.columnGroup;
     let depth = 0;
+    if (!isVisible(colGroupId)) {
+      depth = -1;
+    }
     while (parentGroupId) {
       const parent = columnGroups[parentGroupId];
       if (!parent) {
@@ -17347,7 +17381,9 @@ function computeColumnGroupsDepths(columnGroups) {
         }
         break;
       }
-      depth++;
+      if (isVisible(parentGroupId)) {
+        depth++;
+      }
       parentGroupId = parent.columnGroup;
     }
     map2.set(colGroupId, depth);
@@ -17364,6 +17400,7 @@ function getRowDetailRendererFromComponent(RowDetail) {
 }
 
 // src/components/InfiniteTable/state/getInitialState.ts
+var EMPTY_OBJECT = {};
 function createRenderer2(brain) {
   const renderer = new ReactHeadlessTableRenderer(brain);
   const onRenderUpdater = buildSubscriptionCallback();
@@ -17511,6 +17548,7 @@ var forwardProps4 = (_setupState) => {
     onScrollbarsChange: 1,
     autoSizeColumnsKey: 1,
     columnDefaultFlex: 1,
+    draggableColumnsRestrictTo: (draggableColumnsRestrictTo) => draggableColumnsRestrictTo != null ? draggableColumnsRestrictTo : false,
     columnMenuRealignDelay: (columnMenuRealignDelay) => columnMenuRealignDelay != null ? columnMenuRealignDelay : 50,
     scrollStopDelay: (scrollStopDelay) => scrollStopDelay != null ? scrollStopDelay : 250,
     viewportReservedWidth: (viewportReservedWidth) => viewportReservedWidth != null ? viewportReservedWidth : 0,
@@ -17549,7 +17587,8 @@ var forwardProps4 = (_setupState) => {
     rowDetailHeight: (rowDetailHeight) => typeof rowDetailHeight === "number" || typeof rowDetailHeight === "function" ? rowDetailHeight : 300,
     columnHeaderHeight: (columnHeaderHeight) => typeof columnHeaderHeight === "number" ? columnHeaderHeight : 30,
     columns: 1,
-    columnVisibility: (columnVisibility) => columnVisibility != null ? columnVisibility : {},
+    columnVisibility: (columnVisibility) => columnVisibility != null ? columnVisibility : EMPTY_OBJECT,
+    columnGroupVisibility: (columnGroupVisibility) => columnGroupVisibility != null ? columnGroupVisibility : EMPTY_OBJECT,
     // TODO check if columnPinning works when the value for a pinned col is `true` instead of `"start"`
     columnSizing: (columnSizing) => columnSizing || {},
     columnTypes: (columnTypes) => columnTypes || {},
@@ -17630,7 +17669,10 @@ var mapPropsToState = (params) => {
   var _a, _b, _c, _d, _e;
   const { props, state, oldState, parentState } = params;
   const computedColumnGroups = state.pivotColumnGroups || state.columnGroups;
-  const columnGroupsDepthsMap = state.columnGroups && state.columnGroups != (oldState == null ? void 0 : oldState.columnGroups) || state.pivotColumnGroups && state.pivotColumnGroups != (oldState == null ? void 0 : oldState.pivotColumnGroups) ? computeColumnGroupsDepths(computedColumnGroups) : state.columnGroupsDepthsMap;
+  const columnGroupsDepthsMap = state.columnGroups && state.columnGroups != (oldState == null ? void 0 : oldState.columnGroups) || state.columnGroups && state.columnGroupVisibility != (oldState == null ? void 0 : oldState.columnGroupVisibility) || state.pivotColumnGroups && state.pivotColumnGroups != (oldState == null ? void 0 : oldState.pivotColumnGroups) ? computeColumnGroupsDepths(
+    computedColumnGroups,
+    state.columnGroupVisibility
+  ) : state.columnGroupsDepthsMap;
   const groupBy = parentState == null ? void 0 : parentState.groupBy;
   const groupRenderStrategy = getGroupRenderStrategy({
     groupRenderStrategy: props.groupRenderStrategy,
@@ -17685,7 +17727,11 @@ var mapPropsToState = (params) => {
     keyboardNavigation: (_c = props.keyboardNavigation) != null ? _c : state.activeCellIndex != null ? "cell" : state.activeRowIndex != null ? "row" : "cell",
     columnHeaderCssEllipsis: (_e = (_d = props.columnHeaderCssEllipsis) != null ? _d : props.columnCssEllipsis) != null ? _e : true,
     columnGroupsDepthsMap,
-    columnGroupsMaxDepth: columnGroupsDepthsMap != state.columnGroupsDepthsMap ? Math.max(...columnGroupsDepthsMap.values(), 0) : state.columnGroupsMaxDepth,
+    columnGroupsMaxDepth: columnGroupsDepthsMap != state.columnGroupsDepthsMap ? (
+      // was 0, but after implementing columnGroupVisibility
+      // it can be -1, to denote that no column group is visible
+      Math.max(...columnGroupsDepthsMap.values(), -1)
+    ) : state.columnGroupsMaxDepth,
     computedColumnGroups,
     rowHeightCSSVar: typeof props.rowHeight === "string" ? props.rowHeight : "",
     rowDetailHeightCSSVar: typeof props.rowDetailHeight === "string" ? props.rowDetailHeight : "",
@@ -18611,7 +18657,11 @@ function useComputed() {
   const computedPinnedEndOverflow = computedPinnedEndWidth ? computedPinnedEndColumnsWidth > computedPinnedEndWidth : false;
   const [multiRowSelector] = (0, import_react49.useState)(() => {
     const multiRowSelector2 = new MultiRowSelector({
-      getIdForIndex: (index) => getDataSourceState().dataArray[index].id
+      getIdForIndex: (index) => {
+        var _a2;
+        const dataItem = getDataSourceState().dataArray[index];
+        return (_a2 = dataItem == null ? void 0 : dataItem.id) != null ? _a2 : -1;
+      }
     });
     return multiRowSelector2;
   });
@@ -18843,7 +18893,7 @@ var useLicense = (licenseKey = "") => {
     }
     let valid2 = isValidLicense(licenseKey, {
       publishedAt: 1624970570587,
-      version: "4.3.4"
+      version: "4.3.6"
     });
     if (!licenseKey && !valid2 && isInsidePlayground) {
       return true;
@@ -22560,7 +22610,8 @@ function InfiniteTableBody() {
     components: components2,
     bodySize,
     activeCellIndex,
-    rowDetailRenderer
+    rowDetailRenderer,
+    showHoverRows
   } = componentState;
   const LoadMaskCmp = (_a = components2 == null ? void 0 : components2.LoadMask) != null ? _a : LoadMask;
   const computed = getComputed();
@@ -22628,7 +22679,7 @@ function InfiniteTableBody() {
       activeCellRowHeight,
       renderCell,
       renderDetailRow: rowDetailRenderer ? renderDetailRow : void 0,
-      cellHoverClassNames: HOVERED_CLASS_NAMES,
+      cellHoverClassNames: showHoverRows ? HOVERED_CLASS_NAMES : void 0,
       scrollerDOMRef
     }
   ), /* @__PURE__ */ React68.createElement(LoadMaskCmp, { visible: loading }, loadingText));