camox 0.3.0 → 0.3.1

package/dist/core/createLayout.js

@@ -1,3 +1,4 @@
+import { c } from "react/compiler-runtime";
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/core/createLayout.tsx
@@ -14,30 +15,61 @@ function createLayout(options) {
 		const isLastBefore = block === lastBeforeBlock;
 		const isFirstAfter = block === firstAfterBlock;
 		const SlotComponent = () => {
+			const $ = c(2);
 			const ctx = React.use(LayoutContext);
 			if (!ctx) throw new Error(`Layout slot "${block.id}" must be rendered inside a LayoutContextProvider`);
 			const blockData = ctx.layoutBlocks[block.id];
 			if (!blockData) return null;
-			return /* @__PURE__ */ jsx(block.Component, {
-				blockData,
-				mode: "layout",
-				showAddBlockTop: isFirstAfter || void 0,
-				showAddBlockBottom: isLastBefore || void 0,
-				addBlockAfterPosition: (() => {
-					if (isLastBefore) return "";
-					if (isFirstAfter) return null;
-				})()
-			});
+			let t0;
+			bb0: {
+				if (isLastBefore) {
+					t0 = "";
+					break bb0;
+				}
+				if (isFirstAfter) {
+					t0 = null;
+					break bb0;
+				}
+				t0 = void 0;
+			}
+			let t1;
+			if ($[0] !== blockData) {
+				t1 = /* @__PURE__ */ jsx(block.Component, {
+					blockData,
+					mode: "layout",
+					showAddBlockTop: isFirstAfter || void 0,
+					showAddBlockBottom: isLastBefore || void 0,
+					addBlockAfterPosition: t0
+				});
+				$[0] = blockData;
+				$[1] = t1;
+			} else t1 = $[1];
+			return t1;
 		};
 		SlotComponent.displayName = `LayoutSlot(${toPascalCase(block.id)})`;
 		slotComponents[toPascalCase(block.id)] = SlotComponent;
 	}
