kandown 0.4.0 → 0.7.0

package/bin/tui.js

@@ -27895,7 +27895,7 @@ var require_backend = __commonJS({
                     });
                     return value;
                   },
-                  useEffect: function useEffect9(create3) {
+                  useEffect: function useEffect10(create3) {
                     nextHook();
                     hookLog.push({
                       displayName: null,
@@ -27968,7 +27968,7 @@ var require_backend = __commonJS({
                     return [initialArg, function() {
                     }];
                   },
-                  useRef: function useRef5(initialValue) {
+                  useRef: function useRef6(initialValue) {
                     var hook = nextHook();
                     initialValue = null !== hook ? hook.memoizedState : {
                       current: initialValue
@@ -27983,7 +27983,7 @@ var require_backend = __commonJS({
                     });
                     return initialValue;
                   },
-                  useState: function useState9(initialState) {
+                  useState: function useState10(initialState) {
                     var hook = nextHook();
                     initialState = null !== hook ? hook.memoizedState : "function" === typeof initialState ? initialState() : initialState;
                     hookLog.push({
@@ -54326,7 +54326,7 @@ function ValueDisplay({ setting, value, focused }) {
 }
 
 // src/cli/screens/board.tsx
-var import_react36 = __toESM(require_react(), 1);
+var import_react38 = __toESM(require_react(), 1);
 
 // src/cli/lib/board-reader.ts
 import { existsSync as existsSync3, readdirSync, readFileSync as readFileSync3, writeFileSync as writeFileSync2 } from "fs";
@@ -56755,8 +56755,224 @@ function AgentPicker({ agents, taskId, onSelect, onCancel }) {
   );
 }
 
-// src/cli/screens/board.tsx
+// src/cli/hooks/use-mouse.ts
+var import_react36 = __toESM(require_react(), 1);
+var MOUSE_ENABLE_X10 = "\x1B[?1000h";
+var MOUSE_DISABLE_X10 = "\x1B[?1000l";
+var MOUSE_ENABLE_SGR = "\x1B[?1006h";
+var MOUSE_DISABLE_SGR = "\x1B[?1006l";
+function parseSGRMouse(buffer) {
+  const sgrRegex = /^\x1b\[<(\d+);(\d+);(\d+)([Mm])/;
+  const match = buffer.match(sgrRegex);
+  if (!match) return null;
+  const cb = parseInt(match[1], 10);
+  const cx = parseInt(match[2], 10);
+  const cy = parseInt(match[3], 10);
+  const isPress = match[4] === "M";
+  const button = cb & 3;
+  const shift = (cb & 4) !== 0;
+  const meta = (cb & 8) !== 0;
+  const ctrl = (cb & 16) !== 0;
+  return {
+    event: {
+      x: cx,
+      y: cy,
+      button,
+      action: isPress ? "press" : "release",
+      shift,
+      meta,
+      ctrl
+    },
+    endIndex: match[0].length
+  };
+}
+function parseX10Mouse(buffer) {
+  if (!buffer.startsWith("\x1B[M")) return null;
+  if (buffer.length < 6) return null;
+  const cb = buffer.charCodeAt(3) - 32;
+  const cx = buffer.charCodeAt(4) - 32;
+  const cy = buffer.charCodeAt(5) - 32;
+  if (cb < 0 || cx < 0 || cy < 0) return null;
+  const button = cb & 3;
+  const shift = (cb & 4) !== 0;
+  const meta = (cb & 8) !== 0;
+  const ctrl = (cb & 16) !== 0;
+  return {
+    event: {
+      x: cx,
+      y: cy,
+      button,
+      action: "press",
+      // X10 only reports press
+      shift,
+      meta,
+      ctrl
+    },
+    endIndex: 6
+  };
+}
+function useMouse(handler, options = {}) {
+  const { enabled = true, pressOnly = true } = options;
+  const handlerRef = (0, import_react36.useRef)(handler);
+  handlerRef.current = handler;
+  (0, import_react36.useEffect)(() => {
+    if (!enabled) return;
+    const stdin = process.stdin;
+    if (!stdin.isTTY) return;
+    process.stdout.write(MOUSE_ENABLE_SGR + MOUSE_ENABLE_X10);
+    let buffer = "";
+    const onData = (data) => {
+      buffer += data.toString("utf8");
+      while (buffer.length > 0) {
+        let parsed = parseSGRMouse(buffer);
+        if (!parsed) {
+          parsed = parseX10Mouse(buffer);
+        }
+        if (parsed) {
+          const { event, endIndex } = parsed;
+          buffer = buffer.slice(endIndex);
+          if (pressOnly && event.action === "release") continue;
+          if (event.button === 3 && event.action === "press") continue;
+          handlerRef.current(event);
+        } else if (buffer.startsWith("\x1B[")) {
+          if (buffer.length >= 3 && buffer[2] !== "<" && buffer[2] !== "M") {
+            const leftover = buffer;
+            buffer = "";
+            stdin.unshift(Buffer.from(leftover, "utf8"));
+            break;
+          }
+          if (buffer.length > 32) {
+            const leftover = buffer;
+            buffer = "";
+            stdin.unshift(Buffer.from(leftover, "utf8"));
+          }
+          break;
+        } else if (buffer.startsWith("\x1B") && buffer.length > 1 && buffer[1] !== "[") {
+          const leftover = buffer;
+          buffer = "";
+          stdin.unshift(Buffer.from(leftover, "utf8"));
+          break;
+        } else if (buffer.startsWith("\x1B") && buffer.length === 1) {
+          break;
+        } else {
+          const leftover = buffer;
+          buffer = "";
+          stdin.unshift(Buffer.from(leftover, "utf8"));
+          break;
+        }
+      }
+      if (buffer.length > 256) {
+        const leftover = buffer;
+        buffer = "";
+        stdin.unshift(Buffer.from(leftover, "utf8"));
+      }
+    };
+    stdin.prependListener("data", onData);
+    const cleanup = () => {
+      process.stdout.write(MOUSE_DISABLE_SGR + MOUSE_DISABLE_X10);
+    };
+    process.on("exit", cleanup);
+    return () => {
+      stdin.removeListener("data", onData);
+      process.removeListener("exit", cleanup);
+      process.stdout.write(MOUSE_DISABLE_SGR + MOUSE_DISABLE_X10);
+    };
+  }, [enabled, pressOnly]);
+}
+
+// src/cli/components/task-context-menu.tsx
+var import_react37 = __toESM(require_react(), 1);
 var import_jsx_runtime3 = __toESM(require_jsx_runtime(), 1);
+function TaskContextMenu({
+  taskId,
+  options,
+  onSelect,
+  onCancel,
+  mouseX,
+  mouseY,
+  onMouseClick,
+  menuStartRow
+}) {
+  const [cursor, setCursor] = (0, import_react37.useState)(0);
+  use_input_default((input, key) => {
+    if (key.escape || input === "q") {
+      onCancel();
+      return;
+    }
+    if (key.downArrow || input === "j") {
+      setCursor((c) => Math.min(c + 1, options.length - 1));
+      return;
+    }
+    if (key.upArrow || input === "k") {
+      setCursor((c) => Math.max(c - 1, 0));
+      return;
+    }
+    if (key.return) {
+      const opt = options[cursor];
+      if (opt) onSelect(opt.id);
+      return;
+    }
+  });
+  const maxLabelLen = Math.max(...options.map((o) => o.label.length));
+  const menuWidth = Math.max(24, maxLabelLen + 8);
+  const lines = [];
+  const startRow = menuStartRow ?? 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+    Box_default,
+    {
+      flexDirection: "column",
+      paddingLeft: 2,
+      marginTop: 0,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "gray", dimColor: true, children: "\u250C\u2500 " }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "cyan", bold: true, children: taskId }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "gray", dimColor: true, children: " \u2500\u2510" })
+        ] }),
+        options.map((opt, idx) => {
+          const focused = idx === cursor;
+          const lineY = startRow + 1 + idx;
+          lines.push({ optionId: opt.id, y: lineY });
+          return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "gray", dimColor: true, children: "\u2502 " }),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+              Text,
+              {
+                color: focused ? "black" : "gray",
+                backgroundColor: focused ? "cyan" : void 0,
+                bold: focused,
+                children: [
+                  focused ? "\u25B8" : " ",
+                  " ",
+                  opt.icon,
+                  " ",
+                  opt.label
+                ]
+              }
+            ),
+            !focused && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: "gray", dimColor: true, children: [
+              " ".repeat(Math.max(0, menuWidth - opt.label.length - 4)),
+              "\u2502"
+            ] }),
+            focused && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: "gray", dimColor: true, children: [
+              " ".repeat(Math.max(0, menuWidth - opt.label.length - 4)),
+              "\u2502"
+            ] })
+          ] }, opt.id);
+        }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box_default, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: "gray", dimColor: true, children: [
+          "\u2514",
+          "\u2500".repeat(menuWidth),
+          "\u2518"
+        ] }) })
+      ]
+    }
+  );
+}
+
+// src/cli/screens/board.tsx
+var import_jsx_runtime4 = __toESM(require_jsx_runtime(), 1);
+var HEADER_LINES = 4;
 function truncate(str, maxLen) {
   if (str.length <= maxLen) return str;
   return str.slice(0, maxLen - 1) + "\u2026";
@@ -56791,44 +57007,65 @@ function TaskRow({
   const tagChars = tag ? tag.length + 1 : 0;
   const available = colWidth - fixedChars - tagChars;
   const titleStr = truncate(titleWithoutTag, Math.max(4, available));
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: focused ? "cyan" : void 0, bold: focused, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box_default, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: focused ? "cyan" : void 0, bold: focused, children: [
       cursor,
       " "
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: task.checked ? "green" : focused ? "white" : "gray", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: task.checked ? "green" : focused ? "white" : "gray", children: [
       check2,
       " "
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: focused ? "cyan" : "yellow", bold: focused, children: idStr }),
-    tag && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: focused ? "white" : "magenta", bold: true, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: focused ? "cyan" : "yellow", bold: focused, children: idStr }),
+    tag && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: focused ? "white" : "magenta", bold: true, children: [
       " ",
       tag
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: focused ? "white" : "gray", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: focused ? "white" : "gray", children: [
       " ",
       titleStr
     ] })
   ] });
 }
