@nutui/nutui-react 1.3.5 → 1.3.6
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/CHANGELOG.md +7 -0
- package/dist/esm/ActionSheet.js +15 -25
- package/dist/esm/Address.js +151 -221
- package/dist/esm/AnimatingNumbers.js +7 -31
- package/dist/esm/Audio.js +31 -66
- package/dist/esm/Avatar.js +25 -51
- package/dist/esm/AvatarGroup.js +2 -9
- package/dist/esm/BackTop.js +29 -55
- package/dist/esm/Badge.js +9 -20
- package/dist/esm/Barrage.js +8 -20
- package/dist/esm/Button.js +22 -37
- package/dist/esm/Calendar.js +23 -37
- package/dist/esm/CalendarItem.js +86 -186
- package/dist/esm/Card.js +14 -20
- package/dist/esm/Cascader.js +77 -197
- package/dist/esm/Cell.js +20 -30
- package/dist/esm/CellGroup.js +6 -12
- package/dist/esm/Checkbox.js +27 -48
- package/dist/esm/CheckboxGroup.js +12 -30
- package/dist/esm/CircleProgress.js +11 -28
- package/dist/esm/Col.js +11 -22
- package/dist/esm/Collapse.js +11 -27
- package/dist/esm/CollapseItem.js +33 -47
- package/dist/esm/ConfigProvider.js +4 -15
- package/dist/esm/CountDown.js +37 -74
- package/dist/esm/DatePicker.js +44 -106
- package/dist/esm/Dialog.js +31 -89
- package/dist/esm/Divider.js +8 -15
- package/dist/esm/Drag.js +30 -45
- package/dist/esm/Elevator.js +37 -74
- package/dist/esm/Empty.js +11 -24
- package/dist/esm/FixedNav.js +18 -29
- package/dist/esm/Grid.js +13 -28
- package/dist/esm/GridItem.js +18 -34
- package/dist/esm/ImagePreview.js +36 -71
- package/dist/esm/Indicator.js +9 -20
- package/dist/esm/Infiniteloading.js +26 -55
- package/dist/esm/Input.js +62 -106
- package/dist/esm/InputNumber.js +25 -52
- package/dist/esm/Layout.js +0 -6
- package/dist/esm/Menu.js +24 -46
- package/dist/esm/MenuItem.js +29 -52
- package/dist/esm/NavBar.js +18 -34
- package/dist/esm/NoticeBar.js +54 -102
- package/dist/esm/Notify.js +9 -38
- package/dist/esm/NumberKeyboard.js +21 -52
- package/dist/esm/Pagination.js +38 -71
- package/dist/esm/Picker.js +91 -178
- package/dist/esm/Popover.js +32 -72
- package/dist/esm/Popup.js +40 -72
- package/dist/esm/Price.js +7 -24
- package/dist/esm/Progress.js +35 -50
- package/dist/esm/PullToRefresh.js +28 -83
- package/dist/esm/Radio.js +24 -47
- package/dist/esm/RadioGroup.js +14 -24
- package/dist/esm/Range.js +44 -116
- package/dist/esm/Rate.js +21 -39
- package/dist/esm/Row.js +7 -16
- package/dist/esm/SearchBar.js +47 -68
- package/dist/esm/ShortPassword.js +29 -56
- package/dist/esm/SideNavBar.js +9 -16
- package/dist/esm/SideNavBarItem.js +4 -11
- package/dist/esm/Signature.js +13 -43
- package/dist/esm/Skeleton.js +13 -23
- package/dist/esm/Step.js +12 -28
- package/dist/esm/Steps.js +6 -14
- package/dist/esm/Sticky.js +24 -52
- package/dist/esm/SubSideNavBar.js +7 -22
- package/dist/esm/Swipe.js +15 -54
- package/dist/esm/Swiper.js +102 -186
- package/dist/esm/SwiperItem.js +2 -12
- package/dist/esm/Switch.js +13 -27
- package/dist/esm/Tabbar.js +13 -25
- package/dist/esm/TabbarItem.js +15 -23
- package/dist/esm/Table.js +19 -39
- package/dist/esm/Tag.js +19 -36
- package/dist/esm/TextArea.js +19 -43
- package/dist/esm/TimeDetail.js +15 -28
- package/dist/esm/TimePannel.js +5 -12
- package/dist/esm/TimeSelect.js +35 -59
- package/dist/esm/Toast.js +16 -49
- package/dist/esm/Uploader.js +57 -152
- package/dist/esm/Video.js +8 -19
- package/dist/esm/VirtualList.js +84 -118
- package/dist/esm/date-710f8c7c.js +9 -33
- package/dist/esm/get-scroll-parent-3dcd3f53.js +1 -9
- package/dist/esm/icon-8dc4de10.js +11 -21
- package/dist/esm/offsetContext-0e3d04b3.js +0 -3
- package/dist/esm/overlay-ed3eb37d.js +12 -23
- package/dist/esm/render-18227751.js +0 -11
- package/dist/esm/tabpane-c957ab14.js +4 -10
- package/dist/esm/tabs-0896a61b.js +28 -56
- package/dist/esm/types/src/packages/elevator/demo.d.ts +1 -0
- package/dist/esm/types/src/packages/searchbar/searchbar.d.ts +2 -0
- package/dist/esm/useClientRect-839d18c5.js +0 -5
- package/dist/esm/useTouch-a2ea68c6.js +27 -47
- package/dist/locales/base.js +1 -1
- package/dist/locales/en-US.js +1 -1
- package/dist/locales/id-ID.js +1 -1
- package/dist/locales/zh-CN.js +1 -1
- package/dist/locales/zh-TW.js +1 -1
- package/dist/nutui.react.es.js +424 -406
- package/dist/nutui.react.umd.js +416 -398
- package/dist/packages/searchbar/searchbar.scss +20 -3
- package/dist/style.css +1 -1
- package/dist/style.es.js +1 -1
- package/dist/types/index.d.ts +2 -0
- package/package.json +1 -1
package/dist/esm/Swiper.js
CHANGED
|
@@ -3,11 +3,8 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
4
4
|
import _typeof from "@babel/runtime/helpers/typeof";
|
|
5
5
|
var _excluded = ["children", "direction", "className", "pageContent", "onChange", "initPage", "paginationColor", "paginationVisible", "touchable", "isPreventDefault", "isStopPropagation", "autoPlay", "isCenter"];
|
|
6
|
-
|
|
7
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; }
|
|
8
|
-
|
|
9
7
|
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
|
-
|
|
11
8
|
import React__default, { useRef, useState, useMemo, useEffect } from 'react';
|
|
12
9
|
import classNames from 'classnames';
|
|
13
10
|
import { D as DataContext } from './UserContext-b4181162.js';
|
|
@@ -33,27 +30,23 @@ var defaultProps = {
|
|
|
33
30
|
var DISTANCE = 5;
|
|
34
31
|
var Swiper = React__default.forwardRef(function (props, ref) {
|
|
35
32
|
var _classNames, _classNames2;
|
|
36
|
-
|
|
37
33
|
var propSwiper = _objectSpread(_objectSpread({}, defaultProps), props);
|
|
38
|
-
|
|
39
34
|
var children = propSwiper.children,
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
35
|
+
direction = propSwiper.direction,
|
|
36
|
+
className = propSwiper.className,
|
|
37
|
+
pageContent = propSwiper.pageContent,
|
|
38
|
+
onChange = propSwiper.onChange,
|
|
39
|
+
initPage = propSwiper.initPage,
|
|
40
|
+
paginationColor = propSwiper.paginationColor,
|
|
41
|
+
paginationVisible = propSwiper.paginationVisible,
|
|
42
|
+
touchable = propSwiper.touchable,
|
|
43
|
+
isPreventDefault = propSwiper.isPreventDefault,
|
|
44
|
+
isStopPropagation = propSwiper.isStopPropagation,
|
|
45
|
+
autoPlay = propSwiper.autoPlay,
|
|
46
|
+
isCenter = propSwiper.isCenter,
|
|
47
|
+
rest = _objectWithoutProperties(propSwiper, _excluded);
|
|
54
48
|
var container = useRef(null);
|
|
55
49
|
var innerRef = useRef(null);
|
|
56
|
-
|
|
57
50
|
var _swiper = useRef({
|
|
58
51
|
moving: false,
|
|
59
52
|
autoplayTimer: null,
|
|
@@ -62,100 +55,84 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
62
55
|
offset: 0,
|
|
63
56
|
size: 0
|
|
64
57
|
});
|
|
65
|
-
|
|
66
58
|
var isVertical = direction === 'vertical';
|
|
67
|
-
|
|
68
59
|
var _useState = useState(null),
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
60
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
61
|
+
rect = _useState2[0],
|
|
62
|
+
setRect = _useState2[1];
|
|
63
|
+
// eslint-disable-next-line prefer-const
|
|
74
64
|
var _useState3 = useState(0),
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
65
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
66
|
+
active = _useState4[0],
|
|
67
|
+
setActive = _useState4[1];
|
|
79
68
|
var _useState5 = useState(0),
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
69
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
70
|
+
width = _useState6[0],
|
|
71
|
+
setWidth = _useState6[1];
|
|
84
72
|
var _useState7 = useState(0),
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
73
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
74
|
+
height = _useState8[0],
|
|
75
|
+
setHeight = _useState8[1];
|
|
89
76
|
var _useState9 = useState(0),
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
77
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
|
78
|
+
offset = _useState10[0],
|
|
79
|
+
setOffset = _useState10[1];
|
|
94
80
|
var _useState11 = useState([]),
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
81
|
+
_useState12 = _slicedToArray(_useState11, 2),
|
|
82
|
+
childOffset = _useState12[0],
|
|
83
|
+
setChildOffset = _useState12[1];
|
|
99
84
|
var _useState13 = useState(false),
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
85
|
+
_useState14 = _slicedToArray(_useState13, 2),
|
|
86
|
+
ready = _useState14[0],
|
|
87
|
+
setReady = _useState14[1];
|
|
104
88
|
var size = isVertical ? height : width;
|
|
105
|
-
|
|
106
89
|
var _useState15 = useState({
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
90
|
+
startX: 0,
|
|
91
|
+
startY: 0,
|
|
92
|
+
deltaX: 0,
|
|
93
|
+
deltaY: 0,
|
|
94
|
+
offsetX: 0,
|
|
95
|
+
offsetY: 0,
|
|
96
|
+
stateDirection: '',
|
|
97
|
+
delta: 0,
|
|
98
|
+
touchTime: 0
|
|
99
|
+
}),
|
|
100
|
+
_useState16 = _slicedToArray(_useState15, 2),
|
|
101
|
+
touch = _useState16[0],
|
|
102
|
+
setTouch = _useState16[1];
|
|
121
103
|
var _useMemo = useMemo(function () {
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
104
|
+
var childCount = 0;
|
|
105
|
+
var childs = React__default.Children.map(props.children, function (child) {
|
|
106
|
+
if (!React__default.isValidElement(child)) return null;
|
|
107
|
+
childCount++;
|
|
108
|
+
return child;
|
|
109
|
+
});
|
|
110
|
+
return {
|
|
111
|
+
childs: childs,
|
|
112
|
+
childCount: childCount
|
|
113
|
+
};
|
|
114
|
+
}, [props.children]),
|
|
115
|
+
childs = _useMemo.childs,
|
|
116
|
+
childCount = _useMemo.childCount;
|
|
117
|
+
var trackSize = childCount * Number(size);
|
|
118
|
+
// 父组件参数传入子组件item
|
|
138
119
|
var parent = {
|
|
139
120
|
propSwiper: propSwiper,
|
|
140
121
|
size: size
|
|
141
122
|
};
|
|
142
|
-
|
|
143
123
|
var minOffset = function () {
|
|
144
124
|
if (rect) {
|
|
145
125
|
var base = isVertical ? rect.height : rect.width;
|
|
146
126
|
return base - Number(size) * childCount;
|
|
147
127
|
}
|
|
148
|
-
|
|
149
128
|
return 0;
|
|
150
|
-
}();
|
|
151
|
-
|
|
152
|
-
|
|
129
|
+
}();
|
|
130
|
+
// 清除定时器
|
|
153
131
|
var stopAutoPlay = function stopAutoPlay() {
|
|
154
132
|
clearTimeout(_swiper.current.autoplayTimer);
|
|
155
133
|
_swiper.current.autoplayTimer = null;
|
|
156
|
-
};
|
|
157
|
-
|
|
158
|
-
|
|
134
|
+
};
|
|
135
|
+
// 定时轮播
|
|
159
136
|
var autoplay = function autoplay() {
|
|
160
137
|
if (propSwiper.autoPlay <= 0 || childCount <= 1) return;
|
|
161
138
|
stopAutoPlay();
|
|
@@ -163,26 +140,22 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
163
140
|
next();
|
|
164
141
|
autoplay();
|
|
165
142
|
}, Number(propSwiper.autoPlay));
|
|
166
|
-
};
|
|
167
|
-
|
|
168
|
-
|
|
143
|
+
};
|
|
144
|
+
// 重置首尾位置信息
|
|
169
145
|
var resettPosition = function resettPosition() {
|
|
170
146
|
_swiper.current.moving = true;
|
|
171
|
-
|
|
172
147
|
if (active <= -1) {
|
|
173
148
|
move({
|
|
174
149
|
pace: childCount
|
|
175
150
|
});
|
|
176
151
|
}
|
|
177
|
-
|
|
178
152
|
if (active >= childCount) {
|
|
179
153
|
move({
|
|
180
154
|
pace: -childCount
|
|
181
155
|
});
|
|
182
156
|
}
|
|
183
|
-
};
|
|
184
|
-
|
|
185
|
-
|
|
157
|
+
};
|
|
158
|
+
// 上一页
|
|
186
159
|
var prev = function prev() {
|
|
187
160
|
resettPosition();
|
|
188
161
|
touchReset();
|
|
@@ -195,9 +168,8 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
195
168
|
});
|
|
196
169
|
});
|
|
197
170
|
});
|
|
198
|
-
};
|
|
199
|
-
|
|
200
|
-
|
|
171
|
+
};
|
|
172
|
+
// 下一页
|
|
201
173
|
var next = function next() {
|
|
202
174
|
resettPosition();
|
|
203
175
|
touchReset();
|
|
@@ -210,9 +182,8 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
210
182
|
});
|
|
211
183
|
});
|
|
212
184
|
});
|
|
213
|
-
};
|
|
214
|
-
|
|
215
|
-
|
|
185
|
+
};
|
|
186
|
+
// 前往指定页
|
|
216
187
|
var to = function to(index) {
|
|
217
188
|
resettPosition();
|
|
218
189
|
touchReset();
|
|
@@ -220,110 +191,90 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
220
191
|
requestFrame(function () {
|
|
221
192
|
_swiper.current.moving = false;
|
|
222
193
|
var targetIndex;
|
|
223
|
-
|
|
224
194
|
if (props.loop && childCount === index) {
|
|
225
195
|
targetIndex = active === 0 ? 0 : index;
|
|
226
196
|
} else {
|
|
227
197
|
targetIndex = index % childCount;
|
|
228
198
|
}
|
|
229
|
-
|
|
230
199
|
move({
|
|
231
200
|
pace: targetIndex - active,
|
|
232
201
|
isEmit: true
|
|
233
202
|
});
|
|
234
203
|
});
|
|
235
204
|
});
|
|
236
|
-
};
|
|
237
|
-
|
|
238
|
-
|
|
205
|
+
};
|
|
206
|
+
// 切换方法
|
|
239
207
|
var move = function move(_ref) {
|
|
240
208
|
var _ref$pace = _ref.pace,
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
209
|
+
pace = _ref$pace === void 0 ? 0 : _ref$pace,
|
|
210
|
+
_ref$offset = _ref.offset,
|
|
211
|
+
offset = _ref$offset === void 0 ? 0 : _ref$offset,
|
|
212
|
+
_ref$isEmit = _ref.isEmit,
|
|
213
|
+
isEmit = _ref$isEmit === void 0 ? false : _ref$isEmit,
|
|
214
|
+
_ref$movingStatus = _ref.movingStatus,
|
|
215
|
+
movingStatus = _ref$movingStatus === void 0 ? false : _ref$movingStatus;
|
|
248
216
|
if (childCount <= 1) return;
|
|
249
|
-
var targetActive = getActive(pace);
|
|
250
|
-
|
|
251
|
-
var targetOffset = getOffset(targetActive, offset);
|
|
252
|
-
|
|
217
|
+
var targetActive = getActive(pace);
|
|
218
|
+
// 父级容器偏移量
|
|
219
|
+
var targetOffset = getOffset(targetActive, offset);
|
|
220
|
+
// 如果循环,调整开头结尾图片位置
|
|
253
221
|
if (props.loop) {
|
|
254
222
|
if (Array.isArray(children) && children[0] && targetOffset !== minOffset) {
|
|
255
223
|
var rightBound = targetOffset < minOffset;
|
|
256
224
|
childOffset[0] = rightBound ? trackSize : 0;
|
|
257
225
|
}
|
|
258
|
-
|
|
259
226
|
if (Array.isArray(children) && children[childCount - 1] && targetOffset !== 0) {
|
|
260
227
|
var leftBound = targetOffset > 0;
|
|
261
228
|
childOffset[childCount - 1] = leftBound ? -trackSize : 0;
|
|
262
229
|
}
|
|
263
|
-
|
|
264
230
|
setChildOffset(childOffset);
|
|
265
231
|
}
|
|
266
|
-
|
|
267
232
|
if (isEmit && active !== targetActive) {
|
|
268
233
|
props.onChange && props.onChange((targetActive + childCount) % childCount);
|
|
269
234
|
}
|
|
270
|
-
|
|
271
235
|
active = targetActive;
|
|
272
236
|
setActive(targetActive);
|
|
273
237
|
setOffset(targetOffset);
|
|
274
238
|
getStyle(targetOffset);
|
|
275
|
-
};
|
|
276
|
-
|
|
277
|
-
|
|
239
|
+
};
|
|
240
|
+
// 确定当前active 元素
|
|
278
241
|
var getActive = function getActive(pace) {
|
|
279
242
|
if (pace) {
|
|
280
243
|
var _active = active + pace;
|
|
281
|
-
|
|
282
244
|
if (props.loop) {
|
|
283
245
|
return range(_active, -1, childCount);
|
|
284
246
|
}
|
|
285
|
-
|
|
286
247
|
return range(_active, 0, childCount - 1);
|
|
287
248
|
}
|
|
288
|
-
|
|
289
249
|
return active;
|
|
290
|
-
};
|
|
291
|
-
|
|
292
|
-
|
|
250
|
+
};
|
|
251
|
+
// 计算位移
|
|
293
252
|
var getOffset = function getOffset(active) {
|
|
294
253
|
var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
295
254
|
var currentPosition = active * Number(size);
|
|
296
|
-
|
|
297
255
|
if (!props.loop) {
|
|
298
256
|
currentPosition = Math.min(currentPosition, -minOffset);
|
|
299
257
|
}
|
|
300
|
-
|
|
301
258
|
var targetOffset = offset - currentPosition;
|
|
302
|
-
|
|
303
259
|
if (!props.loop) {
|
|
304
260
|
targetOffset = range(targetOffset, minOffset, 0);
|
|
305
261
|
}
|
|
306
|
-
|
|
307
262
|
return targetOffset;
|
|
308
|
-
};
|
|
309
|
-
|
|
310
|
-
|
|
263
|
+
};
|
|
264
|
+
// 浏览器 帧 事件
|
|
311
265
|
var requestFrame = function requestFrame(fn) {
|
|
312
266
|
window.requestAnimationFrame.call(window, fn);
|
|
313
|
-
};
|
|
314
|
-
|
|
315
|
-
|
|
267
|
+
};
|
|
268
|
+
// 取值 方法
|
|
316
269
|
var range = function range(num, min, max) {
|
|
317
270
|
return Math.min(Math.max(num, min), max);
|
|
318
271
|
};
|
|
319
|
-
|
|
320
272
|
var getDirection = function getDirection(x, y) {
|
|
321
273
|
if (x > y && x > DISTANCE) return 'horizontal';
|
|
322
274
|
if (y > x && y > DISTANCE) return 'vertical';
|
|
323
275
|
return '';
|
|
324
|
-
};
|
|
325
|
-
|
|
326
|
-
|
|
276
|
+
};
|
|
277
|
+
// 重置 全部位移信息
|
|
327
278
|
var touchReset = function touchReset() {
|
|
328
279
|
touch.startX = 0;
|
|
329
280
|
touch.startY = 0;
|
|
@@ -334,52 +285,43 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
334
285
|
touch.delta = 0;
|
|
335
286
|
touch.stateDirection = '';
|
|
336
287
|
touch.touchTime = 0;
|
|
337
|
-
};
|
|
338
|
-
|
|
339
|
-
|
|
288
|
+
};
|
|
289
|
+
// 触摸事件开始
|
|
340
290
|
var touchStart = function touchStart(e) {
|
|
341
291
|
touchReset();
|
|
342
292
|
touch.startX = e.touches[0].clientX;
|
|
343
293
|
touch.startY = e.touches[0].clientY;
|
|
344
|
-
};
|
|
345
|
-
|
|
346
|
-
|
|
294
|
+
};
|
|
295
|
+
// 触摸事件移动
|
|
347
296
|
var touchMove = function touchMove(e) {
|
|
348
297
|
touch.deltaX = e.touches[0].clientX - touch.startX;
|
|
349
298
|
touch.deltaY = e.touches[0].clientY - touch.startY;
|
|
350
299
|
touch.offsetX = Math.abs(touch.deltaX);
|
|
351
300
|
touch.offsetY = Math.abs(touch.deltaY);
|
|
352
301
|
touch.delta = isVertical ? touch.deltaY : touch.deltaX;
|
|
353
|
-
|
|
354
302
|
if (!touch.stateDirection) {
|
|
355
303
|
touch.stateDirection = getDirection(touch.offsetX, touch.offsetY);
|
|
356
304
|
}
|
|
357
305
|
};
|
|
358
|
-
|
|
359
306
|
var b = cn('swiper');
|
|
360
307
|
var classes = classNames(b(''));
|
|
361
308
|
var contentClass = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(b('inner')), true), _defineProperty(_classNames, "".concat(b('vertical')), isVertical), _classNames));
|
|
362
|
-
|
|
363
309
|
var getStyle = function getStyle() {
|
|
364
310
|
var moveOffset = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : offset;
|
|
365
311
|
var target = innerRef.current;
|
|
366
312
|
var _offset = 0;
|
|
367
|
-
|
|
368
313
|
if (!isCenter) {
|
|
369
314
|
_offset = moveOffset;
|
|
370
315
|
} else {
|
|
371
316
|
var _size = isVertical ? height : width;
|
|
372
|
-
|
|
373
317
|
var val = isVertical ? rect.height - _size : rect.width - _size;
|
|
374
318
|
_offset = moveOffset + (active === childCount - 1 && !props.loop ? -val / 2 : val / 2);
|
|
375
319
|
}
|
|
376
|
-
|
|
377
320
|
target.style.transform = "translate3D".concat(!isVertical ? "(".concat(_offset, "px,0,0)") : "(0,".concat(_offset, "px,0)"));
|
|
378
321
|
target.style.transitionDuration = "".concat(_swiper.current.moving ? 0 : props.duration, "ms");
|
|
379
322
|
target.style[isVertical ? 'height' : 'width'] = "".concat(Number(size) * childCount, "px");
|
|
380
323
|
target.style[isVertical ? 'width' : 'height'] = "".concat(isVertical ? width : height, "px");
|
|
381
324
|
};
|
|
382
|
-
|
|
383
325
|
var onTouchStart = function onTouchStart(e) {
|
|
384
326
|
if (props.isPreventDefault) e.preventDefault();
|
|
385
327
|
if (props.isStopPropagation) e.stopPropagation();
|
|
@@ -389,11 +331,9 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
389
331
|
stopAutoPlay();
|
|
390
332
|
resettPosition();
|
|
391
333
|
};
|
|
392
|
-
|
|
393
334
|
var onTouchMove = function onTouchMove(e) {
|
|
394
335
|
if (props.touchable && _swiper.current.moving) {
|
|
395
336
|
touchMove(e);
|
|
396
|
-
|
|
397
337
|
if (touch.stateDirection === props.direction) {
|
|
398
338
|
move({
|
|
399
339
|
offset: touch.delta
|
|
@@ -401,17 +341,14 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
401
341
|
}
|
|
402
342
|
}
|
|
403
343
|
};
|
|
404
|
-
|
|
405
344
|
var onTouchEnd = function onTouchEnd(e) {
|
|
406
345
|
if (!props.touchable || !_swiper.current.moving) return;
|
|
407
346
|
var speed = touch.delta / (Date.now() - touch.touchTime);
|
|
408
347
|
var isShouldMove = Math.abs(speed) > 0.3 || Math.abs(touch.delta) > +(size / 2).toFixed(2);
|
|
409
348
|
var pace = 0;
|
|
410
349
|
_swiper.current.moving = false;
|
|
411
|
-
|
|
412
350
|
if (isShouldMove && touch.stateDirection === props.direction) {
|
|
413
351
|
var _offset2 = isVertical ? touch.offsetY : touch.offsetX;
|
|
414
|
-
|
|
415
352
|
if (props.loop) {
|
|
416
353
|
if (_offset2 > 0) {
|
|
417
354
|
pace = touch.delta > 0 ? -1 : 1;
|
|
@@ -421,7 +358,6 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
421
358
|
} else {
|
|
422
359
|
pace = -Math[touch.delta > 0 ? 'ceil' : 'floor'](touch.delta / size);
|
|
423
360
|
}
|
|
424
|
-
|
|
425
361
|
move({
|
|
426
362
|
pace: pace,
|
|
427
363
|
isEmit: true
|
|
@@ -433,33 +369,24 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
433
369
|
} else {
|
|
434
370
|
getStyle();
|
|
435
371
|
}
|
|
436
|
-
|
|
437
372
|
autoplay();
|
|
438
373
|
};
|
|
439
|
-
|
|
440
374
|
useEffect(function () {
|
|
441
375
|
_swiper.current.activePagination = (active + childCount) % childCount;
|
|
442
376
|
}, [active]);
|
|
443
|
-
|
|
444
377
|
var init = function init() {
|
|
445
378
|
var active = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : +propSwiper.initPage;
|
|
446
379
|
var rect = getRect(container === null || container === void 0 ? void 0 : container.current);
|
|
447
|
-
|
|
448
380
|
var _active = Math.max(Math.min(childCount - 1, active), 0);
|
|
449
|
-
|
|
450
381
|
var _width = propSwiper.width ? +propSwiper.width : rect.width;
|
|
451
|
-
|
|
452
382
|
var _height = propSwiper.height ? +propSwiper.height : rect.height;
|
|
453
|
-
|
|
454
383
|
size = isVertical ? _height : _width;
|
|
455
384
|
trackSize = childCount * Number(size);
|
|
456
385
|
var targetOffset = getOffset(_active);
|
|
457
386
|
_swiper.current.moving = true;
|
|
458
|
-
|
|
459
387
|
if (ready) {
|
|
460
388
|
_swiper.current.moving = false;
|
|
461
389
|
}
|
|
462
|
-
|
|
463
390
|
setRect(rect);
|
|
464
391
|
setActive(_active);
|
|
465
392
|
setWidth(_width);
|
|
@@ -467,7 +394,6 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
467
394
|
setOffset(targetOffset);
|
|
468
395
|
setReady(true);
|
|
469
396
|
};
|
|
470
|
-
|
|
471
397
|
useEffect(function () {
|
|
472
398
|
if (ready) {
|
|
473
399
|
getStyle();
|
|
@@ -478,7 +404,6 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
478
404
|
stopAutoPlay();
|
|
479
405
|
autoplay();
|
|
480
406
|
}
|
|
481
|
-
|
|
482
407
|
return function () {
|
|
483
408
|
setReady(false);
|
|
484
409
|
};
|
|
@@ -506,27 +431,19 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
506
431
|
stopAutoPlay();
|
|
507
432
|
};
|
|
508
433
|
}, []);
|
|
509
|
-
|
|
510
434
|
var itemStyle = function itemStyle(index) {
|
|
511
435
|
var style = {};
|
|
512
|
-
|
|
513
436
|
var _direction = propSwiper.direction || direction;
|
|
514
|
-
|
|
515
437
|
var _size = size;
|
|
516
|
-
|
|
517
438
|
if (_size) {
|
|
518
439
|
style[_direction === 'horizontal' ? 'width' : 'height'] = "".concat(_size, "px");
|
|
519
440
|
}
|
|
520
|
-
|
|
521
441
|
var offset = childOffset[index];
|
|
522
|
-
|
|
523
442
|
if (offset) {
|
|
524
443
|
style.transform = "translate3D".concat(_direction === 'horizontal' ? "(".concat(offset, "px,0,0)") : "(0,".concat(offset, "px,0)"));
|
|
525
444
|
}
|
|
526
|
-
|
|
527
445
|
return style;
|
|
528
446
|
};
|
|
529
|
-
|
|
530
447
|
React__default.useImperativeHandle(ref, function () {
|
|
531
448
|
return {
|
|
532
449
|
to: to,
|
|
@@ -552,7 +469,6 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
552
469
|
className: classNames((_classNames2 = {}, _defineProperty(_classNames2, "".concat(b('pagination')), true), _defineProperty(_classNames2, "".concat(b('pagination-vertical')), isVertical), _classNames2))
|
|
553
470
|
}, React__default.Children.map(childs, function (item, index) {
|
|
554
471
|
var _classNames3;
|
|
555
|
-
|
|
556
472
|
return React__default.createElement("i", {
|
|
557
473
|
style: (active + childCount) % childCount === index ? {
|
|
558
474
|
backgroundColor: propSwiper.paginationColor
|
package/dist/esm/SwiperItem.js
CHANGED
|
@@ -1,9 +1,6 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
|
|
3
2
|
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; }
|
|
4
|
-
|
|
5
3
|
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; }
|
|
6
|
-
|
|
7
4
|
import React__default, { useContext } from 'react';
|
|
8
5
|
import classNames from 'classnames';
|
|
9
6
|
import { D as DataContext } from './UserContext-b4181162.js';
|
|
@@ -14,28 +11,21 @@ var defaultProps = {
|
|
|
14
11
|
};
|
|
15
12
|
var SwiperItem = React__default.forwardRef(function (props, ref) {
|
|
16
13
|
var _props = _objectSpread(_objectSpread({}, defaultProps), props);
|
|
17
|
-
|
|
18
14
|
var children = _props.children,
|
|
19
|
-
|
|
20
|
-
|
|
15
|
+
direction = _props.direction,
|
|
16
|
+
size = _props.size;
|
|
21
17
|
var parent = useContext(DataContext);
|
|
22
18
|
var b = cn('swiper-item');
|
|
23
19
|
var classes = classNames(b(''));
|
|
24
|
-
|
|
25
20
|
var style = function style() {
|
|
26
21
|
var style = {};
|
|
27
|
-
|
|
28
22
|
var _direction = (parent === null || parent === void 0 ? void 0 : parent.propSwiper.direction) || direction;
|
|
29
|
-
|
|
30
23
|
var _size = (parent === null || parent === void 0 ? void 0 : parent.size) || size;
|
|
31
|
-
|
|
32
24
|
if (_size) {
|
|
33
25
|
style[_direction === 'horizontal' ? 'width' : 'height'] = "".concat(_size, "px");
|
|
34
26
|
}
|
|
35
|
-
|
|
36
27
|
return style;
|
|
37
28
|
};
|
|
38
|
-
|
|
39
29
|
return React__default.createElement("div", {
|
|
40
30
|
className: classes,
|
|
41
31
|
style: style()
|