working on document editor

frontend/src/Components/LineEditor.svelte

@@ -0,0 +1,19 @@
+<script>
+    let { editable = false, value = $bindable(null) } = $props();
+    let editing = $state(false);
+
+    function toggleEdit(){
+        editing = !editing;
+    }
+
+    function typed(ev){
+        if (ev.keyCode == 13) toggleEdit();
+    }
+</script>
+
+{#if editable && editing}
+<input bind:value onkeyup={typed} />
+{:else}
+<div onclick={toggleEdit}>{value}</div>
+{/if}
+

frontend/src/Components/MarkdownEditor.svelte

@@ -0,0 +1,20 @@
+<script>
+    let { editable = false, value = $bindable(null) } = $props();
+    let editing = $state(false);
+
+    function toggleEdit(){
+        editing = !editing;
+    }
+</script>
+
+<style>
+    textarea{
+        width: 100%;
+        min-height: 100px;
+    }
+</style>
+
+{#if editable && editing}
+<textarea bind:value></textarea>
+{/if}
+<div onclick={toggleEdit}>{@html value}</div>

frontend/src/Components/PriceEditor.svelte

@@ -0,0 +1,29 @@
+<script>
+    let { editable = false, currency, value = $bindable(null) } = $props();
+    let editing = $state(false);
+
+    function toggleEdit(){
+        editing = !editing;
+        if (editing){
+            value /= 100;
+        }
+    }
+
+    function typed(ev){
+        if (ev.keyCode == 13) {
+            toggleEdit();
+            value *= 100;
+        }
+    }
+</script>
+
+<style>
+    input{width:100px}
+</style>
+
+{#if editable && editing}
+<input type="number" step=".01" bind:value onkeyup={typed} />&nbsp;{currency}
+{:else}
+<div onclick={toggleEdit}>{Number(value/100).toFixed(2)}&nbsp;{currency}</div>
+{/if}
+