antd-mobile 5.10.0 → 5.10.3

package/2x/es/components/auto-center/auto-center.d.ts

@@ -1,4 +1,6 @@
-import { FC } from 'react';
+import React, { FC } from 'react';
 import { NativeProps } from '../../utils/native-props';
-export declare type AutoCenterProps = NativeProps;
+export declare type AutoCenterProps = {
+    children?: React.ReactNode;
+} & NativeProps;
 export declare const AutoCenter: FC<AutoCenterProps>;

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

@@ -5,5 +5,6 @@ export declare type BadgeProps = {
     content?: React.ReactNode | typeof dot;
     color?: string;
     bordered?: boolean;
+    children?: React.ReactNode;
 } & NativeProps<'--right' | '--top' | '--color'>;
 export declare const Badge: FC<BadgeProps>;

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

@@ -63,7 +63,7 @@ export const Calendar = forwardRef((p, ref) => {
         page = pageOrPageGenerator;
       }
 
-      setCurrent(dayjs().year(page.year).month(page.month - 1));
+      setCurrent(dayjs().year(page.year).month(page.month - 1).date(1));
     },
     jumpToToday: () => {
       setCurrent(dayjs().date(1));

package/2x/es/components/capsule-tabs/capsule-tabs.d.ts

@@ -1,15 +1,17 @@
-import { FC, ReactNode } from 'react';
+import React, { FC, ReactNode } from 'react';
 import { NativeProps } from '../../utils/native-props';
 export declare type CapsuleTabProps = {
     title: ReactNode;
     disabled?: boolean;
     forceRender?: boolean;
     destroyOnClose?: boolean;
+    children?: ReactNode;
 } & NativeProps;
 export declare const CapsuleTab: FC<CapsuleTabProps>;
 export declare type CapsuleTabsProps = {
     activeKey?: string | null;
     defaultActiveKey?: string | null;
     onChange?: (key: string) => void;
+    children?: React.ReactNode;
 } & NativeProps;
 export declare const CapsuleTabs: FC<CapsuleTabsProps>;

package/2x/es/components/card/card.d.ts

@@ -10,5 +10,6 @@ export declare type CardProps = {
     onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
     onBodyClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
     onHeaderClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    children?: React.ReactNode;
 } & NativeProps;
 export declare const Card: FC<CardProps>;

package/2x/es/components/check-list/check-list.d.ts

@@ -1,4 +1,4 @@
-import { FC, ReactNode } from 'react';
+import React, { FC, ReactNode } from 'react';
 import { NativeProps } from '../../utils/native-props';
 import { ListProps } from '../list';
 export declare type CheckListProps = Pick<ListProps, 'mode' | 'style'> & {
@@ -9,5 +9,6 @@ export declare type CheckListProps = Pick<ListProps, 'mode' | 'style'> & {
     activeIcon?: ReactNode;
     disabled?: boolean;
     readOnly?: boolean;
+    children?: React.ReactNode;
 } & NativeProps;
 export declare const CheckList: FC<CheckListProps>;

package/2x/es/components/checkbox/checkbox.d.ts

@@ -11,5 +11,6 @@ export declare type CheckboxProps = {
     block?: boolean;
     id?: string;
     icon?: (checked: boolean, indeterminate: boolean) => React.ReactNode;
+    children?: React.ReactNode;
 } & NativeProps<'--icon-size' | '--font-size' | '--gap'>;
 export declare const Checkbox: FC<CheckboxProps>;

package/2x/es/components/checkbox/group.d.ts

@@ -1,9 +1,10 @@
-import { FC } from 'react';
+import React, { FC } from 'react';
 import { CheckboxValue } from '.';
 export interface CheckboxGroupProps {
     value?: CheckboxValue[];
     onChange?: (val: CheckboxValue[]) => void;
     defaultValue?: CheckboxValue[];
     disabled?: boolean;
+    children?: React.ReactNode;
 }
 export declare const Group: FC<CheckboxGroupProps>;

package/2x/es/components/collapse/collapse.d.ts

@@ -8,6 +8,7 @@ export declare type CollapsePanelProps = {
     destroyOnClose?: boolean;
     onClick?: (event: React.MouseEvent<Element, MouseEvent>) => void;
     arrow?: React.ReactNode | ((active: boolean) => React.ReactNode);
+    children?: React.ReactNode;
 } & NativeProps;
 export declare const CollapsePanel: FC<CollapsePanelProps>;
 declare type ValueProps<T> = {
@@ -20,6 +21,8 @@ export declare type CollapseProps = (({
     accordion?: false;
 } & ValueProps<string[]>) | ({
     accordion: true;
-} & ValueProps<string | null>)) & NativeProps;
+} & ValueProps<string | null>)) & {
+    children?: React.ReactNode;
+} & NativeProps;
 export declare const Collapse: FC<CollapseProps>;
 export {};

