feat(plaintext): support preserving arrow delta coordinates (x,y)

Author: SSShooter

skills/plaintext-format/SKILL.md

@@ -52,10 +52,16 @@ Create connections between nodes using the `>` prefix and arrow syntax:
 - Root
   - Node A [^id1]
   - Node B [^id2]
-  - > [^id1] <-Link Label-> [^id2]
+  - > [^id1] (10,20) <-Link Label-> (-10,-20) [^id2]
 ```
 
-**Format:** `> [^sourceId] <-Label-> [^targetId]`
+**Format:** `> [^sourceId] (delta1X,delta1Y) <-Label-> (delta2X,delta2Y) [^targetId]`
+
+- `(delta1X,delta1Y)`: Offset of the control point from the **start** node.
+- `(delta2X,delta2Y)`: Offset of the control point from the **end** node.
+
+> [!TIP]
+> **Optional Coordinates**: When manually writing or generating plaintext (e.g., via AI), you can **omit** the `(x,y)` coordinates. Mind Elixir will automatically calculate default balanced offsets when rendering. However, when you export data back to plaintext, these coordinates will be included to preserve any manual adjustments made in the UI.
 
 #### Unidirectional Links
 
@@ -129,7 +135,7 @@ Create summary nodes that visually group previous siblings:
   - Phase 3: Launch [^phase3]
     - Marketing
     - Deployment
-  - > [^phase1] >-Leads to-> [^phase2]
+  - > [^phase1] (50,0) >-Leads to-> (-50,0) [^phase2]
   - > [^phase2] >-Leads to-> [^phase3]
 ```
 
