camox 0.14.2 → 0.16.0

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

@@ -1,10 +1,10 @@
 import { previewStore, selectionItemId } from "../previewStore.js";
 import { repeatableItemMutations } from "../../../lib/queries.js";
 import { cn } from "../../../lib/utils.js";
+import { useRepeatableItemActions } from "./useRepeatableItemActions.js";
 import { c } from "react/compiler-runtime";
 import { useMutation } from "@tanstack/react-query";
 import { useSelector } from "@xstate/store/react";
-import { generateKeyBetween } from "fractional-indexing";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "@camox/ui/button";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@camox/ui/tooltip";
@@ -16,47 +16,51 @@ import { CSS } from "@dnd-kit/utilities";
 
 //#region src/features/preview/components/RepeatableItemsList.tsx
 const SortableRepeatableItem = (t0) => {
-	const $ = c(46);
+	const $ = c(47);
+	if ($[0] !== "4d49cc6148051733fc9bcda7aa88db74588442d3481baf1e20047b618caf419a") {
+		for (let $i = 0; $i < 47; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "4d49cc6148051733fc9bcda7aa88db74588442d3481baf1e20047b618caf419a";
+	}
 	const { item, fieldName, blockId, canRemove, onRemove } = t0;
 	const t1 = String(item.id);
 	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;
 	let t6;
-	if ($[8] !== item.id) {
+	if ($[9] !== item.id) {
 		t6 = (state) => selectionItemId(state.context.selection) === item.id;
-		$[8] = item.id;
-		$[9] = t6;
-	} else t6 = $[9];
+		$[9] = item.id;
+		$[10] = t6;
+	} else t6 = $[10];
 	const isSelected = useSelector(previewStore, t6);
 	const iframeElement = useSelector(previewStore, _temp);
 	const shouldShowHover = !isDragging && !isSelected;
 	let t7;
-	if ($[10] !== blockId || $[11] !== iframeElement || $[12] !== item.id) {
+	if ($[11] !== blockId || $[12] !== iframeElement || $[13] !== item.id) {
 		t7 = () => {
 			if (!iframeElement?.contentWindow) return;
 			const message = {
@@ -66,14 +70,14 @@ const SortableRepeatableItem = (t0) => {
 			};
 			iframeElement.contentWindow.postMessage(message, "*");
 		};
-		$[10] = blockId;
-		$[11] = iframeElement;
-		$[12] = item.id;
-		$[13] = t7;
-	} else t7 = $[13];
+		$[11] = blockId;
+		$[12] = iframeElement;
+		$[13] = item.id;
+		$[14] = t7;
+	} else t7 = $[14];
 	const handleMouseEnter = t7;
 	let t8;
-	if ($[14] !== blockId || $[15] !== iframeElement || $[16] !== item.id) {
+	if ($[15] !== blockId || $[16] !== iframeElement || $[17] !== item.id) {
 		t8 = () => {
 			if (!iframeElement?.contentWindow) return;
 			const message_0 = {
@@ -83,28 +87,28 @@ const SortableRepeatableItem = (t0) => {
 			};
 			iframeElement.contentWindow.postMessage(message_0, "*");
 		};
-		$[14] = blockId;
-		$[15] = iframeElement;
-		$[16] = item.id;
-		$[17] = t8;
-	} else t8 = $[17];
+		$[15] = blockId;
+		$[16] = iframeElement;
+		$[17] = item.id;
+		$[18] = t8;
+	} else t8 = $[18];
 	const handleMouseLeave = t8;
 	const t9 = shouldShowHover && "hover:bg-accent/75";
 	const t10 = isSelected && "bg-accent text-accent-foreground";
 	let t11;
-	if ($[18] !== t10 || $[19] !== t9) {
+	if ($[19] !== t10 || $[20] !== t9) {
 		t11 = cn("flex flex-row justify-between items-center gap-2 px-1 py-1 max-w-full rounded-lg text-foreground transition-none group", t9, t10);
-		$[18] = t10;
-		$[19] = t9;
-		$[20] = t11;
-	} else t11 = $[20];
+		$[19] = t10;
+		$[20] = t9;
+		$[21] = t11;
+	} else t11 = $[21];
 	let t12;
-	if ($[21] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[22] === Symbol.for("react.memo_cache_sentinel")) {
 		t12 = /* @__PURE__ */ jsx(GripVertical, { className: "h-4 w-4" });
-		$[21] = t12;
-	} else t12 = $[21];
+		$[22] = t12;
+	} else t12 = $[22];
 	let t13;
-	if ($[22] !== attributes || $[23] !== listeners) {
+	if ($[23] !== attributes || $[24] !== listeners) {
 		t13 = /* @__PURE__ */ jsx(Button, {
 			type: "button",
 			variant: "ghost",
@@ -114,12 +118,12 @@ const SortableRepeatableItem = (t0) => {
 			...listeners,
 			children: t12
 		});
-		$[22] = attributes;
-		$[23] = listeners;
-		$[24] = t13;
-	} else t13 = $[24];
+		$[23] = attributes;
+		$[24] = listeners;
+		$[25] = t13;
+	} else t13 = $[25];
 	let t14;
-	if ($[25] !== blockId || $[26] !== handleMouseLeave || $[27] !== item.id) {
+	if ($[26] !== blockId || $[27] !== handleMouseLeave || $[28] !== item.id) {
 		t14 = () => {
 			handleMouseLeave();
 			previewStore.send({
@@ -128,14 +132,14 @@ const SortableRepeatableItem = (t0) => {
 				itemId: item.id
 			});
 		};
-		$[25] = blockId;
-		$[26] = handleMouseLeave;
-		$[27] = item.id;
-		$[28] = t14;
-	} else t14 = $[28];
+		$[26] = blockId;
+		$[27] = handleMouseLeave;
+		$[28] = item.id;
+		$[29] = t14;
+	} else t14 = $[29];
 	const t15 = item.summary || `${fieldName} (${item.id})`;
 	let t16;
-	if ($[29] !== item.summary || $[30] !== t14 || $[31] !== t15) {
+	if ($[30] !== item.summary || $[31] !== t14 || $[32] !== t15) {
 		t16 = /* @__PURE__ */ jsx("div", {
 			className: "flex flex-1 items-center gap-1 overflow-x-hidden",
 			children: /* @__PURE__ */ jsx("p", {
@@ -145,13 +149,13 @@ const SortableRepeatableItem = (t0) => {
 				children: t15
 			})
 		});
-		$[29] = item.summary;
-		$[30] = t14;
-		$[31] = t15;
-		$[32] = t16;
-	} else t16 = $[32];
+		$[30] = item.summary;
+		$[31] = t14;
+		$[32] = t15;
+		$[33] = t16;
+	} else t16 = $[33];
 	let t17;
-	if ($[33] !== canRemove || $[34] !== item.id || $[35] !== onRemove) {
+	if ($[34] !== canRemove || $[35] !== item.id || $[36] !== onRemove) {
 		t17 = canRemove && /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
 			render: /* @__PURE__ */ jsx(Button, {
 				type: "button",
@@ -168,13 +172,13 @@ const SortableRepeatableItem = (t0) => {
 			side: "right",
 			children: "Remove item"
 		})] });
-		$[33] = canRemove;
-		$[34] = item.id;
-		$[35] = onRemove;
-		$[36] = t17;
-	} else t17 = $[36];
+		$[34] = canRemove;
+		$[35] = item.id;
+		$[36] = onRemove;
+		$[37] = t17;
+	} else t17 = $[37];
 	let t18;
-	if ($[37] !== handleMouseEnter || $[38] !== handleMouseLeave || $[39] !== setNodeRef || $[40] !== style || $[41] !== t11 || $[42] !== t13 || $[43] !== t16 || $[44] !== t17) {
+	if ($[38] !== handleMouseEnter || $[39] !== handleMouseLeave || $[40] !== setNodeRef || $[41] !== style || $[42] !== t11 || $[43] !== t13 || $[44] !== t16 || $[45] !== t17) {
 		t18 = /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", {
 			ref: setNodeRef,
 			style,
@@ -187,118 +191,90 @@ const SortableRepeatableItem = (t0) => {
 				t17
 			]
 		}) });
-		$[37] = handleMouseEnter;
-		$[38] = handleMouseLeave;
-		$[39] = setNodeRef;
-		$[40] = style;
-		$[41] = t11;
-		$[42] = t13;
-		$[43] = t16;
-		$[44] = t17;
-		$[45] = t18;
-	} else t18 = $[45];
+		$[38] = handleMouseEnter;
+		$[39] = handleMouseLeave;
+		$[40] = setNodeRef;
+		$[41] = style;
+		$[42] = t11;
+		$[43] = t13;
+		$[44] = t16;
+		$[45] = t17;
+		$[46] = t18;
+	} else t18 = $[46];
 	return t18;
 };
