thinkpool-pair 0.7.222 → 0.7.223

package/bridge.mjs

@@ -66,7 +66,7 @@ import { writeLaneArtifact, digestSlice, appendDigest, resumeLane } from './flow
 import { createFlowWorktree, worktreeSpec } from './flow-worktree.mjs'
 import { startPreview, stopAllPreviews, previews } from './flow-preview.mjs'
 import { ViewportManager, createViewportTools, sharedViewportBrowser } from './viewport.mjs'
-import { designPrompt, resolveDesignSource, resolveManifestDesignSource, restoreDesignSources, syncRealtimeAuth, validateDesignRequest } from './design-edit.mjs'
+import { designPrompt, materializeDesignAsset, resolveDesignSource, resolveManifestDesignSource, restoreDesignSources, syncRealtimeAuth, validateDesignRequest } from './design-edit.mjs'
 // FL-M9 — per-lane preview servers leak (one per done lane, never stopped until shutdown).
 // Lane previews are keyed `lane:<flowId>:<laneId>`; stop a whole flow's set when it assembles
 // (the assembled preview supersedes them) or when a lane is reverted.
@@ -1284,7 +1284,11 @@ function pumpDesign(term) {
   designActive.set(term, active)
   designStatus({ previewId: next.record.previewId, requestId: next.request.cid, state: 'applying' })
   // Safe transcript summary: never include host paths or the full locator packet.
-  const visible = { kind: 'you', text: `Design edit · ${next.request.target.name || next.request.target.tag}: ${next.request.mode === 'text' ? 'replace text' : next.request.intent}`, cid: next.request.cid, by: next.by }
+  const action = next.request.mode === 'text' ? 'replace text'
+    : next.request.mode === 'move' ? 'move element'
+      : next.request.mode === 'image' ? 'replace image'
+        : next.request.intent
+  const visible = { kind: 'you', text: `Design edit · ${next.request.target.name || next.request.target.tag}: ${action}`, cid: next.request.cid, by: next.by }
   stampEvent(visible); pushLog(lane, visible); bcast('code-event', { term, evt: visible })
   try { lane.session.sendTurn(designPrompt({ record: next.record, request: next.request, by: next.by, restore: !!next.restoreRecord, priorRecord: next.restoreRecord })) }
   catch { finishDesign(term, 'failed', { message: 'The producing lane could not start the edit.' }) }
@@ -3978,8 +3982,8 @@ designChannel
     const ok = !!record && !!live && live.revision === record.revision && record.revision === payload?.revision && sessions.has(record.term)
     designChannel.send({ type: 'broadcast', event: 'design-capability-res', payload: { previewId: String(payload?.previewId || ''), revision: String(payload?.revision || ''), ok } })
   })
-  .on('broadcast', { event: 'design-apply' }, ({ payload }) => {
-    const verdict = validateDesignRequest(payload, designArtifacts)
+  .on('broadcast', { event: 'design-apply' }, async ({ payload }) => {
+    const verdict = validateDesignRequest(payload, designArtifacts, room)
     const previewId = String(payload?.previewId || '')
     const requestId = String(payload?.cid || '').slice(0, 80)
     if (!verdict.ok) {
@@ -3989,6 +3993,20 @@ designChannel
     if (!requestId || seenDesignRequests.has(requestId)) return
     seenDesignRequests.add(requestId)
     if (seenDesignRequests.size > 500) seenDesignRequests.delete(seenDesignRequests.values().next().value)
+    if (verdict.request.mode === 'image') {
+      const localPath = await materializeDesignAsset({
+        webBase: WEB_BASE,
+        token: codeAuthToken,
+        room,
+        asset: verdict.request.asset,
+        requestId,
+      })
+      if (!localPath) {
+        designStatus({ previewId, requestId, state: 'failed', message: 'The private image draft could not be opened.' })
+        return
+      }
+      verdict.request.asset.localPath = localPath
+    }
     const term = verdict.record.term
     const queue = designQueues.get(term) || []
     designQueues.set(term, queue)

package/design-edit.mjs

@@ -1,5 +1,6 @@
 import crypto from 'node:crypto'
 import fs from 'node:fs'
+import os from 'node:os'
 import path from 'node:path'
 
 const MAX_SOURCE_BYTES = 2 * 1024 * 1024
@@ -110,11 +111,36 @@ function safeTarget(value) {
     name: clean(value.name, 240),
     text: clean(value.text, MAX_TEXT),
     canEditText: value.canEditText === true,
+    canReplaceImage: value.canReplaceImage === true,
+    nodeKey: clean(value.nodeKey, 80),
+    parentNodeKey: clean(value.parentNodeKey, 80),
     rect,
   }
 }
 
-export function validateDesignRequest(payload, registry) {
+function safeMovement(value) {
+  if (!value || typeof value !== 'object') return null
+  const fromIndex = Number(value.fromIndex)
+  const toIndex = Number(value.toIndex)
+  if (![fromIndex, toIndex].every(Number.isSafeInteger) || fromIndex < 0 || toIndex < 0 || fromIndex > 499 || toIndex > 499) return null
+  return { fromIndex, toIndex }
+}
+
+function safeAsset(value, room) {
+  if (!value || typeof value !== 'object') return null
+  const asset = {
+    path: clean(value.path, 700),
+    name: clean(value.name, 240),
+    mediaType: clean(value.mediaType, 120).toLowerCase(),
+    size: Number(value.size),
+  }
+  const prefix = room ? `code/${String(room).toUpperCase()}/design-drafts/` : 'code/'
+  if (!asset.path.startsWith(prefix) || asset.path.split('/').includes('..') || !asset.mediaType.startsWith('image/')) return null
+  if (!Number.isSafeInteger(asset.size) || asset.size <= 0 || asset.size > 10 * 1024 * 1024) return null
+  return asset
+}
+
+export function validateDesignRequest(payload, registry, room = '') {
   if (!payload || typeof payload !== 'object') return { ok: false, error: 'invalid-request' }
   const previewId = clean(payload.previewId, 64)
   const record = registry.get(previewId)
@@ -122,12 +148,44 @@ export function validateDesignRequest(payload, registry) {
   if (clean(payload.revision, 64) !== record.revision) return { ok: false, error: 'stale-preview' }
   const target = safeTarget(payload.target)
   if (!target?.selector && !target?.xpath) return { ok: false, error: 'select-an-element' }
-  const mode = payload.mode === 'text' ? 'text' : payload.mode === 'prompt' ? 'prompt' : null
+  const mode = ['text', 'prompt', 'move', 'image'].includes(payload.mode) ? payload.mode : null
   if (!mode) return { ok: false, error: 'invalid-mode' }
   const intent = clean(payload.intent, mode === 'text' ? MAX_TEXT : MAX_INTENT)
-  if (!intent) return { ok: false, error: mode === 'text' ? 'enter-text' : 'describe-change' }
+  if (['text', 'prompt'].includes(mode) && !intent) return { ok: false, error: mode === 'text' ? 'enter-text' : 'describe-change' }
   if (mode === 'text' && !target.canEditText) return { ok: false, error: 'text-edit-not-safe' }
-  return { ok: true, record, request: { previewId, revision: record.revision, mode, intent, target, cid: clean(payload.cid, 80) } }
+  const movement = mode === 'move' ? safeMovement(payload.movement) : null
+  if (mode === 'move' && (!movement || movement.fromIndex === movement.toIndex)) return { ok: false, error: 'invalid-move' }
+  const asset = mode === 'image' ? safeAsset(payload.asset, room) : null
+  if (mode === 'image' && (!target.canReplaceImage || !asset)) return { ok: false, error: 'invalid-image' }
+  return { ok: true, record, request: { previewId, revision: record.revision, mode, intent, target, movement, asset, cid: clean(payload.cid, 80) } }
+}
+
+export async function materializeDesignAsset({ webBase, token, room, asset, requestId, fetcher = fetch }) {
+  if (!webBase || !token || !room || !asset?.path || !requestId) return null
+  const headers = { 'Content-Type': 'application/json', Authorization: `Bearer ${token}` }
+  const signed = await fetcher(`${String(webBase).replace(/\/$/, '')}/api/code-attachment-url`, {
+    method: 'POST',
+    headers,
+    body: JSON.stringify({ code: room, path: asset.path }),
+  })
+  if (!signed.ok) return null
+  const { url } = await signed.json()
+  if (!url) return null
+  const response = await fetcher(url)
+  if (!response.ok) return null
+  const data = Buffer.from(await response.arrayBuffer())
+  if (!data.length || data.length > 10 * 1024 * 1024) return null
+  const ext = path.extname(asset.name).replace(/[^.a-zA-Z0-9]/g, '').slice(0, 9) || '.img'
+  const dir = path.join(os.tmpdir(), 'thinkpool-design-assets')
+  const file = path.join(dir, `${clean(requestId, 80)}${ext}`)
+  fs.mkdirSync(dir, { recursive: true })
+  fs.writeFileSync(file, data)
+  await fetcher(`${String(webBase).replace(/\/$/, '')}/api/code-design-draft`, {
+    method: 'DELETE',
+    headers,
+    body: JSON.stringify({ code: room, path: asset.path }),
+  }).catch(() => {})
+  return file
 }
 
 export function designPrompt({ record, request, by, restore = false, priorRecord = null }) {
@@ -136,6 +194,10 @@ export function designPrompt({ record, request, by, restore = false, priorRecord
     ? `Restore only the immediately previous Design Mode change by comparing the current artifact with this bridge-created verified backup: ${priorRecord?.backupPath || '(backup unavailable)'}. Do not overwrite unrelated changes.`
     : request.mode === 'text'
     ? `Replace only this element's visible text with:\n${request.intent}`
+    : request.mode === 'move'
+    ? `Move only this selected element within its current direct parent, from sibling position ${request.movement.fromIndex + 1} to ${request.movement.toIndex + 1}. Preserve the parent, responsive behavior, semantics, and every other sibling.`
+    : request.mode === 'image'
+    ? `Replace only this selected image's content with the uploaded image at this bridge-local temporary path:\n${request.asset.localPath}\nCopy it into an appropriate durable project asset location. Preserve the existing image frame, dimensions, border radius, object-fit behavior, responsive rules, and surrounding layout.`
     : `Apply this visual change to only the selected element unless the instruction explicitly requires its immediate context:\n${request.intent}`
   return `A room member used ThinkPool Design Mode on the artifact below. This is an authorized source edit in your current workspace.\n\nArtifact source: ${record.sourcePath}\nWorkspace: ${record.workspaceRoot}\nExpected source revision: ${record.revision}\nRequested by: ${clean(by || 'A room member', 120)}\nOperation: ${restore ? 'restore the immediately previous verified Design Mode revision' : request.mode}\n\nSelected element:\n${target}\n\n${action}\n\nRules:\n- Re-read the exact artifact source and confirm its revision/content still matches the selected element before editing.\n- Edit the canonical source above; do not search for or edit a different plausible file.\n- Preserve unrelated content and styling.\n- Use the existing mockup render workflow to produce both desktop and mobile captures after the edit. Run it with TP_DESIGN_REQUEST_ID=${request.cid} and TP_DESIGN_PARENT_REVISION=${record.revision} in the command environment so the proof correlates to this request.\n- Do not claim this is live until both captures succeed and the room receives the manifest.\n- If the target is stale or ambiguous, stop without editing and explain that the person must reselect it.`
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "thinkpool-pair",
-  "version": "0.7.222",
+  "version": "0.7.223",
   "description": "Share a local coding-agent CLI (Claude Code, Codex, Gemini, Aider, …) into a ThinkPool Code room, live.",
   "type": "module",
   "bin": {