antd-mobile 5.31.1 → 5.32.1

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

@@ -5,6 +5,7 @@ import { mergeProps } from '../../utils/with-default-props';
 import { usePropsValue } from '../../utils/use-props-value';
 import { generateDatePickerColumns, convertDateToStringArray, convertStringArrayToDate } from '../date-picker/date-picker-utils';
 import useRenderLabel from './useRenderLabel';
+import { TILL_NOW } from '../date-picker/util';
 const thisYear = new Date().getFullYear();
 const defaultProps = {
   min: new Date(new Date().setFullYear(thisYear - 10)),
@@ -22,7 +23,12 @@ export const DatePickerView = p => {
     defaultValue: (_a = props.defaultValue) !== null && _a !== void 0 ? _a : null
   });
   const mergedRenderLabel = useRenderLabel(renderLabel);
-  const pickerValue = useMemo(() => convertDateToStringArray(value, props.precision), [value, props.precision]);
+  const pickerValue = useMemo(() => {
+    if (value === null || value === void 0 ? void 0 : value.tillNow) {
+      return [TILL_NOW, null, null];
+    }
+    return convertDateToStringArray(value, props.precision);
+  }, [value, props.precision]);
   const onChange = useCallback(val => {
     var _a;
     const date = convertStringArrayToDate(val, props.precision);
@@ -32,7 +38,7 @@ export const DatePickerView = p => {
     }
   }, [props.onChange, props.precision]);
   return withNativeProps(props, React.createElement(PickerView, {
-    columns: selected => generateDatePickerColumns(selected, props.min, props.max, props.precision, mergedRenderLabel, props.filter),
+    columns: selected => generateDatePickerColumns(selected, props.min, props.max, props.precision, mergedRenderLabel, props.filter, props.tillNow),
     loading: props.loading,
     loadingContent: props.loadingContent,
     value: pickerValue,

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

@@ -1,6 +1,6 @@
 import { useClickAway } from 'ahooks';
 import classNames from 'classnames';
-import React, { cloneElement, useEffect, useRef, useState, forwardRef, useImperativeHandle } from 'react';
+import React, { cloneElement, useEffect, useRef, useState, forwardRef, useImperativeHandle, isValidElement } from 'react';
 import Popup from '../popup';
 import { ItemChildrenWrap } from './item';
 import { withNativeProps } from '../../utils/native-props';
@@ -49,7 +49,7 @@ const Dropdown = forwardRef((p, ref) => {
   let popupForceRender = false;
   const items = [];
   const navs = React.Children.map(props.children, child => {
-    if (React.isValidElement(child)) {
+    if (isValidElement(child)) {
       const childProps = Object.assign(Object.assign({}, child.props), {
         onClick: () => {
           changeActive(child.key);

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

@@ -118,18 +118,18 @@ export const Ellipsis = p => {
   useIsomorphicLayoutEffect(() => {
     calcEllipsised();
   }, [props.content, props.direction, props.rows, props.expandText, props.collapseText]);
-  const expandActionElement = exceeded && props.expandText ? withStopPropagation(props.stopPropagationForActionButtons, React.createElement("a", {
+  const expandActionElement = !!props.expandText && withStopPropagation(props.stopPropagationForActionButtons, React.createElement("a", {
     ref: expandElRef,
     onClick: () => {
       setExpanded(true);
     }
-  }, props.expandText)) : null;
-  const collapseActionElement = exceeded && props.collapseText ? withStopPropagation(props.stopPropagationForActionButtons, React.createElement("a", {
+  }, props.expandText));
+  const collapseActionElement = !!props.collapseText && withStopPropagation(props.stopPropagationForActionButtons, React.createElement("a", {
     ref: collapseElRef,
     onClick: () => {
       setExpanded(false);
     }
-  }, props.collapseText)) : null;
+  }, props.collapseText));
   const renderContent = () => {
     if (!exceeded) return props.content;
     if (expanded) return React.createElement(React.Fragment, null, props.content, collapseActionElement);

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

@@ -15,7 +15,7 @@ export function createErrorBlock(imageRecord) {
       locale
     } = useConfig();
     const contentPack = locale.ErrorBlock[props.status];
-    const des = 'description' in props ? props.description : contentPack.description;
+    const desc = 'description' in props ? props.description : contentPack.description;
     const title = 'title' in props ? props.title : contentPack.title;
     const image = (_a = props.image) !== null && _a !== void 0 ? _a : imageRecord[props.status];
     const imageNode = typeof image === 'string' ? React.createElement("img", {
@@ -30,11 +30,11 @@ export function createErrorBlock(imageRecord) {
       className: `${classPrefix}-image`
     }, imageNode), React.createElement("div", {
       className: `${classPrefix}-description`
-    }, title && React.createElement("div", {
+    }, ![undefined, null].includes(title) && React.createElement("div", {
       className: `${classPrefix}-description-title`
-    }, title), des && React.createElement("div", {
+    }, title), ![undefined, null].includes(desc) && React.createElement("div", {
       className: `${classPrefix}-description-subtitle`
-    }, des)), props.children && React.createElement("div", {
+    }, desc)), props.children && React.createElement("div", {
       className: `${classPrefix}-content`
     }, props.children)));
   };

package/2x/es/components/error-block/error-block.css

@@ -21,7 +21,7 @@
 
 .adm-error-block-description {
   font-size: var(--adm-font-size-4);
-  color: #999;
+  color: var(--adm-color-weak);
   line-height: 1.4;
   margin-top: 24px;
 }

package/2x/es/components/floating-panel/floating-panel.js

@@ -7,6 +7,7 @@ import { nearest } from '../../utils/nearest';
 import { mergeProps } from '../../utils/with-default-props';
 import { useLockScroll } from '../../utils/use-lock-scroll';
 import { useMemoizedFn } from 'ahooks';
+const classPrefix = 'adm-floating-panel';
 const defaultProps = {
   handleDraggingOfContent: true
 };
@@ -65,7 +66,7 @@ export const FloatingPanel = forwardRef((p, ref) => {
     const {
       event
     } = state;
-    if (event.cancelable) {
+    if (event.cancelable && supportsPassive) {
       event.preventDefault();
     }
     event.stopPropagation();
@@ -89,7 +90,7 @@ export const FloatingPanel = forwardRef((p, ref) => {
     target: elementRef,
     eventOptions: supportsPassive ? {
       passive: false
-    } : false
+    } : undefined
   });
   useImperativeHandle(ref, () => ({
     setHeight: (height, options) => {
@@ -102,23 +103,23 @@ export const FloatingPanel = forwardRef((p, ref) => {
   useLockScroll(elementRef, true);
   return withNativeProps(props, React.createElement(animated.div, {
     ref: elementRef,
-    className: 'adm-floating-panel',
+    className: classPrefix,
     style: {
       height: Math.round(maxHeight),
       translateY: y.to(y => `calc(100% + (${Math.round(y)}px))`)
     }
   }, React.createElement("div", {
-    className: 'adm-floating-panel-mask',
+    className: `${classPrefix}-mask`,
     style: {
       display: pulling ? 'block' : 'none'
     }
   }), React.createElement("div", {
-    className: 'adm-floating-panel-header',
+    className: `${classPrefix}-header`,
     ref: headerRef
   }, React.createElement("div", {
-    className: 'adm-floating-panel-bar'
+    className: `${classPrefix}-bar`
   })), React.createElement("div", {
-    className: 'adm-floating-panel-content',
+    className: `${classPrefix}-content`,
     ref: contentRef
   }, props.children)));
 });

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

@@ -35,29 +35,25 @@ export const Footer = p => {
     className: classNames(classPrefix)
   }, label && React.createElement("div", {
     className: `${classPrefix}-label`
-  }, React.createElement(Divider, null, label)), links && links.length > 0 && React.createElement("div", {
+  }, React.createElement(Divider, null, label)), !!(links === null || links === void 0 ? void 0 : links.length) && React.createElement("div", {
     className: `${classPrefix}-links`
-  }, links.map((link, index) => {
-    return React.createElement(React.Fragment, {
-      key: index
-    }, React.createElement("a", {
-      href: link.href,
-      rel: 'noopener noreferrer',
-      onClick: event => clickLinkItem(link, index, event)
-    }, link.text), index !== links.length - 1 && React.createElement(Divider, {
-      direction: 'vertical'
-    }));
-  })), content && React.createElement("div", {
+  }, links.map((link, index) => React.createElement(React.Fragment, {
+    key: index
+  }, React.createElement("a", {
+    href: link.href,
+    rel: 'noopener noreferrer',
+    onClick: event => clickLinkItem(link, index, event)
+  }, link.text), index !== links.length - 1 && React.createElement(Divider, {
+    direction: 'vertical'
+  })))), content && React.createElement("div", {
     className: `${classPrefix}-content`
   }, content), chips && chips.length > 0 && React.createElement("div", {
     className: `${classPrefix}-chips`
-  }, chips.map((chip, index) => {
-    return React.createElement("div", {
-      key: index,
-      onClick: () => clickChipItem(chip, index),
-      className: classNames(`${classPrefix}-chip`, {
-        [`${classPrefix}-chip-link`]: chip.type === 'link'
-      })
-    }, chip.text);
-  }))));
+  }, chips.map((chip, index) => React.createElement("div", {
+    key: index,
+    onClick: () => clickChipItem(chip, index),
+    className: classNames(`${classPrefix}-chip`, {
+      [`${classPrefix}-chip-link`]: chip.type === 'link'
+    })
+  }, chip.text)))));
 };

package/2x/es/components/form/form-item.d.ts

@@ -2,8 +2,8 @@ import React, { FC } from 'react';
 import { NativeProps } from '../../utils/native-props';
 import { FormInstance } from 'rc-field-form';
 import type { FieldProps } from 'rc-field-form/lib/Field';
-import { ListItemProps } from '../list';
 import type { FormLayout } from './index';
+import { ListItemProps } from '../list';
 declare type RenderChildren<Values = any> = (form: FormInstance<Values>) => React.ReactNode;
 declare type ChildrenType<Values = any> = RenderChildren<Values> | React.ReactNode;
 declare type RcFieldProps = Omit<FieldProps, 'children'>;

package/2x/es/components/form/form-item.js

@@ -20,7 +20,6 @@ const MemoInput = React.memo(({
 const FormItemLayout = props => {
   var _a;
   const {
-    className,
     style,
     extra,
     label,
@@ -62,7 +61,7 @@ const FormItemLayout = props => {
         return null;
     }
   })();
-  const labelElement = label ? React.createElement("label", {
+  const labelElement = !!label && React.createElement("label", {
     className: `${classPrefix}-label`,
     htmlFor: htmlFor
   }, label, requiredMark, help && React.createElement(Popover, {
@@ -74,21 +73,21 @@ const FormItemLayout = props => {
     onClick: e => {
       e.preventDefault();
     }
-  }, React.createElement(QuestionCircleOutline, null)))) : null;
-  const description = props.description || hasFeedback ? React.createElement(React.Fragment, null, props.description, hasFeedback && React.createElement(React.Fragment, null, props.errors.map((error, index) => React.createElement("div", {
+  }, React.createElement(QuestionCircleOutline, null))));
+  const description = (!!props.description || hasFeedback) && React.createElement(React.Fragment, null, props.description, hasFeedback && React.createElement(React.Fragment, null, props.errors.map((error, index) => React.createElement("div", {
     key: `error-${index}`,
     className: `${classPrefix}-feedback-error`
   }, error)), props.warnings.map((warning, index) => React.createElement("div", {
     key: `warning-${index}`,
     className: `${classPrefix}-feedback-warning`
-  }, warning)))) : null;
+  }, warning))));
   return withNativeProps(props, React.createElement(List.Item, {
     style: style,
     title: layout === 'vertical' && labelElement,
     prefix: layout === 'horizontal' && labelElement,
     extra: extra,
     description: description,
-    className: classNames(classPrefix, className, `${classPrefix}-${layout}`, {
+    className: classNames(classPrefix, `${classPrefix}-${layout}`, {
       [`${classPrefix}-hidden`]: hidden,
       [`${classPrefix}-has-error`]: props.errors.length
     }),
@@ -105,7 +104,6 @@ const FormItemLayout = props => {
 export const FormItem = props => {
   const {
       // 样式相关
-      className,
       style,
       // FormItem 相关
       label,
@@ -132,7 +130,7 @@ export const FormItem = props => {
       clickable,
       arrow
     } = props,
-    fieldProps = __rest(props, ["className", "style", "label", "help", "extra", "hasFeedback", "name", "required", "noStyle", "hidden", "layout", "childElementPosition", "description", "disabled", "rules", "children", "messageVariables", "trigger", "validateTrigger", "onClick", "shouldUpdate", "dependencies", "clickable", "arrow"]);
+    fieldProps = __rest(props, ["style", "label", "help", "extra", "hasFeedback", "name", "required", "noStyle", "hidden", "layout", "childElementPosition", "description", "disabled", "rules", "children", "messageVariables", "trigger", "validateTrigger", "onClick", "shouldUpdate", "dependencies", "clickable", "arrow"]);
   const {
     name: formName
   } = useContext(FormContext);
@@ -180,7 +178,6 @@ export const FormItem = props => {
       return subWarnings;
     }, curWarnings);
     return withNativeProps(props, React.createElement(FormItemLayout, {
-      className: className,
       style: style,
       label: label,
       extra: extra,

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

@@ -27,5 +27,5 @@
 
 .adm-form-list-operation {
   text-align: center;
-  color: #1677ff;
+  color: var(--adm-color-primary);
 }

package/2x/es/components/form/index.css

@@ -27,7 +27,7 @@
 
 .adm-form-list-operation {
   text-align: center;
-  color: #1677ff;
+  color: var(--adm-color-primary);
 }
 
 .adm-form-item + .adm-form-item {

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

@@ -88,7 +88,7 @@
 }
 
 .adm-image-uploader-upload-button-wrap .adm-image-uploader-upload-button-icon {
-  color: #999999;
+  color: var(--adm-color-weak);
   font-size: 64px;
 }
 

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

@@ -95,9 +95,7 @@ export const ImageUploader = p => {
       let files = [].slice.call(rawFiles);
       e.target.value = ''; // HACK: fix the same file doesn't trigger onChange
       if (props.beforeUpload) {
-        const postFiles = files.map(file => {
-          return processFile(file, files);
-        });
+        const postFiles = files.map(file => processFile(file, files));
         yield Promise.all(postFiles).then(filesList => {
           files = filesList.filter(Boolean);
         });

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

@@ -4,13 +4,10 @@ declare type NativeInputProps = React.DetailedHTMLProps<React.InputHTMLAttribute
 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' | 'id'> & {
+export declare type InputProps = Pick<NativeInputProps, 'maxLength' | 'minLength' | 'autoComplete' | 'autoFocus' | 'pattern' | 'inputMode' | 'type' | 'name' | 'onFocus' | 'onBlur' | 'autoCapitalize' | 'autoCorrect' | 'onKeyDown' | 'onKeyUp' | 'onCompositionStart' | 'onCompositionEnd' | 'onClick' | 'step' | 'id' | 'placeholder' | 'readOnly' | 'disabled'> & {
     value?: string;
     defaultValue?: string;
     onChange?: (val: string) => void;
-    placeholder?: string;
-    disabled?: boolean;
-    readOnly?: boolean;
     clearable?: boolean;
     onlyShowClearWhenFocus?: boolean;
     onClear?: () => void;
@@ -25,13 +22,10 @@ export declare type InputRef = {
     blur: () => void;
     nativeElement: HTMLInputElement | null;
 };
-export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProps, "pattern" | "id" | "onClick" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "onKeyDown" | "onKeyUp" | "type" | "step" | "autoFocus" | "autoCapitalize" | "autoCorrect" | "inputMode" | "name" | "autoComplete" | "maxLength" | "minLength"> & {
+export declare const Input: React.ForwardRefExoticComponent<Pick<NativeInputProps, "pattern" | "id" | "onClick" | "disabled" | "onCompositionEnd" | "onCompositionStart" | "onFocus" | "onBlur" | "onKeyDown" | "onKeyUp" | "type" | "step" | "autoFocus" | "placeholder" | "autoCapitalize" | "autoCorrect" | "inputMode" | "name" | "readOnly" | "autoComplete" | "maxLength" | "minLength"> & {
     value?: string | undefined;
     defaultValue?: string | undefined;
     onChange?: ((val: string) => void) | undefined;
-    placeholder?: string | undefined;
-    disabled?: boolean | undefined;
-    readOnly?: boolean | undefined;
     clearable?: boolean | undefined;
     onlyShowClearWhenFocus?: boolean | undefined;
     onClear?: (() => void) | undefined;

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

@@ -57,7 +57,11 @@ export const Input = forwardRef((p, ref) => {
   function checkValue() {
     let nextValue = value;
     if (props.type === 'number') {
-      nextValue = nextValue && bound(parseFloat(nextValue), props.min, props.max).toString();
+      const boundValue = nextValue && bound(parseFloat(nextValue), props.min, props.max).toString();
+      // fix the display issue of numbers starting with 0
+      if (Number(nextValue) !== Number(boundValue)) {
+        nextValue = boundValue;
+      }
     }
     if (nextValue !== value) {
       setValue(nextValue);

package/2x/es/components/jumbo-tabs/jumbo-tabs.js

@@ -1,4 +1,4 @@
-import React, { useRef } from 'react';
+import React, { isValidElement, useRef } from 'react';
 import classNames from 'classnames';
 import { animated } from '@react-spring/web';
 import { withNativeProps } from '../../utils/native-props';
@@ -20,7 +20,7 @@ export const JumboTabs = props => {
   let firstActiveKey = null;
   const panes = [];
   traverseReactNode(props.children, (child, index) => {
-    if (!React.isValidElement(child)) return;
+    if (!isValidElement(child)) return;
     const key = child.key;
     if (typeof key !== 'string') return;
     if (index === 0) {

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

@@ -31,19 +31,17 @@ export const Modal = p => {
     direction: 'vertical',
     block: true,
     className: classNames(cls('footer'), props.actions.length === 0 && cls('footer-empty'))
-  }, props.actions.map((action, index) => {
-    return React.createElement(ModalActionButton, {
-      key: action.key,
-      action: action,
-      onAction: () => __awaiter(void 0, void 0, void 0, function* () {
-        var _a, _b, _c;
-        yield Promise.all([(_a = action.onClick) === null || _a === void 0 ? void 0 : _a.call(action), (_b = props.onAction) === null || _b === void 0 ? void 0 : _b.call(props, action, index)]);
-        if (props.closeOnAction) {
-          (_c = props.onClose) === null || _c === void 0 ? void 0 : _c.call(props);
-        }
-      })
-    });
-  })));
+  }, props.actions.map((action, index) => React.createElement(ModalActionButton, {
+    key: action.key,
+    action: action,
+    onAction: () => __awaiter(void 0, void 0, void 0, function* () {
+      var _a, _b, _c;
+      yield Promise.all([(_a = action.onClick) === null || _a === void 0 ? void 0 : _a.call(action), (_b = props.onAction) === null || _b === void 0 ? void 0 : _b.call(props, action, index)]);
+      if (props.closeOnAction) {
+        (_c = props.onClose) === null || _c === void 0 ? void 0 : _c.call(props);
+      }
+    })
+  }))));
   return React.createElement(CenterPopup, {
     className: classNames(cls(), props.className),
     style: props.style,

package/2x/es/components/notice-bar/notice-bar.css

@@ -1,6 +1,6 @@
 .adm-notice-bar {
   --background-color: #ababab;
-  --border-color: #999999;
+  --border-color: var(--adm-color-weak);
   --text-color: var(--adm-color-text-light-solid);
   --font-size: var(--adm-font-size-7);
   --icon-font-size: var(--adm-font-size-10);
@@ -38,7 +38,7 @@
 .adm-notice-bar.adm-notice-bar-info {
   --background-color: #d0e4ff;
   --border-color: #bcd8ff;
-  --text-color: #1677ff;
+  --text-color: var(--adm-color-primary);
 }
 
 .adm-notice-bar .adm-notice-bar-left {

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

@@ -87,9 +87,9 @@
   left: 50%;
   width: 100%;
   height: 100%;
-  background-color: #000;
+  background-color: var(--adm-color-text-dark-solid);
   border: inherit;
-  border-color: #000;
+  border-color: var(--adm-color-text-dark-solid);
   border-radius: inherit;
   transform: translate(-50%, -50%);
   opacity: 0;

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

@@ -69,17 +69,66 @@ export const Wheel = memo(props => {
     if (!item) return;
     onSelect(item.value);
   }
+  const handleGestureState = state => {
+    const {
+      direction: [, direction],
+      distance: [, distance],
+      velocity: [, velocity],
+      offset: [, offset],
+      last
+    } = state;
+    return {
+      direction,
+      distance,
+      velocity,
+      offset,
+      last
+    };
+  };
   const handleDrag = state => {
     draggingRef.current = true;
     const min = -((column.length - 1) * itemHeight.current);
     const max = 0;
-    if (state.last) {
+    const {
+      direction,
+      last,
+      velocity,
+      offset
+    } = handleGestureState(state);
+    if (last) {
+      draggingRef.current = false;
+      const position = offset + velocity * direction * 50;
+      const boundNum = bound(position, min, max);
+      const targetIndex = -Math.round(boundNum / itemHeight.current);
+      scrollSelect(targetIndex);
+    } else {
+      const position = offset;
+      api.start({
+        y: rubberbandIfOutOfBounds(position, min, max, itemHeight.current * 50, 0.2)
+      });
+    }
+  };
+  const handleWheel = state => {
+    draggingRef.current = true;
+    const min = -((column.length - 1) * itemHeight.current);
+    const max = 0;
+    const {
+      direction,
+      last,
+      velocity,
+      distance
+    } = handleGestureState(state);
+    const whellDir = -direction; // 取反
+    const scrollY = y.get();
+    if (last) {
       draggingRef.current = false;
-      const position = state.offset[1] + state.velocity[1] * state.direction[1] * 50;
-      const targetIndex = min < max ? -Math.round(bound(position, min, max) / itemHeight.current) : 0;
+      const speed = velocity * whellDir * 50;
+      const position = scrollY + distance * whellDir + speed;
+      const boundNum = bound(position, min, max);
+      const targetIndex = -Math.round(boundNum / itemHeight.current);
       scrollSelect(targetIndex);
     } else {
-      const position = state.offset[1];
+      const position = scrollY + distance * whellDir;
       api.start({
         y: rubberbandIfOutOfBounds(position, min, max, itemHeight.current * 50, 0.2)
       });
@@ -99,15 +148,15 @@ export const Wheel = memo(props => {
   });
   useWheel(state => {
     state.event.stopPropagation();
-    handleDrag(state);
+    handleWheel(state);
   }, {
+    target: props.mouseWheel ? rootRef : undefined,
     axis: 'y',
     from: () => [0, y.get()],
     preventDefault: true,
-    target: props.mouseWheel ? rootRef : undefined,
     eventOptions: supportsPassive ? {
       passive: false
-    } : false
+    } : undefined
   });
   let selectedIndex = null;
   function renderAccessible() {
@@ -120,13 +169,13 @@ export const Wheel = memo(props => {
     const previous = column[previousIndex];
     const next = column[nextIndex];
     return React.createElement("div", {
-      className: 'adm-picker-view-column-accessible'
+      className: `${classPrefix}-column-accessible`
     }, React.createElement("div", {
-      className: 'adm-picker-view-column-accessible-current',
+      className: `${classPrefix}-column-accessible-current`,
       role: 'button',
       "aria-label": current ? `当前选择的是：${current.label}` : '当前未选择'
     }, "-"), React.createElement("div", {
-      className: 'adm-picker-view-column-accessible-button',
+      className: `${classPrefix}-column-accessible-button`,
       onClick: () => {
         if (!previous) return;
         scrollSelect(previousIndex);
@@ -134,7 +183,7 @@ export const Wheel = memo(props => {
       role: previous ? 'button' : 'text',
       "aria-label": !previous ? '没有上一项' : `选择上一项：${previous.label}`
     }, "-"), React.createElement("div", {
-      className: 'adm-picker-view-column-accessible-button',
+      className: `${classPrefix}-column-accessible-button`,
       onClick: () => {
         if (!next) return;
         scrollSelect(nextIndex);
@@ -180,9 +229,7 @@ export const Wheel = memo(props => {
   if (prev.onSelect !== next.onSelect) return false;
   if (prev.renderLabel !== next.renderLabel) return false;
   if (prev.mouseWheel !== next.mouseWheel) return false;
-  if (!isEqual(prev.column, next.column)) {
-    return false;
-  }
+  if (!isEqual(prev.column, next.column)) return false;
   return true;
 });
 Wheel.displayName = 'Wheel';

package/2x/es/components/popover/popover-menu.css

@@ -1,5 +1,5 @@
 .adm-popover-menu {
-  --border-color: #eeeeee;
+  --border-color: var(--adm-color-border);
 }
 
 .adm-popover-menu.adm-popover {
@@ -58,6 +58,6 @@
 }
 
 .adm-popover.adm-popover-dark.adm-popover-menu {
-  --border-color: #333333;
+  --border-color: var(--adm-color-text);
   --background: rgba(0, 0, 0, 0.9);
 }

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

@@ -31,13 +31,11 @@ export const Popover = forwardRef((p, ref) => {
     defaultValue: props.defaultVisible,
     onChange: props.onVisibleChange
   });
-  useImperativeHandle(ref, () => {
-    return {
-      show: () => setVisible(true),
-      hide: () => setVisible(false),
-      visible
-    };
-  }, [visible]);
+  useImperativeHandle(ref, () => ({
+    show: () => setVisible(true),
+    hide: () => setVisible(false),
+    visible
+  }), [visible]);
   const targetRef = useRef(null);
   const floatingRef = useRef(null);
   const arrowRef = useRef(null);

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

@@ -21,18 +21,18 @@ const defaultProps = Object.assign(Object.assign({}, defaultPopupBaseProps), {
 });
 export const Popup = p => {
   const props = mergeProps(defaultProps, p);
+  const bodyCls = classNames(`${classPrefix}-body`, props.bodyClassName, `${classPrefix}-body-position-${props.position}`);
   const {
     locale
   } = useConfig();
-  const bodyCls = classNames(`${classPrefix}-body`, props.bodyClassName, `${classPrefix}-body-position-${props.position}`);
   const [active, setActive] = useState(props.visible);
+  const ref = useRef(null);
+  useLockScroll(ref, props.disableBodyScroll && active ? 'strict' : false);
   useIsomorphicLayoutEffect(() => {
     if (props.visible) {
       setActive(true);
     }
   }, [props.visible]);
-  const ref = useRef(null);
-  useLockScroll(ref, props.disableBodyScroll && active ? 'strict' : false);
   const unmountedRef = useUnmountedRef();
   const {
     percent

package/2x/es/components/progress-bar/progress-bar.css

@@ -24,7 +24,7 @@
   flex: none;
   width: calc(var(--text-width) + 16px);
   padding-left: 16px;
-  color: #999999;
+  color: var(--adm-color-weak);
 }
 
 .adm-progress-bar-rounded .adm-progress-bar-trail,