antd-mobile 5.42.3 → 5.43.0

package/2x/bundle/style.css

@@ -1723,96 +1723,6 @@ div.adm-px-tester {
   --width: 60%;
 }
 
-.adm-tabs {
-  --title-font-size: var(--adm-font-size-9);
-  --content-padding: 24px;
-  --active-line-height: 4px;
-  --active-line-border-radius: var(--active-line-height);
-  --active-line-color: var(--adm-color-primary);
-  --active-title-color: var(--adm-color-primary);
-  position: relative;
-  min-width: 0;
-}
-
-.adm-tabs-header {
-  position: relative;
-  border-bottom: solid 2px var(--adm-color-border);
-}
-
-.adm-tabs-tab-list {
-  display: flex;
-  flex-wrap: nowrap;
-  justify-content: flex-start;
-  align-items: center;
-  position: relative;
-  overflow-x: scroll;
-  scrollbar-width: none;
-}
-
-.adm-tabs-tab-list::-webkit-scrollbar {
-  display: none;
-}
-
-.adm-tabs-tab-wrapper {
-  padding: 0 24px;
-}
-
-.adm-tabs-tab-wrapper-stretch {
-  flex: auto;
-}
-
-.adm-tabs-tab {
-  white-space: nowrap;
-  padding: 16px 0 20px;
-  width: -webkit-min-content;
-  width: min-content;
-  margin: 0 auto;
-  font-size: var(--title-font-size);
-  position: relative;
-  cursor: pointer;
-}
-
-.adm-tabs-tab-active {
-  color: var(--active-title-color);
-}
-
-.adm-tabs-tab-disabled {
-  opacity: .5;
-  cursor: not-allowed;
-}
-
-.adm-tabs-tab-line {
-  position: absolute;
-  bottom: 0;
-  height: var(--active-line-height);
-  background: var(--active-line-color);
-  border-radius: var(--active-line-border-radius);
-}
-
-.adm-tabs-content {
-  padding: var(--content-padding);
-}
-
-.adm-tabs-header-mask {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  z-index: 1;
-  width: 60px;
-  height: 100%;
-  pointer-events: none;
-}
-
-.adm-tabs-header-mask-left {
-  left: 0;
-  background: linear-gradient(to right,var(--adm-color-background),rgba(255,255,255,0));
-}
-
-.adm-tabs-header-mask-right {
-  right: 0;
-  background: linear-gradient(to left,var(--adm-color-background),rgba(255,255,255,0));
-}
-
 .adm-check-list-item-extra {
   font-size: var(--adm-font-size-10);
   line-height: 1;
@@ -1990,6 +1900,96 @@ a.adm-list-item:active:not(.adm-list-item-disabled):after {
   }
 }
 
