includio-cms 0.13.1 → 0.13.3

package/CHANGELOG.md

@@ -3,6 +3,44 @@
 All notable changes to includio-cms are documented here.
 Generated from `src/lib/updates/` — do not edit manually.
 
+## 0.13.3 — 2026-03-23
+
+Security hardening, per-language content fixes
+
+### Added
+- Timing-safe API key comparison (prevents timing attacks)
+- MIME type blocklist on upload and file replace endpoints
+- Security headers: X-Content-Type-Options, X-Frame-Options, Referrer-Policy
+- CMS constructor validates that at least one language is configured
+
+### Fixed
+- Form submission rate limiting applies to all requests (not just multipart uploads)
+- Form submission uses SvelteKit getClientAddress() instead of spoofable x-forwarded-for header
+- Removed demo reset endpoint with hardcoded fallback secret
+- Added .catch() handlers for unhandled promise rejections in admin components
+- Per-language content language state and entry label fixes
+
+### Breaking
+- CMS config with empty languages array now throws an error at initialization
+
+## 0.13.2 — 2026-03-20
+
+Upload limits, stable reordering, relation filters, image style optimization
+
+### Added
+- Configurable upload size limit via BODY_SIZE_LIMIT env var (supports K/M/G suffixes, default 50M)
+- File upload pre-validation — rejects oversized files before upload with localized error messages
+- Stable slot reordering — preserves positions of filtered-out entries during DnD reorder
+- Collection relation field filtering — filter entries by relation field values
+- Expose _sortOrder on entries for orderable collections
+- Codegen: _sortOrder field in generated TypeScript interfaces for orderable collections
+- getImageStyleIfExists — non-blocking image style lookup (returns null if missing)
+
+### Fixed
+- Concurrent image style generation with buffer reuse — download original once, generate styles in parallel (limit 3)
+- Image style resolution gracefully skips missing styles instead of blocking
+- Upload endpoints use configurable size limit instead of hardcoded 50MB
+
 ## 0.13.1 — 2026-03-20
 
 Admin UI i18n, codegen cleanup, docs rewrite

package/ROADMAP.md

@@ -219,6 +219,26 @@
 - [x] `[fix]` `[P2]` Layout type: remove unused label property <!-- files: src/lib/types/layout.ts -->
 - [x] `[chore]` `[P1]` Documentation rewrite — new pages for blocks, content, media-field, layout; expanded API, auth, entries, forms, plugins docs
 
