synabun 1.3.0 → 2.0.0-beta

package/neural-interface/package.json

@@ -1,27 +1,58 @@
-{
-  "name": "neural-memory-interface",
-  "version": "1.0.0",
-  "description": "3D neural visualization of Claude's memory system",
-  "type": "module",
-  "engines": {
-    "node": ">=22.5.0"
-  },
-  "main": "server.js",
-  "scripts": {
-    "start": "node server.js",
-    "dev": "node --watch server.js",
-    "postinstall": "node scripts/rebuild-pty.js"
-  },
-  "dependencies": {
-    "@anthropic-ai/claude-code": "^2.1.71",
-    "@huggingface/transformers": "^3.0.0",
-    "adm-zip": "^0.5.16",
-    "archiver": "^7.0.1",
-    "dotenv": "^16.4.7",
-    "express": "^4.21.2",
-    "node-html-markdown": "^2.0.0",
-    "node-pty": "^1.1.0",
-    "playwright": "^1.58.2",
-    "ws": "^8.19.0"
-  }
-}
+{
+  "name": "neural-memory-interface",
+  "version": "2.0.0",
+  "private": true,
+  "description": "Private local SynaBun interface for memory visualization and multi-agent workflows",
+  "license": "Apache-2.0",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/danilokhury/Synabun.git",
+    "directory": "neural-interface"
+  },
+  "type": "module",
+  "engines": {
+    "node": ">=22.19.0"
+  },
+  "main": "server.js",
+  "scripts": {
+    "start": "node server.js",
+    "dev": "node --watch server.js",
+    "test": "node --test tests/*.test.mjs",
+    "build:vendor": "node scripts/build-vendor.mjs",
+    "postinstall": "node scripts/rebuild-pty.js && node scripts/build-vendor.mjs"
+  },
+  "dependencies": {
+    "@anthropic-ai/claude-agent-sdk": "0.3.288",
+    "@huggingface/transformers": "^3.0.0",
+    "@openai/codex-sdk": "^0.160.0",
+    "@opencode-ai/sdk": "1.18.34",
+    "@xterm/addon-fit": "0.11.0",
+    "@xterm/addon-search": "0.16.0",
+    "@xterm/addon-serialize": "0.14.0",
+    "@xterm/addon-unicode11": "0.9.0",
+    "@xterm/addon-web-links": "0.12.0",
+    "@xterm/addon-webgl": "0.19.0",
+    "@xterm/headless": "6.0.0",
+    "@xterm/xterm": "6.0.0",
+    "adm-zip": "^0.6.0",
+    "archiver": "^7.0.1",
+    "dotenv": "^16.4.7",
+    "express": "^4.21.2",
+    "node-html-markdown": "^2.0.0",
+    "node-pty": "^1.1.0",
+    "playwright": "^1.59.1",
+    "undici": "^8.5.0",
+    "ws": "^8.21.0",
+    "zod": "^4.4.3"
+  },
+  "overrides": {
+    "brace-expansion": "^2.1.2",
+    "lodash": "^4.18.1",
+    "protobufjs": "^7.6.5",
+    "tar": "^7.5.19"
+  },
+  "devDependencies": {
+    "esbuild": "^0.28.1",
+    "three": "0.169.0"
+  }
+}

package/neural-interface/public/claude.svg

@@ -0,0 +1 @@
+<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Claude</title><path d="M4.709 15.955l4.72-2.647.08-.23-.08-.128H9.2l-.79-.048-2.698-.073-2.339-.097-2.266-.122-.571-.121L0 11.784l.055-.352.48-.321.686.06 1.52.103 2.278.158 1.652.097 2.449.255h.389l.055-.157-.134-.098-.103-.097-2.358-1.596-2.552-1.688-1.336-.972-.724-.491-.364-.462-.158-1.008.656-.722.881.06.225.061.893.686 1.908 1.476 2.491 1.833.365.304.145-.103.019-.073-.164-.274-1.355-2.446-1.446-2.49-.644-1.032-.17-.619a2.97 2.97 0 01-.104-.729L6.283.134 6.696 0l.996.134.42.364.62 1.414 1.002 2.229 1.555 3.03.456.898.243.832.091.255h.158V9.01l.128-1.706.237-2.095.23-2.695.08-.76.376-.91.747-.492.584.28.48.685-.067.444-.286 1.851-.559 2.903-.364 1.942h.212l.243-.242.985-1.306 1.652-2.064.73-.82.85-.904.547-.431h1.033l.76 1.129-.34 1.166-1.064 1.347-.881 1.142-1.264 1.7-.79 1.36.073.11.188-.02 2.856-.606 1.543-.28 1.841-.315.833.388.091.395-.328.807-1.969.486-2.309.462-3.439.813-.042.03.049.061 1.549.146.662.036h1.622l3.02.225.79.522.474.638-.079.485-1.215.62-1.64-.389-3.829-.91-1.312-.329h-.182v.11l1.093 1.068 2.006 1.81 2.509 2.33.127.578-.322.455-.34-.049-2.205-1.657-.851-.747-1.926-1.62h-.128v.17l.444.649 2.345 3.521.122 1.08-.17.353-.608.213-.668-.122-1.374-1.925-1.415-2.167-1.143-1.943-.14.08-.674 7.254-.316.37-.729.28-.607-.461-.322-.747.322-1.476.389-1.924.315-1.53.286-1.9.17-.632-.012-.042-.14.018-1.434 1.967-2.18 2.945-1.726 1.845-.414.164-.717-.37.067-.662.401-.589 2.388-3.036 1.44-1.882.93-1.086-.006-.158h-.055L4.132 18.56l-1.13.146-.487-.456.061-.746.231-.243 1.908-1.312-.006.006z"></path></svg>

package/neural-interface/public/index.html

@@ -14,199 +14,49 @@
 <link href="https://fonts.googleapis.com/css2?family=Caveat:wght@400;700&family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Space+Grotesk:wght@500;600;700&display=swap" rel="stylesheet">
 <link href="https://db.onlinewebfonts.com/c/3284c3a32cf946466fb963369b3c5b2d?family=Disket+Mono" rel="stylesheet">
 <link rel="stylesheet" href="/shared/styles.css">
