@a-r-m-i-n/opencode-openai-usage 0.1.0 → 0.1.2

package/dist/tui.js

@@ -8,18 +8,25 @@ import {
 } from "./chunk-SR64YZVV.js";
 
 // src/tui.tsx
+import { memo as _$memo } from "@opentui/solid";
+import { createTextNode as _$createTextNode } from "@opentui/solid";
+import { insertNode as _$insertNode } from "@opentui/solid";
+import { effect as _$effect } from "@opentui/solid";
+import { insert as _$insert } from "@opentui/solid";
+import { setProp as _$setProp } from "@opentui/solid";
+import { createElement as _$createElement } from "@opentui/solid";
 import { createRequire } from "module";
 import { createTextAttributes } from "@opentui/core";
 import { createSignal } from "solid-js";
-import { jsx, jsxs } from "@opentui/solid/jsx-runtime";
 var id = "openai-usage-tui";
 var CACHE_SYNC_MS = 5e3;
-var DIM_ATTRIBUTES = createTextAttributes({ dim: true });
+var DIM_ATTRIBUTES = createTextAttributes({
+  dim: true
+});
 var BAR_WIDTH = 20;
 var BAR_EMPTY_COLOR = "#6b7280";
 var BAR_LABEL_DARK_COLOR = "#111827";
 var BAR_LABEL_LIGHT_COLOR = "#f9fafb";
-var SIDEBAR_VERSION_COLOR = "#9ca3af";
 var SIDEBAR_INVERT_KV_KEY = "openai-usage.sidebar.invert";
 var SIDEBAR_VISIBLE_KV_KEY = "openai-usage.sidebar.visible";
 var require2 = createRequire(import.meta.url);
