peppermint-router - npm Package Compare versions

Comparing version 0.0.0 to 0.0.1

CHANGELOG.md

@@ -5,4 +5,6 @@ # Change Log
 
-- Work in progress...
+## [0.0.1 - 2018-07-26](https://github.com/alonrbar/peppermint-router/tree/v0.0.1)
 
+- First version
+
 ---
@@ -9,0 +11,0 @@

dist/peppermint-router.cjs.js

@@ -8,2 +8,3 @@ 'use strict';
 var _defineProperty = _interopDefault(require('@babel/runtime/helpers/defineProperty'));
+var React = require('react');
 
@@ -57,3 +58,3 @@ function removeStart(str, ...toRemove) {
 
-    _defineProperty(this, "currentRoute", void 0);
+    _defineProperty(this, "_currentRoute", void 0);
 
@@ -67,3 +68,3 @@ _defineProperty(this, "routes", {});
 
-      if (path === this.currentRoute) return; // find the route to active
+      if (path === this._currentRoute) return; // find the route to active
 
@@ -78,4 +79,4 @@ const matchResult = this.match(path); // invoke beforeNavigation handler
           // restore location hash
-          window.history.replaceState(null, null, this.currentRoute);
-          this.goTo(this.currentRoute);
+          window.history.replaceState(null, null, this._currentRoute);
+          this.goTo(this._currentRoute);
           return;
@@ -86,3 +87,3 @@ }
 
-      this.currentRoute = path;
+      this._currentRoute = path;
 
@@ -134,2 +135,6 @@ if (matchResult) {
     this._onBeforeUnload = value;
+  }
+
+  get currentRoute() {
+    return this._currentRoute;
   } //
@@ -164,3 +169,7 @@ // private members
       const promptMessage = this.onBeforeUnload ? this.onBeforeUnload() : undefined;
-      e.returnValue = promptMessage;
+
+      if (promptMessage) {
+        e.returnValue = promptMessage;
+      }
+
       return promptMessage;
@@ -229,3 +238,82 @@ }); // listen to hash changes
 
+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 {
+  constructor() {
+    _defineProperty(this, "currentRoute", {
+      path: undefined,
+      params: undefined
+    });
+  }
+
+}
+
+class RouterView extends React.Component {
+  constructor(props) {
+    super(props);
+
+    _defineProperty(this, "router", new HashRouter());
+
+    _defineProperty(this, "setCurrentRoute", currentRoute => {
+      this.setState({
+        currentRoute
+      });
+    });
+
+    this.state = new RouterViewState();
+  }
+
+  componentDidMount() {
+    this.router.listen();
+  }
+
+  render() {
+    if (this.props.routerRef) {
+      this.props.routerRef(this.router);
+    }
+
+    return React.createElement(RouterContext.Provider, {
+      value: {
+        router: this.router,
+        currentRoute: this.state.currentRoute,
+        setCurrentRoute: this.setCurrentRoute
+      }
+    }, this.props.children);
+  }
+
+}
+
 exports.HashRouter = HashRouter;
+exports.Route = Route;
+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';
 
@@ -50,3 +51,3 @@ function removeStart(str, ...toRemove) {
 
-    _defineProperty(this, "currentRoute", void 0);
+    _defineProperty(this, "_currentRoute", void 0);
 
@@ -60,3 +61,3 @@ _defineProperty(this, "routes", {});
 
-      if (path === this.currentRoute) return; // find the route to active
+      if (path === this._currentRoute) return; // find the route to active
 
@@ -71,4 +72,4 @@ const matchResult = this.match(path); // invoke beforeNavigation handler
           // restore location hash
-          window.history.replaceState(null, null, this.currentRoute);
-          this.goTo(this.currentRoute);
+          window.history.replaceState(null, null, this._currentRoute);
+          this.goTo(this._currentRoute);
           return;
@@ -79,3 +80,3 @@ }
 
-      this.currentRoute = path;
+      this._currentRoute = path;
 
@@ -127,2 +128,6 @@ if (matchResult) {
     this._onBeforeUnload = value;
+  }
+
+  get currentRoute() {
+    return this._currentRoute;
   } //
@@ -157,3 +162,7 @@ // private members
       const promptMessage = this.onBeforeUnload ? this.onBeforeUnload() : undefined;
-      e.returnValue = promptMessage;
+
+      if (promptMessage) {
+        e.returnValue = promptMessage;
+      }
+
       return promptMessage;
@@ -222,3 +231,80 @@ }); // listen to hash changes
 
-export { HashRouter };
+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 {
+  constructor() {
+    _defineProperty(this, "currentRoute", {
+      path: undefined,
+      params: undefined
+    });
+  }
+
+}
+
+class RouterView extends Component {
+  constructor(props) {
+    super(props);
+
+    _defineProperty(this, "router", new HashRouter());
+
+    _defineProperty(this, "setCurrentRoute", currentRoute => {
+      this.setState({
+        currentRoute
+      });
+    });
+
+    this.state = new RouterViewState();
+  }
+
+  componentDidMount() {
+    this.router.listen();
+  }
+
+  render() {
+    if (this.props.routerRef) {
+      this.props.routerRef(this.router);
+    }
+
+    return createElement(RouterContext.Provider, {
+      value: {
+        router: this.router,
+        currentRoute: this.state.currentRoute,
+        setCurrentRoute: this.setCurrentRoute
+      }
+    }, this.props.children);
+  }
+
+}
+
+export { HashRouter, Route, RouterView };
 //# sourceMappingURL=peppermint-router.esm.js.map

