Appwrite/console
1
0
Fork 0
mirror of https://github.com/appwrite/console.git synced 2026-06-06 19:27:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: file input element and state not syncing

Browse Source
This commit is contained in:
tglide
2023-02-23 16:52:34 +00:00
parent 46de1b802a
commit affc5298a5
1 changed files with 19 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/elements/forms/inputFile.svelte
+19 -10
View File
@@ -6,7 +6,7 @@
export let label: string = null;
export let files: FileList;
export let list = new DataTransfer();
export let allowedFileExtensions: string[] = [];
export let maxSize: number = null;
export let required = false;
@@ -15,16 +15,25 @@
let input: HTMLInputElement;
let hovering = false;
function setFiles(value: FileList) {
files = value;
input.files = value;
}
function resetFiles() {
setFiles(new DataTransfer().files);
}
function dropHandler(ev: DragEvent) {
ev.dataTransfer.dropEffect = 'move';
hovering = false;
if (ev.dataTransfer.items) {
for (let i = 0; i < ev.dataTransfer.items.length; i++) {
if (ev.dataTransfer.items[i].kind === 'file') {
list.items.clear();
list.items.add(ev.dataTransfer.items[i].getAsFile());
files = list.files;
}
if (!ev.dataTransfer.items) return;
for (let i = 0; i < ev.dataTransfer.items.length; i++) {
if (ev.dataTransfer.items[i].kind === 'file') {
const dataTransfer = new DataTransfer();
dataTransfer.items.add(ev.dataTransfer.items[i].getAsFile());
setFiles(dataTransfer.files);
}
}
}
@@ -50,7 +59,7 @@
$: fileArray = files?.length ? Array.from(files) : [];
onMount(() => {
input.files = files;
setFiles(files);
});
</script>
@@ -128,7 +137,7 @@
{fileSize.value + fileSize.unit}
</span>
<button
on:click={() => (files = null)}
on:click={resetFiles}
type="button"
class="button is-text is-only-icon u-margin-inline-start-auto"
aria-label="remove file"