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

package/dist/esm/Audio.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 = ["className", "url", "style", "muted", "autoplay", "loop", "preload", "type", "onFastBack", "onForward", "onPause", "onPlayEnd", "onMute", "onCanPlay", "children"];
+var _excluded = ["className", "src", "style", "muted", "autoplay", "loop", "preload", "type", "onBack", "onForward", "onPause", "onEnd", "onMute", "onCanPlay", "children"];
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
   if (Object.getOwnPropertySymbols) {
@@ -25,28 +25,25 @@ function _objectSpread(target) {
 }
 import React__default, { useState, useRef, useEffect } from "react";
 import { Service } from "@nutui/icons-react";
+import classNames from "classnames";
 import Range from "./Range.js";
-import { c as cn } from "./bem.js";
 import Button from "./Button.js";
 import { useConfig } from "./ConfigProvider.js";
 import { C as ComponentDefaults } from "./typings.js";
-import "@bem-react/classname";
 var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
-  className: "",
-  url: "",
-  style: {},
+  src: "",
   muted: false,
   autoplay: false,
   loop: false,
   preload: "auto",
   type: "progress",
-  onFastBack: function onFastBack(e) {
+  onBack: function onBack(e) {
   },
   onForward: function onForward(e) {
   },
   onPause: function onPause(e) {
   },
-  onPlayEnd: function onPlayEnd(e) {
+  onEnd: function onEnd(e) {
   },
   onMute: function onMute(e) {
   },
@@ -55,7 +52,7 @@ var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
 });
 var Audio = function Audio2(props) {
   var _useConfig = useConfig(), locale = _useConfig.locale;
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, url = _defaultProps$props.url, style = _defaultProps$props.style, muted = _defaultProps$props.muted, autoplay = _defaultProps$props.autoplay, loop = _defaultProps$props.loop, preload = _defaultProps$props.preload, type = _defaultProps$props.type, onFastBack2 = _defaultProps$props.onFastBack, onForward2 = _defaultProps$props.onForward, onPause2 = _defaultProps$props.onPause, onPlayEnd2 = _defaultProps$props.onPlayEnd, onMute2 = _defaultProps$props.onMute, onCanPlay2 = _defaultProps$props.onCanPlay, children = _defaultProps$props.children, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, src = _defaultProps$props.src, style = _defaultProps$props.style, muted = _defaultProps$props.muted, autoplay = _defaultProps$props.autoplay, loop = _defaultProps$props.loop, preload = _defaultProps$props.preload, type = _defaultProps$props.type, onBack2 = _defaultProps$props.onBack, onForward2 = _defaultProps$props.onForward, onPause2 = _defaultProps$props.onPause, onEnd2 = _defaultProps$props.onEnd, onMute2 = _defaultProps$props.onMute, onCanPlay2 = _defaultProps$props.onCanPlay, children = _defaultProps$props.children, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
   var _useState = useState(false), _useState2 = _slicedToArray(_useState, 2), playing = _useState2[0], setPlaying = _useState2[1];
   var _useState3 = useState(0), _useState4 = _slicedToArray(_useState3, 2), percent = _useState4[0], setPercent = _useState4[1];
   var _useState5 = useState(false), _useState6 = _slicedToArray(_useState5, 2), isCanPlay = _useState6[0], setIsCanPlay = _useState6[1];
@@ -71,13 +68,13 @@ var Audio = function Audio2(props) {
     playing: props.autoplay,
     handPlaying: false
   });
-  var b = cn("audio");
+  var classPrefix = "nut-audio";
   var warn = console.warn;
   var handleEnded = function handleEnded2(e) {
     if (props.loop) {
       warn(locale.audio.tips || "onPlayEnd事件在loop=false时才会触发");
     } else {
-      props.onPlayEnd && props.onPlayEnd(e);
+      props.onEnd && props.onEnd(e);
     }
   };
   function watch() {
@@ -102,20 +99,20 @@ var Audio = function Audio2(props) {
     }
   };
   var renderIcon = function renderIcon2() {
-    return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
-      className: b("icon")
+    return React__default.createElement("div", {
+      className: "".concat(classPrefix, "__icon")
     }, React__default.createElement("div", {
-      className: "".concat(b("icon-box"), " ").concat(playing ? b("icon-play") : b("icon-stop")),
+      className: classNames("".concat(classPrefix, "__icon-box"), playing ? "".concat(classPrefix, "__icon-play") : "".concat(classPrefix, "__icon-stop")),
       onClick: handleStatusChange
     }, React__default.createElement(Service, {
       className: playing ? "nut-icon-loading" : ""
-    }))));
+    })));
   };
   var handleBack = function handleBack2() {
     if (statusRef.current.currentTime > 0 && AudioRef.current) {
       statusRef.current.currentTime--;
       AudioRef.current.currentTime = statusRef.current.currentTime;
-      props.onFastBack && props.onFastBack(AudioRef.current);
+      props.onBack && props.onBack(AudioRef.current);
     }
   };
   var handleForward = function handleForward2() {
@@ -151,11 +148,11 @@ var Audio = function Audio2(props) {
   };
   var renderProgerss = function renderProgerss2() {
     return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
-      className: b("progress")
+      className: "".concat(classPrefix, "__progress")
     }, React__default.createElement("div", {
       className: "time"
     }, currentDuration), React__default.createElement("div", {
-      className: b("progress-bar-wrapper")
+      className: "".concat(classPrefix, "__progress-bar-wrapper")
     }, React__default.createElement(Range, {
       modelValue: percent,
       hiddenTag: true,
@@ -188,7 +185,7 @@ var Audio = function Audio2(props) {
   };
   var renderNone = function renderNone2() {
     return React__default.createElement("div", {
-      className: b("none-container"),
+      className: "".concat(classPrefix, "__none-container"),
       onClick: handleStatusChange
     }, children);
   };
@@ -223,13 +220,13 @@ var Audio = function Audio2(props) {
     statusRef.current.currentTime = time;
   };
   return React__default.createElement("div", _objectSpread({
-    className: "".concat(b(), " ").concat(className),
+    className: classNames(classPrefix, className),
     style
   }, rest), renderAudio(), React__default.createElement("audio", {
     className: "audioMain",
     controls: type === "controls",
     ref: AudioRef,
-    src: url,
+    src,
     muted,
     preload,
     loop,

package/dist/esm/Cascader.js

@@ -651,7 +651,7 @@ var InternalCascader = function InternalCascader2(props, ref) {
     }))));
   };
   return React__default.createElement(React__default.Fragment, null, poppable ? React__default.createElement(Popup, {
-    popClass: "cascadar-popup",
+    className: "cascadar-popup",
     visible,
     position: "bottom",
     round: true,

package/dist/esm/Col.js

@@ -24,13 +24,14 @@ function _objectSpread(target) {
 import React__default, { useState, useContext, useEffect } from "react";
 import classNames from "classnames";
 import { D as DataContext } from "./UserContext.js";
-var defaultProps = {
+import { C as ComponentDefaults } from "./typings.js";
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   span: "24",
   offset: "0",
   gutter: "0"
-};
+});
 var Col = function Col2(props) {
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, _defaultProps$props$s = _defaultProps$props.style, style = _defaultProps$props$s === void 0 ? {} : _defaultProps$props$s, span = _defaultProps$props.span, offset = _defaultProps$props.offset, children = _defaultProps$props.children, _onClick = _defaultProps$props.onClick;
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, style = _defaultProps$props.style, span = _defaultProps$props.span, offset = _defaultProps$props.offset, children = _defaultProps$props.children, _onClick = _defaultProps$props.onClick;
   var _useState = useState(""), _useState2 = _slicedToArray(_useState, 2), colName = _useState2[0], setColName = _useState2[1];
   var _useState3 = useState({}), _useState4 = _slicedToArray(_useState3, 2), colStyle = _useState4[0], setColStyle = _useState4[1];
   var _useContext = useContext(DataContext), gutter = _useContext.gutter;

package/dist/esm/ImagePreview.js

@@ -159,7 +159,7 @@ var ImagePreview = function ImagePreview2(props) {
   };
   return React__default.createElement(Popup, {
     visible: showPop,
-    popClass: "custom-pop",
+    className: "custom-pop",
     style: {
       width: "100%"
     },

package/dist/esm/NumberKeyboard.js

@@ -165,7 +165,7 @@ var NumberKeyboard = function NumberKeyboard2(props) {
   return React__default.createElement("div", null, React__default.createElement(Popup, {
     visible: show,
     position: "bottom",
-    popClass,
+    className: popClass,
     onClickOverlay: onClose2,
     overlay,
     onClickCloseIcon: onClose2,

package/dist/esm/Popup.js

@@ -28,20 +28,17 @@ import classNames from "classnames";
 import { Close } from "@nutui/icons-react";
 import { d as defaultOverlayProps } from "./overlay2.js";
 import Overlay from "./Overlay.js";
-import { c as cn } from "./bem.js";
 import { C as ComponentDefaults } from "./typings.js";
-import "@bem-react/classname";
 var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   position: "center",
   transition: "",
   overlayStyle: {},
-  overlayClass: "",
-  popClass: "",
+  overlayClassName: "",
   closeable: false,
   closeIconPosition: "top-right",
   closeIcon: "close",
-  destroyOnClose: true,
-  teleport: null,
+  destroyOnClose: false,
+  portal: null,
   overlay: true,
   round: false,
   onOpen: function onOpen() {
@@ -50,36 +47,32 @@ var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   },
   onClick: function onClick(e) {
   },
-  onOpened: function onOpened(e) {
-  },
-  onClosed: function onClosed(e) {
-  },
   onClickOverlay: function onClickOverlay(e) {
+    return true;
   },
   onClickCloseIcon: function onClickCloseIcon(e) {
+    return true;
   }
 }, defaultOverlayProps);
 var _zIndex = 1e3;
 var Popup = function Popup2(props) {
-  var _classNames;
-  var children = props.children, visible = props.visible, overlay = props.overlay, closeOnOverlayClick = props.closeOnOverlayClick, overlayStyle = props.overlayStyle, overlayClass = props.overlayClass, zIndex = props.zIndex, lockScroll = props.lockScroll, duration = props.duration, closeable = props.closeable, closeIconPosition = props.closeIconPosition, closeIcon = props.closeIcon, style = props.style, transition = props.transition, round = props.round, position = props.position, popClass = props.popClass, className = props.className, destroyOnClose = props.destroyOnClose, teleport = props.teleport, onOpen2 = props.onOpen, onClose2 = props.onClose, onClickOverlay2 = props.onClickOverlay, onClickCloseIcon2 = props.onClickCloseIcon, onOpened2 = props.onOpened, onClosed2 = props.onClosed, onClick2 = props.onClick;
+  var _classNames, _classNames2;
+  var children = props.children, visible = props.visible, overlay = props.overlay, closeOnOverlayClick = props.closeOnOverlayClick, overlayStyle = props.overlayStyle, overlayClassName = props.overlayClassName, zIndex = props.zIndex, lockScroll = props.lockScroll, duration = props.duration, closeable = props.closeable, closeIconPosition = props.closeIconPosition, closeIcon = props.closeIcon, style = props.style, transition = props.transition, round = props.round, position = props.position, className = props.className, destroyOnClose = props.destroyOnClose, portal = props.portal, onOpen2 = props.onOpen, onClose2 = props.onClose, onClickOverlay2 = props.onClickOverlay, onClickCloseIcon2 = props.onClickCloseIcon, afterShow = props.afterShow, afterClose = props.afterClose, onClick2 = props.onClick;
   var _useState = useState(zIndex || _zIndex), _useState2 = _slicedToArray(_useState, 2), index = _useState2[0], setIndex = _useState2[1];
   var _useState3 = useState(visible), _useState4 = _slicedToArray(_useState3, 2), innerVisible = _useState4[0], setInnerVisible = _useState4[1];
   var _useState5 = useState(true), _useState6 = _slicedToArray(_useState5, 2), showChildren = _useState6[0], setShowChildren = _useState6[1];
   var _useState7 = useState(""), _useState8 = _slicedToArray(_useState7, 2), transitionName = _useState8[0], setTransitionName = _useState8[1];
-  var b = cn("popup");
+  var classPrefix = "nut-popup";
   var baseStyle = {
     zIndex: index,
     animationDuration: "".concat(duration, "s")
   };
   var overlayStyles = _objectSpread(_objectSpread({}, overlayStyle), baseStyle);
   var popStyles = _objectSpread(_objectSpread({}, style), baseStyle);
-  var classes = classNames((_classNames = {
+  var popClassName = classNames((_classNames = {
     round
-  }, _defineProperty(_classNames, "nut-popup-".concat(position), true), _defineProperty(_classNames, "".concat(popClass), true), _defineProperty(_classNames, "".concat(className || ""), true), _classNames), b(""));
-  var closeClasses = classNames(_defineProperty({
-    "nut-popup__close-icon": true
-  }, "nut-popup__close-icon--".concat(closeIconPosition), true));
+  }, _defineProperty(_classNames, "".concat(classPrefix), true), _defineProperty(_classNames, "".concat(classPrefix, "-").concat(position), true), _defineProperty(_classNames, "".concat(className || ""), true), _classNames));
+  var closeClasses = classNames((_classNames2 = {}, _defineProperty(_classNames2, "".concat(classPrefix, "__close-icon"), true), _defineProperty(_classNames2, "".concat(classPrefix, "__close-icon--").concat(closeIconPosition), true), _classNames2));
   var open = function open2() {
     if (!innerVisible) {
       setInnerVisible(true);
@@ -96,29 +89,29 @@ var Popup = function Popup2(props) {
       if (destroyOnClose) {
         setTimeout(function() {
           setShowChildren(false);
-          onClose2 && onClose2();
         }, Number(duration) * 1e3);
       }
+      onClose2 && onClose2();
     }
   };
   var onHandleClickOverlay = function onHandleClickOverlay2(e) {
     if (closeOnOverlayClick) {
-      onClickOverlay2 && onClickOverlay2(e);
-      close();
+      var closed = onClickOverlay2 && onClickOverlay2(e);
+      closed && close();
     }
   };
   var onHandleClick = function onHandleClick2(e) {
     onClick2 && onClick2(e);
   };
   var onHandleClickCloseIcon = function onHandleClickCloseIcon2(e) {
-    onClickCloseIcon2 && onClickCloseIcon2(e);
-    close();
+    var closed = onClickCloseIcon2 && onClickCloseIcon2(e);
+    closed && close();
   };
   var onHandleOpened = function onHandleOpened2(e) {
-    onOpened2 && onOpened2(e);
+    afterShow && afterShow();
   };
   var onHandleClosed = function onHandleClosed2(e) {
-    onClosed2 && onClosed2(e);
+    afterClose && afterClose();
   };
   var resolveContainer = function resolveContainer2(getContainer) {
     var container = typeof getContainer === "function" ? getContainer() : getContainer;
@@ -153,14 +146,14 @@ var Popup = function Popup2(props) {
       onExited: onHandleClosed
     }, React__default.createElement("div", {
       style: popStyles,
-      className: classes,
+      className: popClassName,
       onClick: onHandleClick
     }, showChildren ? children : "", renderIcon()));
   };
   var renderNode = function renderNode2() {
     return React__default.createElement(React__default.Fragment, null, overlay ? React__default.createElement(React__default.Fragment, null, React__default.createElement(Overlay, {
       style: overlayStyles,
-      className: overlayClass,
+      className: overlayClassName,
       visible: innerVisible,
       closeOnOverlayClick,
       zIndex,
@@ -174,9 +167,9 @@ var Popup = function Popup2(props) {
     !visible && close();
   }, [visible]);
   useEffect(function() {
-    setTransitionName(transition || "nut-popup-slide-".concat(position));
-  }, [position]);
-  return React__default.createElement(React__default.Fragment, null, renderToContainer(teleport, renderNode()));
+    setTransitionName(transition || "".concat(classPrefix, "-slide-").concat(position));
+  }, [position, transition]);
+  return React__default.createElement(React__default.Fragment, null, renderToContainer(portal, renderNode()));
 };
 Popup.defaultProps = defaultProps;
 Popup.displayName = "NutPopup";

package/dist/esm/Row.js

@@ -23,23 +23,24 @@ function _objectSpread(target) {
 import React__default from "react";
 import classNames from "classnames";
 import { D as DataContext } from "./UserContext.js";
-var defaultProps = {
+import { C as ComponentDefaults } from "./typings.js";
+var classPrefix = "nut-row";
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   type: "",
   justify: "start",
   align: "flex-start",
   wrap: "nowrap",
   gutter: "0"
-};
+});
 var Row = function Row2(props) {
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, _defaultProps$props$s = _defaultProps$props.style, style = _defaultProps$props$s === void 0 ? {} : _defaultProps$props$s, children = _defaultProps$props.children, type = _defaultProps$props.type, justify = _defaultProps$props.justify, align = _defaultProps$props.align, wrap = _defaultProps$props.wrap, gutter = _defaultProps$props.gutter, _onClick = _defaultProps$props.onClick;
-  var prefixCls = "nut-row";
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, style = _defaultProps$props.style, children = _defaultProps$props.children, type = _defaultProps$props.type, justify = _defaultProps$props.justify, align = _defaultProps$props.align, wrap = _defaultProps$props.wrap, gutter = _defaultProps$props.gutter, _onClick = _defaultProps$props.onClick;
   var getClass = function getClass2(prefix, type2) {
     var classType = type2 ? "nut-row-".concat(prefix, "-").concat(type2) : "";
     var className2 = prefix ? classType : "nut-row-".concat(type2);
     return className2;
   };
   var getClasses = function getClasses2() {
-    return "\n    ".concat(getClass("", type), "\n    ").concat(getClass("justify", justify), "\n    ").concat(getClass("align", align), "\n    ").concat(getClass("flex", wrap), "\n    ").concat(prefixCls, "\n   ");
+    return "\n    ".concat(getClass("", type), "\n    ").concat(getClass("justify", justify), "\n    ").concat(getClass("align", align), "\n    ").concat(getClass("flex", wrap), "\n    ").concat(classPrefix, "\n   ");
   };
   var parentRow = {
     gutter

package/dist/esm/SideNavBar.js

@@ -23,7 +23,6 @@ function _objectSpread(target) {
   return target;
 }
 import React__default from "react";
-import { useConfig } from "./ConfigProvider.js";
 import Popup from "./Popup.js";
 import { h as handleClick, O as OffsetContext } from "./offsetContext.js";
 var defaultProps = {
@@ -32,7 +31,6 @@ var defaultProps = {
   width: "80%"
 };
 var SideNavBar = function SideNavBar2(props) {
-  useConfig();
   var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), title = _defaultProps$props.title, visible = _defaultProps$props.visible, width = _defaultProps$props.width, position = _defaultProps$props.position, children = _defaultProps$props.children, className = _defaultProps$props.className, showhead = _defaultProps$props.showhead, onClose = _defaultProps$props.onClose, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
   var offset = props.offset ? Number(props.offset) : 20;
   return React__default.createElement(Popup, {

package/dist/esm/Uploader.js

@@ -4,7 +4,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _excluded = ["children", "uploadIcon", "uploadIconSize", "uploadIconTip", "name", "accept", "defaultFileList", "listType", "disabled", "multiple", "url", "defaultImg", "headers", "timeout", "method", "xhrState", "withCredentials", "data", "isPreview", "isDeletable", "maximum", "capture", "maximize", "className", "autoUpload", "clearInput", "onStart", "onRemove", "onChange", "onFileItemClick", "onProgress", "onSuccess", "onUpdate", "onFailure", "onOversize", "onBeforeUpload", "onBeforeXhrUpload", "onBeforeDelete"];
+var _excluded = ["children", "uploadIcon", "uploadLabel", "name", "accept", "defaultValue", "value", "previewType", "imageFit", "disabled", "multiple", "url", "previewUrl", "headers", "timeout", "method", "xhrState", "withCredentials", "data", "preview", "deletable", "maxCount", "capture", "maxFileSize", "className", "autoUpload", "clearInput", "onStart", "onDelete", "onChange", "onFileItemClick", "onProgress", "onSuccess", "onUpdate", "onFailure", "onOversize", "beforeUpload", "beforeXhrUpload", "beforeDelete"];
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
   if (Object.getOwnPropertySymbols) {
@@ -30,11 +30,9 @@ import React__default, { useState, useEffect, useImperativeHandle } from "react"
 import classNames from "classnames";
 import { Failure, Loading, Link, Del, Photograph } from "@nutui/icons-react";
 import Progress from "./Progress.js";
-import { c as cn } from "./bem.js";
 import { useConfig } from "./ConfigProvider.js";
 import { i as isPromise } from "./index.js";
 import { C as ComponentDefaults } from "./typings.js";
-import "@bem-react/classname";
 var UploadOptions = /* @__PURE__ */ _createClass(function UploadOptions2() {
   _classCallCheck(this, UploadOptions2);
   _defineProperty(this, "url", "");
@@ -126,29 +124,26 @@ var funcInterceptor = function funcInterceptor2(interceptor, _ref) {
 };
 var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   url: "",
-  maximum: 1,
-  uploadIcon: null,
-  uploadIconSize: "",
-  uploadIconTip: "",
-  listType: "picture",
+  maxCount: 1,
+  previewType: "picture",
+  imageFit: "cover",
   name: "file",
   accept: "*",
   disabled: false,
   autoUpload: true,
   multiple: false,
-  maximize: Number.MAX_VALUE,
+  maxFileSize: Number.MAX_VALUE,
   data: {},
   headers: {},
   method: "post",
-  defaultImg: "",
   xhrState: 200,
   timeout: 1e3 * 30,
   withCredentials: false,
   clearInput: true,
-  isPreview: true,
-  isDeletable: true,
+  preview: true,
+  deletable: true,
   capture: false,
-  onBeforeDelete: function onBeforeDelete(file, files) {
+  beforeDelete: function beforeDelete(file, files) {
     return true;
   }
 });
@@ -166,16 +161,15 @@ var FileItem = /* @__PURE__ */ _createClass(function FileItem2() {
 });
 var InternalUploader = function InternalUploader2(props, ref) {
   var _useConfig = useConfig(), locale = _useConfig.locale;
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, uploadIcon = _defaultProps$props.uploadIcon, uploadIconSize = _defaultProps$props.uploadIconSize, uploadIconTip = _defaultProps$props.uploadIconTip, name = _defaultProps$props.name, accept = _defaultProps$props.accept, defaultFileList = _defaultProps$props.defaultFileList, listType = _defaultProps$props.listType, disabled = _defaultProps$props.disabled, multiple = _defaultProps$props.multiple, url = _defaultProps$props.url, defaultImg = _defaultProps$props.defaultImg, headers = _defaultProps$props.headers, timeout = _defaultProps$props.timeout, method = _defaultProps$props.method, xhrState = _defaultProps$props.xhrState, withCredentials = _defaultProps$props.withCredentials, data = _defaultProps$props.data, isPreview = _defaultProps$props.isPreview, isDeletable = _defaultProps$props.isDeletable, maximum = _defaultProps$props.maximum, capture = _defaultProps$props.capture, maximize = _defaultProps$props.maximize, className = _defaultProps$props.className, autoUpload = _defaultProps$props.autoUpload, clearInput = _defaultProps$props.clearInput, onStart = _defaultProps$props.onStart, onRemove = _defaultProps$props.onRemove, onChange = _defaultProps$props.onChange, onFileItemClick = _defaultProps$props.onFileItemClick, onProgress = _defaultProps$props.onProgress, onSuccess = _defaultProps$props.onSuccess, onUpdate = _defaultProps$props.onUpdate, onFailure = _defaultProps$props.onFailure, onOversize = _defaultProps$props.onOversize, onBeforeUpload = _defaultProps$props.onBeforeUpload, onBeforeXhrUpload = _defaultProps$props.onBeforeXhrUpload, onBeforeDelete2 = _defaultProps$props.onBeforeDelete, restProps = _objectWithoutProperties(_defaultProps$props, _excluded);
-  var _useState = useState([]), _useState2 = _slicedToArray(_useState, 2), fileList = _useState2[0], setFileList = _useState2[1];
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, uploadIcon = _defaultProps$props.uploadIcon, uploadLabel = _defaultProps$props.uploadLabel, name = _defaultProps$props.name, accept = _defaultProps$props.accept, defaultValue = _defaultProps$props.defaultValue, value = _defaultProps$props.value, previewType = _defaultProps$props.previewType, imageFit = _defaultProps$props.imageFit, disabled = _defaultProps$props.disabled, multiple = _defaultProps$props.multiple, url = _defaultProps$props.url, previewUrl = _defaultProps$props.previewUrl, headers = _defaultProps$props.headers, timeout = _defaultProps$props.timeout, method = _defaultProps$props.method, xhrState = _defaultProps$props.xhrState, withCredentials = _defaultProps$props.withCredentials, data = _defaultProps$props.data, preview = _defaultProps$props.preview, deletable = _defaultProps$props.deletable, maxCount = _defaultProps$props.maxCount, capture = _defaultProps$props.capture, maxFileSize = _defaultProps$props.maxFileSize, className = _defaultProps$props.className, autoUpload = _defaultProps$props.autoUpload, clearInput = _defaultProps$props.clearInput, onStart = _defaultProps$props.onStart, onDelete = _defaultProps$props.onDelete, onChange = _defaultProps$props.onChange, onFileItemClick = _defaultProps$props.onFileItemClick, onProgress = _defaultProps$props.onProgress, onSuccess = _defaultProps$props.onSuccess, onUpdate = _defaultProps$props.onUpdate, onFailure = _defaultProps$props.onFailure, onOversize = _defaultProps$props.onOversize, beforeUpload = _defaultProps$props.beforeUpload, beforeXhrUpload = _defaultProps$props.beforeXhrUpload, beforeDelete2 = _defaultProps$props.beforeDelete, restProps = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var _useState = useState(defaultValue || []), _useState2 = _slicedToArray(_useState, 2), fileList = _useState2[0], setFileList = _useState2[1];
   var _useState3 = useState([]), _useState4 = _slicedToArray(_useState3, 2), uploadQueue = _useState4[0], setUploadQueue = _useState4[1];
   useEffect(function() {
-    if (defaultFileList) {
-      setFileList(defaultFileList);
+    if (value) {
+      setFileList(value);
     }
-  }, [defaultFileList]);
-  var b = cn("uploader");
-  var classes = classNames(className, b(""));
+  }, [value]);
+  var classes = classNames(className, "nut-uploader");
   useImperativeHandle(ref, function() {
     return {
       submit: function submit() {
@@ -208,8 +202,8 @@ var InternalUploader = function InternalUploader2(props, ref) {
     var uploadOption = new UploadOptions();
     uploadOption.url = url;
     for (var _i2 = 0, _Object$entries2 = Object.entries(data); _i2 < _Object$entries2.length; _i2++) {
-      var _Object$entries2$_i = _slicedToArray(_Object$entries2[_i2], 2), key = _Object$entries2$_i[0], value = _Object$entries2$_i[1];
-      fileItem.formData.append(key, value);
+      var _Object$entries2$_i = _slicedToArray(_Object$entries2[_i2], 2), key = _Object$entries2$_i[0], value2 = _Object$entries2$_i[1];
+      fileItem.formData.append(key, value2);
     }
     uploadOption.formData = fileItem.formData;
     uploadOption.timeout = timeout * 1;
@@ -217,7 +211,7 @@ var InternalUploader = function InternalUploader2(props, ref) {
     uploadOption.xhrState = xhrState;
     uploadOption.headers = headers;
     uploadOption.withCredentials = withCredentials;
-    uploadOption.beforeXhrUpload = onBeforeXhrUpload;
+    uploadOption.beforeXhrUpload = beforeXhrUpload;
     try {
       uploadOption.sourceFile = fileItem.formData.get(name);
     } catch (error) {
@@ -315,7 +309,7 @@ var InternalUploader = function InternalUploader2(props, ref) {
         fileItem.message = locale.uploader.waitingUpload;
       }
       executeUpload(fileItem, index);
-      if (isPreview && file.type.includes("image")) {
+      if (preview && file.type.includes("image")) {
         var reader = new FileReader();
         reader.onload = function(event) {
           fileItem.url = event.target.result;
@@ -330,10 +324,10 @@ var InternalUploader = function InternalUploader2(props, ref) {
     });
   };
   var filterFiles = function filterFiles2(files) {
-    var maximum2 = props.maximum * 1;
+    var maximum = props.maxCount * 1;
     var oversizes = new Array();
     var filterFile = files.filter(function(file) {
-      if (file.size > maximize) {
+      if (file.size > maxFileSize) {
         oversizes.push(file);
         return false;
       }
@@ -342,23 +336,23 @@ var InternalUploader = function InternalUploader2(props, ref) {
     if (oversizes.length) {
       onOversize && onOversize(files);
     }
-    if (filterFile.length > maximum2) {
-      filterFile.splice(maximum2, filterFile.length - maximum2);
+    if (filterFile.length > maximum) {
+      filterFile.splice(maximum, filterFile.length - maximum);
     }
     if (fileList.length !== 0) {
-      var index = maximum2 - fileList.length;
+      var index = maximum - fileList.length;
       filterFile.splice(index, filterFile.length - index);
     }
     return filterFile;
   };
   var deleted = function deleted2(file, index) {
     fileList.splice(index, 1);
-    onRemove && onRemove(file, fileList);
+    onDelete && onDelete(file, fileList);
     setFileList(_toConsumableArray(fileList));
   };
-  var onDelete = function onDelete2(file, index) {
+  var onDeleteItem = function onDeleteItem2(file, index) {
     clearUploadQueue(index);
-    funcInterceptor(onBeforeDelete2, {
+    funcInterceptor(beforeDelete2, {
       args: [file, fileList],
       done: function done() {
         return deleted(file, index);
@@ -371,8 +365,8 @@ var InternalUploader = function InternalUploader2(props, ref) {
     }
     var $el = event.target;
     var files = $el.files;
-    if (onBeforeUpload) {
-      onBeforeUpload(new Array().slice.call(files)).then(function(f) {
+    if (beforeUpload) {
+      beforeUpload(new Array().slice.call(files)).then(function(f) {
         var _files2 = filterFiles(new Array().slice.call(f));
         readFile(_files2);
       });
@@ -395,7 +389,7 @@ var InternalUploader = function InternalUploader2(props, ref) {
     className: classes
   }, restProps), children && React__default.createElement("div", {
     className: "nut-uploader__slot"
-  }, React__default.createElement(React__default.Fragment, null, children, maximum > fileList.length && React__default.createElement(React__default.Fragment, null, capture ? React__default.createElement("input", {
+  }, React__default.createElement(React__default.Fragment, null, children, maxCount > fileList.length && React__default.createElement(React__default.Fragment, null, capture ? React__default.createElement("input", {
     className: "nut-uploader__input",
     type: "file",
     capture: "user",
@@ -414,15 +408,15 @@ var InternalUploader = function InternalUploader2(props, ref) {
     onChange: fileChange
   })))), fileList.length !== 0 && fileList.map(function(item, index) {
     return React__default.createElement("div", {
-      className: "nut-uploader__preview ".concat(listType),
+      className: "nut-uploader__preview ".concat(previewType),
       key: item.uid
-    }, listType === "picture" && !children && React__default.createElement("div", {
+    }, previewType === "picture" && !children && React__default.createElement("div", {
       className: "nut-uploader__preview-img"
-    }, isDeletable && React__default.createElement(Failure, {
+    }, deletable && React__default.createElement(Failure, {
       color: "rgba(0,0,0,0.6)",
       className: "close",
       onClick: function onClick() {
-        return onDelete(item, index);
+        return onDeleteItem(item, index);
       }
     }), item.status === "ready" ? React__default.createElement("div", {
       className: "nut-uploader__preview__progress"
@@ -433,19 +427,23 @@ var InternalUploader = function InternalUploader2(props, ref) {
     }, item.failIcon !== " " && item.loadingIcon !== " " && (item.status === "error" ? item.failIcon || React__default.createElement(Failure, {
       color: "#fff"
     }) : item.loadingIcon || React__default.createElement(Loading, {
+      className: "nut-icon-loading",
       color: "#fff"
     })), React__default.createElement("div", {
       className: "nut-uploader__preview__progress__msg"
     }, item.message)), item.type.includes("image") ? React__default.createElement(React__default.Fragment, null, item.url && React__default.createElement("img", {
       className: "nut-uploader__preview-img__c",
+      style: {
+        objectFit: imageFit
+      },
       src: item.url,
       alt: "",
       onClick: function onClick() {
         return handleItemClick(item);
       }
-    })) : React__default.createElement(React__default.Fragment, null, defaultImg ? React__default.createElement("img", {
+    })) : React__default.createElement(React__default.Fragment, null, previewUrl ? React__default.createElement("img", {
       className: "nut-uploader__preview-img__c",
-      src: defaultImg,
+      src: previewUrl,
       alt: "",
       onClick: function onClick() {
         return handleItemClick(item);
@@ -461,18 +459,18 @@ var InternalUploader = function InternalUploader2(props, ref) {
       color: "#808080"
     }), " ", item.name))), item.status === "success" ? React__default.createElement("div", {
       className: "tips"
-    }, item.name) : null), listType === "list" && React__default.createElement("div", {
+    }, item.name) : null), previewType === "list" && React__default.createElement("div", {
       className: "nut-uploader__preview-list"
     }, React__default.createElement("div", {
       className: "nut-uploader__preview-img__file__name ".concat(item.status),
       onClick: function onClick() {
         return handleItemClick(item);
       }
-    }, React__default.createElement(Link, null), " ", item.name), isDeletable && React__default.createElement(Del, {
+    }, React__default.createElement(Link, null), " ", item.name), deletable && React__default.createElement(Del, {
       color: "#808080",
       className: "nut-uploader__preview-img__file__del",
       onClick: function onClick() {
-        return onDelete(item, index);
+        return onDeleteItem(item, index);
       }
     }), item.status === "uploading" && React__default.createElement(Progress, {
       size: "small",
@@ -480,17 +478,17 @@ var InternalUploader = function InternalUploader2(props, ref) {
       strokeColor: "linear-gradient(270deg, rgba(18,126,255,1) 0%,rgba(32,147,255,1) 32.815625%,rgba(13,242,204,1) 100%)",
       showText: false
     })));
-  }), maximum > fileList.length && listType === "picture" && !children && React__default.createElement("div", {
-    className: "nut-uploader__upload ".concat(listType, " ").concat(disabled ? "nut-uploader__upload-disabled" : "")
+  }), maxCount > fileList.length && previewType === "picture" && !children && React__default.createElement("div", {
+    className: "nut-uploader__upload ".concat(previewType, " ").concat(disabled ? "nut-uploader__upload-disabled" : "")
   }, React__default.createElement("div", {
     className: "nut-uploader__icon"
   }, uploadIcon || React__default.createElement(Photograph, {
-    width: uploadIconSize,
-    height: uploadIconSize,
+    width: "20px",
+    height: "20px",
     color: "#808080"
   }), React__default.createElement("span", {
     className: "nut-uploader__icon-tip"
-  }, uploadIconTip)), capture ? React__default.createElement("input", {
+  }, uploadLabel)), capture ? React__default.createElement("input", {
     className: "nut-uploader__input",
     type: "file",
     capture: "user",

package/dist/locales/base.js

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