@solidjs/router 0.10.9 → 0.11.0

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 } 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();
@@ -80,7 +80,7 @@ function toAction(fn, url) {
         const newFn = function (...passedArgs) {
             return fn.call(this, ...args, ...passedArgs);
         };
-        const uri = new URL(url, "http://sar");
+        const uri = new URL(url, mockBase);
         uri.searchParams.set("args", hashKey(args));
         return toAction(newFn, (uri.origin === "https://action" ? uri.origin : "") + uri.pathname + uri.search);
     };

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,12 +42,11 @@ 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
+    if (fn.GET)
+        fn = fn.GET;
     const cachedFn = ((...args) => {
         const cache = getCache();
         const intent = getIntent();
@@ -56,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;
             }
@@ -75,7 +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;
         }
@@ -91,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
@@ -106,22 +112,26 @@ export function cache(fn, name, options) {
         }
         return res;
         function handleResponse(error) {
-            return (v) => {
-                if (v instanceof Response && redirectStatusCodes.has(v.status)) {
-                    if (navigate) {
-                        startTransition(() => {
-                            let url = v.headers.get(LocationHeader);
-                            if (url && url.startsWith("/")) {
-                                navigate(url, {
-                                    replace: true
-                                });
-                            }
-                            else if (!isServer && url) {
-                                window.location.href = url;
-                            }
-                        });
+            return async (v) => {
+                if (v instanceof Response) {
+                    if (redirectStatusCodes.has(v.status)) {
+                        if (navigate) {
+                            startTransition(() => {
+                                let url = v.headers.get(LocationHeader);
+                                if (url && url.startsWith("/")) {
+                                    navigate(url, {
+                                        replace: true
+                                    });
+                                }
+                                else if (!isServer && url) {
+                                    window.location.href = url;
+                                }
+                            });
+                        }
+                        return;
                     }
-                    return;
+                    if (v.customBody)
+                        v = await v.customBody();
                 }
                 if (error)
                     throw v;
@@ -140,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,6 +1,7 @@
 import { delegateEvents } from "solid-js/web";
 import { onCleanup } from "solid-js";
-import { actions } from "./action";
+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();
@@ -20,7 +21,7 @@ export function setupNativeEvents(preload = true, explicitLinks = false, actionB
             const a = evt
                 .composedPath()
                 .find(el => el instanceof Node && el.nodeName.toUpperCase() === "A");
-            if (!a || (explicitLinks && !a.getAttribute("link")))
+            if (!a || (explicitLinks && !a.hasAttribute("link")))
                 return;
             const svg = isSvg(a);
             const href = svg ? a.href.baseVal : a.href;
@@ -83,12 +84,13 @@ export function setupNativeEvents(preload = true, explicitLinks = false, actionB
         }
         function handleFormSubmit(evt) {
             let actionRef = evt.submitter && evt.submitter.hasAttribute("formaction")
-                ? evt.submitter.formAction
-                : evt.target.action;
+                ? evt.submitter.getAttribute("formaction")
+                : evt.target.getAttribute("action");
             if (!actionRef)
                 return;
             if (!actionRef.startsWith("https://action/")) {
-                const url = new URL(actionRef);
+                // normalize server actions
+                const url = new URL(actionRef, mockBase);
                 actionRef = router.parsePath(url.pathname + url.search);
                 if (!actionRef.startsWith(actionBase))
                     return;

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 } 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 } 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/data/response.d.ts

@@ -1,5 +1,6 @@
 export type RouterResponseInit = ResponseInit & {
     revalidate?: string | string[];
 };
-export declare function redirect(url: string, init?: number | RouterResponseInit): Response;
-export declare function reload(init: RouterResponseInit): Response;
+export declare function redirect(url: string, init?: number | RouterResponseInit): never;
+export declare function reload(init: RouterResponseInit): never;
+export declare function json<T>(data: T, init?: Omit<ResponseInit, "body">): T;

package/dist/data/response.js

@@ -23,6 +23,18 @@ export function reload(init) {
     const { revalidate, ...responseInit } = init;
     return new Response(null, {
         ...responseInit,
-        ...(revalidate ? { headers: new Headers(responseInit.headers).set("X-Revalidate", revalidate.toString()) } : {})
+        ...(revalidate
+            ? { headers: new Headers(responseInit.headers).set("X-Revalidate", revalidate.toString()) }
+            : {})
     });
 }
+export function json(data, init) {
+    const headers = new Headers((init || {}).headers);
+    headers.set("Content-Type", "application/json");
+    const response = new Response(JSON.stringify(data), {
+        ...init,
+        headers
+    });
+    response.customBody = () => data;
+    return response;
+}

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";