| 1 | /*!
|
|---|
| 2 | * Bootstrap modal.js v5.1.3 (https://getbootstrap.com/)
|
|---|
| 3 | * Copyright 2011-2021 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
|
|---|
| 4 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
|---|
| 5 | */
|
|---|
| 6 | (function (global, factory) {
|
|---|
| 7 | typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('./dom/event-handler.js'), require('./dom/manipulator.js'), require('./dom/selector-engine.js'), require('./base-component.js')) :
|
|---|
| 8 | typeof define === 'function' && define.amd ? define(['./dom/event-handler', './dom/manipulator', './dom/selector-engine', './base-component'], factory) :
|
|---|
| 9 | (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.Modal = factory(global.EventHandler, global.Manipulator, global.SelectorEngine, global.Base));
|
|---|
| 10 | })(this, (function (EventHandler, Manipulator, SelectorEngine, BaseComponent) { 'use strict';
|
|---|
| 11 |
|
|---|
| 12 | const _interopDefaultLegacy = e => e && typeof e === 'object' && 'default' in e ? e : { default: e };
|
|---|
| 13 |
|
|---|
| 14 | const EventHandler__default = /*#__PURE__*/_interopDefaultLegacy(EventHandler);
|
|---|
| 15 | const Manipulator__default = /*#__PURE__*/_interopDefaultLegacy(Manipulator);
|
|---|
| 16 | const SelectorEngine__default = /*#__PURE__*/_interopDefaultLegacy(SelectorEngine);
|
|---|
| 17 | const BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
|
|---|
| 18 |
|
|---|
| 19 | /**
|
|---|
| 20 | * --------------------------------------------------------------------------
|
|---|
| 21 | * Bootstrap (v5.1.3): util/index.js
|
|---|
| 22 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
|---|
| 23 | * --------------------------------------------------------------------------
|
|---|
| 24 | */
|
|---|
| 25 | const MILLISECONDS_MULTIPLIER = 1000;
|
|---|
| 26 | const TRANSITION_END = 'transitionend'; // Shoutout AngusCroll (https://goo.gl/pxwQGp)
|
|---|
| 27 |
|
|---|
| 28 | const toType = obj => {
|
|---|
| 29 | if (obj === null || obj === undefined) {
|
|---|
| 30 | return `${obj}`;
|
|---|
| 31 | }
|
|---|
| 32 |
|
|---|
| 33 | return {}.toString.call(obj).match(/\s([a-z]+)/i)[1].toLowerCase();
|
|---|
| 34 | };
|
|---|
| 35 |
|
|---|
| 36 | const getSelector = element => {
|
|---|
| 37 | let selector = element.getAttribute('data-bs-target');
|
|---|
| 38 |
|
|---|
| 39 | if (!selector || selector === '#') {
|
|---|
| 40 | let hrefAttr = element.getAttribute('href'); // The only valid content that could double as a selector are IDs or classes,
|
|---|
| 41 | // so everything starting with `#` or `.`. If a "real" URL is used as the selector,
|
|---|
| 42 | // `document.querySelector` will rightfully complain it is invalid.
|
|---|
| 43 | // See https://github.com/twbs/bootstrap/issues/32273
|
|---|
| 44 |
|
|---|
| 45 | if (!hrefAttr || !hrefAttr.includes('#') && !hrefAttr.startsWith('.')) {
|
|---|
| 46 | return null;
|
|---|
| 47 | } // Just in case some CMS puts out a full URL with the anchor appended
|
|---|
| 48 |
|
|---|
| 49 |
|
|---|
| 50 | if (hrefAttr.includes('#') && !hrefAttr.startsWith('#')) {
|
|---|
| 51 | hrefAttr = `#${hrefAttr.split('#')[1]}`;
|
|---|
| 52 | }
|
|---|
| 53 |
|
|---|
| 54 | selector = hrefAttr && hrefAttr !== '#' ? hrefAttr.trim() : null;
|
|---|
| 55 | }
|
|---|
| 56 |
|
|---|
| 57 | return selector;
|
|---|
| 58 | };
|
|---|
| 59 |
|
|---|
| 60 | const getElementFromSelector = element => {
|
|---|
| 61 | const selector = getSelector(element);
|
|---|
| 62 | return selector ? document.querySelector(selector) : null;
|
|---|
| 63 | };
|
|---|
| 64 |
|
|---|
| 65 | const getTransitionDurationFromElement = element => {
|
|---|
| 66 | if (!element) {
|
|---|
| 67 | return 0;
|
|---|
| 68 | } // Get transition-duration of the element
|
|---|
| 69 |
|
|---|
| 70 |
|
|---|
| 71 | let {
|
|---|
| 72 | transitionDuration,
|
|---|
| 73 | transitionDelay
|
|---|
| 74 | } = window.getComputedStyle(element);
|
|---|
| 75 | const floatTransitionDuration = Number.parseFloat(transitionDuration);
|
|---|
| 76 | const floatTransitionDelay = Number.parseFloat(transitionDelay); // Return 0 if element or transition duration is not found
|
|---|
| 77 |
|
|---|
| 78 | if (!floatTransitionDuration && !floatTransitionDelay) {
|
|---|
| 79 | return 0;
|
|---|
| 80 | } // If multiple durations are defined, take the first
|
|---|
| 81 |
|
|---|
| 82 |
|
|---|
| 83 | transitionDuration = transitionDuration.split(',')[0];
|
|---|
| 84 | transitionDelay = transitionDelay.split(',')[0];
|
|---|
| 85 | return (Number.parseFloat(transitionDuration) + Number.parseFloat(transitionDelay)) * MILLISECONDS_MULTIPLIER;
|
|---|
| 86 | };
|
|---|
| 87 |
|
|---|
| 88 | const triggerTransitionEnd = element => {
|
|---|
| 89 | element.dispatchEvent(new Event(TRANSITION_END));
|
|---|
| 90 | };
|
|---|
| 91 |
|
|---|
| 92 | const isElement = obj => {
|
|---|
| 93 | if (!obj || typeof obj !== 'object') {
|
|---|
| 94 | return false;
|
|---|
| 95 | }
|
|---|
| 96 |
|
|---|
| 97 | if (typeof obj.jquery !== 'undefined') {
|
|---|
| 98 | obj = obj[0];
|
|---|
| 99 | }
|
|---|
| 100 |
|
|---|
| 101 | return typeof obj.nodeType !== 'undefined';
|
|---|
| 102 | };
|
|---|
| 103 |
|
|---|
| 104 | const getElement = obj => {
|
|---|
| 105 | if (isElement(obj)) {
|
|---|
| 106 | // it's a jQuery object or a node element
|
|---|
| 107 | return obj.jquery ? obj[0] : obj;
|
|---|
| 108 | }
|
|---|
| 109 |
|
|---|
| 110 | if (typeof obj === 'string' && obj.length > 0) {
|
|---|
| 111 | return document.querySelector(obj);
|
|---|
| 112 | }
|
|---|
| 113 |
|
|---|
| 114 | return null;
|
|---|
| 115 | };
|
|---|
| 116 |
|
|---|
| 117 | const typeCheckConfig = (componentName, config, configTypes) => {
|
|---|
| 118 | Object.keys(configTypes).forEach(property => {
|
|---|
| 119 | const expectedTypes = configTypes[property];
|
|---|
| 120 | const value = config[property];
|
|---|
| 121 | const valueType = value && isElement(value) ? 'element' : toType(value);
|
|---|
| 122 |
|
|---|
| 123 | if (!new RegExp(expectedTypes).test(valueType)) {
|
|---|
| 124 | throw new TypeError(`${componentName.toUpperCase()}: Option "${property}" provided type "${valueType}" but expected type "${expectedTypes}".`);
|
|---|
| 125 | }
|
|---|
| 126 | });
|
|---|
| 127 | };
|
|---|
| 128 |
|
|---|
| 129 | const isVisible = element => {
|
|---|
| 130 | if (!isElement(element) || element.getClientRects().length === 0) {
|
|---|
| 131 | return false;
|
|---|
| 132 | }
|
|---|
| 133 |
|
|---|
| 134 | return getComputedStyle(element).getPropertyValue('visibility') === 'visible';
|
|---|
| 135 | };
|
|---|
| 136 |
|
|---|
| 137 | const isDisabled = element => {
|
|---|
| 138 | if (!element || element.nodeType !== Node.ELEMENT_NODE) {
|
|---|
| 139 | return true;
|
|---|
| 140 | }
|
|---|
| 141 |
|
|---|
| 142 | if (element.classList.contains('disabled')) {
|
|---|
| 143 | return true;
|
|---|
| 144 | }
|
|---|
| 145 |
|
|---|
| 146 | if (typeof element.disabled !== 'undefined') {
|
|---|
| 147 | return element.disabled;
|
|---|
| 148 | }
|
|---|
| 149 |
|
|---|
| 150 | return element.hasAttribute('disabled') && element.getAttribute('disabled') !== 'false';
|
|---|
| 151 | };
|
|---|
| 152 | /**
|
|---|
| 153 | * Trick to restart an element's animation
|
|---|
| 154 | *
|
|---|
| 155 | * @param {HTMLElement} element
|
|---|
| 156 | * @return void
|
|---|
| 157 | *
|
|---|
| 158 | * @see https://www.charistheo.io/blog/2021/02/restart-a-css-animation-with-javascript/#restarting-a-css-animation
|
|---|
| 159 | */
|
|---|
| 160 |
|
|---|
| 161 |
|
|---|
| 162 | const reflow = element => {
|
|---|
| 163 | // eslint-disable-next-line no-unused-expressions
|
|---|
| 164 | element.offsetHeight;
|
|---|
| 165 | };
|
|---|
| 166 |
|
|---|
| 167 | const getjQuery = () => {
|
|---|
| 168 | const {
|
|---|
| 169 | jQuery
|
|---|
| 170 | } = window;
|
|---|
| 171 |
|
|---|
| 172 | if (jQuery && !document.body.hasAttribute('data-bs-no-jquery')) {
|
|---|
| 173 | return jQuery;
|
|---|
| 174 | }
|
|---|
| 175 |
|
|---|
| 176 | return null;
|
|---|
| 177 | };
|
|---|
| 178 |
|
|---|
| 179 | const DOMContentLoadedCallbacks = [];
|
|---|
| 180 |
|
|---|
| 181 | const onDOMContentLoaded = callback => {
|
|---|
| 182 | if (document.readyState === 'loading') {
|
|---|
| 183 | // add listener on the first call when the document is in loading state
|
|---|
| 184 | if (!DOMContentLoadedCallbacks.length) {
|
|---|
| 185 | document.addEventListener('DOMContentLoaded', () => {
|
|---|
| 186 | DOMContentLoadedCallbacks.forEach(callback => callback());
|
|---|
| 187 | });
|
|---|
| 188 | }
|
|---|
| 189 |
|
|---|
| 190 | DOMContentLoadedCallbacks.push(callback);
|
|---|
| 191 | } else {
|
|---|
| 192 | callback();
|
|---|
| 193 | }
|
|---|
| 194 | };
|
|---|
| 195 |
|
|---|
| 196 | const isRTL = () => document.documentElement.dir === 'rtl';
|
|---|
| 197 |
|
|---|
| 198 | const defineJQueryPlugin = plugin => {
|
|---|
| 199 | onDOMContentLoaded(() => {
|
|---|
| 200 | const $ = getjQuery();
|
|---|
| 201 | /* istanbul ignore if */
|
|---|
| 202 |
|
|---|
| 203 | if ($) {
|
|---|
| 204 | const name = plugin.NAME;
|
|---|
| 205 | const JQUERY_NO_CONFLICT = $.fn[name];
|
|---|
| 206 | $.fn[name] = plugin.jQueryInterface;
|
|---|
| 207 | $.fn[name].Constructor = plugin;
|
|---|
| 208 |
|
|---|
| 209 | $.fn[name].noConflict = () => {
|
|---|
| 210 | $.fn[name] = JQUERY_NO_CONFLICT;
|
|---|
| 211 | return plugin.jQueryInterface;
|
|---|
| 212 | };
|
|---|
| 213 | }
|
|---|
| 214 | });
|
|---|
| 215 | };
|
|---|
| 216 |
|
|---|
| 217 | const execute = callback => {
|
|---|
| 218 | if (typeof callback === 'function') {
|
|---|
| 219 | callback();
|
|---|
| 220 | }
|
|---|
| 221 | };
|
|---|
| 222 |
|
|---|
| 223 | const executeAfterTransition = (callback, transitionElement, waitForTransition = true) => {
|
|---|
| 224 | if (!waitForTransition) {
|
|---|
| 225 | execute(callback);
|
|---|
| 226 | return;
|
|---|
| 227 | }
|
|---|
| 228 |
|
|---|
| 229 | const durationPadding = 5;
|
|---|
| 230 | const emulatedDuration = getTransitionDurationFromElement(transitionElement) + durationPadding;
|
|---|
| 231 | let called = false;
|
|---|
| 232 |
|
|---|
| 233 | const handler = ({
|
|---|
| 234 | target
|
|---|
| 235 | }) => {
|
|---|
| 236 | if (target !== transitionElement) {
|
|---|
| 237 | return;
|
|---|
| 238 | }
|
|---|
| 239 |
|
|---|
| 240 | called = true;
|
|---|
| 241 | transitionElement.removeEventListener(TRANSITION_END, handler);
|
|---|
| 242 | execute(callback);
|
|---|
| 243 | };
|
|---|
| 244 |
|
|---|
| 245 | transitionElement.addEventListener(TRANSITION_END, handler);
|
|---|
| 246 | setTimeout(() => {
|
|---|
| 247 | if (!called) {
|
|---|
| 248 | triggerTransitionEnd(transitionElement);
|
|---|
| 249 | }
|
|---|
| 250 | }, emulatedDuration);
|
|---|
| 251 | };
|
|---|
| 252 |
|
|---|
| 253 | /**
|
|---|
| 254 | * --------------------------------------------------------------------------
|
|---|
| 255 | * Bootstrap (v5.1.3): util/scrollBar.js
|
|---|
| 256 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
|---|
| 257 | * --------------------------------------------------------------------------
|
|---|
| 258 | */
|
|---|
| 259 | const SELECTOR_FIXED_CONTENT = '.fixed-top, .fixed-bottom, .is-fixed, .sticky-top';
|
|---|
| 260 | const SELECTOR_STICKY_CONTENT = '.sticky-top';
|
|---|
| 261 |
|
|---|
| 262 | class ScrollBarHelper {
|
|---|
| 263 | constructor() {
|
|---|
| 264 | this._element = document.body;
|
|---|
| 265 | }
|
|---|
| 266 |
|
|---|
| 267 | getWidth() {
|
|---|
| 268 | // https://developer.mozilla.org/en-US/docs/Web/API/Window/innerWidth#usage_notes
|
|---|
| 269 | const documentWidth = document.documentElement.clientWidth;
|
|---|
| 270 | return Math.abs(window.innerWidth - documentWidth);
|
|---|
| 271 | }
|
|---|
| 272 |
|
|---|
| 273 | hide() {
|
|---|
| 274 | const width = this.getWidth();
|
|---|
| 275 |
|
|---|
| 276 | this._disableOverFlow(); // give padding to element to balance the hidden scrollbar width
|
|---|
| 277 |
|
|---|
| 278 |
|
|---|
| 279 | this._setElementAttributes(this._element, 'paddingRight', calculatedValue => calculatedValue + width); // trick: We adjust positive paddingRight and negative marginRight to sticky-top elements to keep showing fullwidth
|
|---|
| 280 |
|
|---|
| 281 |
|
|---|
| 282 | this._setElementAttributes(SELECTOR_FIXED_CONTENT, 'paddingRight', calculatedValue => calculatedValue + width);
|
|---|
| 283 |
|
|---|
| 284 | this._setElementAttributes(SELECTOR_STICKY_CONTENT, 'marginRight', calculatedValue => calculatedValue - width);
|
|---|
| 285 | }
|
|---|
| 286 |
|
|---|
| 287 | _disableOverFlow() {
|
|---|
| 288 | this._saveInitialAttribute(this._element, 'overflow');
|
|---|
| 289 |
|
|---|
| 290 | this._element.style.overflow = 'hidden';
|
|---|
| 291 | }
|
|---|
| 292 |
|
|---|
| 293 | _setElementAttributes(selector, styleProp, callback) {
|
|---|
| 294 | const scrollbarWidth = this.getWidth();
|
|---|
| 295 |
|
|---|
| 296 | const manipulationCallBack = element => {
|
|---|
| 297 | if (element !== this._element && window.innerWidth > element.clientWidth + scrollbarWidth) {
|
|---|
| 298 | return;
|
|---|
| 299 | }
|
|---|
| 300 |
|
|---|
| 301 | this._saveInitialAttribute(element, styleProp);
|
|---|
| 302 |
|
|---|
| 303 | const calculatedValue = window.getComputedStyle(element)[styleProp];
|
|---|
| 304 | element.style[styleProp] = `${callback(Number.parseFloat(calculatedValue))}px`;
|
|---|
| 305 | };
|
|---|
| 306 |
|
|---|
| 307 | this._applyManipulationCallback(selector, manipulationCallBack);
|
|---|
| 308 | }
|
|---|
| 309 |
|
|---|
| 310 | reset() {
|
|---|
| 311 | this._resetElementAttributes(this._element, 'overflow');
|
|---|
| 312 |
|
|---|
| 313 | this._resetElementAttributes(this._element, 'paddingRight');
|
|---|
| 314 |
|
|---|
| 315 | this._resetElementAttributes(SELECTOR_FIXED_CONTENT, 'paddingRight');
|
|---|
| 316 |
|
|---|
| 317 | this._resetElementAttributes(SELECTOR_STICKY_CONTENT, 'marginRight');
|
|---|
| 318 | }
|
|---|
| 319 |
|
|---|
| 320 | _saveInitialAttribute(element, styleProp) {
|
|---|
| 321 | const actualValue = element.style[styleProp];
|
|---|
| 322 |
|
|---|
| 323 | if (actualValue) {
|
|---|
| 324 | Manipulator__default.default.setDataAttribute(element, styleProp, actualValue);
|
|---|
| 325 | }
|
|---|
| 326 | }
|
|---|
| 327 |
|
|---|
| 328 | _resetElementAttributes(selector, styleProp) {
|
|---|
| 329 | const manipulationCallBack = element => {
|
|---|
| 330 | const value = Manipulator__default.default.getDataAttribute(element, styleProp);
|
|---|
| 331 |
|
|---|
| 332 | if (typeof value === 'undefined') {
|
|---|
| 333 | element.style.removeProperty(styleProp);
|
|---|
| 334 | } else {
|
|---|
| 335 | Manipulator__default.default.removeDataAttribute(element, styleProp);
|
|---|
| 336 | element.style[styleProp] = value;
|
|---|
| 337 | }
|
|---|
| 338 | };
|
|---|
| 339 |
|
|---|
| 340 | this._applyManipulationCallback(selector, manipulationCallBack);
|
|---|
| 341 | }
|
|---|
| 342 |
|
|---|
| 343 | _applyManipulationCallback(selector, callBack) {
|
|---|
| 344 | if (isElement(selector)) {
|
|---|
| 345 | callBack(selector);
|
|---|
| 346 | } else {
|
|---|
| 347 | SelectorEngine__default.default.find(selector, this._element).forEach(callBack);
|
|---|
| 348 | }
|
|---|
| 349 | }
|
|---|
| 350 |
|
|---|
| 351 | isOverflowing() {
|
|---|
| 352 | return this.getWidth() > 0;
|
|---|
| 353 | }
|
|---|
| 354 |
|
|---|
| 355 | }
|
|---|
| 356 |
|
|---|
| 357 | /**
|
|---|
| 358 | * --------------------------------------------------------------------------
|
|---|
| 359 | * Bootstrap (v5.1.3): util/backdrop.js
|
|---|
| 360 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
|---|
| 361 | * --------------------------------------------------------------------------
|
|---|
| 362 | */
|
|---|
| 363 | const Default$2 = {
|
|---|
| 364 | className: 'modal-backdrop',
|
|---|
| 365 | isVisible: true,
|
|---|
| 366 | // if false, we use the backdrop helper without adding any element to the dom
|
|---|
| 367 | isAnimated: false,
|
|---|
| 368 | rootElement: 'body',
|
|---|
| 369 | // give the choice to place backdrop under different elements
|
|---|
| 370 | clickCallback: null
|
|---|
| 371 | };
|
|---|
| 372 | const DefaultType$2 = {
|
|---|
| 373 | className: 'string',
|
|---|
| 374 | isVisible: 'boolean',
|
|---|
| 375 | isAnimated: 'boolean',
|
|---|
| 376 | rootElement: '(element|string)',
|
|---|
| 377 | clickCallback: '(function|null)'
|
|---|
| 378 | };
|
|---|
| 379 | const NAME$2 = 'backdrop';
|
|---|
| 380 | const CLASS_NAME_FADE$1 = 'fade';
|
|---|
| 381 | const CLASS_NAME_SHOW$1 = 'show';
|
|---|
| 382 | const EVENT_MOUSEDOWN = `mousedown.bs.${NAME$2}`;
|
|---|
| 383 |
|
|---|
| 384 | class Backdrop {
|
|---|
| 385 | constructor(config) {
|
|---|
| 386 | this._config = this._getConfig(config);
|
|---|
| 387 | this._isAppended = false;
|
|---|
| 388 | this._element = null;
|
|---|
| 389 | }
|
|---|
| 390 |
|
|---|
| 391 | show(callback) {
|
|---|
| 392 | if (!this._config.isVisible) {
|
|---|
| 393 | execute(callback);
|
|---|
| 394 | return;
|
|---|
| 395 | }
|
|---|
| 396 |
|
|---|
| 397 | this._append();
|
|---|
| 398 |
|
|---|
| 399 | if (this._config.isAnimated) {
|
|---|
| 400 | reflow(this._getElement());
|
|---|
| 401 | }
|
|---|
| 402 |
|
|---|
| 403 | this._getElement().classList.add(CLASS_NAME_SHOW$1);
|
|---|
| 404 |
|
|---|
| 405 | this._emulateAnimation(() => {
|
|---|
| 406 | execute(callback);
|
|---|
| 407 | });
|
|---|
| 408 | }
|
|---|
| 409 |
|
|---|
| 410 | hide(callback) {
|
|---|
| 411 | if (!this._config.isVisible) {
|
|---|
| 412 | execute(callback);
|
|---|
| 413 | return;
|
|---|
| 414 | }
|
|---|
| 415 |
|
|---|
| 416 | this._getElement().classList.remove(CLASS_NAME_SHOW$1);
|
|---|
| 417 |
|
|---|
| 418 | this._emulateAnimation(() => {
|
|---|
| 419 | this.dispose();
|
|---|
| 420 | execute(callback);
|
|---|
| 421 | });
|
|---|
| 422 | } // Private
|
|---|
| 423 |
|
|---|
| 424 |
|
|---|
| 425 | _getElement() {
|
|---|
| 426 | if (!this._element) {
|
|---|
| 427 | const backdrop = document.createElement('div');
|
|---|
| 428 | backdrop.className = this._config.className;
|
|---|
| 429 |
|
|---|
| 430 | if (this._config.isAnimated) {
|
|---|
| 431 | backdrop.classList.add(CLASS_NAME_FADE$1);
|
|---|
| 432 | }
|
|---|
| 433 |
|
|---|
| 434 | this._element = backdrop;
|
|---|
| 435 | }
|
|---|
| 436 |
|
|---|
| 437 | return this._element;
|
|---|
| 438 | }
|
|---|
| 439 |
|
|---|
| 440 | _getConfig(config) {
|
|---|
| 441 | config = { ...Default$2,
|
|---|
| 442 | ...(typeof config === 'object' ? config : {})
|
|---|
| 443 | }; // use getElement() with the default "body" to get a fresh Element on each instantiation
|
|---|
| 444 |
|
|---|
| 445 | config.rootElement = getElement(config.rootElement);
|
|---|
| 446 | typeCheckConfig(NAME$2, config, DefaultType$2);
|
|---|
| 447 | return config;
|
|---|
| 448 | }
|
|---|
| 449 |
|
|---|
| 450 | _append() {
|
|---|
| 451 | if (this._isAppended) {
|
|---|
| 452 | return;
|
|---|
| 453 | }
|
|---|
| 454 |
|
|---|
| 455 | this._config.rootElement.append(this._getElement());
|
|---|
| 456 |
|
|---|
| 457 | EventHandler__default.default.on(this._getElement(), EVENT_MOUSEDOWN, () => {
|
|---|
| 458 | execute(this._config.clickCallback);
|
|---|
| 459 | });
|
|---|
| 460 | this._isAppended = true;
|
|---|
| 461 | }
|
|---|
| 462 |
|
|---|
| 463 | dispose() {
|
|---|
| 464 | if (!this._isAppended) {
|
|---|
| 465 | return;
|
|---|
| 466 | }
|
|---|
| 467 |
|
|---|
| 468 | EventHandler__default.default.off(this._element, EVENT_MOUSEDOWN);
|
|---|
| 469 |
|
|---|
| 470 | this._element.remove();
|
|---|
| 471 |
|
|---|
| 472 | this._isAppended = false;
|
|---|
| 473 | }
|
|---|
| 474 |
|
|---|
| 475 | _emulateAnimation(callback) {
|
|---|
| 476 | executeAfterTransition(callback, this._getElement(), this._config.isAnimated);
|
|---|
| 477 | }
|
|---|
| 478 |
|
|---|
| 479 | }
|
|---|
| 480 |
|
|---|
| 481 | /**
|
|---|
| 482 | * --------------------------------------------------------------------------
|
|---|
| 483 | * Bootstrap (v5.1.3): util/focustrap.js
|
|---|
| 484 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
|---|
| 485 | * --------------------------------------------------------------------------
|
|---|
| 486 | */
|
|---|
| 487 | const Default$1 = {
|
|---|
| 488 | trapElement: null,
|
|---|
| 489 | // The element to trap focus inside of
|
|---|
| 490 | autofocus: true
|
|---|
| 491 | };
|
|---|
| 492 | const DefaultType$1 = {
|
|---|
| 493 | trapElement: 'element',
|
|---|
| 494 | autofocus: 'boolean'
|
|---|
| 495 | };
|
|---|
| 496 | const NAME$1 = 'focustrap';
|
|---|
| 497 | const DATA_KEY$1 = 'bs.focustrap';
|
|---|
| 498 | const EVENT_KEY$1 = `.${DATA_KEY$1}`;
|
|---|
| 499 | const EVENT_FOCUSIN = `focusin${EVENT_KEY$1}`;
|
|---|
| 500 | const EVENT_KEYDOWN_TAB = `keydown.tab${EVENT_KEY$1}`;
|
|---|
| 501 | const TAB_KEY = 'Tab';
|
|---|
| 502 | const TAB_NAV_FORWARD = 'forward';
|
|---|
| 503 | const TAB_NAV_BACKWARD = 'backward';
|
|---|
| 504 |
|
|---|
| 505 | class FocusTrap {
|
|---|
| 506 | constructor(config) {
|
|---|
| 507 | this._config = this._getConfig(config);
|
|---|
| 508 | this._isActive = false;
|
|---|
| 509 | this._lastTabNavDirection = null;
|
|---|
| 510 | }
|
|---|
| 511 |
|
|---|
| 512 | activate() {
|
|---|
| 513 | const {
|
|---|
| 514 | trapElement,
|
|---|
| 515 | autofocus
|
|---|
| 516 | } = this._config;
|
|---|
| 517 |
|
|---|
| 518 | if (this._isActive) {
|
|---|
| 519 | return;
|
|---|
| 520 | }
|
|---|
| 521 |
|
|---|
| 522 | if (autofocus) {
|
|---|
| 523 | trapElement.focus();
|
|---|
| 524 | }
|
|---|
| 525 |
|
|---|
| 526 | EventHandler__default.default.off(document, EVENT_KEY$1); // guard against infinite focus loop
|
|---|
| 527 |
|
|---|
| 528 | EventHandler__default.default.on(document, EVENT_FOCUSIN, event => this._handleFocusin(event));
|
|---|
| 529 | EventHandler__default.default.on(document, EVENT_KEYDOWN_TAB, event => this._handleKeydown(event));
|
|---|
| 530 | this._isActive = true;
|
|---|
| 531 | }
|
|---|
| 532 |
|
|---|
| 533 | deactivate() {
|
|---|
| 534 | if (!this._isActive) {
|
|---|
| 535 | return;
|
|---|
| 536 | }
|
|---|
| 537 |
|
|---|
| 538 | this._isActive = false;
|
|---|
| 539 | EventHandler__default.default.off(document, EVENT_KEY$1);
|
|---|
| 540 | } // Private
|
|---|
| 541 |
|
|---|
| 542 |
|
|---|
| 543 | _handleFocusin(event) {
|
|---|
| 544 | const {
|
|---|
| 545 | target
|
|---|
| 546 | } = event;
|
|---|
| 547 | const {
|
|---|
| 548 | trapElement
|
|---|
| 549 | } = this._config;
|
|---|
| 550 |
|
|---|
| 551 | if (target === document || target === trapElement || trapElement.contains(target)) {
|
|---|
| 552 | return;
|
|---|
| 553 | }
|
|---|
| 554 |
|
|---|
| 555 | const elements = SelectorEngine__default.default.focusableChildren(trapElement);
|
|---|
| 556 |
|
|---|
| 557 | if (elements.length === 0) {
|
|---|
| 558 | trapElement.focus();
|
|---|
| 559 | } else if (this._lastTabNavDirection === TAB_NAV_BACKWARD) {
|
|---|
| 560 | elements[elements.length - 1].focus();
|
|---|
| 561 | } else {
|
|---|
| 562 | elements[0].focus();
|
|---|
| 563 | }
|
|---|
| 564 | }
|
|---|
| 565 |
|
|---|
| 566 | _handleKeydown(event) {
|
|---|
| 567 | if (event.key !== TAB_KEY) {
|
|---|
| 568 | return;
|
|---|
| 569 | }
|
|---|
| 570 |
|
|---|
| 571 | this._lastTabNavDirection = event.shiftKey ? TAB_NAV_BACKWARD : TAB_NAV_FORWARD;
|
|---|
| 572 | }
|
|---|
| 573 |
|
|---|
| 574 | _getConfig(config) {
|
|---|
| 575 | config = { ...Default$1,
|
|---|
| 576 | ...(typeof config === 'object' ? config : {})
|
|---|
| 577 | };
|
|---|
| 578 | typeCheckConfig(NAME$1, config, DefaultType$1);
|
|---|
| 579 | return config;
|
|---|
| 580 | }
|
|---|
| 581 |
|
|---|
| 582 | }
|
|---|
| 583 |
|
|---|
| 584 | /**
|
|---|
| 585 | * --------------------------------------------------------------------------
|
|---|
| 586 | * Bootstrap (v5.1.3): util/component-functions.js
|
|---|
| 587 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
|---|
| 588 | * --------------------------------------------------------------------------
|
|---|
| 589 | */
|
|---|
| 590 |
|
|---|
| 591 | const enableDismissTrigger = (component, method = 'hide') => {
|
|---|
| 592 | const clickEvent = `click.dismiss${component.EVENT_KEY}`;
|
|---|
| 593 | const name = component.NAME;
|
|---|
| 594 | EventHandler__default.default.on(document, clickEvent, `[data-bs-dismiss="${name}"]`, function (event) {
|
|---|
| 595 | if (['A', 'AREA'].includes(this.tagName)) {
|
|---|
| 596 | event.preventDefault();
|
|---|
| 597 | }
|
|---|
| 598 |
|
|---|
| 599 | if (isDisabled(this)) {
|
|---|
| 600 | return;
|
|---|
| 601 | }
|
|---|
| 602 |
|
|---|
| 603 | const target = getElementFromSelector(this) || this.closest(`.${name}`);
|
|---|
| 604 | const instance = component.getOrCreateInstance(target); // Method argument is left, for Alert and only, as it doesn't implement the 'hide' method
|
|---|
| 605 |
|
|---|
| 606 | instance[method]();
|
|---|
| 607 | });
|
|---|
| 608 | };
|
|---|
| 609 |
|
|---|
| 610 | /**
|
|---|
| 611 | * --------------------------------------------------------------------------
|
|---|
| 612 | * Bootstrap (v5.1.3): modal.js
|
|---|
| 613 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
|---|
| 614 | * --------------------------------------------------------------------------
|
|---|
| 615 | */
|
|---|
| 616 | /**
|
|---|
| 617 | * ------------------------------------------------------------------------
|
|---|
| 618 | * Constants
|
|---|
| 619 | * ------------------------------------------------------------------------
|
|---|
| 620 | */
|
|---|
| 621 |
|
|---|
| 622 | const NAME = 'modal';
|
|---|
| 623 | const DATA_KEY = 'bs.modal';
|
|---|
| 624 | const EVENT_KEY = `.${DATA_KEY}`;
|
|---|
| 625 | const DATA_API_KEY = '.data-api';
|
|---|
| 626 | const ESCAPE_KEY = 'Escape';
|
|---|
| 627 | const Default = {
|
|---|
| 628 | backdrop: true,
|
|---|
| 629 | keyboard: true,
|
|---|
| 630 | focus: true
|
|---|
| 631 | };
|
|---|
| 632 | const DefaultType = {
|
|---|
| 633 | backdrop: '(boolean|string)',
|
|---|
| 634 | keyboard: 'boolean',
|
|---|
| 635 | focus: 'boolean'
|
|---|
| 636 | };
|
|---|
| 637 | const EVENT_HIDE = `hide${EVENT_KEY}`;
|
|---|
| 638 | const EVENT_HIDE_PREVENTED = `hidePrevented${EVENT_KEY}`;
|
|---|
| 639 | const EVENT_HIDDEN = `hidden${EVENT_KEY}`;
|
|---|
| 640 | const EVENT_SHOW = `show${EVENT_KEY}`;
|
|---|
| 641 | const EVENT_SHOWN = `shown${EVENT_KEY}`;
|
|---|
| 642 | const EVENT_RESIZE = `resize${EVENT_KEY}`;
|
|---|
| 643 | const EVENT_CLICK_DISMISS = `click.dismiss${EVENT_KEY}`;
|
|---|
| 644 | const EVENT_KEYDOWN_DISMISS = `keydown.dismiss${EVENT_KEY}`;
|
|---|
| 645 | const EVENT_MOUSEUP_DISMISS = `mouseup.dismiss${EVENT_KEY}`;
|
|---|
| 646 | const EVENT_MOUSEDOWN_DISMISS = `mousedown.dismiss${EVENT_KEY}`;
|
|---|
| 647 | const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}`;
|
|---|
| 648 | const CLASS_NAME_OPEN = 'modal-open';
|
|---|
| 649 | const CLASS_NAME_FADE = 'fade';
|
|---|
| 650 | const CLASS_NAME_SHOW = 'show';
|
|---|
| 651 | const CLASS_NAME_STATIC = 'modal-static';
|
|---|
| 652 | const OPEN_SELECTOR = '.modal.show';
|
|---|
| 653 | const SELECTOR_DIALOG = '.modal-dialog';
|
|---|
| 654 | const SELECTOR_MODAL_BODY = '.modal-body';
|
|---|
| 655 | const SELECTOR_DATA_TOGGLE = '[data-bs-toggle="modal"]';
|
|---|
| 656 | /**
|
|---|
| 657 | * ------------------------------------------------------------------------
|
|---|
| 658 | * Class Definition
|
|---|
| 659 | * ------------------------------------------------------------------------
|
|---|
| 660 | */
|
|---|
| 661 |
|
|---|
| 662 | class Modal extends BaseComponent__default.default {
|
|---|
| 663 | constructor(element, config) {
|
|---|
| 664 | super(element);
|
|---|
| 665 | this._config = this._getConfig(config);
|
|---|
| 666 | this._dialog = SelectorEngine__default.default.findOne(SELECTOR_DIALOG, this._element);
|
|---|
| 667 | this._backdrop = this._initializeBackDrop();
|
|---|
| 668 | this._focustrap = this._initializeFocusTrap();
|
|---|
| 669 | this._isShown = false;
|
|---|
| 670 | this._ignoreBackdropClick = false;
|
|---|
| 671 | this._isTransitioning = false;
|
|---|
| 672 | this._scrollBar = new ScrollBarHelper();
|
|---|
| 673 | } // Getters
|
|---|
| 674 |
|
|---|
| 675 |
|
|---|
| 676 | static get Default() {
|
|---|
| 677 | return Default;
|
|---|
| 678 | }
|
|---|
| 679 |
|
|---|
| 680 | static get NAME() {
|
|---|
| 681 | return NAME;
|
|---|
| 682 | } // Public
|
|---|
| 683 |
|
|---|
| 684 |
|
|---|
| 685 | toggle(relatedTarget) {
|
|---|
| 686 | return this._isShown ? this.hide() : this.show(relatedTarget);
|
|---|
| 687 | }
|
|---|
| 688 |
|
|---|
| 689 | show(relatedTarget) {
|
|---|
| 690 | if (this._isShown || this._isTransitioning) {
|
|---|
| 691 | return;
|
|---|
| 692 | }
|
|---|
| 693 |
|
|---|
| 694 | const showEvent = EventHandler__default.default.trigger(this._element, EVENT_SHOW, {
|
|---|
| 695 | relatedTarget
|
|---|
| 696 | });
|
|---|
| 697 |
|
|---|
| 698 | if (showEvent.defaultPrevented) {
|
|---|
| 699 | return;
|
|---|
| 700 | }
|
|---|
| 701 |
|
|---|
| 702 | this._isShown = true;
|
|---|
| 703 |
|
|---|
| 704 | if (this._isAnimated()) {
|
|---|
| 705 | this._isTransitioning = true;
|
|---|
| 706 | }
|
|---|
| 707 |
|
|---|
| 708 | this._scrollBar.hide();
|
|---|
| 709 |
|
|---|
| 710 | document.body.classList.add(CLASS_NAME_OPEN);
|
|---|
| 711 |
|
|---|
| 712 | this._adjustDialog();
|
|---|
| 713 |
|
|---|
| 714 | this._setEscapeEvent();
|
|---|
| 715 |
|
|---|
| 716 | this._setResizeEvent();
|
|---|
| 717 |
|
|---|
| 718 | EventHandler__default.default.on(this._dialog, EVENT_MOUSEDOWN_DISMISS, () => {
|
|---|
| 719 | EventHandler__default.default.one(this._element, EVENT_MOUSEUP_DISMISS, event => {
|
|---|
| 720 | if (event.target === this._element) {
|
|---|
| 721 | this._ignoreBackdropClick = true;
|
|---|
| 722 | }
|
|---|
| 723 | });
|
|---|
| 724 | });
|
|---|
| 725 |
|
|---|
| 726 | this._showBackdrop(() => this._showElement(relatedTarget));
|
|---|
| 727 | }
|
|---|
| 728 |
|
|---|
| 729 | hide() {
|
|---|
| 730 | if (!this._isShown || this._isTransitioning) {
|
|---|
| 731 | return;
|
|---|
| 732 | }
|
|---|
| 733 |
|
|---|
| 734 | const hideEvent = EventHandler__default.default.trigger(this._element, EVENT_HIDE);
|
|---|
| 735 |
|
|---|
| 736 | if (hideEvent.defaultPrevented) {
|
|---|
| 737 | return;
|
|---|
| 738 | }
|
|---|
| 739 |
|
|---|
| 740 | this._isShown = false;
|
|---|
| 741 |
|
|---|
| 742 | const isAnimated = this._isAnimated();
|
|---|
| 743 |
|
|---|
| 744 | if (isAnimated) {
|
|---|
| 745 | this._isTransitioning = true;
|
|---|
| 746 | }
|
|---|
| 747 |
|
|---|
| 748 | this._setEscapeEvent();
|
|---|
| 749 |
|
|---|
| 750 | this._setResizeEvent();
|
|---|
| 751 |
|
|---|
| 752 | this._focustrap.deactivate();
|
|---|
| 753 |
|
|---|
| 754 | this._element.classList.remove(CLASS_NAME_SHOW);
|
|---|
| 755 |
|
|---|
| 756 | EventHandler__default.default.off(this._element, EVENT_CLICK_DISMISS);
|
|---|
| 757 | EventHandler__default.default.off(this._dialog, EVENT_MOUSEDOWN_DISMISS);
|
|---|
| 758 |
|
|---|
| 759 | this._queueCallback(() => this._hideModal(), this._element, isAnimated);
|
|---|
| 760 | }
|
|---|
| 761 |
|
|---|
| 762 | dispose() {
|
|---|
| 763 | [window, this._dialog].forEach(htmlElement => EventHandler__default.default.off(htmlElement, EVENT_KEY));
|
|---|
| 764 |
|
|---|
| 765 | this._backdrop.dispose();
|
|---|
| 766 |
|
|---|
| 767 | this._focustrap.deactivate();
|
|---|
| 768 |
|
|---|
| 769 | super.dispose();
|
|---|
| 770 | }
|
|---|
| 771 |
|
|---|
| 772 | handleUpdate() {
|
|---|
| 773 | this._adjustDialog();
|
|---|
| 774 | } // Private
|
|---|
| 775 |
|
|---|
| 776 |
|
|---|
| 777 | _initializeBackDrop() {
|
|---|
| 778 | return new Backdrop({
|
|---|
| 779 | isVisible: Boolean(this._config.backdrop),
|
|---|
| 780 | // 'static' option will be translated to true, and booleans will keep their value
|
|---|
| 781 | isAnimated: this._isAnimated()
|
|---|
| 782 | });
|
|---|
| 783 | }
|
|---|
| 784 |
|
|---|
| 785 | _initializeFocusTrap() {
|
|---|
| 786 | return new FocusTrap({
|
|---|
| 787 | trapElement: this._element
|
|---|
| 788 | });
|
|---|
| 789 | }
|
|---|
| 790 |
|
|---|
| 791 | _getConfig(config) {
|
|---|
| 792 | config = { ...Default,
|
|---|
| 793 | ...Manipulator__default.default.getDataAttributes(this._element),
|
|---|
| 794 | ...(typeof config === 'object' ? config : {})
|
|---|
| 795 | };
|
|---|
| 796 | typeCheckConfig(NAME, config, DefaultType);
|
|---|
| 797 | return config;
|
|---|
| 798 | }
|
|---|
| 799 |
|
|---|
| 800 | _showElement(relatedTarget) {
|
|---|
| 801 | const isAnimated = this._isAnimated();
|
|---|
| 802 |
|
|---|
| 803 | const modalBody = SelectorEngine__default.default.findOne(SELECTOR_MODAL_BODY, this._dialog);
|
|---|
| 804 |
|
|---|
| 805 | if (!this._element.parentNode || this._element.parentNode.nodeType !== Node.ELEMENT_NODE) {
|
|---|
| 806 | // Don't move modal's DOM position
|
|---|
| 807 | document.body.append(this._element);
|
|---|
| 808 | }
|
|---|
| 809 |
|
|---|
| 810 | this._element.style.display = 'block';
|
|---|
| 811 |
|
|---|
| 812 | this._element.removeAttribute('aria-hidden');
|
|---|
| 813 |
|
|---|
| 814 | this._element.setAttribute('aria-modal', true);
|
|---|
| 815 |
|
|---|
| 816 | this._element.setAttribute('role', 'dialog');
|
|---|
| 817 |
|
|---|
| 818 | this._element.scrollTop = 0;
|
|---|
| 819 |
|
|---|
| 820 | if (modalBody) {
|
|---|
| 821 | modalBody.scrollTop = 0;
|
|---|
| 822 | }
|
|---|
| 823 |
|
|---|
| 824 | if (isAnimated) {
|
|---|
| 825 | reflow(this._element);
|
|---|
| 826 | }
|
|---|
| 827 |
|
|---|
| 828 | this._element.classList.add(CLASS_NAME_SHOW);
|
|---|
| 829 |
|
|---|
| 830 | const transitionComplete = () => {
|
|---|
| 831 | if (this._config.focus) {
|
|---|
| 832 | this._focustrap.activate();
|
|---|
| 833 | }
|
|---|
| 834 |
|
|---|
| 835 | this._isTransitioning = false;
|
|---|
| 836 | EventHandler__default.default.trigger(this._element, EVENT_SHOWN, {
|
|---|
| 837 | relatedTarget
|
|---|
| 838 | });
|
|---|
| 839 | };
|
|---|
| 840 |
|
|---|
| 841 | this._queueCallback(transitionComplete, this._dialog, isAnimated);
|
|---|
| 842 | }
|
|---|
| 843 |
|
|---|
| 844 | _setEscapeEvent() {
|
|---|
| 845 | if (this._isShown) {
|
|---|
| 846 | EventHandler__default.default.on(this._element, EVENT_KEYDOWN_DISMISS, event => {
|
|---|
| 847 | if (this._config.keyboard && event.key === ESCAPE_KEY) {
|
|---|
| 848 | event.preventDefault();
|
|---|
| 849 | this.hide();
|
|---|
| 850 | } else if (!this._config.keyboard && event.key === ESCAPE_KEY) {
|
|---|
| 851 | this._triggerBackdropTransition();
|
|---|
| 852 | }
|
|---|
| 853 | });
|
|---|
| 854 | } else {
|
|---|
| 855 | EventHandler__default.default.off(this._element, EVENT_KEYDOWN_DISMISS);
|
|---|
| 856 | }
|
|---|
| 857 | }
|
|---|
| 858 |
|
|---|
| 859 | _setResizeEvent() {
|
|---|
| 860 | if (this._isShown) {
|
|---|
| 861 | EventHandler__default.default.on(window, EVENT_RESIZE, () => this._adjustDialog());
|
|---|
| 862 | } else {
|
|---|
| 863 | EventHandler__default.default.off(window, EVENT_RESIZE);
|
|---|
| 864 | }
|
|---|
| 865 | }
|
|---|
| 866 |
|
|---|
| 867 | _hideModal() {
|
|---|
| 868 | this._element.style.display = 'none';
|
|---|
| 869 |
|
|---|
| 870 | this._element.setAttribute('aria-hidden', true);
|
|---|
| 871 |
|
|---|
| 872 | this._element.removeAttribute('aria-modal');
|
|---|
| 873 |
|
|---|
| 874 | this._element.removeAttribute('role');
|
|---|
| 875 |
|
|---|
| 876 | this._isTransitioning = false;
|
|---|
| 877 |
|
|---|
| 878 | this._backdrop.hide(() => {
|
|---|
| 879 | document.body.classList.remove(CLASS_NAME_OPEN);
|
|---|
| 880 |
|
|---|
| 881 | this._resetAdjustments();
|
|---|
| 882 |
|
|---|
| 883 | this._scrollBar.reset();
|
|---|
| 884 |
|
|---|
| 885 | EventHandler__default.default.trigger(this._element, EVENT_HIDDEN);
|
|---|
| 886 | });
|
|---|
| 887 | }
|
|---|
| 888 |
|
|---|
| 889 | _showBackdrop(callback) {
|
|---|
| 890 | EventHandler__default.default.on(this._element, EVENT_CLICK_DISMISS, event => {
|
|---|
| 891 | if (this._ignoreBackdropClick) {
|
|---|
| 892 | this._ignoreBackdropClick = false;
|
|---|
| 893 | return;
|
|---|
| 894 | }
|
|---|
| 895 |
|
|---|
| 896 | if (event.target !== event.currentTarget) {
|
|---|
| 897 | return;
|
|---|
| 898 | }
|
|---|
| 899 |
|
|---|
| 900 | if (this._config.backdrop === true) {
|
|---|
| 901 | this.hide();
|
|---|
| 902 | } else if (this._config.backdrop === 'static') {
|
|---|
| 903 | this._triggerBackdropTransition();
|
|---|
| 904 | }
|
|---|
| 905 | });
|
|---|
| 906 |
|
|---|
| 907 | this._backdrop.show(callback);
|
|---|
| 908 | }
|
|---|
| 909 |
|
|---|
| 910 | _isAnimated() {
|
|---|
| 911 | return this._element.classList.contains(CLASS_NAME_FADE);
|
|---|
| 912 | }
|
|---|
| 913 |
|
|---|
| 914 | _triggerBackdropTransition() {
|
|---|
| 915 | const hideEvent = EventHandler__default.default.trigger(this._element, EVENT_HIDE_PREVENTED);
|
|---|
| 916 |
|
|---|
| 917 | if (hideEvent.defaultPrevented) {
|
|---|
| 918 | return;
|
|---|
| 919 | }
|
|---|
| 920 |
|
|---|
| 921 | const {
|
|---|
| 922 | classList,
|
|---|
| 923 | scrollHeight,
|
|---|
| 924 | style
|
|---|
| 925 | } = this._element;
|
|---|
| 926 | const isModalOverflowing = scrollHeight > document.documentElement.clientHeight; // return if the following background transition hasn't yet completed
|
|---|
| 927 |
|
|---|
| 928 | if (!isModalOverflowing && style.overflowY === 'hidden' || classList.contains(CLASS_NAME_STATIC)) {
|
|---|
| 929 | return;
|
|---|
| 930 | }
|
|---|
| 931 |
|
|---|
| 932 | if (!isModalOverflowing) {
|
|---|
| 933 | style.overflowY = 'hidden';
|
|---|
| 934 | }
|
|---|
| 935 |
|
|---|
| 936 | classList.add(CLASS_NAME_STATIC);
|
|---|
| 937 |
|
|---|
| 938 | this._queueCallback(() => {
|
|---|
| 939 | classList.remove(CLASS_NAME_STATIC);
|
|---|
| 940 |
|
|---|
| 941 | if (!isModalOverflowing) {
|
|---|
| 942 | this._queueCallback(() => {
|
|---|
| 943 | style.overflowY = '';
|
|---|
| 944 | }, this._dialog);
|
|---|
| 945 | }
|
|---|
| 946 | }, this._dialog);
|
|---|
| 947 |
|
|---|
| 948 | this._element.focus();
|
|---|
| 949 | } // ----------------------------------------------------------------------
|
|---|
| 950 | // the following methods are used to handle overflowing modals
|
|---|
| 951 | // ----------------------------------------------------------------------
|
|---|
| 952 |
|
|---|
| 953 |
|
|---|
| 954 | _adjustDialog() {
|
|---|
| 955 | const isModalOverflowing = this._element.scrollHeight > document.documentElement.clientHeight;
|
|---|
| 956 |
|
|---|
| 957 | const scrollbarWidth = this._scrollBar.getWidth();
|
|---|
| 958 |
|
|---|
| 959 | const isBodyOverflowing = scrollbarWidth > 0;
|
|---|
| 960 |
|
|---|
| 961 | if (!isBodyOverflowing && isModalOverflowing && !isRTL() || isBodyOverflowing && !isModalOverflowing && isRTL()) {
|
|---|
| 962 | this._element.style.paddingLeft = `${scrollbarWidth}px`;
|
|---|
| 963 | }
|
|---|
| 964 |
|
|---|
| 965 | if (isBodyOverflowing && !isModalOverflowing && !isRTL() || !isBodyOverflowing && isModalOverflowing && isRTL()) {
|
|---|
| 966 | this._element.style.paddingRight = `${scrollbarWidth}px`;
|
|---|
| 967 | }
|
|---|
| 968 | }
|
|---|
| 969 |
|
|---|
| 970 | _resetAdjustments() {
|
|---|
| 971 | this._element.style.paddingLeft = '';
|
|---|
| 972 | this._element.style.paddingRight = '';
|
|---|
| 973 | } // Static
|
|---|
| 974 |
|
|---|
| 975 |
|
|---|
| 976 | static jQueryInterface(config, relatedTarget) {
|
|---|
| 977 | return this.each(function () {
|
|---|
| 978 | const data = Modal.getOrCreateInstance(this, config);
|
|---|
| 979 |
|
|---|
| 980 | if (typeof config !== 'string') {
|
|---|
| 981 | return;
|
|---|
| 982 | }
|
|---|
| 983 |
|
|---|
| 984 | if (typeof data[config] === 'undefined') {
|
|---|
| 985 | throw new TypeError(`No method named "${config}"`);
|
|---|
| 986 | }
|
|---|
| 987 |
|
|---|
| 988 | data[config](relatedTarget);
|
|---|
| 989 | });
|
|---|
| 990 | }
|
|---|
| 991 |
|
|---|
| 992 | }
|
|---|
| 993 | /**
|
|---|
| 994 | * ------------------------------------------------------------------------
|
|---|
| 995 | * Data Api implementation
|
|---|
| 996 | * ------------------------------------------------------------------------
|
|---|
| 997 | */
|
|---|
| 998 |
|
|---|
| 999 |
|
|---|
| 1000 | EventHandler__default.default.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
|
|---|
| 1001 | const target = getElementFromSelector(this);
|
|---|
| 1002 |
|
|---|
| 1003 | if (['A', 'AREA'].includes(this.tagName)) {
|
|---|
| 1004 | event.preventDefault();
|
|---|
| 1005 | }
|
|---|
| 1006 |
|
|---|
| 1007 | EventHandler__default.default.one(target, EVENT_SHOW, showEvent => {
|
|---|
| 1008 | if (showEvent.defaultPrevented) {
|
|---|
| 1009 | // only register focus restorer if modal will actually get shown
|
|---|
| 1010 | return;
|
|---|
| 1011 | }
|
|---|
| 1012 |
|
|---|
| 1013 | EventHandler__default.default.one(target, EVENT_HIDDEN, () => {
|
|---|
| 1014 | if (isVisible(this)) {
|
|---|
| 1015 | this.focus();
|
|---|
| 1016 | }
|
|---|
| 1017 | });
|
|---|
| 1018 | }); // avoid conflict when clicking moddal toggler while another one is open
|
|---|
| 1019 |
|
|---|
| 1020 | const allReadyOpen = SelectorEngine__default.default.findOne(OPEN_SELECTOR);
|
|---|
| 1021 |
|
|---|
| 1022 | if (allReadyOpen) {
|
|---|
| 1023 | Modal.getInstance(allReadyOpen).hide();
|
|---|
| 1024 | }
|
|---|
| 1025 |
|
|---|
| 1026 | const data = Modal.getOrCreateInstance(target);
|
|---|
| 1027 | data.toggle(this);
|
|---|
| 1028 | });
|
|---|
| 1029 | enableDismissTrigger(Modal);
|
|---|
| 1030 | /**
|
|---|
| 1031 | * ------------------------------------------------------------------------
|
|---|
| 1032 | * jQuery
|
|---|
| 1033 | * ------------------------------------------------------------------------
|
|---|
| 1034 | * add .Modal to jQuery only if jQuery is present
|
|---|
| 1035 | */
|
|---|
| 1036 |
|
|---|
| 1037 | defineJQueryPlugin(Modal);
|
|---|
| 1038 |
|
|---|
| 1039 | return Modal;
|
|---|
| 1040 |
|
|---|
| 1041 | }));
|
|---|
| 1042 | //# sourceMappingURL=modal.js.map
|
|---|