package/2x/es/components/config-provider/config-provider.d.ts

@@ -1,7 +1,8 @@
-import { FC } from 'react';
+import React, { FC } from 'react';
 import { Locale } from '../../locales/base';
 declare type Config = {
     locale: Locale;
+    children?: React.ReactNode;
 };
 export declare const defaultConfigRef: {
     current: Config;

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

@@ -2,7 +2,7 @@ import { FC, ReactNode } from 'react';
 import type { PickerProps } from '../picker';
 import { NativeProps } from '../../utils/native-props';
 import type { Precision, DatePickerFilter } from './date-picker-utils';
-export declare type DatePickerProps = Pick<PickerProps, 'onCancel' | 'onClose' | 'closeOnMaskClick' | 'visible' | 'confirmText' | 'cancelText' | 'getContainer' | 'afterShow' | 'afterClose' | 'onClick' | 'title' | 'stopPropagation' | 'style'> & {
+export declare type DatePickerProps = Pick<PickerProps, 'onCancel' | 'onClose' | 'closeOnMaskClick' | 'visible' | 'confirmText' | 'cancelText' | 'getContainer' | 'afterShow' | 'afterClose' | 'onClick' | 'title' | 'stopPropagation' | 'style' | 'mouseWheel'> & {
     value?: Date | null;
     defaultValue?: Date | null;
     onSelect?: (value: Date) => void;

package/2x/es/components/date-picker/date-picker.js

@@ -57,7 +57,8 @@ export const DatePicker = p => {
     afterClose: props.afterClose,
     onClick: props.onClick,
     title: props.title,
-    stopPropagation: props.stopPropagation
+    stopPropagation: props.stopPropagation,
+    mouseWheel: props.mouseWheel
   }, () => {
     var _a;
 

package/2x/es/components/date-picker-view/date-picker-view.d.ts

@@ -2,7 +2,7 @@ import { FC, ReactNode } from 'react';
 import type { PickerViewProps } from '../picker-view';
 import { NativeProps } from '../../utils/native-props';
 import type { Precision, DatePickerFilter } from '../date-picker/date-picker-utils';
-export declare type DatePickerViewProps = Pick<PickerViewProps, 'style'> & {
+export declare type DatePickerViewProps = Pick<PickerViewProps, 'style' | 'mouseWheel'> & {
     value?: Date;
     defaultValue?: Date;
     onChange?: (value: Date) => void;

package/2x/es/components/date-picker-view/date-picker-view.js

@@ -33,6 +33,7 @@ export const DatePickerView = p => {
   return withNativeProps(props, React.createElement(PickerView, {
     columns: selected => generateDatePickerColumns(selected, props.min, props.max, props.precision, props.renderLabel, props.filter),
     value: pickerValue,
+    mouseWheel: props.mouseWheel,
     onChange: onChange
   }));
 };

package/2x/es/components/divider/divider.d.ts

@@ -1,7 +1,8 @@
-import { FC } from 'react';
+import React, { FC } from 'react';
 import { NativeProps } from '../../utils/native-props';
 export declare type DividerProps = {
     contentPosition?: 'left' | 'right' | 'center';
     direction?: 'horizontal' | 'vertical';
+    children?: React.ReactNode;
 } & NativeProps;
 export declare const Divider: FC<DividerProps>;

package/2x/es/components/dropdown/item.d.ts

@@ -9,10 +9,11 @@ export declare type DropdownItemProps = {
     destroyOnClose?: boolean;
     onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
     arrow?: React.ReactNode;
+    children?: React.ReactNode;
 } & NativeProps;
 declare const Item: FC<DropdownItemProps>;
 export default Item;
 declare type DropdownItemChildrenWrapProps = {
     onClick?: () => void;
-} & Pick<DropdownItemProps, 'active' | 'forceRender' | 'destroyOnClose'>;
+} & Pick<DropdownItemProps, 'active' | 'forceRender' | 'destroyOnClose' | 'children'>;
 export declare const ItemChildrenWrap: FC<DropdownItemChildrenWrapProps>;

package/2x/es/components/error-block/error-block.d.ts

@@ -1,4 +1,4 @@
-import { FC, ReactElement, ReactNode } from 'react';
+import React, { FC, ReactElement, ReactNode } from 'react';
 import { NativeProps } from '../../utils/native-props';
 export declare type ErrorBlockProps = {
     status?: 'default' | 'disconnected' | 'empty' | 'busy';
@@ -6,5 +6,6 @@ export declare type ErrorBlockProps = {
     image?: string | ReactElement;
     description?: ReactNode;
     fullPage?: boolean;
+    children?: React.ReactNode;
 } & NativeProps<'--image-height' | '--image-height-full-page' | '--image-width' | '--image-width-full-page'>;
 export declare const ErrorBlock: FC<ErrorBlockProps>;

package/2x/es/components/floating-bubble/floating-bubble.d.ts

@@ -4,5 +4,6 @@ export declare type FloatingBubbleProps = {
     onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
     axis?: 'x' | 'y' | 'xy' | 'lock';
     magnetic?: 'x' | 'y';
+    children?: React.ReactNode;
 } & NativeProps<'--initial-position-left' | '--initial-position-right' | '--initial-position-top' | '--initial-position-bottom' | '--z-index' | '--edge-distance' | '--size' | '--border-radius' | '--background'>;
 export declare const FloatingBubble: FC<FloatingBubbleProps>;

package/2x/es/components/form/header.d.ts

@@ -1,2 +1,4 @@
-import { FC } from 'react';
-export declare const Header: FC;
+import { FC, ReactNode } from 'react';
+export declare const Header: FC<{
+    children?: ReactNode;
+}>;

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

@@ -14,7 +14,9 @@ declare const _default: import("react").ForwardRefExoticComponent<Pick<import("r
 } & import("react").RefAttributes<import("./form").FormInstance>> & {
     Item: import("react").FC<import("./form-item").FormItemProps>;
     Subscribe: import("react").VFC<import("./form-subscribe").FormSubscribeProps>;
-    Header: import("react").FC<{}>;
+    Header: import("react").FC<{
+        children?: import("react").ReactNode;
+    }>;
     Array: import("react").FC<import("./form-array").FormArrayProps>;
     useForm: typeof useForm;
 };

package/2x/es/components/grid/grid.d.ts

@@ -3,10 +3,12 @@ import { NativeProps } from '../../utils/native-props';
 export declare type GridProps = {
     columns: number;
     gap?: number | string | [number | string, number | string];
+    children?: React.ReactNode;
 } & NativeProps<'--gap' | '--gap-vertical' | '--gap-horizontal'>;
 export declare const Grid: FC<GridProps>;
 export declare type GridItemProps = {
     span?: number;
     onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    children?: React.ReactNode;
 } & NativeProps;
 export declare const GridItem: FC<GridItemProps>;

package/2x/es/components/image-uploader/image-uploader.d.ts

@@ -1,4 +1,4 @@
-import { FC, InputHTMLAttributes } from 'react';
+import React, { FC, InputHTMLAttributes } from 'react';
 import { NativeProps } from '../../utils/native-props';
 import type { ImageProps } from '../image';
 export declare type TaskStatus = 'pending' | 'fail';
@@ -27,5 +27,6 @@ export declare type ImageUploaderProps = {
     preview?: boolean;
     showFailed?: boolean;
     imageFit?: ImageProps['fit'];
+    children?: React.ReactNode;
 } & NativeProps<'--cell-size'>;
 export declare const ImageUploader: FC<ImageUploaderProps>;

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

@@ -90,6 +90,8 @@ export const ImageUploader = p => {
         file
       }));
       setTasks(prev => [...prev, ...newTasks]);
+      e.target.value = ''; // HACK: fix the same file doesn't trigger onChange
+
       yield Promise.all(newTasks.map(currentTask => __awaiter(this, void 0, void 0, function* () {
         try {
           const result = yield props.upload(currentTask.file);
@@ -123,7 +125,6 @@ export const ImageUploader = p => {
           throw e;
         }
       }))).catch(error => console.error(error));
-      e.target.value = ''; // HACK: fix the same file doesn't trigger onChange
     });
   }
 

package/2x/es/components/infinite-scroll/infinite-scroll.d.ts

@@ -1,8 +1,9 @@
-import { FC } from 'react';
+import React, { FC } from 'react';
 import { NativeProps } from '../../utils/native-props';
 export declare type InfiniteScrollProps = {
     loadMore: () => Promise<void>;
     hasMore: boolean;
     threshold?: number;
+    children?: React.ReactNode;
 } & NativeProps;
 export declare const InfiniteScroll: FC<InfiniteScrollProps>;

package/2x/es/components/infinite-scroll/infinite-scroll.js

@@ -4,6 +4,7 @@ import React, { useEffect, useRef, useState } from 'react';
 import { useLockFn, useMemoizedFn } from 'ahooks';
 import { withNativeProps } from '../../utils/native-props';
 import { getScrollParent } from '../../utils/get-scroll-parent';
+import { useConfig } from '../config-provider';
 import DotLoading from '../dot-loading';
 
 function isWindow(element) {
@@ -15,7 +16,10 @@ const classPrefix = `adm-infinite-scroll`;
 const InfiniteScrollContent = ({
   hasMore
 }) => {
-  return React.createElement(React.Fragment, null, hasMore ? React.createElement(React.Fragment, null, React.createElement("span", null, "\u52A0\u8F7D\u4E2D"), React.createElement(DotLoading, null)) : React.createElement("span", null, "\u6CA1\u6709\u66F4\u591A\u4E86"));
+  const {
+    locale
+  } = useConfig();
+  return React.createElement(React.Fragment, null, hasMore ? React.createElement(React.Fragment, null, React.createElement("span", null, locale.common.loading), React.createElement(DotLoading, null)) : React.createElement("span", null, locale.InfiniteScroll.noMore));
 };
 
 export const InfiniteScroll = p => {

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { NativeProps } from '../../utils/native-props';
 declare type NativeInputProps = React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
-export declare type InputProps = Pick<NativeInputProps, 'maxLength' | 'minLength' | 'autoComplete' | 'autoFocus' | 'pattern' | 'inputMode' | 'type' | 'onFocus' | 'onBlur' | 'autoCapitalize' | 'autoCorrect' | 'onKeyDown' | 'onKeyUp' | 'onCompositionStart' | 'onCompositionEnd'> & {
+export declare type InputProps = Pick<NativeInputProps, 'maxLength' | 'minLength' | 'autoComplete' | 'autoFocus' | 'pattern' | 'inputMode' | 'type' | 'onFocus' | 'onBlur' | 'autoCapitalize' | 'autoCorrect' | 'onKeyDown' | 'onKeyUp' | 'onCompositionStart' | 'onCompositionEnd' | 'onClick'> & {
     value?: string;
     defaultValue?: string;
     onChange?: (val: string) => void;
@@ -22,7 +22,7 @@ export declare type InputRef = {
     blur: () => void;
     nativeElement: HTMLInputElement | null;
 };
-export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProps, "pattern" | "type" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "onKeyDown" | "onKeyUp" | "autoCapitalize" | "autoCorrect" | "inputMode" | "autoComplete" | "autoFocus" | "maxLength" | "minLength"> & {
+export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProps, "pattern" | "onClick" | "type" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "onKeyDown" | "onKeyUp" | "autoCapitalize" | "autoCorrect" | "inputMode" | "autoComplete" | "autoFocus" | "maxLength" | "minLength"> & {
     value?: string | undefined;
     defaultValue?: string | undefined;
     onChange?: ((val: string) => void) | undefined;

package/2x/es/components/input/input.js

@@ -110,7 +110,8 @@ export const Input = forwardRef((p, ref) => {
     onKeyDown: handleKeydown,
     onKeyUp: props.onKeyUp,
     onCompositionStart: props.onCompositionStart,
-    onCompositionEnd: props.onCompositionEnd
+    onCompositionEnd: props.onCompositionEnd,
+    onClick: props.onClick
   }), props.clearable && !!value && !props.readOnly && hasFocus && React.createElement("div", {
     className: `${classPrefix}-clear`,
     onMouseDown: e => {

package/2x/es/components/jumbo-tabs/jumbo-tabs.d.ts

@@ -1,4 +1,4 @@
-import { FC, ReactNode } from 'react';
+import React, { FC, ReactNode } from 'react';
 import { NativeProps } from '../../utils/native-props';
 export declare type JumboTabProps = {
     title: ReactNode;
@@ -6,11 +6,13 @@ export declare type JumboTabProps = {
     disabled?: boolean;
     forceRender?: boolean;
     destroyOnClose?: boolean;
+    children?: React.ReactNode;
 } & NativeProps;
 export declare const JumboTab: FC<JumboTabProps>;
 export declare type JumboTabsProps = {
     activeKey?: string | null;
     defaultActiveKey?: string | null;
     onChange?: (key: string) => void;
+    children?: React.ReactNode;
 } & NativeProps;
 export declare const JumboTabs: FC<JumboTabsProps>;

package/2x/es/components/list/list.css

@@ -49,6 +49,7 @@
   display: block;
   padding-left: var(--padding-left);
   position: relative;
+  background-color: #ffffff;
 }
 
 .adm-list-item-title,

package/2x/es/components/list/list.d.ts

@@ -3,5 +3,6 @@ import { NativeProps } from '../../utils/native-props';
 export declare type ListProps = {
     header?: ReactNode;
     mode?: 'default' | 'card';
+    children?: ReactNode;
 } & NativeProps<'--header-font-size' | '--prefix-width' | '--prefix-padding-right' | '--align-items' | '--active-background-color' | '--border-inner' | '--border-top' | '--border-bottom' | '--padding-left' | '--padding-right' | '--font-size'>;
 export declare const List: FC<ListProps>;

package/2x/es/components/mask/mask.css

@@ -16,6 +16,7 @@
   z-index: 0;
   width: 100%;
   height: 100%;
+  pointer-events: none;
 }
 
 .adm-mask-content {

package/2x/es/components/mask/mask.d.ts

@@ -14,5 +14,6 @@ export declare type MaskProps = {
     afterShow?: () => void;
     afterClose?: () => void;
     stopPropagation?: PropagationEvent[];
+    children?: React.ReactNode;
 } & NativeProps<'--z-index'>;
 export declare const Mask: React.FC<MaskProps>;

package/2x/es/components/mask/mask.js

@@ -76,7 +76,14 @@ export const Mask = p => {
       opacity
     }, props.style), {
       display: active ? 'unset' : 'none'
-    })
+    }),
+    onClick: e => {
+      var _a;
+
+      if (e.target === e.currentTarget) {
+        (_a = props.onMaskClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
+      }
+    }
   }, props.onMaskClick && React.createElement("div", {
     className: `${classPrefix}-aria-button`,
     role: 'button',

package/2x/es/components/nav-bar/nav-bar.d.ts

@@ -1,4 +1,4 @@
-import { FC, ReactNode } from 'react';
+import React, { FC, ReactNode } from 'react';
 import { NativeProps } from '../../utils/native-props';
 export declare type NavBarProps = {
     back?: string | null;
@@ -6,5 +6,6 @@ export declare type NavBarProps = {
     left?: ReactNode;
     right?: ReactNode;
     onBack?: () => void;
+    children?: React.ReactNode;
 } & NativeProps<'--height' | '--border-bottom'>;
 export declare const NavBar: FC<NavBarProps>;

package/2x/es/components/picker/picker.d.ts

@@ -17,5 +17,6 @@ export declare type PickerProps = {
     cancelText?: ReactNode;
     children?: (items: (PickerColumnItem | null)[]) => ReactNode;
     renderLabel?: (item: PickerColumnItem) => ReactNode;
+    mouseWheel?: boolean;
 } & Pick<PopupProps, 'getContainer' | 'afterShow' | 'afterClose' | 'onClick' | 'stopPropagation'> & NativeProps<'--header-button-font-size' | '--title-font-size' | '--item-font-size' | '--item-height'>;
 export declare const Picker: React.NamedExoticComponent<PickerProps>;

package/2x/es/components/picker/picker.js

@@ -82,6 +82,7 @@ export const Picker = memo(p => {
     columns: props.columns,
     renderLabel: props.renderLabel,
     value: innerValue,
+    mouseWheel: props.mouseWheel,
     onChange: onChange
   }))));
   const popupElement = React.createElement(Popup, {

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

@@ -16,6 +16,7 @@ export declare type PickerViewProps = {
     columns: PickerColumn[] | ((value: PickerValue[]) => PickerColumn[]);
     value?: PickerValue[];
     defaultValue?: PickerValue[];
+    mouseWheel?: boolean;
     onChange?: (value: PickerValue[], extend: PickerValueExtend) => void;
 } & Pick<PickerProps, 'renderLabel'> & NativeProps<'--height' | '--item-height' | '--item-font-size'>;
 export declare const PickerView: React.NamedExoticComponent<PickerViewProps>;

package/2x/es/components/picker-view/picker-view.js

@@ -8,7 +8,8 @@ import { defaultRenderLabel } from '../picker/picker-utils';
 const classPrefix = `adm-picker-view`;
 const defaultProps = {
   defaultValue: [],
-  renderLabel: defaultRenderLabel
+  renderLabel: defaultRenderLabel,
+  mouseWheel: false
 };
 export const PickerView = memo(p => {
   const props = mergeProps(defaultProps, p);
@@ -58,7 +59,8 @@ export const PickerView = memo(p => {
     column: column,
     value: innerValue[index],
     onSelect: handleSelect,
-    renderLabel: props.renderLabel
+    renderLabel: props.renderLabel,
+    mouseWheel: props.mouseWheel
   })), React.createElement("div", {
     className: `${classPrefix}-mask`
   }, React.createElement("div", {

package/2x/es/components/picker-view/wheel.d.ts

@@ -6,6 +6,7 @@ declare type Props = {
     value: PickerValue;
     onSelect: (value: PickerValue, index: number) => void;
     renderLabel: (item: PickerColumnItem) => ReactNode;
+    mouseWheel: boolean;
 };
 export declare const Wheel: React.NamedExoticComponent<Props>;
 export {};

package/2x/es/components/picker-view/wheel.js

@@ -1,11 +1,12 @@
 import React, { memo, useRef } from 'react';
 import { useSpring, animated } from '@react-spring/web';
-import { useDrag } from '@use-gesture/react';
+import { useDrag, useWheel } from '@use-gesture/react';
 import { rubberbandIfOutOfBounds } from '../../utils/rubberband';
 import { bound } from '../../utils/bound';
 import isEqual from 'lodash/isEqual';
 import { useIsomorphicLayoutEffect } from 'ahooks';
 import { measureCSSLength } from '../../utils/measure-css-length';
+import { supportsPassive } from '../../utils/supports-passive';
 const classPrefix = `adm-picker-view`;
 export const Wheel = memo(props => {
   const {
@@ -71,7 +72,7 @@ export const Wheel = memo(props => {
     onSelect(item.value);
   }
 
-  const bind = useDrag(state => {
+  const handleDrag = state => {
     draggingRef.current = true;
     const min = -((column.length - 1) * itemHeight.current);
     const max = 0;
@@ -87,13 +88,31 @@ export const Wheel = memo(props => {
         y: rubberbandIfOutOfBounds(position, min, max, itemHeight.current * 50, 0.2)
       });
     }
+  };
+
+  useDrag(state => {
+    state.event.stopPropagation();
+    handleDrag(state);
   }, {
     axis: 'y',
     from: () => [0, y.get()],
     filterTaps: true,
     pointer: {
       touch: true
-    }
+    },
+    target: rootRef
+  });
+  useWheel(state => {
+    state.event.stopPropagation();
+    handleDrag(state);
+  }, {
+    axis: 'y',
+    from: () => [0, y.get()],
+    preventDefault: true,
+    target: props.mouseWheel ? rootRef : undefined,
+    eventOptions: supportsPassive ? {
+      passive: false
+    } : false
   });
   let selectedIndex = null;
 
@@ -130,10 +149,10 @@ export const Wheel = memo(props => {
     }, "-")));
   }
 
-  return React.createElement("div", Object.assign({
+  return React.createElement("div", {
     ref: rootRef,
     className: `${classPrefix}-column`
-  }, bind()), React.createElement(animated.div, {
+  }, React.createElement(animated.div, {
     style: {
       translateY: y
     },

package/2x/es/components/popover/wrapper.d.ts

@@ -1,5 +1,7 @@
 import React from 'react';
-export declare class Wrapper extends React.Component<{}, {}> {
+export declare class Wrapper extends React.Component<{
+    children?: React.ReactNode;
+}, {}> {
     element: Element | null;
     componentDidMount(): void;
     componentDidUpdate(): void;

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

@@ -18,5 +18,6 @@ export declare type PopupProps = {
     maskStyle?: React.CSSProperties;
     onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
     stopPropagation?: PropagationEvent[];
+    children?: React.ReactNode;
 } & NativeProps<'--z-index'>;
 export declare const Popup: FC<PopupProps>;

package/2x/es/components/pull-to-refresh/pull-to-refresh.d.ts

@@ -1,4 +1,4 @@
-import { FC, ReactNode } from 'react';
+import React, { FC, ReactNode } from 'react';
 export declare type PullStatus = 'pulling' | 'canRelease' | 'refreshing' | 'complete';
 export declare type PullToRefreshProps = {
     onRefresh?: () => Promise<any>;
@@ -11,6 +11,7 @@ export declare type PullToRefreshProps = {
     threshold?: number;
     disabled?: boolean;
     renderText?: (status: PullStatus) => ReactNode;
+    children?: React.ReactNode;
 };
 export declare const defaultProps: {
     pullingText: string;

package/2x/es/components/pull-to-refresh/pull-to-refresh.js

@@ -13,7 +13,7 @@ const classPrefix = `adm-pull-to-refresh`;
 export const defaultProps = {
   pullingText: '下拉刷新',
   canReleaseText: '释放立即刷新',
-  refreshingText: '加载中……',
+  refreshingText: '加载中...',
   completeText: '刷新成功',
   completeDelay: 500,
   disabled: false,
@@ -26,7 +26,7 @@ export const PullToRefresh = p => {
     locale
   } = useConfig();
   const props = mergeProps(defaultProps, {
-    refreshingText: locale.common.loading,
+    refreshingText: `${locale.common.loading}...`,
     pullingText: locale.PullToRefresh.pulling,
     canReleaseText: locale.PullToRefresh.canRelease,
     completeText: locale.PullToRefresh.complete

package/2x/es/components/radio/group.d.ts

@@ -1,9 +1,10 @@
-import { FC } from 'react';
+import React, { FC } from 'react';
 import { RadioValue } from '.';
 export interface RadioGroupProps {
     value?: RadioValue | null;
     onChange?: (val: RadioValue) => void;
     defaultValue?: RadioValue | null;
     disabled?: boolean;
+    children?: React.ReactNode;
 }
 export declare const Group: FC<RadioGroupProps>;

package/2x/es/components/radio/radio.d.ts

@@ -10,5 +10,6 @@ export declare type RadioProps = {
     block?: boolean;
     id?: string;
     icon?: (checked: boolean) => React.ReactNode;
+    children?: React.ReactNode;
 } & NativeProps<'--icon-size' | '--font-size' | '--gap'>;
 export declare const Radio: FC<RadioProps>;

package/2x/es/components/safe-area/safe-area.css

@@ -4,9 +4,9 @@
 }
 
 .adm-safe-area-position-top {
-  padding-top: env(safe-area-inset-top);
+  padding-top: calc(env(safe-area-inset-top) * var(--adm-hd));
 }
 
 .adm-safe-area-position-bottom {
-  padding-bottom: env(safe-area-inset-bottom);
+  padding-bottom: calc(env(safe-area-inset-bottom) * var(--adm-hd));
 }