camox 0.44.0 → 0.46.0

package/dist/features/runtime/runtimeChromeLoader.js

@@ -0,0 +1,58 @@
+import { c } from "react/compiler-runtime";
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/features/runtime/runtimeChromeLoader.tsx
+let loadedModule;
+let loading;
+/**
+* Studio chrome is only for members, so anonymous visitors never download it. Load it before
+* rendering or hydrating a member's document: both then render it in place, without suspending.
+*/
+function loadRuntimeChrome() {
+	loading ??= import("./RuntimeChrome.js").then((module) => {
+		loadedModule = { default: module.RuntimeChrome };
+		return loadedModule;
+	});
+	return loading;
+}
+const LazyRuntimeChrome = React.lazy(() => {
+	if (!loadedModule) return loadRuntimeChrome();
+	const module = loadedModule;
+	return { then: (resolve) => resolve(module) };
+});
+/** Shows `fallback` while the chrome loads, when a visitor signs in without a reload. */
+function RuntimeChromeSlot(t0) {
+	const $ = c(8);
+	let fallback;
+	let props;
+	if ($[0] !== t0) {
+		({fallback, ...props} = t0);
+		$[0] = t0;
+		$[1] = fallback;
+		$[2] = props;
+	} else {
+		fallback = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== props) {
+		t1 = /* @__PURE__ */ jsx(LazyRuntimeChrome, { ...props });
+		$[3] = props;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== fallback || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx(React.Suspense, {
+			fallback,
+			children: t1
+		});
+		$[5] = fallback;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+}
+
+//#endregion
+export { RuntimeChromeSlot, loadRuntimeChrome };

package/dist/features/runtime/runtimeRoutes.d.ts

@@ -0,0 +1,19 @@
+//#region src/features/runtime/runtimeRoutes.d.ts
+/**
+ * The URLs the runtime answers that aren't pages or the Studio. Worker request filtering, runtime
+ * route matching and client navigation all read this list, so a new one can't be forgotten in any
+ * of them. Prefix rules stay with their readers: the Worker also answers every `/camox/` Studio
+ * path, and client navigation also skips any other `/_camox/` path.
+ * No imports: client navigation ships this module in the browser bundle.
+ */
+export declare const RUNTIME_ROUTE_PATHS: {
+  readonly data: "/_camox/data";
+  readonly health: "/_camox/health";
+  readonly registry: "/_camox/registry";
+  readonly routes: "/_camox/routes";
+  readonly og: "/og";
+  readonly sitemap: "/sitemap.xml";
+  readonly "llms-txt": "/llms.txt";
+};
+export type RuntimeOwnedRouteKind = keyof typeof RUNTIME_ROUTE_PATHS;
+//#endregion

package/dist/features/runtime/runtimeRoutes.js

@@ -0,0 +1,25 @@
+//#region src/features/runtime/runtimeRoutes.ts
+/**
+* The URLs the runtime answers that aren't pages or the Studio. Worker request filtering, runtime
+* route matching and client navigation all read this list, so a new one can't be forgotten in any
+* of them. Prefix rules stay with their readers: the Worker also answers every `/camox/` Studio
+* path, and client navigation also skips any other `/_camox/` path.
+* No imports: client navigation ships this module in the browser bundle.
+*/
+const RUNTIME_ROUTE_PATHS = {
+	data: "/_camox/data",
+	health: "/_camox/health",
+	registry: "/_camox/registry",
+	routes: "/_camox/routes",
+	og: "/og",
+	sitemap: "/sitemap.xml",
+	"llms-txt": "/llms.txt"
+};
+/** Which runtime-owned route a path inside the runtime (base path removed) is, if any. */
+function matchRuntimeOwnedRoute(pathname) {
+	for (const [kind, path] of Object.entries(RUNTIME_ROUTE_PATHS)) if (pathname === path) return kind;
+	return null;
+}
+
+//#endregion
+export { RUNTIME_ROUTE_PATHS, matchRuntimeOwnedRoute };

package/dist/features/runtime/scrollRestoration.js

@@ -0,0 +1,133 @@
+//#region src/features/runtime/scrollRestoration.ts
+/**
+* Scroll positions of the website's history entries. Each entry the runtime creates carries a
+* key in `history.state`, so two entries with the same URL keep their own positions. Positions
+* are kept in sessionStorage, so they survive reloads and documents the browser had to load again.
+*
+* The page scrolls in its viewport: the visitor's window, or the Studio frame showing the page.
+* The history belongs to the top window either way.
+*/
+const STORAGE_KEY = "camox:scroll-positions";
+const STATE_KEY = "camoxScrollKey";
+/** Keeps sessionStorage small for long sessions. Older entries scroll to the top instead. */
+const MAX_ENTRIES = 100;
+function keyOf(state) {
+	if (!state || typeof state !== "object" || !(STATE_KEY in state)) return void 0;
+	const key = state[STATE_KEY];
+	return typeof key === "string" ? key : void 0;
+}
+function createKey() {
+	return Math.random().toString(36).slice(2, 10);
+}
+function readPositions(storage) {
+	try {
+		const stored = storage?.getItem(STORAGE_KEY);
+		if (stored) return new Map(JSON.parse(stored));
+	} catch {}
+	return /* @__PURE__ */ new Map();
+}
+/** The element a fragment names, or `"top"` for the fragments that name the top of the page. */
+function fragmentTarget(doc, hash) {
+	const fragment = hash.replace(/^#/, "");
+	let decoded = fragment;
+	try {
+		decoded = decodeURIComponent(fragment);
+	} catch {}
+	const find = (id) => id && (doc.getElementById(id) ?? doc.getElementsByName(id)[0]) || null;
+	const element = find(fragment) ?? find(decoded);
+	if (!element && (!decoded || decoded.toLowerCase() === "top")) return "top";
+	return element;
+}
+function createScrollRestoration(win) {
+	const storage = (() => {
+		try {
+			return win.sessionStorage;
+		} catch {
+			return;
+		}
+	})();
+	const positions = readPositions(storage);
+	let viewport = null;
+	win.history.scrollRestoration = "manual";
+	let currentKey = keyOf(win.history.state);
+	const keyEntry = () => {
+		currentKey = createKey();
+		win.history.replaceState({
+			...win.history.state,
+			[STATE_KEY]: currentKey
+		}, "");
+	};
+	if (!currentKey) keyEntry();
+	const persist = () => {
+		try {
+			storage?.setItem(STORAGE_KEY, JSON.stringify([...positions]));
+		} catch {}
+	};
+	/** Records where the shown entry's page is scrolled to. */
+	const save = () => {
+		if (!currentKey || !viewport) return;
+		positions.delete(currentKey);
+		positions.set(currentKey, [viewport.scrollX, viewport.scrollY]);
+		while (positions.size > MAX_ENTRIES) positions.delete(positions.keys().next().value);
+		persist();
+	};
+	const onPageHide = () => {
+		save();
+		win.history.scrollRestoration = "auto";
+	};
+	const onPageShow = () => {
+		win.history.scrollRestoration = "manual";
+	};
+	win.addEventListener("pagehide", onPageHide);
+	win.addEventListener("pageshow", onPageShow);
+	return {
+		save,
+		/** Where the page scrolls from now on, or null while nothing shows it. */
+		setViewport(next) {
+			viewport = next;
+		},
+		/** Where the page scrolls, if anything shows it. */
+		viewport: () => viewport,
+		/** State for a new history entry, which gets a key of its own. */
+		stateForNewEntry: () => ({ [STATE_KEY]: createKey() }),
+		/** Follows the history entry the browser now shows, and gives it a key if it has none. */
+		entered() {
+			currentKey = keyOf(win.history.state);
+			if (!currentKey) keyEntry();
+		},
+		/**
+		* Scrolls `page`, which just rendered the shown entry at `hash`, as `intent` says. Returns the
+		* fragment's element it scrolled to, if any.
+		*/
+		apply(page, intent, hash) {
+			const scrollTo = (top, left = 0) => page.scrollTo({
+				top,
+				left,
+				behavior: "instant"
+			});
+			if (intent === "resume" || intent === "restore") {
+				const saved = currentKey && positions.get(currentKey);
+				if (saved) {
+					scrollTo(saved[1], saved[0]);
+					return null;
+				}
+				if (intent === "resume") return null;
+			}
+			const target = hash ? fragmentTarget(page.document, hash) : null;
+			if (target === "top") scrollTo(0);
+			else if (target) {
+				target.scrollIntoView({ behavior: intent === "fragment" ? "auto" : "instant" });
+				return target;
+			} else if (intent !== "fragment") scrollTo(0);
+			return null;
+		},
+		dispose() {
+			win.removeEventListener("pagehide", onPageHide);
+			win.removeEventListener("pageshow", onPageShow);
+			win.history.scrollRestoration = "auto";
+		}
+	};
+}
+
+//#endregion
+export { createScrollRestoration };

package/dist/features/runtime/studioApp.d.ts

@@ -1,6 +1,7 @@
+import "../../core/createApp.js";
 import { PageRenderInput } from "./runtime.js";
+import "../../lib/draft-scope.js";
 import { QueryClient } from "@tanstack/react-query";
 //#region src/features/runtime/studioApp.d.ts
-type StudioRenderInput = PageRenderInput;
-//#endregion
-export { StudioRenderInput };
+export type StudioRenderInput = PageRenderInput;
+//#endregion

package/dist/features/runtime/studioApp.js

@@ -4,17 +4,13 @@ import { jsx } from "react/jsx-runtime";
 
 //#region src/features/runtime/studioApp.tsx
 function StudioApp(props) {
-	const $ = c(3);
-	if ($[0] !== "67c2b6f45da5572f3c7b8c4d68491571a2d455e4cd7067c0380e91fc49b09d93") {
-		for (let $i = 0; $i < 3; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "67c2b6f45da5572f3c7b8c4d68491571a2d455e4cd7067c0380e91fc49b09d93";
-	}
+	const $ = c(2);
 	let t0;
-	if ($[1] !== props) {
+	if ($[0] !== props) {
 		t0 = /* @__PURE__ */ jsx(PageApp, { ...props });
-		$[1] = props;
-		$[2] = t0;
-	} else t0 = $[2];
+		$[0] = props;
+		$[1] = t0;
+	} else t0 = $[1];
 	return t0;
 }
 

package/dist/features/runtime/studioClient.d.ts

@@ -1,6 +1,4 @@
 import { CamoxApp } from "../../core/createApp.js";
-
 //#region src/features/runtime/studioClient.d.ts
-declare function hydrateStudioWithApp(camoxApp: CamoxApp): void;
-//#endregion
-export { hydrateStudioWithApp };
+export declare function hydrateStudioWithApp(camoxApp: CamoxApp): Promise<void>;
+//#endregion

package/dist/features/runtime/studioClient.js

@@ -1,17 +1,26 @@
+import { createDraftScope } from "../../lib/draft-scope.js";
+import { loadRuntimeChrome } from "./runtimeChromeLoader.js";
 import { readHydrationData } from "./hydrationData.js";
 import { StudioApp } from "./studioApp.js";
-import { QueryClient } from "@tanstack/react-query";
 import { jsx } from "react/jsx-runtime";
+import { QueryClient } from "@tanstack/react-query";
 import { hydrateRoot } from "react-dom/client";
 
 //#region src/features/runtime/studioClient.tsx
-function hydrateStudioWithApp(camoxApp) {
+async function hydrateStudioWithApp(camoxApp) {
 	const root = document.getElementById("root");
 	if (!root) throw new Error("Camox runtime root element was not found.");
 	const queryClient = new QueryClient();
+	const input = readHydrationData();
+	if (input.presentation === "studio") await loadRuntimeChrome();
+	const draftScope = createDraftScope({
+		queryClient,
+		browser: window
+	});
 	hydrateRoot(root, /* @__PURE__ */ jsx(StudioApp, {
 		camoxApp,
-		input: readHydrationData(),
+		draftScope,
+		input,
 		queryClient
 	}));
 }

package/dist/features/runtime/studioServer.d.ts

@@ -1,9 +1,7 @@
 import { CamoxApp } from "../../core/createApp.js";
 import { StudioRenderInput } from "./studioApp.js";
-
 //#region src/features/runtime/studioServer.d.ts
-declare function renderStudioWithApp(input: StudioRenderInput & {
+export declare function renderStudioWithApp(input: StudioRenderInput & {
   camoxApp: CamoxApp;
 }): Promise<string>;
-//#endregion
-export { renderStudioWithApp };
+//#endregion

package/dist/features/runtime/studioServer.js

@@ -1,14 +1,19 @@
+import { createDraftScope } from "../../lib/draft-scope.js";
+import { loadRuntimeChrome } from "./runtimeChromeLoader.js";
 import { StudioApp } from "./studioApp.js";
-import { QueryClient, hydrate } from "@tanstack/react-query";
 import { jsx } from "react/jsx-runtime";
+import { QueryClient, hydrate } from "@tanstack/react-query";
 import { renderToString } from "react-dom/server";
 
 //#region src/features/runtime/studioServer.tsx
 async function renderStudioWithApp(input) {
 	const queryClient = new QueryClient();
 	hydrate(queryClient, input.dehydratedState);
+	if (input.presentation === "studio") await loadRuntimeChrome();
+	const draftScope = createDraftScope({ queryClient });
 	return renderToString(/* @__PURE__ */ jsx(StudioApp, {
 		camoxApp: input.camoxApp,
+		draftScope,
 		input,
 		queryClient
 	}));

package/dist/features/runtime/worker.d.ts

@@ -0,0 +1,6 @@
+//#region src/features/runtime/worker.d.ts
+declare const _default: {
+  fetch(request: Request): Promise<Response>;
+};
+//#endregion
+export { _default as default };

package/dist/features/runtime/worker.js

@@ -0,0 +1,23 @@
+import { fetchLocalhostOnLoopback } from "./loopbackFetch.js";
+import { shouldHandleRequest, withDevHtml } from "./workerRequest.js";
+import { devHtml, handleCamoxRequest, runtimeBasePath } from "virtual:camox/server";
+
+//#region src/features/runtime/worker.ts
+/**
+* The Cloudflare Worker that serves a Camox app: point `main` in `wrangler.jsonc` at
+* `camox/worker`. Static files never reach it: Workers Static Assets serves them first in
+* production, and Vite does in dev.
+*/
+if (devHtml) globalThis.fetch = fetchLocalhostOnLoopback(globalThis.fetch.bind(globalThis));
+function notFound() {
+	return new Response("Not found", { status: 404 });
+}
+var worker_default = { async fetch(request) {
+	if (!shouldHandleRequest(request, runtimeBasePath)) return notFound();
+	const response = await handleCamoxRequest(request);
+	if (!response) return notFound();
+	return withDevHtml(response, devHtml);
+} };
+
+//#endregion
+export { worker_default as default };

package/dist/features/runtime/workerRequest.js

@@ -0,0 +1,44 @@
+import { matchRuntimeOwnedRoute } from "./runtimeRoutes.js";
+
+//#region src/features/runtime/workerRequest.ts
+/** How the Camox Worker picks the requests it answers and prepares its responses. */
+function isDocumentRequest(request) {
+	const accept = request.headers.get("Accept") ?? "";
+	return accept.includes("text/html") || accept.includes("text/markdown") || accept.includes("*/*");
+}
+/** The request's path inside the runtime, or `null` when it falls outside the base path. */
+function getRuntimePathname(pathname, basePath) {
+	if (!basePath) return pathname;
+	if (pathname === basePath) return "/";
+	if (!pathname.startsWith(`${basePath}/`)) return null;
+	return pathname.slice(basePath.length) || "/";
+}
+function shouldHandleRequest(request, basePath) {
+	const pathname = getRuntimePathname(new URL(request.url).pathname, basePath);
+	if (!pathname) return false;
+	if (request.method !== "GET" && request.method !== "HEAD") return false;
+	if (matchRuntimeOwnedRoute(pathname)) return true;
+	if (pathname === "/camox" || pathname.startsWith("/camox/")) return true;
+	if (pathname.endsWith(".md")) return true;
+	if (/\.[a-z0-9]+$/i.test(pathname)) return false;
+	if (pathname.startsWith("/@") || pathname.startsWith("/src/")) return false;
+	if (pathname.startsWith("/__vite")) return false;
+	if (pathname.startsWith("/node_modules/")) return false;
+	return isDocumentRequest(request);
+}
+/** Adds what Vite injects into HTML in dev, such as its client and React Refresh. */
+async function withDevHtml(response, html) {
+	if (!html) return response;
+	if (!(response.headers.get("Content-Type") ?? "").includes("text/html")) return response;
+	const headers = new Headers(response.headers);
+	headers.delete("Content-Length");
+	const document = (await response.text()).replace(/<head(\s[^>]*)?>/i, (tag) => tag + html.head).replace(/<\/body>/i, (tag) => html.body + tag);
+	return new Response(document, {
+		headers,
+		status: response.status,
+		statusText: response.statusText
+	});
+}
+
+//#endregion
+export { shouldHandleRequest, withDevHtml };

package/dist/features/studio/CamoxStudio.d.ts

@@ -1,11 +1,7 @@
 import * as React from "react";
-import * as _$react_jsx_runtime0 from "react/jsx-runtime";
-
 //#region src/features/studio/CamoxStudio.d.ts
-declare const CamoxStudio: ({
-  children
-}: {
+declare const CamoxStudio: ({ children }: {
   children: React.ReactNode;
-}) => _$react_jsx_runtime0.JSX.Element | null;
+}) => React.JSX.Element | null;
 //#endregion
 export { CamoxStudio };

package/dist/features/studio/CamoxStudio.js

@@ -1,27 +1,22 @@
-import { Navigate, useLocation } from "../navigation/navigation.js";
 import { useAuthState, useSignInRedirect } from "../../lib/auth.js";
-import { SharedChromeContext } from "../runtime/SharedChromeContext.js";
+import { Navigate } from "../navigation/navigation.js";
+import { useLocalePath, useLocalizedPath } from "../../lib/view-locale.js";
 import { STUDIO_BASE_PATH } from "./routes.js";
-import { Navbar } from "./components/Navbar.js";
 import { c } from "react/compiler-runtime";
 import * as React from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx } from "react/jsx-runtime";
 
 //#region src/features/studio/CamoxStudio.tsx
 const CamoxStudio = (t0) => {
-	const $ = c(12);
-	if ($[0] !== "5f0b5c1c244f7af982fa1d0e99a04fcbc60b872999562c3737760c88a71ce1d0") {
-		for (let $i = 0; $i < 12; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "5f0b5c1c244f7af982fa1d0e99a04fcbc60b872999562c3737760c88a71ce1d0";
-	}
+	const $ = c(11);
 	const { children } = t0;
 	const { isAuthenticated, isLoading: isLoadingAuth } = useAuthState();
-	const sharedChrome = React.useContext(SharedChromeContext);
-	const { pathname } = useLocation();
+	const pathname = useLocalePath();
+	const localized = useLocalizedPath();
 	const signInRedirect = useSignInRedirect();
 	let t1;
 	let t2;
-	if ($[1] !== isAuthenticated || $[2] !== isLoadingAuth || $[3] !== signInRedirect) {
+	if ($[0] !== isAuthenticated || $[1] !== isLoadingAuth || $[2] !== signInRedirect) {
 		t1 = () => {
 			if (!isAuthenticated && !isLoadingAuth) signInRedirect();
 		};
@@ -30,52 +25,42 @@ const CamoxStudio = (t0) => {
 			isLoadingAuth,
 			signInRedirect
 		];
-		$[1] = isAuthenticated;
-		$[2] = isLoadingAuth;
-		$[3] = signInRedirect;
-		$[4] = t1;
-		$[5] = t2;
+		$[0] = isAuthenticated;
+		$[1] = isLoadingAuth;
+		$[2] = signInRedirect;
+		$[3] = t1;
+		$[4] = t2;
 	} else {
-		t1 = $[4];
-		t2 = $[5];
+		t1 = $[3];
+		t2 = $[4];
 	}
 	React.useEffect(t1, t2);
 	if (!isAuthenticated) return null;
-	if (pathname === STUDIO_BASE_PATH) {
+	if (pathname === "/camox") {
 		let t3;
-		if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
-			t3 = /* @__PURE__ */ jsx(Navigate, {
-				to: "/",
-				replace: true
-			});
+		if ($[5] !== localized) {
+			t3 = localized("/");
+			$[5] = localized;
 			$[6] = t3;
 		} else t3 = $[6];
-		return t3;
-	}
-	if (sharedChrome) {
-		let t3;
-		if ($[7] !== children) {
-			t3 = /* @__PURE__ */ jsx(Fragment, { children });
-			$[7] = children;
-			$[8] = t3;
-		} else t3 = $[8];
-		return t3;
+		let t4;
+		if ($[7] !== t3) {
+			t4 = /* @__PURE__ */ jsx(Navigate, {
+				to: t3,
+				replace: true
+			});
+			$[7] = t3;
+			$[8] = t4;
+		} else t4 = $[8];
+		return t4;
 	}
 	let t3;
-	if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
-		t3 = /* @__PURE__ */ jsx(Navbar, {});
-		$[9] = t3;
-	} else t3 = $[9];
-	let t4;
-	if ($[10] !== children) {
-		t4 = /* @__PURE__ */ jsxs("div", {
-			className: "bg-background flex h-screen flex-col overflow-hidden",
-			children: [t3, children]
-		});
-		$[10] = children;
-		$[11] = t4;
-	} else t4 = $[11];
-	return t4;
+	if ($[9] !== children) {
+		t3 = /* @__PURE__ */ jsx(Fragment, { children });
+		$[9] = children;
+		$[10] = t3;
+	} else t3 = $[10];
+	return t3;
 };
 
 //#endregion