@nutui/nutui-react-taro 1.2.2-beta.0 → 1.3.1-beta.0

package/dist/esm/menuitem.taro-56bf3205.js

@@ -0,0 +1,195 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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), !0).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 classNames from 'classnames';
+import { CSSTransition } from 'react-transition-group';
+import { u as useConfig } from './configprovider-9c393a29.js';
+import { I as Icon } from './icon.taro-1d0d4fb7.js';
+import { O as Overlay } from './overlay.taro-a784329e.js';
+var defaultProps = {
+  className: '',
+  style: {},
+  columns: 1,
+  direction: 'down',
+  optionsIcon: 'Check',
+  activeTitleClass: '',
+  inactiveTitleClass: '',
+  iconClassPrefix: 'nut-icon',
+  fontClassName: 'nutui-iconfont',
+  onChange: function onChange(value) {
+    return undefined;
+  }
+};
+
+var MenuItem = function MenuItem(props) {
+  useConfig();
+
+  var mergedProps = _objectSpread(_objectSpread({}, defaultProps), props);
+
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+      className = _defaultProps$props.className,
+      style = _defaultProps$props.style,
+      options = _defaultProps$props.options,
+      value = _defaultProps$props.value,
+      columns = _defaultProps$props.columns,
+      title = _defaultProps$props.title,
+      iconClassPrefix = _defaultProps$props.iconClassPrefix,
+      fontClassName = _defaultProps$props.fontClassName,
+      optionsIcon = _defaultProps$props.optionsIcon,
+      direction = _defaultProps$props.direction,
+      onChange = _defaultProps$props.onChange,
+      activeTitleClass = _defaultProps$props.activeTitleClass,
+      inactiveTitleClass = _defaultProps$props.inactiveTitleClass,
+      children = _defaultProps$props.children;
+
+  var activeColor = mergedProps.activeColor,
+      showPopup = mergedProps.showPopup,
+      parent = mergedProps.parent,
+      orderKey = mergedProps.orderKey;
+
+  var _useState = useState(showPopup),
+      _useState2 = _slicedToArray(_useState, 2),
+      _showPopup = _useState2[0],
+      setShowPopup = _useState2[1];
+
+  var _useState3 = useState(value),
+      _useState4 = _slicedToArray(_useState3, 2),
+      _value = _useState4[0],
+      setValue = _useState4[1];
+
+  useEffect(function () {
+    setShowPopup(showPopup);
+  }, [showPopup]);
+  useEffect(function () {
+    getParentOffset();
+  }, [_showPopup]);
+
+  var getIconCName = function getIconCName(optionVal, value) {
+    var _classNames;
+
+    return classNames((_classNames = {}, _defineProperty(_classNames, activeTitleClass, optionVal === value), _defineProperty(_classNames, inactiveTitleClass, optionVal !== value), _classNames));
+  };
+
+  var setTitle = function setTitle(text) {
+    if (!title) {
+      parent.updateTitle(text, orderKey);
+    }
+  };
+
+  var handleClick = function handleClick(item) {
+    parent.toggleItemShow(orderKey);
+    setTitle(item.text);
+    setValue(item.value);
+    onChange && onChange(item);
+  };
+
+  var _useState5 = useState({
+    top: 0,
+    height: 0
+  }),
+      _useState6 = _slicedToArray(_useState5, 2),
+      position = _useState6[0],
+      setPosition = _useState6[1];
+
+  var getParentOffset = function getParentOffset() {
+    setTimeout(function () {
+      var p = parent.parent().current;
+      var rect = p.getBoundingClientRect();
+      console.log(rect, p.offsetTop, window.screenTop);
+      setPosition({
+        height: rect.height,
+        top: rect.top
+      });
+    });
+  };
+
+  var isShow = function isShow() {
+    if (_showPopup) return {};
+    return {
+      display: 'none'
+    };
+  };
+
+  var getPosition = function getPosition() {
+    return direction === 'down' ? {
+      top: "".concat(position.top + position.height, "px")
+    } : {
+      bottom: "".concat(window.innerHeight - position.top, "px"),
+      top: 'auto'
+    };
+  };
+
+  var placeholderStyle = function placeholderStyle() {
+    if (direction === 'down') {
+      return _objectSpread(_objectSpread({
+        height: "".concat(position.top + position.height, "px")
+      }, isShow()), style);
+    }
+
+    return _objectSpread(_objectSpread({
+      height: "".concat(window.innerHeight - position.top, "px"),
+      top: 'auto'
+    }, isShow()), style);
+  };
+
+  return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
+    className: "placeholder-element ".concat(classNames({
+      up: direction === 'up'
+    }), " ").concat(className),
+    style: placeholderStyle(),
+    onClick: function onClick() {
+      return parent.toggleItemShow(orderKey);
+    }
+  }), React__default.createElement(Overlay, {
+    overlayClass: "nut-menu__overlay",
+    style: getPosition(),
+    lockScroll: parent.lockScroll,
+    visible: _showPopup,
+    closeOnClickOverlay: parent.closeOnClickOverlay,
+    onClick: function onClick() {
+      parent.closeOnClickOverlay && parent.toggleItemShow(orderKey);
+    }
+  }), React__default.createElement("div", {
+    className: "nut-menu-item__wrap",
+    style: _objectSpread(_objectSpread({}, getPosition()), isShow())
+  }, React__default.createElement(CSSTransition, {
+    "in": _showPopup,
+    timeout: 100,
+    classNames: "menu-item"
+  }, React__default.createElement("div", {
+    className: "nut-menu-item__content"
+  }, options === null || options === void 0 ? void 0 : options.map(function (item, index) {
+    return React__default.createElement("div", {
+      className: "nut-menu-item__option ".concat(classNames({
+        active: item.value === _value
+      })),
+      key: item.text,
+      style: {
+        flexBasis: "".concat(100 / columns, "%")
+      },
+      onClick: function onClick() {
+        handleClick(item);
+      }
+    }, item.value === _value ? React__default.createElement(Icon, {
+      className: getIconCName(item.value, value),
+      name: optionsIcon,
+      classPrefix: iconClassPrefix,
+      fontClassName: fontClassName,
+      color: activeColor
+    }) : null, React__default.createElement("div", {
+      className: getIconCName(item.value, value),
+      style: {
+        color: "".concat(item.value === _value ? activeColor : '')
+      }
+    }, item.text));
+  }), children))));
+};
+
+MenuItem.defaultProps = defaultProps;
+MenuItem.displayName = 'NutMenuItem';
+export { MenuItem as M };

