vrembem 3.0.17 → 3.0.18
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/LICENSE +1 -1
- package/dev/{styles.css → index.css} +1246 -1738
- package/dev/index.css.map +1 -0
- package/dev/index.js +2250 -0
- package/dev/index.js.map +1 -0
- package/dev/index.umd.cjs +2254 -0
- package/dev/index.umd.cjs.map +1 -0
- package/dist/index.css +1 -0
- package/dist/index.css.map +1 -0
- package/dist/index.js +2231 -0
- package/dist/index.js.map +1 -0
- package/dist/index.umd.cjs +10 -0
- package/dist/index.umd.cjs.map +1 -0
- package/package.json +26 -26
- package/dev/scripts.esm.js +0 -4663
- package/dev/scripts.esm.js.map +0 -1
- package/dev/scripts.js +0 -4667
- package/dev/scripts.js.map +0 -1
- package/dev/scripts.modern.mjs +0 -4114
- package/dev/scripts.modern.mjs.map +0 -1
- package/dev/scripts.umd.js +0 -4674
- package/dev/scripts.umd.js.map +0 -1
- package/dev/styles.css.map +0 -1
- package/dist/scripts.esm.js +0 -2
- package/dist/scripts.esm.js.map +0 -1
- package/dist/scripts.js +0 -2
- package/dist/scripts.js.map +0 -1
- package/dist/scripts.modern.mjs +0 -2
- package/dist/scripts.modern.mjs.map +0 -1
- package/dist/scripts.umd.js +0 -2
- package/dist/scripts.umd.js.map +0 -1
- package/dist/styles.css +0 -1
- package/dist/styles.css.map +0 -1
package/dev/scripts.esm.js
DELETED
|
@@ -1,4663 +0,0 @@
|
|
|
1
|
-
function _defineProperties(target, props) {
|
|
2
|
-
for (var i = 0; i < props.length; i++) {
|
|
3
|
-
var descriptor = props[i];
|
|
4
|
-
descriptor.enumerable = descriptor.enumerable || false;
|
|
5
|
-
descriptor.configurable = true;
|
|
6
|
-
if ("value" in descriptor) descriptor.writable = true;
|
|
7
|
-
Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
|
|
8
|
-
}
|
|
9
|
-
}
|
|
10
|
-
function _createClass(Constructor, protoProps, staticProps) {
|
|
11
|
-
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
|
|
12
|
-
if (staticProps) _defineProperties(Constructor, staticProps);
|
|
13
|
-
Object.defineProperty(Constructor, "prototype", {
|
|
14
|
-
writable: false
|
|
15
|
-
});
|
|
16
|
-
return Constructor;
|
|
17
|
-
}
|
|
18
|
-
function _extends() {
|
|
19
|
-
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
20
|
-
for (var i = 1; i < arguments.length; i++) {
|
|
21
|
-
var source = arguments[i];
|
|
22
|
-
for (var key in source) {
|
|
23
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
24
|
-
target[key] = source[key];
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
|
-
return target;
|
|
29
|
-
};
|
|
30
|
-
return _extends.apply(this, arguments);
|
|
31
|
-
}
|
|
32
|
-
function _inheritsLoose(subClass, superClass) {
|
|
33
|
-
subClass.prototype = Object.create(superClass.prototype);
|
|
34
|
-
subClass.prototype.constructor = subClass;
|
|
35
|
-
_setPrototypeOf(subClass, superClass);
|
|
36
|
-
}
|
|
37
|
-
function _setPrototypeOf(o, p) {
|
|
38
|
-
_setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
|
|
39
|
-
o.__proto__ = p;
|
|
40
|
-
return o;
|
|
41
|
-
};
|
|
42
|
-
return _setPrototypeOf(o, p);
|
|
43
|
-
}
|
|
44
|
-
function _assertThisInitialized(self) {
|
|
45
|
-
if (self === void 0) {
|
|
46
|
-
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
|
|
47
|
-
}
|
|
48
|
-
return self;
|
|
49
|
-
}
|
|
50
|
-
function _toPrimitive(input, hint) {
|
|
51
|
-
if (typeof input !== "object" || input === null) return input;
|
|
52
|
-
var prim = input[Symbol.toPrimitive];
|
|
53
|
-
if (prim !== undefined) {
|
|
54
|
-
var res = prim.call(input, hint || "default");
|
|
55
|
-
if (typeof res !== "object") return res;
|
|
56
|
-
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
57
|
-
}
|
|
58
|
-
return (hint === "string" ? String : Number)(input);
|
|
59
|
-
}
|
|
60
|
-
function _toPropertyKey(arg) {
|
|
61
|
-
var key = _toPrimitive(arg, "string");
|
|
62
|
-
return typeof key === "symbol" ? key : String(key);
|
|
63
|
-
}
|
|
64
|
-
var id = 0;
|
|
65
|
-
function _classPrivateFieldLooseKey(name) {
|
|
66
|
-
return "__private_" + id++ + "_" + name;
|
|
67
|
-
}
|
|
68
|
-
function _classPrivateFieldLooseBase(receiver, privateKey) {
|
|
69
|
-
if (!Object.prototype.hasOwnProperty.call(receiver, privateKey)) {
|
|
70
|
-
throw new TypeError("attempted to use private field on non-instance");
|
|
71
|
-
}
|
|
72
|
-
return receiver;
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
var _handler = /*#__PURE__*/_classPrivateFieldLooseKey("handler");
|
|
76
|
-
var Breakpoint = /*#__PURE__*/function () {
|
|
77
|
-
function Breakpoint(value, handler) {
|
|
78
|
-
Object.defineProperty(this, _handler, {
|
|
79
|
-
writable: true,
|
|
80
|
-
value: void 0
|
|
81
|
-
});
|
|
82
|
-
this.value = value;
|
|
83
|
-
_classPrivateFieldLooseBase(this, _handler)[_handler] = handler;
|
|
84
|
-
this.mql = null;
|
|
85
|
-
}
|
|
86
|
-
var _proto = Breakpoint.prototype;
|
|
87
|
-
_proto.mount = function mount(value, handler) {
|
|
88
|
-
// Update passed params.
|
|
89
|
-
if (value) this.value = value;
|
|
90
|
-
if (handler) _classPrivateFieldLooseBase(this, _handler)[_handler] = handler;
|
|
91
|
-
|
|
92
|
-
// Guard if no breakpoint was set.
|
|
93
|
-
if (!this.value) return this;
|
|
94
|
-
|
|
95
|
-
// Setup and store the MediaQueryList instance.
|
|
96
|
-
this.mql = window.matchMedia("(min-width: " + this.value + ")");
|
|
97
|
-
|
|
98
|
-
// Conditionally use addListener() for IE11 support.
|
|
99
|
-
if (typeof this.mql.addEventListener === 'function') {
|
|
100
|
-
this.mql.addEventListener('change', _classPrivateFieldLooseBase(this, _handler)[_handler]);
|
|
101
|
-
} else {
|
|
102
|
-
this.mql.addListener(_classPrivateFieldLooseBase(this, _handler)[_handler]);
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
// Run the handler.
|
|
106
|
-
_classPrivateFieldLooseBase(this, _handler)[_handler](this.mql);
|
|
107
|
-
return this;
|
|
108
|
-
};
|
|
109
|
-
_proto.unmount = function unmount() {
|
|
110
|
-
// Guard if no MediaQueryList instance exists.
|
|
111
|
-
if (!this.mql) return this;
|
|
112
|
-
|
|
113
|
-
// Conditionally use removeListener() for IE11 support.
|
|
114
|
-
if (typeof this.mql.removeEventListener === 'function') {
|
|
115
|
-
this.mql.removeEventListener('change', _classPrivateFieldLooseBase(this, _handler)[_handler]);
|
|
116
|
-
} else {
|
|
117
|
-
this.mql.removeListener(_classPrivateFieldLooseBase(this, _handler)[_handler]);
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
// Set value, handler and MediaQueryList to null.
|
|
121
|
-
this.value = null;
|
|
122
|
-
_classPrivateFieldLooseBase(this, _handler)[_handler] = null;
|
|
123
|
-
this.mql = null;
|
|
124
|
-
return this;
|
|
125
|
-
};
|
|
126
|
-
_createClass(Breakpoint, [{
|
|
127
|
-
key: "handler",
|
|
128
|
-
get: function get() {
|
|
129
|
-
return _classPrivateFieldLooseBase(this, _handler)[_handler];
|
|
130
|
-
}
|
|
131
|
-
|
|
132
|
-
// Unmount existing handler before setting a new one.
|
|
133
|
-
,
|
|
134
|
-
set: function set(func) {
|
|
135
|
-
if (this.mql) {
|
|
136
|
-
// Conditionally use removeListener() for IE11 support.
|
|
137
|
-
if (typeof this.mql.removeEventListener === 'function') {
|
|
138
|
-
this.mql.removeEventListener('change', _classPrivateFieldLooseBase(this, _handler)[_handler]);
|
|
139
|
-
} else {
|
|
140
|
-
this.mql.removeListener(_classPrivateFieldLooseBase(this, _handler)[_handler]);
|
|
141
|
-
}
|
|
142
|
-
}
|
|
143
|
-
_classPrivateFieldLooseBase(this, _handler)[_handler] = func;
|
|
144
|
-
}
|
|
145
|
-
}]);
|
|
146
|
-
return Breakpoint;
|
|
147
|
-
}();
|
|
148
|
-
|
|
149
|
-
function _settle(pact, state, value) {
|
|
150
|
-
if (!pact.s) {
|
|
151
|
-
if (value instanceof _Pact) {
|
|
152
|
-
if (value.s) {
|
|
153
|
-
if (state & 1) {
|
|
154
|
-
state = value.s;
|
|
155
|
-
}
|
|
156
|
-
value = value.v;
|
|
157
|
-
} else {
|
|
158
|
-
value.o = _settle.bind(null, pact, state);
|
|
159
|
-
return;
|
|
160
|
-
}
|
|
161
|
-
}
|
|
162
|
-
if (value && value.then) {
|
|
163
|
-
value.then(_settle.bind(null, pact, state), _settle.bind(null, pact, 2));
|
|
164
|
-
return;
|
|
165
|
-
}
|
|
166
|
-
pact.s = state;
|
|
167
|
-
pact.v = value;
|
|
168
|
-
const observer = pact.o;
|
|
169
|
-
if (observer) {
|
|
170
|
-
observer(pact);
|
|
171
|
-
}
|
|
172
|
-
}
|
|
173
|
-
}
|
|
174
|
-
var _Pact = /*#__PURE__*/function () {
|
|
175
|
-
function _Pact() {}
|
|
176
|
-
_Pact.prototype.then = function (onFulfilled, onRejected) {
|
|
177
|
-
var result = new _Pact();
|
|
178
|
-
var state = this.s;
|
|
179
|
-
if (state) {
|
|
180
|
-
var callback = state & 1 ? onFulfilled : onRejected;
|
|
181
|
-
if (callback) {
|
|
182
|
-
try {
|
|
183
|
-
_settle(result, 1, callback(this.v));
|
|
184
|
-
} catch (e) {
|
|
185
|
-
_settle(result, 2, e);
|
|
186
|
-
}
|
|
187
|
-
return result;
|
|
188
|
-
} else {
|
|
189
|
-
return this;
|
|
190
|
-
}
|
|
191
|
-
}
|
|
192
|
-
this.o = function (_this) {
|
|
193
|
-
try {
|
|
194
|
-
var value = _this.v;
|
|
195
|
-
if (_this.s & 1) {
|
|
196
|
-
_settle(result, 1, onFulfilled ? onFulfilled(value) : value);
|
|
197
|
-
} else if (onRejected) {
|
|
198
|
-
_settle(result, 1, onRejected(value));
|
|
199
|
-
} else {
|
|
200
|
-
_settle(result, 2, value);
|
|
201
|
-
}
|
|
202
|
-
} catch (e) {
|
|
203
|
-
_settle(result, 2, e);
|
|
204
|
-
}
|
|
205
|
-
};
|
|
206
|
-
return result;
|
|
207
|
-
};
|
|
208
|
-
return _Pact;
|
|
209
|
-
}();
|
|
210
|
-
function _isSettledPact(thenable) {
|
|
211
|
-
return thenable instanceof _Pact && thenable.s & 1;
|
|
212
|
-
}
|
|
213
|
-
function _for(test, update, body) {
|
|
214
|
-
var stage;
|
|
215
|
-
for (;;) {
|
|
216
|
-
var shouldContinue = test();
|
|
217
|
-
if (_isSettledPact(shouldContinue)) {
|
|
218
|
-
shouldContinue = shouldContinue.v;
|
|
219
|
-
}
|
|
220
|
-
if (!shouldContinue) {
|
|
221
|
-
return result;
|
|
222
|
-
}
|
|
223
|
-
if (shouldContinue.then) {
|
|
224
|
-
stage = 0;
|
|
225
|
-
break;
|
|
226
|
-
}
|
|
227
|
-
var result = body();
|
|
228
|
-
if (result && result.then) {
|
|
229
|
-
if (_isSettledPact(result)) {
|
|
230
|
-
result = result.s;
|
|
231
|
-
} else {
|
|
232
|
-
stage = 1;
|
|
233
|
-
break;
|
|
234
|
-
}
|
|
235
|
-
}
|
|
236
|
-
if (update) {
|
|
237
|
-
var updateValue = update();
|
|
238
|
-
if (updateValue && updateValue.then && !_isSettledPact(updateValue)) {
|
|
239
|
-
stage = 2;
|
|
240
|
-
break;
|
|
241
|
-
}
|
|
242
|
-
}
|
|
243
|
-
}
|
|
244
|
-
var pact = new _Pact();
|
|
245
|
-
var reject = _settle.bind(null, pact, 2);
|
|
246
|
-
(stage === 0 ? shouldContinue.then(_resumeAfterTest) : stage === 1 ? result.then(_resumeAfterBody) : updateValue.then(_resumeAfterUpdate)).then(void 0, reject);
|
|
247
|
-
return pact;
|
|
248
|
-
function _resumeAfterBody(value) {
|
|
249
|
-
result = value;
|
|
250
|
-
do {
|
|
251
|
-
if (update) {
|
|
252
|
-
updateValue = update();
|
|
253
|
-
if (updateValue && updateValue.then && !_isSettledPact(updateValue)) {
|
|
254
|
-
updateValue.then(_resumeAfterUpdate).then(void 0, reject);
|
|
255
|
-
return;
|
|
256
|
-
}
|
|
257
|
-
}
|
|
258
|
-
shouldContinue = test();
|
|
259
|
-
if (!shouldContinue || _isSettledPact(shouldContinue) && !shouldContinue.v) {
|
|
260
|
-
_settle(pact, 1, result);
|
|
261
|
-
return;
|
|
262
|
-
}
|
|
263
|
-
if (shouldContinue.then) {
|
|
264
|
-
shouldContinue.then(_resumeAfterTest).then(void 0, reject);
|
|
265
|
-
return;
|
|
266
|
-
}
|
|
267
|
-
result = body();
|
|
268
|
-
if (_isSettledPact(result)) {
|
|
269
|
-
result = result.v;
|
|
270
|
-
}
|
|
271
|
-
} while (!result || !result.then);
|
|
272
|
-
result.then(_resumeAfterBody).then(void 0, reject);
|
|
273
|
-
}
|
|
274
|
-
function _resumeAfterTest(shouldContinue) {
|
|
275
|
-
if (shouldContinue) {
|
|
276
|
-
result = body();
|
|
277
|
-
if (result && result.then) {
|
|
278
|
-
result.then(_resumeAfterBody).then(void 0, reject);
|
|
279
|
-
} else {
|
|
280
|
-
_resumeAfterBody(result);
|
|
281
|
-
}
|
|
282
|
-
} else {
|
|
283
|
-
_settle(pact, 1, result);
|
|
284
|
-
}
|
|
285
|
-
}
|
|
286
|
-
function _resumeAfterUpdate() {
|
|
287
|
-
if (shouldContinue = test()) {
|
|
288
|
-
if (shouldContinue.then) {
|
|
289
|
-
shouldContinue.then(_resumeAfterTest).then(void 0, reject);
|
|
290
|
-
} else {
|
|
291
|
-
_resumeAfterTest(shouldContinue);
|
|
292
|
-
}
|
|
293
|
-
} else {
|
|
294
|
-
_settle(pact, 1, result);
|
|
295
|
-
}
|
|
296
|
-
}
|
|
297
|
-
}
|
|
298
|
-
var Collection = /*#__PURE__*/function () {
|
|
299
|
-
function Collection() {
|
|
300
|
-
this.collection = [];
|
|
301
|
-
}
|
|
302
|
-
var _proto = Collection.prototype;
|
|
303
|
-
_proto.register = function register(item) {
|
|
304
|
-
try {
|
|
305
|
-
var _this = this;
|
|
306
|
-
return Promise.resolve(_this.deregister(item)).then(function () {
|
|
307
|
-
_this.collection.push(item);
|
|
308
|
-
return _this.collection;
|
|
309
|
-
});
|
|
310
|
-
} catch (e) {
|
|
311
|
-
return Promise.reject(e);
|
|
312
|
-
}
|
|
313
|
-
};
|
|
314
|
-
_proto.deregister = function deregister(ref) {
|
|
315
|
-
try {
|
|
316
|
-
var _this2 = this;
|
|
317
|
-
var index = _this2.collection.findIndex(function (entry) {
|
|
318
|
-
return entry === ref;
|
|
319
|
-
});
|
|
320
|
-
if (index >= 0) {
|
|
321
|
-
var entry = _this2.collection[index];
|
|
322
|
-
Object.getOwnPropertyNames(entry).forEach(function (prop) {
|
|
323
|
-
delete entry[prop];
|
|
324
|
-
});
|
|
325
|
-
_this2.collection.splice(index, 1);
|
|
326
|
-
}
|
|
327
|
-
return Promise.resolve(_this2.collection);
|
|
328
|
-
} catch (e) {
|
|
329
|
-
return Promise.reject(e);
|
|
330
|
-
}
|
|
331
|
-
};
|
|
332
|
-
_proto.registerCollection = function registerCollection(items) {
|
|
333
|
-
try {
|
|
334
|
-
var _this3 = this;
|
|
335
|
-
return Promise.resolve(Promise.all(Array.from(items, function (item) {
|
|
336
|
-
_this3.register(item);
|
|
337
|
-
}))).then(function () {
|
|
338
|
-
return _this3.collection;
|
|
339
|
-
});
|
|
340
|
-
} catch (e) {
|
|
341
|
-
return Promise.reject(e);
|
|
342
|
-
}
|
|
343
|
-
};
|
|
344
|
-
_proto.deregisterCollection = function deregisterCollection() {
|
|
345
|
-
try {
|
|
346
|
-
var _temp2 = function _temp2() {
|
|
347
|
-
return _this4.collection;
|
|
348
|
-
};
|
|
349
|
-
var _this4 = this;
|
|
350
|
-
var _temp = _for(function () {
|
|
351
|
-
return _this4.collection.length > 0;
|
|
352
|
-
}, void 0, function () {
|
|
353
|
-
return Promise.resolve(_this4.deregister(_this4.collection[0])).then(function () {});
|
|
354
|
-
});
|
|
355
|
-
return Promise.resolve(_temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp));
|
|
356
|
-
} catch (e) {
|
|
357
|
-
return Promise.reject(e);
|
|
358
|
-
}
|
|
359
|
-
};
|
|
360
|
-
_proto.get = function get(value, key) {
|
|
361
|
-
if (key === void 0) {
|
|
362
|
-
key = 'id';
|
|
363
|
-
}
|
|
364
|
-
return this.collection.find(function (item) {
|
|
365
|
-
return item[key] === value;
|
|
366
|
-
});
|
|
367
|
-
};
|
|
368
|
-
return Collection;
|
|
369
|
-
}();
|
|
370
|
-
|
|
371
|
-
const not = {
|
|
372
|
-
inert: ':not([inert]):not([inert] *)',
|
|
373
|
-
negTabIndex: ':not([tabindex^="-"])',
|
|
374
|
-
disabled: ':not(:disabled)',
|
|
375
|
-
};
|
|
376
|
-
|
|
377
|
-
var e = [
|
|
378
|
-
`a[href]${not.inert}${not.negTabIndex}`,
|
|
379
|
-
`area[href]${not.inert}${not.negTabIndex}`,
|
|
380
|
-
`input:not([type="hidden"]):not([type="radio"])${not.inert}${not.negTabIndex}${not.disabled}`,
|
|
381
|
-
`input[type="radio"]${not.inert}${not.negTabIndex}${not.disabled}`,
|
|
382
|
-
`select${not.inert}${not.negTabIndex}${not.disabled}`,
|
|
383
|
-
`textarea${not.inert}${not.negTabIndex}${not.disabled}`,
|
|
384
|
-
`button${not.inert}${not.negTabIndex}${not.disabled}`,
|
|
385
|
-
`details${not.inert} > summary:first-of-type${not.negTabIndex}`,
|
|
386
|
-
// Discard until Firefox supports `:has()`
|
|
387
|
-
// See: https://github.com/KittyGiraudel/focusable-selectors/issues/12
|
|
388
|
-
// `details:not(:has(> summary))${not.inert}${not.negTabIndex}`,
|
|
389
|
-
`iframe${not.inert}${not.negTabIndex}`,
|
|
390
|
-
`audio[controls]${not.inert}${not.negTabIndex}`,
|
|
391
|
-
`video[controls]${not.inert}${not.negTabIndex}`,
|
|
392
|
-
`[contenteditable]${not.inert}${not.negTabIndex}`,
|
|
393
|
-
`[tabindex]${not.inert}${not.negTabIndex}`,
|
|
394
|
-
];
|
|
395
|
-
|
|
396
|
-
var _focusable = /*#__PURE__*/_classPrivateFieldLooseKey("focusable");
|
|
397
|
-
var _handleFocusTrap = /*#__PURE__*/_classPrivateFieldLooseKey("handleFocusTrap");
|
|
398
|
-
var _handleFocusLock = /*#__PURE__*/_classPrivateFieldLooseKey("handleFocusLock");
|
|
399
|
-
var FocusTrap = /*#__PURE__*/function () {
|
|
400
|
-
function FocusTrap(el, selectorFocus) {
|
|
401
|
-
if (el === void 0) {
|
|
402
|
-
el = null;
|
|
403
|
-
}
|
|
404
|
-
if (selectorFocus === void 0) {
|
|
405
|
-
selectorFocus = '[data-focus]';
|
|
406
|
-
}
|
|
407
|
-
Object.defineProperty(this, _focusable, {
|
|
408
|
-
writable: true,
|
|
409
|
-
value: void 0
|
|
410
|
-
});
|
|
411
|
-
Object.defineProperty(this, _handleFocusTrap, {
|
|
412
|
-
writable: true,
|
|
413
|
-
value: void 0
|
|
414
|
-
});
|
|
415
|
-
Object.defineProperty(this, _handleFocusLock, {
|
|
416
|
-
writable: true,
|
|
417
|
-
value: void 0
|
|
418
|
-
});
|
|
419
|
-
this.el = el;
|
|
420
|
-
this.selectorFocus = selectorFocus;
|
|
421
|
-
_classPrivateFieldLooseBase(this, _handleFocusTrap)[_handleFocusTrap] = handleFocusTrap.bind(this);
|
|
422
|
-
_classPrivateFieldLooseBase(this, _handleFocusLock)[_handleFocusLock] = handleFocusLock.bind(this);
|
|
423
|
-
}
|
|
424
|
-
var _proto = FocusTrap.prototype;
|
|
425
|
-
_proto.mount = function mount(el, selectorFocus) {
|
|
426
|
-
// Update passed params.
|
|
427
|
-
if (el) this.el = el;
|
|
428
|
-
if (selectorFocus) this.selectorFocus = selectorFocus;
|
|
429
|
-
|
|
430
|
-
// Get the focusable elements.
|
|
431
|
-
this.focusable = this.getFocusable();
|
|
432
|
-
|
|
433
|
-
// Set the focus on the element.
|
|
434
|
-
this.focus();
|
|
435
|
-
};
|
|
436
|
-
_proto.unmount = function unmount() {
|
|
437
|
-
// Set element to null.
|
|
438
|
-
this.el = null;
|
|
439
|
-
|
|
440
|
-
// Apply empty array to focusable.
|
|
441
|
-
this.focusable = [];
|
|
442
|
-
|
|
443
|
-
// Remove event listeners
|
|
444
|
-
document.removeEventListener('keydown', _classPrivateFieldLooseBase(this, _handleFocusTrap)[_handleFocusTrap]);
|
|
445
|
-
document.removeEventListener('keydown', _classPrivateFieldLooseBase(this, _handleFocusLock)[_handleFocusLock]);
|
|
446
|
-
};
|
|
447
|
-
_proto.focus = function focus(el, selectorFocus) {
|
|
448
|
-
if (el === void 0) {
|
|
449
|
-
el = this.el;
|
|
450
|
-
}
|
|
451
|
-
if (selectorFocus === void 0) {
|
|
452
|
-
selectorFocus = this.selectorFocus;
|
|
453
|
-
}
|
|
454
|
-
// Query for the focus selector, otherwise return this element.
|
|
455
|
-
var result = el.querySelector(selectorFocus) || el;
|
|
456
|
-
// Give the returned element focus.
|
|
457
|
-
result.focus();
|
|
458
|
-
};
|
|
459
|
-
_proto.getFocusable = function getFocusable(el) {
|
|
460
|
-
if (el === void 0) {
|
|
461
|
-
el = this.el;
|
|
462
|
-
}
|
|
463
|
-
// Initialize the focusable array.
|
|
464
|
-
var focusable = [];
|
|
465
|
-
|
|
466
|
-
// Store the initial focus and scroll position.
|
|
467
|
-
var initFocus = document.activeElement;
|
|
468
|
-
var initScrollTop = el.scrollTop;
|
|
469
|
-
|
|
470
|
-
// Query for all the focusable elements.
|
|
471
|
-
var els = el.querySelectorAll(e.join(','));
|
|
472
|
-
|
|
473
|
-
// Loop through all focusable elements.
|
|
474
|
-
els.forEach(function (el) {
|
|
475
|
-
// Set them to focus and check
|
|
476
|
-
el.focus();
|
|
477
|
-
// Test that the element took focus.
|
|
478
|
-
if (document.activeElement === el) {
|
|
479
|
-
// Add element to the focusable array.
|
|
480
|
-
focusable.push(el);
|
|
481
|
-
}
|
|
482
|
-
});
|
|
483
|
-
|
|
484
|
-
// Restore the initial scroll position and focus.
|
|
485
|
-
el.scrollTop = initScrollTop;
|
|
486
|
-
initFocus.focus();
|
|
487
|
-
|
|
488
|
-
// Return the focusable array.
|
|
489
|
-
return focusable;
|
|
490
|
-
};
|
|
491
|
-
_createClass(FocusTrap, [{
|
|
492
|
-
key: "focusable",
|
|
493
|
-
get: function get() {
|
|
494
|
-
return _classPrivateFieldLooseBase(this, _focusable)[_focusable];
|
|
495
|
-
},
|
|
496
|
-
set: function set(value) {
|
|
497
|
-
// Update the focusable value.
|
|
498
|
-
_classPrivateFieldLooseBase(this, _focusable)[_focusable] = value;
|
|
499
|
-
|
|
500
|
-
// Apply event listeners based on new focusable array length.
|
|
501
|
-
if (_classPrivateFieldLooseBase(this, _focusable)[_focusable].length) {
|
|
502
|
-
document.removeEventListener('keydown', _classPrivateFieldLooseBase(this, _handleFocusLock)[_handleFocusLock]);
|
|
503
|
-
document.addEventListener('keydown', _classPrivateFieldLooseBase(this, _handleFocusTrap)[_handleFocusTrap]);
|
|
504
|
-
} else {
|
|
505
|
-
document.removeEventListener('keydown', _classPrivateFieldLooseBase(this, _handleFocusTrap)[_handleFocusTrap]);
|
|
506
|
-
document.addEventListener('keydown', _classPrivateFieldLooseBase(this, _handleFocusLock)[_handleFocusLock]);
|
|
507
|
-
}
|
|
508
|
-
}
|
|
509
|
-
}, {
|
|
510
|
-
key: "focusableFirst",
|
|
511
|
-
get: function get() {
|
|
512
|
-
return this.focusable[0];
|
|
513
|
-
}
|
|
514
|
-
}, {
|
|
515
|
-
key: "focusableLast",
|
|
516
|
-
get: function get() {
|
|
517
|
-
return this.focusable[this.focusable.length - 1];
|
|
518
|
-
}
|
|
519
|
-
}]);
|
|
520
|
-
return FocusTrap;
|
|
521
|
-
}();
|
|
522
|
-
function handleFocusTrap(event) {
|
|
523
|
-
// Check if the click was a tab and return if not.
|
|
524
|
-
var isTab = event.key === 'Tab' || event.keyCode === 9;
|
|
525
|
-
if (!isTab) return;
|
|
526
|
-
|
|
527
|
-
// If the shift key is pressed.
|
|
528
|
-
if (event.shiftKey) {
|
|
529
|
-
// If the active element is either the root el or first focusable.
|
|
530
|
-
if (document.activeElement === this.focusableFirst || document.activeElement === this.el) {
|
|
531
|
-
// Prevent default and focus the last focusable element instead.
|
|
532
|
-
event.preventDefault();
|
|
533
|
-
this.focusableLast.focus();
|
|
534
|
-
}
|
|
535
|
-
} else {
|
|
536
|
-
// If the active element is either the root el or last focusable.
|
|
537
|
-
if (document.activeElement === this.focusableLast || document.activeElement === this.el) {
|
|
538
|
-
// Prevent default and focus the first focusable element instead.
|
|
539
|
-
event.preventDefault();
|
|
540
|
-
this.focusableFirst.focus();
|
|
541
|
-
}
|
|
542
|
-
}
|
|
543
|
-
}
|
|
544
|
-
function handleFocusLock(event) {
|
|
545
|
-
// Ignore the tab key by preventing default.
|
|
546
|
-
var isTab = event.key === 'Tab' || event.keyCode === 9;
|
|
547
|
-
if (isTab) event.preventDefault();
|
|
548
|
-
}
|
|
549
|
-
|
|
550
|
-
function getConfig$1(el, dataConfig) {
|
|
551
|
-
var string = el.getAttribute("data-" + dataConfig) || '';
|
|
552
|
-
var json = string.replace(/'/g, '"');
|
|
553
|
-
return json ? JSON.parse(json) : {};
|
|
554
|
-
}
|
|
555
|
-
|
|
556
|
-
function getPrefix() {
|
|
557
|
-
return getComputedStyle(document.body).getPropertyValue('--vrembem-variable-prefix').trim();
|
|
558
|
-
}
|
|
559
|
-
|
|
560
|
-
function localStore(key, enable) {
|
|
561
|
-
if (enable === void 0) {
|
|
562
|
-
enable = true;
|
|
563
|
-
}
|
|
564
|
-
var local = localStorage.getItem(key);
|
|
565
|
-
var store = local ? JSON.parse(local) : {};
|
|
566
|
-
return {
|
|
567
|
-
get: function get(prop) {
|
|
568
|
-
return prop ? store[prop] : store;
|
|
569
|
-
},
|
|
570
|
-
set: function set(prop, value) {
|
|
571
|
-
if (value) {
|
|
572
|
-
store[prop] = value;
|
|
573
|
-
} else {
|
|
574
|
-
delete store[prop];
|
|
575
|
-
}
|
|
576
|
-
if (enable) localStorage.setItem(key, JSON.stringify(store));
|
|
577
|
-
return store;
|
|
578
|
-
}
|
|
579
|
-
};
|
|
580
|
-
}
|
|
581
|
-
|
|
582
|
-
/**
|
|
583
|
-
* Teleports an element in the DOM based on a reference and teleport method.
|
|
584
|
-
* Provide the comment node as the reference to teleport the element back to its
|
|
585
|
-
* previous location.
|
|
586
|
-
* @param {Node} what - What element to teleport.
|
|
587
|
-
* @param {String || Node} where - Where to teleport the element.
|
|
588
|
-
* @param {String} how - How (method) to teleport the element, e.g: 'after',
|
|
589
|
-
* 'before', 'append' or 'prepend'.
|
|
590
|
-
* @return {Node} Return the return reference if it was teleported else return
|
|
591
|
-
* null if it was returned to a comment reference.
|
|
592
|
-
*/
|
|
593
|
-
function teleport(what, where, how) {
|
|
594
|
-
// Check if ref is either a comment or element node.
|
|
595
|
-
var isComment = where.nodeType === Node.COMMENT_NODE;
|
|
596
|
-
var isElement = where.nodeType === Node.ELEMENT_NODE;
|
|
597
|
-
|
|
598
|
-
// Get the reference element.
|
|
599
|
-
where = isComment || isElement ? where : document.querySelector(where);
|
|
600
|
-
|
|
601
|
-
// If ref is a comment, set teleport type to 'after'.
|
|
602
|
-
if (isComment) how = 'after';
|
|
603
|
-
|
|
604
|
-
// Must be a valid reference element and method.
|
|
605
|
-
if (!where) throw new Error("Not a valid teleport reference: '" + where + "'");
|
|
606
|
-
if (typeof where[how] != 'function') throw new Error("Not a valid teleport method: '" + how + "'");
|
|
607
|
-
|
|
608
|
-
// Initial return ref is null.
|
|
609
|
-
var returnRef = null;
|
|
610
|
-
|
|
611
|
-
// If ref is not a comment, set a return reference comment.
|
|
612
|
-
if (!isComment) {
|
|
613
|
-
returnRef = document.createComment('teleported #' + what.id);
|
|
614
|
-
what.before(returnRef);
|
|
615
|
-
}
|
|
616
|
-
|
|
617
|
-
// Teleport the target node.
|
|
618
|
-
where[how](what);
|
|
619
|
-
|
|
620
|
-
// Delete the comment node if element was returned to a comment reference.
|
|
621
|
-
if (isComment) {
|
|
622
|
-
where.remove();
|
|
623
|
-
}
|
|
624
|
-
|
|
625
|
-
// Return the return reference if it was teleported else return null if it was
|
|
626
|
-
// returned to a comment reference.
|
|
627
|
-
return returnRef;
|
|
628
|
-
}
|
|
629
|
-
|
|
630
|
-
var openTransition = function openTransition(el, settings) {
|
|
631
|
-
return new Promise(function (resolve) {
|
|
632
|
-
// Check if transitions are enabled.
|
|
633
|
-
if (settings.transition) {
|
|
634
|
-
// Toggle classes for opening transition.
|
|
635
|
-
el.classList.remove(settings.stateClosed);
|
|
636
|
-
el.classList.add(settings.stateOpening);
|
|
637
|
-
|
|
638
|
-
// Add event listener for when the transition is finished.
|
|
639
|
-
el.addEventListener('transitionend', function _f(event) {
|
|
640
|
-
// Prevent child transition bubbling from firing this event.
|
|
641
|
-
if (event.target != el) return;
|
|
642
|
-
|
|
643
|
-
// Toggle final opened state classes.
|
|
644
|
-
el.classList.add(settings.stateOpened);
|
|
645
|
-
el.classList.remove(settings.stateOpening);
|
|
646
|
-
|
|
647
|
-
// Resolve the promise and remove the event listener.
|
|
648
|
-
resolve(el);
|
|
649
|
-
this.removeEventListener('transitionend', _f);
|
|
650
|
-
});
|
|
651
|
-
} else {
|
|
652
|
-
// Toggle final opened state classes and resolve the promise.
|
|
653
|
-
el.classList.add(settings.stateOpened);
|
|
654
|
-
el.classList.remove(settings.stateClosed);
|
|
655
|
-
resolve(el);
|
|
656
|
-
}
|
|
657
|
-
});
|
|
658
|
-
};
|
|
659
|
-
var closeTransition = function closeTransition(el, settings) {
|
|
660
|
-
return new Promise(function (resolve) {
|
|
661
|
-
// Check if transitions are enabled.
|
|
662
|
-
if (settings.transition) {
|
|
663
|
-
// Toggle classes for closing transition.
|
|
664
|
-
el.classList.add(settings.stateClosing);
|
|
665
|
-
el.classList.remove(settings.stateOpened);
|
|
666
|
-
|
|
667
|
-
// Add event listener for when the transition is finished.
|
|
668
|
-
el.addEventListener('transitionend', function _f(event) {
|
|
669
|
-
// Prevent child transition bubbling from firing this event.
|
|
670
|
-
if (event.target != el) return;
|
|
671
|
-
|
|
672
|
-
// Toggle final closed state classes.
|
|
673
|
-
el.classList.remove(settings.stateClosing);
|
|
674
|
-
el.classList.add(settings.stateClosed);
|
|
675
|
-
|
|
676
|
-
// Resolve the promise and remove the event listener.
|
|
677
|
-
resolve(el);
|
|
678
|
-
this.removeEventListener('transitionend', _f);
|
|
679
|
-
});
|
|
680
|
-
} else {
|
|
681
|
-
// Toggle final closed state classes and resolve the promise.
|
|
682
|
-
el.classList.add(settings.stateClosed);
|
|
683
|
-
el.classList.remove(settings.stateOpened);
|
|
684
|
-
resolve(el);
|
|
685
|
-
}
|
|
686
|
-
});
|
|
687
|
-
};
|
|
688
|
-
|
|
689
|
-
function setOverflowHidden(state, selector) {
|
|
690
|
-
if (selector) {
|
|
691
|
-
var els = document.querySelectorAll(selector);
|
|
692
|
-
els.forEach(function (el) {
|
|
693
|
-
if (state) {
|
|
694
|
-
el.style.overflow = 'hidden';
|
|
695
|
-
} else {
|
|
696
|
-
el.style.removeProperty('overflow');
|
|
697
|
-
}
|
|
698
|
-
});
|
|
699
|
-
}
|
|
700
|
-
}
|
|
701
|
-
function setInert(state, selector) {
|
|
702
|
-
if (selector) {
|
|
703
|
-
var els = document.querySelectorAll(selector);
|
|
704
|
-
els.forEach(function (el) {
|
|
705
|
-
if (state) {
|
|
706
|
-
el.inert = true;
|
|
707
|
-
el.setAttribute('aria-hidden', true);
|
|
708
|
-
} else {
|
|
709
|
-
el.inert = null;
|
|
710
|
-
el.removeAttribute('aria-hidden');
|
|
711
|
-
}
|
|
712
|
-
});
|
|
713
|
-
}
|
|
714
|
-
}
|
|
715
|
-
function updateGlobalState(param, config) {
|
|
716
|
-
// Set inert state based on if a modal is active.
|
|
717
|
-
setInert(!!param, config.selectorInert);
|
|
718
|
-
|
|
719
|
-
// Set overflow state based on if a modal is active.
|
|
720
|
-
setOverflowHidden(!!param, config.selectorOverflow);
|
|
721
|
-
}
|
|
722
|
-
|
|
723
|
-
var index = {
|
|
724
|
-
__proto__: null,
|
|
725
|
-
Breakpoint: Breakpoint,
|
|
726
|
-
Collection: Collection,
|
|
727
|
-
FocusTrap: FocusTrap,
|
|
728
|
-
getConfig: getConfig$1,
|
|
729
|
-
getPrefix: getPrefix,
|
|
730
|
-
localStore: localStore,
|
|
731
|
-
teleport: teleport,
|
|
732
|
-
openTransition: openTransition,
|
|
733
|
-
closeTransition: closeTransition,
|
|
734
|
-
updateGlobalState: updateGlobalState
|
|
735
|
-
};
|
|
736
|
-
|
|
737
|
-
var defaults$3 = {
|
|
738
|
-
autoInit: false,
|
|
739
|
-
stateAttr: 'aria-checked',
|
|
740
|
-
stateValue: 'mixed'
|
|
741
|
-
};
|
|
742
|
-
|
|
743
|
-
var Checkbox = /*#__PURE__*/function () {
|
|
744
|
-
function Checkbox(options) {
|
|
745
|
-
this.defaults = defaults$3;
|
|
746
|
-
this.settings = _extends({}, this.defaults, options);
|
|
747
|
-
this.__handlerClick = this.handlerClick.bind(this);
|
|
748
|
-
if (this.settings.autoInit) this.init();
|
|
749
|
-
}
|
|
750
|
-
var _proto = Checkbox.prototype;
|
|
751
|
-
_proto.init = function init(options) {
|
|
752
|
-
if (options === void 0) {
|
|
753
|
-
options = null;
|
|
754
|
-
}
|
|
755
|
-
if (options) this.settings = _extends({}, this.settings, options);
|
|
756
|
-
var selector = "[" + this.settings.stateAttr + "=\"" + this.settings.stateValue + "\"]";
|
|
757
|
-
var mixed = document.querySelectorAll(selector);
|
|
758
|
-
this.setIndeterminate(mixed);
|
|
759
|
-
document.addEventListener('click', this.__handlerClick, false);
|
|
760
|
-
};
|
|
761
|
-
_proto.destroy = function destroy() {
|
|
762
|
-
document.removeEventListener('click', this.__handlerClick, false);
|
|
763
|
-
};
|
|
764
|
-
_proto.handlerClick = function handlerClick(event) {
|
|
765
|
-
var selector = "[" + this.settings.stateAttr + "=\"" + this.settings.stateValue + "\"]";
|
|
766
|
-
var el = event.target.closest(selector);
|
|
767
|
-
if (!el) return;
|
|
768
|
-
this.removeAriaState(el);
|
|
769
|
-
this.setIndeterminate(el);
|
|
770
|
-
};
|
|
771
|
-
_proto.setAriaState = function setAriaState(el, value) {
|
|
772
|
-
var _this = this;
|
|
773
|
-
if (value === void 0) {
|
|
774
|
-
value = this.settings.stateValue;
|
|
775
|
-
}
|
|
776
|
-
el = el.forEach ? el : [el];
|
|
777
|
-
el.forEach(function (el) {
|
|
778
|
-
el.setAttribute(_this.settings.stateAttr, value);
|
|
779
|
-
});
|
|
780
|
-
};
|
|
781
|
-
_proto.removeAriaState = function removeAriaState(el) {
|
|
782
|
-
var _this2 = this;
|
|
783
|
-
el = el.forEach ? el : [el];
|
|
784
|
-
el.forEach(function (el) {
|
|
785
|
-
el.removeAttribute(_this2.settings.stateAttr);
|
|
786
|
-
});
|
|
787
|
-
};
|
|
788
|
-
_proto.setIndeterminate = function setIndeterminate(el) {
|
|
789
|
-
var _this3 = this;
|
|
790
|
-
el = el.forEach ? el : [el];
|
|
791
|
-
el.forEach(function (el) {
|
|
792
|
-
if (el.hasAttribute(_this3.settings.stateAttr)) {
|
|
793
|
-
el.indeterminate = true;
|
|
794
|
-
} else {
|
|
795
|
-
el.indeterminate = false;
|
|
796
|
-
}
|
|
797
|
-
});
|
|
798
|
-
};
|
|
799
|
-
return Checkbox;
|
|
800
|
-
}();
|
|
801
|
-
|
|
802
|
-
var defaults$2 = {
|
|
803
|
-
autoInit: false,
|
|
804
|
-
// Data attributes
|
|
805
|
-
dataOpen: 'drawer-open',
|
|
806
|
-
dataClose: 'drawer-close',
|
|
807
|
-
dataToggle: 'drawer-toggle',
|
|
808
|
-
dataBreakpoint: 'drawer-breakpoint',
|
|
809
|
-
dataConfig: 'drawer-config',
|
|
810
|
-
// Selectors
|
|
811
|
-
selectorDrawer: '.drawer',
|
|
812
|
-
selectorDialog: '.drawer__dialog',
|
|
813
|
-
selectorFocus: '[data-focus]',
|
|
814
|
-
selectorInert: null,
|
|
815
|
-
selectorOverflow: 'body',
|
|
816
|
-
// State classes
|
|
817
|
-
stateOpened: 'is-opened',
|
|
818
|
-
stateOpening: 'is-opening',
|
|
819
|
-
stateClosing: 'is-closing',
|
|
820
|
-
stateClosed: 'is-closed',
|
|
821
|
-
// Classes
|
|
822
|
-
classModal: 'drawer_modal',
|
|
823
|
-
// Feature toggles
|
|
824
|
-
breakpoints: null,
|
|
825
|
-
customEventPrefix: 'drawer:',
|
|
826
|
-
eventListeners: true,
|
|
827
|
-
store: true,
|
|
828
|
-
storeKey: 'VB:DrawerState',
|
|
829
|
-
setTabindex: true,
|
|
830
|
-
transition: true
|
|
831
|
-
};
|
|
832
|
-
|
|
833
|
-
function handleClick$2(event) {
|
|
834
|
-
var _this = this;
|
|
835
|
-
// If an open, close or toggle button was clicked, handle the click event.
|
|
836
|
-
var trigger = event.target.closest("\n [data-" + this.settings.dataOpen + "],\n [data-" + this.settings.dataToggle + "],\n [data-" + this.settings.dataClose + "]\n ");
|
|
837
|
-
if (trigger) {
|
|
838
|
-
// Prevent the default behavior of the trigger.
|
|
839
|
-
event.preventDefault();
|
|
840
|
-
|
|
841
|
-
// If it's a toggle trigger...
|
|
842
|
-
if (trigger.matches("[data-" + this.settings.dataToggle + "]")) {
|
|
843
|
-
var selectors = trigger.getAttribute("data-" + this.settings.dataToggle).trim().split(' ');
|
|
844
|
-
selectors.forEach(function (selector) {
|
|
845
|
-
// Get the entry from collection using the attribute value.
|
|
846
|
-
var entry = _this.get(selector);
|
|
847
|
-
// Store the trigger on the entry.
|
|
848
|
-
entry.trigger = trigger;
|
|
849
|
-
// Toggle the drawer
|
|
850
|
-
entry.toggle();
|
|
851
|
-
});
|
|
852
|
-
}
|
|
853
|
-
|
|
854
|
-
// If it's a open trigger...
|
|
855
|
-
if (trigger.matches("[data-" + this.settings.dataOpen + "]")) {
|
|
856
|
-
var _selectors = trigger.getAttribute("data-" + this.settings.dataOpen).trim().split(' ');
|
|
857
|
-
_selectors.forEach(function (selector) {
|
|
858
|
-
// Get the entry from collection using the attribute value.
|
|
859
|
-
var entry = _this.get(selector);
|
|
860
|
-
// Store the trigger on the entry.
|
|
861
|
-
entry.trigger = trigger;
|
|
862
|
-
// Open the drawer.
|
|
863
|
-
entry.open();
|
|
864
|
-
});
|
|
865
|
-
}
|
|
866
|
-
|
|
867
|
-
// If it's a close trigger...
|
|
868
|
-
if (trigger.matches("[data-" + this.settings.dataClose + "]")) {
|
|
869
|
-
var _selectors2 = trigger.getAttribute("data-" + this.settings.dataClose).trim().split(' ');
|
|
870
|
-
_selectors2.forEach(function (selector) {
|
|
871
|
-
if (selector) {
|
|
872
|
-
// Get the entry from collection using the attribute value.
|
|
873
|
-
var entry = _this.get(selector);
|
|
874
|
-
// Store the trigger on the entry.
|
|
875
|
-
entry.trigger = trigger;
|
|
876
|
-
// Close the drawer.
|
|
877
|
-
entry.close();
|
|
878
|
-
} else {
|
|
879
|
-
// If no value is set on close trigger, get the parent drawer.
|
|
880
|
-
var parent = event.target.closest(_this.settings.selectorDrawer);
|
|
881
|
-
// If a parent drawer was found, close it.
|
|
882
|
-
if (parent) _this.close(parent);
|
|
883
|
-
}
|
|
884
|
-
});
|
|
885
|
-
}
|
|
886
|
-
return;
|
|
887
|
-
}
|
|
888
|
-
|
|
889
|
-
// If the modal drawer screen was clicked...
|
|
890
|
-
if (event.target.matches(this.settings.selectorDrawer)) {
|
|
891
|
-
// Close the modal drawer.
|
|
892
|
-
this.close(event.target.id);
|
|
893
|
-
}
|
|
894
|
-
}
|
|
895
|
-
function handleKeydown$2(event) {
|
|
896
|
-
if (event.key === 'Escape') {
|
|
897
|
-
var modal = this.activeModal;
|
|
898
|
-
if (modal) this.close(modal);
|
|
899
|
-
}
|
|
900
|
-
}
|
|
901
|
-
|
|
902
|
-
var deregister$2 = function deregister(obj, close) {
|
|
903
|
-
if (close === void 0) {
|
|
904
|
-
close = true;
|
|
905
|
-
}
|
|
906
|
-
try {
|
|
907
|
-
var _temp4 = function _temp4() {
|
|
908
|
-
// Return the modified collection.
|
|
909
|
-
return _this.collection;
|
|
910
|
-
};
|
|
911
|
-
var _this = this;
|
|
912
|
-
// Return collection if nothing was passed.
|
|
913
|
-
if (!obj) return Promise.resolve(_this.collection);
|
|
914
|
-
|
|
915
|
-
// Check if entry has been registered in the collection.
|
|
916
|
-
var index = _this.collection.findIndex(function (entry) {
|
|
917
|
-
return entry.id === obj.id;
|
|
918
|
-
});
|
|
919
|
-
var _temp3 = function () {
|
|
920
|
-
if (index >= 0) {
|
|
921
|
-
var _temp2 = function _temp2() {
|
|
922
|
-
// Remove entry from local store.
|
|
923
|
-
_this.store.set(_entry.id);
|
|
924
|
-
|
|
925
|
-
// Unmount the MatchMedia functionality.
|
|
926
|
-
_entry.unmountBreakpoint();
|
|
927
|
-
|
|
928
|
-
// Delete properties from collection entry.
|
|
929
|
-
Object.getOwnPropertyNames(_entry).forEach(function (prop) {
|
|
930
|
-
delete _entry[prop];
|
|
931
|
-
});
|
|
932
|
-
|
|
933
|
-
// Remove entry from collection.
|
|
934
|
-
_this.collection.splice(index, 1);
|
|
935
|
-
};
|
|
936
|
-
// Get the collection entry.
|
|
937
|
-
var _entry = _this.collection[index];
|
|
938
|
-
|
|
939
|
-
// If entry is in the opened state.
|
|
940
|
-
var _temp = function () {
|
|
941
|
-
if (close && _entry.state === 'opened') {
|
|
942
|
-
// Close the drawer.
|
|
943
|
-
return Promise.resolve(_entry.close(false)).then(function () {});
|
|
944
|
-
}
|
|
945
|
-
}();
|
|
946
|
-
return _temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp);
|
|
947
|
-
}
|
|
948
|
-
}();
|
|
949
|
-
return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(_temp4) : _temp4(_temp3));
|
|
950
|
-
} catch (e) {
|
|
951
|
-
return Promise.reject(e);
|
|
952
|
-
}
|
|
953
|
-
};
|
|
954
|
-
|
|
955
|
-
function g() {
|
|
956
|
-
return getComputedStyle(document.body).getPropertyValue("--vrembem-variable-prefix").trim();
|
|
957
|
-
}
|
|
958
|
-
|
|
959
|
-
function getBreakpoint(drawer) {
|
|
960
|
-
var prefix = g();
|
|
961
|
-
var bp = drawer.getAttribute("data-" + this.settings.dataBreakpoint);
|
|
962
|
-
if (this.settings.breakpoints && this.settings.breakpoints[bp]) {
|
|
963
|
-
return this.settings.breakpoints[bp];
|
|
964
|
-
} else if (getComputedStyle(document.body).getPropertyValue("--" + prefix + "breakpoint-" + bp).trim()) {
|
|
965
|
-
return getComputedStyle(document.body).getPropertyValue("--" + prefix + "breakpoint-" + bp).trim();
|
|
966
|
-
} else {
|
|
967
|
-
return bp;
|
|
968
|
-
}
|
|
969
|
-
}
|
|
970
|
-
|
|
971
|
-
function getDrawer(query) {
|
|
972
|
-
// Get the entry from collection.
|
|
973
|
-
var entry = typeof query === 'string' ? this.get(query) : this.get(query.id);
|
|
974
|
-
|
|
975
|
-
// Return entry if it was resolved, otherwise throw error.
|
|
976
|
-
if (entry) {
|
|
977
|
-
return entry;
|
|
978
|
-
} else {
|
|
979
|
-
throw new Error("Drawer not found in collection with id of \"" + (query.id || query) + "\".");
|
|
980
|
-
}
|
|
981
|
-
}
|
|
982
|
-
|
|
983
|
-
function getDrawerID(obj) {
|
|
984
|
-
// If it's a string, return the string.
|
|
985
|
-
if (typeof obj === 'string') {
|
|
986
|
-
return obj;
|
|
987
|
-
}
|
|
988
|
-
|
|
989
|
-
// If it's an HTML element.
|
|
990
|
-
else if (typeof obj.hasAttribute === 'function') {
|
|
991
|
-
// If it's a drawer open trigger, return data value.
|
|
992
|
-
if (obj.hasAttribute("data-" + this.settings.dataOpen)) {
|
|
993
|
-
return obj.getAttribute("data-" + this.settings.dataOpen);
|
|
994
|
-
}
|
|
995
|
-
|
|
996
|
-
// If it's a drawer close trigger, return data value or false.
|
|
997
|
-
else if (obj.hasAttribute("data-" + this.settings.dataClose)) {
|
|
998
|
-
return obj.getAttribute("data-" + this.settings.dataClose) || false;
|
|
999
|
-
}
|
|
1000
|
-
|
|
1001
|
-
// If it's a drawer toggle trigger, return data value.
|
|
1002
|
-
else if (obj.hasAttribute("data-" + this.settings.dataToggle)) {
|
|
1003
|
-
return obj.getAttribute("data-" + this.settings.dataToggle);
|
|
1004
|
-
}
|
|
1005
|
-
|
|
1006
|
-
// If it's a drawer element, return the id.
|
|
1007
|
-
else if (obj.closest(this.settings.selectorDrawer)) {
|
|
1008
|
-
obj = obj.closest(this.settings.selectorDrawer);
|
|
1009
|
-
return obj.id || false;
|
|
1010
|
-
}
|
|
1011
|
-
|
|
1012
|
-
// Return false if no id was found.
|
|
1013
|
-
else return false;
|
|
1014
|
-
}
|
|
1015
|
-
|
|
1016
|
-
// If it has an id property, return its value.
|
|
1017
|
-
else if (obj.id) {
|
|
1018
|
-
return obj.id;
|
|
1019
|
-
}
|
|
1020
|
-
|
|
1021
|
-
// Return false if no id was found.
|
|
1022
|
-
else return false;
|
|
1023
|
-
}
|
|
1024
|
-
|
|
1025
|
-
function getDrawerElements(query) {
|
|
1026
|
-
var id = getDrawerID.call(this, query);
|
|
1027
|
-
if (id) {
|
|
1028
|
-
var drawer = document.querySelector("#" + id);
|
|
1029
|
-
var dialog = drawer ? drawer.querySelector(this.settings.selectorDialog) : null;
|
|
1030
|
-
if (!drawer && !dialog) {
|
|
1031
|
-
return {
|
|
1032
|
-
error: new Error("No drawer elements found using the ID: \"" + id + "\".")
|
|
1033
|
-
};
|
|
1034
|
-
} else if (!dialog) {
|
|
1035
|
-
return {
|
|
1036
|
-
error: new Error('Drawer is missing dialog element.')
|
|
1037
|
-
};
|
|
1038
|
-
} else {
|
|
1039
|
-
return {
|
|
1040
|
-
drawer: drawer,
|
|
1041
|
-
dialog: dialog
|
|
1042
|
-
};
|
|
1043
|
-
}
|
|
1044
|
-
} else {
|
|
1045
|
-
return {
|
|
1046
|
-
error: new Error('Could not resolve the drawer ID.')
|
|
1047
|
-
};
|
|
1048
|
-
}
|
|
1049
|
-
}
|
|
1050
|
-
|
|
1051
|
-
var initialState = function initialState(entry) {
|
|
1052
|
-
try {
|
|
1053
|
-
var _this = this;
|
|
1054
|
-
var _temp2 = function () {
|
|
1055
|
-
if (_this.store.get(entry.id)) {
|
|
1056
|
-
var _temp = function () {
|
|
1057
|
-
if (_this.store.get(entry.id) === 'opened') {
|
|
1058
|
-
return Promise.resolve(entry.open(false, false)).then(function () {});
|
|
1059
|
-
} else {
|
|
1060
|
-
return Promise.resolve(entry.close(false, false)).then(function () {});
|
|
1061
|
-
}
|
|
1062
|
-
}();
|
|
1063
|
-
if (_temp && _temp.then) return _temp.then(function () {});
|
|
1064
|
-
} else if (entry.el.classList.contains(_this.settings.stateOpened)) {
|
|
1065
|
-
// Update drawer state.
|
|
1066
|
-
entry.state = 'opened';
|
|
1067
|
-
} else {
|
|
1068
|
-
// Remove transition state classes.
|
|
1069
|
-
entry.el.classList.remove(_this.settings.stateOpening);
|
|
1070
|
-
entry.el.classList.remove(_this.settings.stateClosing);
|
|
1071
|
-
// Add closed state class.
|
|
1072
|
-
entry.el.classList.add(_this.settings.stateClosed);
|
|
1073
|
-
}
|
|
1074
|
-
}();
|
|
1075
|
-
// Setup initial state using the following priority:
|
|
1076
|
-
// 1. If a store state is available, restore from local store.
|
|
1077
|
-
// 2. If opened state class is set, set state to opened.
|
|
1078
|
-
// 3. Else, initialize default state.
|
|
1079
|
-
return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
|
|
1080
|
-
} catch (e) {
|
|
1081
|
-
return Promise.reject(e);
|
|
1082
|
-
}
|
|
1083
|
-
};
|
|
1084
|
-
|
|
1085
|
-
function updateFocusState$1(entry) {
|
|
1086
|
-
// Check if there's an active modal
|
|
1087
|
-
if (entry.state === 'opened') {
|
|
1088
|
-
// Mount the focus trap on the opened drawer.
|
|
1089
|
-
if (entry.mode === 'modal') {
|
|
1090
|
-
this.focusTrap.mount(entry.dialog, this.settings.selectorFocus);
|
|
1091
|
-
} else {
|
|
1092
|
-
this.focusTrap.focus(entry.dialog, this.settings.selectorFocus);
|
|
1093
|
-
}
|
|
1094
|
-
} else {
|
|
1095
|
-
// Set focus to root trigger and unmount the focus trap.
|
|
1096
|
-
if (entry.trigger) {
|
|
1097
|
-
entry.trigger.focus();
|
|
1098
|
-
entry.trigger = null;
|
|
1099
|
-
}
|
|
1100
|
-
this.focusTrap.unmount();
|
|
1101
|
-
}
|
|
1102
|
-
}
|
|
1103
|
-
|
|
1104
|
-
var open$2 = function open(query, transition, focus) {
|
|
1105
|
-
if (focus === void 0) {
|
|
1106
|
-
focus = true;
|
|
1107
|
-
}
|
|
1108
|
-
try {
|
|
1109
|
-
var _temp2 = function _temp2() {
|
|
1110
|
-
// Set focus to the drawer element if the focus param is true.
|
|
1111
|
-
if (focus) {
|
|
1112
|
-
updateFocusState$1.call(_this, drawer);
|
|
1113
|
-
}
|
|
1114
|
-
|
|
1115
|
-
// Dispatch custom opened event.
|
|
1116
|
-
drawer.el.dispatchEvent(new CustomEvent(config.customEventPrefix + 'opened', {
|
|
1117
|
-
detail: _this,
|
|
1118
|
-
bubbles: true
|
|
1119
|
-
}));
|
|
1120
|
-
|
|
1121
|
-
// Return the drawer.
|
|
1122
|
-
return drawer;
|
|
1123
|
-
};
|
|
1124
|
-
var _this = this;
|
|
1125
|
-
// Get the drawer from collection.
|
|
1126
|
-
var drawer = getDrawer.call(_this, query);
|
|
1127
|
-
|
|
1128
|
-
// Get the modal configuration.
|
|
1129
|
-
var config = _extends({}, _this.settings, drawer.settings);
|
|
1130
|
-
|
|
1131
|
-
// Add transition parameter to configuration.
|
|
1132
|
-
if (transition !== undefined) config.transition = transition;
|
|
1133
|
-
|
|
1134
|
-
// If drawer is closed.
|
|
1135
|
-
var _temp = function () {
|
|
1136
|
-
if (drawer.state === 'closed') {
|
|
1137
|
-
// Update drawer state.
|
|
1138
|
-
drawer.state = 'opening';
|
|
1139
|
-
|
|
1140
|
-
// Run the open transition.
|
|
1141
|
-
return Promise.resolve(openTransition(drawer.el, config)).then(function () {
|
|
1142
|
-
// Update the global state if mode is modal.
|
|
1143
|
-
if (drawer.mode === 'modal') updateGlobalState(true, config);
|
|
1144
|
-
|
|
1145
|
-
// Update drawer state.
|
|
1146
|
-
drawer.state = 'opened';
|
|
1147
|
-
});
|
|
1148
|
-
}
|
|
1149
|
-
}();
|
|
1150
|
-
return Promise.resolve(_temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp));
|
|
1151
|
-
} catch (e) {
|
|
1152
|
-
return Promise.reject(e);
|
|
1153
|
-
}
|
|
1154
|
-
};
|
|
1155
|
-
|
|
1156
|
-
var close$2 = function close(query, transition, focus) {
|
|
1157
|
-
if (focus === void 0) {
|
|
1158
|
-
focus = true;
|
|
1159
|
-
}
|
|
1160
|
-
try {
|
|
1161
|
-
var _this = this;
|
|
1162
|
-
// Get the drawer from collection.
|
|
1163
|
-
var drawer = getDrawer.call(_this, query);
|
|
1164
|
-
|
|
1165
|
-
// Get the modal configuration.
|
|
1166
|
-
var config = _extends({}, _this.settings, drawer.settings);
|
|
1167
|
-
|
|
1168
|
-
// Add transition parameter to configuration.
|
|
1169
|
-
if (transition !== undefined) config.transition = transition;
|
|
1170
|
-
|
|
1171
|
-
// If drawer is opened.
|
|
1172
|
-
var _temp = function () {
|
|
1173
|
-
if (drawer.state === 'opened') {
|
|
1174
|
-
// Update drawer state.
|
|
1175
|
-
drawer.state = 'closing';
|
|
1176
|
-
|
|
1177
|
-
// Remove focus from active element.
|
|
1178
|
-
document.activeElement.blur();
|
|
1179
|
-
|
|
1180
|
-
// Run the close transition.
|
|
1181
|
-
return Promise.resolve(closeTransition(drawer.el, config)).then(function () {
|
|
1182
|
-
// Update the global state if mode is modal.
|
|
1183
|
-
if (drawer.mode === 'modal') updateGlobalState(false, config);
|
|
1184
|
-
|
|
1185
|
-
// Set focus to the trigger element if the focus param is true.
|
|
1186
|
-
if (focus) {
|
|
1187
|
-
updateFocusState$1.call(_this, drawer);
|
|
1188
|
-
}
|
|
1189
|
-
|
|
1190
|
-
// Update drawer state.
|
|
1191
|
-
drawer.state = 'closed';
|
|
1192
|
-
|
|
1193
|
-
// Dispatch custom closed event.
|
|
1194
|
-
drawer.el.dispatchEvent(new CustomEvent(config.customEventPrefix + 'closed', {
|
|
1195
|
-
detail: _this,
|
|
1196
|
-
bubbles: true
|
|
1197
|
-
}));
|
|
1198
|
-
});
|
|
1199
|
-
}
|
|
1200
|
-
}();
|
|
1201
|
-
return Promise.resolve(_temp && _temp.then ? _temp.then(function () {
|
|
1202
|
-
// Return the drawer.
|
|
1203
|
-
return drawer;
|
|
1204
|
-
}) : drawer);
|
|
1205
|
-
} catch (e) {
|
|
1206
|
-
return Promise.reject(e);
|
|
1207
|
-
}
|
|
1208
|
-
};
|
|
1209
|
-
|
|
1210
|
-
var toggle = function toggle(query, transition, focus) {
|
|
1211
|
-
try {
|
|
1212
|
-
var _this = this;
|
|
1213
|
-
// Get the drawer from collection.
|
|
1214
|
-
var drawer = getDrawer.call(_this, query);
|
|
1215
|
-
|
|
1216
|
-
// Open or close the drawer based on its current state.
|
|
1217
|
-
if (drawer.state === 'closed') {
|
|
1218
|
-
return Promise.resolve(open$2.call(_this, drawer, transition, focus));
|
|
1219
|
-
} else {
|
|
1220
|
-
return Promise.resolve(close$2.call(_this, drawer, transition, focus));
|
|
1221
|
-
}
|
|
1222
|
-
} catch (e) {
|
|
1223
|
-
return Promise.reject(e);
|
|
1224
|
-
}
|
|
1225
|
-
};
|
|
1226
|
-
|
|
1227
|
-
var toModal = function toModal(entry) {
|
|
1228
|
-
try {
|
|
1229
|
-
var _this2 = this;
|
|
1230
|
-
// Get the drawer configuration.
|
|
1231
|
-
|
|
1232
|
-
// Add the modal class.
|
|
1233
|
-
entry.el.classList.add(entry.getSetting('classModal'));
|
|
1234
|
-
|
|
1235
|
-
// Set aria-modal attribute to true.
|
|
1236
|
-
entry.dialog.setAttribute('aria-modal', 'true');
|
|
1237
|
-
|
|
1238
|
-
// If there isn't a stored state but also has the opened state class...
|
|
1239
|
-
if (!_this2.store.get(entry.id) && entry.el.classList.contains(entry.getSetting('stateOpened'))) {
|
|
1240
|
-
// Save the opened state in local store.
|
|
1241
|
-
_this2.store.set(entry.id, 'opened');
|
|
1242
|
-
}
|
|
1243
|
-
|
|
1244
|
-
// Modal drawer defaults to closed state.
|
|
1245
|
-
return Promise.resolve(close$2.call(_this2, entry, false, false)).then(function () {
|
|
1246
|
-
// Dispatch custom switch event.
|
|
1247
|
-
entry.el.dispatchEvent(new CustomEvent(entry.getSetting('customEventPrefix') + 'switchMode', {
|
|
1248
|
-
detail: _this2,
|
|
1249
|
-
bubbles: true
|
|
1250
|
-
}));
|
|
1251
|
-
|
|
1252
|
-
// Return the entry.
|
|
1253
|
-
return entry;
|
|
1254
|
-
});
|
|
1255
|
-
} catch (e) {
|
|
1256
|
-
return Promise.reject(e);
|
|
1257
|
-
}
|
|
1258
|
-
};
|
|
1259
|
-
var toInline = function toInline(entry) {
|
|
1260
|
-
try {
|
|
1261
|
-
var _this = this;
|
|
1262
|
-
// Remove the modal class.
|
|
1263
|
-
entry.el.classList.remove(entry.getSetting('classModal'));
|
|
1264
|
-
|
|
1265
|
-
// Remove the aria-modal attribute.
|
|
1266
|
-
entry.dialog.removeAttribute('aria-modal');
|
|
1267
|
-
|
|
1268
|
-
// Update the global state.
|
|
1269
|
-
updateGlobalState(false, _extends({}, _this.settings, entry.settings));
|
|
1270
|
-
|
|
1271
|
-
// Remove any focus traps.
|
|
1272
|
-
_this.focusTrap.unmount();
|
|
1273
|
-
|
|
1274
|
-
// Setup initial state.
|
|
1275
|
-
return Promise.resolve(initialState.call(_this, entry)).then(function () {
|
|
1276
|
-
// Dispatch custom switch event.
|
|
1277
|
-
entry.el.dispatchEvent(new CustomEvent(entry.getSetting('customEventPrefix') + 'switchMode', {
|
|
1278
|
-
detail: _this,
|
|
1279
|
-
bubbles: true
|
|
1280
|
-
}));
|
|
1281
|
-
|
|
1282
|
-
// Return the entry.
|
|
1283
|
-
return entry;
|
|
1284
|
-
});
|
|
1285
|
-
} catch (e) {
|
|
1286
|
-
return Promise.reject(e);
|
|
1287
|
-
}
|
|
1288
|
-
};
|
|
1289
|
-
function switchMode(entry) {
|
|
1290
|
-
switch (entry.mode) {
|
|
1291
|
-
case 'inline':
|
|
1292
|
-
return toInline.call(this, entry);
|
|
1293
|
-
case 'modal':
|
|
1294
|
-
return toModal.call(this, entry);
|
|
1295
|
-
default:
|
|
1296
|
-
throw new Error("\"" + entry.mode + "\" is not a valid drawer mode.");
|
|
1297
|
-
}
|
|
1298
|
-
}
|
|
1299
|
-
|
|
1300
|
-
var register$2 = function register(el, dialog) {
|
|
1301
|
-
try {
|
|
1302
|
-
var _this = this;
|
|
1303
|
-
// Deregister entry incase it has already been registered.
|
|
1304
|
-
return Promise.resolve(deregister$2.call(_this, el, false)).then(function () {
|
|
1305
|
-
// Save root this for use inside methods API.
|
|
1306
|
-
var root = _this;
|
|
1307
|
-
|
|
1308
|
-
// Create an instance of the Breakpoint class.
|
|
1309
|
-
var breakpoint = new Breakpoint();
|
|
1310
|
-
|
|
1311
|
-
// Setup methods API.
|
|
1312
|
-
var methods = {
|
|
1313
|
-
open: function open(transition, focus) {
|
|
1314
|
-
return open$2.call(root, this, transition, focus);
|
|
1315
|
-
},
|
|
1316
|
-
close: function close(transition, focus) {
|
|
1317
|
-
return close$2.call(root, this, transition, focus);
|
|
1318
|
-
},
|
|
1319
|
-
toggle: function toggle$1(transition, focus) {
|
|
1320
|
-
return toggle.call(root, this, transition, focus);
|
|
1321
|
-
},
|
|
1322
|
-
deregister: function deregister() {
|
|
1323
|
-
return deregister$2.call(root, this);
|
|
1324
|
-
},
|
|
1325
|
-
mountBreakpoint: function mountBreakpoint() {
|
|
1326
|
-
var value = this.breakpoint;
|
|
1327
|
-
var handler = this.handleBreakpoint.bind(this);
|
|
1328
|
-
breakpoint.mount(value, handler);
|
|
1329
|
-
return this;
|
|
1330
|
-
},
|
|
1331
|
-
unmountBreakpoint: function unmountBreakpoint() {
|
|
1332
|
-
breakpoint.unmount();
|
|
1333
|
-
return this;
|
|
1334
|
-
},
|
|
1335
|
-
handleBreakpoint: function handleBreakpoint(event) {
|
|
1336
|
-
this.mode = event.matches ? 'inline' : 'modal';
|
|
1337
|
-
return this;
|
|
1338
|
-
},
|
|
1339
|
-
getSetting: function getSetting(key) {
|
|
1340
|
-
return key in this.settings ? this.settings[key] : root.settings[key];
|
|
1341
|
-
}
|
|
1342
|
-
};
|
|
1343
|
-
|
|
1344
|
-
// Setup the drawer object.
|
|
1345
|
-
var entry = _extends({
|
|
1346
|
-
id: el.id,
|
|
1347
|
-
el: el,
|
|
1348
|
-
dialog: dialog,
|
|
1349
|
-
trigger: null,
|
|
1350
|
-
settings: getConfig$1(el, _this.settings.dataConfig),
|
|
1351
|
-
get breakpoint() {
|
|
1352
|
-
return getBreakpoint.call(root, el);
|
|
1353
|
-
},
|
|
1354
|
-
get state() {
|
|
1355
|
-
return __state;
|
|
1356
|
-
},
|
|
1357
|
-
set state(value) {
|
|
1358
|
-
__state = value;
|
|
1359
|
-
// Save 'opened' and 'closed' states to store if mode is inline.
|
|
1360
|
-
if (value === 'opened' || value === 'closed') {
|
|
1361
|
-
if (this.mode === 'inline') root.store.set(this.id, this.state);
|
|
1362
|
-
}
|
|
1363
|
-
},
|
|
1364
|
-
get mode() {
|
|
1365
|
-
return __mode;
|
|
1366
|
-
},
|
|
1367
|
-
set mode(value) {
|
|
1368
|
-
__mode = value;
|
|
1369
|
-
switchMode.call(root, this);
|
|
1370
|
-
}
|
|
1371
|
-
}, methods);
|
|
1372
|
-
|
|
1373
|
-
// Create the state var with the initial state.
|
|
1374
|
-
var __state = el.classList.contains(entry.getSetting('stateOpened')) ? 'opened' : 'closed';
|
|
1375
|
-
|
|
1376
|
-
// Create the mode var with the initial mode.
|
|
1377
|
-
var __mode = el.classList.contains(entry.getSetting('classModal')) ? 'modal' : 'inline';
|
|
1378
|
-
|
|
1379
|
-
// Setup mode specific attributes.
|
|
1380
|
-
if (entry.mode === 'modal') {
|
|
1381
|
-
// Set aria-modal attribute to true.
|
|
1382
|
-
entry.dialog.setAttribute('aria-modal', 'true');
|
|
1383
|
-
} else {
|
|
1384
|
-
// Remove the aria-modal attribute.
|
|
1385
|
-
entry.dialog.removeAttribute('aria-modal');
|
|
1386
|
-
}
|
|
1387
|
-
|
|
1388
|
-
// Set tabindex="-1" so dialog is focusable via JS or click.
|
|
1389
|
-
if (entry.getSetting('setTabindex')) {
|
|
1390
|
-
entry.dialog.setAttribute('tabindex', '-1');
|
|
1391
|
-
}
|
|
1392
|
-
|
|
1393
|
-
// Add entry to collection.
|
|
1394
|
-
_this.collection.push(entry);
|
|
1395
|
-
|
|
1396
|
-
// If the entry has a breakpoint...
|
|
1397
|
-
var _temp = function () {
|
|
1398
|
-
if (entry.breakpoint) {
|
|
1399
|
-
// Mount media query breakpoint functionality.
|
|
1400
|
-
entry.mountBreakpoint();
|
|
1401
|
-
} else {
|
|
1402
|
-
// Else, Setup initial state.
|
|
1403
|
-
return Promise.resolve(initialState.call(_this, entry)).then(function () {});
|
|
1404
|
-
}
|
|
1405
|
-
}();
|
|
1406
|
-
return _temp && _temp.then ? _temp.then(function () {
|
|
1407
|
-
// Return the registered entry.
|
|
1408
|
-
return entry;
|
|
1409
|
-
}) : entry;
|
|
1410
|
-
});
|
|
1411
|
-
} catch (e) {
|
|
1412
|
-
return Promise.reject(e);
|
|
1413
|
-
}
|
|
1414
|
-
};
|
|
1415
|
-
|
|
1416
|
-
var _handleClick$1 = /*#__PURE__*/_classPrivateFieldLooseKey("handleClick");
|
|
1417
|
-
var _handleKeydown$2 = /*#__PURE__*/_classPrivateFieldLooseKey("handleKeydown");
|
|
1418
|
-
var Drawer = /*#__PURE__*/function (_Collection) {
|
|
1419
|
-
_inheritsLoose(Drawer, _Collection);
|
|
1420
|
-
function Drawer(options) {
|
|
1421
|
-
var _this;
|
|
1422
|
-
_this = _Collection.call(this) || this;
|
|
1423
|
-
Object.defineProperty(_assertThisInitialized(_this), _handleClick$1, {
|
|
1424
|
-
writable: true,
|
|
1425
|
-
value: void 0
|
|
1426
|
-
});
|
|
1427
|
-
Object.defineProperty(_assertThisInitialized(_this), _handleKeydown$2, {
|
|
1428
|
-
writable: true,
|
|
1429
|
-
value: void 0
|
|
1430
|
-
});
|
|
1431
|
-
_this.defaults = defaults$2;
|
|
1432
|
-
_this.settings = _extends({}, _this.defaults, options);
|
|
1433
|
-
_this.focusTrap = new FocusTrap();
|
|
1434
|
-
|
|
1435
|
-
// Setup local store for inline drawer state management.
|
|
1436
|
-
_this.store = localStore(_this.settings.storeKey, _this.settings.store);
|
|
1437
|
-
_classPrivateFieldLooseBase(_assertThisInitialized(_this), _handleClick$1)[_handleClick$1] = handleClick$2.bind(_assertThisInitialized(_this));
|
|
1438
|
-
_classPrivateFieldLooseBase(_assertThisInitialized(_this), _handleKeydown$2)[_handleKeydown$2] = handleKeydown$2.bind(_assertThisInitialized(_this));
|
|
1439
|
-
if (_this.settings.autoInit) _this.init();
|
|
1440
|
-
return _this;
|
|
1441
|
-
}
|
|
1442
|
-
var _proto = Drawer.prototype;
|
|
1443
|
-
_proto.init = function init(options) {
|
|
1444
|
-
if (options === void 0) {
|
|
1445
|
-
options = null;
|
|
1446
|
-
}
|
|
1447
|
-
try {
|
|
1448
|
-
var _this2 = this;
|
|
1449
|
-
// Update settings with passed options.
|
|
1450
|
-
if (options) _this2.settings = _extends({}, _this2.settings, options);
|
|
1451
|
-
|
|
1452
|
-
// Get all the modals.
|
|
1453
|
-
var drawers = document.querySelectorAll(_this2.settings.selectorDrawer);
|
|
1454
|
-
|
|
1455
|
-
// Register the collections array with modal instances.
|
|
1456
|
-
return Promise.resolve(_this2.registerCollection(drawers)).then(function () {
|
|
1457
|
-
// If eventListeners are enabled, init event listeners.
|
|
1458
|
-
if (_this2.settings.eventListeners) {
|
|
1459
|
-
_this2.initEventListeners();
|
|
1460
|
-
}
|
|
1461
|
-
return _this2;
|
|
1462
|
-
});
|
|
1463
|
-
} catch (e) {
|
|
1464
|
-
return Promise.reject(e);
|
|
1465
|
-
}
|
|
1466
|
-
};
|
|
1467
|
-
_proto.destroy = function destroy() {
|
|
1468
|
-
try {
|
|
1469
|
-
var _this3 = this;
|
|
1470
|
-
// Remove all entries from the collection.
|
|
1471
|
-
return Promise.resolve(_this3.deregisterCollection()).then(function () {
|
|
1472
|
-
// If eventListeners are enabled, init event listeners.
|
|
1473
|
-
if (_this3.settings.eventListeners) {
|
|
1474
|
-
_this3.destroyEventListeners();
|
|
1475
|
-
}
|
|
1476
|
-
return _this3;
|
|
1477
|
-
});
|
|
1478
|
-
} catch (e) {
|
|
1479
|
-
return Promise.reject(e);
|
|
1480
|
-
}
|
|
1481
|
-
};
|
|
1482
|
-
_proto.initEventListeners = function initEventListeners() {
|
|
1483
|
-
document.addEventListener('click', _classPrivateFieldLooseBase(this, _handleClick$1)[_handleClick$1], false);
|
|
1484
|
-
document.addEventListener('keydown', _classPrivateFieldLooseBase(this, _handleKeydown$2)[_handleKeydown$2], false);
|
|
1485
|
-
};
|
|
1486
|
-
_proto.destroyEventListeners = function destroyEventListeners() {
|
|
1487
|
-
document.removeEventListener('click', _classPrivateFieldLooseBase(this, _handleClick$1)[_handleClick$1], false);
|
|
1488
|
-
document.removeEventListener('keydown', _classPrivateFieldLooseBase(this, _handleKeydown$2)[_handleKeydown$2], false);
|
|
1489
|
-
};
|
|
1490
|
-
_proto.register = function register(query) {
|
|
1491
|
-
var els = getDrawerElements.call(this, query);
|
|
1492
|
-
if (els.error) return Promise.reject(els.error);
|
|
1493
|
-
return register$2.call(this, els.drawer, els.dialog);
|
|
1494
|
-
};
|
|
1495
|
-
_proto.deregister = function deregister(query) {
|
|
1496
|
-
var entry = this.get(getDrawerID.call(this, query));
|
|
1497
|
-
return deregister$2.call(this, entry);
|
|
1498
|
-
};
|
|
1499
|
-
_proto.open = function open(id, transition, focus) {
|
|
1500
|
-
return open$2.call(this, id, transition, focus);
|
|
1501
|
-
};
|
|
1502
|
-
_proto.close = function close(id, transition, focus) {
|
|
1503
|
-
return close$2.call(this, id, transition, focus);
|
|
1504
|
-
};
|
|
1505
|
-
_proto.toggle = function toggle$1(id, transition, focus) {
|
|
1506
|
-
return toggle.call(this, id, transition, focus);
|
|
1507
|
-
};
|
|
1508
|
-
_createClass(Drawer, [{
|
|
1509
|
-
key: "activeModal",
|
|
1510
|
-
get: function get() {
|
|
1511
|
-
return this.collection.find(function (entry) {
|
|
1512
|
-
return entry.state === 'opened' && entry.mode === 'modal';
|
|
1513
|
-
});
|
|
1514
|
-
}
|
|
1515
|
-
}]);
|
|
1516
|
-
return Drawer;
|
|
1517
|
-
}(Collection);
|
|
1518
|
-
|
|
1519
|
-
var defaults$1 = {
|
|
1520
|
-
autoInit: false,
|
|
1521
|
-
// Data attributes
|
|
1522
|
-
dataOpen: 'modal-open',
|
|
1523
|
-
dataClose: 'modal-close',
|
|
1524
|
-
dataReplace: 'modal-replace',
|
|
1525
|
-
dataConfig: 'modal-config',
|
|
1526
|
-
// Selectors
|
|
1527
|
-
selectorModal: '.modal',
|
|
1528
|
-
selectorDialog: '.modal__dialog',
|
|
1529
|
-
selectorRequired: '[role="alertdialog"]',
|
|
1530
|
-
selectorFocus: '[data-focus]',
|
|
1531
|
-
selectorInert: null,
|
|
1532
|
-
selectorOverflow: 'body',
|
|
1533
|
-
// State classes
|
|
1534
|
-
stateOpened: 'is-opened',
|
|
1535
|
-
stateOpening: 'is-opening',
|
|
1536
|
-
stateClosing: 'is-closing',
|
|
1537
|
-
stateClosed: 'is-closed',
|
|
1538
|
-
// Feature settings
|
|
1539
|
-
customEventPrefix: 'modal:',
|
|
1540
|
-
eventListeners: true,
|
|
1541
|
-
teleport: null,
|
|
1542
|
-
teleportMethod: 'append',
|
|
1543
|
-
setTabindex: true,
|
|
1544
|
-
transition: true
|
|
1545
|
-
};
|
|
1546
|
-
|
|
1547
|
-
function getModal(query) {
|
|
1548
|
-
// Get the entry from collection.
|
|
1549
|
-
var entry = typeof query === 'string' ? this.get(query) : this.get(query.id);
|
|
1550
|
-
|
|
1551
|
-
// Return entry if it was resolved, otherwise throw error.
|
|
1552
|
-
if (entry) {
|
|
1553
|
-
return entry;
|
|
1554
|
-
} else {
|
|
1555
|
-
throw new Error("Modal not found in collection with id of \"" + (query.id || query) + "\".");
|
|
1556
|
-
}
|
|
1557
|
-
}
|
|
1558
|
-
|
|
1559
|
-
function getModalID(obj) {
|
|
1560
|
-
// If it's a string, return the string.
|
|
1561
|
-
if (typeof obj === 'string') {
|
|
1562
|
-
return obj;
|
|
1563
|
-
}
|
|
1564
|
-
|
|
1565
|
-
// If it's an HTML element.
|
|
1566
|
-
else if (typeof obj.hasAttribute === 'function') {
|
|
1567
|
-
// If it's a modal open trigger, return data value.
|
|
1568
|
-
if (obj.hasAttribute("data-" + this.settings.dataOpen)) {
|
|
1569
|
-
return obj.getAttribute("data-" + this.settings.dataOpen);
|
|
1570
|
-
}
|
|
1571
|
-
|
|
1572
|
-
// If it's a modal close trigger, return data value or false.
|
|
1573
|
-
else if (obj.hasAttribute("data-" + this.settings.dataClose)) {
|
|
1574
|
-
return obj.getAttribute("data-" + this.settings.dataClose) || false;
|
|
1575
|
-
}
|
|
1576
|
-
|
|
1577
|
-
// If it's a modal replace trigger, return data value.
|
|
1578
|
-
else if (obj.hasAttribute("data-" + this.settings.dataReplace)) {
|
|
1579
|
-
return obj.getAttribute("data-" + this.settings.dataReplace);
|
|
1580
|
-
}
|
|
1581
|
-
|
|
1582
|
-
// If it's a modal element, return the id.
|
|
1583
|
-
else if (obj.closest(this.settings.selectorModal)) {
|
|
1584
|
-
obj = obj.closest(this.settings.selectorModal);
|
|
1585
|
-
return obj.id || false;
|
|
1586
|
-
}
|
|
1587
|
-
|
|
1588
|
-
// Return false if no id was found.
|
|
1589
|
-
else return false;
|
|
1590
|
-
}
|
|
1591
|
-
|
|
1592
|
-
// If it has an id property, return its value.
|
|
1593
|
-
else if (obj.id) {
|
|
1594
|
-
return obj.id;
|
|
1595
|
-
}
|
|
1596
|
-
|
|
1597
|
-
// Return false if no id was found.
|
|
1598
|
-
else return false;
|
|
1599
|
-
}
|
|
1600
|
-
|
|
1601
|
-
function getModalElements(query) {
|
|
1602
|
-
var id = getModalID.call(this, query);
|
|
1603
|
-
if (id) {
|
|
1604
|
-
var modal = document.querySelector("#" + id);
|
|
1605
|
-
var dialog = modal ? modal.querySelector(this.settings.selectorDialog) : null;
|
|
1606
|
-
if (!modal && !dialog) {
|
|
1607
|
-
return {
|
|
1608
|
-
error: new Error("No modal elements found using the ID: \"" + id + "\".")
|
|
1609
|
-
};
|
|
1610
|
-
} else if (!dialog) {
|
|
1611
|
-
return {
|
|
1612
|
-
error: new Error('Modal is missing dialog element.')
|
|
1613
|
-
};
|
|
1614
|
-
} else {
|
|
1615
|
-
return {
|
|
1616
|
-
modal: modal,
|
|
1617
|
-
dialog: dialog
|
|
1618
|
-
};
|
|
1619
|
-
}
|
|
1620
|
-
} else {
|
|
1621
|
-
return {
|
|
1622
|
-
error: new Error('Could not resolve the modal ID.')
|
|
1623
|
-
};
|
|
1624
|
-
}
|
|
1625
|
-
}
|
|
1626
|
-
|
|
1627
|
-
function updateFocusState() {
|
|
1628
|
-
// Check if there's an active modal
|
|
1629
|
-
if (this.active) {
|
|
1630
|
-
// Mount the focus trap on the active modal.
|
|
1631
|
-
this.focusTrap.mount(this.active.dialog, this.settings.selectorFocus);
|
|
1632
|
-
} else {
|
|
1633
|
-
// Set focus to root trigger and unmount the focus trap.
|
|
1634
|
-
if (this.trigger) {
|
|
1635
|
-
this.trigger.focus();
|
|
1636
|
-
this.trigger = null;
|
|
1637
|
-
}
|
|
1638
|
-
this.focusTrap.unmount();
|
|
1639
|
-
}
|
|
1640
|
-
}
|
|
1641
|
-
|
|
1642
|
-
var handleClick$1 = function handleClick(event) {
|
|
1643
|
-
try {
|
|
1644
|
-
var _this = this;
|
|
1645
|
-
// If an open or replace button was clicked, open or replace the modal.
|
|
1646
|
-
var trigger = event.target.closest("[data-" + _this.settings.dataOpen + "], [data-" + _this.settings.dataReplace + "]");
|
|
1647
|
-
if (trigger) {
|
|
1648
|
-
event.preventDefault();
|
|
1649
|
-
// Save the trigger if it's not coming from inside a modal.
|
|
1650
|
-
var fromModal = event.target.closest(_this.settings.selectorModal);
|
|
1651
|
-
if (!fromModal) _this.trigger = trigger;
|
|
1652
|
-
// Get the modal.
|
|
1653
|
-
var modal = _this.get(getModalID.call(_this, trigger));
|
|
1654
|
-
// Depending on the button type, either open or replace the modal.
|
|
1655
|
-
return Promise.resolve(trigger.matches("[data-" + _this.settings.dataOpen + "]") ? modal.open() : modal.replace());
|
|
1656
|
-
}
|
|
1657
|
-
|
|
1658
|
-
// If a close button was clicked, close the modal.
|
|
1659
|
-
trigger = event.target.closest("[data-" + _this.settings.dataClose + "]");
|
|
1660
|
-
if (trigger) {
|
|
1661
|
-
event.preventDefault();
|
|
1662
|
-
// Get the value of the data attribute.
|
|
1663
|
-
var value = trigger.getAttribute("data-" + _this.settings.dataClose);
|
|
1664
|
-
// Close all if * wildcard is passed, otherwise close a single modal.
|
|
1665
|
-
return Promise.resolve(value === '*' ? _this.closeAll() : _this.close(value));
|
|
1666
|
-
}
|
|
1667
|
-
|
|
1668
|
-
// If the modal screen was clicked, close the modal.
|
|
1669
|
-
if (event.target.matches(_this.settings.selectorModal) && !event.target.querySelector(_this.settings.selectorRequired)) {
|
|
1670
|
-
return Promise.resolve(_this.close(getModalID.call(_this, event.target)));
|
|
1671
|
-
}
|
|
1672
|
-
return Promise.resolve();
|
|
1673
|
-
} catch (e) {
|
|
1674
|
-
return Promise.reject(e);
|
|
1675
|
-
}
|
|
1676
|
-
};
|
|
1677
|
-
function handleKeydown$1(event) {
|
|
1678
|
-
// If escape key was pressed.
|
|
1679
|
-
if (event.key === 'Escape') {
|
|
1680
|
-
// If a modal is opened and not required, close the modal.
|
|
1681
|
-
if (this.active && !this.active.dialog.matches(this.settings.selectorRequired)) {
|
|
1682
|
-
return this.close();
|
|
1683
|
-
}
|
|
1684
|
-
}
|
|
1685
|
-
}
|
|
1686
|
-
|
|
1687
|
-
var deregister$1 = function deregister(obj, close) {
|
|
1688
|
-
if (close === void 0) {
|
|
1689
|
-
close = true;
|
|
1690
|
-
}
|
|
1691
|
-
try {
|
|
1692
|
-
var _temp4 = function _temp4() {
|
|
1693
|
-
// Return the modified collection.
|
|
1694
|
-
return _this.collection;
|
|
1695
|
-
};
|
|
1696
|
-
var _this = this;
|
|
1697
|
-
// Return collection if nothing was passed.
|
|
1698
|
-
if (!obj) return Promise.resolve(_this.collection);
|
|
1699
|
-
|
|
1700
|
-
// Check if entry has been registered in the collection.
|
|
1701
|
-
var index = _this.collection.findIndex(function (entry) {
|
|
1702
|
-
return entry.id === obj.id;
|
|
1703
|
-
});
|
|
1704
|
-
var _temp3 = function () {
|
|
1705
|
-
if (index >= 0) {
|
|
1706
|
-
var _temp2 = function _temp2() {
|
|
1707
|
-
// Return teleported modal if a reference has been set.
|
|
1708
|
-
if (_entry.getSetting('teleport')) {
|
|
1709
|
-
_entry.teleportReturn();
|
|
1710
|
-
}
|
|
1711
|
-
|
|
1712
|
-
// Delete properties from collection entry.
|
|
1713
|
-
Object.getOwnPropertyNames(_entry).forEach(function (prop) {
|
|
1714
|
-
delete _entry[prop];
|
|
1715
|
-
});
|
|
1716
|
-
|
|
1717
|
-
// Remove entry from collection.
|
|
1718
|
-
_this.collection.splice(index, 1);
|
|
1719
|
-
};
|
|
1720
|
-
// Get the collection entry.
|
|
1721
|
-
var _entry = _this.collection[index];
|
|
1722
|
-
|
|
1723
|
-
// If entry is in the opened state, close it.
|
|
1724
|
-
var _temp = function () {
|
|
1725
|
-
if (close && _entry.state === 'opened') {
|
|
1726
|
-
return Promise.resolve(_entry.close(false)).then(function () {});
|
|
1727
|
-
} else {
|
|
1728
|
-
// Remove modal from stack.
|
|
1729
|
-
_this.stack.remove(_entry);
|
|
1730
|
-
}
|
|
1731
|
-
}();
|
|
1732
|
-
return _temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp);
|
|
1733
|
-
}
|
|
1734
|
-
}();
|
|
1735
|
-
return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(_temp4) : _temp4(_temp3));
|
|
1736
|
-
} catch (e) {
|
|
1737
|
-
return Promise.reject(e);
|
|
1738
|
-
}
|
|
1739
|
-
};
|
|
1740
|
-
|
|
1741
|
-
var open$1 = function open(query, transition, focus) {
|
|
1742
|
-
if (focus === void 0) {
|
|
1743
|
-
focus = true;
|
|
1744
|
-
}
|
|
1745
|
-
try {
|
|
1746
|
-
var _temp2 = function _temp2() {
|
|
1747
|
-
// Update focus if the focus param is true.
|
|
1748
|
-
if (focus) {
|
|
1749
|
-
updateFocusState.call(_this);
|
|
1750
|
-
}
|
|
1751
|
-
|
|
1752
|
-
// Dispatch custom opened event.
|
|
1753
|
-
modal.el.dispatchEvent(new CustomEvent(config.customEventPrefix + 'opened', {
|
|
1754
|
-
detail: _this,
|
|
1755
|
-
bubbles: true
|
|
1756
|
-
}));
|
|
1757
|
-
|
|
1758
|
-
// Return the modal.
|
|
1759
|
-
return modal;
|
|
1760
|
-
};
|
|
1761
|
-
var _this = this;
|
|
1762
|
-
// Get the modal from collection.
|
|
1763
|
-
var modal = getModal.call(_this, query);
|
|
1764
|
-
|
|
1765
|
-
// Get the modal configuration.
|
|
1766
|
-
var config = _extends({}, _this.settings, modal.settings);
|
|
1767
|
-
|
|
1768
|
-
// Add transition parameter to configuration.
|
|
1769
|
-
if (transition !== undefined) config.transition = transition;
|
|
1770
|
-
|
|
1771
|
-
// Maybe add modal to top of stack.
|
|
1772
|
-
_this.stack.moveToTop(modal);
|
|
1773
|
-
|
|
1774
|
-
// If modal is closed.
|
|
1775
|
-
var _temp = function () {
|
|
1776
|
-
if (modal.state === 'closed') {
|
|
1777
|
-
// Update modal state.
|
|
1778
|
-
modal.state = 'opening';
|
|
1779
|
-
|
|
1780
|
-
// Add modal to stack.
|
|
1781
|
-
_this.stack.add(modal);
|
|
1782
|
-
|
|
1783
|
-
// Run the open transition.
|
|
1784
|
-
return Promise.resolve(openTransition(modal.el, config)).then(function () {
|
|
1785
|
-
// Update modal state.
|
|
1786
|
-
modal.state = 'opened';
|
|
1787
|
-
});
|
|
1788
|
-
}
|
|
1789
|
-
}();
|
|
1790
|
-
return Promise.resolve(_temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp));
|
|
1791
|
-
} catch (e) {
|
|
1792
|
-
return Promise.reject(e);
|
|
1793
|
-
}
|
|
1794
|
-
};
|
|
1795
|
-
|
|
1796
|
-
var close$1 = function close(query, transition, focus) {
|
|
1797
|
-
if (focus === void 0) {
|
|
1798
|
-
focus = true;
|
|
1799
|
-
}
|
|
1800
|
-
try {
|
|
1801
|
-
var _this = this;
|
|
1802
|
-
// Get the modal from collection, or top modal in stack if no query is provided.
|
|
1803
|
-
var modal = query ? getModal.call(_this, query) : _this.active;
|
|
1804
|
-
|
|
1805
|
-
// If a modal exists and its state is opened.
|
|
1806
|
-
var _temp = function () {
|
|
1807
|
-
if (modal && modal.state === 'opened') {
|
|
1808
|
-
// Update modal state.
|
|
1809
|
-
modal.state = 'closing';
|
|
1810
|
-
|
|
1811
|
-
// Get the modal configuration.
|
|
1812
|
-
var config = _extends({}, _this.settings, modal.settings);
|
|
1813
|
-
|
|
1814
|
-
// Add transition parameter to configuration.
|
|
1815
|
-
if (transition !== undefined) config.transition = transition;
|
|
1816
|
-
|
|
1817
|
-
// Remove focus from active element.
|
|
1818
|
-
document.activeElement.blur();
|
|
1819
|
-
|
|
1820
|
-
// Run the close transition.
|
|
1821
|
-
return Promise.resolve(closeTransition(modal.el, config)).then(function () {
|
|
1822
|
-
// Remove modal from stack.
|
|
1823
|
-
_this.stack.remove(modal);
|
|
1824
|
-
|
|
1825
|
-
// Update focus if the focus param is true.
|
|
1826
|
-
if (focus) {
|
|
1827
|
-
updateFocusState.call(_this);
|
|
1828
|
-
}
|
|
1829
|
-
|
|
1830
|
-
// Update modal state.
|
|
1831
|
-
modal.state = 'closed';
|
|
1832
|
-
|
|
1833
|
-
// Dispatch custom closed event.
|
|
1834
|
-
modal.el.dispatchEvent(new CustomEvent(config.customEventPrefix + 'closed', {
|
|
1835
|
-
detail: _this,
|
|
1836
|
-
bubbles: true
|
|
1837
|
-
}));
|
|
1838
|
-
});
|
|
1839
|
-
}
|
|
1840
|
-
}();
|
|
1841
|
-
return Promise.resolve(_temp && _temp.then ? _temp.then(function () {
|
|
1842
|
-
// Return the modal.
|
|
1843
|
-
return modal;
|
|
1844
|
-
}) : modal);
|
|
1845
|
-
} catch (e) {
|
|
1846
|
-
return Promise.reject(e);
|
|
1847
|
-
}
|
|
1848
|
-
};
|
|
1849
|
-
|
|
1850
|
-
var closeAll$1 = function closeAll(exclude, transition) {
|
|
1851
|
-
try {
|
|
1852
|
-
var _this = this;
|
|
1853
|
-
var result = [];
|
|
1854
|
-
return Promise.resolve(Promise.all(_this.stack.value.map(function (modal) {
|
|
1855
|
-
try {
|
|
1856
|
-
var _temp2 = function _temp2() {
|
|
1857
|
-
modal.trigger = null;
|
|
1858
|
-
};
|
|
1859
|
-
var _temp = function () {
|
|
1860
|
-
if (exclude && exclude === modal.id) {
|
|
1861
|
-
Promise.resolve();
|
|
1862
|
-
} else {
|
|
1863
|
-
var _push = result.push;
|
|
1864
|
-
return Promise.resolve(close$1.call(_this, modal, transition, false)).then(function (_close$call) {
|
|
1865
|
-
_push.call(result, _close$call);
|
|
1866
|
-
});
|
|
1867
|
-
}
|
|
1868
|
-
}();
|
|
1869
|
-
return Promise.resolve(_temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp));
|
|
1870
|
-
} catch (e) {
|
|
1871
|
-
return Promise.reject(e);
|
|
1872
|
-
}
|
|
1873
|
-
}))).then(function () {
|
|
1874
|
-
return result;
|
|
1875
|
-
});
|
|
1876
|
-
} catch (e) {
|
|
1877
|
-
return Promise.reject(e);
|
|
1878
|
-
}
|
|
1879
|
-
};
|
|
1880
|
-
|
|
1881
|
-
var replace = function replace(query, transition, focus) {
|
|
1882
|
-
if (focus === void 0) {
|
|
1883
|
-
focus = true;
|
|
1884
|
-
}
|
|
1885
|
-
try {
|
|
1886
|
-
var _temp2 = function _temp2() {
|
|
1887
|
-
// Update focus if the focus param is true.
|
|
1888
|
-
if (focus) {
|
|
1889
|
-
updateFocusState.call(_this);
|
|
1890
|
-
}
|
|
1891
|
-
|
|
1892
|
-
// Return the modals there were opened and closed.
|
|
1893
|
-
return {
|
|
1894
|
-
opened: resultOpened,
|
|
1895
|
-
closed: resultClosed
|
|
1896
|
-
};
|
|
1897
|
-
};
|
|
1898
|
-
var _this = this;
|
|
1899
|
-
// Get the modal from collection.
|
|
1900
|
-
var modal = getModal.call(_this, query);
|
|
1901
|
-
|
|
1902
|
-
// Setup results for return.
|
|
1903
|
-
var resultOpened, resultClosed;
|
|
1904
|
-
var _temp = function () {
|
|
1905
|
-
if (modal.state === 'opened') {
|
|
1906
|
-
// If modal is open, close all modals except for replacement.
|
|
1907
|
-
resultOpened = modal;
|
|
1908
|
-
return Promise.resolve(closeAll$1.call(_this, modal.id, transition)).then(function (_closeAll$call) {
|
|
1909
|
-
resultClosed = _closeAll$call;
|
|
1910
|
-
});
|
|
1911
|
-
} else {
|
|
1912
|
-
// If modal is closed, close all and open replacement at the same time.
|
|
1913
|
-
resultOpened = open$1.call(_this, modal, transition, false);
|
|
1914
|
-
resultClosed = closeAll$1.call(_this, false, transition);
|
|
1915
|
-
return Promise.resolve(Promise.all([resultOpened, resultClosed])).then(function () {});
|
|
1916
|
-
}
|
|
1917
|
-
}();
|
|
1918
|
-
return Promise.resolve(_temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp));
|
|
1919
|
-
} catch (e) {
|
|
1920
|
-
return Promise.reject(e);
|
|
1921
|
-
}
|
|
1922
|
-
};
|
|
1923
|
-
|
|
1924
|
-
var register$1 = function register(el, dialog) {
|
|
1925
|
-
try {
|
|
1926
|
-
var _this = this;
|
|
1927
|
-
// Deregister entry incase it has already been registered.
|
|
1928
|
-
return Promise.resolve(deregister$1.call(_this, el, false)).then(function () {
|
|
1929
|
-
// Save root this for use inside methods API.
|
|
1930
|
-
var root = _this;
|
|
1931
|
-
|
|
1932
|
-
// Setup methods API.
|
|
1933
|
-
var methods = {
|
|
1934
|
-
open: function open(transition, focus) {
|
|
1935
|
-
return open$1.call(root, this, transition, focus);
|
|
1936
|
-
},
|
|
1937
|
-
close: function close(transition, focus) {
|
|
1938
|
-
return close$1.call(root, this, transition, focus);
|
|
1939
|
-
},
|
|
1940
|
-
replace: function replace$1(transition, focus) {
|
|
1941
|
-
return replace.call(root, this, transition, focus);
|
|
1942
|
-
},
|
|
1943
|
-
deregister: function deregister() {
|
|
1944
|
-
return deregister$1.call(root, this);
|
|
1945
|
-
},
|
|
1946
|
-
teleport: function teleport$1(ref, method) {
|
|
1947
|
-
if (ref === void 0) {
|
|
1948
|
-
ref = this.getSetting('teleport');
|
|
1949
|
-
}
|
|
1950
|
-
if (method === void 0) {
|
|
1951
|
-
method = this.getSetting('teleportMethod');
|
|
1952
|
-
}
|
|
1953
|
-
if (!this.returnRef) {
|
|
1954
|
-
this.returnRef = teleport(this.el, ref, method);
|
|
1955
|
-
return this.el;
|
|
1956
|
-
} else {
|
|
1957
|
-
console.error('Element has already been teleported:', this.el);
|
|
1958
|
-
return false;
|
|
1959
|
-
}
|
|
1960
|
-
},
|
|
1961
|
-
teleportReturn: function teleportReturn() {
|
|
1962
|
-
if (this.returnRef) {
|
|
1963
|
-
this.returnRef = teleport(this.el, this.returnRef);
|
|
1964
|
-
return this.el;
|
|
1965
|
-
} else {
|
|
1966
|
-
console.error('No return reference found:', this.el);
|
|
1967
|
-
return false;
|
|
1968
|
-
}
|
|
1969
|
-
},
|
|
1970
|
-
getSetting: function getSetting(key) {
|
|
1971
|
-
return key in this.settings ? this.settings[key] : root.settings[key];
|
|
1972
|
-
}
|
|
1973
|
-
};
|
|
1974
|
-
|
|
1975
|
-
// Setup the modal object.
|
|
1976
|
-
var entry = _extends({
|
|
1977
|
-
id: el.id,
|
|
1978
|
-
state: 'closed',
|
|
1979
|
-
el: el,
|
|
1980
|
-
dialog: dialog,
|
|
1981
|
-
returnRef: null,
|
|
1982
|
-
settings: getConfig$1(el, _this.settings.dataConfig)
|
|
1983
|
-
}, methods);
|
|
1984
|
-
|
|
1985
|
-
// Set aria-modal attribute to true.
|
|
1986
|
-
entry.dialog.setAttribute('aria-modal', 'true');
|
|
1987
|
-
|
|
1988
|
-
// If a role attribute is not set, set it to "dialog" as the default.
|
|
1989
|
-
if (!entry.dialog.hasAttribute('role')) {
|
|
1990
|
-
entry.dialog.setAttribute('role', 'dialog');
|
|
1991
|
-
}
|
|
1992
|
-
|
|
1993
|
-
// Set tabindex="-1" so dialog is focusable via JS or click.
|
|
1994
|
-
if (entry.getSetting('setTabindex')) {
|
|
1995
|
-
entry.dialog.setAttribute('tabindex', '-1');
|
|
1996
|
-
}
|
|
1997
|
-
|
|
1998
|
-
// Teleport modal if a reference has been set.
|
|
1999
|
-
if (entry.getSetting('teleport')) {
|
|
2000
|
-
entry.teleport();
|
|
2001
|
-
}
|
|
2002
|
-
|
|
2003
|
-
// Add entry to collection.
|
|
2004
|
-
_this.collection.push(entry);
|
|
2005
|
-
|
|
2006
|
-
// Setup initial state.
|
|
2007
|
-
var _temp = function () {
|
|
2008
|
-
if (entry.el.classList.contains(_this.settings.stateOpened)) {
|
|
2009
|
-
// Open entry with transitions disabled.
|
|
2010
|
-
return Promise.resolve(entry.open(false)).then(function () {});
|
|
2011
|
-
} else {
|
|
2012
|
-
// Remove transition state classes.
|
|
2013
|
-
entry.el.classList.remove(_this.settings.stateOpening);
|
|
2014
|
-
entry.el.classList.remove(_this.settings.stateClosing);
|
|
2015
|
-
// Add closed state class.
|
|
2016
|
-
entry.el.classList.add(_this.settings.stateClosed);
|
|
2017
|
-
}
|
|
2018
|
-
}();
|
|
2019
|
-
return _temp && _temp.then ? _temp.then(function () {
|
|
2020
|
-
// Return the registered entry.
|
|
2021
|
-
return entry;
|
|
2022
|
-
}) : entry;
|
|
2023
|
-
});
|
|
2024
|
-
} catch (e) {
|
|
2025
|
-
return Promise.reject(e);
|
|
2026
|
-
}
|
|
2027
|
-
};
|
|
2028
|
-
|
|
2029
|
-
function stack(settings) {
|
|
2030
|
-
var stackArray = [];
|
|
2031
|
-
return {
|
|
2032
|
-
get value() {
|
|
2033
|
-
return [].concat(stackArray);
|
|
2034
|
-
},
|
|
2035
|
-
get top() {
|
|
2036
|
-
return stackArray[stackArray.length - 1];
|
|
2037
|
-
},
|
|
2038
|
-
updateIndex: function updateIndex() {
|
|
2039
|
-
stackArray.forEach(function (entry, index) {
|
|
2040
|
-
entry.el.style.zIndex = null;
|
|
2041
|
-
var value = getComputedStyle(entry.el)['z-index'];
|
|
2042
|
-
entry.el.style.zIndex = parseInt(value) + index + 1;
|
|
2043
|
-
});
|
|
2044
|
-
},
|
|
2045
|
-
updateGlobalState: function updateGlobalState$1() {
|
|
2046
|
-
updateGlobalState(this.top, settings);
|
|
2047
|
-
this.updateIndex();
|
|
2048
|
-
},
|
|
2049
|
-
add: function add(entry) {
|
|
2050
|
-
// Apply z-index styles based on stack length.
|
|
2051
|
-
entry.el.style.zIndex = null;
|
|
2052
|
-
var value = getComputedStyle(entry.el)['z-index'];
|
|
2053
|
-
entry.el.style.zIndex = parseInt(value) + stackArray.length + 1;
|
|
2054
|
-
|
|
2055
|
-
// Move back to end of stack.
|
|
2056
|
-
stackArray.push(entry);
|
|
2057
|
-
|
|
2058
|
-
// Update the global state.
|
|
2059
|
-
this.updateGlobalState();
|
|
2060
|
-
},
|
|
2061
|
-
remove: function remove(entry) {
|
|
2062
|
-
// Get the index of the entry.
|
|
2063
|
-
var index = stackArray.findIndex(function (item) {
|
|
2064
|
-
return item.id === entry.id;
|
|
2065
|
-
});
|
|
2066
|
-
|
|
2067
|
-
// If entry is in stack...
|
|
2068
|
-
if (index >= 0) {
|
|
2069
|
-
// Remove z-index styles.
|
|
2070
|
-
entry.el.style.zIndex = null;
|
|
2071
|
-
|
|
2072
|
-
// Remove entry from stack array.
|
|
2073
|
-
stackArray.splice(index, 1);
|
|
2074
|
-
|
|
2075
|
-
// Update the global state.
|
|
2076
|
-
this.updateGlobalState();
|
|
2077
|
-
}
|
|
2078
|
-
},
|
|
2079
|
-
moveToTop: function moveToTop(entry) {
|
|
2080
|
-
// Get the index of the entry.
|
|
2081
|
-
var index = stackArray.findIndex(function (item) {
|
|
2082
|
-
return item.id === entry.id;
|
|
2083
|
-
});
|
|
2084
|
-
|
|
2085
|
-
// If entry is in stack...
|
|
2086
|
-
if (index >= 0) {
|
|
2087
|
-
// Remove entry from stack array.
|
|
2088
|
-
stackArray.splice(index, 1);
|
|
2089
|
-
|
|
2090
|
-
// Add entry back to top of stack.
|
|
2091
|
-
this.add(entry);
|
|
2092
|
-
}
|
|
2093
|
-
}
|
|
2094
|
-
};
|
|
2095
|
-
}
|
|
2096
|
-
|
|
2097
|
-
var _handleClick = /*#__PURE__*/_classPrivateFieldLooseKey("handleClick");
|
|
2098
|
-
var _handleKeydown$1 = /*#__PURE__*/_classPrivateFieldLooseKey("handleKeydown");
|
|
2099
|
-
var Modal = /*#__PURE__*/function (_Collection) {
|
|
2100
|
-
_inheritsLoose(Modal, _Collection);
|
|
2101
|
-
function Modal(options) {
|
|
2102
|
-
var _this;
|
|
2103
|
-
_this = _Collection.call(this) || this;
|
|
2104
|
-
Object.defineProperty(_assertThisInitialized(_this), _handleClick, {
|
|
2105
|
-
writable: true,
|
|
2106
|
-
value: void 0
|
|
2107
|
-
});
|
|
2108
|
-
Object.defineProperty(_assertThisInitialized(_this), _handleKeydown$1, {
|
|
2109
|
-
writable: true,
|
|
2110
|
-
value: void 0
|
|
2111
|
-
});
|
|
2112
|
-
_this.defaults = defaults$1;
|
|
2113
|
-
_this.settings = _extends({}, _this.defaults, options);
|
|
2114
|
-
_this.trigger = null;
|
|
2115
|
-
_this.focusTrap = new FocusTrap();
|
|
2116
|
-
|
|
2117
|
-
// Setup stack module.
|
|
2118
|
-
_this.stack = stack(_this.settings);
|
|
2119
|
-
_classPrivateFieldLooseBase(_assertThisInitialized(_this), _handleClick)[_handleClick] = handleClick$1.bind(_assertThisInitialized(_this));
|
|
2120
|
-
_classPrivateFieldLooseBase(_assertThisInitialized(_this), _handleKeydown$1)[_handleKeydown$1] = handleKeydown$1.bind(_assertThisInitialized(_this));
|
|
2121
|
-
if (_this.settings.autoInit) _this.init();
|
|
2122
|
-
return _this;
|
|
2123
|
-
}
|
|
2124
|
-
var _proto = Modal.prototype;
|
|
2125
|
-
_proto.init = function init(options) {
|
|
2126
|
-
try {
|
|
2127
|
-
var _this2 = this;
|
|
2128
|
-
// Update settings with passed options.
|
|
2129
|
-
if (options) _this2.settings = _extends({}, _this2.settings, options);
|
|
2130
|
-
|
|
2131
|
-
// Get all the modals.
|
|
2132
|
-
var modals = document.querySelectorAll(_this2.settings.selectorModal);
|
|
2133
|
-
|
|
2134
|
-
// Register the collections array with modal instances.
|
|
2135
|
-
return Promise.resolve(_this2.registerCollection(modals)).then(function () {
|
|
2136
|
-
// If eventListeners are enabled, init event listeners.
|
|
2137
|
-
if (_this2.settings.eventListeners) {
|
|
2138
|
-
_this2.initEventListeners();
|
|
2139
|
-
}
|
|
2140
|
-
return _this2;
|
|
2141
|
-
});
|
|
2142
|
-
} catch (e) {
|
|
2143
|
-
return Promise.reject(e);
|
|
2144
|
-
}
|
|
2145
|
-
};
|
|
2146
|
-
_proto.destroy = function destroy() {
|
|
2147
|
-
try {
|
|
2148
|
-
var _this3 = this;
|
|
2149
|
-
// Clear stored trigger.
|
|
2150
|
-
_this3.trigger = null;
|
|
2151
|
-
|
|
2152
|
-
// Remove all entries from the collection.
|
|
2153
|
-
return Promise.resolve(_this3.deregisterCollection()).then(function () {
|
|
2154
|
-
// If eventListeners are enabled, destroy event listeners.
|
|
2155
|
-
if (_this3.settings.eventListeners) {
|
|
2156
|
-
_this3.destroyEventListeners();
|
|
2157
|
-
}
|
|
2158
|
-
return _this3;
|
|
2159
|
-
});
|
|
2160
|
-
} catch (e) {
|
|
2161
|
-
return Promise.reject(e);
|
|
2162
|
-
}
|
|
2163
|
-
};
|
|
2164
|
-
_proto.initEventListeners = function initEventListeners() {
|
|
2165
|
-
document.addEventListener('click', _classPrivateFieldLooseBase(this, _handleClick)[_handleClick], false);
|
|
2166
|
-
document.addEventListener('keydown', _classPrivateFieldLooseBase(this, _handleKeydown$1)[_handleKeydown$1], false);
|
|
2167
|
-
};
|
|
2168
|
-
_proto.destroyEventListeners = function destroyEventListeners() {
|
|
2169
|
-
document.removeEventListener('click', _classPrivateFieldLooseBase(this, _handleClick)[_handleClick], false);
|
|
2170
|
-
document.removeEventListener('keydown', _classPrivateFieldLooseBase(this, _handleKeydown$1)[_handleKeydown$1], false);
|
|
2171
|
-
};
|
|
2172
|
-
_proto.register = function register(query) {
|
|
2173
|
-
var els = getModalElements.call(this, query);
|
|
2174
|
-
if (els.error) return Promise.reject(els.error);
|
|
2175
|
-
return register$1.call(this, els.modal, els.dialog);
|
|
2176
|
-
};
|
|
2177
|
-
_proto.deregister = function deregister(query) {
|
|
2178
|
-
var modal = this.get(getModalID.call(this, query));
|
|
2179
|
-
return deregister$1.call(this, modal);
|
|
2180
|
-
};
|
|
2181
|
-
_proto.open = function open(id, transition, focus) {
|
|
2182
|
-
return open$1.call(this, id, transition, focus);
|
|
2183
|
-
};
|
|
2184
|
-
_proto.close = function close(id, transition, focus) {
|
|
2185
|
-
return close$1.call(this, id, transition, focus);
|
|
2186
|
-
};
|
|
2187
|
-
_proto.replace = function replace$1(id, transition, focus) {
|
|
2188
|
-
return replace.call(this, id, transition, focus);
|
|
2189
|
-
};
|
|
2190
|
-
_proto.closeAll = function closeAll(exclude, transition, focus) {
|
|
2191
|
-
if (exclude === void 0) {
|
|
2192
|
-
exclude = false;
|
|
2193
|
-
}
|
|
2194
|
-
if (focus === void 0) {
|
|
2195
|
-
focus = true;
|
|
2196
|
-
}
|
|
2197
|
-
try {
|
|
2198
|
-
var _this4 = this;
|
|
2199
|
-
return Promise.resolve(closeAll$1.call(_this4, exclude, transition)).then(function (result) {
|
|
2200
|
-
// Update focus if the focus param is true.
|
|
2201
|
-
if (focus) {
|
|
2202
|
-
updateFocusState.call(_this4);
|
|
2203
|
-
}
|
|
2204
|
-
return result;
|
|
2205
|
-
});
|
|
2206
|
-
} catch (e) {
|
|
2207
|
-
return Promise.reject(e);
|
|
2208
|
-
}
|
|
2209
|
-
};
|
|
2210
|
-
_createClass(Modal, [{
|
|
2211
|
-
key: "active",
|
|
2212
|
-
get: function get() {
|
|
2213
|
-
return this.stack.top;
|
|
2214
|
-
}
|
|
2215
|
-
}]);
|
|
2216
|
-
return Modal;
|
|
2217
|
-
}(Collection);
|
|
2218
|
-
|
|
2219
|
-
var defaults = {
|
|
2220
|
-
autoInit: false,
|
|
2221
|
-
// Selectors
|
|
2222
|
-
selectorPopover: '.popover',
|
|
2223
|
-
selectorArrow: '.popover__arrow',
|
|
2224
|
-
// State classes
|
|
2225
|
-
stateActive: 'is-active',
|
|
2226
|
-
// Feature settings
|
|
2227
|
-
eventListeners: true,
|
|
2228
|
-
eventType: 'click',
|
|
2229
|
-
placement: 'bottom'
|
|
2230
|
-
};
|
|
2231
|
-
|
|
2232
|
-
function getConfig(el, settings) {
|
|
2233
|
-
// Get the computed styles of the element.
|
|
2234
|
-
var styles = getComputedStyle(el);
|
|
2235
|
-
|
|
2236
|
-
// Setup the config obj with default values.
|
|
2237
|
-
var config = {
|
|
2238
|
-
'placement': settings.placement,
|
|
2239
|
-
'event': settings.eventType,
|
|
2240
|
-
'offset': 0,
|
|
2241
|
-
'overflow-padding': 0,
|
|
2242
|
-
'flip-padding': 0,
|
|
2243
|
-
'arrow-element': settings.selectorArrow,
|
|
2244
|
-
'arrow-padding': 0
|
|
2245
|
-
};
|
|
2246
|
-
|
|
2247
|
-
// Loop through config obj.
|
|
2248
|
-
for (var prop in config) {
|
|
2249
|
-
// Get the CSS variable property values.
|
|
2250
|
-
var prefix = g();
|
|
2251
|
-
var value = styles.getPropertyValue("--" + prefix + "popover-" + prop).trim();
|
|
2252
|
-
|
|
2253
|
-
// If a value was found, replace the default in config obj.
|
|
2254
|
-
if (value) {
|
|
2255
|
-
config[prop] = value;
|
|
2256
|
-
}
|
|
2257
|
-
}
|
|
2258
|
-
|
|
2259
|
-
// Return the config obj.
|
|
2260
|
-
return config;
|
|
2261
|
-
}
|
|
2262
|
-
|
|
2263
|
-
function getPadding(value) {
|
|
2264
|
-
var padding;
|
|
2265
|
-
|
|
2266
|
-
// Split the value by spaces if it's a string.
|
|
2267
|
-
var array = typeof value === 'string' ? value.trim().split(' ') : [value];
|
|
2268
|
-
|
|
2269
|
-
// Convert individual values to integers.
|
|
2270
|
-
array.forEach(function (item, index) {
|
|
2271
|
-
array[index] = parseInt(item, 10);
|
|
2272
|
-
});
|
|
2273
|
-
|
|
2274
|
-
// Build the padding object based on the number of values passed.
|
|
2275
|
-
switch (array.length) {
|
|
2276
|
-
case 1:
|
|
2277
|
-
padding = array[0];
|
|
2278
|
-
break;
|
|
2279
|
-
case 2:
|
|
2280
|
-
padding = {
|
|
2281
|
-
top: array[0],
|
|
2282
|
-
right: array[1],
|
|
2283
|
-
bottom: array[0],
|
|
2284
|
-
left: array[1]
|
|
2285
|
-
};
|
|
2286
|
-
break;
|
|
2287
|
-
case 3:
|
|
2288
|
-
padding = {
|
|
2289
|
-
top: array[0],
|
|
2290
|
-
right: array[1],
|
|
2291
|
-
bottom: array[2],
|
|
2292
|
-
left: array[1]
|
|
2293
|
-
};
|
|
2294
|
-
break;
|
|
2295
|
-
case 4:
|
|
2296
|
-
padding = {
|
|
2297
|
-
top: array[0],
|
|
2298
|
-
right: array[1],
|
|
2299
|
-
bottom: array[2],
|
|
2300
|
-
left: array[3]
|
|
2301
|
-
};
|
|
2302
|
-
break;
|
|
2303
|
-
default:
|
|
2304
|
-
padding = false;
|
|
2305
|
-
break;
|
|
2306
|
-
}
|
|
2307
|
-
|
|
2308
|
-
// Return the padding object.
|
|
2309
|
-
return padding;
|
|
2310
|
-
}
|
|
2311
|
-
|
|
2312
|
-
function getModifiers(options) {
|
|
2313
|
-
return [{
|
|
2314
|
-
name: 'offset',
|
|
2315
|
-
options: {
|
|
2316
|
-
offset: [0, parseInt(options['offset'], 10)]
|
|
2317
|
-
}
|
|
2318
|
-
}, {
|
|
2319
|
-
name: 'preventOverflow',
|
|
2320
|
-
options: {
|
|
2321
|
-
padding: getPadding(options['overflow-padding'])
|
|
2322
|
-
}
|
|
2323
|
-
}, {
|
|
2324
|
-
name: 'flip',
|
|
2325
|
-
options: {
|
|
2326
|
-
padding: getPadding(options['flip-padding'])
|
|
2327
|
-
}
|
|
2328
|
-
}, {
|
|
2329
|
-
name: 'arrow',
|
|
2330
|
-
options: {
|
|
2331
|
-
element: options['arrow-element'],
|
|
2332
|
-
padding: getPadding(options['arrow-padding'])
|
|
2333
|
-
}
|
|
2334
|
-
}];
|
|
2335
|
-
}
|
|
2336
|
-
|
|
2337
|
-
function getPopover(query) {
|
|
2338
|
-
// Get the entry from collection.
|
|
2339
|
-
var entry = typeof query === 'string' ? this.get(query) : this.get(query.id);
|
|
2340
|
-
|
|
2341
|
-
// Return entry if it was resolved, otherwise throw error.
|
|
2342
|
-
if (entry) {
|
|
2343
|
-
return entry;
|
|
2344
|
-
} else {
|
|
2345
|
-
throw new Error("Popover not found in collection with id of \"" + query + "\".");
|
|
2346
|
-
}
|
|
2347
|
-
}
|
|
2348
|
-
|
|
2349
|
-
function getPopoverID(obj) {
|
|
2350
|
-
// If it's a string, return the string.
|
|
2351
|
-
if (typeof obj === 'string') {
|
|
2352
|
-
return obj;
|
|
2353
|
-
}
|
|
2354
|
-
|
|
2355
|
-
// If it's an HTML element.
|
|
2356
|
-
else if (typeof obj.hasAttribute === 'function') {
|
|
2357
|
-
// If it's a popover element, return the id.
|
|
2358
|
-
if (obj.closest(this.settings.selectorPopover)) {
|
|
2359
|
-
obj = obj.closest(this.settings.selectorPopover);
|
|
2360
|
-
return obj.id;
|
|
2361
|
-
}
|
|
2362
|
-
|
|
2363
|
-
// If it's a popover trigger, return value of aria-controls.
|
|
2364
|
-
else if (obj.hasAttribute('aria-controls')) {
|
|
2365
|
-
return obj.getAttribute('aria-controls');
|
|
2366
|
-
}
|
|
2367
|
-
|
|
2368
|
-
// If it's a popover tooltip trigger, return the value of aria-describedby.
|
|
2369
|
-
else if (obj.hasAttribute('aria-describedby')) {
|
|
2370
|
-
return obj.getAttribute('aria-describedby');
|
|
2371
|
-
}
|
|
2372
|
-
|
|
2373
|
-
// Return false if no id was found.
|
|
2374
|
-
else return false;
|
|
2375
|
-
}
|
|
2376
|
-
|
|
2377
|
-
// If it has an id property, return its value.
|
|
2378
|
-
else if (obj.id) {
|
|
2379
|
-
return obj.id;
|
|
2380
|
-
}
|
|
2381
|
-
|
|
2382
|
-
// Return false if no id was found.
|
|
2383
|
-
else return false;
|
|
2384
|
-
}
|
|
2385
|
-
|
|
2386
|
-
function getPopoverElements(query) {
|
|
2387
|
-
var id = getPopoverID.call(this, query);
|
|
2388
|
-
if (id) {
|
|
2389
|
-
var popover = document.querySelector("#" + id);
|
|
2390
|
-
var trigger = document.querySelector("[aria-controls=\"" + id + "\"]") || document.querySelector("[aria-describedby=\"" + id + "\"]");
|
|
2391
|
-
if (!trigger && !popover) {
|
|
2392
|
-
return {
|
|
2393
|
-
error: new Error("No popover elements found using the ID: \"" + id + "\".")
|
|
2394
|
-
};
|
|
2395
|
-
} else if (!trigger) {
|
|
2396
|
-
return {
|
|
2397
|
-
error: new Error('No popover trigger associated with the provided popover.')
|
|
2398
|
-
};
|
|
2399
|
-
} else if (!popover) {
|
|
2400
|
-
return {
|
|
2401
|
-
error: new Error('No popover associated with the provided popover trigger.')
|
|
2402
|
-
};
|
|
2403
|
-
} else {
|
|
2404
|
-
return {
|
|
2405
|
-
popover: popover,
|
|
2406
|
-
trigger: trigger
|
|
2407
|
-
};
|
|
2408
|
-
}
|
|
2409
|
-
} else {
|
|
2410
|
-
return {
|
|
2411
|
-
error: new Error('Could not resolve the popover ID.')
|
|
2412
|
-
};
|
|
2413
|
-
}
|
|
2414
|
-
}
|
|
2415
|
-
|
|
2416
|
-
var closeAll = function closeAll() {
|
|
2417
|
-
try {
|
|
2418
|
-
var _this2 = this;
|
|
2419
|
-
var result = [];
|
|
2420
|
-
return Promise.resolve(Promise.all(_this2.collection.map(function (popover) {
|
|
2421
|
-
try {
|
|
2422
|
-
var _temp2 = function () {
|
|
2423
|
-
if (popover.state === 'opened') {
|
|
2424
|
-
var _push = result.push;
|
|
2425
|
-
return Promise.resolve(close.call(_this2, popover)).then(function (_close$call) {
|
|
2426
|
-
_push.call(result, _close$call);
|
|
2427
|
-
});
|
|
2428
|
-
}
|
|
2429
|
-
}();
|
|
2430
|
-
return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
|
|
2431
|
-
} catch (e) {
|
|
2432
|
-
return Promise.reject(e);
|
|
2433
|
-
}
|
|
2434
|
-
}))).then(function () {
|
|
2435
|
-
return result;
|
|
2436
|
-
});
|
|
2437
|
-
} catch (e) {
|
|
2438
|
-
return Promise.reject(e);
|
|
2439
|
-
}
|
|
2440
|
-
};
|
|
2441
|
-
var close = function close(query) {
|
|
2442
|
-
try {
|
|
2443
|
-
var _temp = function _temp(popover) {
|
|
2444
|
-
// If a modal exists and its state is opened.
|
|
2445
|
-
if (popover && popover.state === 'opened') {
|
|
2446
|
-
// Update state class.
|
|
2447
|
-
popover.el.classList.remove(_this.settings.stateActive);
|
|
2448
|
-
|
|
2449
|
-
// Update accessibility attribute(s).
|
|
2450
|
-
if (popover.trigger.hasAttribute('aria-controls')) {
|
|
2451
|
-
popover.trigger.setAttribute('aria-expanded', 'false');
|
|
2452
|
-
}
|
|
2453
|
-
|
|
2454
|
-
// Disable popper event listeners.
|
|
2455
|
-
popover.popper.setOptions({
|
|
2456
|
-
modifiers: [{
|
|
2457
|
-
name: 'eventListeners',
|
|
2458
|
-
enabled: false
|
|
2459
|
-
}]
|
|
2460
|
-
});
|
|
2461
|
-
|
|
2462
|
-
// Update popover state.
|
|
2463
|
-
popover.state = 'closed';
|
|
2464
|
-
|
|
2465
|
-
// Clear root trigger if popover trigger matches.
|
|
2466
|
-
if (popover.trigger === _this.trigger) {
|
|
2467
|
-
_this.trigger = null;
|
|
2468
|
-
}
|
|
2469
|
-
}
|
|
2470
|
-
|
|
2471
|
-
// Return the popover.
|
|
2472
|
-
return popover;
|
|
2473
|
-
};
|
|
2474
|
-
var _this = this;
|
|
2475
|
-
// Get the popover from collection.
|
|
2476
|
-
return Promise.resolve(query ? _temp(getPopover.call(_this, query)) : Promise.resolve(closeAll.call(_this)).then(_temp));
|
|
2477
|
-
} catch (e) {
|
|
2478
|
-
return Promise.reject(e);
|
|
2479
|
-
}
|
|
2480
|
-
};
|
|
2481
|
-
function closeCheck(popover) {
|
|
2482
|
-
// Only run closeCheck if provided popover is currently open.
|
|
2483
|
-
if (popover.state != 'opened') return;
|
|
2484
|
-
|
|
2485
|
-
// Needed to correctly check which element is currently being focused.
|
|
2486
|
-
setTimeout(function () {
|
|
2487
|
-
// Check if trigger or element are being hovered.
|
|
2488
|
-
var isHovered = popover.el.closest(':hover') === popover.el || popover.trigger.closest(':hover') === popover.trigger;
|
|
2489
|
-
|
|
2490
|
-
// Check if trigger or element are being focused.
|
|
2491
|
-
var isFocused = document.activeElement.closest("#" + popover.id + ", [aria-controls=\"" + popover.id + "\"], [aria-describedby=\"" + popover.id + "\"]");
|
|
2492
|
-
|
|
2493
|
-
// Close if the trigger and element are not currently hovered or focused.
|
|
2494
|
-
if (!isHovered && !isFocused) {
|
|
2495
|
-
popover.close();
|
|
2496
|
-
}
|
|
2497
|
-
|
|
2498
|
-
// Return the popover.
|
|
2499
|
-
return popover;
|
|
2500
|
-
}, 1);
|
|
2501
|
-
}
|
|
2502
|
-
|
|
2503
|
-
function handleClick(popover) {
|
|
2504
|
-
if (popover.state === 'opened') {
|
|
2505
|
-
popover.close();
|
|
2506
|
-
} else {
|
|
2507
|
-
this.trigger = popover.trigger;
|
|
2508
|
-
popover.open();
|
|
2509
|
-
handleDocumentClick.call(this, popover);
|
|
2510
|
-
}
|
|
2511
|
-
}
|
|
2512
|
-
function handleKeydown(event) {
|
|
2513
|
-
var _this = this;
|
|
2514
|
-
switch (event.key) {
|
|
2515
|
-
case 'Escape':
|
|
2516
|
-
if (this.trigger) {
|
|
2517
|
-
this.trigger.focus();
|
|
2518
|
-
}
|
|
2519
|
-
closeAll.call(this);
|
|
2520
|
-
return;
|
|
2521
|
-
case 'Tab':
|
|
2522
|
-
this.collection.forEach(function (popover) {
|
|
2523
|
-
closeCheck.call(_this, popover);
|
|
2524
|
-
});
|
|
2525
|
-
return;
|
|
2526
|
-
default:
|
|
2527
|
-
return;
|
|
2528
|
-
}
|
|
2529
|
-
}
|
|
2530
|
-
function handleDocumentClick(popover) {
|
|
2531
|
-
var root = this;
|
|
2532
|
-
document.addEventListener('click', function _f(event) {
|
|
2533
|
-
// Check if a popover or its trigger was clicked.
|
|
2534
|
-
var wasClicked = event.target.closest("#" + popover.id + ", [aria-controls=\"" + popover.id + "\"], [aria-describedby=\"" + popover.id + "\"]");
|
|
2535
|
-
|
|
2536
|
-
// If popover or popover trigger was clicked...
|
|
2537
|
-
if (wasClicked) {
|
|
2538
|
-
// If popover element exists and is not active...
|
|
2539
|
-
if (popover.el && !popover.el.classList.contains(root.settings.stateActive)) {
|
|
2540
|
-
this.removeEventListener('click', _f);
|
|
2541
|
-
}
|
|
2542
|
-
} else {
|
|
2543
|
-
// If popover element exists and is active...
|
|
2544
|
-
if (popover.el && popover.el.classList.contains(root.settings.stateActive)) {
|
|
2545
|
-
popover.close();
|
|
2546
|
-
}
|
|
2547
|
-
this.removeEventListener('click', _f);
|
|
2548
|
-
}
|
|
2549
|
-
});
|
|
2550
|
-
}
|
|
2551
|
-
|
|
2552
|
-
var top = 'top';
|
|
2553
|
-
var bottom = 'bottom';
|
|
2554
|
-
var right = 'right';
|
|
2555
|
-
var left = 'left';
|
|
2556
|
-
var auto = 'auto';
|
|
2557
|
-
var basePlacements = [top, bottom, right, left];
|
|
2558
|
-
var start = 'start';
|
|
2559
|
-
var end = 'end';
|
|
2560
|
-
var clippingParents = 'clippingParents';
|
|
2561
|
-
var viewport = 'viewport';
|
|
2562
|
-
var popper = 'popper';
|
|
2563
|
-
var reference = 'reference';
|
|
2564
|
-
var variationPlacements = /*#__PURE__*/basePlacements.reduce(function (acc, placement) {
|
|
2565
|
-
return acc.concat([placement + "-" + start, placement + "-" + end]);
|
|
2566
|
-
}, []);
|
|
2567
|
-
var placements = /*#__PURE__*/[].concat(basePlacements, [auto]).reduce(function (acc, placement) {
|
|
2568
|
-
return acc.concat([placement, placement + "-" + start, placement + "-" + end]);
|
|
2569
|
-
}, []); // modifiers that need to read the DOM
|
|
2570
|
-
|
|
2571
|
-
var beforeRead = 'beforeRead';
|
|
2572
|
-
var read = 'read';
|
|
2573
|
-
var afterRead = 'afterRead'; // pure-logic modifiers
|
|
2574
|
-
|
|
2575
|
-
var beforeMain = 'beforeMain';
|
|
2576
|
-
var main = 'main';
|
|
2577
|
-
var afterMain = 'afterMain'; // modifier with the purpose to write to the DOM (or write into a framework state)
|
|
2578
|
-
|
|
2579
|
-
var beforeWrite = 'beforeWrite';
|
|
2580
|
-
var write = 'write';
|
|
2581
|
-
var afterWrite = 'afterWrite';
|
|
2582
|
-
var modifierPhases = [beforeRead, read, afterRead, beforeMain, main, afterMain, beforeWrite, write, afterWrite];
|
|
2583
|
-
|
|
2584
|
-
function getNodeName(element) {
|
|
2585
|
-
return element ? (element.nodeName || '').toLowerCase() : null;
|
|
2586
|
-
}
|
|
2587
|
-
|
|
2588
|
-
function getWindow(node) {
|
|
2589
|
-
if (node == null) {
|
|
2590
|
-
return window;
|
|
2591
|
-
}
|
|
2592
|
-
|
|
2593
|
-
if (node.toString() !== '[object Window]') {
|
|
2594
|
-
var ownerDocument = node.ownerDocument;
|
|
2595
|
-
return ownerDocument ? ownerDocument.defaultView || window : window;
|
|
2596
|
-
}
|
|
2597
|
-
|
|
2598
|
-
return node;
|
|
2599
|
-
}
|
|
2600
|
-
|
|
2601
|
-
function isElement(node) {
|
|
2602
|
-
var OwnElement = getWindow(node).Element;
|
|
2603
|
-
return node instanceof OwnElement || node instanceof Element;
|
|
2604
|
-
}
|
|
2605
|
-
|
|
2606
|
-
function isHTMLElement(node) {
|
|
2607
|
-
var OwnElement = getWindow(node).HTMLElement;
|
|
2608
|
-
return node instanceof OwnElement || node instanceof HTMLElement;
|
|
2609
|
-
}
|
|
2610
|
-
|
|
2611
|
-
function isShadowRoot(node) {
|
|
2612
|
-
// IE 11 has no ShadowRoot
|
|
2613
|
-
if (typeof ShadowRoot === 'undefined') {
|
|
2614
|
-
return false;
|
|
2615
|
-
}
|
|
2616
|
-
|
|
2617
|
-
var OwnElement = getWindow(node).ShadowRoot;
|
|
2618
|
-
return node instanceof OwnElement || node instanceof ShadowRoot;
|
|
2619
|
-
}
|
|
2620
|
-
|
|
2621
|
-
// and applies them to the HTMLElements such as popper and arrow
|
|
2622
|
-
|
|
2623
|
-
function applyStyles(_ref) {
|
|
2624
|
-
var state = _ref.state;
|
|
2625
|
-
Object.keys(state.elements).forEach(function (name) {
|
|
2626
|
-
var style = state.styles[name] || {};
|
|
2627
|
-
var attributes = state.attributes[name] || {};
|
|
2628
|
-
var element = state.elements[name]; // arrow is optional + virtual elements
|
|
2629
|
-
|
|
2630
|
-
if (!isHTMLElement(element) || !getNodeName(element)) {
|
|
2631
|
-
return;
|
|
2632
|
-
} // Flow doesn't support to extend this property, but it's the most
|
|
2633
|
-
// effective way to apply styles to an HTMLElement
|
|
2634
|
-
// $FlowFixMe[cannot-write]
|
|
2635
|
-
|
|
2636
|
-
|
|
2637
|
-
Object.assign(element.style, style);
|
|
2638
|
-
Object.keys(attributes).forEach(function (name) {
|
|
2639
|
-
var value = attributes[name];
|
|
2640
|
-
|
|
2641
|
-
if (value === false) {
|
|
2642
|
-
element.removeAttribute(name);
|
|
2643
|
-
} else {
|
|
2644
|
-
element.setAttribute(name, value === true ? '' : value);
|
|
2645
|
-
}
|
|
2646
|
-
});
|
|
2647
|
-
});
|
|
2648
|
-
}
|
|
2649
|
-
|
|
2650
|
-
function effect$2(_ref2) {
|
|
2651
|
-
var state = _ref2.state;
|
|
2652
|
-
var initialStyles = {
|
|
2653
|
-
popper: {
|
|
2654
|
-
position: state.options.strategy,
|
|
2655
|
-
left: '0',
|
|
2656
|
-
top: '0',
|
|
2657
|
-
margin: '0'
|
|
2658
|
-
},
|
|
2659
|
-
arrow: {
|
|
2660
|
-
position: 'absolute'
|
|
2661
|
-
},
|
|
2662
|
-
reference: {}
|
|
2663
|
-
};
|
|
2664
|
-
Object.assign(state.elements.popper.style, initialStyles.popper);
|
|
2665
|
-
state.styles = initialStyles;
|
|
2666
|
-
|
|
2667
|
-
if (state.elements.arrow) {
|
|
2668
|
-
Object.assign(state.elements.arrow.style, initialStyles.arrow);
|
|
2669
|
-
}
|
|
2670
|
-
|
|
2671
|
-
return function () {
|
|
2672
|
-
Object.keys(state.elements).forEach(function (name) {
|
|
2673
|
-
var element = state.elements[name];
|
|
2674
|
-
var attributes = state.attributes[name] || {};
|
|
2675
|
-
var styleProperties = Object.keys(state.styles.hasOwnProperty(name) ? state.styles[name] : initialStyles[name]); // Set all values to an empty string to unset them
|
|
2676
|
-
|
|
2677
|
-
var style = styleProperties.reduce(function (style, property) {
|
|
2678
|
-
style[property] = '';
|
|
2679
|
-
return style;
|
|
2680
|
-
}, {}); // arrow is optional + virtual elements
|
|
2681
|
-
|
|
2682
|
-
if (!isHTMLElement(element) || !getNodeName(element)) {
|
|
2683
|
-
return;
|
|
2684
|
-
}
|
|
2685
|
-
|
|
2686
|
-
Object.assign(element.style, style);
|
|
2687
|
-
Object.keys(attributes).forEach(function (attribute) {
|
|
2688
|
-
element.removeAttribute(attribute);
|
|
2689
|
-
});
|
|
2690
|
-
});
|
|
2691
|
-
};
|
|
2692
|
-
} // eslint-disable-next-line import/no-unused-modules
|
|
2693
|
-
|
|
2694
|
-
|
|
2695
|
-
var applyStyles$1 = {
|
|
2696
|
-
name: 'applyStyles',
|
|
2697
|
-
enabled: true,
|
|
2698
|
-
phase: 'write',
|
|
2699
|
-
fn: applyStyles,
|
|
2700
|
-
effect: effect$2,
|
|
2701
|
-
requires: ['computeStyles']
|
|
2702
|
-
};
|
|
2703
|
-
|
|
2704
|
-
function getBasePlacement(placement) {
|
|
2705
|
-
return placement.split('-')[0];
|
|
2706
|
-
}
|
|
2707
|
-
|
|
2708
|
-
var max = Math.max;
|
|
2709
|
-
var min = Math.min;
|
|
2710
|
-
var round = Math.round;
|
|
2711
|
-
|
|
2712
|
-
function getUAString() {
|
|
2713
|
-
var uaData = navigator.userAgentData;
|
|
2714
|
-
|
|
2715
|
-
if (uaData != null && uaData.brands && Array.isArray(uaData.brands)) {
|
|
2716
|
-
return uaData.brands.map(function (item) {
|
|
2717
|
-
return item.brand + "/" + item.version;
|
|
2718
|
-
}).join(' ');
|
|
2719
|
-
}
|
|
2720
|
-
|
|
2721
|
-
return navigator.userAgent;
|
|
2722
|
-
}
|
|
2723
|
-
|
|
2724
|
-
function isLayoutViewport() {
|
|
2725
|
-
return !/^((?!chrome|android).)*safari/i.test(getUAString());
|
|
2726
|
-
}
|
|
2727
|
-
|
|
2728
|
-
function getBoundingClientRect(element, includeScale, isFixedStrategy) {
|
|
2729
|
-
if (includeScale === void 0) {
|
|
2730
|
-
includeScale = false;
|
|
2731
|
-
}
|
|
2732
|
-
|
|
2733
|
-
if (isFixedStrategy === void 0) {
|
|
2734
|
-
isFixedStrategy = false;
|
|
2735
|
-
}
|
|
2736
|
-
|
|
2737
|
-
var clientRect = element.getBoundingClientRect();
|
|
2738
|
-
var scaleX = 1;
|
|
2739
|
-
var scaleY = 1;
|
|
2740
|
-
|
|
2741
|
-
if (includeScale && isHTMLElement(element)) {
|
|
2742
|
-
scaleX = element.offsetWidth > 0 ? round(clientRect.width) / element.offsetWidth || 1 : 1;
|
|
2743
|
-
scaleY = element.offsetHeight > 0 ? round(clientRect.height) / element.offsetHeight || 1 : 1;
|
|
2744
|
-
}
|
|
2745
|
-
|
|
2746
|
-
var _ref = isElement(element) ? getWindow(element) : window,
|
|
2747
|
-
visualViewport = _ref.visualViewport;
|
|
2748
|
-
|
|
2749
|
-
var addVisualOffsets = !isLayoutViewport() && isFixedStrategy;
|
|
2750
|
-
var x = (clientRect.left + (addVisualOffsets && visualViewport ? visualViewport.offsetLeft : 0)) / scaleX;
|
|
2751
|
-
var y = (clientRect.top + (addVisualOffsets && visualViewport ? visualViewport.offsetTop : 0)) / scaleY;
|
|
2752
|
-
var width = clientRect.width / scaleX;
|
|
2753
|
-
var height = clientRect.height / scaleY;
|
|
2754
|
-
return {
|
|
2755
|
-
width: width,
|
|
2756
|
-
height: height,
|
|
2757
|
-
top: y,
|
|
2758
|
-
right: x + width,
|
|
2759
|
-
bottom: y + height,
|
|
2760
|
-
left: x,
|
|
2761
|
-
x: x,
|
|
2762
|
-
y: y
|
|
2763
|
-
};
|
|
2764
|
-
}
|
|
2765
|
-
|
|
2766
|
-
// means it doesn't take into account transforms.
|
|
2767
|
-
|
|
2768
|
-
function getLayoutRect(element) {
|
|
2769
|
-
var clientRect = getBoundingClientRect(element); // Use the clientRect sizes if it's not been transformed.
|
|
2770
|
-
// Fixes https://github.com/popperjs/popper-core/issues/1223
|
|
2771
|
-
|
|
2772
|
-
var width = element.offsetWidth;
|
|
2773
|
-
var height = element.offsetHeight;
|
|
2774
|
-
|
|
2775
|
-
if (Math.abs(clientRect.width - width) <= 1) {
|
|
2776
|
-
width = clientRect.width;
|
|
2777
|
-
}
|
|
2778
|
-
|
|
2779
|
-
if (Math.abs(clientRect.height - height) <= 1) {
|
|
2780
|
-
height = clientRect.height;
|
|
2781
|
-
}
|
|
2782
|
-
|
|
2783
|
-
return {
|
|
2784
|
-
x: element.offsetLeft,
|
|
2785
|
-
y: element.offsetTop,
|
|
2786
|
-
width: width,
|
|
2787
|
-
height: height
|
|
2788
|
-
};
|
|
2789
|
-
}
|
|
2790
|
-
|
|
2791
|
-
function contains(parent, child) {
|
|
2792
|
-
var rootNode = child.getRootNode && child.getRootNode(); // First, attempt with faster native method
|
|
2793
|
-
|
|
2794
|
-
if (parent.contains(child)) {
|
|
2795
|
-
return true;
|
|
2796
|
-
} // then fallback to custom implementation with Shadow DOM support
|
|
2797
|
-
else if (rootNode && isShadowRoot(rootNode)) {
|
|
2798
|
-
var next = child;
|
|
2799
|
-
|
|
2800
|
-
do {
|
|
2801
|
-
if (next && parent.isSameNode(next)) {
|
|
2802
|
-
return true;
|
|
2803
|
-
} // $FlowFixMe[prop-missing]: need a better way to handle this...
|
|
2804
|
-
|
|
2805
|
-
|
|
2806
|
-
next = next.parentNode || next.host;
|
|
2807
|
-
} while (next);
|
|
2808
|
-
} // Give up, the result is false
|
|
2809
|
-
|
|
2810
|
-
|
|
2811
|
-
return false;
|
|
2812
|
-
}
|
|
2813
|
-
|
|
2814
|
-
function getComputedStyle$1(element) {
|
|
2815
|
-
return getWindow(element).getComputedStyle(element);
|
|
2816
|
-
}
|
|
2817
|
-
|
|
2818
|
-
function isTableElement(element) {
|
|
2819
|
-
return ['table', 'td', 'th'].indexOf(getNodeName(element)) >= 0;
|
|
2820
|
-
}
|
|
2821
|
-
|
|
2822
|
-
function getDocumentElement(element) {
|
|
2823
|
-
// $FlowFixMe[incompatible-return]: assume body is always available
|
|
2824
|
-
return ((isElement(element) ? element.ownerDocument : // $FlowFixMe[prop-missing]
|
|
2825
|
-
element.document) || window.document).documentElement;
|
|
2826
|
-
}
|
|
2827
|
-
|
|
2828
|
-
function getParentNode(element) {
|
|
2829
|
-
if (getNodeName(element) === 'html') {
|
|
2830
|
-
return element;
|
|
2831
|
-
}
|
|
2832
|
-
|
|
2833
|
-
return (// this is a quicker (but less type safe) way to save quite some bytes from the bundle
|
|
2834
|
-
// $FlowFixMe[incompatible-return]
|
|
2835
|
-
// $FlowFixMe[prop-missing]
|
|
2836
|
-
element.assignedSlot || // step into the shadow DOM of the parent of a slotted node
|
|
2837
|
-
element.parentNode || ( // DOM Element detected
|
|
2838
|
-
isShadowRoot(element) ? element.host : null) || // ShadowRoot detected
|
|
2839
|
-
// $FlowFixMe[incompatible-call]: HTMLElement is a Node
|
|
2840
|
-
getDocumentElement(element) // fallback
|
|
2841
|
-
|
|
2842
|
-
);
|
|
2843
|
-
}
|
|
2844
|
-
|
|
2845
|
-
function getTrueOffsetParent(element) {
|
|
2846
|
-
if (!isHTMLElement(element) || // https://github.com/popperjs/popper-core/issues/837
|
|
2847
|
-
getComputedStyle$1(element).position === 'fixed') {
|
|
2848
|
-
return null;
|
|
2849
|
-
}
|
|
2850
|
-
|
|
2851
|
-
return element.offsetParent;
|
|
2852
|
-
} // `.offsetParent` reports `null` for fixed elements, while absolute elements
|
|
2853
|
-
// return the containing block
|
|
2854
|
-
|
|
2855
|
-
|
|
2856
|
-
function getContainingBlock(element) {
|
|
2857
|
-
var isFirefox = /firefox/i.test(getUAString());
|
|
2858
|
-
var isIE = /Trident/i.test(getUAString());
|
|
2859
|
-
|
|
2860
|
-
if (isIE && isHTMLElement(element)) {
|
|
2861
|
-
// In IE 9, 10 and 11 fixed elements containing block is always established by the viewport
|
|
2862
|
-
var elementCss = getComputedStyle$1(element);
|
|
2863
|
-
|
|
2864
|
-
if (elementCss.position === 'fixed') {
|
|
2865
|
-
return null;
|
|
2866
|
-
}
|
|
2867
|
-
}
|
|
2868
|
-
|
|
2869
|
-
var currentNode = getParentNode(element);
|
|
2870
|
-
|
|
2871
|
-
if (isShadowRoot(currentNode)) {
|
|
2872
|
-
currentNode = currentNode.host;
|
|
2873
|
-
}
|
|
2874
|
-
|
|
2875
|
-
while (isHTMLElement(currentNode) && ['html', 'body'].indexOf(getNodeName(currentNode)) < 0) {
|
|
2876
|
-
var css = getComputedStyle$1(currentNode); // This is non-exhaustive but covers the most common CSS properties that
|
|
2877
|
-
// create a containing block.
|
|
2878
|
-
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
2879
|
-
|
|
2880
|
-
if (css.transform !== 'none' || css.perspective !== 'none' || css.contain === 'paint' || ['transform', 'perspective'].indexOf(css.willChange) !== -1 || isFirefox && css.willChange === 'filter' || isFirefox && css.filter && css.filter !== 'none') {
|
|
2881
|
-
return currentNode;
|
|
2882
|
-
} else {
|
|
2883
|
-
currentNode = currentNode.parentNode;
|
|
2884
|
-
}
|
|
2885
|
-
}
|
|
2886
|
-
|
|
2887
|
-
return null;
|
|
2888
|
-
} // Gets the closest ancestor positioned element. Handles some edge cases,
|
|
2889
|
-
// such as table ancestors and cross browser bugs.
|
|
2890
|
-
|
|
2891
|
-
|
|
2892
|
-
function getOffsetParent(element) {
|
|
2893
|
-
var window = getWindow(element);
|
|
2894
|
-
var offsetParent = getTrueOffsetParent(element);
|
|
2895
|
-
|
|
2896
|
-
while (offsetParent && isTableElement(offsetParent) && getComputedStyle$1(offsetParent).position === 'static') {
|
|
2897
|
-
offsetParent = getTrueOffsetParent(offsetParent);
|
|
2898
|
-
}
|
|
2899
|
-
|
|
2900
|
-
if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle$1(offsetParent).position === 'static')) {
|
|
2901
|
-
return window;
|
|
2902
|
-
}
|
|
2903
|
-
|
|
2904
|
-
return offsetParent || getContainingBlock(element) || window;
|
|
2905
|
-
}
|
|
2906
|
-
|
|
2907
|
-
function getMainAxisFromPlacement(placement) {
|
|
2908
|
-
return ['top', 'bottom'].indexOf(placement) >= 0 ? 'x' : 'y';
|
|
2909
|
-
}
|
|
2910
|
-
|
|
2911
|
-
function within(min$1, value, max$1) {
|
|
2912
|
-
return max(min$1, min(value, max$1));
|
|
2913
|
-
}
|
|
2914
|
-
function withinMaxClamp(min, value, max) {
|
|
2915
|
-
var v = within(min, value, max);
|
|
2916
|
-
return v > max ? max : v;
|
|
2917
|
-
}
|
|
2918
|
-
|
|
2919
|
-
function getFreshSideObject() {
|
|
2920
|
-
return {
|
|
2921
|
-
top: 0,
|
|
2922
|
-
right: 0,
|
|
2923
|
-
bottom: 0,
|
|
2924
|
-
left: 0
|
|
2925
|
-
};
|
|
2926
|
-
}
|
|
2927
|
-
|
|
2928
|
-
function mergePaddingObject(paddingObject) {
|
|
2929
|
-
return Object.assign({}, getFreshSideObject(), paddingObject);
|
|
2930
|
-
}
|
|
2931
|
-
|
|
2932
|
-
function expandToHashMap(value, keys) {
|
|
2933
|
-
return keys.reduce(function (hashMap, key) {
|
|
2934
|
-
hashMap[key] = value;
|
|
2935
|
-
return hashMap;
|
|
2936
|
-
}, {});
|
|
2937
|
-
}
|
|
2938
|
-
|
|
2939
|
-
var toPaddingObject = function toPaddingObject(padding, state) {
|
|
2940
|
-
padding = typeof padding === 'function' ? padding(Object.assign({}, state.rects, {
|
|
2941
|
-
placement: state.placement
|
|
2942
|
-
})) : padding;
|
|
2943
|
-
return mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));
|
|
2944
|
-
};
|
|
2945
|
-
|
|
2946
|
-
function arrow(_ref) {
|
|
2947
|
-
var _state$modifiersData$;
|
|
2948
|
-
|
|
2949
|
-
var state = _ref.state,
|
|
2950
|
-
name = _ref.name,
|
|
2951
|
-
options = _ref.options;
|
|
2952
|
-
var arrowElement = state.elements.arrow;
|
|
2953
|
-
var popperOffsets = state.modifiersData.popperOffsets;
|
|
2954
|
-
var basePlacement = getBasePlacement(state.placement);
|
|
2955
|
-
var axis = getMainAxisFromPlacement(basePlacement);
|
|
2956
|
-
var isVertical = [left, right].indexOf(basePlacement) >= 0;
|
|
2957
|
-
var len = isVertical ? 'height' : 'width';
|
|
2958
|
-
|
|
2959
|
-
if (!arrowElement || !popperOffsets) {
|
|
2960
|
-
return;
|
|
2961
|
-
}
|
|
2962
|
-
|
|
2963
|
-
var paddingObject = toPaddingObject(options.padding, state);
|
|
2964
|
-
var arrowRect = getLayoutRect(arrowElement);
|
|
2965
|
-
var minProp = axis === 'y' ? top : left;
|
|
2966
|
-
var maxProp = axis === 'y' ? bottom : right;
|
|
2967
|
-
var endDiff = state.rects.reference[len] + state.rects.reference[axis] - popperOffsets[axis] - state.rects.popper[len];
|
|
2968
|
-
var startDiff = popperOffsets[axis] - state.rects.reference[axis];
|
|
2969
|
-
var arrowOffsetParent = getOffsetParent(arrowElement);
|
|
2970
|
-
var clientSize = arrowOffsetParent ? axis === 'y' ? arrowOffsetParent.clientHeight || 0 : arrowOffsetParent.clientWidth || 0 : 0;
|
|
2971
|
-
var centerToReference = endDiff / 2 - startDiff / 2; // Make sure the arrow doesn't overflow the popper if the center point is
|
|
2972
|
-
// outside of the popper bounds
|
|
2973
|
-
|
|
2974
|
-
var min = paddingObject[minProp];
|
|
2975
|
-
var max = clientSize - arrowRect[len] - paddingObject[maxProp];
|
|
2976
|
-
var center = clientSize / 2 - arrowRect[len] / 2 + centerToReference;
|
|
2977
|
-
var offset = within(min, center, max); // Prevents breaking syntax highlighting...
|
|
2978
|
-
|
|
2979
|
-
var axisProp = axis;
|
|
2980
|
-
state.modifiersData[name] = (_state$modifiersData$ = {}, _state$modifiersData$[axisProp] = offset, _state$modifiersData$.centerOffset = offset - center, _state$modifiersData$);
|
|
2981
|
-
}
|
|
2982
|
-
|
|
2983
|
-
function effect$1(_ref2) {
|
|
2984
|
-
var state = _ref2.state,
|
|
2985
|
-
options = _ref2.options;
|
|
2986
|
-
var _options$element = options.element,
|
|
2987
|
-
arrowElement = _options$element === void 0 ? '[data-popper-arrow]' : _options$element;
|
|
2988
|
-
|
|
2989
|
-
if (arrowElement == null) {
|
|
2990
|
-
return;
|
|
2991
|
-
} // CSS selector
|
|
2992
|
-
|
|
2993
|
-
|
|
2994
|
-
if (typeof arrowElement === 'string') {
|
|
2995
|
-
arrowElement = state.elements.popper.querySelector(arrowElement);
|
|
2996
|
-
|
|
2997
|
-
if (!arrowElement) {
|
|
2998
|
-
return;
|
|
2999
|
-
}
|
|
3000
|
-
}
|
|
3001
|
-
|
|
3002
|
-
if (!contains(state.elements.popper, arrowElement)) {
|
|
3003
|
-
return;
|
|
3004
|
-
}
|
|
3005
|
-
|
|
3006
|
-
state.elements.arrow = arrowElement;
|
|
3007
|
-
} // eslint-disable-next-line import/no-unused-modules
|
|
3008
|
-
|
|
3009
|
-
|
|
3010
|
-
var arrow$1 = {
|
|
3011
|
-
name: 'arrow',
|
|
3012
|
-
enabled: true,
|
|
3013
|
-
phase: 'main',
|
|
3014
|
-
fn: arrow,
|
|
3015
|
-
effect: effect$1,
|
|
3016
|
-
requires: ['popperOffsets'],
|
|
3017
|
-
requiresIfExists: ['preventOverflow']
|
|
3018
|
-
};
|
|
3019
|
-
|
|
3020
|
-
function getVariation(placement) {
|
|
3021
|
-
return placement.split('-')[1];
|
|
3022
|
-
}
|
|
3023
|
-
|
|
3024
|
-
var unsetSides = {
|
|
3025
|
-
top: 'auto',
|
|
3026
|
-
right: 'auto',
|
|
3027
|
-
bottom: 'auto',
|
|
3028
|
-
left: 'auto'
|
|
3029
|
-
}; // Round the offsets to the nearest suitable subpixel based on the DPR.
|
|
3030
|
-
// Zooming can change the DPR, but it seems to report a value that will
|
|
3031
|
-
// cleanly divide the values into the appropriate subpixels.
|
|
3032
|
-
|
|
3033
|
-
function roundOffsetsByDPR(_ref, win) {
|
|
3034
|
-
var x = _ref.x,
|
|
3035
|
-
y = _ref.y;
|
|
3036
|
-
var dpr = win.devicePixelRatio || 1;
|
|
3037
|
-
return {
|
|
3038
|
-
x: round(x * dpr) / dpr || 0,
|
|
3039
|
-
y: round(y * dpr) / dpr || 0
|
|
3040
|
-
};
|
|
3041
|
-
}
|
|
3042
|
-
|
|
3043
|
-
function mapToStyles(_ref2) {
|
|
3044
|
-
var _Object$assign2;
|
|
3045
|
-
|
|
3046
|
-
var popper = _ref2.popper,
|
|
3047
|
-
popperRect = _ref2.popperRect,
|
|
3048
|
-
placement = _ref2.placement,
|
|
3049
|
-
variation = _ref2.variation,
|
|
3050
|
-
offsets = _ref2.offsets,
|
|
3051
|
-
position = _ref2.position,
|
|
3052
|
-
gpuAcceleration = _ref2.gpuAcceleration,
|
|
3053
|
-
adaptive = _ref2.adaptive,
|
|
3054
|
-
roundOffsets = _ref2.roundOffsets,
|
|
3055
|
-
isFixed = _ref2.isFixed;
|
|
3056
|
-
var _offsets$x = offsets.x,
|
|
3057
|
-
x = _offsets$x === void 0 ? 0 : _offsets$x,
|
|
3058
|
-
_offsets$y = offsets.y,
|
|
3059
|
-
y = _offsets$y === void 0 ? 0 : _offsets$y;
|
|
3060
|
-
|
|
3061
|
-
var _ref3 = typeof roundOffsets === 'function' ? roundOffsets({
|
|
3062
|
-
x: x,
|
|
3063
|
-
y: y
|
|
3064
|
-
}) : {
|
|
3065
|
-
x: x,
|
|
3066
|
-
y: y
|
|
3067
|
-
};
|
|
3068
|
-
|
|
3069
|
-
x = _ref3.x;
|
|
3070
|
-
y = _ref3.y;
|
|
3071
|
-
var hasX = offsets.hasOwnProperty('x');
|
|
3072
|
-
var hasY = offsets.hasOwnProperty('y');
|
|
3073
|
-
var sideX = left;
|
|
3074
|
-
var sideY = top;
|
|
3075
|
-
var win = window;
|
|
3076
|
-
|
|
3077
|
-
if (adaptive) {
|
|
3078
|
-
var offsetParent = getOffsetParent(popper);
|
|
3079
|
-
var heightProp = 'clientHeight';
|
|
3080
|
-
var widthProp = 'clientWidth';
|
|
3081
|
-
|
|
3082
|
-
if (offsetParent === getWindow(popper)) {
|
|
3083
|
-
offsetParent = getDocumentElement(popper);
|
|
3084
|
-
|
|
3085
|
-
if (getComputedStyle$1(offsetParent).position !== 'static' && position === 'absolute') {
|
|
3086
|
-
heightProp = 'scrollHeight';
|
|
3087
|
-
widthProp = 'scrollWidth';
|
|
3088
|
-
}
|
|
3089
|
-
} // $FlowFixMe[incompatible-cast]: force type refinement, we compare offsetParent with window above, but Flow doesn't detect it
|
|
3090
|
-
|
|
3091
|
-
|
|
3092
|
-
offsetParent = offsetParent;
|
|
3093
|
-
|
|
3094
|
-
if (placement === top || (placement === left || placement === right) && variation === end) {
|
|
3095
|
-
sideY = bottom;
|
|
3096
|
-
var offsetY = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.height : // $FlowFixMe[prop-missing]
|
|
3097
|
-
offsetParent[heightProp];
|
|
3098
|
-
y -= offsetY - popperRect.height;
|
|
3099
|
-
y *= gpuAcceleration ? 1 : -1;
|
|
3100
|
-
}
|
|
3101
|
-
|
|
3102
|
-
if (placement === left || (placement === top || placement === bottom) && variation === end) {
|
|
3103
|
-
sideX = right;
|
|
3104
|
-
var offsetX = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.width : // $FlowFixMe[prop-missing]
|
|
3105
|
-
offsetParent[widthProp];
|
|
3106
|
-
x -= offsetX - popperRect.width;
|
|
3107
|
-
x *= gpuAcceleration ? 1 : -1;
|
|
3108
|
-
}
|
|
3109
|
-
}
|
|
3110
|
-
|
|
3111
|
-
var commonStyles = Object.assign({
|
|
3112
|
-
position: position
|
|
3113
|
-
}, adaptive && unsetSides);
|
|
3114
|
-
|
|
3115
|
-
var _ref4 = roundOffsets === true ? roundOffsetsByDPR({
|
|
3116
|
-
x: x,
|
|
3117
|
-
y: y
|
|
3118
|
-
}, getWindow(popper)) : {
|
|
3119
|
-
x: x,
|
|
3120
|
-
y: y
|
|
3121
|
-
};
|
|
3122
|
-
|
|
3123
|
-
x = _ref4.x;
|
|
3124
|
-
y = _ref4.y;
|
|
3125
|
-
|
|
3126
|
-
if (gpuAcceleration) {
|
|
3127
|
-
var _Object$assign;
|
|
3128
|
-
|
|
3129
|
-
return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? '0' : '', _Object$assign[sideX] = hasX ? '0' : '', _Object$assign.transform = (win.devicePixelRatio || 1) <= 1 ? "translate(" + x + "px, " + y + "px)" : "translate3d(" + x + "px, " + y + "px, 0)", _Object$assign));
|
|
3130
|
-
}
|
|
3131
|
-
|
|
3132
|
-
return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + "px" : '', _Object$assign2[sideX] = hasX ? x + "px" : '', _Object$assign2.transform = '', _Object$assign2));
|
|
3133
|
-
}
|
|
3134
|
-
|
|
3135
|
-
function computeStyles(_ref5) {
|
|
3136
|
-
var state = _ref5.state,
|
|
3137
|
-
options = _ref5.options;
|
|
3138
|
-
var _options$gpuAccelerat = options.gpuAcceleration,
|
|
3139
|
-
gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat,
|
|
3140
|
-
_options$adaptive = options.adaptive,
|
|
3141
|
-
adaptive = _options$adaptive === void 0 ? true : _options$adaptive,
|
|
3142
|
-
_options$roundOffsets = options.roundOffsets,
|
|
3143
|
-
roundOffsets = _options$roundOffsets === void 0 ? true : _options$roundOffsets;
|
|
3144
|
-
var commonStyles = {
|
|
3145
|
-
placement: getBasePlacement(state.placement),
|
|
3146
|
-
variation: getVariation(state.placement),
|
|
3147
|
-
popper: state.elements.popper,
|
|
3148
|
-
popperRect: state.rects.popper,
|
|
3149
|
-
gpuAcceleration: gpuAcceleration,
|
|
3150
|
-
isFixed: state.options.strategy === 'fixed'
|
|
3151
|
-
};
|
|
3152
|
-
|
|
3153
|
-
if (state.modifiersData.popperOffsets != null) {
|
|
3154
|
-
state.styles.popper = Object.assign({}, state.styles.popper, mapToStyles(Object.assign({}, commonStyles, {
|
|
3155
|
-
offsets: state.modifiersData.popperOffsets,
|
|
3156
|
-
position: state.options.strategy,
|
|
3157
|
-
adaptive: adaptive,
|
|
3158
|
-
roundOffsets: roundOffsets
|
|
3159
|
-
})));
|
|
3160
|
-
}
|
|
3161
|
-
|
|
3162
|
-
if (state.modifiersData.arrow != null) {
|
|
3163
|
-
state.styles.arrow = Object.assign({}, state.styles.arrow, mapToStyles(Object.assign({}, commonStyles, {
|
|
3164
|
-
offsets: state.modifiersData.arrow,
|
|
3165
|
-
position: 'absolute',
|
|
3166
|
-
adaptive: false,
|
|
3167
|
-
roundOffsets: roundOffsets
|
|
3168
|
-
})));
|
|
3169
|
-
}
|
|
3170
|
-
|
|
3171
|
-
state.attributes.popper = Object.assign({}, state.attributes.popper, {
|
|
3172
|
-
'data-popper-placement': state.placement
|
|
3173
|
-
});
|
|
3174
|
-
} // eslint-disable-next-line import/no-unused-modules
|
|
3175
|
-
|
|
3176
|
-
|
|
3177
|
-
var computeStyles$1 = {
|
|
3178
|
-
name: 'computeStyles',
|
|
3179
|
-
enabled: true,
|
|
3180
|
-
phase: 'beforeWrite',
|
|
3181
|
-
fn: computeStyles,
|
|
3182
|
-
data: {}
|
|
3183
|
-
};
|
|
3184
|
-
|
|
3185
|
-
var passive = {
|
|
3186
|
-
passive: true
|
|
3187
|
-
};
|
|
3188
|
-
|
|
3189
|
-
function effect(_ref) {
|
|
3190
|
-
var state = _ref.state,
|
|
3191
|
-
instance = _ref.instance,
|
|
3192
|
-
options = _ref.options;
|
|
3193
|
-
var _options$scroll = options.scroll,
|
|
3194
|
-
scroll = _options$scroll === void 0 ? true : _options$scroll,
|
|
3195
|
-
_options$resize = options.resize,
|
|
3196
|
-
resize = _options$resize === void 0 ? true : _options$resize;
|
|
3197
|
-
var window = getWindow(state.elements.popper);
|
|
3198
|
-
var scrollParents = [].concat(state.scrollParents.reference, state.scrollParents.popper);
|
|
3199
|
-
|
|
3200
|
-
if (scroll) {
|
|
3201
|
-
scrollParents.forEach(function (scrollParent) {
|
|
3202
|
-
scrollParent.addEventListener('scroll', instance.update, passive);
|
|
3203
|
-
});
|
|
3204
|
-
}
|
|
3205
|
-
|
|
3206
|
-
if (resize) {
|
|
3207
|
-
window.addEventListener('resize', instance.update, passive);
|
|
3208
|
-
}
|
|
3209
|
-
|
|
3210
|
-
return function () {
|
|
3211
|
-
if (scroll) {
|
|
3212
|
-
scrollParents.forEach(function (scrollParent) {
|
|
3213
|
-
scrollParent.removeEventListener('scroll', instance.update, passive);
|
|
3214
|
-
});
|
|
3215
|
-
}
|
|
3216
|
-
|
|
3217
|
-
if (resize) {
|
|
3218
|
-
window.removeEventListener('resize', instance.update, passive);
|
|
3219
|
-
}
|
|
3220
|
-
};
|
|
3221
|
-
} // eslint-disable-next-line import/no-unused-modules
|
|
3222
|
-
|
|
3223
|
-
|
|
3224
|
-
var eventListeners = {
|
|
3225
|
-
name: 'eventListeners',
|
|
3226
|
-
enabled: true,
|
|
3227
|
-
phase: 'write',
|
|
3228
|
-
fn: function fn() {},
|
|
3229
|
-
effect: effect,
|
|
3230
|
-
data: {}
|
|
3231
|
-
};
|
|
3232
|
-
|
|
3233
|
-
var hash$1 = {
|
|
3234
|
-
left: 'right',
|
|
3235
|
-
right: 'left',
|
|
3236
|
-
bottom: 'top',
|
|
3237
|
-
top: 'bottom'
|
|
3238
|
-
};
|
|
3239
|
-
function getOppositePlacement(placement) {
|
|
3240
|
-
return placement.replace(/left|right|bottom|top/g, function (matched) {
|
|
3241
|
-
return hash$1[matched];
|
|
3242
|
-
});
|
|
3243
|
-
}
|
|
3244
|
-
|
|
3245
|
-
var hash = {
|
|
3246
|
-
start: 'end',
|
|
3247
|
-
end: 'start'
|
|
3248
|
-
};
|
|
3249
|
-
function getOppositeVariationPlacement(placement) {
|
|
3250
|
-
return placement.replace(/start|end/g, function (matched) {
|
|
3251
|
-
return hash[matched];
|
|
3252
|
-
});
|
|
3253
|
-
}
|
|
3254
|
-
|
|
3255
|
-
function getWindowScroll(node) {
|
|
3256
|
-
var win = getWindow(node);
|
|
3257
|
-
var scrollLeft = win.pageXOffset;
|
|
3258
|
-
var scrollTop = win.pageYOffset;
|
|
3259
|
-
return {
|
|
3260
|
-
scrollLeft: scrollLeft,
|
|
3261
|
-
scrollTop: scrollTop
|
|
3262
|
-
};
|
|
3263
|
-
}
|
|
3264
|
-
|
|
3265
|
-
function getWindowScrollBarX(element) {
|
|
3266
|
-
// If <html> has a CSS width greater than the viewport, then this will be
|
|
3267
|
-
// incorrect for RTL.
|
|
3268
|
-
// Popper 1 is broken in this case and never had a bug report so let's assume
|
|
3269
|
-
// it's not an issue. I don't think anyone ever specifies width on <html>
|
|
3270
|
-
// anyway.
|
|
3271
|
-
// Browsers where the left scrollbar doesn't cause an issue report `0` for
|
|
3272
|
-
// this (e.g. Edge 2019, IE11, Safari)
|
|
3273
|
-
return getBoundingClientRect(getDocumentElement(element)).left + getWindowScroll(element).scrollLeft;
|
|
3274
|
-
}
|
|
3275
|
-
|
|
3276
|
-
function getViewportRect(element, strategy) {
|
|
3277
|
-
var win = getWindow(element);
|
|
3278
|
-
var html = getDocumentElement(element);
|
|
3279
|
-
var visualViewport = win.visualViewport;
|
|
3280
|
-
var width = html.clientWidth;
|
|
3281
|
-
var height = html.clientHeight;
|
|
3282
|
-
var x = 0;
|
|
3283
|
-
var y = 0;
|
|
3284
|
-
|
|
3285
|
-
if (visualViewport) {
|
|
3286
|
-
width = visualViewport.width;
|
|
3287
|
-
height = visualViewport.height;
|
|
3288
|
-
var layoutViewport = isLayoutViewport();
|
|
3289
|
-
|
|
3290
|
-
if (layoutViewport || !layoutViewport && strategy === 'fixed') {
|
|
3291
|
-
x = visualViewport.offsetLeft;
|
|
3292
|
-
y = visualViewport.offsetTop;
|
|
3293
|
-
}
|
|
3294
|
-
}
|
|
3295
|
-
|
|
3296
|
-
return {
|
|
3297
|
-
width: width,
|
|
3298
|
-
height: height,
|
|
3299
|
-
x: x + getWindowScrollBarX(element),
|
|
3300
|
-
y: y
|
|
3301
|
-
};
|
|
3302
|
-
}
|
|
3303
|
-
|
|
3304
|
-
// of the `<html>` and `<body>` rect bounds if horizontally scrollable
|
|
3305
|
-
|
|
3306
|
-
function getDocumentRect(element) {
|
|
3307
|
-
var _element$ownerDocumen;
|
|
3308
|
-
|
|
3309
|
-
var html = getDocumentElement(element);
|
|
3310
|
-
var winScroll = getWindowScroll(element);
|
|
3311
|
-
var body = (_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body;
|
|
3312
|
-
var width = max(html.scrollWidth, html.clientWidth, body ? body.scrollWidth : 0, body ? body.clientWidth : 0);
|
|
3313
|
-
var height = max(html.scrollHeight, html.clientHeight, body ? body.scrollHeight : 0, body ? body.clientHeight : 0);
|
|
3314
|
-
var x = -winScroll.scrollLeft + getWindowScrollBarX(element);
|
|
3315
|
-
var y = -winScroll.scrollTop;
|
|
3316
|
-
|
|
3317
|
-
if (getComputedStyle$1(body || html).direction === 'rtl') {
|
|
3318
|
-
x += max(html.clientWidth, body ? body.clientWidth : 0) - width;
|
|
3319
|
-
}
|
|
3320
|
-
|
|
3321
|
-
return {
|
|
3322
|
-
width: width,
|
|
3323
|
-
height: height,
|
|
3324
|
-
x: x,
|
|
3325
|
-
y: y
|
|
3326
|
-
};
|
|
3327
|
-
}
|
|
3328
|
-
|
|
3329
|
-
function isScrollParent(element) {
|
|
3330
|
-
// Firefox wants us to check `-x` and `-y` variations as well
|
|
3331
|
-
var _getComputedStyle = getComputedStyle$1(element),
|
|
3332
|
-
overflow = _getComputedStyle.overflow,
|
|
3333
|
-
overflowX = _getComputedStyle.overflowX,
|
|
3334
|
-
overflowY = _getComputedStyle.overflowY;
|
|
3335
|
-
|
|
3336
|
-
return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
|
|
3337
|
-
}
|
|
3338
|
-
|
|
3339
|
-
function getScrollParent(node) {
|
|
3340
|
-
if (['html', 'body', '#document'].indexOf(getNodeName(node)) >= 0) {
|
|
3341
|
-
// $FlowFixMe[incompatible-return]: assume body is always available
|
|
3342
|
-
return node.ownerDocument.body;
|
|
3343
|
-
}
|
|
3344
|
-
|
|
3345
|
-
if (isHTMLElement(node) && isScrollParent(node)) {
|
|
3346
|
-
return node;
|
|
3347
|
-
}
|
|
3348
|
-
|
|
3349
|
-
return getScrollParent(getParentNode(node));
|
|
3350
|
-
}
|
|
3351
|
-
|
|
3352
|
-
/*
|
|
3353
|
-
given a DOM element, return the list of all scroll parents, up the list of ancesors
|
|
3354
|
-
until we get to the top window object. This list is what we attach scroll listeners
|
|
3355
|
-
to, because if any of these parent elements scroll, we'll need to re-calculate the
|
|
3356
|
-
reference element's position.
|
|
3357
|
-
*/
|
|
3358
|
-
|
|
3359
|
-
function listScrollParents(element, list) {
|
|
3360
|
-
var _element$ownerDocumen;
|
|
3361
|
-
|
|
3362
|
-
if (list === void 0) {
|
|
3363
|
-
list = [];
|
|
3364
|
-
}
|
|
3365
|
-
|
|
3366
|
-
var scrollParent = getScrollParent(element);
|
|
3367
|
-
var isBody = scrollParent === ((_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body);
|
|
3368
|
-
var win = getWindow(scrollParent);
|
|
3369
|
-
var target = isBody ? [win].concat(win.visualViewport || [], isScrollParent(scrollParent) ? scrollParent : []) : scrollParent;
|
|
3370
|
-
var updatedList = list.concat(target);
|
|
3371
|
-
return isBody ? updatedList : // $FlowFixMe[incompatible-call]: isBody tells us target will be an HTMLElement here
|
|
3372
|
-
updatedList.concat(listScrollParents(getParentNode(target)));
|
|
3373
|
-
}
|
|
3374
|
-
|
|
3375
|
-
function rectToClientRect(rect) {
|
|
3376
|
-
return Object.assign({}, rect, {
|
|
3377
|
-
left: rect.x,
|
|
3378
|
-
top: rect.y,
|
|
3379
|
-
right: rect.x + rect.width,
|
|
3380
|
-
bottom: rect.y + rect.height
|
|
3381
|
-
});
|
|
3382
|
-
}
|
|
3383
|
-
|
|
3384
|
-
function getInnerBoundingClientRect(element, strategy) {
|
|
3385
|
-
var rect = getBoundingClientRect(element, false, strategy === 'fixed');
|
|
3386
|
-
rect.top = rect.top + element.clientTop;
|
|
3387
|
-
rect.left = rect.left + element.clientLeft;
|
|
3388
|
-
rect.bottom = rect.top + element.clientHeight;
|
|
3389
|
-
rect.right = rect.left + element.clientWidth;
|
|
3390
|
-
rect.width = element.clientWidth;
|
|
3391
|
-
rect.height = element.clientHeight;
|
|
3392
|
-
rect.x = rect.left;
|
|
3393
|
-
rect.y = rect.top;
|
|
3394
|
-
return rect;
|
|
3395
|
-
}
|
|
3396
|
-
|
|
3397
|
-
function getClientRectFromMixedType(element, clippingParent, strategy) {
|
|
3398
|
-
return clippingParent === viewport ? rectToClientRect(getViewportRect(element, strategy)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent, strategy) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
|
|
3399
|
-
} // A "clipping parent" is an overflowable container with the characteristic of
|
|
3400
|
-
// clipping (or hiding) overflowing elements with a position different from
|
|
3401
|
-
// `initial`
|
|
3402
|
-
|
|
3403
|
-
|
|
3404
|
-
function getClippingParents(element) {
|
|
3405
|
-
var clippingParents = listScrollParents(getParentNode(element));
|
|
3406
|
-
var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle$1(element).position) >= 0;
|
|
3407
|
-
var clipperElement = canEscapeClipping && isHTMLElement(element) ? getOffsetParent(element) : element;
|
|
3408
|
-
|
|
3409
|
-
if (!isElement(clipperElement)) {
|
|
3410
|
-
return [];
|
|
3411
|
-
} // $FlowFixMe[incompatible-return]: https://github.com/facebook/flow/issues/1414
|
|
3412
|
-
|
|
3413
|
-
|
|
3414
|
-
return clippingParents.filter(function (clippingParent) {
|
|
3415
|
-
return isElement(clippingParent) && contains(clippingParent, clipperElement) && getNodeName(clippingParent) !== 'body';
|
|
3416
|
-
});
|
|
3417
|
-
} // Gets the maximum area that the element is visible in due to any number of
|
|
3418
|
-
// clipping parents
|
|
3419
|
-
|
|
3420
|
-
|
|
3421
|
-
function getClippingRect(element, boundary, rootBoundary, strategy) {
|
|
3422
|
-
var mainClippingParents = boundary === 'clippingParents' ? getClippingParents(element) : [].concat(boundary);
|
|
3423
|
-
var clippingParents = [].concat(mainClippingParents, [rootBoundary]);
|
|
3424
|
-
var firstClippingParent = clippingParents[0];
|
|
3425
|
-
var clippingRect = clippingParents.reduce(function (accRect, clippingParent) {
|
|
3426
|
-
var rect = getClientRectFromMixedType(element, clippingParent, strategy);
|
|
3427
|
-
accRect.top = max(rect.top, accRect.top);
|
|
3428
|
-
accRect.right = min(rect.right, accRect.right);
|
|
3429
|
-
accRect.bottom = min(rect.bottom, accRect.bottom);
|
|
3430
|
-
accRect.left = max(rect.left, accRect.left);
|
|
3431
|
-
return accRect;
|
|
3432
|
-
}, getClientRectFromMixedType(element, firstClippingParent, strategy));
|
|
3433
|
-
clippingRect.width = clippingRect.right - clippingRect.left;
|
|
3434
|
-
clippingRect.height = clippingRect.bottom - clippingRect.top;
|
|
3435
|
-
clippingRect.x = clippingRect.left;
|
|
3436
|
-
clippingRect.y = clippingRect.top;
|
|
3437
|
-
return clippingRect;
|
|
3438
|
-
}
|
|
3439
|
-
|
|
3440
|
-
function computeOffsets(_ref) {
|
|
3441
|
-
var reference = _ref.reference,
|
|
3442
|
-
element = _ref.element,
|
|
3443
|
-
placement = _ref.placement;
|
|
3444
|
-
var basePlacement = placement ? getBasePlacement(placement) : null;
|
|
3445
|
-
var variation = placement ? getVariation(placement) : null;
|
|
3446
|
-
var commonX = reference.x + reference.width / 2 - element.width / 2;
|
|
3447
|
-
var commonY = reference.y + reference.height / 2 - element.height / 2;
|
|
3448
|
-
var offsets;
|
|
3449
|
-
|
|
3450
|
-
switch (basePlacement) {
|
|
3451
|
-
case top:
|
|
3452
|
-
offsets = {
|
|
3453
|
-
x: commonX,
|
|
3454
|
-
y: reference.y - element.height
|
|
3455
|
-
};
|
|
3456
|
-
break;
|
|
3457
|
-
|
|
3458
|
-
case bottom:
|
|
3459
|
-
offsets = {
|
|
3460
|
-
x: commonX,
|
|
3461
|
-
y: reference.y + reference.height
|
|
3462
|
-
};
|
|
3463
|
-
break;
|
|
3464
|
-
|
|
3465
|
-
case right:
|
|
3466
|
-
offsets = {
|
|
3467
|
-
x: reference.x + reference.width,
|
|
3468
|
-
y: commonY
|
|
3469
|
-
};
|
|
3470
|
-
break;
|
|
3471
|
-
|
|
3472
|
-
case left:
|
|
3473
|
-
offsets = {
|
|
3474
|
-
x: reference.x - element.width,
|
|
3475
|
-
y: commonY
|
|
3476
|
-
};
|
|
3477
|
-
break;
|
|
3478
|
-
|
|
3479
|
-
default:
|
|
3480
|
-
offsets = {
|
|
3481
|
-
x: reference.x,
|
|
3482
|
-
y: reference.y
|
|
3483
|
-
};
|
|
3484
|
-
}
|
|
3485
|
-
|
|
3486
|
-
var mainAxis = basePlacement ? getMainAxisFromPlacement(basePlacement) : null;
|
|
3487
|
-
|
|
3488
|
-
if (mainAxis != null) {
|
|
3489
|
-
var len = mainAxis === 'y' ? 'height' : 'width';
|
|
3490
|
-
|
|
3491
|
-
switch (variation) {
|
|
3492
|
-
case start:
|
|
3493
|
-
offsets[mainAxis] = offsets[mainAxis] - (reference[len] / 2 - element[len] / 2);
|
|
3494
|
-
break;
|
|
3495
|
-
|
|
3496
|
-
case end:
|
|
3497
|
-
offsets[mainAxis] = offsets[mainAxis] + (reference[len] / 2 - element[len] / 2);
|
|
3498
|
-
break;
|
|
3499
|
-
}
|
|
3500
|
-
}
|
|
3501
|
-
|
|
3502
|
-
return offsets;
|
|
3503
|
-
}
|
|
3504
|
-
|
|
3505
|
-
function detectOverflow(state, options) {
|
|
3506
|
-
if (options === void 0) {
|
|
3507
|
-
options = {};
|
|
3508
|
-
}
|
|
3509
|
-
|
|
3510
|
-
var _options = options,
|
|
3511
|
-
_options$placement = _options.placement,
|
|
3512
|
-
placement = _options$placement === void 0 ? state.placement : _options$placement,
|
|
3513
|
-
_options$strategy = _options.strategy,
|
|
3514
|
-
strategy = _options$strategy === void 0 ? state.strategy : _options$strategy,
|
|
3515
|
-
_options$boundary = _options.boundary,
|
|
3516
|
-
boundary = _options$boundary === void 0 ? clippingParents : _options$boundary,
|
|
3517
|
-
_options$rootBoundary = _options.rootBoundary,
|
|
3518
|
-
rootBoundary = _options$rootBoundary === void 0 ? viewport : _options$rootBoundary,
|
|
3519
|
-
_options$elementConte = _options.elementContext,
|
|
3520
|
-
elementContext = _options$elementConte === void 0 ? popper : _options$elementConte,
|
|
3521
|
-
_options$altBoundary = _options.altBoundary,
|
|
3522
|
-
altBoundary = _options$altBoundary === void 0 ? false : _options$altBoundary,
|
|
3523
|
-
_options$padding = _options.padding,
|
|
3524
|
-
padding = _options$padding === void 0 ? 0 : _options$padding;
|
|
3525
|
-
var paddingObject = mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));
|
|
3526
|
-
var altContext = elementContext === popper ? reference : popper;
|
|
3527
|
-
var popperRect = state.rects.popper;
|
|
3528
|
-
var element = state.elements[altBoundary ? altContext : elementContext];
|
|
3529
|
-
var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary, strategy);
|
|
3530
|
-
var referenceClientRect = getBoundingClientRect(state.elements.reference);
|
|
3531
|
-
var popperOffsets = computeOffsets({
|
|
3532
|
-
reference: referenceClientRect,
|
|
3533
|
-
element: popperRect,
|
|
3534
|
-
strategy: 'absolute',
|
|
3535
|
-
placement: placement
|
|
3536
|
-
});
|
|
3537
|
-
var popperClientRect = rectToClientRect(Object.assign({}, popperRect, popperOffsets));
|
|
3538
|
-
var elementClientRect = elementContext === popper ? popperClientRect : referenceClientRect; // positive = overflowing the clipping rect
|
|
3539
|
-
// 0 or negative = within the clipping rect
|
|
3540
|
-
|
|
3541
|
-
var overflowOffsets = {
|
|
3542
|
-
top: clippingClientRect.top - elementClientRect.top + paddingObject.top,
|
|
3543
|
-
bottom: elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,
|
|
3544
|
-
left: clippingClientRect.left - elementClientRect.left + paddingObject.left,
|
|
3545
|
-
right: elementClientRect.right - clippingClientRect.right + paddingObject.right
|
|
3546
|
-
};
|
|
3547
|
-
var offsetData = state.modifiersData.offset; // Offsets can be applied only to the popper element
|
|
3548
|
-
|
|
3549
|
-
if (elementContext === popper && offsetData) {
|
|
3550
|
-
var offset = offsetData[placement];
|
|
3551
|
-
Object.keys(overflowOffsets).forEach(function (key) {
|
|
3552
|
-
var multiply = [right, bottom].indexOf(key) >= 0 ? 1 : -1;
|
|
3553
|
-
var axis = [top, bottom].indexOf(key) >= 0 ? 'y' : 'x';
|
|
3554
|
-
overflowOffsets[key] += offset[axis] * multiply;
|
|
3555
|
-
});
|
|
3556
|
-
}
|
|
3557
|
-
|
|
3558
|
-
return overflowOffsets;
|
|
3559
|
-
}
|
|
3560
|
-
|
|
3561
|
-
function computeAutoPlacement(state, options) {
|
|
3562
|
-
if (options === void 0) {
|
|
3563
|
-
options = {};
|
|
3564
|
-
}
|
|
3565
|
-
|
|
3566
|
-
var _options = options,
|
|
3567
|
-
placement = _options.placement,
|
|
3568
|
-
boundary = _options.boundary,
|
|
3569
|
-
rootBoundary = _options.rootBoundary,
|
|
3570
|
-
padding = _options.padding,
|
|
3571
|
-
flipVariations = _options.flipVariations,
|
|
3572
|
-
_options$allowedAutoP = _options.allowedAutoPlacements,
|
|
3573
|
-
allowedAutoPlacements = _options$allowedAutoP === void 0 ? placements : _options$allowedAutoP;
|
|
3574
|
-
var variation = getVariation(placement);
|
|
3575
|
-
var placements$1 = variation ? flipVariations ? variationPlacements : variationPlacements.filter(function (placement) {
|
|
3576
|
-
return getVariation(placement) === variation;
|
|
3577
|
-
}) : basePlacements;
|
|
3578
|
-
var allowedPlacements = placements$1.filter(function (placement) {
|
|
3579
|
-
return allowedAutoPlacements.indexOf(placement) >= 0;
|
|
3580
|
-
});
|
|
3581
|
-
|
|
3582
|
-
if (allowedPlacements.length === 0) {
|
|
3583
|
-
allowedPlacements = placements$1;
|
|
3584
|
-
} // $FlowFixMe[incompatible-type]: Flow seems to have problems with two array unions...
|
|
3585
|
-
|
|
3586
|
-
|
|
3587
|
-
var overflows = allowedPlacements.reduce(function (acc, placement) {
|
|
3588
|
-
acc[placement] = detectOverflow(state, {
|
|
3589
|
-
placement: placement,
|
|
3590
|
-
boundary: boundary,
|
|
3591
|
-
rootBoundary: rootBoundary,
|
|
3592
|
-
padding: padding
|
|
3593
|
-
})[getBasePlacement(placement)];
|
|
3594
|
-
return acc;
|
|
3595
|
-
}, {});
|
|
3596
|
-
return Object.keys(overflows).sort(function (a, b) {
|
|
3597
|
-
return overflows[a] - overflows[b];
|
|
3598
|
-
});
|
|
3599
|
-
}
|
|
3600
|
-
|
|
3601
|
-
function getExpandedFallbackPlacements(placement) {
|
|
3602
|
-
if (getBasePlacement(placement) === auto) {
|
|
3603
|
-
return [];
|
|
3604
|
-
}
|
|
3605
|
-
|
|
3606
|
-
var oppositePlacement = getOppositePlacement(placement);
|
|
3607
|
-
return [getOppositeVariationPlacement(placement), oppositePlacement, getOppositeVariationPlacement(oppositePlacement)];
|
|
3608
|
-
}
|
|
3609
|
-
|
|
3610
|
-
function flip(_ref) {
|
|
3611
|
-
var state = _ref.state,
|
|
3612
|
-
options = _ref.options,
|
|
3613
|
-
name = _ref.name;
|
|
3614
|
-
|
|
3615
|
-
if (state.modifiersData[name]._skip) {
|
|
3616
|
-
return;
|
|
3617
|
-
}
|
|
3618
|
-
|
|
3619
|
-
var _options$mainAxis = options.mainAxis,
|
|
3620
|
-
checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,
|
|
3621
|
-
_options$altAxis = options.altAxis,
|
|
3622
|
-
checkAltAxis = _options$altAxis === void 0 ? true : _options$altAxis,
|
|
3623
|
-
specifiedFallbackPlacements = options.fallbackPlacements,
|
|
3624
|
-
padding = options.padding,
|
|
3625
|
-
boundary = options.boundary,
|
|
3626
|
-
rootBoundary = options.rootBoundary,
|
|
3627
|
-
altBoundary = options.altBoundary,
|
|
3628
|
-
_options$flipVariatio = options.flipVariations,
|
|
3629
|
-
flipVariations = _options$flipVariatio === void 0 ? true : _options$flipVariatio,
|
|
3630
|
-
allowedAutoPlacements = options.allowedAutoPlacements;
|
|
3631
|
-
var preferredPlacement = state.options.placement;
|
|
3632
|
-
var basePlacement = getBasePlacement(preferredPlacement);
|
|
3633
|
-
var isBasePlacement = basePlacement === preferredPlacement;
|
|
3634
|
-
var fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipVariations ? [getOppositePlacement(preferredPlacement)] : getExpandedFallbackPlacements(preferredPlacement));
|
|
3635
|
-
var placements = [preferredPlacement].concat(fallbackPlacements).reduce(function (acc, placement) {
|
|
3636
|
-
return acc.concat(getBasePlacement(placement) === auto ? computeAutoPlacement(state, {
|
|
3637
|
-
placement: placement,
|
|
3638
|
-
boundary: boundary,
|
|
3639
|
-
rootBoundary: rootBoundary,
|
|
3640
|
-
padding: padding,
|
|
3641
|
-
flipVariations: flipVariations,
|
|
3642
|
-
allowedAutoPlacements: allowedAutoPlacements
|
|
3643
|
-
}) : placement);
|
|
3644
|
-
}, []);
|
|
3645
|
-
var referenceRect = state.rects.reference;
|
|
3646
|
-
var popperRect = state.rects.popper;
|
|
3647
|
-
var checksMap = new Map();
|
|
3648
|
-
var makeFallbackChecks = true;
|
|
3649
|
-
var firstFittingPlacement = placements[0];
|
|
3650
|
-
|
|
3651
|
-
for (var i = 0; i < placements.length; i++) {
|
|
3652
|
-
var placement = placements[i];
|
|
3653
|
-
|
|
3654
|
-
var _basePlacement = getBasePlacement(placement);
|
|
3655
|
-
|
|
3656
|
-
var isStartVariation = getVariation(placement) === start;
|
|
3657
|
-
var isVertical = [top, bottom].indexOf(_basePlacement) >= 0;
|
|
3658
|
-
var len = isVertical ? 'width' : 'height';
|
|
3659
|
-
var overflow = detectOverflow(state, {
|
|
3660
|
-
placement: placement,
|
|
3661
|
-
boundary: boundary,
|
|
3662
|
-
rootBoundary: rootBoundary,
|
|
3663
|
-
altBoundary: altBoundary,
|
|
3664
|
-
padding: padding
|
|
3665
|
-
});
|
|
3666
|
-
var mainVariationSide = isVertical ? isStartVariation ? right : left : isStartVariation ? bottom : top;
|
|
3667
|
-
|
|
3668
|
-
if (referenceRect[len] > popperRect[len]) {
|
|
3669
|
-
mainVariationSide = getOppositePlacement(mainVariationSide);
|
|
3670
|
-
}
|
|
3671
|
-
|
|
3672
|
-
var altVariationSide = getOppositePlacement(mainVariationSide);
|
|
3673
|
-
var checks = [];
|
|
3674
|
-
|
|
3675
|
-
if (checkMainAxis) {
|
|
3676
|
-
checks.push(overflow[_basePlacement] <= 0);
|
|
3677
|
-
}
|
|
3678
|
-
|
|
3679
|
-
if (checkAltAxis) {
|
|
3680
|
-
checks.push(overflow[mainVariationSide] <= 0, overflow[altVariationSide] <= 0);
|
|
3681
|
-
}
|
|
3682
|
-
|
|
3683
|
-
if (checks.every(function (check) {
|
|
3684
|
-
return check;
|
|
3685
|
-
})) {
|
|
3686
|
-
firstFittingPlacement = placement;
|
|
3687
|
-
makeFallbackChecks = false;
|
|
3688
|
-
break;
|
|
3689
|
-
}
|
|
3690
|
-
|
|
3691
|
-
checksMap.set(placement, checks);
|
|
3692
|
-
}
|
|
3693
|
-
|
|
3694
|
-
if (makeFallbackChecks) {
|
|
3695
|
-
// `2` may be desired in some cases – research later
|
|
3696
|
-
var numberOfChecks = flipVariations ? 3 : 1;
|
|
3697
|
-
|
|
3698
|
-
var _loop = function _loop(_i) {
|
|
3699
|
-
var fittingPlacement = placements.find(function (placement) {
|
|
3700
|
-
var checks = checksMap.get(placement);
|
|
3701
|
-
|
|
3702
|
-
if (checks) {
|
|
3703
|
-
return checks.slice(0, _i).every(function (check) {
|
|
3704
|
-
return check;
|
|
3705
|
-
});
|
|
3706
|
-
}
|
|
3707
|
-
});
|
|
3708
|
-
|
|
3709
|
-
if (fittingPlacement) {
|
|
3710
|
-
firstFittingPlacement = fittingPlacement;
|
|
3711
|
-
return "break";
|
|
3712
|
-
}
|
|
3713
|
-
};
|
|
3714
|
-
|
|
3715
|
-
for (var _i = numberOfChecks; _i > 0; _i--) {
|
|
3716
|
-
var _ret = _loop(_i);
|
|
3717
|
-
|
|
3718
|
-
if (_ret === "break") break;
|
|
3719
|
-
}
|
|
3720
|
-
}
|
|
3721
|
-
|
|
3722
|
-
if (state.placement !== firstFittingPlacement) {
|
|
3723
|
-
state.modifiersData[name]._skip = true;
|
|
3724
|
-
state.placement = firstFittingPlacement;
|
|
3725
|
-
state.reset = true;
|
|
3726
|
-
}
|
|
3727
|
-
} // eslint-disable-next-line import/no-unused-modules
|
|
3728
|
-
|
|
3729
|
-
|
|
3730
|
-
var flip$1 = {
|
|
3731
|
-
name: 'flip',
|
|
3732
|
-
enabled: true,
|
|
3733
|
-
phase: 'main',
|
|
3734
|
-
fn: flip,
|
|
3735
|
-
requiresIfExists: ['offset'],
|
|
3736
|
-
data: {
|
|
3737
|
-
_skip: false
|
|
3738
|
-
}
|
|
3739
|
-
};
|
|
3740
|
-
|
|
3741
|
-
function getSideOffsets(overflow, rect, preventedOffsets) {
|
|
3742
|
-
if (preventedOffsets === void 0) {
|
|
3743
|
-
preventedOffsets = {
|
|
3744
|
-
x: 0,
|
|
3745
|
-
y: 0
|
|
3746
|
-
};
|
|
3747
|
-
}
|
|
3748
|
-
|
|
3749
|
-
return {
|
|
3750
|
-
top: overflow.top - rect.height - preventedOffsets.y,
|
|
3751
|
-
right: overflow.right - rect.width + preventedOffsets.x,
|
|
3752
|
-
bottom: overflow.bottom - rect.height + preventedOffsets.y,
|
|
3753
|
-
left: overflow.left - rect.width - preventedOffsets.x
|
|
3754
|
-
};
|
|
3755
|
-
}
|
|
3756
|
-
|
|
3757
|
-
function isAnySideFullyClipped(overflow) {
|
|
3758
|
-
return [top, right, bottom, left].some(function (side) {
|
|
3759
|
-
return overflow[side] >= 0;
|
|
3760
|
-
});
|
|
3761
|
-
}
|
|
3762
|
-
|
|
3763
|
-
function hide(_ref) {
|
|
3764
|
-
var state = _ref.state,
|
|
3765
|
-
name = _ref.name;
|
|
3766
|
-
var referenceRect = state.rects.reference;
|
|
3767
|
-
var popperRect = state.rects.popper;
|
|
3768
|
-
var preventedOffsets = state.modifiersData.preventOverflow;
|
|
3769
|
-
var referenceOverflow = detectOverflow(state, {
|
|
3770
|
-
elementContext: 'reference'
|
|
3771
|
-
});
|
|
3772
|
-
var popperAltOverflow = detectOverflow(state, {
|
|
3773
|
-
altBoundary: true
|
|
3774
|
-
});
|
|
3775
|
-
var referenceClippingOffsets = getSideOffsets(referenceOverflow, referenceRect);
|
|
3776
|
-
var popperEscapeOffsets = getSideOffsets(popperAltOverflow, popperRect, preventedOffsets);
|
|
3777
|
-
var isReferenceHidden = isAnySideFullyClipped(referenceClippingOffsets);
|
|
3778
|
-
var hasPopperEscaped = isAnySideFullyClipped(popperEscapeOffsets);
|
|
3779
|
-
state.modifiersData[name] = {
|
|
3780
|
-
referenceClippingOffsets: referenceClippingOffsets,
|
|
3781
|
-
popperEscapeOffsets: popperEscapeOffsets,
|
|
3782
|
-
isReferenceHidden: isReferenceHidden,
|
|
3783
|
-
hasPopperEscaped: hasPopperEscaped
|
|
3784
|
-
};
|
|
3785
|
-
state.attributes.popper = Object.assign({}, state.attributes.popper, {
|
|
3786
|
-
'data-popper-reference-hidden': isReferenceHidden,
|
|
3787
|
-
'data-popper-escaped': hasPopperEscaped
|
|
3788
|
-
});
|
|
3789
|
-
} // eslint-disable-next-line import/no-unused-modules
|
|
3790
|
-
|
|
3791
|
-
|
|
3792
|
-
var hide$1 = {
|
|
3793
|
-
name: 'hide',
|
|
3794
|
-
enabled: true,
|
|
3795
|
-
phase: 'main',
|
|
3796
|
-
requiresIfExists: ['preventOverflow'],
|
|
3797
|
-
fn: hide
|
|
3798
|
-
};
|
|
3799
|
-
|
|
3800
|
-
function distanceAndSkiddingToXY(placement, rects, offset) {
|
|
3801
|
-
var basePlacement = getBasePlacement(placement);
|
|
3802
|
-
var invertDistance = [left, top].indexOf(basePlacement) >= 0 ? -1 : 1;
|
|
3803
|
-
|
|
3804
|
-
var _ref = typeof offset === 'function' ? offset(Object.assign({}, rects, {
|
|
3805
|
-
placement: placement
|
|
3806
|
-
})) : offset,
|
|
3807
|
-
skidding = _ref[0],
|
|
3808
|
-
distance = _ref[1];
|
|
3809
|
-
|
|
3810
|
-
skidding = skidding || 0;
|
|
3811
|
-
distance = (distance || 0) * invertDistance;
|
|
3812
|
-
return [left, right].indexOf(basePlacement) >= 0 ? {
|
|
3813
|
-
x: distance,
|
|
3814
|
-
y: skidding
|
|
3815
|
-
} : {
|
|
3816
|
-
x: skidding,
|
|
3817
|
-
y: distance
|
|
3818
|
-
};
|
|
3819
|
-
}
|
|
3820
|
-
|
|
3821
|
-
function offset(_ref2) {
|
|
3822
|
-
var state = _ref2.state,
|
|
3823
|
-
options = _ref2.options,
|
|
3824
|
-
name = _ref2.name;
|
|
3825
|
-
var _options$offset = options.offset,
|
|
3826
|
-
offset = _options$offset === void 0 ? [0, 0] : _options$offset;
|
|
3827
|
-
var data = placements.reduce(function (acc, placement) {
|
|
3828
|
-
acc[placement] = distanceAndSkiddingToXY(placement, state.rects, offset);
|
|
3829
|
-
return acc;
|
|
3830
|
-
}, {});
|
|
3831
|
-
var _data$state$placement = data[state.placement],
|
|
3832
|
-
x = _data$state$placement.x,
|
|
3833
|
-
y = _data$state$placement.y;
|
|
3834
|
-
|
|
3835
|
-
if (state.modifiersData.popperOffsets != null) {
|
|
3836
|
-
state.modifiersData.popperOffsets.x += x;
|
|
3837
|
-
state.modifiersData.popperOffsets.y += y;
|
|
3838
|
-
}
|
|
3839
|
-
|
|
3840
|
-
state.modifiersData[name] = data;
|
|
3841
|
-
} // eslint-disable-next-line import/no-unused-modules
|
|
3842
|
-
|
|
3843
|
-
|
|
3844
|
-
var offset$1 = {
|
|
3845
|
-
name: 'offset',
|
|
3846
|
-
enabled: true,
|
|
3847
|
-
phase: 'main',
|
|
3848
|
-
requires: ['popperOffsets'],
|
|
3849
|
-
fn: offset
|
|
3850
|
-
};
|
|
3851
|
-
|
|
3852
|
-
function popperOffsets(_ref) {
|
|
3853
|
-
var state = _ref.state,
|
|
3854
|
-
name = _ref.name;
|
|
3855
|
-
// Offsets are the actual position the popper needs to have to be
|
|
3856
|
-
// properly positioned near its reference element
|
|
3857
|
-
// This is the most basic placement, and will be adjusted by
|
|
3858
|
-
// the modifiers in the next step
|
|
3859
|
-
state.modifiersData[name] = computeOffsets({
|
|
3860
|
-
reference: state.rects.reference,
|
|
3861
|
-
element: state.rects.popper,
|
|
3862
|
-
strategy: 'absolute',
|
|
3863
|
-
placement: state.placement
|
|
3864
|
-
});
|
|
3865
|
-
} // eslint-disable-next-line import/no-unused-modules
|
|
3866
|
-
|
|
3867
|
-
|
|
3868
|
-
var popperOffsets$1 = {
|
|
3869
|
-
name: 'popperOffsets',
|
|
3870
|
-
enabled: true,
|
|
3871
|
-
phase: 'read',
|
|
3872
|
-
fn: popperOffsets,
|
|
3873
|
-
data: {}
|
|
3874
|
-
};
|
|
3875
|
-
|
|
3876
|
-
function getAltAxis(axis) {
|
|
3877
|
-
return axis === 'x' ? 'y' : 'x';
|
|
3878
|
-
}
|
|
3879
|
-
|
|
3880
|
-
function preventOverflow(_ref) {
|
|
3881
|
-
var state = _ref.state,
|
|
3882
|
-
options = _ref.options,
|
|
3883
|
-
name = _ref.name;
|
|
3884
|
-
var _options$mainAxis = options.mainAxis,
|
|
3885
|
-
checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,
|
|
3886
|
-
_options$altAxis = options.altAxis,
|
|
3887
|
-
checkAltAxis = _options$altAxis === void 0 ? false : _options$altAxis,
|
|
3888
|
-
boundary = options.boundary,
|
|
3889
|
-
rootBoundary = options.rootBoundary,
|
|
3890
|
-
altBoundary = options.altBoundary,
|
|
3891
|
-
padding = options.padding,
|
|
3892
|
-
_options$tether = options.tether,
|
|
3893
|
-
tether = _options$tether === void 0 ? true : _options$tether,
|
|
3894
|
-
_options$tetherOffset = options.tetherOffset,
|
|
3895
|
-
tetherOffset = _options$tetherOffset === void 0 ? 0 : _options$tetherOffset;
|
|
3896
|
-
var overflow = detectOverflow(state, {
|
|
3897
|
-
boundary: boundary,
|
|
3898
|
-
rootBoundary: rootBoundary,
|
|
3899
|
-
padding: padding,
|
|
3900
|
-
altBoundary: altBoundary
|
|
3901
|
-
});
|
|
3902
|
-
var basePlacement = getBasePlacement(state.placement);
|
|
3903
|
-
var variation = getVariation(state.placement);
|
|
3904
|
-
var isBasePlacement = !variation;
|
|
3905
|
-
var mainAxis = getMainAxisFromPlacement(basePlacement);
|
|
3906
|
-
var altAxis = getAltAxis(mainAxis);
|
|
3907
|
-
var popperOffsets = state.modifiersData.popperOffsets;
|
|
3908
|
-
var referenceRect = state.rects.reference;
|
|
3909
|
-
var popperRect = state.rects.popper;
|
|
3910
|
-
var tetherOffsetValue = typeof tetherOffset === 'function' ? tetherOffset(Object.assign({}, state.rects, {
|
|
3911
|
-
placement: state.placement
|
|
3912
|
-
})) : tetherOffset;
|
|
3913
|
-
var normalizedTetherOffsetValue = typeof tetherOffsetValue === 'number' ? {
|
|
3914
|
-
mainAxis: tetherOffsetValue,
|
|
3915
|
-
altAxis: tetherOffsetValue
|
|
3916
|
-
} : Object.assign({
|
|
3917
|
-
mainAxis: 0,
|
|
3918
|
-
altAxis: 0
|
|
3919
|
-
}, tetherOffsetValue);
|
|
3920
|
-
var offsetModifierState = state.modifiersData.offset ? state.modifiersData.offset[state.placement] : null;
|
|
3921
|
-
var data = {
|
|
3922
|
-
x: 0,
|
|
3923
|
-
y: 0
|
|
3924
|
-
};
|
|
3925
|
-
|
|
3926
|
-
if (!popperOffsets) {
|
|
3927
|
-
return;
|
|
3928
|
-
}
|
|
3929
|
-
|
|
3930
|
-
if (checkMainAxis) {
|
|
3931
|
-
var _offsetModifierState$;
|
|
3932
|
-
|
|
3933
|
-
var mainSide = mainAxis === 'y' ? top : left;
|
|
3934
|
-
var altSide = mainAxis === 'y' ? bottom : right;
|
|
3935
|
-
var len = mainAxis === 'y' ? 'height' : 'width';
|
|
3936
|
-
var offset = popperOffsets[mainAxis];
|
|
3937
|
-
var min$1 = offset + overflow[mainSide];
|
|
3938
|
-
var max$1 = offset - overflow[altSide];
|
|
3939
|
-
var additive = tether ? -popperRect[len] / 2 : 0;
|
|
3940
|
-
var minLen = variation === start ? referenceRect[len] : popperRect[len];
|
|
3941
|
-
var maxLen = variation === start ? -popperRect[len] : -referenceRect[len]; // We need to include the arrow in the calculation so the arrow doesn't go
|
|
3942
|
-
// outside the reference bounds
|
|
3943
|
-
|
|
3944
|
-
var arrowElement = state.elements.arrow;
|
|
3945
|
-
var arrowRect = tether && arrowElement ? getLayoutRect(arrowElement) : {
|
|
3946
|
-
width: 0,
|
|
3947
|
-
height: 0
|
|
3948
|
-
};
|
|
3949
|
-
var arrowPaddingObject = state.modifiersData['arrow#persistent'] ? state.modifiersData['arrow#persistent'].padding : getFreshSideObject();
|
|
3950
|
-
var arrowPaddingMin = arrowPaddingObject[mainSide];
|
|
3951
|
-
var arrowPaddingMax = arrowPaddingObject[altSide]; // If the reference length is smaller than the arrow length, we don't want
|
|
3952
|
-
// to include its full size in the calculation. If the reference is small
|
|
3953
|
-
// and near the edge of a boundary, the popper can overflow even if the
|
|
3954
|
-
// reference is not overflowing as well (e.g. virtual elements with no
|
|
3955
|
-
// width or height)
|
|
3956
|
-
|
|
3957
|
-
var arrowLen = within(0, referenceRect[len], arrowRect[len]);
|
|
3958
|
-
var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis : minLen - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis;
|
|
3959
|
-
var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis : maxLen + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis;
|
|
3960
|
-
var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);
|
|
3961
|
-
var clientOffset = arrowOffsetParent ? mainAxis === 'y' ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;
|
|
3962
|
-
var offsetModifierValue = (_offsetModifierState$ = offsetModifierState == null ? void 0 : offsetModifierState[mainAxis]) != null ? _offsetModifierState$ : 0;
|
|
3963
|
-
var tetherMin = offset + minOffset - offsetModifierValue - clientOffset;
|
|
3964
|
-
var tetherMax = offset + maxOffset - offsetModifierValue;
|
|
3965
|
-
var preventedOffset = within(tether ? min(min$1, tetherMin) : min$1, offset, tether ? max(max$1, tetherMax) : max$1);
|
|
3966
|
-
popperOffsets[mainAxis] = preventedOffset;
|
|
3967
|
-
data[mainAxis] = preventedOffset - offset;
|
|
3968
|
-
}
|
|
3969
|
-
|
|
3970
|
-
if (checkAltAxis) {
|
|
3971
|
-
var _offsetModifierState$2;
|
|
3972
|
-
|
|
3973
|
-
var _mainSide = mainAxis === 'x' ? top : left;
|
|
3974
|
-
|
|
3975
|
-
var _altSide = mainAxis === 'x' ? bottom : right;
|
|
3976
|
-
|
|
3977
|
-
var _offset = popperOffsets[altAxis];
|
|
3978
|
-
|
|
3979
|
-
var _len = altAxis === 'y' ? 'height' : 'width';
|
|
3980
|
-
|
|
3981
|
-
var _min = _offset + overflow[_mainSide];
|
|
3982
|
-
|
|
3983
|
-
var _max = _offset - overflow[_altSide];
|
|
3984
|
-
|
|
3985
|
-
var isOriginSide = [top, left].indexOf(basePlacement) !== -1;
|
|
3986
|
-
|
|
3987
|
-
var _offsetModifierValue = (_offsetModifierState$2 = offsetModifierState == null ? void 0 : offsetModifierState[altAxis]) != null ? _offsetModifierState$2 : 0;
|
|
3988
|
-
|
|
3989
|
-
var _tetherMin = isOriginSide ? _min : _offset - referenceRect[_len] - popperRect[_len] - _offsetModifierValue + normalizedTetherOffsetValue.altAxis;
|
|
3990
|
-
|
|
3991
|
-
var _tetherMax = isOriginSide ? _offset + referenceRect[_len] + popperRect[_len] - _offsetModifierValue - normalizedTetherOffsetValue.altAxis : _max;
|
|
3992
|
-
|
|
3993
|
-
var _preventedOffset = tether && isOriginSide ? withinMaxClamp(_tetherMin, _offset, _tetherMax) : within(tether ? _tetherMin : _min, _offset, tether ? _tetherMax : _max);
|
|
3994
|
-
|
|
3995
|
-
popperOffsets[altAxis] = _preventedOffset;
|
|
3996
|
-
data[altAxis] = _preventedOffset - _offset;
|
|
3997
|
-
}
|
|
3998
|
-
|
|
3999
|
-
state.modifiersData[name] = data;
|
|
4000
|
-
} // eslint-disable-next-line import/no-unused-modules
|
|
4001
|
-
|
|
4002
|
-
|
|
4003
|
-
var preventOverflow$1 = {
|
|
4004
|
-
name: 'preventOverflow',
|
|
4005
|
-
enabled: true,
|
|
4006
|
-
phase: 'main',
|
|
4007
|
-
fn: preventOverflow,
|
|
4008
|
-
requiresIfExists: ['offset']
|
|
4009
|
-
};
|
|
4010
|
-
|
|
4011
|
-
function getHTMLElementScroll(element) {
|
|
4012
|
-
return {
|
|
4013
|
-
scrollLeft: element.scrollLeft,
|
|
4014
|
-
scrollTop: element.scrollTop
|
|
4015
|
-
};
|
|
4016
|
-
}
|
|
4017
|
-
|
|
4018
|
-
function getNodeScroll(node) {
|
|
4019
|
-
if (node === getWindow(node) || !isHTMLElement(node)) {
|
|
4020
|
-
return getWindowScroll(node);
|
|
4021
|
-
} else {
|
|
4022
|
-
return getHTMLElementScroll(node);
|
|
4023
|
-
}
|
|
4024
|
-
}
|
|
4025
|
-
|
|
4026
|
-
function isElementScaled(element) {
|
|
4027
|
-
var rect = element.getBoundingClientRect();
|
|
4028
|
-
var scaleX = round(rect.width) / element.offsetWidth || 1;
|
|
4029
|
-
var scaleY = round(rect.height) / element.offsetHeight || 1;
|
|
4030
|
-
return scaleX !== 1 || scaleY !== 1;
|
|
4031
|
-
} // Returns the composite rect of an element relative to its offsetParent.
|
|
4032
|
-
// Composite means it takes into account transforms as well as layout.
|
|
4033
|
-
|
|
4034
|
-
|
|
4035
|
-
function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
|
|
4036
|
-
if (isFixed === void 0) {
|
|
4037
|
-
isFixed = false;
|
|
4038
|
-
}
|
|
4039
|
-
|
|
4040
|
-
var isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
4041
|
-
var offsetParentIsScaled = isHTMLElement(offsetParent) && isElementScaled(offsetParent);
|
|
4042
|
-
var documentElement = getDocumentElement(offsetParent);
|
|
4043
|
-
var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled, isFixed);
|
|
4044
|
-
var scroll = {
|
|
4045
|
-
scrollLeft: 0,
|
|
4046
|
-
scrollTop: 0
|
|
4047
|
-
};
|
|
4048
|
-
var offsets = {
|
|
4049
|
-
x: 0,
|
|
4050
|
-
y: 0
|
|
4051
|
-
};
|
|
4052
|
-
|
|
4053
|
-
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
4054
|
-
if (getNodeName(offsetParent) !== 'body' || // https://github.com/popperjs/popper-core/issues/1078
|
|
4055
|
-
isScrollParent(documentElement)) {
|
|
4056
|
-
scroll = getNodeScroll(offsetParent);
|
|
4057
|
-
}
|
|
4058
|
-
|
|
4059
|
-
if (isHTMLElement(offsetParent)) {
|
|
4060
|
-
offsets = getBoundingClientRect(offsetParent, true);
|
|
4061
|
-
offsets.x += offsetParent.clientLeft;
|
|
4062
|
-
offsets.y += offsetParent.clientTop;
|
|
4063
|
-
} else if (documentElement) {
|
|
4064
|
-
offsets.x = getWindowScrollBarX(documentElement);
|
|
4065
|
-
}
|
|
4066
|
-
}
|
|
4067
|
-
|
|
4068
|
-
return {
|
|
4069
|
-
x: rect.left + scroll.scrollLeft - offsets.x,
|
|
4070
|
-
y: rect.top + scroll.scrollTop - offsets.y,
|
|
4071
|
-
width: rect.width,
|
|
4072
|
-
height: rect.height
|
|
4073
|
-
};
|
|
4074
|
-
}
|
|
4075
|
-
|
|
4076
|
-
function order(modifiers) {
|
|
4077
|
-
var map = new Map();
|
|
4078
|
-
var visited = new Set();
|
|
4079
|
-
var result = [];
|
|
4080
|
-
modifiers.forEach(function (modifier) {
|
|
4081
|
-
map.set(modifier.name, modifier);
|
|
4082
|
-
}); // On visiting object, check for its dependencies and visit them recursively
|
|
4083
|
-
|
|
4084
|
-
function sort(modifier) {
|
|
4085
|
-
visited.add(modifier.name);
|
|
4086
|
-
var requires = [].concat(modifier.requires || [], modifier.requiresIfExists || []);
|
|
4087
|
-
requires.forEach(function (dep) {
|
|
4088
|
-
if (!visited.has(dep)) {
|
|
4089
|
-
var depModifier = map.get(dep);
|
|
4090
|
-
|
|
4091
|
-
if (depModifier) {
|
|
4092
|
-
sort(depModifier);
|
|
4093
|
-
}
|
|
4094
|
-
}
|
|
4095
|
-
});
|
|
4096
|
-
result.push(modifier);
|
|
4097
|
-
}
|
|
4098
|
-
|
|
4099
|
-
modifiers.forEach(function (modifier) {
|
|
4100
|
-
if (!visited.has(modifier.name)) {
|
|
4101
|
-
// check for visited object
|
|
4102
|
-
sort(modifier);
|
|
4103
|
-
}
|
|
4104
|
-
});
|
|
4105
|
-
return result;
|
|
4106
|
-
}
|
|
4107
|
-
|
|
4108
|
-
function orderModifiers(modifiers) {
|
|
4109
|
-
// order based on dependencies
|
|
4110
|
-
var orderedModifiers = order(modifiers); // order based on phase
|
|
4111
|
-
|
|
4112
|
-
return modifierPhases.reduce(function (acc, phase) {
|
|
4113
|
-
return acc.concat(orderedModifiers.filter(function (modifier) {
|
|
4114
|
-
return modifier.phase === phase;
|
|
4115
|
-
}));
|
|
4116
|
-
}, []);
|
|
4117
|
-
}
|
|
4118
|
-
|
|
4119
|
-
function debounce(fn) {
|
|
4120
|
-
var pending;
|
|
4121
|
-
return function () {
|
|
4122
|
-
if (!pending) {
|
|
4123
|
-
pending = new Promise(function (resolve) {
|
|
4124
|
-
Promise.resolve().then(function () {
|
|
4125
|
-
pending = undefined;
|
|
4126
|
-
resolve(fn());
|
|
4127
|
-
});
|
|
4128
|
-
});
|
|
4129
|
-
}
|
|
4130
|
-
|
|
4131
|
-
return pending;
|
|
4132
|
-
};
|
|
4133
|
-
}
|
|
4134
|
-
|
|
4135
|
-
function mergeByName(modifiers) {
|
|
4136
|
-
var merged = modifiers.reduce(function (merged, current) {
|
|
4137
|
-
var existing = merged[current.name];
|
|
4138
|
-
merged[current.name] = existing ? Object.assign({}, existing, current, {
|
|
4139
|
-
options: Object.assign({}, existing.options, current.options),
|
|
4140
|
-
data: Object.assign({}, existing.data, current.data)
|
|
4141
|
-
}) : current;
|
|
4142
|
-
return merged;
|
|
4143
|
-
}, {}); // IE11 does not support Object.values
|
|
4144
|
-
|
|
4145
|
-
return Object.keys(merged).map(function (key) {
|
|
4146
|
-
return merged[key];
|
|
4147
|
-
});
|
|
4148
|
-
}
|
|
4149
|
-
|
|
4150
|
-
var DEFAULT_OPTIONS = {
|
|
4151
|
-
placement: 'bottom',
|
|
4152
|
-
modifiers: [],
|
|
4153
|
-
strategy: 'absolute'
|
|
4154
|
-
};
|
|
4155
|
-
|
|
4156
|
-
function areValidElements() {
|
|
4157
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
4158
|
-
args[_key] = arguments[_key];
|
|
4159
|
-
}
|
|
4160
|
-
|
|
4161
|
-
return !args.some(function (element) {
|
|
4162
|
-
return !(element && typeof element.getBoundingClientRect === 'function');
|
|
4163
|
-
});
|
|
4164
|
-
}
|
|
4165
|
-
|
|
4166
|
-
function popperGenerator(generatorOptions) {
|
|
4167
|
-
if (generatorOptions === void 0) {
|
|
4168
|
-
generatorOptions = {};
|
|
4169
|
-
}
|
|
4170
|
-
|
|
4171
|
-
var _generatorOptions = generatorOptions,
|
|
4172
|
-
_generatorOptions$def = _generatorOptions.defaultModifiers,
|
|
4173
|
-
defaultModifiers = _generatorOptions$def === void 0 ? [] : _generatorOptions$def,
|
|
4174
|
-
_generatorOptions$def2 = _generatorOptions.defaultOptions,
|
|
4175
|
-
defaultOptions = _generatorOptions$def2 === void 0 ? DEFAULT_OPTIONS : _generatorOptions$def2;
|
|
4176
|
-
return function createPopper(reference, popper, options) {
|
|
4177
|
-
if (options === void 0) {
|
|
4178
|
-
options = defaultOptions;
|
|
4179
|
-
}
|
|
4180
|
-
|
|
4181
|
-
var state = {
|
|
4182
|
-
placement: 'bottom',
|
|
4183
|
-
orderedModifiers: [],
|
|
4184
|
-
options: Object.assign({}, DEFAULT_OPTIONS, defaultOptions),
|
|
4185
|
-
modifiersData: {},
|
|
4186
|
-
elements: {
|
|
4187
|
-
reference: reference,
|
|
4188
|
-
popper: popper
|
|
4189
|
-
},
|
|
4190
|
-
attributes: {},
|
|
4191
|
-
styles: {}
|
|
4192
|
-
};
|
|
4193
|
-
var effectCleanupFns = [];
|
|
4194
|
-
var isDestroyed = false;
|
|
4195
|
-
var instance = {
|
|
4196
|
-
state: state,
|
|
4197
|
-
setOptions: function setOptions(setOptionsAction) {
|
|
4198
|
-
var options = typeof setOptionsAction === 'function' ? setOptionsAction(state.options) : setOptionsAction;
|
|
4199
|
-
cleanupModifierEffects();
|
|
4200
|
-
state.options = Object.assign({}, defaultOptions, state.options, options);
|
|
4201
|
-
state.scrollParents = {
|
|
4202
|
-
reference: isElement(reference) ? listScrollParents(reference) : reference.contextElement ? listScrollParents(reference.contextElement) : [],
|
|
4203
|
-
popper: listScrollParents(popper)
|
|
4204
|
-
}; // Orders the modifiers based on their dependencies and `phase`
|
|
4205
|
-
// properties
|
|
4206
|
-
|
|
4207
|
-
var orderedModifiers = orderModifiers(mergeByName([].concat(defaultModifiers, state.options.modifiers))); // Strip out disabled modifiers
|
|
4208
|
-
|
|
4209
|
-
state.orderedModifiers = orderedModifiers.filter(function (m) {
|
|
4210
|
-
return m.enabled;
|
|
4211
|
-
});
|
|
4212
|
-
runModifierEffects();
|
|
4213
|
-
return instance.update();
|
|
4214
|
-
},
|
|
4215
|
-
// Sync update – it will always be executed, even if not necessary. This
|
|
4216
|
-
// is useful for low frequency updates where sync behavior simplifies the
|
|
4217
|
-
// logic.
|
|
4218
|
-
// For high frequency updates (e.g. `resize` and `scroll` events), always
|
|
4219
|
-
// prefer the async Popper#update method
|
|
4220
|
-
forceUpdate: function forceUpdate() {
|
|
4221
|
-
if (isDestroyed) {
|
|
4222
|
-
return;
|
|
4223
|
-
}
|
|
4224
|
-
|
|
4225
|
-
var _state$elements = state.elements,
|
|
4226
|
-
reference = _state$elements.reference,
|
|
4227
|
-
popper = _state$elements.popper; // Don't proceed if `reference` or `popper` are not valid elements
|
|
4228
|
-
// anymore
|
|
4229
|
-
|
|
4230
|
-
if (!areValidElements(reference, popper)) {
|
|
4231
|
-
return;
|
|
4232
|
-
} // Store the reference and popper rects to be read by modifiers
|
|
4233
|
-
|
|
4234
|
-
|
|
4235
|
-
state.rects = {
|
|
4236
|
-
reference: getCompositeRect(reference, getOffsetParent(popper), state.options.strategy === 'fixed'),
|
|
4237
|
-
popper: getLayoutRect(popper)
|
|
4238
|
-
}; // Modifiers have the ability to reset the current update cycle. The
|
|
4239
|
-
// most common use case for this is the `flip` modifier changing the
|
|
4240
|
-
// placement, which then needs to re-run all the modifiers, because the
|
|
4241
|
-
// logic was previously ran for the previous placement and is therefore
|
|
4242
|
-
// stale/incorrect
|
|
4243
|
-
|
|
4244
|
-
state.reset = false;
|
|
4245
|
-
state.placement = state.options.placement; // On each update cycle, the `modifiersData` property for each modifier
|
|
4246
|
-
// is filled with the initial data specified by the modifier. This means
|
|
4247
|
-
// it doesn't persist and is fresh on each update.
|
|
4248
|
-
// To ensure persistent data, use `${name}#persistent`
|
|
4249
|
-
|
|
4250
|
-
state.orderedModifiers.forEach(function (modifier) {
|
|
4251
|
-
return state.modifiersData[modifier.name] = Object.assign({}, modifier.data);
|
|
4252
|
-
});
|
|
4253
|
-
|
|
4254
|
-
for (var index = 0; index < state.orderedModifiers.length; index++) {
|
|
4255
|
-
if (state.reset === true) {
|
|
4256
|
-
state.reset = false;
|
|
4257
|
-
index = -1;
|
|
4258
|
-
continue;
|
|
4259
|
-
}
|
|
4260
|
-
|
|
4261
|
-
var _state$orderedModifie = state.orderedModifiers[index],
|
|
4262
|
-
fn = _state$orderedModifie.fn,
|
|
4263
|
-
_state$orderedModifie2 = _state$orderedModifie.options,
|
|
4264
|
-
_options = _state$orderedModifie2 === void 0 ? {} : _state$orderedModifie2,
|
|
4265
|
-
name = _state$orderedModifie.name;
|
|
4266
|
-
|
|
4267
|
-
if (typeof fn === 'function') {
|
|
4268
|
-
state = fn({
|
|
4269
|
-
state: state,
|
|
4270
|
-
options: _options,
|
|
4271
|
-
name: name,
|
|
4272
|
-
instance: instance
|
|
4273
|
-
}) || state;
|
|
4274
|
-
}
|
|
4275
|
-
}
|
|
4276
|
-
},
|
|
4277
|
-
// Async and optimistically optimized update – it will not be executed if
|
|
4278
|
-
// not necessary (debounced to run at most once-per-tick)
|
|
4279
|
-
update: debounce(function () {
|
|
4280
|
-
return new Promise(function (resolve) {
|
|
4281
|
-
instance.forceUpdate();
|
|
4282
|
-
resolve(state);
|
|
4283
|
-
});
|
|
4284
|
-
}),
|
|
4285
|
-
destroy: function destroy() {
|
|
4286
|
-
cleanupModifierEffects();
|
|
4287
|
-
isDestroyed = true;
|
|
4288
|
-
}
|
|
4289
|
-
};
|
|
4290
|
-
|
|
4291
|
-
if (!areValidElements(reference, popper)) {
|
|
4292
|
-
return instance;
|
|
4293
|
-
}
|
|
4294
|
-
|
|
4295
|
-
instance.setOptions(options).then(function (state) {
|
|
4296
|
-
if (!isDestroyed && options.onFirstUpdate) {
|
|
4297
|
-
options.onFirstUpdate(state);
|
|
4298
|
-
}
|
|
4299
|
-
}); // Modifiers have the ability to execute arbitrary code before the first
|
|
4300
|
-
// update cycle runs. They will be executed in the same order as the update
|
|
4301
|
-
// cycle. This is useful when a modifier adds some persistent data that
|
|
4302
|
-
// other modifiers need to use, but the modifier is run after the dependent
|
|
4303
|
-
// one.
|
|
4304
|
-
|
|
4305
|
-
function runModifierEffects() {
|
|
4306
|
-
state.orderedModifiers.forEach(function (_ref) {
|
|
4307
|
-
var name = _ref.name,
|
|
4308
|
-
_ref$options = _ref.options,
|
|
4309
|
-
options = _ref$options === void 0 ? {} : _ref$options,
|
|
4310
|
-
effect = _ref.effect;
|
|
4311
|
-
|
|
4312
|
-
if (typeof effect === 'function') {
|
|
4313
|
-
var cleanupFn = effect({
|
|
4314
|
-
state: state,
|
|
4315
|
-
name: name,
|
|
4316
|
-
instance: instance,
|
|
4317
|
-
options: options
|
|
4318
|
-
});
|
|
4319
|
-
|
|
4320
|
-
var noopFn = function noopFn() {};
|
|
4321
|
-
|
|
4322
|
-
effectCleanupFns.push(cleanupFn || noopFn);
|
|
4323
|
-
}
|
|
4324
|
-
});
|
|
4325
|
-
}
|
|
4326
|
-
|
|
4327
|
-
function cleanupModifierEffects() {
|
|
4328
|
-
effectCleanupFns.forEach(function (fn) {
|
|
4329
|
-
return fn();
|
|
4330
|
-
});
|
|
4331
|
-
effectCleanupFns = [];
|
|
4332
|
-
}
|
|
4333
|
-
|
|
4334
|
-
return instance;
|
|
4335
|
-
};
|
|
4336
|
-
}
|
|
4337
|
-
|
|
4338
|
-
var defaultModifiers = [eventListeners, popperOffsets$1, computeStyles$1, applyStyles$1, offset$1, flip$1, preventOverflow$1, arrow$1, hide$1];
|
|
4339
|
-
var createPopper = /*#__PURE__*/popperGenerator({
|
|
4340
|
-
defaultModifiers: defaultModifiers
|
|
4341
|
-
}); // eslint-disable-next-line import/no-unused-modules
|
|
4342
|
-
|
|
4343
|
-
var deregister = function deregister(obj) {
|
|
4344
|
-
try {
|
|
4345
|
-
var _this = this;
|
|
4346
|
-
// Return collection if nothing was passed.
|
|
4347
|
-
if (!obj) return Promise.resolve(_this.collection);
|
|
4348
|
-
|
|
4349
|
-
// Check if entry has been registered in the collection.
|
|
4350
|
-
var index = _this.collection.findIndex(function (entry) {
|
|
4351
|
-
return entry.id === obj.id;
|
|
4352
|
-
});
|
|
4353
|
-
if (index >= 0) {
|
|
4354
|
-
// Get the collection entry.
|
|
4355
|
-
var entry = _this.collection[index];
|
|
4356
|
-
|
|
4357
|
-
// If entry is in the opened state, close it.
|
|
4358
|
-
if (entry.state === 'opened') {
|
|
4359
|
-
entry.close();
|
|
4360
|
-
}
|
|
4361
|
-
|
|
4362
|
-
// Clean up the popper instance.
|
|
4363
|
-
entry.popper.destroy();
|
|
4364
|
-
|
|
4365
|
-
// Remove event listeners.
|
|
4366
|
-
deregisterEventListeners(entry);
|
|
4367
|
-
|
|
4368
|
-
// Delete properties from collection entry.
|
|
4369
|
-
Object.getOwnPropertyNames(entry).forEach(function (prop) {
|
|
4370
|
-
delete entry[prop];
|
|
4371
|
-
});
|
|
4372
|
-
|
|
4373
|
-
// Remove entry from collection.
|
|
4374
|
-
_this.collection.splice(index, 1);
|
|
4375
|
-
}
|
|
4376
|
-
|
|
4377
|
-
// Return the modified collection.
|
|
4378
|
-
return Promise.resolve(_this.collection);
|
|
4379
|
-
} catch (e) {
|
|
4380
|
-
return Promise.reject(e);
|
|
4381
|
-
}
|
|
4382
|
-
};
|
|
4383
|
-
function deregisterEventListeners(entry) {
|
|
4384
|
-
// If event listeners have been setup.
|
|
4385
|
-
if (entry.__eventListeners) {
|
|
4386
|
-
// Loop through listeners and remove from the appropriate elements.
|
|
4387
|
-
entry.__eventListeners.forEach(function (evObj) {
|
|
4388
|
-
evObj.el.forEach(function (el) {
|
|
4389
|
-
evObj.type.forEach(function (type) {
|
|
4390
|
-
entry[el].removeEventListener(type, evObj.listener, false);
|
|
4391
|
-
});
|
|
4392
|
-
});
|
|
4393
|
-
});
|
|
4394
|
-
|
|
4395
|
-
// Remove eventListeners object from collection.
|
|
4396
|
-
delete entry.__eventListeners;
|
|
4397
|
-
}
|
|
4398
|
-
|
|
4399
|
-
// Return the entry object.
|
|
4400
|
-
return entry;
|
|
4401
|
-
}
|
|
4402
|
-
|
|
4403
|
-
var open = function open(query) {
|
|
4404
|
-
try {
|
|
4405
|
-
var _this = this;
|
|
4406
|
-
// Get the popover from collection.
|
|
4407
|
-
var popover = getPopover.call(_this, query);
|
|
4408
|
-
|
|
4409
|
-
// Update state class.
|
|
4410
|
-
popover.el.classList.add(_this.settings.stateActive);
|
|
4411
|
-
|
|
4412
|
-
// Update accessibility attribute(s).
|
|
4413
|
-
if (popover.trigger.hasAttribute('aria-controls')) {
|
|
4414
|
-
popover.trigger.setAttribute('aria-expanded', 'true');
|
|
4415
|
-
}
|
|
4416
|
-
|
|
4417
|
-
// Update popover config.
|
|
4418
|
-
popover.config = getConfig(popover.el, _this.settings);
|
|
4419
|
-
|
|
4420
|
-
// Enable popper event listeners and set placement/modifiers.
|
|
4421
|
-
popover.popper.setOptions({
|
|
4422
|
-
placement: popover.config['placement'],
|
|
4423
|
-
modifiers: [{
|
|
4424
|
-
name: 'eventListeners',
|
|
4425
|
-
enabled: true
|
|
4426
|
-
}].concat(getModifiers(popover.config))
|
|
4427
|
-
});
|
|
4428
|
-
|
|
4429
|
-
// Update popover position.
|
|
4430
|
-
popover.popper.update();
|
|
4431
|
-
|
|
4432
|
-
// Update popover state.
|
|
4433
|
-
popover.state = 'opened';
|
|
4434
|
-
|
|
4435
|
-
// Return the popover.
|
|
4436
|
-
return Promise.resolve(popover);
|
|
4437
|
-
} catch (e) {
|
|
4438
|
-
return Promise.reject(e);
|
|
4439
|
-
}
|
|
4440
|
-
};
|
|
4441
|
-
|
|
4442
|
-
var register = function register(el, trigger) {
|
|
4443
|
-
try {
|
|
4444
|
-
var _this = this;
|
|
4445
|
-
// Deregister entry incase it has already been registered.
|
|
4446
|
-
deregister.call(_this, el);
|
|
4447
|
-
|
|
4448
|
-
// Save root this for use inside methods API.
|
|
4449
|
-
var root = _this;
|
|
4450
|
-
|
|
4451
|
-
// Setup methods API.
|
|
4452
|
-
var methods = {
|
|
4453
|
-
open: function open$1() {
|
|
4454
|
-
return open.call(root, this);
|
|
4455
|
-
},
|
|
4456
|
-
close: function close$1() {
|
|
4457
|
-
return close.call(root, this);
|
|
4458
|
-
},
|
|
4459
|
-
deregister: function deregister$1() {
|
|
4460
|
-
return deregister.call(root, this);
|
|
4461
|
-
}
|
|
4462
|
-
};
|
|
4463
|
-
|
|
4464
|
-
// Setup the popover object.
|
|
4465
|
-
var entry = _extends({
|
|
4466
|
-
id: el.id,
|
|
4467
|
-
state: 'closed',
|
|
4468
|
-
el: el,
|
|
4469
|
-
trigger: trigger,
|
|
4470
|
-
popper: createPopper(trigger, el),
|
|
4471
|
-
config: getConfig(el, _this.settings)
|
|
4472
|
-
}, methods);
|
|
4473
|
-
|
|
4474
|
-
// Set aria-expanded to false if trigger has aria-controls attribute.
|
|
4475
|
-
if (entry.trigger.hasAttribute('aria-controls')) {
|
|
4476
|
-
entry.trigger.setAttribute('aria-expanded', 'false');
|
|
4477
|
-
}
|
|
4478
|
-
|
|
4479
|
-
// Setup event listeners.
|
|
4480
|
-
registerEventListeners.call(_this, entry);
|
|
4481
|
-
|
|
4482
|
-
// Add entry to collection.
|
|
4483
|
-
_this.collection.push(entry);
|
|
4484
|
-
|
|
4485
|
-
// Set initial state.
|
|
4486
|
-
var _temp = function () {
|
|
4487
|
-
if (entry.el.classList.contains(_this.settings.stateActive)) {
|
|
4488
|
-
return Promise.resolve(entry.open()).then(function () {
|
|
4489
|
-
handleDocumentClick.call(_this, entry);
|
|
4490
|
-
});
|
|
4491
|
-
}
|
|
4492
|
-
}();
|
|
4493
|
-
return Promise.resolve(_temp && _temp.then ? _temp.then(function () {
|
|
4494
|
-
// Return the registered entry.
|
|
4495
|
-
return entry;
|
|
4496
|
-
}) : entry);
|
|
4497
|
-
} catch (e) {
|
|
4498
|
-
return Promise.reject(e);
|
|
4499
|
-
}
|
|
4500
|
-
};
|
|
4501
|
-
function registerEventListeners(entry) {
|
|
4502
|
-
// If event listeners aren't already setup.
|
|
4503
|
-
if (!entry.__eventListeners) {
|
|
4504
|
-
// Add event listeners based on event type.
|
|
4505
|
-
var eventType = entry.config['event'];
|
|
4506
|
-
|
|
4507
|
-
// If the event type is hover.
|
|
4508
|
-
if (eventType === 'hover') {
|
|
4509
|
-
// Setup event listeners object for hover.
|
|
4510
|
-
entry.__eventListeners = [{
|
|
4511
|
-
el: ['trigger'],
|
|
4512
|
-
type: ['mouseenter', 'focus'],
|
|
4513
|
-
listener: open.bind(this, entry)
|
|
4514
|
-
}, {
|
|
4515
|
-
el: ['el', 'trigger'],
|
|
4516
|
-
type: ['mouseleave', 'focusout'],
|
|
4517
|
-
listener: closeCheck.bind(this, entry)
|
|
4518
|
-
}];
|
|
4519
|
-
|
|
4520
|
-
// Loop through listeners and apply to the appropriate elements.
|
|
4521
|
-
entry.__eventListeners.forEach(function (evObj) {
|
|
4522
|
-
evObj.el.forEach(function (el) {
|
|
4523
|
-
evObj.type.forEach(function (type) {
|
|
4524
|
-
entry[el].addEventListener(type, evObj.listener, false);
|
|
4525
|
-
});
|
|
4526
|
-
});
|
|
4527
|
-
});
|
|
4528
|
-
}
|
|
4529
|
-
|
|
4530
|
-
// Else the event type is click.
|
|
4531
|
-
else {
|
|
4532
|
-
// Setup event listeners object for click.
|
|
4533
|
-
entry.__eventListeners = [{
|
|
4534
|
-
el: ['trigger'],
|
|
4535
|
-
type: ['click'],
|
|
4536
|
-
listener: handleClick.bind(this, entry)
|
|
4537
|
-
}];
|
|
4538
|
-
|
|
4539
|
-
// Loop through listeners and apply to the appropriate elements.
|
|
4540
|
-
entry.__eventListeners.forEach(function (evObj) {
|
|
4541
|
-
evObj.el.forEach(function (el) {
|
|
4542
|
-
evObj.type.forEach(function (type) {
|
|
4543
|
-
entry[el].addEventListener(type, evObj.listener, false);
|
|
4544
|
-
});
|
|
4545
|
-
});
|
|
4546
|
-
});
|
|
4547
|
-
}
|
|
4548
|
-
}
|
|
4549
|
-
|
|
4550
|
-
// Return the entry object.
|
|
4551
|
-
return entry;
|
|
4552
|
-
}
|
|
4553
|
-
|
|
4554
|
-
var _handleKeydown = /*#__PURE__*/_classPrivateFieldLooseKey("handleKeydown");
|
|
4555
|
-
var Popover = /*#__PURE__*/function (_Collection) {
|
|
4556
|
-
_inheritsLoose(Popover, _Collection);
|
|
4557
|
-
function Popover(options) {
|
|
4558
|
-
var _this;
|
|
4559
|
-
_this = _Collection.call(this) || this;
|
|
4560
|
-
Object.defineProperty(_assertThisInitialized(_this), _handleKeydown, {
|
|
4561
|
-
writable: true,
|
|
4562
|
-
value: void 0
|
|
4563
|
-
});
|
|
4564
|
-
_this.defaults = defaults;
|
|
4565
|
-
_this.settings = _extends({}, _this.defaults, options);
|
|
4566
|
-
_this.trigger = null;
|
|
4567
|
-
_classPrivateFieldLooseBase(_assertThisInitialized(_this), _handleKeydown)[_handleKeydown] = handleKeydown.bind(_assertThisInitialized(_this));
|
|
4568
|
-
if (_this.settings.autoInit) _this.init();
|
|
4569
|
-
return _this;
|
|
4570
|
-
}
|
|
4571
|
-
var _proto = Popover.prototype;
|
|
4572
|
-
_proto.init = function init(options) {
|
|
4573
|
-
try {
|
|
4574
|
-
var _this2 = this;
|
|
4575
|
-
// Update settings with passed options.
|
|
4576
|
-
if (options) _this2.settings = _extends({}, _this2.settings, options);
|
|
4577
|
-
|
|
4578
|
-
// Get all the popovers.
|
|
4579
|
-
var popovers = document.querySelectorAll(_this2.settings.selectorPopover);
|
|
4580
|
-
|
|
4581
|
-
// Register the collections array with popover instances.
|
|
4582
|
-
return Promise.resolve(_this2.registerCollection(popovers)).then(function () {
|
|
4583
|
-
// If eventListeners are enabled, init event listeners.
|
|
4584
|
-
if (_this2.settings.eventListeners) {
|
|
4585
|
-
// Pass false to initEventListeners() since registerCollection()
|
|
4586
|
-
// already adds event listeners to popovers.
|
|
4587
|
-
_this2.initEventListeners(false);
|
|
4588
|
-
}
|
|
4589
|
-
return _this2;
|
|
4590
|
-
});
|
|
4591
|
-
} catch (e) {
|
|
4592
|
-
return Promise.reject(e);
|
|
4593
|
-
}
|
|
4594
|
-
};
|
|
4595
|
-
_proto.destroy = function destroy() {
|
|
4596
|
-
try {
|
|
4597
|
-
var _this3 = this;
|
|
4598
|
-
// Clear stored trigger.
|
|
4599
|
-
_this3.trigger = null;
|
|
4600
|
-
|
|
4601
|
-
// Remove all entries from the collection.
|
|
4602
|
-
return Promise.resolve(_this3.deregisterCollection()).then(function () {
|
|
4603
|
-
// If eventListeners are enabled, destroy event listeners.
|
|
4604
|
-
if (_this3.settings.eventListeners) {
|
|
4605
|
-
// Pass false to destroyEventListeners() since deregisterCollection()
|
|
4606
|
-
// already removes event listeners from popovers.
|
|
4607
|
-
_this3.destroyEventListeners(false);
|
|
4608
|
-
}
|
|
4609
|
-
return _this3;
|
|
4610
|
-
});
|
|
4611
|
-
} catch (e) {
|
|
4612
|
-
return Promise.reject(e);
|
|
4613
|
-
}
|
|
4614
|
-
};
|
|
4615
|
-
_proto.initEventListeners = function initEventListeners(processCollection) {
|
|
4616
|
-
var _this4 = this;
|
|
4617
|
-
if (processCollection === void 0) {
|
|
4618
|
-
processCollection = true;
|
|
4619
|
-
}
|
|
4620
|
-
if (processCollection) {
|
|
4621
|
-
// Loop through collection and setup event listeners.
|
|
4622
|
-
this.collection.forEach(function (popover) {
|
|
4623
|
-
registerEventListeners.call(_this4, popover);
|
|
4624
|
-
});
|
|
4625
|
-
}
|
|
4626
|
-
|
|
4627
|
-
// Add keydown global event listener.
|
|
4628
|
-
document.addEventListener('keydown', _classPrivateFieldLooseBase(this, _handleKeydown)[_handleKeydown], false);
|
|
4629
|
-
};
|
|
4630
|
-
_proto.destroyEventListeners = function destroyEventListeners(processCollection) {
|
|
4631
|
-
if (processCollection === void 0) {
|
|
4632
|
-
processCollection = true;
|
|
4633
|
-
}
|
|
4634
|
-
if (processCollection) {
|
|
4635
|
-
// Loop through collection and remove event listeners.
|
|
4636
|
-
this.collection.forEach(function (popover) {
|
|
4637
|
-
deregisterEventListeners(popover);
|
|
4638
|
-
});
|
|
4639
|
-
}
|
|
4640
|
-
|
|
4641
|
-
// Remove keydown global event listener.
|
|
4642
|
-
document.removeEventListener('keydown', _classPrivateFieldLooseBase(this, _handleKeydown)[_handleKeydown], false);
|
|
4643
|
-
};
|
|
4644
|
-
_proto.register = function register$1(query) {
|
|
4645
|
-
var els = getPopoverElements.call(this, query);
|
|
4646
|
-
if (els.error) return Promise.reject(els.error);
|
|
4647
|
-
return register.call(this, els.popover, els.trigger);
|
|
4648
|
-
};
|
|
4649
|
-
_proto.deregister = function deregister$1(query) {
|
|
4650
|
-
var popover = this.get(getPopoverID.call(this, query));
|
|
4651
|
-
return deregister.call(this, popover);
|
|
4652
|
-
};
|
|
4653
|
-
_proto.open = function open$1(id) {
|
|
4654
|
-
return open.call(this, id);
|
|
4655
|
-
};
|
|
4656
|
-
_proto.close = function close$1(id) {
|
|
4657
|
-
return close.call(this, id);
|
|
4658
|
-
};
|
|
4659
|
-
return Popover;
|
|
4660
|
-
}(Collection);
|
|
4661
|
-
|
|
4662
|
-
export { Checkbox, Drawer, Modal, Popover, index as core };
|
|
4663
|
-
//# sourceMappingURL=scripts.esm.js.map
|