camox 0.47.0 → 0.51.0

package/dist/core/editing/createEditableBlock.js

@@ -1,6 +1,6 @@
 import { artifactFrameProps, artifactPlaceholderProps, artifactStandInProps, isArtifactSource } from "../lib/artifact.js";
 import { artifactData } from "../lib/artifactData.js";
-import { resolveBlockFields, resolveToMarkdown } from "../lib/contentType.js";
+import { resolveBlockFields, resolveToMarkdown, resolveToStructuredData, resolveToTitle } 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";
@@ -140,6 +140,7 @@ function buildPeekItems(properties, blockId, parentItemId, content, allItems, co
 				content: { ...itemContent },
 				settings: itemSettingsDefaults ? { ...itemSettingsDefaults } : null,
 				summary: "",
+				title: "",
 				position,
 				createdAt: 0,
 				updatedAt: 0,
@@ -168,7 +169,9 @@ function createEditableBlock(options) {
 		description: options.description,
 		properties: typeboxSchema.properties,
 		required: Object.keys(fields.content),
-		toMarkdown: resolveToMarkdown(options.toMarkdown, fields.settings, "block", fields.content)
+		toMarkdown: resolveToMarkdown(options.toMarkdown, fields.settings, "block", fields.content),
+		toTitle: resolveToTitle(options.toTitle, fields.settings, "block", fields.content),
+		...options.toStructuredData && { toStructuredData: resolveToStructuredData(options.toStructuredData, fields.settings, "block", fields.content) }
 	};
 	const settingsTypeboxSchema = fields.settings ? Type.Object(fields.settings) : null;
 	const settingsSchema = settingsTypeboxSchema ? {
@@ -199,6 +202,7 @@ function createEditableBlock(options) {
 	if (settingsTypeboxSchema) {
 		for (const [key, prop] of Object.entries(settingsTypeboxSchema.properties)) if ("default" in prop) settingsDefaults[key] = prop.default;
 	}
+	const ToReact = options.toReact;
 	const Context = React.createContext(null);
 	const RepeatableItemContext = React.createContext(null);
 	const ReferenceContext = React.createContext(null);
@@ -1612,7 +1616,7 @@ function createEditableBlock(options) {
 		return t5;
 	};
 	const BlockComponent = (t0) => {
-		const $ = c(62);
+		const $ = c(63);
 		const { blockData, mode, isFirstBlock, showAddBlockTop, showAddBlockBottom, addBlockAfterPosition } = t0;
 		const isContentEditable = useIsEditable(mode);
 		const { window: iframeWindow } = useFrame();
@@ -1683,20 +1687,30 @@ function createEditableBlock(options) {
 			setPrevSidebarHover(isHoveredFromSidebar);
 			setIsHovered(isHoveredFromSidebar);
 		}
+		let t6;
+		if ($[11] !== blockData.settings) {
+			t6 = {
+				...settingsDefaults,
+				...blockData.settings
+			};
+			$[11] = blockData.settings;
+			$[12] = t6;
+		} else t6 = $[12];
+		const blockSettings = t6;
 		let result;
-		if ($[11] !== blockData.content) {
+		if ($[13] !== 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(_temp7);
 			}
-			$[11] = blockData.content;
-			$[12] = result;
-		} else result = $[12];
+			$[13] = blockData.content;
+			$[14] = result;
+		} else result = $[14];
 		const normalizedContent = result;
-		let t6;
-		if ($[13] !== blockData._id || $[14] !== isContentEditable || $[15] !== selectTarget) {
-			t6 = (e) => {
+		let t7;
+		if ($[15] !== blockData._id || $[16] !== isContentEditable || $[17] !== selectTarget) {
+			t7 = (e) => {
 				if (!isContentEditable) return;
 				const target = e.target;
 				if (target.closest("[data-camox-field-id]")) return;
@@ -1706,169 +1720,163 @@ function createEditableBlock(options) {
 					blockId: blockData._id
 				});
 			};
-			$[13] = blockData._id;
-			$[14] = isContentEditable;
-			$[15] = selectTarget;
-			$[16] = t6;
-		} else t6 = $[16];
-		const handleClick = t6;
-		let t7;
-		if ($[17] !== isContentEditable) {
-			t7 = () => {
-				if (!isContentEditable) return;
-				setIsHovered(true);
-			};
-			$[17] = isContentEditable;
+			$[15] = blockData._id;
+			$[16] = isContentEditable;
+			$[17] = selectTarget;
 			$[18] = t7;
 		} else t7 = $[18];
-		const handleMouseEnter = t7;
+		const handleClick = t7;
 		let t8;
 		if ($[19] !== isContentEditable) {
 			t8 = () => {
 				if (!isContentEditable) return;
-				setIsHovered(false);
+				setIsHovered(true);
 			};
 			$[19] = isContentEditable;
 			$[20] = t8;
 		} else t8 = $[20];
-		const handleMouseLeave = t8;
+		const handleMouseEnter = t8;
+		let t9;
+		if ($[21] !== isContentEditable) {
+			t9 = () => {
+				if (!isContentEditable) return;
+				setIsHovered(false);
+			};
+			$[21] = isContentEditable;
+			$[22] = t9;
+		} else t9 = $[22];
+		const handleMouseLeave = t9;
 		const shouldShowOverlay = isContentEditable && (overlayState["data-camox-hovered"] || overlayState["data-camox-focused"]);
-		const t9 = blockData._id;
-		let t10;
-		if ($[21] === Symbol.for("react.memo_cache_sentinel")) {
-			t10 = {
+		const t10 = blockData._id;
+		let t11;
+		if ($[23] === Symbol.for("react.memo_cache_sentinel")) {
+			t11 = {
 				position: "relative",
 				scrollMargin: "5rem"
 			};
-			$[21] = t10;
-		} else t10 = $[21];
-		const t11 = isContentEditable ? blockData._id : void 0;
-		let t12;
-		if ($[22] !== addBlockAfterPosition || $[23] !== blockData.position || $[24] !== isContentEditable || $[25] !== isFirstBlock || $[26] !== mode || $[27] !== showAddBlockBottom || $[28] !== showAddBlockTop) {
-			t12 = isContentEditable ? JSON.stringify({
+			$[23] = t11;
+		} else t11 = $[23];
+		const t12 = isContentEditable ? blockData._id : void 0;
+		let t13;
+		if ($[24] !== addBlockAfterPosition || $[25] !== blockData.position || $[26] !== isContentEditable || $[27] !== isFirstBlock || $[28] !== mode || $[29] !== showAddBlockBottom || $[30] !== showAddBlockTop) {
+			t13 = isContentEditable ? JSON.stringify({
 				position: blockData.position,
 				before: showAddBlockTop ?? (mode !== "layout" && !isFirstBlock),
 				after: showAddBlockBottom ?? mode !== "layout",
 				...addBlockAfterPosition !== void 0 ? { afterPosition: addBlockAfterPosition } : {}
 			}) : void 0;
-			$[22] = addBlockAfterPosition;
-			$[23] = blockData.position;
-			$[24] = isContentEditable;
-			$[25] = isFirstBlock;
-			$[26] = mode;
-			$[27] = showAddBlockBottom;
-			$[28] = showAddBlockTop;
-			$[29] = t12;
-		} else t12 = $[29];
-		let t13;
-		if ($[30] !== overlayState || $[31] !== shouldShowOverlay) {
-			t13 = shouldShowOverlay ? overlayState : {};
-			$[30] = overlayState;
-			$[31] = shouldShowOverlay;
-			$[32] = t13;
-		} else t13 = $[32];
-		const t14 = blockData._id;
-		let t15;
-		if ($[33] !== blockData.content) {
-			t15 = {
+			$[24] = addBlockAfterPosition;
+			$[25] = blockData.position;
+			$[26] = isContentEditable;
+			$[27] = isFirstBlock;
+			$[28] = mode;
+			$[29] = showAddBlockBottom;
+			$[30] = showAddBlockTop;
+			$[31] = t13;
+		} else t13 = $[31];
+		let t14;
+		if ($[32] !== overlayState || $[33] !== shouldShowOverlay) {
+			t14 = shouldShowOverlay ? overlayState : {};
+			$[32] = overlayState;
+			$[33] = shouldShowOverlay;
+			$[34] = t14;
+		} else t14 = $[34];
+		const t15 = blockData._id;
+		let t16;
+		if ($[35] !== blockData.content) {
+			t16 = {
 				...contentDefaults,
 				...blockData.content
 			};
-			$[33] = blockData.content;
-			$[34] = t15;
-		} else t15 = $[34];
-		const merged = t15;
+			$[35] = blockData.content;
+			$[36] = t16;
+		} else t16 = $[36];
+		const merged = t16;
 		let overrides;
-		if ($[35] !== merged) {
+		if ($[37] !== 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];
 			}
-			$[35] = merged;
-			$[36] = overrides;
-		} else overrides = $[36];
-		let t16;
-		if ($[37] !== merged || $[38] !== overrides) {
-			t16 = {
-				...merged,
-				...overrides
-			};
 			$[37] = merged;
 			$[38] = overrides;
-			$[39] = t16;
-		} else t16 = $[39];
-		const t17 = t16;
-		let t18;
-		if ($[40] !== blockData.settings) {
-			t18 = {
-				...settingsDefaults,
-				...blockData.settings
+		} else overrides = $[38];
+		let t17;
+		if ($[39] !== merged || $[40] !== overrides) {
+			t17 = {
+				...merged,
+				...overrides
 			};
-			$[40] = blockData.settings;
-			$[41] = t18;
-		} else t18 = $[41];
-		const t19 = t18;
-		let t20;
-		if ($[42] !== blockData._id || $[43] !== isHovered || $[44] !== mode || $[45] !== t17 || $[46] !== t19) {
-			t20 = {
-				blockId: t14,
-				content: t17,
-				settings: t19,
+			$[39] = merged;
+			$[40] = overrides;
+			$[41] = t17;
+		} else t17 = $[41];
+		const t18 = t17;
+		let t19;
+		if ($[42] !== blockData || $[43] !== blockSettings || $[44] !== isHovered || $[45] !== mode || $[46] !== t18) {
+			t19 = {
+				blockId: t15,
+				content: t18,
+				settings: blockSettings,
 				mode,
 				isHovered,
 				setIsHovered
 			};
-			$[42] = blockData._id;
-			$[43] = isHovered;
-			$[44] = mode;
-			$[45] = t17;
-			$[46] = t19;
-			$[47] = t20;
-		} else t20 = $[47];
-		let t21;
-		if ($[48] !== normalizedContent) {
-			t21 = /* @__PURE__ */ jsx(options.component, { content: normalizedContent });
-			$[48] = normalizedContent;
-			$[49] = t21;
-		} else t21 = $[49];
-		let t22;
-		if ($[50] !== t20 || $[51] !== t21) {
-			t22 = /* @__PURE__ */ jsx(Context.Provider, {
-				value: t20,
-				children: t21
+			$[42] = blockData;
+			$[43] = blockSettings;
+			$[44] = isHovered;
+			$[45] = mode;
+			$[46] = t18;
+			$[47] = t19;
+		} else t19 = $[47];
+		let t20;
+		if ($[48] !== blockSettings || $[49] !== normalizedContent) {
+			t20 = /* @__PURE__ */ jsx(ToReact, {
+				content: normalizedContent,
+				settings: blockSettings
 			});
+			$[48] = blockSettings;
+			$[49] = normalizedContent;
 			$[50] = t20;
-			$[51] = t21;
-			$[52] = t22;
-		} else t22 = $[52];
-		let t23;
-		if ($[53] !== blockData._id || $[54] !== handleClick || $[55] !== handleMouseEnter || $[56] !== handleMouseLeave || $[57] !== t11 || $[58] !== t12 || $[59] !== t13 || $[60] !== t22) {
-			t23 = /* @__PURE__ */ jsx("div", {
+		} else t20 = $[50];
+		let t21;
+		if ($[51] !== t19 || $[52] !== t20) {
+			t21 = /* @__PURE__ */ jsx(Context.Provider, {
+				value: t19,
+				children: t20
+			});
+			$[51] = t19;
+			$[52] = t20;
+			$[53] = t21;
+		} else t21 = $[53];
+		let t22;
+		if ($[54] !== blockData || $[55] !== handleClick || $[56] !== handleMouseEnter || $[57] !== handleMouseLeave || $[58] !== t12 || $[59] !== t13 || $[60] !== t14 || $[61] !== t21) {
+			t22 = /* @__PURE__ */ jsx("div", {
 				className: "group visual-editing-block",
-				"data-camox-viewport-block": t9,
+				"data-camox-viewport-block": t10,
 				ref,
-				style: t10,
-				"data-camox-block-id": t11,
-				"data-camox-block-insertion": t12,
-				...t13,
+				style: t11,
+				"data-camox-block-id": t12,
+				"data-camox-block-insertion": t13,
+				...t14,
 				"data-camox-overlay-mode": options.synced ? "synced" : void 0,
 				onClickCapture: handleClick,
 				onMouseEnter: handleMouseEnter,
 				onMouseLeave: handleMouseLeave,
-				children: t22
+				children: t21
 			});
-			$[53] = blockData._id;
-			$[54] = handleClick;
-			$[55] = handleMouseEnter;
-			$[56] = handleMouseLeave;
-			$[57] = t11;
+			$[54] = blockData;
+			$[55] = handleClick;
+			$[56] = handleMouseEnter;
+			$[57] = handleMouseLeave;
 			$[58] = t12;
 			$[59] = t13;
-			$[60] = t22;
-			$[61] = t23;
-		} else t23 = $[61];
-		return t23;
+			$[60] = t14;
+			$[61] = t21;
+			$[62] = t22;
+		} else t22 = $[62];
+		return t22;
 	};
 	const useSetting = (name) => {
 		const ctx = React.use(Context);
@@ -2140,7 +2148,7 @@ function createEditableBlock(options) {
 		return t12;
 	};
 	const RecordScope = (t0) => {
-		const $ = c(15);
+		const $ = c(16);
 		const { block, field, record, reference, children } = t0;
 		const t1 = record.content;
 		let t2;
@@ -2156,10 +2164,11 @@ function createEditableBlock(options) {
 			$[3] = t2;
 		} else t2 = $[3];
 		let t3;
-		if ($[4] !== children || $[5] !== record.id || $[6] !== record.label || $[7] !== reference.placement.nested) {
+		if ($[4] !== children || $[5] !== record.description || $[6] !== record.id || $[7] !== record.title || $[8] !== reference.placement.nested) {
 			t3 = children({
 				id: record.id,
-				label: record.label,
+				title: record.title,
+				description: record.description,
 				Field,
 				Image: ReferenceImage,
 				File: ReferenceFile,
@@ -2172,13 +2181,14 @@ function createEditableBlock(options) {
 				}
 			});
 			$[4] = children;
-			$[5] = record.id;
-			$[6] = record.label;
-			$[7] = reference.placement.nested;
-			$[8] = t3;
-		} else t3 = $[8];
+			$[5] = record.description;
+			$[6] = record.id;
+			$[7] = record.title;
+			$[8] = reference.placement.nested;
+			$[9] = t3;
+		} else t3 = $[9];
 		let t4;
-		if ($[9] !== t2 || $[10] !== t3) {
+		if ($[10] !== t2 || $[11] !== t3) {
 			t4 = /* @__PURE__ */ jsx(RepeatableItemContext.Provider, {
 				value: null,
 				children: /* @__PURE__ */ jsx(Context.Provider, {
@@ -2186,20 +2196,20 @@ function createEditableBlock(options) {
 					children: t3
 				})
 			});
-			$[9] = t2;
-			$[10] = t3;
-			$[11] = t4;
-		} else t4 = $[11];
+			$[10] = t2;
+			$[11] = t3;
+			$[12] = t4;
+		} else t4 = $[12];
 		let t5;
-		if ($[12] !== reference || $[13] !== t4) {
+		if ($[13] !== reference || $[14] !== t4) {
 			t5 = /* @__PURE__ */ jsx(ReferenceContext.Provider, {
 				value: reference,
 				children: t4
 			});
-			$[12] = reference;
-			$[13] = t4;
-			$[14] = t5;
-		} else t5 = $[14];
+			$[13] = reference;
+			$[14] = t4;
+			$[15] = t5;
+		} else t5 = $[15];
 		return t5;
 	};
 	const useCollectionTitle = (fieldName, field) => {
@@ -2306,7 +2316,7 @@ function createEditableBlock(options) {
 		const $ = c(10);
 		const { fieldId, record, placedRecord, overlay, children } = t0;
 		const t1 = record?.id;
-		const t2 = record?.label;
+		const t2 = record?.title;
 		let t3;
 		if ($[0] !== placedRecord.error) {
 			t3 = placedRecord.error && /* @__PURE__ */ jsxs("p", {
@@ -2557,17 +2567,17 @@ function createEditableBlock(options) {
 	};
 	const LayoutItem = (t0) => {
 		const $ = c(9);
-		const { collectionId, labelField, properties, record, children, fallback } = t0;
+		const { collectionId, collection, properties, record, children, fallback } = t0;
 		const editingOwner = React.use(PreviewEditingOwnerContext);
 		let t1;
-		if ($[0] !== collectionId || $[1] !== labelField || $[2] !== record) {
+		if ($[0] !== collection || $[1] !== collectionId || $[2] !== record) {
 			t1 = {
 				collectionId,
-				labelField,
+				collection,
 				loaded: record
 			};
-			$[0] = collectionId;
-			$[1] = labelField;
+			$[0] = collection;
+			$[1] = collectionId;
 			$[2] = record;
 			$[3] = t1;
 		} else t1 = $[3];
@@ -2900,6 +2910,7 @@ function createEditableBlock(options) {
 						settings: settingsDefaults,
 						slot: null,
 						summary: "",
+						title: "",
 						position: "",
 						createdAt: 0,
 						updatedAt: 0

package/dist/core/editing/useLatestRecord.js

@@ -1,7 +1,7 @@
 import { useProjectUuid } from "../../lib/auth.js";
 import { reads, useReadQuery } from "../../lib/studio-reads.js";
 import { latestContent } from "../lib/reference.js";
-import { fieldPlainText } from "../recordItem.js";
+import { recordText } from "../recordItem.js";
 import { c } from "react/compiler-runtime";
 
 //#region src/core/editing/useLatestRecord.ts
@@ -11,7 +11,7 @@ import { c } from "react/compiler-runtime";
 */
 function useLatestRecord(t0) {
 	const $ = c(21);
-	const { collectionId, labelField, loaded } = t0;
+	const { collectionId, collection, loaded } = t0;
 	const projectUuid = useProjectUuid();
 	let t1;
 	if ($[0] !== collectionId || $[1] !== loaded?.id || $[2] !== projectUuid) {
@@ -42,13 +42,13 @@ function useLatestRecord(t0) {
 		let t5;
 		let t6;
 		let updatedAt;
-		if ($[5] !== collectionId || $[6] !== labelField || $[7] !== loaded || $[8] !== saved) {
+		if ($[5] !== collection || $[6] !== collectionId || $[7] !== loaded || $[8] !== saved) {
 			({content, updatedAt} = latestContent(loaded, saved));
 			t4 = loaded.id;
 			t5 = collectionId;
-			t6 = fieldPlainText(content[labelField]);
-			$[5] = collectionId;
-			$[6] = labelField;
+			t6 = recordText(collection, content);
+			$[5] = collection;
+			$[6] = collectionId;
 			$[7] = loaded;
 			$[8] = saved;
 			$[9] = content;
@@ -68,7 +68,7 @@ function useLatestRecord(t0) {
 			t7 = {
 				id: t4,
 				collectionId: t5,
-				label: t6,
+				...t6,
 				content,
 				references: loaded.references,
 				updatedAt

package/dist/core/layoutContext.d.ts

@@ -0,0 +1,55 @@
+import "../lib/locale-path.js";
+//#region src/core/layoutContext.d.ts
+/**
+ * The context every layout `to*` option receives. Each name always means the same thing and is
+ * absent where it doesn't apply: curated pages have no loader, so no `data` or `params`, and only
+ * record pages have `content`.
+ */
+/** The page a layout renders. */
+export interface LayoutPage {
+  /**
+   * The undecorated title: the editor's or generated meta title on curated pages, the layout's
+   * title on singleton and derived pages, the record's title on record pages.
+   */
+  title: string;
+  /**
+   * The editor's or generated description on curated pages, the record's description on record
+   * pages. Absent otherwise.
+   */
+  description: string | undefined;
+  /** The page's path, with its locale's prefix. */
+  path: string;
+  /** The tag of the locale the page renders in, such as `de`. */
+  locale: string;
+  /**
+   * When the page was first published to Live: on record pages, its record. Absent while it was
+   * never published.
+   */
+  firstPublishedAt?: Date;
+  /** When the page was last published to Live: on record pages, its record. */
+  lastPublishedAt?: Date;
+}
+/** The project a page belongs to. */
+export interface LayoutProject {
+  name: string;
+}
+/** What every layout `to*` option knows about a curated page. */
+export interface CuratedLayoutContext {
+  page: LayoutPage;
+  project: LayoutProject;
+}
+/** What every layout `to*` option knows about a singleton or derived page. */
+export interface LoadedLayoutContext<Data = unknown, Params = Record<string, string>> extends CuratedLayoutContext {
+  data: Data;
+  params: Params;
+}
+/**
+ * On record pages, `content` holds the record's values: its String fields as plain text, and its
+ * references as links to their records' Structured Data nodes.
+ */
+export interface RecordLayoutContext<Data = unknown, Params = Record<string, string>, Content = Record<string, unknown>> extends LoadedLayoutContext<Data, Params> {
+  content: Content;
+}
+/** Any layout's context, as the runtime builds it. */
+export type AnyLayoutContext = CuratedLayoutContext & Partial<Pick<RecordLayoutContext, "data" | "params" | "content">>;
+//#endregion

package/dist/core/layoutContext.js

@@ -0,0 +1,66 @@
+import { localizedPath } from "../lib/locale-path.js";
+
+//#region src/core/layoutContext.ts
+/**
+* A curated page's undecorated title: its meta title, or its nickname while it has none, such as
+* before its meta title is generated. Everything naming a curated page names it by this.
+*/
+function curatedPageTitle(page) {
+	return page.metaTitle || page.nickname;
+}
+/** A curated page's context, from its editor metadata. Its path keeps its locale's prefix. */
+function curatedLayoutContext(structure, locale) {
+	const { page } = structure;
+	return buildLayoutContext({
+		kind: "curated",
+		title: ""
+	}, {
+		metaTitle: curatedPageTitle(page),
+		description: page.metaDescription ?? void 0,
+		path: localizedPath(page.fullPath, locale),
+		locale: locale.tag,
+		projectName: structure.projectName,
+		published: {
+			first: page.firstPublishedAt,
+			last: page.publishedAt
+		}
+	});
+}
+/** A page's publish times as its context holds them: dates, absent when unknown. */
+function publishDates(published) {
+	return {
+		...published?.first != null && { firstPublishedAt: new Date(published.first) },
+		...published?.last != null && { lastPublishedAt: new Date(published.last) }
+	};
+}
+/** The context a layout's `to*` options receive on a page. */
+function buildLayoutContext(layout, source) {
+	const project = { name: source.projectName };
+	const page = {
+		path: source.path,
+		locale: source.locale,
+		...publishDates(source.record?.published ?? source.published)
+	};
+	if (layout.kind === "curated") return {
+		page: {
+			title: source.metaTitle ?? "",
+			description: source.description,
+			...page
+		},
+		project
+	};
+	return {
+		page: {
+			title: source.record?.title ?? layout.title,
+			description: source.record?.description,
+			...page
+		},
+		project,
+		data: source.data,
+		params: source.params ?? {},
+		...source.record && { content: source.record.content }
+	};
+}
+
+//#endregion
+export { buildLayoutContext, curatedLayoutContext, curatedPageTitle };