vite-plugin-opencode-assistant 1.0.4 → 1.0.5

package/lib/index.js

@@ -0,0 +1,190 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+var lib_exports = {};
+__export(lib_exports, {
+  default: () => opencodePlugin
+});
+module.exports = __toCommonJS(lib_exports);
+var import_vite = __toESM(require("unplugin-vue-inspector/vite"));
+var import_shared = require("@vite-plugin-opencode-assistant/shared");
+var import_endpoints = require("./endpoints/index.js");
+var import_injector = require("./core/injector.js");
+var import_api = require("./core/api.js");
+var import_service = require("./core/service.js");
+var import_paths = require("./utils/paths.js");
+function opencodePlugin(options = {}) {
+  const plugins = [];
+  plugins.push(
+    ...(0, import_vite.default)({
+      enabled: false,
+      toggleButtonVisibility: "never",
+      toggleComboKey: false
+    })
+  );
+  plugins.push(createOpenCodePlugin(options));
+  return plugins;
+}
+function createOpenCodePlugin(options = {}) {
+  const config = __spreadValues(__spreadValues({}, import_shared.DEFAULT_CONFIG), options);
+  (0, import_shared.setVerbose)(config.verbose);
+  const log = (0, import_shared.createLogger)("Plugin");
+  let actualWebPort = config.webPort;
+  let pageContext = { url: "", title: "" };
+  const sseClients = /* @__PURE__ */ new Set();
+  const api = new import_api.OpenCodeAPI(config.hostname, () => actualWebPort, config.warmupChromeMcp);
+  const service = new import_service.OpenCodeService(config, api, sseClients, (port) => {
+    actualWebPort = port;
+  });
+  return {
+    name: "vite-plugin-opencode",
+    apply(_viteConfig, env) {
+      if (!config.enabled) return false;
+      return env.command === "serve" && process.env.NODE_ENV !== "test";
+    },
+    configureServer(server) {
+      return __async(this, null, function* () {
+        var _a2, _b;
+        const timer = log.timer("configureServer");
+        (0, import_endpoints.setupMiddlewares)(server, {
+          get sessionUrl() {
+            return service.sessionUrl;
+          },
+          get sseClients() {
+            return sseClients;
+          },
+          get pageContext() {
+            return pageContext;
+          },
+          set pageContext(ctx) {
+            pageContext = ctx;
+          },
+          getSessions: () => api.getSessions(),
+          createSession: () => api.createSession(),
+          deleteSession: (id) => api.deleteSession(id),
+          resolveWidgetPath: import_paths.resolveWidgetPath,
+          resolveWidgetStylePath: import_paths.resolveWidgetStylePath
+        });
+        (_a2 = server.httpServer) == null ? void 0 : _a2.on("listening", () => __async(null, null, function* () {
+          var _a3;
+          log.debug("Vite server listening event fired");
+          const address = (_a3 = server.httpServer) == null ? void 0 : _a3.address();
+          let vitePort;
+          let viteHost;
+          if (address && typeof address === "object") {
+            vitePort = address.port;
+            const addr = address.address;
+            if (addr === "::" || addr === "::1" || addr === "0.0.0.0" || !addr) {
+              viteHost = "localhost";
+            } else {
+              viteHost = addr;
+            }
+          } else {
+            const host = server.config.server.host;
+            vitePort = server.config.server.port || 5173;
+            viteHost = typeof host === "string" && host !== "0.0.0.0" && host !== "::" && host !== "::1" ? host : "localhost";
+          }
+          const viteOrigin = `http://${viteHost}:${vitePort}`;
+          const contextApiUrl = `http://${viteHost}:${vitePort}${import_shared.CONTEXT_API_PATH}`;
+          log.debug("Vite server ready", {
+            vitePort,
+            viteHost,
+            viteOrigin,
+            contextApiUrl
+          });
+          try {
+            yield service.start([viteOrigin], contextApiUrl, viteOrigin);
+          } catch (e) {
+            log.error("Failed to start services", { error: e });
+          }
+        }));
+        (_b = server.httpServer) == null ? void 0 : _b.on("close", () => {
+          log.debug("HTTP server closing");
+          service.stop();
+        });
+        const cleanup = () => __async(null, null, function* () {
+          log.debug("Process cleanup triggered");
+          yield service.stop();
+          process.exit(0);
+        });
+        process.on("SIGINT", cleanup);
+        process.on("SIGTERM", cleanup);
+        timer.end("\u2713 Server configured");
+      });
+    },
+    transformIndexHtml(html) {
+      const timer = log.timer("transformIndexHtml");
+      const widget = (0, import_injector.injectWidget)({
+        webUrl: `http://${config.hostname}:${actualWebPort}`,
+        serverUrl: `http://${config.hostname}:${actualWebPort}`,
+        position: config.position,
+        theme: config.theme,
+        open: config.open,
+        autoReload: config.autoReload,
+        cwd: process.cwd(),
+        sessionUrl: service.sessionUrl || void 0,
+        hotkey: config.hotkey
+      });
+      timer.end();
+      return html.replace("</body>", `${widget}</body>`);
+    }
+  };
+}

