@nutui/nutui-react 1.3.5 → 1.3.7

package/dist/esm/Picker.js

@@ -3,164 +3,135 @@ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 var _excluded = ["isVisible", "title", "listData", "defaultValueData", "onConfirm", "onClose", "onCloseUpdate", "onChange", "className", "style", "threeDimensional", "swipeDuration"];
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 import React__default, { useState, useRef, useEffect, useImperativeHandle } from 'react';
 import Popup from './Popup.js';
 import { u as useTouch } from './useTouch-a2ea68c6.js';
 import { useConfig } from './ConfigProvider.js';
 import { c as cn } from './bem-893ad28d.js';
 import '@bem-react/classname';
-
 var InternalPickerSlot = function InternalPickerSlot(props, ref) {
   var _props$keyIndex = props.keyIndex,
-      keyIndex = _props$keyIndex === void 0 ? 0 : _props$keyIndex,
-      defaultValue = props.defaultValue,
-      _props$listData = props.listData,
-      listData = _props$listData === void 0 ? [] : _props$listData,
-      _props$threeDimension = props.threeDimensional,
-      threeDimensional = _props$threeDimension === void 0 ? true : _props$threeDimension,
-      _props$swipeDuration = props.swipeDuration,
-      swipeDuration = _props$swipeDuration === void 0 ? 1000 : _props$swipeDuration,
-      chooseItem = props.chooseItem;
+    keyIndex = _props$keyIndex === void 0 ? 0 : _props$keyIndex,
+    defaultValue = props.defaultValue,
+    _props$listData = props.listData,
+    listData = _props$listData === void 0 ? [] : _props$listData,
+    _props$threeDimension = props.threeDimensional,
+    threeDimensional = _props$threeDimension === void 0 ? true : _props$threeDimension,
+    _props$swipeDuration = props.swipeDuration,
+    swipeDuration = _props$swipeDuration === void 0 ? 1000 : _props$swipeDuration,
+    chooseItem = props.chooseItem;
   var touch = useTouch();
-  var DEFAULT_DURATION = 200; // 触发惯性滑动条件:
+  var DEFAULT_DURATION = 200;
+  // 触发惯性滑动条件:
   // 在手指离开屏幕时，如果和上一次 move 时的间隔小于 `MOMENTUM_TIME` 且 move
   // 距离大于 `MOMENTUM_DISTANCE` 时，执行惯性滑动
-
   var INERTIA_TIME = 300;
   var INERTIA_DISTANCE = 15;
-
   var _useState = useState(1),
-      _useState2 = _slicedToArray(_useState, 2),
-      currIndex = _useState2[0],
-      setCurrIndex = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    currIndex = _useState2[0],
+    setCurrIndex = _useState2[1];
   var lineSpacing = 36;
-
   var _useState3 = useState(0),
-      _useState4 = _slicedToArray(_useState3, 2),
-      touchTime = _useState4[0],
-      setTouchTime = _useState4[1];
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    touchTime = _useState4[0],
+    setTouchTime = _useState4[1];
   var _useState5 = useState('0deg'),
-      _useState6 = _slicedToArray(_useState5, 2),
-      touchDeg = _useState6[0],
-      setTouchDeg = _useState6[1];
-
+    _useState6 = _slicedToArray(_useState5, 2),
+    touchDeg = _useState6[0],
+    setTouchDeg = _useState6[1];
   var rotation = 20;
   var moving = useRef(false);
   var timer;
   useRef(null);
   var rollerRef = useRef(null);
   var pickerSlotRef = useRef(null);
-
   var _useState7 = useState(0),
-      _useState8 = _slicedToArray(_useState7, 2),
-      startTime = _useState8[0],
-      setStartTime = _useState8[1];
-
+    _useState8 = _slicedToArray(_useState7, 2),
+    startTime = _useState8[0],
+    setStartTime = _useState8[1];
   var _useState9 = useState(0),
-      _useState10 = _slicedToArray(_useState9, 2),
-      startY = _useState10[0],
-      setStartY = _useState10[1];
-
+    _useState10 = _slicedToArray(_useState9, 2),
+    startY = _useState10[0],
+    setStartY = _useState10[1];
   var transformY = useRef(0);
-
   var _useState11 = useState(0),
-      _useState12 = _slicedToArray(_useState11, 2),
-      scrollDistance = _useState12[0],
-      setScrollDistance = _useState12[1];
-
+    _useState12 = _slicedToArray(_useState11, 2),
+    scrollDistance = _useState12[0],
+    setScrollDistance = _useState12[1];
   var isHidden = function isHidden(index) {
     if (index >= currIndex + 8 || index <= currIndex - 8) {
       return true;
     }
-
     return false;
   };
-
   var setTransform = function setTransform() {
     var translateY = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
     var type = arguments.length > 1 ? arguments[1] : undefined;
     var time = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : DEFAULT_DURATION;
     var deg = arguments.length > 3 ? arguments[3] : undefined;
     var nTime = time;
-
     if (type !== 'end') {
       nTime = 0;
     }
-
     setTouchTime(nTime);
     setTouchDeg(deg);
     setScrollDistance(translateY);
   };
-
   var setMove = function setMove(move, type, time) {
     var updateMove = move + transformY.current;
-
     if (type === 'end') {
       // 限定滚动距离
       if (updateMove > 0) {
         updateMove = 0;
       }
-
       if (updateMove < -(listData.length - 1) * lineSpacing) {
         updateMove = -(listData.length - 1) * lineSpacing;
-      } // 设置滚动距离为lineSpacing的倍数值
-
-
+      }
+      // 设置滚动距离为lineSpacing的倍数值
       var endMove = Math.round(updateMove / lineSpacing) * lineSpacing;
       var deg = "".concat((Math.abs(Math.round(endMove / lineSpacing)) + 1) * rotation, "deg");
       setTransform(endMove, type, time, deg);
       setCurrIndex(Math.abs(Math.round(endMove / lineSpacing)) + 1);
     } else {
       var _deg = 0;
-      var currentDeg = (-updateMove / lineSpacing + 1) * rotation; // picker 滚动的最大角度
-
+      var currentDeg = (-updateMove / lineSpacing + 1) * rotation;
+      // picker 滚动的最大角度
       var maxDeg = (listData.length + 1) * rotation;
       var minDeg = 0;
       _deg = Math.min(Math.max(currentDeg, minDeg), maxDeg);
-
       if (minDeg < _deg && _deg < maxDeg) {
         setTransform(updateMove, '', undefined, "".concat(_deg, "deg"));
         setCurrIndex(Math.abs(Math.round(updateMove / lineSpacing)) + 1);
       }
     }
   };
