antd-mobile 5.15.0 → 5.16.1

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

@@ -7,7 +7,11 @@ 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 { 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-bottom" | "--border-inner" | "--border-top"> & Partial<import("./context").FormContextType> & {
+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;
+    style?: (import("react").CSSProperties & Partial<Record<"--border-bottom" | "--border-inner" | "--border-top", string>>) | undefined;
+    tabIndex?: number | undefined;
+} & import("react").AriaAttributes & Partial<import("./context").FormContextType> & {
     footer?: import("react").ReactNode;
     mode?: "default" | "card" | undefined;
 } & import("react").RefAttributes<import("./form").FormInstance>> & {

package/es/components/index-bar/index-bar.d.ts

@@ -12,4 +12,8 @@ export declare const IndexBar: React.ForwardRefExoticComponent<{
     sticky?: boolean | undefined;
     onIndexChange?: ((index: string) => void) | undefined;
     children?: React.ReactNode;
-} & NativeProps<"--sticky-offset-top"> & React.RefAttributes<IndexBarRef>>;
+} & {
+    className?: string | undefined;
+    style?: (React.CSSProperties & Partial<Record<"--sticky-offset-top", string>>) | undefined;
+    tabIndex?: number | undefined;
+} & React.AriaAttributes & React.RefAttributes<IndexBarRef>>;

package/es/components/index-bar/index.d.ts

@@ -6,7 +6,11 @@ declare const _default: import("react").ForwardRefExoticComponent<{
     sticky?: boolean | undefined;
     onIndexChange?: ((index: string) => void) | undefined;
     children?: import("react").ReactNode;
-} & import("../../utils/native-props").NativeProps<"--sticky-offset-top"> & import("react").RefAttributes<import("./index-bar").IndexBarRef>> & {
+} & {
+    className?: string | undefined;
+    style?: (import("react").CSSProperties & Partial<Record<"--sticky-offset-top", string>>) | undefined;
+    tabIndex?: number | undefined;
+} & import("react").AriaAttributes & import("react").RefAttributes<import("./index-bar").IndexBarRef>> & {
     Panel: import("react").FC<import("./panel").IndexBarPanelProps>;
 };
 export default _default;

package/es/components/input/input.css

@@ -52,6 +52,9 @@
 .adm-input-element::-ms-clear {
   display: none;
 }
+.adm-input-element::-ms-reveal {
+  display: none;
+}
 .adm-input-element::-webkit-search-cancel-button {
   display: none;
 }

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

@@ -1,7 +1,10 @@
 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' | 'name' | 'onFocus' | 'onBlur' | 'autoCapitalize' | 'autoCorrect' | 'onKeyDown' | 'onKeyUp' | 'onCompositionStart' | 'onCompositionEnd' | 'onClick'> & {
+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'> & {
     value?: string;
     defaultValue?: string;
     onChange?: (val: string) => void;
@@ -16,14 +19,14 @@ export declare type InputProps = Pick<NativeInputProps, 'maxLength' | 'minLength
     enterKeyHint?: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
     min?: number;
     max?: number;
-} & NativeProps<'--font-size' | '--color' | '--placeholder-color' | '--text-align'>;
+} & NativeProps<'--font-size' | '--color' | '--placeholder-color' | '--text-align'> & AriaProps;
 export declare type InputRef = {
     clear: () => void;
     focus: () => void;
     blur: () => void;
     nativeElement: HTMLInputElement | null;
 };
