@instructure/ui-dom-utils 11.7.8 → 11.7.9-pr-snapshot-1792147648392
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +13 -0
- package/es/InputModeListener.js +50 -76
- package/es/addEventListener.js +8 -44
- package/es/addInputModeListener.js +62 -90
- package/es/addPositionChangeListener.js +22 -57
- package/es/canUseDOM.js +1 -34
- package/es/contains.js +17 -55
- package/es/containsActiveElement.js +4 -38
- package/es/findDOMNode.js +28 -82
- package/es/findFocusable.js +58 -96
- package/es/findTabbable.js +5 -50
- package/es/getActiveElement.js +6 -43
- package/es/getBoundingClientRect.js +52 -88
- package/es/getCSSStyleDeclaration.js +13 -50
- package/es/getClassList.js +27 -64
- package/es/getFontSize.js +12 -52
- package/es/getOffsetParents.js +18 -56
- package/es/getScrollParents.js +41 -83
- package/es/handleMouseOverOut.js +6 -45
- package/es/index.js +1 -26
- package/es/isActiveElement.js +3 -37
- package/es/isDefinedCustomElement.js +2 -36
- package/es/isVisible.js +32 -76
- package/es/matchMedia.js +7 -44
- package/es/ownerDocument.js +8 -43
- package/es/ownerWindow.js +4 -38
- package/es/requestAnimationFrame.js +23 -62
- package/es/transformSelection.js +21 -72
- package/package.json +7 -10
- package/tsconfig.build.json +0 -1
- package/lib/InputModeListener.js +0 -91
- package/lib/addEventListener.js +0 -54
- package/lib/addInputModeListener.js +0 -115
- package/lib/addPositionChangeListener.js +0 -70
- package/lib/canUseDOM.js +0 -41
- package/lib/contains.js +0 -69
- package/lib/containsActiveElement.js +0 -50
- package/lib/findDOMNode.js +0 -96
- package/lib/findFocusable.js +0 -118
- package/lib/findTabbable.js +0 -62
- package/lib/getActiveElement.js +0 -52
- package/lib/getBoundingClientRect.js +0 -103
- package/lib/getCSSStyleDeclaration.js +0 -63
- package/lib/getClassList.js +0 -76
- package/lib/getFontSize.js +0 -66
- package/lib/getOffsetParents.js +0 -70
- package/lib/getScrollParents.js +0 -98
- package/lib/handleMouseOverOut.js +0 -54
- package/lib/index.js +0 -173
- package/lib/isActiveElement.js +0 -48
- package/lib/isDefinedCustomElement.js +0 -45
- package/lib/isVisible.js +0 -88
- package/lib/matchMedia.js +0 -56
- package/lib/ownerDocument.js +0 -54
- package/lib/ownerWindow.js +0 -49
- package/lib/package.json +0 -1
- package/lib/requestAnimationFrame.js +0 -70
- package/lib/transformSelection.js +0 -85
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,19 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [11.7.9-pr-snapshot-1792147648392](https://github.com/instructure/instructure-ui/compare/v11.7.8...v11.7.9-pr-snapshot-1792147648392) (2026-10-16)
|
|
7
|
+
|
|
8
|
+
### Build System
|
|
9
|
+
|
|
10
|
+
* **many:** replace babel with swc ([7e36c54](https://github.com/instructure/instructure-ui/commit/7e36c54d240b4fa483801c03ab18e7f860f561e2))
|
|
11
|
+
|
|
12
|
+
### BREAKING CHANGES
|
|
13
|
+
|
|
14
|
+
* **many:** `@instructure/ui-babel-preset` and
|
|
15
|
+
`@instructure/browserslist-config-instui` are removed and will no longer be
|
|
16
|
+
published. Packages depend on `@swc/helpers` instead of `@babel/runtime`.
|
|
17
|
+
|
|
18
|
+
|
|
6
19
|
## [11.7.8](https://github.com/instructure/instructure-ui/compare/v11.7.7...v11.7.8) (2026-10-02)
|
|
7
20
|
|
|
8
21
|
**Note:** Version bump only for package @instructure/ui-dom-utils
|
package/es/InputModeListener.js
CHANGED
|
@@ -1,86 +1,60 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* The MIT License (MIT)
|
|
3
|
-
*
|
|
4
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
5
|
-
*
|
|
6
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
7
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
8
|
-
* in the Software without restriction, including without limitation the rights
|
|
9
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
10
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
11
|
-
* furnished to do so, subject to the following conditions:
|
|
12
|
-
*
|
|
13
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
14
|
-
* copies or substantial portions of the Software.
|
|
15
|
-
*
|
|
16
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
17
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
18
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
19
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
20
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
21
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
22
|
-
* SOFTWARE.
|
|
23
|
-
*/
|
|
24
|
-
|
|
25
1
|
import { logWarn as warn } from '@instructure/console';
|
|
26
2
|
import { addEventListener } from './addEventListener.js';
|
|
27
3
|
import { canUseDOM } from './canUseDOM.js';
|
|
28
4
|
export const MODES = {
|
|
29
|
-
|
|
30
|
-
|
|
5
|
+
keyboard: 'keyboard',
|
|
6
|
+
pointer: 'pointer'
|
|
31
7
|
};
|
|
32
8
|
class InputModeListenerImpl {
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
9
|
+
constructor(){
|
|
10
|
+
this._listeners = [];
|
|
11
|
+
this._initialized = false;
|
|
12
|
+
this._mode = MODES.keyboard;
|
|
13
|
+
this.onInitialPointerMove = (event)=>{
|
|
14
|
+
if (event?.target?.nodeName?.toLowerCase() === 'html') {
|
|
15
|
+
return;
|
|
16
|
+
}
|
|
17
|
+
this._mode = MODES.pointer;
|
|
18
|
+
this._listeners.forEach((listener)=>listener.remove());
|
|
19
|
+
};
|
|
20
|
+
this.onKeyDown = ()=>{
|
|
21
|
+
this._mode = MODES.keyboard;
|
|
22
|
+
};
|
|
23
|
+
this.onPointerDown = ()=>{
|
|
24
|
+
this._mode = MODES.pointer;
|
|
25
|
+
};
|
|
26
|
+
this.init = ()=>{
|
|
27
|
+
if (!canUseDOM || this._initialized) return;
|
|
28
|
+
addEventListener(document, 'keydown', this.onKeyDown, true);
|
|
29
|
+
addEventListener(document, 'mousedown', this.onPointerDown, true);
|
|
30
|
+
addEventListener(document, 'pointerdown', this.onPointerDown, true);
|
|
31
|
+
addEventListener(document, 'touchstart', this.onPointerDown, true);
|
|
32
|
+
this.addInitialPointerMoveListeners();
|
|
33
|
+
this._initialized = true;
|
|
34
|
+
};
|
|
35
|
+
warn(false, `[InputModeListener] is deprecated and will be removed in version 7.0.0. Use addInputModeListener instead.`);
|
|
36
|
+
this.init();
|
|
37
|
+
}
|
|
38
|
+
addInitialPointerMoveListeners() {
|
|
39
|
+
this._listeners.push(addEventListener(document, 'mousemove', this.onInitialPointerMove, true));
|
|
40
|
+
this._listeners.push(addEventListener(document, 'mousedown', this.onInitialPointerMove, true));
|
|
41
|
+
this._listeners.push(addEventListener(document, 'mouseup', this.onInitialPointerMove, true));
|
|
42
|
+
this._listeners.push(addEventListener(document, 'pointermove', this.onInitialPointerMove, true));
|
|
43
|
+
this._listeners.push(addEventListener(document, 'pointerdown', this.onInitialPointerMove, true));
|
|
44
|
+
this._listeners.push(addEventListener(document, 'pointerup', this.onInitialPointerMove, true));
|
|
45
|
+
this._listeners.push(addEventListener(document, 'touchmove', this.onInitialPointerMove, true));
|
|
46
|
+
this._listeners.push(addEventListener(document, 'touchstart', this.onInitialPointerMove, true));
|
|
47
|
+
this._listeners.push(addEventListener(document, 'touchend', this.onInitialPointerMove, true));
|
|
48
|
+
}
|
|
49
|
+
get mode() {
|
|
50
|
+
this.init();
|
|
51
|
+
return this._mode;
|
|
52
|
+
}
|
|
53
|
+
isKeyboardMode() {
|
|
54
|
+
this.init();
|
|
55
|
+
return this._mode === MODES.keyboard;
|
|
45
56
|
}
|
|
46
|
-
this._mode = MODES.pointer;
|
|
47
|
-
this._listeners.forEach(listener => listener.remove());
|
|
48
|
-
};
|
|
49
|
-
onKeyDown = () => {
|
|
50
|
-
this._mode = MODES.keyboard;
|
|
51
|
-
};
|
|
52
|
-
onPointerDown = () => {
|
|
53
|
-
this._mode = MODES.pointer;
|
|
54
|
-
};
|
|
55
|
-
addInitialPointerMoveListeners() {
|
|
56
|
-
this._listeners.push(addEventListener(document, 'mousemove', this.onInitialPointerMove, true));
|
|
57
|
-
this._listeners.push(addEventListener(document, 'mousedown', this.onInitialPointerMove, true));
|
|
58
|
-
this._listeners.push(addEventListener(document, 'mouseup', this.onInitialPointerMove, true));
|
|
59
|
-
this._listeners.push(addEventListener(document, 'pointermove', this.onInitialPointerMove, true));
|
|
60
|
-
this._listeners.push(addEventListener(document, 'pointerdown', this.onInitialPointerMove, true));
|
|
61
|
-
this._listeners.push(addEventListener(document, 'pointerup', this.onInitialPointerMove, true));
|
|
62
|
-
this._listeners.push(addEventListener(document, 'touchmove', this.onInitialPointerMove, true));
|
|
63
|
-
this._listeners.push(addEventListener(document, 'touchstart', this.onInitialPointerMove, true));
|
|
64
|
-
this._listeners.push(addEventListener(document, 'touchend', this.onInitialPointerMove, true));
|
|
65
|
-
}
|
|
66
|
-
init = () => {
|
|
67
|
-
if (!canUseDOM || this._initialized) return;
|
|
68
|
-
addEventListener(document, 'keydown', this.onKeyDown, true);
|
|
69
|
-
addEventListener(document, 'mousedown', this.onPointerDown, true);
|
|
70
|
-
addEventListener(document, 'pointerdown', this.onPointerDown, true);
|
|
71
|
-
addEventListener(document, 'touchstart', this.onPointerDown, true);
|
|
72
|
-
this.addInitialPointerMoveListeners();
|
|
73
|
-
this._initialized = true;
|
|
74
|
-
};
|
|
75
|
-
get mode() {
|
|
76
|
-
this.init();
|
|
77
|
-
return this._mode;
|
|
78
|
-
}
|
|
79
|
-
isKeyboardMode() {
|
|
80
|
-
this.init();
|
|
81
|
-
return this._mode === MODES.keyboard;
|
|
82
|
-
}
|
|
83
57
|
}
|
|
84
58
|
const InputModeListener = new InputModeListenerImpl();
|
|
85
59
|
export default InputModeListener;
|
|
86
|
-
export { InputModeListener };
|
|
60
|
+
export { InputModeListener };
|
package/es/addEventListener.js
CHANGED
|
@@ -1,48 +1,12 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* The MIT License (MIT)
|
|
3
|
-
*
|
|
4
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
5
|
-
*
|
|
6
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
7
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
8
|
-
* in the Software without restriction, including without limitation the rights
|
|
9
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
10
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
11
|
-
* furnished to do so, subject to the following conditions:
|
|
12
|
-
*
|
|
13
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
14
|
-
* copies or substantial portions of the Software.
|
|
15
|
-
*
|
|
16
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
17
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
18
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
19
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
20
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
21
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
22
|
-
* SOFTWARE.
|
|
23
|
-
*/
|
|
24
|
-
|
|
25
1
|
import { findDOMNode } from './findDOMNode.js';
|
|
26
|
-
/**
|
|
27
|
-
* ---
|
|
28
|
-
* category: utilities/DOM
|
|
29
|
-
* ---
|
|
30
|
-
* Wrapper function for DOM addEventListener
|
|
31
|
-
* @module addEventListener
|
|
32
|
-
* @param { Node | Window } el - DOM node which will have the event listener attached
|
|
33
|
-
* @param { string } event - a string specifying the event name ('click', 'focus', etc)
|
|
34
|
-
* @param { React.EventHandler<React.SyntheticEvent<any, any>> } handler - function to run when event occurs
|
|
35
|
-
* @param { boolean } capture - should the event be executed in the capturing or bubbling phase
|
|
36
|
-
* @returns {{ remove(): void }} a method to remove the event listener
|
|
37
|
-
*/
|
|
38
2
|
function addEventListener(el, event, handler, capture) {
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
3
|
+
const node = el === window || el === document ? el : findDOMNode(el);
|
|
4
|
+
node?.addEventListener(event, handler, capture);
|
|
5
|
+
return {
|
|
6
|
+
remove () {
|
|
7
|
+
node?.removeEventListener(event, handler, capture);
|
|
8
|
+
}
|
|
9
|
+
};
|
|
46
10
|
}
|
|
47
11
|
export default addEventListener;
|
|
48
|
-
export { addEventListener };
|
|
12
|
+
export { addEventListener };
|
|
@@ -1,109 +1,81 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* The MIT License (MIT)
|
|
3
|
-
*
|
|
4
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
5
|
-
*
|
|
6
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
7
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
8
|
-
* in the Software without restriction, including without limitation the rights
|
|
9
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
10
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
11
|
-
* furnished to do so, subject to the following conditions:
|
|
12
|
-
*
|
|
13
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
14
|
-
* copies or substantial portions of the Software.
|
|
15
|
-
*
|
|
16
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
17
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
18
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
19
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
20
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
21
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
22
|
-
* SOFTWARE.
|
|
23
|
-
*/
|
|
24
|
-
|
|
25
1
|
import { addEventListener } from './addEventListener.js';
|
|
26
2
|
import { canUseDOM } from './canUseDOM.js';
|
|
27
3
|
const MODES = {
|
|
28
|
-
|
|
29
|
-
|
|
4
|
+
keyboard: 'keyboard',
|
|
5
|
+
pointer: 'pointer'
|
|
30
6
|
};
|
|
31
7
|
let _moveListeners = [];
|
|
32
8
|
let _downListeners = [];
|
|
33
9
|
let _mode = MODES.keyboard;
|
|
34
10
|
let _registeredCount = 0;
|
|
35
11
|
const _modeChangeHandlers = {};
|
|
36
|
-
const handleInitialPointerMove = event
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
handleInputModeChange(_mode, MODES.pointer);
|
|
43
|
-
_moveListeners.forEach(listener => listener.remove());
|
|
12
|
+
const handleInitialPointerMove = (event)=>{
|
|
13
|
+
if (event.target.nodeName.toLowerCase() === 'html') {
|
|
14
|
+
return;
|
|
15
|
+
}
|
|
16
|
+
handleInputModeChange(_mode, MODES.pointer);
|
|
17
|
+
_moveListeners.forEach((listener)=>listener.remove());
|
|
44
18
|
};
|
|
45
|
-
const handleInputModeChange = (currentMode, newMode)
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
19
|
+
const handleInputModeChange = (currentMode, newMode)=>{
|
|
20
|
+
if (currentMode === newMode) return;
|
|
21
|
+
_mode = newMode;
|
|
22
|
+
Object.keys(_modeChangeHandlers).forEach((handlerId)=>_modeChangeHandlers[handlerId](currentMode, newMode));
|
|
49
23
|
};
|
|
50
|
-
const handleKeyDown = ()
|
|
51
|
-
|
|
24
|
+
const handleKeyDown = ()=>{
|
|
25
|
+
handleInputModeChange(_mode, MODES.keyboard);
|
|
52
26
|
};
|
|
53
|
-
const handlePointerDown = ()
|
|
54
|
-
|
|
27
|
+
const handlePointerDown = ()=>{
|
|
28
|
+
handleInputModeChange(_mode, MODES.pointer);
|
|
55
29
|
};
|
|
56
|
-
const addMoveListeners = ()
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
30
|
+
const addMoveListeners = ()=>{
|
|
31
|
+
if (_moveListeners.length === 0) {
|
|
32
|
+
_moveListeners.push(addEventListener(document, 'mousemove', handleInitialPointerMove, true));
|
|
33
|
+
_moveListeners.push(addEventListener(document, 'mousedown', handleInitialPointerMove, true));
|
|
34
|
+
_moveListeners.push(addEventListener(document, 'mouseup', handleInitialPointerMove, true));
|
|
35
|
+
_moveListeners.push(addEventListener(document, 'pointermove', handleInitialPointerMove, true));
|
|
36
|
+
_moveListeners.push(addEventListener(document, 'pointerdown', handleInitialPointerMove, true));
|
|
37
|
+
_moveListeners.push(addEventListener(document, 'pointerup', handleInitialPointerMove, true));
|
|
38
|
+
_moveListeners.push(addEventListener(document, 'touchmove', handleInitialPointerMove, true));
|
|
39
|
+
_moveListeners.push(addEventListener(document, 'touchstart', handleInitialPointerMove, true));
|
|
40
|
+
_moveListeners.push(addEventListener(document, 'touchend', handleInitialPointerMove, true));
|
|
41
|
+
}
|
|
68
42
|
};
|
|
69
|
-
const addDownListeners = ()
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
43
|
+
const addDownListeners = ()=>{
|
|
44
|
+
if (_downListeners.length === 0) {
|
|
45
|
+
_downListeners.push(addEventListener(document, 'keydown', handleKeyDown, true));
|
|
46
|
+
_downListeners.push(addEventListener(document, 'mousedown', handlePointerDown, true));
|
|
47
|
+
_downListeners.push(addEventListener(document, 'pointerdown', handlePointerDown, true));
|
|
48
|
+
_downListeners.push(addEventListener(document, 'touchstart', handlePointerDown, true));
|
|
49
|
+
}
|
|
76
50
|
};
|
|
77
|
-
const removeListeners = ()
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
51
|
+
const removeListeners = ()=>{
|
|
52
|
+
_moveListeners.forEach((listener)=>listener.remove());
|
|
53
|
+
_moveListeners = [];
|
|
54
|
+
_downListeners.forEach((listener)=>listener.remove());
|
|
55
|
+
_downListeners = [];
|
|
82
56
|
};
|
|
83
|
-
const addInputModeListener = handlerObject
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
addDownListeners();
|
|
93
|
-
addMoveListeners();
|
|
94
|
-
}
|
|
95
|
-
return {
|
|
96
|
-
isKeyboardMode: () => {
|
|
97
|
-
return _mode === MODES.keyboard;
|
|
98
|
-
},
|
|
99
|
-
remove: () => {
|
|
100
|
-
if (_registeredCount === 1) {
|
|
101
|
-
removeListeners();
|
|
102
|
-
}
|
|
103
|
-
delete _modeChangeHandlers[id];
|
|
104
|
-
_registeredCount--;
|
|
57
|
+
const addInputModeListener = (handlerObject)=>{
|
|
58
|
+
const { onInputModeChange } = handlerObject;
|
|
59
|
+
const id = _registeredCount++;
|
|
60
|
+
if (typeof onInputModeChange === 'function') {
|
|
61
|
+
_modeChangeHandlers[id] = onInputModeChange;
|
|
62
|
+
}
|
|
63
|
+
if (canUseDOM) {
|
|
64
|
+
addDownListeners();
|
|
65
|
+
addMoveListeners();
|
|
105
66
|
}
|
|
106
|
-
|
|
67
|
+
return {
|
|
68
|
+
isKeyboardMode: ()=>{
|
|
69
|
+
return _mode === MODES.keyboard;
|
|
70
|
+
},
|
|
71
|
+
remove: ()=>{
|
|
72
|
+
if (_registeredCount === 1) {
|
|
73
|
+
removeListeners();
|
|
74
|
+
}
|
|
75
|
+
delete _modeChangeHandlers[id];
|
|
76
|
+
_registeredCount--;
|
|
77
|
+
}
|
|
78
|
+
};
|
|
107
79
|
};
|
|
108
80
|
export default addInputModeListener;
|
|
109
|
-
export { addInputModeListener, MODES };
|
|
81
|
+
export { addInputModeListener, MODES };
|
|
@@ -1,64 +1,29 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* The MIT License (MIT)
|
|
3
|
-
*
|
|
4
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
5
|
-
*
|
|
6
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
7
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
8
|
-
* in the Software without restriction, including without limitation the rights
|
|
9
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
10
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
11
|
-
* furnished to do so, subject to the following conditions:
|
|
12
|
-
*
|
|
13
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
14
|
-
* copies or substantial portions of the Software.
|
|
15
|
-
*
|
|
16
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
17
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
18
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
19
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
20
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
21
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
22
|
-
* SOFTWARE.
|
|
23
|
-
*/
|
|
24
|
-
|
|
25
1
|
import { findDOMNode } from './findDOMNode.js';
|
|
26
2
|
import { getBoundingClientRect } from './getBoundingClientRect.js';
|
|
27
3
|
import { requestAnimationFrame } from './requestAnimationFrame.js';
|
|
28
|
-
/**
|
|
29
|
-
* ---
|
|
30
|
-
* category: utilities/DOM
|
|
31
|
-
* ---
|
|
32
|
-
* Adds a listener to an element and calls a specified handler
|
|
33
|
-
* function whenever the position changes
|
|
34
|
-
* @module
|
|
35
|
-
* @param { Node | Window | React.ReactElement | React.Component | function } el - component or DOM node
|
|
36
|
-
* @param {function} handler - function to run if the position has changed
|
|
37
|
-
* @returns {function} remove - cancel the listener and no longer execute the handler function
|
|
38
|
-
*/
|
|
39
4
|
function addPositionChangeListener(el, handler) {
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
5
|
+
const node = findDOMNode(el);
|
|
6
|
+
const raf = [];
|
|
7
|
+
let coords = getBoundingClientRect(node) || {};
|
|
8
|
+
let cancelled = false;
|
|
9
|
+
function checkPosition() {
|
|
10
|
+
if (!cancelled) {
|
|
11
|
+
const newCoords = getBoundingClientRect(node) || {};
|
|
12
|
+
const positionChanged = newCoords.top !== coords.top || newCoords.left !== coords.left || newCoords.right !== coords.right || newCoords.bottom !== coords.bottom || newCoords.width !== coords.width || newCoords.height !== coords.height;
|
|
13
|
+
if (positionChanged && typeof handler === 'function') {
|
|
14
|
+
handler(newCoords);
|
|
15
|
+
}
|
|
16
|
+
coords = newCoords;
|
|
17
|
+
raf.push(requestAnimationFrame(checkPosition));
|
|
18
|
+
}
|
|
53
19
|
}
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
}
|
|
61
|
-
};
|
|
20
|
+
checkPosition();
|
|
21
|
+
return {
|
|
22
|
+
remove () {
|
|
23
|
+
cancelled = true;
|
|
24
|
+
raf.forEach((req)=>req.cancel());
|
|
25
|
+
}
|
|
26
|
+
};
|
|
62
27
|
}
|
|
63
28
|
export default addPositionChangeListener;
|
|
64
|
-
export { addPositionChangeListener };
|
|
29
|
+
export { addPositionChangeListener };
|
package/es/canUseDOM.js
CHANGED
|
@@ -1,36 +1,3 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* The MIT License (MIT)
|
|
3
|
-
*
|
|
4
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
5
|
-
*
|
|
6
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
7
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
8
|
-
* in the Software without restriction, including without limitation the rights
|
|
9
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
10
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
11
|
-
* furnished to do so, subject to the following conditions:
|
|
12
|
-
*
|
|
13
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
14
|
-
* copies or substantial portions of the Software.
|
|
15
|
-
*
|
|
16
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
17
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
18
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
19
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
20
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
21
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
22
|
-
* SOFTWARE.
|
|
23
|
-
*/
|
|
24
|
-
|
|
25
|
-
/**
|
|
26
|
-
* ---
|
|
27
|
-
* category: utilities/DOM
|
|
28
|
-
* ---
|
|
29
|
-
*
|
|
30
|
-
* Performs simple test to determine if DOM can be accessed
|
|
31
|
-
* @module
|
|
32
|
-
* @returns {boolean} whether the dom can be used
|
|
33
|
-
*/
|
|
34
1
|
const canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement);
|
|
35
2
|
export default canUseDOM;
|
|
36
|
-
export { canUseDOM };
|
|
3
|
+
export { canUseDOM };
|
package/es/contains.js
CHANGED
|
@@ -1,64 +1,26 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* The MIT License (MIT)
|
|
3
|
-
*
|
|
4
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
5
|
-
*
|
|
6
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
7
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
8
|
-
* in the Software without restriction, including without limitation the rights
|
|
9
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
10
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
11
|
-
* furnished to do so, subject to the following conditions:
|
|
12
|
-
*
|
|
13
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
14
|
-
* copies or substantial portions of the Software.
|
|
15
|
-
*
|
|
16
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
17
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
18
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
19
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
20
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
21
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
22
|
-
* SOFTWARE.
|
|
23
|
-
*/
|
|
24
|
-
|
|
25
1
|
import { findDOMNode } from './findDOMNode.js';
|
|
26
2
|
import { canUseDOM } from './canUseDOM.js';
|
|
27
3
|
function containsWithDOM(context, el) {
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
4
|
+
const container = context && findDOMNode(context);
|
|
5
|
+
const node = el && findDOMNode(el);
|
|
6
|
+
if (!container || !node) {
|
|
7
|
+
return false;
|
|
8
|
+
} else if (!(container instanceof Window) && !(node instanceof Window)) {
|
|
9
|
+
return container.contains(node);
|
|
10
|
+
} else {
|
|
11
|
+
return containsFallback(container, node);
|
|
12
|
+
}
|
|
37
13
|
}
|
|
38
|
-
|
|
39
|
-
/* istanbul ignore next */
|
|
40
14
|
function containsFallback(context, el) {
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
15
|
+
let node = el;
|
|
16
|
+
while(node){
|
|
17
|
+
if (node === context) {
|
|
18
|
+
return true;
|
|
19
|
+
}
|
|
20
|
+
node = node.parentNode;
|
|
45
21
|
}
|
|
46
|
-
|
|
47
|
-
}
|
|
48
|
-
return false;
|
|
22
|
+
return false;
|
|
49
23
|
}
|
|
50
|
-
|
|
51
|
-
/**
|
|
52
|
-
* ---
|
|
53
|
-
* category: utilities/DOM
|
|
54
|
-
* ---
|
|
55
|
-
*
|
|
56
|
-
* Determine if an element contains another DOM node
|
|
57
|
-
* @module containsWithDOM
|
|
58
|
-
* @param { Node | Window | React.ReactElement | function | null } context - component or DOM node
|
|
59
|
-
* @param { Node | Window | React.ReactElement | function | null } el - component or DOM node which we want to determine if contained within the context
|
|
60
|
-
* @returns { boolean } if the element is contained within the context
|
|
61
|
-
*/
|
|
62
24
|
const contains = canUseDOM ? containsWithDOM : containsFallback;
|
|
63
25
|
export default contains;
|
|
64
|
-
export { contains };
|
|
26
|
+
export { contains };
|
|
@@ -1,44 +1,10 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* The MIT License (MIT)
|
|
3
|
-
*
|
|
4
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
5
|
-
*
|
|
6
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
7
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
8
|
-
* in the Software without restriction, including without limitation the rights
|
|
9
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
10
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
11
|
-
* furnished to do so, subject to the following conditions:
|
|
12
|
-
*
|
|
13
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
14
|
-
* copies or substantial portions of the Software.
|
|
15
|
-
*
|
|
16
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
17
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
18
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
19
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
20
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
21
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
22
|
-
* SOFTWARE.
|
|
23
|
-
*/
|
|
24
|
-
|
|
25
1
|
import { findDOMNode } from './findDOMNode.js';
|
|
26
2
|
import { contains } from './contains.js';
|
|
27
3
|
import { getActiveElement } from './getActiveElement.js';
|
|
28
|
-
/**
|
|
29
|
-
* ---
|
|
30
|
-
* category: utilities/DOM
|
|
31
|
-
* ---
|
|
32
|
-
*
|
|
33
|
-
* Determine if an element contains the active element
|
|
34
|
-
* @module containsActiveElement
|
|
35
|
-
* @param { Node | Window | React.ReactElement | React.Component | function | null } el - component or DOM node
|
|
36
|
-
* @returns {boolean} if the element contains the active element
|
|
37
|
-
*/
|
|
38
4
|
function containsActiveElement(el) {
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
5
|
+
const node = el && findDOMNode(el);
|
|
6
|
+
const active = getActiveElement();
|
|
7
|
+
return !!node && (active === node || contains(node, active));
|
|
42
8
|
}
|
|
43
9
|
export default containsActiveElement;
|
|
44
|
-
export { containsActiveElement };
|
|
10
|
+
export { containsActiveElement };
|