-const RepeatableItemsList = ({ items, blockId, fieldName, minItems, maxItems, schema }) => {
-	const createRepeatableItem = useMutation(repeatableItemMutations.create());
-	const deleteRepeatableItem = useMutation(repeatableItemMutations.delete());
-	const updateRepeatablePosition = useMutation(repeatableItemMutations.updatePosition());
-	const canAdd = maxItems === void 0 || items.length < maxItems;
-	const canRemove = minItems === void 0 || items.length > minItems;
-	const handleAddItem = () => {
-		const defaultContent = {};
-		const itemsSchema = schema?.items;
-		if (itemsSchema?.properties) for (const [key, prop] of Object.entries(itemsSchema.properties)) {
-			const ft = prop.fieldType;
-			if (ft === "Image" || ft === "File") continue;
-			if (prop.type === "array" && prop.items?.properties) continue;
-			if ("default" in prop) defaultContent[key] = prop.default;
-		}
-		const defaultSettings = schema?.defaultItemSettings;
-		const nestedItems = [];
-		if (itemsSchema?.properties) {
-			let seedCounter = 0;
-			const buildNestedSeeds = (properties, parentTempId) => {
-				for (const [nestedFieldName, fieldSchemaDef] of Object.entries(properties)) {
-					const fs = fieldSchemaDef;
-					if (fs.type !== "array" || !fs.items?.properties) continue;
-					const defaultCount = fs.defaultItems ?? fs.minItems ?? 0;
-					if (defaultCount <= 0) continue;
-					const nestedItemProps = fs.items.properties;
-					const nestedContent = {};
-					for (const [propName, propSchema] of Object.entries(nestedItemProps)) {
-						const ps = propSchema;
-						if (ps.type === "array" && ps.items?.properties) continue;
-						if ("default" in ps) nestedContent[propName] = ps.default;
-					}
-					const nestedSettingsDefaults = fs.defaultItemSettings;
-					let prevPos = null;
-					for (let i = 0; i < defaultCount; i++) {
-						const tempId = `nested_${++seedCounter}`;
-						const position = generateKeyBetween(prevPos, null);
-						prevPos = position;
-						nestedItems.push({
-							tempId,
-							parentTempId,
-							fieldName: nestedFieldName,
-							content: { ...nestedContent },
-							settings: nestedSettingsDefaults ? { ...nestedSettingsDefaults } : void 0,
-							position
-						});
-						buildNestedSeeds(nestedItemProps, tempId);
-					}
-				}
-			};
-			buildNestedSeeds(itemsSchema.properties, null);
-		}
-		createRepeatableItem.mutate({
+const RepeatableItemsList = (t0) => {
+	const $ = c(25);
+	if ($[0] !== "4d49cc6148051733fc9bcda7aa88db74588442d3481baf1e20047b618caf419a") {
+		for (let $i = 0; $i < 25; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "4d49cc6148051733fc9bcda7aa88db74588442d3481baf1e20047b618caf419a";
+	}
+	const { items, blockId, fieldName, schema } = t0;
+	let t1;
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = repeatableItemMutations.updatePosition();
+		$[1] = t1;
+	} else t1 = $[1];
+	const updateRepeatablePosition = useMutation(t1);
+	const t2 = schema;
+	let t3;
+	if ($[2] !== blockId || $[3] !== fieldName || $[4] !== items.length || $[5] !== t2) {
+		t3 = {
 			blockId,
 			fieldName,
-			content: defaultContent,
-			settings: defaultSettings ? { ...defaultSettings } : void 0,
-			nestedItems: nestedItems.length > 0 ? nestedItems : void 0
-		}, { onSuccess: (created) => {
-			previewStore.send({
-				type: "selectItem",
-				blockId,
-				itemId: created.id
+			arraySchema: t2,
+			siblingCount: items.length
+		};
+		$[2] = blockId;
+		$[3] = fieldName;
+		$[4] = items.length;
+		$[5] = t2;
+		$[6] = t3;
+	} else t3 = $[6];
+	const { canAdd, addItem, canRemove, removeItem } = useRepeatableItemActions(t3);
+	let t4;
+	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = { coordinateGetter: sortableKeyboardCoordinates };
+		$[7] = t4;
+	} else t4 = $[7];
+	const sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor, t4));
+	let t5;
+	if ($[8] !== items || $[9] !== updateRepeatablePosition) {
+		t5 = async (event) => {
+			const { active, over } = event;
+			if (!over || active.id === over.id) return;
+			const oldIndex = items.findIndex((item) => String(item.id) === active.id);
+			const newIndex = items.findIndex((item_0) => String(item_0.id) === over.id);
+			if (oldIndex === -1 || newIndex === -1) return;
+			let afterPosition;
+			let beforePosition;
+			if (oldIndex < newIndex) {
+				afterPosition = items[newIndex].position;
+				beforePosition = newIndex < items.length - 1 ? items[newIndex + 1].position : void 0;
+			} else {
+				afterPosition = newIndex > 0 ? items[newIndex - 1].position : void 0;
+				beforePosition = items[newIndex].position;
+			}
+			await updateRepeatablePosition.mutateAsync({
+				id: Number(active.id),
+				afterPosition,
+				beforePosition
 			});
-		} });
-	};
-	const handleRemoveItem = (itemId) => {
-		deleteRepeatableItem.mutate({ id: itemId });
-	};
-	const sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }));
-	const handleDragEnd = async (event) => {
-		const { active, over } = event;
-		if (!over || active.id === over.id) return;
-		const oldIndex = items.findIndex((item) => String(item.id) === active.id);
-		const newIndex = items.findIndex((item_0) => String(item_0.id) === over.id);
-		if (oldIndex === -1 || newIndex === -1) return;
-		let afterPosition;
-		let beforePosition;
-		if (oldIndex < newIndex) {
-			afterPosition = items[newIndex].position;
-			beforePosition = newIndex < items.length - 1 ? items[newIndex + 1].position : void 0;
-		} else {
-			afterPosition = newIndex > 0 ? items[newIndex - 1].position : void 0;
-			beforePosition = items[newIndex].position;
-		}
-		await updateRepeatablePosition.mutateAsync({
-			id: Number(active.id),
-			afterPosition,
-			beforePosition
-		});
-	};
-	return /* @__PURE__ */ jsxs("div", {
-		className: "flex flex-col gap-1",
-		children: [items.length > 0 && /* @__PURE__ */ jsx(DndContext, {
+		};
+		$[8] = items;
+		$[9] = updateRepeatablePosition;
+		$[10] = t5;
+	} else t5 = $[10];
+	const handleDragEnd = t5;
+	let t6;
+	if ($[11] !== blockId || $[12] !== canRemove || $[13] !== fieldName || $[14] !== handleDragEnd || $[15] !== items || $[16] !== removeItem || $[17] !== sensors) {
+		t6 = items.length > 0 && /* @__PURE__ */ jsx(DndContext, {
 			sensors,
 			collisionDetection: closestCenter,
 			onDragEnd: handleDragEnd,
 			modifiers: [restrictToVerticalAxis],
 			children: /* @__PURE__ */ jsx(SortableContext, {
-				items: items.map((item_1) => String(item_1.id)),
+				items: items.map(_temp2),
 				strategy: verticalListSortingStrategy,
 				children: /* @__PURE__ */ jsx("ul", {
 					className: "flex flex-col gap-1",
@@ -307,23 +283,52 @@ const RepeatableItemsList = ({ items, blockId, fieldName, minItems, maxItems, sc
 						blockId,
 						fieldName,
 						canRemove,
-						onRemove: handleRemoveItem
+						onRemove: removeItem
 					}, String(item_2.id)))
 				})
 			})
-		}), canAdd && /* @__PURE__ */ jsxs(Button, {
+		});
+		$[11] = blockId;
+		$[12] = canRemove;
+		$[13] = fieldName;
+		$[14] = handleDragEnd;
+		$[15] = items;
+		$[16] = removeItem;
+		$[17] = sensors;
+		$[18] = t6;
+	} else t6 = $[18];
+	let t7;
+	if ($[19] !== addItem || $[20] !== canAdd) {
+		t7 = canAdd && /* @__PURE__ */ jsxs(Button, {
 			type: "button",
 			variant: "ghost",
 			size: "sm",
 			className: "text-muted-foreground justify-start self-start",
-			onClick: handleAddItem,
+			onClick: () => addItem(),
 			children: [/* @__PURE__ */ jsx(CirclePlus, { className: "h-4 w-4" }), "Add item"]
-		})]
-	});
+		});
+		$[19] = addItem;
+		$[20] = canAdd;
+		$[21] = t7;
+	} else t7 = $[21];
+	let t8;
+	if ($[22] !== t6 || $[23] !== t7) {
+		t8 = /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-col gap-1",
+			children: [t6, t7]
+		});
+		$[22] = t6;
+		$[23] = t7;
+		$[24] = t8;
+	} else t8 = $[24];
+	return t8;
 };
 function _temp(state_0) {
 	return state_0.context.iframeElement;
 }