-
   var setChooseValue = function setChooseValue(move) {
     chooseItem && chooseItem(listData === null || listData === void 0 ? void 0 : listData[Math.round(-move / lineSpacing)], keyIndex);
-  }; // 开始滚动
-
-
+  };
+  // 开始滚动
   var touchStart = function touchStart(event) {
     touch.start(event);
     setStartY(touch.deltaY);
     setStartTime(Date.now());
     transformY.current = scrollDistance;
   };
-
   var touchMove = function touchMove(event) {
     touch.move(event);
-
     if (touch.isVertical) {
       moving.current = true;
       preventDefault(event, true);
     }
-
     var move = touch.deltaY - startY;
     setMove(move);
   };
-
   var touchEnd = function touchEnd(event) {
     if (!moving.current) return;
     var move = touch.deltaY - startY;
-    var moveTime = Date.now() - startTime; // 区分是否为惯性滚动
-
+    var moveTime = Date.now() - startTime;
+    // 区分是否为惯性滚动
     if (moveTime <= INERTIA_TIME && Math.abs(move) > INERTIA_DISTANCE) {
       // 惯性滚动
       var distance = momentum(move, moveTime);
@@ -168,34 +139,29 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
     } else {
       setMove(move, 'end');
     }
-
     setTimeout(function () {
       // moving.current = false
       touch.reset();
     }, 0);
-  }; // 惯性滚动 距离
-
-
+  };
+  // 惯性滚动 距离
   var momentum = function momentum(distance, duration) {
-    var nDistance = distance; // 惯性滚动的速度
-
-    var speed = Math.abs(nDistance / duration); // 惯性滚动的距离
-
+    var nDistance = distance;
+    // 惯性滚动的速度
+    var speed = Math.abs(nDistance / duration);
+    // 惯性滚动的距离
     nDistance = speed / 0.003 * (nDistance < 0 ? -1 : 1);
     return nDistance;
   };
