@arco-design/mobile-react 2.21.3 → 2.22.2

package/tokens/app/arcodesign/default/index.less

@@ -516,9 +516,13 @@
 @notify-font-size: ~`pxtorem(14)`;
 @notify-min-height: ~`pxtorem(36)`;
 @steps-padding: ~`pxtorem(16)` 0;
-@steps-tail-horizontal-padding: 0 ~`pxtorem(18)`;
-@steps-tail-vertical-padding: ~`pxtorem(14)` 0;
-@steps-tail-vertical-top: ~`pxtorem(9)`;
+@steps-tail-border-radius: 2PX;
+@steps-tail-horizontal-gutter: 18PX;
+@steps-tail-vertical-gutter: 14PX;
+@steps-tail-horizontal-padding: 0 @steps-tail-horizontal-gutter;
+@steps-tail-vertical-padding: @steps-tail-vertical-gutter 0;
+@steps-tail-horizontal-left: 9PX;
+@steps-tail-vertical-top: 9PX;
 @steps-tail-standard-size: 1PX;
 @steps-tail-standard-background: @line-color;
 @steps-tail-finish-background: @primary-color;

package/tokens/mixin/index.less

@@ -38,7 +38,7 @@
     }
 }
 
-.text-medium-var(@color, @stroke: 0.3PX) {
+.text-medium-var(@color: currentColor, @stroke: 0.3PX) {
     .text-medium(@@color, @stroke);
     & when (@use-css-vars = 1) {
         .text-medium(var(~"--@{color}", @@color), @stroke);

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;
+};

package/umd/_helpers/react-dom.js

@@ -0,0 +1,78 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["exports", "react-dom"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(exports, require("react-dom"));
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(mod.exports, global.reactDom);
+    global.reactDom = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _reactDom) {
+  "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
+    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);
+        }
+      };
+    };
+  }
+
+  var render = copyRender;
+  _exports.render = render;
+});

package/umd/_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/umd/_helpers/render.js

@@ -0,0 +1,51 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["exports", "react", "./react-dom"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(exports, require("react"), require("./react-dom"));
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(mod.exports, global.react, global.reactDom);
+    global.render = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _react, _reactDom) {
+  "use strict";
+
+  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+  _exports.__esModule = true;
+  _exports.ReactDOMRender = void 0;
+  _react = _interopRequireDefault(_react);
+
+  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.default.createElement(CustomApp, props));
+      } else {
+        _this.root = (0, _reactDom.render)( /*#__PURE__*/_react.default.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;
+  };
+
+  _exports.ReactDOMRender = ReactDOMRender;
+});

package/umd/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/umd/action-sheet/style/css/index.css

