@autobest-ui/components 2.3.0 → 2.5.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/esm/accordion/Item.js +6 -23
- package/esm/accordion/index.js +8 -36
- package/esm/affix/PortalAffix.js +7 -11
- package/esm/affix/index.js +30 -70
- package/esm/carousel/index.js +45 -141
- package/esm/checkbox/index.js +12 -37
- package/esm/collapse/index.js +11 -49
- package/esm/confirm/index.d.ts +8 -0
- package/esm/confirm/index.js +23 -31
- package/esm/date-picker/DateEnum.js +0 -3
- package/esm/date-picker/calendar/Day.js +62 -78
- package/esm/date-picker/calendar/MonthYear.js +20 -53
- package/esm/date-picker/calendar/grid/index.js +7 -12
- package/esm/date-picker/calendar/index.js +4 -31
- package/esm/date-picker/index.js +11 -51
- package/esm/date-picker/utils.js +6 -11
- package/esm/drawer/Child.js +10 -20
- package/esm/drawer/index.js +22 -71
- package/esm/ellipsis/index.js +9 -17
- package/esm/guide/index.js +25 -63
- package/esm/index.d.ts +2 -2
- package/esm/index.js +1 -1
- package/esm/input-number/ControlArrow.js +0 -2
- package/esm/input-number/constants.js +2 -2
- package/esm/input-number/index.js +26 -106
- package/esm/lazy-image/index.js +10 -55
- package/esm/link-list/index.js +11 -35
- package/esm/loading/index.js +15 -42
- package/esm/loading-container/index.js +3 -6
- package/esm/loading-icon/index.js +0 -2
- package/esm/mask/index.js +6 -9
- package/esm/message/index.d.ts +44 -7
- package/esm/message/index.js +96 -111
- package/esm/message/renderMessage.d.ts +17 -0
- package/esm/message/renderMessage.js +137 -0
- package/esm/message/style/index.css +1 -1
- package/esm/modal/Title.js +5 -12
- package/esm/modal/getPopupLocation.js +5 -7
- package/esm/modal/index.js +44 -125
- package/esm/move/index.js +32 -132
- package/esm/move/range.js +6 -12
- package/esm/move/utils.js +3 -10
- package/esm/popover/index.js +9 -28
- package/esm/portal/index.js +1 -22
- package/esm/script/index.js +19 -59
- package/esm/select/index.js +28 -106
- package/esm/show-more/index.js +40 -103
- package/esm/skeleton/Item.js +1 -3
- package/esm/skeleton/index.js +5 -11
- package/esm/style.css +1 -1
- package/esm/table/body/BodyRow.js +11 -28
- package/esm/table/body/CheckIcon.js +10 -18
- package/esm/table/body/index.js +8 -12
- package/esm/table/header/CheckIcon.js +3 -11
- package/esm/table/header/HeaderCell.js +12 -33
- package/esm/table/header/HeaderRow.js +6 -17
- package/esm/table/index.js +30 -100
- package/esm/tabs/index.js +35 -118
- package/esm/tooltip/index.js +0 -4
- package/esm/trigger/align.js +6 -6
- package/esm/trigger/bottomAlign.js +33 -45
- package/esm/trigger/constants.js +0 -1
- package/esm/trigger/getPopupLocation.js +48 -68
- package/esm/trigger/index.js +52 -187
- package/esm/trigger/leftAlign.js +33 -47
- package/esm/trigger/ref.js +2 -7
- package/esm/trigger/rightAlign.js +33 -45
- package/esm/trigger/topAlign.js +33 -45
- package/esm/trigger/utils.js +28 -45
- package/lib/accordion/Item.js +6 -27
- package/lib/accordion/index.js +8 -41
- package/lib/affix/PortalAffix.js +7 -17
- package/lib/affix/index.js +30 -75
- package/lib/carousel/index.js +45 -146
- package/lib/checkbox/index.js +12 -41
- package/lib/collapse/index.js +11 -53
- package/lib/confirm/index.d.ts +8 -0
- package/lib/confirm/index.js +23 -38
- package/lib/date-picker/DateEnum.js +0 -3
- package/lib/date-picker/calendar/Day.js +62 -87
- package/lib/date-picker/calendar/MonthYear.js +20 -62
- package/lib/date-picker/calendar/grid/index.js +7 -16
- package/lib/date-picker/calendar/index.js +4 -37
- package/lib/date-picker/index.js +9 -58
- package/lib/date-picker/utils.js +6 -26
- package/lib/drawer/Child.js +10 -25
- package/lib/drawer/index.js +22 -78
- package/lib/ellipsis/index.js +9 -23
- package/lib/guide/index.js +25 -71
- package/lib/index.d.ts +2 -2
- package/lib/index.js +12 -32
- package/lib/input-number/ControlArrow.js +0 -4
- package/lib/input-number/constants.js +2 -2
- package/lib/input-number/index.js +26 -114
- package/lib/lazy-image/index.js +10 -58
- package/lib/link-list/index.js +11 -40
- package/lib/loading/index.js +13 -48
- package/lib/loading-bar/index.js +0 -5
- package/lib/loading-container/index.js +3 -11
- package/lib/loading-icon/index.js +0 -7
- package/lib/mask/index.js +6 -17
- package/lib/message/index.d.ts +44 -7
- package/lib/message/index.js +97 -120
- package/lib/message/renderMessage.d.ts +17 -0
- package/lib/message/renderMessage.js +144 -0
- package/lib/message/style/index.css +1 -1
- package/lib/modal/Affix.js +0 -4
- package/lib/modal/Title.js +5 -15
- package/lib/modal/getPopupLocation.js +5 -9
- package/lib/modal/index.js +44 -135
- package/lib/move/index.js +32 -144
- package/lib/move/range.js +6 -14
- package/lib/move/utils.js +3 -12
- package/lib/popover/index.js +9 -33
- package/lib/portal/index.js +1 -25
- package/lib/script/index.js +19 -61
- package/lib/select/index.js +28 -113
- package/lib/show-more/index.js +40 -110
- package/lib/skeleton/Item.js +1 -8
- package/lib/skeleton/index.js +5 -16
- package/lib/style.css +1 -1
- package/lib/table/body/BodyRow.js +11 -33
- package/lib/table/body/CheckIcon.js +10 -22
- package/lib/table/body/index.js +8 -17
- package/lib/table/header/CheckIcon.js +3 -15
- package/lib/table/header/HeaderCell.js +12 -37
- package/lib/table/header/HeaderRow.js +6 -22
- package/lib/table/index.js +30 -107
- package/lib/tabs/index.js +35 -122
- package/lib/tooltip/index.js +0 -9
- package/lib/trigger/align.js +0 -4
- package/lib/trigger/bottomAlign.js +33 -48
- package/lib/trigger/constants.js +0 -2
- package/lib/trigger/getPopupLocation.js +48 -74
- package/lib/trigger/index.js +52 -198
- package/lib/trigger/leftAlign.js +33 -50
- package/lib/trigger/ref.js +2 -12
- package/lib/trigger/rightAlign.js +33 -48
- package/lib/trigger/topAlign.js +33 -48
- package/lib/trigger/utils.js +28 -53
- package/package.json +7 -3
package/esm/move/index.js
CHANGED
|
@@ -9,39 +9,29 @@ var __extends = this && this.__extends || function () {
|
|
|
9
9
|
if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p];
|
|
10
10
|
}
|
|
11
11
|
};
|
|
12
|
-
|
|
13
12
|
return _extendStatics(d, b);
|
|
14
13
|
};
|
|
15
|
-
|
|
16
14
|
return function (d, b) {
|
|
17
15
|
if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
18
|
-
|
|
19
16
|
_extendStatics(d, b);
|
|
20
|
-
|
|
21
17
|
function __() {
|
|
22
18
|
this.constructor = d;
|
|
23
19
|
}
|
|
24
|
-
|
|
25
20
|
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
26
21
|
};
|
|
27
22
|
}();
|
|
28
|
-
|
|
29
23
|
var __assign = this && this.__assign || function () {
|
|
30
24
|
__assign = Object.assign || function (t) {
|
|
31
25
|
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
32
26
|
s = arguments[i];
|
|
33
|
-
|
|
34
27
|
for (var p in s) {
|
|
35
28
|
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
36
29
|
}
|
|
37
30
|
}
|
|
38
|
-
|
|
39
31
|
return t;
|
|
40
32
|
};
|
|
41
|
-
|
|
42
33
|
return __assign.apply(this, arguments);
|
|
43
34
|
};
|
|
44
|
-
|
|
45
35
|
import React from 'react';
|
|
46
36
|
import * as ReactIs from 'react-is';
|
|
47
37
|
import classNames from 'classnames';
|
|
@@ -52,15 +42,10 @@ var defaultPosition = {
|
|
|
52
42
|
left: 0,
|
|
53
43
|
top: 0
|
|
54
44
|
};
|
|
55
|
-
|
|
56
|
-
var Move =
|
|
57
|
-
/** @class */
|
|
58
|
-
function (_super) {
|
|
45
|
+
var Move = /** @class */function (_super) {
|
|
59
46
|
__extends(Move, _super);
|
|
60
|
-
|
|
61
47
|
function Move() {
|
|
62
48
|
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
63
|
-
|
|
64
49
|
_this.prefixCls = 'ab-move';
|
|
65
50
|
_this.prevElementSize = {
|
|
66
51
|
width: 0,
|
|
@@ -82,41 +67,33 @@ function (_super) {
|
|
|
82
67
|
_this.currentScaleSize = 1;
|
|
83
68
|
_this.scaleStart = 0;
|
|
84
69
|
_this.scaleEnd = 0;
|
|
85
|
-
_this.isTouchScale = false;
|
|
86
|
-
|
|
70
|
+
_this.isTouchScale = false;
|
|
71
|
+
// 强制刷新元素位置
|
|
87
72
|
_this.isForceUpdatePlacement = false;
|
|
88
73
|
_this.moveRef = /*#__PURE__*/React.createRef();
|
|
89
74
|
_this.updateTimer = null;
|
|
90
|
-
|
|
91
75
|
_this.refreshInfo = function (el, prevProps) {
|
|
92
76
|
var element = el || _this.getDomNode();
|
|
93
|
-
|
|
94
77
|
if (!element) {
|
|
95
78
|
return;
|
|
96
79
|
}
|
|
97
|
-
|
|
98
80
|
var parentNode = element.parentNode;
|
|
99
|
-
|
|
100
81
|
if (!parentNode) {
|
|
101
82
|
return;
|
|
102
83
|
}
|
|
103
|
-
|
|
104
84
|
var elementSize = getElementSize(element);
|
|
105
85
|
_this.elementSize = {
|
|
106
86
|
width: elementSize.width,
|
|
107
87
|
height: elementSize.height
|
|
108
88
|
};
|
|
109
|
-
|
|
110
89
|
if (_this.elementSize.width !== _this.prevElementSize.width || _this.elementSize.height !== _this.prevElementSize.height) {
|
|
111
90
|
_this.isForceUpdatePlacement = true;
|
|
112
91
|
}
|
|
113
|
-
|
|
114
92
|
_this.prevElementSize = _this.elementSize;
|
|
115
93
|
_this.elementParentSize = getElementSize(parentNode, true);
|
|
116
94
|
var _a = _this.props,
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
95
|
+
horizontalPlacement = _a.horizontalPlacement,
|
|
96
|
+
verticalPlacement = _a.verticalPlacement;
|
|
120
97
|
if (!prevProps || _this.isForceUpdatePlacement || horizontalPlacement !== prevProps.horizontalPlacement || verticalPlacement !== prevProps.verticalPlacement) {
|
|
121
98
|
_this.currentObj = getInitElementPlacement({
|
|
122
99
|
horizontalPlacement: horizontalPlacement,
|
|
@@ -124,41 +101,32 @@ function (_super) {
|
|
|
124
101
|
elementSize: _this.elementSize,
|
|
125
102
|
elementParentSize: _this.elementParentSize
|
|
126
103
|
});
|
|
127
|
-
|
|
128
104
|
var _b = _this.checkRange(),
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
105
|
+
nextScaleSize = _b.nextScaleSize,
|
|
106
|
+
nextX = _b.nextX,
|
|
107
|
+
nextY = _b.nextY;
|
|
133
108
|
_this.currentObj = {
|
|
134
109
|
left: nextX,
|
|
135
110
|
top: nextY
|
|
136
111
|
};
|
|
137
112
|
_this.currentScaleSize = nextScaleSize;
|
|
138
|
-
|
|
139
113
|
_this.setElementInfo(element);
|
|
140
|
-
|
|
141
114
|
element.style.visibility = 'visible';
|
|
142
115
|
_this.isForceUpdatePlacement = false;
|
|
143
116
|
}
|
|
144
117
|
};
|
|
145
|
-
|
|
146
118
|
_this.resetTranslate = function (info) {
|
|
147
119
|
var element = _this.getDomNode();
|
|
148
|
-
|
|
149
120
|
if (isEmptyObject(info) || !element) {
|
|
150
121
|
return;
|
|
151
122
|
}
|
|
152
|
-
|
|
153
123
|
_this.currentObj = info;
|
|
154
124
|
element.style.transition = 'transform 200ms ease-in-out';
|
|
155
|
-
|
|
156
125
|
var _a = _this.checkRange(),
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
126
|
+
nextX = _a.nextX,
|
|
127
|
+
nextY = _a.nextY,
|
|
128
|
+
nextScaleSize = _a.nextScaleSize,
|
|
129
|
+
isRefresh = _a.isRefresh;
|
|
162
130
|
if (isRefresh) {
|
|
163
131
|
_this.currentObj = {
|
|
164
132
|
left: nextX,
|
|
@@ -166,51 +134,40 @@ function (_super) {
|
|
|
166
134
|
};
|
|
167
135
|
_this.currentScaleSize = nextScaleSize;
|
|
168
136
|
}
|
|
169
|
-
|
|
170
137
|
_this.setElementInfo(element);
|
|
171
138
|
};
|
|
172
|
-
|
|
173
139
|
_this.onMousewheel = function (event, element) {
|
|
174
140
|
if (event.preventDefault) {
|
|
175
141
|
event.preventDefault();
|
|
176
142
|
}
|
|
177
|
-
|
|
178
143
|
if (event.stopPropagation) {
|
|
179
144
|
event.stopPropagation();
|
|
180
145
|
}
|
|
181
|
-
|
|
182
146
|
var _a = _this.props,
|
|
183
|
-
|
|
184
|
-
|
|
147
|
+
maxScalable = _a.maxScalable,
|
|
148
|
+
minScalable = _a.minScalable;
|
|
185
149
|
var nextScaleSize = filterScaleRange(event.deltaY < 0 ? _this.currentScaleSize + 0.02 : _this.currentScaleSize - 0.02, maxScalable, minScalable);
|
|
186
|
-
|
|
187
150
|
if (_this.currentScaleSize === nextScaleSize || _this.currentScaleSize === nextScaleSize) {
|
|
188
151
|
return;
|
|
189
152
|
}
|
|
190
|
-
|
|
191
153
|
_this.currentScaleSize = nextScaleSize;
|
|
192
154
|
element.style.transition = 'transform 200ms';
|
|
193
|
-
|
|
194
155
|
_this.setElementInfo(element);
|
|
195
156
|
};
|
|
196
|
-
|
|
197
157
|
_this.onStart = function (event, element) {
|
|
198
158
|
if (event.preventDefault) {
|
|
199
159
|
event.preventDefault();
|
|
200
160
|
}
|
|
201
|
-
|
|
202
161
|
if (event.stopPropagation) {
|
|
203
162
|
event.stopPropagation();
|
|
204
163
|
}
|
|
205
|
-
|
|
206
164
|
_this.isTouchScale = false;
|
|
207
165
|
element.style.transition = '';
|
|
208
166
|
var isTouch = isTouchScreen();
|
|
209
167
|
_this.prevScaleSize = _this.currentScaleSize;
|
|
210
|
-
|
|
211
168
|
if (_this.props.scalable && isTouch && event.touches.length > 1) {
|
|
212
|
-
_this.isTouchScale = true;
|
|
213
|
-
|
|
169
|
+
_this.isTouchScale = true;
|
|
170
|
+
// 记录双指的间距长度
|
|
214
171
|
_this.scaleStart = getDistance(event.touches);
|
|
215
172
|
} else {
|
|
216
173
|
_this.moveObj = __assign({}, defaultPosition);
|
|
@@ -220,43 +177,34 @@ function (_super) {
|
|
|
220
177
|
top: event.touches ? event.touches[0].pageY : event.clientY
|
|
221
178
|
};
|
|
222
179
|
}
|
|
223
|
-
|
|
224
180
|
if (!_this.moveHandler) {
|
|
225
181
|
_this.moveHandler = addEventListener(window.document, isTouch ? 'touchmove' : 'mousemove', function (ev) {
|
|
226
182
|
return _this.onMove(ev, element);
|
|
227
183
|
});
|
|
228
184
|
}
|
|
229
|
-
|
|
230
185
|
if (!_this.endHandler) {
|
|
231
186
|
_this.endHandler = addEventListener(window.document, isTouch ? 'touchend' : 'mouseup', function (ev) {
|
|
232
187
|
return _this.onEnd(ev, element);
|
|
233
188
|
});
|
|
234
189
|
}
|
|
235
190
|
};
|
|
236
|
-
|
|
237
191
|
_this.onMove = function (event, element) {
|
|
238
192
|
if (event.preventDefault) {
|
|
239
193
|
event.preventDefault();
|
|
240
194
|
}
|
|
241
|
-
|
|
242
195
|
if (event.stopPropagation) {
|
|
243
196
|
event.stopPropagation();
|
|
244
197
|
}
|
|
245
|
-
|
|
246
198
|
if (_this.isTouchScale && event.touches.length > 1) {
|
|
247
|
-
_this.scaleEnd = getDistance(event.touches);
|
|
248
|
-
|
|
199
|
+
_this.scaleEnd = getDistance(event.touches);
|
|
200
|
+
// 设置缩放尺寸
|
|
249
201
|
_this.currentScaleSize = (_this.scaleEnd / _this.scaleStart - 1) / 2 + _this.prevScaleSize;
|
|
250
|
-
|
|
251
202
|
_this.setElementInfo(element);
|
|
252
|
-
|
|
253
203
|
return;
|
|
254
204
|
}
|
|
255
|
-
|
|
256
205
|
if (_this.isTouchScale && event.touches.length <= 1) {
|
|
257
206
|
return;
|
|
258
207
|
}
|
|
259
|
-
|
|
260
208
|
_this.moveObj = {
|
|
261
209
|
left: event.touches ? event.touches[0].pageX : event.clientX,
|
|
262
210
|
top: event.touches ? event.touches[0].pageY : event.clientY
|
|
@@ -265,27 +213,21 @@ function (_super) {
|
|
|
265
213
|
left: _this.prevObj.left + _this.moveObj.left - _this.startObj.left,
|
|
266
214
|
top: _this.prevObj.top + _this.moveObj.top - _this.startObj.top
|
|
267
215
|
};
|
|
268
|
-
|
|
269
216
|
_this.setElementInfo(element);
|
|
270
217
|
};
|
|
271
|
-
|
|
272
218
|
_this.onEnd = function (event, element) {
|
|
273
219
|
_this.clearHandler();
|
|
274
|
-
|
|
275
220
|
if (event.preventDefault) {
|
|
276
221
|
event.preventDefault();
|
|
277
222
|
}
|
|
278
|
-
|
|
279
223
|
if (event.stopPropagation) {
|
|
280
224
|
event.stopPropagation();
|
|
281
225
|
}
|
|
282
|
-
|
|
283
226
|
var _a = _this.checkRange(),
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
227
|
+
nextX = _a.nextX,
|
|
228
|
+
nextY = _a.nextY,
|
|
229
|
+
nextScaleSize = _a.nextScaleSize,
|
|
230
|
+
isRefresh = _a.isRefresh;
|
|
289
231
|
if (isRefresh) {
|
|
290
232
|
element.style.transition = 'transform 200ms ease-in-out';
|
|
291
233
|
_this.currentObj = {
|
|
@@ -293,93 +235,70 @@ function (_super) {
|
|
|
293
235
|
top: nextY
|
|
294
236
|
};
|
|
295
237
|
_this.currentScaleSize = nextScaleSize;
|
|
296
|
-
|
|
297
238
|
_this.setElementInfo(element);
|
|
298
239
|
}
|
|
299
|
-
|
|
300
240
|
var onClick = _this.props.onClick;
|
|
301
|
-
|
|
302
241
|
if (onClick && _this.currentObj.left === _this.prevObj.left && _this.currentObj.top === _this.prevObj.top && _this.prevScaleSize === _this.currentScaleSize) {
|
|
303
242
|
onClick(event);
|
|
304
243
|
}
|
|
305
244
|
};
|
|
306
|
-
|
|
307
245
|
_this.onTransitionEnd = function () {
|
|
308
246
|
var element = _this.getDomNode();
|
|
309
|
-
|
|
310
247
|
if (!element) {
|
|
311
248
|
return;
|
|
312
249
|
}
|
|
313
|
-
|
|
314
250
|
element.style.transition = '';
|
|
315
251
|
var _a = _this.props,
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
252
|
+
onAfterChange = _a.onAfterChange,
|
|
253
|
+
name = _a.name;
|
|
319
254
|
if (onAfterChange) {
|
|
320
255
|
onAfterChange(name);
|
|
321
256
|
}
|
|
322
257
|
};
|
|
323
|
-
|
|
324
258
|
return _this;
|
|
325
259
|
}
|
|
326
|
-
|
|
327
260
|
Move.prototype.componentDidMount = function () {
|
|
328
261
|
this.isForceUpdatePlacement = true;
|
|
329
262
|
this.componentDidUpdate();
|
|
330
263
|
};
|
|
331
|
-
|
|
332
264
|
Move.prototype.componentDidUpdate = function (prevProps) {
|
|
333
265
|
var _this = this;
|
|
334
|
-
|
|
335
266
|
clearTimeout(this.updateTimer);
|
|
336
267
|
var element = this.getDomNode();
|
|
337
|
-
|
|
338
268
|
if (!element) {
|
|
339
269
|
return;
|
|
340
270
|
}
|
|
341
|
-
|
|
342
271
|
var parentNode = element.parentNode;
|
|
343
|
-
|
|
344
272
|
if (!parentNode) {
|
|
345
273
|
return;
|
|
346
274
|
}
|
|
347
|
-
|
|
348
275
|
parentNode.style.overflow = 'hidden';
|
|
349
276
|
var _a = this.props,
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
277
|
+
horizontalPlacement = _a.horizontalPlacement,
|
|
278
|
+
verticalPlacement = _a.verticalPlacement;
|
|
353
279
|
if (prevProps && (horizontalPlacement !== prevProps.horizontalPlacement || verticalPlacement !== prevProps.verticalPlacement)) {
|
|
354
280
|
this.isForceUpdatePlacement = true;
|
|
355
281
|
}
|
|
356
|
-
|
|
357
282
|
this.updateTimer = setTimeout(function () {
|
|
358
283
|
var currentElement = _this.getDomNode();
|
|
359
|
-
|
|
360
284
|
if (!currentElement) {
|
|
361
285
|
return;
|
|
362
286
|
}
|
|
363
|
-
|
|
364
287
|
_this.refreshInfo(currentElement, prevProps);
|
|
365
|
-
|
|
366
288
|
var isTouch = isTouchScreen();
|
|
367
|
-
|
|
368
289
|
if (!_this.startHandler) {
|
|
369
290
|
var eventType = isTouch ? 'touchstart' : 'mousedown';
|
|
370
291
|
_this.startHandler = addEventListener(currentElement, eventType, function (ev) {
|
|
371
292
|
return _this.onStart(ev, currentElement);
|
|
372
293
|
});
|
|
373
|
-
}
|
|
374
|
-
|
|
375
|
-
|
|
294
|
+
}
|
|
295
|
+
// 不支持Touch的设备监听滚动
|
|
376
296
|
if (_this.props.scalable && !isTouch && !_this.mousewheelHandler) {
|
|
377
297
|
_this.mousewheelHandler = addEventListener(currentElement, 'wheel', function (ev) {
|
|
378
298
|
return _this.onMousewheel(ev, currentElement);
|
|
379
299
|
});
|
|
380
|
-
}
|
|
381
|
-
|
|
382
|
-
|
|
300
|
+
}
|
|
301
|
+
// 加入 resize 监听
|
|
383
302
|
if (_this.props.monitorWindowResize && !_this.resizeHandler) {
|
|
384
303
|
_this.resizeHandler = addEventListener(window, 'resize', throttleWithRAF(function () {
|
|
385
304
|
return _this.refreshInfo(currentElement, prevProps);
|
|
@@ -388,51 +307,40 @@ function (_super) {
|
|
|
388
307
|
}, 0);
|
|
389
308
|
this.clearHandler();
|
|
390
309
|
};
|
|
391
|
-
|
|
392
310
|
Move.prototype.componentWillUnmount = function () {
|
|
393
311
|
clearTimeout(this.updateTimer);
|
|
394
|
-
|
|
395
312
|
if (this.startHandler) {
|
|
396
313
|
this.startHandler.remove();
|
|
397
314
|
this.startHandler = null;
|
|
398
315
|
}
|
|
399
|
-
|
|
400
316
|
if (this.mousewheelHandler) {
|
|
401
317
|
this.mousewheelHandler.remove();
|
|
402
318
|
this.mousewheelHandler = null;
|
|
403
319
|
}
|
|
404
|
-
|
|
405
320
|
if (this.resizeHandler) {
|
|
406
321
|
this.resizeHandler.remove();
|
|
407
322
|
this.resizeHandler = null;
|
|
408
323
|
}
|
|
409
|
-
|
|
410
324
|
this.clearHandler();
|
|
411
325
|
};
|
|
412
|
-
|
|
413
326
|
Move.prototype.clearHandler = function () {
|
|
414
327
|
if (this.moveHandler) {
|
|
415
328
|
this.moveHandler.remove();
|
|
416
329
|
this.moveHandler = null;
|
|
417
330
|
}
|
|
418
|
-
|
|
419
331
|
if (this.endHandler) {
|
|
420
332
|
this.endHandler.remove();
|
|
421
333
|
this.endHandler = null;
|
|
422
334
|
}
|
|
423
335
|
};
|
|
424
|
-
|
|
425
336
|
Move.prototype.checkRange = function () {
|
|
426
337
|
var nextScaleSize = this.currentScaleSize;
|
|
427
|
-
|
|
428
338
|
if (this.props.scalable) {
|
|
429
339
|
nextScaleSize = filterScaleRange(nextScaleSize, this.props.maxScalable, this.props.minScalable);
|
|
430
340
|
}
|
|
431
|
-
|
|
432
341
|
var _a = filterPositionRange(this.currentObj, this.elementSize, this.elementParentSize, nextScaleSize),
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
342
|
+
left = _a.left,
|
|
343
|
+
top = _a.top;
|
|
436
344
|
return {
|
|
437
345
|
isRefresh: left !== this.currentObj.left || top !== this.currentObj.top || nextScaleSize !== this.currentScaleSize,
|
|
438
346
|
nextX: left,
|
|
@@ -440,23 +348,18 @@ function (_super) {
|
|
|
440
348
|
nextScaleSize: nextScaleSize
|
|
441
349
|
};
|
|
442
350
|
};
|
|
443
|
-
|
|
444
351
|
Move.prototype.setElementInfo = function (element) {
|
|
445
352
|
element.style.transform = "translate(".concat(this.currentObj.left, "px, ").concat(this.currentObj.top, "px) scale(").concat(this.currentScaleSize, ")");
|
|
446
353
|
};
|
|
447
|
-
|
|
448
354
|
Move.prototype.getDomNode = function () {
|
|
449
355
|
if (this.moveRef && this.moveRef.current) {
|
|
450
356
|
return this.moveRef.current;
|
|
451
357
|
}
|
|
452
|
-
|
|
453
358
|
return null;
|
|
454
359
|
};
|
|
455
|
-
|
|
456
360
|
Move.prototype.render = function () {
|
|
457
361
|
var children = this.props.children;
|
|
458
362
|
var child = React.Children.only(children);
|
|
459
|
-
|
|
460
363
|
if (ReactIs.isElement(child) && !ReactIs.isFragment(child)) {
|
|
461
364
|
return /*#__PURE__*/React.cloneElement(child, {
|
|
462
365
|
ref: this.moveRef,
|
|
@@ -464,10 +367,8 @@ function (_super) {
|
|
|
464
367
|
className: classNames(this.prefixCls, child.props.className)
|
|
465
368
|
});
|
|
466
369
|
}
|
|
467
|
-
|
|
468
370
|
throw new Error('Move component only support HTMLElement!');
|
|
469
371
|
};
|
|
470
|
-
|
|
471
372
|
Move.defaultProps = {
|
|
472
373
|
scalable: true,
|
|
473
374
|
monitorWindowResize: true,
|
|
@@ -478,5 +379,4 @@ function (_super) {
|
|
|
478
379
|
};
|
|
479
380
|
return Move;
|
|
480
381
|
}(React.Component);
|
|
481
|
-
|
|
482
382
|
export default Move;
|
package/esm/move/range.js
CHANGED
|
@@ -1,37 +1,32 @@
|
|
|
1
1
|
function getPositionValue(pValue, cValue, prevValue, scaleSize) {
|
|
2
|
-
var cScaleValue = cValue * scaleSize;
|
|
3
|
-
|
|
4
|
-
var scaleOverValue = (cScaleValue - cValue) / 2;
|
|
5
|
-
|
|
2
|
+
var cScaleValue = cValue * scaleSize;
|
|
3
|
+
// 内容缩放后扩展的一半
|
|
4
|
+
var scaleOverValue = (cScaleValue - cValue) / 2;
|
|
5
|
+
// 内容小于或等于父级时,滑动不能超出
|
|
6
6
|
if (pValue >= cScaleValue) {
|
|
7
7
|
// 不能超出左边/上边
|
|
8
8
|
if (prevValue < scaleOverValue) {
|
|
9
9
|
return scaleOverValue;
|
|
10
10
|
}
|
|
11
|
-
|
|
12
11
|
if (prevValue + cScaleValue - scaleOverValue > pValue) {
|
|
13
12
|
// 不能超出右边/下边
|
|
14
13
|
return pValue - cScaleValue + scaleOverValue;
|
|
15
14
|
}
|
|
16
|
-
}
|
|
15
|
+
}
|
|
16
|
+
// 内容大于父级时,
|
|
17
17
|
// 滑动时,左边/上边只能滑动到内容最左边/上边, 右边/下边可以滑动到内容最右边/下边
|
|
18
|
-
|
|
19
|
-
|
|
20
18
|
if (pValue < cScaleValue) {
|
|
21
19
|
// 左边只能滑动到内容最左边/上边
|
|
22
20
|
if (prevValue > scaleOverValue) {
|
|
23
21
|
return scaleOverValue;
|
|
24
22
|
}
|
|
25
|
-
|
|
26
23
|
if (Math.abs(prevValue) + pValue + scaleOverValue > cScaleValue) {
|
|
27
24
|
// 右边可以滑动到内容最右边/下边
|
|
28
25
|
return pValue - cScaleValue + scaleOverValue;
|
|
29
26
|
}
|
|
30
27
|
}
|
|
31
|
-
|
|
32
28
|
return prevValue;
|
|
33
29
|
}
|
|
34
|
-
|
|
35
30
|
export function filterPositionRange(positionInfo, cSize, pSize, scaleSize) {
|
|
36
31
|
return {
|
|
37
32
|
left: getPositionValue(pSize.width, cSize.width, positionInfo.left, scaleSize),
|
|
@@ -44,6 +39,5 @@ export function filterScaleRange(nextScaleSize, maxScalable, minScalable) {
|
|
|
44
39
|
} else if (nextScaleSize < minScalable) {
|
|
45
40
|
nextScaleSize = minScalable;
|
|
46
41
|
}
|
|
47
|
-
|
|
48
42
|
return nextScaleSize;
|
|
49
43
|
}
|
package/esm/move/utils.js
CHANGED
|
@@ -11,38 +11,31 @@ export function getDistance(touches) {
|
|
|
11
11
|
}
|
|
12
12
|
export function getInitElementPlacement(_a) {
|
|
13
13
|
var elementSize = _a.elementSize,
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
14
|
+
elementParentSize = _a.elementParentSize,
|
|
15
|
+
horizontalPlacement = _a.horizontalPlacement,
|
|
16
|
+
verticalPlacement = _a.verticalPlacement;
|
|
17
17
|
var translateX = 0;
|
|
18
18
|
var translateY = 0;
|
|
19
|
-
|
|
20
19
|
switch (horizontalPlacement) {
|
|
21
20
|
case 'center':
|
|
22
21
|
translateX = (elementParentSize.width - elementSize.width) / 2;
|
|
23
22
|
break;
|
|
24
|
-
|
|
25
23
|
case 'right':
|
|
26
24
|
translateX = elementParentSize.width - elementSize.width;
|
|
27
25
|
break;
|
|
28
|
-
|
|
29
26
|
default:
|
|
30
27
|
translateX = 0;
|
|
31
28
|
}
|
|
32
|
-
|
|
33
29
|
switch (verticalPlacement) {
|
|
34
30
|
case 'center':
|
|
35
31
|
translateY = (elementParentSize.height - elementSize.height) / 2;
|
|
36
32
|
break;
|
|
37
|
-
|
|
38
33
|
case 'bottom':
|
|
39
34
|
translateY = elementParentSize.height - elementSize.height;
|
|
40
35
|
break;
|
|
41
|
-
|
|
42
36
|
default:
|
|
43
37
|
translateY = 0;
|
|
44
38
|
}
|
|
45
|
-
|
|
46
39
|
return {
|
|
47
40
|
left: translateX,
|
|
48
41
|
top: translateY
|
package/esm/popover/index.js
CHANGED
|
@@ -2,75 +2,58 @@ var __assign = this && this.__assign || function () {
|
|
|
2
2
|
__assign = Object.assign || function (t) {
|
|
3
3
|
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
4
|
s = arguments[i];
|
|
5
|
-
|
|
6
5
|
for (var p in s) {
|
|
7
6
|
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
8
7
|
}
|
|
9
8
|
}
|
|
10
|
-
|
|
11
9
|
return t;
|
|
12
10
|
};
|
|
13
|
-
|
|
14
11
|
return __assign.apply(this, arguments);
|
|
15
12
|
};
|
|
16
|
-
|
|
17
13
|
import React from 'react';
|
|
18
14
|
import classNames from 'classnames';
|
|
19
15
|
import Trigger from '../trigger';
|
|
20
16
|
var prefixCls = 'ab-popover';
|
|
21
|
-
|
|
22
17
|
function Popover(props) {
|
|
23
18
|
var _a;
|
|
24
|
-
|
|
25
19
|
var triggerEl = React.useRef(null);
|
|
26
|
-
|
|
27
20
|
var _b = React.useState({}),
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
21
|
+
arrowStyle = _b[0],
|
|
22
|
+
setState = _b[1];
|
|
31
23
|
var cls = props.prefixCls || prefixCls;
|
|
32
|
-
|
|
33
24
|
var onHidePopup = function onHidePopup() {
|
|
34
25
|
if (triggerEl.current && triggerEl.current.hidePopup) {
|
|
35
26
|
triggerEl.current.hidePopup();
|
|
36
27
|
}
|
|
37
28
|
};
|
|
38
|
-
|
|
39
29
|
var onArrowStyleChange = function onArrowStyleChange(value) {
|
|
40
30
|
if (props.hiddenArrow) {
|
|
41
31
|
return;
|
|
42
32
|
}
|
|
43
|
-
|
|
44
33
|
setState(value);
|
|
45
34
|
};
|
|
46
|
-
|
|
47
35
|
var hiddenClose = props.hiddenClose,
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
36
|
+
closeIcon = props.closeIcon,
|
|
37
|
+
closeClassName = props.closeClassName,
|
|
38
|
+
innerClassName = props.innerClassName,
|
|
39
|
+
tip = props.tip,
|
|
40
|
+
arrowClassName = props.arrowClassName;
|
|
54
41
|
function renderClose() {
|
|
55
42
|
if (hiddenClose) {
|
|
56
43
|
return null;
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
|
|
44
|
+
}
|
|
45
|
+
// 当有自定义的icon时,直接使用,样式需要完全自定义
|
|
60
46
|
if (closeIcon) {
|
|
61
47
|
return /*#__PURE__*/React.cloneElement(closeIcon, {
|
|
62
48
|
onClick: onHidePopup
|
|
63
49
|
});
|
|
64
50
|
}
|
|
65
|
-
|
|
66
51
|
return /*#__PURE__*/React.createElement("i", {
|
|
67
52
|
className: classNames("".concat(cls, "-close"), closeClassName),
|
|
68
53
|
onClick: onHidePopup
|
|
69
54
|
}, "\xD7");
|
|
70
55
|
}
|
|
71
|
-
|
|
72
56
|
var innerClass = classNames("".concat(cls, "-inner"), innerClassName, (_a = {}, _a["".concat(cls, "-inner-expand")] = !hiddenClose, _a));
|
|
73
|
-
|
|
74
57
|
function renderPopup() {
|
|
75
58
|
return /*#__PURE__*/React.createElement(React.Fragment, null, renderClose(), props.hiddenArrow ? null : /*#__PURE__*/React.createElement("i", {
|
|
76
59
|
className: classNames("".concat(cls, "-arrow"), arrowClassName),
|
|
@@ -79,7 +62,6 @@ function Popover(props) {
|
|
|
79
62
|
className: innerClass
|
|
80
63
|
}, tip));
|
|
81
64
|
}
|
|
82
|
-
|
|
83
65
|
return /*#__PURE__*/React.createElement(Trigger, __assign({}, props, {
|
|
84
66
|
wrapClassName: classNames("".concat(cls, "-wrap "), props.wrapClassName),
|
|
85
67
|
ref: triggerEl,
|
|
@@ -87,7 +69,6 @@ function Popover(props) {
|
|
|
87
69
|
onArrowStyleChange: onArrowStyleChange
|
|
88
70
|
}), props.children);
|
|
89
71
|
}
|
|
90
|
-
|
|
91
72
|
Popover.defaultProps = {
|
|
92
73
|
hiddenClose: true,
|
|
93
74
|
hiddenArrow: false
|