-export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProps, "pattern" | "onClick" | "name" | "type" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "onKeyDown" | "onKeyUp" | "autoCapitalize" | "autoCorrect" | "inputMode" | "autoComplete" | "autoFocus" | "maxLength" | "minLength"> & {
+export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProps, "pattern" | "onClick" | "name" | "type" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "onKeyDown" | "onKeyUp" | "autoCapitalize" | "autoCorrect" | "inputMode" | "autoComplete" | "autoFocus" | "maxLength" | "minLength" | "step"> & {
     value?: string | undefined;
     defaultValue?: string | undefined;
     onChange?: ((val: string) => void) | undefined;
@@ -38,5 +41,9 @@ export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProp
     enterKeyHint?: "search" | "enter" | "done" | "go" | "next" | "previous" | "send" | undefined;
     min?: number | undefined;
     max?: number | undefined;
-} & NativeProps<"--color" | "--font-size" | "--placeholder-color" | "--text-align"> & React.RefAttributes<InputRef>>;
+} & {
+    className?: string | undefined;
+    style?: (React.CSSProperties & Partial<Record<"--color" | "--font-size" | "--placeholder-color" | "--text-align", string>>) | undefined;
+    tabIndex?: number | undefined;
+} & React.AriaAttributes & AriaProps & React.RefAttributes<InputRef>>;
 export {};

package/es/components/input/input.js

