@arco-design/mobile-react 2.25.4 → 2.27.0

package/umd/load-more/index.js

@@ -14,12 +14,16 @@
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
   _exports.__esModule = true;
   _exports.default = void 0;
   _react = _interopRequireWildcard(_react);
   _lodash = _interopRequireDefault(_lodash);
+
   function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
   function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
   /**
    * 上拉加载组件，支持`scroll`和`click`两种触发加载方式，支持滚动监听。支持受控与不受控两种形式。<br>如果引入组件后发现仅触发了初始的`getData`，请确认是否在`getData`方法内没有调用`callback`移除 loading 状态，且未设置`blockWhenLoading`属性为 false。
    * @en Pull-up loading component, supports `scroll` and `click` two trigger loading methods, supports scroll monitoring. Both controlled and uncontrolled forms are supported. <br>If only the initial `getData` is triggered after the component is introduced, please make sure that the `callback` is not called in the `getData` method to remove the loading state, and the `blockWhenLoading` property is not set to false.
@@ -30,36 +34,38 @@
    */
   var LoadMore = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     var _props$className = props.className,
-      className = _props$className === void 0 ? '' : _props$className,
-      style = props.style,
-      beforeReadyArea = props.beforeReadyArea,
-      loadingArea = props.loadingArea,
-      noMoreArea = props.noMoreArea,
-      prepareArea = props.prepareArea,
-      retryArea = props.retryArea,
-      _props$defaultStatus = props.defaultStatus,
-      defaultStatus = _props$defaultStatus === void 0 ? 'prepare' : _props$defaultStatus,
-      status = props.status,
-      getScrollContainer = props.getScrollContainer,
-      _props$trigger = props.trigger,
-      trigger = _props$trigger === void 0 ? 'scroll' : _props$trigger,
-      _props$threshold = props.threshold,
-      threshold = _props$threshold === void 0 ? 200 : _props$threshold,
-      _props$throttle = props.throttle,
-      throttle = _props$throttle === void 0 ? 0 : _props$throttle,
-      _props$getDataAtFirst = props.getDataAtFirst,
-      getDataAtFirst = _props$getDataAtFirst === void 0 ? true : _props$getDataAtFirst,
-      getData = props.getData,
-      _props$blockWhenLoadi = props.blockWhenLoading,
-      blockWhenLoading = _props$blockWhenLoadi === void 0 ? true : _props$blockWhenLoadi,
-      onStatusChange = props.onStatusChange,
-      onClick = props.onClick,
-      onEndReached = props.onEndReached;
+        className = _props$className === void 0 ? '' : _props$className,
+        style = props.style,
+        beforeReadyArea = props.beforeReadyArea,
+        loadingArea = props.loadingArea,
+        noMoreArea = props.noMoreArea,
+        prepareArea = props.prepareArea,
+        retryArea = props.retryArea,
+        _props$defaultStatus = props.defaultStatus,
+        defaultStatus = _props$defaultStatus === void 0 ? 'prepare' : _props$defaultStatus,
+        status = props.status,
+        getScrollContainer = props.getScrollContainer,
+        _props$trigger = props.trigger,
+        trigger = _props$trigger === void 0 ? 'scroll' : _props$trigger,
+        _props$threshold = props.threshold,
+        threshold = _props$threshold === void 0 ? 200 : _props$threshold,
+        _props$throttle = props.throttle,
+        throttle = _props$throttle === void 0 ? 0 : _props$throttle,
+        _props$getDataAtFirst = props.getDataAtFirst,
+        getDataAtFirst = _props$getDataAtFirst === void 0 ? true : _props$getDataAtFirst,
+        getData = props.getData,
+        _props$blockWhenLoadi = props.blockWhenLoading,
+        blockWhenLoading = _props$blockWhenLoadi === void 0 ? true : _props$blockWhenLoadi,
+        onStatusChange = props.onStatusChange,
+        onClick = props.onClick,
+        onEndReached = props.onEndReached;
     var domRef = (0, _react.useRef)(null);
     var requestAtFirst = trigger === 'scroll' ? getDataAtFirst : false;
+
     var _useState = (0, _react.useState)(defaultStatus),
