peppermint-router - npm Package Compare versions

Comparing version 0.0.1 to 0.0.2

CHANGELOG.md

@@ -5,5 +5,11 @@ # Change Log
 
+## [0.0.2 - 2018-07-26](https://github.com/alonrbar/peppermint-router/tree/v0.0.2)
+
+### Added
+
+- RouteFallback component.
+
 ## [0.0.1 - 2018-07-26](https://github.com/alonrbar/peppermint-router/tree/v0.0.1)
 
-- First version
+### First version
 
@@ -10,0 +16,0 @@ ---

dist/index.d.ts

@@ -11,13 +11,26 @@ import * as React from 'react';
 
-export type RouteParams = IMap<string>;
+export interface RouteInfo {
+    path: string;
+    params: RouteParams;
+}
 
-export type RouteAction = (params: RouteParams) => void;
+export interface BeforeNavigationEvent {
+    prevRoute: RouteInfo;
+    nextRoute: RouteInfo;
+}
 
-export type BeforeNavigationHandler = (nextPath: string) => Promise<boolean>;
+export type BeforeNavigationHandler = (e: BeforeNavigationEvent) => Promise<boolean>;
 
-export type BeforeUnloadHandler = () => string;
+export interface BeforeUnloadEvent {
+    currentRoute: RouteInfo;
+}
 
