@nutui/nutui-react 2.3.12-beta.0 → 2.3.12

package/dist/esm/Picker.js

@@ -1,29 +1,4 @@
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-var _excluded = ["children", "visible", "title", "options", "closeOnOverlayClick", "popupProps", "defaultValue", "className", "style", "threeDimensional", "duration", "onConfirm", "onCancel", "onClose", "afterClose", "onChange"];
-function ownKeys(e, r) {
-  var t = Object.keys(e);
-  if (Object.getOwnPropertySymbols) {
-    var o = Object.getOwnPropertySymbols(e);
-    r && (o = o.filter(function(r2) {
-      return Object.getOwnPropertyDescriptor(e, r2).enumerable;
-    })), t.push.apply(t, o);
-  }
-  return t;
-}
-function _objectSpread(e) {
-  for (var r = 1; r < arguments.length; r++) {
-    var t = null != arguments[r] ? arguments[r] : {};
-    r % 2 ? ownKeys(Object(t), true).forEach(function(r2) {
-      _defineProperty(e, r2, t[r2]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r2) {
-      Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2));
-    });
-  }
-  return e;
-}
+import { _ as __rest } from "./tslib.es6.js";
 import React__default, { useState, useRef, useEffect, useImperativeHandle } from "react";
 import classNames from "classnames";
 import { P as Popup } from "./popup2.js";
@@ -34,35 +9,33 @@ import { u as useRefs } from "./use-refs.js";
 import { useConfig } from "./ConfigProvider.js";
 import { u as usePropsValue } from "./use-props-value.js";
 import { C as ComponentDefaults } from "./typings.js";