package.json

 {
   "name": "peppermint-router",
   "description": "Lightweight hash router for React",
-  "version": "0.0.0",
+  "version": "0.0.1",
   "author": "Alon Bar",
@@ -10,2 +10,3 @@ "license": "MIT",
   "module": "dist/peppermint-router.esm.js",
+  "typings": "dist/index.d.ts",
   "files": [
@@ -18,7 +19,13 @@ "dist",
     "typecheck": "tsc --noEmit",
-    "lint": "eslint \"./{src,test}/**/!(*.d).ts\"",
-    "test": "rimraf .tmp/dist-test && rollup -c rollup.config.test.js -w",
-    "release": "yarn typecheck && yarn lint && rimraf dist && mkdir dist && rollup -c"
+    "lint": "eslint \"./src/**/!(*.d).ts\"",
+    "test": "cd test && yarn start",
+    "release": "yarn typecheck && yarn lint && rollup -c"
   },
-  "dependencies": {},
+  "dependencies": {
+    "@babel/runtime": "^7.5.5"
+  },
+  "peerDependencies": {
+    "react": "^16.8.6",
+    "react-dom": "^16.8.6"
+  },
   "devDependencies": {
@@ -30,4 +37,8 @@ "@babel/core": "7.5.0",
     "@babel/plugin-transform-runtime": "7.5.5",
+    "@babel/preset-react": "7.0.0",
     "@babel/preset-typescript": "7.3.3",
+    "@babel/runtime": "^7.5.5",
     "@types/node": "10.1.4",
+    "@types/react": "16.8.23",
+    "@types/react-dom": "16.8.5",
     "@typescript-eslint/eslint-plugin": "1.11.0",
@@ -38,2 +49,5 @@ "@typescript-eslint/parser": "1.11.0",
     "eslint": "5.16.0",
+    "eslint-plugin-react": "7.14.3",
+    "react": "^16.8.6",
+    "react-dom": "^16.8.6",
     "rimraf": "2.6.3",
@@ -44,5 +58,4 @@ "rollup": "1.17.0",
     "rollup-plugin-node-resolve": "5.2.0",
-    "rollup-plugin-serve": "1.0.1",
     "typescript": "3.5.3"
   }
 }

README.md

@@ -5,2 +5,8 @@ # peppermint-router
 
-## Work in progress...
+```jsx
+<RouterView>
+    <Route path="/" component={HomePage} />
+    <Route path="home" component={HomePage} />
+    <Route path="about" component={AboutPage} />
+</RouterView>
+```

src/hashRouter.ts

@@ -67,2 +67,5 @@ import { IMap } from './types';
     }
+    public get currentRoute(): string {
+        return this._currentRoute;
+    }
 
@@ -75,3 +78,3 @@ //
     private _onBeforeUnload: BeforeUnloadHandler;
-    private currentRoute: string;
+    private _currentRoute: string;
     private readonly routes: IMap<Route> = {};
@@ -102,3 +105,5 @@
             const promptMessage = (this.onBeforeUnload ? this.onBeforeUnload() : undefined);
-            e.returnValue = promptMessage;
+            if (promptMessage) {
+                e.returnValue = promptMessage;
+            }
             return promptMessage;
@@ -130,3 +135,3 @@ });
         // don't re-navigate to the same page
-        if (path === this.currentRoute)
+        if (path === this._currentRoute)
             return;
@@ -144,4 +149,4 @@
                 // restore location hash
-                window.history.replaceState(null, null, this.currentRoute);
-                this.goTo(this.currentRoute);
+                window.history.replaceState(null, null, this._currentRoute);
+                this.goTo(this._currentRoute);
                 return;
@@ -152,3 +157,3 @@ }
         // activate route
-        this.currentRoute = path;
+        this._currentRoute = path;
         if (matchResult) {
@@ -213,3 +218,3 @@ matchResult.route.action(matchResult.params);
     private normalizePath(path: string): string {
-        path =  (path || '');
+        path = (path || '');
         path = removeStart(path, '#', '/');
@@ -216,0 +221,0 @@ path = removeEnd(path, '/');

src/index.ts

 export * from './hashRouter';
+export * from './Route';
+export * from './RouterView';

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

67646

increased by36.51%

Number of package files

17

increased by30.77%

Lines of code

832

increased by48.57%

Number of lines in readme file

12

increased by100%

Worsened metrics

Dependency count

3

increased byInfinity%

Dev dependency count

25

increased by31.58%

Dependency changes

• + Added@babel/runtime@^7.5.5

• + Added@babel/runtime@7.26.0(transitive)

• + Addedjs-tokens@4.0.0(transitive)

• + Addedloose-envify@1.4.0(transitive)

• + Addedobject-assign@4.1.1(transitive)

• + Addedprop-types@15.8.1(transitive)

• + Addedreact@16.14.0(transitive)

• + Addedreact-dom@16.14.0(transitive)

• + Addedreact-is@16.13.1(transitive)

• + Addedregenerator-runtime@0.14.1(transitive)

• + Addedscheduler@0.19.1(transitive)