@nutui/nutui-react 1.2.3-beta.3 → 1.3.0

package/dist/esm/Popover.js

@@ -7,7 +7,7 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _typeof from "@babel/runtime/helpers/typeof";
-var _excluded = ["children", "list", "theme", "location", "visible", "className", "style", "onClick"];
+var _excluded = ["children", "list", "theme", "location", "visible", "offset", "className", "style", "onClick", "onChoose"];
 
 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; }
 
@@ -18,8 +18,8 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 import React__default, { useRef, useState, useEffect } from 'react';
-import ReactDOM__default from 'react-dom';
 import Icon from './Icon.js';
+import Overlay from './Overlay.js';
 /**
  * 过滤ref
  */
@@ -101,15 +101,6 @@ var Trigger = /*#__PURE__*/function (_React__default$Compo) {
   return Trigger;
 }(React__default.Component);
 
-function findDOMNode(node) {
-  if (node instanceof HTMLElement) {
-    return node;
-  } // eslint-disable-next-line react/no-find-dom-node
-
-
-  return ReactDOM__default.findDOMNode(node);
-}
-
 var getEleAttr = function getEleAttr(ele) {
   if (ele && ele.getBoundingClientRect) {
     return ele.getBoundingClientRect();
@@ -123,8 +114,10 @@ var defaultProps = {
   theme: 'light',
   location: 'bottom',
   visible: false,
+  offset: 20,
   className: '',
-  onClick: function onClick(e) {}
+  onClick: function onClick(e) {},
+  onChoose: function onChoose(item, index) {}
 };
 
 var Popover = function Popover(props) {
@@ -134,18 +127,18 @@ var Popover = function Popover(props) {
       theme = _defaultProps$props.theme,
       location = _defaultProps$props.location,
       visible = _defaultProps$props.visible,
+      offset = _defaultProps$props.offset,
       className = _defaultProps$props.className,
       style = _defaultProps$props.style,
       onClick = _defaultProps$props.onClick,
+      onChoose = _defaultProps$props.onChoose,
       reset = _objectWithoutProperties(_defaultProps$props, _excluded);
 
-  var goodItem = useRef(null); // eslint-disable-next-line react/no-find-dom-node
-
-  var aa = goodItem.current && findDOMNode(goodItem.current);
+  var goodItem = useRef(null);
   setTimeout(function () {
-    if (aa) {
-      setElWidth(getEleAttr(aa).width);
-      setElHeight(getEleAttr(aa).height);
+    if (goodItem.current && getEleAttr(goodItem.current)) {
+      setElWidth(getEleAttr(goodItem.current).width);
+      setElHeight(getEleAttr(goodItem.current).height);
     }
   });
 
@@ -181,68 +174,43 @@ var Popover = function Popover(props) {
   }, [list, theme]);
 
   var getStyle = function getStyle() {
+    var offNumer = Number(offset) ? Number(offset) : 0;
     var style = {};
 
-    if (location === 'top') {
-      style.bottom = elHeight + 20;
-      style.left = 0;
-    } else if (location === 'right') {
-      style.top = 0;
-      style.right = -elWidth - 20;
-    } else if (location === 'left') {
-      style.top = 0;
-      style.left = -elWidth - 20;
-    } else {
-      style.top = elHeight + 20;
-      style.left = 0;
-    }
-
-    style.top += 'px';
-    style.left += 'px';
-    style.bottom += 'px';
-    style.right += 'px';
-    return style;
-  };
-
-  var getArrowStyle = function getArrowStyle() {
-    var style = {};
-
-    if (location === 'top') {
-      style.bottom = -20;
-      style.left = elWidth / 2;
-    } else if (location === 'right') {
-      style.top = 20;
-      style.left = -20;
-    } else if (location === 'left') {
-      style.top = 20;
-      style.right = -20;
+    if (location.includes('top')) {
+      style.bottom = "".concat(elHeight + offNumer, "px");
+    } else if (location.includes('right')) {
+      style.left = "".concat(elWidth + offNumer, "px");
+    } else if (location.includes('left')) {
+      style.right = "".concat(elWidth + offNumer, "px");
     } else {
-      style.left = elWidth / 2;
-      style.top = -20;
+      style.top = "".concat(elHeight + offNumer, "px");
     }
 
-    style.top += 'px';
-    style.left += 'px';
-    style.bottom += 'px';
-    style.right += 'px';
     return style;
   };
 
   var classesSelf = function classesSelf() {
     var prefixCls = 'nut-popover';
-    return "".concat(prefixCls, "\n    ").concat(theme ? "".concat(prefixCls, "--").concat(theme) : '');
+    return "".concat(prefixCls, " ").concat(theme ? "".concat(prefixCls, "--").concat(theme) : '');
   };
 
   var popoverContentSelf = function popoverContentSelf() {
-    var prefixCls = 'popoverContent';
-    return "".concat(prefixCls, "\n    ").concat(location ? "".concat(prefixCls, "--").concat(location) : '');
+    var prefixCls = 'popover-content';
+    return "".concat(prefixCls, "-show ").concat(prefixCls, " ").concat(location ? "".concat(prefixCls, "--").concat(location) : '');
   };
 
-  var popoverArrowSelf = function popoverArrowSelf() {
-    var prefixCls = 'popoverArrow';
-    return "".concat(prefixCls, "\n    ").concat(location ? "".concat(prefixCls, "--").concat(location) : '');
-  }; // const showPopup = props.visible
+  var filter = function filter() {
+    var ms = ['top', 'bottom', 'left', 'right'];
+    return ms.filter(function (m) {
+      return location.includes(m);
+    })[0];
+  };
 
+  var popoverArrowSelf = function popoverArrowSelf() {
+    var prefixCls = 'popover-arrow';
+    return "".concat(prefixCls, " ").concat(prefixCls, "-").concat(filter(), " ").concat(location ? "".concat(prefixCls, "--").concat(location) : '');
+  };
 
   var handleClick = function handleClick(e) {
     if (props.onClick) {
@@ -250,7 +218,13 @@ var Popover = function Popover(props) {
     }
   };
 
-  return React__default.createElement("div", _objectSpread({
+  var handleChoose = function handleChoose(item, index) {
+    if (!item.disabled) {
+      onChoose(item, index);
+    }
+  };
+
+  return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", _objectSpread({
     className: "".concat(classes, " ").concat(className),
     style: _objectSpread({}, style)
   }, reset), React__default.createElement(Trigger, {
@@ -263,19 +237,29 @@ var Popover = function Popover(props) {
     className: "".concat(popoverContent),
     style: getStyle()
   }, React__default.createElement("div", {
-    className: "".concat(popoverArrow),
-    style: getArrowStyle()
-  }, ' '), Array.isArray(children) ? children[1] : '', list.map(function (item) {
+    className: "".concat(popoverArrow)
+  }), Array.isArray(children) ? children[1] : '', list.map(function (item, i) {
     return React__default.createElement("div", {
       key: item.name,
-      className: "title-item ".concat(item.disabled ? 'disabled' : '')
+      className: "popover-menu-item ".concat(item.disabled ? 'disabled' : ''),
+      onClick: function onClick() {
+        handleChoose(item, i);
+      }
     }, item.icon ? React__default.createElement(Icon, {
-      className: "item-img",
+      className: "popover-menu-item-img",
       name: item.icon
     }) : '', React__default.createElement("div", {
-      className: "title-name"
+      className: "popover-menu-item-name"
     }, item.name));
-  })) : null)));
+  })) : null))), visible ? React__default.createElement(Overlay, {
+    visible: visible,
+    onClick: function onClick(e) {
+      return handleClick(e);
+    },
+    style: {
+      background: 'transparent'
+    }
+  }) : '');
 };
 
 Popover.defaultProps = defaultProps;

