Add utils entrypoint and new InvariantRoute type that doesn't have React dependency (#36)

* Add invariant route that can be imported without react

* Add flowtypes for new entrypoint

* Fix missing type and exporting of types

* Remove unneeded exports in index.js.flow

* Remove isRedirect field on route

* Fix merge confict not renaming method

Author: JakeLane

.flowconfig

@@ -1,6 +1,7 @@
 [ignore]
 
 [include]
+<PROJECT_ROOT>/src/*.flow
 
 [libs]
 

package.json

@@ -45,8 +45,8 @@
     "build:cjs": "babel src --out-dir build/cjs --extensions \".ts,.tsx\" --source-maps inline --ignore src/__tests__ --presets @babel/env",
     "build:clean": "rm -rf ./build",
     "build:esm": "babel src --out-dir build/esm --extensions \".ts,.tsx\" --source-maps inline --ignore src/__tests__",
-    "build:types-cjs": "tsc --emitDeclarationOnly --project tsconfig.build.json --outDir build/cjs && cp src/index.js.flow build/cjs",
-    "build:types-esm": "tsc --emitDeclarationOnly --project tsconfig.build.json --outDir build/esm && cp src/index.js.flow build/esm",
+    "build:types-cjs": "tsc --emitDeclarationOnly --project tsconfig.build.json --outDir build/cjs && cp src/*.flow build/cjs",
+    "build:types-esm": "tsc --emitDeclarationOnly --project tsconfig.build.json --outDir build/esm && cp src/*.flow build/esm",
     "docs": "npx docsify-cli serve docs",
     "lint": "eslint --ext .ts,.tsx,.js src/",
     "lint:deps": "madge -c --extensions ts,tsx src",

src/common/types.ts

@@ -44,6 +44,11 @@ export type Query = {
   [key: string]: string;
 };
 
+export type MatchedInvariantRoute = {
+  route: InvariantRoute;
+  match: Match;
+};
+
 export type MatchedRoute = {
   route: Route;
   match: Match;
@@ -106,25 +111,43 @@ export type RouterContext = {
   query: Query;
 };
 
-export type Route = {
+/**
+ * Invariant route
+ *
+ * Base type for route, which doesn't contain implementation details
+ */
+export type InvariantRoute = {
   path: string;
   exact?: boolean;
 
-  /** The component to render on match, typed explicitly */
-  component: ComponentType<RouteContext>;
-
-  /** If present, must return true to include the route. */
-  enabled?: () => boolean;
-
-  /** Signals that this is a redirect route, we need to handle these in a special way. */
-  isRedirect?: boolean;
-
   /** Used to prevent transitions between app groups */
   group?: string;
 
   /** Unique name for the route */
   name: string;
 
+  /**
+   * Query string matching. Each query param must match for the route to match.
+   *
+   * A query param can take the following shapes:
+   *  * query name only: 'foo' - matches if query name 'foo' is present
+   *  * query name matching value: 'foo=bar' - matches if query name 'foo' equals
+   *    'bar' exactly
+   *  * query name matching regex: 'foo=(bar.+) - matches if query name 'foo' equals
+   *    regex '^(bar.+)$'. Note you must escape backslashes and wrap regex in parentheses.
+   *  * query name NOT matching value: 'foo!=bar' - matches if query name 'foo' does
+   *    not equal bar OR if query name 'foo' does not exist at all
+   */
+  query?: string[];
+};
+
+export type Route = InvariantRoute & {
+  /** The component to render on match, typed explicitly */
+  component: ComponentType<RouteContext>;
+
+  /** If present, must return true to include the route. */
+  enabled?: () => boolean;
+
   /**
    * Triggered before leaving the route, can trigger full page reload if returns (or resolves) false.
    * Defaults to true.
@@ -134,6 +157,7 @@ export type Route = {
     nextRouteMatch: MatchedRoute,
     props: any
   ) => boolean | Promise<boolean>;
+
   /**
    * Triggered before entering the route, can trigger full page reload if returns (or resolves) false.
    * Defaults to true.
@@ -143,19 +167,7 @@ export type Route = {
     nextRouteMatch: MatchedRoute,
     props: any
   ) => boolean | Promise<boolean>;
-  /**
-   * Query string matching. Each query param must match for the route to match.
-   *
-   * A query param can take the following shapes:
-   *  * query name only: 'foo' - matches if query name 'foo' is present
-   *  * query name matching value: 'foo=bar' - matches if query name 'foo' equals
-   *    'bar' exactly
-   *  * query name matching regex: 'foo=(bar.+) - matches if query name 'foo' equals
-   *    regex '^(bar.+)$'. Note you must escape backslashes and wrap regex in parentheses.
-   *  * query name NOT matching value: 'foo!=bar' - matches if query name 'foo' does
-   *    not equal bar OR if query name 'foo' does not exist at all
-   */
-  query?: string[];
+
   /**
    * The resources for the route
    */
@@ -164,6 +176,7 @@ export type Route = {
 
 export type HistoryAction = 'PUSH' | 'REPLACE' | 'POP' | '';
 
+export type InvariantRoutes = InvariantRoute[];
 export type Routes = Route[];
 
 export type NavigationType = 'container' | 'product';

src/common/utils/index.ts

@@ -1,4 +1,4 @@
-export { default as matchRoute } from './match-route';
+export { default as matchRoute, matchInvariantRoute } from './match-route';
 export { default as generatePath } from './generate-path';
 export { createLegacyHistory } from './history';
 export { isServerEnvironment } from './is-server-environment';

src/common/utils/match-route/index.ts

@@ -1,6 +1,14 @@
 import { qs } from 'url-parse';
 
-import { Match, MatchedRoute, MatchParams, Query, Routes } from '../../types';
+import {
+  Match,
+  InvariantRoutes,
+  MatchedRoute,
+  MatchParams,
+  MatchedInvariantRoute,
+  Query,
+  Routes,
+} from '../../types';
 
 import matchPath from './matchPath';
 
@@ -86,11 +94,11 @@ const matchQuery = (
  *
  * Note: This does not support nested routes at this stage.
  */
-export default (
-  routes: Routes,
+const matchRoute = <T extends Routes | InvariantRoutes>(
+  routes: T,
   pathname: string,
   queryParams: MatchParams
-): MatchedRoute | null => {
+): (T extends Routes ? MatchedRoute : MatchedInvariantRoute) | null => {
   const queryParamObject =
     typeof queryParams === 'string'
       ? (qs.parse(queryParams) as Query)
@@ -118,3 +126,15 @@ export default (
 
   return matchedRoute;
 };
+
+export const matchInvariantRoute = (
+  routes: InvariantRoutes,
+  pathname: string,
+  queryParams: MatchParams
+): MatchedInvariantRoute | null => matchRoute(routes, pathname, queryParams);
+
+export default (
+  routes: Routes,
+  pathname: string,
+  queryParams: MatchParams
+): MatchedRoute | null => matchRoute(routes, pathname, queryParams);