feat: editable code block

src/lib/components/workspace/Tools/ToolkitEditor.svelte

@@ -22,6 +22,15 @@
 		description: ''
 	};
 	export let content = '';
+	let _content = '';
+
+	$: if (content) {
+		updateContent();
+	}
+
+	const updateContent = () => {
+		_content = content;
+	};
 
 	$: if (name && !edit && !clone) {
 		id = name.replace(/\s+/g, '_').toLowerCase();
@@ -224,10 +233,14 @@ class Tools:
 
 				<div class="mb-2 flex-1 overflow-auto h-0 rounded-lg">
 					<CodeEditor
-						bind:value={content}
 						bind:this={codeEditor}
+						value={content}
 						{boilerplate}
+						on:change={(e) => {
+							_content = e.detail.value;
+						}}
 						on:save={() => {
+							content = _content;
 							if (formElement) {
 								formElement.requestSubmit();
 							}