@@ -37,7 +44,11 @@ function readPluginManifest() {
       homepage
     };
   } catch {
-    return { name: null, version: null, homepage: null };
+    return {
+      name: null,
+      version: null,
+      homepage: null
+    };
   }
 }
 function formatPercent(percent) {
@@ -78,14 +89,32 @@ function renderProgressBar(percent, labelSuffix) {
   const label = `${formatPercent(percent)} ${labelSuffix}`;
   const labelStart = Math.max(0, Math.floor((BAR_WIDTH - label.length) / 2));
   const labelEnd = labelStart + label.length;
-  return Array.from({ length: BAR_WIDTH }, (_, index) => {
+  return Array.from({
+    length: BAR_WIDTH
+  }, (_, index) => {
     const isFilled = index < barSegments.filled;
     const isLabelCell = index >= labelStart && index < labelEnd;
     const underlyingColor = isFilled ? barFillColor : BAR_EMPTY_COLOR;
     if (isLabelCell) {
-      return /* @__PURE__ */ jsx("text", { fg: isFilled ? getBarLabelColor(barFillColor) : BAR_LABEL_LIGHT_COLOR, bg: underlyingColor, children: label[index - labelStart] });
+      return (() => {
+        var _el$ = _$createElement("text");
+        _$setProp(_el$, "bg", underlyingColor);
+        _$insert(_el$, () => label[index - labelStart]);
+        _$effect((_$p) => _$setProp(_el$, "fg", isFilled ? getBarLabelColor(barFillColor) : BAR_LABEL_LIGHT_COLOR, _$p));
+        return _el$;
+      })();
     }
-    return isFilled ? /* @__PURE__ */ jsx("text", { fg: underlyingColor, children: "\u2588" }) : /* @__PURE__ */ jsx("text", { bg: BAR_EMPTY_COLOR, children: " " });
+    return isFilled ? (() => {
+      var _el$2 = _$createElement("text");
+      _$insertNode(_el$2, _$createTextNode(`\u2588`));
+      _$setProp(_el$2, "fg", underlyingColor);
+      return _el$2;
+    })() : (() => {
+      var _el$4 = _$createElement("text");
+      _$insertNode(_el$4, _$createTextNode(` `));
+      _$setProp(_el$4, "bg", "#6b7280");
+      return _el$4;
+    })();
   });
 }
 var module = {
@@ -93,9 +122,7 @@ var module = {
   tui: async (api, rawOptions) => {
     const stateDir = getOpenCodeStateDir();
     const options = rawOptions ?? {};
-    const [sidebarVisible, setSidebarVisible] = createSignal(
-      api.kv.get(SIDEBAR_VISIBLE_KV_KEY, true) !== false
-    );
+    const [sidebarVisible, setSidebarVisible] = createSignal(api.kv.get(SIDEBAR_VISIBLE_KV_KEY, true) !== false);
     const [invert, setInvert] = createSignal(api.kv.get(SIDEBAR_INVERT_KV_KEY, options.invert === true) === true);
     const [state, setState] = createSignal(await readUsageState(stateDir));
     const [open, setOpen] = createSignal(true);
@@ -118,12 +145,10 @@ var module = {
       await syncState();
       const latestState = state();
       setState(latestState);
-      api.ui.dialog.replace(
-        () => api.ui.DialogAlert({
-          title: "OpenAI Usage",
-          message: formatCommandSummary(latestState, PACKAGE_NAME, PLUGIN_VERSION, PACKAGE_HOMEPAGE)
-        })
-      );
+      api.ui.dialog.replace(() => api.ui.DialogAlert({
+        title: "OpenAI Usage",
+        message: formatCommandSummary(latestState, PACKAGE_NAME, PLUGIN_VERSION, PACKAGE_HOMEPAGE)
+      }));
     };
     const toggleSidebarInvert = () => {
       const nextInvert = !invert();
@@ -168,39 +193,90 @@ var module = {
         return null;
       }
       const usageDisplay = getUsageDisplay(window.usedPercent, invert());
-      return /* @__PURE__ */ jsx("box", { flexDirection: "column", gap: 0, padding: 0, margin: 0, children: /* @__PURE__ */ jsxs("box", { flexDirection: "row", gap: 0, padding: 0, margin: 0, children: [
-        /* @__PURE__ */ jsx("text", { children: `${formatWindowLabel(window.windowDurationMins)} ` }),
-        renderProgressBar(usageDisplay.percent, usageDisplay.label),
-        /* @__PURE__ */ jsx("text", { attributes: DIM_ATTRIBUTES, children: ` Reset: ${formatRelativeDuration(window.resetsAt)}` })
-      ] }) });
+      return (() => {
+        var _el$6 = _$createElement("box"), _el$7 = _$createElement("box"), _el$8 = _$createElement("text"), _el$9 = _$createElement("text");
+        _$insertNode(_el$6, _el$7);
+        _$setProp(_el$6, "flexDirection", "column");
+        _$setProp(_el$6, "gap", 0);
+        _$setProp(_el$6, "padding", 0);
+        _$setProp(_el$6, "margin", 0);
+        _$insertNode(_el$7, _el$8);
+        _$insertNode(_el$7, _el$9);
+        _$setProp(_el$7, "flexDirection", "row");
+        _$setProp(_el$7, "gap", 0);
+        _$setProp(_el$7, "padding", 0);
+        _$setProp(_el$7, "margin", 0);
+        _$insert(_el$8, () => `${formatWindowLabel(window.windowDurationMins)} `);
+        _$insert(_el$7, () => renderProgressBar(usageDisplay.percent, usageDisplay.label), _el$9);
+        _$setProp(_el$9, "attributes", DIM_ATTRIBUTES);
+        _$insert(_el$9, () => ` Reset: ${formatRelativeDuration(window.resetsAt)}`);
+        return _el$6;
+      })();
     };
-    const renderSidebarHeader = () => /* @__PURE__ */ jsxs("box", { flexDirection: "row", gap: 0, padding: 0, margin: 0, onMouseDown: () => setOpen(!open()), children: [
-      /* @__PURE__ */ jsx("text", { children: open() ? "\u25BC OpenAI Usage" : "\u25B6 OpenAI Usage" }),
-      PLUGIN_VERSION ? /* @__PURE__ */ jsx("text", { fg: SIDEBAR_VERSION_COLOR, attributes: DIM_ATTRIBUTES, children: ` ${PLUGIN_VERSION}` }) : null
-    ] });
+    const renderSidebarHeader = () => (() => {
+      var _el$0 = _$createElement("box"), _el$1 = _$createElement("text");
+      _$insertNode(_el$0, _el$1);
+      _$setProp(_el$0, "flexDirection", "row");
+      _$setProp(_el$0, "gap", 0);
+      _$setProp(_el$0, "padding", 0);
+      _$setProp(_el$0, "margin", 0);
+      _$setProp(_el$0, "onMouseDown", () => setOpen(!open()));
+      _$insert(_el$1, () => open() ? "\u25BC OpenAI Usage" : "\u25B6 OpenAI Usage");
+      _$insert(_el$0, PLUGIN_VERSION ? (() => {
+        var _el$10 = _$createElement("text");
+        _$setProp(_el$10, "fg", "#9ca3af");
+        _$setProp(_el$10, "attributes", DIM_ATTRIBUTES);
+        _$insert(_el$10, ` ${PLUGIN_VERSION}`);
+        return _el$10;
+      })() : null, null);
+      return _el$0;
+    })();
     const renderSidebarBody = () => {
       const currentState = state();
       if (currentState.error && !currentState.primary && !currentState.secondary) {
-        return /* @__PURE__ */ jsx("text", { children: `Status: unavailable
-Error: ${currentState.error}` });
+        return (() => {
+          var _el$11 = _$createElement("text");
+          _$insert(_el$11, () => `Status: unavailable
+Error: ${currentState.error}`);
+          return _el$11;
+        })();
       }
       if (!currentState.primary && !currentState.secondary) {
-        return /* @__PURE__ */ jsx("text", { children: "Status: waiting for usage data" });
+        return (() => {
+          var _el$12 = _$createElement("text");
+          _$insertNode(_el$12, _$createTextNode(`Status: waiting for usage data`));
+          return _el$12;
+        })();
       }
-      return /* @__PURE__ */ jsxs("box", { flexDirection: "column", gap: 0, padding: 0, margin: 0, children: [
-        renderSidebarWindow(currentState.primary),
-        renderSidebarWindow(currentState.secondary)
-      ] });
+      return (() => {
+        var _el$14 = _$createElement("box");
+        _$setProp(_el$14, "flexDirection", "column");
+        _$setProp(_el$14, "gap", 0);
+        _$setProp(_el$14, "padding", 0);
+        _$setProp(_el$14, "margin", 0);
+        _$insert(_el$14, () => renderSidebarWindow(currentState.primary), null);
+        _$insert(_el$14, () => renderSidebarWindow(currentState.secondary), null);
+        return _el$14;
+      })();
     };
     const renderSidebarContent = () => {
       const currentState = state();
       if (!sidebarVisible() || currentState.configured === false) {
         return null;
       }
-      return /* @__PURE__ */ jsxs("box", { flexDirection: "column", gap: 0, padding: 0, margin: 0, children: [
-        renderSidebarHeader(),
-        open() ? renderSidebarBody() : null
-      ] });
+      return (() => {
+        var _el$15 = _$createElement("box");
+        _$setProp(_el$15, "flexDirection", "column");
+        _$setProp(_el$15, "gap", 0);
+        _$setProp(_el$15, "padding", 0);
+        _$setProp(_el$15, "margin", 0);
+        _$insert(_el$15, renderSidebarHeader, null);
+        _$insert(_el$15, (() => {
+          var _c$ = _$memo(() => !!open());
+          return () => _c$() ? renderSidebarBody() : null;
+        })(), null);
+        return _el$15;
+      })();
     };
     api.slots.register({
       order: -100,
@@ -208,31 +284,25 @@ Error: ${currentState.error}` });
         sidebar_content: renderSidebarContent
       }
     });
-    const unregisterCommand = api.command?.register(() => [
-      {
-        title: sidebarVisible() ? "Hide Sidebar Section" : "Show Sidebar Section",
-        value: "openai-usage.toggle-sidebar-visibility",
-        description: "show/hide sidebar entry",
-        category: "OpenAI Usage",
-        onSelect: toggleSidebarVisibility
-      },
-      ...state().configured === false ? [] : [
-        {
-          title: "View status",
-          value: "openai-usage.show",
-          description: "from OpenAI's backend API",
-          category: "OpenAI Usage",
-          onSelect: showUsageDialog
-        },
-        {
-          title: "Toggle Display Mode",
-          value: "openai-usage.toggle-sidebar-invert",
-          description: "between used/left quota",
-          category: "OpenAI Usage",
-          onSelect: toggleSidebarInvert
-        }
-      ]
-    ]);
+    const unregisterCommand = api.command?.register(() => [{
+      title: sidebarVisible() ? "Hide Sidebar Section" : "Show Sidebar Section",
+      value: "openai-usage.toggle-sidebar-visibility",
+      description: "show/hide sidebar entry",
+      category: "OpenAI Usage",
+      onSelect: toggleSidebarVisibility
+    }, ...state().configured === false ? [] : [{
+      title: "View status",
+      value: "openai-usage.show",
+      description: "from OpenAI's backend API",
+      category: "OpenAI Usage",
+      onSelect: showUsageDialog
+    }, {
+      title: "Toggle Display Mode",
+      value: "openai-usage.toggle-sidebar-invert",
+      description: "between used/left quota",
+      category: "OpenAI Usage",
+      onSelect: toggleSidebarInvert
+    }]]);
     api.lifecycle.onDispose(() => {
       unregisterCommand?.();
     });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@a-r-m-i-n/opencode-openai-usage",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "OpenCode plugin that shows ChatGPT/OpenAI usage in the sidebar and command palette.",
   "license": "MIT",
   "repository": {
@@ -29,18 +29,34 @@
     "./tui": "./dist/tui.js"
   },
   "scripts": {
-    "build": "tsup ./src/index.ts ./src/tui.tsx --format esm --out-dir dist --clean --external @opencode-ai/plugin --external @opencode-ai/plugin/tui --external @opentui/core --external @opentui/keymap --external @opentui/solid --external solid-js",
+    "build": "tsup",
     "test": "node --import tsx --test ./src/lib/openai-usage.test.ts",
     "prepublishOnly": "npm run build"
   },
   "dependencies": {
-    "@opencode-ai/plugin": "1.15.10",
-    "@opentui/core": "0.2.16",
-    "@opentui/keymap": "0.2.16",
-    "@opentui/solid": "0.2.16",
+    "@opencode-ai/plugin": "1.15.10"
+  },
+  "peerDependencies": {
+    "@opentui/core": ">=0.2.15",
+    "@opentui/solid": ">=0.2.15",
     "solid-js": "1.9.12"
   },
+  "peerDependenciesMeta": {
+    "@opentui/core": {
+      "optional": true
+    },
+    "@opentui/solid": {
+      "optional": true
+    },
+    "solid-js": {
+      "optional": true
+    }
+  },
   "devDependencies": {
+    "esbuild-plugin-solid": "^0.6.0",
+    "@opentui/core": "0.2.16",
+    "@opentui/solid": "0.2.16",
+    "solid-js": "1.9.12",
     "tsup": "^8.3.6",
     "tsx": "^4.19.2",
     "typescript": "^5.8.3"