@infinite-table/infinite-react 4.3.6 → 4.3.8

package/index.js

@@ -2980,11 +2980,16 @@ var ReactHeadlessTableRenderer = class extends Logger {
     }, zIndex2) => {
       const columnOffsetX = `${columnOffsetAtIndex2}-${colIndex}`;
       const columnOffsetXWhileReordering = `${columnOffsetAtIndexWhileReordering2}-${colIndex}`;
-      element.style.setProperty(
-        currentTransformY,
-        scrollTop2 ? `calc( ${y}px + var(${scrollTopCSSVar}) )` : `${y}px`
-      );
-      element.style.transform = `translate3d(var(${columnOffsetXWhileReordering}, var(${columnOffsetX})), var(${currentTransformY}), 0)`;
+      const currentTransformYValue = scrollTop2 ? `calc( ${y}px + var(${scrollTopCSSVar}) )` : `${y}px`;
+      if (element.__currentTransformY !== currentTransformYValue) {
+        element.__currentTransformY = currentTransformYValue;
+        element.style.setProperty(currentTransformY, currentTransformYValue);
+      }
+      const transformValue = `translate3d(var(${columnOffsetXWhileReordering}, var(${columnOffsetX})), var(${currentTransformY}), 0)`;
+      if (element.__transformValue !== transformValue) {
+        element.__transformValue = transformValue;
+        element.style.transform = transformValue;
+      }
       if (zIndex2 != null) {
       }
     };
