bootstrap 5.0.0.beta2 → 5.0.0.beta3
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +1 -1
- data/assets/javascripts/bootstrap-sprockets.js +1 -0
- data/assets/javascripts/bootstrap.js +2051 -2009
- data/assets/javascripts/bootstrap.min.js +2 -2
- data/assets/javascripts/bootstrap/alert.js +75 -118
- data/assets/javascripts/bootstrap/base-component.js +23 -37
- data/assets/javascripts/bootstrap/button.js +39 -78
- data/assets/javascripts/bootstrap/carousel.js +284 -364
- data/assets/javascripts/bootstrap/collapse.js +178 -247
- data/assets/javascripts/bootstrap/dom/data.js +34 -47
- data/assets/javascripts/bootstrap/dom/event-handler.js +71 -77
- data/assets/javascripts/bootstrap/dom/manipulator.js +23 -21
- data/assets/javascripts/bootstrap/dom/selector-engine.js +20 -28
- data/assets/javascripts/bootstrap/dropdown.js +195 -265
- data/assets/javascripts/bootstrap/modal.js +256 -344
- data/assets/javascripts/bootstrap/offcanvas.js +508 -0
- data/assets/javascripts/bootstrap/popover.js +88 -157
- data/assets/javascripts/bootstrap/scrollspy.js +134 -212
- data/assets/javascripts/bootstrap/tab.js +108 -142
- data/assets/javascripts/bootstrap/toast.js +113 -183
- data/assets/javascripts/bootstrap/tooltip.js +297 -392
- data/assets/stylesheets/_bootstrap-grid.scss +1 -1
- data/assets/stylesheets/_bootstrap-reboot.scss +1 -1
- data/assets/stylesheets/_bootstrap.scss +2 -1
- data/assets/stylesheets/bootstrap/_accordion.scss +22 -32
- data/assets/stylesheets/bootstrap/_buttons.scss +2 -0
- data/assets/stylesheets/bootstrap/_card.scss +1 -1
- data/assets/stylesheets/bootstrap/_dropdown.scss +3 -6
- data/assets/stylesheets/bootstrap/_list-group.scss +11 -0
- data/assets/stylesheets/bootstrap/_modal.scss +2 -0
- data/assets/stylesheets/bootstrap/_nav.scss +7 -0
- data/assets/stylesheets/bootstrap/_navbar.scss +2 -0
- data/assets/stylesheets/bootstrap/_offcanvas.scss +77 -0
- data/assets/stylesheets/bootstrap/_progress.scss +3 -0
- data/assets/stylesheets/bootstrap/_reboot.scss +7 -21
- data/assets/stylesheets/bootstrap/_spinners.scss +4 -0
- data/assets/stylesheets/bootstrap/_transitions.scss +2 -0
- data/assets/stylesheets/bootstrap/_utilities.scss +65 -37
- data/assets/stylesheets/bootstrap/_variables.scss +138 -30
- data/assets/stylesheets/bootstrap/bootstrap-utilities.scss +1 -1
- data/assets/stylesheets/bootstrap/forms/_form-control.scss +0 -4
- data/assets/stylesheets/bootstrap/mixins/_alert.scss +2 -0
- data/assets/stylesheets/bootstrap/mixins/_border-radius.scss +2 -0
- data/assets/stylesheets/bootstrap/mixins/_buttons.scss +6 -1
- data/assets/stylesheets/bootstrap/mixins/_caret.scss +2 -0
- data/assets/stylesheets/bootstrap/mixins/_forms.scss +11 -1
- data/assets/stylesheets/bootstrap/mixins/_list-group.scss +2 -0
- data/assets/stylesheets/bootstrap/mixins/_pagination.scss +2 -0
- data/bootstrap.gemspec +1 -1
- data/lib/bootstrap/version.rb +2 -2
- data/tasks/updater/js.rb +1 -1
- data/tasks/updater/network.rb +7 -1
- metadata +6 -4
@@ -1,5 +1,5 @@
|
|
1
1
|
/*!
|
2
|
-
* Bootstrap selector-engine.js v5.0.0-
|
2
|
+
* Bootstrap selector-engine.js v5.0.0-beta3 (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
|
*/
|
@@ -11,7 +11,7 @@
|
|
11
11
|
|
12
12
|
/**
|
13
13
|
* --------------------------------------------------------------------------
|
14
|
-
* Bootstrap (v5.0.0-
|
14
|
+
* Bootstrap (v5.0.0-beta3): dom/selector-engine.js
|
15
15
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
16
16
|
* --------------------------------------------------------------------------
|
17
17
|
*/
|
@@ -21,34 +21,23 @@
|
|
21
21
|
* Constants
|
22
22
|
* ------------------------------------------------------------------------
|
23
23
|
*/
|
24
|
-
|
25
|
-
|
26
|
-
find
|
27
|
-
|
28
|
-
|
29
|
-
if (element === void 0) {
|
30
|
-
element = document.documentElement;
|
31
|
-
}
|
32
|
-
|
33
|
-
return (_ref = []).concat.apply(_ref, Element.prototype.querySelectorAll.call(element, selector));
|
24
|
+
const NODE_TEXT = 3;
|
25
|
+
const SelectorEngine = {
|
26
|
+
find(selector, element = document.documentElement) {
|
27
|
+
return [].concat(...Element.prototype.querySelectorAll.call(element, selector));
|
34
28
|
},
|
35
|
-
findOne: function findOne(selector, element) {
|
36
|
-
if (element === void 0) {
|
37
|
-
element = document.documentElement;
|
38
|
-
}
|
39
29
|
|
30
|
+
findOne(selector, element = document.documentElement) {
|
40
31
|
return Element.prototype.querySelector.call(element, selector);
|
41
32
|
},
|
42
|
-
children: function children(element, selector) {
|
43
|
-
var _ref2;
|
44
33
|
|
45
|
-
|
46
|
-
|
47
|
-
});
|
34
|
+
children(element, selector) {
|
35
|
+
return [].concat(...element.children).filter(child => child.matches(selector));
|
48
36
|
},
|
49
|
-
|
50
|
-
|
51
|
-
|
37
|
+
|
38
|
+
parents(element, selector) {
|
39
|
+
const parents = [];
|
40
|
+
let ancestor = element.parentNode;
|
52
41
|
|
53
42
|
while (ancestor && ancestor.nodeType === Node.ELEMENT_NODE && ancestor.nodeType !== NODE_TEXT) {
|
54
43
|
if (ancestor.matches(selector)) {
|
@@ -60,8 +49,9 @@
|
|
60
49
|
|
61
50
|
return parents;
|
62
51
|
},
|
63
|
-
|
64
|
-
|
52
|
+
|
53
|
+
prev(element, selector) {
|
54
|
+
let previous = element.previousElementSibling;
|
65
55
|
|
66
56
|
while (previous) {
|
67
57
|
if (previous.matches(selector)) {
|
@@ -73,8 +63,9 @@
|
|
73
63
|
|
74
64
|
return [];
|
75
65
|
},
|
76
|
-
|
77
|
-
|
66
|
+
|
67
|
+
next(element, selector) {
|
68
|
+
let next = element.nextElementSibling;
|
78
69
|
|
79
70
|
while (next) {
|
80
71
|
if (next.matches(selector)) {
|
@@ -86,6 +77,7 @@
|
|
86
77
|
|
87
78
|
return [];
|
88
79
|
}
|
80
|
+
|
89
81
|
};
|
90
82
|
|
91
83
|
return SelectorEngine;
|
@@ -1,5 +1,5 @@
|
|
1
1
|
/*!
|
2
|
-
* Bootstrap dropdown.js v5.0.0-
|
2
|
+
* Bootstrap dropdown.js v5.0.0-beta3 (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
|
*/
|
@@ -38,76 +38,26 @@
|
|
38
38
|
var SelectorEngine__default = /*#__PURE__*/_interopDefaultLegacy(SelectorEngine);
|
39
39
|
var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
|
40
40
|
|
41
|
-
function _defineProperties(target, props) {
|
42
|
-
for (var i = 0; i < props.length; i++) {
|
43
|
-
var descriptor = props[i];
|
44
|
-
descriptor.enumerable = descriptor.enumerable || false;
|
45
|
-
descriptor.configurable = true;
|
46
|
-
if ("value" in descriptor) descriptor.writable = true;
|
47
|
-
Object.defineProperty(target, descriptor.key, descriptor);
|
48
|
-
}
|
49
|
-
}
|
50
|
-
|
51
|
-
function _createClass(Constructor, protoProps, staticProps) {
|
52
|
-
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
|
53
|
-
if (staticProps) _defineProperties(Constructor, staticProps);
|
54
|
-
return Constructor;
|
55
|
-
}
|
56
|
-
|
57
|
-
function _extends() {
|
58
|
-
_extends = Object.assign || function (target) {
|
59
|
-
for (var i = 1; i < arguments.length; i++) {
|
60
|
-
var source = arguments[i];
|
61
|
-
|
62
|
-
for (var key in source) {
|
63
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
64
|
-
target[key] = source[key];
|
65
|
-
}
|
66
|
-
}
|
67
|
-
}
|
68
|
-
|
69
|
-
return target;
|
70
|
-
};
|
71
|
-
|
72
|
-
return _extends.apply(this, arguments);
|
73
|
-
}
|
74
|
-
|
75
|
-
function _inheritsLoose(subClass, superClass) {
|
76
|
-
subClass.prototype = Object.create(superClass.prototype);
|
77
|
-
subClass.prototype.constructor = subClass;
|
78
|
-
|
79
|
-
_setPrototypeOf(subClass, superClass);
|
80
|
-
}
|
81
|
-
|
82
|
-
function _setPrototypeOf(o, p) {
|
83
|
-
_setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
|
84
|
-
o.__proto__ = p;
|
85
|
-
return o;
|
86
|
-
};
|
87
|
-
|
88
|
-
return _setPrototypeOf(o, p);
|
89
|
-
}
|
90
|
-
|
91
41
|
/**
|
92
42
|
* --------------------------------------------------------------------------
|
93
|
-
* Bootstrap (v5.0.0-
|
43
|
+
* Bootstrap (v5.0.0-beta3): util/index.js
|
94
44
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
95
45
|
* --------------------------------------------------------------------------
|
96
46
|
*/
|
97
47
|
|
98
|
-
|
48
|
+
const toType = obj => {
|
99
49
|
if (obj === null || obj === undefined) {
|
100
|
-
return
|
50
|
+
return `${obj}`;
|
101
51
|
}
|
102
52
|
|
103
53
|
return {}.toString.call(obj).match(/\s([a-z]+)/i)[1].toLowerCase();
|
104
54
|
};
|
105
55
|
|
106
|
-
|
107
|
-
|
56
|
+
const getSelector = element => {
|
57
|
+
let selector = element.getAttribute('data-bs-target');
|
108
58
|
|
109
59
|
if (!selector || selector === '#') {
|
110
|
-
|
60
|
+
let hrefAttr = element.getAttribute('href'); // The only valid content that could double as a selector are IDs or classes,
|
111
61
|
// so everything starting with `#` or `.`. If a "real" URL is used as the selector,
|
112
62
|
// `document.querySelector` will rightfully complain it is invalid.
|
113
63
|
// See https://github.com/twbs/bootstrap/issues/32273
|
@@ -127,48 +77,45 @@
|
|
127
77
|
return selector;
|
128
78
|
};
|
129
79
|
|
130
|
-
|
131
|
-
|
80
|
+
const getElementFromSelector = element => {
|
81
|
+
const selector = getSelector(element);
|
132
82
|
return selector ? document.querySelector(selector) : null;
|
133
83
|
};
|
134
84
|
|
135
|
-
|
136
|
-
return (obj[0] || obj).nodeType;
|
137
|
-
};
|
85
|
+
const isElement = obj => (obj[0] || obj).nodeType;
|
138
86
|
|
139
|
-
|
140
|
-
Object.keys(configTypes).forEach(
|
141
|
-
|
142
|
-
|
143
|
-
|
87
|
+
const typeCheckConfig = (componentName, config, configTypes) => {
|
88
|
+
Object.keys(configTypes).forEach(property => {
|
89
|
+
const expectedTypes = configTypes[property];
|
90
|
+
const value = config[property];
|
91
|
+
const valueType = value && isElement(value) ? 'element' : toType(value);
|
144
92
|
|
145
93
|
if (!new RegExp(expectedTypes).test(valueType)) {
|
146
|
-
throw new TypeError(componentName.toUpperCase()
|
94
|
+
throw new TypeError(`${componentName.toUpperCase()}: ` + `Option "${property}" provided type "${valueType}" ` + `but expected type "${expectedTypes}".`);
|
147
95
|
}
|
148
96
|
});
|
149
97
|
};
|
150
98
|
|
151
|
-
|
99
|
+
const isVisible = element => {
|
152
100
|
if (!element) {
|
153
101
|
return false;
|
154
102
|
}
|
155
103
|
|
156
104
|
if (element.style && element.parentNode && element.parentNode.style) {
|
157
|
-
|
158
|
-
|
105
|
+
const elementStyle = getComputedStyle(element);
|
106
|
+
const parentNodeStyle = getComputedStyle(element.parentNode);
|
159
107
|
return elementStyle.display !== 'none' && parentNodeStyle.display !== 'none' && elementStyle.visibility !== 'hidden';
|
160
108
|
}
|
161
109
|
|
162
110
|
return false;
|
163
111
|
};
|
164
112
|
|
165
|
-
|
166
|
-
return function () {};
|
167
|
-
};
|
113
|
+
const noop = () => function () {};
|
168
114
|
|
169
|
-
|
170
|
-
|
171
|
-
|
115
|
+
const getjQuery = () => {
|
116
|
+
const {
|
117
|
+
jQuery
|
118
|
+
} = window;
|
172
119
|
|
173
120
|
if (jQuery && !document.body.hasAttribute('data-bs-no-jquery')) {
|
174
121
|
return jQuery;
|
@@ -177,7 +124,7 @@
|
|
177
124
|
return null;
|
178
125
|
};
|
179
126
|
|
180
|
-
|
127
|
+
const onDOMContentLoaded = callback => {
|
181
128
|
if (document.readyState === 'loading') {
|
182
129
|
document.addEventListener('DOMContentLoaded', callback);
|
183
130
|
} else {
|
@@ -185,19 +132,19 @@
|
|
185
132
|
}
|
186
133
|
};
|
187
134
|
|
188
|
-
|
135
|
+
const isRTL = () => document.documentElement.dir === 'rtl';
|
189
136
|
|
190
|
-
|
191
|
-
onDOMContentLoaded(
|
192
|
-
|
137
|
+
const defineJQueryPlugin = (name, plugin) => {
|
138
|
+
onDOMContentLoaded(() => {
|
139
|
+
const $ = getjQuery();
|
193
140
|
/* istanbul ignore if */
|
194
141
|
|
195
142
|
if ($) {
|
196
|
-
|
143
|
+
const JQUERY_NO_CONFLICT = $.fn[name];
|
197
144
|
$.fn[name] = plugin.jQueryInterface;
|
198
145
|
$.fn[name].Constructor = plugin;
|
199
146
|
|
200
|
-
$.fn[name].noConflict =
|
147
|
+
$.fn[name].noConflict = () => {
|
201
148
|
$.fn[name] = JQUERY_NO_CONFLICT;
|
202
149
|
return plugin.jQueryInterface;
|
203
150
|
};
|
@@ -205,60 +152,63 @@
|
|
205
152
|
});
|
206
153
|
};
|
207
154
|
|
155
|
+
/**
|
156
|
+
* --------------------------------------------------------------------------
|
157
|
+
* Bootstrap (v5.0.0-beta3): dropdown.js
|
158
|
+
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
159
|
+
* --------------------------------------------------------------------------
|
160
|
+
*/
|
208
161
|
/**
|
209
162
|
* ------------------------------------------------------------------------
|
210
163
|
* Constants
|
211
164
|
* ------------------------------------------------------------------------
|
212
165
|
*/
|
213
166
|
|
214
|
-
|
215
|
-
|
216
|
-
|
217
|
-
|
218
|
-
|
219
|
-
|
220
|
-
|
221
|
-
|
222
|
-
|
223
|
-
|
224
|
-
|
225
|
-
|
226
|
-
|
227
|
-
|
228
|
-
|
229
|
-
|
230
|
-
|
231
|
-
|
232
|
-
|
233
|
-
|
234
|
-
|
235
|
-
|
236
|
-
|
237
|
-
|
238
|
-
|
239
|
-
|
240
|
-
|
241
|
-
|
242
|
-
|
243
|
-
|
244
|
-
|
245
|
-
|
246
|
-
|
247
|
-
|
248
|
-
|
249
|
-
|
250
|
-
|
251
|
-
var Default = {
|
167
|
+
const NAME = 'dropdown';
|
168
|
+
const DATA_KEY = 'bs.dropdown';
|
169
|
+
const EVENT_KEY = `.${DATA_KEY}`;
|
170
|
+
const DATA_API_KEY = '.data-api';
|
171
|
+
const ESCAPE_KEY = 'Escape';
|
172
|
+
const SPACE_KEY = 'Space';
|
173
|
+
const TAB_KEY = 'Tab';
|
174
|
+
const ARROW_UP_KEY = 'ArrowUp';
|
175
|
+
const ARROW_DOWN_KEY = 'ArrowDown';
|
176
|
+
const RIGHT_MOUSE_BUTTON = 2; // MouseEvent.button value for the secondary button, usually the right button
|
177
|
+
|
178
|
+
const REGEXP_KEYDOWN = new RegExp(`${ARROW_UP_KEY}|${ARROW_DOWN_KEY}|${ESCAPE_KEY}`);
|
179
|
+
const EVENT_HIDE = `hide${EVENT_KEY}`;
|
180
|
+
const EVENT_HIDDEN = `hidden${EVENT_KEY}`;
|
181
|
+
const EVENT_SHOW = `show${EVENT_KEY}`;
|
182
|
+
const EVENT_SHOWN = `shown${EVENT_KEY}`;
|
183
|
+
const EVENT_CLICK = `click${EVENT_KEY}`;
|
184
|
+
const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}`;
|
185
|
+
const EVENT_KEYDOWN_DATA_API = `keydown${EVENT_KEY}${DATA_API_KEY}`;
|
186
|
+
const EVENT_KEYUP_DATA_API = `keyup${EVENT_KEY}${DATA_API_KEY}`;
|
187
|
+
const CLASS_NAME_DISABLED = 'disabled';
|
188
|
+
const CLASS_NAME_SHOW = 'show';
|
189
|
+
const CLASS_NAME_DROPUP = 'dropup';
|
190
|
+
const CLASS_NAME_DROPEND = 'dropend';
|
191
|
+
const CLASS_NAME_DROPSTART = 'dropstart';
|
192
|
+
const CLASS_NAME_NAVBAR = 'navbar';
|
193
|
+
const SELECTOR_DATA_TOGGLE = '[data-bs-toggle="dropdown"]';
|
194
|
+
const SELECTOR_MENU = '.dropdown-menu';
|
195
|
+
const SELECTOR_NAVBAR_NAV = '.navbar-nav';
|
196
|
+
const SELECTOR_VISIBLE_ITEMS = '.dropdown-menu .dropdown-item:not(.disabled):not(:disabled)';
|
197
|
+
const PLACEMENT_TOP = isRTL() ? 'top-end' : 'top-start';
|
198
|
+
const PLACEMENT_TOPEND = isRTL() ? 'top-start' : 'top-end';
|
199
|
+
const PLACEMENT_BOTTOM = isRTL() ? 'bottom-end' : 'bottom-start';
|
200
|
+
const PLACEMENT_BOTTOMEND = isRTL() ? 'bottom-start' : 'bottom-end';
|
201
|
+
const PLACEMENT_RIGHT = isRTL() ? 'left-start' : 'right-start';
|
202
|
+
const PLACEMENT_LEFT = isRTL() ? 'right-start' : 'left-start';
|
203
|
+
const Default = {
|
252
204
|
offset: [0, 2],
|
253
|
-
flip: true,
|
254
205
|
boundary: 'clippingParents',
|
255
206
|
reference: 'toggle',
|
256
207
|
display: 'dynamic',
|
257
208
|
popperConfig: null
|
258
209
|
};
|
259
|
-
|
210
|
+
const DefaultType = {
|
260
211
|
offset: '(array|string|function)',
|
261
|
-
flip: 'boolean',
|
262
212
|
boundary: '(string|element)',
|
263
213
|
reference: '(string|element|object)',
|
264
214
|
display: 'string',
|
@@ -270,33 +220,37 @@
|
|
270
220
|
* ------------------------------------------------------------------------
|
271
221
|
*/
|
272
222
|
|
273
|
-
|
274
|
-
|
223
|
+
class Dropdown extends BaseComponent__default['default'] {
|
224
|
+
constructor(element, config) {
|
225
|
+
super(element);
|
226
|
+
this._popper = null;
|
227
|
+
this._config = this._getConfig(config);
|
228
|
+
this._menu = this._getMenuElement();
|
229
|
+
this._inNavbar = this._detectNavbar();
|
275
230
|
|
276
|
-
|
277
|
-
|
231
|
+
this._addEventListeners();
|
232
|
+
} // Getters
|
278
233
|
|
279
|
-
_this = _BaseComponent.call(this, element) || this;
|
280
|
-
_this._popper = null;
|
281
|
-
_this._config = _this._getConfig(config);
|
282
|
-
_this._menu = _this._getMenuElement();
|
283
|
-
_this._inNavbar = _this._detectNavbar();
|
284
234
|
|
285
|
-
|
235
|
+
static get Default() {
|
236
|
+
return Default;
|
237
|
+
}
|
286
238
|
|
287
|
-
|
288
|
-
|
239
|
+
static get DefaultType() {
|
240
|
+
return DefaultType;
|
241
|
+
}
|
289
242
|
|
243
|
+
static get DATA_KEY() {
|
244
|
+
return DATA_KEY;
|
245
|
+
} // Public
|
290
246
|
|
291
|
-
var _proto = Dropdown.prototype;
|
292
247
|
|
293
|
-
|
294
|
-
_proto.toggle = function toggle() {
|
248
|
+
toggle() {
|
295
249
|
if (this._element.disabled || this._element.classList.contains(CLASS_NAME_DISABLED)) {
|
296
250
|
return;
|
297
251
|
}
|
298
252
|
|
299
|
-
|
253
|
+
const isActive = this._element.classList.contains(CLASS_NAME_SHOW);
|
300
254
|
|
301
255
|
Dropdown.clearMenus();
|
302
256
|
|
@@ -305,18 +259,18 @@
|
|
305
259
|
}
|
306
260
|
|
307
261
|
this.show();
|
308
|
-
}
|
262
|
+
}
|
309
263
|
|
310
|
-
|
264
|
+
show() {
|
311
265
|
if (this._element.disabled || this._element.classList.contains(CLASS_NAME_DISABLED) || this._menu.classList.contains(CLASS_NAME_SHOW)) {
|
312
266
|
return;
|
313
267
|
}
|
314
268
|
|
315
|
-
|
316
|
-
|
269
|
+
const parent = Dropdown.getParentFromElement(this._element);
|
270
|
+
const relatedTarget = {
|
317
271
|
relatedTarget: this._element
|
318
272
|
};
|
319
|
-
|
273
|
+
const showEvent = EventHandler__default['default'].trigger(this._element, EVENT_SHOW, relatedTarget);
|
320
274
|
|
321
275
|
if (showEvent.defaultPrevented) {
|
322
276
|
return;
|
@@ -330,7 +284,7 @@
|
|
330
284
|
throw new TypeError('Bootstrap\'s dropdowns require Popper (https://popper.js.org)');
|
331
285
|
}
|
332
286
|
|
333
|
-
|
287
|
+
let referenceElement = this._element;
|
334
288
|
|
335
289
|
if (this._config.reference === 'parent') {
|
336
290
|
referenceElement = parent;
|
@@ -344,12 +298,10 @@
|
|
344
298
|
referenceElement = this._config.reference;
|
345
299
|
}
|
346
300
|
|
347
|
-
|
301
|
+
const popperConfig = this._getPopperConfig();
|
348
302
|
|
349
|
-
|
350
|
-
|
351
|
-
});
|
352
|
-
this._popper = Popper.createPopper(referenceElement, this._menu, popperConfig);
|
303
|
+
const isDisplayStatic = popperConfig.modifiers.find(modifier => modifier.name === 'applyStyles' && modifier.enabled === false);
|
304
|
+
this._popper = Popper__namespace.createPopper(referenceElement, this._menu, popperConfig);
|
353
305
|
|
354
306
|
if (isDisplayStatic) {
|
355
307
|
Manipulator__default['default'].setDataAttribute(this._menu, 'popper', 'static');
|
@@ -361,11 +313,7 @@
|
|
361
313
|
|
362
314
|
|
363
315
|
if ('ontouchstart' in document.documentElement && !parent.closest(SELECTOR_NAVBAR_NAV)) {
|
364
|
-
|
365
|
-
|
366
|
-
(_ref = []).concat.apply(_ref, document.body.children).forEach(function (elem) {
|
367
|
-
return EventHandler__default['default'].on(elem, 'mouseover', null, noop());
|
368
|
-
});
|
316
|
+
[].concat(...document.body.children).forEach(elem => EventHandler__default['default'].on(elem, 'mouseover', null, noop()));
|
369
317
|
}
|
370
318
|
|
371
319
|
this._element.focus();
|
@@ -377,17 +325,17 @@
|
|
377
325
|
this._element.classList.toggle(CLASS_NAME_SHOW);
|
378
326
|
|
379
327
|
EventHandler__default['default'].trigger(this._element, EVENT_SHOWN, relatedTarget);
|
380
|
-
}
|
328
|
+
}
|
381
329
|
|
382
|
-
|
330
|
+
hide() {
|
383
331
|
if (this._element.disabled || this._element.classList.contains(CLASS_NAME_DISABLED) || !this._menu.classList.contains(CLASS_NAME_SHOW)) {
|
384
332
|
return;
|
385
333
|
}
|
386
334
|
|
387
|
-
|
335
|
+
const relatedTarget = {
|
388
336
|
relatedTarget: this._element
|
389
337
|
};
|
390
|
-
|
338
|
+
const hideEvent = EventHandler__default['default'].trigger(this._element, EVENT_HIDE, relatedTarget);
|
391
339
|
|
392
340
|
if (hideEvent.defaultPrevented) {
|
393
341
|
return;
|
@@ -403,11 +351,9 @@
|
|
403
351
|
|
404
352
|
Manipulator__default['default'].removeDataAttribute(this._menu, 'popper');
|
405
353
|
EventHandler__default['default'].trigger(this._element, EVENT_HIDDEN, relatedTarget);
|
406
|
-
}
|
407
|
-
|
408
|
-
_proto.dispose = function dispose() {
|
409
|
-
_BaseComponent.prototype.dispose.call(this);
|
354
|
+
}
|
410
355
|
|
356
|
+
dispose() {
|
411
357
|
EventHandler__default['default'].off(this._element, EVENT_KEY);
|
412
358
|
this._menu = null;
|
413
359
|
|
@@ -416,46 +362,47 @@
|
|
416
362
|
|
417
363
|
this._popper = null;
|
418
364
|
}
|
419
|
-
};
|
420
365
|
|
421
|
-
|
366
|
+
super.dispose();
|
367
|
+
}
|
368
|
+
|
369
|
+
update() {
|
422
370
|
this._inNavbar = this._detectNavbar();
|
423
371
|
|
424
372
|
if (this._popper) {
|
425
373
|
this._popper.update();
|
426
374
|
}
|
427
375
|
} // Private
|
428
|
-
;
|
429
376
|
|
430
|
-
_proto._addEventListeners = function _addEventListeners() {
|
431
|
-
var _this2 = this;
|
432
377
|
|
433
|
-
|
378
|
+
_addEventListeners() {
|
379
|
+
EventHandler__default['default'].on(this._element, EVENT_CLICK, event => {
|
434
380
|
event.preventDefault();
|
435
|
-
|
436
|
-
|
437
|
-
_this2.toggle();
|
381
|
+
this.toggle();
|
438
382
|
});
|
439
|
-
}
|
383
|
+
}
|
440
384
|
|
441
|
-
|
442
|
-
config =
|
385
|
+
_getConfig(config) {
|
386
|
+
config = { ...this.constructor.Default,
|
387
|
+
...Manipulator__default['default'].getDataAttributes(this._element),
|
388
|
+
...config
|
389
|
+
};
|
443
390
|
typeCheckConfig(NAME, config, this.constructor.DefaultType);
|
444
391
|
|
445
392
|
if (typeof config.reference === 'object' && !isElement(config.reference) && typeof config.reference.getBoundingClientRect !== 'function') {
|
446
393
|
// Popper virtual elements require a getBoundingClientRect method
|
447
|
-
throw new TypeError(NAME.toUpperCase()
|
394
|
+
throw new TypeError(`${NAME.toUpperCase()}: Option "reference" provided type "object" without a required "getBoundingClientRect" method.`);
|
448
395
|
}
|
449
396
|
|
450
397
|
return config;
|
451
|
-
}
|
398
|
+
}
|
452
399
|
|
453
|
-
|
400
|
+
_getMenuElement() {
|
454
401
|
return SelectorEngine__default['default'].next(this._element, SELECTOR_MENU)[0];
|
455
|
-
}
|
402
|
+
}
|
456
403
|
|
457
|
-
|
458
|
-
|
404
|
+
_getPlacement() {
|
405
|
+
const parentDropdown = this._element.parentNode;
|
459
406
|
|
460
407
|
if (parentDropdown.classList.contains(CLASS_NAME_DROPEND)) {
|
461
408
|
return PLACEMENT_RIGHT;
|
@@ -466,46 +413,41 @@
|
|
466
413
|
} // We need to trim the value because custom properties can also include spaces
|
467
414
|
|
468
415
|
|
469
|
-
|
416
|
+
const isEnd = getComputedStyle(this._menu).getPropertyValue('--bs-position').trim() === 'end';
|
470
417
|
|
471
418
|
if (parentDropdown.classList.contains(CLASS_NAME_DROPUP)) {
|
472
419
|
return isEnd ? PLACEMENT_TOPEND : PLACEMENT_TOP;
|
473
420
|
}
|
474
421
|
|
475
422
|
return isEnd ? PLACEMENT_BOTTOMEND : PLACEMENT_BOTTOM;
|
476
|
-
}
|
477
|
-
|
478
|
-
_proto._detectNavbar = function _detectNavbar() {
|
479
|
-
return this._element.closest("." + CLASS_NAME_NAVBAR) !== null;
|
480
|
-
};
|
423
|
+
}
|
481
424
|
|
482
|
-
|
483
|
-
|
425
|
+
_detectNavbar() {
|
426
|
+
return this._element.closest(`.${CLASS_NAME_NAVBAR}`) !== null;
|
427
|
+
}
|
484
428
|
|
485
|
-
|
429
|
+
_getOffset() {
|
430
|
+
const {
|
431
|
+
offset
|
432
|
+
} = this._config;
|
486
433
|
|
487
434
|
if (typeof offset === 'string') {
|
488
|
-
return offset.split(',').map(
|
489
|
-
return Number.parseInt(val, 10);
|
490
|
-
});
|
435
|
+
return offset.split(',').map(val => Number.parseInt(val, 10));
|
491
436
|
}
|
492
437
|
|
493
438
|
if (typeof offset === 'function') {
|
494
|
-
return
|
495
|
-
return offset(popperData, _this3._element);
|
496
|
-
};
|
439
|
+
return popperData => offset(popperData, this._element);
|
497
440
|
}
|
498
441
|
|
499
442
|
return offset;
|
500
|
-
}
|
443
|
+
}
|
501
444
|
|
502
|
-
|
503
|
-
|
445
|
+
_getPopperConfig() {
|
446
|
+
const defaultBsPopperConfig = {
|
504
447
|
placement: this._getPlacement(),
|
505
448
|
modifiers: [{
|
506
449
|
name: 'preventOverflow',
|
507
450
|
options: {
|
508
|
-
altBoundary: this._config.flip,
|
509
451
|
boundary: this._config.boundary
|
510
452
|
}
|
511
453
|
}, {
|
@@ -523,14 +465,16 @@
|
|
523
465
|
}];
|
524
466
|
}
|
525
467
|
|
526
|
-
return
|
468
|
+
return { ...defaultBsPopperConfig,
|
469
|
+
...(typeof this._config.popperConfig === 'function' ? this._config.popperConfig(defaultBsPopperConfig) : this._config.popperConfig)
|
470
|
+
};
|
527
471
|
} // Static
|
528
|
-
;
|
529
472
|
|
530
|
-
Dropdown.dropdownInterface = function dropdownInterface(element, config) {
|
531
|
-
var data = Data__default['default'].getData(element, DATA_KEY);
|
532
473
|
|
533
|
-
|
474
|
+
static dropdownInterface(element, config) {
|
475
|
+
let data = Data__default['default'].get(element, DATA_KEY);
|
476
|
+
|
477
|
+
const _config = typeof config === 'object' ? config : null;
|
534
478
|
|
535
479
|
if (!data) {
|
536
480
|
data = new Dropdown(element, _config);
|
@@ -538,29 +482,35 @@
|
|
538
482
|
|
539
483
|
if (typeof config === 'string') {
|
540
484
|
if (typeof data[config] === 'undefined') {
|
541
|
-
throw new TypeError(
|
485
|
+
throw new TypeError(`No method named "${config}"`);
|
542
486
|
}
|
543
487
|
|
544
488
|
data[config]();
|
545
489
|
}
|
546
|
-
}
|
490
|
+
}
|
547
491
|
|
548
|
-
|
492
|
+
static jQueryInterface(config) {
|
549
493
|
return this.each(function () {
|
550
494
|
Dropdown.dropdownInterface(this, config);
|
551
495
|
});
|
552
|
-
}
|
496
|
+
}
|
553
497
|
|
554
|
-
|
555
|
-
if (event
|
556
|
-
|
498
|
+
static clearMenus(event) {
|
499
|
+
if (event) {
|
500
|
+
if (event.button === RIGHT_MOUSE_BUTTON || event.type === 'keyup' && event.key !== TAB_KEY) {
|
501
|
+
return;
|
502
|
+
}
|
503
|
+
|
504
|
+
if (/input|select|textarea|form/i.test(event.target.tagName)) {
|
505
|
+
return;
|
506
|
+
}
|
557
507
|
}
|
558
508
|
|
559
|
-
|
509
|
+
const toggles = SelectorEngine__default['default'].find(SELECTOR_DATA_TOGGLE);
|
560
510
|
|
561
|
-
for (
|
562
|
-
|
563
|
-
|
511
|
+
for (let i = 0, len = toggles.length; i < len; i++) {
|
512
|
+
const context = Data__default['default'].get(toggles[i], DATA_KEY);
|
513
|
+
const relatedTarget = {
|
564
514
|
relatedTarget: toggles[i]
|
565
515
|
};
|
566
516
|
|
@@ -572,17 +522,25 @@
|
|
572
522
|
continue;
|
573
523
|
}
|
574
524
|
|
575
|
-
|
525
|
+
const dropdownMenu = context._menu;
|
576
526
|
|
577
527
|
if (!toggles[i].classList.contains(CLASS_NAME_SHOW)) {
|
578
528
|
continue;
|
579
529
|
}
|
580
530
|
|
581
|
-
if (event
|
582
|
-
|
531
|
+
if (event) {
|
532
|
+
// Don't close the menu if the clicked element or one of its parents is the dropdown button
|
533
|
+
if ([context._element].some(element => event.composedPath().includes(element))) {
|
534
|
+
continue;
|
535
|
+
} // Tab navigation through the dropdown menu shouldn't close the menu
|
536
|
+
|
537
|
+
|
538
|
+
if (event.type === 'keyup' && event.key === TAB_KEY && dropdownMenu.contains(event.target)) {
|
539
|
+
continue;
|
540
|
+
}
|
583
541
|
}
|
584
542
|
|
585
|
-
|
543
|
+
const hideEvent = EventHandler__default['default'].trigger(toggles[i], EVENT_HIDE, relatedTarget);
|
586
544
|
|
587
545
|
if (hideEvent.defaultPrevented) {
|
588
546
|
continue;
|
@@ -591,11 +549,7 @@
|
|
591
549
|
|
592
550
|
|
593
551
|
if ('ontouchstart' in document.documentElement) {
|
594
|
-
|
595
|
-
|
596
|
-
(_ref2 = []).concat.apply(_ref2, document.body.children).forEach(function (elem) {
|
597
|
-
return EventHandler__default['default'].off(elem, 'mouseover', null, noop());
|
598
|
-
});
|
552
|
+
[].concat(...document.body.children).forEach(elem => EventHandler__default['default'].off(elem, 'mouseover', null, noop()));
|
599
553
|
}
|
600
554
|
|
601
555
|
toggles[i].setAttribute('aria-expanded', 'false');
|
@@ -609,13 +563,13 @@
|
|
609
563
|
Manipulator__default['default'].removeDataAttribute(dropdownMenu, 'popper');
|
610
564
|
EventHandler__default['default'].trigger(toggles[i], EVENT_HIDDEN, relatedTarget);
|
611
565
|
}
|
612
|
-
}
|
566
|
+
}
|
613
567
|
|
614
|
-
|
568
|
+
static getParentFromElement(element) {
|
615
569
|
return getElementFromSelector(element) || element.parentNode;
|
616
|
-
}
|
570
|
+
}
|
617
571
|
|
618
|
-
|
572
|
+
static dataApiKeydownHandler(event) {
|
619
573
|
// If not input/textarea:
|
620
574
|
// - And not a key in REGEXP_KEYDOWN => not a dropdown command
|
621
575
|
// If input/textarea:
|
@@ -634,21 +588,19 @@
|
|
634
588
|
return;
|
635
589
|
}
|
636
590
|
|
637
|
-
|
638
|
-
|
591
|
+
const parent = Dropdown.getParentFromElement(this);
|
592
|
+
const isActive = this.classList.contains(CLASS_NAME_SHOW);
|
639
593
|
|
640
594
|
if (event.key === ESCAPE_KEY) {
|
641
|
-
|
595
|
+
const button = this.matches(SELECTOR_DATA_TOGGLE) ? this : SelectorEngine__default['default'].prev(this, SELECTOR_DATA_TOGGLE)[0];
|
642
596
|
button.focus();
|
643
597
|
Dropdown.clearMenus();
|
644
598
|
return;
|
645
599
|
}
|
646
600
|
|
647
601
|
if (!isActive && (event.key === ARROW_UP_KEY || event.key === ARROW_DOWN_KEY)) {
|
648
|
-
|
649
|
-
|
650
|
-
_button.click();
|
651
|
-
|
602
|
+
const button = this.matches(SELECTOR_DATA_TOGGLE) ? this : SelectorEngine__default['default'].prev(this, SELECTOR_DATA_TOGGLE)[0];
|
603
|
+
button.click();
|
652
604
|
return;
|
653
605
|
}
|
654
606
|
|
@@ -657,13 +609,13 @@
|
|
657
609
|
return;
|
658
610
|
}
|
659
611
|
|
660
|
-
|
612
|
+
const items = SelectorEngine__default['default'].find(SELECTOR_VISIBLE_ITEMS, parent).filter(isVisible);
|
661
613
|
|
662
614
|
if (!items.length) {
|
663
615
|
return;
|
664
616
|
}
|
665
617
|
|
666
|
-
|
618
|
+
let index = items.indexOf(event.target); // Up
|
667
619
|
|
668
620
|
if (event.key === ARROW_UP_KEY && index > 0) {
|
669
621
|
index--;
|
@@ -677,27 +629,9 @@
|
|
677
629
|
|
678
630
|
index = index === -1 ? 0 : index;
|
679
631
|
items[index].focus();
|
680
|
-
}
|
681
|
-
|
682
|
-
_createClass(Dropdown, null, [{
|
683
|
-
key: "Default",
|
684
|
-
get: function get() {
|
685
|
-
return Default;
|
686
|
-
}
|
687
|
-
}, {
|
688
|
-
key: "DefaultType",
|
689
|
-
get: function get() {
|
690
|
-
return DefaultType;
|
691
|
-
}
|
692
|
-
}, {
|
693
|
-
key: "DATA_KEY",
|
694
|
-
get: function get() {
|
695
|
-
return DATA_KEY;
|
696
|
-
}
|
697
|
-
}]);
|
632
|
+
}
|
698
633
|
|
699
|
-
|
700
|
-
}(BaseComponent__default['default']);
|
634
|
+
}
|
701
635
|
/**
|
702
636
|
* ------------------------------------------------------------------------
|
703
637
|
* Data Api implementation
|
@@ -711,11 +645,7 @@
|
|
711
645
|
EventHandler__default['default'].on(document, EVENT_KEYUP_DATA_API, Dropdown.clearMenus);
|
712
646
|
EventHandler__default['default'].on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
|
713
647
|
event.preventDefault();
|
714
|
-
|
715
|
-
Dropdown.dropdownInterface(this, 'toggle');
|
716
|
-
});
|
717
|
-
EventHandler__default['default'].on(document, EVENT_CLICK_DATA_API, SELECTOR_FORM_CHILD, function (e) {
|
718
|
-
return e.stopPropagation();
|
648
|
+
Dropdown.dropdownInterface(this);
|
719
649
|
});
|
720
650
|
/**
|
721
651
|
* ------------------------------------------------------------------------
|