package/lib/style.css

@@ -0,0 +1 @@
+.opencode-widget{--oc-bg-main: #ffffff;--oc-bg-secondary: #f8f9fa;--oc-bg-tertiary: #f3f4f6;--oc-overlay-bg: rgba(255, 255, 255, .9);--oc-bg-inverse: #1e1e1e;--oc-text-primary: #282828;--oc-text-secondary: #4b5563;--oc-text-tertiary: #6b7280;--oc-text-placeholder: #9ca3af;--oc-text-inverse: #ffffff;--oc-border-primary: #e5e7eb;--oc-border-secondary: #d1d5db;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .1);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(0, 0, 0, .5);--oc-tooltip-bg: #1e1e1e;--oc-dialog-overlay: rgba(0, 0, 0, .5);--oc-skeleton-bg: #e5e7eb;--oc-skeleton-gradient: linear-gradient(90deg, #e5e7eb 25%, #f3f4f6 50%, #e5e7eb 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .15);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .12);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .3);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .2);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .3);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .3);--oc-trigger-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--oc-trigger-bg-hover: linear-gradient(135deg, #764ba2 0%, #667eea 100%);--oc-trigger-bg-active: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);--oc-trigger-shadow: 0 4px 15px rgba(102, 126, 234, .4);--oc-trigger-shadow-hover: 0 6px 20px rgba(102, 126, 234, .6);--oc-trigger-shadow-active: 0 6px 20px rgba(240, 147, 251, .4);position:fixed;z-index:999999;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-widget.opencode-theme-dark{--oc-bg-main: #1a1a1a;--oc-bg-secondary: #1e1e1e;--oc-bg-tertiary: #282828;--oc-overlay-bg: rgba(26, 26, 26, .9);--oc-bg-inverse: #ffffff;--oc-text-primary: #f3f4f6;--oc-text-secondary: #d1d5db;--oc-text-tertiary: #9ca3af;--oc-text-placeholder: #6b7280;--oc-text-inverse: #282828;--oc-border-primary: #282828;--oc-border-secondary: #4b5563;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .15);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(26, 26, 26, .9);--oc-tooltip-bg: #282828;--oc-dialog-overlay: rgba(0, 0, 0, .7);--oc-skeleton-bg: #151515;--oc-skeleton-gradient: linear-gradient(90deg, #282828 25%, #4b5563 50%, #282828 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .3);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .6);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .3);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .4);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .4);--oc-trigger-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--oc-trigger-bg-hover: linear-gradient(135deg, #764ba2 0%, #667eea 100%);--oc-trigger-bg-active: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);--oc-trigger-shadow: 0 4px 15px rgba(102, 126, 234, .5);--oc-trigger-shadow-hover: 0 6px 20px rgba(102, 126, 234, .7);--oc-trigger-shadow-active: 0 6px 20px rgba(240, 147, 251, .5)}.opencode-widget.bottom-right{bottom:20px;right:20px}.opencode-widget.bottom-left{bottom:20px;left:20px}.opencode-widget.top-right{top:20px;right:20px}.opencode-widget.top-left{top:20px;left:20px}.opencode-chat{position:absolute;width:700px;height:86vh;background:var(--oc-bg-main);border-radius:16px;box-shadow:var(--oc-shadow-lg);overflow:hidden;opacity:0;visibility:hidden;transform:translateY(20px) scale(.95);transition:all .3s ease;display:flex;flex-direction:column}.opencode-chat-content{display:flex;flex:1;overflow:hidden}.opencode-widget.bottom-right .opencode-chat{bottom:56px;right:0}.opencode-widget.bottom-left .opencode-chat{bottom:56px;left:0}.opencode-widget.top-right .opencode-chat{top:56px;right:0}.opencode-widget.top-left .opencode-chat{top:56px;left:0}.opencode-widget.bottom-right .opencode-selected-bubbles{bottom:56px;right:0}.opencode-widget.bottom-left .opencode-selected-bubbles{bottom:56px;left:0}.opencode-widget.top-right .opencode-selected-bubbles{top:56px;bottom:auto;right:0}.opencode-widget.top-left .opencode-selected-bubbles{top:56px;bottom:auto;left:0}.opencode-chat.open{opacity:1;visibility:visible;transform:translateY(0) scale(1)}.opencode-notification{position:absolute;top:20px;left:50%;transform:translate(-50%);padding:12px 20px;background:var(--oc-bg-main);color:var(--oc-text-primary);border:1px solid var(--oc-border-primary);border-radius:8px;font-size:14px;box-shadow:var(--oc-shadow-lg);animation:slideDown .3s ease;z-index:10000000}.opencode-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--oc-dialog-overlay);display:flex;align-items:center;justify-content:center;z-index:9999999;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.opencode-dialog{background:var(--oc-bg-main);border-radius:12px;padding:24px;min-width:320px;max-width:400px;box-shadow:var(--oc-shadow-xl);animation:scaleIn .2s ease}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.opencode-dialog-content{margin-bottom:20px}.opencode-dialog-message{font-size:15px;color:var(--oc-text-primary);line-height:1.5}.opencode-dialog-actions{display:flex;gap:12px;justify-content:flex-end}.opencode-dialog-btn{padding:10px 20px;border-radius:8px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.opencode-dialog-btn.cancel{background:var(--oc-bg-tertiary);color:var(--oc-text-primary)}.opencode-dialog-btn.cancel:hover{background:var(--oc-text-primary);color:var(--oc-bg-main)}.opencode-dialog-btn.confirm{background:var(--oc-danger);color:#fff}.opencode-dialog-btn.confirm:hover{background:var(--oc-danger-hover)}@keyframes slideDown{0%{transform:translate(-50%) translateY(-100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.opencode-element-highlight{position:fixed;pointer-events:none;z-index:999998;display:none;transition:all .1s ease;border-radius:4px}#vue-inspector-container{display:none!important}.opencode-element-tooltip{position:fixed;background:var(--oc-tooltip-bg);color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;z-index:9999998;display:none;box-shadow:var(--oc-shadow-md);max-width:300px;pointer-events:none}.opencode-tooltip-tag{font-weight:500;margin-bottom:4px;word-break:break-all}.opencode-tooltip-file{font-size:11px;color:var(--oc-text-placeholder);word-break:break-all}.opencode-element-highlight-temp{position:absolute;pointer-events:none;z-index:999998;border-radius:4px;animation:highlight-pulse 2s ease-out forwards}@keyframes highlight-pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.02)}to{opacity:0;transform:scale(1)}}@media (max-width:768px){.opencode-chat{width:calc(100vw - 40px);height:calc(100vh - 100px)}}.opencode-iframe-container{flex:1;position:relative;overflow:hidden;display:flex;flex-direction:column;margin-top:-42px}.opencode-loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:var(--oc-overlay-bg);display:none;flex-direction:column;align-items:center;justify-content:center;z-index:10;transition:opacity .3s ease}.opencode-loading-overlay.visible{display:flex}.opencode-loading-spinner{width:40px;height:40px;border:3px solid var(--oc-border-primary);border-top-color:var(--oc-primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.opencode-loading-text{margin-top:12px;font-size:14px;color:var(--oc-text-placeholder)}.opencode-empty-state-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:var(--oc-bg-secondary);display:none;flex-direction:column;align-items:center;justify-content:center;z-index:5;transition:opacity .3s ease;margin-top:42px}.opencode-empty-state-overlay.visible{display:flex}.opencode-empty-state-icon{color:var(--oc-text-placeholder);margin-bottom:16px}.opencode-empty-state-text{color:var(--oc-text-primary);font-size:16px;font-weight:500;margin-bottom:24px}.opencode-empty-state-btn{padding:10px 24px;border-radius:8px;border:none;background:var(--oc-primary);color:#fff;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;box-shadow:var(--oc-shadow-primary)}.opencode-empty-state-btn:hover{background:var(--oc-primary-hover);transform:translateY(-1px);box-shadow:var(--oc-shadow-primary-hover)}.opencode-empty-state-btn:active{transform:translateY(0)}.opencode-iframe{width:100%;height:100%;border:none}.opencode-chat-header{position:relative;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 12px;height:40px;background:var(--oc-bg-secondary);border-bottom:1px solid var(--oc-border-primary);z-index:5}.opencode-chat-header-left{display:flex;align-items:center;gap:4px}.opencode-chat-header-title{font-size:14px;font-weight:600;color:var(--oc-text-primary);position:absolute;left:50%;transform:translate(-50%)}.opencode-chat-header-actions{display:flex;gap:4px}.opencode-header-btn{width:28px;height:28px;border-radius:6px;border:none;background:transparent;color:var(--oc-text-placeholder);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.opencode-header-btn:hover{background:var(--oc-bg-tertiary);color:var(--oc-text-primary)}.opencode-header-btn.close:hover{background:var(--oc-danger);color:#fff}.opencode-header-btn.select-btn.active{background:var(--oc-primary);color:#fff}.opencode-select-mode-hint{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:10px 16px;background:var(--oc-danger);color:#fff;border-radius:8px;font-size:13px;box-shadow:var(--oc-shadow-danger);z-index:9999999;display:none;align-items:center;gap:12px}.opencode-select-mode-hint.visible{display:flex;animation:slideDown .3s ease}.opencode-hint-shortcut{padding:2px 6px;background:#fff3;border-radius:4px;font-size:12px}.opencode-selected-bubbles{position:absolute;display:none;flex-direction:column;gap:6px;max-width:220px;max-height:300px;overflow-y:auto}.opencode-selected-bubbles.visible{display:flex}.opencode-selected-bubble{display:flex;flex-direction:column;gap:2px;padding:8px 24px 8px 10px;background:var(--oc-bg-main);border:1px solid var(--oc-border-primary);border-radius:8px;font-size:12px;box-shadow:var(--oc-shadow-sm);position:relative;cursor:pointer;transition:all .2s}.opencode-selected-bubble:hover{border-color:var(--oc-primary);box-shadow:var(--oc-shadow-primary)}.opencode-bubble-text{color:var(--oc-text-primary);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.opencode-bubble-file{color:var(--oc-text-placeholder);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.opencode-bubble-remove{position:absolute;top:8px;right:6px;width:16px;height:16px;border-radius:50%;border:none;background:transparent;color:var(--oc-text-placeholder);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;transition:all .2s}.opencode-bubble-remove:hover{background:var(--oc-danger);color:#fff}.opencode-bubble-empty{padding:8px 12px;background:var(--oc-bg-main);border:1px dashed var(--oc-border-secondary);border-radius:8px;color:var(--oc-text-placeholder);font-size:12px;text-align:center}.opencode-right-toolbar{width:140px;background:var(--oc-bg-secondary);border-left:1px solid var(--oc-border-primary);display:flex;flex-direction:column;flex-shrink:0;transition:width .2s ease;overflow:hidden}.opencode-right-toolbar.collapsed{width:0;overflow:hidden}.opencode-right-toolbar.collapsed .opencode-selected-nodes-header,.opencode-right-toolbar.collapsed .opencode-selected-nodes,.opencode-right-toolbar.collapsed .opencode-clear-all-btn{display:none}.opencode-selected-nodes-header{padding:12px 8px 8px;border-bottom:1px solid var(--oc-border-primary)}.opencode-selected-nodes-title{font-size:14px;font-weight:600;color:var(--oc-text-primary);margin-bottom:4px}.opencode-selected-nodes-desc{font-size:11px;color:var(--oc-text-placeholder);line-height:1.4}.opencode-selected-nodes{flex:1;display:flex;flex-direction:column;padding:8px;gap:6px;overflow-y:auto;overflow-x:hidden}.opencode-selected-nodes:empty:before{content:"暂无选中元素";color:var(--oc-text-placeholder);font-size:12px;text-align:center;padding:20px 10px}.opencode-selected-node{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--oc-bg-main);border:1px solid var(--oc-border-primary);border-radius:6px;font-size:12px;transition:all .2s}.opencode-selected-node:hover{border-color:var(--oc-primary);box-shadow:var(--oc-shadow-primary)}.opencode-node-content{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.opencode-node-text{color:var(--oc-text-primary);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.opencode-node-file{color:var(--oc-text-placeholder);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.opencode-node-remove{width:18px;height:18px;border-radius:4px;border:none;background:transparent;color:var(--oc-text-placeholder);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;transition:all .2s;flex-shrink:0}.opencode-node-remove:hover{background:var(--oc-danger);color:#fff}.opencode-clear-all-btn{width:calc(100% - 16px);margin:8px;padding:8px 12px;border-radius:6px;border:none;background:var(--oc-danger);color:#fff;font-size:12px;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:4px;transition:all .2s}.opencode-clear-all-btn:hover{background:var(--oc-danger-hover);transform:scale(1.02)}.opencode-session-list{width:240px;background:var(--oc-bg-secondary);border-right:1px solid var(--oc-border-primary);display:flex;flex-direction:column;flex-shrink:0;transition:width .2s ease}.opencode-session-list.collapsed{width:0;overflow:hidden}.opencode-session-list.collapsed .opencode-session-list-header,.opencode-session-list.collapsed .opencode-session-list-content{display:none}.opencode-session-list-header{padding:16px;border-bottom:1px solid var(--oc-border-primary);display:flex;justify-content:space-between;align-items:center;font-weight:600;font-size:14px;color:var(--oc-text-primary)}.opencode-new-session-btn{width:28px;height:28px;border-radius:6px;border:none;background:var(--oc-primary);color:#fff;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.opencode-new-session-btn:hover{background:var(--oc-primary-hover);transform:scale(1.05)}.opencode-session-list-content{flex:1;overflow-y:auto;padding:8px;position:relative}.opencode-session-list-loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:var(--oc-overlay-bg);display:flex;align-items:center;justify-content:center;z-index:10;border-radius:8px}.opencode-loading-spinner.small{width:24px;height:24px;border-width:2px}.opencode-session-item{padding:12px;border-radius:8px;cursor:pointer;transition:all .2s;margin-bottom:4px;color:var(--oc-text-primary)}.opencode-session-item:hover{background:var(--oc-bg-tertiary)}.opencode-session-item.active{background:var(--oc-primary);color:#fff}.opencode-session-title{font-size:14px;font-weight:500;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.opencode-session-meta{font-size:12px;opacity:.6}.opencode-session-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.opencode-session-delete-btn{width:20px;height:20px;border-radius:4px;border:none;background:transparent;color:var(--oc-text-placeholder);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;opacity:0;flex-shrink:0}.opencode-session-item:hover .opencode-session-delete-btn{opacity:1}.opencode-session-delete-btn:hover{background:var(--oc-danger);color:#fff}.opencode-session-item.active .opencode-session-delete-btn{color:#ffffffb3}.opencode-session-item.active .opencode-session-delete-btn:hover{background:#fff3;color:#fff}.opencode-session-header-skeleton{padding:16px;border-bottom:1px solid var(--oc-border-primary);display:none;justify-content:space-between;align-items:center}.opencode-session-header-skeleton.visible{display:flex}.opencode-skeleton-header-title{height:18px;width:80px;background:var(--oc-skeleton-gradient);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:4px}.opencode-skeleton-header-btn{width:28px;height:28px;background:var(--oc-skeleton-gradient);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:6px}.opencode-session-skeleton{flex:1;overflow-y:auto;padding:8px;display:none}.opencode-session-skeleton.visible{display:block}.opencode-skeleton-item{padding:12px;border-radius:8px;margin-bottom:4px;background:var(--oc-skeleton-bg)}.opencode-skeleton-title{height:16px;background:var(--oc-skeleton-gradient);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:4px;margin-bottom:8px;width:70%}.opencode-skeleton-meta{height:12px;background:var(--oc-skeleton-gradient);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:4px;width:50%}.opencode-session-empty{padding:32px 16px;text-align:center;color:var(--oc-text-placeholder);font-size:13px}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.opencode-button{width:44px;height:44px;border-radius:50%;background:var(--oc-trigger-bg);border:none;cursor:pointer;box-shadow:var(--oc-trigger-shadow);transition:all .3s ease;display:flex;align-items:center;justify-content:center;color:#fff;padding:0;position:relative}.opencode-button:before{content:"";position:absolute;top:-8px;left:-8px;right:-8px;bottom:-8px;border-radius:50%}.opencode-button:hover{transform:scale(1.1);box-shadow:var(--oc-trigger-shadow-hover);background:var(--oc-trigger-bg-hover)}.opencode-button.active{background:var(--oc-trigger-bg-active);box-shadow:var(--oc-trigger-shadow-active)}.opencode-button.active svg{transform:rotate(180deg)}.opencode-button svg{transition:transform .3s ease}.opencode-button.loading{animation:pulse 1s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}

package/lib/utils/paths.d.ts

@@ -0,0 +1,3 @@
+export declare function resolvePackageDir(): string;
+export declare function resolveWidgetPath(): string;
+export declare function resolveWidgetStylePath(): string;

package/lib/utils/paths.js

@@ -0,0 +1,73 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var paths_exports = {};
+__export(paths_exports, {
+  resolvePackageDir: () => resolvePackageDir,
+  resolveWidgetPath: () => resolveWidgetPath,
+  resolveWidgetStylePath: () => resolveWidgetStylePath
+});
+module.exports = __toCommonJS(paths_exports);
+var import_fs = __toESM(require("fs"));
+var import_path = __toESM(require("path"));
+var import_module = require("module");
+const require2 = (0, import_module.createRequire)(import_path.default.join(process.cwd(), "package.json"));
+const packageDir = resolvePackageDir();
+function resolvePackageDir() {
+  const entryPath = require2.resolve("vite-plugin-opencode-assistant");
+  return import_path.default.resolve(import_path.default.dirname(entryPath), "..");
+}
+function resolveWidgetPath() {
+  const candidatePaths = [
+    import_path.default.join(packageDir, "es", "client.js"),
+    import_path.default.join(packageDir, "lib", "client.js")
+  ];
+  for (const candidatePath of candidatePaths) {
+    if (import_fs.default.existsSync(candidatePath)) {
+      return candidatePath;
+    }
+  }
+  return candidatePaths[0];
+}
+function resolveWidgetStylePath() {
+  const candidatePaths = [
+    import_path.default.join(packageDir, "es", "style.css"),
+    import_path.default.join(packageDir, "lib", "style.css")
+  ];
+  for (const candidatePath of candidatePaths) {
+    if (import_fs.default.existsSync(candidatePath)) {
+      return candidatePath;
+    }
+  }
+  return candidatePaths[0];
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  resolvePackageDir,
+  resolveWidgetPath,
+  resolveWidgetStylePath
+});