+## 0.13.2 — Upload limits, stable reordering, image style optimization
+
+- [x] `[feature]` `[P1]` Configurable upload size limit — `BODY_SIZE_LIMIT` env var, pre-validation in UI <!-- files: src/lib/core/server/media/uploadLimit.ts, src/lib/admin/api/upload-limit.ts, src/lib/admin/components/media/file-upload.svelte -->
+- [x] `[feature]` `[P1]` Stable slot reordering — preserve filtered-out entry positions during DnD <!-- files: src/lib/admin/remote/reorder.ts, src/lib/admin/remote/entry.remote.ts -->
+- [x] `[feature]` `[P1]` Collection relation field filtering — filter entries by relation values <!-- files: src/lib/admin/client/collection/collection-entries.svelte -->
+- [x] `[feature]` `[P2]` Expose `_sortOrder` on entries + codegen for orderable collections <!-- files: src/lib/core/server/entries/operations/get.ts, src/lib/core/server/generator/generator.ts, src/lib/types/entries.ts -->
+- [x] `[feature]` `[P2]` `getImageStyleIfExists` — non-blocking image style lookup <!-- files: src/lib/core/server/media/styles/operations/getImageStyle.ts -->
+- [x] `[fix]` `[P1]` Concurrent image style generation with buffer reuse (download once, parallel limit 3) <!-- files: src/lib/core/server/media/styles/operations/generateDefaultStyles.ts, src/lib/core/server/media/styles/sharp/generateImageStyle.ts -->
+- [x] `[fix]` `[P1]` Image style resolution gracefully skips missing styles <!-- files: src/lib/core/server/fields/utils/imageStyles.ts -->
+
+## 0.13.3 — Security hardening
+
+- [x] `[fix]` `[P0]` Timing-safe API key comparison (prevents timing attacks) <!-- files: src/lib/admin/api/rest/middleware/apiKey.ts -->
+- [x] `[fix]` `[P0]` Remove demo reset endpoint with hardcoded fallback secret <!-- files: src/routes/api/demo/reset/ -->
+- [x] `[fix]` `[P1]` Form rate limit: all requests + getClientAddress() instead of x-forwarded-for <!-- files: src/routes/api/forms/[slug]/submit/+server.ts -->
+- [x] `[feature]` `[P1]` MIME blocklist on upload/replace endpoints <!-- files: src/lib/core/server/media/mimeBlocklist.ts -->
+- [x] `[feature]` `[P1]` Security headers: X-Content-Type-Options, X-Frame-Options, Referrer-Policy <!-- files: src/lib/sveltekit/server/handle.ts -->
+- [x] `[fix]` `[P1]` CMS constructor validates non-empty languages array <!-- files: src/lib/core/cms.ts -->
+- [x] `[fix]` `[P2]` Unhandled promise rejection handlers in admin components
+
 ## 0.14.0 — SEO module
 
 - [ ] `[feature]` `[P1]` SERP preview + character limits for title/description <!-- files: src/lib/admin/components/fields/seo-field.svelte -->
@@ -236,8 +256,8 @@
 - [ ] `[feature]` `[P1]` `sanitizeHTML` utility — general HTML sanitization outside richtext (text fields, SEO fields)
 - [ ] `[feature]` `[P1]` CSP headers — Content-Security-Policy middleware
 - [ ] `[feature]` `[P1]` CSRF protection — tokens for mutating operations
-- [ ] `[feature]` `[P1]` Rate limiting — API/auth endpoints
-- [ ] `[chore]` `[P1]` Security audit — review `{@html}` usage, innerHTML, injection vectors
+- [x] `[feature]` `[P1]` Rate limiting — form submit endpoints (done in 0.13.3; admin/auth endpoints remaining)
+- [x] `[chore]` `[P1]` Security audit — timing attacks, MIME validation, demo endpoint, rate limiting (done in 0.13.3; `{@html}` review remaining)
 - [ ] `[chore]` `[P1]` Input sanitization audit — review all fields for XSS
 
 ## Backlog

package/dist/admin/api/handler.js

@@ -6,6 +6,7 @@ import * as inviteHandlers from './invite.js';
 import * as acceptInviteHandlers from './accept-invite.js';
 import * as mediaGcHandlers from './media-gc.js';
 import * as generateStylesHandlers from './generate-styles.js';
+import * as uploadLimitHandlers from './upload-limit.js';
 import { requireAuth } from '../remote/middleware/auth.js';
 import { getCMS } from '../../core/cms.js';
 import { lookup } from 'mrmime';