package/dist/esm/Price.js

@@ -30,9 +30,20 @@ var Price = function Price(props) {
 
   var b = cn('price');
 
+  var replaceSpecialChar = function replaceSpecialChar(symbol) {
+    var desSymbol = symbol;
+    desSymbol = symbol.replace(/"/g, '"');
+    desSymbol = symbol.replace(/&/g, '&');
+    desSymbol = symbol.replace(/&lt;/g, '<');
+    desSymbol = symbol.replace(/&gt;/g, '>');
+    desSymbol = symbol.replace(/&nbsp;/g, ' ');
+    desSymbol = symbol.replace(/&yen;/g, '￥');
+    return desSymbol;
+  };
+
   var showSymbol = function showSymbol() {
     return {
-      __html: (needSymbol ? symbol : '') || ''
+      __html: (needSymbol ? replaceSpecialChar(symbol) : '') || ''
     };
   };
 
@@ -41,7 +52,7 @@ var Price = function Price(props) {
   };
 
   var formatThousands = function formatThousands(num) {
-    if (Number(num) == 0) {
+    if (Number(num) === 0) {
       num = 0;
     }
 
@@ -60,7 +71,7 @@ var Price = function Price(props) {
   };
 
   var formatDecimal = function formatDecimal(decimalNum) {
-    if (Number(decimalNum) == 0) {
+    if (Number(decimalNum) === 0) {
       decimalNum = 0;
     }
 

package/dist/esm/Progress.js

@@ -8,7 +8,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 import React__default from 'react';
 import classNames from 'classnames';
-import { I as Icon } from './icon-62bd7379.js';
+import { I as Icon } from './icon-8dc4de10.js';
 import { c as cn } from './bem-893ad28d.js';
 import '@bem-react/classname';
 var defaultProps = {

package/dist/esm/Range.js

@@ -80,9 +80,6 @@ var Range = function Range(props) {
       buttonColor = _defaultProps$props.buttonColor,
       hiddenRange = _defaultProps$props.hiddenRange,
       hiddenTag = _defaultProps$props.hiddenTag,
-      min = _defaultProps$props.min,
-      max = _defaultProps$props.max,
-      step = _defaultProps$props.step,
       modelValue = _defaultProps$props.modelValue,
       button = _defaultProps$props.button,
       vertical = _defaultProps$props.vertical,
@@ -91,6 +88,15 @@ var Range = function Range(props) {
       dragStart = _defaultProps$props.dragStart,
       dragEnd = _defaultProps$props.dragEnd;
 
+  var _defaultProps$props2 = _objectSpread(_objectSpread({}, defaultProps), props),
+      min = _defaultProps$props2.min,
+      max = _defaultProps$props2.max,
+      step = _defaultProps$props2.step;
+
+  min = Number(min);
+  max = Number(max);
+  step = Number(step);
+
   var _useState = useState(0),
       _useState2 = _slicedToArray(_useState, 2),
       buttonIndex = _useState2[0],

package/dist/esm/ShortPassword.js

@@ -2,7 +2,7 @@ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["title", "desc", "tips", "visible", "modelValue", "errorMsg", "noButton", "closeOnClickOverlay", "length", "style", "className", "change", "onOk", "onTips", "onCancel", "onClose", "complete"];
+var _excluded = ["title", "desc", "tips", "visible", "modelValue", "errorMsg", "noButton", "closeOnClickOverlay", "length", "style", "className", "onChange", "onOk", "onTips", "onCancel", "onClose", "onComplete"];
 
 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; }
 
@@ -15,9 +15,9 @@ import Icon from './Icon.js';
 import { useConfig } from './ConfigProvider.js';
 import '@bem-react/classname';
 var defaultProps = {
-  title: '请输入密码',
-  desc: '您使用了虚拟资产，请进行验证',
-  tips: '忘记密码',
+  title: '',
+  desc: '',
+  tips: '',
   visible: false,
   modelValue: '',
   errorMsg: '',
@@ -25,12 +25,12 @@ var defaultProps = {
   closeOnClickOverlay: true,
   length: 6,
   className: '',
-  change: function change(value) {},
+  onChange: function onChange(value) {},
   onOk: function onOk(value) {},
   onCancel: function onCancel() {},
   onClose: function onClose() {},
   onTips: function onTips() {},
-  complete: function complete(value) {}
+  onComplete: function onComplete(value) {}
 };
 
 var ShortPassword = function ShortPassword(props) {
@@ -48,12 +48,12 @@ var ShortPassword = function ShortPassword(props) {
       length = props.length,
       style = props.style,
       className = props.className,
-      change = props.change,
+      onChange = props.onChange,
       onOk = props.onOk,
       onTips = props.onTips,
       onCancel = props.onCancel,
       onClose = props.onClose,
-      complete = props.complete,
+      onComplete = props.onComplete,
       reset = _objectWithoutProperties(props, _excluded);
 
   var b = cn('shortpassword');
@@ -82,7 +82,7 @@ var ShortPassword = function ShortPassword(props) {
     setInnerVisible(visible);
   }, [visible]);
   useEffect(function () {
-    if (modelValue) {
+    if (typeof modelValue !== 'undefined') {
       setInputValue(modelValue);
     }
   }, [modelValue]);
@@ -97,10 +97,10 @@ var ShortPassword = function ShortPassword(props) {
     setInputValue(inputValue);
 
     if (String(inputValue).length === comLen) {
-      complete && complete(inputValue);
+      onComplete && onComplete(inputValue);
     }
 
-    change && change(inputValue);
+    onChange && onChange(inputValue);
   };
 
   var systemStyle = function systemStyle() {
@@ -109,18 +109,23 @@ var ShortPassword = function ShortPassword(props) {
 
     var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); // ios终端
 
+    var style = {};
+    console.log(isIOS, isAndroid);
+
     if (isIOS) {
-      return {
+      style = {
         paddingRight: '1200px'
       };
     }
 
     if (isAndroid) {
-      return {
+      style = {
         opacity: 0,
         zIndex: 10
       };
     }
+
+    return style;
   };
 
   var focus = function focus() {
@@ -149,9 +154,9 @@ var ShortPassword = function ShortPassword(props) {
     style: _objectSpread({}, style)
   }, reset), React__default.createElement("div", {
     className: b('title')
-  }, locale.shortpassword.title || title), React__default.createElement("div", {
+  }, title || locale.shortpassword.title), React__default.createElement("div", {
     className: b('subtitle')
-  }, locale.shortpassword.desc || desc), React__default.createElement("div", {
+  }, desc || locale.shortpassword.desc), React__default.createElement("div", {
     className: b('input')
   }, React__default.createElement("input", {
     ref: textInput,
@@ -181,7 +186,7 @@ var ShortPassword = function ShortPassword(props) {
     className: b('message')
   }, React__default.createElement("div", {
     className: b('message__error')
-  }, errorMsg), tips ? React__default.createElement("div", {
+  }, errorMsg), tips || locale.shortpassword.tips ? React__default.createElement("div", {
     className: b('message__forget')
   }, React__default.createElement(Icon, {
     className: "icon",
@@ -189,7 +194,7 @@ var ShortPassword = function ShortPassword(props) {
     name: "tips"
   }), React__default.createElement("div", {
     onClick: onTips
-  }, locale.shortpassword.tips || tips)) : null), !noButton ? React__default.createElement("div", {
+  }, tips || locale.shortpassword.tips)) : null), !noButton ? React__default.createElement("div", {
     className: b('footer')
   }, React__default.createElement("div", {
     className: b('footer__cancel'),

package/dist/esm/TabbarItem.js

@@ -12,7 +12,7 @@ import '@bem-react/classname';
 var defaultProps = {
   dot: false,
   size: '',
-  classPrefix: 'nutui-iconfont',
+  classPrefix: 'nut-icon',
   tabTitle: '',
   icon: '',
   href: '',

package/dist/esm/Tag.js

@@ -90,7 +90,7 @@ var Tag = function Tag(props) {
     className: "_icon",
     name: "close",
     size: "12",
-    click: function click(e) {
+    onClick: function onClick(e) {
       setIsTagShow(false);
 
       if (props.onClose) {

package/dist/esm/TextArea.js

@@ -96,6 +96,9 @@ var TextArea = function TextArea(props) {
     disabled: disabled,
     readOnly: readonly,
     value: inputValue,
+    onInput: function onInput(e) {
+      textChange(e);
+    },
     onChange: function onChange(e) {
       textChange(e);
     },

package/dist/esm/Toast.js

@@ -92,11 +92,15 @@ var Notification = /*#__PURE__*/function (_React$PureComponent) {
   }, {
     key: "render",
     value: function render() {
-      var _this3 = this;
+      var _classNames,
+          _this3 = this;
 
       var _this$props = this.props,
+          id = _this$props.id,
           style = _this$props.style,
           icon = _this$props.icon,
+          iconSize = _this$props.iconSize,
+          title = _this$props.title,
           msg = _this$props.msg,
           bottom = _this$props.bottom,
           center = _this$props.center,
@@ -108,19 +112,19 @@ var Notification = /*#__PURE__*/function (_React$PureComponent) {
           cover = _this$props.cover,
           type = _this$props.type;
       var toastBem = cn('toast');
-      var classes = classNames(_defineProperty({
+      var classes = classNames((_classNames = {
         'nut-toast-center': center,
         'nut-toast-has-icon': icon,
         'nut-toast-cover': cover,
-        'nut-toast-loading': type === 'loading',
-        customClass: customClass
-      }, "nut-toast-".concat(size), true));
+        'nut-toast-loading': type === 'loading'
+      }, _defineProperty(_classNames, "".concat(customClass), true), _defineProperty(_classNames, "nut-toast-".concat(size), true), _classNames));
       return React.createElement(React.Fragment, null, React.createElement("div", {
         className: "".concat(toastBem(), " ").concat(classes),
-        style: {
-          bottom: center ? 'auto' : "".concat(bottom, "px"),
+        id: "toast-".concat(id),
+        style: _objectSpread({
+          bottom: center ? 'auto' : "".concat(bottom),
           backgroundColor: cover ? coverColor : ''
-        },
+        }, style),
         onClick: function onClick() {
           _this3.clickCover();
         }
@@ -134,8 +138,11 @@ var Notification = /*#__PURE__*/function (_React$PureComponent) {
         className: toastBem('icon-wrapper')
       }, React.createElement(Icon, {
         name: icon || '',
-        size: "20"
-      })) : null, React.createElement("span", {
+        color: "#ffffff",
+        size: iconSize
+      })) : null, title ? React.createElement("div", {
+        className: "nut-toast-title"
+      }, title) : null, React.createElement("span", {
         className: toastBem('text')
       }, msg))));
     }
@@ -180,13 +187,16 @@ var messageInstance = null;
 var options = {
   msg: '',
   id: '',
+  style: {},
   duration: 1.5,
   center: true,
   type: 'text',
+  title: '',
   customClass: '',
-  bottom: 30,
+  bottom: '30px',
   size: 'base',
-  icon: '',
+  icon: null,
+  iconSize: '20',
   textAlignCenter: true,
   loadingRotate: true,
   bgColor: 'rgba(0, 0, 0, .8)',

package/dist/esm/Uploader.js

@@ -270,6 +270,8 @@ var InternalUploader = function InternalUploader(props, ref) {
             item.status = 'ready';
             item.message = locale.uploader.readyUpload;
           }
+
+          return item;
         });
         return _toConsumableArray(fileList);
       });
@@ -283,6 +285,8 @@ var InternalUploader = function InternalUploader(props, ref) {
             item.status = 'uploading';
             item.message = locale.uploader.uploading;
           }
+
+          return item;
         });
         return _toConsumableArray(fileList);
       });
@@ -300,6 +304,8 @@ var InternalUploader = function InternalUploader(props, ref) {
             item.status = 'success';
             item.message = locale.uploader.success;
           }
+
+          return item;
         });
         return _toConsumableArray(fileList);
       });
@@ -316,6 +322,8 @@ var InternalUploader = function InternalUploader(props, ref) {
             item.status = 'error';
             item.message = locale.uploader.error;
           }
+
+          return item;
         });
         return _toConsumableArray(fileList);
       });
@@ -466,7 +474,7 @@ var InternalUploader = function InternalUploader(props, ref) {
     return React__default.createElement("div", {
       className: "nut-uploader__preview ".concat(listType),
       key: item.uid
-    }, listType == 'picture' && !children && React__default.createElement("div", {
+    }, listType === 'picture' && !children && React__default.createElement("div", {
       className: "nut-uploader__preview-img"
     }, item.status === 'ready' ? React__default.createElement("div", {
       className: "nut-uploader__preview__progress"
@@ -476,25 +484,27 @@ var InternalUploader = function InternalUploader(props, ref) {
       className: "nut-uploader__preview__progress"
     }, React__default.createElement(Icon, {
       color: "#fff",
-      name: "".concat(item.status == 'error' ? 'failure' : 'loading')
+      name: "".concat(item.status === 'error' ? 'failure' : 'loading')
     }), React__default.createElement("div", {
       className: "nut-uploader__preview__progress__msg"
     }, item.message)), isDeletable && React__default.createElement(Icon, {
       color: "rgba(0,0,0,0.6)",
       className: "close",
       name: "failure",
-      click: function click() {
+      onClick: function onClick() {
         return onDelete(item, index);
       }
     }), item.type.includes('image') ? React__default.createElement(React__default.Fragment, null, item.url && React__default.createElement("img", {
       className: "nut-uploader__preview-img__c",
       src: item.url,
+      alt: "",
       onClick: function onClick() {
         return handleItemClick(item);
       }
     })) : React__default.createElement(React__default.Fragment, null, defaultImg ? React__default.createElement("img", {
       className: "nut-uploader__preview-img__c",
       src: defaultImg,
+      alt: "",
       onClick: function onClick() {
         return handleItemClick(item);
       }
@@ -510,7 +520,7 @@ var InternalUploader = function InternalUploader(props, ref) {
       name: "link"
     }), "\xA0", item.name))), React__default.createElement("div", {
       className: "tips"
-    }, item.name)), listType == 'list' && React__default.createElement("div", {
+    }, item.name)), listType === 'list' && React__default.createElement("div", {
       className: "nut-uploader__preview-list"
     }, React__default.createElement("div", {
       className: "nut-uploader__preview-img__file__name ".concat(item.status),
@@ -523,11 +533,11 @@ var InternalUploader = function InternalUploader(props, ref) {
       color: "#808080",
       className: "nut-uploader__preview-img__file__del",
       name: "del",
-      click: function click() {
+      onClick: function onClick() {
         return onDelete(item, index);
       }
     })));
-  }), maximum > fileList.length && listType == 'picture' && !children && React__default.createElement("div", {
+  }), maximum > fileList.length && listType === 'picture' && !children && React__default.createElement("div", {
     className: "nut-uploader__upload ".concat(listType)
   }, React__default.createElement(Icon, {
     size: uploadIconSize,