save note size and position

frontend/src/lib/components/graph/FlowGraphV2.svelte

@@ -424,6 +424,14 @@
 		updateStores()
 	}
 
+	function updateNotePosition(noteId: string, position: { x: number; y: number }) {
+		notes = notes.map((note) => (note.id === noteId ? { ...note, position } : note))
+	}
+
+	function updateNoteSize(noteId: string, size: { width: number; height: number }) {
+		notes = notes.map((note) => (note.id === noteId ? { ...note, size } : note))
+	}
+
 	function convertNotesToNodes(): Node[] {
 		return notes.map((note) => ({
 			id: note.id,
@@ -433,12 +441,13 @@
 				text: note.text,
 				color: note.color,
 				onUpdate: (text: string) => updateNoteText(note.id, text),
-				onDelete: () => deleteNote(note.id)
+				onDelete: () => deleteNote(note.id),
+				onSizeChange: (size: { width: number; height: number }) => updateNoteSize(note.id, size)
 			},
 			style: `width: ${note.size.width}px; height: ${note.size.height}px;`,
 			width: note.size.width,
 			height: note.size.height,
-			zIndex: 1,
+			zIndex: -2000,
 			draggable: true,
 			selectable: true
 		}))
@@ -635,6 +644,12 @@
 				onpaneclick={() => {
 					document.dispatchEvent(new Event('focus'))
 				}}
+				onnodedragstop={(event) => {
+					const node = event.targetNode
+					if (node && node.type === 'note') {
+						updateNotePosition(node.id, node.position)
+					}
+				}}
 				{nodes}
 				{edges}
 				{edgeTypes}

frontend/src/lib/components/graph/renderers/nodes/NoteNode.svelte

@@ -9,6 +9,7 @@
 			color: string
 			onUpdate?: (text: string) => void
 			onDelete?: () => void
+			onSizeChange?: (size: { width: number; height: number }) => void
 		}
 		selected?: boolean
 		dragging?: boolean
@@ -90,6 +91,12 @@
 		minHeight={100}
 		lineClass="!border-4 !border-transparent !rounded-md"
 		handleClass="!bg-transparent !w-4 !h-4 !border-none !rounded-md"
+		onResizeEnd={(_, params) => {
+			// Update note size when resizing ends
+			if (data.onSizeChange && params.width !== undefined && params.height !== undefined) {
+				data.onSizeChange({ width: params.width, height: params.height })
+			}
+		}}
 	/>
 </div>