mburger-css - npm Package Compare versions

Comparing version 1.3.1 to 1.3.2

bin/mburger.js

 /*
- * mburger webcomponent v1.3.1
+ * mburger webcomponent v1.3.2
  * mmenujs.com/mburger
@@ -35,12 +35,3 @@ *
             //  Set the new menu node and API.
-            this.setMenu(newValue);
-            //  Change the hamburger state when opening and closing the menu.
-            if (this.menuApi) {
-                this.menuApi.bind('open:after', () => {
-                    this.setAttribute('state', 'cross');
-                });
-                this.menuApi.bind('close:after', () => {
-                    this.removeAttribute('state');
-                });
-            }
+            this.initMenu(newValue);
         }
@@ -60,3 +51,3 @@ }
      */
-    setMenu(id) {
+    initMenu(id) {
         this.menuNode = id ? document.getElementById(id) : null;
@@ -68,3 +59,12 @@ this.menuApi = null;
         }
+        //  Change the hamburger state when opening and closing the menu.
+        if (this.menuApi) {
+            this.menuApi.bind('open:after', () => {
+                this.setAttribute('state', 'cross');
+            });
+            this.menuApi.bind('close:after', () => {
+                this.removeAttribute('state');
+            });
+        }
     }
 });

composer.json

 {
-	"name"			: "mburger-css",
-	"version"		: "1.3.1",
-	"authors"		: "Fred Heusschen <[e-mail]>",
-	"license"		: "CC-BY-4.0",
-	"description"	: "A small collection of CSS animated hamburgers. All set up to work out of the box with the mmenu.js plugin.",
-	"keywords"		: [
+	"name": "mburger-css",
+	"version": "1.3.2",
+	"authors": "Fred Heusschen <[e-mail]>",
+	"license": "CC-BY-4.0",
+	"description": "A small collection of CSS animated hamburgers. All set up to work out of the box with the mmenu.js plugin.",
+	"keywords": [
 		"hamburger",
@@ -9,0 +9,0 @@ "icon",

dist/mburger.js

 /*
- * mburger webcomponent v1.3.1
+ * mburger webcomponent v1.3.2
  * mmenujs.com/mburger
@@ -18,20 +18,43 @@ *
 	<slot></slot>`;
-customElements.define('m-burger', class extends HTMLElement {
-    constructor() {
-        super();
-        /** The menu node. */
-        this.menuNode = null;
-        /** API for the menu. */
-        this.menuApi = null;
-        //	Attach shadow DOM
-        var content = mBurger.content.cloneNode(true);
-        this.attachShadow({ mode: 'open' }).appendChild(content);
-    }
-    static get observedAttributes() {
-        return ['menu'];
-    }
-    attributeChangedCallback(name, oldValue, newValue) {
-        if (name == 'menu') {
-            //  Set the new menu node and API.
-            this.setMenu(newValue);
+customElements.define(
+    'm-burger',
+    class extends HTMLElement {
+        constructor() {
+            super();
+            /** The menu node. */
+            this.menuNode = null;
+            /** API for the menu. */
+            this.menuApi = null;
+            //	Attach shadow DOM
+            var content = mBurger.content.cloneNode(true);
+            this.attachShadow({ mode: 'open' }).appendChild(content);
+        }
+        static get observedAttributes() {
+            return ['menu'];
+        }
+        attributeChangedCallback(name, oldValue, newValue) {
+            if (name == 'menu') {
+                //  Set the new menu node and API.
+                this.initMenu(newValue);
+            }
+        }
+        connectedCallback() {
+            //  Open the menu when clicking the hamburger.
+            this.addEventListener('click', evnt => {
+                if (this.menuApi && this.menuApi.open) {
+                    this.menuApi.open();
+                }
+            });
+        }
+        /**
+         * Set the menu node and API.
+         * @param {string} id The ID-attribute for the menu node.
+         */
+        initMenu(id) {
+            this.menuNode = id ? document.getElementById(id) : null;
+            this.menuApi = null;
+            if (this.menuNode) {
+                this.menuApi =
+                    this.menuNode['mmApi'] || this.menuNode['mmenu'] || null;
+            }
             //  Change the hamburger state when opening and closing the menu.
@@ -48,22 +71,2 @@ if (this.menuApi) {
     }
-    connectedCallback() {
-        //  Open the menu when clicking the hamburger.
-        this.addEventListener('click', evnt => {
-            if (this.menuApi && this.menuApi.open) {
-                this.menuApi.open();
-            }
-        });
-    }
-    /**
-     * Set the menu node and API.
-     * @param {string} id The ID-attribute for the menu node.
-     */
-    setMenu(id) {
-        this.menuNode = id ? document.getElementById(id) : null;
-        this.menuApi = null;
-        if (this.menuNode) {
-            this.menuApi =
-                this.menuNode['mmApi'] || this.menuNode['mmenu'] || null;
-        }
-    }
-});
+);

package.json

 {
 	"name": "mburger-css",
-	"version": "1.3.1",
+	"version": "1.3.2",
 	"main": "dist/mburger.css",
-	"author": "Fred Heusschen <[e-mail]>",
+	"module": "dist/mburger.js",
+	"author": "Fred Heusschen <[e-mail]>",
 	"license": "CC-BY-4.0",
@@ -7,0 +8,0 @@ "repository": {

src/ts/mburger.ts

 /*
- * mburger webcomponent v1.3.1
+ * mburger webcomponent v1.3.2
  * mmenujs.com/mburger
@@ -47,13 +47,3 @@ *
                 //  Set the new menu node and API.
-                this.setMenu(newValue);
-
-                //  Change the hamburger state when opening and closing the menu.
-                if (this.menuApi) {
-                    this.menuApi.bind('open:after', () => {
-                        this.setAttribute('state', 'cross');
-                    });
-                    this.menuApi.bind('close:after', () => {
-                        this.removeAttribute('state');
-                    });
-                }
+                this.initMenu(newValue);
             }
@@ -75,3 +65,3 @@ }
          */
-        setMenu(id: string) {
+        initMenu(id: string) {
             this.menuNode = id ? document.getElementById(id) : null;
@@ -83,4 +73,14 @@ this.menuApi = null;
             }
+
+            //  Change the hamburger state when opening and closing the menu.
+            if (this.menuApi) {
+                this.menuApi.bind('open:after', () => {
+                    this.setAttribute('state', 'cross');
+                });
+                this.menuApi.bind('close:after', () => {
+                    this.removeAttribute('state');
+                });
+            }
         }
     }
 );

No alert changes

Improved metrics

Total package byte prevSize

41643

increased by0.29%

Lines of code

454

increased by0.67%

No dependency changes