antd-mobile 5.29.1 → 5.31.0

package/2x/bundle/style.css

@@ -3182,7 +3182,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled):after {
 
 .adm-page-indicator-color-white {
   --dot-color: rgba(255, 255, 255, .5);
-  --active-dot-color: var(--adm-color-white);
+  --active-dot-color: var(--adm-color-text-light-solid);
 }
 
 .adm-page-indicator-horizontal {
@@ -4200,6 +4200,8 @@ a.adm-list-item:active:not(.adm-list-item-disabled):after {
 .adm-step {
   --line-to-next-color: #e5e5e5;
   --icon-color: #e5e5e5;
+  position: relative;
+  z-index: 0;
 }
 
 .adm-step .adm-step-indicator {
@@ -5055,7 +5057,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled):after {
   white-space: nowrap;
   margin-right: 40px;
   font-size: 24px;
-  background-color: var(--adm-color-box);
+  background-color: var(--adm-color-fill-content);
   color: var(--adm-color-weak);
   padding: 8px 24px;
   border-radius: 200px;

package/2x/cjs/components/avatar/avatar.js

@@ -6,9 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.Avatar = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _nativeProps = require("../../utils/native-props");
-var _image = _interopRequireDefault(require("../image"));
 var _withDefaultProps = require("../../utils/with-default-props");
 var _fallback = require("./fallback");
+var _image = _interopRequireDefault(require("../image"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const classPrefix = 'adm-avatar';
 const defaultProps = {

package/2x/cjs/components/button/button.d.ts

@@ -14,7 +14,7 @@ export declare type ButtonProps = {
     type?: 'submit' | 'reset' | 'button';
     shape?: 'default' | 'rounded' | 'rectangular';
     children?: React.ReactNode;
-} & Pick<NativeButtonProps, 'onMouseDown' | 'onMouseUp' | 'onTouchStart' | 'onTouchEnd'> & NativeProps<'--text-color' | '--background-color' | '--border-radius' | '--border-width' | '--border-style' | '--border-color'>;
+} & Pick<NativeButtonProps, 'onMouseDown' | 'onMouseUp' | 'onTouchStart' | 'onTouchEnd' | 'id'> & NativeProps<'--text-color' | '--background-color' | '--border-radius' | '--border-width' | '--border-style' | '--border-color'>;
 export declare type ButtonRef = {
     nativeElement: HTMLButtonElement | null;
 };
@@ -31,7 +31,7 @@ export declare const Button: React.ForwardRefExoticComponent<{
     type?: "reset" | "submit" | "button" | undefined;
     shape?: "default" | "rounded" | "rectangular" | undefined;
     children?: React.ReactNode;
-} & Pick<NativeButtonProps, "onMouseDown" | "onMouseUp" | "onTouchEnd" | "onTouchStart"> & {
+} & Pick<NativeButtonProps, "id" | "onMouseDown" | "onMouseUp" | "onTouchEnd" | "onTouchStart"> & {
     className?: string | undefined;
     style?: (React.CSSProperties & Partial<Record<"--border-radius" | "--text-color" | "--background-color" | "--border-width" | "--border-style" | "--border-color", string>>) | undefined;
     tabIndex?: number | undefined;

package/2x/cjs/components/cascader/cascader.js

@@ -65,12 +65,7 @@ const Cascader = (0, _react.forwardRef)((p, ref) => {
     if (!visible) {
       setInnerValue(value);
     }
-  }, [visible]);
-  (0, _react.useEffect)(() => {
-    if (!visible) {
-      setInnerValue(value);
-    }
-  }, [value]);
+  }, [visible, value]);
   const cascaderElement = (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {
     className: classPrefix
   }, _react.default.createElement("div", {

package/2x/cjs/components/cascader-view/cascader-view.d.ts

@@ -19,5 +19,6 @@ export declare type CascaderViewProps = {
     placeholder?: string | ((index: number) => string);
     onTabsChange?: (index: number) => void;
     activeIcon?: ReactNode;
+    loading?: boolean;
 } & NativeProps<'--height'>;
 export declare const CascaderView: FC<CascaderViewProps>;

package/2x/cjs/components/cascader-view/cascader-view.js

@@ -81,6 +81,7 @@ const CascaderView = p => {
     }
     setValue(next);
   };
+  const whetherLoading = options => props.loading || options === _optionSkeleton.optionSkeleton;
   return (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {
     className: classPrefix
   }, _react.default.createElement(_tabs.default, {
@@ -101,7 +102,7 @@ const CascaderView = p => {
       forceRender: true
     }, _react.default.createElement("div", {
       className: `${classPrefix}-content`
-    }, level.options === _optionSkeleton.optionSkeleton ? _react.default.createElement("div", {
+    }, whetherLoading(level.options) ? _react.default.createElement("div", {
       className: `${classPrefix}-skeleton`
     }, _react.default.createElement(_skeleton.default, {
       className: `${classPrefix}-skeleton-line-1`,

package/2x/cjs/components/collapse/collapse.js

@@ -70,7 +70,9 @@ const CollapsePanelContent = props => {
     }
   }, [visible]);
   return _react.default.createElement(_web.animated.div, {
-    className: `${classPrefix}-panel-content`,
+    className: (0, _classnames.default)(`${classPrefix}-panel-content`, {
+      [`${classPrefix}-panel-content-active`]: visible
+    }),
     style: {
       height: height.to(v => {
         if (height.idle && visible) {

package/2x/cjs/components/date-picker/date-picker-date-utils.d.ts

@@ -4,4 +4,4 @@ import { RenderLabel } from '../date-picker-view/date-picker-view';
 export declare type DatePrecision = 'year' | 'month' | 'day' | 'hour' | 'minute' | 'second';
 export declare function generateDatePickerColumns(selected: string[], min: Date, max: Date, precision: DatePrecision, renderLabel: RenderLabel, filter: DatePickerFilter | undefined, tillNow?: boolean): PickerColumn[];
 export declare function convertDateToStringArray(date: Date | undefined | null): string[];
-export declare function convertStringArrayToDate(value: (string | null | undefined)[]): Date;
+export declare function convertStringArrayToDate<T extends string | number | null | undefined>(value: T[]): Date;

package/2x/cjs/components/date-picker/date-picker-utils.d.ts

@@ -6,5 +6,5 @@ export declare type DatePickerFilter = Partial<Record<Precision, (val: number, e
     date: Date;
 }) => boolean>>;
 export declare const convertDateToStringArray: (date: Date | undefined | null, precision: Precision) => string[];
-export declare const convertStringArrayToDate: (value: (string | null | undefined)[], precision: Precision) => Date;
+export declare const convertStringArrayToDate: <T extends string | number | null | undefined>(value: T[], precision: Precision) => Date;
 export declare const generateDatePickerColumns: (selected: string[], min: Date, max: Date, precision: Precision, renderLabel: RenderLabel, filter: DatePickerFilter | undefined, tillNow?: boolean | undefined) => import("../picker-view").PickerColumn[];

package/2x/cjs/components/date-picker/date-picker-week-utils.d.ts

@@ -4,4 +4,4 @@ import type { DatePickerFilter } from './date-picker-utils';
 export declare type WeekPrecision = 'year' | 'week' | 'week-day';
 export declare function generateDatePickerColumns(selected: string[], min: Date, max: Date, precision: WeekPrecision, renderLabel: (type: WeekPrecision, data: number) => ReactNode, filter: DatePickerFilter | undefined): PickerColumn[];
 export declare function convertDateToStringArray(date: Date | undefined | null): string[];
-export declare function convertStringArrayToDate(value: (string | null | undefined)[]): Date;
+export declare function convertStringArrayToDate<T extends string | number | null | undefined>(value: T[]): Date;

package/2x/cjs/components/date-picker/date-picker.d.ts

@@ -18,7 +18,7 @@ export declare type DatePickerProps = Pick<PickerProps, 'onCancel' | 'onClose' |
     filter?: DatePickerFilter;
     tillNow?: boolean;
 } & NativeProps;
-export declare const DatePicker: React.ForwardRefExoticComponent<Pick<PickerProps, "style" | "title" | "onClick" | "visible" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation" | "onCancel" | "onClose" | "loading" | "closeOnMaskClick" | "cancelText" | "mouseWheel" | "loadingContent" | "confirmText"> & {
+export declare const DatePicker: React.ForwardRefExoticComponent<Pick<PickerProps, "style" | "title" | "onClick" | "visible" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation" | "closeOnMaskClick" | "onClose" | "cancelText" | "loading" | "mouseWheel" | "loadingContent" | "onCancel" | "confirmText"> & {
     value?: PickerDate | null | undefined;
     defaultValue?: PickerDate | null | undefined;
     onSelect?: ((value: PickerDate) => void) | undefined;

package/2x/cjs/components/date-picker/index.d.ts

@@ -2,7 +2,7 @@ import './date-picker.less';
 import { prompt } from './prompt';
 export type { DatePickerProps, DatePickerRef } from './date-picker';
 export type { DatePickerFilter } from './date-picker-utils';
-declare const _default: import("react").ForwardRefExoticComponent<Pick<import("../picker").PickerProps, "style" | "title" | "onClick" | "visible" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation" | "onCancel" | "onClose" | "loading" | "closeOnMaskClick" | "cancelText" | "mouseWheel" | "loadingContent" | "confirmText"> & {
+declare const _default: import("react").ForwardRefExoticComponent<Pick<import("../picker").PickerProps, "style" | "title" | "onClick" | "visible" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation" | "closeOnMaskClick" | "onClose" | "cancelText" | "loading" | "mouseWheel" | "loadingContent" | "onCancel" | "confirmText"> & {
     value?: import("./util").PickerDate | null | undefined;
     defaultValue?: import("./util").PickerDate | null | undefined;
     onSelect?: ((value: import("./util").PickerDate) => void) | undefined;

package/2x/cjs/components/dropdown/dropdown.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { PopupProps } from '../popup';
 import { NativeProps } from '../../utils/native-props';
 export declare type DropdownProps = {
     activeKey?: string | null;
@@ -7,6 +8,7 @@ export declare type DropdownProps = {
     closeOnClickAway?: boolean;
     onChange?: (key: string | null) => void;
     arrow?: React.ReactNode;
+    getContainer?: PopupProps['getContainer'];
 } & NativeProps;
 export declare type DropdownRef = {
     close: () => void;
@@ -18,6 +20,7 @@ declare const Dropdown: React.ForwardRefExoticComponent<{
     closeOnClickAway?: boolean | undefined;
     onChange?: ((key: string | null) => void) | undefined;
     arrow?: React.ReactNode;
+    getContainer?: PopupProps['getContainer'];
 } & {
     className?: string | undefined;
     style?: (React.CSSProperties & Partial<Record<never, string>>) | undefined;

package/2x/cjs/components/dropdown/dropdown.js

@@ -12,6 +12,7 @@ var _item = require("./item");
 var _nativeProps = require("../../utils/native-props");
 var _withDefaultProps = require("../../utils/with-default-props");
 var _usePropsValue = require("../../utils/use-props-value");
+var _popupBaseProps = require("../popup/popup-base-props");
 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; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -19,7 +20,8 @@ const classPrefix = `adm-dropdown`;
 const defaultProps = {
   defaultActiveKey: null,
   closeOnMaskClick: true,
-  closeOnClickAway: false
+  closeOnClickAway: false,
+  getContainer: _popupBaseProps.defaultPopupBaseProps['getContainer']
 };
 const Dropdown = (0, _react.forwardRef)((p, ref) => {
   const props = (0, _withDefaultProps.mergeProps)(defaultProps, p);
@@ -87,6 +89,7 @@ const Dropdown = (0, _react.forwardRef)((p, ref) => {
   }, navs), _react.default.createElement(_popup.default, {
     visible: !!value,
     position: 'top',
+    getContainer: props.getContainer,
     className: `${classPrefix}-popup`,
     maskClassName: `${classPrefix}-popup-mask`,
     bodyClassName: `${classPrefix}-popup-body`,

package/2x/cjs/components/dropdown/index.d.ts

@@ -8,6 +8,7 @@ declare const _default: import("react").ForwardRefExoticComponent<{
     closeOnClickAway?: boolean | undefined;
     onChange?: ((key: string | null) => void) | undefined;
     arrow?: import("react").ReactNode;
+    getContainer?: import("../../utils/render-to-container").GetContainer | undefined;
 } & {
     className?: string | undefined;
     style?: (import("react").CSSProperties & Partial<Record<never, string>>) | undefined;

package/2x/cjs/components/ellipsis/ellipsis.d.ts

@@ -5,8 +5,8 @@ export declare type EllipsisProps = {
     content: string;
     direction?: 'start' | 'end' | 'middle';
     rows?: number;
-    expandText?: string;
-    collapseText?: string;
+    expandText?: React.ReactNode;
+    collapseText?: React.ReactNode;
     stopPropagationForActionButtons?: PropagationEvent[];
     onContentClick?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
     defaultExpanded?: boolean;

package/2x/cjs/components/ellipsis/ellipsis.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Ellipsis = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _runes = _interopRequireDefault(require("runes"));
+var _runes = _interopRequireDefault(require("runes2"));
 var _withDefaultProps = require("../../utils/with-default-props");
 var _nativeProps = require("../../utils/native-props");
 var _useResizeEffect = require("../../utils/use-resize-effect");
@@ -28,6 +28,8 @@ const defaultProps = {
 const Ellipsis = p => {
   const props = (0, _withDefaultProps.mergeProps)(defaultProps, p);
   const rootRef = (0, _react.useRef)(null);
+  const expandElRef = (0, _react.useRef)(null);
+  const collapseElRef = (0, _react.useRef)(null);
   const [ellipsised, setEllipsised] = (0, _react.useState)({});
   const [expanded, setExpanded] = (0, _react.useState)(props.defaultExpanded);
   const [exceeded, setExceeded] = (0, _react.useState)(false);
@@ -36,19 +38,18 @@ const Ellipsis = p => {
     return chars.slice(start, end).join('');
   }
   function calcEllipsised() {
+    var _a, _b;
     const root = rootRef.current;
     if (!root) return;
-    if (!root.offsetParent) return;
+    const originDisplay = root.style.display;
+    root.style.display = 'block';
     const originStyle = window.getComputedStyle(root);
     const container = document.createElement('div');
     const styleNames = Array.prototype.slice.apply(originStyle);
     styleNames.forEach(name => {
       container.style.setProperty(name, originStyle.getPropertyValue(name));
     });
-    container.style.position = 'fixed';
-    container.style.left = '999999px';
-    container.style.top = '999999px';
-    container.style.zIndex = '-1000';
+    root.style.display = originDisplay;
     container.style.height = 'auto';
     container.style.minHeight = 'auto';
     container.style.maxHeight = 'auto';
@@ -65,7 +66,9 @@ const Ellipsis = p => {
     } else {
       setExceeded(true);
       const end = props.content.length;
-      const actionText = expanded ? props.collapseText : props.expandText;
+      const collapseEl = typeof props.collapseText === 'string' ? props.collapseText : (_a = collapseElRef.current) === null || _a === void 0 ? void 0 : _a.innerHTML;
+      const expandEl = typeof props.expandText === 'string' ? props.expandText : (_b = expandElRef.current) === null || _b === void 0 ? void 0 : _b.innerHTML;
+      const actionText = expanded ? collapseEl : expandEl;
       function check(left, right) {
         if (right - left <= 1) {
           if (props.direction === 'end') {
@@ -80,9 +83,9 @@ const Ellipsis = p => {
         }
         const middle = Math.round((left + right) / 2);
         if (props.direction === 'end') {
-          container.innerText = getSubString(0, middle) + '...' + actionText;
+          container.innerHTML = getSubString(0, middle) + '...' + actionText;
         } else {
-          container.innerText = actionText + '...' + getSubString(middle, end);
+          container.innerHTML = actionText + '...' + getSubString(middle, end);
         }
         if (container.offsetHeight <= maxHeight) {
           if (props.direction === 'end') {
@@ -107,7 +110,7 @@ const Ellipsis = p => {
         }
         const leftPartMiddle = Math.floor((leftPart[0] + leftPart[1]) / 2);
         const rightPartMiddle = Math.ceil((rightPart[0] + rightPart[1]) / 2);
-        container.innerText = getSubString(0, leftPartMiddle) + '...' + actionText + '...' + getSubString(rightPartMiddle, end);
+        container.innerHTML = getSubString(0, leftPartMiddle) + '...' + actionText + '...' + getSubString(rightPartMiddle, end);
         if (container.offsetHeight <= maxHeight) {
           return checkMiddle([leftPartMiddle, leftPart[1]], [rightPart[0], rightPartMiddle]);
         } else {
@@ -125,24 +128,21 @@ const Ellipsis = p => {
     calcEllipsised();
   }, [props.content, props.direction, props.rows, props.expandText, props.collapseText]);
   const expandActionElement = exceeded && props.expandText ? (0, _withStopPropagation.withStopPropagation)(props.stopPropagationForActionButtons, _react.default.createElement("a", {
+    ref: expandElRef,
     onClick: () => {
       setExpanded(true);
     }
   }, props.expandText)) : null;
   const collapseActionElement = exceeded && props.collapseText ? (0, _withStopPropagation.withStopPropagation)(props.stopPropagationForActionButtons, _react.default.createElement("a", {
+    ref: collapseElRef,
     onClick: () => {
       setExpanded(false);
     }
   }, props.collapseText)) : null;
   const renderContent = () => {
-    if (!exceeded) {
-      return props.content;
-    }
-    if (expanded) {
-      return _react.default.createElement(_react.default.Fragment, null, props.content, collapseActionElement);
-    } else {
-      return _react.default.createElement(_react.default.Fragment, null, ellipsised.leading, expandActionElement, ellipsised.tailing);
-    }
+    if (!exceeded) return props.content;
+    if (expanded) return _react.default.createElement(_react.default.Fragment, null, props.content, collapseActionElement);
+    return _react.default.createElement(_react.default.Fragment, null, ellipsised.leading, expandActionElement, ellipsised.tailing);
   };
   return (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {
     ref: rootRef,

package/2x/cjs/components/footer/footer.css

@@ -43,7 +43,7 @@
   white-space: nowrap;
   margin-right: 40px;
   font-size: 24px;
-  background-color: var(--adm-color-box);
+  background-color: var(--adm-color-fill-content);
   color: var(--adm-color-weak);
   padding: 8px 24px;
   border-radius: 200px;

package/2x/cjs/components/form/form-subscribe.js

@@ -13,7 +13,10 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 const FormSubscribe = props => {
   const update = (0, _ahooks.useUpdate)();
   const form = (0, _react.useContext)(_rcFieldForm.FieldContext);
-  return _react.default.createElement(_react.default.Fragment, null, props.children(form.getFieldsValue(props.to), form), props.to.map(namePath => _react.default.createElement(Watcher, {
+  const value = form.getFieldsValue(props.to);
+  // Memo to avoid useless render
+  const childNode = _react.default.useMemo(() => props.children(value, form), [JSON.stringify(value)]);
+  return _react.default.createElement(_react.default.Fragment, null, childNode, props.to.map(namePath => _react.default.createElement(Watcher, {
     key: namePath.toString(),
     form: form,
     namePath: namePath,

package/2x/cjs/components/form/form.js

@@ -81,7 +81,7 @@ const Form = (0, _react.forwardRef)((p, ref) => {
       hasFeedback,
       layout,
       requiredMarkStyle,
-      disabled: disabled
+      disabled
     }
   }, lists), footer && _react.default.createElement("div", {
     className: `${classPrefix}-footer`

package/2x/cjs/components/form/index.d.ts

@@ -4,7 +4,7 @@ export declare type FormLayout = 'vertical' | 'horizontal';
 export type { FormProps, FormInstance } from './form';
 export type { FormItemProps } from './form-item';
 export type { FormSubscribeProps } from './form-subscribe';
-export type { ValidateMessages, FieldData, NamePath, } from 'rc-field-form/es/interface';
+export type { ValidateMessages, FieldData, NamePath, Rule, RuleObject, RuleRender, } from 'rc-field-form/es/interface';
 export type { FormArrayField, FormArrayOperation, FormArrayProps, } from './form-array';
 declare const _default: import("react").ForwardRefExoticComponent<Pick<import("rc-field-form").FormProps<any>, "children" | "form" | "name" | "initialValues" | "preserve" | "validateMessages" | "validateTrigger" | "onFieldsChange" | "onFinish" | "onFinishFailed" | "onValuesChange"> & {
     className?: string | undefined;

package/2x/cjs/components/image/image.d.ts

@@ -14,5 +14,5 @@ export declare type ImageProps = {
     onError?: (event: React.SyntheticEvent<HTMLImageElement, Event>) => void;
     onLoad?: (event: React.SyntheticEvent<HTMLImageElement, Event>) => void;
     onContainerClick?: (event: React.MouseEvent<HTMLDivElement, Event>) => void;
-} & NativeProps<'--width' | '--height'> & Pick<React.ImgHTMLAttributes<HTMLImageElement>, 'crossOrigin' | 'decoding' | 'loading' | 'referrerPolicy' | 'sizes' | 'srcSet' | 'useMap'>;
+} & NativeProps<'--width' | '--height'> & Pick<React.ImgHTMLAttributes<HTMLImageElement>, 'crossOrigin' | 'decoding' | 'loading' | 'referrerPolicy' | 'sizes' | 'srcSet' | 'useMap' | 'id'>;
 export declare const Image: React.FC<ImageProps>;

package/2x/cjs/components/image/image.js

@@ -32,6 +32,7 @@ const Image = (0, _stagedComponents.staged)(p => {
   const [loaded, setLoaded] = (0, _react.useState)(false);
   const [failed, setFailed] = (0, _react.useState)(false);
   const ref = (0, _react.useRef)(null);
+  const imgRef = (0, _react.useRef)(null);
   let src = props.src;
   let srcSet = props.srcSet;
   const [initialized, setInitialized] = (0, _react.useState)(!props.lazy);
@@ -41,11 +42,20 @@ const Image = (0, _stagedComponents.staged)(p => {
     setLoaded(false);
     setFailed(false);
   }, [src]);
+  (0, _react.useEffect)(() => {
+    var _a;
+    // for nextjs ssr
+    if ((_a = imgRef.current) === null || _a === void 0 ? void 0 : _a.complete) {
+      setLoaded(true);
+    }
+  }, []);
   function renderInner() {
     if (failed) {
       return _react.default.createElement(_react.default.Fragment, null, props.fallback);
     }
     const img = _react.default.createElement("img", {
+      ref: imgRef,
+      id: props.id,
       className: `${classPrefix}-img`,
       src: src,
       alt: props.alt,

package/2x/cjs/components/image-uploader/image-uploader.js

@@ -127,9 +127,11 @@ const ImageUploader = p => {
         file
       }));
       setTasks(prev => [...getFinalTasks(prev), ...newTasks]);
-      yield Promise.all(newTasks.map(currentTask => (0, _tslib.__awaiter)(this, void 0, void 0, function* () {
+      const newVal = [];
+      yield Promise.all(newTasks.map((currentTask, index) => (0, _tslib.__awaiter)(this, void 0, void 0, function* () {
         try {
           const result = yield props.upload(currentTask.file);
+          newVal[index] = result;
           setTasks(prev => {
             return prev.map(task => {
               if (task.id === currentTask.id) {
@@ -141,10 +143,6 @@ const ImageUploader = p => {
               return task;
             });
           });
-          setValue(prev => {
-            const newVal = Object.assign({}, result);
-            return [...prev, newVal];
-          });
         } catch (e) {
           setTasks(prev => {
             return prev.map(task => {
@@ -159,6 +157,7 @@ const ImageUploader = p => {
           throw e;
         }
       }))).catch(error => console.error(error));
+      setValue(prev => prev.concat(newVal));
     });
   }
   const imageViewerHandlerRef = (0, _react.useRef)(null);

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

@@ -4,7 +4,7 @@ declare type NativeInputProps = React.DetailedHTMLProps<React.InputHTMLAttribute
 declare type AriaProps = {
     role?: string;
 };
-export declare type InputProps = Pick<NativeInputProps, 'maxLength' | 'minLength' | 'autoComplete' | 'autoFocus' | 'pattern' | 'inputMode' | 'type' | 'name' | 'onFocus' | 'onBlur' | 'autoCapitalize' | 'autoCorrect' | 'onKeyDown' | 'onKeyUp' | 'onCompositionStart' | 'onCompositionEnd' | 'onClick' | 'step'> & {
+export declare type InputProps = Pick<NativeInputProps, 'maxLength' | 'minLength' | 'autoComplete' | 'autoFocus' | 'pattern' | 'inputMode' | 'type' | 'name' | 'onFocus' | 'onBlur' | 'autoCapitalize' | 'autoCorrect' | 'onKeyDown' | 'onKeyUp' | 'onCompositionStart' | 'onCompositionEnd' | 'onClick' | 'step' | 'id'> & {
     value?: string;
     defaultValue?: string;
     onChange?: (val: string) => void;
@@ -14,7 +14,6 @@ export declare type InputProps = Pick<NativeInputProps, 'maxLength' | 'minLength
     clearable?: boolean;
     onlyShowClearWhenFocus?: boolean;
     onClear?: () => void;
-    id?: string;
     onEnterPress?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
     enterKeyHint?: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
     min?: number;
@@ -26,7 +25,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" | "autoFocus" | "autoCapitalize" | "autoCorrect" | "inputMode" | "autoComplete" | "maxLength" | "minLength" | "step"> & {
+export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProps, "pattern" | "id" | "onClick" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "onKeyDown" | "onKeyUp" | "type" | "step" | "autoFocus" | "autoCapitalize" | "autoCorrect" | "inputMode" | "name" | "autoComplete" | "maxLength" | "minLength"> & {
     value?: string | undefined;
     defaultValue?: string | undefined;
     onChange?: ((val: string) => void) | undefined;
@@ -36,7 +35,6 @@ export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProp
     clearable?: boolean | undefined;
     onlyShowClearWhenFocus?: boolean | undefined;
     onClear?: (() => void) | undefined;
-    id?: string | undefined;
     onEnterPress?: ((e: React.KeyboardEvent<HTMLInputElement>) => void) | undefined;
     enterKeyHint?: "search" | "enter" | "done" | "go" | "next" | "previous" | "send" | undefined;
     min?: number | undefined;

package/2x/cjs/components/list/list-item.d.ts

@@ -9,6 +9,6 @@ export declare type ListItemProps = {
     clickable?: boolean;
     arrow?: boolean | ReactNode;
     disabled?: boolean;
-    onClick?: (e: React.MouseEvent) => void;
+    onClick?: (e: React.MouseEvent<HTMLElement>) => void;
 } & NativeProps<'--prefix-width' | '--align-items' | '--active-background-color'>;
 export declare const ListItem: FC<ListItemProps>;

package/2x/cjs/components/notice-bar/notice-bar.d.ts

@@ -13,6 +13,8 @@ export declare type NoticeBarProps = {
     closeable?: boolean;
     /** Callback when closed */
     onClose?: () => void;
+    /** Event when click */
+    onClick?: () => void;
     /** Additional operating area, displayed to the left of the close button */
     extra?: React.ReactNode;
     /** Radio icon on the left */

package/2x/cjs/components/notice-bar/notice-bar.js

@@ -73,7 +73,8 @@ const NoticeBar = (0, _react.memo)(p => {
   return (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {
     className: (0, _classnames.default)(classPrefix, `${classPrefix}-${props.color}`, {
       [`${classPrefix}-wrap`]: props.wrap
-    })
+    }),
+    onClick: props.onClick
   }, props.icon && _react.default.createElement("span", {
     className: `${classPrefix}-left`
   }, props.icon), _react.default.createElement("span", {

package/2x/cjs/components/page-indicator/page-indicator.css

@@ -29,7 +29,7 @@
 
 .adm-page-indicator-color-white {
   --dot-color: rgba(255, 255, 255, 0.5);
-  --active-dot-color: var(--adm-color-white);
+  --active-dot-color: var(--adm-color-text-light-solid);
 }
 
 .adm-page-indicator-horizontal {

package/2x/cjs/components/picker-view/picker-view.d.ts

@@ -1,14 +1,14 @@
 import React, { ReactNode } from 'react';
 import { NativeProps } from '../../utils/native-props';
 import { PickerProps } from '../picker';
-export declare type PickerValue = string | null;
+export declare type PickerValue = string | number | null;
 export declare type PickerValueExtend = {
     columns: PickerColumnItem[][];
     items: (PickerColumnItem | null)[];
 };
 export declare type PickerColumnItem = {
     label: ReactNode;
-    value: string;
+    value: string | number;
     key?: string | number;
 };
 export declare type PickerColumn = (string | PickerColumnItem)[];

package/2x/cjs/components/popup/popup.d.ts

@@ -3,5 +3,6 @@ import { NativeProps } from '../../utils/native-props';
 import { PopupBaseProps } from './popup-base-props';
 export declare type PopupProps = PopupBaseProps & PropsWithChildren<{
     position?: 'bottom' | 'top' | 'left' | 'right';
+    closeOnSwipe?: boolean;
 }> & NativeProps<'--z-index'>;
 export declare const Popup: FC<PopupProps>;

package/2x/cjs/components/popup/popup.js

@@ -19,11 +19,13 @@ var _antdMobileIcons = require("antd-mobile-icons");
 var _popupBaseProps = require("./popup-base-props");
 var _useInnerVisible = require("../../utils/use-inner-visible");
 var _configProvider = require("../config-provider");
+var _react2 = require("@use-gesture/react");
 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; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const classPrefix = `adm-popup`;
 const defaultProps = Object.assign(Object.assign({}, _popupBaseProps.defaultPopupBaseProps), {
+  closeOnSwipe: false,
   position: 'bottom'
 });
 const Popup = p => {
@@ -62,14 +64,27 @@ const Popup = p => {
       }
     }
   });
+  const bind = (0, _react2.useDrag)(({
+    swipe: [, swipeY]
+  }) => {
+    var _a;
+    if (!props.closeOnSwipe) return;
+    if (swipeY === 1 && props.position === 'bottom' || swipeY === -1 && props.position === 'top') {
+      (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
+    }
+  }, {
+    axis: 'y',
+    enabled: ['top', 'bottom'].includes(props.position)
+  });
   const maskVisible = (0, _useInnerVisible.useInnerVisible)(active && props.visible);
-  const node = (0, _withStopPropagation.withStopPropagation)(props.stopPropagation, (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {
+  const node = (0, _withStopPropagation.withStopPropagation)(props.stopPropagation, (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", Object.assign({
     className: classPrefix,
     onClick: props.onClick,
     style: {
-      display: active ? undefined : 'none'
+      display: active ? undefined : 'none',
+      touchAction: ['top', 'bottom'].includes(props.position) ? 'none' : 'auto'
     }
-  }, props.mask && _react.default.createElement(_mask.default, {
+  }, bind()), props.mask && _react.default.createElement(_mask.default, {
     visible: maskVisible,
     forceRender: props.forceRender,
     destroyOnClose: props.destroyOnClose,
@@ -88,19 +103,17 @@ const Popup = p => {
     className: bodyCls,
     style: Object.assign(Object.assign({}, props.bodyStyle), {
       transform: percent.to(v => {
-        if (v) {
-          if (props.position === 'bottom') {
-            return `translate(0, ${v}%)`;
-          }
-          if (props.position === 'top') {
-            return `translate(0, -${v}%)`;
-          }
-          if (props.position === 'left') {
-            return `translate(-${v}%, 0)`;
-          }
-          if (props.position === 'right') {
-            return `translate(${v}%, 0)`;
-          }
+        if (props.position === 'bottom') {
+          return `translate(0, ${v}%)`;
+        }
+        if (props.position === 'top') {
+          return `translate(0, -${v}%)`;
+        }
+        if (props.position === 'left') {
+          return `translate(-${v}%, 0)`;
+        }
+        if (props.position === 'right') {
+          return `translate(${v}%, 0)`;
         }
         return 'none';
       })