includio-cms 0.13.0 → 0.13.2

package/CHANGELOG.md

@@ -3,6 +3,42 @@
 All notable changes to includio-cms are documented here.
 Generated from `src/lib/updates/` — do not edit manually.
 
+## 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
+
+### Added
+- Admin UI i18n — TipTap editor, blocks field, array field, media components support pl/en interface language
+- Inline block accordion labels — show field value in collapsed block header
+- Blocks field UrlFieldData label support
+- Email configuration remote endpoint
+
+### Fixed
+- Codegen: remove unused FlatImageFieldData/FlatVideoFieldData, use ImageFieldData/VideoFieldData
+- Layout renderer: hide card header when label is empty
+- Collection entries: improved relation label fetching with UUID validation and multi-version support
+- Users page: client-side email config check, remove server load dependency
+- Entry remote: stricter UUID validation for ids parameter
+- Layout type: remove unused label property from layout node
+
 ## 0.13.0 — 2026-03-19
 
 Private file uploads for form submissions

package/ROADMAP.md

@@ -205,6 +205,30 @@
 
 - [x] `[feature]` `[P1]` Private file uploads — form submissions can upload files to non-public directory
 
+## 0.13.1 — Admin i18n, codegen cleanup, docs
+
+- [x] `[feature]` `[P1]` Admin UI i18n — TipTap, blocks, array, media components support pl/en <!-- files: src/lib/admin/components/tiptap/lang.ts -->
+- [x] `[feature]` `[P2]` Inline block accordion labels — show field value in collapsed header <!-- files: src/lib/admin/components/tiptap/InlineBlockNodeView.svelte -->
+- [x] `[feature]` `[P2]` Blocks field UrlFieldData label support <!-- files: src/lib/admin/components/fields/blocks-field.svelte -->
+- [x] `[feature]` `[P2]` Email configuration remote endpoint <!-- files: src/lib/admin/remote/email.remote.ts -->
+- [x] `[fix]` `[P1]` Codegen: remove unused Flat*FieldData types, use ImageFieldData/VideoFieldData <!-- files: src/lib/core/server/generator/fields.ts, src/lib/core/server/generator/generator.ts -->
+- [x] `[fix]` `[P1]` Layout renderer: hide card header when label empty <!-- files: src/lib/admin/components/layout/layout-renderer.svelte -->
+- [x] `[fix]` `[P1]` Collection entries: improved relation label fetching (UUID validation, multi-version) <!-- files: src/lib/admin/client/collection/collection-entries.svelte -->
+- [x] `[fix]` `[P1]` Users page: client-side email config, remove server load <!-- files: src/lib/admin/client/users/users-page.svelte -->
+- [x] `[fix]` `[P2]` Entry remote: stricter UUID validation for ids <!-- files: src/lib/admin/remote/entry.remote.ts -->
+- [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.14.0 — SEO module
 
 - [ ] `[feature]` `[P1]` SERP preview + character limits for title/description <!-- files: src/lib/admin/components/fields/seo-field.svelte -->

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,8 @@
 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';
+const MAX_UPLOAD_SIZE = getMaxUploadSize();
 export const POST = async ({ request }) => {
     requireAuth();
     const form = await request.formData();

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,8 @@ 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';
+const MAX_UPLOAD_SIZE = getMaxUploadSize();
 export const POST = async ({ request }) => {
     requireAuth();
     const form = await request.formData();

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 }))
+				};
+			});
+		}
+	});
+
 	// 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>>({});
@@ -433,6 +457,8 @@
 		return issues.filter((i) => i.type === 'warning').length;
 	}
 
