@everymatrix/general-input 1.43.4 → 1.45.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/app-globals-3a1e7e63.js +5 -0
- package/dist/cjs/checkbox-group-input_10.cjs.entry.js +3873 -1756
- package/dist/cjs/general-input.cjs.entry.js +65 -62
- package/dist/cjs/general-input.cjs.js +17 -11
- package/dist/cjs/index-8cb018cb.js +1316 -0
- package/dist/cjs/index.cjs.js +13 -13
- package/dist/cjs/loader.cjs.js +7 -13
- package/dist/cjs/locale.utils-fdc29445.js +147 -0
- package/dist/cjs/toggle-checkbox-input.cjs.entry.js +77 -74
- package/dist/collection/collection-manifest.json +14 -14
- package/dist/collection/components/checkbox-group-input/checkbox-group-input.js +368 -353
- package/dist/collection/components/checkbox-input/checkbox-input.js +325 -315
- package/dist/collection/components/date-input/date-input.css +2 -2
- package/dist/collection/components/date-input/date-input.js +397 -376
- package/dist/collection/components/email-input/email-input.css +7 -11
- package/dist/collection/components/email-input/email-input.js +404 -385
- package/dist/collection/components/general-input/general-input.js +373 -367
- package/dist/collection/components/general-input/index.js +1 -0
- package/dist/collection/components/number-input/number-input.js +370 -352
- package/dist/collection/components/password-input/password-input.css +2 -4
- package/dist/collection/components/password-input/password-input.js +513 -540
- package/dist/collection/components/radio-input/radio-input.js +301 -286
- package/dist/collection/components/select-input/select-input.css +8 -9
- package/dist/collection/components/select-input/select-input.js +427 -414
- package/dist/collection/components/tel-input/tel-input.css +1 -1
- package/dist/collection/components/tel-input/tel-input.js +440 -422
- package/dist/collection/components/text-input/text-input.css +0 -1
- package/dist/collection/components/text-input/text-input.js +444 -429
- package/dist/collection/components/toggle-checkbox-input/toggle-checkbox-input.js +327 -318
- package/dist/collection/index.js +13 -13
- package/dist/collection/utils/locale.utils.js +133 -133
- package/dist/collection/utils/utils.js +3 -3
- package/dist/esm/app-globals-0f993ce5.js +3 -0
- package/dist/esm/checkbox-group-input_10.entry.js +3873 -1756
- package/dist/esm/general-input.entry.js +65 -62
- package/dist/esm/general-input.js +14 -11
- package/dist/esm/index-514fda47.js +1287 -0
- package/dist/esm/index.js +13 -13
- package/dist/esm/loader.js +7 -13
- package/dist/esm/locale.utils-75b7d185.js +144 -0
- package/dist/esm/toggle-checkbox-input.entry.js +77 -74
- package/dist/general-input/general-input.esm.js +1 -1
- package/dist/general-input/p-03e81c11.js +2 -0
- package/dist/general-input/p-122566dd.entry.js +5430 -0
- package/dist/general-input/p-1913dcb0.entry.js +1 -0
- package/dist/general-input/p-e1255160.js +1 -0
- package/dist/general-input/p-e7df9c4a.entry.js +1 -0
- package/dist/stencil.config.dev.js +17 -0
- package/dist/stencil.config.js +14 -19
- package/dist/types/Users/adrian.pripon/Documents/Work/widgets-monorepo/packages/stencil/general-input/.stencil/packages/stencil/general-input/stencil.config.d.ts +2 -0
- package/dist/types/Users/adrian.pripon/Documents/Work/widgets-monorepo/packages/stencil/general-input/.stencil/packages/stencil/general-input/stencil.config.dev.d.ts +2 -0
- package/dist/types/components/checkbox-group-input/checkbox-group-input.d.ts +68 -68
- package/dist/types/components/checkbox-input/checkbox-input.d.ts +61 -62
- package/dist/types/components/date-input/date-input.d.ts +78 -78
- package/dist/types/components/email-input/email-input.d.ts +77 -77
- package/dist/types/components/general-input/general-input.d.ts +72 -72
- package/dist/types/components/general-input/index.d.ts +1 -0
- package/dist/types/components/number-input/number-input.d.ts +71 -71
- package/dist/types/components/password-input/password-input.d.ts +87 -92
- package/dist/types/components/radio-input/radio-input.d.ts +55 -55
- package/dist/types/components/select-input/select-input.d.ts +79 -79
- package/dist/types/components/tel-input/tel-input.d.ts +85 -85
- package/dist/types/components/text-input/text-input.d.ts +81 -81
- package/dist/types/components/toggle-checkbox-input/toggle-checkbox-input.d.ts +63 -64
- package/dist/types/components.d.ts +201 -31
- package/dist/types/stencil-public-runtime.d.ts +142 -33
- package/dist/types/utils/locale.utils.d.ts +8 -8
- package/dist/types/utils/types.d.ts +54 -54
- package/loader/cdn.js +1 -3
- package/loader/index.cjs.js +1 -3
- package/loader/index.d.ts +13 -1
- package/loader/index.es2017.js +1 -3
- package/loader/index.js +1 -3
- package/loader/package.json +1 -0
- package/package.json +8 -1
- package/dist/cjs/index-132a0774.js +0 -1327
- package/dist/cjs/locale.utils-2fa6f747.js +0 -147
- package/dist/components/active-mixin.js +0 -975
- package/dist/components/checkbox-group-input.d.ts +0 -11
- package/dist/components/checkbox-group-input.js +0 -6
- package/dist/components/checkbox-group-input2.js +0 -1078
- package/dist/components/checkbox-input.d.ts +0 -11
- package/dist/components/checkbox-input.js +0 -6
- package/dist/components/checkbox-input2.js +0 -132
- package/dist/components/date-input.d.ts +0 -11
- package/dist/components/date-input.js +0 -6
- package/dist/components/date-input2.js +0 -11556
- package/dist/components/email-input.d.ts +0 -11
- package/dist/components/email-input.js +0 -6
- package/dist/components/email-input2.js +0 -171
- package/dist/components/field-mixin.js +0 -12426
- package/dist/components/general-input.d.ts +0 -11
- package/dist/components/general-input.js +0 -6
- package/dist/components/general-input2.js +0 -344
- package/dist/components/index.d.ts +0 -26
- package/dist/components/index.js +0 -18
- package/dist/components/input-field-shared-styles.js +0 -1211
- package/dist/components/number-input.d.ts +0 -11
- package/dist/components/number-input.js +0 -6
- package/dist/components/number-input2.js +0 -158
- package/dist/components/password-input.d.ts +0 -11
- package/dist/components/password-input.js +0 -6
- package/dist/components/password-input2.js +0 -1059
- package/dist/components/radio-input.d.ts +0 -11
- package/dist/components/radio-input.js +0 -6
- package/dist/components/radio-input2.js +0 -114
- package/dist/components/select-input.d.ts +0 -11
- package/dist/components/select-input.js +0 -6
- package/dist/components/select-input2.js +0 -183
- package/dist/components/tel-input.d.ts +0 -11
- package/dist/components/tel-input.js +0 -6
- package/dist/components/tel-input2.js +0 -197
- package/dist/components/text-input.d.ts +0 -11
- package/dist/components/text-input.js +0 -6
- package/dist/components/text-input2.js +0 -199
- package/dist/components/toggle-checkbox-input.d.ts +0 -11
- package/dist/components/toggle-checkbox-input.js +0 -6
- package/dist/components/tooltipIcon.js +0 -146
- package/dist/components/vaadin-button.js +0 -490
- package/dist/components/vaadin-combo-box.js +0 -4512
- package/dist/components/virtual-keyboard-controller.js +0 -2001
- package/dist/esm/index-db76d5b5.js +0 -1299
- package/dist/esm/locale.utils-30fb5289.js +0 -144
- package/dist/esm/polyfills/core-js.js +0 -11
- package/dist/esm/polyfills/css-shim.js +0 -1
- package/dist/esm/polyfills/dom.js +0 -79
- package/dist/esm/polyfills/es5-html-element.js +0 -1
- package/dist/esm/polyfills/index.js +0 -34
- package/dist/esm/polyfills/system.js +0 -6
- package/dist/general-input/p-6ae987d0.entry.js +0 -1
- package/dist/general-input/p-b408093e.js +0 -1
- package/dist/general-input/p-b64caafa.entry.js +0 -3646
- package/dist/general-input/p-f659e9ee.entry.js +0 -1
- package/dist/types/Users/adrian.pripon/Documents/Work/widgets-stencil/packages/general-input/.stencil/packages/general-input/stencil.config.d.ts +0 -2
- /package/dist/cjs/{tooltipIcon-092a795f.js → tooltipIcon-7e9ee226.js} +0 -0
- /package/dist/esm/{tooltipIcon-99c1c7b7.js → tooltipIcon-0a5a06a2.js} +0 -0
- /package/dist/general-input/{p-f4f4ccda.js → p-2dccd0bf.js} +0 -0
- /package/dist/general-input/{p-04d4b145.js → p-ba14eb83.js} +0 -0
|
@@ -1,975 +0,0 @@
|
|
|
1
|
-
import { m as microTask, a as DisabledMixin, K as KeyboardMixin } from './field-mixin.js';
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
@license
|
|
5
|
-
Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
|
|
6
|
-
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
|
7
|
-
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
|
8
|
-
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
|
9
|
-
Code distributed by Google as part of the polymer project is also
|
|
10
|
-
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
|
11
|
-
*/
|
|
12
|
-
|
|
13
|
-
const passiveTouchGestures = false;
|
|
14
|
-
const wrap = (node) => node;
|
|
15
|
-
|
|
16
|
-
// Detect native touch action support
|
|
17
|
-
const HAS_NATIVE_TA = typeof document.head.style.touchAction === 'string';
|
|
18
|
-
const GESTURE_KEY = '__polymerGestures';
|
|
19
|
-
const HANDLED_OBJ = '__polymerGesturesHandled';
|
|
20
|
-
const TOUCH_ACTION = '__polymerGesturesTouchAction';
|
|
21
|
-
// Radius for tap and track
|
|
22
|
-
const TAP_DISTANCE = 25;
|
|
23
|
-
const TRACK_DISTANCE = 5;
|
|
24
|
-
// Number of last N track positions to keep
|
|
25
|
-
const TRACK_LENGTH = 2;
|
|
26
|
-
|
|
27
|
-
const MOUSE_EVENTS = ['mousedown', 'mousemove', 'mouseup', 'click'];
|
|
28
|
-
// An array of bitmask values for mapping MouseEvent.which to MouseEvent.buttons
|
|
29
|
-
const MOUSE_WHICH_TO_BUTTONS = [0, 1, 4, 2];
|
|
30
|
-
const MOUSE_HAS_BUTTONS = (function () {
|
|
31
|
-
try {
|
|
32
|
-
return new MouseEvent('test', { buttons: 1 }).buttons === 1;
|
|
33
|
-
} catch (e) {
|
|
34
|
-
return false;
|
|
35
|
-
}
|
|
36
|
-
})();
|
|
37
|
-
|
|
38
|
-
/**
|
|
39
|
-
* @param {string} name Possible mouse event name
|
|
40
|
-
* @return {boolean} true if mouse event, false if not
|
|
41
|
-
*/
|
|
42
|
-
function isMouseEvent(name) {
|
|
43
|
-
return MOUSE_EVENTS.indexOf(name) > -1;
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
/* eslint no-empty: ["error", { "allowEmptyCatch": true }] */
|
|
47
|
-
// check for passive event listeners
|
|
48
|
-
let supportsPassive = false;
|
|
49
|
-
(function () {
|
|
50
|
-
try {
|
|
51
|
-
const opts = Object.defineProperty({}, 'passive', {
|
|
52
|
-
// eslint-disable-next-line getter-return
|
|
53
|
-
get() {
|
|
54
|
-
supportsPassive = true;
|
|
55
|
-
},
|
|
56
|
-
});
|
|
57
|
-
window.addEventListener('test', null, opts);
|
|
58
|
-
window.removeEventListener('test', null, opts);
|
|
59
|
-
} catch (e) {}
|
|
60
|
-
})();
|
|
61
|
-
|
|
62
|
-
/**
|
|
63
|
-
* Generate settings for event listeners, dependant on `passiveTouchGestures`
|
|
64
|
-
*
|
|
65
|
-
* @param {string} eventName Event name to determine if `{passive}` option is
|
|
66
|
-
* needed
|
|
67
|
-
* @return {{passive: boolean} | undefined} Options to use for addEventListener
|
|
68
|
-
* and removeEventListener
|
|
69
|
-
*/
|
|
70
|
-
function PASSIVE_TOUCH(eventName) {
|
|
71
|
-
if (isMouseEvent(eventName) || eventName === 'touchend') {
|
|
72
|
-
return;
|
|
73
|
-
}
|
|
74
|
-
if (HAS_NATIVE_TA && supportsPassive && passiveTouchGestures) {
|
|
75
|
-
return { passive: true };
|
|
76
|
-
}
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
// Check for touch-only devices
|
|
80
|
-
const IS_TOUCH_ONLY = navigator.userAgent.match(/iP(?:[oa]d|hone)|Android/u);
|
|
81
|
-
|
|
82
|
-
// Defined at https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#enabling-and-disabling-form-controls:-the-disabled-attribute
|
|
83
|
-
/** @type {!Object<boolean>} */
|
|
84
|
-
const canBeDisabled = {
|
|
85
|
-
button: true,
|
|
86
|
-
command: true,
|
|
87
|
-
fieldset: true,
|
|
88
|
-
input: true,
|
|
89
|
-
keygen: true,
|
|
90
|
-
optgroup: true,
|
|
91
|
-
option: true,
|
|
92
|
-
select: true,
|
|
93
|
-
textarea: true,
|
|
94
|
-
};
|
|
95
|
-
|
|
96
|
-
/**
|
|
97
|
-
* @param {MouseEvent} ev event to test for left mouse button down
|
|
98
|
-
* @return {boolean} has left mouse button down
|
|
99
|
-
*/
|
|
100
|
-
function hasLeftMouseButton(ev) {
|
|
101
|
-
const type = ev.type;
|
|
102
|
-
// Exit early if the event is not a mouse event
|
|
103
|
-
if (!isMouseEvent(type)) {
|
|
104
|
-
return false;
|
|
105
|
-
}
|
|
106
|
-
// Ev.button is not reliable for mousemove (0 is overloaded as both left button and no buttons)
|
|
107
|
-
// instead we use ev.buttons (bitmask of buttons) or fall back to ev.which (deprecated, 0 for no buttons, 1 for left button)
|
|
108
|
-
if (type === 'mousemove') {
|
|
109
|
-
// Allow undefined for testing events
|
|
110
|
-
let buttons = ev.buttons === undefined ? 1 : ev.buttons;
|
|
111
|
-
if (ev instanceof window.MouseEvent && !MOUSE_HAS_BUTTONS) {
|
|
112
|
-
buttons = MOUSE_WHICH_TO_BUTTONS[ev.which] || 0;
|
|
113
|
-
}
|
|
114
|
-
// Buttons is a bitmask, check that the left button bit is set (1)
|
|
115
|
-
return Boolean(buttons & 1);
|
|
116
|
-
}
|
|
117
|
-
// Allow undefined for testing events
|
|
118
|
-
const button = ev.button === undefined ? 0 : ev.button;
|
|
119
|
-
// Ev.button is 0 in mousedown/mouseup/click for left button activation
|
|
120
|
-
return button === 0;
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
function isSyntheticClick(ev) {
|
|
124
|
-
if (ev.type === 'click') {
|
|
125
|
-
// Ev.detail is 0 for HTMLElement.click in most browsers
|
|
126
|
-
if (ev.detail === 0) {
|
|
127
|
-
return true;
|
|
128
|
-
}
|
|
129
|
-
// In the worst case, check that the x/y position of the click is within
|
|
130
|
-
// the bounding box of the target of the event
|
|
131
|
-
// Thanks IE 10 >:(
|
|
132
|
-
const t = _findOriginalTarget(ev);
|
|
133
|
-
// Make sure the target of the event is an element so we can use getBoundingClientRect,
|
|
134
|
-
// if not, just assume it is a synthetic click
|
|
135
|
-
if (!t.nodeType || /** @type {Element} */ (t).nodeType !== Node.ELEMENT_NODE) {
|
|
136
|
-
return true;
|
|
137
|
-
}
|
|
138
|
-
const bcr = /** @type {Element} */ (t).getBoundingClientRect();
|
|
139
|
-
// Use page x/y to account for scrolling
|
|
140
|
-
const x = ev.pageX,
|
|
141
|
-
y = ev.pageY;
|
|
142
|
-
// Ev is a synthetic click if the position is outside the bounding box of the target
|
|
143
|
-
return !(x >= bcr.left && x <= bcr.right && y >= bcr.top && y <= bcr.bottom);
|
|
144
|
-
}
|
|
145
|
-
return false;
|
|
146
|
-
}
|
|
147
|
-
|
|
148
|
-
const POINTERSTATE = {
|
|
149
|
-
mouse: {
|
|
150
|
-
target: null,
|
|
151
|
-
mouseIgnoreJob: null,
|
|
152
|
-
},
|
|
153
|
-
touch: {
|
|
154
|
-
x: 0,
|
|
155
|
-
y: 0,
|
|
156
|
-
id: -1,
|
|
157
|
-
scrollDecided: false,
|
|
158
|
-
},
|
|
159
|
-
};
|
|
160
|
-
|
|
161
|
-
function firstTouchAction(ev) {
|
|
162
|
-
let ta = 'auto';
|
|
163
|
-
const path = getComposedPath(ev);
|
|
164
|
-
for (let i = 0, n; i < path.length; i++) {
|
|
165
|
-
n = path[i];
|
|
166
|
-
if (n[TOUCH_ACTION]) {
|
|
167
|
-
ta = n[TOUCH_ACTION];
|
|
168
|
-
break;
|
|
169
|
-
}
|
|
170
|
-
}
|
|
171
|
-
return ta;
|
|
172
|
-
}
|
|
173
|
-
|
|
174
|
-
function trackDocument(stateObj, movefn, upfn) {
|
|
175
|
-
stateObj.movefn = movefn;
|
|
176
|
-
stateObj.upfn = upfn;
|
|
177
|
-
document.addEventListener('mousemove', movefn);
|
|
178
|
-
document.addEventListener('mouseup', upfn);
|
|
179
|
-
}
|
|
180
|
-
|
|
181
|
-
function untrackDocument(stateObj) {
|
|
182
|
-
document.removeEventListener('mousemove', stateObj.movefn);
|
|
183
|
-
document.removeEventListener('mouseup', stateObj.upfn);
|
|
184
|
-
stateObj.movefn = null;
|
|
185
|
-
stateObj.upfn = null;
|
|
186
|
-
}
|
|
187
|
-
|
|
188
|
-
/**
|
|
189
|
-
* Returns the composedPath for the given event.
|
|
190
|
-
* @param {Event} event to process
|
|
191
|
-
* @return {!Array<!EventTarget>} Path of the event
|
|
192
|
-
*/
|
|
193
|
-
const getComposedPath =
|
|
194
|
-
window.ShadyDOM && window.ShadyDOM.noPatch
|
|
195
|
-
? window.ShadyDOM.composedPath
|
|
196
|
-
: (event) => (event.composedPath && event.composedPath()) || [];
|
|
197
|
-
|
|
198
|
-
/** @type {!Object<string, !GestureRecognizer>} */
|
|
199
|
-
const gestures = {};
|
|
200
|
-
|
|
201
|
-
/** @type {!Array<!GestureRecognizer>} */
|
|
202
|
-
const recognizers = [];
|
|
203
|
-
|
|
204
|
-
/**
|
|
205
|
-
* Finds the element rendered on the screen at the provided coordinates.
|
|
206
|
-
*
|
|
207
|
-
* Similar to `document.elementFromPoint`, but pierces through
|
|
208
|
-
* shadow roots.
|
|
209
|
-
*
|
|
210
|
-
* @param {number} x Horizontal pixel coordinate
|
|
211
|
-
* @param {number} y Vertical pixel coordinate
|
|
212
|
-
* @return {Element} Returns the deepest shadowRoot inclusive element
|
|
213
|
-
* found at the screen position given.
|
|
214
|
-
*/
|
|
215
|
-
function deepTargetFind(x, y) {
|
|
216
|
-
let node = document.elementFromPoint(x, y);
|
|
217
|
-
let next = node;
|
|
218
|
-
// This code path is only taken when native ShadowDOM is used
|
|
219
|
-
// if there is a shadowroot, it may have a node at x/y
|
|
220
|
-
// if there is not a shadowroot, exit the loop
|
|
221
|
-
while (next && next.shadowRoot && !window.ShadyDOM) {
|
|
222
|
-
// If there is a node at x/y in the shadowroot, look deeper
|
|
223
|
-
const oldNext = next;
|
|
224
|
-
next = next.shadowRoot.elementFromPoint(x, y);
|
|
225
|
-
// On Safari, elementFromPoint may return the shadowRoot host
|
|
226
|
-
if (oldNext === next) {
|
|
227
|
-
break;
|
|
228
|
-
}
|
|
229
|
-
if (next) {
|
|
230
|
-
node = next;
|
|
231
|
-
}
|
|
232
|
-
}
|
|
233
|
-
return node;
|
|
234
|
-
}
|
|
235
|
-
|
|
236
|
-
/**
|
|
237
|
-
* A cheaper check than ev.composedPath()[0];
|
|
238
|
-
*
|
|
239
|
-
* @private
|
|
240
|
-
* @param {Event|Touch} ev Event.
|
|
241
|
-
* @return {EventTarget} Returns the event target.
|
|
242
|
-
*/
|
|
243
|
-
function _findOriginalTarget(ev) {
|
|
244
|
-
const path = getComposedPath(/** @type {?Event} */ (ev));
|
|
245
|
-
// It shouldn't be, but sometimes path is empty (window on Safari).
|
|
246
|
-
return path.length > 0 ? path[0] : ev.target;
|
|
247
|
-
}
|
|
248
|
-
|
|
249
|
-
/**
|
|
250
|
-
* @private
|
|
251
|
-
* @param {Event} ev Event.
|
|
252
|
-
* @return {void}
|
|
253
|
-
*/
|
|
254
|
-
function _handleNative(ev) {
|
|
255
|
-
const type = ev.type;
|
|
256
|
-
const node = ev.currentTarget;
|
|
257
|
-
const gobj = node[GESTURE_KEY];
|
|
258
|
-
if (!gobj) {
|
|
259
|
-
return;
|
|
260
|
-
}
|
|
261
|
-
const gs = gobj[type];
|
|
262
|
-
if (!gs) {
|
|
263
|
-
return;
|
|
264
|
-
}
|
|
265
|
-
if (!ev[HANDLED_OBJ]) {
|
|
266
|
-
ev[HANDLED_OBJ] = {};
|
|
267
|
-
if (type.startsWith('touch')) {
|
|
268
|
-
const t = ev.changedTouches[0];
|
|
269
|
-
if (type === 'touchstart') {
|
|
270
|
-
// Only handle the first finger
|
|
271
|
-
if (ev.touches.length === 1) {
|
|
272
|
-
POINTERSTATE.touch.id = t.identifier;
|
|
273
|
-
}
|
|
274
|
-
}
|
|
275
|
-
if (POINTERSTATE.touch.id !== t.identifier) {
|
|
276
|
-
return;
|
|
277
|
-
}
|
|
278
|
-
if (!HAS_NATIVE_TA) {
|
|
279
|
-
if (type === 'touchstart' || type === 'touchmove') {
|
|
280
|
-
_handleTouchAction(ev);
|
|
281
|
-
}
|
|
282
|
-
}
|
|
283
|
-
}
|
|
284
|
-
}
|
|
285
|
-
const handled = ev[HANDLED_OBJ];
|
|
286
|
-
// Used to ignore synthetic mouse events
|
|
287
|
-
if (handled.skip) {
|
|
288
|
-
return;
|
|
289
|
-
}
|
|
290
|
-
// Reset recognizer state
|
|
291
|
-
for (let i = 0, r; i < recognizers.length; i++) {
|
|
292
|
-
r = recognizers[i];
|
|
293
|
-
if (gs[r.name] && !handled[r.name]) {
|
|
294
|
-
if (r.flow && r.flow.start.indexOf(ev.type) > -1 && r.reset) {
|
|
295
|
-
r.reset();
|
|
296
|
-
}
|
|
297
|
-
}
|
|
298
|
-
}
|
|
299
|
-
// Enforce gesture recognizer order
|
|
300
|
-
for (let i = 0, r; i < recognizers.length; i++) {
|
|
301
|
-
r = recognizers[i];
|
|
302
|
-
if (gs[r.name] && !handled[r.name]) {
|
|
303
|
-
handled[r.name] = true;
|
|
304
|
-
r[type](ev);
|
|
305
|
-
}
|
|
306
|
-
}
|
|
307
|
-
}
|
|
308
|
-
|
|
309
|
-
/**
|
|
310
|
-
* @private
|
|
311
|
-
* @param {TouchEvent} ev Event.
|
|
312
|
-
* @return {void}
|
|
313
|
-
*/
|
|
314
|
-
function _handleTouchAction(ev) {
|
|
315
|
-
const t = ev.changedTouches[0];
|
|
316
|
-
const type = ev.type;
|
|
317
|
-
if (type === 'touchstart') {
|
|
318
|
-
POINTERSTATE.touch.x = t.clientX;
|
|
319
|
-
POINTERSTATE.touch.y = t.clientY;
|
|
320
|
-
POINTERSTATE.touch.scrollDecided = false;
|
|
321
|
-
} else if (type === 'touchmove') {
|
|
322
|
-
if (POINTERSTATE.touch.scrollDecided) {
|
|
323
|
-
return;
|
|
324
|
-
}
|
|
325
|
-
POINTERSTATE.touch.scrollDecided = true;
|
|
326
|
-
const ta = firstTouchAction(ev);
|
|
327
|
-
let shouldPrevent = false;
|
|
328
|
-
const dx = Math.abs(POINTERSTATE.touch.x - t.clientX);
|
|
329
|
-
const dy = Math.abs(POINTERSTATE.touch.y - t.clientY);
|
|
330
|
-
if (!ev.cancelable) ; else if (ta === 'none') {
|
|
331
|
-
shouldPrevent = true;
|
|
332
|
-
} else if (ta === 'pan-x') {
|
|
333
|
-
shouldPrevent = dy > dx;
|
|
334
|
-
} else if (ta === 'pan-y') {
|
|
335
|
-
shouldPrevent = dx > dy;
|
|
336
|
-
}
|
|
337
|
-
if (shouldPrevent) {
|
|
338
|
-
ev.preventDefault();
|
|
339
|
-
} else {
|
|
340
|
-
prevent('track');
|
|
341
|
-
}
|
|
342
|
-
}
|
|
343
|
-
}
|
|
344
|
-
|
|
345
|
-
/**
|
|
346
|
-
* Adds an event listener to a node for the given gesture type.
|
|
347
|
-
*
|
|
348
|
-
* @param {!EventTarget} node Node to add listener on
|
|
349
|
-
* @param {string} evType Gesture type: `down`, `up`, `track`, or `tap`
|
|
350
|
-
* @param {!function(!Event):void} handler Event listener function to call
|
|
351
|
-
* @return {boolean} Returns true if a gesture event listener was added.
|
|
352
|
-
*/
|
|
353
|
-
function addListener(node, evType, handler) {
|
|
354
|
-
if (gestures[evType]) {
|
|
355
|
-
_add(node, evType, handler);
|
|
356
|
-
return true;
|
|
357
|
-
}
|
|
358
|
-
return false;
|
|
359
|
-
}
|
|
360
|
-
|
|
361
|
-
/**
|
|
362
|
-
* Automate the event listeners for the native events
|
|
363
|
-
*
|
|
364
|
-
* @private
|
|
365
|
-
* @param {!EventTarget} node Node on which to add the event.
|
|
366
|
-
* @param {string} evType Event type to add.
|
|
367
|
-
* @param {function(!Event)} handler Event handler function.
|
|
368
|
-
* @return {void}
|
|
369
|
-
*/
|
|
370
|
-
function _add(node, evType, handler) {
|
|
371
|
-
const recognizer = gestures[evType];
|
|
372
|
-
const deps = recognizer.deps;
|
|
373
|
-
const name = recognizer.name;
|
|
374
|
-
let gobj = node[GESTURE_KEY];
|
|
375
|
-
if (!gobj) {
|
|
376
|
-
node[GESTURE_KEY] = gobj = {};
|
|
377
|
-
}
|
|
378
|
-
for (let i = 0, dep, gd; i < deps.length; i++) {
|
|
379
|
-
dep = deps[i];
|
|
380
|
-
// Don't add mouse handlers on iOS because they cause gray selection overlays
|
|
381
|
-
if (IS_TOUCH_ONLY && isMouseEvent(dep) && dep !== 'click') {
|
|
382
|
-
continue;
|
|
383
|
-
}
|
|
384
|
-
gd = gobj[dep];
|
|
385
|
-
if (!gd) {
|
|
386
|
-
gobj[dep] = gd = { _count: 0 };
|
|
387
|
-
}
|
|
388
|
-
if (gd._count === 0) {
|
|
389
|
-
node.addEventListener(dep, _handleNative, PASSIVE_TOUCH(dep));
|
|
390
|
-
}
|
|
391
|
-
gd[name] = (gd[name] || 0) + 1;
|
|
392
|
-
gd._count = (gd._count || 0) + 1;
|
|
393
|
-
}
|
|
394
|
-
node.addEventListener(evType, handler);
|
|
395
|
-
if (recognizer.touchAction) {
|
|
396
|
-
setTouchAction(node, recognizer.touchAction);
|
|
397
|
-
}
|
|
398
|
-
}
|
|
399
|
-
|
|
400
|
-
/**
|
|
401
|
-
* Registers a new gesture event recognizer for adding new custom
|
|
402
|
-
* gesture event types.
|
|
403
|
-
*
|
|
404
|
-
* @param {!GestureRecognizer} recog Gesture recognizer descriptor
|
|
405
|
-
* @return {void}
|
|
406
|
-
*/
|
|
407
|
-
function register(recog) {
|
|
408
|
-
recognizers.push(recog);
|
|
409
|
-
recog.emits.forEach((emit) => {
|
|
410
|
-
gestures[emit] = recog;
|
|
411
|
-
});
|
|
412
|
-
}
|
|
413
|
-
|
|
414
|
-
/**
|
|
415
|
-
* @private
|
|
416
|
-
* @param {string} evName Event name.
|
|
417
|
-
* @return {Object} Returns the gesture for the given event name.
|
|
418
|
-
*/
|
|
419
|
-
function _findRecognizerByEvent(evName) {
|
|
420
|
-
for (let i = 0, r; i < recognizers.length; i++) {
|
|
421
|
-
r = recognizers[i];
|
|
422
|
-
for (let j = 0, n; j < r.emits.length; j++) {
|
|
423
|
-
n = r.emits[j];
|
|
424
|
-
if (n === evName) {
|
|
425
|
-
return r;
|
|
426
|
-
}
|
|
427
|
-
}
|
|
428
|
-
}
|
|
429
|
-
return null;
|
|
430
|
-
}
|
|
431
|
-
|
|
432
|
-
/**
|
|
433
|
-
* Sets scrolling direction on node.
|
|
434
|
-
*
|
|
435
|
-
* This value is checked on first move, thus it should be called prior to
|
|
436
|
-
* adding event listeners.
|
|
437
|
-
*
|
|
438
|
-
* @param {!EventTarget} node Node to set touch action setting on
|
|
439
|
-
* @param {string} value Touch action value
|
|
440
|
-
* @return {void}
|
|
441
|
-
*/
|
|
442
|
-
function setTouchAction(node, value) {
|
|
443
|
-
if (HAS_NATIVE_TA && node instanceof HTMLElement) {
|
|
444
|
-
// NOTE: add touchAction async so that events can be added in
|
|
445
|
-
// custom element constructors. Otherwise we run afoul of custom
|
|
446
|
-
// elements restriction against settings attributes (style) in the
|
|
447
|
-
// constructor.
|
|
448
|
-
microTask.run(() => {
|
|
449
|
-
node.style.touchAction = value;
|
|
450
|
-
});
|
|
451
|
-
}
|
|
452
|
-
node[TOUCH_ACTION] = value;
|
|
453
|
-
}
|
|
454
|
-
|
|
455
|
-
/**
|
|
456
|
-
* Dispatches an event on the `target` element of `type` with the given
|
|
457
|
-
* `detail`.
|
|
458
|
-
* @private
|
|
459
|
-
* @param {!EventTarget} target The element on which to fire an event.
|
|
460
|
-
* @param {string} type The type of event to fire.
|
|
461
|
-
* @param {!Object=} detail The detail object to populate on the event.
|
|
462
|
-
* @return {void}
|
|
463
|
-
*/
|
|
464
|
-
function _fire(target, type, detail) {
|
|
465
|
-
const ev = new Event(type, { bubbles: true, cancelable: true, composed: true });
|
|
466
|
-
ev.detail = detail;
|
|
467
|
-
wrap(/** @type {!Node} */ (target)).dispatchEvent(ev);
|
|
468
|
-
// Forward `preventDefault` in a clean way
|
|
469
|
-
if (ev.defaultPrevented) {
|
|
470
|
-
const preventer = detail.preventer || detail.sourceEvent;
|
|
471
|
-
if (preventer && preventer.preventDefault) {
|
|
472
|
-
preventer.preventDefault();
|
|
473
|
-
}
|
|
474
|
-
}
|
|
475
|
-
}
|
|
476
|
-
|
|
477
|
-
/**
|
|
478
|
-
* Prevents the dispatch and default action of the given event name.
|
|
479
|
-
*
|
|
480
|
-
* @param {string} evName Event name.
|
|
481
|
-
* @return {void}
|
|
482
|
-
*/
|
|
483
|
-
function prevent(evName) {
|
|
484
|
-
const recognizer = _findRecognizerByEvent(evName);
|
|
485
|
-
if (recognizer.info) {
|
|
486
|
-
recognizer.info.prevent = true;
|
|
487
|
-
}
|
|
488
|
-
}
|
|
489
|
-
|
|
490
|
-
register({
|
|
491
|
-
name: 'downup',
|
|
492
|
-
deps: ['mousedown', 'touchstart', 'touchend'],
|
|
493
|
-
flow: {
|
|
494
|
-
start: ['mousedown', 'touchstart'],
|
|
495
|
-
end: ['mouseup', 'touchend'],
|
|
496
|
-
},
|
|
497
|
-
emits: ['down', 'up'],
|
|
498
|
-
|
|
499
|
-
info: {
|
|
500
|
-
movefn: null,
|
|
501
|
-
upfn: null,
|
|
502
|
-
},
|
|
503
|
-
|
|
504
|
-
/**
|
|
505
|
-
* @this {GestureRecognizer}
|
|
506
|
-
* @return {void}
|
|
507
|
-
*/
|
|
508
|
-
reset() {
|
|
509
|
-
untrackDocument(this.info);
|
|
510
|
-
},
|
|
511
|
-
|
|
512
|
-
/**
|
|
513
|
-
* @this {GestureRecognizer}
|
|
514
|
-
* @param {MouseEvent} e
|
|
515
|
-
* @return {void}
|
|
516
|
-
*/
|
|
517
|
-
mousedown(e) {
|
|
518
|
-
if (!hasLeftMouseButton(e)) {
|
|
519
|
-
return;
|
|
520
|
-
}
|
|
521
|
-
const t = _findOriginalTarget(e);
|
|
522
|
-
// eslint-disable-next-line @typescript-eslint/no-this-alias
|
|
523
|
-
const self = this;
|
|
524
|
-
const movefn = (e) => {
|
|
525
|
-
if (!hasLeftMouseButton(e)) {
|
|
526
|
-
downupFire('up', t, e);
|
|
527
|
-
untrackDocument(self.info);
|
|
528
|
-
}
|
|
529
|
-
};
|
|
530
|
-
const upfn = (e) => {
|
|
531
|
-
if (hasLeftMouseButton(e)) {
|
|
532
|
-
downupFire('up', t, e);
|
|
533
|
-
}
|
|
534
|
-
untrackDocument(self.info);
|
|
535
|
-
};
|
|
536
|
-
trackDocument(this.info, movefn, upfn);
|
|
537
|
-
downupFire('down', t, e);
|
|
538
|
-
},
|
|
539
|
-
|
|
540
|
-
/**
|
|
541
|
-
* @this {GestureRecognizer}
|
|
542
|
-
* @param {TouchEvent} e
|
|
543
|
-
* @return {void}
|
|
544
|
-
*/
|
|
545
|
-
touchstart(e) {
|
|
546
|
-
downupFire('down', _findOriginalTarget(e), e.changedTouches[0], e);
|
|
547
|
-
},
|
|
548
|
-
|
|
549
|
-
/**
|
|
550
|
-
* @this {GestureRecognizer}
|
|
551
|
-
* @param {TouchEvent} e
|
|
552
|
-
* @return {void}
|
|
553
|
-
*/
|
|
554
|
-
touchend(e) {
|
|
555
|
-
downupFire('up', _findOriginalTarget(e), e.changedTouches[0], e);
|
|
556
|
-
},
|
|
557
|
-
});
|
|
558
|
-
|
|
559
|
-
/**
|
|
560
|
-
* @param {string} type
|
|
561
|
-
* @param {EventTarget} target
|
|
562
|
-
* @param {Event|Touch} event
|
|
563
|
-
* @param {Event=} preventer
|
|
564
|
-
* @return {void}
|
|
565
|
-
*/
|
|
566
|
-
function downupFire(type, target, event, preventer) {
|
|
567
|
-
if (!target) {
|
|
568
|
-
return;
|
|
569
|
-
}
|
|
570
|
-
_fire(target, type, {
|
|
571
|
-
x: event.clientX,
|
|
572
|
-
y: event.clientY,
|
|
573
|
-
sourceEvent: event,
|
|
574
|
-
preventer,
|
|
575
|
-
prevent(e) {
|
|
576
|
-
return prevent(e);
|
|
577
|
-
},
|
|
578
|
-
});
|
|
579
|
-
}
|
|
580
|
-
|
|
581
|
-
register({
|
|
582
|
-
name: 'track',
|
|
583
|
-
touchAction: 'none',
|
|
584
|
-
deps: ['mousedown', 'touchstart', 'touchmove', 'touchend'],
|
|
585
|
-
flow: {
|
|
586
|
-
start: ['mousedown', 'touchstart'],
|
|
587
|
-
end: ['mouseup', 'touchend'],
|
|
588
|
-
},
|
|
589
|
-
emits: ['track'],
|
|
590
|
-
|
|
591
|
-
info: {
|
|
592
|
-
x: 0,
|
|
593
|
-
y: 0,
|
|
594
|
-
state: 'start',
|
|
595
|
-
started: false,
|
|
596
|
-
moves: [],
|
|
597
|
-
/** @this {GestureInfo} */
|
|
598
|
-
addMove(move) {
|
|
599
|
-
if (this.moves.length > TRACK_LENGTH) {
|
|
600
|
-
this.moves.shift();
|
|
601
|
-
}
|
|
602
|
-
this.moves.push(move);
|
|
603
|
-
},
|
|
604
|
-
movefn: null,
|
|
605
|
-
upfn: null,
|
|
606
|
-
prevent: false,
|
|
607
|
-
},
|
|
608
|
-
|
|
609
|
-
/**
|
|
610
|
-
* @this {GestureRecognizer}
|
|
611
|
-
* @return {void}
|
|
612
|
-
*/
|
|
613
|
-
reset() {
|
|
614
|
-
this.info.state = 'start';
|
|
615
|
-
this.info.started = false;
|
|
616
|
-
this.info.moves = [];
|
|
617
|
-
this.info.x = 0;
|
|
618
|
-
this.info.y = 0;
|
|
619
|
-
this.info.prevent = false;
|
|
620
|
-
untrackDocument(this.info);
|
|
621
|
-
},
|
|
622
|
-
|
|
623
|
-
/**
|
|
624
|
-
* @this {GestureRecognizer}
|
|
625
|
-
* @param {MouseEvent} e
|
|
626
|
-
* @return {void}
|
|
627
|
-
*/
|
|
628
|
-
mousedown(e) {
|
|
629
|
-
if (!hasLeftMouseButton(e)) {
|
|
630
|
-
return;
|
|
631
|
-
}
|
|
632
|
-
const t = _findOriginalTarget(e);
|
|
633
|
-
// eslint-disable-next-line @typescript-eslint/no-this-alias
|
|
634
|
-
const self = this;
|
|
635
|
-
const movefn = (e) => {
|
|
636
|
-
const x = e.clientX,
|
|
637
|
-
y = e.clientY;
|
|
638
|
-
if (trackHasMovedEnough(self.info, x, y)) {
|
|
639
|
-
// First move is 'start', subsequent moves are 'move', mouseup is 'end'
|
|
640
|
-
self.info.state = self.info.started ? (e.type === 'mouseup' ? 'end' : 'track') : 'start';
|
|
641
|
-
if (self.info.state === 'start') {
|
|
642
|
-
// If and only if tracking, always prevent tap
|
|
643
|
-
prevent('tap');
|
|
644
|
-
}
|
|
645
|
-
self.info.addMove({ x, y });
|
|
646
|
-
if (!hasLeftMouseButton(e)) {
|
|
647
|
-
// Always fire "end"
|
|
648
|
-
self.info.state = 'end';
|
|
649
|
-
untrackDocument(self.info);
|
|
650
|
-
}
|
|
651
|
-
if (t) {
|
|
652
|
-
trackFire(self.info, t, e);
|
|
653
|
-
}
|
|
654
|
-
self.info.started = true;
|
|
655
|
-
}
|
|
656
|
-
};
|
|
657
|
-
const upfn = (e) => {
|
|
658
|
-
if (self.info.started) {
|
|
659
|
-
movefn(e);
|
|
660
|
-
}
|
|
661
|
-
|
|
662
|
-
// Remove the temporary listeners
|
|
663
|
-
untrackDocument(self.info);
|
|
664
|
-
};
|
|
665
|
-
// Add temporary document listeners as mouse retargets
|
|
666
|
-
trackDocument(this.info, movefn, upfn);
|
|
667
|
-
this.info.x = e.clientX;
|
|
668
|
-
this.info.y = e.clientY;
|
|
669
|
-
},
|
|
670
|
-
|
|
671
|
-
/**
|
|
672
|
-
* @this {GestureRecognizer}
|
|
673
|
-
* @param {TouchEvent} e
|
|
674
|
-
* @return {void}
|
|
675
|
-
*/
|
|
676
|
-
touchstart(e) {
|
|
677
|
-
const ct = e.changedTouches[0];
|
|
678
|
-
this.info.x = ct.clientX;
|
|
679
|
-
this.info.y = ct.clientY;
|
|
680
|
-
},
|
|
681
|
-
|
|
682
|
-
/**
|
|
683
|
-
* @this {GestureRecognizer}
|
|
684
|
-
* @param {TouchEvent} e
|
|
685
|
-
* @return {void}
|
|
686
|
-
*/
|
|
687
|
-
touchmove(e) {
|
|
688
|
-
const t = _findOriginalTarget(e);
|
|
689
|
-
const ct = e.changedTouches[0];
|
|
690
|
-
const x = ct.clientX,
|
|
691
|
-
y = ct.clientY;
|
|
692
|
-
if (trackHasMovedEnough(this.info, x, y)) {
|
|
693
|
-
if (this.info.state === 'start') {
|
|
694
|
-
// If and only if tracking, always prevent tap
|
|
695
|
-
prevent('tap');
|
|
696
|
-
}
|
|
697
|
-
this.info.addMove({ x, y });
|
|
698
|
-
trackFire(this.info, t, ct);
|
|
699
|
-
this.info.state = 'track';
|
|
700
|
-
this.info.started = true;
|
|
701
|
-
}
|
|
702
|
-
},
|
|
703
|
-
|
|
704
|
-
/**
|
|
705
|
-
* @this {GestureRecognizer}
|
|
706
|
-
* @param {TouchEvent} e
|
|
707
|
-
* @return {void}
|
|
708
|
-
*/
|
|
709
|
-
touchend(e) {
|
|
710
|
-
const t = _findOriginalTarget(e);
|
|
711
|
-
const ct = e.changedTouches[0];
|
|
712
|
-
// Only trackend if track was started and not aborted
|
|
713
|
-
if (this.info.started) {
|
|
714
|
-
// Reset started state on up
|
|
715
|
-
this.info.state = 'end';
|
|
716
|
-
this.info.addMove({ x: ct.clientX, y: ct.clientY });
|
|
717
|
-
trackFire(this.info, t, ct);
|
|
718
|
-
}
|
|
719
|
-
},
|
|
720
|
-
});
|
|
721
|
-
|
|
722
|
-
/**
|
|
723
|
-
* @param {!GestureInfo} info
|
|
724
|
-
* @param {number} x
|
|
725
|
-
* @param {number} y
|
|
726
|
-
* @return {boolean}
|
|
727
|
-
*/
|
|
728
|
-
function trackHasMovedEnough(info, x, y) {
|
|
729
|
-
if (info.prevent) {
|
|
730
|
-
return false;
|
|
731
|
-
}
|
|
732
|
-
if (info.started) {
|
|
733
|
-
return true;
|
|
734
|
-
}
|
|
735
|
-
const dx = Math.abs(info.x - x);
|
|
736
|
-
const dy = Math.abs(info.y - y);
|
|
737
|
-
return dx >= TRACK_DISTANCE || dy >= TRACK_DISTANCE;
|
|
738
|
-
}
|
|
739
|
-
|
|
740
|
-
/**
|
|
741
|
-
* @param {!GestureInfo} info
|
|
742
|
-
* @param {?EventTarget} target
|
|
743
|
-
* @param {Touch} touch
|
|
744
|
-
* @return {void}
|
|
745
|
-
*/
|
|
746
|
-
function trackFire(info, target, touch) {
|
|
747
|
-
if (!target) {
|
|
748
|
-
return;
|
|
749
|
-
}
|
|
750
|
-
const secondlast = info.moves[info.moves.length - 2];
|
|
751
|
-
const lastmove = info.moves[info.moves.length - 1];
|
|
752
|
-
const dx = lastmove.x - info.x;
|
|
753
|
-
const dy = lastmove.y - info.y;
|
|
754
|
-
let ddx,
|
|
755
|
-
ddy = 0;
|
|
756
|
-
if (secondlast) {
|
|
757
|
-
ddx = lastmove.x - secondlast.x;
|
|
758
|
-
ddy = lastmove.y - secondlast.y;
|
|
759
|
-
}
|
|
760
|
-
_fire(target, 'track', {
|
|
761
|
-
state: info.state,
|
|
762
|
-
x: touch.clientX,
|
|
763
|
-
y: touch.clientY,
|
|
764
|
-
dx,
|
|
765
|
-
dy,
|
|
766
|
-
ddx,
|
|
767
|
-
ddy,
|
|
768
|
-
sourceEvent: touch,
|
|
769
|
-
hover() {
|
|
770
|
-
return deepTargetFind(touch.clientX, touch.clientY);
|
|
771
|
-
},
|
|
772
|
-
});
|
|
773
|
-
}
|
|
774
|
-
|
|
775
|
-
register({
|
|
776
|
-
name: 'tap',
|
|
777
|
-
deps: ['mousedown', 'click', 'touchstart', 'touchend'],
|
|
778
|
-
flow: {
|
|
779
|
-
start: ['mousedown', 'touchstart'],
|
|
780
|
-
end: ['click', 'touchend'],
|
|
781
|
-
},
|
|
782
|
-
emits: ['tap'],
|
|
783
|
-
info: {
|
|
784
|
-
x: NaN,
|
|
785
|
-
y: NaN,
|
|
786
|
-
prevent: false,
|
|
787
|
-
},
|
|
788
|
-
|
|
789
|
-
/**
|
|
790
|
-
* @this {GestureRecognizer}
|
|
791
|
-
* @return {void}
|
|
792
|
-
*/
|
|
793
|
-
reset() {
|
|
794
|
-
this.info.x = NaN;
|
|
795
|
-
this.info.y = NaN;
|
|
796
|
-
this.info.prevent = false;
|
|
797
|
-
},
|
|
798
|
-
|
|
799
|
-
/**
|
|
800
|
-
* @this {GestureRecognizer}
|
|
801
|
-
* @param {MouseEvent} e
|
|
802
|
-
* @return {void}
|
|
803
|
-
*/
|
|
804
|
-
mousedown(e) {
|
|
805
|
-
if (hasLeftMouseButton(e)) {
|
|
806
|
-
this.info.x = e.clientX;
|
|
807
|
-
this.info.y = e.clientY;
|
|
808
|
-
}
|
|
809
|
-
},
|
|
810
|
-
|
|
811
|
-
/**
|
|
812
|
-
* @this {GestureRecognizer}
|
|
813
|
-
* @param {MouseEvent} e
|
|
814
|
-
* @return {void}
|
|
815
|
-
*/
|
|
816
|
-
click(e) {
|
|
817
|
-
if (hasLeftMouseButton(e)) {
|
|
818
|
-
trackForward(this.info, e);
|
|
819
|
-
}
|
|
820
|
-
},
|
|
821
|
-
|
|
822
|
-
/**
|
|
823
|
-
* @this {GestureRecognizer}
|
|
824
|
-
* @param {TouchEvent} e
|
|
825
|
-
* @return {void}
|
|
826
|
-
*/
|
|
827
|
-
touchstart(e) {
|
|
828
|
-
const touch = e.changedTouches[0];
|
|
829
|
-
this.info.x = touch.clientX;
|
|
830
|
-
this.info.y = touch.clientY;
|
|
831
|
-
},
|
|
832
|
-
|
|
833
|
-
/**
|
|
834
|
-
* @this {GestureRecognizer}
|
|
835
|
-
* @param {TouchEvent} e
|
|
836
|
-
* @return {void}
|
|
837
|
-
*/
|
|
838
|
-
touchend(e) {
|
|
839
|
-
trackForward(this.info, e.changedTouches[0], e);
|
|
840
|
-
},
|
|
841
|
-
});
|
|
842
|
-
|
|
843
|
-
/**
|
|
844
|
-
* @param {!GestureInfo} info
|
|
845
|
-
* @param {Event | Touch} e
|
|
846
|
-
* @param {Event=} preventer
|
|
847
|
-
* @return {void}
|
|
848
|
-
*/
|
|
849
|
-
function trackForward(info, e, preventer) {
|
|
850
|
-
const dx = Math.abs(e.clientX - info.x);
|
|
851
|
-
const dy = Math.abs(e.clientY - info.y);
|
|
852
|
-
// Find original target from `preventer` for TouchEvents, or `e` for MouseEvents
|
|
853
|
-
const t = _findOriginalTarget(preventer || e);
|
|
854
|
-
if (!t || (canBeDisabled[/** @type {!HTMLElement} */ (t).localName] && t.hasAttribute('disabled'))) {
|
|
855
|
-
return;
|
|
856
|
-
}
|
|
857
|
-
// Dx,dy can be NaN if `click` has been simulated and there was no `down` for `start`
|
|
858
|
-
if (isNaN(dx) || isNaN(dy) || (dx <= TAP_DISTANCE && dy <= TAP_DISTANCE) || isSyntheticClick(e)) {
|
|
859
|
-
// Prevent taps from being generated if an event has canceled them
|
|
860
|
-
if (!info.prevent) {
|
|
861
|
-
_fire(t, 'tap', {
|
|
862
|
-
x: e.clientX,
|
|
863
|
-
y: e.clientY,
|
|
864
|
-
sourceEvent: e,
|
|
865
|
-
preventer,
|
|
866
|
-
});
|
|
867
|
-
}
|
|
868
|
-
}
|
|
869
|
-
}
|
|
870
|
-
|
|
871
|
-
/**
|
|
872
|
-
* @license
|
|
873
|
-
* Copyright (c) 2021 - 2023 Vaadin Ltd.
|
|
874
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
875
|
-
*/
|
|
876
|
-
|
|
877
|
-
/**
|
|
878
|
-
* A mixin to toggle the `active` attribute.
|
|
879
|
-
*
|
|
880
|
-
* The attribute is set whenever the user activates the element by a pointer
|
|
881
|
-
* or presses an activation key on the element from the keyboard.
|
|
882
|
-
*
|
|
883
|
-
* The attribute is removed as soon as the element is deactivated
|
|
884
|
-
* by the pointer or by releasing the activation key.
|
|
885
|
-
*
|
|
886
|
-
* @polymerMixin
|
|
887
|
-
*/
|
|
888
|
-
const ActiveMixin = (superclass) =>
|
|
889
|
-
class ActiveMixinClass extends DisabledMixin(KeyboardMixin(superclass)) {
|
|
890
|
-
/**
|
|
891
|
-
* An array of activation keys.
|
|
892
|
-
*
|
|
893
|
-
* See possible values here:
|
|
894
|
-
* https://developer.mozilla.org/ru/docs/Web/API/KeyboardEvent/key/Key_Values
|
|
895
|
-
*
|
|
896
|
-
* @protected
|
|
897
|
-
* @return {!Array<!string>}
|
|
898
|
-
*/
|
|
899
|
-
get _activeKeys() {
|
|
900
|
-
return [' '];
|
|
901
|
-
}
|
|
902
|
-
|
|
903
|
-
/** @protected */
|
|
904
|
-
ready() {
|
|
905
|
-
super.ready();
|
|
906
|
-
|
|
907
|
-
addListener(this, 'down', (event) => {
|
|
908
|
-
if (this._shouldSetActive(event)) {
|
|
909
|
-
this._setActive(true);
|
|
910
|
-
}
|
|
911
|
-
});
|
|
912
|
-
|
|
913
|
-
addListener(this, 'up', () => {
|
|
914
|
-
this._setActive(false);
|
|
915
|
-
});
|
|
916
|
-
}
|
|
917
|
-
|
|
918
|
-
/** @protected */
|
|
919
|
-
disconnectedCallback() {
|
|
920
|
-
super.disconnectedCallback();
|
|
921
|
-
|
|
922
|
-
// When the element is disconnecting from the DOM at the moment being active,
|
|
923
|
-
// the `active` attribute needs to be manually removed from the element.
|
|
924
|
-
// Otherwise, it will preserve on the element until the element is activated once again.
|
|
925
|
-
// The case reproduces for `<vaadin-date-picker>` when closing on `Cancel` or `Today` click.
|
|
926
|
-
this._setActive(false);
|
|
927
|
-
}
|
|
928
|
-
|
|
929
|
-
/**
|
|
930
|
-
* @param {KeyboardEvent | MouseEvent} _event
|
|
931
|
-
* @protected
|
|
932
|
-
*/
|
|
933
|
-
_shouldSetActive(_event) {
|
|
934
|
-
return !this.disabled;
|
|
935
|
-
}
|
|
936
|
-
|
|
937
|
-
/**
|
|
938
|
-
* Sets the `active` attribute on the element if an activation key is pressed.
|
|
939
|
-
*
|
|
940
|
-
* @param {KeyboardEvent} event
|
|
941
|
-
* @protected
|
|
942
|
-
* @override
|
|
943
|
-
*/
|
|
944
|
-
_onKeyDown(event) {
|
|
945
|
-
super._onKeyDown(event);
|
|
946
|
-
|
|
947
|
-
if (this._shouldSetActive(event) && this._activeKeys.includes(event.key)) {
|
|
948
|
-
this._setActive(true);
|
|
949
|
-
|
|
950
|
-
// Element can become hidden before the `keyup` event, e.g. on button click.
|
|
951
|
-
// Use document listener to ensure `active` attribute is removed correctly.
|
|
952
|
-
document.addEventListener(
|
|
953
|
-
'keyup',
|
|
954
|
-
(e) => {
|
|
955
|
-
if (this._activeKeys.includes(e.key)) {
|
|
956
|
-
this._setActive(false);
|
|
957
|
-
}
|
|
958
|
-
},
|
|
959
|
-
{ once: true },
|
|
960
|
-
);
|
|
961
|
-
}
|
|
962
|
-
}
|
|
963
|
-
|
|
964
|
-
/**
|
|
965
|
-
* Toggles the `active` attribute on the element.
|
|
966
|
-
*
|
|
967
|
-
* @param {boolean} active
|
|
968
|
-
* @protected
|
|
969
|
-
*/
|
|
970
|
-
_setActive(active) {
|
|
971
|
-
this.toggleAttribute('active', active);
|
|
972
|
-
}
|
|
973
|
-
};
|
|
974
|
-
|
|
975
|
-
export { ActiveMixin as A, addListener as a, setTouchAction as s };
|