-var InternalPickerPanel = function InternalPickerPanel2(props, ref) {
-  var _props$keyIndex = props.keyIndex, keyIndex = _props$keyIndex === void 0 ? 0 : _props$keyIndex, defaultValue = props.defaultValue, _props$options = props.options, options = _props$options === void 0 ? [] : _props$options, _props$threeDimension = props.threeDimensional, threeDimensional = _props$threeDimension === void 0 ? true : _props$threeDimension, _props$duration = props.duration, duration = _props$duration === void 0 ? 1e3 : _props$duration, chooseItem = props.chooseItem;
-  var touch = useTouch();
-  var DEFAULT_DURATION = 200;
-  var INERTIA_TIME = 300;
-  var INERTIA_DISTANCE = 15;
-  var _useState = useState(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];
-  var _useState5 = useState("0deg"), _useState6 = _slicedToArray(_useState5, 2), touchDeg = _useState6[0], setTouchDeg = _useState6[1];
-  var rotation = 20;
-  var moving = useRef(false);
-  var timer;
-  var rollerRef = useRef(null);
-  var PickerPanelRef = useRef(null);
-  var _useState7 = useState(0), _useState8 = _slicedToArray(_useState7, 2), startTime = _useState8[0], setStartTime = _useState8[1];
-  var _useState9 = useState(0), _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];
-  var isHidden = function isHidden2(index) {
+const InternalPickerPanel = (props, ref) => {
+  const { keyIndex = 0, defaultValue, options = [], threeDimensional = true, duration = 1e3, chooseItem } = props;
+  const touch = useTouch();
+  const DEFAULT_DURATION = 200;
+  const INERTIA_TIME = 300;
+  const INERTIA_DISTANCE = 15;
+  const [currIndex, setCurrIndex] = useState(1);
+  const lineSpacing = 36;
+  const [touchTime, setTouchTime] = useState(0);
+  const [touchDeg, setTouchDeg] = useState("0deg");
+  const rotation = 20;
+  const moving = useRef(false);
+  let timer;
+  const rollerRef = useRef(null);
+  const PickerPanelRef = useRef(null);
+  const [startTime, setStartTime] = useState(0);
+  const [startY, setStartY] = useState(0);
+  const transformY = useRef(0);
+  const [scrollDistance, setScrollDistance] = useState(0);
+  const isHidden = (index) => {
     if (index >= currIndex + 8 || index <= currIndex - 8) {
       return true;
     }
     return false;
   };
-  var setTransform = function setTransform2(type, deg) {
-    var time = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : DEFAULT_DURATION;
-    var translateY = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : 0;
-    var nTime = time;
+  const setTransform = (type, deg, time = DEFAULT_DURATION, translateY = 0) => {
+    let nTime = time;
     if (type !== "end") {
       nTime = 0;
     }
@@ -70,8 +43,8 @@ var InternalPickerPanel = function InternalPickerPanel2(props, ref) {
     setTouchDeg(deg);
     setScrollDistance(translateY);
   };
-  var setMove = function setMove2(move, type, time) {
-    var updateMove = move + transformY.current;
+  const setMove = (move, type, time) => {
+    let updateMove = move + transformY.current;
     if (type === "end") {
       if (updateMove > 0) {
         updateMove = 0;
@@ -79,66 +52,66 @@ var InternalPickerPanel = function InternalPickerPanel2(props, ref) {
       if (updateMove < -(options.length - 1) * lineSpacing) {
         updateMove = -(options.length - 1) * lineSpacing;
       }
-      var endMove = Math.round(updateMove / lineSpacing) * lineSpacing;
-      var deg = "".concat((Math.abs(Math.round(endMove / lineSpacing)) + 1) * rotation, "deg");
+      const endMove = Math.round(updateMove / lineSpacing) * lineSpacing;
+      const deg = `${(Math.abs(Math.round(endMove / lineSpacing)) + 1) * rotation}deg`;
       setTransform(type, deg, time, endMove);
       setCurrIndex(Math.abs(Math.round(endMove / lineSpacing)) + 1);
     } else {
-      var _deg = 0;
-      var currentDeg = (-updateMove / lineSpacing + 1) * rotation;
-      var maxDeg = (options.length + 1) * rotation;
-      var minDeg = 0;
-      _deg = Math.min(Math.max(currentDeg, minDeg), maxDeg);
-      if (minDeg < _deg && _deg < maxDeg) {
-        setTransform("", "".concat(_deg, "deg"), void 0, updateMove);
+      let deg = 0;
+      const currentDeg = (-updateMove / lineSpacing + 1) * rotation;
+      const maxDeg = (options.length + 1) * rotation;
+      const minDeg = 0;
+      deg = Math.min(Math.max(currentDeg, minDeg), maxDeg);
+      if (minDeg < deg && deg < maxDeg) {
+        setTransform("", `${deg}deg`, void 0, updateMove);
         setCurrIndex(Math.abs(Math.round(updateMove / lineSpacing)) + 1);
       }
     }
   };
-  var setChooseValue = function setChooseValue2(move) {
-    chooseItem === null || chooseItem === void 0 || chooseItem(options === null || options === void 0 ? void 0 : options[Math.round(-move / lineSpacing)], keyIndex);
+  const setChooseValue = (move) => {
+    chooseItem === null || chooseItem === void 0 ? void 0 : chooseItem(options === null || options === void 0 ? void 0 : options[Math.round(-move / lineSpacing)], keyIndex);
   };
-  var touchStart = function touchStart2(event) {
+  const touchStart = (event) => {
     touch.start(event);
     setStartY(touch.deltaY.current);
     setStartTime(Date.now());
     transformY.current = scrollDistance;
   };
-  var touchMove = function touchMove2(event) {
+  const touchMove = (event) => {
     touch.move(event);
     if (touch.isVertical) {
       moving.current = true;
       preventDefault(event, true);
     }
-    var move = touch.deltaY.current - startY;
+    const move = touch.deltaY.current - startY;
     setMove(move);
   };
-  var touchEnd = function touchEnd2() {
+  const touchEnd = () => {
     if (!moving.current)
       return;
-    var move = touch.deltaY.current - startY;
-    var moveTime = Date.now() - startTime;
+    const move = touch.deltaY.current - startY;
+    const moveTime = Date.now() - startTime;
     if (moveTime <= INERTIA_TIME && Math.abs(move) > INERTIA_DISTANCE) {
-      var distance = momentum(move, moveTime);
+      const distance = momentum(move, moveTime);
       setMove(distance, "end", +duration);
     } else {
       setMove(move, "end");
     }
-    setTimeout(function() {
+    setTimeout(() => {
       touch.reset();
     }, 0);
   };
-  var momentum = function momentum2(distance, duration2) {
-    var nDistance = distance;
-    var speed = Math.abs(nDistance / duration2);
+  const momentum = (distance, duration2) => {
+    let nDistance = distance;
+    const speed = Math.abs(nDistance / duration2);
     nDistance = speed / 3e-3 * (nDistance < 0 ? -1 : 1);
     return nDistance;
   };
-  var modifyStatus = function modifyStatus2(type, val) {
-    var value = val || defaultValue;
-    var index = -1;
+  const modifyStatus = (type, val) => {
+    const value = val || defaultValue;
+    let index = -1;
     if (value) {
-      options.some(function(item, idx) {
+      options.some((item, idx) => {
         if (item.value === value) {
           index = idx;
           return true;
@@ -146,23 +119,23 @@ var InternalPickerPanel = function InternalPickerPanel2(props, ref) {
         return false;
       });
     } else {
-      options.forEach(function(item, i) {
+      options.forEach((item, i) => {
         if (item.value === defaultValue) {
           index = i;
         }
       });
     }
     setCurrIndex(index === -1 ? 1 : index + 1);
-    var move = index === -1 ? 0 : index * lineSpacing;
+    const move = index === -1 ? 0 : index * lineSpacing;
     type && setChooseValue(-move);
     setMove(-move);
   };
-  var stopMomentum = function stopMomentum2() {
+  const stopMomentum = () => {
     moving.current = false;
     setTouchTime(0);
     setChooseValue(scrollDistance);
   };
-  var preventDefault = function preventDefault2(event, isStopPropagation) {
+  const preventDefault = (event, isStopPropagation) => {
     if (typeof event.cancelable !== "boolean" || event.cancelable) {
       event.preventDefault();
     }
@@ -170,155 +143,133 @@ var InternalPickerPanel = function InternalPickerPanel2(props, ref) {
       event.stopPropagation();
     }
   };
-  var touchRollerStyle = function touchRollerStyle2() {
+  const touchRollerStyle = () => {
     return {
-      transition: "transform ".concat(touchTime, "ms cubic-bezier(0.17, 0.89, 0.45, 1)"),
-      transform: "rotate3d(1, 0, 0, ".concat(touchDeg, ")")
+      transition: `transform ${touchTime}ms cubic-bezier(0.17, 0.89, 0.45, 1)`,
+      transform: `rotate3d(1, 0, 0, ${touchDeg})`
     };
   };
-  var touchTileStyle = function touchTileStyle2() {
+  const touchTileStyle = () => {
     return {
-      transition: "transform ".concat(touchTime, "ms cubic-bezier(0.17, 0.89, 0.45, 1)"),
-      transform: "translate3d(0, ".concat(scrollDistance, "px, 0)")
+      transition: `transform ${touchTime}ms cubic-bezier(0.17, 0.89, 0.45, 1)`,
+      transform: `translate3d(0, ${scrollDistance}px, 0)`
     };
   };
-  useEffect(function() {
+  useEffect(() => {
     setScrollDistance(0);
     transformY.current = 0;
     modifyStatus(false);
-    return function() {
+    return () => {
       clearTimeout(timer);
     };
   }, [options]);
-  useImperativeHandle(ref, function() {
-    return {
-      stopMomentum,
-      moving: moving.current
-    };
-  });
-  useEffect(function() {
-    var _PickerPanelRef$curre, _PickerPanelRef$curre2, _PickerPanelRef$curre3;
-    var options2 = passiveSupported ? {
-      passive: false
-    } : false;
-    (_PickerPanelRef$curre = PickerPanelRef.current) === null || _PickerPanelRef$curre === void 0 || _PickerPanelRef$curre.addEventListener("touchstart", touchStart, options2);
-    (_PickerPanelRef$curre2 = PickerPanelRef.current) === null || _PickerPanelRef$curre2 === void 0 || _PickerPanelRef$curre2.addEventListener("touchmove", touchMove, options2);
-    (_PickerPanelRef$curre3 = PickerPanelRef.current) === null || _PickerPanelRef$curre3 === void 0 || _PickerPanelRef$curre3.addEventListener("touchend", touchEnd, options2);
-    return function() {
-      var _PickerPanelRef$curre4, _PickerPanelRef$curre5, _PickerPanelRef$curre6;
-      (_PickerPanelRef$curre4 = PickerPanelRef.current) === null || _PickerPanelRef$curre4 === void 0 || _PickerPanelRef$curre4.removeEventListener("touchstart", touchStart);
-      (_PickerPanelRef$curre5 = PickerPanelRef.current) === null || _PickerPanelRef$curre5 === void 0 || _PickerPanelRef$curre5.removeEventListener("touchmove", touchMove);
-      (_PickerPanelRef$curre6 = PickerPanelRef.current) === null || _PickerPanelRef$curre6 === void 0 || _PickerPanelRef$curre6.removeEventListener("touchend", touchEnd);
+  useImperativeHandle(ref, () => ({
+    stopMomentum,
+    moving: moving.current
+  }));
+  useEffect(() => {
+    var _a, _b, _c;
+    const options2 = passiveSupported ? { passive: false } : false;
+    (_a = PickerPanelRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener("touchstart", touchStart, options2);
+    (_b = PickerPanelRef.current) === null || _b === void 0 ? void 0 : _b.addEventListener("touchmove", touchMove, options2);
+    (_c = PickerPanelRef.current) === null || _c === void 0 ? void 0 : _c.addEventListener("touchend", touchEnd, options2);
+    return () => {
+      var _a2, _b2, _c2;
+      (_a2 = PickerPanelRef.current) === null || _a2 === void 0 ? void 0 : _a2.removeEventListener("touchstart", touchStart);
+      (_b2 = PickerPanelRef.current) === null || _b2 === void 0 ? void 0 : _b2.removeEventListener("touchmove", touchMove);
+      (_c2 = PickerPanelRef.current) === null || _c2 === void 0 ? void 0 : _c2.removeEventListener("touchend", touchEnd);
     };
   });
-  return React__default.createElement("div", {
-    className: "nut-picker-list",
-    ref: PickerPanelRef,
-    onTouchStart: touchStart,
-    onTouchMove: touchMove,
-    onTouchEnd: touchEnd
-  }, React__default.createElement("div", {
-    className: "nut-picker-roller",
-    ref: rollerRef,
-    style: threeDimensional ? touchRollerStyle() : touchTileStyle(),
-    onTransitionEnd: stopMomentum
-  }, threeDimensional && options.map(function(item, index) {
-    return React__default.createElement("div", {
-      className: "nut-picker-roller-item ".concat(isHidden(index + 1) && "nut-picker-roller-item-hidden"),
-      style: {
-        transform: "rotate3d(1, 0, 0, ".concat(-rotation * (index + 1), "deg) translate3d(0px, 0px, 104px)")
-      },
-      key: item.value ? item.value : index
-    }, React__default.createElement(React__default.Fragment, null, item.text));
-  }), !threeDimensional && options.map(function(item, index) {
-    return React__default.createElement("div", {
-      className: "nut-picker-roller-item-title",
-      key: item.value ? item.value : index
-    }, React__default.createElement(React__default.Fragment, null, item.text));
-  })), React__default.createElement("div", {
-    className: "nut-picker-mask"
-  }), React__default.createElement("div", {
-    className: "nut-picker-indicator"
-  }));
+  return React__default.createElement(
+    "div",
+    { className: "nut-picker-list", ref: PickerPanelRef, onTouchStart: touchStart, onTouchMove: touchMove, onTouchEnd: touchEnd },
+    React__default.createElement(
+      "div",
+      { className: "nut-picker-roller", ref: rollerRef, style: threeDimensional ? touchRollerStyle() : touchTileStyle(), onTransitionEnd: stopMomentum },
+      threeDimensional && options.map((item, index) => {
+        return React__default.createElement(
+          "div",
+          { className: `nut-picker-roller-item ${isHidden(index + 1) && "nut-picker-roller-item-hidden"}`, style: {
+            transform: `rotate3d(1, 0, 0, ${-rotation * (index + 1)}deg) translate3d(0px, 0px, 104px)`
+          }, key: item.value ? item.value : index },
+          React__default.createElement(React__default.Fragment, null, item.text)
+        );
+      }),
+      !threeDimensional && options.map((item, index) => {
+        return React__default.createElement(
+          "div",
+          { className: "nut-picker-roller-item-title", key: item.value ? item.value : index },
+          React__default.createElement(React__default.Fragment, null, item.text)
+        );
+      })
+    ),
+    React__default.createElement("div", { className: "nut-picker-mask" }),
+    React__default.createElement("div", { className: "nut-picker-indicator" })
+  );
 };
-var PickerPanel = React__default.forwardRef(InternalPickerPanel);
-var PickerPanel$1 = PickerPanel;
-var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
-  title: "",
-  options: [],
-  value: [],
-  defaultValue: [],
-  threeDimensional: true,
-  closeOnOverlayClick: true,
-  duration: 1e3
-});
-var InternalPicker = function InternalPicker2(props, ref) {
-  var _useConfig = useConfig(), locale = _useConfig.locale;
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, visible = _defaultProps$props.visible, title = _defaultProps$props.title, _defaultProps$props$o = _defaultProps$props.options, options = _defaultProps$props$o === void 0 ? [] : _defaultProps$props$o, closeOnOverlayClick = _defaultProps$props.closeOnOverlayClick, _defaultProps$props$p = _defaultProps$props.popupProps, popupProps = _defaultProps$props$p === void 0 ? {} : _defaultProps$props$p, _defaultProps$props$d = _defaultProps$props.defaultValue, defaultValue = _defaultProps$props$d === void 0 ? [] : _defaultProps$props$d, className = _defaultProps$props.className, style = _defaultProps$props.style, threeDimensional = _defaultProps$props.threeDimensional, duration = _defaultProps$props.duration, onConfirm = _defaultProps$props.onConfirm, onCancel = _defaultProps$props.onCancel, onClose = _defaultProps$props.onClose, _afterClose = _defaultProps$props.afterClose, onChange = _defaultProps$props.onChange, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
-  var classPrefix = "nut-picker";
-  var classes = classNames(classPrefix, className);
-  var _usePropsValue = usePropsValue({
+const PickerPanel = React__default.forwardRef(InternalPickerPanel);
+const PickerPanel$1 = PickerPanel;
+const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { title: "", options: [], value: [], defaultValue: [], threeDimensional: true, closeOnOverlayClick: true, duration: 1e3 });
+const InternalPicker = (props, ref) => {
+  const { locale } = useConfig();
+  const _a = Object.assign(Object.assign({}, defaultProps), props), { children, visible, title, options = [], closeOnOverlayClick, popupProps = {}, defaultValue = [], className, style, threeDimensional, duration, onConfirm, onCancel, onClose, afterClose, onChange } = _a, rest = __rest(_a, ["children", "visible", "title", "options", "closeOnOverlayClick", "popupProps", "defaultValue", "className", "style", "threeDimensional", "duration", "onConfirm", "onCancel", "onClose", "afterClose", "onChange"]);
+  const classPrefix = "nut-picker";
+  const classes = classNames(classPrefix, className);
+  const [selectedValue, setSelectedValue] = usePropsValue({
     value: props.value,
-    defaultValue: _toConsumableArray(defaultValue),
-    finalValue: _toConsumableArray(defaultValue),
-    onChange: function onChange2(val) {
-      var _props$onConfirm;
-      (_props$onConfirm = props.onConfirm) === null || _props$onConfirm === void 0 || _props$onConfirm.call(props, setSelectedOptions(), val);
+    defaultValue: [...defaultValue],
+    finalValue: [...defaultValue],
+    onChange: (val) => {
+      var _a2;
+      (_a2 = props.onConfirm) === null || _a2 === void 0 ? void 0 : _a2.call(props, setSelectedOptions(), val);
     }
-  }), _usePropsValue2 = _slicedToArray(_usePropsValue, 2), selectedValue = _usePropsValue2[0], setSelectedValue = _usePropsValue2[1];
-  var _usePropsValue3 = usePropsValue({
+  });
+  const [innerVisible, setInnerVisible] = usePropsValue({
     value: props.visible,
     defaultValue: false,
     finalValue: false,
-    onChange: function onChange2(val) {
-      var _props$onClose;
-      (_props$onClose = props.onClose) === null || _props$onClose === void 0 || _props$onClose.call(props, setSelectedOptions(), innerValue);
+    onChange: (val) => {
+      var _a2;
+      (_a2 = props.onClose) === null || _a2 === void 0 ? void 0 : _a2.call(props, setSelectedOptions(), innerValue);
     }
-  }), _usePropsValue4 = _slicedToArray(_usePropsValue3, 2), innerVisible = _usePropsValue4[0], setInnerVisible = _usePropsValue4[1];
-  var _useState13 = useState(selectedValue), _useState14 = _slicedToArray(_useState13, 2), innerValue = _useState14[0], setInnerValue = _useState14[1];
-  var _useState15 = useState(0), _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];
-  var _useState17 = useState([]), _useState18 = _slicedToArray(_useState17, 2), columnsList = _useState18[0], setColumnsList = _useState18[1];
-  var isConfirmEvent = useRef(false);
-  var actions = {
-    open: function open() {
+  });
+  const [innerValue, setInnerValue] = useState(selectedValue);
+  const [columnIndex, setColumnIndex] = useState(0);
+  const pickerRef = useRef(null);
+  const [refs, setRefs] = useRefs();
+  const [columnsList, setColumnsList] = useState([]);
+  const isConfirmEvent = useRef(false);
+  const actions = {
+    open: () => {
       setInnerVisible(true);
     },
-    close: function close() {
+    close: () => {
       setInnerVisible(false);
     }
   };
-  useImperativeHandle(ref, function() {
-    return actions;
-  });
-  var formatCascade = function formatCascade2(columns, values) {
-    var formatted = [];
-    var columnOptions = {
+  useImperativeHandle(ref, () => actions);
+  const formatCascade = (columns, values) => {
+    const formatted = [];
+    let columnOptions = {
       text: "",
       value: "",
       children: columns
     };
-    var columnIndex2 = 0;
-    var _loop = function _loop2() {
-      var options2 = columnOptions.children;
-      var value = values[columnIndex2];
-      var index = options2.findIndex(function(columnItem) {
-        return columnItem.value === value;
-      });
+    let columnIndex2 = 0;
+    while (columnOptions && columnOptions.children) {
+      const options2 = columnOptions.children;
+      const value = values[columnIndex2];
+      let index = options2.findIndex((columnItem) => columnItem.value === value);
       if (index === -1)
         index = 0;
       columnOptions = columnOptions.children[index];
       columnIndex2++;
       formatted.push(options2);
-    };
-    while (columnOptions && columnOptions.children) {
-      _loop();
     }
     return formatted;
   };
-  var columnsType = function columnsType2() {
-    var firstColumn = options[0];
+  const columnsType = () => {
+    const firstColumn = options[0];
     if (firstColumn) {
       if (Array.isArray(firstColumn)) {
         return "multiple";
@@ -329,8 +280,8 @@ var InternalPicker = function InternalPicker2(props, ref) {
     }
     return "single";
   };
-  var normalListData = function normalListData2(innerValue2) {
-    var type = columnsType();
+  const normalListData = (innerValue2) => {
+    const type = columnsType();
     switch (type) {
       case "multiple":
         return options;
@@ -340,36 +291,34 @@ var InternalPicker = function InternalPicker2(props, ref) {
         return [options];
     }
   };
-  var init = function init2() {
-    var normalData = normalListData(innerValue);
+  const init = () => {
+    const normalData = normalListData(innerValue);
     setColumnsList(normalData);
-    var data = [];
-    normalData.length > 0 && normalData.map(function(item) {
+    const data = [];
+    normalData.length > 0 && normalData.map((item) => {
       item[0] && data.push(item[0].value);
       return item;
     });
     if (!innerValue.length && innerValue.length === 0) {
-      setInnerValue([].concat(data));
+      setInnerValue([...data]);
     }
   };
-  useEffect(function() {
+  useEffect(() => {
     setInnerValue(innerValue !== selectedValue ? selectedValue : innerValue);
   }, [innerVisible, selectedValue]);
-  useEffect(function() {
+  useEffect(() => {
     if (innerVisible) {
       init();
     }
   }, [options, innerVisible]);
-  useEffect(function() {
+  useEffect(() => {
     onChange && onChange(setSelectedOptions(), innerValue, columnIndex);
   }, [innerValue, columnsList]);
-  var setSelectedOptions = function setSelectedOptions2() {
-    var options2 = [];
-    var currOptions = [];
-    columnsList.forEach(function(columnOptions, index) {
-      currOptions = columnOptions.filter(function(item) {
-        return item.value === innerValue[index];
-      });
+  const setSelectedOptions = () => {
+    const options2 = [];
+    let currOptions = [];
+    columnsList.forEach((columnOptions, index) => {
+      currOptions = columnOptions.filter((item) => item.value === innerValue[index]);
       if (currOptions[0]) {
         options2.push(currOptions[0]);
       } else {
@@ -378,29 +327,31 @@ var InternalPicker = function InternalPicker2(props, ref) {
     });
     return options2;
   };
-  var _chooseItem = function chooseItem(columnOptions, columnIndex2) {
-    var values = [];
-    var start = columnIndex2;
+  const chooseItem = (columnOptions, columnIndex2) => {
+    var _a2, _b;
+    const values = [];
+    const start = columnIndex2;
     if (columnOptions && Object.keys(columnOptions).length) {
       if (values[columnIndex2] !== columnOptions.value) {
         if (columnsType() === "cascade") {
-          var _columnOptions2;
           values[columnIndex2] = columnOptions.value || "";
-          while ((_columnOptions = columnOptions) !== null && _columnOptions !== void 0 && (_columnOptions = _columnOptions.children) !== null && _columnOptions !== void 0 && _columnOptions[0]) {
-            var _columnOptions;
+          while ((_a2 = columnOptions === null || columnOptions === void 0 ? void 0 : columnOptions.children) === null || _a2 === void 0 ? void 0 : _a2[0]) {
             values[columnIndex2 + 1] = columnOptions.children[0].value;
             columnIndex2++;
             columnOptions = columnOptions.children[0];
           }
-          if ((_columnOptions2 = columnOptions) !== null && _columnOptions2 !== void 0 && (_columnOptions2 = _columnOptions2.children) !== null && _columnOptions2 !== void 0 && _columnOptions2.length) {
+          if ((_b = columnOptions === null || columnOptions === void 0 ? void 0 : columnOptions.children) === null || _b === void 0 ? void 0 : _b.length) {
             values[columnIndex2 + 1] = "";
           }
-          var combineResult = [].concat(_toConsumableArray(innerValue.slice(0, start)), _toConsumableArray(values.splice(start)));
+          const combineResult = [
+            ...innerValue.slice(0, start),
+            ...values.splice(start)
+          ];
           setInnerValue(combineResult);
           setColumnsList(normalListData(combineResult));
         } else {
-          setInnerValue(function(data) {
-            var cdata = _toConsumableArray(data);
+          setInnerValue((data) => {
+            const cdata = [...data];
             cdata[columnIndex2] = Object.prototype.hasOwnProperty.call(columnOptions, "value") ? columnOptions.value : "";
             return cdata;
           });
@@ -409,9 +360,9 @@ var InternalPicker = function InternalPicker2(props, ref) {
       }
     }
   };
-  var confirm = function confirm2() {
-    var moving = false;
-    refs.forEach(function(ref2) {
+  const confirm = () => {
+    let moving = false;
+    refs.forEach((ref2) => {
       if (ref2.moving)
         moving = true;
       ref2.stopMomentum();
@@ -422,68 +373,56 @@ var InternalPicker = function InternalPicker2(props, ref) {
       setSelectedValue(innerValue, true);
       setInnerVisible(false);
     }
-    setTimeout(function() {
+    setTimeout(() => {
       isConfirmEvent.current = false;
     }, 0);
   };
-  var renderTitleBar = function renderTitleBar2() {
-    return React__default.createElement("div", {
-      className: "".concat(classPrefix, "-control")
-    }, React__default.createElement("span", {
-      className: "".concat(classPrefix, "-cancel-btn"),
-      onClick: function onClick(e) {
+  const renderTitleBar = () => {
+    return React__default.createElement(
+      "div",
+      { className: `${classPrefix}-control` },
+      React__default.createElement("span", { className: `${classPrefix}-cancel-btn`, onClick: (e) => {
         e.stopPropagation();
-        onCancel === null || onCancel === void 0 || onCancel();
+        onCancel === null || onCancel === void 0 ? void 0 : onCancel();
         setInnerVisible(false);
-      }
-    }, locale.cancel), React__default.createElement("div", {
-      className: "".concat(classPrefix, "-title")
-    }, title || ""), React__default.createElement("span", {
-      className: "".concat(classPrefix, "-confirm-btn"),
-      onClick: function onClick(e) {
+      } }, locale.cancel),
+      React__default.createElement("div", { className: `${classPrefix}-title` }, title || ""),
+      React__default.createElement("span", { className: `${classPrefix}-confirm-btn`, onClick: (e) => {
         e.stopPropagation();
         confirm();
-      }
-    }, locale.confirm));
+      } }, locale.confirm)
+    );
   };
-  return React__default.createElement(React__default.Fragment, null, typeof children === "function" && children(selectedValue), React__default.createElement(Popup, _objectSpread(_objectSpread({}, popupProps), {}, {
-    visible: innerVisible,
-    position: "bottom",
-    onOverlayClick: function onOverlayClick() {
-      if (closeOnOverlayClick) {
-        var _props$onCancel;
-        (_props$onCancel = props.onCancel) === null || _props$onCancel === void 0 || _props$onCancel.call(props);
-        setInnerVisible(false);
-      }
-    },
-    afterClose: function afterClose() {
-      _afterClose === null || _afterClose === void 0 || _afterClose(setSelectedOptions(), innerValue, pickerRef);
-    }
-  }), React__default.createElement("div", _objectSpread({
-    className: classes,
-    style
-  }, rest), renderTitleBar(), typeof children !== "function" && children, React__default.createElement("div", {
-    className: "".concat(classPrefix, "-panel"),
-    ref: pickerRef
-  }, columnsList === null || columnsList === void 0 ? void 0 : columnsList.map(function(item, index) {
-    return React__default.createElement(PickerPanel$1, {
-      ref: setRefs(index),
-      defaultValue: innerValue === null || innerValue === void 0 ? void 0 : innerValue[index],
-      options: item,
-      threeDimensional,
-      chooseItem: function chooseItem(value, index2) {
-        return _chooseItem(value, index2);
-      },
-      duration,
-      key: index,
-      keyIndex: index
-    });
-  }))), React__default.createElement(SafeArea, {
-    position: "bottom"
-  })));
+  return React__default.createElement(
+    React__default.Fragment,
+    null,
+    typeof children === "function" && children(selectedValue),
+    React__default.createElement(
+      Popup,
+      Object.assign({}, popupProps, { visible: innerVisible, position: "bottom", onOverlayClick: () => {
+        var _a2;
+        if (closeOnOverlayClick) {
+          (_a2 = props.onCancel) === null || _a2 === void 0 ? void 0 : _a2.call(props);
+          setInnerVisible(false);
+        }
+      }, afterClose: () => {
+        afterClose === null || afterClose === void 0 ? void 0 : afterClose(setSelectedOptions(), innerValue, pickerRef);
+      } }),
+      React__default.createElement(
+        "div",
+        Object.assign({ className: classes, style }, rest),
+        renderTitleBar(),
+        typeof children !== "function" && children,
+        React__default.createElement("div", { className: `${classPrefix}-panel`, ref: pickerRef }, columnsList === null || columnsList === void 0 ? void 0 : columnsList.map((item, index) => {
+          return React__default.createElement(PickerPanel$1, { ref: setRefs(index), defaultValue: innerValue === null || innerValue === void 0 ? void 0 : innerValue[index], options: item, threeDimensional, chooseItem: (value, index2) => chooseItem(value, index2), duration, key: index, keyIndex: index });
+        }))
+      ),
+      React__default.createElement(SafeArea, { position: "bottom" })
+    )
+  );
 };
-var Picker = React__default.forwardRef(InternalPicker);
-var Picker$1 = Picker;
+const Picker = React__default.forwardRef(InternalPicker);
+const Picker$1 = Picker;
 export {
   Picker$1 as default
 };