package/dist/esm/navbar.taro-f2eae6a6.js

@@ -0,0 +1,123 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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), !0).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 from 'react';
+import classNames from 'classnames';
+import { I as Icon } from './icon-8dc4de10.js';
+import { c as cn } from './bem-893ad28d.js';
+var defaultProps = {
+  title: '',
+  desc: '',
+  leftShow: true,
+  titIcon: '',
+  className: '',
+  leftText: '',
+  fixed: false,
+  safeAreaInsetTop: false,
+  border: false,
+  placeholder: false,
+  zIndex: 10,
+  style: {}
+};
+
+var NavBar = function NavBar(props) {
+  var _classNames;
+
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+      desc = _defaultProps$props.desc,
+      title = _defaultProps$props.title,
+      titIcon = _defaultProps$props.titIcon,
+      leftShow = _defaultProps$props.leftShow,
+      className = _defaultProps$props.className,
+      style = _defaultProps$props.style,
+      leftText = _defaultProps$props.leftText,
+      fixed = _defaultProps$props.fixed,
+      safeAreaInsetTop = _defaultProps$props.safeAreaInsetTop,
+      border = _defaultProps$props.border,
+      placeholder = _defaultProps$props.placeholder,
+      zIndex = _defaultProps$props.zIndex,
+      onClickTitle = _defaultProps$props.onClickTitle,
+      onClickIcon = _defaultProps$props.onClickIcon,
+      onClickBack = _defaultProps$props.onClickBack,
+      onClickRight = _defaultProps$props.onClickRight;
+
+  var b = cn('navbar');
+  var children = Array.isArray(props.children) ? props.children : [props.children];
+  var slot = children.reduce(function (slot, item) {
+    var data = slot;
+
+    if (item && item.props) {
+      data[item.props.slot] = item;
+    }
+
+    return data;
+  }, {});
+
+  var styles = function styles() {
+    return _objectSpread(_objectSpread({}, style), {}, {
+      zIndex: zIndex
+    });
+  };
+
+  var renderLeft = function renderLeft() {
+    return React__default.createElement("div", {
+      className: "".concat(b('left')),
+      onClick: function onClick(e) {
+        return onClickBack(e);
+      }
+    }, leftShow && React__default.createElement(Icon, {
+      name: "left",
+      color: "#979797"
+    }), leftText && React__default.createElement("div", {
+      className: "".concat(b('text'))
+    }, leftText), slot.left);
+  };
+
+  var renderContent = function renderContent() {
+    return React__default.createElement("div", {
+      className: "".concat(b('title'))
+    }, title && React__default.createElement("div", {
+      className: "title",
+      onClick: function onClick(e) {
+        return onClickTitle(e);
+      }
+    }, title), titIcon && React__default.createElement("div", {
+      onClick: function onClick(e) {
+        return onClickIcon(e);
+      }
+    }, React__default.createElement(Icon, {
+      name: titIcon
+    })), slot.content);
+  };
+
+  var renderRight = function renderRight() {
+    return React__default.createElement("div", {
+      className: "".concat(b('right')),
+      onClick: function onClick(e) {
+        return onClickRight(e);
+      }
+    }, desc && React__default.createElement("div", {
+      className: "".concat(b('text'))
+    }, desc), slot.right);
+  };
+
+  var renderWrapper = function renderWrapper() {
+    return React__default.createElement("div", {
+      className: cls,
+      style: styles()
+    }, renderLeft(), renderContent(), renderRight());
+  };
+
+  var classes = classNames((_classNames = {}, _defineProperty(_classNames, "nut-navbar--border", border), _defineProperty(_classNames, "nut-navbar--fixed", fixed), _defineProperty(_classNames, "nut-navbar--safe-area-inset-top", safeAreaInsetTop), _classNames));
+  var cls = classNames(b(''), classes, className);
+  return React__default.createElement(React__default.Fragment, null, fixed && placeholder ? React__default.createElement("div", {
+    className: "".concat(b(''), "--placeholder")
+  }, renderWrapper()) : renderWrapper());
+};
+
+NavBar.defaultProps = defaultProps;
+NavBar.displayName = 'NutNavBar';
+export { NavBar as N };

