@solidjs/router 0.10.10 → 0.11.1

package/README.md

@@ -565,13 +565,13 @@ Are used to injecting the optimistic updates while actions are in flight. They e
 
 ```jsx
 type Submission<T, U> = {
-  input: T;
-  result: U;
-  error: any;
-  pending: boolean
-  clear: () => {}
-  retry: () => {}
-}
+  readonly input: T;
+  readonly result?: U;
+  readonly pending: boolean;
+  readonly url: string;
+  clear: () => void;
+  retry: () => void;
+};
 
 const submissions = useSubmissions(action, (input) => filter(input));
 const submission = useSubmission(action, (input) => filter(input));
@@ -721,7 +721,7 @@ This is the main Router component for the browser.
 
 ### `<A>`
 
-Like the `<a>` tag but supports relative paths and active class styling (requires client side JavaScript).
+Like the `<a>` tag but supports automatic apply of base path + relative paths and active class styling (requires client side JavaScript).
 
 The `<A>` tag has an `active` class if its href matches the current location, and `inactive` otherwise. **Note:** By default matching includes locations that are descendents (eg. href `/users` matches locations `/users` and `/users/123`), use the boolean `end` prop to prevent matching these. This is particularly useful for links to the root route `/` which would match everything.
 

package/dist/components.d.ts

@@ -1,5 +1,5 @@
 import type { JSX } from "solid-js";
-import type { Location, Navigator } from "./types";
+import type { Location, Navigator } from "./types.js";
 declare module "solid-js" {
     namespace JSX {
         interface AnchorHTMLAttributes<T> {

package/dist/components.jsx

@@ -1,6 +1,6 @@
 import { createMemo, mergeProps, splitProps } from "solid-js";
-import { useHref, useLocation, useNavigate, useResolvedPath } from "./routing";
-import { normalizePath } from "./utils";
+import { useHref, useLocation, useNavigate, useResolvedPath } from "./routing.js";
+import { normalizePath } from "./utils.js";
 export function A(props) {
     props = mergeProps({ inactiveClass: "inactive", activeClass: "active" }, props);
     const [, rest] = splitProps(props, [
@@ -17,17 +17,17 @@ export function A(props) {
     const isActive = createMemo(() => {
         const to_ = to();
         if (to_ === undefined)
-            return false;
+            return [false, false];
         const path = normalizePath(to_.split(/[?#]/, 1)[0]).toLowerCase();
         const loc = normalizePath(location.pathname).toLowerCase();
-        return props.end ? path === loc : loc.startsWith(path);
+        return [props.end ? path === loc : loc.startsWith(path), path === loc];
     });
     return (<a {...rest} href={href() || props.href} state={JSON.stringify(props.state)} classList={{
             ...(props.class && { [props.class]: true }),
-            [props.inactiveClass]: !isActive(),
-            [props.activeClass]: isActive(),
+            [props.inactiveClass]: !isActive()[0],
+            [props.activeClass]: isActive()[0],
             ...rest.classList
-        }} link aria-current={isActive() ? "page" : undefined}/>);
+        }} link aria-current={isActive()[1] ? "page" : undefined}/>);
 }
 export function Navigate(props) {
     const navigate = useNavigate();

package/dist/data/action.d.ts

@@ -1,5 +1,5 @@
 import { JSX } from "solid-js";
-import { Submission } from "../types";
+import { Submission } from "../types.js";
 export type Action<T extends Array<any>, U> = (T extends [FormData] | [] ? JSX.SerializableAttributeValue : unknown) & ((...vars: T) => Promise<U>) & {
     url: string;
     with<A extends any[], B extends any[]>(this: (this: any, ...args: [...A, ...B]) => Promise<U>, ...args: A): Action<B, U>;

package/dist/data/action.js

@@ -1,8 +1,8 @@
 import { $TRACK, createMemo, createSignal, onCleanup, getOwner } from "solid-js";
 import { isServer } from "solid-js/web";
-import { useRouter } from "../routing";
-import { redirectStatusCodes, mockBase } from "../utils";
-import { cacheKeyOp, hashKey, revalidate } from "./cache";
+import { useRouter } from "../routing.js";
+import { redirectStatusCodes, mockBase } from "../utils.js";
+import { cacheKeyOp, hashKey, revalidate } from "./cache.js";
 export const actions = /* #__PURE__ */ new Map();
 export function useSubmissions(fn, filter) {
     const router = useRouter();

package/dist/data/cache.d.ts

@@ -1,6 +1,5 @@
-import { type Signal } from "solid-js";
 import { type ReconcileOptions } from "solid-js/store";
-type CacheEntry = [number, any, string, Set<Signal<number>>];
+import { CacheEntry } from "../types.js";
 export declare function revalidate(key?: string | string[] | void, force?: boolean): Promise<void>;
 export declare function cacheKeyOp(key: string | string[] | void, fn: (cacheEntry: CacheEntry) => void): void;
 export type CachedFunction<T extends (...args: any) => U | Response, U> = T & {
@@ -10,7 +9,6 @@ export type CachedFunction<T extends (...args: any) => U | Response, U> = T & {
 export declare function cache<T extends (...args: any) => U | Response, U>(fn: T, name: string, options?: ReconcileOptions): CachedFunction<T, U>;
 export declare namespace cache {
     var set: (key: string, value: any) => void;
-    var clear: () => any;
+    var clear: () => void;
 }
 export declare function hashKey<T extends Array<any>>(args: T): string;
-export {};

package/dist/data/cache.js

@@ -1,8 +1,8 @@
-import { createSignal, getOwner, onCleanup, sharedConfig, startTransition } from "solid-js";
+import { createSignal, getListener, getOwner, onCleanup, sharedConfig, startTransition } from "solid-js";
 import { createStore, reconcile } from "solid-js/store";
 import { getRequestEvent, isServer } from "solid-js/web";
-import { useNavigate, getIntent } from "../routing";
-import { redirectStatusCodes } from "../utils";
+import { useNavigate, getIntent } from "../routing.js";
+import { redirectStatusCodes } from "../utils.js";
 const LocationHeader = "Location";
 const PRELOAD_TIMEOUT = 5000;
 const CACHE_TIMEOUT = 180000;
@@ -12,7 +12,7 @@ if (!isServer) {
     setInterval(() => {
         const now = Date.now();
         for (let [k, v] of cacheMap.entries()) {
-            if (!v[3].size && now - v[0] > CACHE_TIMEOUT) {
+            if (!v[3].count && now - v[0] > CACHE_TIMEOUT) {
                 cacheMap.delete(k);
             }
         }
@@ -21,17 +21,17 @@ if (!isServer) {
 function getCache() {
     if (!isServer)
         return cacheMap;
-    const req = getRequestEvent() || sharedConfig.context;
+    const req = getRequestEvent();
     if (!req)
         throw new Error("Cannot find cache context");
-    return req.routerCache || (req.routerCache = new Map());
+    return (req.router || (req.router = {})).cache || (req.router.cache = new Map());
 }
 export function revalidate(key, force = true) {
     return startTransition(() => {
         const now = Date.now();
         cacheKeyOp(key, entry => {
             force && (entry[0] = 0); //force cache miss
-            revalidateSignals(entry[3], now); // retrigger live signals
+            entry[3][1](now); // retrigger live signals
         });
     });
 }
@@ -42,10 +42,6 @@ export function cacheKeyOp(key, fn) {
             fn(cacheMap.get(k));
     }
 }
-function revalidateSignals(set, time) {
-    for (let s of set)
-        s[1](time);
-}
 export function cache(fn, name, options) {
     const [store, setStore] = createStore({});
     // prioritize GET for server functions
@@ -59,16 +55,20 @@ export function cache(fn, name, options) {
         const now = Date.now();
         const key = name + hashKey(args);
         let cached = cache.get(key);
-        let version;
-        if (owner && !isServer) {
-            version = createSignal(now, {
-                equals: (p, v) => v - p < 50 // margin of error
-            });
-            onCleanup(() => cached[3].delete(version));
-            version[0](); // track it;
+        let tracking;
+        if (getListener() && !isServer) {
+            tracking = true;
+            onCleanup(() => cached[3].count--);
         }
-        if (cached && (isServer || intent === "native" || Date.now() - cached[0] < PRELOAD_TIMEOUT)) {
-            version && cached[3].add(version);
+        if (cached &&
+            (isServer ||
+                intent === "native" ||
+                (cached[0] && cached[3].count) ||
+                Date.now() - cached[0] < PRELOAD_TIMEOUT)) {
+            if (tracking) {
+                cached[3].count++;
+                cached[3][0](); // track
+            }
             if (cached[2] === "preload" && intent !== "preload") {
                 cached[0] = now;
             }
@@ -78,9 +78,7 @@ export function cache(fn, name, options) {
                     "then" in cached[1]
                         ? cached[1].then(handleResponse(false), handleResponse(true))
                         : handleResponse(false)(cached[1]);
-                !isServer &&
-                    intent === "navigate" &&
-                    startTransition(() => revalidateSignals(cached[3], cached[0])); // update version
+                !isServer && intent === "navigate" && startTransition(() => cached[3][1](cached[0])); // update version
             }
             return res;
         }
@@ -96,13 +94,16 @@ export function cache(fn, name, options) {
             cached[0] = now;
             cached[1] = res;
             cached[2] = intent;
-            version && cached[3].add(version);
-            if (!isServer && intent === "navigate") {
-                startTransition(() => revalidateSignals(cached[3], cached[0])); // update version
-            }
+            !isServer && intent === "navigate" && startTransition(() => cached[3][1](cached[0])); // update version
+        }
+        else {
+            cache.set(key, (cached = [now, res, intent, createSignal(now)]));
+            cached[3].count = 0;
+        }
+        if (tracking) {
+            cached[3].count++;
+            cached[3][0](); // track
         }
-        else
-            cache.set(key, (cached = [now, res, intent, new Set(version ? [version] : [])]));
         if (intent !== "preload") {
             res =
                 "then" in res
@@ -149,21 +150,15 @@ cache.set = (key, value) => {
     const cache = getCache();
     const now = Date.now();
     let cached = cache.get(key);
-    let version;
-    if (getOwner()) {
-        version = createSignal(now, {
-            equals: (p, v) => v - p < 50 // margin of error
-        });
-        onCleanup(() => cached[3].delete(version));
-    }
     if (cached) {
         cached[0] = now;
         cached[1] = value;
         cached[2] = "preload";
-        version && cached[3].add(version);
     }
-    else
-        cache.set(key, (cached = [now, value, , new Set(version ? [version] : [])]));
+    else {
+        cache.set(key, (cached = [now, value, , createSignal(now)]));
+        cached[3].count = 0;
+    }
 };
 cache.clear = () => getCache().clear();
 function matchKey(key, keys) {

package/dist/data/events.d.ts

@@ -1,2 +1,2 @@
-import type { RouterContext } from "../types";
+import type { RouterContext } from "../types.js";
 export declare function setupNativeEvents(preload?: boolean, explicitLinks?: boolean, actionBase?: string): (router: RouterContext) => void;

package/dist/data/events.js

@@ -1,7 +1,7 @@
 import { delegateEvents } from "solid-js/web";
 import { onCleanup } from "solid-js";
-import { actions } from "./action";
-import { mockBase } from "../utils";
+import { actions } from "./action.js";
+import { mockBase } from "../utils.js";
 export function setupNativeEvents(preload = true, explicitLinks = false, actionBase = "/_server") {
     return (router) => {
         const basePath = router.base.path();

package/dist/data/index.d.ts

@@ -1,4 +1,4 @@
-export { createAsync } from "./createAsync";
-export { action, useSubmission, useSubmissions, useAction, type Action } from "./action";
-export { cache, revalidate, type CachedFunction } from "./cache";
-export { redirect, reload, json } from "./response";
+export { createAsync } from "./createAsync.js";
+export { action, useSubmission, useSubmissions, useAction, type Action } from "./action.js";
+export { cache, revalidate, type CachedFunction } from "./cache.js";
+export { redirect, reload, json } from "./response.js";

package/dist/data/index.js

@@ -1,4 +1,4 @@
-export { createAsync } from "./createAsync";
-export { action, useSubmission, useSubmissions, useAction } from "./action";
-export { cache, revalidate } from "./cache";
-export { redirect, reload, json } from "./response";
+export { createAsync } from "./createAsync.js";
+export { action, useSubmission, useSubmissions, useAction } from "./action.js";
+export { cache, revalidate } from "./cache.js";
+export { redirect, reload, json } from "./response.js";

package/dist/index.d.ts

@@ -1,7 +1,7 @@
-export * from "./routers";
-export * from "./components";
-export * from "./lifecycle";
-export { useHref, useIsRouting, useLocation, useMatch, useNavigate, useParams, useResolvedPath, useSearchParams, useBeforeLeave, } from "./routing";
-export { mergeSearchString as _mergeSearchString } from "./utils";
-export * from "./data";
-export type { Location, LocationChange, NavigateOptions, Navigator, OutputMatch, Params, RouteSectionProps, RouteLoadFunc, RouteLoadFuncArgs, RouteDefinition, RouterIntegration, RouterUtils, SetParams, BeforeLeaveEventArgs } from "./types";
+export * from "./routers/index.js";
+export * from "./components.jsx";
+export * from "./lifecycle.js";
+export { useHref, useIsRouting, useLocation, useMatch, useNavigate, useParams, useResolvedPath, useSearchParams, useBeforeLeave, } from "./routing.js";
+export { mergeSearchString as _mergeSearchString } from "./utils.js";
+export * from "./data/index.js";
+export type { Location, LocationChange, NavigateOptions, Navigator, OutputMatch, Params, RouteSectionProps, RouteLoadFunc, RouteLoadFuncArgs, RouteDefinition, RouterIntegration, RouterUtils, SetParams, BeforeLeaveEventArgs } from "./types.js";

package/dist/index.js

@@ -1,5 +1,5 @@
 import { isServer, getRequestEvent, createComponent as createComponent$1, delegateEvents, spread, mergeProps as mergeProps$1, template } from 'solid-js/web';
-import { getOwner, runWithOwner, createMemo, createContext, onCleanup, useContext, untrack, createSignal, createRenderEffect, on, startTransition, resetErrorBoundaries, createComponent, children, mergeProps, createRoot, Show, sharedConfig, $TRACK, splitProps, createResource } from 'solid-js';
+import { getOwner, runWithOwner, createMemo, createContext, onCleanup, useContext, untrack, createSignal, createRenderEffect, on, startTransition, resetErrorBoundaries, createComponent, children, mergeProps, createRoot, Show, getListener, sharedConfig, $TRACK, splitProps, createResource } from 'solid-js';
 import { createStore, reconcile } from 'solid-js/store';
 
 function createBeforeLeave() {
@@ -36,6 +36,46 @@ function createBeforeLeave() {
   };
 }
 
+// The following supports browser initiated blocking (eg back/forward)
+
+let depth;
+function saveCurrentDepth() {
+  if (!window.history.state || window.history.state._depth == null) {
+    window.history.replaceState({
+      ...window.history.state,
+      _depth: window.history.length - 1
+    }, "");
+  }
+  depth = window.history.state._depth;
+}
+if (!isServer) {
+  saveCurrentDepth();
+}
+function keepDepth(state) {
+  return {
+    ...state,
+    _depth: window.history.state && window.history.state._depth
+  };
+}
+function notifyIfNotBlocked(notify, block) {
+  let ignore = false;
+  return () => {
+    const prevDepth = depth;
+    saveCurrentDepth();
+    const delta = prevDepth == null ? null : depth - prevDepth;
+    if (ignore) {
+      ignore = false;
+      return;
+    }
+    if (delta && block(delta)) {
+      ignore = true;
+      window.history.go(-delta);
+    } else {
+      notify();
+    }
+  };
+}
+
 const hasSchemeRegex = /^(?:[a-z0-9]+:)?\/\//i;
 const trimPathRegex = /^\/+|(\/)\/+$/g;
 const mockBase = "http://sr";
@@ -244,21 +284,21 @@ function createRoutes(routeDef, base = "") {
     component,
     load,
     children,
-    metadata
+    info
   } = routeDef;
   const isLeaf = !children || Array.isArray(children) && !children.length;
   const shared = {
     key: routeDef,
     component,
     load,
-    metadata
+    info
   };
   return asArray(routeDef.path).reduce((acc, path) => {
     for (const originalPath of expandOptionals(path)) {
       const path = joinPaths(base, originalPath);
       let pattern = isLeaf ? path : path.split("/*", 1)[0];
       pattern = pattern.split("/").map(s => {
-        return s.startsWith(':') || s.startsWith('*') ? s : encodeURIComponent(s);
+        return s.startsWith(":") || s.startsWith("*") ? s : encodeURIComponent(s);
       }).join("/");
       acc.push({
         ...shared,
@@ -444,7 +484,7 @@ function createRouterContext(integration, getBranches, options = {}) {
     untrack(() => {
       if (typeof to === "number") {
         if (!to) ; else if (utils.go) {
-          beforeLeave.confirm(to, options) && utils.go(to);
+          utils.go(to);
         } else {
           console.warn("Router integration does not support relative routing");
         }
@@ -471,12 +511,12 @@ function createRouterContext(integration, getBranches, options = {}) {
       if (resolvedTo !== current || nextState !== state()) {
         if (isServer) {
           const e = getRequestEvent();
-          e && (e.response = new Response(null, {
+          e && (e.response = {
             status: 302,
-            headers: {
+            headers: new Headers({
               Location: resolvedTo
-            }
-          }));
+            })
+          });
           setSource({
             value: resolvedTo,
             replace,
@@ -554,7 +594,7 @@ function createRouterContext(integration, getBranches, options = {}) {
   }
   function initFromFlash() {
     const e = getRequestEvent();
-    return e && e.initialSubmission ? [e.initialSubmission] : [];
+    return e && e.router && e.router.submission ? [e.router.submission] : [];
   }
 }
 function createRouteContext(router, parent, outlet, match, params) {
@@ -623,7 +663,7 @@ function Routes(props) {
   const matches = createMemo(() => getRouteMatches(props.branches, props.routerState.location.pathname));
   if (isServer) {
     const e = getRequestEvent();
-    e && (e.routerMatches || (e.routerMatches = [])).push(matches().map(({
+    e && ((e.router || (e.router = {})).matches || (e.router.matches = matches().map(({
       route,
       path,
       params
@@ -632,8 +672,8 @@ function Routes(props) {
       pattern: route.pattern,
       match: path,
       params,
-      metadata: route.metadata
-    })));
+      info: route.info
+    }))));
   }
   const params = createMemoObject(() => {
     const m = matches();
@@ -780,7 +820,7 @@ if (!isServer) {
   setInterval(() => {
     const now = Date.now();
     for (let [k, v] of cacheMap.entries()) {
-      if (!v[3].size && now - v[0] > CACHE_TIMEOUT) {
+      if (!v[3].count && now - v[0] > CACHE_TIMEOUT) {
         cacheMap.delete(k);
       }
     }
@@ -788,29 +828,25 @@ if (!isServer) {
 }
 function getCache() {
   if (!isServer) return cacheMap;
-  const req = getRequestEvent() || sharedConfig.context;
+  const req = getRequestEvent();
   if (!req) throw new Error("Cannot find cache context");
-  return req.routerCache || (req.routerCache = new Map());
+  return (req.router || (req.router = {})).cache || (req.router.cache = new Map());
 }
 function revalidate(key, force = true) {
   return startTransition(() => {
     const now = Date.now();
     cacheKeyOp(key, entry => {
       force && (entry[0] = 0); //force cache miss
-      revalidateSignals(entry[3], now); // retrigger live signals
+      entry[3][1](now); // retrigger live signals
     });
   });
 }
-
 function cacheKeyOp(key, fn) {
   key && !Array.isArray(key) && (key = [key]);
   for (let k of cacheMap.keys()) {
     if (key === undefined || matchKey(k, key)) fn(cacheMap.get(k));
   }
 }
-function revalidateSignals(set, time) {
-  for (let s of set) s[1](time);
-}
 function cache(fn, name, options) {
   const [store, setStore] = createStore({});
   // prioritize GET for server functions
@@ -823,27 +859,24 @@ function cache(fn, name, options) {
     const now = Date.now();
     const key = name + hashKey(args);
     let cached = cache.get(key);
-    let version;
-    if (owner && !isServer) {
-      version = createSignal(now, {
-        equals: (p, v) => v - p < 50 // margin of error
-      });
-
-      onCleanup(() => cached[3].delete(version));
-      version[0](); // track it;
+    let tracking;
+    if (getListener() && !isServer) {
+      tracking = true;
+      onCleanup(() => cached[3].count--);
     }
-
-    if (cached && (isServer || intent === "native" || Date.now() - cached[0] < PRELOAD_TIMEOUT)) {
-      version && cached[3].add(version);
+    if (cached && (isServer || intent === "native" || cached[0] && cached[3].count || Date.now() - cached[0] < PRELOAD_TIMEOUT)) {
+      if (tracking) {
+        cached[3].count++;
+        cached[3][0](); // track
+      }
       if (cached[2] === "preload" && intent !== "preload") {
         cached[0] = now;
       }
       let res = cached[1];
       if (intent !== "preload") {
         res = "then" in cached[1] ? cached[1].then(handleResponse(false), handleResponse(true)) : handleResponse(false)(cached[1]);
-        !isServer && intent === "navigate" && startTransition(() => revalidateSignals(cached[3], cached[0])); // update version
+        !isServer && intent === "navigate" && startTransition(() => cached[3][1](cached[0])); // update version
       }
-
       return res;
     }
     let res = !isServer && sharedConfig.context && sharedConfig.load ? sharedConfig.load(key) // hydrating
@@ -858,11 +891,15 @@ function cache(fn, name, options) {
       cached[0] = now;
       cached[1] = res;
       cached[2] = intent;
-      version && cached[3].add(version);
-      if (!isServer && intent === "navigate") {
-        startTransition(() => revalidateSignals(cached[3], cached[0])); // update version
-      }
-    } else cache.set(key, cached = [now, res, intent, new Set(version ? [version] : [])]);
+      !isServer && intent === "navigate" && startTransition(() => cached[3][1](cached[0])); // update version
+    } else {
+      cache.set(key, cached = [now, res, intent, createSignal(now)]);
+      cached[3].count = 0;
+    }
+    if (tracking) {
+      cached[3].count++;
+      cached[3][0](); // track
+    }
     if (intent !== "preload") {
       res = "then" in res ? res.then(handleResponse(false), handleResponse(true)) : handleResponse(false)(res);
     }
@@ -902,20 +939,14 @@ cache.set = (key, value) => {
   const cache = getCache();
   const now = Date.now();
   let cached = cache.get(key);
-  let version;
-  if (getOwner()) {
-    version = createSignal(now, {
-      equals: (p, v) => v - p < 50 // margin of error
-    });
-
-    onCleanup(() => cached[3].delete(version));
-  }
   if (cached) {
     cached[0] = now;
     cached[1] = value;
     cached[2] = "preload";
-    version && cached[3].add(version);
-  } else cache.set(key, cached = [now, value,, new Set(version ? [version] : [])]);
+  } else {
+    cache.set(key, cached = [now, value,, createSignal(now)]);
+    cached[3].count = 0;
+  }
 };
 cache.clear = () => getCache().clear();
 function matchKey(key, keys) {
@@ -1148,11 +1179,13 @@ function setupNativeEvents(preload = true, explicitLinks = false, actionBase = "
 
 function Router(props) {
   if (isServer) return StaticRouter(props);
+  const getSource = () => ({
+    value: window.location.pathname + window.location.search + window.location.hash,
+    state: window.history.state
+  });
+  const beforeLeave = createBeforeLeave();
   return createRouter({
-    get: () => ({
-      value: window.location.pathname + window.location.search + window.location.hash,
-      state: history.state
-    }),
+    get: getSource,
     set({
       value,
       replace,
@@ -1160,16 +1193,27 @@ function Router(props) {
       state
     }) {
       if (replace) {
-        window.history.replaceState(state, "", value);
+        window.history.replaceState(keepDepth(state), "", value);
       } else {
         window.history.pushState(state, "", value);
       }
       scrollToHash(window.location.hash.slice(1), scroll);
+      saveCurrentDepth();
     },
-    init: notify => bindEvent(window, "popstate", () => notify()),
+    init: notify => bindEvent(window, "popstate", notifyIfNotBlocked(notify, delta => {
+      if (delta && delta < 0) {
+        return !beforeLeave.confirm(delta);
+      } else {
+        const s = getSource();
+        return !beforeLeave.confirm(s.value, {
+          state: s.state
+        });
+      }
+    })),
     create: setupNativeEvents(props.preload, props.explicitLinks, props.actionBase),
     utils: {
-      go: delta => window.history.go(delta)
+      go: delta => window.history.go(delta),
+      beforeLeave
     }
   })(props);
 }
@@ -1186,8 +1230,10 @@ function hashParser(str) {
   return to;
 }
 function HashRouter(props) {
+  const getSource = () => window.location.hash.slice(1);
+  const beforeLeave = createBeforeLeave();
   return createRouter({
-    get: () => window.location.hash.slice(1),
+    get: getSource,
     set({
       value,
       replace,
@@ -1195,20 +1241,22 @@ function HashRouter(props) {
       state
     }) {
       if (replace) {
-        window.history.replaceState(state, "", "#" + value);
+        window.history.replaceState(keepDepth(state), "", "#" + value);
       } else {
         window.location.hash = value;
       }
       const hashIndex = value.indexOf("#");
       const hash = hashIndex >= 0 ? value.slice(hashIndex + 1) : "";
       scrollToHash(hash, scroll);
+      saveCurrentDepth();
     },
-    init: notify => bindEvent(window, "hashchange", () => notify()),
+    init: notify => bindEvent(window, "hashchange", notifyIfNotBlocked(notify, delta => !beforeLeave.confirm(delta && delta < 0 ? delta : getSource()))),
     create: setupNativeEvents(props.preload, props.explicitLinks, props.actionBase),
     utils: {
       go: delta => window.history.go(delta),
       renderPath: path => `#${path}`,
