@solidjs/router 0.7.0 → 0.8.0

package/README.md

@@ -18,6 +18,7 @@ It supports all of Solid's SSR methods and has Solid's transitions baked in, so
 - [Data Functions](#data-functions)
 - [Nested Routes](#nested-routes)
 - [Hash Mode Router](#hash-mode-router)
+- [Memory Mode Router](#memory-mode-router)
 - [Config Based Routing](#config-based-routing)
 - [Router Primitives](#router-primitives)
   - [useParams](#useparams)
@@ -419,6 +420,16 @@ import { Router, hashIntegration } from '@solidjs/router'
 <Router source={hashIntegration()}><App /></Router>
 ```
 
+## Memory Mode Router
+
+You can also use memory mode router for testing purpose.
+
+```jsx
+import { Router, memoryIntegration } from '@solidjs/router'
+
+<Router source={memoryIntegration()}><App /></Router>
+```
+
 ## Config Based Routing
 
 You don't have to use JSX to set up your routes; you can pass an object directly with `useRoutes`:
@@ -533,7 +544,7 @@ const [searchParams, setSearchParams] = useSearchParams();
 return (
   <div>
     <span>Page: {searchParams.page}</span>
-    <button onClick={() => setSearchParams({ page: searchParams.page + 1 })}>Next Page</button>
+    <button onClick={() => setSearchParams({ page: (parseInt(searchParams.page) || 0) + 1 })}>Next Page</button>
   </div>
 );
 ```

package/dist/index.js

@@ -24,6 +24,49 @@ function scrollToHash(hash, fallbackTop) {
     window.scrollTo(0, 0);
   }
 }
+function createMemoryHistory() {
+  const entries = ["/"];
+  let index = 0;
+  const listeners = [];
+  const go = n => {
+    // https://github.com/remix-run/react-router/blob/682810ca929d0e3c64a76f8d6e465196b7a2ac58/packages/router/history.ts#L245
+    index = Math.max(0, Math.min(index + n, entries.length - 1));
+    const value = entries[index];
+    listeners.forEach(listener => listener(value));
+  };
+  return {
+    get: () => entries[index],
+    set: ({
+      value,
+      scroll,
+      replace
+    }) => {
+      if (replace) {
+        entries[index] = value;
+      } else {
+        entries.splice(index + 1, entries.length - index, value);
+        index++;
+      }
+      if (scroll) {
+        scrollToHash(value.split("#")[1] || "", true);
+      }
+    },
+    back: () => {
+      go(-1);
+    },
+    forward: () => {
+      go(1);
+    },
+    go,
+    listen: listener => {
+      listeners.push(listener);
+      return () => {
+        const index = listeners.indexOf(listener);
+        listeners.splice(index, 1);
+      };
+    }
+  };
+}
 function createIntegration(get, set, init, utils) {
   let ignore = false;
   const wrap = value => typeof value === "string" ? {
@@ -115,6 +158,12 @@ function hashIntegration() {
     }
   });
 }
+function memoryIntegration() {
+  const memoryHistory = createMemoryHistory();
+  return createIntegration(memoryHistory.get, memoryHistory.set, memoryHistory.listen, {
+    go: memoryHistory.go
+  });
+}
 
 function createBeforeLeave() {
   let listeners = new Set();
@@ -148,9 +197,9 @@ function createBeforeLeave() {
 }
 
 const hasSchemeRegex = /^(?:[a-z0-9]+:)?\/\//i;
-const trimPathRegex = /^\/+|\/+$/g;
+const trimPathRegex = /^\/+|(\/)\/+$/g;
 function normalizePath(path, omitSlash = false) {
-  const s = path.replace(trimPathRegex, "");
+  const s = path.replace(trimPathRegex, "$1");
   return s ? omitSlash || /^[?#]/.test(s) ? s : "/" + s : "";
 }
 function resolvePath(base, path, from) {
@@ -203,10 +252,11 @@ function createMatcher(path, partial, matchFilters) {
     for (let i = 0; i < len; i++) {
       const segment = segments[i];
       const locSegment = locSegments[i];
-      const key = segment[0] === ":" ? segment.slice(1) : segment;
-      if (segment[0] === ":" && matchSegment(locSegment, matchFilter(key))) {
+      const dynamic = segment[0] === ":";
+      const key = dynamic ? segment.slice(1) : segment;
+      if (dynamic && matchSegment(locSegment, matchFilter(key))) {
         match.params[key] = locSegment;
-      } else if (!matchSegment(locSegment, segment)) {
+      } else if (dynamic || !matchSegment(locSegment, segment)) {
         return null;
       }
       match.path += `/${locSegment}`;
@@ -882,4 +932,4 @@ function Navigate(props) {
   return null;
 }
 
-export { A, A as Link, A as NavLink, Navigate, Outlet, Route, Router, Routes, mergeSearchString as _mergeSearchString, createBeforeLeave, createIntegration, hashIntegration, normalizeIntegration, pathIntegration, staticIntegration, useBeforeLeave, useHref, useIsRouting, useLocation, useMatch, useNavigate, useParams, useResolvedPath, useRouteData, useRoutes, useSearchParams };
+export { A, A as Link, A as NavLink, Navigate, Outlet, Route, Router, Routes, mergeSearchString as _mergeSearchString, createBeforeLeave, createIntegration, createMemoryHistory, hashIntegration, memoryIntegration, normalizeIntegration, pathIntegration, staticIntegration, useBeforeLeave, useHref, useIsRouting, useLocation, useMatch, useNavigate, useParams, useResolvedPath, useRouteData, useRoutes, useSearchParams };

package/dist/integration.d.ts

@@ -1,6 +1,15 @@
 import type { LocationChange, LocationChangeSignal, RouterIntegration, RouterUtils } from "./types";
+export declare function createMemoryHistory(): {
+    get: () => string;
+    set: ({ value, scroll, replace }: LocationChange) => void;
+    back: () => void;
+    forward: () => void;
+    go: (n: number) => void;
+    listen: (listener: (value: string) => void) => () => void;
+};
 export declare function createIntegration(get: () => string | LocationChange, set: (next: LocationChange) => void, init?: (notify: (value?: string | LocationChange) => void) => () => void, utils?: Partial<RouterUtils>): RouterIntegration;
 export declare function normalizeIntegration(integration: RouterIntegration | LocationChangeSignal | undefined): RouterIntegration;
 export declare function staticIntegration(obj: LocationChange): RouterIntegration;
 export declare function pathIntegration(): RouterIntegration;
 export declare function hashIntegration(): RouterIntegration;
+export declare function memoryIntegration(): RouterIntegration;

package/dist/integration.js

@@ -24,6 +24,46 @@ function scrollToHash(hash, fallbackTop) {
         window.scrollTo(0, 0);
     }
 }
+export function createMemoryHistory() {
+    const entries = ["/"];
+    let index = 0;
+    const listeners = [];
+    const go = (n) => {
+        // https://github.com/remix-run/react-router/blob/682810ca929d0e3c64a76f8d6e465196b7a2ac58/packages/router/history.ts#L245
+        index = Math.max(0, Math.min(index + n, entries.length - 1));
+        const value = entries[index];
+        listeners.forEach(listener => listener(value));
+    };
+    return {
+        get: () => entries[index],
+        set: ({ value, scroll, replace }) => {
+            if (replace) {
+                entries[index] = value;
+            }
+            else {
+                entries.splice(index + 1, entries.length - index, value);
+                index++;
+            }
+            if (scroll) {
+                scrollToHash(value.split("#")[1] || "", true);
+            }
+        },
+        back: () => {
+            go(-1);
+        },
+        forward: () => {
+            go(1);
+        },
+        go,
+        listen: (listener) => {
+            listeners.push(listener);
+            return () => {
+                const index = listeners.indexOf(listener);
+                listeners.splice(index, 1);
+            };
+        }
+    };
+}
 export function createIntegration(get, set, init, utils) {
     let ignore = false;
     const wrap = (value) => (typeof value === "string" ? { value } : value);
@@ -103,3 +143,9 @@ export function hashIntegration() {
         }
     });
 }
+export function memoryIntegration() {
+    const memoryHistory = createMemoryHistory();
+    return createIntegration(memoryHistory.get, memoryHistory.set, memoryHistory.listen, {
+        go: memoryHistory.go
+    });
+}

package/dist/utils.js

@@ -1,8 +1,8 @@
 import { createMemo, getOwner, runWithOwner } from "solid-js";
 const hasSchemeRegex = /^(?:[a-z0-9]+:)?\/\//i;
-const trimPathRegex = /^\/+|\/+$/g;
+const trimPathRegex = /^\/+|(\/)\/+$/g;
 export function normalizePath(path, omitSlash = false) {
-    const s = path.replace(trimPathRegex, "");
+    const s = path.replace(trimPathRegex, "$1");
     return s ? (omitSlash || /^[?#]/.test(s) ? s : "/" + s) : "";
 }
 export function resolvePath(base, path, from) {
@@ -57,11 +57,12 @@ export function createMatcher(path, partial, matchFilters) {
         for (let i = 0; i < len; i++) {
             const segment = segments[i];
             const locSegment = locSegments[i];
-            const key = segment[0] === ":" ? segment.slice(1) : segment;
-            if (segment[0] === ":" && matchSegment(locSegment, matchFilter(key))) {
+            const dynamic = segment[0] === ":";
+            const key = dynamic ? segment.slice(1) : segment;
+            if (dynamic && matchSegment(locSegment, matchFilter(key))) {
                 match.params[key] = locSegment;
             }
-            else if (!matchSegment(locSegment, segment)) {
+            else if (dynamic || !matchSegment(locSegment, segment)) {
                 return null;
             }
             match.path += `/${locSegment}`;

package/package.json

@@ -6,7 +6,7 @@
     "Ryan Turnquist"
   ],
   "license": "MIT",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "homepage": "https://github.com/solidjs/solid-router#readme",
   "repository": {
     "type": "git",