@jack-henry/web-component-router - npm Package Compare versions

Comparing version 3.0.0 to 3.1.0

package.json

 {
   "name": "@jack-henry/web-component-router",
-  "version": "3.0.0",
+  "version": "3.1.0",
   "description": "Web Components Router",
@@ -5,0 +5,0 @@ "main": "router.js",

README.md

@@ -107,2 +107,35 @@ # @jack-henry/web-component-router
 
+### Defining a route configuration in the Router's constructor
+
+Alternatively you can pass a `routeConfig` object when instantiating your router.  This will use the `RouteTreeNode` and `RouteData` to create your applications routeTree.
+
+**Example RouteConfig object**
+```
+const routeConfig = {
+    id: 'app',
+    tagName: 'APP-MAIN',
+    path: '',
+    subRoutes: [{
+        id: 'app-user',
+        tagName: 'APP-USER-PAGE',
+        path: '/users/:userId([0-9]{1,6})',
+        params: ['userId'],
+    }, {
+        id: 'app-user-account',
+        tagName: 'APP-ACCOUNT-PAGE',
+        path: '/users/:userId([0-9]{1,6})/accounts/:accountId([0-9]{1,6})',
+        params: ['userId', 'accountId'],
+    }, {
+      id: 'app-about',
+      tagName: 'APP-ABOUT',
+      path: '/about',
+      authenticated: false,
+    }]
+};
+
+const router = New Router(routeConfig);
+```
+
+When using this method the default is that a route requires authentication, as shown above in the 'about' route, set `authenticated` to false to create a route which does not require authentication.
+
 ## Redirecting
@@ -155,3 +188,3 @@
   }
-  
+
   /**
@@ -214,3 +247,3 @@ * Implementation for the callback on exiting a route node.
   static get is() { return 'app-element'; }
-  
+
   connectedCallback() {
@@ -222,7 +255,7 @@ super.connectedCallback();
     router.routeTree.getValue().element = this;
-    
+
     // Start routing
     router.start();
   }
-  
+
   async routeEnter(currentNode, nextNodeIfExists, routeId, context) {
@@ -235,6 +268,6 @@ context.handled = true;
     }
-    
+
     // Redirect to the login page
     router.go('/login');
-    
+
     // Don't continue routing - we have redirected to the
@@ -244,3 +277,3 @@ // login page
   }
-  
+
   async routeExit(currentNode, nextNode, routeId, context) {
@@ -269,3 +302,3 @@ // This method should never be called. The main app element
   static get is() { return 'app-element'; }
-  
+
   connectedCallback() {
@@ -277,10 +310,10 @@ super.connectedCallback();
     router.routeTree.getValue().element = this;
-    
+
     // Save the scroll position for every route exit
     router.addGlobalExitHandler(this.saveScrollPosition_.bind(this));
-    
+
     // Start routing
     router.start();
   }
-  
+
   /**
@@ -298,3 +331,3 @@ * @param {!Context} context
   }
-  
+
   async routeEnter(currentNode, nextNodeIfExists, routeId, context) {
@@ -358,3 +391,3 @@ // Restoring the scroll position needs to be async
 /**
- * Unregister a callback function 
+ * Unregister a callback function
  * @param {!Function} callback
@@ -361,0 +394,0 @@ */

router.js

@@ -18,2 +18,12 @@ /**
 
+/**
+ * @typedef {Object} RouteConfig
+ * @property {string} id
+ * @property {string} tagName
+ * @property {string} path
+ * @property {Array<string>=} params
+ * @property {boolean=} authenticated
+ * @property {Array<RouteConfig>=} subRoutes
+ */
+
 import {Context, Page} from './lib/page.js';
@@ -27,3 +37,4 @@ import RouteTreeNode from './lib/route-tree-node.js';
 class Router {
-  constructor() {
+  /** @param {RouteConfig=} routeConfig */
+  constructor(routeConfig) {
     /** @type {string|undefined} */
@@ -36,3 +47,3 @@ this.currentNodeId_;
     /** @type {!RouteTreeNode|undefined} */
-    this.routeTree_;
+    this.routeTree_ = routeConfig ? this.buildRouteTree(routeConfig) : undefined;
 
@@ -74,2 +85,14 @@ this.nextStateWasPopped = false;
 
+  /** @param {!RouteConfig} routeConfig */
+  buildRouteTree(routeConfig) {
+    const authenticated = [true, false].includes(routeConfig.authenticated) ?  routeConfig.authenticated : true;
+    const node = new RouteTreeNode(new RouteData(routeConfig.id, routeConfig.tagName, routeConfig.path, routeConfig.params || [], authenticated));
+    if (routeConfig.subRoutes) {
+      routeConfig.subRoutes.forEach(route => {
+        node.addChild(this.buildRouteTree(route));
+      });
+    }
+    return node;
+  }
+
   /**
@@ -99,6 +122,7 @@ * Build the routing tree and begin routing
    * @param {Object=} params Values to use for named & query parameters
+   * @returns {!Promise<!Context>}
    */
-  go(path, params) {
+  async go(path, params) {
     path = this.url(path, params);
-    this.page.show(path);
+    return this.page.show(path);
   }
@@ -105,0 +129,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

123090

increased by98.93%

Number of package files

16

increased by77.78%

Lines of code

2793

increased by86.32%

Number of lines in readme file

409

increased by8.78%

No dependency changes