@ionic/vue-router - npm Package Compare versions

Comparing version 5.4.0-dev.202008072023.25340c8 to 5.4.0-dev.202008121736.25340c8

dist/index.d.ts

@@ -1,3 +0,3 @@
-import { RouterOptions } from 'vue-router';
-export declare const createRouter: (opts: RouterOptions) => import("vue-router").Router;
+import { IonicVueRouterOptions } from './types';
+export declare const createRouter: (opts: IonicVueRouterOptions) => import("vue-router").Router;
 export declare const createWebHistory: (base?: string) => import("vue-router").RouterHistory;

dist/index.js

@@ -1,6 +0,8 @@
-import { createRouter as createVueRouter, createWebHistory as createVueWebHistory, } from 'vue-router';
+import { createRouter as createVueRouter, createWebHistory as createVueWebHistory } from 'vue-router';
 import { createIonRouter } from './router';
 import { createViewStacks } from './viewStacks';
 export const createRouter = (opts) => {
-    const router = createVueRouter(opts);
+    const routerOptions = Object.assign({}, opts);
+    delete routerOptions.tabsPrefix;
+    const router = createVueRouter(routerOptions);
     const ionRouter = createIonRouter(opts, router);
@@ -14,4 +16,4 @@ const viewStacks = createViewStacks();
     };
