camox 0.33.1 → 0.35.0

package/dist/core/createBlock.js

@@ -1,132 +1,100 @@
+import { useLocation } from "../features/navigation/navigation.js";
 import { useProjectSlug } from "../lib/auth.js";
-import { blockMutations, pageQueries, projectQueries, repeatableItemMutations } from "../lib/queries.js";
-import { trackClientEvent } from "../lib/telemetry-client.js";
-import { useFrame } from "../features/preview/components/Frame.js";
-import { postOverlayMessage } from "../features/preview/overlayMessages.js";
-import { previewStore } from "../features/preview/previewStore.js";
+import { viewPageQueries, viewProjectQueries } from "../lib/view-queries.js";
 import { isFileMarker, isItemMarker, resolveFileMarker, useNormalizedData } from "../lib/normalized-data.js";
-import { AddBlockControlBar } from "./components/AddBlockControlBar.js";
-import { InlineLexicalEditor } from "./components/lexical/InlineLexicalEditor.js";
-import { useFieldSelection } from "./hooks/useFieldSelection.js";
-import { useIsEditable } from "./hooks/useIsEditable.js";
-import { useOverlayMessage } from "./hooks/useOverlayMessage.js";
+import { useBlockEditingRuntime } from "./editing/BlockEditingRuntime.js";
 import { Type, resolveToMarkdown } from "./lib/contentType.js";
 import { buildImageSrcSet, getDefaultImageSizes, getDefaultImageWidth, transformImageUrl } from "./lib/imageTransform.js";
 import { markdownToReactNodes } from "./lib/lexicalReact.js";
 import { c } from "react/compiler-runtime";
-import { Input } from "@camox/ui/input";
-import { Label } from "@camox/ui/label";
-import { Popover, PopoverContent, PopoverTrigger } from "@camox/ui/popover";
 import { Type as Type$1 } from "@sinclair/typebox";
-import { useMutation, useQuery } from "@tanstack/react-query";
-import { useLocation } from "@tanstack/react-router";
-import { useSelector } from "@xstate/store-react";
+import { useQuery } from "@tanstack/react-query";
 import { generateKeyBetween } from "fractional-indexing";
 import * as React from "react";
