@kasperrt/smolter 0.2.0 → 0.3.1

package/dist/core/resources.js

@@ -0,0 +1,345 @@
+import { safeWrapAsync } from "./errors.js";
+//#region .generated/core/resources.ts
+var IDLE_ROUTE_STATE = {
+	actionData: null,
+	actionError: "",
+	actionState: "idle",
+	loaderData: null,
+	loaderError: "",
+	loaderInitialized: false,
+	loaderState: "idle",
+	navigationState: "idle",
+	unexpectedError: false
+};
+var ResourceRouter = class {
+	#cleanupTimers = /* @__PURE__ */ new Map();
+	#controllers = /* @__PURE__ */ new Map();
+	#inFlightLoads = /* @__PURE__ */ new Map();
+	#listeners = /* @__PURE__ */ new Map();
+	#persistentRoutes = /* @__PURE__ */ new Set();
+	#routes;
+	#states = /* @__PURE__ */ new Map();
+	constructor(routes) {
+		this.#routes = routes;
+	}
+	dispose() {
+		for (const controller of this.#controllers.values()) controller.abort();
+		this.#controllers.clear();
+		for (const timer of this.#cleanupTimers.values()) clearTimeout(timer);
+		this.#cleanupTimers.clear();
+		this.#inFlightLoads.clear();
+		this.#listeners.clear();
+		this.#persistentRoutes.clear();
+	}
+	getRoute(routeId) {
+		return this.#routes.get(routeId) ?? null;
+	}
+	getSnapshot(routeId, params) {
+		return this.#states.get(createRouteKey(routeId, params)) ?? IDLE_ROUTE_STATE;
+	}
+	hydrateRoute(routeId, data, params = {}) {
+		const routeKey = createRouteKey(routeId, params);
+		const currentState = this.#states.get(routeKey) ?? IDLE_ROUTE_STATE;
+		this.#setState(routeKey, {
+			...currentState,
+			loaderData: data,
+			loaderError: "",
+			loaderInitialized: true,
+			loaderState: "idle",
+			navigationState: currentState.actionState === "submitting" ? "submitting" : "idle",
+			unexpectedError: false
+		});
+	}
+	persist(routeId, params = {}) {
+		const routeKey = createRouteKey(routeId, params);
+		this.#persistentRoutes.add(routeKey);
+		const cleanupTimer = this.#cleanupTimers.get(routeKey);
+		if (!cleanupTimer) return;
+		clearTimeout(cleanupTimer);
+		this.#cleanupTimers.delete(routeKey);
+	}
+	disposeRoute(routeId, params = {}) {
+		this.#disposeRouteKey(createRouteKey(routeId, params));
+	}
+	#disposeRouteKey(routeKey) {
+		this.#persistentRoutes.delete(routeKey);
+		const cleanupTimer = this.#cleanupTimers.get(routeKey);
+		if (cleanupTimer) clearTimeout(cleanupTimer);
+		this.#cleanupTimers.delete(routeKey);
+		this.#controllers.get(routeKey)?.abort();
+		this.#controllers.get(`${routeKey}:action`)?.abort();
+		this.#controllers.delete(routeKey);
+		this.#controllers.delete(`${routeKey}:action`);
+		this.#inFlightLoads.delete(routeKey);
+		this.#states.delete(routeKey);
+		this.#notify(routeKey);
+	}
+	load(routeId, params = {}, force = false) {
+		const routeKey = createRouteKey(routeId, params);
+		const route = this.#routes.get(routeId);
+		if (!route?.loader) return Promise.resolve({
+			data: null,
+			error: "Route loader not found."
+		});
+		const currentState = this.#states.get(routeKey);
+		if (!force && currentState?.loaderInitialized) return Promise.resolve({
+			data: currentState?.loaderData,
+			error: currentState?.loaderError ?? ""
+		});
+		const currentLoad = this.#inFlightLoads.get(routeKey);
+		if (force && currentLoad) {
+			this.#controllers.get(routeKey)?.abort();
+			this.#inFlightLoads.delete(routeKey);
+		}
+		if (!force && currentLoad) return currentLoad;
+		const controller = this.#replaceController(routeKey);
+		this.#setState(routeKey, {
+			...currentState ?? IDLE_ROUTE_STATE,
+			loaderError: "",
+			loaderState: "loading",
+			navigationState: currentState?.actionState === "submitting" ? "submitting" : "loading",
+			unexpectedError: false
+		});
+		const load = this.#runLoader(route, routeKey, params, controller);
+		this.#inFlightLoads.set(routeKey, load);
+		return load;
+	}
+	subscribe(routeId, params, listener) {
+		const routeKey = createRouteKey(routeId, params);
+		const cleanupTimer = this.#cleanupTimers.get(routeKey);
+		if (cleanupTimer) {
+			clearTimeout(cleanupTimer);
+			this.#cleanupTimers.delete(routeKey);
+		}
+		const listeners = this.#listeners.get(routeKey) ?? /* @__PURE__ */ new Set();
+		listeners.add(listener);
+		this.#listeners.set(routeKey, listeners);
+		return () => {
+			if (!listeners.delete(listener) || listeners.size > 0) return;
+			this.#listeners.delete(routeKey);
+			if (this.#persistentRoutes.has(routeKey)) return;
+			const timer = setTimeout(() => this.#disposeRouteKey(routeKey), routeCleanupGraceMs);
+			this.#cleanupTimers.set(routeKey, timer);
+		};
+	}
+	async submit(routeId, input, params = {}) {
+		const routeKey = createRouteKey(routeId, params);
+		const route = this.#routes.get(routeId);
+		if (!route?.action) return {
+			data: null,
+			error: "Route action not found."
+		};
+		const controllerKey = `${routeKey}:action`;
+		const controller = this.#replaceController(controllerKey);
+		const currentState = this.#states.get(routeKey) ?? IDLE_ROUTE_STATE;
+		this.#setState(routeKey, {
+			...currentState,
+			actionError: "",
+			actionState: "submitting",
+			navigationState: "submitting",
+			unexpectedError: false
+		});
+		const { error, data: result } = await safeWrapAsync(() => route.action?.({
+			input,
+			params,
+			signal: controller.signal
+		}));
+		if (this.#controllers.get(controllerKey) === controller) this.#controllers.delete(controllerKey);
+		if (controller.signal.aborted) return {
+			data: null,
+			error: ""
+		};
+		const latestState = this.#states.get(routeKey) ?? IDLE_ROUTE_STATE;
+		if (error || !result) {
+			const publicError = "The request could not be completed.";
+			this.#setState(routeKey, {
+				...latestState,
+				actionData: null,
+				actionError: publicError,
+				actionState: "idle",
+				navigationState: latestState.loaderState === "loading" ? "loading" : "idle",
+				unexpectedError: true
+			});
+			return {
+				data: null,
+				error: publicError,
+				unexpected: true
+			};
+		}
+		this.#setState(routeKey, {
+			...latestState,
+			actionData: result.data,
+			actionError: result.error,
+			actionState: "idle",
+			navigationState: latestState.loaderState === "loading" ? "loading" : "idle",
+			unexpectedError: false
+		});
+		const actionResult = {
+			data: result.data,
+			error: result.error
+		};
+		const { error: revalidationError, data: shouldRevalidate } = await safeWrapAsync(() => route.shouldRevalidate?.({
+			actionResult: result,
+			defaultShouldRevalidate: Boolean(route.loader),
+			params
+		}) ?? Boolean(route.loader));
+		if (revalidationError) {
+			const publicError = "The request could not be completed.";
+			this.#setState(routeKey, {
+				...this.#states.get(routeKey) ?? IDLE_ROUTE_STATE,
+				actionError: publicError,
+				actionState: "idle",
+				unexpectedError: true
+			});
+			return {
+				data: null,
+				error: publicError,
+				unexpected: true
+			};
+		}
+		if (shouldRevalidate) await this.load(routeId, params, true);
+		return actionResult;
+	}
+	async fetchLoader(routeId, params, signal) {
+		const route = this.#routes.get(routeId);
+		if (!route?.loader) return {
+			data: null,
+			error: "Route loader not found."
+		};
+		const { error, data: result } = await safeWrapAsync(() => route.loader?.({
+			params,
+			signal
+		}));
+		if (signal.aborted) return {
+			data: null,
+			error: ""
+		};
+		if (error || !result) return {
+			data: null,
+			error: "The route could not be loaded.",
+			unexpected: true
+		};
+		return result;
+	}
+	async fetchAction(routeId, input, params, signal) {
+		const route = this.#routes.get(routeId);
+		if (!route?.action) return {
+			data: null,
+			error: "Route action not found."
+		};
+		const { error, data: result } = await safeWrapAsync(() => route.action?.({
+			input,
+			params,
+			signal
+		}));
+		if (signal.aborted) return {
+			data: null,
+			error: ""
+		};
+		if (error || !result) return {
+			data: null,
+			error: "The request could not be completed.",
+			unexpected: true
+		};
+		const { error: revalidationError, data: shouldRevalidate } = await safeWrapAsync(() => route.shouldRevalidate?.({
+			actionResult: result,
+			defaultShouldRevalidate: Boolean(route.loader),
+			params
+		}) ?? Boolean(route.loader));
+		if (signal.aborted) return {
+			data: null,
+			error: ""
+		};
+		if (revalidationError) return {
+			data: null,
+			error: "The request could not be completed.",
+			unexpected: true
+		};
+		if (shouldRevalidate) await this.load(routeId, params, true);
+		return result;
+	}
+	retry(routeId, params) {
+		const routeKey = createRouteKey(routeId, params);
+		this.#states.set(routeKey, IDLE_ROUTE_STATE);
+		this.#notify(routeKey);
+		return this.load(routeId, params, true);
+	}
+	reportUnexpected(routeId, params) {
+		const routeKey = createRouteKey(routeId, params);
+		const currentState = this.#states.get(routeKey) ?? IDLE_ROUTE_STATE;
+		this.#setState(routeKey, {
+			...currentState,
+			unexpectedError: true
+		});
+	}
+	async #runLoader(route, routeKey, params, controller) {
+		const { error, data: result } = await safeWrapAsync(() => route.loader?.({
+			params,
+			signal: controller.signal
+		}) ?? Promise.resolve({
+			data: null,
+			error: ""
+		}));
+		if (this.#controllers.get(routeKey) === controller) {
+			this.#controllers.delete(routeKey);
+			this.#inFlightLoads.delete(routeKey);
+		}
+		if (controller.signal.aborted) return {
+			data: null,
+			error: ""
+		};
+		if (error || !result) {
+			const publicError = "The route could not be loaded.";
+			this.#setState(routeKey, {
+				actionData: null,
+				actionError: "",
+				actionState: "idle",
+				loaderData: null,
+				loaderError: publicError,
+				loaderInitialized: true,
+				loaderState: "idle",
+				navigationState: "idle",
+				unexpectedError: true
+			});
+			return {
+				data: null,
+				error: publicError,
+				unexpected: true
+			};
+		}
+		const currentState = this.#states.get(routeKey) ?? IDLE_ROUTE_STATE;
+		this.#setState(routeKey, {
+			...currentState,
+			loaderData: result.data,
+			loaderError: result.error,
+			loaderInitialized: true,
+			loaderState: "idle",
+			navigationState: currentState.actionState === "submitting" ? "submitting" : "idle",
+			unexpectedError: false
+		});
+		return result;
+	}
+	#replaceController(key) {
+		this.#controllers.get(key)?.abort();
+		const controller = new AbortController();
+		this.#controllers.set(key, controller);
+		return controller;
+	}
+	#setState(routeKey, state) {
+		this.#states.set(routeKey, state);
+		this.#notify(routeKey);
+	}
+	#notify(routeKey) {
+		for (const listener of this.#listeners.get(routeKey) ?? []) listener();
+	}
+};
+function createResourceRouter(routes) {
+	return new ResourceRouter(routes);
+}
+function createRouteKey(routeId, params) {
+	const normalizedParams = Object.entries(params).sort(([left], [right]) => left.localeCompare(right));
+	return `${routeId}:${JSON.stringify(normalizedParams)}`;
+}
+var routeCleanupGraceMs = 100;
+//#endregion
+export { ResourceRouter, createResourceRouter };