+	const UUID_RE = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
+
 	async function fetchRelationLabels(entries: RawEntry[]): Promise<Record<string, string>> {
 		if (relationListFields.length === 0) return {};
 
@@ -441,14 +467,21 @@
 			uuidsByCollection.set(field.collection, new Set());
 		}
 		for (const entry of entries) {
-			const data = getVersionData(entry);
-			if (!data) continue;
-			for (const field of relationListFields) {
-				const raw = (data as Record<string, unknown>)[field.slug];
-				if (!raw) continue;
-				const set = uuidsByCollection.get(field.collection)!;
-				if (typeof raw === 'string') set.add(raw);
-				if (Array.isArray(raw)) raw.forEach((v) => typeof v === 'string' && set.add(v));
+			// Collect UUIDs from all version sources (draft + published) to match mapEntryToRow
+			const lang = contentLanguage.current;
+			const dataSources = [
+				entry.publishedVersions[lang]?.data,
+				entry.draftVersions[lang]?.data,
+				getVersionData(entry)
+			].filter(Boolean) as Record<string, unknown>[];
+			for (const data of dataSources) {
+				for (const field of relationListFields) {
+					const raw = data[field.slug];
+					if (!raw) continue;
+					const set = uuidsByCollection.get(field.collection)!;
+					if (typeof raw === 'string' && UUID_RE.test(raw)) set.add(raw);
+					if (Array.isArray(raw)) raw.forEach((v) => typeof v === 'string' && UUID_RE.test(v) && set.add(v));
+				}
 			}
 		}
 
@@ -476,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] ?? '';
@@ -590,7 +625,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();
 	}
@@ -631,8 +666,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/users/users-page.svelte

@@ -32,12 +32,7 @@
 	import UserSessionsSheet from './user-sessions-sheet.svelte';
 	import InviteUserDialog from './invite-user-dialog.svelte';
 	import PendingInvitations from './pending-invitations.svelte';
-
-	type Props = {
-		emailConfigured?: boolean;
-	};
-
-	let { emailConfigured = false }: Props = $props();
+	import { getRemotes } from '../../helpers/index.js';
 
 	type User = {
 		id: string;
@@ -47,6 +42,10 @@
 		createdAt: Date;
 	};
 
+	const remotes = getRemotes();
+	const emailQuery = $derived(remotes.getEmailConfigured());
+	const emailConfigured = $derived(emailQuery.data === true);
+
 	const interfaceLanguage = useInterfaceLanguage();
 	const lang = $derived(usersLang[interfaceLanguage.current]);
 	const session = authClient.useSession();

package/dist/admin/client/users/users-page.svelte.d.ts

@@ -1,6 +1,3 @@
-type Props = {
-    emailConfigured?: boolean;
-};
-declare const UsersPage: import("svelte").Component<Props, {}, "">;
+declare const UsersPage: import("svelte").Component<Record<string, never>, {}, "">;
 type UsersPage = ReturnType<typeof UsersPage>;
 export default UsersPage;

package/dist/admin/components/fields/block-picker-modal.svelte

@@ -9,6 +9,15 @@
 
 	const interfaceLanguage = useInterfaceLanguage();
 
+	import type { InterfaceLanguage } from '../../../types/languages.js';
+	const pickerLang: Record<InterfaceLanguage, {
+		addBlock: string; chooseBlockType: string; searchBlocks: string; noBlocksFound: string;
+	}> = {
+		pl: { addBlock: 'Dodaj blok', chooseBlockType: 'Wybierz typ bloku', searchBlocks: 'Szukaj bloków...', noBlocksFound: 'Nie znaleziono bloków' },
+		en: { addBlock: 'Add block', chooseBlockType: 'Choose a block type to add', searchBlocks: 'Search blocks...', noBlocksFound: 'No blocks found' }
+	};
+	const pt = $derived(pickerLang[interfaceLanguage.current]);
+
 	type Props = {
 		open: boolean;
 		options: ObjectField[];
@@ -39,15 +48,15 @@
 <Dialog.Root bind:open>
 	<Dialog.Content class="max-w-3xl">
 		<Dialog.Header>
-			<Dialog.Title>Add Block</Dialog.Title>
-			<Dialog.Description>Choose a block type to add</Dialog.Description>
+			<Dialog.Title>{pt.addBlock}</Dialog.Title>
+			<Dialog.Description>{pt.chooseBlockType}</Dialog.Description>
 		</Dialog.Header>
 
 		<div class="relative">
 			<SearchIcon class="text-muted-foreground absolute left-3 top-1/2 size-4 -translate-y-1/2" />
 			<Input
 				type="text"
-				placeholder="Search blocks..."
+				placeholder={pt.searchBlocks}
 				class="pl-10"
 				bind:value={searchQuery}
 			/>
@@ -90,7 +99,7 @@
 
 		{#if filteredOptions.length === 0}
 			<div class="py-8 text-center">
-				<p class="text-muted-foreground">No blocks found</p>
+				<p class="text-muted-foreground">{pt.noBlocksFound}</p>
 			</div>
 		{/if}
 	</Dialog.Content>

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

@@ -32,6 +32,16 @@
 	const contentLanguage = getContentLanguage();
 	const interfaceLanguage = useInterfaceLanguage();
 
+	import type { InterfaceLanguage } from '../../../types/languages.js';
+	const blocksLang: Record<InterfaceLanguage, {
+		collapseAll: string; showAll: string; openMenu: string; duplicate: string;
+		moveUp: string; moveDown: string; delete: string; addBlock: string; elements: string;
+	}> = {
+		pl: { collapseAll: 'Zwiń wszystko', showAll: 'Rozwiń wszystko', openMenu: 'Otwórz menu', duplicate: 'Duplikuj', moveUp: 'Przenieś wyżej', moveDown: 'Przenieś niżej', delete: 'Usuń', addBlock: 'Dodaj blok', elements: 'elementów' },
+		en: { collapseAll: 'Collapse all', showAll: 'Show all', openMenu: 'Open menu', duplicate: 'Duplicate', moveUp: 'Move up', moveDown: 'Move down', delete: 'Delete', addBlock: 'Add block', elements: 'elements' }
+	};
+	const bt = $derived(blocksLang[interfaceLanguage.current]);
+
 	function generateId(): string {
 		if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') {
 			return crypto.randomUUID();
@@ -174,6 +184,18 @@
 			}
 
 			if (typeof label === 'object' && label !== null) {
+				// UrlFieldData — has `url` property
+				if ('url' in label) {
+					const urlData = label as { url: string | Record<string, string>; text?: string | Record<string, string> };
+					const displayValue = urlData.text || urlData.url;
+					if (typeof displayValue === 'string' && displayValue.trim().length > 0) {
+						return displayValue;
+					}
+					if (typeof displayValue === 'object' && displayValue !== null) {
+						return displayValue[contentLanguage.current] ?? '';
+					}
+				}
+
 				const objectLabel = label as Record<string, string>;
 				return `${objectLabel[contentLanguage.current]}`;
 			}
@@ -229,7 +251,7 @@
 			>{getLocalizedLabel(field.label, interfaceLanguage.current)}</RequiredLabel
 		>
 		{#if isFixedLength}
-			<span class="text-muted-foreground text-xs">{fixedCount} elementów</span>
+			<span class="text-muted-foreground text-xs">{fixedCount} {bt.elements}</span>
 		{:else if field.maxItems !== undefined}
 			<span class="text-xs {atMax ? 'text-destructive' : 'text-muted-foreground'}"
 				>{$value?.length ?? 0} / {field.maxItems}</span
@@ -244,7 +266,7 @@
 			variant="ghost"
 			onclick={() => {
 				accordionOpenState = [];
-			}}>Collapse All</Button
+			}}>{bt.collapseAll}</Button
 		>
 		<Button
 			size="sm"
@@ -254,7 +276,7 @@
 				if ($value) {
 					accordionOpenState = $value.map((_, i) => i.toString());
 				}
-			}}>Show All</Button
+			}}>{bt.showAll}</Button
 		>
 	</div>
 </div>
