@schukai/monster 4.43.7 → 4.43.9

package/CHANGELOG.md

@@ -2,6 +2,22 @@
 
 
 
+## [4.43.9] - 2025-10-13
+
+### Bug Fixes
+
+- calc with [#336](https://gitlab.schukai.com/oss/libraries/javascript/monster/issues/336)
+
+
+
+## [4.43.8] - 2025-10-12
+
+### Bug Fixes
+
+- new position strategy [#336](https://gitlab.schukai.com/oss/libraries/javascript/monster/issues/336)
+
+
+
 ## [4.43.7] - 2025-10-11
 
 ### Bug Fixes

package/package.json

@@ -1 +1 @@
-{"author":"schukai GmbH","dependencies":{"@floating-ui/dom":"^1.7.4","@popperjs/core":"^2.11.8"},"description":"Monster is a simple library for creating fast, robust and lightweight websites.","homepage":"https://monsterjs.org/","keywords":["framework","web","dom","css","sass","mobile-first","app","front-end","templates","schukai","core","shopcloud","alvine","monster","buildmap","stack","observer","observable","uuid","node","nodelist","css-in-js","logger","log","theme"],"license":"AGPL 3.0","main":"source/monster.mjs","module":"source/monster.mjs","name":"@schukai/monster","repository":{"type":"git","url":"https://gitlab.schukai.com/oss/libraries/javascript/monster.git"},"type":"module","version":"4.43.7"}
+{"author":"schukai GmbH","dependencies":{"@floating-ui/dom":"^1.7.4","@popperjs/core":"^2.11.8"},"description":"Monster is a simple library for creating fast, robust and lightweight websites.","homepage":"https://monsterjs.org/","keywords":["framework","web","dom","css","sass","mobile-first","app","front-end","templates","schukai","core","shopcloud","alvine","monster","buildmap","stack","observer","observable","uuid","node","nodelist","css-in-js","logger","log","theme"],"license":"AGPL 3.0","main":"source/monster.mjs","module":"source/monster.mjs","name":"@schukai/monster","repository":{"type":"git","url":"https://gitlab.schukai.com/oss/libraries/javascript/monster.git"},"type":"module","version":"4.43.9"}

package/source/components/navigation/site-navigation.mjs

@@ -108,7 +108,9 @@ class SiteNavigation extends CustomElement {
   connectedCallback() {
     super.connectedCallback();
     attachResizeObserver.call(this);
-    setTimeout(() => populateTabs.call(this), 0);
+    requestAnimationFrame(() => {
+      populateTabs.call(this);
+    });
   }
 
   disconnectedCallback() {
@@ -156,6 +158,18 @@ function initEventHandler() {
 
   if (!hamburgerButton || !hamburgerNav || !hamburgerCloseButton) return;
 
+  const getBestPositionStrategy = (element) => {
+    let parent = element.parentElement;
+    while (parent) {
+      const parentPosition = window.getComputedStyle(parent).position;
+      if (["fixed", "sticky"].includes(parentPosition)) {
+        return "fixed";
+      }
+      parent = parent.parentElement;
+    }
+    return "absolute";
+  };
+
   const handleOutsideClick = (event) => {
     if (
       !hamburgerButton.contains(event.target) &&
@@ -200,10 +214,12 @@ function initEventHandler() {
     });
 
     cleanup = autoUpdate(hamburgerButton, hamburgerNav, () => {
-      // Desktop view where the hamburger menu is a dropdown
       if (window.innerWidth > 768) {
+        const strategy = getBestPositionStrategy(this);
+
         computePosition(hamburgerButton, hamburgerNav, {
           placement: "bottom-end",
+          strategy: strategy,
           middleware: [
             offset(8),
             flip(),
@@ -265,9 +281,11 @@ function attachResizeObserver() {
         delete this[timerCallbackSymbol];
       }
     }
-    this[timerCallbackSymbol] = new DeadMansSwitch(200, () =>
-      populateTabs.call(this),
-    );
+    this[timerCallbackSymbol] = new DeadMansSwitch(200, () => {
+      requestAnimationFrame(() => {
+        populateTabs.call(this);
+      });
+    });
   });
   this[resizeObserverSymbol].observe(this[navElementSymbol]);
 }

package/source/types/version.mjs

@@ -156,7 +156,7 @@ function getMonsterVersion() {
 	}
 
 	/** don't touch, replaced by make with package.json version */
-	monsterVersion = new Version("4.43.6");
+	monsterVersion = new Version("4.43.8");
 
 	return monsterVersion;
 }

package/test/cases/monster.mjs

@@ -7,7 +7,7 @@ describe('Monster', function () {
         let monsterVersion
 
         /** don´t touch, replaced by make with package.json version */
-        monsterVersion = new Version("4.43.6")
+        monsterVersion = new Version("4.43.8")
 
         let m = getMonsterVersion();
 

package/test/web/test.html

@@ -9,8 +9,8 @@
 </head>
 <body>
 <div id="headline" style="display: flex;align-items: center;justify-content: center;flex-direction: column;">
-  <h1 style='margin-bottom: 0.1em;'>Monster 4.43.6</h1>
-  <div id="lastupdate" style='font-size:0.7em'>last update Sa 11. Okt 18:38:25 CEST 2025</div>
+  <h1 style='margin-bottom: 0.1em;'>Monster 4.43.8</h1>
+  <div id="lastupdate" style='font-size:0.7em'>last update Mo 13. Okt 09:26:37 CEST 2025</div>
 </div>
 <div id="mocha-errors"
      style="color: red;font-weight: bold;display: flex;align-items: center;justify-content: center;flex-direction: column;margin:20px;"></div>