@@ -46,8 +46,8 @@
 .arco-action-sheet-title.android,
 .arco-action-sheet-title.system-android {
   font-weight: 400;
-  -webkit-text-stroke: 0.3PX #1d2129;
-  text-stroke: 0.3PX #1d2129;
+  -webkit-text-stroke: 0.3PX currentColor;
+  text-stroke: 0.3PX currentColor;
 }
 .arco-action-sheet-sub-title {
   color:  #86909c ;

package/umd/action-sheet/style/index.less

@@ -11,7 +11,7 @@
 
     &-title {
         .use-var(font-size, action-sheet-title-font-size);
-        .text-medium-var(font-color);
+        .text-medium();
     }
 
     &-sub-title {

package/umd/dialog/style/css/index.css

@@ -126,8 +126,8 @@
 .arco-dialog-header.ios.android,
 .arco-dialog-header.ios.system-android {
   font-weight: 400;
-  -webkit-text-stroke: 0.3PX #1d2129;
-  text-stroke: 0.3PX #1d2129;
+  -webkit-text-stroke: 0.3PX currentColor;
+  text-stroke: 0.3PX currentColor;
 }
 .arco-dialog-header.ios.only-title {
   padding-bottom:  0.4rem ;

package/umd/dialog/style/index.less

@@ -105,7 +105,7 @@
             .use-var(padding-right, dialog-ios-horizontal-padding);
             .use-var(font-size, dialog-header-ios-font-size);
             .use-var(line-height, dialog-header-ios-line-height);
-            .text-medium-var(dialog-header-ios-color);
+            .text-medium();
 
             &.only-title {
                 .use-var(padding-bottom, dialog-ios-vertical-padding);

package/umd/image-picker/index.js

@@ -191,7 +191,6 @@
     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/umd/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/umd/image-preview/methods.js

@@ -1,16 +1,16 @@
 (function (global, factory) {
   if (typeof define === "function" && define.amd) {
-    define(["exports", "@babel/runtime/helpers/extends", "react", "react-dom", "@arco-design/mobile-utils"], factory);
+    define(["exports", "@babel/runtime/helpers/extends", "@arco-design/mobile-utils", "../_helpers/render"], factory);
   } else if (typeof exports !== "undefined") {
-    factory(exports, require("@babel/runtime/helpers/extends"), require("react"), require("react-dom"), require("@arco-design/mobile-utils"));
+    factory(exports, require("@babel/runtime/helpers/extends"), require("@arco-design/mobile-utils"), require("../_helpers/render"));
   } else {
     var mod = {
       exports: {}
     };
-    factory(mod.exports, global._extends, global.react, global.reactDom, global.mobileUtils);
+    factory(mod.exports, global._extends, global.mobileUtils, global.render);
     global.methods = mod.exports;
   }
-})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _extends2, _react, _reactDom, _mobileUtils) {
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _extends2, _mobileUtils, _render) {
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -18,8 +18,6 @@
   _exports.__esModule = true;
   _exports.open = open;
   _extends2 = _interopRequireDefault(_extends2);
-  _react = _interopRequireDefault(_react);
-  _reactDom = _interopRequireDefault(_reactDom);
 
   function open(Component) {
     return function (config) {
@@ -38,13 +36,8 @@
 
       var leaving = false;
 
-      function render(props) {
-        _reactDom.default.render( /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, props, {
-          getContainer: function getContainer() {
-            return div;
-          }
-        })), div);
-      }
+      var _ReactDOMRender = new _render.ReactDOMRender(Component, div),
+          render = _ReactDOMRender.render;
 
       function update(newConfig) {
         dynamicProps = (0, _extends2.default)({}, dynamicProps, newConfig || {});

package/umd/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/umd/masking/methods.js

@@ -1,16 +1,16 @@
 (function (global, factory) {
   if (typeof define === "function" && define.amd) {
-    define(["exports", "@babel/runtime/helpers/extends", "react", "react-dom", "@arco-design/mobile-utils"], factory);
+    define(["exports", "@babel/runtime/helpers/extends", "@arco-design/mobile-utils", "../_helpers/render"], factory);
   } else if (typeof exports !== "undefined") {
-    factory(exports, require("@babel/runtime/helpers/extends"), require("react"), require("react-dom"), require("@arco-design/mobile-utils"));
+    factory(exports, require("@babel/runtime/helpers/extends"), require("@arco-design/mobile-utils"), require("../_helpers/render"));
   } else {
     var mod = {
       exports: {}
     };
-    factory(mod.exports, global._extends, global.react, global.reactDom, global.mobileUtils);
+    factory(mod.exports, global._extends, global.mobileUtils, global.render);
     global.methods = mod.exports;
   }
-})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _extends2, _react, _reactDom, _mobileUtils) {
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _extends2, _mobileUtils, _render) {
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -19,8 +19,6 @@
   _exports.getOpenMethod = getOpenMethod;
   _exports.open = open;
   _extends2 = _interopRequireDefault(_extends2);
-  _react = _interopRequireDefault(_react);
-  _reactDom = _interopRequireDefault(_reactDom);
 
   function getOpenMethod(Component, containerId, normalize) {
     if (normalize === void 0) {
@@ -45,13 +43,8 @@
 
       var leaving = false;
 
-      function render(props) {
-        _reactDom.default.render( /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, props, {
-          getContainer: function getContainer() {
-            return div;
-          }
-        })), div);
-      }
+      var _ReactDOMRender = new _render.ReactDOMRender(Component, div),
+          render = _ReactDOMRender.render;
 
       function update(newConfig) {
         dynamicProps = (0, _extends2.default)({}, dynamicProps, normalize(newConfig));

package/umd/notify/methods.js

@@ -1,16 +1,16 @@
 (function (global, factory) {
   if (typeof define === "function" && define.amd) {
-    define(["exports", "@babel/runtime/helpers/extends", "@arco-design/mobile-utils", "react", "react-dom"], factory);
+    define(["exports", "@babel/runtime/helpers/extends", "@arco-design/mobile-utils", "../_helpers/render"], factory);
   } else if (typeof exports !== "undefined") {
-    factory(exports, require("@babel/runtime/helpers/extends"), require("@arco-design/mobile-utils"), require("react"), require("react-dom"));
+    factory(exports, require("@babel/runtime/helpers/extends"), require("@arco-design/mobile-utils"), require("../_helpers/render"));
   } else {
     var mod = {
       exports: {}
     };
-    factory(mod.exports, global._extends, global.mobileUtils, global.react, global.reactDom);
+    factory(mod.exports, global._extends, global.mobileUtils, global.render);
     global.methods = mod.exports;
   }
-})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _extends2, _mobileUtils, _react, _reactDom) {
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _extends2, _mobileUtils, _render) {
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -18,8 +18,6 @@
   _exports.__esModule = true;
   _exports.notify = notify;
   _extends2 = _interopRequireDefault(_extends2);
-  _react = _interopRequireDefault(_react);
-  _reactDom = _interopRequireDefault(_reactDom);
 
   function notify(Component, type) {
     return function (originConfig) {
@@ -41,17 +39,16 @@
         document.body.appendChild(div);
       }
 
-      function render(props) {
-        _reactDom.default.render( /*#__PURE__*/_react.default.createElement(Component, props), div);
-      }
+      var _ReactDOMRender = new _render.ReactDOMRender(Component, div),
+          render = _ReactDOMRender.render,
+          unmount = _ReactDOMRender.unmount;
 
       function destroy() {
         var onClose = config.onClose;
         onClose && onClose();
+        unmount();
 
-        var unmountResult = _reactDom.default.unmountComponentAtNode(div);
-
-        if (unmountResult && div.parentNode) {
+        if (div.parentNode) {
           div.parentNode.removeChild(div);
         }
       }

package/umd/popover/hooks/useEvent.js

@@ -56,6 +56,7 @@
       onVisibleChange(false);
       window.clearTimeout(closeTimer.current);
       closeTimer.current = 0;
+      mayRemoveEventListenerOnBody();
     };
 
     var throttleHandleVerticalScroll = (0, _react.useMemo)(function () {
@@ -75,7 +76,7 @@
       };
     }, [throttleHandleVerticalScroll, getVerticalScrollContainer, autoVerticalDirection, visibleRef]);
     var mayRemoveEventListenerOnBody = (0, _react.useCallback)(function () {
-      document.body.removeEventListener('click', handleClickBody);
+      document.body.removeEventListener('click', handleClickBody, true);
       document.body.removeEventListener('touchstart', handleTouchBody);
       var el = getVerticalScrollContainer();
 
@@ -90,7 +91,6 @@
       // 仅处理子元素和气泡元素外的点击事件
       // @en Only handle click events outside of children elements and bubble elements
       if (!(0, _mobileUtils.isContains)(wrapperRef.current, e.target) && !(0, _mobileUtils.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();
@@ -116,13 +116,13 @@
       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);
     };
 
@@ -165,7 +165,7 @@
         var el = getVerticalScrollContainer();
         el && el.addEventListener('scroll', handleScrollBody);
       } else if (clickOtherToClose) {
-        document.body.addEventListener('click', handleClickBody);
+        document.body.addEventListener('click', handleClickBody, true);
       }
     };
     /**

package/umd/pull-refresh/android-pull-refresh.js

@@ -37,6 +37,7 @@
         locale = _useContext$locale === void 0 ? _mobileUtils.defaultLocale : _useContext$locale;
 
     var className = props.className,
+        style = props.style,
         children = props.children,
         _props$loosingText = props.loosingText,
         loosingText = _props$loosingText === void 0 ? /*#__PURE__*/_react.default.createElement("div", {
@@ -273,6 +274,7 @@
       className: (0, _mobileUtils.cls)(prefixCls + "-pull-refresh all-border-box is-android", className, {
         'is-disabled': (disabled || !touching && useHideAsNestedScroll) && status !== _model.PullRefreshStatus.Loading
       }),
+      style: style,
       ref: domRef
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: (0, _mobileUtils.cls)(prefixCls + "-pull-refresh-place"),

package/umd/pull-refresh/ios-pull-refresh.js

@@ -35,6 +35,7 @@
 
     var animationRef = (0, _react.useRef)(0);
     var className = props.className,
+        style = props.style,
         children = props.children,
         _props$loadingText = props.loadingText,
         loadingText = _props$loadingText === void 0 ? /*#__PURE__*/_react.default.createElement("div", {
@@ -214,9 +215,9 @@
         'is-disabled': disabled || !touching && useHideAsNestedScroll
       }),
       ref: domRef,
-      style: contentHeight > 0 ? {
+      style: contentHeight > 0 ? (0, _extends2.default)({
         height: contentHeight
-      } : {}
+      }, style || {}) : style
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: (0, _mobileUtils.cls)(prefixCls + "-pull-refresh-content-wrapper")
     }, /*#__PURE__*/_react.default.createElement("div", {

package/umd/pull-refresh/model.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from 'react';
+import type { CSSProperties, ReactNode } from 'react';
 export interface PullRefreshRef {
     /**
      * 最外层元素 DOM
@@ -32,9 +32,13 @@ export interface PullRefreshBasicProps {
     /**
      * 样式类名
      * @en Custom classname
-     * @default ""
      */
     className?: string;
+    /**
+     * 自定义样式
+     * @en Custom style
+     */
+    style?: CSSProperties;
     /**
      * 是否禁用
      * @en Whether to be disabled

package/umd/steps/demo/style/css/mobile.css

@@ -30,7 +30,10 @@
 #demo-steps #demo-order-7 .process-title-color-with-config {
   color: #FFB400;
 }
-#demo-steps #demo-order-7 .finish-tail-color-with-config:after {
+#demo-steps #demo-order-7 .finish-tail-color-with-config::before,
+#demo-steps #demo-order-7 .finish-tail-color-with-config::after,
+#demo-steps #demo-order-7 .process-tail-color-with-config::before,
+#demo-steps #demo-order-7 .error-tail-color-with-config::before {
   background: #FFB400;
 }
 #demo-steps #demo-order-8 .demo-svg .arco-steps-item-custom-icon {
@@ -57,7 +60,10 @@
 #demo-steps #demo-order-8 .demo-svg .process-title-color-with-config {
   color: #165DFF;
 }
-#demo-steps #demo-order-8 .demo-svg .finish-tail-color-with-config:after {
+#demo-steps #demo-order-8 .demo-svg .finish-tail-color-with-config::before,
+#demo-steps #demo-order-8 .demo-svg .finish-tail-color-with-config::after,
+#demo-steps #demo-order-8 .demo-svg .process-tail-color-with-config::before,
+#demo-steps #demo-order-8 .demo-svg .error-tail-color-with-config::before {
   background: #165DFF;
 }
 #demo-steps #demo-order-8 .demo-svg .arco-steps-item-custom-icon {

package/umd/steps/index.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { StepsProps, StepsRef } from './type';
 export * from './type';
-export declare const StepsContext: React.Context<Pick<StepsProps, "direction" | "status" | "current" | "iconType"> & {
+export declare const StepsContext: React.Context<Pick<StepsProps, "direction" | "status" | "current" | "align" | "iconType"> & {
     index?: number | undefined;
     changeIndex: (newIndex: number) => void;
 }>;