@arco-design/mobile-react 2.30.10 → 2.31.1

package/cjs/icon/IconDownload/index.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports.default = IconDownload;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _contextProvider = require("../../context-provider");
+
+var _excluded = ["className", "useCurrentColor", "style"];
+
+function IconDownload(props) {
+  var _props$className = props.className,
+      className = _props$className === void 0 ? '' : _props$className,
+      _props$useCurrentColo = props.useCurrentColor,
+      useCurrentColor = _props$useCurrentColo === void 0 ? true : _props$useCurrentColo,
+      style = props.style,
+      other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, function (_ref) {
+    var prefixCls = _ref.prefixCls;
+    return /*#__PURE__*/_react.default.createElement("svg", (0, _extends2.default)({
+      className: prefixCls + "-icon " + prefixCls + "-icon-download " + className,
+      width: "1em",
+      height: "1em",
+      style: style,
+      fill: useCurrentColor ? 'currentColor' : '#000',
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 16 16"
+    }, other), /*#__PURE__*/_react.default.createElement("path", {
+      d: "M7.3,8.8V1.7h1.3v7.1l1.9-1.9l0.9,0.9L8,11.3L4.5,7.8l0.9-0.9L7.3,8.8z M3.3,13v-1.3H2v2.7h12v-2.7\th-1.3V13H3.3z",
+      fillRule: "evenodd",
+      clipRule: "evenodd"
+    }));
+  });
+}

package/cjs/icon/IconFile/index.d.ts

@@ -0,0 +1,7 @@
+import { SVGAttributes, CSSProperties } from 'react';
+export interface IconProps extends SVGAttributes<SVGElement> {
+    className?: string;
+    useCurrentColor?: boolean;
+    style?: CSSProperties;
+}
+export default function IconFile(props: IconProps): JSX.Element;

package/cjs/icon/IconFile/index.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports.default = IconFile;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _contextProvider = require("../../context-provider");
+
+var _excluded = ["className", "useCurrentColor", "style"];
+
+function IconFile(props) {
+  var _props$className = props.className,
+      className = _props$className === void 0 ? '' : _props$className,
+      _props$useCurrentColo = props.useCurrentColor,
+      useCurrentColor = _props$useCurrentColo === void 0 ? true : _props$useCurrentColo,
+      style = props.style,
+      other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, function (_ref) {
+    var prefixCls = _ref.prefixCls;
+    return /*#__PURE__*/_react.default.createElement("svg", (0, _extends2.default)({
+      className: prefixCls + "-icon " + prefixCls + "-icon-file " + className,
+      width: "1em",
+      height: "1em",
+      style: style,
+      fill: useCurrentColor ? 'currentColor' : '#000',
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 16 16"
+    }, other), /*#__PURE__*/_react.default.createElement("path", {
+      d: "M2.3,2.7c0-0.7,0.6-1.3,1.3-1.3h7.3l2.7,2.7v9.3c0,0.7-0.6,1.3-1.3,1.3H3.7c-0.7,0-1.3-0.6-1.3-1.3\tV2.7z M10.4,2.7H3.7v10.7h8.7V4.6L10.4,2.7z M10.7,7.7H5.3V6.3h5.3V7.7z M8.7,10.3H5.3V9h3.3V10.3z",
+      fillRule: "evenodd",
+      clipRule: "evenodd"
+    }));
+  });
+}

package/cjs/icon/IconKeyboard/index.js