@@ -18,6 +19,7 @@ export function createAdminApiHandler(options) {
         'accept-invite': acceptInviteHandlers,
         'media-gc': mediaGcHandlers,
         'generate-styles': generateStylesHandlers,
+        'upload-limit': uploadLimitHandlers,
         ...options?.extraRoutes
     };
     const privateMediaGet = async (event) => {

package/dist/admin/api/replace.js

@@ -1,7 +1,9 @@
 import { requireAuth } from '../remote/middleware/auth.js';
 import { replaceFile } from '../../core/server/media/operations/replaceFile.js';
 import { json } from '@sveltejs/kit';
-const MAX_UPLOAD_SIZE = 50 * 1024 * 1024; // 50MB
+import { getMaxUploadSize } from '../../core/server/media/uploadLimit.js';
+import { isBlockedMimeType } from '../../core/server/media/mimeBlocklist.js';
+const MAX_UPLOAD_SIZE = getMaxUploadSize();
 export const POST = async ({ request }) => {
     requireAuth();
     const form = await request.formData();
@@ -13,6 +15,9 @@ export const POST = async ({ request }) => {
     if (file.size > MAX_UPLOAD_SIZE) {
         return new Response('File too large', { status: 413 });
     }
+    if (isBlockedMimeType(file.type, file.name)) {
+        return new Response('File type not allowed', { status: 415 });
+    }
     if (!fileId || !/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(fileId)) {
         return new Response('Invalid fileId', { status: 400 });
     }

package/dist/admin/api/rest/middleware/apiKey.js

@@ -1,3 +1,4 @@
+import { timingSafeEqual } from 'node:crypto';
 import { getCMS } from '../../../../core/cms.js';
 export function extractApiKey(event) {
     const authHeader = event.request.headers.get('authorization');
@@ -6,9 +7,14 @@ export function extractApiKey(event) {
     }
     return event.request.headers.get('x-api-key');
 }
+function safeEqual(a, b) {
+    if (a.length !== b.length)
+        return false;
+    return timingSafeEqual(Buffer.from(a), Buffer.from(b));
+}
 export function validateApiKey(key) {
     const cms = getCMS();
-    return cms.apiKeys.find((k) => k.key === key) ?? null;
+    return cms.apiKeys.find((k) => safeEqual(k.key, key)) ?? null;
 }
 export function setSyntheticUser(event, apiKey) {
     const name = apiKey.name || 'api';

package/dist/admin/api/rest/routes/upload.js

@@ -1,7 +1,8 @@
 import { json } from '@sveltejs/kit';
 import { uploadFile } from '../../../../core/server/media/operations/uploadFile.js';
 import { getCMS } from '../../../../core/cms.js';
-const MAX_UPLOAD_SIZE = 50 * 1024 * 1024; // 50MB
+import { getMaxUploadSize } from '../../../../core/server/media/uploadLimit.js';
+const MAX_UPLOAD_SIZE = getMaxUploadSize();
 export async function POST(event) {
     const form = await event.request.formData();
     const file = form.get('file');

package/dist/admin/api/upload-limit.d.ts

@@ -0,0 +1,2 @@
+import { type RequestHandler } from '@sveltejs/kit';
+export declare const GET: RequestHandler;

package/dist/admin/api/upload-limit.js

@@ -0,0 +1,7 @@
+import { requireAuth } from '../remote/middleware/auth.js';
+import { getMaxUploadSize } from '../../core/server/media/uploadLimit.js';
+import { json } from '@sveltejs/kit';
+export const GET = async () => {
+    requireAuth();
+    return json({ maxUploadSize: getMaxUploadSize() });
+};

package/dist/admin/api/upload.js

@@ -2,7 +2,9 @@ import { requireAuth } from '../remote/middleware/auth.js';
 import { uploadFile } from '../../core/server/media/operations/uploadFile.js';
 import { getCMS } from '../../core/cms.js';
 import { json } from '@sveltejs/kit';
-const MAX_UPLOAD_SIZE = 50 * 1024 * 1024; // 50MB
+import { getMaxUploadSize } from '../../core/server/media/uploadLimit.js';
+import { isBlockedMimeType } from '../../core/server/media/mimeBlocklist.js';
+const MAX_UPLOAD_SIZE = getMaxUploadSize();
 export const POST = async ({ request }) => {
     requireAuth();
     const form = await request.formData();
@@ -14,6 +16,9 @@ export const POST = async ({ request }) => {
     if (file.size > MAX_UPLOAD_SIZE) {
         return new Response('File too large', { status: 413 });
     }
+    if (isBlockedMimeType(file.type, file.name)) {
+        return new Response('File type not allowed', { status: 415 });
+    }
     const dbFile = await uploadFile(file);
     if (tagIdsRaw) {
         try {

package/dist/admin/client/collection/collection-entries.svelte

@@ -144,6 +144,21 @@
 	);
 
 
+	// Relation filter options fetched from related collections
+	let relationFilterOptions = $state<Record<string, { label: string; value: string }[]>>({});
+
+	$effect(() => {
+		if (relationListFields.length === 0) return;
+		for (const field of relationListFields) {
+			remotes.getEntryLabels({ slug: field.collection }).then((labels) => {
+				relationFilterOptions = {
+					...relationFilterOptions,
+					[field.slug]: labels.map((l) => ({ value: l.id, label: l.label }))
+				};
+			}).catch(() => {});
+		}
+	});
+
 	// Data filter configs from select/radio fields in listColumns
 	const dataFilterConfigs = $derived(
 		(collection.listColumns ?? [])
@@ -163,6 +178,15 @@
 				return null;
 			})
 			.filter((f): f is NonNullable<typeof f> => f !== null)
+			.concat(
+				relationListFields
+					.filter((f) => relationFilterOptions[f.slug]?.length)
+					.map((f) => ({
+						slug: f.slug,
+						label: getLocalizedLabel(f.label, interfaceLanguage.current),
+						options: relationFilterOptions[f.slug]
+					}))
+			)
 	);
 
 	let activeDataFilters = $state<Record<string, string | null>>({});
@@ -226,7 +250,7 @@
 		if (entriesQuery.current) {
 			fetchRelationLabels(entriesQuery.current.entries).then((l) => {
 				labelLookup = l;
-			});
+			}).catch(() => {});
 		}
 	});
 
@@ -262,7 +286,7 @@
 				return renderComponent(EntryLink, {
 					name: info.row.original.name,
 					url: info.row.original.url,
-					slug: info.row.original.slug?.[interfaceLanguage.current]
+					slug: info.row.original.slug
 				});
 			}
 		},
