@aphexcms/cms-core 9.0.0 → 9.1.0

package/dist/components/admin/DocumentEditor.svelte

@@ -68,6 +68,7 @@
 	}: Props = $props();
 
 	// Set schema context for child components (ArrayField, etc.)
+	// svelte-ignore state_referenced_locally
 	setSchemaContext(schemas);
 
 	// Read permissions from the AdminApp context for per-action gating.
@@ -181,6 +182,7 @@
 		return str.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
 	}
 	let inspectTab = $state<'parsed' | 'raw'>('parsed');
+	let inspectPerspective = $state<'draft' | 'published'>('draft');
 
 	// Header options dropdown
 	let showHeaderMenu = $state(false);
@@ -1027,7 +1029,7 @@
 <div class="relative flex h-full w-full min-w-0 flex-col overflow-hidden">
 	<!-- Hero Header -->
 	<div class="bg-background w-full min-w-0 overflow-x-clip px-4 pt-4 pb-5 lg:px-6 lg:pt-5">
-		<div class="mx-auto w-full max-w-3xl">
+		<div class="w-full">
 			<!-- Top row: breadcrumb + actions -->
 			<div class="mb-4 flex items-center justify-between gap-3">
 				<div
@@ -1121,7 +1123,7 @@
 							</Button>
 							{#if showHeaderMenu}
 								<div
-									class="bg-background border-rule absolute top-full right-0 z-50 mt-1 min-w-[160px] rounded-md border py-1 shadow-lg"
+									class="bg-background border-rule absolute top-full right-0 z-[60] mt-1 min-w-[160px] rounded-md border py-1 shadow-lg"
 								>
 									<button
 										onclick={() => {
@@ -1146,7 +1148,9 @@
 										<Code class="h-3.5 w-3.5" /> Inspect
 									</button>
 								</div>
-								<div class="fixed inset-0 z-40" onclick={() => (showHeaderMenu = false)}></div>
+								<!-- svelte-ignore a11y_click_events_have_key_events -->
+								<!-- svelte-ignore a11y_no_static_element_interactions -->
+								<div class="fixed inset-0 z-[55]" onclick={() => (showHeaderMenu = false)}></div>
 							{/if}
 						</div>
 					{/if}
@@ -1231,181 +1235,184 @@
 	</div>
 
 	<!-- Content Form -->
-	<div class="flex-1 overflow-auto p-4 lg:p-6">
-		<div class="mx-auto w-full max-w-3xl space-y-4 lg:space-y-6">
-			{#if saveError}
-				<div class="bg-destructive/10 border-destructive/20 rounded-md border p-3">
-					<p class="text-destructive text-sm">{saveError}</p>
-				</div>
-			{/if}
-
-			{#if schemaError}
-				<div class="bg-destructive/10 border-destructive/20 rounded-md border p-3">
-					<p class="text-destructive text-sm">Schema Error: {schemaError}</p>
-				</div>
-			{:else if schemaLoading}
-				<div class="p-6 text-center">
-					<div class="text-muted-foreground text-sm">Loading schema...</div>
-				</div>
-			{:else if schema}
-				<!-- Orphaned Fields Warning -->
-				{#if showOrphanedFields && orphanedFields.length > 0}
-					<div class="space-y-3 rounded-md border border-orange-200 bg-orange-50 p-4">
-						<div class="flex items-center gap-2">
-							<svg
-								class="h-5 w-5 text-orange-600"
-								fill="none"
-								viewBox="0 0 24 24"
-								stroke="currentColor"
-							>
-								<path
-									stroke-linecap="round"
-									stroke-linejoin="round"
-									stroke-width="2"
-									d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L5.081 16.5c-.77.833.192 2.5 1.732 2.5z"
-								/>
-							</svg>
-							<h4 class="text-sm font-medium text-orange-800">
-								{orphanedFields.length} orphaned field{orphanedFields.length === 1 ? '' : 's'} detected
-							</h4>
-						</div>
-
-						<p class="text-sm text-orange-700">
-							These fields exist in your document but are no longer defined in the schema:
-						</p>
+	<div data-document-editor class="relative flex min-h-0 flex-1 flex-col">
+		<div class="flex flex-1 flex-col overflow-auto p-4 lg:p-6">
+			<div class="flex w-full flex-1 flex-col gap-4 lg:gap-6">
+				{#if saveError}
+					<div class="bg-destructive/10 border-destructive/20 rounded-md border p-3">
+						<p class="text-destructive text-sm">{saveError}</p>
+					</div>
+				{/if}
 
-						<div class="space-y-2">
-							{#each orphanedFields as field, index (index)}
-								<div
-									class="flex items-center justify-between rounded border border-orange-200 bg-white p-3"
+				{#if schemaError}
+					<div class="bg-destructive/10 border-destructive/20 rounded-md border p-3">
+						<p class="text-destructive text-sm">Schema Error: {schemaError}</p>
+					</div>
+				{:else if schemaLoading}
+					<div class="p-6 text-center">
+						<div class="text-muted-foreground text-sm">Loading schema...</div>
+					</div>
+				{:else if schema}
+					<!-- Orphaned Fields Warning -->
+					{#if showOrphanedFields && orphanedFields.length > 0}
+						<div class="space-y-3 rounded-md border border-orange-200 bg-orange-50 p-4">
+							<div class="flex items-center gap-2">
+								<svg
+									class="h-5 w-5 text-orange-600"
+									fill="none"
+									viewBox="0 0 24 24"
+									stroke="currentColor"
 								>
-									<div class="flex-1">
-										<div class="font-mono text-sm font-medium text-orange-800">
-											{field.path || field.key}
-										</div>
-										<div class="mt-1 text-xs text-orange-600">
-											<code class="rounded bg-orange-100 px-1">{JSON.stringify(field.value)}</code>
+									<path
+										stroke-linecap="round"
+										stroke-linejoin="round"
+										stroke-width="2"
+										d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L5.081 16.5c-.77.833.192 2.5 1.732 2.5z"
+									/>
+								</svg>
+								<h4 class="text-sm font-medium text-orange-800">
+									{orphanedFields.length} orphaned field{orphanedFields.length === 1 ? '' : 's'} detected
+								</h4>
+							</div>
+
+							<p class="text-sm text-orange-700">
+								These fields exist in your document but are no longer defined in the schema:
+							</p>
+
+							<div class="space-y-2">
+								{#each orphanedFields as field, index (index)}
+									<div
+										class="flex items-center justify-between rounded border border-orange-200 bg-white p-3"
+									>
+										<div class="flex-1">
+											<div class="font-mono text-sm font-medium text-orange-800">
+												{field.path || field.key}
+											</div>
+											<div class="mt-1 text-xs text-orange-600">
+												<code class="rounded bg-orange-100 px-1">{JSON.stringify(field.value)}</code
+												>
+											</div>
 										</div>
+										<Button
+											size="sm"
+											variant="outline"
+											onclick={() => removeOrphanedField(field)}
+											class="ml-3 h-8 border-red-200 px-3 text-red-600 hover:border-red-300 hover:bg-red-50"
+										>
+											Remove
+										</Button>
 									</div>
-									<Button
-										size="sm"
-										variant="outline"
-										onclick={() => removeOrphanedField(field)}
-										class="ml-3 h-8 border-red-200 px-3 text-red-600 hover:border-red-300 hover:bg-red-50"
-									>
-										Remove
-									</Button>
-								</div>
-							{/each}
-						</div>
-
-						<div class="flex gap-2 border-t border-orange-200 pt-2">
-							<Button
-								size="sm"
-								variant="outline"
-								onclick={cleanupAllOrphanedFields}
-								class="border-orange-600 bg-orange-600 text-white hover:bg-orange-700"
-							>
-								Remove All
-							</Button>
-							<Button
-								size="sm"
-								variant="ghost"
-								onclick={dismissOrphanedFields}
-								class="text-orange-700 hover:text-orange-800"
-							>
-								Dismiss
-							</Button>
+								{/each}
+							</div>
+
+							<div class="flex gap-2 border-t border-orange-200 pt-2">
+								<Button
+									size="sm"
+									variant="outline"
+									onclick={cleanupAllOrphanedFields}
+									class="border-orange-600 bg-orange-600 text-white hover:bg-orange-700"
+								>
+									Remove All
+								</Button>
+								<Button
+									size="sm"
+									variant="ghost"
+									onclick={dismissOrphanedFields}
+									class="text-orange-700 hover:text-orange-800"
+								>
+									Dismiss
+								</Button>
+							</div>
 						</div>
-					</div>
-				{/if}
+					{/if}
 
-				<!-- Field Group Tabs -->
-				{#if schema.groups && schema.groups.length > 0}
-					{@const visibleGroups = schema.groups.filter((g) => !g.hidden)}
-					<div class="mb-4 flex items-center gap-1 overflow-x-auto py-1">
-						<button
-							type="button"
-							onclick={() => (activeGroup = 'all')}
-							class="cursor-pointer rounded-md px-3 py-1.5 text-sm font-medium whitespace-nowrap transition-colors {activeGroup ===
-							'all'
-								? 'bg-muted text-foreground'
-								: 'text-muted-foreground hover:text-foreground'}"
-						>
-							All fields
-						</button>
-						{#each visibleGroups as group (group.name)}
+					<!-- Field Group Tabs -->
+					{#if schema.groups && schema.groups.length > 0}
+						{@const visibleGroups = schema.groups.filter((g) => !g.hidden)}
+						<div class="mb-4 flex items-center gap-1 overflow-x-auto py-1">
 							<button
 								type="button"
-								onclick={() => (activeGroup = group.name)}
-								class="flex cursor-pointer items-center gap-1.5 rounded-md px-3 py-1.5 text-sm font-medium whitespace-nowrap transition-colors {activeGroup ===
-								group.name
+								onclick={() => (activeGroup = 'all')}
+								class="cursor-pointer rounded-md px-3 py-1.5 text-sm font-medium whitespace-nowrap transition-colors {activeGroup ===
+								'all'
 									? 'bg-muted text-foreground'
 									: 'text-muted-foreground hover:text-foreground'}"
 							>
-								{#if group.icon}
-									{@const Icon = group.icon}
-									<Icon class="h-4 w-4" />
-								{/if}
-								{group.title}
+								All fields
 							</button>
+							{#each visibleGroups as group (group.name)}
+								<button
+									type="button"
+									onclick={() => (activeGroup = group.name)}
+									class="flex cursor-pointer items-center gap-1.5 rounded-md px-3 py-1.5 text-sm font-medium whitespace-nowrap transition-colors {activeGroup ===
+									group.name
+										? 'bg-muted text-foreground'
+										: 'text-muted-foreground hover:text-foreground'}"
+								>
+									{#if group.icon}
+										{@const Icon = group.icon}
+										<Icon class="h-4 w-4" />
+									{/if}
+									{group.title}
+								</button>
+							{/each}
+						</div>
+					{/if}
+
+					<!-- Dynamic Schema Fields -->
+					<svelte:boundary
+						onerror={(error) =>
+							cmsLogger.error('[DocumentEditor]', 'Error in editor content:', error)}
+					>
+						{#each schema.fields.filter((f) => fieldInGroup(f, activeGroup) && !hiddenFieldNames.has(f.name)) as field (field.name)}
+							{@const viewData =
+								isPreviewingVersion && activePreview
+									? activePreview.data
+									: isViewingPublished && publishedData
+										? publishedData
+										: documentData}
+							<SchemaField
+								{field}
+								value={viewData[field.name]}
+								documentData={viewData}
+								onUpdate={(newValue) => {
+									if (isViewingPublished) return;
+									documentData = { ...documentData, [field.name]: newValue };
+									hasUnsavedChanges = true;
+								}}
+								{onOpenReference}
+								schemaType={documentType}
+								readonly={isReadOnly ||
+									isViewingPublished ||
+									isPreviewingVersion ||
+									isFieldReadonly(field.name)}
+								organizationId={fullDocument?._meta?.organizationId}
+							/>
 						{/each}
+
+						{#snippet failed(error, reset)}
+							<div class="border-destructive/30 bg-destructive/5 rounded-md border p-4 text-center">
+								<p class="text-destructive font-medium">Document editor encountered an error</p>
+								<p class="text-muted-foreground mt-1 text-sm">
+									{error instanceof Error ? error.message : 'Unknown error'}
+								</p>
+								<button
+									class="bg-primary text-primary-foreground mt-3 rounded px-4 py-2 text-sm"
+									onclick={reset}
+								>
+									Reload editor
+								</button>
+							</div>
+						{/snippet}
+					</svelte:boundary>
+				{:else}
+					<div class="border-muted-foreground/30 rounded-md border border-dashed p-4">
+						<p class="text-muted-foreground text-center text-sm">
+							No schema found for document type: {documentType}
+						</p>
 					</div>
 				{/if}
-
-				<!-- Dynamic Schema Fields -->
-				<svelte:boundary
-					onerror={(error) =>
-						cmsLogger.error('[DocumentEditor]', 'Error in editor content:', error)}
-				>
-					{#each schema.fields.filter((f) => fieldInGroup(f, activeGroup) && !hiddenFieldNames.has(f.name)) as field (field.name)}
-						{@const viewData =
-							isPreviewingVersion && activePreview
-								? activePreview.data
-								: isViewingPublished && publishedData
-									? publishedData
-									: documentData}
-						<SchemaField
-							{field}
-							value={viewData[field.name]}
-							documentData={viewData}
-							onUpdate={(newValue) => {
-								if (isViewingPublished) return;
-								documentData = { ...documentData, [field.name]: newValue };
-								hasUnsavedChanges = true;
-							}}
-							{onOpenReference}
-							schemaType={documentType}
-							readonly={isReadOnly ||
-								isViewingPublished ||
-								isPreviewingVersion ||
-								isFieldReadonly(field.name)}
-							organizationId={fullDocument?._meta?.organizationId}
-						/>
-					{/each}
-
-					{#snippet failed(error, reset)}
-						<div class="border-destructive/30 bg-destructive/5 rounded-md border p-4 text-center">
-							<p class="text-destructive font-medium">Document editor encountered an error</p>
-							<p class="text-muted-foreground mt-1 text-sm">
-								{error instanceof Error ? error.message : 'Unknown error'}
-							</p>
-							<button
-								class="bg-primary text-primary-foreground mt-3 rounded px-4 py-2 text-sm"
-								onclick={reset}
-							>
-								Reload editor
-							</button>
-						</div>
-					{/snippet}
-				</svelte:boundary>
-			{:else}
-				<div class="border-muted-foreground/30 rounded-md border border-dashed p-4">
-					<p class="text-muted-foreground text-center text-sm">
-						No schema found for document type: {documentType}
-					</p>
-				</div>
-			{/if}
+			</div>
 		</div>
 	</div>
 
@@ -1547,6 +1554,7 @@
 					showVersionHistory = false;
 					previewingVersion = null;
 				}}
+				aria-label="Close version history"
 			></button>
 			<!-- Panel -->
 			<div class="bg-background border-rule flex w-80 flex-col border-l shadow-lg">
@@ -1558,6 +1566,7 @@
 							showVersionHistory = false;
 							previewingVersion = null;
 						}}
+						aria-label="Close version history"
 					>
 						<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
 							<path
@@ -1658,54 +1667,76 @@
 				</div>
 
 				<!-- Tabs -->
-				<div class="flex border-b">
-					<button
-						class="px-4 py-2 text-sm font-medium transition-colors {inspectTab === 'parsed'
-							? 'border-primary text-foreground border-b-2'
-							: 'text-muted-foreground hover:text-foreground'}"
-						onclick={() => (inspectTab = 'parsed')}
-					>
-						Parsed
-					</button>
-					<button
-						class="px-4 py-2 text-sm font-medium transition-colors {inspectTab === 'raw'
-							? 'border-primary text-foreground border-b-2'
-							: 'text-muted-foreground hover:text-foreground'}"
-						onclick={() => (inspectTab = 'raw')}
-					>
-						Raw JSON
-					</button>
+				<div class="flex items-center justify-between border-b">
+					<div class="flex">
+						<button
+							class="px-4 py-2 text-sm font-medium transition-colors {inspectTab === 'parsed'
+								? 'border-primary text-foreground border-b-2'
+								: 'text-muted-foreground hover:text-foreground'}"
+							onclick={() => (inspectTab = 'parsed')}
+						>
+							Parsed
+						</button>
+						<button
+							class="px-4 py-2 text-sm font-medium transition-colors {inspectTab === 'raw'
+								? 'border-primary text-foreground border-b-2'
+								: 'text-muted-foreground hover:text-foreground'}"
+							onclick={() => (inspectTab = 'raw')}
+						>
+							Raw JSON
+						</button>
+					</div>
+					<div class="flex gap-1 pr-2">
+						<button
+							class="rounded px-2 py-1 text-xs font-medium transition-colors {inspectPerspective ===
+							'draft'
+								? 'bg-muted text-foreground'
+								: 'text-muted-foreground hover:text-foreground'}"
+							onclick={() => (inspectPerspective = 'draft')}
+						>
+							Draft
+						</button>
+						<button
+							class="rounded px-2 py-1 text-xs font-medium transition-colors {inspectPerspective ===
+							'published'
+								? 'bg-muted text-foreground'
+								: 'text-muted-foreground hover:text-foreground'}"
+							onclick={() => (inspectPerspective = 'published')}
+						>
+							Published
+						</button>
+					</div>
 				</div>
 
 				<!-- Content -->
 				<div class="flex-1 overflow-auto p-4 font-mono text-sm">
-					{#if inspectTab === 'raw'}
-						<pre
-							class="text-xs break-all whitespace-pre-wrap select-text"
-							tabindex="0"
-							onkeydown={(e) => {
-								if ((e.metaKey || e.ctrlKey) && e.key === 'a') {
-									e.preventDefault();
-									e.stopPropagation();
-									const sel = window.getSelection();
-									const range = document.createRange();
-									range.selectNodeContents(e.currentTarget);
-									sel?.removeAllRanges();
-									sel?.addRange(range);
-								}
-							}}>{@html syntaxHighlightJson(
-								JSON.stringify(
-									{ id: documentId, _meta: fullDocument?._meta, ...documentData },
-									null,
-									2
-								)
-							)}</pre>
+					{#if inspectPerspective === 'published' && !publishedData}
+						<p class="text-muted-foreground text-sm">No published data available.</p>
 					{:else}
-						{@render parsedValue(
-							null,
-							{ id: documentId, _meta: fullDocument?._meta, ...documentData },
-							0
-						)}
+						{@const inspectData =
+							inspectPerspective === 'published' && publishedData
+								? { id: documentId, _meta: fullDocument?._meta, ...publishedData }
+								: { id: documentId, _meta: fullDocument?._meta, ...documentData }}
+						{#if inspectTab === 'raw'}
+							<!-- svelte-ignore a11y_no_noninteractive_tabindex -->
+							<!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
+							<pre
+								class="text-xs break-all whitespace-pre-wrap select-text"
+								tabindex="0"
+								onkeydown={(e) => {
+									if ((e.metaKey || e.ctrlKey) && e.key === 'a') {
+										e.preventDefault();
+										e.stopPropagation();
+										const sel = window.getSelection();
+										const range = document.createRange();
+										range.selectNodeContents(e.currentTarget);
+										sel?.removeAllRanges();
+										sel?.addRange(range);
+									}
+								}}>{@html syntaxHighlightJson(JSON.stringify(inspectData, null, 2))}</pre>
+						{:else}
+							{@render parsedValue(null, inspectData, 0)}
+						{/if}
 					{/if}
 				</div>
 			</div>

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;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;AAgiDF,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;AAsjDF,QAAA,MAAM,cAAc,2CAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}

package/dist/components/admin/DocumentVersionPanel.svelte

@@ -18,8 +18,7 @@
 		) => void;
 	}
 
-	let { documentId, onClose, onRestored, onPreviewVersion }: Props = $props();
-	void onRestored;
+	let { documentId, onClose, onPreviewVersion }: Props = $props();
 
 	let versions = $state<any[]>([]);
 	let loading = $state(true);
@@ -120,6 +119,8 @@
 			</div>
 		{:else}
 			{#each filteredVersions as version, i}
+				<!-- svelte-ignore a11y_click_events_have_key_events -->
+				<!-- svelte-ignore a11y_no_static_element_interactions -->
 				<div
 					data-version-id={i}
 					class="hover:bg-muted w-full cursor-pointer border-b px-3 py-2.5 text-left transition-colors {previewVersion?.versionNumber ===

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

@@ -1 +1 @@
-{"version":3,"file":"DocumentVersionPanel.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/admin/DocumentVersionPanel.svelte.ts"],"names":[],"mappings":"AASC,UAAU,KAAK;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,gBAAgB,CAAC,EAAE,CAClB,OAAO,EAAE;QACR,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,KACJ,IAAI,CAAC;CACV;AAkIF,QAAA,MAAM,oBAAoB;;MAAwC,CAAC;AACnE,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,oBAAoB,CAAC,CAAC;AACpE,eAAe,oBAAoB,CAAC"}
+{"version":3,"file":"DocumentVersionPanel.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/admin/DocumentVersionPanel.svelte.ts"],"names":[],"mappings":"AASC,UAAU,KAAK;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,gBAAgB,CAAC,EAAE,CAClB,OAAO,EAAE;QACR,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,KACJ,IAAI,CAAC;CACV;AAmIF,QAAA,MAAM,oBAAoB;;MAAwC,CAAC;AACnE,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,oBAAoB,CAAC,CAAC;AACpE,eAAe,oBAAoB,CAAC"}

package/dist/components/admin/MediaBrowser.svelte

@@ -106,7 +106,8 @@
 	// Bulk selection state
 	let selectMode = $state(false);
 	let selectedIds = $state<Set<string>>(
-		selectable && multiSelect && existingAssetIds ? new Set(existingAssetIds) : new Set()
+		(() =>
+			selectable && multiSelect && existingAssetIds ? new Set(existingAssetIds) : new Set())()
 	);
 	let isBulkDeleting = $state(false);
 
@@ -433,6 +434,14 @@
 
 	// Delete asset
 	async function deleteAsset(asset: Asset) {
+		try {
+			const result = await assets.getReferenceCounts([asset.id]);
+			if (result.success && result.data) {
+				referenceCounts = { ...referenceCounts, ...result.data };
+			}
+		} catch {
+			// Fall through to cached count
+		}
 		const refCount = referenceCounts[asset.id] || 0;
 		if (refCount > 0) {
 			toast.error(
@@ -826,12 +835,21 @@
 											</div>
 										{/if}
 										{#if selectable}
-											<!-- Info button to view details without selecting -->
-											<button
+											<!-- svelte-ignore a11y_no_static_element_interactions -->
+											<div
+												role="button"
+												tabindex="0"
 												onclick={(e) => {
 													e.stopPropagation();
 													openAssetDetail(asset);
 												}}
+												onkeydown={(e) => {
+													if (e.key === 'Enter' || e.key === ' ') {
+														e.preventDefault();
+														e.stopPropagation();
+														openAssetDetail(asset);
+													}
+												}}
 												class="bg-background/80 absolute top-1.5 right-1.5 rounded p-1 opacity-0 transition-opacity group-hover:opacity-100"
 												title="View details"
 											>
@@ -848,7 +866,7 @@
 														d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
 													/>
 												</svg>
-											</button>
+											</div>
 										{:else if isSelectMode}
 											<!-- Checkbox overlay for bulk mode -->
 											<div class="absolute top-1.5 left-1.5">

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

@@ -1 +1 @@
-{"version":3,"file":"MediaBrowser.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/admin/MediaBrowser.svelte.ts"],"names":[],"mappings":"AAgCA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAS9C,UAAU,KAAK;IACd,8DAA8D;IAC9D,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,yEAAyE;IACzE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IAClC,qEAAqE;IACrE,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IAC7C,oCAAoC;IACpC,eAAe,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACnC,gCAAgC;IAChC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,mFAAmF;IACnF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,6DAA6D;IAC7D,gBAAgB,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;CAC/B;AAgqCF,QAAA,MAAM,YAAY,2CAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}
+{"version":3,"file":"MediaBrowser.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/admin/MediaBrowser.svelte.ts"],"names":[],"mappings":"AAgCA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAS9C,UAAU,KAAK;IACd,8DAA8D;IAC9D,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,yEAAyE;IACzE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IAClC,qEAAqE;IACrE,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IAC7C,oCAAoC;IACpC,eAAe,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACnC,gCAAgC;IAChC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,mFAAmF;IACnF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,6DAA6D;IAC7D,gBAAgB,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;CAC/B;AA+qCF,QAAA,MAAM,YAAY,2CAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}