-import { createPortal } from "react-dom";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/core/createBlock.tsx
-/** Normalize legacy links (no `type` field) to the new union shape */
-const normalizeLinkValue = (value) => {
-	if (!value.type) return {
+const ASSET_LIST_SELF_KEY = "__camox_asset_self__";
+function normalizeLinkValue(value) {
+	if (value.type) return value;
+	return {
 		type: "external",
 		...value
 	};
-	return value;
-};
-/**
-* Resolve a LinkValue to an href string.
-*
-* Hash-only and empty hrefs are anchored to `currentPathname` so TanStack Router's
-* `<Link to>` builds the same `href` on SSR and client — bare `"#"` otherwise
-* resolves inconsistently across environments, causing hydration mismatches.
-*/
-const resolveLinkHref = (link, pages, currentPathname) => {
-	if (link.type === "page") return (pages?.find((p) => String(p.id) === link.pageId))?.fullPath ?? currentPathname;
-	if (!link.href || link.href.startsWith("#")) return `${currentPathname}${link.href ?? ""}`;
+}
+function resolveLinkHref(link, pages, pathname) {
+	if (link.type === "page") return pages?.find((page) => String(page.id) === link.pageId)?.fullPath ?? pathname;
+	if (!link.href || link.href.startsWith("#")) return `${pathname}${link.href ?? ""}`;
 	return link.href;
-};
-/**
-* Recursively walks schema properties to generate RepeatableItemSeed objects.
-* Sets `_itemId` placeholder markers on `content` for each repeatable field,
-* and pushes seed objects into `allSeeds`.
-*/
-function buildInitialSeeds(properties, parentTempId, content, allSeeds, counter) {
-	for (const [fieldName, fieldSchema] of Object.entries(properties)) {
-		if (fieldSchema.type !== "array" || !fieldSchema.items?.properties) continue;
-		const ft = fieldSchema.fieldType;
-		if (ft === "ImageList" || ft === "FileList") continue;
-		const defaultCount = fieldSchema.defaultItems ?? fieldSchema.minItems ?? 0;
-		if (defaultCount <= 0) continue;
-		const itemProperties = fieldSchema.items.properties;
-		const itemContent = {};
-		for (const [propName, propSchema] of Object.entries(itemProperties)) {
-			if (propSchema.type === "array" && propSchema.items?.properties) continue;
-			if ("default" in propSchema) itemContent[propName] = propSchema.default;
-		}
-		const itemSettingsDefaults = fieldSchema.defaultItemSettings;
+}
+function collectDefaults(properties) {
+	const defaults = {};
+	for (const [key, property] of Object.entries(properties)) if ("default" in property) defaults[key] = property.default;
+	return defaults;
+}
+function buildInitialItems(properties, parentTempId, content, items, counter) {
+	for (const [fieldName, property] of Object.entries(properties)) {
+		if (property.type !== "array" || !property.items?.properties) continue;
+		if (property.fieldType === "ImageList" || property.fieldType === "FileList") continue;
 		const markers = [];
-		let prevPosition = null;
-		for (let i = 0; i < defaultCount; i++) {
+		const defaultCount = Number(property.defaultItems ?? property.minItems ?? 0);
+		let previousPosition = null;
+		for (let index = 0; index < defaultCount; index += 1) {
 			const tempId = `seed_${++counter.value}`;
-			const position = generateKeyBetween(prevPosition, null);
-			prevPosition = position;
-			allSeeds.push({
+			const itemContent = {};
+			for (const [key, itemProperty] of Object.entries(property.items.properties)) {
+				if (itemProperty.type === "array" && itemProperty.items?.properties) continue;
+				if ("default" in itemProperty) itemContent[key] = itemProperty.default;
+			}
+			const position = generateKeyBetween(previousPosition, null);
+			previousPosition = position;
+			items.push({
 				tempId,
 				parentTempId,
 				fieldName,
 				content: { ...itemContent },
-				settings: itemSettingsDefaults ? { ...itemSettingsDefaults } : void 0,
+				...property.defaultItemSettings && { settings: { ...property.defaultItemSettings } },
 				position
 			});
+			buildInitialItems(property.items?.properties ?? {}, tempId, {}, items, counter);
 			markers.push({ _itemId: tempId });
-			buildInitialSeeds(itemProperties, tempId, {}, allSeeds, counter);
 		}
 		content[fieldName] = markers;
 	}
 }
-/**
-* Recursively walks schema properties to generate fake repeatable items for peek mode.
-* Sets `_itemId` markers on `content` for each repeatable field,
-* and pushes the corresponding fake items into `allItems`.
-*/
-function buildPeekItems(properties, blockId, parentItemId, content, allItems, counter) {
-	for (const [fieldName, fieldSchema] of Object.entries(properties)) {
-		if (fieldSchema.type !== "array" || !fieldSchema.items?.properties) continue;
-		if (fieldSchema.fieldType === "ImageList" || fieldSchema.fieldType === "FileList") continue;
-		const defaultCount = fieldSchema.defaultItems ?? fieldSchema.minItems ?? 0;
-		if (defaultCount <= 0) continue;
-		const itemProperties = fieldSchema.items.properties;
-		const itemContent = {};
-		for (const [propName, propSchema] of Object.entries(itemProperties)) {
-			if (propSchema.type === "array" && propSchema.items?.properties) continue;
-			if ("default" in propSchema) itemContent[propName] = propSchema.default;
-		}
-		const itemSettingsDefaults = fieldSchema.defaultItemSettings;
+function buildPeekItems(properties, blockId, parentItemId, content, items, counter) {
+	for (const [fieldName, property] of Object.entries(properties)) {
+		if (property.type !== "array" || !property.items?.properties) continue;
+		if (property.fieldType === "ImageList" || property.fieldType === "FileList") continue;
+		const defaultCount = Number(property.defaultItems ?? property.minItems ?? 0);
 		const markers = [];
-		let prevPosition = null;
-		for (let i = 0; i < defaultCount; i++) {
-			const itemId = --counter.value;
-			const position = generateKeyBetween(prevPosition, null);
-			prevPosition = position;
-			allItems.push({
-				id: itemId,
+		let previousPosition = null;
+		for (let index = 0; index < defaultCount; index += 1) {
+			const id = --counter.value;
+			const itemContent = {};
+			for (const [key, itemProperty] of Object.entries(property.items.properties)) {
+				if (itemProperty.type === "array" && itemProperty.items?.properties) continue;
+				if ("default" in itemProperty) itemContent[key] = itemProperty.default;
+			}
+			const position = generateKeyBetween(previousPosition, null);
+			previousPosition = position;
+			items.push({
+				id,
 				blockId,
 				parentItemId,
 				fieldName,
-				content: { ...itemContent },
-				settings: itemSettingsDefaults ? { ...itemSettingsDefaults } : null,
+				content: itemContent,
+				settings: property.defaultItemSettings ? { ...property.defaultItemSettings } : null,
 				summary: "",
 				position,
 				createdAt: 0,
 				updatedAt: 0
 			});
-			markers.push({ _itemId: itemId });
+			markers.push({ _itemId: id });
 			const nestedContent = {};
-			buildPeekItems(itemProperties, blockId, itemId, nestedContent, allItems, counter);
-			const item = allItems.find((it) => it.id === itemId);
-			item.content = {
+			buildPeekItems(property.items.properties, blockId, id, nestedContent, items, counter);
+			const item = items.find((candidate) => candidate.id === id);
+			if (item) item.content = {
 				...item.content,
 				...nestedContent
 			};
@@ -134,1510 +102,431 @@ function buildPeekItems(properties, blockId, parentItemId, content, allItems, co
 		content[fieldName] = markers;
 	}
 }
-function createBlock(options) {
+function createViewBlock(options) {
 	const typeboxSchema = Type$1.Object(options.content);
-	const contentSchema = {
-		type: "object",
-		title: options.title,
-		description: options.description,
-		properties: typeboxSchema.properties,
-		required: Object.keys(options.content),
-		toMarkdown: resolveToMarkdown(options.toMarkdown, options.settings, "block")
-	};
 	const settingsTypeboxSchema = options.settings ? Type$1.Object(options.settings) : null;
-	const settingsSchema = settingsTypeboxSchema ? {
-		type: "object",
-		properties: settingsTypeboxSchema.properties,
-		required: Object.keys(options.settings)
-	} : void 0;
-	const contentDefaults = {};
-	const contentDefaultsForStorage = {};
-	for (const [key, prop] of Object.entries(typeboxSchema.properties)) if ("default" in prop) {
-		contentDefaults[key] = prop.default;
-		const ft = prop.fieldType;
-		if (ft === "Image" || ft === "File" || ft === "ImageList" || ft === "FileList" || ft === "Repeater") continue;
-		contentDefaultsForStorage[key] = prop.default;
-	}
-	const repeatableItemDefaults = {};
-	const repeatableItemSettingsDefaults = {};
-	for (const [key, prop] of Object.entries(typeboxSchema.properties)) {
-		const p = prop;
-		if (p.type === "array" && p.items?.properties) {
-			const itemDefaults = {};
-			for (const [itemKey, itemProp] of Object.entries(p.items.properties)) if (itemProp && typeof itemProp === "object" && "default" in itemProp) itemDefaults[itemKey] = itemProp.default;
-			if (Object.keys(itemDefaults).length > 0) repeatableItemDefaults[key] = itemDefaults;
-			if (p.defaultItemSettings && typeof p.defaultItemSettings === "object") repeatableItemSettingsDefaults[key] = p.defaultItemSettings;
-		}
-	}
-	const settingsDefaults = {};
-	if (settingsTypeboxSchema) {
-		for (const [key, prop] of Object.entries(settingsTypeboxSchema.properties)) if ("default" in prop) settingsDefaults[key] = prop.default;
+	const contentDefaults = collectDefaults(typeboxSchema.properties);
+	const settingsDefaults = settingsTypeboxSchema ? collectDefaults(settingsTypeboxSchema.properties) : {};
+	const repeatableDefaults = {};
+	const repeatableSettingsDefaults = {};
+	for (const [key, property] of Object.entries(typeboxSchema.properties)) {
+		if (property.fieldType !== "Repeater") continue;
+		repeatableDefaults[key] = collectDefaults(property.items?.properties ?? {});
+		repeatableSettingsDefaults[key] = { ...property.defaultItemSettings };
 	}
 	const Context = React.createContext(null);
-	const RepeaterItemContext = React.createContext(null);
-	const RepeaterHoverContext = React.createContext(false);
-	/**
-	* Build a field ID that matches the sidebar's `getFieldId` format.
-	* Root fields:          blockId__fieldName
-	* Repeater item fields: blockId__itemId__fieldName
-	*/
-	const getOverlayFieldId = (blockId, repeaterContext, fieldName) => {
-		if (repeaterContext?.itemId != null) return `${blockId}__${repeaterContext.itemId}__${fieldName}`;
-		return `${blockId}__${fieldName}`;
-	};
+	const RepeaterContext = React.createContext(null);
+	function useValue(name) {
+		const block = React.use(Context);
+		const item = React.use(RepeaterContext);
+		if (!block) throw new Error("Field must be used within a Block Component");
+		return item ? item.itemContent[name] : block.content[name];
+	}
 	const Field = ({ name, components, children }) => {
-		const blockContext = React.use(Context);
-		if (!blockContext) throw new Error("Field must be used within a Block Component");
-		const { blockId, content, mode } = blockContext;
-		const isContentEditable = useIsEditable(mode);
-		const elementRef = React.useRef(null);
-		const { window: iframeWindow } = useFrame();
+		const editingRuntime = useBlockEditingRuntime();
+		if (editingRuntime) return editingRuntime.renderPrimitive(options, "Field", {
+			name,
+			components,
+			children
+		});
+		const value = useValue(name);
 		const projectSlug = useProjectSlug();
-		const { data: project } = useQuery(projectQueries.getBySlug(projectSlug));
+		const { data: project } = useQuery(viewProjectQueries.getBySlug(projectSlug));
 		const { data: pages } = useQuery({
-			...pageQueries.list(project?.id ?? 0),
+			...viewPageQueries.list(project?.id ?? 0),
 			enabled: !!project
 		});
-		const currentPathname = useLocation({ select: (l) => l.pathname });
-		const repeaterContext = React.use(RepeaterItemContext);
-		const fieldId = getOverlayFieldId(blockId, repeaterContext, String(name));
-		const fieldValue = repeaterContext ? repeaterContext.itemContent[name] : content[name];
-		const [isHovered, setIsHovered] = React.useState(false);
-		const [isEditorFocused, setIsEditorFocused] = React.useState(false);
-		const isSelectedFromSelection = useFieldSelection(blockId, String(name), "String", repeaterContext?.itemId);
-		const isFocused = isEditorFocused || isSelectedFromSelection;
-		const isHoveredFromSidebar = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_FIELD", "CAMOX_HOVER_FIELD_END", { fieldId });
-		React.useEffect(() => {
-			setIsHovered(isHoveredFromSidebar);
-		}, [isHoveredFromSidebar]);
-		const updateBlockContent = useMutation(blockMutations.updateContent());
-		const updateRepeatableContent = useMutation(repeatableItemMutations.updateContent());
-		const handleChange = React.useCallback((newValue) => {
-			if (repeaterContext) {
-				const { itemId } = repeaterContext;
-				if (itemId != null) updateRepeatableContent.mutate({
-					id: itemId,
-					content: { [name]: newValue }
-				});
-			} else updateBlockContent.mutate({
-				id: blockId,
-				content: { [name]: newValue }
-			});
-		}, [
-			blockId,
-			name,
-			repeaterContext,
-			updateBlockContent,
-			updateRepeatableContent
-		]);
-		const handleFocus = React.useCallback(() => {
-			setIsEditorFocused(true);
-			if (repeaterContext?.itemId != null) previewStore.send({
-				type: "selectItemField",
-				blockId,
-				itemId: repeaterContext.itemId,
-				fieldName: name.toString(),
-				fieldType: "String"
-			});
-			else previewStore.send({
-				type: "selectBlockField",
-				blockId,
-				fieldName: name.toString(),
-				fieldType: "String"
-			});
-		}, [
-			blockId,
-			name,
-			repeaterContext?.itemId
-		]);
-		const handleBlur = React.useCallback((wasEdited) => {
-			setIsEditorFocused(false);
-			if (wasEdited) trackClientEvent("block_edited", {
-				via: "inline-lexical",
-				blockType: options.id,
-				field: String(name)
-			});
-		}, [name]);
-		const handleMouseEnter = () => {
-			if (isContentEditable) setIsHovered(true);
-		};
-		const handleMouseLeave = () => {
-			if (isContentEditable) setIsHovered(false);
-		};
-		const fieldData = { text: fieldValue };
-		if (!isContentEditable) return /* @__PURE__ */ jsx(Fragment, { children: children({ children: markdownToReactNodes(fieldValue, {
+		return children({ children: markdownToReactNodes(value, {
 			pages,
-			fallbackHref: currentPathname,
+			fallbackHref: useLocation({ select: (location) => location.pathname }),
 			components
-		}) }, fieldData) });
-		return /* @__PURE__ */ jsx(Fragment, { children: children({
-			ref: elementRef,
-			"data-camox-field-id": fieldId,
-			"data-camox-hovered": isHovered || void 0,
-			"data-camox-focused": isFocused || void 0,
-			"data-camox-overlay-mode": mode === "layout" ? "layout" : void 0,
-			onMouseEnter: handleMouseEnter,
-			onMouseLeave: handleMouseLeave,
-			children: /* @__PURE__ */ jsx(InlineLexicalEditor, {
-				initialState: fieldValue,
-				externalState: fieldValue,
-				onChange: handleChange,
-				onFocus: handleFocus,
-				onBlur: handleBlur
-			})
-		}, fieldData) });
+		}) }, { text: value });
 	};
-	const Embed = (t0) => {
-		const $ = c(59);
-		if ($[0] !== "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407") {
-			for (let $i = 0; $i < 59; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-			$[0] = "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407";
-		}
-		const { name, children } = t0;
-		const blockContext = React.use(Context);
-		if (!blockContext) throw new Error("Embed must be used within a Block Component");
-		const { blockId, content, mode } = blockContext;
-		const isContentEditable = useIsEditable(mode);
-		const { window: iframeWindow } = useFrame();
-		const repeaterContext = React.use(RepeaterItemContext);
-		const fieldValue = repeaterContext ? repeaterContext.itemContent[name] : content[name];
-		const t1 = String(name);
-		let t2;
-		if ($[1] !== blockId || $[2] !== repeaterContext || $[3] !== t1) {
-			t2 = getOverlayFieldId(blockId, repeaterContext, t1);
-			$[1] = blockId;
-			$[2] = repeaterContext;
-			$[3] = t1;
-			$[4] = t2;
-		} else t2 = $[4];
-		const fieldId = t2;
-		const [isOpen, setIsOpen] = React.useState(false);
-		const [urlValue, setUrlValue] = React.useState(fieldValue);
-		const [isHovered, setIsHovered] = React.useState(false);
-		const timerRef = React.useRef(null);
-		let t3;
-		if ($[5] !== fieldId) {
-			t3 = { fieldId };
-			$[5] = fieldId;
-			$[6] = t3;
-		} else t3 = $[6];
-		const isHoveredFromSidebar = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_FIELD", "CAMOX_HOVER_FIELD_END", t3);
-		let t4;
-		let t5;
-		if ($[7] !== isHoveredFromSidebar) {
-			t4 = () => {
-				setIsHovered(isHoveredFromSidebar);
-			};
-			t5 = [isHoveredFromSidebar];
-			$[7] = isHoveredFromSidebar;
-			$[8] = t4;
-			$[9] = t5;
-		} else {
-			t4 = $[8];
-			t5 = $[9];
-		}
-		React.useEffect(t4, t5);
-		let t6;
-		if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
-			t6 = blockMutations.updateContent();
-			$[10] = t6;
-		} else t6 = $[10];
-		const updateBlockContent = useMutation(t6);
-		let t7;
-		if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
-			t7 = repeatableItemMutations.updateContent();
-			$[11] = t7;
-		} else t7 = $[11];
-		const updateRepeatableContent = useMutation(t7);
-		let t8;
-		let t9;
-		if ($[12] !== fieldValue || $[13] !== isOpen) {
-			t8 = () => {
-				if (!isOpen) setUrlValue(fieldValue);
-			};
-			t9 = [fieldValue, isOpen];
-			$[12] = fieldValue;
-			$[13] = isOpen;
-			$[14] = t8;
-			$[15] = t9;
-		} else {
-			t8 = $[14];
-			t9 = $[15];
-		}
-		React.useEffect(t8, t9);
-		let t10;
-		let t11;
-		if ($[16] === Symbol.for("react.memo_cache_sentinel")) {
-			t10 = () => () => {
-				if (timerRef.current) clearTimeout(timerRef.current);
-			};
-			t11 = [];
-			$[16] = t10;
-			$[17] = t11;
-		} else {
-			t10 = $[16];
-			t11 = $[17];
-		}
-		React.useEffect(t10, t11);
-		let t12;
-		if ($[18] !== blockId || $[19] !== name || $[20] !== repeaterContext || $[21] !== updateBlockContent || $[22] !== updateRepeatableContent) {
-			t12 = (e) => {
-				const newValue = e.target.value;
-				setUrlValue(newValue);
-				if (timerRef.current) clearTimeout(timerRef.current);
-				timerRef.current = window.setTimeout(() => {
-					if (repeaterContext?.itemId != null) updateRepeatableContent.mutate({
-						id: repeaterContext.itemId,
-						content: { [name]: newValue }
-					});
-					else updateBlockContent.mutate({
-						id: blockId,
-						content: { [name]: newValue }
-					});
-				}, 500);
-			};
-			$[18] = blockId;
-			$[19] = name;
-			$[20] = repeaterContext;
-			$[21] = updateBlockContent;
-			$[22] = updateRepeatableContent;
-			$[23] = t12;
-		} else t12 = $[23];
-		const handleUrlChange = t12;
-		let t13;
-		if ($[24] !== blockId || $[25] !== name || $[26] !== repeaterContext) {
-			t13 = (open, _eventDetails) => {
-				setIsOpen(open);
-				if (open) if (repeaterContext?.itemId != null) previewStore.send({
-					type: "selectItemField",
-					blockId,
-					itemId: repeaterContext.itemId,
-					fieldName: name.toString(),
-					fieldType: "Embed"
-				});
-				else previewStore.send({
-					type: "selectBlockField",
-					blockId,
-					fieldName: name.toString(),
-					fieldType: "Embed"
-				});
-			};
-			$[24] = blockId;
-			$[25] = name;
-			$[26] = repeaterContext;
-			$[27] = t13;
-		} else t13 = $[27];
-		const handleOpenChange = t13;
-		const t14 = isContentEditable ? isOpen : false;
-		const t15 = isContentEditable ? handleOpenChange : void 0;
-		const t16 = isContentEditable ? fieldId : void 0;
-		const t17 = isContentEditable ? "embed" : void 0;
-		const t18 = isContentEditable && isHovered || void 0;
-		const t19 = isContentEditable && isOpen || void 0;
-		const t20 = mode === "layout" ? "layout" : void 0;
-		let t21;
-		if ($[28] !== isContentEditable) {
-			t21 = isContentEditable ? () => setIsHovered(true) : void 0;
-			$[28] = isContentEditable;
-			$[29] = t21;
-		} else t21 = $[29];
-		let t22;
-		if ($[30] !== isContentEditable) {
-			t22 = isContentEditable ? () => setIsHovered(false) : void 0;
-			$[30] = isContentEditable;
-			$[31] = t22;
-		} else t22 = $[31];
-		let t23;
-		if ($[32] !== t16 || $[33] !== t17 || $[34] !== t18 || $[35] !== t19 || $[36] !== t20 || $[37] !== t21 || $[38] !== t22) {
-			t23 = /* @__PURE__ */ jsx("div", {
-				"data-camox-field-id": t16,
-				"data-camox-field-type": t17,
-				"data-camox-hovered": t18,
-				"data-camox-focused": t19,
-				"data-camox-overlay-mode": t20,
-				onMouseEnter: t21,
-				onMouseLeave: t22
-			});
-			$[32] = t16;
-			$[33] = t17;
-			$[34] = t18;
-			$[35] = t19;
-			$[36] = t20;
-			$[37] = t21;
-			$[38] = t22;
-			$[39] = t23;
-		} else t23 = $[39];
-		let t24;
-		if ($[40] !== children || $[41] !== fieldValue) {
-			t24 = children({ src: fieldValue }, { url: fieldValue });
-			$[40] = children;
-			$[41] = fieldValue;
-			$[42] = t24;
-		} else t24 = $[42];
-		let t25;
-		if ($[43] !== isContentEditable) {
-			t25 = isContentEditable && /* @__PURE__ */ jsx("div", { style: {
-				position: "absolute",
-				inset: 0,
-				zIndex: 10
-			} });
-			$[43] = isContentEditable;
-			$[44] = t25;
-		} else t25 = $[44];
-		let t26;
-		if ($[45] !== t23 || $[46] !== t24 || $[47] !== t25) {
-			t26 = /* @__PURE__ */ jsxs(PopoverTrigger, {
-				render: t23,
-				nativeButton: false,
-				children: [t24, t25]
-			});
-			$[45] = t23;
-			$[46] = t24;
-			$[47] = t25;
-			$[48] = t26;
-		} else t26 = $[48];
-		let t27;
-		if ($[49] !== handleUrlChange || $[50] !== isContentEditable || $[51] !== name || $[52] !== urlValue) {
-			t27 = isContentEditable && /* @__PURE__ */ jsx(PopoverContent, {
-				className: "w-96 gap-2",
-				children: /* @__PURE__ */ jsxs("form", {
-					className: "grid gap-2",
-					children: [/* @__PURE__ */ jsx(Label, {
-						htmlFor: "url",
-						children: options.content[name]?.title ?? String(name)
-					}), /* @__PURE__ */ jsx(Input, {
-						type: "url",
-						id: "url",
-						value: urlValue,
-						onChange: handleUrlChange
-					})]
-				})
-			});
-			$[49] = handleUrlChange;
-			$[50] = isContentEditable;
-			$[51] = name;
-			$[52] = urlValue;
-			$[53] = t27;
-		} else t27 = $[53];
-		let t28;
-		if ($[54] !== t14 || $[55] !== t15 || $[56] !== t26 || $[57] !== t27) {
-			t28 = /* @__PURE__ */ jsxs(Popover, {
-				open: t14,
-				onOpenChange: t15,
-				children: [t26, t27]
-			});
-			$[54] = t14;
-			$[55] = t15;
-			$[56] = t26;
-			$[57] = t27;
-			$[58] = t28;
-		} else t28 = $[58];
-		return t28;
+	const Embed = ({ name, children }) => {
+		const editingRuntime = useBlockEditingRuntime();
+		if (editingRuntime) return editingRuntime.renderPrimitive(options, "Embed", {
+			name,
+			children
+		});
+		const rawValue = useValue(name);
+		const value = typeof rawValue === "string" ? rawValue : "";
+		return children({ src: value }, { url: value });
 	};
-	const Link = (t0) => {
-		const $ = c(38);
-		if ($[0] !== "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407") {
-			for (let $i = 0; $i < 38; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-			$[0] = "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407";
-		}
-		const { name, children } = t0;
-		const blockContext = React.use(Context);
-		if (!blockContext) throw new Error("Link must be used within a Block Component");
-		const { blockId, content, mode } = blockContext;
-		const isContentEditable = useIsEditable(mode);
-		const elementRef = React.useRef(null);
-		const { window: iframeWindow } = useFrame();
-		const repeaterContext = React.use(RepeaterItemContext);
-		const fieldValue = normalizeLinkValue(repeaterContext ? repeaterContext.itemContent[name] : content[name]);
-		let t1;
-		if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
-			t1 = blockMutations.updateContent();
-			$[1] = t1;
-		} else t1 = $[1];
-		const updateBlockContent = useMutation(t1);
-		let t2;
-		if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
-			t2 = repeatableItemMutations.updateContent();
-			$[2] = t2;
-		} else t2 = $[2];
-		const updateRepeatableContent = useMutation(t2);
+	const Link = ({ name, children }) => {
+		const editingRuntime = useBlockEditingRuntime();
+		if (editingRuntime) return editingRuntime.renderPrimitive(options, "Link", {
+			name,
+			children
+		});
+		const value = normalizeLinkValue(useValue(name) ?? {});
 		const projectSlug = useProjectSlug();
-		let t3;
-		if ($[3] !== projectSlug) {
-			t3 = projectQueries.getBySlug(projectSlug);
-			$[3] = projectSlug;
-			$[4] = t3;
-		} else t3 = $[4];
-		const { data: project } = useQuery(t3);
-		let t4;
-		if ($[5] !== project?.id) {
-			t4 = pageQueries.list(project?.id ?? 0);
-			$[5] = project?.id;
-			$[6] = t4;
-		} else t4 = $[6];
-		const t5 = !!project;
-		let t6;
-		if ($[7] !== t4 || $[8] !== t5) {
-			t6 = {
-				...t4,
-				enabled: t5
-			};
-			$[7] = t4;
-			$[8] = t5;
-			$[9] = t6;
-		} else t6 = $[9];
-		const { data: pages } = useQuery(t6);
-		let t7;
-		if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
-			t7 = { select: _temp };
-			$[10] = t7;
-		} else t7 = $[10];
-		const resolvedHref = resolveLinkHref(fieldValue, pages, useLocation(t7));
-		const fieldId = getOverlayFieldId(blockId, repeaterContext, String(name));
-		const [isEditing, setIsEditing] = React.useState(false);
-		const [displayText, setDisplayText] = React.useState(fieldValue.text);
-		const [isHovered, setIsHovered] = React.useState(false);
-		const [isEditorFocused, setIsEditorFocused] = React.useState(false);
-		const isSelectedFromSelection = useFieldSelection(blockId, String(name), "Link", repeaterContext?.itemId);
-		const isFocused = isEditorFocused || isSelectedFromSelection;
-		React.useEffect(() => {
-			if (!isEditing) setDisplayText(fieldValue.text);
-		}, [fieldValue.text, isEditing]);
-		const isHoveredFromSidebar = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_FIELD", "CAMOX_HOVER_FIELD_END", { fieldId });
-		let t8;
-		let t9;
-		if ($[11] !== isHoveredFromSidebar) {
-			t8 = () => {
-				setIsHovered(isHoveredFromSidebar);
-			};
-			t9 = [isHoveredFromSidebar];
-			$[11] = isHoveredFromSidebar;
-			$[12] = t8;
-			$[13] = t9;
-		} else {
-			t8 = $[12];
-			t9 = $[13];
-		}
-		React.useEffect(t8, t9);
-		let t10;
-		if ($[14] !== blockId || $[15] !== name || $[16] !== repeaterContext || $[17] !== updateBlockContent || $[18] !== updateRepeatableContent) {
-			t10 = (newLinkValue) => {
-				if (repeaterContext?.itemId != null) updateRepeatableContent.mutate({
-					id: repeaterContext.itemId,
-					content: { [name]: newLinkValue }
-				});
-				else updateBlockContent.mutate({
-					id: blockId,
-					content: { [name]: newLinkValue }
-				});
-			};
-			$[14] = blockId;
-			$[15] = name;
-			$[16] = repeaterContext;
-			$[17] = updateBlockContent;
-			$[18] = updateRepeatableContent;
-			$[19] = t10;
-		} else t10 = $[19];
-		const saveLinkValue = t10;
-		const handleInput = (e) => {
-			const newText = e.target.textContent || "";
-			saveLinkValue({
-				...fieldValue,
-				text: newText
-			});
-		};
-		let t11;
-		if ($[20] !== blockId || $[21] !== name || $[22] !== repeaterContext) {
-			t11 = () => {
-				setIsEditing(true);
-				setIsEditorFocused(true);
-				if (repeaterContext?.itemId != null) previewStore.send({
-					type: "selectItemField",
-					blockId,
-					itemId: repeaterContext.itemId,
-					fieldName: String(name),
-					fieldType: "Link"
-				});
-				else previewStore.send({
-					type: "selectBlockField",
-					blockId,
-					fieldName: String(name),
-					fieldType: "Link"
-				});
-			};
-			$[20] = blockId;
-			$[21] = name;
-			$[22] = repeaterContext;
-			$[23] = t11;
-		} else t11 = $[23];
-		const handleFocus = t11;
-		let t12;
-		if ($[24] === Symbol.for("react.memo_cache_sentinel")) {
-			t12 = () => {
-				setIsEditing(false);
-				setIsEditorFocused(false);
-			};
-			$[24] = t12;
-		} else t12 = $[24];
-		const handleBlur = t12;
-		let t13;
-		if ($[25] === Symbol.for("react.memo_cache_sentinel")) {
-			t13 = (e_0) => {
-				e_0.stopPropagation();
-				previewStore.send({ type: "toggleContentSheet" });
-				setIsEditorFocused(false);
-				setIsEditing(false);
-			};
-			$[25] = t13;
-		} else t13 = $[25];
-		const handleEditLink = t13;
-		const linkData = {
-			text: displayText,
-			href: resolvedHref,
-			newTab: fieldValue.newTab
-		};
-		if (!isContentEditable) return /* @__PURE__ */ jsx(Fragment, { children: children({
-			to: resolvedHref,
-			target: fieldValue.newTab ? "_blank" : void 0,
-			rel: fieldValue.newTab ? "noreferrer" : void 0,
-			children: fieldValue.text
-		}, linkData) });
-		let t14;
-		let t15;
-		if ($[26] === Symbol.for("react.memo_cache_sentinel")) {
-			t14 = () => setIsHovered(true);
-			t15 = () => setIsHovered(false);
-			$[26] = t14;
-			$[27] = t15;
-		} else {
-			t14 = $[26];
-			t15 = $[27];
-		}
-		const linkProps = {
-			ref: elementRef,
-			to: resolvedHref,
-			target: fieldValue.newTab ? "_blank" : void 0,
-			rel: fieldValue.newTab ? "noreferrer" : void 0,
-			children: displayText,
-			"data-camox-field-id": fieldId,
-			"data-camox-hovered": isHovered || void 0,
-			"data-camox-focused": isFocused || void 0,
-			"data-camox-overlay-mode": mode === "layout" ? "layout" : void 0,
-			contentEditable: true,
-			onClick: _temp2,
-			onInput: handleInput,
-			onFocus: handleFocus,
-			onBlur: handleBlur,
-			onMouseEnter: t14,
-			onMouseLeave: t15,
-			onKeyDown: _temp3,
-			spellCheck: false,
-			suppressContentEditableWarning: true
-		};
-		const T0 = Popover;
-		const t16 = children(linkProps, linkData);
-		let t17;
-		if ($[28] !== handleEditLink) {
-			t17 = /* @__PURE__ */ jsx("button", {
-				type: "button",
-				className: "hover:bg-accent flex items-center gap-1.5 rounded-md px-2 py-1 text-sm transition-colors",
-				onMouseDown: _temp4,
-				onClick: handleEditLink,
-				children: "Edit link"
-			});
-			$[28] = handleEditLink;
-			$[29] = t17;
-		} else t17 = $[29];
-		let t18;
-		if ($[30] !== elementRef || $[31] !== t17) {
-			t18 = /* @__PURE__ */ jsx(PopoverContent, {
-				className: "w-auto p-2",
-				initialFocus: false,
-				anchor: elementRef,
-				align: "end",
-				children: t17
-			});
-			$[30] = elementRef;
-			$[31] = t17;
-			$[32] = t18;
-		} else t18 = $[32];
-		let t19;
-		if ($[33] !== T0 || $[34] !== isEditorFocused || $[35] !== t16 || $[36] !== t18) {
-			t19 = /* @__PURE__ */ jsxs(T0, {
-				open: isEditorFocused,
-				children: [t16, t18]
-			});
-			$[33] = T0;
-			$[34] = isEditorFocused;
-			$[35] = t16;
-			$[36] = t18;
-			$[37] = t19;
-		} else t19 = $[37];
-		return t19;
+		const { data: project } = useQuery(viewProjectQueries.getBySlug(projectSlug));
+		const { data: pages } = useQuery({
+			...viewPageQueries.list(project?.id ?? 0),
+			enabled: !!project
+		});
+		const href = resolveLinkHref(value, pages, useLocation({ select: (location) => location.pathname }));
+		return children({
+			to: href,
+			target: value.newTab ? "_blank" : void 0,
+			rel: value.newTab ? "noreferrer" : void 0,
+			children: value.text
+		}, {
+			text: value.text,
+			href,
+			newTab: value.newTab
+		});
 	};
-	const Image = (t0) => {
-		const $ = c(22);
-		if ($[0] !== "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407") {
-			for (let $i = 0; $i < 22; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-			$[0] = "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407";
+	function useAsset(name) {
+		const $ = c(4);
+		if ($[0] !== "04a637ebd823abadf975e738c0e326acccffcffd1f7360db558a19fce0075982") {
+			for (let $i = 0; $i < 4; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+			$[0] = "04a637ebd823abadf975e738c0e326acccffcffd1f7360db558a19fce0075982";
 		}
-		const { name, children } = t0;
-		const blockContext = React.use(Context);
-		if (!blockContext) throw new Error("Image must be used within a Block Component");
-		const { blockId, content, mode } = blockContext;
-		const isContentEditable = useIsEditable(mode);
-		const { window: iframeWindow } = useFrame();
-		const repeaterContext = React.use(RepeaterItemContext);
+		const block = React.use(Context);
+		const item = React.use(RepeaterContext);
 		const { filesMap } = useNormalizedData();
-		const rawSource = repeaterContext ? repeaterContext.itemContent[name] : content[name];
-		const rawValue = isFileMarker(rawSource) ? resolveFileMarker(rawSource, filesMap) : rawSource;
-		const defaultValue = repeaterContext ? repeatableItemDefaults[repeaterContext.arrayFieldName]?.[String(name)] : contentDefaults[String(name)];
-		const fieldValue = rawValue ?? defaultValue;
-		const isInlineArrayItem = repeaterContext != null && repeaterContext.itemId == null;
-		const overlayFieldName = isInlineArrayItem ? repeaterContext.arrayFieldName : String(name);
-		const overlayItemId = isInlineArrayItem ? repeaterContext.containerItemId : repeaterContext?.itemId;
-		const fieldId = overlayItemId != null ? `${blockId}__${overlayItemId}__${overlayFieldName}` : `${blockId}__${overlayFieldName}`;
-		const [isHovered, setIsHovered] = React.useState(false);
-		const isFocused = useFieldSelection(blockId, overlayFieldName, "Image", overlayItemId);
-		let t1;
-		if ($[1] !== fieldId) {
-			t1 = { fieldId };
-			$[1] = fieldId;
-			$[2] = t1;
-		} else t1 = $[2];
-		const isHoveredFromSidebar = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_FIELD", "CAMOX_HOVER_FIELD_END", t1);
-		let t2;
-		let t3;
-		if ($[3] !== isHoveredFromSidebar) {
-			t2 = () => {
-				setIsHovered(isHoveredFromSidebar);
-			};
-			t3 = [isHoveredFromSidebar];
-			$[3] = isHoveredFromSidebar;
-			$[4] = t2;
-			$[5] = t3;
-		} else {
-			t2 = $[4];
-			t3 = $[5];
-		}
-		React.useEffect(t2, t3);
-		let t4;
-		if ($[6] !== blockId || $[7] !== isContentEditable || $[8] !== overlayFieldName || $[9] !== overlayItemId) {
-			t4 = () => {
-				if (!isContentEditable) return;
-				if (overlayItemId != null) previewStore.send({
-					type: "selectItemField",
-					blockId,
-					itemId: overlayItemId,
-					fieldName: overlayFieldName,
-					fieldType: "Image"
-				});
-				else previewStore.send({
-					type: "selectBlockField",
-					blockId,
-					fieldName: overlayFieldName,
-					fieldType: "Image"
-				});
-				previewStore.send({ type: "toggleContentSheet" });
-			};
-			$[6] = blockId;
-			$[7] = isContentEditable;
-			$[8] = overlayFieldName;
-			$[9] = overlayItemId;
-			$[10] = t4;
-		} else t4 = $[10];
-		const handleClick = t4;
-		const imageProps = {
-			src: transformImageUrl(fieldValue.url, {
+		if (!block) throw new Error("Asset must be used within a Block Component");
+		const raw = item ? item.itemContent[name] : block.content[name];
+		let t0;
+		if ($[1] !== filesMap || $[2] !== raw) {
+			t0 = isFileMarker(raw) ? resolveFileMarker(raw, filesMap) : raw;
+			$[1] = filesMap;
+			$[2] = raw;
+			$[3] = t0;
+		} else t0 = $[3];
+		const resolved = t0;
+		const fallback = item ? repeatableDefaults[item.arrayFieldName]?.[String(name)] : contentDefaults[String(name)];
+		return resolved ?? fallback;
+	}
+	const Image = ({ name, children }) => {
+		const editingRuntime = useBlockEditingRuntime();
+		if (editingRuntime) return editingRuntime.renderPrimitive(options, "Image", {
+			name,
+			children
+		});
+		const value = useAsset(name);
+		return children({
+			src: transformImageUrl(value.url, {
 				width: getDefaultImageWidth(),
-				mimeType: fieldValue.mimeType,
-				size: fieldValue.size
+				mimeType: value.mimeType,
+				size: value.size
 			}),
-			srcSet: buildImageSrcSet(fieldValue.url, fieldValue.mimeType, fieldValue.size),
+			srcSet: buildImageSrcSet(value.url, value.mimeType, value.size),
 			sizes: getDefaultImageSizes(),
-			alt: fieldValue.alt
-		};
-		if (!isContentEditable) return /* @__PURE__ */ jsx(Fragment, { children: children(imageProps, fieldValue) });
-		const t5 = "image";
-		const t6 = isHovered || void 0;
-		const t7 = isFocused || void 0;
-		const t8 = mode === "layout" ? "layout" : void 0;
-		let t10;
-		let t9;
-		if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
-			t9 = () => setIsHovered(true);
-			t10 = () => setIsHovered(false);
-			$[11] = t10;
-			$[12] = t9;
-		} else {
-			t10 = $[11];
-			t9 = $[12];
+			alt: value.alt
+		}, value);
+	};
+	const File = ({ name, children }) => {
+		const editingRuntime = useBlockEditingRuntime();
+		if (editingRuntime) return editingRuntime.renderPrimitive(options, "File", {
+			name,
+			children
+		});
+		const value = useAsset(name);
+		return children({
+			href: value.url,
+			download: value.filename
+		}, value);
+	};
+	const AssetList = ({ name, children, primitive }) => {
+		const editingRuntime = useBlockEditingRuntime();
+		if (editingRuntime) return editingRuntime.renderPrimitive(options, primitive, {
+			name,
+			children
+		});
+		const block = React.use(Context);
+		const parent = React.use(RepeaterContext);
+		const { filesMap } = useNormalizedData();
+		if (!block) throw new Error("ImageList/FileList must be used within a Block Component");
+		const fieldName = String(name);
+		const schema = parent ? typeboxSchema.properties[parent.arrayFieldName]?.items?.properties?.[fieldName] : typeboxSchema.properties[fieldName];
+		const fieldType = schema?.fieldType;
+		if (fieldType !== "ImageList" && fieldType !== "FileList") throw new Error(`"${fieldName}" is not a Type.ImageList or Type.FileList field`);
+		const source = parent ? parent.itemContent[fieldName] : block.content[fieldName];
+		let values = Array.isArray(source) ? source : [];
+		if (values.length === 0 && schema.defaultItems > 0 && schema.items?.default) values = Array.from({ length: schema.defaultItems }, () => schema.items.default);
+		const Single = fieldType === "ImageList" ? Image : File;
+		return values.map((value) => isFileMarker(value) ? resolveFileMarker(value, filesMap) : value).filter(Boolean).map((value_0, index) => /* @__PURE__ */ jsx(RepeaterContext.Provider, {
+			value: {
+				arrayFieldName: fieldName,
+				containerItemId: parent?.itemId ?? parent?.containerItemId,
+				itemContent: { [ASSET_LIST_SELF_KEY]: value_0 },
+				itemSettings: {}
+			},
+			children: /* @__PURE__ */ jsx(Single, {
+				name: ASSET_LIST_SELF_KEY,
+				children
+			})
+		}, index));
+	};
+	const ImageList = (props) => {
+		const $ = c(3);
+		if ($[0] !== "04a637ebd823abadf975e738c0e326acccffcffd1f7360db558a19fce0075982") {
+			for (let $i = 0; $i < 3; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+			$[0] = "04a637ebd823abadf975e738c0e326acccffcffd1f7360db558a19fce0075982";
 		}
-		const t11 = children(imageProps, fieldValue);
-		let t12;
-		if ($[13] !== fieldId || $[14] !== handleClick || $[15] !== t10 || $[16] !== t11 || $[17] !== t6 || $[18] !== t7 || $[19] !== t8 || $[20] !== t9) {
-			t12 = /* @__PURE__ */ jsx("div", {
-				"data-camox-field-id": fieldId,
-				"data-camox-field-type": t5,
-				"data-camox-hovered": t6,
-				"data-camox-focused": t7,
-				"data-camox-overlay-mode": t8,
-				onMouseEnter: t9,
-				onMouseLeave: t10,
-				onClick: handleClick,
-				children: t11
+		let t0;
+		if ($[1] !== props) {
+			t0 = /* @__PURE__ */ jsx(AssetList, {
+				...props,
+				primitive: "ImageList"
 			});
-			$[13] = fieldId;
-			$[14] = handleClick;
-			$[15] = t10;
-			$[16] = t11;
-			$[17] = t6;
-			$[18] = t7;
-			$[19] = t8;
-			$[20] = t9;
-			$[21] = t12;
-		} else t12 = $[21];
-		return t12;
+			$[1] = props;
+			$[2] = t0;
+		} else t0 = $[2];
+		return t0;
 	};
-	const File = (t0) => {
-		const $ = c(9);
-		if ($[0] !== "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407") {
-			for (let $i = 0; $i < 9; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-			$[0] = "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407";
+	const FileList = (props) => {
+		const $ = c(3);
+		if ($[0] !== "04a637ebd823abadf975e738c0e326acccffcffd1f7360db558a19fce0075982") {
+			for (let $i = 0; $i < 3; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+			$[0] = "04a637ebd823abadf975e738c0e326acccffcffd1f7360db558a19fce0075982";
 		}
-		const { name, children } = t0;
-		const blockContext = React.use(Context);
-		if (!blockContext) throw new Error("File must be used within a Block Component");
-		const { content } = blockContext;
-		const repeaterContext = React.use(RepeaterItemContext);
-		const { filesMap } = useNormalizedData();
-		const rawSource = repeaterContext ? repeaterContext.itemContent[name] : content[name];
-		let t1;
-		if ($[1] !== children || $[2] !== filesMap || $[3] !== name || $[4] !== rawSource || $[5] !== repeaterContext) {
-			const rawValue = isFileMarker(rawSource) ? resolveFileMarker(rawSource, filesMap) : rawSource;
-			const defaultValue = repeaterContext ? repeatableItemDefaults[repeaterContext.arrayFieldName]?.[String(name)] : contentDefaults[String(name)];
-			const fieldValue = rawValue ?? defaultValue;
-			t1 = children({
-				href: fieldValue.url,
-				download: fieldValue.filename
-			}, fieldValue);
-			$[1] = children;
-			$[2] = filesMap;
-			$[3] = name;
-			$[4] = rawSource;
-			$[5] = repeaterContext;
-			$[6] = t1;
-		} else t1 = $[6];
-		let t2;
-		if ($[7] !== t1) {
-			t2 = /* @__PURE__ */ jsx(Fragment, { children: t1 });
-			$[7] = t1;
-			$[8] = t2;
-		} else t2 = $[8];
-		return t2;
+		let t0;
+		if ($[1] !== props) {
+			t0 = /* @__PURE__ */ jsx(AssetList, {
+				...props,
+				primitive: "FileList"
+			});
+			$[1] = props;
+			$[2] = t0;
+		} else t0 = $[2];
+		return t0;
 	};
-	const ASSET_LIST_SELF_KEY = "__camox_asset_self__";
-	const _AssetList = ({ name, children }) => {
-		const blockContext = React.use(Context);
-		if (!blockContext) throw new Error("ImageList/FileList must be used within a Block Component");
-		const parentRepeaterContext = React.use(RepeaterItemContext);
-		const { filesMap } = useNormalizedData();
+	const Repeater = ({ name, children }) => {
+		const editingRuntime = useBlockEditingRuntime();
+		if (editingRuntime) return editingRuntime.renderPrimitive(options, "Repeater", {
+			name,
+			children
+		});
+		const block = React.use(Context);
+		const parent = React.use(RepeaterContext);
+		const { itemsMap } = useNormalizedData();
+		if (!block) throw new Error("Repeater must be used within a Block Component");
 		const fieldName = String(name);
-		const fieldSchema = parentRepeaterContext ? typeboxSchema.properties[parentRepeaterContext.arrayFieldName]?.items?.properties?.[fieldName] : typeboxSchema.properties[fieldName];
-		const ft = fieldSchema?.fieldType;
-		if (ft !== "ImageList" && ft !== "FileList") throw new Error(`"${fieldName}" is not a Type.ImageList or Type.FileList field`);
-		const source = parentRepeaterContext ? parentRepeaterContext.itemContent[fieldName] : blockContext.content[fieldName];
-		let arr = Array.isArray(source) ? source : [];
-		if (arr.length === 0) {
-			const defaultCount = fieldSchema.defaultItems ?? 0;
-			const itemDefault = fieldSchema.items?.default;
-			if (defaultCount > 0 && itemDefault) arr = Array.from({ length: defaultCount }, () => itemDefault);
-		}
-		const resolved = arr.map((v) => isFileMarker(v) ? resolveFileMarker(v, filesMap) : v).filter((v) => v != null && typeof v === "object" && "url" in v);
-		const Single = ft === "ImageList" ? Image : File;
-		return /* @__PURE__ */ jsx(RepeaterHoverProvider, {
-			blockId: blockContext.blockId,
-			fieldName,
-			children: resolved.map((value, index) => /* @__PURE__ */ jsx(RepeaterItemContext.Provider, {
+		const source = parent ? parent.itemContent[fieldName] : block.content[fieldName];
+		if (!Array.isArray(source)) throw new Error(`Field "${fieldName}" is not an array`);
+		return source.map((item) => isItemMarker(item) ? itemsMap.get(item._itemId) ?? null : item).filter(Boolean).map((item_0, index) => {
+			const databaseItem = item_0.content !== void 0 && item_0.id != null;
+			const itemContent = {
+				...repeatableDefaults[fieldName],
+				...databaseItem ? item_0.content : item_0
+			};
+			const itemSettings = {
+				...repeatableSettingsDefaults[fieldName],
+				...databaseItem ? item_0.settings : null
+			};
+			const itemId = databaseItem ? item_0.id : void 0;
+			const api = {
+				Field,
+				Link,
+				Embed,
+				Image,
+				File,
+				ImageList,
+				FileList,
+				Repeater,
+				useSetting: (settingName) => itemSettings[settingName]
+			};
+			return /* @__PURE__ */ jsx(RepeaterContext.Provider, {
 				value: {
 					arrayFieldName: fieldName,
-					itemIndex: index,
-					itemContent: { [ASSET_LIST_SELF_KEY]: value },
-					itemSettings: {},
-					itemId: void 0,
-					containerItemId: parentRepeaterContext?.itemId ?? parentRepeaterContext?.containerItemId
+					containerItemId: itemId ?? parent?.containerItemId,
+					itemContent,
+					itemId,
+					itemSettings
 				},
-				children: /* @__PURE__ */ jsx(Single, {
-					name: ASSET_LIST_SELF_KEY,
-					children
-				})
-			}, index))
+				children: children(api, index)
+			}, itemId ?? index);
 		});
 	};
-	const ImageList = _AssetList;
-	const FileList = _AssetList;
-	const RepeaterItemWrapper = (t0) => {
-		const $ = c(9);
-		if ($[0] !== "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407") {
-			for (let $i = 0; $i < 9; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-			$[0] = "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407";
+	const useSetting = (name) => {
+		const $ = c(4);
+		if ($[0] !== "04a637ebd823abadf975e738c0e326acccffcffd1f7360db558a19fce0075982") {
+			for (let $i = 0; $i < 4; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+			$[0] = "04a637ebd823abadf975e738c0e326acccffcffd1f7360db558a19fce0075982";
 		}
-		const { itemId, blockId, mode, children } = t0;
-		const isContentEditable = useIsEditable(mode);
-		const { window: iframeWindow } = useFrame();
-		const isRepeaterHovered = React.useContext(RepeaterHoverContext);
-		const t1 = String(blockId);
-		const t2 = String(itemId);
-		let t3;
-		if ($[1] !== t1 || $[2] !== t2) {
-			t3 = {
-				blockId: t1,
-				itemId: t2
-			};
-			$[1] = t1;
-			$[2] = t2;
-			$[3] = t3;
-		} else t3 = $[3];
-		const isHovered = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_REPEATER_ITEM", "CAMOX_HOVER_REPEATER_ITEM_END", t3);
-		const showOverlay = isContentEditable && (isHovered || isRepeaterHovered);
-		const t4 = isContentEditable ? itemId : void 0;
-		const t5 = showOverlay || void 0;
-		const t6 = mode === "layout" ? "layout" : void 0;
-		let t7;
-		if ($[4] !== children || $[5] !== t4 || $[6] !== t5 || $[7] !== t6) {
-			t7 = /* @__PURE__ */ jsx("div", {
-				"data-camox-repeater-item-id": t4,
-				"data-camox-hovered": t5,
-				"data-camox-overlay-mode": t6,
-				children
-			});
-			$[4] = children;
-			$[5] = t4;
-			$[6] = t5;
-			$[7] = t6;
-			$[8] = t7;
-		} else t7 = $[8];
-		return t7;
-	};
-	const RepeaterHoverProvider = (t0) => {
-		const $ = c(7);
-		if ($[0] !== "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407") {
-			for (let $i = 0; $i < 7; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-			$[0] = "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407";
+		const editingRuntime = useBlockEditingRuntime();
+		if (editingRuntime) {
+			let t0;
+			if ($[1] !== editingRuntime || $[2] !== name) {
+				t0 = editingRuntime.getSetting(options, name);
+				$[1] = editingRuntime;
+				$[2] = name;
+				$[3] = t0;
+			} else t0 = $[3];
+			return t0;
 		}
-		const { blockId, fieldName, children } = t0;
-		const isContentEditable = useIsEditable("site");
-		const { window: iframeWindow } = useFrame();
-		const t1 = String(blockId);
-		let t2;
-		if ($[1] !== fieldName || $[2] !== t1) {
-			t2 = {
-				blockId: t1,
-				fieldName
-			};
-			$[1] = fieldName;
-			$[2] = t1;
-			$[3] = t2;
-		} else t2 = $[3];
-		const isHovered = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_REPEATER", "CAMOX_HOVER_REPEATER_END", t2);
-		let t3;
-		if ($[4] !== children || $[5] !== isHovered) {
-			t3 = /* @__PURE__ */ jsx(RepeaterHoverContext.Provider, {
-				value: isHovered,
-				children
-			});
-			$[4] = children;
-			$[5] = isHovered;
-			$[6] = t3;
-		} else t3 = $[6];
-		return t3;
+		const context = React.use(Context);
+		if (!context) throw new Error("useSetting must be used within a Block Component");
+		return context.settings[name];
 	};
-	const Repeater = (t0) => {
-		const $ = c(27);
-		if ($[0] !== "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407") {
-			for (let $i = 0; $i < 27; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-			$[0] = "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407";
+	const Detached = (t0) => {
+		const $ = c(6);
+		if ($[0] !== "04a637ebd823abadf975e738c0e326acccffcffd1f7360db558a19fce0075982") {
+			for (let $i = 0; $i < 6; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+			$[0] = "04a637ebd823abadf975e738c0e326acccffcffd1f7360db558a19fce0075982";
 		}
-		const { name, children } = t0;
-		const blockContext = React.use(Context);
-		if (!blockContext) throw new Error("Repeater must be used within a Block Component");
-		const { blockId, content, mode } = blockContext;
-		const parentRepeaterContext = React.use(RepeaterItemContext);
-		const fieldName = String(name);
-		const ItemField = Field;
-		const ItemLink = Link;
-		const ItemEmbed = Embed;
-		const ItemImage = Image;
-		const ItemImageList = _AssetList;
-		const ItemFileList = _AssetList;
-		const ItemFile = File;
-		const ItemRepeater = Repeater;
-		const source = parentRepeaterContext ? parentRepeaterContext.itemContent[name] : content[name];
-		const { itemsMap } = useNormalizedData();
-		let T0;
-		let t1;
-		let t2;
-		let t3;
-		if ($[1] !== blockId || $[2] !== children || $[3] !== fieldName || $[4] !== itemsMap || $[5] !== mode || $[6] !== name || $[7] !== parentRepeaterContext?.containerItemId || $[8] !== source) {
-			let arrayValue = source ?? [];
-			if (!Array.isArray(arrayValue)) throw new Error(`Field "${String(name)}" is not an array`);
-			let t4;
-			if ($[13] !== itemsMap) {
-				t4 = (item) => {
-					if (isItemMarker(item)) return itemsMap.get(item._itemId) ?? null;
-					return item;
-				};
-				$[13] = itemsMap;
-				$[14] = t4;
-			} else t4 = $[14];
-			arrayValue = arrayValue.map(t4).filter(Boolean);
-			const settingsDefaultsForField = repeatableItemSettingsDefaults[fieldName];
-			T0 = RepeaterHoverProvider;
-			t1 = blockId;
-			t2 = fieldName;
-			let t5;
-			if ($[15] !== blockId || $[16] !== children || $[17] !== fieldName || $[18] !== mode || $[19] !== parentRepeaterContext?.containerItemId || $[20] !== settingsDefaultsForField) {
-				t5 = (item_0, index) => {
-					const isDbItem = item_0.content !== void 0 && item_0.id != null;
-					const itemContent = {
-						...repeatableItemDefaults[fieldName],
-						...isDbItem ? item_0.content : item_0
-					};
-					const itemSettings = {
-						...settingsDefaultsForField,
-						...isDbItem ? item_0.settings : null
-					};
-					const itemId = isDbItem ? item_0.id : void 0;
-					const useItemSetting = (settingName) => itemSettings[settingName];
-					const itemApi = {
-						Field: ItemField,
-						Link: ItemLink,
-						Embed: ItemEmbed,
-						Image: ItemImage,
-						File: ItemFile,
-						ImageList: ItemImageList,
-						FileList: ItemFileList,
-						Repeater: ItemRepeater,
-						useSetting: useItemSetting
-					};
-					return /* @__PURE__ */ jsx(RepeaterItemContext.Provider, {
-						value: {
-							arrayFieldName: fieldName,
-							itemIndex: index,
-							itemContent,
-							itemSettings,
-							itemId,
-							containerItemId: itemId ?? parentRepeaterContext?.containerItemId
-						},
-						children: /* @__PURE__ */ jsx(RepeaterItemWrapper, {
-							itemId,
-							blockId,
-							mode,
-							children: children(itemApi, index)
-						})
-					}, itemId ?? index);
-				};
-				$[15] = blockId;
-				$[16] = children;
-				$[17] = fieldName;
-				$[18] = mode;
-				$[19] = parentRepeaterContext?.containerItemId;
-				$[20] = settingsDefaultsForField;
-				$[21] = t5;
-			} else t5 = $[21];
-			t3 = arrayValue.map(t5);
-			$[1] = blockId;
-			$[2] = children;
-			$[3] = fieldName;
-			$[4] = itemsMap;
-			$[5] = mode;
-			$[6] = name;
-			$[7] = parentRepeaterContext?.containerItemId;
-			$[8] = source;
-			$[9] = T0;
-			$[10] = t1;
-			$[11] = t2;
-			$[12] = t3;
-		} else {
-			T0 = $[9];
-			t1 = $[10];
-			t2 = $[11];
-			t3 = $[12];
+		const { children } = t0;
+		const editingRuntime = useBlockEditingRuntime();
+		if (editingRuntime) {
+			let t1;
+			if ($[1] !== children || $[2] !== editingRuntime) {
+				t1 = editingRuntime.renderPrimitive(options, "Detached", { children });
+				$[1] = children;
+				$[2] = editingRuntime;
+				$[3] = t1;
+			} else t1 = $[3];
+			return t1;
 		}
-		let t4;
-		if ($[22] !== T0 || $[23] !== t1 || $[24] !== t2 || $[25] !== t3) {
-			t4 = /* @__PURE__ */ jsx(T0, {
-				blockId: t1,
-				fieldName: t2,
-				children: t3
+		let t1;
+		if ($[4] !== children) {
+			t1 = children({
+				ref: _temp,
+				style: { opacity: 1 },
+				onClick: _temp2,
+				onMouseEnter: _temp3,
+				onMouseLeave: _temp4
 			});
-			$[22] = T0;
-			$[23] = t1;
-			$[24] = t2;
-			$[25] = t3;
-			$[26] = t4;
-		} else t4 = $[26];
-		return t4;
+			$[4] = children;
+			$[5] = t1;
+		} else t1 = $[5];
+		return t1;
 	};
-	const BlockComponent = (t0) => {
-		const $ = c(78);
-		if ($[0] !== "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407") {
-			for (let $i = 0; $i < 78; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-			$[0] = "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407";
+	const Component = (props) => {
+		const $ = c(23);
+		if ($[0] !== "04a637ebd823abadf975e738c0e326acccffcffd1f7360db558a19fce0075982") {
+			for (let $i = 0; $i < 23; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+			$[0] = "04a637ebd823abadf975e738c0e326acccffcffd1f7360db558a19fce0075982";
 		}
-		const { blockData, mode, isFirstBlock, showAddBlockTop, showAddBlockBottom, addBlockAfterPosition } = t0;
-		const isContentEditable = useIsEditable(mode);
-		const { window: iframeWindow } = useFrame();
-		const [isHovered, setIsHovered] = React.useState(false);
-		const selection = useSelector(previewStore, _temp5);
-		const isPageEditorSidebarOpen = useSelector(previewStore, _temp6);
-		const isAddBlockSidebarOpen = useSelector(previewStore, _temp7);
-		const pendingAgentBlockFocus = useSelector(previewStore, _temp8);
-		const isBlockSelected = selection?.blockId === blockData._id;
-		const ref = React.useRef(null);
-		const [isFirstRender, setIsFirstRender] = React.useState(true);
-		let t1;
-		let t2;
-		if ($[1] !== isFirstRender) {
-			t1 = () => {
-				if (isFirstRender) setIsFirstRender(false);
-			};
-			t2 = [isFirstRender];
-			$[1] = isFirstRender;
-			$[2] = t1;
-			$[3] = t2;
-		} else {
-			t1 = $[2];
-			t2 = $[3];
+		const editingRuntime = useBlockEditingRuntime();
+		if (editingRuntime) {
+			let t0;
+			if ($[1] !== editingRuntime || $[2] !== props) {
+				t0 = editingRuntime.renderBlock(options, props);
+				$[1] = editingRuntime;
+				$[2] = props;
+				$[3] = t0;
+			} else t0 = $[3];
+			return t0;
 		}
-		React.useEffect(t1, t2);
-		let t3;
-		if ($[4] !== blockData._id || $[5] !== isBlockSelected || $[6] !== isFirstRender || $[7] !== pendingAgentBlockFocus?.blockId) {
-			t3 = () => {
-				if (!isBlockSelected || !ref.current) return;
-				if (pendingAgentBlockFocus?.blockId === blockData._id) return;
-				ref.current.scrollIntoView({
-					behavior: isFirstRender ? "instant" : "smooth",
-					block: isFirstRender ? "start" : "nearest"
-				});
-			};
-			$[4] = blockData._id;
-			$[5] = isBlockSelected;
-			$[6] = isFirstRender;
-			$[7] = pendingAgentBlockFocus?.blockId;
-			$[8] = t3;
-		} else t3 = $[8];
-		let t4;
-		if ($[9] !== blockData._id || $[10] !== isBlockSelected || $[11] !== isFirstRender || $[12] !== isPageEditorSidebarOpen || $[13] !== pendingAgentBlockFocus) {
-			t4 = [
-				blockData._id,
-				isBlockSelected,
-				isFirstRender,
-				isPageEditorSidebarOpen,
-				pendingAgentBlockFocus
-			];
-			$[9] = blockData._id;
-			$[10] = isBlockSelected;
-			$[11] = isFirstRender;
-			$[12] = isPageEditorSidebarOpen;
-			$[13] = pendingAgentBlockFocus;
-			$[14] = t4;
-		} else t4 = $[14];
-		React.useEffect(t3, t4);
-		let t5;
-		let t6;
-		if ($[15] !== blockData._id || $[16] !== pendingAgentBlockFocus) {
-			t5 = () => {
-				if (!pendingAgentBlockFocus || pendingAgentBlockFocus.blockId !== blockData._id) return;
-				if (!ref.current) return;
-				ref.current.scrollIntoView({
-					behavior: "smooth",
-					block: "nearest"
-				});
-				previewStore.send({
-					type: "clearPendingAgentBlockFocus",
-					requestId: pendingAgentBlockFocus.requestId
-				});
-			};
-			t6 = [blockData._id, pendingAgentBlockFocus];
-			$[15] = blockData._id;
-			$[16] = pendingAgentBlockFocus;
-			$[17] = t5;
-			$[18] = t6;
-		} else {
-			t5 = $[17];
-			t6 = $[18];
-		}
-		React.useEffect(t5, t6);
-		const t7 = String(blockData._id);
-		let t8;
-		if ($[19] !== t7) {
-			t8 = { blockId: t7 };
-			$[19] = t7;
-			$[20] = t8;
-		} else t8 = $[20];
-		const isHoveredFromSidebar = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_BLOCK", "CAMOX_HOVER_BLOCK_END", t8);
-		let t10;
-		let t9;
-		if ($[21] !== isHoveredFromSidebar) {
-			t9 = () => {
-				setIsHovered(isHoveredFromSidebar);
+		const { blockData, mode } = props;
+		let mergedContent;
+		let normalizedContent;
+		if ($[4] !== blockData.content) {
+			mergedContent = {
+				...contentDefaults,
+				...blockData.content
 			};
-			t10 = [isHoveredFromSidebar];
-			$[21] = isHoveredFromSidebar;
-			$[22] = t10;
-			$[23] = t9;
+			normalizedContent = { ...mergedContent };
+			for (const [key, value] of Object.entries(normalizedContent)) if (Array.isArray(value) && value[0]?.content !== void 0) normalizedContent[key] = value.map(_temp5);
+			$[4] = blockData.content;
+			$[5] = mergedContent;
+			$[6] = normalizedContent;
 		} else {
-			t10 = $[22];
-			t9 = $[23];
+			mergedContent = $[5];
+			normalizedContent = $[6];
 		}
-		React.useEffect(t9, t10);
-		let result;
-		if ($[24] !== blockData.content) {
-			result = { ...blockData.content };
-			for (const key in result) {
-				const value = result[key];
-				if (Array.isArray(value) && value.length > 0 && value[0]?.content !== void 0) result[key] = value.map(_temp9);
-			}
-			$[24] = blockData.content;
-			$[25] = result;
-		} else result = $[25];
-		const normalizedContent = result;
-		let t11;
-		if ($[26] !== blockData._id || $[27] !== isContentEditable) {
-			t11 = (e) => {
-				if (!isContentEditable) return;
-				if (e.target.closest("[data-camox-field-id]")) return;
-				previewStore.send({
-					type: "setFocusedBlock",
-					blockId: blockData._id
-				});
-			};
-			$[26] = blockData._id;
-			$[27] = isContentEditable;
-			$[28] = t11;
-		} else t11 = $[28];
-		const handleClick = t11;
-		let t12;
-		if ($[29] !== isContentEditable) {
-			t12 = () => {
-				if (isContentEditable) setIsHovered(true);
-			};
-			$[29] = isContentEditable;
-			$[30] = t12;
-		} else t12 = $[30];
-		const handleMouseEnter = t12;
-		let t13;
-		if ($[31] !== isContentEditable) {
-			t13 = () => {
-				if (isContentEditable) setIsHovered(false);
-			};
-			$[31] = isContentEditable;
-			$[32] = t13;
-		} else t13 = $[32];
-		const handleMouseLeave = t13;
-		let t14;
-		if ($[33] !== addBlockAfterPosition || $[34] !== blockData.position) {
-			t14 = (insertPosition) => {
-				postOverlayMessage({
-					type: "CAMOX_ADD_BLOCK_REQUEST",
-					blockPosition: blockData.position,
-					insertPosition,
-					...addBlockAfterPosition !== void 0 && { afterPosition: addBlockAfterPosition }
-				});
-			};
-			$[33] = addBlockAfterPosition;
-			$[34] = blockData.position;
-			$[35] = t14;
-		} else t14 = $[35];
-		const handleAddBlockClick = t14;
-		const shouldShowOverlay = isContentEditable && (isHovered || isBlockSelected) && !isAddBlockSidebarOpen;
-		const shouldShowAddBlockOverlay = isAddBlockSidebarOpen && mode !== "peek";
-		let t15;
-		if ($[36] === Symbol.for("react.memo_cache_sentinel")) {
-			t15 = {
+		const AuthoredComponent = options.component;
+		let t0;
+		if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+			t0 = {
 				position: "relative",
 				scrollMargin: "5rem",
 				background: "var(--background)"
 			};
-			$[36] = t15;
-		} else t15 = $[36];
-		const t16 = isContentEditable ? blockData._id : void 0;
-		const t17 = shouldShowOverlay && !isBlockSelected || void 0;
-		const t18 = shouldShowOverlay && isBlockSelected || void 0;
-		const t19 = mode === "layout" ? "layout" : void 0;
-		const t20 = blockData._id;
-		let t21;
-		if ($[37] !== blockData.content) {
-			t21 = {
-				...contentDefaults,
-				...blockData.content
-			};
-			$[37] = blockData.content;
-			$[38] = t21;
-		} else t21 = $[38];
-		const merged = t21;
-		let overrides;
-		if ($[39] !== merged) {
-			overrides = {};
-			for (const key_0 in merged) {
-				const val = merged[key_0];
-				if (val && typeof val === "object" && "url" in val && !val.url && contentDefaults[key_0]) overrides[key_0] = contentDefaults[key_0];
-			}
-			$[39] = merged;
-			$[40] = overrides;
-		} else overrides = $[40];
-		let t22;
-		if ($[41] !== merged || $[42] !== overrides) {
-			t22 = {
-				...merged,
-				...overrides
-			};
-			$[41] = merged;
-			$[42] = overrides;
-			$[43] = t22;
-		} else t22 = $[43];
-		const t23 = t22;
-		let t24;
-		if ($[44] !== blockData.settings) {
-			t24 = {
+			$[7] = t0;
+		} else t0 = $[7];
+		let t1;
+		if ($[8] !== blockData.settings) {
+			t1 = {
 				...settingsDefaults,
 				...blockData.settings
 			};
-			$[44] = blockData.settings;
-			$[45] = t24;
-		} else t24 = $[45];
-		const t25 = t24;
-		let t26;
-		if ($[46] !== blockData._id || $[47] !== isHovered || $[48] !== mode || $[49] !== t23 || $[50] !== t25) {
-			t26 = {
-				blockId: t20,
-				content: t23,
-				settings: t25,
-				mode,
-				isHovered,
-				setIsHovered
-			};
-			$[46] = blockData._id;
-			$[47] = isHovered;
-			$[48] = mode;
-			$[49] = t23;
-			$[50] = t25;
-			$[51] = t26;
-		} else t26 = $[51];
-		let t27;
-		if ($[52] !== normalizedContent) {
-			t27 = /* @__PURE__ */ jsx(options.component, { content: normalizedContent });
-			$[52] = normalizedContent;
-			$[53] = t27;
-		} else t27 = $[53];
-		let t28;
-		if ($[54] !== t26 || $[55] !== t27) {
-			t28 = /* @__PURE__ */ jsx(Context.Provider, {
-				value: t26,
-				children: t27
-			});
-			$[54] = t26;
-			$[55] = t27;
-			$[56] = t28;
-		} else t28 = $[56];
-		const t29 = shouldShowAddBlockOverlay || void 0;
-		let t30;
-		if ($[57] !== t29) {
-			t30 = /* @__PURE__ */ jsx("div", {
-				className: "camox-sheet-overlay",
-				"data-camox-visible": t29
-			});
-			$[57] = t29;
-			$[58] = t30;
-		} else t30 = $[58];
-		let t31;
-		if ($[59] !== handleAddBlockClick || $[60] !== isAddBlockSidebarOpen || $[61] !== isFirstBlock || $[62] !== mode || $[63] !== shouldShowOverlay || $[64] !== showAddBlockBottom || $[65] !== showAddBlockTop) {
-			t31 = shouldShowOverlay && /* @__PURE__ */ jsxs(Fragment, { children: [(showAddBlockTop ?? (mode !== "layout" && !isFirstBlock)) && /* @__PURE__ */ jsx(AddBlockControlBar, {
-				position: "top",
-				hidden: isAddBlockSidebarOpen,
-				onMouseLeave: () => setIsHovered(false),
-				onClick: () => handleAddBlockClick("before")
-			}), (showAddBlockBottom ?? mode !== "layout") && /* @__PURE__ */ jsx(AddBlockControlBar, {
-				position: "bottom",
-				hidden: isAddBlockSidebarOpen,
-				onMouseLeave: () => setIsHovered(false),
-				onClick: () => handleAddBlockClick("after")
-			})] });
-			$[59] = handleAddBlockClick;
-			$[60] = isAddBlockSidebarOpen;
-			$[61] = isFirstBlock;
-			$[62] = mode;
-			$[63] = shouldShowOverlay;
-			$[64] = showAddBlockBottom;
-			$[65] = showAddBlockTop;
-			$[66] = t31;
-		} else t31 = $[66];
-		let t32;
-		if ($[67] !== handleClick || $[68] !== handleMouseEnter || $[69] !== handleMouseLeave || $[70] !== t16 || $[71] !== t17 || $[72] !== t18 || $[73] !== t19 || $[74] !== t28 || $[75] !== t30 || $[76] !== t31) {
-			t32 = /* @__PURE__ */ jsxs("div", {
-				className: "group visual-editing-block",
-				ref,
-				style: t15,
-				"data-camox-block-id": t16,
-				"data-camox-hovered": t17,
-				"data-camox-focused": t18,
-				"data-camox-overlay-mode": t19,
-				onClick: handleClick,
-				onMouseEnter: handleMouseEnter,
-				onMouseLeave: handleMouseLeave,
-				children: [
-					t28,
-					t30,
-					t31
-				]
-			});
-			$[67] = handleClick;
-			$[68] = handleMouseEnter;
-			$[69] = handleMouseLeave;
-			$[70] = t16;
-			$[71] = t17;
-			$[72] = t18;
-			$[73] = t19;
-			$[74] = t28;
-			$[75] = t30;
-			$[76] = t31;
-			$[77] = t32;
-		} else t32 = $[77];
-		return t32;
-	};
-	const useSetting = (name) => {
-		const ctx = React.use(Context);
-		if (!ctx) throw new Error("useSetting must be used within a Block Component");
-		return ctx.settings[name];
-	};
-	/**
-	* Wraps block content that renders outside the block's visual bounds (fixed navbars, modals, portals, etc.).
-	* Provides the same hover, selection, and sheet overlays as the main BlockComponent.
-	*/
-	const Detached = (t0) => {
-		const $ = c(31);
-		if ($[0] !== "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407") {
-			for (let $i = 0; $i < 31; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-			$[0] = "9cd21990f1cb26b8613f764719b3c2aa84ab101438380ec49833d48adbdfe407";
-		}
-		const { children } = t0;
-		const ctx = React.use(Context);
-		if (!ctx) throw new Error("Detached must be used within a Block Component");
-		const { blockId, mode, isHovered, setIsHovered } = ctx;
-		const isContentEditable = useIsEditable(mode);
-		const { window: iframeWindow } = useFrame();
-		const selection = useSelector(previewStore, _temp0);
-		const isAddBlockSidebarOpen = useSelector(previewStore, _temp1);
-		const isBlockSelected = selection?.blockId === blockId;
-		const t1 = String(blockId);
+			$[8] = blockData.settings;
+			$[9] = t1;
+		} else t1 = $[9];
 		let t2;
-		if ($[1] !== t1) {
-			t2 = { blockId: t1 };
-			$[1] = t1;
-			$[2] = t2;
-		} else t2 = $[2];
-		const isHoveredFromSidebar = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_BLOCK", "CAMOX_HOVER_BLOCK_END", t2);
+		if ($[10] !== blockData._id || $[11] !== mergedContent || $[12] !== mode || $[13] !== t1) {
+			t2 = {
+				blockId: blockData._id,
+				content: mergedContent,
+				settings: t1,
+				mode
+			};
+			$[10] = blockData._id;
+			$[11] = mergedContent;
+			$[12] = mode;
+			$[13] = t1;
+			$[14] = t2;
+		} else t2 = $[14];
 		let t3;
+		if ($[15] !== normalizedContent) {
+			t3 = /* @__PURE__ */ jsx(AuthoredComponent, { content: normalizedContent });
+			$[15] = normalizedContent;
+			$[16] = t3;
+		} else t3 = $[16];
 		let t4;
-		if ($[3] !== isHoveredFromSidebar || $[4] !== setIsHovered) {
-			t3 = () => {
-				setIsHovered(isHoveredFromSidebar);
-			};
-			t4 = [isHoveredFromSidebar, setIsHovered];
-			$[3] = isHoveredFromSidebar;
-			$[4] = setIsHovered;
-			$[5] = t3;
-			$[6] = t4;
-		} else {
-			t3 = $[5];
-			t4 = $[6];
-		}
-		React.useEffect(t3, t4);
-		const shouldShowOverlay = isContentEditable && (isHovered || isBlockSelected) && !isAddBlockSidebarOpen;
-		const shouldHideForAddBlockSidebar = isAddBlockSidebarOpen && mode !== "peek";
+		if ($[17] !== t2 || $[18] !== t3) {
+			t4 = /* @__PURE__ */ jsx(Context.Provider, {
+				value: t2,
+				children: t3
+			});
+			$[17] = t2;
+			$[18] = t3;
+			$[19] = t4;
+		} else t4 = $[19];
 		let t5;
-		if ($[7] !== blockId || $[8] !== isContentEditable) {
-			t5 = (e) => {
-				if (!isContentEditable) return;
-				e.stopPropagation();
-				previewStore.send({
-					type: "setFocusedBlock",
-					blockId
-				});
-			};
-			$[7] = blockId;
-			$[8] = isContentEditable;
-			$[9] = t5;
-		} else t5 = $[9];
-		const handleClick = t5;
+		if ($[20] === Symbol.for("react.memo_cache_sentinel")) {
+			t5 = /* @__PURE__ */ jsx("div", { className: "camox-sheet-overlay" });
+			$[20] = t5;
+		} else t5 = $[20];
 		let t6;
-		if ($[10] !== isContentEditable || $[11] !== setIsHovered) {
-			t6 = () => {
-				if (isContentEditable) setIsHovered(true);
-			};
-			$[10] = isContentEditable;
-			$[11] = setIsHovered;
-			$[12] = t6;
-		} else t6 = $[12];
-		const handleMouseEnter = t6;
-		let t7;
-		if ($[13] !== isContentEditable || $[14] !== setIsHovered) {
-			t7 = () => {
-				if (isContentEditable) setIsHovered(false);
-			};
-			$[13] = isContentEditable;
-			$[14] = setIsHovered;
-			$[15] = t7;
-		} else t7 = $[15];
-		const handleMouseLeave = t7;
-		const [container, setContainer] = React.useState(null);
-		const t8 = shouldHideForAddBlockSidebar ? 0 : 1;
-		let t9;
-		if ($[16] !== children || $[17] !== handleClick || $[18] !== handleMouseEnter || $[19] !== handleMouseLeave || $[20] !== t8) {
-			t9 = children({
-				ref: setContainer,
-				style: { opacity: t8 },
-				onClick: handleClick,
-				onMouseEnter: handleMouseEnter,
-				onMouseLeave: handleMouseLeave
+		if ($[21] !== t4) {
+			t6 = /* @__PURE__ */ jsxs("div", {
+				className: "group visual-editing-block",
+				style: t0,
+				children: [t4, t5]
 			});
-			$[16] = children;
-			$[17] = handleClick;
-			$[18] = handleMouseEnter;
-			$[19] = handleMouseLeave;
-			$[20] = t8;
-			$[21] = t9;
-		} else t9 = $[21];
-		let t10;
-		if ($[22] !== blockId || $[23] !== container || $[24] !== isBlockSelected || $[25] !== mode || $[26] !== shouldShowOverlay) {
-			t10 = container && createPortal(/* @__PURE__ */ jsx(Fragment, { children: shouldShowOverlay && /* @__PURE__ */ jsx("div", {
-				"data-camox-block-id": blockId,
-				"data-camox-detached": true,
-				"data-camox-hovered": !isBlockSelected || void 0,
-				"data-camox-focused": isBlockSelected || void 0,
-				"data-camox-overlay-mode": mode === "layout" ? "layout" : void 0,
-				style: {
-					position: "absolute",
-					pointerEvents: "none",
-					zIndex: 10
-				}
-			}) }), container);
-			$[22] = blockId;
-			$[23] = container;
-			$[24] = isBlockSelected;
-			$[25] = mode;
-			$[26] = shouldShowOverlay;
-			$[27] = t10;
-		} else t10 = $[27];
-		let t11;
-		if ($[28] !== t10 || $[29] !== t9) {
-			t11 = /* @__PURE__ */ jsxs(Fragment, { children: [t9, t10] });
-			$[28] = t10;
-			$[29] = t9;
-			$[30] = t11;
-		} else t11 = $[30];
-		return t11;
+			$[21] = t4;
+			$[22] = t6;
+		} else t6 = $[22];
+		return t6;
+	};
+	const contentSchema = {
+		type: "object",
+		title: options.title,
+		description: options.description,
+		properties: typeboxSchema.properties,
+		required: Object.keys(options.content),
+		toMarkdown: resolveToMarkdown(options.toMarkdown, options.settings, "block")
+	};
+	const settingsSchema = settingsTypeboxSchema ? {
+		type: "object",
+		properties: settingsTypeboxSchema.properties,
+		required: Object.keys(options.settings ?? {})
+	} : void 0;
+	const getInitialBundle = () => {
+		const content = { ...contentDefaults };
+		const repeatableItems = [];
+		buildInitialItems(typeboxSchema.properties, null, content, repeatableItems, { value: 0 });
+		const storageContent = {};
+		for (const [key, property] of Object.entries(typeboxSchema.properties)) {
+			if ([
+				"Image",
+				"File",
+				"ImageList",
+				"FileList",
+				"Repeater"
+			].includes(property.fieldType)) continue;
+			if ("default" in property) storageContent[key] = property.default;
+		}
+		return {
+			content: storageContent,
+			settings: { ...settingsDefaults },
+			repeatableItems
+		};
 	};
 	return {
 		Detached,
@@ -1651,50 +540,33 @@ function createBlock(options) {
 		Repeater,
 		useSetting,
 		_internal: {
-			/**
-			* The react component to be used at the page level when mapping on blocks content.
-			* It exposes context that will be consumed by the Field component, and provides visual editing
-			* capabilities (e.g. delete and reorder blocks).
-			*/
-			Component: BlockComponent,
+			Component,
 			id: options.id,
 			title: options.title,
 			description: options.description,
 			contentSchema,
 			settingsSchema,
 			layoutOnly: options.layoutOnly ?? false,
-			getInitialBundle: () => {
-				const counter = { value: 0 };
-				const allSeeds = [];
-				const content = { ...contentDefaults };
-				buildInitialSeeds(typeboxSchema.properties, null, content, allSeeds, counter);
-				const storageContent = {};
-				for (const [key, prop] of Object.entries(typeboxSchema.properties)) {
-					const ft = prop.fieldType;
-					if (ft === "Image" || ft === "File" || ft === "ImageList" || ft === "FileList" || ft === "Repeater") continue;
-					if ("default" in prop) storageContent[key] = prop.default;
-				}
-				return {
-					content: storageContent,
-					settings: { ...settingsDefaults },
-					repeatableItems: allSeeds
-				};
-			},
+			getInitialBundle,
 			getInitialContent: () => {
-				return { ...contentDefaultsForStorage };
-			},
-			getInitialSettings: () => {
-				return { ...settingsDefaults };
+				const content = { ...contentDefaults };
+				for (const [key, property] of Object.entries(typeboxSchema.properties)) if ([
+					"Image",
+					"File",
+					"ImageList",
+					"FileList",
+					"Repeater"
+				].includes(property.fieldType)) delete content[key];
+				return content;
 			},
+			getInitialSettings: () => ({ ...settingsDefaults }),
 			getPeekBundle: () => {
-				const PEEK_BLOCK_ID = -1;
-				const counter = { value: 0 };
-				const allItems = [];
 				const content = { ...contentDefaults };
-				buildPeekItems(typeboxSchema.properties, PEEK_BLOCK_ID, null, content, allItems, counter);
+				const repeatableItems = [];
+				buildPeekItems(typeboxSchema.properties, -1, null, content, repeatableItems, { value: 0 });
 				return {
 					block: {
-						id: PEEK_BLOCK_ID,
+						id: -1,
 						pageId: null,
 						layoutId: null,
 						type: options.id,
@@ -1706,46 +578,21 @@ function createBlock(options) {
 						createdAt: 0,
 						updatedAt: 0
 					},
-					repeatableItems: allItems,
+					repeatableItems,
 					files: []
 				};
 			}
 		}
 	};
 }
-function _temp(l) {
-	return l.pathname;
-}
-function _temp2(e_1) {
-	return e_1.preventDefault();
-}
-function _temp3(e_2) {
-	if (e_2.key === "Escape") e_2.target.blur();
-}
-function _temp4(e_3) {
-	return e_3.preventDefault();
-}
-function _temp5(state) {
-	return state.context.selection;
-}
-function _temp6(state_0) {
-	return state_0.context.isPageEditorSidebarOpen;
-}
-function _temp7(state_1) {
-	return state_1.context.isAddBlockSidebarOpen;
-}
-function _temp8(state_2) {
-	return state_2.context.pendingAgentBlockFocus;
-}
-function _temp9(item) {
+const createBlock = createViewBlock;
+function _temp() {}
+function _temp2() {}
+function _temp3() {}
+function _temp4() {}
+function _temp5(item) {
 	return item.content;
 }
-function _temp0(state) {
-	return state.context.selection;
-}
-function _temp1(state_0) {
-	return state_0.context.isAddBlockSidebarOpen;
-}
 
 //#endregion
 export { Type, createBlock };