From 0f318aac7732c2b94ec0729d54416611fbd0d493 Mon Sep 17 00:00:00 2001
From: Eric Liu <ericyl.us@gmail.com>
Date: Sat, 24 Feb 2024 13:36:17 -0800
Subject: [PATCH] fix(image-loader): updated `src` should update the image

Fixes #1677

The `ImageLoader` image should correctly update if `src` changes.
---
 src/ImageLoader/ImageLoader.svelte | 38 +++++++++++++++++-------------
 1 file changed, 21 insertions(+), 17 deletions(-)

diff --git a/src/ImageLoader/ImageLoader.svelte b/src/ImageLoader/ImageLoader.svelte
index f1250576..5e054a67 100644
--- a/src/ImageLoader/ImageLoader.svelte
+++ b/src/ImageLoader/ImageLoader.svelte
@@ -80,23 +80,7 @@
   {#if loading}
     <slot name="loading" />
   {/if}
-  {#if loaded}
-    <img
-      style:width="100%"
-      {...$$restProps}
-      src="{src}"
-      alt="{alt}"
-      transition:fade|local="{{ duration: fadeIn ? fast02 : 0 }}"
-    />
-  {/if}
-  {#if error}
-    <slot name="error" />
-  {/if}
-{:else}
-  <AspectRatio ratio="{ratio}">
-    {#if loading}
-      <slot name="loading" />
-    {/if}
+  {#key src}
     {#if loaded}
       <img
         style:width="100%"
@@ -106,6 +90,26 @@
         transition:fade|local="{{ duration: fadeIn ? fast02 : 0 }}"
       />
     {/if}
+  {/key}
+  {#if error}
+    <slot name="error" />
+  {/if}
+{:else}
+  <AspectRatio ratio="{ratio}">
+    {#if loading}
+      <slot name="loading" />
+    {/if}
+    {#key src}
+      {#if loaded}
+        <img
+          style:width="100%"
+          {...$$restProps}
+          src="{src}"
+          alt="{alt}"
+          transition:fade|local="{{ duration: fadeIn ? fast02 : 0 }}"
+        />
+      {/if}
+    {/key}
     {#if error}
       <slot name="error" />
     {/if}