@simonbackx/vue-app-navigation 2.17.0 → 2.17.1

package/dist/index.js

@@ -391,6 +391,9 @@ class HistoryManagerStatic {
     if (!this.active) {
       return;
     }
+    if (this.debug) {
+      console.log("Set title: " + title + ", for index " + (index ?? this.counter) + " with current counter: " + this.counter);
+    }
     if (index === void 0 || index === this.counter) {
       const state = this.states[this.states.length - 1];
       window.document.title = this.formatTitle(title);
@@ -534,11 +537,11 @@ class HistoryManagerStatic {
       const newCounter = (_a = event.state) == null ? void 0 : _a.counter;
       if (newCounter !== void 0) {
         if (newCounter > this.counter) {
-          const amount = newCounter - this.counter;
-          this.go(-amount);
           if (this.debug) {
-            console.log("Not allowed to go forward, going back " + amount + " steps");
+            console.log("Reloading page because going forward is not supported");
           }
+          window.location.reload();
+          return;
         } else {
           const animate = this.counter - newCounter == 1 && this.animateHistoryPop;
           this.counter = newCounter;
@@ -823,9 +826,6 @@ const _ComponentWithProperties = class _ComponentWithProperties {
         console.warn("Returning to a component that has no history index assigned. Has this component been pushed to a navigation controller properly before returning to it?", this.component.name);
       return false;
     }
-    _ComponentWithProperties.historyIndexOwners.set(this.historyIndex, this);
-    if (_ComponentWithProperties.debug)
-      console.log("New owner of history index ", this.historyIndex, this.component.name);
     HistoryManager.returnToHistoryIndex(this.historyIndex);
     return true;
   }
@@ -888,6 +888,7 @@ const _ComponentWithProperties = class _ComponentWithProperties {
       } else {
         console.error("No unmount function for component " + this.vnode);
       }
+      this.deleteHistoryIndex();
       this.vnode = null;
     }
   }
@@ -1454,47 +1455,84 @@ const _sfc_main$4 = defineComponent({
         if (animated) {
           this.freezeSize();
         }
+        let popped = [];
+        const adjustHistory = (options == null ? void 0 : options.adjustHistory) ?? true;
         if (replace > 0) {
-          const popped = this.components.splice(this.components.length - replace, replace, ...components);
+          popped = this.components.splice(this.components.length - replace, replace, ...components);
           if (!destroy) {
             for (const comp of popped) {
               comp.keepAlive = true;
             }
           }
-          if (this.components.length !== components.length) {
-            HistoryManager.invalidateHistory();
+          if (this.components.length <= components.length) {
+            const lastComponent = popped[0];
+            if (HistoryManager.active) {
+              if (lastComponent && lastComponent.hasHistoryIndex()) {
+                HistoryManager.returnToHistoryIndex(lastComponent.historyIndex - 1);
+              } else {
+                console.log("Last removed component has no history index", popped);
+                HistoryManager.invalidateHistory();
+              }
+            }
+          } else {
+            const lastComponent = this.components[this.components.length - components.length - 1];
+            if (lastComponent && lastComponent.hasHistoryIndex()) {
+              lastComponent.returnToHistoryIndex();
+            } else {
+              console.log("Last visible component has no history index", lastComponent);
+              HistoryManager.invalidateHistory();
+            }
           }
         } else {
           this.components.push(...components);
         }
         if (this.mainComponent) {
-          this.mainComponent.keepAlive = !replace;
+          this.mainComponent.keepAlive = !replace || !destroy;
         }
-        const adjustHistory = (options == null ? void 0 : options.adjustHistory) ?? true;
         if (adjustHistory) {
-          for (const component2 of components) {
-            HistoryManager.pushState(void 0, async (canAnimate) => {
-              if (!this.mainComponent) {
-                console.error("Tried to pop NavigationController, but it was already unmounted");
-                return;
-              }
-              await this.pop({ animated: animated && canAnimate });
-            }, {
-              adjustHistory,
-              invalid: options.invalidHistory ?? !!replace
-            });
-            component2.assignHistoryIndex();
-          }
-        } else {
-          for (const component2 of components) {
-            if (!replace || this.components.length !== components.length) {
-              HistoryManager.pushState(void 0, null, {
+          for (const [index, component2] of components.entries()) {
+            if (index === 0 && popped.length) {
+              HistoryManager.pushState(void 0, async (canAnimate) => {
+                if (!this.mainComponent) {
+                  console.error("Tried to pop NavigationController, but it was already unmounted");
+                  return;
+                }
+                await this.push({
+                  animated: animated && canAnimate,
+                  replace: 1,
+                  components: popped,
+                  reverse: !(options.reverse ?? false),
+                  adjustHistory: false
+                });
+              }, {
                 adjustHistory,
-                invalid: options.invalidHistory ?? !!replace
+                invalid: options.invalidHistory ?? false
+              });
+            } else {
+              HistoryManager.pushState(void 0, async (canAnimate) => {
+                if (!this.mainComponent) {
+                  console.error("Tried to pop NavigationController, but it was already unmounted");
+                  return;
+                }
+                await this.pop({ animated: animated && canAnimate });
+              }, {
+                adjustHistory,
+                invalid: options.invalidHistory ?? false
               });
             }
             component2.assignHistoryIndex();
           }
+        } else {
+          for (const [index, component2] of components.entries()) {
+            HistoryManager.pushState(void 0, !!replace && index === 0 ? async (animated2) => {
+              await this.pop({ animated: animated2, count: components.length });
+            } : null, {
+              adjustHistory: !!replace && index === 0,
+              // for the first one we need to adjust the history because we returned earlier
+              invalid: options.invalidHistory ?? false
+            });
+            component2.assignHistoryIndex();
+          }
         }
         this.mainComponent = component;
         this.$emit("didPush");
@@ -2857,10 +2895,10 @@ const _sfc_main = defineComponent({
           this.getScrollElement().scrollTop = 0;
           HistoryManager.pushState(void 0, null, {
             adjustHistory: options.adjustHistory ?? true,
-            invalid: options.invalidHistory ?? !!this.detail
+            invalid: !!options.invalidHistory || !!this.detail
           });
+          component.assignHistoryIndex();
           this.detail = component;
-          this.detail.assignHistoryIndex();
         }
       } finally {
         this.isChangingComponents = false;
@@ -2887,13 +2925,13 @@ const _sfc_main = defineComponent({
         console.error("Cannot collapse while already isChangingComponents");
         return;
       }
+      console.log("Collapse SplitViewController");
       this.isChangingComponents = true;
       try {
         this.detail.keepAlive = true;
         const detail = this.detail;
         this.detail = null;
         await this.navigationController.push({ components: [detail], animated: false });
-        HistoryManager.invalidateHistory();
       } finally {
         this.isChangingComponents = false;
       }
@@ -2929,12 +2967,12 @@ const _sfc_main = defineComponent({
         console.error("Cannot expand while already isChangingComponents");
         return false;
       }
+      console.log("Expand SplitViewController");
       if (!this.lastIsDetail) {
         if (!this.defaultHandler) {
           console.error("Cannot expand when there is no defaultHandler");
           return;
         }
-        HistoryManager.invalidateHistory();
         this.isChangingComponents = false;
         try {
           const succeeded = await this.defaultHandler();

package/package.json

@@ -2,7 +2,7 @@
     "name": "@simonbackx/vue-app-navigation",
     "main": "./dist/index.js",
     "types": "./dist/index.d.ts",
-    "version": "2.17.0",
+    "version": "2.17.1",
     "exports": {
         ".": {
             "import": "./dist/index.js",