-      innerStatus = _useState[0],
-      setInnerStatus = _useState[1];
+        innerStatus = _useState[0],
+        setInnerStatus = _useState[1];
+
     var lastScrollEndRef = (0, _react.useRef)(false);
     var nowStatus = status || innerStatus;
     var statusRef = (0, _react.useRef)(nowStatus);
@@ -71,6 +77,7 @@
       if (blockWhenLoading && statusRef.current === 'loading') {
         return;
       }
+
       changeStatus('loading', scene);
       getData == null ? void 0 : getData(function (st) {
         lastScrollEndRef.current = false;
@@ -96,10 +103,12 @@
     }, [trigger]);
     var handleContainerScroll = (0, _react.useCallback)(function () {
       var scrollTop = (0, _mobileUtils.getScrollContainerAttribute)('scrollTop', getScrollContainer);
+
       if (checkNeedTrigger(scrollTop, threshold + 1)) {
         if (!lastScrollEndRef.current) {
           lastScrollEndRef.current = true;
           onEndReached && onEndReached();
+
           if (!['nomore', 'retry', 'before-ready'].includes(statusRef.current)) {
             triggerGetData('scrollEnd');
           }
@@ -111,13 +120,16 @@
     (0, _react.useEffect)(function () {
       var binded = null;
       var scrollFunc = throttle ? (0, _lodash.default)(handleContainerScroll, throttle) : handleContainerScroll;
+
       if (trigger === 'scroll') {
         var container = (0, _mobileUtils.getValidScrollContainer)(getScrollContainer);
+
         if (container) {
           container.addEventListener('scroll', scrollFunc);
           binded = container;
         }
       }
+
       return function () {
         if (binded) {
           binded.removeEventListener('scroll', scrollFunc);
@@ -130,45 +142,55 @@
         changeStatus: changeStatus
       };
     }, [changeStatus]);
+
     function checkNeedTrigger(top, ths) {
       var scrollHeight = (0, _mobileUtils.getScrollContainerAttribute)('scrollHeight', getScrollContainer);
       var clientHeight = (0, _mobileUtils.getScrollContainerAttribute)('clientHeight', getScrollContainer);
       return scrollHeight - top - clientHeight <= ths;
     }
+
     function handleClick(e) {
       if (trigger === 'click' && statusRef.current === 'prepare' || statusRef.current === 'retry') {
         triggerGetData('click');
       }
+
       onClick && onClick(e);
     }
+
     function renderArea(locale) {
       switch (nowStatus) {
         case 'before-ready':
           return beforeReadyArea;
+
         case 'prepare':
           return prepareArea === void 0 ? /*#__PURE__*/_react.default.createElement("div", {
             className: "load-more-text prepare"
           }, trigger === 'scroll' ? locale.LoadMore.prepareScrollText : locale.LoadMore.prepareClickText, locale.LoadMore.loadMoreText) : prepareArea;
+
         case 'loading':
           return loadingArea === void 0 ? /*#__PURE__*/_react.default.createElement("div", {
             className: "load-more-text loading"
           }, locale.LoadMore.loadingText) : loadingArea;
+
         case 'nomore':
           return noMoreArea === void 0 ? /*#__PURE__*/_react.default.createElement("div", {
             className: "load-more-text nomore"
           }, locale.LoadMore.noDataText) : noMoreArea;
+
         case 'retry':
           return retryArea === void 0 ? /*#__PURE__*/_react.default.createElement("div", {
             className: "load-more-text retry"
           }, locale.LoadMore.failLoadText) : retryArea;
+
         default:
           return null;
       }
     }
+
     return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, function (_ref) {
       var prefixCls = _ref.prefixCls,
-        _ref$locale = _ref.locale,
-        locale = _ref$locale === void 0 ? _mobileUtils.defaultLocale : _ref$locale;
+          _ref$locale = _ref.locale,
+          locale = _ref$locale === void 0 ? _mobileUtils.defaultLocale : _ref$locale;
       return /*#__PURE__*/_react.default.createElement("div", {
         className: prefixCls + "-load-more status-" + nowStatus + " " + className,
         ref: domRef,

package/umd/loading/index.js

@@ -14,12 +14,16 @@
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
   _exports.__esModule = true;
   _exports.default = void 0;
   _extends2 = _interopRequireDefault(_extends2);
   _react = _interopRequireWildcard(_react);
+
   function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
   function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
   /**
    * 加载中组件，分为四种类型，`circle`为环形，`arc`为弧线，`spin`为旋转，`dot`为圆点。所有类型均可定制颜色，环形和弧线类型可定制线圈半径及粗细，旋转和圆点类型可定制内部元素透明度。
    * @en Loading component, divided into four types, `circle` is a ring, `arc` is an arc `spin` is a rotation, and `dot` is a dot. All types can be customized in color, ring and arc types can be customized with coil radius and thickness, and rotation and dot types can be customized with internal element transparency.
@@ -30,32 +34,36 @@
    */
   var Loading = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     var style = props.style,
-      _props$className = props.className,
-      className = _props$className === void 0 ? '' : _props$className,
-      color = props.color,
-      _props$type = props.type,
-      type = _props$type === void 0 ? 'dot' : _props$type,
-      list = props.list,
-      _props$duration = props.duration,
-      duration = _props$duration === void 0 ? 1000 : _props$duration,
-      _props$svgKey = props.svgKey,
-      userSetSvgKey = _props$svgKey === void 0 ? '' : _props$svgKey,
-      _props$radius = props.radius,
-      radius = _props$radius === void 0 ? 9 : _props$radius,
-      _props$stroke = props.stroke,
-      stroke = _props$stroke === void 0 ? 2 : _props$stroke,
-      _props$filleted = props.filleted,
-      filleted = _props$filleted === void 0 ? true : _props$filleted;
+        _props$className = props.className,
+        className = _props$className === void 0 ? '' : _props$className,
+        color = props.color,
+        _props$type = props.type,
+        type = _props$type === void 0 ? 'dot' : _props$type,
+        list = props.list,
+        _props$duration = props.duration,
+        duration = _props$duration === void 0 ? 1000 : _props$duration,
+        _props$svgKey = props.svgKey,
+        userSetSvgKey = _props$svgKey === void 0 ? '' : _props$svgKey,
+        _props$radius = props.radius,
+        radius = _props$radius === void 0 ? 9 : _props$radius,
+        _props$stroke = props.stroke,
+        stroke = _props$stroke === void 0 ? 2 : _props$stroke,
+        _props$filleted = props.filleted,
+        filleted = _props$filleted === void 0 ? true : _props$filleted;
+
     var _useState = (0, _react.useState)([]),
-      statusList = _useState[0],
-      setStatusList = _useState[1];
+        statusList = _useState[0],
+        setStatusList = _useState[1];
+
     var timerId = (0, _react.useRef)(-1);
     var halfCircle = Math.PI * radius;
     var circlePos = 0.5 * stroke + radius;
     var circleSize = radius * 2 + stroke;
     var domRef = (0, _react.useRef)(null);
+
     var _useGenSvgKey = (0, _helpers.useGenSvgKey)(userSetSvgKey),
-      svgKey = _useGenSvgKey.svgKey;
+        svgKey = _useGenSvgKey.svgKey;
+
     (0, _react.useImperativeHandle)(ref, function () {
       return {
         dom: domRef.current
@@ -71,6 +79,7 @@
           setStatusList(newList);
         }, interval);
       }
+
       return function () {
         if (timerId.current >= 0) {
           clearInterval(timerId.current);
@@ -79,6 +88,7 @@
     }, [type, statusList, duration]);
     (0, _react.useEffect)(function () {
       var newList;
+
       if (list && list.length) {
         newList = list;
       } else {
@@ -86,16 +96,20 @@
           case 'spin':
             newList = [1, 0.1, 0.2286, 0.3572, 0.4858, 0.6144, 0.743, 0.8716];
             break;
+
           case 'dot':
             newList = [0.2, 0.6, 1];
             break;
+
           default:
             newList = [];
             break;
         }
       }
+
       setStatusList(newList);
     }, [list, type]);
+
     function renderSpin() {
       var len = statusList.length;
       return statusList.map(function (opacity, index) {
@@ -117,6 +131,7 @@
         }));
       });
     }
+
     function renderDot() {
       return statusList.map(function (opacity, index) {
         return /*#__PURE__*/_react.default.createElement("span", {
@@ -131,6 +146,7 @@
         });
       });
     }
+
     function renderCircle() {
       return /*#__PURE__*/_react.default.createElement("svg", {
         viewBox: "0 0 " + circleSize + " " + circleSize
@@ -197,6 +213,7 @@
         }
       }) : null);
     }
+
     function renderArc() {
       return /*#__PURE__*/_react.default.createElement("svg", {
         viewBox: "0 0 " + circleSize + " " + circleSize
@@ -223,20 +240,26 @@
         strokeLinecap: 'round'
       } : {})));
     }
