shineout 3.7.0-beta.6 → 3.7.0-beta.8

package/dist/shineout.js

@@ -12217,7 +12217,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.6');
+/* harmony default export */ var version = ('3.7.0-beta.8');
 ;// CONCATENATED MODULE: ../shineout-style/src/jss-style/index.tsx
 
 
@@ -25795,8 +25795,11 @@ var tableStyle = objectSpread2_default()(objectSpread2_default()({
       borderTop: "1px solid ".concat(src.tableCellBorderColor)
     }
   },
-  headMirrorScroller: {
-    overflow: 'scroll hidden'
+  mirrorScroller: {
+    overflow: 'scroll hidden',
+    '[data-soui-sticky="false"] &': {
+      display: 'none'
+    }
   },
   headWrapper: {
     flex: '0 0 auto',
@@ -28649,8 +28652,8 @@ var treeSelectStyle = objectSpread2_default()(objectSpread2_default()({
     visibility: 'hidden'
   },
   moreWrapper: {
-    width: 248,
-    height: 72,
+    maxWidth: 400,
+    maxHeight: 160,
     overflow: 'auto',
     padding: "".concat(src.treeSelectMorePaddingY, " ").concat(src.treeSelectMorePaddingX)
   },
@@ -29976,19 +29979,6 @@ var usePopup = function usePopup(props) {
   };
 };
 /* harmony default export */ var use_popup = (usePopup);
-;// CONCATENATED MODULE: ../hooks/src/utils/attribute.ts
-var getDataAttribute = function getDataAttribute(attrs) {
-  return Object.keys(attrs).reduce(function (acc, key) {
-    var ns = "data-soui-".concat(key);
-    if (attrs[key] !== undefined) {
-      acc[ns] = attrs[key];
-    }
-    return acc;
-  }, {});
-};
-var getDataAttributeName = function getDataAttributeName(name) {
-  return "data-soui-".concat(name);
-};
 ;// CONCATENATED MODULE: ../hooks/src/utils/func.ts
 // 节流函数
 var throttle = function throttle(func, wait) {
@@ -30207,6 +30197,19 @@ var getFieldId = function getFieldId(name, formName) {
   if (!name) return undefined;
   return "".concat(formName ? "".concat(formName, "_") : '').concat(name);
 };
+;// CONCATENATED MODULE: ../hooks/src/utils/attribute.ts
+var getDataAttribute = function getDataAttribute(attrs) {
+  return Object.keys(attrs).reduce(function (acc, key) {
+    var ns = "data-soui-".concat(key);
+    if (attrs[key] !== undefined) {
+      acc[ns] = attrs[key];
+    }
+    return acc;
+  }, {});
+};
+var getDataAttributeName = function getDataAttributeName(name) {
+  return "data-soui-".concat(name);
+};
 ;// CONCATENATED MODULE: ../hooks/src/common/use-position-style/get-position-style.ts
 
 var ReverseDir = {
@@ -30648,13 +30651,6 @@ var usePositionStyle = function usePositionStyle(config) {
         style.right = containerRect.right - rect.right + containerScrollBarWidth - containerScroll.left - (offset ? offset[0] : 0);
         style.left = 'auto';
         style.transform = '';
-        if (adjust) {
-          overLeft = bodyRect.left - (rect.right - context.popUpWidth);
-          if (style.right < 0 && targetRect) {
-            style.left = bodyRect.width - targetRect.width;
-            style.right = 'auto';
-          }
-        }
       } else {
         // 居中对齐
         style.left = rect.left + rect.width / 2 - containerRect.left + containerScroll.left;
@@ -31526,6 +31522,7 @@ var AbsoluteList = function AbsoluteList(props) {
 
 
 
+
 var emptyEvent = function emptyEvent(e) {
   return e.stopPropagation();
 };
@@ -31585,7 +31582,17 @@ var Popover = function Popover(props) {
     Provider = _usePopup.Provider,
     providerValue = _usePopup.providerValue;
   var events = getTargetProps();
+  var _React$useState = external_root_React_commonjs2_react_commonjs_react_amd_react_default().useState(0),
+    _React$useState2 = slicedToArray_default()(_React$useState, 2),
+    updateKey = _React$useState2[0],
+    setUpdateKey = _React$useState2[1];
+  var handleUpdateKey = function handleUpdateKey() {
+    setUpdateKey(function (prev) {
+      return (prev + 1) % 2;
+    });
+  };
   var bindEvents = function bindEvents() {
+    var _window;
     var targetEl = targetRef.current;
     if (!targetEl) return;
     if (events.onMouseEnter) targetEl.addEventListener('mouseenter', events.onMouseEnter);
@@ -31595,8 +31602,14 @@ var Popover = function Popover(props) {
     if (trigger === 'hover' && props.clickToCancelDelay && props.mouseEnterDelay) {
       targetEl.addEventListener('click', closePop);
     }
+    (_window = window) === null || _window === void 0 || _window.addEventListener('resize', handleUpdateKey);
+    var scrollContainer = getClosestScrollContainer(targetEl);
+    if (scrollContainer) {
+      scrollContainer.addEventListener('scroll', handleUpdateKey);
+    }
   };
   var unbindEvents = function unbindEvents() {
+    var _window2;
     var targetEl = targetRef.current;
     if (!targetEl) return;
     var events = getTargetProps();
@@ -31604,6 +31617,11 @@ var Popover = function Popover(props) {
     if (events.onMouseLeave) targetEl.removeEventListener('mouseleave', events.onMouseLeave);
     if (events.onClick) targetEl.removeEventListener('click', events.onClick);
     targetEl.removeEventListener('click', closePop);
+    (_window2 = window) === null || _window2 === void 0 || _window2.removeEventListener('resize', handleUpdateKey);
+    var scrollContainer = getClosestScrollContainer(targetEl);
+    if (scrollContainer) {
+      scrollContainer.addEventListener('scroll', handleUpdateKey);
+    }
   };
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
     bindEvents();
@@ -31665,6 +31683,7 @@ var Popover = function Popover(props) {
     adjust: props.adjust,
     lazy: props.lazy,
     offset: props.offset,
+    updateKey: updateKey,
     children: /*#__PURE__*/(0,jsx_runtime.jsxs)("div", objectSpread2_default()(objectSpread2_default()(objectSpread2_default()({
       className: classnames_default()(className, popoverStyle === null || popoverStyle === void 0 ? void 0 : popoverStyle.rootClass, popoverStyle === null || popoverStyle === void 0 ? void 0 : popoverStyle.wrapper, open && (popoverStyle === null || popoverStyle === void 0 ? void 0 : popoverStyle.wrapperOpen), !showArrow && (popoverStyle === null || popoverStyle === void 0 ? void 0 : popoverStyle.hideArrow)),
       style: containerStyle
@@ -41376,8 +41395,9 @@ var Cascader = function Cascader(props0) {
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
     if (!value) return;
     datum.setValue(value);
+    if (!open) return;
     updatePathByValue();
-  }, [value]);
+  }, [value, open]);
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
     if (filterText !== undefined) {
       updatePath();
@@ -41888,6 +41908,7 @@ var validate = function validate(value, formData, rules, p) {
 
 
 
+
 var getValue = function getValue(name, formValue) {
   if (!name) return undefined;
   if (isArray(name)) {
@@ -41927,6 +41948,10 @@ function useFormControl(props) {
     _React$useState2 = slicedToArray_default()(_React$useState, 2),
     errorState = _React$useState2[0],
     setErrorState = _React$useState2[1];
+  var _React$useRef = external_root_React_commonjs2_react_commonjs_react_amd_react_default().useRef({
+      mounted: false
+    }),
+    context = _React$useRef.current;
   var value;
   var error = errorState;
   var inForm = false;
@@ -42086,7 +42111,11 @@ function useFormControl(props) {
       } else {
         controlFunc.bind(name, defaultValue, validateField, update);
       }
+      if (context.mounted) {
+        devUseWarning.warn('Please avoid modifying the name property after the component has mounted, as this may result in unintended behavior or errors.');
+      }
     }
+    context.mounted = true;
     return function () {
       if (inForm && controlFunc) {
         if (isArray(name)) {
@@ -49783,8 +49812,10 @@ var useForm = function useForm(props) {
         context.updateMap[n] = new Set();
       }
       context.updateMap[n].add(updateFn);
+      var shouldTriggerResetChange = context.removeArr.has(n);
       context.removeArr.delete(n);
-      if (df !== undefined && deepGet(context.value, n) === undefined) {
+      var shouldTriggerDefaultChange = df !== undefined && deepGet(context.value, n) === undefined;
+      if (shouldTriggerDefaultChange || shouldTriggerResetChange) {
         if (!context.mounted) context.defaultValues[n] = df;
         onChange(function (v) {
           deepSet(v, n, df, deepSetOptions);
@@ -50152,6 +50183,7 @@ var UseFormItem = function UseFormItem() {
 
 
 
+
 var tooltip_devUseWarning = devUseWarning;
 var defaultDelay = 0;
 var Tooltip = function Tooltip(props) {
@@ -50193,14 +50225,30 @@ var Tooltip = function Tooltip(props) {
     popupRef = _usePopup.popupRef,
     closePop = _usePopup.closePop;
   var events = getTargetProps();
+  var _React$useState = external_root_React_commonjs2_react_commonjs_react_amd_react_default().useState(0),
+    _React$useState2 = slicedToArray_default()(_React$useState, 2),
+    updateKey = _React$useState2[0],
+    setUpdateKey = _React$useState2[1];
+  var handleUpdateKey = function handleUpdateKey() {
+    setUpdateKey(function (prev) {
+      return (prev + 1) % 2;
+    });
+  };
   var bindEvents = function bindEvents() {
+    var _window;
     var targetEl = targetRef.current;
     if (!targetEl) return;
     if (events.onMouseEnter) targetEl.addEventListener('mouseenter', events.onMouseEnter);
     if (events.onMouseLeave) targetEl.addEventListener('mouseleave', events.onMouseLeave);
     if (events.onClick) targetEl.addEventListener('click', events.onClick);
+    (_window = window) === null || _window === void 0 || _window.addEventListener('resize', handleUpdateKey);
+    var scrollContainer = getClosestScrollContainer(targetEl);
+    if (scrollContainer) {
+      scrollContainer.addEventListener('scroll', handleUpdateKey);
+    }
   };
   var unbindEvents = function unbindEvents() {
+    var _window2;
     var targetEl = targetRef.current;
     if (!targetEl) return;
     var events = getTargetProps();
@@ -50208,6 +50256,11 @@ var Tooltip = function Tooltip(props) {
     if (events.onMouseLeave) targetEl.removeEventListener('mouseleave', events.onMouseLeave);
     if (events.onClick) targetEl.removeEventListener('click', events.onClick);
     targetEl.removeEventListener('click', closePop);
+    (_window2 = window) === null || _window2 === void 0 || _window2.removeEventListener('resize', handleUpdateKey);
+    var scrollContainer = getClosestScrollContainer(targetEl);
+    if (scrollContainer) {
+      scrollContainer.addEventListener('scroll', handleUpdateKey);
+    }
   };
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
     if (!persistent) return;
@@ -50251,6 +50304,7 @@ var Tooltip = function Tooltip(props) {
       popupGap: 0,
       zIndex: zIndex,
       adjust: popsitionProps === 'auto',
+      updateKey: updateKey,
       children: /*#__PURE__*/(0,jsx_runtime.jsxs)("div", objectSpread2_default()(objectSpread2_default()({
         className: classnames_default()(className, tooltipClasses === null || tooltipClasses === void 0 ? void 0 : tooltipClasses.rootClass, tooltipClasses === null || tooltipClasses === void 0 ? void 0 : tooltipClasses.wrapper, open && (tooltipClasses === null || tooltipClasses === void 0 ? void 0 : tooltipClasses.wrapperOpen)),
         style: {
@@ -54248,6 +54302,7 @@ var TreeVirtual = function TreeVirtual(props) {
     height = props.height,
     _props$lineHeight = props.lineHeight,
     lineHeight = _props$lineHeight === void 0 ? 36 : _props$lineHeight,
+    rowsInView = props.rowsInView,
     line = props.line,
     mode = props.mode,
     contentClass = props.contentClass,
@@ -54309,7 +54364,7 @@ var TreeVirtual = function TreeVirtual(props) {
   return /*#__PURE__*/(0,jsx_runtime.jsx)(virtual_scroll_list, {
     data: datum.dataFlat,
     height: height,
-    rowsInView: 10,
+    rowsInView: rowsInView,
     scrollerStyle: {
       height: '100%',
       width: '100%',
@@ -54329,7 +54384,7 @@ var TreeVirtual = function TreeVirtual(props) {
 
 
 
-var tree_excluded = ["jssStyle", "line", "childrenKey", "data", "value", "mode", "keygen", "virtual", "expanded", "expandIcons", "iconClass", "leafClass", "nodeClass", "contentClass", "rootStyle", "renderItem", "defaultValue", "dataUpdate", "childrenClass", "defaultExpandAll", "defaultExpanded", "parentClickExpand", "doubleClickExpand", "dragImageSelector", "dragImageStyle", "dragSibling", "unmatch", "ignoreSetFlat", "dragHoverExpand", "active", "setActive", "disabled", "inlineNode", "highlight", "className", "onClick", "loader", "getDatum", "onDrop", "onExpand", "onChange", "onDragEnd", "onDragLeave", "onDragOver", "onDragStart", "datum", "actionOnClick", "tiledData"];
+var tree_excluded = ["jssStyle", "line", "childrenKey", "data", "value", "mode", "keygen", "virtual", "expanded", "expandIcons", "iconClass", "leafClass", "nodeClass", "contentClass", "rootStyle", "renderItem", "defaultValue", "dataUpdate", "childrenClass", "defaultExpandAll", "defaultExpanded", "parentClickExpand", "doubleClickExpand", "dragImageSelector", "dragImageStyle", "dragSibling", "unmatch", "ignoreSetFlat", "dragHoverExpand", "active", "setActive", "disabled", "inlineNode", "highlight", "className", "onClick", "loader", "getDatum", "onDrop", "onExpand", "onChange", "onDragEnd", "onDragLeave", "onDragOver", "onDragStart", "datum", "rowsInView", "actionOnClick", "tiledData"];
 
 
 
@@ -54391,6 +54446,8 @@ var Tree = function Tree(props) {
     onDragOver = props.onDragOver,
     onDragStart = props.onDragStart,
     propsDatum = props.datum,
+    _props$rowsInView = props.rowsInView,
+    rowsInView = _props$rowsInView === void 0 ? 20 : _props$rowsInView,
     actionOnClick = props.actionOnClick,
     tiledData = props.tiledData,
     rest = objectWithoutProperties_default()(props, tree_excluded);
@@ -54550,6 +54607,7 @@ var Tree = function Tree(props) {
       return /*#__PURE__*/(0,jsx_runtime.jsx)(tree_virtual, objectSpread2_default()(objectSpread2_default()({}, props), {}, {
         data: data,
         line: line,
+        rowsInView: rowsInView,
         expanded: expanded,
         height: realHeight,
         childrenKey: props.childrenKey || 'children',
@@ -60097,12 +60155,15 @@ var Sticky = function Sticky(props) {
     pointerEvents: 'none'
   };
   return /*#__PURE__*/(0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
-    children: [isFixed ? StickyEl : context.target && context.div && /*#__PURE__*/(0,external_root_ReactDOM_commonjs2_react_dom_commonjs_react_dom_amd_react_dom_.createPortal)(StickyEl, context.div), /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
+    children: [isFixed ? StickyEl : context.target && context.div && /*#__PURE__*/(0,external_root_ReactDOM_commonjs2_react_dom_commonjs_react_dom_amd_react_dom_.createPortal)(StickyEl, context.div), /*#__PURE__*/(0,jsx_runtime.jsx)("div", objectSpread2_default()(objectSpread2_default()({
       className: props.className,
       style: objectSpread2_default()(objectSpread2_default()({}, props.style), show && parentVisible ? hideStyle : {}),
-      ref: handleElementRef,
+      ref: handleElementRef
+    }, getDataAttribute({
+      sticky: show && parentVisible ? 'true' : 'false'
+    })), {}, {
       children: children
-    })]
+    }))]
   });
 };
 /* harmony default export */ var src_sticky_sticky = (Sticky);
@@ -60248,7 +60309,6 @@ var extractHeightValue = function extractHeightValue(num) {
   return undefined;
 };
 var scroll_table_Scroll = function Scroll(props) {
-  var _scrollRef$current, _scrollRef$current2;
   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);
@@ -60279,10 +60339,7 @@ var scroll_table_Scroll = function Scroll(props) {
     flex: 1,
     minWidth: 0,
     minHeight: 0,
-    // 原生css sticky机制根据最近的父元素的overflow来决定是否sticky
-    // isHeaderSticky: 这种场景非内滚的时候，设置scroll元素的overflow为initial
-    // isEmptyContent: 这种场景，把scroll元素的overflow设置为hidden,把overflow: auto转交给下面的container元素
-    overflow: props.isEmptyContent ? 'hidden' : props.isHeaderSticky && (scrollRef === null || scrollRef === void 0 || (_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 ? void 0 : _scrollRef$current.scrollHeight) === (scrollRef === null || scrollRef === void 0 || (_scrollRef$current2 = scrollRef.current) === null || _scrollRef$current2 === void 0 ? void 0 : _scrollRef$current2.clientHeight) ? 'initial' : 'auto',
+    overflow: 'auto',
     width: '100%'
   };
   var containerStyle = {
@@ -60291,9 +60348,7 @@ var scroll_table_Scroll = function Scroll(props) {
     display: 'flex',
     position: 'sticky',
     flexDirection: 'column',
-    top: 0,
-    // isEmptyContent: overflow设置为auto是为了让empty元素可以sticky left:0 生效
-    overflow: props.isEmptyContent ? 'auto' : undefined
+    top: 0
   };
 
   // 当滚动容器的高度为 0 时，paddingTop 为 0，避免滚动条抖动现象
@@ -60352,30 +60407,34 @@ var scroll_table_Scroll = function Scroll(props) {
       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'
+  return /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
+    className: props.className,
+    style: props.style,
+    children: /*#__PURE__*/(0,jsx_runtime.jsxs)("div", objectSpread2_default()(objectSpread2_default()({}, getDataAttribute({
+      role: 'scroll'
     })), {}, {
-      style: containerStyle,
-      ref: containerRef,
-      onScroll: handleInnerScroll,
-      children: props.children
-    })), /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
-      style: placeStyle,
-      children: "\xA0"
-    })]
-  }));
+      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
@@ -61229,13 +61288,6 @@ var useTableVirtual = function useTableVirtual(props) {
       autoAddRows: 0
     }),
     context = _useRef.current;
-  var getTranslate = usePersistFn(function (left, top) {
-    var t = top === undefined ? innerTop + offsetY : top;
-    if (t < 0) {
-      t = 0;
-    }
-    return "translate3d(0, ".concat(0 - t, "px, 0)");
-  });
   var getContentHeight = function getContentHeight(index) {
     if (props.disabled) return 0;
     var sum = 0;
@@ -61335,7 +61387,7 @@ var useTableVirtual = function useTableVirtual(props) {
     };
     setHeight(sumHeight);
   });
-  var handleScroll = function handleScroll(info) {
+  var handleScroll = usePersistFn(function (info) {
     var height = info.height,
       y = info.y,
       fromDrag = info.fromDrag;
@@ -61369,7 +61421,7 @@ var useTableVirtual = function useTableVirtual(props) {
     } else {
       updateIndexAndTopFromTop(scrollTop);
     }
-  };
+  });
   var scrollToIndex = usePersistFn(function (index, callback) {
     if (props.disabled) return;
     if (props.scrollRef.current) {
@@ -61474,15 +61526,24 @@ var useTableVirtual = function useTableVirtual(props) {
     }
   }, [scrollHeight]);
   var finalRowsInView = rowsInView + context.rowSpanRows + context.autoAddRows;
-  var renderData = props.disabled ? props.data : toConsumableArray_default()(props.data).slice(startIndex, startIndex + finalRowsInView);
+  var renderData = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useMemo)(function () {
+    if (props.disabled) return props.data;
+    return toConsumableArray_default()(props.data).slice(startIndex, startIndex + finalRowsInView);
+  }, [props.data, startIndex, finalRowsInView]);
+  var translateStyle = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useMemo)(function () {
+    var t = innerTop + offsetY;
+    if (t < 0) {
+      t = 0;
+    }
+    return "translate3d(0, ".concat(0 - t, "px, 0)");
+  }, [innerTop]);
   return {
     scrollHeight: scrollHeight,
     startIndex: startIndex,
-    innerTop: innerTop + offsetY,
+    translateStyle: translateStyle,
     data: renderData,
     handleScroll: handleScroll,
     setRowHeight: setRowHeight,
-    getTranslate: getTranslate,
     scrollToIndex: scrollToIndex,
     scrollColumnByLeft: scrollColumnByLeft,
     scrollColumnIntoView: scrollColumnIntoView
@@ -62516,7 +62577,7 @@ var useTableRow = function useTableRow(props) {
   };
 };
 /* harmony default export */ var use_table_row = (useTableRow);
-;// CONCATENATED MODULE: ../hooks/src/common/use-memo/use-memo.ts
+;// CONCATENATED MODULE: ../hooks/src/common/use-component-memo/use-memo.ts
 
 function useMemo(getValue, condition, shouldUpdate) {
   var cacheRef = external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef({});
@@ -62552,6 +62613,7 @@ function Td(props) {
     className = props.className,
     direction = props.direction,
     role = props.role,
+    data = props.data,
     onClick = props.onClick,
     onMouseEnter = props.onMouseEnter,
     onMouseLeave = props.onMouseLeave,
@@ -62572,15 +62634,14 @@ function Td(props) {
       onClick: onClick,
       children: content
     }, col.key);
-  }, [].concat(toConsumableArray_default()(externalDependencies), [className, style, col.type, col.treeColumnsName
-  // onClick,
-  // onMouseEnter,
-  // onMouseLeave,
-  ]), updateFn ? function (prev, next) {
+  }, [data, className, style, col.type, col.treeColumnsName].concat(toConsumableArray_default()(externalDependencies)), updateFn ? function (prev, next) {
     if (col.type || col.treeColumnsName) {
       return true;
     }
     return prev.some(function (_, index) {
+      if (index === 0) {
+        return updateFn(prev[index], next[index]);
+      }
       return !shallowEqual(prev[index], next[index]);
     });
   } : undefined);
@@ -63162,6 +63223,7 @@ function TbodyEmpty(_ref) {
 
 
 
+
 var table_excluded = ["data"];
 
 
@@ -63202,7 +63264,8 @@ var emptyRef = {
   var theadRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
   var tfootRef = (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 mirrorScrollRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
+  var headMirrorScrollRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
+  var bottomMirrorScrollRef = (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();
   if (props.fixed) {
@@ -63375,14 +63438,23 @@ var emptyRef = {
     isRtl: isRtl,
     theadAndTfootHeight: context.theadAndTfootHeight
   });
+  var syncHeaderScroll = usePersistFn(function (left) {
+    var _theadRef$current2;
+    if (props.hideHeader || !props.sticky) return;
+    if (!(theadRef !== null && theadRef !== void 0 && (_theadRef$current2 = theadRef.current) !== null && _theadRef$current2 !== void 0 && _theadRef$current2.parentElement)) return;
+    theadRef.current.parentElement.scrollLeft = left;
+  });
 
   // 简单表格的滚动事件
   var handleBodyScroll = usePersistFn(function (e) {
     var target = e.currentTarget;
     if (!target) return;
     layoutFunc.checkFloat();
-    if (mirrorScrollRef.current) {
-      mirrorScrollRef.current.scrollLeft = target.scrollLeft;
+    if (headMirrorScrollRef.current) {
+      headMirrorScrollRef.current.scrollLeft = target.scrollLeft;
+    }
+    if (bottomMirrorScrollRef.current) {
+      bottomMirrorScrollRef.current.scrollLeft = target.scrollLeft;
     }
     if (props.onScroll && typeof props.onScroll === 'function') {
       var maxWidth = target.scrollWidth - target.clientWidth;
@@ -63391,18 +63463,23 @@ var emptyRef = {
       var y = Math.min(target.scrollTop / maxHeight, 1);
       props.onScroll(x, y, target.scrollLeft, target.scrollTop);
     }
+    syncHeaderScroll(target.scrollLeft);
   });
 
   // 虚拟表格的滚动事件
   var handleVirtualScroll = usePersistFn(function (info) {
     virtualInfo.handleScroll(info);
     layoutFunc.checkFloat();
-    if (mirrorScrollRef.current) {
-      mirrorScrollRef.current.scrollLeft = info.scrollLeft;
+    if (headMirrorScrollRef.current) {
+      headMirrorScrollRef.current.scrollLeft = info.scrollLeft;
+    }
+    if (bottomMirrorScrollRef.current) {
+      bottomMirrorScrollRef.current.scrollLeft = info.scrollLeft;
     }
     if (props.onScroll && typeof props.onScroll === 'function') {
       props.onScroll(info.x, info.y, info.scrollLeft, info.scrollTop);
     }
+    syncHeaderScroll(info.scrollLeft);
   });
   var renderEmpty = function renderEmpty() {
     var _props$data2;
@@ -63516,7 +63593,7 @@ var emptyRef = {
       });
       return /*#__PURE__*/(0,jsx_runtime.jsx)(StickyWrapper, objectSpread2_default()(objectSpread2_default()({}, props.sticky ? scrollerStickyProps : {}), {}, {
         children: /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
-          className: tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.headMirrorScroller,
+          className: tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.mirrorScroller,
           style: {
             height: browserScrollbarWidth,
             width: mirrorScrollRefWidth
@@ -63527,7 +63604,7 @@ var emptyRef = {
               scrollRef.current.scrollLeft = target.scrollLeft;
             }
           },
-          ref: mirrorScrollRef,
+          ref: headMirrorScrollRef,
           children: /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
             style: {
               width: scrollRef === null || scrollRef === void 0 || (_scrollRef$current3 = scrollRef.current) === null || _scrollRef$current3 === void 0 ? void 0 : _scrollRef$current3.scrollWidth,
@@ -63537,33 +63614,84 @@ var emptyRef = {
         })
       }));
     };
+    var renderBottomMirrorScroller = function renderBottomMirrorScroller() {
+      var _scrollRef$current4, _scrollRef$current5, _scrollRef$current6;
+      if (!props.showBottomScrollbar) return null;
+      var scrollRefWidth = (scrollRef === null || scrollRef === void 0 || (_scrollRef$current4 = scrollRef.current) === null || _scrollRef$current4 === void 0 ? void 0 : _scrollRef$current4.clientWidth) || 0;
+      var scrollRefScrollWidth = (scrollRef === null || scrollRef === void 0 || (_scrollRef$current5 = scrollRef.current) === null || _scrollRef$current5 === void 0 ? void 0 : _scrollRef$current5.scrollWidth) || 0;
+      var mirrorScrollRefWidth = scrollRefWidth + scrollBarWidth;
+      var showScroll = scrollRefScrollWidth > scrollRefWidth;
+      // 开启了双滚，但是没有滚动条，不显示
+      if (!scrollRefWidth || !mirrorScrollRefWidth || !showScroll) return null;
+      var options = props.showBottomScrollbar === true ? {} : props.showBottomScrollbar;
+      var scrollerStickyProps = {
+        scrollContainer: options.scrollContainer || document.body,
+        bottom: options.bottom || 0,
+        zIndex: options.zIndex || defaultZIndex + 1,
+        parent: tableRef === null || tableRef === void 0 ? void 0 : tableRef.current
+      };
+      return /*#__PURE__*/(0,jsx_runtime.jsx)(src_sticky_sticky, objectSpread2_default()(objectSpread2_default()({}, scrollerStickyProps), {}, {
+        children: /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
+          className: tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.mirrorScroller,
+          style: {
+            height: browserScrollbarWidth,
+            width: mirrorScrollRefWidth,
+            marginTop: -browserScrollbarWidth
+          },
+          onScroll: function onScroll(e) {
+            var target = e.currentTarget;
+            if (scrollRef !== null && scrollRef !== void 0 && scrollRef.current && scrollRef.current.scrollLeft !== target.scrollLeft) {
+              scrollRef.current.scrollLeft = target.scrollLeft;
+            }
+          },
+          ref: bottomMirrorScrollRef,
+          children: /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
+            style: {
+              width: scrollRef === null || scrollRef === void 0 || (_scrollRef$current6 = scrollRef.current) === null || _scrollRef$current6 === void 0 ? void 0 : _scrollRef$current6.scrollWidth,
+              height: 1
+            }
+          })
+        })
+      }));
+    };
+    var $headTable = /*#__PURE__*/(0,jsx_runtime.jsxs)("table", {
+      style: {
+        width: width
+      },
+      ref: theadRef,
+      children: [Group, /*#__PURE__*/(0,jsx_runtime.jsx)(thead, objectSpread2_default()({}, headCommonProps))]
+    });
     if (isRenderVirtualTable) {
-      var _props$data4, _props$data5;
+      var _props$data4;
       return /*#__PURE__*/(0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
-        children: [renderHeadMirrorScroller(), /*#__PURE__*/(0,jsx_runtime.jsxs)(scroll_table, {
+        children: [renderHeadMirrorScroller(), !props.hideHeader && props.sticky && /*#__PURE__*/(0,jsx_runtime.jsx)(StickyWrapper, objectSpread2_default()(objectSpread2_default()({}, stickyProps), {}, {
+          children: /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
+            className: headWrapperClass,
+            style: {
+              overflow: 'hidden'
+            },
+            children: $headTable
+          })
+        })), /*#__PURE__*/(0,jsx_runtime.jsxs)(scroll_table, {
+          style: {
+            display: 'flex',
+            minWidth: 0,
+            minHeight: 0,
+            flex: 1
+          },
           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),
-          isHeaderSticky: stickyProps === null || stickyProps === void 0 ? void 0 : stickyProps.css,
-          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,
-              children: /*#__PURE__*/(0,jsx_runtime.jsxs)("table", {
-                style: {
-                  width: width
-                },
-                ref: theadRef,
-                children: [Group, /*#__PURE__*/(0,jsx_runtime.jsx)(thead, objectSpread2_default()({}, headCommonProps))]
-              })
-            })
-          })), !!((_props$data5 = props.data) !== null && _props$data5 !== void 0 && _props$data5.length) && /*#__PURE__*/(0,jsx_runtime.jsxs)("table", {
+          children: [!props.hideHeader && !props.sticky && /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
+            className: headWrapperClass,
+            children: $headTable
+          }), !!((_props$data4 = props.data) !== null && _props$data4 !== void 0 && _props$data4.length) && /*#__PURE__*/(0,jsx_runtime.jsxs)("table", {
             style: {
               width: width,
-              transform: virtualInfo.getTranslate()
+              transform: virtualInfo.translateStyle
             },
             ref: tbodyRef,
             children: [Group, /*#__PURE__*/(0,jsx_runtime.jsx)(tbody, objectSpread2_default()(objectSpread2_default()({}, bodyCommonProps), {}, {
@@ -63581,7 +63709,7 @@ var emptyRef = {
               children: [Group, /*#__PURE__*/(0,jsx_runtime.jsx)(tfoot, objectSpread2_default()({}, footCommonProps))]
             })
           }) : null, renderEmpty()]
-        })]
+        }), renderBottomMirrorScroller()]
       });
     }
     return /*#__PURE__*/(0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
@@ -63598,7 +63726,7 @@ var emptyRef = {
             children: renderEmpty()
           }) : /*#__PURE__*/(0,jsx_runtime.jsx)(tbody, objectSpread2_default()({}, bodyCommonProps)), /*#__PURE__*/(0,jsx_runtime.jsx)(tfoot, objectSpread2_default()({}, footCommonProps))]
         })
-      })]
+      }), renderBottomMirrorScroller()]
     });
   };
   var renderLoading = function renderLoading() {
@@ -63618,6 +63746,36 @@ var emptyRef = {
       align: "right"
     }, pagination), paginationInfo));
   };
+
+  // handle head and  foot scroll
+  var handleHeaderWheel = usePersistFn(function (e) {
+    var _theadRef$current3;
+    var scrollEl = scrollRef.current;
+    if (!scrollEl) return;
+    if (!(theadRef !== null && theadRef !== void 0 && (_theadRef$current3 = theadRef.current) !== null && _theadRef$current3 !== void 0 && _theadRef$current3.parentElement)) return;
+    var max = scrollEl.scrollWidth - scrollEl.clientWidth;
+    var scrollLeft = scrollEl.scrollLeft + e.deltaX;
+    if (scrollLeft === scrollEl.scrollLeft) {
+      return;
+    }
+    e.preventDefault();
+    var left = Math.min(Math.max(scrollLeft, 0), max);
+    scrollEl.scrollLeft = left;
+    theadRef.current.parentElement.scrollLeft = left;
+  });
+  (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
+    // 绑定 wheel 事件
+    if (props.sticky && theadRef.current && theadRef.current.parentElement) {
+      theadRef.current.parentElement.addEventListener('wheel', handleHeaderWheel, {
+        passive: false
+      });
+    }
+    return function () {
+      if (props.sticky && theadRef.current && theadRef.current.parentElement) {
+        theadRef.current.parentElement.removeEventListener('wheel', handleHeaderWheel);
+      }
+    };
+  }, [theadRef.current, props.sticky, isScrollY]);
   var getRenderIndexByData = function getRenderIndexByData(data) {
     var originKey = typeof data === 'string' ? data : getKey(props.keygen, data);
     var index = treeData.findIndex(function (item) {
@@ -63653,7 +63811,7 @@ var emptyRef = {
   });
   return /*#__PURE__*/(0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
     children: [/*#__PURE__*/(0,jsx_runtime.jsx)("div", objectSpread2_default()(objectSpread2_default()({
-      className: classnames_default()(tableWrapperClass, floatLeft && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.floatLeft), floatRight && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.floatRight), props.sticky && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.sticky)),
+      className: classnames_default()(tableWrapperClass, defineProperty_default()(defineProperty_default()(defineProperty_default()({}, tableClasses.sticky, props.sticky), tableClasses.floatLeft, floatLeft), tableClasses.floatRight, floatRight)),
       style: objectSpread2_default()({
         height: defaultHeight
       }, props.style)
@@ -64372,7 +64530,7 @@ var TabsHeader = function TabsHeader(props) {
 
 
 
-var tabs_excluded = ["jssStyle", "align", "children", "shape", "position", "lazy", "autoFill", "hideSplit", "collapsible", "defaultCollapsed", "onChange", "extra", "border", "splitColor", "tabBarExtraContent", "background", "activeBackground", "inactiveBackground", "defaultActive", "tabBarStyle", "color", "sticky", "allowNonPanel", "className"];
+var tabs_excluded = ["jssStyle", "align", "children", "shape", "position", "lazy", "autoFill", "hideSplit", "collapsible", "defaultCollapsed", "onChange", "extra", "border", "splitColor", "tabBarExtraContent", "background", "activeBackground", "inactiveBackground", "defaultActive", "tabBarStyle", "color", "sticky", "allowNonPanel", "renderTabsHeader", "className"];
 
 
 
@@ -64429,6 +64587,7 @@ var Tabs = function Tabs(props) {
     color = props.color,
     sticky = props.sticky,
     allowNonPanel = props.allowNonPanel,
+    renderTabsHeader = props.renderTabsHeader,
     tabsClassName = props.className,
     rest = objectWithoutProperties_default()(props, tabs_excluded);
   var shape = shapeProps && shapeProps !== 'bordered' ? shapeProps : 'card';
@@ -64589,10 +64748,18 @@ var Tabs = function Tabs(props) {
           className: classnames_default()(stickyClassName, sticky.className)
         });
       }
+      if (renderTabsHeader) {
+        return renderTabsHeader( /*#__PURE__*/(0,jsx_runtime.jsx)(src_sticky_sticky, objectSpread2_default()(objectSpread2_default()({}, stickyProps), {}, {
+          children: header
+        })), props);
+      }
       return /*#__PURE__*/(0,jsx_runtime.jsx)(src_sticky_sticky, objectSpread2_default()(objectSpread2_default()({}, stickyProps), {}, {
         children: header
       }));
     }
+    if (renderTabsHeader) {
+      return renderTabsHeader(header, props);
+    }
     return header;
   };
   var renderTabs = function renderTabs() {
@@ -66085,7 +66252,7 @@ var TreeSelect = function TreeSelect(props0) {
     if (from !== 'blur') {
       focusAndOpen();
     }
-    onTiledFilter === null || onTiledFilter === void 0 || onTiledFilter(trim ? text.trim() : text);
+    onTiledFilter === null || onTiledFilter === void 0 || onTiledFilter(trim ? text.trim() : text, from);
   };
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
     if (virtual && expanded) {
@@ -70004,7 +70171,7 @@ var upload_interface = __webpack_require__(8821);
 
 
 /* harmony default export */ var src_0 = ({
-  version: '3.7.0-beta.6'
+  version: '3.7.0-beta.8'
 });
 }();
 /******/ 	return __webpack_exports__;