@zhenliang/sheet 0.1.27 → 0.1.29

package/dist/core/reducers/keyboardReducer.js

@@ -17,7 +17,8 @@ export var keyboardReducer = {
       data = _state$data === void 0 ? [] : _state$data;
     var newRow = (((_state$start = state.start) === null || _state$start === void 0 ? void 0 : _state$start.row) || 0) + row;
     if (groupConfig) {
-      newRow = getNextVisibleRow(newRow, data.length, groupConfigToGroupMap(groupConfig), row < 0 ? -1 : 1);
+      var _data;
+      newRow = getNextVisibleRow(newRow, (data === null || data === void 0 || (_data = data[data.length - 1]) === null || _data === void 0 ? void 0 : _data[0].row) || data.length, groupConfigToGroupMap(groupConfig), row < 0 ? -1 : 1);
     }
     var currentPos = {
       row: newRow,

package/dist/core/sheet/Control.d.ts

@@ -0,0 +1,10 @@
+import React, { CSSProperties } from 'react';
+interface ControlProps {
+    showBackEdit?: boolean;
+    startRowVisible: boolean;
+    handelClick: () => void;
+    backEditStyle?: Partial<CSSProperties>;
+    direction: 'up' | 'down';
+}
+export declare const Control: React.FC<ControlProps>;
+export {};

package/dist/core/sheet/Control.js

@@ -0,0 +1,32 @@
+import { ArrowDownOutlined, ArrowUpOutlined } from '@ant-design/icons';
+import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export var Control = function Control(props) {
+  var showBackEdit = props.showBackEdit,
+    startRowVisible = props.startRowVisible,
+    handelClick = props.handelClick,
+    backEditStyle = props.backEditStyle,
+    direction = props.direction;
+  if (!showBackEdit || startRowVisible) return null;
+  var styles = backEditStyle || {
+    top: 0,
+    right: 0
+  };
+  var backIcon = direction === 'up' ? /*#__PURE__*/_jsx(ArrowUpOutlined, {
+    rev: undefined
+  }) : /*#__PURE__*/_jsx(ArrowDownOutlined, {
+    rev: undefined
+  });
+  return /*#__PURE__*/_jsxs("div", {
+    className: "back-edit",
+    onClick: handelClick,
+    style: styles,
+    children: [backIcon, /*#__PURE__*/_jsx("span", {
+      style: {
+        marginLeft: 0
+      },
+      children: "\u8FD4\u56DE\u7F16\u8F91\u884C"
+    })]
+  });
+};

package/dist/core/sheet/DefaultRow.js

@@ -12,13 +12,7 @@ var DefaultRow = function DefaultRow(_ref) {
     return groupConfigToGroupMap(groupConfig);
   }, [groupConfig]);
   if (groupMap.get(row) && !((_groupMap$get = groupMap.get(row)) !== null && _groupMap$get !== void 0 && _groupMap$get.isStart) && !((_groupMap$get2 = groupMap.get(row)) !== null && _groupMap$get2 !== void 0 && _groupMap$get2.isOpen)) {
-    return /*#__PURE__*/_jsx("tr", {
-      className: rowClassName,
-      style: {
-        display: 'none'
-      },
-      children: children
-    });
+    return null;
   }
   return /*#__PURE__*/_jsx("tr", {
     className: rowClassName,

package/dist/core/sheet/Menu.d.ts

@@ -0,0 +1,6 @@
+import { MenuRenderProps } from "../../type/sheet";
+import React from 'react';
+export declare const Menu: React.ForwardRefExoticComponent<MenuRenderProps & {
+    contextMenu?: React.FC<MenuRenderProps> | undefined;
+    showMenu: boolean;
+} & React.RefAttributes<HTMLDivElement>>;

package/dist/core/sheet/Menu.js

@@ -0,0 +1,21 @@
+import React, { forwardRef } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+export var Menu = /*#__PURE__*/forwardRef(function (props, ref) {
+  var showMenu = props.showMenu,
+    position = props.position,
+    cell = props.cell,
+    onContextMenu = props.onContextMenu,
+    ContextMenu = props.contextMenu;
+  var isMenuShow = !!ContextMenu && showMenu;
+  return /*#__PURE__*/_jsx("div", {
+    ref: ref,
+    style: {
+      display: isMenuShow ? '' : 'none'
+    },
+    children: isMenuShow && /*#__PURE__*/_jsx(ContextMenu, {
+      position: position,
+      cell: cell,
+      onContextMenu: onContextMenu
+    })
+  });
+});

package/dist/core/sheet/index.js

@@ -4,29 +4,31 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import { useEffect, useMemo, useRef } from 'react';
+import { useEffect, useImperativeHandle, useMemo, useRef } from 'react';
 // import ReduxLogger from 'redux-logger';
 import ReduxThunk from 'redux-thunk';
 import DefaultRow from "./DefaultRow";
 import DefaultShell from "./DefaultShell";
-import { ArrowDownOutlined, ArrowUpOutlined } from '@ant-design/icons';
+import { useGroup } from "../../hooks/useGroupConfig";
 import { Empty } from 'antd';
 import { isEmpty, isNil, isNumber } from 'lodash';
 import { SheetEventContext, useEventBus, useMiddlewareReducer } from "../../hooks";
 import sheetReducer from "../reducers";
 import { classNames, getRowHeight, rowToActualRow } from "../util";
+import { Control } from "./Control";
 import { DefaultRowMapper } from "./DefaultRowMapper";
+import { Menu } from "./Menu";
 import "./index.less";
 import { useCellEvent } from "./useCellEvent";
 import { useContextMenu } from "./useContextMenu";
 import { useKeyBoardEvent } from "./useKeyBoardEvent";
 import { useMouseEvent } from "./useMouseEvent";
 import { useSelectVisible } from "./useSelectVisible";
-import { useVirtualList } from "./useVirtualList";
+import { VirtualizeEnd, VirtualizeStart, useVirtualList } from "./useVirtualList";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var Sheet = function Sheet(props) {
-  var _state$data$length, _state$data3, _scroll$y, _scroll$x;
+  var _visibleData$length, _scroll$y, _scroll$x;
   var _props$sheetInstance = props.sheetInstance,
     sheetInstance = _props$sheetInstance === void 0 ? {
       current: null
@@ -46,8 +48,6 @@ var Sheet = function Sheet(props) {
     data = props.data,
     _props$freePaste = props.freePaste,
     freePaste = _props$freePaste === void 0 ? false : _props$freePaste,
-    _props$groupConfig = props.groupConfig,
-    groupConfig = _props$groupConfig === void 0 ? undefined : _props$groupConfig,
     onCellsChanged = props.onCellsChanged,
     onContextMenu = props.onContextMenu,
     rowClassName = props.rowClassName,
@@ -58,6 +58,8 @@ var Sheet = function Sheet(props) {
   var sheetWrapperRef = useRef(null);
   var contextMenuRef = useRef(null);
   var eventBus = useEventBus();
+  var _useGroup = useGroup(),
+    groupConfig = _useGroup.config;
   var _useMiddlewareReducer = useMiddlewareReducer(sheetReducer, {
       data: data,
       mouseDown: false,
@@ -71,8 +73,8 @@ var Sheet = function Sheet(props) {
     _useMiddlewareReducer2 = _slicedToArray(_useMiddlewareReducer, 2),
     state = _useMiddlewareReducer2[0],
     dispatch = _useMiddlewareReducer2[1];
-  useEffect(function () {
-    sheetInstance.current = {
+  useImperativeHandle(sheetInstance, function () {
+    return {
       zoomTo: function zoomTo(row) {
         // 给定 row 回到行
         // 不给定 row 默认回到编辑行和列
@@ -84,7 +86,7 @@ var Sheet = function Sheet(props) {
             data = _getState.data;
           var container = sheetWrapperRef.current;
           if (!start && isNil(row)) return;
-          var actual = rowToActualRow((_ref = row) !== null && _ref !== void 0 ? _ref : start === null || start === void 0 ? void 0 : start.row, groupConfig);
+          var actual = rowToActualRow((_ref = row) !== null && _ref !== void 0 ? _ref : start === null || start === void 0 ? void 0 : start.row, groupConfig, data.length);
           var rowHeight = getRowHeight(container);
           var firstRowCell = container.querySelector("td.cell[data-col='".concat(start === null || start === void 0 ? void 0 : start.col, "']"));
           var colPosition = firstRowCell ? firstRowCell.offsetLeft - firstRowCell.clientWidth : 0;
@@ -134,7 +136,7 @@ var Sheet = function Sheet(props) {
         return history !== null && history !== void 0 && history.length ? history === null || history === void 0 ? void 0 : history[history.length - 1] : {};
       }
     };
-  }, [sheetWrapperRef.current, state.history]);
+  }, [state.history]);
   useEffect(function () {
     // 同步必要的状态
     dispatch({
@@ -164,7 +166,20 @@ var Sheet = function Sheet(props) {
       }, 1);
     }
   }, [state.editing, state.start]);
-  var _useVirtualList = useVirtualList(sheetWrapperRef, state.data, groupConfig, virtualized),
+  var visibleData = useMemo(function () {
+    var _groupConfig$groups, _state$data;
+    if (!(groupConfig !== null && groupConfig !== void 0 && (_groupConfig$groups = groupConfig.groups) !== null && _groupConfig$groups !== void 0 && _groupConfig$groups.length)) {
+      return state.data;
+    }
+    return (_state$data = state.data) === null || _state$data === void 0 ? void 0 : _state$data.filter(function (item, index) {
+      if (!(groupConfig !== null && groupConfig !== void 0 && groupConfig.configMap.has(index))) {
+        return true;
+      }
+      var rowConfig = groupConfig.configMap.get(index);
+      return (rowConfig === null || rowConfig === void 0 ? void 0 : rowConfig.isOpen) || (rowConfig === null || rowConfig === void 0 ? void 0 : rowConfig.isStart);
+    });
+  }, [state.data, groupConfig]);
+  var _useVirtualList = useVirtualList(sheetWrapperRef, visibleData, virtualized),
     virtualStart = _useVirtualList.virtualStart,
     virtualEnd = _useVirtualList.virtualEnd,
     paddingTop = _useVirtualList.paddingTop,
@@ -178,15 +193,14 @@ var Sheet = function Sheet(props) {
     });
   }, [groupConfig]);
   var rowElements = useMemo(function () {
-    var _state$data;
-    return state === null || state === void 0 || (_state$data = state.data) === null || _state$data === void 0 || (_state$data = _state$data.slice(virtualStart, virtualEnd)) === null || _state$data === void 0 ? void 0 : _state$data.map(function (rowData) {
-      var _state$data2, _rowData;
-      var row = (state === null || state === void 0 || (_state$data2 = state.data) === null || _state$data2 === void 0 ? void 0 : _state$data2.indexOf(rowData)) || 0;
+    var _visibleData$slice;
+    return visibleData === null || visibleData === void 0 || (_visibleData$slice = visibleData.slice(virtualStart, virtualEnd)) === null || _visibleData$slice === void 0 ? void 0 : _visibleData$slice.map(function (rowData) {
+      var _rowData$, _rowData;
+      var row = ((_rowData$ = rowData[0]) === null || _rowData$ === void 0 ? void 0 : _rowData$.row) || 0;
       var rowCN = rowClassName instanceof Function ? rowClassName === null || rowClassName === void 0 ? void 0 : rowClassName(rowData === null || rowData === void 0 || (_rowData = rowData[rowData.length - 1]) === null || _rowData === void 0 ? void 0 : _rowData.record, row) : rowClassName;
       return /*#__PURE__*/_jsx(Row, {
         row: row,
         cells: rowData,
-        groupConfig: groupConfig,
         rowClassName: rowCN,
         children: /*#__PURE__*/_jsx(DefaultRowMapper, {
           rowData: rowData,
@@ -194,12 +208,25 @@ var Sheet = function Sheet(props) {
         })
       }, row);
     });
-  }, [state.data, groupConfig, virtualStart, virtualEnd, rowClassName]);
-  var memoHeight = Math.min(((_state$data$length = state === null || state === void 0 || (_state$data3 = state.data) === null || _state$data3 === void 0 ? void 0 : _state$data3.length) !== null && _state$data$length !== void 0 ? _state$data$length : 0) + 1, 10) * 42 + 43;
+  }, [visibleData, groupConfig, virtualStart, virtualEnd, rowClassName]);
+  var memoHeight = Math.min(((_visibleData$length = visibleData === null || visibleData === void 0 ? void 0 : visibleData.length) !== null && _visibleData$length !== void 0 ? _visibleData$length : 0) + 1, 10) * 42 + 43;
   var _useSelectVisible = useSelectVisible(sheetWrapperRef, state.start),
     _useSelectVisible2 = _slicedToArray(_useSelectVisible, 2),
     startRowVisible = _useSelectVisible2[0],
     direction = _useSelectVisible2[1];
+  var isEmptyData = isEmpty(state.data);
+  var EmptyElement = useMemo(function () {
+    if (isEmptyData) {
+      return /*#__PURE__*/_jsx("div", {
+        style: {
+          marginTop: 16,
+          marginBottom: 16
+        },
+        children: emptyRenderer
+      });
+    }
+    return null;
+  }, [isEmptyData, emptyRenderer]);
   return /*#__PURE__*/_jsx(SheetEventContext.Provider, {
     value: eventBus,
     children: /*#__PURE__*/_jsxs("span", {
@@ -213,59 +240,33 @@ var Sheet = function Sheet(props) {
         },
         children: [/*#__PURE__*/_jsxs(SheetShell, {
           className: classNames('harvest-sheet', className),
-          children: [virtualized && paddingTop > 0 && /*#__PURE__*/_jsx("tr", {
-            style: {
-              height: 0,
-              paddingBottom: paddingTop,
-              display: 'block'
-            }
-          }), rowElements, virtualized && paddingBottom > 0 && /*#__PURE__*/_jsx("tr", {
-            style: {
-              height: 0,
-              paddingBottom: paddingBottom,
-              display: 'block'
-            }
+          children: [/*#__PURE__*/_jsx(VirtualizeStart, {
+            virtualized: virtualized,
+            paddingTop: paddingTop
+          }), rowElements, /*#__PURE__*/_jsx(VirtualizeEnd, {
+            virtualized: virtualized,
+            paddingBottom: paddingBottom
           })]
-        }, "sheet"), ContextMenu ? /*#__PURE__*/_jsx("div", {
+        }, "sheet"), /*#__PURE__*/_jsx(Menu, {
           ref: contextMenuRef,
-          style: {
-            display: menu.showMenu ? '' : 'none'
-          },
-          children: /*#__PURE__*/_jsx(ContextMenu, {
-            position: menu.position,
-            cell: menu.cellPosition,
-            onContextMenu: onContextMenu
-          })
-        }) : null]
-      }), isEmpty(state.data) || isNil(state.data) ? /*#__PURE__*/_jsx("div", {
-        style: {
-          marginTop: 16,
-          marginBottom: 16
-        },
-        children: emptyRenderer
-      }) : null, /*#__PURE__*/_jsxs("div", {
+          position: menu.position,
+          cell: menu.cellPosition,
+          showMenu: menu.showMenu,
+          contextMenu: ContextMenu,
+          onContextMenu: onContextMenu
+        })]
+      }), EmptyElement, /*#__PURE__*/_jsxs("div", {
         className: "harvest-sheet-control",
-        children: [children, showBackEdit && !startRowVisible ? /*#__PURE__*/_jsxs("div", {
-          className: "back-edit",
-          onClick: function onClick() {
+        children: [children, /*#__PURE__*/_jsx(Control, {
+          showBackEdit: showBackEdit,
+          startRowVisible: startRowVisible,
+          handelClick: function handelClick() {
             var _sheetInstance$curren;
             return sheetInstance === null || sheetInstance === void 0 || (_sheetInstance$curren = sheetInstance.current) === null || _sheetInstance$curren === void 0 ? void 0 : _sheetInstance$curren.zoomTo();
           },
-          style: !backEditStyle ? {
-            top: 0,
-            right: 0
-          } : backEditStyle,
-          children: [direction === 'up' ? /*#__PURE__*/_jsx(ArrowUpOutlined, {
-            rev: undefined
-          }) : /*#__PURE__*/_jsx(ArrowDownOutlined, {
-            rev: undefined
-          }), /*#__PURE__*/_jsx("span", {
-            style: {
-              marginLeft: 0
-            },
-            children: "\u8FD4\u56DE\u7F16\u8F91\u884C"
-          })]
-        }) : null]
+          direction: direction,
+          backEditStyle: backEditStyle
+        })]
       })]
     })
   });

package/dist/core/sheet/useSelectVisible.js

@@ -20,6 +20,7 @@ export var useSelectVisible = function useSelectVisible(sheetWrapper, start) {
     var handleScroll = throttle(function () {
       var _sheetWrapper$current, _sheetWrapper$current2;
       if (!start) {
+        setStartVisible(true);
         return;
       }
       var startCell = (_sheetWrapper$current = sheetWrapper.current) === null || _sheetWrapper$current === void 0 ? void 0 : _sheetWrapper$current.querySelector("td.cell[data-row='".concat(start.row, "']"));

package/dist/core/sheet/useVirtualList.d.ts

@@ -1,7 +1,16 @@
+/// <reference types="react" />
 import type { SheetType } from "../../type";
-export declare const useVirtualList: (elementRef: React.RefObject<SheetType.refAssertion>, data?: SheetType.Cell[][], groupConfig?: SheetType.RowGroupConfig, virtualized?: boolean) => {
+export declare const useVirtualList: (elementRef: React.RefObject<SheetType.refAssertion>, data?: SheetType.Cell[][], virtualized?: boolean) => {
     virtualStart: number;
     virtualEnd: number;
     paddingTop: number;
     paddingBottom: number;
 };
+export declare const VirtualizeStart: React.FC<{
+    virtualized: boolean;
+    paddingTop: number;
+}>;
+export declare const VirtualizeEnd: React.FC<{
+    virtualized: boolean;
+    paddingBottom: number;
+}>;

package/dist/core/sheet/useVirtualList.js

@@ -4,15 +4,17 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import { isEqual, throttle } from 'lodash';
-import { useEffect, useRef, useState } from 'react';
-import { getRowHeight, rowToActualRow, rowToCountRow } from "../util";
+/* eslint-disable @typescript-eslint/no-unused-vars */
+import { useGroup } from "../../hooks/useGroupConfig";
+import { throttle } from 'lodash';
+import { useEffect, useState } from 'react';
+import { getRowHeight } from "../util";
+import { jsx as _jsx } from "react/jsx-runtime";
 var extra = 20;
 // 虚拟列表
 export var useVirtualList = function useVirtualList(elementRef) {
   var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
-  var groupConfig = arguments.length > 2 ? arguments[2] : undefined;
-  var virtualized = arguments.length > 3 ? arguments[3] : undefined;
+  var virtualized = arguments.length > 2 ? arguments[2] : undefined;
   var _useState = useState({
       virtualStart: 0,
       virtualEnd: virtualized ? Math.min(data.length - 1, 2 * extra) : data.length - 1,
@@ -22,17 +24,17 @@ export var useVirtualList = function useVirtualList(elementRef) {
     _useState2 = _slicedToArray(_useState, 2),
     state = _useState2[0],
     setState = _useState2[1];
+  var _useGroup = useGroup(),
+    groupConfig = _useGroup.config;
   var virtualStart = state.virtualStart,
     virtualEnd = state.virtualEnd,
     paddingTop = state.paddingTop,
     paddingBottom = state.paddingBottom;
-  var virtualRef = useRef();
-  var groupConfigRef = useRef(groupConfig);
+  // const virtualRef = useRef<VirtualConfig | null>();
   useEffect(function () {
     var _elementRef$current;
-    groupConfigRef.current = groupConfig;
     (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 || _elementRef$current.scrollBy({
-      top: 1
+      top: 0
     });
   }, [groupConfig]);
   useEffect(function () {
@@ -47,36 +49,15 @@ export var useVirtualList = function useVirtualList(elementRef) {
         clientHeight = _ref.clientHeight;
       var start = Math.floor(scrollTop / itemHeight) - extra;
       var end = Math.ceil((scrollTop + clientHeight) / itemHeight) + extra;
-      if (!groupConfigRef.current) {
-        var newConfig = {
-          virtualStart: start,
-          virtualEnd: end,
-          paddingTop: start * itemHeight,
-          paddingBottom: (data.length - end) * itemHeight
-        };
-        if (isEqual(newConfig, virtualRef.current)) {
-          return;
-        }
-        virtualRef.current = newConfig;
-        setState(newConfig);
-        return;
-      }
-      var actualStart = rowToCountRow(start, groupConfigRef.current, data.length);
-      var actualEnd = rowToCountRow(end, groupConfigRef.current, data.length);
-      var maxEnd = rowToActualRow(data.length, groupConfigRef.current, data.length);
-      var invisibleTop = rowToActualRow(actualStart, groupConfigRef.current, data.length);
-      var invisibleBottom = maxEnd > end ? maxEnd - end : 0;
-      var updateVirtualConfig = {
-        virtualStart: actualStart,
-        virtualEnd: actualEnd,
-        paddingTop: invisibleTop * itemHeight,
-        paddingBottom: invisibleBottom * itemHeight
+      var newConfig = {
+        virtualStart: start,
+        virtualEnd: end,
+        paddingTop: start * itemHeight,
+        paddingBottom: (data.length - end) * itemHeight
       };
-      if (isEqual(updateVirtualConfig, virtualRef.current)) {
-        return;
-      }
-      setState(updateVirtualConfig);
-      virtualRef.current = updateVirtualConfig;
+      // virtualRef.current = newConfig;
+      setState(newConfig);
+      return;
     }, 50);
     // data.length change 的时候用 handleScroll 重设 virtual params
     handleScroll();
@@ -100,4 +81,23 @@ export var useVirtualList = function useVirtualList(elementRef) {
     paddingTop: Math.max(0, paddingTop),
     paddingBottom: data.length - 1 <= virtualEnd ? 0 : paddingBottom
   };
+};
+export var VirtualizeStart = function VirtualizeStart(_ref2) {
+  var virtualized = _ref2.virtualized,
+    paddingTop = _ref2.paddingTop;
+  return virtualized && paddingTop > 0 ? /*#__PURE__*/_jsx("tr", {
+    style: {
+      height: 0,
+      paddingBottom: paddingTop,
+      display: 'block'
+    }
+  }) : null;
+};
+export var VirtualizeEnd = function VirtualizeEnd(_ref3) {
+  var virtualized = _ref3.virtualized,
+    paddingBottom = _ref3.paddingBottom;
+  return /*#__PURE__*/_jsx(VirtualizeStart, {
+    virtualized: virtualized,
+    paddingTop: paddingBottom
+  });
 };

package/dist/core/shell/draggableShell/index.js

@@ -147,14 +147,18 @@ export var DraggableShell = function DraggableShell(_ref) {
           var _downRef$current$oldW, _downRef$current$oldX;
           downRef.current.style.cursor = 'default';
           if (((_downRef$current$oldW = downRef.current.oldWidth) !== null && _downRef$current$oldW !== void 0 ? _downRef$current$oldW : 0) + (e.x - ((_downRef$current$oldX = downRef.current.oldX) !== null && _downRef$current$oldX !== void 0 ? _downRef$current$oldX : 0)) > 0) {
-            var _downRef$current$oldW2, _downRef$current$oldX2, _headRef$current;
+            var _downRef$current$oldW2, _downRef$current$oldX2, _headRef$current, _columns$actualIndex$;
             var newWidth = Math.max(Number(((_downRef$current$oldW2 = downRef.current.oldWidth) !== null && _downRef$current$oldW2 !== void 0 ? _downRef$current$oldW2 : 0) + (e.x - ((_downRef$current$oldX2 = downRef.current.oldX) !== null && _downRef$current$oldX2 !== void 0 ? _downRef$current$oldX2 : 0))), 50);
             var cellList = [].slice.call((_headRef$current = headRef.current) === null || _headRef$current === void 0 ? void 0 : _headRef$current.cells);
             var changeIndex = cellList.indexOf(downRef.current);
+            var actualIndex = hasControl ? changeIndex - 1 : changeIndex;
+            var isDoubleSpan = (((_columns$actualIndex$ = columns[actualIndex].titleConfig) === null || _columns$actualIndex$ === void 0 ? void 0 : _columns$actualIndex$.colSpan) || 0) > 1;
+            var nextColumn = columns[actualIndex + 1] || {};
+            var nextWidth = +String(nextColumn === null || nextColumn === void 0 ? void 0 : nextColumn.width).replace('px', '');
             //调整该列中的每个Cell
             var _widths2 = _defineProperty({
               length: columns.length
-            }, hasControl ? changeIndex - 1 : changeIndex, newWidth);
+            }, actualIndex, isDoubleSpan ? newWidth - nextWidth : newWidth);
             setWidth(_widths2);
           }
         }
@@ -177,6 +181,9 @@ export var DraggableShell = function DraggableShell(_ref) {
         children: [/*#__PURE__*/_jsx("colgroup", {
           children: colItems
         }), /*#__PURE__*/_jsx("thead", {
+          style: {
+            pointerEvents: 'all'
+          },
           children: /*#__PURE__*/_jsx("tr", {
             ref: headRef,
             children: thItems

package/dist/core/table/events.d.ts

@@ -7,9 +7,7 @@ export declare const SelectionEvent: FC<{
 }>;
 export declare const GroupEvent: FC<{
     hasChildren: boolean;
-    rowGroupConfig: SheetType.RowGroupConfig;
     data: SheetType.Cell[][];
     sheetInstance: SheetType.SheetInstance | null;
-    onGroupChange: (value: SheetType.RowGroupConfig) => void;
     onGridChange: (value: SheetType.Cell[][]) => void;
 }>;

package/dist/core/table/events.js

@@ -10,6 +10,8 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+/* eslint-disable @typescript-eslint/no-unused-vars */
+import { useGroup } from "../../hooks/useGroupConfig";
 import { SheetEvent } from "../sheet/Event";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -31,44 +33,34 @@ export var SelectionEvent = function SelectionEvent(props) {
 };
 export var GroupEvent = function GroupEvent(props) {
   var hasChildren = props.hasChildren,
-    rowGroupConfig = props.rowGroupConfig,
-    data = props.data,
-    sheetInstance = props.sheetInstance,
-    onGroupChange = props.onGroupChange,
-    onGridChange = props.onGridChange;
+    sheetInstance = props.sheetInstance;
+  var _useGroup = useGroup(),
+    _useGroup$config = _useGroup.config,
+    rowGroupConfig = _useGroup$config === void 0 ? {} : _useGroup$config,
+    onGroupChange = _useGroup.onChange;
   if (!hasChildren) return null;
-  var _ref = rowGroupConfig || {},
-    groups = _ref.groups;
+  var groups = rowGroupConfig.groups;
   return /*#__PURE__*/_jsxs(_Fragment, {
     children: [/*#__PURE__*/_jsx(SheetEvent, {
       name: "group-open",
       handler: function handler(e) {
-        var _ref2 = e,
-          row = _ref2.row;
-        var index = groups.findIndex(function (item) {
+        var _ref = e,
+          row = _ref.row;
+        var index = groups === null || groups === void 0 ? void 0 : groups.findIndex(function (item) {
           return item.groupStart === row;
         });
         if (index >= 0) {
-          var groupOpen = _toConsumableArray(rowGroupConfig.groupOpen);
-          groupOpen[index] = !rowGroupConfig.groupOpen[index];
+          var groupOpen = _toConsumableArray(rowGroupConfig === null || rowGroupConfig === void 0 ? void 0 : rowGroupConfig.groupOpen);
+          groupOpen[index] = !(rowGroupConfig !== null && rowGroupConfig !== void 0 && rowGroupConfig.groupOpen[index]);
           onGroupChange && onGroupChange(_objectSpread(_objectSpread({}, rowGroupConfig), {}, {
             groupOpen: groupOpen
           }));
-          var newGrid = _toConsumableArray(data);
-          newGrid[row] = _toConsumableArray(newGrid[row]);
-          newGrid[row][0] = _objectSpread(_objectSpread({}, newGrid[row][0]), {}, {
-            record: {
-              open: !!groupOpen[index]
-            }
-          });
-          onGridChange && onGridChange(newGrid);
           sheetInstance === null || sheetInstance === void 0 || sheetInstance.pushToHistory({
             type: 'Custom',
             changes: [],
             extraInfo: {
               extraType: 'group',
-              groupConfig: rowGroupConfig,
-              data: data
+              groupConfig: rowGroupConfig
             }
           });
         }
@@ -85,8 +77,7 @@ export var GroupEvent = function GroupEvent(props) {
           changes: [],
           extraInfo: {
             extraType: 'group',
-            groupConfig: rowGroupConfig,
-            data: data
+            groupConfig: rowGroupConfig
           }
         });
       }