+function MovePlaceholder({
+  name,
+  focused,
+  colWidth
+}) {
+  const label = `\u2193 ${name}`;
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Box_default, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+    Text,
+    {
+      color: focused ? "black" : "yellow",
+      backgroundColor: focused ? "yellow" : void 0,
+      bold: focused,
+      children: [
+        "  ",
+        pad(label, colWidth - 2)
+      ]
+    }
+  ) });
+}
 function KanbanColumn({
   name,
   tasks,
   focusedRow,
   isFocused,
-  colWidth
+  colWidth,
+  showMoveTarget,
+  isMoveFocused
 }) {
   const headerBg = isFocused ? "cyan" : void 0;
   const headerColor = isFocused ? "black" : "cyan";
   const countStr = tasks.length > 0 ? ` (${tasks.length})` : "";
   const headerText = truncate(`${name}${countStr}`, colWidth);
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { flexDirection: "column", width: colWidth, marginRight: 1, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box_default, { backgroundColor: headerBg, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: headerColor, bold: true, children: pad(headerText, colWidth) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: isFocused ? "cyan" : "gray", children: "\u2500".repeat(colWidth) }),
-    tasks.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: "gray", dimColor: true, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box_default, { flexDirection: "column", width: colWidth, marginRight: 1, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Box_default, { backgroundColor: headerBg, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: headerColor, bold: true, children: pad(headerText, colWidth) }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: isFocused ? "cyan" : "gray", children: "\u2500".repeat(colWidth) }),
+    tasks.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: "gray", dimColor: true, children: [
       " ".repeat(2),
       "(empty)"
-    ] }) : tasks.map((task, idx) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    ] }) : tasks.map((task, idx) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
       TaskRow,
       {
         task,
@@ -56836,28 +57073,32 @@ function KanbanColumn({
         colWidth
       },
       task.id
-    ))
+    )),
+    showMoveTarget && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(MovePlaceholder, { name, focused: !!isMoveFocused, colWidth })
   ] });
 }
