focus-trap
Advanced tools
Comparing version 6.8.1 to 6.9.0
# Changelog | ||
## 6.9.0 | ||
### Minor Changes | ||
- 2a57e4b: Add new `trap.active` and `trap.paused` readonly state properties on the trap so that the trap's active/paused state can be queried. | ||
### Patch Changes | ||
- 8fd49df: Fixed bug where `clickOutsideDeactivate` handler would get called on the 'click' event even if the node clicked was in the trap. As with 'mousedown' and 'touchstart' events where this option is also used, the handler should only get called if the target node is _outside_ the trap. | ||
- c32c60a: Fixed: onDeactivate, onPostDeactivate, and checkCanReturnFocus options originally given to createFocusTrap() were not being used by default when calling `trap.deactivate({...})` with an option set even if that option set didn't specify any overrides of these options. | ||
## 6.8.1 | ||
@@ -18,2 +29,3 @@ | ||
- 21458c9: Bumps tabbable to v5.3.0 and includes all changes from the past v6.8.0 beta releases. The big new feature is opt-in Shadow DOM support in tabbable, and a new `getShadowRoot` tabbable option exposed in a new `tabbableOptions` focus-trap config option. | ||
- ⚠️ This will likely break your tests **if you're using JSDom** (e.g. with Jest). See [testing in JSDom](./README.md#testing-in-jsdom) for more info. | ||
@@ -20,0 +32,0 @@ ## 6.8.0-beta.2 |
/*! | ||
* focus-trap 6.8.1 | ||
* focus-trap 6.9.0 | ||
* @license MIT, https://github.com/focus-trap/focus-trap/blob/master/LICENSE | ||
@@ -553,6 +553,2 @@ */ | ||
var checkClick = function checkClick(e) { | ||
if (valueOrHandler(config.clickOutsideDeactivates, e)) { | ||
return; | ||
} | ||
var target = getActualTarget(e); | ||
@@ -564,2 +560,6 @@ | ||
if (valueOrHandler(config.clickOutsideDeactivates, e)) { | ||
return; | ||
} | ||
if (valueOrHandler(config.allowOutsideClick, e)) { | ||
@@ -625,2 +625,10 @@ return; | ||
trap = { | ||
get active() { | ||
return state.active; | ||
}, | ||
get paused() { | ||
return state.paused; | ||
}, | ||
activate: function activate(activateOptions) { | ||
@@ -672,2 +680,8 @@ if (state.active) { | ||
var options = _objectSpread2({ | ||
onDeactivate: config.onDeactivate, | ||
onPostDeactivate: config.onPostDeactivate, | ||
checkCanReturnFocus: config.checkCanReturnFocus | ||
}, deactivateOptions); | ||
clearTimeout(state.delayInitialFocusTimer); // noop if undefined | ||
@@ -680,5 +694,6 @@ | ||
activeFocusTraps.deactivateTrap(trap); | ||
var onDeactivate = getOption(deactivateOptions, 'onDeactivate'); | ||
var onPostDeactivate = getOption(deactivateOptions, 'onPostDeactivate'); | ||
var checkCanReturnFocus = getOption(deactivateOptions, 'checkCanReturnFocus'); | ||
var onDeactivate = getOption(options, 'onDeactivate'); | ||
var onPostDeactivate = getOption(options, 'onPostDeactivate'); | ||
var checkCanReturnFocus = getOption(options, 'checkCanReturnFocus'); | ||
var returnFocus = getOption(options, 'returnFocus', 'returnFocusOnDeactivate'); | ||
@@ -689,4 +704,2 @@ if (onDeactivate) { | ||
var returnFocus = getOption(deactivateOptions, 'returnFocus', 'returnFocusOnDeactivate'); | ||
var finishDeactivation = function finishDeactivation() { | ||
@@ -693,0 +706,0 @@ delay(function () { |
/*! | ||
* focus-trap 6.8.1 | ||
* focus-trap 6.9.0 | ||
* @license MIT, https://github.com/focus-trap/focus-trap/blob/master/LICENSE | ||
*/ | ||
import{tabbable as e,focusable as t,isTabbable as n,isFocusable as a}from"tabbable";function r(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function o(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var i,c=(i=[],{activateTrap:function(e){if(i.length>0){var t=i[i.length-1];t!==e&&t.pause()}var n=i.indexOf(e);-1===n||i.splice(n,1),i.push(e)},deactivateTrap:function(e){var t=i.indexOf(e);-1!==t&&i.splice(t,1),i.length>0&&i[i.length-1].unpause()}}),u=function(e){return setTimeout(e,0)},s=function(e,t){var n=-1;return e.every((function(e,a){return!t(e)||(n=a,!1)})),n},l=function(e){for(var t=arguments.length,n=new Array(t>1?t-1:0),a=1;a<t;a++)n[a-1]=arguments[a];return"function"==typeof e?e.apply(void 0,n):e},b=function(e){return e.target.shadowRoot&&"function"==typeof e.composedPath?e.composedPath()[0]:e.target},f=function(i,f){var v,d=(null==f?void 0:f.document)||document,p=function(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?r(Object(n),!0).forEach((function(t){o(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):r(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}({returnFocusOnDeactivate:!0,escapeDeactivates:!0,delayInitialFocus:!0},f),h={containers:[],containerGroups:[],tabbableGroups:[],nodeFocusedBeforeActivation:null,mostRecentlyFocusedNode:null,active:!1,paused:!1,delayInitialFocusTimer:void 0},m=function(e,t,n){return e&&void 0!==e[t]?e[t]:p[n||t]},y=function(e){return h.containerGroups.findIndex((function(t){var n=t.container,a=t.tabbableNodes;return n.contains(e)||a.find((function(t){return t===e}))}))},O=function(e){var t=p[e];if("function"==typeof t){for(var n=arguments.length,a=new Array(n>1?n-1:0),r=1;r<n;r++)a[r-1]=arguments[r];t=t.apply(void 0,a)}if(!t){if(void 0===t||!1===t)return t;throw new Error("`".concat(e,"` was specified but was not a node, or did not return a node"))}var o=t;if("string"==typeof t&&!(o=d.querySelector(t)))throw new Error("`".concat(e,"` as selector refers to no known node"));return o},g=function(){var e=O("initialFocus");if(!1===e)return!1;if(void 0===e)if(y(d.activeElement)>=0)e=d.activeElement;else{var t=h.tabbableGroups[0];e=t&&t.firstTabbableNode||O("fallbackFocus")}if(!e)throw new Error("Your focus-trap needs to have at least one focusable element");return e},w=function(){if(h.containerGroups=h.containers.map((function(a){var r=e(a,p.tabbableOptions),o=t(a,p.tabbableOptions);return{container:a,tabbableNodes:r,focusableNodes:o,firstTabbableNode:r.length>0?r[0]:null,lastTabbableNode:r.length>0?r[r.length-1]:null,nextTabbableNode:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],a=o.findIndex((function(t){return t===e}));if(!(a<0))return t?o.slice(a+1).find((function(e){return n(e,p.tabbableOptions)})):o.slice(0,a).reverse().find((function(e){return n(e,p.tabbableOptions)}))}}})),h.tabbableGroups=h.containerGroups.filter((function(e){return e.tabbableNodes.length>0})),h.tabbableGroups.length<=0&&!O("fallbackFocus"))throw new Error("Your focus-trap must have at least one container with at least one tabbable node in it at all times")},F=function e(t){!1!==t&&t!==d.activeElement&&(t&&t.focus?(t.focus({preventScroll:!!p.preventScroll}),h.mostRecentlyFocusedNode=t,function(e){return e.tagName&&"input"===e.tagName.toLowerCase()&&"function"==typeof e.select}(t)&&t.select()):e(g()))},E=function(e){var t=O("setReturnFocus",e);return t||!1!==t&&e},T=function(e){var t=b(e);y(t)>=0||(l(p.clickOutsideDeactivates,e)?v.deactivate({returnFocus:p.returnFocusOnDeactivate&&!a(t,p.tabbableOptions)}):l(p.allowOutsideClick,e)||e.preventDefault())},N=function(e){var t=b(e),n=y(t)>=0;n||t instanceof Document?n&&(h.mostRecentlyFocusedNode=t):(e.stopImmediatePropagation(),F(h.mostRecentlyFocusedNode||g()))},k=function(e){if(function(e){return"Escape"===e.key||"Esc"===e.key||27===e.keyCode}(e)&&!1!==l(p.escapeDeactivates,e))return e.preventDefault(),void v.deactivate();(function(e){return"Tab"===e.key||9===e.keyCode})(e)&&function(e){var t=b(e);w();var r=null;if(h.tabbableGroups.length>0){var o=y(t),i=o>=0?h.containerGroups[o]:void 0;if(o<0)r=e.shiftKey?h.tabbableGroups[h.tabbableGroups.length-1].lastTabbableNode:h.tabbableGroups[0].firstTabbableNode;else if(e.shiftKey){var c=s(h.tabbableGroups,(function(e){var n=e.firstTabbableNode;return t===n}));if(c<0&&(i.container===t||a(t,p.tabbableOptions)&&!n(t,p.tabbableOptions)&&!i.nextTabbableNode(t,!1))&&(c=o),c>=0){var u=0===c?h.tabbableGroups.length-1:c-1;r=h.tabbableGroups[u].lastTabbableNode}}else{var l=s(h.tabbableGroups,(function(e){var n=e.lastTabbableNode;return t===n}));if(l<0&&(i.container===t||a(t,p.tabbableOptions)&&!n(t,p.tabbableOptions)&&!i.nextTabbableNode(t))&&(l=o),l>=0){var f=l===h.tabbableGroups.length-1?0:l+1;r=h.tabbableGroups[f].firstTabbableNode}}}else r=O("fallbackFocus");r&&(e.preventDefault(),F(r))}(e)},G=function(e){if(!l(p.clickOutsideDeactivates,e)){var t=b(e);y(t)>=0||l(p.allowOutsideClick,e)||(e.preventDefault(),e.stopImmediatePropagation())}},D=function(){if(h.active)return c.activateTrap(v),h.delayInitialFocusTimer=p.delayInitialFocus?u((function(){F(g())})):F(g()),d.addEventListener("focusin",N,!0),d.addEventListener("mousedown",T,{capture:!0,passive:!1}),d.addEventListener("touchstart",T,{capture:!0,passive:!1}),d.addEventListener("click",G,{capture:!0,passive:!1}),d.addEventListener("keydown",k,{capture:!0,passive:!1}),v},P=function(){if(h.active)return d.removeEventListener("focusin",N,!0),d.removeEventListener("mousedown",T,!0),d.removeEventListener("touchstart",T,!0),d.removeEventListener("click",G,!0),d.removeEventListener("keydown",k,!0),v};return(v={activate:function(e){if(h.active)return this;var t=m(e,"onActivate"),n=m(e,"onPostActivate"),a=m(e,"checkCanFocusTrap");a||w(),h.active=!0,h.paused=!1,h.nodeFocusedBeforeActivation=d.activeElement,t&&t();var r=function(){a&&w(),D(),n&&n()};return a?(a(h.containers.concat()).then(r,r),this):(r(),this)},deactivate:function(e){if(!h.active)return this;clearTimeout(h.delayInitialFocusTimer),h.delayInitialFocusTimer=void 0,P(),h.active=!1,h.paused=!1,c.deactivateTrap(v);var t=m(e,"onDeactivate"),n=m(e,"onPostDeactivate"),a=m(e,"checkCanReturnFocus");t&&t();var r=m(e,"returnFocus","returnFocusOnDeactivate"),o=function(){u((function(){r&&F(E(h.nodeFocusedBeforeActivation)),n&&n()}))};return r&&a?(a(E(h.nodeFocusedBeforeActivation)).then(o,o),this):(o(),this)},pause:function(){return h.paused||!h.active||(h.paused=!0,P()),this},unpause:function(){return h.paused&&h.active?(h.paused=!1,w(),D(),this):this},updateContainerElements:function(e){var t=[].concat(e).filter(Boolean);return h.containers=t.map((function(e){return"string"==typeof e?d.querySelector(e):e})),h.active&&w(),this}}).updateContainerElements(i),v};export{f as createFocusTrap}; | ||
import{tabbable as e,focusable as t,isTabbable as n,isFocusable as a}from"tabbable";function r(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function o(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?r(Object(n),!0).forEach((function(t){i(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):r(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function i(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var c,u=(c=[],{activateTrap:function(e){if(c.length>0){var t=c[c.length-1];t!==e&&t.pause()}var n=c.indexOf(e);-1===n||c.splice(n,1),c.push(e)},deactivateTrap:function(e){var t=c.indexOf(e);-1!==t&&c.splice(t,1),c.length>0&&c[c.length-1].unpause()}}),s=function(e){return setTimeout(e,0)},l=function(e,t){var n=-1;return e.every((function(e,a){return!t(e)||(n=a,!1)})),n},b=function(e){for(var t=arguments.length,n=new Array(t>1?t-1:0),a=1;a<t;a++)n[a-1]=arguments[a];return"function"==typeof e?e.apply(void 0,n):e},f=function(e){return e.target.shadowRoot&&"function"==typeof e.composedPath?e.composedPath()[0]:e.target},v=function(r,i){var c,v=(null==i?void 0:i.document)||document,d=o({returnFocusOnDeactivate:!0,escapeDeactivates:!0,delayInitialFocus:!0},i),p={containers:[],containerGroups:[],tabbableGroups:[],nodeFocusedBeforeActivation:null,mostRecentlyFocusedNode:null,active:!1,paused:!1,delayInitialFocusTimer:void 0},h=function(e,t,n){return e&&void 0!==e[t]?e[t]:d[n||t]},m=function(e){return p.containerGroups.findIndex((function(t){var n=t.container,a=t.tabbableNodes;return n.contains(e)||a.find((function(t){return t===e}))}))},y=function(e){var t=d[e];if("function"==typeof t){for(var n=arguments.length,a=new Array(n>1?n-1:0),r=1;r<n;r++)a[r-1]=arguments[r];t=t.apply(void 0,a)}if(!t){if(void 0===t||!1===t)return t;throw new Error("`".concat(e,"` was specified but was not a node, or did not return a node"))}var o=t;if("string"==typeof t&&!(o=v.querySelector(t)))throw new Error("`".concat(e,"` as selector refers to no known node"));return o},O=function(){var e=y("initialFocus");if(!1===e)return!1;if(void 0===e)if(m(v.activeElement)>=0)e=v.activeElement;else{var t=p.tabbableGroups[0];e=t&&t.firstTabbableNode||y("fallbackFocus")}if(!e)throw new Error("Your focus-trap needs to have at least one focusable element");return e},g=function(){if(p.containerGroups=p.containers.map((function(a){var r=e(a,d.tabbableOptions),o=t(a,d.tabbableOptions);return{container:a,tabbableNodes:r,focusableNodes:o,firstTabbableNode:r.length>0?r[0]:null,lastTabbableNode:r.length>0?r[r.length-1]:null,nextTabbableNode:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],a=o.findIndex((function(t){return t===e}));if(!(a<0))return t?o.slice(a+1).find((function(e){return n(e,d.tabbableOptions)})):o.slice(0,a).reverse().find((function(e){return n(e,d.tabbableOptions)}))}}})),p.tabbableGroups=p.containerGroups.filter((function(e){return e.tabbableNodes.length>0})),p.tabbableGroups.length<=0&&!y("fallbackFocus"))throw new Error("Your focus-trap must have at least one container with at least one tabbable node in it at all times")},w=function e(t){!1!==t&&t!==v.activeElement&&(t&&t.focus?(t.focus({preventScroll:!!d.preventScroll}),p.mostRecentlyFocusedNode=t,function(e){return e.tagName&&"input"===e.tagName.toLowerCase()&&"function"==typeof e.select}(t)&&t.select()):e(O()))},F=function(e){var t=y("setReturnFocus",e);return t||!1!==t&&e},E=function(e){var t=f(e);m(t)>=0||(b(d.clickOutsideDeactivates,e)?c.deactivate({returnFocus:d.returnFocusOnDeactivate&&!a(t,d.tabbableOptions)}):b(d.allowOutsideClick,e)||e.preventDefault())},T=function(e){var t=f(e),n=m(t)>=0;n||t instanceof Document?n&&(p.mostRecentlyFocusedNode=t):(e.stopImmediatePropagation(),w(p.mostRecentlyFocusedNode||O()))},k=function(e){if(function(e){return"Escape"===e.key||"Esc"===e.key||27===e.keyCode}(e)&&!1!==b(d.escapeDeactivates,e))return e.preventDefault(),void c.deactivate();(function(e){return"Tab"===e.key||9===e.keyCode})(e)&&function(e){var t=f(e);g();var r=null;if(p.tabbableGroups.length>0){var o=m(t),i=o>=0?p.containerGroups[o]:void 0;if(o<0)r=e.shiftKey?p.tabbableGroups[p.tabbableGroups.length-1].lastTabbableNode:p.tabbableGroups[0].firstTabbableNode;else if(e.shiftKey){var c=l(p.tabbableGroups,(function(e){var n=e.firstTabbableNode;return t===n}));if(c<0&&(i.container===t||a(t,d.tabbableOptions)&&!n(t,d.tabbableOptions)&&!i.nextTabbableNode(t,!1))&&(c=o),c>=0){var u=0===c?p.tabbableGroups.length-1:c-1;r=p.tabbableGroups[u].lastTabbableNode}}else{var s=l(p.tabbableGroups,(function(e){var n=e.lastTabbableNode;return t===n}));if(s<0&&(i.container===t||a(t,d.tabbableOptions)&&!n(t,d.tabbableOptions)&&!i.nextTabbableNode(t))&&(s=o),s>=0){var b=s===p.tabbableGroups.length-1?0:s+1;r=p.tabbableGroups[b].firstTabbableNode}}}else r=y("fallbackFocus");r&&(e.preventDefault(),w(r))}(e)},D=function(e){var t=f(e);m(t)>=0||b(d.clickOutsideDeactivates,e)||b(d.allowOutsideClick,e)||(e.preventDefault(),e.stopImmediatePropagation())},N=function(){if(p.active)return u.activateTrap(c),p.delayInitialFocusTimer=d.delayInitialFocus?s((function(){w(O())})):w(O()),v.addEventListener("focusin",T,!0),v.addEventListener("mousedown",E,{capture:!0,passive:!1}),v.addEventListener("touchstart",E,{capture:!0,passive:!1}),v.addEventListener("click",D,{capture:!0,passive:!1}),v.addEventListener("keydown",k,{capture:!0,passive:!1}),c},G=function(){if(p.active)return v.removeEventListener("focusin",T,!0),v.removeEventListener("mousedown",E,!0),v.removeEventListener("touchstart",E,!0),v.removeEventListener("click",D,!0),v.removeEventListener("keydown",k,!0),c};return(c={get active(){return p.active},get paused(){return p.paused},activate:function(e){if(p.active)return this;var t=h(e,"onActivate"),n=h(e,"onPostActivate"),a=h(e,"checkCanFocusTrap");a||g(),p.active=!0,p.paused=!1,p.nodeFocusedBeforeActivation=v.activeElement,t&&t();var r=function(){a&&g(),N(),n&&n()};return a?(a(p.containers.concat()).then(r,r),this):(r(),this)},deactivate:function(e){if(!p.active)return this;var t=o({onDeactivate:d.onDeactivate,onPostDeactivate:d.onPostDeactivate,checkCanReturnFocus:d.checkCanReturnFocus},e);clearTimeout(p.delayInitialFocusTimer),p.delayInitialFocusTimer=void 0,G(),p.active=!1,p.paused=!1,u.deactivateTrap(c);var n=h(t,"onDeactivate"),a=h(t,"onPostDeactivate"),r=h(t,"checkCanReturnFocus"),i=h(t,"returnFocus","returnFocusOnDeactivate");n&&n();var l=function(){s((function(){i&&w(F(p.nodeFocusedBeforeActivation)),a&&a()}))};return i&&r?(r(F(p.nodeFocusedBeforeActivation)).then(l,l),this):(l(),this)},pause:function(){return p.paused||!p.active||(p.paused=!0,G()),this},unpause:function(){return p.paused&&p.active?(p.paused=!1,g(),N(),this):this},updateContainerElements:function(e){var t=[].concat(e).filter(Boolean);return p.containers=t.map((function(e){return"string"==typeof e?v.querySelector(e):e})),p.active&&g(),this}}).updateContainerElements(r),c};export{v as createFocusTrap}; | ||
//# sourceMappingURL=focus-trap.esm.min.js.map |
/*! | ||
* focus-trap 6.8.1 | ||
* focus-trap 6.9.0 | ||
* @license MIT, https://github.com/focus-trap/focus-trap/blob/master/LICENSE | ||
@@ -557,6 +557,2 @@ */ | ||
var checkClick = function checkClick(e) { | ||
if (valueOrHandler(config.clickOutsideDeactivates, e)) { | ||
return; | ||
} | ||
var target = getActualTarget(e); | ||
@@ -568,2 +564,6 @@ | ||
if (valueOrHandler(config.clickOutsideDeactivates, e)) { | ||
return; | ||
} | ||
if (valueOrHandler(config.allowOutsideClick, e)) { | ||
@@ -629,2 +629,10 @@ return; | ||
trap = { | ||
get active() { | ||
return state.active; | ||
}, | ||
get paused() { | ||
return state.paused; | ||
}, | ||
activate: function activate(activateOptions) { | ||
@@ -676,2 +684,8 @@ if (state.active) { | ||
var options = _objectSpread2({ | ||
onDeactivate: config.onDeactivate, | ||
onPostDeactivate: config.onPostDeactivate, | ||
checkCanReturnFocus: config.checkCanReturnFocus | ||
}, deactivateOptions); | ||
clearTimeout(state.delayInitialFocusTimer); // noop if undefined | ||
@@ -684,5 +698,6 @@ | ||
activeFocusTraps.deactivateTrap(trap); | ||
var onDeactivate = getOption(deactivateOptions, 'onDeactivate'); | ||
var onPostDeactivate = getOption(deactivateOptions, 'onPostDeactivate'); | ||
var checkCanReturnFocus = getOption(deactivateOptions, 'checkCanReturnFocus'); | ||
var onDeactivate = getOption(options, 'onDeactivate'); | ||
var onPostDeactivate = getOption(options, 'onPostDeactivate'); | ||
var checkCanReturnFocus = getOption(options, 'checkCanReturnFocus'); | ||
var returnFocus = getOption(options, 'returnFocus', 'returnFocusOnDeactivate'); | ||
@@ -693,4 +708,2 @@ if (onDeactivate) { | ||
var returnFocus = getOption(deactivateOptions, 'returnFocus', 'returnFocusOnDeactivate'); | ||
var finishDeactivation = function finishDeactivation() { | ||
@@ -697,0 +710,0 @@ delay(function () { |
/*! | ||
* focus-trap 6.8.1 | ||
* focus-trap 6.9.0 | ||
* @license MIT, https://github.com/focus-trap/focus-trap/blob/master/LICENSE | ||
*/ | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tabbable");function t(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function n(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var a,r=(a=[],{activateTrap:function(e){if(a.length>0){var t=a[a.length-1];t!==e&&t.pause()}var n=a.indexOf(e);-1===n||a.splice(n,1),a.push(e)},deactivateTrap:function(e){var t=a.indexOf(e);-1!==t&&a.splice(t,1),a.length>0&&a[a.length-1].unpause()}}),o=function(e){return setTimeout(e,0)},i=function(e,t){var n=-1;return e.every((function(e,a){return!t(e)||(n=a,!1)})),n},c=function(e){for(var t=arguments.length,n=new Array(t>1?t-1:0),a=1;a<t;a++)n[a-1]=arguments[a];return"function"==typeof e?e.apply(void 0,n):e},u=function(e){return e.target.shadowRoot&&"function"==typeof e.composedPath?e.composedPath()[0]:e.target};exports.createFocusTrap=function(a,s){var l,b=(null==s?void 0:s.document)||document,f=function(e){for(var a=1;a<arguments.length;a++){var r=null!=arguments[a]?arguments[a]:{};a%2?t(Object(r),!0).forEach((function(t){n(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):t(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}({returnFocusOnDeactivate:!0,escapeDeactivates:!0,delayInitialFocus:!0},s),v={containers:[],containerGroups:[],tabbableGroups:[],nodeFocusedBeforeActivation:null,mostRecentlyFocusedNode:null,active:!1,paused:!1,delayInitialFocusTimer:void 0},d=function(e,t,n){return e&&void 0!==e[t]?e[t]:f[n||t]},p=function(e){return v.containerGroups.findIndex((function(t){var n=t.container,a=t.tabbableNodes;return n.contains(e)||a.find((function(t){return t===e}))}))},h=function(e){var t=f[e];if("function"==typeof t){for(var n=arguments.length,a=new Array(n>1?n-1:0),r=1;r<n;r++)a[r-1]=arguments[r];t=t.apply(void 0,a)}if(!t){if(void 0===t||!1===t)return t;throw new Error("`".concat(e,"` was specified but was not a node, or did not return a node"))}var o=t;if("string"==typeof t&&!(o=b.querySelector(t)))throw new Error("`".concat(e,"` as selector refers to no known node"));return o},y=function(){var e=h("initialFocus");if(!1===e)return!1;if(void 0===e)if(p(b.activeElement)>=0)e=b.activeElement;else{var t=v.tabbableGroups[0];e=t&&t.firstTabbableNode||h("fallbackFocus")}if(!e)throw new Error("Your focus-trap needs to have at least one focusable element");return e},m=function(){if(v.containerGroups=v.containers.map((function(t){var n=e.tabbable(t,f.tabbableOptions),a=e.focusable(t,f.tabbableOptions);return{container:t,tabbableNodes:n,focusableNodes:a,firstTabbableNode:n.length>0?n[0]:null,lastTabbableNode:n.length>0?n[n.length-1]:null,nextTabbableNode:function(t){var n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],r=a.findIndex((function(e){return e===t}));if(!(r<0))return n?a.slice(r+1).find((function(t){return e.isTabbable(t,f.tabbableOptions)})):a.slice(0,r).reverse().find((function(t){return e.isTabbable(t,f.tabbableOptions)}))}}})),v.tabbableGroups=v.containerGroups.filter((function(e){return e.tabbableNodes.length>0})),v.tabbableGroups.length<=0&&!h("fallbackFocus"))throw new Error("Your focus-trap must have at least one container with at least one tabbable node in it at all times")},O=function e(t){!1!==t&&t!==b.activeElement&&(t&&t.focus?(t.focus({preventScroll:!!f.preventScroll}),v.mostRecentlyFocusedNode=t,function(e){return e.tagName&&"input"===e.tagName.toLowerCase()&&"function"==typeof e.select}(t)&&t.select()):e(y()))},g=function(e){var t=h("setReturnFocus",e);return t||!1!==t&&e},F=function(t){var n=u(t);p(n)>=0||(c(f.clickOutsideDeactivates,t)?l.deactivate({returnFocus:f.returnFocusOnDeactivate&&!e.isFocusable(n,f.tabbableOptions)}):c(f.allowOutsideClick,t)||t.preventDefault())},w=function(e){var t=u(e),n=p(t)>=0;n||t instanceof Document?n&&(v.mostRecentlyFocusedNode=t):(e.stopImmediatePropagation(),O(v.mostRecentlyFocusedNode||y()))},T=function(t){if(function(e){return"Escape"===e.key||"Esc"===e.key||27===e.keyCode}(t)&&!1!==c(f.escapeDeactivates,t))return t.preventDefault(),void l.deactivate();(function(e){return"Tab"===e.key||9===e.keyCode})(t)&&function(t){var n=u(t);m();var a=null;if(v.tabbableGroups.length>0){var r=p(n),o=r>=0?v.containerGroups[r]:void 0;if(r<0)a=t.shiftKey?v.tabbableGroups[v.tabbableGroups.length-1].lastTabbableNode:v.tabbableGroups[0].firstTabbableNode;else if(t.shiftKey){var c=i(v.tabbableGroups,(function(e){var t=e.firstTabbableNode;return n===t}));if(c<0&&(o.container===n||e.isFocusable(n,f.tabbableOptions)&&!e.isTabbable(n,f.tabbableOptions)&&!o.nextTabbableNode(n,!1))&&(c=r),c>=0){var s=0===c?v.tabbableGroups.length-1:c-1;a=v.tabbableGroups[s].lastTabbableNode}}else{var l=i(v.tabbableGroups,(function(e){var t=e.lastTabbableNode;return n===t}));if(l<0&&(o.container===n||e.isFocusable(n,f.tabbableOptions)&&!e.isTabbable(n,f.tabbableOptions)&&!o.nextTabbableNode(n))&&(l=r),l>=0){var b=l===v.tabbableGroups.length-1?0:l+1;a=v.tabbableGroups[b].firstTabbableNode}}}else a=h("fallbackFocus");a&&(t.preventDefault(),O(a))}(t)},E=function(e){if(!c(f.clickOutsideDeactivates,e)){var t=u(e);p(t)>=0||c(f.allowOutsideClick,e)||(e.preventDefault(),e.stopImmediatePropagation())}},N=function(){if(v.active)return r.activateTrap(l),v.delayInitialFocusTimer=f.delayInitialFocus?o((function(){O(y())})):O(y()),b.addEventListener("focusin",w,!0),b.addEventListener("mousedown",F,{capture:!0,passive:!1}),b.addEventListener("touchstart",F,{capture:!0,passive:!1}),b.addEventListener("click",E,{capture:!0,passive:!1}),b.addEventListener("keydown",T,{capture:!0,passive:!1}),l},k=function(){if(v.active)return b.removeEventListener("focusin",w,!0),b.removeEventListener("mousedown",F,!0),b.removeEventListener("touchstart",F,!0),b.removeEventListener("click",E,!0),b.removeEventListener("keydown",T,!0),l};return(l={activate:function(e){if(v.active)return this;var t=d(e,"onActivate"),n=d(e,"onPostActivate"),a=d(e,"checkCanFocusTrap");a||m(),v.active=!0,v.paused=!1,v.nodeFocusedBeforeActivation=b.activeElement,t&&t();var r=function(){a&&m(),N(),n&&n()};return a?(a(v.containers.concat()).then(r,r),this):(r(),this)},deactivate:function(e){if(!v.active)return this;clearTimeout(v.delayInitialFocusTimer),v.delayInitialFocusTimer=void 0,k(),v.active=!1,v.paused=!1,r.deactivateTrap(l);var t=d(e,"onDeactivate"),n=d(e,"onPostDeactivate"),a=d(e,"checkCanReturnFocus");t&&t();var i=d(e,"returnFocus","returnFocusOnDeactivate"),c=function(){o((function(){i&&O(g(v.nodeFocusedBeforeActivation)),n&&n()}))};return i&&a?(a(g(v.nodeFocusedBeforeActivation)).then(c,c),this):(c(),this)},pause:function(){return v.paused||!v.active||(v.paused=!0,k()),this},unpause:function(){return v.paused&&v.active?(v.paused=!1,m(),N(),this):this},updateContainerElements:function(e){var t=[].concat(e).filter(Boolean);return v.containers=t.map((function(e){return"string"==typeof e?b.querySelector(e):e})),v.active&&m(),this}}).updateContainerElements(a),l}; | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tabbable");function t(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function n(e){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{};n%2?t(Object(r),!0).forEach((function(t){a(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):t(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function a(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var r,o=(r=[],{activateTrap:function(e){if(r.length>0){var t=r[r.length-1];t!==e&&t.pause()}var n=r.indexOf(e);-1===n||r.splice(n,1),r.push(e)},deactivateTrap:function(e){var t=r.indexOf(e);-1!==t&&r.splice(t,1),r.length>0&&r[r.length-1].unpause()}}),i=function(e){return setTimeout(e,0)},c=function(e,t){var n=-1;return e.every((function(e,a){return!t(e)||(n=a,!1)})),n},u=function(e){for(var t=arguments.length,n=new Array(t>1?t-1:0),a=1;a<t;a++)n[a-1]=arguments[a];return"function"==typeof e?e.apply(void 0,n):e},s=function(e){return e.target.shadowRoot&&"function"==typeof e.composedPath?e.composedPath()[0]:e.target};exports.createFocusTrap=function(t,a){var r,l=(null==a?void 0:a.document)||document,b=n({returnFocusOnDeactivate:!0,escapeDeactivates:!0,delayInitialFocus:!0},a),f={containers:[],containerGroups:[],tabbableGroups:[],nodeFocusedBeforeActivation:null,mostRecentlyFocusedNode:null,active:!1,paused:!1,delayInitialFocusTimer:void 0},v=function(e,t,n){return e&&void 0!==e[t]?e[t]:b[n||t]},d=function(e){return f.containerGroups.findIndex((function(t){var n=t.container,a=t.tabbableNodes;return n.contains(e)||a.find((function(t){return t===e}))}))},p=function(e){var t=b[e];if("function"==typeof t){for(var n=arguments.length,a=new Array(n>1?n-1:0),r=1;r<n;r++)a[r-1]=arguments[r];t=t.apply(void 0,a)}if(!t){if(void 0===t||!1===t)return t;throw new Error("`".concat(e,"` was specified but was not a node, or did not return a node"))}var o=t;if("string"==typeof t&&!(o=l.querySelector(t)))throw new Error("`".concat(e,"` as selector refers to no known node"));return o},h=function(){var e=p("initialFocus");if(!1===e)return!1;if(void 0===e)if(d(l.activeElement)>=0)e=l.activeElement;else{var t=f.tabbableGroups[0];e=t&&t.firstTabbableNode||p("fallbackFocus")}if(!e)throw new Error("Your focus-trap needs to have at least one focusable element");return e},y=function(){if(f.containerGroups=f.containers.map((function(t){var n=e.tabbable(t,b.tabbableOptions),a=e.focusable(t,b.tabbableOptions);return{container:t,tabbableNodes:n,focusableNodes:a,firstTabbableNode:n.length>0?n[0]:null,lastTabbableNode:n.length>0?n[n.length-1]:null,nextTabbableNode:function(t){var n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],r=a.findIndex((function(e){return e===t}));if(!(r<0))return n?a.slice(r+1).find((function(t){return e.isTabbable(t,b.tabbableOptions)})):a.slice(0,r).reverse().find((function(t){return e.isTabbable(t,b.tabbableOptions)}))}}})),f.tabbableGroups=f.containerGroups.filter((function(e){return e.tabbableNodes.length>0})),f.tabbableGroups.length<=0&&!p("fallbackFocus"))throw new Error("Your focus-trap must have at least one container with at least one tabbable node in it at all times")},m=function e(t){!1!==t&&t!==l.activeElement&&(t&&t.focus?(t.focus({preventScroll:!!b.preventScroll}),f.mostRecentlyFocusedNode=t,function(e){return e.tagName&&"input"===e.tagName.toLowerCase()&&"function"==typeof e.select}(t)&&t.select()):e(h()))},O=function(e){var t=p("setReturnFocus",e);return t||!1!==t&&e},g=function(t){var n=s(t);d(n)>=0||(u(b.clickOutsideDeactivates,t)?r.deactivate({returnFocus:b.returnFocusOnDeactivate&&!e.isFocusable(n,b.tabbableOptions)}):u(b.allowOutsideClick,t)||t.preventDefault())},F=function(e){var t=s(e),n=d(t)>=0;n||t instanceof Document?n&&(f.mostRecentlyFocusedNode=t):(e.stopImmediatePropagation(),m(f.mostRecentlyFocusedNode||h()))},w=function(t){if(function(e){return"Escape"===e.key||"Esc"===e.key||27===e.keyCode}(t)&&!1!==u(b.escapeDeactivates,t))return t.preventDefault(),void r.deactivate();(function(e){return"Tab"===e.key||9===e.keyCode})(t)&&function(t){var n=s(t);y();var a=null;if(f.tabbableGroups.length>0){var r=d(n),o=r>=0?f.containerGroups[r]:void 0;if(r<0)a=t.shiftKey?f.tabbableGroups[f.tabbableGroups.length-1].lastTabbableNode:f.tabbableGroups[0].firstTabbableNode;else if(t.shiftKey){var i=c(f.tabbableGroups,(function(e){var t=e.firstTabbableNode;return n===t}));if(i<0&&(o.container===n||e.isFocusable(n,b.tabbableOptions)&&!e.isTabbable(n,b.tabbableOptions)&&!o.nextTabbableNode(n,!1))&&(i=r),i>=0){var u=0===i?f.tabbableGroups.length-1:i-1;a=f.tabbableGroups[u].lastTabbableNode}}else{var l=c(f.tabbableGroups,(function(e){var t=e.lastTabbableNode;return n===t}));if(l<0&&(o.container===n||e.isFocusable(n,b.tabbableOptions)&&!e.isTabbable(n,b.tabbableOptions)&&!o.nextTabbableNode(n))&&(l=r),l>=0){var v=l===f.tabbableGroups.length-1?0:l+1;a=f.tabbableGroups[v].firstTabbableNode}}}else a=p("fallbackFocus");a&&(t.preventDefault(),m(a))}(t)},T=function(e){var t=s(e);d(t)>=0||u(b.clickOutsideDeactivates,e)||u(b.allowOutsideClick,e)||(e.preventDefault(),e.stopImmediatePropagation())},E=function(){if(f.active)return o.activateTrap(r),f.delayInitialFocusTimer=b.delayInitialFocus?i((function(){m(h())})):m(h()),l.addEventListener("focusin",F,!0),l.addEventListener("mousedown",g,{capture:!0,passive:!1}),l.addEventListener("touchstart",g,{capture:!0,passive:!1}),l.addEventListener("click",T,{capture:!0,passive:!1}),l.addEventListener("keydown",w,{capture:!0,passive:!1}),r},k=function(){if(f.active)return l.removeEventListener("focusin",F,!0),l.removeEventListener("mousedown",g,!0),l.removeEventListener("touchstart",g,!0),l.removeEventListener("click",T,!0),l.removeEventListener("keydown",w,!0),r};return(r={get active(){return f.active},get paused(){return f.paused},activate:function(e){if(f.active)return this;var t=v(e,"onActivate"),n=v(e,"onPostActivate"),a=v(e,"checkCanFocusTrap");a||y(),f.active=!0,f.paused=!1,f.nodeFocusedBeforeActivation=l.activeElement,t&&t();var r=function(){a&&y(),E(),n&&n()};return a?(a(f.containers.concat()).then(r,r),this):(r(),this)},deactivate:function(e){if(!f.active)return this;var t=n({onDeactivate:b.onDeactivate,onPostDeactivate:b.onPostDeactivate,checkCanReturnFocus:b.checkCanReturnFocus},e);clearTimeout(f.delayInitialFocusTimer),f.delayInitialFocusTimer=void 0,k(),f.active=!1,f.paused=!1,o.deactivateTrap(r);var a=v(t,"onDeactivate"),c=v(t,"onPostDeactivate"),u=v(t,"checkCanReturnFocus"),s=v(t,"returnFocus","returnFocusOnDeactivate");a&&a();var l=function(){i((function(){s&&m(O(f.nodeFocusedBeforeActivation)),c&&c()}))};return s&&u?(u(O(f.nodeFocusedBeforeActivation)).then(l,l),this):(l(),this)},pause:function(){return f.paused||!f.active||(f.paused=!0,k()),this},unpause:function(){return f.paused&&f.active?(f.paused=!1,y(),E(),this):this},updateContainerElements:function(e){var t=[].concat(e).filter(Boolean);return f.containers=t.map((function(e){return"string"==typeof e?l.querySelector(e):e})),f.active&&y(),this}}).updateContainerElements(t),r}; | ||
//# sourceMappingURL=focus-trap.min.js.map |
/*! | ||
* focus-trap 6.8.1 | ||
* focus-trap 6.9.0 | ||
* @license MIT, https://github.com/focus-trap/focus-trap/blob/master/LICENSE | ||
@@ -562,6 +562,2 @@ */ | ||
var checkClick = function checkClick(e) { | ||
if (valueOrHandler(config.clickOutsideDeactivates, e)) { | ||
return; | ||
} | ||
var target = getActualTarget(e); | ||
@@ -573,2 +569,6 @@ | ||
if (valueOrHandler(config.clickOutsideDeactivates, e)) { | ||
return; | ||
} | ||
if (valueOrHandler(config.allowOutsideClick, e)) { | ||
@@ -634,2 +634,10 @@ return; | ||
trap = { | ||
get active() { | ||
return state.active; | ||
}, | ||
get paused() { | ||
return state.paused; | ||
}, | ||
activate: function activate(activateOptions) { | ||
@@ -681,2 +689,8 @@ if (state.active) { | ||
var options = _objectSpread2({ | ||
onDeactivate: config.onDeactivate, | ||
onPostDeactivate: config.onPostDeactivate, | ||
checkCanReturnFocus: config.checkCanReturnFocus | ||
}, deactivateOptions); | ||
clearTimeout(state.delayInitialFocusTimer); // noop if undefined | ||
@@ -689,5 +703,6 @@ | ||
activeFocusTraps.deactivateTrap(trap); | ||
var onDeactivate = getOption(deactivateOptions, 'onDeactivate'); | ||
var onPostDeactivate = getOption(deactivateOptions, 'onPostDeactivate'); | ||
var checkCanReturnFocus = getOption(deactivateOptions, 'checkCanReturnFocus'); | ||
var onDeactivate = getOption(options, 'onDeactivate'); | ||
var onPostDeactivate = getOption(options, 'onPostDeactivate'); | ||
var checkCanReturnFocus = getOption(options, 'checkCanReturnFocus'); | ||
var returnFocus = getOption(options, 'returnFocus', 'returnFocusOnDeactivate'); | ||
@@ -698,4 +713,2 @@ if (onDeactivate) { | ||
var returnFocus = getOption(deactivateOptions, 'returnFocus', 'returnFocusOnDeactivate'); | ||
var finishDeactivation = function finishDeactivation() { | ||
@@ -702,0 +715,0 @@ delay(function () { |
/*! | ||
* focus-trap 6.8.1 | ||
* focus-trap 6.9.0 | ||
* @license MIT, https://github.com/focus-trap/focus-trap/blob/master/LICENSE | ||
*/ | ||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("tabbable")):"function"==typeof define&&define.amd?define(["exports","tabbable"],t):(e="undefined"!=typeof globalThis?globalThis:e||self,function(){var n=e.focusTrap,a=e.focusTrap={};t(a,e.tabbable),a.noConflict=function(){return e.focusTrap=n,a}}())}(this,(function(e,t){"use strict";function n(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function a(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var o,r=(o=[],{activateTrap:function(e){if(o.length>0){var t=o[o.length-1];t!==e&&t.pause()}var n=o.indexOf(e);-1===n||o.splice(n,1),o.push(e)},deactivateTrap:function(e){var t=o.indexOf(e);-1!==t&&o.splice(t,1),o.length>0&&o[o.length-1].unpause()}}),i=function(e){return setTimeout(e,0)},c=function(e,t){var n=-1;return e.every((function(e,a){return!t(e)||(n=a,!1)})),n},u=function(e){for(var t=arguments.length,n=new Array(t>1?t-1:0),a=1;a<t;a++)n[a-1]=arguments[a];return"function"==typeof e?e.apply(void 0,n):e},s=function(e){return e.target.shadowRoot&&"function"==typeof e.composedPath?e.composedPath()[0]:e.target};e.createFocusTrap=function(e,o){var l,b=(null==o?void 0:o.document)||document,f=function(e){for(var t=1;t<arguments.length;t++){var o=null!=arguments[t]?arguments[t]:{};t%2?n(Object(o),!0).forEach((function(t){a(e,t,o[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(o)):n(Object(o)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(o,t))}))}return e}({returnFocusOnDeactivate:!0,escapeDeactivates:!0,delayInitialFocus:!0},o),d={containers:[],containerGroups:[],tabbableGroups:[],nodeFocusedBeforeActivation:null,mostRecentlyFocusedNode:null,active:!1,paused:!1,delayInitialFocusTimer:void 0},v=function(e,t,n){return e&&void 0!==e[t]?e[t]:f[n||t]},p=function(e){return d.containerGroups.findIndex((function(t){var n=t.container,a=t.tabbableNodes;return n.contains(e)||a.find((function(t){return t===e}))}))},h=function(e){var t=f[e];if("function"==typeof t){for(var n=arguments.length,a=new Array(n>1?n-1:0),o=1;o<n;o++)a[o-1]=arguments[o];t=t.apply(void 0,a)}if(!t){if(void 0===t||!1===t)return t;throw new Error("`".concat(e,"` was specified but was not a node, or did not return a node"))}var r=t;if("string"==typeof t&&!(r=b.querySelector(t)))throw new Error("`".concat(e,"` as selector refers to no known node"));return r},y=function(){var e=h("initialFocus");if(!1===e)return!1;if(void 0===e)if(p(b.activeElement)>=0)e=b.activeElement;else{var t=d.tabbableGroups[0];e=t&&t.firstTabbableNode||h("fallbackFocus")}if(!e)throw new Error("Your focus-trap needs to have at least one focusable element");return e},m=function(){if(d.containerGroups=d.containers.map((function(e){var n=t.tabbable(e,f.tabbableOptions),a=t.focusable(e,f.tabbableOptions);return{container:e,tabbableNodes:n,focusableNodes:a,firstTabbableNode:n.length>0?n[0]:null,lastTabbableNode:n.length>0?n[n.length-1]:null,nextTabbableNode:function(e){var n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],o=a.findIndex((function(t){return t===e}));if(!(o<0))return n?a.slice(o+1).find((function(e){return t.isTabbable(e,f.tabbableOptions)})):a.slice(0,o).reverse().find((function(e){return t.isTabbable(e,f.tabbableOptions)}))}}})),d.tabbableGroups=d.containerGroups.filter((function(e){return e.tabbableNodes.length>0})),d.tabbableGroups.length<=0&&!h("fallbackFocus"))throw new Error("Your focus-trap must have at least one container with at least one tabbable node in it at all times")},O=function e(t){!1!==t&&t!==b.activeElement&&(t&&t.focus?(t.focus({preventScroll:!!f.preventScroll}),d.mostRecentlyFocusedNode=t,function(e){return e.tagName&&"input"===e.tagName.toLowerCase()&&"function"==typeof e.select}(t)&&t.select()):e(y()))},g=function(e){var t=h("setReturnFocus",e);return t||!1!==t&&e},T=function(e){var n=s(e);p(n)>=0||(u(f.clickOutsideDeactivates,e)?l.deactivate({returnFocus:f.returnFocusOnDeactivate&&!t.isFocusable(n,f.tabbableOptions)}):u(f.allowOutsideClick,e)||e.preventDefault())},F=function(e){var t=s(e),n=p(t)>=0;n||t instanceof Document?n&&(d.mostRecentlyFocusedNode=t):(e.stopImmediatePropagation(),O(d.mostRecentlyFocusedNode||y()))},w=function(e){if(function(e){return"Escape"===e.key||"Esc"===e.key||27===e.keyCode}(e)&&!1!==u(f.escapeDeactivates,e))return e.preventDefault(),void l.deactivate();(function(e){return"Tab"===e.key||9===e.keyCode})(e)&&function(e){var n=s(e);m();var a=null;if(d.tabbableGroups.length>0){var o=p(n),r=o>=0?d.containerGroups[o]:void 0;if(o<0)a=e.shiftKey?d.tabbableGroups[d.tabbableGroups.length-1].lastTabbableNode:d.tabbableGroups[0].firstTabbableNode;else if(e.shiftKey){var i=c(d.tabbableGroups,(function(e){var t=e.firstTabbableNode;return n===t}));if(i<0&&(r.container===n||t.isFocusable(n,f.tabbableOptions)&&!t.isTabbable(n,f.tabbableOptions)&&!r.nextTabbableNode(n,!1))&&(i=o),i>=0){var u=0===i?d.tabbableGroups.length-1:i-1;a=d.tabbableGroups[u].lastTabbableNode}}else{var l=c(d.tabbableGroups,(function(e){var t=e.lastTabbableNode;return n===t}));if(l<0&&(r.container===n||t.isFocusable(n,f.tabbableOptions)&&!t.isTabbable(n,f.tabbableOptions)&&!r.nextTabbableNode(n))&&(l=o),l>=0){var b=l===d.tabbableGroups.length-1?0:l+1;a=d.tabbableGroups[b].firstTabbableNode}}}else a=h("fallbackFocus");a&&(e.preventDefault(),O(a))}(e)},E=function(e){if(!u(f.clickOutsideDeactivates,e)){var t=s(e);p(t)>=0||u(f.allowOutsideClick,e)||(e.preventDefault(),e.stopImmediatePropagation())}},N=function(){if(d.active)return r.activateTrap(l),d.delayInitialFocusTimer=f.delayInitialFocus?i((function(){O(y())})):O(y()),b.addEventListener("focusin",F,!0),b.addEventListener("mousedown",T,{capture:!0,passive:!1}),b.addEventListener("touchstart",T,{capture:!0,passive:!1}),b.addEventListener("click",E,{capture:!0,passive:!1}),b.addEventListener("keydown",w,{capture:!0,passive:!1}),l},k=function(){if(d.active)return b.removeEventListener("focusin",F,!0),b.removeEventListener("mousedown",T,!0),b.removeEventListener("touchstart",T,!0),b.removeEventListener("click",E,!0),b.removeEventListener("keydown",w,!0),l};return(l={activate:function(e){if(d.active)return this;var t=v(e,"onActivate"),n=v(e,"onPostActivate"),a=v(e,"checkCanFocusTrap");a||m(),d.active=!0,d.paused=!1,d.nodeFocusedBeforeActivation=b.activeElement,t&&t();var o=function(){a&&m(),N(),n&&n()};return a?(a(d.containers.concat()).then(o,o),this):(o(),this)},deactivate:function(e){if(!d.active)return this;clearTimeout(d.delayInitialFocusTimer),d.delayInitialFocusTimer=void 0,k(),d.active=!1,d.paused=!1,r.deactivateTrap(l);var t=v(e,"onDeactivate"),n=v(e,"onPostDeactivate"),a=v(e,"checkCanReturnFocus");t&&t();var o=v(e,"returnFocus","returnFocusOnDeactivate"),c=function(){i((function(){o&&O(g(d.nodeFocusedBeforeActivation)),n&&n()}))};return o&&a?(a(g(d.nodeFocusedBeforeActivation)).then(c,c),this):(c(),this)},pause:function(){return d.paused||!d.active||(d.paused=!0,k()),this},unpause:function(){return d.paused&&d.active?(d.paused=!1,m(),N(),this):this},updateContainerElements:function(e){var t=[].concat(e).filter(Boolean);return d.containers=t.map((function(e){return"string"==typeof e?b.querySelector(e):e})),d.active&&m(),this}}).updateContainerElements(e),l},Object.defineProperty(e,"__esModule",{value:!0})})); | ||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("tabbable")):"function"==typeof define&&define.amd?define(["exports","tabbable"],t):(e="undefined"!=typeof globalThis?globalThis:e||self,function(){var n=e.focusTrap,a=e.focusTrap={};t(a,e.tabbable),a.noConflict=function(){return e.focusTrap=n,a}}())}(this,(function(e,t){"use strict";function n(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function a(e){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{};t%2?n(Object(a),!0).forEach((function(t){o(e,t,a[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(a)):n(Object(a)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(a,t))}))}return e}function o(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var r,i=(r=[],{activateTrap:function(e){if(r.length>0){var t=r[r.length-1];t!==e&&t.pause()}var n=r.indexOf(e);-1===n||r.splice(n,1),r.push(e)},deactivateTrap:function(e){var t=r.indexOf(e);-1!==t&&r.splice(t,1),r.length>0&&r[r.length-1].unpause()}}),c=function(e){return setTimeout(e,0)},u=function(e,t){var n=-1;return e.every((function(e,a){return!t(e)||(n=a,!1)})),n},s=function(e){for(var t=arguments.length,n=new Array(t>1?t-1:0),a=1;a<t;a++)n[a-1]=arguments[a];return"function"==typeof e?e.apply(void 0,n):e},l=function(e){return e.target.shadowRoot&&"function"==typeof e.composedPath?e.composedPath()[0]:e.target};e.createFocusTrap=function(e,n){var o,r=(null==n?void 0:n.document)||document,b=a({returnFocusOnDeactivate:!0,escapeDeactivates:!0,delayInitialFocus:!0},n),f={containers:[],containerGroups:[],tabbableGroups:[],nodeFocusedBeforeActivation:null,mostRecentlyFocusedNode:null,active:!1,paused:!1,delayInitialFocusTimer:void 0},v=function(e,t,n){return e&&void 0!==e[t]?e[t]:b[n||t]},d=function(e){return f.containerGroups.findIndex((function(t){var n=t.container,a=t.tabbableNodes;return n.contains(e)||a.find((function(t){return t===e}))}))},p=function(e){var t=b[e];if("function"==typeof t){for(var n=arguments.length,a=new Array(n>1?n-1:0),o=1;o<n;o++)a[o-1]=arguments[o];t=t.apply(void 0,a)}if(!t){if(void 0===t||!1===t)return t;throw new Error("`".concat(e,"` was specified but was not a node, or did not return a node"))}var i=t;if("string"==typeof t&&!(i=r.querySelector(t)))throw new Error("`".concat(e,"` as selector refers to no known node"));return i},h=function(){var e=p("initialFocus");if(!1===e)return!1;if(void 0===e)if(d(r.activeElement)>=0)e=r.activeElement;else{var t=f.tabbableGroups[0];e=t&&t.firstTabbableNode||p("fallbackFocus")}if(!e)throw new Error("Your focus-trap needs to have at least one focusable element");return e},y=function(){if(f.containerGroups=f.containers.map((function(e){var n=t.tabbable(e,b.tabbableOptions),a=t.focusable(e,b.tabbableOptions);return{container:e,tabbableNodes:n,focusableNodes:a,firstTabbableNode:n.length>0?n[0]:null,lastTabbableNode:n.length>0?n[n.length-1]:null,nextTabbableNode:function(e){var n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],o=a.findIndex((function(t){return t===e}));if(!(o<0))return n?a.slice(o+1).find((function(e){return t.isTabbable(e,b.tabbableOptions)})):a.slice(0,o).reverse().find((function(e){return t.isTabbable(e,b.tabbableOptions)}))}}})),f.tabbableGroups=f.containerGroups.filter((function(e){return e.tabbableNodes.length>0})),f.tabbableGroups.length<=0&&!p("fallbackFocus"))throw new Error("Your focus-trap must have at least one container with at least one tabbable node in it at all times")},m=function e(t){!1!==t&&t!==r.activeElement&&(t&&t.focus?(t.focus({preventScroll:!!b.preventScroll}),f.mostRecentlyFocusedNode=t,function(e){return e.tagName&&"input"===e.tagName.toLowerCase()&&"function"==typeof e.select}(t)&&t.select()):e(h()))},O=function(e){var t=p("setReturnFocus",e);return t||!1!==t&&e},g=function(e){var n=l(e);d(n)>=0||(s(b.clickOutsideDeactivates,e)?o.deactivate({returnFocus:b.returnFocusOnDeactivate&&!t.isFocusable(n,b.tabbableOptions)}):s(b.allowOutsideClick,e)||e.preventDefault())},T=function(e){var t=l(e),n=d(t)>=0;n||t instanceof Document?n&&(f.mostRecentlyFocusedNode=t):(e.stopImmediatePropagation(),m(f.mostRecentlyFocusedNode||h()))},F=function(e){if(function(e){return"Escape"===e.key||"Esc"===e.key||27===e.keyCode}(e)&&!1!==s(b.escapeDeactivates,e))return e.preventDefault(),void o.deactivate();(function(e){return"Tab"===e.key||9===e.keyCode})(e)&&function(e){var n=l(e);y();var a=null;if(f.tabbableGroups.length>0){var o=d(n),r=o>=0?f.containerGroups[o]:void 0;if(o<0)a=e.shiftKey?f.tabbableGroups[f.tabbableGroups.length-1].lastTabbableNode:f.tabbableGroups[0].firstTabbableNode;else if(e.shiftKey){var i=u(f.tabbableGroups,(function(e){var t=e.firstTabbableNode;return n===t}));if(i<0&&(r.container===n||t.isFocusable(n,b.tabbableOptions)&&!t.isTabbable(n,b.tabbableOptions)&&!r.nextTabbableNode(n,!1))&&(i=o),i>=0){var c=0===i?f.tabbableGroups.length-1:i-1;a=f.tabbableGroups[c].lastTabbableNode}}else{var s=u(f.tabbableGroups,(function(e){var t=e.lastTabbableNode;return n===t}));if(s<0&&(r.container===n||t.isFocusable(n,b.tabbableOptions)&&!t.isTabbable(n,b.tabbableOptions)&&!r.nextTabbableNode(n))&&(s=o),s>=0){var v=s===f.tabbableGroups.length-1?0:s+1;a=f.tabbableGroups[v].firstTabbableNode}}}else a=p("fallbackFocus");a&&(e.preventDefault(),m(a))}(e)},w=function(e){var t=l(e);d(t)>=0||s(b.clickOutsideDeactivates,e)||s(b.allowOutsideClick,e)||(e.preventDefault(),e.stopImmediatePropagation())},E=function(){if(f.active)return i.activateTrap(o),f.delayInitialFocusTimer=b.delayInitialFocus?c((function(){m(h())})):m(h()),r.addEventListener("focusin",T,!0),r.addEventListener("mousedown",g,{capture:!0,passive:!1}),r.addEventListener("touchstart",g,{capture:!0,passive:!1}),r.addEventListener("click",w,{capture:!0,passive:!1}),r.addEventListener("keydown",F,{capture:!0,passive:!1}),o},k=function(){if(f.active)return r.removeEventListener("focusin",T,!0),r.removeEventListener("mousedown",g,!0),r.removeEventListener("touchstart",g,!0),r.removeEventListener("click",w,!0),r.removeEventListener("keydown",F,!0),o};return(o={get active(){return f.active},get paused(){return f.paused},activate:function(e){if(f.active)return this;var t=v(e,"onActivate"),n=v(e,"onPostActivate"),a=v(e,"checkCanFocusTrap");a||y(),f.active=!0,f.paused=!1,f.nodeFocusedBeforeActivation=r.activeElement,t&&t();var o=function(){a&&y(),E(),n&&n()};return a?(a(f.containers.concat()).then(o,o),this):(o(),this)},deactivate:function(e){if(!f.active)return this;var t=a({onDeactivate:b.onDeactivate,onPostDeactivate:b.onPostDeactivate,checkCanReturnFocus:b.checkCanReturnFocus},e);clearTimeout(f.delayInitialFocusTimer),f.delayInitialFocusTimer=void 0,k(),f.active=!1,f.paused=!1,i.deactivateTrap(o);var n=v(t,"onDeactivate"),r=v(t,"onPostDeactivate"),u=v(t,"checkCanReturnFocus"),s=v(t,"returnFocus","returnFocusOnDeactivate");n&&n();var l=function(){c((function(){s&&m(O(f.nodeFocusedBeforeActivation)),r&&r()}))};return s&&u?(u(O(f.nodeFocusedBeforeActivation)).then(l,l),this):(l(),this)},pause:function(){return f.paused||!f.active||(f.paused=!0,k()),this},unpause:function(){return f.paused&&f.active?(f.paused=!1,y(),E(),this):this},updateContainerElements:function(e){var t=[].concat(e).filter(Boolean);return f.containers=t.map((function(e){return"string"==typeof e?r.querySelector(e):e})),f.active&&y(),this}}).updateContainerElements(e),o},Object.defineProperty(e,"__esModule",{value:!0})})); | ||
//# sourceMappingURL=focus-trap.umd.min.js.map |
@@ -172,2 +172,4 @@ import { CheckOptions as TabbableCheckOptions } from 'tabbable'; | ||
export interface FocusTrap { | ||
active: boolean, | ||
paused: boolean, | ||
activate(activateOptions?: ActivateOptions): FocusTrap; | ||
@@ -174,0 +176,0 @@ deactivate(deactivateOptions?: DeactivateOptions): FocusTrap; |
41
index.js
@@ -553,6 +553,2 @@ import { tabbable, focusable, isFocusable, isTabbable } from 'tabbable'; | ||
const checkClick = function (e) { | ||
if (valueOrHandler(config.clickOutsideDeactivates, e)) { | ||
return; | ||
} | ||
const target = getActualTarget(e); | ||
@@ -564,2 +560,6 @@ | ||
if (valueOrHandler(config.clickOutsideDeactivates, e)) { | ||
return; | ||
} | ||
if (valueOrHandler(config.allowOutsideClick, e)) { | ||
@@ -633,2 +633,10 @@ return; | ||
trap = { | ||
get active() { | ||
return state.active; | ||
}, | ||
get paused() { | ||
return state.paused; | ||
}, | ||
activate(activateOptions) { | ||
@@ -682,2 +690,9 @@ if (state.active) { | ||
const options = { | ||
onDeactivate: config.onDeactivate, | ||
onPostDeactivate: config.onPostDeactivate, | ||
checkCanReturnFocus: config.checkCanReturnFocus, | ||
...deactivateOptions, | ||
}; | ||
clearTimeout(state.delayInitialFocusTimer); // noop if undefined | ||
@@ -692,7 +707,9 @@ state.delayInitialFocusTimer = undefined; | ||
const onDeactivate = getOption(deactivateOptions, 'onDeactivate'); | ||
const onPostDeactivate = getOption(deactivateOptions, 'onPostDeactivate'); | ||
const checkCanReturnFocus = getOption( | ||
deactivateOptions, | ||
'checkCanReturnFocus' | ||
const onDeactivate = getOption(options, 'onDeactivate'); | ||
const onPostDeactivate = getOption(options, 'onPostDeactivate'); | ||
const checkCanReturnFocus = getOption(options, 'checkCanReturnFocus'); | ||
const returnFocus = getOption( | ||
options, | ||
'returnFocus', | ||
'returnFocusOnDeactivate' | ||
); | ||
@@ -704,8 +721,2 @@ | ||
const returnFocus = getOption( | ||
deactivateOptions, | ||
'returnFocus', | ||
'returnFocusOnDeactivate' | ||
); | ||
const finishDeactivation = () => { | ||
@@ -712,0 +723,0 @@ delay(() => { |
{ | ||
"name": "focus-trap", | ||
"version": "6.8.1", | ||
"version": "6.9.0", | ||
"description": "Trap focus within a DOM node.", | ||
@@ -75,3 +75,3 @@ "main": "dist/focus-trap.js", | ||
"@rollup/plugin-babel": "^5.3.1", | ||
"@rollup/plugin-commonjs": "^21.1.0", | ||
"@rollup/plugin-commonjs": "^22.0.0", | ||
"@rollup/plugin-node-resolve": "^13.2.1", | ||
@@ -83,5 +83,5 @@ "@testing-library/cypress": "^8.0.2", | ||
"cross-env": "^7.0.3", | ||
"cypress": "^9.5.4", | ||
"cypress": "^9.6.0", | ||
"cypress-plugin-tab": "^1.0.5", | ||
"eslint": "^8.13.0", | ||
"eslint": "^8.14.0", | ||
"eslint-config-prettier": "^8.5.0", | ||
@@ -88,0 +88,0 @@ "eslint-plugin-cypress": "^2.12.1", |
@@ -37,3 +37,3 @@ # focus-trap [![CI](https://github.com/focus-trap/focus-trap/workflows/CI/badge.svg?branch=master&event=push)](https://github.com/focus-trap/focus-trap/actions?query=workflow:CI+branch:master) [![license](https://badgen.now.sh/badge/license/MIT)](./LICENSE) | ||
``` | ||
```bash | ||
npm install focus-trap | ||
@@ -46,3 +46,3 @@ ``` | ||
> NOTE: The UMD build does not bundle the `tabbable` dependency. Therefore you will have to also include that one, and include it _before_ `focus-trap`. | ||
> NOTE: The UMD build does not bundle the `tabbable` dependency. Therefore you will have to also include that one, and include it *before* `focus-trap`. | ||
@@ -78,3 +78,4 @@ ```html | ||
`element` can be | ||
`element` can be: | ||
- a DOM node (the focus trap itself); | ||
@@ -84,3 +85,3 @@ - a selector string (which will be passed to `document.querySelector()` to find the DOM node); or | ||
> A focus trap must have at least one container with at least one tabbable/focusable node in it to be considered valid. While nodes can be added/removed at runtime, with the trap adjusting to added/removed tabbable nodes, __an error will be thrown__ if the trap ever gets into a state where it determines none of its containers have any tabbable nodes in them _and_ the `fallbackFocus` option does not resolve to an alternate node where focus can go. | ||
> A focus trap must have at least one container with at least one tabbable/focusable node in it to be considered valid. While nodes can be added/removed at runtime, with the trap adjusting to added/removed tabbable nodes, **an error will be thrown** if the trap ever gets into a state where it determines none of its containers have any tabbable nodes in them *and* the `fallbackFocus` option does not resolve to an alternate node where focus can go. | ||
@@ -96,21 +97,24 @@ #### createOptions | ||
- **initialFocus** `{HTMLElement | SVGElement | string | false | (() => HTMLElement | SVGElement | false)}`: 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), or a function that returns a DOM node. You can also set this option to `false` (or to a function that returns `false`) to prevent any initial focus at all when the trap activates. | ||
- 💬 Setting this option to `false` (or a function that returns `false`) will prevent the `fallbackFocus` option from being used. | ||
- ⚠️ See warning below about **Shadow DOM** and selector strings. | ||
- 💬 Setting this option to `false` (or a function that returns `false`) will prevent the `fallbackFocus` option from being used. | ||
- ⚠️ See warning below about **Shadow DOM** and selector strings. | ||
- **fallbackFocus** `{HTMLElement | SVGElement | string | () => HTMLElement | SVGElement}`: 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, a selector string (which will be passed to `document.querySelector()` to find the DOM node), or a function that returns a DOM node. | ||
- 💬 If `initialFocus` is `false` (or a function that returns `false`), this function will not be called when the trap is activated, and no element will be initially focused. This function may still be called while the trap is active if things change such that there are no longer any tabbable nodes in the trap. | ||
- ⚠️ See warning below about **Shadow DOM** and selector strings. | ||
- 💬 If `initialFocus` is `false` (or a function that returns `false`), this function will not be called when the trap is activated, and no element will be initially focused. This function may still be called while the trap is active if things change such that there are no longer any tabbable nodes in the trap. | ||
- ⚠️ See warning below about **Shadow DOM** and selector strings. | ||
- **escapeDeactivates** `{boolean} | (e: KeyboardEvent) => boolean)`: Default: `true`. If `false` or returns `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. Note that if a function is given, it's only called if the ESC key was pressed. | ||
- **clickOutsideDeactivates** `{boolean | (e: MouseEvent | TouchEvent) => boolean}`: If `true` or returns `true`, a click outside the focus trap will deactivate the focus trap and allow the click event to do its thing (i.e. to pass-through to the element that was clicked). This option **takes precedence** over `allowOutsideClick` when it's set to `true`. Default: `false`. | ||
- ⚠️ If you're using a password manager such as 1Password, where the app adds a clickable icon to all fillable fields, you should avoid using this option, and instead use the `allowOutsideClick` option to better control exactly when the focus trap can be deactivated. The clickable icons are usually positioned absolutely, floating on top of the fields, and therefore _not_ part of the container the trap is managing. When using the `clickOutsideDeactivates` option, clicking on a field's 1Password icon will likely cause the trap to be unintentionally deactivated. | ||
- **allowOutsideClick** `{boolean | (e: MouseEvent | TouchEvent) => boolean}`: If set and is or returns `true`, a click outside the focus trap will not be prevented, even when `clickOutsideDeactivates` is `false`. When `clickOutsideDeactivates` is `true`, this option is **ignored** (i.e. if it's a function, it will not be called). Use this option to control if (and even which) clicks are allowed outside the trap in conjunction with `clickOutsideDeactivates: false`. Default: `false`. | ||
- ⚠️ If this is a function, it will be called **twice** on every click: First on `mousedown` (or `touchstart` on mobile), and then on the actual `click` if the function returned `true` on the first event. Be sure to check the event type if the double call is an issue in your code. | ||
- **clickOutsideDeactivates** `{boolean | (e: MouseEvent | TouchEvent) => boolean}`: If `true` or returns `true`, a click outside the focus trap will immediately deactivate the focus trap and allow the click event to do its thing (i.e. to pass-through to the element that was clicked). This option **takes precedence** over `allowOutsideClick` when it's set to `true`. Default: `false`. | ||
- 💬 If a function is provided, it will be called up to **twice** (but only if the click occurs *outside* the trap's containers): First on the `mousedown` (or `touchstart` on mobile) event and, if `true` was returned, again on the `click` event. It will get the same node each time, and it's recommended that the returned value is also the same each time. Be sure to check the event type if the double call is an issue in your code. | ||
- ⚠️ If you're using a password manager such as 1Password, where the app adds a clickable icon to all fillable fields, you should avoid using this option, and instead use the `allowOutsideClick` option to better control exactly when the focus trap can be deactivated. The clickable icons are usually positioned absolutely, floating on top of the fields, and therefore *not* part of the container the trap is managing. When using the `clickOutsideDeactivates` option, clicking on a field's 1Password icon will likely cause the trap to be unintentionally deactivated. | ||
- **allowOutsideClick** `{boolean | (e: MouseEvent | TouchEvent) => boolean}`: If set and is or returns `true`, a click outside the focus trap will not be prevented (letting focus temporarily escape the trap, without deactivating it), even if `clickOutsideDeactivates=false`. Default: `false`. | ||
- 💬 If this is a function, it will be called up to **twice** on every click (but only if the click occurs *outside* the trap's containers): First on `mousedown` (or `touchstart` on mobile), and then on the actual `click` if the function returned `true` on the first event. Be sure to check the event type if the double call is an issue in your code. | ||
- 💡 When `clickOutsideDeactivates=true`, this option is **ignored** (i.e. if it's a function, it will not be called). | ||
- Use this option to control if (and even which) clicks are allowed outside the trap in conjunction with `clickOutsideDeactivates=false`. | ||
- **returnFocusOnDeactivate** `{boolean}`: Default: `true`. If `false`, when the trap is deactivated, focus will *not* return to the element that had focus before activation. | ||
- **setReturnFocus** `{HTMLElement | SVGElement | string | (previousActiveElement: HTMLElement | SVGElement) => HTMLElement | SVGElement | false}`: By default, on **deactivation**, if `returnFocusOnDeactivate=true` (or if `returnFocus=true` in the [deactivation options](#trapdeactivatedeactivateoptions)), focus will be returned to the element that was focused just before activation. With this option, you can specify another element to programmatically receive focus after deactivation. It can be a DOM node, a selector string (which will be passed to `document.querySelector()` to find the DOM node **upon deactivation**), or a function that returns a DOM node to call **upon deactivation** (i.e. the selector and function options are only executed at the time the trap is deactivated), or `false` to leave focus where it is at the time of deactivation. | ||
- 💬 Using the selector or function options is a good way to return focus to a DOM node that may not even exist at the time the trap is activated. | ||
- ⚠️ See warning below about **Shadow DOM** and selector strings. | ||
- 💬 Using the selector or function options is a good way to return focus to a DOM node that may not even exist at the time the trap is activated. | ||
- ⚠️ See warning below about **Shadow DOM** and selector strings. | ||
- **preventScroll** `{boolean}`: By default, focus() will scroll to the element if not in viewport. It can produce unintended effects like scrolling back to the top of a modal. If set to `true`, no scroll will happen. | ||
- **delayInitialFocus** `{boolean}`: Default: `true`. Delays the autofocus to the next execution frame when the focus trap is activated. This prevents elements within the focusable element from capturing the event that triggered the focus trap activation. | ||
- **document** {Document}: Default: `window.document`. Document where the focus trap will be active. This allows to use FocusTrap in an iFrame context. | ||
- **tabbableOptions**: (optional) [tabbable options](https://github.com/focus-trap/tabbable#common-options) configurable on FocusTrap (all the _common options_). | ||
- ⚠️ See notes about __[testing in JSDom](#testing-in-jsdom)__ (e.g. using Jest). | ||
- **tabbableOptions**: (optional) [tabbable options](https://github.com/focus-trap/tabbable#common-options) configurable on FocusTrap (all the *common options*). | ||
- ⚠️ See notes about **[testing in JSDom](#testing-in-jsdom)** (e.g. using Jest). | ||
@@ -124,3 +128,3 @@ #### Shadow DOM | ||
- **Not use selector strings** for options that support these (because nodes inside Shadow DOMs, even open shadows, are not visible via `document.querySelector()`); OR | ||
- You must **use the `document` option** to configure the focus trap to use your *shadow host* element as its document. The downside of this option is that, while selector queries on nodes inside your trap will now work, the trap will not prevent focus from being set on nodes outside your Shadow DOM, which is the same drawback as putting a focus trap <a href="https://focus-trap.github.io/focus-trap/#demo-in-iframe">inside an iframe</a>. | ||
- You must **use the `document` option** to configure the focus trap to use your *shadow host* element as its document. The downside of this option is that, while selector queries on nodes inside your trap will now work, the trap will not prevent focus from being set on nodes outside your Shadow DOM, which is the same drawback as putting a focus trap [inside an iframe](https://focus-trap.github.io/focus-trap/#demo-in-iframe). | ||
@@ -131,4 +135,24 @@ ##### Closed shadows | ||
### trap.activate([activateOptions]) | ||
### trap.active | ||
```typescript | ||
trap.active: boolean | ||
``` | ||
True if the trap is currently active. | ||
### trap.paused | ||
```typescript | ||
trap.paused: boolean | ||
``` | ||
True if the trap is currently paused. | ||
### trap.activate() | ||
```typescript | ||
trap.activate([activateOptions]) => FocusTrap | ||
``` | ||
Activates the focus trap, adding various event listeners to the document. | ||
@@ -154,4 +178,8 @@ | ||
### trap.deactivate([deactivateOptions]) | ||
### trap.deactivate() | ||
```typescript | ||
trap.deactivate([deactivateOptions]) => FocusTrap | ||
``` | ||
Deactivates the focus trap. | ||
@@ -165,9 +193,13 @@ | ||
- **returnFocus** `{boolean}`: Default: whatever you chose for `createOptions.returnFocusOnDeactivate`. If `true`, then the `setReturnFocus` option (specified when the trap was created) is used to determine where focus will be returned. | ||
- **onDeactivate** `{() => void}`: Default: whatever you chose for `createOptions.onDeactivate`. `null` or `false` are the equivalent of a `noop`. | ||
- **onPostDeactivate** `{() => void}`: Default: whatever you chose for `createOptions.onPostDeactivate`. `null` or `false` are the equivalent of a `noop`. | ||
- **checkCanReturnFocus** `{(trigger: HTMLElement | SVGElement) => Promise<void>}`: Default: whatever you chose for `createOptions.checkCanReturnFocus`. Not called if the `returnFocus` option is falsy. `trigger` is either the originally focused node prior to activation, or the result of the `setReturnFocus` configuration option. | ||
- **returnFocus** `{boolean}`: Default: whatever you set for `createOptions.returnFocusOnDeactivate`. If `true`, then the `setReturnFocus` option (specified when the trap was created) is used to determine where focus will be returned. | ||
- **onDeactivate** `{() => void}`: Default: whatever you set for `createOptions.onDeactivate`. `null` or `false` are the equivalent of a `noop`. | ||
- **onPostDeactivate** `{() => void}`: Default: whatever you set for `createOptions.onPostDeactivate`. `null` or `false` are the equivalent of a `noop`. | ||
- **checkCanReturnFocus** `{(trigger: HTMLElement | SVGElement) => Promise<void>}`: Default: whatever you set for `createOptions.checkCanReturnFocus`. Not called if the `returnFocus` option is falsy. `trigger` is either the originally focused node prior to activation, or the result of the `setReturnFocus` configuration option. | ||
### trap.pause() | ||
```typescript | ||
trap.pause() => FocusTrap | ||
``` | ||
Pause an active focus trap's event listening without deactivating the trap. | ||
@@ -185,2 +217,6 @@ | ||
```typescript | ||
trap.unpause() => FocusTrap | ||
``` | ||
Unpause an active focus trap. (See `pause()`, above.) | ||
@@ -196,2 +232,6 @@ | ||
```typescript | ||
trap.updateContainerElements() => FocusTrap | ||
``` | ||
Update the element(s) that are used as containers for the focus trap. | ||
@@ -198,0 +238,0 @@ |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
448276
2852
346