+export type BeforeUnloadHandler = (e: BeforeUnloadEvent) => string;
+
+export type RouteAction = (params: RouteParams) => void;
+
 export class HashRouter {
 
     public fallback: VoidFunction;
+    
     /**
@@ -28,2 +41,3 @@ * Triggered when a navigation inside the application takes place.
     public onBeforeNavigation: BeforeNavigationHandler;
+    
     /**
@@ -35,2 +49,4 @@ * Triggered when a navigation to another site takes place.
 
+    public readonly currentRoute: RouteInfo;
+
     public mapPath(path: string, action: RouteAction): void;
@@ -50,5 +66,6 @@
 export interface RouterViewProps {
+    routerRef?: (router: HashRouter) => void;
 }
 
-export class RouterView extends React.PureComponent<RouterViewProps> { }
+export class RouterView extends React.Component<RouterViewProps> { }
 
@@ -64,2 +81,8 @@ //
 
-export class Route extends React.PureComponent<RouteProps> { }
+export class Route extends React.Component<RouteProps> { }
+
+export interface RouteFallbackProps {
+    component: React.ComponentType<any>;
+}
+
+export class RouteFallback extends React.Component<RouteFallbackProps> { }

dist/peppermint-router.cjs.js

@@ -10,2 +10,60 @@ 'use strict';
 
+const RouterContext =
+/*#__PURE__*/
+React.createContext(undefined);
+
+class Route extends React.Component {
+  constructor(...args) {
+    super(...args);
+
+    _defineProperty(this, "renderRoute", context => {
+      this.registerRoute(context);
+      if (this.props.path !== context.currentRoute.path) return null;
+      return React.createElement(this.props.component, {
+        route: context.currentRoute
+      });
+    });
+  }
+
+  render() {
+    return React.createElement(RouterContext.Consumer, null, this.renderRoute);
+  }
+
+  registerRoute(context) {
+    context.router.mapPath(this.props.path, params => {
+      context.setCurrentRoute({
+        path: this.props.path,
+        params
+      });
+    });
+  }
+
+}
+
+class RouteFallback extends React.Component {
+  constructor(...args) {
+    super(...args);
+
+    _defineProperty(this, "renderRoute", context => {
+      this.registerRoute(context);
+      if (context.currentRoute.path !== null) return null;
+      return React.createElement(this.props.component, {
+        route: context.currentRoute
+      });
+    });
+  }
+
+  render() {
+    return React.createElement(RouterContext.Consumer, null, this.renderRoute);
+  }
+
+  registerRoute(context) {
+    context.router.fallback = () => context.setCurrentRoute({
+      path: null,
+      params: null
+    });
+  }
+
+}
+
 function removeStart(str, ...toRemove) {
@@ -58,3 +116,3 @@ return removeSide(str, /^(\s*[\r\n]*)*/, String.prototype.startsWith, (s, tr) => s.substring(tr.length), ...toRemove);
 
-    _defineProperty(this, "_currentRoute", void 0);
+    _defineProperty(this, "_currentRoute", {});
 
@@ -68,14 +126,20 @@ _defineProperty(this, "routes", {});
 
-      if (path === this._currentRoute) return; // find the route to active
+      if (path === this._currentRoute.path) return; // find the route to active
 
-      const matchResult = this.match(path); // invoke beforeNavigation handler
+      const matchResult = this.match(path);
+      const nextRoute = {
+        path,
+        params: matchResult && matchResult.params || {}
+      }; // invoke beforeNavigation handler
 
       if (this.onBeforeNavigation) {
-        const nextPath = matchResult && matchResult.route.path;
-        const stopNavigation = (await this.onBeforeNavigation(nextPath)) === false;
+        const continueNavigation = await this.onBeforeNavigation({
+          prevRoute: this.currentRoute,
+          nextRoute
+        });
 
-        if (stopNavigation) {
+        if (continueNavigation === false) {
           // restore location hash
-          window.history.replaceState(null, null, this._currentRoute);
-          this.goTo(this._currentRoute);
+          window.history.replaceState(null, null, this._currentRoute.path);
+          this.goTo(this._currentRoute.path);
           return;
@@ -86,3 +150,3 @@ }
 
-      this._currentRoute = path;
+      this._currentRoute = nextRoute;
 
@@ -166,3 +230,5 @@ if (matchResult) {
     window.addEventListener('beforeunload', e => {
-      const promptMessage = this.onBeforeUnload ? this.onBeforeUnload() : undefined;
+      const promptMessage = this.onBeforeUnload ? this.onBeforeUnload({
+        currentRoute: this.currentRoute
+      }) : undefined;
 
@@ -236,34 +302,2 @@ if (promptMessage) {
 
-const RouterContext =
-/*#__PURE__*/
-React.createContext(undefined);
-
-class Route extends React.Component {
-  constructor(...args) {
-    super(...args);
-
-    _defineProperty(this, "renderRoute", context => {
-      this.registerRoute(context);
-      if (this.props.path !== context.currentRoute.path) return null;
-      return React.createElement(this.props.component, {
-        route: context.currentRoute
-      });
-    });
-  }
-
-  render() {
-    return React.createElement(RouterContext.Consumer, null, this.renderRoute);
-  }
-
-  registerRoute(context) {
-    context.router.mapPath(this.props.path, params => {
-      context.setCurrentRoute({
-        path: this.props.path,
-        params
-      });
-    });
-  }
-
-}
-
 class RouterViewState {
@@ -316,3 +350,5 @@ constructor() {
 exports.Route = Route;
+exports.RouteFallback = RouteFallback;
+exports.RouterContext = RouterContext;
 exports.RouterView = RouterView;
 //# sourceMappingURL=peppermint-router.cjs.js.map

dist/peppermint-router.esm.js

 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import { createContext, Component, createElement } from 'react';
 
+const RouterContext =
+/*#__PURE__*/
+createContext(undefined);
+
+class Route extends Component {
+  constructor(...args) {
+    super(...args);
+
+    _defineProperty(this, "renderRoute", context => {
+      this.registerRoute(context);
+      if (this.props.path !== context.currentRoute.path) return null;
+      return createElement(this.props.component, {
+        route: context.currentRoute
+      });
+    });
+  }
+
+  render() {
+    return createElement(RouterContext.Consumer, null, this.renderRoute);
+  }
+
+  registerRoute(context) {
+    context.router.mapPath(this.props.path, params => {
+      context.setCurrentRoute({
+        path: this.props.path,
+        params
+      });
+    });
+  }
+
+}
+
+class RouteFallback extends Component {
+  constructor(...args) {
+    super(...args);
+
+    _defineProperty(this, "renderRoute", context => {
+      this.registerRoute(context);
+      if (context.currentRoute.path !== null) return null;
+      return createElement(this.props.component, {
+        route: context.currentRoute
+      });
+    });
+  }
+
+  render() {
+    return createElement(RouterContext.Consumer, null, this.renderRoute);
+  }
+
+  registerRoute(context) {
+    context.router.fallback = () => context.setCurrentRoute({
+      path: null,
+      params: null
+    });
+  }
+
+}
+
 function removeStart(str, ...toRemove) {
@@ -51,3 +109,3 @@ return removeSide(str, /^(\s*[\r\n]*)*/, String.prototype.startsWith, (s, tr) => s.substring(tr.length), ...toRemove);
 
-    _defineProperty(this, "_currentRoute", void 0);
+    _defineProperty(this, "_currentRoute", {});
 
@@ -61,14 +119,20 @@ _defineProperty(this, "routes", {});
 
-      if (path === this._currentRoute) return; // find the route to active
+      if (path === this._currentRoute.path) return; // find the route to active
 
-      const matchResult = this.match(path); // invoke beforeNavigation handler
+      const matchResult = this.match(path);
+      const nextRoute = {
+        path,
+        params: matchResult && matchResult.params || {}
+      }; // invoke beforeNavigation handler
 
       if (this.onBeforeNavigation) {
-        const nextPath = matchResult && matchResult.route.path;
-        const stopNavigation = (await this.onBeforeNavigation(nextPath)) === false;
+        const continueNavigation = await this.onBeforeNavigation({
+          prevRoute: this.currentRoute,
+          nextRoute
+        });
 
-        if (stopNavigation) {
+        if (continueNavigation === false) {
           // restore location hash
-          window.history.replaceState(null, null, this._currentRoute);
-          this.goTo(this._currentRoute);
+          window.history.replaceState(null, null, this._currentRoute.path);
+          this.goTo(this._currentRoute.path);
           return;
@@ -79,3 +143,3 @@ }
 
-      this._currentRoute = path;
+      this._currentRoute = nextRoute;
 
@@ -159,3 +223,5 @@ if (matchResult) {
     window.addEventListener('beforeunload', e => {
-      const promptMessage = this.onBeforeUnload ? this.onBeforeUnload() : undefined;
+      const promptMessage = this.onBeforeUnload ? this.onBeforeUnload({
+        currentRoute: this.currentRoute
+      }) : undefined;
 
@@ -229,34 +295,2 @@ if (promptMessage) {
 
-const RouterContext =
-/*#__PURE__*/
-createContext(undefined);
-
-class Route extends Component {
-  constructor(...args) {
-    super(...args);
-
-    _defineProperty(this, "renderRoute", context => {
-      this.registerRoute(context);
-      if (this.props.path !== context.currentRoute.path) return null;
-      return createElement(this.props.component, {
-        route: context.currentRoute
-      });
-    });
-  }
-
-  render() {
-    return createElement(RouterContext.Consumer, null, this.renderRoute);
-  }
-
-  registerRoute(context) {
-    context.router.mapPath(this.props.path, params => {
-      context.setCurrentRoute({
-        path: this.props.path,
-        params
-      });
-    });
-  }
-
-}
-
 class RouterViewState {
@@ -307,3 +341,3 @@ constructor() {
 
-export { HashRouter, Route, RouterView };
+export { HashRouter, Route, RouteFallback, RouterContext, RouterView };
 //# sourceMappingURL=peppermint-router.esm.js.map

package.json

 {
   "name": "peppermint-router",
   "description": "Lightweight hash router for React",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "author": "Alon Bar",
@@ -6,0 +6,0 @@ "license": "MIT",

README.md

 # peppermint-router
 
-Lightweight hash router for React.
+Lightweight hash router for React
 
@@ -10,3 +10,4 @@ ```jsx
     <Route path="about" component={AboutPage} />
+    <RouteFallback component={NotFound} />
 </RouterView>
 ```

src/index.ts

@@ -1,3 +0,2 @@
-export * from './hashRouter';
-export * from './Route';
-export * from './RouterView';
+export * from './components';
+export * from './logic';

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

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

76392

increased by12.93%

Number of package files

21

increased by23.53%

Lines of code

962

increased by15.63%

Number of lines in readme file

13

increased by8.33%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes