@involvex/super-agent-cli 0.0.87 → 0.0.89

package/vscode-extension/dist/chat.css

@@ -0,0 +1,268 @@
+/* Chat webview styles */
+
+:root {
+  --bg-color: var(--vscode-editor-background);
+  --text-color: var(--vscode-editor-foreground);
+  --input-bg: var(--vscode-input-background);
+  --border-color: var(--vscode-panel-border);
+  --accent-color: var(--vscode-textLink-foreground);
+  --user-msg-bg: var(--vscode-textBlockQuote-background);
+  --assistant-msg-bg: var(--vscode-editor-inactiveSelectionBackground);
+  --system-msg-bg: var(--vscode-editorInfo-background);
+}
+
+* {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+body {
+  font-family: var(--vscode-font-family);
+  background-color: var(--bg-color);
+  color: var(--text-color);
+  font-size: var(--vscode-font-size);
+  line-height: 1.5;
+}
+
+.container {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  max-height: 100vh;
+}
+
+.header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 12px;
+  border-bottom: 1px solid var(--border-color);
+  background-color: var(--vscode-sideBarSectionHeader-background);
+}
+
+.title {
+  font-weight: 600;
+  font-size: 12px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+}
+
+.status {
+  font-size: 11px;
+  padding: 2px 8px;
+  border-radius: 3px;
+}
+
+.status.connected {
+  background-color: #4ec9b0;
+  color: #000;
+}
+
+.status.disconnected {
+  background-color: #f48771;
+  color: #000;
+}
+
+.messages {
+  flex: 1;
+  overflow-y: auto;
+  padding: 12px;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.message {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  animation: fadeIn 0.2s ease-in;
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(4px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.message.user {
+  align-items: flex-end;
+}
+
+.message.assistant {
+  align-items: flex-start;
+}
+
+.message.system {
+  align-items: center;
+}
+
+.message.user > .content {
+  background-color: var(--user-msg-bg);
+  border-radius: 8px 8px 0 8px;
+  max-width: 85%;
+  padding: 8px 12px;
+  word-wrap: break-word;
+}
+
+.message.assistant > .content {
+  background-color: var(--assistant-msg-bg);
+  border-radius: 8px 8px 8px 0;
+  max-width: 90%;
+  padding: 8px 12px;
+  word-wrap: break-word;
+}
+
+.message.system > .content {
+  background-color: var(--system-msg-bg);
+  border-radius: 4px;
+  padding: 4px 8px;
+  font-size: 11px;
+  color: var(--vscode-editorInfo-foreground);
+}
+
+.message.user .content,
+.message.assistant .content {
+  white-space: pre-wrap;
+}
+
+.message .content pre {
+  background-color: var(--vscode-textCodeBlock-background);
+  border-radius: 4px;
+  padding: 8px;
+  overflow-x: auto;
+  margin: 8px 0;
+}
+
+.message .content code {
+  font-family: var(--vscode-editor-font-family);
+  font-size: var(--vscode-editor-font-size);
+  background-color: var(--vscode-textCodeBlock-background);
+  padding: 2px 4px;
+  border-radius: 3px;
+}
+
+.message .content pre code {
+  background-color: transparent;
+  padding: 0;
+}
+
+.message .content strong {
+  font-weight: 600;
+}
+
+.message .content em {
+  font-style: italic;
+}
+
+.file-contexts {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+  margin-top: 4px;
+}
+
+.file-mention {
+  font-size: 11px;
+  background-color: var(--vscode-badge-background);
+  color: var(--vscode-badge-foreground);
+  padding: 2px 6px;
+  border-radius: 3px;
+  font-family: var(--vscode-editor-font-family);
+}
+
+.input-area {
+  display: flex;
+  gap: 8px;
+  padding: 12px;
+  border-top: 1px solid var(--border-color);
+  background-color: var(--vscode-editorGroup-header-tabsBackground);
+}
+
+.input-area input {
+  flex: 1;
+  background-color: var(--input-bg);
+  color: var(--text-color);
+  border: 1px solid var(--border-color);
+  border-radius: 4px;
+  padding: 8px 12px;
+  font-size: var(--vscode-font-size);
+  font-family: var(--vscode-font-family);
+}
+
+.input-area input:focus {
+  outline: none;
+  border-color: var(--accent-color);
+}
+
+.input-area button {
+  background-color: var(--accent-color);
+  color: var(--vscode-button-foreground);
+  border: none;
+  border-radius: 4px;
+  padding: 8px 16px;
+  font-size: 13px;
+  font-weight: 500;
+  cursor: pointer;
+  white-space: nowrap;
+}
+
+.input-area button:hover {
+  filter: brightness(0.9);
+}
+
+.input-area button:active {
+  transform: scale(0.98);
+}
+
+.input-area #abort {
+  background-color: var(--vscode-errorBackground);
+}
+
+.file-context {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  padding: 8px 12px;
+  border-top: 1px solid var(--border-color);
+  background-color: var(--vscode-editorGroupHeader-tabsBackground);
+}
+
+.file-context button {
+  background-color: var(--vscode-button-secondaryBackground);
+  color: var(--vscode-button-secondaryForeground);
+  border: 1px solid var(--border-color);
+  border-radius: 4px;
+  padding: 4px 8px;
+  font-size: 11px;
+  cursor: pointer;
+  font-family: var(--vscode-editor-font-family);
+}
+
+.file-context button:hover {
+  background-color: var(--vscode-button-secondaryHoverBackground);
+}
+
+/* Scrollbar styling */
+.messages::-webkit-scrollbar {
+  width: 8px;
+}
+
+.messages::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.messages::-webkit-scrollbar-thumb {
+  background: var(--vscode-scrollbarSlider-background);
+  border-radius: 4px;
+}
+
+.messages::-webkit-scrollbar-thumb:hover {
+  background: var(--vscode-scrollbarSlider-hoverBackground);
+}

package/vscode-extension/dist/chat.js

@@ -0,0 +1,234 @@
+// Chat webview script
+// This runs in the browser context of the webview
+const vscode = acquireVsCodeApi();
+
+let messages = [];
+let isConnected = false;
+
+// Initialize
+window.addEventListener("load", () => {
+  const promptInput = document.getElementById("prompt");
+  const sendButton = document.getElementById("send");
+  const abortButton = document.getElementById("abort");
+  const mentionButton = document.getElementById("mentionCurrent");
+
+  // Send message on Enter
+  if (promptInput) {
+    promptInput.addEventListener("keydown", e => {
+      if (e.key === "Enter" && !e.shiftKey) {
+        e.preventDefault();
+        sendMessage();
+      }
+    });
+  }
+
+  if (sendButton) {
+    sendButton.addEventListener("click", sendMessage);
+  }
+
+  if (abortButton) {
+    abortButton.addEventListener("click", () => {
+      vscode.postMessage({ type: "abort" });
+    });
+  }
+
+  if (mentionButton) {
+    mentionButton.addEventListener("click", () => {
+      vscode.postMessage({ type: "getFileContext" });
+    });
+  }
+
+  // Request file context on load
+  vscode.postMessage({ type: "ready" });
+  vscode.postMessage({ type: "getFileContext" });
+  vscode.postMessage({ type: "requestHistory" });
+});
+
+// Handle messages from extension
+window.addEventListener("message", event => {
+  const message = event.data;
+
+  switch (message.type) {
+    case "messages":
+      messages = message.messages;
+      renderMessages();
+      break;
+
+    case "connectionStatus":
+      isConnected = message.connected;
+      updateConnectionStatus();
+      break;
+
+    case "fileContext":
+      updateFileContext(message.currentFile, message.openFiles);
+      break;
+  }
+});
+
+function sendMessage() {
+  const promptInput = document.getElementById("prompt");
+  const content = promptInput?.value.trim();
+
+  if (content) {
+    vscode.postMessage({ type: "sendMessage", content });
+    if (promptInput) {
+      promptInput.value = "";
+    }
+    showAbortButton();
+  }
+}
+
+function renderMessages() {
+  const messagesContainer = document.getElementById("messages");
+  if (!messagesContainer) {
+    return;
+  }
+
+  messagesContainer.innerHTML = "";
+
+  for (const message of messages) {
+    const messageDiv = document.createElement("div");
+    messageDiv.className = `message ${message.role}`;
+
+    const contentDiv = document.createElement("div");
+    contentDiv.className = "content";
+
+    if (message.role === "user") {
+      contentDiv.textContent = message.content;
+    } else {
+      contentDiv.innerHTML = formatContent(message.content);
+    }
+
+    messageDiv.appendChild(contentDiv);
+
+    // Add file contexts if present
+    if (message.fileContexts && message.fileContexts.length > 0) {
+      const filesDiv = document.createElement("div");
+      filesDiv.className = "file-contexts";
+
+      for (const fileCtx of message.fileContexts) {
+        const fileSpan = document.createElement("span");
+        fileSpan.className = "file-mention";
+        fileSpan.textContent = `@${fileCtx.relativePath}`;
+        filesDiv.appendChild(fileSpan);
+      }
+
+      messageDiv.appendChild(filesDiv);
+    }
+
+    messagesContainer.appendChild(messageDiv);
+  }
+
+  // Scroll to bottom
+  messagesContainer.scrollTop = messagesContainer.scrollHeight;
+}
+
+function formatContent(content) {
+  // Simple markdown-like formatting
+  let formatted = content;
+
+  // Code blocks
+  formatted = formatted.replace(
+    /```(\w+)?\n([\s\S]*?)```/g,
+    (match, lang, code) => {
+      return `<pre><code class="language-${lang || "text"}">${escapeHtml(
+        code.trim(),
+      )}</code></pre>`;
+    },
+  );
+
+  // Inline code
+  formatted = formatted.replace(
+    /`([^`]+)`/g,
+    (match, code) => `<code>${escapeHtml(code)}</code>`,
+  );
+
+  // Bold
+  formatted = formatted.replace(/\*\*([^*]+)\*\*/g, "<strong>$1</strong>");
+
+  // Italic
+  formatted = formatted.replace(/\*([^*]+)\*/g, "<em>$1</em>");
+
+  // Line breaks
+  formatted = formatted.replace(/\n/g, "<br>");
+
+  return formatted;
+}
+
+function escapeHtml(text) {
+  const div = document.createElement("div");
+  div.textContent = text;
+  return div.innerHTML;
+}
+
+function updateConnectionStatus() {
+  const statusElement = document.getElementById("status");
+  if (statusElement) {
+    statusElement.textContent = isConnected ? "Connected" : "Disconnected";
+    statusElement.className =
+      "status " + (isConnected ? "connected" : "disconnected");
+  }
+}
+
+function updateFileContext(currentFile, openFiles) {
+  const fileContextDiv = document.getElementById("fileContext");
+  if (!fileContextDiv) {
+    return;
+  }
+
+  fileContextDiv.style.display = openFiles.length > 0 ? "block" : "none";
+
+  // Clear existing buttons
+  const existingButtons = fileContextDiv.querySelectorAll("button");
+  existingButtons.forEach(btn => btn.remove());
+
+  // Add button for current file
+  if (currentFile) {
+    const button = document.createElement("button");
+    button.textContent = `@ ${currentFile.relativePath}`;
+    button.onclick = () => {
+      const promptInput = document.getElementById("prompt");
+      if (promptInput) {
+        promptInput.value = `@${currentFile.relativePath} ${promptInput.value}`;
+        promptInput.focus();
+      }
+    };
+    fileContextDiv.appendChild(button);
+  }
+
+  // Add buttons for open files (limit to 5)
+  for (const file of openFiles.slice(0, 5)) {
+    if (currentFile && file.relativePath === currentFile.relativePath) {
+      continue; // Skip current file
+    }
+
+    const button = document.createElement("button");
+    button.textContent = `@ ${file.relativePath}`;
+    button.onclick = () => {
+      const promptInput = document.getElementById("prompt");
+      if (promptInput) {
+        promptInput.value = `@${file.relativePath} ${promptInput.value}`;
+        promptInput.focus();
+      }
+    };
+    fileContextDiv.appendChild(button);
+  }
+}
+
+function showAbortButton() {
+  const abortButton = document.getElementById("abort");
+  const sendButton = document.getElementById("send");
+
+  if (abortButton && sendButton) {
+    abortButton.style.display = "inline-block";
+    sendButton.style.display = "none";
+  }
+
+  // Hide abort button after 30 seconds (timeout)
+  setTimeout(() => {
+    if (abortButton && sendButton) {
+      abortButton.style.display = "none";
+      sendButton.style.display = "inline-block";
+    }
+  }, 30000);
+}