@@ -485,6 +509,8 @@
 				const fieldData = (columnData as Record<string, unknown>)[fieldSlug];
 				const isRelation = relationListFields.some((f) => f.slug === fieldSlug);
 				if (isRelation) {
+					// Store raw UUID(s) for filtering
+					customData[`__raw_${fieldSlug}`] = fieldData;
 					// Resolve relation UUID(s) to labels
 					if (typeof fieldData === 'string') {
 						customData[fieldSlug] = lookup[fieldData] ?? '';
@@ -508,7 +534,11 @@
 		return {
 			id: entry.id,
 			name: getRawCollectionEntryLabel(entry, collection, contentLanguage.current),
-			slug: extractSlug(entry),
+			slug: (() => {
+				const s = extractSlug(entry);
+				if (!s) return undefined;
+				return collection.pathTemplate ? collection.pathTemplate.replace('{slug}', s) : s;
+			})(),
 			url: `/admin/entries/${entry.id}`,
 			status: getEntryStatus(entry),
 			createdAt: new Date(entry.createdAt),
@@ -599,7 +629,7 @@
 			...old,
 			entries: orderedIds.map((id) => old.entries.find((e: RawEntry) => e.id === id)).filter(Boolean)
 		}));
-		await remotes.reorderEntriesCommand({ orderedIds });
+		await remotes.reorderEntriesCommand({ orderedIds, collectionSlug: collection.slug });
 		await entriesQuery.refresh();
 		override.release();
 	}
@@ -640,8 +670,20 @@
 			rows = rows.filter((row) => {
 				for (const [slug, value] of Object.entries(activeDataFilters)) {
 					if (value === null) continue;
-					const rowValue = row.customData[slug];
-					if (String(rowValue ?? '') !== value) return false;
+					// For relation fields, compare against raw UUID(s)
+					const rawValue = row.customData[`__raw_${slug}`];
+					if (rawValue !== undefined) {
+						if (typeof rawValue === 'string') {
+							if (rawValue !== value) return false;
+						} else if (Array.isArray(rawValue)) {
+							if (!rawValue.includes(value)) return false;
+						} else {
+							return false;
+						}
+					} else {
+						const rowValue = row.customData[slug];
+						if (String(rowValue ?? '') !== value) return false;
+					}
 				}
 				return true;
 			});

