<script>
import { FileDrop } from 'svelte-droplet'
let droppedFiles = []
function handleFiles(files) {
droppedFiles = files
}
</script>
<FileDrop {handleFiles} let:droppable>
<div class="zone" class:droppable>Select or drop files here</div>
</FileDrop>
{#each droppedFiles as file}
{file.name}
{/each}
<style>
.zone {
background-color: #eeeeee;
padding: 30px;
border: 2px solid #dddddd;
}
.droppable {
border-color: #1f79ff;
}
</style>