shineout 3.7.0-beta.3 → 3.7.0-beta.5

package/dist/shineout.js

@@ -6780,7 +6780,11 @@ var arrowRight = [/*#__PURE__*/(0,jsx_runtime.jsx)("path", {
   clipRule: "evenodd",
   d: "M10.0625 17.9999C9.67198 18.3904 9.03881 18.3904 8.64829 17.9999C8.25776 17.6094 8.25776 16.9762 8.64829 16.5857L13.2341 11.9999L8.64829 7.41414C8.25776 7.02361 8.25776 6.39045 8.64829 5.99992C9.03881 5.6094 9.67198 5.6094 10.0625 5.99992L15.3554 11.2928C15.7459 11.6833 15.7459 12.3165 15.3554 12.707L10.0625 17.9999Z"
 }, '1')];
-var caretFill = ['M18.2213 9.72149L12.6348 15.2953C12.2444 15.6847 11.6125 15.6847 11.2222 15.2952L5.69827 9.78345C5.30731 9.39335 5.30662 8.76019 5.69671 8.36924C5.88295 8.18259 6.13536 8.07705 6.39902 8.07558L17.5094 8.0136C18.0617 8.01052 18.5119 8.45573 18.515 9.008C18.5165 9.27554 18.4107 9.53253 18.2213 9.72149Z'];
+var caretFill = /*#__PURE__*/(0,jsx_runtime.jsx)("path", {
+  fillRule: "evenodd",
+  clipRule: "evenodd",
+  d: "M18.262 9.92099L12.6754 15.4948C12.2851 15.8842 11.6531 15.8842 11.2628 15.4947L5.73891 9.98295C5.34796 9.59286 5.34727 8.95969 5.73736 8.56874C5.9236 8.3821 6.17601 8.27656 6.43967 8.27508L17.5501 8.2131C18.1024 8.21002 18.5526 8.65523 18.5556 9.2075C18.5571 9.47504 18.4514 9.73203 18.262 9.92099Z"
+});
 var imageCount = [/*#__PURE__*/(0,jsx_runtime.jsx)("path", {
   fillRule: "evenodd",
   clipRule: "evenodd",
@@ -7074,12 +7078,12 @@ var config = {
     Next: icons.ArrowRight,
     CollapseArrow: icons.ArrowLeft
   },
-  textarea: {
-    Close: icons.CloseFill
-  },
   tag: {
     Close: icons.Close
   },
+  textarea: {
+    Close: icons.CloseFill
+  },
   transfer: {
     DeleteAll: icons.Delete,
     DeleteItem: icons.Close,
@@ -12142,7 +12146,7 @@ var handleStyle = function handleStyle(style) {
 };
 /* harmony default export */ var jss_style_handleStyle = (handleStyle);
 ;// CONCATENATED MODULE: ../shineout-style/src/version.ts
-/* harmony default export */ var version = ('3.7.0-beta.3');
+/* harmony default export */ var version = ('3.7.0-beta.5');
 ;// CONCATENATED MODULE: ../shineout-style/src/jss-style/index.tsx
 
 
@@ -17247,7 +17251,8 @@ var cascaderStyle = objectSpread2_default()(objectSpread2_default()({
     minWidth: 0,
     position: 'relative',
     outline: 'none',
-    overflow: 'hidden'
+    maxHeight: 78,
+    overflow: 'auto'
   },
   result: {
     display: 'flex',
@@ -17393,7 +17398,9 @@ var cascaderStyle = objectSpread2_default()(objectSpread2_default()({
   iconWrapper: {
     display: 'flex',
     alignItems: 'center',
-    justifyContent: 'center'
+    justifyContent: 'center',
+    position: 'sticky',
+    top: 0
   },
   clearable: {},
   clearIcon: {
@@ -25527,19 +25534,9 @@ var switchStyle = objectSpread2_default()(objectSpread2_default()({
 var useSwitchStyle = styled(src_switch_switch, 'switch');
 
 /* harmony default export */ var shineout_style_src_switch = ((/* unused pure expression or super */ null && (useSwitchStyle)));
-;// CONCATENATED MODULE: ../shineout-style/src/mixin/custom-scrollbar.ts
-function customScrollBar(info) {
-  return {
-    'scrollbar-color': info.background,
-    '&::-webkit-scrollbar': {
-      background: info.background
-    }
-  };
-}
 ;// CONCATENATED MODULE: ../shineout-style/src/table/table.ts
 
 
-
 var cellBaseIndex = 4;
 var fixedIndex = 6;
 var resizeIndex = 8;
@@ -25734,13 +25731,22 @@ var tableStyle = objectSpread2_default()(objectSpread2_default()({
           zIndex: fixedIndex + 1
         }
       }
+    },
+    '$wrapper & table > tfoot': {
+      position: 'sticky',
+      bottom: 0,
+      zIndex: fixedIndex
     }
   },
   footWrapper: {
     flex: '0 0 auto',
-    // overflow: 'hidden',
     boxSizing: 'border-box',
-    background: src.tableTfootBackgroundColor
+    background: src.tableTfootBackgroundColor,
+    "[data-soui-role='scroll'] &": {
+      position: 'sticky',
+      bottom: 0,
+      zIndex: fixedIndex + 1
+    }
   },
   emptyWrapper: {
     minHeight: '170px',
@@ -25749,18 +25755,13 @@ var tableStyle = objectSpread2_default()(objectSpread2_default()({
     position: 'sticky',
     left: 0,
     top: 0,
-    right: 0,
     justifyContent: 'center',
     display: 'flex',
     alignItems: 'center',
     borderBottom: "1px solid ".concat(src.tableCellBorderColor)
   },
-  scrollY: {
-    '&$headWrapper, &$footWrapper': objectSpread2_default()({
-      overflowY: 'scroll'
-    }, customScrollBar({
-      background: 'transparent'
-    }))
+  emptyNoBorder: {
+    borderBottom: 'none'
   },
   cellFixedLeft: {
     position: 'sticky'
@@ -28298,8 +28299,8 @@ var treeSelectStyle = objectSpread2_default()(objectSpread2_default()({
     minWidth: 0,
     position: 'relative',
     outline: 'none',
-    overflow: 'hidden',
-    '&:hover': {}
+    maxHeight: 78,
+    overflow: 'auto'
   },
   result: {
     display: 'flex',
@@ -28431,7 +28432,9 @@ var treeSelectStyle = objectSpread2_default()(objectSpread2_default()({
   iconWrapper: {
     display: 'flex',
     alignItems: 'center',
-    justifyContent: 'center'
+    justifyContent: 'center',
+    position: 'sticky',
+    top: 0
   },
   clearable: {},
   clearIcon: {
@@ -47468,6 +47471,7 @@ var Modal = function Modal(props) {
           doc.style.paddingRight = "".concat(window.innerWidth - docSize.width, "px");
         }
       } else {
+        if (!context.isMask) return;
         doc.style.paddingRight = '';
         doc.style.overflow = '';
       }
@@ -47492,6 +47496,7 @@ var Modal = function Modal(props) {
         hasMask = false;
       }
       {
+        if (!context.isMask) return;
         var doc = document.body.parentNode;
         doc.style.paddingRight = '';
         doc.style.overflow = '';
@@ -49694,12 +49699,10 @@ var useForm = function useForm(props) {
       context.removeArr.delete(n);
       if (df !== undefined && deepGet(context.value, n) === undefined) {
         if (!context.mounted) context.defaultValues[n] = df;
-        setTimeout(function () {
-          onChange(function (v) {
-            deepSet(v, n, df, deepSetOptions);
-          });
-          update(n);
+        onChange(function (v) {
+          deepSet(v, n, df, deepSetOptions);
         });
+        update(n);
       }
     },
     unbind: function unbind(n, reserveAble, validateField, update) {
@@ -50527,7 +50530,7 @@ var FormFlow = function FormFlow(props) {
     return datum === null || datum === void 0 ? void 0 : datum.get(name);
   });
   var memoizedResult = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useMemo)(function () {
-    if (!props.strict) return;
+    if (!props.strict) return null;
     if (isFunc(props.children)) {
       return props.children(datum);
     }
@@ -59964,6 +59967,12 @@ var Sticky = function Sticky(props) {
     }
     return cancelParentObserver;
   }, [props.parent, css, context.target, top, bottom]);
+  (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
+    if (props.onChange) {
+      props.onChange(show);
+    }
+    ;
+  }, [show]);
 
   // 纯css方法 直接使用css
   // js方法
@@ -60134,6 +60143,147 @@ var BaseSwitch = function BaseSwitch(props) {
 var SwitchComp = src_switch_switch_0;
 SwitchComp.displayName = 'ShineoutSwitch';
 /* harmony default export */ var src_switch_0 = (SwitchComp);
+;// CONCATENATED MODULE: ../base/src/virtual-scroll/scroll-table.tsx
+
+
+
+
+
+
+var extractHeightValue = function extractHeightValue(num) {
+  if (isNumber(num)) return num;
+  var match = num.match(/(\d+)/);
+  if (match) {
+    return parseInt(match[0], 10);
+  }
+  return undefined;
+};
+var scroll_table_Scroll = function Scroll(props) {
+  var containerRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
+  var scrollRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
+  var wrapperRef = useForkRef(scrollRef, props.wrapperRef);
+  var _useRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)({
+      timer: null,
+      isMouseDown: false
+    }),
+    context = _useRef.current;
+  // TODO: keepScrollTop考虑做成Table的新feat?
+  var _props$scrollHeight = props.scrollHeight,
+    scrollHeight = _props$scrollHeight === void 0 ? 0 : _props$scrollHeight,
+    _props$scrollWidth = props.scrollWidth,
+    scrollWidth = _props$scrollWidth === void 0 ? 0 : _props$scrollWidth,
+    _props$defaultHeight = props.defaultHeight,
+    defaultHeight = _props$defaultHeight === void 0 ? 0 : _props$defaultHeight,
+    _props$keepScrollTop = props.keepScrollTop,
+    keepScrollTop = _props$keepScrollTop === void 0 ? false : _props$keepScrollTop;
+  var _useResize = useResize({
+      targetRef: containerRef,
+      timer: 100
+    }),
+    width = _useResize.width,
+    h = _useResize.height;
+  var height = h || defaultHeight;
+  var config = useConfig();
+  var isRtl = config.direction === 'rtl';
+  var scrollerStyle = {
+    flex: 1,
+    minWidth: 0,
+    minHeight: 0,
+    overflow: props.isEmptyContent ? 'hidden' : 'auto',
+    width: '100%'
+  };
+  var containerStyle = {
+    height: '100%',
+    width: '100%',
+    display: 'flex',
+    position: 'sticky',
+    flexDirection: 'column',
+    top: 0,
+    overflow: props.isEmptyContent ? 'auto' : undefined
+  };
+
+  // 当滚动容器的高度为 0 时，paddingTop 为 0，避免滚动条抖动现象
+  var paddingTop = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useMemo)(function () {
+    if (keepScrollTop) return Math.max(0, Math.floor(scrollHeight - height));
+    return height === 0 ? 0 : Math.max(0, Math.floor(scrollHeight - height));
+  }, [scrollHeight, height]);
+  var placeStyle = {
+    paddingTop: paddingTop,
+    width: scrollWidth,
+    overflow: props.isScrollY ? 'hidden' : 'auto hidden',
+    height: props.isScrollY ? 0 : 1,
+    marginTop: props.isScrollY ? 0 : -1,
+    lineHeight: 0
+  };
+  var handleScroll = usePersistFn(function (e) {
+    var onScrollToBottom = props.onScrollToBottom;
+    var target = e.currentTarget;
+    var scrollLeft = target.scrollLeft,
+      scrollTop = target.scrollTop;
+    if (props.height && onScrollToBottom) {
+      var realHeight = extractHeightValue(props.height);
+      if (realHeight !== undefined) {
+        var touchBottom = target.scrollHeight === scrollTop + realHeight;
+        if (touchBottom) onScrollToBottom();
+      }
+    }
+    var maxY = target.scrollHeight - target.clientHeight;
+    var maxX = target.scrollWidth - target.clientWidth;
+    if (!isRtl) {
+      // 解决浏览器缩放以后导致滚动条长度出现小数
+      if (maxX - scrollLeft < 0 || maxX - scrollLeft < 1) scrollLeft = maxX;
+      if (scrollLeft < 0) scrollLeft = 0;
+    } else {
+      if (maxX + scrollLeft < 0 || maxX + scrollLeft < 1) scrollLeft = 0 - maxX;
+      if (scrollLeft > 0) scrollLeft = 0;
+    }
+    if (scrollTop > maxY || maxY - scrollTop < 1) scrollTop = maxY;
+    if (scrollTop < 0) scrollTop = 0;
+    var x = maxX === 0 ? 0 : Math.min(Math.abs(scrollLeft) / maxX, 1);
+    var y = maxY === 0 ? 0 : Math.min(scrollTop / maxY, 1);
+    if (props.onScroll) props.onScroll({
+      scrollLeft: scrollLeft,
+      scrollTop: scrollTop,
+      x: x,
+      y: y,
+      height: height,
+      width: width,
+      fromDrag: context.isMouseDown
+    });
+  });
+  var handleInnerScroll = usePersistFn(function (e) {
+    var scrollTop = e.currentTarget.scrollTop;
+    if (scrollRef.current) {
+      e.currentTarget.scrollTop = 0;
+      scrollRef.current.scrollTop += scrollTop;
+    }
+  });
+  return /*#__PURE__*/(0,jsx_runtime.jsxs)("div", objectSpread2_default()(objectSpread2_default()({}, getDataAttribute({
+    role: 'scroll'
+  })), {}, {
+    style: scrollerStyle,
+    onScroll: handleScroll,
+    ref: wrapperRef,
+    onMouseDown: function onMouseDown() {
+      context.isMouseDown = true;
+    },
+    onMouseUp: function onMouseUp() {
+      context.isMouseDown = false;
+    },
+    children: [/*#__PURE__*/(0,jsx_runtime.jsx)("div", objectSpread2_default()(objectSpread2_default()({}, getDataAttribute({
+      role: 'scroll-container'
+    })), {}, {
+      style: containerStyle,
+      ref: containerRef,
+      onScroll: handleInnerScroll,
+      children: props.children
+    })), /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
+      style: placeStyle,
+      children: "\xA0"
+    })]
+  }));
+};
+/* harmony default export */ var scroll_table = (scroll_table_Scroll);
 ;// CONCATENATED MODULE: ../hooks/src/common/use-scrollbar-width/index.ts
 
 
@@ -60264,6 +60414,34 @@ var useColumns = function useColumns(props) {
 
 
 
+function getDecimalAndIntegerPart(num) {
+  if (!num) return [0, 0];
+  var str = num.toString();
+  var dotIndex = str.indexOf('.');
+  if (dotIndex === -1) return [parseInt(str), 0];
+  var integerPart = parseInt(str.slice(0, dotIndex));
+  var decimalPart = parseFloat("0.".concat(str.slice(dotIndex + 1)));
+  return [integerPart, decimalPart];
+}
+
+// 将所有的小数部分转移到最后一列
+function shiftDecimalToLastColumn(cols) {
+  var decimalSum = 0;
+  cols.forEach(function (v, i) {
+    var _getDecimalAndInteger = getDecimalAndIntegerPart(v),
+      _getDecimalAndInteger2 = slicedToArray_default()(_getDecimalAndInteger, 2),
+      inter = _getDecimalAndInteger2[0],
+      decimal = _getDecimalAndInteger2[1];
+    if (decimal > 0) {
+      decimalSum += decimal;
+      cols[i] = inter;
+    }
+  });
+  if (decimalSum > 0) {
+    cols[cols.length - 1] = Number(cols[cols.length - 1]) + decimalSum;
+  }
+  return cols;
+}
 var MIN_RESIZABLE_WIDTH = 20;
 function compareColumnWidth(curCols, preCols) {
   if (curCols.length !== preCols.length) return false;
@@ -60385,7 +60563,7 @@ var useTableLayout = function useTableLayout(props) {
     if (cols && cols.every(function (v) {
       return v === 0;
     })) return;
-    setColgroup(cols);
+    setColgroup(shiftDecimalToLastColumn(cols));
     setAdjust(adjust);
     if (!adjust) {
       updateResizeFlag();
@@ -60970,7 +61148,7 @@ var useTableVirtual = function useTableVirtual(props) {
     for (var i = 0; i <= index; i++) {
       sum += context.cachedHeight[i] || props.rowHeight;
     }
-    return sum;
+    return sum + props.theadAndTfootHeight;
   };
   var setRowHeight = usePersistFn(function (index, height) {
     if (props.disabled) return;
@@ -61190,7 +61368,7 @@ var useTableVirtual = function useTableVirtual(props) {
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
     if (props.disabled) return;
     setHeight(getContentHeight(props.data.length - 1));
-  }, [props.data.length]);
+  }, [props.data.length, props.theadAndTfootHeight]);
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
     if (props.disabled) return;
     if (context.heightCallback) {
@@ -61964,13 +62142,17 @@ var thead_toNum = toNum;
     });
   };
   var getFixedStyle = function getFixedStyle(fixed, index, colSpan, level) {
+    // 累加level 至 0 的所有高度
+    var top = context.trHeights.slice(0, level).reduce(function (a, b) {
+      return thead_toNum(a) + thead_toNum(b);
+    }, 0);
     if (fixed === 'left') {
       var left = colgroup.slice(0, index).reduce(function (a, b) {
         return thead_toNum(a) + thead_toNum(b);
       }, 0);
       return {
         left: left,
-        top: context.trHeights[level - 1] || 0,
+        top: top,
         position: 'sticky'
       };
     }
@@ -61980,12 +62162,12 @@ var thead_toNum = toNum;
       }, 0);
       return {
         right: right,
-        top: context.trHeights[level - 1] || 0,
+        top: top,
         position: 'sticky'
       };
     }
     return {
-      top: context.trHeights[level - 1] || 0,
+      top: top,
       position: 'sticky'
     };
   };
@@ -62202,16 +62384,6 @@ var useTableRow = function useTableRow(props) {
     }
     setHoverIndex(hoverIndex);
   });
-  var isCellHover = usePersistFn(function (rowIndex) {
-    var colSpan = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
-    if (!props.hover) return false;
-    var isHover = false;
-    for (var i = 0; i < colSpan; i++) {
-      isHover = hoverIndex.has(rowIndex + i);
-      if (isHover) break;
-    }
-    return isHover;
-  });
   var rowData = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useMemo)(function () {
     var rows = [];
     context.rowSelectMergeStartData = [];
@@ -62245,7 +62417,6 @@ var useTableRow = function useTableRow(props) {
   return {
     rowData: rowData,
     handleCellHover: handleCellHover,
-    isCellHover: isCellHover,
     hoverIndex: hoverIndex,
     rowSelectMergeStartData: context.rowSelectMergeStartData
   };
@@ -62268,20 +62439,31 @@ function useMemo(getValue, condition, shouldUpdate) {
 
 
 
+
 function Td(props) {
+  var _React$useState = external_root_React_commonjs2_react_commonjs_react_amd_react_default().useState(),
+    _React$useState2 = slicedToArray_default()(_React$useState, 2),
+    style = _React$useState2[0],
+    setStyle = _React$useState2[1];
+  (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
+    if (!props.style) return;
+    if (shallowEqual(props.style, style)) {
+      return;
+    }
+    setStyle(props.style);
+  }, [props.style]);
   var col = props.col,
     colSpan = props.colSpan,
     rowSpan = props.rowSpan,
     className = props.className,
-    style = props.style,
     direction = props.direction,
     role = props.role,
     onClick = props.onClick,
     onMouseEnter = props.onMouseEnter,
     onMouseLeave = props.onMouseLeave,
     renderContent = props.renderContent;
-  var externalDependencies = typeof_default()(props.shouldUpdate) === 'object' && props.shouldUpdate.dependencies ? props.shouldUpdate.dependencies : [];
-  var updateFn = typeof_default()(props.shouldUpdate) === 'object' && 'update' in props.shouldUpdate ? props.shouldUpdate.update : props.shouldUpdate;
+  var externalDependencies = typeof_default()(props.shouldCellUpdate) === 'object' && props.shouldCellUpdate.dependencies ? props.shouldCellUpdate.dependencies : [];
+  var updateFn = typeof_default()(props.shouldCellUpdate) === 'object' && 'update' in props.shouldCellUpdate ? props.shouldCellUpdate.update : props.shouldCellUpdate;
   var $td = useMemo(function () {
     var content = renderContent(props.col, props.data);
     return /*#__PURE__*/(0,jsx_runtime.jsx)("td", {
@@ -62359,13 +62541,14 @@ var Tr = function Tr(props) {
         right: right
       };
     }
-    return {};
+    return undefined;
   };
-  var getTdStyle = function getTdStyle(column, colSpan) {
+  var getTdStyle = usePersistFn(function (column, colSpan) {
     var index = column.index;
     var fixedStyle = getFixedStyle(column.fixed, index, colSpan);
+    if (!fixedStyle && !column.style) return;
     return objectSpread2_default()(objectSpread2_default()({}, column.style), fixedStyle);
-  };
+  });
   var handleCellClick = usePersistFn(function (data, colIndex) {
     if (!props.onCellClick) return;
     props.onCellClick(data, {
@@ -62428,7 +62611,7 @@ var Tr = function Tr(props) {
       return _ref.apply(this, arguments);
     };
   }());
-  var renderTreeExpand = function renderTreeExpand(content) {
+  var renderTreeExpand = usePersistFn(function (content) {
     var treeIndent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 22;
     var level = props.treeExpandLevel.get(props.originKey) || 0;
     var className = tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.expandWrapper;
@@ -62481,8 +62664,8 @@ var Tr = function Tr(props) {
       },
       children: [$expandIconWrapper, content]
     });
-  };
-  var renderContent = function renderContent(col, data) {
+  });
+  var renderContent = usePersistFn(function (col, data) {
     if (col.type === 'expand' || col.type === 'row-expand') {
       var renderResult = typeof col.render === 'function' ? col.render(props.rawData, props.rowIndex) : undefined;
       if (typeof renderResult !== 'function') return null;
@@ -62548,8 +62731,8 @@ var Tr = function Tr(props) {
       return renderTreeExpand(content, col.treeIndent);
     }
     return content;
-  };
-  var renderTds = function renderTds(cols, data) {
+  });
+  var renderTds = usePersistFn(function (cols, data) {
     var tds = [];
     var skip = 0;
     var lastRowIndex = data.length - 1;
@@ -62565,27 +62748,37 @@ var Tr = function Tr(props) {
       if (data[i]) {
         var last = cols[i + (data[i].colSpan || 1) - 1] || {};
         var isRowSpanTd = data[i].rowSpan > 1;
+        var shouldBindMouseEvent = props.hover && hasSiblingRowSpan || isRowSpanTd;
+        var showCellHover = props.hoverIndex.has(props.rowIndex);
+        if (!showCellHover && data[i].rowSpan > 1) {
+          for (var j = 0; j < data[i].rowSpan; j++) {
+            if (props.hoverIndex.has(props.rowIndex + j)) {
+              showCellHover = true;
+              break;
+            }
+          }
+        }
         var td = /*#__PURE__*/(0,jsx_runtime.jsx)(Td, {
           col: col,
           data: data[i].data,
           colSpan: data[i].colSpan,
           rowSpan: data[i].rowSpan,
-          onMouseEnter: props.hover && hasSiblingRowSpan || isRowSpanTd ? function () {
-            props.handleCellHover(props.rowIndex, data[i].rowSpan);
+          onMouseEnter: shouldBindMouseEvent ? function () {
+            return props.handleCellHover(props.rowIndex, data[i].rowSpan);
           } : undefined,
-          onMouseLeave: props.hover && hasSiblingRowSpan || isRowSpanTd ? function () {
-            props.handleCellHover(-1, 0);
+          onMouseLeave: shouldBindMouseEvent ? function () {
+            return props.handleCellHover(-1, 0);
           } : undefined,
-          className: classnames_default()(col.className, col.type === 'checkbox' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellCheckbox), col.fixed === 'left' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellFixedLeft), col.fixed === 'right' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellFixedRight), col.align === 'center' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellAlignCenter), col.align === 'right' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellAlignRight), (col.lastFixed || col.firstFixed || last.lastFixed) && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellFixedLast), lastRowIndex === i && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellIgnoreBorder), props.hoverIndex.has(props.rowIndex) && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellHover), isRowSpanTd && props.isCellHover(props.rowIndex, data[i].rowSpan) && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellHover)),
+          className: classnames_default()(col.className, col.type === 'checkbox' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellCheckbox), col.fixed === 'left' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellFixedLeft), col.fixed === 'right' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellFixedRight), col.align === 'center' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellAlignCenter), col.align === 'right' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellAlignRight), (col.lastFixed || col.firstFixed || last.lastFixed) && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellFixedLast), lastRowIndex === i && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellIgnoreBorder), showCellHover && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.cellHover)),
           style: getTdStyle(col, data[i].colSpan),
           direction: config.direction,
           "data-role": col.type === 'checkbox' ? 'checkbox' : undefined,
           onClick: props.onCellClick ? function () {
             return handleCellClick(data[i].data, i);
           } : undefined,
-          shouldUpdate: col.shouldUpdate,
+          shouldCellUpdate: col.shouldCellUpdate || props.shouldCellUpdate,
           renderContent: renderContent
-        });
+        }, "".concat(col.key, "-").concat(props.rowIndex, "-").concat(i));
         tds.push(td);
         if (data[i].colSpan) skip = data[i].colSpan - 1;
       }
@@ -62594,7 +62787,7 @@ var Tr = function Tr(props) {
       if (_loop(i)) continue;
     }
     return tds;
-  };
+  });
   var renderExpand = function renderExpand() {
     if (!props.expanded) return null;
     var expandCol = props.expandCol;
@@ -62703,7 +62896,6 @@ var Tr = function Tr(props) {
       hover: hover
     }),
     rowData = _useTableRow.rowData,
-    isCellHover = _useTableRow.isCellHover,
     handleCellHover = _useTableRow.handleCellHover,
     hoverIndex = _useTableRow.hoverIndex,
     rowSelectMergeStartData = _useTableRow.rowSelectMergeStartData;
@@ -62711,9 +62903,10 @@ var Tr = function Tr(props) {
     return col.type === 'expand' || col.type === 'row-expand';
   });
   var renderRow = function renderRow(item, index) {
+    var _props$rowEvents;
     var rowIndex = index + currentIndex;
     var originKey = getKey(props.keygen, item, rowIndex);
-    var trRenderKey = props.loader ? originKey : "".concat(originKey, "-").concat(rowIndex);
+    var trRenderKey = props.loader || (_props$rowEvents = props.rowEvents) !== null && _props$rowEvents !== void 0 && _props$rowEvents.draggable ? originKey : "".concat(originKey, "-").concat(rowIndex);
     return /*#__PURE__*/(0,jsx_runtime.jsx)(tr, {
       originKey: originKey,
       row: rowData[index],
@@ -62740,7 +62933,6 @@ var Tr = function Tr(props) {
       setRowHeight: props.setRowHeight,
       striped: props.striped,
       radio: props.radio,
-      isCellHover: isCellHover,
       hover: hover,
       isSelect: props.datum.check(rowSelectMergeStartData[index]),
       handleCellHover: handleCellHover
@@ -62754,7 +62946,8 @@ var Tr = function Tr(props) {
       bodyScrollWidth: props.bodyScrollWidth,
       resizeFlag: props.resizeFlag,
       treeCheckAll: props.treeCheckAll,
-      onCellClick: props.onCellClick
+      onCellClick: props.onCellClick,
+      shouldCellUpdate: props.shouldCellUpdate
     }, trRenderKey);
   };
   return /*#__PURE__*/(0,jsx_runtime.jsx)("tbody", {
@@ -62897,19 +63090,6 @@ var table_excluded = ["data"];
 
 var table_devUseWarning = devUseWarning;
 var table_emptyArr = [];
-var virtualScrollerStyle = {
-  flex: 1,
-  minWidth: 0,
-  minHeight: 0,
-  overflow: 'auto',
-  width: '100%'
-};
-var scrollWrapperStyle = {
-  flex: 1,
-  minHeight: 0,
-  minWidth: 0,
-  display: 'flex'
-};
 var emptyRef = {
   current: null
 };
@@ -62931,15 +63111,6 @@ var emptyRef = {
   var mirrorScrollRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
   var tableRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
   var browserScrollbarWidth = useScrollbarWidth();
-  var emptyStyle = objectSpread2_default()(objectSpread2_default()({}, virtualScrollerStyle), {}, {
-    overflow: 'auto hidden',
-    position: 'absolute',
-    zIndex: 1,
-    bottom: 0,
-    left: 0,
-    right: 0,
-    height: browserScrollbarWidth
-  });
   if (props.fixed) {
     table_devUseWarning.deprecated('fixed', 'virtual', 'Table');
   }
@@ -62960,7 +63131,8 @@ var emptyRef = {
     };
   };
   var _useRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)({
-      emptyHeight: 0
+      emptyHeight: 0,
+      theadAndTfootHeight: 0
     }),
     context = _useRef.current;
   var virtual = ((_props$data = props.data) === null || _props$data === void 0 ? void 0 : _props$data.length) && props.rowsInView !== 0 && (!!props.virtual || props.fixed === 'both' || props.fixed === 'y' || props.fixed === 'auto');
@@ -63092,6 +63264,10 @@ var emptyRef = {
     onChange: inputableData.onChange,
     disabled: props.disabled
   });
+  (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
+    var _theadRef$current, _tfootRef$current;
+    context.theadAndTfootHeight = ((theadRef === null || theadRef === void 0 || (_theadRef$current = theadRef.current) === null || _theadRef$current === void 0 ? void 0 : _theadRef$current.clientHeight) || 0) + (((_tfootRef$current = tfootRef.current) === null || _tfootRef$current === void 0 ? void 0 : _tfootRef$current.clientHeight) || 0);
+  }, [theadRef.current, tfootRef.current]);
   var virtualInfo = use_table_virtual({
     disabled: !virtual,
     data: treeData,
@@ -63102,8 +63278,11 @@ var emptyRef = {
     scrollRef: scrollRef,
     innerRef: tbodyRef,
     scrollLeft: props.scrollLeft,
-    isRtl: isRtl
+    isRtl: isRtl,
+    theadAndTfootHeight: context.theadAndTfootHeight
   });
+
+  // 简单表格的滚动事件
   var handleBodyScroll = usePersistFn(function (e) {
     var target = e.currentTarget;
     if (!target) return;
@@ -63119,6 +63298,8 @@ var emptyRef = {
       props.onScroll(x, y, target.scrollLeft, target.scrollTop);
     }
   });
+
+  // 虚拟表格的滚动事件
   var handleVirtualScroll = usePersistFn(function (info) {
     virtualInfo.handleScroll(info);
     layoutFunc.checkFloat();
@@ -63133,7 +63314,7 @@ var emptyRef = {
     var _props$data2;
     if (!((_props$data2 = props.data) !== null && _props$data2 !== void 0 && _props$data2.length) || filteredData !== undefined && filteredData.length === 0) {
       return /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
-        className: tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.emptyWrapper,
+        className: classnames_default()(tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.emptyWrapper, isScrollX && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.emptyNoBorder)),
         ref: function ref(el) {
           context.emptyHeight = (el === null || el === void 0 ? void 0 : el.clientHeight) || 0;
         },
@@ -63180,7 +63361,8 @@ var emptyRef = {
       bodyScrollWidth: scrollWidth,
       resizeFlag: resizeFlag,
       treeCheckAll: props.treeCheckAll,
-      onCellClick: props.onCellClick
+      onCellClick: props.onCellClick,
+      shouldCellUpdate: props.shouldCellUpdate
     };
     var headCommonProps = {
       disabled: props.disabled,
@@ -63223,9 +63405,8 @@ var emptyRef = {
       parent: tableRef === null || tableRef === void 0 ? void 0 : tableRef.current
     };
     var isRenderVirtualTable = virtual || props.sticky || !((_props$data3 = props.data) !== null && _props$data3 !== void 0 && _props$data3.length);
-    var headWrapperClass = classnames_default()(tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.headWrapper // isScrollY && scrollBarWidth && tableClasses?.scrollY,
-    );
-    var footWrapperClass = classnames_default()(tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.footWrapper, isScrollY && scrollBarWidth && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.scrollY));
+    var headWrapperClass = classnames_default()(tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.headWrapper);
+    var footWrapperClass = classnames_default()(tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.footWrapper);
     var renderHeadMirrorScroller = function renderHeadMirrorScroller() {
       var _scrollRef$current, _scrollRef$current2, _scrollRef$current3;
       if (!props.showTopScrollbar) return null;
@@ -63263,17 +63444,16 @@ var emptyRef = {
       }));
     };
     if (isRenderVirtualTable) {
-      var _props$data4;
+      var _props$data4, _props$data5;
       return /*#__PURE__*/(0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
-        children: [renderHeadMirrorScroller(), /*#__PURE__*/(0,jsx_runtime.jsxs)(virtual_scroll_scroll, {
-          style: scrollWrapperStyle,
-          scrollerStyle: (_props$data4 = props.data) !== null && _props$data4 !== void 0 && _props$data4.length ? virtualScrollerStyle : emptyStyle,
+        children: [renderHeadMirrorScroller(), /*#__PURE__*/(0,jsx_runtime.jsxs)(scroll_table, {
           wrapperRef: scrollRef,
           scrollWidth: width || 1,
           scrollHeight: virtual ? virtualInfo.scrollHeight : tbodyHeight,
           onScroll: handleVirtualScroll,
           defaultHeight: context.emptyHeight,
           isScrollY: isScrollY,
+          isEmptyContent: !((_props$data4 = props.data) !== null && _props$data4 !== void 0 && _props$data4.length),
           children: [!props.hideHeader && /*#__PURE__*/(0,jsx_runtime.jsx)(StickyWrapper, objectSpread2_default()(objectSpread2_default()({}, props.sticky ? stickyProps : {}), {}, {
             children: /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
               className: headWrapperClass,
@@ -63285,7 +63465,7 @@ var emptyRef = {
                 children: [Group, /*#__PURE__*/(0,jsx_runtime.jsx)(thead, objectSpread2_default()({}, headCommonProps))]
               })
             })
-          })), /*#__PURE__*/(0,jsx_runtime.jsxs)("table", {
+          })), !!((_props$data5 = props.data) !== null && _props$data5 !== void 0 && _props$data5.length) && /*#__PURE__*/(0,jsx_runtime.jsxs)("table", {
             style: {
               width: width,
               transform: virtualInfo.getTranslate()
@@ -63305,8 +63485,8 @@ var emptyRef = {
               ref: tfootRef,
               children: [Group, /*#__PURE__*/(0,jsx_runtime.jsx)(tfoot, objectSpread2_default()({}, footCommonProps))]
             })
-          }) : null]
-        }), renderEmpty()]
+          }) : null, renderEmpty()]
+        })]
       });
     }
     return /*#__PURE__*/(0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
@@ -69718,7 +69898,7 @@ var upload_interface = __webpack_require__(8821);
 
 
 /* harmony default export */ var src_0 = ({
-  version: '3.7.0-beta.3'
+  version: '3.7.0-beta.5'
 });
 }();
 /******/ 	return __webpack_exports__;