@arco-design/mobile-react 2.26.0 → 2.27.1

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

@@ -28,7 +28,6 @@ var Cascader = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       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,
@@ -53,7 +52,7 @@ var Cascader = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     });
   }
 
-  function _onValueChange(value, index) {
+  function _onValueChange(value, index, newData) {
     var children = (0, _mobileUtils.arrayTreeFilter)(data, function (item, level) {
       return level <= index && item.value === value[level];
     });
@@ -63,15 +62,19 @@ var Cascader = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     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 = (0, _mobileUtils.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;
     });
@@ -96,8 +99,7 @@ var Cascader = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     data: formatData,
     selectedValue: selectedValue,
     itemHeight: itemHeight,
-    onValueChange: _onValueChange,
-    onPickerChange: onPickerChange
+    onValueChange: _onValueChange
   }, formatData.map(function (item, index) {
     return /*#__PURE__*/_react.default.createElement(_pickerCell.default, {
       key: index + "_picker_cell_cascader",

package/cjs/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;

package/cjs/picker-view/components/multi-picker.js

@@ -10,60 +10,56 @@ var _react = _interopRequireDefault(require("react"));
 function MultiPicker(props) {
   var prefixCls = props.prefixCls,
       onValueChange = props.onValueChange,
-      onPickerChange = props.onPickerChange,
       children = props.children,
       itemHeight = props.itemHeight,
       selectedValue = props.selectedValue,
       data = props.data;
 
-  function getValue() {
-    if (selectedValue && selectedValue.length) {
-      return selectedValue;
-    }
-
-    if (data) {
-      return data.map(function (item) {
-        return item && item[0] && item[0].value;
-      });
-    }
-
-    if (!children) {
-      return [];
-    }
-
-    return _react.default.Children.map(children, function (child) {
-      var childrenArray = _react.default.Children.toArray(child.children || child.props.children);
-
-      return childrenArray && childrenArray[0] && childrenArray[0].props.value;
+  function getCurrentData() {
+    return (data || []).map(function (item, itemIndex) {
+      var curSelected = selectedValue == null ? void 0 : selectedValue[itemIndex];
+      var cur = curSelected ? (item || []).find(function (i) {
+        return i.value === curSelected;
+      }) : undefined;
+      return cur || (item == null ? void 0 : item[0]);
     });
   }
 
-  function onChange(index, value, callback) {
-    var newValue = getValue().concat();
+  function onChange(_ref) {
+    var index = _ref.index,
+        value = _ref.value,
+        changedData = _ref.changedData,
+        callback = _ref.callback;
+    var newData = getCurrentData().concat();
+    newData[index] = changedData;
+    var newValue = newData.map(function (d) {
+      return d == null ? void 0 : d.value;
+    });
     newValue[index] = value;
 
     if (callback) {
-      callback(newValue, index);
+      callback(newValue, index, newData);
     }
   }
 
-  function _onValueChange(value, index) {
-    onChange(index, value, onValueChange);
-  }
-
-  function _onScrollChange(value, index) {
-    onChange(index, value, onPickerChange);
+  function _onValueChange(value, index, changedData) {
+    onChange({
+      index: index,
+      value: value,
+      callback: onValueChange,
+      changedData: changedData
+    });
   }
 
   function renderChild() {
-    var value = getValue();
+    var curData = getCurrentData();
+    var value = curData.map(function (d) {
+      return d == null ? void 0 : d.value;
+    });
     return _react.default.Children.map(children, function (col, index) {
       return /*#__PURE__*/_react.default.cloneElement(col, {
-        onScrollChange: function onScrollChange(val) {
-          return _onScrollChange(val, index);
-        },
-        onValueChange: function onValueChange(val) {
-          return _onValueChange(val, index);
+        onValueChange: function onValueChange(val, changedData) {
+          return _onValueChange(val, index, changedData);
         },
         selectedValue: value[index]
       });

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

@@ -8,7 +8,7 @@ export interface PickerCellProps {
     itemHeight: number;
     wrapperHeight: number;
     selectedValue?: ValueType;
-    onValueChange?: (value: ValueType) => void;
+    onValueChange?: (value: ValueType, data: PickerData) => void;
     disabled: boolean;
     hideEmptyCols?: boolean;
     /**

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

@@ -85,17 +85,15 @@ var PickerCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     // index有改变时再抛出
     // @en Throws again when index changes
     if (currentIndex !== nowItemIndex) {
-      setCurrentIndex(nowItemIndex);
-      var newValue = data[nowItemIndex] && data[nowItemIndex].value;
+      setCurrentIndex(Math.max(nowItemIndex, 0));
+      var newData = data[nowItemIndex];
+      var newValue = newData == null ? void 0 : newData.value;
 
       if (newValue !== currentValue) {
-        // if (!('selectedValue' in props)) {
-        //     setCurrentValue(newValue);
-        // }
         setCurrentValue(newValue);
 
         if (onValueChange) {
-          onValueChange(newValue);
+          onValueChange(newValue, newData);
         }
       }
     }
@@ -340,7 +338,7 @@ var PickerCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       var curIndex = data.findIndex(function (item) {
         return item.value === selectedValue;
       });
-      setCurrentIndex(curIndex);
+      setCurrentIndex(Math.max(curIndex, 0));
 
       if (curIndex >= 0) {
         _scrollToIndexWithChange(curIndex);

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

@@ -25,7 +25,7 @@ export interface PickerViewRef {
      * 获取第 n 列的值
      * @en Get the value of the nth column
      */
-    getColumnValue: (index: number) => ValueType;
+    getColumnValue: (index: number) => ValueType | undefined;
     /**
      * 手动更新元素布局
      * @en Manually update the element layout

package/cjs/picker-view/index.js

@@ -82,7 +82,7 @@ var PickerView = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var wrapperRef = (0, _react.useRef)(null);
   var domRef = (0, _react.useRef)(null);
   var barRef = (0, _react.useRef)(null);
-  var scrollValueRef = (0, _react.useRef)(value);
+  var scrollValueRef = (0, _helpers.useLatestRef)(scrollValue);
   var pickerCellsRef = (0, _react.useRef)([]);
   var cascaderRef = (0, _react.useRef)(null);
   var innerData = (0, _react.useMemo)(function () {
@@ -115,20 +115,19 @@ var PickerView = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
 
     return newData;
   }, [data]);
-  (0, _react.useEffect)(function () {
-    scrollValueRef.current = scrollValue;
-  }, [scrollValue]);
 
   var getAllColumnValues = function getAllColumnValues() {
-    return scrollValueRef.current;
+    return scrollValueRef.current || [];
   };
 
   function getColumnValue(index) {
+    var _scrollValueRef$curre;
+
     if (index === void 0) {
       index = 0;
     }
 
-    return scrollValueRef.current[index];
+    return (_scrollValueRef$curre = scrollValueRef.current) == null ? void 0 : _scrollValueRef$curre[index];
   }
 
   function getCellMovingStatus() {
@@ -164,25 +163,17 @@ var PickerView = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     };
   });
 
-  function _onPickerChange(val, index) {
+  function _onValueChange(val, index, newData) {
     setScrollValue(val);
 
     if (onPickerChange) {
-      onPickerChange(val, index);
-    }
-  }
-
-  function _onValueChange(val, index) {
-    setScrollValue(val);
-
-    if (onPickerChange) {
-      onPickerChange(val, index);
+      onPickerChange(val, index, newData);
     }
   }
 
   (0, _react.useEffect)(function () {
     setScrollValue(value);
-  }, [value, setScrollValue]);
+  }, [value]);
   var updateWrapperHeight = (0, _react.useCallback)(function () {
     if (wrapperRef && wrapperRef.current) {
       setWrapperHeight(wrapperRef.current.offsetHeight);
@@ -226,7 +217,6 @@ var PickerView = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       data: data,
       selectedValue: scrollValue,
       onValueChange: _onValueChange,
-      onPickerChange: _onPickerChange,
       clickable: clickable,
       itemHeight: itemHeight,
       wrapperHeight: wrapperHeight,
@@ -240,8 +230,7 @@ var PickerView = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       data: innerData,
       itemHeight: itemHeight,
       selectedValue: scrollValue,
-      onValueChange: _onValueChange,
-      onPickerChange: _onPickerChange
+      onValueChange: _onValueChange
     }, innerData.map(function (item, index) {
       return /*#__PURE__*/_react.default.createElement(_pickerCell.default, {
         key: index + "_picker_cell_normal",

package/cjs/picker-view/type.d.ts

@@ -52,12 +52,12 @@ export interface PickerViewProps {
      * 值, 格式是[value1, value2, value3], 对应数据源的相应级层value
      * @en Value, the format is [value1, value2, value3], corresponding to the corresponding level value of the data source
      */
-    value: ValueType[];
+    value?: ValueType[];
     /**
      * 每列数据选择变化后的回调函数
      * @en The callback function 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/cjs/slider/hooks/useSliderEvents.js

@@ -80,29 +80,29 @@ var useSliderEvents = function useSliderEvents(_ref) {
       return function (realTimeValue) {
         setValueGroup(realTimeValue);
       };
-    } else {
-      var index = Math.abs(valueGroup[0] - start) < Math.abs(valueGroup[1] - start) ? 0 : 1;
-
-      var handleValue = function handleValue(realTimeValue) {
-        setValueGroup(function (passValueGroup) {
-          if (typeof passValueGroup === 'number') {
-            return [passValueGroup, realTimeValue];
-          }
-
-          var newValueGroup = [].concat(passValueGroup);
-          newValueGroup[index] = realTimeValue;
-          return newValueGroup;
-        });
-      };
+    }
 
-      if (isTouching) {
-        setCommonIsTouching(index);
-        handleValue(start);
-        setIsTouching(IsTouchingStatus.Moving);
-      }
+    var index = Math.abs(valueGroup[0] - start) < Math.abs(valueGroup[1] - start) ? 0 : 1;
 
-      return handleValue;
+    var handleValue = function handleValue(realTimeValue) {
+      setValueGroup(function (passValueGroup) {
+        if (typeof passValueGroup === 'number') {
+          return [passValueGroup, realTimeValue];
+        }
+
+        var newValueGroup = [].concat(passValueGroup);
+        newValueGroup[index] = realTimeValue;
+        return newValueGroup;
+      });
+    };
+
+    if (isTouching) {
+      setCommonIsTouching(index);
+      handleValue(start);
+      setIsTouching(IsTouchingStatus.Moving);
     }
+
+    return handleValue;
   }, [touchStartPosition, getValueFromPosition]);
   (0, _react.useEffect)(function () {
     var _lineRef$current;

package/cjs/sticky/index.js

@@ -95,8 +95,8 @@ var Sticky = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     var containerTop = containerRect.top,
         containerBottom = containerRect.bottom,
         containerHeight = containerRect.height;
-    var disFromTop = placeholderClientRect.top - containerTop;
-    var disFromBottom = placeholderClientRect.top + calculatedHeight - containerBottom;
+    var disFromTop = Math.round(placeholderClientRect.top - containerTop);
+    var disFromBottom = Math.round(placeholderClientRect.top + calculatedHeight - containerBottom);
     var topFollowDifference = followBottom - followOffset - calculatedHeight - topOffset - containerTop;
     var bottomFollowDifference = containerHeight - followTop - followOffset - calculatedHeight - bottomOffset;
     setWasSticky(Boolean(isStickyRef.current));

package/cjs/style.d.ts

@@ -27,6 +27,8 @@ import './grid/style';
 import './image/style';
 import './show-monitor/style';
 import './image-preview/style';
+import './index-bar/style';
+import './keyboard/style';
 import './load-more/style';
 import './loading/style';
 import './masking/style';

package/cjs/style.js

@@ -58,6 +58,10 @@ require("./show-monitor/style");
 
 require("./image-preview/style");
 
+require("./index-bar/style");
+
+require("./keyboard/style");
+
 require("./load-more/style");
 
 require("./loading/style");