fix(file-uploader): FileUploader change detail should be File[]

Fixes #1112
This commit is contained in:
Eric Liu 2022-02-21 08:22:39 -08:00
commit 8159c3c562
2 changed files with 13 additions and 3 deletions

View file

@ -2,6 +2,7 @@
/** /**
* @event {File[]} add * @event {File[]} add
* @event {File[]} remove * @event {File[]} remove
* @event {File[]} change
*/ */
/** /**
@ -95,8 +96,8 @@
multiple="{multiple}" multiple="{multiple}"
kind="{kind}" kind="{kind}"
on:change on:change
on:change="{({ target }) => { on:change="{(e) => {
files = [...target.files]; files = e.detail;
}}" }}"
/> />
<div class:bx--file-container="{true}"> <div class:bx--file-container="{true}">

View file

@ -1,4 +1,8 @@
<script> <script>
/**
* @event {File[]} change
*/
/** /**
* Specify the accepted file types * Specify the accepted file types
* @type {string[]} * @type {string[]}
@ -37,6 +41,10 @@
/** Obtain a reference to the input HTML element */ /** Obtain a reference to the input HTML element */
export let ref = null; export let ref = null;
import { createEventDispatcher } from "svelte";
const dispatch = createEventDispatcher();
</script> </script>
<label <label
@ -71,13 +79,14 @@
name="{name}" name="{name}"
class:bx--visually-hidden="{true}" class:bx--visually-hidden="{true}"
{...$$restProps} {...$$restProps}
on:change|stopPropagation
on:change|stopPropagation="{({ target }) => { on:change|stopPropagation="{({ target }) => {
const files = target.files; const files = target.files;
const length = files.length; const length = files.length;
if (files && !disableLabelChanges) { if (files && !disableLabelChanges) {
labelText = length > 1 ? `${length} files` : files[0].name; labelText = length > 1 ? `${length} files` : files[0].name;
} }
dispatch('change', [...files]);
}}" }}"
on:click on:click
on:click="{({ target }) => { on:click="{({ target }) => {