-
   var modifyStatus = function modifyStatus(type, val) {
     var value = val || defaultValue;
     var index = -1;
-
     if (value) {
       listData.some(function (item, idx) {
         if (item.value === value) {
           index = idx;
           return true;
         }
-
         return false;
       });
     } else {
@@ -205,46 +171,39 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
         }
       });
     }
-
     setCurrIndex(index === -1 ? 1 : index + 1);
     var move = index === -1 ? 0 : index * lineSpacing;
     type && setChooseValue(-move);
     setMove(-move);
-  }; // 惯性滚动结束
-
-
+  };
+  // 惯性滚动结束
   var stopMomentum = function stopMomentum() {
     moving.current = false;
     setTouchTime(0);
     setChooseValue(scrollDistance);
-  }; // 阻止默认事件
-
-
+  };
+  // 阻止默认事件
   var preventDefault = function preventDefault(event, isStopPropagation) {
     /* istanbul ignore else */
     if (typeof event.cancelable !== 'boolean' || event.cancelable) {
       event.preventDefault();
     }
-
     if (isStopPropagation) {
       event.stopPropagation();
     }
   };
-
   var touchRollerStyle = function touchRollerStyle() {
     return {
       transition: "transform ".concat(touchTime, "ms cubic-bezier(0.17, 0.89, 0.45, 1)"),
       transform: "rotate3d(1, 0, 0, ".concat(touchDeg, ")")
     };
   };
-
   var touchTileStyle = function touchTileStyle() {
     return {
       transition: "transform ".concat(touchTime, "ms cubic-bezier(0.17, 0.89, 0.45, 1)"),
       transform: "translate3d(0, ".concat(scrollDistance, "px, 0)")
     };
   };
-
   useEffect(function () {
     setScrollDistance(0);
     transformY.current = 0;
@@ -289,9 +248,7 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
     className: "nut-picker-indicator"
   }));
 };
-
 var PickerSlot = React__default.forwardRef(InternalPickerSlot);