-function BoardHeader({ title, inTmux }) {
+function BoardHeader({ title, inTmux, modeHint, version }) {
   const tmuxHint = inTmux ? " tmux" : "";
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { marginBottom: 1, justifyContent: "space-between", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { bold: true, color: "cyan", children: [
+  const hint = modeHint || "h/l cols  j/k tasks  Enter detail  a agent  r reload  q quit";
+  const versionTag = version ? ` v${version}` : "";
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box_default, { marginBottom: 1, justifyContent: "space-between", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { bold: true, color: "cyan", children: [
       "  ",
       "KANDOWN",
       tmuxHint,
+      versionTag,
       "  ",
       title
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "gray", dimColor: true, children: "h/l cols  j/k tasks  Enter detail  a agent  r reload  q quit" })
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "gray", dimColor: true, children: hint })
   ] });
 }
 function StatusBar({ message, task }) {
   if (message) {
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box_default, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "yellow", children: message }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Box_default, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "yellow", children: message }) });
   }
-  if (!task) return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box_default, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "gray", children: " " }) });
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box_default, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: "gray", children: [
+  if (!task) return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Box_default, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "gray", children: " " }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Box_default, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: "gray", children: [
     task.id.replace(/^t/, ""),
     task.progress ? `  (${task.progress.done}/${task.progress.total})` : "",
     "  ",
@@ -56873,27 +57114,27 @@ function TaskDetail({
   const bodyLines = task.body.split("\n");
   const maxVisible = (process.stdout.rows || 24) - 10;
   const visibleLines = bodyLines.slice(scrollOffset, scrollOffset + maxVisible);
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { flexDirection: "column", paddingX: 2, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { marginBottom: 1, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { bold: true, color: "cyan", children: taskId }),
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: "white", bold: true, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box_default, { flexDirection: "column", paddingX: 2, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box_default, { marginBottom: 1, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { bold: true, color: "cyan", children: taskId }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: "white", bold: true, children: [
         "  ",
         fm.title
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box_default, { marginBottom: 1, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: "gray", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Box_default, { marginBottom: 1, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: "gray", children: [
       "status: ",
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "yellow", children: fm.status ?? "\u2014" }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "yellow", children: fm.status ?? "\u2014" }),
       fm.priority ? `  priority: ${fm.priority}` : "",
       fm.assignee ? `  assignee: ${fm.assignee}` : "",
       fm.due ? `  due: ${fm.due}` : ""
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "gray", children: "\u2500".repeat(termWidth() - 4) }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "gray", children: "\u2500".repeat(termWidth() - 4) }),
     visibleLines.map((line, idx) => {
       const isHeader = RE_HEADER.test(line);
       const isSubtask = RE_SUBTASK.test(line);
       const isDone = RE_DONE_SUBTASK.test(line);
-      return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
         Text,
         {
           color: isHeader ? "cyan" : isDone ? "green" : isSubtask ? "white" : "gray",
@@ -56903,7 +57144,7 @@ function TaskDetail({
         scrollOffset + idx
       );
     }),
-    bodyLines.length > maxVisible && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: "gray", dimColor: true, children: [
+    bodyLines.length > maxVisible && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: "gray", dimColor: true, children: [
       "  ",
       "\u2191\u2193 scroll  (",
       scrollOffset + 1,
@@ -56915,66 +57156,92 @@ function TaskDetail({
     ] })
   ] });
 }
-function Board({ kandownDir }) {
+function Board({ kandownDir, version }) {
   const { exit } = use_app_default();
-  const [board, setBoard] = (0, import_react36.useState)(null);
-  const [colIndex, setColIndex] = (0, import_react36.useState)(0);
-  const [rowIndex, setRowIndex] = (0, import_react36.useState)(0);
-  const [mode, setMode] = (0, import_react36.useState)("browse");
-  const [detailTask, setDetailTask] = (0, import_react36.useState)(null);
-  const [detailTaskId, setDetailTaskId] = (0, import_react36.useState)("");
-  const [detailScroll, setDetailScroll] = (0, import_react36.useState)(0);
-  const [installedAgents, setInstalledAgents] = (0, import_react36.useState)([]);
-  const [statusMsg, setStatusMsg] = (0, import_react36.useState)("");
+  const [board, setBoard] = (0, import_react38.useState)(null);
+  const [colIndex, setColIndex] = (0, import_react38.useState)(0);
+  const [rowIndex, setRowIndex] = (0, import_react38.useState)(0);
+  const [mode, setMode] = (0, import_react38.useState)("browse");
+  const [detailTask, setDetailTask] = (0, import_react38.useState)(null);
+  const [detailTaskId, setDetailTaskId] = (0, import_react38.useState)("");
+  const [detailScroll, setDetailScroll] = (0, import_react38.useState)(0);
+  const [installedAgents, setInstalledAgents] = (0, import_react38.useState)([]);
+  const [statusMsg, setStatusMsg] = (0, import_react38.useState)("");
+  const [contextTaskId, setContextTaskId] = (0, import_react38.useState)(null);
+  const [moveTaskId, setMoveTaskId] = (0, import_react38.useState)(null);
+  const [moveTargetCol, setMoveTargetCol] = (0, import_react38.useState)(0);
   const inTmux = isInTmux();
-  (0, import_react36.useEffect)(() => {
+  const layoutRef = (0, import_react38.useRef)({
+    colStarts: [],
+    colWidth: 0,
+    colTaskCounts: []
+  });
+  const updateLayout = (0, import_react38.useCallback)((b) => {
+    if (!b) return;
+    const cw = calcColWidth(b.columns.length);
+    const starts = [];
+    let x = 1;
+    for (let i = 0; i < b.columns.length; i++) {
+      starts.push(x);
+      x += cw + 1;
+    }
+    layoutRef.current = {
+      colStarts: starts,
+      colWidth: cw,
+      colTaskCounts: b.columns.map((c) => c.tasks.length)
+    };
+  }, []);
+  (0, import_react38.useEffect)(() => {
     const loaded = readBoard(kandownDir);
     setBoard(loaded);
+    updateLayout(loaded);
     setInstalledAgents(detectInstalledAgents());
-  }, [kandownDir]);
-  const colIndexRef = (0, import_react36.useRef)(0);
-  const rowIndexRef = (0, import_react36.useRef)(0);
-  (0, import_react36.useEffect)(() => {
+  }, [kandownDir, updateLayout]);
+  (0, import_react38.useEffect)(() => {
     const watcher = createWatcher();
     watcher.on("taskChanged", () => {
       const loaded = readBoard(kandownDir);
       setBoard(loaded);
+      updateLayout(loaded);
     });
     watcher.on("newTaskDetected", (taskId) => {
       const loaded = readBoard(kandownDir);
       setBoard(loaded);
+      updateLayout(loaded);
       setStatusMsg(`New task: ${taskId}`);
       setTimeout(() => setStatusMsg(""), 2e3);
     });
     watcher.on("configChanged", () => {
       const loaded = readBoard(kandownDir);
       setBoard(loaded);
+      updateLayout(loaded);
     });
     watcher.start(kandownDir);
     return () => {
       watcher.stop();
     };
-  }, [kandownDir]);
-  const reloadBoard = (0, import_react36.useCallback)(() => {
+  }, [kandownDir, updateLayout]);
+  const reloadBoard = (0, import_react38.useCallback)(() => {
     const loaded = readBoard(kandownDir);
     setBoard(loaded);
+    updateLayout(loaded);
     setStatusMsg("Board reloaded");
     setTimeout(() => setStatusMsg(""), 1500);
-  }, [kandownDir]);
-  const getFocusedTask = (0, import_react36.useCallback)(() => {
+  }, [kandownDir, updateLayout]);
+  const getFocusedTask = (0, import_react38.useCallback)(() => {
     if (!board) return null;
     const col = board.columns[colIndex];
     if (!col || col.tasks.length === 0) return null;
     return col.tasks[Math.min(rowIndex, col.tasks.length - 1)] ?? null;
   }, [board, colIndex, rowIndex]);
-  const openDetail = (0, import_react36.useCallback)((taskId) => {
+  const openDetail = (0, import_react38.useCallback)((taskId) => {
     const task = readTask(kandownDir, taskId);
     setDetailTask(task);
     setDetailTaskId(taskId);
     setDetailScroll(0);
     setMode("detail");
   }, [kandownDir]);
-  const handleAgentSelect = (0, import_react36.useCallback)((agentId) => {
+  const handleAgentSelect = (0, import_react38.useCallback)((agentId) => {
     const task = getFocusedTask();
     const taskId = mode === "detail" ? detailTaskId : task?.id;
     if (!taskId) return;
@@ -56997,6 +57264,121 @@ function Board({ kandownDir }) {
       }
     }, 50);
   }, [mode, detailTaskId, getFocusedTask, kandownDir, exit, reloadBoard]);
+  const handleMouseClick = (0, import_react38.useCallback)((evt) => {
+    if (evt.button !== 0) return;
+    if (!board) return;
+    const { x, y } = evt;
+    const layout = layoutRef.current;
+    if (mode === "browse") {
+      for (let c = 0; c < board.columns.length; c++) {
+        const colStart = layout.colStarts[c] || 0;
+        const colEnd = colStart + layout.colWidth;
+        if (x >= colStart && x <= colEnd) {
+          const taskRow = y - HEADER_LINES;
+          if (taskRow >= 0 && taskRow < board.columns[c].tasks.length) {
+            setColIndex(c);
+            setRowIndex(taskRow);
+            const task = board.columns[c].tasks[taskRow];
+            if (task) {
+              setContextTaskId(task.id);
+              setMode("context-menu");
+            }
+            return;
+          }
+        }
+      }
+      return;
+    }
+    if (mode === "context-menu") {
+      const maxTasks = Math.max(...board.columns.map((c) => c.tasks.length), 0);
+      const menuStartY = HEADER_LINES + maxTasks + 1;
+      const menuRow = y - menuStartY;
+      if (menuRow === 1) {
+        if (contextTaskId) {
+          setContextTaskId(null);
+          openDetail(contextTaskId);
+        }
+        return;
+      }
+      if (menuRow === 2) {
+        if (contextTaskId) {
+          const taskId = contextTaskId;
+          setContextTaskId(null);
+          setMoveTaskId(taskId);
+          const target = colIndex === 0 ? Math.min(1, board.columns.length - 1) : 0;
+          setMoveTargetCol(target);
+          setMode("move-target");
+        }
+        return;
+      }
+      if (menuRow < 0 || menuRow > 3) {
+        for (let c = 0; c < board.columns.length; c++) {
+          const colStart = layout.colStarts[c] || 0;
+          const colEnd = colStart + layout.colWidth;
+          if (x >= colStart && x <= colEnd) {
+            const taskRow = y - HEADER_LINES;
+            if (taskRow >= 0 && taskRow < board.columns[c].tasks.length) {
+              setColIndex(c);
+              setRowIndex(taskRow);
+              const task = board.columns[c].tasks[taskRow];
+              if (task) {
+                setContextTaskId(task.id);
+              }
+              return;
+            }
+          }
+        }
+        setContextTaskId(null);
+        setMode("browse");
+      }
+      return;
+    }
+    if (mode === "move-target") {
+      let clickedPlaceholder = false;
+      for (let c = 0; c < board.columns.length; c++) {
+        if (c === colIndex) continue;
+        const colStart = layout.colStarts[c] || 0;
+        const colEnd = colStart + layout.colWidth;
+        const colTaskCount = board.columns[c].tasks.length;
+        const placeholderRow = HEADER_LINES + colTaskCount;
+        if (x >= colStart && x <= colEnd && y === placeholderRow) {
+          const targetColName = board.columns[c].name;
+          if (moveTaskId && targetColName) {
+            moveTaskToColumn(kandownDir, moveTaskId, targetColName);
+            const loaded = readBoard(kandownDir);
+            setBoard(loaded);
+            updateLayout(loaded);
+            setStatusMsg(`Moved ${moveTaskId} \u2192 ${targetColName}`);
+            setTimeout(() => setStatusMsg(""), 2e3);
+          }
+          setMoveTaskId(null);
+          setMode("browse");
+          clickedPlaceholder = true;
+          break;
+        }
+      }
+      if (!clickedPlaceholder) {
+        let clickedTask = false;
+        for (let c = 0; c < board.columns.length; c++) {
+          const colStart = layout.colStarts[c] || 0;
+          const colEnd = colStart + layout.colWidth;
+          if (x >= colStart && x <= colEnd) {
+            const taskRow = y - HEADER_LINES;
+            if (taskRow >= 0 && taskRow < board.columns[c].tasks.length) {
+              clickedTask = true;
+              break;
+            }
+          }
+        }
+        if (!clickedTask) {
+          setMoveTaskId(null);
+          setMode("browse");
+        }
+      }
+      return;
+    }
+  }, [board, mode, colIndex, contextTaskId, moveTaskId, kandownDir, updateLayout, openDetail]);
+  useMouse(handleMouseClick, { enabled: mode !== "agent-picker" });
   use_input_default((input, key) => {
     if (mode === "browse") {
       if (input === "q" || key.escape) {
@@ -57045,6 +57427,47 @@ function Board({ kandownDir }) {
         return;
       }
     }
+    if (mode === "context-menu") {
+      return;
+    }
+    if (mode === "move-target") {
+      if (key.escape || input === "q") {
+        setMoveTaskId(null);
+        setMode("browse");
+        return;
+      }
+      if (input === "l" || key.rightArrow) {
+        if (!board) return;
+        const otherCols = board.columns.map((_, i) => i).filter((i) => i !== colIndex);
+        const currentIdx = otherCols.indexOf(moveTargetCol);
+        const nextIdx = Math.min(currentIdx + 1, otherCols.length - 1);
+        setMoveTargetCol(otherCols[nextIdx] ?? 0);
+        return;
+      }
+      if (input === "h" || key.leftArrow) {
+        if (!board) return;
+        const otherCols = board.columns.map((_, i) => i).filter((i) => i !== colIndex);
+        const currentIdx = otherCols.indexOf(moveTargetCol);
+        const prevIdx = Math.max(currentIdx - 1, 0);
+        setMoveTargetCol(otherCols[prevIdx] ?? 0);
+        return;
+      }
+      if (key.return) {
+        if (!board || !moveTaskId) return;
+        const targetColName = board.columns[moveTargetCol]?.name;
+        if (targetColName) {
+          moveTaskToColumn(kandownDir, moveTaskId, targetColName);
+          const loaded = readBoard(kandownDir);
+          setBoard(loaded);
+          updateLayout(loaded);
+          setStatusMsg(`Moved ${moveTaskId} \u2192 ${targetColName}`);
+          setTimeout(() => setStatusMsg(""), 2e3);
+        }
+        setMoveTaskId(null);
+        setMode("browse");
+        return;
+      }
+    }
     if (mode === "detail") {
       if (key.escape || input === "q") {
         setMode("browse");
@@ -57070,17 +57493,17 @@ function Board({ kandownDir }) {
     }
   });
   if (!board) {
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box_default, { padding: 2, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "gray", children: "Loading board\u2026" }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Box_default, { padding: 2, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "gray", children: "Loading board\u2026" }) });
   }
   if (board.columns.length === 0) {
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { flexDirection: "column", padding: 2, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: "red", bold: true, children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box_default, { flexDirection: "column", padding: 2, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: "red", bold: true, children: [
         "No board found at ",
         kandownDir
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: "gray", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: "gray", children: [
         "Run ",
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "cyan", children: "kandown init" }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "cyan", children: "kandown init" }),
         " to set up kandown in this project."
       ] })
     ] });
@@ -57089,9 +57512,9 @@ function Board({ kandownDir }) {
   const focusedTask = getFocusedTask();
   if (mode === "agent-picker") {
     const taskId = detailTaskId || focusedTask?.id || "";
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { flexDirection: "column", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(BoardHeader, { title: board.title, inTmux }),
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box_default, { flexDirection: "column", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(BoardHeader, { title: board.title, inTmux, version }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
         AgentPicker,
         {
           agents: installedAgents,
@@ -57103,45 +57526,89 @@ function Board({ kandownDir }) {
     ] });
   }
   if (mode === "detail" && detailTask) {
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { flexDirection: "column", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { marginBottom: 1, justifyContent: "space-between", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "gray", children: "Esc back  a launch agent  j/k scroll" }),
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text, { color: "gray", dimColor: true, children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box_default, { flexDirection: "column", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box_default, { marginBottom: 1, justifyContent: "space-between", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "gray", children: "Esc back  a launch agent  j/k scroll" }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: "gray", dimColor: true, children: [
           "KANDOWN  ",
           board.title
         ] })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(TaskDetail, { task: detailTask, taskId: detailTaskId, scrollOffset: detailScroll }),
-      statusMsg && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box_default, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text, { color: "yellow", children: statusMsg }) })
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(TaskDetail, { task: detailTask, taskId: detailTaskId, scrollOffset: detailScroll }),
+      statusMsg && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Box_default, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "yellow", children: statusMsg }) })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box_default, { flexDirection: "column", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(BoardHeader, { title: board.title, inTmux }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box_default, { flexDirection: "row", children: board.columns.map((col, cIdx) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  const contextMenuOptions = [
+    { id: "open", label: "Open task", icon: "\u{1F4D6}" },
+    { id: "move", label: "Move task", icon: "\u2197" }
+  ];
+  let modeHint;
+  if (mode === "context-menu") {
+    modeHint = "\u2191/\u2193 navigate  Enter confirm  Esc cancel  (or click)";
+  } else if (mode === "move-target") {
+    modeHint = "\u2190/\u2192 pick column  Enter confirm  Esc cancel  (or click \u2193 placeholder)";
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box_default, { flexDirection: "column", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(BoardHeader, { title: board.title, inTmux, modeHint, version }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Box_default, { flexDirection: "row", children: board.columns.map((col, cIdx) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
       KanbanColumn,
       {
         name: col.name,
         tasks: col.tasks,
         focusedRow: cIdx === colIndex ? rowIndex : -1,
         isFocused: cIdx === colIndex,
-        colWidth
+        colWidth,
+        showMoveTarget: mode === "move-target" && cIdx !== colIndex,
+        isMoveFocused: mode === "move-target" && cIdx === moveTargetCol
       },
       col.name
     )) }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(StatusBar, { message: statusMsg, task: focusedTask })
+    mode === "context-menu" && contextTaskId && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Box_default, { marginTop: 0, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      TaskContextMenu,
+      {
+        taskId: contextTaskId,
+        options: contextMenuOptions,
+        onSelect: (optionId) => {
+          if (optionId === "open") {
+            setContextTaskId(null);
+            openDetail(contextTaskId);
+          } else if (optionId === "move") {
+            setContextTaskId(null);
+            setMoveTaskId(contextTaskId);
+            const target = colIndex === 0 ? Math.min(1, board.columns.length - 1) : 0;
+            setMoveTargetCol(target);
+            setMode("move-target");
+          }
+        },
+        onCancel: () => {
+          setContextTaskId(null);
+          setMode("browse");
+        },
+        mouseX: layoutRef.current.colStarts[colIndex],
+        mouseY: HEADER_LINES + rowIndex
+      }
+    ) }),
+    mode === "move-target" && moveTaskId && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Box_default, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: "yellow", bold: true, children: [
+      "Moving ",
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "cyan", children: moveTaskId }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "gray", children: " \u2014 click a " }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "yellow", bold: true, children: "\u2193" }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text, { color: "gray", children: " placeholder or use \u2190/\u2192 + Enter" })
+    ] }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(StatusBar, { message: statusMsg, task: focusedTask })
   ] });
 }
 
 // src/cli/app.tsx
-var import_jsx_runtime4 = __toESM(require_jsx_runtime(), 1);
+var import_jsx_runtime5 = __toESM(require_jsx_runtime(), 1);
 function App2({ screen, kandownDir, version }) {
   switch (screen) {
     case "settings":
-      return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Settings, { kandownDir, version });
+      return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Settings, { kandownDir, version });
     case "board":
-      return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Board, { kandownDir });
+      return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Board, { kandownDir, version });
     default:
-      return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Box_default, { padding: 2, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Text, { color: "red", bold: true, children: [
+      return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Box_default, { padding: 2, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Text, { color: "red", bold: true, children: [
         "Unknown screen: ",
         screen
       ] }) });
@@ -57149,7 +57616,7 @@ function App2({ screen, kandownDir, version }) {
 }
 
 // src/cli/tui.tsx
-var import_jsx_runtime5 = __toESM(require_jsx_runtime(), 1);
+var import_jsx_runtime6 = __toESM(require_jsx_runtime(), 1);
 async function run(screen, kandownDir, version) {
   if (!process.stdin.isTTY) {
     throw new Error(
@@ -57157,7 +57624,7 @@ async function run(screen, kandownDir, version) {
     );
   }
   process.stdout.write("\x1B[?1049h\x1B[H");
-  const instance = render_default(/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(App2, { screen, kandownDir, version }), {
+  const instance = render_default(/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(App2, { screen, kandownDir, version }), {
     exitOnCtrlC: true
   });
   try {