@infinite-table/infinite-react 5.0.0 → 5.0.1

package/index.d.ts

@@ -936,6 +936,13 @@ declare type CellPositionByIndex = {
     rowIndex: number;
     colIndex: number;
 };
+declare type MultiSelectRangeOptions = {
+    horizontalLayout: false;
+} | {
+    horizontalLayout: true;
+    rowsPerPage: number;
+    columnsPerSet: number;
+};
 
 declare type MultiCellSelectorOptions = {
     getPrimaryKeyByIndex: (rowIndex: number) => string | number;
@@ -960,10 +967,10 @@ declare class MultiCellSelector {
      * @param position CellPosition
      */
     singleAddClick(position: CellPositionByIndex): void;
-    multiSelectClick(position: CellPositionByIndex): void;
-    setRangeSelected(startPosition: CellPositionByIndex, endPosition: CellPositionByIndex, selected: boolean): void;
-    deselectRange(startPosition: CellPositionByIndex, endPosition: CellPositionByIndex): void;
-    selectRange(startPosition: CellPositionByIndex, endPosition: CellPositionByIndex): void;
+    multiSelectClick(position: CellPositionByIndex, options: MultiSelectRangeOptions): void;
+    setRangeSelected(startPosition: CellPositionByIndex, endPosition: CellPositionByIndex, selected: boolean, options: MultiSelectRangeOptions): void;
+    deselectRange(startPosition: CellPositionByIndex, endPosition: CellPositionByIndex, options: MultiSelectRangeOptions): void;
+    selectRange(startPosition: CellPositionByIndex, endPosition: CellPositionByIndex, options: MultiSelectRangeOptions): void;
 }
 
 declare type RowSelectionStateItem = (any | any[])[];

package/index.dev.js

@@ -16215,16 +16215,7 @@ function notNullable(value) {
   return true;
 }
 
-// src/components/InfiniteTable/api/getCellSelectionApi.ts
-function ensureSortedPerOrder(arr, sortPattern) {
-  const arrSet = new Set(arr);
-  return sortPattern.map((item) => {
-    if (arrSet.has(item)) {
-      return item;
-    }
-    return null;
-  }).filter((x) => x != null);
-}
+// src/components/types/CellPositionByIndex.ts
 function ensureMinMaxCellPositionByIndex(start, end) {
   let { rowIndex: startRowIndex, colIndex: startColIndex } = start;
   let { rowIndex: endRowIndex, colIndex: endColIndex } = end;
@@ -16235,6 +16226,64 @@ function ensureMinMaxCellPositionByIndex(start, end) {
     { rowIndex: rowEnd, colIndex: colEnd }
   ];
 }
+function isSamePage(startPosition, endPosition, options) {
+  const { rowsPerPage } = options;
+  return !rowsPerPage ? true : Math.floor(startPosition.rowIndex / rowsPerPage) === Math.floor(endPosition.rowIndex / rowsPerPage);
+}
+function getPositionsArrayForRangeInHorizontaLLayout(startPosition, endPosition, options) {
+  if (isSamePage(startPosition, endPosition, options)) {
+    throw "You should not call this when the positions are in the same page";
+  }
+  const { rowsPerPage, columnsPerSet } = options;
+  if (rowsPerPage === 0) {
+    throw "rowsPerPage cannot be 0";
+  }
+  let start = startPosition;
+  let end = endPosition;
+  if (Math.floor(startPosition.rowIndex / rowsPerPage) > Math.floor(endPosition.rowIndex / rowsPerPage)) {
+    start = endPosition;
+    end = startPosition;
+  }
+  let { rowIndex: startRowIndex, colIndex: startColIndex } = start;
+  let { rowIndex: endRowIndex, colIndex: endColIndex } = end;
+  const pageForStartRowIndex = Math.floor(startRowIndex / rowsPerPage);
+  const pageForEndRowIndex = Math.floor(endRowIndex / rowsPerPage);
+  const offsetForStartRowIndex = startRowIndex % rowsPerPage;
+  const offsetForEndRowIndex = endRowIndex % rowsPerPage;
+  const minOffset = Math.min(offsetForStartRowIndex, offsetForEndRowIndex);
+  const maxOffset = Math.max(offsetForStartRowIndex, offsetForEndRowIndex);
+  const positions = [];
+  for (let page = pageForStartRowIndex; page <= pageForEndRowIndex; page++) {
+    for (let offset = minOffset; offset <= maxOffset; offset++) {
+      const rowIndex = page * rowsPerPage + offset;
+      if (page === pageForStartRowIndex) {
+        for (let colIndex = startColIndex; colIndex < columnsPerSet; colIndex++) {
+          positions.push({ rowIndex, colIndex });
+        }
+      } else if (page === pageForEndRowIndex) {
+        for (let colIndex = 0; colIndex <= endColIndex; colIndex++) {
+          positions.push({ rowIndex, colIndex });
+        }
+      } else {
+        for (let colIndex = 0; colIndex < columnsPerSet; colIndex++) {
+          positions.push({ rowIndex, colIndex });
+        }
+      }
+    }
+  }
+  return positions;
+}
+
+// src/components/InfiniteTable/api/getCellSelectionApi.ts
+function ensureSortedPerOrder(arr, sortPattern) {
+  const arrSet = new Set(arr);
+  return sortPattern.map((item) => {
+    if (arrSet.has(item)) {
+      return item;
+    }
+    return null;
+  }).filter((x) => x != null);
+}
 var InfiniteTableCellSelectionApiImpl = class {
   constructor(param) {
     this.getCellSelectionPosition = (options) => {
@@ -18071,7 +18120,7 @@ var MultiCellSelector = class {
       this.multiSelectEndPosition = void 0;
     }
   }
-  multiSelectClick(position2) {
+  multiSelectClick(position2, options) {
     if (!this.multiSelectStartPosition) {
       return;
     }
@@ -18082,13 +18131,39 @@ var MultiCellSelector = class {
     if (this.multiSelectEndPosition) {
       this.deselectRange(
         this.multiSelectStartPosition,
-        this.multiSelectEndPosition
+        this.multiSelectEndPosition,
+        options
       );
     }
-    this.selectRange(this.multiSelectStartPosition, position2);
+    this.selectRange(this.multiSelectStartPosition, position2, options);
     this.multiSelectEndPosition = position2;
   }
-  setRangeSelected(startPosition, endPosition, selected) {
+  setRangeSelected(startPosition, endPosition, selected, options) {
+    if (options.horizontalLayout && !isSamePage(startPosition, endPosition, options)) {
+      const positions = getPositionsArrayForRangeInHorizontaLLayout(
+        startPosition,
+        endPosition,
+        {
+          rowsPerPage: options.rowsPerPage,
+          columnsPerSet: options.columnsPerSet
+        }
+      );
+      positions.forEach((position2) => {
+        const selectionPosition = this.getCellSelectionPosition({
+          rowIndex: position2.rowIndex,
+          colIndex: position2.colIndex
+        });
+        if (!selectionPosition) {
+          return;
+        }
+        if (selected) {
+          this.cellSelectionState.selectCell(...selectionPosition);
+        } else {
+          this.cellSelectionState.deselectCell(...selectionPosition);
+        }
+      });
+      return;
+    }
     const [start, end] = ensureMinMaxCellPositionByIndex(
       startPosition,
       endPosition
@@ -18115,11 +18190,11 @@ var MultiCellSelector = class {
       }
     }
   }
-  deselectRange(startPosition, endPosition) {
-    this.setRangeSelected(startPosition, endPosition, false);
+  deselectRange(startPosition, endPosition, options) {
+    this.setRangeSelected(startPosition, endPosition, false, options);
   }
-  selectRange(startPosition, endPosition) {
-    this.setRangeSelected(startPosition, endPosition, true);
+  selectRange(startPosition, endPosition, options) {
+    this.setRangeSelected(startPosition, endPosition, true, options);
   }
 };
 
@@ -20117,7 +20192,7 @@ var useLicense = (licenseKey = "") => {
     }
     let valid2 = isValidLicense(licenseKey, {
       publishedAt: 1624970570587,
-      version: "5.0.0"
+      version: "5.0.1"
     });
     if (!licenseKey && !valid2 && isInsidePlayground) {
       return true;
@@ -20229,6 +20304,7 @@ function onCellDoubleClick(context, _event) {
 function updateCellSelectionOnCellClick(context, event) {
   const {
     getDataSourceState,
+    getState,
     getComputed,
     rowIndex,
     colIndex,
@@ -20242,7 +20318,10 @@ function updateCellSelectionOnCellClick(context, event) {
   if (selectionMode !== "multi-cell") {
     return;
   }
-  const { multiCellSelector } = getComputed();
+  const { multiCellSelector, computedVisibleColumns } = getComputed();
+  const { brain } = getState();
+  const { rowsPerPage } = brain;
+  const columnsPerSet = computedVisibleColumns.length;
   const cellSelection = new CellSelectionState(existingCellSelection);
   multiCellSelector.cellSelectionState = cellSelection;
   const position2 = {
@@ -20252,7 +20331,17 @@ function updateCellSelectionOnCellClick(context, event) {
   if (event.metaKey || event.ctrlKey) {
     multiCellSelector.singleAddClick(position2);
   } else if (event.shiftKey) {
-    multiCellSelector.multiSelectClick(position2);
+    const horizontalLayout = !!getState().wrapRowsHorizontally;
+    multiCellSelector.multiSelectClick(
+      position2,
+      horizontalLayout ? {
+        horizontalLayout,
+        rowsPerPage,
+        columnsPerSet
+      } : {
+        horizontalLayout
+      }
+    );
   } else {
     multiCellSelector.resetClick(position2);
   }
@@ -23827,7 +23916,7 @@ function useHorizontalLayout() {
       } = getDataSourceState();
       let changes = false;
       const rowsPerPage = brain.rowsPerPage;
-      const newRowsPerPage = groupBy && groupBy.length > 0 ? rowsPerPage : null;
+      const newRowsPerPage = groupBy && groupBy.length > 0 && rowsPerPage > 0 ? rowsPerPage : null;
       if (currentRowsPerPage != newRowsPerPage) {
         dataSourceActions.rowsPerPage = newRowsPerPage;
         changes = true;

package/index.dev.mjs

@@ -16177,16 +16177,7 @@ function notNullable(value) {
   return true;
 }
 
-// src/components/InfiniteTable/api/getCellSelectionApi.ts
-function ensureSortedPerOrder(arr, sortPattern) {
-  const arrSet = new Set(arr);
-  return sortPattern.map((item) => {
-    if (arrSet.has(item)) {
-      return item;
-    }
-    return null;
-  }).filter((x) => x != null);
-}
+// src/components/types/CellPositionByIndex.ts
 function ensureMinMaxCellPositionByIndex(start, end) {
   let { rowIndex: startRowIndex, colIndex: startColIndex } = start;
   let { rowIndex: endRowIndex, colIndex: endColIndex } = end;
@@ -16197,6 +16188,64 @@ function ensureMinMaxCellPositionByIndex(start, end) {
     { rowIndex: rowEnd, colIndex: colEnd }
   ];
 }
+function isSamePage(startPosition, endPosition, options) {
+  const { rowsPerPage } = options;
+  return !rowsPerPage ? true : Math.floor(startPosition.rowIndex / rowsPerPage) === Math.floor(endPosition.rowIndex / rowsPerPage);
+}
+function getPositionsArrayForRangeInHorizontaLLayout(startPosition, endPosition, options) {
+  if (isSamePage(startPosition, endPosition, options)) {
+    throw "You should not call this when the positions are in the same page";
+  }
+  const { rowsPerPage, columnsPerSet } = options;
+  if (rowsPerPage === 0) {
+    throw "rowsPerPage cannot be 0";
+  }
+  let start = startPosition;
+  let end = endPosition;
+  if (Math.floor(startPosition.rowIndex / rowsPerPage) > Math.floor(endPosition.rowIndex / rowsPerPage)) {
+    start = endPosition;
+    end = startPosition;
+  }
+  let { rowIndex: startRowIndex, colIndex: startColIndex } = start;
+  let { rowIndex: endRowIndex, colIndex: endColIndex } = end;
+  const pageForStartRowIndex = Math.floor(startRowIndex / rowsPerPage);
+  const pageForEndRowIndex = Math.floor(endRowIndex / rowsPerPage);
+  const offsetForStartRowIndex = startRowIndex % rowsPerPage;
+  const offsetForEndRowIndex = endRowIndex % rowsPerPage;
+  const minOffset = Math.min(offsetForStartRowIndex, offsetForEndRowIndex);
+  const maxOffset = Math.max(offsetForStartRowIndex, offsetForEndRowIndex);
+  const positions = [];
+  for (let page = pageForStartRowIndex; page <= pageForEndRowIndex; page++) {
+    for (let offset = minOffset; offset <= maxOffset; offset++) {
+      const rowIndex = page * rowsPerPage + offset;
+      if (page === pageForStartRowIndex) {
+        for (let colIndex = startColIndex; colIndex < columnsPerSet; colIndex++) {
+          positions.push({ rowIndex, colIndex });
+        }
+      } else if (page === pageForEndRowIndex) {
+        for (let colIndex = 0; colIndex <= endColIndex; colIndex++) {
+          positions.push({ rowIndex, colIndex });
+        }
+      } else {
+        for (let colIndex = 0; colIndex < columnsPerSet; colIndex++) {
+          positions.push({ rowIndex, colIndex });
+        }
+      }
+    }
+  }
+  return positions;
+}
+
+// src/components/InfiniteTable/api/getCellSelectionApi.ts
+function ensureSortedPerOrder(arr, sortPattern) {
+  const arrSet = new Set(arr);
+  return sortPattern.map((item) => {
+    if (arrSet.has(item)) {
+      return item;
+    }
+    return null;
+  }).filter((x) => x != null);
+}
 var InfiniteTableCellSelectionApiImpl = class {
   constructor(param) {
     this.getCellSelectionPosition = (options) => {
@@ -18037,7 +18086,7 @@ var MultiCellSelector = class {
       this.multiSelectEndPosition = void 0;
     }
   }
-  multiSelectClick(position2) {
+  multiSelectClick(position2, options) {
     if (!this.multiSelectStartPosition) {
       return;
     }
@@ -18048,13 +18097,39 @@ var MultiCellSelector = class {
     if (this.multiSelectEndPosition) {
       this.deselectRange(
         this.multiSelectStartPosition,
-        this.multiSelectEndPosition
+        this.multiSelectEndPosition,
+        options
       );
     }
-    this.selectRange(this.multiSelectStartPosition, position2);
+    this.selectRange(this.multiSelectStartPosition, position2, options);
     this.multiSelectEndPosition = position2;
   }
-  setRangeSelected(startPosition, endPosition, selected) {
+  setRangeSelected(startPosition, endPosition, selected, options) {
+    if (options.horizontalLayout && !isSamePage(startPosition, endPosition, options)) {
+      const positions = getPositionsArrayForRangeInHorizontaLLayout(
+        startPosition,
+        endPosition,
+        {
+          rowsPerPage: options.rowsPerPage,
+          columnsPerSet: options.columnsPerSet
+        }
+      );
+      positions.forEach((position2) => {
+        const selectionPosition = this.getCellSelectionPosition({
+          rowIndex: position2.rowIndex,
+          colIndex: position2.colIndex
+        });
+        if (!selectionPosition) {
+          return;
+        }
+        if (selected) {
+          this.cellSelectionState.selectCell(...selectionPosition);
+        } else {
+          this.cellSelectionState.deselectCell(...selectionPosition);
+        }
+      });
+      return;
+    }
     const [start, end] = ensureMinMaxCellPositionByIndex(
       startPosition,
       endPosition
@@ -18081,11 +18156,11 @@ var MultiCellSelector = class {
       }
     }
   }
-  deselectRange(startPosition, endPosition) {
-    this.setRangeSelected(startPosition, endPosition, false);
+  deselectRange(startPosition, endPosition, options) {
+    this.setRangeSelected(startPosition, endPosition, false, options);
   }
-  selectRange(startPosition, endPosition) {
-    this.setRangeSelected(startPosition, endPosition, true);
+  selectRange(startPosition, endPosition, options) {
+    this.setRangeSelected(startPosition, endPosition, true, options);
   }
 };
 
@@ -20083,7 +20158,7 @@ var useLicense = (licenseKey = "") => {
     }
     let valid2 = isValidLicense(licenseKey, {
       publishedAt: 1624970570587,
-      version: "5.0.0"
+      version: "5.0.1"
     });
     if (!licenseKey && !valid2 && isInsidePlayground) {
       return true;
@@ -20195,6 +20270,7 @@ function onCellDoubleClick(context, _event) {
 function updateCellSelectionOnCellClick(context, event) {
   const {
     getDataSourceState,
+    getState,
     getComputed,
     rowIndex,
     colIndex,
@@ -20208,7 +20284,10 @@ function updateCellSelectionOnCellClick(context, event) {
   if (selectionMode !== "multi-cell") {
     return;
   }
-  const { multiCellSelector } = getComputed();
+  const { multiCellSelector, computedVisibleColumns } = getComputed();
+  const { brain } = getState();
+  const { rowsPerPage } = brain;
+  const columnsPerSet = computedVisibleColumns.length;
   const cellSelection = new CellSelectionState(existingCellSelection);
   multiCellSelector.cellSelectionState = cellSelection;
   const position2 = {
@@ -20218,7 +20297,17 @@ function updateCellSelectionOnCellClick(context, event) {
   if (event.metaKey || event.ctrlKey) {
     multiCellSelector.singleAddClick(position2);
   } else if (event.shiftKey) {
-    multiCellSelector.multiSelectClick(position2);
+    const horizontalLayout = !!getState().wrapRowsHorizontally;
+    multiCellSelector.multiSelectClick(
+      position2,
+      horizontalLayout ? {
+        horizontalLayout,
+        rowsPerPage,
+        columnsPerSet
+      } : {
+        horizontalLayout
+      }
+    );
   } else {
     multiCellSelector.resetClick(position2);
   }
@@ -23803,7 +23892,7 @@ function useHorizontalLayout() {
       } = getDataSourceState();
       let changes = false;
       const rowsPerPage = brain.rowsPerPage;
-      const newRowsPerPage = groupBy && groupBy.length > 0 ? rowsPerPage : null;
+      const newRowsPerPage = groupBy && groupBy.length > 0 && rowsPerPage > 0 ? rowsPerPage : null;
       if (currentRowsPerPage != newRowsPerPage) {
         dataSourceActions.rowsPerPage = newRowsPerPage;
         changes = true;

package/index.js

@@ -16215,16 +16215,7 @@ function notNullable(value) {
   return true;
 }
 
-// src/components/InfiniteTable/api/getCellSelectionApi.ts
-function ensureSortedPerOrder(arr, sortPattern) {
-  const arrSet = new Set(arr);
-  return sortPattern.map((item) => {
-    if (arrSet.has(item)) {
-      return item;
-    }
-    return null;
-  }).filter((x) => x != null);
-}
+// src/components/types/CellPositionByIndex.ts
 function ensureMinMaxCellPositionByIndex(start, end) {
   let { rowIndex: startRowIndex, colIndex: startColIndex } = start;
   let { rowIndex: endRowIndex, colIndex: endColIndex } = end;
@@ -16235,6 +16226,64 @@ function ensureMinMaxCellPositionByIndex(start, end) {
     { rowIndex: rowEnd, colIndex: colEnd }
   ];
 }
+function isSamePage(startPosition, endPosition, options) {
+  const { rowsPerPage } = options;
+  return !rowsPerPage ? true : Math.floor(startPosition.rowIndex / rowsPerPage) === Math.floor(endPosition.rowIndex / rowsPerPage);
+}
+function getPositionsArrayForRangeInHorizontaLLayout(startPosition, endPosition, options) {
+  if (isSamePage(startPosition, endPosition, options)) {
+    throw "You should not call this when the positions are in the same page";
+  }
+  const { rowsPerPage, columnsPerSet } = options;
+  if (rowsPerPage === 0) {
+    throw "rowsPerPage cannot be 0";
+  }
+  let start = startPosition;
+  let end = endPosition;
+  if (Math.floor(startPosition.rowIndex / rowsPerPage) > Math.floor(endPosition.rowIndex / rowsPerPage)) {
+    start = endPosition;
+    end = startPosition;
+  }
+  let { rowIndex: startRowIndex, colIndex: startColIndex } = start;
+  let { rowIndex: endRowIndex, colIndex: endColIndex } = end;
+  const pageForStartRowIndex = Math.floor(startRowIndex / rowsPerPage);
+  const pageForEndRowIndex = Math.floor(endRowIndex / rowsPerPage);
+  const offsetForStartRowIndex = startRowIndex % rowsPerPage;
+  const offsetForEndRowIndex = endRowIndex % rowsPerPage;
+  const minOffset = Math.min(offsetForStartRowIndex, offsetForEndRowIndex);
+  const maxOffset = Math.max(offsetForStartRowIndex, offsetForEndRowIndex);
+  const positions = [];
+  for (let page = pageForStartRowIndex; page <= pageForEndRowIndex; page++) {
+    for (let offset = minOffset; offset <= maxOffset; offset++) {
+      const rowIndex = page * rowsPerPage + offset;
+      if (page === pageForStartRowIndex) {
+        for (let colIndex = startColIndex; colIndex < columnsPerSet; colIndex++) {
+          positions.push({ rowIndex, colIndex });
+        }
+      } else if (page === pageForEndRowIndex) {
+        for (let colIndex = 0; colIndex <= endColIndex; colIndex++) {
+          positions.push({ rowIndex, colIndex });
+        }
+      } else {
+        for (let colIndex = 0; colIndex < columnsPerSet; colIndex++) {
+          positions.push({ rowIndex, colIndex });
+        }
+      }
+    }
+  }
+  return positions;
+}
+
+// src/components/InfiniteTable/api/getCellSelectionApi.ts
+function ensureSortedPerOrder(arr, sortPattern) {
+  const arrSet = new Set(arr);
+  return sortPattern.map((item) => {
+    if (arrSet.has(item)) {
+      return item;
+    }
+    return null;
+  }).filter((x) => x != null);
+}
 var InfiniteTableCellSelectionApiImpl = class {
   constructor(param) {
     this.getCellSelectionPosition = (options) => {
@@ -18071,7 +18120,7 @@ var MultiCellSelector = class {
       this.multiSelectEndPosition = void 0;
     }
   }
-  multiSelectClick(position2) {
+  multiSelectClick(position2, options) {
     if (!this.multiSelectStartPosition) {
       return;
     }
@@ -18082,13 +18131,39 @@ var MultiCellSelector = class {
     if (this.multiSelectEndPosition) {
       this.deselectRange(
         this.multiSelectStartPosition,
-        this.multiSelectEndPosition
+        this.multiSelectEndPosition,
+        options
       );
     }
-    this.selectRange(this.multiSelectStartPosition, position2);
+    this.selectRange(this.multiSelectStartPosition, position2, options);
     this.multiSelectEndPosition = position2;
   }
-  setRangeSelected(startPosition, endPosition, selected) {
+  setRangeSelected(startPosition, endPosition, selected, options) {
+    if (options.horizontalLayout && !isSamePage(startPosition, endPosition, options)) {
+      const positions = getPositionsArrayForRangeInHorizontaLLayout(
+        startPosition,
+        endPosition,
+        {
+          rowsPerPage: options.rowsPerPage,
+          columnsPerSet: options.columnsPerSet
+        }
+      );
+      positions.forEach((position2) => {
+        const selectionPosition = this.getCellSelectionPosition({
+          rowIndex: position2.rowIndex,
+          colIndex: position2.colIndex
+        });
+        if (!selectionPosition) {
+          return;
+        }
+        if (selected) {
+          this.cellSelectionState.selectCell(...selectionPosition);
+        } else {
+          this.cellSelectionState.deselectCell(...selectionPosition);
+        }
+      });
+      return;
+    }
     const [start, end] = ensureMinMaxCellPositionByIndex(
       startPosition,
       endPosition
@@ -18115,11 +18190,11 @@ var MultiCellSelector = class {
       }
     }
   }
-  deselectRange(startPosition, endPosition) {
-    this.setRangeSelected(startPosition, endPosition, false);
+  deselectRange(startPosition, endPosition, options) {
+    this.setRangeSelected(startPosition, endPosition, false, options);
   }
-  selectRange(startPosition, endPosition) {
-    this.setRangeSelected(startPosition, endPosition, true);
+  selectRange(startPosition, endPosition, options) {
+    this.setRangeSelected(startPosition, endPosition, true, options);
   }
 };
 
@@ -20117,7 +20192,7 @@ var useLicense = (licenseKey = "") => {
     }
     let valid2 = isValidLicense(licenseKey, {
       publishedAt: 1624970570587,
-      version: "5.0.0"
+      version: "5.0.1"
     });
     if (!licenseKey && !valid2 && isInsidePlayground) {
       return true;
@@ -20229,6 +20304,7 @@ function onCellDoubleClick(context, _event) {
 function updateCellSelectionOnCellClick(context, event) {
   const {
     getDataSourceState,
+    getState,
     getComputed,
     rowIndex,
     colIndex,
@@ -20242,7 +20318,10 @@ function updateCellSelectionOnCellClick(context, event) {
   if (selectionMode !== "multi-cell") {
     return;
   }
-  const { multiCellSelector } = getComputed();
+  const { multiCellSelector, computedVisibleColumns } = getComputed();
+  const { brain } = getState();
+  const { rowsPerPage } = brain;
+  const columnsPerSet = computedVisibleColumns.length;
   const cellSelection = new CellSelectionState(existingCellSelection);
   multiCellSelector.cellSelectionState = cellSelection;
   const position2 = {
@@ -20252,7 +20331,17 @@ function updateCellSelectionOnCellClick(context, event) {
   if (event.metaKey || event.ctrlKey) {
     multiCellSelector.singleAddClick(position2);
   } else if (event.shiftKey) {
-    multiCellSelector.multiSelectClick(position2);
+    const horizontalLayout = !!getState().wrapRowsHorizontally;
+    multiCellSelector.multiSelectClick(
+      position2,
+      horizontalLayout ? {
+        horizontalLayout,
+        rowsPerPage,
+        columnsPerSet
+      } : {
+        horizontalLayout
+      }
+    );
   } else {
     multiCellSelector.resetClick(position2);
   }
@@ -23827,7 +23916,7 @@ function useHorizontalLayout() {
       } = getDataSourceState();
       let changes = false;
       const rowsPerPage = brain.rowsPerPage;
-      const newRowsPerPage = groupBy && groupBy.length > 0 ? rowsPerPage : null;
+      const newRowsPerPage = groupBy && groupBy.length > 0 && rowsPerPage > 0 ? rowsPerPage : null;
       if (currentRowsPerPage != newRowsPerPage) {
         dataSourceActions.rowsPerPage = newRowsPerPage;
         changes = true;

package/index.mjs

@@ -16177,16 +16177,7 @@ function notNullable(value) {
   return true;
 }
 
-// src/components/InfiniteTable/api/getCellSelectionApi.ts
-function ensureSortedPerOrder(arr, sortPattern) {
-  const arrSet = new Set(arr);
-  return sortPattern.map((item) => {
-    if (arrSet.has(item)) {
-      return item;
-    }
-    return null;
-  }).filter((x) => x != null);
-}
+// src/components/types/CellPositionByIndex.ts
 function ensureMinMaxCellPositionByIndex(start, end) {
   let { rowIndex: startRowIndex, colIndex: startColIndex } = start;
   let { rowIndex: endRowIndex, colIndex: endColIndex } = end;
@@ -16197,6 +16188,64 @@ function ensureMinMaxCellPositionByIndex(start, end) {
     { rowIndex: rowEnd, colIndex: colEnd }
   ];
 }
+function isSamePage(startPosition, endPosition, options) {
+  const { rowsPerPage } = options;
+  return !rowsPerPage ? true : Math.floor(startPosition.rowIndex / rowsPerPage) === Math.floor(endPosition.rowIndex / rowsPerPage);
+}
+function getPositionsArrayForRangeInHorizontaLLayout(startPosition, endPosition, options) {
+  if (isSamePage(startPosition, endPosition, options)) {
+    throw "You should not call this when the positions are in the same page";
+  }
+  const { rowsPerPage, columnsPerSet } = options;
+  if (rowsPerPage === 0) {
+    throw "rowsPerPage cannot be 0";
+  }
+  let start = startPosition;
+  let end = endPosition;
+  if (Math.floor(startPosition.rowIndex / rowsPerPage) > Math.floor(endPosition.rowIndex / rowsPerPage)) {
+    start = endPosition;
+    end = startPosition;
+  }
+  let { rowIndex: startRowIndex, colIndex: startColIndex } = start;
+  let { rowIndex: endRowIndex, colIndex: endColIndex } = end;
+  const pageForStartRowIndex = Math.floor(startRowIndex / rowsPerPage);
+  const pageForEndRowIndex = Math.floor(endRowIndex / rowsPerPage);
+  const offsetForStartRowIndex = startRowIndex % rowsPerPage;
+  const offsetForEndRowIndex = endRowIndex % rowsPerPage;
+  const minOffset = Math.min(offsetForStartRowIndex, offsetForEndRowIndex);
+  const maxOffset = Math.max(offsetForStartRowIndex, offsetForEndRowIndex);
+  const positions = [];
+  for (let page = pageForStartRowIndex; page <= pageForEndRowIndex; page++) {
+    for (let offset = minOffset; offset <= maxOffset; offset++) {
+      const rowIndex = page * rowsPerPage + offset;
+      if (page === pageForStartRowIndex) {
+        for (let colIndex = startColIndex; colIndex < columnsPerSet; colIndex++) {
+          positions.push({ rowIndex, colIndex });
+        }
+      } else if (page === pageForEndRowIndex) {
+        for (let colIndex = 0; colIndex <= endColIndex; colIndex++) {
+          positions.push({ rowIndex, colIndex });
+        }
+      } else {
+        for (let colIndex = 0; colIndex < columnsPerSet; colIndex++) {
+          positions.push({ rowIndex, colIndex });
+        }
+      }
+    }
+  }
+  return positions;
+}
+
+// src/components/InfiniteTable/api/getCellSelectionApi.ts
+function ensureSortedPerOrder(arr, sortPattern) {
+  const arrSet = new Set(arr);
+  return sortPattern.map((item) => {
+    if (arrSet.has(item)) {
+      return item;
+    }
+    return null;
+  }).filter((x) => x != null);
+}
 var InfiniteTableCellSelectionApiImpl = class {
   constructor(param) {
     this.getCellSelectionPosition = (options) => {
@@ -18037,7 +18086,7 @@ var MultiCellSelector = class {
       this.multiSelectEndPosition = void 0;
     }
   }
-  multiSelectClick(position2) {
+  multiSelectClick(position2, options) {
     if (!this.multiSelectStartPosition) {
       return;
     }
@@ -18048,13 +18097,39 @@ var MultiCellSelector = class {
     if (this.multiSelectEndPosition) {
       this.deselectRange(
         this.multiSelectStartPosition,
-        this.multiSelectEndPosition
+        this.multiSelectEndPosition,
+        options
       );
     }
-    this.selectRange(this.multiSelectStartPosition, position2);
+    this.selectRange(this.multiSelectStartPosition, position2, options);
     this.multiSelectEndPosition = position2;
   }
-  setRangeSelected(startPosition, endPosition, selected) {
+  setRangeSelected(startPosition, endPosition, selected, options) {
+    if (options.horizontalLayout && !isSamePage(startPosition, endPosition, options)) {
+      const positions = getPositionsArrayForRangeInHorizontaLLayout(
+        startPosition,
+        endPosition,
+        {
+          rowsPerPage: options.rowsPerPage,
+          columnsPerSet: options.columnsPerSet
+        }
+      );
+      positions.forEach((position2) => {
+        const selectionPosition = this.getCellSelectionPosition({
+          rowIndex: position2.rowIndex,
+          colIndex: position2.colIndex
+        });
+        if (!selectionPosition) {
+          return;
+        }
+        if (selected) {
+          this.cellSelectionState.selectCell(...selectionPosition);
+        } else {
+          this.cellSelectionState.deselectCell(...selectionPosition);
+        }
+      });
+      return;
+    }
     const [start, end] = ensureMinMaxCellPositionByIndex(
       startPosition,
       endPosition
@@ -18081,11 +18156,11 @@ var MultiCellSelector = class {
       }
     }
   }
-  deselectRange(startPosition, endPosition) {
-    this.setRangeSelected(startPosition, endPosition, false);
+  deselectRange(startPosition, endPosition, options) {
+    this.setRangeSelected(startPosition, endPosition, false, options);
   }
-  selectRange(startPosition, endPosition) {
-    this.setRangeSelected(startPosition, endPosition, true);
+  selectRange(startPosition, endPosition, options) {
+    this.setRangeSelected(startPosition, endPosition, true, options);
   }
 };
 
@@ -20083,7 +20158,7 @@ var useLicense = (licenseKey = "") => {
     }
     let valid2 = isValidLicense(licenseKey, {
       publishedAt: 1624970570587,
-      version: "5.0.0"
+      version: "5.0.1"
     });
     if (!licenseKey && !valid2 && isInsidePlayground) {
       return true;
@@ -20195,6 +20270,7 @@ function onCellDoubleClick(context, _event) {
 function updateCellSelectionOnCellClick(context, event) {
   const {
     getDataSourceState,
+    getState,
     getComputed,
     rowIndex,
     colIndex,
@@ -20208,7 +20284,10 @@ function updateCellSelectionOnCellClick(context, event) {
   if (selectionMode !== "multi-cell") {
     return;
   }
-  const { multiCellSelector } = getComputed();
+  const { multiCellSelector, computedVisibleColumns } = getComputed();
+  const { brain } = getState();
+  const { rowsPerPage } = brain;
+  const columnsPerSet = computedVisibleColumns.length;
   const cellSelection = new CellSelectionState(existingCellSelection);
   multiCellSelector.cellSelectionState = cellSelection;
   const position2 = {
@@ -20218,7 +20297,17 @@ function updateCellSelectionOnCellClick(context, event) {
   if (event.metaKey || event.ctrlKey) {
     multiCellSelector.singleAddClick(position2);
   } else if (event.shiftKey) {
-    multiCellSelector.multiSelectClick(position2);
+    const horizontalLayout = !!getState().wrapRowsHorizontally;
+    multiCellSelector.multiSelectClick(
+      position2,
+      horizontalLayout ? {
+        horizontalLayout,
+        rowsPerPage,
+        columnsPerSet
+      } : {
+        horizontalLayout
+      }
+    );
   } else {
     multiCellSelector.resetClick(position2);
   }
@@ -23803,7 +23892,7 @@ function useHorizontalLayout() {
       } = getDataSourceState();
       let changes = false;
       const rowsPerPage = brain.rowsPerPage;
-      const newRowsPerPage = groupBy && groupBy.length > 0 ? rowsPerPage : null;
+      const newRowsPerPage = groupBy && groupBy.length > 0 && rowsPerPage > 0 ? rowsPerPage : null;
       if (currentRowsPerPage != newRowsPerPage) {
         dataSourceActions.rowsPerPage = newRowsPerPage;
         changes = true;

package/package.json

@@ -25,7 +25,7 @@
   "bugs": {
     "url": "https://github.com/infinite-table/infinite-react/issues"
   },
-  "version": "5.0.0",
+  "version": "5.0.1",
   "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": 1728398746086
+  "publishedAt": 1728477164758
 }