-
 function useRefs() {
   var refs = React__default.useRef([]);
   var setRefs = React__default.useCallback(function (index) {
@@ -304,103 +261,84 @@ function useRefs() {
   }, []);
   return [refs.current, setRefs, reset];
 }
-
 var InternalPicker = function InternalPicker(props, ref) {
   var _useConfig = useConfig(),
-      locale = _useConfig.locale;
-
+    locale = _useConfig.locale;
   var isVisible = props.isVisible,
-      title = props.title,
-      _props$listData2 = props.listData,
-      listData = _props$listData2 === void 0 ? [] : _props$listData2,
-      defaultValueData = props.defaultValueData,
-      onConfirm = props.onConfirm,
-      onClose = props.onClose,
-      onCloseUpdate = props.onCloseUpdate,
-      onChange = props.onChange,
-      className = props.className,
-      style = props.style,
-      threeDimensional = props.threeDimensional,
-      swipeDuration = props.swipeDuration,
-      rest = _objectWithoutProperties(props, _excluded);
-
+    title = props.title,
+    _props$listData2 = props.listData,
+    listData = _props$listData2 === void 0 ? [] : _props$listData2,
+    defaultValueData = props.defaultValueData,
+    onConfirm = props.onConfirm,
+    onClose = props.onClose,
+    onCloseUpdate = props.onCloseUpdate,
+    onChange = props.onChange,
+    className = props.className,
+    style = props.style,
+    threeDimensional = props.threeDimensional,
+    swipeDuration = props.swipeDuration,
+    rest = _objectWithoutProperties(props, _excluded);
   var _useState13 = useState([]),
-      _useState14 = _slicedToArray(_useState13, 2),
-      chooseValueData = _useState14[0],
-      setchooseValueData = _useState14[1]; // 选择的数据的 value 值, 每一条数据的 value 值
-
-
+    _useState14 = _slicedToArray(_useState13, 2),
+    chooseValueData = _useState14[0],
+    setchooseValueData = _useState14[1]; // 选择的数据的 value 值, 每一条数据的 value 值
   var _useState15 = useState(0),
-      _useState16 = _slicedToArray(_useState15, 2),
-      columnIndex = _useState16[0],
-      setcolumnIndex = _useState16[1]; // 选中列
-
-
+    _useState16 = _slicedToArray(_useState15, 2),
+    columnIndex = _useState16[0],
+    setcolumnIndex = _useState16[1]; // 选中列
   var pickerRef = useRef(null);
-
   var _useRefs = useRefs(),
-      _useRefs2 = _slicedToArray(_useRefs, 2),
-      refs = _useRefs2[0],
-      setRefs = _useRefs2[1];
-
+    _useRefs2 = _slicedToArray(_useRefs, 2),
+    refs = _useRefs2[0],
+    setRefs = _useRefs2[1];
   var _useState17 = useState([]),
-      _useState18 = _slicedToArray(_useState17, 2),
-      columnsList = _useState18[0],
-      setColumnsList = _useState18[1]; // 格式化后每一列的数据
-
-
+    _useState18 = _slicedToArray(_useState17, 2),
+    columnsList = _useState18[0],
+    setColumnsList = _useState18[1]; // 格式化后每一列的数据
   var b = cn('picker');
-  var isConfirmEvent = useRef(false); // 默认值修改
-
+  var isConfirmEvent = useRef(false);
+  // 默认值修改
   useEffect(function () {
     if (defaultValueData && defaultValueData.length !== 0 && defaultValueData.toString() !== chooseValueData.toString()) {
       var data = _toConsumableArray(defaultValueData);
-
       setchooseValueData(data);
       setColumnsList(normalListData());
     }
-  }, [defaultValueData]); // 选中值进行修改
-
+  }, [defaultValueData]);
+  // 选中值进行修改
   useEffect(function () {
     console.log('修改');
     onChange && onChange(columnIndex, chooseValueData, selectedOptions());
-
     if (isConfirmEvent.current) {
       isConfirmEvent.current = false;
       onConfirm && onConfirm(chooseValueData, selectedOptions());
     }
-  }, [chooseValueData]); // 列表格式修改
-
+  }, [chooseValueData]);
+  // 列表格式修改
   useEffect(function () {
     init();
   }, [listData]);
-
   var closeActionSheet = function closeActionSheet() {
     onClose && onClose(chooseValueData, selectedOptions());
     onCloseUpdate && onCloseUpdate(chooseValueData, selectedOptions(), pickerRef);
-  }; // 点击确定
-
-
+  };
+  // 点击确定
   var confirm = function confirm() {
     var movings = false;
     refs.forEach(function (_ref) {
       if (_ref.moving) movings = true;
-
       _ref.stopMomentum();
     });
-
     if (movings) {
       isConfirmEvent.current = true;
     } else {
       onConfirm && onConfirm(chooseValueData, selectedOptions());
     }
-
     onClose && onClose(chooseValueData, selectedOptions());
     setTimeout(function () {
       isConfirmEvent.current = false;
     }, 0);
   };
