camox 0.14.2 → 0.16.0

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

@@ -20,50 +20,54 @@ import { CSS } from "@dnd-kit/utilities";
 
 //#region src/features/preview/components/MultipleAssetFieldEditor.tsx
 const SortableAssetItem = (t0) => {
-	const $ = c(42);
+	const $ = c(43);
+	if ($[0] !== "edd84331a88dec86cb85175ea4b5855869d1ffb6129d2a357826a8aa2e61f7a0") {
+		for (let $i = 0; $i < 43; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "edd84331a88dec86cb85175ea4b5855869d1ffb6129d2a357826a8aa2e61f7a0";
+	}
 	const { asset, assetType, onRemove, onAssetOpen } = t0;
 	const t1 = String(asset._fileId);
 	let t2;
-	if ($[0] !== t1) {
+	if ($[1] !== t1) {
 		t2 = { id: t1 };
-		$[0] = t1;
-		$[1] = t2;
-	} else t2 = $[1];
+		$[1] = t1;
+		$[2] = t2;
+	} else t2 = $[2];
 	const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable(t2);
 	let t3;
-	if ($[2] !== transform) {
+	if ($[3] !== transform) {
 		t3 = CSS.Transform.toString(transform);
-		$[2] = transform;
-		$[3] = t3;
-	} else t3 = $[3];
+		$[3] = transform;
+		$[4] = t3;
+	} else t3 = $[4];
 	const t4 = isDragging ? .5 : 1;
 	let t5;
-	if ($[4] !== t3 || $[5] !== t4 || $[6] !== transition) {
+	if ($[5] !== t3 || $[6] !== t4 || $[7] !== transition) {
 		t5 = {
 			transform: t3,
 			transition,
 			opacity: t4
 		};
-		$[4] = t3;
-		$[5] = t4;
-		$[6] = transition;
-		$[7] = t5;
-	} else t5 = $[7];
+		$[5] = t3;
+		$[6] = t4;
+		$[7] = transition;
+		$[8] = t5;
+	} else t5 = $[8];
 	const style = t5;
 	const t6 = !isDragging && "hover:bg-accent/75";
 	let t7;
-	if ($[8] !== t6) {
+	if ($[9] !== t6) {
 		t7 = cn("flex flex-row items-center gap-2 px-1 py-1 max-w-full rounded-lg text-foreground transition-none group", t6);
-		$[8] = t6;
-		$[9] = t7;
-	} else t7 = $[9];
+		$[9] = t6;
+		$[10] = t7;
+	} else t7 = $[10];
 	let t8;
-	if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
 		t8 = /* @__PURE__ */ jsx(GripVertical, { className: "h-4 w-4" });
-		$[10] = t8;
-	} else t8 = $[10];
+		$[11] = t8;
+	} else t8 = $[11];
 	let t9;