package/dist/esm/{noticebar.taro-70193e5e.js → noticebar.taro-1890c693.js}

@@ -9,8 +9,9 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 import React__default, { useRef, useState, useEffect } 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 { g as getRectByTaro } from './useClientRect-8b7cc406.js';
 var defaultProps = {
   // 滚动方向  across 横向 vertical 纵向
   direction: 'across',
@@ -25,7 +26,7 @@ var defaultProps = {
   color: '',
   background: '',
   delay: 1,
-  scrollable: true,
+  scrollable: null,
   speed: 50
 };
 
@@ -102,6 +103,11 @@ var NoticeBar = function NoticeBar(props) {
       timer = _useState18[0],
       SetTimer = _useState18[1];
 
+  var _useState19 = useState(null),
+      _useState20 = _slicedToArray(_useState19, 2),
+      isCanScroll = _useState20[0],
+      SetIsCanScroll = _useState20[1];
+
   useState(0);
   useEffect(function () {
     if (direction === 'vertical') {
@@ -132,12 +138,14 @@ var NoticeBar = function NoticeBar(props) {
 
   var cloneChild = function cloneChild(listItem, listIndex) {
     return React__default.Children.map(children, function (child, index) {
-      if (child && index == listIndex) {
+      if (child && index === listIndex) {
         return React__default.cloneElement(child, {
           key: listIndex,
           children: listItem
         });
       }
+
+      return null;
     });
   };
 
@@ -156,7 +164,7 @@ var NoticeBar = function NoticeBar(props) {
     }
 
     setTimeout( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-      var wrapRes, wrapW, contentRes, offsetW;
+      var warpRes, contentRes, wrapW, offsetW, canScroll;
       return _regeneratorRuntime.wrap(function _callee$(_context) {
         while (1) {
           switch (_context.prev = _context.next) {
@@ -170,19 +178,21 @@ var NoticeBar = function NoticeBar(props) {
 
             case 2:
               _context.next = 4;
-              return wrap.current.getBoundingClientRect();
+              return getRectByTaro(wrap.current);
 
             case 4:
-              wrapRes = _context.sent;
-              wrapW = wrapRes.width;
-              _context.next = 8;
-              return content.current.getBoundingClientRect();
+              warpRes = _context.sent;
+              _context.next = 7;
+              return getRectByTaro(content.current);
 
-            case 8:
+            case 7:
               contentRes = _context.sent;
+              wrapW = warpRes.width;
               offsetW = contentRes.width;
+              canScroll = scrollable == null ? offsetW > wrapW : scrollable;
+              SetIsCanScroll(canScroll);
 
-              if (scrollable && offsetW > wrapW) {
+              if (canScroll) {
                 SetWrapWidth(wrapW);
                 SetOffsetW(offsetW);
                 SetDuration(offsetW / speed);
@@ -191,13 +201,13 @@ var NoticeBar = function NoticeBar(props) {
                 SetAnimationClass('');
               }
 
-            case 11:
+            case 13:
             case "end":
               return _context.stop();
           }
         }
       }, _callee);
-    })));
+    })), 0);
   };
 
   var handleClick = function handleClick(event) {
@@ -274,27 +284,49 @@ var NoticeBar = function NoticeBar(props) {
 
   var handleClickIcon = function handleClickIcon() {
     close && close(scrollList[0]);
-  }; // const iconShow = () => {
-  //   if (leftIcon === 'close') {
-  //     return false
-  //   }
-  //   return true
-  // }
+  };
+
+  var iconShow = function iconShow() {
+    if (leftIcon === 'close') {
+      return false;
+    }
+
+    return true;
+  };
+
+  var iconBg = function iconBg() {
+    var iconBg = '';
+
+    if (leftIcon) {
+      iconBg = leftIcon;
+    }
 
+    return iconBg;
+  };
+
+  var isEllipsis = function isEllipsis() {
+    if (isCanScroll == null) {
+      return wrapable;
+    }
+
+    return !isCanScroll && !wrapable;
+  };
 
   var contentStyle = {
-    paddingLeft: firstRound ? 0 : "".concat(wrapWidth, "px"),
-    animationDelay: "".concat(firstRound ? props.delay : 0, "s"),
-    animationDuration: "".concat(duration, "s")
+    // paddingLeft: firstRound ? 0 : `${wrapWidth}px`,
+    animationDelay: "".concat(firstRound ? delay : 0, "s"),
+    animationDuration: "".concat(duration, "s"),
+    transform: "translateX(".concat(firstRound ? 0 : "".concat(wrapWidth, "px"), ")")
   };
   var barStyle = {
     color: color,
     background: background,
-    height: direction == 'vertical' ? "".concat(height, "px") : ''
+    height: direction === 'vertical' ? "".concat(height, "px") : ''
   };
+  var duringTime = ~~(height / speed / 4);
   var horseLampStyle = {
     transform: complexAm ? "translateY(".concat(distance, "px)") : '',
-    transition: animate ? "all ".concat(~~(height / speed / 4), "s") : '',
+    transition: animate ? "all ".concat(duringTime === 0 ? ~~(height / speed) : duringTime, "s") : '',
     marginTop: animate ? "-".concat(height, "px") : ''
   };
   var b = cn('noticebar');
@@ -307,34 +339,34 @@ var NoticeBar = function NoticeBar(props) {
   return React__default.createElement("div", {
     className: "".concat(b(), " ").concat(className || ''),
     style: style
-  }, showNoticeBar && direction == 'across' ? React__default.createElement("div", {
+  }, showNoticeBar && direction === 'across' ? React__default.createElement("div", {
     className: noticebarClass,
     style: barStyle,
     onClick: handleClick
-  }, React__default.createElement("div", {
+  }, iconShow() ? React__default.createElement("div", {
     className: "left-icon",
     style: {
-      backgroundImage: "url(".concat(leftIcon || '', ")")
+      backgroundImage: "url(".concat(iconBg() || '', ")")
     }
-  }, !leftIcon ? React__default.createElement(Icon, {
+  }, !iconBg() ? React__default.createElement(Icon, {
     name: "notice",
     size: "16",
     color: color
-  }) : null), React__default.createElement("div", {
+  }) : null) : null, React__default.createElement("div", {
     ref: wrap,
     className: "wrap"
   }, React__default.createElement("div", {
     ref: content,
-    className: "content ".concat(animationClass, " ").concat(!scrollable && !wrapable && 'nut-ellipsis'),
+    className: "content ".concat(animationClass, " ").concat(isEllipsis() && 'nut-ellipsis'),
     style: contentStyle,
     onAnimationEnd: onAnimationEnd
-  }, children, text)), closeMode ? React__default.createElement("div", {
+  }, children, text)), closeMode || rightIcon ? React__default.createElement("div", {
     className: "right-icon",
     onClick: onClickIcon
   }, React__default.createElement(Icon, {
-    name: "close",
+    name: rightIcon || 'close',
     color: color
-  })) : null) : scrollList.current.length > 0 && direction == 'vertical' ? React__default.createElement("div", {
+  })) : null) : null, scrollList.current.length > 0 && direction === 'vertical' ? React__default.createElement("div", {
     className: "nut-noticebar-vertical",
     style: barStyle
   }, children ? React__default.createElement("div", {
@@ -346,16 +378,18 @@ var NoticeBar = function NoticeBar(props) {
     className: "horseLamp_list",
     style: horseLampStyle
   }, scrollList.current.map(function (item, index) {
-    return React__default.createElement("li", {
-      className: "horseLamp_list_item",
-      style: {
-        height: height
-      },
-      key: index,
-      onClick: function onClick() {
-        go(item);
-      }
-    }, item);
+    return (// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
+      React__default.createElement("li", {
+        className: "horseLamp_list_item",
+        style: {
+          height: height
+        },
+        key: index,
+        onClick: function onClick() {
+          go(item);
+        }
+      }, item)
+    );
   })), React__default.createElement("div", {
     className: "go",
     onClick: function onClick() {

package/dist/esm/{notify.taro-837a878b.js → notify.taro-22b8f4cd.js}

@@ -19,6 +19,7 @@ import * as ReactDOM from 'react-dom';
 import classNames from 'classnames';
 import { CSSTransition } from 'react-transition-group';
 import { c as cn } from './bem-893ad28d.js';
+import { r as render } from './render-4a3856cb.js';
 
 var Notification = /*#__PURE__*/function (_React$PureComponent) {
   _inherits(Notification, _React$PureComponent);
@@ -105,11 +106,14 @@ var Notification = /*#__PURE__*/function (_React$PureComponent) {
           color = _this$props.color,
           background = _this$props.background,
           type = _this$props.type,
-          className = _this$props.className;
+          className = _this$props.className,
+          position = _this$props.position,
+          isWrapTeleport = _this$props.isWrapTeleport;
       this.state;
       cn('notify');
       var classes = classNames(_defineProperty({
-        'popup-top': true,
+        'popup-top': position === 'top',
+        'popup-bottom': position === 'bottom',
         'nut-notify': true
       }, "nut-notify--".concat(type), true));
       return React.createElement(React.Fragment, null, React.createElement(CSSTransition, {
@@ -117,7 +121,9 @@ var Notification = /*#__PURE__*/function (_React$PureComponent) {
         timeout: 300,
         classNames: "fade",
         unmountOnExit: true,
-        appear: true
+        appear: true,
+        position: position,
+        isWrapTeleport: isWrapTeleport
       }, React.createElement("div", {
         className: "".concat(classes, " ").concat(className),
         style: {
@@ -159,7 +165,7 @@ Notification.newInstance = function (properties, callback) {
     });
   }
 
-  ReactDOM.render(React.createElement(Notification, _objectSpread(_objectSpread({}, properties), {}, {
+  render(React.createElement(Notification, _objectSpread(_objectSpread({}, properties), {}, {
     ref: ref
   })), element);
 };
@@ -169,8 +175,11 @@ var options = {
   msg: '',
   id: '',
   duration: 3000,
+  color: '',
   type: 'danger',
   className: '',
+  position: 'top',
+  isWrapTeleport: true,
   onClosed: function onClosed() {},
   onClick: function onClick() {}
 };
@@ -187,7 +196,12 @@ function getInstance(props, callback) {
 }
 
 function notice(opts) {
-  debugger;
+  // function close() {
+  //   if (messageInstance) {
+  //     messageInstance.destroy()
+  //     messageInstance = null
+  //   }
+  // }
   opts = _objectSpread(_objectSpread({}, options), opts);
   getInstance(opts, function (notification) {
     messageInstance = notification;
@@ -197,6 +211,8 @@ function notice(opts) {
 var errorMsg = function errorMsg(msg) {
   if (!msg) {
     console.warn('[NutUI Notify]: msg不能为空');
+  } else {
+    console.log('ok');
   }
 };
 

package/dist/esm/{numberkeyboard.taro-a80cec74.js → numberkeyboard.taro-5d685c76.js}

@@ -9,8 +9,8 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import React__default, { useState, useEffect } from 'react';
 import classNames from 'classnames';
 import { c as cn } from './bem-893ad28d.js';
-import { P as Popup } from './popup-15922d84.js';
-import { u as useConfig } from './configprovider-18657611.js';
+import { P as Popup } from './popup-67173ec6.js';
+import { u as useConfig } from './configprovider-9c393a29.js';
 var defaultProps = {
   confirmText: '',
   title: '',