@arco-design/mobile-react 2.24.2 → 2.25.0

package/esm/_helpers/hooks.js

@@ -10,16 +10,13 @@ export function useListenResize(resizeHandler, deps, needListen) {
   if (deps === void 0) {
     deps = [];
   }
-
   if (needListen === void 0) {
     needListen = true;
   }
-
   useEffect(function () {
     if (!needListen) {
       return function () {};
     }
-
     window.addEventListener('resize', resizeHandler);
     window.addEventListener('orientationchange', resizeHandler);
     return function () {
@@ -28,6 +25,7 @@ export function useListenResize(resizeHandler, deps, needListen) {
     };
   }, [].concat(deps, [needListen]));
 }
+
 /**
  * useState自定义封装，统一处理在组件卸载后还使用setState的行为
  * tips：在unmount后有异步处理未完成的场景使用，不推荐无脑替换useState
@@ -36,18 +34,15 @@ export function useListenResize(resizeHandler, deps, needListen) {
  * @param initialState 初始状态
  * @param initialState {en} Initial State
  */
-
 export function useMountedState(initialState) {
   var _useState = useState(initialState),
-      state = _useState[0],
-      setState = _useState[1];
-
+    state = _useState[0],
+    setState = _useState[1];
   var leavingRef = useRef(false);
   var setValidState = useCallback(function (value) {
     if (leavingRef.current) {
       return;
     }
-
     setState(value);
   }, []);
   useEffect(function () {
@@ -60,9 +55,8 @@ export function useMountedState(initialState) {
 }
 export function useRefState(initialValue) {
   var _useState2 = useState(initialValue),
-      state = _useState2[0],
-      setState = _useState2[1];
-
+    state = _useState2[0],
+    setState = _useState2[1];
   var stateRef = useRef(state);
   useEffect(function () {
     stateRef.current = state;
@@ -71,9 +65,8 @@ export function useRefState(initialValue) {
 }
 export function useRefMountedState(initialValue) {
   var _useMountedState = useMountedState(initialValue),
-      state = _useMountedState[0],
-      setState = _useMountedState[1];
-
+    state = _useMountedState[0],
+    setState = _useMountedState[1];
   var stateRef = useRef(state);
   useEffect(function () {
     stateRef.current = state;
@@ -84,7 +77,6 @@ export function useUpdateEffect(effect, dependencies) {
   if (dependencies === void 0) {
     dependencies = [];
   }
-
   var isInitialMount = useRef(true);
   useEffect(function () {
     if (isInitialMount.current) {
@@ -96,8 +88,7 @@ export function useUpdateEffect(effect, dependencies) {
 }
 export function useForceUpdate() {
   var _useState3 = useState(0),
-      setTick = _useState3[1];
-
+    setTick = _useState3[1];
   var update = useCallback(function () {
     setTick(function (tick) {
       return tick + 1;
@@ -114,14 +105,12 @@ export function useLatestRef(variable) {
 }
 export function useSystem() {
   var _useContext = useContext(GlobalContext),
-      currentSystem = _useContext.system;
-
+    currentSystem = _useContext.system;
   var _useState4 = useState(function () {
-    return currentSystem || getSystem();
-  }),
-      system = _useState4[0],
-      setSystem = _useState4[1];
-
+      return currentSystem || getSystem();
+    }),
+    system = _useState4[0],
+    setSystem = _useState4[1];
   useEffect(function () {
     setSystem(currentSystem || getSystem());
   }, [currentSystem]);
@@ -129,18 +118,15 @@ export function useSystem() {
 }
 export function useWindowSize(listenResize) {
   var _useState5 = useState(0),
-      windowWidth = _useState5[0],
-      setWindowWidth = _useState5[1];
-
+    windowWidth = _useState5[0],
+    setWindowWidth = _useState5[1];
   var _useState6 = useState(0),
-      windowHeight = _useState6[0],
-      setWindowHeight = _useState6[1];
-
+    windowHeight = _useState6[0],
+    setWindowHeight = _useState6[1];
   function setSize() {
     setWindowWidth(window.innerWidth);
     setWindowHeight(window.innerHeight);
   }
-
   useListenResize(setSize, [], listenResize);
   useEffect(function () {
     setSize();
@@ -150,13 +136,11 @@ export function useWindowSize(listenResize) {
     windowHeight: windowHeight
   };
 }
-
 /* eslint-disable max-lines-per-function */
 export function usePopupScroll(visible, popupDom, getScrollContainer, orientationDirection, preventCallback, onTouchMove, gestureOutOfControl) {
   if (orientationDirection === void 0) {
     orientationDirection = 'top';
   }
-
   var scrollRef = useRef([]);
   var touchingRef = useRef({
     dom: null,
@@ -170,11 +154,9 @@ export function usePopupScroll(visible, popupDom, getScrollContainer, orientatio
     if (gestureOutOfControl) {
       return;
     }
-
     touchStartXRef.current = e.touches && e.touches[0] ? e.touches[0].clientX : 0;
     touchStartYRef.current = e.touches && e.touches[0] ? e.touches[0].clientY : 0;
     var ele = getScrollContainer ? getScrollContainer() : null;
-
     if (ele) {
       var actualEle = Array.isArray(ele) ? ele : [ele];
       scrollRef.current = actualEle.reduce(function (acc, nowEle) {
@@ -187,19 +169,15 @@ export function usePopupScroll(visible, popupDom, getScrollContainer, orientatio
     } else {
       scrollRef.current = [];
     }
-
     touchingRef.current = {
       dom: null,
       inScrollIndexes: []
     };
   }, [getScrollContainer, gestureOutOfControl, orientationDirection]);
-
   function judgeInScroll(originNode, scroll) {
     var inScrollIndexes = [];
-
     for (var i = 0; i < scroll.length; i += 1) {
       var node = originNode;
-
       while (node && scroll[i]) {
         if (node === scroll[i].ele) {
           inScrollIndexes.push(i);
@@ -209,66 +187,54 @@ export function usePopupScroll(visible, popupDom, getScrollContainer, orientatio
         }
       }
     }
-
     touchingRef.current = {
       dom: originNode,
       inScrollIndexes: inScrollIndexes
     };
     return inScrollIndexes;
   }
-
   var handleTouchMove = useCallback(function (e) {
     function getScrollTop(scroll) {
       var ele = scroll.ele,
-          maxScrollX = scroll.maxScrollX,
-          maxScrollY = scroll.maxScrollY;
-
+        maxScrollX = scroll.maxScrollX,
+        maxScrollY = scroll.maxScrollY;
       switch (orientationDirection) {
         case 'left':
           return maxScrollY - ele.scrollLeft;
-
         case 'right':
           return ele.scrollLeft;
-
         case 'bottom':
           return maxScrollX - ele.scrollTop;
-
         case 'top':
         default:
           return ele.scrollTop;
       }
     }
-
     function getScrollLeft(scroll) {
       var ele = scroll.ele,
-          maxScrollX = scroll.maxScrollX,
-          maxScrollY = scroll.maxScrollY;
-
+        maxScrollX = scroll.maxScrollX,
+        maxScrollY = scroll.maxScrollY;
       switch (orientationDirection) {
         case 'left':
           return ele.scrollTop;
-
         case 'right':
           return maxScrollX - ele.scrollTop;
-
         case 'bottom':
           return maxScrollY - ele.scrollLeft;
-
         case 'top':
         default:
           return ele.scrollLeft;
       }
     }
-
     var touchMoveX = e.changedTouches && e.changedTouches[0] ? e.changedTouches[0].clientX : 0;
     var touchMoveY = e.changedTouches && e.changedTouches[0] ? e.changedTouches[0].clientY : 0;
     var scroll = scrollRef.current;
     var node = e.target;
     var _touchingRef$current = touchingRef.current,
-        touchingDom = _touchingRef$current.dom,
-        touchingIndexes = _touchingRef$current.inScrollIndexes; // target一样就取缓存结果，不取dom判断了
+      touchingDom = _touchingRef$current.dom,
+      touchingIndexes = _touchingRef$current.inScrollIndexes;
+    // target一样就取缓存结果，不取dom判断了
     // @en If the target is the same, the cached result is taken, and the dom judgment is not taken.
-
     var inScrollIndexes = touchingDom === node ? touchingIndexes : judgeInScroll(node, scroll);
     var distanceX = touchMoveX - touchStartXRef.current;
     var distanceY = touchMoveY - touchStartYRef.current;
@@ -276,35 +242,28 @@ export function usePopupScroll(visible, popupDom, getScrollContainer, orientatio
     var absY = Math.abs(distanceY);
     var direc = absY > absX ? 'y' : 'x';
     var prevented = false;
-
     if (gestureOutOfControl) {
       onTouchMoveRef.current == null ? void 0 : onTouchMoveRef.current(e, prevented, direc);
       return;
     }
-
     if (scroll.length && inScrollIndexes.length) {
       var needPrevents = [];
-
       for (var i = 0; i < inScrollIndexes.length; i += 1) {
         var touchingScroll = scroll[inScrollIndexes[i]];
         var scrollTop = getScrollTop(touchingScroll);
         var scrollLeft = getScrollLeft(touchingScroll);
-
         if (distanceY > 0 && absY > absX && scrollTop === 0 || distanceX > 0 && absX > absY && scrollLeft === 0) {
           needPrevents.push(true);
           continue;
         }
-
         if (distanceY < 0 && absY > absX && scrollTop + 1 >= touchingScroll.maxScrollY || distanceX < 0 && absX > absY && scrollLeft + 1 >= touchingScroll.maxScrollX) {
           needPrevents.push(true);
           continue;
         }
-
         needPrevents.push(false);
-      } // 满足一个不prevent的条件就停止prevent，否则prevent
+      }
+      // 满足一个不prevent的条件就停止prevent，否则prevent
       // @en Stop prevent if a non-prevent condition is met, otherwise prevent.
-
-
       if (needPrevents.indexOf(false) < 0) {
         preventCallbackRef.current == null ? void 0 : preventCallbackRef.current(e, direc);
         e.cancelable && e.preventDefault();
@@ -315,14 +274,12 @@ export function usePopupScroll(visible, popupDom, getScrollContainer, orientatio
       e.cancelable && e.preventDefault();
       prevented = true;
     }
-
     onTouchMoveRef.current == null ? void 0 : onTouchMoveRef.current(e, prevented, direc);
   }, [orientationDirection, gestureOutOfControl]);
   useEffect(function () {
     if (!visible || !popupDom) {
       return function () {};
     }
-
     popupDom.addEventListener('touchstart', handleTouchStart);
     popupDom.addEventListener('touchmove', handleTouchMove, {
       passive: false
@@ -341,7 +298,6 @@ export function useSwiperInnerScroll(getInnerScrollContainer) {
     if (!getInnerScrollContainer) {
       return;
     }
-
     var containers = getInnerScrollContainer();
     var validContainers = Array.isArray(containers) ? containers : [containers];
     validContainers.forEach(function (container) {
@@ -366,14 +322,11 @@ export function useAddListener(dom, event, handler, options) {
       capture: true
     };
   }
-
   useEffect(function () {
     if (!dom) return;
-
     if (handler) {
       dom.addEventListener(event, handler, options);
     }
-
     return function () {
       if (handler) {
         dom.removeEventListener(event, handler, options);
@@ -381,24 +334,23 @@ export function useAddListener(dom, event, handler, options) {
     };
   }, [handler]);
 }
+
 /**
  * 统计同时出现的全屏组件
  * @en Count simultaneous full-screen components
  */
-
 var arcoFullScreenCount = 0;
 var arcoFullScreenOriginOverflow = '';
 export function usePreventBodyScroll(visible, preventBodyScroll, initialBodyOverflow) {
   // 新出现一个全屏组件则计数+1，并设置body hidden样式
   // @en When a new full-screen component appears, count + 1 and set the body hidden style
   var addFullScreen = useCallback(function () {
-    var count = arcoFullScreenCount; // 在当前没有全屏组件出现时，记下body overflow的初始值
+    var count = arcoFullScreenCount;
+    // 在当前没有全屏组件出现时，记下body overflow的初始值
     // @en Note the initial value of body overflow when no full-screen components are currently present
-
     if (!count) {
       arcoFullScreenOriginOverflow = initialBodyOverflow !== void 0 ? initialBodyOverflow : document.body.style.overflow;
     }
-
     arcoFullScreenCount += 1;
     document.body.style.overflow = 'hidden';
   }, []);
@@ -406,11 +358,9 @@ export function usePreventBodyScroll(visible, preventBodyScroll, initialBodyOver
    * 移除一个全屏组件时，根据剩余是否还有全屏组件判断是否需要还原overflow样式
    * @en When removing a full-screen component, determine whether the overflow style needs to be restored according to whether there are any remaining full-screen components.
    */
-
   var removeFullScreen = useCallback(function () {
     var newCount = arcoFullScreenCount - 1;
     arcoFullScreenCount = newCount;
-
     if (!newCount) {
       document.body.style.overflow = arcoFullScreenOriginOverflow;
     }
@@ -418,14 +368,12 @@ export function usePreventBodyScroll(visible, preventBodyScroll, initialBodyOver
   useEffect(function () {
     if (!preventBodyScroll) {
       return function () {};
-    } // 如果一开始就是visible=true则加上样式
+    }
+    // 如果一开始就是visible=true则加上样式
     // @en If it is visible=true at the beginning, add the style.
-
-
     if (visible) {
       addFullScreen();
     }
-
     return function () {
       // 如果这里visible为true，则说明即将隐藏组件或在展示时卸载组件
       // @en If visible here is true, it means that the component is about to be hidden or unloaded when displayed.
@@ -437,17 +385,14 @@ export function usePreventBodyScroll(visible, preventBodyScroll, initialBodyOver
 }
 export var useProgress = function useProgress(mountedTransition, percentage, duration, mountedBezier, step) {
   var _useState7 = useState(0),
-      currentPercentage = _useState7[0],
-      setCurrentPercentage = _useState7[1];
-
+    currentPercentage = _useState7[0],
+    setCurrentPercentage = _useState7[1];
   var _useState8 = useState(false),
-      transitionControl = _useState8[0],
-      setTransitionControl = _useState8[1];
-
+    transitionControl = _useState8[0],
+    setTransitionControl = _useState8[1];
   var _useState9 = useState(0),
-      count = _useState9[0],
-      setCount = _useState9[1];
-
+    count = _useState9[0],
+    setCount = _useState9[1];
   useEffect(function () {
     mountedTransition ? scrollWithAnimation(0, percentage, function (progress) {
       setCurrentPercentage(Math.floor(progress));
@@ -471,11 +416,9 @@ export function useSingleAndDoubleClick(onClick, onDoubleClick, delay) {
   if (delay === void 0) {
     delay = 200;
   }
-
   var _useState10 = useState(0),
-      clickTimes = _useState10[0],
-      setClickTimes = _useState10[1];
-
+    clickTimes = _useState10[0],
+    setClickTimes = _useState10[1];
   var eventRef = useRef();
   useEffect(function () {
     var timer = setTimeout(function () {
@@ -497,9 +440,8 @@ export function useSingleAndDoubleClick(onClick, onDoubleClick, delay) {
 var arcoSvgKeyCount = 0;
 export function useGenSvgKey(userSetSvgKey) {
   var _useState11 = useState(''),
-      innerSvgKey = _useState11[0],
-      setInnerSvgKey = _useState11[1];
-
+    innerSvgKey = _useState11[0],
+    setInnerSvgKey = _useState11[1];
   var svgKey = userSetSvgKey || innerSvgKey;
   useEffect(function () {
     setInnerSvgKey("inner-" + arcoSvgKeyCount);

package/esm/_helpers/index.js

@@ -1,9 +1,9 @@
 import _extends from "@babel/runtime/helpers/extends";
-
 /**
  * @type utils
  * @name componentUtils
  */
+
 export * from './hooks';
 export * from './type';
 export * from './react-dom';
@@ -11,7 +11,6 @@ export function getStyleWithVendor(style) {
   var allowReg = /(transform|transition|animation)/i;
   var newStyle = Object.keys(style).reduce(function (acc, key) {
     var _ref, _extends2;
-
     var webkitStyle = allowReg.test(key) ? (_ref = {}, _ref["Webkit" + key.replace(/^(.)/, function (_, p1) {
       return p1.toUpperCase();
     })] = style[key], _ref) : {};
@@ -19,11 +18,11 @@ export function getStyleWithVendor(style) {
   }, {});
   return newStyle;
 }
+
 /**
  * 计算默认值，仅未定义时使用默认值
  * @desc {en} Calculate the default value, use default value only if undefined
  */
-
 export var getDefaultValue = function getDefaultValue(value, defaultValue) {
   return value === void 0 ? defaultValue : value;
 };

package/esm/_helpers/react-dom.js

@@ -1,16 +1,12 @@
 var _CopyReactDOM$version;
-
 import ReactDOM from 'react-dom';
-
 function isObject(obj) {
   return Object.prototype.toString.call(obj) === '[object Object]';
 }
-
 var __SECRET_INTERNALS__ = '__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED';
 var CopyReactDOM = ReactDOM;
 var copyRender;
 var isReact18 = Number((_CopyReactDOM$version = CopyReactDOM.version) == null ? void 0 : _CopyReactDOM$version.split('.')[0]) > 17;
-
 var updateUsingClientEntryPoint = function updateUsingClientEntryPoint(skipWarning) {
   // https://github.com/facebook/react/blob/17806594cc28284fe195f918e8d77de3516848ec/packages/react-dom/npm/client.js#L10
   // Avoid console warning
@@ -18,26 +14,21 @@ var updateUsingClientEntryPoint = function updateUsingClientEntryPoint(skipWarni
     CopyReactDOM[__SECRET_INTERNALS__].usingClientEntryPoint = skipWarning;
   }
 };
-
 var createRoot;
-
 try {
   createRoot = CopyReactDOM.createRoot;
 } catch (_) {}
-
 if (isReact18 && createRoot) {
   copyRender = function copyRender(app, container) {
     updateUsingClientEntryPoint(true);
     var root = createRoot(container);
     updateUsingClientEntryPoint(false);
     root.render(app);
-
     root._unmount = function () {
       setTimeout(function () {
         root == null ? void 0 : root.unmount == null ? void 0 : root.unmount();
       });
     };
-
     return root;
   };
 } else {
@@ -53,5 +44,4 @@ if (isReact18 && createRoot) {
     };
   };
 }
-
 export var render = copyRender;

package/esm/_helpers/render.js

@@ -3,33 +3,26 @@ import React from 'react';
 import { render as copyRender } from './react-dom';
 export var ReactDOMRender = function ReactDOMRender(app, container, context) {
   var _this = this;
-
   this.root = void 0;
   this.app = void 0;
   this.container = void 0;
   this.context = void 0;
-
   this.render = function (props) {
     var CustomApp = _this.app;
-
     var propsWithContext = _extends({}, props, {
       context: _this.context
     });
-
     if (_this.root) {
       _this.root.render( /*#__PURE__*/React.createElement(CustomApp, propsWithContext));
     } else {
       _this.root = copyRender( /*#__PURE__*/React.createElement(CustomApp, propsWithContext), _this.container);
     }
   };
-
   this.unmount = function () {
     var _this$root;
-
     (_this$root = _this.root) == null ? void 0 : _this$root._unmount();
     _this.root = undefined;
   };
-
   this.app = app;
   this.container = container;
   this.context = context;

package/esm/action-sheet/index.js

@@ -8,30 +8,25 @@ import Popup from '../popup';
 import { open } from './methods';
 var ActionSheet = /*#__PURE__*/forwardRef(function (props, ref) {
   var _props$className = props.className,
-      className = _props$className === void 0 ? '' : _props$className,
-      items = props.items,
-      cancelText = props.cancelText,
-      close = props.close,
-      title = props.title,
-      subTitle = props.subTitle,
-      _props$needBottomOffs = props.needBottomOffset,
-      needBottomOffset = _props$needBottomOffs === void 0 ? true : _props$needBottomOffs,
-      otherProps = _objectWithoutPropertiesLoose(props, _excluded);
-
+    className = _props$className === void 0 ? '' : _props$className,
+    items = props.items,
+    cancelText = props.cancelText,
+    close = props.close,
+    title = props.title,
+    subTitle = props.subTitle,
+    _props$needBottomOffs = props.needBottomOffset,
+    needBottomOffset = _props$needBottomOffs === void 0 ? true : _props$needBottomOffs,
+    otherProps = _objectWithoutPropertiesLoose(props, _excluded);
   var popupRef = useRef(null);
   useImperativeHandle(ref, function () {
     return popupRef.current;
   });
-
   function handleItemClick(e, item) {
     e.stopPropagation();
-
     if (item.status === 'disabled') {
       return;
     }
-
     var result = item.onClick ? item.onClick(e) : null;
-
     if (!result || typeof result === 'boolean') {
       !result && (close == null ? void 0 : close(e));
     } else if (result && result.then) {
@@ -40,7 +35,6 @@ var ActionSheet = /*#__PURE__*/forwardRef(function (props, ref) {
       });
     }
   }
-
   return /*#__PURE__*/React.createElement(ContextLayout, null, function (_ref) {
     var prefixCls = _ref.prefixCls;
     return /*#__PURE__*/React.createElement(Popup, _extends({
@@ -88,6 +82,7 @@ export function methodsGenerator(Comp) {
   };
 }
 var ActionSheetWithGlobalContext = CompWithGlobalContext(ActionSheet);
+
 /**
  * 动作面板组件
  * @en ActionSheet Component
@@ -96,5 +91,4 @@ var ActionSheetWithGlobalContext = CompWithGlobalContext(ActionSheet);
  * @name 动作面板
  * @name_en ActionSheet
  */
-
 export default componentWrapper(ActionSheet, methodsGenerator(ActionSheetWithGlobalContext));

package/esm/action-sheet/style/css/index.css

@@ -121,7 +121,7 @@
   color:  #c9cdd4 ;
 }
 .arco-action-sheet-item.danger {
-  color:  #ee4d38 ;
+  color:  #f53f3f ;
 }
 .arco-action-sheet-item.cancel-item {
   border-top-style: solid;

package/esm/avatar/group.js

@@ -7,27 +7,25 @@ export var AvatarGroupContext = /*#__PURE__*/React.createContext({
   shape: 'circle',
   size: 'small'
 });
+
 /**
  * 头像叠层
  * @en Avatar group
  */
-
 export var Group = /*#__PURE__*/forwardRef(function (props, ref) {
   var _props$style = props.style,
-      style = _props$style === void 0 ? {} : _props$style,
-      _props$className = props.className,
-      className = _props$className === void 0 ? '' : _props$className,
-      _props$shape = props.shape,
-      shape = _props$shape === void 0 ? 'circle' : _props$shape,
-      _props$size = props.size,
-      size = _props$size === void 0 ? 'medium' : _props$size,
-      _props$zIndexOrder = props.zIndexOrder,
-      zIndexOrder = _props$zIndexOrder === void 0 ? 'desc' : _props$zIndexOrder,
-      children = props.children;
-
+    style = _props$style === void 0 ? {} : _props$style,
+    _props$className = props.className,
+    className = _props$className === void 0 ? '' : _props$className,
+    _props$shape = props.shape,
+    shape = _props$shape === void 0 ? 'circle' : _props$shape,
+    _props$size = props.size,
+    size = _props$size === void 0 ? 'medium' : _props$size,
+    _props$zIndexOrder = props.zIndexOrder,
+    zIndexOrder = _props$zIndexOrder === void 0 ? 'desc' : _props$zIndexOrder,
+    children = props.children;
   var _useContext = useContext(GlobalContext),
-      prefixCls = _useContext.prefixCls;
-
+    prefixCls = _useContext.prefixCls;
   var childrenArr = React.Children.toArray(children);
   var length = childrenArr.length;
   var domRef = useRef(null);
@@ -48,11 +46,9 @@ export var Group = /*#__PURE__*/forwardRef(function (props, ref) {
     }
   }, childrenArr.map(function (child, i) {
     var childProps = (child || {}).props;
-
     var avatarStyle = _extends({
       zIndex: zIndexOrder === 'asc' ? i + 1 : length - i
     }, childProps.style);
-
     return /*#__PURE__*/React.cloneElement(child, _extends({}, childProps, {
       style: avatarStyle
     }));