focus-trap 8.1.0 → 8.2.1

package/dist/focus-trap.umd.js

@@ -1,5 +1,5 @@
 /*!
-* focus-trap 8.1.0
+* focus-trap 8.2.1
 * @license MIT, https://github.com/focus-trap/focus-trap/blob/master/LICENSE
 */
 (function (global, factory) {
@@ -21,31 +21,6 @@
   function _arrayWithoutHoles(r) {
     if (Array.isArray(r)) return _arrayLikeToArray(r);
   }
-  function asyncGeneratorStep(n, t, e, r, o, a, c) {
-    try {
-      var i = n[a](c),
-        u = i.value;
-    } catch (n) {
-      return void e(n);
-    }
-    i.done ? t(u) : Promise.resolve(u).then(r, o);
-  }
-  function _asyncToGenerator(n) {
-    return function () {
-      var t = this,
-        e = arguments;
-      return new Promise(function (r, o) {
-        var a = n.apply(t, e);
-        function _next(n) {
-          asyncGeneratorStep(a, r, o, _next, _throw, "next", n);
-        }
-        function _throw(n) {
-          asyncGeneratorStep(a, r, o, _next, _throw, "throw", n);
-        }
-        _next(void 0);
-      });
-    };
-  }
   function _createForOfIteratorHelper(r, e) {
     var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
     if (!t) {
@@ -129,114 +104,6 @@
     }
     return e;
   }
-  function _regenerator() {
-    /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */
-    var e,
-      t,
-      r = "function" == typeof Symbol ? Symbol : {},
-      n = r.iterator || "@@iterator",
-      o = r.toStringTag || "@@toStringTag";
-    function i(r, n, o, i) {
-      var c = n && n.prototype instanceof Generator ? n : Generator,
-        u = Object.create(c.prototype);
-      return _regeneratorDefine(u, "_invoke", function (r, n, o) {
-        var i,
-          c,
-          u,
-          f = 0,
-          p = o || [],
-          y = false,
-          G = {
-            p: 0,
-            n: 0,
-            v: e,
-            a: d,
-            f: d.bind(e, 4),
-            d: function (t, r) {
-              return i = t, c = 0, u = e, G.n = r, a;
-            }
-          };
-        function d(r, n) {
-          for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) {
-            var o,
-              i = p[t],
-              d = G.p,
-              l = i[2];
-            r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0));
-          }
-          if (o || r > 1) return a;
-          throw y = true, n;
-        }
-        return function (o, p, l) {
-          if (f > 1) throw TypeError("Generator is already running");
-          for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) {
-            i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u);
-            try {
-              if (f = 2, i) {
-                if (c || (o = "next"), t = i[o]) {
-                  if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object");
-                  if (!t.done) return t;
-                  u = t.value, c < 2 && (c = 0);
-                } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1);
-                i = e;
-              } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break;
-            } catch (t) {
-              i = e, c = 1, u = t;
-            } finally {
-              f = 1;
-            }
-          }
-          return {
-            value: t,
-            done: y
-          };
-        };
-      }(r, o, i), true), u;
-    }
-    var a = {};
-    function Generator() {}
-    function GeneratorFunction() {}
-    function GeneratorFunctionPrototype() {}
-    t = Object.getPrototypeOf;
-    var c = [][n] ? t(t([][n]())) : (_regeneratorDefine(t = {}, n, function () {
-        return this;
-      }), t),
-      u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c);
-    function f(e) {
-      return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e;
-    }
-    return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine(u), _regeneratorDefine(u, o, "Generator"), _regeneratorDefine(u, n, function () {
-      return this;
-    }), _regeneratorDefine(u, "toString", function () {
-      return "[object Generator]";
-    }), (_regenerator = function () {
-      return {
-        w: i,
-        m: f
-      };
-    })();
-  }
-  function _regeneratorDefine(e, r, n, t) {
-    var i = Object.defineProperty;
-    try {
-      i({}, "", {});
-    } catch (e) {
-      i = 0;
-    }
-    _regeneratorDefine = function (e, r, n, t) {
-      function o(r, n) {
-        _regeneratorDefine(e, r, function (e) {
-          return this._invoke(r, n, e);
-        });
-      }
-      r ? i ? i(e, r, {
-        value: n,
-        enumerable: !t,
-        configurable: !t,
-        writable: !t
-      }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2));
-    }, _regeneratorDefine(e, r, n, t);
-  }
   function _toConsumableArray(r) {
     return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread();
   }