@@ -271,8 +277,8 @@ function safeParse(plaintext: string): MindElixirData | null {
 | Node               | `- Topic`                   | `- My Node`                   |
 | Node with ID       | `- Topic [^id]`             | `- Node A [^id1]`             |
 | Node with Style    | `- Topic {"prop": "value"}` | `- Node {"color": "#ff0000"}` |
-| Bidirectional Link | `> [^id1] <-Label-> [^id2]` | `> [^a] <-connects-> [^b]`    |
-| Forward Link       | `> [^id1] >-Label-> [^id2]` | `> [^a] >-leads to-> [^b]`    |
+| Bidirectional Link | `> [^id1] (x,y) <-Label-> (x,y) [^id2]` | `> [^a] (10,20) <-connects-> (-10,-20) [^b]` |
+| Forward Link       | `> [^id1] (x,y) >-Label-> (x,y) [^id2]` | `> [^a] (10,20) >-leads to-> (-10,-20) [^b]` |
 | Summary (all)      | `} Summary text`            | `} Overview`                  |
 | Summary (N nodes)  | `}:N Summary text`          | `}:3 Last three items`        |
 

src/dev.ts

@@ -200,6 +200,6 @@ document.querySelector('#ssr')!.innerHTML = renderSSRHTML(layoutSSR(window.m.nod
 const convertedData = plaintextToMindElixir(plaintextExample)
 console.log('convertedData', convertedData)
 mind.refresh(convertedData)
-
+mind.toCenter()
 const plaintext = mindElixirToPlaintext(mind.getData())
 console.log('plaintext', plaintext)

src/utils/mindElixirToPlaintext.ts

@@ -109,7 +109,9 @@ export function mindElixirToPlaintext(data: MindElixirData): string {
         if (el.type === 'arrow') {
           const a = el.arrow
           const connector = a.bidirectional ? `<-${a.label ?? ''}->` : `>-${a.label ?? ''}->`
-          lines.push(`${childIndent}- > [^${getRefId(a.from)}] ${connector} [^${getRefId(a.to)}]`)
+          const d1 = a.delta1 ? ` (${a.delta1.x},${a.delta1.y})` : ''
+          const d2 = a.delta2 ? ` (${a.delta2.x},${a.delta2.y})` : ''
+          lines.push(`${childIndent}- > [^${getRefId(a.from)}]${d1} ${connector}${d2} [^${getRefId(a.to)}]`)
         } else if (el.type === 'summary') {
           const s = el.summary
           const count = s.end - s.start + 1
@@ -129,7 +131,9 @@ export function mindElixirToPlaintext(data: MindElixirData): string {
   // Emit root-level arrows
   for (const a of rootArrows) {
     const connector = a.bidirectional ? `<-${a.label ?? ''}->` : `>-${a.label ?? ''}->`
-    lines.push(`- > [^${getRefId(a.from)}] ${connector} [^${getRefId(a.to)}]`)
+    const d1 = a.delta1 ? ` (${a.delta1.x},${a.delta1.y})` : ''
+    const d2 = a.delta2 ? ` (${a.delta2.x},${a.delta2.y})` : ''
+    lines.push(`- > [^${getRefId(a.from)}]${d1} ${connector}${d2} [^${getRefId(a.to)}]`)
   }
 
   return lines.join('\n') + '\n'

src/utils/plaintextToMindElixir.ts

@@ -245,34 +245,48 @@ function parseLine(line: string): ParsedLine {
 }
 
 function parseArrow(content: string, context: ParseContext): Arrow | null {
-  // Bidirectional: [^id1] <-label-> [^id2]
-  const bidirectionalMatch = content.match(/\[\^([\w-]+)\]\s*<-([^-]*)->\s*\[\^([\w-]+)\]/)
+  // Bidirectional: [^id1] (x,y) <-label-> (x,y) [^id2]
+  const bidirectionalMatch = content.match(
+    /\[\^([\w-]+)\](?:\s*\(([\d.-]+),([\d.-]+)\))?\s*<-([^-]*)->(?:\s*\(([\d.-]+),([\d.-]+)\))?\s*\[\^([\w-]+)\]/
+  )
   if (bidirectionalMatch) {
     const fromRefId = bidirectionalMatch[1]
-    const label = bidirectionalMatch[2].trim()
-    const toRefId = bidirectionalMatch[3]
+    const d1x = bidirectionalMatch[2]
+    const d1y = bidirectionalMatch[3]
+    const label = bidirectionalMatch[4].trim()
+    const d2x = bidirectionalMatch[5]
+    const d2y = bidirectionalMatch[6]
+    const toRefId = bidirectionalMatch[7]
 
     return {
       id: generateUUID(),
       label,
       from: context.nodeIdMap.get(fromRefId) || fromRefId,
       to: context.nodeIdMap.get(toRefId) || toRefId,
+      delta1: d1x && d1y ? { x: Number(d1x), y: Number(d1y) } : undefined,
+      delta2: d2x && d2y ? { x: Number(d2x), y: Number(d2y) } : undefined,
       bidirectional: true,
     } as Arrow
   }
 
-  // Forward: [^id1] >-label-> [^id2]
-  const forwardMatch = content.match(/\[\^([\w-]+)\]\s*>-([^-]*)->\s*\[\^([\w-]+)\]/)
+  // Forward: [^id1] (x,y) >-label-> (x,y) [^id2]
+  const forwardMatch = content.match(/\[\^([\w-]+)\](?:\s*\(([\d.-]+),([\d.-]+)\))?\s*>-([^-]*)->(?:\s*\(([\d.-]+),([\d.-]+)\))?\s*\[\^([\w-]+)\]/)
   if (forwardMatch) {
     const fromRefId = forwardMatch[1]
-    const label = forwardMatch[2].trim()
-    const toRefId = forwardMatch[3]
+    const d1x = forwardMatch[2]
+    const d1y = forwardMatch[3]
+    const label = forwardMatch[4].trim()
+    const d2x = forwardMatch[5]
+    const d2y = forwardMatch[6]
+    const toRefId = forwardMatch[7]
 
     return {
       id: generateUUID(),
       label,
       from: context.nodeIdMap.get(fromRefId) || fromRefId,
       to: context.nodeIdMap.get(toRefId) || toRefId,
+      delta1: d1x && d1y ? { x: Number(d1x), y: Number(d1y) } : undefined,
+      delta2: d2x && d2y ? { x: Number(d2x), y: Number(d2y) } : undefined,
     } as Arrow
   }