@arco-design/mobile-react 2.30.8 → 2.30.10

package/umd/image/style/index.less

@@ -1,11 +1,11 @@
-@import "../../../style/mixin.less";
+@import '../../../style/mixin.less';
 
 .@{prefix}-image {
     display: inline-block;
     position: relative;
 
     &.preview {
-        transition: all .3s ease-in-out;
+        transition: all 0.3s ease-in-out;
 
         .image-container,
         .image-loading-container .image-loading,
@@ -109,7 +109,6 @@
     }
 
     .image-error-container {
-
         .image-retry-load {
             position: absolute;
             top: 0;
@@ -127,7 +126,6 @@
     }
 
     .image-loading-container {
-
         .image-loading {
             position: absolute;
             top: 0;

package/umd/image-preview/methods.js

@@ -21,9 +21,7 @@
 
   function open(Component) {
     return function (config, context) {
-      var baseProps = (0, _extends2.default)({
-        unmountOnExit: true
-      }, config || {}, {
+      var baseProps = (0, _extends2.default)({}, config || {}, {
         close: function close() {}
       }); // 不同的key用不同的容器挂载
       // @en Different keys are mounted in different containers
@@ -59,10 +57,7 @@
 
       dynamicProps.onClose = function () {
         baseProps.onClose && baseProps.onClose();
-
-        if (baseProps.unmountOnExit) {
-          (0, _mobileUtils.removeElement)(div);
-        }
+        (0, _mobileUtils.removeElement)(div);
       };
 
       dynamicProps.openIndex = -1;

package/umd/masking/methods.js

@@ -36,14 +36,14 @@
       }); // 不同的key用不同的容器挂载
 
       var id = "_" + (containerId || 'ARCO_MASKING') + "_DIV_" + (config.key || '') + "_";
-
-      var _appendElementById = (0, _mobileUtils.appendElementById)(id, baseProps.getContainer),
-          div = _appendElementById.child;
-
+      var existedDiv = baseProps.unmountOnExit ? null : document.getElementById(id);
+      var div = existedDiv || (0, _mobileUtils.appendElementById)(id, baseProps.getContainer).child;
       var leaving = false;
 
-      var _ReactDOMRender = new _render.ReactDOMRender(Component, div, context),
-          render = _ReactDOMRender.render;
+      var _ReactDOMRender = new _render.ReactDOMRender(Component, div, context, id, existedDiv ? _render.renderRootCache[id] : undefined),
+          render = _ReactDOMRender.render,
+          unmount = _ReactDOMRender.unmount,
+          setRootCache = _ReactDOMRender.setRootCache;
 
       var dynamicProps = (0, _extends2.default)({}, baseProps, {
         getContainer: function getContainer() {
@@ -68,11 +68,17 @@
         baseProps.onClose && baseProps.onClose(scene);
 
         if (baseProps.unmountOnExit) {
+          unmount();
           (0, _mobileUtils.removeElement)(div);
         }
       };
 
       render(dynamicProps);
+
+      if (!baseProps.unmountOnExit) {
+        setRootCache();
+      }
+
       (0, _mobileUtils.nextTick)(function () {
         if (leaving) return;
         dynamicProps.visible = true;

package/umd/picker/index.js

@@ -127,12 +127,13 @@
 
       (_pickerViewRef$curren6 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren6.scrollToCurrentIndex();
       (0, _mobileUtils.nextTick)(function () {
-        var _pickerViewRef$curren7;
+        var _pickerViewRef$curren7, _pickerViewRef$curren8;
 
         var val = ((_pickerViewRef$curren7 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren7.getAllColumnValues()) || scrollValueRef.current || [];
+        var selectedData = ((_pickerViewRef$curren8 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren8.getAllColumnData()) || [];
 
         if (onOk) {
-          onOk(val);
+          onOk(val, selectedData);
         }
 
         if (onChange) {

package/umd/picker/type.d.ts

@@ -81,7 +81,7 @@ export interface PickerProps extends Omit<PopupProps, 'visible' | 'close' | 'chi
      * 点击选中时执行的回调
      * @en Callback when clicking on Ok
      */
-    onOk?: (value: ValueType[]) => void;
+    onOk?: (value: ValueType[], data: PickerData[]) => void;
     /**
      * 点击取消时执行的回调
      * @en Callback when clicking to cancel

package/umd/picker-view/components/cascader.d.ts

@@ -19,6 +19,7 @@ export interface CascaderRef {
     getCellMovingStatus: () => PickerCellMovingStatus[];
     scrollToCurrentIndex: () => void;
     getAllCellsValue: () => ValueType[];
+    getAllCellsData: () => PickerData[];
 }
 declare const Cascader: React.ForwardRefExoticComponent<CascaderProps & React.RefAttributes<CascaderRef>>;
 export default Cascader;

package/umd/picker-view/components/cascader.js

@@ -45,7 +45,8 @@
       return {
         getCellMovingStatus: getCellMovingStatus,
         scrollToCurrentIndex: scrollToCurrentIndex,
-        getAllCellsValue: getAllCellsValue
+        getAllCellsValue: getAllCellsValue,
+        getAllCellsData: getAllCellsData
       };
     });
 
@@ -67,6 +68,12 @@
       });
     }
 
+    function getAllCellsData() {
+      return pickerCellsRef.current.map(function (cell) {
+        return cell.getCurrentCellData();
+      });
+    }
+
     function _onValueChange(value, index, newData) {
       var children = (0, _mobileUtils.arrayTreeFilter)(data, function (item, level) {
         return level <= index && item.value === value[level];

package/umd/picker-view/components/picker-cell.d.ts

@@ -22,6 +22,7 @@ export interface PickerCellRef {
     movingStatus: PickerCellMovingStatus;
     scrollToCurrentIndex: () => void;
     getCurrentCellValue: () => ValueType;
+    getCurrentCellData: () => PickerData;
 }
 declare const PickerCell: React.ForwardRefExoticComponent<PickerCellProps & React.RefAttributes<PickerCellRef>>;
 export default PickerCell;

package/umd/picker-view/components/picker-cell.js

@@ -311,6 +311,10 @@
       return (_data$currentIndex = data[currentIndex]) == null ? void 0 : _data$currentIndex.value;
     }
 
+    function getCurrentCellData() {
+      return data[currentIndex];
+    }
+
     function _clearTimer() {
       timeRef.current && clearTimeout(timeRef.current);
       timeRef.current = null;
@@ -376,7 +380,8 @@
       return {
         movingStatus: movingStatusRef.current,
         scrollToCurrentIndex: scrollToCurrentIndex,
-        getCurrentCellValue: getCurrentCellValue
+        getCurrentCellValue: getCurrentCellValue,
+        getCurrentCellData: getCurrentCellData
       };
     });
     return !hideEmptyCols || data && data.length ? /*#__PURE__*/_react.default.createElement("div", {

package/umd/picker-view/index.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import MultiPicker from '../picker-view/components/multi-picker';
 import PickerCell from '../picker-view/components/picker-cell';
 import Cascader from '../picker-view/components/cascader';
-import { PickerViewProps, ValueType, PickerCellMovingStatus } from './type';
+import { PickerViewProps, ValueType, PickerData, PickerCellMovingStatus } from './type';
 export * from './type';
 export { MultiPicker, PickerCell, Cascader };
 export interface PickerViewRef {
@@ -41,6 +41,11 @@ export interface PickerViewRef {
      * @en Jump directly to the current most recent line (will break scrolling when called)
      */
     scrollToCurrentIndex: () => void;
+    /**
+     * 获取所有列的 data
+     * @en Get all column data
+     */
+    getAllColumnData: () => PickerData[];
 }
 declare const _default: React.ForwardRefExoticComponent<PickerViewProps & React.RefAttributes<PickerViewRef>> & {
     displayName?: string | undefined;

package/umd/picker-view/index.js

@@ -41,6 +41,14 @@
 
   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; }
 
+  var isArray = function isArray(dt) {
+    return dt ? Array.isArray(dt[0]) : false;
+  };
+
+  var isStrOrNum = function isStrOrNum(dt) {
+    return typeof dt[0][0] === 'string' || typeof dt[0][0] === 'number';
+  };
+
   var PickerView = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     var _props$className = props.className,
         className = _props$className === void 0 ? '' : _props$className,
@@ -90,14 +98,6 @@
     var innerData = (0, _react.useMemo)(function () {
       var newData;
 
-      var isArray = function isArray(dt) {
-        return dt ? Array.isArray(dt[0]) : false;
-      };
-
-      var isStrOrNum = function isStrOrNum(dt) {
-        return typeof dt[0][0] === 'string' || typeof dt[0][0] === 'number';
-      };
-
       if (isArray(data)) {
         if (isStrOrNum(data)) {
           newData = data.map(function (item) {
@@ -131,6 +131,17 @@
       });
     };
 
+    var getAllColumnData = function getAllColumnData() {
+      var _cascaderRef$current2;
+
+      var curValues = cascade ? ((_cascaderRef$current2 = cascaderRef.current) == null ? void 0 : _cascaderRef$current2.getAllCellsData()) || [] : pickerCellsRef.current.map(function (cell) {
+        return cell.getCurrentCellData();
+      });
+      return curValues.filter(function (v) {
+        return v !== undefined;
+      });
+    };
+
     function getColumnValue(index) {
       if (index === void 0) {
         index = 0;
@@ -140,18 +151,18 @@
     }
 
     function getCellMovingStatus() {
-      var _cascaderRef$current2;
+      var _cascaderRef$current3;
 
-      return cascade ? ((_cascaderRef$current2 = cascaderRef.current) == null ? void 0 : _cascaderRef$current2.getCellMovingStatus()) || [] : pickerCellsRef.current.map(function (cell) {
+      return cascade ? ((_cascaderRef$current3 = cascaderRef.current) == null ? void 0 : _cascaderRef$current3.getCellMovingStatus()) || [] : pickerCellsRef.current.map(function (cell) {
         return cell.movingStatus;
       });
     }
 
     function scrollToCurrentIndex() {
       if (cascade) {
-        var _cascaderRef$current3;
+        var _cascaderRef$current4;
 
-        (_cascaderRef$current3 = cascaderRef.current) == null ? void 0 : _cascaderRef$current3.scrollToCurrentIndex();
+        (_cascaderRef$current4 = cascaderRef.current) == null ? void 0 : _cascaderRef$current4.scrollToCurrentIndex();
         return;
       }
 
@@ -168,7 +179,8 @@
         getColumnValue: getColumnValue,
         updateLayout: updateLayout,
         resetValue: resetValue,
-        scrollToCurrentIndex: scrollToCurrentIndex
+        scrollToCurrentIndex: scrollToCurrentIndex,
+        getAllColumnData: getAllColumnData
       };
     });
 

package/umd/skeleton/type.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { BaseProps, SimpleBaseProps } from '../_helpers';
-export { BaseProps, SimpleBaseProps };
+export type { BaseProps, SimpleBaseProps };
 export interface SkeletonProps extends SimpleBaseProps {
     /**
      * 是否显示标题占位图

package/umd/skeleton/type.js

@@ -1,19 +1,17 @@
 (function (global, factory) {
   if (typeof define === "function" && define.amd) {
-    define(["exports", "../_helpers"], factory);
+    define(["exports"], factory);
   } else if (typeof exports !== "undefined") {
-    factory(exports, require("../_helpers"));
+    factory(exports);
   } else {
     var mod = {
       exports: {}
     };
-    factory(mod.exports, global._helpers);
+    factory(mod.exports);
     global.type = mod.exports;
   }
-})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _helpers) {
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports) {
   "use strict";
 
   _exports.__esModule = true;
-  _exports.BaseProps = _helpers.BaseProps;
-  _exports.SimpleBaseProps = _helpers.SimpleBaseProps;
 });

package/umd/tabs/tab-cell.js

@@ -94,14 +94,18 @@
       return tabs.length < overflowThreshold ? tabBarArrange : 'start';
     }),
         originArrange = _useState3[0],
-        setOriginArrange = _useState3[1]; // 默认tab小于overflowThreshold个时不开启加载前隐藏，大于overflowThreshold个时开启
+        setOriginArrange = _useState3[1];
 
+    var _useState4 = (0, _react.useState)(false),
+        forceUpdate = _useState4[0],
+        setForceUpdate = _useState4[1]; // 默认tab小于overflowThreshold个时不开启加载前隐藏，大于overflowThreshold个时开启
 
-    var _useState4 = (0, _react.useState)(function () {
+
+    var _useState5 = (0, _react.useState)(function () {
       return hideTabBarBeforeMounted === void 0 ? tabs.length < overflowThreshold || activeIndex === 0 : !hideTabBarBeforeMounted;
     }),
-        showTab = _useState4[0],
-        setShowTab = _useState4[1];
+        showTab = _useState5[0],
+        setShowTab = _useState5[1];
 
     var isVertical = tabDirection === 'vertical';
     var isLine = (type || '').indexOf('line') !== -1;
@@ -116,6 +120,15 @@
     var hasDivider = tabBarHasDivider === void 0 ? isLine : tabBarHasDivider;
     var wrapSize = isVertical ? wrapWidth : wrapHeight;
     var system = (0, _helpers.useSystem)();
+
+    var updateScrollPosition = function updateScrollPosition() {
+      if (wrapSize && tabBarScrollChance !== 'none') {
+        setTimeout(function () {
+          scrollToCenter();
+        }, tabBarScrollChance === 'after-jump' ? Math.max(transitionDuration || 0, duration || 0) : 0);
+      }
+    };
+
     (0, _react.useEffect)(function () {
       (0, _mobileUtils.nextTick)(function () {
         setCellOverflow(); // dom出来之后originArrange置空，交由tabBarArrange控制
@@ -135,31 +148,16 @@
         (_underlineRef$current = underlineRef.current) == null ? void 0 : _underlineRef$current.resetUnderlineStyle();
       });
     }, [activeIndex, tabs, getCellPadding('left'), getCellPadding('right'), tabBarGutter, tabDirection]);
-    (0, _react.useImperativeHandle)(ref, function () {
-      return {
-        dom: domRef.current,
-        scrollTo: scrollTo,
-        scrollToCenter: scrollToCenter,
-        hasOverflow: hasOverflow,
-        setCaterpillarAnimate: function setCaterpillarAnimate(ratio) {
-          var _underlineRef$current2;
-
-          return (_underlineRef$current2 = underlineRef.current) == null ? void 0 : _underlineRef$current2.setCaterpillarAnimate(ratio);
-        },
-        resetUnderlineStyle: function resetUnderlineStyle() {
-          var _underlineRef$current3;
-
-          return (_underlineRef$current3 = underlineRef.current) == null ? void 0 : _underlineRef$current3.resetUnderlineStyle();
-        }
-      };
-    }, [scrollToCenter, scrollTo, hasOverflow]);
     (0, _react.useEffect)(function () {
-      if (wrapSize && tabBarScrollChance !== 'none') {
-        setTimeout(function () {
-          scrollToCenter();
-        }, tabBarScrollChance === 'after-jump' ? Math.max(transitionDuration || 0, duration || 0) : 0);
-      }
+      updateScrollPosition();
     }, [activeIndex, wrapSize]);
+    (0, _react.useEffect)(function () {
+      var _underlineRef$current2;
+
+      setCellOverflow();
+      (_underlineRef$current2 = underlineRef.current) == null ? void 0 : _underlineRef$current2.resetUnderlineStyle();
+      updateScrollPosition();
+    }, [forceUpdate]);
     (0, _react.useEffect)(function () {
       tabBarScrollChance !== 'none' && scrollToCenter(true); // TabCell左右可滚动时，防止触发父级touchmove事件导致滚不动
       // @en When the TabCell can be scrolled left and right, prevent the parent touchmove event from being triggered which result in inability to scroll
@@ -300,7 +298,7 @@
       return typeof tab === 'string' ? tab : tab.title;
     }
 
-    function renderTabUnderline() {
+    var renderTabUnderline = function renderTabUnderline() {
       if (!showUnderline || !isLine) {
         return null;
       }
@@ -331,7 +329,7 @@
         getTabCenterLeft: getTabCenterLeft,
         getTabRect: getTabRect
       }, lineProps));
-    }
+    };
 
     var cellInner = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, tabs.map(function (tab, index) {
       return /*#__PURE__*/_react.default.createElement("div", {
@@ -374,6 +372,33 @@
       }
     }) : null);
 
+    var _updateLayout = function updateLayout() {
+      setForceUpdate(function (val) {
+        return !val;
+      });
+    };
+
+    (0, _react.useImperativeHandle)(ref, function () {
+      return {
+        dom: domRef.current,
+        scrollTo: scrollTo,
+        scrollToCenter: scrollToCenter,
+        hasOverflow: hasOverflow,
+        setCaterpillarAnimate: function setCaterpillarAnimate(ratio) {
+          var _underlineRef$current3;
+
+          return (_underlineRef$current3 = underlineRef.current) == null ? void 0 : _underlineRef$current3.setCaterpillarAnimate(ratio);
+        },
+        resetUnderlineStyle: function resetUnderlineStyle() {
+          var _underlineRef$current4;
+
+          return (_underlineRef$current4 = underlineRef.current) == null ? void 0 : _underlineRef$current4.resetUnderlineStyle();
+        },
+        updateLayout: function updateLayout() {
+          return _updateLayout();
+        }
+      };
+    }, [scrollToCenter, scrollTo, hasOverflow]);
     return /*#__PURE__*/_react.default.createElement("div", {
       className: (0, _mobileUtils.cls)(prefix + "-container-wrap", tabDirection, "type-" + type, tabBarClass, system),
       style: tabBarStyle

package/umd/tabs/type.d.ts

@@ -565,6 +565,11 @@ export interface TabCellRef {
      * @en Recalculate underline style
      */
     resetUnderlineStyle: () => void;
+    /**
+     * 强制更新 tab-cell
+     * @en Force update tab-cell
+     */
+    updateLayout: () => void;
 }
 export interface TabPaneProps extends Pick<TabsProps, 'duration' | 'transitionDuration' | 'lazyloadCount' | 'hideContentStyle' | 'renderHideContent' | 'mode' | 'tabPaneClass' | 'tabPaneStyle' | 'tabPaneExtra' | 'getScrollContainer' | 'scrollThrottle' | 'scrollOffset' | 'goLastWhenScrollBottom' | 'scrollVertical' | 'translateZ' | 'fullScreen' | 'autoHeight' | 'onScroll' | 'swipeEnergySaving'> {
     prefixCls?: string;