bootstrap 5.0.0.beta3 → 5.0.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.
- checksums.yaml +4 -4
- data/README.md +2 -2
- data/assets/javascripts/bootstrap-sprockets.js +1 -1
- data/assets/javascripts/bootstrap.js +509 -459
- data/assets/javascripts/bootstrap.min.js +2 -2
- data/assets/javascripts/bootstrap/alert.js +4 -4
- data/assets/javascripts/bootstrap/base-component.js +9 -7
- data/assets/javascripts/bootstrap/button.js +3 -3
- data/assets/javascripts/bootstrap/carousel.js +11 -12
- data/assets/javascripts/bootstrap/collapse.js +5 -5
- data/assets/javascripts/bootstrap/dom/data.js +2 -2
- data/assets/javascripts/bootstrap/dom/event-handler.js +32 -14
- data/assets/javascripts/bootstrap/dom/manipulator.js +2 -2
- data/assets/javascripts/bootstrap/dom/selector-engine.js +2 -2
- data/assets/javascripts/bootstrap/dropdown.js +109 -94
- data/assets/javascripts/bootstrap/modal.js +262 -177
- data/assets/javascripts/bootstrap/offcanvas.js +219 -56
- data/assets/javascripts/bootstrap/popover.js +3 -3
- data/assets/javascripts/bootstrap/scrollspy.js +18 -22
- data/assets/javascripts/bootstrap/tab.js +21 -8
- data/assets/javascripts/bootstrap/toast.js +4 -5
- data/assets/javascripts/bootstrap/tooltip.js +7 -9
- data/assets/stylesheets/_bootstrap-grid.scss +1 -1
- data/assets/stylesheets/_bootstrap-reboot.scss +1 -1
- data/assets/stylesheets/_bootstrap.scss +1 -1
- data/assets/stylesheets/bootstrap/_accordion.scss +4 -2
- data/assets/stylesheets/bootstrap/_dropdown.scss +7 -13
- data/assets/stylesheets/bootstrap/_list-group.scss +1 -1
- data/assets/stylesheets/bootstrap/_mixins.scss +1 -0
- data/assets/stylesheets/bootstrap/_modal.scss +0 -9
- data/assets/stylesheets/bootstrap/_offcanvas.scss +11 -11
- data/assets/stylesheets/bootstrap/_spinners.scss +2 -2
- data/assets/stylesheets/bootstrap/_variables.scss +7 -7
- data/assets/stylesheets/bootstrap/bootstrap-utilities.scss +1 -1
- data/assets/stylesheets/bootstrap/forms/_form-control.scss +5 -5
- data/assets/stylesheets/bootstrap/mixins/_color-scheme.scss +7 -0
- data/assets/stylesheets/bootstrap/mixins/_forms.scss +7 -4
- data/assets/stylesheets/bootstrap/mixins/_grid.scss +8 -3
- data/bootstrap.gemspec +1 -1
- data/lib/bootstrap/version.rb +2 -2
- data/tasks/updater/js.rb +1 -1
- metadata +7 -6
@@ -1,17 +1,16 @@
|
|
1
1
|
/*!
|
2
|
-
* Bootstrap modal.js v5.0.0
|
2
|
+
* Bootstrap modal.js v5.0.0 (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
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
13
13
|
|
14
|
-
var Data__default = /*#__PURE__*/_interopDefaultLegacy(Data);
|
15
14
|
var EventHandler__default = /*#__PURE__*/_interopDefaultLegacy(EventHandler);
|
16
15
|
var Manipulator__default = /*#__PURE__*/_interopDefaultLegacy(Manipulator);
|
17
16
|
var SelectorEngine__default = /*#__PURE__*/_interopDefaultLegacy(SelectorEngine);
|
@@ -19,7 +18,7 @@
|
|
19
18
|
|
20
19
|
/**
|
21
20
|
* --------------------------------------------------------------------------
|
22
|
-
* Bootstrap (v5.0.0
|
21
|
+
* Bootstrap (v5.0.0): util/index.js
|
23
22
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
24
23
|
* --------------------------------------------------------------------------
|
25
24
|
*/
|
@@ -49,7 +48,7 @@
|
|
49
48
|
|
50
49
|
|
51
50
|
if (hrefAttr.includes('#') && !hrefAttr.startsWith('#')) {
|
52
|
-
hrefAttr =
|
51
|
+
hrefAttr = `#${hrefAttr.split('#')[1]}`;
|
53
52
|
}
|
54
53
|
|
55
54
|
selector = hrefAttr && hrefAttr !== '#' ? hrefAttr.trim() : null;
|
@@ -117,7 +116,7 @@
|
|
117
116
|
const valueType = value && isElement(value) ? 'element' : toType(value);
|
118
117
|
|
119
118
|
if (!new RegExp(expectedTypes).test(valueType)) {
|
120
|
-
throw new TypeError(`${componentName.toUpperCase()}:
|
119
|
+
throw new TypeError(`${componentName.toUpperCase()}: Option "${property}" provided type "${valueType}" but expected type "${expectedTypes}".`);
|
121
120
|
}
|
122
121
|
});
|
123
122
|
};
|
@@ -178,9 +177,217 @@
|
|
178
177
|
});
|
179
178
|
};
|
180
179
|
|
180
|
+
const execute = callback => {
|
181
|
+
if (typeof callback === 'function') {
|
182
|
+
callback();
|
183
|
+
}
|
184
|
+
};
|
185
|
+
|
186
|
+
/**
|
187
|
+
* --------------------------------------------------------------------------
|
188
|
+
* Bootstrap (v5.0.0): util/scrollBar.js
|
189
|
+
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
190
|
+
* --------------------------------------------------------------------------
|
191
|
+
*/
|
192
|
+
const SELECTOR_FIXED_CONTENT = '.fixed-top, .fixed-bottom, .is-fixed, .sticky-top';
|
193
|
+
const SELECTOR_STICKY_CONTENT = '.sticky-top';
|
194
|
+
|
195
|
+
const getWidth = () => {
|
196
|
+
// https://developer.mozilla.org/en-US/docs/Web/API/Window/innerWidth#usage_notes
|
197
|
+
const documentWidth = document.documentElement.clientWidth;
|
198
|
+
return Math.abs(window.innerWidth - documentWidth);
|
199
|
+
};
|
200
|
+
|
201
|
+
const hide = (width = getWidth()) => {
|
202
|
+
_disableOverFlow(); // give padding to element to balances the hidden scrollbar width
|
203
|
+
|
204
|
+
|
205
|
+
_setElementAttributes('body', 'paddingRight', calculatedValue => calculatedValue + width); // trick: We adjust positive paddingRight and negative marginRight to sticky-top elements, to keep shown fullwidth
|
206
|
+
|
207
|
+
|
208
|
+
_setElementAttributes(SELECTOR_FIXED_CONTENT, 'paddingRight', calculatedValue => calculatedValue + width);
|
209
|
+
|
210
|
+
_setElementAttributes(SELECTOR_STICKY_CONTENT, 'marginRight', calculatedValue => calculatedValue - width);
|
211
|
+
};
|
212
|
+
|
213
|
+
const _disableOverFlow = () => {
|
214
|
+
const actualValue = document.body.style.overflow;
|
215
|
+
|
216
|
+
if (actualValue) {
|
217
|
+
Manipulator__default['default'].setDataAttribute(document.body, 'overflow', actualValue);
|
218
|
+
}
|
219
|
+
|
220
|
+
document.body.style.overflow = 'hidden';
|
221
|
+
};
|
222
|
+
|
223
|
+
const _setElementAttributes = (selector, styleProp, callback) => {
|
224
|
+
const scrollbarWidth = getWidth();
|
225
|
+
SelectorEngine__default['default'].find(selector).forEach(element => {
|
226
|
+
if (element !== document.body && window.innerWidth > element.clientWidth + scrollbarWidth) {
|
227
|
+
return;
|
228
|
+
}
|
229
|
+
|
230
|
+
const actualValue = element.style[styleProp];
|
231
|
+
const calculatedValue = window.getComputedStyle(element)[styleProp];
|
232
|
+
Manipulator__default['default'].setDataAttribute(element, styleProp, actualValue);
|
233
|
+
element.style[styleProp] = `${callback(Number.parseFloat(calculatedValue))}px`;
|
234
|
+
});
|
235
|
+
};
|
236
|
+
|
237
|
+
const reset = () => {
|
238
|
+
_resetElementAttributes('body', 'overflow');
|
239
|
+
|
240
|
+
_resetElementAttributes('body', 'paddingRight');
|
241
|
+
|
242
|
+
_resetElementAttributes(SELECTOR_FIXED_CONTENT, 'paddingRight');
|
243
|
+
|
244
|
+
_resetElementAttributes(SELECTOR_STICKY_CONTENT, 'marginRight');
|
245
|
+
};
|
246
|
+
|
247
|
+
const _resetElementAttributes = (selector, styleProp) => {
|
248
|
+
SelectorEngine__default['default'].find(selector).forEach(element => {
|
249
|
+
const value = Manipulator__default['default'].getDataAttribute(element, styleProp);
|
250
|
+
|
251
|
+
if (typeof value === 'undefined') {
|
252
|
+
element.style.removeProperty(styleProp);
|
253
|
+
} else {
|
254
|
+
Manipulator__default['default'].removeDataAttribute(element, styleProp);
|
255
|
+
element.style[styleProp] = value;
|
256
|
+
}
|
257
|
+
});
|
258
|
+
};
|
259
|
+
|
260
|
+
/**
|
261
|
+
* --------------------------------------------------------------------------
|
262
|
+
* Bootstrap (v5.0.0): util/backdrop.js
|
263
|
+
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
264
|
+
* --------------------------------------------------------------------------
|
265
|
+
*/
|
266
|
+
const Default$1 = {
|
267
|
+
isVisible: true,
|
268
|
+
// if false, we use the backdrop helper without adding any element to the dom
|
269
|
+
isAnimated: false,
|
270
|
+
rootElement: document.body,
|
271
|
+
// give the choice to place backdrop under different elements
|
272
|
+
clickCallback: null
|
273
|
+
};
|
274
|
+
const DefaultType$1 = {
|
275
|
+
isVisible: 'boolean',
|
276
|
+
isAnimated: 'boolean',
|
277
|
+
rootElement: 'element',
|
278
|
+
clickCallback: '(function|null)'
|
279
|
+
};
|
280
|
+
const NAME$1 = 'backdrop';
|
281
|
+
const CLASS_NAME_BACKDROP = 'modal-backdrop';
|
282
|
+
const CLASS_NAME_FADE$1 = 'fade';
|
283
|
+
const CLASS_NAME_SHOW$1 = 'show';
|
284
|
+
const EVENT_MOUSEDOWN = `mousedown.bs.${NAME$1}`;
|
285
|
+
|
286
|
+
class Backdrop {
|
287
|
+
constructor(config) {
|
288
|
+
this._config = this._getConfig(config);
|
289
|
+
this._isAppended = false;
|
290
|
+
this._element = null;
|
291
|
+
}
|
292
|
+
|
293
|
+
show(callback) {
|
294
|
+
if (!this._config.isVisible) {
|
295
|
+
execute(callback);
|
296
|
+
return;
|
297
|
+
}
|
298
|
+
|
299
|
+
this._append();
|
300
|
+
|
301
|
+
if (this._config.isAnimated) {
|
302
|
+
reflow(this._getElement());
|
303
|
+
}
|
304
|
+
|
305
|
+
this._getElement().classList.add(CLASS_NAME_SHOW$1);
|
306
|
+
|
307
|
+
this._emulateAnimation(() => {
|
308
|
+
execute(callback);
|
309
|
+
});
|
310
|
+
}
|
311
|
+
|
312
|
+
hide(callback) {
|
313
|
+
if (!this._config.isVisible) {
|
314
|
+
execute(callback);
|
315
|
+
return;
|
316
|
+
}
|
317
|
+
|
318
|
+
this._getElement().classList.remove(CLASS_NAME_SHOW$1);
|
319
|
+
|
320
|
+
this._emulateAnimation(() => {
|
321
|
+
this.dispose();
|
322
|
+
execute(callback);
|
323
|
+
});
|
324
|
+
} // Private
|
325
|
+
|
326
|
+
|
327
|
+
_getElement() {
|
328
|
+
if (!this._element) {
|
329
|
+
const backdrop = document.createElement('div');
|
330
|
+
backdrop.className = CLASS_NAME_BACKDROP;
|
331
|
+
|
332
|
+
if (this._config.isAnimated) {
|
333
|
+
backdrop.classList.add(CLASS_NAME_FADE$1);
|
334
|
+
}
|
335
|
+
|
336
|
+
this._element = backdrop;
|
337
|
+
}
|
338
|
+
|
339
|
+
return this._element;
|
340
|
+
}
|
341
|
+
|
342
|
+
_getConfig(config) {
|
343
|
+
config = { ...Default$1,
|
344
|
+
...(typeof config === 'object' ? config : {})
|
345
|
+
};
|
346
|
+
typeCheckConfig(NAME$1, config, DefaultType$1);
|
347
|
+
return config;
|
348
|
+
}
|
349
|
+
|
350
|
+
_append() {
|
351
|
+
if (this._isAppended) {
|
352
|
+
return;
|
353
|
+
}
|
354
|
+
|
355
|
+
this._config.rootElement.appendChild(this._getElement());
|
356
|
+
|
357
|
+
EventHandler__default['default'].on(this._getElement(), EVENT_MOUSEDOWN, () => {
|
358
|
+
execute(this._config.clickCallback);
|
359
|
+
});
|
360
|
+
this._isAppended = true;
|
361
|
+
}
|
362
|
+
|
363
|
+
dispose() {
|
364
|
+
if (!this._isAppended) {
|
365
|
+
return;
|
366
|
+
}
|
367
|
+
|
368
|
+
EventHandler__default['default'].off(this._element, EVENT_MOUSEDOWN);
|
369
|
+
|
370
|
+
this._getElement().parentNode.removeChild(this._element);
|
371
|
+
|
372
|
+
this._isAppended = false;
|
373
|
+
}
|
374
|
+
|
375
|
+
_emulateAnimation(callback) {
|
376
|
+
if (!this._config.isAnimated) {
|
377
|
+
execute(callback);
|
378
|
+
return;
|
379
|
+
}
|
380
|
+
|
381
|
+
const backdropTransitionDuration = getTransitionDurationFromElement(this._getElement());
|
382
|
+
EventHandler__default['default'].one(this._getElement(), 'transitionend', () => execute(callback));
|
383
|
+
emulateTransitionEnd(this._getElement(), backdropTransitionDuration);
|
384
|
+
}
|
385
|
+
|
386
|
+
}
|
387
|
+
|
181
388
|
/**
|
182
389
|
* --------------------------------------------------------------------------
|
183
|
-
* Bootstrap (v5.0.0
|
390
|
+
* Bootstrap (v5.0.0): modal.js
|
184
391
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
185
392
|
* --------------------------------------------------------------------------
|
186
393
|
*/
|
@@ -217,8 +424,6 @@
|
|
217
424
|
const EVENT_MOUSEUP_DISMISS = `mouseup.dismiss${EVENT_KEY}`;
|
218
425
|
const EVENT_MOUSEDOWN_DISMISS = `mousedown.dismiss${EVENT_KEY}`;
|
219
426
|
const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}`;
|
220
|
-
const CLASS_NAME_SCROLLBAR_MEASURER = 'modal-scrollbar-measure';
|
221
|
-
const CLASS_NAME_BACKDROP = 'modal-backdrop';
|
222
427
|
const CLASS_NAME_OPEN = 'modal-open';
|
223
428
|
const CLASS_NAME_FADE = 'fade';
|
224
429
|
const CLASS_NAME_SHOW = 'show';
|
@@ -227,8 +432,6 @@
|
|
227
432
|
const SELECTOR_MODAL_BODY = '.modal-body';
|
228
433
|
const SELECTOR_DATA_TOGGLE = '[data-bs-toggle="modal"]';
|
229
434
|
const SELECTOR_DATA_DISMISS = '[data-bs-dismiss="modal"]';
|
230
|
-
const SELECTOR_FIXED_CONTENT = '.fixed-top, .fixed-bottom, .is-fixed, .sticky-top';
|
231
|
-
const SELECTOR_STICKY_CONTENT = '.sticky-top';
|
232
435
|
/**
|
233
436
|
* ------------------------------------------------------------------------
|
234
437
|
* Class Definition
|
@@ -240,12 +443,10 @@
|
|
240
443
|
super(element);
|
241
444
|
this._config = this._getConfig(config);
|
242
445
|
this._dialog = SelectorEngine__default['default'].findOne(SELECTOR_DIALOG, this._element);
|
243
|
-
this._backdrop =
|
446
|
+
this._backdrop = this._initializeBackDrop();
|
244
447
|
this._isShown = false;
|
245
|
-
this._isBodyOverflowing = false;
|
246
448
|
this._ignoreBackdropClick = false;
|
247
449
|
this._isTransitioning = false;
|
248
|
-
this._scrollbarWidth = 0;
|
249
450
|
} // Getters
|
250
451
|
|
251
452
|
|
@@ -280,10 +481,8 @@
|
|
280
481
|
}
|
281
482
|
|
282
483
|
this._isShown = true;
|
283
|
-
|
284
|
-
|
285
|
-
|
286
|
-
this._setScrollbar();
|
484
|
+
hide();
|
485
|
+
document.body.classList.add(CLASS_NAME_OPEN);
|
287
486
|
|
288
487
|
this._adjustDialog();
|
289
488
|
|
@@ -347,7 +546,7 @@
|
|
347
546
|
}
|
348
547
|
|
349
548
|
dispose() {
|
350
|
-
[window, this.
|
549
|
+
[window, this._dialog].forEach(htmlElement => EventHandler__default['default'].off(htmlElement, EVENT_KEY));
|
351
550
|
super.dispose();
|
352
551
|
/**
|
353
552
|
* `document` has 2 events `EVENT_FOCUSIN` and `EVENT_CLICK_DATA_API`
|
@@ -358,12 +557,13 @@
|
|
358
557
|
EventHandler__default['default'].off(document, EVENT_FOCUSIN);
|
359
558
|
this._config = null;
|
360
559
|
this._dialog = null;
|
560
|
+
|
561
|
+
this._backdrop.dispose();
|
562
|
+
|
361
563
|
this._backdrop = null;
|
362
564
|
this._isShown = null;
|
363
|
-
this._isBodyOverflowing = null;
|
364
565
|
this._ignoreBackdropClick = null;
|
365
566
|
this._isTransitioning = null;
|
366
|
-
this._scrollbarWidth = null;
|
367
567
|
}
|
368
568
|
|
369
569
|
handleUpdate() {
|
@@ -371,8 +571,17 @@
|
|
371
571
|
} // Private
|
372
572
|
|
373
573
|
|
574
|
+
_initializeBackDrop() {
|
575
|
+
return new Backdrop({
|
576
|
+
isVisible: Boolean(this._config.backdrop),
|
577
|
+
// 'static' option will be translated to true, and booleans will keep their value
|
578
|
+
isAnimated: this._isAnimated()
|
579
|
+
});
|
580
|
+
}
|
581
|
+
|
374
582
|
_getConfig(config) {
|
375
583
|
config = { ...Default,
|
584
|
+
...Manipulator__default['default'].getDataAttributes(this._element),
|
376
585
|
...config
|
377
586
|
};
|
378
587
|
typeCheckConfig(NAME, config, DefaultType);
|
@@ -477,85 +686,35 @@
|
|
477
686
|
|
478
687
|
this._isTransitioning = false;
|
479
688
|
|
480
|
-
this.
|
689
|
+
this._backdrop.hide(() => {
|
481
690
|
document.body.classList.remove(CLASS_NAME_OPEN);
|
482
691
|
|
483
692
|
this._resetAdjustments();
|
484
693
|
|
485
|
-
|
486
|
-
|
694
|
+
reset();
|
487
695
|
EventHandler__default['default'].trigger(this._element, EVENT_HIDDEN);
|
488
696
|
});
|
489
697
|
}
|
490
698
|
|
491
|
-
_removeBackdrop() {
|
492
|
-
this._backdrop.parentNode.removeChild(this._backdrop);
|
493
|
-
|
494
|
-
this._backdrop = null;
|
495
|
-
}
|
496
|
-
|
497
699
|
_showBackdrop(callback) {
|
498
|
-
|
499
|
-
|
500
|
-
|
501
|
-
|
502
|
-
this._backdrop.className = CLASS_NAME_BACKDROP;
|
503
|
-
|
504
|
-
if (isAnimated) {
|
505
|
-
this._backdrop.classList.add(CLASS_NAME_FADE);
|
506
|
-
}
|
507
|
-
|
508
|
-
document.body.appendChild(this._backdrop);
|
509
|
-
EventHandler__default['default'].on(this._element, EVENT_CLICK_DISMISS, event => {
|
510
|
-
if (this._ignoreBackdropClick) {
|
511
|
-
this._ignoreBackdropClick = false;
|
512
|
-
return;
|
513
|
-
}
|
514
|
-
|
515
|
-
if (event.target !== event.currentTarget) {
|
516
|
-
return;
|
517
|
-
}
|
518
|
-
|
519
|
-
if (this._config.backdrop === 'static') {
|
520
|
-
this._triggerBackdropTransition();
|
521
|
-
} else {
|
522
|
-
this.hide();
|
523
|
-
}
|
524
|
-
});
|
525
|
-
|
526
|
-
if (isAnimated) {
|
527
|
-
reflow(this._backdrop);
|
700
|
+
EventHandler__default['default'].on(this._element, EVENT_CLICK_DISMISS, event => {
|
701
|
+
if (this._ignoreBackdropClick) {
|
702
|
+
this._ignoreBackdropClick = false;
|
703
|
+
return;
|
528
704
|
}
|
529
705
|
|
530
|
-
|
531
|
-
|
532
|
-
if (!isAnimated) {
|
533
|
-
callback();
|
706
|
+
if (event.target !== event.currentTarget) {
|
534
707
|
return;
|
535
708
|
}
|
536
709
|
|
537
|
-
|
538
|
-
|
539
|
-
|
540
|
-
|
541
|
-
this._backdrop.classList.remove(CLASS_NAME_SHOW);
|
542
|
-
|
543
|
-
const callbackRemove = () => {
|
544
|
-
this._removeBackdrop();
|
545
|
-
|
546
|
-
callback();
|
547
|
-
};
|
548
|
-
|
549
|
-
if (isAnimated) {
|
550
|
-
const backdropTransitionDuration = getTransitionDurationFromElement(this._backdrop);
|
551
|
-
EventHandler__default['default'].one(this._backdrop, 'transitionend', callbackRemove);
|
552
|
-
emulateTransitionEnd(this._backdrop, backdropTransitionDuration);
|
553
|
-
} else {
|
554
|
-
callbackRemove();
|
710
|
+
if (this._config.backdrop === true) {
|
711
|
+
this.hide();
|
712
|
+
} else if (this._config.backdrop === 'static') {
|
713
|
+
this._triggerBackdropTransition();
|
555
714
|
}
|
556
|
-
}
|
557
|
-
|
558
|
-
|
715
|
+
});
|
716
|
+
|
717
|
+
this._backdrop.show(callback);
|
559
718
|
}
|
560
719
|
|
561
720
|
_isAnimated() {
|
@@ -599,103 +758,37 @@
|
|
599
758
|
|
600
759
|
_adjustDialog() {
|
601
760
|
const isModalOverflowing = this._element.scrollHeight > document.documentElement.clientHeight;
|
761
|
+
const scrollbarWidth = getWidth();
|
762
|
+
const isBodyOverflowing = scrollbarWidth > 0;
|
602
763
|
|
603
|
-
if (!
|
604
|
-
this._element.style.paddingLeft = `${
|
764
|
+
if (!isBodyOverflowing && isModalOverflowing && !isRTL() || isBodyOverflowing && !isModalOverflowing && isRTL()) {
|
765
|
+
this._element.style.paddingLeft = `${scrollbarWidth}px`;
|
605
766
|
}
|
606
767
|
|
607
|
-
if (
|
608
|
-
this._element.style.paddingRight = `${
|
768
|
+
if (isBodyOverflowing && !isModalOverflowing && !isRTL() || !isBodyOverflowing && isModalOverflowing && isRTL()) {
|
769
|
+
this._element.style.paddingRight = `${scrollbarWidth}px`;
|
609
770
|
}
|
610
771
|
}
|
611
772
|
|
612
773
|
_resetAdjustments() {
|
613
774
|
this._element.style.paddingLeft = '';
|
614
775
|
this._element.style.paddingRight = '';
|
615
|
-
}
|
616
|
-
|
617
|
-
_checkScrollbar() {
|
618
|
-
const rect = document.body.getBoundingClientRect();
|
619
|
-
this._isBodyOverflowing = Math.round(rect.left + rect.right) < window.innerWidth;
|
620
|
-
this._scrollbarWidth = this._getScrollbarWidth();
|
621
|
-
}
|
622
|
-
|
623
|
-
_setScrollbar() {
|
624
|
-
if (this._isBodyOverflowing) {
|
625
|
-
this._setElementAttributes(SELECTOR_FIXED_CONTENT, 'paddingRight', calculatedValue => calculatedValue + this._scrollbarWidth);
|
626
|
-
|
627
|
-
this._setElementAttributes(SELECTOR_STICKY_CONTENT, 'marginRight', calculatedValue => calculatedValue - this._scrollbarWidth);
|
628
|
-
|
629
|
-
this._setElementAttributes('body', 'paddingRight', calculatedValue => calculatedValue + this._scrollbarWidth);
|
630
|
-
}
|
631
|
-
|
632
|
-
document.body.classList.add(CLASS_NAME_OPEN);
|
633
|
-
}
|
634
|
-
|
635
|
-
_setElementAttributes(selector, styleProp, callback) {
|
636
|
-
SelectorEngine__default['default'].find(selector).forEach(element => {
|
637
|
-
if (element !== document.body && window.innerWidth > element.clientWidth + this._scrollbarWidth) {
|
638
|
-
return;
|
639
|
-
}
|
640
|
-
|
641
|
-
const actualValue = element.style[styleProp];
|
642
|
-
const calculatedValue = window.getComputedStyle(element)[styleProp];
|
643
|
-
Manipulator__default['default'].setDataAttribute(element, styleProp, actualValue);
|
644
|
-
element.style[styleProp] = callback(Number.parseFloat(calculatedValue)) + 'px';
|
645
|
-
});
|
646
|
-
}
|
647
|
-
|
648
|
-
_resetScrollbar() {
|
649
|
-
this._resetElementAttributes(SELECTOR_FIXED_CONTENT, 'paddingRight');
|
650
|
-
|
651
|
-
this._resetElementAttributes(SELECTOR_STICKY_CONTENT, 'marginRight');
|
652
|
-
|
653
|
-
this._resetElementAttributes('body', 'paddingRight');
|
654
|
-
}
|
655
|
-
|
656
|
-
_resetElementAttributes(selector, styleProp) {
|
657
|
-
SelectorEngine__default['default'].find(selector).forEach(element => {
|
658
|
-
const value = Manipulator__default['default'].getDataAttribute(element, styleProp);
|
659
|
-
|
660
|
-
if (typeof value === 'undefined' && element === document.body) {
|
661
|
-
element.style[styleProp] = '';
|
662
|
-
} else {
|
663
|
-
Manipulator__default['default'].removeDataAttribute(element, styleProp);
|
664
|
-
element.style[styleProp] = value;
|
665
|
-
}
|
666
|
-
});
|
667
|
-
}
|
668
|
-
|
669
|
-
_getScrollbarWidth() {
|
670
|
-
// thx d.walsh
|
671
|
-
const scrollDiv = document.createElement('div');
|
672
|
-
scrollDiv.className = CLASS_NAME_SCROLLBAR_MEASURER;
|
673
|
-
document.body.appendChild(scrollDiv);
|
674
|
-
const scrollbarWidth = scrollDiv.getBoundingClientRect().width - scrollDiv.clientWidth;
|
675
|
-
document.body.removeChild(scrollDiv);
|
676
|
-
return scrollbarWidth;
|
677
776
|
} // Static
|
678
777
|
|
679
778
|
|
680
779
|
static jQueryInterface(config, relatedTarget) {
|
681
780
|
return this.each(function () {
|
682
|
-
|
683
|
-
const _config = { ...Default,
|
684
|
-
...Manipulator__default['default'].getDataAttributes(this),
|
685
|
-
...(typeof config === 'object' && config ? config : {})
|
686
|
-
};
|
781
|
+
const data = Modal.getInstance(this) || new Modal(this, typeof config === 'object' ? config : {});
|
687
782
|
|
688
|
-
if (
|
689
|
-
|
783
|
+
if (typeof config !== 'string') {
|
784
|
+
return;
|
690
785
|
}
|
691
786
|
|
692
|
-
if (typeof config === '
|
693
|
-
|
694
|
-
throw new TypeError(`No method named "${config}"`);
|
695
|
-
}
|
696
|
-
|
697
|
-
data[config](relatedTarget);
|
787
|
+
if (typeof data[config] === 'undefined') {
|
788
|
+
throw new TypeError(`No method named "${config}"`);
|
698
789
|
}
|
790
|
+
|
791
|
+
data[config](relatedTarget);
|
699
792
|
});
|
700
793
|
}
|
701
794
|
|
@@ -710,7 +803,7 @@
|
|
710
803
|
EventHandler__default['default'].on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
|
711
804
|
const target = getElementFromSelector(this);
|
712
805
|
|
713
|
-
if (
|
806
|
+
if (['A', 'AREA'].includes(this.tagName)) {
|
714
807
|
event.preventDefault();
|
715
808
|
}
|
716
809
|
|
@@ -726,15 +819,7 @@
|
|
726
819
|
}
|
727
820
|
});
|
728
821
|
});
|
729
|
-
|
730
|
-
|
731
|
-
if (!data) {
|
732
|
-
const config = { ...Manipulator__default['default'].getDataAttributes(target),
|
733
|
-
...Manipulator__default['default'].getDataAttributes(this)
|
734
|
-
};
|
735
|
-
data = new Modal(target, config);
|
736
|
-
}
|
737
|
-
|
822
|
+
const data = Modal.getInstance(target) || new Modal(target);
|
738
823
|
data.toggle(this);
|
739
824
|
});
|
740
825
|
/**
|