+.adm-tabs {
+  --title-font-size: var(--adm-font-size-9);
+  --content-padding: 24px;
+  --active-line-height: 4px;
+  --active-line-border-radius: var(--active-line-height);
+  --active-line-color: var(--adm-color-primary);
+  --active-title-color: var(--adm-color-primary);
+  position: relative;
+  min-width: 0;
+}
+
+.adm-tabs-header {
+  position: relative;
+  border-bottom: solid 2px var(--adm-color-border);
+}
+
+.adm-tabs-tab-list {
+  display: flex;
+  flex-wrap: nowrap;
+  justify-content: flex-start;
+  align-items: center;
+  position: relative;
+  overflow-x: scroll;
+  scrollbar-width: none;
+}
+
+.adm-tabs-tab-list::-webkit-scrollbar {
+  display: none;
+}
+
+.adm-tabs-tab-wrapper {
+  padding: 0 24px;
+}
+
+.adm-tabs-tab-wrapper-stretch {
+  flex: auto;
+}
+
+.adm-tabs-tab {
+  white-space: nowrap;
+  padding: 16px 0 20px;
+  width: -webkit-min-content;
+  width: min-content;
+  margin: 0 auto;
+  font-size: var(--title-font-size);
+  position: relative;
+  cursor: pointer;
+}
+
+.adm-tabs-tab-active {
+  color: var(--active-title-color);
+}
+
+.adm-tabs-tab-disabled {
+  opacity: .5;
+  cursor: not-allowed;
+}
+
+.adm-tabs-tab-line {
+  position: absolute;
+  bottom: 0;
+  height: var(--active-line-height);
+  background: var(--active-line-color);
+  border-radius: var(--active-line-border-radius);
+}
+
+.adm-tabs-content {
+  padding: var(--content-padding);
+}
+
+.adm-tabs-header-mask {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  z-index: 1;
+  width: 60px;
+  height: 100%;
+  pointer-events: none;
+}
+
+.adm-tabs-header-mask-left {
+  left: 0;
+  background: linear-gradient(to right,var(--adm-color-background),rgba(255,255,255,0));
+}
+
+.adm-tabs-header-mask-right {
+  right: 0;
+  background: linear-gradient(to left,var(--adm-color-background),rgba(255,255,255,0));
+}
+
 .adm-cascader {
   width: 100%;
   overflow: hidden;
@@ -2030,6 +2030,11 @@ a.adm-list-item:active:not(.adm-list-item-disabled):after {
   --height: 620px;
 }
 
+.adm-cascader-popup .adm-popup-body {
+  border-top-left-radius: 16px;
+  border-top-right-radius: 16px;
+}
+
 .adm-center-popup {
   --background-color: var(--adm-center-popup-background-color, var(--adm-color-background));
   --border-radius: var(--adm-center-popup-border-radius, 16px);
@@ -3908,6 +3913,10 @@ a.adm-list-item:active:not(.adm-list-item-disabled):after {
   vertical-align: top;
 }
 
+.adm-passcode-input.adm-passcode-input-rtl .adm-passcode-input-cell-container {
+  flex-direction: row-reverse;
+}
+
 .adm-passcode-input-cell {
   flex: none;
   display: flex;
@@ -3956,6 +3965,22 @@ a.adm-list-item:active:not(.adm-list-item-disabled):after {
   box-shadow: 0 0 4px 0 var(--adm-color-primary);
 }
 
+.adm-passcode-input.adm-passcode-input-rtl:not(.adm-passcode-input-seperated) .adm-passcode-input-cell:first-child {
+  border-right: none;
+}
+
+.adm-passcode-input.adm-passcode-input-rtl:not(.adm-passcode-input-seperated) .adm-passcode-input-cell:last-child {
+  border-right: 2px solid var(--border-color);
+}
+
+.adm-passcode-input.adm-passcode-input-rtl.adm-passcode-input.adm-passcode-input-seperated .adm-passcode-input-cell:first-child {
+  margin-right: 0;
+}
+
+.adm-passcode-input.adm-passcode-input-rtl.adm-passcode-input.adm-passcode-input-seperated .adm-passcode-input-cell:last-child {
+  margin-right: var(--cell-gap);
+}
+
 .adm-passcode-input-seperated.adm-passcode-input-focused {
   outline: none;
 }
@@ -4594,6 +4619,7 @@ a.adm-list-item:active:not(.adm-list-item-disabled):after {
   width: 0;
   height: 100%;
   padding: 8px 0;
+  box-sizing: border-box;
 }
 
 .adm-segmented-thumb-motion-appear-active {

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

@@ -36,4 +36,9 @@
 
 .adm-cascader-body > .adm-cascader-view {
   --height: 620px;
+}
+
+.adm-cascader-popup .adm-popup-body {
+  border-top-left-radius: 16px;
+  border-top-right-radius: 16px;
 }

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

@@ -1,8 +1,8 @@
 import React, { ReactNode } from 'react';
-import { PopupProps } from '../popup';
-import { CascaderValue, CascaderValueExtend, CascaderOption } from '../cascader-view';
-import { NativeProps } from '../../utils/native-props';
 import type { FieldNamesType } from '../../hooks';
+import { NativeProps } from '../../utils/native-props';
+import { CascaderOption, CascaderValue, CascaderValueExtend, CascaderViewOptionRender } from '../cascader-view';
+import { PopupProps } from '../popup';
 export declare type CascaderActions = {
     open: () => void;
     close: () => void;
@@ -27,6 +27,7 @@ export declare type CascaderProps = {
     onTabsChange?: (index: number) => void;
     activeIcon?: ReactNode;
     fieldNames?: FieldNamesType;
+    optionRender?: CascaderViewOptionRender;
 } & Pick<PopupProps, 'getContainer' | 'afterShow' | 'afterClose' | 'onClick' | 'stopPropagation' | 'destroyOnClose' | 'forceRender'> & NativeProps;
 export declare const Cascader: React.ForwardRefExoticComponent<{
     options: CascaderOption[];
@@ -46,6 +47,7 @@ export declare const Cascader: React.ForwardRefExoticComponent<{
     onTabsChange?: ((index: number) => void) | undefined;
     activeIcon?: ReactNode;
     fieldNames?: FieldNamesType | undefined;
+    optionRender?: CascaderViewOptionRender | undefined;
 } & Pick<PopupProps, "onClick" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation"> & {
     className?: string | undefined;
     style?: (React.CSSProperties & Partial<Record<never, string>>) | undefined;

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

@@ -5,14 +5,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Cascader = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _popup = _interopRequireDefault(require("../popup"));
-var _withDefaultProps = require("../../utils/with-default-props");
+var _hooks = require("../../hooks");
 var _nativeProps = require("../../utils/native-props");
 var _usePropsValue = require("../../utils/use-props-value");
+var _withDefaultProps = require("../../utils/with-default-props");
 var _cascaderView = _interopRequireDefault(require("../cascader-view"));
-var _configProvider = require("../config-provider");
 var _useCascaderValueExtend = require("../cascader-view/use-cascader-value-extend");
-var _hooks = require("../../hooks");
+var _configProvider = require("../config-provider");
+var _popup = _interopRequireDefault(require("../popup"));
 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; }
@@ -67,9 +67,7 @@ const Cascader = (0, _react.forwardRef)((p, ref) => {
   });
   const [innerValue, setInnerValue] = (0, _react.useState)(value);
   (0, _react.useEffect)(() => {
-    if (!visible) {
-      setInnerValue(value);
-    }
+    setInnerValue(value);
   }, [visible, value]);
   const cascaderElement = (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {
     className: classPrefix
@@ -103,6 +101,7 @@ const Cascader = (0, _react.forwardRef)((p, ref) => {
     }
   })))));
   const popupElement = _react.default.createElement(_popup.default, {
+    className: `${classPrefix}-popup`,
     visible: visible,
     position: 'bottom',
     onMaskClick: () => {

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

@@ -1,7 +1,7 @@
 import { prompt } from './prompt';
 import './cascader.less';
 export type { CascaderProps, CascaderRef, CascaderActions } from './cascader';
-export type { CascaderValue, CascaderValueExtend, CascaderOption, } from '../cascader-view';
+export type { CascaderValue, CascaderValueExtend, CascaderOption, CascaderViewOptionRender, CascaderViewOptionRenderInfo, } from '../cascader-view';
 declare const _default: import("react").ForwardRefExoticComponent<{
     options: import("../cascader-view").CascaderOption[];
     value?: import("../check-list").CheckListValue[] | undefined;
@@ -20,6 +20,7 @@ declare const _default: import("react").ForwardRefExoticComponent<{
     onTabsChange?: ((index: number) => void) | undefined;
     activeIcon?: import("react").ReactNode;
     fieldNames?: import("../../hooks").FieldNamesType | undefined;
+    optionRender?: import("../cascader-view").CascaderViewOptionRender | undefined;
 } & Pick<import("../popup").PopupProps, "onClick" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation"> & {
     className?: string | undefined;
     style?: (import("react").CSSProperties & Partial<Record<never, string>>) | undefined;

package/2x/cjs/components/cascader-view/cascader-view.d.ts

@@ -1,7 +1,7 @@
 import type { FC, ReactNode } from 'react';
-import { CheckListValue } from '../check-list';
+import type { BaseOptionType, FieldNamesType } from '../../hooks';
 import { NativeProps } from '../../utils/native-props';
-import type { FieldNamesType, BaseOptionType } from '../../hooks';
+import { CheckListValue } from '../check-list';
 export declare type CascaderValue = CheckListValue;
 export declare type CascaderOption = {
     label?: string;
@@ -13,6 +13,11 @@ export declare type CascaderValueExtend = {
     items: (CascaderOption | null)[];
     isLeaf: boolean;
 };
+export declare type CascaderViewOptionRenderInfo = {
+    depth: number;
+    active: boolean;
+};
+export declare type CascaderViewOptionRender = (option: CascaderOption, info: CascaderViewOptionRenderInfo) => ReactNode;
 export declare type CascaderViewProps = {
     options: CascaderOption[];
     value?: CascaderValue[];
@@ -23,5 +28,6 @@ export declare type CascaderViewProps = {
     activeIcon?: ReactNode;
     loading?: boolean;
     fieldNames?: FieldNamesType;
+    optionRender?: CascaderViewOptionRender;
 } & NativeProps<'--height'>;
 export declare const CascaderView: FC<CascaderViewProps>;

package/2x/cjs/components/cascader-view/cascader-view.js

@@ -4,22 +4,22 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.CascaderView = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _ahooks = require("ahooks");
 var _classnames = _interopRequireDefault(require("classnames"));
-var _tabs = _interopRequireDefault(require("../tabs"));
-var _checkList = _interopRequireDefault(require("../check-list"));
+var _react = _interopRequireWildcard(require("react"));
+var _hooks = require("../../hooks");
 var _nativeProps = require("../../utils/native-props");
-var _withDefaultProps = require("../../utils/with-default-props");
 var _usePropsValue = require("../../utils/use-props-value");
-var _useCascaderValueExtend = require("./use-cascader-value-extend");
+var _withDefaultProps = require("../../utils/with-default-props");
+var _checkList = _interopRequireDefault(require("../check-list"));
 var _configProvider = require("../config-provider");
-var _optionSkeleton = require("./option-skeleton");
 var _skeleton = _interopRequireDefault(require("../skeleton"));
-var _ahooks = require("ahooks");
-var _hooks = require("../../hooks");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _tabs = _interopRequireDefault(require("../tabs"));
+var _optionSkeleton = require("./option-skeleton");
+var _useCascaderValueExtend = require("./use-cascader-value-extend");
 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; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const classPrefix = `adm-cascader-view`;
 const defaultProps = {
   defaultValue: []
@@ -134,7 +134,10 @@ const CascaderView = p => {
         className: (0, _classnames.default)(`${classPrefix}-item`, {
           [`${classPrefix}-item-active`]: active
         })
-      }, option[labelName]);
+      }, props.optionRender ? props.optionRender(option, {
+        depth: index,
+        active
+      }) : option[labelName]);
     }))));
   }))));
 };

