@react-aria/focus 3.4.0 → 3.5.2

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 $9ewW6$react = require("react");
2
+ var $9ewW6$reactariautils = require("@react-aria/utils");
3
+ var $9ewW6$reactariainteractions = require("@react-aria/interactions");
4
+ var $9ewW6$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 $81f01af19760c2bc$exports = {};
29
+
30
+ $parcel$export($81f01af19760c2bc$exports, "FocusScope", () => $81f01af19760c2bc$export$20e40289641fbbb6);
31
+ $parcel$export($81f01af19760c2bc$exports, "useFocusManager", () => $81f01af19760c2bc$export$10c5169755ce7bd7);
32
+ $parcel$export($81f01af19760c2bc$exports, "getFocusableTreeWalker", () => $81f01af19760c2bc$export$2d6ec8fc375ceafa);
33
+ $parcel$export($81f01af19760c2bc$exports, "createFocusManager", () => $81f01af19760c2bc$export$c5251b9e124bf29);
34
+ var $5d2399de34f67875$exports = {};
35
+
36
+ $parcel$export($5d2399de34f67875$exports, "focusSafely", () => $5d2399de34f67875$export$80f3e147d781571c);
37
+
38
+
39
+ function $5d2399de34f67875$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 ($9ewW6$reactariainteractions.getInteractionModality() === 'virtual') {
46
+ let lastFocusedElement = document.activeElement;
47
+ $9ewW6$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)) $9ewW6$reactariautils.focusWithoutScrolling(element);
50
+ });
51
+ } else $9ewW6$reactariautils.focusWithoutScrolling(element);
60
52
  }
61
53
 
62
- exports.focusSafely = focusSafely;
63
54
 
64
55
  /*
65
56
  * Copyright 2021 Adobe. All rights reserved.
@@ -71,683 +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 Set(); // 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
- useLayoutEffect(() => {
142
- // Find all rendered nodes between the sentinels and add them to the scope.
143
- let node = startRef.current.nextSibling;
144
- let nodes = [];
145
-
146
- while (node && node !== endRef.current) {
147
- nodes.push(node);
148
- node = node.nextSibling;
65
+ */ function $a56864d71a2d9ec3$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';
149
73
  }
150
-
151
- scopeRef.current = nodes;
152
- $bdceb2956edbee43435a9382ef97283f$var$scopes.add(scopeRef);
153
- return () => {
154
- $bdceb2956edbee43435a9382ef97283f$var$scopes.delete(scopeRef);
155
- };
156
- }, [children]);
157
- $bdceb2956edbee43435a9382ef97283f$var$useFocusContainment(scopeRef, contain);
158
- $bdceb2956edbee43435a9382ef97283f$var$useRestoreFocus(scopeRef, restoreFocus, contain);
159
- $bdceb2956edbee43435a9382ef97283f$var$useAutoFocus(scopeRef, autoFocus);
160
- let focusManager = $bdceb2956edbee43435a9382ef97283f$var$createFocusManagerForScope(scopeRef);
161
- return /*#__PURE__*/_react.createElement($bdceb2956edbee43435a9382ef97283f$var$FocusContext.Provider, {
162
- value: focusManager
163
- }, /*#__PURE__*/_react.createElement("span", {
164
- hidden: true,
165
- ref: startRef
166
- }), children, /*#__PURE__*/_react.createElement("span", {
167
- hidden: true,
168
- ref: endRef
169
- }));
74
+ return isVisible;
170
75
  }
