camox 0.44.0 → 0.46.0

package/dist/features/vite/routeGeneration.js

@@ -1,6 +1,6 @@
 import { STUDIO_ROUTE_SEGMENT } from "../studio/routes.js";
-import { mkdirSync, readFileSync, unlinkSync, writeFileSync } from "node:fs";
-import { relative, resolve } from "node:path";
+import { readFileSync, unlinkSync } from "node:fs";
+import { resolve } from "node:path";
 
 //#region src/features/vite/routeGeneration.ts
 const HEADER = `/* ============================================================================
@@ -15,7 +15,8 @@ const HEADER = `/* =============================================================
 // @ts-nocheck
 
 `;
-function removeObsoleteRouteFiles(routesDir) {
+/** Deletes the route files that the old TanStack integration generated. */
+function cleanupGeneratedRouteFiles(routesDir) {
 	const camoxDir = resolve(routesDir, "_camox");
 	const studioDir = resolve(routesDir, "(camox)", "(_studio)");
 	const obsoletePaths = [
@@ -34,7 +35,8 @@ function removeObsoleteRouteFiles(routesDir) {
 		resolve(routesDir, "(camox)", "(_preview)", "og.tsx"),
 		resolve(studioDir, `${STUDIO_ROUTE_SEGMENT}.tsx`),
 		resolve(studioDir, `${STUDIO_ROUTE_SEGMENT}.$.tsx`),
-		resolve(studioDir, `${STUDIO_ROUTE_SEGMENT}.content.tsx`)
+		resolve(studioDir, `${STUDIO_ROUTE_SEGMENT}.content.tsx`),
+		resolve(studioDir, `${STUDIO_ROUTE_SEGMENT}.content.assets.tsx`)
 	];
 	for (const filePath of obsoletePaths) try {
 		if (!readFileSync(filePath, "utf-8").startsWith(HEADER)) continue;
@@ -44,9 +46,6 @@ function removeObsoleteRouteFiles(routesDir) {
 		throw error;
 	}
 }
-function cleanupGeneratedRouteFiles(routesDir) {
-	removeObsoleteRouteFiles(routesDir);
-}
 
 //#endregion
 export { cleanupGeneratedRouteFiles };

package/dist/features/vite/runtimeDev.js

@@ -5,12 +5,11 @@ import { fileURLToPath } from "node:url";
 //#region src/features/vite/runtimeDev.ts
 const sdkRoot = resolve(dirname(fileURLToPath(import.meta.url)), "../../..");
 const VIRTUAL_CAMOX_APP = "virtual:camox/app";
-const RESOLVED_VIRTUAL_CAMOX_APP = "\0" + VIRTUAL_CAMOX_APP;
+const RESOLVED_VIRTUAL_CAMOX_APP = "\0virtual:camox/app";
 const VIRTUAL_CAMOX_DOCUMENT = "virtual:camox/document";
-const RESOLVED_VIRTUAL_CAMOX_DOCUMENT = "\0" + VIRTUAL_CAMOX_DOCUMENT;
+const RESOLVED_VIRTUAL_CAMOX_DOCUMENT = "\0virtual:camox/document";
 const VIRTUAL_CAMOX_SERVER = "virtual:camox/server";
-const RESOLVED_VIRTUAL_CAMOX_SERVER = "\0" + VIRTUAL_CAMOX_SERVER;
-const VIRTUAL_CAMOX_NITRO_HANDLER = "#camox/nitro-handler";
+const RESOLVED_VIRTUAL_CAMOX_SERVER = "\0virtual:camox/server";
 const VIRTUAL_PAGE_SERVER = "virtual:camox/page-server";
 const RESOLVED_VIRTUAL_PAGE_SERVER = "\0" + VIRTUAL_PAGE_SERVER;
 const VIRTUAL_STUDIO_SERVER = "virtual:camox/studio-server";
@@ -23,12 +22,16 @@ const VIRTUAL_STUDIO_CLIENT = "virtual:camox/studio-client";
 const RESOLVED_VIRTUAL_STUDIO_CLIENT = "\0" + VIRTUAL_STUDIO_CLIENT;
 const VIRTUAL_STUDIO_CLIENT_URL = "virtual:camox/studio-client-url";
 const RESOLVED_VIRTUAL_STUDIO_CLIENT_URL = "\0" + VIRTUAL_STUDIO_CLIENT_URL;
+const VIRTUAL_BLOCK_CHUNKS = "virtual:camox/block-chunks";
+const RESOLVED_VIRTUAL_BLOCK_CHUNKS = "\0" + VIRTUAL_BLOCK_CHUNKS;
 const VIRTUAL_APP_STYLESHEET_URL = "virtual:camox/app-stylesheet-url";
 const RESOLVED_VIRTUAL_APP_STYLESHEET_URL = "\0" + VIRTUAL_APP_STYLESHEET_URL;
 const VIRTUAL_STUDIO_CSS = "virtual:camox-studio-css";
 const RESOLVED_VIRTUAL_STUDIO_CSS = "\0" + VIRTUAL_STUDIO_CSS;
 const VIRTUAL_OVERLAY_CSS = "virtual:camox-overlay-css";
 const RESOLVED_VIRTUAL_OVERLAY_CSS = "\0" + VIRTUAL_OVERLAY_CSS;
+const VIRTUAL_DEV_HTML = "virtual:camox/dev-html";
+const RESOLVED_VIRTUAL_DEV_HTML = "\0" + VIRTUAL_DEV_HTML;
 function normalizeImporterPath(importer) {
 	if (!importer) return "";
 	const [path] = importer.split("?");
@@ -62,27 +65,65 @@ function resolveCamoxSourceImport(id) {
 		"camox/_internal/pageClient": resolve(sdkRoot, "src/features/runtime/pageClient.tsx"),
 		"camox/_internal/studioClient": resolve(sdkRoot, "src/features/runtime/studioClient.tsx"),
 		"camox/_internal/studioServer": resolve(sdkRoot, "src/features/runtime/studioServer.tsx"),
-		"camox/_internal/runtime": resolve(sdkRoot, "src/features/runtime/runtime.ts")
+		"camox/_internal/runtime": resolve(sdkRoot, "src/features/runtime/runtime.ts"),
+		"camox/worker": resolve(sdkRoot, "src/features/runtime/worker.ts")
 	}[id];
 	if (!sourceImport || !existsSync(sourceImport)) return;
 	return sourceImport;
 }
-function generateVirtualCamoxApp() {
+/**
+* The server loads every block. The browser loads blocks on demand, one module each, so
+* visitors only download the blocks of the pages they see.
+*/
+function generateVirtualCamoxApp(ssr) {
 	return `import { createApp } from "camox/createApp";
+import { camoxDocument } from "virtual:camox/document";
 
-const rootBlockModules = import.meta.glob("/src/blocks/*.{ts,tsx}", { eager: true });
-const legacyBlockModules = import.meta.glob("/src/camox/blocks/*.{ts,tsx}", { eager: true });
+const rootCollectionModules = import.meta.glob("/src/collections/*.{ts,tsx}", { eager: true });
+const legacyCollectionModules = import.meta.glob("/src/camox/collections/*.{ts,tsx}", { eager: true });
 const rootLayoutModules = import.meta.glob("/src/layouts/*.{ts,tsx}", { eager: true });
 const legacyLayoutModules = import.meta.glob("/src/camox/layouts/*.{ts,tsx}", { eager: true });
 
-const blocks = [...Object.values(rootBlockModules), ...Object.values(legacyBlockModules)]
-  .map((mod) => mod.block)
-  .filter(Boolean);
+${ssr ? `const rootBlockModules = import.meta.glob("/src/blocks/*.{ts,tsx}", { eager: true });
+const legacyBlockModules = import.meta.glob("/src/camox/blocks/*.{ts,tsx}", { eager: true });
+const blockEntries = Object.entries({ ...rootBlockModules, ...legacyBlockModules }).filter(
+  ([, mod]) => mod.block,
+);
+const blocks = blockEntries.map(([, mod]) => mod.block);
+const lazyBlocks = {};
+
+/** Each block's module, which the browser loads, so pages can preload it. */
+export const blockModulePaths = Object.fromEntries(
+  blockEntries.map(([path, mod]) => [mod.block._internal.id, path]),
+);` : `const blockLoaders = {
+  ...import.meta.glob("/src/blocks/*.{ts,tsx}", { import: "block" }),
+  ...import.meta.glob("/src/camox/blocks/*.{ts,tsx}", { import: "block" }),
+};
+const blocks = [];
+// Keyed by file name, which is the block's id by convention.
+const lazyBlocks = Object.fromEntries(
+  Object.entries(blockLoaders).map(([path, load]) => [
+    path.slice(path.lastIndexOf("/") + 1).replace(/\\.tsx?$/, ""),
+    load,
+  ]),
+);`}
 const layouts = [...Object.values(rootLayoutModules), ...Object.values(legacyLayoutModules)]
   .map((mod) => mod.Layout ?? mod.layout)
   .filter(Boolean);
+const collections = [
+  ...Object.values(rootCollectionModules),
+  ...Object.values(legacyCollectionModules),
+]
+  .map((mod) => mod.collection)
+  .filter(Boolean);
 
-export const camoxApp = createApp({ blocks, layouts });
+export const camoxApp = createApp({
+  blocks,
+  lazyBlocks,
+  layouts,
+  collections,
+  document: camoxDocument,
+});
 `;
 }
 function generateVirtualCamoxDocument() {
@@ -143,7 +184,8 @@ export default stylesheetUrl;
 }
 function generateVirtualCamoxServer(runtimeBasePath) {
 	return `import { handleCamoxRequest as handleRuntimeRequest } from "camox/_internal/runtime";
-import { camoxApp } from "virtual:camox/app";
+import { blockModulePaths, camoxApp } from "virtual:camox/app";
+import blockChunks from "virtual:camox/block-chunks";
 import { camoxDocument } from "virtual:camox/document";
 import appStylesheetUrl from "virtual:camox/app-stylesheet-url";
 import studioStylesheetUrl from "virtual:camox-studio-css";
@@ -151,17 +193,22 @@ import pageClientEntryUrl from "virtual:camox/page-client-url";
 import studioClientEntryUrl from "virtual:camox/studio-client-url";
 import { renderPage } from "virtual:camox/page-server";
 import { renderStudio } from "virtual:camox/studio-server";
+import devHtml from "virtual:camox/dev-html";
+
+export { devHtml };
+export const runtimeBasePath = ${JSON.stringify(normalizeRuntimeBasePath(runtimeBasePath))};
 
 export async function handleCamoxRequest(request) {
   return handleRuntimeRequest(request, {
     apiUrl: __CAMOX_API_URL__,
     authenticationUrl: __CAMOX_AUTHENTICATION_URL__,
+    blockPreloads: { modulePaths: blockModulePaths, chunks: blockChunks },
     pageClientEntryUrl,
     studioClientEntryUrl,
-    environmentName: __CAMOX_ENVIRONMENT_NAME__,
+    developmentDraft: __CAMOX_DEVELOPMENT_DRAFT__,
     getCamoxApp: async () => camoxApp,
     getDocument: async () => camoxDocument,
-    projectSlug: __CAMOX_PROJECT_SLUG__,
+    projectUuid: __CAMOX_PROJECT_ID__,
     renderPage,
     renderStudio,
     runtimeBasePath: ${JSON.stringify(runtimeBasePath)},
@@ -171,72 +218,6 @@ export async function handleCamoxRequest(request) {
 }
 `;
 }
-function generateVirtualCamoxNitroHandler(runtimeBasePath) {
-	return `import { defineHandler } from "nitro";
-import { handleCamoxRequest } from "virtual:camox/server";
-
-const runtimeBasePath = ${JSON.stringify(normalizeRuntimeBasePath(runtimeBasePath))};
-
-function isDocumentRequest(request) {
-  const accept = request.headers.get("Accept") ?? request.headers.get("accept") ?? "";
-  return accept.includes("text/html") || accept.includes("*/*");
-}
-
-function getRuntimePathname(pathname) {
-  if (!runtimeBasePath) return pathname;
-  if (pathname === runtimeBasePath) return "/";
-  if (!pathname.startsWith(runtimeBasePath + "/")) return null;
-  return pathname.slice(runtimeBasePath.length) || "/";
-}
-
-function shouldHandleRequest(request) {
-  const url = new URL(request.url);
-  const pathname = getRuntimePathname(url.pathname);
-  if (!pathname) return false;
-  if (request.method !== "GET" && request.method !== "HEAD") return false;
-  if (
-    pathname === "/_camox/data" ||
-    pathname === "/_camox/health" ||
-    pathname === "/_camox/registry"
-  ) {
-    return true;
-  }
-  if (pathname === "/og" || pathname === "/sitemap.xml") return true;
-  if (pathname === "/camox" || pathname.startsWith("/camox/")) 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);
-}
-
-async function transformHtmlResponse(response) {
-  const contentType = response.headers.get("Content-Type") ?? response.headers.get("content-type") ?? "";
-  if (!contentType.includes("text/html")) return response;
-  if (!globalThis.__transform_html__) return response;
-
-  const headers = new Headers(response.headers);
-  headers.delete("Content-Length");
-  headers.delete("content-length");
-
-  return new Response(await globalThis.__transform_html__(await response.text()), {
-    headers,
-    status: response.status,
-    statusText: response.statusText,
-  });
-}
-
-export default defineHandler(async (event) => {
-  if (!shouldHandleRequest(event.req)) {
-    return new Response("Not found", { status: 404 });
-  }
-
-  const response = await handleCamoxRequest(event.req);
-  if (response) return transformHtmlResponse(response);
-  return new Response("Not found", { status: 404 });
-});
-`;
-}
 function resolveRuntimeDevId(id, importer) {
 	const camoxSourceImport = resolveCamoxSourceImport(id);
 	if (camoxSourceImport) return camoxSourceImport;
@@ -252,14 +233,16 @@ function resolveRuntimeDevId(id, importer) {
 	if (id === VIRTUAL_STUDIO_CLIENT) return RESOLVED_VIRTUAL_STUDIO_CLIENT;
 	if (id === VIRTUAL_STUDIO_CLIENT_URL) return RESOLVED_VIRTUAL_STUDIO_CLIENT_URL;
 	if (id === VIRTUAL_APP_STYLESHEET_URL) return RESOLVED_VIRTUAL_APP_STYLESHEET_URL;
+	if (id === VIRTUAL_BLOCK_CHUNKS) return RESOLVED_VIRTUAL_BLOCK_CHUNKS;
 	if (id === VIRTUAL_STUDIO_CSS) return RESOLVED_VIRTUAL_STUDIO_CSS;
 	if (id === VIRTUAL_OVERLAY_CSS) return RESOLVED_VIRTUAL_OVERLAY_CSS;
+	if (id === "virtual:camox/dev-html") return RESOLVED_VIRTUAL_DEV_HTML;
 }
 function loadRuntimeDevModule(id, options = {}) {
-	if (id === RESOLVED_VIRTUAL_CAMOX_APP) return generateVirtualCamoxApp();
+	if (id === RESOLVED_VIRTUAL_CAMOX_APP) return generateVirtualCamoxApp(options.ssr !== false);
+	if (id === RESOLVED_VIRTUAL_BLOCK_CHUNKS) return "export default null;";
 	if (id === RESOLVED_VIRTUAL_CAMOX_DOCUMENT) return generateVirtualCamoxDocument();
 	if (id === RESOLVED_VIRTUAL_CAMOX_SERVER) return generateVirtualCamoxServer(options.runtimeBasePath);
-	if (id === VIRTUAL_CAMOX_NITRO_HANDLER) return generateVirtualCamoxNitroHandler(options.runtimeBasePath);
 	if (id === RESOLVED_VIRTUAL_PAGE_SERVER) return generateVirtualPageServer();
 	if (id === RESOLVED_VIRTUAL_STUDIO_SERVER) return generateVirtualStudioServer();
 	if (id === RESOLVED_VIRTUAL_PAGE_CLIENT) return generateVirtualPageClient();
@@ -273,26 +256,24 @@ function loadRuntimeDevModule(id, options = {}) {
 	}
 	if (id === RESOLVED_VIRTUAL_OVERLAY_CSS) return `export default ${JSON.stringify(readFileSync(resolve(sdkRoot, "dist/studio-overlays.css"), "utf-8"))};`;
 }
+function createRuntimeRegistryPlugin(options = {}) {
+	return {
+		name: "camox-runtime-registry",
+		enforce: "pre",
+		resolveId: resolveRuntimeDevId,
+		load(id, loadOptions) {
+			return loadRuntimeDevModule(id, {
+				...options,
+				ssr: loadOptions?.ssr
+			});
+		}
+	};
+}
 function normalizeRuntimeBasePath(basePath) {
 	if (basePath === void 0) return "";
 	if (!basePath || basePath === "/") return "";
 	return basePath.startsWith("/") ? basePath.replace(/\/+$/, "") : `/${basePath.replace(/\/+$/, "")}`;
 }
-function installRuntimeNitroRoutes(nitro, options) {
-	const routes = options.runtimeBasePath && options.runtimeBasePath !== "/" ? [options.runtimeBasePath, `${options.runtimeBasePath}/**`] : [
-		"/",
-		"/_camox/data",
-		"/_camox/health",
-		"/_camox/registry",
-		"/og",
-		"/sitemap.xml",
-		"/camox",
-		"/camox/**",
-		"/**"
-	];
-	for (const route of routes) nitro.options.routes[route] = VIRTUAL_CAMOX_NITRO_HANDLER;
-	nitro.options.virtual[VIRTUAL_CAMOX_NITRO_HANDLER] = generateVirtualCamoxNitroHandler(options.runtimeBasePath);
-}
 
 //#endregion
-export { installRuntimeNitroRoutes, loadRuntimeDevModule, resolveRuntimeDevId };
+export { RESOLVED_VIRTUAL_DEV_HTML, VIRTUAL_DEV_HTML, createRuntimeRegistryPlugin, loadRuntimeDevModule, resolveRuntimeDevId };

package/dist/features/vite/vite.d.ts

@@ -1,42 +1,62 @@
-import { Plugin } from "vite-plus";
-
+import { ServerApiClient } from "../../lib/api-client-server.js";
+import { Logger, Plugin } from "vite-plus";
 //#region src/features/vite/vite.d.ts
-interface CamoxNitro {
-  hooks: {
-    hook: (name: "compiled", callback: (nitro: CamoxNitro) => void) => void;
-  };
-  options: {
-    noExternals?: boolean | (string | RegExp)[];
-    output: {
-      publicDir: string;
-      serverDir: string;
-    };
-    routes: Record<string, string>;
-    virtual: Record<string, string>;
-  };
+/** What `_internal.afterSync` receives: an API client authenticated as the dev user. */
+export interface CamoxAfterSyncContext {
+  /** Sends the dev session and reads and writes the developer's development draft. */
+  client: ServerApiClient;
+  /** The project's Project ID, which API inputs name `projectUuid`. */
+  projectUuid: string;
+  logger: Logger;
 }
-type CamoxVitePlugin = Plugin & {
-  nitro?: {
-    setup: (nitro: CamoxNitro) => void;
-  };
-};
-interface CamoxPluginOptions {
-  /** Stable, human-readable slug identifying this project (e.g. "prestigious-impala-84") */
-  projectSlug: string;
+export interface CamoxPluginOptions {
+  /**
+   * The project's Project ID, shown in the Camox dashboard: a lowercase UUIDv7 that never changes
+   * (e.g. "01a15fff-627b-7fa1-938b-93ab659c1acc").
+   */
+  projectId: string;
   /** Iconify collection available to all icon fields. */
   icons?: string;
   /** Disable telemetry collection (default: false) */
   disableTelemetry?: boolean;
   /** Internal options (intended for Camox contributors in development, not for public use) */
   _internal?: {
-    /** URL of the Camox API backend, used for data fetching */apiUrl?: string; /** URL of the Camox authentication backend (default: https://app.camox.dev) */
-    authenticationUrl?: string; /** Show Tanstack query devtools (default: false) */
-    enableTanstackDevtools?: boolean; /** Enable experimental features, including feedback (default: false). */
-    enableExperimentalFeatures?: boolean; /** Disable automatic code generation (route files and app file) (default: false) */
-    disableCodeGen?: boolean; /** Mount the Camox-owned dev runtime at this base path. Use "/" for root mode. */
+    /** URL of the Camox API backend, used for data fetching */
+    apiUrl?: string;
+    /** URL of the Camox authentication backend (default: https://app.camox.dev) */
+    authenticationUrl?: string;
+    /** Show Tanstack query devtools (default: false) */
+    enableTanstackDevtools?: boolean;
+    /** Enable experimental features (default: false). */
+    enableExperimentalFeatures?: boolean;
+    /** Disable automatic code generation (route and layout files) (default: false) */
+    disableCodeGen?: boolean;
+    /** Mount the Camox-owned dev runtime at this base path. Use "/" for root mode. */
     runtimeBasePath?: string;
+    /** Opt-in browser opening for this app's generated development sign-in link. */
+    devSignIn?: {
+      open?: boolean;
+      /** Empty marker file shared across restarts of one dev invocation. */
+      openOnceFile?: string;
+    };
+    /**
+     * Dev-only: runs once per dev server start, after the initial definition sync
+     * succeeds. A failure is logged as a warning and never breaks dev.
+     */
+    afterSync?: (context: CamoxAfterSyncContext) => void | Promise<void>;
+    /**
+     * Dev-only: a deploy token for seeding Live. When Live has no pages yet, the first sync
+     * releases the local definitions to Live, and the development draft is published after
+     * `afterSync`, so seeded content becomes Live instead of the draft's changes.
+     */
+    seedLiveDeployToken?: string;
   };
 }
-declare function camox(options: CamoxPluginOptions): CamoxVitePlugin;
-//#endregion
-export { CamoxPluginOptions, camox };
+export declare const CAMOX_OPTIMIZED_DEPS: string[];
+/**
+ * The Worker runs in workerd, so its dependencies are pre-bundled too. Discovering them one
+ * request at a time would reload the Worker for each, so start from the browser's list.
+ */
+export declare const CAMOX_WORKER_OPTIMIZED_DEPS: string[];
+export declare function camox(options: CamoxPluginOptions): Plugin;
+//#endregion