@aphexcms/cms-core 6.0.0 → 8.0.0

package/dist/components/AdminApp.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AdminApp.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/components/AdminApp.svelte.ts"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACjD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AA4BnE,UAAU,KAAK;IACd,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,aAAa,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC5E,WAAW,CAAC,EAAE;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,cAAc,EAAE,OAAO,CAAA;KAAE,GAAG,IAAI,CAAC;IACvE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,SAAS,CAAC,EAAE;QAAE,KAAK,EAAE,WAAW,GAAG,QAAQ,GAAG,OAAO,CAAA;KAAE,CAAC;IACxD,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,eAAe,CAAC,EAAE,sBAAsB,GAAG,IAAI,CAAC;CAChD;AA0/CF,QAAA,MAAM,QAAQ,2CAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"AdminApp.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/components/AdminApp.svelte.ts"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACjD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AA4BnE,UAAU,KAAK;IACd,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,aAAa,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC5E,WAAW,CAAC,EAAE;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,cAAc,EAAE,OAAO,CAAA;KAAE,GAAG,IAAI,CAAC;IACvE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,SAAS,CAAC,EAAE;QAAE,KAAK,EAAE,WAAW,GAAG,QAAQ,GAAG,OAAO,CAAA;KAAE,CAAC;IACxD,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,eAAe,CAAC,EAAE,sBAAsB,GAAG,IAAI,CAAC;CAChD;AAkhDF,QAAA,MAAM,QAAQ,2CAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}

package/dist/components/admin/DocumentEditor.svelte

@@ -13,6 +13,8 @@
 	import { setSaveStateContext } from '../../save-state-context.svelte';
 	import { usePermissions } from '../../permissions-context.svelte';
 	import { getDefaultValueForFieldType } from '../../utils/field-defaults';
+	import { notifyDocumentChanged } from '../../document-refresh.svelte';
+	import { collectReferenceIds } from '../../utils/reference-walk';
 	import { cmsLogger } from '../../utils/logger';
 	import { toast } from 'svelte-sonner';
 	import { confirmDialog } from './confirm-dialog/confirm-dialog.svelte';