171
- /**
172
- * Returns a FocusManager interface for the parent FocusScope.
173
- * A FocusManager can be used to programmatically move focus within
174
- * a FocusScope, e.g. in response to user events like keyboard navigation.
175
- */
176
-
177
-
178
- exports.FocusScope = FocusScope;
179
-
180
- function useFocusManager() {
181
- return useContext($bdceb2956edbee43435a9382ef97283f$var$FocusContext);
182
- }
183
-
184
- exports.useFocusManager = useFocusManager;
185
-
186
- function $bdceb2956edbee43435a9382ef97283f$var$createFocusManagerForScope(scopeRef) {
187
- return {
188
- focusNext(opts) {
189
- if (opts === void 0) {
190
- opts = {};
191
- }
192
-
193
- let scope = scopeRef.current;
194
- let {
195
- from,
196
- tabbable,
197
- wrap
198
- } = opts;
199
- let node = from || document.activeElement;
200
- let sentinel = scope[0].previousElementSibling;
201
- let walker = getFocusableTreeWalker($bdceb2956edbee43435a9382ef97283f$var$getScopeRoot(scope), {
202
- tabbable
203
- }, scope);
204
- walker.currentNode = $bdceb2956edbee43435a9382ef97283f$var$isElementInScope(node, scope) ? node : sentinel;
205
- let nextNode = walker.nextNode();
206
-
207
- if (!nextNode && wrap) {
208
- walker.currentNode = sentinel;
209
- nextNode = walker.nextNode();
210
- }
211
-
212
- if (nextNode) {
213
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(nextNode, true);
214
- }
215
-
216
- return nextNode;
217
- },
218
-
219
- focusPrevious(opts) {
220
- if (opts === void 0) {
221
- opts = {};
222
- }
223
-
224
- let scope = scopeRef.current;
225
- let {
226
- from,
227
- tabbable,
228
- wrap
229
- } = opts;
230
- let node = from || document.activeElement;
231
- let sentinel = scope[scope.length - 1].nextElementSibling;
232
- let walker = getFocusableTreeWalker($bdceb2956edbee43435a9382ef97283f$var$getScopeRoot(scope), {
233
- tabbable
234
- }, scope);
235
- walker.currentNode = $bdceb2956edbee43435a9382ef97283f$var$isElementInScope(node, scope) ? node : sentinel;
236
- let previousNode = walker.previousNode();
237
-
238
- if (!previousNode && wrap) {
239
- walker.currentNode = sentinel;
240
- previousNode = walker.previousNode();
241
- }
242
-
243
- if (previousNode) {
244
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(previousNode, true);
245
- }
246
-
247
- return previousNode;
248
- }
249
-
250
- };
76
+ function $a56864d71a2d9ec3$var$isAttributeVisible(element, childElement) {
77
+ return !element.hasAttribute('hidden') && (element.nodeName === 'DETAILS' && childElement && childElement.nodeName !== 'SUMMARY' ? element.hasAttribute('open') : true);
251
78
  }
252
-
253
- 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]'];
254
- const $bdceb2956edbee43435a9382ef97283f$var$FOCUSABLE_ELEMENT_SELECTOR = $bdceb2956edbee43435a9382ef97283f$var$focusableElements.join(':not([hidden]),') + ',[tabindex]:not([disabled]):not([hidden])';
255
- $bdceb2956edbee43435a9382ef97283f$var$focusableElements.push('[tabindex]:not([tabindex="-1"]):not([disabled])');
256
- const $bdceb2956edbee43435a9382ef97283f$var$TABBABLE_ELEMENT_SELECTOR = $bdceb2956edbee43435a9382ef97283f$var$focusableElements.join(':not([hidden]):not([tabindex="-1"]),');
257
-
258
- function $bdceb2956edbee43435a9382ef97283f$var$getScopeRoot(scope) {
259
- return scope[0].parentElement;
79
+ function $a56864d71a2d9ec3$export$e989c0fffaa6b27a(element, childElement) {
80
+ return element.nodeName !== '#comment' && $a56864d71a2d9ec3$var$isStyleVisible(element) && $a56864d71a2d9ec3$var$isAttributeVisible(element, childElement) && (!element.parentElement || $a56864d71a2d9ec3$export$e989c0fffaa6b27a(element.parentElement, element));
260
81
  }
261
82
 
262
- function $bdceb2956edbee43435a9382ef97283f$var$useFocusContainment(scopeRef, contain) {
263
- let focusedNode = useRef();
264
- let raf = useRef(null);
265
- useEffect(() => {
266
- let scope = scopeRef.current;
267
-
268
- if (!contain) {
269
- return;
270
- } // Handle the Tab key to contain focus within the scope
271
-
272
-
273
- let onKeyDown = e => {
274
- if (e.key !== 'Tab' || e.altKey || e.ctrlKey || e.metaKey) {
275
- return;
276
- }
277
-
278
- let focusedElement = document.activeElement;
279
-
280
- if (!$bdceb2956edbee43435a9382ef97283f$var$isElementInScope(focusedElement, scope)) {
281
- return;
282
- }
283
-
284
- let walker = getFocusableTreeWalker($bdceb2956edbee43435a9382ef97283f$var$getScopeRoot(scope), {
285
- tabbable: true
286
- }, scope);
287
- walker.currentNode = focusedElement;
288
- let nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
289
-
290
- if (!nextElement) {
291
- walker.currentNode = e.shiftKey ? scope[scope.length - 1].nextElementSibling : scope[0].previousElementSibling;
292
- nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
293
- }
294
-
295
- e.preventDefault();
296
83
 
297
- if (nextElement) {
298
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(nextElement, true);
299
- }
300
- };
301
84
 
302
- let onFocus = e => {
303
- // If a focus event occurs outside the active scope (e.g. user tabs from browser location bar),
304
- // restore focus to the previously focused node or the first tabbable element in the active scope.
305
- let isInAnyScope = $bdceb2956edbee43435a9382ef97283f$var$isElementInAnyScope(e.target, $bdceb2956edbee43435a9382ef97283f$var$scopes);
306
85
 
307
- if (!isInAnyScope) {
308
- if (focusedNode.current) {
309
- focusedNode.current.focus();
310
- } else if ($bdceb2956edbee43435a9382ef97283f$var$activeScope) {
311
- $bdceb2956edbee43435a9382ef97283f$var$focusFirstInScope($bdceb2956edbee43435a9382ef97283f$var$activeScope.current);
86
+ const $81f01af19760c2bc$var$FocusContext = /*#__PURE__*/ ($parcel$interopDefault($9ewW6$react)).createContext(null);
87
+ let $81f01af19760c2bc$var$activeScope = null;
88
+ let $81f01af19760c2bc$var$scopes = new Map();
89
+ function $81f01af19760c2bc$export$20e40289641fbbb6(props) {
90
+ let { children: children , contain: contain , restoreFocus: restoreFocus , autoFocus: autoFocus } = props;
91
+ let startRef = $9ewW6$react.useRef();
92
+ let endRef = $9ewW6$react.useRef();
93
+ let scopeRef = $9ewW6$react.useRef([]);
94
+ let ctx = $9ewW6$react.useContext($81f01af19760c2bc$var$FocusContext);
95
+ let parentScope = ctx === null || ctx === void 0 ? void 0 : ctx.scopeRef;
96
+ $9ewW6$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;
312
103
  }
313
- } else {
314
- $bdceb2956edbee43435a9382ef97283f$var$activeScope = scopeRef;
315
- focusedNode.current = e.target;
316
- }
317
- };
318
-
319
- let onBlur = e => {
320
- // Firefox doesn't shift focus back to the Dialog properly without this
321
- raf.current = requestAnimationFrame(() => {
322
- // Use document.activeElement instead of e.relatedTarget so we can tell if user clicked into iframe
323
- let isInAnyScope = $bdceb2956edbee43435a9382ef97283f$var$isElementInAnyScope(document.activeElement, $bdceb2956edbee43435a9382ef97283f$var$scopes);
324
-
325
- if (!isInAnyScope) {
326
- $bdceb2956edbee43435a9382ef97283f$var$activeScope = scopeRef;
327
- focusedNode.current = e.target;
328
- focusedNode.current.focus();
104
+ scopeRef.current = nodes;
105
+ }, [
106
+ children,
107
+ parentScope
108
+ ]);
109
+ $9ewW6$reactariautils.useLayoutEffect(()=>{
110
+ $81f01af19760c2bc$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 === $81f01af19760c2bc$var$activeScope || $81f01af19760c2bc$var$isAncestorScope(scopeRef, $81f01af19760c2bc$var$activeScope)) && (!parentScope || $81f01af19760c2bc$var$scopes.has(parentScope))) $81f01af19760c2bc$var$activeScope = parentScope;
116
+ $81f01af19760c2bc$var$scopes.delete(scopeRef);
117
+ };
118
+ }, [
119
+ scopeRef,
120
+ parentScope
121
+ ]);
122
+ $81f01af19760c2bc$var$useFocusContainment(scopeRef, contain);
123
+ $81f01af19760c2bc$var$useRestoreFocus(scopeRef, restoreFocus, contain);
124
+ $81f01af19760c2bc$var$useAutoFocus(scopeRef, autoFocus);
125
+ let focusManager = $81f01af19760c2bc$var$createFocusManagerForScope(scopeRef);
126
+ return(/*#__PURE__*/ ($parcel$interopDefault($9ewW6$react)).createElement($81f01af19760c2bc$var$FocusContext.Provider, {
127
+ value: {
128
+ scopeRef: scopeRef,
129
+ focusManager: focusManager
130
+ }
131
+ }, /*#__PURE__*/ ($parcel$interopDefault($9ewW6$react)).createElement("span", {
132
+ "data-focus-scope-start": true,
133
+ hidden: true,
134
+ ref: startRef
135
+ }), children, /*#__PURE__*/ ($parcel$interopDefault($9ewW6$react)).createElement("span", {
136
+ "data-focus-scope-end": true,
137
+ hidden: true,
138
+ ref: endRef
139
+ })));
140
+ }
141
+ function $81f01af19760c2bc$export$10c5169755ce7bd7() {
142
+ var ref;
143
+ return (ref = $9ewW6$react.useContext($81f01af19760c2bc$var$FocusContext)) === null || ref === void 0 ? void 0 : ref.focusManager;
144
+ }
145
+ function $81f01af19760c2bc$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 = $81f01af19760c2bc$export$2d6ec8fc375ceafa($81f01af19760c2bc$var$getScopeRoot(scope), {
154
+ tabbable: tabbable
155
+ }, scope);
156
+ walker.currentNode = $81f01af19760c2bc$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) $81f01af19760c2bc$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 = $81f01af19760c2bc$export$2d6ec8fc375ceafa($81f01af19760c2bc$var$getScopeRoot(scope), {
172
+ tabbable: tabbable
173
+ }, scope);
174
+ walker.currentNode = $81f01af19760c2bc$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) $81f01af19760c2bc$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 = $81f01af19760c2bc$export$2d6ec8fc375ceafa($81f01af19760c2bc$var$getScopeRoot(scope), {
188
+ tabbable: tabbable
189
+ }, scope);
190
+ walker.currentNode = scope[0].previousElementSibling;
191
+ let nextNode = walker.nextNode();
192
+ if (nextNode) $81f01af19760c2bc$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 = $81f01af19760c2bc$export$2d6ec8fc375ceafa($81f01af19760c2bc$var$getScopeRoot(scope), {
200
+ tabbable: tabbable
201
+ }, scope);
202
+ walker.currentNode = scope[scope.length - 1].nextElementSibling;
203
+ let previousNode = walker.previousNode();
204
+ if (previousNode) $81f01af19760c2bc$var$focusElement(previousNode, true);
205
+ return previousNode;
329
206
  }
