@torpor/build 0.4.14 → 1.0.1

package/dist/load-BntzvmwL.mjs

@@ -0,0 +1,228 @@
+import { t as $page } from "./_page-4cQKs_Dn.mjs";
+import { clearLayoutSlot, fillLayoutSlot, hydrate, mount, unmount } from "@torpor/view";
+//#region src/state/client.ts
+const CLIENT_SYMBOL = Symbol.for("torp.Client");
+const client = globalThis[CLIENT_SYMBOL] ??= {
+	router: null,
+	layoutStack: [],
+	prefetchedData: {}
+};
+//#endregion
+//#region src/nav/reload.ts
+/**
+* Reloads data for the currently loaded page and rerenders it.
+*/
+async function reload() {
+	return await navigate(new URL(document.location.href));
+}
+//#endregion
+//#region src/nav/formSubmit.ts
+async function formSubmit(e) {
+	e.preventDefault();
+	$page.form = void 0;
+	const form = e.target;
+	const button = e.submitter;
+	let action = form.action || document.URL;
+	if (button && button.formAction && button.formAction !== document.URL) action = button.formAction;
+	const options = {
+		body: new FormData(form),
+		method: "POST",
+		mode: "cors",
+		credentials: "same-origin",
+		headers: { "X-Torpor-Form-Submit": "" }
+	};
+	const response = await fetch(action, options);
+	if (response.status === 200 && response.headers.has("Content-Disposition") && /attachment;\s*filename="(.+?)"/.test(response.headers.get("Content-Disposition"))) {
+		const downloadFileName = response.headers.get("Content-Disposition")?.match(/attachment;\s*filename="(.+?)"/)[1] ?? "file";
+		const downloadLink = document.createElement("a");
+		downloadLink.href = window.URL.createObjectURL(await response.blob());
+		downloadLink.download = downloadFileName;
+		downloadLink.click();
+	} else if (response.status === 200 && response.headers.has("X-Torpor-Form-Redirect")) {
+		const redirect = response.headers.get("Location");
+		await load(redirect);
+		window.location.href = redirect;
+	} else if (response.status >= 200 && response.status <= 299 || response.status >= 400 && response.status <= 499) {
+		if (response.headers.get("Content-Type") === "application/json") $page.form = await response.json();
+		await reload();
+	}
+}
+//#endregion
+//#region src/nav/loadData.ts
+async function loadData(handler, params, path, query, newLayoutStack, clientEndPoint, serverEndPoint, prefetch = false) {
+	let data = {};
+	if (handler.layouts) {
+		let layoutStack = client.layoutStack;
+		for (let [i, layout] of handler.layouts.entries()) {
+			let layoutPath = layout.path;
+			for (let key in params) layoutPath = layoutPath.replace(`[${key}]`, params[key]);
+			if (layoutStack.at(i)?.path === layoutPath) {
+				if (!prefetch) layoutStack[i].reuse = true;
+				newLayoutStack[i] = layoutStack[i];
+				Object.assign(data, layoutStack[i].data);
+			} else {
+				const stackLayout = {
+					path: layoutPath,
+					data: {},
+					reuse: false,
+					slotRegion: null
+				};
+				const layoutEndPoint = (await layout.endPoint())?.default;
+				const layoutServerEndPoint = layout.serverEndPoint && (await layout.serverEndPoint())?.default;
+				if ((await loadClientAndServerData(stackLayout.data, document.location.origin + layoutPath, query, params, layoutEndPoint, layoutServerEndPoint))?.ok === false) return;
+				Object.assign(data, stackLayout.data);
+				newLayoutStack.push(stackLayout);
+			}
+		}
+	}
+	if ((await loadClientAndServerData(data, document.location.origin + path, query, params, clientEndPoint, serverEndPoint))?.ok === false) return;
+	return data;
+}
+async function loadClientAndServerData(data, location, query, params, clientEndPoint, serverEndPoint) {
+	let prefetchedData = client.prefetchedData;
+	if (clientEndPoint?.load) {
+		const clientKey = location + (query.size > 0 ? `?${query}` : "");
+		if (prefetchedData[clientKey]) Object.assign(data, prefetchedData[clientKey]);
+		else {
+			const clientUrl = new URL(document.location.href);
+			for (let [name, value] of query) clientUrl.searchParams.append(name, value);
+			const clientParams = buildClientParams(clientUrl, params, data);
+			const clientResponse = await clientEndPoint.load(clientParams);
+			if (clientResponse) if (clientResponse.ok) {
+				if (clientResponse.headers.get("Content-Type")?.includes("application/json")) {
+					const clientData = await clientResponse.json();
+					Object.assign(data, clientData);
+					prefetchedData[clientKey] = clientData;
+				}
+			} else return clientResponse;
+		}
+	}
+	if (serverEndPoint?.load) {
+		const serverLocation = location.replace(/\/$/, "") + "/~server";
+		const serverKey = serverLocation + (query.size > 0 ? `?${query}` : "");
+		if (prefetchedData[serverKey]) Object.assign(data, prefetchedData[serverKey]);
+		else {
+			const serverUrl = new URL(serverLocation);
+			for (let [name, value] of query) serverUrl.searchParams.append(name, value);
+			const serverResponse = await fetch(serverUrl);
+			if (serverResponse) if (serverResponse.ok) {
+				if (serverResponse.headers.get("Content-Type")?.includes("application/json")) {
+					const serverData = await serverResponse.json();
+					Object.assign(data, serverData);
+					prefetchedData[serverKey] = serverData;
+				}
+			} else return serverResponse;
+		}
+	}
+}
+function buildClientParams(url, params, data) {
+	return {
+		url,
+		params,
+		data
+	};
+}
+//#endregion
+//#region src/nav/navigate.ts
+async function navigate(url, withHydration = false) {
+	let parent = document.getElementById("app");
+	if (!parent) {
+		console.log("500");
+		return false;
+	}
+	const path = url.pathname;
+	const query = url.searchParams;
+	const route = client.router.match(path, query);
+	if (!route) {
+		console.log("404");
+		return false;
+	}
+	$page.url = url;
+	if (path.endsWith("/_error")) {
+		$page.status = parseInt(query.get("status") ?? "404");
+		$page.error = { message: query.get("message") ?? "" };
+		window.history.replaceState({}, "", url.toString().split("?")[0]);
+	} else $page.status = 200;
+	const handler = route.handler;
+	const params = route.params || {};
+	const clientEndPoint = (await handler.endPoint()).default;
+	if (!clientEndPoint?.component) {
+		console.log("404");
+		return false;
+	}
+	const serverEndPoint = handler.serverEndPoint && (await handler.serverEndPoint())?.default;
+	let newLayoutStack = [];
+	const data = await loadData(handler, params, path, query, newLayoutStack, clientEndPoint, serverEndPoint);
+	let formInput = document.getElementById("t-form-data");
+	let form;
+	if (formInput) {
+		form = JSON.parse(formInput.value);
+		$page.form = form;
+		formInput.remove();
+	}
+	let $props = { data };
+	$props.form = $page.form;
+	const $context = { TorporBuildContext: { onformsubmit: formSubmit } };
+	client.layoutStack.push({
+		path: route.handler.path,
+		data: {},
+		reuse: false,
+		slotRegion: null
+	});
+	client.layoutStack = newLayoutStack;
+	let layoutStack = client.layoutStack;
+	let component = clientEndPoint.component;
+	let slots = void 0;
+	let reused = false;
+	let reusedIndex = -1;
+	if (handler.layouts) {
+		let slotFunctions = [];
+		slotFunctions[handler.layouts.length] = function clientComponent(parent, anchor) {
+			let i = layoutStack.length - 1;
+			layoutStack[i].slotRegion = fillLayoutSlot(clientEndPoint.component, slotFunctions[i + 1], parent, anchor, $props, $context);
+		};
+		for (let i = handler.layouts.length - 1; i >= 0; i--) {
+			const layoutEndPoint = (await handler.layouts[i].endPoint())?.default;
+			if (layoutEndPoint?.component) if (layoutStack[i].reuse) {
+				component = slotFunctions[i + 1];
+				reusedIndex = i;
+				reused = true;
+				break;
+			} else if (i === 0) {
+				component = layoutEndPoint.component;
+				slots = { _: slotFunctions[i + 1] };
+			} else slotFunctions[i] = function layoutComponent(parent, anchor, _, $context) {
+				layoutStack[i - 1].slotRegion = fillLayoutSlot(layoutEndPoint.component, slotFunctions[i + 1], parent, anchor, $props, $context);
+			};
+		}
+	}
+	try {
+		if (reused) {
+			const slotRegion = layoutStack[reusedIndex].slotRegion;
+			parent = slotRegion.startNode.parentNode;
+			clearLayoutSlot(slotRegion);
+			component(parent, null);
+		} else if (withHydration) hydrate(parent, component, $props, slots);
+		else {
+			unmount(parent);
+			mount(parent, component, $props, slots);
+		}
+	} catch (error) {
+		parent.innerHTML = "<span style=\"color: red\">Script syntax error</span><p>" + error + "</p>";
+		console.log(error);
+	}
+	client.prefetchedData = {};
+	return true;
+}
+//#endregion
+//#region src/nav/load.ts
+/**
+* Loads and renders the page at the supplied path.
+*/
+async function load(path) {
+	return await navigate(new URL(path, document.location.href));
+}
+//#endregion
+export { client as a, reload as i, navigate as n, loadData as r, load as t };
+
+//# sourceMappingURL=load-BntzvmwL.mjs.map

package/dist/load-BntzvmwL.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"load-BntzvmwL.mjs","names":[],"sources":["../src/state/client.ts","../src/nav/reload.ts","../src/nav/formSubmit.ts","../src/nav/loadData.ts","../src/nav/navigate.ts","../src/nav/load.ts"],"sourcesContent":["import type ClientState from \"../types/ClientState\";\n\nconst CLIENT_SYMBOL: unique symbol = Symbol.for(\"torp.Client\");\n\nconst client: ClientState =\n\t// @ts-ignore\n\t(globalThis[CLIENT_SYMBOL] ??= {\n\t\t// @ts-ignore This will definitely, 100% get set\n\t\trouter: null,\n\t\tlayoutStack: [],\n\t\t// TODO: Probably expire after 30 seconds or something?\n\t\tprefetchedData: {},\n\t});\n\nexport default client;\n","import navigate from \"./navigate\";\n\n/**\n * Reloads data for the currently loaded page and rerenders it.\n */\nexport default async function reload(): Promise<boolean> {\n\tconst url = new URL(document.location.href);\n\treturn await navigate(url);\n}\n","import $page from \"../state/$page\";\nimport load from \"./load\";\nimport reload from \"./reload\";\n\nexport default async function formSubmit(e: SubmitEvent): Promise<void> {\n\t// We'll take it from here\n\te.preventDefault();\n\n\t// Reset $page on submit and link navigation\n\t// TODO: Should we put data in $page.data??\n\t$page.form = undefined;\n\n\t// Perform a POST fetch to the form's action location\n\tconst form = e.target as HTMLFormElement;\n\tconst button = e.submitter as HTMLButtonElement;\n\t// HACK: submit buttons have their formAction set to the current page if not\n\t// set, so we can't just check whether it's empty and fallback to form action\n\t//const action = button?.formAction ?? form.action;\n\tlet action = form.action || document.URL;\n\tif (button && button.formAction && button.formAction !== document.URL) {\n\t\taction = button.formAction;\n\t}\n\tconst options = {\n\t\tbody: new FormData(form),\n\t\tmethod: \"POST\",\n\t\tmode: \"cors\",\n\t\tcredentials: \"same-origin\",\n\t\t// Add a special header which tells the server that we want the raw\n\t\t// error response (if applicable) rather than the reloaded page that you\n\t\t// would get if submitting a page without javascript\n\t\theaders: {\n\t\t\t\"X-Torpor-Form-Submit\": \"\",\n\t\t},\n\t};\n\tconst response = await fetch(\n\t\taction,\n\t\t// @ts-ignore -- don't know what it's complaining about here\n\t\toptions,\n\t);\n\n\tif (\n\t\tresponse.status === 200 &&\n\t\tresponse.headers.has(\"Content-Disposition\") &&\n\t\t/attachment;\\s*filename=\"(.+?)\"/.test(response.headers.get(\"Content-Disposition\")!)\n\t) {\n\t\t// TODO: Is this enough to check to see if we have a file that should download?\n\t\t// Download the file by creating a dummy <a> and clicking it\n\t\tconst downloadFileName =\n\t\t\tresponse.headers.get(\"Content-Disposition\")?.match(/attachment;\\s*filename=\"(.+?)\"/)![1] ??\n\t\t\t\"file\";\n\t\tconst downloadLink = document.createElement(\"a\");\n\t\tdownloadLink.href = window.URL.createObjectURL(await response.blob());\n\t\tdownloadLink.download = downloadFileName;\n\t\tdownloadLink.click();\n\t} else if (response.status === 200 && response.headers.has(\"X-Torpor-Form-Redirect\")) {\n\t\t// TODO: Should do the correct type of redirect e.g. seeOther etc\n\t\tconst redirect = response.headers.get(\"Location\")!;\n\t\tawait load(redirect);\n\t\twindow.location.href = redirect;\n\t} else if (\n\t\t(response.status >= 200 && response.status <= 299) ||\n\t\t(response.status >= 400 && response.status <= 499)\n\t) {\n\t\t// Put the response into `$page.form`, and it will be put into `$props` in reload\n\t\tif (response.headers.get(\"Content-Type\") === \"application/json\") {\n\t\t\t$page.form = await response.json();\n\t\t}\n\t\tawait reload();\n\t}\n}\n","import client from \"../state/client\";\nimport type LayoutPath from \"../types/LayoutPath\";\nimport type PageEndPoint from \"../types/PageEndPoint\";\nimport type PageServerEndPoint from \"../types/PageServerEndPoint\";\nimport type RouteHandler from \"../types/RouteHandler\";\n\nexport default async function loadData(\n\thandler: RouteHandler,\n\tparams: Record<string, string>,\n\tpath: string,\n\tquery: URLSearchParams,\n\tnewLayoutStack: LayoutPath[],\n\tclientEndPoint: PageEndPoint | undefined,\n\tserverEndPoint: PageServerEndPoint | undefined,\n\tprefetch = false,\n): Promise<Record<string, string> | void> {\n\tlet data = {};\n\tif (handler.layouts) {\n\t\tlet layoutStack = client.layoutStack;\n\t\tfor (let [i, layout] of handler.layouts.entries()) {\n\t\t\tlet layoutPath = layout.path;\n\t\t\tfor (let key in params) {\n\t\t\t\tlayoutPath = layoutPath.replace(`[${key}]`, params[key]);\n\t\t\t}\n\t\t\tif (layoutStack.at(i)?.path === layoutPath) {\n\t\t\t\t// We've already loaded this layout, we can just re-use its data and UI\n\t\t\t\tif (!prefetch) {\n\t\t\t\t\tlayoutStack[i].reuse = true;\n\t\t\t\t}\n\t\t\t\tnewLayoutStack[i] = layoutStack[i];\n\t\t\t\tObject.assign(data, layoutStack[i].data);\n\t\t\t} else {\n\t\t\t\tconst stackLayout = { path: layoutPath, data: {}, reuse: false, slotRegion: null };\n\t\t\t\tconst layoutEndPoint: PageEndPoint | undefined = (await layout.endPoint())?.default;\n\t\t\t\tconst layoutServerEndPoint: PageServerEndPoint | undefined =\n\t\t\t\t\tlayout.serverEndPoint && (await layout.serverEndPoint())?.default;\n\t\t\t\tconst layoutResponse = await loadClientAndServerData(\n\t\t\t\t\tstackLayout.data,\n\t\t\t\t\tdocument.location.origin + layoutPath,\n\t\t\t\t\tquery,\n\t\t\t\t\tparams,\n\t\t\t\t\tlayoutEndPoint,\n\t\t\t\t\tlayoutServerEndPoint,\n\t\t\t\t);\n\t\t\t\tif (layoutResponse?.ok === false) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tObject.assign(data, stackLayout.data);\n\t\t\t\tnewLayoutStack.push(stackLayout);\n\t\t\t}\n\t\t}\n\t}\n\tlet endPointResponse = await loadClientAndServerData(\n\t\tdata,\n\t\tdocument.location.origin + path,\n\t\tquery,\n\t\tparams,\n\t\tclientEndPoint,\n\t\tserverEndPoint,\n\t);\n\tif (endPointResponse?.ok === false) {\n\t\treturn;\n\t}\n\treturn data;\n}\n\nasync function loadClientAndServerData(\n\tdata: Record<string, any>,\n\tlocation: string,\n\tquery: URLSearchParams,\n\tparams: Record<string, string>,\n\tclientEndPoint?: PageEndPoint,\n\tserverEndPoint?: PageServerEndPoint,\n): Promise<Response | undefined | void> {\n\tlet prefetchedData = client.prefetchedData;\n\n\tif (clientEndPoint?.load) {\n\t\tconst clientKey = location + (query.size > 0 ? `?${query}` : \"\");\n\t\tif (prefetchedData[clientKey]) {\n\t\t\tObject.assign(data, prefetchedData[clientKey]);\n\t\t} else {\n\t\t\tconst clientUrl = new URL(document.location.href);\n\t\t\tfor (let [name, value] of query) {\n\t\t\t\tclientUrl.searchParams.append(name, value);\n\t\t\t}\n\t\t\tconst clientParams = buildClientParams(clientUrl, params, data);\n\t\t\tconst clientResponse = await clientEndPoint.load(clientParams);\n\t\t\tif (clientResponse) {\n\t\t\t\tif (clientResponse.ok) {\n\t\t\t\t\tif (clientResponse.headers.get(\"Content-Type\")?.includes(\"application/json\")) {\n\t\t\t\t\t\tconst clientData = await clientResponse.json();\n\t\t\t\t\t\tObject.assign(data, clientData);\n\t\t\t\t\t\tprefetchedData[clientKey] = clientData;\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\treturn clientResponse;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tif (serverEndPoint?.load) {\n\t\tconst serverLocation = location.replace(/\\/$/, \"\") + \"/~server\";\n\t\tconst serverKey = serverLocation + (query.size > 0 ? `?${query}` : \"\");\n\t\tif (prefetchedData[serverKey]) {\n\t\t\tObject.assign(data, prefetchedData[serverKey]);\n\t\t} else {\n\t\t\tconst serverUrl = new URL(serverLocation);\n\t\t\tfor (let [name, value] of query) {\n\t\t\t\tserverUrl.searchParams.append(name, value);\n\t\t\t}\n\t\t\tconst serverResponse = await fetch(serverUrl);\n\t\t\tif (serverResponse) {\n\t\t\t\tif (serverResponse.ok) {\n\t\t\t\t\tif (serverResponse.headers.get(\"Content-Type\")?.includes(\"application/json\")) {\n\t\t\t\t\t\tconst serverData = await serverResponse.json();\n\t\t\t\t\t\tObject.assign(data, serverData);\n\t\t\t\t\t\tprefetchedData[serverKey] = serverData;\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\treturn serverResponse;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n\nfunction buildClientParams(url: URL, params: Record<string, string>, data: Record<string, any>) {\n\treturn {\n\t\turl,\n\t\tparams,\n\t\tdata,\n\t};\n}\n","import { clearLayoutSlot, fillLayoutSlot, hydrate } from \"@torpor/view\";\nimport { type Component, type SlotRender } from \"@torpor/view\";\nimport { mount, unmount } from \"@torpor/view\";\nimport $page from \"../state/$page\";\nimport client from \"../state/client\";\nimport type LayoutPath from \"../types/LayoutPath\";\nimport type PageEndPoint from \"../types/PageEndPoint\";\nimport type PageServerEndPoint from \"../types/PageServerEndPoint\";\nimport formSubmit from \"./formSubmit\";\nimport loadData from \"./loadData\";\n\n// @ts-ignore\nexport default async function navigate(url: URL, withHydration = false): Promise<boolean> {\n\tlet parent = document.getElementById(\"app\");\n\tif (!parent) {\n\t\t// TODO: 500\n\t\tconsole.log(\"500\");\n\t\treturn false;\n\t}\n\n\tconst path = url.pathname;\n\tconst query = url.searchParams;\n\n\t//console.log(`navigating to '${path}'${query.size ? ` with ${query}` : \"\"}`);\n\n\tconst route = client.router.match(path, query);\n\tif (!route) {\n\t\t// TODO: 404\n\t\tconsole.log(\"404\");\n\t\treturn false;\n\t}\n\n\t// Update $page before building the components\n\t$page.url = url;\n\tif (path.endsWith(\"/_error\")) {\n\t\t$page.status = parseInt(query.get(\"status\") ?? \"404\");\n\t\t$page.error = { message: query.get(\"message\") ?? \"\" };\n\t\t// Make it look a bit classier by removing the query\n\t\twindow.history.replaceState({}, \"\", url.toString().split(\"?\")[0]);\n\t} else {\n\t\t$page.status = 200;\n\t}\n\tconst handler = route.handler;\n\tconst params = route.params || {};\n\n\t// There must be a client endpoint with a component\n\tconst clientEndPoint: PageEndPoint | undefined = (await handler.endPoint()).default;\n\tif (!clientEndPoint?.component) {\n\t\t// TODO: 404\n\t\tconsole.log(\"404\");\n\t\treturn false;\n\t}\n\n\t// There may be a server endpoint\n\tconst serverEndPoint: PageServerEndPoint | undefined =\n\t\thandler.serverEndPoint && (await handler.serverEndPoint())?.default;\n\n\tlet newLayoutStack: LayoutPath[] = [];\n\n\t// Pass the data into $props\n\t// TODO: Don't load if this is the first time -- it should have been passed\n\t// to us, somehow...\n\tconst data = await loadData(\n\t\thandler,\n\t\tparams,\n\t\tpath,\n\t\tquery,\n\t\tnewLayoutStack,\n\t\tclientEndPoint,\n\t\tserverEndPoint,\n\t);\n\t// We may have form data in a hidden input -- not sure if this is the best\n\t// way to do it\n\tlet formInput = document.getElementById(\"t-form-data\") as HTMLInputElement;\n\tlet form: Record<string, string> | undefined;\n\tif (formInput) {\n\t\tform = JSON.parse(formInput.value);\n\t\t$page.form = form;\n\t\tformInput.remove();\n\t}\n\tlet $props: Record<string, any> = { data };\n\n\t// We may have form data in $page.form, either from the hidden input\n\t// (above), or added via onformsubmit (below)\n\t$props.form = $page.form;\n\n\t// Add some special context for submitting Forms client-side\n\tconst $context = {\n\t\tTorporBuildContext: { onformsubmit: formSubmit },\n\t};\n\n\tclient.layoutStack.push({ path: route.handler.path, data: {}, reuse: false, slotRegion: null });\n\tclient.layoutStack = newLayoutStack;\n\tlet layoutStack = client.layoutStack;\n\n\t// If there are layouts, work our way upwards, pushing each component into\n\t// the default slot of its parent\n\t// TODO: There's probably a nicer way to do this with reducers or something\n\tlet component = clientEndPoint.component as Component;\n\tlet slots: Record<string, SlotRender> | undefined = undefined;\n\tlet reused = false;\n\t// The index of the innermost reused layout. Its slotRegion is the region\n\t// that must be cleared and refilled (it contains the next layout's or the\n\t// page's content). This is usually the last entry of the stack, but not\n\t// when an outer layout is reused while an inner one is new — e.g.\n\t// navigating between sections that share the root layout.\n\tlet reusedIndex = -1;\n\tif (handler.layouts) {\n\t\tlet slotFunctions: SlotRender[] = [];\n\t\t// The last slot function will render the client component\n\t\tslotFunctions[handler.layouts.length] = function clientComponent(parent, anchor) {\n\t\t\tlet i = layoutStack.length - 1;\n\t\t\tlayoutStack[i].slotRegion = fillLayoutSlot(\n\t\t\t\tclientEndPoint.component!,\n\t\t\t\tslotFunctions[i + 1],\n\t\t\t\tparent,\n\t\t\t\tanchor,\n\t\t\t\t$props,\n\t\t\t\t$context,\n\t\t\t);\n\t\t};\n\n\t\t// Each earlier slot function will render a layout\n\t\tfor (let i = handler.layouts.length - 1; i >= 0; i--) {\n\t\t\tconst layoutEndPoint: PageEndPoint | undefined = (await handler.layouts[i].endPoint())\n\t\t\t\t?.default;\n\t\t\tif (layoutEndPoint?.component) {\n\t\t\t\tif (layoutStack[i].reuse) {\n\t\t\t\t\t// Reuse this layout — clear and refill its slot (done in\n\t\t\t\t\t// the try block below so a failure doesn't leave the slot\n\t\t\t\t\t// half-cleared)\n\t\t\t\t\tcomponent = slotFunctions[i + 1] as Component;\n\t\t\t\t\treusedIndex = i;\n\t\t\t\t\treused = true;\n\t\t\t\t\tbreak;\n\t\t\t\t} else if (i === 0) {\n\t\t\t\t\tcomponent = layoutEndPoint.component as Component;\n\t\t\t\t\tslots = { _: slotFunctions[i + 1] };\n\t\t\t\t} else {\n\t\t\t\t\tslotFunctions[i] = function layoutComponent(parent, anchor, _, $context) {\n\t\t\t\t\t\tlayoutStack[i - 1].slotRegion = fillLayoutSlot(\n\t\t\t\t\t\t\tlayoutEndPoint.component!,\n\t\t\t\t\t\t\tslotFunctions[i + 1],\n\t\t\t\t\t\t\tparent,\n\t\t\t\t\t\t\tanchor,\n\t\t\t\t\t\t\t$props,\n\t\t\t\t\t\t\t$context,\n\t\t\t\t\t\t);\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\ttry {\n\t\tif (reused) {\n\t\t\t// The layout is being reused — clear the old slot content, then\n\t\t\t// call the slot function directly to fill it with the new page.\n\t\t\t// We must not go through `mount` here: the slot's container still\n\t\t\t// holds the layout's own children (e.g. a header), which `mount`\n\t\t\t// refuses to mount into. Both the clear and the fill are inside\n\t\t\t// the try so that a failure doesn't leave the slot half-cleared.\n\t\t\tconst slotRegion = layoutStack[reusedIndex].slotRegion;\n\t\t\tparent = slotRegion.startNode!.parentNode as HTMLElement;\n\t\t\tclearLayoutSlot(slotRegion);\n\t\t\tcomponent(parent, null);\n\t\t} else if (withHydration) {\n\t\t\thydrate(parent, component, $props, slots);\n\t\t} else {\n\t\t\t// The layout chain changed (or there was no previous layout to\n\t\t\t// reuse): tear down the previous UI entirely — disposing its\n\t\t\t// region tree and clearing `#app` — so `mount` starts fresh.\n\t\t\t// Without this, `mount` throws because `#app` still holds the\n\t\t\t// previous render's children, and it would reuse a stale root\n\t\t\t// region.\n\t\t\tunmount(parent);\n\t\t\tmount(parent, component, $props, slots);\n\t\t}\n\t} catch (error) {\n\t\t// TODO: Show a proper Error component\n\t\tparent.innerHTML = '<span style=\"color: red\">Script syntax error</span><p>' + error + \"</p>\";\n\t\tconsole.log(error);\n\t}\n\n\t// Reset prefetched data on each navigation\n\tclient.prefetchedData = {};\n\n\treturn true;\n}\n","import navigate from \"./navigate\";\n\n/**\n * Loads and renders the page at the supplied path.\n */\nexport default async function load(path: string): Promise<boolean> {\n\tconst url = new URL(path, document.location.href);\n\treturn await navigate(url);\n}\n"],"mappings":"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"}

