Spaces:
Running
Running
File size: 954 Bytes
241ba68 a1a6daf 241ba68 564e576 241ba68 564e576 241ba68 0031e51 241ba68 a1a6daf fd7f926 241ba68 564e576 241ba68 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
<script lang="ts">
import CarbonUpload from "~icons/carbon/upload";
interface Props {
classNames?: string;
files: File[];
mimeTypes: string[];
}
let { classNames = "", files = $bindable(), mimeTypes }: Props = $props();
/**
* Due to a bug with Svelte, we cannot use bind:files with multiple
* So we use this workaround
**/
const onFileChange = (e: Event) => {
if (!e.target) return;
const target = e.target as HTMLInputElement;
files = [...files, ...(target.files ?? [])];
};
</script>
<button
class="btn relative h-8 rounded-lg border bg-white px-3 py-1 text-sm text-gray-500 shadow-sm hover:bg-gray-100 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-300 dark:hover:bg-gray-600 {classNames}"
>
<input
class="absolute w-full cursor-pointer opacity-0"
aria-label="Upload file"
type="file"
onchange={onFileChange}
accept={mimeTypes.join(",")}
/>
<CarbonUpload class="mr-2 text-xxs" /> Upload file
</button>
|