330
- });
331
- };
332
-
333
- document.addEventListener('keydown', onKeyDown, false);
334
- document.addEventListener('focusin', onFocus, false);
335
- scope.forEach(element => element.addEventListener('focusin', onFocus, false));
336
- scope.forEach(element => element.addEventListener('focusout', onBlur, false));
337
- return () => {
338
- document.removeEventListener('keydown', onKeyDown, false);
339
- document.removeEventListener('focusin', onFocus, false);
340
- scope.forEach(element => element.removeEventListener('focusin', onFocus, false));
341
- scope.forEach(element => element.removeEventListener('focusout', onBlur, false));
342
207
  };
343
- }, [scopeRef, contain]); // eslint-disable-next-line arrow-body-style
344
-
345
- useEffect(() => {
346
- return () => cancelAnimationFrame(raf.current);
347
- }, [raf]);
348
208
  }
349
-
350
- function $bdceb2956edbee43435a9382ef97283f$var$isElementInAnyScope(element, scopes) {
351
- for (let scope of scopes.values()) {
352
- if ($bdceb2956edbee43435a9382ef97283f$var$isElementInScope(element, scope.current)) {
353
- return true;
354
- }
355
- }
356
-
357
- return false;
209
+ const $81f01af19760c2bc$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 $81f01af19760c2bc$var$FOCUSABLE_ELEMENT_SELECTOR = $81f01af19760c2bc$var$focusableElements.join(':not([hidden]),') + ',[tabindex]:not([disabled]):not([hidden])';
225
+ $81f01af19760c2bc$var$focusableElements.push('[tabindex]:not([tabindex="-1"]):not([disabled])');
226
+ const $81f01af19760c2bc$var$TABBABLE_ELEMENT_SELECTOR = $81f01af19760c2bc$var$focusableElements.join(':not([hidden]):not([tabindex="-1"]),');
227
+ function $81f01af19760c2bc$var$getScopeRoot(scope) {
228
+ return scope[0].parentElement;
358
229
  }
359
-
360
- function $bdceb2956edbee43435a9382ef97283f$var$isElementInScope(element, scope) {
361
- return scope.some(node => node.contains(element));
230
+ function $81f01af19760c2bc$var$useFocusContainment(scopeRef, contain) {
231
+ let focusedNode = $9ewW6$react.useRef();
232
+ let raf = $9ewW6$react.useRef(null);
233
+ $9ewW6$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 !== $81f01af19760c2bc$var$activeScope) return;
239
+ let focusedElement = document.activeElement;
240
+ let scope = scopeRef.current;
241
+ if (!$81f01af19760c2bc$var$isElementInScope(focusedElement, scope)) return;
242
+ let walker = $81f01af19760c2bc$export$2d6ec8fc375ceafa($81f01af19760c2bc$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) $81f01af19760c2bc$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 (!$81f01af19760c2bc$var$activeScope || $81f01af19760c2bc$var$isAncestorScope($81f01af19760c2bc$var$activeScope, scopeRef)) {
258
+ $81f01af19760c2bc$var$activeScope = scopeRef;
259
+ focusedNode.current = e.target;
260
+ } else if (scopeRef === $81f01af19760c2bc$var$activeScope && !$81f01af19760c2bc$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 ($81f01af19760c2bc$var$activeScope) $81f01af19760c2bc$var$focusFirstInScope($81f01af19760c2bc$var$activeScope.current);
265
+ } else if (scopeRef === $81f01af19760c2bc$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 === $81f01af19760c2bc$var$activeScope && !$81f01af19760c2bc$var$isElementInChildScope(document.activeElement, scopeRef)) {
272
+ $81f01af19760c2bc$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
+ $9ewW6$react.useEffect(()=>{
298
+ return ()=>cancelAnimationFrame(raf.current)
299
+ ;
300
+ }, [
301
+ raf
302
+ ]);
362
303
  }
363
-
364
- function $bdceb2956edbee43435a9382ef97283f$var$focusElement(element, scroll) {
365
- if (scroll === void 0) {
366
- scroll = false;
367
- }
368
-
369
- if (element != null && !scroll) {
370
- try {
371
- focusSafely(element);
372
- } catch (err) {// ignore
304
+ function $81f01af19760c2bc$var$isElementInAnyScope(element) {
305
+ for (let scope of $81f01af19760c2bc$var$scopes.keys()){
306
+ if ($81f01af19760c2bc$var$isElementInScope(element, scope.current)) return true;
373
307
  }
374
- } else if (element != null) {
375
- try {
376
- element.focus();
377
- } catch (err) {// ignore
308
+ return false;
309
+ }
310
+ function $81f01af19760c2bc$var$isElementInScope(element, scope) {
311
+ return scope.some((node)=>node.contains(element)
312
+ );
313
+ }
314
+ function $81f01af19760c2bc$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 $81f01af19760c2bc$var$scopes.keys()){
318
+ if ((s === scope || $81f01af19760c2bc$var$isAncestorScope(scope, s)) && $81f01af19760c2bc$var$isElementInScope(element, s.current)) return true;
378
319
  }
379
- }
320
+ return false;
380
321
  }
381
-
382
- function $bdceb2956edbee43435a9382ef97283f$var$focusFirstInScope(scope) {
383
- let sentinel = scope[0].previousElementSibling;
384
- let walker = getFocusableTreeWalker($bdceb2956edbee43435a9382ef97283f$var$getScopeRoot(scope), {
385
- tabbable: true
386
- }, scope);
387
- walker.currentNode = sentinel;
388
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(walker.nextNode());
322
+ function $81f01af19760c2bc$var$isAncestorScope(ancestor, scope) {
323
+ let parent = $81f01af19760c2bc$var$scopes.get(scope);
324
+ if (!parent) return false;
325
+ if (parent === ancestor) return true;
326
+ return $81f01af19760c2bc$var$isAncestorScope(ancestor, parent);
389
327
  }
390
-
391
- function $bdceb2956edbee43435a9382ef97283f$var$useAutoFocus(scopeRef, autoFocus) {
392
- useEffect(() => {
393
- if (autoFocus) {
394
- $bdceb2956edbee43435a9382ef97283f$var$activeScope = scopeRef;
395
-
396
- if (!$bdceb2956edbee43435a9382ef97283f$var$isElementInScope(document.activeElement, $bdceb2956edbee43435a9382ef97283f$var$activeScope.current)) {
397
- $bdceb2956edbee43435a9382ef97283f$var$focusFirstInScope(scopeRef.current);
398
- }
328
+ function $81f01af19760c2bc$var$focusElement(element, scroll = false) {
329
+ if (element != null && !scroll) try {
330
+ $5d2399de34f67875$export$80f3e147d781571c(element);
331
+ } catch (err) {
332
+ // ignore
333
+ }
334
+ else if (element != null) try {
335
+ element.focus();
336
+ } catch (err1) {
337
+ // ignore
399
338
  }
400
- }, [scopeRef, autoFocus]);
401
339
  }
402
-
403
- function $bdceb2956edbee43435a9382ef97283f$var$useRestoreFocus(scopeRef, restoreFocus, contain) {
404
- // useLayoutEffect instead of useEffect so the active element is saved synchronously instead of asynchronously.
405
- useLayoutEffect(() => {
406
- let scope = scopeRef.current;
407
- let nodeToRestore = document.activeElement; // Handle the Tab key so that tabbing out of the scope goes to the next element
408
- // after the node that had focus when the scope mounted. This is important when
409
- // using portals for overlays, so that focus goes to the expected element when
410
- // tabbing out of the overlay.
411
-
412
- let onKeyDown = e => {
413
- if (e.key !== 'Tab' || e.altKey || e.ctrlKey || e.metaKey) {
414
- return;
415
- }
416
-
417
- let focusedElement = document.activeElement;
418
-
419
- if (!$bdceb2956edbee43435a9382ef97283f$var$isElementInScope(focusedElement, scope)) {
420
- return;
421
- } // Create a DOM tree walker that matches all tabbable elements
422
-
423
-
424
- let walker = getFocusableTreeWalker(document.body, {
340
+ function $81f01af19760c2bc$var$focusFirstInScope(scope) {
341
+ let sentinel = scope[0].previousElementSibling;
342
+ let walker = $81f01af19760c2bc$export$2d6ec8fc375ceafa($81f01af19760c2bc$var$getScopeRoot(scope), {
425
343
  tabbable: true
426
- }); // Find the next tabbable element after the currently focused element
427
-
428
- walker.currentNode = focusedElement;
429
- let nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
430
-
431
- if (!document.body.contains(nodeToRestore) || nodeToRestore === document.body) {
432
- nodeToRestore = null;
433
- } // If there is no next element, or it is outside the current scope, move focus to the
434
- // next element after the node to restore to instead.
435
-
436
-
437
- if ((!nextElement || !$bdceb2956edbee43435a9382ef97283f$var$isElementInScope(nextElement, scope)) && nodeToRestore) {
438
- walker.currentNode = nodeToRestore; // Skip over elements within the scope, in case the scope immediately follows the node to restore.
439
-
440
- do {
441
- nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
442
- } while ($bdceb2956edbee43435a9382ef97283f$var$isElementInScope(nextElement, scope));
443
-
444
- e.preventDefault();
445
- e.stopPropagation();
446
-
447
- if (nextElement) {
448
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(nextElement, true);
449
- } else {
450
- // If there is no next element, blur the focused element to move focus to the body.
451
- focusedElement.blur();
344
+ }, scope);
345
+ walker.currentNode = sentinel;
346
+ $81f01af19760c2bc$var$focusElement(walker.nextNode());
347
+ }
348
+ function $81f01af19760c2bc$var$useAutoFocus(scopeRef, autoFocus) {
349
+ const autoFocusRef = ($parcel$interopDefault($9ewW6$react)).useRef(autoFocus);
350
+ $9ewW6$react.useEffect(()=>{
351
+ if (autoFocusRef.current) {
352
+ $81f01af19760c2bc$var$activeScope = scopeRef;
353
+ if (!$81f01af19760c2bc$var$isElementInScope(document.activeElement, $81f01af19760c2bc$var$activeScope.current)) $81f01af19760c2bc$var$focusFirstInScope(scopeRef.current);
354
+ }
355
+ autoFocusRef.current = false;
356
+ }, []);
357
+ }
358
+ function $81f01af19760c2bc$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 = $9ewW6$react.useRef(typeof document !== 'undefined' ? document.activeElement : null);
361
+ // useLayoutEffect instead of useEffect so the active element is saved synchronously instead of asynchronously.
362
+ $9ewW6$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 (!$81f01af19760c2bc$var$isElementInScope(focusedElement, scopeRef.current)) return;
373
+ // Create a DOM tree walker that matches all tabbable elements
374
+ let walker = $81f01af19760c2bc$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 || !$81f01af19760c2bc$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 ($81f01af19760c2bc$var$isElementInScope(nextElement, scopeRef.current))
388
+ e.preventDefault();
389
+ e.stopPropagation();
390
+ if (nextElement) $81f01af19760c2bc$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 (!$81f01af19760c2bc$var$isElementInAnyScope(nodeToRestore)) focusedElement.blur();
395
+ else $81f01af19760c2bc$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 && $81f01af19760c2bc$var$isElementInScope(document.activeElement, scopeRef.current)) requestAnimationFrame(()=>{
402
+ if (document.body.contains(nodeToRestore)) $81f01af19760c2bc$var$focusElement(nodeToRestore);
403
+ });
404
+ };
405
+ }, [
406
+ scopeRef,
407
+ restoreFocus,
408
+ contain
409
+ ]);
410
+ }
411
+ function $81f01af19760c2bc$export$2d6ec8fc375ceafa(root, opts, scope) {
412
+ let selector = (opts === null || opts === void 0 ? void 0 : opts.tabbable) ? $81f01af19760c2bc$var$TABBABLE_ELEMENT_SELECTOR : $81f01af19760c2bc$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) && $a56864d71a2d9ec3$export$e989c0fffaa6b27a(node) && (!scope || $81f01af19760c2bc$var$isElementInScope(node, scope))) return NodeFilter.FILTER_ACCEPT;
419
+ return NodeFilter.FILTER_SKIP;
420
+ }
421
+ });
422
+ if (opts === null || opts === void 0 ? void 0 : opts.from) walker.currentNode = opts.from;
423
+ return walker;
424
+ }
425
+ function $81f01af19760c2bc$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 = $81f01af19760c2bc$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) $81f01af19760c2bc$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 = $81f01af19760c2bc$export$2d6ec8fc375ceafa(root, {
450
+ tabbable: tabbable
451
+ });
452
+ if (root.contains(node)) walker.currentNode = node;
453
+ else {
454
+ let next = $81f01af19760c2bc$var$last(walker);
455
+ if (next) $81f01af19760c2bc$var$focusElement(next, true);
456
+ return next;
457
+ }
458
+ let previousNode = walker.previousNode();
459
+ if (!previousNode && wrap) {
460
+ walker.currentNode = root;
461
+ previousNode = $81f01af19760c2bc$var$last(walker);
462
+ }
463
+ if (previousNode) $81f01af19760c2bc$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 = $81f01af19760c2bc$export$2d6ec8fc375ceafa(root, {
471
+ tabbable: tabbable
472
+ });
473
+ let nextNode = walker.nextNode();
474
+ if (nextNode) $81f01af19760c2bc$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 = $81f01af19760c2bc$export$2d6ec8fc375ceafa(root, {
482
+ tabbable: tabbable
483
+ });
484
+ let next = $81f01af19760c2bc$var$last(walker);
485
+ if (next) $81f01af19760c2bc$var$focusElement(next, true);
486
+ return next;
452
487
  }
