2840 feature disable scroll when click cell

common/changes/@visactor/vtable/2840-feature-disable-scroll-when-click-cell_2024-11-21-06-08.json

@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "feat: add select makeSelectCellVisible #2840\n\n",
+      "type": "none",
+      "packageName": "@visactor/vtable"
+    }
+  ],
+  "packageName": "@visactor/vtable",
+  "email": "[email protected]"
+}

packages/vtable/src/core/BaseTable.ts

@@ -2599,7 +2599,7 @@ export abstract class BaseTable extends EventTarget implements BaseTableAPI {
     row: number,
     isShift?: boolean,
     isCtrl?: boolean,
-    makeSelectCellVisible: boolean = true,
+    makeSelectCellVisible?: boolean,
     skipBodyMerge: boolean = false,
     forceSelect: boolean = false
   ) {
@@ -2610,7 +2610,7 @@ export abstract class BaseTable extends EventTarget implements BaseTableAPI {
       isShift,
       isCtrl,
       false,
-      !makeSelectCellVisible,
+      makeSelectCellVisible ?? this.options.select?.makeSelectCellVisible ?? true,
       skipBodyMerge,
       forceSelect
     );
@@ -2630,7 +2630,7 @@ export abstract class BaseTable extends EventTarget implements BaseTableAPI {
           false,
           index >= 1,
           false,
-          false,
+          this.options.select?.makeSelectCellVisible ?? true,
           true
         );
       } else {
@@ -2640,11 +2640,19 @@ export abstract class BaseTable extends EventTarget implements BaseTableAPI {
           false,
           index >= 1,
           false,
-          false,
+          this.options.select?.makeSelectCellVisible ?? true,
           true
         );
         this.stateManager.updateInteractionState(InteractionState.grabing);
-        this.stateManager.updateSelectPos(cellRange.end.col, cellRange.end.row, false, index >= 1, false, false, true);
+        this.stateManager.updateSelectPos(
+          cellRange.end.col,
+          cellRange.end.row,
+          false,
+          index >= 1,
+          false,
+          this.options.select?.makeSelectCellVisible ?? true,
+          true
+        );
       }
       this.stateManager.endSelectCells(false, false);
       this.stateManager.updateInteractionState(InteractionState.default);

packages/vtable/src/event/event.ts

@@ -298,7 +298,7 @@ export class EventManager {
         eventArgs.event.shiftKey,
         eventArgs.event.ctrlKey || eventArgs.event.metaKey,
         false,
-        isSelectMoving
+        this.table.options.select?.makeSelectCellVisible ?? true
       );
 
       return true;
@@ -357,7 +357,7 @@ export class EventManager {
           true,
           eventArgs.event.ctrlKey || eventArgs.event.metaKey,
           false,
-          isSelectMoving
+          !isSelectMoving
         );
       } else {
         this.table.stateManager.updateSelectPos(
@@ -366,7 +366,7 @@ export class EventManager {
           eventArgs.event.shiftKey,
           eventArgs.event.ctrlKey || eventArgs.event.metaKey,
           false,
-          isSelectMoving
+          !isSelectMoving
         );
       }
       return true;

packages/vtable/src/event/listener/container-dom.ts

@@ -776,7 +776,7 @@ export function bindContainerDomListener(eventManager: EventManager) {
           const targetCol = table.getTargetColAtConsiderRightFrozen(selectX, considerFrozenX);
           const targetRow = table.getTargetRowAtConsiderBottomFrozen(selectY, considerFrozenY);
           if (isValid(targetCol) && isValid(targetRow)) {
-            table.stateManager.updateSelectPos(targetCol.col, targetRow.row, false, false, false, true);
+            table.stateManager.updateSelectPos(targetCol.col, targetRow.row, false, false, false, false);
           }
         });
       } else if (table.eventManager.inertiaScroll.isInertiaScrolling()) {

packages/vtable/src/state/select/update-position.ts

@@ -18,7 +18,7 @@ export function updateSelectPosition(
   isShift: boolean,
   isCtrl: boolean,
   isSelectAll: boolean,
-  isSelectMoving: boolean = false,
+  makeSelectCellVisible: boolean = true,
   skipBodyMerge: boolean = false,
   forceSelect: boolean = false
 ) {
@@ -27,7 +27,7 @@ export function updateSelectPosition(
   const { highlightScope, disableHeader, cellPos } = state.select;
 
   if (((disableHeader && table.isHeader(col, row)) || highlightScope === 'none') && forceSelect === false) {
-    if (col !== -1 && row !== -1 && !isSelectMoving) {
+    if (col !== -1 && row !== -1 && makeSelectCellVisible) {
       table._makeVisibleCell(col, row);
     }
     col = -1;
@@ -38,7 +38,7 @@ export function updateSelectPosition(
   //   return;
   // }
   /** 完整显示选中单元格 自动滚动效果*/
-  if (col !== -1 && row !== -1 && !isSelectMoving) {
+  if (col !== -1 && row !== -1 && makeSelectCellVisible) {
     if (interactionState === InteractionState.grabing && state.select.ranges.length > 0) {
       const currentRange = state.select.ranges[state.select.ranges.length - 1];
       if (col > currentRange.start.col && col > currentRange.end.col) {

packages/vtable/src/state/state.ts

@@ -597,14 +597,24 @@ export class StateManager {
     isShift: boolean = false,
     isCtrl: boolean = false,
     isSelectAll: boolean = false,
-    isSelectMoving: boolean = false,
+    makeSelectCellVisible: boolean = true,
     skipBodyMerge: boolean = false,
     forceSelect: boolean = false
   ) {
     if (row !== -1 && row !== -1) {
       this.select.selecting = true;
     }
-    updateSelectPosition(this, col, row, isShift, isCtrl, isSelectAll, isSelectMoving, skipBodyMerge, forceSelect);
+    updateSelectPosition(
+      this,
+      col,
+      row,
+      isShift,
+      isCtrl,
+      isSelectAll,
+      makeSelectCellVisible,
+      skipBodyMerge,
+      forceSelect
+    );
   }
 
   checkCellRangeInSelect(cellPosStart: CellAddress, cellPosEnd: CellAddress) {

packages/vtable/src/ts-types/base-table.ts

@@ -377,6 +377,8 @@ export interface BaseTableConstructorOptions {
     disableDragSelect?: boolean;
     /** 是否在选择多行或多列时高亮范围 */
     highlightInRange?: boolean;
+    /** 是否将选中的单元格自动滚动到视口内 默认为true */
+    makeSelectCellVisible?: boolean;
   };
   /** 下拉菜单的相关配置。消失时机：显示后点击菜单区域外自动消失*/
   menu?: {