antd-mobile 5.4.0 → 5.6.0

package/es/components/popover/wrapper.js

@@ -0,0 +1,28 @@
+import React from 'react';
+import { findDOMNode } from 'react-dom';
+export class Wrapper extends React.Component {
+  constructor() {
+    super(...arguments);
+    this.element = null;
+  }
+
+  componentDidMount() {
+    this.componentDidUpdate();
+  }
+
+  componentDidUpdate() {
+    // eslint-disable-next-line
+    const node = findDOMNode(this);
+
+    if (node instanceof Element) {
+      this.element = node;
+    } else {
+      this.element = null;
+    }
+  }
+
+  render() {
+    return React.Children.only(this.props.children);
+  }
+
+}

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

@@ -103,15 +103,30 @@ export const PullToRefresh = p => {
 
     const [, y] = state.movement;
 
-    if (state.first) {
-      const element = elementRef.current;
-      if (!element) return;
-      const scrollParent = getScrollParent(element);
-      if (!scrollParent) return;
-      const top = 'scrollTop' in scrollParent ? scrollParent.scrollTop : scrollParent.scrollY;
-
-      if (top <= 0 && y > 0) {
-        pullingRef.current = true;
+    if (state.first && y > 0) {
+      const target = state.event.target;
+      if (!target || !(target instanceof Element)) return;
+      let scrollParent = getScrollParent(target);
+
+      while (true) {
+        if (!scrollParent) return;
+        const scrollTop = getScrollTop(scrollParent);
+
+        if (scrollTop > 0) {
+          return;
+        }
+
+        if (scrollParent instanceof Window) {
+          break;
+        }
+
+        scrollParent = getScrollParent(scrollParent.parentNode);
+      }
+
+      pullingRef.current = true;
+
+      function getScrollTop(element) {
+        return 'scrollTop' in element ? element.scrollTop : element.scrollY;
       }
     }
 

package/es/components/radio/radio.js

@@ -7,6 +7,7 @@ import { mergeProps } from '../../utils/with-default-props';
 import { CheckIcon } from '../checkbox/check-icon';
 import { devWarning } from '../../utils/dev-log';
 import { isDev } from '../../utils/is-dev';
+import { NativeInput } from '../checkbox/native-input';
 const classPrefix = `adm-radio`;
 const defaultProps = {
   defaultChecked: false
@@ -70,16 +71,10 @@ export const Radio = p => {
       [`${classPrefix}-disabled`]: disabled,
       [`${classPrefix}-block`]: props.block
     })
-  }, React.createElement("input", {
+  }, React.createElement(NativeInput, {
     type: 'radio',
     checked: checked,
-    onChange: e => {
-      setChecked(e.target.checked);
-    },
-    onClick: e => {
-      e.stopPropagation();
-      e.nativeEvent.stopImmediatePropagation();
-    },
+    onChange: setChecked,
     disabled: disabled,
     id: props.id
   }), renderIcon(), props.children && React.createElement("div", {

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

@@ -29,4 +29,4 @@ export declare const SearchBar: React.ForwardRefExoticComponent<Pick<InputProps,
     onSearch?: ((val: string) => void) | undefined;
     onChange?: ((val: string) => void) | undefined;
     onCancel?: (() => void) | undefined;
-} & NativeProps<"--border-radius" | "--height" | "--padding-left" | "--placeholder-color" | "--background"> & React.RefAttributes<InputRef>>;
+} & NativeProps<"--border-radius" | "--height" | "--padding-left" | "--background" | "--placeholder-color"> & React.RefAttributes<InputRef>>;

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

@@ -3,7 +3,7 @@ import { NativeProps } from '../../utils/native-props';
 import { BadgeProps } from '../badge';
 export declare type TabBarItemProps = {
     icon?: ReactNode | ((active: boolean) => ReactNode);
-    title?: ReactNode;
+    title?: ReactNode | ((active: boolean) => ReactNode);
     badge?: BadgeProps['content'];
 } & NativeProps;
 export declare const TabBarItem: FC<TabBarItemProps>;

package/es/components/tab-bar/tab-bar.js

@@ -52,7 +52,7 @@ export const TabBar = p => {
       }, typeof item.props.icon === 'function' ? item.props.icon(active) : item.props.icon);
       const titleElement = item.props.title && React.createElement("div", {
         className: `${classPrefix}-item-title`
-      }, item.props.title);
+      }, typeof item.props.title === 'function' ? item.props.title(active) : item.props.title);
 
       if (iconElement) {
         return React.createElement(React.Fragment, null, React.createElement(Badge, {

package/es/components/tree-select/tree-select.js

@@ -47,12 +47,12 @@ export const TreeSelect = p => {
     let current = node;
 
     while (current) {
-      parentNodes.unshift(current);
+      parentNodes.push(current);
       const next = optionsParentMap.get(current[valueName]);
       current = next;
     }
 
-    const values = parentNodes.map(i => i[valueName]);
+    const values = parentNodes.reverse().map(i => i[valueName]);
     setValue(values);
     (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, values, {
       options: parentNodes

package/es/utils/render-imperatively.d.ts

@@ -0,0 +1,10 @@
+import { ReactElement } from 'react';
+declare type ImperativeProps = {
+    visible?: boolean;
+    onClose?: () => void;
+    afterClose?: () => void;
+};
+export declare function renderImperatively(element: ReactElement<ImperativeProps>): {
+    close: () => void;
+};
+export {};

package/es/utils/render-imperatively.js

@@ -0,0 +1,45 @@
+import React, { useEffect, useRef, useState } from 'react';
+import { renderToBody } from './render-to-body';
+export function renderImperatively(element) {
+  let close = () => {};
+
+  const Wrapper = () => {
+    const [visible, setVisible] = useState(false);
+    const closedRef = useRef(false);
+    useEffect(() => {
+      if (!closedRef.current) {
+        setVisible(true);
+      } else {
+        afterClose();
+      }
+    }, []);
+
+    function onClose() {
+      var _a, _b;
+
+      closedRef.current = true;
+      setVisible(false);
+      (_b = (_a = element.props).onClose) === null || _b === void 0 ? void 0 : _b.call(_a);
+    }
+
+    close = onClose;
+
+    function afterClose() {
+      var _a, _b;
+
+      unmount();
+      (_b = (_a = element.props).afterClose) === null || _b === void 0 ? void 0 : _b.call(_a);
+    }
+
+    return React.cloneElement(element, Object.assign(Object.assign({}, element.props), {
+      visible,
+      onClose,
+      afterClose
+    }));
+  };
+
+  const unmount = renderToBody(React.createElement(Wrapper, null));
+  return {
+    close
+  };
+}

package/es/utils/use-props-value.d.ts

@@ -1,7 +1,8 @@
+import { SetStateAction } from 'react';
 declare type Options<T> = {
     value?: T;
     defaultValue: T;
     onChange?: (v: T) => void;
 };
-export declare function usePropsValue<T>(options: Options<T>): readonly [T, (this: unknown, v: T) => void];
+export declare function usePropsValue<T>(options: Options<T>): readonly [T, (this: unknown, v: SetStateAction<T>) => void];
 export {};

package/es/utils/use-props-value.js

@@ -14,12 +14,14 @@ export function usePropsValue(options) {
   }
 
   const setState = useMemoizedFn(v => {
+    const nextValue = typeof v === 'function' ? v(stateRef.current) : v;
+
     if (value === undefined) {
-      stateRef.current = v;
+      stateRef.current = nextValue;
       update();
     }
 
-    onChange === null || onChange === void 0 ? void 0 : onChange(v);
+    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue);
   });
   return [stateRef.current, setState];
 }

package/package.json

@@ -1,7 +1,8 @@
 {
   "name": "antd-mobile",
-  "version": "5.4.0",
+  "version": "5.6.0",
   "dependencies": {
+    "@floating-ui/dom": "^0.3.1",
     "@react-spring/web": "^9.4.3",
     "@types/resize-observer-browser": "^0.1.7",
     "@use-gesture/react": "^10.2.7",
@@ -12,10 +13,8 @@
     "dayjs": "^1.10.8",
     "lodash": "^4.17.21",
     "rc-field-form": "^1.23.1",
-    "rc-tooltip": "^5.1.1",
     "staged-components": "^1.1.2",
-    "tslib": "^2.3.1",
-    "use-async-memo": "^1.2.3"
+    "tslib": "^2.3.1"
   },
   "peerDependencies": {
     "react": "^16.8.0 || ^17.0.0"