antd-mobile 5.0.0-beta.9 → 5.0.0-rc.3

package/2x/cjs/locales/base.d.ts

@@ -1,9 +1,37 @@
 export declare const base: {
     common: {
+        confirm: string;
         cancel: string;
     };
+    Cascader: {
+        placeholder: string;
+    };
     Dialog: {
         ok: string;
     };
+    ErrorBlock: {
+        default: {
+            title: string;
+            description: string;
+        };
+        busy: {
+            title: string;
+            description: string;
+        };
+        disconnected: {
+            title: string;
+            description: string;
+        };
+        empty: {
+            title: string;
+            description: string;
+        };
+    };
+    ImageUploader: {
+        uploading: string;
+    };
+    Mask: {
+        name: string;
+    };
 };
 export declare type Locale = typeof base;

package/2x/cjs/locales/base.js

@@ -6,10 +6,38 @@ Object.defineProperty(exports, "__esModule", {
 exports.base = void 0;
 var base = {
   common: {
+    confirm: 'Confirm',
     cancel: 'Cancel'
   },
+  Cascader: {
+    placeholder: 'Selecting'
+  },
   Dialog: {
     ok: 'OK'
+  },
+  ErrorBlock: {
+    "default": {
+      title: 'Oops, something went wrong',
+      description: 'Please wait a minute and try again'
+    },
+    busy: {
+      title: 'Oops, not loading',
+      description: 'Try to refresh the page'
+    },
+    disconnected: {
+      title: 'Network is busy',
+      description: 'Try to refresh the page'
+    },
+    empty: {
+      title: "Hmm, couldn't find that...",
+      description: 'Want to try a new search?'
+    }
+  },
+  ImageUploader: {
+    uploading: 'Uploading...'
+  },
+  Mask: {
+    name: 'Mask'
   }
 };
 exports.base = base;

package/2x/cjs/locales/en-US.d.ts

@@ -1,9 +1,37 @@
 declare const enUS: {
     common: {
+        confirm: string;
         cancel: string;
     };
+    Cascader: {
+        placeholder: string;
+    };
     Dialog: {
         ok: string;
     };
+    ErrorBlock: {
+        default: {
+            title: string;
+            description: string;
+        };
+        busy: {
+            title: string;
+            description: string;
+        };
+        disconnected: {
+            title: string;
+            description: string;
+        };
+        empty: {
+            title: string;
+            description: string;
+        };
+    };
+    ImageUploader: {
+        uploading: string;
+    };
+    Mask: {
+        name: string;
+    };
 };
 export default enUS;

package/2x/cjs/locales/zh-CN.d.ts

@@ -1,9 +1,37 @@
 declare const zhCN: {
     common: {
+        confirm: string;
         cancel: string;
     };
+    Cascader: {
+        placeholder: string;
+    };
     Dialog: {
         ok: string;
     };
+    ErrorBlock: {
+        default: {
+            title: string;
+            description: string;
+        };
+        busy: {
+            title: string;
+            description: string;
+        };
+        disconnected: {
+            title: string;
+            description: string;
+        };
+        empty: {
+            title: string;
+            description: string;
+        };
+    };
+    ImageUploader: {
+        uploading: string;
+    };
+    Mask: {
+        name: string;
+    };
 };
 export default zhCN;

package/2x/cjs/locales/zh-CN.js

@@ -11,10 +11,38 @@ var _base = require("./base");
 
 var zhCN = (0, _mergeLocale.mergeLocale)(_base.base, {
   common: {
+    confirm: '确定',
     cancel: '取消'
   },
+  Cascader: {
+    placeholder: '请选择'
+  },
   Dialog: {
     ok: '我知道了'
+  },
+  ErrorBlock: {
+    "default": {
+      title: '页面遇到一些小问题',
+      description: '待会来试试'
+    },
+    busy: {
+      title: '前方拥堵',
+      description: '刷新试试'
+    },
+    disconnected: {
+      title: '网络有点忙',
+      description: '动动手指帮忙修复'
+    },
+    empty: {
+      title: '没有找到你需要的东西',
+      description: '找找其他的吧'
+    }
+  },
+  ImageUploader: {
+    uploading: '上传中...'
+  },
+  Mask: {
+    name: '遮罩层'
   }
 });
 var _default = zhCN;

package/2x/cjs/utils/can-use-dom.js

@@ -4,5 +4,5 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.canUseDom = void 0;
-var canUseDom = !!(typeof window !== 'undefined' && window.document && window.document.createElement);
+var canUseDom = !!(typeof window !== 'undefined' && typeof document !== 'undefined' && window.document && window.document.createElement);
 exports.canUseDom = canUseDom;

package/2x/cjs/utils/convert-px.js

@@ -7,15 +7,36 @@ exports.convertPx = convertPx;
 
 var _canUseDom = require("./can-use-dom");
 
+var _isDev = require("./is-dev");
+
+var _devLog = require("./dev-log");
+
+var tenPxTester = null;
 var tester = null;
 
 if (_canUseDom.canUseDom) {
+  tenPxTester = document.createElement('div');
+  tenPxTester.className = 'adm-px-tester';
+  tenPxTester.style.setProperty('--size', '10');
+  document.body.appendChild(tenPxTester);
   tester = document.createElement('div');
-  tester.className = 'adm-one-px-tester';
+  tester.className = 'adm-px-tester';
   document.body.appendChild(tester);
+
+  if (_isDev.isDev) {
+    if (window.getComputedStyle(tester).position !== 'fixed') {
+      (0, _devLog.devError)('Global', 'The px tester is not rendering properly. Please make sure you have imported `antd-mobile/es/global`.');
+    }
+  }
 }
 
 function convertPx(px) {
-  var ratio = (tester === null || tester === void 0 ? void 0 : tester.getBoundingClientRect().height) || 1;
-  return px * ratio;
+  if (tenPxTester === null || tester === null) return px;
+
+  if (tenPxTester.getBoundingClientRect().height === 10) {
+    return px;
+  }
+
+  tester.style.setProperty('--size', px.toString());
+  return tester.getBoundingClientRect().height;
 }

package/2x/cjs/utils/dev-log.d.ts

@@ -1 +1,2 @@
 export declare function devWarning(component: string, message: string): void;
+export declare function devError(component: string, message: string): void;

package/2x/cjs/utils/dev-log.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.devError = devError;
 exports.devWarning = devWarning;
 
 var _isDev = require("./is-dev");
@@ -11,4 +12,10 @@ function devWarning(component, message) {
   if (_isDev.isDev) {
     console.warn("[antd-mobile: " + component + "] " + message);
   }
+}
+
+function devError(component, message) {
+  if (_isDev.isDev) {
+    console.error("[antd-mobile: " + component + "] " + message);
+  }
 }

package/2x/cjs/utils/get-container.d.ts

@@ -1 +1 @@
-export declare function resolveContainer(getContainer: HTMLElement | (() => HTMLElement) | undefined): HTMLElement;
+export declare function resolveContainer(getContainer: HTMLElement | (() => HTMLElement) | undefined | null): HTMLElement;

package/2x/cjs/utils/get-scroll-parent.d.ts

@@ -1,3 +1,3 @@
 declare type ScrollElement = HTMLElement | Window;
-export declare function getScrollParent(el: Element, root?: ScrollElement | undefined): Window | Element | undefined;
+export declare function getScrollParent(el: Element, root?: ScrollElement | null | undefined): Window | Element | null | undefined;
 export {};

package/2x/cjs/utils/get-scroll-parent.js

@@ -5,10 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getScrollParent = getScrollParent;
 
-var _inBrowser = require("./in-browser");
+var _canUseDom = require("./can-use-dom");
 
 var overflowScrollReg = /scroll|auto/i;
-var defaultRoot = _inBrowser.inBrowser ? window : undefined;
+var defaultRoot = _canUseDom.canUseDom ? window : undefined;
 
 function isElement(node) {
   var ELEMENT_NODE_TYPE = 1;

package/2x/cjs/utils/merge-locale.js

@@ -5,8 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.mergeLocale = mergeLocale;
 
-var _lodash = require("lodash");
+var _cloneDeep = _interopRequireDefault(require("lodash/cloneDeep"));
+
+var _merge = _interopRequireDefault(require("lodash/merge"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function mergeLocale(base, patch) {
-  return (0, _lodash.merge)((0, _lodash.cloneDeep)(base), patch);
+  return (0, _merge["default"])((0, _cloneDeep["default"])(base), patch);
 }

package/2x/cjs/utils/native-props.d.ts

@@ -3,5 +3,6 @@ import type { CSSProperties, ReactElement } from 'react';
 export interface NativeProps<S extends string = never> {
     className?: string;
     style?: CSSProperties & Partial<Record<S, string>>;
+    tabIndex?: number;
 }
 export declare function withNativeProps<P extends NativeProps>(props: P, element: ReactElement): React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)>;

package/2x/cjs/utils/native-props.js

@@ -22,6 +22,10 @@ function withNativeProps(props, element) {
     p.style = Object.assign(Object.assign({}, p.style), props.style);
   }
 
+  if (props.tabIndex !== undefined) {
+    p.tabIndex = props.tabIndex;
+  }
+
   for (var key in props) {
     if (!props.hasOwnProperty(key)) continue;
 

package/2x/cjs/utils/render-to-container.js

@@ -9,8 +9,10 @@ var _reactDom = require("react-dom");
 
 var _getContainer = require("./get-container");
 
+var _canUseDom = require("./can-use-dom");
+
 function renderToContainer(getContainer, node) {
-  if (getContainer) {
+  if (_canUseDom.canUseDom && getContainer) {
     var container = (0, _getContainer.resolveContainer)(getContainer);
     return /*#__PURE__*/(0, _reactDom.createPortal)(node, container);
   }

package/2x/cjs/utils/shuffle.d.ts

@@ -0,0 +1,6 @@
+/**
+ * 数组打乱
+ * @param array 任意数组
+ * @returns any[] 打乱后的数组
+ */
+export declare function shuffle(array: any[]): any[];

package/2x/cjs/utils/shuffle.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.shuffle = shuffle;
+
+/**
+ * 数组打乱
+ * @param array 任意数组
+ * @returns any[] 打乱后的数组
+ */
+function shuffle(array) {
+  var result = [].concat(array);
+
+  for (var i = result.length; i > 0; i--) {
+    var j = Math.floor(Math.random() * i);
+    var _ref = [result[j], result[i - 1]];
+    result[i - 1] = _ref[0];
+    result[j] = _ref[1];
+  }
+
+  return result;
+}

package/2x/cjs/utils/supports-passive.js

@@ -5,12 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.supportsPassive = void 0;
 
-var _inBrowser = require("./in-browser");
+var _canUseDom = require("./can-use-dom");
 
 var supportsPassive = false;
 exports.supportsPassive = supportsPassive;
 
-if (_inBrowser.inBrowser) {
+if (_canUseDom.canUseDom) {
   try {
     var opts = {};
     Object.defineProperty(opts, 'passive', {

package/2x/cjs/utils/to-css-length.d.ts

@@ -0,0 +1 @@
+export declare function toCSSLength(val: string | number): string;

package/2x/cjs/utils/to-css-length.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.toCSSLength = toCSSLength;
+
+function toCSSLength(val) {
+  return typeof val === 'number' ? val + "px" : val;
+}

package/2x/cjs/utils/use-lock-scroll.js

@@ -11,7 +11,7 @@ var _react = require("react");
 
 var _getScrollParent = require("./get-scroll-parent");
 
-var _supportsPassive = require("../utils/supports-passive");
+var _supportsPassive = require("./supports-passive");
 
 var totalLockCount = 0;
 var BODY_LOCK_CLASS = 'adm-overflow-hidden'; // 移植自vant：https://github.com/youzan/vant/blob/HEAD/src/composables/use-lock-scroll.ts
@@ -23,6 +23,7 @@ function useLockScroll(rootRef, shouldLock) {
     touch.move(event);
     var direction = touch.deltaY.current > 0 ? '10' : '01';
     var el = (0, _getScrollParent.getScrollParent)(event.target, rootRef.current);
+    if (!el) return;
     var scrollHeight = el.scrollHeight,
         offsetHeight = el.offsetHeight,
         scrollTop = el.scrollTop;
@@ -35,11 +36,9 @@ function useLockScroll(rootRef, shouldLock) {
     }
 
     if (status !== '11' && touch.isVertical() && !(parseInt(status, 2) & parseInt(direction, 2))) {
-      if (typeof event.cancelable !== 'boolean' || event.cancelable) {
+      if (event.cancelable) {
         event.preventDefault();
       }
-
-      event.stopPropagation();
     }
   };
 

package/2x/cjs/utils/use-mutation-effect.d.ts

@@ -0,0 +1,2 @@
+import { RefObject } from 'react';
+export declare function useMutationEffect(effect: () => void, targetRef: RefObject<HTMLElement>, options: MutationObserverInit): void;

package/2x/cjs/utils/use-mutation-effect.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useMutationEffect = useMutationEffect;
+
+var _react = require("react");
+
+var _ahooks = require("ahooks");
+
+function useMutationEffect(effect, targetRef, options) {
+  var fn = (0, _ahooks.usePersistFn)(effect);
+  (0, _react.useEffect)(function () {
+    var observer = new MutationObserver(function () {
+      fn();
+    });
+    if (!targetRef.current) return;
+    observer.observe(targetRef.current, options);
+    return function () {
+      observer.disconnect();
+    };
+  }, [targetRef]);
+}

package/{cjs/utils/use-controllable-value.d.ts → 2x/cjs/utils/use-props-value.d.ts}

@@ -3,5 +3,5 @@ declare type Options<T> = {
     defaultValue: T;
     onChange?: (v: T) => void;
 };
-export declare function useNewControllableValue<T>(options: Options<T>): readonly [T, (v: T) => void];
+export declare function usePropsValue<T>(options: Options<T>): readonly [T, (v: T) => void];
 export {};

package/2x/cjs/utils/{use-controllable-value.js → use-props-value.js}

@@ -3,13 +3,13 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useNewControllableValue = useNewControllableValue;
+exports.usePropsValue = usePropsValue;
 
 var _react = require("react");
 
 var _ahooks = require("ahooks");
 
-function useNewControllableValue(options) {
+function usePropsValue(options) {
   var value = options.value,
       defaultValue = options.defaultValue,
       onChange = options.onChange;
@@ -20,13 +20,13 @@ function useNewControllableValue(options) {
     stateRef.current = value;
   }
 
-  var setState = (0, _react.useCallback)(function (v) {
+  var setState = (0, _ahooks.usePersistFn)(function (v) {
     if (value === undefined) {
       stateRef.current = v;
       update();
     }
 
     onChange === null || onChange === void 0 ? void 0 : onChange(v);
-  }, [value, update, onChange]);
+  });
   return [stateRef.current, setState];
 }

package/2x/cjs/utils/use-resize-effect.d.ts

@@ -0,0 +1,2 @@
+import { RefObject } from 'react';
+export declare function useResizeEffect<T extends HTMLElement>(effect: (target: T) => void, targetRef: RefObject<T>): void;

package/2x/cjs/utils/use-resize-effect.js

@@ -0,0 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useResizeEffect = useResizeEffect;
+
+var _react = require("react");
+
+var _ahooks = require("ahooks");
+
+function useResizeEffect(effect, targetRef) {
+  var fn = (0, _ahooks.usePersistFn)(effect);
+  (0, _react.useLayoutEffect)(function () {
+    var target = targetRef.current;
+    if (!target) return;
+
+    if (window.ResizeObserver) {
+      var observer = new ResizeObserver(function () {
+        fn(target);
+      });
+      observer.observe(target);
+      return function () {
+        observer.disconnect();
+      };
+    } else {
+      fn(target);
+    }
+  }, [targetRef]);
+}

package/2x/cjs/utils/use-should-render.d.ts

@@ -0,0 +1 @@
+export declare function useShouldRender(active: boolean, forceRender?: boolean, destroyOnClose?: boolean): boolean;

package/2x/cjs/utils/use-should-render.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useShouldRender = useShouldRender;
+
+var _useInitialized = require("./use-initialized");
+
+function useShouldRender(active, forceRender, destroyOnClose) {
+  var initialized = (0, _useInitialized.useInitialized)(active);
+  if (forceRender) return true;
+  if (active) return true;
+  if (!initialized) return false;
+  return !destroyOnClose;
+}

package/2x/cjs/utils/use-tab-list-scroll.d.ts

@@ -0,0 +1,5 @@
+import { RefObject } from 'react';
+export declare const useTabListScroll: (targetRef: RefObject<HTMLElement>, activeIndex: number) => {
+    scrollLeft: import("@react-spring/web").SpringValue<number>;
+    animate: (immediate?: boolean) => void;
+};

package/2x/cjs/utils/use-tab-list-scroll.js

@@ -0,0 +1,77 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useTabListScroll = void 0;
+
+var _react = require("react");
+
+var _web = require("@react-spring/web");
+
+var _useMutationEffect = require("./use-mutation-effect");
+
+var _bound = require("./bound");
+
+var _ahooks = require("ahooks");
+
+var useTabListScroll = function useTabListScroll(targetRef, activeIndex) {
+  var _useSpring = (0, _web.useSpring)(function () {
+    return {
+      scrollLeft: 0,
+      config: {
+        tension: 300,
+        clamp: true
+      }
+    };
+  }),
+      scrollLeft = _useSpring[0].scrollLeft,
+      api = _useSpring[1];
+
+  function animate(immediate) {
+    if (immediate === void 0) {
+      immediate = false;
+    }
+
+    var container = targetRef.current;
+    if (!container) return;
+    if (!activeIndex) return;
+    var activeTabWrapper = container.children.item(activeIndex);
+    var activeTab = activeTabWrapper.children.item(0);
+    var activeTabLeft = activeTab.offsetLeft;
+    var activeTabWidth = activeTab.offsetWidth;
+    var containerWidth = container.offsetWidth;
+    var containerScrollWidth = container.scrollWidth;
+    var containerScrollLeft = container.scrollLeft;
+    var maxScrollDistance = containerScrollWidth - containerWidth;
+    if (maxScrollDistance <= 0) return;
+    var nextScrollLeft = (0, _bound.bound)(activeTabLeft - (containerWidth - activeTabWidth) / 2, 0, containerScrollWidth - containerWidth);
+    api.start({
+      scrollLeft: nextScrollLeft,
+      from: {
+        scrollLeft: containerScrollLeft
+      },
+      immediate: immediate
+    });
+  }
+
+  (0, _react.useLayoutEffect)(function () {
+    animate(true);
+  }, []);
+  (0, _ahooks.useUpdateLayoutEffect)(function () {
+    animate();
+  }, [activeIndex]);
+  (0, _useMutationEffect.useMutationEffect)(function () {
+    animate(true);
+  }, targetRef, {
+    subtree: true,
+    childList: true,
+    characterData: true
+  });
+  return {
+    scrollLeft: scrollLeft,
+    animate: animate
+  };
+};
+
+exports.useTabListScroll = useTabListScroll;