@@ -334,7 +356,7 @@
 													{#snippet child({ props })}
 														<Button variant="ghost" size="icon" {...props}>
 															<DotsVerticalIcon />
-															<span class="sr-only">Open menu</span>
+															<span class="sr-only">{bt.openMenu}</span>
 														</Button>
 													{/snippet}
 												</DropdownMenu.Trigger>
@@ -344,27 +366,27 @@
 															onclick={() => duplicateItem(index)}
 															disabled={atMax}
 														>
-															Duplicate
+															{bt.duplicate}
 														</DropdownMenu.Item>
 													{/if}
 													<DropdownMenu.Item
 														onclick={() => moveItemUp(index)}
 														disabled={index === 0}
 													>
-														Move up
+														{bt.moveUp}
 													</DropdownMenu.Item>
 													<DropdownMenu.Item
 														onclick={() => moveItemDown(index)}
 														disabled={$value && index === $value.length - 1}
 													>
-														Move down
+														{bt.moveDown}
 													</DropdownMenu.Item>
 													{#if !isFixedLength}
 														<DropdownMenu.Item
 															variant="destructive"
 															onclick={() => removeItem(index)}
 														>
-															Delete
+															{bt.delete}
 														</DropdownMenu.Item>
 													{/if}
 												</DropdownMenu.Content>
@@ -413,7 +435,7 @@
 				onclick={() => (blockPickerOpen = true)}
 			>
 				<CirclePlus />
-				Add Block
+				{bt.addBlock}
 			</Button>
 		</div>
 		<BlockPickerModal

package/dist/admin/components/fields/simple-array-field.svelte

@@ -11,6 +11,17 @@
 	const contentLanguage = getContentLanguage();
 	const interfaceLanguage = useInterfaceLanguage();
 
+	import type { InterfaceLanguage } from '../../../types/languages.js';
+	const arrayLang: Record<InterfaceLanguage, {
+		typeAndEnter: string; add: string; typeNumber: string; addLink: string;
+		urlPlaceholder: string; linkText: string; newTab: string;
+		removeItem: string; removeLink: string;
+	}> = {
+		pl: { typeAndEnter: 'Wpisz i naciśnij Enter...', add: 'Dodaj', typeNumber: 'Wpisz liczbę...', addLink: 'Dodaj link', urlPlaceholder: 'URL...', linkText: 'Tekst linku...', newTab: 'Nowa karta', removeItem: 'Usuń element', removeLink: 'Usuń link' },
+		en: { typeAndEnter: 'Type and press Enter...', add: 'Add', typeNumber: 'Enter a number...', addLink: 'Add link', urlPlaceholder: 'URL...', linkText: 'Link text...', newTab: 'New tab', removeItem: 'Remove item', removeLink: 'Remove link' }
+	};
+	const at = $derived(arrayLang[interfaceLanguage.current]);
+
 	type Props = {
 		field: ArrayField;
 		value: unknown[] | undefined;
@@ -122,7 +133,7 @@
 							type="button"
 							class="text-[#555566] hover:text-[#C44B4B] transition-colors"
 							onclick={() => removeItem(index)}
-							aria-label="Usuń element"
+							aria-label={at.removeItem}
 						>
 							<X class="h-3.5 w-3.5" />
 						</button>
@@ -134,7 +145,7 @@
 		<div class="flex items-center gap-2">
 			<Input
 				type="text"
-				placeholder="Wpisz i naciśnij Enter..."
+				placeholder={at.typeAndEnter}
 				bind:value={textInput}
 				onkeydown={handleTextKeydown}
 				disabled={atMax}
@@ -142,7 +153,7 @@
 			/>
 			<Button size="sm" type="button" variant="outline" disabled={atMax || !textInput.trim()} onclick={addTextItem}>
 				<CirclePlus class="h-4 w-4" />
-				Dodaj
+				{at.add}
 			</Button>
 		</div>
 
@@ -167,7 +178,7 @@
 							type="button"
 							class="text-[#555566] hover:text-[#C44B4B] transition-colors"
 							onclick={() => removeItem(index)}
-							aria-label="Usuń element"
+							aria-label={at.removeItem}
 						>
 							<X class="h-3.5 w-3.5" />
 						</button>
@@ -179,7 +190,7 @@
 		<div class="flex items-center gap-2">
 			<Input
 				type="number"
-				placeholder="Wpisz liczbę..."
+				placeholder={at.typeNumber}
 				bind:value={numberInput}
 				onkeydown={handleNumberKeydown}
 				disabled={atMax}
@@ -187,7 +198,7 @@
 			/>
 			<Button size="sm" type="button" variant="outline" disabled={atMax || numberInput === ''} onclick={addNumberItem}>
 				<CirclePlus class="h-4 w-4" />
-				Dodaj
+				{at.add}
 			</Button>
 		</div>
 
@@ -209,7 +220,7 @@
 						<div class="flex-1 space-y-2">
 							<Input
 								type="url"
-								placeholder="URL..."
+								placeholder={at.urlPlaceholder}
 								value={typeof urlItem.url === 'string' ? urlItem.url : ''}
 								oninput={(e) => {
 									const val = e.currentTarget.value;
@@ -222,7 +233,7 @@
 							<div class="flex items-center gap-2">
 								<Input
 									type="text"
-									placeholder="Tekst linku..."
+									placeholder={at.linkText}
 									class="flex-1"
 									value={typeof urlItem.text === 'string' ? urlItem.text : ''}
 									oninput={(e) => {
@@ -245,7 +256,7 @@
 										}}
 										class="accent-[#5B4A9E]"
 									/>
-									Nowa karta
+									{at.newTab}
 								</label>
 							</div>
 						</div>
@@ -253,7 +264,7 @@
 							type="button"
 							class="mt-1.5 text-[#555566] hover:text-[#C44B4B] transition-colors"
 							onclick={() => removeItem(index)}
-							aria-label="Usuń link"
+							aria-label={at.removeLink}
 						>
 							<X class="h-4 w-4" />
 						</button>
@@ -264,7 +275,7 @@
 
 		<Button size="sm" type="button" variant="outline" disabled={atMax} onclick={addUrlItem}>
 			<CirclePlus class="h-4 w-4" />
-			Dodaj link
+			{at.addLink}
 		</Button>
 
 		{#if field.maxItems !== undefined}

package/dist/admin/components/layout/layout-renderer.svelte

@@ -150,10 +150,12 @@
 		</div>
 
 	{:else if node.type === 'card'}
-		<div role="group" aria-label={getLabel(node)} class="layout-card">
-			<div class="layout-card-header">
-				{getLabel(node)}
-			</div>
+		<div role="group" aria-label={getLabel(node) || undefined} class="layout-card" class:no-header={!getLabel(node)}>
+			{#if getLabel(node)}
+				<div class="layout-card-header">
+					{getLabel(node)}
+				</div>
+			{/if}
 			<div class="layout-card-body">
 				{#if isLayoutLeaf(node) && node.autoGrid}
 					<div class="layout-auto-grid">
@@ -268,6 +270,10 @@
 		padding: 10px 16px 16px;
 	}
 
+	.layout-card.no-header .layout-card-body {
+		padding-top: 16px;
+	}
+
 	/* ═══════════ ACCORDION ═══════════ */
 	.layout-accordion-wrapper {
 		background: var(--card);

package/dist/admin/components/media/file-preview.svelte

@@ -5,6 +5,15 @@
 	import VideoOff from '@tabler/icons-svelte/icons/video-off';
 
 	import { getRemotes } from '../../context/remotes.js';
+	import { useInterfaceLanguage } from '../../state/interface-language.svelte.js';
+	import type { InterfaceLanguage } from '../../../types/languages.js';
+
+	const interfaceLanguage = useInterfaceLanguage();
+	const previewLang: Record<InterfaceLanguage, { loading: string }> = {
+		pl: { loading: 'Ładowanie...' },
+		en: { loading: 'Loading...' }
+	};
+	const pvt = $derived(previewLang[interfaceLanguage.current]);
 
 	const remotes = getRemotes();
 
@@ -20,7 +29,7 @@
 
 <div class="border">
 	{#if !fileQuery.ready}
-		Loading...
+		{pvt.loading}
 	{:else if fileQuery.current}
 		{@const file = fileQuery.current}
 		{#if file.type === 'image'}