opencode-plugin-kit 1.0.0-alpha.5 → 1.0.0-alpha.7

package/README.md

@@ -5,7 +5,7 @@
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 
 Shared building blocks for [OpenCode](https://opencode.ai) sidebar plugins —
-the pieces that every sidebar widget ends up reimplementing. Used by five
+the pieces that every sidebar widget ends up reimplementing. Used by four
 production plugins with **100% test coverage**.
 
 ## Install
@@ -16,24 +16,22 @@ Published on [npm](https://www.npmjs.com/package/opencode-plugin-kit):
 npm install opencode-plugin-kit
 ```
 
-Plugins depending on the kit declare it in `dependencies`; the SDK peer
-(`@opencode-ai/plugin`) must match your OpenCode runtime version (see each
+> **Still a prerelease.** `latest` currently resolves to `1.0.0-alpha.6` — the
+> first OpenCode v2 build. The publish workflow tags every prerelease under
+> its own identifier (`alpha`, `beta`, …) and leaves `latest` alone, so later
+> alphas will _not_ move `latest` automatically. To track the newest build,
+> install `opencode-plugin-kit@alpha`.
+
+Plugins depending on the kit declare it in `dependencies`; the host peer
+(`@opencode/plugin`) must match your OpenCode v2 runtime version (see each
 plugin's README).
 
 ## Status
 
-**v1.0.0-alpha.1** — API stabilized, ready for integration testing.
+**v1.0.0-alpha.6** — API stabilized, ready for integration testing.
 
 ## Quick Start
 
-```sh
-# npm
-npm install opencode-plugin-kit
-
-# bun
-bun add opencode-plugin-kit
-```
-
 ```ts
 import { createViewPicker, createCachedStore } from "opencode-plugin-kit"
 
@@ -95,7 +93,7 @@ their unique data and rendering.
 | `commands.ts`           | `createToggle()`, `registerKeymapCommand()`                                                                                                                                | Toggle command + keymap registration                    |
 | `workspace.ts`          | `resolveLocation()`, `workspaceDirectory()`                                                                                                                                | Workspace location resolution                           |
 | `toast.ts`              | `showToast()`                                                                                                                                                              | Toast helper                                            |
-| `host.ts`               | `KitContext`, `KitMessageShape`                                                                                                                                            | Structural host-contract types                          |
+| `host.ts`               | `KitContext`, `KitMessageShape`, `KitModelShape`                                                                                                                           | Structural host-contract types                          |
 
 Everything is re-exported from the package root (`src/index.ts`).
 
@@ -197,24 +195,75 @@ const totals = walkMessages(
 const { input, output, cost } = sumProviderTokens(context, sessionID, "opencode")
 ```
 
+### Collapsible
+
+Imported from the `collapsible` subpath so the Solid JSX stays out of the main
+entry.
+
+```ts
+import { CollapsibleSection, CollapsibleGroup } from "opencode-plugin-kit/collapsible"
+
+// From a host component that already has the plugin context:
+const { theme } = usePlugin()
+
+CollapsibleSection({
+  title: "Skills",
+  count: items.length,
+  threshold: 2,        // Collapse the body at or below this count
+  pinned: <Note />,    // Always visible between header and body
+  theme,               // Header colors; pass the host's theme
+  children: <List />,
+})
+
+CollapsibleGroup({
+  title: "Providers",
+  count: ids.length,
+  defaultCollapsed: true,
+  theme,
+  children: (collapsed) => (collapsed() ? <Summary /> : <List />),
+})
+```
+
+`theme` is optional but **recommended**. Without it the kit falls back to
+`usePlugin()`, which throws when the kit is installed from `node_modules`
+(it resolves its own copy of `@opencode/plugin` / `solid-js`, so the host's
+plugin context is not visible). If the context is missing the header falls back
+to unthemed text rather than throwing.
+
 ## Consuming Plugins
 
-| Plugin                                                          | What it does                                                   |
-| --------------------------------------------------------------- | -------------------------------------------------------------- |
-| [opencode-usage-quota-tracker](../opencode-usage-quota-tracker) | Live provider quota + usage in sidebar footer                  |
-| [opencode-model-recommender](../opencode-model-recommender)     | Model recommendations by cache ratio, token cost, session cost |
-| [opencode-skill-lister](../opencode-skill-lister)               | Skills list in sidebar                                         |
-| [opencode-plugin-manager](../opencode-plugin-manager)           | Plugin manager in sidebar                                      |
+| Plugin                                                                                      | What it does                                                   |
+| ------------------------------------------------------------------------------------------- | -------------------------------------------------------------- |
+| [opencode-usage-quota-tracker](https://github.com/ranjithrajv/opencode-usage-quota-tracker) | Live provider quota + usage in sidebar footer                  |
+| [opencode-model-recommender](https://github.com/ranjithrajv/opencode-model-recommender)     | Model recommendations by cache ratio, token cost, session cost |
+| [opencode-skill-lister](https://github.com/ranjithrajv/opencode-skill-lister)               | Skills list in sidebar                                         |
+| [opencode-plugin-manager](https://github.com/ranjithrajv/opencode-plugin-manager)           | Plugin manager in sidebar                                      |
+
+Install from the registry:
+
+```sh
+npm install opencode-plugin-kit@alpha
+```
+
+The `latest` dist-tag tracks the newest v1 alpha; v2 releases ship under the
+`alpha` dist-tag, so pin `opencode-plugin-kit@alpha` (or an explicit range) until
+`latest` moves to v2.
 
-Link locally with `"opencode-plugin-kit": "file:../opencode-plugin-kit"` in the
-consumer's `package.json`, then `npm install` (or `bun install`).
+For local development, link the sibling checkout with
+`"opencode-plugin-kit": "file:../opencode-plugin-kit"` in the consumer's
+`package.json`, then `npm install` (or `bun install`). Note that a linked
+checkout shares one module graph with the host, so the collapsible components
+find the plugin context without a `theme` prop; a registry install does not.
 
 ## Compatibility
 
-The host plugin API is beta; its types are the spec. Kit consumes the context
+The OpenCode v2 host plugin API's types are the spec. Kit consumes the context
 structurally — anything the host ships with the expected members satisfies it.
 
-- **No runtime dependency** on `@opencode-ai/plugin` — types only
+- **Floor: `@opencode/plugin` 2.0.3.** Earlier 2.x releases have no `./tui`
+  subpath export, so nothing that imports `@opencode/plugin/tui` can resolve it.
+  Verified by typecheck and the type-tripwire against 2.0.3, 2.0.10 and 2.0.18.
+- **No runtime dependency** on `@opencode/plugin` — types only
 - **Optional peer** — declared as optional so consumers share one copy
 - **CI tripwire** — `host.test-d.ts` pins published host types against kit's
   contract; drift fails CI with a readable diff

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "opencode-plugin-kit",
-  "version": "1.0.0-alpha.5",
+  "version": "1.0.0-alpha.7",
   "description": "Shared building blocks for OpenCode sidebar plugins: provider vocabulary, row formatting, defensive message traversal, connected-provider tracking, polling fetcher, cached resources, and a persisted view/filter picker (registry + slash command + dialog + toast).",
   "keywords": [
     "opencode",
@@ -12,7 +12,7 @@
   "author": "Ranjith Raj",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/ranjithraj/opencode-plugin-kit.git"
+    "url": "git+https://github.com/ranjithrajv/opencode-plugin-kit.git"
   },
   "files": [
     "src",
@@ -32,12 +32,14 @@
     "fmt": "vp fmt",
     "lint": "vp lint",
     "typecheck": "tsc --noEmit",
-    "test:types": "vitest run --typecheck",
-    "test:coverage": "vitest run --coverage.enabled"
+    "test": "vp test",
+    "test:types": "vp test --typecheck",
+    "test:coverage": "vp exec vitest run --coverage"
   },
   "devDependencies": {
-    "@opencode-ai/plugin": "0.0.0-beta-19242",
-    "@opencode-ai/sdk": "0.0.0-beta-19234",
+    "@opencode/plugin": "2.0.15",
+    "@opencode/sdk": "2.0.15",
+    "@opencode/theme": "2.0.15",
     "@opentui/core": "^0.5.11",
     "@opentui/solid": "^0.5.11",
     "@types/node": "^26.5.0",
@@ -52,12 +54,12 @@
     "zod": "^4.5.4"
   },
   "peerDependencies": {
-    "@opencode-ai/plugin": "0.0.0-beta-19242",
+    "@opencode/plugin": "^2.0.3",
     "solid-js": "^1.9.12",
     "zod": "^4.5.4"
   },
   "peerDependenciesMeta": {
-    "@opencode-ai/plugin": {
+    "@opencode/plugin": {
       "optional": true
     }
   },

package/src/collapsible.tsx

@@ -12,7 +12,40 @@
 //    count, always toggleable.
 import { createSignal, Show } from "solid-js"
 import type { JSX } from "solid-js"
-import { usePlugin } from "@opencode-ai/plugin/tui"
+import { usePlugin } from "@opencode/plugin/tui"
+
+/**
+ * Theme tokens a collapsible header needs. Derived from the host theme so
+ * callers can pass their `usePlugin().theme` straight through, and so we
+ * don't pin the host's color type (e.g. `RGBA`) here.
+ */
+type HostTheme = ReturnType<typeof usePlugin>["theme"]
+export interface CollapsibleTheme {
+  text: {
+    base?: HostTheme["text"]["base"]
+    muted?: HostTheme["text"]["muted"]
+  }
+}
+
+/**
+ * Resolve the theme for a header.
+ *
+ * Prefer an explicitly passed `theme`. When this package is consumed from
+ * `node_modules`, `usePlugin()` here resolves a different copy of
+ * `@opencode/plugin` (and `solid-js`) than the host renders with, so the
+ * host's plugin context is not visible and `usePlugin()` throws
+ * "PluginContextProvider is missing". Callers that already hold the host
+ * context pass `theme` down; the `usePlugin()` fallback keeps working for
+ * consumers whose module graph is deduped (tests, monorepos).
+ */
+function resolveTheme(explicit?: CollapsibleTheme): CollapsibleTheme {
+  if (explicit) return explicit
+  try {
+    return usePlugin().theme
+  } catch {
+    return { text: {} }
+  }
+}
 
 /** The top-level collapsible sidebar section. */
 export function CollapsibleSection(props: {
@@ -26,9 +59,11 @@ export function CollapsibleSection(props: {
   /** Always-visible content between the header and the collapsible body
    * (e.g. the plugin manager's status note). */
   pinned?: JSX.Element
+  /** Header colors; pass the host's `usePlugin().theme` from the consumer. */
+  theme?: CollapsibleTheme
   children: JSX.Element
 }) {
-  const theme = usePlugin().theme
+  const theme = resolveTheme(props.theme)
   const [expanded, setExpanded] = createSignal(false)
   const count = () => props.count ?? 0
   const threshold = () => props.threshold ?? 2
@@ -37,13 +72,13 @@ export function CollapsibleSection(props: {
     <box flexDirection="column">
       <box flexDirection="row" gap={1} onMouseDown={() => expandable() && setExpanded((e) => !e)}>
         <Show when={expandable()}>
-          <text fg={theme.text.default}>{expanded() ? "▼" : "▶"}</text>
+          <text fg={theme.text.base}>{expanded() ? "▼" : "▶"}</text>
         </Show>
-        <text fg={theme.text.default}>
+        <text fg={theme.text.base}>
           <b>{props.title}</b>
         </text>
         <Show when={!expanded()}>
-          <text fg={theme.text.subdued}> ({props.summary ?? count()})</text>
+          <text fg={theme.text.muted}> ({props.summary ?? count()})</text>
         </Show>
       </box>
       {props.pinned}
@@ -62,15 +97,17 @@ export function CollapsibleGroup(props: {
   title: string
   count: number
   defaultCollapsed?: boolean
+  /** Header colors; pass the host's `usePlugin().theme` from the consumer. */
+  theme?: CollapsibleTheme
   children: JSX.Element | ((collapsed: () => boolean) => JSX.Element)
 }) {
-  const theme = usePlugin().theme
+  const theme = resolveTheme(props.theme)
   const [collapsed, setCollapsed] = createSignal(props.defaultCollapsed ?? false)
   return (
     <box flexDirection="column">
       <box flexDirection="row" gap={1} onMouseDown={() => setCollapsed((c) => !c)}>
-        <text fg={theme.text.subdued}>{collapsed() ? "▸" : "▾"}</text>
-        <text fg={theme.text.subdued}>
+        <text fg={theme.text.muted}>{collapsed() ? "▸" : "▾"}</text>
+        <text fg={theme.text.muted}>
           {props.title} ({props.count})
         </text>
       </box>

package/src/host.ts

@@ -1,6 +1,6 @@
 // Narrow host-contract types for opencode-plugin-kit.
 //
-// `@opencode-ai/plugin` is beta: its types ARE the spec. Kit consumes only a
+// `@opencode/plugin` (v2) types ARE the spec. Kit consumes only a
 // small slice of the host context, so instead of accepting `any` everywhere
 // (which silently survives host upgrades and breaks at runtime), this module
 // defines the *structural minimum* kit needs and re-exports the exact host
@@ -14,7 +14,7 @@
 // Host types kit re-exports (single import point for consumers)
 // ---------------------------------------------------------------------------
 
-/** Toast payload — mirrored from the host's TuiToast; host drift here breaks CI. */
+/** Toast payload — structural subset of the host's v2 `ToastOptions`; drift breaks CI. */
 export type ToastInput = {
   message: string
   variant?: "success" | "error" | "warning" | "info"
@@ -32,10 +32,10 @@ export type SelectOption<Value = string> = {
 // Structural minimum of the host context kit touches
 // ---------------------------------------------------------------------------
 
-/** `context.storage.store(key, { initial })` — the older host returns
- * `[value, ref]` (mutating `ref` persists); the newer floating `beta` host
- * types it as `readonly [T, (mutation: (draft: T) => void) => Promise<void>]`.
- * Both shapes satisfy this union; kit code reads `[0]` and mutates it, which
+/** `context.storage.store(key, { initial })` — v2 types this as
+ * `readonly [Store<T>, (mutation: (draft: T) => void) => Promise<void>]`;
+ * the older host returned `[T, T]` (mutating the second entry persisted).
+ * Both shapes satisfy this union; kit reads `[0]` and mutates it, which
  * both hosts persist. */
 export interface KitStorage {
   store<T extends object>(
@@ -60,7 +60,7 @@ export interface KitUI {
     alert(input: { title: string; message: string }): Promise<unknown>
     select(input: {
       title: string
-      message: string
+      placeholder?: string
       current?: string
       options: readonly SelectOption[]
     }): Promise<unknown>
@@ -75,9 +75,9 @@ export interface KitCommandEntry {
   readonly title: string
   readonly description: string
   readonly group: string
-  readonly palette?: boolean
+  readonly palette?: true
   readonly suggested?: boolean
-  readonly slash?: { name: string; aliases?: string[]; arguments?: boolean }
+  readonly slash?: { name: string; aliases?: string[]; arguments?: true }
   run: (input?: string) => void
 }
 
@@ -102,7 +102,7 @@ export interface KitClient {
 }
 
 /** The structural minimum context for every kit factory. Deliberately
- * narrower than the host `TuiPluginApi`: kit only reads these surfaces, so
+ * narrower than the host `Plugin.Context`: kit only reads these surfaces, so
  * consumers can pass their real context directly. */
 export interface KitContext {
   readonly storage: KitStorage
@@ -117,9 +117,20 @@ export interface KitContext {
 // Structural message/model shapes the defensive readers walk
 // ---------------------------------------------------------------------------
 
-/** A message in either of the two beta-API shapes: a discriminated
- * `type`-tagged object or `{ info: Message }` envelope. Kit's readers
- * (`unwrap`, `isAssistant`, `providerId`, `modelId`) accept both. */
+/** A model-list entry (host `ModelInfo`) — what the model accessors accept.
+ * Deliberately omits `cost`, which is a number on messages but an array on
+ * model entries, so the same accessors serve both. */
+export interface KitModelShape {
+  readonly id?: string
+  readonly modelID?: string
+  readonly providerID?: string
+  readonly name?: string
+  readonly model?: { readonly providerID?: string; readonly modelID?: string; readonly id?: string }
+}
+
+/** A message in either of the two v2 shapes: a discriminated `type`-tagged
+ * object or `{ info: Message }` envelope. Kit's readers (`unwrap`,
+ * `isAssistant`, `providerId`, `modelId`) accept both. */
 export interface KitMessageShape {
   readonly type?: string
   readonly role?: string

package/src/providers.ts

@@ -1,12 +1,13 @@
 // Shared provider vocabulary for OpenCode sidebar widgets.
 // Provider IDs are the OpenCode workspace provider ids ("opencode" = Zen,
 // "opencode-go" = Go).
-import { readFileSync } from "node:fs"
+import { existsSync, readFileSync } from "node:fs"
 import { homedir } from "node:os"
 import { join } from "node:path"
+import { createRequire } from "node:module"
 import { createSignal } from "solid-js"
 import { connectedProviderIds } from "./schemas.ts"
-import type { KitContext, KitMessageShape } from "./host.ts"
+import type { KitContext, KitMessageShape, KitModelShape } from "./host.ts"
 
 export const ZEN_PROVIDER = "opencode"
 export const GO_PROVIDER = "opencode-go"
@@ -52,17 +53,17 @@ export function asArray<T = any>(out: unknown): T[] {
 }
 
 /** Model id from either a model-list object or a message/message-part shape. */
-export function modelId(m: KitMessageShape): string {
+export function modelId(m: KitModelShape): string {
   return m?.model?.modelID ?? m?.modelID ?? m?.model?.id ?? m?.id ?? ""
 }
 
 /** Provider id from either a model-list object or a message/message-part shape. */
-export function providerId(m: KitMessageShape): string {
+export function providerId(m: KitModelShape): string {
   return m?.model?.providerID ?? m?.providerID ?? ""
 }
 
 /** Display name, falling back to the model id when the API omits `name`. */
-export function modelName(m: KitMessageShape): string {
+export function modelName(m: KitModelShape): string {
   return m?.name ?? modelId(m)
 }
 
@@ -71,21 +72,85 @@ export function modelName(m: KitMessageShape): string {
 // ---------------------------------------------------------------------------
 
 const AUTH_PATH = () => join(homedir(), ".local/share/opencode/auth.json")
+const DB_PATH = () => join(homedir(), ".local/share/opencode/opencode.db")
 
-/** Single defensive read of auth.json, keyed by provider id.
- * Every consumer shares this parse so the path and shape handling can't drift. */
+/** Run a query with either SQLite driver's API and return rows. */
+function queryRows(db: any, sql: string): any[] {
+  try {
+    return db.query(sql).all()
+  } catch {}
+  try {
+    return db.prepare(sql).all()
+  } catch {}
+  return []
+}
+
+/** Open OpenCode 2's SQLite store read-only, resolving the driver across
+ * Bun (`bun:sqlite`) and Node 22+ (`node:sqlite`). Returns null when the
+ * store is absent or no driver is available. */
+function openCredentialDb(): any | null {
+  if (!existsSync(DB_PATH())) return null
+  const attempts: Array<() => any> = [
+    () => (import.meta as any).require?.("bun:sqlite"),
+    () => (globalThis as any).require?.("bun:sqlite"),
+    () => createRequire(import.meta.url)("bun:sqlite"),
+    () => (Function("return require")() as any)("bun:sqlite"),
+  ]
+  for (const attempt of attempts) {
+    try {
+      const { Database } = attempt()
+      if (Database) return new Database(DB_PATH(), { readonly: true })
+    } catch {}
+  }
+  try {
+    const { DatabaseSync } = createRequire(import.meta.url)("node:sqlite")
+    if (DatabaseSync) return new DatabaseSync(DB_PATH(), { readOnly: true })
+  } catch {}
+  return null
+}
+
+let _dbCache: { at: number; keys: Record<string, string> } | null = null
+
+/** API keys from OpenCode 2's SQLite `credential` table (integration_id →
+ * key). Cached briefly because `readAuth` runs on every render. */
+function readAuthDb(): Record<string, string> {
+  const now = Date.now()
+  if (_dbCache && now - _dbCache.at < 30_000) return _dbCache.keys
+  const keys: Record<string, string> = {}
+  try {
+    const db = openCredentialDb()
+    if (db) {
+      for (const row of queryRows(db, "SELECT integration_id, value FROM credential")) {
+        const id = String(row?.integration_id ?? "").trim()
+        try {
+          const key = JSON.parse(String(row?.value ?? ""))?.key
+          if (id && typeof key === "string" && key.trim()) keys[id] = key.trim()
+        } catch {}
+      }
+      try {
+        db.close?.()
+      } catch {}
+    }
+  } catch {}
+  _dbCache = { at: now, keys }
+  return keys
+}
+
+/** Single defensive read of the auth sources, keyed by provider id.
+ * OpenCode 2 keeps credentials in its SQLite store; `auth.json` is the
+ * legacy V1 store. Both are read (SQLite wins on conflict) so consumers see
+ * the same keys regardless of OpenCode version. */
 export function readAuth(): Record<string, string> {
+  const out: Record<string, string> = {}
   try {
     const auth = JSON.parse(readFileSync(AUTH_PATH(), "utf8"))
-    const out: Record<string, string> = {}
     for (const [id, cfg] of Object.entries(auth)) {
       const key = (cfg as any)?.key
       if (typeof key === "string" && key.trim()) out[id] = key.trim()
     }
-    return out
-  } catch {
-    return {}
-  }
+  } catch {}
+  for (const [id, key] of Object.entries(readAuthDb())) out[id] = key
+  return out
 }
 
 /** The API key for one provider, or "" when absent. */

package/src/toast.ts

@@ -2,7 +2,7 @@
 //
 // The host's toast UI is optional at the edges (beta API): every plugin
 // hand-rolled the same try/catch fallback around `ui.toast.show`.
-import type { KitContext, KitUI, ToastInput } from "./host.ts"
+import type { KitUI, ToastInput } from "./host.ts"
 
 /** Show a toast; silently no-ops when the host has no toast UI or it throws.
  * Takes a minimal structural slice — the full host context's `ui.slot` is

package/src/viewPicker.ts

@@ -131,7 +131,7 @@ export function createViewPicker<T extends PickerOption>(context: KitContext, co
     try {
       const selected = await context.ui.dialog.select({
         title: config.dialog.title,
-        message: config.dialog.message,
+        placeholder: config.dialog.message,
         current: currentID(),
         options: registry.filter(selectable).map((e) => ({
           title: e.title,

package/tsconfig.json

@@ -11,6 +11,5 @@
     "jsxImportSource": "@opentui/solid",
     "types": ["node"]
   },
-  "include": ["src", "tests"],
-  "exclude": ["tests/**/*.test-d.ts"]
+  "include": ["src", "tests"]
 }