@nutui/nutui-react 2.0.10 → 2.0.11-beta.0

package/CHANGELOG.md

@@ -1,3 +1,18 @@
+# v2.0.11
+`2023-08-09`
+
+* :sparkles: feat: 新增 tour 引导组件 (#1279) @junjun666
+* :bug: fix: h5下多选上传时 uid 重复的问题 (#1269) @Liuqh233
+* :bug: fix: input 组件点击清除图标无法清空内容 (#1292) @oasis-cloud
+* :bug: fix: numberkeyboard 设置标题后，完成按钮应该触发 onConfirm 事件 (#1285) @oasis-cloud
+* :bug: fix: uploader h5/taro 增加校验 (#1297) @junjun666
+* :bug: fix: uploader taro-h5 上传状态样式错乱 (#1293) @junjun666
+* 📖 docs: divider 组件的 styles 属性示例改为 style (#1290) @oasis-cloud
+* 📖 docs: numberkeyboard 的 type 属性类型更新 (#1284) @oasis-cloud
+* 📖 docs: step 组件的 description 属性示例改为节点的实现方式 (#1289) @oasis-cloud
+* 📖 docs: 调整 image tao 文档中引入包名 (#1295) @oasis-cloud
+
+
 # v2.0.10
 `2023-08-04`
 

package/dist/esm/Input.js

@@ -132,7 +132,9 @@ var Input = forwardRef(function(props, ref) {
   var handleBlur = function handleBlur2(event) {
     var val = event.target.value;
     updateValue(val, "onBlur");
-    setActive(false);
+    setTimeout(function() {
+      setActive(false);
+    }, 200);
   };
   var inputType = function inputType2(type2) {
     if (type2 === "digit") {

package/dist/esm/NumberKeyboard.js

@@ -159,7 +159,7 @@ var NumberKeyboard = function NumberKeyboard2(props) {
     className: "".concat(classPrefix, "__header__title")
   }, title), type === "default" && React__default.createElement("span", {
     className: "".concat(classPrefix, "__header__close"),
-    onClick: onClose2
+    onClick: onConfirm
   }, locale.done)), React__default.createElement("div", {
     className: "".concat(classPrefix, "__body")
   }, React__default.createElement("div", {

package/dist/esm/Popover.js

@@ -1,7 +1,7 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _excluded = ["children", "list", "location", "visible", "offset", "targetId", "overlay", "closeOnOutsideClick", "closeOnActionClick", "className", "showArrow", "style", "onClick", "onOpen", "onClose", "onSelect"];
+var _excluded = ["children", "list", "location", "visible", "offset", "arrowOffset", "targetId", "overlay", "closeOnOutsideClick", "closeOnActionClick", "className", "showArrow", "style", "onClick", "onOpen", "onClose", "onSelect"];
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
   if (Object.getOwnPropertySymbols) {
@@ -35,6 +35,7 @@ var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   location: "bottom",
   visible: false,
   offset: [0, 12],
+  arrowOffset: 0,
   targetId: "",
   showArrow: true,
   closeOnOutsideClick: true,
@@ -49,7 +50,7 @@ var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
 });
 var classPrefix = "nut-popover";
 var Popover = function Popover2(props) {
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, list = _defaultProps$props.list, location = _defaultProps$props.location, visible = _defaultProps$props.visible, offset = _defaultProps$props.offset, targetId = _defaultProps$props.targetId, overlay = _defaultProps$props.overlay, closeOnOutsideClick = _defaultProps$props.closeOnOutsideClick, closeOnActionClick = _defaultProps$props.closeOnActionClick, className = _defaultProps$props.className, showArrow = _defaultProps$props.showArrow, style = _defaultProps$props.style, onClick2 = _defaultProps$props.onClick, onOpen2 = _defaultProps$props.onOpen, onClose2 = _defaultProps$props.onClose, onSelect = _defaultProps$props.onSelect, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, list = _defaultProps$props.list, location = _defaultProps$props.location, visible = _defaultProps$props.visible, offset = _defaultProps$props.offset, arrowOffset = _defaultProps$props.arrowOffset, targetId = _defaultProps$props.targetId, overlay = _defaultProps$props.overlay, closeOnOutsideClick = _defaultProps$props.closeOnOutsideClick, closeOnActionClick = _defaultProps$props.closeOnActionClick, className = _defaultProps$props.className, showArrow = _defaultProps$props.showArrow, style = _defaultProps$props.style, onClick2 = _defaultProps$props.onClick, onOpen2 = _defaultProps$props.onOpen, onClose2 = _defaultProps$props.onClose, onSelect = _defaultProps$props.onSelect, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
   var popoverRef = useRef(null);
   var popoverContentRef = useRef(null);
   var _useState = useState(false), _useState2 = _slicedToArray(_useState, 2), showPopup = _useState2[0], setShowPopup = _useState2[1];
@@ -153,6 +154,37 @@ var Popover = function Popover2(props) {
     }
     return styles;
   };
+  var popoverArrowStyle = function popoverArrowStyle2() {
+    var styles = {};
+    var direction = location.split("-")[0];
+    var skew = location.split("-")[1];
+    var base = 16;
+    if (props.arrowOffset !== 0) {
+      if (["bottom", "top"].includes(direction)) {
+        if (!skew) {
+          styles.left = "calc(50% + ".concat(arrowOffset, "px)");
+        }
+        if (skew === "start") {
+          styles.left = "".concat(base + arrowOffset, "px");
+        }
+        if (skew === "end") {
+          styles.right = "".concat(base - arrowOffset, "px");
+        }
+      }
+      if (["left", "right"].includes(direction)) {
+        if (!skew) {
+          styles.top = "calc(50% - ".concat(arrowOffset, "px)");
+        }
+        if (skew === "start") {
+          styles.top = "".concat(base - arrowOffset, "px");
+        }
+        if (skew === "end") {
+          styles.bottom = "".concat(base + arrowOffset, "px");
+        }
+      }
+    }
+    return styles;
+  };
   var handleSelect = function handleSelect2(item, index) {
     if (!item.disabled) {
       onSelect && onSelect(item, index);
@@ -186,7 +218,8 @@ var Popover = function Popover2(props) {
     className: "nut-popover-content-group",
     ref: popoverContentRef
   }, showArrow && React__default.createElement("div", {
-    className: popoverArrow()
+    className: popoverArrow(),
+    style: popoverArrowStyle()
   }), Array.isArray(children) ? children[1] : "", list.map(function(item, index) {
     return React__default.createElement("div", {
       className: classNames({

package/dist/esm/Switch.js

@@ -1,5 +1,7 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["checked", "defaultChecked", "disabled", "activeText", "inactiveText", "className", "style", "onChange"];
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
   if (Object.getOwnPropertySymbols) {
@@ -30,7 +32,7 @@ var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   inactiveText: ""
 });
 var Switch = function Switch2(props) {
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), checked = _defaultProps$props.checked, defaultChecked = _defaultProps$props.defaultChecked, disabled = _defaultProps$props.disabled, activeText = _defaultProps$props.activeText, inactiveText = _defaultProps$props.inactiveText, className = _defaultProps$props.className, style = _defaultProps$props.style, onChange = _defaultProps$props.onChange;
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), checked = _defaultProps$props.checked, defaultChecked = _defaultProps$props.defaultChecked, disabled = _defaultProps$props.disabled, activeText = _defaultProps$props.activeText, inactiveText = _defaultProps$props.inactiveText, className = _defaultProps$props.className, style = _defaultProps$props.style, onChange = _defaultProps$props.onChange, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
   var classPrefix = "nut-switch";
   var _usePropsValue = usePropsValue({
     value: checked,
@@ -45,13 +47,13 @@ var Switch = function Switch2(props) {
     onChange && onChange(!value, event);
     setValue(!value);
   };
-  return React__default.createElement("div", {
+  return React__default.createElement("div", _objectSpread({
     className: classes(),
     onClick: function onClick(e) {
       return _onClick(e);
     },
     style
-  }, React__default.createElement("div", {
+  }, rest), React__default.createElement("div", {
     className: "switch-button"
   }, !value && React__default.createElement("div", {
     className: "close-line"

package/dist/esm/Tour/style/css.js

@@ -0,0 +1 @@
+import './style.css'

package/dist/esm/Tour/style/index.js

@@ -0,0 +1,2 @@
+
+import '../../../packages/tour/tour.scss'

package/dist/esm/Tour/style/style.css

@@ -0,0 +1 @@
+.nut-tour-mask{position:fixed;box-shadow:0 0 0 150vh #00000080;border-radius:var(--nutui-tour-mask-border-radius, 10px);z-index:999}.nut-tour-mask-none{box-shadow:none}.nut-tour-mask-hidden{opacity:0}.nut-tour-content{display:block;padding:var(--nutui-tour-content-padding, 10px 12px);min-width:var(--nutui-tour-content-min-width, 200px);box-sizing:content-box}.nut-tour-content-top{display:block;text-align:right}.nut-tour-content-top-close{--nut-icon-width: 10px;--nut-icon-height: 10px}.nut-tour-content-inner{margin:var(--nutui-tour-content-inner-margin, 10px 0px);font-size:var(--nutui-tour-content-inner-font-size, 14px);white-space:nowrap}.nut-tour-content-bottom{margin-top:var(--nutui-tour-content-bottom-margin-top, 10px);display:flex;justify-content:space-between}.nut-tour-content-bottom-operate{display:flex;justify-content:flex-end}.nut-tour-content-bottom-operate-btn{display:inline-block;border:1px solid var(--nutui-gray-3, #bfbfbf);margin-left:var(--nutui-tour-content-bottom-btn-margin-left, 4px);padding:var(--nutui-tour-content-bottom-btn-padding, 2px 4px);font-size:var(--nutui-tour-content-bottom-btn-font-size, 12px);border-radius:var(--nutui-tour-content-bottom-btn-border-radius, 4px);color:var(--nutui-gray-2, #757575)}.nut-tour-content-bottom-operate-btn.active{color:#fff;border:0;background:var(--nutui-brand-color, #fa2c19)}.nut-tour-content-tile .nut-tour-content-inner{margin:0}.nut-tour-masked{position:fixed;width:100vh;height:100vh;z-index:1000;top:0;left:0;background:transparent}

package/dist/esm/Tour.js

@@ -0,0 +1,183 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["children", "className", "title", "closeOnOverlayClick", "showPrev", "list", "type", "location", "visible", "mask", "maskWidth", "maskHeight", "offset", "next", "prev", "complete", "onClose", "onChange"];
+function ownKeys(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 _objectSpread(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = null != arguments[i] ? arguments[i] : {};
+    i % 2 ? ownKeys(Object(source), true).forEach(function(key) {
+      _defineProperty(target, key, source[key]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
+      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+    });
+  }
+  return target;
+}
+import React__default, { useState, useEffect } from "react";
+import { Close } from "@nutui/icons-react";
+import classNames from "classnames";
+import Popover from "./Popover.js";
+import { g as getRect } from "./use-client-rect.js";
+import { C as ComponentDefaults } from "./typings.js";
+import { useConfig } from "./ConfigProvider.js";
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
+  visible: false,
+  type: "step",
+  location: "bottom",
+  mask: true,
+  maskWidth: "",
+  maskHeight: "",
+  offset: [8, 10],
+  title: "",
+  next: "",
+  prev: "",
+  complete: "",
+  showPrev: true,
+  closeOnOverlayClick: true
+});
+var classPrefix = "nut-tour";
+var Tour = function Tour2(props) {
+  var _useConfig = useConfig(), locale = _useConfig.locale;
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, className = _defaultProps$props.className, title = _defaultProps$props.title, closeOnOverlayClick = _defaultProps$props.closeOnOverlayClick, showPrev = _defaultProps$props.showPrev, list = _defaultProps$props.list, type = _defaultProps$props.type, location = _defaultProps$props.location, visible = _defaultProps$props.visible, mask = _defaultProps$props.mask, maskWidth = _defaultProps$props.maskWidth, maskHeight = _defaultProps$props.maskHeight, offset = _defaultProps$props.offset, next = _defaultProps$props.next, prev = _defaultProps$props.prev, complete = _defaultProps$props.complete, onClose = _defaultProps$props.onClose, onChange = _defaultProps$props.onChange, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var _useState = useState(false), _useState2 = _slicedToArray(_useState, 2), showTour = _useState2[0], setShowTour = _useState2[1];
+  var _useState3 = useState(false), _useState4 = _slicedToArray(_useState3, 2), showPopup = _useState4[0], setShowPopup = _useState4[1];
+  var _useState5 = useState(0), _useState6 = _slicedToArray(_useState5, 2), active = _useState6[0], setActive = _useState6[1];
+  var _useState7 = useState({
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+    width: 0,
+    height: 0
+  }), _useState8 = _slicedToArray(_useState7, 2), maskRect = _useState8[0], setMaskRect = _useState8[1];
+  var classes = classNames(className, classPrefix);
+  useEffect(function() {
+    if (visible) {
+      getRootPosition();
+    }
+    setActive(0);
+    setShowTour(visible);
+    setShowPopup(visible);
+  }, [visible]);
+  useEffect(function() {
+    if (visible) {
+      setShowPopup(true);
+      getRootPosition();
+    }
+  }, [active]);
+  var getRootPosition = function getRootPosition2() {
+    var el = document.querySelector("#".concat(list[active].target));
+    var rect = getRect(el);
+    setMaskRect(rect);
+  };
+  var maskStyle = function maskStyle2() {
+    var width = maskRect.width, height = maskRect.height, left = maskRect.left, top = maskRect.top;
+    var center = [left + width / 2, top + height / 2];
+    var w = Number(maskWidth || width);
+    var h = Number(maskHeight || height);
+    var styles = {
+      width: "".concat(w + +offset[1] * 2, "px"),
+      height: "".concat(h + +offset[0] * 2, "px"),
+      top: "".concat(center[1] - h / 2 - +offset[0], "px"),
+      left: "".concat(center[0] - w / 2 - +offset[1], "px")
+    };
+    return styles;
+  };
+  var maskClose = function maskClose2(e) {
+    setShowTour(false);
+    setShowPopup(false);
+    onClose && onClose(e);
+  };
+  var handleClickMask = function handleClickMask2(e) {
+    closeOnOverlayClick && maskClose(e);
+  };
+  var changeStep = function changeStep2(type2) {
+    if (type2 === "next") {
+      setActive(active + 1);
+      onChange && onChange(active + 1);
+    } else {
+      setActive(active - 1);
+      onChange && onChange(active - 1);
+    }
+    setShowPopup(false);
+  };
+  return React__default.createElement("div", _objectSpread({
+    className: classes
+  }, rest), React__default.createElement("div", {
+    className: "nut-tour-masked",
+    style: {
+      display: showTour ? "block" : "none"
+    },
+    onClick: handleClickMask
+  }), list.map(function(item, index) {
+    return React__default.createElement("div", {
+      key: index,
+      style: {
+        height: 0
+      }
+    }, index === active && React__default.createElement(React__default.Fragment, null, showTour && React__default.createElement("div", {
+      className: "".concat(mask ? "nut-tour-mask" : "nut-tour-mask nut-tour-mask-none"),
+      id: "nut-tour-popid",
+      style: maskStyle()
+    }), React__default.createElement(Popover, {
+      visible: showPopup,
+      location: item.location || location,
+      targetId: "nut-tour-popid",
+      closeOnOutsideClick: false,
+      offset: item.popoverOffset || [0, 12],
+      arrowOffset: item.arrowOffset || 0
+    }, React__default.createElement(React__default.Fragment, null), React__default.createElement(React__default.Fragment, null, children || React__default.createElement(React__default.Fragment, null, type === "step" && React__default.createElement("div", {
+      className: "nut-tour-content"
+    }, title && React__default.createElement("div", {
+      className: "nut-tour-content-top"
+    }, React__default.createElement("div", {
+      onClick: function onClick(e) {
+        return maskClose(e);
+      }
+    }, React__default.createElement(Close, {
+      className: "nut-tour-content-top-close"
+    }))), React__default.createElement("div", {
+      className: "nut-tour-content-inner"
+    }, item.content), React__default.createElement("div", {
+      className: "nut-tour-content-bottom"
+    }, React__default.createElement("div", {
+      className: "nut-tour-content-bottom-init"
+    }, active + 1, "/", list.length), React__default.createElement("div", {
+      className: "nut-tour-content-bottom-operate"
+    }, active !== 0 && showPrev && React__default.createElement("div", {
+      className: "nut-tour-content-bottom-operate-btn",
+      onClick: function onClick() {
+        return changeStep("prev");
+      }
+    }, prev || locale.tour.prevStepText), list.length - 1 === active && React__default.createElement("div", {
+      className: "nut-tour-content-bottom-operate-btn active",
+      onClick: function onClick(e) {
+        return maskClose(e);
+      }
+    }, complete || locale.tour.completeText), list.length - 1 !== active && React__default.createElement("div", {
+      className: "nut-tour-content-bottom-operate-btn active",
+      onClick: function onClick() {
+        return changeStep("next");
+      }
+    }, next || locale.tour.nextStepText)))), type === "tile" && React__default.createElement("div", {
+      className: "nut-tour-content nut-tour-content-tile"
+    }, React__default.createElement("div", {
+      className: "nut-tour-content-inner"
+    }, item.content)))))));
+  }));
+};
+Tour.defaultProps = defaultProps;
+Tour.displayName = "NutTour";
+export {
+  Tour as default
+};

package/dist/esm/Uploader/style/style.css

@@ -1 +1 @@
-.nut-progress{display:flex;align-items:center;position:relative;width:100%}.nut-progress-outer{flex:auto;border-radius:var(--nutui-progress-border-radius, 12px);height:var(--nutui-progress-height, 10px);background:var(--nutui-progress-background, #f3f3f3)}.nut-progress-outer .nut-progress-active:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:var(--nutui-progress-border-radius, 12px);animation:progressActive 2s ease-in-out infinite}.nut-progress-inner{height:100%;display:flex;flex-direction:column;justify-content:center;transition:all .4s;border-radius:var(--nutui-progress-border-radius, 12px);background:var(--nutui-progress-color, linear-gradient(135deg, #fa2c19 0%, #fa6419 100%))}.nut-progress-text{display:flex;align-items:center;position:absolute;top:var(--nutui-progress-text-position-top, -4px);bottom:var(--nutui-progress-text-position-bottom, -4px);transition:all .4s;transform:translate(-50%)}.nut-progress-text__inner{display:flex;align-items:center;height:100%;width:100%;color:var(--nutui-progress-text-color, var(--nutui-brand-text-color, #ffffff));padding:var(--nutui-progress-text-padding, 0 5px);border-radius:var(--nutui-progress-text-border-radius, 5px);font-size:var(--nutui-progress-text-font-size, 9px);line-height:1;background:var(--nutui-progress-text-background, var(--nutui-progress-color, linear-gradient(135deg, #fa2c19 0%, #fa6419 100%)))}@keyframes progressActive{0%{background:rgba(255,255,255,.1);width:0}20%{background:rgba(255,255,255,.5);width:0}to{background:rgba(255,255,255,0);width:100%}}.nut-uploader{position:relative;display:flex;flex-wrap:wrap}.nut-uploader__slot{position:relative}.nut-uploader__upload{position:relative;display:flex;align-items:center;justify-content:center;background:var(--nutui-uploader-background, var(--nutui-gray-4, #f4f4f4));width:var(--nutui-uploader-picture-width, 100px);height:var(--nutui-uploader-picture-height, 100px);border:var(--nutui-uploader-picture-border, 0px);border-radius:var(--nutui-uploader-picture-border-radius, 2px)}.nut-uploader__icon{display:flex;flex-direction:column;justify-content:center;align-items:center}.nut-uploader__icon i{opacity:var(--nutui-uploader-picture-icon-opacity, .7);margin-bottom:var(--nutui-uploader-picture-icon-margin-bottom, 6px)}.nut-uploader__icon-tip{font-size:var(--nutui-uploader-picture-icon-tip-font-size, 12px);color:var(--nutui-uploader-picture-icon-tip-color, #bfbfbf)}.nut-uploader__input{position:absolute!important;top:0;left:0;width:100%!important;height:100%!important;overflow:hidden;cursor:pointer!important;opacity:0}.nut-uploader__input:disabled{cursor:not-allowed}.nut-uploader__upload-disabled{background:var(--nutui-uploader-background-disabled, var(--nutui-gray-4, #f4f4f4))}.nut-uploader__upload-disabled .nut-uploader__icon i{opacity:var(--nutui-uploader-picture-icon-opacity-disabled, .3);margin-bottom:var(--nutui-uploader-picture-icon-margin-bottom, 6px)}.nut-uploader__preview{position:relative;margin-right:var(--nutui-uploader-preview-margin-right, 10px);margin-bottom:var(--nutui-uploader-preview-margin-bottom, 10px);box-shadow:0 2px 10px #0000001a}.nut-uploader__preview__progress{position:absolute;left:0;top:0;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;background:var(--nutui-uploader-preview-progress-background, rgba(0, 0, 0, .65));border-radius:var(--nutui-uploader-picture-border-radius, 2px)}.nut-uploader__preview__progress i{margin-bottom:var(--nutui-uploader-picture-icon-margin-bottom, 6px)}.nut-uploader__preview__progress__msg{color:#fff;font-size:12px}.nut-uploader__preview.list{width:100%;margin-right:0;margin-bottom:0;margin-top:10px}.nut-uploader__preview-list{width:100%;height:32px;display:flex;flex-direction:column;position:relative;background-color:var(--nutui-gray-5, #f8f8f8)}.nut-uploader__preview-list .nut-uploader__preview-img__file__name{-webkit-line-clamp:1;padding:2px;height:24px}.nut-uploader__preview-list .nut-uploader__preview-img__file__del{position:absolute;right:4px;top:6px}.nut-uploader__preview-list .nut-progress{position:absolute;left:0;right:0;bottom:0}.nut-uploader__preview-list .nut-progress .nut-progress-outer{height:2px!important}.nut-uploader__preview .close{position:absolute;right:var(--nutui-uploader-preview-close-right, 0px);top:var(--nutui-uploader-preview-close-top, 0px);transform:translate(50%,-50%)}.nut-uploader__preview-img{position:relative;width:var(--nutui-uploader-picture-width, 100px);height:var(--nutui-uploader-picture-height, 100px);border-radius:var(--nutui-uploader-picture-border-radius, 2px)}.nut-uploader__preview-img i{color:var(--nutui-gray-1, #1a1a1a)}.nut-uploader__preview-img .tips{position:absolute;bottom:0;left:0;font-size:12px;color:var(--nutui-gray-6, #ffffff);text-align:center;box-sizing:border-box;height:var(--nutui-uploader-preview-tips-height, 24px);line-height:var(--nutui-uploader-preview-tips-height, 24px);border-radius:var(--nutui-uploader-picture-border-radius, 2px);border-top-left-radius:0;border-top-right-radius:0;padding:var(--nutui-uploader-preview-tips-padding, 0 5px);background:var(--nutui-uploader-preview-tips-background, rgba(0, 0, 0, .45));width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nut-uploader__preview-img__c{width:100%;height:100%;border-radius:6px}.nut-uploader__preview-img__file{height:100%;width:100%;display:flex;align-items:center;justify-content:center;transition:all .3s}.nut-uploader__preview-img__file__name{display:flex;width:100%;font-size:12px;color:var(--nutui-gray-2, #757575);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;word-break:break-all}.nut-uploader__preview-img__file__name.error{color:red!important}.nut-uploader__preview-img__file__name.success{color:#1890ff!important}.nut-uploader__preview-img__file__name .nut-icon-link:before{margin-left:-25%;margin-top:-25%;transform:none}
+.nut-progress{display:flex;align-items:center;position:relative;width:100%}.nut-progress-outer{flex:auto;border-radius:var(--nutui-progress-border-radius, 12px);height:var(--nutui-progress-height, 10px);background:var(--nutui-progress-background, #f3f3f3)}.nut-progress-outer .nut-progress-active:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:var(--nutui-progress-border-radius, 12px);animation:progressActive 2s ease-in-out infinite}.nut-progress-inner{height:100%;display:flex;flex-direction:column;justify-content:center;transition:all .4s;border-radius:var(--nutui-progress-border-radius, 12px);background:var(--nutui-progress-color, linear-gradient(135deg, #fa2c19 0%, #fa6419 100%))}.nut-progress-text{display:flex;align-items:center;position:absolute;top:var(--nutui-progress-text-position-top, -4px);bottom:var(--nutui-progress-text-position-bottom, -4px);transition:all .4s;transform:translate(-50%)}.nut-progress-text__inner{display:flex;align-items:center;height:100%;width:100%;color:var(--nutui-progress-text-color, var(--nutui-brand-text-color, #ffffff));padding:var(--nutui-progress-text-padding, 0 5px);border-radius:var(--nutui-progress-text-border-radius, 5px);font-size:var(--nutui-progress-text-font-size, 9px);line-height:1;background:var(--nutui-progress-text-background, var(--nutui-progress-color, linear-gradient(135deg, #fa2c19 0%, #fa6419 100%)))}@keyframes progressActive{0%{background:rgba(255,255,255,.1);width:0}20%{background:rgba(255,255,255,.5);width:0}to{background:rgba(255,255,255,0);width:100%}}.nut-uploader{position:relative;display:flex;flex-wrap:wrap}.nut-uploader__slot{position:relative}.nut-uploader__upload{position:relative;display:flex;align-items:center;justify-content:center;background:var(--nutui-uploader-background, var(--nutui-gray-4, #f4f4f4));width:var(--nutui-uploader-picture-width, 100px);height:var(--nutui-uploader-picture-height, 100px);border:var(--nutui-uploader-picture-border, 0px);border-radius:var(--nutui-uploader-picture-border-radius, 2px)}.nut-uploader__icon{display:flex;flex-direction:column;justify-content:center;align-items:center}.nut-uploader__icon i{opacity:var(--nutui-uploader-picture-icon-opacity, .7);margin-bottom:var(--nutui-uploader-picture-icon-margin-bottom, 6px)}.nut-uploader__icon-tip{font-size:var(--nutui-uploader-picture-icon-tip-font-size, 12px);color:var(--nutui-uploader-picture-icon-tip-color, #bfbfbf)}.nut-uploader__input{position:absolute!important;top:0;left:0;width:100%!important;height:100%!important;overflow:hidden;cursor:pointer!important;opacity:0}.nut-uploader__input:disabled{cursor:not-allowed}.nut-uploader__upload-disabled{background:var(--nutui-uploader-background-disabled, var(--nutui-gray-4, #f4f4f4))}.nut-uploader__upload-disabled .nut-uploader__icon i{opacity:var(--nutui-uploader-picture-icon-opacity-disabled, .3);margin-bottom:var(--nutui-uploader-picture-icon-margin-bottom, 6px)}.nut-uploader__preview{position:relative;margin-right:var(--nutui-uploader-preview-margin-right, 10px);margin-bottom:var(--nutui-uploader-preview-margin-bottom, 10px);box-shadow:0 2px 10px #0000001a}.nut-uploader__preview__progress{position:absolute;left:0;top:0;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;background:var(--nutui-uploader-preview-progress-background, rgba(0, 0, 0, .65));border-radius:var(--nutui-uploader-picture-border-radius, 2px)}.nut-uploader__preview__progress i{margin-bottom:var(--nutui-uploader-picture-icon-margin-bottom, 6px)}.nut-uploader__preview__progress__msg{color:#fff;font-size:12px}.nut-uploader__preview.list{width:100%;margin-right:0;margin-bottom:0;margin-top:10px}.nut-uploader__preview-list{width:100%;height:32px;display:flex;flex-direction:column;position:relative;background-color:var(--nutui-gray-5, #f8f8f8)}.nut-uploader__preview-list .nut-uploader__preview-img__file__name{-webkit-line-clamp:1;padding:2px;height:24px}.nut-uploader__preview-list .nut-uploader__preview-img__file__del{position:absolute;right:4px;top:6px}.nut-uploader__preview-list .nut-progress{position:absolute;left:0;right:0;bottom:0}.nut-uploader__preview-list .nut-progress .nut-progress-outer{height:2px!important}.nut-uploader__preview .close{position:absolute;right:var(--nutui-uploader-preview-close-right, 0px);top:var(--nutui-uploader-preview-close-top, 0px);transform:translate(50%,-50%)}.nut-uploader__preview-img{position:relative;width:var(--nutui-uploader-picture-width, 100px);height:var(--nutui-uploader-picture-height, 100px);border-radius:var(--nutui-uploader-picture-border-radius, 2px)}.nut-uploader__preview-img i{color:var(--nutui-gray-1, #1a1a1a)}.nut-uploader__preview-img .tips{position:absolute;bottom:0;left:0;font-size:12px;color:var(--nutui-gray-6, #ffffff);text-align:center;box-sizing:border-box;height:var(--nutui-uploader-preview-tips-height, 24px);line-height:var(--nutui-uploader-preview-tips-height, 24px);border-radius:var(--nutui-uploader-picture-border-radius, 2px);border-top-left-radius:0;border-top-right-radius:0;padding:var(--nutui-uploader-preview-tips-padding, 0 5px);background:var(--nutui-uploader-preview-tips-background, rgba(0, 0, 0, .45));width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nut-uploader__preview-img__c{width:100%;height:100%;position:initial;border-radius:6px}.nut-uploader__preview-img__file{height:100%;width:100%;display:flex;align-items:center;justify-content:center;transition:all .3s}.nut-uploader__preview-img__file__name{display:flex;width:100%;font-size:12px;color:var(--nutui-gray-2, #757575);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;word-break:break-all}.nut-uploader__preview-img__file__name.error{color:red!important}.nut-uploader__preview-img__file__name.success{color:#1890ff!important}.nut-uploader__preview-img__file__name .nut-icon-link:before{margin-left:-25%;margin-top:-25%;transform:none}

package/dist/esm/Uploader.js

@@ -410,7 +410,7 @@ var InternalUploader = function InternalUploader2(props, ref) {
     disabled,
     multiple,
     onChange: fileChange
-  })))), fileList.length !== 0 && fileList.map(function(item, index) {
+  })))), fileList.length !== 0 && Array.isArray(fileList) && fileList.map(function(item, index) {
     return React__default.createElement("div", {
       className: "nut-uploader__preview ".concat(previewType),
       key: item.uid

package/dist/esm/configprovider2.js

@@ -1099,6 +1099,11 @@ var zhCN = {
     refreshingText: "加载中...",
     completeText: "刷新成功"
   },
+  tour: {
+    prevStepText: "上一步",
+    completeText: "完成",
+    nextStepText: "下一步"
+  },
   watermark: {
     errorCanvasTips: "当前环境不支持Canvas"
   }

package/dist/esm/nutui-react.es.js

@@ -84,14 +84,15 @@ import { default as default84 } from "./Swiper.js";
 import { default as default85 } from "./SwiperItem.js";
 import { default as default86 } from "./Table.js";
 import { default as default87 } from "./Tag.js";
-import { default as default88 } from "./Video.js";
-import { default as default89 } from "./VirtualList.js";
-import { default as default90 } from "./Barrage.js";
-import { default as default91 } from "./Card.js";
-import { default as default92 } from "./TimeDetail.js";
-import { default as default93 } from "./TimeSelect.js";
-import { default as default94 } from "./TrendArrow.js";
-import { default as default95 } from "./WaterMark.js";
+import { default as default88 } from "./Tour.js";
+import { default as default89 } from "./Video.js";
+import { default as default90 } from "./VirtualList.js";
+import { default as default91 } from "./Barrage.js";
+import { default as default92 } from "./Card.js";
+import { default as default93 } from "./TimeDetail.js";
+import { default as default94 } from "./TimeSelect.js";
+import { default as default95 } from "./TrendArrow.js";
+import { default as default96 } from "./WaterMark.js";
 export {
   default52 as ActionSheet,
   default27 as Address,
@@ -102,11 +103,11 @@ export {
   default71 as AvatarGroup,
   default16 as BackTop,
   default53 as Badge,
-  default90 as Barrage,
+  default91 as Barrage,
   default2 as Button,
   default28 as Calendar,
   default29 as CalendarItem,
-  default91 as Card,
+  default92 as Card,
   default30 as Cascader,
   default3 as Cell,
   default4 as CellGroup,
@@ -179,12 +180,13 @@ export {
   default26 as Tabs,
   default87 as Tag,
   default50 as TextArea,
-  default92 as TimeDetail,
-  default93 as TimeSelect,
+  default93 as TimeDetail,
+  default94 as TimeSelect,
   default66 as Toast,
-  default94 as TrendArrow,
+  default88 as Tour,
+  default95 as TrendArrow,
   default51 as Uploader,
-  default88 as Video,
-  default89 as VirtualList,
-  default95 as WaterMark
+  default89 as Video,
+  default90 as VirtualList,
+  default96 as WaterMark
 };

package/dist/esm/tabbaritem2.js

@@ -1,4 +1,6 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["className", "style", "title", "icon", "active", "activeColor", "inactiveColor", "index", "value", "dot", "max", "top", "right", "handleClick"];
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
   if (Object.getOwnPropertySymbols) {
@@ -36,7 +38,7 @@ var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   right: "5"
 });
 var TabbarItem = function TabbarItem2(props) {
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, style = _defaultProps$props.style, title = _defaultProps$props.title, icon = _defaultProps$props.icon, active = _defaultProps$props.active, activeColor = _defaultProps$props.activeColor, inactiveColor = _defaultProps$props.inactiveColor, index = _defaultProps$props.index, value = _defaultProps$props.value, dot = _defaultProps$props.dot, max = _defaultProps$props.max, top = _defaultProps$props.top, right = _defaultProps$props.right, handleClick = _defaultProps$props.handleClick;
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, style = _defaultProps$props.style, title = _defaultProps$props.title, icon = _defaultProps$props.icon, active = _defaultProps$props.active, activeColor = _defaultProps$props.activeColor, inactiveColor = _defaultProps$props.inactiveColor, index = _defaultProps$props.index, value = _defaultProps$props.value, dot = _defaultProps$props.dot, max = _defaultProps$props.max, top = _defaultProps$props.top, right = _defaultProps$props.right, handleClick = _defaultProps$props.handleClick, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
   var classPrefix = "nut-tabbar-item";
   var tabbarItemClass = classNames(className, classPrefix, _defineProperty({}, "".concat(classPrefix, "-active"), active));
   var boxPrefix = "".concat(classPrefix, "__icon-box");
@@ -49,7 +51,7 @@ var TabbarItem = function TabbarItem2(props) {
     right,
     color: activeColor
   };
-  return React__default.createElement("div", {
+  return React__default.createElement("div", _objectSpread({
     className: tabbarItemClass,
     style: _objectSpread({
       color: active ? activeColor : inactiveColor
@@ -57,7 +59,7 @@ var TabbarItem = function TabbarItem2(props) {
     onClick: function onClick() {
       return handleClick(index);
     }
-  }, icon ? React__default.createElement(React__default.Fragment, null, React__default.createElement(Badge, _objectSpread({}, badgeProps), React__default.createElement("div", {
+  }, rest), icon ? React__default.createElement(React__default.Fragment, null, React__default.createElement(Badge, _objectSpread({}, badgeProps), React__default.createElement("div", {
     className: boxPrefix
   }, icon)), React__default.createElement("div", {
     className: titleClass

package/dist/esm/types/src/locales/base.d.ts

@@ -123,6 +123,11 @@ export interface BaseLang {
         refreshingText: string;
         completeText: string;
     };
+    tour: {
+        prevStepText: string;
+        completeText: string;
+        nextStepText: string;
+    };
     watermark: {
         errorCanvasTips: string;
     };