package/lib/utils/system.d.ts

@@ -0,0 +1,5 @@
+export declare function waitForServer(url: string, timeout?: number): Promise<void>;
+export declare function checkOpenCodeInstalled(): Promise<boolean>;
+export declare function isPortAvailable(port: number, hostname?: string): Promise<boolean>;
+export declare function findAvailablePort(startPort: number, hostname?: string, maxTries?: number): Promise<number>;
+export declare function killOrphanOpenCodeProcesses(): Promise<number>;

package/lib/utils/system.js

@@ -0,0 +1,274 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+var system_exports = {};
+__export(system_exports, {
+  checkOpenCodeInstalled: () => checkOpenCodeInstalled,
+  findAvailablePort: () => findAvailablePort,
+  isPortAvailable: () => isPortAvailable,
+  killOrphanOpenCodeProcesses: () => killOrphanOpenCodeProcesses,
+  waitForServer: () => waitForServer
+});
+module.exports = __toCommonJS(system_exports);
+var import_child_process = require("child_process");
+var import_http = __toESM(require("http"));
+var import_net = __toESM(require("net"));
+var import_shared = require("@vite-plugin-opencode-assistant/shared");
+var import_shared2 = require("@vite-plugin-opencode-assistant/shared");
+const log = (0, import_shared2.createLogger)("Utils");
+function waitForServer(url, timeout = 1e4) {
+  const timer = new import_shared2.PerformanceTimer("waitForServer", { url, timeout });
+  return new Promise((resolve, reject) => {
+    const startTime = Date.now();
+    let attempts = 0;
+    const check = () => {
+      attempts++;
+      log.debug(`Checking server availability (attempt ${attempts})`, { url });
+      const req = import_http.default.get(url, (res) => {
+        if (res.statusCode && res.statusCode < 500) {
+          timer.end(`\u2713 Server ready after ${attempts} attempts`);
+          resolve();
+        } else {
+          log.debug(`Server returned status ${res.statusCode}, retrying...`);
+          retryOrReject();
+        }
+      });
+      req.on("error", (err) => {
+        log.debug(`Server check failed: ${err.message}`);
+        retryOrReject();
+      });
+    };
+    const retryOrReject = () => {
+      const elapsed = Date.now() - startTime;
+      if (elapsed < timeout) {
+        setTimeout(check, import_shared.SERVER_CHECK_INTERVAL);
+      } else {
+        timer.end("\u274C Timeout");
+        reject(new Error(`Server not ready after ${timeout}ms (${attempts} attempts)`));
+      }
+    };
+    check();
+  });
+}
+function checkOpenCodeInstalled() {
+  return __async(this, null, function* () {
+    const timer = log.timer("checkOpenCodeInstalled");
+    return new Promise((resolve) => {
+      log.debug("Checking if OpenCode is installed...");
+      const proc = (0, import_child_process.spawn)("opencode", ["--version"], { stdio: "ignore" });
+      proc.on("close", (code) => {
+        const installed = code === 0;
+        timer.end(installed ? "\u2713 OpenCode is installed" : "\u274C OpenCode not found");
+        resolve(installed);
+      });
+      proc.on("error", (err) => {
+        log.debug("Failed to check OpenCode installation", { error: err.message });
+        timer.end("\u274C Check failed");
+        resolve(false);
+      });
+    });
+  });
+}
+function isPortAvailable(_0) {
+  return __async(this, arguments, function* (port, hostname = import_shared.DEFAULT_HOSTNAME) {
+    return new Promise((resolve) => {
+      const server = import_net.default.createServer();
+      server.once("error", (err) => {
+        log.debug(`Port ${port} is not available`, { error: err.message });
+        resolve(false);
+      });
+      server.once("listening", () => {
+        server.close();
+        log.debug(`Port ${port} is available`);
+        resolve(true);
+      });
+      server.listen(port, hostname);
+    });
+  });
+}
+function findAvailablePort(_0) {
+  return __async(this, arguments, function* (startPort, hostname = import_shared.DEFAULT_HOSTNAME, maxTries = import_shared.MAX_PORT_TRIES) {
+    const timer = log.timer("findAvailablePort", { startPort, hostname, maxTries });
+    log.debug(`Looking for available port starting from ${startPort}`);
+    for (let port = startPort; port < startPort + maxTries; port++) {
+      if (yield isPortAvailable(port, hostname)) {
+        timer.end(`\u2713 Found available port: ${port}`);
+        return port;
+      }
+      log.debug(`Port ${port} is in use, trying next...`);
+    }
+    timer.end("\u274C No available port found");
+    throw new Error(`No available port found after ${maxTries} tries starting from ${startPort}`);
+  });
+}
+function killOrphanOpenCodeProcesses() {
+  return __async(this, null, function* () {
+    const timer = log.timer("killOrphanOpenCodeProcesses");
+    log.debug("Looking for orphan OpenCode processes (PPID=1)");
+    return new Promise((resolve) => {
+      if (process.platform === "win32") {
+        killOrphanProcessesOnWindows(resolve, timer);
+      } else {
+        killOrphanProcessesOnUnix(resolve, timer);
+      }
+    });
+  });
+}
+function killOrphanProcessesOnWindows(resolve, timer) {
+  var _a;
+  log.debug("Using Windows method to find orphan processes");
+  const proc = (0, import_child_process.spawn)(
+    "wmic",
+    ["process", "where", 'name="opencode.exe"', "get", "processid,parentprocessid"],
+    { stdio: "pipe" }
+  );
+  let output = "";
+  (_a = proc.stdout) == null ? void 0 : _a.on("data", (data) => {
+    output += data.toString();
+  });
+  proc.on("close", () => {
+    const lines = output.split("\n").filter((line) => line.trim());
+    const pidsToKill = [];
+    lines.forEach((line) => {
+      const parts = line.trim().split(/\s+/);
+      if (parts.length >= 2) {
+        const ppid = parts[0];
+        const pid = parts[1];
+        if (ppid === "1" && pid && !isNaN(Number(pid))) {
+          pidsToKill.push(pid);
+        }
+      }
+    });
+    if (pidsToKill.length > 0) {
+      log.debug(`Found ${pidsToKill.length} orphan processes`, { pids: pidsToKill });
+      let killedCount = 0;
+      let completedCount = 0;
+      pidsToKill.forEach((pid) => {
+        const killProc = (0, import_child_process.spawn)("taskkill", ["/F", "/PID", pid], { stdio: "ignore" });
+        killProc.on("close", (code) => {
+          completedCount++;
+          if (code === 0) {
+            killedCount++;
+            log.debug(`Killed orphan process ${pid}`);
+          }
+          if (completedCount === pidsToKill.length) {
+            timer.end(`\u2713 Killed ${killedCount} orphan processes`);
+            resolve(killedCount);
+          }
+        });
+      });
+    } else {
+      log.debug("No orphan processes found");
+      timer.end("No orphan processes found");
+      resolve(0);
+    }
+  });
+  proc.on("error", (err) => {
+    log.debug("Failed to find orphan processes", { error: err.message });
+    timer.end("\u274C Failed to find orphan processes");
+    resolve(0);
+  });
+}
+function killOrphanProcessesOnUnix(resolve, timer) {
+  var _a;
+  log.debug("Using Unix method to find orphan processes");
+  const proc = (0, import_child_process.spawn)("ps", ["-e", "-o", "pid,ppid,comm"], { stdio: "pipe" });
+  let output = "";
+  (_a = proc.stdout) == null ? void 0 : _a.on("data", (data) => {
+    output += data.toString();
+  });
+  proc.on("close", () => {
+    const lines = output.split("\n");
+    const pidsToKill = [];
+    lines.forEach((line) => {
+      const trimmed = line.trim();
+      if (trimmed.includes("opencode")) {
+        const parts = trimmed.split(/\s+/);
+        if (parts.length >= 3) {
+          const pid = parts[0];
+          const ppid = parts[1];
+          const comm = parts.slice(2).join(" ");
+          if (ppid === "1" && comm.includes("opencode")) {
+            pidsToKill.push(pid);
+          }
+        }
+      }
+    });
+    if (pidsToKill.length > 0) {
+      log.debug(`Found ${pidsToKill.length} orphan processes`, { pids: pidsToKill });
+      const killProc = (0, import_child_process.spawn)("kill", ["-9", ...pidsToKill], { stdio: "ignore" });
+      killProc.on("close", (code) => {
+        const killedCount = code === 0 ? pidsToKill.length : 0;
+        timer.end(
+          killedCount > 0 ? `\u2713 Killed ${killedCount} orphan processes` : "\u274C Failed to kill processes"
+        );
+        resolve(killedCount);
+      });
+      killProc.on("error", () => {
+        timer.end("\u274C Failed to kill processes");
+        resolve(0);
+      });
+    } else {
+      log.debug("No orphan processes found");
+      timer.end("No orphan processes found");
+      resolve(0);
+    }
+  });
+  proc.on("error", (err) => {
+    log.debug("Failed to find orphan processes", { error: err.message });
+    timer.end("\u274C Failed to find orphan processes");
+    resolve(0);
+  });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  checkOpenCodeInstalled,
+  findAvailablePort,
+  isPortAvailable,
+  killOrphanOpenCodeProcesses,
+  waitForServer
+});