@@ -30,6 +30,7 @@ function IconKeyboard(props) {
       height: "1em",
       style: style,
       version: "1.1",
+      id: "svg_388a56dbb6__\u56FE\u5C42_1",
       xmlns: "http://www.w3.org/2000/svg",
       x: "0",
       y: "0",

package/cjs/icon/IconQuestionCircle/index.js

@@ -35,8 +35,7 @@ function IconQuestionCircle(props) {
     }, other), /*#__PURE__*/_react.default.createElement("path", {
       fillRule: "evenodd",
       clipRule: "evenodd",
-      d: "M7.982.68a7.312 7.312 0 110 14.625 7.312 7.312 0 010-14.625zm0 1.33a5.983 5.983 0 100 11.965 5.983 5.983 0 000-11.966zm.333 8.641c.183 0 .332.15.332.333v.664a.332.332 0 01-.332.333H7.65a.332.332 0 01-.332-.333v-.664c0-.184.148-.333.332-.333h.665zm-.427-6.647c.79 0 1.447.19 1.97.574.522.382.784.95.784 1.7 0 .461-.114.85-.341 1.165-.133.191-.389.436-.766.733l-.373.293c-.202.16-.337.345-.403.558a1.8 1.8 0 00-.048.323.332.332 0 01-.331.304h-.744a.332.332 0 01-.331-.363c.043-.463.088-.755.137-.878.091-.229.325-.492.703-.79l.383-.302c.126-.096.774-.553.774-.957 0-.405-.07-.553-.273-.775-.203-.222-.66-.294-1.073-.294-.405 0-.752.108-.922.38a1.921 1.921 0 00-.189.4 1.388 1.388 0 00-.048.204.332.332 0 01-.328.276h-.782a.332.332 0 01-.33-.37c.008-.074.017-.136.025-.185.13-.722.458-1.253.985-1.592.413-.27.92-.404 1.521-.404z",
-      fill: useCurrentColor ? 'currentColor' : '#000'
+      d: "M7.982.68a7.312 7.312 0 110 14.625 7.312 7.312 0 010-14.625zm0 1.33a5.983 5.983 0 100 11.965 5.983 5.983 0 000-11.966zm.333 8.641c.183 0 .332.15.332.333v.664a.332.332 0 01-.332.333H7.65a.332.332 0 01-.332-.333v-.664c0-.184.148-.333.332-.333h.665zm-.427-6.647c.79 0 1.447.19 1.97.574.522.382.784.95.784 1.7 0 .461-.114.85-.341 1.165-.133.191-.389.436-.766.733l-.373.293c-.202.16-.337.345-.403.558a1.8 1.8 0 00-.048.323.332.332 0 01-.331.304h-.744a.332.332 0 01-.331-.363c.043-.463.088-.755.137-.878.091-.229.325-.492.703-.79l.383-.302c.126-.096.774-.553.774-.957 0-.405-.07-.553-.273-.775-.203-.222-.66-.294-1.073-.294-.405 0-.752.108-.922.38a1.921 1.921 0 00-.189.4 1.388 1.388 0 00-.048.204.332.332 0 01-.328.276h-.782a.332.332 0 01-.33-.37c.008-.074.017-.136.025-.185.13-.722.458-1.253.985-1.592.413-.27.92-.404 1.521-.404z"
     }));
   });
 }

package/cjs/icon/IconUpload/index.js

@@ -30,10 +30,12 @@ function IconUpload(props) {
       height: "1em",
       style: style,
       fill: useCurrentColor ? 'currentColor' : '#000',
-      viewBox: "0 0 1024 1024",
-      xmlns: "http://www.w3.org/2000/svg"
-    }, other), /*#__PURE__*/_react.default.createElement("defs", null), /*#__PURE__*/_react.default.createElement("path", {
-      d: "M192 768c12.8 0 19.2 6.4 19.2 19.2v64h595.2v-64c0-12.8 6.4-19.2 19.2-19.2h44.8c12.8 0 19.2 6.4 19.2 19.2V896c0 25.6-19.2 44.8-44.8 44.8h-672c-25.6 0-44.8-19.2-44.8-44.8V787.2c0-12.8 6.4-19.2 19.2-19.2H192zM531.2 89.6l211.2 211.2c6.4 6.4 6.4 19.2 0 32l-32 32c-6.4 6.4-19.2 6.4-32 0l-128-128v473.6c0 12.8-6.4 19.2-19.2 19.2h-38.4c-12.8 0-19.2-6.4-19.2-19.2V249.6L352 364.8c-6.4 6.4-25.6 6.4-32 0l-32-32c-6.4-6.4-6.4-19.2 0-32L499.2 89.6c12.8-6.4 25.6-6.4 32 0z"
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 14 14"
+    }, other), /*#__PURE__*/_react.default.createElement("path", {
+      d: "M7,1.5l3.1,3.1L9.2,5.4L7.6,3.7v5.9H6.4V3.7L4.8,5.4L3.9,4.6L7,1.5z M2.9,11.4v-1.2H1.8v2.3h10.5\tv-2.3h-1.2v1.2H2.9z",
+      fillRule: "evenodd",
+      clipRule: "evenodd"
     }));
   });
 }

package/cjs/icon/IconUserFill/index.js