-    router.beforeEach((to, _, next) => {
-        ionRouter.handleHistoryChange(to);
+    router.beforeEach((to, from, next) => {
+        ionRouter.handleHistoryChange(to, from);
         next();
@@ -18,0 +20,0 @@ });

dist/locationHistory.d.ts

@@ -6,4 +6,7 @@ import { RouteInfo } from './types';
     add: (routeInfo: RouteInfo) => void;
-    pop: () => RouteInfo;
+    pop: (routeInfo: RouteInfo) => void;
     canGoBack: (deep?: number) => boolean;
+    getTabsHistory: (tab: string) => RouteInfo[];
+    getFirstRouteInfoForTab: (tab: string) => RouteInfo | undefined;
+    getCurrentRouteInfoForTab: (tab: string) => RouteInfo | undefined;
 };

dist/locationHistory.js

 export const createLocationHistory = () => {
     const locationHistory = [];
+    const tabsHistory = {};
     const add = (routeInfo) => {
@@ -13,3 +14,3 @@ switch (routeInfo.routerAction) {
         if (routeInfo.routerDirection === 'root') {
-            clearHistory();
+            clearHistory(routeInfo);
             addRoute(routeInfo);
@@ -19,11 +20,51 @@ }
     const replaceRoute = (routeInfo) => {
-        pop();
+        pop(routeInfo);
         addRoute(routeInfo);
     };
-    const pop = () => locationHistory.pop();
-    const addRoute = (routeInfo) => locationHistory.push(routeInfo);
-    const clearHistory = () => locationHistory.length = 0;
+    const pop = (routeInfo) => {
+        locationHistory.pop();
+        const { tab } = routeInfo;
+        if (tab) {
+            if (tabsHistory[tab]) {
+                tabsHistory[tab].pop();
+            }
+        }
+    };
+    const addRoute = (routeInfo) => {
+        locationHistory.push(routeInfo);
+        const { tab } = routeInfo;
+        if (tab) {
+            if (tabsHistory[tab]) {
+                tabsHistory[tab].push(routeInfo);
+            }
+            else {
+                tabsHistory[tab] = [routeInfo];
+            }
+        }
+    };
+    const clearHistory = (routeInfo) => {
+        locationHistory.length = 0;
+        const { tab } = routeInfo;
+        if (tab) {
+            tabsHistory[tab] = [];
+        }
+    };
+    const getTabsHistory = (tab) => tabsHistory[tab];
     const previous = () => locationHistory[locationHistory.length - 2] || current();
     const current = () => locationHistory[locationHistory.length - 1];
     const canGoBack = (deep = 1) => locationHistory.length > deep;
+    const getFirstRouteInfoForTab = (tab) => {
+        const tabHistory = getTabsHistory(tab);
+        if (tabHistory) {
+            return tabHistory[0];
+        }
+        return undefined;
+    };
+    const getCurrentRouteInfoForTab = (tab) => {
+        const tabHistory = getTabsHistory(tab);
+        if (tabHistory) {
+            return tabHistory[tabHistory.length - 1];
+        }
+        return undefined;
+    };
     return {
@@ -34,5 +75,8 @@ current,
         pop,
-        canGoBack
+        canGoBack,
+        getTabsHistory,
+        getFirstRouteInfoForTab,
+        getCurrentRouteInfoForTab
     };
 };
 //# sourceMappingURL=locationHistory.js.map

dist/router.d.ts

@@ -1,5 +0,5 @@
-import { Router, RouteLocationNormalized, RouteLocationNormalizedLoaded, RouterOptions } from 'vue-router';
-import { ExternalNavigationOptions, RouteInfo, RouteParams } from './types';
-export declare const createIonRouter: (opts: RouterOptions, router: Router) => {
-    handleHistoryChange: (to: RouteLocationNormalized) => void;
+import { Router, RouteLocationNormalized, RouteLocationNormalizedLoaded } from 'vue-router';
+import { ExternalNavigationOptions, RouteInfo, RouteParams, IonicVueRouterOptions } from './types';
+export declare const createIonRouter: (opts: IonicVueRouterOptions, router: Router) => {
+    handleHistoryChange: (to: RouteLocationNormalized, from: RouteLocationNormalized) => void;
     getCurrentRouteInfo: () => RouteInfo;
@@ -13,6 +13,11 @@ setInitialRoute: (routeInfo: RouteLocationNormalizedLoaded) => void;
         add: (routeInfo: RouteInfo) => void;
-        pop: () => RouteInfo;
+        pop: (routeInfo: RouteInfo) => void;
         canGoBack: (deep?: number) => boolean;
+        getTabsHistory: (tab: string) => RouteInfo[];
+        getFirstRouteInfoForTab: (tab: string) => RouteInfo;
+        getCurrentRouteInfoForTab: (tab: string) => RouteInfo;
     };
     setIncomingRouteParams: (params: RouteParams) => void;
+    resetTab: (tab: string, originalHref: string) => void;
+    changeTab: (tab: string, path: string) => void;
 };

dist/router.js

 import { createLocationHistory } from './locationHistory';
 import { generateId } from './utils';
 export const createIonRouter = (opts, router) => {
+    const tabsPrefix = opts.tabsPrefix || '/tabs';
     const locationHistory = createLocationHistory();
@@ -17,2 +18,13 @@ let currentRouteInfo;
     opts.history.listen((_, _x, info) => handleNavigate(info));
+    const getTab = (path) => {
+        const tabs = path.split(tabsPrefix);
+        if (tabs.length === 1)
+            return undefined;
+        return tabs[1].split('/')[1];
+    };
+    const isTabSwitch = (to, from) => {
+        const toTab = getTab(to);
+        const fromTab = getTab(from);
+        return fromTab !== undefined && toTab !== undefined && fromTab !== toTab;
+    };
     //  HistoryLocation   HistoryLocation    NavigationInformation
@@ -25,3 +37,3 @@ const handleNavigate = (info) => {
     };
-    const handleHistoryChange = (to) => {
+    const handleHistoryChange = (to, from) => {
         let leavingLocationInfo;
@@ -51,6 +63,10 @@ let routeInfo;
             }
-            routeInfo = Object.assign(Object.assign({}, incomingRouteParams), { id: generateId('routeInfo'), lastPathname: leavingLocationInfo.pathname, pathname: to.path, search: to.fullPath.split('?')[1] || '', params: to.params });
-            if (incomingRouteParams.routerAction === 'pop') {
-                locationHistory.pop();
+            const tabSwitch = isTabSwitch(to.fullPath, from.fullPath);
+            if (tabSwitch) {
+                incomingRouteParams.routerDirection = 'root';
             }
+            routeInfo = Object.assign(Object.assign({}, incomingRouteParams), { id: generateId('routeInfo'), lastPathname: leavingLocationInfo.pathname, pathname: to.path, search: to.fullPath.split('?')[1] || '', params: to.params, tab: getTab(to.fullPath), previousTab: getTab(from.fullPath), tabSwitch });
+            if (incomingRouteParams.routerAction === 'pop' && !tabSwitch) {
+                locationHistory.pop(routeInfo);
+            }
             else {
@@ -89,2 +105,30 @@ locationHistory.add(routeInfo);
     const getLocationHistory = () => locationHistory;
+    const resetTab = (tab, originalHref) => {
+        const routeInfo = locationHistory.getFirstRouteInfoForTab(tab);
+        if (routeInfo) {
+            const newRouteInfo = Object.assign({}, routeInfo);
+            newRouteInfo.pathname = originalHref;
+            incomingRouteParams = Object.assign(Object.assign({}, newRouteInfo), { routerAction: 'pop', routerDirection: 'back' });
+            router.push(newRouteInfo.pathname + (newRouteInfo.search || ''));
+        }
+    };
+    const changeTab = (tab, path) => {
+        const routeInfo = locationHistory.getCurrentRouteInfoForTab(tab);
+        const [pathname, search] = path.split('?');
+        if (routeInfo) {
+            incomingRouteParams = Object.assign(Object.assign({}, routeInfo), { routerAction: 'push', routerDirection: 'none' });
+            if (routeInfo.pathname === pathname) {
+                router.push(routeInfo.pathname + (routeInfo.search || ''));
+            }
+            else {
+                router.push(pathname + (search ? '?' + search : ''));
+            }
+        }
+        else {
+            navigate({
+                routerLink: pathname,
+                routerDirection: 'none'
+            });
+        }
+    };
     return {
@@ -97,5 +141,7 @@ handleHistoryChange,
         getLocationHistory,
-        setIncomingRouteParams
+        setIncomingRouteParams,
+        resetTab,
+        changeTab
     };
 };
 //# sourceMappingURL=router.js.map

dist/types.d.ts

 import { AnimationBuilder } from '@ionic/core';
+import { RouterOptions } from 'vue-router';
+export interface IonicVueRouterOptions extends RouterOptions {
+    tabsPrefix?: string;
+}
 export interface RouteInfo {
@@ -13,2 +17,5 @@ id?: string;
     };
+    tab?: string;
+    previousTab?: string;
+    tabSwitch?: boolean;
 }
@@ -21,3 +28,3 @@ export interface RouteParams {
 export declare type RouteAction = 'push' | 'pop' | 'replace';
-export declare type RouteDirection = 'forward' | 'back' | 'root';
+export declare type RouteDirection = 'forward' | 'back' | 'root' | 'none';
 export interface ViewItem {
@@ -39,3 +46,2 @@ id: string;
     routerAnimation?: AnimationBuilder;
-    event: Event;
 }

package.json

 {
   "name": "@ionic/vue-router",
-  "version": "5.4.0-dev.202008072023.25340c8",
+  "version": "5.4.0-dev.202008121736.25340c8",
   "description": "Vue Router integration for @ionic/vue",
@@ -5,0 +5,0 @@ "scripts": {

No alert changes

Improved metrics

Total package byte prevSize

27707

increased by34.1%

Lines of code

428

increased by33.33%

No dependency changes