package/package.json

@@ -1,31 +1,25 @@
 {
   "name": "vite-plugin-opencode-assistant",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "Embed OpenCode Web UI in your Vite dev server for real-time code modification and preview",
-  "main": "dist/vite/index.js",
-  "types": "dist/vite/index.d.ts",
   "type": "module",
-  "workspaces": [
-    "example"
+  "main": "lib/index.js",
+  "module": "es/index.js",
+  "types": "es/index.d.ts",
+  "files": [
+    "es",
+    "lib"
   ],
   "exports": {
     ".": {
-      "import": "./dist/vite/index.js",
-      "types": "./dist/vite/index.d.ts"
+      "types": "./es/index.d.ts",
+      "import": "./es/index.js",
+      "require": "./lib/index.js"
     }
   },
-  "files": [
-    "dist"
-  ],
   "publishConfig": {
-    "registry": "https://registry.npmjs.org"
-  },
-  "scripts": {
-    "build": "rm -rf dist && tsc && npm run build:plugins",
-    "build:plugins": "vite build --config vite.plugins.config.ts",
-    "dev": "tsc --watch",
-    "test": "vitest",
-    "prepublishOnly": "npm run build"
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
   },
   "keywords": [
     "vite",
@@ -41,25 +35,26 @@
   "author": "",
   "license": "MIT",
   "dependencies": {
-    "execa": "^9.6.1",
-    "unplugin-vue-inspector": "^2.4.0"
+    "unplugin-vue-inspector": "^2.4.0",
+    "@vite-plugin-opencode-assistant/opencode": "1.0.4",
+    "@vite-plugin-opencode-assistant/shared": "1.0.5",
+    "@vite-plugin-opencode-assistant/components": "1.0.5"
   },
   "peerDependencies": {
     "vite": ">=4.0.0"
   },
   "devDependencies": {
-    "@opencode-ai/plugin": "^1.3.15",
-    "@types/node": "^20.0.0",
-    "typescript": "^5.0.0",
+    "@vitejs/plugin-vue": "^5.0.0",
+    "execa": "^9.6.1",
+    "typescript": "^5.9.3",
     "vite": "^5.0.0",
-    "vitest": "^1.0.0"
-  },
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/your-username/vite-plugin-opencode.git"
+    "vue": "^3.5.32",
+    "vue-tsc": "^2.2.12"
   },
-  "bugs": {
-    "url": "https://github.com/your-username/vite-plugin-opencode/issues"
-  },
-  "homepage": "https://github.com/your-username/vite-plugin-opencode#readme"
-}
+  "scripts": {
+    "build": "pagoda-cli build && vite build -c vite.client.config.ts",
+    "dev": "pagoda-cli dev",
+    "test": "vitest run",
+    "typecheck": "tsc -p tsconfig.json --noEmit"
+  }
+}