camox 0.0.0 → 0.1.2-alpha.2

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

@@ -0,0 +1,135 @@
+import { api } from 'camox/server/api';
+import { CamoxApp } from '../../core/createApp';
+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(convexUrl: string): import('@tanstack/react-start').RequestMiddlewareAfterServer<{}, undefined, undefined>;
+export declare function createPageLoader(convexUrl: string): ({ location }: {
+    location: {
+        pathname: string;
+    };
+}) => Promise<{
+    page: {
+        page: {
+            _id: import('convex/values').GenericId<"pages">;
+            _creationTime: number;
+            parentPageId?: import('convex/values').GenericId<"pages"> | undefined;
+            metaTitle?: string | undefined;
+            metaDescription?: string | undefined;
+            aiSeoEnabled?: boolean | undefined;
+            createdAt: number;
+            updatedAt: number;
+            projectId: import('convex/values').GenericId<"projects">;
+            pathSegment: string;
+            fullPath: string;
+            layoutId: import('convex/values').GenericId<"layouts">;
+        };
+        projectName: string;
+        blocks: {
+            content: import('@camox/backend-content/lib/contentAssembly').ContentRecord;
+            _id: import('convex/values').GenericId<"blocks">;
+            _creationTime: number;
+            layoutId?: import('convex/values').GenericId<"layouts"> | undefined;
+            pageId?: import('convex/values').GenericId<"pages"> | undefined;
+            settings?: any;
+            placement?: "before" | "after" | undefined;
+            summary: string;
+            type: string;
+            position: string;
+            createdAt: number;
+            updatedAt: number;
+        }[];
+        layout: {
+            _id: import('convex/values').GenericId<"layouts">;
+            layoutId: string;
+            blocks: {
+                content: import('@camox/backend-content/lib/contentAssembly').ContentRecord;
+                _id: import('convex/values').GenericId<"blocks">;
+                _creationTime: number;
+                layoutId?: import('convex/values').GenericId<"layouts"> | undefined;
+                pageId?: import('convex/values').GenericId<"pages"> | undefined;
+                settings?: any;
+                placement?: "before" | "after" | undefined;
+                summary: string;
+                type: string;
+                position: string;
+                createdAt: number;
+                updatedAt: number;
+            }[];
+            beforeBlocks: {
+                content: import('@camox/backend-content/lib/contentAssembly').ContentRecord;
+                _id: import('convex/values').GenericId<"blocks">;
+                _creationTime: number;
+                layoutId?: import('convex/values').GenericId<"layouts"> | undefined;
+                pageId?: import('convex/values').GenericId<"pages"> | undefined;
+                settings?: any;
+                placement?: "before" | "after" | undefined;
+                summary: string;
+                type: string;
+                position: string;
+                createdAt: number;
+                updatedAt: number;
+            }[];
+            afterBlocks: {
+                content: import('@camox/backend-content/lib/contentAssembly').ContentRecord;
+                _id: import('convex/values').GenericId<"blocks">;
+                _creationTime: number;
+                layoutId?: import('convex/values').GenericId<"layouts"> | undefined;
+                pageId?: import('convex/values').GenericId<"pages"> | undefined;
+                settings?: any;
+                placement?: "before" | "after" | undefined;
+                summary: string;
+                type: string;
+                position: string;
+                createdAt: number;
+                updatedAt: number;
+            }[];
+        };
+    } | {
+        page: {
+            _id: import('convex/values').GenericId<"pages">;
+            _creationTime: number;
+            parentPageId?: import('convex/values').GenericId<"pages"> | undefined;
+            metaTitle?: string | undefined;
+            metaDescription?: string | undefined;
+            aiSeoEnabled?: boolean | undefined;
+            createdAt: number;
+            updatedAt: number;
+            projectId: import('convex/values').GenericId<"projects">;
+            pathSegment: string;
+            fullPath: string;
+            layoutId: import('convex/values').GenericId<"layouts">;
+        };
+        projectName: string;
+        blocks: {
+            content: import('@camox/backend-content/lib/contentAssembly').ContentRecord;
+            _id: import('convex/values').GenericId<"blocks">;
+            _creationTime: number;
+            layoutId?: import('convex/values').GenericId<"layouts"> | undefined;
+            pageId?: import('convex/values').GenericId<"pages"> | undefined;
+            settings?: any;
+            placement?: "before" | "after" | undefined;
+            summary: string;
+            type: string;
+            position: string;
+            createdAt: number;
+            updatedAt: number;
+        }[];
+        layout?: undefined;
+    };
+    origin: string;
+}>;
+export declare function createPageHead(camoxApp: CamoxApp): ({ loaderData, }: {
+    loaderData?: {
+        page: NonNullable<typeof api.pages.getPage._returnType>;
+        origin: string;
+    };
+}) => {
+    meta?: undefined;
+} | {
+    meta: Record<string, string>[];
+};
+export declare const PageRouteComponent: ({ page, }: {
+    page: NonNullable<typeof api.pages.getPage._returnType>;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=pageRoute.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"pageRoute.d.ts","sourceRoot":"","sources":["../../../src/features/routes/pageRoute.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAGvC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAQrD,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAGjD;AAED,wBAAgB,eAAe,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAYvD;AAMD,eAAO,MAAM,SAAS,wFAIpB,CAAC;AAMH,wBAAgB,wBAAwB,CAAC,SAAS,EAAE,MAAM,0FA2BzD;AAED,wBAAgB,gBAAgB,CAAC,SAAS,EAAE,MAAM,IAElC,cAAc;IAAE,QAAQ,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAA;CAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAc/D;AAED,wBAAgB,cAAc,CAAC,QAAQ,EAAE,QAAQ,IACvC,iBAEL;IACD,UAAU,CAAC,EAAE;QACX,IAAI,EAAE,WAAW,CAAC,OAAO,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;QACxD,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;CACH;;;;EAqDF;AAMD,eAAO,MAAM,kBAAkB,GAAI,WAEhC;IACD,IAAI,EAAE,WAAW,CAAC,OAAO,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;CACzD,4CAMA,CAAC"}

package/dist/features/routes/pageRoute.js

@@ -0,0 +1,112 @@
+import { CamoxPreview, PageContent } from "../preview/CamoxPreview.js";
+import { trackEvent } from "../../lib/analytics.js";
+import { api } from "camox/server/api";
+import { jsx } from "react/jsx-runtime";
+import { notFound } from "@tanstack/react-router";
+import { ConvexHttpClient } from "convex/browser";
+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.]+)/);
+	return match ? parseFloat(match[1]) : 1;
+}
+function prefersMarkdown(accept) {
+	let markdownQ = -1;
+	let htmlQ = -1;
+	for (const part of accept.split(",")) {
+		const trimmed = part.trim();
+		if (trimmed.startsWith("text/markdown")) markdownQ = parseQuality(trimmed);
+		else if (trimmed.startsWith("text/html")) htmlQ = parseQuality(trimmed);
+	}
+	return markdownQ > 0 && markdownQ >= htmlQ;
+}
+var getOrigin = createServerFn({ method: "GET" }).handler(async () => {
+	const request = getRequest();
+	return new URL(request.url).origin;
+});
+function createMarkdownMiddleware(convexUrl) {
+	return createMiddleware().server(async ({ next, request }) => {
+		if (prefersMarkdown(request.headers.get("Accept") ?? "")) {
+			const url = new URL(request.url);
+			const client = new ConvexHttpClient(convexUrl);
+			const page = await client.query(api.pages.getPage, { fullPath: url.pathname });
+			if (page) {
+				const markdown = await client.query(api.blocks.getPageMarkdown, { pageId: page.page._id });
+				if (markdown) {
+					trackEvent("markdown_served", {
+						pathname: url.pathname,
+						projectId: page.page.projectId,
+						projectName: page.projectName
+					});
+					throw new Response(markdown, { headers: { "Content-Type": "text/markdown; charset=utf-8" } });
+				}
+			}
+		}
+		return next();
+	});
+}
+function createPageLoader(convexUrl) {
+	const convexHttpClient = new ConvexHttpClient(convexUrl);
+	return async ({ location }) => {
+		const [page, origin] = await Promise.all([convexHttpClient.query(api.pages.getPage, { fullPath: location.pathname }), getOrigin()]);
+		if (!page) throw notFound();
+		return {
+			page,
+			origin
+		};
+	};
+}
+function createPageHead(camoxApp) {
+	return ({ loaderData }) => {
+		if (!loaderData) return {};
+		const { page, origin } = loaderData;
+		const pageMetaTitle = page.page.metaTitle ?? page.page.pathSegment;
+		const meta = [];
+		let title = pageMetaTitle;
+		if (page.layout) {
+			const layout = camoxApp.getLayoutById(page.layout.layoutId);
+			if (layout) {
+				title = layout.buildMetaTitle({
+					pageMetaTitle,
+					projectName: page.projectName,
+					pageFullPath: page.page.fullPath
+				});
+				meta.push({ title });
+			}
+		}
+		if (page.page.metaDescription) meta.push({
+			name: "description",
+			content: page.page.metaDescription
+		});
+		const ogImageUrl = `${origin}/og?${new URLSearchParams({
+			...page.layout && { layoutId: page.layout.layoutId },
+			title: pageMetaTitle,
+			...page.page.metaDescription && { description: page.page.metaDescription },
+			...page.projectName && { projectName: page.projectName }
+		}).toString()}`;
+		meta.push({
+			property: "og:title",
+			content: title
+		}, {
+			property: "og:image",
+			content: ogImageUrl
+		}, {
+			property: "og:image:width",
+			content: "1200"
+		}, {
+			property: "og:image:height",
+			content: "630"
+		});
+		if (page.page.metaDescription) meta.push({
+			property: "og:description",
+			content: page.page.metaDescription
+		});
+		return { meta };
+	};
+}
+var PageRouteComponent = ({ page }) => {
+	return /* @__PURE__ */ jsx(CamoxPreview, { children: /* @__PURE__ */ jsx(PageContent, { page }) });
+};
+//#endregion
+export { PageRouteComponent, createMarkdownMiddleware, createPageHead, createPageLoader, getOrigin, parseQuality, prefersMarkdown };

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

@@ -0,0 +1,7 @@
+import * as React from "react";
+interface CamoxStudioProps {
+    children: React.ReactNode;
+}
+declare const CamoxStudio: ({ children }: CamoxStudioProps) => import("react/jsx-runtime").JSX.Element | null;
+export { CamoxStudio };
+//# sourceMappingURL=CamoxStudio.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CamoxStudio.d.ts","sourceRoot":"","sources":["../../../src/features/studio/CamoxStudio.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,UAAU,gBAAgB;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,QAAA,MAAM,WAAW,GAAI,cAAc,gBAAgB,mDAsBlD,CAAC;AAEF,OAAO,EAAE,WAAW,EAAE,CAAC"}

package/dist/features/studio/CamoxStudio.js

@@ -0,0 +1,24 @@
+import { Navbar } from "./components/Navbar.js";
+import { useConvexAuth } from "convex/react";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useLocation, useNavigate } from "@tanstack/react-router";
+import { useSignInRedirect } from "@/lib/auth";
+//#region src/features/studio/CamoxStudio.tsx
+var CamoxStudio = ({ children }) => {
+	const { isAuthenticated } = useConvexAuth();
+	const { pathname } = useLocation();
+	const navigate = useNavigate();
+	const signInRedirect = useSignInRedirect();
+	if (!isAuthenticated) {
+		signInRedirect();
+		return null;
+	}
+	if (pathname === "cmx-studio") navigate("/");
+	return /* @__PURE__ */ jsxs("div", {
+		className: "bg-background flex h-screen flex-col overflow-hidden",
+		children: [/* @__PURE__ */ jsx(Navbar, {}), children]
+	});
+};
+//#endregion
+export { CamoxStudio };

