@nutui/nutui-react 2.0.0-alpha.1 → 2.0.0-alpha.2

package/dist/esm/MenuItem.js

@@ -28,11 +28,10 @@ import { Check } from "@nutui/icons-react";
 import { O as Overlay } from "./overlay2.js";
 import { C as ComponentDefaults } from "./typings.js";
 var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
-  className: "",
-  style: {},
   columns: 1,
   direction: "down",
-  optionsIcon: null,
+  icon: null,
+  closeOnClickAway: false,
   activeTitleClass: "",
   inactiveTitleClass: "",
   onChange: function onChange(value) {
@@ -40,20 +39,18 @@ var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   }
 });
 var MenuItem = forwardRef(function(props, ref) {
-  var mergedProps = _objectSpread(_objectSpread({}, defaultProps), props);
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), style = _defaultProps$props.style, options = _defaultProps$props.options, value = _defaultProps$props.value, columns = _defaultProps$props.columns, title = _defaultProps$props.title, optionsIcon = _defaultProps$props.optionsIcon, direction = _defaultProps$props.direction, onChange2 = _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 _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, icon = _defaultProps$props.icon, direction = _defaultProps$props.direction, onChange2 = _defaultProps$props.onChange, activeTitleClass = _defaultProps$props.activeTitleClass, inactiveTitleClass = _defaultProps$props.inactiveTitleClass, closeOnClickAway = _defaultProps$props.closeOnClickAway, children = _defaultProps$props.children, activeColor = _defaultProps$props.activeColor, show = _defaultProps$props.show, parent = _defaultProps$props.parent, index = _defaultProps$props.index;
+  var _useState = useState(show), _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]);
+    setShowPopup(show);
+  }, [show]);
   useEffect(function() {
     getParentOffset();
   }, [_showPopup]);
   useImperativeHandle(ref, function() {
     return {
-      toggle: parent.toggleItemShow
+      toggle: parent.toggleMenuItem
     };
   });
   var getIconCName = function getIconCName2(optionVal, value2) {
@@ -62,11 +59,11 @@ var MenuItem = forwardRef(function(props, ref) {
   };
   var setTitle = function setTitle2(text) {
     if (!title) {
-      parent.updateTitle(text, orderKey);
+      parent.updateTitle(text, index);
     }
   };
   var handleClick = function handleClick2(item) {
-    parent.toggleItemShow(orderKey);
+    parent.toggleMenuItem(index);
     setTitle(item.text);
     setValue(item.value);
     onChange2 && onChange2(item);
@@ -77,7 +74,7 @@ var MenuItem = forwardRef(function(props, ref) {
   }), _useState6 = _slicedToArray(_useState5, 2), position = _useState6[0], setPosition = _useState6[1];
   var getParentOffset = function getParentOffset2() {
     setTimeout(function() {
-      var p = parent.parent().current;
+      var p = parent.menuRef.current;
       var rect = p.getBoundingClientRect();
       setPosition({
         height: rect.height,
@@ -102,42 +99,47 @@ var MenuItem = forwardRef(function(props, ref) {
   };
   var placeholderStyle = function placeholderStyle2() {
     if (direction === "down") {
-      return _objectSpread(_objectSpread({
-        height: "".concat(position.top + position.height, "px")
-      }, isShow()), style);
+      return _objectSpread({
+        height: "".concat(position.top + position.height, "px"),
+        top: 0
+      }, isShow());
     }
-    return _objectSpread(_objectSpread({
+    return _objectSpread({
       height: "".concat(window.innerHeight - position.top, "px"),
+      bottom: "0px",
       top: "auto"
-    }, isShow()), style);
+    }, isShow());
   };
-  return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
+  return React__default.createElement(React__default.Fragment, null, closeOnClickAway ? React__default.createElement("div", {
     className: "placeholder-element ".concat(classNames({
       up: direction === "up"
     })),
     style: placeholderStyle(),
     onClick: function onClick() {
-      return parent.toggleItemShow(orderKey);
+      return parent.toggleMenuItem(index);
     }
-  }), React__default.createElement(Overlay, {
+  }) : null, React__default.createElement(Overlay, {
     className: "nut-menu__overlay",
     style: getPosition(),
     lockScroll: parent.lockScroll,
     visible: _showPopup,
-    closeOnOverlayClick: parent.closeOnClickOverlay,
+    closeOnOverlayClick: parent.closeOnOverlayClick,
     onClick: function onClick() {
-      parent.closeOnClickOverlay && parent.toggleItemShow(orderKey);
+      parent.closeOnOverlayClick && parent.toggleMenuItem(index);
     }
   }), React__default.createElement("div", {
-    className: direction === "down" ? "nut-menu-item__wrap" : "nut-menu-item__wrap-up",
-    style: _objectSpread({}, isShow())
+    className: classNames(className, {
+      "nut-menu-item__wrap": direction === "down",
+      "nut-menu-item__wrap-up": direction !== "down"
+    }),
+    style: _objectSpread(_objectSpread({}, style), isShow())
   }, React__default.createElement(CSSTransition, {
     "in": _showPopup,
     timeout: 100,
     classNames: direction === "down" ? "menu-item" : "menu-item-up"
   }, React__default.createElement("div", {
     className: "nut-menu-item__content"
-  }, options === null || options === void 0 ? void 0 : options.map(function(item, index) {
+  }, options === null || options === void 0 ? void 0 : options.map(function(item, index2) {
     return React__default.createElement("div", {
       className: "nut-menu-item__option ".concat(classNames({
         active: item.value === _value
@@ -149,7 +151,7 @@ var MenuItem = forwardRef(function(props, ref) {
       onClick: function onClick() {
         handleClick(item);
       }
-    }, item.value === _value ? React__default.createElement("i", null, optionsIcon || React__default.createElement(Check, {
+    }, item.value === _value ? React__default.createElement("i", null, icon || React__default.createElement(Check, {
       color: activeColor,
       className: getIconCName(item.value, value)
     })) : null, React__default.createElement("div", {

package/dist/esm/NavBar.js

@@ -22,35 +22,21 @@ function _objectSpread(target) {
 }
 import React__default from "react";
 import classNames from "classnames";
-import { Left } from "@nutui/icons-react";
-import { c as cn } from "./bem.js";
 import { C as ComponentDefaults } from "./typings.js";
-import "@bem-react/classname";
 var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
-  title: "",
-  description: "",
-  leftShow: true,
-  className: "",
-  leftText: "",
+  left: "",
+  right: "",
+  back: "",
   fixed: false,
   safeAreaInsetTop: false,
-  border: false,
   placeholder: false,
-  zIndex: 10,
-  style: {}
+  zIndex: 10
 });
 var NavBar = function NavBar2(props) {
   var _classNames;
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), description = _defaultProps$props.description, title = _defaultProps$props.title, 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 _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), right = _defaultProps$props.right, left = _defaultProps$props.left, className = _defaultProps$props.className, style = _defaultProps$props.style, back = _defaultProps$props.back, fixed = _defaultProps$props.fixed, safeAreaInsetTop = _defaultProps$props.safeAreaInsetTop, placeholder = _defaultProps$props.placeholder, zIndex = _defaultProps$props.zIndex, onClickBack = _defaultProps$props.onClickBack;
+  var classPrefix = "nut-navbar";
   var children = Array.isArray(props.children) ? props.children : [props.children];
-  var slot = children.reduce(function(slot2, item) {
-    var data = slot2;
-    if (item && item.props) {
-      data[item.props.slot] = item.props.children;
-    }
-    return data;
-  }, {});
   var styles = function styles2() {
     return _objectSpread(_objectSpread({}, style), {}, {
       zIndex
@@ -58,40 +44,23 @@ var NavBar = function NavBar2(props) {
   };
   var renderLeft = function renderLeft2() {
     return React__default.createElement("div", {
-      className: "".concat(b("left")),
+      className: "".concat(classPrefix, "__left")
+    }, back && React__default.createElement("div", {
+      className: "".concat(classPrefix, "__left__back"),
       onClick: function onClick(e) {
         return onClickBack(e);
       }
-    }, leftShow && React__default.createElement(Left, {
-      name: "left",
-      color: "#979797"
-    }), leftText && React__default.createElement("div", {
-      className: "".concat(b("text"))
-    }, leftText), slot.left);
+    }, back), left);
   };
   var renderContent = function renderContent2() {
     return React__default.createElement("div", {
-      className: "".concat(b("title"))
-    }, title && React__default.createElement("div", {
-      className: "title",
-      onClick: function onClick(e) {
-        return onClickTitle(e);
-      }
-    }, title), slot.titleIcon && React__default.createElement("div", {
-      onClick: function onClick(e) {
-        return onClickIcon(e);
-      }
-    }, slot.titleIcon), slot.content);
+      className: "".concat(classPrefix, "__title")
+    }, children);
   };
   var renderRight = function renderRight2() {
     return React__default.createElement("div", {
-      className: "".concat(b("right")),
-      onClick: function onClick(e) {
-        return onClickRight(e);
-      }
-    }, description && React__default.createElement("div", {
-      className: "".concat(b("text"))
-    }, description), slot.right);
+      className: "".concat(classPrefix, "__right")
+    }, right);
   };
   var renderWrapper = function renderWrapper2() {
     return React__default.createElement("div", {
@@ -99,10 +68,10 @@ var NavBar = function NavBar2(props) {
       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);
+  var classes = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(classPrefix, "--fixed"), fixed), _defineProperty(_classNames, "".concat(classPrefix, "--safe-area-inset-top"), safeAreaInsetTop), _classNames));
+  var cls = classNames(classPrefix, classes, className);
   return React__default.createElement(React__default.Fragment, null, fixed && placeholder ? React__default.createElement("div", {
-    className: "".concat(b(""), "--placeholder")
+    className: "".concat(classPrefix, "--placeholder")
   }, renderWrapper()) : renderWrapper());
 };
 NavBar.defaultProps = defaultProps;

package/dist/esm/Progress.js

@@ -1,6 +1,6 @@
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _excluded = ["className", "style", "isShowPercentage", "percentage", "fillColor", "strokeColor", "strokeWidth", "size", "textColor", "textWidth", "showText", "textInside", "textBackground", "textType", "status", "icon", "children"];
+var _excluded = ["className", "style", "percent", "background", "color", "strokeWidth", "showText", "animated", "children"];
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
   if (Object.getOwnPropertySymbols) {
@@ -24,93 +24,45 @@ function _objectSpread(target) {
 }
 import React__default from "react";
 import classNames from "classnames";
-import { Checked } from "@nutui/icons-react";
-import { c as cn } from "./bem.js";
 import { C as ComponentDefaults } from "./typings.js";
-import "@bem-react/classname";
 var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
-  className: "",
-  style: {},
-  isShowPercentage: true,
-  percentage: 0,
-  fillColor: "#f3f3f3",
-  strokeColor: "linear-gradient(135deg, #fa2c19 0%, #fa6419 100%)",
-  strokeWidth: "",
-  textColor: "",
-  textWidth: "",
-  showText: true,
-  textInside: false,
-  textBackground: "linear-gradient(135deg, #fa2c19 0%, #fa6419 100%)",
-  textType: "text",
-  status: false,
-  icon: null,
-  children: void 0
+  percent: 0,
+  showText: false,
+  animated: false
 });
 var Progress = function Progress2(props) {
-  var _classNames, _classNames2, _classNames4;
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, style = _defaultProps$props.style, isShowPercentage = _defaultProps$props.isShowPercentage, percentage = _defaultProps$props.percentage, fillColor = _defaultProps$props.fillColor, strokeColor = _defaultProps$props.strokeColor, strokeWidth = _defaultProps$props.strokeWidth, size = _defaultProps$props.size, textColor = _defaultProps$props.textColor, textWidth = _defaultProps$props.textWidth, showText = _defaultProps$props.showText, textInside = _defaultProps$props.textInside, textBackground = _defaultProps$props.textBackground, textType = _defaultProps$props.textType, status = _defaultProps$props.status, icon = _defaultProps$props.icon, children = _defaultProps$props.children, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
-  var b = cn("progress");
-  var classes = classNames(b(""));
-  var classesOuter = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(b(""), "-outer"), true), _defineProperty(_classNames, "".concat(b(""), "-").concat(size || "base"), true), _classNames));
-  var classesInner = classNames((_classNames2 = {}, _defineProperty(_classNames2, "".concat(b(""), "-inner"), true), _defineProperty(_classNames2, "".concat(b(""), "-active"), status), _classNames2));
-  var classesText = classNames(_defineProperty({}, "".concat(b(""), "-text"), true));
-  var classesInsideText = classNames((_classNames4 = {}, _defineProperty(_classNames4, "".concat(b(""), "-text"), true), _defineProperty(_classNames4, "".concat(b(""), "-insidetext"), true), _classNames4));
-  var classesTextInner = classNames(_defineProperty({}, "".concat(b(""), "-text__inner"), true));
+  var _classNames;
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, style = _defaultProps$props.style, percent = _defaultProps$props.percent, background = _defaultProps$props.background, color = _defaultProps$props.color, strokeWidth = _defaultProps$props.strokeWidth, showText = _defaultProps$props.showText, animated = _defaultProps$props.animated, children = _defaultProps$props.children, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var classPrefix = "nut-progress";
+  var classesInner = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(classPrefix, "-inner"), true), _defineProperty(_classNames, "".concat(classPrefix, "-active"), animated), _classNames));
   var stylesOuter = {
     height: "".concat(strokeWidth, "px"),
-    // eslint-disable-next-line no-nested-ternary
-    background: "".concat(fillColor)
+    background
   };
   var stylesInner = {
-    width: "".concat(percentage, "%"),
-    // eslint-disable-next-line no-nested-ternary
-    background: "".concat(strokeColor)
-  };
-  var stylesInsideText = {
-    width: "".concat(textWidth, "px"),
-    left: "".concat(percentage, "%"),
-    background: textBackground || strokeColor
-  };
-  var stylesInsideIcon = {
-    width: "".concat(textWidth, "px"),
-    left: "".concat(percentage, "%")
-  };
-  var stylesText = {
-    width: "".concat(textWidth, "px")
+    width: "".concat(percent, "%"),
+    background: color
   };
   return React__default.createElement("div", _objectSpread({
-    className: "".concat(classes, " ").concat(className),
+    className: classNames(classPrefix, className),
     style
   }, rest), React__default.createElement("div", {
-    className: classesOuter,
+    className: "".concat(classPrefix, "-outer"),
     style: stylesOuter
   }, React__default.createElement("div", {
     className: classesInner,
     style: stylesInner
-  }, showText && textInside && React__default.createElement(React__default.Fragment, null, children ? React__default.createElement("div", {
-    className: classesInsideText,
-    style: stylesInsideIcon
-  }, children) : React__default.createElement("div", {
-    className: classesInsideText,
-    style: stylesInsideText
-  }, React__default.createElement("span", {
-    className: classesTextInner,
+  }, showText && React__default.createElement("div", {
+    className: "".concat(classPrefix, "-text"),
     style: {
-      color: textColor
+      left: "".concat(percent, "%")
     }
-  }, percentage, isShowPercentage ? "%" : ""))))), showText && !textInside && React__default.createElement("div", {
-    className: classesText,
-    style: stylesText
-  }, textType === "text" && React__default.createElement("span", {
-    className: classesTextInner,
+  }, children || React__default.createElement("div", {
+    className: "".concat(classPrefix, "-text__inner"),
     style: {
-      color: textColor
+      background: color
     }
-  }, percentage, isShowPercentage ? "%" : ""), textType === "icon" && React__default.createElement(React__default.Fragment, null, icon || React__default.createElement(Checked, {
-    width: 16,
-    height: 16,
-    color: "#439422"
-  }))));
+  }, percent, "%")))));
 };
 Progress.defaultProps = defaultProps;
 Progress.displayName = "NutProgress";

package/dist/esm/Uploader.js

@@ -473,9 +473,8 @@ var InternalUploader = function InternalUploader2(props, ref) {
         return onDeleteItem(item, index);
       }
     }), item.status === "uploading" && React__default.createElement(Progress, {
-      size: "small",
-      percentage: item.percentage,
-      strokeColor: "linear-gradient(270deg, rgba(18,126,255,1) 0%,rgba(32,147,255,1) 32.815625%,rgba(13,242,204,1) 100%)",
+      percent: item.percentage,
+      color: "linear-gradient(270deg, rgba(18,126,255,1) 0%,rgba(32,147,255,1) 32.815625%,rgba(13,242,204,1) 100%)",
       showText: false
     })));
   }), maxCount > fileList.length && previewType === "picture" && !children && React__default.createElement("div", {

package/dist/locales/base.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.0.0-alpha.1 Fri Apr 21 2023 18:05:14 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.2 Wed Apr 26 2023 18:37:18 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/en-US.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.0.0-alpha.1 Fri Apr 21 2023 18:05:14 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.2 Wed Apr 26 2023 18:37:18 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/id-ID.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.0.0-alpha.1 Fri Apr 21 2023 18:05:14 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.2 Wed Apr 26 2023 18:37:18 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/zh-CN.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.0.0-alpha.1 Fri Apr 21 2023 18:05:14 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.2 Wed Apr 26 2023 18:37:18 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/zh-TW.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.0.0-alpha.1 Fri Apr 21 2023 18:05:14 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.2 Wed Apr 26 2023 18:37:18 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/zh-UG.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.0.0-alpha.1 Fri Apr 21 2023 18:05:14 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.2 Wed Apr 26 2023 18:37:18 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */