@douyinfe/semi-ui 2.39.3 → 2.40.0-beta.0

package/dist/umd/semi-ui.js

@@ -19823,10 +19823,35 @@ var portal = __webpack_require__("P1SV");
 
 const defaultGetContainer = () => document.body;
 class Portal extends external_root_React_commonjs2_react_commonjs_react_amd_react_.PureComponent {
-  constructor(props) {
+  constructor(props, context) {
     var _this;
     super(props);
     _this = this;
+    this.initContainer = function (context) {
+      let catchError = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+      var _a, _b;
+      let container = undefined;
+      if (!_this.el) {
+        _this.el = document.createElement('div');
+      }
+      if (!((_a = _this.state) === null || _a === void 0 ? void 0 : _a.container)) {
+        try {
+          _this.el = document.createElement('div');
+          const getContainer = _this.props.getPopupContainer || context.getPopupContainer || defaultGetContainer;
+          const portalContainer = getContainer();
+          portalContainer.appendChild(_this.el);
+          _this.addStyle(_this.props.style);
+          _this.addClass(_this.props.prefixCls, context, _this.props.className);
+          container = portalContainer;
+          return container;
+        } catch (e) {
+          if (!catchError) {
+            throw e;
+          }
+        }
+      }
+      return (_b = _this.state) === null || _b === void 0 ? void 0 : _b.container;
+    };
     this.addStyle = function () {
       let style = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
       if (_this.el) {
@@ -19836,11 +19861,12 @@ class Portal extends external_root_React_commonjs2_react_commonjs_react_amd_reac
       }
     };
     this.addClass = function (prefixCls) {
+      let context = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _this.context;
       const {
         direction
-      } = _this.context;
-      for (var _len = arguments.length, classNames = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-        classNames[_key - 1] = arguments[_key];
+      } = context;
+      for (var _len = arguments.length, classNames = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+        classNames[_key - 2] = arguments[_key];
       }
       const cls = classnames_default()(prefixCls, ...classNames, {
         [`${prefixCls}-rtl`]: direction === 'rtl'
@@ -19849,32 +19875,13 @@ class Portal extends external_root_React_commonjs2_react_commonjs_react_amd_reac
         _this.el.className = cls;
       }
     };
-    try {
-      this.el = document.createElement('div');
-    } catch (e) {}
     this.state = {
-      container: undefined
+      container: this.initContainer(context, true)
     };
   }
   componentDidMount() {
-    if (!this.el) {
-      this.el = document.createElement('div');
-    }
-    const {
-      state,
-      props,
-      context
-    } = this;
-    const getContainer = props.getPopupContainer || context.getPopupContainer || defaultGetContainer;
-    const container = getContainer();
-    if (container !== state.container) {
-      // const computedStyle = window.getComputedStyle(container);
-      // if (computedStyle.position !== 'relative') {
-      //    container.style.position = 'relative';
-      // }
-      container.appendChild(this.el);
-      this.addStyle(props.style);
-      this.addClass(props.prefixCls, props.className);
+    const container = this.initContainer(this.context);
+    if (container !== this.state.container) {
       this.setState({
         container
       });
@@ -82508,6 +82515,8 @@ const parseToDate = function (input) {
     });
     // console.log(curDate, formatToken);
     return curDate;
+  } else if (typeof input === 'undefined') {
+    return undefined;
   }
   return new Date();
 };
@@ -82770,13 +82779,13 @@ class TimePickerFoundation extends foundation {
       if (this.isValidTimeZone(timeZone)) {
         dates = dates.map(date => utcToZonedTime(this.isValidTimeZone(__prevTimeZone) ? zonedTimeToUtc(date, __prevTimeZone) : date, timeZone));
       }
-      const inputValue = this.formatValue(dates);
-      this.setState({
-        value: dates,
-        invalid,
-        inputValue
-      });
     }
+    const inputValue = this.formatValue(dates);
+    this.setState({
+      value: dates,
+      invalid,
+      inputValue
+    });
   }
   handleFocus(e) {
     if (!this.getState('open')) {
@@ -90013,10 +90022,7 @@ class Upload extends BaseComponent {
      * manual upload by user
      */
     this.upload = () => {
-      const {
-        fileList
-      } = this.state;
-      this.foundation.startUpload(fileList);
+      this.foundation.manualUpload();
     };
     /**
      * ref method
@@ -93400,7 +93406,7 @@ class FormFoundation extends foundation {
       });
     });
   }
-  submit() {
+  submit(e) {
     const {
       values
     } = this.data;
@@ -93408,11 +93414,11 @@ class FormFoundation extends foundation {
     this.validate().then(resolveValues => {
       // if valid do submit
       const _values = this._adapter.cloneDeep(resolveValues);
-      this._adapter.notifySubmit(_values);
+      this._adapter.notifySubmit(_values, e);
     }).catch(errors => {
       const _errors = this._adapter.cloneDeep(errors);
       const _values = this._adapter.cloneDeep(values);
-      this._adapter.notifySubmitFail(_errors, _values);
+      this._adapter.notifySubmitFail(_errors, _values, e);
     });
   }
   /**
@@ -94943,11 +94949,11 @@ class Form extends BaseComponent {
   get adapter() {
     return Object.assign(Object.assign({}, super.adapter), {
       cloneDeep: cloneDeep,
-      notifySubmit: values => {
-        this.props.onSubmit(values);
+      notifySubmit: (values, e) => {
+        this.props.onSubmit(values, e);
       },
-      notifySubmitFail: (errors, values) => {
-        this.props.onSubmitFail(errors, values);
+      notifySubmitFail: (errors, values, e) => {
+        this.props.onSubmitFail(errors, values, e);
       },
       forceUpdate: callback => {
         this.forceUpdate(callback);
@@ -95018,7 +95024,7 @@ class Form extends BaseComponent {
   }
   submit(e) {
     e.preventDefault();
-    this.foundation.submit();
+    this.foundation.submit(e);
   }
   reset(e) {
     e.preventDefault();
@@ -95582,18 +95588,20 @@ class previewFooter_Footer extends BaseComponent {
         disabledZoomOut: zoom === min,
         onRatioClick: this.handleRatioClick,
         onZoomIn: this.handlePlusClick,
-        onZoomOut: this.handleMinusClick
+        onZoomOut: this.handleMinusClick,
+        menuItems: this.getMenu()
       };
       return renderPreviewMenu(props);
     };
     // According to showTooltip in props, decide whether to use Tooltip to pack a layer
     // 根据 props 中的 showTooltip 决定是否使用 Tooltip 包一层
-    this.getFinalIconElement = (element, content) => {
+    this.getFinalIconElement = (element, content, key) => {
       const {
         showTooltip
       } = this.props;
       return showTooltip ? /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(Tooltip, {
-        content: content
+        content: content,
+        key: `tooltip-${key}`
       }, element) : element;
     };
     this.getLocalTextByKey = key => /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(LocaleConsumer, {
@@ -95606,12 +95614,13 @@ class previewFooter_Footer extends BaseComponent {
         prevTip
       } = this.props;
       const icon = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(IconChevronLeft, {
+        key: "chevron-left",
         size: "large",
         className: disabledPrev ? `${footerPrefixCls}-disabled` : "",
         onClick: !disabledPrev ? onPrev : undefined
       });
       const content = prevTip !== null && prevTip !== void 0 ? prevTip : this.getLocalTextByKey("prevTip");
-      return this.getFinalIconElement(icon, content);
+      return this.getFinalIconElement(icon, content, 'chevron-left');
     };
     this.getIconChevronRight = () => {
       const {
@@ -95620,12 +95629,13 @@ class previewFooter_Footer extends BaseComponent {
         nextTip
       } = this.props;
       const icon = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(IconChevronRight, {
+        key: "chevron-right",
         size: "large",
         className: disabledNext ? `${footerPrefixCls}-disabled` : "",
         onClick: !disabledNext ? onNext : undefined
       });
       const content = nextTip !== null && nextTip !== void 0 ? nextTip : this.getLocalTextByKey("nextTip");
-      return this.getFinalIconElement(icon, content);
+      return this.getFinalIconElement(icon, content, 'chevron-right');
     };
     this.getIconMinus = () => {
       const {
@@ -95635,12 +95645,13 @@ class previewFooter_Footer extends BaseComponent {
       } = this.props;
       const disabledZoomOut = zoom === min;
       const icon = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(IconMinus, {
+        key: "minus",
         size: "large",
         onClick: !disabledZoomOut ? this.handleMinusClick : undefined,
         className: disabledZoomOut ? `${footerPrefixCls}-disabled` : ""
       });
       const content = zoomOutTip !== null && zoomOutTip !== void 0 ? zoomOutTip : this.getLocalTextByKey("zoomOutTip");
-      return this.getFinalIconElement(icon, content);
+      return this.getFinalIconElement(icon, content, 'minus');
     };
     this.getIconPlus = () => {
       const {
@@ -95650,12 +95661,13 @@ class previewFooter_Footer extends BaseComponent {
       } = this.props;
       const disabledZoomIn = zoom === max;
       const icon = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(IconPlus, {
+        key: "plus",
         size: "large",
         onClick: !disabledZoomIn ? this.handlePlusClick : undefined,
         className: disabledZoomIn ? `${footerPrefixCls}-disabled` : ""
       });
       const content = zoomInTip !== null && zoomInTip !== void 0 ? zoomInTip : this.getLocalTextByKey("zoomInTip");
-      return this.getFinalIconElement(icon, content);
+      return this.getFinalIconElement(icon, content, 'plus');
     };
     this.getIconRatio = () => {
       const {
@@ -95664,6 +95676,7 @@ class previewFooter_Footer extends BaseComponent {
         adaptiveTip
       } = this.props;
       const props = {
+        key: "ratio",
         size: "large",
         className: classnames_default()(`${footerPrefixCls}-gap`),
         onClick: this.handleRatioClick
@@ -95675,18 +95688,19 @@ class previewFooter_Footer extends BaseComponent {
       } else {
         content = adaptiveTip !== null && adaptiveTip !== void 0 ? adaptiveTip : this.getLocalTextByKey("adaptiveTip");
       }
-      return this.getFinalIconElement(icon, content);
+      return this.getFinalIconElement(icon, content, 'ratio');
     };
     this.getIconRotate = () => {
       const {
         rotateTip
       } = this.props;
       const icon = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(IconRotate, {
+        key: "rotate",
         size: "large",
         onClick: this.handleRotateLeft
       });
       const content = rotateTip !== null && rotateTip !== void 0 ? rotateTip : this.getLocalTextByKey("rotateTip");
-      return this.getFinalIconElement(icon, content);
+      return this.getFinalIconElement(icon, content, 'rotate');
     };
     this.getIconDownload = () => {
       const {
@@ -95695,6 +95709,7 @@ class previewFooter_Footer extends BaseComponent {
         disableDownload
       } = this.props;
       const icon = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(IconDownload, {
+        key: 'download',
         size: "large",
         onClick: !disableDownload ? onDownload : undefined,
         className: classnames_default()(`${footerPrefixCls}-gap`, {
@@ -95702,44 +95717,63 @@ class previewFooter_Footer extends BaseComponent {
         })
       });
       const content = downloadTip !== null && downloadTip !== void 0 ? downloadTip : this.getLocalTextByKey("downloadTip");
-      return this.getFinalIconElement(icon, content);
+      return this.getFinalIconElement(icon, content, 'download');
+    };
+    this.getNumberInfo = () => {
+      const {
+        curPage,
+        totalNum
+      } = this.props;
+      return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", {
+        className: `${footerPrefixCls}-page`,
+        key: 'info'
+      }, curPage, "/", totalNum);
+    };
+    this.getSlider = () => {
+      const {
+        zoom,
+        min,
+        max,
+        step,
+        showTooltip
+      } = this.props;
+      return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(Slider, {
+        key: 'slider',
+        value: zoom,
+        min: min,
+        max: max,
+        step: step,
+        tipFormatter: v => `${v}%`,
+        tooltipVisible: showTooltip ? undefined : false,
+        onChange: this.handleSlideChange
+      });
+    };
+    this.getMenu = () => [this.getIconChevronLeft(), this.getNumberInfo(), this.getIconChevronRight(), this.getIconMinus(), this.getSlider(), this.getIconPlus(), this.getIconRatio(), this.getIconRotate(), this.getIconDownload()];
+    this.getFooterMenu = () => {
+      const menuItems = this.getMenu();
+      menuItems.splice(3, 0, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(divider_0, {
+        layout: "vertical",
+        key: "divider-first"
+      }));
+      menuItems.splice(8, 0, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(divider_0, {
+        layout: "vertical",
+        key: "divider-second"
+      }));
+      return menuItems;
     };
     this.foundation = new PreviewFooterFoundation(this.adapter);
   }
   render() {
     const {
-      min,
-      max,
-      step,
-      curPage,
-      totalNum,
-      zoom,
-      showTooltip,
       className,
       renderPreviewMenu
     } = this.props;
-    if (renderPreviewMenu) {
-      return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", {
-        className: `${footerPrefixCls}-wrapper`
-      }, this.customRenderViewMenu());
-    }
+    const menuCls = classnames_default()(footerPrefixCls, `${footerPrefixCls}-wrapper`, className, {
+      [`${footerPrefixCls}-content`]: !Boolean(renderPreviewMenu)
+    });
     return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("section", {
-      className: classnames_default()(footerPrefixCls, `${footerPrefixCls}-wrapper`, className)
-    }, this.getIconChevronLeft(), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", {
-      className: `${footerPrefixCls}-page`
-    }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("span", null, curPage), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("span", null, "/"), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("span", null, totalNum)), this.getIconChevronRight(), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(divider_0, {
-      layout: "vertical"
-    }), this.getIconMinus(), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(Slider, {
-      value: zoom,
-      min: min,
-      max: max,
-      step: step,
-      tipFormatter: v => `${v}%`,
-      tooltipVisible: showTooltip ? undefined : false,
-      onChange: this.handleSlideChange
-    }), this.getIconPlus(), this.getIconRatio(), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(divider_0, {
-      layout: "vertical"
-    }), this.getIconRotate(), this.getIconDownload());
+      className: menuCls
+    }, renderPreviewMenu ? this.customRenderViewMenu() : this.getFooterMenu());
   }
 }
 previewFooter_Footer.propTypes = {
@@ -96499,8 +96533,9 @@ class PreviewInnerFoundation extends foundation {
         currentIndex,
         imgSrc
       } = this.getStates();
+      const setDownloadName = this._adapter.getSetDownloadFunc();
       const downloadSrc = imgSrc[currentIndex];
-      const downloadName = downloadSrc.slice(downloadSrc.lastIndexOf("/") + 1);
+      const downloadName = setDownloadName ? setDownloadName(downloadSrc) : downloadSrc.slice(downloadSrc.lastIndexOf("/") + 1);
       downloadImage(downloadSrc, downloadName);
       this._adapter.notifyDownload(downloadSrc, currentIndex);
     };
@@ -96782,6 +96817,10 @@ class PreviewInner extends BaseComponent {
       },
       setMouseActiveTime: time => {
         previewInner_mouseActiveTime = time;
+      },
+      getSetDownloadFunc: () => {
+        var _a, _b;
+        return (_b = (_a = this.context) === null || _a === void 0 ? void 0 : _a.setDownloadName) !== null && _b !== void 0 ? _b : this.props.setDownloadName;
       }
     });
   }
@@ -97316,9 +97355,10 @@ class image_Image extends BaseComponent {
         preview,
         fallback,
         placeholder,
-        imageID
+        imageID,
+        setDownloadName
       } = _b,
-      restProps = image_rest(_b, ["src", "width", "height", "alt", "style", "className", "crossOrigin", "preview", "fallback", "placeholder", "imageID"]);
+      restProps = image_rest(_b, ["src", "width", "height", "alt", "style", "className", "crossOrigin", "preview", "fallback", "placeholder", "imageID", "setDownloadName"]);
     const outerStyle = Object.assign({
       width,
       height
@@ -97351,7 +97391,8 @@ class image_Image extends BaseComponent {
       src: previewSrc,
       visible: previewVisible,
       onVisibleChange: this.handlePreviewVisibleChange,
-      crossOrigin: !isUndefined_default()(crossOrigin) ? crossOrigin : previewProps === null || previewProps === void 0 ? void 0 : previewProps.crossOrigin
+      crossOrigin: !isUndefined_default()(crossOrigin) ? crossOrigin : previewProps === null || previewProps === void 0 ? void 0 : previewProps.crossOrigin,
+      setDownloadName: setDownloadName
     })));
   }
 }
@@ -97557,9 +97598,10 @@ class Preview extends BaseComponent {
         src,
         className,
         style,
-        lazyLoad
+        lazyLoad,
+        setDownloadName
       } = _a,
-      restProps = preview_rest(_a, ["src", "className", "style", "lazyLoad"]);
+      restProps = preview_rest(_a, ["src", "className", "style", "lazyLoad", "setDownloadName"]);
     const {
       currentIndex,
       visible
@@ -97581,7 +97623,8 @@ class Preview extends BaseComponent {
         lazyLoad,
         previewObserver: this.previewObserver,
         setCurrentIndex: this.handleCurrentIndexChange,
-        handleVisibleChange: this.handleVisibleChange
+        handleVisibleChange: this.handleVisibleChange,
+        setDownloadName: setDownloadName
       }
     }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", {
       id: this.previewGroupId,