package/dist/features/studio/components/Navbar.d.ts

@@ -0,0 +1,4 @@
+declare const Navbar: () => import("react/jsx-runtime").JSX.Element;
+declare function useNavbarActions(): void;
+export { Navbar, useNavbarActions };
+//# sourceMappingURL=Navbar.d.ts.map

package/dist/features/studio/components/Navbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Navbar.d.ts","sourceRoot":"","sources":["../../../../src/features/studio/components/Navbar.tsx"],"names":[],"mappings":"AAiDA,QAAA,MAAM,MAAM,+CAsDX,CAAC;AAEF,iBAAS,gBAAgB,SAyBxB;AAED,OAAO,EAAE,MAAM,EAAE,gBAAgB,EAAE,CAAC"}

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

@@ -0,0 +1,95 @@
+import { actionsStore } from "../../provider/actionsStore.js";
+import { studioStore } from "../studioStore.js";
+import { ProjectMenu } from "./ProjectMenu.js";
+import { UserButton } from "./UserButton.js";
+import { Kbd } from "@camox/ui/kbd";
+import { api } from "camox/server/api";
+import { useQuery } from "convex/react";
+import * as React from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Link, useLocation, useNavigate } from "@tanstack/react-router";
+import { cn } from "@/lib/utils";
+import { Button } from "@camox/ui/button";
+import { Database, Globe, SearchIcon } from "lucide-react";
+import { useIsPreviewSheetOpen } from "@/features/preview/components/PreviewSideSheet";
+//#region src/features/studio/components/Navbar.tsx
+var links = [{
+	to: "/",
+	title: "Preview",
+	children: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Globe, { className: "h-4 w-4" }), "Preview"] }),
+	icon: "Globe"
+}, {
+	to: "/cmx-studio/content",
+	title: "Content",
+	children: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Database, { className: "h-4 w-4" }), "Content"] }),
+	icon: "FileText"
+}];
+var Navbar = () => {
+	const pages = useQuery(api.pages.listPages);
+	const isMac = React.useMemo(() => navigator.userAgent.toUpperCase().indexOf("MAC") >= 0, []);
+	const { pathname } = useLocation();
+	return /* @__PURE__ */ jsxs("nav", {
+		className: "relative flex items-center justify-between gap-4 border-b-2 bg-transparent px-2 py-2",
+		children: [
+			/* @__PURE__ */ jsx("div", { className: cn("absolute top-0 left-0 w-full h-[calc(100%+2px)] bg-black transition-opacity z-10 will-change-auto pointer-events-none", useIsPreviewSheetOpen() ? "opacity-60" : "opacity-0") }),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex flex-row gap-2",
+				children: [/* @__PURE__ */ jsx(ProjectMenu, {}), /* @__PURE__ */ jsx("ul", {
+					className: "flex items-center gap-1",
+					children: links.map((link, index) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Link, {
+						to: link.to,
+						className: cn("flex gap-2 items-center rounded-md px-4 py-2 text-sm font-medium", "hover:bg-accent hover:text-accent-foreground outline-none transition-[color,box-shadow] focus-visible:ring-ring/50 focus-visible:ring-[3px] focus-visible:outline-1", pages?.some((page) => page.fullPath === pathname) && index === 0 ? "bg-accent hover:bg-accent text-accent-foreground" : "text-muted-foreground"),
+						activeProps: { className: "bg-accent hover:bg-accent text-accent-foreground!" },
+						children: link.children
+					}) }, link.to))
+				})]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-2",
+				children: [/* @__PURE__ */ jsxs(Button, {
+					variant: "outline",
+					onClick: () => studioStore.send({ type: "openCommandPalette" }),
+					children: [
+						/* @__PURE__ */ jsx(SearchIcon, { className: "text-muted-foreground size-4" }),
+						/* @__PURE__ */ jsx("span", {
+							className: "text-muted-foreground",
+							children: "Quick find"
+						}),
+						/* @__PURE__ */ jsxs(Kbd, {
+							className: "ml-4",
+							children: [isMac ? "⌘" : "Ctrl", " K"]
+						})
+					]
+				}), /* @__PURE__ */ jsx(UserButton, {})]
+			})
+		]
+	});
+};
+function useNavbarActions() {
+	const navigate = useNavigate();
+	React.useEffect(() => {
+		const actions = links.map((link, index) => ({
+			id: `navigate-to-${link.to}`,
+			label: `Go to ${link.title}`,
+			groupLabel: "Navigation",
+			checkIfAvailable: () => true,
+			execute: () => {
+				navigate({ to: link.to });
+			},
+			shortcut: { key: String(index + 1) },
+			icon: link.icon
+		}));
+		actionsStore.send({
+			type: "registerManyActions",
+			actions
+		});
+		return () => {
+			actionsStore.send({
+				type: "unregisterManyActions",
+				ids: actions.map((a) => a.id)
+			});
+		};
+	}, [navigate]);
+}
+//#endregion
+export { Navbar, useNavbarActions };

