@nutui/nutui-react 1.3.1-beta.4 → 1.3.2-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (53) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/dist/esm/ActionSheet.js +10 -9
  3. package/dist/esm/Address.js +1 -1
  4. package/dist/esm/Badge.js +3 -3
  5. package/dist/esm/ConfigProvider.js +6 -0
  6. package/dist/esm/Elevator.js +38 -52
  7. package/dist/esm/Menu.js +26 -10
  8. package/dist/esm/NoticeBar.js +1 -1
  9. package/dist/esm/Picker.js +125 -49
  10. package/dist/esm/PullToRefresh/style/index.js +2 -0
  11. package/dist/esm/PullToRefresh.js +367 -0
  12. package/dist/esm/Radio.js +2 -0
  13. package/dist/esm/nutui-react.es.js +1 -0
  14. package/dist/locales/base.d.ts +6 -0
  15. package/dist/locales/base.js +1 -1
  16. package/dist/locales/en-US.js +7 -1
  17. package/dist/locales/id-ID.js +7 -1
  18. package/dist/locales/zh-CN.js +7 -1
  19. package/dist/locales/zh-TW.js +7 -1
  20. package/dist/nutui.react.es.js +10578 -9765
  21. package/dist/nutui.react.umd.js +10577 -9763
  22. package/dist/packages/actionsheet/actionsheet.scss +2 -0
  23. package/dist/packages/elevator/elevator.scss +1 -0
  24. package/dist/packages/pulltorefresh/pulltorefresh.scss +18 -0
  25. package/dist/style.css +1 -1
  26. package/dist/style.es.js +1 -1
  27. package/dist/styles/themes/default.scss +1 -0
  28. package/dist/types/actionsheet/__test__/actionsheet.spec.d.ts +1 -0
  29. package/dist/types/actionsheet/actionsheet.d.ts +2 -2
  30. package/dist/types/actionsheet/actionsheet.taro.d.ts +2 -2
  31. package/dist/types/badge/__test__/badge.spec.d.ts +1 -0
  32. package/dist/types/checkbox/checkbox.taro.d.ts +1 -1
  33. package/dist/types/elevator/elevator.d.ts +2 -2
  34. package/dist/types/elevator/elevator.taro.d.ts +2 -2
  35. package/dist/types/noticebar/__test__/noticebar.spec.d.ts +1 -0
  36. package/dist/types/nutui.react.d.ts +3 -1
  37. package/dist/types/picker/pickerSlot.d.ts +4 -1
  38. package/dist/types/picker/pickerSlot.taro.d.ts +16 -0
  39. package/dist/types/popup/popup.taro.d.ts +1 -1
  40. package/dist/types/pulltorefresh/__test__/pulltorefresh.spec.d.ts +1 -0
  41. package/dist/types/pulltorefresh/demo.d.ts +3 -0
  42. package/dist/types/pulltorefresh/index.d.ts +2 -0
  43. package/dist/types/pulltorefresh/index.taro.d.ts +2 -0
  44. package/dist/types/pulltorefresh/pulltorefresh.d.ts +18 -0
  45. package/dist/types/pulltorefresh/pulltorefresh.taro.d.ts +18 -0
  46. package/dist/types/radio/__test__/radio.spec.d.ts +1 -0
  47. package/dist/types/radio/radio.taro.d.ts +1 -1
  48. package/dist/types/radiogroup/index.taro.d.ts +1 -1
  49. package/dist/types/radiogroup/radiogroup.taro.d.ts +11 -0
  50. package/dist/types/range/__test__/range.spec.d.ts +1 -0
  51. package/dist/types/searchbar/__tests__/searchbar.spec.d.ts +1 -0
  52. package/dist/types/timeselect/timeselect.taro.d.ts +1 -1
  53. package/package.json +2 -3
