Mostly get drag and drop working

src/lib/components/FileUpload.svelte

@@ -1,5 +1,7 @@
 <script lang="ts">
-	export let files: FileList | null | undefined = undefined;
+	import { A, Fileupload, Label } from 'flowbite-svelte';
+
+	export let files: FileList | undefined = undefined;
 	export let onUpload: ((files: FileList) => void) | undefined = undefined;
 
 	let input: HTMLInputElement;
@@ -13,38 +15,15 @@
 	function onClick() {
 		input.click();
 	}
-
-	function onDrop(event: DragEvent) {
-		const items = event.dataTransfer?.items;
-		// TODO
-	}
 </script>
 
-<input type="file" bind:files bind:this={input} on:change={handleChange} {...$$restProps} />
+<input
+	type="file"
+	bind:files
+	bind:this={input}
+	on:change={handleChange}
+	{...$$restProps}
+	class="hidden"
+/>
 
-<button
-	on:click={onClick}
-	on:dragover|preventDefault
-	on:drop|preventDefault|stopPropagation={onDrop}
->
-	<p><slot>Upload</slot></p>
-</button>
-
-<style lang="scss">
-	input {
-		display: none;
-	}
-
-	button {
-		width: 100%;
-		height: 100px;
-		border-radius: 12px;
-		border: 2px dashed $secondary-color;
-	}
-
-	p {
-		font-weight: bold;
-		font-size: 16px;
-		color: $secondary-color;
-	}
-</style>
+<A on:click={onClick}><slot>Upload</slot></A>