-
   var selectedOptions = function selectedOptions() {
     var optins = [];
     columnsList.map(function (column, index) {
@@ -408,19 +346,16 @@ var InternalPicker = function InternalPicker(props, ref) {
       currOptions = column.filter(function (item) {
         return item.value === chooseValueData[index];
       });
-
       if (currOptions[0]) {
         optins.push(currOptions[0]);
       } else {
         column[0] && optins.push(column[0]);
       }
-
       return column;
     });
     return optins;
-  }; // 选择每一列的数据
-
-
+  };
+  // 选择每一列的数据
   var _chooseItem = function chooseItem(option, columnIndex) {
     if (option && Object.keys(option).length) {
       // 是否移动后是否与之前有差异
@@ -430,71 +365,57 @@ var InternalPicker = function InternalPicker(props, ref) {
           setchooseValueData(_toConsumableArray(chooseValueData));
           var index = columnIndex;
           var cursor = option;
-
           while (cursor && cursor.children && cursor.children[0]) {
             chooseValueData[index + 1] = cursor.children[0].value;
             setchooseValueData(_toConsumableArray(chooseValueData));
             index++;
             var cc = cursor.children[0];
             cursor = cc;
-          } // 当前改变列的下一列 children 值为空
-
-
+          }
+          // 当前改变列的下一列 children 值为空
           if (cursor && cursor.children) {
             chooseValueData[index + 1] = '';
             setchooseValueData(_toConsumableArray(chooseValueData));
           }
-
           setColumnsList(normalListData());
         } else {
           setchooseValueData(function (data) {
             var cdata = _toConsumableArray(data);
-
             cdata[columnIndex] = Object.prototype.hasOwnProperty.call(option, 'value') ? option.value : '';
             return cdata;
           });
         }
-
         setcolumnIndex(columnIndex);
       }
     }
-  }; // 传入的数据格式化
-
-
+  };
+  // 传入的数据格式化
   var normalListData = function normalListData() {
     var type = columnsType();
-
     switch (type) {
       case 'multiple':
         return listData;
-
       case 'cascade':
         // 级联数据处理
         return formatCascade(listData, chooseValueData);
-
       default:
         return [listData];
     }
-  }; // 每一列的类型
-
-
+  };
+  // 每一列的类型
   var columnsType = function columnsType() {
     var firstColumn = listData[0];
-
     if (firstColumn) {
       if (Array.isArray(firstColumn)) {
         return 'multiple';
       }
-
       if ('children' in firstColumn) {
         return 'cascade';
       }
     }
-
     return 'single';
-  }; // 级联数据格式化
-
-
+  };
+  // 级联数据格式化
   var formatCascade = function formatCascade(columns, defaultValues) {
     var formatted = [];
     var cursor = {
@@ -503,7 +424,6 @@ var InternalPicker = function InternalPicker(props, ref) {
       children: columns
     };
     var columnIndex = 0;
-
     var _loop = function _loop() {
       var options = cursor.children;
       var value = defaultValues[columnIndex];
@@ -515,14 +435,11 @@ var InternalPicker = function InternalPicker(props, ref) {
       columnIndex++;
       formatted.push(options);
     };
-
     while (cursor && cursor.children) {
       _loop();
     }
-
     return formatted;
   };
-
   var init = function init() {
     var data = [];
     var normalData = normalListData();
@@ -531,12 +448,10 @@ var InternalPicker = function InternalPicker(props, ref) {
       item[0] && data.push(item[0].value);
       return item;
     });
-
     if (!defaultValueData && chooseValueData.length === 0) {
       setchooseValueData([].concat(data));
     }
   };
-
   var renderToolbar = function renderToolbar() {
     return React__default.createElement("div", {
       className: b('control')
@@ -552,7 +467,6 @@ var InternalPicker = function InternalPicker(props, ref) {
       onClick: confirm
     }, locale.confirm));
   };
-
   return React__default.createElement(Popup, {
     visible: isVisible,
     position: "bottom",
@@ -580,6 +494,5 @@ var InternalPicker = function InternalPicker(props, ref) {
     });
   }))));
 };
-
 var Picker = React__default.forwardRef(InternalPicker);
 export { Picker as default };