package/CHANGELOG.md CHANGED
@@ -1,3 +1,23 @@
1
+ ## v1.3.1
2
+ `2022-08-31`
3
+ * :sparkles: feat: calendar 组件功能补齐、单元测试 (#228) @love_forever
4
+ * :bug: fix: audio组件内部css覆盖range组件样式问题修复 (#254) @libin0824
5
+ * :sparkles: chore: audio 组件增加 taro 文件 (#253) @libin0824
6
+ * :sparkles: feat: 新增 ImagePreview、Dialog国际化&单元测试 (#244) @yangjinjun3
7
+ * :sparkles: feat: 增加backtop、input、notify组件的单元测试 (#252) @vickyYe
8
+ * :sparkles: feat: textarea 组件增加单元测试、优化自动伸缩高度功能 (#248) @vickyYe
9
+ * :sparkles: chore: taro 版本构建不压缩,解决 banner 插入导致打出的文件报错 oasis-cloud
10
+ * :sparkles: feat: 新增组件 Grid (#237) @yangxiaolu1993
11
+ * :sparkles: chore: 导出组件的 props 类型 oasis-cloud
12
+ * :sparkles: feat: 新增 audio 组件 (#250) @libin0824
13
+ * :sparkles: feat: 新增 menu 组件 (#251) @oasis-cloud
14
+ * :bug: fix: elevator 电梯楼层组件索引滚动后白屏 (#238) @mike8625
15
+ * :sparkles: feat: SearchBar、ShortPassword 适配 Taro (#247) @xiaoyatong
16
+ * :sparkles: feat: Picker、DatePicker、Address 组件添加国际化 (#236) @yangxiaolu1993
17
+ * :sparkles: feat: 新增 cascader 组件 (#202) @ailululu
18
+ * :sparkles: feat: 新增 swipe 组件 (#226) @Ymm
19
+ * :sparkles: feat: range适配taro (#243) @xiaoyatong
20
+
1
21
  ## v1.3.0
2
22
  `2022-08-24`
3
23
 
@@ -1,6 +1,6 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
- var _excluded = ["cancelTxt", "optionTag", "optionSubTag", "chooseTagValue", "title", "color", "description", "menuItems", "cancel", "choose", "visible", "className", "style"];
3
+ var _excluded = ["children", "cancelTxt", "optionTag", "optionSubTag", "chooseTagValue", "title", "color", "description", "menuItems", "onCancel", "onChoose", "visible", "className", "style"];
4
4
 
5
5
  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; }
6
6
 
@@ -19,8 +19,8 @@ var defaultProps = {
19
19
  color: '#ee0a24',
20
20
  description: '',
21
21
  menuItems: [],
22
- cancel: function cancel() {},
23
- choose: function choose() {},
22
+ onCancel: function onCancel() {},
23
+ onChoose: function onChoose() {},
24
24
  visible: false,
25
25
  className: '',
26
26
  style: {}
@@ -28,6 +28,7 @@ var defaultProps = {
28
28
 
29
29
  var ActionSheet = function ActionSheet(props) {
30
30
  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
31
+ children = _defaultProps$props.children,
31
32
  cancelTxt = _defaultProps$props.cancelTxt,
32
33
  optionTag = _defaultProps$props.optionTag,
33
34
  optionSubTag = _defaultProps$props.optionSubTag,
@@ -36,8 +37,8 @@ var ActionSheet = function ActionSheet(props) {
36
37
  color = _defaultProps$props.color,
37
38
  description = _defaultProps$props.description,
38
39
  menuItems = _defaultProps$props.menuItems,
39
- cancel = _defaultProps$props.cancel,
40
- choose = _defaultProps$props.choose,
40
+ onCancel = _defaultProps$props.onCancel,
41
+ onChoose = _defaultProps$props.onChoose,
41
42
  visible = _defaultProps$props.visible,
42
43
  className = _defaultProps$props.className,
43
44
  style = _defaultProps$props.style,
@@ -50,12 +51,12 @@ var ActionSheet = function ActionSheet(props) {
50
51
  };
51
52
 
52
53
  var cancelActionSheet = function cancelActionSheet() {
53
- cancel && cancel();
54
+ onCancel && onCancel();
54
55
  };
55
56
 
56
57
  var chooseItem = function chooseItem(item, index) {
57
58
  if (!item.disable) {
58
- choose && choose(item, index);
59
+ onChoose && onChoose(item, index);
59
60
  }
60
61
  };
61
62
 
@@ -64,7 +65,7 @@ var ActionSheet = function ActionSheet(props) {
64
65
  visible: visible,
65
66
  position: "bottom",
66
67
  onClose: function onClose() {
67
- cancel && cancel();
68
+ onCancel && onCancel();
68
69
  }
69
70
  }, React__default.createElement("div", _objectSpread({
70
71
  className: "".concat(b(), " ").concat(className),
@@ -88,7 +89,7 @@ var ActionSheet = function ActionSheet(props) {
88
89
  }, item[optionTag], React__default.createElement("div", {
89
90
  className: "subdesc"
90
91
  }, item[optionSubTag]));
91
- })) : null, cancelTxt && React__default.createElement("div", {
92
+ })) : children, cancelTxt && React__default.createElement("div", {
92
93
  className: b('cancel'),
93
94
  onClick: function onClick() {
94
95
  return cancelActionSheet();
@@ -430,7 +430,7 @@ var CustomRender = function CustomRender(props) {
430
430
  }, React__default.createElement(Elevator, {
431
431
  height: height,
432
432
  indexList: regionList[tabName[tabIndex]],
433
- clickItem: handleElevatorItem
433
+ onClickItem: handleElevatorItem
434
434
  })));
435
435
  };
436
436
 
package/dist/esm/Badge.js CHANGED
@@ -41,10 +41,10 @@ var Badge = function Badge(props) {
41
41
 
42
42
  var getStyle = function getStyle() {
43
43
  var style = {};
44
- style.top = "".concat(top, "px");
45
- style.right = "".concat(right, "px");
44
+ style.top = "".concat(Number(top) || parseFloat(top) || 0, "px");
45
+ style.right = "".concat(Number(right) || parseFloat(right) || 0, "px");
46
46
  style.zIndex = zIndex;
47
- style.background = color;
47
+ style.backgroundColor = color;
48
48
  return style;
49
49
  };
50
50
 
@@ -130,6 +130,12 @@ var zhCN = {
130
130
  hour: '时',
131
131
  min: '分',
132
132
  seconds: '秒'
133
+ },
134
+ pullToRefresh: {
135
+ pullingText: '下拉刷新',
136
+ canReleaseText: '松开刷新',
137
+ refreshingText: '加载中...',
138
+ completeText: '刷新成功'
133
139
  }
134
140
  };
135
141
  var defaultProps = {
@@ -1,13 +1,15 @@
1
1
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
2
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
3
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
4
- var _excluded = ["height", "acceptKey", "indexList", "isSticky", "spaceHeight", "titleHeight", "className", "clickItem", "clickIndex", "children"];
4
+ var _excluded = ["height", "acceptKey", "indexList", "isSticky", "spaceHeight", "titleHeight", "className", "onClickItem", "onClickIndex", "children"];
5
5
 
6
6
  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; }
7
7
 
8
8
  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; }
9
9
 
10
10
  import React__default, { createContext, useRef, useState, useEffect } from 'react';
11
+ import { useGesture } from '@use-gesture/react';
12
+ import { animated } from '@react-spring/web';
11
13
  import { c as cn } from './bem-893ad28d.js';
12
14
  import '@bem-react/classname';
13
15
  var elevatorContext = createContext({});
@@ -30,8 +32,8 @@ var Elevator = function Elevator(props) {
30
32
  spaceHeight = _defaultProps$props.spaceHeight,
31
33
  titleHeight = _defaultProps$props.titleHeight,
32
34
  className = _defaultProps$props.className,
33
- clickItem = _defaultProps$props.clickItem,
34
- clickIndex = _defaultProps$props.clickIndex,
35
+ onClickItem = _defaultProps$props.onClickItem,
36
+ onClickIndex = _defaultProps$props.onClickIndex,
35
37
  children = _defaultProps$props.children,
36
38
  rest = _objectWithoutProperties(_defaultProps$props, _excluded);
37
39
 
@@ -132,44 +134,39 @@ var Elevator = function Elevator(props) {
132
134
  }
133
135
  };
134
136
 
135
- var touchMove = function touchMove(e) {
136
- var firstTouch = e.touches[0];
137
- touchState.current.y2 = firstTouch.pageY;
138
- var delta = (touchState.current.y2 - touchState.current.y1) / spaceHeight || 0; // delta 是一个浮点数, 需要四舍五入一下, 否则页面会找不到最终计算后的index
139
-
140
- var cacheIndex = state.current.anchorIndex + Math.ceil(delta);
141
- setCodeIndex(cacheIndex);
142
- scrollTo(cacheIndex);
143
- e.preventDefault();
144
- };
145
-
146
- var touchEnd = function touchEnd() {
147
- resetScrollState();
148
- };
149
-
150
- var touchStart = function touchStart(e) {
151
- setScrollStart(true);
152
- var index = Number(getData(e.target, 'index'));
153
- var firstTouch = e.touches[0];
154
- touchState.current.y1 = firstTouch.pageY;
155
- state.current.anchorIndex = +index;
156
- setCodeIndex(function (codeIndex) {
157
- return codeIndex + index;
158
- });
159
- scrollTo(index);
160
- var target = e.currentTarget;
161
- target.removeEventListener('touchend', touchEnd, false);
162
- target.addEventListener('touchend', touchEnd, false);
163
- };
137
+ var bind = useGesture({
138
+ onDragStart: function onDragStart(_ref) {
139
+ var target = _ref.target,
140
+ offset = _ref.offset;
141
+ setScrollStart(true);
142
+ var index = Number(getData(target, 'index'));
143
+ touchState.current.y1 = offset[1];
144
+ state.current.anchorIndex = +index;
145
+ setCodeIndex(function (codeIndex) {
146
+ return codeIndex + index;
147
+ });
148
+ scrollTo(index);
149
+ },
150
+ onDragEnd: function onDragEnd(_ref2) {
151
+ var offset = _ref2.offset;
152
+ touchState.current.y2 = offset[1];
153
+ var delta = (touchState.current.y2 - touchState.current.y1) / spaceHeight || 0; // delta 是一个浮点数, 需要四舍五入一下, 否则页面会找不到最终计算后的index
154
+
155
+ var cacheIndex = state.current.anchorIndex + Math.ceil(delta);
156
+ setCodeIndex(cacheIndex);
157
+ scrollTo(cacheIndex);
158
+ resetScrollState();
159
+ }
160
+ });
164
161
 
165
162
  var handleClickItem = function handleClickItem(key, item) {
166
- clickItem && clickItem(key, item);
163
+ onClickItem && onClickItem(key, item);
167
164
  setCurrentData(item);
168
165
  setCurrentKey(key);
169
166
  };
170
167
 
171
168
  var handleClickIndex = function handleClickIndex(key) {
172
- clickIndex && clickIndex(key);
169
+ onClickIndex && onClickIndex(key);
173
170
  };
174
171
 
175
172
  var setListGroup = function setListGroup() {
@@ -231,17 +228,6 @@ var Elevator = function Elevator(props) {
231
228
  if (state.current.fixedTop === fixedTop) return;
232
229
  state.current.fixedTop = fixedTop;
233
230
  }, [state.current.diff, titleHeight]);
234
- var refIndexBar = useRef(null); // 之前的代码, 手指在index条上下移动的时候, 下面的列表也会跟随滚动, 需要阻止默认事件
235
- // 如果使用react的touchmove, 没有找到可以设置passive的选项, 无法阻止默认事件, 所以使用了原生的方法进行添加
236
-
237
- useEffect(function () {
238
- refIndexBar.current && refIndexBar.current.addEventListener('touchmove', touchMove, {
239
- passive: false
240
- });
241
- return function () {
242
- refIndexBar.current && refIndexBar.current.removeEventListener('touchmove', touchMove);
243
- };
244
- }, []);
245
231
  return React__default.createElement("div", _objectSpread({
246
232
  className: "".concat(b(), " ").concat(className)
247
233
  }, rest), isSticky && scrollY > 0 ? React__default.createElement("div", {
@@ -280,14 +266,14 @@ var Elevator = function Elevator(props) {
280
266
  current: true
281
267
  })
282
268
  }, indexList[codeIndex][acceptKey]) : null, React__default.createElement("div", {
283
- ref: refIndexBar,
284
- className: b('bars'),
285
- onTouchStart: function onTouchStart(event) {
286
- return touchStart(event);
287
- }
288
- }, React__default.createElement("div", {
269
+ className: b('bars')
270
+ }, React__default.createElement(animated.div, _objectSpread(_objectSpread({
289
271
  className: b('bars__inner')
290
- }, indexList.map(function (item, index) {
272
+ }, bind()), {}, {
273
+ style: {
274
+ touchAction: 'pan-y'
275
+ }
276
+ }), indexList.map(function (item, index) {
291
277
  return React__default.createElement("div", {
292
278
  className: b('bars__inner__item', {
293
279
  active: item[acceptKey] === indexList[currentIndex][acceptKey]
package/dist/esm/Menu.js CHANGED
@@ -8,7 +8,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
8
8
 
9
9
  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; }
10
10
 
11
- import React__default, { useRef, useEffect, useState } from 'react';
11
+ import React__default, { useRef, useState, useEffect } from 'react';
12
12
  import classNames from 'classnames';
13
13
  import Icon from './Icon.js';
14
14
  var defaultProps = {
@@ -34,7 +34,22 @@ var Menu = function Menu(props) {
34
34
 
35
35
  var parentRef = useRef(null);
36
36
 
37
- var onScroll = function onScroll() {};
37
+ var _useState = useState(false),
38
+ _useState2 = _slicedToArray(_useState, 2),
39
+ isScrollFixed = _useState2[0],
40
+ setIsScrollFixed = _useState2[1];
41
+
42
+ var getScrollTop = function getScrollTop(el) {
43
+ return Math.max(0, 'scrollTop' in el ? el.scrollTop : el.pageYOffset);
44
+ };
45
+
46
+ var onScroll = function onScroll() {
47
+ var scrollFixed = props.scrollFixed;
48
+ var scrollTop = getScrollTop(window);
49
+ console.log(scrollTop);
50
+ var isFixed = scrollTop > (typeof scrollFixed === 'boolean' ? 30 : Number(scrollFixed));
51
+ setIsScrollFixed(isFixed);
52
+ };
38
53
 
39
54
  useEffect(function () {
40
55
  if (scrollFixed) {
@@ -46,15 +61,15 @@ var Menu = function Menu(props) {
46
61
  };
47
62
  }, []);
48
63
 
49
- var _useState = useState([]),
50
- _useState2 = _slicedToArray(_useState, 2),
51
- itemShow = _useState2[0],
52
- setItemShow = _useState2[1];
53
-
54
64
  var _useState3 = useState([]),
55
65
  _useState4 = _slicedToArray(_useState3, 2),
56
- itemTitle = _useState4[0],
57
- setItemTitle = _useState4[1];
66
+ itemShow = _useState4[0],
67
+ setItemShow = _useState4[1];
68
+
69
+ var _useState5 = useState([]),
70
+ _useState6 = _slicedToArray(_useState5, 2),
71
+ itemTitle = _useState6[0],
72
+ setItemTitle = _useState6[1];
58
73
 
59
74
  var toggleItemShow = function toggleItemShow(index) {
60
75
  itemShow[index] = !itemShow[index];
@@ -96,8 +111,9 @@ var Menu = function Menu(props) {
96
111
  });
97
112
  };
98
113
 
114
+ console.log('isScrollFixed', isScrollFixed);
99
115
  return React__default.createElement("div", _objectSpread(_objectSpread({
100
- className: "nut-menu ".concat(className)
116
+ className: "nut-menu ".concat(className, " ").concat(isScrollFixed ? 'scroll-fixed' : '')
101
117
  }, rest), {}, {
102
118
  ref: parentRef
103
119
  }), React__default.createElement("div", {
@@ -330,7 +330,7 @@ var NoticeBar = function NoticeBar(props) {
330
330
  className: "wrap"
331
331
  }, React__default.createElement("div", {
332
332
  ref: content,
333
- className: "content ".concat(animationClass, " ").concat(isEllipsis() && 'nut-ellipsis'),
333
+ className: "content ".concat(animationClass, " ").concat(isEllipsis() ? 'nut-ellipsis' : ''),
334
334
  style: contentStyle,
335
335
  onAnimationEnd: onAnimationEnd
336
336
  }, children, text)), closeMode || rightIcon ? React__default.createElement("div", {
@@ -8,7 +8,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
8
8
 
9
9
  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; }
10
10
 
11
- import React__default, { useState, useRef, useEffect } from 'react';
11
+ import React__default, { useState, useRef, useEffect, useImperativeHandle } from 'react';
12
12
  import Popup from './Popup.js';
13
13
  import { u as useTouch } from './useTouch-a2ea68c6.js';
14
14
  import { useConfig } from './ConfigProvider.js';
@@ -40,28 +40,40 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
40
40
  setCurrIndex = _useState2[1];
41
41
 
42
42
  var lineSpacing = 36;
43
+
44
+ var _useState3 = useState(0),
45
+ _useState4 = _slicedToArray(_useState3, 2),
46
+ touchTime = _useState4[0],
47
+ setTouchTime = _useState4[1];
48
+
49
+ var _useState5 = useState('0deg'),
50
+ _useState6 = _slicedToArray(_useState5, 2),
51
+ touchDeg = _useState6[0],
52
+ setTouchDeg = _useState6[1];
53
+
43
54
  var rotation = 20;
55
+ var moving = useRef(false);
44
56
  var timer;
45
57
  useRef(null);
46
58
  var rollerRef = useRef(null);
47
59
  var pickerSlotRef = useRef(null);
48
60
 
49
- var _useState3 = useState(0),
50
- _useState4 = _slicedToArray(_useState3, 2),
51
- startTime = _useState4[0],
52
- setStartTime = _useState4[1];
61
+ var _useState7 = useState(0),
62
+ _useState8 = _slicedToArray(_useState7, 2),
63
+ startTime = _useState8[0],
64
+ setStartTime = _useState8[1];
53
65
 
54
- var _useState5 = useState(0),
55
- _useState6 = _slicedToArray(_useState5, 2),
56
- startY = _useState6[0],
57
- setStartY = _useState6[1];
66
+ var _useState9 = useState(0),
67
+ _useState10 = _slicedToArray(_useState9, 2),
68
+ startY = _useState10[0],
69
+ setStartY = _useState10[1];
58
70
 
59
71
  var transformY = useRef(0);
60
72
 
61
- var _useState7 = useState(0),
62
- _useState8 = _slicedToArray(_useState7, 2),
63
- scrollDistance = _useState8[0],
64
- setScrollDistance = _useState8[1];
73
+ var _useState11 = useState(0),
74
+ _useState12 = _slicedToArray(_useState11, 2),
75
+ scrollDistance = _useState12[0],
76
+ setScrollDistance = _useState12[1];
65
77
 
66
78
  var isHidden = function isHidden(index) {
67
79
  if (index >= currIndex + 8 || index <= currIndex - 8) {
@@ -82,13 +94,8 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
82
94
  nTime = 0;
83
95
  }
84
96
 
85
- if (threeDimensional) {
86
- rollerRef.current.style.webkitTransform = "rotate3d(1, 0, 0, ".concat(deg, ")");
87
- } else {
88
- rollerRef.current.style.webkitTransform = "translate3d(0, ".concat(translateY, "px, 0)");
89
- }
90
-
91
- rollerRef.current.style.webkitTransition = "transform ".concat(nTime, "ms cubic-bezier(0.17, 0.89, 0.45, 1)");
97
+ setTouchTime(nTime);
98
+ setTouchDeg(deg);
92
99
  setScrollDistance(translateY);
93
100
  };
94
101
 
@@ -141,6 +148,7 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
141
148
  touch.move(event);
142
149
 
143
150
  if (touch.isVertical) {
151
+ moving.current = true;
144
152
  preventDefault(event, true);
145
153
  }
146
154
 
@@ -149,6 +157,7 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
149
157
  };
150
158
 
151
159
  var touchEnd = function touchEnd(event) {
160
+ if (!moving.current) return;
152
161
  var move = touch.deltaY - startY;
153
162
  var moveTime = Date.now() - startTime; // 区分是否为惯性滚动
154
163
 
@@ -161,6 +170,7 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
161
170
  }
162
171
 
163
172
  setTimeout(function () {
173
+ // moving.current = false
164
174
  touch.reset();
165
175
  }, 0);
166
176
  }; // 惯性滚动 距离
@@ -204,6 +214,8 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
204
214
 
205
215
 
206
216
  var stopMomentum = function stopMomentum() {
217
+ moving.current = false;
218
+ setTouchTime(0);
207
219
  setChooseValue(scrollDistance);
208
220
  }; // 阻止默认事件
209
221
 
@@ -219,6 +231,20 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
219
231
  }
220
232
  };
221
233
 
234
+ var touchRollerStyle = function touchRollerStyle() {
235
+ return {
236
+ transition: "transform ".concat(touchTime, "ms cubic-bezier(0.17, 0.89, 0.45, 1)"),
237
+ transform: "rotate3d(1, 0, 0, ".concat(touchDeg, ")")
238
+ };
239
+ };
240
+
241
+ var touchTileStyle = function touchTileStyle() {
242
+ return {
243
+ transition: "transform ".concat(touchTime, "ms cubic-bezier(0.17, 0.89, 0.45, 1)"),
244
+ transform: "translate3d(0, ".concat(scrollDistance, "px, 0)")
245
+ };
246
+ };
247
+
222
248
  useEffect(function () {
223
249
  setScrollDistance(0);
224
250
  transformY.current = 0;
@@ -227,6 +253,12 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
227
253
  clearTimeout(timer);
228
254
  };
229
255
  }, [listData]);
256
+ useImperativeHandle(ref, function () {
257
+ return {
258
+ stopMomentum: stopMomentum,
259
+ moving: moving.current
260
+ };
261
+ });
230
262
  return React__default.createElement("div", {
231
263
  className: "nut-picker-list",
232
264
  ref: pickerSlotRef,
@@ -236,6 +268,7 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
236
268
  }, React__default.createElement("div", {
237
269
  className: "nut-picker-roller",
238
270
  ref: rollerRef,
271
+ style: threeDimensional ? touchRollerStyle() : touchTileStyle(),
239
272
  onTransitionEnd: stopMomentum
240
273
  }, threeDimensional && listData.map(function (item, index) {
241
274
  return React__default.createElement("div", {
@@ -259,6 +292,19 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
259
292
 
260
293
  var PickerSlot = React__default.forwardRef(InternalPickerSlot);
261
294
 
295
+ function useRefs() {
296
+ var refs = React__default.useRef([]);
297
+ var setRefs = React__default.useCallback(function (index) {
298
+ return function (el) {
299
+ if (el) refs.current[index] = el;
300
+ };
301
+ }, []);
302
+ var reset = React__default.useCallback(function () {
303
+ refs.current = [];
304
+ }, []);
305
+ return [refs.current, setRefs, reset];
306
+ }
307
+
262
308
  var InternalPicker = function InternalPicker(props, ref) {
263
309
  var _useConfig = useConfig(),
264
310
  locale = _useConfig.locale;
@@ -278,27 +324,33 @@ var InternalPicker = function InternalPicker(props, ref) {
278
324
  swipeDuration = props.swipeDuration,
279
325
  rest = _objectWithoutProperties(props, _excluded);
280
326
 
281
- var _useState9 = useState([]),
282
- _useState10 = _slicedToArray(_useState9, 2),
283
- chooseValueData = _useState10[0],
284
- setchooseValueData = _useState10[1]; // 选择的数据的 value 值, 每一条数据的 value 值
327
+ var _useState13 = useState([]),
328
+ _useState14 = _slicedToArray(_useState13, 2),
329
+ chooseValueData = _useState14[0],
330
+ setchooseValueData = _useState14[1]; // 选择的数据的 value 值, 每一条数据的 value 值
285
331
 
286
332
 
287
- var _useState11 = useState(0),
288
- _useState12 = _slicedToArray(_useState11, 2),
289
- columnIndex = _useState12[0],
290
- setcolumnIndex = _useState12[1]; // 选中列
333
+ var _useState15 = useState(0),
334
+ _useState16 = _slicedToArray(_useState15, 2),
335
+ columnIndex = _useState16[0],
336
+ setcolumnIndex = _useState16[1]; // 选中列
291
337
 
292
338
 
293
339
  var pickerRef = useRef(null);
294
340
 
295
- var _useState13 = useState([]),
296
- _useState14 = _slicedToArray(_useState13, 2),
297
- columnsList = _useState14[0],
298
- setColumnsList = _useState14[1]; // 格式化后每一列的数据
341
+ var _useRefs = useRefs(),
342
+ _useRefs2 = _slicedToArray(_useRefs, 2),
343
+ refs = _useRefs2[0],
344
+ setRefs = _useRefs2[1];
345
+
346
+ var _useState17 = useState([]),
347
+ _useState18 = _slicedToArray(_useState17, 2),
348
+ columnsList = _useState18[0],
349
+ setColumnsList = _useState18[1]; // 格式化后每一列的数据
299
350
 
300
351
 
301
- var b = cn('picker'); // 默认值修改
352
+ var b = cn('picker');
353
+ var isConfirmEvent = useRef(false); // 默认值修改
302
354
 
303
355
  useEffect(function () {
304
356
  if (defaultValueData && defaultValueData.length !== 0 && defaultValueData.toString() !== chooseValueData.toString()) {
@@ -310,7 +362,13 @@ var InternalPicker = function InternalPicker(props, ref) {
310
362
  }, [defaultValueData]); // 选中值进行修改
311
363
 
312
364
  useEffect(function () {
365
+ console.log('修改');
313
366
  onChange && onChange(columnIndex, chooseValueData, selectedOptions());
367
+
368
+ if (isConfirmEvent.current) {
369
+ isConfirmEvent.current = false;
370
+ onConfirm && onConfirm(chooseValueData, selectedOptions());
371
+ }
314
372
  }, [chooseValueData]); // 列表格式修改
315
373
 
316
374
  useEffect(function () {
@@ -324,8 +382,23 @@ var InternalPicker = function InternalPicker(props, ref) {
324
382
 
325
383
 
326
384
  var confirm = function confirm() {
327
- onConfirm && onConfirm(chooseValueData, selectedOptions());
385
+ var movings = false;
386
+ refs.forEach(function (_ref) {
387
+ if (_ref.moving) movings = true;
388
+
389
+ _ref.stopMomentum();
390
+ });
391
+
392
+ if (movings) {
393
+ isConfirmEvent.current = true;
394
+ } else {
395
+ onConfirm && onConfirm(chooseValueData, selectedOptions());
396
+ }
397
+
328
398
  onClose && onClose(chooseValueData, selectedOptions());
399
+ setTimeout(function () {
400
+ isConfirmEvent.current = false;
401
+ }, 0);
329
402
  };
330
403
 
331
404
  var selectedOptions = function selectedOptions() {
@@ -464,6 +537,22 @@ var InternalPicker = function InternalPicker(props, ref) {
464
537
  }
465
538
  };
466
539
 
540
+ var renderToolbar = function renderToolbar() {
541
+ return React__default.createElement("div", {
542
+ className: b('control')
543
+ }, React__default.createElement("span", {
544
+ className: b('cancel-btn'),
545
+ onClick: function onClick() {
546
+ return closeActionSheet();
547
+ }
548
+ }, locale.cancel), React__default.createElement("div", {
549
+ className: b('title')
550
+ }, title || ''), React__default.createElement("span", {
551
+ className: b('confirm-btn'),
552
+ onClick: confirm
553
+ }, locale.confirm));
554
+ };
555
+
467
556
  return React__default.createElement(Popup, {
468
557
  visible: isVisible,
469
558
  position: "bottom",
@@ -473,25 +562,12 @@ var InternalPicker = function InternalPicker(props, ref) {
473
562
  }, React__default.createElement("div", _objectSpread({
474
563
  className: "".concat(b(), " ").concat(className || ''),
475
564
  style: style
476
- }, rest), React__default.createElement("div", {
477
- className: b('control')
478
- }, React__default.createElement("span", {
479
- className: b('cancel-btn'),
480
- onClick: function onClick() {
481
- return closeActionSheet();
482
- }
483
- }, locale.cancel), React__default.createElement("div", {
484
- className: b('title')
485
- }, title || ''), React__default.createElement("span", {
486
- className: b('confirm-btn'),
487
- onClick: function onClick() {
488
- return confirm();
489
- }
490
- }, locale.confirm)), React__default.createElement("div", {
565
+ }, rest), renderToolbar(), React__default.createElement("div", {
491
566
  className: b('panel'),
492
567
  ref: pickerRef
493
568
  }, columnsList === null || columnsList === void 0 ? void 0 : columnsList.map(function (item, index) {
494
569
  return React__default.createElement(PickerSlot, {
570
+ ref: setRefs(index),
495
571
  defaultValue: chooseValueData === null || chooseValueData === void 0 ? void 0 : chooseValueData[index],
496
572
  listData: item,
497
573
  threeDimensional: threeDimensional,
@@ -0,0 +1,2 @@
1
+
2
+ require('../../../packages/pulltorefresh/pulltorefresh.scss')