vite-plugin-opencode-assistant 1.0.4 → 1.0.6

package/lib/client/index.js

@@ -0,0 +1,328 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+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 __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+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 import_vue = require("vue");
+var import_components = require("@vite-plugin-opencode-assistant/components");
+var import_style = require("@vite-plugin-opencode-assistant/components/style.css");
+var import_shared = require("@vite-plugin-opencode-assistant/shared");
+let config = {};
+const scriptTag = document.querySelector(`script[${import_shared.CONFIG_DATA_ATTR}]`);
+if (scriptTag) {
+  const configBase64 = scriptTag.getAttribute(import_shared.CONFIG_DATA_ATTR);
+  if (configBase64) {
+    try {
+      config = JSON.parse(atob(configBase64));
+    } catch (e) {
+      console.error("[OpenCode] Failed to parse config:", e);
+    }
+  }
+}
+const App = {
+  setup() {
+    const open = (0, import_vue.ref)(false);
+    const selectMode = (0, import_vue.ref)(false);
+    const sessionListCollapsed = (0, import_vue.ref)(true);
+    const loading = (0, import_vue.ref)(false);
+    const loadingSessionList = (0, import_vue.ref)(void 0);
+    const iframeSrc = (0, import_vue.ref)("");
+    const currentSessionId = (0, import_vue.ref)(null);
+    const sessions = (0, import_vue.ref)([]);
+    const selectedElements = (0, import_vue.ref)([]);
+    const widgetRef = (0, import_vue.ref)(null);
+    const {
+      webUrl = "",
+      position = "bottom-right",
+      theme = "auto",
+      open: autoOpen = false,
+      sessionUrl: initialSessionUrl = "",
+      lazy = false,
+      hotkey = "ctrl+k",
+      cwd = ""
+    } = config;
+    const isWaitingForSession = (0, import_vue.ref)(!initialSessionUrl);
+    const computedLoading = (0, import_vue.computed)(() => loading.value || isWaitingForSession.value);
+    let servicesStarted = !lazy;
+    const extractSessionId = (url) => {
+      if (!url) return null;
+      const match = url.match(/\/session\/([^/?]+)/);
+      return match ? match[1] : null;
+    };
+    currentSessionId.value = extractSessionId(initialSessionUrl);
+    if (servicesStarted && initialSessionUrl) {
+      iframeSrc.value = initialSessionUrl;
+    }
+    try {
+      const stored = sessionStorage.getItem("__opencode_selected_elements__");
+      if (stored) {
+        selectedElements.value = JSON.parse(stored);
+      }
+    } catch (e) {
+    }
+    (0, import_vue.watch)(
+      selectedElements,
+      (val) => {
+        sessionStorage.setItem("__opencode_selected_elements__", JSON.stringify(val));
+      },
+      { deep: true }
+    );
+    const showNotification = (msg) => {
+      var _a, _b;
+      (_b = (_a = widgetRef.value) == null ? void 0 : _a.showNotification) == null ? void 0 : _b.call(_a, msg);
+    };
+    const loadSessions = () => __async(null, null, function* () {
+      loadingSessionList.value = true;
+      try {
+        const response = yield fetch("/__opencode_sessions__");
+        const data = yield response.json();
+        sessions.value = data.filter((s) => s.directory === cwd && s.title !== "__chrome_mcp_warmup__").map((s) => {
+          var _a;
+          return __spreadProps(__spreadValues({}, s), {
+            updatedAt: ((_a = s.time) == null ? void 0 : _a.updated) || Date.now()
+          });
+        });
+      } catch (e) {
+        console.error("[OpenCode] Failed to load sessions:", e);
+      } finally {
+        loadingSessionList.value = false;
+      }
+    });
+    const createSession = () => __async(null, null, function* () {
+      try {
+        const response = yield fetch("/__opencode_sessions__", { method: "POST" });
+        const newSession = yield response.json();
+        yield loadSessions();
+        currentSessionId.value = newSession.id;
+        iframeSrc.value = `${webUrl}/${btoa(cwd)}/session/${newSession.id}`;
+      } catch (e) {
+        showNotification("\u521B\u5EFA\u4F1A\u8BDD\u5931\u8D25");
+      }
+    });
+    const deleteSession = (session) => __async(null, null, function* () {
+      try {
+        yield fetch(`/__opencode_sessions__?id=${session.id}`, { method: "DELETE" });
+        yield loadSessions();
+        showNotification("\u4F1A\u8BDD\u5DF2\u5220\u9664");
+        if (currentSessionId.value === session.id) {
+          if (sessions.value.length > 0) {
+            const nextSession = sessions.value[0];
+            currentSessionId.value = nextSession.id;
+            iframeSrc.value = `${webUrl}/${btoa(cwd)}/session/${nextSession.id}`;
+          } else {
+            currentSessionId.value = null;
+            iframeSrc.value = "";
+          }
+        }
+      } catch (e) {
+        showNotification("\u5220\u9664\u4F1A\u8BDD\u5931\u8D25");
+      }
+    });
+    const selectSession = (session) => {
+      if (currentSessionId.value === session.id) return;
+      currentSessionId.value = session.id;
+      loading.value = true;
+      iframeSrc.value = `${webUrl}/${btoa(cwd)}/session/${session.id}`;
+      setTimeout(() => {
+        loading.value = false;
+      }, 500);
+    };
+    let sseConnection = null;
+    const setupSSE = () => {
+      if (!servicesStarted || sseConnection) return;
+      sseConnection = new EventSource("/__opencode_events__");
+      sseConnection.onmessage = (event) => {
+        try {
+          const data = JSON.parse(event.data);
+          if (data.type === "CONNECTED") {
+            updateContext(true);
+          } else if (data.type === "SESSION_READY") {
+            if (data.sessionUrl && !iframeSrc.value) {
+              iframeSrc.value = data.sessionUrl;
+              currentSessionId.value = extractSessionId(data.sessionUrl);
+            }
+            isWaitingForSession.value = false;
+          } else if (data.type === "CLEAR_ELEMENTS") {
+            selectedElements.value = [];
+          }
+        } catch (e) {
+        }
+      };
+    };
+    let currentPageUrl = "";
+    let currentPageTitle = "";
+    const updateContext = (force = false) => {
+      if (!servicesStarted) return;
+      const newUrl = window.location.href;
+      const newTitle = document.title;
+      if (force || newUrl !== currentPageUrl || newTitle !== currentPageTitle) {
+        currentPageUrl = newUrl;
+        currentPageTitle = newTitle;
+        fetch("/__opencode_context__", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({
+            url: newUrl,
+            title: newTitle,
+            selectedElements: selectedElements.value
+          })
+        }).catch(() => {
+        });
+      }
+    };
+    const ensureServicesStarted = () => __async(null, null, function* () {
+      if (servicesStarted) return true;
+      try {
+        const res = yield fetch("/__opencode_start__");
+        const data = yield res.json();
+        if (data.success) {
+          servicesStarted = true;
+          if (data.sessionUrl) {
+            iframeSrc.value = data.sessionUrl;
+            currentSessionId.value = extractSessionId(data.sessionUrl);
+            isWaitingForSession.value = false;
+          }
+          setupSSE();
+          return true;
+        }
+      } catch (e) {
+      }
+      return false;
+    });
+    (0, import_vue.onMounted)(() => {
+      if (servicesStarted) {
+        loadSessions();
+        setupSSE();
+        updateContext(true);
+      }
+      if (autoOpen && servicesStarted) {
+        setTimeout(() => {
+          open.value = true;
+        }, 1e3);
+      }
+      const originalPushState = history.pushState;
+      const originalReplaceState = history.replaceState;
+      history.pushState = function(...args) {
+        originalPushState.apply(this, args);
+        setTimeout(updateContext, 0);
+      };
+      history.replaceState = function(...args) {
+        originalReplaceState.apply(this, args);
+        setTimeout(updateContext, 0);
+      };
+      window.addEventListener("popstate", () => setTimeout(updateContext, 0));
+      window.addEventListener("hashchange", () => setTimeout(updateContext, 0));
+      const titleObserver = new MutationObserver(() => {
+        if (document.title !== currentPageTitle) updateContext();
+      });
+      if (document.head) {
+        titleObserver.observe(document.head, { childList: true, subtree: true });
+      }
+    });
+    const handleToggle = (val) => __async(null, null, function* () {
+      if (lazy && !servicesStarted && val) {
+        loading.value = true;
+        const started = yield ensureServicesStarted();
+        loading.value = false;
+        if (!started) {
+          showNotification("\u670D\u52A1\u542F\u52A8\u5931\u8D25");
+          return;
+        }
+      }
+      open.value = val;
+      if (val) updateContext();
+    });
+    const handleSelectNode = (element) => {
+      const exists = selectedElements.value.some(
+        (el) => el.filePath === element.filePath && el.line === element.line
+      );
+      if (!exists) {
+        selectedElements.value.push(element);
+        showNotification(`\u5DF2\u9009\u4E2D\u5143\u7D20 (${selectedElements.value.length}\u4E2A)`);
+        updateContext(true);
+      } else {
+        showNotification("\u8BE5\u5143\u7D20\u5DF2\u9009\u4E2D");
+      }
+    };
+    const handleClearSelected = () => {
+      selectedElements.value = [];
+      updateContext(true);
+      showNotification("\u5DF2\u6E05\u9664\u6240\u6709\u9009\u4E2D\u5143\u7D20");
+    };
+    return () => {
+      return (0, import_vue.h)(import_components.OpenCodeWidget, {
+        ref: widgetRef,
+        position,
+        theme,
+        open: open.value,
+        selectMode: selectMode.value,
+        sessionListCollapsed: sessionListCollapsed.value,
+        loading: computedLoading.value,
+        loadingSessionList: loadingSessionList.value,
+        iframeSrc: iframeSrc.value,
+        currentSessionId: currentSessionId.value,
+        sessions: sessions.value,
+        selectedElements: selectedElements.value,
+        hotkeyLabel: hotkey,
+        "onUpdate:open": handleToggle,
+        "onUpdate:selectMode": (val) => {
+          selectMode.value = val;
+        },
+        "onUpdate:sessionListCollapsed": (val) => {
+          sessionListCollapsed.value = val;
+        },
+        "onCreate-session": createSession,
+        "onDelete-session": deleteSession,
+        "onSelect-session": selectSession,
+        "onClick-selected-node": handleSelectNode,
+        "onClear-selected-nodes": handleClearSelected,
+        "onRemove-selected-node": ({ index }) => {
+          selectedElements.value.splice(index, 1);
+          updateContext(true);
+        },
+        "onEmpty-action": createSession
+      });
+    };
+  }
+};
+const INIT_MARKER = "__OPENCODE_INITIALIZED__";
+if (!window[INIT_MARKER]) {
+  window[INIT_MARKER] = true;
+  const container = document.createElement("div");
+  document.body.appendChild(container);
+  (0, import_vue.createApp)(App).mount(container);
+}