shineout 3.8.0-beta.16 → 3.8.0-beta.18

package/README-zh_CN.md

@@ -11,7 +11,7 @@
 <p align="center">
   <a href="https://www.npmjs.com/package/shineout"><img src="https://img.shields.io/npm/v/shineout.svg?style=flat-square"></a>
   <a href="https://www.npmjs.com/package/shineout"><img src="https://img.shields.io/npm/dm/shineout.svg?style=flat-square"></a>
-  <img src="https://img.shields.io/badge/React-%3E%3D16.8.0-green.svg?style=flat-square">
+  <img src="https://img.shields.io/badge/React-%3E%3D16.14.0-green.svg?style=flat-square">
 </p>
 
 ## ✨ 特性

package/README.md

@@ -11,7 +11,7 @@ English | [简体中文](./README-zh_CN.md)
 <p align="center">
   <a href="https://www.npmjs.com/package/shineout"><img src="https://img.shields.io/npm/v/shineout.svg?style=flat-square"></a>
   <a href="https://www.npmjs.com/package/shineout"><img src="https://img.shields.io/npm/dm/shineout.svg?style=flat-square"></a>
-  <img src="https://img.shields.io/badge/React-%3E%3D16.8.0-green.svg?style=flat-square">
+  <img src="https://img.shields.io/badge/React-%3E%3D16.14.0-green.svg?style=flat-square">
 </p>
 
 ## ✨ Features

package/cjs/index.js

@@ -522,5 +522,5 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 // 此文件由脚本自动生成，请勿直接修改。
 // This file was generated automatically by a script. Please do not modify it directly.
 var _default = exports.default = {
-  version: '3.8.0-beta.16'
+  version: '3.8.0-beta.18'
 };

package/dist/shineout.js

@@ -12234,7 +12234,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.8.0-beta.16');
+/* harmony default export */ var version = ('3.8.0-beta.18');
 ;// CONCATENATED MODULE: ../shineout-style/src/jss-style/index.tsx
 
 
