Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

focus-trap

Package Overview
Dependencies
Maintainers
1
Versions
83
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

focus-trap - npm Package Compare versions

Comparing version 2.0.2 to 2.1.0

4

CHANGELOG.md
# Changelog
## 2.1.0
- Added: `fallbackFocus` option.
## 2.0.2

@@ -4,0 +8,0 @@

27

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 @@

{
"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",

@@ -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()

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc