bromcom-ui 2.11.1-rc.9-3 → 2.11.2-test.0

package/dist/components/{raf.js → Overflow.js}

@@ -3,8 +3,171 @@
  * Copyright (c) Bromcom.
  */
 import { r as react, a as reactDom } from './index3.js';
+import { c as classnames } from './index2.js';
 import { c as createCommonjsModule } from './_commonjsHelpers.js';
 
+function _extends$1() {
+  _extends$1 = Object.assign ? Object.assign.bind() : function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends$1.apply(this, arguments);
+}
+
+function _typeof$2(obj) {
+  "@babel/helpers - typeof";
+
+  return _typeof$2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
+    return typeof obj;
+  } : function (obj) {
+    return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+  }, _typeof$2(obj);
+}
+
+function _toPrimitive$1(input, hint) {
+  if (_typeof$2(input) !== "object" || input === null) return input;
+  var prim = input[Symbol.toPrimitive];
+  if (prim !== undefined) {
+    var res = prim.call(input, hint || "default");
+    if (_typeof$2(res) !== "object") return res;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return (hint === "string" ? String : Number)(input);
+}
+
+function _toPropertyKey$1(arg) {
+  var key = _toPrimitive$1(arg, "string");
+  return _typeof$2(key) === "symbol" ? key : String(key);
+}
+
+function _defineProperty$1(obj, key, value) {
+  key = _toPropertyKey$1(key);
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+  return obj;
+}
+
+function ownKeys$1(object, enumerableOnly) {
+  var keys = Object.keys(object);
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    enumerableOnly && (symbols = symbols.filter(function (sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    })), keys.push.apply(keys, symbols);
+  }
+  return keys;
+}
+function _objectSpread2$1(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = null != arguments[i] ? arguments[i] : {};
+    i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) {
+      _defineProperty$1(target, key, source[key]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) {
+      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+    });
+  }
+  return target;
+}
+
+function _arrayWithHoles(arr) {
+  if (Array.isArray(arr)) return arr;
+}
+
+function _iterableToArrayLimit(arr, i) {
+  var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
+  if (null != _i) {
+    var _s,
+      _e,
+      _x,
+      _r,
+      _arr = [],
+      _n = !0,
+      _d = !1;
+    try {
+      if (_x = (_i = _i.call(arr)).next, 0 === i) {
+        if (Object(_i) !== _i) return;
+        _n = !1;
+      } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
+    } catch (err) {
+      _d = !0, _e = err;
+    } finally {
+      try {
+        if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return;
+      } finally {
+        if (_d) throw _e;
+      }
+    }
+    return _arr;
+  }
+}
+
+function _arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length) len = arr.length;
+  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+  return arr2;
+}
+
+function _unsupportedIterableToArray(o, minLen) {
+  if (!o) return;
+  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor) n = o.constructor.name;
+  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+
+function _nonIterableRest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+function _slicedToArray(arr, i) {
+  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+}
+
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
+
 function _extends() {
   _extends = Object.assign ? Object.assign.bind() : function (target) {
     for (var i = 1; i < arguments.length; i++) {
@@ -20,7 +183,8 @@ function _extends() {
   return _extends.apply(this, arguments);
 }
 
-/** @license React v16.13.1
+/**
+ * @license React
  * react-is.production.min.js
  *
  * Copyright (c) Facebook, Inc. and its affiliates.
@@ -28,16 +192,13 @@ function _extends() {
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var b="function"===typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,q=b?
-Symbol.for("react.suspense_list"):60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.block"):60121,w=b?Symbol.for("react.fundamental"):60117,x=b?Symbol.for("react.responder"):60118,y=b?Symbol.for("react.scope"):60119;
-function z(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}var AsyncMode=l;var ConcurrentMode=m;var ContextConsumer=k;var ContextProvider=h;var Element$1=c;var ForwardRef=n;var Fragment=e;var Lazy=t;var Memo=r;var Portal=d;
-var Profiler=g;var StrictMode=f;var Suspense=p;var isAsyncMode=function(a){return A(a)||z(a)===l};var isConcurrentMode=A;var isContextConsumer=function(a){return z(a)===k};var isContextProvider=function(a){return z(a)===h};var isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c};var isForwardRef=function(a){return z(a)===n};var isFragment=function(a){return z(a)===e};var isLazy=function(a){return z(a)===t};
-var isMemo=function(a){return z(a)===r};var isPortal=function(a){return z(a)===d};var isProfiler=function(a){return z(a)===g};var isStrictMode=function(a){return z(a)===f};var isSuspense=function(a){return z(a)===p};
-var isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e||a===m||a===g||a===f||a===p||a===q||"object"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===w||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v)};var typeOf=z;
+var b=Symbol.for("react.element"),c=Symbol.for("react.portal"),d=Symbol.for("react.fragment"),e=Symbol.for("react.strict_mode"),f=Symbol.for("react.profiler"),g=Symbol.for("react.provider"),h=Symbol.for("react.context"),k=Symbol.for("react.server_context"),l=Symbol.for("react.forward_ref"),m=Symbol.for("react.suspense"),n=Symbol.for("react.suspense_list"),p=Symbol.for("react.memo"),q=Symbol.for("react.lazy"),t=Symbol.for("react.offscreen"),u;u=Symbol.for("react.module.reference");
+function v(a){if("object"===typeof a&&null!==a){var r=a.$$typeof;switch(r){case b:switch(a=a.type,a){case d:case f:case e:case m:case n:return a;default:switch(a=a&&a.$$typeof,a){case k:case h:case l:case q:case p:case g:return a;default:return r}}case c:return r}}}var ContextConsumer=h;var ContextProvider=g;var Element$1=b;var ForwardRef=l;var Fragment=d;var Lazy=q;var Memo=p;var Portal=c;var Profiler=f;var StrictMode=e;var Suspense=m;
+var SuspenseList=n;var isAsyncMode=function(){return !1};var isConcurrentMode=function(){return !1};var isContextConsumer=function(a){return v(a)===h};var isContextProvider=function(a){return v(a)===g};var isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===b};var isForwardRef=function(a){return v(a)===l};var isFragment=function(a){return v(a)===d};var isLazy=function(a){return v(a)===q};var isMemo=function(a){return v(a)===p};
+var isPortal=function(a){return v(a)===c};var isProfiler=function(a){return v(a)===f};var isStrictMode=function(a){return v(a)===e};var isSuspense=function(a){return v(a)===m};var isSuspenseList=function(a){return v(a)===n};
+var isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===d||a===f||a===e||a===m||a===n||a===t||"object"===typeof a&&null!==a&&(a.$$typeof===q||a.$$typeof===p||a.$$typeof===g||a.$$typeof===h||a.$$typeof===l||a.$$typeof===u||void 0!==a.getModuleId)?!0:!1};var typeOf=v;
 
 var reactIs_production_min = {
-	AsyncMode: AsyncMode,
-	ConcurrentMode: ConcurrentMode,
 	ContextConsumer: ContextConsumer,
 	ContextProvider: ContextProvider,
 	Element: Element$1,
@@ -49,6 +210,7 @@ var reactIs_production_min = {
 	Profiler: Profiler,
 	StrictMode: StrictMode,
 	Suspense: Suspense,
+	SuspenseList: SuspenseList,
 	isAsyncMode: isAsyncMode,
 	isConcurrentMode: isConcurrentMode,
 	isContextConsumer: isContextConsumer,
@@ -62,6 +224,7 @@ var reactIs_production_min = {
 	isProfiler: isProfiler,
 	isStrictMode: isStrictMode,
 	isSuspense: isSuspense,
+	isSuspenseList: isSuspenseList,
 	isValidElementType: isValidElementType,
 	typeOf: typeOf
 };
@@ -103,8 +266,22 @@ var warned = {};
  */
 var preMessage = function preMessage(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) {
 }
+
+/** @see Similar to {@link warning} */
 function note(valid, message) {
 }
 function resetWarned() {
@@ -116,16 +293,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 */
 
 function _typeof$1(obj) {
   "@babel/helpers - typeof";
@@ -190,6 +370,25 @@ function _objectSpread2(target) {
   return target;
 }
 
+function isDOM(node) {
+  // https://developer.mozilla.org/en-US/docs/Web/API/Element
+  // Since XULElement is also subclass of Element, we only need HTMLElement and SVGElement
+  return node instanceof HTMLElement || node instanceof SVGElement;
+}
+
+/**
+ * Return if a node is a DOM node. Else will return by `findDOMNode`
+ */
+function findDOMNode(node) {
+  if (isDOM(node)) {
+    return node;
+  }
+  if (node instanceof react.Component) {
+    return reactDom.findDOMNode(node);
+  }
+  return null;
+}
+
 function _typeof(obj) {
   "@babel/helpers - typeof";
 
@@ -243,8 +442,8 @@ function useComposeRef() {
   return useMemo(function () {
     return composeRef.apply(void 0, refs);
   }, refs, function (prev, next) {
-    return prev.length === next.length && prev.every(function (ref, i) {
-      return ref === next[i];
+    return prev.length !== next.length || prev.every(function (ref, i) {
+      return ref !== next[i];
     });
   });
 }
@@ -253,35 +452,49 @@ function supportRef(nodeOrComponent) {
   var type = reactIs.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.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.ForwardRef) {
     return false;
   }
   return true;
 }
 /* eslint-enable */
 
-function isDOM(node) {
-  // https://developer.mozilla.org/en-US/docs/Web/API/Element
-  // Since XULElement is also subclass of Element, we only need HTMLElement and SVGElement
-  return node instanceof HTMLElement || node instanceof SVGElement;
-}
-
+var CollectionContext = /*#__PURE__*/react.createContext(null);
 /**
- * Return if a node is a DOM node. Else will return by `findDOMNode`
+ * Collect all the resize event from children ResizeObserver
  */
-function findDOMNode(node) {
-  if (isDOM(node)) {
-    return node;
-  }
-  if (node instanceof react.Component) {
-    return reactDom.findDOMNode(node);
-  }
-  return null;
+function Collection(_ref) {
+  var children = _ref.children,
+    onBatchResize = _ref.onBatchResize;
+  var resizeIdRef = react.useRef(0);
+  var resizeInfosRef = react.useRef([]);
+  var onCollectionResize = react.useContext(CollectionContext);
+  var onResize = react.useCallback(function (size, element, data) {
+    resizeIdRef.current += 1;
+    var currentId = resizeIdRef.current;
+    resizeInfosRef.current.push({
+      size: size,
+      element: element,
+      data: data
+    });
+    Promise.resolve().then(function () {
+      if (currentId === resizeIdRef.current) {
+        onBatchResize === null || onBatchResize === void 0 || onBatchResize(resizeInfosRef.current);
+        resizeInfosRef.current = [];
+      }
+    });
+
+    // Continue bubbling if parent exist
+    onCollectionResize === null || onCollectionResize === void 0 || onCollectionResize(size, element, data);
+  }, [onBatchResize, onCollectionResize]);
+  return /*#__PURE__*/react.createElement(CollectionContext.Provider, {
+    value: onResize
+  }, children);
 }
 
 /**
@@ -1217,13 +1430,15 @@ function onResize(entities) {
   entities.forEach(function (entity) {
     var _elementListeners$get;
     var target = entity.target;
-    (_elementListeners$get = elementListeners.get(target)) === null || _elementListeners$get === void 0 ? void 0 : _elementListeners$get.forEach(function (listener) {
+    (_elementListeners$get = elementListeners.get(target)) === null || _elementListeners$get === void 0 || _elementListeners$get.forEach(function (listener) {
       return listener(target);
     });
   });
 }
+
 // Note: ResizeObserver polyfill not support option to measure border-box resize
 var resizeObserver = new index(onResize);
+
 // ============================== Observe ==============================
 function observe(element, callback) {
   if (!elementListeners.has(element)) {
@@ -1360,47 +1575,17 @@ var DomWrapper = /*#__PURE__*/function (_React$Component) {
   return DomWrapper;
 }(react.Component);
 
-var CollectionContext = /*#__PURE__*/react.createContext(null);
-/**
- * Collect all the resize event from children ResizeObserver
- */
-function Collection(_ref) {
-  var children = _ref.children,
-    onBatchResize = _ref.onBatchResize;
-  var resizeIdRef = react.useRef(0);
-  var resizeInfosRef = react.useRef([]);
-  var onCollectionResize = react.useContext(CollectionContext);
-  var onResize = react.useCallback(function (size, element, data) {
-    resizeIdRef.current += 1;
-    var currentId = resizeIdRef.current;
-    resizeInfosRef.current.push({
-      size: size,
-      element: element,
-      data: data
-    });
-    Promise.resolve().then(function () {
-      if (currentId === resizeIdRef.current) {
-        onBatchResize === null || onBatchResize === void 0 ? void 0 : onBatchResize(resizeInfosRef.current);
-        resizeInfosRef.current = [];
-      }
-    });
-    // Continue bubbling if parent exist
-    onCollectionResize === null || onCollectionResize === void 0 ? void 0 : onCollectionResize(size, element, data);
-  }, [onBatchResize, onCollectionResize]);
-  return /*#__PURE__*/react.createElement(CollectionContext.Provider, {
-    value: onResize
-  }, children);
-}
-
 function SingleObserver(props, ref) {
   var children = props.children,
     disabled = props.disabled;
   var elementRef = react.useRef(null);
   var wrapperRef = react.useRef(null);
   var onCollectionResize = react.useContext(CollectionContext);
+
   // =========================== Children ===========================
   var isRenderProps = typeof children === 'function';
   var mergedChildren = isRenderProps ? children(elementRef) : children;
+
   // ============================= Size =============================
   var sizeRef = react.useRef({
     width: -1,
@@ -1408,21 +1593,25 @@ function SingleObserver(props, ref) {
     offsetWidth: -1,
     offsetHeight: -1
   });
+
   // ============================= Ref ==============================
   var canRef = !isRenderProps && /*#__PURE__*/react.isValidElement(mergedChildren) && supportRef(mergedChildren);
   var originRef = canRef ? mergedChildren.ref : null;
-  var mergedRef = react.useMemo(function () {
-    return composeRef(originRef, elementRef);
-  }, [originRef, elementRef]);
+  var mergedRef = useComposeRef(originRef, elementRef);
   var getDom = function getDom() {
-    return findDOMNode(elementRef.current) || findDOMNode(wrapperRef.current);
+    var _elementRef$current;
+    return findDOMNode(elementRef.current) || (
+    // Support `nativeElement` format
+    elementRef.current && _typeof$1(elementRef.current) === 'object' ? findDOMNode((_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 ? void 0 : _elementRef$current.nativeElement) : null) || findDOMNode(wrapperRef.current);
   };
   react.useImperativeHandle(ref, function () {
     return getDom();
   });
+
   // =========================== Observe ============================
   var propsRef = react.useRef(props);
   propsRef.current = props;
+
   // Handler
   var onInternalResize = react.useCallback(function (target) {
     var _propsRef$current = propsRef.current,
@@ -1433,6 +1622,7 @@ function SingleObserver(props, ref) {
       height = _target$getBoundingCl.height;
     var offsetWidth = target.offsetWidth,
       offsetHeight = target.offsetHeight;
+
     /**
      * Resize observer trigger when content size changed.
      * In most case we just care about element size,
@@ -1448,6 +1638,7 @@ function SingleObserver(props, ref) {
         offsetHeight: offsetHeight
       };
       sizeRef.current = size;
+
       // IE is strange, right?
       var mergedOffsetWidth = offsetWidth === Math.round(width) ? width : offsetWidth;
       var mergedOffsetHeight = offsetHeight === Math.round(height) ? height : offsetHeight;
@@ -1455,8 +1646,9 @@ function SingleObserver(props, ref) {
         offsetWidth: mergedOffsetWidth,
         offsetHeight: mergedOffsetHeight
       });
+
       // Let collection know what happened
-      onCollectionResize === null || onCollectionResize === void 0 ? void 0 : onCollectionResize(sizeInfo, target, data);
+      onCollectionResize === null || onCollectionResize === void 0 || onCollectionResize(sizeInfo, target, data);
       if (onResize) {
         // defer the callback but not defer to next frame
         Promise.resolve().then(function () {
@@ -1465,6 +1657,7 @@ function SingleObserver(props, ref) {
       }
     }
   }, []);
+
   // Dynamic observe
   react.useEffect(function () {
     var currentElement = getDom();
@@ -1475,6 +1668,7 @@ function SingleObserver(props, ref) {
       return unobserve(currentElement, onInternalResize);
     };
   }, [elementRef.current, disabled]);
+
   // ============================ Render ============================
   return /*#__PURE__*/react.createElement(DomWrapper, {
     ref: wrapperRef
@@ -1529,6 +1723,73 @@ var useLayoutUpdateEffect = function useLayoutUpdateEffect(callback, deps) {
   }, deps);
 };
 
+var _excluded$2 = ["prefixCls", "invalidate", "item", "renderItem", "responsive", "responsiveDisabled", "registerSize", "itemKey", "className", "style", "children", "display", "order", "component"];
+// Use shared variable to save bundle size
+var UNDEFINED = undefined;
+function InternalItem(props, ref) {
+  var prefixCls = props.prefixCls,
+    invalidate = props.invalidate,
+    item = props.item,
+    renderItem = props.renderItem,
+    responsive = props.responsive,
+    responsiveDisabled = props.responsiveDisabled,
+    registerSize = props.registerSize,
+    itemKey = props.itemKey,
+    className = props.className,
+    style = props.style,
+    children = props.children,
+    display = props.display,
+    order = props.order,
+    _props$component = props.component,
+    Component = _props$component === void 0 ? 'div' : _props$component,
+    restProps = _objectWithoutProperties(props, _excluded$2);
+  var mergedHidden = responsive && !display;
+  // ================================ Effect ================================
+  function internalRegisterSize(width) {
+    registerSize(itemKey, width);
+  }
+  react.useEffect(function () {
+    return function () {
+      internalRegisterSize(null);
+    };
+  }, []);
+  // ================================ Render ================================
+  var childNode = renderItem && item !== UNDEFINED ? renderItem(item) : children;
+  var overflowStyle;
+  if (!invalidate) {
+    overflowStyle = {
+      opacity: mergedHidden ? 0 : 1,
+      height: mergedHidden ? 0 : UNDEFINED,
+      overflowY: mergedHidden ? 'hidden' : UNDEFINED,
+      order: responsive ? order : UNDEFINED,
+      pointerEvents: mergedHidden ? 'none' : UNDEFINED,
+      position: mergedHidden ? 'absolute' : UNDEFINED
+    };
+  }
+  var overflowProps = {};
+  if (mergedHidden) {
+    overflowProps['aria-hidden'] = true;
+  }
+  var itemNode = /*#__PURE__*/react.createElement(Component, _extends$1({
+    className: classnames(!invalidate && prefixCls, className),
+    style: _objectSpread2$1(_objectSpread2$1({}, overflowStyle), style)
+  }, overflowProps, restProps, {
+    ref: ref
+  }), childNode);
+  if (responsive) {
+    itemNode = /*#__PURE__*/react.createElement(RefResizeObserver, {
+      onResize: function onResize(_ref) {
+        var offsetWidth = _ref.offsetWidth;
+        internalRegisterSize(offsetWidth);
+      },
+      disabled: responsiveDisabled
+    }, itemNode);
+  }
+  return itemNode;
+}
+var Item = /*#__PURE__*/react.forwardRef(InternalItem);
+Item.displayName = 'Item';
+
 function useEvent(callback) {
   var fnRef = react.useRef();
   fnRef.current = callback;
@@ -1587,8 +1848,370 @@ var wrapperRaf = function wrapperRaf(callback) {
 };
 wrapperRaf.cancel = function (id) {
   var realId = rafIds.get(id);
-  cleanup(realId);
+  cleanup(id);
   return caf(realId);
 };
 
-export { RefResizeObserver as R, _typeof as _, useLayoutEffect as a, useLayoutUpdateEffect as b, warningOnce as c, useMemo as d, canUseDom as e, useComposeRef as f, fillRef as g, findDOMNode as h, isDOM as i, composeRef as j, supportRef as s, useEvent as u, wrapperRaf as w };
+function channelUpdate(callback) {
+  if (typeof MessageChannel === 'undefined') {
+    wrapperRaf(callback);
+  } else {
+    var channel = new MessageChannel();
+    channel.port1.onmessage = function () {
+      return callback();
+    };
+    channel.port2.postMessage(undefined);
+  }
+}
+
+/**
+ * Batcher for record any `useEffectState` need update.
+ */
+function useBatcher() {
+  // Updater Trigger
+  var updateFuncRef = react.useRef(null);
+  // Notify update
+  var notifyEffectUpdate = function notifyEffectUpdate(callback) {
+    if (!updateFuncRef.current) {
+      updateFuncRef.current = [];
+      channelUpdate(function () {
+        reactDom.unstable_batchedUpdates(function () {
+          updateFuncRef.current.forEach(function (fn) {
+            fn();
+          });
+          updateFuncRef.current = null;
+        });
+      });
+    }
+    updateFuncRef.current.push(callback);
+  };
+  return notifyEffectUpdate;
+}
+/**
+ * Trigger state update by `useLayoutEffect` to save perf.
+ */
+function useEffectState(notifyEffectUpdate, defaultValue) {
+  // Value
+  var _React$useState = react.useState(defaultValue),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    stateValue = _React$useState2[0],
+    setStateValue = _React$useState2[1];
+  // Set State
+  var setEffectVal = useEvent(function (nextValue) {
+    notifyEffectUpdate(function () {
+      setStateValue(nextValue);
+    });
+  });
+  return [stateValue, setEffectVal];
+}
+
+var OverflowContext = /*#__PURE__*/react.createContext(null);
+
+var _excluded$1 = ["component"],
+  _excluded2 = ["className"],
+  _excluded3 = ["className"];
+var InternalRawItem = function InternalRawItem(props, ref) {
+  var context = react.useContext(OverflowContext);
+  // Render directly when context not provided
+  if (!context) {
+    var _props$component = props.component,
+      Component = _props$component === void 0 ? 'div' : _props$component,
+      _restProps = _objectWithoutProperties(props, _excluded$1);
+    return /*#__PURE__*/react.createElement(Component, _extends$1({}, _restProps, {
+      ref: ref
+    }));
+  }
+  var contextClassName = context.className,
+    restContext = _objectWithoutProperties(context, _excluded2);
+  var className = props.className,
+    restProps = _objectWithoutProperties(props, _excluded3);
+  // Do not pass context to sub item to avoid multiple measure
+  return /*#__PURE__*/react.createElement(OverflowContext.Provider, {
+    value: null
+  }, /*#__PURE__*/react.createElement(Item, _extends$1({
+    ref: ref,
+    className: classnames(contextClassName, className)
+  }, restContext, restProps)));
+};
+var RawItem = /*#__PURE__*/react.forwardRef(InternalRawItem);
+RawItem.displayName = 'RawItem';
+
+var _excluded = ["prefixCls", "data", "renderItem", "renderRawItem", "itemKey", "itemWidth", "ssr", "style", "className", "maxCount", "renderRest", "renderRawRest", "suffix", "component", "itemComponent", "onVisibleChange"];
+var RESPONSIVE = 'responsive';
+var INVALIDATE = 'invalidate';
+function defaultRenderRest(omittedItems) {
+  return "+ ".concat(omittedItems.length, " ...");
+}
+function Overflow(props, ref) {
+  var _props$prefixCls = props.prefixCls,
+    prefixCls = _props$prefixCls === void 0 ? 'rc-overflow' : _props$prefixCls,
+    _props$data = props.data,
+    data = _props$data === void 0 ? [] : _props$data,
+    renderItem = props.renderItem,
+    renderRawItem = props.renderRawItem,
+    itemKey = props.itemKey,
+    _props$itemWidth = props.itemWidth,
+    itemWidth = _props$itemWidth === void 0 ? 10 : _props$itemWidth,
+    ssr = props.ssr,
+    style = props.style,
+    className = props.className,
+    maxCount = props.maxCount,
+    renderRest = props.renderRest,
+    renderRawRest = props.renderRawRest,
+    suffix = props.suffix,
+    _props$component = props.component,
+    Component = _props$component === void 0 ? 'div' : _props$component,
+    itemComponent = props.itemComponent,
+    onVisibleChange = props.onVisibleChange,
+    restProps = _objectWithoutProperties(props, _excluded);
+  var fullySSR = ssr === 'full';
+  var notifyEffectUpdate = useBatcher();
+  var _useEffectState = useEffectState(notifyEffectUpdate, null),
+    _useEffectState2 = _slicedToArray(_useEffectState, 2),
+    containerWidth = _useEffectState2[0],
+    setContainerWidth = _useEffectState2[1];
+  var mergedContainerWidth = containerWidth || 0;
+  var _useEffectState3 = useEffectState(notifyEffectUpdate, new Map()),
+    _useEffectState4 = _slicedToArray(_useEffectState3, 2),
+    itemWidths = _useEffectState4[0],
+    setItemWidths = _useEffectState4[1];
+  var _useEffectState5 = useEffectState(notifyEffectUpdate, 0),
+    _useEffectState6 = _slicedToArray(_useEffectState5, 2),
+    prevRestWidth = _useEffectState6[0],
+    setPrevRestWidth = _useEffectState6[1];
+  var _useEffectState7 = useEffectState(notifyEffectUpdate, 0),
+    _useEffectState8 = _slicedToArray(_useEffectState7, 2),
+    restWidth = _useEffectState8[0],
+    setRestWidth = _useEffectState8[1];
+  var _useEffectState9 = useEffectState(notifyEffectUpdate, 0),
+    _useEffectState10 = _slicedToArray(_useEffectState9, 2),
+    suffixWidth = _useEffectState10[0],
+    setSuffixWidth = _useEffectState10[1];
+  var _useState = react.useState(null),
+    _useState2 = _slicedToArray(_useState, 2),
+    suffixFixedStart = _useState2[0],
+    setSuffixFixedStart = _useState2[1];
+  var _useState3 = react.useState(null),
+    _useState4 = _slicedToArray(_useState3, 2),
+    displayCount = _useState4[0],
+    setDisplayCount = _useState4[1];
+  var mergedDisplayCount = react.useMemo(function () {
+    if (displayCount === null && fullySSR) {
+      return Number.MAX_SAFE_INTEGER;
+    }
+    return displayCount || 0;
+  }, [displayCount, containerWidth]);
+  var _useState5 = react.useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    restReady = _useState6[0],
+    setRestReady = _useState6[1];
+  var itemPrefixCls = "".concat(prefixCls, "-item");
+  // Always use the max width to avoid blink
+  var mergedRestWidth = Math.max(prevRestWidth, restWidth);
+  // ================================= Data =================================
+  var isResponsive = maxCount === RESPONSIVE;
+  var shouldResponsive = data.length && isResponsive;
+  var invalidate = maxCount === INVALIDATE;
+  /**
+   * When is `responsive`, we will always render rest node to get the real width of it for calculation
+   */
+  var showRest = shouldResponsive || typeof maxCount === 'number' && data.length > maxCount;
+  var mergedData = react.useMemo(function () {
+    var items = data;
+    if (shouldResponsive) {
+      if (containerWidth === null && fullySSR) {
+        items = data;
+      } else {
+        items = data.slice(0, Math.min(data.length, mergedContainerWidth / itemWidth));
+      }
+    } else if (typeof maxCount === 'number') {
+      items = data.slice(0, maxCount);
+    }
+    return items;
+  }, [data, itemWidth, containerWidth, maxCount, shouldResponsive]);
+  var omittedItems = react.useMemo(function () {
+    if (shouldResponsive) {
+      return data.slice(mergedDisplayCount + 1);
+    }
+    return data.slice(mergedData.length);
+  }, [data, mergedData, shouldResponsive, mergedDisplayCount]);
+  // ================================= Item =================================
+  var getKey = react.useCallback(function (item, index) {
+    var _ref;
+    if (typeof itemKey === 'function') {
+      return itemKey(item);
+    }
+    return (_ref = itemKey && (item === null || item === void 0 ? void 0 : item[itemKey])) !== null && _ref !== void 0 ? _ref : index;
+  }, [itemKey]);
+  var mergedRenderItem = react.useCallback(renderItem || function (item) {
+    return item;
+  }, [renderItem]);
+  function updateDisplayCount(count, suffixFixedStartVal, notReady) {
+    // React 18 will sync render even when the value is same in some case.
+    // We take `mergedData` as deps which may cause dead loop if it's dynamic generate.
+    // ref: https://github.com/ant-design/ant-design/issues/36559
+    if (displayCount === count && (suffixFixedStartVal === undefined || suffixFixedStartVal === suffixFixedStart)) {
+      return;
+    }
+    setDisplayCount(count);
+    if (!notReady) {
+      setRestReady(count < data.length - 1);
+      onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(count);
+    }
+    if (suffixFixedStartVal !== undefined) {
+      setSuffixFixedStart(suffixFixedStartVal);
+    }
+  }
+  // ================================= Size =================================
+  function onOverflowResize(_, element) {
+    setContainerWidth(element.clientWidth);
+  }
+  function registerSize(key, width) {
+    setItemWidths(function (origin) {
+      var clone = new Map(origin);
+      if (width === null) {
+        clone.delete(key);
+      } else {
+        clone.set(key, width);
+      }
+      return clone;
+    });
+  }
+  function registerOverflowSize(_, width) {
+    setRestWidth(width);
+    setPrevRestWidth(restWidth);
+  }
+  function registerSuffixSize(_, width) {
+    setSuffixWidth(width);
+  }
+  // ================================ Effect ================================
+  function getItemWidth(index) {
+    return itemWidths.get(getKey(mergedData[index], index));
+  }
+  useLayoutEffect(function () {
+    if (mergedContainerWidth && typeof mergedRestWidth === 'number' && mergedData) {
+      var totalWidth = suffixWidth;
+      var len = mergedData.length;
+      var lastIndex = len - 1;
+      // When data count change to 0, reset this since not loop will reach
+      if (!len) {
+        updateDisplayCount(0, null);
+        return;
+      }
+      for (var i = 0; i < len; i += 1) {
+        var currentItemWidth = getItemWidth(i);
+        // Fully will always render
+        if (fullySSR) {
+          currentItemWidth = currentItemWidth || 0;
+        }
+        // Break since data not ready
+        if (currentItemWidth === undefined) {
+          updateDisplayCount(i - 1, undefined, true);
+          break;
+        }
+        // Find best match
+        totalWidth += currentItemWidth;
+        if (
+        // Only one means `totalWidth` is the final width
+        lastIndex === 0 && totalWidth <= mergedContainerWidth ||
+        // Last two width will be the final width
+        i === lastIndex - 1 && totalWidth + getItemWidth(lastIndex) <= mergedContainerWidth) {
+          // Additional check if match the end
+          updateDisplayCount(lastIndex, null);
+          break;
+        } else if (totalWidth + mergedRestWidth > mergedContainerWidth) {
+          // Can not hold all the content to show rest
+          updateDisplayCount(i - 1, totalWidth - currentItemWidth - suffixWidth + restWidth);
+          break;
+        }
+      }
+      if (suffix && getItemWidth(0) + suffixWidth > mergedContainerWidth) {
+        setSuffixFixedStart(null);
+      }
+    }
+  }, [mergedContainerWidth, itemWidths, restWidth, suffixWidth, getKey, mergedData]);
+  // ================================ Render ================================
+  var displayRest = restReady && !!omittedItems.length;
+  var suffixStyle = {};
+  if (suffixFixedStart !== null && shouldResponsive) {
+    suffixStyle = {
+      position: 'absolute',
+      left: suffixFixedStart,
+      top: 0
+    };
+  }
+  var itemSharedProps = {
+    prefixCls: itemPrefixCls,
+    responsive: shouldResponsive,
+    component: itemComponent,
+    invalidate: invalidate
+  };
+  // >>>>> Choice render fun by `renderRawItem`
+  var internalRenderItemNode = renderRawItem ? function (item, index) {
+    var key = getKey(item, index);
+    return /*#__PURE__*/react.createElement(OverflowContext.Provider, {
+      key: key,
+      value: _objectSpread2$1(_objectSpread2$1({}, itemSharedProps), {}, {
+        order: index,
+        item: item,
+        itemKey: key,
+        registerSize: registerSize,
+        display: index <= mergedDisplayCount
+      })
+    }, renderRawItem(item, index));
+  } : function (item, index) {
+    var key = getKey(item, index);
+    return /*#__PURE__*/react.createElement(Item, _extends$1({}, itemSharedProps, {
+      order: index,
+      key: key,
+      item: item,
+      renderItem: mergedRenderItem,
+      itemKey: key,
+      registerSize: registerSize,
+      display: index <= mergedDisplayCount
+    }));
+  };
+  // >>>>> Rest node
+  var restNode;
+  var restContextProps = {
+    order: displayRest ? mergedDisplayCount : Number.MAX_SAFE_INTEGER,
+    className: "".concat(itemPrefixCls, "-rest"),
+    registerSize: registerOverflowSize,
+    display: displayRest
+  };
+  if (!renderRawRest) {
+    var mergedRenderRest = renderRest || defaultRenderRest;
+    restNode = /*#__PURE__*/react.createElement(Item, _extends$1({}, itemSharedProps, restContextProps), typeof mergedRenderRest === 'function' ? mergedRenderRest(omittedItems) : mergedRenderRest);
+  } else if (renderRawRest) {
+    restNode = /*#__PURE__*/react.createElement(OverflowContext.Provider, {
+      value: _objectSpread2$1(_objectSpread2$1({}, itemSharedProps), restContextProps)
+    }, renderRawRest(omittedItems));
+  }
+  var overflowNode = /*#__PURE__*/react.createElement(Component, _extends$1({
+    className: classnames(!invalidate && prefixCls, className),
+    style: style,
+    ref: ref
+  }, restProps), mergedData.map(internalRenderItemNode), showRest ? restNode : null, suffix && /*#__PURE__*/react.createElement(Item, _extends$1({}, itemSharedProps, {
+    responsive: isResponsive,
+    responsiveDisabled: !shouldResponsive,
+    order: mergedDisplayCount,
+    className: "".concat(itemPrefixCls, "-suffix"),
+    registerSize: registerSuffixSize,
+    display: true,
+    style: suffixStyle
+  }), suffix));
+  if (isResponsive) {
+    overflowNode = /*#__PURE__*/react.createElement(RefResizeObserver, {
+      onResize: onOverflowResize,
+      disabled: !shouldResponsive
+    }, overflowNode);
+  }
+  return overflowNode;
+}
+var ForwardOverflow = /*#__PURE__*/react.forwardRef(Overflow);
+ForwardOverflow.displayName = 'Overflow';
+ForwardOverflow.Item = RawItem;
+ForwardOverflow.RESPONSIVE = RESPONSIVE;
+ForwardOverflow.INVALIDATE = INVALIDATE;
+
+export { ForwardOverflow as F, RefResizeObserver as R, _typeof as _, useLayoutUpdateEffect as a, useLayoutEffect as b, canUseDom as c, useComposeRef as d, findDOMNode as e, fillRef as f, composeRef as g, warningOnce as h, isDOM as i, supportRef as s, useEvent as u, wrapperRaf as w };