-      parsePath: hashParser
+      parsePath: hashParser,
+      beforeLeave
     }
   })(props);
 }
@@ -1280,10 +1328,10 @@ function A(props) {
   const location = useLocation();
   const isActive = createMemo(() => {
     const to_ = to();
-    if (to_ === undefined) return false;
+    if (to_ === undefined) return [false, false];
     const path = normalizePath(to_.split(/[?#]/, 1)[0]).toLowerCase();
     const loc = normalizePath(location.pathname).toLowerCase();
-    return props.end ? path === loc : loc.startsWith(path);
+    return [props.end ? path === loc : loc.startsWith(path), path === loc];
   });
   return (() => {
     const _el$ = _tmpl$();
@@ -1299,14 +1347,14 @@ function A(props) {
           ...(props.class && {
             [props.class]: true
           }),
-          [props.inactiveClass]: !isActive(),
-          [props.activeClass]: isActive(),
+          [props.inactiveClass]: !isActive()[0],
+          [props.activeClass]: isActive()[0],
           ...rest.classList
         };
       },
       "link": "",
       get ["aria-current"]() {
-        return isActive() ? "page" : undefined;
+        return isActive()[1] ? "page" : undefined;
       }
     }), false, false);
     return _el$;
@@ -1430,4 +1478,4 @@ function json(data, init) {
   return response;
 }
 
-export { A, HashRouter, MemoryRouter, Navigate, Route, Router, StaticRouter, mergeSearchString as _mergeSearchString, action, cache, createAsync, createBeforeLeave, createMemoryHistory, createRouter, json, redirect, reload, revalidate, useAction, useBeforeLeave, useHref, useIsRouting, useLocation, useMatch, useNavigate, useParams, useResolvedPath, useSearchParams, useSubmission, useSubmissions };
+export { A, HashRouter, MemoryRouter, Navigate, Route, Router, StaticRouter, mergeSearchString as _mergeSearchString, action, cache, createAsync, createBeforeLeave, createMemoryHistory, createRouter, json, keepDepth, notifyIfNotBlocked, redirect, reload, revalidate, saveCurrentDepth, useAction, useBeforeLeave, useHref, useIsRouting, useLocation, useMatch, useNavigate, useParams, useResolvedPath, useSearchParams, useSubmission, useSubmissions };

package/dist/index.jsx

@@ -1,6 +1,6 @@
-export * from "./routers";
-export * from "./components";
-export * from "./lifecycle";
-export { useHref, useIsRouting, useLocation, useMatch, useNavigate, useParams, useResolvedPath, useSearchParams, useBeforeLeave, } from "./routing";
-export { mergeSearchString as _mergeSearchString } from "./utils";
-export * from "./data";
+export * from "./routers/index.js";
+export * from "./components.jsx";
+export * from "./lifecycle.js";
+export { useHref, useIsRouting, useLocation, useMatch, useNavigate, useParams, useResolvedPath, useSearchParams, useBeforeLeave, } from "./routing.js";
+export { mergeSearchString as _mergeSearchString } from "./utils.js";
+export * from "./data/index.js";

package/dist/lifecycle.d.ts

@@ -1,2 +1,5 @@
-import { BeforeLeaveLifecycle } from "./types";
+import { BeforeLeaveLifecycle, LocationChange } from "./types.js";
 export declare function createBeforeLeave(): BeforeLeaveLifecycle;
+export declare function saveCurrentDepth(): void;
+export declare function keepDepth(state: any): any;
+export declare function notifyIfNotBlocked(notify: (value?: string | LocationChange) => void, block: (delta: number | null) => boolean): () => void;

package/dist/lifecycle.js

@@ -1,3 +1,4 @@
+import { isServer } from "solid-js/web";
 export function createBeforeLeave() {
     let listeners = new Set();
     function subscribe(listener) {
@@ -30,3 +31,39 @@ export function createBeforeLeave() {
         confirm
     };
 }
+// The following supports browser initiated blocking (eg back/forward)
+let depth;
+export function saveCurrentDepth() {
+    if (!window.history.state || window.history.state._depth == null) {
+        window.history.replaceState({ ...window.history.state, _depth: window.history.length - 1 }, "");
+    }
+    depth = window.history.state._depth;
+}
+if (!isServer) {
+    saveCurrentDepth();
+}
+export function keepDepth(state) {
+    return {
+        ...state,
+        _depth: window.history.state && window.history.state._depth
+    };
+}
+export function notifyIfNotBlocked(notify, block) {
+    let ignore = false;
+    return () => {
+        const prevDepth = depth;
+        saveCurrentDepth();
+        const delta = prevDepth == null ? null : depth - prevDepth;
+        if (ignore) {
+            ignore = false;
+            return;
+        }
+        if (delta && block(delta)) {
+            ignore = true;
+            window.history.go(-delta);
+        }
+        else {
+            notify();
+        }
+    };
+}

package/dist/routers/HashRouter.d.ts

@@ -1,5 +1,5 @@
 import type { JSX } from "solid-js";
-import type { BaseRouterProps } from "./components";
+import type { BaseRouterProps } from "./components.js";
 export declare function hashParser(str: string): string;
 export type HashRouterProps = BaseRouterProps & {
     actionBase?: string;

package/dist/routers/HashRouter.js

@@ -1,5 +1,6 @@
-import { setupNativeEvents } from "../data/events";
-import { createRouter, scrollToHash, bindEvent } from "./createRouter";
+import { setupNativeEvents } from "../data/events.js";
+import { createRouter, scrollToHash, bindEvent } from "./createRouter.js";
+import { createBeforeLeave, keepDepth, notifyIfNotBlocked, saveCurrentDepth } from "../lifecycle.js";
 export function hashParser(str) {
     const to = str.replace(/^.*?#/, "");
     // Hash-only hrefs like `#foo` from plain anchors will come in as `/#foo` whereas a link to
@@ -12,11 +13,13 @@ export function hashParser(str) {
     return to;
 }
 export function HashRouter(props) {
+    const getSource = () => window.location.hash.slice(1);
+    const beforeLeave = createBeforeLeave();
     return createRouter({
-        get: () => window.location.hash.slice(1),
+        get: getSource,
         set({ value, replace, scroll, state }) {
             if (replace) {
-                window.history.replaceState(state, "", "#" + value);
+                window.history.replaceState(keepDepth(state), "", "#" + value);
             }
             else {
                 window.location.hash = value;
@@ -24,13 +27,15 @@ export function HashRouter(props) {
             const hashIndex = value.indexOf("#");
             const hash = hashIndex >= 0 ? value.slice(hashIndex + 1) : "";
             scrollToHash(hash, scroll);
+            saveCurrentDepth();
         },
-        init: notify => bindEvent(window, "hashchange", () => notify()),
+        init: notify => bindEvent(window, "hashchange", notifyIfNotBlocked(notify, delta => !beforeLeave.confirm(delta && delta < 0 ? delta : getSource()))),
         create: setupNativeEvents(props.preload, props.explicitLinks, props.actionBase),
         utils: {
             go: delta => window.history.go(delta),
             renderPath: path => `#${path}`,
-            parsePath: hashParser
+            parsePath: hashParser,
+            beforeLeave
         }
     })(props);
 }

package/dist/routers/MemoryRouter.d.ts

@@ -1,5 +1,5 @@
-import type { LocationChange } from "../types";
-import type { BaseRouterProps } from "./components";
+import type { LocationChange } from "../types.js";
+import type { BaseRouterProps } from "./components.jsx";
 import type { JSX } from "solid-js";
 export type MemoryHistory = {
     get: () => string;

package/dist/routers/MemoryRouter.js

@@ -1,4 +1,4 @@
-import { createRouter, scrollToHash } from "./createRouter";
+import { createRouter, scrollToHash } from "./createRouter.js";
 export function createMemoryHistory() {
     const entries = ["/"];
     let index = 0;

package/dist/routers/Router.d.ts

@@ -1,4 +1,4 @@
-import type { BaseRouterProps } from "./components";
+import type { BaseRouterProps } from "./components.jsx";
 import type { JSX } from "solid-js";
 export type RouterProps = BaseRouterProps & {
     url?: string;

package/dist/routers/Router.js

@@ -1,28 +1,41 @@
 import { isServer } from "solid-js/web";
-import { createRouter, scrollToHash, bindEvent } from "./createRouter";
-import { StaticRouter } from "./StaticRouter";
-import { setupNativeEvents } from "../data/events";
+import { createRouter, scrollToHash, bindEvent } from "./createRouter.js";
+import { StaticRouter } from "./StaticRouter.js";
+import { setupNativeEvents } from "../data/events.js";
+import { createBeforeLeave, keepDepth, notifyIfNotBlocked, saveCurrentDepth } from "../lifecycle.js";
 export function Router(props) {
     if (isServer)
         return StaticRouter(props);
+    const getSource = () => ({
+        value: window.location.pathname + window.location.search + window.location.hash,
+        state: window.history.state
+    });
+    const beforeLeave = createBeforeLeave();
     return createRouter({
-        get: () => ({
-            value: window.location.pathname + window.location.search + window.location.hash,
-            state: history.state
-        }),
+        get: getSource,
         set({ value, replace, scroll, state }) {
             if (replace) {
-                window.history.replaceState(state, "", value);
+                window.history.replaceState(keepDepth(state), "", value);
             }
             else {
                 window.history.pushState(state, "", value);
             }
             scrollToHash(window.location.hash.slice(1), scroll);
+            saveCurrentDepth();
         },
-        init: notify => bindEvent(window, "popstate", () => notify()),
+        init: notify => bindEvent(window, "popstate", notifyIfNotBlocked(notify, delta => {
+            if (delta && delta < 0) {
+                return !beforeLeave.confirm(delta);
+            }
+            else {
+                const s = getSource();
+                return !beforeLeave.confirm(s.value, { state: s.state });
+            }
+        })),
         create: setupNativeEvents(props.preload, props.explicitLinks, props.actionBase),
         utils: {
-            go: delta => window.history.go(delta)
+            go: delta => window.history.go(delta),
+            beforeLeave
         }
     })(props);
 }

package/dist/routers/StaticRouter.d.ts

@@ -1,4 +1,4 @@
-import { type BaseRouterProps } from "./components";
+import { type BaseRouterProps } from "./components.jsx";
 import type { JSX } from "solid-js";
 export type StaticRouterProps = BaseRouterProps & {
     url?: string;

package/dist/routers/StaticRouter.js

@@ -1,5 +1,5 @@
 import { getRequestEvent } from "solid-js/web";
-import { createRouterComponent } from "./components";
+import { createRouterComponent } from "./components.jsx";
 function getPath(url) {
     const u = new URL(url);
     return u.pathname + u.search;

package/dist/routers/components.d.ts

@@ -1,5 +1,5 @@
 import type { Component, JSX } from "solid-js";
-import type { MatchFilters, RouteLoadFunc, RouteDefinition, RouterIntegration, RouteSectionProps } from "../types";
+import type { MatchFilters, RouteLoadFunc, RouteDefinition, RouterIntegration, RouteSectionProps } from "../types.ts";
 export type BaseRouterProps = {
     base?: string;
     /**
@@ -15,6 +15,6 @@ export type RouteProps<S extends string, T = unknown> = {
     load?: RouteLoadFunc<T>;
     matchFilters?: MatchFilters<S>;
     component?: Component<RouteSectionProps<T>>;
-    metadata?: Record<string, any>;
+    info?: Record<string, any>;
 };
 export declare const Route: <S extends string, T = unknown>(props: RouteProps<S, T>) => JSX.Element;

package/dist/routers/components.jsx

@@ -1,8 +1,8 @@
 /*@refresh skip*/
 import { getRequestEvent, isServer } from "solid-js/web";
 import { children, createMemo, createRoot, mergeProps, on, Show } from "solid-js";
-import { createBranches, createRouteContext, createRouterContext, getRouteMatches, RouteContextObj, RouterContextObj } from "../routing";
-import { createMemoObject } from "../utils";
+import { createBranches, createRouteContext, createRouterContext, getRouteMatches, RouteContextObj, RouterContextObj } from "../routing.js";
+import { createMemoObject } from "../utils.js";
 export const createRouterComponent = (router) => (props) => {
     const { base } = props;
     const routeDefs = children(() => props.children);
@@ -18,13 +18,14 @@ function Routes(props) {
     if (isServer) {
         const e = getRequestEvent();
         e &&
-            (e.routerMatches || (e.routerMatches = [])).push(matches().map(({ route, path, params }) => ({
-                path: route.originalPath,
-                pattern: route.pattern,
-                match: path,
-                params,
-                metadata: route.metadata
-            })));
+            ((e.router || (e.router = {})).matches ||
+                (e.router.matches = matches().map(({ route, path, params }) => ({
+                    path: route.originalPath,
+                    pattern: route.pattern,
+                    match: path,
+                    params,
+                    info: route.info
+                }))));
     }
     const params = createMemoObject(() => {
         const m = matches();

package/dist/routers/createRouter.d.ts

@@ -1,10 +1,10 @@
-import type { LocationChange, RouterContext, RouterUtils } from "../types";
+import type { LocationChange, RouterContext, RouterUtils } from "../types.ts";
 export declare function createRouter(config: {
     get: () => string | LocationChange;
     set: (next: LocationChange) => void;
     init?: (notify: (value?: string | LocationChange) => void) => () => void;
     create?: (router: RouterContext) => void;
     utils?: Partial<RouterUtils>;
-}): (props: import("./components").BaseRouterProps) => import("solid-js").JSX.Element;
+}): (props: import("./components.jsx").BaseRouterProps) => import("solid-js").JSX.Element;
 export declare function bindEvent(target: EventTarget, type: string, handler: EventListener): () => void;
 export declare function scrollToHash(hash: string, fallbackTop?: boolean): void;

package/dist/routers/createRouter.js

@@ -1,5 +1,5 @@
 import { createSignal, onCleanup } from "solid-js";
-import { createRouterComponent } from "./components";
+import { createRouterComponent } from "./components.jsx";
 function intercept([value, setValue], get, set) {
     return [get ? () => get(value()) : value, set ? (v) => setValue(set(v)) : setValue];
 }

package/dist/routers/index.d.ts

@@ -1,11 +1,11 @@
-export { Route } from "./components";
-export type { BaseRouterProps, RouteProps } from "./components";
-export { createRouter } from "./createRouter";
-export { Router } from "./Router";
-export type { RouterProps } from "./Router";
-export { HashRouter } from "./HashRouter";
-export type { HashRouterProps } from "./HashRouter";
-export { MemoryRouter, createMemoryHistory } from "./MemoryRouter";
-export type { MemoryRouterProps, MemoryHistory } from "./MemoryRouter";
-export { StaticRouter } from "./StaticRouter";
-export type { StaticRouterProps } from "./StaticRouter";
+export { Route } from "./components.jsx";
+export type { BaseRouterProps, RouteProps } from "./components.jsx";
+export { createRouter } from "./createRouter.js";
+export { Router } from "./Router.js";
+export type { RouterProps } from "./Router.js";
+export { HashRouter } from "./HashRouter.js";
+export type { HashRouterProps } from "./HashRouter.js";
+export { MemoryRouter, createMemoryHistory } from "./MemoryRouter.js";
+export type { MemoryRouterProps, MemoryHistory } from "./MemoryRouter.js";
+export { StaticRouter } from "./StaticRouter.js";
+export type { StaticRouterProps } from "./StaticRouter.js";

package/dist/routers/index.js

@@ -1,6 +1,6 @@
-export { Route } from "./components";
-export { createRouter } from "./createRouter";
-export { Router } from "./Router";
-export { HashRouter } from "./HashRouter";
-export { MemoryRouter, createMemoryHistory } from "./MemoryRouter";
-export { StaticRouter } from "./StaticRouter";
+export { Route } from "./components.jsx";
+export { createRouter } from "./createRouter.js";
+export { Router } from "./Router.js";
+export { HashRouter } from "./HashRouter.js";
+export { MemoryRouter, createMemoryHistory } from "./MemoryRouter.js";
+export { StaticRouter } from "./StaticRouter.js";

package/dist/routing.d.ts

@@ -1,5 +1,5 @@
 import { JSX, Accessor } from "solid-js";
-import type { BeforeLeaveEventArgs, Branch, Intent, Location, MatchFilters, NavigateOptions, Navigator, Params, Route, RouteContext, RouteDefinition, RouteMatch, RouterContext, RouterIntegration, SetParams } from "./types";
+import type { BeforeLeaveEventArgs, Branch, Intent, Location, MatchFilters, NavigateOptions, Navigator, Params, Route, RouteContext, RouteDefinition, RouteMatch, RouterContext, RouterIntegration, SetParams } from "./types.js";
 export declare const RouterContextObj: import("solid-js").Context<RouterContext | undefined>;
 export declare const RouteContextObj: import("solid-js").Context<RouteContext | undefined>;
 export declare const useRouter: () => RouterContext;
@@ -9,7 +9,7 @@ export declare const useHref: (to: () => string | undefined) => Accessor<string
 export declare const useNavigate: () => Navigator;
 export declare const useLocation: <S = unknown>() => Location<S>;
 export declare const useIsRouting: () => () => boolean;
-export declare const useMatch: <S extends string>(path: () => S, matchFilters?: MatchFilters<S> | undefined) => Accessor<import("./types").PathMatch | undefined>;
+export declare const useMatch: <S extends string>(path: () => S, matchFilters?: MatchFilters<S> | undefined) => Accessor<import("./types.js").PathMatch | undefined>;
 export declare const useParams: <T extends Params>() => T;
 export declare const useSearchParams: <T extends Params>() => [Partial<T>, (params: SetParams, options?: Partial<NavigateOptions>) => void];
 export declare const useBeforeLeave: (listener: (e: BeforeLeaveEventArgs) => void) => void;

package/dist/routing.js

@@ -1,7 +1,7 @@
 import { createComponent, createContext, createMemo, createRenderEffect, createSignal, on, onCleanup, untrack, useContext, startTransition, resetErrorBoundaries } from "solid-js";
 import { isServer, getRequestEvent } from "solid-js/web";
-import { createBeforeLeave } from "./lifecycle";
-import { mockBase, createMemoObject, extractSearchParams, invariant, resolvePath, createMatcher, joinPaths, scoreRoute, mergeSearchString, expandOptionals } from "./utils";
+import { createBeforeLeave } from "./lifecycle.js";
+import { mockBase, createMemoObject, extractSearchParams, invariant, resolvePath, createMatcher, joinPaths, scoreRoute, mergeSearchString, expandOptionals } from "./utils.js";
 const MAX_REDIRECTS = 100;
 export const RouterContextObj = createContext();
 export const RouteContextObj = createContext();
@@ -56,21 +56,24 @@ export const useBeforeLeave = (listener) => {
     onCleanup(s);
 };
 export function createRoutes(routeDef, base = "") {
-    const { component, load, children, metadata } = routeDef;
+    const { component, load, children, info } = routeDef;
     const isLeaf = !children || (Array.isArray(children) && !children.length);
     const shared = {
         key: routeDef,
         component,
         load,
-        metadata
+        info
     };
     return asArray(routeDef.path).reduce((acc, path) => {
         for (const originalPath of expandOptionals(path)) {
             const path = joinPaths(base, originalPath);
             let pattern = isLeaf ? path : path.split("/*", 1)[0];
-            pattern = pattern.split("/").map((s) => {
-                return (s.startsWith(':') || s.startsWith('*')) ? s : encodeURIComponent(s);
-            }).join("/");
+            pattern = pattern
+                .split("/")
+                .map((s) => {
+                return s.startsWith(":") || s.startsWith("*") ? s : encodeURIComponent(s);
+            })
+                .join("/");
             acc.push({
                 ...shared,
                 originalPath,
@@ -252,7 +255,7 @@ export function createRouterContext(integration, getBranches, options = {}) {
                     // A delta of 0 means stay at the current location, so it is ignored
                 }
                 else if (utils.go) {
-                    beforeLeave.confirm(to, options) && utils.go(to);
+                    utils.go(to);
                 }
                 else {
                     console.warn("Router integration does not support relative routing");
@@ -276,8 +279,7 @@ export function createRouterContext(integration, getBranches, options = {}) {
             if (resolvedTo !== current || nextState !== state()) {
                 if (isServer) {
                     const e = getRequestEvent();
-                    e &&
-                        (e.response = new Response(null, { status: 302, headers: { Location: resolvedTo } }));
+                    e && (e.response = { status: 302, headers: new Headers({ Location: resolvedTo }) });
                     setSource({ value: resolvedTo, replace, scroll, state: nextState });
                 }
                 else if (beforeLeave.confirm(resolvedTo, options)) {
@@ -347,7 +349,7 @@ export function createRouterContext(integration, getBranches, options = {}) {
     }
     function initFromFlash() {
         const e = getRequestEvent();
-        return e && e.initialSubmission ? [e.initialSubmission] : [];
+        return e && e.router && e.router.submission ? [e.router.submission] : [];
     }
 }
 export function createRouteContext(router, parent, outlet, match, params) {

package/dist/types.d.ts

@@ -1,10 +1,16 @@
 import type { Component, JSX, Signal } from "solid-js";
 declare module "solid-js/web" {
     interface RequestEvent {
-        response?: Response;
-        routerMatches?: OutputMatch[][];
-        routerCache?: Map<any, any>;
-        initialSubmission?: Submission<any, any>;
+        response?: {
+            status?: number;
+            statusText?: string;
+            headers: Headers;
+        };
+        router?: {
+            matches?: OutputMatch[];
+            cache?: Map<string, CacheEntry>;
+            submission?: Submission<any, any>;
+        };
         serverOnly?: boolean;
     }
 }
@@ -61,7 +67,7 @@ export type RouteDefinition<S extends string | string[] = any, T = unknown> = {
     load?: RouteLoadFunc<T>;
     children?: RouteDefinition | RouteDefinition[];
     component?: Component<RouteSectionProps<T>>;
-    metadata?: Record<string, any>;
+    info?: Record<string, any>;
 };
 export type MatchFilter = readonly string[] | RegExp | ((s: string) => boolean);
 export type PathParams<P extends string | readonly string[]> = P extends `${infer Head}/${infer Tail}` ? [...PathParams<Head>, ...PathParams<Tail>] : P extends `:${infer S}?` ? [S] : P extends `:${infer S}` ? [S] : P extends `*${infer S}` ? [S] : [];
@@ -80,7 +86,7 @@ export interface OutputMatch {
     pattern: string;
     match: string;
     params: Params;
-    metadata?: Record<string, any>;
+    info?: Record<string, any>;
 }
 export interface Route {
     key: unknown;
@@ -90,7 +96,7 @@ export interface Route {
     load?: RouteLoadFunc;
     matcher: (location: string) => PathMatch | null;
     matchFilters?: MatchFilters;
-    metadata?: Record<string, any>;
+    info?: Record<string, any>;
 }
 export interface Branch {
     routes: Route[];
@@ -151,3 +157,6 @@ export type Submission<T, U> = {
 export interface MaybePreloadableComponent extends Component {
     preload?: () => void;
 }
+export type CacheEntry = [number, any, Intent | undefined, Signal<number> & {
+    count: number;
+}];

package/dist/utils.d.ts

@@ -1,4 +1,4 @@
-import type { MatchFilters, Params, PathMatch, Route, SetParams } from "./types";
+import type { MatchFilters, Params, PathMatch, Route, SetParams } from "./types.ts";
 export declare const mockBase = "http://sr";
 export declare const redirectStatusCodes: Set<number>;
 export declare function normalizePath(path: string, omitSlash?: boolean): string;

package/package.json

@@ -6,7 +6,7 @@
     "Ryan Turnquist"
   ],
   "license": "MIT",
-  "version": "0.10.10",
+  "version": "0.11.1",
   "homepage": "https://github.com/solidjs/solid-router#readme",
   "repository": {
     "type": "git",
@@ -29,34 +29,31 @@
   ],
   "sideEffects": false,
   "devDependencies": {
-    "@babel/core": "^7.18.13",
-    "@babel/preset-typescript": "^7.18.6",
-    "@rollup/plugin-babel": "6.0.3",
-    "@rollup/plugin-node-resolve": "15.0.1",
-    "@rollup/plugin-terser": "0.2.0",
-    "@types/jest": "^29.0.0",
-    "@types/node": "^20.9.0",
-    "babel-jest": "^29.0.1",
+    "@babel/core": "^7.23.9",
+    "@babel/preset-typescript": "^7.23.3",
+    "@changesets/cli": "^2.27.1",
+    "@rollup/plugin-babel": "6.0.4",
+    "@rollup/plugin-node-resolve": "15.2.3",
+    "@rollup/plugin-terser": "0.4.4",
+    "@types/jest": "^29.5.11",
+    "@types/node": "^20.11.14",
     "babel-preset-solid": "^1.8.6",
-    "jest": "^29.0.1",
-    "jest-environment-jsdom": "^29.2.1",
-    "prettier": "^2.7.1",
-    "rollup": "^3.7.5",
-    "solid-jest": "^0.2.0",
+    "jsdom": "^24.0.0",
+    "prettier": "^2.7.0",
+    "rollup": "^4.9.6",
     "solid-js": "^1.8.7",
-    "typescript": "^5.2.2"
+    "typescript": "^5.3.3",
+    "vite": "^5.0.12",
+    "vite-plugin-solid": "^2.9.1",
+    "vitest": "^1.2.2"
   },
   "peerDependencies": {
     "solid-js": "^1.8.6"
   },
-  "jest": {
-    "preset": "solid-jest/preset/browser"
-  },
   "scripts": {
     "build": "tsc && rollup -c",
-    "test": "jest && npm run test:types",
-    "test:watch": "jest --watch",
-    "test:coverage": "jest --coverage && npm run test:types",
+    "test": "vitest run && npm run test:types",
+    "test:watch": "vitest",
     "test:types": "tsc --project tsconfig.test.json",
     "pretty": "prettier --write \"{src,test}/**/*.{ts,tsx}\""
   }