antd-mobile 5.28.1 → 5.29.0

package/cjs/components/index-bar/index-bar.css

@@ -3,7 +3,7 @@
   overflow: hidden;
   height: 100%;
   position: relative;
-  background-color: var(--adm-color-white);
+  background-color: var(--adm-color-background);
   --sticky-offset-top: 0;
 }
 .adm-index-bar-body {
@@ -22,7 +22,7 @@
   padding: 0 12px;
   color: var(--adm-color-weak);
   font-size: var(--adm-font-size-main);
-  background-color: var(--adm-color-box);
+  background-color: var(--adm-color-fill-content);
 }
 .adm-index-bar-sidebar {
   position: absolute;
@@ -43,7 +43,7 @@
   right: 60px;
   width: 47px;
   height: 47px;
-  color: var(--adm-color-white);
+  color: var(--adm-color-text-light-solid);
   font-size: 25px;
   line-height: 47px;
   text-align: center;
@@ -70,7 +70,7 @@
   align-items: center;
 }
 .adm-index-bar-sidebar-item-active {
-  color: var(--adm-color-white);
+  color: var(--adm-color-text-light-solid);
   background-color: var(--adm-color-primary);
   border-radius: 50%;
 }

package/cjs/components/input/input.d.ts

@@ -26,7 +26,7 @@ export declare type InputRef = {
     blur: () => void;
     nativeElement: HTMLInputElement | null;
 };
