antd-mobile 0.0.0-dev-626cbf51f → 0.0.0-dev.fc623d614

package/2x/README.md

@@ -1,4 +1,4 @@
-<img src="https://gw.alipayobjects.com/mdn/rms_ee68a8/afts/img/A*hjjDS5Yy-ooAAAAAAAAAAAAAARQnAQ" alt="logo" width="100%" />
+<img alt="logo" src="https://gw.alipayobjects.com/mdn/rms_ee68a8/afts/img/A*hjjDS5Yy-ooAAAAAAAAAAAAAARQnAQ" width="100%" />
 
 <p align="center">
   <a href="https://mobile.ant.design">English Doc</a>
@@ -10,16 +10,18 @@
   <a href="https://gw.alipayobjects.com/mdn/rms_25513e/afts/img/A*hBjlR4nUWjkAAAAAAAAAAAAAARQnAQ">钉钉</a>
 </p>
 
-![npm (tag)](https://img.shields.io/npm/v/antd-mobile)
-![GitHub Release Date](https://img.shields.io/github/release-date/ant-design/ant-design-mobile)
-![npm](https://img.shields.io/npm/dw/antd-mobile)
-![npm](https://img.shields.io/npm/dw/antd-mobile-v5-count?label=downloads%285.x%29)
-![gzip size](https://img.badgesize.io/https:/unpkg.com/antd-mobile/umd/antd-mobile.js?label=gzip%20size&compression=gzip)
+[![npm (tag)](https://img.shields.io/npm/v/antd-mobile)](https://www.npmjs.com/package/antd-mobile)
+[![GitHub Release Date](https://img.shields.io/github/release-date/ant-design/ant-design-mobile)](https://github.com/ant-design/ant-design-mobile/releases)
+[![npm](https://img.shields.io/npm/dw/antd-mobile)](https://www.npmjs.com/package/antd-mobile)
+[![npm](https://img.shields.io/npm/dw/antd-mobile-v5-count?label=downloads%285.x%29)](https://www.npmjs.com/package/antd-mobile)
+[![jsdelivr](https://img.shields.io/jsdelivr/npm/hm/antd-mobile)](https://www.jsdelivr.com/package/npm/antd-mobile)
+[![gzip size](https://img.badgesize.io/https:/unpkg.com/antd-mobile/umd/antd-mobile.js?label=gzip%20size&compression=gzip)](https://unpkg.com/browse/antd-mobile@5/umd/antd-mobile.js)
 [![Average time to resolve an issue](http://isitmaintained.com/badge/resolution/ant-design/ant-design-mobile.svg)](http://isitmaintained.com/project/ant-design/ant-design-mobile 'Average time to resolve an issue')
 [![Percentage of issues still open](http://isitmaintained.com/badge/open/ant-design/ant-design-mobile.svg)](http://isitmaintained.com/project/ant-design/ant-design-mobile 'Percentage of issues still open')
+[![Issues help wanted](https://img.shields.io/github/issues-raw/ant-design/ant-design-mobile/help%20wanted?label=help%20wanted)](https://github.com/ant-design/ant-design-mobile/issues?q=is%3Aissue+is%3Aopen+label%3A%22help+wanted%22)
 ![GitHub Workflow Status (branch)](https://img.shields.io/github/workflow/status/ant-design/ant-design-mobile/Check/v5)
-[![codecov](https://codecov.io/gh/ant-design/ant-design-mobile/branch/master/graph/badge.svg?token=2kJyJBg1nK)](https://codecov.io/gh/ant-design/ant-design-mobile)
-![GitHub](https://img.shields.io/github/license/ant-design/ant-design-mobile)
+[![codecov](https://img.shields.io/codecov/c/gh/ant-design/ant-design-mobile?token=2kJyJBg1nK)](https://codecov.io/gh/ant-design/ant-design-mobile)
+[![GitHub](https://img.shields.io/github/license/ant-design/ant-design-mobile)](https://github.com/ant-design/ant-design-mobile)
 
 ```bash
 $ npm install --save antd-mobile

package/2x/cjs/components/action-sheet/action-sheet.css

@@ -9,22 +9,37 @@
   justify-content: center;
   color: var(--adm-color-weak);
   font-size: 30px;
-  padding: 36px 32px;
+  padding: 36px 24px;
+  border-bottom: 2px solid var(--adm-border-color);
+}
+
+.adm-action-sheet-button-list {
   border-bottom: 2px solid var(--adm-border-color);
 }
 
 .adm-action-sheet-button-item-wrapper {
-  background-color: #ffffff;
-  border-top: 2px solid var(--adm-border-color);
+  border-bottom: 2px solid var(--adm-border-color);
 }
 
-.adm-action-sheet-button-item-wrapper:first-child {
-  border-top: none;
+.adm-action-sheet-button-item-wrapper:last-child {
+  border-bottom: none;
 }
 
 .adm-action-sheet-button-item {
-  padding: 28px;
   text-align: center;
+  display: block;
+  background-color: #ffffff;
+  padding: 32px;
+}
+
+.adm-action-sheet-button-item:active {
+  background-color: #eeeeee;
+}
+
+.adm-action-sheet-button-item-disabled {
+  cursor: not-allowed;
+  pointer-events: none;
+  opacity: 0.4;
 }
 
 .adm-action-sheet-button-item-name {
@@ -35,7 +50,7 @@
 .adm-action-sheet-button-item-description {
   font-size: 24px;
   color: var(--adm-color-weak);
-  padding-top: 8px;
+  padding-top: 4px;
 }
 
 .adm-action-sheet-button-item-danger .adm-action-sheet-button-item-name {

package/2x/cjs/components/action-sheet/action-sheet.js

@@ -16,8 +16,6 @@ var _classnames = _interopRequireDefault(require("classnames"));
 
 var _popup = _interopRequireDefault(require("../popup"));
 
-var _button = _interopRequireDefault(require("../button"));
-
 var _safeArea = _interopRequireDefault(require("../safe-area"));
 
 var _renderImperatively = require("../../utils/render-imperatively");
@@ -60,11 +58,11 @@ const ActionSheet = p => {
   }, props.actions.map((action, index) => _react.default.createElement("div", {
     key: action.key,
     className: `${classPrefix}-button-item-wrapper`
-  }, _react.default.createElement(_button.default, {
-    block: true,
-    fill: 'none',
-    shape: 'rectangular',
-    disabled: action.disabled,
+  }, _react.default.createElement("a", {
+    className: (0, _classnames.default)('adm-plain-anchor', `${classPrefix}-button-item`, {
+      [`${classPrefix}-button-item-danger`]: action.danger,
+      [`${classPrefix}-button-item-disabled`]: action.disabled
+    }),
     onClick: () => {
       var _a, _b, _c;
 
@@ -74,10 +72,7 @@ const ActionSheet = p => {
       if (props.closeOnAction) {
         (_c = props.onClose) === null || _c === void 0 ? void 0 : _c.call(props);
       }
-    },
-    className: (0, _classnames.default)(`${classPrefix}-button-item`, {
-      [`${classPrefix}-button-item-danger`]: action.danger
-    })
+    }
   }, _react.default.createElement("div", {
     className: `${classPrefix}-button-item-name`
   }, action.text), action.description && _react.default.createElement("div", {
@@ -86,11 +81,8 @@ const ActionSheet = p => {
     className: `${classPrefix}-cancel`
   }, _react.default.createElement("div", {
     className: `${classPrefix}-button-item-wrapper`
-  }, _react.default.createElement(_button.default, {
-    block: true,
-    fill: 'none',
-    shape: 'rectangular',
-    className: `${classPrefix}-button-item`,
+  }, _react.default.createElement("a", {
+    className: (0, _classnames.default)('adm-plain-anchor', `${classPrefix}-button-item`),
     onClick: () => {
       var _a;
 

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

@@ -1,6 +1,6 @@
 import React, { FC } from 'react';
 import { NativeProps } from '../../utils/native-props';
-export declare const dot: unique symbol;
+export declare const dot: JSX.Element;
 export declare type BadgeProps = {
     content?: React.ReactNode | typeof dot;
     color?: string;

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

@@ -14,7 +14,9 @@ var _nativeProps = require("../../utils/native-props");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const classPrefix = `adm-badge`;
-const dot = Symbol();
+
+const dot = _react.default.createElement(_react.default.Fragment, null);
+
 exports.dot = dot;
 
 const Badge = props => {

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

@@ -2,6 +2,6 @@
 import './badge.less';
 export type { BadgeProps } from './badge';
 declare const _default: import("react").FC<import("./badge").BadgeProps> & {
-    dot: symbol;
+    dot: JSX.Element;
 };
 export default _default;

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

@@ -1,5 +1,6 @@
 import React from 'react';
 import { NativeProps } from '../../utils/native-props';
+declare type NativeButtonProps = React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;
 export declare type ButtonProps = {
     color?: 'default' | 'primary' | 'success' | 'warning' | 'danger';
     fill?: 'solid' | 'outline' | 'none';
@@ -9,11 +10,11 @@ export declare type ButtonProps = {
     loadingText?: string;
     loadingIcon?: React.ReactNode;
     disabled?: boolean;
-    onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void | Promise<void>;
+    onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void | Promise<void> | unknown;
     type?: 'submit' | 'reset' | 'button';
     shape?: 'default' | 'rounded' | 'rectangular';
     children?: React.ReactNode;
-} & NativeProps<'--text-color' | '--background-color' | '--border-radius' | '--border-width' | '--border-style' | '--border-color'>;
+} & Pick<NativeButtonProps, 'onMouseDown' | 'onMouseUp' | 'onTouchStart' | 'onTouchEnd'> & NativeProps<'--text-color' | '--background-color' | '--border-radius' | '--border-width' | '--border-style' | '--border-color'>;
 export declare type ButtonRef = {
     nativeElement: HTMLButtonElement | null;
 };
@@ -26,8 +27,9 @@ export declare const Button: React.ForwardRefExoticComponent<{
     loadingText?: string | undefined;
     loadingIcon?: React.ReactNode;
     disabled?: boolean | undefined;
-    onClick?: ((event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void | Promise<void>) | undefined;
+    onClick?: ((event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void | Promise<void> | unknown) | undefined;
     type?: "reset" | "submit" | "button" | undefined;
     shape?: "default" | "rounded" | "rectangular" | undefined;
     children?: React.ReactNode;
-} & NativeProps<"--text-color" | "--background-color" | "--border-radius" | "--border-width" | "--border-style" | "--border-color"> & React.RefAttributes<ButtonRef>>;
+} & Pick<NativeButtonProps, "onMouseDown" | "onMouseUp" | "onTouchEnd" | "onTouchStart"> & NativeProps<"--border-radius" | "--text-color" | "--background-color" | "--border-width" | "--border-style" | "--border-color"> & React.RefAttributes<ButtonRef>>;
+export {};

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

@@ -81,7 +81,11 @@ const Button = (0, _react.forwardRef)((p, ref) => {
       [`${classPrefix}-large`]: props.size === 'large',
       [`${classPrefix}-loading`]: loading
     }, `${classPrefix}-shape-${props.shape}`),
-    disabled: disabled
+    disabled: disabled,
+    onMouseDown: props.onMouseDown,
+    onMouseUp: props.onMouseUp,
+    onTouchStart: props.onTouchStart,
+    onTouchEnd: props.onTouchEnd
   }, loading ? _react.default.createElement("div", {
     className: `${classPrefix}-loading-wrapper`
   }, props.loadingIcon, props.loadingText) : props.children));

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

@@ -86,6 +86,10 @@
   border-bottom-right-radius: 8px;
 }
 
+.adm-calendar-cell.adm-calendar-cell-disabled.adm-calendar-cell.adm-calendar-cell-selected {
+  color: var(--adm-color-light);
+}
+
 .adm-calendar-cell .adm-calendar-cell-top {
   flex: none;
   font-size: 36px;

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

@@ -19,6 +19,7 @@ export declare type CalendarProps = {
     allowClear?: boolean;
     max?: Date;
     min?: Date;
+    shouldDisableDate?: (date: Date) => boolean;
 } & ({
     selectionMode?: undefined;
     value?: undefined;

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

@@ -153,10 +153,10 @@ const Calendar = (0, _react.forwardRef)((p, ref) => {
       }
 
       const inThisMonth = d.month() === current.month();
-      const disabled = !inThisMonth || maxDay && d.isAfter(maxDay, 'day') || minDay && d.isBefore(minDay, 'day');
+      const disabled = props.shouldDisableDate ? props.shouldDisableDate(d.toDate()) : maxDay && d.isAfter(maxDay, 'day') || minDay && d.isBefore(minDay, 'day');
       cells.push(_react.default.createElement("div", {
         key: d.valueOf(),
-        className: (0, _classnames.default)(`${classPrefix}-cell`, disabled && `${classPrefix}-cell-disabled`, inThisMonth && {
+        className: (0, _classnames.default)(`${classPrefix}-cell`, (disabled || !inThisMonth) && `${classPrefix}-cell-disabled`, inThisMonth && {
           [`${classPrefix}-cell-today`]: d.isSame(today, 'day'),
           [`${classPrefix}-cell-selected`]: isSelect,
           [`${classPrefix}-cell-selected-begin`]: isBegin,

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

@@ -1,4 +1,5 @@
 import React, { FC, ReactNode } from 'react';
+import type { MaskProps } from '../mask';
 import { Action } from './dialog-action-button';
 import { GetContainer } from '../../utils/render-to-container';
 import { PropagationEvent } from '../../utils/with-stop-propagation';
@@ -19,9 +20,11 @@ export declare type DialogProps = {
     getContainer?: GetContainer;
     bodyStyle?: React.CSSProperties;
     bodyClassName?: string;
-    maskStyle?: React.CSSProperties;
+    maskStyle?: MaskProps['style'];
     maskClassName?: string;
     stopPropagation?: PropagationEvent[];
     disableBodyScroll?: boolean;
+    destroyOnClose?: boolean;
+    forceRender?: boolean;
 } & NativeProps;
 export declare const Dialog: FC<DialogProps>;

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

@@ -31,6 +31,10 @@ var _web = require("@react-spring/web");
 
 var _nativeProps = require("../../utils/native-props");
 
+var _shouldRender = require("../../utils/should-render");
+
+var _useInnerVisible = require("../../utils/use-inner-visible");
+
 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); }
@@ -44,7 +48,9 @@ const defaultProps = {
   closeOnMaskClick: false,
   stopPropagation: ['click'],
   getContainer: null,
-  disableBodyScroll: true
+  disableBodyScroll: true,
+  destroyOnClose: false,
+  forceRender: false
 };
 
 const Dialog = p => {
@@ -59,9 +65,6 @@ const Dialog = p => {
       friction: 25,
       clamp: true
     },
-    onStart: () => {
-      setActive(true);
-    },
     onRest: () => {
       var _a, _b;
 
@@ -76,6 +79,12 @@ const Dialog = p => {
     }
   });
   const [active, setActive] = (0, _react.useState)(props.visible);
+  (0, _ahooks.useIsomorphicLayoutEffect)(() => {
+    if (props.visible) {
+      setActive(true);
+    }
+  }, [props.visible]);
+  const maskVisible = (0, _useInnerVisible.useInnerVisible)(active && props.visible);
 
   const body = _react.default.createElement("div", {
     className: (0, _classnames.default)(cls('body'), props.image && cls('with-image'), props.bodyClassName),
@@ -114,26 +123,28 @@ const Dialog = p => {
     })));
   })));
 
-  const node = (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {
+  const node = (0, _withStopPropagation.withStopPropagation)(props.stopPropagation, (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {
     className: cls(),
     style: {
-      display: active ? undefined : 'none'
+      display: active ? undefined : 'none',
+      pointerEvents: active ? undefined : 'none'
     }
   }, _react.default.createElement(_mask.default, {
-    visible: props.visible,
+    visible: maskVisible,
     onMaskClick: props.closeOnMaskClick ? props.onClose : undefined,
     style: props.maskStyle,
     className: (0, _classnames.default)(cls('mask'), props.maskClassName),
     disableBodyScroll: props.disableBodyScroll
   }), _react.default.createElement("div", {
-    className: cls('wrap'),
-    style: {
-      pointerEvents: props.visible ? undefined : 'none'
-    }
+    className: cls('wrap')
   }, _react.default.createElement(_web.animated.div, {
     style: style
-  }, body))));
-  return (0, _renderToContainer.renderToContainer)(props.getContainer, (0, _withStopPropagation.withStopPropagation)(props.stopPropagation, node));
+  }, body)))));
+  return _react.default.createElement(_shouldRender.ShouldRender, {
+    active: active,
+    forceRender: props.forceRender,
+    destroyOnClose: props.destroyOnClose
+  }, (0, _renderToContainer.renderToContainer)(props.getContainer, node));
 };
 
 exports.Dialog = Dialog;

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

@@ -38,7 +38,7 @@
 .adm-dropdown-item .adm-dropdown-item-title-arrow {
   color: var(--adm-color-light);
   font-size: 18px;
-  transform: rotate(0deg) translateY(-2px);
+  transform: rotate(0deg) translateY(2px);
   transition: all ease 0.2s;
 }
 

package/2x/cjs/components/error-block/images/busy.d.ts

@@ -1 +1,2 @@
+/// <reference types="react" />
 export declare const busyImage: JSX.Element;

package/2x/cjs/components/error-block/images/default.d.ts

@@ -1 +1,2 @@
+/// <reference types="react" />
 export declare const defaultImage: JSX.Element;

package/2x/cjs/components/error-block/images/disconnected.d.ts

@@ -1 +1,2 @@
+/// <reference types="react" />
 export declare const disconnectedImage: JSX.Element;

package/2x/cjs/components/error-block/images/empty.d.ts

@@ -1 +1,2 @@
+/// <reference types="react" />
 export declare const emptyImage: JSX.Element;

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

@@ -256,10 +256,7 @@ const FormItem = props => {
   }
 
   let Variables = {};
-
-  if (typeof label === 'string') {
-    Variables.label = label;
-  }
+  Variables.label = typeof label === 'string' ? label : '';
 
   if (messageVariables) {
     Variables = Object.assign(Object.assign({}, Variables), messageVariables);

package/2x/cjs/components/image/broken-image-icon.d.ts

@@ -0,0 +1 @@
+export declare const BrokenImageIcon: () => JSX.Element;

package/2x/cjs/components/image/broken-image-icon.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BrokenImageIcon = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const BrokenImageIcon = () => _react.default.createElement("svg", {
+  viewBox: '0 0 48 48',
+  xmlns: 'http://www.w3.org/2000/svg'
+}, _react.default.createElement("path", {
+  d: 'M19.233 6.233 17.42 9.08l-10.817.001a.665.665 0 0 0-.647.562l-.007.096V34.9l5.989-8.707a2.373 2.373 0 0 1 1.801-1.005 2.415 2.415 0 0 1 1.807.625l.126.127 4.182 4.525 2.267-3.292 5.461 7.841-4.065 7.375H6.604c-1.86 0-3.382-1.47-3.482-3.317l-.005-.192V9.744c0-1.872 1.461-3.405 3.296-3.505l.19-.005h12.63Zm22.163 0c1.86 0 3.382 1.472 3.482 3.314l.005.192v29.14a3.507 3.507 0 0 1-3.3 3.505l-.191.006H27.789l3.63-6.587.06-.119a1.87 1.87 0 0 0-.163-1.853l-6.928-9.949 3.047-4.422a2.374 2.374 0 0 1 1.96-1.01 2.4 2.4 0 0 1 1.86.87l.106.14L42.05 34.89V9.74a.664.664 0 0 0-.654-.658H21.855l1.812-2.848h17.73Zm-28.305 5.611c.794 0 1.52.298 2.07.788l-.843 1.325-.067.114a1.87 1.87 0 0 0 .11 1.959l.848 1.217c-.556.515-1.3.83-2.118.83a3.122 3.122 0 0 1-3.117-3.116 3.119 3.119 0 0 1 3.117-3.117Z',
+  fill: '#DBDBDB',
+  fillRule: 'nonzero'
+}));
+
+exports.BrokenImageIcon = BrokenImageIcon;

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

@@ -0,0 +1 @@
+export declare const ImageIcon: () => JSX.Element;

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

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ImageIcon = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const ImageIcon = () => _react.default.createElement("svg", {
+  viewBox: '0 0 48 48',
+  xmlns: 'http://www.w3.org/2000/svg'
+}, _react.default.createElement("path", {
+  d: 'M41.396 6.234c1.923 0 3.487 1.574 3.487 3.505v29.14c0 1.937-1.568 3.51-3.491 3.51H6.604c-1.923 0-3.487-1.573-3.487-3.51V9.745c0-1.936 1.564-3.51 3.487-3.51Zm0 2.847H6.604c-.355 0-.654.3-.654.658V34.9l5.989-8.707a2.373 2.373 0 0 1 1.801-1.005 2.405 2.405 0 0 1 1.933.752l4.182 4.525 7.58-11.005a2.374 2.374 0 0 1 1.96-1.01c.79 0 1.532.38 1.966 1.01L42.05 34.89V9.74a.664.664 0 0 0-.654-.658Zm-28.305 2.763a3.119 3.119 0 0 1 3.117 3.117 3.119 3.119 0 0 1-3.117 3.117 3.122 3.122 0 0 1-3.117-3.117 3.119 3.119 0 0 1 3.117-3.117Z',
+  fill: '#DBDBDB',
+  fillRule: 'nonzero'
+}));
+
+exports.ImageIcon = ImageIcon;

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

@@ -14,13 +14,15 @@
 
 .adm-image-tip {
   position: relative;
-  background-color: #f3f3f3;
+  background-color: #f5f5f5;
   height: 100%;
   min-height: 48px;
   min-width: 48px;
 }
 
-.adm-image-tip > .antd-mobile-icon {
+.adm-image-tip > svg {
+  width: 48px;
+  height: 48px;
   position: absolute;
   left: 50%;
   top: 50%;

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

@@ -1,7 +1,7 @@
 import React, { ReactNode } from 'react';
 import { NativeProps } from '../../utils/native-props';
 export declare type ImageProps = {
-    src: string;
+    src?: string;
     alt?: string;
     width?: number | string;
     height?: number | string;
@@ -9,6 +9,7 @@ export declare type ImageProps = {
     placeholder?: ReactNode;
     fallback?: ReactNode;
     lazy?: boolean;
+    draggable?: boolean;
     onClick?: (event: React.MouseEvent<HTMLImageElement, Event>) => void;
     onError?: (event: React.SyntheticEvent<HTMLImageElement, Event>) => void;
     onLoad?: (event: React.SyntheticEvent<HTMLImageElement, Event>) => void;

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

@@ -11,8 +11,6 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _nativeProps = require("../../utils/native-props");
 
-var _antdMobileIcons = require("antd-mobile-icons");
-
 var _stagedComponents = require("staged-components");
 
 var _toCssLength = require("../../utils/to-css-length");
@@ -21,6 +19,10 @@ var _lazyDetector = require("./lazy-detector");
 
 var _useIsomorphicUpdateLayoutEffect = require("../../utils/use-isomorphic-update-layout-effect");
 
+var _imageIcon = require("./image-icon");
+
+var _brokenImageIcon = require("./broken-image-icon");
+
 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; }
@@ -30,11 +32,12 @@ const defaultProps = {
   fit: 'fill',
   placeholder: _react.default.createElement("div", {
     className: `${classPrefix}-tip`
-  }, _react.default.createElement(_antdMobileIcons.PictureOutline, null)),
+  }, _react.default.createElement(_imageIcon.ImageIcon, null)),
   fallback: _react.default.createElement("div", {
     className: `${classPrefix}-tip`
-  }, _react.default.createElement(_antdMobileIcons.PictureWrongOutline, null)),
-  lazy: false
+  }, _react.default.createElement(_brokenImageIcon.BrokenImageIcon, null)),
+  lazy: false,
+  draggable: false
 };
 const Image = (0, _stagedComponents.staged)(p => {
   const props = (0, _withDefaultProps.mergeProps)(defaultProps, p);
@@ -83,7 +86,8 @@ const Image = (0, _stagedComponents.staged)(p => {
       referrerPolicy: props.referrerPolicy,
       sizes: props.sizes,
       srcSet: srcSet,
-      useMap: props.useMap
+      useMap: props.useMap,
+      draggable: props.draggable
     });
 
     return _react.default.createElement(_react.default.Fragment, null, !loaded && props.placeholder, img);

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

@@ -53,9 +53,6 @@ const ImageUploader = p => {
   } = (0, _configProvider.useConfig)();
   const props = (0, _withDefaultProps.mergeProps)(defaultProps, p);
   const [value, setValue] = (0, _usePropsValue.usePropsValue)(props);
-  const updateValue = (0, _ahooks.useMemoizedFn)(updater => {
-    setValue(updater(value));
-  });
   const [tasks, setTasks] = (0, _react.useState)([]);
   (0, _ahooks.useIsomorphicLayoutEffect)(() => {
     setTasks(prev => prev.filter(task => {
@@ -134,7 +131,7 @@ const ImageUploader = p => {
               return task;
             });
           });
-          updateValue(prev => {
+          setValue(prev => {
             const newVal = Object.assign({}, result);
             return [...prev, newVal];
           });

package/2x/cjs/components/image-viewer/image-viewer.css

@@ -1,11 +1,17 @@
 .adm-image-viewer-content {
   width: 100vw;
   height: 100vh;
-  max-height: -webkit-fill-available;
   touch-action: none;
   user-select: none;
 }
 
+.adm-image-viewer-footer {
+  position: absolute;
+  width: 100%;
+  bottom: 0;
+  z-index: 1;
+}
+
 .adm-image-viewer-slides {
   height: 100%;
   position: relative;

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

@@ -8,16 +8,19 @@ export declare type ImageViewerProps = {
     visible?: boolean;
     onClose?: () => void;
     afterClose?: () => void;
+    renderFooter?: (image: string) => React.ReactNode;
 };
 export declare const ImageViewer: FC<ImageViewerProps>;
 export declare type MultiImageViewerRef = SlidesRef;
-export declare type MultiImageViewerProps = Omit<ImageViewerProps, 'image'> & {
+export declare type MultiImageViewerProps = Omit<ImageViewerProps, 'image' | 'renderFooter'> & {
     images?: string[];
     defaultIndex?: number;
     onIndexChange?: (index: number) => void;
+    renderFooter?: (image: string, index: number) => React.ReactNode;
 };
-export declare const MultiImageViewer: React.ForwardRefExoticComponent<Omit<ImageViewerProps, "image"> & {
+export declare const MultiImageViewer: React.ForwardRefExoticComponent<Omit<ImageViewerProps, "image" | "renderFooter"> & {
     images?: string[] | undefined;
     defaultIndex?: number | undefined;
     onIndexChange?: ((index: number) => void) | undefined;
+    renderFooter?: ((image: string, index: number) => React.ReactNode) | undefined;
 } & React.RefAttributes<SlidesRef>>;