@nutui/nutui-react 1.5.1 → 2.0.0-alpha.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.
- package/CHANGELOG.md +24 -664
- package/dist/esm/ActionSheet.js +62 -54
- package/dist/esm/Address/style/index.js +0 -1
- package/dist/esm/Address.js +235 -330
- package/dist/esm/Animate.js +43 -32
- package/dist/esm/AnimatingNumbers.js +88 -49
- package/dist/esm/Audio/style/index.js +0 -1
- package/dist/esm/Audio.js +108 -121
- package/dist/esm/Avatar.js +65 -78
- package/dist/esm/AvatarContext.js +5 -0
- package/dist/esm/AvatarGroup.js +46 -27
- package/dist/esm/BackTop/style/index.js +1 -1
- package/dist/esm/BackTop.js +74 -76
- package/dist/esm/Badge.js +57 -54
- package/dist/esm/Barrage.js +45 -32
- package/dist/esm/Button/style/index.js +1 -1
- package/dist/esm/Button.js +66 -87
- package/dist/esm/Calendar.js +80 -79
- package/dist/esm/CalendarItem.js +199 -231
- package/dist/esm/Card.js +44 -37
- package/dist/esm/Cascader.js +431 -434
- package/dist/esm/Cell/style/index.js +1 -1
- package/dist/esm/Cell.js +57 -87
- package/dist/esm/CellGroup.js +7 -5
- package/dist/esm/Checkbox/style/index.js +0 -1
- package/dist/esm/Checkbox.js +11 -8
- package/dist/esm/CheckboxGroup.js +78 -71
- package/dist/esm/CircleProgress.js +50 -40
- package/dist/esm/Col.js +49 -43
- package/dist/esm/Collapse.js +44 -44
- package/dist/esm/CollapseItem/style/index.js +1 -1
- package/dist/esm/CollapseItem.js +64 -104
- package/dist/esm/ConfigProvider.js +400 -101
- package/dist/esm/CountDown.js +90 -95
- package/dist/esm/DatePicker.js +104 -123
- package/dist/esm/Dialog.js +98 -104
- package/dist/esm/Divider.js +36 -27
- package/dist/esm/Drag.js +55 -59
- package/dist/esm/Elevator.js +77 -88
- package/dist/esm/Ellipsis.js +80 -79
- package/dist/esm/Empty.js +50 -44
- package/dist/esm/FixedNav/style/index.js +0 -1
- package/dist/esm/FixedNav.js +57 -65
- package/dist/esm/Form.js +1154 -123
- package/dist/esm/FormItem.js +7 -5
- package/dist/esm/Grid/style/index.js +1 -1
- package/dist/esm/Grid.js +51 -55
- package/dist/esm/GridItem.js +7 -124
- package/dist/esm/Icon.js +83 -5
- package/dist/esm/Image.js +123 -122
- package/dist/esm/ImagePreview.js +76 -94
- package/dist/esm/Indicator.js +41 -36
- package/dist/esm/Infiniteloading/style/index.js +1 -1
- package/dist/esm/Infiniteloading.js +77 -93
- package/dist/esm/Input/style/index.js +1 -1
- package/dist/esm/Input.js +120 -172
- package/dist/esm/InputNumber/style/index.js +1 -1
- package/dist/esm/InputNumber.js +133 -167
- package/dist/esm/Layout.js +27 -6
- package/dist/esm/Menu.js +84 -86
- package/dist/esm/MenuItem/style/index.js +0 -1
- package/dist/esm/MenuItem.js +76 -86
- package/dist/esm/NavBar/style/index.js +1 -1
- package/dist/esm/NavBar.js +59 -63
- package/dist/esm/NoticeBar/style/index.js +1 -1
- package/dist/esm/NoticeBar.js +173 -290
- package/dist/esm/Notify.js +112 -78
- package/dist/esm/NumberKeyboard.js +110 -109
- package/dist/esm/Overlay.js +7 -6
- package/dist/esm/Pagination.js +94 -135
- package/dist/esm/Picker.js +149 -201
- package/dist/esm/Popover/style/index.js +0 -1
- package/dist/esm/Popover.js +121 -116
- package/dist/esm/Popup/style/index.js +0 -1
- package/dist/esm/Popup.js +114 -131
- package/dist/esm/Price.js +51 -39
- package/dist/esm/Progress/style/index.js +1 -1
- package/dist/esm/Progress.js +59 -64
- package/dist/esm/PullToRefresh.js +173 -149
- package/dist/esm/Radio/style/index.js +0 -1
- package/dist/esm/Radio.js +8 -6
- package/dist/esm/RadioGroup.js +64 -84
- package/dist/esm/Range.js +93 -122
- package/dist/esm/Rate/style/index.js +1 -1
- package/dist/esm/Rate.js +77 -95
- package/dist/esm/Row.js +49 -37
- package/dist/esm/SearchBar/style/index.js +1 -1
- package/dist/esm/SearchBar.js +110 -120
- package/dist/esm/ShortPassword/style/index.js +0 -1
- package/dist/esm/ShortPassword.js +120 -116
- package/dist/esm/SideNavBar.js +38 -28
- package/dist/esm/SideNavBarItem.js +31 -14
- package/dist/esm/Signature.js +65 -61
- package/dist/esm/Skeleton.js +48 -40
- package/dist/esm/Step/style/index.js +1 -1
- package/dist/esm/Step.js +49 -49
- package/dist/esm/Steps.js +37 -23
- package/dist/esm/Sticky.js +111 -120
- package/dist/esm/SubSideNavBar.js +50 -38
- package/dist/esm/Swipe.js +75 -63
- package/dist/esm/Swiper.js +171 -206
- package/dist/esm/SwiperItem.js +39 -22
- package/dist/esm/Switch.js +46 -37
- package/dist/esm/TabPane.js +8 -6
- package/dist/esm/Tabbar.js +47 -39
- package/dist/esm/TabbarItem/style/index.js +1 -1
- package/dist/esm/TabbarItem.js +50 -52
- package/dist/esm/Table/style/index.js +1 -1
- package/dist/esm/Table.js +70 -70
- package/dist/esm/Tabs/style/index.js +1 -2
- package/dist/esm/Tabs.js +11 -9
- package/dist/esm/Tag/style/index.js +1 -1
- package/dist/esm/Tag.js +69 -70
- package/dist/esm/TextArea.js +70 -64
- package/dist/esm/TimeDetail.js +47 -38
- package/dist/esm/TimePannel.js +35 -19
- package/dist/esm/TimeSelect.js +60 -68
- package/dist/esm/Toast/style/index.js +1 -1
- package/dist/esm/Toast.js +126 -98
- package/dist/esm/TrendArrow/style/index.js +1 -1
- package/dist/esm/TrendArrow.js +59 -55
- package/dist/esm/Uploader/style/index.js +0 -1
- package/dist/esm/Uploader.js +195 -246
- package/dist/esm/UserContext.js +5 -0
- package/dist/esm/UserContext2.js +5 -0
- package/dist/esm/UserContext3.js +5 -0
- package/dist/esm/Video.js +49 -39
- package/dist/esm/VirtualList.js +111 -146
- package/dist/esm/WaterMark.js +57 -60
- package/dist/esm/bem.js +10 -0
- package/dist/esm/cellgroup2.js +49 -0
- package/dist/esm/checkbox2.js +145 -0
- package/dist/esm/{date-c7aad4c0.js → date.js} +13 -11
- package/dist/esm/{formitem-8a73a5fb.js → formitem2.js} +83 -50
- package/dist/esm/get-scroll-parent.js +26 -0
- package/dist/esm/griditem2.js +96 -0
- package/dist/esm/index.js +14 -0
- package/dist/esm/nutui-react.es.js +188 -94
- package/dist/esm/offsetContext.js +19 -0
- package/dist/esm/overlay2.js +98 -0
- package/dist/esm/px-check.js +6 -0
- package/dist/esm/radio2.js +129 -0
- package/dist/esm/render.js +95 -0
- package/dist/esm/tabpane2.js +44 -0
- package/dist/esm/tabs2.js +175 -0
- package/dist/esm/typings.js +7 -0
- package/dist/esm/use-client-rect.js +32 -0
- package/dist/esm/use-props-value.js +18 -0
- package/dist/esm/use-touch.js +74 -0
- package/dist/locales/base.d.ts +2 -2
- package/dist/locales/base.js +1 -1
- package/dist/locales/en-US.js +3 -3
- package/dist/locales/id-ID.js +3 -3
- package/dist/locales/zh-CN.js +3 -3
- package/dist/locales/zh-TW.js +3 -3
- package/dist/locales/zh-UG.js +3 -3
- package/dist/nutui.react.mjs +8389 -4901
- package/dist/nutui.react.umd.js +8390 -4902
- package/dist/packages/actionsheet/actionsheet.scss +10 -2
- package/dist/packages/audio/audio.scss +2 -15
- package/dist/packages/backtop/backtop.scss +0 -8
- package/dist/packages/badge/badge.scss +3 -4
- package/dist/packages/button/button.scss +80 -93
- package/dist/packages/calendar/calendar.scss +0 -30
- package/dist/packages/cell/cell.scss +18 -90
- package/dist/packages/cellgroup/cellgroup.scss +26 -20
- package/dist/packages/collapseitem/collapseitem.scss +0 -1
- package/dist/packages/dialog/dialog.scss +1 -1
- package/dist/packages/divider/divider.scss +3 -17
- package/dist/packages/grid/grid.scss +1 -0
- package/dist/packages/griditem/griditem.scss +2 -17
- package/dist/packages/icon/icon.scss +0 -132
- package/dist/packages/image/image.scss +0 -12
- package/dist/packages/indicator/indicator.scss +21 -39
- package/dist/packages/infiniteloading/infiniteloading.scss +4 -12
- package/dist/packages/input/input.scss +4 -0
- package/dist/packages/inputnumber/inputnumber.scss +10 -26
- package/dist/packages/menuitem/menuitem.scss +2 -0
- package/dist/packages/navbar/navbar.scss +4 -5
- package/dist/packages/overlay/overlay.scss +0 -19
- package/dist/packages/picker/picker.scss +97 -103
- package/dist/packages/popup/popup.scss +0 -16
- package/dist/packages/progress/progress.scss +0 -1
- package/dist/packages/radio/radio.scss +8 -0
- package/dist/packages/rate/rate.scss +29 -6
- package/dist/packages/row/row.scss +13 -31
- package/dist/packages/searchbar/searchbar.scss +0 -1
- package/dist/packages/shortpassword/shortpassword.scss +4 -1
- package/dist/packages/sidenavbar/sidenavbar.scss +0 -19
- package/dist/packages/step/step.scss +0 -1
- package/dist/packages/sticky/sticky.scss +1 -1
- package/dist/packages/swiper/swiper.scss +8 -0
- package/dist/packages/tabbaritem/tabbaritem.scss +0 -1
- package/dist/packages/table/table.scss +0 -1
- package/dist/packages/tag/tag.scss +9 -2
- package/dist/packages/timedetail/timedetail.scss +9 -3
- package/dist/packages/timeselect/timeselect.scss +1 -1
- package/dist/packages/toast/toast.scss +0 -1
- package/dist/packages/uploader/uploader.scss +2 -28
- package/dist/style.css +1 -1
- package/dist/style.mjs +1 -1
- package/dist/styles/font-jmapp/config.json +175 -0
- package/dist/styles/font-jmapp/demo.css +539 -0
- package/dist/styles/font-jmapp/demo_index.html +1821 -0
- package/dist/styles/font-jmapp/iconfont.css +299 -0
- package/dist/styles/font-jmapp/iconfont.eot +0 -0
- package/dist/styles/font-jmapp/iconfont.js +68 -0
- package/dist/styles/font-jmapp/iconfont.json +506 -0
- package/dist/styles/font-jmapp/iconfont.svg +356 -0
- package/dist/styles/font-jmapp/iconfont.ttf +0 -0
- package/dist/styles/font-jmapp/iconfont.woff +0 -0
- package/dist/styles/font-jmapp/iconfont.woff2 +0 -0
- package/dist/styles/theme-default.scss +1 -0
- package/dist/styles/theme-jmapp.scss +41 -0
- package/dist/styles/themes/default.scss +0 -1
- package/dist/styles/variables-jmapp.scss +2601 -0
- package/dist/styles/variables.scss +49 -73
- package/dist/types/index.d.ts +169 -266
- package/package.json +23 -154
- package/dist/esm/AvatarContext-15733596.js +0 -3
- package/dist/esm/Icon/style/index.js +0 -4
- package/dist/esm/UserContext-101ad4a4.js +0 -3
- package/dist/esm/UserContext-2629d479.js +0 -3
- package/dist/esm/UserContext-b33bcf21.js +0 -3
- package/dist/esm/bem-3b438e61.js +0 -8
- package/dist/esm/cellgroup-fcc72767.js +0 -34
- package/dist/esm/checkbox-44e13cd0.js +0 -137
- package/dist/esm/get-scroll-parent-5f85dee8.js +0 -24
- package/dist/esm/grid.context-2ee27d95.js +0 -6
- package/dist/esm/icon-4ef1581c.js +0 -70
- package/dist/esm/index-030b7245.js +0 -11
- package/dist/esm/offsetContext-3ab00d40.js +0 -16
- package/dist/esm/overlay-de6c79d5.js +0 -83
- package/dist/esm/radio-9f141e6b.js +0 -118
- package/dist/esm/render-bbebb760.js +0 -79
- package/dist/esm/tabpane-01075e6c.js +0 -29
- package/dist/esm/tabs-e1b4e4b1.js +0 -181
- package/dist/esm/typings-f27b58f4.js +0 -8
- package/dist/esm/useClientRect-56bb675b.js +0 -39
- package/dist/esm/useTouch-cf73a407.js +0 -99
package/dist/esm/Swiper.js
CHANGED
|
@@ -3,50 +3,55 @@ 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", "paginationBgColor"];
|
|
6
|
-
function ownKeys(object, enumerableOnly) {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
6
|
+
function ownKeys(object, enumerableOnly) {
|
|
7
|
+
var keys = Object.keys(object);
|
|
8
|
+
if (Object.getOwnPropertySymbols) {
|
|
9
|
+
var symbols = Object.getOwnPropertySymbols(object);
|
|
10
|
+
enumerableOnly && (symbols = symbols.filter(function(sym) {
|
|
11
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
12
|
+
})), keys.push.apply(keys, symbols);
|
|
13
|
+
}
|
|
14
|
+
return keys;
|
|
15
|
+
}
|
|
16
|
+
function _objectSpread(target) {
|
|
17
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
18
|
+
var source = null != arguments[i] ? arguments[i] : {};
|
|
19
|
+
i % 2 ? ownKeys(Object(source), true).forEach(function(key) {
|
|
20
|
+
_defineProperty(target, key, source[key]);
|
|
21
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
|
|
22
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
23
|
+
});
|
|
24
|
+
}
|
|
25
|
+
return target;
|
|
26
|
+
}
|
|
27
|
+
import React__default, { useRef, useState, useMemo, useEffect } from "react";
|
|
28
|
+
import classNames from "classnames";
|
|
29
|
+
import { D as DataContext } from "./UserContext3.js";
|
|
30
|
+
import { c as cn } from "./bem.js";
|
|
31
|
+
import { g as getRect } from "./use-client-rect.js";
|
|
32
|
+
import "@bem-react/classname";
|
|
14
33
|
var defaultProps = {
|
|
15
|
-
width: (typeof window === "undefined" ? "undefined" : _typeof(window)) ===
|
|
34
|
+
width: (typeof window === "undefined" ? "undefined" : _typeof(window)) === "object" ? window.innerWidth : 375,
|
|
16
35
|
height: 0,
|
|
17
36
|
duration: 500,
|
|
18
37
|
initPage: 0,
|
|
19
38
|
autoPlay: 0,
|
|
20
|
-
direction:
|
|
21
|
-
paginationColor:
|
|
22
|
-
paginationBgColor:
|
|
39
|
+
direction: "horizontal",
|
|
40
|
+
paginationColor: "#fff",
|
|
41
|
+
paginationBgColor: "#ddd",
|
|
23
42
|
paginationVisible: false,
|
|
24
43
|
loop: true,
|
|
25
44
|
touchable: true,
|
|
26
45
|
isPreventDefault: true,
|
|
27
46
|
isStopPropagation: true,
|
|
28
47
|
isCenter: false,
|
|
29
|
-
className:
|
|
48
|
+
className: ""
|
|
30
49
|
};
|
|
31
50
|
var DISTANCE = 5;
|
|
32
|
-
var Swiper = React__default.forwardRef(function
|
|
51
|
+
var Swiper = React__default.forwardRef(function(props, ref) {
|
|
33
52
|
var _classNames, _classNames2;
|
|
34
53
|
var propSwiper = _objectSpread(_objectSpread({}, defaultProps), props);
|
|
35
|
-
var children = propSwiper.children,
|
|
36
|
-
direction = propSwiper.direction,
|
|
37
|
-
className = propSwiper.className,
|
|
38
|
-
pageContent = propSwiper.pageContent,
|
|
39
|
-
onChange = propSwiper.onChange,
|
|
40
|
-
initPage = propSwiper.initPage,
|
|
41
|
-
paginationColor = propSwiper.paginationColor,
|
|
42
|
-
paginationVisible = propSwiper.paginationVisible,
|
|
43
|
-
touchable = propSwiper.touchable,
|
|
44
|
-
isPreventDefault = propSwiper.isPreventDefault,
|
|
45
|
-
isStopPropagation = propSwiper.isStopPropagation,
|
|
46
|
-
autoPlay = propSwiper.autoPlay,
|
|
47
|
-
isCenter = propSwiper.isCenter,
|
|
48
|
-
paginationBgColor = propSwiper.paginationBgColor,
|
|
49
|
-
rest = _objectWithoutProperties(propSwiper, _excluded);
|
|
54
|
+
var children = propSwiper.children, direction = propSwiper.direction, className = propSwiper.className, pageContent = propSwiper.pageContent, onChange = propSwiper.onChange, initPage = propSwiper.initPage, paginationColor = propSwiper.paginationColor, paginationVisible = propSwiper.paginationVisible, touchable = propSwiper.touchable, isPreventDefault = propSwiper.isPreventDefault, isStopPropagation = propSwiper.isStopPropagation, autoPlay = propSwiper.autoPlay, isCenter = propSwiper.isCenter, paginationBgColor = propSwiper.paginationBgColor, rest = _objectWithoutProperties(propSwiper, _excluded);
|
|
50
55
|
var container = useRef(null);
|
|
51
56
|
var innerRef = useRef(null);
|
|
52
57
|
var _swiper = useRef({
|
|
@@ -57,94 +62,65 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
57
62
|
offset: 0,
|
|
58
63
|
size: 0
|
|
59
64
|
});
|
|
60
|
-
var isVertical = direction ===
|
|
61
|
-
var _useState = useState(null),
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
var
|
|
67
|
-
|
|
68
|
-
active = _useState4[0],
|
|
69
|
-
setActive = _useState4[1];
|
|
70
|
-
var _useState5 = useState(0),
|
|
71
|
-
_useState6 = _slicedToArray(_useState5, 2),
|
|
72
|
-
width = _useState6[0],
|
|
73
|
-
setWidth = _useState6[1];
|
|
74
|
-
var _useState7 = useState(0),
|
|
75
|
-
_useState8 = _slicedToArray(_useState7, 2),
|
|
76
|
-
height = _useState8[0],
|
|
77
|
-
setHeight = _useState8[1];
|
|
78
|
-
var _useState9 = useState(0),
|
|
79
|
-
_useState10 = _slicedToArray(_useState9, 2),
|
|
80
|
-
offset = _useState10[0],
|
|
81
|
-
setOffset = _useState10[1];
|
|
82
|
-
var _useState11 = useState([]),
|
|
83
|
-
_useState12 = _slicedToArray(_useState11, 2),
|
|
84
|
-
childOffset = _useState12[0],
|
|
85
|
-
setChildOffset = _useState12[1];
|
|
86
|
-
var _useState13 = useState(false),
|
|
87
|
-
_useState14 = _slicedToArray(_useState13, 2),
|
|
88
|
-
ready = _useState14[0],
|
|
89
|
-
setReady = _useState14[1];
|
|
65
|
+
var isVertical = direction === "vertical";
|
|
66
|
+
var _useState = useState(null), _useState2 = _slicedToArray(_useState, 2), rect = _useState2[0], setRect = _useState2[1];
|
|
67
|
+
var _useState3 = useState(0), _useState4 = _slicedToArray(_useState3, 2), active = _useState4[0], setActive = _useState4[1];
|
|
68
|
+
var _useState5 = useState(0), _useState6 = _slicedToArray(_useState5, 2), width = _useState6[0], setWidth = _useState6[1];
|
|
69
|
+
var _useState7 = useState(0), _useState8 = _slicedToArray(_useState7, 2), height = _useState8[0], setHeight = _useState8[1];
|
|
70
|
+
var _useState9 = useState(0), _useState10 = _slicedToArray(_useState9, 2), offset = _useState10[0], setOffset = _useState10[1];
|
|
71
|
+
var _useState11 = useState([]), _useState12 = _slicedToArray(_useState11, 2), childOffset = _useState12[0], setChildOffset = _useState12[1];
|
|
72
|
+
var _useState13 = useState(false), _useState14 = _slicedToArray(_useState13, 2), ready = _useState14[0], setReady = _useState14[1];
|
|
90
73
|
var size = isVertical ? height : width;
|
|
91
74
|
var _useState15 = useState({
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
};
|
|
116
|
-
}, [props.children]),
|
|
117
|
-
childs = _useMemo.childs,
|
|
118
|
-
childCount = _useMemo.childCount;
|
|
75
|
+
startX: 0,
|
|
76
|
+
startY: 0,
|
|
77
|
+
deltaX: 0,
|
|
78
|
+
deltaY: 0,
|
|
79
|
+
offsetX: 0,
|
|
80
|
+
offsetY: 0,
|
|
81
|
+
stateDirection: "",
|
|
82
|
+
delta: 0,
|
|
83
|
+
touchTime: 0
|
|
84
|
+
}), _useState16 = _slicedToArray(_useState15, 2), touch = _useState16[0], setTouch = _useState16[1];
|
|
85
|
+
var _useMemo = useMemo(function() {
|
|
86
|
+
var childCount2 = 0;
|
|
87
|
+
var childs2 = React__default.Children.map(props.children, function(child) {
|
|
88
|
+
if (!React__default.isValidElement(child))
|
|
89
|
+
return null;
|
|
90
|
+
childCount2++;
|
|
91
|
+
return child;
|
|
92
|
+
});
|
|
93
|
+
return {
|
|
94
|
+
childs: childs2,
|
|
95
|
+
childCount: childCount2
|
|
96
|
+
};
|
|
97
|
+
}, [props.children]), childs = _useMemo.childs, childCount = _useMemo.childCount;
|
|
119
98
|
var trackSize = childCount * Number(size);
|
|
120
|
-
// 父组件参数传入子组件item
|
|
121
99
|
var parent = {
|
|
122
|
-
propSwiper
|
|
123
|
-
size
|
|
100
|
+
propSwiper,
|
|
101
|
+
size
|
|
124
102
|
};
|
|
125
|
-
var minOffset = function
|
|
103
|
+
var minOffset = function() {
|
|
126
104
|
if (rect) {
|
|
127
105
|
var base = isVertical ? rect.height : rect.width;
|
|
128
106
|
return base - Number(size) * childCount;
|
|
129
107
|
}
|
|
130
108
|
return 0;
|
|
131
109
|
}();
|
|
132
|
-
|
|
133
|
-
var stopAutoPlay = function stopAutoPlay() {
|
|
110
|
+
var stopAutoPlay = function stopAutoPlay2() {
|
|
134
111
|
clearTimeout(_swiper.current.autoplayTimer);
|
|
135
112
|
_swiper.current.autoplayTimer = null;
|
|
136
113
|
};
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
114
|
+
var autoplay = function autoplay2() {
|
|
115
|
+
if (propSwiper.autoPlay <= 0 || childCount <= 1)
|
|
116
|
+
return;
|
|
140
117
|
stopAutoPlay();
|
|
141
|
-
_swiper.current.autoplayTimer = setTimeout(function
|
|
118
|
+
_swiper.current.autoplayTimer = setTimeout(function() {
|
|
142
119
|
next();
|
|
143
|
-
|
|
120
|
+
autoplay2();
|
|
144
121
|
}, Number(propSwiper.autoPlay));
|
|
145
122
|
};
|
|
146
|
-
|
|
147
|
-
var resettPosition = function resettPosition() {
|
|
123
|
+
var resettPosition = function resettPosition2() {
|
|
148
124
|
_swiper.current.moving = true;
|
|
149
125
|
if (active <= -1) {
|
|
150
126
|
move({
|
|
@@ -157,12 +133,11 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
157
133
|
});
|
|
158
134
|
}
|
|
159
135
|
};
|
|
160
|
-
|
|
161
|
-
var prev = function prev() {
|
|
136
|
+
var prev = function prev2() {
|
|
162
137
|
resettPosition();
|
|
163
138
|
touchReset();
|
|
164
|
-
requestFrame(function
|
|
165
|
-
requestFrame(function
|
|
139
|
+
requestFrame(function() {
|
|
140
|
+
requestFrame(function() {
|
|
166
141
|
_swiper.current.moving = false;
|
|
167
142
|
move({
|
|
168
143
|
pace: -1,
|
|
@@ -171,12 +146,11 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
171
146
|
});
|
|
172
147
|
});
|
|
173
148
|
};
|
|
174
|
-
|
|
175
|
-
var next = function next() {
|
|
149
|
+
var next = function next2() {
|
|
176
150
|
resettPosition();
|
|
177
151
|
touchReset();
|
|
178
|
-
requestFrame(function
|
|
179
|
-
requestFrame(function
|
|
152
|
+
requestFrame(function() {
|
|
153
|
+
requestFrame(function() {
|
|
180
154
|
_swiper.current.moving = false;
|
|
181
155
|
move({
|
|
182
156
|
pace: 1,
|
|
@@ -185,12 +159,11 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
185
159
|
});
|
|
186
160
|
});
|
|
187
161
|
};
|
|
188
|
-
|
|
189
|
-
var to = function to(index) {
|
|
162
|
+
var to = function to2(index) {
|
|
190
163
|
resettPosition();
|
|
191
164
|
touchReset();
|
|
192
|
-
requestFrame(function
|
|
193
|
-
requestFrame(function
|
|
165
|
+
requestFrame(function() {
|
|
166
|
+
requestFrame(function() {
|
|
194
167
|
_swiper.current.moving = false;
|
|
195
168
|
var targetIndex;
|
|
196
169
|
if (props.loop && childCount === index) {
|
|
@@ -205,24 +178,15 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
205
178
|
});
|
|
206
179
|
});
|
|
207
180
|
};
|
|
208
|
-
var resize = function
|
|
181
|
+
var resize = function resize2() {
|
|
209
182
|
init(active);
|
|
210
183
|
};
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
_ref$offset = _ref.offset,
|
|
216
|
-
offset = _ref$offset === void 0 ? 0 : _ref$offset,
|
|
217
|
-
_ref$isEmit = _ref.isEmit,
|
|
218
|
-
isEmit = _ref$isEmit === void 0 ? false : _ref$isEmit,
|
|
219
|
-
_ref$movingStatus = _ref.movingStatus,
|
|
220
|
-
movingStatus = _ref$movingStatus === void 0 ? false : _ref$movingStatus;
|
|
221
|
-
if (childCount <= 1) return;
|
|
184
|
+
var move = function move2(_ref) {
|
|
185
|
+
var _ref$pace = _ref.pace, pace = _ref$pace === void 0 ? 0 : _ref$pace, _ref$offset = _ref.offset, offset2 = _ref$offset === void 0 ? 0 : _ref$offset, _ref$isEmit = _ref.isEmit, isEmit = _ref$isEmit === void 0 ? false : _ref$isEmit, _ref$movingStatus = _ref.movingStatus, movingStatus = _ref$movingStatus === void 0 ? false : _ref$movingStatus;
|
|
186
|
+
if (childCount <= 1)
|
|
187
|
+
return;
|
|
222
188
|
var targetActive = getActive(pace);
|
|
223
|
-
|
|
224
|
-
var targetOffset = getOffset(targetActive, offset);
|
|
225
|
-
// 如果循环,调整开头结尾图片位置
|
|
189
|
+
var targetOffset = getOffset(targetActive, offset2);
|
|
226
190
|
if (props.loop) {
|
|
227
191
|
if (Array.isArray(children) && children[0] && targetOffset !== minOffset) {
|
|
228
192
|
var rightBound = targetOffset < minOffset;
|
|
@@ -242,8 +206,7 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
242
206
|
setOffset(targetOffset);
|
|
243
207
|
getStyle(targetOffset);
|
|
244
208
|
};
|
|
245
|
-
|
|
246
|
-
var getActive = function getActive(pace) {
|
|
209
|
+
var getActive = function getActive2(pace) {
|
|
247
210
|
if (pace) {
|
|
248
211
|
var _active = active + pace;
|
|
249
212
|
if (props.loop) {
|
|
@@ -253,34 +216,32 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
253
216
|
}
|
|
254
217
|
return active;
|
|
255
218
|
};
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
var
|
|
259
|
-
var currentPosition = active * Number(size);
|
|
219
|
+
var getOffset = function getOffset2(active2) {
|
|
220
|
+
var offset2 = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0;
|
|
221
|
+
var currentPosition = active2 * Number(size);
|
|
260
222
|
if (!props.loop) {
|
|
261
223
|
currentPosition = Math.min(currentPosition, -minOffset);
|
|
262
224
|
}
|
|
263
|
-
var targetOffset =
|
|
225
|
+
var targetOffset = offset2 - currentPosition;
|
|
264
226
|
if (!props.loop) {
|
|
265
227
|
targetOffset = range(targetOffset, minOffset, 0);
|
|
266
228
|
}
|
|
267
229
|
return targetOffset;
|
|
268
230
|
};
|
|
269
|
-
|
|
270
|
-
var requestFrame = function requestFrame(fn) {
|
|
231
|
+
var requestFrame = function requestFrame2(fn) {
|
|
271
232
|
window.requestAnimationFrame.call(window, fn);
|
|
272
233
|
};
|
|
273
|
-
|
|
274
|
-
var range = function range(num, min, max) {
|
|
234
|
+
var range = function range2(num, min, max) {
|
|
275
235
|
return Math.min(Math.max(num, min), max);
|
|
276
236
|
};
|
|
277
|
-
var getDirection = function
|
|
278
|
-
if (x > y && x > DISTANCE)
|
|
279
|
-
|
|
280
|
-
|
|
237
|
+
var getDirection = function getDirection2(x, y) {
|
|
238
|
+
if (x > y && x > DISTANCE)
|
|
239
|
+
return "horizontal";
|
|
240
|
+
if (y > x && y > DISTANCE)
|
|
241
|
+
return "vertical";
|
|
242
|
+
return "";
|
|
281
243
|
};
|
|
282
|
-
|
|
283
|
-
var touchReset = function touchReset() {
|
|
244
|
+
var touchReset = function touchReset2() {
|
|
284
245
|
touch.startX = 0;
|
|
285
246
|
touch.startY = 0;
|
|
286
247
|
touch.deltaX = 0;
|
|
@@ -288,17 +249,15 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
288
249
|
touch.offsetX = 0;
|
|
289
250
|
touch.offsetY = 0;
|
|
290
251
|
touch.delta = 0;
|
|
291
|
-
touch.stateDirection =
|
|
252
|
+
touch.stateDirection = "";
|
|
292
253
|
touch.touchTime = 0;
|
|
293
254
|
};
|
|
294
|
-
|
|
295
|
-
var touchStart = function touchStart(e) {
|
|
255
|
+
var touchStart = function touchStart2(e) {
|
|
296
256
|
touchReset();
|
|
297
257
|
touch.startX = e.touches[0].clientX;
|
|
298
258
|
touch.startY = e.touches[0].clientY;
|
|
299
259
|
};
|
|
300
|
-
|
|
301
|
-
var touchMove = function touchMove(e) {
|
|
260
|
+
var touchMove = function touchMove2(e) {
|
|
302
261
|
touch.deltaX = e.touches[0].clientX - touch.startX;
|
|
303
262
|
touch.deltaY = e.touches[0].clientY - touch.startY;
|
|
304
263
|
touch.offsetX = Math.abs(touch.deltaX);
|
|
@@ -308,11 +267,11 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
308
267
|
touch.stateDirection = getDirection(touch.offsetX, touch.offsetY);
|
|
309
268
|
}
|
|
310
269
|
};
|
|
311
|
-
var b = cn(
|
|
312
|
-
var classes = classNames(b(
|
|
313
|
-
var contentClass = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(b(
|
|
314
|
-
var getStyle = function
|
|
315
|
-
var moveOffset = arguments.length > 0 && arguments[0] !==
|
|
270
|
+
var b = cn("swiper");
|
|
271
|
+
var classes = classNames(b(""));
|
|
272
|
+
var contentClass = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(b("inner")), true), _defineProperty(_classNames, "".concat(b("vertical")), isVertical), _classNames));
|
|
273
|
+
var getStyle = function getStyle2() {
|
|
274
|
+
var moveOffset = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : offset;
|
|
316
275
|
var target = innerRef.current;
|
|
317
276
|
var _offset = 0;
|
|
318
277
|
if (!isCenter) {
|
|
@@ -323,20 +282,23 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
323
282
|
_offset = moveOffset + (active === childCount - 1 && !props.loop ? -val / 2 : val / 2);
|
|
324
283
|
}
|
|
325
284
|
target.style.transitionDuration = "".concat(_swiper.current.moving ? 0 : props.duration, "ms");
|
|
326
|
-
target.style[isVertical ?
|
|
327
|
-
target.style[isVertical ?
|
|
285
|
+
target.style[isVertical ? "height" : "width"] = "".concat(Number(size) * childCount, "px");
|
|
286
|
+
target.style[isVertical ? "width" : "height"] = "".concat(isVertical ? width : height, "px");
|
|
328
287
|
target.style.transform = "translate3D".concat(!isVertical ? "(".concat(_offset, "px,0,0)") : "(0,".concat(_offset, "px,0)"));
|
|
329
288
|
};
|
|
330
|
-
var onTouchStart = function
|
|
331
|
-
if (props.isPreventDefault)
|
|
332
|
-
|
|
333
|
-
if (
|
|
289
|
+
var onTouchStart = function onTouchStart2(e) {
|
|
290
|
+
if (props.isPreventDefault)
|
|
291
|
+
e.preventDefault();
|
|
292
|
+
if (props.isStopPropagation)
|
|
293
|
+
e.stopPropagation();
|
|
294
|
+
if (!props.touchable)
|
|
295
|
+
return;
|
|
334
296
|
touchStart(e);
|
|
335
297
|
touch.touchTime = Date.now();
|
|
336
298
|
stopAutoPlay();
|
|
337
299
|
resettPosition();
|
|
338
300
|
};
|
|
339
|
-
var onTouchMove = function
|
|
301
|
+
var onTouchMove = function onTouchMove2(e) {
|
|
340
302
|
if (props.touchable && _swiper.current.moving) {
|
|
341
303
|
touchMove(e);
|
|
342
304
|
if (touch.stateDirection === props.direction) {
|
|
@@ -346,25 +308,26 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
346
308
|
}
|
|
347
309
|
}
|
|
348
310
|
};
|
|
349
|
-
var onTouchEnd = function
|
|
350
|
-
if (!props.touchable || !_swiper.current.moving)
|
|
311
|
+
var onTouchEnd = function onTouchEnd2(e) {
|
|
312
|
+
if (!props.touchable || !_swiper.current.moving)
|
|
313
|
+
return;
|
|
351
314
|
var speed = touch.delta / (Date.now() - touch.touchTime);
|
|
352
315
|
var isShouldMove = Math.abs(speed) > 0.3 || Math.abs(touch.delta) > +(size / 2).toFixed(2);
|
|
353
316
|
var pace = 0;
|
|
354
317
|
_swiper.current.moving = false;
|
|
355
318
|
if (isShouldMove && touch.stateDirection === props.direction) {
|
|
356
|
-
var
|
|
319
|
+
var offset2 = isVertical ? touch.offsetY : touch.offsetX;
|
|
357
320
|
if (props.loop) {
|
|
358
|
-
if (
|
|
321
|
+
if (offset2 > 0) {
|
|
359
322
|
pace = touch.delta > 0 ? -1 : 1;
|
|
360
323
|
} else {
|
|
361
324
|
pace = 0;
|
|
362
325
|
}
|
|
363
326
|
} else {
|
|
364
|
-
pace = -Math[touch.delta > 0 ?
|
|
327
|
+
pace = -Math[touch.delta > 0 ? "ceil" : "floor"](touch.delta / size);
|
|
365
328
|
}
|
|
366
329
|
move({
|
|
367
|
-
pace
|
|
330
|
+
pace,
|
|
368
331
|
isEmit: true
|
|
369
332
|
});
|
|
370
333
|
} else if (touch.delta) {
|
|
@@ -376,15 +339,15 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
376
339
|
}
|
|
377
340
|
autoplay();
|
|
378
341
|
};
|
|
379
|
-
useEffect(function
|
|
342
|
+
useEffect(function() {
|
|
380
343
|
_swiper.current.activePagination = (active + childCount) % childCount;
|
|
381
344
|
}, [active]);
|
|
382
|
-
var init = function
|
|
383
|
-
var
|
|
384
|
-
var
|
|
385
|
-
var _active = Math.max(Math.min(childCount - 1,
|
|
386
|
-
var _width = propSwiper.width ? +propSwiper.width :
|
|
387
|
-
var _height = propSwiper.height ? +propSwiper.height :
|
|
345
|
+
var init = function init2() {
|
|
346
|
+
var active2 = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : +propSwiper.initPage;
|
|
347
|
+
var rect2 = getRect(container === null || container === void 0 ? void 0 : container.current);
|
|
348
|
+
var _active = Math.max(Math.min(childCount - 1, active2), 0);
|
|
349
|
+
var _width = propSwiper.width ? +propSwiper.width : rect2.width;
|
|
350
|
+
var _height = propSwiper.height ? +propSwiper.height : rect2.height;
|
|
388
351
|
size = isVertical ? _height : _width;
|
|
389
352
|
trackSize = childCount * Number(size);
|
|
390
353
|
var targetOffset = getOffset(_active);
|
|
@@ -392,69 +355,69 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
392
355
|
if (ready) {
|
|
393
356
|
_swiper.current.moving = false;
|
|
394
357
|
}
|
|
395
|
-
setRect(
|
|
358
|
+
setRect(rect2);
|
|
396
359
|
setActive(_active);
|
|
397
360
|
setWidth(_width);
|
|
398
361
|
setHeight(_height);
|
|
399
362
|
setOffset(targetOffset);
|
|
400
363
|
setReady(true);
|
|
401
364
|
};
|
|
402
|
-
useEffect(function
|
|
365
|
+
useEffect(function() {
|
|
403
366
|
if (ready) {
|
|
404
367
|
getStyle();
|
|
405
368
|
}
|
|
406
369
|
}, [isVertical, width, height, offset, ready]);
|
|
407
|
-
useEffect(function
|
|
370
|
+
useEffect(function() {
|
|
408
371
|
if (ready) {
|
|
409
372
|
stopAutoPlay();
|
|
410
373
|
autoplay();
|
|
411
374
|
}
|
|
412
|
-
return function
|
|
375
|
+
return function() {
|
|
413
376
|
setReady(false);
|
|
414
377
|
};
|
|
415
378
|
}, [ready]);
|
|
416
|
-
useEffect(function
|
|
379
|
+
useEffect(function() {
|
|
417
380
|
stopAutoPlay();
|
|
418
381
|
autoplay();
|
|
419
382
|
}, [children]);
|
|
420
|
-
useEffect(function
|
|
383
|
+
useEffect(function() {
|
|
421
384
|
init();
|
|
422
385
|
}, [propSwiper.initPage]);
|
|
423
|
-
useEffect(function
|
|
386
|
+
useEffect(function() {
|
|
424
387
|
var target = container.current;
|
|
425
|
-
target.addEventListener(
|
|
426
|
-
target.addEventListener(
|
|
427
|
-
target.addEventListener(
|
|
428
|
-
return function
|
|
429
|
-
target.removeEventListener(
|
|
430
|
-
target.removeEventListener(
|
|
431
|
-
target.removeEventListener(
|
|
388
|
+
target.addEventListener("touchstart", onTouchStart, false);
|
|
389
|
+
target.addEventListener("touchmove", onTouchMove, false);
|
|
390
|
+
target.addEventListener("touchend", onTouchEnd, false);
|
|
391
|
+
return function() {
|
|
392
|
+
target.removeEventListener("touchstart", onTouchStart, false);
|
|
393
|
+
target.removeEventListener("touchmove", onTouchMove, false);
|
|
394
|
+
target.removeEventListener("touchend", onTouchEnd, false);
|
|
432
395
|
};
|
|
433
396
|
});
|
|
434
|
-
useEffect(function
|
|
435
|
-
return function
|
|
397
|
+
useEffect(function() {
|
|
398
|
+
return function() {
|
|
436
399
|
stopAutoPlay();
|
|
437
400
|
};
|
|
438
401
|
}, []);
|
|
439
|
-
var itemStyle = function
|
|
402
|
+
var itemStyle = function itemStyle2(index) {
|
|
440
403
|
var style = {};
|
|
441
404
|
var _direction = propSwiper.direction || direction;
|
|
442
405
|
var _size = size;
|
|
443
406
|
if (_size) {
|
|
444
|
-
style[_direction ===
|
|
407
|
+
style[_direction === "horizontal" ? "width" : "height"] = "".concat(_size, "px");
|
|
445
408
|
}
|
|
446
|
-
var
|
|
447
|
-
if (
|
|
448
|
-
style.transform = "translate3D".concat(_direction ===
|
|
409
|
+
var offset2 = childOffset[index];
|
|
410
|
+
if (offset2) {
|
|
411
|
+
style.transform = "translate3D".concat(_direction === "horizontal" ? "(".concat(offset2, "px,0,0)") : "(0,".concat(offset2, "px,0)"));
|
|
449
412
|
}
|
|
450
413
|
return style;
|
|
451
414
|
};
|
|
452
|
-
React__default.useImperativeHandle(ref, function
|
|
415
|
+
React__default.useImperativeHandle(ref, function() {
|
|
453
416
|
return {
|
|
454
|
-
to
|
|
455
|
-
next
|
|
456
|
-
prev
|
|
457
|
-
resize
|
|
417
|
+
to,
|
|
418
|
+
next,
|
|
419
|
+
prev,
|
|
420
|
+
resize
|
|
458
421
|
};
|
|
459
422
|
});
|
|
460
423
|
return React__default.createElement(DataContext.Provider, {
|
|
@@ -465,15 +428,15 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
465
428
|
}, rest), React__default.createElement("div", {
|
|
466
429
|
className: contentClass,
|
|
467
430
|
ref: innerRef
|
|
468
|
-
}, React__default.Children.map(childs, function
|
|
431
|
+
}, React__default.Children.map(childs, function(child, index) {
|
|
469
432
|
return React__default.createElement("div", {
|
|
470
|
-
className: b(
|
|
433
|
+
className: b("item-wrapper"),
|
|
471
434
|
style: itemStyle(index),
|
|
472
435
|
key: index
|
|
473
436
|
}, child);
|
|
474
|
-
})), propSwiper.paginationVisible && !(
|
|
475
|
-
className: classNames((_classNames2 = {}, _defineProperty(_classNames2, "".concat(b(
|
|
476
|
-
}, React__default.Children.map(childs, function
|
|
437
|
+
})), propSwiper.paginationVisible && !("pageContent" in propSwiper) ? React__default.createElement("div", {
|
|
438
|
+
className: classNames((_classNames2 = {}, _defineProperty(_classNames2, "".concat(b("pagination")), true), _defineProperty(_classNames2, "".concat(b("pagination-vertical")), isVertical), _classNames2))
|
|
439
|
+
}, React__default.Children.map(childs, function(item, index) {
|
|
477
440
|
return React__default.createElement("i", {
|
|
478
441
|
style: (active + childCount) % childCount === index ? {
|
|
479
442
|
backgroundColor: propSwiper.paginationColor
|
|
@@ -488,5 +451,7 @@ var Swiper = React__default.forwardRef(function (props, ref) {
|
|
|
488
451
|
})) : React__default.createElement("div", null, pageContent)));
|
|
489
452
|
});
|
|
490
453
|
Swiper.defaultProps = defaultProps;
|
|
491
|
-
Swiper.displayName =
|
|
492
|
-
export {
|
|
454
|
+
Swiper.displayName = "NutSwiper";
|
|
455
|
+
export {
|
|
456
|
+
Swiper as default
|
|
457
|
+
};
|