camox 0.7.1 → 0.7.2

package/dist/features/provider/components/CamoxAppContext.js

@@ -1,9 +1,10 @@
 import { c } from "react/compiler-runtime";
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
+
 //#region src/features/provider/components/CamoxAppContext.tsx
-var CamoxAppContext = React.createContext(void 0);
-var CamoxAppProvider = (t0) => {
+const CamoxAppContext = React.createContext(void 0);
+const CamoxAppProvider = (t0) => {
 	const $ = c(3);
 	const { app, children } = t0;
 	let t1;
@@ -23,5 +24,6 @@ function useCamoxApp() {
 	if (!context) throw new Error("useCamoxApp must be used within a CamoxAppProvider");
 	return context;
 }
+
 //#endregion
-export { CamoxAppProvider, useCamoxApp };
+export { CamoxAppProvider, useCamoxApp };

package/dist/features/provider/components/CommandPalette.js

@@ -6,6 +6,7 @@ import { useSelector } from "@xstate/store/react";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandShortcut } from "@camox/ui/command";
+
 //#region src/features/provider/components/CommandPalette.tsx
 function CommandPalette() {
 	const $ = c(35);
@@ -230,5 +231,6 @@ function _temp5() {
 function _temp4() {
 	return true;
 }
+
 //#endregion
-export { CommandPalette, useCommandPaletteActions };
+export { CommandPalette, useCommandPaletteActions };

package/dist/features/provider/useAdminShortcuts.js

@@ -4,6 +4,7 @@ import { checkIfInputFocused } from "../../lib/utils.js";
 import { c } from "react/compiler-runtime";
 import { useSelector } from "@xstate/store/react";
 import * as React from "react";
+
 //#region src/features/provider/useAdminShortcuts.tsx
 /**
 * Hook that listens for global keyboard shortcuts defined in the actionsStore
@@ -95,5 +96,6 @@ function useAdminShortcuts() {
 function _temp(state) {
 	return state.context.actions;
 }
+
 //#endregion
-export { useAdminShortcuts };
+export { useAdminShortcuts };

package/dist/features/routes/ogRoute.d.ts

@@ -1,7 +1,12 @@
-import { CamoxApp } from '../../core/createApp';
-export declare function createOgHandler(camoxApp: CamoxApp): {
-    GET: ({ request }: {
-        request: Request;
-    }) => Promise<Response>;
+import { CamoxApp } from "../../core/createApp.js";
+
+//#region src/features/routes/ogRoute.d.ts
+declare function createOgHandler(camoxApp: CamoxApp): {
+  GET: ({
+    request
+  }: {
+    request: Request;
+  }) => Promise<Response>;
 };
-//# sourceMappingURL=ogRoute.d.ts.map
+//#endregion
+export { createOgHandler };

package/dist/features/routes/ogRoute.js

@@ -15,5 +15,6 @@ function createOgHandler(camoxApp) {
 		});
 	} };
 }
+
 //#endregion
-export { createOgHandler };
+export { createOgHandler };

package/dist/features/routes/pageRoute.d.ts

@@ -1,53 +1,63 @@
-import { QueryClient } from '@tanstack/react-query';
-import { CamoxApp } from '../../core/createApp';
-import { PageStructure } from '../../lib/queries';
-export declare function parseQuality(part: string): number;
-export declare function prefersMarkdown(accept: string): boolean;
-export declare const getOrigin: import('@tanstack/react-start').OptionalFetcher<undefined, undefined, Promise<string>>;
-export declare function createMarkdownMiddleware(apiUrl: string, projectSlug: string, environmentName?: string): import('@tanstack/react-start').RequestMiddlewareAfterServer<{}, undefined, undefined>;
-export declare function createPageLoader(apiUrl: string, projectSlug: string, environmentName?: string): ({ location, context, }: {
-    location: {
-        pathname: string;
-    };
-    context: {
-        queryClient: QueryClient;
-    };
+import { CamoxApp } from "../../core/createApp.js";
+import { PageStructure } from "../../lib/queries.js";
+import { QueryClient } from "@tanstack/react-query";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import * as _$_tanstack_react_start0 from "@tanstack/react-start";
+
+//#region src/features/routes/pageRoute.d.ts
+declare function parseQuality(part: string): number;
+declare function prefersMarkdown(accept: string): boolean;
+declare const getOrigin: _$_tanstack_react_start0.OptionalFetcher<undefined, undefined, Promise<string>>;
+declare function createMarkdownMiddleware(apiUrl: string, projectSlug: string, environmentName?: string): _$_tanstack_react_start0.RequestMiddlewareAfterServer<{}, undefined, undefined>;
+declare function createPageLoader(apiUrl: string, projectSlug: string, environmentName?: string): ({
+  location,
+  context
+}: {
+  location: {
+    pathname: string;
+  };
+  context: {
+    queryClient: QueryClient;
+  };
 }) => Promise<{
+  page: {
     page: {
-        page: {
-            blockIds: number[];
-            id: number;
-            projectId: number;
-            environmentId: number;
-            pathSegment: string;
-            fullPath: string;
-            parentPageId: number | null;
-            layoutId: number;
-            metaTitle: string | null;
-            metaDescription: string | null;
-            aiSeoEnabled: boolean | null;
-            createdAt: number;
-            updatedAt: number;
-        };
-        layout: {
-            id: number;
-            layoutId: string;
-            beforeBlockIds: number[];
-            afterBlockIds: number[];
-        } | null;
-        projectName: string;
+      blockIds: number[];
+      id: number;
+      projectId: number;
+      environmentId: number;
+      pathSegment: string;
+      fullPath: string;
+      parentPageId: number | null;
+      layoutId: number;
+      metaTitle: string | null;
+      metaDescription: string | null;
+      aiSeoEnabled: boolean | null;
+      createdAt: number;
+      updatedAt: number;
     };
-    origin: string;
+    layout: {
+      id: number;
+      layoutId: string;
+      beforeBlockIds: number[];
+      afterBlockIds: number[];
+    } | null;
+    projectName: string;
+  };
+  origin: string;
 }>;
-export declare function createPageHead(camoxApp: CamoxApp): ({ loaderData, }: {
-    loaderData?: {
-        page: PageStructure;
-        origin: string;
-    };
+declare function createPageHead(camoxApp: CamoxApp): ({
+  loaderData
+}: {
+  loaderData?: {
+    page: PageStructure;
+    origin: string;
+  };
 }) => {
-    meta?: undefined;
+  meta?: undefined;
 } | {
-    meta: Record<string, string>[];
+  meta: Record<string, string>[];
 };
-export declare const PageRouteComponent: () => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=pageRoute.d.ts.map
+declare const PageRouteComponent: () => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { PageRouteComponent, createMarkdownMiddleware, createPageHead, createPageLoader, getOrigin, parseQuality, prefersMarkdown };

package/dist/features/routes/pageRoute.js

@@ -9,6 +9,7 @@ import { RPCLink } from "@orpc/client/fetch";
 import { notFound } from "@tanstack/react-router";
 import { createMiddleware, createServerFn } from "@tanstack/react-start";
 import { getRequest } from "@tanstack/react-start/server";
+
 //#region src/features/routes/pageRoute.tsx
 function parseQuality(part) {
 	const match = part.match(/;\s*q=([0-9.]+)/);
@@ -32,7 +33,7 @@ function createServerApiClient(apiUrl, environmentName) {
 		headers
 	}));
 }
-var getOrigin = createServerFn({ method: "GET" }).handler(async () => {
+const getOrigin = createServerFn({ method: "GET" }).handler(async () => {
 	const request = getRequest();
 	return new URL(request.url).origin;
 });
@@ -139,7 +140,7 @@ function createPageHead(camoxApp) {
 		return { meta };
 	};
 }
-var PageRouteComponent = () => {
+const PageRouteComponent = () => {
 	const $ = c(1);
 	let t0;
 	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -148,5 +149,6 @@ var PageRouteComponent = () => {
 	} else t0 = $[0];
 	return t0;
 };
+
 //#endregion
-export { PageRouteComponent, createMarkdownMiddleware, createPageHead, createPageLoader, getOrigin, parseQuality, prefersMarkdown };
+export { PageRouteComponent, createMarkdownMiddleware, createPageHead, createPageLoader, getOrigin, parseQuality, prefersMarkdown };

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

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

package/dist/features/studio/CamoxStudio.js

@@ -4,8 +4,9 @@ import { c } from "react/compiler-runtime";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Navigate, useLocation } from "@tanstack/react-router";
+
 //#region src/features/studio/CamoxStudio.tsx
-var CamoxStudio = (t0) => {
+const CamoxStudio = (t0) => {
 	const $ = c(11);
 	const { children } = t0;
 	const { isAuthenticated, isLoading: isLoadingAuth } = useAuthState();
@@ -53,5 +54,6 @@ var CamoxStudio = (t0) => {
 	} else t4 = $[10];
 	return t4;
 };
+
 //#endregion
-export { CamoxStudio };
+export { CamoxStudio };

package/dist/features/studio/components/EnvironmentMenu.js

@@ -6,8 +6,9 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "@camox/ui/button";
 import { ChevronsUpDown } from "lucide-react";
 import { Badge } from "@camox/ui/badge";
+
 //#region src/features/studio/components/EnvironmentMenu.tsx
-var EnvironmentMenu = () => {
+const EnvironmentMenu = () => {
 	const $ = c(13);
 	const [open, setOpen] = React.useState(false);
 	const authCtx = React.useContext(AuthContext);
@@ -84,5 +85,6 @@ var EnvironmentMenu = () => {
 	} else t5 = $[12];
 	return t5;
 };
+
 //#endregion
-export { EnvironmentMenu };
+export { EnvironmentMenu };

package/dist/features/studio/components/Navbar.js

@@ -15,8 +15,9 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "@camox/ui/button";
 import { Link, useLocation, useNavigate } from "@tanstack/react-router";
 import { Database, Globe, SearchIcon } from "lucide-react";
+
 //#region src/features/studio/components/Navbar.tsx
-var links = [{
+const links = [{
 	to: "/",
 	title: "Preview",
 	children: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Globe, { className: "h-4 w-4" }), "Preview"] }),
@@ -27,7 +28,7 @@ var links = [{
 	children: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Database, { className: "h-4 w-4" }), "Content"] }),
 	icon: "FileText"
 }];
-var Navbar = () => {
+const Navbar = () => {
 	const $ = c(23);
 	const projectSlug = useProjectSlug();
 	let t0;
@@ -199,5 +200,6 @@ function _temp2() {
 function _temp() {
 	return studioStore.send({ type: "openCommandPalette" });
 }
+
 //#endregion
-export { Navbar, useNavbarActions };
+export { Navbar, useNavbarActions };

package/dist/features/studio/components/ProjectMenu.js

@@ -9,8 +9,9 @@ import { Link } from "@tanstack/react-router";
 import { ChevronDown, Globe, Info, Settings, Users } from "lucide-react";
 import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger } from "@camox/ui/dropdown-menu";
 import { Skeleton } from "@camox/ui/skeleton";
+
 //#region src/features/studio/components/ProjectMenu.tsx
-var Favicon = (t0) => {
+const Favicon = (t0) => {
 	const $ = c(18);
 	const { size: t1 } = t0;
 	const size = t1 === void 0 ? 16 : t1;
@@ -106,7 +107,7 @@ var Favicon = (t0) => {
 	} else t7 = $[17];
 	return t7;
 };
-var ProjectMenu = () => {
+const ProjectMenu = () => {
 	const $ = c(40);
 	const authCtx = React.useContext(AuthContext);
 	let t0;
@@ -318,5 +319,6 @@ function _temp() {
 	}
 	return null;
 }
+
 //#endregion
-export { ProjectMenu };
+export { ProjectMenu };

package/dist/features/studio/components/UserButton.js

@@ -7,8 +7,9 @@ import { Button } from "@camox/ui/button";
 import { LogOut, Monitor, Moon, Settings, Sun, User } from "lucide-react";
 import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from "@camox/ui/dropdown-menu";
 import { Avatar, AvatarFallback, AvatarImage } from "@camox/ui/avatar";
+
 //#region src/features/studio/components/UserButton.tsx
-var UserButton = () => {
+const UserButton = () => {
 	const $ = c(3);
 	const { isAuthenticated, isLoading } = useAuthState();
 	const { setTheme } = useTheme();
@@ -105,5 +106,6 @@ function AuthenticatedUserButton({ setTheme }) {
 		]
 	})] });
 }
+
 //#endregion
-export { UserButton };
+export { UserButton };

package/dist/features/studio/studioStore.js

@@ -1,6 +1,7 @@
 import { createStore } from "@xstate/store";
+
 //#region src/features/studio/studioStore.ts
-var studioStore = createStore({
+const studioStore = createStore({
 	context: {
 		isCommandPaletteOpen: false,
 		commandPalettePages: []
@@ -40,5 +41,6 @@ var studioStore = createStore({
 		}
 	}
 });
+
 //#endregion
-export { studioStore };
+export { studioStore };

package/dist/features/studio/useTheme.js

@@ -1,6 +1,7 @@
 import { actionsStore } from "../provider/actionsStore.js";
 import { c } from "react/compiler-runtime";
 import * as React from "react";
+
 //#region src/features/studio/useTheme.ts
 function useTheme() {
 	const $ = c(8);
@@ -137,5 +138,6 @@ function _temp4() {}
 function _temp3() {
 	return true;
 }
+
 //#endregion
-export { useTheme, useThemeActions };
+export { useTheme, useThemeActions };

package/dist/features/vite/appGeneration.js

@@ -1,8 +1,9 @@
 import { writeIfChanged } from "./utils.js";
 import { readFileSync, writeFileSync } from "node:fs";
 import { relative, resolve } from "node:path";
+
 //#region src/features/vite/appGeneration.ts
-var HEADER = `/* ============================================================================
+const HEADER = `/* ============================================================================
  * AUTO-GENERATED BY CAMOX — DO NOT EDIT
  *
  * This file is managed by the Camox Vite plugin and should stay gitignored.
@@ -63,5 +64,6 @@ function watchAppFile(server, appRoot) {
 		writeFileSync(deletedPath, expected, "utf-8");
 	});
 }
+
 //#endregion
-export { generateAppFile, watchAppFile };
+export { generateAppFile, watchAppFile };

package/dist/features/vite/blockBoilerplate.js

@@ -1,7 +1,8 @@
 import { readFileSync, writeFileSync } from "node:fs";
 import { basename, resolve } from "node:path";
+
 //#region src/features/vite/blockBoilerplate.ts
-var MAX_EMPTY_BLOCK_CHARACTER_COUNT = 50;
+const MAX_EMPTY_BLOCK_CHARACTER_COUNT = 50;
 function kebabToCamel(str) {
 	return str.replace(/-([a-z])/g, (_, char) => char.toUpperCase());
 }
@@ -55,5 +56,6 @@ function watchNewBlockFiles(server) {
 		}
 	});
 }
+
 //#endregion
-export { watchNewBlockFiles };
+export { watchNewBlockFiles };

package/dist/features/vite/definitionsSync.js

@@ -1,8 +1,9 @@
 import { createServerApiClient } from "../../lib/api-client-server.js";
 import path from "node:path";
 import { createServer, isRunnableDevEnvironment } from "vite";
+
 //#region src/features/vite/definitionsSync.ts
-var SYNC_DEBOUNCE_DELAY_MS = 100;
+const SYNC_DEBOUNCE_DELAY_MS = 100;
 /**
 * Sync block and layout definitions to the API.
 * This is the core sync logic, independent of ViteDevServer.
@@ -71,7 +72,7 @@ async function syncDefinitionsToApi(options) {
 function getBlockIdFromFilePath(filePath) {
 	return path.basename(filePath, path.extname(filePath));
 }
-var CAMOX_APP_PATH = "./src/camox/app.ts";
+const CAMOX_APP_PATH = "./src/camox/app.ts";
 /**
 * Load a module using SSR. Uses the server's SSR environment runner if available,
 * otherwise falls back to a temporary Vite server (needed when Nitro or other
@@ -217,5 +218,6 @@ async function syncDefinitions(server, options) {
 	server.watcher.on("add", handleLayoutFileChange);
 	server.watcher.on("unlink", handleBlockFileDelete);
 }
+
 //#endregion
-export { syncDefinitions, syncDefinitionsToApi };
+export { syncDefinitions, syncDefinitionsToApi };

package/dist/features/vite/routeGeneration.js

@@ -1,8 +1,9 @@
 import { writeIfChanged } from "./utils.js";
 import { mkdirSync, readFileSync, writeFileSync } from "node:fs";
 import { relative, resolve } from "node:path";
+
 //#region src/features/vite/routeGeneration.ts
-var HEADER = `/* ============================================================================
+const HEADER = `/* ============================================================================
  * AUTO-GENERATED BY CAMOX — DO NOT EDIT
  *
  * This file is managed by the Camox Vite plugin and should stay gitignored.
@@ -190,5 +191,6 @@ function watchRouteFiles(options) {
 		writeFileSync(deletedPath, expected, "utf-8");
 	});
 }
+
 //#endregion
-export { generateRouteFiles, watchRouteFiles };
+export { generateRouteFiles, watchRouteFiles };

package/dist/features/vite/skillGeneration.js

@@ -2,13 +2,14 @@ import { writeIfChanged } from "./utils.js";
 import { lstatSync, mkdirSync, readFileSync, readdirSync, readlinkSync, symlinkSync, writeFileSync } from "node:fs";
 import { dirname, join, relative, resolve } from "node:path";
 import { fileURLToPath } from "node:url";
+
 //#region src/features/vite/skillGeneration.ts
-var HEADER = `<!-- AUTO-GENERATED BY CAMOX — DO NOT EDIT
+const HEADER = `<!-- AUTO-GENERATED BY CAMOX — DO NOT EDIT
 This file is managed by the Camox Vite plugin.
 Any manual edits will be automatically reverted by the dev server. -->
 
 `;
-var sdkRoot = resolve(dirname(fileURLToPath(import.meta.url)), "../../..");
+const sdkRoot = resolve(dirname(fileURLToPath(import.meta.url)), "../../..");
 function getSkillNames() {
 	const skillsDir = resolve(sdkRoot, "skills");
 	return readdirSync(skillsDir).filter((name) => lstatSync(resolve(skillsDir, name)).isDirectory());
@@ -65,5 +66,6 @@ function watchSkillFiles(server, appRoot) {
 		writeFileSync(deletedPath, expected, "utf-8");
 	});
 }
+
 //#endregion
-export { generateSkillFiles, watchSkillFiles };
+export { generateSkillFiles, watchSkillFiles };

package/dist/features/vite/utils.js

@@ -1,4 +1,5 @@
 import { existsSync, readFileSync, writeFileSync } from "node:fs";
+
 //#region src/features/vite/utils.ts
 function writeIfChanged(filePath, content) {
 	if (existsSync(filePath)) {
@@ -6,5 +7,6 @@ function writeIfChanged(filePath, content) {
 	}
 	writeFileSync(filePath, content, "utf-8");
 }
+
 //#endregion
-export { writeIfChanged };
+export { writeIfChanged };

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

@@ -1,22 +1,21 @@
-import { Plugin } from 'vite';
-export interface CamoxPluginOptions {
-    /** Stable, human-readable slug identifying this project (e.g. "prestigious-impala-84") */
-    projectSlug: string;
-    /** Secret used to authenticate definition sync requests with the API */
-    syncSecret: string;
-    /** Disable PostHog analytics collection (default: false) */
-    disableAnalytics?: 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://camox.ai) */
-        authenticationUrl?: string;
-        /** Show Tanstack query devtools (default: false) */
-        enableTanstackDevtools?: boolean;
-        /** Disable automatic code generation (route files, app file, skill files) (default: false) */
-        disableCodeGen?: boolean;
-    };
+import { Plugin } from "vite";
+
+//#region src/features/vite/vite.d.ts
+interface CamoxPluginOptions {
+  /** Stable, human-readable slug identifying this project (e.g. "prestigious-impala-84") */
+  projectSlug: string;
+  /** Secret used to authenticate definition sync requests with the API */
+  syncSecret: string;
+  /** Disable PostHog analytics collection (default: false) */
+  disableAnalytics?: 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://camox.ai) */
+    authenticationUrl?: string; /** Show Tanstack query devtools (default: false) */
+    enableTanstackDevtools?: boolean; /** Disable automatic code generation (route files, app file, skill files) (default: false) */
+    disableCodeGen?: boolean;
+  };
 }
-export declare function camox(options: CamoxPluginOptions): Plugin;
-//# sourceMappingURL=vite.d.ts.map
+declare function camox(options: CamoxPluginOptions): Plugin;
+//#endregion
+export { CamoxPluginOptions, camox };

package/dist/features/vite/vite.js

@@ -8,13 +8,16 @@ import { homedir } from "node:os";
 import { dirname, join, resolve } from "node:path";
 import { fileURLToPath } from "node:url";
 import { createServer } from "vite";
+
 //#region src/features/vite/vite.ts
-var sdkRoot = resolve(dirname(fileURLToPath(import.meta.url)), "../../..");
-var VIRTUAL_STUDIO_CSS = "virtual:camox-studio-css";
-var RESOLVED_VIRTUAL_STUDIO_CSS = "\0" + VIRTUAL_STUDIO_CSS;
-var PRODUCTION_API_URL = "https://api.camox.ai";
+const sdkRoot = resolve(dirname(fileURLToPath(import.meta.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 PRODUCTION_API_URL = "https://api.camox.ai";
 /** Authentication URL to use for Camox authentication (production Camox web app) */
-var DEFAULT_AUTHENTICATION_URL = "https://camox.ai";
+const DEFAULT_AUTHENTICATION_URL = "https://camox.ai";
 function resolveEnvironmentName(isDev, authenticationUrl) {
 	if (!isDev) return "production";
 	const authFile = join(homedir(), ".camox", "auth.json");
@@ -40,19 +43,25 @@ function camox(options) {
 		name: "camox",
 		resolveId(id) {
 			if (id === VIRTUAL_STUDIO_CSS) return RESOLVED_VIRTUAL_STUDIO_CSS;
+			if (id === VIRTUAL_OVERLAY_CSS) return RESOLVED_VIRTUAL_OVERLAY_CSS;
 		},
 		load(id) {
-			if (id !== RESOLVED_VIRTUAL_STUDIO_CSS) return;
-			const cssPath = resolve(sdkRoot, "dist/studio.css");
-			if (isBuild) {
-				const css = readFileSync(cssPath, "utf-8");
-				return `export default import.meta.ROLLUP_FILE_URL_${this.emitFile({
-					type: "asset",
-					name: "studio.css",
-					source: css
-				})};`;
+			if (id === RESOLVED_VIRTUAL_STUDIO_CSS) {
+				const cssPath = resolve(sdkRoot, "dist/studio.css");
+				if (isBuild) {
+					const css = readFileSync(cssPath, "utf-8");
+					return `export default import.meta.ROLLUP_FILE_URL_${this.emitFile({
+						type: "asset",
+						name: "studio.css",
+						source: css
+					})};`;
+				}
+				return `export default "/@fs/${cssPath}";`;
+			}
+			if (id === RESOLVED_VIRTUAL_OVERLAY_CSS) {
+				const css = readFileSync(resolve(sdkRoot, "src/features/preview/studio-overlays.css"), "utf-8");
+				return `export default ${JSON.stringify(css)};`;
 			}
-			return `export default "/@fs/${cssPath}";`;
 		},
 		config(_config, env) {
 			isBuild = env.command === "build";
@@ -134,5 +143,6 @@ function camox(options) {
 		}
 	};
 }
+
 //#endregion
-export { camox };
+export { camox };

package/dist/hooks/use-file-upload.js

@@ -1,8 +1,10 @@
 "use client";
+
 import { getAuthCookieHeader } from "../lib/auth.js";
 import { getApiUrl, getEnvironmentName } from "../lib/api-client.js";
 import { trackClientEvent } from "../lib/analytics-client.js";
 import { useCallback, useRef, useState } from "react";
+
 //#region src/hooks/use-file-upload.ts
 function useFileUpload(options) {
 	const [uploads, setUploads] = useState([]);
@@ -84,5 +86,6 @@ function useFileUpload(options) {
 		}, [])
 	};
 }
+
 //#endregion
-export { useFileUpload };
+export { useFileUpload };