vite-plugin-opencode-assistant 1.0.16 → 1.0.18

package/lib/core/api.js

@@ -223,6 +223,7 @@ class OpenCodeAPI {
         const connectedProviders = new Set(response.connected);
         const allModels = [];
         for (const provider of response.all) {
+          if (provider.id === "opencode") continue;
           if (!connectedProviders.has(provider.id)) {
             log.debug("Skipping not connected provider", { providerID: provider.id });
             continue;
@@ -232,7 +233,8 @@ class OpenCodeAPI {
               providerID: provider.id,
               modelID,
               name: model.name,
-              inputCost: (_b = (_a = model.cost) == null ? void 0 : _a.input) != null ? _b : 0
+              inputCost: (_b = (_a = model.cost) == null ? void 0 : _a.input) != null ? _b : 0,
+              releaseDate: model.release_date
             });
           }
         }
@@ -253,6 +255,7 @@ class OpenCodeAPI {
           modelID: availableModel.modelID,
           name: availableModel.name,
           inputCost: availableModel.inputCost,
+          releaseDate: availableModel.releaseDate,
           totalModels: allModels.length,
           failedModels: this.failedFreeModels.size,
           connectedProviders: response.connected
@@ -365,15 +368,6 @@ class OpenCodeAPI {
           "__chrome_mcp_warmup__"
         );
         warmupSessionId = warmupSession.id;
-        const prompt = [
-          "Call the browser tool list_pages immediately to establish the Chrome DevTools MCP connection.",
-          viteOrigin ? `If there are no pages, call new_page with ${viteOrigin}.` : "If there are no pages, call new_page with about:blank.",
-          "Do not read or modify project files.",
-          "Do not use any non-browser tools.",
-          "After the tool call is complete, reply with exactly: ready",
-          "If the tool call fails, reply with exactly: fail"
-        ].join(" ");
-        const WARMUP_TIMEOUT = 6e4;
         freeModel = yield this.getCheapestModel();
         if (freeModel) {
           log.debug("Using cheapest model for warmup", {
@@ -383,6 +377,7 @@ class OpenCodeAPI {
         } else {
           log.debug("No model available, using default model");
         }
+        const WARMUP_TIMEOUT = 6e4;
         const data = yield this.createHttpRequest(
           {
             hostname: this.hostname,
@@ -392,8 +387,12 @@ class OpenCodeAPI {
             headers: { "Content-Type": "application/json" }
           },
           JSON.stringify(__spreadValues({
-            system: "You are warming up Chrome DevTools MCP during startup. You must use the available browser tools immediately before replying.",
-            parts: [{ type: "text", text: prompt }]
+            parts: [
+              {
+                type: "text",
+                text: "Test if the chrome-devtools_list_pages tool is available. If available, reply with: ready. If not available, explain why."
+              }
+            ]
           }, freeModel && {
             model: {
               providerID: freeModel.providerID,
@@ -411,13 +410,6 @@ class OpenCodeAPI {
           );
         }
         const lowerResponse = responseText.toLowerCase();
-        if (lowerResponse.includes("fail")) {
-          throw new import_shared.ChromeMcpWarmupError(
-            import_shared.ChromeMcpWarmupErrorType.CHROME_NOT_CONNECTED,
-            "Chrome DevTools MCP is not connected",
-            "AI reported that browser tools are not available. This should not happen if Chrome DevTools check passed."
-          );
-        }
         if (!lowerResponse.includes("ready")) {
           throw new import_shared.ChromeMcpWarmupError(
             import_shared.ChromeMcpWarmupErrorType.AI_RESPONSE_ERROR,
@@ -431,10 +423,12 @@ class OpenCodeAPI {
           if (e.type === import_shared.ChromeMcpWarmupErrorType.SESSION_ERROR) {
             timer.end("Session creation failed");
           }
-          log.warn(`Chrome MCP warmup failed: ${e.type}`, {
+          log.warn(`Chrome MCP warmup failed: ${e.type}`, __spreadValues({
             message: e.message,
             details: e.details
-          });
+          }, freeModel && {
+            model: `${freeModel.providerID}/${freeModel.modelID}`
+          }));
           timer.end(`Chrome MCP warmup failed: ${e.type}`);
           throw e;
         }
@@ -453,7 +447,11 @@ class OpenCodeAPI {
             "AI response timeout",
             "AI did not respond within 30 seconds. Please check if the OpenCode AI model is properly configured and available."
           );
-          log.warn("Chrome MCP warmup timeout", { error: errorMessage });
+          log.warn("Chrome MCP warmup timeout", __spreadValues({
+            error: errorMessage
+          }, freeModel && {
+            model: `${freeModel.providerID}/${freeModel.modelID}`
+          }));
           timer.end("Chrome MCP warmup timeout");
           throw error2;
         }
@@ -462,7 +460,11 @@ class OpenCodeAPI {
           "Unknown error during Chrome MCP warmup",
           errorMessage
         );
-        log.warn("Chrome MCP warmup failed with unknown error", { error: errorMessage });
+        log.warn("Chrome MCP warmup failed with unknown error", __spreadValues({
+          error: errorMessage
+        }, freeModel && {
+          model: `${freeModel.providerID}/${freeModel.modelID}`
+        }));
         timer.end("Chrome MCP warmup failed");
         throw error;
       } finally {
@@ -527,15 +529,6 @@ class OpenCodeAPI {
           "__chrome_mcp_warmup__"
         );
         warmupSessionId = warmupSession.id;
-        const prompt = [
-          "Call the browser tool list_pages immediately to establish the Chrome DevTools MCP connection.",
-          viteOrigin ? `If there are no pages, call new_page with ${viteOrigin}.` : "If there are no pages, call new_page with about:blank.",
-          "Do not read or modify project files.",
-          "Do not use any non-browser tools.",
-          "After the tool call is complete, reply with exactly: ready",
-          "If the tool call fails, reply with exactly: fail"
-        ].join(" ");
-        const WARMUP_TIMEOUT = 6e4;
         freeModel = yield this.getCheapestModel();
         if (freeModel) {
           log.debug("Using cheapest model for retry warmup", {
@@ -545,6 +538,7 @@ class OpenCodeAPI {
         } else {
           log.debug("No model available for retry, using default model");
         }
+        const WARMUP_TIMEOUT = 6e4;
         const data = yield this.createHttpRequest(
           {
             hostname: this.hostname,
@@ -554,8 +548,12 @@ class OpenCodeAPI {
             headers: { "Content-Type": "application/json" }
           },
           JSON.stringify(__spreadValues({
-            system: "You are warming up Chrome DevTools MCP during startup. You must use the available browser tools immediately before replying.",
-            parts: [{ type: "text", text: prompt }]
+            parts: [
+              {
+                type: "text",
+                text: "Test if the chrome-devtools_list_pages tool is available. If available, reply with: ready. If not available, explain why."
+              }
+            ]
           }, freeModel && {
             model: {
               providerID: freeModel.providerID,
@@ -574,13 +572,6 @@ class OpenCodeAPI {
           );
         }
         const lowerResponse = responseText.toLowerCase();
-        if (lowerResponse.includes("fail")) {
-          throw new import_shared.ChromeMcpWarmupError(
-            import_shared.ChromeMcpWarmupErrorType.CHROME_NOT_CONNECTED,
-            "Chrome DevTools MCP is not connected",
-            "AI reported that browser tools are not available. This should not happen if Chrome DevTools check passed."
-          );
-        }
         if (!lowerResponse.includes("ready")) {
           throw new import_shared.ChromeMcpWarmupError(
             import_shared.ChromeMcpWarmupErrorType.AI_RESPONSE_ERROR,
@@ -595,10 +586,12 @@ class OpenCodeAPI {
           if (e.type === import_shared.ChromeMcpWarmupErrorType.SESSION_ERROR) {
             timer.end("Session creation failed");
           }
-          log.warn(`Chrome MCP warmup retry failed: ${e.type}`, {
+          log.warn(`Chrome MCP warmup retry failed: ${e.type}`, __spreadValues({
             message: e.message,
             details: e.details
-          });
+          }, freeModel && {
+            model: `${freeModel.providerID}/${freeModel.modelID}`
+          }));
           timer.end(`Chrome MCP warmup retry failed: ${e.type}`);
           return { success: false, error: e };
         }
@@ -617,7 +610,11 @@ class OpenCodeAPI {
             "AI response timeout",
             "AI did not respond within 60 seconds. Please check if the OpenCode AI model is properly configured and available."
           );
-          log.warn("Chrome MCP warmup retry timeout", { error: errorMessage });
+          log.warn("Chrome MCP warmup retry timeout", __spreadValues({
+            error: errorMessage
+          }, freeModel && {
+            model: `${freeModel.providerID}/${freeModel.modelID}`
+          }));
           timer.end("Chrome MCP warmup retry timeout");
           return { success: false, error: error2 };
         }
@@ -626,7 +623,11 @@ class OpenCodeAPI {
           "Unknown error during Chrome MCP warmup retry",
           errorMessage
         );
-        log.warn("Chrome MCP warmup retry failed with unknown error", { error: errorMessage });
+        log.warn("Chrome MCP warmup retry failed with unknown error", __spreadValues({
+          error: errorMessage
+        }, freeModel && {
+          model: `${freeModel.providerID}/${freeModel.modelID}`
+        }));
         timer.end("Chrome MCP warmup retry failed");
         return { success: false, error };
       } finally {

package/lib/core/proxy-server.js

@@ -128,8 +128,152 @@ function generateBridgeScript(options) {
     if (event.data && event.data.type === "OPENCODE_SET_THEME") {
       setTheme(event.data.theme);
     }
+    
+    if (event.data && event.data.type === "OPENCODE_INSERT_FILE_PART") {
+      insertFilePart(event.data.element);
+    }
   });
 
+  // === \u4FDD\u5B58\u8F93\u5165\u6846\u5149\u6807\u4F4D\u7F6E ===
+  let savedRange = null;
+  
+  function setupPromptInputListener() {
+    const promptInput = document.querySelector('[data-component="prompt-input"]');
+    if (!promptInput) return;
+    
+    promptInput.addEventListener('blur', function() {
+      const selection = window.getSelection();
+      if (selection && selection.rangeCount > 0) {
+        const range = selection.getRangeAt(0);
+        if (promptInput.contains(range.commonAncestorContainer)) {
+          savedRange = range.cloneRange();
+        }
+      }
+    });
+    
+    promptInput.addEventListener('focus', function() {
+      savedRange = null;
+    });
+  }
+
+  // === \u63D2\u5165 File Part \u5230\u8F93\u5165\u6846 ===
+  function insertFilePart(element) {
+    const promptInput = document.querySelector('[data-component="prompt-input"]');
+    if (!promptInput) {
+      console.warn('[OpenCode Bridge] Prompt input not found');
+      return;
+    }
+
+    const { filePath, line, column, description, innerText, previewPageUrl, previewPageTitle } = element;
+
+    const selector = description || 'element';
+    let textPreview = '';
+    if (innerText && innerText.trim()) {
+      const trimmed = innerText.trim();
+      textPreview = trimmed.length > 5 ? trimmed.substring(0, 5) + '...' : trimmed;
+    }
+    const displayText = '@' + selector + (textPreview ? '(' + textPreview + ')' : '');
+
+    const jsonStr = JSON.stringify({
+      nodeContext: {
+        "filePath": { 
+          "value": filePath, 
+          "desc": "\u6E90\u7801\u6587\u4EF6\u8DEF\u5F84" 
+        },
+        "line": { 
+          "value": line, 
+          "desc": "\u4EE3\u7801\u6240\u5728\u884C\u53F7" 
+        },
+        "column": { 
+          "value": column, 
+          "desc": "\u4EE3\u7801\u6240\u5728\u5217\u53F7" 
+        },
+        "description": { 
+          "value": description, 
+          "desc": "DOM \u5143\u7D20\u9009\u62E9\u5668" 
+        },
+        "innerText": { 
+          "value": innerText ? innerText.substring(0, 500) : '', 
+          "desc": "DOM \u5143\u7D20\u5185\u90E8\u6587\u672C" 
+        },
+        "selectAt": { 
+          "value": previewPageUrl || '', 
+          "desc": "\u7528\u6237\u9009\u4E2D\u8282\u70B9\u65F6\u7684\u9875\u9762 URL" 
+        }
+      }
+    });
+
+    const span = document.createElement('span');
+    span.setAttribute('data-type', 'file');
+    span.setAttribute('data-path', jsonStr);
+    span.setAttribute('contenteditable', 'false');
+    
+    span.textContent = displayText;
+
+    if (savedRange) {
+      const range = savedRange;
+      range.collapse(false);
+      range.insertNode(span);
+      
+      const space = document.createTextNode('\\u00A0');
+      span.parentNode.insertBefore(space, span.nextSibling);
+      
+      const newRange = document.createRange();
+      newRange.setStartAfter(space);
+      newRange.collapse(true);
+      
+      promptInput.focus();
+      
+      const selection = window.getSelection();
+      if (selection) {
+        selection.removeAllRanges();
+        selection.addRange(newRange);
+      }
+      savedRange = null;
+      
+      promptInput.dispatchEvent(new Event('input', { bubbles: true }));
+      return;
+    }
+
+    const selection = window.getSelection();
+    if (selection && selection.rangeCount > 0) {
+      const range = selection.getRangeAt(0);
+      
+      if (promptInput.contains(range.commonAncestorContainer)) {
+        range.collapse(false);
+        range.insertNode(span);
+        
+        const space = document.createTextNode('\\u00A0');
+        span.parentNode.insertBefore(space, span.nextSibling);
+        
+        const newRange = document.createRange();
+        newRange.setStartAfter(space);
+        newRange.collapse(true);
+        selection.removeAllRanges();
+        selection.addRange(newRange);
+        
+        promptInput.dispatchEvent(new Event('input', { bubbles: true }));
+        return;
+      }
+    }
+
+    promptInput.appendChild(span);
+    const space = document.createTextNode('\\u00A0');
+    promptInput.appendChild(space);
+    
+    const newRange = document.createRange();
+    newRange.setStartAfter(space);
+    newRange.collapse(true);
+    const newSelection = window.getSelection();
+    if (newSelection) {
+      newSelection.removeAllRanges();
+      newSelection.addRange(newRange);
+    }
+    
+    promptInput.dispatchEvent(new Event('input', { bubbles: true }));
+    promptInput.focus();
+  }
+
   // === \u601D\u8003\u72B6\u6001\u76D1\u542C (\u5B8C\u5168\u590D\u523B OpenCode Web \u5B9E\u73B0) ===
   // OpenCode Web \u6838\u5FC3\u903B\u8F91:
   // working = !!pending() || sessionStatus().type !== "idle"
@@ -238,6 +382,16 @@ function generateBridgeScript(options) {
       window.parent.postMessage({ type: "OPENCODE_READY" }, "*");
     }
     setupThinkingListener();
+    setupPromptInputListener();
+    
+    const observer = new MutationObserver(function(mutations) {
+      const promptInput = document.querySelector('[data-component="prompt-input"]');
+      if (promptInput && !promptInput._opencodeListenerAttached) {
+        setupPromptInputListener();
+        promptInput._opencodeListenerAttached = true;
+      }
+    });
+    observer.observe(document.body, { childList: true, subtree: true });
   }
 
   if (document.readyState === 'loading') {

package/lib/style.css

@@ -1 +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-thinking-gradient-1: #10b981;--oc-thinking-gradient-2: #059669;--oc-thinking-glow: rgba(16, 185, 129, .3);--oc-thinking-glow-strong: rgba(16, 185, 129, .6);--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: #3b82f6;--oc-trigger-bg-hover: #2563eb;--oc-trigger-bg-active: #1d4ed8;--oc-trigger-shadow: 0 2px 8px rgba(59, 130, 246, .3);--oc-trigger-shadow-hover: 0 4px 12px rgba(59, 130, 246, .4);--oc-trigger-shadow-active: 0 4px 12px rgba(59, 130, 246, .5);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-thinking-gradient-1: #34d399;--oc-thinking-gradient-2: #10b981;--oc-thinking-glow: rgba(52, 211, 153, .3);--oc-thinking-glow-strong: rgba(52, 211, 153, .6);--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: #60a5fa;--oc-trigger-bg-hover: #3b82f6;--oc-trigger-bg-active: #2563eb;--oc-trigger-shadow: 0 2px 8px rgba(96, 165, 250, .4);--oc-trigger-shadow-hover: 0 4px 12px rgba(96, 165, 250, .5);--oc-trigger-shadow-active: 0 4px 12px rgba(96, 165, 250, .6)}.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 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:10000000;display:flex;align-items:center;gap:10px}.opencode-notification:before{content:"💡";font-size:16px}.opencode-dialog-overlay{position:fixed;inset: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;inset: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-error-overlay{position:absolute;inset:0;z-index:15;margin-top:42px;display:none}.opencode-error-overlay.visible{display:flex}.opencode-empty-state-overlay{position:absolute;inset: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,.opencode-header-btn.session-toggle.active{background:var(--oc-primary);color:#fff}.opencode-select-mode-hint{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:10px;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border-radius:12px;font-size:14px;font-weight:500;box-shadow:0 6px 20px #ef444480,0 0 0 3px #ef44444d;z-index:9999999;display:none;align-items:center;gap:12px;border:1px solid rgba(255,255,255,.3)}.opencode-select-mode-hint.visible{display:flex;animation:slideDown .3s ease,pulseHint 2s ease-in-out infinite}.opencode-hint-shortcut{padding:4px 10px;background:#ffffff40;border-radius:6px;font-size:13px;font-weight:600;border:1px solid rgba(255,255,255,.4)}@keyframes pulseHint{0%,to{box-shadow:0 6px 20px #ef444480,0 0 0 3px #ef44444d}50%{box-shadow:0 6px 20px #ef444499,0 0 0 6px #ef444466}}.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;inset: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:transform .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;transition:none}.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;overflow:visible}.opencode-button svg{transform:rotate(180deg);transition:transform .3s ease}.opencode-button:before{content:"";position:absolute;inset:-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.thinking{background:linear-gradient(135deg,#667eea,#764ba2,#667eea);background-size:200% 200%;animation:thinking-gradient 2s ease infinite,thinking-pulse 2s ease-in-out infinite;box-shadow:0 0 20px #667eea80,0 0 40px #764ba24d}.opencode-button.thinking svg{animation:none}.opencode-button.thinking:before{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle,rgba(102,126,234,.7) 0%,rgba(118,75,162,.5) 50%,transparent 70%);transform:translate(-50%,-50%);animation:ripple-wave 2s ease-out infinite;pointer-events:none}.opencode-button.thinking:after{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle,rgba(118,75,162,.6) 0%,rgba(102,126,234,.4) 50%,transparent 70%);transform:translate(-50%,-50%);animation:ripple-wave 2s ease-out infinite;animation-delay:1s;pointer-events:none}@keyframes thinking-gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes ripple-wave{0%{transform:translate(-50%,-50%) scale(1);opacity:.8}to{transform:translate(-50%,-50%) scale(2.5);opacity:0}}@keyframes thinking-pulse{0%,to{transform:scale(1)}50%{transform:scale(.9)}}.opencode-button.loading{animation:pulse 1s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.opencode-chrome-warmup-error-details[data-v-6b3ae44a]{margin-top:8px;padding:12px;background:var(--oc-bg-tertiary);border-radius:6px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:12px;color:var(--oc-text-secondary);max-height:120px;overflow-y:auto;word-break:break-word}.opencode-custom-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px}.opencode-loading-spinner{width:32px;height:32px;border:3px solid var(--oc-border-primary);border-top-color:var(--oc-primary);border-radius:50%;animation:opencode-spin .8s linear infinite}@keyframes opencode-spin{to{transform:rotate(360deg)}}.opencode-loading-text{margin-top:12px;color:var(--oc-text-secondary);font-size:14px}.opencode-chrome-warmup-failed{position:absolute;inset:0;background:var(--oc-bg-secondary);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:15}.opencode-chrome-warmup-failed-icon{color:var(--oc-warning, #f59e0b);margin-bottom:16px}.opencode-chrome-warmup-failed-title{color:var(--oc-text-primary);font-size:18px;font-weight:600;margin-bottom:8px}.opencode-chrome-warmup-failed-text{color:var(--oc-text-secondary);font-size:14px;margin-bottom:24px;text-align:left;max-width:400px;line-height:1.6;text-align:center}.opencode-chrome-warmup-failed-text p{margin:0 0 12px;font-weight:500;color:var(--oc-text-primary)}.opencode-chrome-warmup-steps{margin:0;padding-left:20px}.opencode-chrome-warmup-steps li{margin-bottom:8px;color:var(--oc-text-secondary);font-size:13px;line-height:1.5}.opencode-chrome-warmup-steps li:last-child{margin-bottom:0}.opencode-chrome-warmup-code{display:inline-block;background:var(--oc-bg-tertiary);color:var(--oc-primary);padding:2px 6px;border-radius:4px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:12px;font-weight:500;word-break:break-all;margin:0 2px}.opencode-chrome-warmup-failed-actions{display:flex;gap:12px}.opencode-chrome-warmup-failed-btn{padding:10px 24px;border-radius:8px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.opencode-chrome-warmup-failed-btn.primary{background:var(--oc-primary);color:#fff;box-shadow:var(--oc-shadow-primary)}.opencode-chrome-warmup-failed-btn.primary:hover:not(:disabled){background:var(--oc-primary-hover);transform:translateY(-1px);box-shadow:var(--oc-shadow-primary-hover)}.opencode-chrome-warmup-failed-btn.primary:active:not(:disabled){transform:translateY(0)}.opencode-chrome-warmup-failed-btn.primary:disabled{opacity:.6;cursor:not-allowed}
+.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-thinking-gradient-1: #10b981;--oc-thinking-gradient-2: #059669;--oc-thinking-glow: rgba(16, 185, 129, .3);--oc-thinking-glow-strong: rgba(16, 185, 129, .6);--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: #3b82f6;--oc-trigger-bg-hover: #2563eb;--oc-trigger-bg-active: #1d4ed8;--oc-trigger-shadow: 0 2px 8px rgba(59, 130, 246, .3);--oc-trigger-shadow-hover: 0 4px 12px rgba(59, 130, 246, .4);--oc-trigger-shadow-active: 0 4px 12px rgba(59, 130, 246, .5);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-thinking-gradient-1: #34d399;--oc-thinking-gradient-2: #10b981;--oc-thinking-glow: rgba(52, 211, 153, .3);--oc-thinking-glow-strong: rgba(52, 211, 153, .6);--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: #60a5fa;--oc-trigger-bg-hover: #3b82f6;--oc-trigger-bg-active: #2563eb;--oc-trigger-shadow: 0 2px 8px rgba(96, 165, 250, .4);--oc-trigger-shadow-hover: 0 4px 12px rgba(96, 165, 250, .5);--oc-trigger-shadow-active: 0 4px 12px rgba(96, 165, 250, .6)}.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 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:10000000;display:flex;align-items:center;gap:10px}.opencode-notification:before{content:"💡";font-size:16px}.opencode-dialog-overlay{position:fixed;inset: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-page-notification{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:2147483647;display:flex;align-items:center;gap:10px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-page-notification:before{content:"💡";font-size:16px}.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;inset: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-error-overlay{position:absolute;inset:0;z-index:15;margin-top:42px;display:none}.opencode-error-overlay.visible{display:flex}.opencode-empty-state-overlay{position:absolute;inset: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,.opencode-header-btn.session-toggle.active{background:var(--oc-primary);color:#fff}.opencode-select-mode-hint{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:10px;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border-radius:12px;font-size:14px;font-weight:500;box-shadow:0 6px 20px #ef444480,0 0 0 3px #ef44444d;z-index:9999999;display:none;align-items:center;gap:12px;border:1px solid rgba(255,255,255,.3)}.opencode-select-mode-hint.visible{display:flex;animation:slideDown .3s ease,pulseHint 2s ease-in-out infinite}.opencode-hint-shortcut{padding:4px 10px;background:#ffffff40;border-radius:6px;font-size:13px;font-weight:600;border:1px solid rgba(255,255,255,.4)}@keyframes pulseHint{0%,to{box-shadow:0 6px 20px #ef444480,0 0 0 3px #ef44444d}50%{box-shadow:0 6px 20px #ef444499,0 0 0 6px #ef444466}}.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;inset: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:transform .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;transition:none}.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;overflow:visible}.opencode-button svg{transform:rotate(180deg);transition:transform .3s ease}.opencode-button:before{content:"";position:absolute;inset:-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.thinking{background:linear-gradient(135deg,#667eea,#764ba2,#667eea);background-size:200% 200%;animation:thinking-gradient 2s ease infinite,thinking-pulse 2s ease-in-out infinite;box-shadow:0 0 20px #667eea80,0 0 40px #764ba24d}.opencode-button.thinking svg{animation:none}.opencode-button.thinking:before{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle,rgba(102,126,234,.7) 0%,rgba(118,75,162,.5) 50%,transparent 70%);transform:translate(-50%,-50%);animation:ripple-wave 2s ease-out infinite;pointer-events:none}.opencode-button.thinking:after{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle,rgba(118,75,162,.6) 0%,rgba(102,126,234,.4) 50%,transparent 70%);transform:translate(-50%,-50%);animation:ripple-wave 2s ease-out infinite;animation-delay:1s;pointer-events:none}@keyframes thinking-gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes ripple-wave{0%{transform:translate(-50%,-50%) scale(1);opacity:.8}to{transform:translate(-50%,-50%) scale(2.5);opacity:0}}@keyframes thinking-pulse{0%,to{transform:scale(1)}50%{transform:scale(.9)}}.opencode-button.loading{animation:pulse 1s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.opencode-chrome-warmup-error-details[data-v-6b3ae44a]{margin-top:8px;padding:12px;background:var(--oc-bg-tertiary);border-radius:6px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:12px;color:var(--oc-text-secondary);max-height:120px;overflow-y:auto;word-break:break-word}.opencode-custom-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px}.opencode-loading-spinner{width:32px;height:32px;border:3px solid var(--oc-border-primary);border-top-color:var(--oc-primary);border-radius:50%;animation:opencode-spin .8s linear infinite}@keyframes opencode-spin{to{transform:rotate(360deg)}}.opencode-loading-text{margin-top:12px;color:var(--oc-text-secondary);font-size:14px}.opencode-chrome-warmup-failed{position:absolute;inset:0;background:var(--oc-bg-secondary);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:15}.opencode-chrome-warmup-failed-icon{color:var(--oc-warning, #f59e0b);margin-bottom:16px}.opencode-chrome-warmup-failed-title{color:var(--oc-text-primary);font-size:18px;font-weight:600;margin-bottom:8px}.opencode-chrome-warmup-failed-text{color:var(--oc-text-secondary);font-size:14px;margin-bottom:24px;text-align:left;max-width:400px;line-height:1.6;text-align:center}.opencode-chrome-warmup-failed-text p{margin:0 0 12px;font-weight:500;color:var(--oc-text-primary)}.opencode-chrome-warmup-steps{margin:0;padding-left:20px}.opencode-chrome-warmup-steps li{margin-bottom:8px;color:var(--oc-text-secondary);font-size:13px;line-height:1.5}.opencode-chrome-warmup-steps li:last-child{margin-bottom:0}.opencode-chrome-warmup-code{display:inline-block;background:var(--oc-bg-tertiary);color:var(--oc-primary);padding:2px 6px;border-radius:4px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:12px;font-weight:500;word-break:break-all;margin:0 2px}.opencode-chrome-warmup-failed-actions{display:flex;gap:12px}.opencode-chrome-warmup-failed-btn{padding:10px 24px;border-radius:8px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.opencode-chrome-warmup-failed-btn.primary{background:var(--oc-primary);color:#fff;box-shadow:var(--oc-shadow-primary)}.opencode-chrome-warmup-failed-btn.primary:hover:not(:disabled){background:var(--oc-primary-hover);transform:translateY(-1px);box-shadow:var(--oc-shadow-primary-hover)}.opencode-chrome-warmup-failed-btn.primary:active:not(:disabled){transform:translateY(0)}.opencode-chrome-warmup-failed-btn.primary:disabled{opacity:.6;cursor:not-allowed}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-opencode-assistant",
-  "version": "1.0.16",
+  "version": "1.0.18",
   "description": "Embed OpenCode Web UI in your Vite dev server for real-time code modification and preview",
   "type": "module",
   "main": "lib/index.js",
@@ -36,9 +36,9 @@
   "license": "MIT",
   "dependencies": {
     "unplugin-vue-inspector": "^2.4.0",
-    "@vite-plugin-opencode-assistant/opencode": "1.0.16",
-    "@vite-plugin-opencode-assistant/components": "1.0.16",
-    "@vite-plugin-opencode-assistant/shared": "1.0.16"
+    "@vite-plugin-opencode-assistant/opencode": "1.0.18",
+    "@vite-plugin-opencode-assistant/components": "1.0.18",
+    "@vite-plugin-opencode-assistant/shared": "1.0.18"
   },
   "peerDependencies": {
     "vite": ">=4.0.0"