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

package/2x/cjs/components/number-keyboard/number-keyboard.css

@@ -4,18 +4,19 @@
   flex: 1;
 }
 
-.adm-number-keyboard-main.confirmed-style .sign-key {
+.adm-number-keyboard-main.adm-number-keyboard-main-confirmed-style .adm-number-keyboard-key-sign {
   background-color: var(--adm-color-white);
 }
 
 .adm-number-keyboard-popup.adm-popup {
   width: 100%;
+  -webkit-user-select: none;
   user-select: none;
   z-index: 1050;
 }
 
 .adm-number-keyboard-popup.adm-popup .adm-popup-body {
-  background-color: #f5f5f5;
+  background-color: var(--adm-color-box);
 }
 
 .adm-number-keyboard-wrapper {
@@ -25,13 +26,13 @@
 .adm-number-keyboard-header {
   height: 68px;
   line-height: 68px;
-  border-top: solid 2px #f5f5f5;
+  border-top: solid 2px var(--adm-color-border);
   display: flex;
   justify-content: center;
   align-items: center;
   padding: 0 24px;
   color: var(--adm-color-weak);
-  background-color: var(--adm-color-white);
+  background-color: var(--adm-color-background);
 }
 
 .adm-number-keyboard-header-close-button {
@@ -39,11 +40,11 @@
   font-size: 32px;
 }
 
-.adm-number-keyboard-header.with-title {
+.adm-number-keyboard-header.adm-number-keyboard-header-with-title {
   justify-content: space-between;
 }
 
-.adm-number-keyboard-header.with-title .adm-number-keyboard-header-close-button {
+.adm-number-keyboard-header.adm-number-keyboard-header-with-title .adm-number-keyboard-header-close-button {
   padding-right: 0;
 }
 
@@ -70,7 +71,7 @@
   height: 96px;
   font-size: 44px;
   box-sizing: border-box;
-  border: solid 2px #f5f5f5;
+  border: solid 2px var(--adm-color-border);
   border-bottom: none;
   border-left: none;
 }
@@ -96,37 +97,33 @@
   box-sizing: content-box;
 }
 
-.adm-number-keyboard-key.mid-key {
+.adm-number-keyboard-key.adm-number-keyboard-key-mid {
   flex-basis: 66.67%;
 }
 
-.adm-number-keyboard-key.sign-key:active::before {
+.adm-number-keyboard-key.adm-number-keyboard-key-sign:active::before {
   opacity: 0.1;
 }
 
-.adm-number-keyboard-key.extra-key {
-  border-left: solid 2px #f5f5f5;
+.adm-number-keyboard-key.adm-number-keyboard-key-extra {
+  border-left: solid 2px var(--adm-color-border);
   border-right: none;
 }
 
-.adm-number-keyboard-key.extra-key,
-.adm-number-keyboard-key.number-key {
-  background-color: var(--adm-color-white);
+.adm-number-keyboard-key.adm-number-keyboard-key-extra,
+.adm-number-keyboard-key.adm-number-keyboard-key-number {
+  background-color: var(--adm-color-background);
 }
 
-.adm-number-keyboard-key.extra-key:active::before,
-.adm-number-keyboard-key.number-key:active::before {
+.adm-number-keyboard-key.adm-number-keyboard-key-extra:active::before,
+.adm-number-keyboard-key.adm-number-keyboard-key-number:active::before {
   opacity: 0.1;
 }
 
-.adm-number-keyboard-key.ok-key {
+.adm-number-keyboard-key.adm-number-keyboard-key-ok {
   background-color: var(--adm-color-primary);
   color: var(--adm-color-white);
   height: 288px;
   font-size: 32px;
   border: none;
-}
-
-.adm-number-keyboard-bs-key {
-  height: 40px;
 }

package/2x/cjs/components/number-keyboard/number-keyboard.d.ts

@@ -1,22 +1,18 @@
 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';
+    customKey?: string | [string, string];
     randomOrder?: boolean;
     showCloseButton?: boolean;
     onInput?: (v: string) => void;
     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/2x/cjs/components/number-keyboard/number-keyboard.js

@@ -36,7 +36,9 @@ const defaultProps = {
   showCloseButton: true,
   confirmText: null,
   closeOnConfirm: true,
-  safeArea: true
+  safeArea: true,
+  destroyOnClose: false,
+  forceRender: false
 };
 
 const NumberKeyboard = p => {
@@ -55,13 +57,18 @@ const NumberKeyboard = p => {
   const keys = (0, _react.useMemo)(() => {
     const defaultKeys = ['1', '2', '3', '4', '5', '6', '7', '8', '9'];
     const keyList = randomOrder ? (0, _shuffle.shuffle)(defaultKeys) : defaultKeys;
+    const customKeys = Array.isArray(customKey) ? customKey : [customKey];
     keyList.push('0');
 
     if (confirmText) {
-      keyList.push(customKey || '');
+      if (customKeys.length === 2) {
+        keyList.splice(9, 0, customKeys.pop());
+      }
+
+      keyList.push(customKeys[0] || '');
     } else {
-      keyList.splice(9, 0, customKey || '');
-      keyList.push('BACKSPACE');
+      keyList.splice(9, 0, customKeys[0] || '');
+      keyList.push(customKeys[1] || 'BACKSPACE');
     }
 
     return keyList;
@@ -84,8 +91,7 @@ const NumberKeyboard = p => {
   const onBackspacePressEnd = () => {
     clearTimeout(timeoutRef.current);
     clearInterval(intervalRef.current);
-  }; // 点击键盘按键
-
+  };
 
   const onKeyPress = (e, key) => {
     var _a, _b;
@@ -107,18 +113,17 @@ const NumberKeyboard = p => {
         break;
 
       default:
-        // 当 customKey 不存在时，点击该键不应该触发 onInput
+        // onInput should't be called when customKey doesn't exist
         if (key !== '') onInput === null || onInput === void 0 ? void 0 : onInput(key);
         break;
     }
-  }; // 渲染 title 和 close button
-
+  };
 
   const renderHeader = () => {
     if (!showCloseButton && !title) return null;
     return _react.default.createElement("div", {
       className: (0, _classnames.default)(`${classPrefix}-header`, {
-        'with-title': !!title
+        [`${classPrefix}-header-with-title`]: !!title
       })
     }, title && _react.default.createElement("div", {
       className: `${classPrefix}-title`
@@ -132,17 +137,20 @@ const NumberKeyboard = p => {
       role: 'button',
       title: 'CLOSE'
     }, _react.default.createElement(_antdMobileIcons.DownOutline, null)));
-  }; // 渲染基础键盘按键
-
+  };
 
   const renderKey = (key, index) => {
     const isNumberKey = /^\d$/.test(key);
     const className = (0, _classnames.default)(`${classPrefix}-key`, {
-      'number-key': isNumberKey,
-      'sign-key': !isNumberKey && key,
-      'mid-key': index === 9 && !!confirmText
+      [`${classPrefix}-key-number`]: isNumberKey,
+      [`${classPrefix}-key-sign`]: !isNumberKey && key,
+      [`${classPrefix}-key-mid`]: index === 9 && !!confirmText && keys.length < 12
     });
-    return _react.default.createElement("div", {
+    const ariaProps = key ? {
+      role: 'button',
+      title: key
+    } : undefined;
+    return _react.default.createElement("div", Object.assign({
       key: key,
       className: className,
       onTouchStart: () => {
@@ -156,10 +164,8 @@ const NumberKeyboard = p => {
         if (key === 'BACKSPACE') {
           onBackspacePressEnd();
         }
-      },
-      title: key,
-      role: 'button'
-    }, key === 'BACKSPACE' ? _react.default.createElement(_antdMobileIcons.TextDeletionOutline, null) : key);
+      }
+    }, ariaProps), key === 'BACKSPACE' ? _react.default.createElement(_antdMobileIcons.TextDeletionOutline, null) : key);
   };
 
   return _react.default.createElement(_popup.default, {
@@ -169,7 +175,9 @@ const NumberKeyboard = p => {
     afterClose: props.afterClose,
     afterShow: props.afterShow,
     className: `${classPrefix}-popup`,
-    stopPropagation: props.stopPropagation
+    stopPropagation: props.stopPropagation,
+    destroyOnClose: props.destroyOnClose,
+    forceRender: props.forceRender
   }, (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {
     ref: keyboardRef,
     className: classPrefix,
@@ -180,12 +188,12 @@ const NumberKeyboard = p => {
     className: `${classPrefix}-wrapper`
   }, _react.default.createElement("div", {
     className: (0, _classnames.default)(`${classPrefix}-main`, {
-      'confirmed-style': !!confirmText
+      [`${classPrefix}-main-confirmed-style`]: !!confirmText
     })
   }, keys.map(renderKey)), !!confirmText && _react.default.createElement("div", {
     className: `${classPrefix}-confirm`
   }, _react.default.createElement("div", {
-    className: `${classPrefix}-key extra-key bs-key`,
+    className: `${classPrefix}-key ${classPrefix}-key-extra ${classPrefix}-key-bs`,
     onTouchStart: () => {
       onBackspacePressStart();
     },
@@ -196,7 +204,7 @@ const NumberKeyboard = p => {
     title: 'BACKSPACE',
     role: 'button'
   }, _react.default.createElement(_antdMobileIcons.TextDeletionOutline, null)), _react.default.createElement("div", {
-    className: `${classPrefix}-key extra-key ok-key`,
+    className: `${classPrefix}-key ${classPrefix}-key-extra ${classPrefix}-key-ok`,
     onTouchEnd: e => onKeyPress(e, 'OK'),
     role: 'button'
   }, confirmText))), props.safeArea && _react.default.createElement("div", {

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

@@ -0,0 +1,31 @@
+.adm-page-indicator-dot {
+  width: 6px;
+  height: 6px;
+  border-radius: 2px;
+  background: rgba(0, 0, 0, 0.2);
+}
+
+.adm-page-indicator-dot-active {
+  border-radius: 2px;
+  background: #1677ff;
+}
+
+.adm-page-indicator-color-white .adm-page-indicator-dot-active.adm-page-indicator-dot-active {
+  background: #ffffff;
+}
+
+.adm-page-indicator-horizontal .adm-page-indicator-dot {
+  margin-right: 6px;
+}
+
+.adm-page-indicator-horizontal .adm-page-indicator-dot-active {
+  width: 26px;
+}
+
+.adm-page-indicator-vertical .adm-page-indicator-dot {
+  margin-bottom: 6px;
+}
+
+.adm-page-indicator-vertical .adm-page-indicator-dot-active {
+  height: 26px;
+}

package/2x/cjs/components/passcode-input/index.d.ts

@@ -1,4 +1,4 @@
 import './passcode-input.less';
 import { PasscodeInput } from './passcode-input';
-export type { PasscodeInputProps } from './passcode-input';
+export type { PasscodeInputProps, PasscodeInputRef } from './passcode-input';
 export default PasscodeInput;

package/2x/cjs/components/passcode-input/passcode-input.css

@@ -19,62 +19,62 @@
   align-items: center;
   justify-content: center;
   box-sizing: border-box;
-  font-size: 36px;
+  font-size: var(--adm-font-size-10);
   width: var(--cell-size);
   height: var(--cell-size);
-  background: var(--adm-color-white);
+  background: var(--adm-color-background);
 }
 
-.adm-passcode-input:not(.seperated) {
+.adm-passcode-input:not(.adm-passcode-input-seperated) {
   border-radius: var(--border-radius);
   overflow: hidden;
   border: 2px solid var(--border-color);
 }
 
-.adm-passcode-input:not(.seperated) .adm-passcode-input-cell:not(:last-child) {
+.adm-passcode-input:not(.adm-passcode-input-seperated) .adm-passcode-input-cell:not(:last-child) {
   border-right: 2px solid var(--border-color);
 }
 
-.adm-passcode-input:not(.seperated).focused {
+.adm-passcode-input:not(.adm-passcode-input-seperated).adm-passcode-input-focused {
   border-color: var(--adm-color-primary);
   box-shadow: 0 0 4px 0 var(--adm-color-primary);
   outline: none;
 }
 
-.adm-passcode-input:not(.seperated).error {
+.adm-passcode-input:not(.adm-passcode-input-seperated).adm-passcode-input-error {
   border-color: var(--adm-color-danger);
   box-shadow: 0 0 4px 0 var(--adm-color-danger);
   animation: 100ms ease-in-out 0s 3 normal none running adm-shake-horizontal;
 }
 
-.adm-passcode-input.seperated .adm-passcode-input-cell {
+.adm-passcode-input.adm-passcode-input-seperated .adm-passcode-input-cell {
   border-radius: var(--border-radius);
   border: 2px solid var(--border-color);
 }
 
-.adm-passcode-input.seperated .adm-passcode-input-cell:not(:last-child) {
+.adm-passcode-input.adm-passcode-input-seperated .adm-passcode-input-cell:not(:last-child) {
   margin-right: var(--cell-gap);
 }
 
-.adm-passcode-input.seperated .adm-passcode-input-cell.focused {
+.adm-passcode-input.adm-passcode-input-seperated .adm-passcode-input-cell-focused {
   border-color: var(--adm-color-primary);
   box-shadow: 0 0 4px 0 var(--adm-color-primary);
 }
 
-.adm-passcode-input.seperated.focused {
+.adm-passcode-input-seperated.adm-passcode-input-focused {
   outline: none;
 }
 
-.adm-passcode-input.seperated.error {
+.adm-passcode-input.adm-passcode-input-seperated.adm-passcode-input-error {
   animation: 100ms ease-in-out 0s 3 normal none running adm-shake-horizontal;
 }
 
-.adm-passcode-input.seperated.error .adm-passcode-input-cell {
+.adm-passcode-input.adm-passcode-input-seperated.adm-passcode-input-error .adm-passcode-input-cell {
   border-color: var(--adm-color-danger);
   box-shadow: 0 0 4px 0 var(--adm-color-danger);
 }
 
-.adm-passcode-input-cell.dot::before {
+.adm-passcode-input-cell-dot::before {
   content: '';
   width: var(--dot-size);
   height: var(--dot-size);
@@ -82,7 +82,7 @@
   background: var(--adm-color-text);
 }
 
-.adm-passcode-input-cell.caret::after {
+.adm-passcode-input-cell-caret::after {
   content: '';
   width: 4px;
   height: 1.1em;

package/2x/cjs/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/2x/cjs/components/passcode-input/passcode-input.js

@@ -17,6 +17,8 @@ var _bound = require("../../utils/bound");
 
 var _usePropsValue = require("../../utils/use-props-value");
 
+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); }
@@ -36,6 +38,9 @@ const PasscodeInput = (0, _react.forwardRef)((p, ref) => {
   const props = (0, _withDefaultProps.mergeProps)(defaultProps, p); // 防止 length 值不合法
 
   const cellLength = props.length > 0 && props.length < Infinity ? Math.floor(props.length) : defaultProps.length;
+  const {
+    locale
+  } = (0, _configProvider.useConfig)();
   const [focused, setFocused] = (0, _react.useState)(false);
   const [value, setValue] = (0, _usePropsValue.usePropsValue)(props);
   const rootRef = (0, _react.useRef)(null);
@@ -106,9 +111,9 @@ const PasscodeInput = (0, _react.forwardRef)((p, ref) => {
     for (let i = 0; i < cellLength; i++) {
       cells.push(_react.default.createElement("div", {
         className: (0, _classnames.default)(`${classPrefix}-cell`, {
-          caret: props.caret && caretIndex === i && focused,
-          focused: focusedIndex === i && focused,
-          dot: !props.plain && chars[i]
+          [`${classPrefix}-cell-caret`]: props.caret && caretIndex === i && focused,
+          [`${classPrefix}-cell-focused`]: focusedIndex === i && focused,
+          [`${classPrefix}-cell-dot`]: !props.plain && chars[i]
         }),
         key: i
       }, chars[i] && props.plain ? chars[i] : ''));
@@ -118,16 +123,18 @@ const PasscodeInput = (0, _react.forwardRef)((p, ref) => {
   };
 
   const cls = (0, _classnames.default)(classPrefix, {
-    focused: focused,
-    error: props.error,
-    seperated: props.seperated
+    [`${classPrefix}-focused`]: focused,
+    [`${classPrefix}-error`]: props.error,
+    [`${classPrefix}-seperated`]: props.seperated
   });
   return _react.default.createElement(_react.default.Fragment, null, (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {
     ref: rootRef,
     tabIndex: 0,
     className: cls,
     onFocus: onFocus,
-    onBlur: onBlur
+    onBlur: onBlur,
+    role: 'button',
+    "aria-label": locale.PasscodeInput.name
   }, _react.default.createElement("div", {
     className: `${classPrefix}-cell-container`
   }, renderCells()), _react.default.createElement("input", {
@@ -139,7 +146,8 @@ const PasscodeInput = (0, _react.forwardRef)((p, ref) => {
     inputMode: 'numeric',
     onChange: e => {
       setValue(e.target.value.slice(0, props.length));
-    }
+    },
+    "aria-hidden": true
   }))), props.keyboard && _react.default.cloneElement(props.keyboard, {
     visible: focused,
     onInput: v => {

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

@@ -6,6 +6,8 @@ declare const _default: import("react").NamedExoticComponent<{
     columns: import("../picker-view").PickerColumn[] | ((value: import("../picker-view").PickerValue[]) => import("../picker-view").PickerColumn[]);
     value?: import("../picker-view").PickerValue[] | undefined;
     defaultValue?: import("../picker-view").PickerValue[] | undefined;
+    loading?: boolean | undefined;
+    loadingContent?: import("react").ReactNode;
     onSelect?: ((value: import("../picker-view").PickerValue[], extend: import("../picker-view").PickerValueExtend) => void) | undefined;
     onConfirm?: ((value: import("../picker-view").PickerValue[], extend: import("../picker-view").PickerValueExtend) => void) | undefined;
     onCancel?: (() => void) | undefined;
@@ -20,13 +22,17 @@ 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;
         defaultValue?: import("../picker-view").PickerValue[] | undefined;
+        loading?: boolean | undefined;
+        loadingContent?: import("react").ReactNode;
         onSelect?: ((value: import("../picker-view").PickerValue[], extend: import("../picker-view").PickerValueExtend) => void) | undefined;
         onConfirm?: ((value: import("../picker-view").PickerValue[], extend: import("../picker-view").PickerValueExtend) => void) | undefined;
         onCancel?: (() => void) | undefined;
@@ -41,9 +47,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/2x/cjs/components/picker/picker.css

@@ -1,7 +1,7 @@
 .adm-picker {
-  --header-button-font-size: 30px;
-  --title-font-size: 30px;
-  --item-font-size: 32px;
+  --header-button-font-size: var(--adm-font-size-7);
+  --title-font-size: var(--adm-font-size-7);
+  --item-font-size: var(--adm-font-size-8);
   --item-height: 68px;
   width: 100%;
   height: 600px;
@@ -19,8 +19,8 @@
 }
 
 .adm-picker-header {
-  flex: none;
-  border-bottom: solid 2px var(--adm-border-color);
+  flex-shrink: 0;
+  border-bottom: solid 2px var(--adm-color-border);
   display: flex;
   justify-content: space-between;
   align-items: center;
@@ -33,6 +33,12 @@
   padding: 16px 16px;
 }
 
+.adm-picker-header-button-disabled,
+.adm-picker-header-button-disabled:active {
+  opacity: 0.4;
+  cursor: not-allowed;
+}
+
 .adm-picker-header-title {
   padding: 8px 8px;
   font-size: var(--title-font-size);
@@ -42,8 +48,7 @@
 }
 
 .adm-picker-body {
-  flex: auto;
-  height: 100%;
+  flex: 1;
   width: 100%;
 }
 

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

@@ -12,6 +12,8 @@ export declare type PickerProps = {
     columns: PickerColumn[] | ((value: PickerValue[]) => PickerColumn[]);
     value?: PickerValue[];
     defaultValue?: PickerValue[];
+    loading?: boolean;
+    loadingContent?: ReactNode;
     onSelect?: (value: PickerValue[], extend: PickerValueExtend) => void;
     onConfirm?: (value: PickerValue[], extend: PickerValueExtend) => void;
     onCancel?: () => void;
@@ -26,13 +28,13 @@ 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;
     defaultValue?: PickerValue[] | undefined;
+    loading?: boolean | undefined;
+    loadingContent?: ReactNode;
     onSelect?: ((value: PickerValue[], extend: PickerValueExtend) => void) | undefined;
     onConfirm?: ((value: PickerValue[], extend: PickerValueExtend) => void) | undefined;
     onCancel?: (() => void) | undefined;
@@ -47,6 +49,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>>>;