You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
130 lines
3.8 KiB
130 lines
3.8 KiB
/*! |
|
* Bootstrap focustrap.js v5.2.2 (https://getbootstrap.com/) |
|
* Copyright 2011-2022 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors) |
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) |
|
*/ |
|
(function (global, factory) { |
|
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('../dom/event-handler'), require('../dom/selector-engine'), require('./config')) : |
|
typeof define === 'function' && define.amd ? define(['../dom/event-handler', '../dom/selector-engine', './config'], factory) : |
|
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.Focustrap = factory(global.EventHandler, global.SelectorEngine, global.Config)); |
|
})(this, (function (EventHandler, SelectorEngine, Config) { 'use strict'; |
|
|
|
const _interopDefaultLegacy = e => e && typeof e === 'object' && 'default' in e ? e : { default: e }; |
|
|
|
const EventHandler__default = /*#__PURE__*/_interopDefaultLegacy(EventHandler); |
|
const SelectorEngine__default = /*#__PURE__*/_interopDefaultLegacy(SelectorEngine); |
|
const Config__default = /*#__PURE__*/_interopDefaultLegacy(Config); |
|
|
|
/** |
|
* -------------------------------------------------------------------------- |
|
* Bootstrap (v5.2.2): util/focustrap.js |
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) |
|
* -------------------------------------------------------------------------- |
|
*/ |
|
/** |
|
* Constants |
|
*/ |
|
|
|
const NAME = 'focustrap'; |
|
const DATA_KEY = 'bs.focustrap'; |
|
const EVENT_KEY = `.${DATA_KEY}`; |
|
const EVENT_FOCUSIN = `focusin${EVENT_KEY}`; |
|
const EVENT_KEYDOWN_TAB = `keydown.tab${EVENT_KEY}`; |
|
const TAB_KEY = 'Tab'; |
|
const TAB_NAV_FORWARD = 'forward'; |
|
const TAB_NAV_BACKWARD = 'backward'; |
|
const Default = { |
|
autofocus: true, |
|
trapElement: null // The element to trap focus inside of |
|
|
|
}; |
|
const DefaultType = { |
|
autofocus: 'boolean', |
|
trapElement: 'element' |
|
}; |
|
/** |
|
* Class definition |
|
*/ |
|
|
|
class FocusTrap extends Config__default.default { |
|
constructor(config) { |
|
super(); |
|
this._config = this._getConfig(config); |
|
this._isActive = false; |
|
this._lastTabNavDirection = null; |
|
} // Getters |
|
|
|
|
|
static get Default() { |
|
return Default; |
|
} |
|
|
|
static get DefaultType() { |
|
return DefaultType; |
|
} |
|
|
|
static get NAME() { |
|
return NAME; |
|
} // Public |
|
|
|
|
|
activate() { |
|
if (this._isActive) { |
|
return; |
|
} |
|
|
|
if (this._config.autofocus) { |
|
this._config.trapElement.focus(); |
|
} |
|
|
|
EventHandler__default.default.off(document, EVENT_KEY); // guard against infinite focus loop |
|
|
|
EventHandler__default.default.on(document, EVENT_FOCUSIN, event => this._handleFocusin(event)); |
|
EventHandler__default.default.on(document, EVENT_KEYDOWN_TAB, event => this._handleKeydown(event)); |
|
this._isActive = true; |
|
} |
|
|
|
deactivate() { |
|
if (!this._isActive) { |
|
return; |
|
} |
|
|
|
this._isActive = false; |
|
EventHandler__default.default.off(document, EVENT_KEY); |
|
} // Private |
|
|
|
|
|
_handleFocusin(event) { |
|
const { |
|
trapElement |
|
} = this._config; |
|
|
|
if (event.target === document || event.target === trapElement || trapElement.contains(event.target)) { |
|
return; |
|
} |
|
|
|
const elements = SelectorEngine__default.default.focusableChildren(trapElement); |
|
|
|
if (elements.length === 0) { |
|
trapElement.focus(); |
|
} else if (this._lastTabNavDirection === TAB_NAV_BACKWARD) { |
|
elements[elements.length - 1].focus(); |
|
} else { |
|
elements[0].focus(); |
|
} |
|
} |
|
|
|
_handleKeydown(event) { |
|
if (event.key !== TAB_KEY) { |
|
return; |
|
} |
|
|
|
this._lastTabNavDirection = event.shiftKey ? TAB_NAV_BACKWARD : TAB_NAV_FORWARD; |
|
} |
|
|
|
} |
|
|
|
return FocusTrap; |
|
|
|
})); |
|
//# sourceMappingURL=focustrap.js.map
|
|
|