@@ -33,8 +33,7 @@ function IconUserFill(props) {
       fill: useCurrentColor ? 'currentColor' : '#000',
       xmlns: "http://www.w3.org/2000/svg"
     }, other), /*#__PURE__*/_react.default.createElement("path", {
-      d: "M12.5 10.833c2.301 0 5 1.786 5 5v2.5c0 .46-.373.834-.833.834H3.333a.833.833 0 01-.833-.834v-2.5c0-3.211 2.699-5 5-5h5zM10 1.25a4.167 4.167 0 110 8.333 4.167 4.167 0 010-8.333z",
-      fill: useCurrentColor ? 'currentColor' : '#000'
+      d: "M12.5 10.833c2.301 0 5 1.786 5 5v2.5c0 .46-.373.834-.833.834H3.333a.833.833 0 01-.833-.834v-2.5c0-3.211 2.699-5 5-5h5zM10 1.25a4.167 4.167 0 110 8.333 4.167 4.167 0 010-8.333z"
     }));
   });
 }

package/cjs/icon/index.d.ts

@@ -1,4 +1,3 @@
-export { default as IconUpload } from './IconUpload';
 export { default as IconSquareChecked } from './IconSquareChecked';
 export { default as IconTriUp } from './IconTriUp';
 export { default as IconMore } from './IconMore';
@@ -54,4 +53,7 @@ export { default as IconGift } from './IconGift';
 export { default as IconStarHalf } from './IconStarHalf';
 export { default as IconKeyboard } from './IconKeyboard';
 export { default as IconKeyboardDelete } from './IconKeyboardDelete';
+export { default as IconDownload } from './IconDownload';
+export { default as IconFile } from './IconFile';
+export { default as IconUpload } from './IconUpload';
 export * from './type';

package/cjs/icon/index.js

