@nutui/nutui-react-taro 3.0.18 → 3.0.19-cpp-beta.0
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 +9 -10
- package/dist/cjs/packages/actionsheet/style/style.harmony.css +0 -3
- package/dist/cjs/packages/address/style/style.harmony.css +0 -3
- package/dist/cjs/packages/calendar/style/style.harmony.css +0 -3
- package/dist/cjs/packages/cascader/style/style.harmony.css +0 -3
- package/dist/cjs/packages/datepicker/style/style.harmony.css +0 -3
- package/dist/cjs/packages/dialog/dialog.js +12 -10
- package/dist/cjs/packages/imagepreview/style/style.harmony.css +0 -3
- package/dist/cjs/packages/input/input.js +14 -5
- package/dist/cjs/packages/numberkeyboard/style/style.harmony.css +0 -3
- package/dist/cjs/packages/overlay/overlay.js +17 -11
- package/dist/cjs/packages/picker/style/style.harmony.css +0 -3
- package/dist/cjs/packages/popover/style/style.harmony.css +0 -3
- package/dist/cjs/packages/popup/popup.d.ts +1 -1
- package/dist/cjs/packages/popup/popup.js +122 -23
- package/dist/cjs/packages/popup/style/popup.scss +0 -5
- package/dist/cjs/packages/popup/style/style.css +0 -3
- package/dist/cjs/packages/popup/style/style.harmony.css +0 -3
- package/dist/cjs/packages/popup/style-jmapp/popup.scss +0 -5
- package/dist/cjs/packages/popup/style-jmapp/style.css +0 -3
- package/dist/cjs/packages/popup/style-jrkf/popup.scss +0 -5
- package/dist/cjs/packages/popup/style-jrkf/style.css +0 -3
- package/dist/cjs/packages/shortpassword/style/style.harmony.css +0 -3
- package/dist/cjs/packages/swiper/swiper.js +1 -2
- package/dist/cjs/packages/timeselect/style/style.harmony.css +0 -3
- package/dist/cjs/packages/tour/style/style.harmony.css +0 -3
- package/dist/cjs/types/spec/popup/base.d.ts +6 -0
- package/dist/es/packages/actionsheet/style/style.harmony.css +0 -3
- package/dist/es/packages/address/style/style.harmony.css +0 -3
- package/dist/es/packages/calendar/style/style.harmony.css +0 -3
- package/dist/es/packages/cascader/style/style.harmony.css +0 -3
- package/dist/es/packages/datepicker/style/style.harmony.css +0 -3
- package/dist/es/packages/dialog/dialog.js +23 -19
- package/dist/es/packages/imagepreview/style/style.harmony.css +0 -3
- package/dist/es/packages/input/input.js +14 -5
- package/dist/es/packages/numberkeyboard/style/style.harmony.css +0 -3
- package/dist/es/packages/overlay/overlay.js +17 -11
- package/dist/es/packages/picker/style/style.harmony.css +0 -3
- package/dist/es/packages/popover/style/style.harmony.css +0 -3
- package/dist/es/packages/popup/popup.d.ts +1 -1
- package/dist/es/packages/popup/popup.js +124 -24
- package/dist/es/packages/popup/style/popup.scss +0 -5
- package/dist/es/packages/popup/style/style.css +0 -3
- package/dist/es/packages/popup/style/style.harmony.css +0 -3
- package/dist/es/packages/popup/style-jmapp/popup.scss +0 -5
- package/dist/es/packages/popup/style-jmapp/style.css +0 -3
- package/dist/es/packages/popup/style-jrkf/popup.scss +0 -5
- package/dist/es/packages/popup/style-jrkf/style.css +0 -3
- package/dist/es/packages/shortpassword/style/style.harmony.css +0 -3
- package/dist/es/packages/swiper/swiper.js +1 -2
- package/dist/es/packages/timeselect/style/style.harmony.css +0 -3
- package/dist/es/packages/tour/style/style.harmony.css +0 -3
- package/dist/es/types/spec/popup/base.d.ts +24 -0
- package/dist/nutui.react.umd.js +9794 -9703
- package/dist/style-jmapp.css +1 -1
- package/dist/style-jmapp.scss +24 -24
- package/dist/style-jrkf.css +1 -1
- package/dist/style-jrkf.scss +30 -30
- package/dist/style.css +1 -1
- package/dist/style.scss +34 -34
- package/package.json +1 -1
|
@@ -6,7 +6,6 @@ import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
|
|
|
6
6
|
import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
|
|
7
7
|
import React, { useState } from "react";
|
|
8
8
|
import classNames from "classnames";
|
|
9
|
-
import { CSSTransition } from "react-transition-group";
|
|
10
9
|
import { View } from "@tarojs/components";
|
|
11
10
|
import { Failure, Close } from "@nutui/icons-react-taro";
|
|
12
11
|
import Button from "../button/index";
|
|
@@ -171,24 +170,29 @@ export var BaseDialog = function(props) {
|
|
|
171
170
|
var renderContent = function() {
|
|
172
171
|
var contentZIndex = harmony() ? zIndex + 1 : zIndex // 解决harmony层级问题
|
|
173
172
|
;
|
|
174
|
-
return
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
173
|
+
return (
|
|
174
|
+
// <CSSTransition
|
|
175
|
+
// in={visible}
|
|
176
|
+
// timeout={300}
|
|
177
|
+
// classNames="fadeDialog"
|
|
178
|
+
// unmountOnExit
|
|
179
|
+
// appear
|
|
180
|
+
// >
|
|
181
|
+
/*#__PURE__*/ (React.createElement(Content, {
|
|
182
|
+
className: className,
|
|
183
|
+
style: _object_spread_props(_object_spread({
|
|
184
|
+
zIndex: contentZIndex
|
|
185
|
+
}, style), {
|
|
186
|
+
display: visible ? 'block' : 'none'
|
|
187
|
+
}),
|
|
188
|
+
title: title,
|
|
189
|
+
header: header,
|
|
190
|
+
close: renderCloseIcon(),
|
|
191
|
+
footer: renderFooter(),
|
|
192
|
+
footerDirection: footerDirection,
|
|
193
|
+
visible: visible
|
|
194
|
+
}, content || children))
|
|
195
|
+
);
|
|
192
196
|
};
|
|
193
197
|
return /*#__PURE__*/ React.createElement(View, {
|
|
194
198
|
style: {
|
|
@@ -64,18 +64,27 @@ export var Input = /*#__PURE__*/ forwardRef(function(props, ref) {
|
|
|
64
64
|
}), 2), value = _usePropsValue[0], setValue = _usePropsValue[1];
|
|
65
65
|
var inputRef = useRef(null);
|
|
66
66
|
var _useState = _sliced_to_array(useState(false), 2), active = _useState[0], setActive = _useState[1];
|
|
67
|
+
// 兼容H5和小程序获取原生input标签
|
|
68
|
+
var getNativeInput = function() {
|
|
69
|
+
if (Taro.getEnv() === 'WEB') {
|
|
70
|
+
var taroInputCoreEl = inputRef.current;
|
|
71
|
+
var inputEl = taroInputCoreEl.querySelector('input');
|
|
72
|
+
return inputEl;
|
|
73
|
+
}
|
|
74
|
+
return inputRef.current;
|
|
75
|
+
};
|
|
67
76
|
useImperativeHandle(ref, function() {
|
|
68
77
|
return {
|
|
69
78
|
clear: function() {
|
|
70
79
|
setValue('');
|
|
71
80
|
},
|
|
72
81
|
focus: function() {
|
|
73
|
-
var
|
|
74
|
-
|
|
82
|
+
var nativeInput = getNativeInput();
|
|
83
|
+
nativeInput === null || nativeInput === void 0 ? void 0 : nativeInput.focus();
|
|
75
84
|
},
|
|
76
85
|
blur: function() {
|
|
77
|
-
var
|
|
78
|
-
|
|
86
|
+
var nativeInput = getNativeInput();
|
|
87
|
+
nativeInput === null || nativeInput === void 0 ? void 0 : nativeInput.blur();
|
|
79
88
|
},
|
|
80
89
|
get nativeElement () {
|
|
81
90
|
return inputRef.current;
|
|
@@ -163,7 +172,7 @@ export var Input = /*#__PURE__*/ forwardRef(function(props, ref) {
|
|
|
163
172
|
maxlength: maxLength,
|
|
164
173
|
placeholder: placeholder === undefined ? locale.placeholder : placeholder,
|
|
165
174
|
placeholderClass: "".concat(classPrefix, "-placeholder"),
|
|
166
|
-
disabled: disabled
|
|
175
|
+
disabled: disabled,
|
|
167
176
|
value: value,
|
|
168
177
|
focus: autoFocus || focus,
|
|
169
178
|
confirmType: confirmType,
|
|
@@ -3,7 +3,6 @@ import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
|
|
|
3
3
|
import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
|
|
4
4
|
import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
|
|
5
5
|
import React, { useEffect, useState } from "react";
|
|
6
|
-
import { CSSTransition } from "react-transition-group";
|
|
7
6
|
import classNames from "classnames";
|
|
8
7
|
import { View } from "@tarojs/components";
|
|
9
8
|
import { ComponentDefaults } from "../../utils/typings";
|
|
@@ -53,20 +52,27 @@ export var Overlay = function(props) {
|
|
|
53
52
|
return /*#__PURE__*/ React.createElement(View, _object_spread_props(_object_spread({
|
|
54
53
|
ref: nodeRef,
|
|
55
54
|
className: classes,
|
|
56
|
-
style: styles
|
|
55
|
+
style: _object_spread_props(_object_spread({}, styles), {
|
|
56
|
+
display: innerVisible ? 'block' : 'none'
|
|
57
|
+
})
|
|
57
58
|
}, rest), {
|
|
58
59
|
catchMove: lockScroll,
|
|
59
60
|
onClick: handleClick
|
|
60
61
|
}), children);
|
|
61
62
|
};
|
|
62
|
-
return /*#__PURE__*/ React.createElement(
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
63
|
+
return /*#__PURE__*/ React.createElement(React.Fragment, null, renderOverlay());
|
|
64
|
+
// return (
|
|
65
|
+
// <CSSTransition
|
|
66
|
+
// nodeRef={nodeRef}
|
|
67
|
+
// classNames={`${classPrefix}-slide`}
|
|
68
|
+
// unmountOnExit
|
|
69
|
+
// timeout={duration}
|
|
70
|
+
// in={innerVisible}
|
|
71
|
+
// onEntered={afterShow}
|
|
72
|
+
// onExited={afterClose}
|
|
73
|
+
// >
|
|
74
|
+
// {renderOverlay()}
|
|
75
|
+
// </CSSTransition>
|
|
76
|
+
// )
|
|
71
77
|
};
|
|
72
78
|
Overlay.displayName = 'NutOverlay';
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React, { FunctionComponent } from 'react';
|
|
2
2
|
import { TaroPopupProps } from "../../types";
|
|
3
|
-
export declare const Popup: FunctionComponent<Partial<TaroPopupProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'onClick' | 'title'>>;
|
|
3
|
+
export declare const Popup: FunctionComponent<Partial<TaroPopupProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'onClick' | 'title' | 'onTouchStart' | 'onTouchMove' | 'onTouchEnd'>>;
|
|
@@ -1,17 +1,21 @@
|
|
|
1
|
+
import { _ as _async_to_generator } from "@swc/helpers/_/_async_to_generator";
|
|
1
2
|
import { _ as _define_property } from "@swc/helpers/_/_define_property";
|
|
2
3
|
import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
|
|
3
4
|
import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
|
|
4
5
|
import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
|
|
5
|
-
import
|
|
6
|
+
import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
|
|
7
|
+
import React, { useState, useEffect, useRef } from "react";
|
|
6
8
|
import { createPortal } from "react-dom";
|
|
7
|
-
import { CSSTransition } from
|
|
9
|
+
// import { CSSTransition } from 'react-transition-group'
|
|
8
10
|
import classNames from "classnames";
|
|
9
11
|
import { Close } from "@nutui/icons-react-taro";
|
|
10
12
|
import { View } from "@tarojs/components";
|
|
13
|
+
import { getRectInMultiPlatformWithoutCache } from "../../utils/taro/get-rect";
|
|
11
14
|
import { defaultOverlayProps } from "../overlay/overlay";
|
|
12
15
|
import Overlay from "../overlay/index";
|
|
13
16
|
import { useLockScrollTaro } from "../../hooks/taro/use-lock-scoll";
|
|
14
17
|
import { harmony } from "../../utils/taro/platform";
|
|
18
|
+
import { pxTransform } from "../../utils/taro/px-transform";
|
|
15
19
|
var defaultProps = _object_spread_props(_object_spread({}, defaultOverlayProps), {
|
|
16
20
|
position: 'center',
|
|
17
21
|
transition: '',
|
|
@@ -24,6 +28,8 @@ var defaultProps = _object_spread_props(_object_spread({}, defaultOverlayProps),
|
|
|
24
28
|
portal: null,
|
|
25
29
|
overlay: true,
|
|
26
30
|
round: false,
|
|
31
|
+
resizable: false,
|
|
32
|
+
minHeight: '',
|
|
27
33
|
onOpen: function() {},
|
|
28
34
|
onClose: function() {},
|
|
29
35
|
onOverlayClick: function() {
|
|
@@ -31,29 +37,51 @@ var defaultProps = _object_spread_props(_object_spread({}, defaultOverlayProps),
|
|
|
31
37
|
},
|
|
32
38
|
onCloseIconClick: function() {
|
|
33
39
|
return true;
|
|
34
|
-
}
|
|
40
|
+
},
|
|
41
|
+
onTouchStart: function() {},
|
|
42
|
+
onTouchMove: function() {},
|
|
43
|
+
onTouchEnd: function() {}
|
|
35
44
|
});
|
|
36
45
|
// 默认1000,参看variables
|
|
37
46
|
var _zIndex = 1100;
|
|
38
47
|
export var Popup = function(props) {
|
|
39
|
-
var _$_object_spread = _object_spread({}, defaultProps, props), children = _$_object_spread.children, visible = _$_object_spread.visible, overlay = _$_object_spread.overlay, closeOnOverlayClick = _$_object_spread.closeOnOverlayClick, overlayStyle = _$_object_spread.overlayStyle, overlayClassName = _$_object_spread.overlayClassName, zIndex = _$_object_spread.zIndex, lockScroll = _$_object_spread.lockScroll, duration = _$_object_spread.duration, closeable = _$_object_spread.closeable, closeIconPosition = _$_object_spread.closeIconPosition, closeIcon = _$_object_spread.closeIcon, left = _$_object_spread.left, title = _$_object_spread.title, description = _$_object_spread.description, style = _$_object_spread.style, transition = _$_object_spread.transition, round = _$_object_spread.round, position = _$_object_spread.position, className = _$_object_spread.className, destroyOnClose = _$_object_spread.destroyOnClose, portal = _$_object_spread.portal, onOpen = _$_object_spread.onOpen, onClose = _$_object_spread.onClose, onOverlayClick = _$_object_spread.onOverlayClick, onCloseIconClick = _$_object_spread.onCloseIconClick, afterShow = _$_object_spread.afterShow, afterClose = _$_object_spread.afterClose, onClick = _$_object_spread.onClick;
|
|
48
|
+
var _$_object_spread = _object_spread({}, defaultProps, props), children = _$_object_spread.children, visible = _$_object_spread.visible, overlay = _$_object_spread.overlay, closeOnOverlayClick = _$_object_spread.closeOnOverlayClick, overlayStyle = _$_object_spread.overlayStyle, overlayClassName = _$_object_spread.overlayClassName, zIndex = _$_object_spread.zIndex, lockScroll = _$_object_spread.lockScroll, duration = _$_object_spread.duration, closeable = _$_object_spread.closeable, closeIconPosition = _$_object_spread.closeIconPosition, closeIcon = _$_object_spread.closeIcon, left = _$_object_spread.left, title = _$_object_spread.title, top = _$_object_spread.top, description = _$_object_spread.description, style = _$_object_spread.style, transition = _$_object_spread.transition, round = _$_object_spread.round, position = _$_object_spread.position, className = _$_object_spread.className, destroyOnClose = _$_object_spread.destroyOnClose, portal = _$_object_spread.portal, resizable = _$_object_spread.resizable, minHeight = _$_object_spread.minHeight, onOpen = _$_object_spread.onOpen, onClose = _$_object_spread.onClose, onOverlayClick = _$_object_spread.onOverlayClick, onCloseIconClick = _$_object_spread.onCloseIconClick, afterShow = _$_object_spread.afterShow, afterClose = _$_object_spread.afterClose, onClick = _$_object_spread.onClick, onTouchStart = _$_object_spread.onTouchStart, onTouchMove = _$_object_spread.onTouchMove, onTouchEnd = _$_object_spread.onTouchEnd;
|
|
40
49
|
var innerIndex = zIndex || _zIndex;
|
|
41
50
|
var _useState = _sliced_to_array(useState(innerIndex), 2), index = _useState[0], setIndex = _useState[1];
|
|
42
51
|
var _useState1 = _sliced_to_array(useState(visible), 2), innerVisible = _useState1[0], setInnerVisible = _useState1[1];
|
|
43
52
|
var _useState2 = _sliced_to_array(useState(true), 2), showChildren = _useState2[0], setShowChildren = _useState2[1];
|
|
44
53
|
var _useState3 = _sliced_to_array(useState(''), 2), transitionName = _useState3[0], setTransitionName = _useState3[1];
|
|
45
|
-
var
|
|
54
|
+
var nodeRef = useLockScrollTaro(innerVisible && lockScroll);
|
|
55
|
+
var rootRect = useRef(null);
|
|
56
|
+
var touchStartRef = useRef(0);
|
|
57
|
+
var touchMoveDistanceRef = useRef(0);
|
|
58
|
+
var heightRef = useRef(0);
|
|
59
|
+
var defaultHeightRef = useRef(0);
|
|
60
|
+
var isTouching = useRef(false);
|
|
46
61
|
var classPrefix = 'nut-popup';
|
|
47
62
|
var overlayStyles = _object_spread({}, overlayStyle);
|
|
48
63
|
var contentZIndex = harmony() ? index + 1 : index // 解决harmony层级问题
|
|
49
64
|
;
|
|
50
65
|
var popStyles = _object_spread({
|
|
51
|
-
zIndex: contentZIndex
|
|
66
|
+
zIndex: contentZIndex,
|
|
67
|
+
minHeight: minHeight
|
|
52
68
|
}, style);
|
|
53
69
|
var _obj;
|
|
54
70
|
var popClassName = classNames(classPrefix, (_obj = {}, _define_property(_obj, "".concat(classPrefix, "-round"), round || position === 'bottom'), _define_property(_obj, "".concat(classPrefix, "-").concat(position), true), _obj), className);
|
|
71
|
+
var _useState4 = _sliced_to_array(useState(''), 2), popupHeight = _useState4[0], setPopupHeight = _useState4[1];
|
|
72
|
+
var resizeStyles = function() {
|
|
73
|
+
if (popupHeight !== '') {
|
|
74
|
+
return {
|
|
75
|
+
height: popupHeight
|
|
76
|
+
};
|
|
77
|
+
}
|
|
78
|
+
};
|
|
55
79
|
var open = function() {
|
|
56
80
|
if (!innerVisible) {
|
|
81
|
+
// 当高度改变后,再次打开时,将高度置为初始高度
|
|
82
|
+
if (position === 'bottom' && resizable && nodeRef.current && heightRef.current) {
|
|
83
|
+
setPopupHeight(pxTransform(defaultHeightRef.current));
|
|
84
|
+
}
|
|
57
85
|
setInnerVisible(true);
|
|
58
86
|
setIndex(++innerIndex);
|
|
59
87
|
}
|
|
@@ -107,27 +135,99 @@ export var Popup = function(props) {
|
|
|
107
135
|
return renderCloseIcon();
|
|
108
136
|
}
|
|
109
137
|
};
|
|
110
|
-
var
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
138
|
+
var handleTouchStart = /*#__PURE__*/ function() {
|
|
139
|
+
var _ref = _async_to_generator(function(event) {
|
|
140
|
+
var _nodeRef_current, _rootRect_current, e, rect;
|
|
141
|
+
return _ts_generator(this, function(_state) {
|
|
142
|
+
switch(_state.label){
|
|
143
|
+
case 0:
|
|
144
|
+
if (position !== 'bottom' || !resizable || !nodeRef.current) return [
|
|
145
|
+
2
|
|
146
|
+
];
|
|
147
|
+
e = event;
|
|
148
|
+
// 开始touch,记录下touch的pageY,用以判断是向上滑动还是向下滑动
|
|
149
|
+
touchStartRef.current = e.touches[0].pageY;
|
|
150
|
+
// 标记开始滑动
|
|
151
|
+
isTouching.current = true;
|
|
152
|
+
return [
|
|
153
|
+
4,
|
|
154
|
+
getRectInMultiPlatformWithoutCache(nodeRef.current)
|
|
155
|
+
];
|
|
156
|
+
case 1:
|
|
157
|
+
rect = _state.sent();
|
|
158
|
+
rootRect.current = rect;
|
|
159
|
+
heightRef.current = ((_nodeRef_current = nodeRef.current) === null || _nodeRef_current === void 0 ? void 0 : _nodeRef_current.offsetHeight) || ((_rootRect_current = rootRect.current) === null || _rootRect_current === void 0 ? void 0 : _rootRect_current.height) || 0;
|
|
160
|
+
if (!defaultHeightRef.current) defaultHeightRef.current = heightRef.current;
|
|
161
|
+
onTouchStart === null || onTouchStart === void 0 ? void 0 : onTouchStart(heightRef.current, e);
|
|
162
|
+
return [
|
|
163
|
+
2
|
|
164
|
+
];
|
|
165
|
+
}
|
|
166
|
+
});
|
|
167
|
+
});
|
|
168
|
+
return function handleTouchStart(event) {
|
|
169
|
+
return _ref.apply(this, arguments);
|
|
170
|
+
};
|
|
171
|
+
}();
|
|
172
|
+
var handleTouchMove = function(event) {
|
|
173
|
+
if (position !== 'bottom' || !resizable || !nodeRef.current || !rootRect.current) return;
|
|
174
|
+
var e = event;
|
|
175
|
+
e.stopPropagation();
|
|
176
|
+
// 计算位移:move过程中,当前的pageY 与 start值比较
|
|
177
|
+
touchMoveDistanceRef.current = e.touches[0].pageY - touchStartRef.current;
|
|
178
|
+
var handleMove = function() {
|
|
179
|
+
var min = typeof minHeight === 'number' ? minHeight : parseInt(String(minHeight || 0), 10) || 0;
|
|
180
|
+
var currentHeight = Math.max(min, heightRef.current - touchMoveDistanceRef.current);
|
|
181
|
+
setPopupHeight(pxTransform(currentHeight));
|
|
182
|
+
if (touchMoveDistanceRef.current > 0 && isTouching.current) {
|
|
183
|
+
// 向下滑动
|
|
184
|
+
onTouchMove === null || onTouchMove === void 0 ? void 0 : onTouchMove(currentHeight, e, 'down');
|
|
185
|
+
} else {
|
|
186
|
+
// 向上滑动
|
|
187
|
+
onTouchMove === null || onTouchMove === void 0 ? void 0 : onTouchMove(currentHeight, e, 'up');
|
|
188
|
+
}
|
|
189
|
+
};
|
|
190
|
+
requestAnimationFrame(handleMove);
|
|
191
|
+
};
|
|
192
|
+
var handleTouchEnd = function(event) {
|
|
193
|
+
if (position !== 'bottom' || !resizable || !nodeRef.current || !rootRect.current) return;
|
|
194
|
+
var e = event;
|
|
195
|
+
isTouching.current = false;
|
|
196
|
+
var min = typeof minHeight === 'number' ? minHeight : parseInt(String(minHeight || 0), 10) || 0;
|
|
197
|
+
var currentHeight = Math.max(min, heightRef.current - touchMoveDistanceRef.current);
|
|
198
|
+
onTouchEnd === null || onTouchEnd === void 0 ? void 0 : onTouchEnd(currentHeight, e);
|
|
118
199
|
};
|
|
119
200
|
var renderPop = function() {
|
|
120
|
-
return /*#__PURE__*/ React.createElement(
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
201
|
+
return /*#__PURE__*/ React.createElement(View, {
|
|
202
|
+
ref: nodeRef,
|
|
203
|
+
style: _object_spread(_object_spread_props(_object_spread({}, popStyles), {
|
|
204
|
+
display: innerVisible ? 'block' : 'none'
|
|
205
|
+
}), resizeStyles()),
|
|
206
|
+
className: popClassName,
|
|
207
|
+
onClick: onClick,
|
|
208
|
+
catchMove: lockScroll,
|
|
209
|
+
onTouchStart: handleTouchStart,
|
|
210
|
+
onTouchMove: handleTouchMove,
|
|
211
|
+
onTouchEnd: handleTouchEnd,
|
|
212
|
+
onTouchCancel: handleTouchEnd
|
|
213
|
+
}, top, renderTitle(), showChildren ? children : null);
|
|
130
214
|
};
|
|
215
|
+
// const renderPop = () => {
|
|
216
|
+
// return (
|
|
217
|
+
// <CSSTransition
|
|
218
|
+
// nodeRef={nodeRef}
|
|
219
|
+
// classNames={transitionName}
|
|
220
|
+
// mountOnEnter
|
|
221
|
+
// unmountOnExit={destroyOnClose}
|
|
222
|
+
// timeout={duration}
|
|
223
|
+
// in={innerVisible}
|
|
224
|
+
// onEntered={afterShow}
|
|
225
|
+
// onExited={afterClose}
|
|
226
|
+
// >
|
|
227
|
+
// {renderContent()}
|
|
228
|
+
// </CSSTransition>
|
|
229
|
+
// )
|
|
230
|
+
// }
|
|
131
231
|
var renderNode = function() {
|
|
132
232
|
return /*#__PURE__*/ React.createElement(React.Fragment, null, overlay ? /*#__PURE__*/ React.createElement(Overlay, {
|
|
133
233
|
zIndex: index,
|
|
@@ -19,7 +19,7 @@ var defaultProps = {
|
|
|
19
19
|
};
|
|
20
20
|
var classPrefix = 'nut-swiper';
|
|
21
21
|
export var Swiper = /*#__PURE__*/ React.forwardRef(function(props, ref) {
|
|
22
|
-
var _ref = _object_spread({}, defaultProps, props), width = _ref.width, height = _ref.height, className = _ref.className, children = _ref.children, indicator = _ref.indicator, indicatorDots = _ref.indicatorDots, loop = _ref.loop, circular = _ref.circular, autoPlay = _ref.autoPlay, autoplay = _ref.autoplay,
|
|
22
|
+
var _ref = _object_spread({}, defaultProps, props), width = _ref.width, height = _ref.height, className = _ref.className, children = _ref.children, indicator = _ref.indicator, indicatorDots = _ref.indicatorDots, loop = _ref.loop, circular = _ref.circular, autoPlay = _ref.autoPlay, autoplay = _ref.autoplay, vertical = _ref.vertical, direction = _ref.direction, defaultValue = _ref.defaultValue, current = _ref.current, onChange = _ref.onChange, style = _ref.style, rest = _object_without_properties(_ref, [
|
|
23
23
|
"width",
|
|
24
24
|
"height",
|
|
25
25
|
"className",
|
|
@@ -30,7 +30,6 @@ export var Swiper = /*#__PURE__*/ React.forwardRef(function(props, ref) {
|
|
|
30
30
|
"circular",
|
|
31
31
|
"autoPlay",
|
|
32
32
|
"autoplay",
|
|
33
|
-
"duration",
|
|
34
33
|
"vertical",
|
|
35
34
|
"direction",
|
|
36
35
|
"defaultValue",
|
|
@@ -34,6 +34,10 @@ export interface BasePopup extends BaseProps, BaseOverlay {
|
|
|
34
34
|
*/
|
|
35
35
|
title?: ReactNode
|
|
36
36
|
/**
|
|
37
|
+
* 頂部佔位
|
|
38
|
+
*/
|
|
39
|
+
top?: ReactNode
|
|
40
|
+
/**
|
|
37
41
|
* 子标题/描述部分
|
|
38
42
|
*/
|
|
39
43
|
description?: ReactNode
|
|
@@ -50,6 +54,14 @@ export interface BasePopup extends BaseProps, BaseOverlay {
|
|
|
50
54
|
*/
|
|
51
55
|
round: boolean
|
|
52
56
|
/**
|
|
57
|
+
* 上下滑动调整高度,当前只支持从底部弹出
|
|
58
|
+
*/
|
|
59
|
+
resizable: boolean
|
|
60
|
+
/**
|
|
61
|
+
* 设置最小高度
|
|
62
|
+
*/
|
|
63
|
+
minHeight: string
|
|
64
|
+
/**
|
|
53
65
|
* 打开弹框时触发
|
|
54
66
|
*/
|
|
55
67
|
onOpen: () => void
|
|
@@ -65,4 +77,16 @@ export interface BasePopup extends BaseProps, BaseOverlay {
|
|
|
65
77
|
* 点击关闭图标时触发
|
|
66
78
|
*/
|
|
67
79
|
onCloseIconClick: (e: any) => boolean | void
|
|
80
|
+
/**
|
|
81
|
+
* 滑动时触发
|
|
82
|
+
*/
|
|
83
|
+
onTouchMove: (height: number, e: any, direction: 'up' | 'down') => void
|
|
84
|
+
/**
|
|
85
|
+
* 开始触碰时触发
|
|
86
|
+
*/
|
|
87
|
+
onTouchStart: (height: number, e: any) => void
|
|
88
|
+
/**
|
|
89
|
+
* 结束触碰时触发
|
|
90
|
+
*/
|
|
91
|
+
onTouchEnd: (height: number, e: any) => void
|
|
68
92
|
}
|