453
- }
454
- };
455
-
456
- if (!contain) {
457
- document.addEventListener('keydown', onKeyDown, true);
458
- }
459
-
460
- return () => {
461
- if (!contain) {
462
- document.removeEventListener('keydown', onKeyDown, true);
463
- }
464
-
465
- if (restoreFocus && nodeToRestore && $bdceb2956edbee43435a9382ef97283f$var$isElementInScope(document.activeElement, scope)) {
466
- requestAnimationFrame(() => {
467
- if (document.body.contains(nodeToRestore)) {
468
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(nodeToRestore);
469
- }
470
- });
471
- }
472
488
  };
473
- }, [scopeRef, restoreFocus, contain]);
474
489
  }
475
- /**
476
- * Create a [TreeWalker]{@link https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker}
477
- * that matches all focusable/tabbable elements.
478
- */
479
-
480
-
481
- function getFocusableTreeWalker(root, opts, scope) {
482
- let selector = opts != null && opts.tabbable ? $bdceb2956edbee43435a9382ef97283f$var$TABBABLE_ELEMENT_SELECTOR : $bdceb2956edbee43435a9382ef97283f$var$FOCUSABLE_ELEMENT_SELECTOR;
483
- let walker = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT, {
484
- acceptNode(node) {
485
- var _opts$from;
486
-
487
- // Skip nodes inside the starting node.
488
- if (opts != null && (_opts$from = opts.from) != null && _opts$from.contains(node)) {
489
- return NodeFilter.FILTER_REJECT;
490
- }
491
-
492
- if (node.matches(selector) && $f5b8109741a107bfe8bf4093e29$export$isElementVisible(node) && (!scope || $bdceb2956edbee43435a9382ef97283f$var$isElementInScope(node, scope))) {
493
- return NodeFilter.FILTER_ACCEPT;
494
- }
495
-
496
- return NodeFilter.FILTER_SKIP;
497
- }
498
-
499
- });
500
-
501
- if (opts != null && opts.from) {
502
- walker.currentNode = opts.from;
503
- }
504
-
505
- return walker;
490
+ function $81f01af19760c2bc$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;
506
498
  }
507
- /**
508
- * Creates a FocusManager object that can be used to move focus within an element.
509
- */
510
-
511
-
512
- exports.getFocusableTreeWalker = getFocusableTreeWalker;
513
499
 
514
- function createFocusManager(ref) {
515
- return {
516
- focusNext(opts) {
517
- if (opts === void 0) {
518
- opts = {};
519
- }
520
-
521
- let root = ref.current;
522
- let {
523
- from,
524
- tabbable,
525
- wrap
526
- } = opts;
527
- let node = from || document.activeElement;
528
- let walker = getFocusableTreeWalker(root, {
529
- tabbable
530
- });
531
-
532
- if (root.contains(node)) {
533
- walker.currentNode = node;
534
- }
535
500
 
536
- let nextNode = walker.nextNode();
501
+ var $b69c3d2bb4e1879d$exports = {};
537
502
 
538
- if (!nextNode && wrap) {
539
- walker.currentNode = root;
540
- nextNode = walker.nextNode();
541
- }
503
+ $parcel$export($b69c3d2bb4e1879d$exports, "FocusRing", () => $b69c3d2bb4e1879d$export$1a38b4ad7f578e1d);
542
504
 
543
- if (nextNode) {
544
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(nextNode, true);
545
- }
546
505
 
547
- return nextNode;
548
- },
549
506
 
550
- focusPrevious(opts) {
551
- if (opts === void 0) {
552
- opts = {};
553
- }
507
+ var $0c85563baefded4a$exports = {};
554
508
 
555
- let root = ref.current;
556
- let {
557
- from,
558
- tabbable,
559
- wrap
560
- } = opts;
561
- let node = from || document.activeElement;
562
- let walker = getFocusableTreeWalker(root, {
563
- tabbable
564
- });
565
-
566
- if (root.contains(node)) {
567
- walker.currentNode = node;
568
- } else {
569
- let next = $bdceb2956edbee43435a9382ef97283f$var$last(walker);
570
-
571
- if (next) {
572
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(next, true);
573
- }
509
+ $parcel$export($0c85563baefded4a$exports, "useFocusRing", () => $0c85563baefded4a$export$4e328f61c538687f);
574
510
 
575
- return next;
576
- }
577
511
 
578
- let previousNode = walker.previousNode();
579
512
 
580
- if (!previousNode && wrap) {
581
- walker.currentNode = root;
582
- previousNode = $bdceb2956edbee43435a9382ef97283f$var$last(walker);
583
- }
584
-
585
- if (previousNode) {
586
- $bdceb2956edbee43435a9382ef97283f$var$focusElement(previousNode, true);
587
- }
588
-
589
- return previousNode;
590
- }
591
-
592
- };
513
+ function $0c85563baefded4a$export$4e328f61c538687f(props = {
514
+ }) {
515
+ let { autoFocus: autoFocus = false , isTextInput: isTextInput , within: within } = props;
516
+ let state = $9ewW6$react.useRef({
517
+ isFocused: false,
518
+ isFocusVisible: autoFocus || $9ewW6$reactariainteractions.isFocusVisible()
519
+ }).current;
520
+ let [isFocused1, setFocused] = $9ewW6$react.useState(false);
521
+ let [isFocusVisibleState, setFocusVisible] = $9ewW6$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
+ $9ewW6$reactariainteractions.useFocusVisibleListener((isFocusVisible)=>{
531
+ state.isFocusVisible = isFocusVisible;
532
+ updateState();
533
+ }, [], {
534
+ isTextInput: isTextInput
535
+ });
536
+ let { focusProps: focusProps } = $9ewW6$reactariainteractions.useFocus({
537
+ isDisabled: within,
538
+ onFocusChange: onFocusChange
539
+ });
540
+ let { focusWithinProps: focusWithinProps } = $9ewW6$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
+ };
593
549
  }
594
550
 
595
- exports.createFocusManager = createFocusManager;
596
-
597
- function $bdceb2956edbee43435a9382ef97283f$var$last(walker) {
598
- let next;
599
- let last;
600
551
 
601
- do {
602
- last = walker.lastChild();
603
-
604
- if (last) {
605
- next = last;
606
- }
607
- } while (last);
608
-
609
- return next;
552
+ function $b69c3d2bb4e1879d$export$1a38b4ad7f578e1d(props) {
553
+ let { children: children , focusClass: focusClass , focusRingClass: focusRingClass } = props;
554
+ let { isFocused: isFocused , isFocusVisible: isFocusVisible , focusProps: focusProps } = $0c85563baefded4a$export$4e328f61c538687f(props);
555
+ let child = ($parcel$interopDefault($9ewW6$react)).Children.only(children);
556
+ return(/*#__PURE__*/ ($parcel$interopDefault($9ewW6$react)).cloneElement(child, $9ewW6$reactariautils.mergeProps(child.props, {
557
+ ...focusProps,
558
+ className: ($parcel$interopDefault($9ewW6$clsx))({
559
+ [focusClass || '']: isFocused,
560
+ [focusRingClass || '']: isFocusVisible
561
+ })
562
+ })));
610
563
  }
611
564
 
612
- /**
613
- * Determines whether a focus ring should be shown to indicate keyboard focus.
614
- * Focus rings are visible only when the user is interacting with a keyboard,
615
- * not with a mouse, touch, or other input methods.
616
- */
617
- function useFocusRing(props) {
618
- if (props === void 0) {
619
- props = {};
620
- }
621
-
622
- let {
623
- autoFocus = false,
624
- isTextInput,
625
- within
626
- } = props;
627
- let state = useRef({
628
- isFocused: false,
629
- isFocusVisible: autoFocus || _isFocusVisible()
630
- }).current;
631
- let [isFocusVisibleState, setFocusVisible] = useState(() => state.isFocused && state.isFocusVisible);
632
-
633
- let updateState = () => setFocusVisible(state.isFocused && state.isFocusVisible);
634
-
635
- let onFocusChange = isFocused => {
636
- state.isFocused = isFocused;
637
- updateState();
638
- };
639
-
640
- useFocusVisibleListener(isFocusVisible => {
641
- state.isFocusVisible = isFocusVisible;
642
- updateState();
643
- }, [], {
644
- isTextInput
645
- });
646
- let {
647
- focusProps
648
- } = useFocus({
649
- isDisabled: within,
650
- onFocusChange
651
- });
652
- let {
653
- focusWithinProps
654
- } = useFocusWithin({
655
- isDisabled: !within,
656
- onFocusWithinChange: onFocusChange
657
- });
658
- return {
659
- isFocused: state.isFocused,
660
- isFocusVisible: state.isFocused && isFocusVisibleState,
661
- focusProps: within ? focusWithinProps : focusProps
662
- };
663
- }
664
565
 
665
- exports.useFocusRing = useFocusRing;
566
+ var $a6d2890e204970f2$exports = {};
666
567
 
667
- /**
668
- * A utility component that applies a CSS class when an element has keyboard focus.
669
- * Focus rings are visible only when the user is interacting with a keyboard,
670
- * not with a mouse, touch, or other input methods.
671
- */
672
- function FocusRing(props) {
673
- let {
674
- children,
675
- focusClass,
676
- focusRingClass
677
- } = props;
678
- let {
679
- isFocused,
680
- isFocusVisible,
681
- focusProps
682
- } = useFocusRing(props);
683
-
684
- let child = _react.Children.only(children);
685
-
686
- return /*#__PURE__*/_react.cloneElement(child, mergeProps(child.props, _babelRuntimeHelpersExtends({}, focusProps, {
687
- className: _clsx({
688
- [focusClass || '']: isFocused,
689
- [focusRingClass || '']: isFocusVisible
690
- })
691
- })));
692
- }
568
+ $parcel$export($a6d2890e204970f2$exports, "FocusableProvider", () => $a6d2890e204970f2$export$13f3202a3e5ddd5);
569
+ $parcel$export($a6d2890e204970f2$exports, "useFocusable", () => $a6d2890e204970f2$export$4c014de7c8940b4c);
693
570
 
694
- exports.FocusRing = FocusRing;
695
571
 
696
- let $f284cbc8bcdf616ffabe3d006e2c9db$var$FocusableContext = /*#__PURE__*/_react.createContext(null);
697
572
 
698
- function $f284cbc8bcdf616ffabe3d006e2c9db$var$useFocusableContext(ref) {
699
- let context = useContext($f284cbc8bcdf616ffabe3d006e2c9db$var$FocusableContext) || {};
700
- useSyncRef(context, ref);
701
- return context;
573
+ let $a6d2890e204970f2$var$FocusableContext = /*#__PURE__*/ ($parcel$interopDefault($9ewW6$react)).createContext(null);
574
+ function $a6d2890e204970f2$var$useFocusableContext(ref) {
575
+ let context = $9ewW6$react.useContext($a6d2890e204970f2$var$FocusableContext) || {
576
+ };
577
+ $9ewW6$reactariautils.useSyncRef(context, ref);
578
+ // eslint-disable-next-line
579
+ let { ref: _ , ...otherProps } = context;
580
+ return otherProps;
702
581
  }
703
582
  /**
704
583
  * Provides DOM props to the nearest focusable child.
705
- */
584
+ */ function $a6d2890e204970f2$var$FocusableProvider(props, ref) {
585
+ let { children: children , ...otherProps } = props;
586
+ let context = {
587
+ ...otherProps,
588
+ ref: ref
589
+ };
590
+ return(/*#__PURE__*/ ($parcel$interopDefault($9ewW6$react)).createElement($a6d2890e204970f2$var$FocusableContext.Provider, {
591
+ value: context
592
+ }, children));
593
+ }
594
+ let $a6d2890e204970f2$export$13f3202a3e5ddd5 = /*#__PURE__*/ ($parcel$interopDefault($9ewW6$react)).forwardRef($a6d2890e204970f2$var$FocusableProvider);
595
+ function $a6d2890e204970f2$export$4c014de7c8940b4c(props, domRef) {
596
+ let { focusProps: focusProps } = $9ewW6$reactariainteractions.useFocus(props);
597
+ let { keyboardProps: keyboardProps } = $9ewW6$reactariainteractions.useKeyboard(props);
598
+ let interactions = $9ewW6$reactariautils.mergeProps(focusProps, keyboardProps);
599
+ let domProps = $a6d2890e204970f2$var$useFocusableContext(domRef);
600
+ let interactionProps = props.isDisabled ? {
601
+ } : domProps;
602
+ let autoFocusRef = $9ewW6$react.useRef(props.autoFocus);
603
+ $9ewW6$react.useEffect(()=>{
604
+ if (autoFocusRef.current && domRef.current) domRef.current.focus();
605
+ autoFocusRef.current = false;
606
+ }, []);
607
+ return {
608
+ focusableProps: $9ewW6$reactariautils.mergeProps({
609
+ ...interactions,
610
+ tabIndex: props.excludeFromTabOrder && !props.isDisabled ? -1 : undefined
611
+ }, interactionProps)
612
+ };
613
+ }
706
614
 
707
615
 
708
- function $f284cbc8bcdf616ffabe3d006e2c9db$var$FocusableProvider(props, ref) {
709
- let {
710
- children
711
- } = props,
712
- otherProps = _babelRuntimeHelpersObjectWithoutPropertiesLoose(props, ["children"]);
713
616
 
714
- let context = _babelRuntimeHelpersExtends({}, otherProps, {
715
- ref
716
- });
717
617
 
718
- return /*#__PURE__*/_react.createElement($f284cbc8bcdf616ffabe3d006e2c9db$var$FocusableContext.Provider, {
719
- value: context
720
- }, children);
721
- }
618
+ $parcel$exportWildcard(module.exports, $81f01af19760c2bc$exports);
619
+ $parcel$exportWildcard(module.exports, $b69c3d2bb4e1879d$exports);
620
+ $parcel$exportWildcard(module.exports, $a6d2890e204970f2$exports);
621
+ $parcel$exportWildcard(module.exports, $0c85563baefded4a$exports);
622
+ $parcel$exportWildcard(module.exports, $5d2399de34f67875$exports);
722
623
 
723
- let FocusableProvider = /*#__PURE__*/_react.forwardRef($f284cbc8bcdf616ffabe3d006e2c9db$var$FocusableProvider);
724
-
725
- exports.FocusableProvider = FocusableProvider;
726
-
727
- /**
728
- * Used to make an element focusable and capable of auto focus.
729
- */
730
- function useFocusable(props, domRef) {
731
- let {
732
- focusProps
733
- } = useFocus(props);
734
- let {
735
- keyboardProps
736
- } = useKeyboard(props);
737
- let interactions = mergeProps(focusProps, keyboardProps);
738
- let domProps = $f284cbc8bcdf616ffabe3d006e2c9db$var$useFocusableContext(domRef);
739
- let interactionProps = props.isDisabled ? {} : domProps;
740
- useEffect(() => {
741
- if (props.autoFocus && domRef.current) {
742
- domRef.current.focus();
743
- }
744
- }, [props.autoFocus, domRef]);
745
- return {
746
- focusableProps: mergeProps(_babelRuntimeHelpersExtends({}, interactions, {
747
- tabIndex: props.excludeFromTabOrder && !props.isDisabled ? -1 : undefined
748
- }), interactionProps)
749
- };
750
- }
751
624
 
752
- exports.useFocusable = useFocusable;
753
625
  //# sourceMappingURL=main.js.map