@arco-design/mobile-react 2.24.2 → 2.25.0

package/umd/_helpers/hooks.js

@@ -30,26 +30,23 @@
   _exports.useSystem = useSystem;
   _exports.useUpdateEffect = useUpdateEffect;
   _exports.useWindowSize = useWindowSize;
-
   /**
    * @type hooks
    * @name 公共hooks
    * @name_en General Hooks
    */
+
   function useListenResize(resizeHandler, deps, needListen) {
     if (deps === void 0) {
       deps = [];
     }
-
     if (needListen === void 0) {
       needListen = true;
     }
-
     (0, _react.useEffect)(function () {
       if (!needListen) {
         return function () {};
       }
-
       window.addEventListener('resize', resizeHandler);
       window.addEventListener('orientationchange', resizeHandler);
       return function () {
@@ -58,6 +55,7 @@
       };
     }, [].concat(deps, [needListen]));
   }
+
   /**
    * useState自定义封装，统一处理在组件卸载后还使用setState的行为
    * tips：在unmount后有异步处理未完成的场景使用，不推荐无脑替换useState
@@ -66,19 +64,15 @@
    * @param initialState 初始状态
    * @param initialState {en} Initial State
    */
-
-
   function useMountedState(initialState) {
     var _useState = (0, _react.useState)(initialState),
-        state = _useState[0],
-        setState = _useState[1];
-
+      state = _useState[0],
+      setState = _useState[1];
     var leavingRef = (0, _react.useRef)(false);
     var setValidState = (0, _react.useCallback)(function (value) {
       if (leavingRef.current) {
         return;
       }
-
       setState(value);
     }, []);
     (0, _react.useEffect)(function () {
@@ -89,36 +83,30 @@
     var result = [state, setValidState];
     return result;
   }
-
   function useRefState(initialValue) {
     var _useState2 = (0, _react.useState)(initialValue),
-        state = _useState2[0],
-        setState = _useState2[1];
-
+      state = _useState2[0],
+      setState = _useState2[1];
     var stateRef = (0, _react.useRef)(state);
     (0, _react.useEffect)(function () {
       stateRef.current = state;
     }, [state]);
     return [state, stateRef, setState];
   }
-
   function useRefMountedState(initialValue) {
     var _useMountedState = useMountedState(initialValue),
-        state = _useMountedState[0],
-        setState = _useMountedState[1];
-
+      state = _useMountedState[0],
+      setState = _useMountedState[1];
     var stateRef = (0, _react.useRef)(state);
     (0, _react.useEffect)(function () {
       stateRef.current = state;
     }, [state]);
     return [state, stateRef, setState];
   }
-
   function useUpdateEffect(effect, dependencies) {
     if (dependencies === void 0) {
       dependencies = [];
     }
-
     var isInitialMount = (0, _react.useRef)(true);
     (0, _react.useEffect)(function () {
       if (isInitialMount.current) {
@@ -128,11 +116,9 @@
       }
     }, dependencies);
   }
-
   function useForceUpdate() {
     var _useState3 = (0, _react.useState)(0),
-        setTick = _useState3[1];
-
+      setTick = _useState3[1];
     var update = (0, _react.useCallback)(function () {
       setTick(function (tick) {
         return tick + 1;
@@ -140,7 +126,6 @@
     }, []);
     return update;
   }
-
   function useLatestRef(variable) {
     var variableRef = (0, _react.useRef)(variable);
     (0, _react.useEffect)(function () {
@@ -148,37 +133,30 @@
     }, [variable]);
     return variableRef;
   }
-
   function useSystem() {
     var _useContext = (0, _react.useContext)(_contextProvider.GlobalContext),
-        currentSystem = _useContext.system;
-
+      currentSystem = _useContext.system;
     var _useState4 = (0, _react.useState)(function () {
-      return currentSystem || (0, _mobileUtils.getSystem)();
-    }),
-        system = _useState4[0],
-        setSystem = _useState4[1];
-
+        return currentSystem || (0, _mobileUtils.getSystem)();
+      }),
+      system = _useState4[0],
+      setSystem = _useState4[1];
     (0, _react.useEffect)(function () {
       setSystem(currentSystem || (0, _mobileUtils.getSystem)());
     }, [currentSystem]);
     return system;
   }
-
   function useWindowSize(listenResize) {
     var _useState5 = (0, _react.useState)(0),
-        windowWidth = _useState5[0],
-        setWindowWidth = _useState5[1];
-
+      windowWidth = _useState5[0],
+      setWindowWidth = _useState5[1];
     var _useState6 = (0, _react.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);
     (0, _react.useEffect)(function () {
       setSize();
@@ -188,13 +166,11 @@
       windowHeight: windowHeight
     };
   }
-
   /* eslint-disable max-lines-per-function */
   function usePopupScroll(visible, popupDom, getScrollContainer, orientationDirection, preventCallback, onTouchMove, gestureOutOfControl) {
     if (orientationDirection === void 0) {
       orientationDirection = 'top';
     }
-
     var scrollRef = (0, _react.useRef)([]);
     var touchingRef = (0, _react.useRef)({
       dom: null,
@@ -208,11 +184,9 @@
       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) {
@@ -225,19 +199,15 @@
       } 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);
@@ -247,66 +217,54 @@
           }
         }
       }
-
       touchingRef.current = {
         dom: originNode,
         inScrollIndexes: inScrollIndexes
       };
       return inScrollIndexes;
     }