package/dist/nav.d.mts

@@ -1,14 +1,67 @@
+import { n as ParseRouteParams, t as ExactRouteParams } from "./ParseRouteParams-DBmqlmLh.mjs";
+import { t as TypedResponse } from "./TypedResponse-6lznqN4U.mjs";
+//#region src/nav/api.d.ts
+/**
+ * The value a client call resolves to: the endpoint's typed JSON body when it
+ * returns a typed response, or the raw Response when the body isn't JSON.
+ * Untyped endpoints resolve to `unknown`.
+ */
+type ApiResult<Handler> = Handler extends ((event: any) => any) ? Awaited<ReturnType<Handler>> extends TypedResponse<infer Body> ? Body | Response : unknown : never;
+/**
+ * The body a client call accepts: the endpoint event's annotated JSON body
+ * type (from `ServerLoadEvent<Route, Body>`), or a loose value when the
+ * handler doesn't annotate one.
+ */
+type ApiRequestBody<Handler> = Handler extends ((event: infer Event) => any) ? Event extends {
+  json: () => Promise<infer Body>;
+} ? unknown extends Body ? BodyInit | object : Body : BodyInit | object : BodyInit | object;
+/** The callable methods of an endpoint, one per handler it defines. */
+type ApiMethods<Endpoint extends object> = { [Method in string & keyof Endpoint as NonNullable<Endpoint[Method]> extends ((event: any) => any) ? Method : never]: (body?: ApiRequestBody<NonNullable<Endpoint[Method]>>, init?: RequestInit) => Promise<ApiResult<NonNullable<Endpoint[Method]>>>; };
+/**
+ * Creates typed client callers for a `+server` endpoint, e.g.
+ *
+ * ```ts
+ * import type endpoint from "@/routes/api/posts/[id]/+server";
+ * const post = makeApi<"/api/posts/[id]", typeof endpoint>("/api/posts/[id]");
+ * const data = await post.get(); // typed from the endpoint's responses
+ * ```
+ *
+ * Method names match the endpoint's handlers (`del` for DELETE). Params are
+ * filled in and URI-encoded from the route path, and JSON responses are
+ * parsed; non-JSON responses resolve to the raw Response. Failed requests
+ * (non-2xx) throw.
+ *
+ * @param path The endpoint's route path
+ * @param params The route params, required if the path has dynamic segments
+ * @returns An object with one caller per handler defined by the endpoint
+ */
+declare function makeApi<Route extends string, Endpoint extends object, Params extends ParseRouteParams<Route> = ParseRouteParams<Route>>(path: Route, ...args: string extends Route ? [params?: Record<string, string>] : keyof ParseRouteParams<Route> extends never ? [] : [params: Params & ExactRouteParams<Params, ParseRouteParams<Route>>]): ApiMethods<Endpoint>;
+//#endregion
 //#region src/nav/load.d.ts
 /**
-* Loads and renders the page at the supplied path.
-*/
+ * Loads and renders the page at the supplied path.
+ */
 declare function load(path: string): Promise<boolean>;
 //#endregion
 //#region src/nav/reload.d.ts
 /**
-* Reloads data for the currently loaded page and rerenders it.
-*/
+ * Reloads data for the currently loaded page and rerenders it.
+ */
 declare function reload(): Promise<boolean>;
 //#endregion
