@react-aria/interactions 3.5.1 → 3.8.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/dist/main.js +1252 -1661
- package/dist/main.js.map +1 -1
- package/dist/module.js +1239 -1612
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +45 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +4 -4
- package/src/index.ts +1 -0
- package/src/textSelection.ts +59 -28
- package/src/useFocusVisible.ts +4 -2
- package/src/useHover.ts +3 -3
- package/src/useLongPress.ts +128 -0
- package/src/useMove.ts +39 -24
- package/src/usePress.ts +102 -31
- package/src/useScrollWheel.ts +3 -12
package/dist/main.js
CHANGED
|
@@ -1,1804 +1,1395 @@
|
|
|
1
|
-
var
|
|
1
|
+
var $8jK7q$reactariautils = require("@react-aria/utils");
|
|
2
|
+
var $8jK7q$react = require("react");
|
|
2
3
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
useMemo,
|
|
9
|
-
useRef,
|
|
10
|
-
useState,
|
|
11
|
-
useCallback
|
|
12
|
-
} = _react2;
|
|
13
|
-
|
|
14
|
-
var {
|
|
15
|
-
mergeProps,
|
|
16
|
-
runAfterTransition,
|
|
17
|
-
focusWithoutScrolling,
|
|
18
|
-
useGlobalListeners,
|
|
19
|
-
useSyncRef,
|
|
20
|
-
isMac
|
|
21
|
-
} = require("@react-aria/utils");
|
|
22
|
-
|
|
23
|
-
var _babelRuntimeHelpersObjectWithoutPropertiesLoose = $parcel$interopDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
4
|
+
function $parcel$exportWildcard(dest, source) {
|
|
5
|
+
Object.keys(source).forEach(function(key) {
|
|
6
|
+
if (key === 'default' || key === '__esModule' || dest.hasOwnProperty(key)) {
|
|
7
|
+
return;
|
|
8
|
+
}
|
|
24
9
|
|
|
25
|
-
|
|
10
|
+
Object.defineProperty(dest, key, {
|
|
11
|
+
enumerable: true,
|
|
12
|
+
get: function get() {
|
|
13
|
+
return source[key];
|
|
14
|
+
}
|
|
15
|
+
});
|
|
16
|
+
});
|
|
26
17
|
|
|
18
|
+
return dest;
|
|
19
|
+
}
|
|
27
20
|
function $parcel$interopDefault(a) {
|
|
28
21
|
return a && a.__esModule ? a.default : a;
|
|
29
22
|
}
|
|
23
|
+
function $parcel$export(e, n, v, s) {
|
|
24
|
+
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
25
|
+
}
|
|
26
|
+
var $c7e4402d7268b9e5$exports = {};
|
|
30
27
|
|
|
31
|
-
|
|
32
|
-
let $ce801cc8e3ff24b95c928e0152c7b7f2$var$savedUserSelect = '';
|
|
28
|
+
$parcel$export($c7e4402d7268b9e5$exports, "Pressable", () => $c7e4402d7268b9e5$export$27c701ed9e449e99);
|
|
33
29
|
|
|
34
|
-
|
|
35
|
-
if ($ce801cc8e3ff24b95c928e0152c7b7f2$var$state === 'default') {
|
|
36
|
-
$ce801cc8e3ff24b95c928e0152c7b7f2$var$savedUserSelect = document.documentElement.style.webkitUserSelect;
|
|
37
|
-
document.documentElement.style.webkitUserSelect = 'none';
|
|
38
|
-
}
|
|
30
|
+
var $49794190ef05a7aa$exports = {};
|
|
39
31
|
|
|
40
|
-
|
|
41
|
-
}
|
|
32
|
+
$parcel$export($49794190ef05a7aa$exports, "usePress", () => $49794190ef05a7aa$export$45712eceda6fad21);
|
|
42
33
|
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
setTimeout(() => {
|
|
54
|
-
// Wait for any CSS transitions to complete so we don't recompute style
|
|
55
|
-
// for the whole page in the middle of the animation and cause jank.
|
|
56
|
-
runAfterTransition(() => {
|
|
57
|
-
// Avoid race conditions
|
|
58
|
-
if ($ce801cc8e3ff24b95c928e0152c7b7f2$var$state === 'restoring') {
|
|
59
|
-
if (document.documentElement.style.webkitUserSelect === 'none') {
|
|
60
|
-
document.documentElement.style.webkitUserSelect = $ce801cc8e3ff24b95c928e0152c7b7f2$var$savedUserSelect || '';
|
|
34
|
+
// Note that state only matters here for iOS. Non-iOS gets user-select: none applied to the target element
|
|
35
|
+
// rather than at the document level so we just need to apply/remove user-select: none for each pressed element individually
|
|
36
|
+
let $f85b19f7e83b9914$var$state = 'default';
|
|
37
|
+
let $f85b19f7e83b9914$var$savedUserSelect = '';
|
|
38
|
+
let $f85b19f7e83b9914$var$modifiedElementMap = new WeakMap();
|
|
39
|
+
function $f85b19f7e83b9914$export$16a4697467175487(target) {
|
|
40
|
+
if ($8jK7q$reactariautils.isIOS()) {
|
|
41
|
+
if ($f85b19f7e83b9914$var$state === 'default') {
|
|
42
|
+
$f85b19f7e83b9914$var$savedUserSelect = document.documentElement.style.webkitUserSelect;
|
|
43
|
+
document.documentElement.style.webkitUserSelect = 'none';
|
|
61
44
|
}
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
45
|
+
$f85b19f7e83b9914$var$state = 'disabled';
|
|
46
|
+
} else if (target) {
|
|
47
|
+
// If not iOS, store the target's original user-select and change to user-select: none
|
|
48
|
+
// Ignore state since it doesn't apply for non iOS
|
|
49
|
+
$f85b19f7e83b9914$var$modifiedElementMap.set(target, target.style.userSelect);
|
|
50
|
+
target.style.userSelect = 'none';
|
|
51
|
+
}
|
|
68
52
|
}
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
//
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
//
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
53
|
+
function $f85b19f7e83b9914$export$b0d6fa1ab32e3295(target) {
|
|
54
|
+
if ($8jK7q$reactariautils.isIOS()) {
|
|
55
|
+
// If the state is already default, there's nothing to do.
|
|
56
|
+
// If it is restoring, then there's no need to queue a second restore.
|
|
57
|
+
if ($f85b19f7e83b9914$var$state !== 'disabled') return;
|
|
58
|
+
$f85b19f7e83b9914$var$state = 'restoring';
|
|
59
|
+
// There appears to be a delay on iOS where selection still might occur
|
|
60
|
+
// after pointer up, so wait a bit before removing user-select.
|
|
61
|
+
setTimeout(()=>{
|
|
62
|
+
// Wait for any CSS transitions to complete so we don't recompute style
|
|
63
|
+
// for the whole page in the middle of the animation and cause jank.
|
|
64
|
+
$8jK7q$reactariautils.runAfterTransition(()=>{
|
|
65
|
+
// Avoid race conditions
|
|
66
|
+
if ($f85b19f7e83b9914$var$state === 'restoring') {
|
|
67
|
+
if (document.documentElement.style.webkitUserSelect === 'none') document.documentElement.style.webkitUserSelect = $f85b19f7e83b9914$var$savedUserSelect || '';
|
|
68
|
+
$f85b19f7e83b9914$var$savedUserSelect = '';
|
|
69
|
+
$f85b19f7e83b9914$var$state = 'default';
|
|
70
|
+
}
|
|
71
|
+
});
|
|
72
|
+
}, 300);
|
|
73
|
+
} else // If not iOS, restore the target's original user-select if any
|
|
74
|
+
// Ignore state since it doesn't apply for non iOS
|
|
75
|
+
if (target && $f85b19f7e83b9914$var$modifiedElementMap.has(target)) {
|
|
76
|
+
let targetOldUserSelect = $f85b19f7e83b9914$var$modifiedElementMap.get(target);
|
|
77
|
+
if (target.style.userSelect === 'none') target.style.userSelect = targetOldUserSelect;
|
|
78
|
+
if (target.getAttribute('style') === '') target.removeAttribute('style');
|
|
79
|
+
$f85b19f7e83b9914$var$modifiedElementMap.delete(target);
|
|
80
|
+
}
|
|
97
81
|
}
|
|
98
82
|
|
|
99
|
-
const $c6b6d42ec461c27a6a09002bf49a250e$export$PressResponderContext = /*#__PURE__*/_react.createContext(null);
|
|
100
|
-
|
|
101
|
-
$c6b6d42ec461c27a6a09002bf49a250e$export$PressResponderContext.displayName = 'PressResponderContext';
|
|
102
83
|
|
|
103
|
-
function $ed8d760564e19d8c7d03a6a4$var$usePressResponderContext(props) {
|
|
104
|
-
// Consume context from <PressResponder> and merge with props.
|
|
105
|
-
let context = useContext($c6b6d42ec461c27a6a09002bf49a250e$export$PressResponderContext);
|
|
106
84
|
|
|
107
|
-
if (context) {
|
|
108
|
-
let {
|
|
109
|
-
register
|
|
110
|
-
} = context,
|
|
111
|
-
contextProps = _babelRuntimeHelpersObjectWithoutPropertiesLoose(context, ["register"]);
|
|
112
85
|
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
useSyncRef(context, props.ref);
|
|
118
|
-
return props;
|
|
86
|
+
function $d82c55e531efd73a$export$60278871457622de(event) {
|
|
87
|
+
// JAWS/NVDA with Firefox.
|
|
88
|
+
if (event.mozInputSource === 0 && event.isTrusted) return true;
|
|
89
|
+
return event.detail === 0 && !event.pointerType;
|
|
119
90
|
}
|
|
120
|
-
/**
|
|
121
|
-
* Handles press interactions across mouse, touch, keyboard, and screen readers.
|
|
122
|
-
* It normalizes behavior across browsers and platforms, and handles many nuances
|
|
123
|
-
* of dealing with pointer and keyboard events.
|
|
124
|
-
*/
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
function usePress(props) {
|
|
128
|
-
let _usePressResponderCon = $ed8d760564e19d8c7d03a6a4$var$usePressResponderContext(props),
|
|
129
|
-
{
|
|
130
|
-
onPress,
|
|
131
|
-
onPressChange,
|
|
132
|
-
onPressStart,
|
|
133
|
-
onPressEnd,
|
|
134
|
-
onPressUp,
|
|
135
|
-
isDisabled,
|
|
136
|
-
isPressed: isPressedProp,
|
|
137
|
-
preventFocusOnPress
|
|
138
|
-
} = _usePressResponderCon,
|
|
139
|
-
domProps = _babelRuntimeHelpersObjectWithoutPropertiesLoose(_usePressResponderCon, ["onPress", "onPressChange", "onPressStart", "onPressEnd", "onPressUp", "isDisabled", "isPressed", "preventFocusOnPress", "ref"]);
|
|
140
|
-
|
|
141
|
-
let propsRef = useRef(null);
|
|
142
|
-
propsRef.current = {
|
|
143
|
-
onPress,
|
|
144
|
-
onPressChange,
|
|
145
|
-
onPressStart,
|
|
146
|
-
onPressEnd,
|
|
147
|
-
onPressUp,
|
|
148
|
-
isDisabled
|
|
149
|
-
};
|
|
150
|
-
let [isPressed, setPressed] = useState(false);
|
|
151
|
-
let ref = useRef({
|
|
152
|
-
isPressed: false,
|
|
153
|
-
ignoreEmulatedMouseEvents: false,
|
|
154
|
-
ignoreClickAfterPress: false,
|
|
155
|
-
didFirePressStart: false,
|
|
156
|
-
activePointerId: null,
|
|
157
|
-
target: null,
|
|
158
|
-
isOverTarget: false,
|
|
159
|
-
pointerType: null
|
|
160
|
-
});
|
|
161
|
-
let {
|
|
162
|
-
addGlobalListener,
|
|
163
|
-
removeAllGlobalListeners
|
|
164
|
-
} = useGlobalListeners();
|
|
165
|
-
let pressProps = useMemo(() => {
|
|
166
|
-
let state = ref.current;
|
|
167
|
-
|
|
168
|
-
let triggerPressStart = (originalEvent, pointerType) => {
|
|
169
|
-
let {
|
|
170
|
-
onPressStart,
|
|
171
|
-
onPressChange,
|
|
172
|
-
isDisabled
|
|
173
|
-
} = propsRef.current;
|
|
174
91
|
|
|
175
|
-
if (isDisabled || state.didFirePressStart) {
|
|
176
|
-
return;
|
|
177
|
-
}
|
|
178
92
|
|
|
179
|
-
if (onPressStart) {
|
|
180
|
-
onPressStart({
|
|
181
|
-
type: 'pressstart',
|
|
182
|
-
pointerType,
|
|
183
|
-
target: originalEvent.currentTarget,
|
|
184
|
-
shiftKey: originalEvent.shiftKey,
|
|
185
|
-
metaKey: originalEvent.metaKey,
|
|
186
|
-
ctrlKey: originalEvent.ctrlKey
|
|
187
|
-
});
|
|
188
|
-
}
|
|
189
93
|
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
}
|
|
94
|
+
const $5b5ad1e1cf57bd7c$export$5165eccb35aaadb5 = ($parcel$interopDefault($8jK7q$react)).createContext(null);
|
|
95
|
+
$5b5ad1e1cf57bd7c$export$5165eccb35aaadb5.displayName = 'PressResponderContext';
|
|
193
96
|
|
|
194
|
-
state.didFirePressStart = true;
|
|
195
|
-
setPressed(true);
|
|
196
|
-
};
|
|
197
|
-
|
|
198
|
-
let triggerPressEnd = function triggerPressEnd(originalEvent, pointerType, wasPressed) {
|
|
199
|
-
if (wasPressed === void 0) {
|
|
200
|
-
wasPressed = true;
|
|
201
|
-
}
|
|
202
97
|
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
}
|
|
227
|
-
|
|
228
|
-
if (onPressChange) {
|
|
229
|
-
onPressChange(false);
|
|
230
|
-
}
|
|
231
|
-
|
|
232
|
-
setPressed(false);
|
|
233
|
-
|
|
234
|
-
if (onPress && wasPressed && !isDisabled) {
|
|
235
|
-
onPress({
|
|
236
|
-
type: 'press',
|
|
237
|
-
pointerType,
|
|
238
|
-
target: originalEvent.currentTarget,
|
|
239
|
-
shiftKey: originalEvent.shiftKey,
|
|
240
|
-
metaKey: originalEvent.metaKey,
|
|
241
|
-
ctrlKey: originalEvent.ctrlKey
|
|
242
|
-
});
|
|
243
|
-
}
|
|
244
|
-
};
|
|
245
|
-
|
|
246
|
-
let triggerPressUp = (originalEvent, pointerType) => {
|
|
247
|
-
let {
|
|
248
|
-
onPressUp,
|
|
249
|
-
isDisabled
|
|
250
|
-
} = propsRef.current;
|
|
251
|
-
|
|
252
|
-
if (isDisabled) {
|
|
253
|
-
return;
|
|
254
|
-
}
|
|
255
|
-
|
|
256
|
-
if (onPressUp) {
|
|
257
|
-
onPressUp({
|
|
258
|
-
type: 'pressup',
|
|
259
|
-
pointerType,
|
|
260
|
-
target: originalEvent.currentTarget,
|
|
261
|
-
shiftKey: originalEvent.shiftKey,
|
|
262
|
-
metaKey: originalEvent.metaKey,
|
|
263
|
-
ctrlKey: originalEvent.ctrlKey
|
|
264
|
-
});
|
|
265
|
-
}
|
|
266
|
-
};
|
|
267
|
-
|
|
268
|
-
let cancel = e => {
|
|
269
|
-
if (state.isPressed) {
|
|
270
|
-
if (state.isOverTarget) {
|
|
271
|
-
triggerPressEnd($ed8d760564e19d8c7d03a6a4$var$createEvent(state.target, e), state.pointerType, false);
|
|
272
|
-
}
|
|
273
|
-
|
|
274
|
-
state.isPressed = false;
|
|
275
|
-
state.isOverTarget = false;
|
|
276
|
-
state.activePointerId = null;
|
|
277
|
-
state.pointerType = null;
|
|
278
|
-
removeAllGlobalListeners();
|
|
279
|
-
$ce801cc8e3ff24b95c928e0152c7b7f2$export$restoreTextSelection();
|
|
280
|
-
}
|
|
98
|
+
function $49794190ef05a7aa$var$usePressResponderContext(props) {
|
|
99
|
+
// Consume context from <PressResponder> and merge with props.
|
|
100
|
+
let context = $8jK7q$react.useContext($5b5ad1e1cf57bd7c$export$5165eccb35aaadb5);
|
|
101
|
+
if (context) {
|
|
102
|
+
let { register: register , ...contextProps } = context;
|
|
103
|
+
props = $8jK7q$reactariautils.mergeProps(contextProps, props);
|
|
104
|
+
register();
|
|
105
|
+
}
|
|
106
|
+
$8jK7q$reactariautils.useSyncRef(context, props.ref);
|
|
107
|
+
return props;
|
|
108
|
+
}
|
|
109
|
+
function $49794190ef05a7aa$export$45712eceda6fad21(props) {
|
|
110
|
+
let { onPress: onPress1 , onPressChange: onPressChange1 , onPressStart: onPressStart1 , onPressEnd: onPressEnd1 , onPressUp: onPressUp1 , isDisabled: isDisabled1 , isPressed: isPressedProp , preventFocusOnPress: preventFocusOnPress , shouldCancelOnPointerExit: shouldCancelOnPointerExit , allowTextSelectionOnPress: allowTextSelectionOnPress , // eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
111
|
+
ref: _ , ...domProps } = $49794190ef05a7aa$var$usePressResponderContext(props);
|
|
112
|
+
let propsRef = $8jK7q$react.useRef(null);
|
|
113
|
+
propsRef.current = {
|
|
114
|
+
onPress: onPress1,
|
|
115
|
+
onPressChange: onPressChange1,
|
|
116
|
+
onPressStart: onPressStart1,
|
|
117
|
+
onPressEnd: onPressEnd1,
|
|
118
|
+
onPressUp: onPressUp1,
|
|
119
|
+
isDisabled: isDisabled1,
|
|
120
|
+
shouldCancelOnPointerExit: shouldCancelOnPointerExit
|
|
281
121
|
};
|
|
282
|
-
|
|
283
|
-
let
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
}
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
122
|
+
let [isPressed, setPressed] = $8jK7q$react.useState(false);
|
|
123
|
+
let ref = $8jK7q$react.useRef({
|
|
124
|
+
isPressed: false,
|
|
125
|
+
ignoreEmulatedMouseEvents: false,
|
|
126
|
+
ignoreClickAfterPress: false,
|
|
127
|
+
didFirePressStart: false,
|
|
128
|
+
activePointerId: null,
|
|
129
|
+
target: null,
|
|
130
|
+
isOverTarget: false,
|
|
131
|
+
pointerType: null
|
|
132
|
+
});
|
|
133
|
+
let { addGlobalListener: addGlobalListener , removeAllGlobalListeners: removeAllGlobalListeners } = $8jK7q$reactariautils.useGlobalListeners();
|
|
134
|
+
let pressProps1 = $8jK7q$react.useMemo(()=>{
|
|
135
|
+
let state = ref.current;
|
|
136
|
+
let triggerPressStart = (originalEvent, pointerType)=>{
|
|
137
|
+
let { onPressStart: onPressStart , onPressChange: onPressChange , isDisabled: isDisabled } = propsRef.current;
|
|
138
|
+
if (isDisabled || state.didFirePressStart) return;
|
|
139
|
+
if (onPressStart) onPressStart({
|
|
140
|
+
type: 'pressstart',
|
|
141
|
+
pointerType: pointerType,
|
|
142
|
+
target: originalEvent.currentTarget,
|
|
143
|
+
shiftKey: originalEvent.shiftKey,
|
|
144
|
+
metaKey: originalEvent.metaKey,
|
|
145
|
+
ctrlKey: originalEvent.ctrlKey,
|
|
146
|
+
altKey: originalEvent.altKey
|
|
147
|
+
});
|
|
148
|
+
if (onPressChange) onPressChange(true);
|
|
149
|
+
state.didFirePressStart = true;
|
|
150
|
+
setPressed(true);
|
|
151
|
+
};
|
|
152
|
+
let triggerPressEnd = (originalEvent, pointerType, wasPressed = true)=>{
|
|
153
|
+
let { onPressEnd: onPressEnd , onPressChange: onPressChange , onPress: onPress , isDisabled: isDisabled } = propsRef.current;
|
|
154
|
+
if (!state.didFirePressStart) return;
|
|
155
|
+
state.ignoreClickAfterPress = true;
|
|
156
|
+
state.didFirePressStart = false;
|
|
157
|
+
if (onPressEnd) onPressEnd({
|
|
158
|
+
type: 'pressend',
|
|
159
|
+
pointerType: pointerType,
|
|
160
|
+
target: originalEvent.currentTarget,
|
|
161
|
+
shiftKey: originalEvent.shiftKey,
|
|
162
|
+
metaKey: originalEvent.metaKey,
|
|
163
|
+
ctrlKey: originalEvent.ctrlKey,
|
|
164
|
+
altKey: originalEvent.altKey
|
|
165
|
+
});
|
|
166
|
+
if (onPressChange) onPressChange(false);
|
|
167
|
+
setPressed(false);
|
|
168
|
+
if (onPress && wasPressed && !isDisabled) onPress({
|
|
169
|
+
type: 'press',
|
|
170
|
+
pointerType: pointerType,
|
|
171
|
+
target: originalEvent.currentTarget,
|
|
172
|
+
shiftKey: originalEvent.shiftKey,
|
|
173
|
+
metaKey: originalEvent.metaKey,
|
|
174
|
+
ctrlKey: originalEvent.ctrlKey,
|
|
175
|
+
altKey: originalEvent.altKey
|
|
176
|
+
});
|
|
177
|
+
};
|
|
178
|
+
let triggerPressUp = (originalEvent, pointerType)=>{
|
|
179
|
+
let { onPressUp: onPressUp , isDisabled: isDisabled } = propsRef.current;
|
|
180
|
+
if (isDisabled) return;
|
|
181
|
+
if (onPressUp) onPressUp({
|
|
182
|
+
type: 'pressup',
|
|
183
|
+
pointerType: pointerType,
|
|
184
|
+
target: originalEvent.currentTarget,
|
|
185
|
+
shiftKey: originalEvent.shiftKey,
|
|
186
|
+
metaKey: originalEvent.metaKey,
|
|
187
|
+
ctrlKey: originalEvent.ctrlKey,
|
|
188
|
+
altKey: originalEvent.altKey
|
|
189
|
+
});
|
|
190
|
+
};
|
|
191
|
+
let cancel = (e)=>{
|
|
192
|
+
if (state.isPressed) {
|
|
193
|
+
if (state.isOverTarget) triggerPressEnd($49794190ef05a7aa$var$createEvent(state.target, e), state.pointerType, false);
|
|
194
|
+
state.isPressed = false;
|
|
195
|
+
state.isOverTarget = false;
|
|
196
|
+
state.activePointerId = null;
|
|
197
|
+
state.pointerType = null;
|
|
198
|
+
removeAllGlobalListeners();
|
|
199
|
+
if (!allowTextSelectionOnPress) $f85b19f7e83b9914$export$b0d6fa1ab32e3295(state.target);
|
|
326
200
|
}
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
201
|
+
};
|
|
202
|
+
let pressProps = {
|
|
203
|
+
onKeyDown (e) {
|
|
204
|
+
if ($49794190ef05a7aa$var$isValidKeyboardEvent(e.nativeEvent) && e.currentTarget.contains(e.target)) {
|
|
205
|
+
if ($49794190ef05a7aa$var$shouldPreventDefaultKeyboard(e.target)) e.preventDefault();
|
|
206
|
+
e.stopPropagation();
|
|
207
|
+
// If the event is repeating, it may have started on a different element
|
|
208
|
+
// after which focus moved to the current element. Ignore these events and
|
|
209
|
+
// only handle the first key down event.
|
|
210
|
+
if (!state.isPressed && !e.repeat) {
|
|
211
|
+
state.target = e.currentTarget;
|
|
212
|
+
state.isPressed = true;
|
|
213
|
+
triggerPressStart(e, 'keyboard');
|
|
214
|
+
// Focus may move before the key up event, so register the event on the document
|
|
215
|
+
// instead of the same element where the key down event occurred.
|
|
216
|
+
addGlobalListener(document, 'keyup', onKeyUp, false);
|
|
217
|
+
}
|
|
218
|
+
}
|
|
219
|
+
},
|
|
220
|
+
onKeyUp (e) {
|
|
221
|
+
if ($49794190ef05a7aa$var$isValidKeyboardEvent(e.nativeEvent) && !e.repeat && e.currentTarget.contains(e.target)) triggerPressUp($49794190ef05a7aa$var$createEvent(state.target, e), 'keyboard');
|
|
222
|
+
},
|
|
223
|
+
onClick (e) {
|
|
224
|
+
if (e && !e.currentTarget.contains(e.target)) return;
|
|
225
|
+
if (e && e.button === 0) {
|
|
226
|
+
e.stopPropagation();
|
|
227
|
+
if (isDisabled1) e.preventDefault();
|
|
228
|
+
// If triggered from a screen reader or by using element.click(),
|
|
229
|
+
// trigger as if it were a keyboard click.
|
|
230
|
+
if (!state.ignoreClickAfterPress && !state.ignoreEmulatedMouseEvents && (state.pointerType === 'virtual' || $d82c55e531efd73a$export$60278871457622de(e.nativeEvent))) {
|
|
231
|
+
// Ensure the element receives focus (VoiceOver on iOS does not do this)
|
|
232
|
+
if (!isDisabled1 && !preventFocusOnPress) $8jK7q$reactariautils.focusWithoutScrolling(e.currentTarget);
|
|
233
|
+
triggerPressStart(e, 'virtual');
|
|
234
|
+
triggerPressUp(e, 'virtual');
|
|
235
|
+
triggerPressEnd(e, 'virtual');
|
|
236
|
+
}
|
|
237
|
+
state.ignoreEmulatedMouseEvents = false;
|
|
238
|
+
state.ignoreClickAfterPress = false;
|
|
239
|
+
}
|
|
240
|
+
}
|
|
241
|
+
};
|
|
242
|
+
let onKeyUp = (e)=>{
|
|
243
|
+
if (state.isPressed && $49794190ef05a7aa$var$isValidKeyboardEvent(e)) {
|
|
244
|
+
if ($49794190ef05a7aa$var$shouldPreventDefaultKeyboard(e.target)) e.preventDefault();
|
|
245
|
+
e.stopPropagation();
|
|
246
|
+
state.isPressed = false;
|
|
247
|
+
let target = e.target;
|
|
248
|
+
triggerPressEnd($49794190ef05a7aa$var$createEvent(state.target, e), 'keyboard', state.target.contains(target));
|
|
249
|
+
removeAllGlobalListeners();
|
|
250
|
+
// If the target is a link, trigger the click method to open the URL,
|
|
251
|
+
// but defer triggering pressEnd until onClick event handler.
|
|
252
|
+
if (state.target.contains(target) && $49794190ef05a7aa$var$isHTMLAnchorLink(state.target) || state.target.getAttribute('role') === 'link') state.target.click();
|
|
253
|
+
}
|
|
254
|
+
};
|
|
255
|
+
if (typeof PointerEvent !== 'undefined') {
|
|
256
|
+
pressProps.onPointerDown = (e)=>{
|
|
257
|
+
// Only handle left clicks, and ignore events that bubbled through portals.
|
|
258
|
+
if (e.button !== 0 || !e.currentTarget.contains(e.target)) return;
|
|
259
|
+
// iOS safari fires pointer events from VoiceOver with incorrect coordinates/target.
|
|
260
|
+
// Ignore and let the onClick handler take care of it instead.
|
|
261
|
+
// https://bugs.webkit.org/show_bug.cgi?id=222627
|
|
262
|
+
// https://bugs.webkit.org/show_bug.cgi?id=223202
|
|
263
|
+
if ($49794190ef05a7aa$var$isVirtualPointerEvent(e.nativeEvent)) {
|
|
264
|
+
state.pointerType = 'virtual';
|
|
265
|
+
return;
|
|
266
|
+
}
|
|
267
|
+
// Due to browser inconsistencies, especially on mobile browsers, we prevent
|
|
268
|
+
// default on pointer down and handle focusing the pressable element ourselves.
|
|
269
|
+
if ($49794190ef05a7aa$var$shouldPreventDefault(e.target)) e.preventDefault();
|
|
270
|
+
state.pointerType = e.pointerType;
|
|
271
|
+
e.stopPropagation();
|
|
272
|
+
if (!state.isPressed) {
|
|
273
|
+
state.isPressed = true;
|
|
274
|
+
state.isOverTarget = true;
|
|
275
|
+
state.activePointerId = e.pointerId;
|
|
276
|
+
state.target = e.currentTarget;
|
|
277
|
+
if (!isDisabled1 && !preventFocusOnPress) $8jK7q$reactariautils.focusWithoutScrolling(e.currentTarget);
|
|
278
|
+
if (!allowTextSelectionOnPress) $f85b19f7e83b9914$export$16a4697467175487(state.target);
|
|
279
|
+
triggerPressStart(e, state.pointerType);
|
|
280
|
+
addGlobalListener(document, 'pointermove', onPointerMove, false);
|
|
281
|
+
addGlobalListener(document, 'pointerup', onPointerUp, false);
|
|
282
|
+
addGlobalListener(document, 'pointercancel', onPointerCancel, false);
|
|
283
|
+
}
|
|
284
|
+
};
|
|
285
|
+
pressProps.onMouseDown = (e)=>{
|
|
286
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
287
|
+
if (e.button === 0) {
|
|
288
|
+
// Chrome and Firefox on touch Windows devices require mouse down events
|
|
289
|
+
// to be canceled in addition to pointer events, or an extra asynchronous
|
|
290
|
+
// focus event will be fired.
|
|
291
|
+
if ($49794190ef05a7aa$var$shouldPreventDefault(e.target)) e.preventDefault();
|
|
292
|
+
e.stopPropagation();
|
|
293
|
+
}
|
|
294
|
+
};
|
|
295
|
+
pressProps.onPointerUp = (e)=>{
|
|
296
|
+
// iOS fires pointerup with zero width and height, so check the pointerType recorded during pointerdown.
|
|
297
|
+
if (!e.currentTarget.contains(e.target) || state.pointerType === 'virtual') return;
|
|
298
|
+
// Only handle left clicks
|
|
299
|
+
// Safari on iOS sometimes fires pointerup events, even
|
|
300
|
+
// when the touch isn't over the target, so double check.
|
|
301
|
+
if (e.button === 0 && $49794190ef05a7aa$var$isOverTarget(e, e.currentTarget)) triggerPressUp(e, state.pointerType || e.pointerType);
|
|
302
|
+
};
|
|
303
|
+
// Safari on iOS < 13.2 does not implement pointerenter/pointerleave events correctly.
|
|
304
|
+
// Use pointer move events instead to implement our own hit testing.
|
|
305
|
+
// See https://bugs.webkit.org/show_bug.cgi?id=199803
|
|
306
|
+
let onPointerMove = (e)=>{
|
|
307
|
+
if (e.pointerId !== state.activePointerId) return;
|
|
308
|
+
if ($49794190ef05a7aa$var$isOverTarget(e, state.target)) {
|
|
309
|
+
if (!state.isOverTarget) {
|
|
310
|
+
state.isOverTarget = true;
|
|
311
|
+
triggerPressStart($49794190ef05a7aa$var$createEvent(state.target, e), state.pointerType);
|
|
312
|
+
}
|
|
313
|
+
} else if (state.isOverTarget) {
|
|
314
|
+
state.isOverTarget = false;
|
|
315
|
+
triggerPressEnd($49794190ef05a7aa$var$createEvent(state.target, e), state.pointerType, false);
|
|
316
|
+
if (propsRef.current.shouldCancelOnPointerExit) cancel(e);
|
|
317
|
+
}
|
|
318
|
+
};
|
|
319
|
+
let onPointerUp = (e)=>{
|
|
320
|
+
if (e.pointerId === state.activePointerId && state.isPressed && e.button === 0) {
|
|
321
|
+
if ($49794190ef05a7aa$var$isOverTarget(e, state.target)) triggerPressEnd($49794190ef05a7aa$var$createEvent(state.target, e), state.pointerType);
|
|
322
|
+
else if (state.isOverTarget) triggerPressEnd($49794190ef05a7aa$var$createEvent(state.target, e), state.pointerType, false);
|
|
323
|
+
state.isPressed = false;
|
|
324
|
+
state.isOverTarget = false;
|
|
325
|
+
state.activePointerId = null;
|
|
326
|
+
state.pointerType = null;
|
|
327
|
+
removeAllGlobalListeners();
|
|
328
|
+
if (!allowTextSelectionOnPress) $f85b19f7e83b9914$export$b0d6fa1ab32e3295(state.target);
|
|
329
|
+
}
|
|
330
|
+
};
|
|
331
|
+
let onPointerCancel = (e)=>{
|
|
332
|
+
cancel(e);
|
|
333
|
+
};
|
|
334
|
+
pressProps.onDragStart = (e)=>{
|
|
335
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
336
|
+
// Safari does not call onPointerCancel when a drag starts, whereas Chrome and Firefox do.
|
|
337
|
+
cancel(e);
|
|
338
|
+
};
|
|
339
|
+
} else {
|
|
340
|
+
pressProps.onMouseDown = (e)=>{
|
|
341
|
+
// Only handle left clicks
|
|
342
|
+
if (e.button !== 0 || !e.currentTarget.contains(e.target)) return;
|
|
343
|
+
// Due to browser inconsistencies, especially on mobile browsers, we prevent
|
|
344
|
+
// default on mouse down and handle focusing the pressable element ourselves.
|
|
345
|
+
if ($49794190ef05a7aa$var$shouldPreventDefault(e.target)) e.preventDefault();
|
|
346
|
+
e.stopPropagation();
|
|
347
|
+
if (state.ignoreEmulatedMouseEvents) return;
|
|
348
|
+
state.isPressed = true;
|
|
349
|
+
state.isOverTarget = true;
|
|
350
|
+
state.target = e.currentTarget;
|
|
351
|
+
state.pointerType = $d82c55e531efd73a$export$60278871457622de(e.nativeEvent) ? 'virtual' : 'mouse';
|
|
352
|
+
if (!isDisabled1 && !preventFocusOnPress) $8jK7q$reactariautils.focusWithoutScrolling(e.currentTarget);
|
|
353
|
+
triggerPressStart(e, state.pointerType);
|
|
354
|
+
addGlobalListener(document, 'mouseup', onMouseUp, false);
|
|
355
|
+
};
|
|
356
|
+
pressProps.onMouseEnter = (e)=>{
|
|
357
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
358
|
+
e.stopPropagation();
|
|
359
|
+
if (state.isPressed && !state.ignoreEmulatedMouseEvents) {
|
|
360
|
+
state.isOverTarget = true;
|
|
361
|
+
triggerPressStart(e, state.pointerType);
|
|
362
|
+
}
|
|
363
|
+
};
|
|
364
|
+
pressProps.onMouseLeave = (e)=>{
|
|
365
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
366
|
+
e.stopPropagation();
|
|
367
|
+
if (state.isPressed && !state.ignoreEmulatedMouseEvents) {
|
|
368
|
+
state.isOverTarget = false;
|
|
369
|
+
triggerPressEnd(e, state.pointerType, false);
|
|
370
|
+
if (propsRef.current.shouldCancelOnPointerExit) cancel(e);
|
|
371
|
+
}
|
|
372
|
+
};
|
|
373
|
+
pressProps.onMouseUp = (e)=>{
|
|
374
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
375
|
+
if (!state.ignoreEmulatedMouseEvents && e.button === 0) triggerPressUp(e, state.pointerType);
|
|
376
|
+
};
|
|
377
|
+
let onMouseUp = (e)=>{
|
|
378
|
+
// Only handle left clicks
|
|
379
|
+
if (e.button !== 0) return;
|
|
380
|
+
state.isPressed = false;
|
|
381
|
+
removeAllGlobalListeners();
|
|
382
|
+
if (state.ignoreEmulatedMouseEvents) {
|
|
383
|
+
state.ignoreEmulatedMouseEvents = false;
|
|
384
|
+
return;
|
|
385
|
+
}
|
|
386
|
+
if ($49794190ef05a7aa$var$isOverTarget(e, state.target)) triggerPressEnd($49794190ef05a7aa$var$createEvent(state.target, e), state.pointerType);
|
|
387
|
+
else if (state.isOverTarget) triggerPressEnd($49794190ef05a7aa$var$createEvent(state.target, e), state.pointerType, false);
|
|
388
|
+
state.isOverTarget = false;
|
|
389
|
+
};
|
|
390
|
+
pressProps.onTouchStart = (e)=>{
|
|
391
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
392
|
+
e.stopPropagation();
|
|
393
|
+
let touch = $49794190ef05a7aa$var$getTouchFromEvent(e.nativeEvent);
|
|
394
|
+
if (!touch) return;
|
|
395
|
+
state.activePointerId = touch.identifier;
|
|
396
|
+
state.ignoreEmulatedMouseEvents = true;
|
|
397
|
+
state.isOverTarget = true;
|
|
398
|
+
state.isPressed = true;
|
|
399
|
+
state.target = e.currentTarget;
|
|
400
|
+
state.pointerType = 'touch';
|
|
401
|
+
// Due to browser inconsistencies, especially on mobile browsers, we prevent default
|
|
402
|
+
// on the emulated mouse event and handle focusing the pressable element ourselves.
|
|
403
|
+
if (!isDisabled1 && !preventFocusOnPress) $8jK7q$reactariautils.focusWithoutScrolling(e.currentTarget);
|
|
404
|
+
if (!allowTextSelectionOnPress) $f85b19f7e83b9914$export$16a4697467175487(state.target);
|
|
405
|
+
triggerPressStart(e, state.pointerType);
|
|
406
|
+
addGlobalListener(window, 'scroll', onScroll, true);
|
|
407
|
+
};
|
|
408
|
+
pressProps.onTouchMove = (e)=>{
|
|
409
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
410
|
+
e.stopPropagation();
|
|
411
|
+
if (!state.isPressed) return;
|
|
412
|
+
let touch = $49794190ef05a7aa$var$getTouchById(e.nativeEvent, state.activePointerId);
|
|
413
|
+
if (touch && $49794190ef05a7aa$var$isOverTarget(touch, e.currentTarget)) {
|
|
414
|
+
if (!state.isOverTarget) {
|
|
415
|
+
state.isOverTarget = true;
|
|
416
|
+
triggerPressStart(e, state.pointerType);
|
|
417
|
+
}
|
|
418
|
+
} else if (state.isOverTarget) {
|
|
419
|
+
state.isOverTarget = false;
|
|
420
|
+
triggerPressEnd(e, state.pointerType, false);
|
|
421
|
+
if (propsRef.current.shouldCancelOnPointerExit) cancel(e);
|
|
422
|
+
}
|
|
423
|
+
};
|
|
424
|
+
pressProps.onTouchEnd = (e)=>{
|
|
425
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
426
|
+
e.stopPropagation();
|
|
427
|
+
if (!state.isPressed) return;
|
|
428
|
+
let touch = $49794190ef05a7aa$var$getTouchById(e.nativeEvent, state.activePointerId);
|
|
429
|
+
if (touch && $49794190ef05a7aa$var$isOverTarget(touch, e.currentTarget)) {
|
|
430
|
+
triggerPressUp(e, state.pointerType);
|
|
431
|
+
triggerPressEnd(e, state.pointerType);
|
|
432
|
+
} else if (state.isOverTarget) triggerPressEnd(e, state.pointerType, false);
|
|
433
|
+
state.isPressed = false;
|
|
434
|
+
state.activePointerId = null;
|
|
435
|
+
state.isOverTarget = false;
|
|
436
|
+
state.ignoreEmulatedMouseEvents = true;
|
|
437
|
+
if (!allowTextSelectionOnPress) $f85b19f7e83b9914$export$b0d6fa1ab32e3295(state.target);
|
|
438
|
+
removeAllGlobalListeners();
|
|
439
|
+
};
|
|
440
|
+
pressProps.onTouchCancel = (e)=>{
|
|
441
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
442
|
+
e.stopPropagation();
|
|
443
|
+
if (state.isPressed) cancel(e);
|
|
444
|
+
};
|
|
445
|
+
let onScroll = (e)=>{
|
|
446
|
+
if (state.isPressed && e.target.contains(state.target)) cancel({
|
|
447
|
+
currentTarget: state.target,
|
|
448
|
+
shiftKey: false,
|
|
449
|
+
ctrlKey: false,
|
|
450
|
+
metaKey: false,
|
|
451
|
+
altKey: false
|
|
452
|
+
});
|
|
453
|
+
};
|
|
454
|
+
pressProps.onDragStart = (e)=>{
|
|
455
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
456
|
+
cancel(e);
|
|
457
|
+
};
|
|
351
458
|
}
|
|
352
|
-
|
|
459
|
+
return pressProps;
|
|
460
|
+
}, [
|
|
461
|
+
addGlobalListener,
|
|
462
|
+
isDisabled1,
|
|
463
|
+
preventFocusOnPress,
|
|
464
|
+
removeAllGlobalListeners,
|
|
465
|
+
allowTextSelectionOnPress
|
|
466
|
+
]);
|
|
467
|
+
// Remove user-select: none in case component unmounts immediately after pressStart
|
|
468
|
+
// eslint-disable-next-line arrow-body-style
|
|
469
|
+
$8jK7q$react.useEffect(()=>{
|
|
470
|
+
return ()=>{
|
|
471
|
+
if (!allowTextSelectionOnPress) $f85b19f7e83b9914$export$b0d6fa1ab32e3295(ref.current.target);
|
|
472
|
+
};
|
|
473
|
+
}, [
|
|
474
|
+
allowTextSelectionOnPress
|
|
475
|
+
]);
|
|
476
|
+
return {
|
|
477
|
+
isPressed: isPressedProp || isPressed,
|
|
478
|
+
pressProps: $8jK7q$reactariautils.mergeProps(domProps, pressProps1)
|
|
353
479
|
};
|
|
354
|
-
|
|
355
|
-
if (typeof PointerEvent !== 'undefined') {
|
|
356
|
-
pressProps.onPointerDown = e => {
|
|
357
|
-
// Only handle left clicks, and ignore events that bubbled through portals.
|
|
358
|
-
if (e.button !== 0 || !e.currentTarget.contains(e.target)) {
|
|
359
|
-
return;
|
|
360
|
-
} // Due to browser inconsistencies, especially on mobile browsers, we prevent
|
|
361
|
-
// default on pointer down and handle focusing the pressable element ourselves.
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
if ($ed8d760564e19d8c7d03a6a4$var$shouldPreventDefault(e.target)) {
|
|
365
|
-
e.preventDefault();
|
|
366
|
-
} // iOS safari fires pointer events from VoiceOver (but only when outside an iframe...)
|
|
367
|
-
// https://bugs.webkit.org/show_bug.cgi?id=222627
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
state.pointerType = $ed8d760564e19d8c7d03a6a4$var$isVirtualPointerEvent(e.nativeEvent) ? 'virtual' : e.pointerType;
|
|
371
|
-
e.stopPropagation();
|
|
372
|
-
|
|
373
|
-
if (!state.isPressed) {
|
|
374
|
-
state.isPressed = true;
|
|
375
|
-
state.isOverTarget = true;
|
|
376
|
-
state.activePointerId = e.pointerId;
|
|
377
|
-
state.target = e.currentTarget;
|
|
378
|
-
|
|
379
|
-
if (!isDisabled && !preventFocusOnPress) {
|
|
380
|
-
focusWithoutScrolling(e.currentTarget);
|
|
381
|
-
}
|
|
382
|
-
|
|
383
|
-
$ce801cc8e3ff24b95c928e0152c7b7f2$export$disableTextSelection();
|
|
384
|
-
triggerPressStart(e, state.pointerType);
|
|
385
|
-
addGlobalListener(document, 'pointermove', onPointerMove, false);
|
|
386
|
-
addGlobalListener(document, 'pointerup', onPointerUp, false);
|
|
387
|
-
addGlobalListener(document, 'pointercancel', onPointerCancel, false);
|
|
388
|
-
}
|
|
389
|
-
};
|
|
390
|
-
|
|
391
|
-
pressProps.onMouseDown = e => {
|
|
392
|
-
if (!e.currentTarget.contains(e.target)) {
|
|
393
|
-
return;
|
|
394
|
-
}
|
|
395
|
-
|
|
396
|
-
if (e.button === 0) {
|
|
397
|
-
// Chrome and Firefox on touch Windows devices require mouse down events
|
|
398
|
-
// to be canceled in addition to pointer events, or an extra asynchronous
|
|
399
|
-
// focus event will be fired.
|
|
400
|
-
if ($ed8d760564e19d8c7d03a6a4$var$shouldPreventDefault(e.target)) {
|
|
401
|
-
e.preventDefault();
|
|
402
|
-
}
|
|
403
|
-
|
|
404
|
-
e.stopPropagation();
|
|
405
|
-
}
|
|
406
|
-
};
|
|
407
|
-
|
|
408
|
-
pressProps.onPointerUp = e => {
|
|
409
|
-
if (!e.currentTarget.contains(e.target)) {
|
|
410
|
-
return;
|
|
411
|
-
} // Only handle left clicks
|
|
412
|
-
// Safari on iOS sometimes fires pointerup events, even
|
|
413
|
-
// when the touch isn't over the target, so double check.
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
if (e.button === 0 && $ed8d760564e19d8c7d03a6a4$var$isOverTarget(e, e.currentTarget)) {
|
|
417
|
-
triggerPressUp(e, state.pointerType);
|
|
418
|
-
}
|
|
419
|
-
}; // Safari on iOS < 13.2 does not implement pointerenter/pointerleave events correctly.
|
|
420
|
-
// Use pointer move events instead to implement our own hit testing.
|
|
421
|
-
// See https://bugs.webkit.org/show_bug.cgi?id=199803
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
let onPointerMove = e => {
|
|
425
|
-
if (e.pointerId !== state.activePointerId) {
|
|
426
|
-
return;
|
|
427
|
-
}
|
|
428
|
-
|
|
429
|
-
if ($ed8d760564e19d8c7d03a6a4$var$isOverTarget(e, state.target)) {
|
|
430
|
-
if (!state.isOverTarget) {
|
|
431
|
-
state.isOverTarget = true;
|
|
432
|
-
triggerPressStart($ed8d760564e19d8c7d03a6a4$var$createEvent(state.target, e), state.pointerType);
|
|
433
|
-
}
|
|
434
|
-
} else if (state.isOverTarget) {
|
|
435
|
-
state.isOverTarget = false;
|
|
436
|
-
triggerPressEnd($ed8d760564e19d8c7d03a6a4$var$createEvent(state.target, e), state.pointerType, false);
|
|
437
|
-
}
|
|
438
|
-
};
|
|
439
|
-
|
|
440
|
-
let onPointerUp = e => {
|
|
441
|
-
if (e.pointerId === state.activePointerId && state.isPressed && e.button === 0) {
|
|
442
|
-
if ($ed8d760564e19d8c7d03a6a4$var$isOverTarget(e, state.target)) {
|
|
443
|
-
triggerPressEnd($ed8d760564e19d8c7d03a6a4$var$createEvent(state.target, e), state.pointerType);
|
|
444
|
-
} else if (state.isOverTarget) {
|
|
445
|
-
triggerPressEnd($ed8d760564e19d8c7d03a6a4$var$createEvent(state.target, e), state.pointerType, false);
|
|
446
|
-
}
|
|
447
|
-
|
|
448
|
-
state.isPressed = false;
|
|
449
|
-
state.isOverTarget = false;
|
|
450
|
-
state.activePointerId = null;
|
|
451
|
-
state.pointerType = null;
|
|
452
|
-
removeAllGlobalListeners();
|
|
453
|
-
$ce801cc8e3ff24b95c928e0152c7b7f2$export$restoreTextSelection();
|
|
454
|
-
}
|
|
455
|
-
};
|
|
456
|
-
|
|
457
|
-
let onPointerCancel = e => {
|
|
458
|
-
cancel(e);
|
|
459
|
-
};
|
|
460
|
-
|
|
461
|
-
pressProps.onDragStart = e => {
|
|
462
|
-
if (!e.currentTarget.contains(e.target)) {
|
|
463
|
-
return;
|
|
464
|
-
} // Safari does not call onPointerCancel when a drag starts, whereas Chrome and Firefox do.
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
cancel(e);
|
|
468
|
-
};
|
|
469
|
-
} else {
|
|
470
|
-
pressProps.onMouseDown = e => {
|
|
471
|
-
// Only handle left clicks
|
|
472
|
-
if (e.button !== 0 || !e.currentTarget.contains(e.target)) {
|
|
473
|
-
return;
|
|
474
|
-
} // Due to browser inconsistencies, especially on mobile browsers, we prevent
|
|
475
|
-
// default on mouse down and handle focusing the pressable element ourselves.
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
if ($ed8d760564e19d8c7d03a6a4$var$shouldPreventDefault(e.target)) {
|
|
479
|
-
e.preventDefault();
|
|
480
|
-
}
|
|
481
|
-
|
|
482
|
-
e.stopPropagation();
|
|
483
|
-
|
|
484
|
-
if (state.ignoreEmulatedMouseEvents) {
|
|
485
|
-
return;
|
|
486
|
-
}
|
|
487
|
-
|
|
488
|
-
state.isPressed = true;
|
|
489
|
-
state.isOverTarget = true;
|
|
490
|
-
state.target = e.currentTarget;
|
|
491
|
-
state.pointerType = $eda9c464f45e6c61a293990c493$export$isVirtualClick(e.nativeEvent) ? 'virtual' : 'mouse';
|
|
492
|
-
|
|
493
|
-
if (!isDisabled && !preventFocusOnPress) {
|
|
494
|
-
focusWithoutScrolling(e.currentTarget);
|
|
495
|
-
}
|
|
496
|
-
|
|
497
|
-
triggerPressStart(e, state.pointerType);
|
|
498
|
-
addGlobalListener(document, 'mouseup', onMouseUp, false);
|
|
499
|
-
};
|
|
500
|
-
|
|
501
|
-
pressProps.onMouseEnter = e => {
|
|
502
|
-
if (!e.currentTarget.contains(e.target)) {
|
|
503
|
-
return;
|
|
504
|
-
}
|
|
505
|
-
|
|
506
|
-
e.stopPropagation();
|
|
507
|
-
|
|
508
|
-
if (state.isPressed && !state.ignoreEmulatedMouseEvents) {
|
|
509
|
-
state.isOverTarget = true;
|
|
510
|
-
triggerPressStart(e, state.pointerType);
|
|
511
|
-
}
|
|
512
|
-
};
|
|
513
|
-
|
|
514
|
-
pressProps.onMouseLeave = e => {
|
|
515
|
-
if (!e.currentTarget.contains(e.target)) {
|
|
516
|
-
return;
|
|
517
|
-
}
|
|
518
|
-
|
|
519
|
-
e.stopPropagation();
|
|
520
|
-
|
|
521
|
-
if (state.isPressed && !state.ignoreEmulatedMouseEvents) {
|
|
522
|
-
state.isOverTarget = false;
|
|
523
|
-
triggerPressEnd(e, state.pointerType, false);
|
|
524
|
-
}
|
|
525
|
-
};
|
|
526
|
-
|
|
527
|
-
pressProps.onMouseUp = e => {
|
|
528
|
-
if (!e.currentTarget.contains(e.target)) {
|
|
529
|
-
return;
|
|
530
|
-
}
|
|
531
|
-
|
|
532
|
-
if (!state.ignoreEmulatedMouseEvents && e.button === 0) {
|
|
533
|
-
triggerPressUp(e, state.pointerType);
|
|
534
|
-
}
|
|
535
|
-
};
|
|
536
|
-
|
|
537
|
-
let onMouseUp = e => {
|
|
538
|
-
// Only handle left clicks
|
|
539
|
-
if (e.button !== 0) {
|
|
540
|
-
return;
|
|
541
|
-
}
|
|
542
|
-
|
|
543
|
-
state.isPressed = false;
|
|
544
|
-
removeAllGlobalListeners();
|
|
545
|
-
|
|
546
|
-
if (state.ignoreEmulatedMouseEvents) {
|
|
547
|
-
state.ignoreEmulatedMouseEvents = false;
|
|
548
|
-
return;
|
|
549
|
-
}
|
|
550
|
-
|
|
551
|
-
if ($ed8d760564e19d8c7d03a6a4$var$isOverTarget(e, state.target)) {
|
|
552
|
-
triggerPressEnd($ed8d760564e19d8c7d03a6a4$var$createEvent(state.target, e), state.pointerType);
|
|
553
|
-
} else if (state.isOverTarget) {
|
|
554
|
-
triggerPressEnd($ed8d760564e19d8c7d03a6a4$var$createEvent(state.target, e), state.pointerType, false);
|
|
555
|
-
}
|
|
556
|
-
|
|
557
|
-
state.isOverTarget = false;
|
|
558
|
-
};
|
|
559
|
-
|
|
560
|
-
pressProps.onTouchStart = e => {
|
|
561
|
-
if (!e.currentTarget.contains(e.target)) {
|
|
562
|
-
return;
|
|
563
|
-
}
|
|
564
|
-
|
|
565
|
-
e.stopPropagation();
|
|
566
|
-
let touch = $ed8d760564e19d8c7d03a6a4$var$getTouchFromEvent(e.nativeEvent);
|
|
567
|
-
|
|
568
|
-
if (!touch) {
|
|
569
|
-
return;
|
|
570
|
-
}
|
|
571
|
-
|
|
572
|
-
state.activePointerId = touch.identifier;
|
|
573
|
-
state.ignoreEmulatedMouseEvents = true;
|
|
574
|
-
state.isOverTarget = true;
|
|
575
|
-
state.isPressed = true;
|
|
576
|
-
state.target = e.currentTarget;
|
|
577
|
-
state.pointerType = 'touch'; // Due to browser inconsistencies, especially on mobile browsers, we prevent default
|
|
578
|
-
// on the emulated mouse event and handle focusing the pressable element ourselves.
|
|
579
|
-
|
|
580
|
-
if (!isDisabled && !preventFocusOnPress) {
|
|
581
|
-
focusWithoutScrolling(e.currentTarget);
|
|
582
|
-
}
|
|
583
|
-
|
|
584
|
-
$ce801cc8e3ff24b95c928e0152c7b7f2$export$disableTextSelection();
|
|
585
|
-
triggerPressStart(e, state.pointerType);
|
|
586
|
-
addGlobalListener(window, 'scroll', onScroll, true);
|
|
587
|
-
};
|
|
588
|
-
|
|
589
|
-
pressProps.onTouchMove = e => {
|
|
590
|
-
if (!e.currentTarget.contains(e.target)) {
|
|
591
|
-
return;
|
|
592
|
-
}
|
|
593
|
-
|
|
594
|
-
e.stopPropagation();
|
|
595
|
-
|
|
596
|
-
if (!state.isPressed) {
|
|
597
|
-
return;
|
|
598
|
-
}
|
|
599
|
-
|
|
600
|
-
let touch = $ed8d760564e19d8c7d03a6a4$var$getTouchById(e.nativeEvent, state.activePointerId);
|
|
601
|
-
|
|
602
|
-
if (touch && $ed8d760564e19d8c7d03a6a4$var$isOverTarget(touch, e.currentTarget)) {
|
|
603
|
-
if (!state.isOverTarget) {
|
|
604
|
-
state.isOverTarget = true;
|
|
605
|
-
triggerPressStart(e, state.pointerType);
|
|
606
|
-
}
|
|
607
|
-
} else if (state.isOverTarget) {
|
|
608
|
-
state.isOverTarget = false;
|
|
609
|
-
triggerPressEnd(e, state.pointerType, false);
|
|
610
|
-
}
|
|
611
|
-
};
|
|
612
|
-
|
|
613
|
-
pressProps.onTouchEnd = e => {
|
|
614
|
-
if (!e.currentTarget.contains(e.target)) {
|
|
615
|
-
return;
|
|
616
|
-
}
|
|
617
|
-
|
|
618
|
-
e.stopPropagation();
|
|
619
|
-
|
|
620
|
-
if (!state.isPressed) {
|
|
621
|
-
return;
|
|
622
|
-
}
|
|
623
|
-
|
|
624
|
-
let touch = $ed8d760564e19d8c7d03a6a4$var$getTouchById(e.nativeEvent, state.activePointerId);
|
|
625
|
-
|
|
626
|
-
if (touch && $ed8d760564e19d8c7d03a6a4$var$isOverTarget(touch, e.currentTarget)) {
|
|
627
|
-
triggerPressUp(e, state.pointerType);
|
|
628
|
-
triggerPressEnd(e, state.pointerType);
|
|
629
|
-
} else if (state.isOverTarget) {
|
|
630
|
-
triggerPressEnd(e, state.pointerType, false);
|
|
631
|
-
}
|
|
632
|
-
|
|
633
|
-
state.isPressed = false;
|
|
634
|
-
state.activePointerId = null;
|
|
635
|
-
state.isOverTarget = false;
|
|
636
|
-
state.ignoreEmulatedMouseEvents = true;
|
|
637
|
-
$ce801cc8e3ff24b95c928e0152c7b7f2$export$restoreTextSelection();
|
|
638
|
-
removeAllGlobalListeners();
|
|
639
|
-
};
|
|
640
|
-
|
|
641
|
-
pressProps.onTouchCancel = e => {
|
|
642
|
-
if (!e.currentTarget.contains(e.target)) {
|
|
643
|
-
return;
|
|
644
|
-
}
|
|
645
|
-
|
|
646
|
-
e.stopPropagation();
|
|
647
|
-
|
|
648
|
-
if (state.isPressed) {
|
|
649
|
-
cancel(e);
|
|
650
|
-
}
|
|
651
|
-
};
|
|
652
|
-
|
|
653
|
-
let onScroll = e => {
|
|
654
|
-
if (state.isPressed && e.target.contains(state.target)) {
|
|
655
|
-
cancel({
|
|
656
|
-
currentTarget: state.target,
|
|
657
|
-
shiftKey: false,
|
|
658
|
-
ctrlKey: false,
|
|
659
|
-
metaKey: false
|
|
660
|
-
});
|
|
661
|
-
}
|
|
662
|
-
};
|
|
663
|
-
|
|
664
|
-
pressProps.onDragStart = e => {
|
|
665
|
-
if (!e.currentTarget.contains(e.target)) {
|
|
666
|
-
return;
|
|
667
|
-
}
|
|
668
|
-
|
|
669
|
-
cancel(e);
|
|
670
|
-
};
|
|
671
|
-
}
|
|
672
|
-
|
|
673
|
-
return pressProps;
|
|
674
|
-
}, [addGlobalListener, isDisabled, preventFocusOnPress, removeAllGlobalListeners]); // Remove user-select: none in case component unmounts immediately after pressStart
|
|
675
|
-
// eslint-disable-next-line arrow-body-style
|
|
676
|
-
|
|
677
|
-
useEffect(() => {
|
|
678
|
-
return () => $ce801cc8e3ff24b95c928e0152c7b7f2$export$restoreTextSelection();
|
|
679
|
-
}, []);
|
|
680
|
-
return {
|
|
681
|
-
isPressed: isPressedProp || isPressed,
|
|
682
|
-
pressProps: mergeProps(domProps, pressProps)
|
|
683
|
-
};
|
|
684
480
|
}
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
function $ed8d760564e19d8c7d03a6a4$var$isHTMLAnchorLink(target) {
|
|
689
|
-
return target.tagName === 'A' && target.hasAttribute('href');
|
|
481
|
+
function $49794190ef05a7aa$var$isHTMLAnchorLink(target) {
|
|
482
|
+
return target.tagName === 'A' && target.hasAttribute('href');
|
|
690
483
|
}
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
isContentEditable
|
|
701
|
-
} = element;
|
|
702
|
-
const role = element.getAttribute('role'); // Accessibility for keyboards. Space and Enter only.
|
|
703
|
-
// "Spacebar" is for IE 11
|
|
704
|
-
|
|
705
|
-
return (key === 'Enter' || key === ' ' || key === 'Spacebar') && tagName !== 'INPUT' && tagName !== 'TEXTAREA' && isContentEditable !== true && ( // A link with a valid href should be handled natively,
|
|
706
|
-
// unless it also has role='button' and was triggered using Space.
|
|
707
|
-
!$ed8d760564e19d8c7d03a6a4$var$isHTMLAnchorLink(element) || role === 'button' && key !== 'Enter') && // An element with role='link' should only trigger with Enter key
|
|
708
|
-
!(role === 'link' && key !== 'Enter');
|
|
484
|
+
function $49794190ef05a7aa$var$isValidKeyboardEvent(event) {
|
|
485
|
+
const { key: key , code: code , target: target } = event;
|
|
486
|
+
const element = target;
|
|
487
|
+
const { tagName: tagName , isContentEditable: isContentEditable } = element;
|
|
488
|
+
const role = element.getAttribute('role');
|
|
489
|
+
// Accessibility for keyboards. Space and Enter only.
|
|
490
|
+
// "Spacebar" is for IE 11
|
|
491
|
+
return (key === 'Enter' || key === ' ' || key === 'Spacebar' || code === 'Space') && tagName !== 'INPUT' && tagName !== 'TEXTAREA' && isContentEditable !== true && (!$49794190ef05a7aa$var$isHTMLAnchorLink(element) || role === 'button' && key !== 'Enter') && // An element with role='link' should only trigger with Enter key
|
|
492
|
+
!(role === 'link' && key !== 'Enter');
|
|
709
493
|
}
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
} = event;
|
|
715
|
-
|
|
716
|
-
if (targetTouches.length > 0) {
|
|
717
|
-
return targetTouches[0];
|
|
718
|
-
}
|
|
719
|
-
|
|
720
|
-
return null;
|
|
494
|
+
function $49794190ef05a7aa$var$getTouchFromEvent(event) {
|
|
495
|
+
const { targetTouches: targetTouches } = event;
|
|
496
|
+
if (targetTouches.length > 0) return targetTouches[0];
|
|
497
|
+
return null;
|
|
721
498
|
}
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
const touch = changedTouches[i];
|
|
728
|
-
|
|
729
|
-
if (touch.identifier === pointerId) {
|
|
730
|
-
return touch;
|
|
499
|
+
function $49794190ef05a7aa$var$getTouchById(event, pointerId) {
|
|
500
|
+
const changedTouches = event.changedTouches;
|
|
501
|
+
for(let i = 0; i < changedTouches.length; i++){
|
|
502
|
+
const touch = changedTouches[i];
|
|
503
|
+
if (touch.identifier === pointerId) return touch;
|
|
731
504
|
}
|
|
732
|
-
|
|
733
|
-
|
|
734
|
-
return null;
|
|
505
|
+
return null;
|
|
735
506
|
}
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
507
|
+
function $49794190ef05a7aa$var$createEvent(target, e) {
|
|
508
|
+
return {
|
|
509
|
+
currentTarget: target,
|
|
510
|
+
shiftKey: e.shiftKey,
|
|
511
|
+
ctrlKey: e.ctrlKey,
|
|
512
|
+
metaKey: e.metaKey,
|
|
513
|
+
altKey: e.altKey
|
|
514
|
+
};
|
|
744
515
|
}
|
|
745
|
-
|
|
746
|
-
|
|
747
|
-
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
|
|
752
|
-
|
|
753
|
-
|
|
754
|
-
};
|
|
516
|
+
function $49794190ef05a7aa$var$getPointClientRect(point) {
|
|
517
|
+
let offsetX = point.width / 2 || point.radiusX || 0;
|
|
518
|
+
let offsetY = point.height / 2 || point.radiusY || 0;
|
|
519
|
+
return {
|
|
520
|
+
top: point.clientY - offsetY,
|
|
521
|
+
right: point.clientX + offsetX,
|
|
522
|
+
bottom: point.clientY + offsetY,
|
|
523
|
+
left: point.clientX - offsetX
|
|
524
|
+
};
|
|
755
525
|
}
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
return false;
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
if (a.top > b.bottom || b.top > a.bottom) {
|
|
765
|
-
return false;
|
|
766
|
-
}
|
|
767
|
-
|
|
768
|
-
return true;
|
|
526
|
+
function $49794190ef05a7aa$var$areRectanglesOverlapping(a, b) {
|
|
527
|
+
// check if they cannot overlap on x axis
|
|
528
|
+
if (a.left > b.right || b.left > a.right) return false;
|
|
529
|
+
// check if they cannot overlap on y axis
|
|
530
|
+
if (a.top > b.bottom || b.top > a.bottom) return false;
|
|
531
|
+
return true;
|
|
769
532
|
}
|
|
770
|
-
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
return $ed8d760564e19d8c7d03a6a4$var$areRectanglesOverlapping(rect, pointRect);
|
|
533
|
+
function $49794190ef05a7aa$var$isOverTarget(point, target) {
|
|
534
|
+
let rect = target.getBoundingClientRect();
|
|
535
|
+
let pointRect = $49794190ef05a7aa$var$getPointClientRect(point);
|
|
536
|
+
return $49794190ef05a7aa$var$areRectanglesOverlapping(rect, pointRect);
|
|
775
537
|
}
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
return !target.closest('[draggable="true"]');
|
|
538
|
+
function $49794190ef05a7aa$var$shouldPreventDefault(target) {
|
|
539
|
+
// We cannot prevent default if the target is inside a draggable element.
|
|
540
|
+
return !target.closest('[draggable="true"]');
|
|
780
541
|
}
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
542
|
+
function $49794190ef05a7aa$var$shouldPreventDefaultKeyboard(target) {
|
|
543
|
+
return !((target.tagName === 'INPUT' || target.tagName === 'BUTTON') && target.type === 'submit');
|
|
544
|
+
}
|
|
545
|
+
function $49794190ef05a7aa$var$isVirtualPointerEvent(event) {
|
|
546
|
+
// If the pointer size is zero, then we assume it's from a screen reader.
|
|
547
|
+
// Android TalkBack double tap will sometimes return a event with width and height of 1
|
|
548
|
+
// and pointerType === 'mouse' so we need to check for a specific combination of event attributes.
|
|
549
|
+
// Cannot use "event.pressure === 0" as the sole check due to Safari pointer events always returning pressure === 0
|
|
550
|
+
// instead of .5, see https://bugs.webkit.org/show_bug.cgi?id=206216
|
|
551
|
+
return event.width === 0 && event.height === 0 || event.width === 1 && event.height === 1 && event.pressure === 0 && event.detail === 0;
|
|
785
552
|
}
|
|
786
553
|
|
|
787
|
-
const Pressable = /*#__PURE__*/_react.forwardRef((_ref, ref) => {
|
|
788
|
-
var _ref2;
|
|
789
|
-
|
|
790
|
-
let {
|
|
791
|
-
children
|
|
792
|
-
} = _ref,
|
|
793
|
-
props = _babelRuntimeHelpersObjectWithoutPropertiesLoose(_ref, ["children"]);
|
|
794
|
-
|
|
795
|
-
let newRef = useRef();
|
|
796
|
-
ref = (_ref2 = ref) != null ? _ref2 : newRef;
|
|
797
|
-
let {
|
|
798
|
-
pressProps
|
|
799
|
-
} = usePress(_babelRuntimeHelpersExtends({}, props, {
|
|
800
|
-
ref
|
|
801
|
-
}));
|
|
802
554
|
|
|
803
|
-
let child = _react.Children.only(children);
|
|
804
555
|
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
ref
|
|
808
|
-
}
|
|
556
|
+
const $c7e4402d7268b9e5$export$27c701ed9e449e99 = /*#__PURE__*/ ($parcel$interopDefault($8jK7q$react)).forwardRef(({ children: children , ...props }, ref)=>{
|
|
557
|
+
let newRef = $8jK7q$react.useRef();
|
|
558
|
+
ref = ref !== null && ref !== void 0 ? ref : newRef;
|
|
559
|
+
let { pressProps: pressProps } = $49794190ef05a7aa$export$45712eceda6fad21({
|
|
560
|
+
...props,
|
|
561
|
+
ref: ref
|
|
562
|
+
});
|
|
563
|
+
let child = ($parcel$interopDefault($8jK7q$react)).Children.only(children);
|
|
564
|
+
return(/*#__PURE__*/ ($parcel$interopDefault($8jK7q$react)).cloneElement(child, // @ts-ignore
|
|
565
|
+
{
|
|
566
|
+
ref: ref,
|
|
567
|
+
...$8jK7q$reactariautils.mergeProps(child.props, pressProps)
|
|
568
|
+
}));
|
|
809
569
|
});
|
|
810
570
|
|
|
811
|
-
exports.Pressable = Pressable;
|
|
812
571
|
|
|
813
|
-
|
|
814
|
-
let {
|
|
815
|
-
children
|
|
816
|
-
} = _ref,
|
|
817
|
-
props = _babelRuntimeHelpersObjectWithoutPropertiesLoose(_ref, ["children"]);
|
|
572
|
+
var $94a1d642bd05f094$exports = {};
|
|
818
573
|
|
|
819
|
-
|
|
820
|
-
let prevContext = useContext($c6b6d42ec461c27a6a09002bf49a250e$export$PressResponderContext);
|
|
821
|
-
let context = mergeProps(prevContext || {}, _babelRuntimeHelpersExtends({}, props, {
|
|
822
|
-
ref: ref || (prevContext == null ? void 0 : prevContext.ref),
|
|
574
|
+
$parcel$export($94a1d642bd05f094$exports, "PressResponder", () => $94a1d642bd05f094$export$3351871ee4b288b8);
|
|
823
575
|
|
|
824
|
-
register() {
|
|
825
|
-
isRegistered.current = true;
|
|
826
576
|
|
|
827
|
-
if (prevContext) {
|
|
828
|
-
prevContext.register();
|
|
829
|
-
}
|
|
830
|
-
}
|
|
831
577
|
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
|
|
578
|
+
const $94a1d642bd05f094$export$3351871ee4b288b8 = /*#__PURE__*/ ($parcel$interopDefault($8jK7q$react)).forwardRef(({ children: children , ...props }, ref)=>{
|
|
579
|
+
let isRegistered = $8jK7q$react.useRef(false);
|
|
580
|
+
let prevContext = $8jK7q$react.useContext($5b5ad1e1cf57bd7c$export$5165eccb35aaadb5);
|
|
581
|
+
let context = $8jK7q$reactariautils.mergeProps(prevContext || {
|
|
582
|
+
}, {
|
|
583
|
+
...props,
|
|
584
|
+
ref: ref || (prevContext === null || prevContext === void 0 ? void 0 : prevContext.ref),
|
|
585
|
+
register () {
|
|
586
|
+
isRegistered.current = true;
|
|
587
|
+
if (prevContext) prevContext.register();
|
|
588
|
+
}
|
|
589
|
+
});
|
|
590
|
+
$8jK7q$reactariautils.useSyncRef(prevContext, ref);
|
|
591
|
+
$8jK7q$react.useEffect(()=>{
|
|
592
|
+
if (!isRegistered.current) console.warn("A PressResponder was rendered without a pressable child. Either call the usePress hook, or wrap your DOM node with <Pressable> component.");
|
|
593
|
+
}, []);
|
|
594
|
+
return(/*#__PURE__*/ ($parcel$interopDefault($8jK7q$react)).createElement($5b5ad1e1cf57bd7c$export$5165eccb35aaadb5.Provider, {
|
|
595
|
+
value: context
|
|
596
|
+
}, children));
|
|
842
597
|
});
|
|
843
598
|
|
|
844
|
-
exports.PressResponder = PressResponder;
|
|
845
599
|
|
|
846
|
-
|
|
847
|
-
// See https://github.com/facebook/react/tree/cc7c1aece46a6b69b41958d731e0fd27c94bfc6c/packages/react-interactions
|
|
600
|
+
var $5848daf14fd6f7cb$exports = {};
|
|
848
601
|
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
function useFocus(props) {
|
|
854
|
-
if (props.isDisabled) {
|
|
855
|
-
return {
|
|
856
|
-
focusProps: {}
|
|
857
|
-
};
|
|
858
|
-
}
|
|
859
|
-
|
|
860
|
-
let onFocus, onBlur;
|
|
861
|
-
|
|
862
|
-
if (props.onFocus || props.onFocusChange) {
|
|
863
|
-
onFocus = e => {
|
|
864
|
-
if (e.target === e.currentTarget) {
|
|
865
|
-
if (props.onFocus) {
|
|
866
|
-
props.onFocus(e);
|
|
602
|
+
$parcel$export($5848daf14fd6f7cb$exports, "useFocus", () => $5848daf14fd6f7cb$export$f8168d8dd8fd66e6);
|
|
603
|
+
function $5848daf14fd6f7cb$export$f8168d8dd8fd66e6(props) {
|
|
604
|
+
if (props.isDisabled) return {
|
|
605
|
+
focusProps: {
|
|
867
606
|
}
|
|
868
|
-
|
|
869
|
-
|
|
870
|
-
|
|
607
|
+
};
|
|
608
|
+
let onFocus, onBlur;
|
|
609
|
+
if (props.onFocus || props.onFocusChange) onFocus = (e)=>{
|
|
610
|
+
if (e.target === e.currentTarget) {
|
|
611
|
+
if (props.onFocus) props.onFocus(e);
|
|
612
|
+
if (props.onFocusChange) props.onFocusChange(true);
|
|
871
613
|
}
|
|
872
|
-
}
|
|
873
614
|
};
|
|
874
|
-
|
|
875
|
-
|
|
876
|
-
|
|
877
|
-
|
|
878
|
-
if (e.target === e.currentTarget) {
|
|
879
|
-
if (props.onBlur) {
|
|
880
|
-
props.onBlur(e);
|
|
615
|
+
if (props.onBlur || props.onFocusChange) onBlur = (e)=>{
|
|
616
|
+
if (e.target === e.currentTarget) {
|
|
617
|
+
if (props.onBlur) props.onBlur(e);
|
|
618
|
+
if (props.onFocusChange) props.onFocusChange(false);
|
|
881
619
|
}
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
620
|
+
};
|
|
621
|
+
return {
|
|
622
|
+
focusProps: {
|
|
623
|
+
onFocus: onFocus,
|
|
624
|
+
onBlur: onBlur
|
|
885
625
|
}
|
|
886
|
-
}
|
|
887
626
|
};
|
|
888
|
-
}
|
|
889
|
-
|
|
890
|
-
return {
|
|
891
|
-
focusProps: {
|
|
892
|
-
onFocus,
|
|
893
|
-
onBlur
|
|
894
|
-
}
|
|
895
|
-
};
|
|
896
627
|
}
|
|
897
628
|
|
|
898
|
-
exports.useFocus = useFocus;
|
|
899
|
-
let $b83372066b2b4e1d9257843b2455c$var$currentModality = null;
|
|
900
|
-
let $b83372066b2b4e1d9257843b2455c$var$changeHandlers = new Set();
|
|
901
|
-
let $b83372066b2b4e1d9257843b2455c$var$hasSetupGlobalListeners = false;
|
|
902
|
-
let $b83372066b2b4e1d9257843b2455c$var$hasEventBeforeFocus = false;
|
|
903
|
-
let $b83372066b2b4e1d9257843b2455c$var$hasBlurredWindowRecently = false; // Only Tab or Esc keys will make focus visible on text input elements
|
|
904
629
|
|
|
905
|
-
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
630
|
+
var $418794b2e2f608b3$exports = {};
|
|
631
|
+
|
|
632
|
+
$parcel$export($418794b2e2f608b3$exports, "isFocusVisible", () => $418794b2e2f608b3$export$b9b3dfddab17db27);
|
|
633
|
+
$parcel$export($418794b2e2f608b3$exports, "getInteractionModality", () => $418794b2e2f608b3$export$630ff653c5ada6a9);
|
|
634
|
+
$parcel$export($418794b2e2f608b3$exports, "setInteractionModality", () => $418794b2e2f608b3$export$8397ddfc504fdb9a);
|
|
635
|
+
$parcel$export($418794b2e2f608b3$exports, "useInteractionModality", () => $418794b2e2f608b3$export$98e20ec92f614cfe);
|
|
636
|
+
$parcel$export($418794b2e2f608b3$exports, "useFocusVisible", () => $418794b2e2f608b3$export$ffd9e5021c1fb2d6);
|
|
637
|
+
$parcel$export($418794b2e2f608b3$exports, "useFocusVisibleListener", () => $418794b2e2f608b3$export$ec71b4b83ac08ec3);
|
|
638
|
+
|
|
639
|
+
|
|
909
640
|
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
|
|
641
|
+
let $418794b2e2f608b3$var$currentModality = null;
|
|
642
|
+
let $418794b2e2f608b3$var$changeHandlers = new Set();
|
|
643
|
+
let $418794b2e2f608b3$var$hasSetupGlobalListeners = false;
|
|
644
|
+
let $418794b2e2f608b3$var$hasEventBeforeFocus = false;
|
|
645
|
+
let $418794b2e2f608b3$var$hasBlurredWindowRecently = false;
|
|
646
|
+
// Only Tab or Esc keys will make focus visible on text input elements
|
|
647
|
+
const $418794b2e2f608b3$var$FOCUS_VISIBLE_INPUT_KEYS = {
|
|
648
|
+
Tab: true,
|
|
649
|
+
Escape: true
|
|
650
|
+
};
|
|
651
|
+
function $418794b2e2f608b3$var$triggerChangeHandlers(modality, e) {
|
|
652
|
+
for (let handler of $418794b2e2f608b3$var$changeHandlers)handler(modality, e);
|
|
914
653
|
}
|
|
915
654
|
/**
|
|
916
655
|
* Helper function to determine if a KeyboardEvent is unmodified and could make keyboard focus styles visible.
|
|
917
|
-
*/
|
|
918
|
-
|
|
919
|
-
|
|
920
|
-
function $b83372066b2b4e1d9257843b2455c$var$isValidKey(e) {
|
|
921
|
-
// Control and Shift keys trigger when navigating back to the tab with keyboard.
|
|
922
|
-
return !(e.metaKey || !isMac() && e.altKey || e.ctrlKey || e.type === 'keyup' && (e.key === 'Control' || e.key === 'Shift'));
|
|
656
|
+
*/ function $418794b2e2f608b3$var$isValidKey(e) {
|
|
657
|
+
// Control and Shift keys trigger when navigating back to the tab with keyboard.
|
|
658
|
+
return !(e.metaKey || !$8jK7q$reactariautils.isMac() && e.altKey || e.ctrlKey || e.key === 'Control' || e.key === 'Shift' || e.key === 'Meta');
|
|
923
659
|
}
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
$b83372066b2b4e1d9257843b2455c$var$triggerChangeHandlers('keyboard', e);
|
|
931
|
-
}
|
|
660
|
+
function $418794b2e2f608b3$var$handleKeyboardEvent(e) {
|
|
661
|
+
$418794b2e2f608b3$var$hasEventBeforeFocus = true;
|
|
662
|
+
if ($418794b2e2f608b3$var$isValidKey(e)) {
|
|
663
|
+
$418794b2e2f608b3$var$currentModality = 'keyboard';
|
|
664
|
+
$418794b2e2f608b3$var$triggerChangeHandlers('keyboard', e);
|
|
665
|
+
}
|
|
932
666
|
}
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
|
|
937
|
-
|
|
938
|
-
|
|
939
|
-
$b83372066b2b4e1d9257843b2455c$var$triggerChangeHandlers('pointer', e);
|
|
940
|
-
}
|
|
667
|
+
function $418794b2e2f608b3$var$handlePointerEvent(e) {
|
|
668
|
+
$418794b2e2f608b3$var$currentModality = 'pointer';
|
|
669
|
+
if (e.type === 'mousedown' || e.type === 'pointerdown') {
|
|
670
|
+
$418794b2e2f608b3$var$hasEventBeforeFocus = true;
|
|
671
|
+
$418794b2e2f608b3$var$triggerChangeHandlers('pointer', e);
|
|
672
|
+
}
|
|
941
673
|
}
|
|
942
|
-
|
|
943
|
-
|
|
944
|
-
|
|
945
|
-
|
|
946
|
-
|
|
947
|
-
}
|
|
674
|
+
function $418794b2e2f608b3$var$handleClickEvent(e) {
|
|
675
|
+
if ($d82c55e531efd73a$export$60278871457622de(e)) {
|
|
676
|
+
$418794b2e2f608b3$var$hasEventBeforeFocus = true;
|
|
677
|
+
$418794b2e2f608b3$var$currentModality = 'virtual';
|
|
678
|
+
}
|
|
948
679
|
}
|
|
949
|
-
|
|
950
|
-
|
|
951
|
-
|
|
952
|
-
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
|
|
961
|
-
$
|
|
962
|
-
$b83372066b2b4e1d9257843b2455c$var$triggerChangeHandlers('virtual', e);
|
|
963
|
-
}
|
|
964
|
-
|
|
965
|
-
$b83372066b2b4e1d9257843b2455c$var$hasEventBeforeFocus = false;
|
|
966
|
-
$b83372066b2b4e1d9257843b2455c$var$hasBlurredWindowRecently = false;
|
|
680
|
+
function $418794b2e2f608b3$var$handleFocusEvent(e) {
|
|
681
|
+
// Firefox fires two extra focus events when the user first clicks into an iframe:
|
|
682
|
+
// first on the window, then on the document. We ignore these events so they don't
|
|
683
|
+
// cause keyboard focus rings to appear.
|
|
684
|
+
if (e.target === window || e.target === document) return;
|
|
685
|
+
// If a focus event occurs without a preceding keyboard or pointer event, switch to virtual modality.
|
|
686
|
+
// This occurs, for example, when navigating a form with the next/previous buttons on iOS.
|
|
687
|
+
if (!$418794b2e2f608b3$var$hasEventBeforeFocus && !$418794b2e2f608b3$var$hasBlurredWindowRecently) {
|
|
688
|
+
$418794b2e2f608b3$var$currentModality = 'virtual';
|
|
689
|
+
$418794b2e2f608b3$var$triggerChangeHandlers('virtual', e);
|
|
690
|
+
}
|
|
691
|
+
$418794b2e2f608b3$var$hasEventBeforeFocus = false;
|
|
692
|
+
$418794b2e2f608b3$var$hasBlurredWindowRecently = false;
|
|
967
693
|
}
|
|
968
|
-
|
|
969
|
-
|
|
970
|
-
|
|
971
|
-
|
|
972
|
-
|
|
973
|
-
$b83372066b2b4e1d9257843b2455c$var$hasBlurredWindowRecently = true;
|
|
694
|
+
function $418794b2e2f608b3$var$handleWindowBlur() {
|
|
695
|
+
// When the window is blurred, reset state. This is necessary when tabbing out of the window,
|
|
696
|
+
// for example, since a subsequent focus event won't be fired.
|
|
697
|
+
$418794b2e2f608b3$var$hasEventBeforeFocus = false;
|
|
698
|
+
$418794b2e2f608b3$var$hasBlurredWindowRecently = true;
|
|
974
699
|
}
|
|
975
700
|
/**
|
|
976
701
|
* Setup global event listeners to control when keyboard focus style should be visible.
|
|
977
|
-
*/
|
|
978
|
-
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
|
|
984
|
-
|
|
985
|
-
|
|
986
|
-
|
|
987
|
-
|
|
988
|
-
|
|
989
|
-
|
|
990
|
-
|
|
991
|
-
|
|
992
|
-
|
|
993
|
-
|
|
994
|
-
|
|
995
|
-
|
|
996
|
-
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
|
|
1000
|
-
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
|
|
1004
|
-
|
|
1005
|
-
document.addEventListener('pointerdown', $b83372066b2b4e1d9257843b2455c$var$handlePointerEvent, true);
|
|
1006
|
-
document.addEventListener('pointermove', $b83372066b2b4e1d9257843b2455c$var$handlePointerEvent, true);
|
|
1007
|
-
document.addEventListener('pointerup', $b83372066b2b4e1d9257843b2455c$var$handlePointerEvent, true);
|
|
1008
|
-
} else {
|
|
1009
|
-
document.addEventListener('mousedown', $b83372066b2b4e1d9257843b2455c$var$handlePointerEvent, true);
|
|
1010
|
-
document.addEventListener('mousemove', $b83372066b2b4e1d9257843b2455c$var$handlePointerEvent, true);
|
|
1011
|
-
document.addEventListener('mouseup', $b83372066b2b4e1d9257843b2455c$var$handlePointerEvent, true);
|
|
1012
|
-
}
|
|
1013
|
-
|
|
1014
|
-
$b83372066b2b4e1d9257843b2455c$var$hasSetupGlobalListeners = true;
|
|
702
|
+
*/ function $418794b2e2f608b3$var$setupGlobalFocusEvents() {
|
|
703
|
+
if (typeof window === 'undefined' || $418794b2e2f608b3$var$hasSetupGlobalListeners) return;
|
|
704
|
+
// Programmatic focus() calls shouldn't affect the current input modality.
|
|
705
|
+
// However, we need to detect other cases when a focus event occurs without
|
|
706
|
+
// a preceding user event (e.g. screen reader focus). Overriding the focus
|
|
707
|
+
// method on HTMLElement.prototype is a bit hacky, but works.
|
|
708
|
+
let focus = HTMLElement.prototype.focus;
|
|
709
|
+
HTMLElement.prototype.focus = function() {
|
|
710
|
+
$418794b2e2f608b3$var$hasEventBeforeFocus = true;
|
|
711
|
+
focus.apply(this, arguments);
|
|
712
|
+
};
|
|
713
|
+
document.addEventListener('keydown', $418794b2e2f608b3$var$handleKeyboardEvent, true);
|
|
714
|
+
document.addEventListener('keyup', $418794b2e2f608b3$var$handleKeyboardEvent, true);
|
|
715
|
+
document.addEventListener('click', $418794b2e2f608b3$var$handleClickEvent, true);
|
|
716
|
+
// Register focus events on the window so they are sure to happen
|
|
717
|
+
// before React's event listeners (registered on the document).
|
|
718
|
+
window.addEventListener('focus', $418794b2e2f608b3$var$handleFocusEvent, true);
|
|
719
|
+
window.addEventListener('blur', $418794b2e2f608b3$var$handleWindowBlur, false);
|
|
720
|
+
if (typeof PointerEvent !== 'undefined') {
|
|
721
|
+
document.addEventListener('pointerdown', $418794b2e2f608b3$var$handlePointerEvent, true);
|
|
722
|
+
document.addEventListener('pointermove', $418794b2e2f608b3$var$handlePointerEvent, true);
|
|
723
|
+
document.addEventListener('pointerup', $418794b2e2f608b3$var$handlePointerEvent, true);
|
|
724
|
+
} else {
|
|
725
|
+
document.addEventListener('mousedown', $418794b2e2f608b3$var$handlePointerEvent, true);
|
|
726
|
+
document.addEventListener('mousemove', $418794b2e2f608b3$var$handlePointerEvent, true);
|
|
727
|
+
document.addEventListener('mouseup', $418794b2e2f608b3$var$handlePointerEvent, true);
|
|
728
|
+
}
|
|
729
|
+
$418794b2e2f608b3$var$hasSetupGlobalListeners = true;
|
|
1015
730
|
}
|
|
1016
|
-
|
|
1017
731
|
if (typeof document !== 'undefined') {
|
|
1018
|
-
|
|
1019
|
-
$
|
|
1020
|
-
} else {
|
|
1021
|
-
document.addEventListener('DOMContentLoaded', $b83372066b2b4e1d9257843b2455c$var$setupGlobalFocusEvents);
|
|
1022
|
-
}
|
|
732
|
+
if (document.readyState !== 'loading') $418794b2e2f608b3$var$setupGlobalFocusEvents();
|
|
733
|
+
else document.addEventListener('DOMContentLoaded', $418794b2e2f608b3$var$setupGlobalFocusEvents);
|
|
1023
734
|
}
|
|
1024
|
-
|
|
1025
|
-
|
|
1026
|
-
*/
|
|
1027
|
-
|
|
1028
|
-
|
|
1029
|
-
function isFocusVisible() {
|
|
1030
|
-
return $b83372066b2b4e1d9257843b2455c$var$currentModality !== 'pointer';
|
|
735
|
+
function $418794b2e2f608b3$export$b9b3dfddab17db27() {
|
|
736
|
+
return $418794b2e2f608b3$var$currentModality !== 'pointer';
|
|
1031
737
|
}
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
function getInteractionModality() {
|
|
1036
|
-
return $b83372066b2b4e1d9257843b2455c$var$currentModality;
|
|
738
|
+
function $418794b2e2f608b3$export$630ff653c5ada6a9() {
|
|
739
|
+
return $418794b2e2f608b3$var$currentModality;
|
|
1037
740
|
}
|
|
1038
|
-
|
|
1039
|
-
|
|
1040
|
-
|
|
1041
|
-
function setInteractionModality(modality) {
|
|
1042
|
-
$b83372066b2b4e1d9257843b2455c$var$currentModality = modality;
|
|
1043
|
-
$b83372066b2b4e1d9257843b2455c$var$triggerChangeHandlers(modality, null);
|
|
741
|
+
function $418794b2e2f608b3$export$8397ddfc504fdb9a(modality) {
|
|
742
|
+
$418794b2e2f608b3$var$currentModality = modality;
|
|
743
|
+
$418794b2e2f608b3$var$triggerChangeHandlers(modality, null);
|
|
1044
744
|
}
|
|
1045
|
-
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
|
|
1049
|
-
|
|
1050
|
-
|
|
1051
|
-
|
|
1052
|
-
|
|
1053
|
-
|
|
1054
|
-
|
|
1055
|
-
|
|
1056
|
-
|
|
1057
|
-
|
|
1058
|
-
};
|
|
1059
|
-
|
|
1060
|
-
$b83372066b2b4e1d9257843b2455c$var$changeHandlers.add(handler);
|
|
1061
|
-
return () => {
|
|
1062
|
-
$b83372066b2b4e1d9257843b2455c$var$changeHandlers.delete(handler);
|
|
1063
|
-
};
|
|
1064
|
-
}, []);
|
|
1065
|
-
return modality;
|
|
745
|
+
function $418794b2e2f608b3$export$98e20ec92f614cfe() {
|
|
746
|
+
$418794b2e2f608b3$var$setupGlobalFocusEvents();
|
|
747
|
+
let [modality, setModality] = $8jK7q$react.useState($418794b2e2f608b3$var$currentModality);
|
|
748
|
+
$8jK7q$react.useEffect(()=>{
|
|
749
|
+
let handler = ()=>{
|
|
750
|
+
setModality($418794b2e2f608b3$var$currentModality);
|
|
751
|
+
};
|
|
752
|
+
$418794b2e2f608b3$var$changeHandlers.add(handler);
|
|
753
|
+
return ()=>{
|
|
754
|
+
$418794b2e2f608b3$var$changeHandlers.delete(handler);
|
|
755
|
+
};
|
|
756
|
+
}, []);
|
|
757
|
+
return modality;
|
|
1066
758
|
}
|
|
1067
759
|
/**
|
|
1068
760
|
* If this is attached to text input component, return if the event is a focus event (Tab/Escape keys pressed) so that
|
|
1069
761
|
* focus visible style can be properly set.
|
|
1070
|
-
*/
|
|
1071
|
-
|
|
1072
|
-
|
|
1073
|
-
exports.useInteractionModality = useInteractionModality;
|
|
1074
|
-
|
|
1075
|
-
function $b83372066b2b4e1d9257843b2455c$var$isKeyboardFocusEvent(isTextInput, modality, e) {
|
|
1076
|
-
return !(isTextInput && modality === 'keyboard' && e instanceof KeyboardEvent && !$b83372066b2b4e1d9257843b2455c$var$FOCUS_VISIBLE_INPUT_KEYS[e.key]);
|
|
762
|
+
*/ function $418794b2e2f608b3$var$isKeyboardFocusEvent(isTextInput, modality, e) {
|
|
763
|
+
return !(isTextInput && modality === 'keyboard' && e instanceof KeyboardEvent && !$418794b2e2f608b3$var$FOCUS_VISIBLE_INPUT_KEYS[e.key]);
|
|
1077
764
|
}
|
|
1078
|
-
|
|
1079
|
-
|
|
1080
|
-
|
|
1081
|
-
|
|
1082
|
-
|
|
1083
|
-
|
|
1084
|
-
|
|
1085
|
-
|
|
1086
|
-
|
|
1087
|
-
|
|
1088
|
-
|
|
1089
|
-
|
|
1090
|
-
|
|
1091
|
-
|
|
1092
|
-
|
|
1093
|
-
|
|
1094
|
-
|
|
1095
|
-
|
|
1096
|
-
|
|
1097
|
-
|
|
1098
|
-
|
|
1099
|
-
|
|
1100
|
-
|
|
765
|
+
function $418794b2e2f608b3$export$ffd9e5021c1fb2d6(props = {
|
|
766
|
+
}) {
|
|
767
|
+
let { isTextInput: isTextInput , autoFocus: autoFocus } = props;
|
|
768
|
+
let [isFocusVisibleState, setFocusVisible] = $8jK7q$react.useState(autoFocus || $418794b2e2f608b3$export$b9b3dfddab17db27());
|
|
769
|
+
$418794b2e2f608b3$export$ec71b4b83ac08ec3(($418794b2e2f608b3$export$b9b3dfddab17db27)=>{
|
|
770
|
+
setFocusVisible($418794b2e2f608b3$export$b9b3dfddab17db27);
|
|
771
|
+
}, [
|
|
772
|
+
isTextInput
|
|
773
|
+
], {
|
|
774
|
+
isTextInput: isTextInput
|
|
775
|
+
});
|
|
776
|
+
return {
|
|
777
|
+
isFocusVisible: isFocusVisibleState
|
|
778
|
+
};
|
|
779
|
+
}
|
|
780
|
+
function $418794b2e2f608b3$export$ec71b4b83ac08ec3(fn, deps, opts) {
|
|
781
|
+
$418794b2e2f608b3$var$setupGlobalFocusEvents();
|
|
782
|
+
$8jK7q$react.useEffect(()=>{
|
|
783
|
+
let handler = (modality, e)=>{
|
|
784
|
+
if (!$418794b2e2f608b3$var$isKeyboardFocusEvent(opts === null || opts === void 0 ? void 0 : opts.isTextInput, modality, e)) return;
|
|
785
|
+
fn($418794b2e2f608b3$export$b9b3dfddab17db27());
|
|
786
|
+
};
|
|
787
|
+
$418794b2e2f608b3$var$changeHandlers.add(handler);
|
|
788
|
+
return ()=>{
|
|
789
|
+
$418794b2e2f608b3$var$changeHandlers.delete(handler);
|
|
790
|
+
};
|
|
791
|
+
}, deps);
|
|
1101
792
|
}
|
|
1102
|
-
/**
|
|
1103
|
-
* Listens for trigger change and reports if focus is visible (i.e., modality is not pointer).
|
|
1104
|
-
*/
|
|
1105
793
|
|
|
1106
794
|
|
|
1107
|
-
exports
|
|
795
|
+
var $62b9c773b0fd3946$exports = {};
|
|
1108
796
|
|
|
1109
|
-
|
|
1110
|
-
$b83372066b2b4e1d9257843b2455c$var$setupGlobalFocusEvents();
|
|
1111
|
-
useEffect(() => {
|
|
1112
|
-
let handler = (modality, e) => {
|
|
1113
|
-
if (!$b83372066b2b4e1d9257843b2455c$var$isKeyboardFocusEvent(opts == null ? void 0 : opts.isTextInput, modality, e)) {
|
|
1114
|
-
return;
|
|
1115
|
-
}
|
|
797
|
+
$parcel$export($62b9c773b0fd3946$exports, "useFocusWithin", () => $62b9c773b0fd3946$export$420e68273165f4ec);
|
|
1116
798
|
|
|
1117
|
-
|
|
799
|
+
function $62b9c773b0fd3946$export$420e68273165f4ec(props) {
|
|
800
|
+
let state = $8jK7q$react.useRef({
|
|
801
|
+
isFocusWithin: false
|
|
802
|
+
}).current;
|
|
803
|
+
if (props.isDisabled) return {
|
|
804
|
+
focusWithinProps: {
|
|
805
|
+
}
|
|
806
|
+
};
|
|
807
|
+
let onFocus = (e)=>{
|
|
808
|
+
if (!state.isFocusWithin) {
|
|
809
|
+
if (props.onFocusWithin) props.onFocusWithin(e);
|
|
810
|
+
if (props.onFocusWithinChange) props.onFocusWithinChange(true);
|
|
811
|
+
state.isFocusWithin = true;
|
|
812
|
+
}
|
|
813
|
+
};
|
|
814
|
+
let onBlur = (e)=>{
|
|
815
|
+
// We don't want to trigger onBlurWithin and then immediately onFocusWithin again
|
|
816
|
+
// when moving focus inside the element. Only trigger if the currentTarget doesn't
|
|
817
|
+
// include the relatedTarget (where focus is moving).
|
|
818
|
+
if (state.isFocusWithin && !e.currentTarget.contains(e.relatedTarget)) {
|
|
819
|
+
if (props.onBlurWithin) props.onBlurWithin(e);
|
|
820
|
+
if (props.onFocusWithinChange) props.onFocusWithinChange(false);
|
|
821
|
+
state.isFocusWithin = false;
|
|
822
|
+
}
|
|
1118
823
|
};
|
|
1119
|
-
|
|
1120
|
-
$b83372066b2b4e1d9257843b2455c$var$changeHandlers.add(handler);
|
|
1121
|
-
return () => $b83372066b2b4e1d9257843b2455c$var$changeHandlers.delete(handler);
|
|
1122
|
-
}, deps);
|
|
1123
|
-
}
|
|
1124
|
-
|
|
1125
|
-
exports.useFocusVisibleListener = useFocusVisibleListener;
|
|
1126
|
-
|
|
1127
|
-
/**
|
|
1128
|
-
* Handles focus events for the target and its descendants.
|
|
1129
|
-
*/
|
|
1130
|
-
function useFocusWithin(props) {
|
|
1131
|
-
let state = useRef({
|
|
1132
|
-
isFocusWithin: false
|
|
1133
|
-
}).current;
|
|
1134
|
-
|
|
1135
|
-
if (props.isDisabled) {
|
|
1136
824
|
return {
|
|
1137
|
-
|
|
825
|
+
focusWithinProps: {
|
|
826
|
+
onFocus: onFocus,
|
|
827
|
+
onBlur: onBlur
|
|
828
|
+
}
|
|
1138
829
|
};
|
|
1139
|
-
|
|
1140
|
-
|
|
1141
|
-
let onFocus = e => {
|
|
1142
|
-
if (!state.isFocusWithin) {
|
|
1143
|
-
if (props.onFocusWithin) {
|
|
1144
|
-
props.onFocusWithin(e);
|
|
1145
|
-
}
|
|
1146
|
-
|
|
1147
|
-
if (props.onFocusWithinChange) {
|
|
1148
|
-
props.onFocusWithinChange(true);
|
|
1149
|
-
}
|
|
830
|
+
}
|
|
1150
831
|
|
|
1151
|
-
state.isFocusWithin = true;
|
|
1152
|
-
}
|
|
1153
|
-
};
|
|
1154
|
-
|
|
1155
|
-
let onBlur = e => {
|
|
1156
|
-
// We don't want to trigger onBlurWithin and then immediately onFocusWithin again
|
|
1157
|
-
// when moving focus inside the element. Only trigger if the currentTarget doesn't
|
|
1158
|
-
// include the relatedTarget (where focus is moving).
|
|
1159
|
-
if (state.isFocusWithin && !e.currentTarget.contains(e.relatedTarget)) {
|
|
1160
|
-
if (props.onBlurWithin) {
|
|
1161
|
-
props.onBlurWithin(e);
|
|
1162
|
-
}
|
|
1163
832
|
|
|
1164
|
-
|
|
1165
|
-
props.onFocusWithinChange(false);
|
|
1166
|
-
}
|
|
833
|
+
var $deea67f305dbdcff$exports = {};
|
|
1167
834
|
|
|
1168
|
-
|
|
1169
|
-
}
|
|
1170
|
-
};
|
|
835
|
+
$parcel$export($deea67f305dbdcff$exports, "useHover", () => $deea67f305dbdcff$export$ae780daf29e6d456);
|
|
1171
836
|
|
|
1172
|
-
return {
|
|
1173
|
-
focusWithinProps: {
|
|
1174
|
-
onFocus: onFocus,
|
|
1175
|
-
onBlur: onBlur
|
|
1176
|
-
}
|
|
1177
|
-
};
|
|
1178
|
-
}
|
|
1179
|
-
|
|
1180
|
-
exports.useFocusWithin = useFocusWithin;
|
|
1181
837
|
// iOS fires onPointerEnter twice: once with pointerType="touch" and again with pointerType="mouse".
|
|
1182
838
|
// We want to ignore these emulated events so they do not trigger hover behavior.
|
|
1183
839
|
// See https://bugs.webkit.org/show_bug.cgi?id=214609.
|
|
1184
|
-
let $
|
|
1185
|
-
let $
|
|
1186
|
-
|
|
1187
|
-
|
|
1188
|
-
|
|
1189
|
-
|
|
1190
|
-
|
|
1191
|
-
|
|
1192
|
-
|
|
1193
|
-
|
|
1194
|
-
|
|
1195
|
-
}, 50);
|
|
840
|
+
let $deea67f305dbdcff$var$globalIgnoreEmulatedMouseEvents = false;
|
|
841
|
+
let $deea67f305dbdcff$var$hoverCount = 0;
|
|
842
|
+
function $deea67f305dbdcff$var$setGlobalIgnoreEmulatedMouseEvents() {
|
|
843
|
+
$deea67f305dbdcff$var$globalIgnoreEmulatedMouseEvents = true;
|
|
844
|
+
// Clear globalIgnoreEmulatedMouseEvents after a short timeout. iOS fires onPointerEnter
|
|
845
|
+
// with pointerType="mouse" immediately after onPointerUp and before onFocus. On other
|
|
846
|
+
// devices that don't have this quirk, we don't want to ignore a mouse hover sometime in
|
|
847
|
+
// the distant future because a user previously touched the element.
|
|
848
|
+
setTimeout(()=>{
|
|
849
|
+
$deea67f305dbdcff$var$globalIgnoreEmulatedMouseEvents = false;
|
|
850
|
+
}, 50);
|
|
1196
851
|
}
|
|
1197
|
-
|
|
1198
|
-
|
|
1199
|
-
if (e.pointerType === 'touch') {
|
|
1200
|
-
$c4bc39b19aed2151a14d70718d3e34b1$var$setGlobalIgnoreEmulatedMouseEvents();
|
|
1201
|
-
}
|
|
1202
|
-
}
|
|
1203
|
-
|
|
1204
|
-
function $c4bc39b19aed2151a14d70718d3e34b1$var$setupGlobalTouchEvents() {
|
|
1205
|
-
if (typeof document === 'undefined') {
|
|
1206
|
-
return;
|
|
1207
|
-
}
|
|
1208
|
-
|
|
1209
|
-
if (typeof PointerEvent !== 'undefined') {
|
|
1210
|
-
document.addEventListener('pointerup', $c4bc39b19aed2151a14d70718d3e34b1$var$handleGlobalPointerEvent);
|
|
1211
|
-
} else {
|
|
1212
|
-
document.addEventListener('touchend', $c4bc39b19aed2151a14d70718d3e34b1$var$setGlobalIgnoreEmulatedMouseEvents);
|
|
1213
|
-
}
|
|
1214
|
-
|
|
1215
|
-
$c4bc39b19aed2151a14d70718d3e34b1$var$hoverCount++;
|
|
1216
|
-
return () => {
|
|
1217
|
-
$c4bc39b19aed2151a14d70718d3e34b1$var$hoverCount--;
|
|
1218
|
-
|
|
1219
|
-
if ($c4bc39b19aed2151a14d70718d3e34b1$var$hoverCount > 0) {
|
|
1220
|
-
return;
|
|
1221
|
-
}
|
|
1222
|
-
|
|
1223
|
-
if (typeof PointerEvent !== 'undefined') {
|
|
1224
|
-
document.removeEventListener('pointerup', $c4bc39b19aed2151a14d70718d3e34b1$var$handleGlobalPointerEvent);
|
|
1225
|
-
} else {
|
|
1226
|
-
document.removeEventListener('touchend', $c4bc39b19aed2151a14d70718d3e34b1$var$setGlobalIgnoreEmulatedMouseEvents);
|
|
1227
|
-
}
|
|
1228
|
-
};
|
|
852
|
+
function $deea67f305dbdcff$var$handleGlobalPointerEvent(e) {
|
|
853
|
+
if (e.pointerType === 'touch') $deea67f305dbdcff$var$setGlobalIgnoreEmulatedMouseEvents();
|
|
1229
854
|
}
|
|
1230
|
-
|
|
1231
|
-
|
|
1232
|
-
|
|
1233
|
-
|
|
1234
|
-
|
|
1235
|
-
|
|
1236
|
-
|
|
1237
|
-
|
|
1238
|
-
|
|
1239
|
-
|
|
1240
|
-
onHoverEnd,
|
|
1241
|
-
isDisabled
|
|
1242
|
-
} = props;
|
|
1243
|
-
let [isHovered, setHovered] = useState(false);
|
|
1244
|
-
let state = useRef({
|
|
1245
|
-
isHovered: false,
|
|
1246
|
-
ignoreEmulatedMouseEvents: false,
|
|
1247
|
-
pointerType: '',
|
|
1248
|
-
target: null
|
|
1249
|
-
}).current;
|
|
1250
|
-
useEffect($c4bc39b19aed2151a14d70718d3e34b1$var$setupGlobalTouchEvents, []);
|
|
1251
|
-
let {
|
|
1252
|
-
hoverProps,
|
|
1253
|
-
triggerHoverEnd
|
|
1254
|
-
} = useMemo(() => {
|
|
1255
|
-
let triggerHoverStart = (event, pointerType) => {
|
|
1256
|
-
state.pointerType = pointerType;
|
|
1257
|
-
|
|
1258
|
-
if (isDisabled || pointerType === 'touch' || state.isHovered || !event.currentTarget.contains(event.target)) {
|
|
1259
|
-
return;
|
|
1260
|
-
}
|
|
1261
|
-
|
|
1262
|
-
state.isHovered = true;
|
|
1263
|
-
let target = event.target;
|
|
1264
|
-
state.target = target;
|
|
1265
|
-
|
|
1266
|
-
if (onHoverStart) {
|
|
1267
|
-
onHoverStart({
|
|
1268
|
-
type: 'hoverstart',
|
|
1269
|
-
target,
|
|
1270
|
-
pointerType
|
|
1271
|
-
});
|
|
1272
|
-
}
|
|
1273
|
-
|
|
1274
|
-
if (onHoverChange) {
|
|
1275
|
-
onHoverChange(true);
|
|
1276
|
-
}
|
|
1277
|
-
|
|
1278
|
-
setHovered(true);
|
|
855
|
+
function $deea67f305dbdcff$var$setupGlobalTouchEvents() {
|
|
856
|
+
if (typeof document === 'undefined') return;
|
|
857
|
+
if (typeof PointerEvent !== 'undefined') document.addEventListener('pointerup', $deea67f305dbdcff$var$handleGlobalPointerEvent);
|
|
858
|
+
else document.addEventListener('touchend', $deea67f305dbdcff$var$setGlobalIgnoreEmulatedMouseEvents);
|
|
859
|
+
$deea67f305dbdcff$var$hoverCount++;
|
|
860
|
+
return ()=>{
|
|
861
|
+
$deea67f305dbdcff$var$hoverCount--;
|
|
862
|
+
if ($deea67f305dbdcff$var$hoverCount > 0) return;
|
|
863
|
+
if (typeof PointerEvent !== 'undefined') document.removeEventListener('pointerup', $deea67f305dbdcff$var$handleGlobalPointerEvent);
|
|
864
|
+
else document.removeEventListener('touchend', $deea67f305dbdcff$var$setGlobalIgnoreEmulatedMouseEvents);
|
|
1279
865
|
};
|
|
1280
|
-
|
|
1281
|
-
|
|
1282
|
-
|
|
1283
|
-
|
|
1284
|
-
|
|
1285
|
-
|
|
1286
|
-
|
|
1287
|
-
|
|
1288
|
-
|
|
1289
|
-
|
|
1290
|
-
|
|
1291
|
-
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
|
|
1301
|
-
|
|
1302
|
-
|
|
1303
|
-
|
|
1304
|
-
|
|
1305
|
-
|
|
1306
|
-
|
|
1307
|
-
|
|
1308
|
-
|
|
1309
|
-
|
|
1310
|
-
|
|
1311
|
-
|
|
1312
|
-
|
|
1313
|
-
|
|
1314
|
-
|
|
1315
|
-
|
|
1316
|
-
|
|
1317
|
-
|
|
1318
|
-
|
|
1319
|
-
|
|
1320
|
-
|
|
1321
|
-
}
|
|
1322
|
-
|
|
1323
|
-
|
|
1324
|
-
|
|
1325
|
-
|
|
1326
|
-
|
|
1327
|
-
|
|
1328
|
-
|
|
1329
|
-
|
|
1330
|
-
|
|
1331
|
-
|
|
1332
|
-
|
|
1333
|
-
|
|
1334
|
-
|
|
1335
|
-
|
|
1336
|
-
|
|
1337
|
-
|
|
1338
|
-
|
|
866
|
+
}
|
|
867
|
+
function $deea67f305dbdcff$export$ae780daf29e6d456(props) {
|
|
868
|
+
let { onHoverStart: onHoverStart , onHoverChange: onHoverChange , onHoverEnd: onHoverEnd , isDisabled: isDisabled } = props;
|
|
869
|
+
let [isHovered, setHovered] = $8jK7q$react.useState(false);
|
|
870
|
+
let state = $8jK7q$react.useRef({
|
|
871
|
+
isHovered: false,
|
|
872
|
+
ignoreEmulatedMouseEvents: false,
|
|
873
|
+
pointerType: '',
|
|
874
|
+
target: null
|
|
875
|
+
}).current;
|
|
876
|
+
$8jK7q$react.useEffect($deea67f305dbdcff$var$setupGlobalTouchEvents, []);
|
|
877
|
+
let { hoverProps: hoverProps1 , triggerHoverEnd: triggerHoverEnd1 } = $8jK7q$react.useMemo(()=>{
|
|
878
|
+
let triggerHoverStart = (event, pointerType)=>{
|
|
879
|
+
state.pointerType = pointerType;
|
|
880
|
+
if (isDisabled || pointerType === 'touch' || state.isHovered || !event.currentTarget.contains(event.target)) return;
|
|
881
|
+
state.isHovered = true;
|
|
882
|
+
let target = event.currentTarget;
|
|
883
|
+
state.target = target;
|
|
884
|
+
if (onHoverStart) onHoverStart({
|
|
885
|
+
type: 'hoverstart',
|
|
886
|
+
target: target,
|
|
887
|
+
pointerType: pointerType
|
|
888
|
+
});
|
|
889
|
+
if (onHoverChange) onHoverChange(true);
|
|
890
|
+
setHovered(true);
|
|
891
|
+
};
|
|
892
|
+
let triggerHoverEnd = (event, pointerType)=>{
|
|
893
|
+
state.pointerType = '';
|
|
894
|
+
state.target = null;
|
|
895
|
+
if (pointerType === 'touch' || !state.isHovered) return;
|
|
896
|
+
state.isHovered = false;
|
|
897
|
+
let target = event.currentTarget;
|
|
898
|
+
if (onHoverEnd) onHoverEnd({
|
|
899
|
+
type: 'hoverend',
|
|
900
|
+
target: target,
|
|
901
|
+
pointerType: pointerType
|
|
902
|
+
});
|
|
903
|
+
if (onHoverChange) onHoverChange(false);
|
|
904
|
+
setHovered(false);
|
|
905
|
+
};
|
|
906
|
+
let hoverProps = {
|
|
907
|
+
};
|
|
908
|
+
if (typeof PointerEvent !== 'undefined') {
|
|
909
|
+
hoverProps.onPointerEnter = (e)=>{
|
|
910
|
+
if ($deea67f305dbdcff$var$globalIgnoreEmulatedMouseEvents && e.pointerType === 'mouse') return;
|
|
911
|
+
triggerHoverStart(e, e.pointerType);
|
|
912
|
+
};
|
|
913
|
+
hoverProps.onPointerLeave = (e)=>{
|
|
914
|
+
if (!isDisabled && e.currentTarget.contains(e.target)) triggerHoverEnd(e, e.pointerType);
|
|
915
|
+
};
|
|
916
|
+
} else {
|
|
917
|
+
hoverProps.onTouchStart = ()=>{
|
|
918
|
+
state.ignoreEmulatedMouseEvents = true;
|
|
919
|
+
};
|
|
920
|
+
hoverProps.onMouseEnter = (e)=>{
|
|
921
|
+
if (!state.ignoreEmulatedMouseEvents && !$deea67f305dbdcff$var$globalIgnoreEmulatedMouseEvents) triggerHoverStart(e, 'mouse');
|
|
922
|
+
state.ignoreEmulatedMouseEvents = false;
|
|
923
|
+
};
|
|
924
|
+
hoverProps.onMouseLeave = (e)=>{
|
|
925
|
+
if (!isDisabled && e.currentTarget.contains(e.target)) triggerHoverEnd(e, 'mouse');
|
|
926
|
+
};
|
|
1339
927
|
}
|
|
1340
|
-
|
|
1341
|
-
|
|
1342
|
-
|
|
928
|
+
return {
|
|
929
|
+
hoverProps: hoverProps,
|
|
930
|
+
triggerHoverEnd: triggerHoverEnd
|
|
931
|
+
};
|
|
932
|
+
}, [
|
|
933
|
+
onHoverStart,
|
|
934
|
+
onHoverChange,
|
|
935
|
+
onHoverEnd,
|
|
936
|
+
isDisabled,
|
|
937
|
+
state
|
|
938
|
+
]);
|
|
939
|
+
$8jK7q$react.useEffect(()=>{
|
|
940
|
+
// Call the triggerHoverEnd as soon as isDisabled changes to true
|
|
941
|
+
// Safe to call triggerHoverEnd, it will early return if we aren't currently hovering
|
|
942
|
+
if (isDisabled) triggerHoverEnd1({
|
|
943
|
+
currentTarget: state.target
|
|
944
|
+
}, state.pointerType);
|
|
945
|
+
}, [
|
|
946
|
+
isDisabled
|
|
947
|
+
]);
|
|
1343
948
|
return {
|
|
1344
|
-
|
|
1345
|
-
|
|
949
|
+
hoverProps: hoverProps1,
|
|
950
|
+
isHovered: isHovered
|
|
1346
951
|
};
|
|
1347
|
-
}, [onHoverStart, onHoverChange, onHoverEnd, isDisabled, state]);
|
|
1348
|
-
useEffect(() => {
|
|
1349
|
-
// Call the triggerHoverEnd as soon as isDisabled changes to true
|
|
1350
|
-
// Safe to call triggerHoverEnd, it will early return if we aren't currently hovering
|
|
1351
|
-
if (isDisabled) {
|
|
1352
|
-
triggerHoverEnd({
|
|
1353
|
-
target: state.target
|
|
1354
|
-
}, state.pointerType);
|
|
1355
|
-
}
|
|
1356
|
-
}, [isDisabled]);
|
|
1357
|
-
return {
|
|
1358
|
-
hoverProps,
|
|
1359
|
-
isHovered
|
|
1360
|
-
};
|
|
1361
952
|
}
|
|
1362
953
|
|
|
1363
|
-
exports.useHover = useHover;
|
|
1364
|
-
|
|
1365
|
-
/**
|
|
1366
|
-
* Example, used in components like Dialogs and Popovers so they can close
|
|
1367
|
-
* when a user clicks outside them.
|
|
1368
|
-
*/
|
|
1369
|
-
function useInteractOutside(props) {
|
|
1370
|
-
let {
|
|
1371
|
-
ref,
|
|
1372
|
-
onInteractOutside,
|
|
1373
|
-
isDisabled,
|
|
1374
|
-
onInteractOutsideStart
|
|
1375
|
-
} = props;
|
|
1376
|
-
let stateRef = useRef({
|
|
1377
|
-
isPointerDown: false,
|
|
1378
|
-
ignoreEmulatedMouseEvents: false,
|
|
1379
|
-
onInteractOutside,
|
|
1380
|
-
onInteractOutsideStart
|
|
1381
|
-
});
|
|
1382
|
-
let state = stateRef.current;
|
|
1383
|
-
state.onInteractOutside = onInteractOutside;
|
|
1384
|
-
state.onInteractOutsideStart = onInteractOutsideStart;
|
|
1385
|
-
useEffect(() => {
|
|
1386
|
-
if (isDisabled) {
|
|
1387
|
-
return;
|
|
1388
|
-
}
|
|
1389
954
|
|
|
1390
|
-
|
|
1391
|
-
if ($f07e167670fb16f6a9d7f8a0eda7e156$var$isValidEvent(e, ref) && state.onInteractOutside) {
|
|
1392
|
-
if (state.onInteractOutsideStart) {
|
|
1393
|
-
state.onInteractOutsideStart(e);
|
|
1394
|
-
}
|
|
1395
|
-
|
|
1396
|
-
state.isPointerDown = true;
|
|
1397
|
-
}
|
|
1398
|
-
}; // Use pointer events if available. Otherwise, fall back to mouse and touch events.
|
|
1399
|
-
|
|
1400
|
-
|
|
1401
|
-
if (typeof PointerEvent !== 'undefined') {
|
|
1402
|
-
let onPointerUp = e => {
|
|
1403
|
-
if (state.isPointerDown && state.onInteractOutside && $f07e167670fb16f6a9d7f8a0eda7e156$var$isValidEvent(e, ref)) {
|
|
1404
|
-
state.isPointerDown = false;
|
|
1405
|
-
state.onInteractOutside(e);
|
|
1406
|
-
}
|
|
1407
|
-
}; // changing these to capture phase fixed combobox
|
|
955
|
+
var $0c6336b20c83c923$exports = {};
|
|
1408
956
|
|
|
957
|
+
$parcel$export($0c6336b20c83c923$exports, "useInteractOutside", () => $0c6336b20c83c923$export$872b660ac5a1ff98);
|
|
1409
958
|
|
|
1410
|
-
|
|
1411
|
-
|
|
1412
|
-
|
|
1413
|
-
|
|
1414
|
-
|
|
1415
|
-
|
|
1416
|
-
|
|
1417
|
-
|
|
1418
|
-
|
|
1419
|
-
|
|
1420
|
-
|
|
1421
|
-
|
|
1422
|
-
|
|
1423
|
-
|
|
1424
|
-
|
|
1425
|
-
|
|
1426
|
-
|
|
1427
|
-
|
|
1428
|
-
|
|
1429
|
-
if
|
|
1430
|
-
|
|
1431
|
-
|
|
959
|
+
function $0c6336b20c83c923$export$872b660ac5a1ff98(props) {
|
|
960
|
+
let { ref: ref , onInteractOutside: onInteractOutside , isDisabled: isDisabled , onInteractOutsideStart: onInteractOutsideStart } = props;
|
|
961
|
+
let stateRef = $8jK7q$react.useRef({
|
|
962
|
+
isPointerDown: false,
|
|
963
|
+
ignoreEmulatedMouseEvents: false,
|
|
964
|
+
onInteractOutside: onInteractOutside,
|
|
965
|
+
onInteractOutsideStart: onInteractOutsideStart
|
|
966
|
+
});
|
|
967
|
+
let state = stateRef.current;
|
|
968
|
+
state.onInteractOutside = onInteractOutside;
|
|
969
|
+
state.onInteractOutsideStart = onInteractOutsideStart;
|
|
970
|
+
$8jK7q$react.useEffect(()=>{
|
|
971
|
+
if (isDisabled) return;
|
|
972
|
+
let onPointerDown = (e)=>{
|
|
973
|
+
if ($0c6336b20c83c923$var$isValidEvent(e, ref) && state.onInteractOutside) {
|
|
974
|
+
if (state.onInteractOutsideStart) state.onInteractOutsideStart(e);
|
|
975
|
+
state.isPointerDown = true;
|
|
976
|
+
}
|
|
977
|
+
};
|
|
978
|
+
// Use pointer events if available. Otherwise, fall back to mouse and touch events.
|
|
979
|
+
if (typeof PointerEvent !== 'undefined') {
|
|
980
|
+
let onPointerUp = (e)=>{
|
|
981
|
+
if (state.isPointerDown && state.onInteractOutside && $0c6336b20c83c923$var$isValidEvent(e, ref)) {
|
|
982
|
+
state.isPointerDown = false;
|
|
983
|
+
state.onInteractOutside(e);
|
|
984
|
+
}
|
|
985
|
+
};
|
|
986
|
+
// changing these to capture phase fixed combobox
|
|
987
|
+
document.addEventListener('pointerdown', onPointerDown, true);
|
|
988
|
+
document.addEventListener('pointerup', onPointerUp, true);
|
|
989
|
+
return ()=>{
|
|
990
|
+
document.removeEventListener('pointerdown', onPointerDown, true);
|
|
991
|
+
document.removeEventListener('pointerup', onPointerUp, true);
|
|
992
|
+
};
|
|
993
|
+
} else {
|
|
994
|
+
let onMouseUp = (e)=>{
|
|
995
|
+
if (state.ignoreEmulatedMouseEvents) state.ignoreEmulatedMouseEvents = false;
|
|
996
|
+
else if (state.isPointerDown && state.onInteractOutside && $0c6336b20c83c923$var$isValidEvent(e, ref)) {
|
|
997
|
+
state.isPointerDown = false;
|
|
998
|
+
state.onInteractOutside(e);
|
|
999
|
+
}
|
|
1000
|
+
};
|
|
1001
|
+
let onTouchEnd = (e)=>{
|
|
1002
|
+
state.ignoreEmulatedMouseEvents = true;
|
|
1003
|
+
if (state.onInteractOutside && state.isPointerDown && $0c6336b20c83c923$var$isValidEvent(e, ref)) {
|
|
1004
|
+
state.isPointerDown = false;
|
|
1005
|
+
state.onInteractOutside(e);
|
|
1006
|
+
}
|
|
1007
|
+
};
|
|
1008
|
+
document.addEventListener('mousedown', onPointerDown, true);
|
|
1009
|
+
document.addEventListener('mouseup', onMouseUp, true);
|
|
1010
|
+
document.addEventListener('touchstart', onPointerDown, true);
|
|
1011
|
+
document.addEventListener('touchend', onTouchEnd, true);
|
|
1012
|
+
return ()=>{
|
|
1013
|
+
document.removeEventListener('mousedown', onPointerDown, true);
|
|
1014
|
+
document.removeEventListener('mouseup', onMouseUp, true);
|
|
1015
|
+
document.removeEventListener('touchstart', onPointerDown, true);
|
|
1016
|
+
document.removeEventListener('touchend', onTouchEnd, true);
|
|
1017
|
+
};
|
|
1432
1018
|
}
|
|
1433
|
-
|
|
1434
|
-
|
|
1435
|
-
|
|
1436
|
-
|
|
1437
|
-
|
|
1438
|
-
document.addEventListener('touchend', onTouchEnd, true);
|
|
1439
|
-
return () => {
|
|
1440
|
-
document.removeEventListener('mousedown', onPointerDown, true);
|
|
1441
|
-
document.removeEventListener('mouseup', onMouseUp, true);
|
|
1442
|
-
document.removeEventListener('touchstart', onPointerDown, true);
|
|
1443
|
-
document.removeEventListener('touchend', onTouchEnd, true);
|
|
1444
|
-
};
|
|
1445
|
-
}
|
|
1446
|
-
}, [ref, state, isDisabled]);
|
|
1019
|
+
}, [
|
|
1020
|
+
ref,
|
|
1021
|
+
state,
|
|
1022
|
+
isDisabled
|
|
1023
|
+
]);
|
|
1447
1024
|
}
|
|
1448
|
-
|
|
1449
|
-
|
|
1450
|
-
|
|
1451
|
-
|
|
1452
|
-
|
|
1453
|
-
|
|
1454
|
-
} // if the event target is no longer in the document
|
|
1455
|
-
|
|
1456
|
-
|
|
1457
|
-
if (event.target) {
|
|
1458
|
-
const ownerDocument = event.target.ownerDocument;
|
|
1459
|
-
|
|
1460
|
-
if (!ownerDocument || !ownerDocument.documentElement.contains(event.target)) {
|
|
1461
|
-
return false;
|
|
1025
|
+
function $0c6336b20c83c923$var$isValidEvent(event, ref) {
|
|
1026
|
+
if (event.button > 0) return false;
|
|
1027
|
+
// if the event target is no longer in the document
|
|
1028
|
+
if (event.target) {
|
|
1029
|
+
const ownerDocument = event.target.ownerDocument;
|
|
1030
|
+
if (!ownerDocument || !ownerDocument.documentElement.contains(event.target)) return false;
|
|
1462
1031
|
}
|
|
1463
|
-
|
|
1464
|
-
|
|
1465
|
-
return ref.current && !ref.current.contains(event.target);
|
|
1032
|
+
return ref.current && !ref.current.contains(event.target);
|
|
1466
1033
|
}
|
|
1467
1034
|
|
|
1468
|
-
/**
|
|
1469
|
-
* This function wraps a React event handler to make stopPropagation the default, and support continuePropagation instead.
|
|
1470
|
-
*/
|
|
1471
|
-
function $df2a10e65550e0fb9bbbe4a76eee490$export$createEventHandler(handler) {
|
|
1472
|
-
if (!handler) {
|
|
1473
|
-
return;
|
|
1474
|
-
}
|
|
1475
|
-
|
|
1476
|
-
let shouldStopPropagation = true;
|
|
1477
|
-
return e => {
|
|
1478
|
-
let event = _babelRuntimeHelpersExtends({}, e, {
|
|
1479
|
-
preventDefault() {
|
|
1480
|
-
e.preventDefault();
|
|
1481
|
-
},
|
|
1482
|
-
|
|
1483
|
-
isDefaultPrevented() {
|
|
1484
|
-
return e.isDefaultPrevented();
|
|
1485
|
-
},
|
|
1486
|
-
|
|
1487
|
-
stopPropagation() {
|
|
1488
|
-
console.error('stopPropagation is now the default behavior for events in React Spectrum. You can use continuePropagation() to revert this behavior.');
|
|
1489
|
-
},
|
|
1490
|
-
|
|
1491
|
-
continuePropagation() {
|
|
1492
|
-
shouldStopPropagation = false;
|
|
1493
|
-
}
|
|
1494
|
-
|
|
1495
|
-
});
|
|
1496
1035
|
|
|
1497
|
-
|
|
1498
|
-
|
|
1499
|
-
|
|
1500
|
-
|
|
1501
|
-
|
|
1502
|
-
|
|
1503
|
-
|
|
1504
|
-
|
|
1505
|
-
|
|
1506
|
-
|
|
1507
|
-
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
|
|
1511
|
-
|
|
1512
|
-
|
|
1513
|
-
|
|
1514
|
-
|
|
1036
|
+
var $c24144c20f830a60$exports = {};
|
|
1037
|
+
|
|
1038
|
+
$parcel$export($c24144c20f830a60$exports, "useKeyboard", () => $c24144c20f830a60$export$8f71654801c2f7cd);
|
|
1039
|
+
function $e17e88c0ac871d70$export$48d1ea6320830260(handler) {
|
|
1040
|
+
if (!handler) return;
|
|
1041
|
+
let shouldStopPropagation = true;
|
|
1042
|
+
return (e)=>{
|
|
1043
|
+
let event = {
|
|
1044
|
+
...e,
|
|
1045
|
+
preventDefault () {
|
|
1046
|
+
e.preventDefault();
|
|
1047
|
+
},
|
|
1048
|
+
isDefaultPrevented () {
|
|
1049
|
+
return e.isDefaultPrevented();
|
|
1050
|
+
},
|
|
1051
|
+
stopPropagation () {
|
|
1052
|
+
console.error('stopPropagation is now the default behavior for events in React Spectrum. You can use continuePropagation() to revert this behavior.');
|
|
1053
|
+
},
|
|
1054
|
+
continuePropagation () {
|
|
1055
|
+
shouldStopPropagation = false;
|
|
1056
|
+
}
|
|
1057
|
+
};
|
|
1058
|
+
handler(event);
|
|
1059
|
+
if (shouldStopPropagation) e.stopPropagation();
|
|
1060
|
+
};
|
|
1515
1061
|
}
|
|
1516
1062
|
|
|
1517
|
-
exports.useKeyboard = useKeyboard;
|
|
1518
1063
|
|
|
1519
|
-
|
|
1520
|
-
|
|
1521
|
-
|
|
1522
|
-
|
|
1523
|
-
|
|
1524
|
-
|
|
1525
|
-
|
|
1526
|
-
onMoveStart,
|
|
1527
|
-
onMove,
|
|
1528
|
-
onMoveEnd
|
|
1529
|
-
} = props;
|
|
1530
|
-
let state = useRef({
|
|
1531
|
-
didMove: false,
|
|
1532
|
-
lastPosition: null,
|
|
1533
|
-
id: null
|
|
1534
|
-
});
|
|
1535
|
-
let {
|
|
1536
|
-
addGlobalListener,
|
|
1537
|
-
removeGlobalListener
|
|
1538
|
-
} = useGlobalListeners();
|
|
1539
|
-
let moveProps = useMemo(() => {
|
|
1540
|
-
let moveProps = {};
|
|
1541
|
-
|
|
1542
|
-
let start = () => {
|
|
1543
|
-
$ce801cc8e3ff24b95c928e0152c7b7f2$export$disableTextSelection();
|
|
1544
|
-
state.current.didMove = false;
|
|
1064
|
+
function $c24144c20f830a60$export$8f71654801c2f7cd(props) {
|
|
1065
|
+
return {
|
|
1066
|
+
keyboardProps: props.isDisabled ? {
|
|
1067
|
+
} : {
|
|
1068
|
+
onKeyDown: $e17e88c0ac871d70$export$48d1ea6320830260(props.onKeyDown),
|
|
1069
|
+
onKeyUp: $e17e88c0ac871d70$export$48d1ea6320830260(props.onKeyUp)
|
|
1070
|
+
}
|
|
1545
1071
|
};
|
|
1072
|
+
}
|
|
1546
1073
|
|
|
1547
|
-
let move = (pointerType, deltaX, deltaY) => {
|
|
1548
|
-
if (deltaX === 0 && deltaY === 0) {
|
|
1549
|
-
return;
|
|
1550
|
-
}
|
|
1551
1074
|
|
|
1552
|
-
|
|
1553
|
-
state.current.didMove = true;
|
|
1554
|
-
onMoveStart == null ? void 0 : onMoveStart({
|
|
1555
|
-
type: 'movestart',
|
|
1556
|
-
pointerType
|
|
1557
|
-
});
|
|
1558
|
-
}
|
|
1075
|
+
var $4a391f140757b0c6$exports = {};
|
|
1559
1076
|
|
|
1560
|
-
|
|
1561
|
-
type: 'move',
|
|
1562
|
-
pointerType,
|
|
1563
|
-
deltaX: deltaX,
|
|
1564
|
-
deltaY: deltaY
|
|
1565
|
-
});
|
|
1566
|
-
};
|
|
1077
|
+
$parcel$export($4a391f140757b0c6$exports, "useMove", () => $4a391f140757b0c6$export$36da96379f79f245);
|
|
1567
1078
|
|
|
1568
|
-
let end = pointerType => {
|
|
1569
|
-
$ce801cc8e3ff24b95c928e0152c7b7f2$export$restoreTextSelection();
|
|
1570
1079
|
|
|
1571
|
-
if (state.current.didMove) {
|
|
1572
|
-
onMoveEnd == null ? void 0 : onMoveEnd({
|
|
1573
|
-
type: 'moveend',
|
|
1574
|
-
pointerType
|
|
1575
|
-
});
|
|
1576
|
-
}
|
|
1577
|
-
};
|
|
1578
1080
|
|
|
1579
|
-
|
|
1580
|
-
|
|
1581
|
-
|
|
1582
|
-
|
|
1583
|
-
|
|
1584
|
-
|
|
1585
|
-
|
|
1586
|
-
|
|
1081
|
+
function $4a391f140757b0c6$export$36da96379f79f245(props) {
|
|
1082
|
+
let { onMoveStart: onMoveStart , onMove: onMove , onMoveEnd: onMoveEnd } = props;
|
|
1083
|
+
let state = $8jK7q$react.useRef({
|
|
1084
|
+
didMove: false,
|
|
1085
|
+
lastPosition: null,
|
|
1086
|
+
id: null
|
|
1087
|
+
});
|
|
1088
|
+
let { addGlobalListener: addGlobalListener , removeGlobalListener: removeGlobalListener } = $8jK7q$reactariautils.useGlobalListeners();
|
|
1089
|
+
let moveProps1 = $8jK7q$react.useMemo(()=>{
|
|
1090
|
+
let moveProps = {
|
|
1091
|
+
};
|
|
1092
|
+
let start = ()=>{
|
|
1093
|
+
$f85b19f7e83b9914$export$16a4697467175487();
|
|
1094
|
+
state.current.didMove = false;
|
|
1095
|
+
};
|
|
1096
|
+
let move = (originalEvent, pointerType, deltaX, deltaY)=>{
|
|
1097
|
+
if (deltaX === 0 && deltaY === 0) return;
|
|
1098
|
+
if (!state.current.didMove) {
|
|
1099
|
+
state.current.didMove = true;
|
|
1100
|
+
onMoveStart === null || onMoveStart === void 0 ? void 0 : onMoveStart({
|
|
1101
|
+
type: 'movestart',
|
|
1102
|
+
pointerType: pointerType,
|
|
1103
|
+
shiftKey: originalEvent.shiftKey,
|
|
1104
|
+
metaKey: originalEvent.metaKey,
|
|
1105
|
+
ctrlKey: originalEvent.ctrlKey,
|
|
1106
|
+
altKey: originalEvent.altKey
|
|
1107
|
+
});
|
|
1108
|
+
}
|
|
1109
|
+
onMove({
|
|
1110
|
+
type: 'move',
|
|
1111
|
+
pointerType: pointerType,
|
|
1112
|
+
deltaX: deltaX,
|
|
1113
|
+
deltaY: deltaY,
|
|
1114
|
+
shiftKey: originalEvent.shiftKey,
|
|
1115
|
+
metaKey: originalEvent.metaKey,
|
|
1116
|
+
ctrlKey: originalEvent.ctrlKey,
|
|
1117
|
+
altKey: originalEvent.altKey
|
|
1118
|
+
});
|
|
1119
|
+
};
|
|
1120
|
+
let end = (originalEvent, pointerType)=>{
|
|
1121
|
+
$f85b19f7e83b9914$export$b0d6fa1ab32e3295();
|
|
1122
|
+
if (state.current.didMove) onMoveEnd === null || onMoveEnd === void 0 ? void 0 : onMoveEnd({
|
|
1123
|
+
type: 'moveend',
|
|
1124
|
+
pointerType: pointerType,
|
|
1125
|
+
shiftKey: originalEvent.shiftKey,
|
|
1126
|
+
metaKey: originalEvent.metaKey,
|
|
1127
|
+
ctrlKey: originalEvent.ctrlKey,
|
|
1128
|
+
altKey: originalEvent.altKey
|
|
1129
|
+
});
|
|
1130
|
+
};
|
|
1131
|
+
if (typeof PointerEvent === 'undefined') {
|
|
1132
|
+
let onMouseMove = (e)=>{
|
|
1133
|
+
if (e.button === 0) {
|
|
1134
|
+
move(e, 'mouse', e.pageX - state.current.lastPosition.pageX, e.pageY - state.current.lastPosition.pageY);
|
|
1135
|
+
state.current.lastPosition = {
|
|
1136
|
+
pageX: e.pageX,
|
|
1137
|
+
pageY: e.pageY
|
|
1138
|
+
};
|
|
1139
|
+
}
|
|
1140
|
+
};
|
|
1141
|
+
let onMouseUp = (e)=>{
|
|
1142
|
+
if (e.button === 0) {
|
|
1143
|
+
end(e, 'mouse');
|
|
1144
|
+
removeGlobalListener(window, 'mousemove', onMouseMove, false);
|
|
1145
|
+
removeGlobalListener(window, 'mouseup', onMouseUp, false);
|
|
1146
|
+
}
|
|
1147
|
+
};
|
|
1148
|
+
moveProps.onMouseDown = (e)=>{
|
|
1149
|
+
if (e.button === 0) {
|
|
1150
|
+
start();
|
|
1151
|
+
e.stopPropagation();
|
|
1152
|
+
e.preventDefault();
|
|
1153
|
+
state.current.lastPosition = {
|
|
1154
|
+
pageX: e.pageX,
|
|
1155
|
+
pageY: e.pageY
|
|
1156
|
+
};
|
|
1157
|
+
addGlobalListener(window, 'mousemove', onMouseMove, false);
|
|
1158
|
+
addGlobalListener(window, 'mouseup', onMouseUp, false);
|
|
1159
|
+
}
|
|
1160
|
+
};
|
|
1161
|
+
let onTouchMove = (e)=>{
|
|
1162
|
+
let touch = [
|
|
1163
|
+
...e.changedTouches
|
|
1164
|
+
].findIndex(({ identifier: identifier })=>identifier === state.current.id
|
|
1165
|
+
);
|
|
1166
|
+
if (touch >= 0) {
|
|
1167
|
+
let { pageX: pageX , pageY: pageY } = e.changedTouches[touch];
|
|
1168
|
+
move(e, 'touch', pageX - state.current.lastPosition.pageX, pageY - state.current.lastPosition.pageY);
|
|
1169
|
+
state.current.lastPosition = {
|
|
1170
|
+
pageX: pageX,
|
|
1171
|
+
pageY: pageY
|
|
1172
|
+
};
|
|
1173
|
+
}
|
|
1174
|
+
};
|
|
1175
|
+
let onTouchEnd = (e)=>{
|
|
1176
|
+
let touch = [
|
|
1177
|
+
...e.changedTouches
|
|
1178
|
+
].findIndex(({ identifier: identifier })=>identifier === state.current.id
|
|
1179
|
+
);
|
|
1180
|
+
if (touch >= 0) {
|
|
1181
|
+
end(e, 'touch');
|
|
1182
|
+
state.current.id = null;
|
|
1183
|
+
removeGlobalListener(window, 'touchmove', onTouchMove);
|
|
1184
|
+
removeGlobalListener(window, 'touchend', onTouchEnd);
|
|
1185
|
+
removeGlobalListener(window, 'touchcancel', onTouchEnd);
|
|
1186
|
+
}
|
|
1187
|
+
};
|
|
1188
|
+
moveProps.onTouchStart = (e)=>{
|
|
1189
|
+
if (e.changedTouches.length === 0 || state.current.id != null) return;
|
|
1190
|
+
let { pageX: pageX , pageY: pageY , identifier: identifier } = e.changedTouches[0];
|
|
1191
|
+
start();
|
|
1192
|
+
e.stopPropagation();
|
|
1193
|
+
e.preventDefault();
|
|
1194
|
+
state.current.lastPosition = {
|
|
1195
|
+
pageX: pageX,
|
|
1196
|
+
pageY: pageY
|
|
1197
|
+
};
|
|
1198
|
+
state.current.id = identifier;
|
|
1199
|
+
addGlobalListener(window, 'touchmove', onTouchMove, false);
|
|
1200
|
+
addGlobalListener(window, 'touchend', onTouchEnd, false);
|
|
1201
|
+
addGlobalListener(window, 'touchcancel', onTouchEnd, false);
|
|
1202
|
+
};
|
|
1203
|
+
} else {
|
|
1204
|
+
let onPointerMove = (e)=>{
|
|
1205
|
+
if (e.pointerId === state.current.id) {
|
|
1206
|
+
let pointerType = e.pointerType || 'mouse';
|
|
1207
|
+
// Problems with PointerEvent#movementX/movementY:
|
|
1208
|
+
// 1. it is always 0 on macOS Safari.
|
|
1209
|
+
// 2. On Chrome Android, it's scaled by devicePixelRatio, but not on Chrome macOS
|
|
1210
|
+
move(e, pointerType, e.pageX - state.current.lastPosition.pageX, e.pageY - state.current.lastPosition.pageY);
|
|
1211
|
+
state.current.lastPosition = {
|
|
1212
|
+
pageX: e.pageX,
|
|
1213
|
+
pageY: e.pageY
|
|
1214
|
+
};
|
|
1215
|
+
}
|
|
1216
|
+
};
|
|
1217
|
+
let onPointerUp = (e)=>{
|
|
1218
|
+
if (e.pointerId === state.current.id) {
|
|
1219
|
+
let pointerType = e.pointerType || 'mouse';
|
|
1220
|
+
end(e, pointerType);
|
|
1221
|
+
state.current.id = null;
|
|
1222
|
+
removeGlobalListener(window, 'pointermove', onPointerMove, false);
|
|
1223
|
+
removeGlobalListener(window, 'pointerup', onPointerUp, false);
|
|
1224
|
+
removeGlobalListener(window, 'pointercancel', onPointerUp, false);
|
|
1225
|
+
}
|
|
1226
|
+
};
|
|
1227
|
+
moveProps.onPointerDown = (e)=>{
|
|
1228
|
+
if (e.button === 0 && state.current.id == null) {
|
|
1229
|
+
start();
|
|
1230
|
+
e.stopPropagation();
|
|
1231
|
+
e.preventDefault();
|
|
1232
|
+
state.current.lastPosition = {
|
|
1233
|
+
pageX: e.pageX,
|
|
1234
|
+
pageY: e.pageY
|
|
1235
|
+
};
|
|
1236
|
+
state.current.id = e.pointerId;
|
|
1237
|
+
addGlobalListener(window, 'pointermove', onPointerMove, false);
|
|
1238
|
+
addGlobalListener(window, 'pointerup', onPointerUp, false);
|
|
1239
|
+
addGlobalListener(window, 'pointercancel', onPointerUp, false);
|
|
1240
|
+
}
|
|
1241
|
+
};
|
|
1587
1242
|
}
|
|
1588
|
-
|
|
1243
|
+
let triggerKeyboardMove = (e, deltaX, deltaY)=>{
|
|
1244
|
+
start();
|
|
1245
|
+
move(e, 'keyboard', deltaX, deltaY);
|
|
1246
|
+
end(e, 'keyboard');
|
|
1247
|
+
};
|
|
1248
|
+
moveProps.onKeyDown = (e)=>{
|
|
1249
|
+
switch(e.key){
|
|
1250
|
+
case 'Left':
|
|
1251
|
+
case 'ArrowLeft':
|
|
1252
|
+
e.preventDefault();
|
|
1253
|
+
e.stopPropagation();
|
|
1254
|
+
triggerKeyboardMove(e, -1, 0);
|
|
1255
|
+
break;
|
|
1256
|
+
case 'Right':
|
|
1257
|
+
case 'ArrowRight':
|
|
1258
|
+
e.preventDefault();
|
|
1259
|
+
e.stopPropagation();
|
|
1260
|
+
triggerKeyboardMove(e, 1, 0);
|
|
1261
|
+
break;
|
|
1262
|
+
case 'Up':
|
|
1263
|
+
case 'ArrowUp':
|
|
1264
|
+
e.preventDefault();
|
|
1265
|
+
e.stopPropagation();
|
|
1266
|
+
triggerKeyboardMove(e, 0, -1);
|
|
1267
|
+
break;
|
|
1268
|
+
case 'Down':
|
|
1269
|
+
case 'ArrowDown':
|
|
1270
|
+
e.preventDefault();
|
|
1271
|
+
e.stopPropagation();
|
|
1272
|
+
triggerKeyboardMove(e, 0, 1);
|
|
1273
|
+
break;
|
|
1274
|
+
}
|
|
1275
|
+
};
|
|
1276
|
+
return moveProps;
|
|
1277
|
+
}, [
|
|
1278
|
+
state,
|
|
1279
|
+
onMoveStart,
|
|
1280
|
+
onMove,
|
|
1281
|
+
onMoveEnd,
|
|
1282
|
+
addGlobalListener,
|
|
1283
|
+
removeGlobalListener
|
|
1284
|
+
]);
|
|
1285
|
+
return {
|
|
1286
|
+
moveProps: moveProps1
|
|
1287
|
+
};
|
|
1288
|
+
}
|
|
1589
1289
|
|
|
1590
|
-
let onMouseUp = e => {
|
|
1591
|
-
if (e.button === 0) {
|
|
1592
|
-
end('mouse');
|
|
1593
|
-
removeGlobalListener(window, 'mousemove', onMouseMove, false);
|
|
1594
|
-
removeGlobalListener(window, 'mouseup', onMouseUp, false);
|
|
1595
|
-
}
|
|
1596
|
-
};
|
|
1597
|
-
|
|
1598
|
-
moveProps.onMouseDown = e => {
|
|
1599
|
-
if (e.button === 0) {
|
|
1600
|
-
start();
|
|
1601
|
-
e.stopPropagation();
|
|
1602
|
-
e.preventDefault();
|
|
1603
|
-
state.current.lastPosition = {
|
|
1604
|
-
pageX: e.pageX,
|
|
1605
|
-
pageY: e.pageY
|
|
1606
|
-
};
|
|
1607
|
-
addGlobalListener(window, 'mousemove', onMouseMove, false);
|
|
1608
|
-
addGlobalListener(window, 'mouseup', onMouseUp, false);
|
|
1609
|
-
}
|
|
1610
|
-
};
|
|
1611
|
-
|
|
1612
|
-
let onTouchMove = e => {
|
|
1613
|
-
// @ts-ignore
|
|
1614
|
-
let touch = [...e.changedTouches].findIndex((_ref) => {
|
|
1615
|
-
let {
|
|
1616
|
-
identifier
|
|
1617
|
-
} = _ref;
|
|
1618
|
-
return identifier === state.current.id;
|
|
1619
|
-
});
|
|
1620
1290
|
|
|
1621
|
-
if (touch >= 0) {
|
|
1622
|
-
let {
|
|
1623
|
-
pageX,
|
|
1624
|
-
pageY
|
|
1625
|
-
} = e.changedTouches[touch];
|
|
1626
|
-
move('touch', pageX - state.current.lastPosition.pageX, pageY - state.current.lastPosition.pageY);
|
|
1627
|
-
state.current.lastPosition = {
|
|
1628
|
-
pageX,
|
|
1629
|
-
pageY
|
|
1630
|
-
};
|
|
1631
|
-
}
|
|
1632
|
-
};
|
|
1633
|
-
|
|
1634
|
-
let onTouchEnd = e => {
|
|
1635
|
-
// @ts-ignore
|
|
1636
|
-
let touch = [...e.changedTouches].findIndex((_ref2) => {
|
|
1637
|
-
let {
|
|
1638
|
-
identifier
|
|
1639
|
-
} = _ref2;
|
|
1640
|
-
return identifier === state.current.id;
|
|
1641
|
-
});
|
|
1642
1291
|
|
|
1643
|
-
|
|
1644
|
-
end('touch');
|
|
1645
|
-
state.current.id = null;
|
|
1646
|
-
removeGlobalListener(window, 'touchmove', onTouchMove);
|
|
1647
|
-
removeGlobalListener(window, 'touchend', onTouchEnd);
|
|
1648
|
-
removeGlobalListener(window, 'touchcancel', onTouchEnd);
|
|
1649
|
-
}
|
|
1650
|
-
};
|
|
1292
|
+
var $47bb792292b48f4a$exports = {};
|
|
1651
1293
|
|
|
1652
|
-
|
|
1653
|
-
if (e.changedTouches.length === 0 || state.current.id != null) {
|
|
1654
|
-
return;
|
|
1655
|
-
}
|
|
1294
|
+
$parcel$export($47bb792292b48f4a$exports, "useScrollWheel", () => $47bb792292b48f4a$export$2123ff2b87c81ca);
|
|
1656
1295
|
|
|
1657
|
-
|
|
1658
|
-
|
|
1659
|
-
|
|
1660
|
-
|
|
1661
|
-
|
|
1662
|
-
|
|
1663
|
-
|
|
1296
|
+
|
|
1297
|
+
function $47bb792292b48f4a$export$2123ff2b87c81ca(props, ref) {
|
|
1298
|
+
let { onScroll: onScroll , isDisabled: isDisabled } = props;
|
|
1299
|
+
let onScrollHandler = $8jK7q$react.useCallback((e)=>{
|
|
1300
|
+
// If the ctrlKey is pressed, this is a zoom event, do nothing.
|
|
1301
|
+
if (e.ctrlKey) return;
|
|
1302
|
+
// stop scrolling the page
|
|
1664
1303
|
e.preventDefault();
|
|
1665
|
-
|
|
1666
|
-
|
|
1667
|
-
|
|
1668
|
-
|
|
1669
|
-
|
|
1670
|
-
|
|
1671
|
-
|
|
1672
|
-
|
|
1673
|
-
|
|
1674
|
-
|
|
1675
|
-
let onPointerMove = e => {
|
|
1676
|
-
if (e.pointerId === state.current.id) {
|
|
1677
|
-
// @ts-ignore
|
|
1678
|
-
let pointerType = e.pointerType || 'mouse'; // Problems with PointerEvent#movementX/movementY:
|
|
1679
|
-
// 1. it is always 0 on macOS Safari.
|
|
1680
|
-
// 2. On Chrome Android, it's scaled by devicePixelRatio, but not on Chrome macOS
|
|
1681
|
-
|
|
1682
|
-
move(pointerType, e.pageX - state.current.lastPosition.pageX, e.pageY - state.current.lastPosition.pageY);
|
|
1683
|
-
state.current.lastPosition = {
|
|
1684
|
-
pageX: e.pageX,
|
|
1685
|
-
pageY: e.pageY
|
|
1686
|
-
};
|
|
1687
|
-
}
|
|
1688
|
-
};
|
|
1689
|
-
|
|
1690
|
-
let onPointerUp = e => {
|
|
1691
|
-
if (e.pointerId === state.current.id) {
|
|
1692
|
-
// @ts-ignore
|
|
1693
|
-
let pointerType = e.pointerType || 'mouse';
|
|
1694
|
-
end(pointerType);
|
|
1695
|
-
state.current.id = null;
|
|
1696
|
-
removeGlobalListener(window, 'pointermove', onPointerMove, false);
|
|
1697
|
-
removeGlobalListener(window, 'pointerup', onPointerUp, false);
|
|
1698
|
-
removeGlobalListener(window, 'pointercancel', onPointerUp, false);
|
|
1699
|
-
}
|
|
1700
|
-
};
|
|
1701
|
-
|
|
1702
|
-
moveProps.onPointerDown = e => {
|
|
1703
|
-
if (e.button === 0 && state.current.id == null) {
|
|
1704
|
-
start();
|
|
1705
|
-
e.stopPropagation();
|
|
1706
|
-
e.preventDefault();
|
|
1707
|
-
state.current.lastPosition = {
|
|
1708
|
-
pageX: e.pageX,
|
|
1709
|
-
pageY: e.pageY
|
|
1710
|
-
};
|
|
1711
|
-
state.current.id = e.pointerId;
|
|
1712
|
-
addGlobalListener(window, 'pointermove', onPointerMove, false);
|
|
1713
|
-
addGlobalListener(window, 'pointerup', onPointerUp, false);
|
|
1714
|
-
addGlobalListener(window, 'pointercancel', onPointerUp, false);
|
|
1715
|
-
}
|
|
1716
|
-
};
|
|
1717
|
-
}
|
|
1304
|
+
e.stopPropagation();
|
|
1305
|
+
if (onScroll) onScroll({
|
|
1306
|
+
deltaX: e.deltaX,
|
|
1307
|
+
deltaY: e.deltaY
|
|
1308
|
+
});
|
|
1309
|
+
}, [
|
|
1310
|
+
onScroll
|
|
1311
|
+
]);
|
|
1312
|
+
$8jK7q$reactariautils.useEvent(ref, 'wheel', isDisabled ? null : onScrollHandler);
|
|
1313
|
+
}
|
|
1718
1314
|
|
|
1719
|
-
let triggerKeyboardMove = (deltaX, deltaY) => {
|
|
1720
|
-
start();
|
|
1721
|
-
move('keyboard', deltaX, deltaY);
|
|
1722
|
-
end('keyboard');
|
|
1723
|
-
};
|
|
1724
1315
|
|
|
1725
|
-
|
|
1726
|
-
|
|
1727
|
-
|
|
1728
|
-
|
|
1729
|
-
|
|
1730
|
-
|
|
1731
|
-
|
|
1732
|
-
|
|
1733
|
-
|
|
1734
|
-
|
|
1735
|
-
|
|
1736
|
-
|
|
1737
|
-
|
|
1738
|
-
|
|
1739
|
-
|
|
1740
|
-
|
|
1741
|
-
|
|
1742
|
-
|
|
1743
|
-
|
|
1744
|
-
|
|
1745
|
-
|
|
1746
|
-
|
|
1747
|
-
|
|
1748
|
-
|
|
1749
|
-
|
|
1750
|
-
|
|
1751
|
-
|
|
1752
|
-
|
|
1753
|
-
|
|
1754
|
-
|
|
1316
|
+
var $b777e6fb4c63da4c$exports = {};
|
|
1317
|
+
|
|
1318
|
+
$parcel$export($b777e6fb4c63da4c$exports, "useLongPress", () => $b777e6fb4c63da4c$export$c24ed0104d07eab9);
|
|
1319
|
+
|
|
1320
|
+
|
|
1321
|
+
|
|
1322
|
+
const $b777e6fb4c63da4c$var$DEFAULT_THRESHOLD = 500;
|
|
1323
|
+
function $b777e6fb4c63da4c$export$c24ed0104d07eab9(props) {
|
|
1324
|
+
let { isDisabled: isDisabled , onLongPressStart: onLongPressStart , onLongPressEnd: onLongPressEnd , onLongPress: onLongPress , threshold: threshold = $b777e6fb4c63da4c$var$DEFAULT_THRESHOLD , accessibilityDescription: accessibilityDescription } = props;
|
|
1325
|
+
const timeRef = $8jK7q$react.useRef(null);
|
|
1326
|
+
let { addGlobalListener: addGlobalListener , removeGlobalListener: removeGlobalListener } = $8jK7q$reactariautils.useGlobalListeners();
|
|
1327
|
+
let { pressProps: pressProps } = $49794190ef05a7aa$export$45712eceda6fad21({
|
|
1328
|
+
isDisabled: isDisabled,
|
|
1329
|
+
onPressStart (e1) {
|
|
1330
|
+
if (e1.pointerType === 'mouse' || e1.pointerType === 'touch') {
|
|
1331
|
+
if (onLongPressStart) onLongPressStart({
|
|
1332
|
+
...e1,
|
|
1333
|
+
type: 'longpressstart'
|
|
1334
|
+
});
|
|
1335
|
+
timeRef.current = setTimeout(()=>{
|
|
1336
|
+
// Prevent other usePress handlers from also handling this event.
|
|
1337
|
+
e1.target.dispatchEvent(new PointerEvent('pointercancel', {
|
|
1338
|
+
bubbles: true
|
|
1339
|
+
}));
|
|
1340
|
+
if (onLongPress) onLongPress({
|
|
1341
|
+
...e1,
|
|
1342
|
+
type: 'longpress'
|
|
1343
|
+
});
|
|
1344
|
+
timeRef.current = null;
|
|
1345
|
+
}, threshold);
|
|
1346
|
+
// Prevent context menu, which may be opened on long press on touch devices
|
|
1347
|
+
if (e1.pointerType === 'touch') {
|
|
1348
|
+
let onContextMenu = (e)=>{
|
|
1349
|
+
e.preventDefault();
|
|
1350
|
+
};
|
|
1351
|
+
addGlobalListener(e1.target, 'contextmenu', onContextMenu, {
|
|
1352
|
+
once: true
|
|
1353
|
+
});
|
|
1354
|
+
addGlobalListener(window, 'pointerup', ()=>{
|
|
1355
|
+
// If no contextmenu event is fired quickly after pointerup, remove the handler
|
|
1356
|
+
// so future context menu events outside a long press are not prevented.
|
|
1357
|
+
setTimeout(()=>{
|
|
1358
|
+
removeGlobalListener(e1.target, 'contextmenu', onContextMenu);
|
|
1359
|
+
}, 30);
|
|
1360
|
+
}, {
|
|
1361
|
+
once: true
|
|
1362
|
+
});
|
|
1363
|
+
}
|
|
1364
|
+
}
|
|
1365
|
+
},
|
|
1366
|
+
onPressEnd (e) {
|
|
1367
|
+
if (timeRef.current) clearTimeout(timeRef.current);
|
|
1368
|
+
if (onLongPressEnd && (e.pointerType === 'mouse' || e.pointerType === 'touch')) onLongPressEnd({
|
|
1369
|
+
...e,
|
|
1370
|
+
type: 'longpressend'
|
|
1371
|
+
});
|
|
1372
|
+
}
|
|
1373
|
+
});
|
|
1374
|
+
let descriptionProps = $8jK7q$reactariautils.useDescription(onLongPress && !isDisabled ? accessibilityDescription : null);
|
|
1375
|
+
return {
|
|
1376
|
+
longPressProps: $8jK7q$reactariautils.mergeProps(pressProps, descriptionProps)
|
|
1755
1377
|
};
|
|
1756
|
-
|
|
1757
|
-
return moveProps;
|
|
1758
|
-
}, [state, onMoveStart, onMove, onMoveEnd, addGlobalListener, removeGlobalListener]);
|
|
1759
|
-
return {
|
|
1760
|
-
moveProps
|
|
1761
|
-
};
|
|
1762
1378
|
}
|
|
1763
1379
|
|
|
1764
|
-
exports.useMove = useMove;
|
|
1765
|
-
|
|
1766
|
-
// scroll wheel needs to be added not passively so it's cancelable, small helper hook to remember that
|
|
1767
|
-
function useScrollWheel(props, ref) {
|
|
1768
|
-
let {
|
|
1769
|
-
onScroll,
|
|
1770
|
-
isDisabled
|
|
1771
|
-
} = props;
|
|
1772
|
-
let onScrollHandler = useCallback(e => {
|
|
1773
|
-
// If the ctrlKey is pressed, this is a zoom event, do nothing.
|
|
1774
|
-
if (e.ctrlKey) {
|
|
1775
|
-
return;
|
|
1776
|
-
} // stop scrolling the page
|
|
1777
|
-
|
|
1778
1380
|
|
|
1779
|
-
|
|
1780
|
-
|
|
1381
|
+
$parcel$exportWildcard(module.exports, $c7e4402d7268b9e5$exports);
|
|
1382
|
+
$parcel$exportWildcard(module.exports, $94a1d642bd05f094$exports);
|
|
1383
|
+
$parcel$exportWildcard(module.exports, $5848daf14fd6f7cb$exports);
|
|
1384
|
+
$parcel$exportWildcard(module.exports, $418794b2e2f608b3$exports);
|
|
1385
|
+
$parcel$exportWildcard(module.exports, $62b9c773b0fd3946$exports);
|
|
1386
|
+
$parcel$exportWildcard(module.exports, $deea67f305dbdcff$exports);
|
|
1387
|
+
$parcel$exportWildcard(module.exports, $0c6336b20c83c923$exports);
|
|
1388
|
+
$parcel$exportWildcard(module.exports, $c24144c20f830a60$exports);
|
|
1389
|
+
$parcel$exportWildcard(module.exports, $4a391f140757b0c6$exports);
|
|
1390
|
+
$parcel$exportWildcard(module.exports, $49794190ef05a7aa$exports);
|
|
1391
|
+
$parcel$exportWildcard(module.exports, $47bb792292b48f4a$exports);
|
|
1392
|
+
$parcel$exportWildcard(module.exports, $b777e6fb4c63da4c$exports);
|
|
1781
1393
|
|
|
1782
|
-
if (onScroll) {
|
|
1783
|
-
onScroll({
|
|
1784
|
-
deltaX: e.deltaX,
|
|
1785
|
-
deltaY: e.deltaY
|
|
1786
|
-
});
|
|
1787
|
-
}
|
|
1788
|
-
}, [onScroll]);
|
|
1789
|
-
useEffect(() => {
|
|
1790
|
-
let elem = ref.current;
|
|
1791
|
-
|
|
1792
|
-
if (isDisabled) {
|
|
1793
|
-
return;
|
|
1794
|
-
}
|
|
1795
|
-
|
|
1796
|
-
elem.addEventListener('wheel', onScrollHandler);
|
|
1797
|
-
return () => {
|
|
1798
|
-
elem.removeEventListener('wheel', onScrollHandler);
|
|
1799
|
-
};
|
|
1800
|
-
}, [onScrollHandler, ref, isDisabled]);
|
|
1801
|
-
}
|
|
1802
1394
|
|
|
1803
|
-
exports.useScrollWheel = useScrollWheel;
|
|
1804
1395
|
//# sourceMappingURL=main.js.map
|