camox 0.3.0 → 0.4.0

package/dist/features/preview/components/AssetFieldEditor.js

@@ -6,6 +6,7 @@ import { useFileUpload } from "../../../hooks/use-file-upload.js";
 import { AssetLightbox } from "./AssetLightbox.js";
 import { AssetPickerGrid } from "./AssetPickerGrid.js";
 import { UnlinkAssetButton } from "./UnlinkAssetButton.js";
+import { c } from "react/compiler-runtime";
 import { useQuery } from "@tanstack/react-query";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -16,37 +17,110 @@ function assetLabel(isImage, multiple) {
 	if (isImage) return multiple ? "images" : "image";
 	return multiple ? "files" : "file";
 }
-var AssetActionButtons = ({ isImage, multiple, fileInputRef, onPickerOpen, onFilesSelected, uploads }) => /* @__PURE__ */ jsxs(Fragment, { children: [
-	/* @__PURE__ */ jsxs(Button, {
-		variant: "default",
-		className: "mx-auto flex w-full",
-		onClick: onPickerOpen,
-		children: ["Select existing ", assetLabel(isImage, multiple)]
-	}),
-	/* @__PURE__ */ jsxs(Button, {
-		variant: "secondary",
-		className: "mx-auto flex w-full",
-		onClick: () => fileInputRef.current?.click(),
-		children: [/* @__PURE__ */ jsx(Upload, { className: "h-4 w-4" }), "Upload new"]
-	}),
-	/* @__PURE__ */ jsx("p", {
-		className: "text-muted-foreground text-center text-xs",
-		children: "Or drag anywhere to upload"
-	}),
-	/* @__PURE__ */ jsx("input", {
-		type: "file",
-		ref: fileInputRef,
-		className: "hidden",
-		accept: isImage ? "image/*" : "*/*",
-		multiple,
-		onChange: (e) => {
+var AssetActionButtons = (t0) => {
+	const $ = c(26);
+	const { isImage, multiple, fileInputRef, onPickerOpen, onFilesSelected, uploads } = t0;
+	let t1;
+	if ($[0] !== isImage || $[1] !== multiple) {
+		t1 = assetLabel(isImage, multiple);
+		$[0] = isImage;
+		$[1] = multiple;
+		$[2] = t1;
+	} else t1 = $[2];
+	let t2;
+	if ($[3] !== onPickerOpen || $[4] !== t1) {
+		t2 = /* @__PURE__ */ jsxs(Button, {
+			variant: "default",
+			className: "mx-auto flex w-full",
+			onClick: onPickerOpen,
+			children: ["Select existing ", t1]
+		});
+		$[3] = onPickerOpen;
+		$[4] = t1;
+		$[5] = t2;
+	} else t2 = $[5];
+	let t3;
+	if ($[6] !== fileInputRef) {
+		t3 = () => fileInputRef.current?.click();
+		$[6] = fileInputRef;
+		$[7] = t3;
+	} else t3 = $[7];
+	let t4;
+	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = /* @__PURE__ */ jsx(Upload, { className: "h-4 w-4" });
+		$[8] = t4;
+	} else t4 = $[8];
+	let t5;
+	if ($[9] !== t3) {
+		t5 = /* @__PURE__ */ jsxs(Button, {
+			variant: "secondary",
+			className: "mx-auto flex w-full",
+			onClick: t3,
+			children: [t4, "Upload new"]
+		});
+		$[9] = t3;
+		$[10] = t5;
+	} else t5 = $[10];
+	let t6;
+	if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
+		t6 = /* @__PURE__ */ jsx("p", {
+			className: "text-muted-foreground text-center text-xs",
+			children: "Or drag anywhere to upload"
+		});
+		$[11] = t6;
+	} else t6 = $[11];
+	const t7 = isImage ? "image/*" : "*/*";
+	let t8;
+	if ($[12] !== onFilesSelected) {
+		t8 = (e) => {
 			if (e.target.files) onFilesSelected(e.target.files);
 			e.target.value = "";
-		}
-	}),
-	uploads.length > 0 && /* @__PURE__ */ jsx("div", { children: uploads.map((item) => /* @__PURE__ */ jsx(UploadItemRow, { item }, item.id)) })
-] });
-var SingleAssetFieldEditor = ({ fieldName, assetType, currentData, onFieldChange }) => {
+		};
+		$[12] = onFilesSelected;
+		$[13] = t8;
+	} else t8 = $[13];
+	let t9;
+	if ($[14] !== fileInputRef || $[15] !== multiple || $[16] !== t7 || $[17] !== t8) {
+		t9 = /* @__PURE__ */ jsx("input", {
+			type: "file",
+			ref: fileInputRef,
+			className: "hidden",
+			accept: t7,
+			multiple,
+			onChange: t8
+		});
+		$[14] = fileInputRef;
+		$[15] = multiple;
+		$[16] = t7;
+		$[17] = t8;
+		$[18] = t9;
+	} else t9 = $[18];
+	let t10;
+	if ($[19] !== uploads) {
+		t10 = uploads.length > 0 && /* @__PURE__ */ jsx("div", { children: uploads.map(_temp) });
+		$[19] = uploads;
+		$[20] = t10;
+	} else t10 = $[20];
+	let t11;
+	if ($[21] !== t10 || $[22] !== t2 || $[23] !== t5 || $[24] !== t9) {
+		t11 = /* @__PURE__ */ jsxs(Fragment, { children: [
+			t2,
+			t5,
+			t6,
+			t9,
+			t10
+		] });
+		$[21] = t10;
+		$[22] = t2;
+		$[23] = t5;
+		$[24] = t9;
+		$[25] = t11;
+	} else t11 = $[25];
+	return t11;
+};
+var SingleAssetFieldEditor = (t0) => {
+	const $ = c(28);
+	const { fieldName, assetType, currentData, onFieldChange } = t0;
 	const asset = currentData[fieldName];
 	const hasAsset = !!asset?.url;
 	const [lightboxOpen, setLightboxOpen] = React.useState(false);
@@ -54,29 +128,63 @@ var SingleAssetFieldEditor = ({ fieldName, assetType, currentData, onFieldChange
 	const isImage = assetType === "Image";
 	const fileInputRef = React.useRef(null);
 	const projectSlug = useProjectSlug();
-	const { data: project } = useQuery(projectQueries.getBySlug(projectSlug));
-	const { uploads, uploadFiles } = useFileUpload({
-		projectId: project?.id,
-		onFileCommitted: (result) => {
+	let t1;
+	if ($[0] !== projectSlug) {
+		t1 = projectQueries.getBySlug(projectSlug);
+		$[0] = projectSlug;
+		$[1] = t1;
+	} else t1 = $[1];
+	const { data: project } = useQuery(t1);
+	const t2 = project?.id;
+	let t3;
+	if ($[2] !== fieldName || $[3] !== onFieldChange) {
+		t3 = (result) => {
 			onFieldChange(fieldName, { _fileId: Number(result.fileId) });
-		}
-	});
-	const handleDrop = React.useCallback((files) => {
-		const dt = new DataTransfer();
-		dt.items.add(files[0]);
-		uploadFiles(dt.files);
-	}, [uploadFiles]);
-	const handleSelectExisting = (file) => {
-		onFieldChange(fieldName, { _fileId: file.id });
-		setPickerOpen(false);
-	};
-	return /* @__PURE__ */ jsx(UploadDropZone, {
-		onDrop: handleDrop,
-		children: pickerOpen ? /* @__PURE__ */ jsx(AssetPickerGrid, {
+		};
+		$[2] = fieldName;
+		$[3] = onFieldChange;
+		$[4] = t3;
+	} else t3 = $[4];
+	let t4;
+	if ($[5] !== t2 || $[6] !== t3) {
+		t4 = {
+			projectId: t2,
+			onFileCommitted: t3
+		};
+		$[5] = t2;
+		$[6] = t3;
+		$[7] = t4;
+	} else t4 = $[7];
+	const { uploads, uploadFiles } = useFileUpload(t4);
+	let t5;
+	if ($[8] !== uploadFiles) {
+		t5 = (files) => {
+			const dt = new DataTransfer();
+			dt.items.add(files[0]);
+			uploadFiles(dt.files);
+		};
+		$[8] = uploadFiles;
+		$[9] = t5;
+	} else t5 = $[9];
+	const handleDrop = t5;
+	let t6;
+	if ($[10] !== fieldName || $[11] !== onFieldChange) {
+		t6 = (file) => {
+			onFieldChange(fieldName, { _fileId: file.id });
+			setPickerOpen(false);
+		};
+		$[10] = fieldName;
+		$[11] = onFieldChange;
+		$[12] = t6;
+	} else t6 = $[12];
+	const handleSelectExisting = t6;
+	let t7;
+	if ($[13] !== asset || $[14] !== assetType || $[15] !== fieldName || $[16] !== handleDrop || $[17] !== handleSelectExisting || $[18] !== hasAsset || $[19] !== isImage || $[20] !== lightboxOpen || $[21] !== onFieldChange || $[22] !== pickerOpen || $[23] !== uploads) {
+		t7 = pickerOpen ? /* @__PURE__ */ jsx(AssetPickerGrid, {
 			assetType,
 			mode: "single",
 			onSelectSingle: handleSelectExisting,
-			onSelectMultiple: () => {},
+			onSelectMultiple: _temp2,
 			onClose: () => setPickerOpen(false)
 		}) : /* @__PURE__ */ jsxs("div", {
 			className: "space-y-4 px-4 py-4",
@@ -123,8 +231,35 @@ var SingleAssetFieldEditor = ({ fieldName, assetType, currentData, onFieldChange
 				onFilesSelected: handleDrop,
 				uploads
 			})]
-		})
-	});
+		});
+		$[13] = asset;
+		$[14] = assetType;
+		$[15] = fieldName;
+		$[16] = handleDrop;
+		$[17] = handleSelectExisting;
+		$[18] = hasAsset;
+		$[19] = isImage;
+		$[20] = lightboxOpen;
+		$[21] = onFieldChange;
+		$[22] = pickerOpen;
+		$[23] = uploads;
+		$[24] = t7;
+	} else t7 = $[24];
+	let t8;
+	if ($[25] !== handleDrop || $[26] !== t7) {
+		t8 = /* @__PURE__ */ jsx(UploadDropZone, {
+			onDrop: handleDrop,
+			children: t7
+		});
+		$[25] = handleDrop;
+		$[26] = t7;
+		$[27] = t8;
+	} else t8 = $[27];
+	return t8;
 };
+function _temp(item) {
+	return /* @__PURE__ */ jsx(UploadItemRow, { item }, item.id);
+}
+function _temp2() {}
 //#endregion
 export { AssetActionButtons, SingleAssetFieldEditor };

package/dist/features/preview/components/AssetLightbox.js

@@ -3,6 +3,7 @@ import { getApiUrl, getEnvironmentName } from "../../../lib/api-client.js";
 import { fileMutations, fileQueries } from "../../../lib/queries.js";
 import { DebouncedFieldEditor } from "./DebouncedFieldEditor.js";
 import { UploadDropZone } from "../../content/components/UploadDropZone.js";
+import { c } from "react/compiler-runtime";
 import { Label } from "@camox/ui/label";
 import { toast } from "@camox/ui/toaster";
 import { useMutation, useQuery } from "@tanstack/react-query";
@@ -15,21 +16,47 @@ import { Switch } from "@camox/ui/switch";
 import { ButtonGroup } from "@camox/ui/button-group";
 import { Dialog, DialogContent, DialogTitle } from "@camox/ui/dialog";
 //#region src/features/preview/components/AssetLightbox.tsx
-function MetadataRow({ label, children }) {
-	return /* @__PURE__ */ jsxs("div", {
-		className: "flex items-baseline gap-2",
-		children: [
-			/* @__PURE__ */ jsx("span", {
-				className: "shrink-0",
-				children: label
-			}),
-			/* @__PURE__ */ jsx("span", { className: "border-border min-w-0 flex-1 border-b" }),
-			/* @__PURE__ */ jsx("span", {
-				className: "text-foreground shrink-0",
-				children
-			})
-		]
-	});
+function MetadataRow(t0) {
+	const $ = c(8);
+	const { label, children } = t0;
+	let t1;
+	if ($[0] !== label) {
+		t1 = /* @__PURE__ */ jsx("span", {
+			className: "shrink-0",
+			children: label
+		});
+		$[0] = label;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ jsx("span", { className: "border-border min-w-0 flex-1 border-b" });
+		$[2] = t2;
+	} else t2 = $[2];
+	let t3;
+	if ($[3] !== children) {
+		t3 = /* @__PURE__ */ jsx("span", {
+			className: "text-foreground shrink-0",
+			children
+		});
+		$[3] = children;
+		$[4] = t3;
+	} else t3 = $[4];
+	let t4;
+	if ($[5] !== t1 || $[6] !== t3) {
+		t4 = /* @__PURE__ */ jsxs("div", {
+			className: "flex items-baseline gap-2",
+			children: [
+				t1,
+				t2,
+				t3
+			]
+		});
+		$[5] = t1;
+		$[6] = t3;
+		$[7] = t4;
+	} else t4 = $[7];
+	return t4;
 }
 function formatRelativeTime(epochMs) {
 	const now = Temporal.Now.instant();
@@ -109,20 +136,20 @@ var AssetLightbox = ({ open, onOpenChange, fileId }) => {
 				}
 			});
 			if (!uploadRes.ok) throw new Error(`Upload failed: ${uploadRes.status}`);
-			setUploadState((prev) => prev ? {
-				...prev,
+			setUploadState((prev_0) => prev_0 ? {
+				...prev_0,
 				status: "committing",
 				progress: 100
-			} : prev);
+			} : prev_0);
 			const { id: newFileId } = await uploadRes.json();
 			await replaceFile.mutateAsync({
 				id: fileId,
 				newFileId
 			});
-			setUploadState((prev) => prev ? {
-				...prev,
+			setUploadState((prev_1) => prev_1 ? {
+				...prev_1,
 				status: "complete"
-			} : prev);
+			} : prev_1);
 			toast.success("File replaced");
 			setTimeout(() => {
 				setUploadState(null);
@@ -191,18 +218,18 @@ var AssetLightbox = ({ open, onOpenChange, fileId }) => {
 							ref: containerRef,
 							className: `checkered absolute inset-0 ${zoomed ? "overflow-auto" : "flex items-center justify-center overflow-hidden p-6"}`,
 							onClick: (e) => {
-								const img = containerRef.current?.querySelector("img");
-								if (!img) return;
+								const img_0 = containerRef.current?.querySelector("img");
+								if (!img_0) return;
 								if (!zoomed) {
-									const rect = img.getBoundingClientRect();
+									const rect = img_0.getBoundingClientRect();
 									clickFractionRef.current = {
 										x: (e.clientX - rect.left) / rect.width,
 										y: (e.clientY - rect.top) / rect.height
 									};
-									const container = containerRef.current;
-									const scaleForWidth = container.clientWidth * 2.5 / img.clientWidth;
-									const scaleForHeight = container.clientHeight * 2.5 / img.clientHeight;
-									setZoomedWidth(img.clientWidth * Math.max(scaleForWidth, scaleForHeight));
+									const container_0 = containerRef.current;
+									const scaleForWidth = container_0.clientWidth * 2.5 / img_0.clientWidth;
+									const scaleForHeight = container_0.clientHeight * 2.5 / img_0.clientHeight;
+									setZoomedWidth(img_0.clientWidth * Math.max(scaleForWidth, scaleForHeight));
 									setZoomed(true);
 								} else {
 									setZoomed(false);
@@ -339,9 +366,9 @@ var AssetLightbox = ({ open, onOpenChange, fileId }) => {
 									initialValue: file.alt,
 									disabled: file.aiMetadataEnabled !== false,
 									rows: 2,
-									onSave: (value) => setAlt.mutate({
+									onSave: (value_0) => setAlt.mutate({
 										id: fileId,
-										alt: value
+										alt: value_0
 									})
 								}),
 								/* @__PURE__ */ jsxs("div", {
@@ -378,9 +405,9 @@ var AssetLightbox = ({ open, onOpenChange, fileId }) => {
 									type: "file",
 									className: "hidden",
 									accept: isImage ? "image/*" : "*/*",
-									onChange: (e) => {
-										if (e.target.files) handleReplaceDrop(e.target.files);
-										e.target.value = "";
+									onChange: (e_0) => {
+										if (e_0.target.files) handleReplaceDrop(e_0.target.files);
+										e_0.target.value = "";
 									}
 								}),
 								/* @__PURE__ */ jsx(Button, {