@arco-design/mobile-react 2.21.3 → 2.22.0

package/esm/_helpers/index.d.ts

@@ -5,6 +5,7 @@
 import { CSSProperties } from 'react';
 export * from './hooks';
 export * from './type';
+export * from './react-dom';
 export declare function getStyleWithVendor(style: CSSProperties): CSSProperties;
 /**
  * 计算默认值，仅未定义时使用默认值

package/esm/_helpers/index.js

@@ -6,6 +6,7 @@ import _extends from "@babel/runtime/helpers/extends";
  */
 export * from './hooks';
 export * from './type';
+export * from './react-dom';
 export function getStyleWithVendor(style) {
   var allowReg = /(transform|transition|animation)/i;
   var newStyle = Object.keys(style).reduce(function (acc, key) {

package/esm/_helpers/react-dom.d.ts

@@ -0,0 +1,13 @@
+import { ReactElement } from 'react';
+export interface RootType {
+    render: (container: ReactElement) => void;
+    _unmount: () => void;
+}
+export interface RootTypeReact extends RootType {
+    unmount?: () => void;
+}
+export declare type CreateRootFnType = (container: Element | DocumentFragment) => RootTypeReact;
+export declare const render: (app: ReactElement, container: Element | DocumentFragment) => {
+    render: (container: ReactElement) => void;
+    _unmount: () => void;
+};

package/esm/_helpers/react-dom.js

@@ -0,0 +1,57 @@
+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
+  if (isObject(CopyReactDOM[__SECRET_INTERNALS__])) {
+    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 {
+  copyRender = function copyRender(app, container) {
+    CopyReactDOM.render(app, container);
+    return {
+      render: function render(comment) {
+        CopyReactDOM.render(comment, container);
+      },
+      _unmount: function _unmount() {
+        CopyReactDOM.unmountComponentAtNode(container);
+      }
+    };
+  };
+}
+
+export var render = copyRender;

package/esm/_helpers/render.d.ts

@@ -0,0 +1,10 @@
+import { FunctionComponent } from 'react';
+import { RootType } from './react-dom';
+export declare class ReactDOMRender {
+    root: RootType | undefined;
+    app: FunctionComponent;
+    container: Element | DocumentFragment;
+    constructor(app: FunctionComponent, container: Element | DocumentFragment);
+    render: (props: any) => void;
+    unmount: () => void;
+}

package/esm/_helpers/render.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import { render as copyRender } from './react-dom';
+export var ReactDOMRender = function ReactDOMRender(app, container) {
+  var _this = this;
+
+  this.root = void 0;
+  this.app = void 0;
+  this.container = void 0;
+
+  this.render = function (props) {
+    var CustomApp = _this.app;
+
+    if (_this.root) {
+      _this.root.render( /*#__PURE__*/React.createElement(CustomApp, props));
+    } else {
+      _this.root = copyRender( /*#__PURE__*/React.createElement(CustomApp, props), _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;
+};

package/esm/action-sheet/index.d.ts

@@ -26,7 +26,7 @@ export interface ActionSheetItemOptions {
      * 点击选项事件，返回值为 true 时可以阻止动作面板关闭
      * @en Click option event, actionSheet will be prevent from closing when returning true
      */
-    onClick?: (e: React.MouseEvent<HTMLElement, MouseEvent>) => (void | boolean) | Promise<void | boolean>;
+    onClick?: (e?: React.MouseEvent<HTMLElement, MouseEvent>) => (void | boolean) | Promise<void | boolean>;
 }
 export interface ActionSheetProps extends Omit<PopupProps, 'children' | 'getScrollContainer' | 'orientationDirection' | 'direction'> {
     /**

package/esm/image-picker/index.js

@@ -166,7 +166,6 @@ var ImagePicker = /*#__PURE__*/forwardRef(function (props, ref) {
   var timeOutEvent;
 
   var handleTouchStart = function handleTouchStart(e, image, index) {
-    e.preventDefault();
     timeOutEvent = setTimeout(function () {
       timeOutEvent = 0;
       onLongPress == null ? void 0 : onLongPress(e, image, index);

package/esm/image-preview/index.d.ts

@@ -254,11 +254,7 @@ export declare function methodsGenerator<P extends ImagePreviewProps>(Comp: Reac
      */
     open: (config: Pick<P, Exclude<keyof P, "close">>) => {
         close: () => void;
-        update: (newConfig: Pick<P, Exclude<keyof P, "close">>) => void; /**
-         * 是否可循环滑动
-         * @en Whether it can be swiped circularly
-         * @default false
-         */
+        update: (newConfig: Pick<P, Exclude<keyof P, "close">>) => void;
     };
 };
 declare const _default: React.ForwardRefExoticComponent<ImagePreviewProps & React.RefAttributes<ImagePreviewRef>> & {
@@ -270,11 +266,7 @@ declare const _default: React.ForwardRefExoticComponent<ImagePreviewProps & Reac
      */
     open: (config: Pick<ImagePreviewProps & React.RefAttributes<ImagePreviewRef>, "style" | "ref" | "key" | "getContainer" | "className" | "onClose" | "onTouchMove" | "fit" | "loadingArea" | "errorArea" | "showLoading" | "showError" | "retryTime" | "staticLabel" | "onChange" | "onTouchEnd" | "onTouchStart" | "animateDurationSlide" | "loop" | "swipeable" | "renderIndicator" | "indicatorPos" | "showIndicator" | "hideSingleIndicator" | "spaceBetween" | "percentToChange" | "distanceToChange" | "speedToChange" | "lazyloadCount" | "onAfterChange" | "images" | "openIndex" | "displayDuration" | "replaceFallbackWhenLoaded" | "noselect" | "scrollBezier" | "swipeToClose" | "getMinScale" | "getMaxScale" | "getDoubleClickScale" | "getThumbBounds" | "onImageClick" | "onImageDoubleClick" | "onImageLongTap">) => {
         close: () => void;
-        update: (newConfig: Pick<ImagePreviewProps & React.RefAttributes<ImagePreviewRef>, "style" | "ref" | "key" | "getContainer" | "className" | "onClose" | "onTouchMove" | "fit" | "loadingArea" | "errorArea" | "showLoading" | "showError" | "retryTime" | "staticLabel" | "onChange" | "onTouchEnd" | "onTouchStart" | "animateDurationSlide" | "loop" | "swipeable" | "renderIndicator" | "indicatorPos" | "showIndicator" | "hideSingleIndicator" | "spaceBetween" | "percentToChange" | "distanceToChange" | "speedToChange" | "lazyloadCount" | "onAfterChange" | "images" | "openIndex" | "displayDuration" | "replaceFallbackWhenLoaded" | "noselect" | "scrollBezier" | "swipeToClose" | "getMinScale" | "getMaxScale" | "getDoubleClickScale" | "getThumbBounds" | "onImageClick" | "onImageDoubleClick" | "onImageLongTap">) => void; /**
-         * 是否可循环滑动
-         * @en Whether it can be swiped circularly
-         * @default false
-         */
+        update: (newConfig: Pick<ImagePreviewProps & React.RefAttributes<ImagePreviewRef>, "style" | "ref" | "key" | "getContainer" | "className" | "onClose" | "onTouchMove" | "fit" | "loadingArea" | "errorArea" | "showLoading" | "showError" | "retryTime" | "staticLabel" | "onChange" | "onTouchEnd" | "onTouchStart" | "animateDurationSlide" | "loop" | "swipeable" | "renderIndicator" | "indicatorPos" | "showIndicator" | "hideSingleIndicator" | "spaceBetween" | "percentToChange" | "distanceToChange" | "speedToChange" | "lazyloadCount" | "onAfterChange" | "images" | "openIndex" | "displayDuration" | "replaceFallbackWhenLoaded" | "noselect" | "scrollBezier" | "swipeToClose" | "getMinScale" | "getMaxScale" | "getDoubleClickScale" | "getThumbBounds" | "onImageClick" | "onImageDoubleClick" | "onImageLongTap">) => void;
     };
 };
 /**

package/esm/image-preview/methods.js

@@ -1,7 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
-import ReactDOM from 'react-dom';
 import { appendElementById, removeElement } from '@arco-design/mobile-utils';
+import { ReactDOMRender } from '../_helpers/render';
 export function open(Component) {
   return function (config) {
     var baseProps = _extends({
@@ -21,13 +20,8 @@ export function open(Component) {
 
     var leaving = false;
 
-    function render(props) {
-      ReactDOM.render( /*#__PURE__*/React.createElement(Component, _extends({}, props, {
-        getContainer: function getContainer() {
-          return div;
-        }
-      })), div);
-    }
+    var _ReactDOMRender = new ReactDOMRender(Component, div),
+        render = _ReactDOMRender.render;
 
     function update(newConfig) {
       dynamicProps = _extends({}, dynamicProps, newConfig || {});

package/esm/masking/index.d.ts

@@ -192,6 +192,11 @@ export declare function methodsGenerator<P extends OpenBaseProps>(Comp: React.Fu
     open: (config: Pick<P, Exclude<keyof P, "visible" | "close">> & {
         key?: string | undefined;
     }) => {
+        /**
+         * 点击蒙层是否关闭菜单
+         * @en Whether to click the mask to close the menu
+         * @default true
+         */
         close: () => void;
         update: (newConfig: Pick<P, Exclude<keyof P, "visible" | "close">> & {
             key?: string | undefined;
@@ -208,6 +213,11 @@ declare const _default: React.ForwardRefExoticComponent<MaskingProps & React.Ref
     open: (config: Pick<MaskingProps & React.RefAttributes<MaskingRef>, "ref" | "children" | "key" | "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"> & {
         key?: string | undefined;
     }) => {
+        /**
+         * 点击蒙层是否关闭菜单
+         * @en Whether to click the mask to close the menu
+         * @default true
+         */
         close: () => void;
         update: (newConfig: Pick<MaskingProps & React.RefAttributes<MaskingRef>, "ref" | "children" | "key" | "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"> & {
             key?: string | undefined;

package/esm/masking/methods.js

@@ -1,7 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
-import ReactDOM from 'react-dom';
 import { appendElementById, removeElement, nextTick } from '@arco-design/mobile-utils';
+import { ReactDOMRender } from '../_helpers/render';
 export function getOpenMethod(Component, containerId, normalize) {
   if (normalize === void 0) {
     normalize = function normalize(config) {
@@ -27,13 +26,8 @@ export function getOpenMethod(Component, containerId, normalize) {
 
     var leaving = false;
 
-    function render(props) {
-      ReactDOM.render( /*#__PURE__*/React.createElement(Component, _extends({}, props, {
-        getContainer: function getContainer() {
-          return div;
-        }
-      })), div);
-    }
+    var _ReactDOMRender = new ReactDOMRender(Component, div),
+        render = _ReactDOMRender.render;
 
     function update(newConfig) {
       dynamicProps = _extends({}, dynamicProps, normalize(newConfig));

package/esm/notify/methods.js

@@ -1,7 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import { nextTick } from '@arco-design/mobile-utils';
-import React from 'react';
-import ReactDOM from 'react-dom';
+import { ReactDOMRender } from '../_helpers/render';
 export function notify(Component, type) {
   return function (originConfig) {
     var config = typeof originConfig === 'string' ? {
@@ -22,16 +21,16 @@ export function notify(Component, type) {
       document.body.appendChild(div);
     }
 
-    function render(props) {
-      ReactDOM.render( /*#__PURE__*/React.createElement(Component, props), div);
-    }
+    var _ReactDOMRender = new ReactDOMRender(Component, div),
+        render = _ReactDOMRender.render,
+        unmount = _ReactDOMRender.unmount;
 
     function destroy() {
       var onClose = config.onClose;
       onClose && onClose();
-      var unmountResult = ReactDOM.unmountComponentAtNode(div);
+      unmount();
 
-      if (unmountResult && div.parentNode) {
+      if (div.parentNode) {
         div.parentNode.removeChild(div);
       }
     }

package/esm/popover/hooks/useEvent.js

@@ -40,6 +40,7 @@ export var useEvent = function useEvent(props, wrapperRef, popoverInnerRef, visi
     onVisibleChange(false);
     window.clearTimeout(closeTimer.current);
     closeTimer.current = 0;
+    mayRemoveEventListenerOnBody();
   };
 
   var throttleHandleVerticalScroll = useMemo(function () {
@@ -59,7 +60,7 @@ export var useEvent = function useEvent(props, wrapperRef, popoverInnerRef, visi
     };
   }, [throttleHandleVerticalScroll, getVerticalScrollContainer, autoVerticalDirection, visibleRef]);
   var mayRemoveEventListenerOnBody = useCallback(function () {
-    document.body.removeEventListener('click', handleClickBody);
+    document.body.removeEventListener('click', handleClickBody, true);
     document.body.removeEventListener('touchstart', handleTouchBody);
     var el = getVerticalScrollContainer();
 
@@ -74,7 +75,6 @@ export var useEvent = function useEvent(props, wrapperRef, popoverInnerRef, visi
     // 仅处理子元素和气泡元素外的点击事件
     // @en Only handle click events outside of children elements and bubble elements
     if (!isContains(wrapperRef.current, e.target) && !isContains(((_popoverInnerRef$curr = popoverInnerRef.current) == null ? void 0 : _popoverInnerRef$curr.dom) || null, e.target)) {
-      // TODO: 这里仅阻止了react事件，react 18 将不再在document上挂事件，这里的stop会失效
       if (preventBodyClick) {
         e.stopPropagation();
         e.preventDefault();
@@ -100,13 +100,13 @@ export var useEvent = function useEvent(props, wrapperRef, popoverInnerRef, visi
     var handle = function handle(e) {
       e.stopPropagation();
       e.preventDefault();
-      document.body.removeEventListener('click', handle);
+      document.body.removeEventListener('click', handle, true);
       clearTimeout(preventRecentClickTimer);
     };
 
-    document.body.addEventListener('click', handle);
+    document.body.addEventListener('click', handle, true);
     preventRecentClickTimer = window.setTimeout(function () {
-      document.body.removeEventListener('click', handle);
+      document.body.removeEventListener('click', handle, true);
     }, 500);
   };
 
@@ -149,7 +149,7 @@ export var useEvent = function useEvent(props, wrapperRef, popoverInnerRef, visi
       var el = getVerticalScrollContainer();
       el && el.addEventListener('scroll', handleScrollBody);
     } else if (clickOtherToClose) {
-      document.body.addEventListener('click', handleClickBody);
+      document.body.addEventListener('click', handleClickBody, true);
     }
   };
   /**

package/esm/swipe-action/index.js

@@ -51,6 +51,7 @@ var SwipeAction = /*#__PURE__*/forwardRef(function (props, ref) {
 
   var dampRateRef = useLatestRef(dampRate);
   var forbidClick = useRef(false);
+  var scrollingRef = useRef(null);
 
   var _useRefState = useRefState(false),
       moving = _useRefState[0],
@@ -67,6 +68,7 @@ var SwipeAction = /*#__PURE__*/forwardRef(function (props, ref) {
 
   var startRef = useRef(0);
   var startX = useRef(0);
+  var startY = useRef(0);
   var slideX = useRef(0);
   var isLayer = openStyleType === 'layer';
   var transitionStyle = useMemo(function () {
@@ -77,6 +79,7 @@ var SwipeAction = /*#__PURE__*/forwardRef(function (props, ref) {
 
   function resetMoveData() {
     startX.current = 0;
+    startY.current = 0;
     slideX.current = 0;
   }
 
@@ -88,19 +91,34 @@ var SwipeAction = /*#__PURE__*/forwardRef(function (props, ref) {
   function touchstart(e) {
     startRef.current = offsetRef.current;
     resetMoveData();
+    scrollingRef.current = null;
     startX.current = e.touches[0].pageX;
+    startY.current = e.touches[0].pageY;
   }
 
   function touchmove(e) {
-    e.preventDefault();
-    slideX.current = e.touches[0].pageX - startX.current;
+    var x = e.changedTouches[0].pageX - startX.current;
+    var y = e.changedTouches[0].pageY - startY.current;
+
+    if (scrollingRef.current === null) {
+      scrollingRef.current = Math.abs(x) < Math.abs(y);
+    }
+
+    if (scrollingRef.current) {
+      setMoving(false);
+      setOffset(0);
+      return;
+    }
+
+    e.cancelable && e.preventDefault();
+    slideX.current = x;
     forbidClick.current = true;
     setMoving(true);
     setOffset(getMenuCurrentWidth(slideX.current + startRef.current, -rightMenuWidthRef.current, leftMenuWidthRef.current));
   }
 
   function touchend() {
-    if (movingRef.current) {
+    if (movingRef.current && !scrollingRef.current) {
       var currentMenu = offsetRef.current > 0 ? 'left' : 'right';
       changeMenu(currentMenu);
       setMoving(false);

package/esm/tabs/index.js

@@ -117,7 +117,9 @@ var Tabs = /*#__PURE__*/forwardRef(function (props, ref) {
       _props$translateZ = props.translateZ,
       translateZ = _props$translateZ === void 0 ? true : _props$translateZ,
       fullScreen = props.fullScreen,
-      autoHeight = props.autoHeight;
+      autoHeight = props.autoHeight,
+      _props$tabBarStopProp = props.tabBarStopPropagation,
+      tabBarStopPropagation = _props$tabBarStopProp === void 0 ? true : _props$tabBarStopProp;
   var domRef = useRef(null);
   var cellRef = useRef(null);
   var paneRef = useRef(null);
@@ -472,7 +474,8 @@ var Tabs = /*#__PURE__*/forwardRef(function (props, ref) {
       renderTabBarItem: renderTabBarItem,
       renderTabBarInner: renderTabBarInner,
       tabBarStyle: tabBarStyle,
-      tabBarClass: tabBarClass
+      tabBarClass: tabBarClass,
+      tabBarStopPropagation: tabBarStopPropagation
     }, commonProps);
 
     var CellComp = /*#__PURE__*/React.createElement(TabCell, cellProps);

package/esm/tabs/tab-cell.js

@@ -48,7 +48,8 @@ var TabCell = /*#__PURE__*/forwardRef(function (props, ref) {
       renderTabBarInner = props.renderTabBarInner,
       tabBarStyle = props.tabBarStyle,
       tabBarClass = props.tabBarClass,
-      translateZ = props.translateZ;
+      translateZ = props.translateZ,
+      tabBarStopPropagation = props.tabBarStopPropagation;
   var prefix = prefixCls + "-tab-cell";
   var domRef = useRef(null);
   var underlineRef = useRef(null);
@@ -140,13 +141,13 @@ var TabCell = /*#__PURE__*/forwardRef(function (props, ref) {
       return e.stopPropagation();
     };
 
-    if (isVertical && hasOverflow && domRef.current) {
+    if (isVertical && hasOverflow && domRef.current && tabBarStopPropagation) {
       domRef.current.addEventListener('touchstart', stopFunc);
       domRef.current.addEventListener('touchmove', stopFunc);
     }
 
     return function () {
-      if (isVertical && hasOverflow && domRef.current) {
+      if (isVertical && hasOverflow && domRef.current && tabBarStopPropagation) {
         domRef.current.removeEventListener('touchstart', stopFunc);
         domRef.current.removeEventListener('touchmove', stopFunc);
       }

package/esm/tabs/type.d.ts

@@ -421,6 +421,12 @@ export interface TabsProps {
      * @en Tabbar underline inner style, applied to tab-cell-underline-inner
      */
     underlineInnerStyle?: React.CSSProperties;
+    /**
+     * 当前 TabBar 的触摸事件是否需要 stopPropagation
+     * @en Does the touch event of the current TabBar require stopPropagation
+     * @default true
+     */
+    tabBarStopPropagation?: boolean;
 }
 export interface TabsRef {
     /**
@@ -510,6 +516,11 @@ export interface TabCellProps extends Pick<TabsProps, 'tabs' | 'type' | 'onTabCl
      * @en The distance the underline has been swiped
      */
     jumpingDis: number;
+    /**
+     * 当前 TabBar 的触摸事件是否需要 stopPropagation
+     * @en Does the touch event of the current TabBar require stopPropagation
+     */
+    tabBarStopPropagation: boolean;
 }
 export interface TabCellRef {
     /**

package/esm/toast/methods.js

@@ -1,7 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
-import ReactDOM from 'react-dom';
 import { nextTick } from '@arco-design/mobile-utils';
+import { ReactDOMRender } from '../_helpers/render';
 export function toast(Component, type) {
   return function (originConfig) {
     var config = typeof originConfig === 'string' ? {
@@ -17,16 +16,16 @@ export function toast(Component, type) {
     var div = document.createElement('div');
     document.body.appendChild(div);
 
-    function render(props) {
-      ReactDOM.render( /*#__PURE__*/React.createElement(Component, props), div);
-    }
+    var _ReactDOMRender = new ReactDOMRender(Component, div),
+        render = _ReactDOMRender.render,
+        unmount = _ReactDOMRender.unmount;
 
-    function destory() {
+    function destroy() {
       var onClose = config.onClose;
       onClose && onClose();
-      var unmountResult = ReactDOM.unmountComponentAtNode(div);
+      unmount();
 
-      if (unmountResult && div.parentNode) {
+      if (div.parentNode) {
         div.parentNode.removeChild(div);
       }
     }
@@ -36,7 +35,7 @@ export function toast(Component, type) {
       getContainer: function getContainer() {
         return div;
       },
-      onClose: destory,
+      onClose: destroy,
       visible: false
     });
 

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@arco-design/mobile-react",
-    "version": "2.21.3",
+    "version": "2.22.0",
     "description": "",
     "main": "cjs/index.js",
     "module": "esm/index.js",
@@ -15,7 +15,7 @@
     "author": "taoyiyue@bytedance.com",
     "license": "ISC",
     "dependencies": {
-        "@arco-design/mobile-utils": "^2.12.3",
+        "@arco-design/mobile-utils": "^2.12.4",
         "@arco-design/transformable": "^1.0.0",
         "es6-promise": "^4.2.8",
         "lodash.throttle": "^4.1.1",
@@ -36,5 +36,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "12927a2cee1ac841f4e96754c72e6cd95633e68a"
+    "gitHead": "00c2641c2230e9115db0af84f0b16545b6c8b8e3"
 }

package/umd/_helpers/index.d.ts

@@ -5,6 +5,7 @@
 import { CSSProperties } from 'react';
 export * from './hooks';
 export * from './type';
+export * from './react-dom';
 export declare function getStyleWithVendor(style: CSSProperties): CSSProperties;
 /**
  * 计算默认值，仅未定义时使用默认值

package/umd/_helpers/index.js

@@ -1,16 +1,16 @@
 (function (global, factory) {
   if (typeof define === "function" && define.amd) {
-    define(["exports", "@babel/runtime/helpers/extends", "./hooks", "./type"], factory);
+    define(["exports", "@babel/runtime/helpers/extends", "./hooks", "./type", "./react-dom"], factory);
   } else if (typeof exports !== "undefined") {
-    factory(exports, require("@babel/runtime/helpers/extends"), require("./hooks"), require("./type"));
+    factory(exports, require("@babel/runtime/helpers/extends"), require("./hooks"), require("./type"), require("./react-dom"));
   } else {
     var mod = {
       exports: {}
     };
-    factory(mod.exports, global._extends, global.hooks, global.type);
+    factory(mod.exports, global._extends, global.hooks, global.type, global.reactDom);
     global.index = mod.exports;
   }
-})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _extends3, _hooks, _type) {
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _extends3, _hooks, _type, _reactDom) {
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -35,6 +35,12 @@
     if (key in _exports && _exports[key] === _type[key]) return;
     _exports[key] = _type[key];
   });
+  Object.keys(_reactDom).forEach(function (key) {
+    if (key === "default" || key === "__esModule") return;
+    if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+    if (key in _exports && _exports[key] === _reactDom[key]) return;
+    _exports[key] = _reactDom[key];
+  });
 
   /**
    * @type utils

package/umd/_helpers/react-dom.d.ts

@@ -0,0 +1,13 @@
+import { ReactElement } from 'react';
+export interface RootType {
+    render: (container: ReactElement) => void;
+    _unmount: () => void;
+}
+export interface RootTypeReact extends RootType {
+    unmount?: () => void;
+}
+export declare type CreateRootFnType = (container: Element | DocumentFragment) => RootTypeReact;
+export declare const render: (app: ReactElement, container: Element | DocumentFragment) => {
+    render: (container: ReactElement) => void;
+    _unmount: () => void;
+};