@tamagui/react-native-use-pressable 2.0.0-rc.4 → 2.0.0-rc.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/PressResponder.cjs +289 -149
- package/dist/cjs/PressResponder.native.js +431 -275
- package/dist/cjs/PressResponder.native.js.map +1 -1
- package/dist/cjs/index.cjs +38 -29
- package/dist/cjs/index.native.js +35 -28
- package/dist/cjs/index.native.js.map +1 -1
- package/dist/esm/PressResponder.mjs +277 -139
- package/dist/esm/PressResponder.mjs.map +1 -1
- package/dist/esm/PressResponder.native.js +419 -265
- package/dist/esm/PressResponder.native.js.map +1 -1
- package/dist/esm/index.js +14 -9
- package/dist/esm/index.js.map +1 -6
- package/dist/esm/index.mjs +12 -5
- package/dist/esm/index.mjs.map +1 -1
- package/dist/esm/index.native.js +9 -4
- package/dist/esm/index.native.js.map +1 -1
- package/package.json +5 -8
- package/dist/cjs/PressResponder.js +0 -234
- package/dist/cjs/PressResponder.js.map +0 -6
- package/dist/cjs/index.js +0 -39
- package/dist/cjs/index.js.map +0 -6
- package/dist/esm/PressResponder.js +0 -218
- package/dist/esm/PressResponder.js.map +0 -6
|
@@ -1,307 +1,461 @@
|
|
|
1
1
|
function _class_call_check(instance, Constructor) {
|
|
2
|
-
if (!(instance instanceof Constructor))
|
|
2
|
+
if (!(instance instanceof Constructor)) {
|
|
3
|
+
throw new TypeError("Cannot call a class as a function");
|
|
4
|
+
}
|
|
3
5
|
}
|
|
4
6
|
function _defineProperties(target, props) {
|
|
5
7
|
for (var i = 0; i < props.length; i++) {
|
|
6
8
|
var descriptor = props[i];
|
|
7
|
-
descriptor.enumerable = descriptor.enumerable ||
|
|
9
|
+
descriptor.enumerable = descriptor.enumerable || false;
|
|
10
|
+
descriptor.configurable = true;
|
|
11
|
+
if ("value" in descriptor) descriptor.writable = true;
|
|
12
|
+
Object.defineProperty(target, descriptor.key, descriptor);
|
|
8
13
|
}
|
|
9
14
|
}
|
|
10
15
|
function _create_class(Constructor, protoProps, staticProps) {
|
|
11
|
-
|
|
16
|
+
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
|
|
17
|
+
if (staticProps) _defineProperties(Constructor, staticProps);
|
|
18
|
+
return Constructor;
|
|
12
19
|
}
|
|
13
20
|
function _define_property(obj, key, value) {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
21
|
+
if (key in obj) {
|
|
22
|
+
Object.defineProperty(obj, key, {
|
|
23
|
+
value,
|
|
24
|
+
enumerable: true,
|
|
25
|
+
configurable: true,
|
|
26
|
+
writable: true
|
|
27
|
+
});
|
|
28
|
+
} else {
|
|
29
|
+
obj[key] = value;
|
|
30
|
+
}
|
|
31
|
+
return obj;
|
|
20
32
|
}
|
|
21
|
-
var DELAY = "DELAY"
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
},
|
|
39
|
-
RESPONDER_INACTIVE_PRESS_START: {
|
|
40
|
-
DELAY: RESPONDER_ACTIVE_PRESS_START,
|
|
41
|
-
RESPONDER_GRANT: ERROR,
|
|
42
|
-
RESPONDER_RELEASE: NOT_RESPONDER,
|
|
43
|
-
RESPONDER_TERMINATED: NOT_RESPONDER,
|
|
44
|
-
LONG_PRESS_DETECTED: ERROR
|
|
45
|
-
},
|
|
46
|
-
RESPONDER_ACTIVE_PRESS_START: {
|
|
47
|
-
DELAY: ERROR,
|
|
48
|
-
RESPONDER_GRANT: ERROR,
|
|
49
|
-
RESPONDER_RELEASE: NOT_RESPONDER,
|
|
50
|
-
RESPONDER_TERMINATED: NOT_RESPONDER,
|
|
51
|
-
LONG_PRESS_DETECTED: RESPONDER_ACTIVE_LONG_PRESS_START
|
|
52
|
-
},
|
|
53
|
-
RESPONDER_ACTIVE_LONG_PRESS_START: {
|
|
54
|
-
DELAY: ERROR,
|
|
55
|
-
RESPONDER_GRANT: ERROR,
|
|
56
|
-
RESPONDER_RELEASE: NOT_RESPONDER,
|
|
57
|
-
RESPONDER_TERMINATED: NOT_RESPONDER,
|
|
58
|
-
LONG_PRESS_DETECTED: RESPONDER_ACTIVE_LONG_PRESS_START
|
|
59
|
-
},
|
|
60
|
-
ERROR: {
|
|
61
|
-
DELAY: NOT_RESPONDER,
|
|
62
|
-
RESPONDER_GRANT: RESPONDER_INACTIVE_PRESS_START,
|
|
63
|
-
RESPONDER_RELEASE: NOT_RESPONDER,
|
|
64
|
-
RESPONDER_TERMINATED: NOT_RESPONDER,
|
|
65
|
-
LONG_PRESS_DETECTED: NOT_RESPONDER
|
|
66
|
-
}
|
|
67
|
-
}),
|
|
68
|
-
isActiveSignal = function (signal) {
|
|
69
|
-
return signal === RESPONDER_ACTIVE_PRESS_START || signal === RESPONDER_ACTIVE_LONG_PRESS_START;
|
|
33
|
+
var DELAY = "DELAY";
|
|
34
|
+
var ERROR = "ERROR";
|
|
35
|
+
var LONG_PRESS_DETECTED = "LONG_PRESS_DETECTED";
|
|
36
|
+
var NOT_RESPONDER = "NOT_RESPONDER";
|
|
37
|
+
var RESPONDER_ACTIVE_LONG_PRESS_START = "RESPONDER_ACTIVE_LONG_PRESS_START";
|
|
38
|
+
var RESPONDER_ACTIVE_PRESS_START = "RESPONDER_ACTIVE_PRESS_START";
|
|
39
|
+
var RESPONDER_INACTIVE_PRESS_START = "RESPONDER_INACTIVE_PRESS_START";
|
|
40
|
+
var RESPONDER_GRANT = "RESPONDER_GRANT";
|
|
41
|
+
var RESPONDER_RELEASE = "RESPONDER_RELEASE";
|
|
42
|
+
var RESPONDER_TERMINATED = "RESPONDER_TERMINATED";
|
|
43
|
+
var Transitions = Object.freeze({
|
|
44
|
+
NOT_RESPONDER: {
|
|
45
|
+
DELAY: ERROR,
|
|
46
|
+
RESPONDER_GRANT: RESPONDER_INACTIVE_PRESS_START,
|
|
47
|
+
RESPONDER_RELEASE: ERROR,
|
|
48
|
+
RESPONDER_TERMINATED: ERROR,
|
|
49
|
+
LONG_PRESS_DETECTED: ERROR
|
|
70
50
|
},
|
|
71
|
-
|
|
72
|
-
|
|
51
|
+
RESPONDER_INACTIVE_PRESS_START: {
|
|
52
|
+
DELAY: RESPONDER_ACTIVE_PRESS_START,
|
|
53
|
+
RESPONDER_GRANT: ERROR,
|
|
54
|
+
RESPONDER_RELEASE: NOT_RESPONDER,
|
|
55
|
+
RESPONDER_TERMINATED: NOT_RESPONDER,
|
|
56
|
+
LONG_PRESS_DETECTED: ERROR
|
|
73
57
|
},
|
|
74
|
-
|
|
75
|
-
|
|
58
|
+
RESPONDER_ACTIVE_PRESS_START: {
|
|
59
|
+
DELAY: ERROR,
|
|
60
|
+
RESPONDER_GRANT: ERROR,
|
|
61
|
+
RESPONDER_RELEASE: NOT_RESPONDER,
|
|
62
|
+
RESPONDER_TERMINATED: NOT_RESPONDER,
|
|
63
|
+
LONG_PRESS_DETECTED: RESPONDER_ACTIVE_LONG_PRESS_START
|
|
76
64
|
},
|
|
77
|
-
|
|
78
|
-
|
|
65
|
+
RESPONDER_ACTIVE_LONG_PRESS_START: {
|
|
66
|
+
DELAY: ERROR,
|
|
67
|
+
RESPONDER_GRANT: ERROR,
|
|
68
|
+
RESPONDER_RELEASE: NOT_RESPONDER,
|
|
69
|
+
RESPONDER_TERMINATED: NOT_RESPONDER,
|
|
70
|
+
LONG_PRESS_DETECTED: RESPONDER_ACTIVE_LONG_PRESS_START
|
|
79
71
|
},
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
72
|
+
ERROR: {
|
|
73
|
+
DELAY: NOT_RESPONDER,
|
|
74
|
+
RESPONDER_GRANT: RESPONDER_INACTIVE_PRESS_START,
|
|
75
|
+
RESPONDER_RELEASE: NOT_RESPONDER,
|
|
76
|
+
RESPONDER_TERMINATED: NOT_RESPONDER,
|
|
77
|
+
LONG_PRESS_DETECTED: NOT_RESPONDER
|
|
78
|
+
}
|
|
79
|
+
});
|
|
80
|
+
var isActiveSignal = function (signal) {
|
|
81
|
+
return signal === RESPONDER_ACTIVE_PRESS_START || signal === RESPONDER_ACTIVE_LONG_PRESS_START;
|
|
82
|
+
};
|
|
83
|
+
var isButtonRole = function (element) {
|
|
84
|
+
return element.getAttribute("role") === "button";
|
|
85
|
+
};
|
|
86
|
+
var isPressStartSignal = function (signal) {
|
|
87
|
+
return signal === RESPONDER_INACTIVE_PRESS_START || signal === RESPONDER_ACTIVE_PRESS_START || signal === RESPONDER_ACTIVE_LONG_PRESS_START;
|
|
88
|
+
};
|
|
89
|
+
var isTerminalSignal = function (signal) {
|
|
90
|
+
return signal === RESPONDER_TERMINATED || signal === RESPONDER_RELEASE;
|
|
91
|
+
};
|
|
92
|
+
var isValidKeyPress = function (event) {
|
|
93
|
+
var key = event.key;
|
|
94
|
+
var target = event.target;
|
|
95
|
+
var role = target.getAttribute("role");
|
|
96
|
+
var isSpacebar = key === " " || key === "Spacebar";
|
|
97
|
+
return key === "Enter" || isSpacebar && role === "button";
|
|
98
|
+
};
|
|
99
|
+
var DEFAULT_LONG_PRESS_DELAY_MS = 450;
|
|
100
|
+
var DEFAULT_PRESS_DELAY_MS = 50;
|
|
101
|
+
var PressResponder = /* @__PURE__ */function () {
|
|
102
|
+
"use strict";
|
|
91
103
|
|
|
92
|
-
|
|
93
|
-
|
|
104
|
+
function PressResponder2(config) {
|
|
105
|
+
_class_call_check(this, PressResponder2);
|
|
106
|
+
_define_property(this, "_touchActivatePosition", null);
|
|
107
|
+
_define_property(this, "_pressDelayTimeout", 0);
|
|
108
|
+
_define_property(this, "_selectionTerminated", false);
|
|
109
|
+
_define_property(this, "_isPointerTouch", false);
|
|
110
|
+
_define_property(this, "_longPressDelayTimeout", 0);
|
|
111
|
+
_define_property(this, "_longPressDispatched", false);
|
|
112
|
+
_define_property(this, "_pressOutDelayTimeout", 0);
|
|
113
|
+
_define_property(this, "_touchState", NOT_RESPONDER);
|
|
114
|
+
_define_property(this, "_config", null);
|
|
115
|
+
_define_property(this, "_eventHandlers", null);
|
|
116
|
+
this.configure(config);
|
|
117
|
+
}
|
|
118
|
+
_create_class(PressResponder2, [{
|
|
119
|
+
key: "configure",
|
|
120
|
+
value: function configure(config) {
|
|
121
|
+
this._config = config;
|
|
94
122
|
}
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
value: function () {
|
|
114
|
-
return this._eventHandlers == null && (this._eventHandlers = this._createEventHandlers()), this._eventHandlers;
|
|
123
|
+
}, {
|
|
124
|
+
/**
|
|
125
|
+
* Resets any pending timers. This should be called on unmount.
|
|
126
|
+
*/
|
|
127
|
+
key: "reset",
|
|
128
|
+
value: function reset() {
|
|
129
|
+
this._cancelLongPressDelayTimeout();
|
|
130
|
+
this._cancelPressDelayTimeout();
|
|
131
|
+
this._cancelPressOutDelayTimeout();
|
|
132
|
+
}
|
|
133
|
+
}, {
|
|
134
|
+
/**
|
|
135
|
+
* Returns a set of props to spread into the interactive element.
|
|
136
|
+
*/
|
|
137
|
+
key: "getEventHandlers",
|
|
138
|
+
value: function getEventHandlers() {
|
|
139
|
+
if (this._eventHandlers == null) {
|
|
140
|
+
this._eventHandlers = this._createEventHandlers();
|
|
115
141
|
}
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
142
|
+
return this._eventHandlers;
|
|
143
|
+
}
|
|
144
|
+
}, {
|
|
145
|
+
key: "_createEventHandlers",
|
|
146
|
+
value: function _createEventHandlers() {
|
|
147
|
+
var _this = this;
|
|
148
|
+
var start = function (event, shouldDelay) {
|
|
149
|
+
event.persist();
|
|
150
|
+
_this._cancelPressOutDelayTimeout();
|
|
151
|
+
_this._longPressDispatched = false;
|
|
152
|
+
_this._selectionTerminated = false;
|
|
153
|
+
_this._touchState = NOT_RESPONDER;
|
|
154
|
+
_this._isPointerTouch = event.nativeEvent.type === "touchstart";
|
|
155
|
+
_this._receiveSignal(RESPONDER_GRANT, event);
|
|
156
|
+
var delayPressStart = normalizeDelay(_this._config.delayPressStart, 0, DEFAULT_PRESS_DELAY_MS);
|
|
157
|
+
if (shouldDelay !== false && delayPressStart > 0) {
|
|
158
|
+
_this._pressDelayTimeout = setTimeout(function () {
|
|
159
|
+
_this._receiveSignal(DELAY, event);
|
|
160
|
+
}, delayPressStart);
|
|
161
|
+
} else {
|
|
162
|
+
_this._receiveSignal(DELAY, event);
|
|
163
|
+
}
|
|
164
|
+
var delayLongPress = normalizeDelay(_this._config.delayLongPress, 10, DEFAULT_LONG_PRESS_DELAY_MS);
|
|
165
|
+
_this._longPressDelayTimeout = setTimeout(function () {
|
|
166
|
+
_this._handleLongPress(event);
|
|
167
|
+
}, delayLongPress + delayPressStart);
|
|
168
|
+
};
|
|
169
|
+
var end = function (event) {
|
|
170
|
+
_this._receiveSignal(RESPONDER_RELEASE, event);
|
|
171
|
+
};
|
|
172
|
+
var keyupHandler = function (event) {
|
|
173
|
+
var onPress = _this._config.onPress;
|
|
174
|
+
var target = event.target;
|
|
175
|
+
if (_this._touchState !== NOT_RESPONDER && isValidKeyPress(event)) {
|
|
176
|
+
end(event);
|
|
177
|
+
document.removeEventListener("keyup", keyupHandler);
|
|
178
|
+
var role = target.getAttribute("role");
|
|
179
|
+
var elementType = target.tagName.toLowerCase();
|
|
180
|
+
var isNativeInteractiveElement = role === "link" || elementType === "a" || elementType === "button" || elementType === "input" || elementType === "select" || elementType === "textarea";
|
|
181
|
+
if (onPress != null && !isNativeInteractiveElement) {
|
|
182
|
+
onPress(event);
|
|
183
|
+
}
|
|
184
|
+
}
|
|
185
|
+
};
|
|
186
|
+
return {
|
|
187
|
+
onStartShouldSetResponder: function (event) {
|
|
188
|
+
var disabled = _this._config.disabled;
|
|
189
|
+
if (disabled && isButtonRole(event.currentTarget)) {
|
|
190
|
+
event.stopPropagation();
|
|
191
|
+
}
|
|
192
|
+
if (disabled == null) {
|
|
193
|
+
return true;
|
|
194
|
+
}
|
|
195
|
+
return !disabled;
|
|
196
|
+
},
|
|
197
|
+
onKeyDown: function (event) {
|
|
198
|
+
var disabled = _this._config.disabled;
|
|
199
|
+
var key = event.key;
|
|
200
|
+
var target = event.target;
|
|
201
|
+
if (!disabled && isValidKeyPress(event)) {
|
|
202
|
+
if (_this._touchState === NOT_RESPONDER) {
|
|
203
|
+
start(event, false);
|
|
204
|
+
document.addEventListener("keyup", keyupHandler);
|
|
205
|
+
}
|
|
206
|
+
var role = target.getAttribute("role");
|
|
207
|
+
var isSpacebarKey = key === " " || key === "Spacebar";
|
|
208
|
+
var _isButtonRole = role === "button" || role === "menuitem";
|
|
209
|
+
if (isSpacebarKey && _isButtonRole) {
|
|
210
|
+
event.preventDefault();
|
|
211
|
+
}
|
|
212
|
+
event.stopPropagation();
|
|
213
|
+
}
|
|
214
|
+
},
|
|
215
|
+
onResponderGrant: function (event) {
|
|
216
|
+
return start(event);
|
|
217
|
+
},
|
|
218
|
+
onResponderMove: function (event) {
|
|
219
|
+
if (_this._config.onPressMove != null) {
|
|
220
|
+
_this._config.onPressMove(event);
|
|
221
|
+
}
|
|
222
|
+
var touch = getTouchFromResponderEvent(event);
|
|
223
|
+
if (_this._touchActivatePosition != null) {
|
|
224
|
+
var deltaX = _this._touchActivatePosition.pageX - touch.pageX;
|
|
225
|
+
var deltaY = _this._touchActivatePosition.pageY - touch.pageY;
|
|
226
|
+
if (Math.hypot(deltaX, deltaY) > 10) {
|
|
227
|
+
_this._cancelLongPressDelayTimeout();
|
|
228
|
+
}
|
|
229
|
+
}
|
|
230
|
+
},
|
|
231
|
+
onResponderRelease: function (event) {
|
|
232
|
+
return end(event);
|
|
233
|
+
},
|
|
234
|
+
onResponderTerminate: function (event) {
|
|
235
|
+
if (event.nativeEvent.type === "selectionchange") {
|
|
236
|
+
_this._selectionTerminated = true;
|
|
237
|
+
}
|
|
238
|
+
_this._receiveSignal(RESPONDER_TERMINATED, event);
|
|
239
|
+
},
|
|
240
|
+
onResponderTerminationRequest: function (event) {
|
|
241
|
+
var _this$_config = _this._config;
|
|
242
|
+
var cancelable = _this$_config.cancelable;
|
|
243
|
+
var disabled = _this$_config.disabled;
|
|
244
|
+
var onLongPress = _this$_config.onLongPress;
|
|
245
|
+
if (!disabled && onLongPress != null && _this._isPointerTouch && event.nativeEvent.type === "contextmenu") {
|
|
246
|
+
return false;
|
|
247
|
+
}
|
|
248
|
+
if (cancelable == null) {
|
|
249
|
+
return true;
|
|
250
|
+
}
|
|
251
|
+
return cancelable;
|
|
252
|
+
},
|
|
253
|
+
// NOTE: this diverges from react-native in 3 significant ways:
|
|
254
|
+
// * The `onPress` callback is not connected to the responder system (the native
|
|
255
|
+
// `click` event must be used but is dispatched in many scenarios where no pointers
|
|
256
|
+
// are on the screen.) Therefore, it's possible for `onPress` to be called without
|
|
257
|
+
// `onPress{Start,End}` being called first.
|
|
258
|
+
// * The `onPress` callback is only be called on the first ancestor of the native
|
|
259
|
+
// `click` target that is using the PressResponder.
|
|
260
|
+
// * The event's `nativeEvent` is a `MouseEvent` not a `TouchEvent`.
|
|
261
|
+
onClick: function (event) {
|
|
262
|
+
var _this$_config2 = _this._config;
|
|
263
|
+
var disabled = _this$_config2.disabled;
|
|
264
|
+
var onPress = _this$_config2.onPress;
|
|
265
|
+
if (!disabled) {
|
|
266
|
+
event.stopPropagation();
|
|
267
|
+
if (_this._longPressDispatched || _this._selectionTerminated) {
|
|
268
|
+
event.preventDefault();
|
|
269
|
+
} else if (onPress != null && event.altKey === false) {
|
|
270
|
+
onPress(event);
|
|
143
271
|
}
|
|
144
|
-
}
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
var disabled = _this._config.disabled;
|
|
148
|
-
return disabled && isButtonRole(event.currentTarget) && event.stopPropagation(), disabled == null ? !0 : !disabled;
|
|
149
|
-
},
|
|
150
|
-
onKeyDown: function (event) {
|
|
151
|
-
var disabled = _this._config.disabled,
|
|
152
|
-
key = event.key,
|
|
153
|
-
target = event.target;
|
|
154
|
-
if (!disabled && isValidKeyPress(event)) {
|
|
155
|
-
_this._touchState === NOT_RESPONDER && (start(event, !1), document.addEventListener("keyup", keyupHandler));
|
|
156
|
-
var role = target.getAttribute("role"),
|
|
157
|
-
isSpacebarKey = key === " " || key === "Spacebar",
|
|
158
|
-
_isButtonRole = role === "button" || role === "menuitem";
|
|
159
|
-
isSpacebarKey && _isButtonRole && event.preventDefault(), event.stopPropagation();
|
|
272
|
+
} else {
|
|
273
|
+
if (isButtonRole(event.currentTarget)) {
|
|
274
|
+
event.stopPropagation();
|
|
160
275
|
}
|
|
161
|
-
}
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
276
|
+
}
|
|
277
|
+
},
|
|
278
|
+
// If `onLongPress` is provided and a touch pointer is being used, prevent the
|
|
279
|
+
// default context menu from opening.
|
|
280
|
+
onContextMenu: function (event) {
|
|
281
|
+
var _this$_config3 = _this._config;
|
|
282
|
+
var disabled = _this$_config3.disabled;
|
|
283
|
+
var onLongPress = _this$_config3.onLongPress;
|
|
284
|
+
if (!disabled) {
|
|
285
|
+
if (onLongPress != null && _this._isPointerTouch && !event.defaultPrevented) {
|
|
286
|
+
event.preventDefault();
|
|
287
|
+
event.stopPropagation();
|
|
288
|
+
}
|
|
289
|
+
} else {
|
|
290
|
+
if (isButtonRole(event.currentTarget)) {
|
|
291
|
+
event.stopPropagation();
|
|
172
292
|
}
|
|
173
|
-
},
|
|
174
|
-
onResponderRelease: function (event) {
|
|
175
|
-
return end(event);
|
|
176
|
-
},
|
|
177
|
-
onResponderTerminate: function (event) {
|
|
178
|
-
event.nativeEvent.type === "selectionchange" && (_this._selectionTerminated = !0), _this._receiveSignal(RESPONDER_TERMINATED, event);
|
|
179
|
-
},
|
|
180
|
-
onResponderTerminationRequest: function (event) {
|
|
181
|
-
var _this$_config = _this._config,
|
|
182
|
-
cancelable = _this$_config.cancelable,
|
|
183
|
-
disabled = _this$_config.disabled,
|
|
184
|
-
onLongPress = _this$_config.onLongPress;
|
|
185
|
-
return !disabled && onLongPress != null && _this._isPointerTouch && event.nativeEvent.type === "contextmenu" ? !1 : cancelable ?? !0;
|
|
186
|
-
},
|
|
187
|
-
// NOTE: this diverges from react-native in 3 significant ways:
|
|
188
|
-
// * The `onPress` callback is not connected to the responder system (the native
|
|
189
|
-
// `click` event must be used but is dispatched in many scenarios where no pointers
|
|
190
|
-
// are on the screen.) Therefore, it's possible for `onPress` to be called without
|
|
191
|
-
// `onPress{Start,End}` being called first.
|
|
192
|
-
// * The `onPress` callback is only be called on the first ancestor of the native
|
|
193
|
-
// `click` target that is using the PressResponder.
|
|
194
|
-
// * The event's `nativeEvent` is a `MouseEvent` not a `TouchEvent`.
|
|
195
|
-
onClick: function (event) {
|
|
196
|
-
var _this$_config2 = _this._config,
|
|
197
|
-
disabled = _this$_config2.disabled,
|
|
198
|
-
onPress = _this$_config2.onPress;
|
|
199
|
-
disabled ? isButtonRole(event.currentTarget) && event.stopPropagation() : (event.stopPropagation(), _this._longPressDispatched || _this._selectionTerminated ? event.preventDefault() : onPress != null && event.altKey === !1 && onPress(event));
|
|
200
|
-
},
|
|
201
|
-
// If `onLongPress` is provided and a touch pointer is being used, prevent the
|
|
202
|
-
// default context menu from opening.
|
|
203
|
-
onContextMenu: function (event) {
|
|
204
|
-
var _this$_config3 = _this._config,
|
|
205
|
-
disabled = _this$_config3.disabled,
|
|
206
|
-
onLongPress = _this$_config3.onLongPress;
|
|
207
|
-
disabled ? isButtonRole(event.currentTarget) && event.stopPropagation() : onLongPress != null && _this._isPointerTouch && !event.defaultPrevented && (event.preventDefault(), event.stopPropagation());
|
|
208
293
|
}
|
|
209
|
-
}
|
|
294
|
+
}
|
|
295
|
+
};
|
|
296
|
+
}
|
|
297
|
+
}, {
|
|
298
|
+
/**
|
|
299
|
+
* Receives a state machine signal, performs side effects of the transition
|
|
300
|
+
* and stores the new state. Validates the transition as well.
|
|
301
|
+
*/
|
|
302
|
+
key: "_receiveSignal",
|
|
303
|
+
value: function _receiveSignal(signal, event) {
|
|
304
|
+
var prevState = this._touchState;
|
|
305
|
+
var nextState = null;
|
|
306
|
+
if (Transitions[prevState] != null) {
|
|
307
|
+
nextState = Transitions[prevState][signal];
|
|
308
|
+
}
|
|
309
|
+
if (this._touchState === NOT_RESPONDER && signal === RESPONDER_RELEASE) {
|
|
310
|
+
return;
|
|
311
|
+
}
|
|
312
|
+
if (nextState == null || nextState === ERROR) {
|
|
313
|
+
console.error(`PressResponder: Invalid signal ${signal} for state ${prevState} on responder`);
|
|
314
|
+
} else if (prevState !== nextState) {
|
|
315
|
+
this._performTransitionSideEffects(prevState, nextState, signal, event);
|
|
316
|
+
this._touchState = nextState;
|
|
210
317
|
}
|
|
211
|
-
}
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
318
|
+
}
|
|
319
|
+
}, {
|
|
320
|
+
/**
|
|
321
|
+
* Performs a transition between touchable states and identify any activations
|
|
322
|
+
* or deactivations (and callback invocations).
|
|
323
|
+
*/
|
|
324
|
+
key: "_performTransitionSideEffects",
|
|
325
|
+
value: function _performTransitionSideEffects(prevState, nextState, signal, event) {
|
|
326
|
+
var _this = this;
|
|
327
|
+
if (isTerminalSignal(signal)) {
|
|
328
|
+
setTimeout(function () {
|
|
329
|
+
_this._isPointerTouch = false;
|
|
330
|
+
}, 0);
|
|
331
|
+
this._touchActivatePosition = null;
|
|
332
|
+
this._cancelLongPressDelayTimeout();
|
|
221
333
|
}
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
key: "_performTransitionSideEffects",
|
|
228
|
-
value: function (prevState, nextState, signal, event) {
|
|
229
|
-
var _this = this;
|
|
230
|
-
if (isTerminalSignal(signal) && (setTimeout(function () {
|
|
231
|
-
_this._isPointerTouch = !1;
|
|
232
|
-
}, 0), this._touchActivatePosition = null, this._cancelLongPressDelayTimeout()), isPressStartSignal(prevState) && signal === LONG_PRESS_DETECTED) {
|
|
233
|
-
var onLongPress = this._config.onLongPress;
|
|
234
|
-
onLongPress != null && event.nativeEvent.key == null && (onLongPress(event), this._longPressDispatched = !0);
|
|
334
|
+
if (isPressStartSignal(prevState) && signal === LONG_PRESS_DETECTED) {
|
|
335
|
+
var onLongPress = this._config.onLongPress;
|
|
336
|
+
if (onLongPress != null && event.nativeEvent.key == null) {
|
|
337
|
+
onLongPress(event);
|
|
338
|
+
this._longPressDispatched = true;
|
|
235
339
|
}
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
340
|
+
}
|
|
341
|
+
var isPrevActive = isActiveSignal(prevState);
|
|
342
|
+
var isNextActive = isActiveSignal(nextState);
|
|
343
|
+
if (!isPrevActive && isNextActive) {
|
|
344
|
+
this._activate(event);
|
|
345
|
+
} else if (isPrevActive && !isNextActive) {
|
|
346
|
+
this._deactivate(event);
|
|
347
|
+
}
|
|
348
|
+
if (isPressStartSignal(prevState) && signal === RESPONDER_RELEASE) {
|
|
349
|
+
var _this$_config4 = this._config;
|
|
350
|
+
var _onLongPress = _this$_config4.onLongPress;
|
|
351
|
+
var onPress = _this$_config4.onPress;
|
|
352
|
+
if (onPress != null) {
|
|
353
|
+
var isPressCanceledByLongPress = _onLongPress != null && prevState === RESPONDER_ACTIVE_LONG_PRESS_START;
|
|
354
|
+
if (!isPressCanceledByLongPress) {
|
|
355
|
+
if (!(isNextActive || isPrevActive)) {
|
|
356
|
+
this._activate(event);
|
|
357
|
+
this._deactivate(event);
|
|
358
|
+
}
|
|
245
359
|
}
|
|
246
360
|
}
|
|
247
|
-
this._cancelPressDelayTimeout();
|
|
248
361
|
}
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
362
|
+
this._cancelPressDelayTimeout();
|
|
363
|
+
}
|
|
364
|
+
}, {
|
|
365
|
+
key: "_activate",
|
|
366
|
+
value: function _activate(event) {
|
|
367
|
+
var _this$_config5 = this._config;
|
|
368
|
+
var onPressChange = _this$_config5.onPressChange;
|
|
369
|
+
var onPressStart = _this$_config5.onPressStart;
|
|
370
|
+
var touch = getTouchFromResponderEvent(event);
|
|
371
|
+
this._touchActivatePosition = {
|
|
372
|
+
pageX: touch.pageX,
|
|
373
|
+
pageY: touch.pageY
|
|
374
|
+
};
|
|
375
|
+
if (onPressStart != null) {
|
|
376
|
+
onPressStart(event);
|
|
377
|
+
}
|
|
378
|
+
if (onPressChange != null) {
|
|
379
|
+
onPressChange(true);
|
|
260
380
|
}
|
|
261
|
-
}
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
381
|
+
}
|
|
382
|
+
}, {
|
|
383
|
+
key: "_deactivate",
|
|
384
|
+
value: function _deactivate(event) {
|
|
385
|
+
var _this$_config6 = this._config;
|
|
386
|
+
var onPressChange = _this$_config6.onPressChange;
|
|
387
|
+
var onPressEnd = _this$_config6.onPressEnd;
|
|
388
|
+
function end() {
|
|
389
|
+
if (onPressEnd != null) {
|
|
390
|
+
onPressEnd(event);
|
|
391
|
+
}
|
|
392
|
+
if (onPressChange != null) {
|
|
393
|
+
onPressChange(false);
|
|
269
394
|
}
|
|
270
|
-
|
|
271
|
-
|
|
395
|
+
}
|
|
396
|
+
var delayPressEnd = normalizeDelay(this._config.delayPressEnd);
|
|
397
|
+
if (delayPressEnd > 0) {
|
|
398
|
+
this._pressOutDelayTimeout = setTimeout(function () {
|
|
272
399
|
end();
|
|
273
|
-
}, delayPressEnd)
|
|
400
|
+
}, delayPressEnd);
|
|
401
|
+
} else {
|
|
402
|
+
end();
|
|
274
403
|
}
|
|
275
|
-
}
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
404
|
+
}
|
|
405
|
+
}, {
|
|
406
|
+
key: "_handleLongPress",
|
|
407
|
+
value: function _handleLongPress(event) {
|
|
408
|
+
if (this._touchState === RESPONDER_ACTIVE_PRESS_START || this._touchState === RESPONDER_ACTIVE_LONG_PRESS_START) {
|
|
409
|
+
this._receiveSignal(LONG_PRESS_DETECTED, event);
|
|
279
410
|
}
|
|
280
|
-
}
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
411
|
+
}
|
|
412
|
+
}, {
|
|
413
|
+
key: "_cancelLongPressDelayTimeout",
|
|
414
|
+
value: function _cancelLongPressDelayTimeout() {
|
|
415
|
+
if (this._longPressDelayTimeout != null) {
|
|
416
|
+
clearTimeout(this._longPressDelayTimeout);
|
|
417
|
+
this._longPressDelayTimeout = null;
|
|
284
418
|
}
|
|
285
|
-
}
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
419
|
+
}
|
|
420
|
+
}, {
|
|
421
|
+
key: "_cancelPressDelayTimeout",
|
|
422
|
+
value: function _cancelPressDelayTimeout() {
|
|
423
|
+
if (this._pressDelayTimeout != null) {
|
|
424
|
+
clearTimeout(this._pressDelayTimeout);
|
|
425
|
+
this._pressDelayTimeout = null;
|
|
289
426
|
}
|
|
290
|
-
}
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
427
|
+
}
|
|
428
|
+
}, {
|
|
429
|
+
key: "_cancelPressOutDelayTimeout",
|
|
430
|
+
value: function _cancelPressOutDelayTimeout() {
|
|
431
|
+
if (this._pressOutDelayTimeout != null) {
|
|
432
|
+
clearTimeout(this._pressOutDelayTimeout);
|
|
433
|
+
this._pressOutDelayTimeout = null;
|
|
294
434
|
}
|
|
295
|
-
}
|
|
296
|
-
}
|
|
435
|
+
}
|
|
436
|
+
}]);
|
|
437
|
+
return PressResponder2;
|
|
438
|
+
}();
|
|
297
439
|
function normalizeDelay(delay, min, fallback) {
|
|
298
|
-
|
|
440
|
+
if (min === void 0) {
|
|
441
|
+
min = 0;
|
|
442
|
+
}
|
|
443
|
+
if (fallback === void 0) {
|
|
444
|
+
fallback = 0;
|
|
445
|
+
}
|
|
446
|
+
return Math.max(min, delay !== null && delay !== void 0 ? delay : fallback);
|
|
299
447
|
}
|
|
300
448
|
function getTouchFromResponderEvent(event) {
|
|
301
|
-
var _event$nativeEvent = event.nativeEvent
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
449
|
+
var _event$nativeEvent = event.nativeEvent;
|
|
450
|
+
var changedTouches = _event$nativeEvent.changedTouches;
|
|
451
|
+
var touches = _event$nativeEvent.touches;
|
|
452
|
+
if (touches != null && touches.length > 0) {
|
|
453
|
+
return touches[0];
|
|
454
|
+
}
|
|
455
|
+
if (changedTouches != null && changedTouches.length > 0) {
|
|
456
|
+
return changedTouches[0];
|
|
457
|
+
}
|
|
458
|
+
return event.nativeEvent;
|
|
305
459
|
}
|
|
306
460
|
export { PressResponder };
|
|
307
461
|
//# sourceMappingURL=PressResponder.native.js.map
|