add custom invalid message on admin report create popup user input and fix search component validity check

src/lib/components/Input/Search.svelte

@@ -5,6 +5,7 @@
 	export let searchSuggestionFunc: (
 		input: string
 	) => Promise<{ name: string; value: string }[]> = () => Promise.resolve([]);
+	export let invalidMessage: string | null = null;
 	export let size: 'xs' | 'sm' | 'md' | 'lg' = 'md';
 	export let label: string | null = null;
 	export let required = false;
@@ -32,21 +33,26 @@
 			class:input-xs={size === 'xs'}
 			class:input-sm={size === 'sm'}
 			class:input-md={size === 'md'}
-			class:input-lg={size === 'md'}
+			class:input-lg={size === 'lg'}
 			{id}
 			{required}
 			bind:value={inputValue}
-			on:input={() => {
+			on:input={(e) => {
 				value = '';
 				searchSuggestionFunc(inputValue).then((v) => {
 					searchSuggestions = v;
-					let searchSuggestionValue = v.find((v) => v.name === inputValue);
-					if (searchSuggestionValue !== undefined) {
-						value = searchSuggestionValue.value;
+					const searchSuggestion = v.find((v) => v.name === inputValue);
+					if (searchSuggestion !== undefined) {
+						inputValue = searchSuggestion.name;
+						value = searchSuggestion.value;
 						searchSuggestions = [];
+						e.target?.setCustomValidity('');
 					}
 				});
 			}}
+			on:invalid={(e) => {
+				if (invalidMessage != null) e.target?.setCustomValidity(invalidMessage);
+			}}
 			pattern={suggestionRequired ? `${value ? inputValue : 'a^'}` : null}
 		/>
 	</div>

src/routes/admin/reports/NewReportModal.svelte

@@ -58,6 +58,7 @@
 				size="sm"
 				suggestionRequired={true}
 				searchSuggestionFunc={usernameSuggestions}
+				invalidMessage="Es können nur registrierte Spieler Report Autoren sein"
 				label="Reporter"
 				required={true}
 				bind:value={reporter}
@@ -66,6 +67,7 @@
 				size="sm"
 				suggestionRequired={true}
 				searchSuggestionFunc={usernameSuggestions}
+				invalidMessage="Es können nur registrierte Spieler reportet werden"
 				label="Reporteter User"
 				required={true}
 				bind:value={reported}