-export { load, reload };
+//#region src/nav/route.d.ts
+/**
+ * Builds a route path in a type-safe manner, filling in dynamic segments, e.g.
+ * `route("/posts/[id]", { id: 5 })` returns `/posts/5`. The params object is
+ * checked for exact keys: missing or unknown params error at compile time.
+ *
+ * NOTE: The rest args conditional must stay INLINE — routing it through a type
+ * alias defeats `Params` inference, and excess keys stop being checked
+ * @param path The route path
+ * @param params The route params, required if the path has dynamic segments
+ * @returns The path with the params filled in, URI-encoded
+ */
+declare function route<Route extends string, Params extends ParseRouteParams<Route> = ParseRouteParams<Route>>(path: Route, ...args: string extends Route ? [params?: Record<string, string>] : keyof ParseRouteParams<Route> extends never ? [] : [params: Params & ExactRouteParams<Params, ParseRouteParams<Route>>]): string;
+//#endregion
+export { load, makeApi, reload, route };
 //# sourceMappingURL=nav.d.mts.map

package/dist/nav.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"nav.d.mts","names":[],"sources":["../src/nav/load.ts","../src/nav/reload.ts"],"sourcesContent":[],"mappings":";;;;iBAK8B,IAAA,gBAAoB;;;;;;iBCApB,MAAA,CAAA,GAAU"}
+{"version":3,"file":"nav.d.mts","names":[],"sources":["../src/nav/api.ts","../src/nav/load.ts","../src/nav/reload.ts","../src/nav/route.ts"],"mappings":";;;;;;;;KASK,UAAU,WAAW,kBAAiB,sBACxC,QAAQ,WAAW,kBAAkB,oBAAoB,QACxD,OAAO;;;;;;KASN,eAAe,WAAW,kBAAiB,aAAa,iBAC1D;EAAgB,YAAY,cAAc;oBACzB,OACf,oBACA,OACD,oBACD;;KAGS,WAAW,8BACrB,yBAAyB,YAAY,YAAY,SAAS,mBAAkB,sBAC1E,kBAEF,OAAO,eAAe,YAAY,SAAS,WAC3C,OAAO,gBACH,QAAQ,UAAU,YAAY,SAAS;;;;;;;;;;;;;;;;;;;iBAuBrB,QACvB,sBACA,yBACA,eAAe,iBAAiB,SAAS,iBAAiB,QAE1D,MAAM,UAGH,qBAAqB,SACpB,SAAS,gCACJ,iBAAiB,6BAErB,QAAQ,SAAS,iBAAiB,QAAQ,iBAAiB,WAC9D,WAAW;;;;;;iBClEgB,KAAK,eAAe;;;;;;iBCApB,UAAU;;;;;;;;;;;;;;iBCQhB,MACvB,sBACA,eAAe,iBAAiB,SAAS,iBAAiB,QAE1D,MAAM,UACH,qBAAqB,SACpB,SAAS,gCACJ,iBAAiB,6BAErB,QAAQ,SAAS,iBAAiB,QAAQ,iBAAiB"}

