@kdcloudjs/table 1.2.0-canary.15 → 1.2.0-canary.16-hotfix

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

@@ -38,43 +38,35 @@ var defaultRowDragColumn = {
 export function rowDrag(opt) {
   return function rowDragStep(pipeline) {
     var _context;
-
     var tableBody = pipeline.ref.current.domHelper && pipeline.ref.current.domHelper.tableBody;
     var artTable = pipeline.ref.current.domHelper && pipeline.ref.current.domHelper.artTable;
     if (!tableBody) return pipeline;
     var dataSource = pipeline.getDataSource();
     var rowHeight = (opt === null || opt === void 0 ? void 0 : opt.rowHeight) || 48;
-
     var handleDragStrat = function handleDragStrat(event) {
-      var _a; // 开始拖拽
-
-
+      var _a;
+      // 开始拖拽
       artTable.classList.add(cx(Classes.rowDragging));
       (_a = opt === null || opt === void 0 ? void 0 : opt.onDragStart) === null || _a === void 0 ? void 0 : _a.call(opt, event);
     };
-
     var handleDragMove = function handleDragMove(event) {
       var _a;
-
       (_a = opt === null || opt === void 0 ? void 0 : opt.onDragMove) === null || _a === void 0 ? void 0 : _a.call(opt, event);
       pipeline.setStateAtKey(rowDragKey, event);
     };
-
     var handleDragEnd = function handleDragEnd(event, isOutOfRange) {
       var _a;
-
       artTable.classList.remove(cx(Classes.rowDragging));
-      pipeline.setStateAtKey(rowDragKey, event); // 超出拖拽范围不触发dragend事件
-
+      pipeline.setStateAtKey(rowDragKey, event);
+      // 超出拖拽范围不触发dragend事件
       if (!isOutOfRange) {
         (_a = opt === null || opt === void 0 ? void 0 : opt.onDragEnd) === null || _a === void 0 ? void 0 : _a.call(opt, event);
       }
     };
-
     var getDragEvent = function getDragEvent(startRowInfo, endRowInfo, _ref) {
       var isFinished = _ref.isFinished,
-          _ref$dragPosition = _ref.dragPosition,
-          dragPosition = _ref$dragPosition === void 0 ? 'bottom' : _ref$dragPosition;
+        _ref$dragPosition = _ref.dragPosition,
+        dragPosition = _ref$dragPosition === void 0 ? 'bottom' : _ref$dragPosition;
       return {
         startRowIndex: startRowInfo.rowIndex,
         startRow: startRowInfo.row,
@@ -84,31 +76,26 @@ export function rowDrag(opt) {
         isFinished: isFinished
       };
     };
-
     var updateScrollPosition = function updateScrollPosition(mouseMoveEvent) {
       if (opt === null || opt === void 0 ? void 0 : opt.suppressScrollMove) return;
       var clientY = mouseMoveEvent.clientY;
       var tableBodyClientRect = tableBody.getBoundingClientRect();
       var top = tableBodyClientRect.top,
-          height = tableBodyClientRect.height;
-
+        height = tableBodyClientRect.height;
       if (clientY + SCROLL_OFFSET >= top + height) {
         pipeline.ref.current.domHelper.tableBody.scrollTop += SCROLL_OFFSET;
       }
-
       if (clientY + SCROLL_OFFSET <= top) {
         pipeline.ref.current.domHelper.tableBody.scrollTop -= SCROLL_OFFSET;
       }
     };
-
     var onMouseDown = function onMouseDown(mouseDownEvent) {
       var _a;
-
       var startRowInfo = getTargetRowInfo(mouseDownEvent.target, tableBody, dataSource);
       var endRowInfo = startRowInfo;
       if (!startRowInfo || startRowInfo.code !== rowDragColumn.code) return;
-      if ((_a = opt === null || opt === void 0 ? void 0 : opt.isDisabled) === null || _a === void 0 ? void 0 : _a.call(opt, startRowInfo.row, startRowInfo.rowIndex)) return; // 默认拖拽插入的位置是向下
-
+      if ((_a = opt === null || opt === void 0 ? void 0 : opt.isDisabled) === null || _a === void 0 ? void 0 : _a.call(opt, startRowInfo.row, startRowInfo.rowIndex)) return;
+      // 默认拖拽插入的位置是向下
       var dragPosition = 'bottom';
       var isOutOfRange = false;
       var dragStartEvent = getDragEvent(startRowInfo, endRowInfo, {
@@ -117,11 +104,11 @@ export function rowDrag(opt) {
       });
       handleDragStrat(dragStartEvent);
       var tableWidth = tableBody.clientWidth;
-      var startRowRects = startRowInfo.cell.getBoundingClientRect(); // 光标位置距离初始拖拽行的偏移量
-
+      var startRowRects = startRowInfo.cell.getBoundingClientRect();
+      // 光标位置距离初始拖拽行的偏移量
       var startOffset = mouseDownEvent.clientY - startRowRects.y;
-      var dragElement = createDragElement(startRowRects, tableWidth, rowHeight); // 可拖拽的范围
-
+      var dragElement = createDragElement(startRowRects, tableWidth, rowHeight);
+      // 可拖拽的范围
       var dragRange = getDragRange(tableBody, {
         startOffset: startOffset,
         rowHeight: startRowRects.height
@@ -130,15 +117,13 @@ export function rowDrag(opt) {
       var mouseup$ = fromEvent(window, 'mouseup');
       var rowDrag$ = mousemove$.pipe(map(function (mouseMoveEvent) {
         var clientX = mouseMoveEvent.clientX,
-            clientY = mouseMoveEvent.clientY;
+          clientY = mouseMoveEvent.clientY;
         var tagretRow = getTargetRowInfo(mouseMoveEvent.target, tableBody, dataSource);
-
         if (tagretRow) {
           endRowInfo = tagretRow;
         }
-
-        var targetRowRects = endRowInfo.cell.getBoundingClientRect(); // 判断拖拽插入的位置，拖拽框上边框位于目标行之上则向上插入，否则向下插入
-
+        var targetRowRects = endRowInfo.cell.getBoundingClientRect();
+        // 判断拖拽插入的位置，拖拽框上边框位于目标行之上则向上插入，否则向下插入
         var isMoveToTop = clientY - startOffset < targetRowRects.y;
         dragPosition = isMoveToTop ? 'top' : 'bottom';
         isOutOfRange = isOutOfDragRange({
@@ -146,7 +131,6 @@ export function rowDrag(opt) {
           y: clientY
         }, dragRange);
         updateScrollPosition(mouseMoveEvent); // 拖拽到底时让滚动条可以滚动
-
         updateDragElementPosition(dragElement, dragRange, {
           x: clientX,
           y: clientY,
@@ -162,8 +146,8 @@ export function rowDrag(opt) {
       rowDrag$.subscribe({
         next: function next(_ref2) {
           var startRowInfo = _ref2.startRowInfo,
-              endRowInfo = _ref2.endRowInfo,
-              dragPosition = _ref2.dragPosition;
+            endRowInfo = _ref2.endRowInfo,
+            dragPosition = _ref2.dragPosition;
           var dragMoveEvent = getDragEvent(startRowInfo, endRowInfo, {
             isFinished: false,
             dragPosition: dragPosition
@@ -181,12 +165,9 @@ export function rowDrag(opt) {
         }
       });
     };
-
     var rowDragColumn = (opt === null || opt === void 0 ? void 0 : opt.rowDragColumn) || defaultRowDragColumn;
     pipeline.setFeatureOptions('rowDragColumnKey', rowDragColumn.code);
-
     var nextColumns = _sliceInstanceProperty(_context = pipeline.getColumns()).call(_context);
-
     nextColumns.unshift(rowDragColumn);
     pipeline.columns(nextColumns);
     pipeline.addTableProps({
@@ -194,12 +175,11 @@ export function rowDrag(opt) {
     });
     pipeline.appendRowPropsGetter(function (row, rowIndex) {
       var _cx;
-
       var rowDragEvent = pipeline.getStateAtKey(rowDragKey) || {};
       var startRowIndex = rowDragEvent.startRowIndex,
-          endRowIndex = rowDragEvent.endRowIndex,
-          isFinished = rowDragEvent.isFinished,
-          dragPosition = rowDragEvent.dragPosition;
+        endRowIndex = rowDragEvent.endRowIndex,
+        isFinished = rowDragEvent.isFinished,
+        dragPosition = rowDragEvent.dragPosition;
       var isFooterCell = row[pipeline.getFeatureOptions('footerRowMetaKey')];
       if (isFooterCell || isFinished || rowIndex !== startRowIndex && rowIndex !== endRowIndex) return;
       var className = cx((_cx = {}, _defineProperty(_cx, Classes.rowDragStart, rowIndex === startRowIndex), _defineProperty(_cx, Classes.rowDragEnd, rowIndex === endRowIndex), _defineProperty(_cx, Classes.rowDragEndToTop, rowIndex === endRowIndex && dragPosition === 'top'), _defineProperty(_cx, Classes.rowDragEndToBottom, rowIndex === endRowIndex && dragPosition === 'bottom'), _cx));
@@ -210,7 +190,6 @@ export function rowDrag(opt) {
     return pipeline;
   };
 }
-
 function getTargetRowInfo(target, tableBody, record) {
   while (target && tableBody.contains(target)) {
     if (target.getAttribute('data-role') === 'table-cell') {
@@ -226,41 +205,33 @@ function getTargetRowInfo(target, tableBody, record) {
         cell: target
       };
     }
-
     target = target.parentElement;
   }
-
   return null;
 }
-
 function isEleInFooter(target) {
   while (target && !target.classList.contains(Classes.artTable)) {
     if (target.classList.contains(Classes.tableFooter)) {
       return true;
     }
-
     target = target.parentElement;
   }
-
   return false;
 }
-
 function createDragElement(rects, tableWidth, rowHeight) {
   var _context2, _context3, _context4;
-
   var x = rects.x,
-      y = rects.y;
+    y = rects.y;
   var dragMoveElement = document.createElement('div');
   dragMoveElement.className = cx(Classes.rowDragElement);
   dragMoveElement.style.cssText = _concatInstanceProperty(_context2 = _concatInstanceProperty(_context3 = _concatInstanceProperty(_context4 = "position:fixed;z-index:9999;left:".concat(x, "px;top:")).call(_context4, y, "px;pointer-events:none;width:")).call(_context3, tableWidth, "px;height:")).call(_context2, rowHeight, "px;background:var(--primary-color);opacity: 0.1;");
   document.body.appendChild(dragMoveElement);
   return dragMoveElement;
 }
-
 function updateDragElementPosition(element, dragRange, _ref3) {
   var x = _ref3.x,
-      y = _ref3.y,
-      startOffset = _ref3.startOffset;
+    y = _ref3.y,
+    startOffset = _ref3.startOffset;
   var validPosition = getValidPosition({
     x: x,
     y: y
@@ -268,11 +239,9 @@ function updateDragElementPosition(element, dragRange, _ref3) {
   element.style.top = validPosition.y - startOffset + 'px';
   return element;
 }
-
 function removeDragElement(element) {
   document.body.removeChild(element);
 }
-
 function updateCurSorStyle(isOutOfRange) {
   if (isOutOfRange) {
     document.body.style.cursor = 'no-drop';
@@ -280,19 +249,17 @@ function updateCurSorStyle(isOutOfRange) {
     document.body.style.cursor = 'move';
   }
 }
-
 function removeCurSorStyle() {
   document.body.style.cursor = 'default';
 }
-
 function getDragRange(tableBody, _ref4) {
   var startOffset = _ref4.startOffset,
-      rowHeight = _ref4.rowHeight;
+    rowHeight = _ref4.rowHeight;
   var tableBodyClientRect = tableBody.getBoundingClientRect();
   var height = tableBodyClientRect.height,
-      width = tableBodyClientRect.width,
-      x = tableBodyClientRect.x,
-      y = tableBodyClientRect.y;
+    width = tableBodyClientRect.width,
+    x = tableBodyClientRect.x,
+    y = tableBodyClientRect.y;
   return {
     minX: x,
     maxX: x + width,
@@ -300,14 +267,13 @@ function getDragRange(tableBody, _ref4) {
     maxY: y + height + startOffset
   };
 }
-
 function getValidPosition(position, dragRange) {
   var x = position.x,
-      y = position.y;
+    y = position.y;
   var minX = dragRange.minX,
-      maxX = dragRange.maxX,
-      minY = dragRange.minY,
-      maxY = dragRange.maxY;
+    maxX = dragRange.maxX,
+    minY = dragRange.minY,
+    maxY = dragRange.maxY;
   var newX = x < minX ? minX : x > maxX ? maxX : x;
   var newY = y < minY ? minY : y > maxY ? maxY : y;
   return {
@@ -315,13 +281,12 @@ function getValidPosition(position, dragRange) {
     y: newY
   };
 }
-
 function isOutOfDragRange(position, dragRange) {
   var x = position.x,
-      y = position.y;
+    y = position.y;
   var minX = dragRange.minX,
-      maxX = dragRange.maxX,
-      minY = dragRange.minY,
-      maxY = dragRange.maxY;
+    maxX = dragRange.maxX,
+    minY = dragRange.minY,
+    maxY = dragRange.maxY;
   return x > maxX || x < minX || y > maxY || y < minY;
 }

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

@@ -15,15 +15,12 @@ import { internals } from '../../internals';
 import { collectNodes, isLeafNode, mergeCellProps } from '../../utils';
 import { flatMap } from '../../utils/others';
 import { Classes } from '../../base';
-
 var groupingMetaSymbol = _Symbol('row-grouping-meta');
-
 function attachGroupingMeta(row) {
   return _extends(_defineProperty({}, groupingMetaSymbol, {
     expandable: !isLeafNode(row)
   }), row);
 }
-
 function getGroupingMeta(row) {
   if (row[groupingMetaSymbol] == null) {
     return {
@@ -31,13 +28,11 @@ function getGroupingMeta(row) {
       expandable: false
     };
   }
-
   return {
     isGroupHeader: true,
     expandable: row[groupingMetaSymbol].expandable
   };
 }
-
 function rowGroupingRowPropsGetter(row) {
   if (getGroupingMeta(row).isGroupHeader) {
     return {
@@ -45,74 +40,56 @@ function rowGroupingRowPropsGetter(row) {
     };
   }
 }
-
 export function rowGrouping() {
   var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   return function (pipeline) {
     var _context;
-
     var _a, _b, _c;
-
     var stateKey = 'rowGrouping';
     var indents = pipeline.ctx.indents;
     var textOffset = indents.iconIndent + indents.iconWidth + indents.iconGap;
     var primaryKey = pipeline.ensurePrimaryKey('rowGrouping');
-
     if (typeof primaryKey !== 'string') {
       throw new Error('rowGrouping 仅支持字符串作为 primaryKey');
     }
-
     var openKeys = (_c = (_b = (_a = opts.openKeys) !== null && _a !== void 0 ? _a : pipeline.getStateAtKey(stateKey)) !== null && _b !== void 0 ? _b : opts.defaultOpenAll ? _mapInstanceProperty(_context = pipeline.getDataSource()).call(_context, function (row) {
       return row[primaryKey];
     }) : opts.defaultOpenKeys) !== null && _c !== void 0 ? _c : [];
     var openKeySet = new _Set(openKeys);
-
     var onChangeOpenKeys = function onChangeOpenKeys(nextKeys, key, action) {
       var _a;
-
       (_a = opts.onChangeOpenKeys) === null || _a === void 0 ? void 0 : _a.call(opts, nextKeys, key, action);
       pipeline.setStateAtKey(stateKey, nextKeys, {
         key: key,
         action: action
       });
     };
-
     return pipeline.mapDataSource(processDataSource).mapColumns(processColumns).appendRowPropsGetter(rowGroupingRowPropsGetter);
-
     function processDataSource(input) {
       return flatMap(input, function (row) {
         var result = [attachGroupingMeta(row)];
         var expanded = openKeySet.has(row[primaryKey]);
-
         if (expanded) {
           if (Array.isArray(row.children)) {
             result = _concatInstanceProperty(result).call(result, row.children);
           }
         }
-
         return result;
       });
     }
-
     function processColumns(columns) {
       var _context3;
-
       if (columns.length === 0) {
         return columns;
       }
-
       var columnFlatCount = collectNodes(columns, 'leaf-only').length;
-
       var _columns = _toArray(columns),
-          firstCol = _columns[0],
-          others = _sliceInstanceProperty(_columns).call(_columns, 1);
-
+        firstCol = _columns[0],
+        others = _sliceInstanceProperty(_columns).call(_columns, 1);
       var render = function render(value, row, rowIndex) {
         var _a, _b;
-
         var content = internals.safeRender(firstCol, row, rowIndex);
         var meta = getGroupingMeta(row);
-
         if (!meta.isGroupHeader || !meta.expandable) {
           var marginLeft = textOffset + (meta.isGroupHeader ? 0 : indents.indentSize);
           return /*#__PURE__*/React.createElement(InlineFlexCell, {
@@ -121,7 +98,6 @@ export function rowGrouping() {
             }
           }, meta.isGroupHeader ? (_a = row.groupTitle) !== null && _a !== void 0 ? _a : content : content);
         }
-
         var expanded = openKeySet.has(row[primaryKey]);
         var expandCls = expanded ? Classes.expanded : Classes.collapsed;
         return /*#__PURE__*/React.createElement(ExpansionCell, {
@@ -134,39 +110,31 @@ export function rowGrouping() {
           }
         }), (_b = row.groupTitle) !== null && _b !== void 0 ? _b : content);
       };
-
       var getCellProps = function getCellProps(value, row, rowIndex) {
         var _a;
-
         var meta = getGroupingMeta(row);
-
         if (!meta.isGroupHeader) {
           return;
         }
-
         var expandable = meta.expandable;
         var rowKey = row[primaryKey];
         var expanded = openKeySet.has(rowKey);
         var onClick;
-
         if (expandable) {
           onClick = function onClick(e) {
             if (opts.stopClickEventPropagation) {
               e.stopPropagation();
             }
-
             if (expanded) {
               onChangeOpenKeys(_filterInstanceProperty(openKeys).call(openKeys, function (key) {
                 return key !== rowKey;
               }), rowKey, 'collapse');
             } else {
               var _context2;
-
               onChangeOpenKeys(_concatInstanceProperty(_context2 = []).call(_context2, _toConsumableArray(openKeys), [rowKey]), rowKey, 'expand');
             }
           };
         }
-
         var prevProps = (_a = firstCol.getCellProps) === null || _a === void 0 ? void 0 : _a.call(firstCol, value, row, rowIndex);
         return mergeCellProps(prevProps, {
           onClick: onClick,
@@ -175,7 +143,6 @@ export function rowGrouping() {
           }
         });
       };
-
       return _concatInstanceProperty(_context3 = [_extends(_extends({}, firstCol), {
         title: /*#__PURE__*/React.createElement("div", {
           style: {

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

@@ -9,28 +9,21 @@ export function singleSelect() {
   var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   return function singleSelectStep(pipeline) {
     var _context;
-
     var _a, _b, _c, _d, _e, _f;
-
     var Radio = pipeline.ctx.components.Radio;
-
     if (Radio == null) {
       throw new Error('使用 singleSelect 之前需要通过 pipeline context 设置 components.Radio');
     }
-
     var stateKey = 'singleSelect';
     var clickArea = (_a = opts.clickArea) !== null && _a !== void 0 ? _a : 'radio';
     var isDisabled = (_b = opts.isDisabled) !== null && _b !== void 0 ? _b : always(false);
     var primaryKey = pipeline.ensurePrimaryKey('singleSelect');
     var value = (_d = (_c = opts.value) !== null && _c !== void 0 ? _c : pipeline.getStateAtKey(stateKey)) !== null && _d !== void 0 ? _d : opts.defaultValue;
-
     var onChange = function onChange(rowKey) {
       var _a;
-
       (_a = opts.onChange) === null || _a === void 0 ? void 0 : _a.call(opts, rowKey);
       pipeline.setStateAtKey(stateKey, rowKey);
     };
-
     var radioColumn = _extends(_extends({
       name: '',
       width: 50,
@@ -38,9 +31,7 @@ export function singleSelect() {
     }, opts.radioColumn), {
       getCellProps: function getCellProps(value, row, rowIndex) {
         var _a, _b;
-
         var preCellProps = (_b = (_a = opts.radioColumn) === null || _a === void 0 ? void 0 : _a.getCellProps) === null || _b === void 0 ? void 0 : _b.call(_a, value, row, rowIndex);
-
         if (clickArea === 'cell') {
           var rowKey = internals.safeGetRowKey(primaryKey, row, rowIndex);
           var disabled = isDisabled(row, rowIndex);
@@ -52,74 +43,59 @@ export function singleSelect() {
               if (opts.stopClickEventPropagation) {
                 e.stopPropagation();
               }
-
               onChange(rowKey);
             }
           });
         }
-
         return preCellProps;
       },
       render: function render(_, row, rowIndex) {
         if (row[pipeline.getFeatureOptions('footerRowMetaKey')]) {
           return null;
         }
-
         var rowKey = internals.safeGetRowKey(primaryKey, row, rowIndex);
         return /*#__PURE__*/React.createElement(Radio, {
           checked: value === rowKey,
           disabled: isDisabled(row, rowIndex),
           onChange: clickArea === 'radio' ? function (arg1, arg2) {
             var _a;
-
             var nativeEvent = (_a = arg2 === null || arg2 === void 0 ? void 0 : arg2.nativeEvent) !== null && _a !== void 0 ? _a : arg1 === null || arg1 === void 0 ? void 0 : arg1.nativeEvent;
-
             if (nativeEvent && opts.stopClickEventPropagation) {
               nativeEvent.stopPropagation();
             }
-
             onChange(rowKey);
           } : undefined
         });
       },
       features: _extends(_extends({}, (_e = opts.radioColumn) === null || _e === void 0 ? void 0 : _e.features), _defineProperty({}, SINGLE_SELECT_MARK_PROPNAME, true))
     });
-
     var nextColumns = _sliceInstanceProperty(_context = pipeline.getColumns()).call(_context);
-
     var radioPlacement = (_f = opts.radioPlacement) !== null && _f !== void 0 ? _f : 'start';
-
     if (radioPlacement === 'start') {
       nextColumns.unshift(radioColumn);
     } else {
       nextColumns.push(radioColumn);
     }
-
     pipeline.columns(nextColumns);
     pipeline.appendRowPropsGetter(function (row, rowIndex) {
       var rowKey = internals.safeGetRowKey(primaryKey, row, rowIndex);
       var style = {};
       var className;
       var onClick;
-
       if (opts.highlightRowWhenSelected) {
         if (value === rowKey) {
           className = 'highlight';
         }
       }
-
       if (clickArea === 'row' && !isDisabled(row, rowIndex)) {
         style.cursor = 'pointer';
-
         onClick = function onClick(e) {
           if (opts.stopClickEventPropagation) {
             e.stopPropagation();
           }
-
           onChange(rowKey);
         };
       }
-
       return {
         className: className,
         style: style,