@@ -135,7 +135,11 @@ export const Input = forwardRef((p, ref) => {
       compositionStartRef.current = false;
       (_a = props.onCompositionEnd) === null || _a === void 0 ? void 0 : _a.call(props, e);
     },
-    onClick: props.onClick
+    onClick: props.onClick,
+    role: props.role,
+    "aria-valuenow": props['aria-valuenow'],
+    "aria-valuemax": props['aria-valuemax'],
+    "aria-valuemin": props['aria-valuemin']
   }), shouldShowClear && React.createElement("div", {
     className: `${classPrefix}-clear`,
     onMouseDown: e => {

package/es/components/list/index.d.ts

@@ -1,8 +1,16 @@
 /// <reference types="react" />
 import './list.less';
-export type { ListProps } from './list';
+export type { ListProps, ListRef } from './list';
 export type { ListItemProps } from './list-item';
-declare const _default: import("react").FC<import("./list").ListProps> & {
+declare const _default: import("react").ForwardRefExoticComponent<{
+    header?: import("react").ReactNode;
+    mode?: "default" | "card" | undefined;
+    children?: import("react").ReactNode;
+} & {
+    className?: string | undefined;
+    style?: (import("react").CSSProperties & Partial<Record<"--active-background-color" | "--align-items" | "--border-bottom" | "--border-inner" | "--border-top" | "--extra-max-width" | "--font-size" | "--header-font-size" | "--padding-left" | "--padding-right" | "--prefix-padding-right" | "--prefix-width", string>>) | undefined;
+    tabIndex?: number | undefined;
+} & import("react").AriaAttributes & import("react").RefAttributes<import("./list").ListRef>> & {
     Item: import("react").FC<import("./list-item").ListItemProps>;
 };
 export default _default;

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

@@ -1,8 +1,19 @@
-import { FC, ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 import { NativeProps } from '../../utils/native-props';
 export declare type ListProps = {
     header?: ReactNode;
     mode?: 'default' | 'card';
     children?: ReactNode;
 } & NativeProps<'--active-background-color' | '--align-items' | '--border-bottom' | '--border-inner' | '--border-top' | '--extra-max-width' | '--font-size' | '--header-font-size' | '--padding-left' | '--padding-right' | '--prefix-padding-right' | '--prefix-width'>;
-export declare const List: FC<ListProps>;
+export declare type ListRef = {
+    nativeElement: HTMLDivElement | null;
+};
+export declare const List: React.ForwardRefExoticComponent<{
+    header?: ReactNode;
+    mode?: "default" | "card" | undefined;
+    children?: ReactNode;
+} & {
+    className?: string | undefined;
+    style?: (React.CSSProperties & Partial<Record<"--active-background-color" | "--align-items" | "--border-bottom" | "--border-inner" | "--border-top" | "--extra-max-width" | "--font-size" | "--header-font-size" | "--padding-left" | "--padding-right" | "--prefix-padding-right" | "--prefix-width", string>>) | undefined;
+    tabIndex?: number | undefined;
+} & React.AriaAttributes & React.RefAttributes<ListRef>>;

package/es/components/list/list.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { forwardRef, useImperativeHandle, useRef } from 'react';
 import classNames from 'classnames';
 import { withNativeProps } from '../../utils/native-props';
 import { mergeProps } from '../../utils/with-default-props';
@@ -6,10 +6,18 @@ const classPrefix = `adm-list`;
 const defaultProps = {
   mode: 'default'
 };
-export const List = p => {
+export const List = forwardRef((p, ref) => {
   const props = mergeProps(defaultProps, p);
+  const nativeElementRef = useRef(null);
+  useImperativeHandle(ref, () => ({
+    get nativeElement() {
+      return nativeElementRef.current;
+    }
+
+  }));
   return withNativeProps(props, React.createElement("div", {
-    className: classNames(classPrefix, `${classPrefix}-${props.mode}`)
+    className: classNames(classPrefix, `${classPrefix}-${props.mode}`),
+    ref: nativeElementRef
   }, props.header && React.createElement("div", {
     className: `${classPrefix}-header`
   }, props.header), React.createElement("div", {
@@ -17,4 +25,4 @@ export const List = p => {
   }, React.createElement("div", {
     className: `${classPrefix}-body-inner`
   }, props.children))));
-};
+});

package/es/components/modal/modal-action-button.d.ts

@@ -1,8 +1,8 @@
-import { FC } from 'react';
+import { FC, ReactNode } from 'react';
 import { NativeProps } from '../../utils/native-props';
 export declare type Action = {
     key: string | number;
-    text: string;
+    text: ReactNode;
     disabled?: boolean;
     danger?: boolean;
     primary?: boolean;

package/es/components/modal/modal.css

@@ -48,14 +48,6 @@
   line-height: 1.4;
   color: var(--adm-color-text);
 }
-.adm-modal-close {
-  position: absolute;
-  right: 8px;
-  top: 8px;
-  color: var(--adm-color-weak);
-  padding: 4px;
-  font-size: var(--adm-font-size-10);
-}
 .adm-modal-footer {
   user-select: none;
   padding: 8px 12px 12px;

package/es/components/modal/modal.js

@@ -6,19 +6,16 @@ import { ModalActionButton } from './modal-action-button';
 import Image from '../image';
 import Space from '../space';
 import AutoCenter from '../auto-center';
-import { CloseOutline } from 'antd-mobile-icons';
 import CenterPopup from '../center-popup';
 const defaultProps = {
   actions: [],
   closeOnAction: false,
-  closeOnMaskClick: false
+  closeOnMaskClick: false,
+  getContainer: null
 };
 export const Modal = p => {
   const props = mergeProps(defaultProps, p);
-  const element = React.createElement(React.Fragment, null, props.showCloseButton && React.createElement("a", {
-    className: classNames(cls('close'), 'adm-plain-anchor'),
-    onClick: props.onClose
-  }, React.createElement(CloseOutline, null)), !!props.image && React.createElement("div", {
+  const element = React.createElement(React.Fragment, null, !!props.image && React.createElement("div", {
     className: cls('image-container')
   }, React.createElement(Image, {
     src: props.image,
@@ -54,11 +51,9 @@ export const Modal = p => {
     style: props.style,
     afterClose: props.afterClose,
     afterShow: props.afterShow,
-    onMaskClick: props.closeOnMaskClick ? () => {
-      var _a;
-
-      (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
-    } : undefined,
+    showCloseButton: props.showCloseButton,
+    closeOnMaskClick: props.closeOnMaskClick,
+    onClose: props.onClose,
     visible: props.visible,
     getContainer: props.getContainer,
     bodyStyle: props.bodyStyle,

package/es/components/number-keyboard/number-keyboard.d.ts

@@ -1,11 +1,9 @@
 import React from 'react';
 import { PopupProps } from '../popup';
-import { GetContainer } from '../../utils/render-to-container';
 import { NativeProps } from '../../utils/native-props';
 export declare type NumberKeyboardProps = {
     visible?: boolean;
     title?: string;
-    getContainer?: GetContainer;
     confirmText?: string | null;
     customKey?: '-' | '.' | 'X';
     randomOrder?: boolean;
@@ -14,9 +12,7 @@ export declare type NumberKeyboardProps = {
     onDelete?: () => void;
     onClose?: () => void;
     onConfirm?: () => void;
-    afterShow?: () => void;
-    afterClose?: () => void;
     closeOnConfirm?: boolean;
     safeArea?: boolean;
-} & Pick<PopupProps, 'stopPropagation'> & NativeProps;
+} & Pick<PopupProps, 'afterClose' | 'afterShow' | 'getContainer' | 'destroyOnClose' | 'forceRender' | 'stopPropagation'> & NativeProps;
 export declare const NumberKeyboard: React.FC<NumberKeyboardProps>;

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

@@ -14,7 +14,9 @@ const defaultProps = {
   showCloseButton: true,
   confirmText: null,
   closeOnConfirm: true,
-  safeArea: true
+  safeArea: true,
+  destroyOnClose: false,
+  forceRender: false
 };
 export const NumberKeyboard = p => {
   const props = mergeProps(defaultProps, p);
@@ -119,7 +121,11 @@ export const NumberKeyboard = p => {
       'sign-key': !isNumberKey && key,
       'mid-key': index === 9 && !!confirmText
     });
-    return React.createElement("div", {
+    const ariaProps = key ? {
+      role: 'button',
+      title: key
+    } : undefined;
+    return React.createElement("div", Object.assign({
       key: key,
       className: className,
       onTouchStart: () => {
@@ -133,10 +139,8 @@ export const NumberKeyboard = p => {
         if (key === 'BACKSPACE') {
           onBackspacePressEnd();
         }
-      },
-      title: key,
-      role: 'button'
-    }, key === 'BACKSPACE' ? React.createElement(TextDeletionOutline, null) : key);
+      }
+    }, ariaProps), key === 'BACKSPACE' ? React.createElement(TextDeletionOutline, null) : key);
   };
 
   return React.createElement(Popup, {
@@ -146,7 +150,9 @@ export const NumberKeyboard = p => {
     afterClose: props.afterClose,
     afterShow: props.afterShow,
     className: `${classPrefix}-popup`,
-    stopPropagation: props.stopPropagation
+    stopPropagation: props.stopPropagation,
+    destroyOnClose: props.destroyOnClose,
+    forceRender: props.forceRender
   }, withNativeProps(props, React.createElement("div", {
     ref: keyboardRef,
     className: classPrefix,

package/es/components/passcode-input/passcode-input.d.ts

@@ -32,4 +32,8 @@ export declare const PasscodeInput: React.ForwardRefExoticComponent<{
     onFocus?: (() => void) | undefined;
     keyboard?: React.ReactElement<NumberKeyboardProps, string | React.JSXElementConstructor<any>> | undefined;
     onFill?: ((val: string) => void) | undefined;
-} & NativeProps<"--border-radius" | "--border-color" | "--cell-size" | "--dot-size" | "--cell-gap"> & React.RefAttributes<PasscodeInputRef>>;
+} & {
+    className?: string | undefined;
+    style?: (React.CSSProperties & Partial<Record<"--border-radius" | "--border-color" | "--cell-size" | "--dot-size" | "--cell-gap", string>>) | undefined;
+    tabIndex?: number | undefined;
+} & React.AriaAttributes & React.RefAttributes<PasscodeInputRef>>;

package/es/components/picker/index.d.ts

@@ -20,9 +20,11 @@ declare const _default: import("react").NamedExoticComponent<{
     mouseWheel?: boolean | undefined;
     popupClassName?: string | undefined;
     popupStyle?: import("react").CSSProperties | undefined;
-    forceRender?: boolean | undefined;
-    destroyOnClose?: boolean | undefined;
-} & Pick<import("../popup").PopupProps, "onClick" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation"> & import("../../utils/native-props").NativeProps<"--item-height" | "--header-button-font-size" | "--title-font-size" | "--item-font-size"> & import("react").RefAttributes<import("./picker").PickerActions>> & {
+} & Pick<import("../popup").PopupProps, "onClick" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation"> & {
+    className?: string | undefined;
+    style?: (import("react").CSSProperties & Partial<Record<"--item-height" | "--header-button-font-size" | "--title-font-size" | "--item-font-size", string>>) | undefined;
+    tabIndex?: number | undefined;
+} & import("react").AriaAttributes & import("react").RefAttributes<import("./picker").PickerActions>> & {
     readonly type: import("react").ForwardRefExoticComponent<{
         columns: import("../picker-view").PickerColumn[] | ((value: import("../picker-view").PickerValue[]) => import("../picker-view").PickerColumn[]);
         value?: import("../picker-view").PickerValue[] | undefined;
@@ -41,9 +43,11 @@ declare const _default: import("react").NamedExoticComponent<{
         mouseWheel?: boolean | undefined;
         popupClassName?: string | undefined;
         popupStyle?: import("react").CSSProperties | undefined;
-        forceRender?: boolean | undefined;
-        destroyOnClose?: boolean | undefined;
-    } & Pick<import("../popup").PopupProps, "onClick" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation"> & import("../../utils/native-props").NativeProps<"--item-height" | "--header-button-font-size" | "--title-font-size" | "--item-font-size"> & import("react").RefAttributes<import("./picker").PickerActions>>;
+    } & Pick<import("../popup").PopupProps, "onClick" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation"> & {
+        className?: string | undefined;
+        style?: (import("react").CSSProperties & Partial<Record<"--item-height" | "--header-button-font-size" | "--title-font-size" | "--item-font-size", string>>) | undefined;
+        tabIndex?: number | undefined;
+    } & import("react").AriaAttributes & import("react").RefAttributes<import("./picker").PickerActions>>;
 } & {
     prompt: typeof prompt;
 };

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

@@ -26,9 +26,7 @@ export declare type PickerProps = {
     mouseWheel?: boolean;
     popupClassName?: string;
     popupStyle?: React.CSSProperties;
-    forceRender?: boolean;
-    destroyOnClose?: boolean;
-} & Pick<PopupProps, 'getContainer' | 'afterShow' | 'afterClose' | 'onClick' | 'stopPropagation'> & NativeProps<'--header-button-font-size' | '--title-font-size' | '--item-font-size' | '--item-height'>;
+} & Pick<PopupProps, 'getContainer' | 'afterShow' | 'afterClose' | 'onClick' | 'stopPropagation' | 'forceRender' | 'destroyOnClose'> & NativeProps<'--header-button-font-size' | '--title-font-size' | '--item-font-size' | '--item-height'>;
 export declare const Picker: React.MemoExoticComponent<React.ForwardRefExoticComponent<{
     columns: PickerColumn[] | ((value: PickerValue[]) => PickerColumn[]);
     value?: PickerValue[] | undefined;
@@ -47,6 +45,8 @@ export declare const Picker: React.MemoExoticComponent<React.ForwardRefExoticCom
     mouseWheel?: boolean | undefined;
     popupClassName?: string | undefined;
     popupStyle?: React.CSSProperties | undefined;
-    forceRender?: boolean | undefined;
-    destroyOnClose?: boolean | undefined;
-} & Pick<PopupProps, "onClick" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation"> & NativeProps<"--item-height" | "--header-button-font-size" | "--title-font-size" | "--item-font-size"> & React.RefAttributes<PickerActions>>>;
+} & Pick<PopupProps, "onClick" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation"> & {
+    className?: string | undefined;
+    style?: (React.CSSProperties & Partial<Record<"--item-height" | "--header-button-font-size" | "--title-font-size" | "--item-font-size", string>>) | undefined;
+    tabIndex?: number | undefined;
+} & React.AriaAttributes & React.RefAttributes<PickerActions>>>;

package/es/components/picker/picker.js

@@ -10,12 +10,13 @@ import { useConfig } from '../config-provider';
 import { useMemoizedFn } from 'ahooks';
 import SafeArea from '../safe-area';
 import { defaultRenderLabel } from './picker-utils';
-import { useShouldRender } from '../../utils/should-render';
 const classPrefix = `adm-picker`;
 const defaultProps = {
   defaultValue: [],
   closeOnMaskClick: true,
-  renderLabel: defaultRenderLabel
+  renderLabel: defaultRenderLabel,
+  destroyOnClose: false,
+  forceRender: false
 };
 export const Picker = memo(forwardRef((p, ref) => {
   var _a;
@@ -79,12 +80,12 @@ export const Picker = memo(forwardRef((p, ref) => {
       (_a = props.onSelect) === null || _a === void 0 ? void 0 : _a.call(props, val, ext);
     }
   });
-  const shouldRender = useShouldRender(visible, props.forceRender, props.destroyOnClose);
   const pickerElement = withNativeProps(props, React.createElement("div", {
     className: classPrefix
   }, React.createElement("div", {
     className: `${classPrefix}-header`
   }, React.createElement("a", {
+    role: 'button',
     className: `${classPrefix}-header-button`,
     onClick: () => {
       var _a;
@@ -95,6 +96,7 @@ export const Picker = memo(forwardRef((p, ref) => {
   }, props.cancelText), React.createElement("div", {
     className: `${classPrefix}-header-title`
   }, props.title), React.createElement("a", {
+    role: 'button',
     className: `${classPrefix}-header-button`,
     onClick: () => {
       setValue(innerValue);
@@ -122,13 +124,13 @@ export const Picker = memo(forwardRef((p, ref) => {
       setVisible(false);
     },
     getContainer: props.getContainer,
-    destroyOnClose: true,
+    destroyOnClose: props.destroyOnClose,
     afterShow: props.afterShow,
     afterClose: props.afterClose,
     onClick: props.onClick,
-    forceRender: true,
+    forceRender: props.forceRender,
     stopPropagation: props.stopPropagation
-  }, shouldRender && pickerElement, React.createElement(SafeArea, {
+  }, pickerElement, React.createElement(SafeArea, {
     position: 'bottom'
   }));
   return React.createElement(React.Fragment, null, popupElement, (_a = props.children) === null || _a === void 0 ? void 0 : _a.call(props, extend.items, actions));

package/es/components/picker-view/picker-view.css

@@ -62,6 +62,7 @@
   flex-direction: column;
   position: relative;
   z-index: 0;
+  padding-bottom: 1px;
 }
 .adm-picker-view-column-accessible > * {
   flex: 1;

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

@@ -132,27 +132,29 @@ export const Wheel = memo(props => {
       className: 'adm-picker-view-column-accessible-current',
       role: 'button',
       "aria-label": current ? `当前选择的是：${current.label}` : '当前未选择'
-    }, "-"), React.createElement("div", null, previous && React.createElement("div", {
+    }, "-"), React.createElement("div", {
       className: 'adm-picker-view-column-accessible-button',
       onClick: () => {
+        if (!previous) return;
         scrollSelect(previousIndex);
       },
-      role: 'button',
-      "aria-label": `选择上一项：${previous.label}`
-    }, "-")), React.createElement("div", null, next && React.createElement("div", {
+      role: previous ? 'button' : 'text',
+      "aria-label": !previous ? '没有上一项' : `选择上一项：${previous.label}`
+    }, "-"), React.createElement("div", {
       className: 'adm-picker-view-column-accessible-button',
       onClick: () => {
+        if (!next) return;
         scrollSelect(nextIndex);
       },
-      role: 'button',
-      "aria-label": `选择下一项：${next.label}`
-    }, "-")));
+      role: next ? 'button' : 'text',
+      "aria-label": !next ? '没有下一项' : `选择下一项：${next.label}`
+    }, "-"));
   }
 
   return React.createElement("div", {
-    ref: rootRef,
     className: `${classPrefix}-column`
   }, React.createElement(animated.div, {
+    ref: rootRef,
     style: {
       translateY: y
     },

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

@@ -17,7 +17,11 @@ declare const _default: import("react").ForwardRefExoticComponent<{
     placement?: DeprecatedPlacement | Placement | undefined;
     stopPropagation?: "click"[] | undefined;
     content: import("react").ReactNode;
-} & import("../../utils/native-props").NativeProps<"--z-index"> & import("react").RefAttributes<import("./popover").PopoverRef>> & {
+} & {
+    className?: string | undefined;
+    style?: (import("react").CSSProperties & Partial<Record<"--z-index", string>>) | undefined;
+    tabIndex?: number | undefined;
+} & import("react").AriaAttributes & import("react").RefAttributes<import("./popover").PopoverRef>> & {
     Menu: import("react").ForwardRefExoticComponent<Omit<import("./popover").PopoverProps, "content"> & {
         actions: import("./popover-menu").Action[];
         onAction?: ((item: import("./popover-menu").Action) => void) | undefined;

package/es/components/popover/popover.d.ts

@@ -33,4 +33,8 @@ export declare const Popover: React.ForwardRefExoticComponent<{
     placement?: DeprecatedPlacement | Placement | undefined;
     stopPropagation?: "click"[] | undefined;
     content: React.ReactNode;
-} & NativeProps<"--z-index"> & React.RefAttributes<PopoverRef>>;
+} & {
+    className?: string | undefined;
+    style?: (React.CSSProperties & Partial<Record<"--z-index", string>>) | undefined;
+    tabIndex?: number | undefined;
+} & React.AriaAttributes & React.RefAttributes<PopoverRef>>;

package/es/components/popup/popup-base-props.d.ts

@@ -0,0 +1,35 @@
+import React from 'react';
+import { GetContainer } from '../../utils/render-to-container';
+import { MaskProps } from '../mask';
+import { PropagationEvent } from '../../utils/with-stop-propagation';
+export declare type PopupBaseProps = {
+    afterClose?: () => void;
+    afterShow?: () => void;
+    bodyClassName?: string;
+    bodyStyle?: React.CSSProperties;
+    closeOnMaskClick?: boolean;
+    destroyOnClose?: boolean;
+    disableBodyScroll?: boolean;
+    forceRender?: boolean;
+    getContainer?: GetContainer;
+    mask?: boolean;
+    maskClassName?: string;
+    maskStyle?: MaskProps['style'];
+    onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    onClose?: () => void;
+    onMaskClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    showCloseButton?: boolean;
+    stopPropagation?: PropagationEvent[];
+    visible?: boolean;
+};
+export declare const defaultPopupBaseProps: {
+    closeOnMaskClick: boolean;
+    destroyOnClose: boolean;
+    disableBodyScroll: boolean;
+    forceRender: boolean;
+    getContainer: () => HTMLElement;
+    mask: boolean;
+    showCloseButton: boolean;
+    stopPropagation: string[];
+    visible: boolean;
+};

package/es/components/popup/popup-base-props.js

@@ -0,0 +1,11 @@
+export const defaultPopupBaseProps = {
+  closeOnMaskClick: false,
+  destroyOnClose: false,
+  disableBodyScroll: true,
+  forceRender: false,
+  getContainer: () => document.body,
+  mask: true,
+  showCloseButton: false,
+  stopPropagation: ['click'],
+  visible: false
+};

package/es/components/popup/popup.css

@@ -8,23 +8,49 @@
   background-color: var(--adm-color-background);
   z-index: calc(var(--z-index) + 10);
 }
+.adm-popup-body .adm-popup-close-icon {
+  position: absolute;
+  z-index: 100;
+}
 .adm-popup-body-position-bottom {
   width: 100%;
   bottom: 0;
   left: 0;
 }
+.adm-popup-body-position-bottom .adm-popup-close-icon {
+  right: 8px;
+  top: 8px;
+}
 .adm-popup-body-position-top {
   width: 100%;
   top: 0;
   left: 0;
 }
+.adm-popup-body-position-top .adm-popup-close-icon {
+  right: 8px;
+  bottom: 8px;
+}
 .adm-popup-body-position-left {
   height: 100%;
   top: 0;
   left: 0;
 }
+.adm-popup-body-position-left .adm-popup-close-icon {
+  right: 8px;
+  top: 8px;
+}
 .adm-popup-body-position-right {
   height: 100%;
   top: 0;
   right: 0;
 }
+.adm-popup-body-position-right .adm-popup-close-icon {
+  left: 8px;
+  top: 8px;
+}
+.adm-popup-close-icon {
+  cursor: pointer;
+  padding: 4px;
+  font-size: 18px;
+  color: var(--adm-color-weak);
+}