vrembem 1.38.0 → 1.40.2

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.
@@ -356,14 +356,6 @@
356
356
  });
357
357
  };
358
358
 
359
- var breakpoints = {
360
- xs: '480px',
361
- sm: '620px',
362
- md: '760px',
363
- lg: '990px',
364
- xl: '1380px'
365
- };
366
-
367
359
  var index = {
368
360
  __proto__: null,
369
361
  setInert: setInert,
@@ -381,8 +373,7 @@
381
373
  removeClass: removeClass,
382
374
  toggleClass: toggleClass,
383
375
  openTransition: openTransition,
384
- closeTransition: closeTransition,
385
- breakpoints: breakpoints
376
+ closeTransition: closeTransition
386
377
  };
387
378
 
388
379
  function _extends() {
@@ -500,7 +491,7 @@
500
491
  selectorInert: null,
501
492
  selectorOverflow: null,
502
493
  // Feature toggles
503
- breakpoints: breakpoints,
494
+ breakpoints: null,
504
495
  customEventPrefix: 'drawer:',
505
496
  eventListeners: true,
506
497
  stateSave: true,
@@ -509,59 +500,11 @@
509
500
  transition: true
510
501
  };
511
502
 
512
- var switchToDefault = function switchToDefault(drawerKey, obj) {
513
- try {
514
- // Initial guards
515
- var drawer = obj.getDrawer(drawerKey);
516
- if (!drawer) return Promise.resolve(obj.drawerNotFound(drawerKey));
517
- if (!hasClass(drawer, obj.settings.classModal)) return Promise.resolve(); // Tear down modal state
518
-
519
- setInert(false, obj.settings.selectorInert);
520
- setOverflowHidden(false, obj.settings.selectorOverflow);
521
- removeClass(drawer, obj.settings.classModal);
522
- obj.focusTrap.destroy(); // Restore drawers saved state
523
-
524
- drawerKey = drawer.getAttribute("data-" + obj.settings.dataDrawer);
525
- var drawerState = obj.state[drawerKey];
526
-
527
- if (drawerState == obj.settings.stateOpened) {
528
- addClass(drawer, obj.settings.stateOpened);
529
- removeClass(drawer, obj.settings.stateClosed);
530
- } // Dispatch custom event
531
-
532
-
533
- drawer.dispatchEvent(new CustomEvent(obj.settings.customEventPrefix + 'toDefault', {
534
- bubbles: true
535
- }));
536
- return Promise.resolve(drawer);
537
- } catch (e) {
538
- return Promise.reject(e);
539
- }
540
- };
541
- var switchToModal = function switchToModal(drawerKey, obj) {
542
- try {
543
- // Initial guards
544
- var drawer = obj.getDrawer(drawerKey);
545
- if (!drawer) return Promise.resolve(obj.drawerNotFound(drawerKey));
546
- if (hasClass(drawer, obj.settings.classModal)) return Promise.resolve(); // Enable modal state
547
-
548
- addClass(drawer, obj.settings.classModal);
549
- addClass(drawer, obj.settings.stateClosed);
550
- removeClass(drawer, obj.settings.stateOpened); // Dispatch custom event
551
-
552
- drawer.dispatchEvent(new CustomEvent(obj.settings.customEventPrefix + 'toModal', {
553
- bubbles: true
554
- }));
555
- return Promise.resolve(drawer);
556
- } catch (e) {
557
- return Promise.reject(e);
558
- }
559
- };
560
-
561
503
  var Breakpoint = /*#__PURE__*/function () {
562
504
  function Breakpoint(parent) {
563
505
  this.mediaQueryLists = [];
564
506
  this.parent = parent;
507
+ this.prefix = this.getVariablePrefix();
565
508
  this.__check = this.check.bind(this);
566
509
  }
567
510
 
@@ -574,7 +517,9 @@
574
517
  drawers.forEach(function (drawer) {
575
518
  var id = drawer.getAttribute("data-" + _this.parent.settings.dataDrawer);
576
519
  var key = drawer.getAttribute("data-" + _this.parent.settings.dataBreakpoint);
577
- var bp = _this.parent.settings.breakpoints[key] ? _this.parent.settings.breakpoints[key] : key;
520
+
521
+ var bp = _this.getBreakpoint(key);
522
+
578
523
  var mql = window.matchMedia('(min-width:' + bp + ')');
579
524
 
580
525
  _this.match(mql, drawer);
@@ -624,15 +569,80 @@
624
569
 
625
570
  _proto.match = function match(mql, drawer) {
626
571
  if (mql.matches) {
627
- switchToDefault(drawer, this.parent);
572
+ this.parent.switchToDefault(drawer);
628
573
  } else {
629
- switchToModal(drawer, this.parent);
574
+ this.parent.switchToModal(drawer);
630
575
  }
631
576
  };
632
577
 
578
+ _proto.getBreakpoint = function getBreakpoint(key) {
579
+ var breakpoint = key;
580
+
581
+ if (this.parent.settings.breakpoints && this.parent.settings.breakpoints[key]) {
582
+ breakpoint = this.parent.settings.breakpoints[key];
583
+ } else if (getComputedStyle(document.body).getPropertyValue(this.prefix + key)) {
584
+ breakpoint = getComputedStyle(document.body).getPropertyValue(this.prefix + key);
585
+ }
586
+
587
+ return breakpoint;
588
+ };
589
+
590
+ _proto.getVariablePrefix = function getVariablePrefix() {
591
+ var prefix = '--';
592
+ prefix += getComputedStyle(document.body).getPropertyValue('--vrembem-variable-prefix');
593
+ prefix += 'breakpoint-';
594
+ return prefix;
595
+ };
596
+
633
597
  return Breakpoint;
634
598
  }();
635
599
 
600
+ function getDrawer(drawerKey) {
601
+ if (typeof drawerKey !== 'string') return drawerKey;
602
+ return document.querySelector("[data-" + this.settings.dataDrawer + "=\"" + drawerKey + "\"]");
603
+ }
604
+ function drawerNotFound(key) {
605
+ return Promise.reject(new Error("Did not find drawer with key: \"" + key + "\""));
606
+ }
607
+
608
+ var close$2 = function close(drawerKey) {
609
+ try {
610
+ var _this2 = this;
611
+
612
+ var drawer = _this2.getDrawer(drawerKey);
613
+
614
+ if (!drawer) return Promise.resolve(drawerNotFound(drawerKey));
615
+
616
+ if (hasClass(drawer, _this2.settings.stateOpened)) {
617
+ _this2.working = true;
618
+
619
+ if (hasClass(drawer, _this2.settings.classModal)) {
620
+ setInert(false, _this2.settings.selectorInert);
621
+ setOverflowHidden(false, _this2.settings.selectorOverflow);
622
+ }
623
+
624
+ return Promise.resolve(closeTransition(drawer, _this2.settings)).then(function () {
625
+ _this2.stateSave(drawer);
626
+
627
+ focusTrigger(_this2);
628
+
629
+ _this2.focusTrap.destroy();
630
+
631
+ drawer.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'closed', {
632
+ detail: _this2,
633
+ bubbles: true
634
+ }));
635
+ _this2.working = false;
636
+ return drawer;
637
+ });
638
+ } else {
639
+ return Promise.resolve(drawer);
640
+ }
641
+ } catch (e) {
642
+ return Promise.reject(e);
643
+ }
644
+ };
645
+
636
646
  function handlerClick$2(event) {
637
647
  // Working catch
638
648
  if (this.working) return; // Toggle data trigger
@@ -696,6 +706,48 @@
696
706
  }
