focus-trap - npm Package Compare versions

Comparing version 2.0.2 to 2.1.0

CHANGELOG.md

 # Changelog
 
+## 2.1.0
+
+- Added: `fallbackFocus` option.
+
 ## 2.0.2
@@ -4,0 +8,0 @@

index.js

@@ -96,3 +96,3 @@ var tabbable = require('tabbable');
   function removeListeners() {
-    if (!active || !listeningFocusTrap) return;
+    if (!active || listeningFocusTrap !== trap) return;
 
@@ -110,18 +110,21 @@ document.removeEventListener('focus', checkFocus, true);
 
-  function firstFocusNode() {
-    var node;
-
-    if (!config.initialFocus) {
-      node = tabbableNodes[0];
+  function getNodeForOption(key) {
+    var node = config[key];
+    if (!node) {
+      return null;
+    }
+    if (typeof node === 'string') {
+      node = document.querySelector(node);
       if (!node) {
-        throw new Error('You can\'t have a focus-trap without at least one focusable element');
+        throw new Error('`'+key+'` refers to no known node');
       }
-      return node;
     }
+    return node;
+  }
 
-    node = (typeof config.initialFocus === 'string')
-      ? document.querySelector(config.initialFocus)
-      : config.initialFocus;
+  function firstFocusNode() {
+    var node = getNodeForOption('initialFocus') || tabbableNodes[0] || getNodeForOption('fallbackFocus');
+
     if (!node) {
-      throw new Error('`initialFocus` refers to no known node');
+      throw new Error('You can\'t have a focus-trap without at least one focusable element');
     }
@@ -128,0 +131,0 @@

package.json

 {
   "name": "focus-trap",
-  "version": "2.0.2",
+  "version": "2.1.0",
   "description": "Trap focus within a DOM node.",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -60,5 +60,6 @@ # focus-trap
 - **initialFocus** {element|string}: By default, when a focus trap is activated the first element in the focus trap's tab order will receive focus. With this option you can specify a different element to receive that initial focus. Can be a DOM node or a selector string (which will be passed to `document.querySelector()` to find the DOM node).
+- **fallbackFocus** {element|string}: By default, an error will be thrown if the focus trap contains no elements in its tab order. With this option you can specify a fallback element to programmatically receive focus if no other tabbable elements are found. For example, you may want a popover's `<div>` to receive focus if the popover's content includes no tabbable elements. *Make sure the fallback element has a negative `tabindex` so it can be programmatically focused.* The option value can be a DOM node or a selector string (which will be passed to `document.querySelector()` to find the DOM node).
 - **escapeDeactivates** {boolean}: Default: `true`. If `false`, the `Escape` key will not trigger deactivation of the focus trap. This can be useful if you want to force the user to make a decision instead of allowing an easy way out.
 - **clickOutsideDeactivates** {boolean}: Default: `false`. If `true`, a click outside the focus trap will deactivate the focus trap and allow the click event to do its thing.
-- ** returnFocusOnDeactivate** {boolean}: Default: `true`. If `false`, when the trap is deactivated, focus will *not* return to the element that had focus before activation.
+- **returnFocusOnDeactivate** {boolean}: Default: `true`. If `false`, when the trap is deactivated, focus will *not* return to the element that had focus before activation.
 
@@ -65,0 +66,0 @@ ### focusTrap.activate()

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

14856

increased by5.19%

Lines of code

162

increased by1.89%

Number of lines in readme file

137

increased by0.74%

No dependency changes