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/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 an element or NodeList
38
- * ---
39
- * @param {Node || NodeList} el - Element(s) to add class(es) to
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
- * @param {String } str - the string to convert to camel case
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 {String} selector - Selector to query
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 != 'string') return 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 {Node} el - Element(s) to check class(es) on
201
- * @param {String || Array} c - Class(es) to check
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
- * @param {String } str - the string to convert to hyphen case
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} target - The element(s) to move
230
- * @param {String} type - Move type can be 'after', 'before', 'append' or 'prepend'
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 {Node || NodeList} el - Element(s) to remove class(es) from
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 {Node || NodeList} el - Element(s) to toggle class(es) on
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, this.parent);
592
+ this.parent.switchToDefault(drawer);
617
593
  } else {
618
- switchToModal(drawer, this.parent);
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
- if (typeof drawerKey !== 'string') return drawerKey;
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
- var selectorTabindex = "\n [data-" + this.settings.dataDrawer + "]\n [data-" + this.settings.dataDialog + "]\n ";
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(drawerKey, this);
990
+ return switchToDefault.call(this, drawerKey);
858
991
  };
859
992
 
860
993
  _proto.switchToModal = function switchToModal$1(drawerKey) {
861
- return switchToModal(drawerKey, this);
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
- try {
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
- try {
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
- try {
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 setInitialState(obj) {
1060
- var modals = document.querySelectorAll("[data-" + obj.settings.dataModal + "]");
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
- if (el.classList.contains(obj.settings.stateOpened)) {
1063
- setInert(false, obj.settings.selectorInert);
1064
- setOverflowHidden(false, obj.settings.selectorOverflow);
1065
- focusTrigger(obj);
1066
- obj.focusTrap.destroy();
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
- removeClass(el, obj.settings.stateOpened, obj.settings.stateOpening, obj.settings.stateClosing);
1070
- addClass(el, obj.settings.stateClosed);
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
- if (typeof modalKey !== 'string') return modalKey;
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
- var selectorTabindex = "\n [data-" + this.settings.dataModal + "]\n [data-" + this.settings.dataDialog + "]\n ";
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
- if (type === void 0) {
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
- try {
1173
- var _this2 = this;
1290
+ return open$1.call(this, modalKey);
1291
+ };
1174
1292
 
1175
- var modal = _this2.getModal(modalKey);
1293
+ _proto.close = function close(returnFocus) {
1294
+ return close$1.call(this, returnFocus);
1295
+ };
1176
1296
 
1177
- if (!modal) return Promise.resolve(_this2.modalNotFound(modalKey));
1297
+ return Modal;
1298
+ }();
1178
1299
 
1179
- if (hasClass(modal, _this2.settings.stateClosed)) {
1180
- _this2.working = true;
1181
- setOverflowHidden(true, _this2.settings.selectorOverflow);
1182
- return Promise.resolve(openTransition(modal, _this2.settings)).then(function () {
1183
- _this2.focusTrap.init(modal);
1300
+ var Collection = /*#__PURE__*/function () {
1301
+ function Collection() {
1302
+ this.collection = [];
1303
+ }
1184
1304
 
1185
- focusTarget(modal, _this2.settings);
1186
- setInert(true, _this2.settings.selectorInert);
1187
- modal.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'opened', {
1188
- detail: _this2,
1189
- bubbles: true
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.close = function close(returnFocus) {
1203
- if (returnFocus === void 0) {
1204
- returnFocus = true;
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
- try {
1208
- var _this4 = this;
1326
+ return this.collection;
1327
+ };
1209
1328
 
1210
- var modal = document.querySelector("[data-" + _this4.settings.dataModal + "]." + _this4.settings.stateOpened);
1329
+ _proto.registerCollection = function registerCollection(items) {
1330
+ var _this = this;
1211
1331
 
1212
- if (modal) {
1213
- _this4.working = true;
1214
- setInert(false, _this4.settings.selectorInert);
1215
- setOverflowHidden(false, _this4.settings.selectorOverflow);
1216
- return Promise.resolve(closeTransition(modal, _this4.settings)).then(function () {
1217
- if (returnFocus) focusTrigger(_this4);
1332
+ items.forEach(function (item) {
1333
+ _this.register(item);
1334
+ });
1335
+ return this.collection;
1336
+ };
1218
1337
 
1219
- _this4.focusTrap.destroy();
1338
+ _proto.deregisterCollection = function deregisterCollection() {
1339
+ while (this.collection.length > 0) {
1340
+ this.deregister(this.collection[0]);
1341
+ }
1220
1342
 
1221
- modal.dispatchEvent(new CustomEvent(_this4.settings.customEventPrefix + 'closed', {
1222
- detail: _this4,
1223
- bubbles: true
1224
- }));
1225
- _this4.working = false;
1226
- return modal;
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 Modal;
1357
+ return Collection;
1237
1358
  }();
1238
1359
 
1239
1360
  var defaults = {
1240
1361
  autoInit: false,
1241
- // Data attributes
1242
- dataPopover: 'popover',
1243
- dataTrigger: 'popover-trigger',
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
- placement: 'bottom-start'
1369
+ eventType: 'click',
1370
+ placement: 'bottom'
1253
1371
  };
1254
1372
 
1255
- function hide$2(popover, obj) {
1373
+ function close(popover) {
1256
1374
  // Update state class
1257
- popover.target.classList.remove(obj.settings.stateActive); // Update a11y attributes
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 collection status with new state
1384
+ }); // Update popover state
1267
1385
 
1268
- var index = obj.collection.findIndex(function (item) {
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 === obj.memory.trigger) {
1274
- obj.memory.trigger = null;
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 hideAll(obj) {
1281
- obj.collection.forEach(function (popover) {
1282
- if (popover.state === 'show') {
1283
- hide$2(popover, obj);
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 obj.collection;
1402
+ return this.collection;
1288
1403
  }
1289
- function hideCheck(popover, obj) {
1290
- // Only run hideCheck if provided popover is currently open
1291
- if (popover.state != 'show') return; // Needed to correctly check which element is currently being focused
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("[data-" + obj.settings.dataPopover + "]") === popover.target || document.activeElement.closest("[data-" + obj.settings.dataTrigger + "]") === popover.trigger; // Hide if the trigger and target are not currently hovered or focused
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
- hide$2(popover, obj);
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': "[data-" + settings.dataArrow + "]",
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 val = styles.getPropertyValue("--" + prefix + "popover-" + prop).trim(); // If a value was found, replace the default in config obj
1493
+ var value = styles.getPropertyValue("--" + prefix + "popover-" + prop).trim(); // If a value was found, replace the default in config obj
1326
1494
 
1327
- if (val) {
1328
- config[prop] = val;
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 getPopover(trigger, settings) {
1416
- // Get the value of the popover trigger attribute
1417
- var id = trigger.getAttribute("data-" + settings.dataTrigger).trim();
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
- // If trigger attribute value exists, return the querySelector element using
1421
- // the provided popover trigger attribute's value
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
- popover.trigger.setAttribute('aria-expanded', 'true'); // Update popover config
1437
-
1438
- popover.config = getConfig(popover.target, obj.settings); // Enable popper event listeners and set placement/modifiers
1439
-
1440
- popover.popper.setOptions({
1441
- placement: getData(popover.target, obj.settings.dataPlacement, popover.config['placement']),
1442
- modifiers: [{
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
- this.removeEventListener('click', _f);
1611
+ if (!trigger || !target) {
1612
+ return false;
1500
1613
  } else {
1501
- if (!popover.target.classList.contains(obj.settings.stateActive)) {
1502
- this.removeEventListener('click', _f);
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 register(trigger, target, obj) {
3292
- // If no target is passed
3293
- if (!target) {
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
- if (!target) {
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
- var index = obj.collection.findIndex(function (item) {
3305
- return item.trigger === trigger && item.target === target;
3306
- }); // Initiate popover variable
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
- var popover; // Check if it already exists in collection
3424
+ popover.popper.update(); // Update popover state
3309
3425
 
3310
- if (index >= 0) {
3311
- // Set popover as item from collection
3312
- popover = obj.collection[index];
3313
- } else {
3314
- // Create popper instance
3315
- var popperInstance = createPopper(trigger, target); // Build popover object and push to collection array
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
- popover = {
3318
- state: 'hide',
3319
- trigger: trigger,
3320
- target: target,
3321
- popper: popperInstance,
3322
- config: getConfig(target, obj.settings)
3323
- }; // Add item to collection
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
- obj.collection.push(popover);
3326
- } // Setup event listeners
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(popover, obj); // Set initial state of popover
3460
+ registerEventListeners.call(this, popover); // Set initial state of popover
3330
3461
 
3331
- if (popover.target.classList.contains(obj.settings.stateActive)) {
3332
- show(popover, obj);
3333
- documentClick(popover, obj);
3462
+ if (popover.target.classList.contains(this.settings.stateActive)) {
3463
+ popover.open();
3464
+ documentClick.call(this, popover);
3334
3465
  } else {
3335
- hide$2(popover, obj);
3336
- } // Return the popover object
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
- function deregister(popover, obj) {
3474
+
3475
+ function _deregister(popover) {
3342
3476
  // Check if this item has been registered in the collection
3343
- var index = obj.collection.findIndex(function (item) {
3344
- return item.trigger === popover.trigger && item.target === popover.target;
3345
- }); // If the item exists in the collection
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
- // Hide the popover
3349
- if (popover.state === 'show') {
3350
- hide$2(popover, obj);
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
- popover.popper.destroy(); // Remove event listeners
3490
+ entry.popper.destroy(); // Remove event listeners
3355
3491
 
3356
- deregisterEventListeners(popover); // Remove item from collection
3492
+ deregisterEventListeners(entry); // Delete properties from collection entry
3357
3493
 
3358
- obj.collection.splice(index, 1);
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 obj.collection;
3502
+ return this.collection;
3363
3503
  }
3364
- function registerEventListeners(popover, obj) {
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 = getData(popover.target, obj.settings.dataEventType, popover.config['event']);
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: show.bind(null, popover, obj)
3515
+ listener: open.bind(this, popover)
3376
3516
  }, {
3377
3517
  el: ['trigger', 'target'],
3378
3518
  type: ['mouseleave', 'focusout'],
3379
- listener: hideCheck.bind(null, popover, obj)
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(obj, popover)
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
- return obj.collection;
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
- return obj.collection;
3447
- }
3576
+ _this = _Collection.call(this) || this;
3577
+ _this.defaults = defaults;
3578
+ _this.settings = _extends({}, _this.defaults, options); // this.collection = [];
3448
3579
 
3449
- var Popover = /*#__PURE__*/function () {
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
- this.__handlerKeydown = handlerKeydown.bind(this);
3458
- if (this.settings.autoInit) this.init();
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); // Build the collections array with popover instances
3596
+ if (options) this.settings = _extends({}, this.settings, options); // Get all the popovers
3470
3597
 
3471
- registerCollection(this); // If eventListeners is enabled
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(this); // If eventListeners is enabled
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 _this = this;
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(popover, _this);
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(trigger, target) {
3536
- if (target === void 0) {
3537
- target = false;
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.deregisterCollection = function deregisterCollection$1() {
3552
- return deregisterCollection(this);
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.show = function show$1(popover) {
3560
- return show(popover, this);
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.hideAll = function hideAll$1() {
3568
- return hideAll(this);
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;