+
     function renderLoadingByType() {
       switch (type) {
         case 'spin':
           return renderSpin();
+
         case 'dot':
           return renderDot();
+
         case 'circle':
           return renderCircle();
+
         case 'arc':
           return renderArc();
+
         default:
           return null;
       }
     }
+
     function getLoadingStyle() {
       var circleStyle = (0, _mobileUtils.isOneOf)(type, ['circle', 'arc']) ? {
         width: circleSize,
@@ -246,6 +269,7 @@
         animationDuration: duration + "ms"
       }, circleStyle, style || {}));
     }
+
     return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, function (_ref) {
       var prefixCls = _ref.prefixCls;
       return /*#__PURE__*/_react.default.createElement("div", {

package/umd/masking/index.d.ts

@@ -205,11 +205,11 @@ declare const _default: React.ForwardRefExoticComponent<MaskingProps & React.Ref
      * @param {MaskingProps} config Configuration
      * @returns {{ close: () => void; update: (newConfig: MaskingProps) => void; }}
      */
-    open: (config: Pick<import("../context-provider").WithGlobalContext<MaskingProps & React.RefAttributes<MaskingRef>>, "children" | "ref" | "key" | "context" | "getContainer" | "mountOnEnter" | "unmountOnExit" | "className" | "onClose" | "contentAtCenter" | "maskClass" | "maskStyle" | "contentClass" | "contentStyle" | "maskTransitionType" | "contentTransitionType" | "maskTransitionTimeout" | "contentTransitionTimeout" | "maskClosable" | "animatingClosable" | "orientationDirection" | "preventBodyScroll" | "initialBodyOverflow" | "gestureOutOfControl" | "onOpen" | "onMaskClick" | "onTouchMove" | "onPreventTouchMove" | "getScrollContainer"> & {
+    open: (config: Pick<import("../context-provider").WithGlobalContext<MaskingProps & React.RefAttributes<MaskingRef>>, "children" | "ref" | "key" | "context" | "className" | "getContainer" | "mountOnEnter" | "unmountOnExit" | "onClose" | "contentAtCenter" | "maskClass" | "maskStyle" | "contentClass" | "contentStyle" | "maskTransitionType" | "contentTransitionType" | "maskTransitionTimeout" | "contentTransitionTimeout" | "maskClosable" | "animatingClosable" | "orientationDirection" | "preventBodyScroll" | "initialBodyOverflow" | "gestureOutOfControl" | "onOpen" | "onMaskClick" | "onTouchMove" | "onPreventTouchMove" | "getScrollContainer"> & {
         key?: string | undefined;
     }, context?: import("../context-provider").GlobalContextParams | undefined) => {
         close: () => void;
-        update: (newConfig: Pick<import("../context-provider").WithGlobalContext<MaskingProps & React.RefAttributes<MaskingRef>>, "children" | "ref" | "key" | "context" | "getContainer" | "mountOnEnter" | "unmountOnExit" | "className" | "onClose" | "contentAtCenter" | "maskClass" | "maskStyle" | "contentClass" | "contentStyle" | "maskTransitionType" | "contentTransitionType" | "maskTransitionTimeout" | "contentTransitionTimeout" | "maskClosable" | "animatingClosable" | "orientationDirection" | "preventBodyScroll" | "initialBodyOverflow" | "gestureOutOfControl" | "onOpen" | "onMaskClick" | "onTouchMove" | "onPreventTouchMove" | "getScrollContainer"> & {
+        update: (newConfig: Pick<import("../context-provider").WithGlobalContext<MaskingProps & React.RefAttributes<MaskingRef>>, "children" | "ref" | "key" | "context" | "className" | "getContainer" | "mountOnEnter" | "unmountOnExit" | "onClose" | "contentAtCenter" | "maskClass" | "maskStyle" | "contentClass" | "contentStyle" | "maskTransitionType" | "contentTransitionType" | "maskTransitionTimeout" | "contentTransitionTimeout" | "maskClosable" | "animatingClosable" | "orientationDirection" | "preventBodyScroll" | "initialBodyOverflow" | "gestureOutOfControl" | "onOpen" | "onMaskClick" | "onTouchMove" | "onPreventTouchMove" | "getScrollContainer"> & {
             key?: string | undefined;
         }) => void;
     };

package/umd/masking/index.js

@@ -14,6 +14,7 @@
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
   _exports.__esModule = true;
   var _exportNames = {
     methodsGenerator: true
@@ -29,49 +30,52 @@
     if (key in _exports && _exports[key] === _methods[key]) return;
     _exports[key] = _methods[key];
   });
+
   function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
   function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
   var Masking = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     var className = props.className,
-      _props$visible = props.visible,
-      visible = _props$visible === void 0 ? false : _props$visible,
-      maskClass = props.maskClass,
-      maskStyle = props.maskStyle,
-      contentClass = props.contentClass,
-      contentStyle = props.contentStyle,
-      close = props.close,
-      onClose = props.onClose,
-      onOpen = props.onOpen,
-      onMaskClick = props.onMaskClick,
-      children = props.children,
-      _props$maskTransition = props.maskTransitionType,
-      maskTransitionType = _props$maskTransition === void 0 ? 'fade' : _props$maskTransition,
-      _props$contentTransit = props.contentTransitionType,
-      contentTransitionType = _props$contentTransit === void 0 ? 'fade' : _props$contentTransit,
-      _props$maskTransition2 = props.maskTransitionTimeout,
-      maskTransitionTimeout = _props$maskTransition2 === void 0 ? 300 : _props$maskTransition2,
-      _props$contentTransit2 = props.contentTransitionTimeout,
-      contentTransitionTimeout = _props$contentTransit2 === void 0 ? 300 : _props$contentTransit2,
-      _props$maskClosable = props.maskClosable,
-      maskClosable = _props$maskClosable === void 0 ? true : _props$maskClosable,
-      animatingClosable = props.animatingClosable,
-      _props$mountOnEnter = props.mountOnEnter,
-      mountOnEnter = _props$mountOnEnter === void 0 ? true : _props$mountOnEnter,
-      _props$unmountOnExit = props.unmountOnExit,
-      unmountOnExit = _props$unmountOnExit === void 0 ? true : _props$unmountOnExit,
-      _props$orientationDir = props.orientationDirection,
-      orientationDirection = _props$orientationDir === void 0 ? 'top' : _props$orientationDir,
-      _props$preventBodyScr = props.preventBodyScroll,
-      preventBodyScroll = _props$preventBodyScr === void 0 ? true : _props$preventBodyScr,
-      initialBodyOverflow = props.initialBodyOverflow,
-      _props$contentAtCente = props.contentAtCenter,
-      contentAtCenter = _props$contentAtCente === void 0 ? false : _props$contentAtCente,
-      _props$gestureOutOfCo = props.gestureOutOfControl,
-      gestureOutOfControl = _props$gestureOutOfCo === void 0 ? false : _props$gestureOutOfCo,
-      getContainer = props.getContainer,
-      getScrollContainer = props.getScrollContainer,
-      onPreventTouchMove = props.onPreventTouchMove,
-      onTouchMove = props.onTouchMove;
+        _props$visible = props.visible,
+        visible = _props$visible === void 0 ? false : _props$visible,
+        maskClass = props.maskClass,
+        maskStyle = props.maskStyle,
+        contentClass = props.contentClass,
+        contentStyle = props.contentStyle,
+        close = props.close,
+        onClose = props.onClose,
+        onOpen = props.onOpen,
+        onMaskClick = props.onMaskClick,
+        children = props.children,
+        _props$maskTransition = props.maskTransitionType,
+        maskTransitionType = _props$maskTransition === void 0 ? 'fade' : _props$maskTransition,
+        _props$contentTransit = props.contentTransitionType,
+        contentTransitionType = _props$contentTransit === void 0 ? 'fade' : _props$contentTransit,
+        _props$maskTransition2 = props.maskTransitionTimeout,
+        maskTransitionTimeout = _props$maskTransition2 === void 0 ? 300 : _props$maskTransition2,
+        _props$contentTransit2 = props.contentTransitionTimeout,
+        contentTransitionTimeout = _props$contentTransit2 === void 0 ? 300 : _props$contentTransit2,
+        _props$maskClosable = props.maskClosable,
+        maskClosable = _props$maskClosable === void 0 ? true : _props$maskClosable,
+        animatingClosable = props.animatingClosable,
+        _props$mountOnEnter = props.mountOnEnter,
+        mountOnEnter = _props$mountOnEnter === void 0 ? true : _props$mountOnEnter,
+        _props$unmountOnExit = props.unmountOnExit,
+        unmountOnExit = _props$unmountOnExit === void 0 ? true : _props$unmountOnExit,
+        _props$orientationDir = props.orientationDirection,
+        orientationDirection = _props$orientationDir === void 0 ? 'top' : _props$orientationDir,
+        _props$preventBodyScr = props.preventBodyScroll,
+        preventBodyScroll = _props$preventBodyScr === void 0 ? true : _props$preventBodyScr,
+        initialBodyOverflow = props.initialBodyOverflow,
+        _props$contentAtCente = props.contentAtCenter,
+        contentAtCenter = _props$contentAtCente === void 0 ? false : _props$contentAtCente,
+        _props$gestureOutOfCo = props.gestureOutOfControl,
+        gestureOutOfControl = _props$gestureOutOfCo === void 0 ? false : _props$gestureOutOfCo,
+        getContainer = props.getContainer,
+        getScrollContainer = props.getScrollContainer,
+        onPreventTouchMove = props.onPreventTouchMove,
+        onTouchMove = props.onTouchMove;
     var domRef = (0, _react.useRef)(null);
     var maskRef = (0, _react.useRef)(null);
     var contentRef = (0, _react.useRef)(null);
@@ -79,15 +83,19 @@
     var isInitialMount = (0, _react.useRef)(false);
     var isAnimating = (0, _react.useRef)(false);
     var closeScene = (0, _react.useRef)('');
+
     var _useState = (0, _react.useState)(visible),
-      innerVisible = _useState[0],
-      setInnerVisible = _useState[1];
+        innerVisible = _useState[0],
+        setInnerVisible = _useState[1];
+
     var _useState2 = (0, _react.useState)(visible),
-      outerVisible = _useState2[0],
-      setOuterVisible = _useState2[1];
+        outerVisible = _useState2[0],
+        setOuterVisible = _useState2[1];
+
     var _useState3 = (0, _react.useState)(''),
-      extraClass = _useState3[0],
-      setExtraClass = _useState3[1];
+        extraClass = _useState3[0],
+        setExtraClass = _useState3[1];
+
     (0, _react.useImperativeHandle)(ref, function () {
       return {
         dom: domRef.current,
@@ -102,13 +110,17 @@
       if (timerRef.current >= 0) {
         clearTimeout(timerRef.current);
       }
+
       var mounted = isInitialMount.current;
+
       if (mounted) {
         isAnimating.current = true;
       }
+
       if (!mounted && !visible && !mountOnEnter) {
         setExtraClass('pre-mount');
       }
+
       if (visible) {
         setOuterVisible(true);
         (0, _mobileUtils.nextTick)(function () {
@@ -128,30 +140,39 @@
           closeScene.current = '';
         });
       }
+
       isInitialMount.current = true;
     }, [visible]);
+
     function setCloseScene(scene) {
       closeScene.current = scene;
     }
+
     function execAfterClose(callback) {
       return window.setTimeout(callback, Math.max(getMaxTimeout(maskTransitionTimeout, 'exit'), getMaxTimeout(contentTransitionTimeout, 'exit')));
     }
+
     function execAfterOpen(callback) {
       return window.setTimeout(callback, Math.max(getMaxTimeout(maskTransitionTimeout, 'enter'), getMaxTimeout(contentTransitionTimeout, 'enter')));
     }
+
     function getMaxTimeout(timeout, type) {
       return typeof timeout === 'number' ? timeout : timeout[type] || 0;
     }
+
     function handleMaskAction(e) {
       e.preventDefault();
       e.stopPropagation();
       onMaskClick == null ? void 0 : onMaskClick();
+
       if (!maskClosable || !animatingClosable && isAnimating.current) {
         return;
       }
+
       closeScene.current = 'mask';
       close == null ? void 0 : close(e);
     }
+
     function renderMasking(_ref) {
       var prefixCls = _ref.prefixCls;
       return !mountOnEnter || outerVisible || !unmountOnExit ? /*#__PURE__*/_react.default.createElement(_portal.default, {
@@ -184,8 +205,10 @@
         style: contentStyle
       }, children)))) : null;
     }
+
     return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, renderMasking);
   });
+
   function methodsGenerator(Comp) {
     return {
       /**
@@ -197,8 +220,8 @@
       open: (0, _methods.open)(Comp)
     };
   }
-  var MaskingWithGlobalContext = (0, _contextProvider.CompWithGlobalContext)(Masking);
 
+  var MaskingWithGlobalContext = (0, _contextProvider.CompWithGlobalContext)(Masking);
   /**
    * 通用模态弹窗，内部内容自定义。默认做了防滚动穿透处理，如果弹层内容中需要滚动，则需将滚动容器传入`getScrollContainer`属性以在未滚动到顶部或底部时释放滚动。
    * @en Generic modal popup with custom internal content. By default, anti-scroll penetration processing is performed. If scrolling is required in the content of the bullet layer, need to pass the scroll container to the `getScrollContainer` to release scrolling when it is not scrolled to the top or bottom.
@@ -207,6 +230,8 @@
    * @name 模态弹窗
    * @name_en Masking
    */
+
   var _default = (0, _mobileUtils.componentWrapper)(Masking, methodsGenerator(MaskingWithGlobalContext));
+
   _exports.default = _default;
 });

package/umd/masking/methods.js

@@ -14,16 +14,19 @@
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
   _exports.__esModule = true;
   _exports.getOpenMethod = getOpenMethod;
   _exports.open = open;
   _extends2 = _interopRequireDefault(_extends2);
+
   function getOpenMethod(Component, containerId, normalize) {
     if (normalize === void 0) {
       normalize = function normalize(config) {
         return config;
       };
     }
+
     return function (config, context) {
       var baseProps = (0, _extends2.default)({
         unmountOnExit: true
@@ -31,31 +34,39 @@
         visible: false,
         close: function close() {}
       });
-      var dynamicProps = (0, _extends2.default)({}, baseProps);
+      var dynamicProps = (0, _extends2.default)({}, baseProps); // 不同的key用不同的容器挂载
 
-      // 不同的key用不同的容器挂载
       var id = "_" + (containerId || 'ARCO_MASKING') + "_DIV_" + (config.key || '') + "_";
+
       var _appendElementById = (0, _mobileUtils.appendElementById)(id, baseProps.getContainer),
-        div = _appendElementById.child;
+          div = _appendElementById.child;
+
       var leaving = false;
+
       var _ReactDOMRender = new _render.ReactDOMRender(Component, div, context),
-        render = _ReactDOMRender.render;
+          render = _ReactDOMRender.render;
+
       function update(newConfig) {
         dynamicProps = (0, _extends2.default)({}, dynamicProps, normalize(newConfig));
         render(dynamicProps);
       }
+
       function close() {
         leaving = true;
         dynamicProps.visible = false;
         render(dynamicProps);
       }
+
       dynamicProps.close = close;
+
       dynamicProps.onClose = function (scene) {
         baseProps.onClose && baseProps.onClose(scene);
+
         if (baseProps.unmountOnExit) {
           (0, _mobileUtils.removeElement)(div);
         }
       };
+
       render(dynamicProps);
       (0, _mobileUtils.nextTick)(function () {
         if (leaving) return;
@@ -68,6 +79,7 @@
       };
     };
   }
+
   function open(Component, containerId) {
     return getOpenMethod(Component, containerId);
   }