@kodaris/krubble-app-components 1.0.39 → 1.0.41

package/dist/krubble-app.bundled.js

@@ -2240,9 +2240,23 @@ let KRScreenNav = class KRScreenNav extends i$1 {
          */
         this.navItems = [];
         /**
-         * Currently active item ID
+         * Currently active item ID. Auto-detected from the URL by default.
+         * Can be set explicitly by the parent to override.
          */
         this.activeId = '';
+        this.handlePopstate = () => {
+            this.syncActiveFromUrl();
+        };
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        // Defer so property bindings (.navItems) have been applied
+        requestAnimationFrame(() => this.syncActiveFromUrl());
+        window.addEventListener('popstate', this.handlePopstate);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        window.removeEventListener('popstate', this.handlePopstate);
     }
     /**
      * Handles click events on navigation items.
@@ -2271,6 +2285,24 @@ let KRScreenNav = class KRScreenNav extends i$1 {
         if (navEvent.defaultPrevented) {
             e.preventDefault();
         }
+        this.activeId = item.id;
+    }
+    syncActiveFromUrl() {
+        const pathname = window.location.pathname;
+        const match = this.navItems.find((item) => {
+            if (!item.url) {
+                return false;
+            }
+            // Absolute URL — exact match
+            if (item.url.startsWith('/')) {
+                return pathname === item.url;
+            }
+            // Relative URL — match against the end of the pathname
+            return pathname.endsWith('/' + item.url);
+        });
+        if (match) {
+            this.activeId = match.id;
+        }
     }
     render() {
         return b `