@arco-design/mobile-react 2.25.4 → 2.27.0

package/esm/notify/methods.js

@@ -7,27 +7,34 @@ export function notify(Component, type) {
       content: originConfig,
       type: 'info'
     } : originConfig;
+
     if (type !== void 0) {
       config.type = type;
     }
+
     var div = document.createElement('div');
     var getContainer = config.getContainer;
+
     if (getContainer) {
       getContainer().appendChild(div);
     } else {
       document.body.appendChild(div);
     }
+
     var _ReactDOMRender = new ReactDOMRender(Component, div, context),
-      render = _ReactDOMRender.render,
-      unmount = _ReactDOMRender.unmount;
+        render = _ReactDOMRender.render,
+        unmount = _ReactDOMRender.unmount;
+
     function destroy() {
       var onClose = config.onClose;
       onClose && onClose();
       unmount();
+
       if (div.parentNode) {
         div.parentNode.removeChild(div);
       }
     }
+
     var dynamicProps = _extends({}, config, {
       close: close,
       onClose: destroy,
@@ -36,16 +43,20 @@ export function notify(Component, type) {
       },
       visible: false
     });
+
     var leaving = false;
+
     function update(newConfig) {
       dynamicProps = _extends({}, dynamicProps, newConfig);
       render(dynamicProps);
     }
+
     function close() {
       leaving = true;
       dynamicProps.visible = false;
       render(dynamicProps);
     }
+
     render(dynamicProps);
     nextTick(function () {
       if (leaving) return;

package/esm/pagination/index.js

@@ -3,6 +3,7 @@ import { cls } from '@arco-design/mobile-utils';
 import { GlobalContext } from '../context-provider';
 import { useSystem } from '../_helpers';
 import Arrow from './arrow';
+
 /**
  * 用于数据分页，为完全受控组件
  * @en The pagination component is used for data paging and is a fully controlled component.
@@ -13,35 +14,37 @@ import Arrow from './arrow';
  */
 var Pagination = /*#__PURE__*/forwardRef(function (props, ref) {
   var _cls4;
+
   var _useContext = useContext(GlobalContext),
-    prefixCls = _useContext.prefixCls,
-    locale = _useContext.locale;
+      prefixCls = _useContext.prefixCls,
+      locale = _useContext.locale;
+
   var _props$className = props.className,
-    className = _props$className === void 0 ? '' : _props$className,
-    style = props.style,
-    _props$current = props.current,
-    current = _props$current === void 0 ? 1 : _props$current,
-    _props$pageSize = props.pageSize,
-    pageSize = _props$pageSize === void 0 ? 10 : _props$pageSize,
-    _props$total = props.total,
-    total = _props$total === void 0 ? 5 : _props$total,
-    _props$icon = props.icon,
-    icon = _props$icon === void 0 ? false : _props$icon,
-    _props$justify = props.justify,
-    justify = _props$justify === void 0 ? 'side' : _props$justify,
-    _props$hideOnOnePage = props.hideOnOnePage,
-    hideOnOnePage = _props$hideOnOnePage === void 0 ? false : _props$hideOnOnePage,
-    _props$nextFieldType = props.nextFieldType,
-    nextFieldType = _props$nextFieldType === void 0 ? 'default' : _props$nextFieldType,
-    renderPrevField = props.renderPrevField,
-    renderNextField = props.renderNextField,
-    _props$type = props.type,
-    type = _props$type === void 0 ? 'default' : _props$type,
-    _props$prevFieldText = props.prevFieldText,
-    prevFieldText = _props$prevFieldText === void 0 ? locale == null ? void 0 : locale.Pagination.previousPage : _props$prevFieldText,
-    _props$nextFieldText = props.nextFieldText,
-    nextFieldText = _props$nextFieldText === void 0 ? locale == null ? void 0 : locale.Pagination.nextPage : _props$nextFieldText,
-    onChange = props.onChange;
+      className = _props$className === void 0 ? '' : _props$className,
+      style = props.style,
+      _props$current = props.current,
+      current = _props$current === void 0 ? 1 : _props$current,
+      _props$pageSize = props.pageSize,
+      pageSize = _props$pageSize === void 0 ? 10 : _props$pageSize,
+      _props$total = props.total,
+      total = _props$total === void 0 ? 5 : _props$total,
+      _props$icon = props.icon,
+      icon = _props$icon === void 0 ? false : _props$icon,
+      _props$justify = props.justify,
+      justify = _props$justify === void 0 ? 'side' : _props$justify,
+      _props$hideOnOnePage = props.hideOnOnePage,
+      hideOnOnePage = _props$hideOnOnePage === void 0 ? false : _props$hideOnOnePage,
+      _props$nextFieldType = props.nextFieldType,
+      nextFieldType = _props$nextFieldType === void 0 ? 'default' : _props$nextFieldType,
+      renderPrevField = props.renderPrevField,
+      renderNextField = props.renderNextField,
+      _props$type = props.type,
+      type = _props$type === void 0 ? 'default' : _props$type,
+      _props$prevFieldText = props.prevFieldText,
+      prevFieldText = _props$prevFieldText === void 0 ? locale == null ? void 0 : locale.Pagination.previousPage : _props$prevFieldText,
+      _props$nextFieldText = props.nextFieldText,
+      nextFieldText = _props$nextFieldText === void 0 ? locale == null ? void 0 : locale.Pagination.nextPage : _props$nextFieldText,
+      onChange = props.onChange;
   var system = useSystem();
   var pageNum = useMemo(function () {
     return Math.ceil(total / pageSize);
@@ -52,6 +55,7 @@ var Pagination = /*#__PURE__*/forwardRef(function (props, ref) {
       dom: domRef.current
     };
   });
+
   var iconRender = function iconRender(iconType) {
     if (iconType === 'prev') {
       if (Array.isArray(icon) && Boolean(icon.length)) {
@@ -59,35 +63,44 @@ var Pagination = /*#__PURE__*/forwardRef(function (props, ref) {
           className: "btn-icon"
         }, icon[0]);
       }
+
       if (Object.prototype.toString.call(icon) === '[object Object]') {
         return /*#__PURE__*/React.createElement("span", {
           className: "btn-icon"
         }, icon);
       }
+
       return icon ? /*#__PURE__*/React.createElement("span", {
         className: "btn-icon"
       }, /*#__PURE__*/React.createElement(Arrow, null)) : null;
     }
+
     if (Array.isArray(icon) && Boolean(icon.length)) {
       return /*#__PURE__*/React.createElement("span", {
         className: "btn-icon"
       }, icon.length >= 2 ? icon[1] : icon[0]);
     }
+
     if (Object.prototype.toString.call(icon) === '[object Object]') {
       return /*#__PURE__*/React.createElement("span", {
         className: "btn-icon next"
       }, icon);
     }
+
     return icon ? /*#__PURE__*/React.createElement("span", {
       className: "btn-icon next"
     }, /*#__PURE__*/React.createElement(Arrow, null)) : null;
   };
+
   var prevRender = function prevRender(prefix) {
     var _cls;
+
     if (type === 'none') {
       return null;
     }
+
     var prevFieldCls = cls(prefix + "-prev-field", (_cls = {}, _cls["flex-" + justify] = true, _cls));
+
     if (typeof renderPrevField === 'undefined') {
       return /*#__PURE__*/React.createElement("div", {
         className: prevFieldCls
@@ -101,6 +114,7 @@ var Pagination = /*#__PURE__*/forwardRef(function (props, ref) {
           if (current <= 1) {
             return;
           }
+
           onChange == null ? void 0 : onChange({
             pageSize: pageSize,
             pageNum: pageNum,
@@ -111,6 +125,7 @@ var Pagination = /*#__PURE__*/forwardRef(function (props, ref) {
         className: "btn-text"
       }, prevFieldText)));
     }
+
     return /*#__PURE__*/React.createElement("div", {
       className: prevFieldCls
     }, renderPrevField ? renderPrevField({
@@ -119,14 +134,19 @@ var Pagination = /*#__PURE__*/forwardRef(function (props, ref) {
       pageNum: pageNum
     }) : null);
   };
+
   var nextRender = function nextRender(prefix) {
     var _cls2;
+
     if (type === 'none') {
       return null;
     }
+
     var nextFieldCls = cls(prefix + "-next-field", (_cls2 = {}, _cls2["flex-" + justify] = true, _cls2));
+
     if (typeof renderNextField === 'undefined') {
       var _cls3;
+
       return /*#__PURE__*/React.createElement("div", {
         className: nextFieldCls
       }, /*#__PURE__*/React.createElement("div", {
@@ -138,6 +158,7 @@ var Pagination = /*#__PURE__*/forwardRef(function (props, ref) {
           if (current >= pageNum) {
             return;
           }
+
           onChange == null ? void 0 : onChange({
             pageSize: pageSize,
             pageNum: pageNum,
@@ -148,6 +169,7 @@ var Pagination = /*#__PURE__*/forwardRef(function (props, ref) {
         className: "btn-text"
       }, nextFieldText), iconRender('next')));
     }
+
     var nextItem = renderNextField && renderNextField({
       current: current,
       pageSize: pageSize,
@@ -157,6 +179,7 @@ var Pagination = /*#__PURE__*/forwardRef(function (props, ref) {
       className: nextFieldCls
     }, nextItem);
   };
+
   var prefix = prefixCls + "-pagination";
   return !(hideOnOnePage && pageNum === 1) ? /*#__PURE__*/React.createElement("div", {
     ref: domRef,

package/esm/picker/index.js

@@ -9,72 +9,47 @@ import PickerView from '../picker-view';
 import { useListenResize } from '../_helpers';
 export * from './type';
 export { MultiPicker, PickerCell, Cascader } from '../picker-view';
-var getInitialValue = function getInitialValue(value, data, cascade) {
-  if (value && value.length) {
-    return value;
-  }
-  var computedValue = [];
-  if (!cascade) {
-    if (!(data[0] instanceof Array)) {
-      var _data$;
-      return (_data$ = data[0]) != null && _data$.value ? [data[0].value] : [];
-    }
-    data.map(function (column) {
-      computedValue.push(typeof column[0] === 'object' ? column[0].value : column[0]);
-    });
-  } else {
-    var cascadePickerData = data;
-    if (!cascadePickerData || !cascadePickerData.length) {
-      return computedValue;
-    }
-    computedValue.push(cascadePickerData[0].value);
-    var traverse = cascadePickerData[0].children;
-    while (traverse) {
-      computedValue.push(traverse[0].value);
-      traverse = traverse[0].children;
-    }
-  }
-  return computedValue;
-};
 var Picker = /*#__PURE__*/forwardRef(function (props, ref) {
   var className = props.className,
-    itemStyle = props.itemStyle,
-    _props$cascade = props.cascade,
-    cascade = _props$cascade === void 0 ? true : _props$cascade,
-    _props$cols = props.cols,
-    cols = _props$cols === void 0 ? 3 : _props$cols,
-    _props$rows = props.rows,
-    rows = _props$rows === void 0 ? 5 : _props$rows,
-    data = props.data,
-    okText = props.okText,
-    dismissText = props.dismissText,
-    _props$disabled = props.disabled,
-    disabled = _props$disabled === void 0 ? false : _props$disabled,
-    _props$clickable = props.clickable,
-    clickable = _props$clickable === void 0 ? true : _props$clickable,
-    _props$hideEmptyCols = props.hideEmptyCols,
-    hideEmptyCols = _props$hideEmptyCols === void 0 ? false : _props$hideEmptyCols,
-    _props$title = props.title,
-    title = _props$title === void 0 ? '' : _props$title,
-    _props$visible = props.visible,
-    visible = _props$visible === void 0 ? false : _props$visible,
-    value = props.value,
-    _props$needBottomOffs = props.needBottomOffset,
-    needBottomOffset = _props$needBottomOffs === void 0 ? false : _props$needBottomOffs,
-    onDismiss = props.onDismiss,
-    onOk = props.onOk,
-    onChange = props.onChange,
-    _props$maskClosable = props.maskClosable,
-    maskClosable = _props$maskClosable === void 0 ? false : _props$maskClosable,
-    onHide = props.onHide,
-    onPickerChange = props.onPickerChange,
-    touchToStop = props.touchToStop,
-    _props$gestureOutOfCo = props.gestureOutOfControl,
-    gestureOutOfControl = _props$gestureOutOfCo === void 0 ? true : _props$gestureOutOfCo,
-    otherProps = _objectWithoutPropertiesLoose(props, _excluded);
-  var _useState = useState(getInitialValue(value, data, cascade)),
-    scrollValue = _useState[0],
-    setScrollValue = _useState[1];
+      itemStyle = props.itemStyle,
+      _props$cascade = props.cascade,
+      cascade = _props$cascade === void 0 ? true : _props$cascade,
+      _props$cols = props.cols,
+      cols = _props$cols === void 0 ? 3 : _props$cols,
+      _props$rows = props.rows,
+      rows = _props$rows === void 0 ? 5 : _props$rows,
+      data = props.data,
+      okText = props.okText,
+      dismissText = props.dismissText,
+      _props$disabled = props.disabled,
+      disabled = _props$disabled === void 0 ? false : _props$disabled,
+      _props$clickable = props.clickable,
+      clickable = _props$clickable === void 0 ? true : _props$clickable,
+      _props$hideEmptyCols = props.hideEmptyCols,
+      hideEmptyCols = _props$hideEmptyCols === void 0 ? false : _props$hideEmptyCols,
+      _props$title = props.title,
+      title = _props$title === void 0 ? '' : _props$title,
+      _props$visible = props.visible,
+      visible = _props$visible === void 0 ? false : _props$visible,
+      value = props.value,
+      _props$needBottomOffs = props.needBottomOffset,
+      needBottomOffset = _props$needBottomOffs === void 0 ? false : _props$needBottomOffs,
+      onDismiss = props.onDismiss,
+      onOk = props.onOk,
+      onChange = props.onChange,
+      _props$maskClosable = props.maskClosable,
+      maskClosable = _props$maskClosable === void 0 ? false : _props$maskClosable,
+      onHide = props.onHide,
+      onPickerChange = props.onPickerChange,
+      touchToStop = props.touchToStop,
+      _props$gestureOutOfCo = props.gestureOutOfControl,
+      gestureOutOfControl = _props$gestureOutOfCo === void 0 ? true : _props$gestureOutOfCo,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded);
+
+  var _useState = useState(value),
+      scrollValue = _useState[0],
+      setScrollValue = _useState[1];
+
   var domRef = useRef(null);
   var pickerViewRef = useRef(null);
   useImperativeHandle(ref, function () {
@@ -82,68 +57,82 @@ var Picker = /*#__PURE__*/forwardRef(function (props, ref) {
       dom: domRef.current,
       getCellMovingStatus: function getCellMovingStatus() {
         var _pickerViewRef$curren;
+
         return ((_pickerViewRef$curren = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren.getCellMovingStatus()) || [];
       },
       getAllColumnValues: function getAllColumnValues() {
         var _pickerViewRef$curren2;
+
         return ((_pickerViewRef$curren2 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren2.getAllColumnValues()) || [];
       },
       getColumnValue: function getColumnValue(index) {
         var _pickerViewRef$curren3;
+
         return ((_pickerViewRef$curren3 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren3.getColumnValue(index)) || '';
       },
       updateLayout: function updateLayout() {
         var _pickerViewRef$curren4;
+
         return (_pickerViewRef$curren4 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren4.updateLayout();
       },
       scrollToCurrentIndex: function scrollToCurrentIndex() {
         var _pickerViewRef$curren5;
+
         return (_pickerViewRef$curren5 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren5.scrollToCurrentIndex();
       }
     };
   });
+
   function handleDismiss() {
     if (onDismiss) {
       onDismiss();
     }
+
     if (onHide) {
       onHide('dismiss');
     }
   }
+
   var handleConfirm = function handleConfirm() {
     var _pickerViewRef$curren6;
+
     (_pickerViewRef$curren6 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren6.scrollToCurrentIndex();
     nextTick(function () {
       var _pickerViewRef$curren7;
-      var val = ((_pickerViewRef$curren7 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren7.getAllColumnValues()) || scrollValue;
+
+      var val = ((_pickerViewRef$curren7 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren7.getAllColumnValues()) || scrollValue || [];
+
       if (onOk) {
         onOk(val);
       }
+
       if (onChange) {
         onChange(val);
       }
+
       if (onHide) {
         onHide('confirm');
       }
     });
   };
+
   useEffect(function () {
     setScrollValue(value);
   }, [value, setScrollValue]);
-  useListenResize(updateLayoutByVisible, [visible]);
+  useListenResize(updateLayoutByVisible, [visible]); // 每次visible从false变为true时需要重新设置scrollValue的值为当前value的值（初始值）
 
-  // 每次visible从false变为true时需要重新设置scrollValue的值为当前value的值（初始值）
   function updateLayoutByVisible() {
     if (visible && pickerViewRef.current) {
       pickerViewRef.current.updateLayout();
     }
   }
+
   useEffect(function () {
     updateLayoutByVisible();
   }, [visible]);
   return /*#__PURE__*/React.createElement(ContextLayout, null, function (_ref) {
     var prefixCls = _ref.prefixCls,
-      locale = _ref.locale;
+        locale = _ref.locale;
     return /*#__PURE__*/React.createElement(Popup, _extends({
       visible: visible,
       className: cls(className, prefixCls + "-picker all-border-box"),
@@ -174,7 +163,7 @@ var Picker = /*#__PURE__*/forwardRef(function (props, ref) {
       cols: cols,
       rows: rows,
       disabled: disabled,
-      value: getInitialValue(value, data, cascade),
+      value: value,
       onPickerChange: onPickerChange,
       itemStyle: itemStyle,
       clickable: clickable,
@@ -183,7 +172,6 @@ var Picker = /*#__PURE__*/forwardRef(function (props, ref) {
     })));
   });
 });
-
 /**
  * 选择器组件，形式是弹起的浮层。
  * @en The selector component, in the form of a popup layer.
@@ -193,4 +181,5 @@ var Picker = /*#__PURE__*/forwardRef(function (props, ref) {
  * @name_en Picker
  * @displayName Picker
  */
+
 export default componentWrapper(Picker, 'Picker');

package/esm/picker/type.d.ts

@@ -51,7 +51,7 @@ export interface PickerProps extends Omit<PopupProps, 'visible' | 'close' | 'chi
      * 每列数据选择变化后的回调函数
      * @en The callback after each column data selection changes
      */
-    onPickerChange?: (value: ValueType[], index: number) => void;
+    onPickerChange?: (value: ValueType[], index: number, data: PickerData[]) => void;
     /**
      * 每列样式
      * @en Stylesheet per column

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

@@ -9,11 +9,10 @@ export interface CascaderProps {
     disabled: boolean;
     itemHeight: number;
     wrapperHeight: number;
-    selectedValue: ValueType[];
+    selectedValue?: ValueType[];
     rows?: number;
     hideEmptyCols?: boolean;
-    onValueChange?: (value: ValueType[], index: number) => void;
-    onPickerChange?: (value: ValueType[], index: number) => void;
+    onValueChange?: (value: ValueType[], index: number, data: PickerData[]) => void;
     touchToStop?: boolean | number;
 }
 export interface CascaderRef {

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

@@ -4,20 +4,19 @@ import MultiPicker from './multi-picker';
 import PickerCell from './picker-cell';
 var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
   var prefixCls = props.prefixCls,
-    itemStyle = props.itemStyle,
-    cols = props.cols,
-    data = props.data,
-    disabled = props.disabled,
-    clickable = props.clickable,
-    itemHeight = props.itemHeight,
-    wrapperHeight = props.wrapperHeight,
-    rows = props.rows,
-    hideEmptyCols = props.hideEmptyCols,
-    onPickerChange = props.onPickerChange,
-    onValueChange = props.onValueChange,
-    _props$selectedValue = props.selectedValue,
-    selectedValue = _props$selectedValue === void 0 ? [] : _props$selectedValue,
-    touchToStop = props.touchToStop;
+      itemStyle = props.itemStyle,
+      cols = props.cols,
+      data = props.data,
+      disabled = props.disabled,
+      clickable = props.clickable,
+      itemHeight = props.itemHeight,
+      wrapperHeight = props.wrapperHeight,
+      rows = props.rows,
+      hideEmptyCols = props.hideEmptyCols,
+      onValueChange = props.onValueChange,
+      _props$selectedValue = props.selectedValue,
+      selectedValue = _props$selectedValue === void 0 ? [] : _props$selectedValue,
+      touchToStop = props.touchToStop;
   var pickerCellsRef = useRef([]);
   useImperativeHandle(ref, function () {
     return {
@@ -25,45 +24,58 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
       scrollToCurrentIndex: scrollToCurrentIndex
     };
   });
+
   function getCellMovingStatus() {
     return pickerCellsRef.current.map(function (cell) {
       return cell.movingStatus;
     });
   }
+
   function scrollToCurrentIndex() {
     pickerCellsRef.current.forEach(function (cell) {
       return cell.scrollToCurrentIndex();
     });
   }
-  function _onValueChange(value, index) {
+
+  function _onValueChange(value, index, newData) {
     var children = arrayTreeFilter(data, function (item, level) {
       return level <= index && item.value === value[level];
     });
     var child = children[index];
     var i;
+
     for (i = index + 1; i < cols && child && child.children; i++) {
       child = child.children[0];
       value[i] = child.value;
+      newData[i] = child;
     }
+
     value.length = i;
-    onValueChange == null ? void 0 : onValueChange(value, index);
+    newData.length = i;
+    onValueChange == null ? void 0 : onValueChange(value, index, newData);
   }
+
   function _formatData() {
     var childrenTree = arrayTreeFilter(data, function (item, level) {
-      return item.value === selectedValue[level];
+      return item.value === (selectedValue == null ? void 0 : selectedValue[level]);
+    }, {
+      fallbackChildIndex: 0
     }).map(function (item) {
       return item.children;
     });
     var needPad = cols - childrenTree.length;
+
     if (needPad > 0) {
       for (var i = 0; i < needPad; i++) {
         childrenTree.push([]);
       }
     }
+
     childrenTree.length = cols - 1;
     childrenTree.unshift(data);
     return childrenTree;
   }
+
   var formatData = useMemo(function () {
     return _formatData();
   }, [data, selectedValue]);
@@ -72,8 +84,7 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
     data: formatData,
     selectedValue: selectedValue,
     itemHeight: itemHeight,
-    onValueChange: _onValueChange,
-    onPickerChange: onPickerChange
+    onValueChange: _onValueChange
   }, formatData.map(function (item, index) {
     return /*#__PURE__*/React.createElement(PickerCell, {
       key: index + "_picker_cell_cascader",

package/esm/picker-view/components/multi-picker.d.ts

@@ -3,10 +3,9 @@ import { PickerData, ValueType } from '../type';
 export interface MultiPickerProps {
     prefixCls: string;
     data: PickerData[][];
-    selectedValue: ValueType[];
+    selectedValue?: ValueType[];
     children: any;
     itemHeight: number;
-    onValueChange: (value: ValueType[], index: number) => void;
-    onPickerChange?: (value: ValueType[], index: number) => void;
+    onValueChange: (value: ValueType[], index: number, data: PickerData[]) => void;
 }
 export default function MultiPicker(props: MultiPickerProps): JSX.Element;