feat(#248): add optional placeholder prop to TagParentPicker

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-17 08:04:16 +02:00
parent 4ec4062274
commit b5ea04e47a
2 changed files with 10 additions and 2 deletions

View File

@@ -19,6 +19,7 @@ interface Props {
excludeIds?: string[]; excludeIds?: string[];
initialName?: string; initialName?: string;
allTags?: FlatTagRef[]; allTags?: FlatTagRef[];
placeholder?: string;
} }
let { let {
@@ -26,7 +27,8 @@ let {
value = $bindable(''), value = $bindable(''),
excludeIds = [], excludeIds = [],
initialName = '', initialName = '',
allTags = [] allTags = [],
placeholder = m.admin_tag_parent_placeholder()
}: Props = $props(); }: Props = $props();
// displayName must be both prop-derived AND locally writable (user typing), so $state + // displayName must be both prop-derived AND locally writable (user typing), so $state +
@@ -107,7 +109,7 @@ function handleKeydown(e: KeyboardEvent) {
bind:value={displayName} bind:value={displayName}
oninput={handleInput} oninput={handleInput}
onkeydown={handleKeydown} 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" 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"
/> />

View File

@@ -40,6 +40,12 @@ describe('TagParentPicker rendering', () => {
await vi.advanceTimersByTimeAsync(0); await vi.advanceTimersByTimeAsync(0);
expect(hiddenInput('parentId')).toBeTruthy(); 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 ─────────────────────────────────────────────────────────────────── // ─── Search ───────────────────────────────────────────────────────────────────