697
707
  }
698
708
 
709
+ var open$2 = function open(drawerKey) {
710
+ try {
711
+ var _this2 = this;
712
+
713
+ var drawer = _this2.getDrawer(drawerKey);
714
+
715
+ if (!drawer) return Promise.resolve(drawerNotFound(drawerKey));
716
+
717
+ if (!hasClass(drawer, _this2.settings.stateOpened)) {
718
+ _this2.working = true;
719
+ var isModal = hasClass(drawer, _this2.settings.classModal);
720
+
721
+ if (isModal) {
722
+ setOverflowHidden(true, _this2.settings.selectorOverflow);
723
+ }
724
+
725
+ return Promise.resolve(openTransition(drawer, _this2.settings)).then(function () {
726
+ _this2.stateSave(drawer);
727
+
728
+ if (isModal) {
729
+ _this2.focusTrap.init(drawer);
730
+
731
+ setInert(true, _this2.settings.selectorInert);
732
+ }
733
+
734
+ focusTarget(drawer, _this2.settings);
735
+ drawer.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'opened', {
736
+ detail: _this2,
737
+ bubbles: true
738
+ }));
739
+ _this2.working = false;
740
+ return drawer;
741
+ });
742
+ } else {
743
+ focusTarget(drawer, _this2.settings);
744
+ return Promise.resolve(drawer);
745
+ }
746
+ } catch (e) {
747
+ return Promise.reject(e);
748
+ }
749
+ };
750
+
699
751
  function stateSet(settings) {
700
752
  // If save state is disabled
701
753
  if (!settings.stateSave) return stateClear(settings); // If there isn't an existing state to set
@@ -740,6 +792,82 @@
740
792
  return {};
741
793
  }
742
794
 