package/dist/admin/client/collection/grid-view.svelte

@@ -85,7 +85,7 @@
 				</h3>
 				{#if item.slug}
 					<div class="text-muted-foreground truncate font-mono text-[10px]">
-						/{item.slug?.[interfaceLanguage.current]}
+						/{item.slug}
 					</div>
 				{/if}
 				<div class="mt-auto flex flex-col items-start gap-1.5 pt-2">

package/dist/admin/client/entry/entry-header.svelte

@@ -11,12 +11,11 @@
 	import LayoutSidebar from '@tabler/icons-svelte/icons/layout-sidebar';
 	import SendIcon from '@tabler/icons-svelte/icons/send';
 	import ChevronDownIcon from '@tabler/icons-svelte/icons/chevron-down';
-	import LanguageIcon from '@tabler/icons-svelte/icons/language';
+	import CopyIcon from '@tabler/icons-svelte/icons/copy';
 	import * as DropdownMenu from '../../../components/ui/dropdown-menu/index.js';
 	import { hasHybridContext, getHybridContext } from './hybrid/hybrid-context.svelte.js';
 	import { getEntryStatus } from './utils.js';
 	import { onMount } from 'svelte';
-	import type { LangStatus } from '../../utils/translationStatus.js';
 
 	const contentLanguage = getContentLanguage();
 	const interfaceLanguage = useInterfaceLanguage();
@@ -27,17 +26,20 @@
 			publish: string;
 			update: string;
 			saveDraft: string;
+			copyFrom: string;
 		}
 	> = {
 		en: {
 			publish: 'Publish',
 			update: 'Update',
-			saveDraft: 'Save draft'
+			saveDraft: 'Save draft',
+			copyFrom: 'Copy from'
 		},
 		pl: {
 			publish: 'Publikuj',
 			update: 'Aktualizuj',
-			saveDraft: 'Zapisz szkic'
+			saveDraft: 'Zapisz szkic',
+			copyFrom: 'Kopiuj z'
 		}
 	};
 
@@ -54,7 +56,7 @@
 		saveStatus?: SaveStatus;
 		isArchived?: boolean;
 		onScrollToIssue?: (fieldSlug: string, nodePos: number) => void;
-		translationStatus?: Record<string, LangStatus> | null;
+		onCopyFromLang?: (lang: string) => void;
 	};
 
 	let {
@@ -68,7 +70,7 @@
 		saveStatus = 'idle',
 		isArchived = false,
 		onScrollToIssue,
-		translationStatus = null
+		onCopyFromLang
 	}: Props = $props();
 	let { collection } = entry;
 
@@ -93,29 +95,8 @@
 	});
 	const shortcutLabel = $derived(isMac ? '⌘S' : 'Ctrl+S');
 