@@ -3638,11 +3643,15 @@ var ReactHeadlessTableRenderer = class extends Logger {
           itemElement.style.willChange = "transform";
           itemElement.style.backfaceVisibility = "hidden";
           const hidden = options ? options.hidden : !!this.isCellCovered(rowIndex, colIndex);
-          itemElement.style.zIndex = hidden ? "-1" : (
+          const zIndex2 = hidden ? "-1" : (
             // #updatezindex - we need to allow elements use their own zIndex, so we
             // resort to allowing them to have it as a data-z-index attribute
             itemElement.dataset.zIndex || "auto"
           );
+          if (itemElement.__zIndex !== zIndex2) {
+            itemElement.__zIndex = zIndex2;
+            itemElement.style.zIndex = zIndex2;
+          }
         } else {
           itemElement.style.display = "";
           itemElement.style.left = `${x}px`;
@@ -4160,7 +4169,7 @@ var ActiveCellIndicatorCls = { visible: "ActiveCellIndicator_ActiveCellIndicator
 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";
 
 // src/components/InfiniteTable/components/ActiveRowIndicator.css.ts
-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" };
+var ActiveRowIndicatorCls = { visible: "ActiveRowIndicator_ActiveRowIndicatorCls_visible__j26lrx1 ActiveRowIndicator_ActiveRowIndicator__j26lrx0 utilities_pointerEvents_none__16lm1iwl utilities_position_absolute__16lm1iw2 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_absolute__16lm1iw2 utilities_width_100%__16lm1iw1b utilities_top_0__16lm1iw1c utilities_left_0__16lm1iw1e" };
 
 // src/components/InfiniteTable/components/ActiveRowIndicator.tsx
 var { rootClassName: rootClassName3 } = internalProps;
@@ -4592,8 +4601,8 @@ function forwardProps(propsToForward, props, setupState) {
   return mappedState;
 }
 function buildManagedComponent(config) {
+  const useParentStateFn = config.getParentState || (() => null);
   function useManagedComponent(props) {
-    var _a, _b;
     const [initialSetupState] = (0, import_react14.useState)(() => {
       return config.initSetupState ? config.initSetupState(props) : {};
     });
@@ -4602,7 +4611,7 @@ function buildManagedComponent(config) {
       () => config.forwardProps ? config.forwardProps(initialSetupState) : {},
       [initialSetupState]
     );
-    const parentState = (_b = (_a = config.getParentState) == null ? void 0 : _a.call(config)) != null ? _b : null;
+    const parentState = useParentStateFn();
     const getParentState = useLatest(parentState);
     function initStateOnce() {
       let mappedState = {};
@@ -4638,11 +4647,11 @@ function buildManagedComponent(config) {
     const [wholeState] = (0, import_react14.useState)(initStateOnce);
     const getProps = useLatest(props);
     const theReducer = (previousState, action) => {
-      var _a2;
+      var _a;
       if (action.type === "REPLACE_STATE") {
         return action.payload;
       }
-      const parentState2 = (_a2 = getParentState == null ? void 0 : getParentState()) != null ? _a2 : null;
+      const parentState2 = (_a = getParentState == null ? void 0 : getParentState()) != null ? _a : null;
       const mappedState = action.payload.mappedState;
       const updatedProps = action.payload.updatedPropsToState;
       const newState = Object.assign({}, previousState);
@@ -4727,6 +4736,8 @@ function buildManagedComponent(config) {
       [state, actions, getComponentState]
     );
     const prevProps = usePrevious(props);
+    const skipTriggerParentStateChangeRef = (0, import_react14.useRef)(false);
+    skipTriggerParentStateChangeRef.current = false;
     const effectFn = config.layoutEffect ? import_react14.useLayoutEffect : import_react14.useEffect;
     effectFn(() => {
       const currentProps = props;
@@ -4784,6 +4795,7 @@ function buildManagedComponent(config) {
             updatedPropsToState: updatedPropsToStateCount ? updatedPropsToState : null
           }
         };
+        skipTriggerParentStateChangeRef.current = true;
         dispatch(action);
         if (config.onPropChange) {
           for (var prop in rawUpdatedProps)
@@ -4802,10 +4814,18 @@ function buildManagedComponent(config) {
         }
       }
     });
+    effectFn(() => {
+      if (parentState != null && !skipTriggerParentStateChangeRef.current) {
+        dispatch({
+          type: "PARENT_STATE_CHANGE",
+          payload: {}
+        });
+      }
+    }, [parentState]);
     useEffectOnce(() => {
       return () => {
-        var _a2;
-        (_a2 = config.cleanup) == null ? void 0 : _a2.call(config, getComponentState());
+        var _a;
+        (_a = config.cleanup) == null ? void 0 : _a.call(config, getComponentState());
       };
     });
     return { contextValue, ContextComponent: Context };
@@ -5686,6 +5706,7 @@ var getComputedColumns = ({
   viewportReservedWidth,
   resizableColumns,
   draggableColumns,
+  columnDefaultDraggable,
   columnOrder,
   columnPinning,
   editable,
@@ -5969,7 +5990,7 @@ var getComputedColumns = ({
       computedSortedDesc,
       computedVisibleIndex,
       computedPinned,
-      computedDraggable: (_z = (_y = c.draggable) != null ? _y : draggableColumns) != null ? _z : DEFAULT_DRAGGABLE,
+      computedDraggable: (_z = (_y = draggableColumns != null ? draggableColumns : c.defaultDraggable) != null ? _y : columnDefaultDraggable) != null ? _z : DEFAULT_DRAGGABLE,
       computedFirstInCategory,
       computedLastInCategory,
       computedFirst: theComputedVisibleIndex === 0,
@@ -8248,7 +8269,7 @@ function InfiniteTableCellFn(props) {
   }
   const RenderComponent = cellType === "body" ? (_b = column.components) == null ? void 0 : _b.ColumnCell : (_c = column.components) == null ? void 0 : _c.HeaderCell;
   if (RenderComponent) {
-    return /* @__PURE__ */ React34.createElement(RenderComponent, __spreadValues({}, finalDOMProps));
+    return /* @__PURE__ */ React34.createElement(RenderComponent, __spreadProps(__spreadValues({}, finalDOMProps), { ref: domRef }));
   }
   return /* @__PURE__ */ React34.createElement("div", __spreadProps(__spreadValues({}, finalDOMProps), { ref: domRef }));
 }
@@ -12902,6 +12923,10 @@ function getDataSourceApi(param) {
 var DataSourceApiImpl = class {
   constructor(param) {
     this.pendingOperations = [];
+    //@ts-ignore
+    this.batchOperationRafId = 0;
+    //@ts-ignore
+    this.batchOperationTimeoutId = 0;
     this.pendingPromise = null;
     this.resolvePendingPromise = null;
     this.toPrimaryKey = (data) => {
@@ -13048,13 +13073,23 @@ var DataSourceApiImpl = class {
     this.actions = param.actions;
   }
   batchOperation(operation) {
+    var _a;
     if (!this.pendingPromise) {
       this.pendingPromise = new Promise((resolve) => {
         this.resolvePendingPromise = resolve;
       });
-      raf(() => {
-        this.commit();
-      });
+      const delay = Math.max(0, (_a = this.getState().batchOperationDelay) != null ? _a : 0);
+      if (delay === 0) {
+        this.batchOperationRafId = raf(() => {
+          this.commit();
+        });
+      } else {
+        this.batchOperationTimeoutId = setTimeout(() => {
+          this.batchOperationRafId = raf(() => {
+            this.commit();
+          });
+        }, delay);
+      }
     }
     this.pendingOperations.push(operation);
     return this.pendingPromise;
@@ -14463,6 +14498,7 @@ var forwardProps3 = (setupState) => {
         __idToIndex: idToIndexReducer
       };
     },
+    batchOperationDelay: 1,
     isRowSelected: 1,
     onDataArrayChange: 1,
     onDataMutations: 1,
@@ -15918,6 +15954,15 @@ var InfiniteTableApiImpl = class {
     this.setColumnOrder = (columnOrder) => {
       this.actions.columnOrder = columnOrder;
     };
+    this.setVisibilityForColumnGroup = (columnGroupId, visible) => {
+      const columnGroupVisibility = __spreadValues({}, this.getState().columnGroupVisibility);
+      if (visible) {
+        delete columnGroupVisibility[columnGroupId];
+      } else {
+        columnGroupVisibility[columnGroupId] = false;
+      }
+      this.actions.columnGroupVisibility = columnGroupVisibility;
+    };
     this.collapseAllGroupRows = () => {
       const state = this.getDataSourceState();
       const newState = new GroupRowsState(state.groupRowsState);
@@ -17563,7 +17608,8 @@ var forwardProps4 = (_setupState) => {
     columnMaxWidth: (columnMaxWidth) => columnMaxWidth != null ? columnMaxWidth : 5e3,
     columnDefaultWidth: (columnDefaultWidth) => columnDefaultWidth != null ? columnDefaultWidth : 200,
     columnCssEllipsis: (columnCssEllipsis) => columnCssEllipsis != null ? columnCssEllipsis : true,
-    draggableColumns: (draggableColumns) => draggableColumns != null ? draggableColumns : true,
+    draggableColumns: 1,
+    columnDefaultDraggable: 1,
     headerOptions: (headerOptions) => __spreadValues({
       alwaysReserveSpaceForSortIcon: true
     }, headerOptions),
@@ -18284,6 +18330,7 @@ var useComputedColumns = ({
   columnCssEllipsis,
   columnHeaderCssEllipsis,
   draggableColumns,
+  columnDefaultDraggable,
   sortInfo,
   multiSort,
   filterValue,
@@ -18345,6 +18392,7 @@ var useComputedColumns = ({
       pinnedEndMaxWidth,
       pinnedStartMaxWidth,
       draggableColumns,
+      columnDefaultDraggable,
       columnOrder,
       columnPinning,
       columnDefaultEditable,
@@ -18372,6 +18420,8 @@ var useComputedColumns = ({
     columnOrder,
     columnVisibility,
     columnVisibilityAssumeVisible,
+    columnDefaultDraggable,
+    draggableColumns,
     resizableColumns,
     pinnedEndMaxWidth,
     pinnedStartMaxWidth,
@@ -18629,6 +18679,7 @@ function useComputed() {
     columnDefaultWidth: componentState.columnDefaultWidth,
     columnDefaultFlex: componentState.columnDefaultFlex,
     columnDefaultSortable: componentState.columnDefaultSortable,
+    columnDefaultDraggable: componentState.columnDefaultDraggable,
     pinnedStartMaxWidth: componentState.pinnedStartMaxWidth,
     pinnedEndMaxWidth: componentState.pinnedEndMaxWidth,
     bodySize,
@@ -18893,7 +18944,7 @@ var useLicense = (licenseKey = "") => {
     }
     let valid2 = isValidLicense(licenseKey, {
       publishedAt: 1624970570587,
-      version: "4.3.6"
+      version: "4.3.8"
     });
     if (!licenseKey && !valid2 && isInsidePlayground) {
       return true;

package/index.mjs

@@ -2935,11 +2935,16 @@ var ReactHeadlessTableRenderer = class extends Logger {
     }, zIndex2) => {
       const columnOffsetX = `${columnOffsetAtIndex2}-${colIndex}`;
       const columnOffsetXWhileReordering = `${columnOffsetAtIndexWhileReordering2}-${colIndex}`;
-      element.style.setProperty(
-        currentTransformY,
-        scrollTop2 ? `calc( ${y}px + var(${scrollTopCSSVar}) )` : `${y}px`
-      );
-      element.style.transform = `translate3d(var(${columnOffsetXWhileReordering}, var(${columnOffsetX})), var(${currentTransformY}), 0)`;
+      const currentTransformYValue = scrollTop2 ? `calc( ${y}px + var(${scrollTopCSSVar}) )` : `${y}px`;
+      if (element.__currentTransformY !== currentTransformYValue) {
+        element.__currentTransformY = currentTransformYValue;
+        element.style.setProperty(currentTransformY, currentTransformYValue);
+      }
+      const transformValue = `translate3d(var(${columnOffsetXWhileReordering}, var(${columnOffsetX})), var(${currentTransformY}), 0)`;
+      if (element.__transformValue !== transformValue) {
+        element.__transformValue = transformValue;
+        element.style.transform = transformValue;
+      }
       if (zIndex2 != null) {
       }
     };
@@ -3593,11 +3598,15 @@ var ReactHeadlessTableRenderer = class extends Logger {
           itemElement.style.willChange = "transform";
           itemElement.style.backfaceVisibility = "hidden";
           const hidden = options ? options.hidden : !!this.isCellCovered(rowIndex, colIndex);
-          itemElement.style.zIndex = hidden ? "-1" : (
+          const zIndex2 = hidden ? "-1" : (
             // #updatezindex - we need to allow elements use their own zIndex, so we
             // resort to allowing them to have it as a data-z-index attribute
             itemElement.dataset.zIndex || "auto"
           );
+          if (itemElement.__zIndex !== zIndex2) {
+            itemElement.__zIndex = zIndex2;
+            itemElement.style.zIndex = zIndex2;
+          }
         } else {
           itemElement.style.display = "";
           itemElement.style.left = `${x}px`;
@@ -4115,7 +4124,7 @@ var ActiveCellIndicatorCls = { visible: "ActiveCellIndicator_ActiveCellIndicator
 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";
 
 // src/components/InfiniteTable/components/ActiveRowIndicator.css.ts
-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" };
+var ActiveRowIndicatorCls = { visible: "ActiveRowIndicator_ActiveRowIndicatorCls_visible__j26lrx1 ActiveRowIndicator_ActiveRowIndicator__j26lrx0 utilities_pointerEvents_none__16lm1iwl utilities_position_absolute__16lm1iw2 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_absolute__16lm1iw2 utilities_width_100%__16lm1iw1b utilities_top_0__16lm1iw1c utilities_left_0__16lm1iw1e" };
 
 // src/components/InfiniteTable/components/ActiveRowIndicator.tsx
 var { rootClassName: rootClassName3 } = internalProps;
@@ -4555,8 +4564,8 @@ function forwardProps(propsToForward, props, setupState) {
   return mappedState;
 }
 function buildManagedComponent(config) {
+  const useParentStateFn = config.getParentState || (() => null);
   function useManagedComponent(props) {
-    var _a, _b;
     const [initialSetupState] = useState4(() => {
       return config.initSetupState ? config.initSetupState(props) : {};
     });
@@ -4565,7 +4574,7 @@ function buildManagedComponent(config) {
       () => config.forwardProps ? config.forwardProps(initialSetupState) : {},
       [initialSetupState]
     );
-    const parentState = (_b = (_a = config.getParentState) == null ? void 0 : _a.call(config)) != null ? _b : null;
+    const parentState = useParentStateFn();
     const getParentState = useLatest(parentState);
     function initStateOnce() {
       let mappedState = {};
@@ -4601,11 +4610,11 @@ function buildManagedComponent(config) {
     const [wholeState] = useState4(initStateOnce);
     const getProps = useLatest(props);
     const theReducer = (previousState, action) => {
-      var _a2;
+      var _a;
       if (action.type === "REPLACE_STATE") {
         return action.payload;
       }
-      const parentState2 = (_a2 = getParentState == null ? void 0 : getParentState()) != null ? _a2 : null;
+      const parentState2 = (_a = getParentState == null ? void 0 : getParentState()) != null ? _a : null;
       const mappedState = action.payload.mappedState;
       const updatedProps = action.payload.updatedPropsToState;
       const newState = Object.assign({}, previousState);
@@ -4690,6 +4699,8 @@ function buildManagedComponent(config) {
       [state, actions, getComponentState]
     );
     const prevProps = usePrevious(props);
+    const skipTriggerParentStateChangeRef = useRef11(false);
+    skipTriggerParentStateChangeRef.current = false;
     const effectFn = config.layoutEffect ? useLayoutEffect7 : useEffect9;
     effectFn(() => {
       const currentProps = props;
@@ -4747,6 +4758,7 @@ function buildManagedComponent(config) {
             updatedPropsToState: updatedPropsToStateCount ? updatedPropsToState : null
           }
         };
+        skipTriggerParentStateChangeRef.current = true;
         dispatch(action);
         if (config.onPropChange) {
           for (var prop in rawUpdatedProps)
@@ -4765,10 +4777,18 @@ function buildManagedComponent(config) {
         }
       }
     });
+    effectFn(() => {
+      if (parentState != null && !skipTriggerParentStateChangeRef.current) {
+        dispatch({
+          type: "PARENT_STATE_CHANGE",
+          payload: {}
+        });
+      }
+    }, [parentState]);
     useEffectOnce(() => {
       return () => {
-        var _a2;
-        (_a2 = config.cleanup) == null ? void 0 : _a2.call(config, getComponentState());
+        var _a;
+        (_a = config.cleanup) == null ? void 0 : _a.call(config, getComponentState());
       };
     });
     return { contextValue, ContextComponent: Context };
@@ -5649,6 +5669,7 @@ var getComputedColumns = ({
   viewportReservedWidth,
   resizableColumns,
   draggableColumns,
+  columnDefaultDraggable,
   columnOrder,
   columnPinning,
   editable,
@@ -5932,7 +5953,7 @@ var getComputedColumns = ({
       computedSortedDesc,
       computedVisibleIndex,
       computedPinned,
-      computedDraggable: (_z = (_y = c.draggable) != null ? _y : draggableColumns) != null ? _z : DEFAULT_DRAGGABLE,
+      computedDraggable: (_z = (_y = draggableColumns != null ? draggableColumns : c.defaultDraggable) != null ? _y : columnDefaultDraggable) != null ? _z : DEFAULT_DRAGGABLE,
       computedFirstInCategory,
       computedLastInCategory,
       computedFirst: theComputedVisibleIndex === 0,
@@ -8211,7 +8232,7 @@ function InfiniteTableCellFn(props) {
   }
   const RenderComponent = cellType === "body" ? (_b = column.components) == null ? void 0 : _b.ColumnCell : (_c = column.components) == null ? void 0 : _c.HeaderCell;
   if (RenderComponent) {
-    return /* @__PURE__ */ React34.createElement(RenderComponent, __spreadValues({}, finalDOMProps));
+    return /* @__PURE__ */ React34.createElement(RenderComponent, __spreadProps(__spreadValues({}, finalDOMProps), { ref: domRef }));
   }
   return /* @__PURE__ */ React34.createElement("div", __spreadProps(__spreadValues({}, finalDOMProps), { ref: domRef }));
 }
@@ -12865,6 +12886,10 @@ function getDataSourceApi(param) {
 var DataSourceApiImpl = class {
   constructor(param) {
     this.pendingOperations = [];
+    //@ts-ignore
+    this.batchOperationRafId = 0;
+    //@ts-ignore
+    this.batchOperationTimeoutId = 0;
     this.pendingPromise = null;
     this.resolvePendingPromise = null;
     this.toPrimaryKey = (data) => {
@@ -13011,13 +13036,23 @@ var DataSourceApiImpl = class {
     this.actions = param.actions;
   }
   batchOperation(operation) {
+    var _a;
     if (!this.pendingPromise) {
       this.pendingPromise = new Promise((resolve) => {
         this.resolvePendingPromise = resolve;
       });
-      raf(() => {
-        this.commit();
-      });
+      const delay = Math.max(0, (_a = this.getState().batchOperationDelay) != null ? _a : 0);
+      if (delay === 0) {
+        this.batchOperationRafId = raf(() => {
+          this.commit();
+        });
+      } else {
+        this.batchOperationTimeoutId = setTimeout(() => {
+          this.batchOperationRafId = raf(() => {
+            this.commit();
+          });
+        }, delay);
+      }
     }
     this.pendingOperations.push(operation);
     return this.pendingPromise;
@@ -14426,6 +14461,7 @@ var forwardProps3 = (setupState) => {
         __idToIndex: idToIndexReducer
       };
     },
+    batchOperationDelay: 1,
     isRowSelected: 1,
     onDataArrayChange: 1,
     onDataMutations: 1,
@@ -15886,6 +15922,15 @@ var InfiniteTableApiImpl = class {
     this.setColumnOrder = (columnOrder) => {
       this.actions.columnOrder = columnOrder;
     };
+    this.setVisibilityForColumnGroup = (columnGroupId, visible) => {
+      const columnGroupVisibility = __spreadValues({}, this.getState().columnGroupVisibility);
+      if (visible) {
+        delete columnGroupVisibility[columnGroupId];
+      } else {
+        columnGroupVisibility[columnGroupId] = false;
+      }
+      this.actions.columnGroupVisibility = columnGroupVisibility;
+    };
     this.collapseAllGroupRows = () => {
       const state = this.getDataSourceState();
       const newState = new GroupRowsState(state.groupRowsState);
@@ -17535,7 +17580,8 @@ var forwardProps4 = (_setupState) => {
     columnMaxWidth: (columnMaxWidth) => columnMaxWidth != null ? columnMaxWidth : 5e3,
     columnDefaultWidth: (columnDefaultWidth) => columnDefaultWidth != null ? columnDefaultWidth : 200,
     columnCssEllipsis: (columnCssEllipsis) => columnCssEllipsis != null ? columnCssEllipsis : true,
-    draggableColumns: (draggableColumns) => draggableColumns != null ? draggableColumns : true,
+    draggableColumns: 1,
+    columnDefaultDraggable: 1,
     headerOptions: (headerOptions) => __spreadValues({
       alwaysReserveSpaceForSortIcon: true
     }, headerOptions),
@@ -18256,6 +18302,7 @@ var useComputedColumns = ({
   columnCssEllipsis,
   columnHeaderCssEllipsis,
   draggableColumns,
+  columnDefaultDraggable,
   sortInfo,
   multiSort,
   filterValue,
@@ -18317,6 +18364,7 @@ var useComputedColumns = ({
       pinnedEndMaxWidth,
       pinnedStartMaxWidth,
       draggableColumns,
+      columnDefaultDraggable,
       columnOrder,
       columnPinning,
       columnDefaultEditable,
@@ -18344,6 +18392,8 @@ var useComputedColumns = ({
     columnOrder,
     columnVisibility,
     columnVisibilityAssumeVisible,
+    columnDefaultDraggable,
+    draggableColumns,
     resizableColumns,
     pinnedEndMaxWidth,
     pinnedStartMaxWidth,
@@ -18601,6 +18651,7 @@ function useComputed() {
     columnDefaultWidth: componentState.columnDefaultWidth,
     columnDefaultFlex: componentState.columnDefaultFlex,
     columnDefaultSortable: componentState.columnDefaultSortable,
+    columnDefaultDraggable: componentState.columnDefaultDraggable,
     pinnedStartMaxWidth: componentState.pinnedStartMaxWidth,
     pinnedEndMaxWidth: componentState.pinnedEndMaxWidth,
     bodySize,
@@ -18865,7 +18916,7 @@ var useLicense = (licenseKey = "") => {
     }
     let valid2 = isValidLicense(licenseKey, {
       publishedAt: 1624970570587,
-      version: "4.3.6"
+      version: "4.3.8"
     });
     if (!licenseKey && !valid2 && isInsidePlayground) {
       return true;

package/package.json

@@ -25,7 +25,7 @@
   "bugs": {
     "url": "https://github.com/infinite-table/infinite-react/issues"
   },
-  "version": "4.3.6",
+  "version": "4.3.8",
   "main": "index.js",
   "module": "index.mjs",
   "typings": "index.d.ts",
@@ -34,5 +34,5 @@
   },
   "license": "Commercial & Open Source",
   "//": "will be updated at build time",
-  "publishedAt": 1723632776523
+  "publishedAt": 1724077305504
 }