795
+ var switchToDefault = function switchToDefault(drawerKey) {
796
+ try {
797
+ var _this4 = this;
798
+
799
+ // Initial guards
800
+ var drawer = _this4.getDrawer(drawerKey);
801
+
802
+ if (!drawer) return Promise.resolve(drawerNotFound(drawerKey));
803
+ if (!hasClass(drawer, _this4.settings.classModal)) return Promise.resolve(); // Tear down modal state
804
+
805
+ setInert(false, _this4.settings.selectorInert);
806
+ setOverflowHidden(false, _this4.settings.selectorOverflow);
807
+ removeClass(drawer, _this4.settings.classModal);
808
+
809
+ _this4.focusTrap.destroy(); // Restore drawers saved state
810
+
811
+
812
+ drawerKey = drawer.getAttribute("data-" + _this4.settings.dataDrawer);
813
+ var drawerState = _this4.state[drawerKey];
814
+
815
+ if (drawerState == _this4.settings.stateOpened) {
816
+ addClass(drawer, _this4.settings.stateOpened);
817
+ removeClass(drawer, _this4.settings.stateClosed);
818
+ } // Dispatch custom event
819
+
820
+
821
+ drawer.dispatchEvent(new CustomEvent(_this4.settings.customEventPrefix + 'toDefault', {
822
+ bubbles: true
823
+ }));
824
+ return Promise.resolve(drawer);
825
+ } catch (e) {
826
+ return Promise.reject(e);
827
+ }
828
+ };
829
+ var switchToModal = function switchToModal(drawerKey) {
830
+ try {
831
+ var _this2 = this;
832
+
833
+ // Initial guards
834
+ var drawer = _this2.getDrawer(drawerKey);
835
+
836
+ if (!drawer) return Promise.resolve(drawerNotFound(drawerKey));
837
+ if (hasClass(drawer, _this2.settings.classModal)) return Promise.resolve(); // Enable modal state
838
+
839
+ addClass(drawer, _this2.settings.classModal);
840
+ addClass(drawer, _this2.settings.stateClosed);
841
+ removeClass(drawer, _this2.settings.stateOpened); // Dispatch custom event
842
+
843
+ drawer.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'toModal', {
844
+ bubbles: true
845
+ }));
846
+ return Promise.resolve(drawer);
847
+ } catch (e) {
848
+ return Promise.reject(e);
849
+ }
850
+ };
851
+
852
+ var toggle = function toggle(drawerKey) {
853
+ try {
854
+ var _this2 = this;
855
+
856
+ var drawer = _this2.getDrawer(drawerKey);
857
+
858
+ if (!drawer) return Promise.resolve(drawerNotFound(drawerKey));
859
+ var isClosed = !hasClass(drawer, _this2.settings.stateOpened);
860
+
861
+ if (isClosed) {
862
+ return Promise.resolve(_this2.open(drawer));
863
+ } else {
864
+ return Promise.resolve(_this2.close(drawer));
865
+ }
866
+ } catch (e) {
867
+ return Promise.reject(e);
868
+ }
869
+ };
870
+
743
871
  var Drawer = /*#__PURE__*/function () {
744
872
  function Drawer(options) {
745
873
  this.defaults = defaults$2;
@@ -806,19 +934,12 @@
806
934
  */
807
935
  ;
808
936
 
809
- _proto.getDrawer = function getDrawer(drawerKey) {
810
- if (typeof drawerKey !== 'string') return drawerKey;
811
- return document.querySelector("[data-" + this.settings.dataDrawer + "=\"" + drawerKey + "\"]");
812
- };
813
-
814
- _proto.drawerNotFound = function drawerNotFound(key) {
815
- return Promise.reject(new Error("Did not find drawer with key: \"" + key + "\""));
937
+ _proto.getDrawer = function getDrawer$1(drawerKey) {
938
+ return getDrawer.call(this, drawerKey);
816
939
  };
817
940
 
818
941
  _proto.setTabindex = function setTabindex$1() {
819
- var selectorTabindex = "\n [data-" + this.settings.dataDrawer + "]\n [data-" + this.settings.dataDialog + "]\n ";
820
-
821
- setTabindex(selectorTabindex);
942
+ return setTabindex("\n [data-" + this.settings.dataDrawer + "]\n [data-" + this.settings.dataDialog + "]\n ");
822
943
  }
823
944
  /**
824
945
  * Save state functionality
@@ -846,114 +967,27 @@
846
967
  ;
847
968
 
848
969
  _proto.switchToDefault = function switchToDefault$1(drawerKey) {
849
- return switchToDefault(drawerKey, this);
970
+ return switchToDefault.call(this, drawerKey);
850
971
  };
851
972
 
852
973
  _proto.switchToModal = function switchToModal$1(drawerKey) {
853
- return switchToModal(drawerKey, this);
974
+ return switchToModal.call(this, drawerKey);
854
975
  }
855
976
  /**
856
977
  * Change state functionality
857
978
  */
858
979
  ;
859
980
 
860
- _proto.toggle = function toggle(drawerKey) {
861
- try {
862
- var _this2 = this;
863
-
864
- var drawer = _this2.getDrawer(drawerKey);
865
-
866
- if (!drawer) return Promise.resolve(_this2.drawerNotFound(drawerKey));
867
- var isClosed = !hasClass(drawer, _this2.settings.stateOpened);
868
-
869
- if (isClosed) {
870
- return Promise.resolve(_this2.open(drawer));
871
- } else {
872
- return Promise.resolve(_this2.close(drawer));
873
- }
874
- } catch (e) {
875
- return Promise.reject(e);
876
- }
981
+ _proto.toggle = function toggle$1(drawerKey) {
982
+ return toggle.call(this, drawerKey);
877
983
  };
878
984
 
879
985
  _proto.open = function open(drawerKey) {
880
- try {
881
- var _this4 = this;
882
-
883
- var drawer = _this4.getDrawer(drawerKey);
884
-
885
- if (!drawer) return Promise.resolve(_this4.drawerNotFound(drawerKey));
886
-
887
- if (!hasClass(drawer, _this4.settings.stateOpened)) {
888
- _this4.working = true;
889
- var isModal = hasClass(drawer, _this4.settings.classModal);
890
-
891
- if (isModal) {
892
- setOverflowHidden(true, _this4.settings.selectorOverflow);
893
- }
894
-
895
- return Promise.resolve(openTransition(drawer, _this4.settings)).then(function () {
896
- _this4.stateSave(drawer);
897
-
898
- if (isModal) {
899
- _this4.focusTrap.init(drawer);
900
-
901
- setInert(true, _this4.settings.selectorInert);
902
- }
903
-
904
- focusTarget(drawer, _this4.settings);
905
- drawer.dispatchEvent(new CustomEvent(_this4.settings.customEventPrefix + 'opened', {
906
- detail: _this4,
907
- bubbles: true
908
- }));
909
- _this4.working = false;
910
- return drawer;
911
- });
912
- } else {
913
- focusTarget(drawer, _this4.settings);
914
- return Promise.resolve(drawer);
915
- }
916
- } catch (e) {
917
- return Promise.reject(e);
918
- }
986
+ return open$2.call(this, drawerKey);
919
987
  };
920
988
 
921
989
  _proto.close = function close(drawerKey) {
922
- try {
923
- var _this6 = this;
924
-
925
- var drawer = _this6.getDrawer(drawerKey);
926
-
927
- if (!drawer) return Promise.resolve(_this6.drawerNotFound(drawerKey));
928
-
929
- if (hasClass(drawer, _this6.settings.stateOpened)) {
930
- _this6.working = true;
931
-
932
- if (hasClass(drawer, _this6.settings.classModal)) {
933
- setInert(false, _this6.settings.selectorInert);
934
- setOverflowHidden(false, _this6.settings.selectorOverflow);
935
- }
936
-
937
- return Promise.resolve(closeTransition(drawer, _this6.settings)).then(function () {
938
- _this6.stateSave(drawer);
939
-
940
- focusTrigger(_this6);
941
-
942
- _this6.focusTrap.destroy();
943
-
944
- drawer.dispatchEvent(new CustomEvent(_this6.settings.customEventPrefix + 'closed', {
945
- detail: _this6,
946
- bubbles: true
947
- }));
948
- _this6.working = false;
949
- return drawer;
950
- });
951
- } else {
952
- return Promise.resolve(drawer);
953
- }
954
- } catch (e) {
955
- return Promise.reject(e);
956
- }
990
+ return close$2.call(this, drawerKey);
957
991
  };
958
992
 
959
993
  return Drawer;
@@ -987,6 +1021,40 @@
987
1021
  transition: true
988
1022
  };
989
1023
 
1024
+ var close$1 = function close(returnFocus) {
1025
+ if (returnFocus === void 0) {
1026
+ returnFocus = true;
1027
+ }
1028
+
1029
+ try {
1030
+ var _this2 = this;
1031
+
1032
+ var modal = document.querySelector("[data-" + _this2.settings.dataModal + "]." + _this2.settings.stateOpened);
1033
+
1034
+ if (modal) {
1035
+ _this2.working = true;
1036
+ setInert(false, _this2.settings.selectorInert);
1037
+ setOverflowHidden(false, _this2.settings.selectorOverflow);
1038
+ return Promise.resolve(closeTransition(modal, _this2.settings)).then(function () {
1039
+ if (returnFocus) focusTrigger(_this2);
1040
+
1041
+ _this2.focusTrap.destroy();
1042
+
1043
+ modal.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'closed', {
1044
+ detail: _this2,
1045
+ bubbles: true
1046
+ }));
1047
+ _this2.working = false;
1048
+ return modal;
1049
+ });
1050
+ } else {
1051
+ return Promise.resolve(modal);
1052
+ }
1053
+ } catch (e) {
1054
+ return Promise.reject(e);
1055
+ }
1056
+ };
1057
+
990
1058
  var handlerClick$1 = function handlerClick(event) {
991
1059
  try {
992
1060
  var _temp3 = function _temp3(_result) {
@@ -1048,21 +1116,76 @@
1048
1116
  }
1049
1117
  }
1050
1118
 
1051
- function setInitialState(obj) {
1052
- var modals = document.querySelectorAll("[data-" + obj.settings.dataModal + "]");
1119
+ function getModal(modalKey) {
1120
+ if (typeof modalKey !== 'string') return modalKey;
1121
+ return document.querySelector("[data-" + this.settings.dataModal + "=\"" + modalKey + "\"]");
1122
+ }
1123
+ function modalNotFound(key) {
1124
+ return Promise.reject(new Error("Did not find modal with key: \"" + key + "\""));
1125
+ }
1126
+ function moveModals(type, ref) {
1127
+ if (type === void 0) {
1128
+ type = this.settings.moveModals.type;
1129
+ }
1130
+
1131
+ if (ref === void 0) {
1132
+ ref = this.settings.moveModals.ref;
1133
+ }
1134
+
1135
+ var modals = document.querySelectorAll("[data-" + this.settings.dataModal + "]");
1136
+ if (modals.length) moveElement(modals, type, ref);
1137
+ }
1138
+
1139
+ function setInitialState() {
1140
+ var _this = this;
1141
+
1142
+ var modals = document.querySelectorAll("[data-" + this.settings.dataModal + "]");
1053
1143
  modals.forEach(function (el) {
1054
- if (el.classList.contains(obj.settings.stateOpened)) {
1055
- setInert(false, obj.settings.selectorInert);
1056
- setOverflowHidden(false, obj.settings.selectorOverflow);
1057
- focusTrigger(obj);
1058
- obj.focusTrap.destroy();
1059
- }
1144
+ // Remove opened state setup
1145
+ if (el.classList.contains(_this.settings.stateOpened)) {
1146
+ setInert(false, _this.settings.selectorInert);
1147
+ setOverflowHidden(false, _this.settings.selectorOverflow);
1148
+ focusTrigger(_this);
1149
+
1150
+ _this.focusTrap.destroy();
1151
+ } // Remove all state classes and add the default state (closed)
1060
1152
 
1061
- removeClass(el, obj.settings.stateOpened, obj.settings.stateOpening, obj.settings.stateClosing);
1062
- addClass(el, obj.settings.stateClosed);
1153
+
1154
+ removeClass(el, _this.settings.stateOpened, _this.settings.stateOpening, _this.settings.stateClosing);
1155
+ addClass(el, _this.settings.stateClosed);
1063
1156
  });
1064
1157
  }
1065
1158
 
1159
+ var open$1 = function open(modalKey) {
1160
+ try {
1161
+ var _this2 = this;
1162
+
1163
+ var modal = getModal.call(_this2, modalKey);
1164
+ if (!modal) return Promise.resolve(modalNotFound(modalKey));
1165
+
1166
+ if (hasClass(modal, _this2.settings.stateClosed)) {
1167
+ _this2.working = true;
1168
+ setOverflowHidden(true, _this2.settings.selectorOverflow);
1169
+ return Promise.resolve(openTransition(modal, _this2.settings)).then(function () {
1170
+ _this2.focusTrap.init(modal);
1171
+
1172
+ focusTarget(modal, _this2.settings);
1173
+ setInert(true, _this2.settings.selectorInert);
1174
+ modal.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'opened', {
1175
+ detail: _this2,
1176
+ bubbles: true
1177
+ }));
1178
+ _this2.working = false;
1179
+ return modal;
1180
+ });
1181
+ } else {
1182
+ return Promise.resolve(modal);
1183
+ }
1184
+ } catch (e) {
1185
+ return Promise.reject(e);
1186
+ }
1187
+ };
1188
+
1066
1189
  var Modal = /*#__PURE__*/function () {
1067
1190
  function Modal(options) {
1068
1191
  this.defaults = defaults$1;
@@ -1084,13 +1207,12 @@
1084
1207
 
1085
1208
  if (options) this.settings = _extends({}, this.settings, options);
1086
1209
  this.moveModals();
1210
+ this.setInitialState();
1087
1211
 
1088
1212
  if (this.settings.setTabindex) {
1089
1213
  this.setTabindex();
1090
1214
  }
1091
1215
 
1092
- this.setInitialState();
1093
-
1094
1216
  if (this.settings.eventListeners) {
1095
1217
  this.initEventListeners();
1096
1218
  }
@@ -1124,36 +1246,20 @@
1124
1246
  */
1125
1247
  ;
1126
1248
 
1127
- _proto.getModal = function getModal(modalKey) {
1128
- if (typeof modalKey !== 'string') return modalKey;
1129
- return document.querySelector("[data-" + this.settings.dataModal + "=\"" + modalKey + "\"]");
1130
- };
1131
-
1132
- _proto.modalNotFound = function modalNotFound(key) {
1133
- return Promise.reject(new Error("Did not find modal with key: \"" + key + "\""));
1249
+ _proto.getModal = function getModal$1(modalKey) {
1250
+ return getModal.call(this, modalKey);
1134
1251
  };
1135
1252
 
1136
1253
  _proto.setTabindex = function setTabindex$1() {
1137
- var selectorTabindex = "\n [data-" + this.settings.dataModal + "]\n [data-" + this.settings.dataDialog + "]\n ";
1138
-
1139
- setTabindex(selectorTabindex);
1254
+ return setTabindex("\n [data-" + this.settings.dataModal + "]\n [data-" + this.settings.dataDialog + "]\n ");
1140
1255
  };
1141
1256
 
1142
1257
  _proto.setInitialState = function setInitialState$1() {
1143
- setInitialState(this);
1258
+ return setInitialState.call(this);
1144
1259
  };
1145
1260
 
1146
- _proto.moveModals = 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);
1261
+ _proto.moveModals = function moveModals$1(type, ref) {
1262
+ return moveModals.call(this, type, ref);
1157
1263
  }
1158
1264
  /**
1159
1265
  * Change state functionality
@@ -1161,68 +1267,11 @@
1161
1267
  ;
1162
1268
 
1163
1269
  _proto.open = function open(modalKey) {
1164
- try {
1165
- var _this2 = this;
1166
-
1167
- var modal = _this2.getModal(modalKey);
1168
-
1169
- if (!modal) return Promise.resolve(_this2.modalNotFound(modalKey));
1170
-
1171
- if (hasClass(modal, _this2.settings.stateClosed)) {
1172
- _this2.working = true;
1173
- setOverflowHidden(true, _this2.settings.selectorOverflow);
1174
- return Promise.resolve(openTransition(modal, _this2.settings)).then(function () {
1175
- _this2.focusTrap.init(modal);
1176
-
1177
- focusTarget(modal, _this2.settings);
1178
- setInert(true, _this2.settings.selectorInert);
1179
- modal.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'opened', {
1180
- detail: _this2,
1181
- bubbles: true
1182
- }));
1183
- _this2.working = false;
1184
- return modal;
1185
- });
1186
- } else {
1187
- return Promise.resolve(modal);
1188
- }
1189
- } catch (e) {
1190
- return Promise.reject(e);
1191
- }
1270
+ return open$1.call(this, modalKey);
1192
1271
  };
1193
1272
 
1194
1273
  _proto.close = function close(returnFocus) {
1195
- if (returnFocus === void 0) {
1196
- returnFocus = true;
1197
- }
1198
-
1199
- try {
1200
- var _this4 = this;
1201
-
1202
- var modal = document.querySelector("[data-" + _this4.settings.dataModal + "]." + _this4.settings.stateOpened);
1203
-
1204
- if (modal) {
1205
- _this4.working = true;
1206
- setInert(false, _this4.settings.selectorInert);
1207
- setOverflowHidden(false, _this4.settings.selectorOverflow);
1208
- return Promise.resolve(closeTransition(modal, _this4.settings)).then(function () {
1209
- if (returnFocus) focusTrigger(_this4);
1210
-
1211
- _this4.focusTrap.destroy();
1212
-
1213
- modal.dispatchEvent(new CustomEvent(_this4.settings.customEventPrefix + 'closed', {
1214
- detail: _this4,
1215
- bubbles: true
1216
- }));
1217
- _this4.working = false;
1218
- return modal;
1219
- });
1220
- } else {
1221
- return Promise.resolve(modal);
1222
- }
1223
- } catch (e) {
1224
- return Promise.reject(e);
1225
- }
1274
+ return close$1.call(this, returnFocus);
1226
1275
  };
1227
1276
 
1228
1277
  return Modal;
@@ -1244,9 +1293,9 @@
1244
1293
  placement: 'bottom-start'
1245
1294
  };
1246
1295
 
1247
- function hide$2(popover, obj) {
1296
+ function close(popover) {
1248
1297
  // Update state class
1249
- popover.target.classList.remove(obj.settings.stateActive); // Update a11y attributes
1298
+ popover.target.classList.remove(this.settings.stateActive); // Update a11y attributes
1250
1299
 
1251
1300
  popover.trigger.setAttribute('aria-expanded', 'false'); // Disable popper event listeners
1252
1301
 
@@ -1257,32 +1306,43 @@
1257
1306
  }]
1258
1307
  }); // Update collection status with new state
1259
1308
 
1260
- var index = obj.collection.findIndex(function (item) {
1309
+ var index = this.collection.findIndex(function (item) {
1261
1310
  return item.target === popover.target;
1262
1311
  });
1263
- obj.collection[index].state = 'hide'; // Return the popover
1312
+ this.collection[index].state = 'closed'; // Clear the memory if popover trigger matches the ones saved in memory
1313
+
1314
+ if (popover.trigger === this.memory.trigger) {
1315
+ this.memory.trigger = null;
1316
+ } // Return the popover
1317
+
1264
1318
 
1265
1319
  return popover;
1266
1320
  }
1267
- function hideAll(obj) {
1268
- obj.collection.forEach(function (popover) {
1269
- if (popover.state === 'show') {
1270
- hide$2(popover, obj);
1321
+ function closeAll() {
1322
+ var _this = this;
1323
+
1324
+ this.collection.forEach(function (popover) {
1325
+ if (popover.state === 'opened') {
1326
+ _this.close(popover);
1271
1327
  }
1272
1328
  }); // Return the collection
1273
1329
 
1274
- return obj.collection;
1330
+ return this.collection;
1275
1331
  }
1276
- function hideCheck(popover, obj) {
1277
- // Needed to correctly check which element is currently being focused
1332
+ function closeCheck(popover) {
1333
+ var _this2 = this;
1334
+
1335
+ // Only run closeCheck if provided popover is currently open
1336
+ if (popover.state != 'opened') return; // Needed to correctly check which element is currently being focused
1337
+
1278
1338
  setTimeout(function () {
1279
1339
  // Check if trigger or target are being hovered
1280
1340
  var isHovered = popover.target.closest(':hover') === popover.target || popover.trigger.closest(':hover') === popover.trigger; // Check if trigger or target are being focused
1281
1341
 
1282
- 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
1342
+ var isFocused = document.activeElement.closest("[data-" + _this2.settings.dataPopover + "]") === popover.target || document.activeElement.closest("[data-" + _this2.settings.dataTrigger + "]") === popover.trigger; // Close if the trigger and target are not currently hovered or focused
1283
1343
 
1284
1344
  if (!isHovered && !isFocused) {
1285
- hide$2(popover, obj);
1345
+ _this2.close(popover);
1286
1346
  } // Return the popover
1287
1347
 
1288
1348
 
@@ -1290,6 +1350,57 @@
1290
1350
  }, 1);
1291
1351
  }
1292
1352
 
1353
+ function handlerClick(popover) {
1354
+ if (popover.target.classList.contains(this.settings.stateActive)) {
1355
+ this.close(popover);
1356
+ } else {
1357
+ this.memory.trigger = popover.trigger;
1358
+ this.open(popover);
1359
+ documentClick.call(this, popover);
1360
+ }
1361
+ }
1362
+ function handlerKeydown(event) {
1363
+ var _this = this;
1364
+
1365
+ switch (event.key) {
1366
+ case 'Escape':
1367
+ if (this.memory.trigger) {
1368
+ this.memory.trigger.focus();
1369
+ }
1370
+
1371
+ this.closeAll();
1372
+ return;
1373
+
1374
+ case 'Tab':
1375
+ this.collection.forEach(function (popover) {
1376
+ closeCheck.call(_this, popover);
1377
+ });
1378
+ return;
1379
+
1380
+ default:
1381
+ return;
1382
+ }
1383
+ }
1384
+ function documentClick(popover) {
1385
+ var obj = this;
1386
+ document.addEventListener('click', function _f(event) {
1387
+ var result = event.target.closest("[data-" + obj.settings.dataPopover + "], [data-" + obj.settings.dataTrigger + "]");
1388
+ var match = result === popover.target || result === popover.trigger;
1389
+
1390
+ if (!match) {
1391
+ if (popover.target.classList.contains(obj.settings.stateActive)) {
1392
+ obj.close(popover);
1393
+ }
1394
+
1395
+ this.removeEventListener('click', _f);
1396
+ } else {
1397
+ if (!popover.target.classList.contains(obj.settings.stateActive)) {
1398
+ this.removeEventListener('click', _f);
1399
+ }
1400
+ }
1401
+ });
1402
+ }
1403
+
1293
1404
  function getConfig(el, settings) {
1294
1405
  // Get the computed styles of the popover
1295
1406
  var styles = getComputedStyle(el); // Setup the config obj with default values
@@ -1306,7 +1417,8 @@
1306
1417
 
1307
1418
  for (var prop in config) {
1308
1419
  // Get the CSS variable property values
1309
- var val = styles.getPropertyValue("--popover-" + prop).trim(); // If a value was found, replace the default in config obj
1420
+ var prefix = getComputedStyle(document.body).getPropertyValue('--vrembem-variable-prefix');
1421
+ var val = styles.getPropertyValue("--" + prefix + "popover-" + prop).trim(); // If a value was found, replace the default in config obj
1310
1422
 
1311
1423
  if (val) {
1312
1424
  config[prop] = val;
@@ -1413,16 +1525,16 @@
1413
1525
  }
1414
1526
  }
1415
1527
 
1416
- function show(popover, obj) {
1528
+ function open(popover) {
1417
1529
  // Update state class
1418
- popover.target.classList.add(obj.settings.stateActive); // Update a11y attributes
1530
+ popover.target.classList.add(this.settings.stateActive); // Update a11y attributes
1419
1531
 
1420
1532
  popover.trigger.setAttribute('aria-expanded', 'true'); // Update popover config
1421
1533
 
1422
- popover.config = getConfig(popover.target, obj.settings); // Enable popper event listeners and set placement/modifiers
1534
+ popover.config = getConfig(popover.target, this.settings); // Enable popper event listeners and set placement/modifiers
1423
1535
 
1424
1536
  popover.popper.setOptions({
1425
- placement: getData(popover.target, obj.settings.dataPlacement, popover.config['placement']),
1537
+ placement: getData(popover.target, this.settings.dataPlacement, popover.config['placement']),
1426
1538
  modifiers: [{
1427
1539
  name: 'eventListeners',
1428
1540
  enabled: true
@@ -1431,46 +1543,14 @@
1431
1543
 
1432
1544
  popover.popper.update(); // Update collection status with new state
1433
1545
 
1434
- var index = obj.collection.findIndex(function (item) {
1546
+ var index = this.collection.findIndex(function (item) {
1435
1547
  return item.target === popover.target;
1436
1548
  });
1437
- obj.collection[index].state = 'show'; // Return the popover
1549
+ this.collection[index].state = 'opened'; // Return the popover
1438
1550
 
1439
1551
  return popover;
1440
1552
  }
1441
1553
 
1442
- function handlerClick(popover) {
1443
- if (popover.target.classList.contains(this.settings.stateActive)) {
1444
- hide$2(popover, this);
1445
- } else {
1446
- show(popover, this);
1447
- documentClick(popover, this);
1448
- }
1449
- }
1450
- function handlerKeydown(event) {
1451
- if (event.key === 'Escape') {
1452
- hideAll(this);
1453
- }
1454
- }
1455
- function documentClick(popover, obj) {
1456
- document.addEventListener('click', function _f(event) {
1457
- var result = event.target.closest("[data-" + obj.settings.dataPopover + "], [data-" + obj.settings.dataTrigger + "]");
1458
- var match = result === popover.target || result === popover.trigger;
1459
-
1460
- if (!match) {
1461
- if (popover.target.classList.contains(obj.settings.stateActive)) {
1462
- hide$2(popover, obj);
1463
- }
1464
-
1465
- this.removeEventListener('click', _f);
1466
- } else {
1467
- if (!popover.target.classList.contains(obj.settings.stateActive)) {
1468
- this.removeEventListener('click', _f);
1469
- }
1470
- }
1471
- });
1472
- }
1473
-
1474
1554
  var top = 'top';
1475
1555
  var bottom = 'bottom';
1476
1556
  var right = 'right';
@@ -3254,11 +3334,11 @@
3254
3334
  defaultModifiers: defaultModifiers
3255
3335
  }); // eslint-disable-next-line import/no-unused-modules
3256
3336
 
3257
- function register(trigger, target, obj) {
3337
+ function register(trigger, target) {
3258
3338
  // If no target is passed
3259
3339
  if (!target) {
3260
3340
  // Try and get the target
3261
- target = getPopover(trigger, obj.settings); // If still no target is returned, log an error and return false
3341
+ target = getPopover(trigger, this.settings); // If still no target is returned, log an error and return false
3262
3342
 
3263
3343
  if (!target) {
3264
3344
  console.error('No popover associated with the provided trigger:', trigger);
@@ -3267,7 +3347,7 @@
3267
3347
  } // Check if this item has already been registered in the collection
3268
3348
 
3269
3349
 
3270
- var index = obj.collection.findIndex(function (item) {
3350
+ var index = this.collection.findIndex(function (item) {
3271
3351
  return item.trigger === trigger && item.target === target;
3272
3352
  }); // Initiate popover variable
3273
3353
 
@@ -3275,45 +3355,45 @@
3275
3355
 
3276
3356
  if (index >= 0) {
3277
3357
  // Set popover as item from collection
3278
- popover = obj.collection[index];
3358
+ popover = this.collection[index];
3279
3359
  } else {
3280
3360
  // Create popper instance
3281
3361
  var popperInstance = createPopper(trigger, target); // Build popover object and push to collection array
3282
3362
 
3283
3363
  popover = {
3284
- state: 'hide',
3364
+ state: 'closed',
3285
3365
  trigger: trigger,
3286
3366
  target: target,
3287
3367
  popper: popperInstance,
3288
- config: getConfig(target, obj.settings)
3368
+ config: getConfig(target, this.settings)
3289
3369
  }; // Add item to collection
3290
3370
 
3291
- obj.collection.push(popover);
3371
+ this.collection.push(popover);
3292
3372
  } // Setup event listeners
3293
3373
 
3294
3374
 
3295
- registerEventListeners(popover, obj); // Set initial state of popover
3375
+ registerEventListeners.call(this, popover); // Set initial state of popover
3296
3376
 
3297
- if (popover.target.classList.contains(obj.settings.stateActive)) {
3298
- show(popover, obj);
3299
- documentClick(popover, obj);
3377
+ if (popover.target.classList.contains(this.settings.stateActive)) {
3378
+ this.open(popover);
3379
+ documentClick.call(this, popover);
3300
3380
  } else {
3301
- hide$2(popover, obj);
3381
+ this.close(popover);
3302
3382
  } // Return the popover object
3303
3383
 
3304
3384
 
3305
3385
  return popover;
3306
3386
  }
3307
- function deregister(popover, obj) {
3387
+ function deregister(popover) {
3308
3388
  // Check if this item has been registered in the collection
3309
- var index = obj.collection.findIndex(function (item) {
3389
+ var index = this.collection.findIndex(function (item) {
3310
3390
  return item.trigger === popover.trigger && item.target === popover.target;
3311
3391
  }); // If the item exists in the collection
3312
3392
 
3313
3393
  if (index >= 0) {
3314
- // Hide the popover
3315
- if (popover.state === 'show') {
3316
- hide$2(popover, obj);
3394
+ // Close the popover
3395
+ if (popover.state === 'opened') {
3396
+ this.close(popover);
3317
3397
  } // Clean up the popper instance
3318
3398
 
3319
3399
 
@@ -3321,28 +3401,28 @@
3321
3401
 
3322
3402
  deregisterEventListeners(popover); // Remove item from collection
3323
3403
 
3324
- obj.collection.splice(index, 1);
3404
+ this.collection.splice(index, 1);
3325
3405
  } // Return the new collection
3326
3406
 
3327
3407
 
3328
- return obj.collection;
3408
+ return this.collection;
3329
3409
  }
3330
- function registerEventListeners(popover, obj) {
3410
+ function registerEventListeners(popover) {
3331
3411
  // If event listeners aren't already setup
3332
3412
  if (!popover.__eventListeners) {
3333
3413
  // Add event listeners based on event type
3334
- var eventType = getData(popover.target, obj.settings.dataEventType, popover.config['event']);
3414
+ var eventType = getData(popover.target, this.settings.dataEventType, popover.config['event']);
3335
3415
 
3336
3416
  if (eventType === 'hover') {
3337
3417
  // Setup event listeners object for hover
3338
3418
  popover.__eventListeners = [{
3339
3419
  el: ['trigger'],
3340
3420
  type: ['mouseenter', 'focus'],
3341
- listener: show.bind(null, popover, obj)
3421
+ listener: open.bind(this, popover)
3342
3422
  }, {
3343
3423
  el: ['trigger', 'target'],
3344
3424
  type: ['mouseleave', 'focusout'],
3345
- listener: hideCheck.bind(null, popover, obj)
3425
+ listener: closeCheck.bind(this, popover)
3346
3426
  }]; // Loop through listeners and apply to appropriate elements
3347
3427
 
3348
3428
  popover.__eventListeners.forEach(function (evObj) {
@@ -3357,7 +3437,7 @@
3357
3437
  popover.__eventListeners = [{
3358
3438
  el: ['trigger'],
3359
3439
  type: ['click'],
3360
- listener: handlerClick.bind(obj, popover)
3440
+ listener: handlerClick.bind(this, popover)
3361
3441
  }]; // Loop through listeners and apply to appropriate elements
3362
3442
 
3363
3443
  popover.__eventListeners.forEach(function (evObj) {
@@ -3392,24 +3472,26 @@
3392
3472
 
3393
3473
  return popover;
3394
3474
  }
3395
- function registerCollection(obj) {
3475
+ function registerCollection() {
3476
+ var _this = this;
3477
+
3396
3478
  // Get all the triggers
3397
- var triggers = document.querySelectorAll("[data-" + obj.settings.dataTrigger + "]");
3479
+ var triggers = document.querySelectorAll("[data-" + this.settings.dataTrigger + "]");
3398
3480
  triggers.forEach(function (trigger) {
3399
3481
  // Register the popover and save to collection array
3400
- register(trigger, false, obj);
3482
+ _this.register(trigger, false);
3401
3483
  }); // Return the popover collection
3402
3484
 
3403
- return obj.collection;
3485
+ return this.collection;
3404
3486
  }
3405
- function deregisterCollection(obj) {
3487
+ function deregisterCollection() {
3406
3488
  // Loop through all items within the collection and pass them to deregister()
3407
- while (obj.collection.length > 0) {
3408
- deregister(obj.collection[0], obj);
3489
+ while (this.collection.length > 0) {
3490
+ this.deregister(this.collection[0]);
3409
3491
  } // Return the popover collection
3410
3492
 
3411
3493
 
3412
- return obj.collection;
3494
+ return this.collection;
3413
3495
  }
3414
3496
 
3415
3497
  var Popover = /*#__PURE__*/function () {
@@ -3417,6 +3499,9 @@
3417
3499
  this.defaults = defaults;
3418
3500
  this.settings = _extends({}, this.defaults, options);
3419
3501
  this.collection = [];
3502
+ this.memory = {
3503
+ trigger: null
3504
+ };
3420
3505
  this.__handlerKeydown = handlerKeydown.bind(this);
3421
3506
  if (this.settings.autoInit) this.init();
3422
3507
  }
@@ -3431,8 +3516,7 @@
3431
3516
  // Update settings with passed options
3432
3517
  if (options) this.settings = _extends({}, this.settings, options); // Build the collections array with popover instances
3433
3518
 
3434
- registerCollection(this); // If eventListeners is enabled
3435
-
3519
+ this.registerCollection(); // If eventListeners is enabled
3436
3520
 
3437
3521
  if (this.settings.eventListeners) {
3438
3522
  // Pass false to initEventListeners() since registerCollection()
@@ -3443,8 +3527,7 @@
3443
3527
 
3444
3528
  _proto.destroy = function destroy() {
3445
3529
  // Deregister all popovers from collection
3446
- deregisterCollection(this); // If eventListeners is enabled
3447
-
3530
+ this.deregisterCollection(); // If eventListeners is enabled
3448
3531
 
3449
3532
  if (this.settings.eventListeners) {
3450
3533
  // Pass false to destroyEventListeners() since deregisterCollection()
@@ -3467,7 +3550,7 @@
3467
3550
  if (processCollection) {
3468
3551
  // Loop through collection and setup event listeners
3469
3552
  this.collection.forEach(function (popover) {
3470
- registerEventListeners(popover, _this);
3553
+ registerEventListeners.call(_this, popover);
3471
3554
  });
3472
3555
  } // Add keydown global event listener
3473
3556
 
@@ -3500,35 +3583,35 @@
3500
3583
  target = false;
3501
3584
  }
3502
3585
 
3503
- return register(trigger, target, this);
3586
+ return register.call(this, trigger, target);
3504
3587
  };
3505
3588
 
3506
3589
  _proto.deregister = function deregister$1(popover) {
3507
- return deregister(popover, this);
3590
+ return deregister.call(this, popover);
3508
3591
  };
3509
3592
 
3510
3593
  _proto.registerCollection = function registerCollection$1() {
3511
- return registerCollection(this);
3594
+ return registerCollection.call(this);
3512
3595
  };
3513
3596
 
3514
3597
  _proto.deregisterCollection = function deregisterCollection$1() {
3515
- return deregisterCollection(this);
3598
+ return deregisterCollection.call(this);
3516
3599
  }
3517
3600
  /**
3518
3601
  * Change state functionality
3519
3602
  */
3520
3603
  ;
3521
3604
 
3522
- _proto.show = function show$1(popover) {
3523
- return show(popover, this);
3605
+ _proto.open = function open$1(popover) {
3606
+ return open.call(this, popover);
3524
3607
  };
3525
3608
 
3526
- _proto.hide = function hide(popover) {
3527
- return hide$2(popover, this);
3609
+ _proto.close = function close$1(popover) {
3610
+ return close.call(this, popover);
3528
3611
  };
3529
3612
 
3530
- _proto.hideAll = function hideAll$1() {
3531
- return hideAll(this);
3613
+ _proto.closeAll = function closeAll$1() {
3614
+ return closeAll.call(this);
3532
3615
  };
3533
3616
 
3534
3617
  return Popover;