From 8159c3c56284ba70276587729526bee9f2db3008 Mon Sep 17 00:00:00 2001
From: Eric Liu <ericyl.us@gmail.com>
Date: Mon, 21 Feb 2022 08:22:39 -0800
Subject: [PATCH] fix(file-uploader): `FileUploader` change detail should be
 File[]

Fixes #1112
---
 src/FileUploader/FileUploader.svelte       |  5 +++--
 src/FileUploader/FileUploaderButton.svelte | 11 ++++++++++-
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/FileUploader/FileUploader.svelte b/src/FileUploader/FileUploader.svelte
index 08147f47..bbe6fb52 100644
--- a/src/FileUploader/FileUploader.svelte
+++ b/src/FileUploader/FileUploader.svelte
@@ -2,6 +2,7 @@
   /**
    * @event {File[]} add
    * @event {File[]} remove
+   * @event {File[]} change
    */
 
   /**
@@ -95,8 +96,8 @@
     multiple="{multiple}"
     kind="{kind}"
     on:change
-    on:change="{({ target }) => {
-      files = [...target.files];
+    on:change="{(e) => {
+      files = e.detail;
     }}"
   />
   <div class:bx--file-container="{true}">
diff --git a/src/FileUploader/FileUploaderButton.svelte b/src/FileUploader/FileUploaderButton.svelte
index 33cddba9..7bc932e9 100644
--- a/src/FileUploader/FileUploaderButton.svelte
+++ b/src/FileUploader/FileUploaderButton.svelte
@@ -1,4 +1,8 @@
 <script>
+  /**
+   * @event {File[]} change
+   */
+
   /**
    * Specify the accepted file types
    * @type {string[]}
@@ -37,6 +41,10 @@
 
   /** Obtain a reference to the input HTML element */
   export let ref = null;
+
+  import { createEventDispatcher } from "svelte";
+
+  const dispatch = createEventDispatcher();
 </script>
 
 <label
@@ -71,13 +79,14 @@
   name="{name}"
   class:bx--visually-hidden="{true}"
   {...$$restProps}
-  on:change|stopPropagation
   on:change|stopPropagation="{({ target }) => {
     const files = target.files;
     const length = files.length;
     if (files && !disableLabelChanges) {
       labelText = length > 1 ? `${length} files` : files[0].name;
     }
+
+    dispatch('change', [...files]);
   }}"
   on:click
   on:click="{({ target }) => {