@appartmint/mint 0.13.4 → 0.14.0

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

@@ -4,9 +4,11 @@
  */
 export declare class mintHeader {
     /**
-     * Last-logged window width
+     * Navbar settings
      */
-    lastWidth: number;
+    settings: {
+        [key: string]: any;
+    };
     /**
      * Frequently-referenced elements
      */
@@ -28,7 +30,7 @@ export declare class mintHeader {
      */
     attachEvents(): void;
     /**
-     * Adds classes that inform the styles
+     * Adds classes that inform the styles based on settings
      */
     addClasses(): void;
     /**
@@ -80,7 +82,7 @@ export declare class mintHeader {
     /**
      * Closes the mobile menu when the window resizes
      */
-    eHandleResize(e: Event): void;
+    eHandleResize(): void;
     /**
      * Closes all submenus when the page is scrolled
      */

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;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;IAyB/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"}
+{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../../src/ts/imports/components/header.ts"],"names":[],"mappings":"AAQA;;;GAGG;AACH,qBAAa,UAAU;IACnB;;OAEG;IACF,QAAQ,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAC,CAG7B;IAEF;;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;IAQ5C;;OAEG;IACH,cAAc,IAAM,IAAI;IAQxB;;OAEG;IACH,YAAY,IAAM,IAAI;IAoBtB;;OAEG;IACH,UAAU,IAAM,IAAI;IAYpB;;;OAGG;IACH,aAAa,CAAE,IAAI,GAAE,OAAe,GAAI,IAAI;IAsD5C;;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,IAAM,IAAI;IAoBvB;;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;IAyB/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/imports/util/selectors.d.ts

@@ -55,22 +55,6 @@ export declare abstract class mintSelectors {
      * CSS-selector for submenus
      */
     static subMenu: string;
-    /**
-     * Frequently-used ids
-     */
-    static ids: {
-        [key: string]: string | {
-            [key: string]: string;
-        };
-    };
-    /**
-     * Classes
-     */
-    static classes: {
-        [key: string]: string | {
-            [key: string]: string;
-        };
-    };
     /**
      * Adds the library prefix to the beginning of the provided string
      * @param base - the string to be prefixed
@@ -119,14 +103,6 @@ export declare abstract class mintSelectors {
      * @returns - the generated CSS selector
      */
     static expanded(bool?: boolean | null): string;
-    /**
-     * Returns the id of the requested element
-     */
-    static getId(id?: string): string;
-    /**
-     * Returns the class of the requested element
-     */
-    static getClass(className?: string, classGroup?: string): string;
     /**
      * Returns a NodeList of HTMLElements within the given element that are focusable
      * @param el - the element whose focusable children will be returned

package/dist/js/imports/util/selectors.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"selectors.d.ts","sourceRoot":"","sources":["../../../../src/ts/imports/util/selectors.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,8BAAsB,aAAa;IAC/B;;OAEG;IACH,MAAM,CAAC,GAAG,EAAE,MAAM,CAAU;IAE5B;;OAEG;IACH,MAAM,CAAC,GAAG,EAAE,MAAM,CAAkB;IAEpC;;OAEG;IACH,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAgB;IAEvC;;OAEG;IACH,MAAM,CAAC,WAAW,EAAE,MAAM,CAAqB;IAE/C;;OAEG;IACH,MAAM,CAAC,WAAW,EAAE,MAAM,CAAqB;IAE/C;;OAEG;IACH,MAAM,CAAC,OAAO,EAAE,MAAM,CAAY;IAElC;;OAEG;IACH,MAAM,CAAC,aAAa,EAAE,MAAM,CAAkB;IAE9C;;OAEG;IACH,MAAM,CAAC,KAAK,EAAE,MAAM,CAAU;IAE9B;;OAEG;IACH,MAAM,CAAC,WAAW,EAAE,MAAM,CAAqB;IAE/C;;OAEG;IACH,MAAM,CAAC,QAAQ,EAAE,MAAM,CAA6C;IAEpE;;OAEG;IACH,MAAM,CAAC,SAAS,EAAE,MAAM,CAOyC;IAEjE;;OAEG;IACH,MAAM,CAAC,cAAc,EAAE,MAAM,CAA+B;IAE5D;;OAEG;IACH,MAAM,CAAC,OAAO,EAAE,MAAM,CAA8C;IAEpE;;OAEG;IACH,MAAM,CAAC,GAAG,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG;YAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;SAAC,CAAA;KAAC,CAK3D;IAEF;;OAEG;IACH,MAAM,CAAC,OAAO,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG;YAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;SAAC,CAAA;KAAC,CAY/D;IAEF;;;;OAIG;IACH,MAAM,CAAC,MAAM,CAAE,IAAI,EAAE,MAAM,GAAI,MAAM;IAKrC;;;;OAIG;IACH,MAAM,CAAC,SAAS,CAAE,IAAI,EAAE,MAAM,GAAI,MAAM;IAIxC;;;;OAIG;IACH,MAAM,CAAC,MAAM,CAAE,IAAI,EAAE,MAAM,GAAI,MAAM;IAIrC;;;;OAIG;IACH,MAAM,CAAC,GAAG,CAAE,IAAI,EAAE,MAAM,GAAI,MAAM;IAIlC;;;;OAIG;IACH,MAAM,CAAC,KAAK,CAAE,IAAI,EAAE,MAAM,GAAI,MAAM;IAIpC;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAE,IAAI,EAAE,MAAM,GAAI,MAAM;IAIjC;;;;OAIG;IACH,MAAM,CAAC,QAAQ,CAAE,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,GAAI,MAAM;IAI7C;;;;OAIG;IACH,MAAM,CAAC,QAAQ,CAAE,IAAI,CAAC,EAAE,OAAO,GAAG,IAAI,GAAI,MAAM;IAIhD;;OAEG;IACH,MAAM,CAAC,KAAK,CAAE,EAAE,CAAC,EAAE,MAAM,GAAI,MAAM;IAInC;;OAEG;IACH,MAAM,CAAC,QAAQ,CAAE,SAAS,CAAC,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,MAAM,GAAI,MAAM;IAQlE;;;;OAIG;IACH,MAAM,CAAC,aAAa,CAAE,EAAE,CAAC,EAAE,WAAW,GAAI,WAAW,EAAE;IAUvD;;;;;;OAMG;IACH,MAAM,CAAC,WAAW,CAAE,EAAE,EAAE,WAAW,GAAI,OAAO;CAWjD;AACD,eAAe,aAAa,CAAC"}
+{"version":3,"file":"selectors.d.ts","sourceRoot":"","sources":["../../../../src/ts/imports/util/selectors.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,8BAAsB,aAAa;IAC/B;;OAEG;IACH,MAAM,CAAC,GAAG,EAAE,MAAM,CAAU;IAE5B;;OAEG;IACH,MAAM,CAAC,GAAG,EAAE,MAAM,CAAkB;IAEpC;;OAEG;IACH,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAgB;IAEvC;;OAEG;IACH,MAAM,CAAC,WAAW,EAAE,MAAM,CAAqB;IAE/C;;OAEG;IACH,MAAM,CAAC,WAAW,EAAE,MAAM,CAAqB;IAE/C;;OAEG;IACH,MAAM,CAAC,OAAO,EAAE,MAAM,CAAY;IAElC;;OAEG;IACH,MAAM,CAAC,aAAa,EAAE,MAAM,CAAkB;IAE9C;;OAEG;IACH,MAAM,CAAC,KAAK,EAAE,MAAM,CAAU;IAE9B;;OAEG;IACH,MAAM,CAAC,WAAW,EAAE,MAAM,CAAqB;IAE/C;;OAEG;IACH,MAAM,CAAC,QAAQ,EAAE,MAAM,CAA6C;IAEpE;;OAEG;IACH,MAAM,CAAC,SAAS,EAAE,MAAM,CAOyC;IAEjE;;OAEG;IACH,MAAM,CAAC,cAAc,EAAE,MAAM,CAA+B;IAE5D;;OAEG;IACH,MAAM,CAAC,OAAO,EAAE,MAAM,CAA8C;IAEpE;;;;OAIG;IACH,MAAM,CAAC,MAAM,CAAE,IAAI,EAAE,MAAM,GAAI,MAAM;IAKrC;;;;OAIG;IACH,MAAM,CAAC,SAAS,CAAE,IAAI,EAAE,MAAM,GAAI,MAAM;IAIxC;;;;OAIG;IACH,MAAM,CAAC,MAAM,CAAE,IAAI,EAAE,MAAM,GAAI,MAAM;IAIrC;;;;OAIG;IACH,MAAM,CAAC,GAAG,CAAE,IAAI,EAAE,MAAM,GAAI,MAAM;IAIlC;;;;OAIG;IACH,MAAM,CAAC,KAAK,CAAE,IAAI,EAAE,MAAM,GAAI,MAAM;IAIpC;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAE,IAAI,EAAE,MAAM,GAAI,MAAM;IAIjC;;;;OAIG;IACH,MAAM,CAAC,QAAQ,CAAE,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,GAAI,MAAM;IAI7C;;;;OAIG;IACH,MAAM,CAAC,QAAQ,CAAE,IAAI,CAAC,EAAE,OAAO,GAAG,IAAI,GAAI,MAAM;IAIhD;;;;OAIG;IACH,MAAM,CAAC,aAAa,CAAE,EAAE,CAAC,EAAE,WAAW,GAAI,WAAW,EAAE;IAUvD;;;;;;OAMG;IACH,MAAM,CAAC,WAAW,CAAE,EAAE,EAAE,WAAW,GAAI,OAAO;CAWjD;AACD,eAAe,aAAa,CAAC"}

package/dist/js/imports/util/settings.d.ts

@@ -1,7 +1,3 @@
-/**
- * Imports
- */
-import { mintSide } from '../enum';
 /**
  * Settings management
  * @public
@@ -22,13 +18,11 @@ export declare abstract class mintSettings {
         [key: string]: number;
     };
     /**
-     * Side of the window the mobile navbar enters from
+     * Breakpoint variables
      */
-    static from?: mintSide;
-    /**
-    * Whether the navbar is fixed or not
-    */
-    static fixed?: boolean;
+    static break: {
+        [key: string]: number;
+    };
     /**
      * Update the provided settings variables
      * @param settings - Object of settings variables to update
@@ -40,14 +34,6 @@ export declare abstract class mintSettings {
      * Updates the delay variables based on `this.delayBase` and `this.delayStep`
      */
     protected static setDelay(): void;
-    /**
-     * Updates the direction the navbar enters from
-     */
-    protected static setFrom(from: mintSide): void;
-    /**
-     * Updates whether or not the navbar is fixed
-     */
-    protected static setFixed(fixed: boolean): void;
 }
 export default mintSettings;
 //# sourceMappingURL=settings.d.ts.map

package/dist/js/imports/util/settings.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"settings.d.ts","sourceRoot":"","sources":["../../../../src/ts/imports/util/settings.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAGnC;;;GAGG;AACH,8BAAsB,YAAY;IAC9B;;OAEG;IACH,MAAM,CAAC,SAAS,EAAE,MAAM,CAAK;IAE7B;;OAEG;IACH,MAAM,CAAC,SAAS,EAAE,MAAM,CAAO;IAE/B;;OAEG;IACH,MAAM,CAAC,KAAK,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAC,CAOnC;IAEF;;OAEG;IACH,MAAM,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC;IAEvB;;MAEE;IACF,MAAM,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC;IAEvB;;;OAGG;IACH,MAAM,CAAC,GAAG,CAAE,QAAQ,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAC,GAAI,IAAI;IA6BlD;;OAEG;IACH,SAAS,CAAC,MAAM,CAAC,QAAQ,IAAM,IAAI;IAWnC;;OAEG;IACH,SAAS,CAAC,MAAM,CAAC,OAAO,CAAE,IAAI,EAAE,QAAQ,GAAI,IAAI;IAShD;;OAEG;IACH,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAE,KAAK,EAAE,OAAO,GAAI,IAAI;CAYpD;AAED,eAAe,YAAY,CAAC"}
+{"version":3,"file":"settings.d.ts","sourceRoot":"","sources":["../../../../src/ts/imports/util/settings.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,8BAAsB,YAAY;IAC9B;;OAEG;IACH,MAAM,CAAC,SAAS,EAAE,MAAM,CAAK;IAE7B;;OAEG;IACH,MAAM,CAAC,SAAS,EAAE,MAAM,CAAO;IAE/B;;OAEG;IACH,MAAM,CAAC,KAAK,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAC,CAOnC;IAEF;;OAEG;IACH,MAAM,CAAC,KAAK,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAC,CAOnC;IAEF;;;OAGG;IACH,MAAM,CAAC,GAAG,CAAE,QAAQ,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAC,GAAI,IAAI;IA2BlD;;OAEG;IACH,SAAS,CAAC,MAAM,CAAC,QAAQ,IAAM,IAAI;CAUtC;AAED,eAAe,YAAY,CAAC"}

package/dist/js/index.js

@@ -46,22 +46,20 @@ class mintHeader {
    */
   constructor(settings) {
     /**
-     * Last-logged window width
+     * Navbar settings
      */
-    this.lastWidth = util_1.default.windowWidth();
+    this.settings = {
+      from: enum_1.mintSide.Top,
+      fixed: true
+    };
     /**
      * Frequently-referenced elements
      */
     this.el = {};
-    let defaultSettings = {
-      from: enum_1.mintSide.Top,
-      fixed: true
-    };
-    settings_1.default.set(Object.assign(Object.assign({}, defaultSettings), settings));
+    this.settings = Object.assign(Object.assign({}, this.settings), settings);
     this.attachElements();
     this.attachEvents();
     this.addClasses();
-    this.setMobileMenu();
   }
   /**
    * Adds elements to {@link el | `this.el`}
@@ -70,16 +68,16 @@ class mintHeader {
     var _a;
     this.el.html = document.querySelector('html');
     this.el.body = document.querySelector('body');
-    this.el.header = document.getElementById(selectors_1.default.getId('header'));
-    this.el.mobileButton = ((_a = this.el.header) === null || _a === void 0 ? void 0 : _a.querySelector(selectors_1.default.controls(selectors_1.default.getId('wrapper')))) || null;
-    this.el.wrapper = document.getElementById(selectors_1.default.getId('wrapper'));
+    this.el.header = document.getElementById('mint-header');
+    this.el.mobileButton = ((_a = this.el.header) === null || _a === void 0 ? void 0 : _a.querySelector(selectors_1.default.controls('mint-wrapper'))) || null;
+    this.el.wrapper = document.getElementById('mint-wrapper');
   }
   /**
    * Adds events to the dom
    */
   attachEvents() {
     var _a, _b, _c, _d;
-    //window.addEventListener('resize', mintUtil.throttleEvent(this.eHandleResize.bind(this), mintSettings.delay.default, { trailing: false }));
+    window.addEventListener('resize', util_1.default.throttleEvent(this.eHandleResize.bind(this), settings_1.default.delay.default));
     window.addEventListener('scroll', util_1.default.throttleEvent(this.eHandleScroll.bind(this), settings_1.default.delay.default, {
       trailing: false
     }));
@@ -89,7 +87,7 @@ class mintHeader {
     focusables === null || focusables === void 0 ? void 0 : focusables.forEach(focusable => {
       focusable.addEventListener('keydown', util_1.default.throttleEvent(this.eHandleKeypress.bind(this)));
     });
-    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)));
+    let menuButtons = (_b = this.el.wrapper) === null || _b === void 0 ? void 0 : _b.querySelectorAll(selectors_1.default.controls());
     menuButtons === null || menuButtons === void 0 ? void 0 : menuButtons.forEach(menuButton => {
       menuButton.addEventListener('click', util_1.default.throttleEvent(this.eToggleMenu.bind(this), settings_1.default.delay.slow, {
         trailing: false
@@ -101,12 +99,17 @@ class mintHeader {
     (_d = this.el.wrapper) === null || _d === void 0 ? void 0 : _d.addEventListener('transitionend', this.eTransitionEnd.bind(this));
   }
   /**
-   * Adds classes that inform the styles
+   * Adds classes that inform the styles based on settings
    */
   addClasses() {
-    var _a;
-    if (settings_1.default.fixed) {
-      (_a = this.el.body) === null || _a === void 0 ? void 0 : _a.classList.add(selectors_1.default.getClass('fixed'));
+    var _a, _b, _c, _d, _e;
+    (_a = this.el.header) === null || _a === void 0 ? void 0 : _a.classList.remove('mint-top', 'mint-right', 'mint-bottom', 'mint-left');
+    (_b = this.el.header) === null || _b === void 0 ? void 0 : _b.classList.add(`mint-${enum_1.mintSide[(_c = this.settings.from) !== null && _c !== void 0 ? _c : 0].toLowerCase()}`);
+    if (this.settings.fixed) {
+      (_d = this.el.body) === null || _d === void 0 ? void 0 : _d.classList.add('mint-fixed');
+    }
+    if (this.settings.tray) {
+      (_e = this.el.header) === null || _e === void 0 ? void 0 : _e.classList.add('mint-tray');
     }
   }
   /**
@@ -124,7 +127,7 @@ class mintHeader {
       (_a = this.el.mobileButton) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-label', ariaLabel);
     }, settings_1.default.delay.fast);
     if (open) {
-      if (settings_1.default.fixed !== true) {
+      if (this.settings.fixed !== true) {
         window.scroll({
           top: 0,
           left: 0,
@@ -133,15 +136,24 @@ class mintHeader {
       }
       setTimeout(() => {
         if (this.el.html) {
-          this.el.html.style.overflow = 'hidden';
+          let isMobile = util_1.default.windowWidth() <= settings_1.default.break.sm,
+            overflow = 'auto';
+          if (this.settings.tray) {
+            if (isMobile) {
+              overflow = 'hidden';
+            }
+          } else {
+            overflow = 'hidden';
+          }
+          this.el.html.style.overflow = overflow;
         }
-      }, settings_1.default.from === enum_1.mintSide.Left ? settings_1.default.delay.default : settings_1.default.delay.instant);
+      }, this.settings.from === enum_1.mintSide.Left ? settings_1.default.delay.default : settings_1.default.delay.instant);
       if (this.el.wrapper) {
         this.el.wrapper.style.display = 'flex';
       }
       requestAnimationFrame(() => {
         var _a;
-        (_a = this.el.wrapper) === null || _a === void 0 ? void 0 : _a.classList.add(selectors_1.default.getClass('open'));
+        (_a = this.el.wrapper) === null || _a === void 0 ? void 0 : _a.classList.add('mint-open');
       });
     } else {
       if (this.el.html) {
@@ -149,7 +161,7 @@ class mintHeader {
       }
       requestAnimationFrame(() => {
         var _a;
-        (_a = this.el.wrapper) === null || _a === void 0 ? void 0 : _a.classList.remove(selectors_1.default.getClass('open'));
+        (_a = this.el.wrapper) === null || _a === void 0 ? void 0 : _a.classList.remove('mint-open');
       });
       this.closeAllMenus();
     }
@@ -235,7 +247,7 @@ class mintHeader {
     let activeButton = document.activeElement,
       activeMenu = activeButton === null || activeButton === void 0 ? void 0 : activeButton.nextElementSibling,
       showing = ((_a = activeButton === null || activeButton === void 0 ? void 0 : activeButton.getAttribute('aria-expanded')) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'true';
-    if ((activeButton === null || activeButton === void 0 ? void 0 : activeButton.getAttribute('aria-controls')) === selectors_1.default.ids.wrapper) {
+    if ((activeButton === null || activeButton === void 0 ? void 0 : activeButton.getAttribute('aria-controls')) === 'mint-wrapper') {
       activeMenu = this.el.wrapper;
     }
     if ((activeButton === null || activeButton === void 0 ? void 0 : activeButton.getAttribute('aria-controls')) && activeMenu && !showing) {
@@ -274,12 +286,23 @@ class mintHeader {
   /**
    * Closes the mobile menu when the window resizes
    */
-  eHandleResize(e) {
-    // Also check if resized from mobile to desktop
-    if (util_1.default.windowWidth() !== this.lastWidth) {
-      this.setMobileMenu();
+  eHandleResize() {
+    var _a, _b;
+    let isOpen = ((_b = (_a = this.el.mobileButton) === null || _a === void 0 ? void 0 : _a.getAttribute('aria-expanded')) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === 'true',
+      isMobile = util_1.default.windowWidth() <= settings_1.default.break.sm,
+      overflow = 'auto';
+    if (isOpen) {
+      if (this.settings.tray) {
+        if (isMobile) {
+          overflow = 'hidden';
+        }
+      } else {
+        overflow = 'hidden';
+      }
+    }
+    if (this.el.html) {
+      this.el.html.style.overflow = overflow;
     }
-    this.lastWidth = util_1.default.windowWidth();
   }
   /**
    * Closes all submenus when the page is scrolled
@@ -310,7 +333,7 @@ class mintHeader {
       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)) {
+        if (subMenu === null || subMenu === void 0 ? void 0 : subMenu.classList.contains('mint-open')) {
           this.setMenu(subMenu);
         } else {
           this.setMobileMenu();
@@ -387,7 +410,7 @@ class mintHeader {
    */
   eTransitionEnd() {
     var _a;
-    if (((_a = this.el.wrapper) === null || _a === void 0 ? void 0 : _a.classList.contains(selectors_1.default.getClass('open'))) === false) {
+    if (((_a = this.el.wrapper) === null || _a === void 0 ? void 0 : _a.classList.contains('mint-open')) === false) {
       this.el.wrapper.style.display = 'none';
     }
   }
@@ -1007,24 +1030,6 @@ class mintSelectors {
   static expanded(bool) {
     return typeof bool === 'boolean' ? `[aria-expanded="${bool}"]` : this.hasExpanded;
   }
-  /**
-   * Returns the id of the requested element
-   */
-  static getId(id) {
-    var _b;
-    return (_b = this.ids[id !== null && id !== void 0 ? id : -1]) !== null && _b !== void 0 ? _b : '';
-  }
-  /**
-   * Returns the class of the requested element
-   */
-  static getClass(className, classGroup) {
-    var _b, _c;
-    if (classGroup) {
-      let group = this.classes[classGroup];
-      return (_b = group[className !== null && className !== void 0 ? className : -1]) !== null && _b !== void 0 ? _b : '';
-    }
-    return (_c = this.classes[className !== null && className !== void 0 ? className : -1]) !== null && _c !== void 0 ? _c : '';
-  }
   /**
    * Returns a NodeList of HTMLElements within the given element that are focusable
    * @param el - the element whose focusable children will be returned
@@ -1118,31 +1123,6 @@ mintSelectors.subMenuButtons = `button${_a.hasControls}`;
  * CSS-selector for submenus
  */
 mintSelectors.subMenu = `${_a.subMenuButtons} + ul${_a.hasId}`;
-/**
- * Frequently-used ids
- */
-mintSelectors.ids = {
-  header: _a.prefix('header'),
-  logo: _a.prefix('logo'),
-  wrapper: _a.prefix('wrapper'),
-  mainContent: _a.prefix('main-content')
-};
-/**
- * Classes
- */
-mintSelectors.classes = {
-  sides: {
-    top: _a.prefix('top'),
-    right: _a.prefix('right'),
-    bottom: _a.prefix('bottom'),
-    left: _a.prefix('left')
-  },
-  srOnly: _a.prefix('sr-only'),
-  js: _a.prefix('js'),
-  ready: _a.prefix('ready'),
-  fixed: _a.prefix('fixed'),
-  open: _a.prefix('open')
-};
 exports["default"] = mintSelectors;
 
 /***/ }),
@@ -1151,7 +1131,7 @@ exports["default"] = mintSelectors;
 /*!*****************************************!*\
   !*** ./src/ts/imports/util/settings.ts ***!
   \*****************************************/
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ ((__unused_webpack_module, exports) => {
 
 
 
@@ -1160,11 +1140,6 @@ Object.defineProperty(exports, "__esModule", ({
   value: true
 }));
 exports.mintSettings = void 0;
-/**
- * Imports
- */
-const enum_1 = __webpack_require__(/*! ../enum */ "./src/ts/imports/enum.ts");
-const selectors_1 = __webpack_require__(/*! ./selectors */ "./src/ts/imports/util/selectors.ts");
 /**
  * Settings management
  * @public
@@ -1192,11 +1167,10 @@ class mintSettings {
         this.delay = Object.assign(Object.assign({}, this.delay), settings.delay);
       }
     }
-    if (typeof settings.from === 'number') {
-      this.setFrom(settings.from);
-    }
-    if (typeof settings.fixed === 'boolean') {
-      this.setFixed(settings.fixed);
+    if (settings.break && Object.keys(settings.break).length) {
+      if (Object.values(settings.break).reduce((prev, next) => prev && typeof next === 'number', true)) {
+        this.break = Object.assign(Object.assign({}, this.break), settings.break);
+      }
     }
   }
   /**
@@ -1212,32 +1186,6 @@ class mintSettings {
       slow: this.delayBase + this.delayStep * 5
     };
   }
-  /**
-   * Updates the direction the navbar enters from
-   */
-  static setFrom(from) {
-    if (this.from !== from) {
-      this.from = from;
-      let header = document.getElementById(selectors_1.mintSelectors.getId('header'));
-      header === null || header === void 0 ? void 0 : header.classList.remove(...Object.values(selectors_1.mintSelectors.classes.sides));
-      header === null || header === void 0 ? void 0 : header.classList.add(selectors_1.mintSelectors.getClass(enum_1.mintSide[this.from].toLowerCase(), 'sides'));
-    }
-  }
-  /**
-   * Updates whether or not the navbar is fixed
-   */
-  static setFixed(fixed) {
-    if (this.fixed !== fixed) {
-      this.fixed = fixed;
-      let header = document.getElementById(selectors_1.mintSelectors.getId('header')),
-        fixedClass = selectors_1.mintSelectors.getClass('fixed');
-      if (this.fixed) {
-        header === null || header === void 0 ? void 0 : header.classList.add(fixedClass);
-      } else {
-        header === null || header === void 0 ? void 0 : header.classList.remove(fixedClass);
-      }
-    }
-  }
 }
 exports.mintSettings = mintSettings;
 _a = mintSettings;
@@ -1260,6 +1208,17 @@ mintSettings.delay = {
   medSlow: _a.delayBase + _a.delayStep * 4,
   slow: _a.delayBase + _a.delayStep * 5
 };
+/**
+ * Breakpoint variables
+ */
+mintSettings.break = {
+  z: 0,
+  xs: 480,
+  sm: 768,
+  md: 1024,
+  lg: 1200,
+  xl: 1440
+};
 ;
 exports["default"] = mintSettings;