-	function statusDotClass(status: LangStatus | undefined): string {
-		if (!status) return 'bg-[var(--text-light)]';
-		if (status.status === 'complete') return 'bg-[var(--success)]';
-		if (status.status === 'partial') return 'bg-[var(--warning)]';
-		return 'bg-[var(--text-light)]';
-	}
-
-	function statusLabel(lang: string, status: LangStatus | undefined): string {
-		if (!status) return lang.toUpperCase();
-		if (status.status === 'complete') return `${lang.toUpperCase()} \u2713`;
-		if (status.status === 'partial') return `${lang.toUpperCase()} \u26A0`;
-		return lang.toUpperCase();
-	}
-
-	function statusTooltip(lang: string, status: LangStatus | undefined): string {
-		if (!status) return lang.toUpperCase();
-		if (status.status === 'complete') return `${lang.toUpperCase()}: 100%`;
-		const missing = status.missingFields.map((f) => f.label).join(', ');
-		return `${lang.toUpperCase()}: ${status.percentage}% — ${interfaceLanguage.current === 'pl' ? 'brakuje' : 'missing'}: ${missing}`;
-	}
-
-	const isNonDefaultLang = $derived(
-		contentLanguage.all.length > 1 && contentLanguage.current !== contentLanguage.all[0]
+	const otherLanguages = $derived(
+		contentLanguage.all.filter((l) => l !== contentLanguage.current)
 	);
 </script>
 
@@ -134,34 +115,46 @@
 		{#if contentLanguage.all.length > 1}
 			<div class="border-border bg-muted inline-flex overflow-hidden rounded-lg border">
 				{#each contentLanguage.all as lang}
-					{@const langStatus = translationStatus?.[lang]}
 					<button
 						type="button"
 						role="tab"
 						aria-selected={lang === contentLanguage.current}
-						title={statusTooltip(lang, langStatus)}
-						class="inline-flex items-center gap-1.5 px-2.5 py-1 text-xs font-semibold transition-colors {lang ===
+						title={lang.toUpperCase()}
+						class="inline-flex items-center px-2.5 py-1 text-xs font-semibold transition-colors {lang ===
 						contentLanguage.current
 							? 'text-primary bg-white shadow-sm ring-1 ring-primary/20'
 							: 'text-muted-foreground hover:text-foreground bg-transparent'}"
 						onclick={() => (contentLanguage.current = lang)}
 					>
-						<span class="size-2 shrink-0 rounded-full {statusDotClass(langStatus)}"></span>
-						{statusLabel(lang, langStatus)}
+						{lang.toUpperCase()}
 					</button>
 				{/each}
 			</div>
 
-			<!-- Reference mode toggle -->
-			<Button
-				variant="ghost"
-				size="icon-sm"
-				class={contentLanguage.referenceMode ? 'text-primary bg-[var(--lavender-lighter)]' : ''}
-				onclick={() => (contentLanguage.referenceMode = !contentLanguage.referenceMode)}
-				title={interfaceLanguage.current === 'pl' ? 'Tryb referencyjny' : 'Reference mode'}
-			>
-				<LanguageIcon class="size-4" />
-			</Button>
+			<!-- Copy from other language -->
+			{#if onCopyFromLang && otherLanguages.length > 0}
+				<DropdownMenu.Root>
+					<DropdownMenu.Trigger>
+						{#snippet child({ props })}
+							<button
+								{...props}
+								type="button"
+								class="text-muted-foreground hover:text-foreground inline-flex items-center rounded-md p-1.5 transition-colors hover:bg-[var(--lavender-lighter)]"
+								title={lang[interfaceLanguage.current].copyFrom}
+							>
+								<CopyIcon class="size-4" />
+							</button>
+						{/snippet}
+					</DropdownMenu.Trigger>
+					<DropdownMenu.Content align="end" class="w-48">
+						{#each otherLanguages as sourceLang}
+							<DropdownMenu.Item onclick={() => onCopyFromLang?.(sourceLang)}>
+								{lang[interfaceLanguage.current].copyFrom} {sourceLang.toUpperCase()}
+							</DropdownMenu.Item>
+						{/each}
+					</DropdownMenu.Content>
+				</DropdownMenu.Root>
+			{/if}
 
 			<div class="bg-border mx-1 h-5 w-px shrink-0"></div>
 		{/if}

package/dist/admin/client/entry/entry-header.svelte.d.ts

@@ -1,7 +1,6 @@
 import type { DbEntryVersion, RawEntry } from '../../../types/entries.js';
 import type { UpdateEntryVersionCommandType } from '../../../core/server/entries/operations/update.js';
 import type { Field } from '../../../types/fields.js';
-import type { LangStatus } from '../../utils/translationStatus.js';
 type SaveStatus = 'idle' | 'saving' | 'saved' | 'unsaved' | 'error';
 type Props = {
     entry: RawEntry;
@@ -14,7 +13,7 @@ type Props = {
     saveStatus?: SaveStatus;
     isArchived?: boolean;
     onScrollToIssue?: (fieldSlug: string, nodePos: number) => void;
-    translationStatus?: Record<string, LangStatus> | null;
+    onCopyFromLang?: (lang: string) => void;
 };
 declare const EntryHeader: import("svelte").Component<Props, {}, "">;
 type EntryHeader = ReturnType<typeof EntryHeader>;

package/dist/admin/client/entry/entry-version.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
 	import { page } from '$app/state';
+	import { getContentLanguage } from '../../state/content-language.svelte.js';
 	import type { RawEntry } from '../../../types/entries.js';
 	import Entry from './entry.svelte';
 
@@ -9,11 +10,16 @@
 
 	let { entry }: Props = $props();
 
+	const contentLanguage = getContentLanguage();
 	const version = $derived(page.url.searchParams.get('version') || '');
 
-	const editingEntry = $derived(
-		entry.versions.find((ver) => ver.id === version) || entry.versions[0]
-	);
+	const editingEntry = $derived.by(() => {
+		if (version) {
+			return entry.versions.find((ver) => ver.id === version) || entry.versions[0];
+		}
+		const lang = contentLanguage.current;
+		return entry.publishedVersions[lang] || entry.draftVersions[lang] || entry.versions[0];
+	});
 </script>
 
 {#key editingEntry.id}

package/dist/admin/client/entry/entry.svelte

@@ -26,7 +26,7 @@
 	import { getFieldsFromConfig, hasLayout } from '../../../core/fields/layoutUtils.js';
 	import type { ValidationErrors } from 'sveltekit-superforms';
 	import { createHybridContext } from './hybrid/hybrid-context.svelte.js';
-	import { onMount } from 'svelte';
+	import { onMount, setContext } from 'svelte';
 	import { get } from 'svelte/store';
 	const contentLanguage = getContentLanguage();
 	const remotes = getRemotes();
@@ -140,6 +140,9 @@
 	let { collection } = entry;
 	const isArchived = $derived(!!entry.archivedAt);
 
+	setContext('cms-path-template', collection.pathTemplate || null);
+	setContext('cms-entry-published', entry.publishedVersions[contentLanguage.current] != null);
+
 	// Create form once at component level — localized: false since data is flat single-language
 	const collectionSchema = generateZodSchemaFromFields(
 		getFieldsFromConfig(collection),
@@ -539,6 +542,21 @@
 
 	const t = $derived(lang[interfaceLanguage.current]);
 	const isHybrid = $derived(hybridContext.mode === 'hybrid' && !!collection.previewUrl);
+
+	function onCopyFromLang(sourceLang: string) {
+		const sourceVersion =
+			entry.draftVersions[sourceLang] ?? entry.publishedVersions[sourceLang];
+		if (!sourceVersion?.data) return;
+
+		const confirmMsg =
+			interfaceLanguage.current === 'pl'
+				? `Nadpisze aktualne dane danymi z wersji ${sourceLang.toUpperCase()}. Kontynuować?`
+				: `This will overwrite current data with data from ${sourceLang.toUpperCase()} version. Continue?`;
+
+		if (!confirm(confirmMsg)) return;
+
+		form.form.set(sourceVersion.data);
+	}
 </script>
 
 <div class={isHybrid ? 'flex h-full flex-col overflow-hidden' : ''}>
@@ -553,6 +571,7 @@
 		fields={getFieldsFromConfig(collection)}
 		getFormData={() => get(form.form)}
 		onScrollToIssue={scrollToIssue}
+		{onCopyFromLang}
 	/>
 
 	{#if validationErrors.length > 0}

package/dist/admin/components/fields/seo-field.svelte

@@ -8,15 +8,22 @@
 		MediaField,
 		SeoField,
 		SeoFieldData,
+		SlugField as SlugFieldType,
 		TextField
 	} from '../../../types/fields.js';
-	import { untrack } from 'svelte';
+	import { formFieldProxy, type FormPathLeaves } from 'sveltekit-superforms';
+	import Input from '../../../components/ui/input/input.svelte';
+	import * as Form from '../../../components/ui/form/index.js';
+	import { getContext, untrack } from 'svelte';
 	import slugify from '../../imports/slugify.js';
 	import { useInterfaceLanguage } from '../../state/interface-language.svelte.js';
 	import { getLocalizedLabel } from '../../utils/collectionLabel.js';
 	import { Switch } from '../../../components/ui/switch/index.js';
 
 	const interfaceLanguage = useInterfaceLanguage();
+	const pathTemplate = getContext<string | null>('cms-path-template');
+	const pathPrefix = pathTemplate ? pathTemplate.replace('{slug}', '') : '/';
+	const wasPublished = getContext<boolean>('cms-entry-published') ?? false;
 
 	type Props = {
 		field: SeoField;
@@ -172,6 +179,10 @@
 		return 'text-destructive';
 	}
 
+	// Slug field proxy for direct input binding
+	const slugPath = joinPath(String(path), 'slug');
+	const { value: slugValue } = formFieldProxy(form, slugPath as FormPathLeaves<Record<string, unknown>>);
+
 	// Auto-gen: track last auto-generated value
 	let lastAutoSlug = '';
 	let lastAutoTitle = '';
@@ -179,6 +190,7 @@
 	// Auto slug toggle
 	let autoSlug = $state((() => {
 		if (!field.slugSource) return false;
+		if (wasPublished) return false;
 		const sourceRaw = ($formData as Record<string, unknown>)[field.slugSource];
 		if (!sourceRaw || typeof sourceRaw !== 'string') return true;
 		const slugPath = joinPath(String(path), 'slug');
@@ -238,21 +250,23 @@
 </script>
 
 <div class="space-y-4">
-	<!-- Slug field with auto/manual toggle -->
-	<div>
-		{#if field.slugSource}
-			<div class="mb-1.5 flex items-center gap-2">
-				<span class="text-sm font-medium text-muted-foreground">Auto</span>
-				<Switch bind:checked={autoSlug} onCheckedChange={onAutoSlugToggle} />
-			</div>
-		{/if}
-		<FieldRenderer
-			field={slugField}
-			{form}
-			path={joinPath(path, 'slug')}
-			readonly={autoSlug}
-		/>
-	</div>
+	<!-- Slug field with auto/manual toggle + path prefix -->
+	<Form.Field {form} name={slugPath} class="space-y-1">
+		<div class="flex items-center justify-between">
+			<Form.Label>{getLocalizedLabel(labels.slug.label, interfaceLanguage.current)}</Form.Label>
+			{#if field.slugSource}
+				<div class="flex items-center gap-2">
+					<span class="text-sm font-medium text-muted-foreground">Auto</span>
+					<Switch bind:checked={autoSlug} onCheckedChange={onAutoSlugToggle} />
+				</div>
+			{/if}
+		</div>
+		<div class="flex">
+			<span class="border-input bg-muted text-muted-foreground flex h-9 shrink-0 items-center rounded-l-md border border-r-0 px-2.5 font-mono text-sm">{pathPrefix}</span>
+			<Input bind:value={$slugValue} readonly={autoSlug} class="rounded-l-none border-l-0" />
+		</div>
+		<Form.Description>{getLocalizedLabel(labels.slug.description, interfaceLanguage.current)}</Form.Description>
+	</Form.Field>
 	{#each fields as f}
 		<div>
 			<FieldRenderer