@@ -4,7 +4,6 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 
 exports.__esModule = true;
 var _exportNames = {
-  IconUpload: true,
   IconSquareChecked: true,
   IconTriUp: true,
   IconMore: true,
@@ -59,13 +58,12 @@ var _exportNames = {
   IconGift: true,
   IconStarHalf: true,
   IconKeyboard: true,
-  IconKeyboardDelete: true
+  IconKeyboardDelete: true,
+  IconDownload: true,
+  IconFile: true,
+  IconUpload: true
 };
-exports.IconWarnCircleFill = exports.IconWarnCircle = exports.IconUserFill = exports.IconUser = exports.IconUpload = exports.IconTriUp = exports.IconTriDown = exports.IconSuccessCircle = exports.IconSubway = exports.IconStarHalf = exports.IconStarFill = exports.IconStar = exports.IconSquareUnchecked = exports.IconSquareDisabled = exports.IconSquareChecked = exports.IconSound = exports.IconSmileFill = exports.IconShopping = exports.IconShop = exports.IconSetting = exports.IconSearch = exports.IconScan = exports.IconSad = exports.IconRefresh = exports.IconQuestionCircle = exports.IconPlay = exports.IconPicture = exports.IconNoticeOff = exports.IconNotice = exports.IconMore = exports.IconMinus = exports.IconLikeCircle = exports.IconKeyboardDelete = exports.IconKeyboard = exports.IconHome = exports.IconHeart = exports.IconGift = exports.IconEyelashInvisible = exports.IconEyeVisible = exports.IconEyeInvisible = exports.IconErrorCircle = exports.IconEdit = exports.IconDelete = exports.IconCloseBold = exports.IconClose = exports.IconClear = exports.IconCircleUnchecked = exports.IconCircleDisabled = exports.IconCircleChecked = exports.IconCheckBold = exports.IconCheck = exports.IconArrowUp = exports.IconArrowIn = exports.IconArrowDown = exports.IconArrowBack = exports.IconAdd = void 0;
-
-var _IconUpload = _interopRequireDefault(require("./IconUpload"));
-
-exports.IconUpload = _IconUpload.default;
+exports.IconWarnCircleFill = exports.IconWarnCircle = exports.IconUserFill = exports.IconUser = exports.IconUpload = exports.IconTriUp = exports.IconTriDown = exports.IconSuccessCircle = exports.IconSubway = exports.IconStarHalf = exports.IconStarFill = exports.IconStar = exports.IconSquareUnchecked = exports.IconSquareDisabled = exports.IconSquareChecked = exports.IconSound = exports.IconSmileFill = exports.IconShopping = exports.IconShop = exports.IconSetting = exports.IconSearch = exports.IconScan = exports.IconSad = exports.IconRefresh = exports.IconQuestionCircle = exports.IconPlay = exports.IconPicture = exports.IconNoticeOff = exports.IconNotice = exports.IconMore = exports.IconMinus = exports.IconLikeCircle = exports.IconKeyboardDelete = exports.IconKeyboard = exports.IconHome = exports.IconHeart = exports.IconGift = exports.IconFile = exports.IconEyelashInvisible = exports.IconEyeVisible = exports.IconEyeInvisible = exports.IconErrorCircle = exports.IconEdit = exports.IconDownload = exports.IconDelete = exports.IconCloseBold = exports.IconClose = exports.IconClear = exports.IconCircleUnchecked = exports.IconCircleDisabled = exports.IconCircleChecked = exports.IconCheckBold = exports.IconCheck = exports.IconArrowUp = exports.IconArrowIn = exports.IconArrowDown = exports.IconArrowBack = exports.IconAdd = void 0;
 
 var _IconSquareChecked = _interopRequireDefault(require("./IconSquareChecked"));
 
@@ -287,6 +285,18 @@ var _IconKeyboardDelete = _interopRequireDefault(require("./IconKeyboardDelete")
 
 exports.IconKeyboardDelete = _IconKeyboardDelete.default;
 
+var _IconDownload = _interopRequireDefault(require("./IconDownload"));
+
+exports.IconDownload = _IconDownload.default;
+
+var _IconFile = _interopRequireDefault(require("./IconFile"));
+
+exports.IconFile = _IconFile.default;
+
+var _IconUpload = _interopRequireDefault(require("./IconUpload"));
+
+exports.IconUpload = _IconUpload.default;
+
 var _type = require("./type");
 
 Object.keys(_type).forEach(function (key) {

package/cjs/icon/type.d.ts

@@ -1,8 +1,10 @@
 /// <reference types="react" />
-export interface IconProps extends React.SVGProps<SVGSVGElement> {
+export interface OriginIconProps extends React.SVGProps<SVGSVGElement> {
     className?: string;
     prefix?: string;
     width?: string;
     height?: string;
     useCurrentColor?: boolean;
+    spin?: boolean;
 }
+export declare type IconProps = React.PropsWithoutRef<OriginIconProps> & React.RefAttributes<SVGSVGElement>;

package/cjs/image/style/css/index.css

@@ -95,6 +95,56 @@
  * }
  * ```
  */
+/**
+ * 设置涉及左右相关的属性名，在rtl模式下自动替换为相反的属性名
+ * @desc {en} set the property name related to left and right, and automatically replace it with the opposite attribute name in rtl mode
+ * @param @property css属性名
+ * @param @property {en} css property
+ * @param @value css属性值
+ * @param @value {en} css property value
+ * @param @rules 自定义的复写规则，默认重置为initial
+ * @param @rules {en} customized rewrite rules, default to initial
+ * @example
+ * ```
+ * @import '@arco-design/mobile-utils/style/mixin.less';
+ *
+ * .demo {
+ *   .set-prop-with-rtl(right, auto);
+ * }
+ * ```
+ */
+/**
+ * 设置涉及左右相关的属性值，在rtl模式下自动替换为相反的属性值
+ * @desc {en} set the property value related to left and right, and automatically replace it with the opposite attribute value in rtl mode
+ * @param @property css属性名
+ * @param @property {en} css property
+ * @param @value css属性值
+ * @param @value {en} css property value
+ * @example
+ * ```
+ * @import '@arco-design/mobile-utils/style/mixin.less';
+ *
+ * .demo {
+ *   .set-value-with-rtl(text-align, left);
+ * }
+ * ```
+ */
+/**
+ * 在 rtl 模式下，自定义样式规则
+ * @desc {en} custom style in RTL mode
+ * @param @rules 对应的rtl模式下的规则
+ * @param @rules {en} property with rtl
+ * @example
+ * ```
+ * @import '@arco-design/mobile-react/style/mixin.less';
+ *
+ * .demo {
+ *     .style-with-rtl({
+ *         transform: scale(-1);
+ *     });
+ * }
+ * ```
+ */
 /**
  * 0.5px 的边框线
  * @desc {en} a border line of 0.5 pixels
@@ -396,40 +446,6 @@
  * }
  * ```
  */
-/**
- * 设置涉及左右相关的属性名，在rtl模式下自动替换为相反的属性名
- * @desc {en} set the property name related to left and right, and automatically replace it with the opposite attribute name in rtl mode
- * @param @property css属性名
- * @param @property {en} css property
- * @param @value css属性值
- * @param @value {en} css property value
- * @param @rules 自定义的复写规则，默认重置为initial
- * @param @rules {en} customized rewrite rules, default to initial
- * @example
- * ```
- * @import '@arco-design/mobile-utils/style/mixin.less';
- *
- * .demo {
- *   .set-prop-with-rtl(right, auto);
- * }
- * ```
- */
-/**
- * 设置涉及左右相关的属性值，在rtl模式下自动替换为相反的属性值
- * @desc {en} set the property value related to left and right, and automatically replace it with the opposite attribute value in rtl mode
- * @param @property css属性名
- * @param @property {en} css property
- * @param @value css属性值
- * @param @value {en} css property value
- * @example
- * ```
- * @import '@arco-design/mobile-utils/style/mixin.less';
- *
- * .demo {
- *   .set-value-with-rtl(text-align, left);
- * }
- * ```
- */
 /**
  * 设置Loading组件颜色
  * @desc {en} set Loading component color

package/cjs/image-picker/index.js

@@ -10,8 +10,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _es6Promise = require("es6-promise");
-
 var _mobileUtils = require("@arco-design/mobile-utils");
 
 var _contextProvider = require("../context-provider");
@@ -26,6 +24,8 @@ var _addIcon = _interopRequireDefault(require("./add-icon"));
 
 var _helpers = require("../_helpers");
 
+var _upload = require("../uploader/upload");
+
 var _type = require("./type");
 
 Object.keys(_type).forEach(function (key) {
@@ -56,7 +56,6 @@ var ImagePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       limit = _props$limit === void 0 ? 0 : _props$limit,
       _props$images = props.images,
       images = _props$images === void 0 ? [] : _props$images,
-      maxSize = props.maxSize,
       disabled = props.disabled,
       deleteIcon = props.deleteIcon,
       selectIcon = props.selectIcon,
@@ -69,18 +68,7 @@ var ImagePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       imageProps = props.imageProps,
       renderLoading = props.renderLoading,
       renderError = props.renderError,
-      onLongPress = props.onLongPress,
-      onClick = props.onClick,
-      _props$onChange = props.onChange,
-      onChange = _props$onChange === void 0 ? function () {
-    return null;
-  } : _props$onChange,
-      onMaxSizeExceed = props.onMaxSizeExceed,
-      onLimitExceed = props.onLimitExceed,
-      upload = props.upload,
-      selectAdapter = props.selectAdapter,
-      onSelectClick = props.onSelectClick,
-      onDeleteClick = props.onDeleteClick;
+      selectAdapter = props.selectAdapter;
   var domRef = (0, _react.useRef)(null);
   var fileRef = (0, _react.useRef)(null);
   var cacheRef = (0, _helpers.useLatestRef)(images);
@@ -89,143 +77,9 @@ var ImagePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       dom: domRef.current
     };
   });
-
-  var parseFile = function parseFile(file) {
-    return new _es6Promise.Promise(function (resolve, reject) {
-      if (file.url) {
-        resolve(file.url);
-      } else {
-        var reader = new FileReader();
-
-        reader.onload = function (e) {
-          var _e$target;
-
-          var dataURL = (_e$target = e.target) == null ? void 0 : _e$target.result;
-
-          if (!dataURL) {
-            reject(new Error('file parse error'));
-          }
-
-          resolve(dataURL);
-        };
-
-        reader.onerror = function () {
-          reject(new Error('file parse error'));
-        };
-
-        reader.readAsDataURL(file);
-      }
-    });
-  };
-
-  var handleChange = function handleChange(event, fromAdapter) {
-    var files = Array.prototype.filter.call(event.target.files || [], function (file) {
-      // 过滤maxSize
-      if (maxSize && file.size > maxSize * 1024) {
-        onMaxSizeExceed && onMaxSizeExceed(file);
-        return false;
-      }
-
-      return true;
-    }) || [];
-
-    if (!fromAdapter) {
-      event.target.value = '';
-    } // 截断limit
-
-
-    if (limit !== 0 && files.length + images.length > limit) {
-      onLimitExceed && onLimitExceed(files);
-      files.length = limit - images.length;
-    } // 解析文件生成预览
-
-
-    _es6Promise.Promise.all(files.map(function (file) {
-      return parseFile(file);
-    })).then(function (parseFiles) {
-      var res = parseFiles.map(function (url, index) {
-        return {
-          url: url,
-          status: typeof upload === 'function' ? 'loading' : 'loaded',
-          file: files[index]
-        };
-      });
-      cacheRef.current = [].concat(cacheRef.current, res);
-      onChange([].concat(cacheRef.current)); // 执行upload
-
-      if (typeof upload === 'function') {
-        files.forEach(function (_file) {
-          upload(cacheRef.current.find(function (_ref) {
-            var file = _ref.file;
-            return file === _file;
-          })).then(function (data) {
-            var index = cacheRef.current.findIndex(function (_ref2) {
-              var file = _ref2.file;
-              return file === _file;
-            });
-
-            if (index !== -1) {
-              cacheRef.current[index] = (0, _extends2.default)({}, cacheRef.current[index], data, {
-                status: undefined
-              });
-            }
-          }).catch(function () {
-            var index = cacheRef.current.findIndex(function (_ref3) {
-              var file = _ref3.file;
-              return file === _file;
-            });
-
-            if (index !== -1) {
-              cacheRef.current[index].status = 'error';
-            }
-          }).finally(function () {
-            onChange([].concat(cacheRef.current));
-          });
-        });
-      }
-    });
-  };
-
-  var handleDelete = function handleDelete(index) {
-    onDeleteClick && onDeleteClick(index);
-    onChange(images.filter(function (_i, j) {
-      return j !== index;
-    }));
-  }; // click && longPress
-
-
-  var timeOutEvent;
-
-  var handleTouchStart = function handleTouchStart(e, image, index) {
-    timeOutEvent = setTimeout(function () {
-      timeOutEvent = 0;
-      onLongPress == null ? void 0 : onLongPress(e, image, index);
-    }, 750);
-  };
-
-  var handleClick = function handleClick(e, image, index) {
-    clearTimeout(timeOutEvent);
-
-    if (timeOutEvent !== 0) {
-      onClick == null ? void 0 : onClick(e, image, index);
-    }
-  };
-
-  var handleSelect = function handleSelect(e) {
-    if (e.target !== fileRef.current) {
-      var _fileRef$current;
-
-      onSelectClick && onSelectClick();
-      selectAdapter ? selectAdapter().then(function (_ref4) {
-        var files = _ref4.files;
-        return handleChange({
-          target: {
-            files: files
-          }
-        }, true);
-      }) : (_fileRef$current = fileRef.current) == null ? void 0 : _fileRef$current.click();
-    }
-  };
+  var uploadFunc = new _upload.Upload((0, _extends2.default)({}, props, {
+    files: images
+  }), fileRef, cacheRef);
 
   var getGridData = function getGridData(prefixCls, locale) {
     var errorNode = function errorNode(index) {
@@ -255,10 +109,10 @@ var ImagePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
           className: prefixCls + "-image-picker-image"
         }, /*#__PURE__*/_react.default.createElement("div", {
           onTouchStart: function onTouchStart(e) {
-            return handleTouchStart(e, image, index);
+            return uploadFunc.handleTouchStart(e, image, index);
           },
           onClick: function onClick(e) {
-            return handleClick(e, image, index);
+            return uploadFunc.handleClick(e, image, index);
           },
           className: prefixCls + "-image-picker-image-container"
         }, /*#__PURE__*/_react.default.createElement(_image.default, (0, _extends2.default)({
@@ -274,7 +128,7 @@ var ImagePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
         })), !hideDelete && /*#__PURE__*/_react.default.createElement("div", {
           className: prefixCls + "-image-picker-close",
           onClick: function onClick() {
-            return handleDelete(index);
+            return uploadFunc.deleteFile(index);
           }
         }, deleteIcon || /*#__PURE__*/_react.default.createElement("div", {
           className: prefixCls + "-image-picker-close-icon"
@@ -291,7 +145,7 @@ var ImagePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       data.push({
         img: /*#__PURE__*/_react.default.createElement("div", {
           className: (0, _mobileUtils.cls)(prefixCls + "-image-picker-add", (_cls = {}, _cls[prefixCls + "-image-picker-add-disabled"] = disableSelect, _cls)),
-          onClick: handleSelect
+          onClick: uploadFunc.handleSelect
         }, /*#__PURE__*/_react.default.createElement("div", {
           className: prefixCls + "-image-picker-add-container"
         }, selectIcon || /*#__PURE__*/_react.default.createElement("div", {
@@ -302,7 +156,7 @@ var ImagePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
           multiple: multiple,
           type: "file",
           onChange: function onChange(e) {
-            return handleChange(e);
+            return uploadFunc.handleChange(e);
           },
           ref: fileRef
         }) : null)),
@@ -313,12 +167,12 @@ var ImagePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     return data;
   };
 
-  return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, function (_ref5) {
+  return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, function (_ref) {
     var _cls2;
 
-    var prefixCls = _ref5.prefixCls,
-        _ref5$locale = _ref5.locale,
-        locale = _ref5$locale === void 0 ? _mobileUtils.defaultLocale : _ref5$locale;
+    var prefixCls = _ref.prefixCls,
+        _ref$locale = _ref.locale,
+        locale = _ref$locale === void 0 ? _mobileUtils.defaultLocale : _ref$locale;
     return /*#__PURE__*/_react.default.createElement("div", {
       className: (0, _mobileUtils.cls)(prefixCls + "-image-picker", className, (_cls2 = {}, _cls2[prefixCls + "-image-picker-disabled"] = disabled, _cls2)),
       style: style,

package/cjs/image-picker/style/css/index.css

@@ -95,6 +95,56 @@
  * }
  * ```
  */
+/**
+ * 设置涉及左右相关的属性名，在rtl模式下自动替换为相反的属性名
+ * @desc {en} set the property name related to left and right, and automatically replace it with the opposite attribute name in rtl mode
+ * @param @property css属性名
+ * @param @property {en} css property
+ * @param @value css属性值
+ * @param @value {en} css property value
+ * @param @rules 自定义的复写规则，默认重置为initial
+ * @param @rules {en} customized rewrite rules, default to initial
+ * @example
+ * ```
+ * @import '@arco-design/mobile-utils/style/mixin.less';
+ *
+ * .demo {
+ *   .set-prop-with-rtl(right, auto);
+ * }
+ * ```
+ */
+/**
+ * 设置涉及左右相关的属性值，在rtl模式下自动替换为相反的属性值
+ * @desc {en} set the property value related to left and right, and automatically replace it with the opposite attribute value in rtl mode
+ * @param @property css属性名
+ * @param @property {en} css property
+ * @param @value css属性值
+ * @param @value {en} css property value
+ * @example
+ * ```
+ * @import '@arco-design/mobile-utils/style/mixin.less';
+ *
+ * .demo {
+ *   .set-value-with-rtl(text-align, left);
+ * }
+ * ```
+ */
+/**
+ * 在 rtl 模式下，自定义样式规则
+ * @desc {en} custom style in RTL mode
+ * @param @rules 对应的rtl模式下的规则
+ * @param @rules {en} property with rtl
+ * @example
+ * ```
+ * @import '@arco-design/mobile-react/style/mixin.less';
+ *
+ * .demo {
+ *     .style-with-rtl({
+ *         transform: scale(-1);
+ *     });
+ * }
+ * ```
+ */
 /**
  * 0.5px 的边框线
  * @desc {en} a border line of 0.5 pixels
@@ -396,40 +446,6 @@
  * }
  * ```
  */
-/**
- * 设置涉及左右相关的属性名，在rtl模式下自动替换为相反的属性名
- * @desc {en} set the property name related to left and right, and automatically replace it with the opposite attribute name in rtl mode
- * @param @property css属性名
- * @param @property {en} css property
- * @param @value css属性值
- * @param @value {en} css property value
- * @param @rules 自定义的复写规则，默认重置为initial
- * @param @rules {en} customized rewrite rules, default to initial
- * @example
- * ```
- * @import '@arco-design/mobile-utils/style/mixin.less';
- *
- * .demo {
- *   .set-prop-with-rtl(right, auto);
- * }
- * ```
- */
-/**
- * 设置涉及左右相关的属性值，在rtl模式下自动替换为相反的属性值
- * @desc {en} set the property value related to left and right, and automatically replace it with the opposite attribute value in rtl mode
- * @param @property css属性名
- * @param @property {en} css property
- * @param @value css属性值
- * @param @value {en} css property value
- * @example
- * ```
- * @import '@arco-design/mobile-utils/style/mixin.less';
- *
- * .demo {
- *   .set-value-with-rtl(text-align, left);
- * }
- * ```
- */
 /**
  * 设置Loading组件颜色
  * @desc {en} set Loading component color