@gamflaz/opencode-todolist 1.0.4 → 1.0.6

package/dist/tui.js

@@ -1,784 +1,24 @@
-import { memo as _$memo } from "@opentui/solid";
-import { createTextNode as _$createTextNode } from "@opentui/solid";
-import { effect as _$effect } from "@opentui/solid";
-import { insertNode as _$insertNode } from "@opentui/solid";
-import { insert as _$insert } from "@opentui/solid";
 import { createComponent as _$createComponent } from "@opentui/solid";
-import { setProp as _$setProp } from "@opentui/solid";
-import { use as _$use } from "@opentui/solid";
-import { createElement as _$createElement } from "@opentui/solid";
 import { Plugin } from "@opencode/plugin/tui";
-import { mkdirSync, watch } from "node:fs";
-import { createEffect, createMemo, createSignal, For, onCleanup, Show } from "solid-js";
-import { supportsImageRendering } from "./icons/capabilities";
-import { SvgIcon } from "./icons/convert";
-import { arrowDownSvgIcon, arrowRightSvgIcon, continuePromptSvgIcon, removeSvgIcon } from "./icons/icons";
-import { getTodosDirectory, hashSessionID, readTodosSync, writeTodos } from "./store/store";
-import { getTodoDisplaySummary, hasOpenTodos } from "./todo/display";
-import { TodoTree } from "./todo/todo";
-
-/** How many open items the Continue prompt lists before collapsing the rest. */
-export const CONTINUE_PROMPT_MAX_ITEMS = 3;
-
-/** Per-field caps so one long note cannot flood the prompt. */
-export const CONTINUE_PROMPT_MAX_CONTENT = 60;
-export const CONTINUE_PROMPT_MAX_NOTE = 60;
-
-/** Truncates to `max` chars, marking the cut with "...". */
-function shorten(text, max) {
-  return text.length <= max ? text : `${text.slice(0, max - 3).trimEnd()}...`;
-}
-export function buildContinuePrompt(summary) {
-  const statusLabel = {
-    pending: "not started",
-    in_progress: "currently being worked on",
-    completed: "completed",
-    cancelled: "cancelled",
-    error: "needs fixing"
-  };
-  const open = summary?.items.filter(({
-    status
-  }) => status !== "completed" && status !== "cancelled") ?? [];
-  const shown = open.slice(0, CONTINUE_PROMPT_MAX_ITEMS);
-  const hidden = open.length - shown.length;
-  const lines = ["Continue the current todolist.", "First call manage_todo_list [read] and reconcile the stored list with this summary."];
-  if (summary) lines.push(`Progress: ${summary.completed}/${summary.total} completed.`);
-  if (open.length) {
-    lines.push("Open items that still need work (short summary):");
-    lines.push(...shown.map(item => `${item.depth ? "  " : ""}- ${item.id} (${statusLabel[item.status]}) ${shorten(item.content, CONTINUE_PROMPT_MAX_CONTENT)}${item.note ? ` — ${shorten(item.note, CONTINUE_PROMPT_MAX_NOTE)}` : ""}`));
-    if (hidden > 0) lines.push(`... (${hidden} more open item(s))`);
-  } else {
-    lines.push("No open items are listed. Verify the stored state before stopping.");
-  }
-  lines.push("Continue the next open item immediately. Keep exactly one item in_progress and update the todo list after verification.");
-  return lines.join("\n");
-}
-const SPINNER_FRAMES = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
-
-/**
- * Maximum number of todo rows the panel shows before it starts scrolling.
- * Keeping the panel compact protects the composer; scrolling guarantees no
- * row is ever silently dropped.
- */
-export const TODO_PANEL_MAX_ROWS = 8;
-/** Rendered prefix of an error detail row. */
-export const ERROR_PREFIX = "↳ error: ";
-
-/** A renderable line: either a task row or its on-demand note row. */
-
-/**
- * Flattens rows into renderable lines, inserting an error detail right below
- * an expanded error row (click to toggle).
- */
-export function buildTodoListEntries(rows, expandedIds) {
-  const expanded = new Set(expandedIds);
-  const entries = [];
-  for (const row of rows) {
-    entries.push({
-      kind: "row",
-      row
-    });
-    if (row.status === "error" && expanded.has(row.id)) {
-      entries.push({
-        kind: "error",
-        row
-      });
-    }
-  }
-  return entries;
-}
-
-/**
- * Follow the most advanced active row: the last `in_progress` entry is the
- * task currently being executed. Note lines are skipped, they follow their
- * own row.
- */
-export function findActiveEntryIndex(entries) {
-  for (let index = entries.length - 1; index >= 0; index -= 1) {
-    const entry = entries[index];
-    if (entry.kind === "row" && entry.row.status === "in_progress") return index;
-  }
-  return -1;
-}
-
-/**
- * Rendered width of a row: the indentation, the icon cell and the title.
- *
- * Rows must be sized explicitly, otherwise the scroll content never grows
- * wider than the viewport and horizontal scrolling has nothing to move.
- */
-export function rowWidth(row) {
-  const indent = row.depth > 0 ? 2 : 0;
-  const label = row.id !== undefined ? `${TodoTree.formatIdPrefix(row.id, row.depth)}${row.content}` : row.content;
-  // icon glyph + 1 space, then the title.
-  return indent + 1 + 1 + [...label].length;
-}
-
-/** Rendered width of an expanded error line under its row. */
-export function errorRowWidth(row) {
-  const indent = row.depth > 0 ? 4 : 2;
-  return indent + [...(ERROR_PREFIX + row.error)].length;
-}
-/**
- * Scroll offset needed to reveal the active row, or `undefined` when nothing
- * should move (no active row, already visible, or the list fits).
- *
- * Kept pure so the follow behaviour is testable without a live renderer.
- */
-export function nextFollowScrollTop(input) {
-  const {
-    currentTop,
-    activeIndex,
-    rowCount,
-    viewportHeight
-  } = input;
-  if (activeIndex < 0) return undefined;
-  const viewport = Math.max(1, viewportHeight);
-  const maxTop = Math.max(0, rowCount - viewport);
-  if (maxTop === 0) return undefined;
-  const activeBottom = activeIndex + 1;
-  const visibleTop = currentTop;
-  const visibleBottom = currentTop + viewport;
-  if (activeIndex >= visibleTop && activeBottom <= visibleBottom) {
-    return undefined;
-  }
-  const targetTop = activeIndex >= visibleBottom ? activeBottom - viewport : activeIndex;
-  return Math.min(Math.max(0, targetTop), maxTop);
-}
-
-/**
- * Follow the most advanced active row: the last `in_progress` entry is the
- * task currently being executed.
- */
-export function findActiveRowIndex(rows) {
-  for (let index = rows.length - 1; index >= 0; index -= 1) {
-    if (rows[index]?.status === "in_progress") return index;
-  }
-  return -1;
-}
-
-/**
- * Presentational, context-free todo list.
- *
- * The panel is deliberately chrome-free: no indicator row, and the horizontal
- * scrollbar stays hidden. Long titles never wrap (that would break the
- * one-line-per-row layout) — they are reached by scrolling left/right, and the
- * vertical list scrolls when it exceeds `TODO_PANEL_MAX_ROWS`. When a row is
- * `in_progress` the panel follows it so the active task is never out of sight.
- */
-export function TodoList(props) {
-  const rowId = id => `todo-row-${id}`;
-  const [scrollYBox, setScrollYBox] = createSignal();
-  const [scrollXBox, setScrollXBox] = createSignal();
-  const entries = createMemo(() => buildTodoListEntries(props.rows, props.expandedIds ?? []));
-  const followActiveRow = box => {
-    if (box.isDestroyed) return;
-    const target = nextFollowScrollTop({
-      currentTop: box.scrollTop,
-      activeIndex: findActiveEntryIndex(entries()),
-      rowCount: entries().length,
-      viewportHeight: box.viewport.height
-    });
-    if (target === undefined) return;
-    box.scrollTo(target);
-  };
-  const attach = box => {
-    setScrollYBox(box);
-    box.content.maxWidth = undefined;
-    const internalOnSizeChange = box.content.onSizeChange;
-    box.content.onSizeChange = () => {
-      internalOnSizeChange?.call(box.content);
-      followActiveRow(box);
-    };
-    props.ref?.(box);
-  };
-  createEffect(() => {
-    void props.rows.map(row => `${row.id}:${row.status}`).join("|");
-    void props.expandedIds?.join("|");
-    const box = scrollYBox();
-    if (box) followActiveRow(box);
-  });
-  const scrollbarOptions = () => props.scrollbarColor ? {
-    trackOptions: {
-      backgroundColor: props.scrollbarColor,
-      foregroundColor: props.scrollbarColor
-    }
-  } : undefined;
-  const viewportHeight = () => Math.min(entries().length, TODO_PANEL_MAX_ROWS);
-  const toggle = id => {
-    props.onToggleRow?.(id);
-  };
-  return (() => {
-    var _el$ = _$createElement("scrollbox"),
-      _el$2 = _$createElement("box");
-    _$insertNode(_el$, _el$2);
-    _$use(el => attach(el), _el$);
-    _$setProp(_el$, "width", "100%");
-    _$setProp(_el$, "horizontalScrollbarOptions", {
-      visible: false
-    });
-    _$setProp(_el$2, "flexDirection", "column");
-    _$setProp(_el$2, "flexShrink", 0);
-    _$insert(_el$2, _$createComponent(For, {
-      get each() {
-        return entries();
-      },
-      children: entry => entry.kind === "row" ? (() => {
-        var _el$3 = _$createElement("box"),
-          _el$4 = _$createElement("text"),
-          _el$7 = _$createElement("span"),
-          _el$8 = _$createTextNode(` `),
-          _el$9 = _$createElement("span"),
-          _el$0 = _$createElement("span");
-        _$insertNode(_el$3, _el$4);
-        _$setProp(_el$3, "flexDirection", "row");
-        _$setProp(_el$3, "height", 1);
-        _$setProp(_el$3, "flexShrink", 0);
-        _$setProp(_el$3, "onMouseDown", e => {
-          if (e.button === 0 && entry.row.status === "error") {
-            e.stopPropagation?.();
-            toggle(entry.row.id);
-          }
-        });
-        _$insertNode(_el$4, _el$7);
-        _$insertNode(_el$4, _el$9);
-        _$insertNode(_el$4, _el$0);
-        _$setProp(_el$4, "wrapMode", "none");
-        _$insert(_el$4, _$createComponent(Show, {
-          get when() {
-            return entry.row.depth > 0;
-          },
-          get children() {
-            var _el$5 = _$createElement("span");
-            _$insertNode(_el$5, _$createTextNode(`  `));
-            return _el$5;
-          }
-        }), _el$7);
-        _$insertNode(_el$7, _el$8);
-        _$insert(_el$7, () => entry.row.icon, _el$8);
-        _$insert(_el$9, () => TodoTree.formatIdPrefix(entry.row.id, entry.row.depth));
-        _$insert(_el$0, () => entry.row.content);
-        _$insert(_el$4, _$createComponent(Show, {
-          get when() {
-            return entry.row.status === "error";
-          },
-          get children() {
-            var _el$1 = _$createElement("span"),
-              _el$10 = _$createTextNode(` `);
-            _$insertNode(_el$1, _el$10);
-            _$insert(_el$1, () => (props.expandedIds ?? []).includes(entry.row.id) ? "⌄" : "›", null);
-            _$effect(_$p => _$setProp(_el$1, "style", {
-              fg: props.scrollbarColor
-            }, _$p));
-            return _el$1;
-          }
-        }), null);
-        _$effect(_p$ => {
-          var _v$3 = rowId(entry.row.id),
-            _v$4 = rowWidth(entry.row),
-            _v$5 = {
-              fg: entry.row.iconColor
-            },
-            _v$6 = {
-              fg: entry.row.textColor
-            },
-            _v$7 = {
-              fg: entry.row.textColor,
-              strikethrough: entry.row.status === "completed"
-            };
-          _v$3 !== _p$.e && (_p$.e = _$setProp(_el$3, "id", _v$3, _p$.e));
-          _v$4 !== _p$.t && (_p$.t = _$setProp(_el$3, "width", _v$4, _p$.t));
-          _v$5 !== _p$.a && (_p$.a = _$setProp(_el$7, "style", _v$5, _p$.a));
-          _v$6 !== _p$.o && (_p$.o = _$setProp(_el$9, "style", _v$6, _p$.o));
-          _v$7 !== _p$.i && (_p$.i = _$setProp(_el$0, "style", _v$7, _p$.i));
-          return _p$;
-        }, {
-          e: undefined,
-          t: undefined,
-          a: undefined,
-          o: undefined,
-          i: undefined
-        });
-        return _el$3;
-      })() : (() => {
-        var _el$11 = _$createElement("box"),
-          _el$12 = _$createElement("text"),
-          _el$13 = _$createElement("span"),
-          _el$14 = _$createTextNode(`↳ error: `),
-          _el$15 = _$createElement("span");
-        _$insertNode(_el$11, _el$12);
-        _$setProp(_el$11, "flexDirection", "row");
-        _$setProp(_el$11, "height", 1);
-        _$setProp(_el$11, "flexShrink", 0);
-        _$setProp(_el$11, "onMouseDown", e => {
-          if (e.button === 0) {
-            e.stopPropagation?.();
-            toggle(entry.row.id);
+import { TodoProgress } from "./tui/todo-panel";
+export default Plugin.define({
+  id: "opencode.todolist.tui",
+  setup(context) {
+    const releaseSlot = context.ui.slot({
+      append: "session.composer.top",
+      render: props => {
+        const directory = context.data.session.get(props.sessionID)?.location.directory;
+        if (!directory) return null;
+        return _$createComponent(TodoProgress, {
+          context: context,
+          get sessionID() {
+            return props.sessionID;
           }
         });
-        _$insertNode(_el$12, _el$13);
-        _$insertNode(_el$12, _el$15);
-        _$setProp(_el$12, "wrapMode", "none");
-        _$insertNode(_el$13, _el$14);
-        _$insert(_el$13, () => entry.row.depth > 0 ? "    " : "  ", _el$14);
-        _$insert(_el$15, () => entry.row.content);
-        _$effect(_p$ => {
-          var _v$8 = `${rowId(entry.row.id)}-note`,
-            _v$9 = errorRowWidth({
-              error: entry.row.content,
-              depth: entry.row.depth
-            }),
-            _v$0 = {
-              fg: props.scrollbarColor
-            },
-            _v$1 = {
-              fg: entry.row.textColor
-            };
-          _v$8 !== _p$.e && (_p$.e = _$setProp(_el$11, "id", _v$8, _p$.e));
-          _v$9 !== _p$.t && (_p$.t = _$setProp(_el$11, "width", _v$9, _p$.t));
-          _v$0 !== _p$.a && (_p$.a = _$setProp(_el$13, "style", _v$0, _p$.a));
-          _v$1 !== _p$.o && (_p$.o = _$setProp(_el$15, "style", _v$1, _p$.o));
-          return _p$;
-        }, {
-          e: undefined,
-          t: undefined,
-          a: undefined,
-          o: undefined
-        });
-        return _el$11;
-      })()
-    }));
-    _$effect(_p$ => {
-      var _v$ = viewportHeight(),
-        _v$2 = scrollbarOptions();
-      _v$ !== _p$.e && (_p$.e = _$setProp(_el$, "height", _v$, _p$.e));
-      _v$2 !== _p$.t && (_p$.t = _$setProp(_el$, "verticalScrollbarOptions", _v$2, _p$.t));
-      return _p$;
-    }, {
-      e: undefined,
-      t: undefined
-    });
-    return _el$;
-  })();
-}
-function TodoProgress(props) {
-  const [refresh, setRefresh] = createSignal(0);
-
-  // Hover
-  const [isClearHovered, setIsClearHovered] = createSignal(false);
-  const [isContinueHovered, setIsContinueHovered] = createSignal(false);
-  const [isCollapsed, setIsCollapsed] = createSignal(true);
-  const [isContinuePending, setIsContinuePending] = createSignal(false);
-  const [animFrame, setAnimFrame] = createSignal(0);
-  const [expandedIds, setExpandedIds] = createSignal([]);
-  let timer;
-  let watcher;
-  let animTimer;
-  const [imageSupported, setImageSupported] = createSignal(supportsImageRendering(props.context.renderer?.capabilities));
-  const updateCapabilities = caps => {
-    setImageSupported(supportsImageRendering(caps));
-  };
-  props.context.renderer?.on?.("capabilities", updateCapabilities);
-  onCleanup(() => {
-    props.context.renderer?.off?.("capabilities", updateCapabilities);
-  });
-  const getSessionID = () => props.sessionID ?? "";
-  const checkRunning = () => {
-    const sid = getSessionID();
-    if (!sid) return false;
-    try {
-      return props.context.data.session.status(sid) === "running";
-    } catch {
-      return false;
-    }
-  };
-  const [isRunning, setIsRunning] = createSignal(checkRunning());
-  const unsubscribe = props.context.data.listen(({
-    details
-  }) => {
-    const sid = getSessionID();
-    switch (details.type) {
-      case "session.execution.started":
-      case "session.execution.interrupted":
-      case "session.execution.succeeded":
-      case "session.execution.failed":
-      case "session.idle":
-        if (!sid || details.data.sessionID === sid) {
-          setIsRunning(details.type === "session.execution.started");
-          setIsContinuePending(false);
-        }
-        break;
-      case "session.status":
-        if (!sid || details.data.sessionID === sid) {
-          setIsRunning(details.data.status.type !== "idle");
-          setIsContinuePending(false);
-        }
-        break;
-    }
-  });
-  createEffect(() => {
-    const sid = getSessionID();
-    if (!sid) {
-      setIsRunning(false);
-      return;
-    }
-    try {
-      setIsRunning(props.context.data.session.status(sid) === "running");
-    } catch {
-      setIsRunning(false);
-    }
-  });
-  const startAnimation = () => {
-    if (animTimer) return;
-    animTimer = setInterval(() => {
-      setAnimFrame(prev => (prev + 1) % SPINNER_FRAMES.length);
-    }, 100);
-  };
-  const stopAnimation = () => {
-    if (animTimer) {
-      clearInterval(animTimer);
-      animTimer = undefined;
-    }
-  };
-  try {
-    const baseDir = getTodosDirectory();
-    mkdirSync(baseDir, {
-      recursive: true
-    });
-    watcher = watch(baseDir, {
-      recursive: true,
-      persistent: false
-    }, (_, filename) => {
-      const sid = getSessionID();
-      if (!filename) {
-        clearTimeout(timer);
-        timer = setTimeout(() => setRefresh(value => value + 1), 50);
-        return;
-      }
-      const nameStr = String(filename);
-      let hashedSid = "";
-      try {
-        if (sid) hashedSid = hashSessionID(sid);
-      } catch {}
-      if (!sid || hashedSid && nameStr.startsWith(hashedSid) || nameStr.startsWith(sid) || nameStr.startsWith(`todos-${sid}-`)) {
-        clearTimeout(timer);
-        timer = setTimeout(() => setRefresh(value => value + 1), 50);
       }
     });
-  } catch (err) {
-    console.error("[todos] watcher initialization failed:", err);
+    return () => {
+      releaseSlot();
+    };
   }
-  onCleanup(() => {
-    clearTimeout(timer);
-    stopAnimation();
-    watcher?.close();
-    try {
-      unsubscribe();
-    } catch {}
-  });
-  const summary = createMemo(() => {
-    refresh();
-    const sid = getSessionID();
-    if (!sid) return null;
-    try {
-      return getTodoDisplaySummary(readTodosSync(sid));
-    } catch {
-      return null;
-    }
-  });
-  createEffect(() => {
-    const hasInProgress = summary()?.items.some(i => i.status === "in_progress");
-    if (hasInProgress && isRunning()) {
-      startAnimation();
-    } else {
-      stopAnimation();
-    }
-  });
-  const activeItem = createMemo(() => {
-    const d = summary();
-    if (!d) return null;
-    return d.items.find(i => i.status === "in_progress" && i.depth > 0) ?? d.items.find(i => i.status === "in_progress") ?? null;
-  });
-  const toggleRowNote = id => {
-    setExpandedIds(current => current.includes(id) ? current.filter(entry => entry !== id) : [...current, id]);
-  };
-  const continueTodos = async () => {
-    if (isRunning() || isContinuePending()) return;
-    const sid = getSessionID();
-    if (!sid) return;
-    setIsContinuePending(true);
-    try {
-      await props.context.client.session.prompt({
-        sessionID: sid,
-        text: buildContinuePrompt(summary())
-      });
-    } catch (error) {
-      setIsContinuePending(false);
-      console.error("[todos] continue failed:", error);
-    }
-  };
-  const getItemIcon = (status, fallbackIcon) => {
-    if (status === "in_progress") {
-      if (isRunning()) {
-        return SPINNER_FRAMES[animFrame()];
-      }
-      return "-";
-    }
-    return fallbackIcon;
-  };
-  const theme = () => props.context.theme;
-  const getStatusColor = status => {
-    const t = theme();
-    switch (status) {
-      case "in_progress":
-        return isRunning() ? t.text.action?.primary?.base ?? t.text.feedback.info?.base ?? t.text.base : t.text.muted;
-      case "completed":
-        return t.text.feedback.success.base;
-      case "error":
-        return t.text.feedback.error.base;
-      case "cancelled":
-        return t.text.feedback.error.base;
-      case "pending":
-      default:
-        return t.text.muted;
-    }
-  };
-  const getTextColor = status => {
-    const t = theme();
-    if (status === "completed" || status === "cancelled" || status === "error") {
-      return t.text.muted;
-    }
-    return t.text.base;
-  };
-  const getBorderColor = () => {
-    return theme().border.base;
-  };
-  const a = "";
-  return _$createComponent(Show, {
-    get when() {
-      return summary();
-    },
-    children: data => (() => {
-      var _el$16 = _$createElement("box"),
-        _el$17 = _$createElement("box"),
-        _el$18 = _$createElement("box"),
-        _el$19 = _$createElement("box"),
-        _el$20 = _$createElement("box"),
-        _el$21 = _$createElement("text"),
-        _el$22 = _$createElement("span"),
-        _el$24 = _$createElement("span"),
-        _el$28 = _$createElement("box");
-      _$insertNode(_el$16, _el$17);
-      _$setProp(_el$16, "flexDirection", "column");
-      _$setProp(_el$16, "border", true);
-      _$setProp(_el$16, "borderStyle", "rounded");
-      _$setProp(_el$16, "paddingLeft", 1);
-      _$setProp(_el$16, "paddingRight", 1);
-      _$insertNode(_el$17, _el$18);
-      _$insertNode(_el$17, _el$28);
-      _$setProp(_el$17, "flexDirection", "row");
-      _$setProp(_el$17, "justifyContent", "space-between");
-      _$insertNode(_el$18, _el$19);
-      _$insertNode(_el$18, _el$20);
-      _$setProp(_el$18, "flexDirection", "row");
-      _$setProp(_el$18, "flexGrow", 1);
-      _$setProp(_el$18, "onMouseDown", e => {
-        if (e.button === 0) {
-          e.stopPropagation?.();
-          setIsCollapsed(!isCollapsed());
-        }
-      });
-      _$setProp(_el$19, "flexDirection", "row");
-      _$setProp(_el$19, "width", 2);
-      _$setProp(_el$19, "height", 1);
-      _$setProp(_el$19, "marginRight", 1);
-      _$setProp(_el$19, "alignItems", "flex-start");
-      _$insert(_el$19, (() => {
-        var _c$ = _$memo(() => !!isCollapsed());
-        return () => _c$() ? _$createComponent(SvgIcon, {
-          source: arrowRightSvgIcon,
-          get color() {
-            return theme().text.muted;
-          },
-          fallback: "\u25B6",
-          width: 2,
-          height: 1
-        }) : _$createComponent(SvgIcon, {
-          source: arrowDownSvgIcon,
-          get color() {
-            return theme().text.muted;
-          },
-          fallback: "\u25BC",
-          width: 2,
-          height: 1
-        });
-      })());
-      _$insertNode(_el$20, _el$21);
-      _$setProp(_el$20, "flexDirection", "row");
-      _$setProp(_el$20, "flexGrow", 1);
-      _$setProp(_el$20, "flexShrink", 1);
-      _$setProp(_el$20, "overflow", "hidden");
-      _$setProp(_el$20, "marginRight", 1);
-      _$insertNode(_el$21, _el$22);
-      _$insertNode(_el$21, _el$24);
-      _$setProp(_el$21, "wrapMode", "none");
-      _$insertNode(_el$22, _$createTextNode(`Todos `));
-      _$insert(_el$24, () => `(${data().completed}/${data().total})`);
-      _$insert(_el$21, _$createComponent(Show, {
-        get when() {
-          return _$memo(() => !!isCollapsed())() && activeItem();
-        },
-        children: active => [(() => {
-          var _el$30 = _$createElement("span");
-          _$insertNode(_el$30, _$createTextNode(`  `));
-          _$effect(_$p => _$setProp(_el$30, "style", {
-            fg: theme().text.muted
-          }, _$p));
-          return _el$30;
-        })(), (() => {
-          var _el$32 = _$createElement("span"),
-            _el$33 = _$createTextNode(` `);
-          _$insertNode(_el$32, _el$33);
-          _$insert(_el$32, () => getItemIcon(active().status, active().icon), _el$33);
-          _$effect(_$p => _$setProp(_el$32, "style", {
-            fg: getStatusColor(active().status)
-          }, _$p));
-          return _el$32;
-        })(), (() => {
-          var _el$34 = _$createElement("span");
-          _$insert(_el$34, () => TodoTree.formatIdPrefix(active().id, active().depth), null);
-          _$insert(_el$34, () => active().content, null);
-          _$effect(_$p => _$setProp(_el$34, "style", {
-            fg: getTextColor(active().status)
-          }, _$p));
-          return _el$34;
-        })()]
-      }), null);
-      _$insert(_el$17, _$createComponent(Show, {
-        get when() {
-          return _$memo(() => !!(hasOpenTodos(data().items) && !isRunning()))() && !isContinuePending();
-        },
-        get children() {
-          var _el$25 = _$createElement("box"),
-            _el$26 = _$createElement("text");
-          _$insertNode(_el$25, _el$26);
-          _$setProp(_el$25, "flexDirection", "row");
-          _$setProp(_el$25, "gap", 1);
-          _$setProp(_el$25, "marginRight", 3);
-          _$setProp(_el$25, "onMouseOver", () => setIsContinueHovered(true));
-          _$setProp(_el$25, "onMouseOut", () => setIsContinueHovered(false));
-          _$setProp(_el$25, "onMouseDown", e => {
-            if (e.button === 0) {
-              e.stopPropagation();
-              void continueTodos();
-            }
-          });
-          _$insert(_el$25, _$createComponent(SvgIcon, {
-            source: continuePromptSvgIcon,
-            get color() {
-              return _$memo(() => !!isContinueHovered())() ? theme().text.action.primary.base : theme().text.muted;
-            },
-            fallback: "\u21BB",
-            width: 2,
-            height: 1
-          }), _el$26);
-          _$insertNode(_el$26, _$createTextNode(`Continue`));
-          _$setProp(_el$26, "wrapMode", "none");
-          _$effect(_$p => _$setProp(_el$26, "fg", isContinueHovered() ? theme().text.action.primary.base : theme().text.muted, _$p));
-          return _el$25;
-        }
-      }), _el$28);
-      _$setProp(_el$28, "flexDirection", "row");
-      _$setProp(_el$28, "onMouseOver", () => setIsClearHovered(true));
-      _$setProp(_el$28, "onMouseOut", () => setIsClearHovered(false));
-      _$setProp(_el$28, "onMouseDown", async e => {
-        if (e.button === 0) {
-          e.stopPropagation();
-          const sid = getSessionID();
-          if (sid) {
-            try {
-              await writeTodos(sid, []);
-              setRefresh(value => value + 1);
-            } catch (error) {
-              console.error("[todos] clear failed:", error);
-            }
-          }
-        }
-      });
-      _$insert(_el$28, _$createComponent(SvgIcon, {
-        get color() {
-          return _$memo(() => !!isClearHovered())() ? theme().text.feedback.error.base : theme().text.muted;
-        },
-        source: removeSvgIcon,
-        fallback: "\u2716",
-        height: 1,
-        width: 2
-      }));
-      _$insert(_el$16, _$createComponent(Show, {
-        get when() {
-          return !isCollapsed();
-        },
-        get children() {
-          var _el$29 = _$createElement("box");
-          _$setProp(_el$29, "flexDirection", "column");
-          _$setProp(_el$29, "paddingTop", 1);
-          _$setProp(_el$29, "paddingLeft", 0.5);
-          _$insert(_el$29, _$createComponent(TodoList, {
-            get rows() {
-              return data().items.map(item => ({
-                id: item.id,
-                content: item.content,
-                icon: getItemIcon(item.status, item.icon),
-                iconColor: getStatusColor(item.status),
-                textColor: getTextColor(item.status),
-                depth: item.depth,
-                status: item.status
-              }));
-            },
-            get expandedIds() {
-              return expandedIds();
-            },
-            onToggleRow: toggleRowNote
-          }));
-          return _el$29;
-        }
-      }), null);
-      _$effect(_p$ => {
-        var _v$10 = getBorderColor(),
-          _v$11 = imageSupported() ? 0 : 1,
-          _v$12 = {
-            fg: theme().text.base
-          },
-          _v$13 = {
-            fg: theme().text.muted
-          },
-          _v$14 = !imageSupported() ? 1.5 : 0;
-        _v$10 !== _p$.e && (_p$.e = _$setProp(_el$16, "borderColor", _v$10, _p$.e));
-        _v$11 !== _p$.t && (_p$.t = _$setProp(_el$19, "marginLeft", _v$11, _p$.t));
-        _v$12 !== _p$.a && (_p$.a = _$setProp(_el$22, "style", _v$12, _p$.a));
-        _v$13 !== _p$.o && (_p$.o = _$setProp(_el$24, "style", _v$13, _p$.o));
-        _v$14 !== _p$.i && (_p$.i = _$setProp(_el$28, "marginRight", _v$14, _p$.i));
-        return _p$;
-      }, {
-        e: undefined,
-        t: undefined,
-        a: undefined,
-        o: undefined,
-        i: undefined
-      });
-      return _el$16;
-    })()
-  });
-}
-export default Plugin.define({
-  id: "opencode.todolist.tui",
-  setup: context => context.ui.slot({
-    after: "session.composer.top",
-    render: input => _$createComponent(TodoProgress, {
-      context: context,
-      get sessionID() {
-        return input.sessionID;
-      }
-    })
-  })
 });