package/2x/cjs/components/cascader-view/index.d.ts

@@ -1,5 +1,5 @@
 import './cascader-view.less';
-export type { CascaderViewProps, CascaderValue, CascaderValueExtend, CascaderOption, } from './cascader-view';
+export type { CascaderViewProps, CascaderViewOptionRender, CascaderViewOptionRenderInfo, CascaderValue, CascaderValueExtend, CascaderOption, } from './cascader-view';
 declare const _default: import("react").FC<import("./cascader-view").CascaderViewProps> & {
     optionSkeleton: import("./cascader-view").CascaderOption[];
 };

package/2x/cjs/components/date-picker/date-picker-date-utils.js

@@ -6,15 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.convertDateToStringArray = convertDateToStringArray;
 exports.convertStringArrayToDate = convertStringArrayToDate;
 exports.generateDatePickerColumns = generateDatePickerColumns;
-var _dayjs = _interopRequireDefault(require("dayjs"));
-var _isLeapYear = _interopRequireDefault(require("dayjs/plugin/isLeapYear"));
-var _isoWeek = _interopRequireDefault(require("dayjs/plugin/isoWeek"));
-var _isoWeeksInYear = _interopRequireDefault(require("dayjs/plugin/isoWeeksInYear"));
 var _util = require("./util");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-_dayjs.default.extend(_isoWeek.default);