package/dist/core/responses.d.ts

@@ -0,0 +1,15 @@
+export interface RouteError extends Error {
+    status: number;
+    statusText: string;
+    data?: unknown;
+}
+export interface DataResponse<T> {
+    value: T;
+    init: ResponseInit;
+    __routeData: true;
+}
+export declare function data<T>(value: T, init?: ResponseInit): DataResponse<T>;
+export declare function redirect(location: string, init?: number | ResponseInit): Response;
+export declare function isRouteErrorResponse(value: unknown): value is RouteError;
+export declare function normalizeResult(value: unknown): Promise<unknown>;
+export declare function resolveData(value: unknown): Promise<unknown>;

package/dist/core/responses.js

@@ -0,0 +1,48 @@
+//#region .generated/core/responses.ts
+function data(value, init = {}) {
+	return {
+		value,
+		init,
+		__routeData: true
+	};
+}
+function redirect(location, init = 302) {
+	const options = typeof init === "number" ? { status: init } : init;
+	const headers = new Headers(options.headers);
+	headers.set("Location", location);
+	return new Response(null, {
+		...options,
+		status: options.status ?? 302,
+		headers
+	});
+}
+function isRouteErrorResponse(value) {
+	return value instanceof Error && "status" in value;
+}
+async function normalizeResult(value) {
+	if (value && typeof value === "object" && "__routeError" in value) {
+		const error = value.__routeError;
+		return Object.assign(Error(error.message), error);
+	}
+	if (value instanceof Response) {
+		if (value.headers.has("Location")) return value;
+		if (!value.ok) return Object.assign(Error(await value.text()), {
+			status: value.status,
+			statusText: value.statusText
+		});
+		return value.json();
+	}
+	if (value && typeof value === "object" && "__routeData" in value) return resolveData(value.value);
+	return resolveData(value);
+}
+async function resolveData(value) {
+	const resolved = await value;
+	if (Array.isArray(resolved)) return Promise.all(resolved.map(resolveData));
+	if (resolved && typeof resolved === "object" && Object.getPrototypeOf(resolved) === Object.prototype) {
+		const entries = await Promise.all(Object.entries(resolved).map(async ([key, field]) => [key, await resolveData(field)]));
+		return Object.fromEntries(entries);
+	}
+	return resolved;
+}
+//#endregion
+export { data, isRouteErrorResponse, normalizeResult, redirect, resolveData };