package/dist/features/studio/components/ProjectMenu.d.ts

@@ -0,0 +1,2 @@
+export declare const ProjectMenu: () => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ProjectMenu.d.ts.map

package/dist/features/studio/components/ProjectMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProjectMenu.d.ts","sourceRoot":"","sources":["../../../../src/features/studio/components/ProjectMenu.tsx"],"names":[],"mappings":"AAiEA,eAAO,MAAM,WAAW,+CAiFvB,CAAC"}

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

@@ -0,0 +1,132 @@
+import { Popover, PopoverContent, PopoverTrigger } from "@camox/ui/popover";
+import { api } from "camox/server/api";
+import { useQuery } from "convex/react";
+import * as React from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "@camox/ui/button";
+import { ChevronDown, Globe, Settings, Users } from "lucide-react";
+import { Separator } from "@camox/ui/separator";
+import { Skeleton } from "@camox/ui/skeleton";
+import { AuthContext } from "@/lib/auth";
+//#region src/features/studio/components/ProjectMenu.tsx
+var Favicon = ({ size = 16 }) => {
+	const [faviconUrl, setFaviconUrl] = React.useState(null);
+	const [hasError, setHasError] = React.useState(false);
+	React.useEffect(() => {
+		const getFaviconUrl = () => {
+			for (const selector of [
+				"link[rel=\"icon\"]",
+				"link[rel=\"shortcut icon\"]",
+				"link[rel=\"apple-touch-icon\"]"
+			]) {
+				const link = document.querySelector(selector);
+				if (link?.href) return link.href;
+			}
+			return null;
+		};
+		setFaviconUrl(getFaviconUrl());
+	}, []);
+	if (!faviconUrl || hasError) return /* @__PURE__ */ jsx("div", {
+		className: "bg-muted flex items-center justify-center rounded-full",
+		style: {
+			height: size,
+			width: size
+		},
+		children: /* @__PURE__ */ jsx(Globe, {
+			className: "text-muted-foreground",
+			style: {
+				height: size * .6,
+				width: size * .6
+			}
+		})
+	});
+	return /* @__PURE__ */ jsx("div", {
+		className: "bg-muted flex items-center justify-center overflow-hidden rounded-full",
+		style: {
+			height: size,
+			width: size
+		},
+		children: /* @__PURE__ */ jsx("img", {
+			src: faviconUrl,
+			alt: "Favicon",
+			className: "h-full w-full object-cover",
+			onError: () => setHasError(true)
+		})
+	});
+};
+var ProjectMenu = () => {
+	const [open, setOpen] = React.useState(false);
+	const authCtx = React.useContext(AuthContext);
+	const project = useQuery(api.projects.getFirstProject);
+	if (!project) return /* @__PURE__ */ jsxs("div", {
+		className: "flex h-9 min-w-[150px] items-center gap-2 px-4",
+		children: [/* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-4 rounded-full" }), /* @__PURE__ */ jsx(Skeleton, { className: "h-3 flex-1" })]
+	});
+	return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Popover, {
+		open,
+		onOpenChange: setOpen,
+		children: [/* @__PURE__ */ jsx(PopoverTrigger, {
+			asChild: true,
+			children: /* @__PURE__ */ jsxs(Button, {
+				variant: "ghost",
+				className: "min-w-[150px] justify-between gap-2",
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: "flex items-center gap-2",
+					children: [/* @__PURE__ */ jsx(Favicon, { size: 16 }), /* @__PURE__ */ jsx("span", { children: project.name })]
+				}), /* @__PURE__ */ jsx(ChevronDown, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" })]
+			})
+		}), /* @__PURE__ */ jsx(PopoverContent, {
+			className: "w-72 p-0",
+			align: "start",
+			side: "bottom",
+			children: /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col",
+				children: [
+					/* @__PURE__ */ jsx("div", {
+						className: "flex flex-col gap-2 p-4",
+						children: /* @__PURE__ */ jsx("h3", {
+							className: "font-mono text-sm leading-none",
+							children: project.domain
+						})
+					}),
+					/* @__PURE__ */ jsx(Separator, {}),
+					/* @__PURE__ */ jsx("div", {
+						className: "flex flex-col gap-1 p-2",
+						children: /* @__PURE__ */ jsxs(Button, {
+							variant: "ghost",
+							className: "w-full justify-start",
+							onClick: () => {
+								if (authCtx) window.open(`${authCtx.managementUrl}/dashboard/${project.slug}`, "_blank");
+								setOpen(false);
+							},
+							children: [/* @__PURE__ */ jsx(Settings, { className: "text-muted-foreground size-4" }), "Project settings"]
+						})
+					}),
+					/* @__PURE__ */ jsx(Separator, {}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "flex flex-col gap-1 p-2",
+						children: [/* @__PURE__ */ jsxs(Button, {
+							variant: "ghost",
+							className: "w-full justify-start",
+							onClick: () => {
+								if (authCtx) window.open(`${authCtx.managementUrl}/dashboard/team?tab=members`, "_blank");
+								setOpen(false);
+							},
+							children: [/* @__PURE__ */ jsx(Users, { className: "text-muted-foreground size-4" }), "Team members"]
+						}), /* @__PURE__ */ jsxs(Button, {
+							variant: "ghost",
+							className: "w-full justify-start",
+							onClick: () => {
+								if (authCtx) window.open(`${authCtx.managementUrl}/dashboard/team?tab=settings`, "_blank");
+								setOpen(false);
+							},
+							children: [/* @__PURE__ */ jsx(Settings, { className: "text-muted-foreground size-4" }), "Team settings"]
+						})]
+					})
+				]
+			})
+		})]
+	}) });
+};
+//#endregion
+export { ProjectMenu };

