@dataforsyningen/designsystem - npm Package Compare versions

Comparing version 7.7.1 to 7.7.2

assets/designsystem.js

@@ -655,2 +655,3 @@ // src/js/toast.js
   hiddenNavElements;
+  debounceTimer;
   constructor() {
@@ -743,5 +744,5 @@ super();
     this.render();
+    this.updateMenu();
     window.addEventListener("resize", this.updateMenu.bind(this));
     window.addEventListener("click", this.toggleMenu.bind(this));
-    this.updateMenu();
   }
@@ -773,16 +774,15 @@ disconnectedCallback() {
   updateMenu() {
+    if (this.debounceTimer) {
+      clearTimeout(this.debounceTimer);
+    }
+    this.debounceTimer = setTimeout(this.setClassBySize.bind(this), 100);
+  }
+  setClassBySize() {
     const container = this.shadowRoot.querySelector(".menu-container");
     const items = this.shadowRoot.querySelector(".menu-items");
-    const menuWidth = container.scrollWidth;
-    const containerWidth = this.offsetWidth;
-    console.log("widths");
-    console.log(this.offsetWidth, this.scrollWidth);
-    console.log(container.offsetWidth, container.scrollWidth);
-    console.log(items.offsetWidth, items.scrollWidth);
-    if (menuWidth > containerWidth) {
+    this.classList.remove("compact");
+    container.classList.remove("compact");
+    if (items.scrollWidth > items.clientWidth) {
       this.classList.add("compact");
       container.classList.add("compact");
-    } else {
-      this.classList.remove("compact");
-      container.classList.remove("compact");
     }
@@ -789,0 +789,0 @@ }

package.json

 {
   "name": "@dataforsyningen/designsystem",
-  "version": "7.7.1",
+  "version": "7.7.2",
   "description": "Common design system for Klimadatastyrelsen with CSS, icons, UI components, and logo images.",
@@ -5,0 +5,0 @@ "type": "module",

src/js/responsiveNav.js

@@ -8,2 +8,3 @@ import { DSTogglePanel } from './togglePanel.js'
   hiddenNavElements
+  debounceTimer
 
@@ -109,5 +110,6 @@ constructor() {
     this.render()
+    this.updateMenu()
     window.addEventListener('resize', this.updateMenu.bind(this))
     window.addEventListener('click', this.toggleMenu.bind(this))
-    this.updateMenu();
+    
   }
@@ -144,23 +146,21 @@
   updateMenu() {
-    
+    if (this.debounceTimer) {
+      clearTimeout(this.debounceTimer)
+    }
+    this.debounceTimer = setTimeout(this.setClassBySize.bind(this), 100)
+  }
+
+  setClassBySize() {
     const container = this.shadowRoot.querySelector('.menu-container')
     const items = this.shadowRoot.querySelector('.menu-items')
+  
+    this.classList.remove('compact')
+    container.classList.remove('compact')
 
-    const menuWidth = container.scrollWidth
-    const containerWidth = this.offsetWidth
-    // offsetWidth, clientWidth, scrollWidth
-
-    console.log('widths')
-    console.log(this.offsetWidth, this.scrollWidth)
-    console.log(container.offsetWidth, container.scrollWidth)
-    console.log(items.offsetWidth, items.scrollWidth)
-
-    if (menuWidth > containerWidth) {
+    if (items.scrollWidth > items.clientWidth) {
       this.classList.add('compact')
       container.classList.add('compact')
-    } else {
-      this.classList.remove('compact')
-      container.classList.remove('compact')
     }
+
   }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

4632677

increased by0.02%

Worsened metrics

Lines of code

3561

decreased by-0.03%

No dependency changes