From d0eca28e55467e5fa5b446ca823bf7b4c7d4905f Mon Sep 17 00:00:00 2001
From: June <self@breadone.net>
Date: Sat, 31 Jan 2026 10:03:45 +1300
Subject: [PATCH] Bind working i daresay

---
 src/lib/components/editor/imageTarget.svelte | 16 ++++++++--------
 src/lib/components/editor/index.svelte       |  4 +++-
 2 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/src/lib/components/editor/imageTarget.svelte b/src/lib/components/editor/imageTarget.svelte
index 1efbe07..b63e2e8 100644
--- a/src/lib/components/editor/imageTarget.svelte
+++ b/src/lib/components/editor/imageTarget.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
-    let avatar: string
+    let { image = $bindable('') } = $props()
+    
     let fileinput: HTMLInputElement
     
     const onFileSelected =(e)=>{
@@ -7,7 +8,7 @@
         let reader = new FileReader();
         reader.readAsDataURL(image);
         reader.onload = e => {
-            avatar = e.target.result as string
+            image = e.target.result as string
         };
     }
     
@@ -15,17 +16,16 @@
 
 <div>
     
-    {#if avatar}
-        <button class="h-30 w-full rounded-2xl hover:text-white/30" on:click={()=>{fileinput.click();}}>
-            <img class="avatar rounded-2xl hover:brightness-50 transition-opacity" src="{avatar}" alt="d" />
+    {#if image}
+        <button class="h-30 w-full rounded-2xl hover:text-white/30" onclick={()=>{fileinput.click();}}>
+            <img class="avatar rounded-2xl hover:brightness-50 transition-opacity" src="{image}" alt="d" />
         </button> 
     {:else}
-        <button class="text-center bg-white/30 h-30 w-full rounded-2xl" on:click={()=>{fileinput.click();}}>
+        <button class="text-center bg-white/30 h-30 w-full rounded-2xl" onclick={()=>{fileinput.click();}}>
             Select Image
         </button> 
     {/if}
-    
 
-    <input style="display:none" type="file" accept=".jpg, .jpeg, .png" on:change={(e)=>onFileSelected(e)} bind:this={fileinput} >
+    <input style="display:none" type="file" accept=".jpg, .jpeg, .png" onchange={(e)=>onFileSelected(e)} bind:this={fileinput} >
 
 </div>
\ No newline at end of file
diff --git a/src/lib/components/editor/index.svelte b/src/lib/components/editor/index.svelte
index 6b28285..30c8229 100644
--- a/src/lib/components/editor/index.svelte
+++ b/src/lib/components/editor/index.svelte
@@ -1,5 +1,7 @@
 <script lang="ts">
     import ImageTarget from "./imageTarget.svelte"
+    
+    let image = $state('')
 </script>
 
-<ImageTarget />
\ No newline at end of file
+<ImageTarget  bind:image />
\ No newline at end of file