@appartmint/mint 0.12.16 → 0.12.26

package/dist/js/imports/components/header.d.ts

@@ -114,6 +114,10 @@ export declare class mintHeader {
      * @param e - Mouse event
      */
     eToggleMenu(e: MouseEvent): void;
+    /**
+     * Runs after the mobile menu transitions
+     */
+    eTransitionEnd(): void;
 }
 export default mintHeader;
 //# sourceMappingURL=header.d.ts.map

package/dist/js/imports/components/header.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../../src/ts/imports/components/header.ts"],"names":[],"mappings":"AAQA;;;GAGG;AACH,qBAAa,UAAU;IACnB;;OAEG;IACH,SAAS,EAAE,MAAM,CAA0B;IAE3C;;OAEG;IACH,EAAE,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,WAAW,GAAG,IAAI,CAAA;KAAC,CAAM;IAE7C;;OAEG;gBACU,QAAQ,CAAC,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAC;IAc5C;;OAEG;IACH,cAAc,IAAM,IAAI;IAQxB;;OAEG;IACH,YAAY,IAAM,IAAI;IAmBtB;;OAEG;IACH,UAAU,IAAM,IAAI;IAMpB;;;OAGG;IACH,aAAa,CAAE,IAAI,GAAE,OAAe,GAAI,IAAI;IAkD5C;;OAEG;IACH,gBAAgB,IAAM,IAAI;IAI1B;;;;OAIG;IACH,OAAO,CAAE,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,EAC3B,IAAI,GAAE,OAAe,GAAI,IAAI;IActC;;;OAGG;IACH,UAAU,CAAE,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,GAAI,IAAI;IAI/C;;;OAGG;IACH,aAAa,CAAE,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,GAAI,IAAI;IAWlD;;;OAGG;IACH,iBAAiB,CAAE,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,GAAI,IAAI;IAUtD;;OAEG;IACH,aAAa,IAAM,IAAI;IAOvB;;OAEG;IACH,eAAe,IAAM,IAAI;IAezB;;OAEG;IACH,gBAAgB,IAAM,IAAI;IAc1B;;OAEG;IACH,iBAAiB,IAAM,IAAI;IAQ3B;;OAEG;IACH,aAAa,CAAE,CAAC,EAAE,KAAK,GAAI,IAAI;IAS/B;;OAEG;IACH,aAAa,IAAM,IAAI;IAIvB;;;OAGG;IACH,QAAQ,CAAE,CAAC,EAAE,aAAa,GAAI,IAAI;IASlC;;;OAGG;IACH,qBAAqB,CAAE,CAAC,EAAE,aAAa,GAAI,IAAI;IAsB/C;;;OAGG;IACH,mBAAmB,CAAE,CAAC,EAAE,aAAa,GAAI,IAAI;IAgB7C;;;OAGG;IACH,eAAe,CAAE,CAAC,EAAE,aAAa,GAAI,IAAI;IAezC;;OAEG;IACH,iBAAiB,IAAM,IAAI;IAI3B;;;OAGG;IACH,WAAW,CAAE,CAAC,EAAE,UAAU,GAAI,IAAI;CAKrC;AACD,eAAe,UAAU,CAAC"}
+{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../../src/ts/imports/components/header.ts"],"names":[],"mappings":"AAQA;;;GAGG;AACH,qBAAa,UAAU;IACnB;;OAEG;IACH,SAAS,EAAE,MAAM,CAA0B;IAE3C;;OAEG;IACH,EAAE,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,WAAW,GAAG,IAAI,CAAA;KAAC,CAAM;IAE7C;;OAEG;gBACU,QAAQ,CAAC,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAC;IAc5C;;OAEG;IACH,cAAc,IAAM,IAAI;IAQxB;;OAEG;IACH,YAAY,IAAM,IAAI;IAoBtB;;OAEG;IACH,UAAU,IAAM,IAAI;IAMpB;;;OAGG;IACH,aAAa,CAAE,IAAI,GAAE,OAAe,GAAI,IAAI;IA4C5C;;OAEG;IACH,gBAAgB,IAAM,IAAI;IAI1B;;;;OAIG;IACH,OAAO,CAAE,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,EAC3B,IAAI,GAAE,OAAe,GAAI,IAAI;IActC;;;OAGG;IACH,UAAU,CAAE,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,GAAI,IAAI;IAI/C;;;OAGG;IACH,aAAa,CAAE,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,GAAI,IAAI;IAWlD;;;OAGG;IACH,iBAAiB,CAAE,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,GAAI,IAAI;IAUtD;;OAEG;IACH,aAAa,IAAM,IAAI;IAOvB;;OAEG;IACH,eAAe,IAAM,IAAI;IAezB;;OAEG;IACH,gBAAgB,IAAM,IAAI;IAc1B;;OAEG;IACH,iBAAiB,IAAM,IAAI;IAQ3B;;OAEG;IACH,aAAa,CAAE,CAAC,EAAE,KAAK,GAAI,IAAI;IAQ/B;;OAEG;IACH,aAAa,IAAM,IAAI;IAIvB;;;OAGG;IACH,QAAQ,CAAE,CAAC,EAAE,aAAa,GAAI,IAAI;IASlC;;;OAGG;IACH,qBAAqB,CAAE,CAAC,EAAE,aAAa,GAAI,IAAI;IAwB/C;;;OAGG;IACH,mBAAmB,CAAE,CAAC,EAAE,aAAa,GAAI,IAAI;IAiB7C;;;OAGG;IACH,eAAe,CAAE,CAAC,EAAE,aAAa,GAAI,IAAI;IAezC;;OAEG;IACH,iBAAiB,IAAM,IAAI;IAI3B;;;OAGG;IACH,WAAW,CAAE,CAAC,EAAE,UAAU,GAAI,IAAI;IAMlC;;OAEG;IACH,cAAc,IAAM,IAAI;CAK3B;AACD,eAAe,UAAU,CAAC"}

package/dist/js/index.js

@@ -78,7 +78,7 @@ class mintHeader {
    * Adds events to the dom
    */
   attachEvents() {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     //window.addEventListener('resize', mintUtil.throttleEvent(this.eHandleResize.bind(this), mintSettings.delay.default, { trailing: false }));
     window.addEventListener('scroll', util_1.default.throttleEvent(this.eHandleScroll.bind(this), settings_1.default.delay.default, {
       trailing: false
@@ -91,13 +91,14 @@ class mintHeader {
     });
     let menuButtons = (_b = this.el.header) === null || _b === void 0 ? void 0 : _b.querySelectorAll(selectors_1.default.controls() + selectors_1.default.neg(selectors_1.default.controls(selectors_1.default.ids.wrapper)));
     menuButtons === null || menuButtons === void 0 ? void 0 : menuButtons.forEach(menuButton => {
-      menuButton.addEventListener('mousedown', util_1.default.throttleEvent(this.eToggleMenu.bind(this), settings_1.default.delay.slow, {
+      menuButton.addEventListener('click', util_1.default.throttleEvent(this.eToggleMenu.bind(this), settings_1.default.delay.slow, {
         trailing: false
       }));
     });
-    (_c = this.el.mobileButton) === null || _c === void 0 ? void 0 : _c.addEventListener('mousedown', util_1.default.throttleEvent(this.eToggleMobileMenu.bind(this), settings_1.default.delay.slow, {
+    (_c = this.el.mobileButton) === null || _c === void 0 ? void 0 : _c.addEventListener('click', util_1.default.throttleEvent(this.eToggleMobileMenu.bind(this), settings_1.default.delay.slow, {
       trailing: false
     }));
+    (_d = this.el.wrapper) === null || _d === void 0 ? void 0 : _d.addEventListener('transitionend', this.eTransitionEnd.bind(this));
   }
   /**
    * Adds classes that inform the styles
@@ -114,7 +115,7 @@ class mintHeader {
    */
   setMobileMenu() {
     let open = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-    var _a, _b, _c;
+    var _a;
     let ariaExpanded = open ? 'true' : 'false',
       ariaLabel = open ? 'close menu' : 'open menu';
     (_a = this.el.mobileButton) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-expanded', ariaExpanded);
@@ -146,18 +147,10 @@ class mintHeader {
       if (this.el.html) {
         this.el.html.style.overflow = 'auto';
       }
-      (_b = this.el.wrapper) === null || _b === void 0 ? void 0 : _b.classList.remove(selectors_1.default.getClass('open'));
-      const onTransitionEnd = () => {
-        if (this.el.wrapper) {
-          this.el.wrapper.style.display = 'none';
-          this.el.wrapper.removeEventListener('transitionend', onTransitionEnd);
-        }
-      };
-      if (typeof ((_c = this.el.wrapper) === null || _c === void 0 ? void 0 : _c.style.transition) !== 'undefined') {
-        this.el.wrapper.addEventListener('transitionend', onTransitionEnd);
-      } else {
-        setTimeout(onTransitionEnd, settings_1.default.delay.default);
-      }
+      requestAnimationFrame(() => {
+        var _a;
+        (_a = this.el.wrapper) === null || _a === void 0 ? void 0 : _a.classList.remove(selectors_1.default.getClass('open'));
+      });
       this.closeAllMenus();
     }
   }
@@ -282,7 +275,6 @@ class mintHeader {
    * Closes the mobile menu when the window resizes
    */
   eHandleResize(e) {
-    //console.log(e, window.innerWidth, mintUtil.windowWidth(), this.lastWidth);
     // Also check if resized from mobile to desktop
     if (util_1.default.windowWidth() !== this.lastWidth) {
       this.setMobileMenu();
@@ -315,7 +307,7 @@ class mintHeader {
   eHandleButtonKeypress(e) {
     var _a;
     let target = e.target,
-      subMenu = target.closest('li');
+      subMenu = target === null || target === void 0 ? void 0 : target.closest('li');
     switch (e.key.toLowerCase()) {
       case 'escape':
         if (subMenu === null || subMenu === void 0 ? void 0 : subMenu.classList.contains(selectors_1.default.classes.open)) {
@@ -328,9 +320,11 @@ class mintHeader {
         this.closeClosestMenu();
         break;
       case 'arrowright':
+        this.openClosestMenu();
         break;
       case 'enter':
       case 'space':
+        target === null || target === void 0 ? void 0 : target.click();
         break;
     }
   }
@@ -339,6 +333,7 @@ class mintHeader {
    * @param e - Keyboard event
    */
   eHandleLinkKeypress(e) {
+    let target = e.target;
     switch (e.key.toLowerCase()) {
       case 'escape':
       case 'arrowleft':
@@ -349,7 +344,7 @@ class mintHeader {
         break;
       case 'enter':
       case 'space':
-        this.toggleClosestMenu();
+        target === null || target === void 0 ? void 0 : target.click();
         break;
     }
   }
@@ -361,7 +356,7 @@ class mintHeader {
     if (e.key.toLowerCase() !== 'tab') {
       e.preventDefault();
     }
-    let target = e.target;
+    const target = e.target;
     switch (target === null || target === void 0 ? void 0 : target.tagName.toLowerCase()) {
       case 'a':
         this.eHandleLinkKeypress(e);
@@ -386,6 +381,15 @@ class mintHeader {
     this.closeSiblingMenus(target);
     this.toggleMenu(target);
   }
+  /**
+   * Runs after the mobile menu transitions
+   */
+  eTransitionEnd() {
+    var _a;
+    if (((_a = this.el.wrapper) === null || _a === void 0 ? void 0 : _a.classList.contains(selectors_1.default.getClass('open'))) === false) {
+      this.el.wrapper.style.display = 'none';
+    }
+  }
 }
 exports.mintHeader = mintHeader;
 exports["default"] = mintHeader;
@@ -1514,8 +1518,7 @@ class mintUtil {
    * @returns the width of the window
    */
   static windowWidth() {
-    let body = document.getElementsByTagName('body')[0],
-      decimal = body.getBoundingClientRect().width % 1;
+    const decimal = document.body.getBoundingClientRect().width % 1;
     return window.innerWidth + decimal;
   }
   /**