-	if ($[11] !== attributes || $[12] !== listeners) {
+	if ($[12] !== attributes || $[13] !== listeners) {
 		t9 = /* @__PURE__ */ jsx(Button, {
 			type: "button",
 			variant: "ghost",
@@ -73,19 +77,19 @@ const SortableAssetItem = (t0) => {
 			...listeners,
 			children: t8
 		});
-		$[11] = attributes;
-		$[12] = listeners;
-		$[13] = t9;
-	} else t9 = $[13];
+		$[12] = attributes;
+		$[13] = listeners;
+		$[14] = t9;
+	} else t9 = $[14];
 	let t10;
-	if ($[14] !== asset || $[15] !== onAssetOpen) {
+	if ($[15] !== asset || $[16] !== onAssetOpen) {
 		t10 = () => onAssetOpen(asset);
-		$[14] = asset;
-		$[15] = onAssetOpen;
-		$[16] = t10;
-	} else t10 = $[16];
+		$[15] = asset;
+		$[16] = onAssetOpen;
+		$[17] = t10;
+	} else t10 = $[17];
 	let t11;
-	if ($[17] !== asset.alt || $[18] !== asset.filename || $[19] !== asset.url || $[20] !== assetType) {
+	if ($[18] !== asset.alt || $[19] !== asset.filename || $[20] !== asset.url || $[21] !== assetType) {
 		t11 = assetType === "Image" ? /* @__PURE__ */ jsx("div", {
 			className: "border-border h-12 w-12 shrink-0 overflow-hidden rounded border",
 			children: /* @__PURE__ */ jsx("img", {
@@ -97,57 +101,57 @@ const SortableAssetItem = (t0) => {
 			className: "border-border bg-muted flex h-12 w-12 shrink-0 items-center justify-center overflow-hidden rounded border",
 			children: /* @__PURE__ */ jsx(FileIcon, { className: "text-muted-foreground h-6 w-6" })
 		});
-		$[17] = asset.alt;
-		$[18] = asset.filename;
-		$[19] = asset.url;
-		$[20] = assetType;
-		$[21] = t11;
-	} else t11 = $[21];
+		$[18] = asset.alt;
+		$[19] = asset.filename;
+		$[20] = asset.url;
+		$[21] = assetType;
+		$[22] = t11;
+	} else t11 = $[22];
 	const t12 = asset.filename || "Untitled";
 	let t13;
-	if ($[22] !== asset.filename || $[23] !== t12) {
+	if ($[23] !== asset.filename || $[24] !== t12) {
 		t13 = /* @__PURE__ */ jsx("p", {
 			className: "flex-1 truncate text-left text-sm",
 			title: asset.filename,
 			children: t12
 		});
-		$[22] = asset.filename;
-		$[23] = t12;
-		$[24] = t13;
-	} else t13 = $[24];
+		$[23] = asset.filename;
+		$[24] = t12;
+		$[25] = t13;
+	} else t13 = $[25];
 	let t14;
-	if ($[25] !== t10 || $[26] !== t11 || $[27] !== t13) {
+	if ($[26] !== t10 || $[27] !== t11 || $[28] !== t13) {
 		t14 = /* @__PURE__ */ jsxs("button", {
 			type: "button",
 			className: "flex min-w-0 flex-1 cursor-zoom-in items-center gap-2",
 			onClick: t10,
 			children: [t11, t13]
 		});
-		$[25] = t10;
-		$[26] = t11;
-		$[27] = t13;
-		$[28] = t14;
-	} else t14 = $[28];
+		$[26] = t10;
+		$[27] = t11;
+		$[28] = t13;
+		$[29] = t14;
+	} else t14 = $[29];
 	let t15;
-	if ($[29] !== asset._fileId || $[30] !== onRemove) {
+	if ($[30] !== asset._fileId || $[31] !== onRemove) {
 		t15 = () => onRemove(asset._fileId);
-		$[29] = asset._fileId;
-		$[30] = onRemove;
-		$[31] = t15;
-	} else t15 = $[31];
+		$[30] = asset._fileId;
+		$[31] = onRemove;
+		$[32] = t15;
+	} else t15 = $[32];
 	let t16;
-	if ($[32] !== asset._fileId || $[33] !== t15) {
+	if ($[33] !== asset._fileId || $[34] !== t15) {
 		t16 = /* @__PURE__ */ jsx(UnlinkAssetButton, {
 			fileId: asset._fileId,
 			onUnlink: t15,
 			className: "hidden group-focus-within:flex group-hover:flex"
 		});
-		$[32] = asset._fileId;
-		$[33] = t15;
-		$[34] = t16;
-	} else t16 = $[34];
+		$[33] = asset._fileId;
+		$[34] = t15;
+		$[35] = t16;
+	} else t16 = $[35];
 	let t17;
-	if ($[35] !== setNodeRef || $[36] !== style || $[37] !== t14 || $[38] !== t16 || $[39] !== t7 || $[40] !== t9) {
+	if ($[36] !== setNodeRef || $[37] !== style || $[38] !== t14 || $[39] !== t16 || $[40] !== t7 || $[41] !== t9) {
 		t17 = /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", {
 			ref: setNodeRef,
 			style,
@@ -158,44 +162,48 @@ const SortableAssetItem = (t0) => {
 				t16
 			]
 		}) });
-		$[35] = setNodeRef;
-		$[36] = style;
-		$[37] = t14;
-		$[38] = t16;
-		$[39] = t7;
-		$[40] = t9;
-		$[41] = t17;
-	} else t17 = $[41];
+		$[36] = setNodeRef;
+		$[37] = style;
+		$[38] = t14;
+		$[39] = t16;
+		$[40] = t7;
+		$[41] = t9;
+		$[42] = t17;
+	} else t17 = $[42];
 	return t17;
 };
 const MultipleAssetFieldEditor = (t0) => {
-	const $ = c(15);
+	const $ = c(16);
+	if ($[0] !== "edd84331a88dec86cb85175ea4b5855869d1ffb6129d2a357826a8aa2e61f7a0") {
+		for (let $i = 0; $i < 16; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "edd84331a88dec86cb85175ea4b5855869d1ffb6129d2a357826a8aa2e61f7a0";
+	}
 	const { fieldName, assetType, currentData, onFieldChange } = t0;
 	const contentKey = assetType === "Image" ? "image" : "file";
 	const isImage = assetType === "Image";
 	const fileInputRef = React.useRef(null);
 	const projectSlug = useProjectSlug();
 	let t1;
-	if ($[0] !== projectSlug) {
+	if ($[1] !== projectSlug) {
 		t1 = projectQueries.getBySlug(projectSlug);
-		$[0] = projectSlug;
-		$[1] = t1;
-	} else t1 = $[1];
+		$[1] = projectSlug;
+		$[2] = t1;
+	} else t1 = $[2];
 	const { data: project } = useQuery(t1);
 	const rawItems = currentData[fieldName] ?? [];
 	let t2;
-	if ($[2] !== contentKey) {
+	if ($[3] !== contentKey) {
 		t2 = (item) => item[contentKey];
-		$[2] = contentKey;
-		$[3] = t2;
-	} else t2 = $[3];
+		$[3] = contentKey;
+		$[4] = t2;
+	} else t2 = $[4];
 	const items = rawItems.map(t2).filter(_temp);
 	let t3;
-	if ($[4] !== contentKey) {
+	if ($[5] !== contentKey) {
 		t3 = (assets) => assets.map((a_0) => ({ [contentKey]: { _fileId: a_0._fileId } }));
-		$[4] = contentKey;
-		$[5] = t3;
-	} else t3 = $[5];
+		$[5] = contentKey;
+		$[6] = t3;
+	} else t3 = $[6];
 	const toStorageFormat = t3;
 	const addFileId = (fileId) => {
 		onFieldChange(fieldName, [...toStorageFormat(items), { [contentKey]: { _fileId: fileId } }]);
@@ -209,10 +217,10 @@ const MultipleAssetFieldEditor = (t0) => {
 	const [pickerOpen, setPickerOpen] = React.useState(false);
 	const [lightboxAsset, setLightboxAsset] = React.useState(null);
 	let t4;
-	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
 		t4 = { coordinateGetter: sortableKeyboardCoordinates };
-		$[6] = t4;
-	} else t4 = $[6];
+		$[7] = t4;
+	} else t4 = $[7];
 	const sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor, t4));
 	const handleDragEnd = (event) => {
 		const { active, over } = event;
@@ -269,7 +277,7 @@ const MultipleAssetFieldEditor = (t0) => {
 		})]
 	});
 	let t6;
