vrembem 1.40.1 → 1.41.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +1 -1
- package/dev/scripts.esm.js +633 -510
- package/dev/scripts.esm.js.map +1 -1
- package/dev/scripts.js +633 -510
- package/dev/scripts.js.map +1 -1
- package/dev/scripts.modern.js +529 -438
- package/dev/scripts.modern.js.map +1 -1
- package/dev/scripts.umd.js +633 -510
- package/dev/scripts.umd.js.map +1 -1
- package/dev/styles.css.map +1 -1
- package/dist/scripts.esm.js +1 -1
- package/dist/scripts.esm.js.map +1 -1
- package/dist/scripts.js +1 -1
- package/dist/scripts.js.map +1 -1
- package/dist/scripts.modern.js +1 -1
- package/dist/scripts.modern.js.map +1 -1
- package/dist/scripts.umd.js +1 -1
- package/dist/scripts.umd.js.map +1 -1
- package/dist/styles.css.map +1 -1
- package/package.json +26 -26
package/dev/scripts.js
CHANGED
|
@@ -34,10 +34,9 @@ var setTabindex = function setTabindex(selector) {
|
|
|
34
34
|
};
|
|
35
35
|
|
|
36
36
|
/**
|
|
37
|
-
* Adds a class or classes to
|
|
38
|
-
*
|
|
39
|
-
* @param
|
|
40
|
-
* @param {String || Array} cl - Class(es) to add
|
|
37
|
+
* Adds a class or classes to a Node or NodeList.
|
|
38
|
+
* @param {Node || NodeList} el - Element(s) to add class(es) to.
|
|
39
|
+
* @param {String || Array} cl - Class(es) to add.
|
|
41
40
|
*/
|
|
42
41
|
var addClass = function addClass(el) {
|
|
43
42
|
var _arguments = arguments;
|
|
@@ -50,10 +49,9 @@ var addClass = function addClass(el) {
|
|
|
50
49
|
};
|
|
51
50
|
|
|
52
51
|
/**
|
|
53
|
-
* Takes a hyphen cased string and converts it to camel case
|
|
54
|
-
*
|
|
55
|
-
* @
|
|
56
|
-
* @returns {Boolean} - returns a camel cased string
|
|
52
|
+
* Takes a hyphen cased string and converts it to camel case.
|
|
53
|
+
* @param {String } str - the string to convert to camel case.
|
|
54
|
+
* @returns {Boolean} - returns a camel cased string.
|
|
57
55
|
*/
|
|
58
56
|
var camelCase = function camelCase(str) {
|
|
59
57
|
return str.replace(/-([a-z])/g, function (g) {
|
|
@@ -179,27 +177,25 @@ var FocusTrap = /*#__PURE__*/function () {
|
|
|
179
177
|
}();
|
|
180
178
|
|
|
181
179
|
/**
|
|
182
|
-
* Get an element(s) from a selector or return value if not a string
|
|
183
|
-
*
|
|
184
|
-
* @param {
|
|
185
|
-
* @param {Boolean} single - Whether to return a single or all matches
|
|
180
|
+
* Get an element(s) from a selector or return value if not a string.
|
|
181
|
+
* @param {String} selector - Selector to query.
|
|
182
|
+
* @param {Boolean} single - Whether to return a single or all matches.
|
|
186
183
|
*/
|
|
187
184
|
var getElement = function getElement(selector, single) {
|
|
188
185
|
if (single === void 0) {
|
|
189
186
|
single = 0;
|
|
190
187
|
}
|
|
191
188
|
|
|
192
|
-
if (typeof selector
|
|
189
|
+
if (typeof selector !== 'string') return selector;
|
|
193
190
|
return single ? document.querySelector(selector) : document.querySelectorAll(selector);
|
|
194
191
|
};
|
|
195
192
|
|
|
196
193
|
/**
|
|
197
|
-
* Checks an element or NodeList whether they contain a class or classes
|
|
194
|
+
* Checks an element or NodeList whether they contain a class or classes.
|
|
198
195
|
* Ref: https://davidwalsh.name/nodelist-array
|
|
199
|
-
*
|
|
200
|
-
* @param {
|
|
201
|
-
* @
|
|
202
|
-
* @returns {Boolean} - Returns true if class exists, otherwise false
|
|
196
|
+
* @param {Node} el - Element(s) to check class(es) on.
|
|
197
|
+
* @param {String || Array} c - Class(es) to check.
|
|
198
|
+
* @returns {Boolean} - Returns true if class exists, otherwise false.
|
|
203
199
|
*/
|
|
204
200
|
var hasClass = function hasClass(el) {
|
|
205
201
|
el = el.forEach ? el : [el];
|
|
@@ -212,10 +208,9 @@ var hasClass = function hasClass(el) {
|
|
|
212
208
|
};
|
|
213
209
|
|
|
214
210
|
/**
|
|
215
|
-
* Takes a camel cased string and converts it to hyphen case
|
|
216
|
-
*
|
|
217
|
-
* @
|
|
218
|
-
* @returns {Boolean} - returns a hyphen cased string
|
|
211
|
+
* Takes a camel cased string and converts it to hyphen case.
|
|
212
|
+
* @param {String } str - the string to convert to hyphen case.
|
|
213
|
+
* @returns {Boolean} - returns a hyphen cased string.
|
|
219
214
|
*/
|
|
220
215
|
var hyphenCase = function hyphenCase(str) {
|
|
221
216
|
return str.replace(/([a-z][A-Z])/g, function (g) {
|
|
@@ -224,11 +219,10 @@ var hyphenCase = function hyphenCase(str) {
|
|
|
224
219
|
};
|
|
225
220
|
|
|
226
221
|
/**
|
|
227
|
-
* Moves element(s) in the DOM based on a reference and move type
|
|
228
|
-
*
|
|
229
|
-
* @param {String}
|
|
230
|
-
* @param {String}
|
|
231
|
-
* @param {String} reference - The reference element the move is relative to
|
|
222
|
+
* Moves element(s) in the DOM based on a reference and move type.
|
|
223
|
+
* @param {String} target - The element(s) to move.
|
|
224
|
+
* @param {String} type - Move type can be 'after', 'before', 'append' or 'prepend'.
|
|
225
|
+
* @param {String} reference - The reference element the move is relative to.
|
|
232
226
|
*/
|
|
233
227
|
|
|
234
228
|
function moveElement(target, type, reference) {
|
|
@@ -283,10 +277,9 @@ function moveElement(target, type, reference) {
|
|
|
283
277
|
}
|
|
284
278
|
|
|
285
279
|
/**
|
|
286
|
-
* Remove a class or classes from an element or NodeList
|
|
287
|
-
*
|
|
288
|
-
* @param {
|
|
289
|
-
* @param {String || Array} cl - Class(es) to remove
|
|
280
|
+
* Remove a class or classes from an element or NodeList.
|
|
281
|
+
* @param {Node || NodeList} el - Element(s) to remove class(es) from.
|
|
282
|
+
* @param {String || Array} cl - Class(es) to remove.
|
|
290
283
|
*/
|
|
291
284
|
var removeClass = function removeClass(el) {
|
|
292
285
|
var _arguments = arguments;
|
|
@@ -299,10 +292,9 @@ var removeClass = function removeClass(el) {
|
|
|
299
292
|
};
|
|
300
293
|
|
|
301
294
|
/**
|
|
302
|
-
* Toggle a class or classes on an element or NodeList
|
|
303
|
-
*
|
|
304
|
-
* @param {
|
|
305
|
-
* @param {String || Array} cl - Class(es) to toggle
|
|
295
|
+
* Toggle a class or classes on an element or NodeList.
|
|
296
|
+
* @param {Node || NodeList} el - Element(s) to toggle class(es) on.
|
|
297
|
+
* @param {String || Array} cl - Class(es) to toggle.
|
|
306
298
|
*/
|
|
307
299
|
var toggleClass = function toggleClass(el) {
|
|
308
300
|
var _arguments = arguments;
|
|
@@ -389,13 +381,39 @@ function _extends() {
|
|
|
389
381
|
return _extends.apply(this, arguments);
|
|
390
382
|
}
|
|
391
383
|
|
|
384
|
+
function _inheritsLoose(subClass, superClass) {
|
|
385
|
+
subClass.prototype = Object.create(superClass.prototype);
|
|
386
|
+
subClass.prototype.constructor = subClass;
|
|
387
|
+
|
|
388
|
+
_setPrototypeOf(subClass, superClass);
|
|
389
|
+
}
|
|
390
|
+
|
|
391
|
+
function _setPrototypeOf(o, p) {
|
|
392
|
+
_setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
|
|
393
|
+
o.__proto__ = p;
|
|
394
|
+
return o;
|
|
395
|
+
};
|
|
396
|
+
|
|
397
|
+
return _setPrototypeOf(o, p);
|
|
398
|
+
}
|
|
399
|
+
|
|
400
|
+
function _assertThisInitialized(self) {
|
|
401
|
+
if (self === void 0) {
|
|
402
|
+
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
|
|
403
|
+
}
|
|
404
|
+
|
|
405
|
+
return self;
|
|
406
|
+
}
|
|
407
|
+
|
|
408
|
+
var defaults$3 = {
|
|
409
|
+
autoInit: false,
|
|
410
|
+
stateAttr: 'aria-checked',
|
|
411
|
+
stateValue: 'mixed'
|
|
412
|
+
};
|
|
413
|
+
|
|
392
414
|
var Checkbox = /*#__PURE__*/function () {
|
|
393
415
|
function Checkbox(options) {
|
|
394
|
-
this.defaults =
|
|
395
|
-
autoInit: false,
|
|
396
|
-
stateAttr: 'aria-checked',
|
|
397
|
-
stateValue: 'mixed'
|
|
398
|
-
};
|
|
416
|
+
this.defaults = defaults$3;
|
|
399
417
|
this.settings = _extends({}, this.defaults, options);
|
|
400
418
|
this.__handlerClick = this.handlerClick.bind(this);
|
|
401
419
|
if (this.settings.autoInit) this.init();
|
|
@@ -495,55 +513,6 @@ var defaults$2 = {
|
|
|
495
513
|
transition: true
|
|
496
514
|
};
|
|
497
515
|
|
|
498
|
-
var switchToDefault = function switchToDefault(drawerKey, obj) {
|
|
499
|
-
try {
|
|
500
|
-
// Initial guards
|
|
501
|
-
var drawer = obj.getDrawer(drawerKey);
|
|
502
|
-
if (!drawer) return Promise.resolve(obj.drawerNotFound(drawerKey));
|
|
503
|
-
if (!hasClass(drawer, obj.settings.classModal)) return Promise.resolve(); // Tear down modal state
|
|
504
|
-
|
|
505
|
-
setInert(false, obj.settings.selectorInert);
|
|
506
|
-
setOverflowHidden(false, obj.settings.selectorOverflow);
|
|
507
|
-
removeClass(drawer, obj.settings.classModal);
|
|
508
|
-
obj.focusTrap.destroy(); // Restore drawers saved state
|
|
509
|
-
|
|
510
|
-
drawerKey = drawer.getAttribute("data-" + obj.settings.dataDrawer);
|
|
511
|
-
var drawerState = obj.state[drawerKey];
|
|
512
|
-
|
|
513
|
-
if (drawerState == obj.settings.stateOpened) {
|
|
514
|
-
addClass(drawer, obj.settings.stateOpened);
|
|
515
|
-
removeClass(drawer, obj.settings.stateClosed);
|
|
516
|
-
} // Dispatch custom event
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
drawer.dispatchEvent(new CustomEvent(obj.settings.customEventPrefix + 'toDefault', {
|
|
520
|
-
bubbles: true
|
|
521
|
-
}));
|
|
522
|
-
return Promise.resolve(drawer);
|
|
523
|
-
} catch (e) {
|
|
524
|
-
return Promise.reject(e);
|
|
525
|
-
}
|
|
526
|
-
};
|
|
527
|
-
var switchToModal = function switchToModal(drawerKey, obj) {
|
|
528
|
-
try {
|
|
529
|
-
// Initial guards
|
|
530
|
-
var drawer = obj.getDrawer(drawerKey);
|
|
531
|
-
if (!drawer) return Promise.resolve(obj.drawerNotFound(drawerKey));
|
|
532
|
-
if (hasClass(drawer, obj.settings.classModal)) return Promise.resolve(); // Enable modal state
|
|
533
|
-
|
|
534
|
-
addClass(drawer, obj.settings.classModal);
|
|
535
|
-
addClass(drawer, obj.settings.stateClosed);
|
|
536
|
-
removeClass(drawer, obj.settings.stateOpened); // Dispatch custom event
|
|
537
|
-
|
|
538
|
-
drawer.dispatchEvent(new CustomEvent(obj.settings.customEventPrefix + 'toModal', {
|
|
539
|
-
bubbles: true
|
|
540
|
-
}));
|
|
541
|
-
return Promise.resolve(drawer);
|
|
542
|
-
} catch (e) {
|
|
543
|
-
return Promise.reject(e);
|
|
544
|
-
}
|
|
545
|
-
};
|
|
546
|
-
|
|
547
516
|
var Breakpoint = /*#__PURE__*/function () {
|
|
548
517
|
function Breakpoint(parent) {
|
|
549
518
|
this.mediaQueryLists = [];
|
|
@@ -559,16 +528,23 @@ var Breakpoint = /*#__PURE__*/function () {
|
|
|
559
528
|
|
|
560
529
|
var drawers = document.querySelectorAll("[data-" + this.parent.settings.dataBreakpoint + "]");
|
|
561
530
|
drawers.forEach(function (drawer) {
|
|
531
|
+
// Setup mediaQueryList object
|
|
562
532
|
var id = drawer.getAttribute("data-" + _this.parent.settings.dataDrawer);
|
|
563
533
|
var key = drawer.getAttribute("data-" + _this.parent.settings.dataBreakpoint);
|
|
564
534
|
|
|
565
535
|
var bp = _this.getBreakpoint(key);
|
|
566
536
|
|
|
567
|
-
var mql = window.matchMedia('(min-width:' + bp + ')');
|
|
537
|
+
var mql = window.matchMedia('(min-width:' + bp + ')'); // Run match check
|
|
568
538
|
|
|
569
|
-
_this.match(mql, drawer);
|
|
539
|
+
_this.match(mql, drawer); // Conditionally use addListner() for IE11 support
|
|
540
|
+
|
|
541
|
+
|
|
542
|
+
if (typeof mql.addEventListener === 'function') {
|
|
543
|
+
mql.addEventListener('change', _this.__check);
|
|
544
|
+
} else {
|
|
545
|
+
mql.addListener(_this.__check);
|
|
546
|
+
} // Push to mediaQueryLists array along with drawer ID
|
|
570
547
|
|
|
571
|
-
mql.addEventListener('change', _this.__check);
|
|
572
548
|
|
|
573
549
|
_this.mediaQueryLists.push({
|
|
574
550
|
'mql': mql,
|
|
@@ -613,9 +589,9 @@ var Breakpoint = /*#__PURE__*/function () {
|
|
|
613
589
|
|
|
614
590
|
_proto.match = function match(mql, drawer) {
|
|
615
591
|
if (mql.matches) {
|
|
616
|
-
switchToDefault(drawer
|
|
592
|
+
this.parent.switchToDefault(drawer);
|
|
617
593
|
} else {
|
|
618
|
-
switchToModal(drawer
|
|
594
|
+
this.parent.switchToModal(drawer);
|
|
619
595
|
}
|
|
620
596
|
};
|
|
621
597
|
|
|
@@ -641,6 +617,52 @@ var Breakpoint = /*#__PURE__*/function () {
|
|
|
641
617
|
return Breakpoint;
|
|
642
618
|
}();
|
|
643
619
|
|
|
620
|
+
function getDrawer(drawerKey) {
|
|
621
|
+
if (typeof drawerKey !== 'string') return drawerKey;
|
|
622
|
+
return document.querySelector("[data-" + this.settings.dataDrawer + "=\"" + drawerKey + "\"]");
|
|
623
|
+
}
|
|
624
|
+
function drawerNotFound(key) {
|
|
625
|
+
return Promise.reject(new Error("Did not find drawer with key: \"" + key + "\""));
|
|
626
|
+
}
|
|
627
|
+
|
|
628
|
+
var close$2 = function close(drawerKey) {
|
|
629
|
+
try {
|
|
630
|
+
var _this2 = this;
|
|
631
|
+
|
|
632
|
+
var drawer = _this2.getDrawer(drawerKey);
|
|
633
|
+
|
|
634
|
+
if (!drawer) return Promise.resolve(drawerNotFound(drawerKey));
|
|
635
|
+
|
|
636
|
+
if (hasClass(drawer, _this2.settings.stateOpened)) {
|
|
637
|
+
_this2.working = true;
|
|
638
|
+
|
|
639
|
+
if (hasClass(drawer, _this2.settings.classModal)) {
|
|
640
|
+
setInert(false, _this2.settings.selectorInert);
|
|
641
|
+
setOverflowHidden(false, _this2.settings.selectorOverflow);
|
|
642
|
+
}
|
|
643
|
+
|
|
644
|
+
return Promise.resolve(closeTransition(drawer, _this2.settings)).then(function () {
|
|
645
|
+
_this2.stateSave(drawer);
|
|
646
|
+
|
|
647
|
+
focusTrigger(_this2);
|
|
648
|
+
|
|
649
|
+
_this2.focusTrap.destroy();
|
|
650
|
+
|
|
651
|
+
drawer.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'closed', {
|
|
652
|
+
detail: _this2,
|
|
653
|
+
bubbles: true
|
|
654
|
+
}));
|
|
655
|
+
_this2.working = false;
|
|
656
|
+
return drawer;
|
|
657
|
+
});
|
|
658
|
+
} else {
|
|
659
|
+
return Promise.resolve(drawer);
|
|
660
|
+
}
|
|
661
|
+
} catch (e) {
|
|
662
|
+
return Promise.reject(e);
|
|
663
|
+
}
|
|
664
|
+
};
|
|
665
|
+
|
|
644
666
|
function handlerClick$2(event) {
|
|
645
667
|
// Working catch
|
|
646
668
|
if (this.working) return; // Toggle data trigger
|
|
@@ -704,6 +726,48 @@ function handlerKeydown$2(event) {
|
|
|
704
726
|
}
|
|
705
727
|
}
|
|
706
728
|
|
|
729
|
+
var open$2 = function open(drawerKey) {
|
|
730
|
+
try {
|
|
731
|
+
var _this2 = this;
|
|
732
|
+
|
|
733
|
+
var drawer = _this2.getDrawer(drawerKey);
|
|
734
|
+
|
|
735
|
+
if (!drawer) return Promise.resolve(drawerNotFound(drawerKey));
|
|
736
|
+
|
|
737
|
+
if (!hasClass(drawer, _this2.settings.stateOpened)) {
|
|
738
|
+
_this2.working = true;
|
|
739
|
+
var isModal = hasClass(drawer, _this2.settings.classModal);
|
|
740
|
+
|
|
741
|
+
if (isModal) {
|
|
742
|
+
setOverflowHidden(true, _this2.settings.selectorOverflow);
|
|
743
|
+
}
|
|
744
|
+
|
|
745
|
+
return Promise.resolve(openTransition(drawer, _this2.settings)).then(function () {
|
|
746
|
+
_this2.stateSave(drawer);
|
|
747
|
+
|
|
748
|
+
if (isModal) {
|
|
749
|
+
_this2.focusTrap.init(drawer);
|
|
750
|
+
|
|
751
|
+
setInert(true, _this2.settings.selectorInert);
|
|
752
|
+
}
|
|
753
|
+
|
|
754
|
+
focusTarget(drawer, _this2.settings);
|
|
755
|
+
drawer.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'opened', {
|
|
756
|
+
detail: _this2,
|
|
757
|
+
bubbles: true
|
|
758
|
+
}));
|
|
759
|
+
_this2.working = false;
|
|
760
|
+
return drawer;
|
|
761
|
+
});
|
|
762
|
+
} else {
|
|
763
|
+
focusTarget(drawer, _this2.settings);
|
|
764
|
+
return Promise.resolve(drawer);
|
|
765
|
+
}
|
|
766
|
+
} catch (e) {
|
|
767
|
+
return Promise.reject(e);
|
|
768
|
+
}
|
|
769
|
+
};
|
|
770
|
+
|
|
707
771
|
function stateSet(settings) {
|
|
708
772
|
// If save state is disabled
|
|
709
773
|
if (!settings.stateSave) return stateClear(settings); // If there isn't an existing state to set
|
|
@@ -748,6 +812,82 @@ function stateClear(settings) {
|
|
|
748
812
|
return {};
|
|
749
813
|
}
|
|
750
814
|
|
|
815
|
+
var switchToDefault = function switchToDefault(drawerKey) {
|
|
816
|
+
try {
|
|
817
|
+
var _this4 = this;
|
|
818
|
+
|
|
819
|
+
// Initial guards
|
|
820
|
+
var drawer = _this4.getDrawer(drawerKey);
|
|
821
|
+
|
|
822
|
+
if (!drawer) return Promise.resolve(drawerNotFound(drawerKey));
|
|
823
|
+
if (!hasClass(drawer, _this4.settings.classModal)) return Promise.resolve(); // Tear down modal state
|
|
824
|
+
|
|
825
|
+
setInert(false, _this4.settings.selectorInert);
|
|
826
|
+
setOverflowHidden(false, _this4.settings.selectorOverflow);
|
|
827
|
+
removeClass(drawer, _this4.settings.classModal);
|
|
828
|
+
|
|
829
|
+
_this4.focusTrap.destroy(); // Restore drawers saved state
|
|
830
|
+
|
|
831
|
+
|
|
832
|
+
drawerKey = drawer.getAttribute("data-" + _this4.settings.dataDrawer);
|
|
833
|
+
var drawerState = _this4.state[drawerKey];
|
|
834
|
+
|
|
835
|
+
if (drawerState == _this4.settings.stateOpened) {
|
|
836
|
+
addClass(drawer, _this4.settings.stateOpened);
|
|
837
|
+
removeClass(drawer, _this4.settings.stateClosed);
|
|
838
|
+
} // Dispatch custom event
|
|
839
|
+
|
|
840
|
+
|
|
841
|
+
drawer.dispatchEvent(new CustomEvent(_this4.settings.customEventPrefix + 'toDefault', {
|
|
842
|
+
bubbles: true
|
|
843
|
+
}));
|
|
844
|
+
return Promise.resolve(drawer);
|
|
845
|
+
} catch (e) {
|
|
846
|
+
return Promise.reject(e);
|
|
847
|
+
}
|
|
848
|
+
};
|
|
849
|
+
var switchToModal = function switchToModal(drawerKey) {
|
|
850
|
+
try {
|
|
851
|
+
var _this2 = this;
|
|
852
|
+
|
|
853
|
+
// Initial guards
|
|
854
|
+
var drawer = _this2.getDrawer(drawerKey);
|
|
855
|
+
|
|
856
|
+
if (!drawer) return Promise.resolve(drawerNotFound(drawerKey));
|
|
857
|
+
if (hasClass(drawer, _this2.settings.classModal)) return Promise.resolve(); // Enable modal state
|
|
858
|
+
|
|
859
|
+
addClass(drawer, _this2.settings.classModal);
|
|
860
|
+
addClass(drawer, _this2.settings.stateClosed);
|
|
861
|
+
removeClass(drawer, _this2.settings.stateOpened); // Dispatch custom event
|
|
862
|
+
|
|
863
|
+
drawer.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'toModal', {
|
|
864
|
+
bubbles: true
|
|
865
|
+
}));
|
|
866
|
+
return Promise.resolve(drawer);
|
|
867
|
+
} catch (e) {
|
|
868
|
+
return Promise.reject(e);
|
|
869
|
+
}
|
|
870
|
+
};
|
|
871
|
+
|
|
872
|
+
var toggle = function toggle(drawerKey) {
|
|
873
|
+
try {
|
|
874
|
+
var _this2 = this;
|
|
875
|
+
|
|
876
|
+
var drawer = _this2.getDrawer(drawerKey);
|
|
877
|
+
|
|
878
|
+
if (!drawer) return Promise.resolve(drawerNotFound(drawerKey));
|
|
879
|
+
var isClosed = !hasClass(drawer, _this2.settings.stateOpened);
|
|
880
|
+
|
|
881
|
+
if (isClosed) {
|
|
882
|
+
return Promise.resolve(_this2.open(drawer));
|
|
883
|
+
} else {
|
|
884
|
+
return Promise.resolve(_this2.close(drawer));
|
|
885
|
+
}
|
|
886
|
+
} catch (e) {
|
|
887
|
+
return Promise.reject(e);
|
|
888
|
+
}
|
|
889
|
+
};
|
|
890
|
+
|
|
751
891
|
var Drawer = /*#__PURE__*/function () {
|
|
752
892
|
function Drawer(options) {
|
|
753
893
|
this.defaults = defaults$2;
|
|
@@ -814,19 +954,12 @@ var Drawer = /*#__PURE__*/function () {
|
|
|
814
954
|
*/
|
|
815
955
|
;
|
|
816
956
|
|
|
817
|
-
_proto.getDrawer = function getDrawer(drawerKey) {
|
|
818
|
-
|
|
819
|
-
return document.querySelector("[data-" + this.settings.dataDrawer + "=\"" + drawerKey + "\"]");
|
|
820
|
-
};
|
|
821
|
-
|
|
822
|
-
_proto.drawerNotFound = function drawerNotFound(key) {
|
|
823
|
-
return Promise.reject(new Error("Did not find drawer with key: \"" + key + "\""));
|
|
957
|
+
_proto.getDrawer = function getDrawer$1(drawerKey) {
|
|
958
|
+
return getDrawer.call(this, drawerKey);
|
|
824
959
|
};
|
|
825
960
|
|
|
826
961
|
_proto.setTabindex = function setTabindex$1() {
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
setTabindex(selectorTabindex);
|
|
962
|
+
return setTabindex("\n [data-" + this.settings.dataDrawer + "]\n [data-" + this.settings.dataDialog + "]\n ");
|
|
830
963
|
}
|
|
831
964
|
/**
|
|
832
965
|
* Save state functionality
|
|
@@ -854,114 +987,27 @@ var Drawer = /*#__PURE__*/function () {
|
|
|
854
987
|
;
|
|
855
988
|
|
|
856
989
|
_proto.switchToDefault = function switchToDefault$1(drawerKey) {
|
|
857
|
-
return switchToDefault(
|
|
990
|
+
return switchToDefault.call(this, drawerKey);
|
|
858
991
|
};
|
|
859
992
|
|
|
860
993
|
_proto.switchToModal = function switchToModal$1(drawerKey) {
|
|
861
|
-
return switchToModal(
|
|
994
|
+
return switchToModal.call(this, drawerKey);
|
|
862
995
|
}
|
|
863
996
|
/**
|
|
864
997
|
* Change state functionality
|
|
865
998
|
*/
|
|
866
999
|
;
|
|
867
1000
|
|
|
868
|
-
_proto.toggle = function toggle(drawerKey) {
|
|
869
|
-
|
|
870
|
-
var _this2 = this;
|
|
871
|
-
|
|
872
|
-
var drawer = _this2.getDrawer(drawerKey);
|
|
873
|
-
|
|
874
|
-
if (!drawer) return Promise.resolve(_this2.drawerNotFound(drawerKey));
|
|
875
|
-
var isClosed = !hasClass(drawer, _this2.settings.stateOpened);
|
|
876
|
-
|
|
877
|
-
if (isClosed) {
|
|
878
|
-
return Promise.resolve(_this2.open(drawer));
|
|
879
|
-
} else {
|
|
880
|
-
return Promise.resolve(_this2.close(drawer));
|
|
881
|
-
}
|
|
882
|
-
} catch (e) {
|
|
883
|
-
return Promise.reject(e);
|
|
884
|
-
}
|
|
1001
|
+
_proto.toggle = function toggle$1(drawerKey) {
|
|
1002
|
+
return toggle.call(this, drawerKey);
|
|
885
1003
|
};
|
|
886
1004
|
|
|
887
1005
|
_proto.open = function open(drawerKey) {
|
|
888
|
-
|
|
889
|
-
var _this4 = this;
|
|
890
|
-
|
|
891
|
-
var drawer = _this4.getDrawer(drawerKey);
|
|
892
|
-
|
|
893
|
-
if (!drawer) return Promise.resolve(_this4.drawerNotFound(drawerKey));
|
|
894
|
-
|
|
895
|
-
if (!hasClass(drawer, _this4.settings.stateOpened)) {
|
|
896
|
-
_this4.working = true;
|
|
897
|
-
var isModal = hasClass(drawer, _this4.settings.classModal);
|
|
898
|
-
|
|
899
|
-
if (isModal) {
|
|
900
|
-
setOverflowHidden(true, _this4.settings.selectorOverflow);
|
|
901
|
-
}
|
|
902
|
-
|
|
903
|
-
return Promise.resolve(openTransition(drawer, _this4.settings)).then(function () {
|
|
904
|
-
_this4.stateSave(drawer);
|
|
905
|
-
|
|
906
|
-
if (isModal) {
|
|
907
|
-
_this4.focusTrap.init(drawer);
|
|
908
|
-
|
|
909
|
-
setInert(true, _this4.settings.selectorInert);
|
|
910
|
-
}
|
|
911
|
-
|
|
912
|
-
focusTarget(drawer, _this4.settings);
|
|
913
|
-
drawer.dispatchEvent(new CustomEvent(_this4.settings.customEventPrefix + 'opened', {
|
|
914
|
-
detail: _this4,
|
|
915
|
-
bubbles: true
|
|
916
|
-
}));
|
|
917
|
-
_this4.working = false;
|
|
918
|
-
return drawer;
|
|
919
|
-
});
|
|
920
|
-
} else {
|
|
921
|
-
focusTarget(drawer, _this4.settings);
|
|
922
|
-
return Promise.resolve(drawer);
|
|
923
|
-
}
|
|
924
|
-
} catch (e) {
|
|
925
|
-
return Promise.reject(e);
|
|
926
|
-
}
|
|
1006
|
+
return open$2.call(this, drawerKey);
|
|
927
1007
|
};
|
|
928
1008
|
|
|
929
1009
|
_proto.close = function close(drawerKey) {
|
|
930
|
-
|
|
931
|
-
var _this6 = this;
|
|
932
|
-
|
|
933
|
-
var drawer = _this6.getDrawer(drawerKey);
|
|
934
|
-
|
|
935
|
-
if (!drawer) return Promise.resolve(_this6.drawerNotFound(drawerKey));
|
|
936
|
-
|
|
937
|
-
if (hasClass(drawer, _this6.settings.stateOpened)) {
|
|
938
|
-
_this6.working = true;
|
|
939
|
-
|
|
940
|
-
if (hasClass(drawer, _this6.settings.classModal)) {
|
|
941
|
-
setInert(false, _this6.settings.selectorInert);
|
|
942
|
-
setOverflowHidden(false, _this6.settings.selectorOverflow);
|
|
943
|
-
}
|
|
944
|
-
|
|
945
|
-
return Promise.resolve(closeTransition(drawer, _this6.settings)).then(function () {
|
|
946
|
-
_this6.stateSave(drawer);
|
|
947
|
-
|
|
948
|
-
focusTrigger(_this6);
|
|
949
|
-
|
|
950
|
-
_this6.focusTrap.destroy();
|
|
951
|
-
|
|
952
|
-
drawer.dispatchEvent(new CustomEvent(_this6.settings.customEventPrefix + 'closed', {
|
|
953
|
-
detail: _this6,
|
|
954
|
-
bubbles: true
|
|
955
|
-
}));
|
|
956
|
-
_this6.working = false;
|
|
957
|
-
return drawer;
|
|
958
|
-
});
|
|
959
|
-
} else {
|
|
960
|
-
return Promise.resolve(drawer);
|
|
961
|
-
}
|
|
962
|
-
} catch (e) {
|
|
963
|
-
return Promise.reject(e);
|
|
964
|
-
}
|
|
1010
|
+
return close$2.call(this, drawerKey);
|
|
965
1011
|
};
|
|
966
1012
|
|
|
967
1013
|
return Drawer;
|
|
@@ -995,6 +1041,40 @@ var defaults$1 = {
|
|
|
995
1041
|
transition: true
|
|
996
1042
|
};
|
|
997
1043
|
|
|
1044
|
+
var close$1 = function close(returnFocus) {
|
|
1045
|
+
if (returnFocus === void 0) {
|
|
1046
|
+
returnFocus = true;
|
|
1047
|
+
}
|
|
1048
|
+
|
|
1049
|
+
try {
|
|
1050
|
+
var _this2 = this;
|
|
1051
|
+
|
|
1052
|
+
var modal = document.querySelector("[data-" + _this2.settings.dataModal + "]." + _this2.settings.stateOpened);
|
|
1053
|
+
|
|
1054
|
+
if (modal) {
|
|
1055
|
+
_this2.working = true;
|
|
1056
|
+
setInert(false, _this2.settings.selectorInert);
|
|
1057
|
+
setOverflowHidden(false, _this2.settings.selectorOverflow);
|
|
1058
|
+
return Promise.resolve(closeTransition(modal, _this2.settings)).then(function () {
|
|
1059
|
+
if (returnFocus) focusTrigger(_this2);
|
|
1060
|
+
|
|
1061
|
+
_this2.focusTrap.destroy();
|
|
1062
|
+
|
|
1063
|
+
modal.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'closed', {
|
|
1064
|
+
detail: _this2,
|
|
1065
|
+
bubbles: true
|
|
1066
|
+
}));
|
|
1067
|
+
_this2.working = false;
|
|
1068
|
+
return modal;
|
|
1069
|
+
});
|
|
1070
|
+
} else {
|
|
1071
|
+
return Promise.resolve(modal);
|
|
1072
|
+
}
|
|
1073
|
+
} catch (e) {
|
|
1074
|
+
return Promise.reject(e);
|
|
1075
|
+
}
|
|
1076
|
+
};
|
|
1077
|
+
|
|
998
1078
|
var handlerClick$1 = function handlerClick(event) {
|
|
999
1079
|
try {
|
|
1000
1080
|
var _temp3 = function _temp3(_result) {
|
|
@@ -1056,21 +1136,76 @@ function handlerKeydown$1(event) {
|
|
|
1056
1136
|
}
|
|
1057
1137
|
}
|
|
1058
1138
|
|
|
1059
|
-
function
|
|
1060
|
-
|
|
1139
|
+
function getModal(modalKey) {
|
|
1140
|
+
if (typeof modalKey !== 'string') return modalKey;
|
|
1141
|
+
return document.querySelector("[data-" + this.settings.dataModal + "=\"" + modalKey + "\"]");
|
|
1142
|
+
}
|
|
1143
|
+
function modalNotFound(key) {
|
|
1144
|
+
return Promise.reject(new Error("Did not find modal with key: \"" + key + "\""));
|
|
1145
|
+
}
|
|
1146
|
+
function moveModals(type, ref) {
|
|
1147
|
+
if (type === void 0) {
|
|
1148
|
+
type = this.settings.moveModals.type;
|
|
1149
|
+
}
|
|
1150
|
+
|
|
1151
|
+
if (ref === void 0) {
|
|
1152
|
+
ref = this.settings.moveModals.ref;
|
|
1153
|
+
}
|
|
1154
|
+
|
|
1155
|
+
var modals = document.querySelectorAll("[data-" + this.settings.dataModal + "]");
|
|
1156
|
+
if (modals.length) moveElement(modals, type, ref);
|
|
1157
|
+
}
|
|
1158
|
+
|
|
1159
|
+
function setInitialState() {
|
|
1160
|
+
var _this = this;
|
|
1161
|
+
|
|
1162
|
+
var modals = document.querySelectorAll("[data-" + this.settings.dataModal + "]");
|
|
1061
1163
|
modals.forEach(function (el) {
|
|
1062
|
-
|
|
1063
|
-
|
|
1064
|
-
|
|
1065
|
-
|
|
1066
|
-
|
|
1067
|
-
}
|
|
1164
|
+
// Remove opened state setup
|
|
1165
|
+
if (el.classList.contains(_this.settings.stateOpened)) {
|
|
1166
|
+
setInert(false, _this.settings.selectorInert);
|
|
1167
|
+
setOverflowHidden(false, _this.settings.selectorOverflow);
|
|
1168
|
+
focusTrigger(_this);
|
|
1068
1169
|
|
|
1069
|
-
|
|
1070
|
-
|
|
1170
|
+
_this.focusTrap.destroy();
|
|
1171
|
+
} // Remove all state classes and add the default state (closed)
|
|
1172
|
+
|
|
1173
|
+
|
|
1174
|
+
removeClass(el, _this.settings.stateOpened, _this.settings.stateOpening, _this.settings.stateClosing);
|
|
1175
|
+
addClass(el, _this.settings.stateClosed);
|
|
1071
1176
|
});
|
|
1072
1177
|
}
|
|
1073
1178
|
|
|
1179
|
+
var open$1 = function open(modalKey) {
|
|
1180
|
+
try {
|
|
1181
|
+
var _this2 = this;
|
|
1182
|
+
|
|
1183
|
+
var modal = getModal.call(_this2, modalKey);
|
|
1184
|
+
if (!modal) return Promise.resolve(modalNotFound(modalKey));
|
|
1185
|
+
|
|
1186
|
+
if (hasClass(modal, _this2.settings.stateClosed)) {
|
|
1187
|
+
_this2.working = true;
|
|
1188
|
+
setOverflowHidden(true, _this2.settings.selectorOverflow);
|
|
1189
|
+
return Promise.resolve(openTransition(modal, _this2.settings)).then(function () {
|
|
1190
|
+
_this2.focusTrap.init(modal);
|
|
1191
|
+
|
|
1192
|
+
focusTarget(modal, _this2.settings);
|
|
1193
|
+
setInert(true, _this2.settings.selectorInert);
|
|
1194
|
+
modal.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'opened', {
|
|
1195
|
+
detail: _this2,
|
|
1196
|
+
bubbles: true
|
|
1197
|
+
}));
|
|
1198
|
+
_this2.working = false;
|
|
1199
|
+
return modal;
|
|
1200
|
+
});
|
|
1201
|
+
} else {
|
|
1202
|
+
return Promise.resolve(modal);
|
|
1203
|
+
}
|
|
1204
|
+
} catch (e) {
|
|
1205
|
+
return Promise.reject(e);
|
|
1206
|
+
}
|
|
1207
|
+
};
|
|
1208
|
+
|
|
1074
1209
|
var Modal = /*#__PURE__*/function () {
|
|
1075
1210
|
function Modal(options) {
|
|
1076
1211
|
this.defaults = defaults$1;
|
|
@@ -1092,13 +1227,12 @@ var Modal = /*#__PURE__*/function () {
|
|
|
1092
1227
|
|
|
1093
1228
|
if (options) this.settings = _extends({}, this.settings, options);
|
|
1094
1229
|
this.moveModals();
|
|
1230
|
+
this.setInitialState();
|
|
1095
1231
|
|
|
1096
1232
|
if (this.settings.setTabindex) {
|
|
1097
1233
|
this.setTabindex();
|
|
1098
1234
|
}
|
|
1099
1235
|
|
|
1100
|
-
this.setInitialState();
|
|
1101
|
-
|
|
1102
1236
|
if (this.settings.eventListeners) {
|
|
1103
1237
|
this.initEventListeners();
|
|
1104
1238
|
}
|
|
@@ -1132,36 +1266,20 @@ var Modal = /*#__PURE__*/function () {
|
|
|
1132
1266
|
*/
|
|
1133
1267
|
;
|
|
1134
1268
|
|
|
1135
|
-
_proto.getModal = function getModal(modalKey) {
|
|
1136
|
-
|
|
1137
|
-
return document.querySelector("[data-" + this.settings.dataModal + "=\"" + modalKey + "\"]");
|
|
1138
|
-
};
|
|
1139
|
-
|
|
1140
|
-
_proto.modalNotFound = function modalNotFound(key) {
|
|
1141
|
-
return Promise.reject(new Error("Did not find modal with key: \"" + key + "\""));
|
|
1269
|
+
_proto.getModal = function getModal$1(modalKey) {
|
|
1270
|
+
return getModal.call(this, modalKey);
|
|
1142
1271
|
};
|
|
1143
1272
|
|
|
1144
1273
|
_proto.setTabindex = function setTabindex$1() {
|
|
1145
|
-
|
|
1146
|
-
|
|
1147
|
-
setTabindex(selectorTabindex);
|
|
1274
|
+
return setTabindex("\n [data-" + this.settings.dataModal + "]\n [data-" + this.settings.dataDialog + "]\n ");
|
|
1148
1275
|
};
|
|
1149
1276
|
|
|
1150
1277
|
_proto.setInitialState = function setInitialState$1() {
|
|
1151
|
-
setInitialState(this);
|
|
1278
|
+
return setInitialState.call(this);
|
|
1152
1279
|
};
|
|
1153
1280
|
|
|
1154
|
-
_proto.moveModals = function moveModals(type, ref) {
|
|
1155
|
-
|
|
1156
|
-
type = this.settings.moveModals.type;
|
|
1157
|
-
}
|
|
1158
|
-
|
|
1159
|
-
if (ref === void 0) {
|
|
1160
|
-
ref = this.settings.moveModals.ref;
|
|
1161
|
-
}
|
|
1162
|
-
|
|
1163
|
-
var modals = document.querySelectorAll("[data-" + this.settings.dataModal + "]");
|
|
1164
|
-
if (modals.length) moveElement(modals, type, ref);
|
|
1281
|
+
_proto.moveModals = function moveModals$1(type, ref) {
|
|
1282
|
+
return moveModals.call(this, type, ref);
|
|
1165
1283
|
}
|
|
1166
1284
|
/**
|
|
1167
1285
|
* Change state functionality
|
|
@@ -1169,92 +1287,92 @@ var Modal = /*#__PURE__*/function () {
|
|
|
1169
1287
|
;
|
|
1170
1288
|
|
|
1171
1289
|
_proto.open = function open(modalKey) {
|
|
1172
|
-
|
|
1173
|
-
|
|
1290
|
+
return open$1.call(this, modalKey);
|
|
1291
|
+
};
|
|
1174
1292
|
|
|
1175
|
-
|
|
1293
|
+
_proto.close = function close(returnFocus) {
|
|
1294
|
+
return close$1.call(this, returnFocus);
|
|
1295
|
+
};
|
|
1176
1296
|
|
|
1177
|
-
|
|
1297
|
+
return Modal;
|
|
1298
|
+
}();
|
|
1178
1299
|
|
|
1179
|
-
|
|
1180
|
-
|
|
1181
|
-
|
|
1182
|
-
|
|
1183
|
-
_this2.focusTrap.init(modal);
|
|
1300
|
+
var Collection = /*#__PURE__*/function () {
|
|
1301
|
+
function Collection() {
|
|
1302
|
+
this.collection = [];
|
|
1303
|
+
}
|
|
1184
1304
|
|
|
1185
|
-
|
|
1186
|
-
|
|
1187
|
-
|
|
1188
|
-
|
|
1189
|
-
|
|
1190
|
-
|
|
1191
|
-
_this2.working = false;
|
|
1192
|
-
return modal;
|
|
1193
|
-
});
|
|
1194
|
-
} else {
|
|
1195
|
-
return Promise.resolve(modal);
|
|
1196
|
-
}
|
|
1197
|
-
} catch (e) {
|
|
1198
|
-
return Promise.reject(e);
|
|
1199
|
-
}
|
|
1305
|
+
var _proto = Collection.prototype;
|
|
1306
|
+
|
|
1307
|
+
_proto.register = function register(item) {
|
|
1308
|
+
this.deregister(item);
|
|
1309
|
+
this.collection.push(item);
|
|
1310
|
+
return this.collection;
|
|
1200
1311
|
};
|
|
1201
1312
|
|
|
1202
|
-
_proto.
|
|
1203
|
-
|
|
1204
|
-
|
|
1313
|
+
_proto.deregister = function deregister(ref) {
|
|
1314
|
+
var index = this.collection.findIndex(function (entry) {
|
|
1315
|
+
return entry === ref;
|
|
1316
|
+
});
|
|
1317
|
+
|
|
1318
|
+
if (index >= 0) {
|
|
1319
|
+
var entry = this.collection[index];
|
|
1320
|
+
Object.getOwnPropertyNames(entry).forEach(function (prop) {
|
|
1321
|
+
delete entry[prop];
|
|
1322
|
+
});
|
|
1323
|
+
this.collection.splice(index, 1);
|
|
1205
1324
|
}
|
|
1206
1325
|
|
|
1207
|
-
|
|
1208
|
-
|
|
1326
|
+
return this.collection;
|
|
1327
|
+
};
|
|
1209
1328
|
|
|
1210
|
-
|
|
1329
|
+
_proto.registerCollection = function registerCollection(items) {
|
|
1330
|
+
var _this = this;
|
|
1211
1331
|
|
|
1212
|
-
|
|
1213
|
-
|
|
1214
|
-
|
|
1215
|
-
|
|
1216
|
-
|
|
1217
|
-
if (returnFocus) focusTrigger(_this4);
|
|
1332
|
+
items.forEach(function (item) {
|
|
1333
|
+
_this.register(item);
|
|
1334
|
+
});
|
|
1335
|
+
return this.collection;
|
|
1336
|
+
};
|
|
1218
1337
|
|
|
1219
|
-
|
|
1338
|
+
_proto.deregisterCollection = function deregisterCollection() {
|
|
1339
|
+
while (this.collection.length > 0) {
|
|
1340
|
+
this.deregister(this.collection[0]);
|
|
1341
|
+
}
|
|
1220
1342
|
|
|
1221
|
-
|
|
1222
|
-
|
|
1223
|
-
|
|
1224
|
-
|
|
1225
|
-
|
|
1226
|
-
|
|
1227
|
-
});
|
|
1228
|
-
} else {
|
|
1229
|
-
return Promise.resolve(modal);
|
|
1230
|
-
}
|
|
1231
|
-
} catch (e) {
|
|
1232
|
-
return Promise.reject(e);
|
|
1343
|
+
return this.collection;
|
|
1344
|
+
};
|
|
1345
|
+
|
|
1346
|
+
_proto.get = function get(query, key) {
|
|
1347
|
+
if (key === void 0) {
|
|
1348
|
+
key = 'id';
|
|
1233
1349
|
}
|
|
1350
|
+
|
|
1351
|
+
var result = this.collection.find(function (item) {
|
|
1352
|
+
return item[key] === query;
|
|
1353
|
+
});
|
|
1354
|
+
return result || null;
|
|
1234
1355
|
};
|
|
1235
1356
|
|
|
1236
|
-
return
|
|
1357
|
+
return Collection;
|
|
1237
1358
|
}();
|
|
1238
1359
|
|
|
1239
1360
|
var defaults = {
|
|
1240
1361
|
autoInit: false,
|
|
1241
|
-
//
|
|
1242
|
-
|
|
1243
|
-
|
|
1244
|
-
dataArrow: 'popover-arrow',
|
|
1245
|
-
dataEventType: 'popover-event',
|
|
1246
|
-
dataPlacement: 'popover-placement',
|
|
1362
|
+
// Selectors
|
|
1363
|
+
selectorPopover: '.popover',
|
|
1364
|
+
selectorArrow: '.popover__arrow',
|
|
1247
1365
|
// State classes
|
|
1248
1366
|
stateActive: 'is-active',
|
|
1249
1367
|
// Feature toggles
|
|
1250
|
-
eventType: 'click',
|
|
1251
1368
|
eventListeners: true,
|
|
1252
|
-
|
|
1369
|
+
eventType: 'click',
|
|
1370
|
+
placement: 'bottom'
|
|
1253
1371
|
};
|
|
1254
1372
|
|
|
1255
|
-
function
|
|
1373
|
+
function close(popover) {
|
|
1256
1374
|
// Update state class
|
|
1257
|
-
popover.target.classList.remove(
|
|
1375
|
+
popover.target.classList.remove(this.settings.stateActive); // Update a11y attributes
|
|
1258
1376
|
|
|
1259
1377
|
popover.trigger.setAttribute('aria-expanded', 'false'); // Disable popper event listeners
|
|
1260
1378
|
|
|
@@ -1263,41 +1381,38 @@ function hide$2(popover, obj) {
|
|
|
1263
1381
|
name: 'eventListeners',
|
|
1264
1382
|
enabled: false
|
|
1265
1383
|
}]
|
|
1266
|
-
}); // Update
|
|
1384
|
+
}); // Update popover state
|
|
1267
1385
|
|
|
1268
|
-
|
|
1269
|
-
return item.target === popover.target;
|
|
1270
|
-
});
|
|
1271
|
-
obj.collection[index].state = 'hide'; // Clear the memory if popover trigger matches the ones saved in memory
|
|
1386
|
+
popover.state = 'closed'; // Clear memory if popover trigger matches the one saved in memory
|
|
1272
1387
|
|
|
1273
|
-
if (popover.trigger ===
|
|
1274
|
-
|
|
1388
|
+
if (popover.trigger === this.memory.trigger) {
|
|
1389
|
+
this.memory.trigger = null;
|
|
1275
1390
|
} // Return the popover
|
|
1276
1391
|
|
|
1277
1392
|
|
|
1278
1393
|
return popover;
|
|
1279
1394
|
}
|
|
1280
|
-
function
|
|
1281
|
-
|
|
1282
|
-
if (popover.state === '
|
|
1283
|
-
|
|
1395
|
+
function closeAll() {
|
|
1396
|
+
this.collection.forEach(function (popover) {
|
|
1397
|
+
if (popover.state === 'opened') {
|
|
1398
|
+
popover.close();
|
|
1284
1399
|
}
|
|
1285
1400
|
}); // Return the collection
|
|
1286
1401
|
|
|
1287
|
-
return
|
|
1402
|
+
return this.collection;
|
|
1288
1403
|
}
|
|
1289
|
-
function
|
|
1290
|
-
// Only run
|
|
1291
|
-
if (popover.state != '
|
|
1404
|
+
function closeCheck(popover) {
|
|
1405
|
+
// Only run closeCheck if provided popover is currently open
|
|
1406
|
+
if (popover.state != 'opened') return; // Needed to correctly check which element is currently being focused
|
|
1292
1407
|
|
|
1293
1408
|
setTimeout(function () {
|
|
1294
1409
|
// Check if trigger or target are being hovered
|
|
1295
1410
|
var isHovered = popover.target.closest(':hover') === popover.target || popover.trigger.closest(':hover') === popover.trigger; // Check if trigger or target are being focused
|
|
1296
1411
|
|
|
1297
|
-
var isFocused = document.activeElement.closest("
|
|
1412
|
+
var isFocused = document.activeElement.closest("#" + popover.id + ", [aria-controls=\"" + popover.id + "\"]"); // Close if the trigger and target are not currently hovered or focused
|
|
1298
1413
|
|
|
1299
1414
|
if (!isHovered && !isFocused) {
|
|
1300
|
-
|
|
1415
|
+
popover.close();
|
|
1301
1416
|
} // Return the popover
|
|
1302
1417
|
|
|
1303
1418
|
|
|
@@ -1305,6 +1420,59 @@ function hideCheck(popover, obj) {
|
|
|
1305
1420
|
}, 1);
|
|
1306
1421
|
}
|
|
1307
1422
|
|
|
1423
|
+
function handlerClick(popover) {
|
|
1424
|
+
if (popover.target.classList.contains(this.settings.stateActive)) {
|
|
1425
|
+
popover.close();
|
|
1426
|
+
} else {
|
|
1427
|
+
this.memory.trigger = popover.trigger;
|
|
1428
|
+
popover.open();
|
|
1429
|
+
documentClick.call(this, popover);
|
|
1430
|
+
}
|
|
1431
|
+
}
|
|
1432
|
+
function handlerKeydown(event) {
|
|
1433
|
+
var _this = this;
|
|
1434
|
+
|
|
1435
|
+
switch (event.key) {
|
|
1436
|
+
case 'Escape':
|
|
1437
|
+
if (this.memory.trigger) {
|
|
1438
|
+
this.memory.trigger.focus();
|
|
1439
|
+
}
|
|
1440
|
+
|
|
1441
|
+
closeAll.call(this);
|
|
1442
|
+
return;
|
|
1443
|
+
|
|
1444
|
+
case 'Tab':
|
|
1445
|
+
this.collection.forEach(function (popover) {
|
|
1446
|
+
closeCheck.call(_this, popover);
|
|
1447
|
+
});
|
|
1448
|
+
return;
|
|
1449
|
+
|
|
1450
|
+
default:
|
|
1451
|
+
return;
|
|
1452
|
+
}
|
|
1453
|
+
}
|
|
1454
|
+
function documentClick(popover) {
|
|
1455
|
+
var root = this;
|
|
1456
|
+
document.addEventListener('click', function _f(event) {
|
|
1457
|
+
// Check if a popover was clicked
|
|
1458
|
+
var result = event.target.closest("#" + popover.id + ", [aria-controls=\"" + popover.id + "\"]");
|
|
1459
|
+
|
|
1460
|
+
if (!result) {
|
|
1461
|
+
// If it doesn't match and popover is open, close it and remove event listener
|
|
1462
|
+
if (popover.target && popover.target.classList.contains(root.settings.stateActive)) {
|
|
1463
|
+
popover.close();
|
|
1464
|
+
}
|
|
1465
|
+
|
|
1466
|
+
this.removeEventListener('click', _f);
|
|
1467
|
+
} else {
|
|
1468
|
+
// If it does match and popover isn't currently active, remove event listener
|
|
1469
|
+
if (popover.target && !popover.target.classList.contains(root.settings.stateActive)) {
|
|
1470
|
+
this.removeEventListener('click', _f);
|
|
1471
|
+
}
|
|
1472
|
+
}
|
|
1473
|
+
});
|
|
1474
|
+
}
|
|
1475
|
+
|
|
1308
1476
|
function getConfig(el, settings) {
|
|
1309
1477
|
// Get the computed styles of the popover
|
|
1310
1478
|
var styles = getComputedStyle(el); // Setup the config obj with default values
|
|
@@ -1315,30 +1483,23 @@ function getConfig(el, settings) {
|
|
|
1315
1483
|
'offset': 0,
|
|
1316
1484
|
'overflow-padding': 0,
|
|
1317
1485
|
'flip-padding': 0,
|
|
1318
|
-
'arrow-element':
|
|
1486
|
+
'arrow-element': settings.selectorArrow,
|
|
1319
1487
|
'arrow-padding': 0
|
|
1320
1488
|
}; // Loop through config obj
|
|
1321
1489
|
|
|
1322
1490
|
for (var prop in config) {
|
|
1323
1491
|
// Get the CSS variable property values
|
|
1324
1492
|
var prefix = getComputedStyle(document.body).getPropertyValue('--vrembem-variable-prefix');
|
|
1325
|
-
var
|
|
1493
|
+
var value = styles.getPropertyValue("--" + prefix + "popover-" + prop).trim(); // If a value was found, replace the default in config obj
|
|
1326
1494
|
|
|
1327
|
-
if (
|
|
1328
|
-
config[prop] =
|
|
1495
|
+
if (value) {
|
|
1496
|
+
config[prop] = value;
|
|
1329
1497
|
}
|
|
1330
1498
|
} // Return the config obj
|
|
1331
1499
|
|
|
1332
1500
|
|
|
1333
1501
|
return config;
|
|
1334
1502
|
}
|
|
1335
|
-
function getData(el, attr, fallback) {
|
|
1336
|
-
if (fallback === void 0) {
|
|
1337
|
-
fallback = false;
|
|
1338
|
-
}
|
|
1339
|
-
|
|
1340
|
-
return el.hasAttribute("data-" + attr) ? el.getAttribute("data-" + attr) : fallback;
|
|
1341
|
-
}
|
|
1342
1503
|
function getPadding(value) {
|
|
1343
1504
|
var padding; // Split the value by spaces if it's a string
|
|
1344
1505
|
|
|
@@ -1412,97 +1573,53 @@ function getModifiers(options) {
|
|
|
1412
1573
|
}
|
|
1413
1574
|
}];
|
|
1414
1575
|
}
|
|
1415
|
-
function
|
|
1416
|
-
//
|
|
1417
|
-
|
|
1576
|
+
function getPopoverID(obj) {
|
|
1577
|
+
// If it's a string
|
|
1578
|
+
if (typeof obj === 'string') {
|
|
1579
|
+
return obj;
|
|
1580
|
+
} // If it's an HTML element
|
|
1581
|
+
else if (typeof obj.hasAttribute === 'function') {
|
|
1582
|
+
// If it's a popover trigger
|
|
1583
|
+
if (obj.hasAttribute('aria-controls')) {
|
|
1584
|
+
return obj.getAttribute('aria-controls');
|
|
1585
|
+
} // If it's a popover target
|
|
1586
|
+
else if (obj.closest(this.settings.selectorPopover)) {
|
|
1587
|
+
return obj.id;
|
|
1588
|
+
} // Return false if no id was found
|
|
1589
|
+
else return false;
|
|
1590
|
+
} // If it has an ID property
|
|
1591
|
+
else if (obj.id) {
|
|
1592
|
+
return obj.id;
|
|
1593
|
+
} // Return false if no id was found
|
|
1594
|
+
else return false;
|
|
1595
|
+
}
|
|
1596
|
+
function getPopoverElements(query) {
|
|
1597
|
+
var id = getPopoverID.call(this, query);
|
|
1418
1598
|
|
|
1419
1599
|
if (id) {
|
|
1420
|
-
|
|
1421
|
-
|
|
1422
|
-
return document.querySelector("[data-" + settings.dataPopover + "=\"" + id + "\"]");
|
|
1423
|
-
} else {
|
|
1424
|
-
// If trigger attribute value doesn't exist, check if
|
|
1425
|
-
// - There is a nextElementSibling relative to the trigger
|
|
1426
|
-
// - And it has the popover data attribute.
|
|
1427
|
-
return trigger.nextElementSibling && trigger.nextElementSibling.hasAttribute("data-" + settings.dataPopover) ? // Return the element or false if the two checks fail
|
|
1428
|
-
trigger.nextElementSibling : false;
|
|
1429
|
-
}
|
|
1430
|
-
}
|
|
1431
|
-
|
|
1432
|
-
function show(popover, obj) {
|
|
1433
|
-
// Update state class
|
|
1434
|
-
popover.target.classList.add(obj.settings.stateActive); // Update a11y attributes
|
|
1600
|
+
var trigger = document.querySelector("[aria-controls=\"" + id + "\"]");
|
|
1601
|
+
var target = document.querySelector("#" + id);
|
|
1435
1602
|
|
|
1436
|
-
|
|
1437
|
-
|
|
1438
|
-
|
|
1439
|
-
|
|
1440
|
-
|
|
1441
|
-
|
|
1442
|
-
|
|
1443
|
-
name: 'eventListeners',
|
|
1444
|
-
enabled: true
|
|
1445
|
-
}].concat(getModifiers(popover.config))
|
|
1446
|
-
}); // Update popover's position
|
|
1447
|
-
|
|
1448
|
-
popover.popper.update(); // Update collection status with new state
|
|
1449
|
-
|
|
1450
|
-
var index = obj.collection.findIndex(function (item) {
|
|
1451
|
-
return item.target === popover.target;
|
|
1452
|
-
});
|
|
1453
|
-
obj.collection[index].state = 'show'; // Return the popover
|
|
1454
|
-
|
|
1455
|
-
return popover;
|
|
1456
|
-
}
|
|
1457
|
-
|
|
1458
|
-
function handlerClick(popover) {
|
|
1459
|
-
if (popover.target.classList.contains(this.settings.stateActive)) {
|
|
1460
|
-
hide$2(popover, this);
|
|
1461
|
-
} else {
|
|
1462
|
-
this.memory.trigger = popover.trigger;
|
|
1463
|
-
show(popover, this);
|
|
1464
|
-
documentClick(popover, this);
|
|
1465
|
-
}
|
|
1466
|
-
}
|
|
1467
|
-
function handlerKeydown(event) {
|
|
1468
|
-
var _this = this;
|
|
1469
|
-
|
|
1470
|
-
switch (event.key) {
|
|
1471
|
-
case 'Escape':
|
|
1472
|
-
if (this.memory.trigger) {
|
|
1473
|
-
this.memory.trigger.focus();
|
|
1474
|
-
}
|
|
1475
|
-
|
|
1476
|
-
hideAll(this);
|
|
1477
|
-
return;
|
|
1478
|
-
|
|
1479
|
-
case 'Tab':
|
|
1480
|
-
this.collection.forEach(function (popover) {
|
|
1481
|
-
hideCheck(popover, _this);
|
|
1482
|
-
});
|
|
1483
|
-
return;
|
|
1484
|
-
|
|
1485
|
-
default:
|
|
1486
|
-
return;
|
|
1487
|
-
}
|
|
1488
|
-
}
|
|
1489
|
-
function documentClick(popover, obj) {
|
|
1490
|
-
document.addEventListener('click', function _f(event) {
|
|
1491
|
-
var result = event.target.closest("[data-" + obj.settings.dataPopover + "], [data-" + obj.settings.dataTrigger + "]");
|
|
1492
|
-
var match = result === popover.target || result === popover.trigger;
|
|
1493
|
-
|
|
1494
|
-
if (!match) {
|
|
1495
|
-
if (popover.target.classList.contains(obj.settings.stateActive)) {
|
|
1496
|
-
hide$2(popover, obj);
|
|
1497
|
-
}
|
|
1603
|
+
if (!trigger && !target) {
|
|
1604
|
+
console.error('No popover elements found using the provided ID:', id);
|
|
1605
|
+
} else if (!trigger) {
|
|
1606
|
+
console.error('No popover trigger associated with the provided popover:', target);
|
|
1607
|
+
} else if (!target) {
|
|
1608
|
+
console.error('No popover associated with the provided popover trigger:', trigger);
|
|
1609
|
+
}
|
|
1498
1610
|
|
|
1499
|
-
|
|
1611
|
+
if (!trigger || !target) {
|
|
1612
|
+
return false;
|
|
1500
1613
|
} else {
|
|
1501
|
-
|
|
1502
|
-
|
|
1503
|
-
|
|
1614
|
+
return {
|
|
1615
|
+
trigger: trigger,
|
|
1616
|
+
target: target
|
|
1617
|
+
};
|
|
1504
1618
|
}
|
|
1505
|
-
}
|
|
1619
|
+
} else {
|
|
1620
|
+
console.error('Could not resolve the popover ID:', query);
|
|
1621
|
+
return false;
|
|
1622
|
+
}
|
|
1506
1623
|
}
|
|
1507
1624
|
|
|
1508
1625
|
var top = 'top';
|
|
@@ -3288,95 +3405,118 @@ var createPopper = /*#__PURE__*/popperGenerator({
|
|
|
3288
3405
|
defaultModifiers: defaultModifiers
|
|
3289
3406
|
}); // eslint-disable-next-line import/no-unused-modules
|
|
3290
3407
|
|
|
3291
|
-
function
|
|
3292
|
-
//
|
|
3293
|
-
|
|
3294
|
-
// Try and get the target
|
|
3295
|
-
target = getPopover(trigger, obj.settings); // If still no target is returned, log an error and return false
|
|
3408
|
+
function open(popover) {
|
|
3409
|
+
// Update state class
|
|
3410
|
+
popover.target.classList.add(this.settings.stateActive); // Update a11y attribute
|
|
3296
3411
|
|
|
3297
|
-
|
|
3298
|
-
console.error('No popover associated with the provided trigger:', trigger);
|
|
3299
|
-
return false;
|
|
3300
|
-
}
|
|
3301
|
-
} // Check if this item has already been registered in the collection
|
|
3412
|
+
popover.trigger.setAttribute('aria-expanded', 'true'); // Update popover config
|
|
3302
3413
|
|
|
3414
|
+
popover.config = getConfig(popover.target, this.settings); // Enable popper event listeners and set placement/modifiers
|
|
3303
3415
|
|
|
3304
|
-
|
|
3305
|
-
|
|
3306
|
-
|
|
3416
|
+
popover.popper.setOptions({
|
|
3417
|
+
placement: popover.config['placement'],
|
|
3418
|
+
modifiers: [{
|
|
3419
|
+
name: 'eventListeners',
|
|
3420
|
+
enabled: true
|
|
3421
|
+
}].concat(getModifiers(popover.config))
|
|
3422
|
+
}); // Update popover position
|
|
3307
3423
|
|
|
3308
|
-
|
|
3424
|
+
popover.popper.update(); // Update popover state
|
|
3309
3425
|
|
|
3310
|
-
|
|
3311
|
-
|
|
3312
|
-
|
|
3313
|
-
|
|
3314
|
-
|
|
3315
|
-
|
|
3426
|
+
popover.state = 'opened'; // Return the popover
|
|
3427
|
+
|
|
3428
|
+
return popover;
|
|
3429
|
+
}
|
|
3430
|
+
|
|
3431
|
+
function register(trigger, target) {
|
|
3432
|
+
// Deregister popover if it already exists in the collection
|
|
3433
|
+
this.deregister(target.id); // Create popper instance
|
|
3434
|
+
|
|
3435
|
+
var popperInstance = createPopper(trigger, target); // Save root this for use inside object & create methods API
|
|
3316
3436
|
|
|
3317
|
-
|
|
3318
|
-
|
|
3319
|
-
|
|
3320
|
-
|
|
3321
|
-
|
|
3322
|
-
|
|
3323
|
-
|
|
3437
|
+
var root = this;
|
|
3438
|
+
var methods = {
|
|
3439
|
+
open: function open$1() {
|
|
3440
|
+
open.call(root, this);
|
|
3441
|
+
},
|
|
3442
|
+
close: function close$1() {
|
|
3443
|
+
close.call(root, this);
|
|
3444
|
+
},
|
|
3445
|
+
deregister: function deregister() {
|
|
3446
|
+
_deregister.call(root, this);
|
|
3447
|
+
}
|
|
3448
|
+
}; // Build popover object and push to collection array
|
|
3324
3449
|
|
|
3325
|
-
|
|
3326
|
-
|
|
3450
|
+
var popover = _extends({
|
|
3451
|
+
id: target.id,
|
|
3452
|
+
state: 'closed',
|
|
3453
|
+
trigger: trigger,
|
|
3454
|
+
target: target,
|
|
3455
|
+
popper: popperInstance,
|
|
3456
|
+
config: getConfig(target, this.settings)
|
|
3457
|
+
}, methods); // Setup event listeners
|
|
3327
3458
|
|
|
3328
3459
|
|
|
3329
|
-
registerEventListeners(
|
|
3460
|
+
registerEventListeners.call(this, popover); // Set initial state of popover
|
|
3330
3461
|
|
|
3331
|
-
if (popover.target.classList.contains(
|
|
3332
|
-
|
|
3333
|
-
documentClick(
|
|
3462
|
+
if (popover.target.classList.contains(this.settings.stateActive)) {
|
|
3463
|
+
popover.open();
|
|
3464
|
+
documentClick.call(this, popover);
|
|
3334
3465
|
} else {
|
|
3335
|
-
|
|
3336
|
-
} //
|
|
3466
|
+
popover.close();
|
|
3467
|
+
} // Add item to collection
|
|
3468
|
+
|
|
3337
3469
|
|
|
3470
|
+
this.collection.push(popover); // Return the popover object
|
|
3338
3471
|
|
|
3339
3472
|
return popover;
|
|
3340
3473
|
}
|
|
3341
|
-
|
|
3474
|
+
|
|
3475
|
+
function _deregister(popover) {
|
|
3342
3476
|
// Check if this item has been registered in the collection
|
|
3343
|
-
var index =
|
|
3344
|
-
return
|
|
3345
|
-
}); // If the
|
|
3477
|
+
var index = this.collection.findIndex(function (entry) {
|
|
3478
|
+
return entry.id === popover.id;
|
|
3479
|
+
}); // If the entry exists in the collection
|
|
3346
3480
|
|
|
3347
3481
|
if (index >= 0) {
|
|
3348
|
-
//
|
|
3349
|
-
|
|
3350
|
-
|
|
3482
|
+
// Get the collection entry
|
|
3483
|
+
var entry = this.collection[index]; // Close the collection entry if it's open
|
|
3484
|
+
|
|
3485
|
+
if (entry.state === 'opened') {
|
|
3486
|
+
entry.close();
|
|
3351
3487
|
} // Clean up the popper instance
|
|
3352
3488
|
|
|
3353
3489
|
|
|
3354
|
-
|
|
3490
|
+
entry.popper.destroy(); // Remove event listeners
|
|
3355
3491
|
|
|
3356
|
-
deregisterEventListeners(
|
|
3492
|
+
deregisterEventListeners(entry); // Delete properties from collection entry
|
|
3357
3493
|
|
|
3358
|
-
|
|
3494
|
+
Object.getOwnPropertyNames(entry).forEach(function (prop) {
|
|
3495
|
+
delete entry[prop];
|
|
3496
|
+
}); // Remove entry from collection
|
|
3497
|
+
|
|
3498
|
+
this.collection.splice(index, 1);
|
|
3359
3499
|
} // Return the new collection
|
|
3360
3500
|
|
|
3361
3501
|
|
|
3362
|
-
return
|
|
3502
|
+
return this.collection;
|
|
3363
3503
|
}
|
|
3364
|
-
function registerEventListeners(popover
|
|
3504
|
+
function registerEventListeners(popover) {
|
|
3365
3505
|
// If event listeners aren't already setup
|
|
3366
3506
|
if (!popover.__eventListeners) {
|
|
3367
3507
|
// Add event listeners based on event type
|
|
3368
|
-
var eventType =
|
|
3508
|
+
var eventType = popover.config['event'];
|
|
3369
3509
|
|
|
3370
3510
|
if (eventType === 'hover') {
|
|
3371
3511
|
// Setup event listeners object for hover
|
|
3372
3512
|
popover.__eventListeners = [{
|
|
3373
3513
|
el: ['trigger'],
|
|
3374
3514
|
type: ['mouseenter', 'focus'],
|
|
3375
|
-
listener:
|
|
3515
|
+
listener: open.bind(this, popover)
|
|
3376
3516
|
}, {
|
|
3377
3517
|
el: ['trigger', 'target'],
|
|
3378
3518
|
type: ['mouseleave', 'focusout'],
|
|
3379
|
-
listener:
|
|
3519
|
+
listener: closeCheck.bind(this, popover)
|
|
3380
3520
|
}]; // Loop through listeners and apply to appropriate elements
|
|
3381
3521
|
|
|
3382
3522
|
popover.__eventListeners.forEach(function (evObj) {
|
|
@@ -3391,7 +3531,7 @@ function registerEventListeners(popover, obj) {
|
|
|
3391
3531
|
popover.__eventListeners = [{
|
|
3392
3532
|
el: ['trigger'],
|
|
3393
3533
|
type: ['click'],
|
|
3394
|
-
listener: handlerClick.bind(
|
|
3534
|
+
listener: handlerClick.bind(this, popover)
|
|
3395
3535
|
}]; // Loop through listeners and apply to appropriate elements
|
|
3396
3536
|
|
|
3397
3537
|
popover.__eventListeners.forEach(function (evObj) {
|
|
@@ -3426,36 +3566,23 @@ function deregisterEventListeners(popover) {
|
|
|
3426
3566
|
|
|
3427
3567
|
return popover;
|
|
3428
3568
|
}
|
|
3429
|
-
function registerCollection(obj) {
|
|
3430
|
-
// Get all the triggers
|
|
3431
|
-
var triggers = document.querySelectorAll("[data-" + obj.settings.dataTrigger + "]");
|
|
3432
|
-
triggers.forEach(function (trigger) {
|
|
3433
|
-
// Register the popover and save to collection array
|
|
3434
|
-
register(trigger, false, obj);
|
|
3435
|
-
}); // Return the popover collection
|
|
3436
3569
|
|
|
3437
|
-
|
|
3438
|
-
|
|
3439
|
-
function deregisterCollection(obj) {
|
|
3440
|
-
// Loop through all items within the collection and pass them to deregister()
|
|
3441
|
-
while (obj.collection.length > 0) {
|
|
3442
|
-
deregister(obj.collection[0], obj);
|
|
3443
|
-
} // Return the popover collection
|
|
3570
|
+
var Popover = /*#__PURE__*/function (_Collection) {
|
|
3571
|
+
_inheritsLoose(Popover, _Collection);
|
|
3444
3572
|
|
|
3573
|
+
function Popover(options) {
|
|
3574
|
+
var _this;
|
|
3445
3575
|
|
|
3446
|
-
|
|
3447
|
-
|
|
3576
|
+
_this = _Collection.call(this) || this;
|
|
3577
|
+
_this.defaults = defaults;
|
|
3578
|
+
_this.settings = _extends({}, _this.defaults, options); // this.collection = [];
|
|
3448
3579
|
|
|
3449
|
-
|
|
3450
|
-
function Popover(options) {
|
|
3451
|
-
this.defaults = defaults;
|
|
3452
|
-
this.settings = _extends({}, this.defaults, options);
|
|
3453
|
-
this.collection = [];
|
|
3454
|
-
this.memory = {
|
|
3580
|
+
_this.memory = {
|
|
3455
3581
|
trigger: null
|
|
3456
3582
|
};
|
|
3457
|
-
|
|
3458
|
-
if (
|
|
3583
|
+
_this.__handlerKeydown = handlerKeydown.bind(_assertThisInitialized(_this));
|
|
3584
|
+
if (_this.settings.autoInit) _this.init();
|
|
3585
|
+
return _this;
|
|
3459
3586
|
}
|
|
3460
3587
|
|
|
3461
3588
|
var _proto = Popover.prototype;
|
|
@@ -3466,10 +3593,11 @@ var Popover = /*#__PURE__*/function () {
|
|
|
3466
3593
|
}
|
|
3467
3594
|
|
|
3468
3595
|
// Update settings with passed options
|
|
3469
|
-
if (options) this.settings = _extends({}, this.settings, options); //
|
|
3596
|
+
if (options) this.settings = _extends({}, this.settings, options); // Get all the popovers
|
|
3470
3597
|
|
|
3471
|
-
|
|
3598
|
+
var popovers = document.querySelectorAll(this.settings.selectorPopover); // Build the collections array with popover instances
|
|
3472
3599
|
|
|
3600
|
+
this.registerCollection(popovers); // If eventListeners is enabled
|
|
3473
3601
|
|
|
3474
3602
|
if (this.settings.eventListeners) {
|
|
3475
3603
|
// Pass false to initEventListeners() since registerCollection()
|
|
@@ -3480,8 +3608,7 @@ var Popover = /*#__PURE__*/function () {
|
|
|
3480
3608
|
|
|
3481
3609
|
_proto.destroy = function destroy() {
|
|
3482
3610
|
// Deregister all popovers from collection
|
|
3483
|
-
deregisterCollection(
|
|
3484
|
-
|
|
3611
|
+
this.deregisterCollection(); // If eventListeners is enabled
|
|
3485
3612
|
|
|
3486
3613
|
if (this.settings.eventListeners) {
|
|
3487
3614
|
// Pass false to destroyEventListeners() since deregisterCollection()
|
|
@@ -3495,7 +3622,7 @@ var Popover = /*#__PURE__*/function () {
|
|
|
3495
3622
|
;
|
|
3496
3623
|
|
|
3497
3624
|
_proto.initEventListeners = function initEventListeners(processCollection) {
|
|
3498
|
-
var
|
|
3625
|
+
var _this2 = this;
|
|
3499
3626
|
|
|
3500
3627
|
if (processCollection === void 0) {
|
|
3501
3628
|
processCollection = true;
|
|
@@ -3504,7 +3631,7 @@ var Popover = /*#__PURE__*/function () {
|
|
|
3504
3631
|
if (processCollection) {
|
|
3505
3632
|
// Loop through collection and setup event listeners
|
|
3506
3633
|
this.collection.forEach(function (popover) {
|
|
3507
|
-
registerEventListeners(
|
|
3634
|
+
registerEventListeners.call(_this2, popover);
|
|
3508
3635
|
});
|
|
3509
3636
|
} // Add keydown global event listener
|
|
3510
3637
|
|
|
@@ -3532,44 +3659,40 @@ var Popover = /*#__PURE__*/function () {
|
|
|
3532
3659
|
*/
|
|
3533
3660
|
;
|
|
3534
3661
|
|
|
3535
|
-
_proto.register = function register$1(
|
|
3536
|
-
|
|
3537
|
-
|
|
3538
|
-
|
|
3539
|
-
|
|
3540
|
-
return register(trigger, target, this);
|
|
3541
|
-
};
|
|
3542
|
-
|
|
3543
|
-
_proto.deregister = function deregister$1(popover) {
|
|
3544
|
-
return deregister(popover, this);
|
|
3545
|
-
};
|
|
3546
|
-
|
|
3547
|
-
_proto.registerCollection = function registerCollection$1() {
|
|
3548
|
-
return registerCollection(this);
|
|
3662
|
+
_proto.register = function register$1(query) {
|
|
3663
|
+
var els = getPopoverElements.call(this, query);
|
|
3664
|
+
if (!els) return false;
|
|
3665
|
+
return register.call(this, els.trigger, els.target);
|
|
3549
3666
|
};
|
|
3550
3667
|
|
|
3551
|
-
_proto.
|
|
3552
|
-
|
|
3668
|
+
_proto.deregister = function deregister(query) {
|
|
3669
|
+
var popover = this.get(getPopoverID(query));
|
|
3670
|
+
if (!popover) return false;
|
|
3671
|
+
return _deregister.call(this, popover);
|
|
3553
3672
|
}
|
|
3554
3673
|
/**
|
|
3555
3674
|
* Change state functionality
|
|
3556
3675
|
*/
|
|
3557
3676
|
;
|
|
3558
3677
|
|
|
3559
|
-
_proto.
|
|
3560
|
-
|
|
3561
|
-
|
|
3562
|
-
|
|
3563
|
-
_proto.hide = function hide(popover) {
|
|
3564
|
-
return hide$2(popover, this);
|
|
3678
|
+
_proto.open = function open(id) {
|
|
3679
|
+
var popover = this.get(id);
|
|
3680
|
+
if (!popover) return false;
|
|
3681
|
+
return popover.open();
|
|
3565
3682
|
};
|
|
3566
3683
|
|
|
3567
|
-
_proto.
|
|
3568
|
-
|
|
3684
|
+
_proto.close = function close(id) {
|
|
3685
|
+
if (id) {
|
|
3686
|
+
var popover = this.get(id);
|
|
3687
|
+
if (!popover) return false;
|
|
3688
|
+
return popover.close();
|
|
3689
|
+
} else {
|
|
3690
|
+
return closeAll.call(this);
|
|
3691
|
+
}
|
|
3569
3692
|
};
|
|
3570
3693
|
|
|
3571
3694
|
return Popover;
|
|
3572
|
-
}();
|
|
3695
|
+
}(Collection);
|
|
3573
3696
|
|
|
3574
3697
|
exports.Checkbox = Checkbox;
|
|
3575
3698
|
exports.Drawer = Drawer;
|