@arco-design/mobile-react 2.30.9 → 2.31.0

package/dist/index.js

@@ -126,7 +126,7 @@
      * ```
      */
 
-    function isArray(obj) {
+    function isArray$1(obj) {
       return opt.call(obj) === '[object Array]';
     }
     /**
@@ -237,7 +237,7 @@
      */
 
     function isEmptyArray(obj) {
-      return isArray(obj) && !(obj === null || obj === void 0 ? void 0 : obj.length);
+      return isArray$1(obj) && !(obj === null || obj === void 0 ? void 0 : obj.length);
     }
     /**
      * 深比较两个对象是否相等
@@ -312,7 +312,7 @@
 
         if (isString(v)) {
           classNames.push(v);
-        } else if (isArray(v)) {
+        } else if (isArray$1(v)) {
           classNames = classNames.concat(v);
         } else if (isObject$2(v)) {
           Object.keys(v).forEach(function (k) {
@@ -1715,10 +1715,15 @@
         },
         boolean: {
           equal: '%s 不等于 `%s`'
-        }
+        },
+        pickerDefaultHint: '请选择'
       },
       NavBar: {
         backBtnAriaLabel: '返回'
+      },
+      Uploader: {
+        uploadBtn: '点击上传',
+        retryUpload: '点击重试'
       }
     };
 
@@ -3652,7 +3657,7 @@
           Object.keys(this.rules).forEach(function (key) {
             var spPromiseGroup = [];
 
-            if (isArray(_this.rules[key])) {
+            if (isArray$1(_this.rules[key])) {
               for (var i = 0; i < _this.rules[key].length; i++) {
                 var rule = _this.rules[key][i];
 
@@ -5132,14 +5137,18 @@
         return tabs.length < overflowThreshold ? tabBarArrange : 'start';
       }),
           originArrange = _d[0],
-          setOriginArrange = _d[1]; // 默认tab小于overflowThreshold个时不开启加载前隐藏，大于overflowThreshold个时开启
+          setOriginArrange = _d[1];
 
+      var _e = React.useState(false),
+          forceUpdate = _e[0],
+          setForceUpdate = _e[1]; // 默认tab小于overflowThreshold个时不开启加载前隐藏，大于overflowThreshold个时开启
 
-      var _e = React.useState(function () {
+
+      var _f = React.useState(function () {
         return hideTabBarBeforeMounted === void 0 ? tabs.length < overflowThreshold || activeIndex === 0 : !hideTabBarBeforeMounted;
       }),
-          showTab = _e[0],
-          setShowTab = _e[1];
+          showTab = _f[0],
+          setShowTab = _f[1];
 
       var isVertical = tabDirection === 'vertical';
       var isLine = (type || '').indexOf('line') !== -1;
@@ -5154,6 +5163,15 @@
       var hasDivider = tabBarHasDivider === void 0 ? isLine : tabBarHasDivider;
       var wrapSize = isVertical ? wrapWidth : wrapHeight;
       var system = useSystem();
+
+      var updateScrollPosition = function updateScrollPosition() {
+        if (wrapSize && tabBarScrollChance !== 'none') {
+          setTimeout(function () {
+            scrollToCenter();
+          }, tabBarScrollChance === 'after-jump' ? Math.max(transitionDuration || 0, duration || 0) : 0);
+        }
+      };
+
       React.useEffect(function () {
         nextTick(function () {
           setCellOverflow(); // dom出来之后originArrange置空，交由tabBarArrange控制
@@ -5173,31 +5191,16 @@
           (_a = underlineRef.current) === null || _a === void 0 ? void 0 : _a.resetUnderlineStyle();
         });
       }, [activeIndex, tabs, getCellPadding('left'), getCellPadding('right'), tabBarGutter, tabDirection]);
-      React.useImperativeHandle(ref, function () {
-        return {
-          dom: domRef.current,
-          scrollTo: scrollTo,
-          scrollToCenter: scrollToCenter,
-          hasOverflow: hasOverflow,
-          setCaterpillarAnimate: function setCaterpillarAnimate(ratio) {
-            var _a;
-
-            return (_a = underlineRef.current) === null || _a === void 0 ? void 0 : _a.setCaterpillarAnimate(ratio);
-          },
-          resetUnderlineStyle: function resetUnderlineStyle() {
-            var _a;
-
-            return (_a = underlineRef.current) === null || _a === void 0 ? void 0 : _a.resetUnderlineStyle();
-          }
-        };
-      }, [scrollToCenter, scrollTo, hasOverflow]);
       React.useEffect(function () {
-        if (wrapSize && tabBarScrollChance !== 'none') {
-          setTimeout(function () {
-            scrollToCenter();
-          }, tabBarScrollChance === 'after-jump' ? Math.max(transitionDuration || 0, duration || 0) : 0);
-        }
+        updateScrollPosition();
       }, [activeIndex, wrapSize]);
+      useUpdateEffect(function () {
+        var _a;
+
+        setCellOverflow();
+        (_a = underlineRef.current) === null || _a === void 0 ? void 0 : _a.resetUnderlineStyle();
+        updateScrollPosition();
+      }, [forceUpdate]);
       React.useEffect(function () {
         tabBarScrollChance !== 'none' && scrollToCenter(true); // TabCell左右可滚动时，防止触发父级touchmove事件导致滚不动
         // @en When the TabCell can be scrolled left and right, prevent the parent touchmove event from being triggered which result in inability to scroll
@@ -5336,7 +5339,7 @@
         return typeof tab === 'string' ? tab : tab.title;
       }
 
-      function renderTabUnderline() {
+      var renderTabUnderline = function renderTabUnderline() {
         if (!showUnderline || !isLine) {
           return null;
         }
@@ -5367,7 +5370,7 @@
           getTabCenterLeft: getTabCenterLeft,
           getTabRect: getTabRect
         }, lineProps));
-      }
+      };
 
       var cellInner = /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, tabs.map(function (tab, index) {
         return /*#__PURE__*/React__default["default"].createElement("div", {
@@ -5409,6 +5412,34 @@
           height: '100%'
         }
       }) : null);
+
+      var _updateLayout = function updateLayout() {
+        setForceUpdate(function (val) {
+          return !val;
+        });
+      };
+
+      React.useImperativeHandle(ref, function () {
+        return {
+          dom: domRef.current,
+          scrollTo: scrollTo,
+          scrollToCenter: scrollToCenter,
+          hasOverflow: hasOverflow,
+          setCaterpillarAnimate: function setCaterpillarAnimate(ratio) {
+            var _a;
+
+            return (_a = underlineRef.current) === null || _a === void 0 ? void 0 : _a.setCaterpillarAnimate(ratio);
+          },
+          resetUnderlineStyle: function resetUnderlineStyle() {
+            var _a;
+
+            return (_a = underlineRef.current) === null || _a === void 0 ? void 0 : _a.resetUnderlineStyle();
+          },
+          updateLayout: function updateLayout() {
+            return _updateLayout();
+          }
+        };
+      }, [scrollToCenter, scrollTo, hasOverflow]);
       return /*#__PURE__*/React__default["default"].createElement("div", {
         className: cls(prefix + "-container-wrap", tabDirection, "type-" + type, tabBarClass, system),
         style: tabBarStyle
@@ -7122,6 +7153,30 @@
       });
     }
 
+    function IconDelete(props) {
+      var _a = props.className,
+          className = _a === void 0 ? '' : _a,
+          _b = props.useCurrentColor,
+          useCurrentColor = _b === void 0 ? true : _b,
+          style = props.style,
+          other = __rest$1(props, ["className", "useCurrentColor", "style"]);
+
+      return /*#__PURE__*/React__default["default"].createElement(ContextLayout, null, function (_a) {
+        var prefixCls = _a.prefixCls;
+        return /*#__PURE__*/React__default["default"].createElement("svg", __assign$3({
+          className: prefixCls + "-icon " + prefixCls + "-icon-delete " + className,
+          width: "1em",
+          height: "1em",
+          style: style,
+          viewBox: "0 0 1024 1024",
+          xmlns: "http://www.w3.org/2000/svg"
+        }, other), /*#__PURE__*/React__default["default"].createElement("path", {
+          fill: useCurrentColor ? 'currentColor' : '#000',
+          d: "M640 85.333A42.667 42.667 0 01682.667 128l-.022 42.645 228.694.022c9.493 0 12.928.981 16.426 2.858a19.41 19.41 0 018.043 8.064c1.877 3.478 2.859 6.912 2.859 16.427v30.635c0 9.514-.982 12.949-2.859 16.426a19.392 19.392 0 01-8.064 8.064c-3.477 1.878-6.912 2.859-16.427 2.859l-57.984-.021V896a42.667 42.667 0 01-42.666 42.667H213.333A42.667 42.667 0 01170.667 896l-.022-640.021-57.962.021c-9.515 0-12.95-.981-16.427-2.859a19.392 19.392 0 01-8.064-8.064c-1.877-3.477-2.859-6.912-2.859-16.426v-30.635c0-9.515.982-12.95 2.859-16.427a19.392 19.392 0 018.064-8.064c3.477-1.877 6.912-2.858 16.427-2.858l228.629-.022.021-42.645A42.667 42.667 0 01384 85.333h256zM768 256H256v597.333h512V256zM448 384a21.333 21.333 0 0121.333 21.333V704A21.333 21.333 0 01448 725.333h-42.667A21.333 21.333 0 01384 704V405.333A21.333 21.333 0 01405.333 384H448zm170.667 0A21.333 21.333 0 01640 405.333V704a21.333 21.333 0 01-21.333 21.333H576A21.333 21.333 0 01554.667 704V405.333A21.333 21.333 0 01576 384h42.667z"
+        }));
+      });
+    }
+
     function IconStarFill(props) {
       var _a = props.className,
           className = _a === void 0 ? '' : _a,
@@ -7191,8 +7246,7 @@
         }, other), /*#__PURE__*/React__default["default"].createElement("path", {
           fillRule: "evenodd",
           clipRule: "evenodd",
-          d: "M16.702 4.47a.5.5 0 00-.705.06L8.33 13.596 3.82 9.724a.5.5 0 00-.705.054l-.652.758a.5.5 0 00.054.706L7.361 15.4a.5.5 0 00.054.053l.526.445.22.188a.5.5 0 00.722-.047l8.641-10.218a.5.5 0 00-.059-.705l-.763-.645z",
-          fill: useCurrentColor ? 'currentColor' : '#000'
+          d: "M16.702 4.47a.5.5 0 00-.705.06L8.33 13.596 3.82 9.724a.5.5 0 00-.705.054l-.652.758a.5.5 0 00.054.706L7.361 15.4a.5.5 0 00.054.053l.526.445.22.188a.5.5 0 00.722-.047l8.641-10.218a.5.5 0 00-.059-.705l-.763-.645z"
         }));
       });
     }
@@ -7312,8 +7366,7 @@
           fill: useCurrentColor ? 'currentColor' : '#000',
           xmlns: "http://www.w3.org/2000/svg"
         }, other), /*#__PURE__*/React__default["default"].createElement("path", {
-          d: "M12.5 10.833c2.301 0 5 1.786 5 5v2.5c0 .46-.373.834-.833.834H3.333a.833.833 0 01-.833-.834v-2.5c0-3.211 2.699-5 5-5h5zM10 1.25a4.167 4.167 0 110 8.333 4.167 4.167 0 010-8.333z",
-          fill: useCurrentColor ? 'currentColor' : '#000'
+          d: "M12.5 10.833c2.301 0 5 1.786 5 5v2.5c0 .46-.373.834-.833.834H3.333a.833.833 0 01-.833-.834v-2.5c0-3.211 2.699-5 5-5h5zM10 1.25a4.167 4.167 0 110 8.333 4.167 4.167 0 010-8.333z"
         }));
       });
     }
@@ -7516,6 +7569,7 @@
           height: "1em",
           style: style,
           version: "1.1",
+          id: "svg_388a56dbb6__\u56FE\u5C42_1",
           xmlns: "http://www.w3.org/2000/svg",
           x: "0",
           y: "0",
@@ -7562,6 +7616,58 @@
       });
     }
 
+    function IconFile(props) {
+      var _a = props.className,
+          className = _a === void 0 ? '' : _a,
+          _b = props.useCurrentColor,
+          useCurrentColor = _b === void 0 ? true : _b,
+          style = props.style,
+          other = __rest$1(props, ["className", "useCurrentColor", "style"]);
+
+      return /*#__PURE__*/React__default["default"].createElement(ContextLayout, null, function (_a) {
+        var prefixCls = _a.prefixCls;
+        return /*#__PURE__*/React__default["default"].createElement("svg", __assign$3({
+          className: prefixCls + "-icon " + prefixCls + "-icon-file " + className,
+          width: "1em",
+          height: "1em",
+          style: style,
+          fill: useCurrentColor ? 'currentColor' : '#000',
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "0 0 16 16"
+        }, other), /*#__PURE__*/React__default["default"].createElement("path", {
+          d: "M2.3,2.7c0-0.7,0.6-1.3,1.3-1.3h7.3l2.7,2.7v9.3c0,0.7-0.6,1.3-1.3,1.3H3.7c-0.7,0-1.3-0.6-1.3-1.3\tV2.7z M10.4,2.7H3.7v10.7h8.7V4.6L10.4,2.7z M10.7,7.7H5.3V6.3h5.3V7.7z M8.7,10.3H5.3V9h3.3V10.3z",
+          fillRule: "evenodd",
+          clipRule: "evenodd"
+        }));
+      });
+    }
+
+    function IconUpload(props) {
+      var _a = props.className,
+          className = _a === void 0 ? '' : _a,
+          _b = props.useCurrentColor,
+          useCurrentColor = _b === void 0 ? true : _b,
+          style = props.style,
+          other = __rest$1(props, ["className", "useCurrentColor", "style"]);
+
+      return /*#__PURE__*/React__default["default"].createElement(ContextLayout, null, function (_a) {
+        var prefixCls = _a.prefixCls;
+        return /*#__PURE__*/React__default["default"].createElement("svg", __assign$3({
+          className: prefixCls + "-icon " + prefixCls + "-icon-upload " + className,
+          width: "1em",
+          height: "1em",
+          style: style,
+          fill: useCurrentColor ? 'currentColor' : '#000',
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "0 0 14 14"
+        }, other), /*#__PURE__*/React__default["default"].createElement("path", {
+          d: "M7,1.5l3.1,3.1L9.2,5.4L7.6,3.7v5.9H6.4V3.7L4.8,5.4L3.9,4.6L7,1.5z M2.9,11.4v-1.2H1.8v2.3h10.5\tv-2.3h-1.2v1.2H2.9z",
+          fillRule: "evenodd",
+          clipRule: "evenodd"
+        }));
+      });
+    }
+
     var Step = /*#__PURE__*/React.forwardRef(function (props, ref) {
       var title = props.title,
           description = props.description,
@@ -7727,7 +7833,7 @@
      * @type_en Data Display
      */
 
-    var index$p = componentWrapper(Steps, {
+    var index$q = componentWrapper(Steps, {
       Step: Step
     });
 
@@ -9056,7 +9162,7 @@
      * @name_en ActionSheet
      */
 
-    var index$o = componentWrapper(ActionSheet, methodsGenerator$5(ActionSheetWithGlobalContext));
+    var index$p = componentWrapper(ActionSheet, methodsGenerator$5(ActionSheetWithGlobalContext));
 
     /**
      * 加载中组件，分为四种类型，`circle`为环形，`arc`为弧线，`spin`为旋转，`dot`为圆点。所有类型均可定制颜色，环形和弧线类型可定制线圈半径及粗细，旋转和圆点类型可定制内部元素透明度。
@@ -9841,7 +9947,7 @@
      * @name_en Avatar
      */
 
-    var index$n = componentWrapper(Avatar, {
+    var index$o = componentWrapper(Avatar, {
       Group: Group$4
     });
 
@@ -10717,6 +10823,9 @@
 
       function getFakeChild() {
         if (noLoop) {
+          // 循环状态从有到无时，重置 transforms
+          // @en reset transforms when loop status changes to false
+          setTransforms([]);
           return;
         }
 
@@ -11256,7 +11365,7 @@
      * @name_en Cell
      */
 
-    var index$m = componentWrapper(Cell, {
+    var index$n = componentWrapper(Cell, {
       Group: Group$3
     });
 
@@ -12065,7 +12174,7 @@
      * @name_en Collapse
      */
 
-    var index$l = componentWrapper(Collapse, {
+    var index$m = componentWrapper(Collapse, {
       Group: Group$1
     });
 
@@ -12798,6 +12907,10 @@
         return (_a = data[currentIndex]) === null || _a === void 0 ? void 0 : _a.value;
       }
 
+      function getCurrentCellData() {
+        return data[currentIndex];
+      }
+
       function _clearTimer() {
         timeRef.current && clearTimeout(timeRef.current);
         timeRef.current = null;
@@ -12865,7 +12978,8 @@
         return {
           movingStatus: movingStatusRef.current,
           scrollToCurrentIndex: scrollToCurrentIndex,
-          getCurrentCellValue: getCurrentCellValue
+          getCurrentCellValue: getCurrentCellValue,
+          getCurrentCellData: getCurrentCellData
         };
       });
       return !hideEmptyCols || data && data.length ? /*#__PURE__*/React__default["default"].createElement("div", {
@@ -12916,7 +13030,8 @@
         return {
           getCellMovingStatus: getCellMovingStatus,
           scrollToCurrentIndex: scrollToCurrentIndex,
-          getAllCellsValue: getAllCellsValue
+          getAllCellsValue: getAllCellsValue,
+          getAllCellsData: getAllCellsData
         };
       });
 
@@ -12938,6 +13053,12 @@
         });
       }
 
+      function getAllCellsData() {
+        return pickerCellsRef.current.map(function (cell) {
+          return cell.getCurrentCellData();
+        });
+      }
+
       function _onValueChange(value, index, newData) {
         var children = arrayTreeFilter(data, function (item, level) {
           return level <= index && item.value === value[level];
@@ -13006,6 +13127,14 @@
       }));
     });
 
+    var isArray = function isArray(dt) {
+      return dt ? Array.isArray(dt[0]) : false;
+    };
+
+    var isStrOrNum = function isStrOrNum(dt) {
+      return typeof dt[0][0] === 'string' || typeof dt[0][0] === 'number';
+    };
+
     var PickerView = /*#__PURE__*/React.forwardRef(function (props, ref) {
       var _a = props.className,
           className = _a === void 0 ? '' : _a,
@@ -13055,14 +13184,6 @@
       var innerData = React.useMemo(function () {
         var newData;
 
-        var isArray = function isArray(dt) {
-          return dt ? Array.isArray(dt[0]) : false;
-        };
-
-        var isStrOrNum = function isStrOrNum(dt) {
-          return typeof dt[0][0] === 'string' || typeof dt[0][0] === 'number';
-        };
-
         if (isArray(data)) {
           if (isStrOrNum(data)) {
             newData = data.map(function (item) {
@@ -13096,6 +13217,17 @@
         });
       };
 
+      var getAllColumnData = function getAllColumnData() {
+        var _a;
+
+        var curValues = cascade ? ((_a = cascaderRef.current) === null || _a === void 0 ? void 0 : _a.getAllCellsData()) || [] : pickerCellsRef.current.map(function (cell) {
+          return cell.getCurrentCellData();
+        });
+        return curValues.filter(function (v) {
+          return v !== undefined;
+        });
+      };
+
       function getColumnValue(index) {
         if (index === void 0) {
           index = 0;
@@ -13133,7 +13265,8 @@
           getColumnValue: getColumnValue,
           updateLayout: updateLayout,
           resetValue: resetValue,
-          scrollToCurrentIndex: scrollToCurrentIndex
+          scrollToCurrentIndex: scrollToCurrentIndex,
+          getAllColumnData: getAllColumnData
         };
       });
 
@@ -13268,26 +13401,40 @@
           hideEmptyCols = _f === void 0 ? false : _f,
           _g = props.title,
           title = _g === void 0 ? '' : _g,
-          _h = props.visible,
-          visible = _h === void 0 ? false : _h,
+          userSetVisible = props.visible,
           value = props.value,
-          _j = props.needBottomOffset,
-          needBottomOffset = _j === void 0 ? false : _j,
+          _h = props.needBottomOffset,
+          needBottomOffset = _h === void 0 ? false : _h,
           onDismiss = props.onDismiss,
           onOk = props.onOk,
           onChange = props.onChange,
-          _k = props.maskClosable,
-          maskClosable = _k === void 0 ? false : _k,
+          _j = props.maskClosable,
+          maskClosable = _j === void 0 ? false : _j,
           onHide = props.onHide,
           onPickerChange = props.onPickerChange,
           touchToStop = props.touchToStop,
-          _l = props.gestureOutOfControl,
-          gestureOutOfControl = _l === void 0 ? true : _l,
-          otherProps = __rest$1(props, ["className", "itemStyle", "cascade", "cols", "rows", "data", "okText", "dismissText", "disabled", "clickable", "hideEmptyCols", "title", "visible", "value", "needBottomOffset", "onDismiss", "onOk", "onChange", "maskClosable", "onHide", "onPickerChange", "touchToStop", "gestureOutOfControl"]);
+          _k = props.gestureOutOfControl,
+          gestureOutOfControl = _k === void 0 ? true : _k,
+          renderLinkedContainer = props.renderLinkedContainer,
+          otherProps = __rest$1(props, ["className", "itemStyle", "cascade", "cols", "rows", "data", "okText", "dismissText", "disabled", "clickable", "hideEmptyCols", "title", "visible", "value", "needBottomOffset", "onDismiss", "onOk", "onChange", "maskClosable", "onHide", "onPickerChange", "touchToStop", "gestureOutOfControl", "renderLinkedContainer"]);
 
       var scrollValueRef = useLatestRef(value);
       var domRef = React.useRef(null);
       var pickerViewRef = React.useRef(null);
+
+      var _l = React.useState(false),
+          linkVisible = _l[0],
+          setLinkVisible = _l[1];
+
+      var _m = React.useState(function () {
+        return getCurrentValueData();
+      }),
+          linkArgs = _m[0],
+          setLinkArgs = _m[1]; // 来自linkedContainer的visible变化，优先级高于受控值
+      // @en Visible changes from linkedContainer which have priority over controlled values
+
+
+      var visible = linkVisible || userSetVisible || false;
       React.useImperativeHandle(ref, function () {
         return {
           dom: domRef.current,
@@ -13318,39 +13465,61 @@
           }
         };
       });
+      React.useEffect(function () {
+        nextTick(function () {
+          setLinkArgs(getCurrentValueData());
+        });
+      }, []);
+
+      function hidePicker(scene) {
+        setLinkVisible(false);
+        onHide === null || onHide === void 0 ? void 0 : onHide(scene);
+      }
 
       function handleDismiss() {
         if (onDismiss) {
           onDismiss();
         }
 
-        if (onHide) {
-          onHide('dismiss');
-        }
+        hidePicker('dismiss');
       }
 
-      var handleConfirm = function handleConfirm() {
+      function getCurrentValueData() {
+        var _a, _b;
+
+        var val = ((_a = pickerViewRef.current) === null || _a === void 0 ? void 0 : _a.getAllColumnValues()) || scrollValueRef.current || [];
+        var selectedData = ((_b = pickerViewRef.current) === null || _b === void 0 ? void 0 : _b.getAllColumnData()) || [];
+        return {
+          value: val,
+          data: selectedData
+        };
+      }
+
+      function handleConfirm() {
         var _a;
 
         (_a = pickerViewRef.current) === null || _a === void 0 ? void 0 : _a.scrollToCurrentIndex();
         nextTick(function () {
-          var _a;
+          var _a = getCurrentValueData(),
+              val = _a.value,
+              selectedData = _a.data;
 
-          var val = ((_a = pickerViewRef.current) === null || _a === void 0 ? void 0 : _a.getAllColumnValues()) || scrollValueRef.current || [];
+          setLinkArgs({
+            value: val,
+            data: selectedData
+          });
 
           if (onOk) {
-            onOk(val);
+            onOk(val, selectedData);
           }
 
           if (onChange) {
             onChange(val);
           }
 
-          if (onHide) {
-            onHide('confirm');
-          }
+          hidePicker('confirm');
         });
-      };
+      }
 
       useListenResize(updateLayoutByVisible, [visible]); // 每次visible从false变为true时需要重新设置scrollValue的值为当前value的值（初始值）
 
@@ -13366,11 +13535,16 @@
       return /*#__PURE__*/React__default["default"].createElement(ContextLayout, null, function (_a) {
         var prefixCls = _a.prefixCls,
             locale = _a.locale;
-        return /*#__PURE__*/React__default["default"].createElement(Popup$1, __assign$3({
+        return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, renderLinkedContainer ? /*#__PURE__*/React__default["default"].createElement("div", {
+          className: prefixCls + "-picker-linked-container",
+          onClick: function onClick() {
+            return setLinkVisible(true);
+          }
+        }, renderLinkedContainer(linkArgs.value, linkArgs.data)) : null, /*#__PURE__*/React__default["default"].createElement(Popup$1, __assign$3({
           visible: visible,
           className: cls(className, prefixCls + "-picker all-border-box"),
           close: function close() {
-            return onHide === null || onHide === void 0 ? void 0 : onHide('mask');
+            return hidePicker('mask');
           },
           direction: "bottom",
           maskClosable: maskClosable,
@@ -13402,7 +13576,7 @@
           clickable: clickable,
           hideEmptyCols: hideEmptyCols,
           touchToStop: touchToStop
-        })));
+        }))));
       });
     });
     /**
@@ -13788,7 +13962,7 @@
      * @displayName DatePicker
      */
 
-    var index$k = componentWrapper(DatePicker, 'DatePicker');
+    var index$l = componentWrapper(DatePicker, 'DatePicker');
 
     function normalizeAlert(config) {
       var _a = config || {},
@@ -13986,7 +14160,7 @@
      * @name_en Dialog
      */
 
-    var index$j = componentWrapper(Dialog, methodsGenerator$4(DialogWithGlobalContext));
+    var index$k = componentWrapper(Dialog, methodsGenerator$4(DialogWithGlobalContext));
 
     /**
      * 划分内容的装饰线
@@ -14457,7 +14631,7 @@
      * */
 
     function isCascadeArray(options) {
-      return typeof options[0] === 'object' && !isArray(options[0]);
+      return typeof options[0] === 'object' && !isArray$1(options[0]);
     }
     /**
      * 格式化传入的数组
@@ -15747,7 +15921,7 @@
         };
     });
 
-    var index$i = (function () {
+    var index$j = (function () {
         // Export existing implementation if available.
         if (typeof global$1.ResizeObserver !== 'undefined') {
             return global$1.ResizeObserver;
@@ -15984,7 +16158,7 @@
       React.useEffect(function () {
         if (domRef.current && reflowOnResize) {
           if (!observerRef.current && ellipsis) {
-            observerRef.current = new index$i(reflow);
+            observerRef.current = new index$j(reflow);
             observerRef.current.observe(domRef.current);
           }
         }
@@ -16489,6 +16663,21 @@
       };
     };
 
+    function DefaultPickerLinkedContainer(_a) {
+      var value = _a.value;
+
+      var _b = React.useContext(GlobalContext),
+          prefixCls = _b.prefixCls,
+          locale = _b.locale;
+
+      var className = prefixCls + "-form-picker-link-container";
+      return /*#__PURE__*/React__default["default"].createElement("div", {
+        className: className
+      }, value && value.length ? value.join('-') : /*#__PURE__*/React__default["default"].createElement("span", {
+        className: className + "-placeholder"
+      }, locale === null || locale === void 0 ? void 0 : locale.Form.pickerDefaultHint));
+    }
+
     var FormItemInner =
     /** @class */
     function (_super) {
@@ -16669,16 +16858,16 @@
 
         var _this = this;
 
-        var _b;
+        var _b, _c, _d;
 
-        var _c = this.props,
-            children = _c.children,
-            field = _c.field,
-            _d = _c.trigger,
-            trigger = _d === void 0 ? 'onChange' : _d,
-            _e = _c.triggerPropsField,
-            triggerPropsField = _e === void 0 ? 'value' : _e,
-            displayType = _c.displayType;
+        var _e = this.props,
+            children = _e.children,
+            field = _e.field,
+            _f = _e.trigger,
+            trigger = _f === void 0 ? 'onChange' : _f,
+            _g = _e.triggerPropsField,
+            triggerPropsField = _g === void 0 ? 'value' : _g,
+            displayType = _e.displayType;
         var getFieldValue = this.context.form.getFieldValue;
         var props = (_a = {}, _a[triggerPropsField] = getFieldValue(field), _a.disabled = this.props.disabled, _a);
         var childrenType = displayType || ((_b = children.type) === null || _b === void 0 ? void 0 : _b.displayName);
@@ -16709,16 +16898,26 @@
           case FormInternalComponentType.DatePicker:
             props = {
               currentTs: getFieldValue(field),
-              onChange: this.innerTriggerFunction,
-              disabled: this.props.disabled
+              onChange: this.innerTriggerFunctionWithValueFirst,
+              disabled: this.props.disabled,
+              renderLinkedContainer: ((_c = children.props) === null || _c === void 0 ? void 0 : _c.renderLinkedContainer) || function (val) {
+                return /*#__PURE__*/React__default["default"].createElement(DefaultPickerLinkedContainer, {
+                  value: val
+                });
+              }
             };
             break;
 
           case FormInternalComponentType.Picker:
             props = {
-              data: getFieldValue(field),
-              onPickerChange: this.innerTriggerFunction,
-              disabled: this.props.disabled
+              value: getFieldValue(field),
+              onChange: this.innerTriggerFunctionWithValueFirst,
+              disabled: this.props.disabled,
+              renderLinkedContainer: ((_d = children.props) === null || _d === void 0 ? void 0 : _d.renderLinkedContainer) || function (val) {
+                return /*#__PURE__*/React__default["default"].createElement(DefaultPickerLinkedContainer, {
+                  value: val
+                });
+              }
             };
             break;
 
@@ -16926,7 +17125,7 @@
      * @name_en Form
      */
 
-    var index$h = componentWrapper(Form, {
+    var index$i = componentWrapper(Form, {
       Item: Item$1
     });
 
@@ -17060,6 +17259,20 @@
       return /*#__PURE__*/React__default["default"].createElement(ContextLayout, null, renderEl);
     });
 
+    function AddIcon() {
+      return /*#__PURE__*/React__default["default"].createElement("svg", {
+        width: "30",
+        height: "30",
+        viewBox: "0 0 30 30",
+        fill: "none"
+      }, /*#__PURE__*/React__default["default"].createElement("path", {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M14.5 0C14.2239 0 14 0.223857 14 0.5V14H0.5C0.223858 14 0 14.2239 0 14.5V15.5C0 15.7761 0.223857 16 0.5 16H14V29.5C14 29.7761 14.2239 30 14.5 30H15.5C15.7761 30 16 29.7761 16 29.5V16H29.5C29.7761 16 30 15.7761 30 15.5V14.5C30 14.2239 29.7761 14 29.5 14H16V0.5C16 0.223858 15.7761 0 15.5 0H14.5Z",
+        fill: "#C9CDD4"
+      }));
+    }
+
     var es6Promise = createCommonjsModule(function (module, exports) {
     /*!
      * @overview es6-promise - a tiny implementation of Promises/A+.
@@ -18232,19 +18445,178 @@
 
     });
 
-    function AddIcon() {
-      return /*#__PURE__*/React__default["default"].createElement("svg", {
-        width: "30",
-        height: "30",
-        viewBox: "0 0 30 30",
-        fill: "none"
-      }, /*#__PURE__*/React__default["default"].createElement("path", {
-        fillRule: "evenodd",
-        clipRule: "evenodd",
-        d: "M14.5 0C14.2239 0 14 0.223857 14 0.5V14H0.5C0.223858 14 0 14.2239 0 14.5V15.5C0 15.7761 0.223857 16 0.5 16H14V29.5C14 29.7761 14.2239 30 14.5 30H15.5C15.7761 30 16 29.7761 16 29.5V16H29.5C29.7761 16 30 15.7761 30 15.5V14.5C30 14.2239 29.7761 14 29.5 14H16V0.5C16 0.223858 15.7761 0 15.5 0H14.5Z",
-        fill: "#C9CDD4"
-      }));
-    }
+    var Upload =
+    /** @class */
+    function () {
+      function Upload(props, fileRef, cacheRef) {
+        var _this = this; // 解析文件生成预览
+
+
+        this.handleFile = function (newFiles) {
+          es6Promise.Promise.all(newFiles.map(function (file) {
+            return parseFile(file);
+          })).then(function (parseFiles) {
+            var res = parseFiles.map(function (url, index) {
+              return {
+                url: url,
+                status: typeof _this.props.upload === 'function' ? 'loading' : 'loaded',
+                file: newFiles[index]
+              };
+            });
+            _this.cacheRef.current = __spreadArrays$1(_this.cacheRef.current, res);
+
+            _this.props.onChange(__spreadArrays$1(_this.cacheRef.current)); // 执行upload
+
+
+            if (typeof _this.props.upload === 'function') {
+              newFiles.forEach(function (_file) {
+                _this.props.upload(_this.cacheRef.current.find(function (_a) {
+                  var file = _a.file;
+                  return file === _file;
+                })).then(function (data) {
+                  var index = _this.cacheRef.current.findIndex(function (_a) {
+                    var file = _a.file;
+                    return file === _file;
+                  });
+
+                  if (index !== -1) {
+                    _this.cacheRef.current[index] = __assign$3(__assign$3(__assign$3({}, _this.cacheRef.current[index]), data), {
+                      status: 'loaded'
+                    });
+                  }
+                }).catch(function () {
+                  var index = _this.cacheRef.current.findIndex(function (_a) {
+                    var file = _a.file;
+                    return file === _file;
+                  });
+
+                  if (index !== -1) {
+                    _this.cacheRef.current[index].status = 'error';
+                  }
+                }).finally(function () {
+                  _this.props.onChange(__spreadArrays$1(_this.cacheRef.current));
+                });
+              });
+            }
+          });
+        };
+
+        this.handleChange = function (event, fromAdapter) {
+          var newFiles = Array.prototype.filter.call(event.target.files || [], function (file) {
+            // 过滤maxSize
+            if (_this.props.maxSize && file.size > _this.props.maxSize * 1024) {
+              _this.props.onMaxSizeExceed && _this.props.onMaxSizeExceed(file);
+              return false;
+            }
+
+            return true;
+          }) || [];
+
+          if (!fromAdapter) {
+            event.target.value = '';
+          } // 截断limit
+
+
+          if (_this.props.limit !== 0 && newFiles.length + _this.props.files.length > _this.props.limit) {
+            _this.props.onLimitExceed && _this.props.onLimitExceed(newFiles);
+            newFiles.length = _this.props.limit - _this.props.files.length;
+          }
+
+          _this.handleFile(newFiles);
+        };
+
+        this.deleteFile = function (index) {
+          _this.props.onDeleteClick && _this.props.onDeleteClick(index);
+
+          _this.props.onChange(_this.props.files.filter(function (_i, j) {
+            return j !== index;
+          }));
+        }; // 重新上传
+
+
+        this.retryUpload = function (index) {
+          _this.deleteFile(index);
+
+          _this.handleFile([_this.props.files[index].file]);
+        };
+
+        this.handleSelect = function (e) {
+          var _a;
+
+          if (e.target !== _this.fileRef.current) {
+            _this.props.onUploadClick && _this.props.onUploadClick();
+            _this.props.selectAdapter ? _this.props.selectAdapter().then(function (value) {
+              return _this.handleChange({
+                target: {
+                  files: value.files
+                }
+              }, true);
+            }) : (_a = _this.fileRef.current) === null || _a === void 0 ? void 0 : _a.click();
+          }
+        };
+
+        this.handleClick = function (e, file, index) {
+          var _a, _b;
+
+          clearTimeout(_this.timeOutEvent);
+
+          if (_this.timeOutEvent !== 0) {
+            (_b = (_a = _this.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, e, file, index);
+          }
+        };
+
+        this.handleTouchStart = function (e, image, index) {
+          _this.timeOutEvent = setTimeout(function () {
+            var _a, _b;
+
+            _this.timeOutEvent = 0;
+            (_b = (_a = _this.props).onLongPress) === null || _b === void 0 ? void 0 : _b.call(_a, e, image, index);
+          }, 750);
+        };
+
+        this.props = __assign$3({}, props);
+        this.fileRef = fileRef;
+        this.cacheRef = cacheRef;
+        this.init();
+      }
+
+      Upload.prototype.init = function () {
+        !this.props.files && (this.props.files = []);
+        !this.props.limit && (this.props.limit = 0);
+        !this.props.onChange && (this.props.onChange = function () {
+          return null;
+        });
+      };
+
+      return Upload;
+    }();
+    var parseFile = function parseFile(file) {
+      return new es6Promise.Promise(function (resolve, reject) {
+        if (file.url) {
+          resolve(file.url);
+        } else {
+          var reader = new FileReader();
+
+          reader.onload = function (e) {
+            var _a;
+
+            var dataURL = (_a = e.target) === null || _a === void 0 ? void 0 : _a.result;
+
+            if (!dataURL) {
+              reject(new Error('file parse error'));
+            }
+
+            resolve(dataURL);
+          };
+
+          reader.onerror = function () {
+            reject(new Error('file parse error'));
+          };
+
+          reader.readAsDataURL(file);
+        }
+      });
+    };
 
     var ImagePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
       var _a = props.className,
@@ -18263,7 +18635,6 @@
           limit = _f === void 0 ? 0 : _f,
           _g = props.images,
           images = _g === void 0 ? [] : _g,
-          maxSize = props.maxSize,
           disabled = props.disabled,
           deleteIcon = props.deleteIcon,
           selectIcon = props.selectIcon,
@@ -18276,18 +18647,7 @@
           imageProps = props.imageProps,
           renderLoading = props.renderLoading,
           renderError = props.renderError,
-          onLongPress = props.onLongPress,
-          onClick = props.onClick,
-          _l = props.onChange,
-          onChange = _l === void 0 ? function () {
-        return null;
-      } : _l,
-          onMaxSizeExceed = props.onMaxSizeExceed,
-          onLimitExceed = props.onLimitExceed,
-          upload = props.upload,
-          selectAdapter = props.selectAdapter,
-          onSelectClick = props.onSelectClick,
-          onDeleteClick = props.onDeleteClick;
+          selectAdapter = props.selectAdapter;
       var domRef = React.useRef(null);
       var fileRef = React.useRef(null);
       var cacheRef = useLatestRef(images);
@@ -18296,143 +18656,9 @@
           dom: domRef.current
         };
       });
-
-      var parseFile = function parseFile(file) {
-        return new es6Promise.Promise(function (resolve, reject) {
-          if (file.url) {
-            resolve(file.url);
-          } else {
-            var reader = new FileReader();
-
-            reader.onload = function (e) {
-              var _a;
-
-              var dataURL = (_a = e.target) === null || _a === void 0 ? void 0 : _a.result;
-
-              if (!dataURL) {
-                reject(new Error('file parse error'));
-              }
-
-              resolve(dataURL);
-            };
-
-            reader.onerror = function () {
-              reject(new Error('file parse error'));
-            };
-
-            reader.readAsDataURL(file);
-          }
-        });
-      };
-
-      var handleChange = function handleChange(event, fromAdapter) {
-        var files = Array.prototype.filter.call(event.target.files || [], function (file) {
-          // 过滤maxSize
-          if (maxSize && file.size > maxSize * 1024) {
-            onMaxSizeExceed && onMaxSizeExceed(file);
-            return false;
-          }
-
-          return true;
-        }) || [];
-
-        if (!fromAdapter) {
-          event.target.value = '';
-        } // 截断limit
-
-
-        if (limit !== 0 && files.length + images.length > limit) {
-          onLimitExceed && onLimitExceed(files);
-          files.length = limit - images.length;
-        } // 解析文件生成预览
-
-
-        es6Promise.Promise.all(files.map(function (file) {
-          return parseFile(file);
-        })).then(function (parseFiles) {
-          var res = parseFiles.map(function (url, index) {
-            return {
-              url: url,
-              status: typeof upload === 'function' ? 'loading' : 'loaded',
-              file: files[index]
-            };
-          });
-          cacheRef.current = __spreadArrays$1(cacheRef.current, res);
-          onChange(__spreadArrays$1(cacheRef.current)); // 执行upload
-
-          if (typeof upload === 'function') {
-            files.forEach(function (_file) {
-              upload(cacheRef.current.find(function (_a) {
-                var file = _a.file;
-                return file === _file;
-              })).then(function (data) {
-                var index = cacheRef.current.findIndex(function (_a) {
-                  var file = _a.file;
-                  return file === _file;
-                });
-
-                if (index !== -1) {
-                  cacheRef.current[index] = __assign$3(__assign$3(__assign$3({}, cacheRef.current[index]), data), {
-                    status: undefined
-                  });
-                }
-              }).catch(function () {
-                var index = cacheRef.current.findIndex(function (_a) {
-                  var file = _a.file;
-                  return file === _file;
-                });
-
-                if (index !== -1) {
-                  cacheRef.current[index].status = 'error';
-                }
-              }).finally(function () {
-                onChange(__spreadArrays$1(cacheRef.current));
-              });
-            });
-          }
-        });
-      };
-
-      var handleDelete = function handleDelete(index) {
-        onDeleteClick && onDeleteClick(index);
-        onChange(images.filter(function (_i, j) {
-          return j !== index;
-        }));
-      }; // click && longPress
-
-
-      var timeOutEvent;
-
-      var handleTouchStart = function handleTouchStart(e, image, index) {
-        timeOutEvent = setTimeout(function () {
-          timeOutEvent = 0;
-          onLongPress === null || onLongPress === void 0 ? void 0 : onLongPress(e, image, index);
-        }, 750);
-      };
-
-      var handleClick = function handleClick(e, image, index) {
-        clearTimeout(timeOutEvent);
-
-        if (timeOutEvent !== 0) {
-          onClick === null || onClick === void 0 ? void 0 : onClick(e, image, index);
-        }
-      };
-
-      var handleSelect = function handleSelect(e) {
-        var _a;
-
-        if (e.target !== fileRef.current) {
-          onSelectClick && onSelectClick();
-          selectAdapter ? selectAdapter().then(function (_a) {
-            var files = _a.files;
-            return handleChange({
-              target: {
-                files: files
-              }
-            }, true);
-          }) : (_a = fileRef.current) === null || _a === void 0 ? void 0 : _a.click();
-        }
-      };
+      var uploadFunc = new Upload(__assign$3(__assign$3({}, props), {
+        files: images
+      }), fileRef, cacheRef);
 
       var getGridData = function getGridData(prefixCls, locale) {
         var _a;
@@ -18464,10 +18690,10 @@
               className: prefixCls + "-image-picker-image"
             }, /*#__PURE__*/React__default["default"].createElement("div", {
               onTouchStart: function onTouchStart(e) {
-                return handleTouchStart(e, image, index);
+                return uploadFunc.handleTouchStart(e, image, index);
               },
               onClick: function onClick(e) {
-                return handleClick(e, image, index);
+                return uploadFunc.handleClick(e, image, index);
               },
               className: prefixCls + "-image-picker-image-container"
             }, /*#__PURE__*/React__default["default"].createElement(BaseImage, __assign$3({
@@ -18483,7 +18709,7 @@
             })), !hideDelete && /*#__PURE__*/React__default["default"].createElement("div", {
               className: prefixCls + "-image-picker-close",
               onClick: function onClick() {
-                return handleDelete(index);
+                return uploadFunc.deleteFile(index);
               }
             }, deleteIcon || /*#__PURE__*/React__default["default"].createElement("div", {
               className: prefixCls + "-image-picker-close-icon"
@@ -18498,7 +18724,7 @@
           data.push({
             img: /*#__PURE__*/React__default["default"].createElement("div", {
               className: cls(prefixCls + "-image-picker-add", (_a = {}, _a[prefixCls + "-image-picker-add-disabled"] = disableSelect, _a)),
-              onClick: handleSelect
+              onClick: uploadFunc.handleSelect
             }, /*#__PURE__*/React__default["default"].createElement("div", {
               className: prefixCls + "-image-picker-add-container"
             }, selectIcon || /*#__PURE__*/React__default["default"].createElement("div", {
@@ -18509,7 +18735,7 @@
               multiple: multiple,
               type: "file",
               onChange: function onChange(e) {
-                return handleChange(e);
+                return uploadFunc.handleChange(e);
               },
               ref: fileRef
             }) : null)),
@@ -18549,7 +18775,7 @@
      * @displayName ImagePicker
      */
 
-    var index$g = componentWrapper(ImagePicker, 'ImagePicker');
+    var index$h = componentWrapper(ImagePicker, 'ImagePicker');
 
     /*!
     * @arco-design/transformable v1.0.1
@@ -21783,7 +22009,7 @@
      * @name_en ImagePreview
      */
 
-    var index$f = componentWrapper(ImagePreview, methodsGenerator$3(ImagePreviewWithGlobalContext));
+    var index$g = componentWrapper(ImagePreview, methodsGenerator$3(ImagePreviewWithGlobalContext));
 
     var IndexBarContext = /*#__PURE__*/React.createContext({
       sticky: true,
@@ -22252,7 +22478,7 @@
      * @name_en SearchBar
      */
 
-    var index$e = componentWrapper(IndexBar, {
+    var index$f = componentWrapper(IndexBar, {
       Group: IndexBarGroup
     });
 
@@ -22314,8 +22540,8 @@
       React.useEffect(function () {
         if (autoFocus) {
           setTimeout(function () {
-            inputRef.current && inputRef.current.focus();
-          }, 200);
+            inputRef.current && inputRef.current.click();
+          }, 100);
         }
       }, []);
       React.useEffect(function () {
@@ -22592,7 +22818,7 @@
      * @displayName Input
      */
 
-    var index$d = componentWrapper(Input, 'Input');
+    var index$e = componentWrapper(Input, 'Input');
 
     // @en let keyboard random
 
@@ -23604,7 +23830,7 @@
      * @name_en Notify
      */
 
-    var index$c = componentWrapper(Notify, methodsGenerator$2(NotifyWithGlobalContext));
+    var index$d = componentWrapper(Notify, methodsGenerator$2(NotifyWithGlobalContext));
 
     function Arrow() {
       return /*#__PURE__*/React__default["default"].createElement("svg", {
@@ -25019,7 +25245,7 @@
      * @type_en Data Display
      */
 
-    var index$b = componentWrapper(Popover$1, {
+    var index$c = componentWrapper(Popover$1, {
       Menu: Menu
     });
 
@@ -25285,7 +25511,7 @@
      * @name_en PopupSwiper
      */
 
-    var index$a = componentWrapper(PopupSwiper, methodsGenerator$1(PopupSwiperWithGlobalContext));
+    var index$b = componentWrapper(PopupSwiper, methodsGenerator$1(PopupSwiperWithGlobalContext));
 
     /**
      * 进度条组件，可根据外界传递进来的百分比进行进度展示
@@ -26126,7 +26352,7 @@
      * @displayName Radio
      */
 
-    var index$9 = componentWrapper(Radio, 'Radio', {
+    var index$a = componentWrapper(Radio, 'Radio', {
       Group: Group
     });
 
@@ -26308,7 +26534,7 @@
      * @displayName Rate
      */
 
-    var index$8 = componentWrapper(Rate, 'Rate');
+    var index$9 = componentWrapper(Rate, 'Rate');
 
     function createHighlightNode(config, index) {
       var keyword = config.keyword,
@@ -27341,7 +27567,7 @@
       });
 
       var getWidth = function getWidth(idx) {
-        if (isArray(width)) {
+        if (isArray$1(width)) {
           return width[idx];
         }
 
@@ -27540,7 +27766,7 @@
      * @name_en Skeleton
      */
 
-    var index$7 = componentWrapper(Skeleton, {
+    var index$8 = componentWrapper(Skeleton, {
       Node: SkeletonNode,
       Title: SkeletonTitle,
       Paragraph: SkeletonParagraph,
@@ -28331,7 +28557,7 @@
      * @displayName Slider
      */
 
-    var index$6 = componentWrapper(SliderWrapper, 'Slider');
+    var index$7 = componentWrapper(SliderWrapper, 'Slider');
 
     function correctCalculation(leftNumber, rightNumber, operator) {
       var magnification = 1e17;
@@ -28646,7 +28872,7 @@
      * @displayName Stepper
      */
 
-    var index$5 = componentWrapper(Stepper, 'Stepper');
+    var index$6 = componentWrapper(Stepper, 'Stepper');
 
     function renderAction(_a) {
       var action = _a.action,
@@ -29455,7 +29681,7 @@
      * @displayName Switch
      */
 
-    var index$4 = componentWrapper(Switch, 'Switch');
+    var index$5 = componentWrapper(Switch, 'Switch');
 
     var TabBarContext = /*#__PURE__*/React.createContext({
       changeIndex: function changeIndex() {},
@@ -29599,7 +29825,7 @@
      * @name_en TabBar
      */
 
-    var index$3 = componentWrapper(TabBar, {
+    var index$4 = componentWrapper(TabBar, {
       Item: Item
     });
 
@@ -29765,7 +29991,7 @@
      * @name_en Tag
      */
 
-    var index$2 = componentWrapper(Tag, {
+    var index$3 = componentWrapper(Tag, {
       List: List
     });
 
@@ -29914,7 +30140,7 @@
      * @displayName Textarea
      */
 
-    var index$1 = componentWrapper(Textarea, 'Textarea');
+    var index$2 = componentWrapper(Textarea, 'Textarea');
 
     function toast(Component, type) {
       return function (originConfig, context) {
@@ -30175,66 +30401,209 @@
      * @name_en Toast
      */
 
-    var index = componentWrapper(Toast, methodsGenerator(ToastWithGlobalContext));
+    var index$1 = componentWrapper(Toast, methodsGenerator(ToastWithGlobalContext));
+
+    var Uploader = /*#__PURE__*/React.forwardRef(function (props, ref) {
+      var _a = props.className,
+          className = _a === void 0 ? '' : _a,
+          style = props.style,
+          _b = props.files,
+          files = _b === void 0 ? [] : _b,
+          _c = props.accept,
+          accept = _c === void 0 ? undefined : _c,
+          _d = props.multiple,
+          multiple = _d === void 0 ? false : _d,
+          capture = props.capture,
+          _e = props.limit,
+          limit = _e === void 0 ? 0 : _e,
+          _f = props.hideStatus,
+          hideStatus = _f === void 0 ? false : _f,
+          _g = props.alwaysShowSelect,
+          alwaysShowSelect = _g === void 0 ? false : _g,
+          disabled = props.disabled,
+          renderDeleteArea = props.renderDeleteArea,
+          renderLoadedArea = props.renderLoadedArea,
+          renderLoadingArea = props.renderLoadingArea,
+          renderErrorArea = props.renderErrorArea,
+          renderFileIndexArea = props.renderFileIndexArea,
+          renderUploadArea = props.renderUploadArea,
+          renderFileList = props.renderFileList;
+      var domRef = React.useRef(null);
+      var fileRef = React.useRef(null);
+      var cacheRef = useLatestRef(files);
+      var uploadFunc = new Upload(props, fileRef, cacheRef);
+      React.useImperativeHandle(ref, function () {
+        return {
+          dom: domRef.current
+        };
+      });
+
+      var uploaderSelect = function uploaderSelect(prefixCls, locale) {
+        var showSelect = files.length < (limit || Infinity);
+        return (showSelect || alwaysShowSelect) && /*#__PURE__*/React__default["default"].createElement("div", {
+          className: prefixCls + "-uploader-add",
+          onClick: uploadFunc.handleSelect
+        }, /*#__PURE__*/React__default["default"].createElement("input", {
+          type: "file",
+          accept: accept,
+          capture: capture,
+          onChange: function onChange(e) {
+            return uploadFunc.handleChange(e);
+          },
+          multiple: multiple,
+          ref: fileRef
+        }), renderUploadArea && renderUploadArea() || /*#__PURE__*/React__default["default"].createElement(Button, {
+          className: prefixCls + "-uploader-add-button",
+          size: "medium",
+          icon: /*#__PURE__*/React__default["default"].createElement(IconUpload, null),
+          disabled: disabled
+        }, locale.Uploader.uploadBtn));
+      };
+
+      var getUploadList = function getUploadList(prefixCls, locale) {
+        var generateItemArea = function generateItemArea(fileItem, index, render, part, defaultArea) {
+          if (render) {
+            var node = render(fileItem, index);
+            return node ? /*#__PURE__*/React__default["default"].createElement("div", {
+              className: prefixCls + "-uploader-list-item-" + part
+            }, node) : node;
+          }
+
+          return /*#__PURE__*/React__default["default"].createElement("div", {
+            className: prefixCls + "-uploader-list-item-" + part
+          }, defaultArea);
+        };
+
+        return renderFileList && renderFileList({
+          retryUpload: uploadFunc.retryUpload,
+          deleteFile: uploadFunc.deleteFile
+        }) || /*#__PURE__*/React__default["default"].createElement("div", {
+          className: prefixCls + "-uploader-list"
+        }, (limit && limit < files.length ? files.slice(0, limit) : files).map(function (fileItem, index) {
+          var _a, _b;
+
+          var file = fileItem.file,
+              status = fileItem.status;
+          return /*#__PURE__*/React__default["default"].createElement("div", {
+            className: prefixCls + "-uploader-list-item",
+            key: index,
+            onClick: function onClick(e) {
+              return uploadFunc.handleClick(e, fileItem, index);
+            }
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            className: prefixCls + "-uploader-list-item-container"
+          }, /*#__PURE__*/React__default["default"].createElement("div", {
+            className: prefixCls + "-uploader-list-item-wrapper"
+          }, generateItemArea(fileItem, index, renderFileIndexArea, 'file', /*#__PURE__*/React__default["default"].createElement(IconFile, {
+            className: prefixCls + "-uploader-list-item-file-icon"
+          })), /*#__PURE__*/React__default["default"].createElement("div", {
+            className: cls(prefixCls + "-uploader-list-item-text", (_a = {}, _a[prefixCls + "-uploader-list-item-text-error"] = status === 'error', _a))
+          }, file.name)), !hideStatus && /*#__PURE__*/React__default["default"].createElement("div", {
+            className: prefixCls + "-uploader-list-item-status"
+          }, status === 'loaded' && generateItemArea(fileItem, index, renderLoadedArea, 'loaded', /*#__PURE__*/React__default["default"].createElement(IconCheck, null)), status === 'loading' && generateItemArea(fileItem, index, renderLoadingArea, 'loading', /*#__PURE__*/React__default["default"].createElement(Loading, {
+            type: "circle",
+            radius: 7
+          })), status === 'error' && /*#__PURE__*/React__default["default"].createElement("div", {
+            onClick: function onClick() {
+              return uploadFunc.retryUpload(index);
+            }
+          }, generateItemArea(fileItem, index, renderErrorArea, 'error', /*#__PURE__*/React__default["default"].createElement("span", null, locale.Uploader.retryUpload))))), /*#__PURE__*/React__default["default"].createElement("div", {
+            className: prefixCls + "-uploader-list-item-delete",
+            onClick: function onClick() {
+              return uploadFunc.deleteFile(index);
+            }
+          }, renderDeleteArea && renderDeleteArea(fileItem, index) || /*#__PURE__*/React__default["default"].createElement(IconDelete, {
+            className: cls(prefixCls + "-uploader-list-item-delete-icon", (_b = {}, _b[prefixCls + "-uploader-list-item-delete-icon-disabled"] = disabled, _b))
+          })));
+        }));
+      };
+
+      return /*#__PURE__*/React__default["default"].createElement(ContextLayout, null, function (_a) {
+        var _b;
+
+        var prefixCls = _a.prefixCls,
+            _c = _a.locale,
+            locale = _c === void 0 ? defaultLocale : _c;
+        return /*#__PURE__*/React__default["default"].createElement("div", {
+          className: cls(prefixCls + "-uploader", className, (_b = {}, _b[prefixCls + "-uploader-disabled"] = disabled, _b)),
+          style: style,
+          ref: domRef
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          className: prefixCls + "-uploader-container"
+        }, uploaderSelect(prefixCls, locale), getUploadList(prefixCls, locale)));
+      });
+    });
+    /**
+     * 文件上传组件
+     * @en Uploader Component
+     * @type 数据录入
+     * @type_en Data Entry
+     * @name 文件上传
+     * @name_en Uploader
+     * @displayName Uploader
+     */
+
+    var index = componentWrapper(Uploader, 'Uploader');
 
-    exports.ActionSheet = index$o;
-    exports.Avatar = index$n;
+    exports.ActionSheet = index$p;
+    exports.Avatar = index$o;
     exports.Badge = Badge;
     exports.Button = Button;
     exports.Carousel = Carousel;
-    exports.Cell = index$m;
+    exports.Cell = index$n;
     exports.Checkbox = Checkbox;
     exports.CircleProgress = CircleProgress;
-    exports.Collapse = index$l;
+    exports.Collapse = index$m;
     exports.ContextProvider = ContextProvider;
     exports.CountDown = CountDown;
-    exports.DatePicker = index$k;
-    exports.Dialog = index$j;
+    exports.DatePicker = index$l;
+    exports.Dialog = index$k;
     exports.Divider = Divider;
     exports.Dropdown = Dropdown$1;
     exports.DropdownMenu = DropdownMenu;
     exports.Ellipsis = Ellipsis;
-    exports.Form = index$h;
+    exports.Form = index$i;
     exports.Grid = Grid;
     exports.Image = BaseImage;
-    exports.ImagePicker = index$g;
-    exports.ImagePreview = index$f;
-    exports.IndexBar = index$e;
-    exports.Input = index$d;
+    exports.ImagePicker = index$h;
+    exports.ImagePreview = index$g;
+    exports.IndexBar = index$f;
+    exports.Input = index$e;
     exports.Keyboard = Keyboard;
     exports.LoadMore = LoadMore;
     exports.Loading = Loading;
     exports.Masking = Masking$1;
     exports.NavBar = NavBar;
     exports.NoticeBar = NoticeBar;
-    exports.Notify = index$c;
+    exports.Notify = index$d;
     exports.Pagination = Pagination;
     exports.Picker = Picker$1;
     exports.PickerView = PickerView$1;
-    exports.Popover = index$b;
+    exports.Popover = index$c;
     exports.Popup = Popup$1;
-    exports.PopupSwiper = index$a;
+    exports.PopupSwiper = index$b;
     exports.Portal = Portal;
     exports.Progress = Progress;
     exports.PullRefresh = PullRefresh;
-    exports.Radio = index$9;
-    exports.Rate = index$8;
+    exports.Radio = index$a;
+    exports.Rate = index$9;
     exports.SearchBar = SearchBar;
     exports.ShowMonitor = ShowMonitor;
-    exports.Skeleton = index$7;
-    exports.Slider = index$6;
-    exports.Stepper = index$5;
-    exports.Steps = index$p;
+    exports.Skeleton = index$8;
+    exports.Slider = index$7;
+    exports.Stepper = index$6;
+    exports.Steps = index$q;
     exports.Sticky = Sticky;
     exports.SwipeAction = SwipeAction;
     exports.SwipeLoad = SwipeLoad;
-    exports.Switch = index$4;
-    exports.TabBar = index$3;
+    exports.Switch = index$5;
+    exports.TabBar = index$4;
     exports.Tabs = Tabs;
-    exports.Tag = index$2;
-    exports.Textarea = index$1;
-    exports.Toast = index;
+    exports.Tag = index$3;
+    exports.Textarea = index$2;
+    exports.Toast = index$1;
     exports.Transition = Transition;
+    exports.Uploader = index;
 
     Object.defineProperty(exports, '__esModule', { value: true });