shineout 3.10.3-beta.5 → 3.10.3-beta.7

package/cjs/index.js

@@ -545,5 +545,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.10.3-beta.5'
+  version: '3.10.3-beta.7'
 };

package/dist/shineout.js

@@ -13736,7 +13736,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.10.3-beta.5');
+/* harmony default export */ var version = ('3.10.3-beta.7');
 ;// CONCATENATED MODULE: ../shineout-style/src/jss-style/index.tsx
 
 
@@ -27954,18 +27954,13 @@ var stepsStyle = {
   arrowIcon: {
     position: 'absolute',
     top: 0,
-    right: 0.25,
+    right: 0,
     bottom: 0,
-    transform: 'translateX(100%)',
+    // 1 倍屏下向左压进内容区 0.5px，盖住小数尺寸下亚像素对齐和抗锯齿产生的缝；2 倍屏误差小，偏移 0.25px
+    transform: 'translateX(calc(100% - 0.5px))',
     zIndex: 1,
     '@media (min-resolution: 2dppx)': {
-      right: 0
-    },
-    '$withDescription &': {
-      transform: 'translateX(calc(100% - 0.5px))',
-      '@media (min-resolution: 2dppx)': {
-        transform: 'translateX(100%)'
-      }
+      transform: 'translateX(calc(100% - 0.25px))'
     },
     '& > svg': {
       display: 'block',
@@ -27995,9 +27990,12 @@ var stepsStyle = {
       display: 'none'
     },
     '$arrow[dir=rtl] &': {
-      left: '0.25px',
+      left: 0,
       right: 'auto',
-      transform: 'translateX(-100%)',
+      transform: 'translateX(calc(-100% + 0.5px))',
+      '@media (min-resolution: 2dppx)': {
+        transform: 'translateX(calc(-100% + 0.25px))'
+      },
       '& > svg': {
         transform: "rotate(180deg)"
       }
@@ -44108,6 +44106,7 @@ Tag.Input = tag_input;
 
 
 function getResetMore(onFilter, container, doms) {
+  var restCount = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
   if (!container || !doms || !doms.length) return -1;
   var items = Array.from(doms);
   var style = getComputedStyle(container);
@@ -44119,6 +44118,7 @@ function getResetMore(onFilter, container, doms) {
   var hideEl = items.pop();
   var hideElStyle = getComputedStyle(hideEl);
   var hideMargin = parsePxToNumber(hideElStyle.marginLeft) + parsePxToNumber(hideElStyle.marginRight);
+  var total = items.length + restCount;
   var num = 0;
   var sumWidth = 0;
   var itemWidthArr = items.map(function (item) {
@@ -44134,7 +44134,7 @@ function getResetMore(onFilter, container, doms) {
     for (var i = 0; i < itemWidthArr.length; i++) {
       var itemLen = itemWidthArr[i];
       // number length
-      var resetNum = items.length - 1 - i;
+      var resetNum = total - 1 - i;
       var moreWidth = void 0;
       if (resetNum <= 0) {
         moreWidth = 0;
@@ -44149,7 +44149,7 @@ function getResetMore(onFilter, container, doms) {
         break;
       }
       num += 1;
-      if (i === items.length - 1) {
+      if (i === total - 1) {
         // not show more
         num = -1;
       }
@@ -44329,11 +44329,17 @@ var result_Result = function Result(props) {
     _useState4 = slicedToArray_default()(_useState3, 2),
     shouldResetMore = _useState4[0],
     setShouldResetMore = _useState4[1];
+  var _useState5 = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(0),
+    _useState6 = slicedToArray_default()(_useState5, 2),
+    measureKey = _useState6[0],
+    setMeasureKey = _useState6[1];
   var render = useRender();
   var resultRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
   var _useRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)({
       prevMore: more,
-      maxMore: 0
+      maxMore: 0,
+      // 估算偏小、需要渲染全部结果重新测量时的结果数量；按数量比较，值变化后的首次渲染不会沿用旧结论
+      showAllLength: 0
     }),
     context = _useRef.current;
   var removeLock = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(false);
@@ -44532,12 +44538,16 @@ var result_Result = function Result(props) {
   ]);
   var result = renderMultipleResult.results;
   var moreNumber = getCompressedBound();
+  // 测量折叠数量时只渲染容器可能放得下的数量（按每个 tag 至少 20px 估算），避免大量选中值时渲染全部 tag
+  var measureLimit = context.maxMore + 1;
+  var shouldLimitMeasure = compressed && !isCompressedBound() && !renderResultContentProp && more === -1 && context.maxMore > 0 && result_isArray(result) && result.length > Math.max(measureLimit, context.showAllLength);
+  var moreData = shouldLimitMeasure ? result.slice(0, measureLimit) : result;
   var renderMultipleResultMore = /*#__PURE__*/(0,jsx_runtime.jsx)(result_more, {
     keygen: keygen,
     onRemove: onRemove,
     classes: props.classes,
     jssStyle: props.jssStyle,
-    data: result,
+    data: moreData,
     datas: renderMultipleResult.datas,
     size: size,
     compressed: compressed,
@@ -44583,10 +44593,12 @@ var result_Result = function Result(props) {
     var exceedsCapacity = valueLength && valueLength > context.maxMore;
     if (hasExistingCompression && hasValidEstimate && exceedsCapacity && typeof requestIdleCallback !== 'undefined') {
       requestIdleCallback(function () {
+        context.showAllLength = 0;
         setMore(-1);
         setShouldResetMore(true);
       });
     } else {
+      context.showAllLength = 0;
       if (!renderCompressed) setMore(-1);
       setShouldResetMore(true);
     }
@@ -44660,7 +44672,16 @@ var result_Result = function Result(props) {
     if (shouldResetMore && more === -1 && compressed && resultRef.current && (props.value || []).length) {
       var tagClassName = ".".concat(styles.tag.split(' ')[0]);
       if (shouldResetMore && result_isArray(value) && (value || []).length) {
-        var newMore = getResetMore(showInput, resultRef.current, resultRef.current.querySelectorAll(tagClassName));
+        var restCount = shouldLimitMeasure ? result.length - moreData.length : 0;
+        var newMore = getResetMore(showInput, resultRef.current, resultRef.current.querySelectorAll(tagClassName), restCount);
+        // 只渲染了部分 tag 且全部放得下，说明估算偏小，渲染全部后重新测量
+        if (newMore === -1 && restCount > 0) {
+          context.showAllLength = result.length;
+          setMeasureKey(function (k) {
+            return k + 1;
+          });
+          return;
+        }
         context.prevMore = newMore;
         setMore(newMore);
         setShouldResetMore(false);
@@ -44670,7 +44691,7 @@ var result_Result = function Result(props) {
     } else if (shouldResetMore) {
       setShouldResetMore(false);
     }
-  }, [shouldResetMore]);
+  }, [shouldResetMore, measureKey]);
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
     if (!resultRef.current) return;
     if (!compressed) return;
@@ -80343,7 +80364,7 @@ var watermark_interface = __webpack_require__(6640);
 
 
 /* harmony default export */ var src_0 = ({
-  version: '3.10.3-beta.5'
+  version: '3.10.3-beta.7'
 });
 }();
 /******/ 	return __webpack_exports__;