@@ -22820,7 +22820,7 @@ var popoverStyle = objectSpread2_default()(objectSpread2_default()({}, tooltipAn
     borderRadius: src.popoverRadius,
     border: "1px solid ".concat(src.popoverBorderColor),
     wordWrap: 'break-word',
-    '& $arrow': {
+    '& > $arrow': {
       'z-index': 1,
       position: 'absolute',
       content: '" "',
@@ -22841,7 +22841,7 @@ var popoverStyle = objectSpread2_default()(objectSpread2_default()({}, tooltipAn
     '&$hideArrow': defineProperty_default()({}, popover_cssvar, '4px'),
     '&[data-soui-position^="bottom"]': {
       marginTop: "calc(".concat(hideArrowGap, " - 2px)"),
-      '& $arrow': {
+      '& > $arrow': {
         top: '0',
         transform: 'translate(0, -50%) rotate(-45deg)',
         left: '0',
@@ -22861,7 +22861,7 @@ var popoverStyle = objectSpread2_default()(objectSpread2_default()({}, tooltipAn
     '&[data-soui-position^="top"]': {
       // marginTop: (arrowGap - 2) * -1,
       marginTop: "calc((".concat(hideArrowGap, " - 2px) * -1)"),
-      '& $arrow': {
+      '& > $arrow': {
         bottom: '0',
         transform: 'translate(0, 50%) rotate(135deg)',
         left: '0',
@@ -22887,7 +22887,7 @@ var popoverStyle = objectSpread2_default()(objectSpread2_default()({}, tooltipAn
       '&[dir=rtl]': {
         marginLeft: "calc((".concat(hideArrowGap, " - 2px))")
       },
-      '& $arrow': {
+      '& > $arrow': {
         right: src.popoverBorderWidth,
         transform: 'translate(50%, 0) rotate(45deg)',
         top: '0',
@@ -22911,7 +22911,7 @@ var popoverStyle = objectSpread2_default()(objectSpread2_default()({}, tooltipAn
       '&[dir=rtl]': {
         marginRight: "calc(".concat(hideArrowGap, " - 2px)")
       },
-      '& $arrow': {
+      '& > $arrow': {
         left: '0',
         transform: 'translate(-50%, 0) rotate(-135deg)',
         top: '0',
@@ -22930,19 +22930,19 @@ var popoverStyle = objectSpread2_default()(objectSpread2_default()({}, tooltipAn
         position: 'absolute'
       }
     },
-    '&&[data-soui-position$="-left"] $arrow': {
+    '&&[data-soui-position$="-left"] > $arrow': {
       left: arrowMargin,
       right: 'auto'
     },
-    '&&[data-soui-position$="-right"] $arrow': {
+    '&&[data-soui-position$="-right"] > $arrow': {
       right: arrowMargin,
       left: 'auto'
     },
-    '&&[data-soui-position$="-top"] $arrow': {
+    '&&[data-soui-position$="-top"] > $arrow': {
       top: arrowMargin,
       bottom: 'auto'
     },
-    '&&[data-soui-position$="-bottom"] $arrow': {
+    '&&[data-soui-position$="-bottom"] > $arrow': {
       bottom: arrowMargin,
       top: 'auto'
     },
@@ -26356,7 +26356,7 @@ var tableStyle = objectSpread2_default()(objectSpread2_default()({
         boxSizing: 'border-box',
         lineHeight: src.lineHeightDynamic,
         '$bordered&': {
-          '&::after': {
+          '&:not(:last-child)::after': {
             content: '""',
             position: 'absolute',
             zIndex: cellBaseIndex,
@@ -26700,6 +26700,9 @@ var tableStyle = objectSpread2_default()(objectSpread2_default()({
       color: src.tableFilterIconActiveColor
     }
   },
+  filterOpened: {
+    background: src.buttonSecondaryHoverBackgroundColor
+  },
   filterContainer: {
     minWidth: '120px'
   },
@@ -26712,7 +26715,19 @@ var tableStyle = objectSpread2_default()(objectSpread2_default()({
   filterBody: {
     padding: "".concat(src.tableFilterBodyPaddingY, " ").concat(src.tableFilterBodyPaddingX),
     maxHeight: '300px',
-    overflow: 'auto'
+    overflow: 'auto',
+    // 特调Tree在Table filter中样式，以满足设计要求
+    '& [class*=tree-content-wrapper]': {
+      paddingTop: 1,
+      paddingBottom: 1
+    },
+    '&& [class*=tree-checkbox]': {
+      alignSelf: 'center'
+    },
+    '& [class*=tree-text]': {
+      paddingTop: 5,
+      paddingBottom: 5
+    }
   },
   filterFooter: {
     display: 'flex',
@@ -30518,20 +30533,20 @@ var usePopup = function usePopup(props) {
     }
   };
   var handleMouseEnter = use_persist_fn(function (e) {
-    var _targetEvents$onMouse, _targetRef$current;
+    var _targetEvents$onMouse, _targetRef$current, _popupRef$current2;
     targetEvents === null || targetEvents === void 0 || (_targetEvents$onMouse = targetEvents.onMouseEnter) === null || _targetEvents$onMouse === void 0 || _targetEvents$onMouse.call(targetEvents, e);
     if (trigger !== 'hover') return;
     var isParentContainsCurrent = (_targetRef$current = targetRef.current) === null || _targetRef$current === void 0 ? void 0 : _targetRef$current.contains(e.target);
-    if (isParentContainsCurrent) {
+    if (isParentContainsCurrent || popupRef !== null && popupRef !== void 0 && (_popupRef$current2 = popupRef.current) !== null && _popupRef$current2 !== void 0 && _popupRef$current2.contains(e.target)) {
       handleHoverToggle(true);
     }
   });
   var handleMouseLeave = use_persist_fn(function (e) {
-    var _targetEvents$onMouse2, _popupRef$current2;
+    var _targetEvents$onMouse2, _popupRef$current3;
     targetEvents === null || targetEvents === void 0 || (_targetEvents$onMouse2 = targetEvents.onMouseLeave) === null || _targetEvents$onMouse2 === void 0 || _targetEvents$onMouse2.call(targetEvents, e);
     if (trigger !== 'hover') return;
     // @ts-ignore
-    if (e.relatedTarget instanceof HTMLElement && (_popupRef$current2 = popupRef.current) !== null && _popupRef$current2 !== void 0 && _popupRef$current2.contains(e.relatedTarget)) {
+    if (e.relatedTarget instanceof HTMLElement && (_popupRef$current3 = popupRef.current) !== null && _popupRef$current3 !== void 0 && _popupRef$current3.contains(e.relatedTarget)) {
       return;
     }
     handleHoverToggle(false);
@@ -35694,6 +35709,26 @@ var getCompleteFieldKeys = function getCompleteFieldKeys(fields, allFields) {
   // 返回之前去重
   return Array.from(new Set(completeFields));
 };
+
+/**
+ * 将对象中的所有值设置为空, 如果值是数组，重置为空数组，如果是对象，重置为空对象，如果是基础类型，重置为undefined
+ * @param obj 对象
+ * @returns 空对象
+ */
+var clearValue = function clearValue(obj) {
+  if (isArray(obj)) {
+    return obj.map(function (item) {
+      return clearValue(item);
+    });
+  }
+  if (is_isObject(obj)) {
+    return Object.keys(obj).reduce(function (acc, key) {
+      acc[key] = clearValue(obj[key]);
+      return acc;
+    }, {});
+  }
+  return undefined;
+};
 ;// CONCATENATED MODULE: ../hooks/src/components/use-check/use-check.ts
 
 
@@ -36085,7 +36120,10 @@ var useInput = function useInput(params) {
       (_otherHandlers$onFocu = otherHandlers.onFocus) === null || _otherHandlers$onFocu === void 0 || _otherHandlers$onFocu.call(otherHandlers, event);
       setFocused(true);
       if (autoSelect) {
-        event.target.select();
+        // why requestAnimationFrame: 当在文字身体上hover后立即点击，select()与浏览器的光标定位逻辑产生竞争，有可能导致只选中的部分文本，所以需要延迟一下
+        requestAnimationFrame(function () {
+          event.target.select();
+        });
       }
     };
   };
@@ -36614,9 +36652,11 @@ function escapeRegExp() {
   timeOfDayValues: ['上午', '下午'],
   ok: '确定',
   cancel: '取消',
+  reset: '重置',
   noData: '暂无数据',
   selectAll: '全选',
   loading: '加载中...',
+  searchPlaceholder: '在筛选项中搜索',
   rules: {
     required: {
       array: '{title} 不能为空',
@@ -36641,6 +36681,7 @@ function escapeRegExp() {
   search: '搜索',
   urlInvalidMsg: '图片格式不正确，请重新上传',
   invalidAccept: '文件格式不正确',
+  invalidImage: '图片格式不正确',
   notFound: '未找到'
 });
 ;// CONCATENATED MODULE: ../base/src/config/locale/en_US.ts
@@ -36679,9 +36720,11 @@ function escapeRegExp() {
   timeOfDayValues: ['a.m.', 'p.m.'],
   ok: 'Ok',
   cancel: 'Cancel',
+  reset: 'Reset',
   noData: 'Data not found',
   selectAll: 'Select All',
   loading: 'loading...',
+  searchPlaceholder: 'Search in filter options',
   rules: {
     required: {
       array: 'Please select {title}',
@@ -36706,6 +36749,7 @@ function escapeRegExp() {
   search: 'search',
   urlInvalidMsg: 'Picture format is incorrect, please upload again',
   invalidAccept: 'Invalid file format',
+  invalidImage: 'Invalid image format',
   notFound: 'not found'
 });
 ;// CONCATENATED MODULE: ../base/src/config/locale/index.ts
@@ -39697,7 +39741,7 @@ var useTree = function useTree(props) {
     (_context$value = context.value) === null || _context$value === void 0 || _context$value.forEach(function (id) {
       var _ref3 = context.pathMap.get(id),
         children = _ref3.children;
-      if (children.length) {
+      if (children && children.length) {
         var noCheckedChildren = children.filter(function (cid) {
           var _context$value2;
           return !((_context$value2 = context.value) !== null && _context$value2 !== void 0 && _context$value2.includes(cid));
@@ -41509,7 +41553,7 @@ function getResetMore(onFilter, container, doms) {
   var paddingLeft = parsePxToNumber(style.paddingLeft);
   var paddingRight = parsePxToNumber(style.paddingRight);
   var minFilterWidth = onFilter ? 16 : 0;
-  var contentWidth = clientWidth - paddingLeft - paddingRight - minFilterWidth - 1;
+  var contentWidth = clientWidth - paddingLeft - paddingRight - minFilterWidth;
   var hideEl = items.pop();
   var hideElStyle = getComputedStyle(hideEl);
   var hideMargin = parsePxToNumber(hideElStyle.marginLeft) + parsePxToNumber(hideElStyle.marginRight);
@@ -42670,8 +42714,8 @@ var Cascader = function Cascader(props0) {
     }
   }, [data]);
 
-  // 修复外部受控打开的场景下，从外部修改value导致的面板勾选情况没有及时同步
-  if (openProp && !shallowEqual(value, datum.getValue())) {
+  // 修复外部受控打开或renderOptionList做全选的场景下，从外部修改value导致的面板勾选情况没有及时同步
+  if ((openProp || props.renderOptionList) && !shallowEqual(value, datum.getValue())) {
     datum.setValue(value);
   }
   ;
@@ -42680,9 +42724,6 @@ var Cascader = function Cascader(props0) {
     datum.setValue(value);
     if (!open) return;
     updatePathByValue();
-    if (props.renderOptionList) {
-      updatePath();
-    }
   }, [value, open]);
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
     if (filterText !== undefined) {
@@ -46097,7 +46138,9 @@ var useTime = function useTime(props) {
     _props$secondStep = props.secondStep,
     secondStep = _props$secondStep === void 0 ? 1 : _props$secondStep,
     staticMin = props.staticMin,
-    staticMax = props.staticMax;
+    staticMax = props.staticMax,
+    position = props.position,
+    rangeDate = props.rangeDate;
   var min = util.resetTimeByFormat(mi, format, options);
   var max = util.resetTimeByFormat(ma, format, options);
   var current = props.value || util.newDate(undefined, options);
@@ -46123,7 +46166,7 @@ var useTime = function useTime(props) {
       disabledTime = props.disabledTime;
     if (disabledTime) {
       var _time = util.format(date, util.TIME_FORMAT, options);
-      if (typeof disabledTime === 'function') return disabledTime(_time);
+      if (typeof disabledTime === 'function') return disabledTime(_time, position, rangeDate === null || rangeDate === void 0 ? void 0 : rangeDate[0], rangeDate === null || rangeDate === void 0 ? void 0 : rangeDate[1]);
       return disabledTime === _time;
     }
     var isDis = disabled && typeof disabled === 'function' ? disabled(date) : false;
@@ -46474,7 +46517,9 @@ var Time = function Time(props) {
       disabledTime: props.disabledTime,
       hourStep: props.hourStep,
       minuteStep: props.minuteStep,
-      secondStep: props.secondStep
+      secondStep: props.secondStep,
+      position: props.position,
+      rangeDate: props.rangeDate
     }),
     func = _useTimePick.func,
     times = _useTimePick.times;
@@ -46508,6 +46553,7 @@ var Time = function Time(props) {
       })]
     });
   };
+  var shouldRenderTimes = times && times.length > 0;
   return /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
     onMouseEnter: props.onMouseEnter,
     onMouseLeave: props.onMouseLeave,
@@ -46516,7 +46562,7 @@ var Time = function Time(props) {
     children: [props.showTitle && /*#__PURE__*/(0,jsx_runtime.jsx)(pickerTitle, {
       position: props.position,
       jssStyle: props.jssStyle
-    }), /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
+    }), shouldRenderTimes && /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
       className: styles === null || styles === void 0 ? void 0 : styles.pickerBody,
       children: times.map(function (item) {
         return /*#__PURE__*/(0,jsx_runtime.jsx)(TimeScroll, {
@@ -50989,7 +51035,7 @@ var useForm = function useForm(props) {
     var _props$onChange;
     var newValue = typeof change === 'function' ? utils_immer_produce(context.value, change) : change;
     context.value = newValue;
-    (_props$onChange = props.onChange) === null || _props$onChange === void 0 || _props$onChange.call(props, context.value);
+    (_props$onChange = props.onChange) === null || _props$onChange === void 0 || _props$onChange.call(props, deepClone(context.value));
   });
   var scrollToField = use_persist_fn(function (name) {
     var _document;
@@ -51373,11 +51419,6 @@ var useForm = function useForm(props) {
   // 默认值更新
   external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect(function () {
     context.removeLock = false;
-    // 内部 onChange 改的 value, 不需要更新
-    if (props.value === context.value) {
-      if (!isControl) update();
-      return;
-    }
     if (initValidate && !context.resetTime) {
       var keys = Object.keys(context.validateMap).filter(function (key) {
         var oldValue = deepGet(preValue || emptyObj, key);
@@ -51387,6 +51428,7 @@ var useForm = function useForm(props) {
       validateFields(keys).catch(function () {});
     }
     update();
+    if (!isControl) return;
     // 默认值上位时会提前触发外部的onChange, 导致外部的多次setFormValue不能合并后生效的问题(ReactDOM.render方式渲染)
     setTimeout(updateDefaultValue);
     context.resetTime = 0;
@@ -51892,8 +51934,13 @@ var FormFieldSet = function FormFieldSet(props) {
         },
         onInsert: function onInsert(val) {
           var oldValue = formFunc === null || formFunc === void 0 ? void 0 : formFunc.getValue(name);
+          var insertValue = val;
+          var valueTemplate = oldValue[i];
+          if (insertValue === undefined) {
+            insertValue = clearValue(deepClone(valueTemplate));
+          }
           var newValue = form_fieldset_produce(oldValue, function (draft) {
-            draft.splice(i, 0, val);
+            draft.splice(i, 0, insertValue);
           });
           _onChange(newValue);
           // context.ids.splice(i, 0, util.generateUUID());
@@ -51901,8 +51948,13 @@ var FormFieldSet = function FormFieldSet(props) {
         },
         onAppend: function onAppend(val) {
           var oldValue = formFunc === null || formFunc === void 0 ? void 0 : formFunc.getValue(name);
+          var insertValue = val;
+          var valueTemplate = oldValue[i];
+          if (insertValue === undefined) {
+            insertValue = clearValue(deepClone(valueTemplate));
+          }
           var newValue = form_fieldset_produce(oldValue, function (draft) {
-            draft.splice(i + 1, 0, val);
+            draft.splice(i + 1, 0, insertValue);
           });
           _onChange(newValue);
           // context.ids.splice(i + 1, 0, util.generateUUID());
@@ -62032,7 +62084,8 @@ var scroll_table_Scroll = function Scroll(props) {
   var wrapperRef = useForkRef(scrollRef, props.wrapperRef);
   var _useRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)({
       isMouseDown: false,
-      lastTableHeight: 0
+      lastTableHeight: 0,
+      unmounted: false
     }),
     context = _useRef.current;
   var _props$scrollHeight = props.scrollHeight,
@@ -62141,7 +62194,7 @@ var scroll_table_Scroll = function Scroll(props) {
 
   // 非定高的Table但依旧采用了virtual渲染方式，需要渲染出全部的data
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useLayoutEffect)(function () {
-    if (!props.tableRef.current) return;
+    if (!props.tableRef.current || context.unmounted) return;
     var rootTableHeight = props.tableRef.current.clientHeight;
     var container = containerRef.current;
     // 判断内容滚动高度是否真的超过了容器高度
@@ -62153,6 +62206,9 @@ var scroll_table_Scroll = function Scroll(props) {
     } else {
       context.lastTableHeight = rootTableHeight;
     }
+    return function () {
+      context.unmounted = true;
+    };
   }, [paddingTop]);
   if (props.isEmpty) {
     return /*#__PURE__*/(0,jsx_runtime.jsxs)("div", objectSpread2_default()(objectSpread2_default()({}, scrollRoleProps), {}, {
@@ -63039,7 +63095,7 @@ var useTableVirtual = function useTableVirtual(props) {
     for (var i = 0; i <= index; i++) {
       sum += context.cachedHeight[i] || props.rowHeight;
     }
-    return sum + props.theadAndTfootHeight;
+    return sum + props.theadHeight + props.tfootHeight;
   };
   var setRowHeight = usePersistFn(function (index, height) {
     if (props.disabled) return;
@@ -63182,7 +63238,7 @@ var useTableVirtual = function useTableVirtual(props) {
           callback();
         }
       };
-      props.scrollRef.current.scrollTop = beforeHeight;
+      props.scrollRef.current.scrollTop = beforeHeight - props.theadHeight;
     }
   });
   var scrollColumnByLeft = usePersistFn(function (targetLeft) {
@@ -63259,7 +63315,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.theadAndTfootHeight]);
+  }, [props.data.length, props.theadHeight, props.tfootHeight]);
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
     if (props.disabled) return;
     if (context.heightCallback) {
@@ -63648,8 +63704,11 @@ var useTableGroup = function useTableGroup(props) {
 
 
 
+
 var FilterFooter = function FilterFooter(props) {
   var tableClasses = props.tableClasses;
+  var _useConfig = useConfig(),
+    locale = _useConfig.locale;
   return /*#__PURE__*/(0,jsx_runtime.jsxs)("footer", {
     className: tableClasses.filterFooter,
     children: [/*#__PURE__*/(0,jsx_runtime.jsx)(base_src_button_button, {
@@ -63658,18 +63717,21 @@ var FilterFooter = function FilterFooter(props) {
       size: "small",
       onClick: props.onReset,
       disabled: !props.resetable,
-      children: "\u91CD\u7F6E"
+      mode: "outline",
+      children: getLocale(locale, 'reset')
     }), /*#__PURE__*/(0,jsx_runtime.jsx)(base_src_button_button, {
       jssStyle: props.jssStyle,
       size: "small",
       type: "primary",
       onClick: props.onConfirm,
-      children: "\u786E\u5B9A"
+      children: getLocale(locale, 'ok')
     })]
   });
 };
 var FilterSelect = function FilterSelect(props) {
   var _props$filterInfo;
+  var _useConfig2 = useConfig(),
+    locale = _useConfig2.locale;
   var _useState = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(false),
     _useState2 = slicedToArray_default()(_useState, 2),
     popoverVisible = _useState2[0],
@@ -63748,7 +63810,7 @@ var FilterSelect = function FilterSelect(props) {
     jssStyle: props.jssStyle,
     shape: "circle",
     size: "small",
-    className: classnames_default()(tableClasses.filterIconContainer, (currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.value) && tableClasses.filterActive),
+    className: classnames_default()(tableClasses.filterIconContainer, (currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.value) && tableClasses.filterActive, popoverVisible && tableClasses.filterOpened),
     style: {
       border: 'none'
     },
@@ -63766,13 +63828,14 @@ var FilterSelect = function FilterSelect(props) {
         children: [(config === null || config === void 0 ? void 0 : config.search) && /*#__PURE__*/(0,jsx_runtime.jsx)("header", {
           className: tableClasses.filterHeader,
           children: /*#__PURE__*/(0,jsx_runtime.jsx)(base_src_input_input, {
+            showClear: true,
             value: inputText,
             onChange: function onChange(v) {
               if (onFilter) onFilter(v || '');
               setInputText(v);
             },
             jssStyle: props.jssStyle,
-            placeholder: "\u5728\u7B5B\u9009\u9879\u4E2D\u641C\u7D22",
+            placeholder: getLocale(locale, 'searchPlaceholder'),
             className: tableClasses.filterInput,
             prefix: /*#__PURE__*/(0,jsx_runtime.jsx)("span", {
               className: tableClasses.filterInputIcon,
@@ -63808,6 +63871,8 @@ var FilterSelect = function FilterSelect(props) {
 };
 var FilterSearch = function FilterSearch(props) {
   var _props$filterInfo2;
+  var _useConfig3 = useConfig(),
+    locale = _useConfig3.locale;
   var tableClasses = props.tableClasses,
     filter = props.filter;
   var _useState5 = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(false),
@@ -63854,7 +63919,7 @@ var FilterSearch = function FilterSearch(props) {
     jssStyle: props.jssStyle,
     shape: "circle",
     size: "small",
-    className: classnames_default()(tableClasses.filterIconContainer, (currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.value) && tableClasses.filterActive),
+    className: classnames_default()(tableClasses.filterIconContainer, (currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.value) && tableClasses.filterActive, popoverVisible && tableClasses.filterOpened),
     style: {
       border: 'none'
     },
@@ -63873,7 +63938,7 @@ var FilterSearch = function FilterSearch(props) {
           className: tableClasses.filterHeader,
           children: /*#__PURE__*/(0,jsx_runtime.jsx)(base_src_input_input, {
             jssStyle: props.jssStyle,
-            placeholder: "\u5728\u7B5B\u9009\u9879\u4E2D\u641C\u7D22",
+            placeholder: getLocale(locale, 'searchPlaceholder'),
             className: tableClasses.filterInput,
             prefix: /*#__PURE__*/(0,jsx_runtime.jsx)("span", {
               className: tableClasses.filterInputIcon,
@@ -63882,7 +63947,8 @@ var FilterSearch = function FilterSearch(props) {
             value: tempValue,
             onChange: setTempValue,
             onEnterPress: onConfirm,
-            forwardRef: inputRef
+            forwardRef: inputRef,
+            showClear: true
           })
         }), /*#__PURE__*/(0,jsx_runtime.jsx)(FilterFooter, {
           jssStyle: props.jssStyle,
@@ -65061,7 +65127,8 @@ var emptyRef = {
   };
   var _useRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)({
       emptyHeight: 0,
-      theadAndTfootHeight: 0,
+      theadHeight: 0,
+      tfootHeight: 0,
       scrollingTimer: null
     }),
     context = _useRef.current;
@@ -65194,15 +65261,38 @@ var emptyRef = {
     onChange: inputableData.onChange,
     disabled: props.disabled
   });
-  (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
+  var handleTheadAndTfootHeight = usePersistFn(function () {
     var _theadRef$current, _tfootRef$current;
     var theadHeight = (theadRef === null || theadRef === void 0 || (_theadRef$current = theadRef.current) === null || _theadRef$current === void 0 ? void 0 : _theadRef$current.clientHeight) || 0;
     var tfootHeight = ((_tfootRef$current = tfootRef.current) === null || _tfootRef$current === void 0 ? void 0 : _tfootRef$current.clientHeight) || 0;
     if (props.sticky) {
-      context.theadAndTfootHeight = tfootHeight;
+      context.tfootHeight = tfootHeight;
     } else {
-      context.theadAndTfootHeight = theadHeight + tfootHeight;
+      context.theadHeight = theadHeight;
+      context.tfootHeight = tfootHeight;
     }
+  });
+  (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
+    handleTheadAndTfootHeight();
+    var cancelFunc1;
+    if (theadRef !== null && theadRef !== void 0 && theadRef.current) {
+      cancelFunc1 = addResizeObserver(theadRef === null || theadRef === void 0 ? void 0 : theadRef.current, handleTheadAndTfootHeight, {
+        direction: 'y',
+        timer: 10
+      });
+    }
+    var cancelFunc2;
+    if (tfootRef !== null && tfootRef !== void 0 && tfootRef.current) {
+      cancelFunc2 = addResizeObserver(tfootRef === null || tfootRef === void 0 ? void 0 : tfootRef.current, handleTheadAndTfootHeight, {
+        direction: 'y',
+        timer: 10
+      });
+    }
+    return function () {
+      var _cancelFunc, _cancelFunc2;
+      (_cancelFunc = cancelFunc1) === null || _cancelFunc === void 0 || _cancelFunc();
+      (_cancelFunc2 = cancelFunc2) === null || _cancelFunc2 === void 0 || _cancelFunc2();
+    };
   }, [theadRef.current, tfootRef.current]);
   var virtualInfo = use_table_virtual({
     disabled: !virtual,
@@ -65215,7 +65305,8 @@ var emptyRef = {
     innerRef: tbodyRef,
     scrollLeft: props.scrollLeft,
     isRtl: isRtl,
-    theadAndTfootHeight: context.theadAndTfootHeight
+    theadHeight: context.theadHeight,
+    tfootHeight: context.tfootHeight
   });
   var syncHeaderScroll = usePersistFn(function (left) {
     var _tableRef$current;
@@ -66202,36 +66293,43 @@ var TabsHeader = function TabsHeader(props) {
     _useState2 = slicedToArray_default()(_useState, 2),
     currentTabOffset = _useState2[0],
     setCurrentTabOffset = _useState2[1];
-  var _useState3 = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(null),
+  var _useState3 = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)({
+      width: 0,
+      height: 0
+    }),
     _useState4 = slicedToArray_default()(_useState3, 2),
-    currentTabRect = _useState4[0],
-    setCurrentTabRect = _useState4[1];
+    currentTabSize = _useState4[0],
+    setCurrentTabSize = _useState4[1];
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useLayoutEffect)(function () {
-    var _currentTab$getBoundi;
     if (shape !== 'line' && shape !== 'dash') return;
     var currentTab = tabRef.current[active];
     setCurrentTabOffset({
       offsetTop: (currentTab === null || currentTab === void 0 ? void 0 : currentTab.offsetTop) || 0,
       offsetLeft: (currentTab === null || currentTab === void 0 ? void 0 : currentTab.offsetLeft) || 0
     });
-    var currentTabRect = currentTab === null || currentTab === void 0 || (_currentTab$getBoundi = currentTab.getBoundingClientRect) === null || _currentTab$getBoundi === void 0 ? void 0 : _currentTab$getBoundi.call(currentTab);
-    setCurrentTabRect(currentTabRect);
+
+    // 使用 offsetWidth/offsetHeight 而不是 getBoundingClientRect()
+    // 这样可以避免受到外部容器 CSS transform scale 的影响
+    setCurrentTabSize({
+      width: (currentTab === null || currentTab === void 0 ? void 0 : currentTab.offsetWidth) || 0,
+      height: (currentTab === null || currentTab === void 0 ? void 0 : currentTab.offsetHeight) || 0
+    });
   }, [active, tabs]);
   var renderHeaderScrollBar = function renderHeaderScrollBar() {
     if (shape !== 'line' && shape !== 'dash') return;
-    if (!currentTabRect) return;
+    if (!currentTabSize.width || !currentTabSize.height) return;
     var scrollBarStyle = isVertical ? {
       right: getPosition !== null && getPosition !== void 0 && getPosition.startsWith('left') ? 0 : 'auto',
       left: getPosition !== null && getPosition !== void 0 && getPosition.startsWith('right') ? 0 : 'auto',
-      top: currentTabOffset.offsetTop + currentTabRect.height / 2,
-      height: shape === 'line' ? currentTabRect.height : 24,
+      top: currentTabOffset.offsetTop + currentTabSize.height / 2,
+      height: shape === 'line' ? currentTabSize.height : 24,
       width: 2,
       transform: 'translateY(-50%)'
     } : {
       bottom: getPosition !== null && getPosition !== void 0 && getPosition.startsWith('top') ? 0 : 'auto',
       top: getPosition !== null && getPosition !== void 0 && getPosition.startsWith('bottom') ? 0 : 'auto',
-      left: currentTabOffset.offsetLeft + currentTabRect.width / 2,
-      width: shape === 'line' ? currentTabRect.width : 24,
+      left: currentTabOffset.offsetLeft + currentTabSize.width / 2,
+      width: shape === 'line' ? currentTabSize.width : 24,
       height: 2,
       transform: 'translateX(-50%)'
     };
@@ -69218,6 +69316,10 @@ var useInputClick = function useInputClick() {
     type: 'file',
     style: {
       display: 'none'
+    },
+    onClick: function onClick(event) {
+      // 阻止程序化触发(inputRef.current.click())的input点击事件冒泡
+      event.stopPropagation();
     }
   };
   var wrapperProps = {
@@ -72091,7 +72193,7 @@ var upload_interface = __webpack_require__(8821);
 
 
 /* harmony default export */ var src_0 = ({
-  version: '3.8.0-beta.16'
+  version: '3.8.0-beta.18'
 });
 }();
 /******/ 	return __webpack_exports__;