camox 0.43.0 → 0.45.0

package/dist/core/createBlock.js

@@ -1,17 +1,24 @@
-import { useLocation } from "../features/navigation/navigation.js";
-import { useProjectSlug } from "../lib/auth.js";
-import { viewPageQueries, viewProjectQueries } from "../lib/view-queries.js";
-import { isFileMarker, isItemMarker, resolveFileMarker, useNormalizedData } from "../lib/normalized-data.js";
+import { artifactFrameProps, artifactStandInProps, isArtifactSource } from "./lib/artifact.js";
+import { artifactData } from "./lib/artifactData.js";
+import { resolveBlockFields, resolveToMarkdown } from "./lib/contentType.js";
+import { useProjectUuid } from "../lib/auth.js";
+import { useLocation, useNavigate } from "../features/navigation/navigation.js";
+import { useOptionalCamoxApp } from "../features/provider/components/CamoxAppContext.js";
+import { isItemMarker, queryResultIds, resolveAssetValue, useNormalizedData } from "../lib/normalized-data.js";
+import { useLinkPages } from "../lib/link-pages.js";
 import { useBlockEditingRuntime } from "./editing/BlockEditingRuntime.js";
-import { Type, resolveToMarkdown } from "./lib/contentType.js";
+import { ArtifactStudioContext, ArtifactsRunContext, useArtifactHost, useInitialArtifactData } from "./hooks/useArtifactHost.js";
+import { IconSvg } from "./lib/icons.js";
+import { renderImagePlaceholder } from "./lib/imagePlaceholder.js";
 import { buildImageSrcSet, getDefaultImageSizes, getDefaultImageWidth, transformImageUrl } from "./lib/imageTransform.js";
 import { markdownToReactNodes } from "./lib/lexicalReact.js";
+import { resolveReference, resolveReferenceList } from "./lib/reference.js";
 import { c } from "react/compiler-runtime";
-import { Type as Type$1 } from "@sinclair/typebox";
-import { useQuery } from "@tanstack/react-query";
-import { generateKeyBetween } from "fractional-indexing";
 import * as React from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { isQueryBacked } from "@camox/api-contract";
+import { Type } from "@sinclair/typebox";
+import { generateKeyBetween } from "fractional-indexing";
+import { jsx } from "react/jsx-runtime";
 
 //#region src/core/createBlock.tsx
 const ASSET_LIST_SELF_KEY = "__camox_asset_self__";
@@ -23,7 +30,10 @@ function normalizeLinkValue(value) {
 	};
 }
 function resolveLinkHref(link, pages, pathname) {
-	if (link.type === "page") return pages?.find((page) => String(page.id) === link.pageId)?.fullPath ?? pathname;
+	if (link.type === "page") {
+		if (!pages) return pathname;
+		return pages.find((page) => page.id === link.pageId)?.fullPath ?? null;
+	}
 	if (!link.href || link.href.startsWith("#")) return `${pathname}${link.href ?? ""}`;
 	return link.href;
 }
@@ -70,7 +80,7 @@ function buildPeekItems(properties, blockId, parentItemId, content, items, count
 		const markers = [];
 		let previousPosition = null;
 		for (let index = 0; index < defaultCount; index += 1) {
-			const id = --counter.value;
+			const id = `peek_${++counter.value}`;
 			const itemContent = {};
 			for (const [key, itemProperty] of Object.entries(property.items.properties)) {
 				if (itemProperty.type === "array" && itemProperty.items?.properties) continue;
@@ -88,7 +98,10 @@ function buildPeekItems(properties, blockId, parentItemId, content, items, count
 				summary: "",
 				position,
 				createdAt: 0,
-				updatedAt: 0
+				updatedAt: 0,
+				projectId: null,
+				sharedContentType: null,
+				references: {}
 			});
 			markers.push({ _itemId: id });
 			const nestedContent = {};
@@ -103,8 +116,9 @@ function buildPeekItems(properties, blockId, parentItemId, content, items, count
 	}
 }
 function createViewBlock(options) {
-	const typeboxSchema = Type$1.Object(options.content);
-	const settingsTypeboxSchema = options.settings ? Type$1.Object(options.settings) : null;
+	const fields = resolveBlockFields(options);
+	const typeboxSchema = Type.Object(fields.content);
+	const settingsTypeboxSchema = fields.settings ? Type.Object(fields.settings) : null;
 	const contentDefaults = collectDefaults(typeboxSchema.properties);
 	const settingsDefaults = settingsTypeboxSchema ? collectDefaults(settingsTypeboxSchema.properties) : {};
 	const repeatableDefaults = {};
@@ -131,19 +145,26 @@ function createViewBlock(options) {
 			children
 		});
 		const value = useValue(name);
-		const projectSlug = useProjectSlug();
-		const { data: project } = useQuery(viewProjectQueries.getBySlug(projectSlug));
-		const { data: pages } = useQuery({
-			...viewPageQueries.list(project?.id ?? 0),
-			enabled: !!project
-		});
+		const pages = useLinkPages(useProjectUuid());
+		const pathname = useLocation({ select: (location) => location.pathname });
 		return children({ children: markdownToReactNodes(value, {
 			pages,
-			fallbackHref: useLocation({ select: (location) => location.pathname }),
+			fallbackHref: pathname,
 			textStyle,
 			linkStyle
 		}) }, { text: value });
 	};
