@react-aria/focus 3.10.1 → 3.11.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/import.mjs +861 -0
- package/dist/main.js +73 -37
- package/dist/main.js.map +1 -1
- package/dist/module.js +73 -37
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +10 -5
- package/src/FocusScope.tsx +74 -28
package/dist/import.mjs
ADDED
|
@@ -0,0 +1,861 @@
|
|
|
1
|
+
import $6nfFC$swchelperssrc_define_propertymjs from "@swc/helpers/src/_define_property.mjs";
|
|
2
|
+
import $6nfFC$react, {useRef as $6nfFC$useRef, useContext as $6nfFC$useContext, useMemo as $6nfFC$useMemo, useEffect as $6nfFC$useEffect, useState as $6nfFC$useState, useCallback as $6nfFC$useCallback} from "react";
|
|
3
|
+
import {useLayoutEffect as $6nfFC$useLayoutEffect, runAfterTransition as $6nfFC$runAfterTransition, focusWithoutScrolling as $6nfFC$focusWithoutScrolling, mergeProps as $6nfFC$mergeProps, useSyncRef as $6nfFC$useSyncRef} from "@react-aria/utils";
|
|
4
|
+
import {getInteractionModality as $6nfFC$getInteractionModality, isFocusVisible as $6nfFC$isFocusVisible, useFocusVisibleListener as $6nfFC$useFocusVisibleListener, useFocus as $6nfFC$useFocus, useFocusWithin as $6nfFC$useFocusWithin, useKeyboard as $6nfFC$useKeyboard} from "@react-aria/interactions";
|
|
5
|
+
import $6nfFC$clsx from "clsx";
|
|
6
|
+
|
|
7
|
+
/*
|
|
8
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
9
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
10
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
11
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
12
|
+
*
|
|
13
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
14
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
15
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
16
|
+
* governing permissions and limitations under the License.
|
|
17
|
+
*/ /*
|
|
18
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
19
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
20
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
21
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
22
|
+
*
|
|
23
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
24
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
25
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
26
|
+
* governing permissions and limitations under the License.
|
|
27
|
+
*/
|
|
28
|
+
/*
|
|
29
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
30
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the 'License');
|
|
31
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
32
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
33
|
+
*
|
|
34
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
35
|
+
* the License is distributed on an 'AS IS' BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
36
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
37
|
+
* governing permissions and limitations under the License.
|
|
38
|
+
*/
|
|
39
|
+
|
|
40
|
+
function $6a99195332edec8b$export$80f3e147d781571c(element) {
|
|
41
|
+
// If the user is interacting with a virtual cursor, e.g. screen reader, then
|
|
42
|
+
// wait until after any animated transitions that are currently occurring on
|
|
43
|
+
// the page before shifting focus. This avoids issues with VoiceOver on iOS
|
|
44
|
+
// causing the page to scroll when moving focus if the element is transitioning
|
|
45
|
+
// from off the screen.
|
|
46
|
+
if ((0, $6nfFC$getInteractionModality)() === "virtual") {
|
|
47
|
+
let lastFocusedElement = document.activeElement;
|
|
48
|
+
(0, $6nfFC$runAfterTransition)(()=>{
|
|
49
|
+
// If focus did not move and the element is still in the document, focus it.
|
|
50
|
+
if (document.activeElement === lastFocusedElement && document.contains(element)) (0, $6nfFC$focusWithoutScrolling)(element);
|
|
51
|
+
});
|
|
52
|
+
} else (0, $6nfFC$focusWithoutScrolling)(element);
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
|
|
56
|
+
/*
|
|
57
|
+
* Copyright 2021 Adobe. All rights reserved.
|
|
58
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
59
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
60
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
61
|
+
*
|
|
62
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
63
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
64
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
65
|
+
* governing permissions and limitations under the License.
|
|
66
|
+
*/ function $645f2e67b85a24c9$var$isStyleVisible(element) {
|
|
67
|
+
if (!(element instanceof HTMLElement) && !(element instanceof SVGElement)) return false;
|
|
68
|
+
let { display: display , visibility: visibility } = element.style;
|
|
69
|
+
let isVisible = display !== "none" && visibility !== "hidden" && visibility !== "collapse";
|
|
70
|
+
if (isVisible) {
|
|
71
|
+
const { getComputedStyle: getComputedStyle } = element.ownerDocument.defaultView;
|
|
72
|
+
let { display: computedDisplay , visibility: computedVisibility } = getComputedStyle(element);
|
|
73
|
+
isVisible = computedDisplay !== "none" && computedVisibility !== "hidden" && computedVisibility !== "collapse";
|
|
74
|
+
}
|
|
75
|
+
return isVisible;
|
|
76
|
+
}
|
|
77
|
+
function $645f2e67b85a24c9$var$isAttributeVisible(element, childElement) {
|
|
78
|
+
return !element.hasAttribute("hidden") && (element.nodeName === "DETAILS" && childElement && childElement.nodeName !== "SUMMARY" ? element.hasAttribute("open") : true);
|
|
79
|
+
}
|
|
80
|
+
function $645f2e67b85a24c9$export$e989c0fffaa6b27a(element, childElement) {
|
|
81
|
+
return element.nodeName !== "#comment" && $645f2e67b85a24c9$var$isStyleVisible(element) && $645f2e67b85a24c9$var$isAttributeVisible(element, childElement) && (!element.parentElement || $645f2e67b85a24c9$export$e989c0fffaa6b27a(element.parentElement, element));
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
|
|
85
|
+
|
|
86
|
+
|
|
87
|
+
const $9bf71ea28793e738$var$FocusContext = /*#__PURE__*/ (0, $6nfFC$react).createContext(null);
|
|
88
|
+
let $9bf71ea28793e738$var$activeScope = null;
|
|
89
|
+
function $9bf71ea28793e738$export$20e40289641fbbb6(props) {
|
|
90
|
+
let { children: children , contain: contain , restoreFocus: restoreFocus , autoFocus: autoFocus } = props;
|
|
91
|
+
let startRef = (0, $6nfFC$useRef)();
|
|
92
|
+
let endRef = (0, $6nfFC$useRef)();
|
|
93
|
+
let scopeRef = (0, $6nfFC$useRef)([]);
|
|
94
|
+
let { parentNode: parentNode } = (0, $6nfFC$useContext)($9bf71ea28793e738$var$FocusContext) || {};
|
|
95
|
+
// Create a tree node here so we can add children to it even before it is added to the tree.
|
|
96
|
+
let node = (0, $6nfFC$useMemo)(()=>new $9bf71ea28793e738$var$TreeNode({
|
|
97
|
+
scopeRef: scopeRef
|
|
98
|
+
}), [
|
|
99
|
+
scopeRef
|
|
100
|
+
]);
|
|
101
|
+
(0, $6nfFC$useLayoutEffect)(()=>{
|
|
102
|
+
// If a new scope mounts outside the active scope, (e.g. DialogContainer launched from a menu),
|
|
103
|
+
// use the active scope as the parent instead of the parent from context. Layout effects run bottom
|
|
104
|
+
// up, so if the parent is not yet added to the tree, don't do this. Only the outer-most FocusScope
|
|
105
|
+
// that is being added should get the activeScope as its parent.
|
|
106
|
+
let parent = parentNode || $9bf71ea28793e738$export$d06fae2ee68b101e.root;
|
|
107
|
+
if ($9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode(parent.scopeRef) && $9bf71ea28793e738$var$activeScope && !$9bf71ea28793e738$var$isAncestorScope($9bf71ea28793e738$var$activeScope, parent.scopeRef)) {
|
|
108
|
+
let activeNode = $9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode($9bf71ea28793e738$var$activeScope);
|
|
109
|
+
if (activeNode) parent = activeNode;
|
|
110
|
+
}
|
|
111
|
+
// Add the node to the parent, and to the tree.
|
|
112
|
+
parent.addChild(node);
|
|
113
|
+
$9bf71ea28793e738$export$d06fae2ee68b101e.addNode(node);
|
|
114
|
+
}, [
|
|
115
|
+
node,
|
|
116
|
+
parentNode
|
|
117
|
+
]);
|
|
118
|
+
(0, $6nfFC$useLayoutEffect)(()=>{
|
|
119
|
+
let node = $9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode(scopeRef);
|
|
120
|
+
node.contain = contain;
|
|
121
|
+
}, [
|
|
122
|
+
contain
|
|
123
|
+
]);
|
|
124
|
+
(0, $6nfFC$useLayoutEffect)(()=>{
|
|
125
|
+
// Find all rendered nodes between the sentinels and add them to the scope.
|
|
126
|
+
let node = startRef.current.nextSibling;
|
|
127
|
+
let nodes = [];
|
|
128
|
+
while(node && node !== endRef.current){
|
|
129
|
+
nodes.push(node);
|
|
130
|
+
node = node.nextSibling;
|
|
131
|
+
}
|
|
132
|
+
scopeRef.current = nodes;
|
|
133
|
+
}, [
|
|
134
|
+
children
|
|
135
|
+
]);
|
|
136
|
+
$9bf71ea28793e738$var$useActiveScopeTracker(scopeRef, restoreFocus, contain);
|
|
137
|
+
$9bf71ea28793e738$var$useFocusContainment(scopeRef, contain);
|
|
138
|
+
$9bf71ea28793e738$var$useRestoreFocus(scopeRef, restoreFocus, contain);
|
|
139
|
+
$9bf71ea28793e738$var$useAutoFocus(scopeRef, autoFocus);
|
|
140
|
+
// this layout effect needs to run last so that focusScopeTree cleanup happens at the last moment possible
|
|
141
|
+
(0, $6nfFC$useEffect)(()=>{
|
|
142
|
+
if (scopeRef) {
|
|
143
|
+
let activeElement = document.activeElement;
|
|
144
|
+
let scope = null;
|
|
145
|
+
// In strict mode, active scope is incorrectly updated since cleanup will run even though scope hasn't unmounted.
|
|
146
|
+
// To fix this, we need to update the actual activeScope here
|
|
147
|
+
if ($9bf71ea28793e738$var$isElementInScope(activeElement, scopeRef.current)) {
|
|
148
|
+
// Since useLayoutEffect runs for children first, we need to traverse the focusScope tree and find the bottom most scope that
|
|
149
|
+
// contains the active element and set that as the activeScope
|
|
150
|
+
for (let node of $9bf71ea28793e738$export$d06fae2ee68b101e.traverse())if ($9bf71ea28793e738$var$isElementInScope(activeElement, node.scopeRef.current)) scope = node;
|
|
151
|
+
if (scope === $9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode(scopeRef)) $9bf71ea28793e738$var$activeScope = scope.scopeRef;
|
|
152
|
+
}
|
|
153
|
+
return ()=>{
|
|
154
|
+
// Scope may have been re-parented.
|
|
155
|
+
let parentScope = $9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode(scopeRef).parent.scopeRef;
|
|
156
|
+
// Restore the active scope on unmount if this scope or a descendant scope is active.
|
|
157
|
+
// Parent effect cleanups run before children, so we need to check if the
|
|
158
|
+
// parent scope actually still exists before restoring the active scope to it.
|
|
159
|
+
if ((scopeRef === $9bf71ea28793e738$var$activeScope || $9bf71ea28793e738$var$isAncestorScope(scopeRef, $9bf71ea28793e738$var$activeScope)) && (!parentScope || $9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode(parentScope))) $9bf71ea28793e738$var$activeScope = parentScope;
|
|
160
|
+
$9bf71ea28793e738$export$d06fae2ee68b101e.removeTreeNode(scopeRef);
|
|
161
|
+
};
|
|
162
|
+
}
|
|
163
|
+
}, [
|
|
164
|
+
scopeRef
|
|
165
|
+
]);
|
|
166
|
+
let focusManager = (0, $6nfFC$useMemo)(()=>$9bf71ea28793e738$var$createFocusManagerForScope(scopeRef), []);
|
|
167
|
+
let value = (0, $6nfFC$useMemo)(()=>({
|
|
168
|
+
focusManager: focusManager,
|
|
169
|
+
parentNode: node
|
|
170
|
+
}), [
|
|
171
|
+
node,
|
|
172
|
+
focusManager
|
|
173
|
+
]);
|
|
174
|
+
return /*#__PURE__*/ (0, $6nfFC$react).createElement($9bf71ea28793e738$var$FocusContext.Provider, {
|
|
175
|
+
value: value
|
|
176
|
+
}, /*#__PURE__*/ (0, $6nfFC$react).createElement("span", {
|
|
177
|
+
"data-focus-scope-start": true,
|
|
178
|
+
hidden: true,
|
|
179
|
+
ref: startRef
|
|
180
|
+
}), children, /*#__PURE__*/ (0, $6nfFC$react).createElement("span", {
|
|
181
|
+
"data-focus-scope-end": true,
|
|
182
|
+
hidden: true,
|
|
183
|
+
ref: endRef
|
|
184
|
+
}));
|
|
185
|
+
}
|
|
186
|
+
function $9bf71ea28793e738$export$10c5169755ce7bd7() {
|
|
187
|
+
var _useContext;
|
|
188
|
+
return (_useContext = (0, $6nfFC$useContext)($9bf71ea28793e738$var$FocusContext)) === null || _useContext === void 0 ? void 0 : _useContext.focusManager;
|
|
189
|
+
}
|
|
190
|
+
function $9bf71ea28793e738$var$createFocusManagerForScope(scopeRef) {
|
|
191
|
+
return {
|
|
192
|
+
focusNext (opts = {}) {
|
|
193
|
+
let scope = scopeRef.current;
|
|
194
|
+
let { from: from , tabbable: tabbable , wrap: wrap , accept: accept } = opts;
|
|
195
|
+
let node = from || document.activeElement;
|
|
196
|
+
let sentinel = scope[0].previousElementSibling;
|
|
197
|
+
let walker = $9bf71ea28793e738$export$2d6ec8fc375ceafa($9bf71ea28793e738$var$getScopeRoot(scope), {
|
|
198
|
+
tabbable: tabbable,
|
|
199
|
+
accept: accept
|
|
200
|
+
}, scope);
|
|
201
|
+
walker.currentNode = $9bf71ea28793e738$var$isElementInScope(node, scope) ? node : sentinel;
|
|
202
|
+
let nextNode = walker.nextNode();
|
|
203
|
+
if (!nextNode && wrap) {
|
|
204
|
+
walker.currentNode = sentinel;
|
|
205
|
+
nextNode = walker.nextNode();
|
|
206
|
+
}
|
|
207
|
+
if (nextNode) $9bf71ea28793e738$var$focusElement(nextNode, true);
|
|
208
|
+
return nextNode;
|
|
209
|
+
},
|
|
210
|
+
focusPrevious (opts = {}) {
|
|
211
|
+
let scope = scopeRef.current;
|
|
212
|
+
let { from: from , tabbable: tabbable , wrap: wrap , accept: accept } = opts;
|
|
213
|
+
let node = from || document.activeElement;
|
|
214
|
+
let sentinel = scope[scope.length - 1].nextElementSibling;
|
|
215
|
+
let walker = $9bf71ea28793e738$export$2d6ec8fc375ceafa($9bf71ea28793e738$var$getScopeRoot(scope), {
|
|
216
|
+
tabbable: tabbable,
|
|
217
|
+
accept: accept
|
|
218
|
+
}, scope);
|
|
219
|
+
walker.currentNode = $9bf71ea28793e738$var$isElementInScope(node, scope) ? node : sentinel;
|
|
220
|
+
let previousNode = walker.previousNode();
|
|
221
|
+
if (!previousNode && wrap) {
|
|
222
|
+
walker.currentNode = sentinel;
|
|
223
|
+
previousNode = walker.previousNode();
|
|
224
|
+
}
|
|
225
|
+
if (previousNode) $9bf71ea28793e738$var$focusElement(previousNode, true);
|
|
226
|
+
return previousNode;
|
|
227
|
+
},
|
|
228
|
+
focusFirst (opts = {}) {
|
|
229
|
+
let scope = scopeRef.current;
|
|
230
|
+
let { tabbable: tabbable , accept: accept } = opts;
|
|
231
|
+
let walker = $9bf71ea28793e738$export$2d6ec8fc375ceafa($9bf71ea28793e738$var$getScopeRoot(scope), {
|
|
232
|
+
tabbable: tabbable,
|
|
233
|
+
accept: accept
|
|
234
|
+
}, scope);
|
|
235
|
+
walker.currentNode = scope[0].previousElementSibling;
|
|
236
|
+
let nextNode = walker.nextNode();
|
|
237
|
+
if (nextNode) $9bf71ea28793e738$var$focusElement(nextNode, true);
|
|
238
|
+
return nextNode;
|
|
239
|
+
},
|
|
240
|
+
focusLast (opts = {}) {
|
|
241
|
+
let scope = scopeRef.current;
|
|
242
|
+
let { tabbable: tabbable , accept: accept } = opts;
|
|
243
|
+
let walker = $9bf71ea28793e738$export$2d6ec8fc375ceafa($9bf71ea28793e738$var$getScopeRoot(scope), {
|
|
244
|
+
tabbable: tabbable,
|
|
245
|
+
accept: accept
|
|
246
|
+
}, scope);
|
|
247
|
+
walker.currentNode = scope[scope.length - 1].nextElementSibling;
|
|
248
|
+
let previousNode = walker.previousNode();
|
|
249
|
+
if (previousNode) $9bf71ea28793e738$var$focusElement(previousNode, true);
|
|
250
|
+
return previousNode;
|
|
251
|
+
}
|
|
252
|
+
};
|
|
253
|
+
}
|
|
254
|
+
const $9bf71ea28793e738$var$focusableElements = [
|
|
255
|
+
"input:not([disabled]):not([type=hidden])",
|
|
256
|
+
"select:not([disabled])",
|
|
257
|
+
"textarea:not([disabled])",
|
|
258
|
+
"button:not([disabled])",
|
|
259
|
+
"a[href]",
|
|
260
|
+
"area[href]",
|
|
261
|
+
"summary",
|
|
262
|
+
"iframe",
|
|
263
|
+
"object",
|
|
264
|
+
"embed",
|
|
265
|
+
"audio[controls]",
|
|
266
|
+
"video[controls]",
|
|
267
|
+
"[contenteditable]"
|
|
268
|
+
];
|
|
269
|
+
const $9bf71ea28793e738$var$FOCUSABLE_ELEMENT_SELECTOR = $9bf71ea28793e738$var$focusableElements.join(":not([hidden]),") + ",[tabindex]:not([disabled]):not([hidden])";
|
|
270
|
+
$9bf71ea28793e738$var$focusableElements.push('[tabindex]:not([tabindex="-1"]):not([disabled])');
|
|
271
|
+
const $9bf71ea28793e738$var$TABBABLE_ELEMENT_SELECTOR = $9bf71ea28793e738$var$focusableElements.join(':not([hidden]):not([tabindex="-1"]),');
|
|
272
|
+
function $9bf71ea28793e738$var$getScopeRoot(scope) {
|
|
273
|
+
return scope[0].parentElement;
|
|
274
|
+
}
|
|
275
|
+
function $9bf71ea28793e738$var$shouldContainFocus(scopeRef) {
|
|
276
|
+
let scope = $9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode($9bf71ea28793e738$var$activeScope);
|
|
277
|
+
while(scope && scope.scopeRef !== scopeRef){
|
|
278
|
+
if (scope.contain) return false;
|
|
279
|
+
scope = scope.parent;
|
|
280
|
+
}
|
|
281
|
+
return true;
|
|
282
|
+
}
|
|
283
|
+
function $9bf71ea28793e738$var$useFocusContainment(scopeRef, contain) {
|
|
284
|
+
let focusedNode = (0, $6nfFC$useRef)();
|
|
285
|
+
let raf = (0, $6nfFC$useRef)(null);
|
|
286
|
+
(0, $6nfFC$useLayoutEffect)(()=>{
|
|
287
|
+
let scope = scopeRef.current;
|
|
288
|
+
if (!contain) {
|
|
289
|
+
// if contain was changed, then we should cancel any ongoing waits to pull focus back into containment
|
|
290
|
+
if (raf.current) {
|
|
291
|
+
cancelAnimationFrame(raf.current);
|
|
292
|
+
raf.current = null;
|
|
293
|
+
}
|
|
294
|
+
return;
|
|
295
|
+
}
|
|
296
|
+
// Handle the Tab key to contain focus within the scope
|
|
297
|
+
let onKeyDown = (e)=>{
|
|
298
|
+
if (e.key !== "Tab" || e.altKey || e.ctrlKey || e.metaKey || !$9bf71ea28793e738$var$shouldContainFocus(scopeRef)) return;
|
|
299
|
+
let focusedElement = document.activeElement;
|
|
300
|
+
let scope = scopeRef.current;
|
|
301
|
+
if (!$9bf71ea28793e738$var$isElementInScope(focusedElement, scope)) return;
|
|
302
|
+
let walker = $9bf71ea28793e738$export$2d6ec8fc375ceafa($9bf71ea28793e738$var$getScopeRoot(scope), {
|
|
303
|
+
tabbable: true
|
|
304
|
+
}, scope);
|
|
305
|
+
walker.currentNode = focusedElement;
|
|
306
|
+
let nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
|
|
307
|
+
if (!nextElement) {
|
|
308
|
+
walker.currentNode = e.shiftKey ? scope[scope.length - 1].nextElementSibling : scope[0].previousElementSibling;
|
|
309
|
+
nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
|
|
310
|
+
}
|
|
311
|
+
e.preventDefault();
|
|
312
|
+
if (nextElement) $9bf71ea28793e738$var$focusElement(nextElement, true);
|
|
313
|
+
};
|
|
314
|
+
let onFocus = (e)=>{
|
|
315
|
+
// If focusing an element in a child scope of the currently active scope, the child becomes active.
|
|
316
|
+
// Moving out of the active scope to an ancestor is not allowed.
|
|
317
|
+
if ((!$9bf71ea28793e738$var$activeScope || $9bf71ea28793e738$var$isAncestorScope($9bf71ea28793e738$var$activeScope, scopeRef)) && $9bf71ea28793e738$var$isElementInScope(e.target, scopeRef.current)) {
|
|
318
|
+
$9bf71ea28793e738$var$activeScope = scopeRef;
|
|
319
|
+
focusedNode.current = e.target;
|
|
320
|
+
} else if ($9bf71ea28793e738$var$shouldContainFocus(scopeRef) && !$9bf71ea28793e738$var$isElementInChildScope(e.target, scopeRef)) {
|
|
321
|
+
// If a focus event occurs outside the active scope (e.g. user tabs from browser location bar),
|
|
322
|
+
// restore focus to the previously focused node or the first tabbable element in the active scope.
|
|
323
|
+
if (focusedNode.current) focusedNode.current.focus();
|
|
324
|
+
else if ($9bf71ea28793e738$var$activeScope) $9bf71ea28793e738$var$focusFirstInScope($9bf71ea28793e738$var$activeScope.current);
|
|
325
|
+
} else if ($9bf71ea28793e738$var$shouldContainFocus(scopeRef)) focusedNode.current = e.target;
|
|
326
|
+
};
|
|
327
|
+
let onBlur = (e)=>{
|
|
328
|
+
// Firefox doesn't shift focus back to the Dialog properly without this
|
|
329
|
+
if (raf.current) cancelAnimationFrame(raf.current);
|
|
330
|
+
raf.current = requestAnimationFrame(()=>{
|
|
331
|
+
// Use document.activeElement instead of e.relatedTarget so we can tell if user clicked into iframe
|
|
332
|
+
if ($9bf71ea28793e738$var$shouldContainFocus(scopeRef) && !$9bf71ea28793e738$var$isElementInChildScope(document.activeElement, scopeRef)) {
|
|
333
|
+
$9bf71ea28793e738$var$activeScope = scopeRef;
|
|
334
|
+
if (document.body.contains(e.target)) {
|
|
335
|
+
focusedNode.current = e.target;
|
|
336
|
+
focusedNode.current.focus();
|
|
337
|
+
} else if ($9bf71ea28793e738$var$activeScope) $9bf71ea28793e738$var$focusFirstInScope($9bf71ea28793e738$var$activeScope.current);
|
|
338
|
+
}
|
|
339
|
+
});
|
|
340
|
+
};
|
|
341
|
+
document.addEventListener("keydown", onKeyDown, false);
|
|
342
|
+
document.addEventListener("focusin", onFocus, false);
|
|
343
|
+
scope.forEach((element)=>element.addEventListener("focusin", onFocus, false));
|
|
344
|
+
scope.forEach((element)=>element.addEventListener("focusout", onBlur, false));
|
|
345
|
+
return ()=>{
|
|
346
|
+
document.removeEventListener("keydown", onKeyDown, false);
|
|
347
|
+
document.removeEventListener("focusin", onFocus, false);
|
|
348
|
+
scope.forEach((element)=>element.removeEventListener("focusin", onFocus, false));
|
|
349
|
+
scope.forEach((element)=>element.removeEventListener("focusout", onBlur, false));
|
|
350
|
+
};
|
|
351
|
+
}, [
|
|
352
|
+
scopeRef,
|
|
353
|
+
contain
|
|
354
|
+
]);
|
|
355
|
+
// eslint-disable-next-line arrow-body-style
|
|
356
|
+
(0, $6nfFC$useEffect)(()=>{
|
|
357
|
+
return ()=>{
|
|
358
|
+
if (raf.current) cancelAnimationFrame(raf.current);
|
|
359
|
+
};
|
|
360
|
+
}, [
|
|
361
|
+
raf
|
|
362
|
+
]);
|
|
363
|
+
}
|
|
364
|
+
function $9bf71ea28793e738$var$isElementInAnyScope(element) {
|
|
365
|
+
return $9bf71ea28793e738$var$isElementInChildScope(element);
|
|
366
|
+
}
|
|
367
|
+
function $9bf71ea28793e738$var$isElementInScope(element, scope) {
|
|
368
|
+
return scope.some((node)=>node.contains(element));
|
|
369
|
+
}
|
|
370
|
+
function $9bf71ea28793e738$var$isElementInChildScope(element, scope = null) {
|
|
371
|
+
// If the element is within a top layer element (e.g. toasts), always allow moving focus there.
|
|
372
|
+
if (element instanceof Element && element.closest("[data-react-aria-top-layer]")) return true;
|
|
373
|
+
// node.contains in isElementInScope covers child scopes that are also DOM children,
|
|
374
|
+
// but does not cover child scopes in portals.
|
|
375
|
+
for (let { scopeRef: s } of $9bf71ea28793e738$export$d06fae2ee68b101e.traverse($9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode(scope))){
|
|
376
|
+
if ($9bf71ea28793e738$var$isElementInScope(element, s.current)) return true;
|
|
377
|
+
}
|
|
378
|
+
return false;
|
|
379
|
+
}
|
|
380
|
+
function $9bf71ea28793e738$export$1258395f99bf9cbf(element) {
|
|
381
|
+
return $9bf71ea28793e738$var$isElementInChildScope(element, $9bf71ea28793e738$var$activeScope);
|
|
382
|
+
}
|
|
383
|
+
function $9bf71ea28793e738$var$isAncestorScope(ancestor, scope) {
|
|
384
|
+
var _focusScopeTree_getTreeNode;
|
|
385
|
+
let parent = (_focusScopeTree_getTreeNode = $9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode(scope)) === null || _focusScopeTree_getTreeNode === void 0 ? void 0 : _focusScopeTree_getTreeNode.parent;
|
|
386
|
+
while(parent){
|
|
387
|
+
if (parent.scopeRef === ancestor) return true;
|
|
388
|
+
parent = parent.parent;
|
|
389
|
+
}
|
|
390
|
+
return false;
|
|
391
|
+
}
|
|
392
|
+
function $9bf71ea28793e738$var$focusElement(element, scroll = false) {
|
|
393
|
+
if (element != null && !scroll) try {
|
|
394
|
+
(0, $6a99195332edec8b$export$80f3e147d781571c)(element);
|
|
395
|
+
} catch (err) {
|
|
396
|
+
// ignore
|
|
397
|
+
}
|
|
398
|
+
else if (element != null) try {
|
|
399
|
+
element.focus();
|
|
400
|
+
} catch (err1) {
|
|
401
|
+
// ignore
|
|
402
|
+
}
|
|
403
|
+
}
|
|
404
|
+
function $9bf71ea28793e738$var$focusFirstInScope(scope, tabbable = true) {
|
|
405
|
+
let sentinel = scope[0].previousElementSibling;
|
|
406
|
+
let walker = $9bf71ea28793e738$export$2d6ec8fc375ceafa($9bf71ea28793e738$var$getScopeRoot(scope), {
|
|
407
|
+
tabbable: tabbable
|
|
408
|
+
}, scope);
|
|
409
|
+
walker.currentNode = sentinel;
|
|
410
|
+
let nextNode = walker.nextNode();
|
|
411
|
+
// If the scope does not contain a tabbable element, use the first focusable element.
|
|
412
|
+
if (tabbable && !nextNode) {
|
|
413
|
+
walker = $9bf71ea28793e738$export$2d6ec8fc375ceafa($9bf71ea28793e738$var$getScopeRoot(scope), {
|
|
414
|
+
tabbable: false
|
|
415
|
+
}, scope);
|
|
416
|
+
walker.currentNode = sentinel;
|
|
417
|
+
nextNode = walker.nextNode();
|
|
418
|
+
}
|
|
419
|
+
$9bf71ea28793e738$var$focusElement(nextNode);
|
|
420
|
+
}
|
|
421
|
+
function $9bf71ea28793e738$var$useAutoFocus(scopeRef, autoFocus) {
|
|
422
|
+
const autoFocusRef = (0, $6nfFC$react).useRef(autoFocus);
|
|
423
|
+
(0, $6nfFC$useEffect)(()=>{
|
|
424
|
+
if (autoFocusRef.current) {
|
|
425
|
+
$9bf71ea28793e738$var$activeScope = scopeRef;
|
|
426
|
+
if (!$9bf71ea28793e738$var$isElementInScope(document.activeElement, $9bf71ea28793e738$var$activeScope.current)) $9bf71ea28793e738$var$focusFirstInScope(scopeRef.current);
|
|
427
|
+
}
|
|
428
|
+
autoFocusRef.current = false;
|
|
429
|
+
}, [
|
|
430
|
+
scopeRef
|
|
431
|
+
]);
|
|
432
|
+
}
|
|
433
|
+
function $9bf71ea28793e738$var$useActiveScopeTracker(scopeRef, restore, contain) {
|
|
434
|
+
// tracks the active scope, in case restore and contain are both false.
|
|
435
|
+
// if either are true, this is tracked in useRestoreFocus or useFocusContainment.
|
|
436
|
+
(0, $6nfFC$useLayoutEffect)(()=>{
|
|
437
|
+
if (restore || contain) return;
|
|
438
|
+
let scope = scopeRef.current;
|
|
439
|
+
let onFocus = (e)=>{
|
|
440
|
+
let target = e.target;
|
|
441
|
+
if ($9bf71ea28793e738$var$isElementInScope(target, scopeRef.current)) $9bf71ea28793e738$var$activeScope = scopeRef;
|
|
442
|
+
else if (!$9bf71ea28793e738$var$isElementInAnyScope(target)) $9bf71ea28793e738$var$activeScope = null;
|
|
443
|
+
};
|
|
444
|
+
document.addEventListener("focusin", onFocus, false);
|
|
445
|
+
scope.forEach((element)=>element.addEventListener("focusin", onFocus, false));
|
|
446
|
+
return ()=>{
|
|
447
|
+
document.removeEventListener("focusin", onFocus, false);
|
|
448
|
+
scope.forEach((element)=>element.removeEventListener("focusin", onFocus, false));
|
|
449
|
+
};
|
|
450
|
+
}, [
|
|
451
|
+
scopeRef,
|
|
452
|
+
restore,
|
|
453
|
+
contain
|
|
454
|
+
]);
|
|
455
|
+
}
|
|
456
|
+
function $9bf71ea28793e738$var$shouldRestoreFocus(scopeRef) {
|
|
457
|
+
let scope = $9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode($9bf71ea28793e738$var$activeScope);
|
|
458
|
+
while(scope && scope.scopeRef !== scopeRef){
|
|
459
|
+
if (scope.nodeToRestore) return false;
|
|
460
|
+
scope = scope.parent;
|
|
461
|
+
}
|
|
462
|
+
return (scope === null || scope === void 0 ? void 0 : scope.scopeRef) === scopeRef;
|
|
463
|
+
}
|
|
464
|
+
function $9bf71ea28793e738$var$useRestoreFocus(scopeRef, restoreFocus, contain) {
|
|
465
|
+
// create a ref during render instead of useLayoutEffect so the active element is saved before a child with autoFocus=true mounts.
|
|
466
|
+
const nodeToRestoreRef = (0, $6nfFC$useRef)(typeof document !== "undefined" ? document.activeElement : null);
|
|
467
|
+
// restoring scopes should all track if they are active regardless of contain, but contain already tracks it plus logic to contain the focus
|
|
468
|
+
// restoring-non-containing scopes should only care if they become active so they can perform the restore
|
|
469
|
+
(0, $6nfFC$useLayoutEffect)(()=>{
|
|
470
|
+
let scope = scopeRef.current;
|
|
471
|
+
if (!restoreFocus || contain) return;
|
|
472
|
+
let onFocus = ()=>{
|
|
473
|
+
// If focusing an element in a child scope of the currently active scope, the child becomes active.
|
|
474
|
+
// Moving out of the active scope to an ancestor is not allowed.
|
|
475
|
+
if (!$9bf71ea28793e738$var$activeScope || $9bf71ea28793e738$var$isAncestorScope($9bf71ea28793e738$var$activeScope, scopeRef)) $9bf71ea28793e738$var$activeScope = scopeRef;
|
|
476
|
+
};
|
|
477
|
+
document.addEventListener("focusin", onFocus, false);
|
|
478
|
+
scope.forEach((element)=>element.addEventListener("focusin", onFocus, false));
|
|
479
|
+
return ()=>{
|
|
480
|
+
document.removeEventListener("focusin", onFocus, false);
|
|
481
|
+
scope.forEach((element)=>element.removeEventListener("focusin", onFocus, false));
|
|
482
|
+
};
|
|
483
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
484
|
+
}, [
|
|
485
|
+
scopeRef,
|
|
486
|
+
contain
|
|
487
|
+
]);
|
|
488
|
+
// useLayoutEffect instead of useEffect so the active element is saved synchronously instead of asynchronously.
|
|
489
|
+
(0, $6nfFC$useLayoutEffect)(()=>{
|
|
490
|
+
if (!restoreFocus) return;
|
|
491
|
+
$9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode(scopeRef).nodeToRestore = nodeToRestoreRef.current;
|
|
492
|
+
// Handle the Tab key so that tabbing out of the scope goes to the next element
|
|
493
|
+
// after the node that had focus when the scope mounted. This is important when
|
|
494
|
+
// using portals for overlays, so that focus goes to the expected element when
|
|
495
|
+
// tabbing out of the overlay.
|
|
496
|
+
let onKeyDown = (e)=>{
|
|
497
|
+
if (e.key !== "Tab" || e.altKey || e.ctrlKey || e.metaKey) return;
|
|
498
|
+
let focusedElement = document.activeElement;
|
|
499
|
+
if (!$9bf71ea28793e738$var$isElementInScope(focusedElement, scopeRef.current)) return;
|
|
500
|
+
let nodeToRestore = $9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode(scopeRef).nodeToRestore;
|
|
501
|
+
// Create a DOM tree walker that matches all tabbable elements
|
|
502
|
+
let walker = $9bf71ea28793e738$export$2d6ec8fc375ceafa(document.body, {
|
|
503
|
+
tabbable: true
|
|
504
|
+
});
|
|
505
|
+
// Find the next tabbable element after the currently focused element
|
|
506
|
+
walker.currentNode = focusedElement;
|
|
507
|
+
let nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
|
|
508
|
+
if (!document.body.contains(nodeToRestore) || nodeToRestore === document.body) {
|
|
509
|
+
nodeToRestore = null;
|
|
510
|
+
$9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode(scopeRef).nodeToRestore = null;
|
|
511
|
+
}
|
|
512
|
+
// If there is no next element, or it is outside the current scope, move focus to the
|
|
513
|
+
// next element after the node to restore to instead.
|
|
514
|
+
if ((!nextElement || !$9bf71ea28793e738$var$isElementInScope(nextElement, scopeRef.current)) && nodeToRestore) {
|
|
515
|
+
walker.currentNode = nodeToRestore;
|
|
516
|
+
// Skip over elements within the scope, in case the scope immediately follows the node to restore.
|
|
517
|
+
do nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
|
|
518
|
+
while ($9bf71ea28793e738$var$isElementInScope(nextElement, scopeRef.current));
|
|
519
|
+
e.preventDefault();
|
|
520
|
+
e.stopPropagation();
|
|
521
|
+
if (nextElement) $9bf71ea28793e738$var$focusElement(nextElement, true);
|
|
522
|
+
else // If there is no next element and the nodeToRestore isn't within a FocusScope (i.e. we are leaving the top level focus scope)
|
|
523
|
+
// then move focus to the body.
|
|
524
|
+
// Otherwise restore focus to the nodeToRestore (e.g menu within a popover -> tabbing to close the menu should move focus to menu trigger)
|
|
525
|
+
if (!$9bf71ea28793e738$var$isElementInAnyScope(nodeToRestore)) focusedElement.blur();
|
|
526
|
+
else $9bf71ea28793e738$var$focusElement(nodeToRestore, true);
|
|
527
|
+
}
|
|
528
|
+
};
|
|
529
|
+
if (!contain) document.addEventListener("keydown", onKeyDown, true);
|
|
530
|
+
return ()=>{
|
|
531
|
+
if (!contain) document.removeEventListener("keydown", onKeyDown, true);
|
|
532
|
+
let nodeToRestore = $9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode(scopeRef).nodeToRestore;
|
|
533
|
+
// if we already lost focus to the body and this was the active scope, then we should attempt to restore
|
|
534
|
+
if (restoreFocus && nodeToRestore && // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
535
|
+
($9bf71ea28793e738$var$isElementInScope(document.activeElement, scopeRef.current) || document.activeElement === document.body && $9bf71ea28793e738$var$shouldRestoreFocus(scopeRef))) {
|
|
536
|
+
// freeze the focusScopeTree so it persists after the raf, otherwise during unmount nodes are removed from it
|
|
537
|
+
let clonedTree = $9bf71ea28793e738$export$d06fae2ee68b101e.clone();
|
|
538
|
+
requestAnimationFrame(()=>{
|
|
539
|
+
// Only restore focus if we've lost focus to the body, the alternative is that focus has been purposefully moved elsewhere
|
|
540
|
+
if (document.activeElement === document.body) {
|
|
541
|
+
// look up the tree starting with our scope to find a nodeToRestore still in the DOM
|
|
542
|
+
let treeNode = clonedTree.getTreeNode(scopeRef);
|
|
543
|
+
while(treeNode){
|
|
544
|
+
if (treeNode.nodeToRestore && document.body.contains(treeNode.nodeToRestore)) {
|
|
545
|
+
$9bf71ea28793e738$var$focusElement(treeNode.nodeToRestore);
|
|
546
|
+
return;
|
|
547
|
+
}
|
|
548
|
+
treeNode = treeNode.parent;
|
|
549
|
+
}
|
|
550
|
+
// If no nodeToRestore was found, focus the first element in the nearest
|
|
551
|
+
// ancestor scope that is still in the tree.
|
|
552
|
+
treeNode = clonedTree.getTreeNode(scopeRef);
|
|
553
|
+
while(treeNode){
|
|
554
|
+
if (treeNode.scopeRef && $9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode(treeNode.scopeRef)) {
|
|
555
|
+
$9bf71ea28793e738$var$focusFirstInScope(treeNode.scopeRef.current, true);
|
|
556
|
+
return;
|
|
557
|
+
}
|
|
558
|
+
treeNode = treeNode.parent;
|
|
559
|
+
}
|
|
560
|
+
}
|
|
561
|
+
});
|
|
562
|
+
}
|
|
563
|
+
};
|
|
564
|
+
}, [
|
|
565
|
+
scopeRef,
|
|
566
|
+
restoreFocus,
|
|
567
|
+
contain
|
|
568
|
+
]);
|
|
569
|
+
}
|
|
570
|
+
function $9bf71ea28793e738$export$2d6ec8fc375ceafa(root, opts, scope) {
|
|
571
|
+
let selector = (opts === null || opts === void 0 ? void 0 : opts.tabbable) ? $9bf71ea28793e738$var$TABBABLE_ELEMENT_SELECTOR : $9bf71ea28793e738$var$FOCUSABLE_ELEMENT_SELECTOR;
|
|
572
|
+
let walker = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT, {
|
|
573
|
+
acceptNode (node) {
|
|
574
|
+
var _opts_from;
|
|
575
|
+
// Skip nodes inside the starting node.
|
|
576
|
+
if (opts === null || opts === void 0 ? void 0 : (_opts_from = opts.from) === null || _opts_from === void 0 ? void 0 : _opts_from.contains(node)) return NodeFilter.FILTER_REJECT;
|
|
577
|
+
if (node.matches(selector) && (0, $645f2e67b85a24c9$export$e989c0fffaa6b27a)(node) && (!scope || $9bf71ea28793e738$var$isElementInScope(node, scope)) && (!(opts === null || opts === void 0 ? void 0 : opts.accept) || opts.accept(node))) return NodeFilter.FILTER_ACCEPT;
|
|
578
|
+
return NodeFilter.FILTER_SKIP;
|
|
579
|
+
}
|
|
580
|
+
});
|
|
581
|
+
if (opts === null || opts === void 0 ? void 0 : opts.from) walker.currentNode = opts.from;
|
|
582
|
+
return walker;
|
|
583
|
+
}
|
|
584
|
+
function $9bf71ea28793e738$export$c5251b9e124bf29(ref, defaultOptions = {}) {
|
|
585
|
+
return {
|
|
586
|
+
focusNext (opts = {}) {
|
|
587
|
+
let root = ref.current;
|
|
588
|
+
if (!root) return;
|
|
589
|
+
let { from: from , tabbable: tabbable = defaultOptions.tabbable , wrap: wrap = defaultOptions.wrap , accept: accept = defaultOptions.accept } = opts;
|
|
590
|
+
let node = from || document.activeElement;
|
|
591
|
+
let walker = $9bf71ea28793e738$export$2d6ec8fc375ceafa(root, {
|
|
592
|
+
tabbable: tabbable,
|
|
593
|
+
accept: accept
|
|
594
|
+
});
|
|
595
|
+
if (root.contains(node)) walker.currentNode = node;
|
|
596
|
+
let nextNode = walker.nextNode();
|
|
597
|
+
if (!nextNode && wrap) {
|
|
598
|
+
walker.currentNode = root;
|
|
599
|
+
nextNode = walker.nextNode();
|
|
600
|
+
}
|
|
601
|
+
if (nextNode) $9bf71ea28793e738$var$focusElement(nextNode, true);
|
|
602
|
+
return nextNode;
|
|
603
|
+
},
|
|
604
|
+
focusPrevious (opts = defaultOptions) {
|
|
605
|
+
let root = ref.current;
|
|
606
|
+
if (!root) return;
|
|
607
|
+
let { from: from , tabbable: tabbable = defaultOptions.tabbable , wrap: wrap = defaultOptions.wrap , accept: accept = defaultOptions.accept } = opts;
|
|
608
|
+
let node = from || document.activeElement;
|
|
609
|
+
let walker = $9bf71ea28793e738$export$2d6ec8fc375ceafa(root, {
|
|
610
|
+
tabbable: tabbable,
|
|
611
|
+
accept: accept
|
|
612
|
+
});
|
|
613
|
+
if (root.contains(node)) walker.currentNode = node;
|
|
614
|
+
else {
|
|
615
|
+
let next = $9bf71ea28793e738$var$last(walker);
|
|
616
|
+
if (next) $9bf71ea28793e738$var$focusElement(next, true);
|
|
617
|
+
return next;
|
|
618
|
+
}
|
|
619
|
+
let previousNode = walker.previousNode();
|
|
620
|
+
if (!previousNode && wrap) {
|
|
621
|
+
walker.currentNode = root;
|
|
622
|
+
previousNode = $9bf71ea28793e738$var$last(walker);
|
|
623
|
+
}
|
|
624
|
+
if (previousNode) $9bf71ea28793e738$var$focusElement(previousNode, true);
|
|
625
|
+
return previousNode;
|
|
626
|
+
},
|
|
627
|
+
focusFirst (opts = defaultOptions) {
|
|
628
|
+
let root = ref.current;
|
|
629
|
+
if (!root) return;
|
|
630
|
+
let { tabbable: tabbable = defaultOptions.tabbable , accept: accept = defaultOptions.accept } = opts;
|
|
631
|
+
let walker = $9bf71ea28793e738$export$2d6ec8fc375ceafa(root, {
|
|
632
|
+
tabbable: tabbable,
|
|
633
|
+
accept: accept
|
|
634
|
+
});
|
|
635
|
+
let nextNode = walker.nextNode();
|
|
636
|
+
if (nextNode) $9bf71ea28793e738$var$focusElement(nextNode, true);
|
|
637
|
+
return nextNode;
|
|
638
|
+
},
|
|
639
|
+
focusLast (opts = defaultOptions) {
|
|
640
|
+
let root = ref.current;
|
|
641
|
+
if (!root) return;
|
|
642
|
+
let { tabbable: tabbable = defaultOptions.tabbable , accept: accept = defaultOptions.accept } = opts;
|
|
643
|
+
let walker = $9bf71ea28793e738$export$2d6ec8fc375ceafa(root, {
|
|
644
|
+
tabbable: tabbable,
|
|
645
|
+
accept: accept
|
|
646
|
+
});
|
|
647
|
+
let next = $9bf71ea28793e738$var$last(walker);
|
|
648
|
+
if (next) $9bf71ea28793e738$var$focusElement(next, true);
|
|
649
|
+
return next;
|
|
650
|
+
}
|
|
651
|
+
};
|
|
652
|
+
}
|
|
653
|
+
function $9bf71ea28793e738$var$last(walker) {
|
|
654
|
+
let next;
|
|
655
|
+
let last;
|
|
656
|
+
do {
|
|
657
|
+
last = walker.lastChild();
|
|
658
|
+
if (last) next = last;
|
|
659
|
+
}while (last);
|
|
660
|
+
return next;
|
|
661
|
+
}
|
|
662
|
+
class $9bf71ea28793e738$var$Tree {
|
|
663
|
+
get size() {
|
|
664
|
+
return this.fastMap.size;
|
|
665
|
+
}
|
|
666
|
+
getTreeNode(data) {
|
|
667
|
+
return this.fastMap.get(data);
|
|
668
|
+
}
|
|
669
|
+
addTreeNode(scopeRef, parent, nodeToRestore) {
|
|
670
|
+
let parentNode = this.fastMap.get(parent !== null && parent !== void 0 ? parent : null);
|
|
671
|
+
let node = new $9bf71ea28793e738$var$TreeNode({
|
|
672
|
+
scopeRef: scopeRef
|
|
673
|
+
});
|
|
674
|
+
parentNode.addChild(node);
|
|
675
|
+
node.parent = parentNode;
|
|
676
|
+
this.fastMap.set(scopeRef, node);
|
|
677
|
+
if (nodeToRestore) node.nodeToRestore = nodeToRestore;
|
|
678
|
+
}
|
|
679
|
+
addNode(node) {
|
|
680
|
+
this.fastMap.set(node.scopeRef, node);
|
|
681
|
+
}
|
|
682
|
+
removeTreeNode(scopeRef) {
|
|
683
|
+
// never remove the root
|
|
684
|
+
if (scopeRef === null) return;
|
|
685
|
+
let node = this.fastMap.get(scopeRef);
|
|
686
|
+
let parentNode = node.parent;
|
|
687
|
+
// when we remove a scope, check if any sibling scopes are trying to restore focus to something inside the scope we're removing
|
|
688
|
+
// if we are, then replace the siblings restore with the restore from the scope we're removing
|
|
689
|
+
for (let current of this.traverse())if (current !== node && node.nodeToRestore && current.nodeToRestore && node.scopeRef.current && $9bf71ea28793e738$var$isElementInScope(current.nodeToRestore, node.scopeRef.current)) current.nodeToRestore = node.nodeToRestore;
|
|
690
|
+
let children = node.children;
|
|
691
|
+
parentNode.removeChild(node);
|
|
692
|
+
if (children.size > 0) children.forEach((child)=>parentNode.addChild(child));
|
|
693
|
+
this.fastMap.delete(node.scopeRef);
|
|
694
|
+
}
|
|
695
|
+
// Pre Order Depth First
|
|
696
|
+
*traverse(node = this.root) {
|
|
697
|
+
if (node.scopeRef != null) yield node;
|
|
698
|
+
if (node.children.size > 0) for (let child of node.children)yield* this.traverse(child);
|
|
699
|
+
}
|
|
700
|
+
clone() {
|
|
701
|
+
let newTree = new $9bf71ea28793e738$var$Tree();
|
|
702
|
+
for (let node of this.traverse())newTree.addTreeNode(node.scopeRef, node.parent.scopeRef, node.nodeToRestore);
|
|
703
|
+
return newTree;
|
|
704
|
+
}
|
|
705
|
+
constructor(){
|
|
706
|
+
(0, $6nfFC$swchelperssrc_define_propertymjs)(this, "fastMap", new Map());
|
|
707
|
+
this.root = new $9bf71ea28793e738$var$TreeNode({
|
|
708
|
+
scopeRef: null
|
|
709
|
+
});
|
|
710
|
+
this.fastMap.set(null, this.root);
|
|
711
|
+
}
|
|
712
|
+
}
|
|
713
|
+
class $9bf71ea28793e738$var$TreeNode {
|
|
714
|
+
addChild(node) {
|
|
715
|
+
this.children.add(node);
|
|
716
|
+
node.parent = this;
|
|
717
|
+
}
|
|
718
|
+
removeChild(node) {
|
|
719
|
+
this.children.delete(node);
|
|
720
|
+
node.parent = undefined;
|
|
721
|
+
}
|
|
722
|
+
constructor(props){
|
|
723
|
+
(0, $6nfFC$swchelperssrc_define_propertymjs)(this, "children", new Set());
|
|
724
|
+
(0, $6nfFC$swchelperssrc_define_propertymjs)(this, "contain", false);
|
|
725
|
+
this.scopeRef = props.scopeRef;
|
|
726
|
+
}
|
|
727
|
+
}
|
|
728
|
+
let $9bf71ea28793e738$export$d06fae2ee68b101e = new $9bf71ea28793e738$var$Tree();
|
|
729
|
+
|
|
730
|
+
|
|
731
|
+
/*
|
|
732
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
733
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
734
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
735
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
736
|
+
*
|
|
737
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
738
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
739
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
740
|
+
* governing permissions and limitations under the License.
|
|
741
|
+
*/
|
|
742
|
+
|
|
743
|
+
|
|
744
|
+
|
|
745
|
+
|
|
746
|
+
|
|
747
|
+
function $f7dceffc5ad7768b$export$4e328f61c538687f(props = {}) {
|
|
748
|
+
let { autoFocus: autoFocus = false , isTextInput: isTextInput , within: within } = props;
|
|
749
|
+
let state = (0, $6nfFC$useRef)({
|
|
750
|
+
isFocused: false,
|
|
751
|
+
isFocusVisible: autoFocus || (0, $6nfFC$isFocusVisible)()
|
|
752
|
+
});
|
|
753
|
+
let [isFocused, setFocused] = (0, $6nfFC$useState)(false);
|
|
754
|
+
let [isFocusVisibleState, setFocusVisible] = (0, $6nfFC$useState)(()=>state.current.isFocused && state.current.isFocusVisible);
|
|
755
|
+
let updateState = (0, $6nfFC$useCallback)(()=>setFocusVisible(state.current.isFocused && state.current.isFocusVisible), []);
|
|
756
|
+
let onFocusChange = (0, $6nfFC$useCallback)((isFocused)=>{
|
|
757
|
+
state.current.isFocused = isFocused;
|
|
758
|
+
setFocused(isFocused);
|
|
759
|
+
updateState();
|
|
760
|
+
}, [
|
|
761
|
+
updateState
|
|
762
|
+
]);
|
|
763
|
+
(0, $6nfFC$useFocusVisibleListener)((isFocusVisible)=>{
|
|
764
|
+
state.current.isFocusVisible = isFocusVisible;
|
|
765
|
+
updateState();
|
|
766
|
+
}, [], {
|
|
767
|
+
isTextInput: isTextInput
|
|
768
|
+
});
|
|
769
|
+
let { focusProps: focusProps } = (0, $6nfFC$useFocus)({
|
|
770
|
+
isDisabled: within,
|
|
771
|
+
onFocusChange: onFocusChange
|
|
772
|
+
});
|
|
773
|
+
let { focusWithinProps: focusWithinProps } = (0, $6nfFC$useFocusWithin)({
|
|
774
|
+
isDisabled: !within,
|
|
775
|
+
onFocusWithinChange: onFocusChange
|
|
776
|
+
});
|
|
777
|
+
return {
|
|
778
|
+
isFocused: isFocused,
|
|
779
|
+
isFocusVisible: state.current.isFocused && isFocusVisibleState,
|
|
780
|
+
focusProps: within ? focusWithinProps : focusProps
|
|
781
|
+
};
|
|
782
|
+
}
|
|
783
|
+
|
|
784
|
+
|
|
785
|
+
function $907718708eab68af$export$1a38b4ad7f578e1d(props) {
|
|
786
|
+
let { children: children , focusClass: focusClass , focusRingClass: focusRingClass } = props;
|
|
787
|
+
let { isFocused: isFocused , isFocusVisible: isFocusVisible , focusProps: focusProps } = (0, $f7dceffc5ad7768b$export$4e328f61c538687f)(props);
|
|
788
|
+
let child = (0, $6nfFC$react).Children.only(children);
|
|
789
|
+
return /*#__PURE__*/ (0, $6nfFC$react).cloneElement(child, (0, $6nfFC$mergeProps)(child.props, {
|
|
790
|
+
...focusProps,
|
|
791
|
+
className: (0, $6nfFC$clsx)({
|
|
792
|
+
[focusClass || ""]: isFocused,
|
|
793
|
+
[focusRingClass || ""]: isFocusVisible
|
|
794
|
+
})
|
|
795
|
+
}));
|
|
796
|
+
}
|
|
797
|
+
|
|
798
|
+
|
|
799
|
+
/*
|
|
800
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
801
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
802
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
803
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
804
|
+
*
|
|
805
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
806
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
807
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
808
|
+
* governing permissions and limitations under the License.
|
|
809
|
+
*/
|
|
810
|
+
|
|
811
|
+
|
|
812
|
+
|
|
813
|
+
let $e6afbd83fe6ebbd2$var$FocusableContext = /*#__PURE__*/ (0, $6nfFC$react).createContext(null);
|
|
814
|
+
function $e6afbd83fe6ebbd2$var$useFocusableContext(ref) {
|
|
815
|
+
let context = (0, $6nfFC$useContext)($e6afbd83fe6ebbd2$var$FocusableContext) || {};
|
|
816
|
+
(0, $6nfFC$useSyncRef)(context, ref);
|
|
817
|
+
// eslint-disable-next-line
|
|
818
|
+
let { ref: _ , ...otherProps } = context;
|
|
819
|
+
return otherProps;
|
|
820
|
+
}
|
|
821
|
+
/**
|
|
822
|
+
* Provides DOM props to the nearest focusable child.
|
|
823
|
+
*/ function $e6afbd83fe6ebbd2$var$FocusableProvider(props, ref) {
|
|
824
|
+
let { children: children , ...otherProps } = props;
|
|
825
|
+
let context = {
|
|
826
|
+
...otherProps,
|
|
827
|
+
ref: ref
|
|
828
|
+
};
|
|
829
|
+
return /*#__PURE__*/ (0, $6nfFC$react).createElement($e6afbd83fe6ebbd2$var$FocusableContext.Provider, {
|
|
830
|
+
value: context
|
|
831
|
+
}, children);
|
|
832
|
+
}
|
|
833
|
+
let $e6afbd83fe6ebbd2$export$13f3202a3e5ddd5 = /*#__PURE__*/ (0, $6nfFC$react).forwardRef($e6afbd83fe6ebbd2$var$FocusableProvider);
|
|
834
|
+
function $e6afbd83fe6ebbd2$export$4c014de7c8940b4c(props, domRef) {
|
|
835
|
+
let { focusProps: focusProps } = (0, $6nfFC$useFocus)(props);
|
|
836
|
+
let { keyboardProps: keyboardProps } = (0, $6nfFC$useKeyboard)(props);
|
|
837
|
+
let interactions = (0, $6nfFC$mergeProps)(focusProps, keyboardProps);
|
|
838
|
+
let domProps = $e6afbd83fe6ebbd2$var$useFocusableContext(domRef);
|
|
839
|
+
let interactionProps = props.isDisabled ? {} : domProps;
|
|
840
|
+
let autoFocusRef = (0, $6nfFC$useRef)(props.autoFocus);
|
|
841
|
+
(0, $6nfFC$useEffect)(()=>{
|
|
842
|
+
if (autoFocusRef.current && domRef.current) (0, $6a99195332edec8b$export$80f3e147d781571c)(domRef.current);
|
|
843
|
+
autoFocusRef.current = false;
|
|
844
|
+
}, [
|
|
845
|
+
domRef
|
|
846
|
+
]);
|
|
847
|
+
return {
|
|
848
|
+
focusableProps: (0, $6nfFC$mergeProps)({
|
|
849
|
+
...interactions,
|
|
850
|
+
tabIndex: props.excludeFromTabOrder && !props.isDisabled ? -1 : undefined
|
|
851
|
+
}, interactionProps)
|
|
852
|
+
};
|
|
853
|
+
}
|
|
854
|
+
|
|
855
|
+
|
|
856
|
+
|
|
857
|
+
|
|
858
|
+
|
|
859
|
+
|
|
860
|
+
export {$9bf71ea28793e738$export$20e40289641fbbb6 as FocusScope, $9bf71ea28793e738$export$10c5169755ce7bd7 as useFocusManager, $9bf71ea28793e738$export$2d6ec8fc375ceafa as getFocusableTreeWalker, $9bf71ea28793e738$export$c5251b9e124bf29 as createFocusManager, $9bf71ea28793e738$export$1258395f99bf9cbf as isElementInChildOfActiveScope, $907718708eab68af$export$1a38b4ad7f578e1d as FocusRing, $e6afbd83fe6ebbd2$export$13f3202a3e5ddd5 as FocusableProvider, $e6afbd83fe6ebbd2$export$4c014de7c8940b4c as useFocusable, $f7dceffc5ad7768b$export$4e328f61c538687f as useFocusRing, $6a99195332edec8b$export$80f3e147d781571c as focusSafely};
|
|
861
|
+
//# sourceMappingURL=module.js.map
|