working on patching vcards

frontend/src/routes/contact/FN.svelte

@@ -1,12 +1,18 @@
 <script>
+    import LineEditor from '../../Components/LineEditor.svelte';
     import { fn } from '../../vcard.js';
     import { t }  from '../../translations.svelte';
 
-    let { vcard } = $props();
+    let { code, patch = (from, to) => true } = $props();
 
-    let name = $derived(fn(vcard));
+    let name = $derived(fn(code));
+
+    function onSet(newVal){
+        const newCode = code.replace(name,newVal);
+        return patch(code,newCode);
+    }
 </script>
 
 {#if name}
-<span class="formatted name">{name}</span>
+<LineEditor type="span" editable={true} value={name} {onSet} />
 {/if}