package/dist/{internal/core → core}/router.d.ts

@@ -1,3 +1,3 @@
 import type { Route, Router, RouterOptions } from "./types.ts";
 /** Create an isolated router. Use browser: true for browser history, or loadRouter for SSR. */
-export declare function createRouter(routes: readonly Route[], options?: RouterOptions): Router;
+export declare function createDataRouter(routes: readonly Route[], options?: RouterOptions): Router;

package/dist/core/router.js

@@ -0,0 +1,204 @@
+import { safeWrapAsync } from "./errors.js";
+import { matchRoutes } from "./match.js";
+import { internalURL } from "./url.js";
+//#region .generated/core/router.ts
+/** Create an isolated router. Use browser: true for browser history, or loadRouter for SSR. */
+function createDataRouter(routes, options = {}) {
+	const browser = options.browser && typeof window !== "undefined";
+	const hydrated = options.hydrationData?.state === "idle";
+	const initial = {
+		loaded: hydrated,
+		...options.hydrationData ?? {
+			url: new URL(options.url ?? (browser ? location.href : "/"), "http://localhost").href,
+			params: {},
+			state: "idle"
+		}
+	};
+	const revalidators = /* @__PURE__ */ new Set();
+	const channel = (initial, local) => {
+		let snapshot = initial;
+		let loadedURL;
+		let submission;
+		let controller;
+		const listeners = /* @__PURE__ */ new Set();
+		const emit = (state, next) => {
+			snapshot = {
+				...snapshot,
+				...next,
+				state
+			};
+			for (const listener of listeners) listener();
+		};
+		const run = async (href, body, operation = {}, navigation, redirects = 10) => {
+			controller?.abort();
+			controller = new AbortController();
+			const { signal } = controller;
+			const { method = "POST" } = operation;
+			revalidators.add(task);
+			submission = body;
+			const previous = snapshot;
+			const url = internalURL(main.getSnapshot().url, href);
+			const match = url && matchRoutes(routes, url.pathname);
+			const commit = () => {
+				if (local || !url) return;
+				const changed = snapshot.url !== url.href;
+				if (!changed && snapshot.path !== void 0) return;
+				if (browser && (navigation || body) && changed) history[operation.replace ? "replaceState" : "pushState"](null, "", url);
+				const sameRoute = snapshot.path === match?.route.path;
+				snapshot = {
+					...snapshot,
+					url: url.href,
+					path: match?.route.path,
+					params: match?.params ?? {},
+					actionData: void 0,
+					...!sameRoute && {
+						data: void 0,
+						loaded: false
+					}
+				};
+			};
+			if (!body) commit();
+			emit(body ? "submitting" : "loading", { error: void 0 });
+			const result = await safeWrapAsync(() => {
+				if (!match) return Error(url ? "No route" : "External URL");
+				if (navigation !== void 0 && previous.loaded && !previous.error && previous.path === match.route.path && match.route.shouldRevalidate?.({
+					url,
+					currentUrl: new URL(previous.url),
+					nextUrl: url,
+					defaultShouldRevalidate: true,
+					reason: "navigation"
+				}) === false) return previous.data;
+				const fn = match.route[body ? "clientAction" : "clientLoader"] || match.route[body ? "action" : "loader"];
+				if (!fn) return body && Error("No action");
+				return fn({
+					request: new Request(url, {
+						signal,
+						method: body && method,
+						body
+					}),
+					params: match.params,
+					signal
+				});
+			});
+			if (signal.aborted) return result;
+			const redirectTo = result.data instanceof Response && result.data.headers.get("Location");
+			if (redirectTo && redirects) {
+				await main.load(new URL(redirectTo, url).href, void 0, { replace: true }, true, redirects - 1);
+				if (!signal.aborted) {
+					submission = void 0;
+					emit("idle");
+				}
+				return result;
+			}
+			if (redirectTo) result.error = Error("Redirect loop");
+			if (!body && !result.error) loadedURL = url.href;
+			if (body && !result.error) commit();
+			emit(body && !result.error ? "loading" : "idle", {
+				[body && !local ? "actionData" : "data"]: result.data,
+				error: result.error,
+				loaded: body ? snapshot.loaded : !result.error
+			});
+			if (body && !result.error) {
+				await router.revalidate("action", {
+					formMethod: method,
+					formAction: url.href,
+					formData: body,
+					actionResult: result.data
+				}).finally(() => {
+					if (!signal.aborted) {
+						submission = void 0;
+						emit("idle");
+					}
+				});
+				return result;
+			}
+			if (!signal.aborted) submission = void 0;
+			return result;
+		};
+		const task = {
+			revalidate: async (args, targets) => {
+				if (local && (!loadedURL || submission)) return;
+				const url = new URL(local ? loadedURL : main.getSnapshot().url);
+				const route = matchRoutes(routes, url.pathname)?.route;
+				if (!route || targets && !targets.includes(route.id) && !targets.includes(route.path)) return;
+				if (route.shouldRevalidate?.({
+					...args,
+					url,
+					currentUrl: url,
+					nextUrl: url
+				}) === false) return;
+				return run(url.href);
+			},
+			getSnapshot: () => snapshot,
+			subscribe(listener) {
+				listeners.add(listener);
+				return () => {
+					listeners.delete(listener);
+				};
+			},
+			load: run,
+			submit: run,
+			dispose() {
+				controller?.abort();
+				listeners.clear();
+				revalidators.delete(task);
+			}
+		};
+		revalidators.add(task);
+		return task;
+	};
+	const main = channel(initial);
+	let started = 0;
+	const pop = () => main.load(location.href, void 0, void 0, false);
+	const router = {
+		...main,
+		routes,
+		start() {
+			if (!started++ && browser) addEventListener("popstate", pop);
+			if (!hydrated && main.getSnapshot() === initial) main.load(initial.url);
+			return () => {
+				if (!--started && browser) removeEventListener("popstate", pop);
+			};
+		},
+		async navigate(url, operation) {
+			await main.load(url, void 0, operation, true);
+		},
+		async revalidate(options = {}, context) {
+			const { route, reason = "manual", ...details } = typeof options === "string" ? {
+				reason: options,
+				...context
+			} : options;
+			const url = new URL(main.getSnapshot().url);
+			const args = {
+				...details,
+				url,
+				currentUrl: url,
+				nextUrl: url,
+				defaultShouldRevalidate: true,
+				reason
+			};
+			const targets = typeof route === "string" ? [route] : route;
+			await Promise.all([...revalidators].map((refresh) => refresh.revalidate(args, targets)));
+		},
+		registerRevalidator(id, refresh) {
+			const task = { revalidate: async (args, targets) => {
+				if (!targets || targets.includes(id)) return refresh(args);
+			} };
+			revalidators.add(task);
+			return () => {
+				revalidators.delete(task);
+			};
+		},
+		createFetcher() {
+			return channel({ state: "idle" }, true);
+		},
+		dispose() {
+			for (const refresh of revalidators) refresh.dispose?.();
+			revalidators.clear();
+			if (browser) removeEventListener("popstate", pop);
+		}
+	};
+	return router;
+}
+//#endregion
+export { createDataRouter };