-	const Provider = ({ layoutBlocks, children }) => {
-		const value = React.useMemo(() => ({ layoutBlocks }), [layoutBlocks]);
-		return /* @__PURE__ */ jsx(LayoutContext.Provider, {
-			value,
-			children
-		});
+	const Provider = (t0) => {
+		const $ = c(5);
+		const { layoutBlocks, children } = t0;
+		let t1;
+		if ($[0] !== layoutBlocks) {
+			t1 = { layoutBlocks };
+			$[0] = layoutBlocks;
+			$[1] = t1;
+		} else t1 = $[1];
+		const value = t1;
+		let t2;
+		if ($[2] !== children || $[3] !== value) {
+			t2 = /* @__PURE__ */ jsx(LayoutContext.Provider, {
+				value,
+				children
+			});
+			$[2] = children;
+			$[3] = value;
+			$[4] = t2;
+		} else t2 = $[4];
+		return t2;
 	};
 	const blockDefinitions = [...options.blocks.before.map((block) => {
 		const bundle = block.getInitialBundle();

package/dist/core/hooks/useFieldSelection.js

@@ -1,4 +1,5 @@
 import { previewStore } from "../../features/preview/previewStore.js";
+import { c } from "react/compiler-runtime";
 import { useSelector } from "@xstate/store/react";
 //#region src/core/hooks/useFieldSelection.ts
 /**
@@ -7,19 +8,29 @@ import { useSelector } from "@xstate/store/react";
 * Matches when the selection points to this exact field (type + name + optional repeater item).
 */
 function useFieldSelection(blockId, fieldName, fieldType, repeaterItemId) {
-	return useSelector(previewStore, (state) => {
-		const sel = state.context.selection;
-		if (!sel || sel.blockId !== blockId) return false;
-		if (sel.type === "block-field") {
-			if (repeaterItemId) return false;
-			return sel.fieldType === fieldType && sel.fieldName === fieldName;
-		}
-		if (sel.type === "item-field") {
-			if (!repeaterItemId) return false;
-			return sel.itemId === repeaterItemId && sel.fieldType === fieldType && sel.fieldName === fieldName;
-		}
-		return false;
-	});
+	const $ = c(5);
+	let t0;
+	if ($[0] !== blockId || $[1] !== fieldName || $[2] !== fieldType || $[3] !== repeaterItemId) {
+		t0 = (state) => {
+			const sel = state.context.selection;
+			if (!sel || sel.blockId !== blockId) return false;
+			if (sel.type === "block-field") {
+				if (repeaterItemId) return false;
+				return sel.fieldType === fieldType && sel.fieldName === fieldName;
+			}
+			if (sel.type === "item-field") {
+				if (!repeaterItemId) return false;
+				return sel.itemId === repeaterItemId && sel.fieldType === fieldType && sel.fieldName === fieldName;
+			}
+			return false;
+		};
+		$[0] = blockId;
+		$[1] = fieldName;
+		$[2] = fieldType;
+		$[3] = repeaterItemId;
+		$[4] = t0;
+	} else t0 = $[4];
+	return useSelector(previewStore, t0);
 }
 //#endregion
 export { useFieldSelection };

package/dist/core/hooks/useIsEditable.js

@@ -4,9 +4,15 @@ import { useSelector } from "@xstate/store/react";
 //#region src/core/hooks/useIsEditable.ts
 function useIsEditable(mode) {
 	const isAuthenticated = useIsAuthenticated();
-	const isPresentationMode = useSelector(previewStore, (state) => state.context.isPresentationMode);
-	const isContentLocked = useSelector(previewStore, (state) => state.context.isContentLocked);
+	const isPresentationMode = useSelector(previewStore, _temp);
+	const isContentLocked = useSelector(previewStore, _temp2);
 	return isAuthenticated && (mode === "site" || mode === "layout") && !isPresentationMode && !isContentLocked;
 }
+function _temp2(state_0) {
+	return state_0.context.isContentLocked;
+}
+function _temp(state) {
+	return state.context.isPresentationMode;
+}
 //#endregion
 export { useIsEditable };

package/dist/core/hooks/useOverlayMessage.js

@@ -1,4 +1,5 @@
 import { isOverlayMessage } from "../../features/preview/overlayMessages.js";
+import { c } from "react/compiler-runtime";
 import * as React from "react";
 //#region src/core/hooks/useOverlayMessage.ts
 /**
@@ -9,29 +10,59 @@ import * as React from "react";
 * `match` is undefined.
 */
 function useOverlayMessage(iframeWindow, enabled, startType, endType, match) {
+	const $ = c(9);
 	const [active, setActive] = React.useState(false);
-	const matchJson = JSON.stringify(match);
-	React.useEffect(() => {
-		if (!enabled || !iframeWindow) return;
-		const matchEntries = Object.entries(JSON.parse(matchJson));
-		if (matchEntries.some(([, v]) => v === void 0)) return;
-		const handleMessage = (event) => {
-			if (!isOverlayMessage(event.data)) return;
-			const data = event.data;
-			if (data.type !== startType && data.type !== endType) return;
-			if (!matchEntries.every(([k, v]) => data[k] === v)) return;
-			setActive(data.type === startType);
+	let t0;
+	if ($[0] !== match) {
+		t0 = JSON.stringify(match);
+		$[0] = match;
+		$[1] = t0;
+	} else t0 = $[1];
+	const matchJson = t0;
+	let t1;
+	let t2;
+	if ($[2] !== enabled || $[3] !== endType || $[4] !== iframeWindow || $[5] !== matchJson || $[6] !== startType) {
+		t1 = () => {
+			if (!enabled || !iframeWindow) return;
+			const matchEntries = Object.entries(JSON.parse(matchJson));
+			if (matchEntries.some(_temp)) return;
+			const handleMessage = (event) => {
+				if (!isOverlayMessage(event.data)) return;
+				const data = event.data;
+				if (data.type !== startType && data.type !== endType) return;
+				if (!matchEntries.every((t3) => {
+					const [k, v_0] = t3;
+					return data[k] === v_0;
+				})) return;
+				setActive(data.type === startType);
+			};
+			iframeWindow.addEventListener("message", handleMessage);
+			return () => iframeWindow.removeEventListener("message", handleMessage);
 		};
-		iframeWindow.addEventListener("message", handleMessage);
-		return () => iframeWindow.removeEventListener("message", handleMessage);
-	}, [
-		enabled,
-		iframeWindow,
-		startType,
-		endType,
-		matchJson
-	]);
+		t2 = [
+			enabled,
+			iframeWindow,
+			startType,
+			endType,
+			matchJson
+		];
+		$[2] = enabled;
+		$[3] = endType;
+		$[4] = iframeWindow;
+		$[5] = matchJson;
+		$[6] = startType;
+		$[7] = t1;
+		$[8] = t2;
+	} else {
+		t1 = $[7];
+		t2 = $[8];
+	}
+	React.useEffect(t1, t2);
 	return active;
 }
+function _temp(t0) {
+	const [, v] = t0;
+	return v === void 0;
+}
 //#endregion
 export { useOverlayMessage };

package/dist/features/content/CamoxContent.js

@@ -8,125 +8,257 @@ import { AssetCard } from "./components/AssetCard.js";
 import { useMarqueeSelection } from "../../hooks/use-marquee-selection.js";
 import { AssetCardSkeleton } from "./components/AssetCardSkeleton.js";
 import { ContentSidebar } from "./components/ContentSidebar.js";
+import { c } from "react/compiler-runtime";
 import { useMutation, useQuery } from "@tanstack/react-query";
-import { useCallback, useRef, useState } from "react";
+import { useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "@camox/ui/button";
 import { PanelContent } from "@camox/ui/panel";
 import { FloatingToolbar } from "@camox/ui/floating-toolbar";
 //#region src/features/content/CamoxContent.tsx
 var CamoxContent = () => {
+	const $ = c(49);
 	const projectSlug = useProjectSlug();
-	const { data: project } = useQuery(projectQueries.getBySlug(projectSlug));
-	const { data: files } = useQuery({
-		...fileQueries.list(project?.id ?? 0),
-		enabled: !!project
-	});
-	const [selectedIds, setSelectedIds] = useState(/* @__PURE__ */ new Set());
+	let t0;
+	if ($[0] !== projectSlug) {
+		t0 = projectQueries.getBySlug(projectSlug);
+		$[0] = projectSlug;
+		$[1] = t0;
+	} else t0 = $[1];
+	const { data: project } = useQuery(t0);
+	let t1;
+	if ($[2] !== project?.id) {
+		t1 = fileQueries.list(project?.id ?? 0);
+		$[2] = project?.id;
+		$[3] = t1;
+	} else t1 = $[3];
+	const t2 = !!project;
+	let t3;
+	if ($[4] !== t1 || $[5] !== t2) {
+		t3 = {
+			...t1,
+			enabled: t2
+		};
+		$[4] = t1;
+		$[5] = t2;
+		$[6] = t3;
+	} else t3 = $[6];
+	const { data: files } = useQuery(t3);
+	let t4;
+	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = /* @__PURE__ */ new Set();
+		$[7] = t4;
+	} else t4 = $[7];
+	const [selectedIds, setSelectedIds] = useState(t4);
 	const [lightboxFileId, setLightboxFileId] = useState(null);
-	const { uploads, uploadFiles, clearAll } = useFileUpload({ projectId: project?.id });
-	const deleteFiles = useMutation({
-		...fileMutations.deleteMany(),
-		onSuccess: () => setSelectedIds(/* @__PURE__ */ new Set())
-	});
+	const t5 = project?.id;
+	let t6;
+	if ($[8] !== t5) {
+		t6 = { projectId: t5 };
+		$[8] = t5;
+		$[9] = t6;
+	} else t6 = $[9];
+	const { uploads, uploadFiles, clearAll } = useFileUpload(t6);
+	let t7;
+	if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
+		t7 = {
+			...fileMutations.deleteMany(),
+			onSuccess: () => setSelectedIds(/* @__PURE__ */ new Set())
+		};
+		$[10] = t7;
+	} else t7 = $[10];
+	const deleteFiles = useMutation(t7);
 	const containerRef = useRef(null);
-	const { selectionRect, didDragRef, handlers } = useMarqueeSelection(containerRef, useCallback((ids) => setSelectedIds(ids), []));
-	return /* @__PURE__ */ jsxs("div", {
-		className: "flex flex-1 flex-row",
-		children: [
-			/* @__PURE__ */ jsx(ContentSidebar, {}),
-			/* @__PURE__ */ jsx("div", {
-				className: "flex min-w-0 flex-1 flex-col",
-				children: /* @__PURE__ */ jsx(UploadDropZone, {
-					onDrop: uploadFiles,
-					className: "flex flex-1 flex-col",
-					children: /* @__PURE__ */ jsxs(PanelContent, {
-						ref: containerRef,
-						className: "relative p-4 select-none",
-						onClick: () => {
-							if (didDragRef.current) {
-								didDragRef.current = false;
-								return;
-							}
-							setSelectedIds(/* @__PURE__ */ new Set());
-						},
-						onPointerDown: handlers.onPointerDown,
-						onPointerMove: handlers.onPointerMove,
-						onPointerUp: handlers.onPointerUp,
-						children: [
-							files === void 0 && /* @__PURE__ */ jsx("div", {
-								className: "grid grid-cols-[repeat(auto-fill,minmax(220px,1fr))] gap-4",
-								children: Array.from({ length: 12 }, (_, i) => /* @__PURE__ */ jsx(AssetCardSkeleton, {}, i))
-							}),
-							files?.length === 0 && /* @__PURE__ */ jsx("div", {
-								className: "flex h-full flex-1 items-center justify-center",
-								children: /* @__PURE__ */ jsx("p", {
-									className: "text-muted-foreground",
-									children: "No assets yet"
-								})
-							}),
-							files && files.length > 0 && /* @__PURE__ */ jsx("div", {
-								className: "grid grid-cols-[repeat(auto-fill,minmax(220px,1fr))] gap-4",
-								children: files.map((file) => /* @__PURE__ */ jsx(AssetCard, {
-									file,
-									selected: selectedIds.has(String(file.id)),
-									onSelect: () => {
-										setSelectedIds((prev) => {
-											const next = new Set(prev);
-											if (next.has(String(file.id))) next.delete(String(file.id));
-											else next.add(String(file.id));
-											return next;
-										});
-									},
-									onOpen: () => setLightboxFileId(file.id)
-								}, file.id))
-							}),
-							selectionRect && /* @__PURE__ */ jsx("div", {
-								className: "border-primary bg-primary/10 pointer-events-none absolute z-50 border",
-								style: {
-									left: selectionRect.left,
-									top: selectionRect.top,
-									width: selectionRect.width,
-									height: selectionRect.height
-								}
-							})
-						]
-					})
-				})
-			}),
-			/* @__PURE__ */ jsx(UploadProgressDrawer, {
-				uploads,
-				onClose: clearAll
-			}),
-			selectedIds.size > 0 && /* @__PURE__ */ jsxs(FloatingToolbar, {
-				className: "bottom-4 min-w-xs justify-between gap-4",
-				children: [/* @__PURE__ */ jsxs("span", {
-					className: "text-muted-foreground",
-					children: [
-						/* @__PURE__ */ jsx("span", {
-							className: "font-semibold",
-							children: selectedIds.size
-						}),
-						" asset",
-						selectedIds.size > 1 ? "s" : "",
-						" selected"
-					]
-				}), /* @__PURE__ */ jsx(Button, {
-					variant: "destructive",
-					disabled: deleteFiles.isPending,
-					onClick: () => deleteFiles.mutate({ ids: [...selectedIds].map(Number) }),
-					children: deleteFiles.isPending ? "Deleting…" : "Delete"
-				})]
-			}),
-			lightboxFileId && /* @__PURE__ */ jsx(AssetLightbox, {
-				open: true,
-				onOpenChange: (open) => {
-					if (!open) setLightboxFileId(null);
+	let t8;
+	if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
+		t8 = (ids) => setSelectedIds(ids);
+		$[11] = t8;
+	} else t8 = $[11];
+	const { selectionRect, didDragRef, handlers } = useMarqueeSelection(containerRef, t8);
+	let t9;
+	if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
+		t9 = /* @__PURE__ */ jsx(ContentSidebar, {});
+		$[12] = t9;
+	} else t9 = $[12];
+	let t10;
+	if ($[13] !== didDragRef) {
+		t10 = () => {
+			if (didDragRef.current) {
+				didDragRef.current = false;
+				return;
+			}
+			setSelectedIds(/* @__PURE__ */ new Set());
+		};
+		$[13] = didDragRef;
+		$[14] = t10;
+	} else t10 = $[14];
+	let t11;
+	if ($[15] !== files) {
+		t11 = files === void 0 && /* @__PURE__ */ jsx("div", {
+			className: "grid grid-cols-[repeat(auto-fill,minmax(220px,1fr))] gap-4",
+			children: Array.from({ length: 12 }, _temp)
+		});
+		$[15] = files;
+		$[16] = t11;
+	} else t11 = $[16];
+	let t12;
+	if ($[17] !== files?.length) {
+		t12 = files?.length === 0 && /* @__PURE__ */ jsx("div", {
+			className: "flex h-full flex-1 items-center justify-center",
+			children: /* @__PURE__ */ jsx("p", {
+				className: "text-muted-foreground",
+				children: "No assets yet"
+			})
+		});
+		$[17] = files?.length;
+		$[18] = t12;
+	} else t12 = $[18];
+	let t13;
+	if ($[19] !== files || $[20] !== selectedIds) {
+		t13 = files && files.length > 0 && /* @__PURE__ */ jsx("div", {
+			className: "grid grid-cols-[repeat(auto-fill,minmax(220px,1fr))] gap-4",
+			children: files.map((file) => /* @__PURE__ */ jsx(AssetCard, {
+				file,
+				selected: selectedIds.has(String(file.id)),
+				onSelect: () => {
+					setSelectedIds((prev) => {
+						const next = new Set(prev);
+						if (next.has(String(file.id))) next.delete(String(file.id));
+						else next.add(String(file.id));
+						return next;
+					});
 				},
-				fileId: lightboxFileId
+				onOpen: () => setLightboxFileId(file.id)
+			}, file.id))
+		});
+		$[19] = files;
+		$[20] = selectedIds;
+		$[21] = t13;
+	} else t13 = $[21];
+	let t14;
+	if ($[22] !== selectionRect) {
+		t14 = selectionRect && /* @__PURE__ */ jsx("div", {
+			className: "border-primary bg-primary/10 pointer-events-none absolute z-50 border",
+			style: {
+				left: selectionRect.left,
+				top: selectionRect.top,
+				width: selectionRect.width,
+				height: selectionRect.height
+			}
+		});
+		$[22] = selectionRect;
+		$[23] = t14;
+	} else t14 = $[23];
+	let t15;
+	if ($[24] !== handlers.onPointerDown || $[25] !== handlers.onPointerMove || $[26] !== handlers.onPointerUp || $[27] !== t10 || $[28] !== t11 || $[29] !== t12 || $[30] !== t13 || $[31] !== t14) {
+		t15 = /* @__PURE__ */ jsxs(PanelContent, {
+			ref: containerRef,
+			className: "relative p-4 select-none",
+			onClick: t10,
+			onPointerDown: handlers.onPointerDown,
+			onPointerMove: handlers.onPointerMove,
+			onPointerUp: handlers.onPointerUp,
+			children: [
+				t11,
+				t12,
+				t13,
+				t14
+			]
+		});
+		$[24] = handlers.onPointerDown;
+		$[25] = handlers.onPointerMove;
+		$[26] = handlers.onPointerUp;
+		$[27] = t10;
+		$[28] = t11;
+		$[29] = t12;
+		$[30] = t13;
+		$[31] = t14;
+		$[32] = t15;
+	} else t15 = $[32];
+	let t16;
+	if ($[33] !== t15 || $[34] !== uploadFiles) {
+		t16 = /* @__PURE__ */ jsx("div", {
+			className: "flex min-w-0 flex-1 flex-col",
+			children: /* @__PURE__ */ jsx(UploadDropZone, {
+				onDrop: uploadFiles,
+				className: "flex flex-1 flex-col",
+				children: t15
 			})
-		]
-	});
+		});
+		$[33] = t15;
+		$[34] = uploadFiles;
+		$[35] = t16;
+	} else t16 = $[35];
+	let t17;
+	if ($[36] !== clearAll || $[37] !== uploads) {
+		t17 = /* @__PURE__ */ jsx(UploadProgressDrawer, {
+			uploads,
+			onClose: clearAll
+		});
+		$[36] = clearAll;
+		$[37] = uploads;
+		$[38] = t17;
+	} else t17 = $[38];
+	let t18;
+	if ($[39] !== deleteFiles || $[40] !== selectedIds) {
+		t18 = selectedIds.size > 0 && /* @__PURE__ */ jsxs(FloatingToolbar, {
+			className: "bottom-4 min-w-xs justify-between gap-4",
+			children: [/* @__PURE__ */ jsxs("span", {
+				className: "text-muted-foreground",
+				children: [
+					/* @__PURE__ */ jsx("span", {
+						className: "font-semibold",
+						children: selectedIds.size
+					}),
+					" asset",
+					selectedIds.size > 1 ? "s" : "",
+					" selected"
+				]
+			}), /* @__PURE__ */ jsx(Button, {
+				variant: "destructive",
+				disabled: deleteFiles.isPending,
+				onClick: () => deleteFiles.mutate({ ids: [...selectedIds].map(Number) }),
+				children: deleteFiles.isPending ? "Deleting…" : "Delete"
+			})]
+		});
+		$[39] = deleteFiles;
+		$[40] = selectedIds;
+		$[41] = t18;
+	} else t18 = $[41];
+	let t19;
+	if ($[42] !== lightboxFileId) {
+		t19 = lightboxFileId && /* @__PURE__ */ jsx(AssetLightbox, {
+			open: true,
+			onOpenChange: (open) => {
+				if (!open) setLightboxFileId(null);
+			},
+			fileId: lightboxFileId
+		});
+		$[42] = lightboxFileId;
+		$[43] = t19;
+	} else t19 = $[43];
+	let t20;
+	if ($[44] !== t16 || $[45] !== t17 || $[46] !== t18 || $[47] !== t19) {
+		t20 = /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-1 flex-row",
+			children: [
+				t9,
+				t16,
+				t17,
+				t18,
+				t19
+			]
+		});
+		$[44] = t16;
+		$[45] = t17;
+		$[46] = t18;
+		$[47] = t19;
+		$[48] = t20;
+	} else t20 = $[48];
+	return t20;
 };
+function _temp(_, i) {
+	return /* @__PURE__ */ jsx(AssetCardSkeleton, {}, i);
+}
 //#endregion
 export { CamoxContent };