@nutui/nutui-react-taro 3.0.19-cpp-beta.ios.1 → 3.0.19-cpp-beta.5
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.
- package/dist/cjs/packages/swipe/swipe.js +87 -114
- package/dist/cjs/packages/toast/style/style.css +1 -0
- package/dist/cjs/packages/toast/style/style.harmony.css +1 -0
- package/dist/cjs/packages/toast/style/toast.scss +1 -0
- package/dist/cjs/packages/toast/style-jmapp/style.css +1 -0
- package/dist/cjs/packages/toast/style-jmapp/toast.scss +1 -0
- package/dist/cjs/packages/toast/style-jrkf/style.css +1 -0
- package/dist/cjs/packages/toast/style-jrkf/toast.scss +1 -0
- package/dist/cjs/packages/toast/toast.js +1 -1
- package/dist/es/packages/swipe/swipe.js +88 -115
- package/dist/es/packages/toast/style/style.css +1 -0
- package/dist/es/packages/toast/style/style.harmony.css +1 -0
- package/dist/es/packages/toast/style/toast.scss +1 -0
- package/dist/es/packages/toast/style-jmapp/style.css +1 -0
- package/dist/es/packages/toast/style-jmapp/toast.scss +1 -0
- package/dist/es/packages/toast/style-jrkf/style.css +1 -0
- package/dist/es/packages/toast/style-jrkf/toast.scss +1 -0
- package/dist/es/packages/toast/toast.js +1 -1
- package/dist/nutui.react.umd.js +85 -112
- package/dist/style-jmapp.css +1 -1
- package/dist/style-jmapp.scss +28 -28
- package/dist/style-jrkf.css +1 -1
- package/dist/style-jrkf.scss +33 -33
- package/dist/style.css +1 -1
- package/dist/style.scss +35 -35
- package/package.json +1 -1
|
@@ -22,7 +22,6 @@ var _taro = require("@tarojs/taro");
|
|
|
22
22
|
var _usetouch = require("../../hooks/use-touch");
|
|
23
23
|
var _getrect = require("../../utils/taro/get-rect");
|
|
24
24
|
var _typings = require("../../utils/typings");
|
|
25
|
-
var _platform = require("../../utils/taro/platform");
|
|
26
25
|
var _userefstate = require("../../hooks/use-ref-state");
|
|
27
26
|
var _useuuid = require("../../hooks/use-uuid");
|
|
28
27
|
function preventDefault(event, isStopPropagation) {
|
|
@@ -42,95 +41,9 @@ var Swipe = /*#__PURE__*/ (0, _react.forwardRef)(function(props, instanceRef) {
|
|
|
42
41
|
var uid = (0, _useuuid.useUuid)();
|
|
43
42
|
var leftId = "swipe-left-".concat(uid);
|
|
44
43
|
var rightId = "swipe-right-".concat(uid);
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
var _ref = (0, _async_to_generator._)(function() {
|
|
49
|
-
var leftRect, rightRect;
|
|
50
|
-
return (0, _ts_generator._)(this, function(_state) {
|
|
51
|
-
switch(_state.label){
|
|
52
|
-
case 0:
|
|
53
|
-
if (!leftWrapper.current) return [
|
|
54
|
-
3,
|
|
55
|
-
2
|
|
56
|
-
];
|
|
57
|
-
return [
|
|
58
|
-
4,
|
|
59
|
-
(0, _getrect.getRectInMultiPlatform)(leftWrapper.current, leftId)
|
|
60
|
-
];
|
|
61
|
-
case 1:
|
|
62
|
-
leftRect = _state.sent();
|
|
63
|
-
leftRect && setActionWidth(function(v) {
|
|
64
|
-
return (0, _object_spread_props._)((0, _object_spread._)({}, v), {
|
|
65
|
-
left: leftRect.width
|
|
66
|
-
});
|
|
67
|
-
});
|
|
68
|
-
_state.label = 2;
|
|
69
|
-
case 2:
|
|
70
|
-
if (!rightWrapper.current) return [
|
|
71
|
-
3,
|
|
72
|
-
4
|
|
73
|
-
];
|
|
74
|
-
return [
|
|
75
|
-
4,
|
|
76
|
-
(0, _getrect.getRectInMultiPlatform)(rightWrapper.current, rightId)
|
|
77
|
-
];
|
|
78
|
-
case 3:
|
|
79
|
-
rightRect = _state.sent();
|
|
80
|
-
rightRect && setActionWidth(function(v) {
|
|
81
|
-
return (0, _object_spread_props._)((0, _object_spread._)({}, v), {
|
|
82
|
-
right: rightRect.width
|
|
83
|
-
});
|
|
84
|
-
});
|
|
85
|
-
_state.label = 4;
|
|
86
|
-
case 4:
|
|
87
|
-
return [
|
|
88
|
-
2
|
|
89
|
-
];
|
|
90
|
-
}
|
|
91
|
-
});
|
|
92
|
-
});
|
|
93
|
-
return function getWidth() {
|
|
94
|
-
return _ref.apply(this, arguments);
|
|
95
|
-
};
|
|
96
|
-
}();
|
|
97
|
-
(0, _taro.nextTick)(function() {
|
|
98
|
-
return getWidth();
|
|
99
|
-
});
|
|
100
|
-
});
|
|
101
|
-
var _$_object_spread = (0, _object_spread._)({}, defaultProps, props), children = _$_object_spread.children, className = _$_object_spread.className, style = _$_object_spread.style;
|
|
102
|
-
var root = (0, _react.useRef)();
|
|
103
|
-
var opened = (0, _react.useRef)(false);
|
|
104
|
-
var lockClick = (0, _react.useRef)(false);
|
|
105
|
-
var startOffset = (0, _react.useRef)(0);
|
|
106
|
-
var _useState = (0, _sliced_to_array._)((0, _react.useState)({
|
|
107
|
-
offset: 0,
|
|
108
|
-
dragging: false
|
|
109
|
-
}), 2), state = _useState[0], setState = _useState[1];
|
|
110
|
-
var _useRefState = (0, _sliced_to_array._)((0, _userefstate.useRefState)({
|
|
111
|
-
left: 0,
|
|
112
|
-
right: 0
|
|
113
|
-
}), 2), actionWidth = _useRefState[0], updateState = _useRefState[1];
|
|
114
|
-
var setActionWidth = function setActionWidth(fn) {
|
|
115
|
-
var res = fn();
|
|
116
|
-
if (res.left !== undefined) {
|
|
117
|
-
updateState((0, _object_spread_props._)((0, _object_spread._)({}, actionWidth.current), {
|
|
118
|
-
left: res.left
|
|
119
|
-
}));
|
|
120
|
-
}
|
|
121
|
-
if (res.right !== undefined) {
|
|
122
|
-
updateState((0, _object_spread_props._)((0, _object_spread._)({}, actionWidth.current), {
|
|
123
|
-
right: res.right
|
|
124
|
-
}));
|
|
125
|
-
}
|
|
126
|
-
};
|
|
127
|
-
var wrapperStyle = {
|
|
128
|
-
transform: "translate(".concat(state.offset).concat(!(0, _platform.harmony)() ? 'px' : '', ", 0)"),
|
|
129
|
-
transitionDuration: state.dragging ? '0s' : '.6s'
|
|
130
|
-
};
|
|
131
|
-
var onTouchStart = /*#__PURE__*/ function() {
|
|
132
|
-
var _ref = (0, _async_to_generator._)(function(event) {
|
|
133
|
-
var leftRect, rightRect, _props_onTouchStart;
|
|
44
|
+
var getWidth = /*#__PURE__*/ function() {
|
|
45
|
+
var _ref = (0, _async_to_generator._)(function() {
|
|
46
|
+
var leftRect, rightRect;
|
|
134
47
|
return (0, _ts_generator._)(this, function(_state) {
|
|
135
48
|
switch(_state.label){
|
|
136
49
|
case 0:
|
|
@@ -168,47 +81,102 @@ var Swipe = /*#__PURE__*/ (0, _react.forwardRef)(function(props, instanceRef) {
|
|
|
168
81
|
});
|
|
169
82
|
_state.label = 4;
|
|
170
83
|
case 4:
|
|
171
|
-
if (!props.disabled) {
|
|
172
|
-
;
|
|
173
|
-
startOffset.current = state.offset;
|
|
174
|
-
touch.start(event);
|
|
175
|
-
(_props_onTouchStart = props.onTouchStart) === null || _props_onTouchStart === void 0 ? void 0 : _props_onTouchStart.call(props, event);
|
|
176
|
-
}
|
|
177
84
|
return [
|
|
178
85
|
2
|
|
179
86
|
];
|
|
180
87
|
}
|
|
181
88
|
});
|
|
182
89
|
});
|
|
90
|
+
return function getWidth() {
|
|
91
|
+
return _ref.apply(this, arguments);
|
|
92
|
+
};
|
|
93
|
+
}();
|
|
94
|
+
// 获取元素的时候要在页面 onReady 后，需要参考小程序的事件周期
|
|
95
|
+
(0, _taro.useReady)(function() {
|
|
96
|
+
(0, _taro.nextTick)(function() {
|
|
97
|
+
return getWidth();
|
|
98
|
+
});
|
|
99
|
+
});
|
|
100
|
+
var _$_object_spread = (0, _object_spread._)({}, defaultProps, props), children = _$_object_spread.children, className = _$_object_spread.className, style = _$_object_spread.style;
|
|
101
|
+
var root = (0, _react.useRef)();
|
|
102
|
+
var opened = (0, _react.useRef)(false);
|
|
103
|
+
var lockClick = (0, _react.useRef)(false);
|
|
104
|
+
var startOffset = (0, _react.useRef)(0);
|
|
105
|
+
var _useState = (0, _sliced_to_array._)((0, _react.useState)({
|
|
106
|
+
offset: 0,
|
|
107
|
+
dragging: false
|
|
108
|
+
}), 2), state = _useState[0], setState = _useState[1];
|
|
109
|
+
var _useRefState = (0, _sliced_to_array._)((0, _userefstate.useRefState)({
|
|
110
|
+
left: 0,
|
|
111
|
+
right: 0
|
|
112
|
+
}), 2), actionWidth = _useRefState[0], updateState = _useRefState[1];
|
|
113
|
+
var setActionWidth = function setActionWidth(fn) {
|
|
114
|
+
var res = fn();
|
|
115
|
+
if (res.left !== undefined) {
|
|
116
|
+
updateState((0, _object_spread_props._)((0, _object_spread._)({}, actionWidth.current), {
|
|
117
|
+
left: res.left
|
|
118
|
+
}));
|
|
119
|
+
}
|
|
120
|
+
if (res.right !== undefined) {
|
|
121
|
+
updateState((0, _object_spread_props._)((0, _object_spread._)({}, actionWidth.current), {
|
|
122
|
+
right: res.right
|
|
123
|
+
}));
|
|
124
|
+
}
|
|
125
|
+
};
|
|
126
|
+
var wrapperStyle = (0, _react.useMemo)(function() {
|
|
127
|
+
return {
|
|
128
|
+
transform: "translate(".concat(state.offset, "px, 0)"),
|
|
129
|
+
transitionDuration: state.dragging ? '0.01s' : '.6s'
|
|
130
|
+
};
|
|
131
|
+
}, [
|
|
132
|
+
state.offset,
|
|
133
|
+
state.dragging
|
|
134
|
+
]);
|
|
135
|
+
var onTouchStart = /*#__PURE__*/ function() {
|
|
136
|
+
var _ref = (0, _async_to_generator._)(function(event) {
|
|
137
|
+
var _props_onTouchStart;
|
|
138
|
+
return (0, _ts_generator._)(this, function(_state) {
|
|
139
|
+
if (!props.disabled) {
|
|
140
|
+
;
|
|
141
|
+
getWidth();
|
|
142
|
+
startOffset.current = state.offset;
|
|
143
|
+
touch.start(event);
|
|
144
|
+
(_props_onTouchStart = props.onTouchStart) === null || _props_onTouchStart === void 0 ? void 0 : _props_onTouchStart.call(props, event);
|
|
145
|
+
}
|
|
146
|
+
return [
|
|
147
|
+
2
|
|
148
|
+
];
|
|
149
|
+
});
|
|
150
|
+
});
|
|
183
151
|
return function onTouchStart(event) {
|
|
184
152
|
return _ref.apply(this, arguments);
|
|
185
153
|
};
|
|
186
154
|
}();
|
|
187
155
|
var onTouchMove = function onTouchMove(event) {
|
|
188
156
|
var _props_onTouchMove;
|
|
189
|
-
if (props.disabled)
|
|
190
|
-
return;
|
|
191
|
-
}
|
|
157
|
+
if (props.disabled) return;
|
|
192
158
|
touch.move(event);
|
|
193
159
|
(_props_onTouchMove = props.onTouchMove) === null || _props_onTouchMove === void 0 ? void 0 : _props_onTouchMove.call(props, event);
|
|
194
160
|
if (touch.isHorizontal()) {
|
|
195
161
|
lockClick.current = true;
|
|
196
|
-
var newState = (0, _object_spread_props._)((0, _object_spread._)({}, state), {
|
|
197
|
-
dragging: true
|
|
198
|
-
});
|
|
199
162
|
var isEdge = !opened || touch.deltaX.current * startOffset.current < 0;
|
|
200
163
|
if (isEdge) {
|
|
201
164
|
preventDefault(event, true);
|
|
202
165
|
}
|
|
203
|
-
|
|
204
|
-
setState(
|
|
166
|
+
var offset = rangeCalculation(touch.deltaX.current + startOffset.current, -actionWidth.current.right || 0, actionWidth.current.left || 0);
|
|
167
|
+
setState(function(prevState) {
|
|
168
|
+
return (0, _object_spread_props._)((0, _object_spread._)({}, prevState), {
|
|
169
|
+
dragging: true,
|
|
170
|
+
offset: Number(offset) || 0
|
|
171
|
+
});
|
|
172
|
+
});
|
|
205
173
|
}
|
|
206
174
|
};
|
|
207
175
|
var onTouchEnd = function onTouchEnd(event) {
|
|
208
176
|
if (state.dragging) {
|
|
209
177
|
var _props_onTouchEnd;
|
|
210
|
-
setState(function(
|
|
211
|
-
return (0, _object_spread_props._)((0, _object_spread._)({},
|
|
178
|
+
setState(function(prevState) {
|
|
179
|
+
return (0, _object_spread_props._)((0, _object_spread._)({}, prevState), {
|
|
212
180
|
dragging: false
|
|
213
181
|
});
|
|
214
182
|
});
|
|
@@ -239,13 +207,13 @@ var Swipe = /*#__PURE__*/ (0, _react.forwardRef)(function(props, instanceRef) {
|
|
|
239
207
|
name: name,
|
|
240
208
|
position: side
|
|
241
209
|
});
|
|
242
|
-
setState(function(
|
|
243
|
-
return (0, _object_spread_props._)((0, _object_spread._)({},
|
|
210
|
+
setState(function(prevState) {
|
|
211
|
+
return (0, _object_spread_props._)((0, _object_spread._)({}, prevState), {
|
|
244
212
|
offset: Number(offset) || 0
|
|
245
213
|
});
|
|
246
214
|
});
|
|
247
215
|
};
|
|
248
|
-
var close =
|
|
216
|
+
var close = (0, _react.useCallback)(function(position) {
|
|
249
217
|
if (opened.current) {
|
|
250
218
|
var _props_onClose;
|
|
251
219
|
opened.current = false;
|
|
@@ -254,12 +222,14 @@ var Swipe = /*#__PURE__*/ (0, _react.forwardRef)(function(props, instanceRef) {
|
|
|
254
222
|
position: position || 'left'
|
|
255
223
|
});
|
|
256
224
|
}
|
|
257
|
-
setState(function(
|
|
258
|
-
return (0, _object_spread_props._)((0, _object_spread._)({},
|
|
225
|
+
setState(function(prevState) {
|
|
226
|
+
return (0, _object_spread_props._)((0, _object_spread._)({}, prevState), {
|
|
259
227
|
offset: 0
|
|
260
228
|
});
|
|
261
229
|
});
|
|
262
|
-
}
|
|
230
|
+
}, [
|
|
231
|
+
props
|
|
232
|
+
]);
|
|
263
233
|
var rangeCalculation = function rangeCalculation(num, min, max) {
|
|
264
234
|
return Math.min(Math.max(Number(num), Number(min)), Number(max));
|
|
265
235
|
};
|
|
@@ -296,8 +266,9 @@ var Swipe = /*#__PURE__*/ (0, _react.forwardRef)(function(props, instanceRef) {
|
|
|
296
266
|
};
|
|
297
267
|
});
|
|
298
268
|
(0, _react.useEffect)(function() {
|
|
299
|
-
|
|
269
|
+
// 并没有生效
|
|
300
270
|
var handler = function handler(event) {
|
|
271
|
+
console.log('~~hanyu handler---- window', event);
|
|
301
272
|
var targets = [
|
|
302
273
|
root
|
|
303
274
|
];
|
|
@@ -313,7 +284,9 @@ var Swipe = /*#__PURE__*/ (0, _react.forwardRef)(function(props, instanceRef) {
|
|
|
313
284
|
return function() {
|
|
314
285
|
document.removeEventListener('touchstart', handler);
|
|
315
286
|
};
|
|
316
|
-
}, [
|
|
287
|
+
}, [
|
|
288
|
+
close
|
|
289
|
+
]);
|
|
317
290
|
return /*#__PURE__*/ _react.default.createElement(_components.View, {
|
|
318
291
|
ref: root,
|
|
319
292
|
className: (0, _classnames.default)(classPrefix, className),
|
|
@@ -158,7 +158,7 @@ var Toast = function Toast(props) {
|
|
|
158
158
|
style: (0, _object_spread._)({}, styles, contentStyle)
|
|
159
159
|
}, renderIcon(), title && /*#__PURE__*/ _react.default.createElement(_components.Text, {
|
|
160
160
|
className: "".concat(classPrefix, "-title")
|
|
161
|
-
}, title), content && /*#__PURE__*/ _react.default.createElement(_components.
|
|
161
|
+
}, title), content && /*#__PURE__*/ _react.default.createElement(_components.View, {
|
|
162
162
|
className: "".concat(classPrefix, "-text")
|
|
163
163
|
}, content)))));
|
|
164
164
|
};
|
|
@@ -3,14 +3,13 @@ import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
|
|
|
3
3
|
import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
|
|
4
4
|
import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
|
|
5
5
|
import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
|
|
6
|
-
import React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react";
|
|
6
|
+
import React, { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
|
|
7
7
|
import classNames from "classnames";
|
|
8
8
|
import { View } from "@tarojs/components";
|
|
9
9
|
import { nextTick, useReady } from "@tarojs/taro";
|
|
10
10
|
import { useTouch } from "../../hooks/use-touch";
|
|
11
11
|
import { getRectInMultiPlatform } from "../../utils/taro/get-rect";
|
|
12
12
|
import { ComponentDefaults } from "../../utils/typings";
|
|
13
|
-
import { harmony } from "../../utils/taro/platform";
|
|
14
13
|
import { useRefState } from "../../hooks/use-ref-state";
|
|
15
14
|
import { useUuid } from "../../hooks/use-uuid";
|
|
16
15
|
function preventDefault(event, isStopPropagation) {
|
|
@@ -30,95 +29,9 @@ export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
|
|
|
30
29
|
var uid = useUuid();
|
|
31
30
|
var leftId = "swipe-left-".concat(uid);
|
|
32
31
|
var rightId = "swipe-right-".concat(uid);
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
var _ref = _async_to_generator(function() {
|
|
37
|
-
var leftRect, rightRect;
|
|
38
|
-
return _ts_generator(this, function(_state) {
|
|
39
|
-
switch(_state.label){
|
|
40
|
-
case 0:
|
|
41
|
-
if (!leftWrapper.current) return [
|
|
42
|
-
3,
|
|
43
|
-
2
|
|
44
|
-
];
|
|
45
|
-
return [
|
|
46
|
-
4,
|
|
47
|
-
getRectInMultiPlatform(leftWrapper.current, leftId)
|
|
48
|
-
];
|
|
49
|
-
case 1:
|
|
50
|
-
leftRect = _state.sent();
|
|
51
|
-
leftRect && setActionWidth(function(v) {
|
|
52
|
-
return _object_spread_props(_object_spread({}, v), {
|
|
53
|
-
left: leftRect.width
|
|
54
|
-
});
|
|
55
|
-
});
|
|
56
|
-
_state.label = 2;
|
|
57
|
-
case 2:
|
|
58
|
-
if (!rightWrapper.current) return [
|
|
59
|
-
3,
|
|
60
|
-
4
|
|
61
|
-
];
|
|
62
|
-
return [
|
|
63
|
-
4,
|
|
64
|
-
getRectInMultiPlatform(rightWrapper.current, rightId)
|
|
65
|
-
];
|
|
66
|
-
case 3:
|
|
67
|
-
rightRect = _state.sent();
|
|
68
|
-
rightRect && setActionWidth(function(v) {
|
|
69
|
-
return _object_spread_props(_object_spread({}, v), {
|
|
70
|
-
right: rightRect.width
|
|
71
|
-
});
|
|
72
|
-
});
|
|
73
|
-
_state.label = 4;
|
|
74
|
-
case 4:
|
|
75
|
-
return [
|
|
76
|
-
2
|
|
77
|
-
];
|
|
78
|
-
}
|
|
79
|
-
});
|
|
80
|
-
});
|
|
81
|
-
return function getWidth() {
|
|
82
|
-
return _ref.apply(this, arguments);
|
|
83
|
-
};
|
|
84
|
-
}();
|
|
85
|
-
nextTick(function() {
|
|
86
|
-
return getWidth();
|
|
87
|
-
});
|
|
88
|
-
});
|
|
89
|
-
var _$_object_spread = _object_spread({}, defaultProps, props), children = _$_object_spread.children, className = _$_object_spread.className, style = _$_object_spread.style;
|
|
90
|
-
var root = useRef();
|
|
91
|
-
var opened = useRef(false);
|
|
92
|
-
var lockClick = useRef(false);
|
|
93
|
-
var startOffset = useRef(0);
|
|
94
|
-
var _useState = _sliced_to_array(useState({
|
|
95
|
-
offset: 0,
|
|
96
|
-
dragging: false
|
|
97
|
-
}), 2), state = _useState[0], setState = _useState[1];
|
|
98
|
-
var _useRefState = _sliced_to_array(useRefState({
|
|
99
|
-
left: 0,
|
|
100
|
-
right: 0
|
|
101
|
-
}), 2), actionWidth = _useRefState[0], updateState = _useRefState[1];
|
|
102
|
-
var setActionWidth = function(fn) {
|
|
103
|
-
var res = fn();
|
|
104
|
-
if (res.left !== undefined) {
|
|
105
|
-
updateState(_object_spread_props(_object_spread({}, actionWidth.current), {
|
|
106
|
-
left: res.left
|
|
107
|
-
}));
|
|
108
|
-
}
|
|
109
|
-
if (res.right !== undefined) {
|
|
110
|
-
updateState(_object_spread_props(_object_spread({}, actionWidth.current), {
|
|
111
|
-
right: res.right
|
|
112
|
-
}));
|
|
113
|
-
}
|
|
114
|
-
};
|
|
115
|
-
var wrapperStyle = {
|
|
116
|
-
transform: "translate(".concat(state.offset).concat(!harmony() ? 'px' : '', ", 0)"),
|
|
117
|
-
transitionDuration: state.dragging ? '0s' : '.6s'
|
|
118
|
-
};
|
|
119
|
-
var onTouchStart = /*#__PURE__*/ function() {
|
|
120
|
-
var _ref = _async_to_generator(function(event) {
|
|
121
|
-
var leftRect, rightRect, _props_onTouchStart;
|
|
32
|
+
var getWidth = /*#__PURE__*/ function() {
|
|
33
|
+
var _ref = _async_to_generator(function() {
|
|
34
|
+
var leftRect, rightRect;
|
|
122
35
|
return _ts_generator(this, function(_state) {
|
|
123
36
|
switch(_state.label){
|
|
124
37
|
case 0:
|
|
@@ -156,47 +69,102 @@ export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
|
|
|
156
69
|
});
|
|
157
70
|
_state.label = 4;
|
|
158
71
|
case 4:
|
|
159
|
-
if (!props.disabled) {
|
|
160
|
-
;
|
|
161
|
-
startOffset.current = state.offset;
|
|
162
|
-
touch.start(event);
|
|
163
|
-
(_props_onTouchStart = props.onTouchStart) === null || _props_onTouchStart === void 0 ? void 0 : _props_onTouchStart.call(props, event);
|
|
164
|
-
}
|
|
165
72
|
return [
|
|
166
73
|
2
|
|
167
74
|
];
|
|
168
75
|
}
|
|
169
76
|
});
|
|
170
77
|
});
|
|
78
|
+
return function getWidth() {
|
|
79
|
+
return _ref.apply(this, arguments);
|
|
80
|
+
};
|
|
81
|
+
}();
|
|
82
|
+
// 获取元素的时候要在页面 onReady 后，需要参考小程序的事件周期
|
|
83
|
+
useReady(function() {
|
|
84
|
+
nextTick(function() {
|
|
85
|
+
return getWidth();
|
|
86
|
+
});
|
|
87
|
+
});
|
|
88
|
+
var _$_object_spread = _object_spread({}, defaultProps, props), children = _$_object_spread.children, className = _$_object_spread.className, style = _$_object_spread.style;
|
|
89
|
+
var root = useRef();
|
|
90
|
+
var opened = useRef(false);
|
|
91
|
+
var lockClick = useRef(false);
|
|
92
|
+
var startOffset = useRef(0);
|
|
93
|
+
var _useState = _sliced_to_array(useState({
|
|
94
|
+
offset: 0,
|
|
95
|
+
dragging: false
|
|
96
|
+
}), 2), state = _useState[0], setState = _useState[1];
|
|
97
|
+
var _useRefState = _sliced_to_array(useRefState({
|
|
98
|
+
left: 0,
|
|
99
|
+
right: 0
|
|
100
|
+
}), 2), actionWidth = _useRefState[0], updateState = _useRefState[1];
|
|
101
|
+
var setActionWidth = function(fn) {
|
|
102
|
+
var res = fn();
|
|
103
|
+
if (res.left !== undefined) {
|
|
104
|
+
updateState(_object_spread_props(_object_spread({}, actionWidth.current), {
|
|
105
|
+
left: res.left
|
|
106
|
+
}));
|
|
107
|
+
}
|
|
108
|
+
if (res.right !== undefined) {
|
|
109
|
+
updateState(_object_spread_props(_object_spread({}, actionWidth.current), {
|
|
110
|
+
right: res.right
|
|
111
|
+
}));
|
|
112
|
+
}
|
|
113
|
+
};
|
|
114
|
+
var wrapperStyle = useMemo(function() {
|
|
115
|
+
return {
|
|
116
|
+
transform: "translate(".concat(state.offset, "px, 0)"),
|
|
117
|
+
transitionDuration: state.dragging ? '0.01s' : '.6s'
|
|
118
|
+
};
|
|
119
|
+
}, [
|
|
120
|
+
state.offset,
|
|
121
|
+
state.dragging
|
|
122
|
+
]);
|
|
123
|
+
var onTouchStart = /*#__PURE__*/ function() {
|
|
124
|
+
var _ref = _async_to_generator(function(event) {
|
|
125
|
+
var _props_onTouchStart;
|
|
126
|
+
return _ts_generator(this, function(_state) {
|
|
127
|
+
if (!props.disabled) {
|
|
128
|
+
;
|
|
129
|
+
getWidth();
|
|
130
|
+
startOffset.current = state.offset;
|
|
131
|
+
touch.start(event);
|
|
132
|
+
(_props_onTouchStart = props.onTouchStart) === null || _props_onTouchStart === void 0 ? void 0 : _props_onTouchStart.call(props, event);
|
|
133
|
+
}
|
|
134
|
+
return [
|
|
135
|
+
2
|
|
136
|
+
];
|
|
137
|
+
});
|
|
138
|
+
});
|
|
171
139
|
return function onTouchStart(event) {
|
|
172
140
|
return _ref.apply(this, arguments);
|
|
173
141
|
};
|
|
174
142
|
}();
|
|
175
143
|
var onTouchMove = function(event) {
|
|
176
144
|
var _props_onTouchMove;
|
|
177
|
-
if (props.disabled)
|
|
178
|
-
return;
|
|
179
|
-
}
|
|
145
|
+
if (props.disabled) return;
|
|
180
146
|
touch.move(event);
|
|
181
147
|
(_props_onTouchMove = props.onTouchMove) === null || _props_onTouchMove === void 0 ? void 0 : _props_onTouchMove.call(props, event);
|
|
182
148
|
if (touch.isHorizontal()) {
|
|
183
149
|
lockClick.current = true;
|
|
184
|
-
var newState = _object_spread_props(_object_spread({}, state), {
|
|
185
|
-
dragging: true
|
|
186
|
-
});
|
|
187
150
|
var isEdge = !opened || touch.deltaX.current * startOffset.current < 0;
|
|
188
151
|
if (isEdge) {
|
|
189
152
|
preventDefault(event, true);
|
|
190
153
|
}
|
|
191
|
-
|
|
192
|
-
setState(
|
|
154
|
+
var offset = rangeCalculation(touch.deltaX.current + startOffset.current, -actionWidth.current.right || 0, actionWidth.current.left || 0);
|
|
155
|
+
setState(function(prevState) {
|
|
156
|
+
return _object_spread_props(_object_spread({}, prevState), {
|
|
157
|
+
dragging: true,
|
|
158
|
+
offset: Number(offset) || 0
|
|
159
|
+
});
|
|
160
|
+
});
|
|
193
161
|
}
|
|
194
162
|
};
|
|
195
163
|
var onTouchEnd = function(event) {
|
|
196
164
|
if (state.dragging) {
|
|
197
165
|
var _props_onTouchEnd;
|
|
198
|
-
setState(function(
|
|
199
|
-
return _object_spread_props(_object_spread({},
|
|
166
|
+
setState(function(prevState) {
|
|
167
|
+
return _object_spread_props(_object_spread({}, prevState), {
|
|
200
168
|
dragging: false
|
|
201
169
|
});
|
|
202
170
|
});
|
|
@@ -227,13 +195,13 @@ export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
|
|
|
227
195
|
name: name,
|
|
228
196
|
position: side
|
|
229
197
|
});
|
|
230
|
-
setState(function(
|
|
231
|
-
return _object_spread_props(_object_spread({},
|
|
198
|
+
setState(function(prevState) {
|
|
199
|
+
return _object_spread_props(_object_spread({}, prevState), {
|
|
232
200
|
offset: Number(offset) || 0
|
|
233
201
|
});
|
|
234
202
|
});
|
|
235
203
|
};
|
|
236
|
-
var close = function(position) {
|
|
204
|
+
var close = useCallback(function(position) {
|
|
237
205
|
if (opened.current) {
|
|
238
206
|
var _props_onClose;
|
|
239
207
|
opened.current = false;
|
|
@@ -242,12 +210,14 @@ export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
|
|
|
242
210
|
position: position || 'left'
|
|
243
211
|
});
|
|
244
212
|
}
|
|
245
|
-
setState(function(
|
|
246
|
-
return _object_spread_props(_object_spread({},
|
|
213
|
+
setState(function(prevState) {
|
|
214
|
+
return _object_spread_props(_object_spread({}, prevState), {
|
|
247
215
|
offset: 0
|
|
248
216
|
});
|
|
249
217
|
});
|
|
250
|
-
}
|
|
218
|
+
}, [
|
|
219
|
+
props
|
|
220
|
+
]);
|
|
251
221
|
var rangeCalculation = function(num, min, max) {
|
|
252
222
|
return Math.min(Math.max(Number(num), Number(min)), Number(max));
|
|
253
223
|
};
|
|
@@ -284,8 +254,9 @@ export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
|
|
|
284
254
|
};
|
|
285
255
|
});
|
|
286
256
|
useEffect(function() {
|
|
287
|
-
|
|
257
|
+
// 并没有生效
|
|
288
258
|
var handler = function(event) {
|
|
259
|
+
console.log('~~hanyu handler---- window', event);
|
|
289
260
|
var targets = [
|
|
290
261
|
root
|
|
291
262
|
];
|
|
@@ -301,7 +272,9 @@ export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
|
|
|
301
272
|
return function() {
|
|
302
273
|
document.removeEventListener('touchstart', handler);
|
|
303
274
|
};
|
|
304
|
-
}, [
|
|
275
|
+
}, [
|
|
276
|
+
close
|
|
277
|
+
]);
|
|
305
278
|
return /*#__PURE__*/ React.createElement(View, {
|
|
306
279
|
ref: root,
|
|
307
280
|
className: classNames(classPrefix, className),
|