vite-plugin-aipanel 1.2.19 → 1.2.21

package/lib/core/framework.cjs

@@ -0,0 +1,50 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var framework_exports = {};
+__export(framework_exports, {
+  detectViteFramework: () => detectViteFramework
+});
+module.exports = __toCommonJS(framework_exports);
+var import_core = require("@aipanel/core");
+const VUE_PLUGIN_NAME_PREFIX = "vite:vue";
+const REACT_PLUGIN_NAME_PREFIX = "vite:react";
+function collectPluginNames(plugins, names = []) {
+  for (const plugin of plugins) {
+    if (Array.isArray(plugin)) {
+      collectPluginNames(plugin, names);
+    } else if (plugin && typeof plugin === "object") {
+      const name = plugin.name;
+      if (typeof name === "string") names.push(name);
+    }
+  }
+  return names;
+}
+function detectViteFramework(config) {
+  const names = collectPluginNames(config.plugins ?? []);
+  if (names.some((name) => name.startsWith(VUE_PLUGIN_NAME_PREFIX))) {
+    return import_core.INSPECTOR_ADAPTER_IDS.vue;
+  }
+  if (names.some((name) => name.startsWith(REACT_PLUGIN_NAME_PREFIX))) {
+    return import_core.INSPECTOR_ADAPTER_IDS.react;
+  }
+  return null;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  detectViteFramework
+});

package/lib/core/framework.d.ts

@@ -0,0 +1,14 @@
+/**
+ * 构建期框架检测：从已解析的 Vite 插件列表推断项目框架。
+ * 依据官方插件命名约定（@vitejs/plugin-vue → "vite:vue*"，plugin-react / plugin-react-swc →
+ * "vite:react*"），用于门控 Vue DevTools 桥注入与各框架 inspector 集成；
+ * 标识复用 INSPECTOR_ADAPTER_IDS，与运行时适配器注册表对齐。
+ */
+import type { ResolvedConfig } from "vite";
+import { INSPECTOR_ADAPTER_IDS } from "@aipanel/core";
+export type ViteFramework = (typeof INSPECTOR_ADAPTER_IDS)[keyof typeof INSPECTOR_ADAPTER_IDS];
+/**
+ * 检测项目框架：vue / react 同时存在时以 vue 优先（与运行时适配器解析顺序一致）；
+ * 无法识别（solid、svelte、纯原生等）返回 null，调用方按保守策略处理。
+ */
+export declare function detectViteFramework(config: ResolvedConfig): ViteFramework | null;

package/lib/core/service.cjs

