From b5ea04e47a94d20b7de1e52ea1e71dcc8208d688 Mon Sep 17 00:00:00 2001
From: Marcel <marcel@familienarchiv>
Date: Fri, 17 Apr 2026 08:04:16 +0200
Subject: [PATCH] feat(#248): add optional placeholder prop to TagParentPicker

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/src/lib/components/TagParentPicker.svelte         | 6 ++++--
 frontend/src/lib/components/TagParentPicker.svelte.spec.ts | 6 ++++++
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/frontend/src/lib/components/TagParentPicker.svelte b/frontend/src/lib/components/TagParentPicker.svelte
index 3a2ba001..152fb4b2 100644
--- a/frontend/src/lib/components/TagParentPicker.svelte
+++ b/frontend/src/lib/components/TagParentPicker.svelte
@@ -19,6 +19,7 @@ interface Props {
 	excludeIds?: string[];
 	initialName?: string;
 	allTags?: FlatTagRef[];
+	placeholder?: string;
 }
 
 let {
@@ -26,7 +27,8 @@ let {
 	value = $bindable(''),
 	excludeIds = [],
 	initialName = '',
-	allTags = []
+	allTags = [],
+	placeholder = m.admin_tag_parent_placeholder()
 }: Props = $props();
 
 // displayName must be both prop-derived AND locally writable (user typing), so $state +
@@ -107,7 +109,7 @@ function handleKeydown(e: KeyboardEvent) {
 			bind:value={displayName}
 			oninput={handleInput}
 			onkeydown={handleKeydown}
-			placeholder={m.admin_tag_parent_placeholder()}
+			placeholder={placeholder}
 			class="mt-1 block w-full rounded-md border border-line bg-surface p-2 pr-8 text-ink shadow-sm placeholder:text-ink-3 focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring"
 		/>
 
diff --git a/frontend/src/lib/components/TagParentPicker.svelte.spec.ts b/frontend/src/lib/components/TagParentPicker.svelte.spec.ts
index 03c905a5..ac78dac2 100644
--- a/frontend/src/lib/components/TagParentPicker.svelte.spec.ts
+++ b/frontend/src/lib/components/TagParentPicker.svelte.spec.ts
@@ -40,6 +40,12 @@ describe('TagParentPicker – rendering', () => {
 		await vi.advanceTimersByTimeAsync(0);
 		expect(hiddenInput('parentId')).toBeTruthy();
 	});
+
+	it('uses custom placeholder text when provided', async () => {
+		render(TagParentPicker, { name: 'target', placeholder: 'Ziel-Schlagwort suchen …' });
+		const input = await page.getByRole('combobox').element();
+		expect(input.getAttribute('placeholder')).toBe('Ziel-Schlagwort suchen …');
+	});
 });
 
 // ─── Search ───────────────────────────────────────────────────────────────────