package/dist/features/studio/components/UserButton.d.ts

@@ -0,0 +1,2 @@
+export declare const UserButton: () => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=UserButton.d.ts.map

package/dist/features/studio/components/UserButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserButton.d.ts","sourceRoot":"","sources":["../../../../src/features/studio/components/UserButton.tsx"],"names":[],"mappings":"AAqBA,eAAO,MAAM,UAAU,+CAatB,CAAC"}

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

@@ -0,0 +1,96 @@
+import { useTheme } from "../useTheme.js";
+import { useConvexAuth } from "convex/react";
+import { useContext } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "@camox/ui/button";
+import { LogOut, Monitor, Moon, Settings, Sun, User } from "lucide-react";
+import { AuthContext } from "@/lib/auth";
+import { Avatar, AvatarFallback, AvatarImage } from "@camox/ui/avatar";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from "@camox/ui/dropdown-menu";
+//#region src/features/studio/components/UserButton.tsx
+var UserButton = () => {
+	const { isAuthenticated, isLoading } = useConvexAuth();
+	const { setTheme } = useTheme();
+	if (!isAuthenticated || isLoading) return /* @__PURE__ */ jsx(Button, {
+		variant: "outline",
+		size: "icon",
+		children: /* @__PURE__ */ jsx(User, { className: "h-4 w-4" })
+	});
+	return /* @__PURE__ */ jsx(AuthenticatedUserButton, { setTheme });
+};
+function AuthenticatedUserButton({ setTheme }) {
+	const authCtx = useContext(AuthContext);
+	const { data: session } = authCtx.authClient.useSession();
+	const managementUrl = authCtx.managementUrl;
+	const userName = session?.user?.name || "User";
+	const userEmail = session?.user?.email;
+	const userImage = session?.user?.image;
+	const userInitials = userName.split(" ").map((n) => n[0]).join("").toUpperCase().slice(0, 2);
+	return /* @__PURE__ */ jsxs(DropdownMenu, { children: [/* @__PURE__ */ jsx(DropdownMenuTrigger, {
+		asChild: true,
+		children: /* @__PURE__ */ jsx(Button, {
+			variant: "outline",
+			size: "icon",
+			children: /* @__PURE__ */ jsx(User, { className: "text-muted-foreground h-4 w-4" })
+		})
+	}), /* @__PURE__ */ jsxs(DropdownMenuContent, {
+		className: "w-72",
+		align: "end",
+		children: [
+			/* @__PURE__ */ jsx(DropdownMenuLabel, {
+				className: "font-normal",
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "flex items-center gap-3",
+					children: [/* @__PURE__ */ jsxs(Avatar, {
+						size: "lg",
+						children: [userImage && /* @__PURE__ */ jsx(AvatarImage, {
+							src: userImage,
+							alt: userName
+						}), /* @__PURE__ */ jsx(AvatarFallback, { children: userInitials })]
+					}), /* @__PURE__ */ jsxs("div", {
+						className: "flex-1 space-y-0.5",
+						children: [/* @__PURE__ */ jsx("p", {
+							className: "text-sm leading-none font-medium",
+							children: userName
+						}), /* @__PURE__ */ jsx("p", {
+							className: "text-muted-foreground text-sm",
+							children: userEmail
+						})]
+					})]
+				})
+			}),
+			/* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+			/* @__PURE__ */ jsxs(DropdownMenuItem, {
+				onClick: () => window.open(`${managementUrl}/dashboard/profile`, "_blank"),
+				children: [/* @__PURE__ */ jsx(Settings, { className: "h-4 w-4" }), /* @__PURE__ */ jsx("span", { children: "Manage account" })]
+			}),
+			/* @__PURE__ */ jsxs(DropdownMenuSub, { children: [/* @__PURE__ */ jsxs(DropdownMenuSubTrigger, {
+				className: "gap-2",
+				children: [
+					/* @__PURE__ */ jsx(Sun, { className: "text-muted-foreground h-4 w-4 dark:hidden" }),
+					/* @__PURE__ */ jsx(Moon, { className: "text-muted-foreground hidden h-4 w-4 dark:block" }),
+					/* @__PURE__ */ jsx("span", { children: "Theme" })
+				]
+			}), /* @__PURE__ */ jsxs(DropdownMenuSubContent, { children: [
+				/* @__PURE__ */ jsxs(DropdownMenuItem, {
+					onClick: () => setTheme("light"),
+					children: [/* @__PURE__ */ jsx(Sun, { className: "h-4 w-4" }), /* @__PURE__ */ jsx("span", { children: "Light" })]
+				}),
+				/* @__PURE__ */ jsxs(DropdownMenuItem, {
+					onClick: () => setTheme("dark"),
+					children: [/* @__PURE__ */ jsx(Moon, { className: "h-4 w-4" }), /* @__PURE__ */ jsx("span", { children: "Dark" })]
+				}),
+				/* @__PURE__ */ jsxs(DropdownMenuItem, {
+					onClick: () => setTheme("system"),
+					children: [/* @__PURE__ */ jsx(Monitor, { className: "h-4 w-4" }), /* @__PURE__ */ jsx("span", { children: "System" })]
+				})
+			] })] }),
+			/* @__PURE__ */ jsxs(DropdownMenuItem, {
+				onClick: () => authCtx.authClient.signOut(),
+				children: [/* @__PURE__ */ jsx(LogOut, { className: "h-4 w-4" }), /* @__PURE__ */ jsx("span", { children: "Sign out" })]
+			})
+		]
+	})] });
+}
+//#endregion
+export { UserButton };

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

@@ -0,0 +1,17 @@
+interface StudioContext {
+    isCommandPaletteOpen: boolean;
+    commandPalettePages: string[];
+}
+export declare const studioStore: import('@xstate/store').Store<StudioContext, import('@xstate/store').ExtractEvents<{
+    openCommandPalette: unknown;
+    closeCommandPalette: unknown;
+    toggleCommandPalette: unknown;
+    pushCommandPalettePage: {
+        page: string;
+    };
+    popCommandPalettePage: unknown;
+}>, {
+    type: string;
+}>;
+export {};
+//# sourceMappingURL=studioStore.d.ts.map

package/dist/features/studio/studioStore.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"studioStore.d.ts","sourceRoot":"","sources":["../../../src/features/studio/studioStore.ts"],"names":[],"mappings":"AAEA,UAAU,aAAa;IACrB,oBAAoB,EAAE,OAAO,CAAC;IAC9B,mBAAmB,EAAE,MAAM,EAAE,CAAC;CAC/B;AAED,eAAO,MAAM,WAAW;;;;;cA0B6B,MAAM;;;;;EAazD,CAAC"}