-export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProps, "pattern" | "onClick" | "name" | "type" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "onKeyDown" | "onKeyUp" | "autoCapitalize" | "autoCorrect" | "inputMode" | "autoComplete" | "autoFocus" | "maxLength" | "minLength" | "step"> & {
+export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProps, "pattern" | "onClick" | "name" | "type" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "onKeyDown" | "onKeyUp" | "autoFocus" | "autoCapitalize" | "autoCorrect" | "inputMode" | "autoComplete" | "maxLength" | "minLength" | "step"> & {
     value?: string | undefined;
     defaultValue?: string | undefined;
     onChange?: ((val: string) => void) | undefined;

package/cjs/components/jumbo-tabs/jumbo-tabs.css

@@ -49,13 +49,13 @@
   border-radius: 10px;
   color: var(--adm-color-weak);
   font-size: var(--adm-font-size-main);
-  background-color: var(--adm-color-box);
+  background-color: var(--adm-color-fill-content);
 }
 .adm-jumbo-tabs-tab-active {
   color: var(--adm-color-primary);
 }
 .adm-jumbo-tabs-tab-active .adm-jumbo-tabs-tab-description {
-  color: var(--adm-color-white);
+  color: var(--adm-color-text-light-solid);
   background-color: var(--adm-color-primary);
 }
 .adm-jumbo-tabs-tab-disabled {

package/cjs/components/notice-bar/notice-bar.css

@@ -1,7 +1,7 @@
 .adm-notice-bar {
   --background-color: #ababab;
   --border-color: #999999;
-  --text-color: var(--adm-color-white);
+  --text-color: var(--adm-color-text-light-solid);
   --font-size: var(--adm-font-size-7);
   --icon-font-size: var(--adm-font-size-10);
   --height: 40px;

package/cjs/components/number-keyboard/number-keyboard.js

@@ -97,8 +97,9 @@ const NumberKeyboard = p => {
       className: (0, _classnames.default)(`${classPrefix}-header`, {
         [`${classPrefix}-header-with-title`]: !!title
       })
-    }, title && _react.default.createElement("div", {
-      className: `${classPrefix}-title`
+    }, 'title' && _react.default.createElement("div", {
+      className: `${classPrefix}-title`,
+      "aria-label": title
     }, title), showCloseButton && _react.default.createElement("span", {
       className: `${classPrefix}-header-close-button`,
       onClick: () => {
@@ -106,7 +107,8 @@ const NumberKeyboard = p => {
         (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
       },
       role: 'button',
-      title: 'CLOSE'
+      title: 'CLOSE',
+      tabIndex: -1
     }, _react.default.createElement(_antdMobileIcons.DownOutline, null)));
   };
   const renderKey = (key, index) => {
@@ -117,8 +119,9 @@ const NumberKeyboard = p => {
       [`${classPrefix}-key-mid`]: index === 9 && !!confirmText && keys.length < 12
     });
     const ariaProps = key ? {
-      role: 'button',
-      title: key
+      role: 'grid',
+      title: key,
+      tabIndex: -1
     } : undefined;
     return _react.default.createElement("div", Object.assign({
       key: key,
@@ -174,7 +177,8 @@ const NumberKeyboard = p => {
   }, _react.default.createElement(_antdMobileIcons.TextDeletionOutline, null)), _react.default.createElement("div", {
     className: `${classPrefix}-key ${classPrefix}-key-extra ${classPrefix}-key-ok`,
     onTouchEnd: e => onKeyPress(e, 'OK'),
-    role: 'button'
+    role: 'button',
+    "aria-label": confirmText
   }, confirmText))), props.safeArea && _react.default.createElement("div", {
     className: `${classPrefix}-footer`
   }, _react.default.createElement(_safeArea.default, {

package/cjs/components/popover/index.d.ts

@@ -18,7 +18,7 @@ declare const _default: import("react").ForwardRefExoticComponent<{
     content: import("react").ReactNode;
 } & {
     className?: string | undefined;
-    style?: (import("react").CSSProperties & Partial<Record<"--z-index", string>>) | undefined;
+    style?: (import("react").CSSProperties & Partial<Record<"--z-index" | "--arrow-size", string>>) | undefined;
     tabIndex?: number | undefined;
 } & import("react").AriaAttributes & import("react").RefAttributes<import("./popover").PopoverRef>> & {
     Menu: import("react").ForwardRefExoticComponent<Omit<import("./popover").PopoverProps, "content"> & {

package/cjs/components/popover/popover.css

@@ -3,7 +3,7 @@
   --background: #ffffff;
   --arrow-size: 8px;
   --content-padding: 8px 12px;
-  color: #333333;
+  color: var(--adm-color-text);
   position: absolute;
   top: 0;
   left: 0;
@@ -57,7 +57,7 @@
 .adm-popover-arrow-icon {
   display: block;
   height: var(--arrow-size);
-  width: 15px;
+  width: calc(var(--arrow-size) / 8 * 15);
   position: absolute;
   top: 50%;
   left: 50%;

package/cjs/components/popover/popover.d.ts

@@ -15,7 +15,7 @@ export declare type PopoverProps = {
     placement?: Placement | DeprecatedPlacement;
     stopPropagation?: PropagationEvent[];
     content: React.ReactNode;
-} & NativeProps<'--z-index'>;
+} & NativeProps<'--z-index' | '--arrow-size'>;
 export declare type PopoverRef = {
     show: () => void;
     hide: () => void;
@@ -35,6 +35,6 @@ export declare const Popover: React.ForwardRefExoticComponent<{
     content: React.ReactNode;
 } & {
     className?: string | undefined;
-    style?: (React.CSSProperties & Partial<Record<"--z-index", string>>) | undefined;
+    style?: (React.CSSProperties & Partial<Record<"--z-index" | "--arrow-size", string>>) | undefined;
     tabIndex?: number | undefined;
 } & React.AriaAttributes & React.RefAttributes<PopoverRef>>;

package/cjs/components/popover/popover.js

@@ -108,7 +108,7 @@ const Popover = (0, _react.forwardRef)((p, ref) => {
         top: arrowY != null ? `${arrowY}px` : '',
         right: '',
         bottom: '',
-        [arrowSide]: `-${(0, _convertPx.convertPx)(8)}px`
+        [arrowSide]: 'calc(var(--arrow-size) * -1)'
       });
       const arrowRotate = {
         top: '0deg',

package/cjs/components/popover/popover.patch.css

@@ -1,5 +1,6 @@
 .adm-popover {
   z-index: 1030;
+  color: #333333;
 }
 .adm-popover.adm-popover-dark {
   color: #ffffff;

package/cjs/components/pull-to-refresh/pull-to-refresh.js

@@ -59,6 +59,19 @@ const PullToRefresh = p => {
     var _a;
     (_a = elementRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener('touchmove', () => {});
   }, []);
+  const reset = () => {
+    return new Promise(resolve => {
+      api.start({
+        to: {
+          height: 0
+        },
+        onResolve() {
+          setStatus('pulling');
+          resolve();
+        }
+      });
+    });
+  };
   function doRefresh() {
     return (0, _tslib.__awaiter)(this, void 0, void 0, function* () {
       api.start({
@@ -69,27 +82,13 @@ const PullToRefresh = p => {
         yield props.onRefresh();
         setStatus('complete');
       } catch (e) {
-        api.start({
-          to: next => (0, _tslib.__awaiter)(this, void 0, void 0, function* () {
-            yield next({
-              height: 0
-            });
-            setStatus('pulling');
-          })
-        });
+        reset();
         throw e;
       }
       if (props.completeDelay > 0) {
         yield (0, _sleep.sleep)(props.completeDelay);
       }
-      api.start({
-        to: next => (0, _tslib.__awaiter)(this, void 0, void 0, function* () {
-          yield next({
-            height: 0
-          });
-          setStatus('pulling');
-        })
-      });
+      reset();
     });
   }
   (0, _react.useDrag)(state => {

package/cjs/components/radio/radio.css

@@ -18,7 +18,7 @@
   box-sizing: border-box;
   width: var(--icon-size);
   height: var(--icon-size);
-  color: var(--adm-color-white);
+  color: var(--adm-color-text-light-solid);
 }
 .adm-radio .adm-radio-icon > svg {
   display: block;
@@ -41,7 +41,7 @@
 .adm-radio.adm-radio-disabled .adm-radio-icon {
   color: #b7b7b7;
   border-color: var(--adm-color-light);
-  background-color: var(--adm-color-box);
+  background-color: var(--adm-color-fill-content);
 }
 .adm-radio .adm-radio-custom-icon {
   font-size: var(--icon-size);

package/cjs/components/search-bar/search-bar.css

@@ -1,7 +1,7 @@
 .adm-search-bar {
   --height: 32px;
   --padding-left: 8px;
-  --background: var(--adm-color-box);
+  --background: var(--adm-color-fill-content);
   --border-radius: 6px;
   --placeholder-color: var(--adm-color-weak);
   ---placeholder-color: var(--placeholder-color);

package/cjs/components/selector/selector.css

@@ -1,5 +1,5 @@
 .adm-selector {
-  --color: var(--adm-color-box);
+  --color: var(--adm-color-fill-content);
   --checked-color: #e7f1ff;
   --text-color: var(--adm-color-text);
   --checked-text-color: var(--adm-color-primary);

package/cjs/components/selector/selector.js

@@ -12,6 +12,7 @@ var _space = _interopRequireDefault(require("../space"));
 var _grid = _interopRequireDefault(require("../grid"));
 var _usePropsValue = require("../../utils/use-props-value");
 var _checkMark = require("./check-mark");
+var _configProvider = require("../config-provider");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const classPrefix = `adm-selector`;
 const defaultProps = {
@@ -34,6 +35,9 @@ const Selector = p => {
       (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, val, extend);
     }
   });
+  const {
+    locale
+  } = (0, _configProvider.useConfig)();
   const items = props.options.map(option => {
     const active = (value || []).includes(option.value);
     const disabled = option.disabled || props.disabled;
@@ -56,7 +60,9 @@ const Selector = p => {
           const val = active ? [] : [option.value];
           setValue(val);
         }
-      }
+      },
+      role: 'option',
+      "aria-selected": active && !props.multiple || active && props.multiple
     }, option.label, option.description && _react.default.createElement("div", {
       className: `${classPrefix}-item-description`
     }, option.description), active && props.showCheckMark && _react.default.createElement("div", {
@@ -64,7 +70,9 @@ const Selector = p => {
     }, _react.default.createElement(_checkMark.CheckMark, null)));
   });
   return (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {
-    className: classPrefix
+    className: classPrefix,
+    role: 'listbox',
+    "aria-label": locale.Selector.name
   }, !props.columns && _react.default.createElement(_space.default, {
     wrap: true
   }, items), props.columns && _react.default.createElement(_grid.default, {

package/cjs/components/side-bar/side-bar.css

@@ -2,7 +2,7 @@
   --height: 100%;
   --width: 105px;
   --item-border-radius: 8px;
-  --background-color: var(--adm-color-box);
+  --background-color: var(--adm-color-fill-content);
   width: var(--width);
   height: var(--height);
   box-sizing: border-box;

package/cjs/components/slider/slider.css

@@ -12,7 +12,7 @@
   position: relative;
   width: 100%;
   height: 3px;
-  background-color: var(--adm-color-box);
+  background-color: var(--adm-color-fill-content);
   border-radius: 3px;
 }
 .adm-slider-fill {
@@ -34,7 +34,7 @@
   width: 7px;
   height: 7px;
   margin-left: -3px;
-  background-color: var(--adm-color-box);
+  background-color: var(--adm-color-fill-content);
   border-radius: 50%;
 }
 .adm-slider-tick-active {
@@ -47,7 +47,7 @@
   border-radius: 50%;
   text-align: center;
   line-height: 28px;
-  background: var(--adm-color-white);
+  background: var(--adm-color-text-light-solid);
   box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.12);
   color: var(--fill-color);
 }

package/cjs/components/stepper/index.d.ts

@@ -1,4 +1,4 @@
 import './stepper.less';
 import { Stepper } from './stepper';
-export type { StepperProps } from './stepper';
+export type { StepperProps, StepperRef } from './stepper';
 export default Stepper;

package/cjs/components/stepper/stepper.css

@@ -3,14 +3,14 @@
   --input-width: 44px;
   --input-font-size: var(--adm-font-size-main);
   --input-font-color: var(--adm-color-text);
-  --input-background-color: var(--adm-color-box);
+  --input-background-color: var(--adm-color-fill-content);
   --border-radius: 2px;
   --border: none;
   --border-inner: solid 2px transparent;
   --active-border: var(--border);
   --button-font-size: var(--adm-font-size-7);
   --button-text-color: var(--adm-color-primary);
-  --button-background-color: var(--adm-color-box);
+  --button-background-color: var(--adm-color-fill-content);
   --button-width: var(--height);
   display: flex;
   align-items: center;

package/cjs/components/stepper/stepper.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { NativeProps } from '../../utils/native-props';
-import { InputProps } from '../input';
+import { InputProps, InputRef } from '../input';
 declare type ValueProps<ValueType> = {
     allowEmpty: true;
     value?: ValueType | null;
@@ -30,5 +30,7 @@ export declare type StringStepperProps = BaseStepperProps<string> & {
     stringMode: true;
 };
 export declare type StepperProps = NumberStepperProps | StringStepperProps;
-export declare function Stepper<ValueType extends number | string>(p: StepperProps): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+export declare type StepperRef = Pick<InputRef, 'blur' | 'focus' | 'nativeElement'>;
+export declare function InnerStepper<ValueType extends number | string>(p: StepperProps, ref: React.ForwardedRef<StepperRef>): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+export declare const Stepper: React.ForwardRefExoticComponent<StepperProps & React.RefAttributes<StepperRef>>;
 export {};

package/cjs/components/stepper/stepper.js

@@ -3,7 +3,8 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Stepper = Stepper;
+exports.InnerStepper = InnerStepper;
+exports.Stepper = void 0;
 var _classnames = _interopRequireDefault(require("classnames"));
 var _react = _interopRequireWildcard(require("react"));
 var _antdMobileIcons = require("antd-mobile-icons");
@@ -23,7 +24,7 @@ const defaultProps = {
   disabled: false,
   allowEmpty: false
 };
-function Stepper(p) {
+function InnerStepper(p, ref) {
   const props = (0, _withDefaultProps.mergeProps)(defaultProps, p);
   const {
     defaultValue = 0,
@@ -42,6 +43,21 @@ function Stepper(p) {
   const {
     locale
   } = (0, _configProvider.useConfig)();
+  // ========================== Ref ==========================
+  (0, _react.useImperativeHandle)(ref, () => ({
+    focus: () => {
+      var _a;
+      (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+    },
+    blur: () => {
+      var _a;
+      (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.blur();
+    },
+    get nativeElement() {
+      var _a, _b;
+      return (_b = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.nativeElement) !== null && _b !== void 0 ? _b : null;
+    }
+  }));
   // ========================== Parse / Format ==========================
   const fixedValue = value => {
     const fixedValue = digits !== undefined ? (0, _miniDecimal.toFixed)(value.toString(), '.', digits) : value;
@@ -209,4 +225,6 @@ function Stepper(p) {
     color: 'primary',
     "aria-label": locale.Stepper.increase
   }, _react.default.createElement(_antdMobileIcons.AddOutline, null))));
-}
+}
+const Stepper = (0, _react.forwardRef)(InnerStepper);
+exports.Stepper = Stepper;

package/cjs/components/swipe-action/swipe-action.css

@@ -31,7 +31,7 @@
 .adm-swipe-action-action-button.adm-button {
   --border-radius: 0;
   --border-width: 0;
-  --text-color: var(--adm-color-white);
+  --text-color: var(--adm-color-text-light-solid);
   padding-left: 20px;
   padding-right: 20px;
 }

package/cjs/components/switch/switch.css

@@ -52,7 +52,7 @@
   width: calc(var(--height) - 2 * var(--border-width));
   height: calc(var(--height) - 2 * var(--border-width));
   border-radius: calc(var(--height) - 2 * var(--border-width));
-  background: var(--adm-color-white);
+  background: var(--adm-color-text-light-solid);
   position: absolute;
   z-index: 2;
   top: var(--border-width);
@@ -83,7 +83,7 @@
 }
 .adm-switch.adm-switch-checked .adm-switch-inner {
   margin: 0 calc(var(--height) - var(--border-width) + 5px) 0 10px;
-  color: var(--adm-color-white);
+  color: var(--adm-color-text-light-solid);
 }
 .adm-switch.adm-switch-disabled {
   cursor: not-allowed;

package/cjs/components/tabs/tabs.js

@@ -192,7 +192,8 @@ const Tabs = p => {
     className: `${classPrefix}-tab-list`,
     ref: tabListContainerRef,
     scrollLeft: scrollLeft,
-    onScroll: updateMask
+    onScroll: updateMask,
+    role: 'tablist'
   }, _react.default.createElement(_web.animated.div, {
     ref: activeLineRef,
     className: `${classPrefix}-tab-line`,
@@ -219,7 +220,9 @@ const Tabs = p => {
     className: (0, _classnames.default)(`${classPrefix}-tab`, {
       [`${classPrefix}-tab-active`]: pane.key === activeKey,
       [`${classPrefix}-tab-disabled`]: pane.props.disabled
-    })
+    }),
+    role: 'tab',
+    "aria-selected": pane.key === activeKey
   }, pane.props.title)))))), panes.map(pane => {
     if (pane.props.children === undefined) {
       return null;

package/cjs/components/text-area/text-area.css

@@ -60,6 +60,13 @@
 .adm-text-area-element[readonly] {
   pointer-events: none;
 }
+.adm-text-area-element-hidden {
+  visibility: hidden;
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: -1000;
+}
 .adm-text-area-count {
   text-align: var(--count-text-align);
   color: var(--adm-color-weak);

package/cjs/components/text-area/text-area.d.ts

@@ -21,7 +21,7 @@ export declare type TextAreaRef = {
     blur: () => void;
     nativeElement: HTMLTextAreaElement | null;
 };
-export declare const TextArea: React.ForwardRefExoticComponent<Pick<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "onClick" | "disabled" | "name" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "autoComplete" | "autoFocus" | "readOnly"> & {
+export declare const TextArea: React.ForwardRefExoticComponent<Pick<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "onClick" | "disabled" | "name" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "autoFocus" | "autoComplete" | "readOnly"> & {
     onChange?: ((val: string) => void) | undefined;
     value?: string | undefined;
     defaultValue?: string | undefined;

package/cjs/components/text-area/text-area.js

@@ -35,6 +35,8 @@ const TextArea = (0, _react.forwardRef)((p, ref) => {
   const nativeTextAreaRef = (0, _react.useRef)(null);
   // https://github.com/ant-design/ant-design-mobile/issues/5961
   const heightRef = (0, _react.useRef)('auto');
+  // https://github.com/ant-design/ant-design-mobile/issues/6051
+  const hiddenTextAreaRef = (0, _react.useRef)(null);
   (0, _react.useImperativeHandle)(ref, () => ({
     clear: () => {
       setValue('');
@@ -54,9 +56,11 @@ const TextArea = (0, _react.forwardRef)((p, ref) => {
   (0, _ahooks.useIsomorphicLayoutEffect)(() => {
     if (!autoSize) return;
     const textArea = nativeTextAreaRef.current;
+    const hiddenTextArea = hiddenTextAreaRef.current;
     if (!textArea) return;
     textArea.style.height = heightRef.current;
-    let height = textArea.scrollHeight;
+    if (!hiddenTextArea) return;
+    let height = hiddenTextArea.scrollHeight;
     if (typeof autoSize === 'object') {
       const computedStyle = window.getComputedStyle(textArea);
       const lineHeight = parseFloat(computedStyle.lineHeight);
@@ -118,7 +122,13 @@ const TextArea = (0, _react.forwardRef)((p, ref) => {
     onFocus: props.onFocus,
     onBlur: props.onBlur,
     onClick: props.onClick
-  }), count));
+  }), count, autoSize && _react.default.createElement("textarea", {
+    ref: hiddenTextAreaRef,
+    className: `${classPrefix}-element ${classPrefix}-element-hidden`,
+    value: value,
+    "aria-hidden": true,
+    readOnly: true
+  })));
 });
 exports.TextArea = TextArea;
 TextArea.defaultProps = defaultProps;

package/cjs/components/virtual-input/virtual-input.js

@@ -11,6 +11,7 @@ var _usePropsValue = require("../../utils/use-props-value");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _antdMobileIcons = require("antd-mobile-icons");
 var _ahooks = require("ahooks");
+var _configProvider = require("../config-provider");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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; }
@@ -24,6 +25,9 @@ const VirtualInput = (0, _react.forwardRef)((p, ref) => {
   const rootRef = (0, _react.useRef)(null);
   const contentRef = (0, _react.useRef)(null);
   const [hasFocus, setHasFocus] = (0, _react.useState)(false);
+  const {
+    locale
+  } = (0, _configProvider.useConfig)();
   function scrollToEnd() {
     const root = rootRef.current;
     if (!root) return;
@@ -93,7 +97,11 @@ const VirtualInput = (0, _react.forwardRef)((p, ref) => {
     onClick: props.onClick
   }, _react.default.createElement("div", {
     className: `${classPrefix}-content`,
-    ref: contentRef
+    ref: contentRef,
+    role: 'option',
+    tabIndex: props.disabled ? undefined : 0,
+    "aria-disabled": props.disabled,
+    "aria-label": props.placeholder
   }, value, _react.default.createElement("div", {
     className: `${classPrefix}-caret-container`
   }, hasFocus && _react.default.createElement("div", {
@@ -105,7 +113,9 @@ const VirtualInput = (0, _react.forwardRef)((p, ref) => {
       e.stopPropagation();
       setValue('');
       (_a = props.onClear) === null || _a === void 0 ? void 0 : _a.call(props);
-    }
+    },
+    role: 'button',
+    "aria-label": locale.Input.clear
   }, _react.default.createElement(_antdMobileIcons.CloseCircleFill, null)), !value && _react.default.createElement("div", {
     className: `${classPrefix}-placeholder`
   }, props.placeholder), keyboardElement));

package/cjs/global/css-vars-patch.css

@@ -209,6 +209,7 @@
   }
   .adm-popover {
     z-index: 1030;
+    color: #333333;
   }
   .adm-popover.adm-popover-dark {
     color: #ffffff;

package/cjs/global/global.css

@@ -16,14 +16,17 @@
   --adm-color-success: #00b578;
   --adm-color-warning: #ff8f1f;
   --adm-color-danger: #ff3141;
-  --adm-color-white: #ffffff;
   --adm-color-text: #333333;
   --adm-color-text-secondary: #666666;
   --adm-color-weak: #999999;
   --adm-color-light: #cccccc;
   --adm-color-border: #eeeeee;
-  --adm-color-box: #f5f5f5;
   --adm-color-background: #ffffff;
+  --adm-color-white: #ffffff;
+  --adm-color-box: #f5f5f5;
+  --adm-color-text-light-solid: var(--adm-color-white);
+  --adm-color-text-dark-solid: #000000;
+  --adm-color-fill-content: var(--adm-color-box);
   --adm-font-size-main: var(--adm-font-size-5);
   --adm-font-family: -apple-system, blinkmacsystemfont, 'Helvetica Neue',
     helvetica, segoe ui, arial, roboto, 'PingFang SC', 'miui',

package/cjs/global/theme-default.css

@@ -16,14 +16,17 @@
   --adm-color-success: #00b578;
   --adm-color-warning: #ff8f1f;
   --adm-color-danger: #ff3141;
-  --adm-color-white: #ffffff;
   --adm-color-text: #333333;
   --adm-color-text-secondary: #666666;
   --adm-color-weak: #999999;
   --adm-color-light: #cccccc;
   --adm-color-border: #eeeeee;
-  --adm-color-box: #f5f5f5;
   --adm-color-background: #ffffff;
+  --adm-color-white: #ffffff;
+  --adm-color-box: #f5f5f5;
+  --adm-color-text-light-solid: var(--adm-color-white);
+  --adm-color-text-dark-solid: #000000;
+  --adm-color-fill-content: var(--adm-color-box);
   --adm-font-size-main: var(--adm-font-size-5);
   --adm-font-family: -apple-system, blinkmacsystemfont, 'Helvetica Neue',
     helvetica, segoe ui, arial, roboto, 'PingFang SC', 'miui',

package/cjs/index.d.ts

@@ -133,7 +133,7 @@ export type { SpaceProps } from './components/space';
 export { default as SpinLoading } from './components/spin-loading';
 export type { SpinLoadingProps } from './components/spin-loading';
 export { default as Stepper } from './components/stepper';
-export type { StepperProps } from './components/stepper';
+export type { StepperProps, StepperRef } from './components/stepper';
 export { default as Steps } from './components/steps';
 export type { StepsProps, StepProps } from './components/steps';
 export { default as SwipeAction } from './components/swipe-action';