@react-aria/focus 3.5.0 → 3.5.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/main.js CHANGED
@@ -1,65 +1,56 @@
1
- var _babelRuntimeHelpersObjectWithoutPropertiesLoose = $parcel$interopDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
2
-
3
- var _clsx = $parcel$interopDefault(require("clsx"));
4
-
5
- var _babelRuntimeHelpersExtends = $parcel$interopDefault(require("@babel/runtime/helpers/extends"));
6
-
7
- var _react2 = require("react");
8
-
9
- var _react = $parcel$interopDefault(_react2);
10
-
11
- var {
12
- useContext,
13
- useEffect,
14
- useRef,
15
- useState
16
- } = _react2;
17
-
18
- var {
19
- getInteractionModality,
20
- isFocusVisible: _isFocusVisible,
21
- useFocus,
22
- useFocusVisibleListener,
23
- useFocusWithin,
24
- useKeyboard
25
- } = require("@react-aria/interactions");
1
+ var $aB6Cp$react = require("react");
2
+ var $aB6Cp$reactariautils = require("@react-aria/utils");
3
+ var $aB6Cp$reactariainteractions = require("@react-aria/interactions");
4
+ var $aB6Cp$clsx = require("clsx");
5
+
6
+ function $parcel$exportWildcard(dest, source) {
7
+ Object.keys(source).forEach(function(key) {
8
+ if (key === 'default' || key === '__esModule' || dest.hasOwnProperty(key)) {
9
+ return;
10
+ }
26
11
 
27
- var {
28
- focusWithoutScrolling,
29
- runAfterTransition,
30
- useLayoutEffect,
31
- mergeProps,
32
- useSyncRef
33
- } = require("@react-aria/utils");
12
+ Object.defineProperty(dest, key, {
13
+ enumerable: true,
14
+ get: function get() {
15
+ return source[key];
16
+ }
17
+ });
18
+ });
34
19
 
20
+ return dest;
21
+ }
35
22
  function $parcel$interopDefault(a) {
36
23
  return a && a.__esModule ? a.default : a;
37
24
  }
