antd-mobile 5.10.4 → 5.11.2

package/cjs/components/calendar/calendar.css

@@ -50,10 +50,10 @@
 .adm-calendar-cell.adm-calendar-cell-today {
   color: var(--adm-color-primary);
 }
-.adm-calendar-cell.adm-calendar-cell-out {
+.adm-calendar-cell.adm-calendar-cell-disabled {
   color: var(--adm-color-light);
 }
-.adm-calendar-cell.adm-calendar-cell-out .adm-calendar-cell-bottom {
+.adm-calendar-cell.adm-calendar-cell-disabled .adm-calendar-cell-bottom {
   color: var(--adm-color-light);
 }
 .adm-calendar-cell.adm-calendar-cell-selected.adm-calendar-cell.adm-calendar-cell-selected {

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

@@ -13,6 +13,8 @@ export declare type CalendarProps = {
     weekStartsOn?: 'Monday' | 'Sunday';
     renderLabel?: (date: Date) => string | null | undefined;
     allowClear?: boolean;
+    max?: Date;
+    min?: Date;
 } & ({
     selectionMode?: undefined;
     value?: undefined;

package/cjs/components/calendar/calendar.js

@@ -122,6 +122,9 @@ const Calendar = (0, _react.forwardRef)((p, ref) => {
     }
   }, _react.default.createElement(_arrowLeftDouble.ArrowLeftDouble, null)));
 
+  const maxDay = (0, _react.useMemo)(() => props.max && (0, _dayjs.default)(props.max), [props.max]);
+  const minDay = (0, _react.useMemo)(() => props.min && (0, _dayjs.default)(props.min), [props.min]);
+
   function renderCells() {
     var _a;
 
@@ -146,9 +149,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');
       cells.push(_react.default.createElement("div", {
         key: d.valueOf(),
-        className: (0, _classnames.default)(`${classPrefix}-cell`, inThisMonth ? `${classPrefix}-cell-in` : `${classPrefix}-cell-out`, inThisMonth && {
+        className: (0, _classnames.default)(`${classPrefix}-cell`, disabled && `${classPrefix}-cell-disabled`, inThisMonth && {
           [`${classPrefix}-cell-today`]: d.isSame(today, 'day'),
           [`${classPrefix}-cell-selected`]: isSelect,
           [`${classPrefix}-cell-selected-begin`]: isBegin,
@@ -156,6 +160,7 @@ const Calendar = (0, _react.forwardRef)((p, ref) => {
         }),
         onClick: () => {
           if (!props.selectionMode) return;
+          if (disabled) return;
           const date = d.toDate();
 
           if (!inThisMonth) {

package/cjs/components/cascade-picker/cascade-picker-utils.d.ts

@@ -1,3 +1,3 @@
-import { PickerColumn } from '../picker-view';
+import { PickerColumn, PickerValue } from '../picker-view';
 import { CascadePickerOption } from './cascade-picker';
-export declare function generateCascadePickerColumns(value: string[], options: CascadePickerOption[], depth: number, subOptionsRecord: Record<string, CascadePickerOption[]>): PickerColumn[];
+export declare function useColumnsFn(options: CascadePickerOption[]): (selected: PickerValue[]) => PickerColumn[];

package/cjs/components/cascade-picker/cascade-picker-utils.js

@@ -3,28 +3,49 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.generateCascadePickerColumns = generateCascadePickerColumns;
+exports.useColumnsFn = useColumnsFn;
 
-function generateCascadePickerColumns(value, options, depth, subOptionsRecord) {
-  const columns = [];
-  columns.push(options.map(option => ({
-    label: option.label,
-    value: option.value
-  })));
+var _react = require("react");
 
-  for (let i = 0; i < depth - 1; i++) {
-    const x = value[i];
-    const subOptions = subOptionsRecord[x];
+function useColumnsFn(options) {
+  const depth = (0, _react.useMemo)(() => {
+    let depth = 0;
 
-    if (!subOptions) {
-      columns.push([]);
-    } else {
-      columns.push(subOptions.map(option => ({
+    function traverse(options, currentDepth) {
+      if (currentDepth > depth) depth = currentDepth;
+      const nextDepth = currentDepth + 1;
+      options.forEach(option => {
+        if (option.children) {
+          traverse(option.children, nextDepth);
+        }
+      });
+    }
+
+    traverse(options, 1);
+    return depth;
+  }, [options]);
+  return selected => {
+    const columns = [];
+    let currentOptions = options;
+    let i = 0;
+
+    while (true) {
+      columns.push(currentOptions.map(option => ({
         label: option.label,
         value: option.value
       })));
+      const x = selected[i];
+      const targetOptions = currentOptions.find(option => option.value === x);
+      if (!targetOptions || !targetOptions.children) break;
+      currentOptions = targetOptions.children;
+      i++;
+    }
+
+    while (i < depth - 1) {
+      columns.push([]);
+      i++;
     }
-  }
 
-  return columns;
+    return columns;
+  };
 }

package/cjs/components/cascade-picker/cascade-picker.js

@@ -11,8 +11,6 @@ var _react = _interopRequireDefault(require("react"));
 
 var _picker = _interopRequireDefault(require("../picker"));
 
-var _useCascadePickerOptions = require("./use-cascade-picker-options");
-
 var _cascadePickerUtils = require("./cascade-picker-utils");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -22,12 +20,9 @@ const CascadePicker = props => {
     options
   } = props,
         pickerProps = (0, _tslib.__rest)(props, ["options"]);
-  const {
-    depth,
-    subOptionsRecord
-  } = (0, _useCascadePickerOptions.useCascadePickerOptions)(options);
+  const columnsFn = (0, _cascadePickerUtils.useColumnsFn)(options);
   return _react.default.createElement(_picker.default, Object.assign({}, pickerProps, {
-    columns: selected => (0, _cascadePickerUtils.generateCascadePickerColumns)(selected, options, depth, subOptionsRecord)
+    columns: columnsFn
   }));
 };
 

package/cjs/components/cascade-picker-view/cascade-picker-view.js

@@ -11,8 +11,6 @@ var _react = _interopRequireDefault(require("react"));
 
 var _pickerView = _interopRequireDefault(require("../picker-view"));
 
-var _useCascadePickerOptions = require("../cascade-picker/use-cascade-picker-options");
-
 var _cascadePickerUtils = require("../cascade-picker/cascade-picker-utils");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -22,12 +20,9 @@ const CascadePickerView = props => {
     options
   } = props,
         pickerProps = (0, _tslib.__rest)(props, ["options"]);
-  const {
-    depth,
-    subOptionsRecord
-  } = (0, _useCascadePickerOptions.useCascadePickerOptions)(options);
+  const columnsFn = (0, _cascadePickerUtils.useColumnsFn)(options);
   return _react.default.createElement(_pickerView.default, Object.assign({}, pickerProps, {
-    columns: selected => (0, _cascadePickerUtils.generateCascadePickerColumns)(selected, options, depth, subOptionsRecord)
+    columns: columnsFn
   }));
 };
 

package/cjs/components/date-picker/date-picker.js

@@ -69,6 +69,7 @@ const DatePicker = p => {
     value: pickerValue,
     onCancel: props.onCancel,
     onClose: props.onClose,
+    closeOnMaskClick: props.closeOnMaskClick,
     visible: props.visible,
     confirmText: props.confirmText,
     cancelText: props.cancelText,

package/cjs/components/dialog/dialog-action-button.js

@@ -5,9 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.DialogActionButton = void 0;
 
-var _tslib = require("tslib");
-
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
@@ -17,34 +15,13 @@ var _nativeProps = require("../../utils/native-props");
 
 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; }
-
 const DialogActionButton = props => {
   const {
     action
   } = props;
-  const [loading, setLoading] = (0, _react.useState)(false);
-
-  function handleClick() {
-    return (0, _tslib.__awaiter)(this, void 0, void 0, function* () {
-      setLoading(true);
-
-      try {
-        const promise = props.onAction();
-        yield promise;
-        setLoading(false);
-      } catch (e) {
-        setLoading(false);
-        throw e;
-      }
-    });
-  }
-
   return (0, _nativeProps.withNativeProps)(props.action, _react.default.createElement(_button.default, {
     key: action.key,
-    onClick: handleClick,
+    onClick: props.onAction,
     className: (0, _classnames.default)('adm-dialog-button', {
       'adm-dialog-button-bold': action.bold
     }),
@@ -52,7 +29,7 @@ const DialogActionButton = props => {
     shape: 'rectangular',
     block: true,
     color: action.danger ? 'danger' : 'primary',
-    loading: loading,
+    loading: 'auto',
     disabled: action.disabled
   }, action.text));
 };

package/cjs/components/floating-panel/floating-panel.js

@@ -57,7 +57,7 @@ const FloatingPanel = (0, _react.forwardRef)((p, ref) => {
       tension: 300
     },
     onChange: result => {
-      onHeightChange(result.value.y, y.isAnimating);
+      onHeightChange(-result.value.y, y.isAnimating);
     }
   }));
   (0, _react2.useDrag)(state => {

package/cjs/components/form/context.d.ts

@@ -6,6 +6,7 @@ export declare type FormContextType = {
     hasFeedback: boolean;
     layout: FormLayout;
     requiredMarkStyle: 'asterisk' | 'text-required' | 'text-optional';
+    disabled: boolean;
 };
 export declare const defaultFormContext: FormContextType;
 export declare const FormContext: React.Context<FormContextType>;

package/cjs/components/form/context.js

@@ -13,7 +13,8 @@ const defaultFormContext = {
   name: undefined,
   hasFeedback: true,
   layout: 'vertical',
-  requiredMarkStyle: 'asterisk'
+  requiredMarkStyle: 'asterisk',
+  disabled: false
 };
 exports.defaultFormContext = defaultFormContext;
 

package/cjs/components/form/form-item.css

@@ -53,7 +53,7 @@
 }
 .adm-form-item.adm-form-item-horizontal.adm-list-item {
   --align-items: stretch;
-  --prefix-width: 6em;
+  --prefix-width: 6.8em;
 }
 .adm-form-item.adm-form-item-horizontal .adm-list-item-content-prefix {
   padding-top: 12px;

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

@@ -45,6 +45,8 @@ const MemoInput = _react.default.memo(({
 }) => children, (prev, next) => prev.value === next.value && prev.update === next.update);
 
 const FormItemLayout = props => {
+  var _a;
+
   const {
     className,
     style,
@@ -52,7 +54,6 @@ const FormItemLayout = props => {
     label,
     help,
     required,
-    disabled,
     children,
     htmlFor,
     hidden,
@@ -65,6 +66,7 @@ const FormItemLayout = props => {
   } = (0, _configProvider.useConfig)();
   const hasFeedback = props.hasFeedback !== undefined ? props.hasFeedback : context.hasFeedback;
   const layout = props.layout || context.layout;
+  const disabled = (_a = props.disabled) !== null && _a !== void 0 ? _a : context.disabled;
 
   const requiredMark = (() => {
     const {

package/cjs/components/form/form.d.ts

@@ -3,15 +3,12 @@ import { NativeProps } from '../../utils/native-props';
 import { ListProps } from '../list';
 import type { FormProps as RcFormProps, FormInstance as RCFormInstance } from 'rc-field-form';
 import { FormContextType } from './context';
-import type { FormLayout } from '.';
 export declare type FormInstance = Pick<RCFormInstance, 'getFieldValue' | 'getFieldsValue' | 'getFieldError' | 'getFieldsError' | 'isFieldTouched' | 'isFieldsTouched' | 'resetFields' | 'setFields' | 'setFieldsValue' | 'submit' | 'validateFields'>;
 export declare type FormProps = Pick<RcFormProps, 'form' | 'initialValues' | 'name' | 'preserve' | 'validateMessages' | 'validateTrigger' | 'onFieldsChange' | 'onFinish' | 'onFinishFailed' | 'onValuesChange' | 'children'> & NativeProps<'--border-inner' | '--border-top' | '--border-bottom'> & Partial<FormContextType> & {
     footer?: ReactNode;
-    layout?: FormLayout;
     mode?: ListProps['mode'];
 };
 export declare const Form: React.ForwardRefExoticComponent<Pick<RcFormProps<any>, "children" | "form" | "name" | "initialValues" | "preserve" | "validateMessages" | "validateTrigger" | "onFieldsChange" | "onFinish" | "onFinishFailed" | "onValuesChange"> & NativeProps<"--border-inner" | "--border-top" | "--border-bottom"> & Partial<FormContextType> & {
     footer?: ReactNode;
-    layout?: FormLayout | undefined;
     mode?: ListProps['mode'];
 } & React.RefAttributes<FormInstance>>;

package/cjs/components/form/form.js

@@ -47,9 +47,10 @@ const Form = (0, _react.forwardRef)((p, ref) => {
     layout,
     footer,
     mode,
+    disabled,
     requiredMarkStyle
   } = props,
-        formProps = (0, _tslib.__rest)(props, ["className", "style", "hasFeedback", "children", "layout", "footer", "mode", "requiredMarkStyle"]);
+        formProps = (0, _tslib.__rest)(props, ["className", "style", "hasFeedback", "children", "layout", "footer", "mode", "disabled", "requiredMarkStyle"]);
   const {
     locale
   } = (0, _configProvider.useConfig)();
@@ -99,7 +100,8 @@ const Form = (0, _react.forwardRef)((p, ref) => {
       name: formProps.name,
       hasFeedback,
       layout,
-      requiredMarkStyle
+      requiredMarkStyle,
+      disabled: disabled
     }
   }, lists), footer && _react.default.createElement("div", {
     className: `${classPrefix}-footer`

package/cjs/components/form/index.css

@@ -75,7 +75,7 @@
 }
 .adm-form-item.adm-form-item-horizontal.adm-list-item {
   --align-items: stretch;
-  --prefix-width: 6em;
+  --prefix-width: 6.8em;
 }
 .adm-form-item.adm-form-item-horizontal .adm-list-item-content-prefix {
   padding-top: 12px;

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import './index.less';
-import { useForm } from 'rc-field-form';
+import { useWatch, useForm } from 'rc-field-form';
 export declare type FormLayout = 'vertical' | 'horizontal';
 export type { FormProps, FormInstance } from './form';
 export type { FormItemProps } from './form-item';
@@ -9,7 +9,6 @@ export type { ValidateMessages, FieldData, NamePath, } from 'rc-field-form/es/in
 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"> & import("../../utils/native-props").NativeProps<"--border-inner" | "--border-top" | "--border-bottom"> & Partial<import("./context").FormContextType> & {
     footer?: import("react").ReactNode;
-    layout?: FormLayout | undefined;
     mode?: "default" | "card" | undefined;
 } & import("react").RefAttributes<import("./form").FormInstance>> & {
     Item: import("react").FC<import("./form-item").FormItemProps>;
@@ -19,5 +18,6 @@ declare const _default: import("react").ForwardRefExoticComponent<Pick<import("r
     }>;
     Array: import("react").FC<import("./form-array").FormArrayProps>;
     useForm: typeof useForm;
+    useWatch: typeof useWatch;
 };
 export default _default;

package/cjs/components/form/index.js

@@ -26,7 +26,8 @@ var _default = (0, _attachPropertiesToComponent.attachPropertiesToComponent)(_fo
   Subscribe: _formSubscribe.FormSubscribe,
   Header: _header.Header,
   Array: _formArray.FormArray,
-  useForm: _rcFieldForm.useForm
+  useForm: _rcFieldForm.useForm,
+  useWatch: _rcFieldForm.useWatch
 });
 
 exports.default = _default;

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

@@ -25,6 +25,8 @@ var _space = _interopRequireDefault(require("../space"));
 
 var _nativeProps = require("../../utils/native-props");
 
+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); }
@@ -46,6 +48,9 @@ const defaultProps = {
 };
 
 const ImageUploader = p => {
+  const {
+    locale
+  } = (0, _configProvider.useConfig)();
   const props = (0, _withDefaultProps.mergeProps)(defaultProps, p);
   const [value, setValue] = (0, _usePropsValue.usePropsValue)(props);
   const updateValue = (0, _ahooks.useMemoizedFn)(updater => {
@@ -218,7 +223,8 @@ const ImageUploader = p => {
     className: `${classPrefix}-upload-button-wrap`
   }, props.children ? props.children : _react.default.createElement("span", {
     className: `${classPrefix}-cell ${classPrefix}-upload-button`,
-    role: 'button'
+    role: 'button',
+    "aria-label": locale.ImageUploader.upload
   }, _react.default.createElement("span", {
     className: `${classPrefix}-upload-button-icon`
   }, _react.default.createElement(_antdMobileIcons.AddOutline, null))), !props.disableUpload && _react.default.createElement("input", {
@@ -227,7 +233,8 @@ const ImageUploader = p => {
     multiple: props.multiple,
     type: 'file',
     className: `${classPrefix}-input`,
-    onChange: onChange
+    onChange: onChange,
+    "aria-hidden": true
   })))));
 };
 

package/cjs/components/index-bar/panel.d.ts

@@ -4,5 +4,6 @@ export declare type IndexBarPanelProps = {
     index: string;
     title?: ReactNode;
     brief?: ReactNode;
+    children?: ReactNode;
 } & NativeProps;
 export declare const Panel: FC<IndexBarPanelProps>;

package/cjs/components/input/input.css

@@ -58,6 +58,9 @@
 .adm-input-element::-webkit-search-decoration {
   display: none;
 }
+.adm-input-element:disabled {
+  opacity: 1;
+}
 .adm-input-element[type='date'],
 .adm-input-element[type='time'],
 .adm-input-element[type='datetime-local'] {

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

@@ -9,6 +9,7 @@ export declare type InputProps = Pick<NativeInputProps, 'maxLength' | 'minLength
     disabled?: boolean;
     readOnly?: boolean;
     clearable?: boolean;
+    onlyShowClearWhenFocus?: boolean;
     onClear?: () => void;
     id?: string;
     onEnterPress?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
@@ -30,6 +31,7 @@ export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProp
     disabled?: boolean | undefined;
     readOnly?: boolean | undefined;
     clearable?: boolean | undefined;
+    onlyShowClearWhenFocus?: boolean | undefined;
     onClear?: (() => void) | undefined;
     id?: string | undefined;
     onEnterPress?: ((e: React.KeyboardEvent<HTMLInputElement>) => void) | undefined;

package/cjs/components/input/input.js

@@ -29,7 +29,8 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 const classPrefix = `adm-input`;
 const defaultProps = {
-  defaultValue: ''
+  defaultValue: '',
+  onlyShowClearWhenFocus: true
 };
 const Input = (0, _react.forwardRef)((p, ref) => {
   const props = (0, _withDefaultProps.mergeProps)(defaultProps, p);
@@ -91,6 +92,16 @@ const Input = (0, _react.forwardRef)((p, ref) => {
     }
   }
 
+  const shouldShowClear = (() => {
+    if (!props.clearable || !value || props.readOnly) return false;
+
+    if (props.onlyShowClearWhenFocus) {
+      return hasFocus;
+    } else {
+      return true;
+    }
+  })();
+
   return (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {
     className: (0, _classnames.default)(`${classPrefix}`, props.disabled && `${classPrefix}-disabled`)
   }, _react.default.createElement("input", {
@@ -133,7 +144,7 @@ const Input = (0, _react.forwardRef)((p, ref) => {
     onCompositionStart: props.onCompositionStart,
     onCompositionEnd: props.onCompositionEnd,
     onClick: props.onClick
-  }), props.clearable && !!value && !props.readOnly && hasFocus && _react.default.createElement("div", {
+  }), shouldShowClear && _react.default.createElement("div", {
     className: `${classPrefix}-clear`,
     onMouseDown: e => {
       e.preventDefault();

package/cjs/components/list/list-item.js

@@ -13,6 +13,8 @@ var _antdMobileIcons = require("antd-mobile-icons");
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
+var _isNodeWithContent = require("../../utils/is-node-with-content");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const classPrefix = `adm-list-item`;
@@ -25,17 +27,17 @@ const ListItem = props => {
 
   const content = _react.default.createElement("div", {
     className: `${classPrefix}-content`
-  }, props.prefix && _react.default.createElement("div", {
+  }, (0, _isNodeWithContent.isNodeWithContent)(props.prefix) && _react.default.createElement("div", {
     className: `${classPrefix}-content-prefix`
   }, props.prefix), _react.default.createElement("div", {
     className: `${classPrefix}-content-main`
-  }, props.title && _react.default.createElement("div", {
+  }, (0, _isNodeWithContent.isNodeWithContent)(props.title) && _react.default.createElement("div", {
     className: `${classPrefix}-title`
-  }, props.title), props.children, props.description && _react.default.createElement("div", {
+  }, props.title), props.children, (0, _isNodeWithContent.isNodeWithContent)(props.description) && _react.default.createElement("div", {
     className: `${classPrefix}-description`
-  }, props.description)), props.extra && _react.default.createElement("div", {
+  }, props.description)), (0, _isNodeWithContent.isNodeWithContent)(props.extra) && _react.default.createElement("div", {
     className: `${classPrefix}-content-extra`
-  }, props.extra), arrow && _react.default.createElement("div", {
+  }, props.extra), (0, _isNodeWithContent.isNodeWithContent)(arrow) && _react.default.createElement("div", {
     className: `${classPrefix}-content-arrow`
   }, arrow === true ? _react.default.createElement(_antdMobileIcons.RightOutline, null) : arrow));
 

package/cjs/components/modal/modal-action-button.js

@@ -5,9 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.ModalActionButton = void 0;
 
-var _tslib = require("tslib");
-
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
@@ -17,34 +15,13 @@ var _nativeProps = require("../../utils/native-props");
 
 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; }
-
 const ModalActionButton = props => {
   const {
     action
   } = props;
-  const [loading, setLoading] = (0, _react.useState)(false);
-
-  function handleClick() {
-    return (0, _tslib.__awaiter)(this, void 0, void 0, function* () {
-      setLoading(true);
-
-      try {
-        const promise = props.onAction();
-        yield promise;
-        setLoading(false);
-      } catch (e) {
-        setLoading(false);
-        throw e;
-      }
-    });
-  }
-
   return (0, _nativeProps.withNativeProps)(props.action, _react.default.createElement(_button.default, {
     key: action.key,
-    onClick: handleClick,
+    onClick: props.onAction,
     className: (0, _classnames.default)('adm-modal-button', {
       'adm-modal-button-primary': props.action.primary
     }),
@@ -52,7 +29,7 @@ const ModalActionButton = props => {
     size: props.action.primary ? 'large' : 'middle',
     block: true,
     color: action.danger ? 'danger' : 'primary',
-    loading: loading,
+    loading: 'auto',
     disabled: action.disabled
   }, action.text));
 };

package/cjs/components/search-bar/search-bar.d.ts

@@ -8,6 +8,7 @@ export declare type SearchBarProps = Pick<InputProps, 'onFocus' | 'onBlur' | 'on
     maxLength?: number;
     placeholder?: string;
     clearable?: boolean;
+    onlyShowClearWhenFocus?: boolean;
     showCancelButton?: boolean | ((focus: boolean, value: string) => boolean);
     cancelText?: string;
     icon?: ReactNode;
@@ -22,6 +23,7 @@ export declare const SearchBar: React.ForwardRefExoticComponent<Pick<InputProps,
     maxLength?: number | undefined;
     placeholder?: string | undefined;
     clearable?: boolean | undefined;
+    onlyShowClearWhenFocus?: boolean | undefined;
     showCancelButton?: boolean | ((focus: boolean, value: string) => boolean) | undefined;
     cancelText?: string | undefined;
     icon?: ReactNode;

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

@@ -32,6 +32,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 const classPrefix = `adm-search-bar`;
 const defaultProps = {
   clearable: true,
+  onlyShowClearWhenFocus: false,
   showCancelButton: false,
   defaultValue: '',
   clearOnCancel: true,
@@ -123,6 +124,7 @@ const SearchBar = (0, _react.forwardRef)((p, ref) => {
     maxLength: props.maxLength,
     placeholder: props.placeholder,
     clearable: props.clearable,
+    onlyShowClearWhenFocus: props.onlyShowClearWhenFocus,
     onFocus: e => {
       var _a;
 

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

@@ -57,7 +57,7 @@ const TextArea = (0, _react.forwardRef)((p, ref) => {
       (_a = nativeTextAreaRef.current) === null || _a === void 0 ? void 0 : _a.blur();
     }
   }));
-  (0, _react.useEffect)(() => {
+  (0, _react.useLayoutEffect)(() => {
     if (!autoSize) return;
     const textArea = nativeTextAreaRef.current;
     if (!textArea) return;

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

@@ -105,7 +105,8 @@ const VirtualInput = (0, _react.forwardRef)((p, ref) => {
 
       (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.blur();
       (_c = (_b = keyboard.props).onClose) === null || _c === void 0 ? void 0 : _c.call(_b);
-    }
+    },
+    getContainer: null
   });
 
   return (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {