Answer refinements

web/dist/inbox.js

@@ -7,6 +7,7 @@ import { diagram } from "./mermaid.js";
 import { reviewCard } from "./reviews.js";
 import { focusTab, onEach, state } from "./state.js";
 import { taskStyle } from "./taskcolor.js";
+const delegateText = "Use your judgment for this decision and continue within the existing task instructions.";
 export function mountInbox(root) {
     const list = h("div", { class: "inbox-list" });
     const cards = new Map();
@@ -181,12 +182,15 @@ function card(item) {
         };
         return h("div", { class: "text-entry" }, block, editor);
     };
+    const delegate = () => clickable(h("div", { class: "pick other", role: "button", tabIndex: 0 }, "Let the agent decide"), () => {
+        void submit({ item_id: item.id, type: "other", text: delegateText });
+    });
     const renderActions = () => {
         switch (item.kind) {
             case "question": {
                 const placeholder = "Your answer, a question back, or new instructions";
                 if (!multiple) {
-                    replace(actions, textEntry("Other…", placeholder));
+                    replace(actions, delegate(), textEntry("Other…", placeholder));
                     return;
                 }
                 const send = h("button", { type: "button", class: "primary" }, "Submit");
@@ -207,7 +211,7 @@ function card(item) {
                 const other = textEntry("Other…", placeholder, { onInput: refresh, onSubmit: go });
                 send.onclick = go;
                 refresh();
-                replace(actions, other, h("div", { class: "submit-row" }, send));
+                replace(actions, delegate(), other, h("div", { class: "submit-row" }, send));
                 return;
             }
             default: {
@@ -231,6 +235,18 @@ function card(item) {
             break;
         }
     }
+    el.addEventListener("keydown", (e) => {
+        if (e.key !== "ArrowDown" && e.key !== "ArrowUp") {
+            return;
+        }
+        const stops = [...el.querySelectorAll(".pick, .option.choice-box input")].filter((s) => s.offsetParent !== null);
+        const at = stops.indexOf(e.target);
+        if (at < 0) {
+            return;
+        }
+        e.preventDefault();
+        stops[Math.min(Math.max(at + (e.key === "ArrowDown" ? 1 : -1), 0), stops.length - 1)].focus();
+    });
     renderActions();
     return el;
 }