bootstrap 5.0.2 → 5.1.3
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.
- checksums.yaml +4 -4
- data/README.md +1 -1
- data/assets/javascripts/bootstrap/alert.js +78 -48
- data/assets/javascripts/bootstrap/base-component.js +22 -17
- data/assets/javascripts/bootstrap/button.js +19 -12
- data/assets/javascripts/bootstrap/carousel.js +66 -44
- data/assets/javascripts/bootstrap/collapse.js +114 -131
- data/assets/javascripts/bootstrap/dom/data.js +5 -5
- data/assets/javascripts/bootstrap/dom/event-handler.js +11 -5
- data/assets/javascripts/bootstrap/dom/manipulator.js +6 -6
- data/assets/javascripts/bootstrap/dom/selector-engine.js +49 -7
- data/assets/javascripts/bootstrap/dropdown.js +96 -106
- data/assets/javascripts/bootstrap/modal.js +241 -87
- data/assets/javascripts/bootstrap/offcanvas.js +203 -57
- data/assets/javascripts/bootstrap/popover.js +25 -58
- data/assets/javascripts/bootstrap/scrollspy.js +47 -66
- data/assets/javascripts/bootstrap/tab.js +41 -22
- data/assets/javascripts/bootstrap/toast.js +124 -29
- data/assets/javascripts/bootstrap/tooltip.js +122 -104
- data/assets/javascripts/bootstrap-sprockets.js +7 -7
- data/assets/javascripts/bootstrap.js +660 -630
- data/assets/javascripts/bootstrap.min.js +2 -2
- data/assets/stylesheets/_bootstrap-grid.scss +3 -1
- data/assets/stylesheets/_bootstrap-reboot.scss +2 -4
- data/assets/stylesheets/_bootstrap.scss +2 -1
- data/assets/stylesheets/bootstrap/_card.scss +2 -1
- data/assets/stylesheets/bootstrap/_functions.scss +51 -12
- data/assets/stylesheets/bootstrap/_grid.scss +11 -0
- data/assets/stylesheets/bootstrap/_helpers.scss +2 -0
- data/assets/stylesheets/bootstrap/_mixins.scss +1 -0
- data/assets/stylesheets/bootstrap/_modal.scss +1 -11
- data/assets/stylesheets/bootstrap/_navbar.scss +30 -1
- data/assets/stylesheets/bootstrap/_offcanvas.scss +4 -0
- data/assets/stylesheets/bootstrap/_placeholders.scss +51 -0
- data/assets/stylesheets/bootstrap/_reboot.scss +12 -8
- data/assets/stylesheets/bootstrap/_root.scss +40 -2
- data/assets/stylesheets/bootstrap/_tables.scss +8 -4
- data/assets/stylesheets/bootstrap/_toasts.scss +2 -2
- data/assets/stylesheets/bootstrap/_transitions.scss +6 -0
- data/assets/stylesheets/bootstrap/_utilities.scss +44 -8
- data/assets/stylesheets/bootstrap/_variables.scss +184 -11
- data/assets/stylesheets/bootstrap/bootstrap-utilities.scss +1 -1
- data/assets/stylesheets/bootstrap/forms/_form-control.scss +1 -1
- data/assets/stylesheets/bootstrap/forms/_form-select.scss +2 -0
- data/assets/stylesheets/bootstrap/helpers/_stacks.scss +15 -0
- data/assets/stylesheets/bootstrap/helpers/_vr.scss +8 -0
- data/assets/stylesheets/bootstrap/mixins/_backdrop.scss +14 -0
- data/assets/stylesheets/bootstrap/mixins/_grid.scss +29 -10
- data/assets/stylesheets/bootstrap/mixins/_utilities.scss +27 -6
- data/assets/stylesheets/bootstrap/mixins/_visually-hidden.scss +1 -1
- data/bootstrap.gemspec +3 -3
- data/lib/bootstrap/version.rb +2 -2
- data/tasks/updater/js.rb +6 -2
- metadata +12 -8
@@ -1,21 +1,27 @@
|
|
1
1
|
/*!
|
2
|
-
* Bootstrap modal.js v5.
|
2
|
+
* Bootstrap modal.js v5.1.3 (https://getbootstrap.com/)
|
3
3
|
* Copyright 2011-2021 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
|
4
4
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
5
5
|
*/
|
6
6
|
(function (global, factory) {
|
7
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('./dom/
|
8
|
-
typeof define === 'function' && define.amd ? define(['./dom/
|
9
|
-
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.Modal = factory(global.
|
10
|
-
}(this, (function (
|
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
11
|
|
12
|
-
|
12
|
+
const _interopDefaultLegacy = e => e && typeof e === 'object' && 'default' in e ? e : { default: e };
|
13
13
|
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
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
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
|
+
*/
|
19
25
|
const MILLISECONDS_MULTIPLIER = 1000;
|
20
26
|
const TRANSITION_END = 'transitionend'; // Shoutout AngusCroll (https://goo.gl/pxwQGp)
|
21
27
|
|
@@ -102,7 +108,7 @@
|
|
102
108
|
}
|
103
109
|
|
104
110
|
if (typeof obj === 'string' && obj.length > 0) {
|
105
|
-
return
|
111
|
+
return document.querySelector(obj);
|
106
112
|
}
|
107
113
|
|
108
114
|
return null;
|
@@ -128,7 +134,35 @@
|
|
128
134
|
return getComputedStyle(element).getPropertyValue('visibility') === 'visible';
|
129
135
|
};
|
130
136
|
|
131
|
-
const
|
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
|
+
};
|
132
166
|
|
133
167
|
const getjQuery = () => {
|
134
168
|
const {
|
@@ -218,7 +252,7 @@
|
|
218
252
|
|
219
253
|
/**
|
220
254
|
* --------------------------------------------------------------------------
|
221
|
-
* Bootstrap (v5.
|
255
|
+
* Bootstrap (v5.1.3): util/scrollBar.js
|
222
256
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
223
257
|
* --------------------------------------------------------------------------
|
224
258
|
*/
|
@@ -287,18 +321,18 @@
|
|
287
321
|
const actualValue = element.style[styleProp];
|
288
322
|
|
289
323
|
if (actualValue) {
|
290
|
-
Manipulator__default
|
324
|
+
Manipulator__default.default.setDataAttribute(element, styleProp, actualValue);
|
291
325
|
}
|
292
326
|
}
|
293
327
|
|
294
328
|
_resetElementAttributes(selector, styleProp) {
|
295
329
|
const manipulationCallBack = element => {
|
296
|
-
const value = Manipulator__default
|
330
|
+
const value = Manipulator__default.default.getDataAttribute(element, styleProp);
|
297
331
|
|
298
332
|
if (typeof value === 'undefined') {
|
299
333
|
element.style.removeProperty(styleProp);
|
300
334
|
} else {
|
301
|
-
Manipulator__default
|
335
|
+
Manipulator__default.default.removeDataAttribute(element, styleProp);
|
302
336
|
element.style[styleProp] = value;
|
303
337
|
}
|
304
338
|
};
|
@@ -310,7 +344,7 @@
|
|
310
344
|
if (isElement(selector)) {
|
311
345
|
callBack(selector);
|
312
346
|
} else {
|
313
|
-
SelectorEngine__default
|
347
|
+
SelectorEngine__default.default.find(selector, this._element).forEach(callBack);
|
314
348
|
}
|
315
349
|
}
|
316
350
|
|
@@ -322,11 +356,12 @@
|
|
322
356
|
|
323
357
|
/**
|
324
358
|
* --------------------------------------------------------------------------
|
325
|
-
* Bootstrap (v5.
|
326
|
-
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/
|
359
|
+
* Bootstrap (v5.1.3): util/backdrop.js
|
360
|
+
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
327
361
|
* --------------------------------------------------------------------------
|
328
362
|
*/
|
329
|
-
const Default$
|
363
|
+
const Default$2 = {
|
364
|
+
className: 'modal-backdrop',
|
330
365
|
isVisible: true,
|
331
366
|
// if false, we use the backdrop helper without adding any element to the dom
|
332
367
|
isAnimated: false,
|
@@ -334,17 +369,17 @@
|
|
334
369
|
// give the choice to place backdrop under different elements
|
335
370
|
clickCallback: null
|
336
371
|
};
|
337
|
-
const DefaultType$
|
372
|
+
const DefaultType$2 = {
|
373
|
+
className: 'string',
|
338
374
|
isVisible: 'boolean',
|
339
375
|
isAnimated: 'boolean',
|
340
376
|
rootElement: '(element|string)',
|
341
377
|
clickCallback: '(function|null)'
|
342
378
|
};
|
343
|
-
const NAME$
|
344
|
-
const CLASS_NAME_BACKDROP = 'modal-backdrop';
|
379
|
+
const NAME$2 = 'backdrop';
|
345
380
|
const CLASS_NAME_FADE$1 = 'fade';
|
346
381
|
const CLASS_NAME_SHOW$1 = 'show';
|
347
|
-
const EVENT_MOUSEDOWN = `mousedown.bs.${NAME$
|
382
|
+
const EVENT_MOUSEDOWN = `mousedown.bs.${NAME$2}`;
|
348
383
|
|
349
384
|
class Backdrop {
|
350
385
|
constructor(config) {
|
@@ -390,7 +425,7 @@
|
|
390
425
|
_getElement() {
|
391
426
|
if (!this._element) {
|
392
427
|
const backdrop = document.createElement('div');
|
393
|
-
backdrop.className =
|
428
|
+
backdrop.className = this._config.className;
|
394
429
|
|
395
430
|
if (this._config.isAnimated) {
|
396
431
|
backdrop.classList.add(CLASS_NAME_FADE$1);
|
@@ -403,12 +438,12 @@
|
|
403
438
|
}
|
404
439
|
|
405
440
|
_getConfig(config) {
|
406
|
-
config = { ...Default$
|
441
|
+
config = { ...Default$2,
|
407
442
|
...(typeof config === 'object' ? config : {})
|
408
443
|
}; // use getElement() with the default "body" to get a fresh Element on each instantiation
|
409
444
|
|
410
445
|
config.rootElement = getElement(config.rootElement);
|
411
|
-
typeCheckConfig(NAME$
|
446
|
+
typeCheckConfig(NAME$2, config, DefaultType$2);
|
412
447
|
return config;
|
413
448
|
}
|
414
449
|
|
@@ -417,9 +452,9 @@
|
|
417
452
|
return;
|
418
453
|
}
|
419
454
|
|
420
|
-
this._config.rootElement.
|
455
|
+
this._config.rootElement.append(this._getElement());
|
421
456
|
|
422
|
-
EventHandler__default
|
457
|
+
EventHandler__default.default.on(this._getElement(), EVENT_MOUSEDOWN, () => {
|
423
458
|
execute(this._config.clickCallback);
|
424
459
|
});
|
425
460
|
this._isAppended = true;
|
@@ -430,7 +465,7 @@
|
|
430
465
|
return;
|
431
466
|
}
|
432
467
|
|
433
|
-
EventHandler__default
|
468
|
+
EventHandler__default.default.off(this._element, EVENT_MOUSEDOWN);
|
434
469
|
|
435
470
|
this._element.remove();
|
436
471
|
|
@@ -445,7 +480,136 @@
|
|
445
480
|
|
446
481
|
/**
|
447
482
|
* --------------------------------------------------------------------------
|
448
|
-
* Bootstrap (v5.
|
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
|
449
613
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
450
614
|
* --------------------------------------------------------------------------
|
451
615
|
*/
|
@@ -475,7 +639,6 @@
|
|
475
639
|
const EVENT_HIDDEN = `hidden${EVENT_KEY}`;
|
476
640
|
const EVENT_SHOW = `show${EVENT_KEY}`;
|
477
641
|
const EVENT_SHOWN = `shown${EVENT_KEY}`;
|
478
|
-
const EVENT_FOCUSIN = `focusin${EVENT_KEY}`;
|
479
642
|
const EVENT_RESIZE = `resize${EVENT_KEY}`;
|
480
643
|
const EVENT_CLICK_DISMISS = `click.dismiss${EVENT_KEY}`;
|
481
644
|
const EVENT_KEYDOWN_DISMISS = `keydown.dismiss${EVENT_KEY}`;
|
@@ -486,22 +649,23 @@
|
|
486
649
|
const CLASS_NAME_FADE = 'fade';
|
487
650
|
const CLASS_NAME_SHOW = 'show';
|
488
651
|
const CLASS_NAME_STATIC = 'modal-static';
|
652
|
+
const OPEN_SELECTOR = '.modal.show';
|
489
653
|
const SELECTOR_DIALOG = '.modal-dialog';
|
490
654
|
const SELECTOR_MODAL_BODY = '.modal-body';
|
491
655
|
const SELECTOR_DATA_TOGGLE = '[data-bs-toggle="modal"]';
|
492
|
-
const SELECTOR_DATA_DISMISS = '[data-bs-dismiss="modal"]';
|
493
656
|
/**
|
494
657
|
* ------------------------------------------------------------------------
|
495
658
|
* Class Definition
|
496
659
|
* ------------------------------------------------------------------------
|
497
660
|
*/
|
498
661
|
|
499
|
-
class Modal extends BaseComponent__default
|
662
|
+
class Modal extends BaseComponent__default.default {
|
500
663
|
constructor(element, config) {
|
501
664
|
super(element);
|
502
665
|
this._config = this._getConfig(config);
|
503
|
-
this._dialog = SelectorEngine__default
|
666
|
+
this._dialog = SelectorEngine__default.default.findOne(SELECTOR_DIALOG, this._element);
|
504
667
|
this._backdrop = this._initializeBackDrop();
|
668
|
+
this._focustrap = this._initializeFocusTrap();
|
505
669
|
this._isShown = false;
|
506
670
|
this._ignoreBackdropClick = false;
|
507
671
|
this._isTransitioning = false;
|
@@ -527,7 +691,7 @@
|
|
527
691
|
return;
|
528
692
|
}
|
529
693
|
|
530
|
-
const showEvent = EventHandler__default
|
694
|
+
const showEvent = EventHandler__default.default.trigger(this._element, EVENT_SHOW, {
|
531
695
|
relatedTarget
|
532
696
|
});
|
533
697
|
|
@@ -551,9 +715,8 @@
|
|
551
715
|
|
552
716
|
this._setResizeEvent();
|
553
717
|
|
554
|
-
EventHandler__default
|
555
|
-
|
556
|
-
EventHandler__default['default'].one(this._element, EVENT_MOUSEUP_DISMISS, event => {
|
718
|
+
EventHandler__default.default.on(this._dialog, EVENT_MOUSEDOWN_DISMISS, () => {
|
719
|
+
EventHandler__default.default.one(this._element, EVENT_MOUSEUP_DISMISS, event => {
|
557
720
|
if (event.target === this._element) {
|
558
721
|
this._ignoreBackdropClick = true;
|
559
722
|
}
|
@@ -563,16 +726,12 @@
|
|
563
726
|
this._showBackdrop(() => this._showElement(relatedTarget));
|
564
727
|
}
|
565
728
|
|
566
|
-
hide(
|
567
|
-
if (event && ['A', 'AREA'].includes(event.target.tagName)) {
|
568
|
-
event.preventDefault();
|
569
|
-
}
|
570
|
-
|
729
|
+
hide() {
|
571
730
|
if (!this._isShown || this._isTransitioning) {
|
572
731
|
return;
|
573
732
|
}
|
574
733
|
|
575
|
-
const hideEvent = EventHandler__default
|
734
|
+
const hideEvent = EventHandler__default.default.trigger(this._element, EVENT_HIDE);
|
576
735
|
|
577
736
|
if (hideEvent.defaultPrevented) {
|
578
737
|
return;
|
@@ -590,29 +749,24 @@
|
|
590
749
|
|
591
750
|
this._setResizeEvent();
|
592
751
|
|
593
|
-
|
752
|
+
this._focustrap.deactivate();
|
594
753
|
|
595
754
|
this._element.classList.remove(CLASS_NAME_SHOW);
|
596
755
|
|
597
|
-
EventHandler__default
|
598
|
-
EventHandler__default
|
756
|
+
EventHandler__default.default.off(this._element, EVENT_CLICK_DISMISS);
|
757
|
+
EventHandler__default.default.off(this._dialog, EVENT_MOUSEDOWN_DISMISS);
|
599
758
|
|
600
759
|
this._queueCallback(() => this._hideModal(), this._element, isAnimated);
|
601
760
|
}
|
602
761
|
|
603
762
|
dispose() {
|
604
|
-
[window, this._dialog].forEach(htmlElement => EventHandler__default
|
763
|
+
[window, this._dialog].forEach(htmlElement => EventHandler__default.default.off(htmlElement, EVENT_KEY));
|
605
764
|
|
606
765
|
this._backdrop.dispose();
|
607
766
|
|
608
|
-
|
609
|
-
/**
|
610
|
-
* `document` has 2 events `EVENT_FOCUSIN` and `EVENT_CLICK_DATA_API`
|
611
|
-
* Do not move `document` in `htmlElements` array
|
612
|
-
* It will remove `EVENT_CLICK_DATA_API` event that should remain
|
613
|
-
*/
|
767
|
+
this._focustrap.deactivate();
|
614
768
|
|
615
|
-
|
769
|
+
super.dispose();
|
616
770
|
}
|
617
771
|
|
618
772
|
handleUpdate() {
|
@@ -628,9 +782,15 @@
|
|
628
782
|
});
|
629
783
|
}
|
630
784
|
|
785
|
+
_initializeFocusTrap() {
|
786
|
+
return new FocusTrap({
|
787
|
+
trapElement: this._element
|
788
|
+
});
|
789
|
+
}
|
790
|
+
|
631
791
|
_getConfig(config) {
|
632
792
|
config = { ...Default,
|
633
|
-
...Manipulator__default
|
793
|
+
...Manipulator__default.default.getDataAttributes(this._element),
|
634
794
|
...(typeof config === 'object' ? config : {})
|
635
795
|
};
|
636
796
|
typeCheckConfig(NAME, config, DefaultType);
|
@@ -640,11 +800,11 @@
|
|
640
800
|
_showElement(relatedTarget) {
|
641
801
|
const isAnimated = this._isAnimated();
|
642
802
|
|
643
|
-
const modalBody = SelectorEngine__default
|
803
|
+
const modalBody = SelectorEngine__default.default.findOne(SELECTOR_MODAL_BODY, this._dialog);
|
644
804
|
|
645
805
|
if (!this._element.parentNode || this._element.parentNode.nodeType !== Node.ELEMENT_NODE) {
|
646
806
|
// Don't move modal's DOM position
|
647
|
-
document.body.
|
807
|
+
document.body.append(this._element);
|
648
808
|
}
|
649
809
|
|
650
810
|
this._element.style.display = 'block';
|
@@ -667,17 +827,13 @@
|
|
667
827
|
|
668
828
|
this._element.classList.add(CLASS_NAME_SHOW);
|
669
829
|
|
670
|
-
if (this._config.focus) {
|
671
|
-
this._enforceFocus();
|
672
|
-
}
|
673
|
-
|
674
830
|
const transitionComplete = () => {
|
675
831
|
if (this._config.focus) {
|
676
|
-
this.
|
832
|
+
this._focustrap.activate();
|
677
833
|
}
|
678
834
|
|
679
835
|
this._isTransitioning = false;
|
680
|
-
EventHandler__default
|
836
|
+
EventHandler__default.default.trigger(this._element, EVENT_SHOWN, {
|
681
837
|
relatedTarget
|
682
838
|
});
|
683
839
|
};
|
@@ -685,19 +841,9 @@
|
|
685
841
|
this._queueCallback(transitionComplete, this._dialog, isAnimated);
|
686
842
|
}
|
687
843
|
|
688
|
-
_enforceFocus() {
|
689
|
-
EventHandler__default['default'].off(document, EVENT_FOCUSIN); // guard against infinite focus loop
|
690
|
-
|
691
|
-
EventHandler__default['default'].on(document, EVENT_FOCUSIN, event => {
|
692
|
-
if (document !== event.target && this._element !== event.target && !this._element.contains(event.target)) {
|
693
|
-
this._element.focus();
|
694
|
-
}
|
695
|
-
});
|
696
|
-
}
|
697
|
-
|
698
844
|
_setEscapeEvent() {
|
699
845
|
if (this._isShown) {
|
700
|
-
EventHandler__default
|
846
|
+
EventHandler__default.default.on(this._element, EVENT_KEYDOWN_DISMISS, event => {
|
701
847
|
if (this._config.keyboard && event.key === ESCAPE_KEY) {
|
702
848
|
event.preventDefault();
|
703
849
|
this.hide();
|
@@ -706,15 +852,15 @@
|
|
706
852
|
}
|
707
853
|
});
|
708
854
|
} else {
|
709
|
-
EventHandler__default
|
855
|
+
EventHandler__default.default.off(this._element, EVENT_KEYDOWN_DISMISS);
|
710
856
|
}
|
711
857
|
}
|
712
858
|
|
713
859
|
_setResizeEvent() {
|
714
860
|
if (this._isShown) {
|
715
|
-
EventHandler__default
|
861
|
+
EventHandler__default.default.on(window, EVENT_RESIZE, () => this._adjustDialog());
|
716
862
|
} else {
|
717
|
-
EventHandler__default
|
863
|
+
EventHandler__default.default.off(window, EVENT_RESIZE);
|
718
864
|
}
|
719
865
|
}
|
720
866
|
|
@@ -736,12 +882,12 @@
|
|
736
882
|
|
737
883
|
this._scrollBar.reset();
|
738
884
|
|
739
|
-
EventHandler__default
|
885
|
+
EventHandler__default.default.trigger(this._element, EVENT_HIDDEN);
|
740
886
|
});
|
741
887
|
}
|
742
888
|
|
743
889
|
_showBackdrop(callback) {
|
744
|
-
EventHandler__default
|
890
|
+
EventHandler__default.default.on(this._element, EVENT_CLICK_DISMISS, event => {
|
745
891
|
if (this._ignoreBackdropClick) {
|
746
892
|
this._ignoreBackdropClick = false;
|
747
893
|
return;
|
@@ -766,7 +912,7 @@
|
|
766
912
|
}
|
767
913
|
|
768
914
|
_triggerBackdropTransition() {
|
769
|
-
const hideEvent = EventHandler__default
|
915
|
+
const hideEvent = EventHandler__default.default.trigger(this._element, EVENT_HIDE_PREVENTED);
|
770
916
|
|
771
917
|
if (hideEvent.defaultPrevented) {
|
772
918
|
return;
|
@@ -851,28 +997,36 @@
|
|
851
997
|
*/
|
852
998
|
|
853
999
|
|
854
|
-
EventHandler__default
|
1000
|
+
EventHandler__default.default.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
|
855
1001
|
const target = getElementFromSelector(this);
|
856
1002
|
|
857
1003
|
if (['A', 'AREA'].includes(this.tagName)) {
|
858
1004
|
event.preventDefault();
|
859
1005
|
}
|
860
1006
|
|
861
|
-
EventHandler__default
|
1007
|
+
EventHandler__default.default.one(target, EVENT_SHOW, showEvent => {
|
862
1008
|
if (showEvent.defaultPrevented) {
|
863
1009
|
// only register focus restorer if modal will actually get shown
|
864
1010
|
return;
|
865
1011
|
}
|
866
1012
|
|
867
|
-
EventHandler__default
|
1013
|
+
EventHandler__default.default.one(target, EVENT_HIDDEN, () => {
|
868
1014
|
if (isVisible(this)) {
|
869
1015
|
this.focus();
|
870
1016
|
}
|
871
1017
|
});
|
872
|
-
});
|
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
|
+
|
873
1026
|
const data = Modal.getOrCreateInstance(target);
|
874
1027
|
data.toggle(this);
|
875
1028
|
});
|
1029
|
+
enableDismissTrigger(Modal);
|
876
1030
|
/**
|
877
1031
|
* ------------------------------------------------------------------------
|
878
1032
|
* jQuery
|
@@ -884,4 +1038,4 @@
|
|
884
1038
|
|
885
1039
|
return Modal;
|
886
1040
|
|
887
|
-
}))
|
1041
|
+
}));
|