-	if ($[7] !== lightboxAsset || $[8] !== setLightboxAsset) {
+	if ($[8] !== lightboxAsset || $[9] !== setLightboxAsset) {
 		t6 = lightboxAsset && /* @__PURE__ */ jsx(AssetLightbox, {
 			open: !!lightboxAsset,
 			onOpenChange: (open) => {
@@ -277,22 +285,22 @@ const MultipleAssetFieldEditor = (t0) => {
 			},
 			fileId: lightboxAsset._fileId
 		});
-		$[7] = lightboxAsset;
-		$[8] = setLightboxAsset;
-		$[9] = t6;
-	} else t6 = $[9];
+		$[8] = lightboxAsset;
+		$[9] = setLightboxAsset;
+		$[10] = t6;
+	} else t6 = $[10];
 	let t7;
-	if ($[10] !== T0 || $[11] !== t5 || $[12] !== t6 || $[13] !== uploadFiles) {
+	if ($[11] !== T0 || $[12] !== t5 || $[13] !== t6 || $[14] !== uploadFiles) {
 		t7 = /* @__PURE__ */ jsxs(T0, {
 			onDrop: uploadFiles,
 			children: [t5, t6]
 		});
-		$[10] = T0;
-		$[11] = t5;
-		$[12] = t6;
-		$[13] = uploadFiles;
-		$[14] = t7;
-	} else t7 = $[14];
+		$[11] = T0;
+		$[12] = t5;
+		$[13] = t6;
+		$[14] = uploadFiles;
+		$[15] = t7;
+	} else t7 = $[15];
 	return t7;
 };
 function _temp(a) {

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

@@ -11,13 +11,17 @@ import * as React from "react";
 * Listening for focus commands from parent (for sidebar-triggered focus)
 */
 const OverlayTracker = () => {
-	const $ = c(8);
+	const $ = c(9);
+	if ($[0] !== "ff61be3a0e44ee40cf7da4c940df8a337c7da414db4f8b92a3d25603d05282e6") {
+		for (let $i = 0; $i < 9; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "ff61be3a0e44ee40cf7da4c940df8a337c7da414db4f8b92a3d25603d05282e6";
+	}
 	const { window: iframeWindow } = useFrame();
 	const isPageContentSheetOpen = useSelector(previewStore, _temp);
 	const isAddBlockSheetOpen = useSelector(previewStore, _temp2);
 	let t0;
 	let t1;
-	if ($[0] !== iframeWindow || $[1] !== isAddBlockSheetOpen) {
+	if ($[1] !== iframeWindow || $[2] !== isAddBlockSheetOpen) {
 		t0 = () => {
 			if (!iframeWindow || !isAddBlockSheetOpen) return;
 			const handleClick = _temp3;
@@ -25,18 +29,18 @@ const OverlayTracker = () => {
 			return () => iframeWindow.document.removeEventListener("click", handleClick);
 		};
 		t1 = [iframeWindow, isAddBlockSheetOpen];
-		$[0] = iframeWindow;
-		$[1] = isAddBlockSheetOpen;
-		$[2] = t0;
-		$[3] = t1;
+		$[1] = iframeWindow;
+		$[2] = isAddBlockSheetOpen;
+		$[3] = t0;
+		$[4] = t1;
 	} else {
-		t0 = $[2];
-		t1 = $[3];
+		t0 = $[3];
+		t1 = $[4];
 	}
 	React.useEffect(t0, t1);
 	let t2;
 	let t3;
-	if ($[4] !== iframeWindow || $[5] !== isPageContentSheetOpen) {
+	if ($[5] !== iframeWindow || $[6] !== isPageContentSheetOpen) {
 		t2 = () => {
 			if (!iframeWindow) return;
 			const handleMessage = (event) => {
@@ -53,13 +57,13 @@ const OverlayTracker = () => {
 			return () => iframeWindow.removeEventListener("message", handleMessage);
 		};
 		t3 = [iframeWindow, isPageContentSheetOpen];
-		$[4] = iframeWindow;
-		$[5] = isPageContentSheetOpen;
-		$[6] = t2;
-		$[7] = t3;
+		$[5] = iframeWindow;
+		$[6] = isPageContentSheetOpen;
+		$[7] = t2;
+		$[8] = t3;
 	} else {
-		t2 = $[6];
-		t3 = $[7];
+		t2 = $[7];
+		t3 = $[8];
 	}
 	React.useEffect(t2, t3);
 	return null;

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

@@ -8,7 +8,11 @@ import * as React from "react";
 
 //#region src/features/preview/components/Overlays.tsx
 const Overlays = (t0) => {
-	const $ = c(14);
+	const $ = c(15);
+	if ($[0] !== "f759f7c90424510dda53603baa60750e2781cc80efac98df6bfb96a5f03ff4f9") {
+		for (let $i = 0; $i < 15; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "f759f7c90424510dda53603baa60750e2781cc80efac98df6bfb96a5f03ff4f9";
+	}
 	const { iframeElement } = t0;
 	const isPageContentSheetOpen = useSelector(previewStore, _temp);
 	const selection = useSelector(previewStore, _temp2);
@@ -16,7 +20,7 @@ const Overlays = (t0) => {
 	const page = usePreviewedPage();
 	const { pageBlocks } = usePageBlocks(page);
 	let t1;
-	if ($[0] !== pageBlocks) {
+	if ($[1] !== pageBlocks) {
 		t1 = () => {
 			const handleMessage = (event) => {
 				if (!isOverlayMessage(event.data)) return;
@@ -40,18 +44,18 @@ const Overlays = (t0) => {
 			window.addEventListener("message", handleMessage);
 			return () => window.removeEventListener("message", handleMessage);
 		};
-		$[0] = pageBlocks;
-		$[1] = t1;
-	} else t1 = $[1];
+		$[1] = pageBlocks;
+		$[2] = t1;
+	} else t1 = $[2];
 	let t2;
-	if ($[2] !== page) {
+	if ($[3] !== page) {
 		t2 = [page];
-		$[2] = page;
-		$[3] = t2;
-	} else t2 = $[3];
+		$[3] = page;
+		$[4] = t2;
+	} else t2 = $[4];
 	React.useEffect(t1, t2);
 	let t3;
-	if ($[4] !== iframeElement?.contentWindow || $[5] !== isPageContentSheetOpen || $[6] !== peekedBlock || $[7] !== selection) {
+	if ($[5] !== iframeElement?.contentWindow || $[6] !== isPageContentSheetOpen || $[7] !== peekedBlock || $[8] !== selection) {
 		t3 = () => {
 			if (isPageContentSheetOpen) return;
 			if (peekedBlock) return;
@@ -66,26 +70,26 @@ const Overlays = (t0) => {
 			};
 			iframeElement?.contentWindow?.postMessage(message_0, "*");
 		};
-		$[4] = iframeElement?.contentWindow;
-		$[5] = isPageContentSheetOpen;
-		$[6] = peekedBlock;
-		$[7] = selection;
-		$[8] = t3;
-	} else t3 = $[8];
+		$[5] = iframeElement?.contentWindow;
+		$[6] = isPageContentSheetOpen;
+		$[7] = peekedBlock;
+		$[8] = selection;
+		$[9] = t3;
+	} else t3 = $[9];
 	let t4;
-	if ($[9] !== iframeElement || $[10] !== isPageContentSheetOpen || $[11] !== peekedBlock || $[12] !== selection) {
+	if ($[10] !== iframeElement || $[11] !== isPageContentSheetOpen || $[12] !== peekedBlock || $[13] !== selection) {
 		t4 = [
 			selection,
 			isPageContentSheetOpen,
 			peekedBlock,
 			iframeElement
 		];
-		$[9] = iframeElement;
-		$[10] = isPageContentSheetOpen;
-		$[11] = peekedBlock;
-		$[12] = selection;
-		$[13] = t4;
-	} else t4 = $[13];
+		$[10] = iframeElement;
+		$[11] = isPageContentSheetOpen;
+		$[12] = peekedBlock;
+		$[13] = selection;
+		$[14] = t4;
+	} else t4 = $[14];
 	React.useEffect(t3, t4);
 	return null;
 };

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

@@ -7,6 +7,7 @@ import { useCamoxApp } from "../../provider/components/CamoxAppContext.js";
 import { trackClientEvent } from "../../../lib/analytics-client.js";
 import { fieldTypesDictionary } from "../../../core/lib/fieldTypes.js";
 import { SingleAssetFieldEditor } from "./AssetFieldEditor.js";
+import { useRepeatableItemActions } from "./useRepeatableItemActions.js";
 import { ItemFieldsEditor, formatFieldName } from "./ItemFieldsEditor.js";
 import { LinkFieldEditor } from "./LinkFieldEditor.js";
 import { MultipleAssetFieldEditor } from "./MultipleAssetFieldEditor.js";
@@ -16,8 +17,11 @@ import { useMutation, useQueries, useQuery } from "@tanstack/react-query";
 import { useSelector } from "@xstate/store/react";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "@camox/ui/button";
+import { CircleMinus, CirclePlus, CornerLeftUp } from "lucide-react";
 import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "@camox/ui/dropdown-menu";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@camox/ui/select";
+import { Spinner } from "@camox/ui/spinner";
 import { Switch } from "@camox/ui/switch";
 import { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator } from "@camox/ui/breadcrumb";
 
@@ -151,6 +155,20 @@ const PageContentSheet = () => {
 		itemsMap
 	]);
 	const currentItem = currentItemId != null ? itemsMap.get(currentItemId) : null;
+	const isItemLoading = currentItemId != null && !currentItem;
+	const siblingCount = React.useMemo(() => {
+		if (!currentItem) return 0;
+		let count = 0;
+		for (const it of itemsMap.values()) if (it.fieldName === currentItem.fieldName && it.parentItemId === currentItem.parentItemId) count++;
+		return count;
+	}, [currentItem, itemsMap]);
+	const { canAdd: canAddSibling, addItem: addSibling, canRemove: canRemoveCurrent, removeItem: removeCurrent } = useRepeatableItemActions({
+		blockId: block?.id ?? -1,
+		fieldName: currentItem?.fieldName ?? "",
+		parentItemId: currentItem?.parentItemId ?? null,
+		arraySchema: itemArraySchema,
+		siblingCount
+	});
 	const rawCurrentData = currentItem ? currentItem.content : block?.content ?? {};
 	const currentData = React.useMemo(() => {
 		const resolveFile = (marker) => {
@@ -353,9 +371,12 @@ const PageContentSheet = () => {
 					]
 				})
 			})]
-		}), /* @__PURE__ */ jsxs("div", {
+		}), /* @__PURE__ */ jsx("div", {
 			className: "flex-1 overflow-auto",
-			children: [
+			children: isItemLoading ? /* @__PURE__ */ jsx("div", {
+				className: "flex h-full items-center justify-center py-12",
+				children: /* @__PURE__ */ jsx(Spinner, {})
+			}) : /* @__PURE__ */ jsxs(Fragment, { children: [
 				currentItemId == null && !fieldHasOwnView && settingsFields.length > 0 && /* @__PURE__ */ jsxs("div", {
 					className: "border-border space-y-4 border-b px-4 py-4",
 					children: [/* @__PURE__ */ jsx(Label, {
@@ -505,8 +526,37 @@ const PageContentSheet = () => {
 					itemsMap,
 					fieldIdPrefix,
 					autoFocusFieldName
-				}, currentItemId ?? `block-${block.id}`)
-			]
+				}, currentItemId ?? `block-${block.id}`),
+				!isViewingAsset && !isViewingLink && currentItemId != null && currentItem && /* @__PURE__ */ jsxs("div", {
+					className: "border-border flex items-center gap-1 border-t px-4 py-4",
+					children: [
+						canAddSibling && /* @__PURE__ */ jsxs(Button, {
+							type: "button",
+							variant: "ghost",
+							size: "sm",
+							className: "text-muted-foreground justify-start",
+							onClick: () => addSibling({ afterPosition: currentItem.position }),
+							children: [/* @__PURE__ */ jsx(CirclePlus, { className: "h-4 w-4" }), "Add item"]
+						}),
+						canRemoveCurrent && /* @__PURE__ */ jsxs(Button, {
+							type: "button",
+							variant: "ghost",
+							size: "sm",
+							className: "text-muted-foreground justify-start",
+							onClick: () => removeCurrent(currentItemId, { onSuccess: () => previewStore.send({ type: "selectParent" }) }),
+							children: [/* @__PURE__ */ jsx(CircleMinus, { className: "h-4 w-4" }), "Remove item"]
+						}),
+						/* @__PURE__ */ jsxs(Button, {
+							type: "button",
+							variant: "ghost",
+							size: "sm",
+							className: "text-muted-foreground justify-start",
+							onClick: () => previewStore.send({ type: "selectParent" }),
+							children: [/* @__PURE__ */ jsx(CornerLeftUp, { className: "h-4 w-4" }), "Select parent"]
+						})
+					]
+				})
+			] })
 		})]
 	});
 };