-
     var handleTouchMove = (0, _react.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;
@@ -314,35 +272,28 @@
       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();
@@ -353,14 +304,12 @@
         e.cancelable && e.preventDefault();
         prevented = true;
       }
-
       onTouchMoveRef.current == null ? void 0 : onTouchMoveRef.current(e, prevented, direc);
     }, [orientationDirection, gestureOutOfControl]);
     (0, _react.useEffect)(function () {
       if (!visible || !popupDom) {
         return function () {};
       }
-
       popupDom.addEventListener('touchstart', handleTouchStart);
       popupDom.addEventListener('touchmove', handleTouchMove, {
         passive: false
@@ -371,7 +320,6 @@
       };
     }, [visible, popupDom, handleTouchStart, handleTouchMove]);
   }
-
   function useSwiperInnerScroll(getInnerScrollContainer) {
     var stopFunc = (0, _react.useCallback)(function (e) {
       return e.stopPropagation();
@@ -380,7 +328,6 @@
       if (!getInnerScrollContainer) {
         return;
       }
-
       var containers = getInnerScrollContainer();
       var validContainers = Array.isArray(containers) ? containers : [containers];
       validContainers.forEach(function (container) {
@@ -399,21 +346,17 @@
       };
     }, [getInnerScrollContainer]);
   }
-
   function useAddListener(dom, event, handler, options) {
     if (options === void 0) {
       options = {
         capture: true
       };
     }
-
     (0, _react.useEffect)(function () {
       if (!dom) return;
-
       if (handler) {
         dom.addEventListener(event, handler, options);
       }
-
       return function () {
         if (handler) {
           dom.removeEventListener(event, handler, options);
@@ -421,26 +364,23 @@
       };
     }, [handler]);
   }
+
   /**
    * 统计同时出现的全屏组件
    * @en Count simultaneous full-screen components
    */
-
-
   var arcoFullScreenCount = 0;
   var arcoFullScreenOriginOverflow = '';
-
   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 = (0, _react.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';
     }, []);
@@ -448,11 +388,9 @@
      * 移除一个全屏组件时，根据剩余是否还有全屏组件判断是否需要还原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 = (0, _react.useCallback)(function () {
       var newCount = arcoFullScreenCount - 1;
       arcoFullScreenCount = newCount;
-
       if (!newCount) {
         document.body.style.overflow = arcoFullScreenOriginOverflow;
       }
@@ -460,14 +398,12 @@
     (0, _react.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.
@@ -477,20 +413,16 @@
       };
     }, [visible]);
   }