@@ -365,6 +232,7 @@
       returnFocusOnDeactivate: true,
       escapeDeactivates: true,
       delayInitialFocus: true,
+      delayReturnFocus: true,
       isolateSubtrees: false,
       isKeyForward: isKeyForward,
       isKeyBackward: isKeyBackward
@@ -514,6 +382,25 @@
       }
       return node;
     };
+
+    /**
+     * Gets the current activeElement. If it's a web-component and has open shadow-root
+     * it will recursively search inside shadow roots for the "true" activeElement.
+     *
+     * @param {Document | ShadowRoot} el
+     *
+     * @returns {HTMLElement|null} The element that currently has the focus. `null` if a focused element isn't found.
+     **/
+    var _getActiveElement = function getActiveElement(el) {
+      var activeElement = el.activeElement;
+      if (!activeElement) {
+        return null;
+      }
+      if (activeElement.shadowRoot && activeElement.shadowRoot.activeElement !== null) {
+        return _getActiveElement(activeElement.shadowRoot);
+      }
+      return activeElement;
+    };
     var getInitialFocusNode = function getInitialFocusNode() {
       var node = getNodeForOption('initialFocus', {
         hasFallback: true
@@ -524,9 +411,11 @@
         return false;
       }
       if (node === undefined || node && !tabbable.isFocusable(node, config.tabbableOptions)) {
+        var activeElement = _getActiveElement(doc);
+
         // option not specified nor focusable: use fallback options
-        if (findContainerIndex(doc.activeElement) >= 0) {
-          node = doc.activeElement;
+        if (findContainerIndex(activeElement) >= 0) {
+          node = activeElement;
         } else {
           var firstTabbableGroup = state.tabbableGroups[0];
           var firstTabbableNode = firstTabbableGroup && firstTabbableGroup.firstTabbableNode;
@@ -638,25 +527,6 @@
         throw new Error("At least one node with a positive tabindex was found in one of your focus-trap's multiple containers. Positive tabindexes are only supported in single-container focus-traps.");
       }
     };
-
-    /**
-     * Gets the current activeElement. If it's a web-component and has open shadow-root
-     * it will recursively search inside shadow roots for the "true" activeElement.
-     *
-     * @param {Document | ShadowRoot} el
-     *
-     * @returns {HTMLElement} The element that currently has the focus
-     **/
-    var _getActiveElement = function getActiveElement(el) {
-      var activeElement = el.activeElement;
-      if (!activeElement) {
-        return;
-      }
-      if (activeElement.shadowRoot && activeElement.shadowRoot.activeElement !== null) {
-        return _getActiveElement(activeElement.shadowRoot);
-      }
-      return activeElement;
-    };
     var _tryFocus = function tryFocus(node) {
       if (node === false) {
         return;
@@ -977,12 +847,13 @@
     /**
      * Adds listeners to the document necessary for trapping focus and attempts to set focus
      *  to the configured initial focus node. Does nothing if the trap isn't active.
-     * @returns {Promise<void>} Resolved (always) once the initial focus node has been focused.
-     *  Also resolved if the trap isn't active.
+     * @returns {Promise<void> | undefined} A promise resolved once the initial focus node has
+     *  been focused when `delayInitialFocus=true`; `undefined` when focus is set synchronously
+     *  or the trap isn't active.
      */
     var addListeners = function addListeners() {
       if (!state.active) {
-        return Promise.resolve();
+        return;
       }
 
       // There can be only one listening focus trap at a time
@@ -990,7 +861,7 @@
 
       // Delay ensures that the focused element doesn't capture the event
       // that caused the focus trap activation.
-      /** @type {Promise<void>} */
+      /** @type {Promise<void> | undefined} */
       var promise;
       if (config.delayInitialFocus) {
         // NOTE: Promise constructor callback is called synchronously, which is what we want
@@ -1002,7 +873,6 @@
           });
         });
       } else {
-        promise = Promise.resolve();
         _tryFocus(getInitialFocusNode());
       }
       doc.addEventListener('focusin', checkFocusIn, true);
@@ -1111,17 +981,27 @@
     //
 
     var checkDomRemoval = function checkDomRemoval(mutations) {
+      var focusedNode = state.mostRecentlyFocusedNode;
+      if (!focusedNode) {
+        return;
+      }
       var isFocusedNodeRemoved = mutations.some(function (mutation) {
         var removedNodes = Array.from(mutation.removedNodes);
         return removedNodes.some(function (node) {
-          return node === state.mostRecentlyFocusedNode;
+          return node === focusedNode || typeof node.contains === 'function' && node.contains(focusedNode);
         });
       });
 
-      // If the currently focused is removed then browsers will move focus to the
+      // If the currently focused node is removed then browsers will move focus to the
       // <body> element. If this happens, try to move focus back into the trap.
-      if (isFocusedNodeRemoved) {
-        _tryFocus(getInitialFocusNode());
+      if (isFocusedNodeRemoved && state.containers.some(function (container) {
+        return container === null || container === void 0 ? void 0 : container.isConnected;
+      })) {
+        // Refresh tabbable state before resolving initial focus because
+        // getInitialFocusNode() may fall back to the first tabbable node in the trap.
+        updateTabbableNodes();
+        var initialFocusNode = getInitialFocusNode();
+        _tryFocus(initialFocusNode);
       }
     };
 
@@ -1184,37 +1064,30 @@
           onActivate === null || onActivate === void 0 || onActivate({
             trap: trap
           });
-          var finishActivation = /*#__PURE__*/function () {
-            var _ref6 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
-              return _regenerator().w(function (_context) {
-                while (1) switch (_context.n) {
-                  case 0:
-                    if (checkCanFocusTrap) {
-                      updateTabbableNodes();
-                    }
-
-                    // NOTE: wait for initial focus node to get focused before we potentially isolate
-                    //  the subtrees with aria-hidden while focus is still in some other subtree and
-                    //  not yet in the trap, resulting in some browsers (e.g. Chrome) logging to the
-                    //  console that they, "Blocked aria-hidden on an element because its descendant
-                    //  retained focus..."
-                    _context.n = 1;
-                    return addListeners();
-                  case 1:
-                    trap._setSubtreeIsolation(true);
-                    updateObservedNodes();
-                    onPostActivate === null || onPostActivate === void 0 || onPostActivate({
-                      trap: trap
-                    });
-                  case 2:
-                    return _context.a(2);
-                }
-              }, _callee);
-            }));
-            return function finishActivation() {
-              return _ref6.apply(this, arguments);
+          var finishActivation = function finishActivation() {
+            if (checkCanFocusTrap) {
+              updateTabbableNodes();
+            }
+            var afterListeners = function afterListeners() {
+              trap._setSubtreeIsolation(true);
+              updateObservedNodes();
+              onPostActivate === null || onPostActivate === void 0 || onPostActivate({
+                trap: trap
+              });
             };
-          }();
+
+            // NOTE: wait for initial focus node to get focused (whether activation is fully,
+            //  partially, or not asynchronous) before we potentially isolate the subtrees
+            //  with aria-hidden while focus is still in some other subtree and not yet in
+            //  the trap, resulting in some browsers (e.g. Chrome) logging to the console that
+            //  they, "Blocked aria-hidden on an element because its descendant retained focus..."
+            var listenersPromise = addListeners();
+            if (listenersPromise) {
+              listenersPromise.then(afterListeners);
+            } else {
+              afterListeners();
+            }
+          };
           if (checkCanFocusTrap) {
             checkCanFocusTrap(state.containers.concat()).then(finishActivation, finishActivation);
             return this;
@@ -1262,20 +1135,26 @@
         var onDeactivate = getOption(options, 'onDeactivate');
         var onPostDeactivate = getOption(options, 'onPostDeactivate');
         var checkCanReturnFocus = getOption(options, 'checkCanReturnFocus');
+        var delayReturnFocus = getOption(options, 'delayReturnFocus');
         var returnFocus = getOption(options, 'returnFocus', 'returnFocusOnDeactivate');
         onDeactivate === null || onDeactivate === void 0 || onDeactivate({
           trap: trap
         });
-        var finishDeactivation = function finishDeactivation() {
-          delay(function () {
-            if (returnFocus) {
-              _tryFocus(getReturnFocusNode(state.nodeFocusedBeforeActivation));
-            }
-            onPostDeactivate === null || onPostDeactivate === void 0 || onPostDeactivate({
-              trap: trap
-            });
+        var completeDeactivation = function completeDeactivation() {
+          if (returnFocus) {
+            _tryFocus(getReturnFocusNode(state.nodeFocusedBeforeActivation));
+          }
+          onPostDeactivate === null || onPostDeactivate === void 0 || onPostDeactivate({
+            trap: trap
           });
         };
+        var finishDeactivation = function finishDeactivation() {
+          if (delayReturnFocus && returnFocus) {
+            delay(completeDeactivation);
+          } else {
+            completeDeactivation();
+          }
+        };
         if (returnFocus && checkCanReturnFocus) {
           checkCanReturnFocus(getReturnFocusNode(state.nodeFocusedBeforeActivation)).then(finishDeactivation, finishDeactivation);
           return this;
@@ -1348,35 +1227,28 @@
             onUnpause === null || onUnpause === void 0 || onUnpause({
               trap: trap
             });
-            var finishUnpause = /*#__PURE__*/function () {
-              var _ref7 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2() {
-                return _regenerator().w(function (_context2) {
-                  while (1) switch (_context2.n) {
-                    case 0:
-                      updateTabbableNodes();
-
-                      // NOTE: wait for initial focus node to get focused before we potentially isolate
-                      //  the subtrees with aria-hidden while focus is still in some other subtree and
-                      //  not yet in the trap, resulting in some browsers (e.g. Chrome) logging to the
-                      //  console that they, "Blocked aria-hidden on an element because its descendant
-                      //  retained focus..."
-                      _context2.n = 1;
-                      return addListeners();
-                    case 1:
-                      trap._setSubtreeIsolation(true);
-                      updateObservedNodes();
-                      onPostUnpause === null || onPostUnpause === void 0 || onPostUnpause({
-                        trap: trap
-                      });
-                    case 2:
-                      return _context2.a(2);
-                  }
-                }, _callee2);
-              }));
-              return function finishUnpause() {
-                return _ref7.apply(this, arguments);
+            var finishUnpause = function finishUnpause() {
+              updateTabbableNodes();
+              var afterListeners = function afterListeners() {
+                trap._setSubtreeIsolation(true);
+                updateObservedNodes();
+                onPostUnpause === null || onPostUnpause === void 0 || onPostUnpause({
+                  trap: trap
+                });
               };
-            }();
+
+              // NOTE: wait for initial focus node to get focused (whether activation is fully,
+              //  partially, or not asynchronous) before we potentially isolate the subtrees
+              //  with aria-hidden while focus is still in some other subtree and not yet in
+              //  the trap, resulting in some browsers (e.g. Chrome) logging to the console that
+              //  they, "Blocked aria-hidden on an element because its descendant retained focus..."
+              var listenersPromise = addListeners();
+              if (listenersPromise) {
+                listenersPromise.then(afterListeners);
+              } else {
+                afterListeners();
+              }
+            };
             finishUnpause();
           }
           return this;