package/dist/{internal/core → core}/serialize.d.ts

@@ -1,3 +1,5 @@
 import type { Snapshot } from "./types.ts";
 /** Safe inside a script element. Data must be JSON serializable; error stacks and causes are omitted. */
 export declare function serialize(snapshot: Snapshot): string;
+/** Encode JSON for embedding inside an HTML script element. */
+export declare function serializeData(value: unknown): string;

package/dist/core/serialize.js

@@ -0,0 +1,17 @@
+//#region .generated/core/serialize.ts
+/** Safe inside a script element. Data must be JSON serializable; error stacks and causes are omitted. */
+function serialize(snapshot) {
+	return serializeData({
+		...snapshot,
+		error: snapshot.error && {
+			name: snapshot.error.name,
+			message: snapshot.error.message
+		}
+	});
+}
+/** Encode JSON for embedding inside an HTML script element. */
+function serializeData(value) {
+	return JSON.stringify(value).replace(/</g, "\\u003c").replace(/\u2028/g, "\\u2028").replace(/\u2029/g, "\\u2029");
+}
+//#endregion
+export { serialize, serializeData };

package/dist/core/store.d.ts

@@ -0,0 +1,6 @@
+/** Small observable value shared by layout data and navigation state. */
+export declare function createStore<T>(initial: T): {
+    getSnapshot: () => T;
+    subscribe(listener: () => void): () => void;
+    update(next: T): void;
+};

package/dist/core/store.js

@@ -0,0 +1,21 @@
+//#region .generated/core/store.ts
+/** Small observable value shared by layout data and navigation state. */
+function createStore(initial) {
+	let value = initial;
+	const listeners = /* @__PURE__ */ new Set();
+	return {
+		getSnapshot: () => value,
+		subscribe(listener) {
+			listeners.add(listener);
+			return () => {
+				listeners.delete(listener);
+			};
+		},
+		update(next) {
+			value = next;
+			for (const listener of listeners) listener();
+		}
+	};
+}
+//#endregion
+export { createStore };