@vaadin/vaadin-menu-bar - npm Package Compare versions

Comparing version 1.2.1 to 1.2.2

package.json

@@ -13,3 +13,3 @@ {
   "name": "@vaadin/vaadin-menu-bar",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "main": "vaadin-menu-bar.js",
@@ -16,0 +16,0 @@ "author": "Vaadin Ltd",

src/vaadin-menu-bar-buttons-mixin.js

@@ -86,5 +86,24 @@ /**
     const overflow = buttons.pop();
-    const containerWidth = container.offsetWidth;
     const isRTL = this.getAttribute('dir') === 'rtl';
+    // optional chaining is not supported in IE
+    const previouslyOverflowingButtons = (overflow.item && overflow.item.children && overflow.item.children.length) || 0;
 
+    // reset all buttons in the menu bar and the overflow button
+    for (let i = 0; i < buttons.length; i++) {
+      const btn = buttons[i];
+      btn.disabled = btn.item.disabled;
+      btn.style.visibility = '';
+      btn.style.position = '';
+
+      // teleport item component back from "overflow" sub-menu
+      const item = btn.item && btn.item.component;
+      if (item instanceof HTMLElement && item.classList.contains('vaadin-menu-item')) {
+        btn.appendChild(item);
+        item.classList.remove('vaadin-menu-item');
+      }
+    }
+    overflow.item = {children: []};
+    this._hasOverflow = false;
+
+    // hide any overflowing buttons and put them in the 'overflow' button
     if (container.offsetWidth < container.scrollWidth) {
@@ -97,9 +116,7 @@ this._hasOverflow = true;
         const btnStyle = getComputedStyle(btn);
-        if (btnStyle.visibility === 'hidden') {
-          continue;
-        }
 
         const btnWidth = btn.offsetWidth;
+        // if this button isn't overflowing, then the rest aren't either
         if (
-          (!isRTL && (btn.offsetLeft + btnWidth) < (containerWidth - overflow.offsetWidth)) ||
+          (!isRTL && (btn.offsetLeft + btnWidth) < (container.offsetWidth - overflow.offsetWidth)) ||
           (isRTL && btn.offsetLeft >= overflow.offsetWidth)
@@ -119,44 +136,8 @@ ) {
       };
-    } else if (this._hasOverflow) {
-      if (this._subMenu.opened) {
-        this._subMenu.close();
-      }
-
-      for (let i = 0; i < buttons.length; i++) {
-        const btn = buttons[i];
-        const btnWidth = btn.getBoundingClientRect().width;
-
-        if (getComputedStyle(btn).visibility !== 'hidden') {
-          continue;
-        }
-
-        if (
-          (!isRTL && (overflow.offsetLeft + overflow.offsetWidth + btnWidth) < containerWidth) ||
-          (isRTL && (btnWidth < overflow.offsetLeft))
-        ) {
-          btn.disabled = btn.item.disabled;
-          btn.style.visibility = '';
-          btn.style.position = '';
-          btn.style.width = '';
-
-          // teleport item component back from "overflow" sub-menu
-          const item = btn.item && btn.item.component;
-          if (item instanceof HTMLElement && item.classList.contains('vaadin-menu-item')) {
-            btn.appendChild(item);
-            item.classList.remove('vaadin-menu-item');
-          }
-
-          overflow.item = {
-            children: buttons.filter((b, idx) => idx >= i + 1).map(b => b.item)
-          };
-
-          if (btn === buttons[buttons.length - 1]) {
-            this._hasOverflow = false;
-            overflow.item = {children: []};
-          }
-        } else {
-          break;
-        }
-      }
     }
+    // optional chaining is not supported in IE
+    const currentlyOverflowingItems = (overflow.item && overflow.item.children && overflow.item.children.length) || 0;
+    if (previouslyOverflowingButtons !== currentlyOverflowingItems && this._subMenu.opened) {
+      this._subMenu.close();
+    }
   }
@@ -163,0 +144,0 @@

src/vaadin-menu-bar.js

@@ -106,3 +106,3 @@ /**
   static get version() {
-    return '1.2.1';
+    return '1.2.2';
   }
@@ -109,0 +109,0 @@

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

59376

decreased by-0.34%

Lines of code

1260

decreased by-1.18%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes