@lasso-ai/cli 1.0.17 → 1.0.19

package/dist/cli/agent.js

@@ -193,6 +193,39 @@ function extractLocalAgentText(raw, provider) {
     }
     return texts.at(-1) || raw;
 }
+function extractLocalAgentProposal(raw, provider) {
+    const outputs = [];
+    for (const line of raw.split(/\r?\n/)) {
+        try {
+            const event = JSON.parse(line);
+            const item = event.item;
+            const part = event.part;
+            const values = provider === "claude-code"
+                ? [event.result, ...(event.message?.content || []).map((entry) => entry.text)]
+                : provider === "opencode"
+                    ? [part?.type === "text" ? part.text : undefined, event.text, event.output_text]
+                    : [event.text, event.output_text, item?.text, item?.output_text, item?.message];
+            for (const value of values)
+                if (typeof value === "string" && value.trim())
+                    outputs.push(value);
+        }
+        catch {
+            if (line.trim())
+                outputs.push(line);
+        }
+    }
+    // Tool events are interleaved with the final answer. Try text events in
+    // reverse order, then the complete stream as a final fallback.
+    for (const output of [...outputs.reverse(), raw]) {
+        try {
+            return jsonFrom(output);
+        }
+        catch {
+            // Keep looking; this output may only be a progress or tool event.
+        }
+    }
+    throw new Error("The agent returned no valid reviewable changes. Progress output may have been mixed with the final JSON.");
+}
 function snippet(value, max = 80) {
     const s = String(value ?? "").trim().replace(/\s+/g, " ");
     return s.length > max ? `${s.slice(0, max)}…` : s;
@@ -309,7 +342,7 @@ function localCommand(provider, model, prompt) {
         return { command: "claude", args: ["-p", prompt || "", "--output-format", "stream-json", "--verbose", "--permission-mode", "plan", "--max-turns", "3", ...(selectedModel ? ["--model", selectedModel] : [])] };
     }
     if (provider === "opencode") {
-        return { command: "opencode", args: ["run", "--format", "json", ...(selectedModel ? ["--model", selectedModel] : []), prompt || ""] };
+        return { command: "opencode", args: ["run", "--format", "json", "--agent", "plan", ...(selectedModel ? ["--model", selectedModel] : []), prompt || ""] };
     }
     return { command: "codex", args: ["exec", "--json", "--sandbox", "read-only", "--skip-git-repo-check", ...(selectedModel ? ["--model", selectedModel] : []), prompt || ""] };
 }
@@ -355,7 +388,7 @@ async function proposeWithLocalAgent(cwd, instruction, context, config, signal,
     }
     if (exitCode !== 0)
         throw new Error(localAgentError(command, stderr, exitCode));
-    return jsonFrom(extractLocalAgentText(stdout, config.provider));
+    return extractLocalAgentProposal(stdout, config.provider);
 }
 async function proposeChanges(cwd, input, config, signal, onProgress) {
     const context = await contextFor(cwd, input.element);

package/dist/cli/bridge.d.ts

@@ -14,6 +14,7 @@ export type BridgeMessage = {
     from: "overlay" | "cli";
 } | {
     type: "edit";
+    taskId: string;
     instruction: string;
     model: string;
     provider?: "anthropic" | "openai" | "google" | "ollama" | "cli";
@@ -48,6 +49,7 @@ export type BridgeMessage = {
     };
 } | {
     type: "ask";
+    taskId: string;
     question: string;
     model: string;
     provider?: "anthropic" | "openai" | "google" | "ollama" | "cli";
@@ -81,11 +83,14 @@ export type BridgeMessage = {
     details: string;
 } | {
     type: "apply";
+    taskId: string;
     changes: SourceChange[];
 } | {
     type: "undo";
+    taskId?: string;
 } | {
     type: "stop";
+    taskId?: string;
 } | {
     type: "git_status";
 } | {
@@ -101,6 +106,7 @@ export type BridgeMessage = {
     type: "git_push";
 } | {
     type: "agent_status";
+    taskId?: string;
     status: "thinking" | "working" | "review" | "error" | "stopped";
     message: string;
 } | {
@@ -134,18 +140,22 @@ export type ServerBridgeMessage = {
     error?: string;
 } | {
     type: "agent_status";
+    taskId?: string;
     status: "thinking" | "working" | "review" | "error" | "stopped";
     message: string;
     detail?: string;
     changes?: SourceChange[];
 } | {
     type: "assistant_message";
+    taskId?: string;
     message: string;
 } | {
     type: "applied";
+    taskId?: string;
     message: string;
 } | {
     type: "undone";
+    taskId?: string;
     message: string;
 } | {
     type: "transcribe_result";

package/dist/cli/bridge.js

@@ -147,10 +147,10 @@ function startBridge(cwd = process.cwd(), collabConfig = null, bridgePort = expo
     const bridgeServer = node_http_1.default.createServer(); // dedicated, empty HTTP server
     const wss = new ws_1.WebSocketServer({ server: bridgeServer });
     let overlaySocket = null;
-    let lastSnapshot = [];
-    let lastEditRequest = null;
-    let lastEditConfig = null;
-    let reviewRefreshAttempts = 0;
+    const taskSnapshots = new Map();
+    const editRequests = new Map();
+    const editConfigs = new Map();
+    const reviewRefreshAttempts = new Map();
     const envRoots = [cwd, node_path_1.default.join(cwd, "web"), node_path_1.default.join(cwd, "server")];
     const fileEnv = envRoots.reduce((values, root) => ({
         ...values,
@@ -179,11 +179,15 @@ function startBridge(cwd = process.cwd(), collabConfig = null, bridgePort = expo
         };
     })();
     let activeAgentController = null;
+    const taskControllers = new Map();
     let localAgents = new Set();
     bridgeServer.on("request", (req, res) => {
         if (req.method !== "POST" || req.url?.split("?", 1)[0] !== "/__lasso/bridge/restart")
             return;
         activeAgentController?.abort();
+        for (const controller of taskControllers.values())
+            controller.abort();
+        taskControllers.clear();
         activeAgentController = null;
         for (const socket of wss.clients)
             socket.close(1000, "Bridge restarted by the CLI");
@@ -270,40 +274,41 @@ function startBridge(cwd = process.cwd(), collabConfig = null, bridgePort = expo
                 socket.send(JSON.stringify({ type: "git_state", git }));
         });
         const runEditReview = (request, config, statusMessage) => {
-            activeAgentController?.abort();
+            taskControllers.get(request.taskId)?.abort();
             const controller = new AbortController();
-            activeAgentController = controller;
+            taskControllers.set(request.taskId, controller);
             if (statusMessage && socket.readyState === socket.OPEN) {
-                socket.send(JSON.stringify({ type: "agent_status", status: "working", message: statusMessage }));
+                socket.send(JSON.stringify({ type: "agent_status", taskId: request.taskId, status: "working", message: statusMessage }));
             }
             void (0, agent_1.proposeChanges)(cwd, request, config, controller.signal, (message, detail) => {
                 if (!controller.signal.aborted && socket.readyState === socket.OPEN) {
-                    socket.send(JSON.stringify({ type: "agent_status", status: "working", message, detail }));
+                    socket.send(JSON.stringify({ type: "agent_status", taskId: request.taskId, status: "working", message, detail }));
                 }
             })
                 .then((proposal) => {
                 if (controller.signal.aborted || socket.readyState !== socket.OPEN)
                     return;
                 if (!proposalMatchesCurrentSource(cwd, proposal.changes)) {
-                    if (reviewRefreshAttempts < 1) {
-                        reviewRefreshAttempts += 1;
+                    const refreshAttempts = reviewRefreshAttempts.get(request.taskId) || 0;
+                    if (refreshAttempts < 1) {
+                        reviewRefreshAttempts.set(request.taskId, refreshAttempts + 1);
                         runEditReview(request, config, "The source changed while the proposal was being prepared. Refreshing the review…");
                     }
                     else {
-                        socket.send(JSON.stringify({ type: "agent_status", status: "error", message: "The source is still changing. Stop the dev-server edit or try the request again." }));
+                        socket.send(JSON.stringify({ type: "agent_status", taskId: request.taskId, status: "error", message: "The source is still changing. Stop the dev-server edit or try the request again." }));
                     }
                     return;
                 }
-                socket.send(JSON.stringify({ type: "agent_status", status: "review", message: proposal.summary, changes: proposal.changes }));
+                socket.send(JSON.stringify({ type: "agent_status", taskId: request.taskId, status: "review", message: proposal.summary, changes: proposal.changes }));
             })
                 .catch((error) => {
                 if (!controller.signal.aborted && socket.readyState === socket.OPEN) {
-                    socket.send(JSON.stringify({ type: "agent_status", status: "error", message: error instanceof Error ? error.message : "The agent could not prepare a change." }));
+                    socket.send(JSON.stringify({ type: "agent_status", taskId: request.taskId, status: "error", message: error instanceof Error ? error.message : "The agent could not prepare a change." }));
                 }
             })
                 .finally(() => {
-                if (activeAgentController === controller)
-                    activeAgentController = null;
+                if (taskControllers.get(request.taskId) === controller)
+                    taskControllers.delete(request.taskId);
             });
         };
         socket.on("message", async (raw) => {
@@ -318,56 +323,59 @@ function startBridge(cwd = process.cwd(), collabConfig = null, bridgePort = expo
                 const localProvider = msg.provider === "cli";
                 const cliProvider = msg.model.startsWith("claude-code:") ? "claude-code" : msg.model.startsWith("opencode:") ? "opencode" : "codex";
                 if (!lassoKeyConfigured && !localProvider) {
-                    socket.send(JSON.stringify({ type: "agent_status", status: "error", message: "Set your Lasso API key before asking the hosted agent a question." }));
+                    socket.send(JSON.stringify({ type: "agent_status", taskId: msg.taskId, status: "error", message: "Set your Lasso API key before asking the hosted agent a question." }));
                     return;
                 }
                 if (!agentConfig && !localProvider) {
-                    socket.send(JSON.stringify({ type: "agent_status", status: "error", message: "No hosted agent is configured. Select Claude Code/Codex or add a provider key." }));
+                    socket.send(JSON.stringify({ type: "agent_status", taskId: msg.taskId, status: "error", message: "No hosted agent is configured. Select Claude Code/Codex or add a provider key." }));
                     return;
                 }
-                activeAgentController?.abort();
+                taskControllers.get(msg.taskId)?.abort();
                 const controller = new AbortController();
-                activeAgentController = controller;
+                taskControllers.set(msg.taskId, controller);
                 const selectedConfig = localProvider
                     ? { provider: cliProvider, model: msg.model }
                     : { ...agentConfig, provider: (msg.provider || agentConfig.provider), model: msg.model };
                 void (0, agent_1.answerQuestion)(cwd, { question: msg.question, context: msg.context, element: msg.element, messages: msg.messages }, selectedConfig, controller.signal, (message, detail) => {
                     if (!controller.signal.aborted && socket.readyState === socket.OPEN)
-                        socket.send(JSON.stringify({ type: "agent_status", status: "working", message, detail }));
+                        socket.send(JSON.stringify({ type: "agent_status", taskId: msg.taskId, status: "working", message, detail }));
                 }).then((answer) => {
                     if (!controller.signal.aborted)
-                        socket.send(JSON.stringify({ type: "assistant_message", message: answer }));
+                        socket.send(JSON.stringify({ type: "assistant_message", taskId: msg.taskId, message: answer }));
                 }).catch((error) => {
                     if (!controller.signal.aborted)
-                        socket.send(JSON.stringify({ type: "agent_status", status: "error", message: error instanceof Error ? error.message : "The agent could not answer." }));
+                        socket.send(JSON.stringify({ type: "agent_status", taskId: msg.taskId, status: "error", message: error instanceof Error ? error.message : "The agent could not answer." }));
                 }).finally(() => {
-                    if (activeAgentController === controller)
-                        activeAgentController = null;
+                    if (taskControllers.get(msg.taskId) === controller)
+                        taskControllers.delete(msg.taskId);
                 });
             }
             else if (msg.type === "edit") {
                 const localProvider = msg.provider === "cli";
                 const cliProvider = msg.model.startsWith("claude-code:") ? "claude-code" : msg.model.startsWith("opencode:") ? "opencode" : "codex";
                 if (!lassoKeyConfigured && !localProvider) {
-                    socket.send(JSON.stringify({ type: "agent_status", status: "error", message: "Set VITE_LASSO_API_KEY or NEXT_LASSO_API_KEY in your app environment before sending an edit." }));
+                    socket.send(JSON.stringify({ type: "agent_status", taskId: msg.taskId, status: "error", message: "Set VITE_LASSO_API_KEY or NEXT_LASSO_API_KEY in your app environment before sending an edit." }));
                     return;
                 }
                 if (!agentConfig && !localProvider) {
-                    socket.send(JSON.stringify({ type: "agent_status", status: "error", message: "Add a supported agent key: GOOGLE_GENERATIVE_AI_API_KEY, OPENAI_API_KEY, or ANTHROPIC_API_KEY." }));
+                    socket.send(JSON.stringify({ type: "agent_status", taskId: msg.taskId, status: "error", message: "Add a supported agent key: GOOGLE_GENERATIVE_AI_API_KEY, OPENAI_API_KEY, or ANTHROPIC_API_KEY." }));
                     return;
                 }
                 const selectedConfig = localProvider
                     ? { provider: cliProvider, model: msg.model }
                     : { ...agentConfig, provider: (msg.provider || agentConfig.provider), model: msg.model };
-                lastEditRequest = msg;
-                lastEditConfig = selectedConfig;
-                reviewRefreshAttempts = 0;
+                editRequests.set(msg.taskId, msg);
+                editConfigs.set(msg.taskId, selectedConfig);
+                reviewRefreshAttempts.set(msg.taskId, 0);
                 runEditReview(msg, selectedConfig);
             }
             else if (msg.type === "stop") {
-                activeAgentController?.abort();
-                activeAgentController = null;
-                socket.send(JSON.stringify({ type: "agent_status", status: "stopped", message: "Agent stopped." }));
+                if (msg.taskId)
+                    taskControllers.get(msg.taskId)?.abort();
+                else
+                    for (const controller of taskControllers.values())
+                        controller.abort();
+                socket.send(JSON.stringify({ type: "agent_status", taskId: msg.taskId, status: "stopped", message: "Agent stopped." }));
             }
             else if (msg.type === "runtime_error") {
                 socket.send(JSON.stringify({ type: "agent_status", status: "error", message: `Runtime error detected${msg.selectionId ? ` for selection ${msg.selectionId}` : ""}: ${msg.details}` }));
@@ -468,7 +476,7 @@ function startBridge(cwd = process.cwd(), collabConfig = null, bridgePort = expo
             }
             else if (msg.type === "apply") {
                 try {
-                    lastSnapshot = [];
+                    const snapshots = [];
                     const planned = new Map();
                     for (const change of msg.changes) {
                         const filePath = resolveProposedFile(cwd, change.filePath);
@@ -483,24 +491,31 @@ function startBridge(cwd = process.cwd(), collabConfig = null, bridgePort = expo
                     }
                     // Validate every change before writing any file, then apply each
                     // file's replacements from the end toward the beginning.
+                    taskSnapshots.set(msg.taskId, snapshots);
                     for (const [filePath, changes] of planned) {
                         const content = changes[0].content;
-                        lastSnapshot.push({ filePath, content });
+                        snapshots.push({ filePath, content });
                         const nextContent = [...changes]
                             .sort((a, b) => b.start - a.start)
                             .reduce((value, change) => value.slice(0, change.start) + change.newString + value.slice(change.end), content);
                         node_fs_1.default.writeFileSync(filePath, nextContent);
                     }
-                    socket.send(JSON.stringify({ type: "applied", message: `${msg.changes.length} file${msg.changes.length === 1 ? "" : "s"} updated. Your dev server will reload.` }));
+                    socket.send(JSON.stringify({ type: "applied", taskId: msg.taskId, message: `${msg.changes.length} file${msg.changes.length === 1 ? "" : "s"} updated. Your dev server will reload.` }));
                 }
                 catch (error) {
-                    for (const snapshot of lastSnapshot)
+                    // Validation happens before writes, but restore this task's snapshot
+                    // if a filesystem error occurs during the write phase.
+                    for (const snapshot of taskSnapshots.get(msg.taskId) || [])
                         node_fs_1.default.writeFileSync(snapshot.filePath, snapshot.content);
-                    lastSnapshot = [];
+                    taskSnapshots.delete(msg.taskId);
                     const message = error instanceof Error ? error.message : "The change could not be applied.";
                     const sourceChanged = message.includes("The source changed after the suggestion was generated");
-                    if (sourceChanged && lastEditRequest && lastEditConfig && reviewRefreshAttempts < 1) {
-                        runEditReview(lastEditRequest, lastEditConfig, "The source changed. Refreshing the review against the current file…");
+                    const editRequest = editRequests.get(msg.taskId);
+                    const editConfig = editConfigs.get(msg.taskId);
+                    const refreshAttempts = reviewRefreshAttempts.get(msg.taskId) || 0;
+                    if (sourceChanged && editRequest && editConfig && refreshAttempts < 1) {
+                        reviewRefreshAttempts.set(msg.taskId, refreshAttempts + 1);
+                        runEditReview(editRequest, editConfig, "The source changed. Refreshing the review against the current file…");
                     }
                     else {
                         socket.send(JSON.stringify({ type: "agent_status", status: "error", message }));
@@ -508,11 +523,11 @@ function startBridge(cwd = process.cwd(), collabConfig = null, bridgePort = expo
                 }
             }
             else if (msg.type === "undo") {
-                for (const snapshot of lastSnapshot)
+                const snapshots = taskSnapshots.get(msg.taskId || "") || [];
+                for (const snapshot of snapshots)
                     node_fs_1.default.writeFileSync(snapshot.filePath, snapshot.content);
-                const count = lastSnapshot.length;
-                lastSnapshot = [];
-                socket.send(JSON.stringify({ type: "undone", message: count ? "The accepted change was reverted." : "There is no accepted change to undo." }));
+                taskSnapshots.delete(msg.taskId || "");
+                socket.send(JSON.stringify({ type: "undone", taskId: msg.taskId, message: snapshots.length ? "The accepted change was reverted." : "There is no accepted change to undo." }));
             }
         });
         socket.on("close", () => {

package/dist/overlay.js

@@ -7878,6 +7878,8 @@
     chatHistory = [];
     changesHistory = [];
     pendingChanges = [];
+    agentTasks = [];
+    activeTaskId = null;
     runtimeErrors = [];
     screenshotPromise = Promise.resolve({});
     // Agent State
@@ -10180,8 +10182,13 @@
       display: none;
     }
 
+    .lasso-prompt-send.loading span {
+      display: none;
+    }
+
     .lasso-prompt-send.loading::before {
       content: "";
+      display: block;
       width: 12px;
       height: 12px;
       border: 2px solid rgba(0, 0, 0, 0.3);
@@ -10877,6 +10884,60 @@
       display: none;
     }
 
+    .lasso-task-panel {
+      position: fixed;
+      right: 12px;
+      bottom: 82px;
+      width: 390px;
+      max-width: calc(100vw - 24px);
+      max-height: min(560px, calc(100vh - 104px));
+      padding: 14px;
+      display: flex;
+      flex-direction: column;
+      gap: 10px;
+      color: var(--lo-text);
+      background: var(--lo-surface);
+      border: 1px solid var(--lo-border);
+      border-radius: var(--lo-radius-xl);
+      box-shadow: 0 18px 50px rgba(0,0,0,.35);
+      z-index: 30;
+      opacity: 0;
+      transform: translateY(8px) scale(.98);
+      transition: opacity 150ms ease, transform 150ms ease;
+      pointer-events: auto;
+    }
+
+    .lasso-task-panel.visible { opacity: 1; transform: translateY(0) scale(1); }
+    .lasso-task-panel[hidden] { display: none; }
+    .lasso-task-header, .lasso-task-title-row, .lasso-task-detail-heading { display: flex; align-items: center; }
+    .lasso-task-header { justify-content: space-between; }
+    .lasso-task-title-row { gap: 7px; font-size: 13px; font-weight: 600; }
+    .lasso-task-badge { min-width: 18px; padding: 2px 5px; border-radius: 999px; background: var(--lo-indigo); color: #fff; font-size: 10px; text-align: center; }
+    .lasso-task-close, .lasso-task-back { border: 0; background: transparent; color: var(--lo-text-3); cursor: pointer; }
+    .lasso-task-close { font-size: 20px; line-height: 20px; }
+    .lasso-task-body { min-height: 90px; max-height: 470px; overflow: auto; }
+    .lasso-task-list { display: flex; flex-direction: column; gap: 3px; }
+    .lasso-task-row { width: 100%; display: flex; align-items: center; gap: 9px; padding: 9px; border: 0; border-radius: var(--lo-radius-md); background: transparent; color: var(--lo-text); text-align: left; cursor: pointer; }
+    .lasso-task-row:hover, .lasso-task-row.active { background: var(--lo-surface-hover); }
+    .lasso-task-status { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: var(--lo-text-3); }
+    .lasso-task-status.thinking, .lasso-task-status.working { background: var(--lo-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--lo-primary) 18%, transparent); }
+    .lasso-task-status.review { background: #fbbf24; }
+    .lasso-task-status.complete { background: #34d399; }
+    .lasso-task-status.error { background: #f87171; }
+    .lasso-task-row-copy { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
+    .lasso-task-row-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; font-weight: 500; }
+    .lasso-task-row-copy small, .lasso-task-message { color: var(--lo-text-3); font-size: 11px; }
+    .lasso-task-empty { padding: 25px 10px; color: var(--lo-text-3); font-size: 12px; text-align: center; }
+    .lasso-task-detail { padding: 4px 2px; }
+    .lasso-task-detail-heading { justify-content: space-between; margin-bottom: 12px; }
+    .lasso-task-detail-status { color: var(--lo-primary); font-size: 11px; font-weight: 600; }
+    .lasso-task-prompt { margin: 0 0 10px; font-size: 13px; line-height: 1.45; }
+    .lasso-task-message { margin: 0 0 12px; line-height: 1.45; }
+    .lasso-task-changes { margin-bottom: 10px; color: var(--lo-text-2); font-size: 11px; }
+    .lasso-task-apply { padding: 7px 11px; border: 0; border-radius: var(--lo-radius-full); background: var(--lo-primary); color: #111214; font: inherit; font-size: 11px; font-weight: 600; cursor: pointer; }
+
+    .lasso-agent-tasks-badge { position: absolute; top: 5px; right: 5px; width: 6px; height: 6px; border-radius: 50%; background: var(--lo-primary); }
+
     .lasso-todo-header {
       display: flex;
       align-items: center;
@@ -12059,6 +12120,138 @@
   };
   var terminal_default = data4;
 
+  // src/overlay/tasks/tasks.ts
+  var panel = null;
+  var list = null;
+  var detail = null;
+  var badge = null;
+  var statusLabel = {
+    queued: "Queued",
+    thinking: "Thinking",
+    working: "Working",
+    review: "Review",
+    complete: "Complete",
+    error: "Error",
+    stopped: "Stopped"
+  };
+  function taskId() {
+    return `task-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 7)}`;
+  }
+  function createAgentTask(instruction) {
+    const now = (/* @__PURE__ */ new Date()).toISOString();
+    const task = { id: taskId(), instruction, status: "queued", message: "Queued", createdAt: now, updatedAt: now };
+    state.agentTasks.unshift(task);
+    state.activeTaskId = task.id;
+    renderTasks();
+    return task;
+  }
+  function getAgentTask(id) {
+    return id ? state.agentTasks.find((task) => task.id === id) : void 0;
+  }
+  function updateAgentTask(id, patch) {
+    if (!id) return;
+    const task = getAgentTask(id);
+    if (!task) return;
+    Object.assign(task, patch, { updatedAt: (/* @__PURE__ */ new Date()).toISOString() });
+    renderTasks();
+  }
+  function selectAgentTask(id) {
+    if (!getAgentTask(id)) return;
+    state.activeTaskId = id;
+    renderTasks();
+  }
+  function toggleTaskPanel(force) {
+    if (!panel) return;
+    panel.hidden = force === void 0 ? !panel.hidden : !force;
+    panel.classList.toggle("visible", !panel.hidden);
+    if (!panel.hidden) renderTasks();
+  }
+  function buildTaskPanel() {
+    const dom = getDOM();
+    panel = document.createElement("div");
+    panel.className = "lasso-task-panel";
+    panel.hidden = true;
+    panel.innerHTML = `
+    <div class="lasso-task-header">
+      <div class="lasso-task-title-row">
+        <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="4" width="18" height="16" rx="3"/><path d="M7 8h10M7 12h6M7 16h8"/></svg>
+        <span>Agent tasks</span><span class="lasso-task-badge" hidden>0</span>
+      </div>
+      <button class="lasso-task-close" type="button" aria-label="Close tasks">\xD7</button>
+    </div>
+    <div class="lasso-task-body">
+      <div class="lasso-task-list"></div>
+      <div class="lasso-task-detail" hidden></div>
+    </div>
+  `;
+    dom.shadow.appendChild(panel);
+    list = panel.querySelector(".lasso-task-list");
+    detail = panel.querySelector(".lasso-task-detail");
+    badge = panel.querySelector(".lasso-task-badge");
+    panel.querySelector(".lasso-task-close").addEventListener("click", () => toggleTaskPanel(false));
+    renderTasks();
+    return panel;
+  }
+  function renderTasks() {
+    if (!list || !detail || !badge) return;
+    const running = state.agentTasks.filter((task) => task.status === "thinking" || task.status === "working").length;
+    badge.hidden = state.agentTasks.length === 0;
+    badge.textContent = String(running || state.agentTasks.length);
+    list.replaceChildren();
+    if (!state.agentTasks.length) {
+      list.innerHTML = `<div class="lasso-task-empty">Prompt an element to start a task.</div>`;
+    } else {
+      for (const task of state.agentTasks) {
+        const button = document.createElement("button");
+        button.type = "button";
+        button.className = `lasso-task-row${task.id === state.activeTaskId ? " active" : ""}`;
+        button.innerHTML = `<span class="lasso-task-status ${task.status}"></span><span class="lasso-task-row-copy"><strong></strong><small>${statusLabel[task.status]}</small></span>`;
+        button.querySelector("strong").textContent = task.instruction;
+        button.addEventListener("click", () => selectAgentTask(task.id));
+        list.appendChild(button);
+      }
+    }
+    const selected = getAgentTask(state.activeTaskId);
+    if (!selected) {
+      detail.hidden = true;
+      return;
+    }
+    detail.hidden = false;
+    detail.replaceChildren();
+    const heading = document.createElement("div");
+    heading.className = "lasso-task-detail-heading";
+    heading.innerHTML = `<span class="lasso-task-detail-status ${selected.status}">${statusLabel[selected.status]}</span><button type="button" class="lasso-task-back">All tasks</button>`;
+    heading.querySelector("button").addEventListener("click", () => {
+      state.activeTaskId = null;
+      renderTasks();
+    });
+    const prompt = document.createElement("p");
+    prompt.className = "lasso-task-prompt";
+    prompt.textContent = selected.instruction;
+    const activity = document.createElement("p");
+    activity.className = "lasso-task-message";
+    activity.textContent = selected.response || selected.message;
+    detail.append(heading, prompt, activity);
+    if (selected.changes?.length) {
+      const changes = document.createElement("div");
+      changes.className = "lasso-task-changes";
+      changes.textContent = `${selected.changes.length} proposed file change${selected.changes.length === 1 ? "" : "s"}`;
+      detail.appendChild(changes);
+      if (selected.status === "review") {
+        const apply = document.createElement("button");
+        apply.type = "button";
+        apply.className = "lasso-task-apply";
+        apply.textContent = "Apply changes";
+        apply.addEventListener("click", () => {
+          if (state.bridgeSocket?.readyState !== WebSocket.OPEN) return;
+          state.bridgeSocket.send(JSON.stringify({ type: "apply", taskId: selected.id, changes: selected.changes }));
+          updateAgentTask(selected.id, { message: "Applying changes\u2026" });
+        });
+        detail.appendChild(apply);
+      }
+    }
+  }
+
   // src/overlay/notifications.ts
   var permissionRequest = null;
   function requestAgentNotificationPermission() {
@@ -16836,11 +17029,11 @@
   }
   function updateCommentsBadge() {
     const dom = getDOM();
-    const badge = dom.shadow.querySelector(".lasso-comments-badge");
-    if (!badge) return;
+    const badge2 = dom.shadow.querySelector(".lasso-comments-badge");
+    if (!badge2) return;
     const openCount = threadsInScope().filter((t) => t.root.status === "OPEN").length;
-    badge.classList.toggle("visible", openCount > 0);
-    badge.textContent = String(openCount);
+    badge2.classList.toggle("visible", openCount > 0);
+    badge2.textContent = String(openCount);
   }
   function commentPosition(thread) {
     const saved = thread.root.meta?.position;
@@ -17591,7 +17784,7 @@
       ta.remove();
     }
   }
-  var panel = null;
+  var panel2 = null;
   var items = [];
   var scope = "private";
   var PRIVATE_STORAGE_KEY = "lasso:clipboard:private";
@@ -17650,7 +17843,7 @@
     <div class="lasso-clipboard-list"></div>
   `;
     getDOM().shadow.appendChild(el);
-    panel = el;
+    panel2 = el;
     el.querySelector(".lasso-clipboard-close").addEventListener("click", () => toggleClipboardPanel(false));
     el.querySelectorAll(".lasso-clipboard-tab").forEach((button) => {
       button.addEventListener("click", () => {
@@ -17757,14 +17950,14 @@
     return TYPE_COLORS[type] ?? TYPE_COLORS.text;
   }
   function render() {
-    const list = panel?.querySelector(".lasso-clipboard-list");
-    if (!list) return;
+    const list2 = panel2?.querySelector(".lasso-clipboard-list");
+    if (!list2) return;
     const visible = items.filter((item) => item.scope === scope);
     if (!visible.length) {
-      list.innerHTML = `<div class="lasso-clipboard-empty">${scope === "shared" && !state.collabJoined ? "Join a collaboration session to share items." : "No saved items yet."}</div>`;
+      list2.innerHTML = `<div class="lasso-clipboard-empty">${scope === "shared" && !state.collabJoined ? "Join a collaboration session to share items." : "No saved items yet."}</div>`;
       return;
     }
-    list.innerHTML = visible.map((item) => {
+    list2.innerHTML = visible.map((item) => {
       const color = typeColor(item.type);
       const icon = typeIcon(item.type);
       const preview = escapeHtml3(item.content).slice(0, 220);
@@ -17788,7 +17981,7 @@
         </div>
       </div>`;
     }).join("");
-    list.querySelectorAll(".lasso-clipboard-item").forEach((row) => {
+    list2.querySelectorAll(".lasso-clipboard-item").forEach((row) => {
       const item = visible.find((candidate) => candidate.uid === row.dataset.id);
       if (!item) return;
       const copyBtn = row.querySelector(".lasso-clipboard-copy-item");
@@ -17823,7 +18016,7 @@
     });
   }
   function setStatus(message) {
-    const sub = panel?.querySelector(".lasso-clipboard-subtitle");
+    const sub = panel2?.querySelector(".lasso-clipboard-subtitle");
     if (!sub) return;
     const previous = sub.textContent;
     sub.textContent = message;
@@ -17832,10 +18025,10 @@
     }, 1800);
   }
   function toggleClipboardPanel(force) {
-    if (!panel) return;
-    const next = force === void 0 ? Boolean(panel.hidden) : force;
-    panel.hidden = !next;
-    panel.classList.toggle("visible", next);
+    if (!panel2) return;
+    const next = force === void 0 ? Boolean(panel2.hidden) : force;
+    panel2.hidden = !next;
+    panel2.classList.toggle("visible", next);
     if (next) requestItems();
   }
   function escapeHtml3(value2) {
@@ -18391,7 +18584,7 @@
       event.preventDefault();
       event.stopPropagation();
       if (state.bridgeSocket?.readyState === WebSocket.OPEN) {
-        state.bridgeSocket.send(JSON.stringify({ type: "stop" }));
+        state.bridgeSocket.send(JSON.stringify({ type: "stop", taskId: state.activeTaskId || void 0 }));
       }
       appendChat("assistant", "Agent stopped.");
       resetAgentState();
@@ -18452,7 +18645,7 @@
     rev.querySelector(".lasso-review-undo").addEventListener("click", () => {
       if (state.pendingChanges.length && rev.querySelector(".lasso-review-apply").hidden) {
         if (state.bridgeSocket?.readyState === WebSocket.OPEN) {
-          state.bridgeSocket.send(JSON.stringify({ type: "undo" }));
+          state.bridgeSocket.send(JSON.stringify({ type: "undo", taskId: state.activeTaskId || void 0 }));
         }
         return;
       }
@@ -18462,7 +18655,7 @@
     rev.querySelector(".lasso-review-apply").addEventListener("click", () => {
       if (!state.bridgeSocket || state.bridgeSocket.readyState !== WebSocket.OPEN || !state.pendingChanges.length) return;
       requestAgentNotificationPermission();
-      state.bridgeSocket.send(JSON.stringify({ type: "apply", changes: state.pendingChanges }));
+      state.bridgeSocket.send(JSON.stringify({ type: "apply", taskId: state.activeTaskId || "", changes: state.pendingChanges }));
       appendChat("assistant", "Applying the reviewed change\u2026");
     });
     return { prompt: el, review: rev };
@@ -18672,9 +18865,9 @@
       container.append(document.createTextNode(text.slice(lastIndex)));
     }
   }
-  function setAgentStatus(status, message, detail) {
+  function setAgentStatus(status, message, detail2) {
     if (!agentStatusElement || !agentStatusMessage || !sendButton) return;
-    const logMessage = detail?.trim() || message.trim();
+    const logMessage = detail2?.trim() || message.trim();
     const lastLog = agentLogLines[agentLogLines.length - 1];
     if (agentStatusElement.dataset.status === status && agentStatusMessage.textContent === message && (status === "thinking" || status === "working") && (!logMessage || lastLog === logMessage)) return;
     appendAgentLog(logMessage);
@@ -18689,7 +18882,7 @@
     state.agentRunning = status === "thinking" || status === "working";
     sendButton.classList.toggle("loading", state.agentRunning);
     if (stopButton) stopButton.hidden = !state.agentRunning;
-    if (promptInput) promptInput.disabled = state.agentRunning;
+    if (promptInput) promptInput.disabled = false;
     const label = sendButton.querySelector("span");
     if (label) {
       label.textContent = status === "review" ? "Review" : status === "error" ? "Retry" : state.agentRunning ? "" : "Send";
@@ -18705,7 +18898,7 @@
     if (!promptInput || !sendButton) return;
     const hasInstruction = Boolean(promptInput.value.trim()) || sendButton.dataset.state === "retry" && Boolean(state.lastInstruction?.trim());
     const isReviewAction = sendButton.dataset.state === "review";
-    sendButton.disabled = state.agentRunning || !hasInstruction && !isReviewAction;
+    sendButton.disabled = !hasInstruction && !isReviewAction;
   }
   function resetAgentState() {
     state.agentRunning = false;
@@ -18842,6 +19035,7 @@
       });
     }
     appendChat("user", instruction);
+    const task = createAgentTask(instruction);
     setAgentStatus("thinking", "Thinking\u2026");
     state.lastInstruction = instruction;
     promptInput.value = "";
@@ -18855,6 +19049,7 @@
     state.bridgeSocket.send(
       JSON.stringify({
         type: wantsAnswer ? "ask" : "edit",
+        taskId: task.id,
         question: wantsAnswer ? instruction : void 0,
         instruction,
         messages: state.chatHistory,
@@ -19706,25 +19901,25 @@
       const parts2 = filePath.split("/");
       const name = parts2.pop() || filePath;
       const dir = parts2.length ? parts2.join("/") + "/" : "";
-      let badge = "M";
+      let badge2 = "M";
       let badgeClass = "mod";
       if (code.includes("A")) {
-        badge = "A";
+        badge2 = "A";
         badgeClass = "add";
       } else if (code.includes("D")) {
-        badge = "D";
+        badge2 = "D";
         badgeClass = "del";
       } else if (code.includes("R")) {
-        badge = "R";
+        badge2 = "R";
         badgeClass = "ren";
       } else if (code === "??" || code.includes("?")) {
-        badge = "U";
+        badge2 = "U";
         badgeClass = "unt";
       } else if (code.includes("M")) {
-        badge = "M";
+        badge2 = "M";
         badgeClass = "mod";
       }
-      return { code, badge, badgeClass, path: filePath, dir, name };
+      return { code, badge: badge2, badgeClass, path: filePath, dir, name };
     });
   }
   function escapeHtml4(text) {
@@ -19935,7 +20130,7 @@
     const uninitView = gitPanelEl.querySelector(".lasso-git-uninit-view");
     const repoView = gitPanelEl.querySelector(".lasso-git-repo-view");
     const filesList = gitPanelEl.querySelector(".lasso-git-files-list");
-    const badge = gitPanelEl.querySelector(".lasso-git-changes-badge");
+    const badge2 = gitPanelEl.querySelector(".lasso-git-changes-badge");
     const commitBtn = gitPanelEl.querySelector(".lasso-git-commit-btn");
     const commitBtnText = gitPanelEl.querySelector(".lasso-git-commit-btn-text");
     const pushBtn = gitPanelEl.querySelector(".lasso-git-push-btn");
@@ -19958,12 +20153,12 @@
       uninitView.hidden = next.isRepo;
       repoView.hidden = !next.isRepo;
     }
-    if (filesList && badge && next.isRepo) {
+    if (filesList && badge2 && next.isRepo) {
       const rawStatus = next.status || [];
       const parsed = parseGitStatus(rawStatus);
       const count = parsed.length;
-      badge.textContent = count > 0 ? String(count) : "Clean";
-      badge.className = `lasso-git-changes-badge${count > 0 ? " has-changes" : " clean"}`;
+      badge2.textContent = count > 0 ? String(count) : "Clean";
+      badge2.className = `lasso-git-changes-badge${count > 0 ? " has-changes" : " clean"}`;
       if (count === 0) {
         filesList.innerHTML = `
         <div class="lasso-git-clean-state">
@@ -20148,6 +20343,11 @@
       </svg>
     </button>
 
+    <button class="lasso-tool-btn agent-tasks-tool" type="button" aria-label="Agent tasks" title="Agent tasks">
+      <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="4" width="18" height="16" rx="3"/><path d="M7 8h10M7 12h6M7 16h8"/></svg>
+      <i class="lasso-agent-tasks-badge" hidden></i>
+    </button>
+
     <button class="lasso-tool-btn notepad-tool" type="button" aria-label="Notepad" title="Scratchpad & Notes">
       <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
         <path d="M16 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V8l-5-5z"/>
@@ -20223,6 +20423,7 @@
     const commentBtn = toolbar.querySelector(".comment-tool");
     const gitBtn = toolbar.querySelector(".git-tool");
     const todoBtn = toolbar.querySelector(".todo-tool");
+    const agentTasksBtn = toolbar.querySelector(".agent-tasks-tool");
     const notepadBtn = toolbar.querySelector(".notepad-tool");
     const clipboardBtn = toolbar.querySelector(".clipboard-tool");
     const voiceBtn = toolbar.querySelector(".voice-tool");
@@ -20259,6 +20460,11 @@
       e.stopPropagation();
       toggleTodoPanel();
     });
+    agentTasksBtn.addEventListener("click", (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      toggleTaskPanel();
+    });
     notepadBtn.addEventListener("click", (e) => {
       e.preventDefault();
       e.stopPropagation();
@@ -20354,6 +20560,9 @@
             setGeneratedCommitMessage(message.message || "", message.error);
           }
           if (message.type === "agent_status" && message.status && message.message) {
+            const taskStatus = message.status === "error" ? "error" : message.status === "stopped" ? "stopped" : message.status;
+            updateAgentTask(message.taskId, { status: taskStatus, message: message.message, detail: message.detail, changes: message.changes });
+            if (message.taskId && message.taskId !== state.activeTaskId) return;
             setAgentStatus(message.status, message.message, message.detail);
             setDragCardStatus(message.status, message.message);
             if (message.status === "review" && message.changes?.length) {
@@ -20368,11 +20577,15 @@
             }
           }
           if (message.type === "assistant_message" && message.message) {
+            updateAgentTask(message.taskId, { status: "complete", message: "Complete", response: message.message });
+            if (message.taskId && message.taskId !== state.activeTaskId) return;
             void notifyAgent("Agent complete", message.message);
             appendChat("assistant", message.message);
             resetAgentState();
           }
           if (message.type === "applied" || message.type === "undone") {
+            updateAgentTask(message.taskId, { status: "complete", message: message.message || "Done." });
+            if (message.taskId && message.taskId !== state.activeTaskId) return;
             void notifyAgent(message.type === "applied" ? "Changes applied" : "Change undone", message.message || "Done.");
             appendChat("assistant", message.message || "Done.");
             releaseHeldLock();
@@ -20412,6 +20625,7 @@
     buildTodoPanel();
     buildNotepadPanel();
     buildClipboardPanel();
+    buildTaskPanel();
     buildPrompt();
     buildDrag();
     initErrorListeners();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lasso-ai/cli",
-  "version": "1.0.17",
+  "version": "1.0.19",
   "description": "Select any part of your running app, describe a change, and let AI edit the real source code.",
   "type": "commonjs",
   "main": "dist/cli/index.js",