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