-<style>
-  /* ═══════════════════════════════════════════
-     3D VARIANT — Camera HUD
-     ═══════════════════════════════════════════ */
-  #camera-hud {
-    display: none !important;
-    flex-direction: column;
-    align-items: center;
-    gap: 0;
-    pointer-events: none;
-    opacity: 0;
-    transition: opacity 0.4s;
-    font-family: 'SF Mono', 'Fira Code', 'JetBrains Mono', monospace;
-  }
-  #camera-hud.visible { opacity: 1; pointer-events: auto; }
-  #camera-hud.pinned { opacity: 1; pointer-events: auto; }
-  #camera-hud.dragging { transition: none; }
-
-  .cam-card {
-    width: 140px;
-    background: rgba(18,18,20,0.65);
-    backdrop-filter: blur(24px);
-    border: 1px solid rgba(255,255,255,0.06);
-    border-radius: 12px;
-    padding: 12px 14px 10px;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    gap: 10px;
-    position: relative;
-  }
-
-  .cam-pin {
-    position: absolute; top: 6px; right: 6px;
-    width: 20px; height: 20px;
-    display: flex; align-items: center; justify-content: center;
-    border-radius: 4px; background: transparent;
-    border: 1px solid transparent; cursor: pointer;
-    pointer-events: auto; opacity: 0;
-    transition: opacity 0.2s, background 0.15s, border-color 0.15s;
-    z-index: 5; padding: 0;
+<!-- three.js is vendored (scripts/build-vendor.mjs); only the map renderer imports it.
+     The import map must come before any module load, the preload included. -->
+<script type="importmap">
+{
+  "imports": {
+    "three": "/vendor/three/three-0.169.0.min.js"
   }
-  .cam-card:hover .cam-pin, #camera-hud.pinned .cam-pin { opacity: 1; }
-  .cam-pin:hover { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.1); }
-  .cam-pin svg { width: 11px; height: 11px; stroke: rgba(255,255,255,0.3); fill: none; stroke-width: 2; transform: rotate(45deg); transition: stroke 0.15s, fill 0.15s, transform 0.15s; }
-  .cam-pin:hover svg { stroke: rgba(255,255,255,0.5); }
-  #camera-hud.pinned .cam-pin svg { stroke: rgba(110,200,255,0.7); fill: rgba(110,200,255,0.15); transform: rotate(0deg); }
-
-  .cam-drag-grip { width: 24px; height: 3px; border-radius: 2px; background: rgba(255,255,255,0.06); margin: -2px auto 0; cursor: grab; pointer-events: auto; transition: background 0.2s; }
-  .cam-card:hover .cam-drag-grip { background: rgba(255,255,255,0.12); }
-  .cam-drag-grip:active { cursor: grabbing; background: rgba(110,200,255,0.25); }
-
-  .cam-compass { width: 80px; height: 80px; position: relative; }
-  .cam-compass svg { width: 100%; height: 100%; }
-  .compass-ring { fill: none; stroke: rgba(255,255,255,0.08); stroke-width: 1.5; }
-  .compass-tick { stroke: rgba(255,255,255,0.2); stroke-width: 1; }
-  .compass-tick-major { stroke: rgba(255,255,255,0.4); stroke-width: 1.5; }
-  .compass-label { fill: rgba(255,255,255,0.35); font-size: 7px; font-weight: 600; text-anchor: middle; dominant-baseline: central; }
-  .compass-label-n { fill: rgba(110,200,255,0.7); }
-  .compass-needle { fill: rgba(110,200,255,0.6); transition: none; }
-  .compass-center { fill: rgba(255,255,255,0.15); }
-  .compass-fov { fill: rgba(110,200,255,0.06); stroke: rgba(110,200,255,0.15); stroke-width: 0.5; }
-
-  .cam-divider { width: 100%; height: 1px; background: rgba(255,255,255,0.06); }
-  .cam-controls-row { display: flex; align-items: center; gap: 12px; }
-
-  .cam-keys { display: grid; grid-template-columns: repeat(3, 22px); grid-template-rows: repeat(2, 22px); gap: 2px; }
-  .cam-key { width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; border-radius: 4px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); color: rgba(255,255,255,0.25); font-size: 9px; font-weight: 600; transition: background 0.1s, color 0.1s, border-color 0.1s, box-shadow 0.1s; }
-  .cam-key.active { background: rgba(110,200,255,0.15); border-color: rgba(110,200,255,0.35); color: rgba(110,200,255,0.9); box-shadow: 0 0 8px rgba(110,200,255,0.15); }
-
-  .cam-altitude { display: flex; flex-direction: column; align-items: center; gap: 4px; }
-  .alt-label { font-size: 8px; color: rgba(255,255,255,0.25); text-transform: uppercase; letter-spacing: 0.08em; }
-  .alt-bar-v { width: 3px; height: 32px; background: rgba(255,255,255,0.06); border-radius: 2px; position: relative; overflow: hidden; display: flex; flex-direction: column-reverse; }
-  .alt-fill-v { width: 100%; background: linear-gradient(0deg, rgba(110,200,255,0.4), rgba(110,200,255,0.7)); border-radius: 2px; transition: height 0.1s; }
-  .alt-value { font-size: 9px; color: rgba(255,255,255,0.4); font-variant-numeric: tabular-nums; min-width: 28px; text-align: center; }
-
-  .cam-speed { font-size: 9px; color: rgba(255,255,255,0.25); letter-spacing: 0.06em; text-align: center; }
-  .cam-speed .boost { color: rgba(255,180,60,0.7); }
-
+}
+</script>
+<link rel="modulepreload" href="/vendor/three/three-0.169.0.min.js">
+<style>
   /* ═══════════════════════════════════════════
-     3D VARIANT — Controls Panel
+     3D VARIANT — Memory map
      ═══════════════════════════════════════════ */
-  #controls-panel {
-    position: fixed; bottom: 52px; right: 12px; width: 190px; z-index: 90;
-    border-radius: 10px; overflow: hidden;
-    background: rgba(28,28,30,0.72); backdrop-filter: blur(40px) saturate(1.4); -webkit-backdrop-filter: blur(40px) saturate(1.4);
-    border: 1px solid rgba(255,255,255,0.06); box-shadow: 0 2px 20px rgba(0,0,0,0.4);
-    padding: 12px 14px; transition: opacity 0.2s; display: none;
+  #graph-container { background: #07080b; }
+  #map-status {
+    position: absolute; top: 14px; left: 50%; transform: translate(-50%, -6px);
+    padding: 6px 14px; border-radius: 999px; z-index: 5; pointer-events: none;
+    font: 500 12px Inter, system-ui, sans-serif; letter-spacing: 0.02em;
+    color: rgba(230,236,250,0.85); background: rgba(14,16,22,0.72);
+    border: 1px solid rgba(255,255,255,0.08); backdrop-filter: blur(8px);
+    opacity: 0; transition: opacity 0.25s, transform 0.25s;
   }
-  #controls-panel.visible { display: block; }
-  #controls-panel .ctrl-title { font-size: 9px; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase; color: rgba(255,255,255,0.25); margin-bottom: 8px; }
-  #controls-panel .ctrl-section { margin-bottom: 8px; }
-  #controls-panel .ctrl-section:last-child { margin-bottom: 0; }
-  #controls-panel .ctrl-section-label { font-size: 8px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255,255,255,0.15); margin-bottom: 5px; }
-  #controls-panel .ctrl-row { display: flex; align-items: center; gap: 8px; margin-bottom: 3px; }
-  #controls-panel .ctrl-row:last-child { margin-bottom: 0; }
-  #controls-panel .ctrl-keys { display: flex; gap: 2px; flex-shrink: 0; }
-  #controls-panel .ctrl-key { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 18px; padding: 0 4px; font-size: 9px; font-weight: 600; font-family: 'SF Mono', 'Fira Code', monospace; color: rgba(255,255,255,0.45); background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.08); border-radius: 3px; }
-  #controls-panel .ctrl-desc { font-size: 10px; color: rgba(255,255,255,0.3); white-space: nowrap; }
+  #map-status.visible { opacity: 1; transform: translate(-50%, 0); }
+  #map-status.error { color: rgba(255,190,170,0.9); }
 </style>
 <script>if('serviceWorker' in navigator)navigator.serviceWorker.register('/sw.js').catch(()=>{})</script>
+<script>
+  // Start both data requests before any module loads: the map paints as soon as
+  // /api/map lands, and the memory list is already on its way.
+  window.__synPrefetch = {
+    map: fetch('/api/map').then((r) => r.ok ? r.json().then((j) => { j._etag = r.headers.get('ETag'); return j; }) : null).catch(() => null),
+    memories: fetch('/api/memories?links=false&fields=graph')
+      .then((r) => r.ok ? r.json() : { error: new Error('HTTP ' + r.status) })
+      .catch((error) => ({ error })),
+  };
+</script>
 </head>
 <body>
 
-<!-- 3D-only: Camera HUD -->
-<div id="camera-hud">
-  <div class="cam-card">
-    <button class="cam-pin" id="cam-pin-btn" title="Pin HUD"><svg viewBox="0 0 24 24"><path d="M9 4v4.5L7.5 10H6v2h4v7l2 1 2-1v-7h4v-2h-1.5L15 8.5V4H9z" stroke-linejoin="round" stroke-linecap="round"/></svg></button>
-    <div class="cam-drag-grip" id="cam-drag-grip"></div>
-    <div class="cam-compass">
-      <svg viewBox="0 0 72 72">
-        <circle class="compass-ring" cx="36" cy="36" r="32"/>
-        <g id="compass-ticks"></g>
-        <path id="compass-fov" class="compass-fov" d=""/>
-        <polygon id="compass-needle" class="compass-needle" points="36,8 34,16 38,16"/>
-        <circle class="compass-center" cx="36" cy="36" r="2.5"/>
-        <text class="compass-label compass-label-n" x="36" y="6">N</text>
-        <text class="compass-label" x="66" y="37">E</text>
-        <text class="compass-label" x="36" y="69">S</text>
-        <text class="compass-label" x="6" y="37">W</text>
-      </svg>
-    </div>
-    <div class="cam-divider"></div>
-    <div class="cam-controls-row">
-      <div class="cam-keys">
-        <div class="cam-key" id="key-q">Q</div>
-        <div class="cam-key" id="key-w">W</div>
-        <div class="cam-key" id="key-e">E</div>
-        <div class="cam-key" id="key-a">A</div>
-        <div class="cam-key" id="key-s">S</div>
-        <div class="cam-key" id="key-d">D</div>
-      </div>
-      <div class="cam-altitude">
-        <span class="alt-label">ALT</span>
-        <div class="alt-bar-v"><div class="alt-fill-v" id="alt-fill"></div></div>
-        <span class="alt-value" id="alt-value">0</span>
-      </div>
-    </div>
-    <div class="cam-speed" id="cam-speed-label">MOVE</div>
-  </div>
-</div>
-
-<!-- 3D-only: Controls Reference Panel -->
-<div id="controls-panel">
-  <div class="ctrl-title">3D Controls</div>
-  <div class="ctrl-section">
-    <div class="ctrl-section-label">Movement</div>
-    <div class="ctrl-row"><div class="ctrl-keys"><span class="ctrl-key">W</span><span class="ctrl-key">A</span><span class="ctrl-key">S</span><span class="ctrl-key">D</span></div><span class="ctrl-desc">Move</span></div>
-    <div class="ctrl-row"><div class="ctrl-keys"><span class="ctrl-key">Q</span></div><span class="ctrl-desc">Down</span></div>
-    <div class="ctrl-row"><div class="ctrl-keys"><span class="ctrl-key">E</span></div><span class="ctrl-desc">Up</span></div>
-    <div class="ctrl-row"><div class="ctrl-keys"><span class="ctrl-key">Shift</span></div><span class="ctrl-desc">Boost 3x</span></div>
-  </div>
-  <div class="ctrl-section">
-    <div class="ctrl-section-label">Camera</div>
-    <div class="ctrl-row"><div class="ctrl-keys"><span class="ctrl-key">L-Drag</span></div><span class="ctrl-desc">Rotate</span></div>
-    <div class="ctrl-row"><div class="ctrl-keys"><span class="ctrl-key">R-Drag</span></div><span class="ctrl-desc">Pan</span></div>
-    <div class="ctrl-row"><div class="ctrl-keys"><span class="ctrl-key">Scroll</span></div><span class="ctrl-desc">Zoom</span></div>
-  </div>
-</div>
-
 <!-- html2canvas for card screenshot MCP tool -->
 <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js" defer></script>
 
-<!-- 3D CDN dependencies (loaded as globals before module) -->
-<script type="importmap">
-{
-  "imports": {
-    "three": "https://esm.sh/three@0.169.0",
-    "three/addons/": "https://esm.sh/three@0.169.0/examples/jsm/",
-    "@tweenjs/tween.js": "https://esm.sh/@tweenjs/tween.js@23.1.3"
-  }
-}
-</script>
-<script type="module">
-  // Load 3D deps as globals (variant modules expect THREE, TWEEN, OrbitControls, etc.)
-  import * as THREE from 'three';
-  import { UnrealBloomPass } from 'three/addons/postprocessing/UnrealBloomPass.js';
-  import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
-  import { EffectComposer } from 'three/addons/postprocessing/EffectComposer.js';
-  import { RenderPass } from 'three/addons/postprocessing/RenderPass.js';
-  import { OutputPass } from 'three/addons/postprocessing/OutputPass.js';
-  import TWEEN from '@tweenjs/tween.js';
-
-  window.THREE = THREE;
-  window.UnrealBloomPass = UnrealBloomPass;
-  window.OrbitControls = OrbitControls;
-  window.EffectComposer = EffectComposer;
-  window.RenderPass = RenderPass;
-  window.OutputPass = OutputPass;
-  window.TWEEN = TWEEN;
-
-  // Boot the 3D variant
-  await import('/variant/3d/main.js');
-</script>
+<script type="module" src="/variant/3d/main.js"></script>
 </body>
 </html>

package/neural-interface/public/index2d.html

@@ -41,8 +41,8 @@
     overflow: hidden;
     border: 1px solid rgba(255,255,255,0.06);
     background: rgba(28,28,30,0.72);
-    backdrop-filter: blur(40px) saturate(1.4);
-    -webkit-backdrop-filter: blur(40px) saturate(1.4);
+    backdrop-filter: blur(var(--blur-heavy, 16px)) saturate(1.4);
+    -webkit-backdrop-filter: blur(var(--blur-heavy, 16px)) saturate(1.4);
     box-shadow: 0 2px 20px rgba(0,0,0,0.4);
     transition: opacity 0.2s ease;
     opacity: 0; pointer-events: none;

package/neural-interface/public/mcp.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.49994 11.7501L11.6717 3.57855C12.7762 2.47398 14.5672 2.47398 15.6717 3.57855C16.7762 4.68312 16.7762 6.47398 15.6717 7.57855M15.6717 7.57855L9.49994 13.7501M15.6717 7.57855C16.7762 6.47398 18.5672 6.47398 19.6717 7.57855C20.7762 8.68312 20.7762 10.474 19.6717 11.5785L12.7072 18.543C12.3167 18.9335 12.3167 19.5667 12.7072 19.9572L13.9999 21.2499" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M17.4999 9.74921L11.3282 15.921C10.2237 17.0255 8.43272 17.0255 7.32823 15.921C6.22373 14.8164 6.22373 13.0255 7.32823 11.921L13.4999 5.74939" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>