+function _temp2(item_1) {
+	return String(item_1.id);
+}
 
 //#endregion
 export { RepeatableItemsList };

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

@@ -12,12 +12,16 @@ const css = `
 }
 `;
 const ShikiMarkdown = (t0) => {
-	const $ = c(6);
+	const $ = c(7);
+	if ($[0] !== "b223838fb3a1b4481de41582ca6cb14c501b277b861d32801b02a34152f069d4") {
+		for (let $i = 0; $i < 7; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "b223838fb3a1b4481de41582ca6cb14c501b277b861d32801b02a34152f069d4";
+	}
 	const { code } = t0;
 	const [html, setHtml] = React.useState("");
 	let t1;
 	let t2;
-	if ($[0] !== code) {
+	if ($[1] !== code) {
 		t1 = () => {
 			let cancelled = false;
 			codeToHtml(code, {
@@ -35,29 +39,29 @@ const ShikiMarkdown = (t0) => {
 			};
 		};
 		t2 = [code];
-		$[0] = code;
-		$[1] = t1;
-		$[2] = t2;
+		$[1] = code;
+		$[2] = t1;
+		$[3] = t2;
 	} else {
-		t1 = $[1];
-		t2 = $[2];
+		t1 = $[2];
+		t2 = $[3];
 	}
 	React.useEffect(t1, t2);
 	if (!html) return null;
 	let t3;
-	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
 		t3 = /* @__PURE__ */ jsx("style", { children: css });
-		$[3] = t3;
-	} else t3 = $[3];
+		$[4] = t3;
+	} else t3 = $[4];
 	let t4;
-	if ($[4] !== html) {
+	if ($[5] !== html) {
 		t4 = /* @__PURE__ */ jsxs(Fragment, { children: [t3, /* @__PURE__ */ jsx("div", {
 			className: "border-input w-full min-w-0 overflow-hidden rounded-md border text-sm [&_code]:font-mono [&_pre]:rounded-md [&_pre]:px-3 [&_pre]:py-2 [&_pre]:break-all [&_pre]:whitespace-pre-wrap",
 			dangerouslySetInnerHTML: { __html: html }
 		})] });
-		$[4] = html;
-		$[5] = t4;
-	} else t4 = $[5];
+		$[5] = html;
+		$[6] = t4;
+	} else t4 = $[6];
 	return t4;
 };