@para-ui/core 4.0.20 → 4.0.21

package/_verture/{index-cc76d8d5.js → index-f59b0bc0.js}

@@ -1,7 +1,7 @@
 import { _ as __rest } from './tslib.es6-55ed4bd2.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { _ as _toConsumableArray, a as _iterableToArray } from './toConsumableArray-8f4c9589.js';
-import { _ as _defineProperty, a as _toPropertyKey } from './defineProperty-1d116156.js';
+import { _ as _defineProperty, t as toPropertyKey } from './defineProperty-6f62bb2a.js';
 import { _ as _slicedToArray, a as _arrayWithHoles, b as _nonIterableRest } from './slicedToArray-a8206399.js';
 import { _ as _typeof$1 } from './typeof-adeedc13.js';
 import * as React$4 from 'react';
@@ -21,7 +21,7 @@ import { Forbid } from '@para-ui/icons';
 import { $ as $prefixCls } from './constant-5317fc89.js';
 import LoadingOutlined from '@para-ui/icons/LoadingF';
 import AutoTips from '../AutoTips/index.js';
-import { u as useFormatMessage } from './useFormatMessage-eb13cf56.js';
+import { u as useFormatMessage } from './useFormatMessage-1fc7c957.js';
 import { UUID } from '@paraview/lib';
 import { s as styleInject } from './style-inject.es-300983ab.js';
 
@@ -231,8 +231,19 @@ var preWarningFns = [];
 var preMessage = function preMessage(fn) {
   preWarningFns.push(fn);
 };