package/dist/nav.mjs

@@ -1,219 +1,73 @@
-import { t as $page_default } from "./_page-BQs4WvCO.mjs";
-import { clearLayoutSlot, fillLayoutSlot, hydrate, mount } from "@torpor/view";
-
-//#region src/state/client.ts
-const CLIENT_SYMBOL = Symbol.for("torp.Client");
-const client = globalThis[CLIENT_SYMBOL] ??= {
-	router: null,
-	layoutStack: [],
-	prefetchedData: {}
-};
-var client_default = client;
-
-//#endregion
-//#region src/nav/reload.ts
+import { i as reload, t as load } from "./load-BntzvmwL.mjs";
+//#region src/nav/route.ts
 /**
-* Reloads data for the currently loaded page and rerenders it.
+* Builds a route path in a type-safe manner, filling in dynamic segments, e.g.
+* `route("/posts/[id]", { id: 5 })` returns `/posts/5`. The params object is
+* checked for exact keys: missing or unknown params error at compile time.
+*
+* NOTE: The rest args conditional must stay INLINE — routing it through a type
+* alias defeats `Params` inference, and excess keys stop being checked
+* @param path The route path
+* @param params The route params, required if the path has dynamic segments
+* @returns The path with the params filled in, URI-encoded
 */
-async function reload() {
-	return await navigate(new URL(document.location.href));
-}
-
-//#endregion
-//#region src/nav/formSubmit.ts
-async function formSubmit(e) {
-	e.preventDefault();
-	$page_default.form = void 0;
-	const form = e.target;
-	const button = e.submitter;
-	let action = form.action || document.URL;
-	if (button && button.formAction && button.formAction !== document.URL) action = button.formAction;
-	const options = {
-		body: new FormData(form),
-		method: "POST",
-		mode: "cors",
-		credentials: "same-origin",
-		headers: { "x-torpor-form-submit": "" }
-	};
-	const response = await fetch(action, options);
-	if (response.status === 200 && response.headers.has("x-torpor-form-redirect")) {
-		const redirect = response.headers.get("location");
-		await load(redirect);
-		window.location.href = redirect;
-	} else if (response.status >= 200 && response.status <= 299 || response.status >= 400 && response.status <= 499) {
-		if (response.headers.get("content-type") === "application/json") $page_default.form = await response.json();
-		await reload();
-	}
-}
-
-//#endregion
-//#region src/nav/loadData.ts
-async function loadData(handler, params, path, query, newLayoutStack, clientEndPoint, serverEndPoint, prefetch = false) {
-	let data = {};
-	if (handler.layouts) {
-		let layoutStack = client_default.layoutStack;
-		for (let [i, layout] of handler.layouts.entries()) {
-			let layoutPath = layout.path;
-			for (let key in params) layoutPath = layoutPath.replace(`[${key}]`, params[key]);
-			if (layoutStack.at(i)?.path === layoutPath) {
-				if (!prefetch) layoutStack[i].reuse = true;
-				newLayoutStack[i] = layoutStack[i];
-				Object.assign(data, layoutStack[i].data);
-			} else {
-				const stackLayout = {
-					path: layoutPath,
-					data: {},
-					reuse: false,
-					slotRegion: null
-				};
-				const layoutEndPoint = (await layout.endPoint())?.default;
-				const layoutServerEndPoint = layout.serverEndPoint && (await layout.serverEndPoint())?.default;
-				if ((await loadClientAndServerData(stackLayout.data, document.location.origin + layoutPath, query, params, layoutEndPoint, layoutServerEndPoint))?.ok === false) return;
-				Object.assign(data, stackLayout.data);
-				newLayoutStack.push(stackLayout);
-			}
-		}
-	}
-	if ((await loadClientAndServerData(data, document.location.origin + path, query, params, clientEndPoint, serverEndPoint))?.ok === false) return;
-	return data;
-}
-async function loadClientAndServerData(data, location, query, params, clientEndPoint, serverEndPoint) {
-	let prefetchedData = client_default.prefetchedData;
-	if (clientEndPoint?.load) {
-		const clientKey = location + (query.size > 0 ? `?${query}` : "");
-		if (prefetchedData[clientKey]) Object.assign(data, prefetchedData[clientKey]);
-		else {
-			const clientUrl = new URL(document.location.href);
-			for (let [name, value] of query) clientUrl.searchParams.append(name, value);
-			const clientParams = buildClientParams(clientUrl, params, data);
-			const clientResponse = await clientEndPoint.load(clientParams);
-			if (clientResponse) if (clientResponse.ok) {
-				if (clientResponse.headers.get("Content-Type")?.includes("application/json")) {
-					const clientData = await clientResponse.json();
-					Object.assign(data, clientData);
-					prefetchedData[clientKey] = clientData;
-				}
-			} else return clientResponse;
-		}
-	}
-	if (serverEndPoint?.load) {
-		const serverLocation = location.replace(/\/$/, "") + "/~server";
-		const serverKey = serverLocation + (query.size > 0 ? `?${query}` : "");
-		if (prefetchedData[serverKey]) Object.assign(data, prefetchedData[serverKey]);
-		else {
-			const serverUrl = new URL(serverLocation);
-			for (let [name, value] of query) serverUrl.searchParams.append(name, value);
-			const serverResponse = await fetch(serverUrl);
-			if (serverResponse) if (serverResponse.ok) {
-				if (serverResponse.headers.get("Content-Type")?.includes("application/json")) {
-					const serverData = await serverResponse.json();
-					Object.assign(data, serverData);
-					prefetchedData[serverKey] = serverData;
-				}
-			} else return serverResponse;
-		}
-	}
-}
-function buildClientParams(url, params, data) {
-	return {
-		url,
-		params,
-		data
-	};
-}
-
-//#endregion
-//#region src/nav/navigate.ts
-async function navigate(url, withHydration = false) {
-	let parent = document.getElementById("app");
-	if (!parent) {
-		console.log("500");
-		return false;
-	}
-	const path = url.pathname;
-	const query = url.searchParams;
-	const route = client_default.router.match(path, query);
-	if (!route) {
-		console.log("404");
-		return false;
-	}
-	$page_default.url = url;
-	if (path.endsWith("/_error")) {
-		$page_default.status = parseInt(query.get("status") ?? "404");
-		$page_default.error = { message: query.get("message") ?? "" };
-		window.history.replaceState({}, "", url.toString().split("?")[0]);
-	} else $page_default.status = 200;
-	const handler = route.handler;
-	const params = route.params || {};
-	const clientEndPoint = (await handler.endPoint()).default;
-	if (!clientEndPoint?.component) {
-		console.log("404");
-		return false;
-	}
-	const serverEndPoint = handler.serverEndPoint && (await handler.serverEndPoint())?.default;
-	let newLayoutStack = [];
-	const data = await loadData(handler, params, path, query, newLayoutStack, clientEndPoint, serverEndPoint);
-	let formInput = document.getElementById("t-form-data");
-	let form;
-	if (formInput) {
-		form = JSON.parse(formInput.value);
-		$page_default.form = form;
-		formInput.remove();
-	}
-	let $props = { data };
-	$props.form = $page_default.form;
-	const $context = { TorporBuildContext: { onformsubmit: formSubmit } };
-	client_default.layoutStack.push({
-		path: route.handler.path,
-		data: {},
-		reuse: false,
-		slotRegion: null
+function route(path, ...args) {
+	const params = args[0] ?? {};
+	return path.replace(/\[(\.\.\.)?([^\]]+)\]/g, (_, splat, name) => {
+		const value = params[name];
+		if (value === void 0) throw new Error(`Missing param '${name}' for route '${path}'`);
+		return splat ? value.split("/").map((segment) => encodeURIComponent(segment)).join("/") : encodeURIComponent(String(value));
 	});
-	client_default.layoutStack = newLayoutStack;
-	let layoutStack = client_default.layoutStack;
-	let component = clientEndPoint.component;
-	let slots = void 0;
-	if (handler.layouts) {
-		let slotFunctions = [];
-		slotFunctions[handler.layouts.length] = function clientComponent(parent$1, anchor) {
-			let i = layoutStack.length - 1;
-			layoutStack[i].slotRegion = fillLayoutSlot(clientEndPoint.component, slotFunctions[i + 1], parent$1, anchor, $props, $context);
-		};
-		for (let i = handler.layouts.length - 1; i >= 0; i--) {
-			const layoutEndPoint = (await handler.layouts[i].endPoint())?.default;
-			if (layoutEndPoint?.component) if (layoutStack[i].reuse) {
-				parent = layoutStack[i].slotRegion.startNode.parentNode;
-				clearLayoutSlot(layoutStack[i].slotRegion);
-				component = slotFunctions[i + 1];
-				break;
-			} else if (i === 0) {
-				component = layoutEndPoint.component;
-				slots = { _: slotFunctions[i + 1] };
-			} else slotFunctions[i] = function layoutComponent(parent$1, anchor, _, $context$1) {
-				layoutStack[i - 1].slotRegion = fillLayoutSlot(layoutEndPoint.component, slotFunctions[i + 1], parent$1, anchor, $props, $context$1);
-			};
-		}
-	}
-	if (withHydration) hydrate(parent, component, $props, slots);
-	else try {
-		mount(parent, component, $props, slots);
-	} catch (error) {
-		parent.innerHTML = "<span style=\"color: red\">Script syntax error</span><p>" + error + "</p>";
-		console.log(error);
-	}
-	client_default.prefetchedData = {};
-	return true;
 }
-
 //#endregion
-//#region src/nav/load.ts
+//#region src/nav/api.ts
+const METHODS = [
+	"get",
+	"post",
+	"patch",
+	"put",
+	"del",
+	"options",
+	"head"
+];
 /**
-* Loads and renders the page at the supplied path.
+* Creates typed client callers for a `+server` endpoint, e.g.
+*
+* ```ts
+* import type endpoint from "@/routes/api/posts/[id]/+server";
+* const post = makeApi<"/api/posts/[id]", typeof endpoint>("/api/posts/[id]");
+* const data = await post.get(); // typed from the endpoint's responses
+* ```
+*
+* Method names match the endpoint's handlers (`del` for DELETE). Params are
+* filled in and URI-encoded from the route path, and JSON responses are
+* parsed; non-JSON responses resolve to the raw Response. Failed requests
+* (non-2xx) throw.
+*
+* @param path The endpoint's route path
+* @param params The route params, required if the path has dynamic segments
+* @returns An object with one caller per handler defined by the endpoint
 */
-async function load(path) {
-	return await navigate(new URL(path, document.location.href));
+function makeApi(path, ...args) {
+	const url = route(path, ...args);
+	const api = {};
+	for (const method of METHODS) api[method] = (body, init) => request(method, url, body, init);
+	return api;
+}
+async function request(method, url, body, init) {
+	const options = {
+		method: (method === "del" ? "delete" : method).toUpperCase(),
+		...init
+	};
+	if (body !== void 0 && options.body === void 0 && method !== "get" && method !== "head") if (typeof body === "object") {
+		options.headers ??= { "Content-Type": "application/json" };
+		options.body = JSON.stringify(body);
+	} else options.body = body;
+	const response = await fetch(url, options);
+	if (!response.ok) throw new Error(`API ${method.toUpperCase()} ${url} failed: ${response.status}`);
+	return (response.headers.get("Content-Type") ?? "").includes("application/json") ? await response.json() : response;
 }
-
 //#endregion
-export { load, reload };
+export { load, makeApi, reload, route };
+
 //# sourceMappingURL=nav.mjs.map