@arco-design/mobile-react 2.22.3 → 2.24.0

package/esm/toast/index.d.ts

@@ -117,7 +117,7 @@ export declare function methodsGenerator<P extends ToastBaseProps>(Comp: React.F
      * @param {string | ToastProps} config Configuration
      * @returns {{ update: (config: ToastProps) => void; close: () => void }}
      */
-    toast: (originConfig: string | Pick<P, Exclude<keyof P, "visible" | "close">>) => {
+    toast: (originConfig: string | Pick<P, Exclude<keyof P, "visible" | "close">>, context?: import("../context-provider").GlobalContextParams | undefined) => {
         update: (newConfig: Pick<P, Exclude<keyof P, "visible" | "close">>) => void;
         close: () => void;
         hide: () => void;
@@ -128,7 +128,7 @@ export declare function methodsGenerator<P extends ToastBaseProps>(Comp: React.F
      * @param {string | ToastProps} config Configuration
      * @returns {{ update: (config: ToastProps) => void; close: () => void }}
      */
-    info: (originConfig: string | Pick<P, Exclude<keyof P, "visible" | "close">>) => {
+    info: (originConfig: string | Pick<P, Exclude<keyof P, "visible" | "close">>, context?: import("../context-provider").GlobalContextParams | undefined) => {
         update: (newConfig: Pick<P, Exclude<keyof P, "visible" | "close">>) => void;
         close: () => void;
         hide: () => void;
@@ -139,7 +139,7 @@ export declare function methodsGenerator<P extends ToastBaseProps>(Comp: React.F
      * @param {string | ToastProps} config Configuration
      * @returns {{ update: (config: ToastProps) => void; close: () => void }}
      */
-    success: (originConfig: string | Pick<P, Exclude<keyof P, "visible" | "close">>) => {
+    success: (originConfig: string | Pick<P, Exclude<keyof P, "visible" | "close">>, context?: import("../context-provider").GlobalContextParams | undefined) => {
         update: (newConfig: Pick<P, Exclude<keyof P, "visible" | "close">>) => void;
         close: () => void;
         hide: () => void;
@@ -150,7 +150,7 @@ export declare function methodsGenerator<P extends ToastBaseProps>(Comp: React.F
      * @param {string | ToastProps} config Configuration
      * @returns {{ update: (config: ToastProps) => void; close: () => void }}
      */
-    error: (originConfig: string | Pick<P, Exclude<keyof P, "visible" | "close">>) => {
+    error: (originConfig: string | Pick<P, Exclude<keyof P, "visible" | "close">>, context?: import("../context-provider").GlobalContextParams | undefined) => {
         update: (newConfig: Pick<P, Exclude<keyof P, "visible" | "close">>) => void;
         close: () => void;
         hide: () => void;
@@ -161,7 +161,7 @@ export declare function methodsGenerator<P extends ToastBaseProps>(Comp: React.F
      * @param {string | ToastProps} config Configuration
      * @returns {{ update: (config: ToastProps) => void; close: () => void }}
      */
-    loading: (originConfig: string | Pick<P, Exclude<keyof P, "visible" | "close">>) => {
+    loading: (originConfig: string | Pick<P, Exclude<keyof P, "visible" | "close">>, context?: import("../context-provider").GlobalContextParams | undefined) => {
         update: (newConfig: Pick<P, Exclude<keyof P, "visible" | "close">>) => void;
         close: () => void;
         hide: () => void;
@@ -172,7 +172,7 @@ export declare function methodsGenerator<P extends ToastBaseProps>(Comp: React.F
      * @param {string | ToastProps} config Configuration
      * @returns {{ update: (config: ToastProps) => void; close: () => void }}
      */
-    warn: (originConfig: string | Pick<P, Exclude<keyof P, "visible" | "close">>) => {
+    warn: (originConfig: string | Pick<P, Exclude<keyof P, "visible" | "close">>, context?: import("../context-provider").GlobalContextParams | undefined) => {
         update: (newConfig: Pick<P, Exclude<keyof P, "visible" | "close">>) => void;
         close: () => void;
         hide: () => void;
@@ -185,8 +185,8 @@ declare const _default: React.ForwardRefExoticComponent<ToastProps & React.RefAt
      * @param {string | ToastProps} config Configuration
      * @returns {{ update: (config: ToastProps) => void; close: () => void }}
      */
-    toast: (originConfig: string | Pick<ToastProps & React.RefAttributes<ToastRef>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => {
-        update: (newConfig: Pick<ToastProps & React.RefAttributes<ToastRef>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => void;
+    toast: (originConfig: string | Pick<import("../context-provider").WithGlobalContext<ToastProps & React.RefAttributes<ToastRef>>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "context" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">, context?: import("../context-provider").GlobalContextParams | undefined) => {
+        update: (newConfig: Pick<import("../context-provider").WithGlobalContext<ToastProps & React.RefAttributes<ToastRef>>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "context" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => void;
         close: () => void;
         hide: () => void;
     };
@@ -196,8 +196,8 @@ declare const _default: React.ForwardRefExoticComponent<ToastProps & React.RefAt
      * @param {string | ToastProps} config Configuration
      * @returns {{ update: (config: ToastProps) => void; close: () => void }}
      */
-    info: (originConfig: string | Pick<ToastProps & React.RefAttributes<ToastRef>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => {
-        update: (newConfig: Pick<ToastProps & React.RefAttributes<ToastRef>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => void;
+    info: (originConfig: string | Pick<import("../context-provider").WithGlobalContext<ToastProps & React.RefAttributes<ToastRef>>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "context" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">, context?: import("../context-provider").GlobalContextParams | undefined) => {
+        update: (newConfig: Pick<import("../context-provider").WithGlobalContext<ToastProps & React.RefAttributes<ToastRef>>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "context" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => void;
         close: () => void;
         hide: () => void;
     };
@@ -207,8 +207,8 @@ declare const _default: React.ForwardRefExoticComponent<ToastProps & React.RefAt
      * @param {string | ToastProps} config Configuration
      * @returns {{ update: (config: ToastProps) => void; close: () => void }}
      */
-    success: (originConfig: string | Pick<ToastProps & React.RefAttributes<ToastRef>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => {
-        update: (newConfig: Pick<ToastProps & React.RefAttributes<ToastRef>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => void;
+    success: (originConfig: string | Pick<import("../context-provider").WithGlobalContext<ToastProps & React.RefAttributes<ToastRef>>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "context" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">, context?: import("../context-provider").GlobalContextParams | undefined) => {
+        update: (newConfig: Pick<import("../context-provider").WithGlobalContext<ToastProps & React.RefAttributes<ToastRef>>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "context" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => void;
         close: () => void;
         hide: () => void;
     };
@@ -218,8 +218,8 @@ declare const _default: React.ForwardRefExoticComponent<ToastProps & React.RefAt
      * @param {string | ToastProps} config Configuration
      * @returns {{ update: (config: ToastProps) => void; close: () => void }}
      */
-    error: (originConfig: string | Pick<ToastProps & React.RefAttributes<ToastRef>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => {
-        update: (newConfig: Pick<ToastProps & React.RefAttributes<ToastRef>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => void;
+    error: (originConfig: string | Pick<import("../context-provider").WithGlobalContext<ToastProps & React.RefAttributes<ToastRef>>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "context" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">, context?: import("../context-provider").GlobalContextParams | undefined) => {
+        update: (newConfig: Pick<import("../context-provider").WithGlobalContext<ToastProps & React.RefAttributes<ToastRef>>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "context" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => void;
         close: () => void;
         hide: () => void;
     };
@@ -229,8 +229,8 @@ declare const _default: React.ForwardRefExoticComponent<ToastProps & React.RefAt
      * @param {string | ToastProps} config Configuration
      * @returns {{ update: (config: ToastProps) => void; close: () => void }}
      */
-    loading: (originConfig: string | Pick<ToastProps & React.RefAttributes<ToastRef>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => {
-        update: (newConfig: Pick<ToastProps & React.RefAttributes<ToastRef>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => void;
+    loading: (originConfig: string | Pick<import("../context-provider").WithGlobalContext<ToastProps & React.RefAttributes<ToastRef>>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "context" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">, context?: import("../context-provider").GlobalContextParams | undefined) => {
+        update: (newConfig: Pick<import("../context-provider").WithGlobalContext<ToastProps & React.RefAttributes<ToastRef>>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "context" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => void;
         close: () => void;
         hide: () => void;
     };
@@ -240,8 +240,8 @@ declare const _default: React.ForwardRefExoticComponent<ToastProps & React.RefAt
      * @param {string | ToastProps} config Configuration
      * @returns {{ update: (config: ToastProps) => void; close: () => void }}
      */
-    warn: (originConfig: string | Pick<ToastProps & React.RefAttributes<ToastRef>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => {
-        update: (newConfig: Pick<ToastProps & React.RefAttributes<ToastRef>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => void;
+    warn: (originConfig: string | Pick<import("../context-provider").WithGlobalContext<ToastProps & React.RefAttributes<ToastRef>>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "context" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">, context?: import("../context-provider").GlobalContextParams | undefined) => {
+        update: (newConfig: Pick<import("../context-provider").WithGlobalContext<ToastProps & React.RefAttributes<ToastRef>>, "loading" | "content" | "layout" | "icon" | "direction" | "transitionDuration" | "ref" | "key" | "context" | "getContainer" | "type" | "className" | "duration" | "onClose" | "initialBodyOverflow" | "loadingIcon" | "loadingInner" | "disableBodyTouch" | "typeIconMap">) => void;
         close: () => void;
         hide: () => void;
     };

package/esm/toast/index.js

@@ -1,6 +1,6 @@
 import React, { useEffect, forwardRef, useRef, useImperativeHandle } from 'react';
 import { cls, componentWrapper } from '@arco-design/mobile-utils';
-import { ContextLayout } from '../context-provider';
+import { ContextLayout, CompWithGlobalContext } from '../context-provider';
 import Transition from '../transition';
 import IconErrorCircle from '../icon/IconErrorCircle';
 import IconWarnCircle from '../icon/IconWarnCircle';
@@ -189,6 +189,7 @@ export function methodsGenerator(Comp) {
     warn: toast(Comp, 'warn')
   };
 }
+var ToastWithGlobalContext = CompWithGlobalContext(Toast);
 /**
  * 轻提示组件，支持各个场景下调用方法。
  * @en The toast component, supports calling methods in various scenarios.
@@ -198,4 +199,4 @@ export function methodsGenerator(Comp) {
  * @name_en Toast
  */
 
-export default componentWrapper(Toast, methodsGenerator(Toast));
+export default componentWrapper(Toast, methodsGenerator(ToastWithGlobalContext));

package/esm/toast/methods.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { GlobalContextParams } from '../context-provider';
 export interface ToastBaseProps {
     getContainer?: () => HTMLElement;
     onClose?: (scene?: string) => void;
@@ -8,7 +9,7 @@ export interface ToastBaseProps {
     type?: string;
     loading?: boolean;
 }
-export declare function toast<P extends ToastBaseProps>(Component: React.FunctionComponent<P>, type?: string): (originConfig: string | Pick<P, Exclude<keyof P, "visible" | "close">>) => {
+export declare function toast<P extends ToastBaseProps>(Component: React.FunctionComponent<P>, type?: string): (originConfig: string | Pick<P, Exclude<keyof P, "visible" | "close">>, context?: GlobalContextParams | undefined) => {
     update: (newConfig: Pick<P, Exclude<keyof P, "visible" | "close">>) => void;
     close: () => void;
     hide: () => void;

package/esm/toast/methods.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import { nextTick } from '@arco-design/mobile-utils';
 import { ReactDOMRender } from '../_helpers/render';
 export function toast(Component, type) {
-  return function (originConfig) {
+  return function (originConfig, context) {
     var config = typeof originConfig === 'string' ? {
       content: originConfig,
       type: 'info'
@@ -16,7 +16,7 @@ export function toast(Component, type) {
     var div = document.createElement('div');
     document.body.appendChild(div);
 
-    var _ReactDOMRender = new ReactDOMRender(Component, div),
+    var _ReactDOMRender = new ReactDOMRender(Component, div, context),
         render = _ReactDOMRender.render,
         unmount = _ReactDOMRender.unmount;
 

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@arco-design/mobile-react",
-    "version": "2.22.3",
+    "version": "2.24.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.7",
+        "@arco-design/mobile-utils": "^2.12.9",
         "@arco-design/transformable": "^1.0.0",
         "es6-promise": "^4.2.8",
         "lodash.throttle": "^4.1.1",
@@ -36,5 +36,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "2d9f52e4a749a50a0b6248b14ab8f8d02f2f0e1e"
+    "gitHead": "bff7e1c275188fab8d98166eba999d7aebdc5672"
 }

package/style/css/public.css

@@ -1,12 +1,12 @@
 * {
-  margin: 0;
-  padding: 0;
-  border: 0;
-  -webkit-font-smoothing: antialiased;
   -webkit-tap-highlight-color: transparent;
 }
 body {
+  margin: 0;
+  padding: 0;
+  border: 0;
   touch-action: manipulation;
+  -webkit-font-smoothing: antialiased;
   -webkit-text-size-adjust: none;
 }
 button,

package/tokens/app/arcodesign/default/css-variables.less

@@ -84,6 +84,7 @@
     --input-disabled-color: var(--disabled-color);
     --input-placeholder-color: var(--disabled-color);
     --input-clear-icon-color: var(--disabled-color);
+    --input-clear-icon-font-size: 16PX;
     --input-label-gutter: ~`pxtorem(24)`;
     --input-horizontal-padding: ~`pxtorem(16)`;
     --input-vertical-padding: ~`pxtorem(12)`;
@@ -701,4 +702,18 @@
     --image-picker-close-height: ~`pxtorem(18)`;
     --image-picker-close-background: rgba(0, 0, 0, 0.3);
     --image-picker-close-border-radius: 0 ~`pxtorem(2)`;
+    --stepper-font-size: ~`pxtorem(14)`;
+    --stepper-square-border: 1PX solid #f2f3f5;
+    --stepper-square-border-radius: ~`pxtorem(2)`;
+    --stepper-square-background-color: #ffffff;
+    --stepper-round-button-border-radius: 50%;
+    --stepper-round-input-background-color: transparent;
+    --stepper-button-size: ~`pxtorem(28)`;
+    --stepper-button-icon-size: ~`pxtorem(10)`;
+    --stepper-default-background-color: #f7f8fa;
+    --stepper-content-color: #1d2129;
+    --stepper-disable-color: #c9cdd4;
+    --stepper-input-width: ~`pxtorem(40)`;
+    --stepper-input-height: ~`pxtorem(28)`;
+    --stepper-input-margin: 0 1PX;
 }

package/tokens/app/arcodesign/default/index.d.ts

@@ -83,6 +83,7 @@ export interface ArcodesignToken extends Record<string, string> {
     'input-disabled-color': string;
     'input-placeholder-color': string;
     'input-clear-icon-color': string;
+    'input-clear-icon-font-size': string;
     'input-label-gutter': string;
     'input-horizontal-padding': string;
     'input-vertical-padding': string;
@@ -700,6 +701,20 @@ export interface ArcodesignToken extends Record<string, string> {
     'image-picker-close-height': string;
     'image-picker-close-background': string;
     'image-picker-close-border-radius': string;
+    'stepper-font-size': string;
+    'stepper-square-border': string;
+    'stepper-square-border-radius': string;
+    'stepper-square-background-color': string;
+    'stepper-round-button-border-radius': string;
+    'stepper-round-input-background-color': string;
+    'stepper-button-size': string;
+    'stepper-button-icon-size': string;
+    'stepper-default-background-color': string;
+    'stepper-content-color': string;
+    'stepper-disable-color': string;
+    'stepper-input-width': string;
+    'stepper-input-height': string;
+    'stepper-input-margin': string;
 }
 declare const tokens: ArcodesignToken;
 export default tokens;

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

@@ -95,6 +95,7 @@ var tokens = {
   "input-disabled-color": "#c9cdd4",
   "input-placeholder-color": "#c9cdd4",
   "input-clear-icon-color": "#c9cdd4",
+  "input-clear-icon-font-size": "16PX",
   "input-label-gutter": "0.48rem",
   "input-horizontal-padding": "0.32rem",
   "input-vertical-padding": "0.24rem",
@@ -711,7 +712,21 @@ var tokens = {
   "image-picker-close-width": "0.36rem",
   "image-picker-close-height": "0.36rem",
   "image-picker-close-background": "rgba(0, 0, 0, 0.3)",
-  "image-picker-close-border-radius": "0 0.04rem"
+  "image-picker-close-border-radius": "0 0.04rem",
+  "stepper-font-size": "0.28rem",
+  "stepper-square-border": "1PX solid #f2f3f5",
+  "stepper-square-border-radius": "0.04rem",
+  "stepper-square-background-color": "#ffffff",
+  "stepper-round-button-border-radius": "50%",
+  "stepper-round-input-background-color": "transparent",
+  "stepper-button-size": "0.56rem",
+  "stepper-button-icon-size": "0.2rem",
+  "stepper-default-background-color": "#f7f8fa",
+  "stepper-content-color": "#1d2129",
+  "stepper-disable-color": "#c9cdd4",
+  "stepper-input-width": "0.8rem",
+  "stepper-input-height": "0.56rem",
+  "stepper-input-margin": "0 1PX"
 };
 var _default = tokens;
 exports["default"] = _default;

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

@@ -3695,6 +3695,18 @@
             "en": "Input clear icon color"
         }
     },
+    "inputClearIconFontSize": {
+        "cssKey": "input-clear-icon-font-size",
+        "desc": "输入框 清除图标大小",
+        "override": "",
+        "value": "16PX",
+        "jsValue": "16PX",
+        "staticValue": "16PX",
+        "localeDesc": {
+            "ch": "输入框 清除图标大小",
+            "en": "Input clear icon font size"
+        }
+    },
     "inputDisabledBackground": {
         "cssKey": "input-disabled-background",
         "desc": "输入框 禁用状态输入框背景色",
@@ -6191,6 +6203,174 @@
             "en": "Label distance  of horizoverticalntal slider from the right of the mark"
         }
     },
+    "stepperButtonIconSize": {
+        "cssKey": "stepper-button-icon-size",
+        "desc": "步进器按钮图标尺寸",
+        "override": "",
+        "value": "~`pxtorem(10)`",
+        "jsValue": "@getRem@10",
+        "staticValue": "0.2rem",
+        "localeDesc": {
+            "ch": "步进器按钮图标尺寸",
+            "en": "Button icon size of Stepper"
+        }
+    },
+    "stepperButtonSize": {
+        "cssKey": "stepper-button-size",
+        "desc": "步进器按钮尺寸",
+        "override": "",
+        "value": "~`pxtorem(28)`",
+        "jsValue": "@getRem@28",
+        "staticValue": "0.56rem",
+        "localeDesc": {
+            "ch": "步进器按钮尺寸",
+            "en": "Button size of Stepper"
+        }
+    },
+    "stepperContentColor": {
+        "cssKey": "stepper-content-color",
+        "desc": "步进器内容字体颜色",
+        "override": "",
+        "value": "#1d2129",
+        "jsValue": "#1d2129",
+        "staticValue": "#1d2129",
+        "localeDesc": {
+            "ch": "步进器内容字体颜色",
+            "en": "Content text color of Stepper"
+        }
+    },
+    "stepperDefaultBackgroundColor": {
+        "cssKey": "stepper-default-background-color",
+        "desc": "步进器默认背景颜色",
+        "override": "",
+        "value": "#f7f8fa",
+        "jsValue": "#f7f8fa",
+        "staticValue": "#f7f8fa",
+        "localeDesc": {
+            "ch": "步进器默认背景颜色",
+            "en": "Background default colr of Stepper"
+        }
+    },
+    "stepperDisableColor": {
+        "cssKey": "stepper-disable-color",
+        "desc": "步进器禁用状态字体颜色",
+        "override": "",
+        "value": "#c9cdd4",
+        "jsValue": "#c9cdd4",
+        "staticValue": "#c9cdd4",
+        "localeDesc": {
+            "ch": "步进器禁用状态字体颜色",
+            "en": "Text color of Stepper in disable status"
+        }
+    },
+    "stepperFontSize": {
+        "cssKey": "stepper-font-size",
+        "desc": "步进器字体大小",
+        "override": "",
+        "value": "~`pxtorem(14)`",
+        "jsValue": "@getRem@14",
+        "staticValue": "0.28rem",
+        "localeDesc": {
+            "ch": "步进器字体大小",
+            "en": "Font size of Stepper"
+        }
+    },
+    "stepperInputHeight": {
+        "cssKey": "stepper-input-height",
+        "desc": "步进器输入框长度",
+        "override": "",
+        "value": "~`pxtorem(28)`",
+        "jsValue": "@getRem@28",
+        "staticValue": "0.56rem",
+        "localeDesc": {
+            "ch": "步进器输入框长度",
+            "en": "Input height of Stepper"
+        }
+    },
+    "stepperInputMargin": {
+        "cssKey": "stepper-input-margin",
+        "desc": "步进器输入框外边距",
+        "override": "",
+        "value": "0 1PX",
+        "jsValue": "0 1PX",
+        "staticValue": "0 1PX",
+        "localeDesc": {
+            "ch": "步进器输入框外边距",
+            "en": "Input margin of Stepper"
+        }
+    },
+    "stepperInputWidth": {
+        "cssKey": "stepper-input-width",
+        "desc": "步进器输入框宽度",
+        "override": "",
+        "value": "~`pxtorem(40)`",
+        "jsValue": "@getRem@40",
+        "staticValue": "0.8rem",
+        "localeDesc": {
+            "ch": "步进器输入框宽度",
+            "en": "Input width of Stepper"
+        }
+    },
+    "stepperRoundButtonBorderRadius": {
+        "cssKey": "stepper-round-button-border-radius",
+        "desc": "步进器圆角按钮边框半径",
+        "override": "",
+        "value": "50%",
+        "jsValue": "50%",
+        "staticValue": "50%",
+        "localeDesc": {
+            "ch": "步进器圆角按钮边框半径",
+            "en": "Round button border radius of Stepper"
+        }
+    },
+    "stepperRoundInputBackgroundColor": {
+        "cssKey": "stepper-round-input-background-color",
+        "desc": "步进器圆角输入框背景颜色",
+        "override": "",
+        "value": "transparent",
+        "jsValue": "transparent",
+        "staticValue": "transparent",
+        "localeDesc": {
+            "ch": "步进器圆角输入框背景颜色",
+            "en": "Rount input background color of Stepper"
+        }
+    },
+    "stepperSquareBackgroundColor": {
+        "cssKey": "stepper-square-background-color",
+        "desc": "步进器方角样式背景颜色",
+        "override": "",
+        "value": "#ffffff",
+        "jsValue": "#ffffff",
+        "staticValue": "#ffffff",
+        "localeDesc": {
+            "ch": "步进器方角样式背景颜色",
+            "en": "Background color of Stepper square style"
+        }
+    },
+    "stepperSquareBorder": {
+        "cssKey": "stepper-square-border",
+        "desc": "步进器方角边框样式",
+        "override": "",
+        "value": "1PX solid #f2f3f5",
+        "jsValue": "1PX solid #f2f3f5",
+        "staticValue": "1PX solid #f2f3f5",
+        "localeDesc": {
+            "ch": "步进器方角边框样式",
+            "en": "Square border style of Stepper"
+        }
+    },
+    "stepperSquareBorderRadius": {
+        "cssKey": "stepper-square-border-radius",
+        "desc": "步进器方角边框半径",
+        "override": "",
+        "value": "~`pxtorem(2)`",
+        "jsValue": "@getRem@2",
+        "staticValue": "0.04rem",
+        "localeDesc": {
+            "ch": "步进器方角边框半径",
+            "en": "Square border radius of Stepper"
+        }
+    },
     "stepsDescriptionColor": {
         "cssKey": "steps-description-color",
         "desc": "steps 步骤默认描述文字颜色",

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

@@ -83,6 +83,7 @@
 @input-disabled-color: @disabled-color;
 @input-placeholder-color: @disabled-color;
 @input-clear-icon-color: @disabled-color;
+@input-clear-icon-font-size: 16PX;
 @input-label-gutter: ~`pxtorem(24)`;
 @input-horizontal-padding: ~`pxtorem(16)`;
 @input-vertical-padding: ~`pxtorem(12)`;
@@ -700,4 +701,18 @@
 @image-picker-close-height: ~`pxtorem(18)`;
 @image-picker-close-background: rgba(0, 0, 0, 0.3);
 @image-picker-close-border-radius: 0 ~`pxtorem(2)`;
+@stepper-font-size: ~`pxtorem(14)`;
+@stepper-square-border: 1PX solid #f2f3f5;
+@stepper-square-border-radius: ~`pxtorem(2)`;
+@stepper-square-background-color: #ffffff;
+@stepper-round-button-border-radius: 50%;
+@stepper-round-input-background-color: transparent;
+@stepper-button-size: ~`pxtorem(28)`;
+@stepper-button-icon-size: ~`pxtorem(10)`;
+@stepper-default-background-color: #f7f8fa;
+@stepper-content-color: #1d2129;
+@stepper-disable-color: #c9cdd4;
+@stepper-input-width: ~`pxtorem(40)`;
+@stepper-input-height: ~`pxtorem(28)`;
+@stepper-input-margin: 0 1PX;
 

package/umd/_helpers/render.d.ts

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

package/umd/_helpers/render.js

@@ -1,38 +1,43 @@
 (function (global, factory) {
   if (typeof define === "function" && define.amd) {
-    define(["exports", "react", "./react-dom"], factory);
+    define(["exports", "@babel/runtime/helpers/extends", "react", "./react-dom"], factory);
   } else if (typeof exports !== "undefined") {
-    factory(exports, require("react"), require("./react-dom"));
+    factory(exports, require("@babel/runtime/helpers/extends"), require("react"), require("./react-dom"));
   } else {
     var mod = {
       exports: {}
     };
-    factory(mod.exports, global.react, global.reactDom);
+    factory(mod.exports, global._extends, global.react, global.reactDom);
     global.render = mod.exports;
   }
-})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _react, _reactDom) {
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _extends2, _react, _reactDom) {
   "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) {
+  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, props));
+        _this.root.render( /*#__PURE__*/_react.default.createElement(CustomApp, propsWithContext));
       } else {
-        _this.root = (0, _reactDom.render)( /*#__PURE__*/_react.default.createElement(CustomApp, props), _this.container);
+        _this.root = (0, _reactDom.render)( /*#__PURE__*/_react.default.createElement(CustomApp, propsWithContext), _this.container);
       }
     };
 
@@ -45,6 +50,7 @@
 
     this.app = app;
     this.container = container;
+    this.context = context;
   };
 
   _exports.ReactDOMRender = ReactDOMRender;