split the search bar into its own component

1 files changed, 27 insertions, 0 deletions

diff --git a/src/lib/SearchUser.svelte b/src/lib/SearchUser.svelte
new file mode 100644
index 0000000..3c841ce
--- /dev/null
+++ b/src/lib/SearchUser.svelte
@@ -0,0 +1,27 @@
+<script lang="ts">
+	import { goto } from '$app/navigation'
+
+	export let value = ''
+</script>
+
+<form
+	action="/player"
+	method="post"
+	class="user-form"
+	on:submit={e => {
+		goto(`/player/${value}`)
+		e.preventDefault()
+	}}
+>
+	<input
+		type="text"
+		placeholder="Enter username"
+		name="user-search"
+		autocomplete="off"
+		autocorrect="off"
+		autocapitalize="off"
+		spellcheck="false"
+		aria-label="Enter username"
+		bind:value
+	/>
+</form>