@merkur/plugin-router 0.36.5 → 0.37.0

package/lib/index.cjs

@@ -15,7 +15,27 @@ const ENV =
     : DEV;
 
 function createRouter(widget, routes, options) {
-  widget.$dependencies.router = new UniversalRouter(routes, options);
+  let wrappedRoutes = routes.reduce((result, route) => {
+    const clonedRoute = { ...route };
+
+    if (core.isFunction(clonedRoute.action)) {
+      const originAction = clonedRoute.action;
+      clonedRoute.action = (...rest) => {
+        // @TODO UniversalRouter don't parse query from url so context.params are only named route parameters
+        // For some application can be helpful to have named route parameters and query parameters merged
+        // because link method support both named parameters and query parameters
+        widget.$in.router.context = rest[0];
+
+        return originAction(...rest);
+      };
+    }
+
+    result.push(clonedRoute);
+
+    return result;
+  }, []);
+
+  widget.$dependencies.router = new UniversalRouter(wrappedRoutes, options);
   widget.$dependencies.link = generateUrls(widget.$dependencies.router, {
     stringifyQueryParams: (params) => new URLSearchParams(params).toString(),
   });
@@ -29,6 +49,7 @@ function routerPlugin() {
 
       widget.$in.router = {
         route: null,
+        context: null,
         options: {},
         pathname: null,
         isMounting: false,
@@ -104,6 +125,9 @@ function routerAPI() {
       getCurrentRoute(widget) {
         return widget.$in.router.route;
       },
+      getCurrentContext(widget) {
+        return widget.$in.router.context;
+      },
     },
   };
 }
@@ -137,6 +161,7 @@ async function loadHook(widget, originalLoad, ...rest) {
     : Promise.resolve({});
   const routeStatePromise = plugin.route.load(widget, {
     route: plugin.route,
+    context: plugin.context,
     args: rest,
     globalState: globalStatePromise,
   });
@@ -162,7 +187,11 @@ async function mountHook(widget, originalMount, ...rest) {
   const result = await originalMount(...rest);
 
   if (plugin.isMounting && core.isFunction(plugin.route.init)) {
-    await plugin.route.init(widget, { route: plugin.route, args: rest });
+    await plugin.route.init(widget, {
+      route: plugin.route,
+      context: plugin.context,
+      args: rest,
+    });
   }
 
   if (
@@ -171,7 +200,11 @@ async function mountHook(widget, originalMount, ...rest) {
     !plugin.isRouteActivated
   ) {
     plugin.isRouteActivated = true;
-    plugin.route.activate(widget, { route: plugin.route, args: rest });
+    plugin.route.activate(widget, {
+      route: plugin.route,
+      context: plugin.context,
+      args: rest,
+    });
   }
 
   plugin.isMounting = false;
@@ -191,7 +224,11 @@ async function updateHook(widget, originalUpdate, ...rest) {
     !plugin.isRouteActivated
   ) {
     plugin.isRouteActivated = true;
-    plugin.route.activate(widget, { route: plugin.route, args: rest });
+    plugin.route.activate(widget, {
+      route: plugin.route,
+      context: plugin.context,
+      args: rest,
+    });
   }
 
   return result;
@@ -232,9 +269,10 @@ async function resolveRoute(widget) {
 
 async function setupRouterCycle(widget, ...rest) {
   const route = await resolveRoute(widget);
+  const plugin = widget.$in.router;
 
   if (core.isFunction(route.init)) {
-    await route.init(widget, { route, args: rest });
+    await route.init(widget, { route, context: plugin.context, args: rest });
   }
 }
 
@@ -245,11 +283,19 @@ async function tearDownRouterCycle(widget, ...rest) {
 
   if (route) {
     if (core.isFunction(route.deactivate) && isRouteActivated === true) {
-      await route.deactivate(widget, { route, args: rest });
+      await route.deactivate(widget, {
+        route,
+        context: plugin.context,
+        args: rest,
+      });
     }
 
     if (core.isFunction(route.destroy)) {
-      await route.destroy(widget, { route, args: rest });
+      await route.destroy(widget, {
+        route,
+        context: plugin.context,
+        args: rest,
+      });
     }
   }
 

package/lib/index.es9.cjs

@@ -9,7 +9,24 @@ var RouterEvents = Object.freeze({
 const DEV = 'development';
 const ENV = typeof process !== 'undefined' && process && process.env ? process.env.NODE_ENV : DEV;
 function createRouter(widget, routes, options) {
-  widget.$dependencies.router = new UniversalRouter(routes, options);
+  let wrappedRoutes = routes.reduce((result, route) => {
+    const clonedRoute = {
+      ...route
+    };
+    if (core.isFunction(clonedRoute.action)) {
+      const originAction = clonedRoute.action;
+      clonedRoute.action = (...rest) => {
+        // @TODO UniversalRouter don't parse query from url so context.params are only named route parameters
+        // For some application can be helpful to have named route parameters and query parameters merged
+        // because link method support both named parameters and query parameters
+        widget.$in.router.context = rest[0];
+        return originAction(...rest);
+      };
+    }
+    result.push(clonedRoute);
+    return result;
+  }, []);
+  widget.$dependencies.router = new UniversalRouter(wrappedRoutes, options);
   widget.$dependencies.link = generateUrls(widget.$dependencies.router, {
     stringifyQueryParams: params => new URLSearchParams(params).toString()
   });
@@ -21,6 +38,7 @@ function routerPlugin() {
       core.assignMissingKeys(widget, routerAPI());
       widget.$in.router = {
         route: null,
+        context: null,
         options: {},
         pathname: null,
         isMounting: false,
@@ -81,6 +99,9 @@ function routerAPI() {
       },
       getCurrentRoute(widget) {
         return widget.$in.router.route;
+      },
+      getCurrentContext(widget) {
+        return widget.$in.router.context;
       }
     }
   };
@@ -106,6 +127,7 @@ async function loadHook(widget, originalLoad, ...rest) {
   const globalStatePromise = core.isFunction(originalLoad) ? originalLoad(widget, ...rest) : Promise.resolve({});
   const routeStatePromise = plugin.route.load(widget, {
     route: plugin.route,
+    context: plugin.context,
     args: rest,
     globalState: globalStatePromise
   });
@@ -128,6 +150,7 @@ async function mountHook(widget, originalMount, ...rest) {
   if (plugin.isMounting && core.isFunction(plugin.route.init)) {
     await plugin.route.init(widget, {
       route: plugin.route,
+      context: plugin.context,
       args: rest
     });
   }
@@ -135,6 +158,7 @@ async function mountHook(widget, originalMount, ...rest) {
     plugin.isRouteActivated = true;
     plugin.route.activate(widget, {
       route: plugin.route,
+      context: plugin.context,
       args: rest
     });
   }
@@ -150,6 +174,7 @@ async function updateHook(widget, originalUpdate, ...rest) {
     plugin.isRouteActivated = true;
     plugin.route.activate(widget, {
       route: plugin.route,
+      context: plugin.context,
       args: rest
     });
   }
@@ -181,9 +206,11 @@ async function resolveRoute(widget) {
 }
 async function setupRouterCycle(widget, ...rest) {
   const route = await resolveRoute(widget);
+  const plugin = widget.$in.router;
   if (core.isFunction(route.init)) {
     await route.init(widget, {
       route,
+      context: plugin.context,
       args: rest
     });
   }
@@ -198,12 +225,14 @@ async function tearDownRouterCycle(widget, ...rest) {
     if (core.isFunction(route.deactivate) && isRouteActivated === true) {
       await route.deactivate(widget, {
         route,
+        context: plugin.context,
         args: rest
       });
     }
     if (core.isFunction(route.destroy)) {
       await route.destroy(widget, {
         route,
+        context: plugin.context,
         args: rest
       });
     }

package/lib/index.es9.mjs

@@ -1,4 +1,4 @@
-import { assignMissingKeys, bindWidgetToFunctions, setDefaultValueForUndefined, hookMethod, isFunction } from '@merkur/core';
+import { isFunction, assignMissingKeys, bindWidgetToFunctions, setDefaultValueForUndefined, hookMethod } from '@merkur/core';
 import UniversalRouter from 'universal-router';
 import generateUrls from 'universal-router/generateUrls';
 var RouterEvents = Object.freeze({
@@ -7,7 +7,24 @@ var RouterEvents = Object.freeze({
 const DEV = 'development';
 const ENV = typeof process !== 'undefined' && process && process.env ? process.env.NODE_ENV : DEV;
 function createRouter(widget, routes, options) {
-  widget.$dependencies.router = new UniversalRouter(routes, options);
+  let wrappedRoutes = routes.reduce((result, route) => {
+    const clonedRoute = {
+      ...route
+    };
+    if (isFunction(clonedRoute.action)) {
+      const originAction = clonedRoute.action;
+      clonedRoute.action = (...rest) => {
+        // @TODO UniversalRouter don't parse query from url so context.params are only named route parameters
+        // For some application can be helpful to have named route parameters and query parameters merged
+        // because link method support both named parameters and query parameters
+        widget.$in.router.context = rest[0];
+        return originAction(...rest);
+      };
+    }
+    result.push(clonedRoute);
+    return result;
+  }, []);
+  widget.$dependencies.router = new UniversalRouter(wrappedRoutes, options);
   widget.$dependencies.link = generateUrls(widget.$dependencies.router, {
     stringifyQueryParams: params => new URLSearchParams(params).toString()
   });
@@ -19,6 +36,7 @@ function routerPlugin() {
       assignMissingKeys(widget, routerAPI());
       widget.$in.router = {
         route: null,
+        context: null,
         options: {},
         pathname: null,
         isMounting: false,
@@ -79,6 +97,9 @@ function routerAPI() {
       },
       getCurrentRoute(widget) {
         return widget.$in.router.route;
+      },
+      getCurrentContext(widget) {
+        return widget.$in.router.context;
       }
     }
   };
@@ -104,6 +125,7 @@ async function loadHook(widget, originalLoad, ...rest) {
   const globalStatePromise = isFunction(originalLoad) ? originalLoad(widget, ...rest) : Promise.resolve({});
   const routeStatePromise = plugin.route.load(widget, {
     route: plugin.route,
+    context: plugin.context,
     args: rest,
     globalState: globalStatePromise
   });
@@ -126,6 +148,7 @@ async function mountHook(widget, originalMount, ...rest) {
   if (plugin.isMounting && isFunction(plugin.route.init)) {
     await plugin.route.init(widget, {
       route: plugin.route,
+      context: plugin.context,
       args: rest
     });
   }
@@ -133,6 +156,7 @@ async function mountHook(widget, originalMount, ...rest) {
     plugin.isRouteActivated = true;
     plugin.route.activate(widget, {
       route: plugin.route,
+      context: plugin.context,
       args: rest
     });
   }
@@ -148,6 +172,7 @@ async function updateHook(widget, originalUpdate, ...rest) {
     plugin.isRouteActivated = true;
     plugin.route.activate(widget, {
       route: plugin.route,
+      context: plugin.context,
       args: rest
     });
   }
@@ -179,9 +204,11 @@ async function resolveRoute(widget) {
 }
 async function setupRouterCycle(widget, ...rest) {
   const route = await resolveRoute(widget);
+  const plugin = widget.$in.router;
   if (isFunction(route.init)) {
     await route.init(widget, {
       route,
+      context: plugin.context,
       args: rest
     });
   }
@@ -196,12 +223,14 @@ async function tearDownRouterCycle(widget, ...rest) {
     if (isFunction(route.deactivate) && isRouteActivated === true) {
       await route.deactivate(widget, {
         route,
+        context: plugin.context,
         args: rest
       });
     }
     if (isFunction(route.destroy)) {
       await route.destroy(widget, {
         route,
+        context: plugin.context,
         args: rest
       });
     }

package/lib/index.js

@@ -15,7 +15,27 @@ const ENV =
     : DEV;
 
 function createRouter(widget, routes, options) {
-  widget.$dependencies.router = new UniversalRouter(routes, options);
+  let wrappedRoutes = routes.reduce((result, route) => {
+    const clonedRoute = { ...route };
+
+    if (core.isFunction(clonedRoute.action)) {
+      const originAction = clonedRoute.action;
+      clonedRoute.action = (...rest) => {
+        // @TODO UniversalRouter don't parse query from url so context.params are only named route parameters
+        // For some application can be helpful to have named route parameters and query parameters merged
+        // because link method support both named parameters and query parameters
+        widget.$in.router.context = rest[0];
+
+        return originAction(...rest);
+      };
+    }
+
+    result.push(clonedRoute);
+
+    return result;
+  }, []);
+
+  widget.$dependencies.router = new UniversalRouter(wrappedRoutes, options);
   widget.$dependencies.link = generateUrls(widget.$dependencies.router, {
     stringifyQueryParams: (params) => new URLSearchParams(params).toString(),
   });
@@ -29,6 +49,7 @@ function routerPlugin() {
 
       widget.$in.router = {
         route: null,
+        context: null,
         options: {},
         pathname: null,
         isMounting: false,
@@ -104,6 +125,9 @@ function routerAPI() {
       getCurrentRoute(widget) {
         return widget.$in.router.route;
       },
+      getCurrentContext(widget) {
+        return widget.$in.router.context;
+      },
     },
   };
 }
@@ -137,6 +161,7 @@ async function loadHook(widget, originalLoad, ...rest) {
     : Promise.resolve({});
   const routeStatePromise = plugin.route.load(widget, {
     route: plugin.route,
+    context: plugin.context,
     args: rest,
     globalState: globalStatePromise,
   });
@@ -162,7 +187,11 @@ async function mountHook(widget, originalMount, ...rest) {
   const result = await originalMount(...rest);
 
   if (plugin.isMounting && core.isFunction(plugin.route.init)) {
-    await plugin.route.init(widget, { route: plugin.route, args: rest });
+    await plugin.route.init(widget, {
+      route: plugin.route,
+      context: plugin.context,
+      args: rest,
+    });
   }
 
   if (
@@ -171,7 +200,11 @@ async function mountHook(widget, originalMount, ...rest) {
     !plugin.isRouteActivated
   ) {
     plugin.isRouteActivated = true;
-    plugin.route.activate(widget, { route: plugin.route, args: rest });
+    plugin.route.activate(widget, {
+      route: plugin.route,
+      context: plugin.context,
+      args: rest,
+    });
   }
 
   plugin.isMounting = false;
@@ -191,7 +224,11 @@ async function updateHook(widget, originalUpdate, ...rest) {
     !plugin.isRouteActivated
   ) {
     plugin.isRouteActivated = true;
-    plugin.route.activate(widget, { route: plugin.route, args: rest });
+    plugin.route.activate(widget, {
+      route: plugin.route,
+      context: plugin.context,
+      args: rest,
+    });
   }
 
   return result;
@@ -232,9 +269,10 @@ async function resolveRoute(widget) {
 
 async function setupRouterCycle(widget, ...rest) {
   const route = await resolveRoute(widget);
+  const plugin = widget.$in.router;
 
   if (core.isFunction(route.init)) {
-    await route.init(widget, { route, args: rest });
+    await route.init(widget, { route, context: plugin.context, args: rest });
   }
 }
 
@@ -245,11 +283,19 @@ async function tearDownRouterCycle(widget, ...rest) {
 
   if (route) {
     if (core.isFunction(route.deactivate) && isRouteActivated === true) {
-      await route.deactivate(widget, { route, args: rest });
+      await route.deactivate(widget, {
+        route,
+        context: plugin.context,
+        args: rest,
+      });
     }
 
     if (core.isFunction(route.destroy)) {
-      await route.destroy(widget, { route, args: rest });
+      await route.destroy(widget, {
+        route,
+        context: plugin.context,
+        args: rest,
+      });
     }
   }
 

package/lib/index.mjs

@@ -1,4 +1,4 @@
-import { assignMissingKeys, bindWidgetToFunctions, setDefaultValueForUndefined, hookMethod, isFunction } from '@merkur/core';
+import { isFunction, assignMissingKeys, bindWidgetToFunctions, setDefaultValueForUndefined, hookMethod } from '@merkur/core';
 import UniversalRouter from 'universal-router';
 import generateUrls from 'universal-router/generateUrls';
 
@@ -13,7 +13,27 @@ const ENV =
     : DEV;
 
 function createRouter(widget, routes, options) {
-  widget.$dependencies.router = new UniversalRouter(routes, options);
+  let wrappedRoutes = routes.reduce((result, route) => {
+    const clonedRoute = { ...route };
+
+    if (isFunction(clonedRoute.action)) {
+      const originAction = clonedRoute.action;
+      clonedRoute.action = (...rest) => {
+        // @TODO UniversalRouter don't parse query from url so context.params are only named route parameters
+        // For some application can be helpful to have named route parameters and query parameters merged
+        // because link method support both named parameters and query parameters
+        widget.$in.router.context = rest[0];
+
+        return originAction(...rest);
+      };
+    }
+
+    result.push(clonedRoute);
+
+    return result;
+  }, []);
+
+  widget.$dependencies.router = new UniversalRouter(wrappedRoutes, options);
   widget.$dependencies.link = generateUrls(widget.$dependencies.router, {
     stringifyQueryParams: (params) => new URLSearchParams(params).toString(),
   });
@@ -27,6 +47,7 @@ function routerPlugin() {
 
       widget.$in.router = {
         route: null,
+        context: null,
         options: {},
         pathname: null,
         isMounting: false,
@@ -102,6 +123,9 @@ function routerAPI() {
       getCurrentRoute(widget) {
         return widget.$in.router.route;
       },
+      getCurrentContext(widget) {
+        return widget.$in.router.context;
+      },
     },
   };
 }
@@ -135,6 +159,7 @@ async function loadHook(widget, originalLoad, ...rest) {
     : Promise.resolve({});
   const routeStatePromise = plugin.route.load(widget, {
     route: plugin.route,
+    context: plugin.context,
     args: rest,
     globalState: globalStatePromise,
   });
@@ -160,7 +185,11 @@ async function mountHook(widget, originalMount, ...rest) {
   const result = await originalMount(...rest);
 
   if (plugin.isMounting && isFunction(plugin.route.init)) {
-    await plugin.route.init(widget, { route: plugin.route, args: rest });
+    await plugin.route.init(widget, {
+      route: plugin.route,
+      context: plugin.context,
+      args: rest,
+    });
   }
 
   if (
@@ -169,7 +198,11 @@ async function mountHook(widget, originalMount, ...rest) {
     !plugin.isRouteActivated
   ) {
     plugin.isRouteActivated = true;
-    plugin.route.activate(widget, { route: plugin.route, args: rest });
+    plugin.route.activate(widget, {
+      route: plugin.route,
+      context: plugin.context,
+      args: rest,
+    });
   }
 
   plugin.isMounting = false;
@@ -189,7 +222,11 @@ async function updateHook(widget, originalUpdate, ...rest) {
     !plugin.isRouteActivated
   ) {
     plugin.isRouteActivated = true;
-    plugin.route.activate(widget, { route: plugin.route, args: rest });
+    plugin.route.activate(widget, {
+      route: plugin.route,
+      context: plugin.context,
+      args: rest,
+    });
   }
 
   return result;
@@ -230,9 +267,10 @@ async function resolveRoute(widget) {
 
 async function setupRouterCycle(widget, ...rest) {
   const route = await resolveRoute(widget);
+  const plugin = widget.$in.router;
 
   if (isFunction(route.init)) {
-    await route.init(widget, { route, args: rest });
+    await route.init(widget, { route, context: plugin.context, args: rest });
   }
 }
 
@@ -243,11 +281,19 @@ async function tearDownRouterCycle(widget, ...rest) {
 
   if (route) {
     if (isFunction(route.deactivate) && isRouteActivated === true) {
-      await route.deactivate(widget, { route, args: rest });
+      await route.deactivate(widget, {
+        route,
+        context: plugin.context,
+        args: rest,
+      });
     }
 
     if (isFunction(route.destroy)) {
-      await route.destroy(widget, { route, args: rest });
+      await route.destroy(widget, {
+        route,
+        context: plugin.context,
+        args: rest,
+      });
     }
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@merkur/plugin-router",
-  "version": "0.36.5",
+  "version": "0.37.0",
   "description": "Merkur router plugin.",
   "main": "lib/index",
   "module": "lib/index",
@@ -56,9 +56,9 @@
   },
   "homepage": "https://merkur.js.org/",
   "devDependencies": {
-    "@merkur/core": "^0.36.0",
-    "@merkur/plugin-component": "^0.36.0",
-    "@merkur/plugin-event-emitter": "^0.36.0"
+    "@merkur/core": "^0.37.0",
+    "@merkur/plugin-component": "^0.37.0",
+    "@merkur/plugin-event-emitter": "^0.37.0"
   },
   "peerDependencies": {
     "@merkur/core": "*",
@@ -68,5 +68,5 @@
   "dependencies": {
     "universal-router": "^9.1.0"
   },
-  "gitHead": "89939c5215ebe0cb4403b488ebb0400611aba9e3"
+  "gitHead": "af826493e5ed4b37602dd43ce89a59baeeb1bada"
 }