@@ -60,11 +60,11 @@ class AIPanelService {
     this.provider = provider;
   }
   sendTaskUpdate(task, data) {
-    this.currentTask = { task, ...data };
+    this.currentTask = { ...data, task };
     this.sseClients.forEach((client) => {
       try {
         client.write(
-          `data: ${JSON.stringify({ type: import_core.SSE_EVENT_TYPES.TASK_UPDATE, task, ...data })}
+          `data: ${JSON.stringify({ type: import_core.SSE_EVENT_TYPES.TASK_UPDATE, ...data, task })}
 
 `
         );
@@ -239,8 +239,8 @@ class AIPanelService {
       });
       if (warmupFailed) {
         this.sendTaskUpdate("chrome_mcp_failed", {
-          errorType: this.chromeMcpWarmupErrorType,
-          errorMessage: this.chromeMcpWarmupErrorMessage
+          errorType: this.chromeMcpWarmupErrorType ?? void 0,
+          errorMessage: this.chromeMcpWarmupErrorMessage ?? void 0
         });
       } else {
         this.sendTaskUpdate("ready");

package/lib/core/service.d.ts

@@ -1,6 +1,6 @@
 import type { ResultPromise } from "execa";
 import type http from "http";
-import type { PluginOptions, ProviderEvent, ServiceStartupTask, WebProvider } from "@aipanel/core";
+import type { PluginOptions, ProviderEvent, ServiceTaskState, WebProvider } from "@aipanel/core";
 import { ChromeMcpWarmupErrorType } from "@aipanel/core";
 import type { McpProxy } from "./mcp-proxy";
 export declare class AIPanelService {
@@ -17,10 +17,7 @@ export declare class AIPanelService {
     chromeMcpWarmupFailed: boolean;
     chromeMcpWarmupErrorType: ChromeMcpWarmupErrorType | null;
     chromeMcpWarmupErrorMessage: string | null;
-    currentTask: {
-        task: ServiceStartupTask;
-        data?: Record<string, unknown>;
-    } | null;
+    currentTask: ServiceTaskState | null;
     workspaceRoot: string | null;
     private mcp;
     private provider;

package/lib/endpoints/types.d.ts

@@ -1,4 +1,4 @@
-import type { ChatSession, PageContext, ProviderCapabilities, ProviderEvent, ServiceStartupTask } from "@aipanel/core";
+import type { ChatSession, PageContext, ProviderCapabilities, ProviderEvent, ServiceTaskState } from "@aipanel/core";
 import type http from "http";
 export interface EndpointContext {
     get webUrl(): string | null;
@@ -12,10 +12,7 @@ export interface EndpointContext {
     /** 清除选中元素（活跃 Tab） */
     clearSelectedElements(): void;
     get isServiceStarted(): boolean;
-    get currentTask(): {
-        task: ServiceStartupTask;
-        data?: Record<string, unknown>;
-    } | null;
+    get currentTask(): ServiceTaskState | null;
     get actualProxyPort(): number;
     get actualWebPort(): number;
     get serviceInstanceId(): string;

package/lib/index.cjs

@@ -32,16 +32,17 @@ __export(lib_exports, {
 module.exports = __toCommonJS(lib_exports);
 var import_crypto = __toESM(require("crypto"));
 var import_fs = __toESM(require("fs"));
-var import_vite = __toESM(require("unplugin-vue-inspector/vite"));
 var import_core = require("@aipanel/core");
 var import_node = require("@aipanel/core/node");
 var import_endpoints = require("./endpoints/index.cjs");
 var import_injector = require("./core/injector.cjs");
+var import_inspectors = require("./inspectors/index.cjs");
 var import_provider_loader = require("./core/provider-loader.cjs");
 var import_service = require("./core/service.cjs");
 var import_mcp_proxy = require("./core/mcp-proxy.cjs");
 var import_mcp_tools = require("./core/mcp-tools.cjs");
 var import_paths = require("./utils/paths.cjs");
+var import_framework = require("./core/framework.cjs");
 var import_node2 = require("@aipanel/core/node");
 const DEVTOOLS_BRIDGE_IMPORTEE = "virtual:aipanel-vue-devtools-bridge";
 const DEVTOOLS_BRIDGE_QUERY = "aipanel_vue_devtools_bridge";
@@ -89,13 +90,7 @@ const SILENT_CONTEXT_SCRIPT = `<script>
 </script>`;
 function aipanelPlugin(options = {}) {
   const plugins = [];
-  plugins.push(
-    ...(0, import_vite.default)({
-      enabled: false,
-      toggleButtonVisibility: "never",
-      toggleComboKey: false
-    })
-  );
+  plugins.push(...(0, import_inspectors.createInspectorPlugins)());
   plugins.push(createAIPanelPlugin(options));
   return plugins;
 }
@@ -111,6 +106,7 @@ function createAIPanelPlugin(options = {}) {
   let actualProxyPort = config.proxyPort ?? import_core.DEFAULT_PROXY_PORT;
   let projectRoot = "";
   let vueDevtoolsApiUrl = "";
+  let isVueProject = true;
   let viteServerHost = "localhost";
   const pageContext = { url: "", title: "" };
   const DEFAULT_TAB = "default";
@@ -157,6 +153,9 @@ function createAIPanelPlugin(options = {}) {
       if (!config.enabled) return false;
       return env.command === "serve" && process.env.NODE_ENV !== "test";
     },
+    configResolved(resolvedConfig) {
+      isVueProject = (0, import_framework.detectViteFramework)(resolvedConfig) !== import_core.INSPECTOR_ADAPTER_IDS.react;
+    },
     async configureServer(server) {
       const timer = log.timer("configureServer");
       projectRoot = server.config.root;
@@ -249,7 +248,7 @@ function createAIPanelPlugin(options = {}) {
           });
           service.currentTask = {
             task: "provider_not_installed",
-            data: { error: e instanceof Error ? e.message : String(e) }
+            errorMessage: e instanceof Error ? e.message : String(e)
           };
           timer.end("\u274C Provider \u52A0\u8F7D\u5931\u8D25");
           return;
@@ -309,7 +308,8 @@ function createAIPanelPlugin(options = {}) {
             logsApiUrl,
             viteOrigin,
             mcpProxy,
-            vueDevtoolsApiUrl
+            // React 项目不下发：provider 侧不注册 vue-devtools_* 工具，避免模型调用必失败的工具
+            isVueProject ? vueDevtoolsApiUrl : void 0
           );
         } catch (e) {
           log.error("Failed to start services", { error: e });
@@ -345,7 +345,7 @@ function createAIPanelPlugin(options = {}) {
     },
     transformIndexHtml(html) {
       const timer = log.timer("transformIndexHtml");
-      const tags = [
+      const tags = isVueProject ? [
         {
           tag: "script",
           injectTo: "head-prepend",
@@ -354,7 +354,7 @@ function createAIPanelPlugin(options = {}) {
             src: `/@id/${DEVTOOLS_BRIDGE_IMPORTEE}`
           }
         }
-      ];
+      ] : [];
       const titleInject = `<script>
         (function () {
           var KEY = "${import_core.SESSION_ID_KEY}";
@@ -364,7 +364,7 @@ function createAIPanelPlugin(options = {}) {
         })();
       </script>`;
       if (config.mcpOnly) {
-        timer.end("\u2713 mcp-only (skip widget bubble, keep vue-devtools bridge + context report)");
+        timer.end("\u2713 mcp-only (skip widget bubble, keep context report)");
         return {
           html: html.replace("</body>", `${titleInject}
 ${SILENT_CONTEXT_SCRIPT}</body>`),

package/lib/inspectors/index.cjs

@@ -0,0 +1,35 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var inspectors_exports = {};
+__export(inspectors_exports, {
+  createInspectorPlugins: () => createInspectorPlugins
+});
+module.exports = __toCommonJS(inspectors_exports);
+var import_react = require("./react.cjs");
+var import_vue = require("./vue.cjs");
+const integrations = [
+  import_vue.vueInspectorIntegration,
+  import_react.reactInspectorIntegration
+];
+function createInspectorPlugins() {
+  return integrations.flatMap((integration) => integration.plugins());
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createInspectorPlugins
+});

package/lib/inspectors/index.d.ts

@@ -0,0 +1,3 @@
+import type { Plugin } from "vite";
+/** 汇总各框架集成需要注入的构建期插件 */
+export declare function createInspectorPlugins(): Plugin[];

package/lib/inspectors/react.cjs

@@ -0,0 +1,62 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var react_exports = {};
+__export(react_exports, {
+  reactInspectorIntegration: () => reactInspectorIntegration
+});
+module.exports = __toCommonJS(react_exports);
+var import_core = require("@code-inspector/core");
+var import_core2 = require("@aipanel/core");
+var import_framework = require("../core/framework.cjs");
+const JSX_FILE_PATTERN = /\.(jsx|tsx)$/;
+const reactInspectorIntegration = {
+  id: import_core2.INSPECTOR_ADAPTER_IDS.react,
+  plugins: () => {
+    let vueProject = false;
+    return [
+      {
+        name: "aipanel:react-inspector",
+        enforce: "pre",
+        apply: "serve",
+        configResolved(config) {
+          vueProject = (0, import_framework.detectViteFramework)(config) === import_core2.INSPECTOR_ADAPTER_IDS.vue;
+        },
+        async transform(code, id) {
+          if (vueProject) return null;
+          const [filePath] = id.split("?");
+          if (!filePath || !JSX_FILE_PATTERN.test(filePath) || filePath.includes("node_modules") || filePath.startsWith("\0")) {
+            return null;
+          }
+          if (!code.includes("<")) return null;
+          const result = await (0, import_core.transformCode)({
+            content: code,
+            filePath,
+            fileType: "jsx",
+            escapeTags: import_core.CodeInspectorEscapeTags,
+            pathType: "relative"
+          });
+          return result === code ? null : { code: result };
+        }
+      }
+    ];
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  reactInspectorIntegration
+});

package/lib/inspectors/react.d.ts

@@ -0,0 +1,12 @@
+import type { InspectorIntegration } from "./types";
+/**
+ * React 集成：复用 code-inspector-plugin 的官方 transformCode API，在 dev 阶段为
+ * 项目内 jsx/tsx 注入 data-insp-path 源码坐标标记（pathType: relative 以 git 仓库根
+ * 为基准的相对路径，非 git 仓库时由其内部回退绝对路径）。
+ *
+ * enforce: pre 保证先于 JSX 擦除执行（@vitejs/plugin-react 与 plugin-react-swc 均适用）；
+ * 仅 serve 生效，生产构建零影响。文件头部 code-inspector-disable/ignore 注释可整文件跳过。
+ * Vue 项目（含 vue-jsx）的 jsx/tsx 是 Vue JSX，跳过注入；未识别框架（纯 esbuild JSX 的
+ * React 等）保守放行。
+ */
+export declare const reactInspectorIntegration: InspectorIntegration;

package/lib/inspectors/types.cjs

@@ -0,0 +1,15 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);

package/lib/inspectors/types.d.ts

@@ -0,0 +1,11 @@
+import type { Plugin } from "vite";
+import type { InspectorAdapterId } from "@aipanel/core";
+/**
+ * 框架侧 Inspector 集成：构建期注入「点击元素 → 打开源码」运行时。
+ * 与客户端 @aipanel/core 的适配器按同一 id 对齐（INSPECTOR_ADAPTER_IDS）。
+ */
+export interface InspectorIntegration {
+    readonly id: InspectorAdapterId;
+    /** 该框架需要注入的构建期插件 */
+    plugins(): Plugin[];
+}

package/lib/inspectors/vue.cjs

@@ -0,0 +1,46 @@
+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 vue_exports = {};
+__export(vue_exports, {
+  vueInspectorIntegration: () => vueInspectorIntegration
+});
+module.exports = __toCommonJS(vue_exports);
+var import_vite = __toESM(require("unplugin-vue-inspector/vite"));
+var import_core = require("@aipanel/core");
+const vueInspectorIntegration = {
+  id: import_core.INSPECTOR_ADAPTER_IDS.vue,
+  plugins: () => (0, import_vite.default)({
+    enabled: false,
+    toggleButtonVisibility: "never",
+    toggleComboKey: false
+  })
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  vueInspectorIntegration
+});

package/lib/inspectors/vue.d.ts

@@ -0,0 +1,7 @@
+import type { InspectorIntegration } from "./types";
+/**
+ * Vue 集成：注入 unplugin-vue-inspector 运行时。
+ * 常驻但默认不启用（enabled: false），由挂件进入选择模式时开启；
+ * 同时隐藏其自带的切换按钮与快捷键，避免与挂件交互冲突。
+ */
+export declare const vueInspectorIntegration: InspectorIntegration;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-aipanel",
-  "version": "1.2.19",
+  "version": "1.2.21",
   "description": "Embed OpenCode Web UI in your Vite dev server for real-time code modification and preview",
   "type": "module",
   "main": "lib/index.cjs",
@@ -35,19 +35,20 @@
   "author": "",
   "license": "MIT",
   "dependencies": {
-    "picomatch": "^4.0.2",
+    "@code-inspector/core": "^2.0.9",
     "@vue/devtools-kit": "^8.0.0",
     "@vue/language-server": "^3.3.7",
     "chrome-devtools-mcp": "^1.9.0",
     "execa": "^9.6.1",
+    "picomatch": "^4.0.2",
     "typescript-language-server": "^5.3.0",
     "unplugin-vue-inspector": "^3.0.0",
-    "@aipanel/provider-opencode": "1.2.19",
-    "@aipanel/core": "1.2.19"
+    "@aipanel/core": "1.2.21",
+    "@aipanel/provider-opencode": "1.2.21"
   },
   "peerDependencies": {
     "vite": ">=5.0.0",
-    "@aipanel/provider-deepseek": "1.2.19"
+    "@aipanel/provider-deepseek": "1.2.21"
   },
   "peerDependenciesMeta": {
     "@aipanel/provider-deepseek": {
@@ -57,11 +58,12 @@
   "devDependencies": {
     "@types/picomatch": "^4.0.0",
     "sharp": "^0.34.5",
-    "@aipanel/client": "1.2.19"
+    "@aipanel/client": "1.2.21"
   },
   "scripts": {
     "build": "node scripts/sync-official-meta.mjs && pagoda-cli build && vite build -c vite.client.config.ts",
     "typecheck": "tsc -p tsconfig.declaration.json --noEmit",
-    "test": "vitest run"
+    "test": "vitest run",
+    "test:coverage": "vitest run --coverage"
   }
 }