@kdcloudjs/table 1.2.2-canary.13 → 1.2.2-canary.14-hotfix

package/es/table/pipeline/features/columnResizeWidth.js

@@ -12,6 +12,7 @@ import { mergeCellProps, collectNodes, makeRecursiveMapper, isGroupColumn } from
 import { internals } from '../../internals';
 import { Classes } from '../../base/styles';
 import { swapRTLDirection } from '../../base/utils';
+import { getEventCoordinates } from './utils/touchEventUtils';
 var TableHeaderCellResize = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  ", ": -5px;\n  height: 100%;\n  width: 10px;\n  cursor: ew-resize;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  z-index:1;\n\n  &:after {\n    content: \"\";\n    position: absolute;\n    display: block;\n    ", ": calc(50% - 1px);\n    width: 1px;\n    height: calc(100% - 14px);\n    top: 7px;\n  }\n"])), function (props) {
   return swapRTLDirection(props.direction, 'right');
 }, function (props) {
@@ -65,10 +66,12 @@ export function columnResize() {
       var _a;
       (_a = opts.doubleClickCallback) === null || _a === void 0 ? void 0 : _a.call(opts, e, col);
     };
-    var handleMouseDown = function handleMouseDown(e, col) {
+    // 通用的拖拽处理逻辑
+    var handleResize = function handleResize(startEvent, col, eventType) {
       window.addEventListener('selectstart', disableSelect);
       var changedColumnSize = {};
-      var startX = e.clientX;
+      var startCoordinates = getEventCoordinates(startEvent);
+      var startX = startCoordinates.clientX;
       var children = col.children,
         code = col.code,
         _col$features = col.features,
@@ -79,9 +82,22 @@ export function columnResize() {
       var realMaxSize = typeof maxWidth === 'number' ? maxWidth : maxSize;
       var columnSize = pipeline.getFeatureOptions(COLUMN_SIZE_KEY);
       var recordColumnSize = columnSize;
-      e.stopPropagation();
-      var nextSize$ = fromEvent(window, 'mousemove').pipe(op.takeUntil(fromEvent(window, 'mouseup')), op.map(function (e) {
-        var movingX = e.clientX;
+      // 根据事件类型选择不同的事件监听器
+      var moveEventName = eventType === 'mouse' ? 'mousemove' : 'touchmove';
+      var endEventName = eventType === 'mouse' ? 'mouseup' : 'touchend';
+      var moveEventOptions = eventType === 'touch' ? {
+        passive: false
+      } : undefined;
+      var endEventOptions = eventType === 'touch' ? {
+        passive: false
+      } : undefined;
+      var nextSize$ = fromEvent(window, moveEventName, moveEventOptions).pipe(op.takeUntil(fromEvent(window, endEventName, endEventOptions)), op.map(function (e) {
+        // 触摸事件需要阻止默认行为，防止页面滚动
+        if (eventType === 'touch' && e.cancelable) {
+          e.preventDefault();
+        }
+        var coordinates = getEventCoordinates(e);
+        var movingX = coordinates.clientX;
         var nextColumnSize = _extends({}, columnSize);
         var deltaSum = pipeline.ctx.direction === 'rtl' ? startX - movingX : movingX - startX;
         var deltaRemaining = deltaSum;
@@ -139,6 +155,19 @@ export function columnResize() {
         }
       });
     };
+    var handleMouseDown = function handleMouseDown(e, col) {
+      e.stopPropagation();
+      handleResize(e.nativeEvent, col, 'mouse');
+    };
+    // 触摸事件处理函数
+    var handleTouchStart = function handleTouchStart(e, col) {
+      // 阻止触摸事件的默认行为
+      if (e.cancelable) {
+        e.preventDefault();
+      }
+      e.stopPropagation();
+      handleResize(e.nativeEvent, col, 'touch');
+    };
     var isGroup = isGroupColumn(pipeline.getColumns());
     return pipeline.mapColumns(makeRecursiveMapper(function (col) {
       var _a;
@@ -156,6 +185,9 @@ export function columnResize() {
           },
           onMouseDown: function onMouseDown(e) {
             return handleMouseDown(e, col);
+          },
+          onTouchStart: function onTouchStart(e) {
+            return handleTouchStart(e, col);
           }
         }) : /*#__PURE__*/React.createElement(TableHeaderCellResize, {
           direction: pipeline.ctx.direction,
@@ -165,6 +197,9 @@ export function columnResize() {
           },
           onMouseDown: function onMouseDown(e) {
             return handleMouseDown(e, col);
+          },
+          onTouchStart: function onTouchStart(e) {
+            return handleTouchStart(e, col);
           }
         }))),
         headerCellProps: mergeCellProps(col.headerCellProps, {

package/es/table/pipeline/features/rowDrag.js

@@ -10,6 +10,7 @@ import cx from 'classnames';
 import { Classes } from '../../base/styles';
 import { FeatureName } from '../const';
 import { internals } from '../../internals';
+import { getEventCoordinates, getEventTarget } from './utils/touchEventUtils';
 export var ROW_DRAG_COLUMN_CODE = '$_row_drag_column_&';
 export var rowDragKey = 'rowDragKey';
 export var rowDragOptionsKey = 'rowDragOptions';
@@ -29,15 +30,14 @@ var defaultRowDragColumn = {
   },
   render: function render(value, row, rowIndex) {
     return /*#__PURE__*/React.createElement("svg", {
-      viewBox: '0 0 1024 1024',
-      version: '1.1',
-      xmlns: 'http://www.w3.org/1999/xlink',
-      "data-icon": 'drag',
-      width: '16',
-      height: '16'
+      viewBox: "0 0 1024 1024",
+      version: "1.1",
+      xmlns: "http://www.w3.org/1999/xlink",
+      "data-icon": "drag",
+      width: "16",
+      height: "16"
     }, /*#__PURE__*/React.createElement("path", {
-      d: 'M298.688 192a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m298.624 0a64 64 0 1 0 128 0 64 64 0 0 0-128 0zM298.688 512a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m298.624 0a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m-298.624 320a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m298.624 0a64 64 0 1 0 128 0 64 64 0 0 0-128 0z',
-      "p-id": '4278'
+      d: "M298.688 192a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m298.624 0a64 64 0 1 0 128 0 64 64 0 0 0-128 0zM298.688 512a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m298.624 0a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m-298.624 320a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m298.624 0a64 64 0 1 0 128 0 64 64 0 0 0-128 0z"
     }));
   }
 };
@@ -67,19 +67,19 @@ export function rowDrag(opt) {
       var treeModeOptions = getTreeModeOptions();
       var rowDragOptions = getRowDragOptions();
       var allowDragIntoRow = !!treeModeOptions && (rowDragOptions === null || rowDragOptions === void 0 ? void 0 : rowDragOptions.allowDragIntoRow);
-      var isLeave = !isMouseOnDropTarget(event, dropZoneTarget);
+      var isLeave = !isPointerOnDropTarget(event, dropZoneTarget);
       var overIndex = -1;
       var direction = 'bottom';
       if (!isLeave && dataSource.length > 0) {
-        var overDragItem = getDragRowItem(event.target, dropZoneTarget, dataSource);
+        var overDragItem = getDragRowItem(getEventTarget(event), dropZoneTarget, dataSource);
         if (overDragItem) {
           var rowIndex = overDragItem.rowIndex,
             cell = overDragItem.cell;
           overIndex = rowIndex;
-          direction = getDirection(cell, event.clientY, allowDragIntoRow);
+          direction = getDirection(cell, getEventCoordinates(event).clientY, allowDragIntoRow);
         }
       }
-      if (overIndex === -1 && dataSource.length > 0 && dropZoneTarget.contains(event.target)) {
+      if (overIndex === -1 && dataSource.length > 0 && dropZoneTarget.contains(getEventTarget(event))) {
         overIndex = dataSource.length - 1;
         direction = 'bottom';
       }
@@ -155,9 +155,25 @@ export function rowDrag(opt) {
       }
     };
     var onMouseDown = function onMouseDown(event) {
+      handlePointerDown(event.nativeEvent);
+    };
+    // PC 单据移动端显示，兼容移动端的拖拽事件
+    var onTouchStart = function onTouchStart(event) {
+      // 尝试阻止触摸事件的默认行为，防止页面滚动
+      try {
+        if (event.cancelable) {
+          event.preventDefault();
+        }
+      } catch (error) {
+        // 忽略passive event listener错误
+        console.warn('preventDefault failed in passive touch event listener');
+      }
+      handlePointerDown(event.nativeEvent);
+    };
+    // 统一的拖拽处理函数
+    var handlePointerDown = function handlePointerDown(startEvent) {
       var _a;
-      var mouseDownEvent = event.nativeEvent;
-      var startDataItem = getDragRowItem(mouseDownEvent.target, tableBody, dataSource);
+      var startDataItem = getDragRowItem(getEventTarget(startEvent), tableBody, dataSource);
       if (!startDataItem || startDataItem.code !== rowDragColumn.code) return;
       if ((_a = opt === null || opt === void 0 ? void 0 : opt.isDisabled) === null || _a === void 0 ? void 0 : _a.call(opt, startDataItem.row, startDataItem.rowIndex)) return;
       var isValidDrag = false;
@@ -169,7 +185,7 @@ export function rowDrag(opt) {
       var intervalId = null;
       var expandRowTimeoutId = null;
       var expandRowCallBackList = [];
-      var updateScrollPosition = function updateScrollPosition(tableBody, mouseMoveEvent) {
+      var updateScrollPosition = function updateScrollPosition(tableBody, moveEvent) {
         if (opt === null || opt === void 0 ? void 0 : opt.suppressScrollMove) return;
         if (timeoutId) {
           clearTimeout(timeoutId);
@@ -178,7 +194,7 @@ export function rowDrag(opt) {
           clearInterval(intervalId);
         }
         if (!tableBody) return;
-        var moveOffset = getScrollMoveOffset(tableBody, mouseMoveEvent);
+        var moveOffset = getScrollMoveOffset(tableBody, moveEvent);
         if (moveOffset === 0) {
           return;
         }
@@ -188,30 +204,53 @@ export function rowDrag(opt) {
           }, 50);
         }, 500);
       };
-      var handleDragStart = function handleDragStart(mouseDownEvent) {
+      var handleDragStart = function handleDragStart(event) {
         var _a;
-        dragElement = createDragElement(mouseDownEvent, tableBody); // 创建拖拽悬浮框
+        // 屏蔽默认事件，防止文本选择、框选等
+        try {
+          if (event.cancelable) {
+            event.preventDefault();
+          }
+        } catch (error) {
+          // 忽略passive event listener错误
+          console.warn('preventDefault failed in passive event listener');
+        }
+        // 禁用页面的文本选择
+        document.body.style.userSelect = 'none';
+        document.body.style.webkitUserSelect = 'none';
+        // 添加拖拽状态的CSS类，可以在样式中进一步控制
+        document.body.classList.add('row-dragging');
+        dragElement = createDragElement(event, tableBody); // 创建拖拽悬浮框
         var isTreeTable = !!pipeline.getFeatureOptions('treeModeOptions');
         dragLine = createDragLine(isTreeTable); // 创建拖拽插入指示线
         var dragText = (opt === null || opt === void 0 ? void 0 : opt.rowDragText) ? (_a = opt === null || opt === void 0 ? void 0 : opt.rowDragText) === null || _a === void 0 ? void 0 : _a.call(opt, startDataItem.row, startDataItem.rowIndex) : "\u7B2C".concat(startDataItem.rowIndex, "\u884C\u5185\u5BB9");
         setDragText(dragElement, dragText); // 设置悬浮框显示文本
         artTable.classList.add(cx(Classes.rowDragging));
         rowDragApi.setDragStatus('start');
-        var dragEvent = createDropTargetEvent(currentDropZone, mouseDownEvent, startDataItem, currentDropZone);
+        var dragEvent = createDropTargetEvent(currentDropZone, event, startDataItem, currentDropZone);
         onDragStart(dragEvent);
       };
-      var handleDragMove = function handleDragMove(mouseMoveEvent) {
+      var handleDragMove = function handleDragMove(moveEvent) {
         var _a;
+        // 尝试屏蔽默认事件，在passive监听器中可能会失败
+        try {
+          if (moveEvent.cancelable) {
+            moveEvent.preventDefault();
+          }
+        } catch (error) {
+          // 忽略passive event listener错误
+          console.warn('preventDefault failed in passive event listener');
+        }
         var isRTL = pipeline.ctx.direction === 'rtl';
-        positionDragElemment(dragElement, mouseMoveEvent, isRTL); // 更新拖拽悬浮框位置
+        positionDragElemment(dragElement, moveEvent, isRTL); // 更新拖拽悬浮框位置
         rowDragApi.setDragStatus('dragging');
         setDragElementIcon(dragElement, 'move');
         var rowDropZones = rowDragApi.getRowDropZone();
         var validDropZones = _concatInstanceProperty(rowDropZones).call(rowDropZones, currentDropZone); // 可放置区域加上自身
         var dropTarget = _findInstanceProperty(validDropZones).call(validDropZones, function (zone) {
-          return isMouseOnDropTarget(mouseMoveEvent, zone.getContainer());
+          return isPointerOnDropTarget(moveEvent, zone.getContainer());
         }) || null;
-        updateScrollPosition(dropTarget === null || dropTarget === void 0 ? void 0 : dropTarget.getContainer(), mouseMoveEvent); // 拖拽到底时让滚动条可以滚动
+        updateScrollPosition(dropTarget === null || dropTarget === void 0 ? void 0 : dropTarget.getContainer(), moveEvent); // 拖拽到底时让滚动条可以滚动
         if (dropTarget !== lastDropTarget) {
           // 拖拽离开表格
           if (lastDropTarget !== null && dropTarget === null) {
@@ -219,7 +258,7 @@ export function rowDrag(opt) {
               setDragElementIcon(dragElement, 'notAllowed');
               hiddenDragLine(dragLine);
               lastDropTarget.getContainer().classList.remove(Classes.rowDragNoData);
-              var dragEvent = createDropTargetEvent(lastDropTarget, mouseMoveEvent, startDataItem, currentDropZone);
+              var dragEvent = createDropTargetEvent(lastDropTarget, moveEvent, startDataItem, currentDropZone);
               lastDropTarget.onDragLeave(dragEvent);
             }
           }
@@ -239,7 +278,7 @@ export function rowDrag(opt) {
                   dragLine.classList.remove(Classes.treeTableRowDragLine);
                 }
               }
-              var _dragEvent = createDropTargetEvent(dropTarget, mouseMoveEvent, startDataItem, currentDropZone);
+              var _dragEvent = createDropTargetEvent(dropTarget, moveEvent, startDataItem, currentDropZone);
               dropTarget.onDragEnter(_dragEvent);
             }
           }
@@ -251,7 +290,7 @@ export function rowDrag(opt) {
             positionDragLine({
               lineElement: dragLine,
               dragZone: dropTarget,
-              event: mouseMoveEvent,
+              event: moveEvent,
               isRTL: isRTL
             });
           }
@@ -268,7 +307,7 @@ export function rowDrag(opt) {
                 onCollapse = treeModeOptions.onCollapse;
               // 鼠标悬停所在的拖拽行信息
               var dataSource = dropTarget.tableParams.getDataSource();
-              var dragItem = getDragRowItem(mouseMoveEvent.target, dropTarget.getContainer(), dataSource);
+              var dragItem = getDragRowItem(getEventTarget(moveEvent), dropTarget.getContainer(), dataSource);
               if (!dragItem) return;
               var row = dragItem.row;
               var _row$treeMetaKey = row[treeMetaKey],
@@ -283,15 +322,20 @@ export function rowDrag(opt) {
             }, 1000);
           }
           if (dropTarget.onDragging) {
-            var _dragEvent2 = createDropTargetEvent(dropTarget, mouseMoveEvent, startDataItem, currentDropZone);
+            var _dragEvent2 = createDropTargetEvent(dropTarget, moveEvent, startDataItem, currentDropZone);
             dropTarget.onDragging(_dragEvent2);
           }
         }
       };
-      var handleDragStop = function handleDragStop(mouseUpEvent) {
+      var handleDragStop = function handleDragStop(endEvent) {
         if (!isValidDrag) {
           return;
         }
+        // 恢复默认的文本选择功能
+        document.body.style.userSelect = '';
+        document.body.style.webkitUserSelect = '';
+        // 移除拖拽状态的CSS类
+        document.body.classList.remove('row-dragging');
         removeElement(dragElement);
         removeElement(dragLine);
         artTable.classList.remove(cx(Classes.rowDragging));
@@ -306,10 +350,10 @@ export function rowDrag(opt) {
         });
         var validDropZones = _concatInstanceProperty(rowDropZones).call(rowDropZones, currentDropZone);
         var dropTarget = _findInstanceProperty(validDropZones).call(validDropZones, function (zone) {
-          return isMouseOnDropTarget(mouseUpEvent, zone.getContainer());
+          return isPointerOnDropTarget(endEvent, zone.getContainer());
         });
         if (dropTarget && dropTarget.onDragStop) {
-          var dragEvent = createDropTargetEvent(dropTarget, mouseUpEvent, startDataItem, currentDropZone);
+          var dragEvent = createDropTargetEvent(dropTarget, endEvent, startDataItem, currentDropZone);
           dropTarget.onDragStop(dragEvent);
         }
         while (expandRowCallBackList.length > 0) {
@@ -317,32 +361,73 @@ export function rowDrag(opt) {
           callback();
         }
       };
-      var mousemove$ = fromEvent(window, 'mousemove');
-      var mouseup$ = fromEvent(window, 'mouseup');
-      var rowDragMove$ = mousemove$.pipe(filter(function (mouseMoveEvent) {
-        var mouseMoveClientY = mouseMoveEvent.clientY;
-        var mouseDownClientY = mouseDownEvent.clientY;
-        // 上下移动偏移量大于5才是有效的拖拽
-        if (Math.abs(mouseMoveClientY - mouseDownClientY) > 5) {
-          isValidDrag = true;
-        }
-        return isValidDrag;
-      }), map(function (mouseMoveEvent) {
-        if (!isDragging) {
-          isDragging = true;
-          handleDragStart(mouseDownEvent);
-          handleDragMove(mouseDownEvent);
-        }
-        handleDragMove(mouseMoveEvent);
-      }), takeUntil(mouseup$));
-      rowDragMove$.subscribe();
-      var rowDragEnd$ = mouseup$.pipe(map(function (mouseUpEvent) {
-        handleDragStop(mouseUpEvent);
-      })).subscribe({
-        next: function next() {
-          rowDragEnd$.unsubscribe();
-        }
-      });
+      // 判断是鼠标事件还是触摸事件，分别监听对应的移动和结束事件
+      var isTouchEvent = ('touches' in startEvent);
+      if (isTouchEvent) {
+        // 触摸事件处理
+        var touchmove$ = fromEvent(window, 'touchmove', {
+          passive: false
+        });
+        var touchend$ = fromEvent(window, 'touchend', {
+          passive: false
+        });
+        var touchDragMove$ = touchmove$.pipe(filter(function (moveEvent) {
+          var coordinates = getEventCoordinates(moveEvent);
+          var startCoordinates = getEventCoordinates(startEvent);
+          var moveClientY = coordinates.clientY;
+          var startClientY = startCoordinates.clientY;
+          // 上下移动偏移量大于5才是有效的拖拽
+          if (Math.abs(moveClientY - startClientY) > 5) {
+            isValidDrag = true;
+          }
+          return isValidDrag;
+        }), map(function (moveEvent) {
+          if (!isDragging) {
+            isDragging = true;
+            handleDragStart(startEvent);
+            handleDragMove(startEvent);
+          }
+          handleDragMove(moveEvent);
+        }), takeUntil(touchend$));
+        touchDragMove$.subscribe();
+        var touchDragEnd$ = touchend$.pipe(map(function (endEvent) {
+          handleDragStop(endEvent);
+        })).subscribe({
+          next: function next() {
+            touchDragEnd$.unsubscribe();
+          }
+        });
+      } else {
+        // 鼠标事件处理
+        var mousemove$ = fromEvent(window, 'mousemove');
+        var mouseup$ = fromEvent(window, 'mouseup');
+        var rowDragMove$ = mousemove$.pipe(filter(function (moveEvent) {
+          var coordinates = getEventCoordinates(moveEvent);
+          var startCoordinates = getEventCoordinates(startEvent);
+          var moveClientY = coordinates.clientY;
+          var startClientY = startCoordinates.clientY;
+          // 上下移动偏移量大于5才是有效的拖拽
+          if (Math.abs(moveClientY - startClientY) > 5) {
+            isValidDrag = true;
+          }
+          return isValidDrag;
+        }), map(function (moveEvent) {
+          if (!isDragging) {
+            isDragging = true;
+            handleDragStart(startEvent);
+            handleDragMove(startEvent);
+          }
+          handleDragMove(moveEvent);
+        }), takeUntil(mouseup$));
+        rowDragMove$.subscribe();
+        var rowDragEnd$ = mouseup$.pipe(map(function (endEvent) {
+          handleDragStop(endEvent);
+        })).subscribe({
+          next: function next() {
+            rowDragEnd$.unsubscribe();
+          }
+        });
+      }
     };
     var rowDragColumn = (opt === null || opt === void 0 ? void 0 : opt.rowDragColumn) || defaultRowDragColumn;
     pipeline.setFeatureOptions('rowDragColumnKey', rowDragColumn.code);
@@ -351,7 +436,8 @@ export function rowDrag(opt) {
     nextColumns.unshift(rowDragColumn);
     pipeline.columns(nextColumns);
     pipeline.addTableProps({
-      onMouseDown: onMouseDown
+      onMouseDown: onMouseDown,
+      onTouchStart: onTouchStart
     });
     pipeline.appendRowPropsGetter(function (row, rowIndex) {
       var _cx;
@@ -421,13 +507,13 @@ function isEleInFooter(target) {
   }
   return false;
 }
-function createDragElement(mouseDownEvent, tableBody) {
+function createDragElement(event, tableBody) {
   var _context3, _context4;
   var ELEMENT_TEMPLATE = _concatInstanceProperty(_context3 = _concatInstanceProperty(_context4 = "<div class='".concat(Classes.rowDragElement, "'>\n      <span class='")).call(_context4, Classes.rowDragElementIcon, "'></span>\n      <div class='")).call(_context3, Classes.rowDragElementLabel, "'></div>\n    </div>");
   var element = document.createElement('div');
   element.innerHTML = ELEMENT_TEMPLATE;
   var dragElement = element.firstChild;
-  var targetRow = findTargetRow(mouseDownEvent.target, tableBody);
+  var targetRow = findTargetRow(getEventTarget(event), tableBody);
   if (targetRow) {
     var rect = targetRow.getBoundingClientRect();
     dragElement.style.height = rect.height + 'px';
@@ -472,9 +558,9 @@ function positionDragLine(_ref) {
     lineElement.style.display = 'block';
   }
   // 鼠标悬停所在的拖拽行信息
-  var dragItem = getDragRowItem(event.target, tableContainer, dataSource);
+  var dragItem = getDragRowItem(getEventTarget(event), tableContainer, dataSource);
   if (!dragItem) {
-    if (dataSource.length > 0 && tableContainer.contains(event.target)) {
+    if (dataSource.length > 0 && tableContainer.contains(getEventTarget(event))) {
       var _context5, _context6;
       var _rowIndex = dataSource.length - 1;
       var _row = dataSource[_rowIndex];
@@ -503,7 +589,7 @@ function positionDragLine(_ref) {
     rowIndex = dragItem.rowIndex,
     row = dragItem.row;
   var allowDragInto = isTreeTable && allowDragIntoRow;
-  var direction = getDirection(cell, event.clientY, allowDragInto);
+  var direction = getDirection(cell, getEventCoordinates(event).clientY, allowDragInto);
   var targetCell = isTreeTable ? tableContainer.querySelector(_concatInstanceProperty(_context7 = "tr[data-rowindex=\"".concat(rowIndex, "\"] .")).call(_context7, Classes.tableExtendCell)) : cell;
   if (!targetCell) return;
   var _getLinePosition2 = getLinePosition({
@@ -541,8 +627,9 @@ function positionDragElemment(element, event, isRTL) {
   var browserWidth = (_b = (_a = document.body) === null || _a === void 0 ? void 0 : _a.clientWidth) !== null && _b !== void 0 ? _b : window.innerHeight || ((_c = document.documentElement) === null || _c === void 0 ? void 0 : _c.clientWidth) || 0;
   var browserHeight = (_e = (_d = document.body) === null || _d === void 0 ? void 0 : _d.clientHeight) !== null && _e !== void 0 ? _e : window.innerHeight || ((_f = document.documentElement) === null || _f === void 0 ? void 0 : _f.clientHeight) || 0;
   var offsetParentSize = getElementRectWithOffset(element.offsetParent);
-  var clientX = event.clientX,
-    clientY = event.clientY;
+  var _getEventCoordinates = getEventCoordinates(event),
+    clientX = _getEventCoordinates.clientX,
+    clientY = _getEventCoordinates.clientY;
   var top = clientY - offsetParentSize.top - eleHeight / 2;
   var left = clientX - offsetParentSize.left;
   var right = Math.max(browserWidth - clientX, 0);
@@ -558,12 +645,11 @@ function positionDragElemment(element, event, isRTL) {
     right = Math.max(browserWidth + windowScrollX - element.clientWidth, 0);
   }
   if (isRTL) {
-    var _context8;
-    element.style.cssText += _concatInstanceProperty(_context8 = ";right: ".concat(right, "px; top: ")).call(_context8, top, "px;");
-    return;
+    element.style.right = right + 'px';
+  } else {
+    element.style.left = left + 'px';
   }
-  element.style.left = "".concat(left, "px");
-  element.style.top = "".concat(top, "px");
+  element.style.top = top + 'px';
 }
 function getElementRectWithOffset(el) {
   var offsetElementRect = el.getBoundingClientRect();
@@ -630,12 +716,13 @@ function setDragElementIcon(element, iconName) {
   elementIcon.appendChild(iconElement);
 }
 function clearElementChildren(element) {
-  while (element && element.firstChild) {
+  while (element === null || element === void 0 ? void 0 : element.firstChild) {
     element.removeChild(element.firstChild);
   }
 }
-function getScrollMoveOffset(tableBody, mouseMoveEvent) {
-  var clientY = mouseMoveEvent.clientY;
+function getScrollMoveOffset(tableBody, moveEvent) {
+  var _getEventCoordinates2 = getEventCoordinates(moveEvent),
+    clientY = _getEventCoordinates2.clientY;
   var tableBodyClientRect = tableBody.getBoundingClientRect();
   var top = tableBodyClientRect.top,
     height = tableBodyClientRect.height;
@@ -653,15 +740,19 @@ function setDragText(element, dragText) {
   var stringNode = document.createTextNode(dragTextString);
   elementIcon.appendChild(stringNode);
 }
-function isMouseOnDropTarget(mouseEvent, target) {
-  return target.contains(mouseEvent.target);
+function isPointerOnDropTarget(pointerEvent, target) {
+  var eventTarget = getEventTarget(pointerEvent);
+  return target.contains(eventTarget);
 }
 function createDropTargetEvent(dropZone, event, dragItem, startDropZone) {
   var dropZoneTarget = dropZone.getContainer();
   var startDropZoneTagret = startDropZone.getContainer();
   var rect = dropZoneTarget.getBoundingClientRect();
-  var x = event.clientX - rect.left;
-  var y = event.clientY - rect.top;
+  var _getEventCoordinates3 = getEventCoordinates(event),
+    clientX = _getEventCoordinates3.clientX,
+    clientY = _getEventCoordinates3.clientY;
+  var x = clientX - rect.left;
+  var y = clientY - rect.top;
   var startDropZoneOptions = startDropZone.tableParams.getRowDragOptions();
   var startCommonParams = startDropZoneOptions === null || startDropZoneOptions === void 0 ? void 0 : startDropZoneOptions.commonParams;
   var targetEvent = {
@@ -718,10 +809,8 @@ var getLinePosition = function getLinePosition(_ref2) {
       paddingRight = _getElementSize3.paddingRight;
     var expandCellRect = cell.getBoundingClientRect();
     var _row$treeMetaKey2 = row[treeMetaKey],
-      rowKey = _row$treeMetaKey2.rowKey,
       depth = _row$treeMetaKey2.depth,
-      isLeaf = _row$treeMetaKey2.isLeaf,
-      expanded = _row$treeMetaKey2.expanded;
+      isLeaf = _row$treeMetaKey2.isLeaf;
     var addWidth = isLeaf ? iconWidth + iconGap : 0;
     var indent = iconIndent + depth * indentSize + addWidth;
     var x = expandCellRect.x,

package/es/table/pipeline/features/utils/touchEventUtils.d.ts

@@ -0,0 +1,15 @@
+export declare function getEventCoordinates(event: MouseEvent | TouchEvent): {
+    clientX: number;
+    clientY: number;
+};
+export declare function getEventTarget(event: MouseEvent | TouchEvent): EventTarget;
+export declare function isTouchEvent(event: MouseEvent | TouchEvent): event is TouchEvent;
+export declare function addPointerEventListeners(element: Element | Window | Document, handlers: {
+    onPointerMove: (e: MouseEvent | TouchEvent) => void;
+    onPointerUp: (e: MouseEvent | TouchEvent) => void;
+}, isTouchStart: boolean): void;
+export declare function removePointerEventListeners(element: Element | Window | Document, handlers: {
+    onPointerMove: (e: MouseEvent | TouchEvent) => void;
+    onPointerUp: (e: MouseEvent | TouchEvent) => void;
+}, isTouchStart: boolean): void;
+export declare function hasMovedEnough(startX: number, startY: number, endX: number, endY: number, threshold?: number): boolean;

package/es/table/pipeline/features/utils/touchEventUtils.js

@@ -0,0 +1,65 @@
+// 统一获取事件坐标的函数
+export function getEventCoordinates(event) {
+  if ('touches' in event && event.touches.length > 0) {
+    return {
+      clientX: event.touches[0].clientX,
+      clientY: event.touches[0].clientY
+    };
+  } else if ('changedTouches' in event && event.changedTouches.length > 0) {
+    return {
+      clientX: event.changedTouches[0].clientX,
+      clientY: event.changedTouches[0].clientY
+    };
+  } else {
+    return {
+      clientX: event.clientX,
+      clientY: event.clientY
+    };
+  }
+}
+// 获取事件目标元素
+export function getEventTarget(event) {
+  if ('touches' in event && event.touches.length > 0) {
+    return document.elementFromPoint(event.touches[0].clientX, event.touches[0].clientY);
+  }
+  // 处理touchend事件，此时touches为空，需要使用changedTouches
+  if ('changedTouches' in event && event.changedTouches.length > 0) {
+    return document.elementFromPoint(event.changedTouches[0].clientX, event.changedTouches[0].clientY);
+  }
+  return event.target;
+}
+// 判断是否为触摸事件
+export function isTouchEvent(event) {
+  return 'touches' in event;
+}
+// 为元素添加统一的指针事件监听器
+export function addPointerEventListeners(element, handlers, isTouchStart) {
+  if (isTouchStart) {
+    element.addEventListener('touchmove', handlers.onPointerMove, {
+      passive: false
+    });
+    element.addEventListener('touchend', handlers.onPointerUp, {
+      passive: false
+    });
+  } else {
+    element.addEventListener('mousemove', handlers.onPointerMove);
+    element.addEventListener('mouseup', handlers.onPointerUp);
+  }
+}
+// 移除统一的指针事件监听器
+export function removePointerEventListeners(element, handlers, isTouchStart) {
+  if (isTouchStart) {
+    element.removeEventListener('touchmove', handlers.onPointerMove);
+    element.removeEventListener('touchend', handlers.onPointerUp);
+  } else {
+    element.removeEventListener('mousemove', handlers.onPointerMove);
+    element.removeEventListener('mouseup', handlers.onPointerUp);
+  }
+}
+// 检查是否移动了足够的距离（用于区分点击和拖拽）
+export function hasMovedEnough(startX, startY, endX, endY) {
+  var threshold = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 5;
+  var xDiff = endX - startX;
+  var yDiff = endY - startY;
+  return Math.sqrt(xDiff * xDiff + yDiff * yDiff) > threshold;
+}

package/lib/table/base/BlankComponent.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 interface BlankProps {
     height: number;
-    className?: string;
 }
 export interface BlankRef {
     updateHeight: (newHeight: number) => void;