-_dayjs.default.extend(_isoWeeksInYear.default);
-_dayjs.default.extend(_isLeapYear.default);
 const precisionRankRecord = {
   year: 0,
   month: 1,
@@ -23,6 +15,9 @@ const precisionRankRecord = {
   minute: 4,
   second: 5
 };
+function getMonthDays(year, month) {
+  return new Date(Date.UTC(year, month, 0)).getUTCDate();
+}
 function generateDatePickerColumns(selected, min, max, precision, renderLabel, filter, tillNow) {
   const ret = [];
   const minYear = min.getFullYear();
@@ -39,7 +34,6 @@ function generateDatePickerColumns(selected, min, max, precision, renderLabel, f
   const maxSecond = max.getSeconds();
   const rank = precisionRankRecord[precision];
   const selectedYear = parseInt(selected[0]);
-  const firstDayInSelectedMonth = (0, _dayjs.default)(convertStringArrayToDate([selected[0], selected[1], '1']));
   const selectedMonth = parseInt(selected[1]);
   const selectedDay = parseInt(selected[2]);
   const selectedHour = parseInt(selected[3]);
@@ -96,7 +90,7 @@ function generateDatePickerColumns(selected, min, max, precision, renderLabel, f
   }
   if (rank >= precisionRankRecord.day) {
     const lower = isInMinMonth ? minDay : 1;
-    const upper = isInMaxMonth ? maxDay : firstDayInSelectedMonth.daysInMonth();
+    const upper = isInMaxMonth ? maxDay : getMonthDays(selectedYear, selectedMonth);
     const days = generateColumn(lower, upper, 'day');
     ret.push(days.map(v => ({
       label: renderLabel('day', v, {

package/2x/cjs/components/date-picker/date-picker-week-utils.js

@@ -21,14 +21,14 @@ const precisionRankRecord = {
 };
 function generateDatePickerColumns(selected, min, max, precision, renderLabel, filter) {
   const ret = [];
-  const minYear = min.getFullYear();
-  const maxYear = max.getFullYear();
+  const minDay = (0, _dayjs.default)(min);
+  const maxDay = (0, _dayjs.default)(max);
+  const minYear = minDay.isoWeekYear();
+  const maxYear = maxDay.isoWeekYear();
   const rank = precisionRankRecord[precision];
   const selectedYear = parseInt(selected[0]);
   const isInMinYear = selectedYear === minYear;
   const isInMaxYear = selectedYear === maxYear;
-  const minDay = (0, _dayjs.default)(min);
-  const maxDay = (0, _dayjs.default)(max);
   const minWeek = minDay.isoWeek();
   const maxWeek = maxDay.isoWeek();
   const minWeekday = minDay.isoWeekday();

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

@@ -19,7 +19,7 @@ export declare type DatePickerProps = Pick<PickerProps, 'onCancel' | 'onClose' |
     filter?: DatePickerFilter;
     tillNow?: boolean;
 } & NativeProps;
-export declare const DatePicker: React.ForwardRefExoticComponent<Pick<PickerProps, "style" | "title" | "onClick" | "visible" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation" | "closeOnMaskClick" | "onClose" | "cancelText" | "loading" | "confirmText" | "mouseWheel" | "loadingContent" | "onCancel"> & {
+export declare const DatePicker: React.ForwardRefExoticComponent<Pick<PickerProps, "style" | "title" | "onClick" | "visible" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation" | "onCancel" | "onClose" | "loading" | "closeOnMaskClick" | "cancelText" | "confirmText" | "mouseWheel" | "loadingContent"> & {
     value?: PickerDate | null | undefined;
     defaultValue?: PickerDate | null | undefined;
     onSelect?: ((value: PickerDate) => void) | undefined;

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

@@ -2,7 +2,7 @@ import './date-picker.less';
 import { prompt } from './prompt';
 export type { DatePickerProps, DatePickerRef } from './date-picker';
 export type { DatePickerFilter } from './date-picker-utils';
-declare const _default: import("react").ForwardRefExoticComponent<Pick<import("../picker").PickerProps, "style" | "title" | "onClick" | "visible" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation" | "closeOnMaskClick" | "onClose" | "cancelText" | "loading" | "confirmText" | "mouseWheel" | "loadingContent" | "onCancel"> & {
+declare const _default: import("react").ForwardRefExoticComponent<Pick<import("../picker").PickerProps, "style" | "title" | "onClick" | "visible" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation" | "onCancel" | "onClose" | "loading" | "closeOnMaskClick" | "cancelText" | "confirmText" | "mouseWheel" | "loadingContent"> & {
     value?: import("./util").PickerDate | null | undefined;
     defaultValue?: import("./util").PickerDate | null | undefined;
     onSelect?: ((value: import("./util").PickerDate) => void) | undefined;

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

@@ -8,6 +8,9 @@ export declare type DropdownProps = {
     closeOnMaskClick?: boolean;
     closeOnClickAway?: boolean;
     onChange?: (key: string | null) => void;
+    onVisibleChange?: (visible: boolean, info: {
+        key: string | null;
+    }) => void;
     arrowIcon?: ReactNode;
     /**
      * @deprecated use `arrowIcon` instead
@@ -24,6 +27,9 @@ declare const Dropdown: React.ForwardRefExoticComponent<{
     closeOnMaskClick?: boolean | undefined;
     closeOnClickAway?: boolean | undefined;
     onChange?: ((key: string | null) => void) | undefined;
+    onVisibleChange?: ((visible: boolean, info: {
+        key: string | null;
+    }) => void) | undefined;
     arrowIcon?: ReactNode;
     /**
      * @deprecated use `arrowIcon` instead

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

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _ahooks = require("ahooks");
 var _classnames = _interopRequireDefault(require("classnames"));
+var _raf = _interopRequireDefault(require("rc-util/lib/raf"));
 var _react = _interopRequireWildcard(require("react"));
 var _nativeProps = require("../../utils/native-props");
 var _usePropsValue = require("../../utils/use-props-value");
@@ -36,6 +37,8 @@ const Dropdown = (0, _react.forwardRef)((props, ref) => {
     defaultValue: mergedProps.defaultActiveKey,
     onChange: mergedProps.onChange
   });
+  const cacheKeyRef = (0, _react.useRef)(null);
+  cacheKeyRef.current = value !== null && value !== void 0 ? value : cacheKeyRef.current;
   const navRef = (0, _react.useRef)(null);
   const contentRef = (0, _react.useRef)(null);
   // 点击外部区域，关闭
@@ -46,14 +49,30 @@ const Dropdown = (0, _react.forwardRef)((props, ref) => {
   // 计算 navs 的 top 值
   const [top, setTop] = (0, _react.useState)();
   const containerRef = (0, _react.useRef)(null);
-  (0, _react.useEffect)(() => {
+  const rafIdRef = (0, _react.useRef)(0);
+  const updatePosition = (0, _react.useCallback)(() => {
     const container = containerRef.current;
     if (!container) return;
-    if (value) {
-      const rect = container.getBoundingClientRect();
-      setTop(rect.bottom);
-    }
-  }, [value]);
+    setTop(container.getBoundingClientRect().bottom);
+  }, []);
+  const updateTop = (0, _react.useCallback)(() => {
+    _raf.default.cancel(rafIdRef.current);
+    rafIdRef.current = (0, _raf.default)(updatePosition);
+  }, [updatePosition]);
+  (0, _react.useEffect)(() => {
+    if (!value) return;
+    updatePosition();
+    window.addEventListener('scroll', updateTop, {
+      passive: true,
+      capture: true
+    });
+    window.addEventListener('resize', updateTop);
+    return () => {
+      _raf.default.cancel(rafIdRef.current);
+      window.removeEventListener('scroll', updateTop, true);
+      window.removeEventListener('resize', updateTop);
+    };
+  }, [value, updateTop, updatePosition]);
   const changeActive = key => {
     if (value === key) {
       setValue(null);
@@ -108,7 +127,19 @@ const Dropdown = (0, _react.forwardRef)((props, ref) => {
     forceRender: popupForceRender,
     onMaskClick: mergedProps.closeOnMaskClick ? () => {
       changeActive(null);
-    } : undefined
+    } : undefined,
+    afterShow: () => {
+      var _a;
+      (_a = mergedProps.onVisibleChange) === null || _a === void 0 ? void 0 : _a.call(mergedProps, true, {
+        key: cacheKeyRef.current
+      });
+    },
+    afterClose: () => {
+      var _a;
+      (_a = mergedProps.onVisibleChange) === null || _a === void 0 ? void 0 : _a.call(mergedProps, false, {
+        key: cacheKeyRef.current
+      });
+    }
   }, _react.default.createElement("div", {
     ref: contentRef
   }, items.map(item => {

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

@@ -7,6 +7,9 @@ declare const _default: import("react").ForwardRefExoticComponent<{
     closeOnMaskClick?: boolean | undefined;
     closeOnClickAway?: boolean | undefined;
     onChange?: ((key: string | null) => void) | undefined;
+    onVisibleChange?: ((visible: boolean, info: {
+        key: string | null;
+    }) => void) | undefined;
     arrowIcon?: import("react").ReactNode;
     arrow?: import("react").ReactNode;
     getContainer?: import("../../utils/render-to-container").GetContainer | undefined;

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

@@ -1,7 +1,6 @@
-import React from 'react';
-import type { ReactNode, ReactElement } from 'react';
-import { NativeProps } from '../../utils/native-props';
+import type { FC, ReactElement, ReactNode } from 'react';
 import type { ErrorBlockStatus, ImageRecord } from '.';
+import { NativeProps } from '../../utils/native-props';
 import './error-block.less';
 export declare type ErrorBlockProps = {
     status?: ErrorBlockStatus;
@@ -11,4 +10,4 @@ export declare type ErrorBlockProps = {
     fullPage?: boolean;
     children?: ReactNode;
 } & NativeProps<'--image-height' | '--image-height-full-page' | '--image-width' | '--image-width-full-page'>;
-export declare function createErrorBlock(imageRecord: ImageRecord): React.FC<ErrorBlockProps>;
+export declare function createErrorBlock(imageRecord: ImageRecord): FC<ErrorBlockProps>;

package/2x/cjs/components/error-block/create-error-block.js

@@ -4,10 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createErrorBlock = createErrorBlock;
-var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
-var _withDefaultProps = require("../../utils/with-default-props");
+var _react = _interopRequireDefault(require("react"));
 var _nativeProps = require("../../utils/native-props");
+var _withDefaultProps = require("../../utils/with-default-props");
 var _configProvider = require("../config-provider");
 require("./error-block.css");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }