@react-aria/focus 3.10.0 → 3.11.0

package/dist/main.js

@@ -1,3 +1,4 @@
+var $aB6Cp$swchelperslib_define_propertyjs = require("@swc/helpers/lib/_define_property.js");
 var $aB6Cp$react = require("react");
 var $aB6Cp$reactariautils = require("@react-aria/utils");
 var $aB6Cp$reactariainteractions = require("@react-aria/interactions");
@@ -20,7 +21,38 @@ $parcel$export(module.exports, "FocusableProvider", () => $fb504d83237fd6ac$expo
 $parcel$export(module.exports, "useFocusable", () => $fb504d83237fd6ac$export$4c014de7c8940b4c);
 $parcel$export(module.exports, "useFocusRing", () => $581a96d6eb128c1b$export$4e328f61c538687f);
 $parcel$export(module.exports, "focusSafely", () => $1c7f9157d722357d$export$80f3e147d781571c);
-
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ /*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ 
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the 'License');
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an 'AS IS' BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ 
 
 function $1c7f9157d722357d$export$80f3e147d781571c(element) {
     // If the user is interacting with a virtual cursor, e.g. screen reader, then
@@ -28,13 +60,13 @@ function $1c7f9157d722357d$export$80f3e147d781571c(element) {
     // the page before shifting focus. This avoids issues with VoiceOver on iOS
     // causing the page to scroll when moving focus if the element is transitioning
     // from off the screen.
-    if ($aB6Cp$reactariainteractions.getInteractionModality() === 'virtual') {
+    if ((0, $aB6Cp$reactariainteractions.getInteractionModality)() === "virtual") {
         let lastFocusedElement = document.activeElement;
-        $aB6Cp$reactariautils.runAfterTransition(()=>{
+        (0, $aB6Cp$reactariautils.runAfterTransition)(()=>{
             // If focus did not move and the element is still in the document, focus it.
-            if (document.activeElement === lastFocusedElement && document.contains(element)) $aB6Cp$reactariautils.focusWithoutScrolling(element);
+            if (document.activeElement === lastFocusedElement && document.contains(element)) (0, $aB6Cp$reactariautils.focusWithoutScrolling)(element);
         });
-    } else $aB6Cp$reactariautils.focusWithoutScrolling(element);
+    } else (0, $aB6Cp$reactariautils.focusWithoutScrolling)(element);
 }
 
 
@@ -51,42 +83,62 @@ function $1c7f9157d722357d$export$80f3e147d781571c(element) {
  */ function $d5156037ad898a4d$var$isStyleVisible(element) {
     if (!(element instanceof HTMLElement) && !(element instanceof SVGElement)) return false;
     let { display: display , visibility: visibility  } = element.style;
-    let isVisible = display !== 'none' && visibility !== 'hidden' && visibility !== 'collapse';
+    let isVisible = display !== "none" && visibility !== "hidden" && visibility !== "collapse";
     if (isVisible) {
         const { getComputedStyle: getComputedStyle  } = element.ownerDocument.defaultView;
         let { display: computedDisplay , visibility: computedVisibility  } = getComputedStyle(element);
-        isVisible = computedDisplay !== 'none' && computedVisibility !== 'hidden' && computedVisibility !== 'collapse';
+        isVisible = computedDisplay !== "none" && computedVisibility !== "hidden" && computedVisibility !== "collapse";
     }
     return isVisible;
 }
 function $d5156037ad898a4d$var$isAttributeVisible(element, childElement) {
-    return !element.hasAttribute('hidden') && (element.nodeName === 'DETAILS' && childElement && childElement.nodeName !== 'SUMMARY' ? element.hasAttribute('open') : true);
+    return !element.hasAttribute("hidden") && (element.nodeName === "DETAILS" && childElement && childElement.nodeName !== "SUMMARY" ? element.hasAttribute("open") : true);
 }
 function $d5156037ad898a4d$export$e989c0fffaa6b27a(element, childElement) {
-    return element.nodeName !== '#comment' && $d5156037ad898a4d$var$isStyleVisible(element) && $d5156037ad898a4d$var$isAttributeVisible(element, childElement) && (!element.parentElement || $d5156037ad898a4d$export$e989c0fffaa6b27a(element.parentElement, element));
+    return element.nodeName !== "#comment" && $d5156037ad898a4d$var$isStyleVisible(element) && $d5156037ad898a4d$var$isAttributeVisible(element, childElement) && (!element.parentElement || $d5156037ad898a4d$export$e989c0fffaa6b27a(element.parentElement, element));
 }
 
 
 
 
-const $a7a032acae3ddda9$var$FocusContext = /*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).createContext(null);
+const $a7a032acae3ddda9$var$FocusContext = /*#__PURE__*/ (0, ($parcel$interopDefault($aB6Cp$react))).createContext(null);
 let $a7a032acae3ddda9$var$activeScope = null;
 function $a7a032acae3ddda9$export$20e40289641fbbb6(props) {
     let { children: children , contain: contain , restoreFocus: restoreFocus , autoFocus: autoFocus  } = props;
-    let startRef = $aB6Cp$react.useRef();
-    let endRef = $aB6Cp$react.useRef();
-    let scopeRef = $aB6Cp$react.useRef([]);
-    let ctx = $aB6Cp$react.useContext($a7a032acae3ddda9$var$FocusContext);
-    var ref;
-    // The parent scope is based on the JSX tree, using context.
-    // However, if a new scope mounts outside the active scope (e.g. DialogContainer launched from a menu),
-    // we want the parent scope to be the active scope instead.
-    let ctxParent = (ref = ctx === null || ctx === void 0 ? void 0 : ctx.scopeRef) !== null && ref !== void 0 ? ref : null;
-    let parentScope1 = $aB6Cp$react.useMemo(()=>$a7a032acae3ddda9$var$activeScope && $a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode($a7a032acae3ddda9$var$activeScope) && !$a7a032acae3ddda9$var$isAncestorScope($a7a032acae3ddda9$var$activeScope, ctxParent) ? $a7a032acae3ddda9$var$activeScope : ctxParent
-    , [
-        ctxParent
+    let startRef = (0, $aB6Cp$react.useRef)();
+    let endRef = (0, $aB6Cp$react.useRef)();
+    let scopeRef = (0, $aB6Cp$react.useRef)([]);
+    let { parentNode: parentNode  } = (0, $aB6Cp$react.useContext)($a7a032acae3ddda9$var$FocusContext) || {};
+    // Create a tree node here so we can add children to it even before it is added to the tree.
+    let node = (0, $aB6Cp$react.useMemo)(()=>new $a7a032acae3ddda9$var$TreeNode({
+            scopeRef: scopeRef
+        }), [
+        scopeRef
+    ]);
+    (0, $aB6Cp$reactariautils.useLayoutEffect)(()=>{
+        // If a new scope mounts outside the active scope, (e.g. DialogContainer launched from a menu),
+        // use the active scope as the parent instead of the parent from context. Layout effects run bottom
+        // up, so if the parent is not yet added to the tree, don't do this. Only the outer-most FocusScope
+        // that is being added should get the activeScope as its parent.
+        let parent = parentNode || $a7a032acae3ddda9$export$d06fae2ee68b101e.root;
+        if ($a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(parent.scopeRef) && $a7a032acae3ddda9$var$activeScope && !$a7a032acae3ddda9$var$isAncestorScope($a7a032acae3ddda9$var$activeScope, parent.scopeRef)) {
+            let activeNode = $a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode($a7a032acae3ddda9$var$activeScope);
+            if (activeNode) parent = activeNode;
+        }
+        // Add the node to the parent, and to the tree.
+        parent.addChild(node);
+        $a7a032acae3ddda9$export$d06fae2ee68b101e.addNode(node);
+    }, [
+        node,
+        parentNode
+    ]);
+    (0, $aB6Cp$reactariautils.useLayoutEffect)(()=>{
+        let node = $a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(scopeRef);
+        node.contain = contain;
+    }, [
+        contain
     ]);
-    $aB6Cp$reactariautils.useLayoutEffect(()=>{
+    (0, $aB6Cp$reactariautils.useLayoutEffect)(()=>{
         // Find all rendered nodes between the sentinels and add them to the scope.
         let node = startRef.current.nextSibling;
         let nodes = [];
@@ -96,57 +148,65 @@ function $a7a032acae3ddda9$export$20e40289641fbbb6(props) {
         }
         scopeRef.current = nodes;
     }, [
-        children,
-        parentScope1
+        children
     ]);
-    // add to the focus scope tree in render order because useEffects/useLayoutEffects run children first whereas render runs parent first
-    // which matters when constructing a tree
-    if ($a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(parentScope1) && !$a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(scopeRef)) $a7a032acae3ddda9$export$d06fae2ee68b101e.addTreeNode(scopeRef, parentScope1);
-    let node1 = $a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(scopeRef);
-    node1.contain = contain;
     $a7a032acae3ddda9$var$useActiveScopeTracker(scopeRef, restoreFocus, contain);
     $a7a032acae3ddda9$var$useFocusContainment(scopeRef, contain);
     $a7a032acae3ddda9$var$useRestoreFocus(scopeRef, restoreFocus, contain);
     $a7a032acae3ddda9$var$useAutoFocus(scopeRef, autoFocus);
     // this layout effect needs to run last so that focusScopeTree cleanup happens at the last moment possible
-    $aB6Cp$reactariautils.useLayoutEffect(()=>{
-        if (scopeRef) return ()=>{
-            // Scope may have been re-parented.
-            let parentScope = $a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(scopeRef).parent.scopeRef;
-            // Restore the active scope on unmount if this scope or a descendant scope is active.
-            // Parent effect cleanups run before children, so we need to check if the
-            // parent scope actually still exists before restoring the active scope to it.
-            if ((scopeRef === $a7a032acae3ddda9$var$activeScope || $a7a032acae3ddda9$var$isAncestorScope(scopeRef, $a7a032acae3ddda9$var$activeScope)) && (!parentScope || $a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(parentScope))) $a7a032acae3ddda9$var$activeScope = parentScope;
-            $a7a032acae3ddda9$export$d06fae2ee68b101e.removeTreeNode(scopeRef);
-        };
+    (0, $aB6Cp$react.useEffect)(()=>{
+        if (scopeRef) {
+            let activeElement = document.activeElement;
+            let scope = null;
+            // In strict mode, active scope is incorrectly updated since cleanup will run even though scope hasn't unmounted.
+            // To fix this, we need to update the actual activeScope here
+            if ($a7a032acae3ddda9$var$isElementInScope(activeElement, scopeRef.current)) {
+                // Since useLayoutEffect runs for children first, we need to traverse the focusScope tree and find the bottom most scope that
+                // contains the active element and set that as the activeScope
+                for (let node of $a7a032acae3ddda9$export$d06fae2ee68b101e.traverse())if ($a7a032acae3ddda9$var$isElementInScope(activeElement, node.scopeRef.current)) scope = node;
+                if (scope === $a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(scopeRef)) $a7a032acae3ddda9$var$activeScope = scope.scopeRef;
+            }
+            return ()=>{
+                // Scope may have been re-parented.
+                let parentScope = $a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(scopeRef).parent.scopeRef;
+                // Restore the active scope on unmount if this scope or a descendant scope is active.
+                // Parent effect cleanups run before children, so we need to check if the
+                // parent scope actually still exists before restoring the active scope to it.
+                if ((scopeRef === $a7a032acae3ddda9$var$activeScope || $a7a032acae3ddda9$var$isAncestorScope(scopeRef, $a7a032acae3ddda9$var$activeScope)) && (!parentScope || $a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(parentScope))) $a7a032acae3ddda9$var$activeScope = parentScope;
+                $a7a032acae3ddda9$export$d06fae2ee68b101e.removeTreeNode(scopeRef);
+            };
+        }
     }, [
-        scopeRef,
-        parentScope1
+        scopeRef
     ]);
-    let focusManager = $a7a032acae3ddda9$var$createFocusManagerForScope(scopeRef);
-    return(/*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).createElement($a7a032acae3ddda9$var$FocusContext.Provider, {
-        value: {
-            scopeRef: scopeRef,
-            focusManager: focusManager
-        }
-    }, /*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).createElement("span", {
+    let focusManager = (0, $aB6Cp$react.useMemo)(()=>$a7a032acae3ddda9$var$createFocusManagerForScope(scopeRef), []);
+    let value = (0, $aB6Cp$react.useMemo)(()=>({
+            focusManager: focusManager,
+            parentNode: node
+        }), [
+        node,
+        focusManager
+    ]);
+    return /*#__PURE__*/ (0, ($parcel$interopDefault($aB6Cp$react))).createElement($a7a032acae3ddda9$var$FocusContext.Provider, {
+        value: value
+    }, /*#__PURE__*/ (0, ($parcel$interopDefault($aB6Cp$react))).createElement("span", {
         "data-focus-scope-start": true,
         hidden: true,
         ref: startRef
-    }), children, /*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).createElement("span", {
+    }), children, /*#__PURE__*/ (0, ($parcel$interopDefault($aB6Cp$react))).createElement("span", {
         "data-focus-scope-end": true,
         hidden: true,
         ref: endRef
-    })));
+    }));
 }
 function $a7a032acae3ddda9$export$10c5169755ce7bd7() {
-    var ref;
-    return (ref = $aB6Cp$react.useContext($a7a032acae3ddda9$var$FocusContext)) === null || ref === void 0 ? void 0 : ref.focusManager;
+    var _useContext;
+    return (_useContext = (0, $aB6Cp$react.useContext)($a7a032acae3ddda9$var$FocusContext)) === null || _useContext === void 0 ? void 0 : _useContext.focusManager;
 }
 function $a7a032acae3ddda9$var$createFocusManagerForScope(scopeRef) {
     return {
-        focusNext (opts = {
-        }) {
+        focusNext (opts = {}) {
             let scope = scopeRef.current;
             let { from: from , tabbable: tabbable , wrap: wrap , accept: accept  } = opts;
             let node = from || document.activeElement;
@@ -164,8 +224,7 @@ function $a7a032acae3ddda9$var$createFocusManagerForScope(scopeRef) {
             if (nextNode) $a7a032acae3ddda9$var$focusElement(nextNode, true);
             return nextNode;
         },
-        focusPrevious (opts = {
-        }) {
+        focusPrevious (opts = {}) {
             let scope = scopeRef.current;
             let { from: from , tabbable: tabbable , wrap: wrap , accept: accept  } = opts;
             let node = from || document.activeElement;
@@ -183,8 +242,7 @@ function $a7a032acae3ddda9$var$createFocusManagerForScope(scopeRef) {
             if (previousNode) $a7a032acae3ddda9$var$focusElement(previousNode, true);
             return previousNode;
         },
-        focusFirst (opts = {
-        }) {
+        focusFirst (opts = {}) {
             let scope = scopeRef.current;
             let { tabbable: tabbable , accept: accept  } = opts;
             let walker = $a7a032acae3ddda9$export$2d6ec8fc375ceafa($a7a032acae3ddda9$var$getScopeRoot(scope), {
@@ -196,8 +254,7 @@ function $a7a032acae3ddda9$var$createFocusManagerForScope(scopeRef) {
             if (nextNode) $a7a032acae3ddda9$var$focusElement(nextNode, true);
             return nextNode;
         },
-        focusLast (opts = {
-        }) {
+        focusLast (opts = {}) {
             let scope = scopeRef.current;
             let { tabbable: tabbable , accept: accept  } = opts;
             let walker = $a7a032acae3ddda9$export$2d6ec8fc375ceafa($a7a032acae3ddda9$var$getScopeRoot(scope), {
@@ -212,21 +269,21 @@ function $a7a032acae3ddda9$var$createFocusManagerForScope(scopeRef) {
     };
 }
 const $a7a032acae3ddda9$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]'
+    "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]"
 ];
-const $a7a032acae3ddda9$var$FOCUSABLE_ELEMENT_SELECTOR = $a7a032acae3ddda9$var$focusableElements.join(':not([hidden]),') + ',[tabindex]:not([disabled]):not([hidden])';
+const $a7a032acae3ddda9$var$FOCUSABLE_ELEMENT_SELECTOR = $a7a032acae3ddda9$var$focusableElements.join(":not([hidden]),") + ",[tabindex]:not([disabled]):not([hidden])";
 $a7a032acae3ddda9$var$focusableElements.push('[tabindex]:not([tabindex="-1"]):not([disabled])');
 const $a7a032acae3ddda9$var$TABBABLE_ELEMENT_SELECTOR = $a7a032acae3ddda9$var$focusableElements.join(':not([hidden]):not([tabindex="-1"]),');
 function $a7a032acae3ddda9$var$getScopeRoot(scope) {
@@ -241,10 +298,10 @@ function $a7a032acae3ddda9$var$shouldContainFocus(scopeRef) {
     return true;
 }
 function $a7a032acae3ddda9$var$useFocusContainment(scopeRef, contain) {
-    let focusedNode = $aB6Cp$react.useRef();
-    let raf = $aB6Cp$react.useRef(null);
-    $aB6Cp$reactariautils.useLayoutEffect(()=>{
-        let scope1 = scopeRef.current;
+    let focusedNode = (0, $aB6Cp$react.useRef)();
+    let raf = (0, $aB6Cp$react.useRef)(null);
+    (0, $aB6Cp$reactariautils.useLayoutEffect)(()=>{
+        let scope = scopeRef.current;
         if (!contain) {
             // if contain was changed, then we should cancel any ongoing waits to pull focus back into containment
             if (raf.current) {
@@ -255,7 +312,7 @@ function $a7a032acae3ddda9$var$useFocusContainment(scopeRef, contain) {
         }
         // Handle the Tab key to contain focus within the scope
         let onKeyDown = (e)=>{
-            if (e.key !== 'Tab' || e.altKey || e.ctrlKey || e.metaKey || !$a7a032acae3ddda9$var$shouldContainFocus(scopeRef)) return;
+            if (e.key !== "Tab" || e.altKey || e.ctrlKey || e.metaKey || !$a7a032acae3ddda9$var$shouldContainFocus(scopeRef)) return;
             let focusedElement = document.activeElement;
             let scope = scopeRef.current;
             if (!$a7a032acae3ddda9$var$isElementInScope(focusedElement, scope)) return;
@@ -286,6 +343,7 @@ function $a7a032acae3ddda9$var$useFocusContainment(scopeRef, contain) {
         };
         let onBlur = (e)=>{
             // Firefox doesn't shift focus back to the Dialog properly without this
+            if (raf.current) cancelAnimationFrame(raf.current);
             raf.current = requestAnimationFrame(()=>{
                 // Use document.activeElement instead of e.relatedTarget so we can tell if user clicked into iframe
                 if ($a7a032acae3ddda9$var$shouldContainFocus(scopeRef) && !$a7a032acae3ddda9$var$isElementInChildScope(document.activeElement, scopeRef)) {
@@ -297,26 +355,22 @@ function $a7a032acae3ddda9$var$useFocusContainment(scopeRef, contain) {
                 }
             });
         };
-        document.addEventListener('keydown', onKeyDown, false);
-        document.addEventListener('focusin', onFocus, false);
-        scope1.forEach((element)=>element.addEventListener('focusin', onFocus, false)
-        );
-        scope1.forEach((element)=>element.addEventListener('focusout', onBlur, false)
-        );
+        document.addEventListener("keydown", onKeyDown, false);
+        document.addEventListener("focusin", onFocus, false);
+        scope.forEach((element)=>element.addEventListener("focusin", onFocus, false));
+        scope.forEach((element)=>element.addEventListener("focusout", onBlur, false));
         return ()=>{
-            document.removeEventListener('keydown', onKeyDown, false);
-            document.removeEventListener('focusin', onFocus, false);
-            scope1.forEach((element)=>element.removeEventListener('focusin', onFocus, false)
-            );
-            scope1.forEach((element)=>element.removeEventListener('focusout', onBlur, false)
-            );
+            document.removeEventListener("keydown", onKeyDown, false);
+            document.removeEventListener("focusin", onFocus, false);
+            scope.forEach((element)=>element.removeEventListener("focusin", onFocus, false));
+            scope.forEach((element)=>element.removeEventListener("focusout", onBlur, false));
         };
     }, [
         scopeRef,
         contain
     ]);
     // eslint-disable-next-line arrow-body-style
-    $aB6Cp$react.useEffect(()=>{
+    (0, $aB6Cp$react.useEffect)(()=>{
         return ()=>{
             if (raf.current) cancelAnimationFrame(raf.current);
         };
@@ -328,10 +382,11 @@ function $a7a032acae3ddda9$var$isElementInAnyScope(element) {
     return $a7a032acae3ddda9$var$isElementInChildScope(element);
 }
 function $a7a032acae3ddda9$var$isElementInScope(element, scope) {
-    return scope.some((node)=>node.contains(element)
-    );
+    return scope.some((node)=>node.contains(element));
 }
 function $a7a032acae3ddda9$var$isElementInChildScope(element, scope = null) {
+    // If the element is within a top layer element (e.g. toasts), always allow moving focus there.
+    if (element instanceof Element && element.closest("[data-react-aria-top-layer]")) return true;
     // node.contains in isElementInScope covers child scopes that are also DOM children,
     // but does not cover child scopes in portals.
     for (let { scopeRef: s  } of $a7a032acae3ddda9$export$d06fae2ee68b101e.traverse($a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(scope))){
@@ -343,8 +398,8 @@ function $a7a032acae3ddda9$export$1258395f99bf9cbf(element) {
     return $a7a032acae3ddda9$var$isElementInChildScope(element, $a7a032acae3ddda9$var$activeScope);
 }
 function $a7a032acae3ddda9$var$isAncestorScope(ancestor, scope) {
-    var ref;
-    let parent = (ref = $a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(scope)) === null || ref === void 0 ? void 0 : ref.parent;
+    var _focusScopeTree_getTreeNode;
+    let parent = (_focusScopeTree_getTreeNode = $a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(scope)) === null || _focusScopeTree_getTreeNode === void 0 ? void 0 : _focusScopeTree_getTreeNode.parent;
     while(parent){
         if (parent.scopeRef === ancestor) return true;
         parent = parent.parent;
@@ -353,7 +408,7 @@ function $a7a032acae3ddda9$var$isAncestorScope(ancestor, scope) {
 }
 function $a7a032acae3ddda9$var$focusElement(element, scroll = false) {
     if (element != null && !scroll) try {
-        $1c7f9157d722357d$export$80f3e147d781571c(element);
+        (0, $1c7f9157d722357d$export$80f3e147d781571c)(element);
     } catch (err) {
     // ignore
     }
@@ -381,8 +436,8 @@ function $a7a032acae3ddda9$var$focusFirstInScope(scope, tabbable = true) {
     $a7a032acae3ddda9$var$focusElement(nextNode);
 }
 function $a7a032acae3ddda9$var$useAutoFocus(scopeRef, autoFocus) {
-    const autoFocusRef = ($parcel$interopDefault($aB6Cp$react)).useRef(autoFocus);
-    $aB6Cp$react.useEffect(()=>{
+    const autoFocusRef = (0, ($parcel$interopDefault($aB6Cp$react))).useRef(autoFocus);
+    (0, $aB6Cp$react.useEffect)(()=>{
         if (autoFocusRef.current) {
             $a7a032acae3ddda9$var$activeScope = scopeRef;
             if (!$a7a032acae3ddda9$var$isElementInScope(document.activeElement, $a7a032acae3ddda9$var$activeScope.current)) $a7a032acae3ddda9$var$focusFirstInScope(scopeRef.current);
@@ -395,7 +450,7 @@ function $a7a032acae3ddda9$var$useAutoFocus(scopeRef, autoFocus) {
 function $a7a032acae3ddda9$var$useActiveScopeTracker(scopeRef, restore, contain) {
     // tracks the active scope, in case restore and contain are both false.
     // if either are true, this is tracked in useRestoreFocus or useFocusContainment.
-    $aB6Cp$reactariautils.useLayoutEffect(()=>{
+    (0, $aB6Cp$reactariautils.useLayoutEffect)(()=>{
         if (restore || contain) return;
         let scope = scopeRef.current;
         let onFocus = (e)=>{
@@ -403,13 +458,11 @@ function $a7a032acae3ddda9$var$useActiveScopeTracker(scopeRef, restore, contain)
             if ($a7a032acae3ddda9$var$isElementInScope(target, scopeRef.current)) $a7a032acae3ddda9$var$activeScope = scopeRef;
             else if (!$a7a032acae3ddda9$var$isElementInAnyScope(target)) $a7a032acae3ddda9$var$activeScope = null;
         };
-        document.addEventListener('focusin', onFocus, false);
-        scope.forEach((element)=>element.addEventListener('focusin', onFocus, false)
-        );
+        document.addEventListener("focusin", onFocus, false);
+        scope.forEach((element)=>element.addEventListener("focusin", onFocus, false));
         return ()=>{
-            document.removeEventListener('focusin', onFocus, false);
-            scope.forEach((element)=>element.removeEventListener('focusin', onFocus, false)
-            );
+            document.removeEventListener("focusin", onFocus, false);
+            scope.forEach((element)=>element.removeEventListener("focusin", onFocus, false));
         };
     }, [
         scopeRef,
@@ -427,10 +480,10 @@ function $a7a032acae3ddda9$var$shouldRestoreFocus(scopeRef) {
 }
 function $a7a032acae3ddda9$var$useRestoreFocus(scopeRef, restoreFocus, contain) {
     // create a ref during render instead of useLayoutEffect so the active element is saved before a child with autoFocus=true mounts.
-    const nodeToRestoreRef = $aB6Cp$react.useRef(typeof document !== 'undefined' ? document.activeElement : null);
+    const nodeToRestoreRef = (0, $aB6Cp$react.useRef)(typeof document !== "undefined" ? document.activeElement : null);
     // restoring scopes should all track if they are active regardless of contain, but contain already tracks it plus logic to contain the focus
     // restoring-non-containing scopes should only care if they become active so they can perform the restore
-    $aB6Cp$reactariautils.useLayoutEffect(()=>{
+    (0, $aB6Cp$reactariautils.useLayoutEffect)(()=>{
         let scope = scopeRef.current;
         if (!restoreFocus || contain) return;
         let onFocus = ()=>{
@@ -438,13 +491,11 @@ function $a7a032acae3ddda9$var$useRestoreFocus(scopeRef, restoreFocus, contain)
             // Moving out of the active scope to an ancestor is not allowed.
             if (!$a7a032acae3ddda9$var$activeScope || $a7a032acae3ddda9$var$isAncestorScope($a7a032acae3ddda9$var$activeScope, scopeRef)) $a7a032acae3ddda9$var$activeScope = scopeRef;
         };
-        document.addEventListener('focusin', onFocus, false);
-        scope.forEach((element)=>element.addEventListener('focusin', onFocus, false)
-        );
+        document.addEventListener("focusin", onFocus, false);
+        scope.forEach((element)=>element.addEventListener("focusin", onFocus, false));
         return ()=>{
-            document.removeEventListener('focusin', onFocus, false);
-            scope.forEach((element)=>element.removeEventListener('focusin', onFocus, false)
-            );
+            document.removeEventListener("focusin", onFocus, false);
+            scope.forEach((element)=>element.removeEventListener("focusin", onFocus, false));
         };
     // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [
@@ -452,7 +503,7 @@ function $a7a032acae3ddda9$var$useRestoreFocus(scopeRef, restoreFocus, contain)
         contain
     ]);
     // useLayoutEffect instead of useEffect so the active element is saved synchronously instead of asynchronously.
-    $aB6Cp$reactariautils.useLayoutEffect(()=>{
+    (0, $aB6Cp$reactariautils.useLayoutEffect)(()=>{
         if (!restoreFocus) return;
         $a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(scopeRef).nodeToRestore = nodeToRestoreRef.current;
         // Handle the Tab key so that tabbing out of the scope goes to the next element
@@ -460,7 +511,7 @@ function $a7a032acae3ddda9$var$useRestoreFocus(scopeRef, restoreFocus, contain)
         // using portals for overlays, so that focus goes to the expected element when
         // tabbing out of the overlay.
         let onKeyDown = (e)=>{
-            if (e.key !== 'Tab' || e.altKey || e.ctrlKey || e.metaKey) return;
+            if (e.key !== "Tab" || e.altKey || e.ctrlKey || e.metaKey) return;
             let focusedElement = document.activeElement;
             if (!$a7a032acae3ddda9$var$isElementInScope(focusedElement, scopeRef.current)) return;
             let nodeToRestore = $a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(scopeRef).nodeToRestore;
@@ -481,7 +532,7 @@ function $a7a032acae3ddda9$var$useRestoreFocus(scopeRef, restoreFocus, contain)
                 walker.currentNode = nodeToRestore;
                 // Skip over elements within the scope, in case the scope immediately follows the node to restore.
                 do nextElement = e.shiftKey ? walker.previousNode() : walker.nextNode();
-                while ($a7a032acae3ddda9$var$isElementInScope(nextElement, scopeRef.current))
+                while ($a7a032acae3ddda9$var$isElementInScope(nextElement, scopeRef.current));
                 e.preventDefault();
                 e.stopPropagation();
                 if (nextElement) $a7a032acae3ddda9$var$focusElement(nextElement, true);
@@ -492,9 +543,9 @@ function $a7a032acae3ddda9$var$useRestoreFocus(scopeRef, restoreFocus, contain)
                 else $a7a032acae3ddda9$var$focusElement(nodeToRestore, true);
             }
         };
-        if (!contain) document.addEventListener('keydown', onKeyDown, true);
+        if (!contain) document.addEventListener("keydown", onKeyDown, true);
         return ()=>{
-            if (!contain) document.removeEventListener('keydown', onKeyDown, true);
+            if (!contain) document.removeEventListener("keydown", onKeyDown, true);
             let nodeToRestore = $a7a032acae3ddda9$export$d06fae2ee68b101e.getTreeNode(scopeRef).nodeToRestore;
             // if we already lost focus to the body and this was the active scope, then we should attempt to restore
             if (restoreFocus && nodeToRestore && // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -537,21 +588,19 @@ function $a7a032acae3ddda9$export$2d6ec8fc375ceafa(root, opts, scope) {
     let selector = (opts === null || opts === void 0 ? void 0 : opts.tabbable) ? $a7a032acae3ddda9$var$TABBABLE_ELEMENT_SELECTOR : $a7a032acae3ddda9$var$FOCUSABLE_ELEMENT_SELECTOR;
     let walker = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT, {
         acceptNode (node) {
-            var ref;
+            var _opts_from;
             // Skip nodes inside the starting node.
-            if (opts === null || opts === void 0 ? void 0 : (ref = opts.from) === null || ref === void 0 ? void 0 : ref.contains(node)) return NodeFilter.FILTER_REJECT;
-            if (node.matches(selector) && $d5156037ad898a4d$export$e989c0fffaa6b27a(node) && (!scope || $a7a032acae3ddda9$var$isElementInScope(node, scope)) && (!(opts === null || opts === void 0 ? void 0 : opts.accept) || opts.accept(node))) return NodeFilter.FILTER_ACCEPT;
+            if (opts === null || opts === void 0 ? void 0 : (_opts_from = opts.from) === null || _opts_from === void 0 ? void 0 : _opts_from.contains(node)) return NodeFilter.FILTER_REJECT;
+            if (node.matches(selector) && (0, $d5156037ad898a4d$export$e989c0fffaa6b27a)(node) && (!scope || $a7a032acae3ddda9$var$isElementInScope(node, scope)) && (!(opts === null || opts === void 0 ? void 0 : opts.accept) || opts.accept(node))) return NodeFilter.FILTER_ACCEPT;
             return NodeFilter.FILTER_SKIP;
         }
     });
     if (opts === null || opts === void 0 ? void 0 : opts.from) walker.currentNode = opts.from;
     return walker;
 }
-function $a7a032acae3ddda9$export$c5251b9e124bf29(ref, defaultOptions = {
-}) {
+function $a7a032acae3ddda9$export$c5251b9e124bf29(ref, defaultOptions = {}) {
     return {
-        focusNext (opts = {
-        }) {
+        focusNext (opts = {}) {
             let root = ref.current;
             if (!root) return;
             let { from: from , tabbable: tabbable = defaultOptions.tabbable , wrap: wrap = defaultOptions.wrap , accept: accept = defaultOptions.accept  } = opts;
@@ -624,7 +673,7 @@ function $a7a032acae3ddda9$var$last(walker) {
     do {
         last = walker.lastChild();
         if (last) next = last;
-    }while (last)
+    }while (last);
     return next;
 }
 class $a7a032acae3ddda9$var$Tree {
@@ -644,6 +693,9 @@ class $a7a032acae3ddda9$var$Tree {
         this.fastMap.set(scopeRef, node);
         if (nodeToRestore) node.nodeToRestore = nodeToRestore;
     }
+    addNode(node) {
+        this.fastMap.set(node.scopeRef, node);
+    }
     removeTreeNode(scopeRef) {
         // never remove the root
         if (scopeRef === null) return;
@@ -654,14 +706,13 @@ class $a7a032acae3ddda9$var$Tree {
         for (let current of this.traverse())if (current !== node && node.nodeToRestore && current.nodeToRestore && node.scopeRef.current && $a7a032acae3ddda9$var$isElementInScope(current.nodeToRestore, node.scopeRef.current)) current.nodeToRestore = node.nodeToRestore;
         let children = node.children;
         parentNode.removeChild(node);
-        if (children.length > 0) children.forEach((child)=>parentNode.addChild(child)
-        );
+        if (children.size > 0) children.forEach((child)=>parentNode.addChild(child));
         this.fastMap.delete(node.scopeRef);
     }
     // Pre Order Depth First
     *traverse(node = this.root) {
         if (node.scopeRef != null) yield node;
-        if (node.children.length > 0) for (let child of node.children)yield* this.traverse(child);
+        if (node.children.size > 0) for (let child of node.children)yield* this.traverse(child);
     }
     clone() {
         let newTree = new $a7a032acae3ddda9$var$Tree();
@@ -669,7 +720,7 @@ class $a7a032acae3ddda9$var$Tree {
         return newTree;
     }
     constructor(){
-        this.fastMap = new Map();
+        (0, ($parcel$interopDefault($aB6Cp$swchelperslib_define_propertyjs)))(this, "fastMap", new Map());
         this.root = new $a7a032acae3ddda9$var$TreeNode({
             scopeRef: null
         });
@@ -678,63 +729,70 @@ class $a7a032acae3ddda9$var$Tree {
 }
 class $a7a032acae3ddda9$var$TreeNode {
     addChild(node) {
-        this.children.push(node);
+        this.children.add(node);
         node.parent = this;
     }
     removeChild(node) {
-        this.children.splice(this.children.indexOf(node), 1);
+        this.children.delete(node);
         node.parent = undefined;
     }
     constructor(props){
-        this.children = [];
-        this.contain = false;
+        (0, ($parcel$interopDefault($aB6Cp$swchelperslib_define_propertyjs)))(this, "children", new Set());
+        (0, ($parcel$interopDefault($aB6Cp$swchelperslib_define_propertyjs)))(this, "contain", false);
         this.scopeRef = props.scopeRef;
     }
 }
 let $a7a032acae3ddda9$export$d06fae2ee68b101e = new $a7a032acae3ddda9$var$Tree();
 
 
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ 
 
 
 
 
 
-
-function $581a96d6eb128c1b$export$4e328f61c538687f(props = {
-}) {
+function $581a96d6eb128c1b$export$4e328f61c538687f(props = {}) {
     let { autoFocus: autoFocus = false , isTextInput: isTextInput , within: within  } = props;
-    let state = $aB6Cp$react.useRef({
+    let state = (0, $aB6Cp$react.useRef)({
         isFocused: false,
-        isFocusVisible: autoFocus || $aB6Cp$reactariainteractions.isFocusVisible()
+        isFocusVisible: autoFocus || (0, $aB6Cp$reactariainteractions.isFocusVisible)()
     });
-    let [isFocused1, setFocused] = $aB6Cp$react.useState(false);
-    let [isFocusVisibleState, setFocusVisible] = $aB6Cp$react.useState(()=>state.current.isFocused && state.current.isFocusVisible
-    );
-    let updateState = $aB6Cp$react.useCallback(()=>setFocusVisible(state.current.isFocused && state.current.isFocusVisible)
-    , []);
-    let onFocusChange = $aB6Cp$react.useCallback((isFocused)=>{
+    let [isFocused, setFocused] = (0, $aB6Cp$react.useState)(false);
+    let [isFocusVisibleState, setFocusVisible] = (0, $aB6Cp$react.useState)(()=>state.current.isFocused && state.current.isFocusVisible);
+    let updateState = (0, $aB6Cp$react.useCallback)(()=>setFocusVisible(state.current.isFocused && state.current.isFocusVisible), []);
+    let onFocusChange = (0, $aB6Cp$react.useCallback)((isFocused)=>{
         state.current.isFocused = isFocused;
         setFocused(isFocused);
         updateState();
     }, [
         updateState
     ]);
-    $aB6Cp$reactariainteractions.useFocusVisibleListener((isFocusVisible)=>{
+    (0, $aB6Cp$reactariainteractions.useFocusVisibleListener)((isFocusVisible)=>{
         state.current.isFocusVisible = isFocusVisible;
         updateState();
     }, [], {
         isTextInput: isTextInput
     });
-    let { focusProps: focusProps  } = $aB6Cp$reactariainteractions.useFocus({
+    let { focusProps: focusProps  } = (0, $aB6Cp$reactariainteractions.useFocus)({
         isDisabled: within,
         onFocusChange: onFocusChange
     });
-    let { focusWithinProps: focusWithinProps  } = $aB6Cp$reactariainteractions.useFocusWithin({
+    let { focusWithinProps: focusWithinProps  } = (0, $aB6Cp$reactariainteractions.useFocusWithin)({
         isDisabled: !within,
         onFocusWithinChange: onFocusChange
     });
     return {
-        isFocused: isFocused1,
+        isFocused: isFocused,
         isFocusVisible: state.current.isFocused && isFocusVisibleState,
         focusProps: within ? focusWithinProps : focusProps
     };
@@ -743,27 +801,36 @@ function $581a96d6eb128c1b$export$4e328f61c538687f(props = {
 
 function $dfd8c70b928eb1b3$export$1a38b4ad7f578e1d(props) {
     let { children: children , focusClass: focusClass , focusRingClass: focusRingClass  } = props;
-    let { isFocused: isFocused , isFocusVisible: isFocusVisible , focusProps: focusProps  } = $581a96d6eb128c1b$export$4e328f61c538687f(props);
-    let child = ($parcel$interopDefault($aB6Cp$react)).Children.only(children);
-    return(/*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).cloneElement(child, $aB6Cp$reactariautils.mergeProps(child.props, {
+    let { isFocused: isFocused , isFocusVisible: isFocusVisible , focusProps: focusProps  } = (0, $581a96d6eb128c1b$export$4e328f61c538687f)(props);
+    let child = (0, ($parcel$interopDefault($aB6Cp$react))).Children.only(children);
+    return /*#__PURE__*/ (0, ($parcel$interopDefault($aB6Cp$react))).cloneElement(child, (0, $aB6Cp$reactariautils.mergeProps)(child.props, {
         ...focusProps,
-        className: ($parcel$interopDefault($aB6Cp$clsx))({
-            [focusClass || '']: isFocused,
-            [focusRingClass || '']: isFocusVisible
+        className: (0, ($parcel$interopDefault($aB6Cp$clsx)))({
+            [focusClass || ""]: isFocused,
+            [focusRingClass || ""]: isFocusVisible
         })
-    })));
+    }));
 }
 
 
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ 
 
 
 
-
-let $fb504d83237fd6ac$var$FocusableContext = /*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).createContext(null);
+let $fb504d83237fd6ac$var$FocusableContext = /*#__PURE__*/ (0, ($parcel$interopDefault($aB6Cp$react))).createContext(null);
 function $fb504d83237fd6ac$var$useFocusableContext(ref) {
-    let context = $aB6Cp$react.useContext($fb504d83237fd6ac$var$FocusableContext) || {
-    };
-    $aB6Cp$reactariautils.useSyncRef(context, ref);
+    let context = (0, $aB6Cp$react.useContext)($fb504d83237fd6ac$var$FocusableContext) || {};
+    (0, $aB6Cp$reactariautils.useSyncRef)(context, ref);
     // eslint-disable-next-line
     let { ref: _ , ...otherProps } = context;
     return otherProps;
@@ -776,27 +843,26 @@ function $fb504d83237fd6ac$var$useFocusableContext(ref) {
         ...otherProps,
         ref: ref
     };
-    return(/*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).createElement($fb504d83237fd6ac$var$FocusableContext.Provider, {
+    return /*#__PURE__*/ (0, ($parcel$interopDefault($aB6Cp$react))).createElement($fb504d83237fd6ac$var$FocusableContext.Provider, {
         value: context
-    }, children));
+    }, children);
 }
-let $fb504d83237fd6ac$export$13f3202a3e5ddd5 = /*#__PURE__*/ ($parcel$interopDefault($aB6Cp$react)).forwardRef($fb504d83237fd6ac$var$FocusableProvider);
+let $fb504d83237fd6ac$export$13f3202a3e5ddd5 = /*#__PURE__*/ (0, ($parcel$interopDefault($aB6Cp$react))).forwardRef($fb504d83237fd6ac$var$FocusableProvider);
 function $fb504d83237fd6ac$export$4c014de7c8940b4c(props, domRef) {
-    let { focusProps: focusProps  } = $aB6Cp$reactariainteractions.useFocus(props);
-    let { keyboardProps: keyboardProps  } = $aB6Cp$reactariainteractions.useKeyboard(props);
-    let interactions = $aB6Cp$reactariautils.mergeProps(focusProps, keyboardProps);
+    let { focusProps: focusProps  } = (0, $aB6Cp$reactariainteractions.useFocus)(props);
+    let { keyboardProps: keyboardProps  } = (0, $aB6Cp$reactariainteractions.useKeyboard)(props);
+    let interactions = (0, $aB6Cp$reactariautils.mergeProps)(focusProps, keyboardProps);
     let domProps = $fb504d83237fd6ac$var$useFocusableContext(domRef);
-    let interactionProps = props.isDisabled ? {
-    } : domProps;
-    let autoFocusRef = $aB6Cp$react.useRef(props.autoFocus);
-    $aB6Cp$react.useEffect(()=>{
-        if (autoFocusRef.current && domRef.current) $1c7f9157d722357d$export$80f3e147d781571c(domRef.current);
+    let interactionProps = props.isDisabled ? {} : domProps;
+    let autoFocusRef = (0, $aB6Cp$react.useRef)(props.autoFocus);
+    (0, $aB6Cp$react.useEffect)(()=>{
+        if (autoFocusRef.current && domRef.current) (0, $1c7f9157d722357d$export$80f3e147d781571c)(domRef.current);
         autoFocusRef.current = false;
     }, [
         domRef
     ]);
     return {
-        focusableProps: $aB6Cp$reactariautils.mergeProps({
+        focusableProps: (0, $aB6Cp$reactariautils.mergeProps)({
             ...interactions,
             tabIndex: props.excludeFromTabOrder && !props.isDisabled ? -1 : undefined
         }, interactionProps)