38
-
39
- /**
40
- * A utility function that focuses an element while avoiding undesired side effects such
41
- * as page scrolling and screen reader issues with CSS transitions.
42
- */
43
- function focusSafely(element) {
44
- // If the user is interacting with a virtual cursor, e.g. screen reader, then
45
- // wait until after any animated transitions that are currently occurring on
46
- // the page before shifting focus. This avoids issues with VoiceOver on iOS
47
- // causing the page to scroll when moving focus if the element is transitioning
48
- // from off the screen.
49
- if (getInteractionModality() === 'virtual') {
50
- let lastFocusedElement = document.activeElement;
51
- runAfterTransition(() => {
52
- // If focus did not move and the element is still in the document, focus it.
53
- if (document.activeElement === lastFocusedElement && document.contains(element)) {
54
- focusWithoutScrolling(element);
55
- }
56
- });
57
- } else {
58
- focusWithoutScrolling(element);
59
- }
25
+ function $parcel$export(e, n, v, s) {
26
+ Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
27
+ }
28
+ var $a7a032acae3ddda9$exports = {};
29
+
30
+ $parcel$export($a7a032acae3ddda9$exports, "FocusScope", () => $a7a032acae3ddda9$export$20e40289641fbbb6);
31
+ $parcel$export($a7a032acae3ddda9$exports, "useFocusManager", () => $a7a032acae3ddda9$export$10c5169755ce7bd7);
32
+ $parcel$export($a7a032acae3ddda9$exports, "getFocusableTreeWalker", () => $a7a032acae3ddda9$export$2d6ec8fc375ceafa);
33
+ $parcel$export($a7a032acae3ddda9$exports, "createFocusManager", () => $a7a032acae3ddda9$export$c5251b9e124bf29);
34
+ var $1c7f9157d722357d$exports = {};
35
+
36
+ $parcel$export($1c7f9157d722357d$exports, "focusSafely", () => $1c7f9157d722357d$export$80f3e147d781571c);
37
+
38
+
39
+ function $1c7f9157d722357d$export$80f3e147d781571c(element) {
40
+ // If the user is interacting with a virtual cursor, e.g. screen reader, then
41
+ // wait until after any animated transitions that are currently occurring on
42
+ // the page before shifting focus. This avoids issues with VoiceOver on iOS
43
+ // causing the page to scroll when moving focus if the element is transitioning
44
+ // from off the screen.
45
+ if ($aB6Cp$reactariainteractions.getInteractionModality() === 'virtual') {
46
+ let lastFocusedElement = document.activeElement;
47
+ $aB6Cp$reactariautils.runAfterTransition(()=>{
48
+ // If focus did not move and the element is still in the document, focus it.
49
+ if (document.activeElement === lastFocusedElement && document.contains(element)) $aB6Cp$reactariautils.focusWithoutScrolling(element);
50
+ });
51
+ } else $aB6Cp$reactariautils.focusWithoutScrolling(element);
60
52
  }
61
53
 
62
- exports.focusSafely = focusSafely;
63
54
 
64
55
  /*
65
56
  * Copyright 2021 Adobe. All rights reserved.
@@ -71,836 +62,564 @@ exports.focusSafely = focusSafely;
71
62
  * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
72
63
  * OF ANY KIND, either express or implied. See the License for the specific language
73
64
  * governing permissions and limitations under the License.
74
- */
75
- function $f5b8109741a107bfe8bf4093e29$var$isStyleVisible(element) {
76
- if (!(element instanceof HTMLElement) && !(element instanceof SVGElement)) {
77
- return false;
78
- }
79
-
80
- let {
81
- display,
82
- visibility
83
- } = element.style;
84
- let isVisible = display !== 'none' && visibility !== 'hidden' && visibility !== 'collapse';
85
-
86
- if (isVisible) {
87
- const {
88
- getComputedStyle
89
- } = element.ownerDocument.defaultView;
90
- let {
91
- display: computedDisplay,
92
- visibility: computedVisibility
93
- } = getComputedStyle(element);
94
- isVisible = computedDisplay !== 'none' && computedVisibility !== 'hidden' && computedVisibility !== 'collapse';
95
- }
96
-
97
- return isVisible;
98
- }
99
-
100
- function $f5b8109741a107bfe8bf4093e29$var$isAttributeVisible(element, childElement) {
101
- return !element.hasAttribute('hidden') && (element.nodeName === 'DETAILS' && childElement && childElement.nodeName !== 'SUMMARY' ? element.hasAttribute('open') : true);
102
- }
103
- /**
104
- * Adapted from https://github.com/testing-library/jest-dom and
105
- * https://github.com/vuejs/vue-test-utils-next/.
106
- * Licensed under the MIT License.
107
- * @param element - Element to evaluate for display or visibility.
108
- */
109
-
110
-
111
- function $f5b8109741a107bfe8bf4093e29$export$isElementVisible(element, childElement) {
112
- return element.nodeName !== '#comment' && $f5b8109741a107bfe8bf4093e29$var$isStyleVisible(element) && $f5b8109741a107bfe8bf4093e29$var$isAttributeVisible(element, childElement) && (!element.parentElement || $f5b8109741a107bfe8bf4093e29$export$isElementVisible(element.parentElement, element));
113
- }
114
-
115
- const $bdceb2956edbee43435a9382ef97283f$var$FocusContext = /*#__PURE__*/_react.createContext(null);
116
-
117
- let $bdceb2956edbee43435a9382ef97283f$var$activeScope = null;
118
- let $bdceb2956edbee43435a9382ef97283f$var$scopes = new Map(); // This is a hacky DOM-based implementation of a FocusScope until this RFC lands in React:
119
- // https://github.com/reactjs/rfcs/pull/109
120
- // For now, it relies on the DOM tree order rather than the React tree order, and is probably
121
- // less optimized for performance.
122
-
123
- /**
124
- * A FocusScope manages focus for its descendants. It supports containing focus inside
125
- * the scope, restoring focus to the previously focused element on unmount, and auto
126
- * focusing children on mount. It also acts as a container for a programmatic focus
127
- * management interface that can be used to move focus forward and back in response
128
- * to user events.
129
- */
130
-
131
- function FocusScope(props) {
132
- let {
133
- children,
134
- contain,
135
- restoreFocus,
136
- autoFocus
137
- } = props;
138
- let startRef = useRef();
139
- let endRef = useRef();
140
- let scopeRef = useRef([]);
141
- let ctx = useContext($bdceb2956edbee43435a9382ef97283f$var$FocusContext);
142
- let parentScope = ctx == null ? void 0 : ctx.scopeRef;
143
- useLayoutEffect(() => {
144
- // Find all rendered nodes between the sentinels and add them to the scope.
145
- let node = startRef.current.nextSibling;
146
- let nodes = [];
147
-
148
- while (node && node !== endRef.current) {
149
- nodes.push(node);
150
- node = node.nextSibling;
151
- }
152
-
153
- scopeRef.current = nodes;
154
- }, [children, parentScope]);
155
- useLayoutEffect(() => {
156
- $bdceb2956edbee43435a9382ef97283f$var$scopes.set(scopeRef, parentScope);
157
- return () => {
158
- // Restore the active scope on unmount if this scope or a descendant scope is active.
159
- // Parent effect cleanups run before children, so we need to check if the
160
- // parent scope actually still exists before restoring the active scope to it.
161
- if ((scopeRef === $bdceb2956edbee43435a9382ef97283f$var$activeScope || $bdceb2956edbee43435a9382ef97283f$var$isAncestorScope(scopeRef, $bdceb2956edbee43435a9382ef97283f$var$activeScope)) && (!parentScope || $bdceb2956edbee43435a9382ef97283f$var$scopes.has(parentScope))) {
162
- $bdceb2956edbee43435a9382ef97283f$var$activeScope = parentScope;
163
- }
164
-
165
- $bdceb2956edbee43435a9382ef97283f$var$scopes.delete(scopeRef);
166
- };
167
- }, [scopeRef, parentScope]);
168
- $bdceb2956edbee43435a9382ef97283f$var$useFocusContainment(scopeRef, contain);
169
- $bdceb2956edbee43435a9382ef97283f$var$useRestoreFocus(scopeRef, restoreFocus, contain);
170
- $bdceb2956edbee43435a9382ef97283f$var$useAutoFocus(scopeRef, autoFocus);
171
- let focusManager = $bdceb2956edbee43435a9382ef97283f$var$createFocusManagerForScope(scopeRef);
172
- return /*#__PURE__*/_react.createElement($bdceb2956edbee43435a9382ef97283f$var$FocusContext.Provider, {
173
- value: {
174
- scopeRef,
175
- focusManager
65
+ */ function $d5156037ad898a4d$var$isStyleVisible(element) {
66
+ if (!(element instanceof HTMLElement) && !(element instanceof SVGElement)) return false;
67
+ let { display: display , visibility: visibility } = element.style;
68
+ let isVisible = display !== 'none' && visibility !== 'hidden' && visibility !== 'collapse';
69
+ if (isVisible) {
70
+ const { getComputedStyle: getComputedStyle } = element.ownerDocument.defaultView;
71
+ let { display: computedDisplay , visibility: computedVisibility } = getComputedStyle(element);
72
+ isVisible = computedDisplay !== 'none' && computedVisibility !== 'hidden' && computedVisibility !== 'collapse';
176
73
  }
177
- }, /*#__PURE__*/_react.createElement("span", {
178
- "data-focus-scope-start": true,
179
- hidden: true,
180
- ref: startRef
181
- }), children, /*#__PURE__*/_react.createElement("span", {
182
- "data-focus-scope-end": true,
183
- hidden: true,
184
- ref: endRef
185
- }));
74
+ return isVisible;
186
75
  }
187
- /**
188
- * Returns a FocusManager interface for the parent FocusScope.
189
- * A FocusManager can be used to programmatically move focus within
190
- * a FocusScope, e.g. in response to user events like keyboard navigation.
191
- */
192
-
193
-
194
- exports.FocusScope = FocusScope;
195
-
196
- function useFocusManager() {
197
- var _useContext;
198
-
199
- return (_useContext = useContext($bdceb2956edbee43435a9382ef97283f$var$FocusContext)) == null ? void 0 : _useContext.focusManager;
76
+ function $d5156037ad898a4d$var$isAttributeVisible(element, childElement) {
77
+ return !element.hasAttribute('hidden') && (element.nodeName === 'DETAILS' && childElement && childElement.nodeName !== 'SUMMARY' ? element.hasAttribute('open') : true);
200
78
  }
201
-
202
- exports.useFocusManager = useFocusManager;
203
-
204
- function $bdceb2956edbee43435a9382ef97283f$var$createFocusManagerForScope(scopeRef) {
205
- return {
206
- focusNext(opts) {
207
- if (opts === void 0) {
208
- opts = {};
209
- }
210
-
211
- let scope = scopeRef.current;
212
- let {
213
- from,
214
- tabbable,
215
- wrap
216
- } = opts;
217
- let node = from || document.activeElement;
218
- let sentinel = scope[0].previousElementSibling;
219
- let walker = getFocusableTreeWalker($bdceb2956edbee43435a9382ef97283f$var$getScopeRoot(scope), {
220
- tabbable
221
- }, scope);
222
- walker.currentNode = $bdceb2956edbee43435a9382ef97283f$var$isElementInScope(node, scope) ? node : sentinel;
223
- let nextNode = walker.nextNode();
224
-
225
- if (!nextNode && wrap) {
226
- walker.currentNode = sentinel;
227
- nextNode = walker.nextNode();
228
- }
229
-
230
- if (nextNode) {
231
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(nextNode, true);
232
- }
233
-
234
- return nextNode;
235
- },
236
-
237
- focusPrevious(opts) {
238
- if (opts === void 0) {
239
- opts = {};
240
- }
241
-
242
- let scope = scopeRef.current;
243
- let {
244
- from,
245
- tabbable,
246
- wrap
247
- } = opts;
248
- let node = from || document.activeElement;
249
- let sentinel = scope[scope.length - 1].nextElementSibling;
250
- let walker = getFocusableTreeWalker($bdceb2956edbee43435a9382ef97283f$var$getScopeRoot(scope), {
251
- tabbable
252
- }, scope);
253
- walker.currentNode = $bdceb2956edbee43435a9382ef97283f$var$isElementInScope(node, scope) ? node : sentinel;
254
- let previousNode = walker.previousNode();
255
-
256
- if (!previousNode && wrap) {
257
- walker.currentNode = sentinel;
258
- previousNode = walker.previousNode();
259
- }
260
-
261
- if (previousNode) {
262
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(previousNode, true);
263
- }
264
-
265
- return previousNode;
266
- },
267
-
268
- focusFirst(opts) {
269
- if (opts === void 0) {
270
- opts = {};
271
- }
272
-
273
- let scope = scopeRef.current;
274
- let {
275
- tabbable
276
- } = opts;
277
- let walker = getFocusableTreeWalker($bdceb2956edbee43435a9382ef97283f$var$getScopeRoot(scope), {
278
- tabbable
279
- }, scope);
280
- walker.currentNode = scope[0].previousElementSibling;
281
- let nextNode = walker.nextNode();
282
-
283
- if (nextNode) {
284
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(nextNode, true);
285
- }
286
-
287
- return nextNode;
288
- },
289
-
290
- focusLast(opts) {
291
- if (opts === void 0) {
292
- opts = {};
293
- }
294
-
295
- let scope = scopeRef.current;
296
- let {
297
- tabbable
298
- } = opts;
299
- let walker = getFocusableTreeWalker($bdceb2956edbee43435a9382ef97283f$var$getScopeRoot(scope), {
300
- tabbable
301
- }, scope);
302
- walker.currentNode = scope[scope.length - 1].nextElementSibling;
303
- let previousNode = walker.previousNode();
304
-
305
- if (previousNode) {
306
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(previousNode, true);
307
- }
308
-
309
- return previousNode;
310
- }
311
-
312
- };
79
+ function $d5156037ad898a4d$export$e989c0fffaa6b27a(element, childElement) {
80
+ return element.nodeName !== '#comment' && $d5156037ad898a4d$var$isStyleVisible(element) && $d5156037ad898a4d$var$isAttributeVisible(element, childElement) && (!element.parentElement || $d5156037ad898a4d$export$e989c0fffaa6b27a(element.parentElement, element));
313
81
  }
314
82
 
315
- const $bdceb2956edbee43435a9382ef97283f$var$focusableElements = ['input:not([disabled]):not([type=hidden])', 'select:not([disabled])', 'textarea:not([disabled])', 'button:not([disabled])', 'a[href]', 'area[href]', 'summary', 'iframe', 'object', 'embed', 'audio[controls]', 'video[controls]', '[contenteditable]'];
316
- const $bdceb2956edbee43435a9382ef97283f$var$FOCUSABLE_ELEMENT_SELECTOR = $bdceb2956edbee43435a9382ef97283f$var$focusableElements.join(':not([hidden]),') + ',[tabindex]:not([disabled]):not([hidden])';
317
- $bdceb2956edbee43435a9382ef97283f$var$focusableElements.push('[tabindex]:not([tabindex="-1"]):not([disabled])');
318
- const $bdceb2956edbee43435a9382ef97283f$var$TABBABLE_ELEMENT_SELECTOR = $bdceb2956edbee43435a9382ef97283f$var$focusableElements.join(':not([hidden]):not([tabindex="-1"]),');
319
83
 
320
- function $bdceb2956edbee43435a9382ef97283f$var$getScopeRoot(scope) {
321
- return scope[0].parentElement;
322
- }
323
-
324
- function $bdceb2956edbee43435a9382ef97283f$var$useFocusContainment(scopeRef, contain) {
325
- let focusedNode = useRef();
326
- let raf = useRef(null);
327
- useLayoutEffect(() => {
328
- let scope = scopeRef.current;
329
-
330
- if (!contain) {
331
- return;
332
- } // Handle the Tab key to contain focus within the scope
333
-
334
-
335
- let onKeyDown = e => {
336
- if (e.key !== 'Tab' || e.altKey || e.ctrlKey || e.metaKey || scopeRef !== $bdceb2956edbee43435a9382ef97283f$var$activeScope) {
337
- return;
338
- }
339
-
340
- let focusedElement = document.activeElement;
341
- let scope = scopeRef.current;
342
-
343
- if (!$bdceb2956edbee43435a9382ef97283f$var$isElementInScope(focusedElement, scope)) {
344
- return;
345
- }
346
-
347
- let walker = getFocusableTreeWalker($bdceb2956edbee43435a9382ef97283f$var$getScopeRoot(scope), {
348
- tabbable: true
349
- }, scope);
350
- walker.currentNode = focusedElement;
351
- let nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
352
-
353
- if (!nextElement) {
354
- walker.currentNode = e.shiftKey ? scope[scope.length - 1].nextElementSibling : scope[0].previousElementSibling;
355
- nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
356
- }
357
84
 
358
- e.preventDefault();
359
85
 
360
- if (nextElement) {
361
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(nextElement, true);
362
- }
363
- };
364
-
365
- let onFocus = e => {
366
- // If focusing an element in a child scope of the currently active scope, the child becomes active.
367
- // Moving out of the active scope to an ancestor is not allowed.
368
- if (!$bdceb2956edbee43435a9382ef97283f$var$activeScope || $bdceb2956edbee43435a9382ef97283f$var$isAncestorScope($bdceb2956edbee43435a9382ef97283f$var$activeScope, scopeRef)) {
369
- $bdceb2956edbee43435a9382ef97283f$var$activeScope = scopeRef;
370
- focusedNode.current = e.target;
371
- } else if (scopeRef === $bdceb2956edbee43435a9382ef97283f$var$activeScope && !$bdceb2956edbee43435a9382ef97283f$var$isElementInChildScope(e.target, scopeRef)) {
372
- // If a focus event occurs outside the active scope (e.g. user tabs from browser location bar),
373
- // restore focus to the previously focused node or the first tabbable element in the active scope.
374
- if (focusedNode.current) {
375
- focusedNode.current.focus();
376
- } else if ($bdceb2956edbee43435a9382ef97283f$var$activeScope) {
377
- $bdceb2956edbee43435a9382ef97283f$var$focusFirstInScope($bdceb2956edbee43435a9382ef97283f$var$activeScope.current);
86
+ const $a7a032acae3ddda9$var$FocusContext = /*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).createContext(null);
87
+ let $a7a032acae3ddda9$var$activeScope = null;
88
+ let $a7a032acae3ddda9$var$scopes = new Map();
89
+ function $a7a032acae3ddda9$export$20e40289641fbbb6(props) {
90
+ let { children: children , contain: contain , restoreFocus: restoreFocus , autoFocus: autoFocus } = props;
91
+ let startRef = $aB6Cp$react.useRef();
92
+ let endRef = $aB6Cp$react.useRef();
93
+ let scopeRef = $aB6Cp$react.useRef([]);
94
+ let ctx = $aB6Cp$react.useContext($a7a032acae3ddda9$var$FocusContext);
95
+ let parentScope = ctx === null || ctx === void 0 ? void 0 : ctx.scopeRef;
96
+ $aB6Cp$reactariautils.useLayoutEffect(()=>{
97
+ // Find all rendered nodes between the sentinels and add them to the scope.
98
+ let node = startRef.current.nextSibling;
99
+ let nodes = [];
100
+ while(node && node !== endRef.current){
101
+ nodes.push(node);
102
+ node = node.nextSibling;
378
103
  }
379
- } else if (scopeRef === $bdceb2956edbee43435a9382ef97283f$var$activeScope) {
380
- focusedNode.current = e.target;
381
- }
382
- };
383
-
384
- let onBlur = e => {
385
- // Firefox doesn't shift focus back to the Dialog properly without this
386
- raf.current = requestAnimationFrame(() => {
387
- // Use document.activeElement instead of e.relatedTarget so we can tell if user clicked into iframe
388
- if (scopeRef === $bdceb2956edbee43435a9382ef97283f$var$activeScope && !$bdceb2956edbee43435a9382ef97283f$var$isElementInChildScope(document.activeElement, scopeRef)) {
389
- $bdceb2956edbee43435a9382ef97283f$var$activeScope = scopeRef;
390
- focusedNode.current = e.target;
391
- focusedNode.current.focus();
104
+ scopeRef.current = nodes;
105
+ }, [
106
+ children,
107
+ parentScope
108
+ ]);
109
+ $aB6Cp$reactariautils.useLayoutEffect(()=>{
110
+ $a7a032acae3ddda9$var$scopes.set(scopeRef, parentScope);
111
+ return ()=>{
112
+ // Restore the active scope on unmount if this scope or a descendant scope is active.
113
+ // Parent effect cleanups run before children, so we need to check if the
114
+ // parent scope actually still exists before restoring the active scope to it.
115
+ if ((scopeRef === $a7a032acae3ddda9$var$activeScope || $a7a032acae3ddda9$var$isAncestorScope(scopeRef, $a7a032acae3ddda9$var$activeScope)) && (!parentScope || $a7a032acae3ddda9$var$scopes.has(parentScope))) $a7a032acae3ddda9$var$activeScope = parentScope;
116
+ $a7a032acae3ddda9$var$scopes.delete(scopeRef);
117
+ };
118
+ }, [
119
+ scopeRef,
120
+ parentScope
121
+ ]);
122
+ $a7a032acae3ddda9$var$useFocusContainment(scopeRef, contain);
123
+ $a7a032acae3ddda9$var$useRestoreFocus(scopeRef, restoreFocus, contain);
124
+ $a7a032acae3ddda9$var$useAutoFocus(scopeRef, autoFocus);
125
+ let focusManager = $a7a032acae3ddda9$var$createFocusManagerForScope(scopeRef);
126
+ return(/*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).createElement($a7a032acae3ddda9$var$FocusContext.Provider, {
127
+ value: {
128
+ scopeRef: scopeRef,
129
+ focusManager: focusManager
130
+ }
131
+ }, /*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).createElement("span", {
132
+ "data-focus-scope-start": true,
133
+ hidden: true,
134
+ ref: startRef
135
+ }), children, /*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).createElement("span", {
136
+ "data-focus-scope-end": true,
137
+ hidden: true,
138
+ ref: endRef
139
+ })));
140
+ }
141
+ function $a7a032acae3ddda9$export$10c5169755ce7bd7() {
142
+ var ref;
143
+ return (ref = $aB6Cp$react.useContext($a7a032acae3ddda9$var$FocusContext)) === null || ref === void 0 ? void 0 : ref.focusManager;
144
+ }
145
+ function $a7a032acae3ddda9$var$createFocusManagerForScope(scopeRef) {
146
+ return {
147
+ focusNext (opts = {
148
+ }) {
149
+ let scope = scopeRef.current;
150
+ let { from: from , tabbable: tabbable , wrap: wrap } = opts;
151
+ let node = from || document.activeElement;
152
+ let sentinel = scope[0].previousElementSibling;
153
+ let walker = $a7a032acae3ddda9$export$2d6ec8fc375ceafa($a7a032acae3ddda9$var$getScopeRoot(scope), {
154
+ tabbable: tabbable
155
+ }, scope);
156
+ walker.currentNode = $a7a032acae3ddda9$var$isElementInScope(node, scope) ? node : sentinel;
157
+ let nextNode = walker.nextNode();
158
+ if (!nextNode && wrap) {
159
+ walker.currentNode = sentinel;
160
+ nextNode = walker.nextNode();
161
+ }
162
+ if (nextNode) $a7a032acae3ddda9$var$focusElement(nextNode, true);
163
+ return nextNode;
164
+ },
165
+ focusPrevious (opts = {
166
+ }) {
167
+ let scope = scopeRef.current;
168
+ let { from: from , tabbable: tabbable , wrap: wrap } = opts;
169
+ let node = from || document.activeElement;
170
+ let sentinel = scope[scope.length - 1].nextElementSibling;
171
+ let walker = $a7a032acae3ddda9$export$2d6ec8fc375ceafa($a7a032acae3ddda9$var$getScopeRoot(scope), {
172
+ tabbable: tabbable
173
+ }, scope);
174
+ walker.currentNode = $a7a032acae3ddda9$var$isElementInScope(node, scope) ? node : sentinel;
175
+ let previousNode = walker.previousNode();
176
+ if (!previousNode && wrap) {
177
+ walker.currentNode = sentinel;
178
+ previousNode = walker.previousNode();
179
+ }
180
+ if (previousNode) $a7a032acae3ddda9$var$focusElement(previousNode, true);
181
+ return previousNode;
182
+ },
183
+ focusFirst (opts = {
184
+ }) {
185
+ let scope = scopeRef.current;
186
+ let { tabbable: tabbable } = opts;
187
+ let walker = $a7a032acae3ddda9$export$2d6ec8fc375ceafa($a7a032acae3ddda9$var$getScopeRoot(scope), {
188
+ tabbable: tabbable
189
+ }, scope);
190
+ walker.currentNode = scope[0].previousElementSibling;
191
+ let nextNode = walker.nextNode();
192
+ if (nextNode) $a7a032acae3ddda9$var$focusElement(nextNode, true);
193
+ return nextNode;
194
+ },
195
+ focusLast (opts = {
196
+ }) {
197
+ let scope = scopeRef.current;
198
+ let { tabbable: tabbable } = opts;
199
+ let walker = $a7a032acae3ddda9$export$2d6ec8fc375ceafa($a7a032acae3ddda9$var$getScopeRoot(scope), {
200
+ tabbable: tabbable
201
+ }, scope);
202
+ walker.currentNode = scope[scope.length - 1].nextElementSibling;
203
+ let previousNode = walker.previousNode();
204
+ if (previousNode) $a7a032acae3ddda9$var$focusElement(previousNode, true);
205
+ return previousNode;
392
206
  }
393
- });
394
- };
395
-
396
- document.addEventListener('keydown', onKeyDown, false);
397
- document.addEventListener('focusin', onFocus, false);
398
- scope.forEach(element => element.addEventListener('focusin', onFocus, false));
399
- scope.forEach(element => element.addEventListener('focusout', onBlur, false));
400
- return () => {
401
- document.removeEventListener('keydown', onKeyDown, false);
402
- document.removeEventListener('focusin', onFocus, false);
403
- scope.forEach(element => element.removeEventListener('focusin', onFocus, false));
404
- scope.forEach(element => element.removeEventListener('focusout', onBlur, false));
405
207
  };
406
- }, [scopeRef, contain]); // eslint-disable-next-line arrow-body-style
407
-
408
- useEffect(() => {
409
- return () => cancelAnimationFrame(raf.current);
410
- }, [raf]);
411
208
  }
412
-
413
- function $bdceb2956edbee43435a9382ef97283f$var$isElementInAnyScope(element) {
414
- for (let scope of $bdceb2956edbee43435a9382ef97283f$var$scopes.keys()) {
415
- if ($bdceb2956edbee43435a9382ef97283f$var$isElementInScope(element, scope.current)) {
416
- return true;
417
- }
418
- }
419
-
420
- return false;
209
+ const $a7a032acae3ddda9$var$focusableElements = [
210
+ 'input:not([disabled]):not([type=hidden])',
211
+ 'select:not([disabled])',
212
+ 'textarea:not([disabled])',
213
+ 'button:not([disabled])',
214
+ 'a[href]',
215
+ 'area[href]',
216
+ 'summary',
217
+ 'iframe',
218
+ 'object',
219
+ 'embed',
220
+ 'audio[controls]',
221
+ 'video[controls]',
222
+ '[contenteditable]'
223
+ ];
224
+ const $a7a032acae3ddda9$var$FOCUSABLE_ELEMENT_SELECTOR = $a7a032acae3ddda9$var$focusableElements.join(':not([hidden]),') + ',[tabindex]:not([disabled]):not([hidden])';
225
+ $a7a032acae3ddda9$var$focusableElements.push('[tabindex]:not([tabindex="-1"]):not([disabled])');
226
+ const $a7a032acae3ddda9$var$TABBABLE_ELEMENT_SELECTOR = $a7a032acae3ddda9$var$focusableElements.join(':not([hidden]):not([tabindex="-1"]),');
227
+ function $a7a032acae3ddda9$var$getScopeRoot(scope) {
228
+ return scope[0].parentElement;
421
229
  }
422
-
423
- function $bdceb2956edbee43435a9382ef97283f$var$isElementInScope(element, scope) {
424
- return scope.some(node => node.contains(element));
230
+ function $a7a032acae3ddda9$var$useFocusContainment(scopeRef, contain) {
231
+ let focusedNode = $aB6Cp$react.useRef();
232
+ let raf = $aB6Cp$react.useRef(null);
233
+ $aB6Cp$reactariautils.useLayoutEffect(()=>{
234
+ let scope1 = scopeRef.current;
235
+ if (!contain) return;
236
+ // Handle the Tab key to contain focus within the scope
237
+ let onKeyDown = (e)=>{
238
+ if (e.key !== 'Tab' || e.altKey || e.ctrlKey || e.metaKey || scopeRef !== $a7a032acae3ddda9$var$activeScope) return;
239
+ let focusedElement = document.activeElement;
240
+ let scope = scopeRef.current;
241
+ if (!$a7a032acae3ddda9$var$isElementInScope(focusedElement, scope)) return;
242
+ let walker = $a7a032acae3ddda9$export$2d6ec8fc375ceafa($a7a032acae3ddda9$var$getScopeRoot(scope), {
243
+ tabbable: true
244
+ }, scope);
245
+ walker.currentNode = focusedElement;
246
+ let nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
247
+ if (!nextElement) {
248
+ walker.currentNode = e.shiftKey ? scope[scope.length - 1].nextElementSibling : scope[0].previousElementSibling;
249
+ nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
250
+ }
251
+ e.preventDefault();
252
+ if (nextElement) $a7a032acae3ddda9$var$focusElement(nextElement, true);
253
+ };
254
+ let onFocus = (e)=>{
255
+ // If focusing an element in a child scope of the currently active scope, the child becomes active.
256
+ // Moving out of the active scope to an ancestor is not allowed.
257
+ if (!$a7a032acae3ddda9$var$activeScope || $a7a032acae3ddda9$var$isAncestorScope($a7a032acae3ddda9$var$activeScope, scopeRef)) {
258
+ $a7a032acae3ddda9$var$activeScope = scopeRef;
259
+ focusedNode.current = e.target;
260
+ } else if (scopeRef === $a7a032acae3ddda9$var$activeScope && !$a7a032acae3ddda9$var$isElementInChildScope(e.target, scopeRef)) {
261
+ // If a focus event occurs outside the active scope (e.g. user tabs from browser location bar),
262
+ // restore focus to the previously focused node or the first tabbable element in the active scope.
263
+ if (focusedNode.current) focusedNode.current.focus();
264
+ else if ($a7a032acae3ddda9$var$activeScope) $a7a032acae3ddda9$var$focusFirstInScope($a7a032acae3ddda9$var$activeScope.current);
265
+ } else if (scopeRef === $a7a032acae3ddda9$var$activeScope) focusedNode.current = e.target;
266
+ };
267
+ let onBlur = (e)=>{
268
+ // Firefox doesn't shift focus back to the Dialog properly without this
269
+ raf.current = requestAnimationFrame(()=>{
270
+ // Use document.activeElement instead of e.relatedTarget so we can tell if user clicked into iframe
271
+ if (scopeRef === $a7a032acae3ddda9$var$activeScope && !$a7a032acae3ddda9$var$isElementInChildScope(document.activeElement, scopeRef)) {
272
+ $a7a032acae3ddda9$var$activeScope = scopeRef;
273
+ focusedNode.current = e.target;
274
+ focusedNode.current.focus();
275
+ }
276
+ });
277
+ };
278
+ document.addEventListener('keydown', onKeyDown, false);
279
+ document.addEventListener('focusin', onFocus, false);
280
+ scope1.forEach((element)=>element.addEventListener('focusin', onFocus, false)
281
+ );
282
+ scope1.forEach((element)=>element.addEventListener('focusout', onBlur, false)
283
+ );
284
+ return ()=>{
285
+ document.removeEventListener('keydown', onKeyDown, false);
286
+ document.removeEventListener('focusin', onFocus, false);
287
+ scope1.forEach((element)=>element.removeEventListener('focusin', onFocus, false)
288
+ );
289
+ scope1.forEach((element)=>element.removeEventListener('focusout', onBlur, false)
290
+ );
291
+ };
292
+ }, [
293
+ scopeRef,
294
+ contain
295
+ ]);
296
+ // eslint-disable-next-line arrow-body-style
297
+ $aB6Cp$react.useEffect(()=>{
298
+ return ()=>cancelAnimationFrame(raf.current)
299
+ ;
300
+ }, [
301
+ raf
302
+ ]);
425
303
  }
426
-
427
- function $bdceb2956edbee43435a9382ef97283f$var$isElementInChildScope(element, scope) {
428
- // node.contains in isElementInScope covers child scopes that are also DOM children,
429
- // but does not cover child scopes in portals.
430
- for (let s of $bdceb2956edbee43435a9382ef97283f$var$scopes.keys()) {
431
- if ((s === scope || $bdceb2956edbee43435a9382ef97283f$var$isAncestorScope(scope, s)) && $bdceb2956edbee43435a9382ef97283f$var$isElementInScope(element, s.current)) {
432
- return true;
304
+ function $a7a032acae3ddda9$var$isElementInAnyScope(element) {
305
+ for (let scope of $a7a032acae3ddda9$var$scopes.keys()){
306
+ if ($a7a032acae3ddda9$var$isElementInScope(element, scope.current)) return true;
433
307
  }
434
- }
435
-
436
- return false;
437
- }
438
-
439
- function $bdceb2956edbee43435a9382ef97283f$var$isAncestorScope(ancestor, scope) {
440
- let parent = $bdceb2956edbee43435a9382ef97283f$var$scopes.get(scope);
441
-
442
- if (!parent) {
443
308
  return false;
444
- }
445
-
446
- if (parent === ancestor) {
447
- return true;
448
- }
449
-
450
- return $bdceb2956edbee43435a9382ef97283f$var$isAncestorScope(ancestor, parent);
451
309
  }
452
-
453
- function $bdceb2956edbee43435a9382ef97283f$var$focusElement(element, scroll) {
454
- if (scroll === void 0) {
455
- scroll = false;
456
- }
457
-
458
- if (element != null && !scroll) {
459
- try {
460
- focusSafely(element);
461
- } catch (err) {// ignore
462
- }
463
- } else if (element != null) {
464
- try {
465
- element.focus();
466
- } catch (err) {// ignore
310
+ function $a7a032acae3ddda9$var$isElementInScope(element, scope) {
311
+ return scope.some((node)=>node.contains(element)
312
+ );
313
+ }
314
+ function $a7a032acae3ddda9$var$isElementInChildScope(element, scope) {
315
+ // node.contains in isElementInScope covers child scopes that are also DOM children,
316
+ // but does not cover child scopes in portals.
317
+ for (let s of $a7a032acae3ddda9$var$scopes.keys()){
318
+ if ((s === scope || $a7a032acae3ddda9$var$isAncestorScope(scope, s)) && $a7a032acae3ddda9$var$isElementInScope(element, s.current)) return true;
467
319
  }
468
- }
320
+ return false;
469
321
  }
470
-
471
- function $bdceb2956edbee43435a9382ef97283f$var$focusFirstInScope(scope) {
472
- let sentinel = scope[0].previousElementSibling;
473
- let walker = getFocusableTreeWalker($bdceb2956edbee43435a9382ef97283f$var$getScopeRoot(scope), {
474
- tabbable: true
475
- }, scope);
476
- walker.currentNode = sentinel;
477
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(walker.nextNode());
322
+ function $a7a032acae3ddda9$var$isAncestorScope(ancestor, scope) {
323
+ let parent = $a7a032acae3ddda9$var$scopes.get(scope);
324
+ if (!parent) return false;
325
+ if (parent === ancestor) return true;
326
+ return $a7a032acae3ddda9$var$isAncestorScope(ancestor, parent);
478
327
  }
479
-
480
- function $bdceb2956edbee43435a9382ef97283f$var$useAutoFocus(scopeRef, autoFocus) {
481
- const autoFocusRef = _react.useRef(autoFocus);
482
-
483
- useEffect(() => {
484
- if (autoFocusRef.current) {
485
- $bdceb2956edbee43435a9382ef97283f$var$activeScope = scopeRef;
486
-
487
- if (!$bdceb2956edbee43435a9382ef97283f$var$isElementInScope(document.activeElement, $bdceb2956edbee43435a9382ef97283f$var$activeScope.current)) {
488
- $bdceb2956edbee43435a9382ef97283f$var$focusFirstInScope(scopeRef.current);
489
- }
328
+ function $a7a032acae3ddda9$var$focusElement(element, scroll = false) {
329
+ if (element != null && !scroll) try {
330
+ $1c7f9157d722357d$export$80f3e147d781571c(element);
331
+ } catch (err) {
332
+ // ignore
490
333
  }
491
-
492
- autoFocusRef.current = false;
493
- }, []);
494
- }
495
-
496
- function $bdceb2956edbee43435a9382ef97283f$var$useRestoreFocus(scopeRef, restoreFocus, contain) {
497
- // useLayoutEffect instead of useEffect so the active element is saved synchronously instead of asynchronously.
498
- useLayoutEffect(() => {
499
- if (!restoreFocus) {
500
- return;
334
+ else if (element != null) try {
335
+ element.focus();
336
+ } catch (err1) {
337
+ // ignore
501
338
  }
502
-
503
- let scope = scopeRef.current;
504
- let nodeToRestore = document.activeElement; // Handle the Tab key so that tabbing out of the scope goes to the next element
505
- // after the node that had focus when the scope mounted. This is important when
506
- // using portals for overlays, so that focus goes to the expected element when
507
- // tabbing out of the overlay.
508
-
509
- let onKeyDown = e => {
510
- if (e.key !== 'Tab' || e.altKey || e.ctrlKey || e.metaKey) {
511
- return;
512
- }
513
-
514
- let focusedElement = document.activeElement;
515
-
516
- if (!$bdceb2956edbee43435a9382ef97283f$var$isElementInScope(focusedElement, scope)) {
517
- return;
518
- } // Create a DOM tree walker that matches all tabbable elements
519
-
520
-
521
- let walker = getFocusableTreeWalker(document.body, {
339
+ }
340
+ function $a7a032acae3ddda9$var$focusFirstInScope(scope) {
341
+ let sentinel = scope[0].previousElementSibling;
342
+ let walker = $a7a032acae3ddda9$export$2d6ec8fc375ceafa($a7a032acae3ddda9$var$getScopeRoot(scope), {
522
343
  tabbable: true
523
- }); // Find the next tabbable element after the currently focused element
524
-
525
- walker.currentNode = focusedElement;
526
- let nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
527
-
528
- if (!document.body.contains(nodeToRestore) || nodeToRestore === document.body) {
529
- nodeToRestore = null;
530
- } // If there is no next element, or it is outside the current scope, move focus to the
531
- // next element after the node to restore to instead.
532
-
533
-
534
- if ((!nextElement || !$bdceb2956edbee43435a9382ef97283f$var$isElementInScope(nextElement, scope)) && nodeToRestore) {
535
- walker.currentNode = nodeToRestore; // Skip over elements within the scope, in case the scope immediately follows the node to restore.
536
-
537
- do {
538
- nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
539
- } while ($bdceb2956edbee43435a9382ef97283f$var$isElementInScope(nextElement, scope));
540
-
541
- e.preventDefault();
542
- e.stopPropagation();
543
-
544
- if (nextElement) {
545
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(nextElement, true);
546
- } else {
547
- // If there is no next element and the nodeToRestore isn't within a FocusScope (i.e. we are leaving the top level focus scope)
548
- // then move focus to the body.
549
- // Otherwise restore focus to the nodeToRestore (e.g menu within a popover -> tabbing to close the menu should move focus to menu trigger)
550
- if (!$bdceb2956edbee43435a9382ef97283f$var$isElementInAnyScope(nodeToRestore)) {
551
- focusedElement.blur();
552
- } else {
553
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(nodeToRestore, true);
554
- }
344
+ }, scope);
345
+ walker.currentNode = sentinel;
346
+ $a7a032acae3ddda9$var$focusElement(walker.nextNode());
347
+ }
348
+ function $a7a032acae3ddda9$var$useAutoFocus(scopeRef, autoFocus) {
349
+ const autoFocusRef = ($parcel$interopDefault($aB6Cp$react)).useRef(autoFocus);
350
+ $aB6Cp$react.useEffect(()=>{
351
+ if (autoFocusRef.current) {
352
+ $a7a032acae3ddda9$var$activeScope = scopeRef;
353
+ if (!$a7a032acae3ddda9$var$isElementInScope(document.activeElement, $a7a032acae3ddda9$var$activeScope.current)) $a7a032acae3ddda9$var$focusFirstInScope(scopeRef.current);
555
354
  }
556
- }
557
- };
558
-
559
- if (!contain) {
560
- document.addEventListener('keydown', onKeyDown, true);
561
- }
562
-
563
- return () => {
564
- if (!contain) {
565
- document.removeEventListener('keydown', onKeyDown, true);
566
- }
567
-
568
- if (restoreFocus && nodeToRestore && $bdceb2956edbee43435a9382ef97283f$var$isElementInScope(document.activeElement, scope)) {
569
- requestAnimationFrame(() => {
570
- if (document.body.contains(nodeToRestore)) {
571
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(nodeToRestore);
572
- }
573
- });
574
- }
575
- };
576
- }, [scopeRef, restoreFocus, contain]);
355
+ autoFocusRef.current = false;
356
+ }, []);
577
357
  }
578
- /**
579
- * Create a [TreeWalker]{@link https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker}
580
- * that matches all focusable/tabbable elements.
581
- */
582
-
583
-
584
- function getFocusableTreeWalker(root, opts, scope) {
585
- let selector = opts != null && opts.tabbable ? $bdceb2956edbee43435a9382ef97283f$var$TABBABLE_ELEMENT_SELECTOR : $bdceb2956edbee43435a9382ef97283f$var$FOCUSABLE_ELEMENT_SELECTOR;
586
- let walker = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT, {
587
- acceptNode(node) {
588
- var _opts$from;
589
-
590
- // Skip nodes inside the starting node.
591
- if (opts != null && (_opts$from = opts.from) != null && _opts$from.contains(node)) {
592
- return NodeFilter.FILTER_REJECT;
593
- }
594
-
595
- if (node.matches(selector) && $f5b8109741a107bfe8bf4093e29$export$isElementVisible(node) && (!scope || $bdceb2956edbee43435a9382ef97283f$var$isElementInScope(node, scope))) {
596
- return NodeFilter.FILTER_ACCEPT;
597
- }
598
-
599
- return NodeFilter.FILTER_SKIP;
600
- }
601
-
602
- });
603
-
604
- if (opts != null && opts.from) {
605
- walker.currentNode = opts.from;
606
- }
607
-
608
- return walker;
358
+ function $a7a032acae3ddda9$var$useRestoreFocus(scopeRef, restoreFocus, contain) {
359
+ // create a ref during render instead of useLayoutEffect so the active element is saved before a child with autoFocus=true mounts.
360
+ const nodeToRestoreRef = $aB6Cp$react.useRef(typeof document !== 'undefined' ? document.activeElement : null);
361
+ // useLayoutEffect instead of useEffect so the active element is saved synchronously instead of asynchronously.
362
+ $aB6Cp$reactariautils.useLayoutEffect(()=>{
363
+ let nodeToRestore = nodeToRestoreRef.current;
364
+ if (!restoreFocus) return;
365
+ // Handle the Tab key so that tabbing out of the scope goes to the next element
366
+ // after the node that had focus when the scope mounted. This is important when
367
+ // using portals for overlays, so that focus goes to the expected element when
368
+ // tabbing out of the overlay.
369
+ let onKeyDown = (e)=>{
370
+ if (e.key !== 'Tab' || e.altKey || e.ctrlKey || e.metaKey) return;
371
+ let focusedElement = document.activeElement;
372
+ if (!$a7a032acae3ddda9$var$isElementInScope(focusedElement, scopeRef.current)) return;
373
+ // Create a DOM tree walker that matches all tabbable elements
374
+ let walker = $a7a032acae3ddda9$export$2d6ec8fc375ceafa(document.body, {
375
+ tabbable: true
376
+ });
377
+ // Find the next tabbable element after the currently focused element
378
+ walker.currentNode = focusedElement;
379
+ let nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
380
+ if (!document.body.contains(nodeToRestore) || nodeToRestore === document.body) nodeToRestore = null;
381
+ // If there is no next element, or it is outside the current scope, move focus to the
382
+ // next element after the node to restore to instead.
383
+ if ((!nextElement || !$a7a032acae3ddda9$var$isElementInScope(nextElement, scopeRef.current)) && nodeToRestore) {
384
+ walker.currentNode = nodeToRestore;
385
+ // Skip over elements within the scope, in case the scope immediately follows the node to restore.
386
+ do nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
387
+ while ($a7a032acae3ddda9$var$isElementInScope(nextElement, scopeRef.current))
388
+ e.preventDefault();
389
+ e.stopPropagation();
390
+ if (nextElement) $a7a032acae3ddda9$var$focusElement(nextElement, true);
391
+ 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)
392
+ // then move focus to the body.
393
+ // Otherwise restore focus to the nodeToRestore (e.g menu within a popover -> tabbing to close the menu should move focus to menu trigger)
394
+ if (!$a7a032acae3ddda9$var$isElementInAnyScope(nodeToRestore)) focusedElement.blur();
395
+ else $a7a032acae3ddda9$var$focusElement(nodeToRestore, true);
396
+ }
397
+ };
398
+ if (!contain) document.addEventListener('keydown', onKeyDown, true);
399
+ return ()=>{
400
+ if (!contain) document.removeEventListener('keydown', onKeyDown, true);
401
+ if (restoreFocus && nodeToRestore && $a7a032acae3ddda9$var$isElementInScope(document.activeElement, scopeRef.current)) requestAnimationFrame(()=>{
402
+ if (document.body.contains(nodeToRestore)) $a7a032acae3ddda9$var$focusElement(nodeToRestore);
403
+ });
404
+ };
405
+ }, [
406
+ scopeRef,
407
+ restoreFocus,
408
+ contain
409
+ ]);
609
410
  }
610
- /**
611
- * Creates a FocusManager object that can be used to move focus within an element.
612
- */
613
-
614
-
615
- exports.getFocusableTreeWalker = getFocusableTreeWalker;
616
-
617
- function createFocusManager(ref) {
618
- return {
619
- focusNext(opts) {
620
- if (opts === void 0) {
621
- opts = {};
622
- }
623
-
624
- let root = ref.current;
625
- let {
626
- from,
627
- tabbable,
628
- wrap
629
- } = opts;
630
- let node = from || document.activeElement;
631
- let walker = getFocusableTreeWalker(root, {
632
- tabbable
633
- });
634
-
635
- if (root.contains(node)) {
636
- walker.currentNode = node;
637
- }
638
-
639
- let nextNode = walker.nextNode();
640
-
641
- if (!nextNode && wrap) {
642
- walker.currentNode = root;
643
- nextNode = walker.nextNode();
644
- }
645
-
646
- if (nextNode) {
647
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(nextNode, true);
648
- }
649
-
650
- return nextNode;
651
- },
652
-
653
- focusPrevious(opts) {
654
- if (opts === void 0) {
655
- opts = {};
656
- }
657
-
658
- let root = ref.current;
659
- let {
660
- from,
661
- tabbable,
662
- wrap
663
- } = opts;
664
- let node = from || document.activeElement;
665
- let walker = getFocusableTreeWalker(root, {
666
- tabbable
667
- });
668
-
669
- if (root.contains(node)) {
670
- walker.currentNode = node;
671
- } else {
672
- let next = $bdceb2956edbee43435a9382ef97283f$var$last(walker);
673
-
674
- if (next) {
675
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(next, true);
411
+ function $a7a032acae3ddda9$export$2d6ec8fc375ceafa(root, opts, scope) {
412
+ let selector = (opts === null || opts === void 0 ? void 0 : opts.tabbable) ? $a7a032acae3ddda9$var$TABBABLE_ELEMENT_SELECTOR : $a7a032acae3ddda9$var$FOCUSABLE_ELEMENT_SELECTOR;
413
+ let walker = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT, {
414
+ acceptNode (node) {
415
+ var ref;
416
+ // Skip nodes inside the starting node.
417
+ if (opts === null || opts === void 0 ? void 0 : (ref = opts.from) === null || ref === void 0 ? void 0 : ref.contains(node)) return NodeFilter.FILTER_REJECT;
418
+ if (node.matches(selector) && $d5156037ad898a4d$export$e989c0fffaa6b27a(node) && (!scope || $a7a032acae3ddda9$var$isElementInScope(node, scope))) return NodeFilter.FILTER_ACCEPT;
419
+ return NodeFilter.FILTER_SKIP;
676
420
  }
421
+ });
422
+ if (opts === null || opts === void 0 ? void 0 : opts.from) walker.currentNode = opts.from;
423
+ return walker;
424
+ }
425
+ function $a7a032acae3ddda9$export$c5251b9e124bf29(ref) {
426
+ return {
427
+ focusNext (opts = {
428
+ }) {
429
+ let root = ref.current;
430
+ let { from: from , tabbable: tabbable , wrap: wrap } = opts;
431
+ let node = from || document.activeElement;
432
+ let walker = $a7a032acae3ddda9$export$2d6ec8fc375ceafa(root, {
433
+ tabbable: tabbable
434
+ });
435
+ if (root.contains(node)) walker.currentNode = node;
436
+ let nextNode = walker.nextNode();
437
+ if (!nextNode && wrap) {
438
+ walker.currentNode = root;
439
+ nextNode = walker.nextNode();
440
+ }
441
+ if (nextNode) $a7a032acae3ddda9$var$focusElement(nextNode, true);
442
+ return nextNode;
443
+ },
444
+ focusPrevious (opts = {
445
+ }) {
446
+ let root = ref.current;
447
+ let { from: from , tabbable: tabbable , wrap: wrap } = opts;
448
+ let node = from || document.activeElement;
449
+ let walker = $a7a032acae3ddda9$export$2d6ec8fc375ceafa(root, {
450
+ tabbable: tabbable
451
+ });
452
+ if (root.contains(node)) walker.currentNode = node;
453
+ else {
454
+ let next = $a7a032acae3ddda9$var$last(walker);
455
+ if (next) $a7a032acae3ddda9$var$focusElement(next, true);
456
+ return next;
457
+ }
458
+ let previousNode = walker.previousNode();
459
+ if (!previousNode && wrap) {
460
+ walker.currentNode = root;
461
+ previousNode = $a7a032acae3ddda9$var$last(walker);
462
+ }
463
+ if (previousNode) $a7a032acae3ddda9$var$focusElement(previousNode, true);
464
+ return previousNode;
465
+ },
466
+ focusFirst (opts = {
467
+ }) {
468
+ let root = ref.current;
469
+ let { tabbable: tabbable } = opts;
470
+ let walker = $a7a032acae3ddda9$export$2d6ec8fc375ceafa(root, {
471
+ tabbable: tabbable
472
+ });
473
+ let nextNode = walker.nextNode();
474
+ if (nextNode) $a7a032acae3ddda9$var$focusElement(nextNode, true);
475
+ return nextNode;
476
+ },
477
+ focusLast (opts = {
478
+ }) {
479
+ let root = ref.current;
480
+ let { tabbable: tabbable } = opts;
481
+ let walker = $a7a032acae3ddda9$export$2d6ec8fc375ceafa(root, {
482
+ tabbable: tabbable
483
+ });
484
+ let next = $a7a032acae3ddda9$var$last(walker);
485
+ if (next) $a7a032acae3ddda9$var$focusElement(next, true);
486
+ return next;
487
+ }
488
+ };
489
+ }
490
+ function $a7a032acae3ddda9$var$last(walker) {
491
+ let next;
492
+ let last;
493
+ do {
494
+ last = walker.lastChild();
495
+ if (last) next = last;
496
+ }while (last)
497
+ return next;
498
+ }
677
499
 
678
- return next;
679
- }
680
-
681
- let previousNode = walker.previousNode();
682
-
683
- if (!previousNode && wrap) {
684
- walker.currentNode = root;
685
- previousNode = $bdceb2956edbee43435a9382ef97283f$var$last(walker);
686
- }
687
500
 
688
- if (previousNode) {
689
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(previousNode, true);
690
- }
501
+ var $dfd8c70b928eb1b3$exports = {};
691
502
 
692
- return previousNode;
693
- },
503
+ $parcel$export($dfd8c70b928eb1b3$exports, "FocusRing", () => $dfd8c70b928eb1b3$export$1a38b4ad7f578e1d);
694
504
 
695
- focusFirst(opts) {
696
- if (opts === void 0) {
697
- opts = {};
698
- }
699
505
 
700
- let root = ref.current;
701
- let {
702
- tabbable
703
- } = opts;
704
- let walker = getFocusableTreeWalker(root, {
705
- tabbable
706
- });
707
- let nextNode = walker.nextNode();
708
-
709
- if (nextNode) {
710
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(nextNode, true);
711
- }
712
506
 
713
- return nextNode;
714
- },
507
+ var $581a96d6eb128c1b$exports = {};
715
508
 
716
- focusLast(opts) {
717
- if (opts === void 0) {
718
- opts = {};
719
- }
509
+ $parcel$export($581a96d6eb128c1b$exports, "useFocusRing", () => $581a96d6eb128c1b$export$4e328f61c538687f);
720
510
 
721
- let root = ref.current;
722
- let {
723
- tabbable
724
- } = opts;
725
- let walker = getFocusableTreeWalker(root, {
726
- tabbable
727
- });
728
- let next = $bdceb2956edbee43435a9382ef97283f$var$last(walker);
729
-
730
- if (next) {
731
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(next, true);
732
- }
733
511
 
734
- return next;
735
- }
736
512
 
737
- };
513
+ function $581a96d6eb128c1b$export$4e328f61c538687f(props = {
514
+ }) {
515
+ let { autoFocus: autoFocus = false , isTextInput: isTextInput , within: within } = props;
516
+ let state = $aB6Cp$react.useRef({
517
+ isFocused: false,
518
+ isFocusVisible: autoFocus || $aB6Cp$reactariainteractions.isFocusVisible()
519
+ }).current;
520
+ let [isFocused1, setFocused] = $aB6Cp$react.useState(false);
521
+ let [isFocusVisibleState, setFocusVisible] = $aB6Cp$react.useState(()=>state.isFocused && state.isFocusVisible
522
+ );
523
+ let updateState = ()=>setFocusVisible(state.isFocused && state.isFocusVisible)
524
+ ;
525
+ let onFocusChange = (isFocused)=>{
526
+ state.isFocused = isFocused;
527
+ setFocused(isFocused);
528
+ updateState();
529
+ };
530
+ $aB6Cp$reactariainteractions.useFocusVisibleListener((isFocusVisible)=>{
531
+ state.isFocusVisible = isFocusVisible;
532
+ updateState();
533
+ }, [], {
534
+ isTextInput: isTextInput
535
+ });
536
+ let { focusProps: focusProps } = $aB6Cp$reactariainteractions.useFocus({
537
+ isDisabled: within,
538
+ onFocusChange: onFocusChange
539
+ });
540
+ let { focusWithinProps: focusWithinProps } = $aB6Cp$reactariainteractions.useFocusWithin({
541
+ isDisabled: !within,
542
+ onFocusWithinChange: onFocusChange
543
+ });
544
+ return {
545
+ isFocused: isFocused1,
546
+ isFocusVisible: state.isFocused && isFocusVisibleState,
547
+ focusProps: within ? focusWithinProps : focusProps
548
+ };
738
549
  }
739
550
 
740
- exports.createFocusManager = createFocusManager;
741
551
 
742
- function $bdceb2956edbee43435a9382ef97283f$var$last(walker) {
743
- let next;
744
- let last;
745
-
746
- do {
747
- last = walker.lastChild();
748
-
749
- if (last) {
750
- next = last;
751
- }
752
- } while (last);
753
-
754
- return next;
552
+ function $dfd8c70b928eb1b3$export$1a38b4ad7f578e1d(props) {
553
+ let { children: children , focusClass: focusClass , focusRingClass: focusRingClass } = props;
554
+ let { isFocused: isFocused , isFocusVisible: isFocusVisible , focusProps: focusProps } = $581a96d6eb128c1b$export$4e328f61c538687f(props);
555
+ let child = ($parcel$interopDefault($aB6Cp$react)).Children.only(children);
556
+ return(/*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).cloneElement(child, $aB6Cp$reactariautils.mergeProps(child.props, {
557
+ ...focusProps,
558
+ className: ($parcel$interopDefault($aB6Cp$clsx))({
559
+ [focusClass || '']: isFocused,
560
+ [focusRingClass || '']: isFocusVisible
561
+ })
562
+ })));
755
563
  }
756
564
 
757
- /**
758
- * Determines whether a focus ring should be shown to indicate keyboard focus.
759
- * Focus rings are visible only when the user is interacting with a keyboard,
760
- * not with a mouse, touch, or other input methods.
761
- */
762
- function useFocusRing(props) {
763
- if (props === void 0) {
764
- props = {};
765
- }
766
-
767
- let {
768
- autoFocus = false,
769
- isTextInput,
770
- within
771
- } = props;
772
- let state = useRef({
773
- isFocused: false,
774
- isFocusVisible: autoFocus || _isFocusVisible()
775
- }).current;
776
- let [isFocused, setFocused] = useState(false);
777
- let [isFocusVisibleState, setFocusVisible] = useState(() => state.isFocused && state.isFocusVisible);
778
-
779
- let updateState = () => setFocusVisible(state.isFocused && state.isFocusVisible);
780
-
781
- let onFocusChange = isFocused => {
782
- state.isFocused = isFocused;
783
- setFocused(isFocused);
784
- updateState();
785
- };
786
-
787
- useFocusVisibleListener(isFocusVisible => {
788
- state.isFocusVisible = isFocusVisible;
789
- updateState();
790
- }, [], {
791
- isTextInput
792
- });
793
- let {
794
- focusProps
795
- } = useFocus({
796
- isDisabled: within,
797
- onFocusChange
798
- });
799
- let {
800
- focusWithinProps
801
- } = useFocusWithin({
802
- isDisabled: !within,
803
- onFocusWithinChange: onFocusChange
804
- });
805
- return {
806
- isFocused,
807
- isFocusVisible: state.isFocused && isFocusVisibleState,
808
- focusProps: within ? focusWithinProps : focusProps
809
- };
810
- }
811
-
812
- exports.useFocusRing = useFocusRing;
813
-
814
- /**
815
- * A utility component that applies a CSS class when an element has keyboard focus.
816
- * Focus rings are visible only when the user is interacting with a keyboard,
817
- * not with a mouse, touch, or other input methods.
818
- */
819
- function FocusRing(props) {
820
- let {
821
- children,
822
- focusClass,
823
- focusRingClass
824
- } = props;
825
- let {
826
- isFocused,
827
- isFocusVisible,
828
- focusProps
829
- } = useFocusRing(props);
830
-
831
- let child = _react.Children.only(children);
832
-
833
- return /*#__PURE__*/_react.cloneElement(child, mergeProps(child.props, _babelRuntimeHelpersExtends({}, focusProps, {
834
- className: _clsx({
835
- [focusClass || '']: isFocused,
836
- [focusRingClass || '']: isFocusVisible
837
- })
838
- })));
839
- }
840
565
 
841
- exports.FocusRing = FocusRing;
566
+ var $fb504d83237fd6ac$exports = {};
842
567
 
843
- let $f284cbc8bcdf616ffabe3d006e2c9db$var$FocusableContext = /*#__PURE__*/_react.createContext(null);
568
+ $parcel$export($fb504d83237fd6ac$exports, "FocusableProvider", () => $fb504d83237fd6ac$export$13f3202a3e5ddd5);
569
+ $parcel$export($fb504d83237fd6ac$exports, "useFocusable", () => $fb504d83237fd6ac$export$4c014de7c8940b4c);
844
570
 
845
- function $f284cbc8bcdf616ffabe3d006e2c9db$var$useFocusableContext(ref) {
846
- let context = useContext($f284cbc8bcdf616ffabe3d006e2c9db$var$FocusableContext) || {};
847
- useSyncRef(context, ref); // eslint-disable-next-line
848
571
 
849
- let otherProps = _babelRuntimeHelpersObjectWithoutPropertiesLoose(context, ["ref"]);
850
572
 
851
- return otherProps;
573
+ let $fb504d83237fd6ac$var$FocusableContext = /*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).createContext(null);
574
+ function $fb504d83237fd6ac$var$useFocusableContext(ref) {
575
+ let context = $aB6Cp$react.useContext($fb504d83237fd6ac$var$FocusableContext) || {
576
+ };
577
+ $aB6Cp$reactariautils.useSyncRef(context, ref);
578
+ // eslint-disable-next-line
579
+ let { ref: _ , ...otherProps } = context;
580
+ return otherProps;
852
581
  }
853
582
  /**
854
583
  * Provides DOM props to the nearest focusable child.
855
- */
856
-
857
-
858
- function $f284cbc8bcdf616ffabe3d006e2c9db$var$FocusableProvider(props, ref) {
859
- let {
860
- children
861
- } = props,
862
- otherProps = _babelRuntimeHelpersObjectWithoutPropertiesLoose(props, ["children"]);
863
-
864
- let context = _babelRuntimeHelpersExtends({}, otherProps, {
865
- ref
866
- });
867
-
868
- return /*#__PURE__*/_react.createElement($f284cbc8bcdf616ffabe3d006e2c9db$var$FocusableContext.Provider, {
869
- value: context
870
- }, children);
584
+ */ function $fb504d83237fd6ac$var$FocusableProvider(props, ref) {
585
+ let { children: children , ...otherProps } = props;
586
+ let context = {
587
+ ...otherProps,
588
+ ref: ref
589
+ };
590
+ return(/*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).createElement($fb504d83237fd6ac$var$FocusableContext.Provider, {
591
+ value: context
592
+ }, children));
593
+ }
594
+ let $fb504d83237fd6ac$export$13f3202a3e5ddd5 = /*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).forwardRef($fb504d83237fd6ac$var$FocusableProvider);
595
+ function $fb504d83237fd6ac$export$4c014de7c8940b4c(props, domRef) {
596
+ let { focusProps: focusProps } = $aB6Cp$reactariainteractions.useFocus(props);
597
+ let { keyboardProps: keyboardProps } = $aB6Cp$reactariainteractions.useKeyboard(props);
598
+ let interactions = $aB6Cp$reactariautils.mergeProps(focusProps, keyboardProps);
599
+ let domProps = $fb504d83237fd6ac$var$useFocusableContext(domRef);
600
+ let interactionProps = props.isDisabled ? {
601
+ } : domProps;
602
+ let autoFocusRef = $aB6Cp$react.useRef(props.autoFocus);
603
+ $aB6Cp$react.useEffect(()=>{
604
+ if (autoFocusRef.current && domRef.current) domRef.current.focus();
605
+ autoFocusRef.current = false;
606
+ }, []);
607
+ return {
608
+ focusableProps: $aB6Cp$reactariautils.mergeProps({
609
+ ...interactions,
610
+ tabIndex: props.excludeFromTabOrder && !props.isDisabled ? -1 : undefined
611
+ }, interactionProps)
612
+ };
871
613
  }
872
614
 
873
- let FocusableProvider = /*#__PURE__*/_react.forwardRef($f284cbc8bcdf616ffabe3d006e2c9db$var$FocusableProvider);
874
615
 
875
- exports.FocusableProvider = FocusableProvider;
876
616
 
877
- /**
878
- * Used to make an element focusable and capable of auto focus.
879
- */
880
- function useFocusable(props, domRef) {
881
- let {
882
- focusProps
883
- } = useFocus(props);
884
- let {
885
- keyboardProps
886
- } = useKeyboard(props);
887
- let interactions = mergeProps(focusProps, keyboardProps);
888
- let domProps = $f284cbc8bcdf616ffabe3d006e2c9db$var$useFocusableContext(domRef);
889
- let interactionProps = props.isDisabled ? {} : domProps;
890
- let autoFocusRef = useRef(props.autoFocus);
891
- useEffect(() => {
892
- if (autoFocusRef.current && domRef.current) {
893
- domRef.current.focus();
894
- }
895
617
 
896
- autoFocusRef.current = false;
897
- }, []);
898
- return {
899
- focusableProps: mergeProps(_babelRuntimeHelpersExtends({}, interactions, {
900
- tabIndex: props.excludeFromTabOrder && !props.isDisabled ? -1 : undefined
901
- }), interactionProps)
902
- };
903
- }
618
+ $parcel$exportWildcard(module.exports, $a7a032acae3ddda9$exports);
619
+ $parcel$exportWildcard(module.exports, $dfd8c70b928eb1b3$exports);
620
+ $parcel$exportWildcard(module.exports, $fb504d83237fd6ac$exports);
621
+ $parcel$exportWildcard(module.exports, $581a96d6eb128c1b$exports);
622
+ $parcel$exportWildcard(module.exports, $1c7f9157d722357d$exports);
623
+
904
624
 
905
- exports.useFocusable = useFocusable;
906
625
  //# sourceMappingURL=main.js.map