@gamflaz/opencode-todolist 1.0.10 → 1.0.12

package/README.md

@@ -21,17 +21,20 @@ git clone https://github.com/MomoPi-Dark/opencode-todolist.git \
   ~/.config/opencode/plugins/todolist
 cd ~/.config/opencode/plugins/todolist
 bun install
-bun run build
 ```
 
+`bun install` runs the `prepare` script, which compiles `dist/` from `src/`
+(TypeScript declarations plus Solid-compiled JSX). No extra step is required.
+
 Or add it directly through the OpenCode CLI:
 
 ```bash
 opencode plugin add @gamflaz/opencode-todolist
 ```
 
-OpenCode loads local plugins from the plugins directory, but it does not install
-their dependencies, so `bun install` is required before use.
+The npm package ships the prebuilt `dist/`, so no local build runs. OpenCode
+loads local plugins from the plugins directory but does not install their
+dependencies, so `bun install` is required before use.
 
 ## Tool: `manage_todo_list`
 
@@ -141,11 +144,23 @@ tracked work.
 ## Development
 
 ```bash
-bun install
+bun install     # runs prepare -> compiles dist/
 bun run check   # typecheck + tests
-bun run build   # compile the plugin entrypoints
+bun run compile # rebuild dist/ (tsc + Solid JSX transform)
 ```
 
+`bun run compile` must be used instead of `bun run build`: the raw `tsc` pass
+alone leaves intermediate `.jsx` files in `dist/`, which Bun then prefers over
+the compiled `.js` and reports as `No renderer found` / `ENOENT ... dist/tui.jsx`.
+
 ## Publishing notes
 
-Do not commit environment files, local dependencies, or generated build output.
+`dist/`, `index.js`, and `tui.js` are generated build output and are not
+committed. They reach users through the npm tarball: npm runs `prepare`
+(`bun run compile`) before packing, and `files` ships the built `dist/`
+directory. The `opencode plugin add` installer skips lifecycle scripts
+(`ignoreScripts: true`), so the tarball — not a post-install build — must
+contain `dist/`.
+
+Before publishing, run `bun run check && bun run compile` and confirm
+`dist/` contains no `.jsx` files.

package/dist/icons/svg-icon.js

@@ -10,15 +10,16 @@ import { createElement as _$createElement } from "@opentui/solid";
 import { usePlugin } from "@opencode/plugin/tui";
 import { rgbToHex } from "@opentui/core";
 import { Resvg } from "@resvg/resvg-js";
-import { createMemo, createSignal, onCleanup, Show } from "solid-js";
-import { supportsImageRendering } from "./image-capabilities";
+import { createMemo, createSignal, onCleanup, Show, splitProps } from "solid-js";
+import { supportsImageRendering } from "./image-capabilities.js";
 export function SvgIcon(props) {
-  const {
-    source: _,
-    color: __,
-    fallback,
-    ...prop
-  } = props;
+  // Solid props are getters. Destructuring them reads each value exactly once
+  // at creation time, which freezes the prop instead of tracking it. That made
+  // the collapsed `▶` / expanded `▼` fallback glyph stick on terminals without
+  // image support, where the text fallback is the branch that renders.
+  // splitProps keeps every accessor live while still separating the props this
+  // component consumes from the ones forwarded to the rendered element.
+  const [local, rest] = splitProps(props, ["source", "color", "fallback"]);
   const context = usePlugin();
   const [imageSupported, setImageSupported] = createSignal(supportsImageRendering(context.renderer.capabilities));
   const updateImageSupport = capabilities => {
@@ -26,11 +27,11 @@ export function SvgIcon(props) {
   };
   context.renderer.on("capabilities", updateImageSupport);
   onCleanup(() => context.renderer.off("capabilities", updateImageSupport));
-  const iconColor = () => props.color ? typeof props.color === "string" ? props.color : rgbToHex(props.color) : "currentColor";
+  const iconColor = () => local.color ? typeof local.color === "string" ? local.color : rgbToHex(local.color) : "currentColor";
   const pngBuffer = createMemo(() => {
     const bgToken = context.theme.background.base;
     const bg = rgbToHex(bgToken);
-    let svg = props.source.replace(/stroke="[^"]*"/g, `stroke="${iconColor()}"`).replace(/color="[^"]*"/g, `color="${iconColor()}"`);
+    let svg = local.source.replace(/stroke="[^"]*"/g, `stroke="${iconColor()}"`).replace(/color="[^"]*"/g, `color="${iconColor()}"`);
     const resvg = new Resvg(svg, {
       fitTo: {
         mode: "width",
@@ -49,7 +50,7 @@ export function SvgIcon(props) {
         var _el$2 = _$createElement("text"),
           _el$3 = _$createElement("span");
         _$insertNode(_el$2, _el$3);
-        _$insert(_el$3, fallback);
+        _$insert(_el$3, () => local.fallback);
         _$effect(_$p => _$setProp(_el$3, "style", {
           fg: iconColor()
         }, _$p));
@@ -68,7 +69,7 @@ export function SvgIcon(props) {
         get height() {
           return props.height ?? 1;
         }
-      }, prop), false);
+      }, rest), false);
       return _el$;
     }
   });

package/dist/index.js

@@ -1,10 +1,10 @@
 import { Plugin } from "@opencode/plugin";
-import { TodoInputToolSchema, TodoOutputToolSchema, } from "./schemas/todo";
-import { registerTodoSkills } from "./skills/loader";
-import { readTodoData, readTodos, updateTodos } from "./storage/todo-store";
-import { buildTodoHint, consumeTodoHint, findNextTodo, findStuckParent, flattenLeaves, isAnyTodoActive, } from "./todos/hint";
-import { TodoTree } from "./todos/todo-tree";
-import { updateTodoById } from "./todos/update";
+import { TodoInputToolSchema, TodoOutputToolSchema, } from "./schemas/todo.js";
+import { registerTodoSkills } from "./skills/loader.js";
+import { readTodoData, readTodos, updateTodos } from "./storage/todo-store.js";
+import { buildTodoHint, consumeTodoHint, findNextTodo, findStuckParent, flattenLeaves, isAnyTodoActive, } from "./todos/hint.js";
+import { TodoTree } from "./todos/todo-tree.js";
+import { updateTodoById } from "./todos/update.js";
 export function formatReadOutput(todos) {
     if (todos.length === 0)
         return "No todos recorded.";
@@ -181,6 +181,6 @@ export async function registerTodoPromptHook(ctx) {
     }
 }
 export default Plugin.define({
-    id: "opencode.todolist.tool1",
+    id: "opencode.todolist.tool",
     setup: registerTodoTools,
 });

package/dist/schemas/todo.js

@@ -1,5 +1,5 @@
 import z from "zod";
-import { PrioritySchema, TodoStatusSchema } from "./status";
+import { PrioritySchema, TodoStatusSchema } from "./status.js";
 // Child id format: <root_id>.<n> as a number -> 1.1, 2.3, etc.
 // Only a single decimal digit (1-9) is allowed, see the note below.
 const ChildIdSchema = z

package/dist/storage/todo-store.js

@@ -4,9 +4,9 @@ import { chmod, mkdir, readFile, rename, rm, writeFile, } from "node:fs/promises
 import { homedir, tmpdir } from "node:os";
 import { join, posix, win32 } from "node:path";
 import * as lockfile from "proper-lockfile";
-import { TodoRootItemSchema } from "../schemas/todo";
-import { TodoTree } from "../todos/todo-tree";
-import { InvalidTodoDataError } from "./errors";
+import { TodoRootItemSchema } from "../schemas/todo.js";
+import { TodoTree } from "../todos/todo-tree.js";
+import { InvalidTodoDataError } from "./errors.js";
 /**
  * Per-session todo persistence.
  *

package/dist/todos/display.js

@@ -1,4 +1,4 @@
-import { TodoTree } from "./todo-tree";
+import { TodoTree } from "./todo-tree.js";
 export function getStatusIcon(status) {
     switch (status) {
         case "completed":

package/dist/todos/hint.js

@@ -1,6 +1,6 @@
 import { readFileSync, renameSync, writeFileSync } from "node:fs";
-import { getHintMarkerPath, readTodoData, TodoStore } from "../storage/todo-store";
-import { TodoTree } from "./todo-tree";
+import { getHintMarkerPath, readTodoData, TodoStore } from "../storage/todo-store.js";
+import { TodoTree } from "./todo-tree.js";
 export const DEFAULT_STALE_MS = 30 * 60 * 1000; // 30 minutes (prompt fallback)
 export const CONTEXT_STALE_MS = 6 * 60 * 60 * 1000; // 6 hours
 const UPCOMING_LIMIT = 3;

package/dist/tui/layout.js

@@ -1,4 +1,4 @@
-import { TodoTree } from "../todos/todo-tree";
+import { TodoTree } from "../todos/todo-tree.js";
 /** Rendered prefix of an error detail row. */
 export const ERROR_PREFIX = "↳ error: ";
 /**

package/dist/tui/todo-panel.d.ts

@@ -1,6 +1,6 @@
 import { Plugin } from "@opencode/plugin/tui";
-import { ColorInput, ScrollBoxRenderable } from "@opentui/core";
-import { TodoStatus } from "../schemas/status";
+import { type ColorInput, ScrollBoxRenderable } from "@opentui/core";
+import { type TodoStatus } from "../schemas/status";
 /** How many open items the Continue prompt lists before collapsing the rest. */
 export declare const CONTINUE_PROMPT_MAX_ITEMS = 3;
 /** Per-field caps so one long note cannot flood the prompt. */

package/dist/tui/todo-panel.js

@@ -1,23 +1,25 @@
+import { effect as _$effect } from "@opentui/solid";
 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 { spread as _$spread } from "@opentui/solid";
+import { mergeProps as _$mergeProps } from "@opentui/solid";
 import { createElement as _$createElement } from "@opentui/solid";
 import { mkdirSync, watch } from "node:fs";
 import { createEffect, createMemo, createSignal, For, onCleanup, Show } from "solid-js";
-import { supportsImageRendering } from "../icons/image-capabilities";
-import { SvgIcon } from "../icons/svg-icon";
-import { arrowDownSvgIcon, arrowRightSvgIcon, continuePromptSvgIcon, removeSvgIcon } from "../icons/svg-icons";
-import { StatusLabel } from "../schemas/status";
-import { getTodosDirectory, hashSessionID, readTodosSync, writeTodos } from "../storage/todo-store";
-import { getTodoDisplaySummary, hasOpenTodos } from "../todos/display";
-import { TodoTree } from "../todos/todo-tree";
-import { shorten } from "./text";
-import { ERROR_PREFIX, ErrorRowWidth, RowWidth } from "./layout";
+import { supportsImageRendering } from "../icons/image-capabilities.js";
+import { SvgIcon } from "../icons/svg-icon.js";
+import { arrowDownSvgIcon, arrowRightSvgIcon, continuePromptSvgIcon, removeSvgIcon } from "../icons/svg-icons.js";
+import { StatusLabel } from "../schemas/status.js";
+import { getTodosDirectory, hashSessionID, readTodosSync, writeTodos } from "../storage/todo-store.js";
+import { getTodoDisplaySummary, hasOpenTodos } from "../todos/display.js";
+import { TodoTree } from "../todos/todo-tree.js";
+import { ERROR_PREFIX, ErrorRowWidth, RowWidth } from "./layout.js";
+import { shorten } from "./text.js";
 
 /** How many open items the Continue prompt lists before collapsing the rest. */
 export const CONTINUE_PROMPT_MAX_ITEMS = 3;
@@ -167,21 +169,29 @@ export function TodoList(props) {
     if (el) followActiveRow(el);
   });
   const scrollbarOptions = () => props.scrollbarColor ? {
-    trackOptions: {
-      backgroundColor: props.scrollbarColor,
-      foregroundColor: props.scrollbarColor
+    verticalScrollbarOptions: {
+      trackOptions: {
+        backgroundColor: props.scrollbarColor,
+        foregroundColor: props.scrollbarColor
+      }
     }
-  } : undefined;
+  } : {};
   const isExpanded = id => (props.expandedIds ?? []).includes(id);
   return (() => {
     var _el$ = _$createElement("scrollbox"),
       _el$2 = _$createElement("box");
     _$insertNode(_el$, _el$2);
     _$use(attach, _el$);
-    _$setProp(_el$, "width", "100%");
-    _$setProp(_el$, "horizontalScrollbarOptions", {
-      visible: false
-    });
+    _$setProp(_el$, "width", "auto");
+    _$spread(_el$, _$mergeProps({
+      get height() {
+        return Math.min(entries().length, TODO_PANEL_MAX_ROWS);
+      }
+    }, scrollbarOptions, {
+      "horizontalScrollbarOptions": {
+        visible: false
+      }
+    }), true);
     _$setProp(_el$2, "flexDirection", "column");
     _$setProp(_el$2, "flexShrink", 0);
     _$insert(_el$2, _$createComponent(For, {
@@ -239,23 +249,23 @@ export function TodoList(props) {
           }
         }), null);
         _$effect(_p$ => {
-          var _v$3 = rowId(entry.row.id),
-            _v$4 = RowWidth(entry.row),
-            _v$5 = {
+          var _v$ = rowId(entry.row.id),
+            _v$2 = RowWidth(entry.row),
+            _v$3 = {
               fg: entry.row.iconColor
             },
-            _v$6 = {
+            _v$4 = {
               fg: entry.row.textColor
             },
-            _v$7 = {
+            _v$5 = {
               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));
+          _v$ !== _p$.e && (_p$.e = _$setProp(_el$3, "id", _v$, _p$.e));
+          _v$2 !== _p$.t && (_p$.t = _$setProp(_el$3, "width", _v$2, _p$.t));
+          _v$3 !== _p$.a && (_p$.a = _$setProp(_el$7, "style", _v$3, _p$.a));
+          _v$4 !== _p$.o && (_p$.o = _$setProp(_el$9, "style", _v$4, _p$.o));
+          _v$5 !== _p$.i && (_p$.i = _$setProp(_el$0, "style", _v$5, _p$.i));
           return _p$;
         }, {
           e: undefined,
@@ -287,21 +297,21 @@ export function TodoList(props) {
         _$insert(_el$13, ERROR_PREFIX, null);
         _$insert(_el$14, () => entry.row.content);
         _$effect(_p$ => {
-          var _v$8 = `${rowId(entry.row.id)}-note`,
-            _v$9 = ErrorRowWidth({
+          var _v$6 = `${rowId(entry.row.id)}-note`,
+            _v$7 = ErrorRowWidth({
               error: entry.row.content,
               depth: entry.row.depth
             }),
-            _v$0 = {
+            _v$8 = {
               fg: props.scrollbarColor
             },
-            _v$1 = {
+            _v$9 = {
               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$14, "style", _v$1, _p$.o));
+          _v$6 !== _p$.e && (_p$.e = _$setProp(_el$11, "id", _v$6, _p$.e));
+          _v$7 !== _p$.t && (_p$.t = _$setProp(_el$11, "width", _v$7, _p$.t));
+          _v$8 !== _p$.a && (_p$.a = _$setProp(_el$13, "style", _v$8, _p$.a));
+          _v$9 !== _p$.o && (_p$.o = _$setProp(_el$14, "style", _v$9, _p$.o));
           return _p$;
         }, {
           e: undefined,
@@ -312,16 +322,6 @@ export function TodoList(props) {
         return _el$11;
       })()
     }));
-    _$effect(_p$ => {
-      var _v$ = Math.min(entries().length, TODO_PANEL_MAX_ROWS),
-        _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$;
   })();
 }
@@ -382,9 +382,9 @@ function watchSessionTodos(sessionID, onChange) {
   });
 }
 export function TodoProgress(props) {
-  const {
-    context
-  } = props;
+  // `context` is a stable reference for the lifetime of the plugin, so reading
+  // it once is safe. Reactive props below are read through accessors instead.
+  const context = props.context;
   const sessionID = () => props.sessionID ?? "";
   const theme = () => context.theme;
   const [refresh, setRefresh] = createSignal(0);
@@ -562,7 +562,7 @@ export function TodoProgress(props) {
       _$setProp(_el$17, "flexGrow", 1);
       _$setProp(_el$17, "onMouseDown", e => {
         if (e.button === 0) {
-          e.stopPropagation?.();
+          e.stopPropagation();
           setIsCollapsed(v => !v);
         }
       });
@@ -654,12 +654,12 @@ export function TodoProgress(props) {
           _$insertNode(_el$25, _$createTextNode(`Continue`));
           _$setProp(_el$25, "wrapMode", "none");
           _$effect(_p$ => {
-            var _v$10 = continueHover.onMouseOver,
-              _v$11 = continueHover.onMouseOut,
-              _v$12 = hoverColor(continueHover.hovered(), theme().text.action.primary.base);
-            _v$10 !== _p$.e && (_p$.e = _$setProp(_el$24, "onMouseOver", _v$10, _p$.e));
-            _v$11 !== _p$.t && (_p$.t = _$setProp(_el$24, "onMouseOut", _v$11, _p$.t));
-            _v$12 !== _p$.a && (_p$.a = _$setProp(_el$25, "fg", _v$12, _p$.a));
+            var _v$0 = continueHover.onMouseOver,
+              _v$1 = continueHover.onMouseOut,
+              _v$10 = hoverColor(continueHover.hovered(), theme().text.action.primary.base);
+            _v$0 !== _p$.e && (_p$.e = _$setProp(_el$24, "onMouseOver", _v$0, _p$.e));
+            _v$1 !== _p$.t && (_p$.t = _$setProp(_el$24, "onMouseOut", _v$1, _p$.t));
+            _v$10 !== _p$.a && (_p$.a = _$setProp(_el$25, "fg", _v$10, _p$.a));
             return _p$;
           }, {
             e: undefined,
@@ -708,24 +708,24 @@ export function TodoProgress(props) {
         }
       }), null);
       _$effect(_p$ => {
-        var _v$13 = theme().border.base,
-          _v$14 = imageSupported() ? 0 : 1,
-          _v$15 = {
+        var _v$11 = theme().border.base,
+          _v$12 = imageSupported() ? 0 : 1,
+          _v$13 = {
             fg: theme().text.base
           },
-          _v$16 = {
+          _v$14 = {
             fg: theme().text.muted
           },
-          _v$17 = !imageSupported() ? 1.5 : 0,
-          _v$18 = clearHover.onMouseOver,
-          _v$19 = clearHover.onMouseOut;
-        _v$13 !== _p$.e && (_p$.e = _$setProp(_el$15, "borderColor", _v$13, _p$.e));
-        _v$14 !== _p$.t && (_p$.t = _$setProp(_el$18, "marginLeft", _v$14, _p$.t));
-        _v$15 !== _p$.a && (_p$.a = _$setProp(_el$21, "style", _v$15, _p$.a));
-        _v$16 !== _p$.o && (_p$.o = _$setProp(_el$23, "style", _v$16, _p$.o));
-        _v$17 !== _p$.i && (_p$.i = _$setProp(_el$27, "marginRight", _v$17, _p$.i));
-        _v$18 !== _p$.n && (_p$.n = _$setProp(_el$27, "onMouseOver", _v$18, _p$.n));
-        _v$19 !== _p$.s && (_p$.s = _$setProp(_el$27, "onMouseOut", _v$19, _p$.s));
+          _v$15 = !imageSupported() ? 1.5 : 0,
+          _v$16 = clearHover.onMouseOver,
+          _v$17 = clearHover.onMouseOut;
+        _v$11 !== _p$.e && (_p$.e = _$setProp(_el$15, "borderColor", _v$11, _p$.e));
+        _v$12 !== _p$.t && (_p$.t = _$setProp(_el$18, "marginLeft", _v$12, _p$.t));
+        _v$13 !== _p$.a && (_p$.a = _$setProp(_el$21, "style", _v$13, _p$.a));
+        _v$14 !== _p$.o && (_p$.o = _$setProp(_el$23, "style", _v$14, _p$.o));
+        _v$15 !== _p$.i && (_p$.i = _$setProp(_el$27, "marginRight", _v$15, _p$.i));
+        _v$16 !== _p$.n && (_p$.n = _$setProp(_el$27, "onMouseOver", _v$16, _p$.n));
+        _v$17 !== _p$.s && (_p$.s = _$setProp(_el$27, "onMouseOut", _v$17, _p$.s));
         return _p$;
       }, {
         e: undefined,

package/dist/tui.js

@@ -1,9 +1,9 @@
 import { createComponent as _$createComponent } from "@opentui/solid";
 import { Plugin } from "@opencode/plugin/tui";
 import { RendererContext } from "@opentui/solid";
-import { TodoProgress } from "./tui/todo-panel";
+import { TodoProgress } from "./tui/todo-panel.js";
 export default Plugin.define({
-  id: "opencode.todolist.tui1",
+  id: "opencode.todolist.tui",
   setup(context) {
     const releaseSlot = context.ui.slot({
       append: "session.composer.top",

package/index.js

@@ -1 +1 @@
-export { default } from "./dist/index";
+export { default } from "./dist/index.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gamflaz/opencode-todolist",
-  "version": "1.0.10",
+  "version": "1.0.12",
   "description": "Hierarchical todo list plugin for OpenCode with a real-time TUI widget.",
   "type": "module",
   "files": [
@@ -45,7 +45,8 @@
     "compile": "bun run build && node scripts/build-jsx.mjs",
     "build:jsx": "node scripts/build-jsx.mjs",
     "dev": "tsc-watch -p tsconfig.build.json --onSuccess \"node scripts/build-jsx.mjs\"",
-    "test": "bun test/todo.test.ts",
+    "test": "bun test/icon.test.ts && bun test/skill.test.ts && bun test/skill.folder.test.ts",
+    "test:todo": "bun test/todo.test.ts",
     "typecheck": "tsc --noEmit",
     "check": "bun run typecheck && bun run test",
     "update": "git pull && bun run check && bun run compile"

package/tui.js

@@ -1 +1 @@
-export { default } from "./dist/tui";
+export { default } from "./dist/tui.js";