+
+/**
+ * Warning if condition not match.
+ * @param valid Condition
+ * @param message Warning message
+ * @example
+ * ```js
+ * warning(false, 'some error'); // print some error
+ * warning(true, 'some error'); // print nothing
+ * warning(1 === 2, 'some error'); // print some error
+ * ```
+ */
 function warning(valid, message) {
-  // Support uglify
   if (process.env.NODE_ENV !== 'production' && !valid && console !== undefined) {
     var finalMessage = preWarningFns.reduce(function (msg, preMessageFn) {
       return preMessageFn(msg !== null && msg !== void 0 ? msg : '', 'warning');
@@ -242,8 +253,9 @@ function warning(valid, message) {
     }
   }
 }
+
+/** @see Similar to {@link warning} */
 function note(valid, message) {
-  // Support uglify
   if (process.env.NODE_ENV !== 'production' && !valid && console !== undefined) {
     var finalMessage = preWarningFns.reduce(function (msg, preMessageFn) {
       return preMessageFn(msg !== null && msg !== void 0 ? msg : '', 'note');
@@ -262,16 +274,19 @@ function call(method, valid, message) {
     warned[message] = true;
   }
 }
+
+/** @see Same as {@link warning}, but only warn once for the same message */
 function warningOnce(valid, message) {
   call(warning, valid, message);
 }
+
+/** @see Same as {@link warning}, but only warn once for the same message */
 function noteOnce(valid, message) {
   call(note, valid, message);
 }
 warningOnce.preMessage = preMessage;
 warningOnce.resetWarned = resetWarned;
 warningOnce.noteOnce = noteOnce;
-/* eslint-enable */
 
 var classnames = {exports: {}};
 
@@ -288,39 +303,57 @@ var classnames = {exports: {}};
 
 		var hasOwn = {}.hasOwnProperty;
 
-		function classNames() {
-			var classes = [];
+		function classNames () {
+			var classes = '';
 
 			for (var i = 0; i < arguments.length; i++) {
 				var arg = arguments[i];
-				if (!arg) continue;
-
-				var argType = typeof arg;
-
-				if (argType === 'string' || argType === 'number') {
-					classes.push(arg);
-				} else if (Array.isArray(arg)) {
-					if (arg.length) {
-						var inner = classNames.apply(null, arg);
-						if (inner) {
-							classes.push(inner);
-						}
-					}
-				} else if (argType === 'object') {
-					if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
-						classes.push(arg.toString());
-						continue;
-					}
-
-					for (var key in arg) {
-						if (hasOwn.call(arg, key) && arg[key]) {
-							classes.push(key);
-						}
-					}
+				if (arg) {
+					classes = appendClass(classes, parseValue(arg));
 				}
 			}
 
-			return classes.join(' ');
+			return classes;
+		}
+
+		function parseValue (arg) {
+			if (typeof arg === 'string' || typeof arg === 'number') {
+				return arg;
+			}
+
+			if (typeof arg !== 'object') {
+				return '';
+			}
+
+			if (Array.isArray(arg)) {
+				return classNames.apply(null, arg);
+			}
+
+			if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
+				return arg.toString();
+			}
+
+			var classes = '';
+
+			for (var key in arg) {
+				if (hasOwn.call(arg, key) && arg[key]) {
+					classes = appendClass(classes, key);
+				}
+			}
+
+			return classes;
+		}
+
+		function appendClass (value, newClass) {
+			if (!newClass) {
+				return value;
+			}
+		
+			if (value) {
+				return value + ' ' + newClass;
+			}
+		
+			return value + newClass;
 		}
 
 		if (module.exports) {
@@ -1198,12 +1231,12 @@ function supportRef(nodeOrComponent) {
   var type = reactIs.exports.isMemo(nodeOrComponent) ? nodeOrComponent.type.type : nodeOrComponent.type;
 
   // Function component node
-  if (typeof type === 'function' && !((_type$prototype = type.prototype) !== null && _type$prototype !== void 0 && _type$prototype.render)) {
+  if (typeof type === 'function' && !((_type$prototype = type.prototype) !== null && _type$prototype !== void 0 && _type$prototype.render) && type.$$typeof !== reactIs.exports.ForwardRef) {
     return false;
   }
 
   // Class component
-  if (typeof nodeOrComponent === 'function' && !((_nodeOrComponent$prot = nodeOrComponent.prototype) !== null && _nodeOrComponent$prot !== void 0 && _nodeOrComponent$prot.render)) {
+  if (typeof nodeOrComponent === 'function' && !((_nodeOrComponent$prot = nodeOrComponent.prototype) !== null && _nodeOrComponent$prot !== void 0 && _nodeOrComponent$prot.render) && nodeOrComponent.$$typeof !== reactIs.exports.ForwardRef) {
     return false;
   }
   return true;
@@ -2466,7 +2499,7 @@ function _defineProperties(target, props) {
     descriptor.enumerable = descriptor.enumerable || false;
     descriptor.configurable = true;
     if ("value" in descriptor) descriptor.writable = true;
-    Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+    Object.defineProperty(target, toPropertyKey(descriptor.key), descriptor);
   }
 }
 function _createClass(Constructor, protoProps, staticProps) {
@@ -2511,15 +2544,12 @@ function _getPrototypeOf(o) {
 }
 
 function _isNativeReflectConstruct() {
-  if (typeof Reflect === "undefined" || !Reflect.construct) return false;
-  if (Reflect.construct.sham) return false;
-  if (typeof Proxy === "function") return true;
   try {
-    Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
-    return true;
-  } catch (e) {
-    return false;
-  }
+    var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
+  } catch (t) {}
+  return (_isNativeReflectConstruct = function _isNativeReflectConstruct() {
+    return !!t;
+  })();
 }
 
 function _assertThisInitialized(self) {
@@ -3903,7 +3933,7 @@ function injectCSS(css) {
   if (prepend) {
     // If is queue `prepend`, it will prepend first style and then append rest style
     if (isPrependQueue) {
-      var existStyle = findStyles(container).filter(function (node) {
+      var existStyle = (option.styles || findStyles(container)).filter(function (node) {
         // Ignore style which not injected by rc-util with prepend
         if (!['prepend', 'prependQueue'].includes(node.getAttribute(APPEND_ORDER))) {
           return false;
@@ -3929,7 +3959,7 @@ function injectCSS(css) {
 function findExistNode(key) {
   var option = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   var container = getContainer(option);
-  return findStyles(container).find(function (node) {
+  return (option.styles || findStyles(container)).find(function (node) {
     return node.getAttribute(getMark(option)) === key;
   });
 }
@@ -3957,8 +3987,12 @@ function syncRealContainer(container, option) {
   }
 }
 function updateCSS(css, key) {
-  var option = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-  var container = getContainer(option);
+  var originOption = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  var container = getContainer(originOption);
+  var styles = findStyles(container);
+  var option = _objectSpread2(_objectSpread2({}, originOption), {}, {
+    styles: styles
+  });
 
   // Sync real parent
   syncRealContainer(container, option);
@@ -3980,43 +4014,60 @@ function updateCSS(css, key) {
 }
 
 /* eslint-disable no-param-reassign */
+function measureScrollbarSize(ele) {
+  var randomId = "rc-scrollbar-measure-".concat(Math.random().toString(36).substring(7));
+  var measureEle = document.createElement('div');
+  measureEle.id = randomId;
+
+  // Create Style
+  var measureStyle = measureEle.style;
+  measureStyle.position = 'absolute';
+  measureStyle.left = '0';
+  measureStyle.top = '0';
+  measureStyle.width = '100px';
+  measureStyle.height = '100px';
+  measureStyle.overflow = 'scroll';
+
+  // Clone Style if needed
+  var fallbackWidth;
+  var fallbackHeight;
+  if (ele) {
+    var targetStyle = getComputedStyle(ele);
+    measureStyle.scrollbarColor = targetStyle.scrollbarColor;
+    measureStyle.scrollbarWidth = targetStyle.scrollbarWidth;
+
+    // Set Webkit style
+    var webkitScrollbarStyle = getComputedStyle(ele, '::-webkit-scrollbar');
+    var width = parseInt(webkitScrollbarStyle.width, 10);
+    var height = parseInt(webkitScrollbarStyle.height, 10);
+
+    // Try wrap to handle CSP case
+    try {
+      var widthStyle = width ? "width: ".concat(webkitScrollbarStyle.width, ";") : '';
+      var heightStyle = height ? "height: ".concat(webkitScrollbarStyle.height, ";") : '';
+      updateCSS("\n#".concat(randomId, "::-webkit-scrollbar {\n").concat(widthStyle, "\n").concat(heightStyle, "\n}"), randomId);
+    } catch (e) {
+      // Can't wrap, just log error
+      console.error(e);
+
+      // Get from style directly
+      fallbackWidth = width;
+      fallbackHeight = height;
+    }
+  }
+  document.body.appendChild(measureEle);
+
+  // Measure. Get fallback style if provided
+  var scrollWidth = ele && fallbackWidth && !isNaN(fallbackWidth) ? fallbackWidth : measureEle.offsetWidth - measureEle.clientWidth;
+  var scrollHeight = ele && fallbackHeight && !isNaN(fallbackHeight) ? fallbackHeight : measureEle.offsetHeight - measureEle.clientHeight;
 
-var cached;
-function getScrollBarSize(fresh) {
-  if (typeof document === 'undefined') {
-    return 0;
-  }
-  if (fresh || cached === undefined) {
-    var inner = document.createElement('div');
-    inner.style.width = '100%';
-    inner.style.height = '200px';
-    var outer = document.createElement('div');
-    var outerStyle = outer.style;
-    outerStyle.position = 'absolute';
-    outerStyle.top = '0';
-    outerStyle.left = '0';
-    outerStyle.pointerEvents = 'none';
-    outerStyle.visibility = 'hidden';
-    outerStyle.width = '200px';
-    outerStyle.height = '150px';
-    outerStyle.overflow = 'hidden';
-    outer.appendChild(inner);
-    document.body.appendChild(outer);
-    var widthContained = inner.offsetWidth;
-    outer.style.overflow = 'scroll';
-    var widthScroll = inner.offsetWidth;
-    if (widthContained === widthScroll) {
-      widthScroll = outer.clientWidth;
-    }
-    document.body.removeChild(outer);
-    cached = widthContained - widthScroll;
-  }
-  return cached;
-}
-function ensureSize(str) {
-  var match = str.match(/^(.*)px$/);
-  var value = Number(match === null || match === void 0 ? void 0 : match[1]);
-  return Number.isNaN(value) ? getScrollBarSize() : value;
+  // Clean up
+  document.body.removeChild(measureEle);
+  removeCSS(randomId);
+  return {
+    width: scrollWidth,
+    height: scrollHeight
+  };
 }
 function getTargetScrollBarSize(target) {
   if (typeof document === 'undefined' || !target || !(target instanceof Element)) {
@@ -4025,13 +4076,7 @@ function getTargetScrollBarSize(target) {
       height: 0
     };
   }
-  var _getComputedStyle = getComputedStyle(target, '::-webkit-scrollbar'),
-    width = _getComputedStyle.width,
-    height = _getComputedStyle.height;
-  return {
-    width: ensureSize(width),
-    height: ensureSize(height)
-  };
+  return measureScrollbarSize(target);
 }
 
 /**
@@ -5355,7 +5400,9 @@ var _excluded$6 = ["prefixCls", "children", "action", "showAction", "hideAction"
 // Removed Props List
 // Seems this can be auto
 // getDocument?: (element?: HTMLElement) => Document;
+
 // New version will not wrap popup with `rc-trigger-popup-content` when multiple children
+
 function generateTrigger() {
   var PortalComponent = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : Portal;
   var Trigger = /*#__PURE__*/React$4.forwardRef(function (props, ref) {
@@ -5703,9 +5750,9 @@ function generateTrigger() {
       wrapperAction('onPointerEnter', true, mouseEnterDelay, function (event) {
         setMousePosByEvent(event);
       });
-      onPopupMouseEnter = function onPopupMouseEnter() {
+      onPopupMouseEnter = function onPopupMouseEnter(event) {
         // Only trigger re-open when popup is visible
-        if (mergedOpen || inMotion) {
+        if ((mergedOpen || inMotion) && popupEle !== null && popupEle !== void 0 && popupEle.contains(event.target)) {
           triggerOpen(true, mouseEnterDelay);
         }
       };
@@ -6930,16 +6977,15 @@ var Filler = /*#__PURE__*/React$4.forwardRef(function (_ref, ref) {
     flexDirection: 'column'
   };
   if (offsetY !== undefined) {
-    var _objectSpread2$1;
     // Not set `width` since this will break `sticky: right`
     outerStyle = {
       height: height,
       position: 'relative',
       overflow: 'hidden'
     };
-    innerStyle = _objectSpread2(_objectSpread2({}, innerStyle), {}, (_objectSpread2$1 = {
+    innerStyle = _objectSpread2(_objectSpread2({}, innerStyle), {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
       transform: "translateY(".concat(offsetY, "px)")
-    }, _defineProperty(_objectSpread2$1, rtl ? 'marginRight' : 'marginLeft', -offsetX), _defineProperty(_objectSpread2$1, "position", 'absolute'), _defineProperty(_objectSpread2$1, "left", 0), _defineProperty(_objectSpread2$1, "right", 0), _defineProperty(_objectSpread2$1, "top", 0), _objectSpread2$1));
+    }, rtl ? 'marginRight' : 'marginLeft', -offsetX), "position", 'absolute'), "left", 0), "right", 0), "top", 0));
   }
   return /*#__PURE__*/React$4.createElement("div", {
     style: outerStyle
@@ -6963,7 +7009,6 @@ function getPageXY(e, horizontal) {
   return obj[horizontal ? 'pageX' : 'pageY'];
 }
 var ScrollBar = /*#__PURE__*/React$4.forwardRef(function (props, ref) {
-  var _classNames;
   var prefixCls = props.prefixCls,
     rtl = props.rtl,
     scrollOffset = props.scrollOffset,
@@ -6989,9 +7034,11 @@ var ScrollBar = /*#__PURE__*/React$4.forwardRef(function (props, ref) {
     startTop = _React$useState6[0],
     setStartTop = _React$useState6[1];
   var isLTR = !rtl;
+
   // ========================= Refs =========================
   var scrollbarRef = React$4.useRef();
   var thumbRef = React$4.useRef();
+
   // ======================= Visible ========================
   var _React$useState7 = React$4.useState(false),
     _React$useState8 = _slicedToArray(_React$useState7, 2),
@@ -7005,11 +7052,11 @@ var ScrollBar = /*#__PURE__*/React$4.forwardRef(function (props, ref) {
       setVisible(false);
     }, 3000);
   };
+
   // ======================== Range =========================
   var enableScrollRange = scrollRange - containerSize || 0;
   var enableOffsetRange = containerSize - spinSize || 0;
-  // `scrollWidth` < `clientWidth` means no need to show scrollbar
-  var canScroll = enableScrollRange > 0;
+
   // ========================= Top ==========================
   var top = React$4.useMemo(function () {
     if (scrollOffset === 0 || enableScrollRange === 0) {
@@ -7018,11 +7065,13 @@ var ScrollBar = /*#__PURE__*/React$4.forwardRef(function (props, ref) {
     var ptg = scrollOffset / enableScrollRange;
     return ptg * enableOffsetRange;
   }, [scrollOffset, enableScrollRange, enableOffsetRange]);
+
   // ====================== Container =======================
   var onContainerMouseDown = function onContainerMouseDown(e) {
     e.stopPropagation();
     e.preventDefault();
   };
+
   // ======================== Thumb =========================
   var stateRef = React$4.useRef({
     top: top,
@@ -7044,7 +7093,9 @@ var ScrollBar = /*#__PURE__*/React$4.forwardRef(function (props, ref) {
     e.stopPropagation();
     e.preventDefault();
   };
+
   // ======================== Effect ========================
+
   // React make event as passive, but we need to preventDefault
   // Add event on dom directly instead.
   // ref: https://github.com/facebook/react/issues/9809
@@ -7061,6 +7112,7 @@ var ScrollBar = /*#__PURE__*/React$4.forwardRef(function (props, ref) {
       thumbEle.removeEventListener('touchstart', onThumbMouseDown);
     };
   }, []);
+
   // Pass to effect
   var enableScrollRangeRef = React$4.useRef();
   enableScrollRangeRef.current = enableScrollRange;
@@ -7114,17 +7166,19 @@ var ScrollBar = /*#__PURE__*/React$4.forwardRef(function (props, ref) {
   React$4.useEffect(function () {
     delayHidden();
   }, [scrollOffset]);
+
   // ====================== Imperative ======================
   React$4.useImperativeHandle(ref, function () {
     return {
       delayHidden: delayHidden
     };
   });
+
   // ======================== Render ========================
   var scrollbarPrefixCls = "".concat(prefixCls, "-scrollbar");
   var containerStyle = {
     position: 'absolute',
-    visibility: visible && canScroll ? null : 'hidden'
+    visibility: visible ? null : 'hidden'
   };
   var thumbStyle = {
     position: 'absolute',
@@ -7139,6 +7193,7 @@ var ScrollBar = /*#__PURE__*/React$4.forwardRef(function (props, ref) {
     containerStyle.left = 0;
     containerStyle.right = 0;
     containerStyle.bottom = 0;
+
     // Thumb
     thumbStyle.height = '100%';
     thumbStyle.width = spinSize;
@@ -7157,6 +7212,7 @@ var ScrollBar = /*#__PURE__*/React$4.forwardRef(function (props, ref) {
     } else {
       containerStyle.left = 0;
     }
+
     // Thumb
     thumbStyle.width = '100%';
     thumbStyle.height = spinSize;
@@ -7164,7 +7220,7 @@ var ScrollBar = /*#__PURE__*/React$4.forwardRef(function (props, ref) {
   }
   return /*#__PURE__*/React$4.createElement("div", {
     ref: scrollbarRef,
-    className: classNames(scrollbarPrefixCls, (_classNames = {}, _defineProperty(_classNames, "".concat(scrollbarPrefixCls, "-horizontal"), horizontal), _defineProperty(_classNames, "".concat(scrollbarPrefixCls, "-vertical"), !horizontal), _defineProperty(_classNames, "".concat(scrollbarPrefixCls, "-visible"), visible), _classNames)),
+    className: classNames(scrollbarPrefixCls, _defineProperty(_defineProperty(_defineProperty({}, "".concat(scrollbarPrefixCls, "-horizontal"), horizontal), "".concat(scrollbarPrefixCls, "-vertical"), !horizontal), "".concat(scrollbarPrefixCls, "-visible"), visible)),
     style: _objectSpread2(_objectSpread2({}, containerStyle), style),
     onMouseDown: onContainerMouseDown,
     onMouseMove: delayHidden
@@ -7213,10 +7269,10 @@ function useChildren(list, startIndex, endIndex, scrollWidth, setNodeRef, render
 var CacheMap = /*#__PURE__*/function () {
   function CacheMap() {
     _classCallCheck(this, CacheMap);
-    this.maps = void 0;
+    _defineProperty(this, "maps", void 0);
     // Used for cache key
     // `useMemo` no need to update if `id` not change
-    this.id = 0;
+    _defineProperty(this, "id", 0);
     this.maps = Object.create(null);
   }
   _createClass(CacheMap, [{
@@ -7258,6 +7314,7 @@ function useHeights(getKey, onItemAdd, onItemRemove) {
           }
         }
       });
+
       // Always trigger update mark to tell parent that should re-calculate heights when resized
       setUpdatedMark(function (c) {
         return c + 1;
@@ -7278,12 +7335,13 @@ function useHeights(getKey, onItemAdd, onItemRemove) {
     } else {
       instanceRef.current.delete(key);
     }
+
     // Instance changed
     if (!origin !== !instance) {
       if (instance) {
-        onItemAdd === null || onItemAdd === void 0 ? void 0 : onItemAdd(item);
+        onItemAdd === null || onItemAdd === void 0 || onItemAdd(item);
       } else {
-        onItemRemove === null || onItemRemove === void 0 ? void 0 : onItemRemove(item);
+        onItemRemove === null || onItemRemove === void 0 || onItemRemove(item);
       }
     }
   }
@@ -7300,6 +7358,7 @@ function useScrollTo(containerRef, data, heights, itemHeight, getKey, collectHei
     _React$useState2 = _slicedToArray(_React$useState, 2),
     syncState = _React$useState2[0],
     setSyncState = _React$useState2[1];
+
   // ========================== Sync Scroll ==========================
   useLayoutEffect$3(function () {
     if (syncState && syncState.times < MAX_TIMES) {
@@ -7319,9 +7378,11 @@ function useScrollTo(containerRef, data, heights, itemHeight, getKey, collectHei
       var needCollectHeight = false;
       var newTargetAlign = targetAlign;
       var targetTop = null;
+
       // Go to next frame if height not exist
       if (height) {
         var mergedAlign = targetAlign || originAlign;
+
         // Get top & bottom
         var stackTop = 0;
         var itemTop = 0;
@@ -7334,6 +7395,7 @@ function useScrollTo(containerRef, data, heights, itemHeight, getKey, collectHei
           itemBottom = itemTop + (cacheHeight === undefined ? itemHeight : cacheHeight);
           stackTop = itemBottom;
         }
+
         // Check if need sync height (visible range has item not record height)
         var leftHeight = mergedAlign === 'top' ? offset : height - offset;
         for (var _i = maxLen; _i >= 0; _i -= 1) {
@@ -7348,6 +7410,7 @@ function useScrollTo(containerRef, data, heights, itemHeight, getKey, collectHei
             break;
           }
         }
+
         // Scroll to
         switch (mergedAlign) {
           case 'top':
@@ -7370,11 +7433,13 @@ function useScrollTo(containerRef, data, heights, itemHeight, getKey, collectHei
         if (targetTop !== null) {
           syncScrollTop(targetTop);
         }
+
         // One more time for sync
         if (targetTop !== syncState.lastTop) {
           needCollectHeight = true;
         }
       }
+
       // Trigger next effect
       if (needCollectHeight) {
         setSyncState(_objectSpread2(_objectSpread2({}, syncState), {}, {
@@ -7387,6 +7452,7 @@ function useScrollTo(containerRef, data, heights, itemHeight, getKey, collectHei
       warningOnce(false, 'Seems `scrollTo` with `rc-virtual-list` reach the max limitation. Please fire issue for us. Thanks.');
     }
   }, [syncState, containerRef.current]);
+
   // =========================== Scroll To ===========================
   return function (arg) {
     // When not argument provided, we think dev may want to show the scrollbar
@@ -7394,6 +7460,7 @@ function useScrollTo(containerRef, data, heights, itemHeight, getKey, collectHei
       triggerFlash();
       return;
     }
+
     // Normal scroll logic
     wrapperRaf.cancel(scrollRef.current);
     if (typeof arg === 'number') {
@@ -7433,6 +7500,7 @@ function useScrollTo(containerRef, data, heights, itemHeight, getKey, collectHei
  * [5]: 9
  * [6]: 3
  */
+
 /**
  * We assume that 2 list has only 1 item diff and others keeping the order.
  * So we can use dichotomy algorithm to find changed one.
@@ -7461,6 +7529,7 @@ function findListDiffIndex(originList, targetList, getKey) {
     }
     return notExistKey;
   }
+
   // Loop to find diff one
   var diffIndex = null;
   var multiple = Math.abs(originLen - targetLen) !== 1;
@@ -7491,7 +7560,7 @@ function useDiffItem(data, getKey, onDiff) {
   React$4.useEffect(function () {
     var diff = findListDiffIndex(prevData || [], data || [], getKey);
     if ((diff === null || diff === void 0 ? void 0 : diff.index) !== undefined) {
-      onDiff === null || onDiff === void 0 ? void 0 : onDiff(diff.index);
+      onDiff === null || onDiff === void 0 || onDiff(diff.index);
       setDiffItem(data[diff.index]);
     }
     setPrevData(data);
@@ -7512,6 +7581,7 @@ var useOriginScroll = (function (isScrollAtTop, isScrollAtBottom) {
       lockRef.current = false;
     }, 50);
   }
+
   // Pass to ref since global add is in closure
   var scrollPingRef = useRef({
     top: isScrollAtTop,
@@ -7544,17 +7614,21 @@ function useFrameWheel(inVirtual, isScrollAtTop, isScrollAtBottom, horizontalScr
 onWheelDelta) {
   var offsetRef = useRef(0);
   var nextFrameRef = useRef(null);
+
   // Firefox patch
   var wheelValueRef = useRef(null);
   var isMouseScrollRef = useRef(false);
+
   // Scroll status sync
   var originScroll = useOriginScroll(isScrollAtTop, isScrollAtBottom);
   function onWheelY(event, deltaY) {
     wrapperRaf.cancel(nextFrameRef.current);
     offsetRef.current += deltaY;
     wheelValueRef.current = deltaY;
+
     // Do nothing when scroll at the edge, Skip check when is in scroll
     if (originScroll(deltaY)) return;
+
     // Proxy of scroll events
     if (!isFF) {
       event.preventDefault();
@@ -7573,11 +7647,13 @@ onWheelDelta) {
       event.preventDefault();
     }
   }
+
   // Check for which direction does wheel do. `sx` means `shift + wheel`
   var wheelDirectionRef = useRef(null);
   var wheelDirectionCleanRef = useRef(null);
   function onWheel(event) {
     if (!inVirtual) return;
+
     // Wait for 2 frame to clean direction
     wrapperRaf.cancel(wheelDirectionCleanRef.current);
     wheelDirectionCleanRef.current = wrapperRaf(function () {
@@ -7604,6 +7680,7 @@ onWheelDelta) {
       onWheelX(event, mergedDeltaX);
     }
   }
+
   // A patch for firefox
   function onFireFoxScroll(event) {
     if (!inVirtual) return;
@@ -7617,23 +7694,26 @@ function useMobileTouchMove(inVirtual, listRef, callback) {
   var touchedRef = useRef(false);
   var touchYRef = useRef(0);
   var elementRef = useRef(null);
+
   // Smooth scroll
   var intervalRef = useRef(null);
+
   /* eslint-disable prefer-const */
   var cleanUpEvents;
   var onTouchMove = function onTouchMove(e) {
     if (touchedRef.current) {
       var currentY = Math.ceil(e.touches[0].pageY);
-      var offsetY = touchYRef.current - currentY;
+      var _offsetY = touchYRef.current - currentY;
       touchYRef.current = currentY;
-      if (callback(offsetY)) {
+      if (callback(_offsetY)) {
         e.preventDefault();
       }
+
       // Smooth interval
       clearInterval(intervalRef.current);
       intervalRef.current = setInterval(function () {
-        offsetY *= SMOOTH_PTG;
-        if (!callback(offsetY, true) || Math.abs(offsetY) <= 0.1) {
+        _offsetY *= SMOOTH_PTG;
+        if (!callback(_offsetY, true) || Math.abs(_offsetY) <= 0.1) {
           clearInterval(intervalRef.current);
         }
       }, 16);
@@ -7665,7 +7745,7 @@ function useMobileTouchMove(inVirtual, listRef, callback) {
     }
     return function () {
       var _listRef$current;
-      (_listRef$current = listRef.current) === null || _listRef$current === void 0 ? void 0 : _listRef$current.removeEventListener('touchstart', onTouchStart);
+      (_listRef$current = listRef.current) === null || _listRef$current === void 0 || _listRef$current.removeEventListener('touchstart', onTouchStart);
       cleanUpEvents();
       clearInterval(intervalRef.current);
     };
@@ -7676,12 +7756,11 @@ var MIN_SIZE = 20;
 function getSpinSize() {
   var containerSize = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
   var scrollRange = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-  var baseSize = containerSize / scrollRange * 100;
+  var baseSize = containerSize / scrollRange * containerSize;
   if (isNaN(baseSize)) {
     baseSize = 0;
   }
   baseSize = Math.max(baseSize, MIN_SIZE);
-  baseSize = Math.min(baseSize, containerSize / 2);
   return Math.floor(baseSize);
 }
 
@@ -7701,6 +7780,7 @@ function useGetSize(mergedData, getKey, heights, itemHeight) {
     // Get from cache first
     var startIndex = key2Index.get(startKey);
     var endIndex = key2Index.get(endKey);
+
     // Loop to fill the cache
     if (startIndex === undefined || endIndex === undefined) {
       var dataLen = mergedData.length;
@@ -7760,6 +7840,7 @@ function RawList(props, ref) {
     extraRender = props.extraRender,
     styles = props.styles,
     restProps = _objectWithoutProperties(props, _excluded$2);
+
   // ================================= MISC =================================
   var useVirtual = !!(virtual !== false && height && itemHeight);
   var inVirtual = useVirtual && data && (itemHeight * data.length > height || !!scrollWidth);
@@ -7768,7 +7849,9 @@ function RawList(props, ref) {
   var mergedData = data || EMPTY_DATA;
   var componentRef = useRef();
   var fillerInnerRef = useRef();
+
   // =============================== Item Key ===============================
+
   var _useState = useState$1(0),
     _useState2 = _slicedToArray(_useState, 2),
     offsetTop = _useState2[0],
@@ -7787,6 +7870,7 @@ function RawList(props, ref) {
   var onScrollbarStopMove = function onScrollbarStopMove() {
     setScrollMoving(false);
   };
+
   // =============================== Item Key ===============================
   var getKey = React$4.useCallback(function (item) {
     if (typeof itemKey === 'function') {
@@ -7797,6 +7881,7 @@ function RawList(props, ref) {
   var sharedConfig = {
     getKey: getKey
   };
+
   // ================================ Scroll ================================
   function syncScrollTop(newTop) {
     setOffsetTop(function (origin) {
@@ -7811,6 +7896,7 @@ function RawList(props, ref) {
       return alignedTop;
     });
   }
+
   // ================================ Legacy ================================
   // Put ref here since the range is generate by follow
   var rangeRef = useRef({
@@ -7822,6 +7908,7 @@ function RawList(props, ref) {
     _useDiffItem2 = _slicedToArray(_useDiffItem, 1),
     diffItem = _useDiffItem2[0];
   diffItemRef.current = diffItem;
+
   // ================================ Height ================================
   var _useHeights = useHeights(getKey, null, null),
     _useHeights2 = _slicedToArray(_useHeights, 4),
@@ -7829,6 +7916,7 @@ function RawList(props, ref) {
     collectHeight = _useHeights2[1],
     heights = _useHeights2[2],
     heightUpdatedMark = _useHeights2[3];
+
   // ========================== Visible Calculation =========================
   var _React$useMemo = React$4.useMemo(function () {
       if (!useVirtual) {
@@ -7839,6 +7927,7 @@ function RawList(props, ref) {
           offset: undefined
         };
       }
+
       // Always use virtual scroll bar in avoid shaking
       if (!inVirtual) {
         var _fillerInnerRef$curre;
@@ -7855,21 +7944,24 @@ function RawList(props, ref) {
       var endIndex;
       var dataLen = mergedData.length;
       for (var i = 0; i < dataLen; i += 1) {
-        var item = mergedData[i];
-        var key = getKey(item);
+        var _item = mergedData[i];
+        var key = getKey(_item);
         var cacheHeight = heights.get(key);
         var currentItemBottom = itemTop + (cacheHeight === undefined ? itemHeight : cacheHeight);
+
         // Check item top in the range
         if (currentItemBottom >= offsetTop && startIndex === undefined) {
           startIndex = i;
           startOffset = itemTop;
         }
+
         // Check item bottom in the range. We will render additional one item for motion usage
         if (currentItemBottom > offsetTop + height && endIndex === undefined) {
           endIndex = i;
         }
         itemTop = currentItemBottom;
       }
+
       // When scrollTop at the end but data cut to small count will reach this
       if (startIndex === undefined) {
         startIndex = 0;
@@ -7879,6 +7971,7 @@ function RawList(props, ref) {
       if (endIndex === undefined) {
         endIndex = mergedData.length - 1;
       }
+
       // Give cache to improve scroll experience
       endIndex = Math.min(endIndex + 1, mergedData.length - 1);
       return {
@@ -7894,6 +7987,7 @@ function RawList(props, ref) {
     fillerOffset = _React$useMemo.offset;
   rangeRef.current.start = start;
   rangeRef.current.end = end;
+
   // ================================= Size =================================
   var _React$useState = React$4.useState({
       width: 0,
@@ -7908,6 +8002,7 @@ function RawList(props, ref) {
       height: sizeInfo.height || sizeInfo.offsetHeight
     });
   };
+
   // Hack on scrollbar to enable flash call
   var verticalScrollBarRef = useRef();
   var horizontalScrollBarRef = useRef();
@@ -7917,6 +8012,7 @@ function RawList(props, ref) {
   var verticalScrollBarSpinSize = React$4.useMemo(function () {
     return getSpinSize(size.height, scrollHeight);
   }, [size.height, scrollHeight]);
+
   // =============================== In Range ===============================
   var maxScrollHeight = scrollHeight - height;
   var maxScrollHeightRef = useRef(maxScrollHeight);
@@ -7932,6 +8028,7 @@ function RawList(props, ref) {
   var isScrollAtTop = offsetTop <= 0;
   var isScrollAtBottom = offsetTop >= maxScrollHeight;
   var originScroll = useOriginScroll(isScrollAtTop, isScrollAtBottom);
+
   // ================================ Scroll ================================
   var getVirtualScrollInfo = function getVirtualScrollInfo() {
     return {
@@ -7943,6 +8040,7 @@ function RawList(props, ref) {
   var triggerScroll = useEvent$2(function () {
     if (onVirtualScroll) {
       var nextInfo = getVirtualScrollInfo();
+
       // Trigger when offset changed
       if (lastVirtualScrollInfoRef.current.x !== nextInfo.x || lastVirtualScrollInfoRef.current.y !== nextInfo.y) {
         onVirtualScroll(nextInfo);
@@ -7961,14 +8059,16 @@ function RawList(props, ref) {
       syncScrollTop(newOffset);
     }
   }
+
   // When data size reduce. It may trigger native scroll event back to fit scroll position
   function onFallbackScroll(e) {
     var newScrollTop = e.currentTarget.scrollTop;
     if (newScrollTop !== offsetTop) {
       syncScrollTop(newScrollTop);
     }
+
     // Trigger origin onScroll
-    onScroll === null || onScroll === void 0 ? void 0 : onScroll(e);
+    onScroll === null || onScroll === void 0 || onScroll(e);
     triggerScroll();
   }
   var keepInHorizontalRange = function keepInHorizontalRange(nextOffsetLeft) {
@@ -7981,6 +8081,7 @@ function RawList(props, ref) {
   var onWheelDelta = useEvent$2(function (offsetXY, fromHorizontal) {
     if (fromHorizontal) {
       // Horizontal scroll no need sync virtual position
+
       flushSync(function () {
         setOffsetLeft(function (left) {
           var nextOffsetLeft = left + (isRTL ? -offsetXY : offsetXY);
@@ -7995,11 +8096,13 @@ function RawList(props, ref) {
       });
     }
   });
+
   // Since this added in global,should use ref to keep update
   var _useFrameWheel = useFrameWheel(useVirtual, isScrollAtTop, isScrollAtBottom, !!scrollWidth, onWheelDelta),
     _useFrameWheel2 = _slicedToArray(_useFrameWheel, 2),
     onRawWheel = _useFrameWheel2[0],
     onFireFoxScroll = _useFrameWheel2[1];
+
   // Mobile touch move
   useMobileTouchMove(useVirtual, componentRef, function (deltaY, smoothOffset) {
     if (originScroll(deltaY, smoothOffset)) {
@@ -8028,6 +8131,7 @@ function RawList(props, ref) {
       componentEle.removeEventListener('MozMousePixelScroll', onMozMousePixelScroll);
     };
   }, [useVirtual]);
+
   // Sync scroll left
   useLayoutEffect$3(function () {
     if (scrollWidth) {
@@ -8036,11 +8140,12 @@ function RawList(props, ref) {
       });
     }
   }, [size.width, scrollWidth]);
+
   // ================================= Ref ==================================
   var delayHideScrollBar = function delayHideScrollBar() {
     var _verticalScrollBarRef, _horizontalScrollBarR;
-    (_verticalScrollBarRef = verticalScrollBarRef.current) === null || _verticalScrollBarRef === void 0 ? void 0 : _verticalScrollBarRef.delayHidden();
-    (_horizontalScrollBarR = horizontalScrollBarRef.current) === null || _horizontalScrollBarR === void 0 ? void 0 : _horizontalScrollBarR.delayHidden();
+    (_verticalScrollBarRef = verticalScrollBarRef.current) === null || _verticalScrollBarRef === void 0 || _verticalScrollBarRef.delayHidden();
+    (_horizontalScrollBarR = horizontalScrollBarRef.current) === null || _horizontalScrollBarR === void 0 || _horizontalScrollBarR.delayHidden();
   };
   var _scrollTo = useScrollTo(componentRef, mergedData, heights, itemHeight, getKey, function () {
     return collectHeight(true);
@@ -8057,6 +8162,7 @@ function RawList(props, ref) {
           if (config.left !== undefined) {
             setOffsetLeft(keepInHorizontalRange(config.left));
           }
+
           // Scroll Y
           _scrollTo(config.top);
         } else {
@@ -8065,6 +8171,7 @@ function RawList(props, ref) {
       }
     };
   });
+
   // ================================ Effect ================================
   /** We need told outside that some list not rendered */
   useLayoutEffect$3(function () {
@@ -8073,6 +8180,7 @@ function RawList(props, ref) {
       onVisibleChange(renderList, mergedData);
     }
   }, [start, end, mergedData]);
+
   // ================================ Extra =================================
   var getSize = useGetSize(mergedData, getKey, heights, itemHeight);
   var extraContent = extraRender === null || extraRender === void 0 ? void 0 : extraRender({
@@ -8084,6 +8192,7 @@ function RawList(props, ref) {
     rtl: isRTL,
     getSize: getSize
   });
+
   // ================================ Render ================================
   var listChildren = useChildren(mergedData, start, end, scrollWidth, setInstanceRef, children, sharedConfig);
   var componentStyle = null;
@@ -8140,7 +8249,7 @@ function RawList(props, ref) {
     containerSize: size.height,
     style: styles === null || styles === void 0 ? void 0 : styles.verticalScrollBar,
     thumbStyle: styles === null || styles === void 0 ? void 0 : styles.verticalScrollBarThumb
-  }), inVirtual && scrollWidth && /*#__PURE__*/React$4.createElement(ScrollBar, {
+  }), inVirtual && scrollWidth > size.width && /*#__PURE__*/React$4.createElement(ScrollBar, {
     ref: horizontalScrollBarRef,
     prefixCls: prefixCls,
     scrollOffset: offsetLeft,
@@ -9286,7 +9395,7 @@ var interopRequireWildcard = {exports: {}};
 	      __proto__: null
 	    },
 	    a = Object.defineProperty && Object.getOwnPropertyDescriptor;
-	  for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) {
+	  for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) {
 	    var i = a ? Object.getOwnPropertyDescriptor(e, u) : null;
 	    i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u];
 	  }