+	const Icon = ({ name, ...props }) => {
+		const editingRuntime = useBlockEditingRuntime();
+		if (editingRuntime) return editingRuntime.renderPrimitive(options, "Icon", {
+			name,
+			...props
+		});
+		return /* @__PURE__ */ jsx(IconSvg, {
+			iconId: useValue(name),
+			...props
+		});
+	};
 	const Embed = ({ name, children }) => {
 		const editingRuntime = useBlockEditingRuntime();
 		if (editingRuntime) return editingRuntime.renderPrimitive(options, "Embed", {
@@ -154,6 +175,85 @@ function createViewBlock(options) {
 		const value = typeof rawValue === "string" ? rawValue : "";
 		return children({ src: value }, { url: value });
 	};
+	const Artifact = ({ name, children }) => {
+		const editingRuntime = useBlockEditingRuntime();
+		if (editingRuntime) return editingRuntime.renderPrimitive(options, "Artifact", {
+			name,
+			children
+		});
+		const value = useValue(name);
+		const data = useArtifactData(name);
+		const hostProps = useArtifactHost({
+			studio: React.use(ArtifactStudioContext),
+			data,
+			size: useFieldSchema(name)?.size,
+			navigate: useNavigate()
+		});
+		const initialData = useInitialArtifactData(value, data);
+		const fontLinks = useOptionalCamoxApp()?.getArtifactFontLinks();
+		const runs = React.use(ArtifactsRunContext);
+		if (!isArtifactSource(value)) return null;
+		return children({
+			...runs ? artifactFrameProps(value, {
+				fontLinks,
+				data: initialData
+			}) : artifactStandInProps(value),
+			...hostProps
+		});
+	};
+	function useArtifactData(name) {
+		const $ = c(13);
+		const block = React.use(Context);
+		const item = React.use(RepeaterContext);
+		const { filesMap } = useNormalizedData();
+		const pages = useLinkPages(useProjectUuid());
+		let t0;
+		if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+			t0 = { select: _temp2 };
+			$[0] = t0;
+		} else t0 = $[0];
+		const pathname = useLocation(t0);
+		if (!block) throw new Error("Artifact must be used within a Block Component");
+		const field = item ? item.itemSchema?.[name] : typeboxSchema.properties[name];
+		let t1;
+		if ($[1] !== block || $[2] !== field || $[3] !== filesMap || $[4] !== item || $[5] !== pages || $[6] !== pathname) {
+			const owner = item ? {
+				content: item.itemContent,
+				settings: item.itemSettings
+			} : {
+				content: block.content,
+				settings: block.settings
+			};
+			let t2;
+			if ($[8] !== pages || $[9] !== pathname) {
+				t2 = (link) => resolveLinkHref(normalizeLinkValue(link), pages, pathname) ?? pathname;
+				$[8] = pages;
+				$[9] = pathname;
+				$[10] = t2;
+			} else t2 = $[10];
+			let t3;
+			if ($[11] !== filesMap) {
+				t3 = (value) => resolveAssetValue(value, filesMap);
+				$[11] = filesMap;
+				$[12] = t3;
+			} else t3 = $[12];
+			t1 = artifactData(field, owner, {
+				linkHref: t2,
+				asset: t3
+			});
+			$[1] = block;
+			$[2] = field;
+			$[3] = filesMap;
+			$[4] = item;
+			$[5] = pages;
+			$[6] = pathname;
+			$[7] = t1;
+		} else t1 = $[7];
+		return t1;
+	}
+	function _temp2(location) {
+		return location.pathname;
+	}
 	const Link = ({ name, children }) => {
 		const editingRuntime = useBlockEditingRuntime();
 		if (editingRuntime) return editingRuntime.renderPrimitive(options, "Link", {
@@ -161,13 +261,8 @@ function createViewBlock(options) {
 			children
 		});
 		const value = normalizeLinkValue(useValue(name) ?? {});
-		const projectSlug = useProjectSlug();
-		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 }));
+		const href = resolveLinkHref(value, useLinkPages(useProjectUuid()), useLocation({ select: (location) => location.pathname }));
+		if (href == null) return value.text;
 		return children({
 			to: href,
 			target: value.newTab ? "_blank" : void 0,
@@ -180,23 +275,19 @@ function createViewBlock(options) {
 		});
 	};
 	function useAsset(name) {
-		const $ = c(4);
-		if ($[0] !== "2482501ae16e686c6c2d84727ab607bf02513a6bcdd7de7e2f7f973cc1690267") {
-			for (let $i = 0; $i < 4; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-			$[0] = "2482501ae16e686c6c2d84727ab607bf02513a6bcdd7de7e2f7f973cc1690267";
-		}
+		const $ = c(3);
 		const block = React.use(Context);
 		const item = React.use(RepeaterContext);
 		const { filesMap } = useNormalizedData();
 		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];
+		if ($[0] !== filesMap || $[1] !== raw) {
+			t0 = resolveAssetValue(raw, filesMap);
+			$[0] = filesMap;
+			$[1] = raw;
+			$[2] = t0;
+		} else t0 = $[2];
 		const resolved = t0;
 		const fallback = item ? repeatableDefaults[item.arrayFieldName]?.[String(name)] : contentDefaults[String(name)];
 		return resolved ?? fallback;
@@ -208,7 +299,7 @@ function createViewBlock(options) {
 			children
 		});
 		const value = useAsset(name);
-		return children({
+		return renderImagePlaceholder(value, children({
 			src: transformImageUrl(value.url, {
 				width: getDefaultImageWidth(),
 				mimeType: value.mimeType,
@@ -217,7 +308,7 @@ function createViewBlock(options) {
 			srcSet: buildImageSrcSet(value.url, value.mimeType, value.size),
 			sizes: getDefaultImageSizes(),
 			alt: value.alt
-		}, value);
+		}, value));
 	};
 	const File = ({ name, children }) => {
 		const editingRuntime = useBlockEditingRuntime();
@@ -231,6 +322,172 @@ function createViewBlock(options) {
 			download: value.filename
 		}, value);
 	};
+	const ReferencePrimitive = (t0) => {
+		const $ = c(6);
+		let Primitive;
+		let props;
+		if ($[0] !== t0) {
+			({primitive: Primitive, ...props} = t0);
+			$[0] = t0;
+			$[1] = Primitive;
+			$[2] = props;
+		} else {
+			Primitive = $[1];
+			props = $[2];
+		}
+		if (useValue(props.name) == null) return null;
+		let t1;
+		if ($[3] !== Primitive || $[4] !== props) {
+			t1 = /* @__PURE__ */ jsx(Primitive, { ...props });
+			$[3] = Primitive;
+			$[4] = props;
+			$[5] = t1;
+		} else t1 = $[5];
+		return t1;
+	};
+	const ReferenceImage = (props) => {
+		const $ = c(2);
+		let t0;
+		if ($[0] !== props) {
+			t0 = /* @__PURE__ */ jsx(ReferencePrimitive, {
+				primitive: Image,
+				...props
+			});
+			$[0] = props;
+			$[1] = t0;
+		} else t0 = $[1];
+		return t0;
+	};
+	const ReferenceFile = (props) => {
+		const $ = c(2);
+		let t0;
+		if ($[0] !== props) {
+			t0 = /* @__PURE__ */ jsx(ReferencePrimitive, {
+				primitive: File,
+				...props
+			});
+			$[0] = props;
+			$[1] = t0;
+		} else t0 = $[1];
+		return t0;
+	};
+	const ReferenceEmbed = (props) => {
+		const $ = c(2);
+		let t0;
+		if ($[0] !== props) {
+			t0 = /* @__PURE__ */ jsx(ReferencePrimitive, {
+				primitive: Embed,
+				...props
+			});
+			$[0] = props;
+			$[1] = t0;
+		} else t0 = $[1];
+		return t0;
+	};
+	function useFieldSchema(name) {
+		const block = React.use(Context);
+		const item = React.use(RepeaterContext);
+		if (item) return item.itemSchema?.[name];
+		return (block?.sourceSchema ?? typeboxSchema.properties)[name];
+	}
+	const Reference = ({ name, children }) => {
+		const editingRuntime = useBlockEditingRuntime();
+		if (editingRuntime) return editingRuntime.renderPrimitive(options, "Reference", {
+			name,
+			children
+		});
+		const block = React.use(Context);
+		const { recordsMap } = useNormalizedData();
+		if (!block) throw new Error("Reference must be used within a Block Component");
+		const schema = useFieldSchema(name);
+		const record = resolveReference(useValue(name), schema.collectionId, recordsMap);
+		if (!record) return null;
+		return /* @__PURE__ */ jsx(RecordScope, {
+			block,
+			schema,
+			record,
+			children
+		});
+	};
+	const ReferenceList = ({ name, children }) => {
+		const editingRuntime = useBlockEditingRuntime();
+		if (editingRuntime) return editingRuntime.renderPrimitive(options, "ReferenceList", {
+			name,
+			children
+		});
+		const block = React.use(Context);
+		const item = React.use(RepeaterContext);
+		const normalizedData = useNormalizedData();
+		if (!block) throw new Error("ReferenceList must be used within a Block Component");
+		const schema = useFieldSchema(name);
+		const stored = useValue(name);
+		const ids = isQueryBacked(schema) ? queryResultIds(normalizedData, {
+			blockId: block.blockId,
+			itemId: item?.itemId
+		}, name) : stored;
+		const { recordsMap } = normalizedData;
+		return resolveReferenceList(ids, schema.collectionId, recordsMap).map((record) => /* @__PURE__ */ jsx(RecordScope, {
+			block,
+			schema,
+			record,
+			children
+		}, record.id));
+	};
+	const RecordScope = (t0) => {
+		const $ = c(13);
+		const { block, schema, record, children } = t0;
+		const hop = block.recordHop ? 2 : 1;
+		let t1;
+		if ($[0] !== block || $[1] !== hop || $[2] !== record.content || $[3] !== schema.referenceSchema.properties) {
+			t1 = {
+				...block,
+				content: record.content,
+				sourceSchema: schema.referenceSchema.properties,
+				recordHop: hop
+			};
+			$[0] = block;
+			$[1] = hop;
+			$[2] = record.content;
+			$[3] = schema.referenceSchema.properties;
+			$[4] = t1;
+		} else t1 = $[4];
+		let t2;
+		if ($[5] !== children || $[6] !== hop || $[7] !== record.id || $[8] !== record.label) {
+			t2 = children({
+				id: record.id,
+				label: record.label,
+				Field,
+				Image: ReferenceImage,
+				File: ReferenceFile,
+				Embed: ReferenceEmbed,
+				ImageList,
+				FileList,
+				...hop === 1 ? {
+					Reference,
+					ReferenceList
+				} : {}
+			});
+			$[5] = children;
+			$[6] = hop;
+			$[7] = record.id;
+			$[8] = record.label;
+			$[9] = t2;
+		} else t2 = $[9];
+		let t3;
+		if ($[10] !== t1 || $[11] !== t2) {
+			t3 = /* @__PURE__ */ jsx(RepeaterContext.Provider, {
+				value: null,
+				children: /* @__PURE__ */ jsx(Context.Provider, {
+					value: t1,
+					children: t2
+				})
+			});
+			$[10] = t1;
+			$[11] = t2;
+			$[12] = t3;
+		} else t3 = $[12];
+		return t3;
+	};
 	const AssetList = ({ name, children, primitive }) => {
 		const editingRuntime = useBlockEditingRuntime();
 		if (editingRuntime) return editingRuntime.renderPrimitive(options, primitive, {
@@ -242,18 +499,18 @@ function createViewBlock(options) {
 		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 schema = parent ? typeboxSchema.properties[parent.arrayFieldName]?.items?.properties?.[fieldName] : (block.sourceSchema ?? 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`);
+		if (fieldType !== "ImageList" && fieldType !== "FileList") throw new Error(`"${fieldName}" is not an imageList or 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, {
+		return values.map((value) => resolveAssetValue(value, filesMap)).filter(Boolean).map((value, index) => /* @__PURE__ */ jsx(RepeaterContext.Provider, {
 			value: {
 				arrayFieldName: fieldName,
 				containerItemId: parent?.itemId ?? parent?.containerItemId,
-				itemContent: { [ASSET_LIST_SELF_KEY]: value_0 },
+				itemContent: { [ASSET_LIST_SELF_KEY]: value },
 				itemSettings: {}
 			},
 			children: /* @__PURE__ */ jsx(Single, {
@@ -263,37 +520,29 @@ function createViewBlock(options) {
 		}, index));
 	};
 	const ImageList = (props) => {
-		const $ = c(3);
-		if ($[0] !== "2482501ae16e686c6c2d84727ab607bf02513a6bcdd7de7e2f7f973cc1690267") {
-			for (let $i = 0; $i < 3; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-			$[0] = "2482501ae16e686c6c2d84727ab607bf02513a6bcdd7de7e2f7f973cc1690267";
-		}
+		const $ = c(2);
 		let t0;
-		if ($[1] !== props) {
+		if ($[0] !== props) {
 			t0 = /* @__PURE__ */ jsx(AssetList, {
 				...props,
 				primitive: "ImageList"
 			});
-			$[1] = props;
-			$[2] = t0;
-		} else t0 = $[2];
+			$[0] = props;
+			$[1] = t0;
+		} else t0 = $[1];
 		return t0;
 	};
 	const FileList = (props) => {
-		const $ = c(3);
-		if ($[0] !== "2482501ae16e686c6c2d84727ab607bf02513a6bcdd7de7e2f7f973cc1690267") {
-			for (let $i = 0; $i < 3; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-			$[0] = "2482501ae16e686c6c2d84727ab607bf02513a6bcdd7de7e2f7f973cc1690267";
-		}
+		const $ = c(2);
 		let t0;
-		if ($[1] !== props) {
+		if ($[0] !== props) {
 			t0 = /* @__PURE__ */ jsx(AssetList, {
 				...props,
 				primitive: "FileList"
 			});
-			$[1] = props;
-			$[2] = t0;
-		} else t0 = $[2];
+			$[0] = props;
+			$[1] = t0;
+		} else t0 = $[1];
 		return t0;
 	};
 	const Repeater = ({ name, children }) => {
@@ -309,26 +558,31 @@ function createViewBlock(options) {
 		const fieldName = String(name);
 		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 itemSchema = (parent ? parent.itemSchema?.[fieldName] : typeboxSchema.properties[fieldName])?.items?.properties;
+		return source.map((item) => isItemMarker(item) ? itemsMap.get(item._itemId) ?? null : item).filter(Boolean).map((item, index) => {
+			const databaseItem = item.content !== void 0 && item.id != null;
 			const itemContent = {
 				...repeatableDefaults[fieldName],
-				...databaseItem ? item_0.content : item_0
+				...databaseItem ? item.content : item
 			};
 			const itemSettings = {
 				...repeatableSettingsDefaults[fieldName],
-				...databaseItem ? item_0.settings : null
+				...databaseItem ? item.settings : null
 			};
-			const itemId = databaseItem ? item_0.id : void 0;
+			const itemId = databaseItem ? item.id : void 0;
 			const api = {
 				Field,
+				Icon,
 				Link,
 				Embed,
+				Artifact,
 				Image,
 				File,
 				ImageList,
 				FileList,
 				Repeater,
+				Reference,
+				ReferenceList,
 				useSetting: (settingName) => itemSettings[settingName]
 			};
 			return /* @__PURE__ */ jsx(RepeaterContext.Provider, {
@@ -337,7 +591,8 @@ function createViewBlock(options) {
 					containerItemId: itemId ?? parent?.containerItemId,
 					itemContent,
 					itemId,
-					itemSettings
+					itemSettings,
+					itemSchema
 				},
 				children: children(api, index)
 			}, itemId ?? index);
@@ -351,149 +606,137 @@ function createViewBlock(options) {
 		return context.settings[name];
 	};
 	const Detached = (t0) => {
-		const $ = c(6);
-		if ($[0] !== "2482501ae16e686c6c2d84727ab607bf02513a6bcdd7de7e2f7f973cc1690267") {
-			for (let $i = 0; $i < 6; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-			$[0] = "2482501ae16e686c6c2d84727ab607bf02513a6bcdd7de7e2f7f973cc1690267";
-		}
+		const $ = c(5);
 		const { children } = t0;
 		const editingRuntime = useBlockEditingRuntime();
 		if (editingRuntime) {
 			let t1;
-			if ($[1] !== children || $[2] !== editingRuntime) {
+			if ($[0] !== children || $[1] !== editingRuntime) {
 				t1 = editingRuntime.renderPrimitive(options, "Detached", { children });
-				$[1] = children;
-				$[2] = editingRuntime;
-				$[3] = t1;
-			} else t1 = $[3];
+				$[0] = children;
+				$[1] = editingRuntime;
+				$[2] = t1;
+			} else t1 = $[2];
 			return t1;
 		}
 		let t1;
-		if ($[4] !== children) {
+		if ($[3] !== children) {
 			t1 = children({
-				ref: _temp,
+				ref: _temp4,
 				style: { opacity: 1 },
-				onClick: _temp2,
-				onMouseEnter: _temp3,
-				onMouseLeave: _temp4
+				onClick: _temp5,
+				onMouseEnter: _temp6,
+				onMouseLeave: _temp7
 			});
-			$[4] = children;
-			$[5] = t1;
-		} else t1 = $[5];
+			$[3] = children;
+			$[4] = t1;
+		} else t1 = $[4];
 		return t1;
 	};
 	const Component = (props) => {
-		const $ = c(23);
-		if ($[0] !== "2482501ae16e686c6c2d84727ab607bf02513a6bcdd7de7e2f7f973cc1690267") {
-			for (let $i = 0; $i < 23; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-			$[0] = "2482501ae16e686c6c2d84727ab607bf02513a6bcdd7de7e2f7f973cc1690267";
-		}
+		const $ = c(22);
 		const editingRuntime = useBlockEditingRuntime();
 		if (editingRuntime) {
 			let t0;
-			if ($[1] !== editingRuntime || $[2] !== props) {
+			if ($[0] !== editingRuntime || $[1] !== props) {
 				t0 = editingRuntime.renderBlock(options, props);
-				$[1] = editingRuntime;
-				$[2] = props;
-				$[3] = t0;
-			} else t0 = $[3];
+				$[0] = editingRuntime;
+				$[1] = props;
+				$[2] = t0;
+			} else t0 = $[2];
 			return t0;
 		}
 		const { blockData, mode } = props;
 		let mergedContent;
 		let normalizedContent;
-		if ($[4] !== blockData.content) {
+		if ($[3] !== blockData.content) {
 			mergedContent = {
 				...contentDefaults,
 				...blockData.content
 			};
 			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;
+			for (const [key, value] of Object.entries(normalizedContent)) if (Array.isArray(value) && value[0]?.content !== void 0) normalizedContent[key] = value.map(_temp8);
+			$[3] = blockData.content;
+			$[4] = mergedContent;
+			$[5] = normalizedContent;
 		} else {
-			mergedContent = $[5];
-			normalizedContent = $[6];
+			mergedContent = $[4];
+			normalizedContent = $[5];
 		}
 		const AuthoredComponent = options.component;
 		let t0;
-		if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+		if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
 			t0 = {
 				position: "relative",
-				scrollMargin: "5rem",
-				background: "var(--background)"
+				scrollMargin: "5rem"
 			};
-			$[7] = t0;
-		} else t0 = $[7];
+			$[6] = t0;
+		} else t0 = $[6];
 		let t1;
-		if ($[8] !== blockData.settings) {
+		if ($[7] !== blockData.settings) {
 			t1 = {
 				...settingsDefaults,
 				...blockData.settings
 			};
-			$[8] = blockData.settings;
-			$[9] = t1;
-		} else t1 = $[9];
+			$[7] = blockData.settings;
+			$[8] = t1;
+		} else t1 = $[8];
 		let t2;
-		if ($[10] !== blockData._id || $[11] !== mergedContent || $[12] !== mode || $[13] !== t1) {
+		if ($[9] !== blockData._id || $[10] !== mergedContent || $[11] !== mode || $[12] !== t1) {
 			t2 = {
 				blockId: blockData._id,
 				content: mergedContent,
 				settings: t1,
 				mode
 			};
-			$[10] = blockData._id;
-			$[11] = mergedContent;
-			$[12] = mode;
-			$[13] = t1;
-			$[14] = t2;
-		} else t2 = $[14];
+			$[9] = blockData._id;
+			$[10] = mergedContent;
+			$[11] = mode;
+			$[12] = t1;
+			$[13] = t2;
+		} else t2 = $[13];
 		let t3;
-		if ($[15] !== normalizedContent) {
+		if ($[14] !== normalizedContent) {
 			t3 = /* @__PURE__ */ jsx(AuthoredComponent, { content: normalizedContent });
-			$[15] = normalizedContent;
-			$[16] = t3;
-		} else t3 = $[16];
+			$[14] = normalizedContent;
+			$[15] = t3;
+		} else t3 = $[15];
 		let t4;
-		if ($[17] !== t2 || $[18] !== t3) {
+		if ($[16] !== t2 || $[17] !== t3) {
 			t4 = /* @__PURE__ */ jsx(Context.Provider, {
 				value: t2,
 				children: t3
 			});
-			$[17] = t2;
-			$[18] = t3;
-			$[19] = t4;
-		} else t4 = $[19];
+			$[16] = t2;
+			$[17] = t3;
+			$[18] = t4;
+		} else t4 = $[18];
 		let 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 ($[21] !== t4) {
-			t6 = /* @__PURE__ */ jsxs("div", {
+		if ($[19] !== blockData._id || $[20] !== t4) {
+			t5 = /* @__PURE__ */ jsx("div", {
 				className: "group visual-editing-block",
+				"data-camox-viewport-block": blockData._id,
 				style: t0,
-				children: [t4, t5]
+				children: t4
 			});
-			$[21] = t4;
-			$[22] = t6;
-		} else t6 = $[22];
-		return t6;
+			$[19] = blockData._id;
+			$[20] = t4;
+			$[21] = t5;
+		} else t5 = $[21];
+		return t5;
 	};
 	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")
+		required: Object.keys(fields.content),
+		toMarkdown: resolveToMarkdown(options.toMarkdown, fields.settings, "block", fields.content)
 	};
 	const settingsSchema = settingsTypeboxSchema ? {
 		type: "object",
 		properties: settingsTypeboxSchema.properties,
-		required: Object.keys(options.settings ?? {})
+		required: Object.keys(fields.settings ?? {})
 	} : void 0;
 	const getInitialBundle = () => {
 		const content = { ...contentDefaults };
@@ -518,14 +761,18 @@ function createViewBlock(options) {
 	};
 	return {
 		Detached,
+		Icon,
 		Field,
 		Embed,
+		Artifact,
 		Link,
 		Image,
 		File,
 		ImageList,
 		FileList,
 		Repeater,
+		Reference,
+		ReferenceList,
 		useSetting,
 		_internal: {
 			Component,
@@ -552,16 +799,16 @@ function createViewBlock(options) {
 			getPeekBundle: () => {
 				const content = { ...contentDefaults };
 				const repeatableItems = [];
-				buildPeekItems(typeboxSchema.properties, -1, null, content, repeatableItems, { value: 0 });
+				buildPeekItems(typeboxSchema.properties, "peek", null, content, repeatableItems, { value: 0 });
 				return {
 					block: {
-						id: -1,
+						id: "peek",
 						pageId: null,
 						layoutId: null,
 						type: options.id,
 						content,
 						settings: settingsDefaults,
-						placement: null,
+						slot: null,
 						summary: "",
 						position: "",
 						createdAt: 0,
@@ -575,13 +822,13 @@ function createViewBlock(options) {
 	};
 }
 const createBlock = createViewBlock;
-function _temp() {}
-function _temp2() {}
-function _temp3() {}
 function _temp4() {}
-function _temp5(item) {
+function _temp5() {}
+function _temp6() {}
+function _temp7() {}
+function _temp8(item) {
 	return item.content;
 }
 
 //#endregion
-export { Type, createBlock };
+export { createBlock };