br4zz4-opencode-skill-picker 0.1.7 → 0.1.8

package/LICENSE

@@ -1,4 +1,4 @@
-@br4zz4/opencode-skill-picker
+br4zz4-opencode-skill-picker
 
 Copyright (C) 2026 oporpino <dev@porpi.no>
 

package/README.md

@@ -1,4 +1,4 @@
-# @br4zz4/opencode-skill-picker
+# br4zz4-opencode-skill-picker
 
 OpenCode TUI plugin that makes skills autocompletable in the prompt:
 
@@ -8,7 +8,17 @@ OpenCode TUI plugin that makes skills autocompletable in the prompt:
 
 ## Install
 
-Clone the repo and point `tui.json` at it (a local file path is required; git URLs hit an opencode install bug):
+### Via npm
+
+```json
+{
+  "plugin": ["br4zz4-opencode-skill-picker"]
+}
+```
+
+> **Known opencode bug:** opencode installs npm plugins into `~/.cache/opencode/packages/<name>@<version>` and cannot `import` from paths containing `@`. If the npm install doesn't load, use the file path below.
+
+### Via file (workaround)
 
 ```bash
 git clone git@github.com:br4zz4/opencode-skill-picker.git ~/.qwert/vendor/opencode-skill-picker
@@ -18,7 +28,7 @@ Then add to `~/.config/opencode/tui.json`:
 
 ```json
 {
-  "plugin": ["file:///Users/<you>/.qwert/vendor/opencode-skill-picker/index.tsx"]
+  "plugin": ["file:///Users/<you>/.qwert/vendor/opencode-skill-picker/dist/index.js"]
 }
 ```
 
@@ -26,11 +36,16 @@ Restart opencode.
 
 ## Development
 
+```bash
+npm install
+npm run build
+```
+
 Run opencode against your checkout:
 
 ```json
 {
-  "plugin": ["file:///path/to/opencode-skill-picker/index.tsx"]
+  "plugin": ["file:///path/to/opencode-skill-picker/dist/index.js"]
 }
 ```
 

package/dist/index.js

@@ -0,0 +1,82 @@
+// index.tsx
+import { jsx } from "@opentui/solid/jsx-runtime";
+var OPENCODE_BASE_MODE = "base";
+var tui = async (api) => {
+  let skills = [];
+  let skillsLoaded = false;
+  const loadSkills = async () => {
+    if (skillsLoaded) return skills;
+    try {
+      const result = await api.client.app.skills();
+      const list = result?.data ?? result;
+      const source = Array.isArray(list) ? list : [];
+      skills = source.filter((s) => s && typeof s.name === "string" && s.name.length > 0).map((s) => ({ name: s.name, description: s.description })).toSorted((a, b) => a.name.localeCompare(b.name));
+    } catch {
+      skills = [];
+    } finally {
+      skillsLoaded = true;
+    }
+    return skills;
+  };
+  const insertSkill = async (name) => {
+    try {
+      await api.client.tui.appendPrompt({ text: `/${name} ` });
+    } catch {
+      api.ui.toast({ message: `Could not load skill ${name}`, variant: "error" });
+    }
+  };
+  const openPicker = async () => {
+    if (api.mode.current() !== OPENCODE_BASE_MODE) return;
+    if (api.renderer.currentFocusedEditor === null) return;
+    const list = await loadSkills();
+    if (list.length === 0) {
+      api.ui.toast({ message: "No skills available", variant: "warning" });
+      return;
+    }
+    const options = list.map((skill) => ({
+      title: skill.name,
+      value: skill.name,
+      description: skill.description?.replace(/\s+/g, " ").trim(),
+      category: "Skills"
+    }));
+    api.ui.dialog.replace(
+      () => /* @__PURE__ */ jsx(
+        api.ui.DialogSelect,
+        {
+          title: "Skills",
+          placeholder: "Search skills\u2026",
+          options,
+          onSelect: (opt) => {
+            api.ui.dialog.clear();
+            void insertSkill(opt.value);
+          }
+        }
+      ),
+      () => {
+      }
+    );
+  };
+  const registerSkillCommands = async () => {
+    const list = await loadSkills();
+    api.command.register(
+      () => list.map((skill) => ({
+        title: skill.name,
+        value: skill.name,
+        description: skill.description?.replace(/\s+/g, " ").trim(),
+        category: "Skills",
+        slash: { name: skill.name },
+        onSelect: () => {
+          void insertSkill(skill.name);
+        }
+      }))
+    );
+  };
+  api.keymap.registerLayer({
+    bindings: [{ key: "#", desc: "Pick a skill", preventDefault: true, cmd: () => void openPicker() }]
+  });
+  void registerSkillCommands();
+};
+var index_default = { id: "skill-picker", tui };
+export {
+  index_default as default
+};

package/package.json

@@ -1,17 +1,17 @@
 {
   "name": "br4zz4-opencode-skill-picker",
-  "version": "0.1.7",
+  "version": "0.1.8",
   "description": "OpenCode TUI plugin: pick and autocomplete skills via /slash commands and the # keybinding",
   "author": "oporpino <dev@porpi.no>",
   "license": "AGPL-3.0",
   "type": "module",
-  "main": "./index.tsx",
+  "main": "./dist/index.js",
   "files": [
-    "index.tsx"
+    "dist"
   ],
   "exports": {
-    ".": "./index.tsx",
-    "./tui": "./index.tsx"
+    ".": "./dist/index.js",
+    "./tui": "./dist/index.js"
   },
   "keywords": [
     "opencode",
@@ -24,5 +24,13 @@
   },
   "publishConfig": {
     "access": "public"
+  },
+  "types": "./dist/index.js",
+  "scripts": {
+    "build": "node build.mjs",
+    "prepublishOnly": "npm run build"
+  },
+  "devDependencies": {
+    "esbuild": "^0.28.2"
   }
 }

package/index.tsx

@@ -1,91 +0,0 @@
-import type { TuiPlugin, TuiDialogSelectOption } from "@opencode-ai/plugin/tui"
-
-type Skill = { name: string; description?: string }
-
-const OPENCODE_BASE_MODE = "base"
-
-const tui: TuiPlugin = async (api) => {
-  let skills: Skill[] = []
-  let skillsLoaded = false
-
-  const loadSkills = async (): Promise<Skill[]> => {
-    if (skillsLoaded) return skills
-    try {
-      const result = await api.client.app.skills()
-      const list: unknown = result?.data ?? result
-      const source = Array.isArray(list) ? list : []
-      skills = (source as Skill[])
-        .filter((s) => s && typeof s.name === "string" && s.name.length > 0)
-        .map((s) => ({ name: s.name, description: s.description }))
-        .toSorted((a, b) => a.name.localeCompare(b.name))
-    } catch {
-      skills = []
-    } finally {
-      skillsLoaded = true
-    }
-    return skills
-  }
-
-  const insertSkill = async (name: string) => {
-    try {
-      await api.client.tui.appendPrompt({ text: `/${name} ` })
-    } catch {
-      api.ui.toast({ message: `Could not load skill ${name}`, variant: "error" })
-    }
-  }
-
-  const openPicker = async () => {
-    if (api.mode.current() !== OPENCODE_BASE_MODE) return
-    if (api.renderer.currentFocusedEditor === null) return
-
-    const list = await loadSkills()
-    if (list.length === 0) {
-      api.ui.toast({ message: "No skills available", variant: "warning" })
-      return
-    }
-    const options: TuiDialogSelectOption<string>[] = list.map((skill) => ({
-      title: skill.name,
-      value: skill.name,
-      description: skill.description?.replace(/\s+/g, " ").trim(),
-      category: "Skills",
-    }))
-    api.ui.dialog.replace(
-      () => (
-        <api.ui.DialogSelect<string>
-          title="Skills"
-          placeholder="Search skills…"
-          options={options}
-          onSelect={(opt) => {
-            api.ui.dialog.clear()
-            void insertSkill(opt.value)
-          }}
-        />
-      ),
-      () => {},
-    )
-  }
-
-  const registerSkillCommands = async () => {
-    const list = await loadSkills()
-    api.command.register(() =>
-      list.map((skill) => ({
-        title: skill.name,
-        value: skill.name,
-        description: skill.description?.replace(/\s+/g, " ").trim(),
-        category: "Skills",
-        slash: { name: skill.name },
-        onSelect: () => {
-          void insertSkill(skill.name)
-        },
-      })),
-    )
-  }
-
-  api.keymap.registerLayer({
-    bindings: [{ key: "#", desc: "Pick a skill", preventDefault: true, cmd: () => void openPicker() }],
-  })
-
-  void registerSkillCommands()
-}
-
-export default { id: "skill-picker", tui }