@@ -645,6 +647,7 @@
 			if (response?.success) {
 				lastSaved = new Date();
 				hasUnsavedChanges = false;
+				if (response.data?.id) notifyDocumentChanged(response.data.id);
 				if (isAutoSave) {
 					// Trigger validation on all fields after auto-save
 					validateAllFields(); // Update validation status
@@ -716,6 +719,47 @@
 			return;
 		}
 
+		// Referential integrity guard: every referenced document must itself be
+		// published. Without this, publishing a doc that points at drafts would
+		// expose dangling references in the published perspective. One batched
+		// HTTP call regardless of ref count.
+		const refIds = collectReferenceIds(documentData, schema, schemas);
+		if (refIds.length > 0) {
+			let fetched: any[] = [];
+			try {
+				const res = await documents.getMany(refIds);
+				if (res.success && res.data) fetched = res.data;
+			} catch {
+				// fall through — missing fetched IDs become "blockers" below
+			}
+			const fetchedById = new Map(fetched.map((d) => [d.id, d]));
+			const checks = refIds.map((id) => ({ id, doc: fetchedById.get(id) ?? null }));
+			const blockers = checks.filter(
+				(c) => !c.doc || (c.doc as any)._meta?.status !== 'published'
+			);
+			if (blockers.length > 0) {
+				const titles = blockers
+					.slice(0, 3)
+					.map((b) => {
+						if (!b.doc) return `Missing (${b.id.slice(0, 8)})`;
+						const d = b.doc as any;
+						const label = d.title ?? d.name ?? d.heading ?? d.label ?? b.id;
+						const type = d._meta?.type;
+						return type ? `"${label}" (${type})` : `"${label}"`;
+					})
+					.join(', ');
+				const remainder = blockers.length > 3 ? ` and ${blockers.length - 3} more` : '';
+				saveError = `Cannot publish — unpublished references: ${titles}${remainder}`;
+				toast.error(
+					`${blockers.length} referenced document${blockers.length === 1 ? '' : 's'} ${blockers.length === 1 ? 'is' : 'are'} not published`,
+					{
+						description: 'Publish the referenced documents first, then try again.'
+					}
+				);
+				return;
+			}
+		}
+
 		saving = true;
 		saveError = null;
 
@@ -733,6 +777,7 @@
 				fullDocument = response.data;
 				lastSaved = new Date();
 				publishSuccess = new Date();
+				notifyDocumentChanged(documentId);
 				cmsLogger.debug('[Document Editor]', '✅ Document published successfully');
 				cmsLogger.debug('[Document Editor]', '📄 New published hash:', response.data.publishedHash);
 
@@ -790,10 +835,27 @@
 	async function unpublishDocument() {
 		if (!documentId || saving) return;
 
+		// Surface published back-references so the user knows what will end up
+		// with dangling refs in the published perspective. Best-effort —
+		// network errors fall through to the standard confirm.
+		let backRefDescription =
+			'It will be removed from published queries, but the data is preserved and you can re-publish anytime.';
+		try {
+			const backRefRes = await documents.getBackReferences(documentId);
+			if (backRefRes.success && backRefRes.data) {
+				const publishedBackRefs = backRefRes.data.filter((r) => r.status === 'published');
+				if (publishedBackRefs.length > 0) {
+					const count = publishedBackRefs.length;
+					backRefDescription = `${count} published document${count === 1 ? '' : 's'} reference${count === 1 ? 's' : ''} this one — their references will be left dangling in the published perspective until you re-publish them. Continue?`;
+				}
+			}
+		} catch {
+			// Silently fall through to the generic confirm; ref index may be unpopulated.
+		}
+
 		const confirmUnpublish = await confirmDialog({
 			title: 'Unpublish this document?',
-			description:
-				'It will be removed from published queries, but the data is preserved and you can re-publish anytime.',
+			description: backRefDescription,
 			confirmText: 'Unpublish',
 			variant: 'destructive'
 		});
@@ -809,6 +871,7 @@
 					...fullDocument,
 					_meta: { ...fullDocument?._meta, status: 'unpublished' }
 				};
+				notifyDocumentChanged(documentId);
 				toast.success('Document unpublished — you can re-publish anytime');
 				if (onUnpublished && documentId) {
 					onUnpublished(documentId);

package/dist/components/admin/DocumentEditor.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DocumentEditor.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/admin/DocumentEditor.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAaxD,UAAU,KAAK;IACd,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,WAAW,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1D,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,WAAW,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,aAAa,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,UAAU,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,eAAe,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IACrE,oBAAoB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,sBAAsB,CAAC,EAAE;QACxB,aAAa,EAAE,MAAM,CAAC;QACtB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;QAC1B,SAAS,EAAE,MAAM,CAAC;QAClB,SAAS,CAAC,EAAE,MAAM,CAAC;KACnB,GAAG,IAAI,CAAC;IACT,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,2EAA2E;IAC3E,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,6EAA6E;IAC7E,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAm+CF,QAAA,MAAM,cAAc,2CAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}
+{"version":3,"file":"DocumentEditor.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/admin/DocumentEditor.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAexD,UAAU,KAAK;IACd,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,WAAW,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1D,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,WAAW,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,aAAa,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,UAAU,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,eAAe,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IACrE,oBAAoB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,sBAAsB,CAAC,EAAE;QACxB,aAAa,EAAE,MAAM,CAAC;QACtB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;QAC1B,SAAS,EAAE,MAAM,CAAC;QAClB,SAAS,CAAC,EAAE,MAAM,CAAC;KACnB,GAAG,IAAI,CAAC;IACT,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,2EAA2E;IAC3E,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,6EAA6E;IAC7E,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAkiDF,QAAA,MAAM,cAAc,2CAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}

package/dist/components/admin/confirm-dialog/ConfirmDialogHost.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import * as AlertDialog from '@aphexcms/ui/shadcn/alert-dialog';
-	import { Button } from '@aphexcms/ui/shadcn/button';
+	import { buttonVariants } from '@aphexcms/ui/shadcn/button';
 	import { confirmDialogState, resolveConfirmDialog } from './confirm-dialog.svelte';
 
 	function handleOpenChange(open: boolean) {
@@ -21,15 +21,17 @@
 			{/if}
 		</AlertDialog.Header>
 		<AlertDialog.Footer>
-			<Button variant="outline" onclick={() => resolveConfirmDialog(false)}>
+			<AlertDialog.Cancel onclick={() => resolveConfirmDialog(false)}>
 				{confirmDialogState.cancelText}
-			</Button>
-			<Button
-				variant={confirmDialogState.variant === 'destructive' ? 'destructive' : 'default'}
+			</AlertDialog.Cancel>
+			<AlertDialog.Action
+				class={confirmDialogState.variant === 'destructive'
+					? buttonVariants({ variant: 'destructive' })
+					: undefined}
 				onclick={() => resolveConfirmDialog(true)}
 			>
 				{confirmDialogState.confirmText}
-			</Button>
+			</AlertDialog.Action>
 		</AlertDialog.Footer>
 	</AlertDialog.Content>
 </AlertDialog.Root>

package/dist/components/admin/confirm-dialog/ConfirmDialogHost.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConfirmDialogHost.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/admin/confirm-dialog/ConfirmDialogHost.svelte.ts"],"names":[],"mappings":"AA0CA,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,iBAAiB;;kBAA+E,CAAC;AACrF,KAAK,iBAAiB,GAAG,YAAY,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAClE,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"ConfirmDialogHost.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/admin/confirm-dialog/ConfirmDialogHost.svelte.ts"],"names":[],"mappings":"AA4CA,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,iBAAiB;;kBAA+E,CAAC;AACrF,KAAK,iBAAiB,GAAG,YAAY,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAClE,eAAe,iBAAiB,CAAC"}

package/dist/components/admin/fields/ArrayField.svelte

@@ -10,6 +10,7 @@
 	import { getSchemaContext } from '../../../schema-context.svelte';
 	import ObjectModal from '../ObjectModal.svelte';
 	import ImageField from './ImageField.svelte';
+	import ReferenceField from './ReferenceField.svelte';
 	import { getDefaultValueForFieldType } from '../../../utils/field-defaults';
 	import { DragDropProvider } from '@dnd-kit/svelte';
 	import { createSortable, isSortable } from '@dnd-kit/svelte/sortable';
@@ -29,6 +30,9 @@
 	import { toast } from 'svelte-sonner';
 	import AssetBrowserModal from '../AssetBrowserModal.svelte';
 	import { resolvePreviewTitle, resolvePreviewSubtitle } from '../../../utils/preview';
+	import { documents } from '../../../api/documents';
+	import { SvelteMap } from 'svelte/reactivity';
+	import { getDocumentVersion } from '../../../document-refresh.svelte';
 
 	interface Props {
 		field: ArrayFieldType;
@@ -70,8 +74,12 @@
 	}
 
 	const isGridLayout = $derived(field.options?.layout === 'grid');
+	const isReferenceArray = $derived(
+		field.of && field.of.length > 0 && field.of[0]?.type === 'reference'
+	);
 	const isPrimitiveArray = $derived(
-		field.of &&
+		!isReferenceArray &&
+			field.of &&
 			field.of.length > 0 &&
 			field.of[0]?.type &&
 			!field.of[0].fields &&
@@ -80,6 +88,48 @@
 	const primitiveType = $derived(isPrimitiveArray ? field.of?.[0]?.type : null);
 	const availableTypes = $derived(getArrayTypes(schemas, field));
 
+	// Synthetic ReferenceField definition reused for every row in an
+	// array-of-references. We forward the array's first `of[]` entry's `to` so
+	// the row picker honors the schema-author's allowed target types.
+	const referenceFieldShape = $derived(
+		isReferenceArray
+			? {
+					name: field.name,
+					type: 'reference' as const,
+					title: field.title,
+					to: (field.of?.[0] as any)?.to ?? []
+				}
+			: null
+	);
+
+	// Batched hydration cache for reference rows. Without this, each row's
+	// ReferenceField fires its own getById on mount → N round-trips for an
+	// array of N refs. Instead we fetch all populated refs in a single call
+	// and hand each row its preloaded doc. The cache invalidates whenever
+	// any row's referenced doc bumps its document-refresh version.
+	const referenceCache = new SvelteMap<string, any>();
+	$effect(() => {
+		if (!isReferenceArray) return;
+		const ids = (Array.isArray(value) ? value : [])
+			.map((item: any) => item?._ref)
+			.filter((id: any): id is string => typeof id === 'string' && id.length > 0);
+		if (ids.length === 0) return;
+		// Subscribe to each id's version so external saves trigger a refetch.
+		for (const id of ids) getDocumentVersion(id);
+		(async () => {
+			try {
+				const res = await documents.getMany(ids);
+				if (res.success && res.data) {
+					for (const doc of res.data as any[]) {
+						if (doc?.id) referenceCache.set(doc.id, doc);
+					}
+				}
+			} catch {
+				// Per-row ReferenceField will fall back to its own fetch on miss.
+			}
+		})();
+	});
+
 	// Modal state
 	let modalOpen = $state(false);
 	let editingIndex = $state<number | null>(null);
@@ -376,6 +426,29 @@
 		onUpdate(newArray);
 	}
 
+	// Reference array — append an empty reference row. The row renders the
+	// ReferenceField empty state (search picker), so the user picks the target
+	// document inline without an extra modal step.
+	function handleAddReference() {
+		if (readonly) return;
+		const newItem = { _type: 'reference', _key: generateKey(), _ref: null };
+		onUpdate([...keyedItems, newItem]);
+	}
+
+	function handleUpdateReference(
+		index: number,
+		newRef: { _type: 'reference'; _ref: string; _key?: string } | null
+	) {
+		if (readonly) return;
+		const newArray = [...keyedItems];
+		// Preserve the row's _key (stable across drag/drop) and only swap the _ref.
+		newArray[index] = {
+			...newArray[index],
+			_ref: newRef?._ref ?? null
+		};
+		onUpdate(newArray);
+	}
+
 	// Write-through: propagate every field change from the modal to the array immediately
 	function handleModalUpdate(updatedData: Record<string, any>) {
 		if (editingIndex === null || !editingType) return;
@@ -421,7 +494,81 @@
 	}
 </script>
 
-{#if isPrimitiveArray}
+{#if isReferenceArray && referenceFieldShape}
+	<!-- Reference array — each row reuses ReferenceField. Drag handle on the
+	     left, ReferenceField fills the row, an X button on empty rows lets the
+	     user discard a never-picked row (populated rows use ReferenceField's
+	     own context menu, which we override via onRemove to drop the row). -->
+	{#if keyedItems.length > 0}
+		{#key dndKey}
+			<DragDropProvider onDragEnd={handleDragEnd}>
+				<div class="space-y-1">
+					{#each keyedItems as item, index (item._key)}
+						{@const sortable = createSortable({ id: item._key, index, disabled: readonly })}
+						<div
+							{@attach sortable.attach}
+							class="flex items-center gap-1"
+							class:opacity-50={sortable.isDragging}
+						>
+							{#if !readonly}
+								<button
+									{@attach sortable.attachHandle}
+									class="text-muted-foreground hover:text-foreground flex h-9 w-7 shrink-0 cursor-grab items-center justify-center active:cursor-grabbing"
+								>
+									<GripVertical class="h-4 w-4" />
+								</button>
+							{/if}
+							<div class="min-w-0 flex-1">
+								<ReferenceField
+									field={referenceFieldShape}
+									value={item._ref ? { _type: 'reference', _ref: item._ref } : null}
+									onUpdate={(newRef) => handleUpdateReference(index, newRef)}
+									{onOpenReference}
+									{readonly}
+									onRemove={() => handleRemoveItem(index)}
+									preloadedDoc={item._ref ? referenceCache.get(item._ref) : undefined}
+								/>
+							</div>
+							{#if !readonly && !item._ref}
+								<DropdownMenu.Root>
+									<DropdownMenu.Trigger>
+										{#snippet child({ props })}
+											<button
+												{...props}
+												class="text-muted-foreground hover:text-foreground flex h-9 w-7 shrink-0 items-center justify-center rounded transition-colors"
+												aria-label="Row options"
+											>
+												<Ellipsis class="h-4 w-4" />
+											</button>
+										{/snippet}
+									</DropdownMenu.Trigger>
+									<DropdownMenu.Content align="end">
+										<DropdownMenu.Item
+											class="text-destructive focus:text-destructive"
+											onclick={() => handleRemoveItem(index)}
+										>
+											<Trash2 class="mr-2 h-4 w-4" />
+											Remove
+										</DropdownMenu.Item>
+									</DropdownMenu.Content>
+								</DropdownMenu.Root>
+							{/if}
+						</div>
+					{/each}
+				</div>
+			</DragDropProvider>
+		{/key}
+	{/if}
+	{#if !readonly}
+		<button
+			class="border-border/50 text-muted-foreground hover:text-foreground hover:bg-muted/50 mt-1 flex h-10 w-full items-center justify-center gap-2 rounded border border-dashed text-sm transition-colors"
+			onclick={handleAddReference}
+		>
+			<Plus class="h-4 w-4" />
+			Add reference...
+		</button>
+	{/if}
+{:else if isPrimitiveArray}
 	<!-- Primitive array UI with DnD -->
 	{#if arrayValue.length === 0}
 		<div

package/dist/components/admin/fields/ArrayField.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ArrayField.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/admin/fields/ArrayField.svelte.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,UAAU,IAAI,cAAc,EAAc,MAAM,wBAAwB,CAAC;AA0BtF,UAAU,KAAK;IACd,KAAK,EAAE,cAAc,CAAC;IACtB,KAAK,EAAE,GAAG,CAAC;IACX,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IAC/B,eAAe,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;CACxB;AA8xBF,QAAA,MAAM,UAAU,2CAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}
+{"version":3,"file":"ArrayField.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/admin/fields/ArrayField.svelte.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,UAAU,IAAI,cAAc,EAAc,MAAM,wBAAwB,CAAC;AA8BtF,UAAU,KAAK;IACd,KAAK,EAAE,cAAc,CAAC;IACtB,KAAK,EAAE,GAAG,CAAC;IACX,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IAC/B,eAAe,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;CACxB;AAq5BF,QAAA,MAAM,UAAU,2CAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}