-
   var useProgress = function useProgress(mountedTransition, percentage, duration, mountedBezier, step) {
     var _useState7 = (0, _react.useState)(0),
-        currentPercentage = _useState7[0],
-        setCurrentPercentage = _useState7[1];
-
+      currentPercentage = _useState7[0],
+      setCurrentPercentage = _useState7[1];
     var _useState8 = (0, _react.useState)(false),
-        transitionControl = _useState8[0],
-        setTransitionControl = _useState8[1];
-
+      transitionControl = _useState8[0],
+      setTransitionControl = _useState8[1];
     var _useState9 = (0, _react.useState)(0),
-        count = _useState9[0],
-        setCount = _useState9[1];
-
+      count = _useState9[0],
+      setCount = _useState9[1];
     (0, _react.useEffect)(function () {
       mountedTransition ? (0, _mobileUtils.scrollWithAnimation)(0, percentage, function (progress) {
         setCurrentPercentage(Math.floor(progress));
@@ -510,18 +442,14 @@
     }, [count, percentage, step]);
     return [currentPercentage, transitionControl];
   };
-
   _exports.useProgress = useProgress;
-
   function useSingleAndDoubleClick(onClick, onDoubleClick, delay) {
     if (delay === void 0) {
       delay = 200;
     }
-
     var _useState10 = (0, _react.useState)(0),
-        clickTimes = _useState10[0],
-        setClickTimes = _useState10[1];
-
+      clickTimes = _useState10[0],
+      setClickTimes = _useState10[1];
     var eventRef = (0, _react.useRef)();
     (0, _react.useEffect)(function () {
       var timer = setTimeout(function () {
@@ -540,14 +468,11 @@
       });
     };
   }
-
   var arcoSvgKeyCount = 0;
-
   function useGenSvgKey(userSetSvgKey) {
     var _useState11 = (0, _react.useState)(''),
-        innerSvgKey = _useState11[0],
-        setInnerSvgKey = _useState11[1];
-
+      innerSvgKey = _useState11[0],
+      setInnerSvgKey = _useState11[1];
     var svgKey = userSetSvgKey || innerSvgKey;
     (0, _react.useEffect)(function () {
       setInnerSvgKey("inner-" + arcoSvgKeyCount);

package/umd/_helpers/index.js

@@ -14,7 +14,6 @@
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
   _exports.__esModule = true;
   var _exportNames = {
     getStyleWithVendor: true,
@@ -41,16 +40,15 @@
     if (key in _exports && _exports[key] === _reactDom[key]) return;
     _exports[key] = _reactDom[key];
   });
-
   /**
    * @type utils
    * @name componentUtils
    */
+
   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) : {};
@@ -58,15 +56,13 @@
     }, {});
     return newStyle;
   }
+
   /**
    * 计算默认值，仅未定义时使用默认值
    * @desc {en} Calculate the default value, use default value only if undefined
    */
-
-
   var getDefaultValue = function getDefaultValue(value, defaultValue) {
     return value === void 0 ? defaultValue : value;
   };
-
   _exports.getDefaultValue = getDefaultValue;
 });

package/umd/_helpers/react-dom.js

@@ -14,22 +14,17 @@
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
   _exports.__esModule = true;
   _exports.render = void 0;
   _reactDom = _interopRequireDefault(_reactDom);
-
   var _CopyReactDOM$version;
-
   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.default;
   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
@@ -37,26 +32,21 @@
       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 {
@@ -72,7 +62,6 @@
       };
     };
   }
-
   var render = copyRender;
   _exports.render = render;
 });

package/umd/_helpers/render.js

@@ -14,44 +14,35 @@
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
   _exports.__esModule = true;
   _exports.ReactDOMRender = void 0;
   _extends2 = _interopRequireDefault(_extends2);
   _react = _interopRequireDefault(_react);
-
   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 = (0, _extends2.default)({}, props, {
         context: _this.context
       });
-
       if (_this.root) {
         _this.root.render( /*#__PURE__*/_react.default.createElement(CustomApp, propsWithContext));
       } else {
         _this.root = (0, _reactDom.render)( /*#__PURE__*/_react.default.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;
   };
-
   _exports.ReactDOMRender = ReactDOMRender;
 });