fix: robust version determination in release workflow

- Convert SVG to PNG using canvas before uploading
- 2x scale for higher quality output
- Fix Word export compatibility issue (SVG not supported by python-docx)
- Update version to 1.4.1
- Update README.md and README_CN.md with new feature

.agent/workflows/plugin-development.md

@@ -25,6 +25,10 @@ Every plugin **MUST** have bilingual versions for both code and documentation:
 - **Valves**: Use `pydantic` for configuration.
 - **Database**: Re-use `open_webui.internal.db` shared connection.
 - **User Context**: Use `_get_user_context` helper method.
+- **Chat API**: For message updates, follow the "OpenWebUI Chat API 更新规范" in `.github/copilot-instructions.md`.
+  - Use Event API for immediate UI updates
+  - Use Chat Persistence API for database storage
+  - Always update both `messages[]` and `history.messages`
 
 ### Commit Messages
 - **Language**: **English ONLY**. Do not use Chinese in commit messages.
@@ -35,8 +39,8 @@ Every plugin **MUST** have bilingual versions for both code and documentation:
 When adding or updating a plugin, you **MUST** update the following documentation files to maintain consistency:
 
 ### Plugin Directory
-- `README.md`: Update version, description, and usage. **Explicitly describe new features.**
-- `README_CN.md`: Update version, description, and usage. **Explicitly describe new features.**
+- `README.md`: Update version, description, and usage. **Explicitly describe new features in a prominent position at the beginning.**
+- `README_CN.md`: Update version, description, and usage. **Explicitly describe new features in a prominent position at the beginning.**
 
 ### Global Documentation (`docs/`)
 - **Index Pages**:
@@ -78,6 +82,11 @@ Reference: `.github/workflows/release.yml`
     - Generates release notes based on changes.
     - Creates a GitHub Release tag (e.g., `v2024.01.01-1`).
     - Uploads individual `.py` files of **changed plugins only** as assets.
+4.  **Market Publishing**:
+    - Workflow: `.github/workflows/publish_plugin.yml`
+    - Trigger: Release published.
+    - Action: Automatically updates the plugin code and metadata on OpenWebUI.com using `scripts/publish_plugin.py`.
+    - Requirement: `OPENWEBUI_API_KEY` secret must be set.
 
 ### Pull Request Check
 - Workflow: `.github/workflows/plugin-version-check.yml`

.github/copilot-instructions.md

@@ -31,15 +31,75 @@ plugins/actions/export_to_docx/
 - `README.md` - English documentation
 - `README_CN.md` - 中文文档
 
-README 文件应包含以下内容：
-- 功能描述 / Feature description
-- 配置参数及默认值 / Configuration parameters with defaults
-- 安装和设置说明 / Installation and setup instructions
-- 使用示例 / Usage examples
-- 故障排除指南 / Troubleshooting guide
-- 故障排除指南 / Troubleshooting guide
-- 版本和作者信息 / Version and author information
-- **新增功能 / New Features**: 如果是更新现有插件，必须明确列出并描述新增功能（发布到官方市场的重要要求）。/ If updating an existing plugin, explicitly list and describe new features (Critical for official market release).
+### README 结构规范 (README Structure Standard)
+
+所有插件 README 必须遵循以下统一结构顺序：
+
+1.  **标题 (Title)**: 插件名称，带 Emoji 图标
+2.  **元数据 (Metadata)**: 作者、版本、项目链接 (一行显示)
+    - 格式: `**Author:** [Fu-Jie](https://github.com/Fu-Jie) | **Version:** x.x.x | **Project:** [Awesome OpenWebUI](https://github.com/Fu-Jie/awesome-openwebui)`
+    - **注意**: Author 和 Project 为固定值，仅需更新 Version 版本号
+3.  **描述 (Description)**: 一句话功能介绍
+4.  **最新更新 (What's New)**: **必须**放在描述之后，显著展示最新版本的变更点
+5.  **核心特性 (Key Features)**: 使用 Emoji + 粗体标题 + 描述格式
+6.  **使用方法 (How to Use)**: 按步骤说明
+7.  **配置参数 (Configuration/Valves)**: 使用表格格式，包含参数名、默认值、描述
+8.  **其他 (Others)**: 支持的模板类型、语法示例、故障排除等
+
+完整示例 (Full Example):
+
+```markdown
+# 📊 Smart Plugin
+
+**Author:** [Fu-Jie](https://github.com/Fu-Jie) | **Version:** 1.0.0 | **Project:** [Awesome OpenWebUI](https://github.com/Fu-Jie/awesome-openwebui)
+
+A one-sentence description of this plugin.
+
+## 🔥 What's New in v1.0.0
+
+- ✨ **Feature Name**: Brief description of the feature.
+- 🔧 **Configuration Change**: What changed in settings.
+- 🐛 **Bug Fix**: What was fixed.
+
+## ✨ Key Features
+
+- 🚀 **Feature A**: Description of feature A.
+- 🎨 **Feature B**: Description of feature B.
+- 📥 **Feature C**: Description of feature C.
+
+## 🚀 How to Use
+
+1. **Install**: Search for "Plugin Name" in the Open WebUI Community and install.
+2. **Trigger**: Enter your text in the chat, then click the **Action Button**.
+3. **Result**: View the generated result.
+
+## ⚙️ Configuration (Valves)
+
+| Parameter | Default | Description |
+| :--- | :--- | :--- |
+| **Show Status (SHOW_STATUS)** | `True` | Whether to show status updates. |
+| **Model ID (MODEL_ID)** | `Empty` | LLM model for processing. |
+| **Output Mode (OUTPUT_MODE)** | `image` | `image` for static, `html` for interactive. |
+
+## 🛠️ Supported Types (Optional)
+
+| Category | Type Name | Use Case |
+| :--- | :--- | :--- |
+| **Category A** | `type-a`, `type-b` | Use case description |
+
+## 📝 Advanced Example (Optional)
+
+\`\`\`syntax
+example code or syntax here
+\`\`\`
+```
+
+### 文档内容要求 (Content Requirements)
+
+- **新增功能**: 必须在 "What's New" 章节中明确列出，使用 Emoji + 粗体标题格式。
+- **双语**: 必须提供 `README.md` (英文) 和 `README_CN.md` (中文)。
+- **表格对齐**: 配置参数表格使用左对齐 `:---`。
+- **Emoji 规范**: 标题使用合适的 Emoji 增强可读性。
 
 ### 官方文档 (Official Documentation)
 
@@ -93,33 +153,7 @@ icon_url: data:image/svg+xml;base64,PHN2ZyB4bWxucz0i...（完整的 Base64 编
 
 ---
 
-## 👤 作者和许可证信息 (Author and License)
-
-所有 README 文件和主要文档必须包含以下统一信息：
-
-```markdown
-## Author
-
-Fu-Jie  
-GitHub: [Fu-Jie/awesome-openwebui](https://github.com/Fu-Jie/awesome-openwebui)
-
-## License
-
-MIT License
-```
-
-中文版本：
-
-```markdown
-## 作者
-
-Fu-Jie  
-GitHub: [Fu-Jie/awesome-openwebui](https://github.com/Fu-Jie/awesome-openwebui)
-
-## 许可证
-
-MIT License
-```
+(Author info is now part of the top metadata section, see "README Structure Standard" above)
 
 ---
 
@@ -507,7 +541,164 @@ Base = declarative_base()
 
 ---
 
-## 🔧 代码规范 (Code Style)
+## 📂 文件存储访问规范 (File Storage Access)
+
+OpenWebUI 支持多种文件存储后端（本地磁盘、S3/MinIO 对象存储等）。插件在访问用户上传的文件或生成的图片时，必须实现多级回退机制以兼容所有存储配置。
+
+### 存储类型检测 (Storage Type Detection)
+
+通过 `Files.get_file_by_id()` 获取的文件对象，其 `path` 属性决定了存储位置：
+
+| Path 格式 | 存储类型 | 访问方式 |
+|-----------|----------|----------|
+| `s3://bucket/key` | S3/MinIO 对象存储 | boto3 直连或 API 回调 |
+| `/app/backend/data/...` | Docker 卷存储 | 本地文件系统读取 |
+| `./uploads/...` | 本地相对路径 | 本地文件系统读取 |
+| `gs://bucket/key` | Google Cloud Storage | API 回调 |
+
+### 多级回退机制 (Multi-level Fallback)
+
+推荐实现以下优先级的文件获取策略：
+
+```python
+def _get_file_content(self, file_id: str, max_bytes: int) -> Optional[bytes]:
+    """获取文件内容，支持多种存储后端"""
+    file_obj = Files.get_file_by_id(file_id)
+    if not file_obj:
+        return None
+
+    # 1️⃣ 数据库直接存储 (小文件)
+    data_field = getattr(file_obj, "data", None)
+    if isinstance(data_field, dict):
+        if "bytes" in data_field:
+            return data_field["bytes"]
+        if "base64" in data_field:
+            return base64.b64decode(data_field["base64"])
+
+    # 2️⃣ S3 直连 (对象存储 - 最快)
+    s3_path = getattr(file_obj, "path", None)
+    if isinstance(s3_path, str) and s3_path.startswith("s3://"):
+        data = self._read_from_s3(s3_path, max_bytes)
+        if data:
+            return data
+
+    # 3️⃣ 本地文件系统 (磁盘存储)
+    for attr in ("path", "file_path"):
+        path = getattr(file_obj, attr, None)
+        if path and not path.startswith(("s3://", "gs://", "http")):
+            # 尝试多个常见路径
+            for base in ["", "./data", "/app/backend/data"]:
+                full_path = Path(base) / path if base else Path(path)
+                if full_path.exists():
+                    return full_path.read_bytes()[:max_bytes]
+
+    # 4️⃣ 公共 URL 下载
+    url = getattr(file_obj, "url", None)
+    if url and url.startswith("http"):
+        return self._download_from_url(url, max_bytes)
+
+    # 5️⃣ 内部 API 回调 (通用兜底方案)
+    if self._api_base_url:
+        api_url = f"{self._api_base_url}/api/v1/files/{file_id}/content"
+        return self._download_from_api(api_url, self._api_token, max_bytes)
+
+    return None
+```
+
+### S3 直连实现 (S3 Direct Access)
+
+当检测到 `s3://` 路径时，使用 `boto3` 直接访问对象存储，读取以下环境变量：
+
+| 环境变量 | 说明 | 示例 |
+|----------|------|------|
+| `S3_ENDPOINT_URL` | S3 兼容服务端点 | `https://minio.example.com` |
+| `S3_ACCESS_KEY_ID` | 访问密钥 ID | `minioadmin` |
+| `S3_SECRET_ACCESS_KEY` | 访问密钥 | `minioadmin` |
+| `S3_ADDRESSING_STYLE` | 寻址样式 | `auto`, `path`, `virtual` |
+
+```python
+# S3 直连示例
+import boto3
+from botocore.config import Config as BotoConfig
+import os
+
+def _read_from_s3(self, s3_path: str, max_bytes: int) -> Optional[bytes]:
+    """从 S3 直接读取文件 (比 API 回调更快)"""
+    if not s3_path.startswith("s3://"):
+        return None
+
+    # 解析 s3://bucket/key
+    parts = s3_path[5:].split("/", 1)
+    bucket, key = parts[0], parts[1]
+
+    # 从环境变量读取配置
+    endpoint = os.environ.get("S3_ENDPOINT_URL")
+    access_key = os.environ.get("S3_ACCESS_KEY_ID")
+    secret_key = os.environ.get("S3_SECRET_ACCESS_KEY")
+    
+    if not all([endpoint, access_key, secret_key]):
+        return None  # 回退到 API 方式
+
+    s3_client = boto3.client(
+        "s3",
+        endpoint_url=endpoint,
+        aws_access_key_id=access_key,
+        aws_secret_access_key=secret_key,
+        config=BotoConfig(s3={"addressing_style": os.environ.get("S3_ADDRESSING_STYLE", "auto")})
+    )
+    
+    response = s3_client.get_object(Bucket=bucket, Key=key)
+    return response["Body"].read(max_bytes)
+```
+
+### API 回调实现 (API Fallback)
+
+当其他方式失败时，通过 OpenWebUI 内部 API 获取文件：
+
+```python
+def _download_from_api(self, api_url: str, token: str, max_bytes: int) -> Optional[bytes]:
+    """通过 OpenWebUI API 获取文件内容"""
+    import urllib.request
+    
+    headers = {"User-Agent": "OpenWebUI-Plugin"}
+    if token:
+        headers["Authorization"] = token
+
+    req = urllib.request.Request(api_url, headers=headers)
+    with urllib.request.urlopen(req, timeout=15) as response:
+        if 200 <= response.status < 300:
+            return response.read(max_bytes)
+    return None
+```
+
+### 获取 API 上下文 (API Context Extraction)
+
+在 `action()` 方法中捕获请求上下文，用于 API 回调：
+
+```python
+async def action(self, body: dict, __request__=None, ...):
+    # 从请求对象获取 API 凭证
+    if __request__:
+        self._api_token = __request__.headers.get("Authorization")
+        self._api_base_url = str(__request__.base_url).rstrip("/")
+    else:
+        # 从环境变量获取端口作为备用
+        port = os.environ.get("PORT") or "8080"
+        self._api_base_url = f"http://localhost:{port}"
+        self._api_token = None
+```
+
+### 性能对比 (Performance Comparison)
+
+| 方式 | 网络跳数 | 适用场景 |
+|------|----------|----------|
+| S3 直连 | 1 (插件 → S3) | 对象存储，最快 |
+| 本地文件 | 0 | 磁盘存储，最快 |
+| API 回调 | 2 (插件 → OpenWebUI → S3/磁盘) | 通用兜底 |
+
+### 参考实现 (Reference Implementation)
+
+- `plugins/actions/export_to_docx/export_to_word.py` - `_image_bytes_from_owui_file_id` 方法
 
 ### Python 规范
 
@@ -798,10 +989,371 @@ For iframe plugins to access parent document theme information, users need to co
 - [ ] 使用 logging 而非 print
 - [ ] 测试双语界面
 - [ ] **一致性检查 (Consistency Check)**:
-    - [ ] 更新 `README.md` 插件列表
-    - [ ] 更新 `README_CN.md` 插件列表
-    - [ ] 更新/创建 `docs/` 下的对应文档
-    - [ ] 确保文档版本号与代码一致
+
+---
+
+## 🚀 高级开发模式 (Advanced Development Patterns)
+
+### 混合服务端-客户端生成 (Hybrid Server-Client Generation)
+
+对于需要复杂前端渲染（如 Mermaid 图表、ECharts）但最终生成文件（如 DOCX、PDF）的场景，建议采用混合模式：
+
+1.  **服务端 (Python)**：
+    *   处理文本解析、Markdown 转换、文档结构构建。
+    *   为复杂组件生成**占位符**（如带有特定 ID 或元数据的图片/文本块）。
+    *   将半成品文件（如 Base64 编码的 ZIP/DOCX）发送给前端。
+
+2.  **客户端 (JavaScript)**：
+    *   在浏览器中加载半成品文件（使用 JSZip 等库）。
+    *   利用浏览器能力渲染复杂组件（如 `mermaid.render`）。
+    *   将渲染结果（SVG/PNG）回填到占位符位置。
+    *   触发最终文件的下载。
+
+**优势**：
+*   无需在服务端安装 Headless Browser（如 Puppeteer），降低部署复杂度。
+*   利用用户浏览器的计算能力。
+*   支持动态、交互式内容的静态化导出。
+
+### 原生 Word 公式支持 (Native Word Math Support)
+
+对于需要生成高质量数学公式的 Word 文档，推荐使用 `latex2mathml` + `mathml2omml` 组合：
+
+1.  **LaTeX -> MathML**: 使用 `latex2mathml` 将 LaTeX 字符串转换为标准 MathML。
+2.  **MathML -> OMML**: 使用 `mathml2omml` 将 MathML 转换为 Office Math Markup Language (OMML)。
+3.  **插入 Word**: 将 OMML XML 插入到 `python-docx` 的段落中。
+
+```python
+# 示例代码
+from latex2mathml.converter import convert as latex2mathml
+from mathml2omml import convert as mathml2omml
+
+def add_math(paragraph, latex_str):
+    mathml = latex2mathml(latex_str)
+    omml = mathml2omml(mathml)
+    # ... 插入 OMML 到 paragraph._element ...
+```
+
+### JS 渲染并嵌入 Markdown (JS Render to Markdown)
+
+对于需要复杂前端渲染（如 AntV 图表、Mermaid 图表、ECharts）但希望结果**持久化为纯 Markdown 格式**的场景，推荐使用 Data URL 嵌入模式：
+
+#### 工作流程
+
+```
+┌─────────────────────────────────────────────────────────────┐
+│                    Plugin Workflow                          │
+├─────────────────────────────────────────────────────────────┤
+│  1. Python Action                                            │
+│     ├── 分析消息内容                                          │
+│     ├── 调用 LLM 生成结构化数据（可选）                        │
+│     └── 通过 __event_call__ 发送 JS 代码到前端                │
+├─────────────────────────────────────────────────────────────┤
+│  2. Browser JS (via __event_call__)                          │
+│     ├── 动态加载可视化库（如 AntV、Mermaid）                   │
+│     ├── 离屏渲染 SVG/Canvas                                   │
+│     ├── 使用 toDataURL() 导出 Base64 Data URL                 │
+│     └── 通过 REST API 更新消息内容                            │
+├─────────────────────────────────────────────────────────────┤
+│  3. Markdown 渲染                                            │
+│     └── 显示 ![描述](data:image/svg+xml;base64,...)          │
+└─────────────────────────────────────────────────────────────┘
+```
+
+#### 核心实现代码
+
+**Python 端（发送 JS 执行）：**
+
+```python
+async def action(self, body, __event_call__, __metadata__, ...):
+    chat_id = self._extract_chat_id(body, __metadata__)
+    message_id = self._extract_message_id(body, __metadata__)
+    
+    # 生成 JS 代码
+    js_code = self._generate_js_code(
+        chat_id=chat_id,
+        message_id=message_id,
+        data=processed_data,  # 可视化所需数据
+    )
+    
+    # 执行 JS
+    if __event_call__:
+        await __event_call__({
+            "type": "execute",
+            "data": {"code": js_code}
+        })
+```
+
+**JavaScript 端（渲染并回写）：**
+
+```javascript
+(async function() {
+    // 1. 动态加载可视化库
+    if (typeof VisualizationLib === 'undefined') {
+        await new Promise((resolve, reject) => {
+            const script = document.createElement('script');
+            script.src = 'https://cdn.example.com/lib.min.js';
+            script.onload = resolve;
+            script.onerror = reject;
+            document.head.appendChild(script);
+        });
+    }
+    
+    // 2. 创建离屏容器
+    const container = document.createElement('div');
+    container.style.cssText = 'position:absolute;left:-9999px;';
+    document.body.appendChild(container);
+    
+    // 3. 渲染可视化
+    const instance = new VisualizationLib({ container, ... });
+    instance.render(data);
+    
+    // 4. 导出为 Data URL
+    const dataUrl = await instance.toDataURL({ type: 'svg', embedResources: true });
+    // 或手动转换 SVG:
+    // const svgData = new XMLSerializer().serializeToString(svgElement);
+    // const base64 = btoa(unescape(encodeURIComponent(svgData)));
+    // const dataUrl = "data:image/svg+xml;base64," + base64;
+    
+    // 5. 清理
+    instance.destroy();
+    document.body.removeChild(container);
+    
+    // 6. 生成 Markdown 图片
+    const markdownImage = `![描述](${dataUrl})`;
+    
+    // 7. 通过 API 更新消息
+    const token = localStorage.getItem("token");
+    await fetch(`/api/v1/chats/${chatId}/messages/${messageId}/event`, {
+        method: "POST",
+        headers: {
+            "Content-Type": "application/json",
+            "Authorization": `Bearer ${token}`
+        },
+        body: JSON.stringify({
+            type: "chat:message",
+            data: { content: originalContent + "\n\n" + markdownImage }
+        })
+    });
+})();
+```
+
+#### 优势
+
+- **纯 Markdown 输出**：结果是标准的 Markdown 图片语法，无需 HTML 代码块
+- **高效存储**：图片上传至 `/api/v1/files`，避免 Base64 字符串膨胀聊天记录
+- **持久化**：通过 API 回写，消息重新加载后图片仍然存在
+- **跨平台**：任何支持 Markdown 图片的客户端都能显示
+- **无服务端渲染依赖**：利用用户浏览器的渲染能力
+
+#### 与 HTML 注入模式对比
+
+| 特性 | HTML 注入 (`\`\`\`html`) | JS 渲染 + Markdown 图片 |
+|------|-------------------------|------------------------|
+| 输出格式 | HTML 代码块 | Markdown 图片 |
+| 交互性 | ✅ 支持按钮、动画 | ❌ 静态图片 |
+| 外部依赖 | 需要加载 JS 库 | 依赖 `/api/v1/files` 存储 |
+| 持久化 | 依赖浏览器渲染 | ✅ 永久可见 |
+| 文件导出 | 需特殊处理 | ✅ 直接导出 |
+| 适用场景 | 交互式内容 | 信息图、图表快照 |
+
+#### 参考实现
+
+- `plugins/actions/js-render-poc/infographic_markdown.py` - AntV Infographic 生成并嵌入
+- `plugins/actions/js-render-poc/js_render_poc.py` - 基础概念验证
+
+### OpenWebUI Chat API 更新规范 (Chat API Update Specification)
+
+当插件需要修改消息内容并持久化到数据库时，必须遵循 OpenWebUI 的 Backend-Controlled API 流程。
+
+When a plugin needs to modify message content and persist it to the database, follow OpenWebUI's Backend-Controlled API flow.
+
+#### 核心概念 (Core Concepts)
+
+1. **Event API** (`/api/v1/chats/{chatId}/messages/{messageId}/event`)
+   - 用于**即时更新前端显示**，用户无需刷新页面
+   - 是可选的，部分版本可能不支持
+   - 仅影响当前会话的 UI，不持久化
+
+2. **Chat Persistence API** (`/api/v1/chats/{chatId}`)
+   - 用于**持久化到数据库**，确保刷新页面后数据仍存在
+   - 必须同时更新 `messages[]` 数组和 `history.messages` 对象
+   - 是消息持久化的唯一可靠方式
+
+#### 数据结构 (Data Structure)
+
+OpenWebUI 的 Chat 对象包含两个关键位置存储消息内容：
+
+```javascript
+{
+  "chat": {
+    "id": "chat-uuid",
+    "title": "Chat Title",
+    "messages": [                              // 1️⃣ 消息数组
+      { "id": "msg-1", "role": "user", "content": "..." },
+      { "id": "msg-2", "role": "assistant", "content": "..." }
+    ],
+    "history": {
+      "current_id": "msg-2",
+      "messages": {                            // 2️⃣ 消息索引对象
+        "msg-1": { "id": "msg-1", "role": "user", "content": "..." },
+        "msg-2": { "id": "msg-2", "role": "assistant", "content": "..." }
+      }
+    }
+  }
+}
+```
+
+> **重要**：修改消息时，**必须同时更新两个位置**，否则可能导致数据不一致。
+
+#### 标准实现流程 (Standard Implementation)
+
+```javascript
+(async function() {
+    const chatId = "{chat_id}";
+    const messageId = "{message_id}";
+    const token = localStorage.getItem("token");
+    
+    // 1️⃣ 获取当前 Chat 数据
+    const getResponse = await fetch(`/api/v1/chats/${chatId}`, {
+        method: "GET",
+        headers: { "Authorization": `Bearer ${token}` }
+    });
+    const chatData = await getResponse.json();
+    
+    // 2️⃣ 使用 map 遍历 messages，只修改目标消息
+    let newContent = "";
+    const updatedMessages = chatData.chat.messages.map(m => {
+        if (m.id === messageId) {
+            const originalContent = m.content || "";
+            newContent = originalContent + "\n\n" + newMarkdown;
+            
+            // 3️⃣ 同时更新 history.messages 中对应的消息
+            if (chatData.chat.history && chatData.chat.history.messages) {
+                if (chatData.chat.history.messages[messageId]) {
+                    chatData.chat.history.messages[messageId].content = newContent;
+                }
+            }
+            
+            // 4️⃣ 保留消息的其他属性，只修改 content
+            return { ...m, content: newContent };
+        }
+        return m;  // 其他消息原样返回
+    });
+    
+    // 5️⃣ 通过 Event API 即时更新前端（可选）
+    try {
+        await fetch(`/api/v1/chats/${chatId}/messages/${messageId}/event`, {
+            method: "POST",
+            headers: {
+                "Content-Type": "application/json",
+                "Authorization": `Bearer ${token}`
+            },
+            body: JSON.stringify({
+                type: "chat:message",
+                data: { content: newContent }
+            })
+        });
+    } catch (e) {
+        // Event API 是可选的，继续执行持久化
+        console.log("Event API not available, continuing...");
+    }
+    
+    // 6️⃣ 持久化到数据库（必须）
+    const updatePayload = {
+        chat: {
+            ...chatData.chat,      // 保留所有原有属性
+            messages: updatedMessages
+            // history 已在上面原地修改
+        }
+    };
+    
+    await fetch(`/api/v1/chats/${chatId}`, {
+        method: "POST",
+        headers: {
+            "Content-Type": "application/json",
+            "Authorization": `Bearer ${token}`
+        },
+        body: JSON.stringify(updatePayload)
+    });
+})();
+```
+
+#### 最佳实践 (Best Practices)
+
+1. **保留原有结构**：使用展开运算符 `...chatData.chat` 和 `...m` 确保不丢失任何原有属性
+2. **双位置更新**：必须同时更新 `messages[]` 和 `history.messages[id]`
+3. **错误处理**：Event API 调用应包裹在 try-catch 中，失败时继续持久化
+4. **重试机制**：对持久化 API 实现重试逻辑，提高可靠性
+
+```javascript
+// 带重试的请求函数
+const fetchWithRetry = async (url, options, retries = 3) => {
+    for (let i = 0; i < retries; i++) {
+        try {
+            const response = await fetch(url, options);
+            if (response.ok) return response;
+            if (i < retries - 1) {
+                await new Promise(r => setTimeout(r, 1000 * (i + 1)));  // 指数退避
+            }
+        } catch (e) {
+            if (i === retries - 1) throw e;
+            await new Promise(r => setTimeout(r, 1000 * (i + 1)));
+        }
+    }
+    return null;
+};
+```
+
+5. **禁止使用的 API**：不要使用 `/api/v1/chats/{chatId}/share` 作为持久化备用方案，该 API 用于分享功能，不是更新功能
+
+#### 提取 Chat ID 和 Message ID (Extracting IDs)
+
+```python
+def _extract_chat_id(self, body: dict, metadata: Optional[dict]) -> str:
+    """从 body 或 metadata 中提取 chat_id"""
+    if isinstance(body, dict):
+        chat_id = body.get("chat_id")
+        if isinstance(chat_id, str) and chat_id.strip():
+            return chat_id.strip()
+        
+        body_metadata = body.get("metadata", {})
+        if isinstance(body_metadata, dict):
+            chat_id = body_metadata.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+    
+    if isinstance(metadata, dict):
+        chat_id = metadata.get("chat_id")
+        if isinstance(chat_id, str) and chat_id.strip():
+            return chat_id.strip()
+    
+    return ""
+
+def _extract_message_id(self, body: dict, metadata: Optional[dict]) -> str:
+    """从 body 或 metadata 中提取 message_id"""
+    if isinstance(body, dict):
+        message_id = body.get("id")
+        if isinstance(message_id, str) and message_id.strip():
+            return message_id.strip()
+        
+        body_metadata = body.get("metadata", {})
+        if isinstance(body_metadata, dict):
+            message_id = body_metadata.get("message_id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+    
+    if isinstance(metadata, dict):
+        message_id = metadata.get("message_id")
+        if isinstance(message_id, str) and message_id.strip():
+            return message_id.strip()
+    
+    return ""
+```
+
+#### 参考实现
+
+- `plugins/actions/smart-mind-map/smart_mind_map.py` - 思维导图图片模式实现
+- 官方文档: [Backend-Controlled, UI-Compatible API Flow](https://docs.openwebui.com/tutorials/tips/backend-controlled-ui-compatible-api-flow)
 
 ---
 

.github/workflows/community-stats.yml

@@ -0,0 +1,54 @@
+# OpenWebUI 社区统计报告自动生成
+# 每小时自动获取并更新社区统计数据
+
+name: Community Stats
+
+on:
+  # 每小时整点运行
+  schedule:
+    - cron: '0 * * * *'
+  # 手动触发
+  workflow_dispatch:
+
+permissions:
+  contents: write
+
+jobs:
+  update-stats:
+    runs-on: ubuntu-latest
+    
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+      
+      - name: Set up Python
+        uses: actions/setup-python@v5
+        with:
+          python-version: '3.11'
+      
+      - name: Install dependencies
+        run: |
+          pip install requests python-dotenv
+      
+      - name: Generate stats report
+        env:
+          OPENWEBUI_API_KEY: ${{ secrets.OPENWEBUI_API_KEY }}
+          OPENWEBUI_USER_ID: ${{ secrets.OPENWEBUI_USER_ID }}
+        run: |
+          python scripts/openwebui_stats.py
+      
+      - name: Check for changes
+        id: check_changes
+        run: |
+          git diff --quiet docs/community-stats.zh.md docs/community-stats.md README.md README_CN.md || echo "changed=true" >> $GITHUB_OUTPUT
+      
+      - name: Commit and push changes
+        if: steps.check_changes.outputs.changed == 'true'
+        run: |
+          git config --local user.email "github-actions[bot]@users.noreply.github.com"
+          git config --local user.name "github-actions[bot]"
+          git add docs/community-stats.zh.md docs/community-stats.md docs/community-stats.json README.md README_CN.md
+          git commit -m "chore: update community stats $(date +'%Y-%m-%d')"
+          git push

.github/workflows/publish_plugin.yml

@@ -0,0 +1,28 @@
+name: Publish Plugins to OpenWebUI Market
+
+on:
+  release:
+    types: [published]
+  workflow_dispatch:
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Set up Python
+        uses: actions/setup-python@v5
+        with:
+          python-version: '3.x'
+
+      - name: Install dependencies
+        run: |
+          python -m pip install --upgrade pip
+          pip install requests
+
+      - name: Publish Plugins
+        env:
+          OPENWEBUI_API_KEY: ${{ secrets.OPENWEBUI_API_KEY }}
+        run: python scripts/publish_plugin.py

.github/workflows/release.yml

@@ -180,14 +180,34 @@ jobs:
 
       - name: Determine version
         id: version
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         run: |
           if [ "${{ github.event_name }}" = "workflow_dispatch" ] && [ -n "${{ github.event.inputs.version }}" ]; then
             VERSION="${{ github.event.inputs.version }}"
           elif [[ "${{ github.ref }}" == refs/tags/v* ]]; then
             VERSION="${GITHUB_REF#refs/tags/}"
           else
-            # Auto-generate version based on date and run number
-            VERSION="v$(date +'%Y.%m.%d')-${{ github.run_number }}"
+            # Auto-generate version based on date and daily release count
+            TODAY=$(date +'%Y.%m.%d')
+            TODAY_PREFIX="v${TODAY}-"
+            
+            # Count existing releases with today's date prefix
+            # grep -c returns 1 if count is 0, so we use || true to avoid script failure
+            EXISTING_COUNT=$(gh release list --limit 100 2>/dev/null | grep -c "^${TODAY_PREFIX}" || true)
+            
+            # Clean up output (handle potential newlines or fallback issues)
+            EXISTING_COUNT=$(echo "$EXISTING_COUNT" | tr -cd '0-9')
+            if [ -z "$EXISTING_COUNT" ]; then EXISTING_COUNT=0; fi
+            
+            NEXT_NUM=$((EXISTING_COUNT + 1))
+            
+            VERSION="${TODAY_PREFIX}${NEXT_NUM}"
+            
+            # Final fallback to ensure VERSION is never empty
+            if [ -z "$VERSION" ]; then
+              VERSION="v$(date +'%Y.%m.%d-%H%M%S')"
+            fi
           fi
           echo "version=$VERSION" >> $GITHUB_OUTPUT
           echo "Release version: $VERSION"
@@ -325,13 +345,34 @@ jobs:
           echo "=== Release Notes ==="
           cat release_notes.md
 
+      - name: Create Git Tag
+        run: |
+          VERSION="${{ steps.version.outputs.version }}"
+          
+          if [ -z "$VERSION" ]; then
+            echo "Error: Version is empty!"
+            exit 1
+          fi
+          
+          if ! git rev-parse "$VERSION" >/dev/null 2>&1; then
+            echo "Creating tag $VERSION"
+            git tag "$VERSION"
+            git push origin "$VERSION"
+          else
+            echo "Tag $VERSION already exists"
+          fi
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
       - name: Create GitHub Release
         uses: softprops/action-gh-release@v2
         with:
           tag_name: ${{ steps.version.outputs.version }}
+          target_commitish: ${{ github.sha }}
           name: ${{ github.event.inputs.release_title || steps.version.outputs.version }}
           body_path: release_notes.md
           prerelease: ${{ github.event.inputs.prerelease || false }}
+          make_latest: true
           files: |
             plugin_versions.json
         env:

README.md

@@ -4,7 +4,32 @@ English | [中文](./README_CN.md)
 
 A collection of enhancements, plugins, and prompts for [OpenWebUI](https://github.com/open-webui/open-webui), developed and curated for personal use to extend functionality and improve experience.
 
-[Contributing](./CONTRIBUTING.md)
+<!-- STATS_START -->
+## 📊 Community Stats
+
+> 🕐 Auto-updated: 2026-01-08 00:11
+
+| 👤 Author | 👥 Followers | ⭐ Points | 🏆 Contributions |
+|:---:|:---:|:---:|:---:|
+| [Fu-Jie](https://openwebui.com/u/Fu-Jie) | **49** | **63** | **18** |
+
+| 📝 Posts | ⬇️ Downloads | 👁️ Views | 👍 Upvotes | 💾 Saves |
+|:---:|:---:|:---:|:---:|:---:|
+| **11** | **889** | **9358** | **55** | **48** |
+
+### 🔥 Top 6 Popular Plugins
+
+| Rank | Plugin | Downloads | Views |
+|:---:|------|:---:|:---:|
+| 🥇 | [Turn Any Text into Beautiful Mind Maps](https://openwebui.com/posts/turn_any_text_into_beautiful_mind_maps_3094c59a) | 283 | 2441 |
+| 🥈 | [Export to Excel](https://openwebui.com/posts/export_mulit_table_to_excel_244b8f9d) | 175 | 486 |
+| 🥉 | [Async Context Compression](https://openwebui.com/posts/async_context_compression_b1655bc8) | 118 | 1287 |
+| 4️⃣ | [Flash Card ](https://openwebui.com/posts/flash_card_65a2ea8f) | 82 | 1528 |
+| 5️⃣ | [Smart Infographic](https://openwebui.com/posts/smart_infographic_ad6f0c7f) | 80 | 1081 |
+| 6️⃣ | [Export to Word (Enhanced Formatting)](https://openwebui.com/posts/export_to_word_enhanced_formatting_fca6a315) | 67 | 605 |
+
+*See full stats in [Community Stats Report](./docs/community-stats.md)*
+<!-- STATS_END -->
 
 ## 📦 Project Contents
 
@@ -60,10 +85,16 @@ This project is a collection of resources and does not require a Python environm
 
 ### Using Plugins
 
-1. Browse the `/plugins` directory and download the plugin file (`.py`) you need.
-2. Go to OpenWebUI **Admin Panel** -> **Settings** -> **Plugins**.
-3. Click the upload button and select the `.py` file you just downloaded.
-4. Once uploaded, refresh the page to enable the plugin in your chat settings or toolbar.
+1. **Install from OpenWebUI Community (Recommended)**:
+   - Visit my profile: [Fu-Jie's Profile](https://openwebui.com/u/Fu-Jie)
+   - Browse the plugins and select the one you like.
+   - Click "Get" to import it directly into your OpenWebUI instance.
+
+2. **Manual Installation**:
+   - Browse the `/plugins` directory and download the plugin file (`.py`) you need.
+   - Go to OpenWebUI **Admin Panel** -> **Settings** -> **Plugins**.
+   - Click the upload button and select the `.py` file you just downloaded.
+   - Once uploaded, refresh the page to enable the plugin in your chat settings or toolbar.
 
 ### Contributing
 
@@ -71,3 +102,5 @@ If you have great prompts or plugins to share:
 1. Fork this repository.
 2. Add your files to the appropriate `prompts/` or `plugins/` directory.
 3. Submit a Pull Request.
+
+[Contributing](./CONTRIBUTING.md)

README_CN.md

@@ -2,7 +2,38 @@
 
 [English](./README.md) | 中文
 
-OpenWebUI 增强功能集合。包含个人开发与收集的### 🧩 插件 (Plugins)
+OpenWebUI 增强功能集合。包含个人开发与收集的插件、提示词等资源。
+
+<!-- STATS_START -->
+## 📊 社区统计
+
+> 🕐 自动更新于 2026-01-08 00:11
+
+| 👤 作者 | 👥 粉丝 | ⭐ 积分 | 🏆 贡献 |
+|:---:|:---:|:---:|:---:|
+| [Fu-Jie](https://openwebui.com/u/Fu-Jie) | **49** | **63** | **18** |
+
+| 📝 发布 | ⬇️ 下载 | 👁️ 浏览 | 👍 点赞 | 💾 收藏 |
+|:---:|:---:|:---:|:---:|:---:|
+| **11** | **889** | **9358** | **55** | **48** |
+
+### 🔥 热门插件 Top 6
+
+| 排名 | 插件 | 下载 | 浏览 |
+|:---:|------|:---:|:---:|
+| 🥇 | [Turn Any Text into Beautiful Mind Maps](https://openwebui.com/posts/turn_any_text_into_beautiful_mind_maps_3094c59a) | 283 | 2441 |
+| 🥈 | [Export to Excel](https://openwebui.com/posts/export_mulit_table_to_excel_244b8f9d) | 175 | 486 |
+| 🥉 | [Async Context Compression](https://openwebui.com/posts/async_context_compression_b1655bc8) | 118 | 1287 |
+| 4️⃣ | [Flash Card ](https://openwebui.com/posts/flash_card_65a2ea8f) | 82 | 1528 |
+| 5️⃣ | [Smart Infographic](https://openwebui.com/posts/smart_infographic_ad6f0c7f) | 80 | 1081 |
+| 6️⃣ | [Export to Word (Enhanced Formatting)](https://openwebui.com/posts/export_to_word_enhanced_formatting_fca6a315) | 67 | 605 |
+
+*完整统计请查看 [社区统计报告](./docs/community-stats.zh.md)*
+<!-- STATS_END -->
+
+## 📦 项目内容
+
+### 🧩 插件 (Plugins)
 
 位于 `plugins/` 目录，包含各类 Python 编写的功能增强插件：
 
@@ -19,7 +50,6 @@ OpenWebUI 增强功能集合。包含个人开发与收集的### 🧩 插件 (Pl
 - **Context Enhancement** (`context_enhancement_filter`): 上下文增强过滤器。
 - **Gemini Manifold Companion** (`gemini_manifold_companion`): Gemini Manifold 配套增强。
 
-
 #### Pipes (模型管道)
 - **Gemini Manifold** (`gemini_mainfold`): 集成 Gemini 模型的管道。
 
@@ -31,40 +61,10 @@ OpenWebUI 增强功能集合。包含个人开发与收集的### 🧩 插件 (Pl
 位于 `prompts/` 目录，包含精心调优的 System Prompts：
 
 - **Coding**: 编程辅助类提示词。
-- **Marketing**: 营销文案类提示词。(`/prompts/marketing`): 内容创作、品牌策划、市场分析相关的提示词
+- **Marketing**: 营销文案类提示词。
 
 每个提示词都独立保存为 Markdown 文件，可直接在 OpenWebUI 中使用。
 
-### 🔧 插件 (Plugins)
-
-{{ ... }}
-
-[贡献指南](./CONTRIBUTING.md) | [更新日志](./CHANGELOG.md)
-
-## 📦 项目内容
-
-### 🎯 提示词 (Prompts)
-
-位于 `/prompts` 目录，包含针对不同领域的优质提示词模板：
-
-- **编程类** (`/prompts/coding`): 代码生成、调试、优化相关的提示词
-- **营销类** (`/prompts/marketing`): 内容创作、品牌策划、市场分析相关的提示词
-
-每个提示词都独立保存为 Markdown 文件，可直接在 OpenWebUI 中使用。
-
-### 🔧 插件 (Plugins)
-
-位于 `/plugins` 目录，提供三种类型的插件扩展：
-
-- **过滤器 (Filters)** - 在用户输入发送给 LLM 前进行处理和优化
-  - 异步上下文压缩：智能压缩长上下文，优化 token 使用效率
-
-- **动作 (Actions)** - 自定义功能，从聊天中触发
-  - 思维导图生成：快速生成和导出思维导图
-
-- **管道 (Pipes)** - 对 LLM 响应进行处理和增强
-  - 各类响应处理和格式化插件
-
 ## 📖 开发文档
 
 位于 `docs/zh/` 目录：
@@ -73,7 +73,7 @@ OpenWebUI 增强功能集合。包含个人开发与收集的### 🧩 插件 (Pl
 - **[从问一个AI到运营一支AI团队](./docs/zh/从问一个AI到运营一支AI团队.md)** - 深度运营经验分享。
 
 更多示例请查看 `docs/examples/` 目录。
- 
+
 ## 🚀 快速开始
 
 本项目是一个资源集合，无需安装 Python 环境。你只需要下载对应的文件并导入到你的 OpenWebUI 实例中即可。
@@ -87,10 +87,16 @@ OpenWebUI 增强功能集合。包含个人开发与收集的### 🧩 插件 (Pl
 
 ### 使用插件 (Plugins)
 
-1. 在 `/plugins` 目录中浏览并下载你需要的插件文件 (`.py`)。
-2. 打开 OpenWebUI 的 **管理员面板 (Admin Panel)** -> **设置 (Settings)** -> **插件 (Plugins)**。
-3. 点击上传按钮，选择刚才下载的 `.py` 文件。
-4. 上传成功后，刷新页面，你就可以在聊天设置或工具栏中启用该插件了。
+1. **从 OpenWebUI 社区安装 (推荐)**:
+   - 访问我的主页: [Fu-Jie's Profile](https://openwebui.com/u/Fu-Jie)
+   - 浏览插件列表，选择你喜欢的插件。
+   - 点击 "Get" 按钮，将其直接导入到你的 OpenWebUI 实例中。
+
+2. **手动安装**:
+   - 在 `/plugins` 目录中浏览并下载你需要的插件文件 (`.py`)。
+   - 打开 OpenWebUI 的 **管理员面板 (Admin Panel)** -> **设置 (Settings)** -> **插件 (Plugins)**。
+   - 点击上传按钮，选择刚才下载的 `.py` 文件。
+   - 上传成功后，刷新页面，你就可以在聊天设置或工具栏中启用该插件了。
 
 ### 贡献代码
 
@@ -98,3 +104,5 @@ OpenWebUI 增强功能集合。包含个人开发与收集的### 🧩 插件 (Pl
 1. Fork 本仓库。
 2. 将你的文件添加到对应的 `prompts/` 或 `plugins/` 目录。
 3. 提交 Pull Request。
+
+[贡献指南](./CONTRIBUTING.md) | [更新日志](./CHANGELOG.md)

docs/community-stats.json

@@ -0,0 +1,203 @@
+{
+  "total_posts": 11,
+  "total_downloads": 889,
+  "total_views": 9358,
+  "total_upvotes": 55,
+  "total_downvotes": 1,
+  "total_saves": 48,
+  "total_comments": 15,
+  "by_type": {
+    "action": 9,
+    "filter": 2
+  },
+  "posts": [
+    {
+      "title": "Turn Any Text into Beautiful Mind Maps",
+      "slug": "turn_any_text_into_beautiful_mind_maps_3094c59a",
+      "type": "action",
+      "version": "0.9.1",
+      "author": "Fu-Jie",
+      "description": "Intelligently analyzes text content and generates interactive mind maps to help users structure and visualize knowledge.",
+      "downloads": 283,
+      "views": 2441,
+      "upvotes": 10,
+      "saves": 15,
+      "comments": 10,
+      "created_at": "2025-12-30",
+      "updated_at": "2026-01-06",
+      "url": "https://openwebui.com/posts/turn_any_text_into_beautiful_mind_maps_3094c59a"
+    },
+    {
+      "title": "Export to Excel",
+      "slug": "export_mulit_table_to_excel_244b8f9d",
+      "type": "action",
+      "version": "0.3.6",
+      "author": "Fu-Jie",
+      "description": "Extracts tables from chat messages and exports them to Excel (.xlsx) files with smart formatting.",
+      "downloads": 175,
+      "views": 486,
+      "upvotes": 3,
+      "saves": 3,
+      "comments": 0,
+      "created_at": "2025-05-30",
+      "updated_at": "2026-01-03",
+      "url": "https://openwebui.com/posts/export_mulit_table_to_excel_244b8f9d"
+    },
+    {
+      "title": "Async Context Compression",
+      "slug": "async_context_compression_b1655bc8",
+      "type": "filter",
+      "version": "1.1.0",
+      "author": "Fu-Jie",
+      "description": "This filter automatically compresses long conversation contexts by intelligently summarizing and removing intermediate messages while preserving critical information, thereby significantly reducing token consumption.",
+      "downloads": 118,
+      "views": 1287,
+      "upvotes": 5,
+      "saves": 9,
+      "comments": 0,
+      "created_at": "2025-11-08",
+      "updated_at": "2025-12-31",
+      "url": "https://openwebui.com/posts/async_context_compression_b1655bc8"
+    },
+    {
+      "title": "Flash Card ",
+      "slug": "flash_card_65a2ea8f",
+      "type": "action",
+      "version": "0.2.4",
+      "author": "Fu-Jie",
+      "description": "Quickly generates beautiful flashcards from text, extracting key points and categories.",
+      "downloads": 82,
+      "views": 1528,
+      "upvotes": 8,
+      "saves": 5,
+      "comments": 2,
+      "created_at": "2025-12-30",
+      "updated_at": "2026-01-03",
+      "url": "https://openwebui.com/posts/flash_card_65a2ea8f"
+    },
+    {
+      "title": "Smart Infographic",
+      "slug": "smart_infographic_ad6f0c7f",
+      "type": "action",
+      "version": "1.4.0",
+      "author": "jeff",
+      "description": "AI-powered infographic generator based on AntV Infographic. Supports professional templates, auto-icon matching, and SVG/PNG downloads.",
+      "downloads": 80,
+      "views": 1081,
+      "upvotes": 7,
+      "saves": 8,
+      "comments": 2,
+      "created_at": "2025-12-28",
+      "updated_at": "2026-01-07",
+      "url": "https://openwebui.com/posts/smart_infographic_ad6f0c7f"
+    },
+    {
+      "title": "Export to Word (Enhanced Formatting)",
+      "slug": "export_to_word_enhanced_formatting_fca6a315",
+      "type": "action",
+      "version": "0.4.2",
+      "author": "Fu-Jie",
+      "description": "Export the current conversation to a formatted Word doc with syntax highlighting, AI-generated titles, and perfect Markdown rendering (tables, quotes, lists).",
+      "downloads": 67,
+      "views": 605,
+      "upvotes": 5,
+      "saves": 4,
+      "comments": 0,
+      "created_at": "2026-01-03",
+      "updated_at": "2026-01-07",
+      "url": "https://openwebui.com/posts/export_to_word_enhanced_formatting_fca6a315"
+    },
+    {
+      "title": "智能信息图",
+      "slug": "智能信息图_e04a48ff",
+      "type": "action",
+      "version": "1.3.1",
+      "author": "jeff",
+      "description": "基于 AntV Infographic 的智能信息图生成插件。支持多种专业模板，自动图标匹配，并提供 SVG/PNG 下载功能。",
+      "downloads": 33,
+      "views": 426,
+      "upvotes": 3,
+      "saves": 0,
+      "comments": 0,
+      "created_at": "2025-12-28",
+      "updated_at": "2025-12-29",
+      "url": "https://openwebui.com/posts/智能信息图_e04a48ff"
+    },
+    {
+      "title": "导出为 Word-支持公式、流程图、表格和代码块",
+      "slug": "导出为_word_支持公式流程图表格和代码块_8a6306c0",
+      "type": "action",
+      "version": "0.4.1",
+      "author": "Fu-Jie",
+      "description": "将当前对话内容从 Markdown 转换并导出为 Word (.docx) 文件，支持中英文无乱码。",
+      "downloads": 20,
+      "views": 799,
+      "upvotes": 7,
+      "saves": 1,
+      "comments": 1,
+      "created_at": "2026-01-04",
+      "updated_at": "2026-01-05",
+      "url": "https://openwebui.com/posts/导出为_word_支持公式流程图表格和代码块_8a6306c0"
+    },
+    {
+      "title": "智能生成交互式思维导图,帮助用户可视化知识",
+      "slug": "智能生成交互式思维导图帮助用户可视化知识_8d4b097b",
+      "type": "action",
+      "version": "0.8.0",
+      "author": "",
+      "description": "智能分析文本内容,生成交互式思维导图,帮助用户结构化和可视化知识。",
+      "downloads": 14,
+      "views": 263,
+      "upvotes": 2,
+      "saves": 1,
+      "comments": 0,
+      "created_at": "2025-12-31",
+      "updated_at": "2025-12-31",
+      "url": "https://openwebui.com/posts/智能生成交互式思维导图帮助用户可视化知识_8d4b097b"
+    },
+    {
+      "title": "闪记卡生成插件",
+      "slug": "闪记卡生成插件_4a31eac3",
+      "type": "action",
+      "version": "0.2.2",
+      "author": "Fu-Jie",
+      "description": "快速将文本提炼为精美的学习记忆卡片，支持核心要点提取与分类。",
+      "downloads": 12,
+      "views": 320,
+      "upvotes": 3,
+      "saves": 1,
+      "comments": 0,
+      "created_at": "2025-12-30",
+      "updated_at": "2025-12-31",
+      "url": "https://openwebui.com/posts/闪记卡生成插件_4a31eac3"
+    },
+    {
+      "title": "异步上下文压缩",
+      "slug": "异步上下文压缩_5c0617cb",
+      "type": "filter",
+      "version": "1.1.0",
+      "author": "Fu-Jie",
+      "description": "在 LLM 响应完成后进行上下文摘要和压缩",
+      "downloads": 5,
+      "views": 122,
+      "upvotes": 2,
+      "saves": 1,
+      "comments": 0,
+      "created_at": "2025-11-08",
+      "updated_at": "2025-12-31",
+      "url": "https://openwebui.com/posts/异步上下文压缩_5c0617cb"
+    }
+  ],
+  "user": {
+    "username": "Fu-Jie",
+    "name": "Fu-Jie",
+    "profile_url": "https://openwebui.com/u/Fu-Jie",
+    "profile_image": "https://community.s3.openwebui.com/uploads/users/b15d1348-4347-42b4-b815-e053342d6cb0/profile_d9510745-4bd4-4f8f-a997-4a21847d9300.webp",
+    "followers": 49,
+    "following": 2,
+    "total_points": 63,
+    "post_points": 54,
+    "comment_points": 9,
+    "contributions": 18
+  }
+}

docs/community-stats.md

@@ -0,0 +1,35 @@
+# 📊 OpenWebUI Community Stats Report
+
+> 📅 Updated: 2026-01-08 00:11
+
+## 📈 Overview
+
+| Metric | Value |
+|------|------|
+| 📝 Total Posts | 11 |
+| ⬇️ Total Downloads | 889 |
+| 👁️ Total Views | 9358 |
+| 👍 Total Upvotes | 55 |
+| 💾 Total Saves | 48 |
+| 💬 Total Comments | 15 |
+
+## 📂 By Type
+
+- **action**: 9
+- **filter**: 2
+
+## 📋 Posts List
+
+| Rank | Title | Type | Version | Downloads | Views | Upvotes | Saves | Updated |
+|:---:|------|:---:|:---:|:---:|:---:|:---:|:---:|:---:|
+| 1 | [Turn Any Text into Beautiful Mind Maps](https://openwebui.com/posts/turn_any_text_into_beautiful_mind_maps_3094c59a) | action | 0.9.1 | 283 | 2441 | 10 | 15 | 2026-01-06 |
+| 2 | [Export to Excel](https://openwebui.com/posts/export_mulit_table_to_excel_244b8f9d) | action | 0.3.6 | 175 | 486 | 3 | 3 | 2026-01-03 |
+| 3 | [Async Context Compression](https://openwebui.com/posts/async_context_compression_b1655bc8) | filter | 1.1.0 | 118 | 1287 | 5 | 9 | 2025-12-31 |
+| 4 | [Flash Card ](https://openwebui.com/posts/flash_card_65a2ea8f) | action | 0.2.4 | 82 | 1528 | 8 | 5 | 2026-01-03 |
+| 5 | [Smart Infographic](https://openwebui.com/posts/smart_infographic_ad6f0c7f) | action | 1.4.0 | 80 | 1081 | 7 | 8 | 2026-01-07 |
+| 6 | [Export to Word (Enhanced Formatting)](https://openwebui.com/posts/export_to_word_enhanced_formatting_fca6a315) | action | 0.4.2 | 67 | 605 | 5 | 4 | 2026-01-07 |
+| 7 | [智能信息图](https://openwebui.com/posts/智能信息图_e04a48ff) | action | 1.3.1 | 33 | 426 | 3 | 0 | 2025-12-29 |
+| 8 | [导出为 Word-支持公式、流程图、表格和代码块](https://openwebui.com/posts/导出为_word_支持公式流程图表格和代码块_8a6306c0) | action | 0.4.1 | 20 | 799 | 7 | 1 | 2026-01-05 |
+| 9 | [智能生成交互式思维导图,帮助用户可视化知识](https://openwebui.com/posts/智能生成交互式思维导图帮助用户可视化知识_8d4b097b) | action | 0.8.0 | 14 | 263 | 2 | 1 | 2025-12-31 |
+| 10 | [闪记卡生成插件](https://openwebui.com/posts/闪记卡生成插件_4a31eac3) | action | 0.2.2 | 12 | 320 | 3 | 1 | 2025-12-31 |
+| 11 | [异步上下文压缩](https://openwebui.com/posts/异步上下文压缩_5c0617cb) | filter | 1.1.0 | 5 | 122 | 2 | 1 | 2025-12-31 |

docs/community-stats.zh.md

@@ -0,0 +1,35 @@
+# 📊 OpenWebUI 社区统计报告
+
+> 📅 更新时间: 2026-01-08 00:11
+
+## 📈 总览
+
+| 指标 | 数值 |
+|------|------|
+| 📝 发布数量 | 11 |
+| ⬇️ 总下载量 | 889 |
+| 👁️ 总浏览量 | 9358 |
+| 👍 总点赞数 | 55 |
+| 💾 总收藏数 | 48 |
+| 💬 总评论数 | 15 |
+
+## 📂 按类型分类
+
+- **action**: 9
+- **filter**: 2
+
+## 📋 发布列表
+
+| 排名 | 标题 | 类型 | 版本 | 下载 | 浏览 | 点赞 | 收藏 | 更新日期 |
+|:---:|------|:---:|:---:|:---:|:---:|:---:|:---:|:---:|
+| 1 | [Turn Any Text into Beautiful Mind Maps](https://openwebui.com/posts/turn_any_text_into_beautiful_mind_maps_3094c59a) | action | 0.9.1 | 283 | 2441 | 10 | 15 | 2026-01-06 |
+| 2 | [Export to Excel](https://openwebui.com/posts/export_mulit_table_to_excel_244b8f9d) | action | 0.3.6 | 175 | 486 | 3 | 3 | 2026-01-03 |
+| 3 | [Async Context Compression](https://openwebui.com/posts/async_context_compression_b1655bc8) | filter | 1.1.0 | 118 | 1287 | 5 | 9 | 2025-12-31 |
+| 4 | [Flash Card ](https://openwebui.com/posts/flash_card_65a2ea8f) | action | 0.2.4 | 82 | 1528 | 8 | 5 | 2026-01-03 |
+| 5 | [Smart Infographic](https://openwebui.com/posts/smart_infographic_ad6f0c7f) | action | 1.4.0 | 80 | 1081 | 7 | 8 | 2026-01-07 |
+| 6 | [Export to Word (Enhanced Formatting)](https://openwebui.com/posts/export_to_word_enhanced_formatting_fca6a315) | action | 0.4.2 | 67 | 605 | 5 | 4 | 2026-01-07 |
+| 7 | [智能信息图](https://openwebui.com/posts/智能信息图_e04a48ff) | action | 1.3.1 | 33 | 426 | 3 | 0 | 2025-12-29 |
+| 8 | [导出为 Word-支持公式、流程图、表格和代码块](https://openwebui.com/posts/导出为_word_支持公式流程图表格和代码块_8a6306c0) | action | 0.4.1 | 20 | 799 | 7 | 1 | 2026-01-05 |
+| 9 | [智能生成交互式思维导图,帮助用户可视化知识](https://openwebui.com/posts/智能生成交互式思维导图帮助用户可视化知识_8d4b097b) | action | 0.8.0 | 14 | 263 | 2 | 1 | 2025-12-31 |
+| 10 | [闪记卡生成插件](https://openwebui.com/posts/闪记卡生成插件_4a31eac3) | action | 0.2.2 | 12 | 320 | 3 | 1 | 2025-12-31 |
+| 11 | [异步上下文压缩](https://openwebui.com/posts/异步上下文压缩_5c0617cb) | filter | 1.1.0 | 5 | 122 | 2 | 1 | 2025-12-31 |

docs/development/plugin-guide.md

@@ -235,6 +235,125 @@ llm_response = await generate_chat_completion(
 )
 ```
 
+### 4.4 JS Render to Markdown (Data URL Embedding)
+
+For scenarios requiring complex frontend rendering (e.g., AntV charts, Mermaid diagrams) but wanting **persistent pure Markdown output**, use the Data URL embedding pattern:
+
+#### Workflow
+
+```
+┌──────────────────────────────────────────────────────────────┐
+│  1. Python Action                                             │
+│     ├── Analyze message content                               │
+│     ├── Call LLM to generate structured data (optional)       │
+│     └── Send JS code to frontend via __event_call__           │
+├──────────────────────────────────────────────────────────────┤
+│  2. Browser JS (via __event_call__)                           │
+│     ├── Dynamically load visualization library                │
+│     ├── Render SVG/Canvas offscreen                           │
+│     ├── Export to Base64 Data URL via toDataURL()             │
+│     └── Update message content via REST API                   │
+├──────────────────────────────────────────────────────────────┤
+│  3. Markdown Rendering                                        │
+│     └── Display ![description](data:image/svg+xml;base64,...) │
+└──────────────────────────────────────────────────────────────┘
+```
+
+#### Python Side (Send JS for Execution)
+
+```python
+async def action(self, body, __event_call__, __metadata__, ...):
+    chat_id = self._extract_chat_id(body, __metadata__)
+    message_id = self._extract_message_id(body, __metadata__)
+    
+    # Generate JS code
+    js_code = self._generate_js_code(
+        chat_id=chat_id,
+        message_id=message_id,
+        data=processed_data,
+    )
+    
+    # Execute JS
+    if __event_call__:
+        await __event_call__({
+            "type": "execute",
+            "data": {"code": js_code}
+        })
+```
+
+#### JavaScript Side (Render and Write-back)
+
+```javascript
+(async function() {
+    // 1. Load visualization library
+    if (typeof VisualizationLib === 'undefined') {
+        await new Promise((resolve, reject) => {
+            const script = document.createElement('script');
+            script.src = 'https://cdn.example.com/lib.min.js';
+            script.onload = resolve;
+            script.onerror = reject;
+            document.head.appendChild(script);
+        });
+    }
+    
+    // 2. Create offscreen container
+    const container = document.createElement('div');
+    container.style.cssText = 'position:absolute;left:-9999px;';
+    document.body.appendChild(container);
+    
+    // 3. Render visualization
+    const instance = new VisualizationLib({ container });
+    instance.render(data);
+    
+    // 4. Export to Data URL
+    const dataUrl = await instance.toDataURL({ type: 'svg', embedResources: true });
+    
+    // 5. Cleanup
+    instance.destroy();
+    document.body.removeChild(container);
+    
+    // 6. Generate Markdown image
+    const markdownImage = `![Chart](${dataUrl})`;
+    
+    // 7. Update message via API
+    const token = localStorage.getItem("token");
+    await fetch(`/api/v1/chats/${chatId}/messages/${messageId}/event`, {
+        method: "POST",
+        headers: {
+            "Content-Type": "application/json",
+            "Authorization": `Bearer ${token}`
+        },
+        body: JSON.stringify({
+            type: "chat:message",
+            data: { content: originalContent + "\n\n" + markdownImage }
+        })
+    });
+})();
+```
+
+#### Benefits
+
+- **Pure Markdown Output**: Standard Markdown image syntax, no HTML code blocks
+- **Self-Contained**: Images embedded as Base64 Data URL, no external dependencies
+- **Persistent**: Via API write-back, images remain after page reload
+- **Cross-Platform**: Works on any client supporting Markdown images
+
+#### HTML Injection vs JS Render to Markdown
+
+| Feature | HTML Injection | JS Render + Markdown |
+|---------|----------------|----------------------|
+| Output Format | HTML code block | Markdown image |
+| Interactivity | ✅ Buttons, animations | ❌ Static image |
+| External Deps | Requires JS libraries | None (self-contained) |
+| Persistence | Depends on browser | ✅ Permanent |
+| File Export | Needs special handling | ✅ Direct export |
+| Use Case | Interactive content | Infographics, chart snapshots |
+
+#### Reference Implementations
+
+- `plugins/actions/js-render-poc/infographic_markdown.py` - AntV Infographic + Data URL
+- `plugins/actions/js-render-poc/js_render_poc.py` - Basic proof of concept
+
 ---
 
 ## 5. Best Practices & Design Principles

docs/development/plugin-guide.zh.md

@@ -199,7 +199,124 @@ async def background_job(self, chat_id):
     pass
 ```
 
----
+### 4.3 JS 渲染并嵌入 Markdown (Data URL 嵌入)
+
+对于需要复杂前端渲染（如 AntV 图表、Mermaid 图表）但希望结果**持久化为纯 Markdown 格式**的场景，推荐使用 Data URL 嵌入模式：
+
+#### 工作流程
+
+```
+┌──────────────────────────────────────────────────────────────┐
+│  1. Python Action                                             │
+│     ├── 分析消息内容                                           │
+│     ├── 调用 LLM 生成结构化数据（可选）                         │
+│     └── 通过 __event_call__ 发送 JS 代码到前端                 │
+├──────────────────────────────────────────────────────────────┤
+│  2. Browser JS (通过 __event_call__)                          │
+│     ├── 动态加载可视化库                                       │
+│     ├── 离屏渲染 SVG/Canvas                                    │
+│     ├── 使用 toDataURL() 导出 Base64 Data URL                  │
+│     └── 通过 REST API 更新消息内容                             │
+├──────────────────────────────────────────────────────────────┤
+│  3. Markdown 渲染                                             │
+│     └── 显示 ![描述](data:image/svg+xml;base64,...)           │
+└──────────────────────────────────────────────────────────────┘
+```
+
+#### Python 端（发送 JS 执行）
+
+```python
+async def action(self, body, __event_call__, __metadata__, ...):
+    chat_id = self._extract_chat_id(body, __metadata__)
+    message_id = self._extract_message_id(body, __metadata__)
+    
+    # 生成 JS 代码
+    js_code = self._generate_js_code(
+        chat_id=chat_id,
+        message_id=message_id,
+        data=processed_data,
+    )
+    
+    # 执行 JS
+    if __event_call__:
+        await __event_call__({
+            "type": "execute",
+            "data": {"code": js_code}
+        })
+```
+
+#### JavaScript 端（渲染并回写）
+
+```javascript
+(async function() {
+    // 1. 加载可视化库
+    if (typeof VisualizationLib === 'undefined') {
+        await new Promise((resolve, reject) => {
+            const script = document.createElement('script');
+            script.src = 'https://cdn.example.com/lib.min.js';
+            script.onload = resolve;
+            script.onerror = reject;
+            document.head.appendChild(script);
+        });
+    }
+    
+    // 2. 创建离屏容器
+    const container = document.createElement('div');
+    container.style.cssText = 'position:absolute;left:-9999px;';
+    document.body.appendChild(container);
+    
+    // 3. 渲染可视化
+    const instance = new VisualizationLib({ container });
+    instance.render(data);
+    
+    // 4. 导出为 Data URL
+    const dataUrl = await instance.toDataURL({ type: 'svg', embedResources: true });
+    
+    // 5. 清理
+    instance.destroy();
+    document.body.removeChild(container);
+    
+    // 6. 生成 Markdown 图片
+    const markdownImage = `![图表](${dataUrl})`;
+    
+    // 7. 通过 API 更新消息
+    const token = localStorage.getItem("token");
+    await fetch(`/api/v1/chats/${chatId}/messages/${messageId}/event`, {
+        method: "POST",
+        headers: {
+            "Content-Type": "application/json",
+            "Authorization": `Bearer ${token}`
+        },
+        body: JSON.stringify({
+            type: "chat:message",
+            data: { content: originalContent + "\n\n" + markdownImage }
+        })
+    });
+})();
+```
+
+#### 优势
+
+- **纯 Markdown 输出**：结果是标准的 Markdown 图片语法，无需 HTML 代码块
+- **自包含**：图片以 Base64 Data URL 嵌入，无外部依赖
+- **持久化**：通过 API 回写，消息重新加载后图片仍然存在
+- **跨平台**：任何支持 Markdown 图片的客户端都能显示
+
+#### HTML 注入 vs JS 渲染嵌入 Markdown
+
+| 特性 | HTML 注入 | JS 渲染 + Markdown 图片 |
+|------|----------|------------------------|
+| 输出格式 | HTML 代码块 | Markdown 图片 |
+| 交互性 | ✅ 支持按钮、动画 | ❌ 静态图片 |
+| 外部依赖 | 需要加载 JS 库 | 无（图片自包含） |
+| 持久化 | 依赖浏览器渲染 | ✅ 永久可见 |
+| 文件导出 | 需特殊处理 | ✅ 直接导出 |
+| 适用场景 | 交互式内容 | 信息图、图表快照 |
+
+#### 参考实现
+
+- `plugins/actions/js-render-poc/infographic_markdown.py` - AntV 信息图 + Data URL
+- `plugins/actions/js-render-poc/js_render_poc.py` - 基础概念验证
 
 ## 5. 最佳实践与设计原则
 

docs/index.md

@@ -104,10 +104,16 @@ hide:
 
 ### Using Plugins
 
-1. Browse the [Plugin Center](plugins/index.md) and download the plugin file (`.py`)
-2. Open OpenWebUI **Admin Panel** → **Settings** → **Plugins**
-3. Click the upload button and select the `.py` file
-4. Refresh the page and enable the plugin in your chat settings
+1. **Install from OpenWebUI Community (Recommended)**:
+   - Visit my profile: [Fu-Jie's Profile](https://openwebui.com/u/Fu-Jie)
+   - Browse the plugins and select the one you like.
+   - Click "Get" to import it directly into your OpenWebUI instance.
+
+2. **Manual Installation**:
+   - Browse the [Plugin Center](plugins/index.md) and download the plugin file (`.py`)
+   - Open OpenWebUI **Admin Panel** → **Settings** → **Plugins**
+   - Click the upload button and select the `.py` file
+   - Refresh the page and enable the plugin in your chat settings
 
 ---
 

docs/index.zh.md

@@ -104,10 +104,16 @@ hide:
 
 ### 使用插件
 
-1. 浏览[插件中心](plugins/index.md)并下载插件文件（`.py`）
-2. 打开 OpenWebUI **管理面板** → **设置** → **插件**
-3. 点击上传按钮并选择 `.py` 文件
-4. 刷新页面并在聊天设置中启用插件
+1. **从 OpenWebUI 社区安装 (推荐)**:
+   - 访问我的主页: [Fu-Jie's Profile](https://openwebui.com/u/Fu-Jie)
+   - 浏览插件列表，选择你喜欢的插件。
+   - 点击 "Get" 按钮，将其直接导入到你的 OpenWebUI 实例中。
+
+2. **手动安装**:
+   - 浏览[插件中心](plugins/index.md)并下载插件文件（`.py`）
+   - 打开 OpenWebUI **管理面板** → **设置** → **插件**
+   - 点击上传按钮并选择 `.py` 文件
+   - 刷新页面并在聊天设置中启用插件
 
 ---
 

docs/js-visualization-guide.md

@@ -0,0 +1,290 @@
+# 使用 JavaScript 生成可视化内容的技术方案
+
+## 概述
+
+本文档描述了在 OpenWebUI Action 插件中使用浏览器端 JavaScript 代码生成可视化内容（如思维导图、信息图等）并将结果保存到消息中的技术方案。
+
+## 核心架构
+
+```mermaid
+sequenceDiagram
+    participant Plugin as Python 插件
+    participant EventCall as __event_call__
+    participant Browser as 浏览器 (JS)
+    participant API as OpenWebUI API
+    participant DB as 数据库
+
+    Plugin->>EventCall: 1. 发送 execute 事件 (含 JS 代码)
+    EventCall->>Browser: 2. 执行 JS 代码
+    Browser->>Browser: 3. 加载可视化库 (D3/Markmap/AntV)
+    Browser->>Browser: 4. 渲染可视化内容
+    Browser->>Browser: 5. 转换为 Base64 Data URI
+    Browser->>API: 6. GET 获取当前消息内容
+    API-->>Browser: 7. 返回消息数据
+    Browser->>API: 8. POST 追加 Markdown 图片到消息
+    API->>DB: 9. 保存更新后的消息
+```
+
+## 关键步骤
+
+### 1. Python 端通过 `__event_call__` 执行 JS
+
+Python 插件**不直接修改 `body["messages"]`**，而是通过 `__event_call__` 发送 JS 代码让浏览器执行：
+
+```python
+async def action(
+    self,
+    body: dict,
+    __user__: dict = None,
+    __event_emitter__=None,
+    __event_call__: Optional[Callable[[Any], Awaitable[None]]] = None,
+    __metadata__: Optional[dict] = None,
+    __request__: Request = None,
+) -> dict:
+    # 从 body 获取 chat_id 和 message_id
+    chat_id = body.get("chat_id", "")
+    message_id = body.get("id", "")  # 注意：body["id"] 是 message_id
+    
+    # 通过 __event_call__ 执行 JS 代码
+    if __event_call__:
+        await __event_call__({
+            "type": "execute",
+            "data": {
+                "code": f"""
+(async function() {{
+    const chatId = "{chat_id}";
+    const messageId = "{message_id}";
+    // ... JS 渲染和 API 更新逻辑 ...
+}})();
+                """
+            },
+        })
+    
+    # 不修改 body，直接返回
+    return body
+```
+
+### 2. JavaScript 加载可视化库
+
+在浏览器端动态加载所需的 JS 库：
+
+```javascript
+// 加载 D3.js
+if (!window.d3) {
+    await new Promise((resolve, reject) => {
+        const script = document.createElement('script');
+        script.src = 'https://cdn.jsdelivr.net/npm/d3@7';
+        script.onload = resolve;
+        script.onerror = reject;
+        document.head.appendChild(script);
+    });
+}
+
+// 加载 Markmap (思维导图)
+if (!window.markmap) {
+    await loadScript('https://cdn.jsdelivr.net/npm/markmap-lib@0.17');
+    await loadScript('https://cdn.jsdelivr.net/npm/markmap-view@0.17');
+}
+```
+
+### 3. 渲染并转换为 Data URI
+
+```javascript
+// 创建 SVG 元素
+const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+svg.setAttribute('width', '800');
+svg.setAttribute('height', '600');
+svg.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
+
+// ... 执行渲染逻辑 (添加图形元素) ...
+
+// 转换为 Base64 Data URI
+const svgData = new XMLSerializer().serializeToString(svg);
+const base64 = btoa(unescape(encodeURIComponent(svgData)));
+const dataUri = 'data:image/svg+xml;base64,' + base64;
+```
+
+### 4. 获取当前消息内容
+
+由于 Python 端不传递原始内容，JS 需要通过 API 获取：
+
+```javascript
+const token = localStorage.getItem('token');
+
+// 获取当前聊天数据
+const getResponse = await fetch(`/api/v1/chats/${chatId}`, {
+    method: 'GET',
+    headers: {
+        'Authorization': `Bearer ${token}`
+    }
+});
+
+const chatData = await getResponse.json();
+
+// 查找目标消息
+let originalContent = '';
+if (chatData.chat && chatData.chat.messages) {
+    const targetMsg = chatData.chat.messages.find(m => m.id === messageId);
+    if (targetMsg && targetMsg.content) {
+        originalContent = targetMsg.content;
+    }
+}
+```
+
+### 5. 调用 API 更新消息
+
+```javascript
+// 构造新内容：原始内容 + Markdown 图片
+const markdownImage = `![可视化图片](${dataUri})`;
+const newContent = originalContent + '\n\n' + markdownImage;
+
+// 调用 API 更新消息
+const response = await fetch(`/api/v1/chats/${chatId}/messages/${messageId}/event`, {
+    method: 'POST',
+    headers: {
+        'Content-Type': 'application/json',
+        'Authorization': `Bearer ${token}`
+    },
+    body: JSON.stringify({
+        type: 'chat:message',
+        data: { content: newContent }
+    })
+});
+
+if (response.ok) {
+    console.log('消息更新成功！');
+}
+```
+
+## 完整示例
+
+参考 [js_render_poc.py](https://github.com/Fu-Jie/awesome-openwebui/blob/main/plugins/actions/js-render-poc/js_render_poc.py) 获取完整的 PoC 实现。
+
+## 事件类型
+
+| 类型 | 用途 |
+|------|------|
+| `chat:message:delta` | 增量更新（追加文本） |
+| `chat:message` | 完全替换消息内容 |
+
+```javascript
+// 增量更新
+{ type: "chat:message:delta", data: { content: "追加的内容" } }
+
+// 完全替换
+{ type: "chat:message", data: { content: "完整的新内容" } }
+```
+
+## 关键数据来源
+
+| 数据 | 来源 | 说明 |
+|------|------|------|
+| `chat_id` | `body["chat_id"]` | 聊天会话 ID |
+| `message_id` | `body["id"]` | ⚠️ 注意：是 `body["id"]`，不是 `body["message_id"]` |
+| `token` | `localStorage.getItem('token')` | 用户认证 Token |
+| `originalContent` | 通过 API `GET /api/v1/chats/{chatId}` 获取 | 当前消息内容 |
+
+## Python 端 API
+
+| 参数 | 类型 | 说明 |
+|------|------|------|
+| `__event_emitter__` | Callable | 发送状态/通知事件 |
+| `__event_call__` | Callable | 执行 JS 代码（用于可视化渲染） |
+| `__metadata__` | dict | 元数据（可能为 None） |
+| `body` | dict | 请求体，包含 messages、chat_id、id 等 |
+
+### body 结构示例
+
+```json
+{
+  "model": "gemini-3-flash-preview",
+  "messages": [...],
+  "chat_id": "ac2633a3-5731-4944-98e3-bf9b3f0ef0ab",
+  "id": "2e0bb7d4-dfc0-43d7-b028-fd9e06c6fdc8",
+  "session_id": "bX30sHI8r4_CKxCdAAAL"
+}
+```
+
+### 常用事件
+
+```python
+# 发送状态更新
+await __event_emitter__({
+    "type": "status",
+    "data": {"description": "正在渲染...", "done": False}
+})
+
+# 执行 JS 代码
+await __event_call__({
+    "type": "execute",
+    "data": {"code": "console.log('Hello from Python!')"}
+})
+
+# 发送通知
+await __event_emitter__({
+    "type": "notification",
+    "data": {"type": "success", "content": "渲染完成！"}
+})
+```
+
+## 适用场景
+
+- **思维导图** (Markmap)
+- **信息图** (AntV Infographic)
+- **流程图** (Mermaid)
+- **数据图表** (ECharts, Chart.js)
+- **任何需要 JS 渲染的可视化内容**
+
+## 注意事项
+
+### 1. 竞态条件问题
+
+⚠️ **多次快速点击会导致内容覆盖问题**
+
+由于 API 调用是异步的，如果用户快速多次触发 Action：
+- 第一次点击：获取原始内容 A → 渲染 → 更新为 A+图片1
+- 第二次点击：可能获取到旧内容 A（第一次还没保存完）→ 更新为 A+图片2
+
+结果：图片1 被覆盖丢失！
+
+**解决方案**：
+- 添加防抖（debounce）机制
+- 使用锁/标志位防止重复执行
+- 或使用 `chat:message:delta` 增量更新
+
+### 2. 不要直接修改 `body["messages"]`
+
+消息更新应由 JS 通过 API 完成，确保获取最新内容。
+
+### 3. f-string 限制
+
+Python f-string 内不能直接使用反斜杠，需要将转义字符串预先处理：
+
+```python
+# 转义 JSON 中的特殊字符
+body_json = json.dumps(data, ensure_ascii=False)
+escaped = body_json.replace("\\", "\\\\").replace("`", "\\`").replace("${", "\\${")
+```
+
+### 4. Data URI 大小限制
+
+Base64 编码会增加约 33% 的体积，复杂图片可能导致消息过大。
+
+### 5. 跨域问题
+
+确保 CDN 资源支持 CORS。
+
+### 6. API 权限
+
+确保用户 token 有权限访问和更新目标消息。
+
+## 与传统方式对比
+
+| 特性 | 传统方式 (修改 body) | 新方式 (__event_call__) |
+|------|---------------------|------------------------|
+| 消息更新 | Python 直接修改 | JS 通过 API 更新 |
+| 原始内容 | Python 传递给 JS | JS 通过 API 获取 |
+| 灵活性 | 低 | 高 |
+| 实时性 | 一次性 | 可多次更新 |
+| 复杂度 | 简单 | 中等 |
+| 竞态风险 | 低 | ⚠️ 需要处理 |

docs/plugins/actions/export-to-word.md

@@ -1,9 +1,9 @@
 # Export to Word
 
 <span class="category-badge action">Action</span>
-<span class="version-badge">v0.1.0</span>
+<span class="version-badge">v0.4.3</span>
 
-Export chat conversations to Word (.docx) with Markdown formatting, syntax highlighting, and smarter filenames.
+Export conversation to Word (.docx) with **syntax highlighting**, **native math equations**, **Mermaid diagrams**, **citations**, and **enhanced table formatting**.
 
 ---
 
@@ -13,11 +13,17 @@ The Export to Word plugin converts chat messages from Markdown to a polished Wor
 
 ## Features
 
-- :material-file-word-box: **DOCX Export**: Generate Word files with one click
-- :material-format-bold: **Rich Markdown Support**: Headings, bold/italic, lists, tables
-- :material-code-tags: **Syntax Highlighting**: Pygments-powered code blocks
-- :material-format-quote-close: **Styled Blockquotes**: Left-border gray quote styling
-- :material-file-document-outline: **Smart Filenames**: Configurable title source (Chat Title, AI Generated, or Markdown Title)
+- :material-file-word-box: **One-Click Export**: Adds an "Export to Word" action button to the chat.
+- :material-format-bold: **Markdown Conversion**: Converts Markdown syntax to Word formatting (headings, bold, italic, code, tables, lists).
+- :material-code-tags: **Syntax Highlighting**: Code blocks are highlighted with Pygments (supports 500+ languages).
+- :material-sigma: **Native Math Equations**: LaTeX math (`$$...$$`, `\[...\]`, `$...$`, `\(...\)`) converted to editable Word equations.
+- :material-graph: **Mermaid Diagrams**: Mermaid flowcharts and sequence diagrams rendered as images in the document.
+- :material-book-open-page-variant: **Citations & References**: Auto-generates a References section from OpenWebUI sources with clickable citation links.
+- :material-brain-off: **Reasoning Stripping**: Automatically removes AI thinking blocks (`<think>`, `<analysis>`) from exports.
+- :material-table: **Enhanced Tables**: Smart column widths, column alignment (`:---`, `---:`, `:---:`), header row repeat across pages.
+- :material-format-quote-close: **Blockquote Support**: Markdown blockquotes are rendered with left border and gray styling.
+- :material-translate: **Multi-language Support**: Properly handles both Chinese and English text.
+- :material-file-document-outline: **Smarter Filenames**: Configurable title source (Chat Title, AI Generated, or Markdown Title).
 
 ---
 
@@ -25,9 +31,39 @@ The Export to Word plugin converts chat messages from Markdown to a polished Wor
 
 You can configure the following settings via the **Valves** button in the plugin settings:
 
-| Valve          | Description                                                                                 | Default      |
-| :------------- | :------------------------------------------------------------------------------------------ | :----------- |
+| Valve | Description | Default |
+| :--- | :--- | :--- |
 | `TITLE_SOURCE` | Source for document title/filename. Options: `chat_title`, `ai_generated`, `markdown_title` | `chat_title` |
+| `MAX_EMBED_IMAGE_MB` | Maximum image size to embed into DOCX (MB). | `20` |
+| `UI_LANGUAGE` | User interface language. Options: `en` (English), `zh` (Chinese). | `en` |
+| `FONT_LATIN` | Font name for Latin characters. | `Times New Roman` |
+| `FONT_ASIAN` | Font name for Asian characters. | `SimSun` |
+| `FONT_CODE` | Font name for code blocks. | `Consolas` |
+| `TABLE_HEADER_COLOR` | Table header background color (Hex without #). | `F2F2F2` |
+| `TABLE_ZEBRA_COLOR` | Table alternating row background color (Hex without #). | `FBFBFB` |
+| `MERMAID_JS_URL` | URL for the Mermaid.js library. | `https://cdn.jsdelivr.net/npm/mermaid@11.12.2/dist/mermaid.min.js` |
+| `MERMAID_JSZIP_URL` | URL for the JSZip library (required for DOCX manipulation). | `https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js` |
+| `MERMAID_PNG_SCALE` | Scale factor for Mermaid PNG generation (Resolution). | `3.0` |
+| `MERMAID_DISPLAY_SCALE` | Scale factor for Mermaid visual size in Word. | `1.0` |
+| `MERMAID_OPTIMIZE_LAYOUT` | Automatically convert LR (Left-Right) flowcharts to TD (Top-Down). | `False` |
+| `MERMAID_BACKGROUND` | Background color for Mermaid diagrams (e.g., `white`, `transparent`). | `transparent` |
+| `MERMAID_CAPTIONS_ENABLE` | Enable/disable figure captions for Mermaid diagrams. | `True` |
+| `MERMAID_CAPTION_STYLE` | Paragraph style name for Mermaid captions. | `Caption` |
+| `MERMAID_CAPTION_PREFIX` | Caption prefix label (e.g., 'Figure'). Empty = auto-detect based on language. | `""` |
+| `MATH_ENABLE` | Enable LaTeX math block conversion. | `True` |
+| `MATH_INLINE_DOLLAR_ENABLE` | Enable inline `$ ... $` math conversion. | `True` |
+
+## 🔥 What's New in v0.4.3
+
+### User-Level Configuration (UserValves)
+
+Users can override the following settings in their personal settings:
+- `TITLE_SOURCE`
+- `UI_LANGUAGE`
+- `FONT_LATIN`, `FONT_ASIAN`, `FONT_CODE`
+- `TABLE_HEADER_COLOR`, `TABLE_ZEBRA_COLOR`
+- `MERMAID_...` (Selected Mermaid settings)
+- `MATH_...` (Math settings)
 
 ---
 
@@ -47,34 +83,41 @@ You can configure the following settings via the **Valves** button in the plugin
 
 ---
 
-## Supported Markdown
+## Supported Markdown Syntax
 
-| Syntax                              | Word Result                    |
-| :---------------------------------- | :----------------------------- |
-| `# Heading 1` to `###### Heading 6` | Heading levels 1-6             |
-| `**bold**` / `__bold__`             | Bold text                      |
-| `*italic*` / `_italic_`             | Italic text                    |
-| `***bold italic***`                 | Bold + Italic                  |
-| `` `inline code` ``                 | Monospace with gray background |
-| <code>``` code block ```</code>     | Syntax-highlighted code block  |
-| `> blockquote`                      | Left-bordered gray italic text |
-| `[link](url)`                       | Blue underlined link           |
-| `~~strikethrough~~`                 | Strikethrough                  |
-| `- item` / `* item`                 | Bullet list                    |
-| `1. item`                           | Numbered list                  |
-| Markdown tables                     | Grid table                     |
-| `---` / `***`                       | Horizontal rule                |
+| Syntax | Word Result |
+| :--- | :--- |
+| `# Heading 1` to `###### Heading 6` | Heading levels 1-6 |
+| `**bold**` or `__bold__` | Bold text |
+| `*italic*` or `_italic_` | Italic text |
+| `***bold italic***` | Bold + Italic |
+| `` `inline code` `` | Monospace with gray background |
+| ` ``` code block ``` ` | **Syntax highlighted** code block |
+| `> blockquote` | Left-bordered gray italic text |
+| `[link](url)` | Blue underlined link text |
+| `~~strikethrough~~` | Strikethrough text |
+| `- item` or `* item` | Bullet list |
+| `1. item` | Numbered list |
+| Markdown tables | **Enhanced table** with smart widths |
+| `---` or `***` | Horizontal rule |
+| `$$LaTeX$$` or `\[LaTeX\]` | **Native Word equation** (display) |
+| `$LaTeX$` or `\(LaTeX\)` | **Native Word equation** (inline) |
+| ` ```mermaid ... ``` ` | **Mermaid diagram** as image |
+| `[1]` citation markers | **Clickable links** to References |
 
 ---
 
 ## Requirements
 
 !!! note "Prerequisites"
-    - `python-docx==1.1.2` (document generation)
-    - `Pygments>=2.15.0` (syntax highlighting, optional but recommended)
+    - `python-docx==1.1.2` - Word document generation
+    - `Pygments>=2.15.0` - Syntax highlighting
+    - `latex2mathml` - LaTeX to MathML conversion
+    - `mathml2omml` - MathML to Office Math (OMML) conversion
 
 ---
 
 ## Source Code
 
 [:fontawesome-brands-github: View on GitHub](https://github.com/Fu-Jie/awesome-openwebui/tree/main/plugins/actions/export_to_docx){ .md-button }
+**Author:** [Fu-Jie](https://github.com/Fu-Jie) | **Version:** 0.4.3 | **Project:** [Awesome OpenWebUI](https://github.com/Fu-Jie/awesome-openwebui)

docs/plugins/actions/export-to-word.zh.md

@@ -1,9 +1,9 @@
 # Export to Word（导出为 Word）
 
 <span class="category-badge action">Action</span>
-<span class="version-badge">v0.1.0</span>
+<span class="version-badge">v0.4.3</span>
 
-将聊天记录按 Markdown 格式导出为 Word (.docx)，支持语法高亮、引用样式和更智能的文件命名。
+将当前对话导出为完美格式的 Word 文档，支持**代码语法高亮**、**原生数学公式**、**Mermaid 图表**、**引用资料**以及**增强表格**渲染。
 
 ---
 
@@ -13,11 +13,17 @@ Export to Word 插件会把聊天消息从 Markdown 转成精致的 Word 文档
 
 ## 功能特性
 
-- :material-file-word-box: **DOCX 导出**：一键生成 Word 文件
-- :material-format-bold: **丰富 Markdown 支持**：标题、粗斜体、列表、表格
-- :material-code-tags: **语法高亮**：Pygments 驱动的代码块上色
-- :material-format-quote-close: **引用样式**：左侧边框的灰色斜体引用
-- :material-file-document-outline: **智能文件名**：可配置标题来源（对话标题、AI 生成或 Markdown 标题）
+- :material-file-word-box: **一键导出**：在聊天界面添加"导出为 Word"动作按钮。
+- :material-format-bold: **Markdown 转换**：将 Markdown 语法转换为 Word 格式（标题、粗体、斜体、代码、表格、列表）。
+- :material-code-tags: **代码语法高亮**：使用 Pygments 库为代码块添加语法高亮（支持 500+ 种语言）。
+- :material-sigma: **原生数学公式**：LaTeX 公式（`$$...$$`、`\[...\]`、`$...$`、`\(...\)`）转换为可编辑的 Word 公式。
+- :material-graph: **Mermaid 图表**：Mermaid 流程图和时序图渲染为文档中的图片。
+- :material-book-open-page-variant: **引用与参考**：自动从 OpenWebUI 来源生成参考资料章节，支持可点击的引用链接。
+- :material-brain-off: **移除思考过程**：自动移除 AI 思考块（`<think>`、`<analysis>`）。
+- :material-table: **增强表格**：智能列宽、列对齐（`:---`、`---:`、`:---:`）、表头跨页重复。
+- :material-format-quote-close: **引用块支持**：Markdown 引用块渲染为带左侧边框的灰色斜体样式。
+- :material-translate: **多语言支持**：正确处理中文和英文文本，无乱码问题。
+- :material-file-document-outline: **智能文件名**：可配置标题来源（对话标题、AI 生成或 Markdown 标题）。
 
 ---
 
@@ -25,9 +31,37 @@ Export to Word 插件会把聊天消息从 Markdown 转成精致的 Word 文档
 
 您可以通过插件设置中的 **Valves** 按钮配置以下选项：
 
-| Valve          | 说明                                                                                                             | 默认值       |
-| :------------- | :--------------------------------------------------------------------------------------------------------------- | :----------- |
-| `TITLE_SOURCE` | 文档标题/文件名的来源。选项：`chat_title` (对话标题), `ai_generated` (AI 生成), `markdown_title` (Markdown 标题) | `chat_title` |
+| Valve | 说明 | 默认值 |
+| :--- | :--- | :--- |
+| `文档标题来源` | 文档标题/文件名的来源。选项：`chat_title` (对话标题), `ai_generated` (AI 生成), `markdown_title` (Markdown 标题) | `chat_title` |
+| `最大嵌入图片大小MB` | 嵌入图片的最大大小 (MB)。 | `20` |
+| `界面语言` | 界面语言。选项：`en` (英语), `zh` (中文)。 | `zh` |
+| `英文字体` | 英文字体名称。 | `Calibri` |
+| `中文字体` | 中文字体名称。 | `SimSun` |
+| `代码字体` | 代码字体名称。 | `Consolas` |
+| `表头背景色` | 表头背景色（十六进制，不带#）。 | `F2F2F2` |
+| `表格隔行背景色` | 表格隔行背景色（十六进制，不带#）。 | `FBFBFB` |
+| `Mermaid_JS地址` | Mermaid.js 库的 URL。 | `https://cdn.jsdelivr.net/npm/mermaid@11.12.2/dist/mermaid.min.js` |
+| `JSZip库地址` | JSZip 库的 URL（用于 DOCX 操作）。 | `https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js` |
+| `Mermaid_PNG缩放比例` | Mermaid PNG 生成缩放比例（分辨率）。 | `3.0` |
+| `Mermaid显示比例` | Mermaid 在 Word 中的显示比例（视觉大小）。 | `1.0` |
+| `Mermaid布局优化` | 优化 Mermaid 布局: 自动将 LR (左右) 转换为 TD (上下)。 | `False` |
+| `Mermaid背景色` | Mermaid 图表背景色（如 `white`, `transparent`）。 | `transparent` |
+| `启用Mermaid图注` | 启用/禁用 Mermaid 图表的图注。 | `True` |
+| `Mermaid图注样式` | Mermaid 图注的段落样式名称。 | `Caption` |
+| `Mermaid图注前缀` | 图注前缀（如 '图'）。留空则根据语言自动检测。 | `""` |
+| `启用数学公式` | 启用 LaTeX 数学公式块转换。 | `True` |
+| `启用行内公式` | 启用行内 `$ ... $` 数学公式转换。 | `True` |
+
+### 用户级配置 (UserValves)
+
+用户可以在个人设置中覆盖以下配置：
+- `文档标题来源`
+- `界面语言`
+- `英文字体`, `中文字体`, `代码字体`
+- `表头背景色`, `表格隔行背景色`
+- `Mermaid_...` (部分 Mermaid 设置)
+- `启用数学公式`, `启用行内公式`
 
 ---
 
@@ -47,23 +81,27 @@ Export to Word 插件会把聊天消息从 Markdown 转成精致的 Word 文档
 
 ---
 
-## 支持的 Markdown
+## 支持的 Markdown 语法
 
-| 语法                        | Word 效果           |
-| :-------------------------- | :------------------ |
-| `# 标题1` 到 `###### 标题6` | 标题级别 1-6        |
-| `**粗体**` / `__粗体__`     | 粗体文本            |
-| `*斜体*` / `_斜体_`         | 斜体文本            |
-| `***粗斜体***`              | 粗体 + 斜体         |
-| `` `行内代码` ``            | 等宽字体 + 灰色背景 |
-| <code>``` 代码块 ```</code> | 语法高亮代码块      |
-| `> 引用文本`                | 左侧边框的灰色斜体  |
-| `[链接](url)`               | 蓝色下划线链接      |
-| `~~删除线~~`                | 删除线              |
-| `- 项目` / `* 项目`         | 无序列表            |
-| `1. 项目`                   | 有序列表            |
-| Markdown 表格               | 带边框表格          |
-| `---` / `***`               | 水平分割线          |
+| 语法 | Word 效果 |
+| :--- | :--- |
+| `# 标题1` 到 `###### 标题6` | 标题级别 1-6 |
+| `**粗体**` / `__粗体__` | 粗体文本 |
+| `*斜体*` / `_斜体_` | 斜体文本 |
+| `***粗斜体***` | 粗体 + 斜体 |
+| `` `行内代码` `` | 等宽字体 + 灰色背景 |
+| <code>``` 代码块 ```</code> | 语法高亮代码块 |
+| `> 引用文本` | 左侧边框的灰色斜体 |
+| `[链接](url)` | 蓝色下划线链接 |
+| `~~删除线~~` | 删除线 |
+| `- 项目` / `* 项目` | 无序列表 |
+| `1. 项目` | 有序列表 |
+| Markdown 表格 | **增强表格**（智能列宽） |
+| `---` / `***` | 水平分割线 |
+| `$$LaTeX$$` 或 `\[LaTeX\]` | **原生 Word 公式**（块级） |
+| `$LaTeX$` 或 `\(LaTeX\)` | **原生 Word 公式**（行内） |
+| ` ```mermaid ... ``` ` | **Mermaid 图表**（图片形式） |
+| `[1]` 引用标记 | **可点击链接**到参考资料 |
 
 ---
 
@@ -71,10 +109,12 @@ Export to Word 插件会把聊天消息从 Markdown 转成精致的 Word 文档
 
 !!! note "前置条件"
     - `python-docx==1.1.2`（文档生成）
-    - `Pygments>=2.15.0`（语法高亮，建议安装）
+    - `Pygments>=2.15.0`（语法高亮）
+    - `latex2mathml`（LaTeX 转 MathML）
+    - `mathml2omml`（MathML 转 Office Math）
 
 ---
 
 ## 源码
 
-[:fontawesome-brands-github: 在 GitHub 查看](https://github.com/Fu-Jie/awesome-openwebui/tree/main/plugins/actions/export_to_docx){ .md-button }
+[:fontawes**Author:** [Fu-Jie](https://github.com/Fu-Jie) | **Version:** 0.4.3 | **Project:** [Awesome OpenWebUI](https://github.com/Fu-Jie/awesome-openwebui)/tree/main/plugins/actions/export_to_docx){ .md-button }

docs/plugins/actions/index.md

@@ -33,7 +33,7 @@ Actions are interactive plugins that:
 
     Transform text into professional infographics using AntV visualization engine with various templates.
 
-    **Version:** 1.3.0
+    **Version:** 1.4.1
 
     [:octicons-arrow-right-24: Documentation](smart-infographic.md)
 
@@ -61,9 +61,9 @@ Actions are interactive plugins that:
 
     ---
 
-    Export the current conversation to a formatted Word doc with syntax highlighting, AI-generated titles, and perfect Markdown rendering (tables, quotes, lists).
-
-    **Version:** 0.1.1
+    Export the current conversation to a formatted Word doc with **syntax highlighting**, **native math equations**, **Mermaid diagrams**, **citations**, and **enhanced table formatting**.
+    
+    **Version:** 0.4.2
 
     [:octicons-arrow-right-24: Documentation](export-to-word.md)
 
@@ -77,6 +77,16 @@ Actions are interactive plugins that:
 
     [:octicons-arrow-right-24: Documentation](summary.md)
 
+-   :material-image-text:{ .lg .middle } **Infographic to Markdown**
+
+    ---
+
+    AI-powered infographic generator that renders SVG and embeds it as Markdown Data URL image.
+
+    **Version:** 1.0.0
+
+    [:octicons-arrow-right-24: Documentation](infographic-markdown.md)
+
 </div>
 
 ---

docs/plugins/actions/index.zh.md

@@ -33,7 +33,7 @@ Actions 是交互式插件，能够：
 
     使用 AntV 可视化引擎，将文本转成专业的信息图。
 
-    **版本：** 1.3.0
+    **版本：** 1.4.1
 
     [:octicons-arrow-right-24: 查看文档](smart-infographic.md)
 
@@ -61,9 +61,9 @@ Actions 是交互式插件，能够：
 
     ---
 
-    将当前对话导出为完美格式的 Word 文档，支持代码语法高亮、AI 智能标题生成以及表格、引用等 Markdown 元素的精准渲染。
+    将当前对话导出为完美格式的 Word 文档，支持**代码语法高亮**、**原生数学公式**、**Mermaid 图表**、**引用资料**以及**增强表格**渲染。
 
-    **版本：** 0.1.1
+    **版本：** 0.4.2
 
     [:octicons-arrow-right-24: 查看文档](export-to-word.md)
 
@@ -77,6 +77,16 @@ Actions 是交互式插件，能够：
 
     [:octicons-arrow-right-24: 查看文档](summary.md)
 
+-   :material-image-text:{ .lg .middle } **信息图转 Markdown**
+
+    ---
+
+    AI 驱动的信息图生成器，渲染 SVG 并以 Markdown Data URL 图片嵌入。
+
+    **版本：** 1.0.0
+
+    [:octicons-arrow-right-24: 查看文档](infographic-markdown.zh.md)
+
 </div>
 
 ---

docs/plugins/actions/infographic-markdown.md

@@ -0,0 +1,120 @@
+# Infographic to Markdown
+
+> **Version:** 1.0.0 | **Author:** Fu-Jie
+
+AI-powered infographic generator that renders SVG on the frontend and embeds it directly into Markdown as a Data URL image.
+
+## Overview
+
+This plugin combines the power of AI text analysis with AntV Infographic visualization to create beautiful infographics that are embedded directly into chat messages as Markdown images.
+
+### Key Features
+
+- :robot: **AI-Powered**: Automatically analyzes text and selects the best infographic template
+- :bar_chart: **Multiple Templates**: Supports 18+ infographic templates (lists, charts, comparisons, etc.)
+- :framed_picture: **Self-Contained**: SVG/PNG embedded as Data URL, no external dependencies
+- :memo: **Markdown Native**: Results are pure Markdown images, compatible everywhere
+- :arrows_counterclockwise: **API Writeback**: Updates message content via REST API for persistence
+
+### How It Works
+
+```mermaid
+graph TD
+    A[User triggers action] --> B[Python extracts message content]
+    B --> C[LLM generates Infographic syntax]
+    C --> D[Frontend JS loads AntV library]
+    D --> E[Render SVG offscreen]
+    E --> F[Export to Data URL]
+    F --> G[Update message via API]
+    G --> H[Display as Markdown image]
+```
+
+## Installation
+
+1. Download `infographic_markdown.py` (English) or `infographic_markdown_cn.py` (Chinese)
+2. Navigate to **Admin Panel** → **Settings** → **Functions**
+3. Upload the file and configure settings
+4. Use the action button in chat messages
+
+## Configuration
+
+| Parameter | Type | Default | Description |
+|-----------|------|---------|-------------|
+| `SHOW_STATUS` | bool | `true` | Show operation status updates |
+| `MODEL_ID` | string | `""` | LLM model ID (empty = use current model) |
+| `MIN_TEXT_LENGTH` | int | `50` | Minimum text length required |
+| `MESSAGE_COUNT` | int | `1` | Number of recent messages to use |
+| `SVG_WIDTH` | int | `800` | Width of generated SVG (pixels) |
+| `EXPORT_FORMAT` | string | `"svg"` | Export format: `svg` or `png` |
+
+## Supported Templates
+
+| Category | Template | Description |
+|----------|----------|-------------|
+| List | `list-grid` | Grid cards |
+| List | `list-vertical` | Vertical list |
+| Tree | `tree-vertical` | Vertical tree |
+| Tree | `tree-horizontal` | Horizontal tree |
+| Mind Map | `mindmap` | Mind map |
+| Process | `sequence-roadmap` | Roadmap |
+| Process | `sequence-zigzag` | Zigzag process |
+| Relation | `relation-sankey` | Sankey diagram |
+| Relation | `relation-circle` | Circular relation |
+| Compare | `compare-binary` | Binary comparison |
+| Analysis | `compare-swot` | SWOT analysis |
+| Quadrant | `quadrant-quarter` | Quadrant chart |
+| Chart | `chart-bar` | Bar chart |
+| Chart | `chart-column` | Column chart |
+| Chart | `chart-line` | Line chart |
+| Chart | `chart-pie` | Pie chart |
+| Chart | `chart-doughnut` | Doughnut chart |
+| Chart | `chart-area` | Area chart |
+
+## Usage Example
+
+1. Generate some text content in the chat (or have the AI generate it)
+2. Click the **📊 Infographic to Markdown** action button
+3. Wait for AI analysis and SVG rendering
+4. The infographic will be embedded as a Markdown image
+
+## Technical Details
+
+### Data URL Embedding
+
+The plugin converts SVG graphics to Base64-encoded Data URLs:
+
+```javascript
+const svgData = new XMLSerializer().serializeToString(svg);
+const base64 = btoa(unescape(encodeURIComponent(svgData)));
+const dataUri = "data:image/svg+xml;base64," + base64;
+const markdownImage = `![description](${dataUri})`;
+```
+
+### AntV toDataURL API
+
+```javascript
+// Export as SVG (recommended)
+const svgUrl = await instance.toDataURL({
+    type: 'svg',
+    embedResources: true
+});
+
+// Export as PNG
+const pngUrl = await instance.toDataURL({
+    type: 'png',
+    dpr: 2
+});
+```
+
+## Notes
+
+1. **Browser Compatibility**: Requires modern browsers with ES6+ and Fetch API support
+2. **Network Dependency**: First use requires loading AntV library from CDN
+3. **Data URL Size**: Base64 encoding increases size by ~33%
+4. **Chinese Fonts**: SVG export embeds fonts for correct display
+
+## Related Resources
+
+- [AntV Infographic Documentation](https://infographic.antv.vision/)
+- [Infographic API Reference](https://infographic.antv.vision/reference/infographic-api)
+- [Infographic Syntax Guide](https://infographic.antv.vision/learn/infographic-syntax)

docs/plugins/actions/infographic-markdown.zh.md

@@ -0,0 +1,120 @@
+# 信息图转 Markdown
+
+> **版本:** 1.0.0 | **作者:** Fu-Jie
+
+AI 驱动的信息图生成器，在前端渲染 SVG 并以 Data URL 图片格式直接嵌入到 Markdown 中。
+
+## 概述
+
+这个插件结合了 AI 文本分析能力和 AntV Infographic 可视化引擎，生成精美的信息图并以 Markdown 图片格式直接嵌入到聊天消息中。
+
+### 主要特性
+
+- :robot: **AI 驱动**: 自动分析文本并选择最佳的信息图模板
+- :bar_chart: **多种模板**: 支持 18+ 种信息图模板（列表、图表、对比等）
+- :framed_picture: **自包含**: SVG/PNG 以 Data URL 嵌入，无外部依赖
+- :memo: **Markdown 原生**: 结果是纯 Markdown 图片，兼容任何平台
+- :arrows_counterclockwise: **API 回写**: 通过 REST API 更新消息内容实现持久化
+
+### 工作原理
+
+```mermaid
+graph TD
+    A[用户触发动作] --> B[Python 提取消息内容]
+    B --> C[LLM 生成 Infographic 语法]
+    C --> D[前端 JS 加载 AntV 库]
+    D --> E[离屏渲染 SVG]
+    E --> F[导出为 Data URL]
+    F --> G[通过 API 更新消息]
+    G --> H[显示为 Markdown 图片]
+```
+
+## 安装
+
+1. 下载 `infographic_markdown.py`（英文版）或 `infographic_markdown_cn.py`（中文版）
+2. 进入 **管理面板** → **设置** → **功能**
+3. 上传文件并配置设置
+4. 在聊天消息中使用动作按钮
+
+## 配置选项
+
+| 参数 | 类型 | 默认值 | 描述 |
+|------|------|--------|------|
+| `SHOW_STATUS` | bool | `true` | 是否显示操作状态 |
+| `MODEL_ID` | string | `""` | LLM 模型 ID（空则使用当前模型） |
+| `MIN_TEXT_LENGTH` | int | `50` | 最小文本长度要求 |
+| `MESSAGE_COUNT` | int | `1` | 用于生成的最近消息数量 |
+| `SVG_WIDTH` | int | `800` | 生成的 SVG 宽度（像素） |
+| `EXPORT_FORMAT` | string | `"svg"` | 导出格式：`svg` 或 `png` |
+
+## 支持的模板
+
+| 类别 | 模板名称 | 描述 |
+|------|----------|------|
+| 列表 | `list-grid` | 网格卡片 |
+| 列表 | `list-vertical` | 垂直列表 |
+| 树形 | `tree-vertical` | 垂直树 |
+| 树形 | `tree-horizontal` | 水平树 |
+| 思维导图 | `mindmap` | 思维导图 |
+| 流程 | `sequence-roadmap` | 路线图 |
+| 流程 | `sequence-zigzag` | 折线流程 |
+| 关系 | `relation-sankey` | 桑基图 |
+| 关系 | `relation-circle` | 圆形关系 |
+| 对比 | `compare-binary` | 二元对比 |
+| 分析 | `compare-swot` | SWOT 分析 |
+| 象限 | `quadrant-quarter` | 四象限图 |
+| 图表 | `chart-bar` | 条形图 |
+| 图表 | `chart-column` | 柱状图 |
+| 图表 | `chart-line` | 折线图 |
+| 图表 | `chart-pie` | 饼图 |
+| 图表 | `chart-doughnut` | 环形图 |
+| 图表 | `chart-area` | 面积图 |
+
+## 使用示例
+
+1. 在聊天中生成一些文本内容（或让 AI 生成）
+2. 点击 **📊 信息图转 Markdown** 动作按钮
+3. 等待 AI 分析和 SVG 渲染
+4. 信息图将以 Markdown 图片形式嵌入
+
+## 技术细节
+
+### Data URL 嵌入
+
+插件将 SVG 图形转换为 Base64 编码的 Data URL：
+
+```javascript
+const svgData = new XMLSerializer().serializeToString(svg);
+const base64 = btoa(unescape(encodeURIComponent(svgData)));
+const dataUri = "data:image/svg+xml;base64," + base64;
+const markdownImage = `![描述](${dataUri})`;
+```
+
+### AntV toDataURL API
+
+```javascript
+// 导出 SVG（推荐）
+const svgUrl = await instance.toDataURL({
+    type: 'svg',
+    embedResources: true
+});
+
+// 导出 PNG
+const pngUrl = await instance.toDataURL({
+    type: 'png',
+    dpr: 2
+});
+```
+
+## 注意事项
+
+1. **浏览器兼容性**: 需要现代浏览器支持 ES6+ 和 Fetch API
+2. **网络依赖**: 首次使用需要从 CDN 加载 AntV Infographic 库
+3. **Data URL 大小**: Base64 编码会增加约 33% 的体积
+4. **中文字体**: SVG 导出时会嵌入字体以确保正确显示
+
+## 相关资源
+
+- [AntV Infographic 官方文档](https://infographic.antv.vision/)
+- [Infographic API 参考](https://infographic.antv.vision/reference/infographic-api)
+- [Infographic 语法规范](https://infographic.antv.vision/learn/infographic-syntax)

docs/plugins/actions/smart-infographic.md

@@ -1,7 +1,7 @@
 # Smart Infographic
 
 <span class="category-badge action">Action</span>
-<span class="version-badge">v1.3.0</span>
+<span class="version-badge">v1.4.0</span>
 
 An AntV Infographic engine powered plugin that transforms long text into professional, beautiful infographics with a single click.
 
@@ -19,6 +19,8 @@ The Smart Infographic plugin uses AI to analyze text content and generate profes
 - :material-download: **Multi-Format Export**: Download your infographics as **SVG**, **PNG**, or **Standalone HTML** file
 - :material-theme-light-dark: **Theme Support**: Supports Dark/Light modes, auto-adapts theme colors
 - :material-cellphone-link: **Responsive Design**: Generated charts look great on both desktop and mobile devices
+- :material-image: **Image Embedding**: Option to embed charts as static images for better compatibility
+- :material-monitor-screenshot: **Adaptive Sizing**: Images automatically adapt to the chat container width
 
 ---
 
@@ -60,6 +62,7 @@ The Smart Infographic plugin uses AI to analyze text content and generate profes
 | `MIN_TEXT_LENGTH` | integer | `100` | Minimum characters required to trigger analysis |
 | `CLEAR_PREVIOUS_HTML` | boolean | `false` | Whether to clear previous charts |
 | `MESSAGE_COUNT` | integer | `1` | Number of recent messages to use for analysis |
+| `OUTPUT_MODE` | string | `image` | `image` for static image embedding (default), `html` for interactive chart |
 
 ---
 

docs/plugins/actions/smart-infographic.zh.md

@@ -1,7 +1,7 @@
 # Smart Infographic（智能信息图）
 
 <span class="category-badge action">Action</span>
-<span class="version-badge">v1.0.0</span>
+<span class="version-badge">v1.4.0</span>
 
 基于 AntV 信息图引擎，将长文本一键转成专业、美观的信息图。
 
@@ -19,6 +19,8 @@ Smart Infographic 使用 AI 分析文本，并基于 AntV 可视化引擎生成
 - :material-download: **多格式导出**：支持下载 **SVG**、**PNG**、**独立 HTML**
 - :material-theme-light-dark: **主题支持**：适配深色/浅色模式
 - :material-cellphone-link: **响应式**：桌面与移动端都能良好展示
+- :material-image: **图片嵌入**：支持将图表作为静态图片嵌入，兼容性更好
+- :material-monitor-screenshot: **自适应尺寸**：图片模式下自动适应聊天容器宽度
 
 ---
 
@@ -60,6 +62,7 @@ Smart Infographic 使用 AI 分析文本，并基于 AntV 可视化引擎生成
 | `MIN_TEXT_LENGTH` | integer | `100` | 触发分析的最小字符数 |
 | `CLEAR_PREVIOUS_HTML` | boolean | `false` | 是否清空之前生成的图表 |
 | `MESSAGE_COUNT` | integer | `1` | 参与分析的最近消息条数 |
+| `OUTPUT_MODE` | string | `image` | `image` 为静态图片嵌入（默认），`html` 为交互式图表 |
 
 ---
 

plugins/actions/ACTION_PLUGIN_TEMPLATE.py

@@ -315,7 +315,7 @@ class Action:
                     if role == "user"
                     else "Assistant" if role == "assistant" else role
                 )
-                aggregated_parts.append(f"[{role_label} Message {i}]\n{text_content}")
+                aggregated_parts.append(f"{text_content}")
 
         if not aggregated_parts:
             return body  # Or handle error

plugins/actions/ACTION_PLUGIN_TEMPLATE_CN.py

@@ -326,7 +326,7 @@ class Action:
                     if role == "user"
                     else "助手" if role == "assistant" else role
                 )
-                aggregated_parts.append(f"[{role_label} 消息 {i}]\n{text_content}")
+                aggregated_parts.append(f"{text_content}")
 
         if not aggregated_parts:
             return body  # 或者处理错误

plugins/actions/export_to_docx/README.md

@@ -1,95 +1,88 @@
-# Export to Word
+# 📝 Export to Word (Enhanced)
+
+**Author:** [Fu-Jie](https://github.com/Fu-Jie) | **Version:** 0.4.3 | **Project:** [Awesome OpenWebUI](https://github.com/Fu-Jie/awesome-openwebui)
 
 Export conversation to Word (.docx) with **syntax highlighting**, **native math equations**, **Mermaid diagrams**, **citations**, and **enhanced table formatting**.
 
-## Features
+## 🔥 What's New in v0.4.3
 
-- **One-Click Export**: Adds an "Export to Word" action button to the chat.
-- **Markdown Conversion**: Converts Markdown syntax to Word formatting (headings, bold, italic, code, tables, lists).
-- **Syntax Highlighting**: Code blocks are highlighted with Pygments (supports 500+ languages).
-- **Native Math Equations**: LaTeX math (`$$...$$`, `\[...\]`, `$...$`, `\(...\)`) converted to editable Word equations.
-- **Mermaid Diagrams**: Mermaid flowcharts and sequence diagrams rendered as images in the document.
-- **Citations & References**: Auto-generates a References section from OpenWebUI sources with clickable citation links.
-- **Reasoning Stripping**: Automatically removes AI thinking blocks (`<think>`, `<analysis>`) from exports.
-- **Enhanced Tables**: Smart column widths, column alignment (`:---`, `---:`, `:---:`), header row repeat across pages.
-- **Blockquote Support**: Markdown blockquotes are rendered with left border and gray styling.
-- **Multi-language Support**: Properly handles both Chinese and English text.
-- **Smarter Filenames**: Configurable title source (Chat Title, AI Generated, or Markdown Title).
+- ✨ **S3 Object Storage Support**: Direct access to images stored in S3/MinIO via boto3, bypassing API layer for faster exports.
+- 🔧 **Multi-level File Fallback**: 6-level fallback mechanism for file retrieval (DB → S3 → Local → URL → API → Attributes).
+- 🛡️ **Improved Error Handling**: Better logging and error messages for file retrieval failures.
 
-## Configuration
+## ✨ Key Features
 
-You can configure the following settings via the **Valves** button in the plugin settings:
+- 🚀 **One-Click Export**: Adds an "Export to Word" action button to the chat.
+- 📄 **Markdown Conversion**: Full Markdown syntax support (headings, bold, italic, code, tables, lists).
+- 🎨 **Syntax Highlighting**: Code blocks highlighted with Pygments (500+ languages).
+- 🔢 **Native Math Equations**: LaTeX math (`$$...$$`, `\[...\]`, `$...$`) converted to editable Word equations.
+- 📊 **Mermaid Diagrams**: Flowcharts and sequence diagrams rendered as images.
+- 📚 **Citations & References**: Auto-generates References section with clickable citation links.
+- 🧹 **Reasoning Stripping**: Automatically removes AI thinking blocks (`<think>`, `<analysis>`).
+- 📋 **Enhanced Tables**: Smart column widths, alignment, header row repeat across pages.
+- 💬 **Blockquote Support**: Markdown blockquotes with left border and gray styling.
+- 🌐 **Multi-language Support**: Proper handling of Chinese and English text.
 
-- **TITLE_SOURCE**: Choose how the document title/filename is generated.
-    - `chat_title`: Use the conversation title (default).
-    - `ai_generated`: Use AI to generate a short title based on the content.
-    - `markdown_title`: Extract the first h1/h2 heading from the Markdown content.
-- **MERMAID_JS_URL**: URL for the Mermaid.js library (for diagram rendering).
-- **MERMAID_PNG_SCALE**: Scale factor for Mermaid PNG generation (Resolution). Default: `3.0`.
-- **MERMAID_DISPLAY_SCALE**: Scale factor for Mermaid visual size in Word. Default: `1.5`.
-- **MERMAID_OPTIMIZE_LAYOUT**: Automatically convert LR (Left-Right) flowcharts to TD (Top-Down). Default: `True`.
-- **MERMAID_CAPTIONS_ENABLE**: Enable/disable figure captions for Mermaid diagrams.
+## 🚀 How to Use
 
-## Supported Markdown Syntax
+1. **Install**: Search for "Export to Word" in the Open WebUI Community and install.
+2. **Trigger**: In any chat, click the "Export to Word" action button.
+3. **Download**: The .docx file will be automatically downloaded.
 
-| Syntax                              | Word Result                           |
-| :---------------------------------- | :------------------------------------ |
-| `# Heading 1` to `###### Heading 6` | Heading levels 1-6                    |
-| `**bold**` or `__bold__`            | Bold text                             |
-| `*italic*` or `_italic_`            | Italic text                           |
-| `***bold italic***`                 | Bold + Italic                         |
-| `` `inline code` ``                 | Monospace with gray background        |
-| ` ``` code block ``` `              | **Syntax highlighted** code block     |
-| `> blockquote`                      | Left-bordered gray italic text        |
-| `[link](url)`                       | Blue underlined link text             |
-| `~~strikethrough~~`                 | Strikethrough text                    |
-| `- item` or `* item`                | Bullet list                           |
-| `1. item`                           | Numbered list                         |
-| Markdown tables                     | **Enhanced table** with smart widths  |
-| `---` or `***`                      | Horizontal rule                       |
-| `$$LaTeX$$` or `\[LaTeX\]`          | **Native Word equation** (display)    |
-| `$LaTeX$` or `\(LaTeX\)`            | **Native Word equation** (inline)     |
-| ` ```mermaid ... ``` `              | **Mermaid diagram** as image          |
-| `[1]` citation markers              | **Clickable links** to References     |
+## ⚙️ Configuration (Valves)
 
-## Usage
+| Parameter | Default | Description |
+| :--- | :--- | :--- |
+| **Title Source (TITLE_SOURCE)** | `chat_title` | `chat_title`, `ai_generated`, or `markdown_title` |
+| **Max Image Size (MAX_EMBED_IMAGE_MB)** | `20` | Maximum image size to embed (MB) |
+| **UI Language (UI_LANGUAGE)** | `en` | `en` (English) or `zh` (Chinese) |
+| **Latin Font (FONT_LATIN)** | `Times New Roman` | Font for Latin characters |
+| **Asian Font (FONT_ASIAN)** | `SimSun` | Font for Asian characters |
+| **Code Font (FONT_CODE)** | `Consolas` | Font for code blocks |
+| **Table Header Color** | `F2F2F2` | Header background color (hex) |
+| **Table Zebra Color** | `FBFBFB` | Alternating row color (hex) |
+| **Mermaid PNG Scale** | `3.0` | Resolution multiplier for Mermaid images |
+| **Math Enable** | `True` | Enable LaTeX math conversion |
 
-1. Install the plugin.
-2. In any chat, click the "Export to Word" button.
-3. The .docx file will be automatically downloaded to your device.
+## 🛠️ Supported Markdown Syntax
 
-## Requirements
+| Syntax | Word Result |
+| :--- | :--- |
+| `# Heading 1` to `###### Heading 6` | Heading levels 1-6 |
+| `**bold**` or `__bold__` | Bold text |
+| `*italic*` or `_italic_` | Italic text |
+| `` `inline code` `` | Monospace with gray background |
+| ` ``` code block ``` ` | **Syntax highlighted** code block |
+| `> blockquote` | Left-bordered gray italic text |
+| `[link](url)` | Blue underlined link |
+| `~~strikethrough~~` | Strikethrough text |
+| `- item` or `* item` | Bullet list |
+| `1. item` | Numbered list |
+| Markdown tables | **Enhanced table** with smart widths |
+| `$$LaTeX$$` or `\[LaTeX\]` | **Native Word equation** (display) |
+| `$LaTeX$` or `\(LaTeX\)` | **Native Word equation** (inline) |
+| ` ```mermaid ... ``` ` | **Mermaid diagram** as image |
+| `[1]` citation markers | **Clickable links** to References |
+
+## 📦 Requirements
 
 - `python-docx==1.1.2` - Word document generation
 - `Pygments>=2.15.0` - Syntax highlighting
 - `latex2mathml` - LaTeX to MathML conversion
 - `mathml2omml` - MathML to Office Math (OMML) conversion
 
-All dependencies are declared in the plugin docstring.
+## 📝 Changelog
 
-## Font Configuration
+### v0.4.3
+- **S3 Object Storage**: Direct S3/MinIO access via boto3 for faster image retrieval.
+- **6-Level Fallback**: Robust file retrieval: DB → S3 → Local → URL → API → Attributes.
+- **Better Logging**: Improved error messages for debugging file access issues.
 
-- **English Text**: Times New Roman
-- **Chinese Text**: SimSun (宋体) for body, SimHei (黑体) for headings
-- **Code**: Consolas
+### v0.4.1
+- **Chinese Parameter Names**: Localized configuration names for Chinese version.
 
-## Changelog
-
-### v0.2.0
-- Added native math equation support (LaTeX → OMML)
-- Added Mermaid diagram rendering
-- Added citations and references section generation
-- Added automatic reasoning block stripping
-- Enhanced table formatting with smart column widths and alignment
-
-### v0.1.1
-- Initial release with basic Markdown to Word conversion
-
-## Author
-
-Fu-Jie  
-GitHub: [Fu-Jie/awesome-openwebui](https://github.com/Fu-Jie/awesome-openwebui)
-
-## License
-
-MIT License
+### v0.4.0
+- **Multi-language Support**: UI language switching (English/Chinese).
+- **Font & Style Configuration**: Customizable fonts and table colors.
+- **Mermaid Enhancements**: Hybrid SVG+PNG rendering, background color config.
+- **Performance**: Real-time progress updates for large exports.

plugins/actions/export_to_docx/README_CN.md

@@ -1,95 +1,88 @@
-# 导出为 Word
+# 📝 导出为 Word (增强版)
+
+**Author:** [Fu-Jie](https://github.com/Fu-Jie) | **Version:** 0.4.3 | **Project:** [Awesome OpenWebUI](https://github.com/Fu-Jie/awesome-openwebui)
 
 将对话导出为 Word (.docx)，支持**代码语法高亮**、**原生数学公式**、**Mermaid 图表**、**引用参考**和**增强表格格式**。
 
-## 功能特点
+## 🔥 v0.4.3 更新内容
 
-- **一键导出**：在聊天界面添加"导出为 Word"动作按钮。
-- **Markdown 转换**：将 Markdown 语法转换为 Word 格式（标题、粗体、斜体、代码、表格、列表）。
-- **代码语法高亮**：使用 Pygments 库为代码块添加语法高亮（支持 500+ 种语言）。
-- **原生数学公式**：LaTeX 公式（`$$...$$`、`\[...\]`、`$...$`、`\(...\)`）转换为可编辑的 Word 公式。
-- **Mermaid 图表**：Mermaid 流程图和时序图渲染为文档中的图片。
-- **引用与参考**：自动从 OpenWebUI 来源生成参考资料章节，支持可点击的引用链接。
-- **移除思考过程**：自动移除 AI 思考块（`<think>`、`<analysis>`）。
-- **增强表格**：智能列宽、列对齐（`:---`、`---:`、`:---:`）、表头跨页重复。
-- **引用块支持**：Markdown 引用块渲染为带左侧边框的灰色斜体样式。
-- **多语言支持**：正确处理中文和英文文本，无乱码问题。
-- **智能文件名**：可配置标题来源（对话标题、AI 生成或 Markdown 标题）。
+- ✨ **S3 对象存储支持**: 通过 boto3 直连 S3/MinIO，绕过 API 层，导出速度更快。
+- 🔧 **多级文件回退**: 6 级文件获取机制（数据库 → S3 → 本地 → URL → API → 属性）。
+- 🛡️ **错误处理优化**: 更完善的日志记录和错误提示，便于调试文件访问问题。
 
-## 配置
+## ✨ 核心特性
 
-您可以通过插件设置中的 **Valves** 按钮配置以下选项：
+- 🚀 **一键导出**: 在聊天界面添加"导出为 Word"动作按钮。
+- 📄 **Markdown 转换**: 完整支持 Markdown 语法（标题、粗体、斜体、代码、表格、列表）。
+- 🎨 **代码语法高亮**: 使用 Pygments 库高亮代码块（支持 500+ 种语言）。
+- 🔢 **原生数学公式**: LaTeX 公式（`$$...$$`、`\[...\]`、`$...$`）转换为可编辑的 Word 公式。
+- 📊 **Mermaid 图表**: 流程图和时序图渲染为文档中的图片。
+- 📚 **引用与参考**: 自动生成参考资料章节，支持可点击的引用链接。
+- 🧹 **移除思考过程**: 自动移除 AI 思考块（`<think>`、`<analysis>`）。
+- 📋 **增强表格**: 智能列宽、对齐、表头跨页重复。
+- 💬 **引用块支持**: Markdown 引用块渲染为带左侧边框的灰色斜体样式。
+- 🌐 **多语言支持**: 正确处理中文和英文文本。
 
-- **TITLE_SOURCE**：选择文档标题/文件名的生成方式。
-    - `chat_title`：使用对话标题（默认）。
-    - `ai_generated`：使用 AI 根据内容生成简短标题。
-    - `markdown_title`：从 Markdown 内容中提取第一个一级或二级标题。
-- **MERMAID_JS_URL**：Mermaid.js 库的 URL（用于图表渲染）。
-- **MERMAID_PNG_SCALE**：Mermaid PNG 生成缩放比例（分辨率）。默认：`3.0`。
-- **MERMAID_DISPLAY_SCALE**：Mermaid 在 Word 中的显示比例（视觉大小）。默认：`1.5`。
-- **MERMAID_OPTIMIZE_LAYOUT**：自动将 LR（左右）流程图转换为 TD（上下）。默认：`True`。
-- **MERMAID_CAPTIONS_ENABLE**：启用/禁用 Mermaid 图表的图注。
+## 🚀 使用方法
 
-## 支持的 Markdown 语法
+1. **安装**: 在 Open WebUI 社区搜索 "导出为 Word" 并安装。
+2. **触发**: 在任意对话中，点击"导出为 Word"动作按钮。
+3. **下载**: .docx 文件将自动下载到你的设备。
 
-| 语法                          | Word 效果                         |
-| :---------------------------- | :-------------------------------- |
-| `# 标题1` 到 `###### 标题6`   | 标题级别 1-6                      |
-| `**粗体**` 或 `__粗体__`      | 粗体文本                          |
-| `*斜体*` 或 `_斜体_`          | 斜体文本                          |
-| `***粗斜体***`                | 粗体 + 斜体                       |
-| `` `行内代码` ``              | 等宽字体 + 灰色背景               |
-| ` ``` 代码块 ``` `            | **语法高亮**的代码块              |
-| `> 引用文本`                  | 带左侧边框的灰色斜体文本          |
-| `[链接](url)`                 | 蓝色下划线链接文本                |
-| `~~删除线~~`                  | 删除线文本                        |
-| `- 项目` 或 `* 项目`          | 无序列表                          |
-| `1. 项目`                     | 有序列表                          |
-| Markdown 表格                 | **增强表格**（智能列宽）          |
-| `---` 或 `***`                | 水平分割线                        |
-| `$$LaTeX$$` 或 `\[LaTeX\]`    | **原生 Word 公式**（块级）        |
-| `$LaTeX$` 或 `\(LaTeX\)`      | **原生 Word 公式**（行内）        |
-| ` ```mermaid ... ``` `        | **Mermaid 图表**（图片形式）      |
-| `[1]` 引用标记                | **可点击链接**到参考资料          |
+## ⚙️ 配置参数 (Valves)
 
-## 使用方法
+| 参数 | 默认值 | 说明 |
+| :--- | :--- | :--- |
+| **文档标题来源** | `chat_title` | `chat_title`（对话标题）、`ai_generated`（AI 生成）、`markdown_title`（Markdown 标题）|
+| **最大嵌入图片大小MB** | `20` | 嵌入图片的最大大小 (MB) |
+| **界面语言** | `zh` | `en`（英语）或 `zh`（中文）|
+| **英文字体** | `Calibri` | 英文字体名称 |
+| **中文字体** | `SimSun` | 中文字体名称 |
+| **代码字体** | `Consolas` | 代码块字体名称 |
+| **表头背景色** | `F2F2F2` | 表头背景色（十六进制）|
+| **表格隔行背景色** | `FBFBFB` | 表格隔行背景色（十六进制）|
+| **Mermaid_PNG缩放比例** | `3.0` | Mermaid 图片分辨率倍数 |
+| **启用数学公式** | `True` | 启用 LaTeX 公式转换 |
 
-1. 安装插件。
-2. 在任意对话中，点击"导出为 Word"按钮。
-3. .docx 文件将自动下载到你的设备。
+## 🛠️ 支持的 Markdown 语法
 
-## 依赖
+| 语法 | Word 效果 |
+| :--- | :--- |
+| `# 标题1` 到 `###### 标题6` | 标题级别 1-6 |
+| `**粗体**` 或 `__粗体__` | 粗体文本 |
+| `*斜体*` 或 `_斜体_` | 斜体文本 |
+| `` `行内代码` `` | 等宽字体 + 灰色背景 |
+| ` ``` 代码块 ``` ` | **语法高亮**的代码块 |
+| `> 引用文本` | 带左侧边框的灰色斜体文本 |
+| `[链接](url)` | 蓝色下划线链接文本 |
+| `~~删除线~~` | 删除线文本 |
+| `- 项目` 或 `* 项目` | 无序列表 |
+| `1. 项目` | 有序列表 |
+| Markdown 表格 | **增强表格**（智能列宽）|
+| `$$LaTeX$$` 或 `\[LaTeX\]` | **原生 Word 公式**（块级）|
+| `$LaTeX$` 或 `\(LaTeX\)` | **原生 Word 公式**（行内）|
+| ` ```mermaid ... ``` ` | **Mermaid 图表**（图片形式）|
+| `[1]` 引用标记 | **可点击链接**到参考资料 |
+
+## 📦 依赖
 
 - `python-docx==1.1.2` - Word 文档生成
 - `Pygments>=2.15.0` - 语法高亮
 - `latex2mathml` - LaTeX 转 MathML
 - `mathml2omml` - MathML 转 Office Math (OMML)
 
-所有依赖已在插件文档字符串中声明。
+## 📝 更新日志
 
-## 字体配置
+### v0.4.3
+- **S3 对象存储**: 通过 boto3 直连 S3/MinIO，图片获取速度更快。
+- **6 级回退机制**: 稳健的文件获取：数据库 → S3 → 本地 → URL → API → 属性。
+- **日志优化**: 改进错误提示，便于调试文件访问问题。
 
-- **英文文本**：Times New Roman
-- **中文文本**：宋体（正文）、黑体（标题）
-- **代码**：Consolas
+### v0.4.1
+- **中文参数名**: 配置项名称和描述全部汉化。
 
-## 更新日志
-
-### v0.2.0
-- 新增原生数学公式支持（LaTeX → OMML）
-- 新增 Mermaid 图表渲染
-- 新增引用与参考资料章节生成
-- 新增自动移除 AI 思考块
-- 增强表格格式（智能列宽、对齐）
-
-### v0.1.1
-- 初始版本，支持基本 Markdown 转 Word
-
-## 作者
-
-Fu-Jie  
-GitHub: [Fu-Jie/awesome-openwebui](https://github.com/Fu-Jie/awesome-openwebui)
-
-## 许可证
-
-MIT License
+### v0.4.0
+- **多语言支持**: 界面语言切换（中文/英文）。
+- **字体与样式配置**: 支持自定义中英文字体、代码字体以及表格颜色。
+- **Mermaid 增强**: 混合 SVG+PNG 渲染，支持背景色配置。
+- **性能优化**: 导出大型文档时提供实时进度反馈。

plugins/actions/export_to_excel/export_to_excel.py

@@ -4,6 +4,7 @@ author: Fu-Jie
 author_url: https://github.com/Fu-Jie
 funding_url: https://github.com/Fu-Jie/awesome-openwebui
 version: 0.3.7
+openwebui_id: 244b8f9d-7459-47d6-84d3-c7ae8e3ec710
 icon_url: data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0xNSAySDZhMiAyIDAgMCAwLTIgMnYxNmEyIDIgMCAwIDAgMiAyaDEyYTIgMiAwIDAgMCAyLTJWN1oiLz48cGF0aCBkPSJNMTQgMnY0YTIgMiAwIDAgMCAyIDJoNCIvPjxwYXRoIGQ9Ik04IDEzaDIiLz48cGF0aCBkPSJNMTQgMTNoMiIvPjxwYXRoIGQ9Ik04IDE3aDIiLz48cGF0aCBkPSJNMTQgMTdoMiIvPjwvc3ZnPg==
 description: Extracts tables from chat messages and exports them to Excel (.xlsx) files with smart formatting.
 """

plugins/actions/flash-card/README.md

@@ -48,3 +48,9 @@ GitHub: [Fu-Jie/awesome-openwebui](https://github.com/Fu-Jie/awesome-openwebui)
 ## License
 
 MIT License
+
+## Changelog
+
+### v0.2.4
+
+- Removed debug messages from output

plugins/actions/flash-card/README_CN.md

@@ -48,3 +48,9 @@ GitHub: [Fu-Jie/awesome-openwebui](https://github.com/Fu-Jie/awesome-openwebui)
 ## 许可证
 
 MIT License
+
+## 更新日志
+
+### v0.2.4
+
+- 移除输出中的调试信息

plugins/actions/flash-card/flash_card.py

@@ -3,7 +3,8 @@ title: Flash Card
 author: Fu-Jie
 author_url: https://github.com/Fu-Jie
 funding_url: https://github.com/Fu-Jie/awesome-openwebui
-version: 0.2.3
+version: 0.2.4
+openwebui_id: 65a2ea8f-2a13-4587-9d76-55eea0035cc8
 icon_url: data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwb2x5Z29uIHBvaW50cz0iMTIgMiAyIDcgMTIgMTIgMjIgNyAxMiAyIi8+PHBvbHlsaW5lIHBvaW50cz0iMiAxNyAxMiAyMiAyMiAxNyIvPjxwb2x5bGluZSBwb2ludHM9IjIgMTIgMTIgMTcgMjIgMTIiLz48L3N2Zz4=
 description: Quickly generates beautiful flashcards from text, extracting key points and categories.
 """
@@ -147,7 +148,7 @@ class Action:
                     if role == "user"
                     else "Assistant" if role == "assistant" else role
                 )
-                aggregated_parts.append(f"[{role_label} Message {i}]\n{text_content}")
+                aggregated_parts.append(f"{text_content}")
 
         if not aggregated_parts:
             return body

plugins/actions/flash-card/flash_card_cn.py

@@ -3,7 +3,8 @@ title: 闪记卡 (Flash Card)
 author: Fu-Jie
 author_url: https://github.com/Fu-Jie
 funding_url: https://github.com/Fu-Jie/awesome-openwebui
-version: 0.2.3
+version: 0.2.4
+openwebui_id: 4a31eac3-a3c4-4c30-9ca5-dab36b5fac65
 icon_url: data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwb2x5Z29uIHBvaW50cz0iMTIgMiAyIDcgMTIgMTIgMjIgNyAxMiAyIi8+PHBvbHlsaW5lIHBvaW50cz0iMiAxNyAxMiAyMiAyMiAxNyIvPjxwb2x5bGluZSBwb2ludHM9IjIgMTIgMTIgMTcgMjIgMTIiLz48L3N2Zz4=
 description: 快速将文本提炼为精美的学习记忆卡片，支持核心要点提取与分类。
 """
@@ -144,7 +145,7 @@ class Action:
                     if role == "user"
                     else "助手" if role == "assistant" else role
                 )
-                aggregated_parts.append(f"[{role_label} 消息 {i}]\n{text_content}")
+                aggregated_parts.append(f"{text_content}")
 
         if not aggregated_parts:
             return body

plugins/actions/infographic/README.md

@@ -1,7 +1,19 @@
 # 📊 Smart Infographic (AntV)
 
+**Author:** [Fu-Jie](https://github.com/Fu-Jie) | **Version:** 1.4.1 | **Project:** [Awesome OpenWebUI](https://github.com/Fu-Jie/awesome-openwebui)
+
 An Open WebUI plugin powered by the AntV Infographic engine. It transforms long text into professional, beautiful infographics with a single click.
 
+## 🔥 What's New in v1.4.1
+
+- ✨ **PNG Upload**: Infographics now upload as PNG format for better Word export compatibility.
+- 🔧 **Canvas Conversion**: Uses browser canvas for high-quality SVG to PNG conversion (2x scale).
+
+### Previous: v1.4.0
+
+- ✨ **Default Mode Change**: Default output mode is now `image` (static image) for better compatibility.
+- 📱 **Responsive Sizing**: Images now auto-adapt to the chat container width.
+
 ## ✨ Key Features
 
 - 🚀 **AI-Powered Transformation**: Automatically analyzes text logic, extracts key points, and generates structured charts.
@@ -11,15 +23,6 @@ An Open WebUI plugin powered by the AntV Infographic engine. It transforms long
 - 🌈 **Highly Customizable**: Supports Dark/Light modes, auto-adapts theme colors, with bold titles and refined card layouts.
 - 📱 **Responsive Design**: Generated charts look great on both desktop and mobile devices.
 
-## 🛠️ Supported Template Types
-
-| Category | Template Name | Use Case |
-| :--- | :--- | :--- |
-| **Lists & Hierarchy** | `list-grid`, `tree-vertical`, `mindmap` | Features, Org Charts, Brainstorming |
-| **Sequence & Relation** | `sequence-roadmap`, `relation-circle` | Roadmaps, Circular Flows, Steps |
-| **Comparison & Analysis** | `compare-binary`, `compare-swot`, `quadrant-quarter` | Pros/Cons, SWOT, Quadrants |
-| **Charts & Data** | `chart-bar`, `chart-line`, `chart-pie` | Trends, Distributions, Metrics |
-
 ## 🚀 How to Use
 
 1. **Install**: Search for "Smart Infographic" in the Open WebUI Community and install.
@@ -38,6 +41,16 @@ You can adjust the following parameters in the plugin settings to optimize the g
 | **Min Text Length (MIN_TEXT_LENGTH)** | `100` | Minimum characters required to trigger analysis, preventing accidental triggers on short text. |
 | **Clear Previous (CLEAR_PREVIOUS_HTML)** | `False` | Whether to clear previous charts. If `False`, new charts will be appended below. |
 | **Message Count (MESSAGE_COUNT)** | `1` | Number of recent messages to use for analysis. Increase this for more context. |
+| **Output Mode (OUTPUT_MODE)** | `image` | `image` for static image embedding (default, better compatibility), `html` for interactive chart. |
+
+## 🛠️ Supported Template Types
+
+| Category | Template Name | Use Case |
+| :--- | :--- | :--- |
+| **Lists & Hierarchy** | `list-grid`, `tree-vertical`, `mindmap` | Features, Org Charts, Brainstorming |
+| **Sequence & Relation** | `sequence-roadmap`, `relation-circle` | Roadmaps, Circular Flows, Steps |
+| **Comparison & Analysis** | `compare-binary`, `compare-swot`, `quadrant-quarter` | Pros/Cons, SWOT, Quadrants |
+| **Charts & Data** | `chart-bar`, `chart-line`, `chart-pie` | Trends, Distributions, Metrics |
 
 ## 📝 Syntax Example (For Advanced Users)
 
@@ -54,12 +67,3 @@ data
     - label Beautiful Design
       desc Uses AntV professional design standards
 ```
-
-## 👨‍💻 Author
-
-**jeff**
-- GitHub: [Fu-Jie/awesome-openwebui](https://github.com/Fu-Jie/awesome-openwebui)
-
-## 📄 License
-
-MIT License

plugins/actions/infographic/README_CN.md

@@ -1,7 +1,19 @@
 # 📊 智能信息图 (AntV Infographic)
 
+**Author:** [Fu-Jie](https://github.com/Fu-Jie) | **Version:** 1.4.1 | **Project:** [Awesome OpenWebUI](https://github.com/Fu-Jie/awesome-openwebui)
+
 基于 AntV Infographic 引擎的 Open WebUI 插件，能够将长文本内容一键转换为专业、美观的信息图表。
 
+## 🔥 v1.4.1 更新日志
+
+- ✨ **PNG 上传**：信息图现在以 PNG 格式上传，与 Word 导出完美兼容。
+- 🔧 **Canvas 转换**：使用浏览器 Canvas 高质量转换 SVG 为 PNG（2倍缩放）。
+
+### 此前: v1.4.0
+
+- ✨ **默认模式变更**：默认输出模式调整为 `image`（静态图片）。
+- 📱 **响应式尺寸**：图片模式下自动适应聊天容器宽度。
+
 ## ✨ 核心特性
 
 - 🚀 **智能转换**：自动分析文本核心逻辑，提取关键点并生成结构化图表。
@@ -11,15 +23,6 @@
 - 🌈 **高度自定义**：支持深色/浅色模式，自动适配主题颜色，主标题加粗突出，卡片布局精美。
 - 📱 **响应式设计**：生成的图表在桌面端和移动端均有良好的展示效果。
 
-## 🛠️ 支持的模板类型
-
-| 分类 | 模板名称 | 适用场景 |
-| :--- | :--- | :--- |
-| **列表与层级** | `list-grid`, `tree-vertical`, `mindmap` | 功能亮点、组织架构、思维导图 |
-| **顺序与关系** | `sequence-roadmap`, `relation-circle` | 发展历程、循环关系、步骤说明 |
-| **对比与分析** | `compare-binary`, `compare-swot`, `quadrant-quarter` | 优劣势对比、SWOT 分析、象限图 |
-| **图表与数据** | `chart-bar`, `chart-line`, `chart-pie` | 数据趋势、比例分布、数值对比 |
-
 ## 🚀 使用方法
 
 1. **安装插件**：在 Open WebUI 插件市场搜索并安装。
@@ -38,6 +41,16 @@
 | **最小文本长度 (MIN_TEXT_LENGTH)** | `100` | 触发分析所需的最小字符数，防止对过短的对话误操作。 |
 | **清除旧结果 (CLEAR_PREVIOUS_HTML)** | `False` | 每次生成是否清除之前的图表。若为 `False`，新图表将追加在下方。 |
 | **上下文消息数 (MESSAGE_COUNT)** | `1` | 用于分析的最近消息条数。增加此值可让 AI 参考更多对话背景。 |
+| **输出模式 (OUTPUT_MODE)** | `image` | `image` 为静态图片嵌入（默认，兼容性好），`html` 为交互式图表。 |
+
+## 🛠️ 支持的模板类型
+
+| 分类 | 模板名称 | 适用场景 |
+| :--- | :--- | :--- |
+| **列表与层级** | `list-grid`, `tree-vertical`, `mindmap` | 功能亮点、组织架构、思维导图 |
+| **顺序与关系** | `sequence-roadmap`, `relation-circle` | 发展历程、循环关系、步骤说明 |
+| **对比与分析** | `compare-binary`, `compare-swot`, `quadrant-quarter` | 优劣势对比、SWOT 分析、象限图 |
+| **图表与数据** | `chart-bar`, `chart-line`, `chart-pie` | 数据趋势、比例分布、数值对比 |
 
 ## 📝 语法示例 (高级用户)
 
@@ -54,12 +67,3 @@ data
     - label 视觉精美
       desc 采用 AntV 专业设计规范
 ```
-
-## 👨‍💻 作者
-
-**jeff**
-- GitHub: [Fu-Jie/awesome-openwebui](https://github.com/Fu-Jie/awesome-openwebui)
-
-## 📄 许可证
-
-MIT License

plugins/actions/infographic/infographic.py

@@ -3,12 +3,13 @@ title: 📊 Smart Infographic (AntV)
 author: jeff
 author_url: https://github.com/Fu-Jie/awesome-openwebui
 icon_url: data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPgogIDxsaW5lIHgxPSIxMiIgeTE9IjIwIiB4Mj0iMTIiIHkyPSIxMCIgLz4KICA8bGluZSB4MT0iMTgiIHkxPSIyMCIgeDI9IjE4IiB5Mj0iNCIgLz4KICA8bGluZSB4MT0iNiIgeTE9IjIwIiB4Mj0iNiIgeTI9IjE2IiAvPgo8L3N2Zz4=
-version: 1.3.1
+version: 1.4.1
+openwebui_id: ad6f0c7f-c571-4dea-821d-8e71697274cf
 description: AI-powered infographic generator based on AntV Infographic. Supports professional templates, auto-icon matching, and SVG/PNG downloads.
 """
 
 from pydantic import BaseModel, Field
-from typing import Optional, Dict, Any
+from typing import Optional, Dict, Any, Callable, Awaitable
 import logging
 import time
 import re
@@ -821,10 +822,54 @@ class Action:
             default=1,
             description="Number of recent messages to use for generation. Set to 1 for just the last message, or higher for more context.",
         )
+        OUTPUT_MODE: str = Field(
+            default="image",
+            description="Output mode: 'html' for interactive HTML, or 'image' to embed as Markdown image (default).",
+        )
 
     def __init__(self):
         self.valves = self.Valves()
 
+    def _extract_chat_id(self, body: dict, metadata: Optional[dict]) -> str:
+        """Extract chat_id from body or metadata"""
+        if isinstance(body, dict):
+            chat_id = body.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+
+            body_metadata = body.get("metadata", {})
+            if isinstance(body_metadata, dict):
+                chat_id = body_metadata.get("chat_id")
+                if isinstance(chat_id, str) and chat_id.strip():
+                    return chat_id.strip()
+
+        if isinstance(metadata, dict):
+            chat_id = metadata.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+
+        return ""
+
+    def _extract_message_id(self, body: dict, metadata: Optional[dict]) -> str:
+        """Extract message_id from body or metadata"""
+        if isinstance(body, dict):
+            message_id = body.get("id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+
+            body_metadata = body.get("metadata", {})
+            if isinstance(body_metadata, dict):
+                message_id = body_metadata.get("message_id")
+                if isinstance(message_id, str) and message_id.strip():
+                    return message_id.strip()
+
+        if isinstance(metadata, dict):
+            message_id = metadata.get("message_id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+
+        return ""
+
     def _extract_infographic_syntax(self, llm_output: str) -> str:
         """Extract infographic syntax from LLM output"""
         match = re.search(r"```infographic\s*(.*?)\s*```", llm_output, re.DOTALL)
@@ -912,14 +957,359 @@ class Action:
 
         return base_html.strip()
 
+    def _generate_image_js_code(
+        self,
+        unique_id: str,
+        chat_id: str,
+        message_id: str,
+        infographic_syntax: str,
+    ) -> str:
+        """Generate JavaScript code for frontend SVG rendering and image embedding"""
+
+        # Escape the syntax for JS embedding
+        syntax_escaped = (
+            infographic_syntax.replace("\\", "\\\\")
+            .replace("`", "\\`")
+            .replace("${", "\\${")
+            .replace("</script>", "<\\/script>")
+        )
+
+        return f"""
+(async function() {{
+    const uniqueId = "{unique_id}";
+    const chatId = "{chat_id}";
+    const messageId = "{message_id}";
+    const defaultWidth = 1100;
+    const defaultHeight = 500;
+    
+    // Auto-detect chat container width for responsive sizing
+    let svgWidth = defaultWidth;
+    let svgHeight = defaultHeight;
+    const chatContainer = document.getElementById('chat-container');
+    if (chatContainer) {{
+        const containerWidth = chatContainer.clientWidth;
+        if (containerWidth > 100) {{
+            // Use container width with padding (80% of container, leaving more space on the right)
+            svgWidth = Math.floor(containerWidth * 0.8);
+            // Maintain aspect ratio based on default dimensions
+            svgHeight = Math.floor(svgWidth * (defaultHeight / defaultWidth));
+            console.log("[Infographic Image] Auto-detected container width:", containerWidth, "-> SVG:", svgWidth, "x", svgHeight);
+        }}
+    }}
+    
+    console.log("[Infographic Image] Starting render...");
+    console.log("[Infographic Image] chatId:", chatId, "messageId:", messageId);
+    
+    try {{
+        // Load AntV Infographic if not loaded
+        if (typeof AntVInfographic === 'undefined') {{
+            console.log("[Infographic Image] Loading AntV Infographic...");
+            await new Promise((resolve, reject) => {{
+                const script = document.createElement('script');
+                script.src = 'https://unpkg.com/@antv/infographic@latest/dist/infographic.min.js';
+                script.onload = resolve;
+                script.onerror = reject;
+                document.head.appendChild(script);
+            }});
+        }}
+        
+        const {{ Infographic }} = AntVInfographic;
+        
+        // Get syntax content
+        let syntaxContent = `{syntax_escaped}`;
+        console.log("[Infographic Image] Syntax length:", syntaxContent.length);
+        
+        // Clean up syntax: remove code block markers
+        const backtick = String.fromCharCode(96);
+        const prefix = backtick + backtick + backtick + 'infographic';
+        const simplePrefix = backtick + backtick + backtick;
+        
+        if (syntaxContent.toLowerCase().startsWith(prefix)) {{
+            syntaxContent = syntaxContent.substring(prefix.length).trim();
+        }} else if (syntaxContent.startsWith(simplePrefix)) {{
+            syntaxContent = syntaxContent.substring(simplePrefix.length).trim();
+        }}
+        
+        if (syntaxContent.endsWith(simplePrefix)) {{
+            syntaxContent = syntaxContent.substring(0, syntaxContent.length - simplePrefix.length).trim();
+        }}
+        
+        // Fix syntax: remove colons after keywords
+        syntaxContent = syntaxContent.replace(/^(data|items|children|theme|config):/gm, '$1');
+        syntaxContent = syntaxContent.replace(/(\\s)(children|items):/g, '$1$2');
+        
+        // Ensure infographic prefix
+        if (!syntaxContent.trim().toLowerCase().startsWith('infographic')) {{
+            const firstWord = syntaxContent.trim().split(/\\s+/)[0].toLowerCase();
+            if (!['data', 'theme', 'design', 'items'].includes(firstWord)) {{
+                syntaxContent = 'infographic ' + syntaxContent;
+            }}
+        }}
+        
+        // Template mapping
+        const TEMPLATE_MAPPING = {{
+            'list-grid': 'list-grid-compact-card',
+            'list-vertical': 'list-column-simple-vertical-arrow',
+            'tree-vertical': 'hierarchy-tree-tech-style-capsule-item',
+            'tree-horizontal': 'hierarchy-tree-lr-tech-style-capsule-item',
+            'mindmap': 'hierarchy-mindmap-branch-gradient-capsule-item',
+            'sequence-roadmap': 'sequence-roadmap-vertical-simple',
+            'sequence-zigzag': 'sequence-horizontal-zigzag-simple',
+            'sequence-horizontal': 'sequence-horizontal-zigzag-simple',
+            'relation-sankey': 'relation-sankey-simple',
+            'relation-circle': 'relation-circle-icon-badge',
+            'compare-binary': 'compare-binary-horizontal-simple-vs',
+            'compare-swot': 'compare-swot',
+            'quadrant-quarter': 'quadrant-quarter-simple-card',
+            'statistic-card': 'list-grid-compact-card',
+            'chart-bar': 'chart-bar-plain-text',
+            'chart-column': 'chart-column-simple',
+            'chart-line': 'chart-line-plain-text',
+            'chart-area': 'chart-area-simple',
+            'chart-pie': 'chart-pie-plain-text',
+            'chart-doughnut': 'chart-pie-donut-plain-text'
+        }};
+        
+        for (const [key, value] of Object.entries(TEMPLATE_MAPPING)) {{
+            const regex = new RegExp(`infographic\\\\s+${{key}}(?=\\\\s|$)`, 'i');
+            if (regex.test(syntaxContent)) {{
+                syntaxContent = syntaxContent.replace(regex, `infographic ${{value}}`);
+                break;
+            }}
+        }}
+        
+        // Create offscreen container
+        const container = document.createElement('div');
+        container.id = 'infographic-offscreen-' + uniqueId;
+        container.style.cssText = 'position:absolute;left:-9999px;top:-9999px;width:' + svgWidth + 'px;height:' + svgHeight + 'px;background:#ffffff;';
+        document.body.appendChild(container);
+        
+        // Create infographic instance
+        const instance = new Infographic({{
+            container: '#' + container.id,
+            width: svgWidth,
+            height: svgHeight,
+            padding: 12,
+        }});
+        
+        console.log("[Infographic Image] Rendering infographic...");
+        instance.render(syntaxContent);
+        
+        // Wait for render to complete
+        await new Promise(resolve => setTimeout(resolve, 2000));
+        
+        // Get SVG element
+        const svgEl = container.querySelector('svg');
+        if (!svgEl) {{
+            throw new Error('SVG element not found after rendering');
+        }}
+        
+        // Get actual dimensions
+        const bbox = svgEl.getBoundingClientRect();
+        const width = bbox.width || svgWidth;
+        const height = bbox.height || svgHeight;
+        
+        // Clone and prepare SVG for export
+        const clonedSvg = svgEl.cloneNode(true);
+        clonedSvg.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
+        clonedSvg.setAttribute('xmlns:xlink', 'http://www.w3.org/1999/xlink');
+        clonedSvg.setAttribute('width', width);
+        clonedSvg.setAttribute('height', height);
+        
+        // Add background rect
+        const bgRect = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
+        bgRect.setAttribute('width', '100%');
+        bgRect.setAttribute('height', '100%');
+        bgRect.setAttribute('fill', '#ffffff');
+        clonedSvg.insertBefore(bgRect, clonedSvg.firstChild);
+        
+        // Serialize SVG to string
+        const svgData = new XMLSerializer().serializeToString(clonedSvg);
+        
+        // Cleanup container
+        document.body.removeChild(container);
+        
+        // Convert SVG to PNG using canvas for better compatibility
+        console.log("[Infographic Image] Converting SVG to PNG...");
+        const pngBlob = await new Promise((resolve, reject) => {{
+            const canvas = document.createElement('canvas');
+            const ctx = canvas.getContext('2d');
+            const scale = 2; // Higher resolution for clarity
+            canvas.width = Math.round(width * scale);
+            canvas.height = Math.round(height * scale);
+            
+            // Fill white background
+            ctx.fillStyle = '#ffffff';
+            ctx.fillRect(0, 0, canvas.width, canvas.height);
+            ctx.scale(scale, scale);
+            
+            const img = new Image();
+            img.onload = () => {{
+                ctx.drawImage(img, 0, 0, width, height);
+                canvas.toBlob((blob) => {{
+                    if (blob) {{
+                        resolve(blob);
+                    }} else {{
+                        reject(new Error('Canvas toBlob failed'));
+                    }}
+                }}, 'image/png');
+            }};
+            img.onerror = (e) => reject(new Error('Failed to load SVG as image: ' + e));
+            img.src = 'data:image/svg+xml;base64,' + btoa(unescape(encodeURIComponent(svgData)));
+        }});
+        
+        const file = new File([pngBlob], `infographic-${{uniqueId}}.png`, {{ type: 'image/png' }});
+        
+        // Upload file to OpenWebUI API
+        console.log("[Infographic Image] Uploading PNG file...");
+        const token = localStorage.getItem("token");
+        const formData = new FormData();
+        formData.append('file', file);
+        
+        const uploadResponse = await fetch('/api/v1/files/', {{
+            method: 'POST',
+            headers: {{
+                'Authorization': `Bearer ${{token}}`
+            }},
+            body: formData
+        }});
+        
+        if (!uploadResponse.ok) {{
+            throw new Error(`Upload failed: ${{uploadResponse.statusText}}`);
+        }}
+        
+        const fileData = await uploadResponse.json();
+        const fileId = fileData.id;
+        const imageUrl = `/api/v1/files/${{fileId}}/content`;
+        
+        console.log("[Infographic Image] PNG file uploaded, ID:", fileId);
+        
+        // Generate markdown image with file URL
+        const markdownImage = `![📊 Infographic](${{imageUrl}})`;
+        
+        // Update message via API
+        if (chatId && messageId) {{
+            
+            // Helper function with retry logic
+            const fetchWithRetry = async (url, options, retries = 3) => {{
+                for (let i = 0; i < retries; i++) {{
+                    try {{
+                        const response = await fetch(url, options);
+                        if (response.ok) return response;
+                        if (i < retries - 1) {{
+                            console.log(`[Infographic Image] Retry ${{i + 1}}/${{retries}} for ${{url}}`);
+                            await new Promise(r => setTimeout(r, 1000 * (i + 1)));
+                        }}
+                    }} catch (e) {{
+                        if (i === retries - 1) throw e;
+                        await new Promise(r => setTimeout(r, 1000 * (i + 1)));
+                    }}
+                }}
+                return null;
+            }};
+            
+            // Get current chat data
+            const getResponse = await fetch(`/api/v1/chats/${{chatId}}`, {{
+                method: "GET",
+                headers: {{ "Authorization": `Bearer ${{token}}` }}
+            }});
+            
+            if (!getResponse.ok) {{
+                throw new Error("Failed to get chat data: " + getResponse.status);
+            }}
+            
+            const chatData = await getResponse.json();
+            let updatedMessages = [];
+            let newContent = "";
+            
+            if (chatData.chat && chatData.chat.messages) {{
+                updatedMessages = chatData.chat.messages.map(m => {{
+                    if (m.id === messageId) {{
+                        const originalContent = m.content || "";
+                        // Remove existing infographic images
+                        const infographicPattern = /\\n*!\\[📊[^\\]]*\\]\\((?:data:image\\/[^)]+|(?:\\/api\\/v1\\/files\\/[^)]+))\\)/g;
+                        let cleanedContent = originalContent.replace(infographicPattern, "");
+                        cleanedContent = cleanedContent.replace(/\\n{{3,}}/g, "\\n\\n").trim();
+                        // Append new image
+                        newContent = cleanedContent + "\\n\\n" + markdownImage;
+                        
+                        // Update history object as well
+                        if (chatData.chat.history && chatData.chat.history.messages) {{
+                            if (chatData.chat.history.messages[messageId]) {{
+                                chatData.chat.history.messages[messageId].content = newContent;
+                            }}
+                        }}
+                        
+                        return {{ ...m, content: newContent }};
+                    }}
+                    return m;
+                }});
+            }}
+            
+            if (!newContent) {{
+                console.warn("[Infographic Image] Could not find message to update");
+                return;
+            }}
+            
+            // Try to update frontend display via event API
+            try {{
+                await fetch(`/api/v1/chats/${{chatId}}/messages/${{messageId}}/event`, {{
+                    method: "POST",
+                    headers: {{
+                        "Content-Type": "application/json",
+                        "Authorization": `Bearer ${{token}}`
+                    }},
+                    body: JSON.stringify({{
+                        type: "chat:message",
+                        data: {{ content: newContent }}
+                    }})
+                }});
+            }} catch (eventErr) {{
+                console.log("[Infographic Image] Event API not available, continuing...");
+            }}
+            
+            // Persist to database
+            const updatePayload = {{
+                chat: {{
+                    ...chatData.chat,
+                    messages: updatedMessages
+                }}
+            }};
+            
+            const persistResponse = await fetchWithRetry(`/api/v1/chats/${{chatId}}`, {{
+                method: "POST",
+                headers: {{
+                    "Content-Type": "application/json",
+                    "Authorization": `Bearer ${{token}}`
+                }},
+                body: JSON.stringify(updatePayload)
+            }});
+            
+            if (persistResponse && persistResponse.ok) {{
+                console.log("[Infographic Image] ✅ Message persisted successfully!");
+            }} else {{
+                console.error("[Infographic Image] ❌ Failed to persist message after retries");
+            }}
+        }} else {{
+            console.warn("[Infographic Image] ⚠️ Missing chatId or messageId, cannot persist");
+        }}
+        
+    }} catch (error) {{
+        console.error("[Infographic Image] Error:", error);
+    }}
+}})();
+"""
+
     async def action(
         self,
         body: dict,
         __user__: Optional[Dict[str, Any]] = None,
         __event_emitter__: Optional[Any] = None,
+        __event_call__: Optional[Callable[[Any], Awaitable[None]]] = None,
+        __metadata__: Optional[dict] = None,
         __request__: Optional[Request] = None,
     ) -> Optional[dict]:
-        logger.info("Action: Infographic started (v1.0.0)")
+        logger.info("Action: Infographic started (v1.4.0)")
 
         # Get user information
         if isinstance(__user__, (list, tuple)):
@@ -961,9 +1351,7 @@ class Action:
                         if role == "user"
                         else "Assistant" if role == "assistant" else role
                     )
-                    aggregated_parts.append(
-                        f"[{role_label} Message {i}]\n{text_content}"
-                    )
+                    aggregated_parts.append(f"{text_content}")
 
             if not aggregated_parts:
                 raise ValueError("Unable to get valid user message content.")
@@ -1116,6 +1504,45 @@ class Action:
                         user_language,
                     )
 
+            # Check output mode
+            if self.valves.OUTPUT_MODE == "image":
+                # Image mode: use JavaScript to render and embed as Markdown image
+                chat_id = self._extract_chat_id(body, body.get("metadata"))
+                message_id = self._extract_message_id(body, body.get("metadata"))
+
+                await self._emit_status(
+                    __event_emitter__,
+                    "📊 Infographic: Rendering image...",
+                    False,
+                )
+
+                if __event_call__:
+                    js_code = self._generate_image_js_code(
+                        unique_id=unique_id,
+                        chat_id=chat_id,
+                        message_id=message_id,
+                        infographic_syntax=infographic_syntax,
+                    )
+
+                    await __event_call__(
+                        {
+                            "type": "execute",
+                            "data": {"code": js_code},
+                        }
+                    )
+
+                await self._emit_status(
+                    __event_emitter__, "✅ Infographic: Image generated!", True
+                )
+                await self._emit_notification(
+                    __event_emitter__,
+                    f"📊 Infographic image generated, {user_name}!",
+                    "success",
+                )
+                logger.info("Infographic generation completed in image mode")
+                return body
+
+            # HTML mode (default): embed as HTML block
             html_embed_tag = f"```html\n{final_html}\n```"
             body["messages"][-1]["content"] = f"{original_content}\n\n{html_embed_tag}"
 

plugins/actions/infographic/infographic_cn.py

@@ -3,12 +3,13 @@ title: 📊 智能信息图 (AntV Infographic)
 author: jeff
 author_url: https://github.com/Fu-Jie/awesome-openwebui
 icon_url: data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPgogIDxsaW5lIHgxPSIxMiIgeTE9IjIwIiB4Mj0iMTIiIHkyPSIxMCIgLz4KICA8bGluZSB4MT0iMTgiIHkxPSIyMCIgeDI9IjE4IiB5Mj0iNCIgLz4KICA8bGluZSB4MT0iNiIgeTE9IjIwIiB4Mj0iNiIgeTI9IjE2IiAvPgo8L3N2Zz4=
-version: 1.3.1
+version: 1.4.1
+openwebui_id: e04a48ff-23ee-4a41-8ea7-66c19524e7c8
 description: 基于 AntV Infographic 的智能信息图生成插件。支持多种专业模板，自动图标匹配，并提供 SVG/PNG 下载功能。
 """
 
 from pydantic import BaseModel, Field
-from typing import Optional, Dict, Any
+from typing import Optional, Dict, Any, Callable, Awaitable
 import logging
 import time
 import re
@@ -849,6 +850,10 @@ class Action:
             default=1,
             description="用于生成的最近消息数量。设置为1仅使用最后一条消息，更大值可包含更多上下文。",
         )
+        OUTPUT_MODE: str = Field(
+            default="image",
+            description="输出模式：'html' 为交互式HTML，'image' 将嵌入为Markdown图片（默认）。",
+        )
 
     def __init__(self):
         self.valves = self.Valves()
@@ -862,6 +867,46 @@ class Action:
             "Sunday": "星期日",
         }
 
+    def _extract_chat_id(self, body: dict, metadata: Optional[dict]) -> str:
+        """从 body 或 metadata 中提取 chat_id"""
+        if isinstance(body, dict):
+            chat_id = body.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+
+            body_metadata = body.get("metadata", {})
+            if isinstance(body_metadata, dict):
+                chat_id = body_metadata.get("chat_id")
+                if isinstance(chat_id, str) and chat_id.strip():
+                    return chat_id.strip()
+
+        if isinstance(metadata, dict):
+            chat_id = metadata.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+
+        return ""
+
+    def _extract_message_id(self, body: dict, metadata: Optional[dict]) -> str:
+        """从 body 或 metadata 中提取 message_id"""
+        if isinstance(body, dict):
+            message_id = body.get("id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+
+            body_metadata = body.get("metadata", {})
+            if isinstance(body_metadata, dict):
+                message_id = body_metadata.get("message_id")
+                if isinstance(message_id, str) and message_id.strip():
+                    return message_id.strip()
+
+        if isinstance(metadata, dict):
+            message_id = metadata.get("message_id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+
+        return ""
+
     def _extract_infographic_syntax(self, llm_output: str) -> str:
         """提取LLM输出中的infographic语法"""
         # 1. 优先匹配 ```infographic
@@ -973,14 +1018,359 @@ class Action:
 
         return base_html.strip()
 
+    def _generate_image_js_code(
+        self,
+        unique_id: str,
+        chat_id: str,
+        message_id: str,
+        infographic_syntax: str,
+    ) -> str:
+        """生成前端 SVG 渲染和图片嵌入的 JavaScript 代码"""
+
+        # 转义语法以便在 JS 中嵌入
+        syntax_escaped = (
+            infographic_syntax.replace("\\", "\\\\")
+            .replace("`", "\\`")
+            .replace("${", "\\${")
+            .replace("</script>", "<\\/script>")
+        )
+
+        return f"""
+(async function() {{
+    const uniqueId = "{unique_id}";
+    const chatId = "{chat_id}";
+    const messageId = "{message_id}";
+    const defaultWidth = 1100;
+    const defaultHeight = 500;
+    
+    // 自动检测聊天容器宽度以实现响应式尺寸
+    let svgWidth = defaultWidth;
+    let svgHeight = defaultHeight;
+    const chatContainer = document.getElementById('chat-container');
+    if (chatContainer) {{
+        const containerWidth = chatContainer.clientWidth;
+        if (containerWidth > 100) {{
+            // 使用容器宽度的 80%（右边留更多空间）
+            svgWidth = Math.floor(containerWidth * 0.8);
+            // 根据默认尺寸保持宽高比
+            svgHeight = Math.floor(svgWidth * (defaultHeight / defaultWidth));
+            console.log("[Infographic Image] 自动检测容器宽度:", containerWidth, "-> SVG:", svgWidth, "x", svgHeight);
+        }}
+    }}
+    
+    console.log("[Infographic Image] 开始渲染...");
+    console.log("[Infographic Image] chatId:", chatId, "messageId:", messageId);
+    
+    try {{
+        // 加载 AntV Infographic（如果未加载）
+        if (typeof AntVInfographic === 'undefined') {{
+            console.log("[Infographic Image] 加载 AntV Infographic...");
+            await new Promise((resolve, reject) => {{
+                const script = document.createElement('script');
+                script.src = 'https://registry.npmmirror.com/@antv/infographic/0.2.1/files/dist/infographic.min.js';
+                script.onload = resolve;
+                script.onerror = reject;
+                document.head.appendChild(script);
+            }});
+        }}
+        
+        const {{ Infographic }} = AntVInfographic;
+        
+        // 获取语法内容
+        let syntaxContent = `{syntax_escaped}`;
+        console.log("[Infographic Image] 语法长度:", syntaxContent.length);
+        
+        // 清理语法：移除代码块标记
+        const backtick = String.fromCharCode(96);
+        const prefix = backtick + backtick + backtick + 'infographic';
+        const simplePrefix = backtick + backtick + backtick;
+        
+        if (syntaxContent.toLowerCase().startsWith(prefix)) {{
+            syntaxContent = syntaxContent.substring(prefix.length).trim();
+        }} else if (syntaxContent.startsWith(simplePrefix)) {{
+            syntaxContent = syntaxContent.substring(simplePrefix.length).trim();
+        }}
+        
+        if (syntaxContent.endsWith(simplePrefix)) {{
+            syntaxContent = syntaxContent.substring(0, syntaxContent.length - simplePrefix.length).trim();
+        }}
+        
+        // 修复语法：移除关键字后的冒号
+        syntaxContent = syntaxContent.replace(/^(data|items|children|theme|config):/gm, '$1');
+        syntaxContent = syntaxContent.replace(/(\\s)(children|items):/g, '$1$2');
+        
+        // 确保 infographic 前缀
+        if (!syntaxContent.trim().toLowerCase().startsWith('infographic')) {{
+            const firstWord = syntaxContent.trim().split(/\\s+/)[0].toLowerCase();
+            if (!['data', 'theme', 'design', 'items'].includes(firstWord)) {{
+                syntaxContent = 'infographic ' + syntaxContent;
+            }}
+        }}
+        
+        // 模板映射
+        const TEMPLATE_MAPPING = {{
+            'list-grid': 'list-grid-compact-card',
+            'list-vertical': 'list-column-simple-vertical-arrow',
+            'tree-vertical': 'hierarchy-tree-tech-style-capsule-item',
+            'tree-horizontal': 'hierarchy-tree-lr-tech-style-capsule-item',
+            'mindmap': 'hierarchy-mindmap-branch-gradient-capsule-item',
+            'sequence-roadmap': 'sequence-roadmap-vertical-simple',
+            'sequence-zigzag': 'sequence-horizontal-zigzag-simple',
+            'sequence-horizontal': 'sequence-horizontal-zigzag-simple',
+            'relation-sankey': 'relation-sankey-simple',
+            'relation-circle': 'relation-circle-icon-badge',
+            'compare-binary': 'compare-binary-horizontal-simple-vs',
+            'compare-swot': 'compare-swot',
+            'quadrant-quarter': 'quadrant-quarter-simple-card',
+            'statistic-card': 'list-grid-compact-card',
+            'chart-bar': 'chart-bar-plain-text',
+            'chart-column': 'chart-column-simple',
+            'chart-line': 'chart-line-plain-text',
+            'chart-area': 'chart-area-simple',
+            'chart-pie': 'chart-pie-plain-text',
+            'chart-doughnut': 'chart-pie-donut-plain-text'
+        }};
+        
+        for (const [key, value] of Object.entries(TEMPLATE_MAPPING)) {{
+            const regex = new RegExp(`infographic\\\\s+${{key}}(?=\\\\s|$)`, 'i');
+            if (regex.test(syntaxContent)) {{
+                syntaxContent = syntaxContent.replace(regex, `infographic ${{value}}`);
+                break;
+            }}
+        }}
+        
+        // 创建离屏容器
+        const container = document.createElement('div');
+        container.id = 'infographic-offscreen-' + uniqueId;
+        container.style.cssText = 'position:absolute;left:-9999px;top:-9999px;width:' + svgWidth + 'px;height:' + svgHeight + 'px;background:#ffffff;';
+        document.body.appendChild(container);
+        
+        // 创建信息图实例
+        const instance = new Infographic({{
+            container: '#' + container.id,
+            width: svgWidth,
+            height: svgHeight,
+            padding: 12,
+        }});
+        
+        console.log("[Infographic Image] 渲染信息图...");
+        instance.render(syntaxContent);
+        
+        // 等待渲染完成
+        await new Promise(resolve => setTimeout(resolve, 2000));
+        
+        // 获取 SVG 元素
+        const svgEl = container.querySelector('svg');
+        if (!svgEl) {{
+            throw new Error('渲染后未找到 SVG 元素');
+        }}
+        
+        // 获取实际尺寸
+        const bbox = svgEl.getBoundingClientRect();
+        const width = bbox.width || svgWidth;
+        const height = bbox.height || svgHeight;
+        
+        // 克隆并准备导出的 SVG
+        const clonedSvg = svgEl.cloneNode(true);
+        clonedSvg.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
+        clonedSvg.setAttribute('xmlns:xlink', 'http://www.w3.org/1999/xlink');
+        clonedSvg.setAttribute('width', width);
+        clonedSvg.setAttribute('height', height);
+        
+        // 添加背景矩形
+        const bgRect = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
+        bgRect.setAttribute('width', '100%');
+        bgRect.setAttribute('height', '100%');
+        bgRect.setAttribute('fill', '#ffffff');
+        clonedSvg.insertBefore(bgRect, clonedSvg.firstChild);
+        
+        // 序列化 SVG 为字符串
+        const svgData = new XMLSerializer().serializeToString(clonedSvg);
+        
+        // 清理容器
+        document.body.removeChild(container);
+        
+        // 使用 canvas 将 SVG 转换为 PNG 以提高兼容性
+        console.log("[Infographic Image] 正在将 SVG 转换为 PNG...");
+        const pngBlob = await new Promise((resolve, reject) => {{
+            const canvas = document.createElement('canvas');
+            const ctx = canvas.getContext('2d');
+            const scale = 2; // 更高分辨率以提高清晰度
+            canvas.width = Math.round(width * scale);
+            canvas.height = Math.round(height * scale);
+            
+            // 填充白色背景
+            ctx.fillStyle = '#ffffff';
+            ctx.fillRect(0, 0, canvas.width, canvas.height);
+            ctx.scale(scale, scale);
+            
+            const img = new Image();
+            img.onload = () => {{
+                ctx.drawImage(img, 0, 0, width, height);
+                canvas.toBlob((blob) => {{
+                    if (blob) {{
+                        resolve(blob);
+                    }} else {{
+                        reject(new Error('Canvas toBlob 失败'));
+                    }}
+                }}, 'image/png');
+            }};
+            img.onerror = (e) => reject(new Error('加载 SVG 图片失败: ' + e));
+            img.src = 'data:image/svg+xml;base64,' + btoa(unescape(encodeURIComponent(svgData)));
+        }});
+        
+        const file = new File([pngBlob], `infographic-${{uniqueId}}.png`, {{ type: 'image/png' }});
+        
+        // 上传文件到 OpenWebUI API
+        console.log("[Infographic Image] 上传 PNG 文件...");
+        const token = localStorage.getItem("token");
+        const formData = new FormData();
+        formData.append('file', file);
+        
+        const uploadResponse = await fetch('/api/v1/files/', {{
+            method: 'POST',
+            headers: {{
+                'Authorization': `Bearer ${{token}}`
+            }},
+            body: formData
+        }});
+        
+        if (!uploadResponse.ok) {{
+            throw new Error(`上传失败: ${{uploadResponse.statusText}}`);
+        }}
+        
+        const fileData = await uploadResponse.json();
+        const fileId = fileData.id;
+        const imageUrl = `/api/v1/files/${{fileId}}/content`;
+        
+        console.log("[Infographic Image] PNG 文件已上传, ID:", fileId);
+        
+        // 生成带文件 URL 的 markdown 图片
+        const markdownImage = `![📊 信息图](${{imageUrl}})`;
+        
+        // 通过 API 更新消息
+        if (chatId && messageId) {{
+            
+            // 带重试逻辑的辅助函数
+            const fetchWithRetry = async (url, options, retries = 3) => {{
+                for (let i = 0; i < retries; i++) {{
+                    try {{
+                        const response = await fetch(url, options);
+                        if (response.ok) return response;
+                        if (i < retries - 1) {{
+                            console.log(`[Infographic Image] 重试 ${{i + 1}}/${{retries}} for ${{url}}`);
+                            await new Promise(r => setTimeout(r, 1000 * (i + 1)));
+                        }}
+                    }} catch (e) {{
+                        if (i === retries - 1) throw e;
+                        await new Promise(r => setTimeout(r, 1000 * (i + 1)));
+                    }}
+                }}
+                return null;
+            }};
+            
+            // 获取当前聊天数据
+            const getResponse = await fetch(`/api/v1/chats/${{chatId}}`, {{
+                method: "GET",
+                headers: {{ "Authorization": `Bearer ${{token}}` }}
+            }});
+            
+            if (!getResponse.ok) {{
+                throw new Error("获取聊天数据失败: " + getResponse.status);
+            }}
+            
+            const chatData = await getResponse.json();
+            let updatedMessages = [];
+            let newContent = "";
+            
+            if (chatData.chat && chatData.chat.messages) {{
+                updatedMessages = chatData.chat.messages.map(m => {{
+                    if (m.id === messageId) {{
+                        const originalContent = m.content || "";
+                        // 移除已有的信息图图片
+                        const infographicPattern = /\\n*!\\[📊[^\\]]*\\]\\((?:data:image\\/[^)]+|(?:\\/api\\/v1\\/files\\/[^)]+))\\)/g;
+                        let cleanedContent = originalContent.replace(infographicPattern, "");
+                        cleanedContent = cleanedContent.replace(/\\n{{3,}}/g, "\\n\\n").trim();
+                        // 追加新图片
+                        newContent = cleanedContent + "\\n\\n" + markdownImage;
+                        
+                        // 同时更新 history 对象
+                        if (chatData.chat.history && chatData.chat.history.messages) {{
+                            if (chatData.chat.history.messages[messageId]) {{
+                                chatData.chat.history.messages[messageId].content = newContent;
+                            }}
+                        }}
+                        
+                        return {{ ...m, content: newContent }};
+                    }}
+                    return m;
+                }});
+            }}
+            
+            if (!newContent) {{
+                console.warn("[Infographic Image] 找不到要更新的消息");
+                return;
+            }}
+            
+            // 尝试通过事件 API 更新前端显示
+            try {{
+                await fetch(`/api/v1/chats/${{chatId}}/messages/${{messageId}}/event`, {{
+                    method: "POST",
+                    headers: {{
+                        "Content-Type": "application/json",
+                        "Authorization": `Bearer ${{token}}`
+                    }},
+                    body: JSON.stringify({{
+                        type: "chat:message",
+                        data: {{ content: newContent }}
+                    }})
+                }});
+            }} catch (eventErr) {{
+                console.log("[Infographic Image] 事件 API 不可用，继续...");
+            }}
+            
+            // 持久化到数据库
+            const updatePayload = {{
+                chat: {{
+                    ...chatData.chat,
+                    messages: updatedMessages
+                }}
+            }};
+            
+            const persistResponse = await fetchWithRetry(`/api/v1/chats/${{chatId}}`, {{
+                method: "POST",
+                headers: {{
+                    "Content-Type": "application/json",
+                    "Authorization": `Bearer ${{token}}`
+                }},
+                body: JSON.stringify(updatePayload)
+            }});
+            
+            if (persistResponse && persistResponse.ok) {{
+                console.log("[Infographic Image] ✅ 消息持久化成功!");
+            }} else {{
+                console.error("[Infographic Image] ❌ 重试后消息持久化失败");
+            }}
+        }} else {{
+            console.warn("[Infographic Image] ⚠️ 缺少 chatId 或 messageId，无法持久化");
+        }}
+        
+    }} catch (error) {{
+        console.error("[Infographic Image] 错误:", error);
+    }}
+}})();
+"""
+
     async def action(
         self,
         body: dict,
         __user__: Optional[Dict[str, Any]] = None,
         __event_emitter__: Optional[Any] = None,
+        __event_call__: Optional[Callable[[Any], Awaitable[None]]] = None,
+        __metadata__: Optional[dict] = None,
         __request__: Optional[Request] = None,
     ) -> Optional[dict]:
-        logger.info("Action: 信息图启动 (v1.0.0)")
+        logger.info("Action: 信息图启动 (v1.4.0)")
 
         # 获取用户信息
         if isinstance(__user__, (list, tuple)):
@@ -1026,7 +1416,7 @@ class Action:
                         if role == "user"
                         else "助手" if role == "assistant" else role
                     )
-                    aggregated_parts.append(f"[{role_label} 消息 {i}]\n{text_content}")
+                    aggregated_parts.append(f"{text_content}")
 
             if not aggregated_parts:
                 raise ValueError("无法获取有效的用户消息内容。")
@@ -1169,6 +1559,45 @@ class Action:
                         user_language,
                     )
 
+            # 检查输出模式
+            if self.valves.OUTPUT_MODE == "image":
+                # 图片模式：使用 JavaScript 渲染并嵌入为 Markdown 图片
+                chat_id = self._extract_chat_id(body, body.get("metadata"))
+                message_id = self._extract_message_id(body, body.get("metadata"))
+
+                await self._emit_status(
+                    __event_emitter__,
+                    "📊 信息图: 正在渲染图片...",
+                    False,
+                )
+
+                if __event_call__:
+                    js_code = self._generate_image_js_code(
+                        unique_id=unique_id,
+                        chat_id=chat_id,
+                        message_id=message_id,
+                        infographic_syntax=infographic_syntax,
+                    )
+
+                    await __event_call__(
+                        {
+                            "type": "execute",
+                            "data": {"code": js_code},
+                        }
+                    )
+
+                await self._emit_status(
+                    __event_emitter__, "✅ 信息图: 图片生成完成!", True
+                )
+                await self._emit_notification(
+                    __event_emitter__,
+                    f"📊 信息图图片已生成，{user_name}！",
+                    "success",
+                )
+                logger.info("信息图生成完成（图片模式）")
+                return body
+
+            # HTML 模式（默认）：嵌入为 HTML 块
             html_embed_tag = f"```html\n{final_html}\n```"
             body["messages"][-1]["content"] = f"{original_content}\n\n{html_embed_tag}"
 

plugins/actions/js-render-poc/README.md

@@ -0,0 +1,170 @@
+# Infographic to Markdown
+
+> **Version:** 1.0.0
+
+AI-powered infographic generator that renders SVG on the frontend and embeds it directly into Markdown as a Data URL image.
+
+## Overview
+
+This plugin combines the power of AI text analysis with AntV Infographic visualization to create beautiful infographics that are embedded directly into chat messages as Markdown images.
+
+### How It Works
+
+```
+┌─────────────────────────────────────────────────────────────┐
+│                    Open WebUI Plugin                         │
+├─────────────────────────────────────────────────────────────┤
+│  1. Python Action                                            │
+│     ├── Receive message content                              │
+│     ├── Call LLM to generate Infographic syntax              │
+│     └── Send __event_call__ to execute frontend JS           │
+├─────────────────────────────────────────────────────────────┤
+│  2. Browser JS (via __event_call__)                          │
+│     ├── Dynamically load AntV Infographic library            │
+│     ├── Render SVG offscreen                                 │
+│     ├── Export to Data URL via toDataURL()                   │
+│     └── Update message content via REST API                  │
+├─────────────────────────────────────────────────────────────┤
+│  3. Markdown Rendering                                       │
+│     └── Display ![description](data:image/svg+xml;base64,...) │
+└─────────────────────────────────────────────────────────────┘
+```
+
+## Features
+
+- 🤖 **AI-Powered**: Automatically analyzes text and selects the best infographic template
+- 📊 **Multiple Templates**: Supports 18+ infographic templates (lists, charts, comparisons, etc.)
+- 🖼️ **Self-Contained**: SVG/PNG embedded as Data URL, no external dependencies
+- 📝 **Markdown Native**: Results are pure Markdown images, compatible everywhere
+- 🔄 **API Writeback**: Updates message content via REST API for persistence
+
+## Plugins in This Directory
+
+### 1. `infographic_markdown.py` - Main Plugin ⭐
+- **Purpose**: Production use
+- **Features**: Full AI + AntV Infographic + Data URL embedding
+
+### 2. `js_render_poc.py` - Proof of Concept
+- **Purpose**: Learning and testing
+- **Features**: Simple SVG creation demo, `__event_call__` pattern
+
+## Configuration (Valves)
+
+| Parameter | Type | Default | Description |
+|-----------|------|---------|-------------|
+| `SHOW_STATUS` | bool | `true` | Show operation status updates |
+| `MODEL_ID` | string | `""` | LLM model ID (empty = use current model) |
+| `MIN_TEXT_LENGTH` | int | `50` | Minimum text length required |
+| `MESSAGE_COUNT` | int | `1` | Number of recent messages to use |
+| `SVG_WIDTH` | int | `800` | Width of generated SVG (pixels) |
+| `EXPORT_FORMAT` | string | `"svg"` | Export format: `svg` or `png` |
+
+## Supported Templates
+
+| Category | Template | Description |
+|----------|----------|-------------|
+| List | `list-grid` | Grid cards |
+| List | `list-vertical` | Vertical list |
+| Tree | `tree-vertical` | Vertical tree |
+| Tree | `tree-horizontal` | Horizontal tree |
+| Mind Map | `mindmap` | Mind map |
+| Process | `sequence-roadmap` | Roadmap |
+| Process | `sequence-zigzag` | Zigzag process |
+| Relation | `relation-sankey` | Sankey diagram |
+| Relation | `relation-circle` | Circular relation |
+| Compare | `compare-binary` | Binary comparison |
+| Analysis | `compare-swot` | SWOT analysis |
+| Quadrant | `quadrant-quarter` | Quadrant chart |
+| Chart | `chart-bar` | Bar chart |
+| Chart | `chart-column` | Column chart |
+| Chart | `chart-line` | Line chart |
+| Chart | `chart-pie` | Pie chart |
+| Chart | `chart-doughnut` | Doughnut chart |
+| Chart | `chart-area` | Area chart |
+
+## Syntax Examples
+
+### Grid List
+```infographic
+infographic list-grid
+data
+  title Project Overview
+  items
+    - label Module A
+      desc Description of module A
+    - label Module B
+      desc Description of module B
+```
+
+### Binary Comparison
+```infographic
+infographic compare-binary
+data
+  title Pros vs Cons
+  items
+    - label Pros
+      children
+        - label Strong R&D
+          desc Technology leadership
+    - label Cons
+      children
+        - label Weak brand
+          desc Insufficient marketing
+```
+
+### Bar Chart
+```infographic
+infographic chart-bar
+data
+  title Quarterly Revenue
+  items
+    - label Q1
+      value 120
+    - label Q2
+      value 150
+```
+
+## Technical Details
+
+### Data URL Embedding
+```javascript
+// SVG to Base64 Data URL
+const svgData = new XMLSerializer().serializeToString(svg);
+const base64 = btoa(unescape(encodeURIComponent(svgData)));
+const dataUri = "data:image/svg+xml;base64," + base64;
+
+// Markdown image syntax
+const markdownImage = `![description](${dataUri})`;
+```
+
+### AntV toDataURL API
+```javascript
+// Export as SVG (recommended, supports embedded resources)
+const svgUrl = await instance.toDataURL({
+    type: 'svg',
+    embedResources: true
+});
+
+// Export as PNG (more compatible but larger)
+const pngUrl = await instance.toDataURL({
+    type: 'png',
+    dpr: 2
+});
+```
+
+## Notes
+
+1. **Browser Compatibility**: Requires modern browsers with ES6+ and Fetch API support
+2. **Network Dependency**: First use requires loading AntV library from CDN
+3. **Data URL Size**: Base64 encoding increases size by ~33%
+4. **Chinese Fonts**: SVG export embeds fonts for correct display
+
+## Related Resources
+
+- [AntV Infographic Documentation](https://infographic.antv.vision/)
+- [Infographic API Reference](https://infographic.antv.vision/reference/infographic-api)
+- [Infographic Syntax Guide](https://infographic.antv.vision/learn/infographic-syntax)
+
+## License
+
+MIT License

plugins/actions/js-render-poc/README_CN.md

@@ -0,0 +1,174 @@
+# 信息图转 Markdown
+
+> **版本:** 1.0.0
+
+AI 驱动的信息图生成器，在前端渲染 SVG 并以 Data URL 图片格式直接嵌入到 Markdown 中。
+
+## 概述
+
+这个插件结合了 AI 文本分析能力和 AntV Infographic 可视化引擎，生成精美的信息图并以 Markdown 图片格式直接嵌入到聊天消息中。
+
+### 工作原理
+
+```
+┌─────────────────────────────────────────────────────────────┐
+│                    Open WebUI 插件                           │
+├─────────────────────────────────────────────────────────────┤
+│  1. Python Action                                            │
+│     ├── 接收消息内容                                          │
+│     ├── 调用 LLM 生成 Infographic 语法                        │
+│     └── 发送 __event_call__ 执行前端 JS                      │
+├─────────────────────────────────────────────────────────────┤
+│  2. 浏览器 JS (通过 __event_call__)                          │
+│     ├── 动态加载 AntV Infographic 库                          │
+│     ├── 离屏渲染 SVG                                          │
+│     ├── 使用 toDataURL() 导出 Data URL                        │
+│     └── 通过 REST API 更新消息内容                            │
+├─────────────────────────────────────────────────────────────┤
+│  3. Markdown 渲染                                            │
+│     └── 显示 ![描述](data:image/svg+xml;base64,...)          │
+└─────────────────────────────────────────────────────────────┘
+```
+
+## 功能特点
+
+- 🤖 **AI 驱动**: 自动分析文本并选择最佳的信息图模板
+- 📊 **多种模板**: 支持 18+ 种信息图模板（列表、图表、对比等）
+- 🖼️ **自包含**: SVG/PNG 以 Data URL 嵌入，无外部依赖
+- 📝 **Markdown 原生**: 结果是纯 Markdown 图片，兼容任何平台
+- 🔄 **API 回写**: 通过 REST API 更新消息内容实现持久化
+
+## 目录中的插件
+
+### 1. `infographic_markdown.py` - 主插件 ⭐
+- **用途**: 生产使用
+- **功能**: 完整的 AI + AntV Infographic + Data URL 嵌入
+
+### 2. `infographic_markdown_cn.py` - 主插件（中文版）
+- **用途**: 生产使用
+- **功能**: 与英文版相同，界面文字为中文
+
+### 3. `js_render_poc.py` - 概念验证
+- **用途**: 学习和测试
+- **功能**: 简单的 SVG 创建演示，`__event_call__` 模式
+
+## 配置选项 (Valves)
+
+| 参数 | 类型 | 默认值 | 描述 |
+|------|------|--------|------|
+| `SHOW_STATUS` | bool | `true` | 是否显示操作状态 |
+| `MODEL_ID` | string | `""` | LLM 模型 ID（空则使用当前模型） |
+| `MIN_TEXT_LENGTH` | int | `50` | 最小文本长度要求 |
+| `MESSAGE_COUNT` | int | `1` | 用于生成的最近消息数量 |
+| `SVG_WIDTH` | int | `800` | 生成的 SVG 宽度（像素） |
+| `EXPORT_FORMAT` | string | `"svg"` | 导出格式：`svg` 或 `png` |
+
+## 支持的模板
+
+| 类别 | 模板名称 | 描述 |
+|------|----------|------|
+| 列表 | `list-grid` | 网格卡片 |
+| 列表 | `list-vertical` | 垂直列表 |
+| 树形 | `tree-vertical` | 垂直树 |
+| 树形 | `tree-horizontal` | 水平树 |
+| 思维导图 | `mindmap` | 思维导图 |
+| 流程 | `sequence-roadmap` | 路线图 |
+| 流程 | `sequence-zigzag` | 折线流程 |
+| 关系 | `relation-sankey` | 桑基图 |
+| 关系 | `relation-circle` | 圆形关系 |
+| 对比 | `compare-binary` | 二元对比 |
+| 分析 | `compare-swot` | SWOT 分析 |
+| 象限 | `quadrant-quarter` | 四象限图 |
+| 图表 | `chart-bar` | 条形图 |
+| 图表 | `chart-column` | 柱状图 |
+| 图表 | `chart-line` | 折线图 |
+| 图表 | `chart-pie` | 饼图 |
+| 图表 | `chart-doughnut` | 环形图 |
+| 图表 | `chart-area` | 面积图 |
+
+## 语法示例
+
+### 网格列表
+```infographic
+infographic list-grid
+data
+  title 项目概览
+  items
+    - label 模块一
+      desc 这是第一个模块的描述
+    - label 模块二
+      desc 这是第二个模块的描述
+```
+
+### 二元对比
+```infographic
+infographic compare-binary
+data
+  title 优劣对比
+  items
+    - label 优势
+      children
+        - label 研发能力强
+          desc 技术领先
+    - label 劣势
+      children
+        - label 品牌曝光不足
+          desc 营销力度不够
+```
+
+### 条形图
+```infographic
+infographic chart-bar
+data
+  title 季度收入
+  items
+    - label Q1
+      value 120
+    - label Q2
+      value 150
+```
+
+## 技术细节
+
+### Data URL 嵌入
+```javascript
+// SVG 转 Base64 Data URL
+const svgData = new XMLSerializer().serializeToString(svg);
+const base64 = btoa(unescape(encodeURIComponent(svgData)));
+const dataUri = "data:image/svg+xml;base64," + base64;
+
+// Markdown 图片语法
+const markdownImage = `![描述](${dataUri})`;
+```
+
+### AntV toDataURL API
+```javascript
+// 导出 SVG（推荐，支持嵌入资源）
+const svgUrl = await instance.toDataURL({
+    type: 'svg',
+    embedResources: true
+});
+
+// 导出 PNG（更兼容但体积更大）
+const pngUrl = await instance.toDataURL({
+    type: 'png',
+    dpr: 2
+});
+```
+
+## 注意事项
+
+1. **浏览器兼容性**: 需要现代浏览器支持 ES6+ 和 Fetch API
+2. **网络依赖**: 首次使用需要从 CDN 加载 AntV Infographic 库
+3. **Data URL 大小**: Base64 编码会增加约 33% 的体积
+4. **中文字体**: SVG 导出时会嵌入字体以确保正确显示
+
+## 相关资源
+
+- [AntV Infographic 官方文档](https://infographic.antv.vision/)
+- [Infographic API 参考](https://infographic.antv.vision/reference/infographic-api)
+- [Infographic 语法规范](https://infographic.antv.vision/learn/infographic-syntax)
+
+## 许可证
+
+MIT License

plugins/actions/js-render-poc/infographic_markdown.py

@@ -0,0 +1,592 @@
+"""
+title: 📊 Infographic to Markdown
+author: Fu-Jie
+version: 1.0.0
+description: AI生成信息图语法，前端渲染SVG并转换为Markdown图片格式嵌入消息。支持AntV Infographic模板。
+"""
+
+import time
+import json
+import logging
+import re
+from typing import Optional, Callable, Awaitable, Any, Dict
+from pydantic import BaseModel, Field
+from fastapi import Request
+from datetime import datetime
+
+from open_webui.utils.chat import generate_chat_completion
+from open_webui.models.users import Users
+
+logging.basicConfig(level=logging.INFO)
+logger = logging.getLogger(__name__)
+
+# =================================================================
+# LLM Prompts
+# =================================================================
+
+SYSTEM_PROMPT_INFOGRAPHIC = """
+You are a professional infographic design expert who can analyze user-provided text content and convert it into AntV Infographic syntax format.
+
+## Infographic Syntax Specification
+
+Infographic syntax is a Mermaid-like declarative syntax for describing infographic templates, data, and themes.
+
+### Syntax Rules
+- Entry uses `infographic <template-name>`
+- Key-value pairs are separated by spaces, **absolutely NO colons allowed**
+- Use two spaces for indentation
+- Object arrays use `-` with line breaks
+
+⚠️ **IMPORTANT WARNING: This is NOT YAML format!**
+- ❌ Wrong: `children:` `items:` `data:` (with colons)
+- ✅ Correct: `children` `items` `data` (without colons)
+
+### Template Library & Selection Guide
+
+Choose the most appropriate template based on the content structure:
+
+#### 1. List & Hierarchy
+- **List**: `list-grid` (Grid Cards), `list-vertical` (Vertical List)
+- **Tree**: `tree-vertical` (Vertical Tree), `tree-horizontal` (Horizontal Tree)
+- **Mindmap**: `mindmap` (Mind Map)
+
+#### 2. Sequence & Relationship
+- **Process**: `sequence-roadmap` (Roadmap), `sequence-zigzag` (Zigzag Process)
+- **Relationship**: `relation-sankey` (Sankey Diagram), `relation-circle` (Circular)
+
+#### 3. Comparison & Analysis
+- **Comparison**: `compare-binary` (Binary Comparison)
+- **Analysis**: `compare-swot` (SWOT Analysis), `quadrant-quarter` (Quadrant Chart)
+
+#### 4. Charts & Data
+- **Charts**: `chart-bar`, `chart-column`, `chart-line`, `chart-pie`, `chart-doughnut`, `chart-area`
+
+### Data Structure Examples
+
+#### A. Standard List/Tree
+```infographic
+infographic list-grid
+data
+  title Project Modules
+  items
+    - label Module A
+      desc Description of A
+    - label Module B
+      desc Description of B
+```
+
+#### B. Binary Comparison
+```infographic
+infographic compare-binary
+data
+  title Advantages vs Disadvantages
+  items
+    - label Advantages
+      children
+        - label Strong R&D
+          desc Leading technology
+    - label Disadvantages
+      children
+        - label Weak brand
+          desc Insufficient marketing
+```
+
+#### C. Charts
+```infographic
+infographic chart-bar
+data
+  title Quarterly Revenue
+  items
+    - label Q1
+      value 120
+    - label Q2
+      value 150
+```
+
+### Common Data Fields
+- `label`: Main title/label (Required)
+- `desc`: Description text (max 30 Chinese chars / 60 English chars for `list-grid`)
+- `value`: Numeric value (for charts)
+- `children`: Nested items
+
+## Output Requirements
+1. **Language**: Output content in the user's language.
+2. **Format**: Wrap output in ```infographic ... ```.
+3. **No Colons**: Do NOT use colons after keys.
+4. **Indentation**: Use 2 spaces.
+"""
+
+USER_PROMPT_GENERATE = """
+Please analyze the following text content and convert its core information into AntV Infographic syntax format.
+
+---
+**User Context:**
+User Name: {user_name}
+Current Date/Time: {current_date_time_str}
+User Language: {user_language}
+---
+
+**Text Content:**
+{long_text_content}
+
+Please select the most appropriate infographic template based on text characteristics and output standard infographic syntax.
+
+**Important Note:** 
+- If using `list-grid` format, ensure each card's `desc` description is limited to **maximum 30 Chinese characters** (or **approximately 60 English characters**).
+- Descriptions should be concise and highlight key points.
+"""
+
+
+class Action:
+    class Valves(BaseModel):
+        SHOW_STATUS: bool = Field(
+            default=True, description="Show operation status updates in chat interface."
+        )
+        MODEL_ID: str = Field(
+            default="",
+            description="LLM model ID for text analysis. If empty, uses current conversation model.",
+        )
+        MIN_TEXT_LENGTH: int = Field(
+            default=50,
+            description="Minimum text length (characters) required for infographic analysis.",
+        )
+        MESSAGE_COUNT: int = Field(
+            default=1,
+            description="Number of recent messages to use for generation.",
+        )
+        SVG_WIDTH: int = Field(
+            default=800,
+            description="Width of generated SVG in pixels.",
+        )
+        EXPORT_FORMAT: str = Field(
+            default="svg",
+            description="Export format: 'svg' or 'png'.",
+        )
+
+    def __init__(self):
+        self.valves = self.Valves()
+
+    def _extract_chat_id(self, body: dict, metadata: Optional[dict]) -> str:
+        """Extract chat_id from body or metadata"""
+        if isinstance(body, dict):
+            chat_id = body.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+
+            body_metadata = body.get("metadata", {})
+            if isinstance(body_metadata, dict):
+                chat_id = body_metadata.get("chat_id")
+                if isinstance(chat_id, str) and chat_id.strip():
+                    return chat_id.strip()
+
+        if isinstance(metadata, dict):
+            chat_id = metadata.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+
+        return ""
+
+    def _extract_message_id(self, body: dict, metadata: Optional[dict]) -> str:
+        """Extract message_id from body or metadata"""
+        if isinstance(body, dict):
+            message_id = body.get("id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+
+            body_metadata = body.get("metadata", {})
+            if isinstance(body_metadata, dict):
+                message_id = body_metadata.get("message_id")
+                if isinstance(message_id, str) and message_id.strip():
+                    return message_id.strip()
+
+        if isinstance(metadata, dict):
+            message_id = metadata.get("message_id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+
+        return ""
+
+    def _extract_infographic_syntax(self, llm_output: str) -> str:
+        """Extract infographic syntax from LLM output"""
+        match = re.search(r"```infographic\s*(.*?)\s*```", llm_output, re.DOTALL)
+        if match:
+            return match.group(1).strip()
+        else:
+            logger.warning("LLM output did not follow expected format, treating entire output as syntax.")
+            return llm_output.strip()
+
+    def _extract_text_content(self, content) -> str:
+        """Extract text from message content, supporting multimodal formats"""
+        if isinstance(content, str):
+            return content
+        elif isinstance(content, list):
+            text_parts = []
+            for item in content:
+                if isinstance(item, dict) and item.get("type") == "text":
+                    text_parts.append(item.get("text", ""))
+                elif isinstance(item, str):
+                    text_parts.append(item)
+            return "\n".join(text_parts)
+        return str(content) if content else ""
+
+    async def _emit_status(self, emitter, description: str, done: bool = False):
+        """Send status update event"""
+        if self.valves.SHOW_STATUS and emitter:
+            await emitter(
+                {"type": "status", "data": {"description": description, "done": done}}
+            )
+
+    def _generate_js_code(
+        self,
+        unique_id: str,
+        chat_id: str,
+        message_id: str,
+        infographic_syntax: str,
+        svg_width: int,
+        export_format: str,
+    ) -> str:
+        """Generate JavaScript code for frontend SVG rendering"""
+        
+        # Escape the syntax for JS embedding
+        syntax_escaped = (
+            infographic_syntax
+            .replace("\\", "\\\\")
+            .replace("`", "\\`")
+            .replace("${", "\\${")
+            .replace("</script>", "<\\/script>")
+        )
+        
+        # Template mapping (same as infographic.py)
+        template_mapping_js = """
+        const TEMPLATE_MAPPING = {
+            'list-grid': 'list-grid-compact-card',
+            'list-vertical': 'list-column-simple-vertical-arrow',
+            'tree-vertical': 'hierarchy-tree-tech-style-capsule-item',
+            'tree-horizontal': 'hierarchy-tree-lr-tech-style-capsule-item',
+            'mindmap': 'hierarchy-mindmap-branch-gradient-capsule-item',
+            'sequence-roadmap': 'sequence-roadmap-vertical-simple',
+            'sequence-zigzag': 'sequence-horizontal-zigzag-simple',
+            'sequence-horizontal': 'sequence-horizontal-zigzag-simple',
+            'relation-sankey': 'relation-sankey-simple',
+            'relation-circle': 'relation-circle-icon-badge',
+            'compare-binary': 'compare-binary-horizontal-simple-vs',
+            'compare-swot': 'compare-swot',
+            'quadrant-quarter': 'quadrant-quarter-simple-card',
+            'statistic-card': 'list-grid-compact-card',
+            'chart-bar': 'chart-bar-plain-text',
+            'chart-column': 'chart-column-simple',
+            'chart-line': 'chart-line-plain-text',
+            'chart-area': 'chart-area-simple',
+            'chart-pie': 'chart-pie-plain-text',
+            'chart-doughnut': 'chart-pie-donut-plain-text'
+        };
+        """
+        
+        return f"""
+(async function() {{
+    const uniqueId = "{unique_id}";
+    const chatId = "{chat_id}";
+    const messageId = "{message_id}";
+    const svgWidth = {svg_width};
+    const exportFormat = "{export_format}";
+    
+    console.log("[Infographic Markdown] Starting render...");
+    console.log("[Infographic Markdown] chatId:", chatId, "messageId:", messageId);
+    
+    try {{
+        // Load AntV Infographic if not loaded
+        if (typeof AntVInfographic === 'undefined') {{
+            console.log("[Infographic Markdown] Loading AntV Infographic library...");
+            await new Promise((resolve, reject) => {{
+                const script = document.createElement('script');
+                script.src = 'https://unpkg.com/@antv/infographic@latest/dist/infographic.min.js';
+                script.onload = resolve;
+                script.onerror = reject;
+                document.head.appendChild(script);
+            }});
+            console.log("[Infographic Markdown] Library loaded.");
+        }}
+        
+        const {{ Infographic }} = AntVInfographic;
+        
+        // Get infographic syntax
+        let syntaxContent = `{syntax_escaped}`;
+        console.log("[Infographic Markdown] Original syntax:", syntaxContent.substring(0, 200) + "...");
+        
+        // Clean up syntax
+        const backtick = String.fromCharCode(96);
+        const prefix = backtick + backtick + backtick + 'infographic';
+        const simplePrefix = backtick + backtick + backtick;
+        
+        if (syntaxContent.toLowerCase().startsWith(prefix)) {{
+            syntaxContent = syntaxContent.substring(prefix.length).trim();
+        }} else if (syntaxContent.startsWith(simplePrefix)) {{
+            syntaxContent = syntaxContent.substring(simplePrefix.length).trim();
+        }}
+        
+        if (syntaxContent.endsWith(simplePrefix)) {{
+            syntaxContent = syntaxContent.substring(0, syntaxContent.length - simplePrefix.length).trim();
+        }}
+        
+        // Fix colons after keywords
+        syntaxContent = syntaxContent.replace(/^(data|items|children|theme|config):/gm, '$1');
+        syntaxContent = syntaxContent.replace(/(\\s)(children|items):/g, '$1$2');
+        
+        // Ensure infographic prefix
+        if (!syntaxContent.trim().toLowerCase().startsWith('infographic')) {{
+            syntaxContent = 'infographic list-grid\\n' + syntaxContent;
+        }}
+        
+        // Apply template mapping
+        {template_mapping_js}
+        
+        for (const [key, value] of Object.entries(TEMPLATE_MAPPING)) {{
+            const regex = new RegExp(`infographic\\\\s+${{key}}(?=\\\\s|$)`, 'i');
+            if (regex.test(syntaxContent)) {{
+                console.log(`[Infographic Markdown] Auto-mapping: ${{key}} -> ${{value}}`);
+                syntaxContent = syntaxContent.replace(regex, `infographic ${{value}}`);
+                break;
+            }}
+        }}
+        
+        console.log("[Infographic Markdown] Cleaned syntax:", syntaxContent.substring(0, 200) + "...");
+        
+        // Create offscreen container
+        const container = document.createElement('div');
+        container.id = 'infographic-offscreen-' + uniqueId;
+        container.style.cssText = 'position:absolute;left:-9999px;top:-9999px;width:' + svgWidth + 'px;';
+        document.body.appendChild(container);
+        
+        // Create and render infographic
+        const instance = new Infographic({{
+            container: '#' + container.id,
+            width: svgWidth,
+            padding: 24,
+        }});
+        
+        console.log("[Infographic Markdown] Rendering infographic...");
+        instance.render(syntaxContent);
+        
+        // Wait for render and export
+        await new Promise(resolve => setTimeout(resolve, 1000));
+        
+        let dataUrl;
+        if (exportFormat === 'png') {{
+            dataUrl = await instance.toDataURL({{ type: 'png', dpr: 2 }});
+        }} else {{
+            dataUrl = await instance.toDataURL({{ type: 'svg', embedResources: true }});
+        }}
+        
+        console.log("[Infographic Markdown] Data URL generated, length:", dataUrl.length);
+        
+        // Cleanup
+        instance.destroy();
+        document.body.removeChild(container);
+        
+        // Generate markdown image
+        const markdownImage = `![📊 AI 生成的信息图](${{dataUrl}})`;
+        
+        // Update message via API
+        if (chatId && messageId) {{
+            const token = localStorage.getItem("token");
+            
+            // Get current message content
+            const getResponse = await fetch(`/api/v1/chats/${{chatId}}`, {{
+                method: "GET",
+                headers: {{ "Authorization": `Bearer ${{token}}` }}
+            }});
+            
+            if (!getResponse.ok) {{
+                throw new Error("Failed to get chat data: " + getResponse.status);
+            }}
+            
+            const chatData = await getResponse.json();
+            let originalContent = "";
+            
+            if (chatData.chat && chatData.chat.messages) {{
+                const targetMsg = chatData.chat.messages.find(m => m.id === messageId);
+                if (targetMsg && targetMsg.content) {{
+                    originalContent = targetMsg.content;
+                }}
+            }}
+            
+            // Remove existing infographic images
+            const infographicPattern = /\\n*!\\[📊[^\\]]*\\]\\(data:image\\/[^)]+\\)/g;
+            let cleanedContent = originalContent.replace(infographicPattern, "");
+            cleanedContent = cleanedContent.replace(/\\n{{3,}}/g, "\\n\\n").trim();
+            
+            // Append new image
+            const newContent = cleanedContent + "\\n\\n" + markdownImage;
+            
+            // Update message
+            const updateResponse = await fetch(`/api/v1/chats/${{chatId}}/messages/${{messageId}}/event`, {{
+                method: "POST",
+                headers: {{
+                    "Content-Type": "application/json",
+                    "Authorization": `Bearer ${{token}}`
+                }},
+                body: JSON.stringify({{
+                    type: "chat:message",
+                    data: {{ content: newContent }}
+                }})
+            }});
+            
+            if (updateResponse.ok) {{
+                console.log("[Infographic Markdown] ✅ Message updated successfully!");
+            }} else {{
+                console.error("[Infographic Markdown] API error:", updateResponse.status);
+            }}
+        }} else {{
+            console.warn("[Infographic Markdown] ⚠️ Missing chatId or messageId");
+        }}
+        
+    }} catch (error) {{
+        console.error("[Infographic Markdown] Error:", error);
+    }}
+}})();
+"""
+
+    async def action(
+        self,
+        body: dict,
+        __user__: dict = None,
+        __event_emitter__=None,
+        __event_call__: Optional[Callable[[Any], Awaitable[None]]] = None,
+        __metadata__: Optional[dict] = None,
+        __request__: Request = None,
+    ) -> dict:
+        """
+        Generate infographic using AntV and embed as Markdown image.
+        """
+        logger.info("Action: Infographic to Markdown started")
+
+        # Get user information
+        if isinstance(__user__, (list, tuple)):
+            user_language = __user__[0].get("language", "en") if __user__ else "en"
+            user_name = __user__[0].get("name", "User") if __user__[0] else "User"
+            user_id = __user__[0].get("id", "unknown_user") if __user__ else "unknown_user"
+        elif isinstance(__user__, dict):
+            user_language = __user__.get("language", "en")
+            user_name = __user__.get("name", "User")
+            user_id = __user__.get("id", "unknown_user")
+        else:
+            user_language = "en"
+            user_name = "User"
+            user_id = "unknown_user"
+
+        # Get current time
+        now = datetime.now()
+        current_date_time_str = now.strftime("%Y-%m-%d %H:%M:%S")
+
+        try:
+            messages = body.get("messages", [])
+            if not messages:
+                raise ValueError("No messages available.")
+
+            # Get recent messages
+            message_count = min(self.valves.MESSAGE_COUNT, len(messages))
+            recent_messages = messages[-message_count:]
+
+            # Aggregate content
+            aggregated_parts = []
+            for msg in recent_messages:
+                text_content = self._extract_text_content(msg.get("content"))
+                if text_content:
+                    aggregated_parts.append(text_content)
+
+            if not aggregated_parts:
+                raise ValueError("No text content found in messages.")
+
+            long_text_content = "\n\n---\n\n".join(aggregated_parts)
+
+            # Remove existing HTML blocks
+            parts = re.split(r"```html.*?```", long_text_content, flags=re.DOTALL)
+            clean_content = ""
+            for part in reversed(parts):
+                if part.strip():
+                    clean_content = part.strip()
+                    break
+
+            if not clean_content:
+                clean_content = long_text_content.strip()
+
+            # Check minimum length
+            if len(clean_content) < self.valves.MIN_TEXT_LENGTH:
+                await self._emit_status(
+                    __event_emitter__,
+                    f"⚠️ 内容太短 ({len(clean_content)} 字符)，至少需要 {self.valves.MIN_TEXT_LENGTH} 字符",
+                    True,
+                )
+                return body
+
+            await self._emit_status(__event_emitter__, "📊 正在分析内容...", False)
+
+            # Generate infographic syntax via LLM
+            formatted_user_prompt = USER_PROMPT_GENERATE.format(
+                user_name=user_name,
+                current_date_time_str=current_date_time_str,
+                user_language=user_language,
+                long_text_content=clean_content,
+            )
+
+            target_model = self.valves.MODEL_ID or body.get("model")
+
+            llm_payload = {
+                "model": target_model,
+                "messages": [
+                    {"role": "system", "content": SYSTEM_PROMPT_INFOGRAPHIC},
+                    {"role": "user", "content": formatted_user_prompt},
+                ],
+                "stream": False,
+            }
+
+            user_obj = Users.get_user_by_id(user_id)
+            if not user_obj:
+                raise ValueError(f"Unable to get user object: {user_id}")
+
+            await self._emit_status(__event_emitter__, "📊 AI 正在生成信息图语法...", False)
+
+            llm_response = await generate_chat_completion(__request__, llm_payload, user_obj)
+
+            if not llm_response or "choices" not in llm_response or not llm_response["choices"]:
+                raise ValueError("Invalid LLM response.")
+
+            assistant_content = llm_response["choices"][0]["message"]["content"]
+            infographic_syntax = self._extract_infographic_syntax(assistant_content)
+
+            logger.info(f"Generated syntax: {infographic_syntax[:200]}...")
+
+            # Extract IDs for API callback
+            chat_id = self._extract_chat_id(body, __metadata__)
+            message_id = self._extract_message_id(body, __metadata__)
+            unique_id = f"ig_{int(time.time() * 1000)}"
+
+            await self._emit_status(__event_emitter__, "📊 正在渲染 SVG...", False)
+
+            # Execute JS to render and embed
+            if __event_call__:
+                js_code = self._generate_js_code(
+                    unique_id=unique_id,
+                    chat_id=chat_id,
+                    message_id=message_id,
+                    infographic_syntax=infographic_syntax,
+                    svg_width=self.valves.SVG_WIDTH,
+                    export_format=self.valves.EXPORT_FORMAT,
+                )
+
+                await __event_call__(
+                    {
+                        "type": "execute",
+                        "data": {"code": js_code},
+                    }
+                )
+
+            await self._emit_status(__event_emitter__, "✅ 信息图生成完成！", True)
+            logger.info("Infographic to Markdown completed")
+
+        except Exception as e:
+            error_message = f"Infographic generation failed: {str(e)}"
+            logger.error(error_message, exc_info=True)
+            await self._emit_status(__event_emitter__, f"❌ {error_message}", True)
+
+        return body

plugins/actions/js-render-poc/infographic_markdown_cn.py

@@ -0,0 +1,592 @@
+"""
+title: 📊 信息图转 Markdown
+author: Fu-Jie
+version: 1.0.0
+description: AI 生成信息图语法，前端渲染 SVG 并转换为 Markdown 图片格式嵌入消息。支持 AntV Infographic 模板。
+"""
+
+import time
+import json
+import logging
+import re
+from typing import Optional, Callable, Awaitable, Any, Dict
+from pydantic import BaseModel, Field
+from fastapi import Request
+from datetime import datetime
+
+from open_webui.utils.chat import generate_chat_completion
+from open_webui.models.users import Users
+
+logging.basicConfig(level=logging.INFO)
+logger = logging.getLogger(__name__)
+
+# =================================================================
+# LLM 提示词
+# =================================================================
+
+SYSTEM_PROMPT_INFOGRAPHIC = """
+你是一位专业的信息图设计专家，能够分析用户提供的文本内容并将其转换为 AntV Infographic 语法格式。
+
+## 信息图语法规范
+
+信息图语法是一种类似 Mermaid 的声明式语法，用于描述信息图模板、数据和主题。
+
+### 语法规则
+- 入口使用 `infographic <模板名>`
+- 键值对用空格分隔，**绝对不允许使用冒号**
+- 使用两个空格缩进
+- 对象数组使用 `-` 加换行
+
+⚠️ **重要警告：这不是 YAML 格式！**
+- ❌ 错误：`children:` `items:` `data:`（带冒号）
+- ✅ 正确：`children` `items` `data`（不带冒号）
+
+### 模板库与选择指南
+
+根据内容结构选择最合适的模板：
+
+#### 1. 列表与层级
+- **列表**：`list-grid`（网格卡片）、`list-vertical`（垂直列表）
+- **树形**：`tree-vertical`（垂直树）、`tree-horizontal`（水平树）
+- **思维导图**：`mindmap`（思维导图）
+
+#### 2. 序列与关系
+- **流程**：`sequence-roadmap`（路线图）、`sequence-zigzag`（折线流程）
+- **关系**：`relation-sankey`（桑基图）、`relation-circle`（圆形关系）
+
+#### 3. 对比与分析
+- **对比**：`compare-binary`（二元对比）
+- **分析**：`compare-swot`（SWOT 分析）、`quadrant-quarter`（象限图）
+
+#### 4. 图表与数据
+- **图表**：`chart-bar`、`chart-column`、`chart-line`、`chart-pie`、`chart-doughnut`、`chart-area`
+
+### 数据结构示例
+
+#### A. 标准列表/树形
+```infographic
+infographic list-grid
+data
+  title 项目模块
+  items
+    - label 模块 A
+      desc 模块 A 的描述
+    - label 模块 B
+      desc 模块 B 的描述
+```
+
+#### B. 二元对比
+```infographic
+infographic compare-binary
+data
+  title 优势与劣势
+  items
+    - label 优势
+      children
+        - label 研发能力强
+          desc 技术领先
+    - label 劣势
+      children
+        - label 品牌曝光弱
+          desc 营销不足
+```
+
+#### C. 图表
+```infographic
+infographic chart-bar
+data
+  title 季度收入
+  items
+    - label Q1
+      value 120
+    - label Q2
+      value 150
+```
+
+### 常用数据字段
+- `label`：主标题/标签（必填）
+- `desc`：描述文字（`list-grid` 最多 30 个中文字符）
+- `value`：数值（用于图表）
+- `children`：嵌套项
+
+## 输出要求
+1. **语言**：使用用户的语言输出内容。
+2. **格式**：用 ```infographic ... ``` 包裹输出。
+3. **无冒号**：键后面不要使用冒号。
+4. **缩进**：使用 2 个空格。
+"""
+
+USER_PROMPT_GENERATE = """
+请分析以下文本内容，将其核心信息转换为 AntV Infographic 语法格式。
+
+---
+**用户上下文：**
+用户名：{user_name}
+当前时间：{current_date_time_str}
+用户语言：{user_language}
+---
+
+**文本内容：**
+{long_text_content}
+
+请根据文本特征选择最合适的信息图模板，输出标准的信息图语法。
+
+**重要提示：** 
+- 如果使用 `list-grid` 格式，确保每个卡片的 `desc` 描述限制在 **最多 30 个中文字符**。
+- 描述应简洁，突出重点。
+"""
+
+
+class Action:
+    class Valves(BaseModel):
+        SHOW_STATUS: bool = Field(
+            default=True, description="在聊天界面显示操作状态更新。"
+        )
+        MODEL_ID: str = Field(
+            default="",
+            description="用于文本分析的 LLM 模型 ID。留空则使用当前对话模型。",
+        )
+        MIN_TEXT_LENGTH: int = Field(
+            default=50,
+            description="信息图分析所需的最小文本长度（字符数）。",
+        )
+        MESSAGE_COUNT: int = Field(
+            default=1,
+            description="用于生成的最近消息数量。",
+        )
+        SVG_WIDTH: int = Field(
+            default=800,
+            description="生成的 SVG 宽度（像素）。",
+        )
+        EXPORT_FORMAT: str = Field(
+            default="svg",
+            description="导出格式：'svg' 或 'png'。",
+        )
+
+    def __init__(self):
+        self.valves = self.Valves()
+
+    def _extract_chat_id(self, body: dict, metadata: Optional[dict]) -> str:
+        """从 body 或 metadata 中提取 chat_id"""
+        if isinstance(body, dict):
+            chat_id = body.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+
+            body_metadata = body.get("metadata", {})
+            if isinstance(body_metadata, dict):
+                chat_id = body_metadata.get("chat_id")
+                if isinstance(chat_id, str) and chat_id.strip():
+                    return chat_id.strip()
+
+        if isinstance(metadata, dict):
+            chat_id = metadata.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+
+        return ""
+
+    def _extract_message_id(self, body: dict, metadata: Optional[dict]) -> str:
+        """从 body 或 metadata 中提取 message_id"""
+        if isinstance(body, dict):
+            message_id = body.get("id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+
+            body_metadata = body.get("metadata", {})
+            if isinstance(body_metadata, dict):
+                message_id = body_metadata.get("message_id")
+                if isinstance(message_id, str) and message_id.strip():
+                    return message_id.strip()
+
+        if isinstance(metadata, dict):
+            message_id = metadata.get("message_id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+
+        return ""
+
+    def _extract_infographic_syntax(self, llm_output: str) -> str:
+        """从 LLM 输出中提取信息图语法"""
+        match = re.search(r"```infographic\s*(.*?)\s*```", llm_output, re.DOTALL)
+        if match:
+            return match.group(1).strip()
+        else:
+            logger.warning("LLM 输出未遵循预期格式，将整个输出作为语法处理。")
+            return llm_output.strip()
+
+    def _extract_text_content(self, content) -> str:
+        """从消息内容中提取文本，支持多模态格式"""
+        if isinstance(content, str):
+            return content
+        elif isinstance(content, list):
+            text_parts = []
+            for item in content:
+                if isinstance(item, dict) and item.get("type") == "text":
+                    text_parts.append(item.get("text", ""))
+                elif isinstance(item, str):
+                    text_parts.append(item)
+            return "\n".join(text_parts)
+        return str(content) if content else ""
+
+    async def _emit_status(self, emitter, description: str, done: bool = False):
+        """发送状态更新事件"""
+        if self.valves.SHOW_STATUS and emitter:
+            await emitter(
+                {"type": "status", "data": {"description": description, "done": done}}
+            )
+
+    def _generate_js_code(
+        self,
+        unique_id: str,
+        chat_id: str,
+        message_id: str,
+        infographic_syntax: str,
+        svg_width: int,
+        export_format: str,
+    ) -> str:
+        """生成用于前端 SVG 渲染的 JavaScript 代码"""
+        
+        # 转义语法以便嵌入 JS
+        syntax_escaped = (
+            infographic_syntax
+            .replace("\\", "\\\\")
+            .replace("`", "\\`")
+            .replace("${", "\\${")
+            .replace("</script>", "<\\/script>")
+        )
+        
+        # 模板映射
+        template_mapping_js = """
+        const TEMPLATE_MAPPING = {
+            'list-grid': 'list-grid-compact-card',
+            'list-vertical': 'list-column-simple-vertical-arrow',
+            'tree-vertical': 'hierarchy-tree-tech-style-capsule-item',
+            'tree-horizontal': 'hierarchy-tree-lr-tech-style-capsule-item',
+            'mindmap': 'hierarchy-mindmap-branch-gradient-capsule-item',
+            'sequence-roadmap': 'sequence-roadmap-vertical-simple',
+            'sequence-zigzag': 'sequence-horizontal-zigzag-simple',
+            'sequence-horizontal': 'sequence-horizontal-zigzag-simple',
+            'relation-sankey': 'relation-sankey-simple',
+            'relation-circle': 'relation-circle-icon-badge',
+            'compare-binary': 'compare-binary-horizontal-simple-vs',
+            'compare-swot': 'compare-swot',
+            'quadrant-quarter': 'quadrant-quarter-simple-card',
+            'statistic-card': 'list-grid-compact-card',
+            'chart-bar': 'chart-bar-plain-text',
+            'chart-column': 'chart-column-simple',
+            'chart-line': 'chart-line-plain-text',
+            'chart-area': 'chart-area-simple',
+            'chart-pie': 'chart-pie-plain-text',
+            'chart-doughnut': 'chart-pie-donut-plain-text'
+        };
+        """
+        
+        return f"""
+(async function() {{
+    const uniqueId = "{unique_id}";
+    const chatId = "{chat_id}";
+    const messageId = "{message_id}";
+    const svgWidth = {svg_width};
+    const exportFormat = "{export_format}";
+    
+    console.log("[信息图 Markdown] 开始渲染...");
+    console.log("[信息图 Markdown] chatId:", chatId, "messageId:", messageId);
+    
+    try {{
+        // 加载 AntV Infographic（如果尚未加载）
+        if (typeof AntVInfographic === 'undefined') {{
+            console.log("[信息图 Markdown] 正在加载 AntV Infographic 库...");
+            await new Promise((resolve, reject) => {{
+                const script = document.createElement('script');
+                script.src = 'https://unpkg.com/@antv/infographic@latest/dist/infographic.min.js';
+                script.onload = resolve;
+                script.onerror = reject;
+                document.head.appendChild(script);
+            }});
+            console.log("[信息图 Markdown] 库加载完成。");
+        }}
+        
+        const {{ Infographic }} = AntVInfographic;
+        
+        // 获取信息图语法
+        let syntaxContent = `{syntax_escaped}`;
+        console.log("[信息图 Markdown] 原始语法:", syntaxContent.substring(0, 200) + "...");
+        
+        // 清理语法
+        const backtick = String.fromCharCode(96);
+        const prefix = backtick + backtick + backtick + 'infographic';
+        const simplePrefix = backtick + backtick + backtick;
+        
+        if (syntaxContent.toLowerCase().startsWith(prefix)) {{
+            syntaxContent = syntaxContent.substring(prefix.length).trim();
+        }} else if (syntaxContent.startsWith(simplePrefix)) {{
+            syntaxContent = syntaxContent.substring(simplePrefix.length).trim();
+        }}
+        
+        if (syntaxContent.endsWith(simplePrefix)) {{
+            syntaxContent = syntaxContent.substring(0, syntaxContent.length - simplePrefix.length).trim();
+        }}
+        
+        // 修复关键字后的冒号
+        syntaxContent = syntaxContent.replace(/^(data|items|children|theme|config):/gm, '$1');
+        syntaxContent = syntaxContent.replace(/(\\s)(children|items):/g, '$1$2');
+        
+        // 确保有 infographic 前缀
+        if (!syntaxContent.trim().toLowerCase().startsWith('infographic')) {{
+            syntaxContent = 'infographic list-grid\\n' + syntaxContent;
+        }}
+        
+        // 应用模板映射
+        {template_mapping_js}
+        
+        for (const [key, value] of Object.entries(TEMPLATE_MAPPING)) {{
+            const regex = new RegExp(`infographic\\\\s+${{key}}(?=\\\\s|$)`, 'i');
+            if (regex.test(syntaxContent)) {{
+                console.log(`[信息图 Markdown] 自动映射: ${{key}} -> ${{value}}`);
+                syntaxContent = syntaxContent.replace(regex, `infographic ${{value}}`);
+                break;
+            }}
+        }}
+        
+        console.log("[信息图 Markdown] 清理后语法:", syntaxContent.substring(0, 200) + "...");
+        
+        // 创建离屏容器
+        const container = document.createElement('div');
+        container.id = 'infographic-offscreen-' + uniqueId;
+        container.style.cssText = 'position:absolute;left:-9999px;top:-9999px;width:' + svgWidth + 'px;';
+        document.body.appendChild(container);
+        
+        // 创建并渲染信息图
+        const instance = new Infographic({{
+            container: '#' + container.id,
+            width: svgWidth,
+            padding: 24,
+        }});
+        
+        console.log("[信息图 Markdown] 正在渲染信息图...");
+        instance.render(syntaxContent);
+        
+        // 等待渲染完成并导出
+        await new Promise(resolve => setTimeout(resolve, 1000));
+        
+        let dataUrl;
+        if (exportFormat === 'png') {{
+            dataUrl = await instance.toDataURL({{ type: 'png', dpr: 2 }});
+        }} else {{
+            dataUrl = await instance.toDataURL({{ type: 'svg', embedResources: true }});
+        }}
+        
+        console.log("[信息图 Markdown] Data URL 已生成，长度:", dataUrl.length);
+        
+        // 清理
+        instance.destroy();
+        document.body.removeChild(container);
+        
+        // 生成 Markdown 图片
+        const markdownImage = `![📊 AI 生成的信息图](${{dataUrl}})`;
+        
+        // 通过 API 更新消息
+        if (chatId && messageId) {{
+            const token = localStorage.getItem("token");
+            
+            // 获取当前消息内容
+            const getResponse = await fetch(`/api/v1/chats/${{chatId}}`, {{
+                method: "GET",
+                headers: {{ "Authorization": `Bearer ${{token}}` }}
+            }});
+            
+            if (!getResponse.ok) {{
+                throw new Error("获取对话数据失败: " + getResponse.status);
+            }}
+            
+            const chatData = await getResponse.json();
+            let originalContent = "";
+            
+            if (chatData.chat && chatData.chat.messages) {{
+                const targetMsg = chatData.chat.messages.find(m => m.id === messageId);
+                if (targetMsg && targetMsg.content) {{
+                    originalContent = targetMsg.content;
+                }}
+            }}
+            
+            // 移除已有的信息图图片
+            const infographicPattern = /\\n*!\\[📊[^\\]]*\\]\\(data:image\\/[^)]+\\)/g;
+            let cleanedContent = originalContent.replace(infographicPattern, "");
+            cleanedContent = cleanedContent.replace(/\\n{{3,}}/g, "\\n\\n").trim();
+            
+            // 追加新图片
+            const newContent = cleanedContent + "\\n\\n" + markdownImage;
+            
+            // 更新消息
+            const updateResponse = await fetch(`/api/v1/chats/${{chatId}}/messages/${{messageId}}/event`, {{
+                method: "POST",
+                headers: {{
+                    "Content-Type": "application/json",
+                    "Authorization": `Bearer ${{token}}`
+                }},
+                body: JSON.stringify({{
+                    type: "chat:message",
+                    data: {{ content: newContent }}
+                }})
+            }});
+            
+            if (updateResponse.ok) {{
+                console.log("[信息图 Markdown] ✅ 消息更新成功！");
+            }} else {{
+                console.error("[信息图 Markdown] API 错误:", updateResponse.status);
+            }}
+        }} else {{
+            console.warn("[信息图 Markdown] ⚠️ 缺少 chatId 或 messageId");
+        }}
+        
+    }} catch (error) {{
+        console.error("[信息图 Markdown] 错误:", error);
+    }}
+}})();
+"""
+
+    async def action(
+        self,
+        body: dict,
+        __user__: dict = None,
+        __event_emitter__=None,
+        __event_call__: Optional[Callable[[Any], Awaitable[None]]] = None,
+        __metadata__: Optional[dict] = None,
+        __request__: Request = None,
+    ) -> dict:
+        """
+        使用 AntV 生成信息图并作为 Markdown 图片嵌入。
+        """
+        logger.info("动作：信息图转 Markdown 开始")
+
+        # 获取用户信息
+        if isinstance(__user__, (list, tuple)):
+            user_language = __user__[0].get("language", "zh") if __user__ else "zh"
+            user_name = __user__[0].get("name", "用户") if __user__[0] else "用户"
+            user_id = __user__[0].get("id", "unknown_user") if __user__ else "unknown_user"
+        elif isinstance(__user__, dict):
+            user_language = __user__.get("language", "zh")
+            user_name = __user__.get("name", "用户")
+            user_id = __user__.get("id", "unknown_user")
+        else:
+            user_language = "zh"
+            user_name = "用户"
+            user_id = "unknown_user"
+
+        # 获取当前时间
+        now = datetime.now()
+        current_date_time_str = now.strftime("%Y-%m-%d %H:%M:%S")
+
+        try:
+            messages = body.get("messages", [])
+            if not messages:
+                raise ValueError("没有可用的消息。")
+
+            # 获取最近的消息
+            message_count = min(self.valves.MESSAGE_COUNT, len(messages))
+            recent_messages = messages[-message_count:]
+
+            # 聚合内容
+            aggregated_parts = []
+            for msg in recent_messages:
+                text_content = self._extract_text_content(msg.get("content"))
+                if text_content:
+                    aggregated_parts.append(text_content)
+
+            if not aggregated_parts:
+                raise ValueError("消息中未找到文本内容。")
+
+            long_text_content = "\n\n---\n\n".join(aggregated_parts)
+
+            # 移除已有的 HTML 块
+            parts = re.split(r"```html.*?```", long_text_content, flags=re.DOTALL)
+            clean_content = ""
+            for part in reversed(parts):
+                if part.strip():
+                    clean_content = part.strip()
+                    break
+
+            if not clean_content:
+                clean_content = long_text_content.strip()
+
+            # 检查最小长度
+            if len(clean_content) < self.valves.MIN_TEXT_LENGTH:
+                await self._emit_status(
+                    __event_emitter__,
+                    f"⚠️ 内容太短（{len(clean_content)} 字符），至少需要 {self.valves.MIN_TEXT_LENGTH} 字符",
+                    True,
+                )
+                return body
+
+            await self._emit_status(__event_emitter__, "📊 正在分析内容...", False)
+
+            # 通过 LLM 生成信息图语法
+            formatted_user_prompt = USER_PROMPT_GENERATE.format(
+                user_name=user_name,
+                current_date_time_str=current_date_time_str,
+                user_language=user_language,
+                long_text_content=clean_content,
+            )
+
+            target_model = self.valves.MODEL_ID or body.get("model")
+
+            llm_payload = {
+                "model": target_model,
+                "messages": [
+                    {"role": "system", "content": SYSTEM_PROMPT_INFOGRAPHIC},
+                    {"role": "user", "content": formatted_user_prompt},
+                ],
+                "stream": False,
+            }
+
+            user_obj = Users.get_user_by_id(user_id)
+            if not user_obj:
+                raise ValueError(f"无法获取用户对象：{user_id}")
+
+            await self._emit_status(__event_emitter__, "📊 AI 正在生成信息图语法...", False)
+
+            llm_response = await generate_chat_completion(__request__, llm_payload, user_obj)
+
+            if not llm_response or "choices" not in llm_response or not llm_response["choices"]:
+                raise ValueError("无效的 LLM 响应。")
+
+            assistant_content = llm_response["choices"][0]["message"]["content"]
+            infographic_syntax = self._extract_infographic_syntax(assistant_content)
+
+            logger.info(f"生成的语法：{infographic_syntax[:200]}...")
+
+            # 提取 API 回调所需的 ID
+            chat_id = self._extract_chat_id(body, __metadata__)
+            message_id = self._extract_message_id(body, __metadata__)
+            unique_id = f"ig_{int(time.time() * 1000)}"
+
+            await self._emit_status(__event_emitter__, "📊 正在渲染 SVG...", False)
+
+            # 执行 JS 进行渲染和嵌入
+            if __event_call__:
+                js_code = self._generate_js_code(
+                    unique_id=unique_id,
+                    chat_id=chat_id,
+                    message_id=message_id,
+                    infographic_syntax=infographic_syntax,
+                    svg_width=self.valves.SVG_WIDTH,
+                    export_format=self.valves.EXPORT_FORMAT,
+                )
+
+                await __event_call__(
+                    {
+                        "type": "execute",
+                        "data": {"code": js_code},
+                    }
+                )
+
+            await self._emit_status(__event_emitter__, "✅ 信息图生成完成！", True)
+            logger.info("信息图转 Markdown 完成")
+
+        except Exception as e:
+            error_message = f"信息图生成失败：{str(e)}"
+            logger.error(error_message, exc_info=True)
+            await self._emit_status(__event_emitter__, f"❌ {error_message}", True)
+
+        return body

plugins/actions/js-render-poc/js_render_poc.py

@@ -0,0 +1,257 @@
+"""
+title: JS Render PoC
+author: Fu-Jie
+version: 0.6.0
+description: Proof of concept for JS rendering + API write-back pattern. JS renders SVG and updates message via API.
+"""
+
+import time
+import json
+import logging
+from typing import Optional, Callable, Awaitable, Any
+from pydantic import BaseModel, Field
+from fastapi import Request
+
+logging.basicConfig(level=logging.INFO)
+logger = logging.getLogger(__name__)
+
+
+class Action:
+    class Valves(BaseModel):
+        pass
+
+    def __init__(self):
+        self.valves = self.Valves()
+
+    def _extract_chat_id(self, body: dict, metadata: Optional[dict]) -> str:
+        """Extract chat_id from body or metadata"""
+        if isinstance(body, dict):
+            # body["chat_id"] 是 chat_id
+            chat_id = body.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+
+            body_metadata = body.get("metadata", {})
+            if isinstance(body_metadata, dict):
+                chat_id = body_metadata.get("chat_id")
+                if isinstance(chat_id, str) and chat_id.strip():
+                    return chat_id.strip()
+
+        if isinstance(metadata, dict):
+            chat_id = metadata.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+
+        return ""
+
+    def _extract_message_id(self, body: dict, metadata: Optional[dict]) -> str:
+        """Extract message_id from body or metadata"""
+        if isinstance(body, dict):
+            # body["id"] 是 message_id
+            message_id = body.get("id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+
+            body_metadata = body.get("metadata", {})
+            if isinstance(body_metadata, dict):
+                message_id = body_metadata.get("message_id")
+                if isinstance(message_id, str) and message_id.strip():
+                    return message_id.strip()
+
+        if isinstance(metadata, dict):
+            message_id = metadata.get("message_id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+
+        return ""
+
+    async def action(
+        self,
+        body: dict,
+        __user__: dict = None,
+        __event_emitter__=None,
+        __event_call__: Optional[Callable[[Any], Awaitable[None]]] = None,
+        __metadata__: Optional[dict] = None,
+        __request__: Request = None,
+    ) -> dict:
+        """
+        PoC: Use __event_call__ to execute JS that renders SVG and updates message via API.
+        """
+        # 准备调试数据
+        body_for_log = {}
+        for k, v in body.items():
+            if k == "messages":
+                body_for_log[k] = f"[{len(v)} messages]"
+            else:
+                body_for_log[k] = v
+
+        body_json = json.dumps(body_for_log, ensure_ascii=False, default=str)
+        metadata_json = (
+            json.dumps(__metadata__, ensure_ascii=False, default=str)
+            if __metadata__
+            else "null"
+        )
+
+        # 转义 JSON 中的特殊字符以便嵌入 JS
+        body_json_escaped = (
+            body_json.replace("\\", "\\\\").replace("`", "\\`").replace("${", "\\${")
+        )
+        metadata_json_escaped = (
+            metadata_json.replace("\\", "\\\\")
+            .replace("`", "\\`")
+            .replace("${", "\\${")
+        )
+
+        chat_id = self._extract_chat_id(body, __metadata__)
+        message_id = self._extract_message_id(body, __metadata__)
+
+        unique_id = f"poc_{int(time.time() * 1000)}"
+
+        if __event_emitter__:
+            await __event_emitter__(
+                {
+                    "type": "status",
+                    "data": {"description": "🔄 正在渲染...", "done": False},
+                }
+            )
+
+        if __event_call__:
+            await __event_call__(
+                {
+                    "type": "execute",
+                    "data": {
+                        "code": f"""
+(async function() {{
+    const uniqueId = "{unique_id}";
+    const chatId = "{chat_id}";
+    const messageId = "{message_id}";
+    
+    // ===== DEBUG: 输出 Python 端的数据 =====
+    console.log("[JS Render PoC] ===== DEBUG INFO (from Python) =====");
+    console.log("[JS Render PoC] body:", `{body_json_escaped}`);
+    console.log("[JS Render PoC] __metadata__:", `{metadata_json_escaped}`);
+    console.log("[JS Render PoC] Extracted: chatId=", chatId, "messageId=", messageId);
+    console.log("[JS Render PoC] =========================================");
+    
+    try {{
+        console.log("[JS Render PoC] Starting SVG render...");
+        
+        // Create SVG
+        const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+        svg.setAttribute("width", "200");
+        svg.setAttribute("height", "200");
+        svg.setAttribute("viewBox", "0 0 200 200");
+        svg.setAttribute("xmlns", "http://www.w3.org/2000/svg");
+        
+        const defs = document.createElementNS("http://www.w3.org/2000/svg", "defs");
+        const gradient = document.createElementNS("http://www.w3.org/2000/svg", "linearGradient");
+        gradient.setAttribute("id", "grad-" + uniqueId);
+        gradient.innerHTML = `
+            <stop offset="0%" style="stop-color:#1e88e5;stop-opacity:1" />
+            <stop offset="100%" style="stop-color:#43a047;stop-opacity:1" />
+        `;
+        defs.appendChild(gradient);
+        svg.appendChild(defs);
+        
+        const circle = document.createElementNS("http://www.w3.org/2000/svg", "circle");
+        circle.setAttribute("cx", "100");
+        circle.setAttribute("cy", "100");
+        circle.setAttribute("r", "80");
+        circle.setAttribute("fill", `url(#grad-${{uniqueId}})`);
+        svg.appendChild(circle);
+        
+        const text = document.createElementNS("http://www.w3.org/2000/svg", "text");
+        text.setAttribute("x", "100");
+        text.setAttribute("y", "105");
+        text.setAttribute("text-anchor", "middle");
+        text.setAttribute("fill", "white");
+        text.setAttribute("font-size", "16");
+        text.setAttribute("font-weight", "bold");
+        text.textContent = "PoC Success!";
+        svg.appendChild(text);
+        
+        // Convert to Base64 Data URI
+        const svgData = new XMLSerializer().serializeToString(svg);
+        const base64 = btoa(unescape(encodeURIComponent(svgData)));
+        const dataUri = "data:image/svg+xml;base64," + base64;
+        
+        console.log("[JS Render PoC] SVG rendered, data URI length:", dataUri.length);
+        
+        // Call API - 完全替换方案（更稳定）
+        if (chatId && messageId) {{
+            const token = localStorage.getItem("token");
+            
+            // 1. 获取当前消息内容
+            const getResponse = await fetch(`/api/v1/chats/${{chatId}}`, {{
+                method: "GET",
+                headers: {{ "Authorization": `Bearer ${{token}}` }}
+            }});
+            
+            if (!getResponse.ok) {{
+                throw new Error("Failed to get chat data: " + getResponse.status);
+            }}
+            
+            const chatData = await getResponse.json();
+            console.log("[JS Render PoC] Got chat data");
+            
+            let originalContent = "";
+            if (chatData.chat && chatData.chat.messages) {{
+                const targetMsg = chatData.chat.messages.find(m => m.id === messageId);
+                if (targetMsg && targetMsg.content) {{
+                    originalContent = targetMsg.content;
+                    console.log("[JS Render PoC] Found original content, length:", originalContent.length);
+                }}
+            }}
+            
+            // 2. 移除已存在的 PoC 图片（如果有的话）
+            // 匹配 ![JS Render PoC 生成的 SVG](data:...) 格式
+            const pocImagePattern = /\\n*!\\[JS Render PoC[^\\]]*\\]\\(data:image\\/svg\\+xml;base64,[^)]+\\)/g;
+            let cleanedContent = originalContent.replace(pocImagePattern, "");
+            // 移除可能残留的多余空行
+            cleanedContent = cleanedContent.replace(/\\n{{3,}}/g, "\\n\\n").trim();
+            
+            if (cleanedContent !== originalContent) {{
+                console.log("[JS Render PoC] Removed existing PoC image(s)");
+            }}
+            
+            // 3. 添加新的 Markdown 图片
+            const markdownImage = `![JS Render PoC 生成的 SVG](${{dataUri}})`;
+            const newContent = cleanedContent + "\\n\\n" + markdownImage;
+            
+            // 3. 使用 chat:message 完全替换
+            const updateResponse = await fetch(`/api/v1/chats/${{chatId}}/messages/${{messageId}}/event`, {{
+                method: "POST",
+                headers: {{
+                    "Content-Type": "application/json",
+                    "Authorization": `Bearer ${{token}}`
+                }},
+                body: JSON.stringify({{
+                    type: "chat:message",
+                    data: {{ content: newContent }}
+                }})
+            }});
+            
+            if (updateResponse.ok) {{
+                console.log("[JS Render PoC] ✅ Message updated successfully!");
+            }} else {{
+                console.error("[JS Render PoC] API error:", updateResponse.status, await updateResponse.text());
+            }}
+        }} else {{
+            console.warn("[JS Render PoC] ⚠️ Missing chatId or messageId, cannot persist.");
+        }}
+        
+    }} catch (error) {{
+        console.error("[JS Render PoC] Error:", error);
+    }}
+}})();
+                        """
+                    },
+                }
+            )
+
+        if __event_emitter__:
+            await __event_emitter__(
+                {"type": "status", "data": {"description": "✅ 渲染完成", "done": True}}
+            )
+
+        return body

plugins/actions/smart-mind-map/README.md

@@ -1,6 +1,6 @@
 # Smart Mind Map - Mind Mapping Generation Plugin
 
-**Author:** [Fu-Jie](https://github.com/Fu-Jie) | **Version:** 0.8.0 | **License:** MIT
+**Author:** [Fu-Jie](https://github.com/Fu-Jie) | **Version:** 0.9.1 | **License:** MIT
 
 > **Important**: To ensure the maintainability and usability of all plugins, each plugin should be accompanied by clear and comprehensive documentation to ensure its functionality, configuration, and usage are well explained.
 
@@ -8,6 +8,25 @@ Smart Mind Map is a powerful OpenWebUI action plugin that intelligently analyzes
 
 ---
 
+## 🔥 What's New in v0.9.1
+
+**New Feature: Image Output Mode**
+
+- **Static Image Support**: Added `OUTPUT_MODE` configuration parameter.
+  - `html` (default): Interactive HTML mind map.
+  - `image`: Static SVG image embedded directly in Markdown (**No HTML code output**, cleaner chat history).
+- **Efficient Storage**: Image mode uploads SVG to `/api/v1/files`, avoiding huge base64 strings in chat history.
+- **Smart Features**: Auto-responsive width and automatic theme detection (light/dark) for generated images.
+
+| Feature | HTML Mode (Default) | Image Mode |
+| :--- | :--- | :--- |
+| **Output Format** | Interactive HTML Block | Static Markdown Image |
+| **Interactivity** | Zoom, Pan, Expand/Collapse | None (Static Image) |
+| **Chat History** | Contains HTML Code | Clean (Image URL only) |
+| **Storage** | Browser Rendering | `/api/v1/files` Upload |
+
+---
+
 ## Core Features
 
 - ✅ **Intelligent Text Analysis**: Automatically identifies core themes, key concepts, and hierarchical structures
@@ -20,6 +39,7 @@ Smart Mind Map is a powerful OpenWebUI action plugin that intelligently analyzes
 - ✅ **Real-time Rendering**: Renders mind maps directly in the chat interface without navigation
 - ✅ **Export Capabilities**: Supports PNG, SVG code, and Markdown source export
 - ✅ **Customizable Configuration**: Configurable LLM model, minimum text length, and other parameters
+- ✅ **Image Output Mode**: Generate static SVG images embedded directly in Markdown (**No HTML code output**, cleaner chat history)
 
 ---
 
@@ -80,6 +100,7 @@ You can adjust the following parameters in the plugin's settings (Valves):
 | `MIN_TEXT_LENGTH` | `100` | Minimum text length (in characters) required for mind map analysis. Text that's too short cannot generate valid mind maps. |
 | `CLEAR_PREVIOUS_HTML` | `false` | Whether to clear previous plugin-generated HTML content when generating a new mind map. |
 | `MESSAGE_COUNT` | `1` | Number of recent messages to use for mind map generation (1-5). |
+| `OUTPUT_MODE` | `html` | Output mode: `html` for interactive HTML (default), or `image` to embed as static Markdown image. |
 
 ---
 
@@ -277,7 +298,37 @@ This plugin uses only OpenWebUI's built-in dependencies. **No additional package
 
 ## Changelog
 
-### v0.8.0 (Current Version)
+### v0.9.1
+
+**New Feature: Image Output Mode**
+
+- Added `OUTPUT_MODE` configuration parameter with two options:
+  - `html` (default): Interactive HTML mind map with full control panel
+  - `image`: Static SVG image embedded directly in Markdown (uploaded to `/api/v1/files`)
+- Image mode features:
+  - Auto-responsive width (adapts to chat container)
+  - Automatic theme detection (light/dark)
+  - Persistent storage via Chat API (survives page refresh)
+  - Efficient file storage (no huge base64 strings in chat history)
+
+**Improvements:**
+
+- Implemented robust Chat API update mechanism with retry logic
+- Fixed message persistence using both `messages[]` and `history.messages`
+- Added Event API for immediate frontend updates
+- Removed unnecessary `SVG_WIDTH` and `SVG_HEIGHT` parameters (now auto-calculated)
+
+**Technical Details:**
+
+- Image mode uses `__event_call__` to execute JavaScript in the browser
+- SVG is rendered offline, converted to Blob, and uploaded to OpenWebUI Files API
+- Updates chat message with `/api/v1/files/{id}/content` URL via OpenWebUI Backend-Controlled API flow
+
+### v0.8.2
+
+- Removed debug messages from output
+
+### v0.8.0 (Previous Version)
 
 **Major Features:**
 

plugins/actions/smart-mind-map/README_CN.md

@@ -1,6 +1,6 @@
 # 思维导图 - 思维导图生成插件
 
-**作者:** [Fu-Jie](https://github.com/Fu-Jie) | **版本:** 0.8.0 | **许可证:** MIT
+**作者:** [Fu-Jie](https://github.com/Fu-Jie) | **版本:** 0.9.1 | **许可证:** MIT
 
 > **重要提示**：为了确保所有插件的可维护性和易用性，每个插件都应附带清晰、完整的文档，以确保其功能、配置和使用方法得到充分说明。
 
@@ -8,6 +8,25 @@
 
 ---
 
+## 🔥 v0.9.1 更新亮点
+
+**新功能：图片输出模式**
+
+- **静态图片支持**：新增 `OUTPUT_MODE` 配置参数。
+  - `html`（默认）：交互式 HTML 思维导图。
+  - `image`：静态 SVG 图片直接嵌入 Markdown（**不输出 HTML 代码**，聊天记录更简洁）。
+- **高效存储**：图片模式将 SVG 上传至 `/api/v1/files`，避免聊天记录中出现超长 Base64 字符串。
+- **智能特性**：生成的图片支持自动响应式宽度和自动主题检测（亮色/暗色）。
+
+| 特性 | HTML 模式 (默认) | 图片模式 |
+| :--- | :--- | :--- |
+| **输出格式** | 交互式 HTML 代码块 | 静态 Markdown 图片 |
+| **交互性** | 缩放、拖拽、展开/折叠 | 无 (静态图片) |
+| **聊天记录** | 包含 HTML 代码 | 简洁 (仅图片链接) |
+| **存储方式** | 浏览器实时渲染 | `/api/v1/files` 上传 |
+
+---
+
 ## 核心特性
 
 - ✅ **智能文本分析**：自动识别文本的核心主题、关键概念和层次结构
@@ -20,6 +39,7 @@
 - ✅ **实时渲染**：在聊天界面中直接渲染思维导图，无需跳转
 - ✅ **导出功能**：支持 PNG、SVG 代码和 Markdown 源码导出
 - ✅ **自定义配置**：可配置 LLM 模型、最小文本长度等参数
+- ✅ **图片输出模式**：生成静态 SVG 图片直接嵌入 Markdown（**不输出 HTML 代码**，聊天记录更简洁）
 
 ---
 
@@ -80,6 +100,7 @@
 | `MIN_TEXT_LENGTH` | `100` | 进行思维导图分析所需的最小文本长度（字符数）。文本过短将无法生成有效的导图。 |
 | `CLEAR_PREVIOUS_HTML` | `false` | 在生成新的思维导图时，是否清除之前由插件生成的 HTML 内容。 |
 | `MESSAGE_COUNT` | `1` | 用于生成思维导图的最近消息数量（1-5）。 |
+| `OUTPUT_MODE` | `html` | 输出模式：`html` 为交互式 HTML（默认），`image` 为嵌入静态 Markdown 图片。 |
 
 ---
 
@@ -277,7 +298,37 @@
 
 ## 更新日志
 
-### v0.8.0（当前版本）
+### v0.9.1
+
+**新功能：图片输出模式**
+
+- 新增 `OUTPUT_MODE` 配置参数，支持两种模式：
+  - `html`（默认）：交互式 HTML 思维导图，带完整控制面板
+  - `image`：静态 SVG 图片直接嵌入 Markdown（上传至 `/api/v1/files`）
+- 图片模式特性：
+  - 自动响应式宽度（适应聊天容器）
+  - 自动主题检测（亮色/暗色）
+  - 通过 Chat API 持久化存储（刷新页面后保留）
+  - 高效文件存储（聊天记录中无超长 Base64 字符串）
+
+**改进项：**
+
+- 实现健壮的 Chat API 更新机制，带重试逻辑
+- 修复消息持久化，同时更新 `messages[]` 和 `history.messages`
+- 添加 Event API 实现即时前端更新
+- 移除不必要的 `SVG_WIDTH` 和 `SVG_HEIGHT` 参数（现已自动计算）
+
+**技术细节：**
+
+- 图片模式使用 `__event_call__` 在浏览器中执行 JavaScript
+- SVG 离屏渲染，转换为 Blob，并上传至 OpenWebUI Files API
+- 通过 OpenWebUI Backend-Controlled API 流程更新聊天消息为 `/api/v1/files/{id}/content` URL
+
+### v0.8.2
+
+- 移除输出中的调试信息
+
+### v0.8.0 (Previous Version)
 
 **主要功能：**
 

plugins/actions/smart-mind-map/smart_mind_map.py

@@ -3,7 +3,8 @@ title: Smart Mind Map
 author: Fu-Jie
 author_url: https://github.com/Fu-Jie
 funding_url: https://github.com/Fu-Jie/awesome-openwebui
-version: 0.8.1
+version: 0.9.1
+openwebui_id: 3094c59a-b4dd-4e0c-9449-15e2dd547dc4
 icon_url: data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxyZWN0IHg9IjE2IiB5PSIxNiIgd2lkdGg9IjYiIGhlaWdodD0iNiIgcng9IjEiLz48cmVjdCB4PSIyIiB5PSIxNiIgd2lkdGg9IjYiIGhlaWdodD0iNiIgcng9IjEiLz48cmVjdCB4PSI5IiB5PSIyIiB3aWR0aD0iNiIgaGVpZ2h0PSI2IiByeD0iMSIvPjxwYXRoIGQ9Ik01IDE2di0zYTEgMSAwIDAgMSAxLTFoMTJhMSAxIDAgMCAxIDEgMXYzIi8+PHBhdGggZD0iTTEyIDEyVjgiLz48L3N2Zz4=
 description: Intelligently analyzes text content and generates interactive mind maps to help users structure and visualize knowledge.
 """
@@ -13,7 +14,7 @@ import os
 import re
 import time
 from datetime import datetime, timezone
-from typing import Any, Dict, Optional
+from typing import Any, Callable, Awaitable, Dict, Optional
 from zoneinfo import ZoneInfo
 
 from fastapi import Request
@@ -786,6 +787,10 @@ class Action:
             default=1,
             description="Number of recent messages to use for generation. Set to 1 for just the last message, or higher for more context.",
         )
+        OUTPUT_MODE: str = Field(
+            default="html",
+            description="Output mode: 'html' for interactive HTML (default), or 'image' to embed as Markdown image.",
+        )
 
     def __init__(self):
         self.valves = self.Valves()
@@ -814,6 +819,46 @@ class Action:
             "user_language": user_data.get("language", "en-US"),
         }
 
+    def _extract_chat_id(self, body: dict, metadata: Optional[dict]) -> str:
+        """Extract chat_id from body or metadata"""
+        if isinstance(body, dict):
+            chat_id = body.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+
+            body_metadata = body.get("metadata", {})
+            if isinstance(body_metadata, dict):
+                chat_id = body_metadata.get("chat_id")
+                if isinstance(chat_id, str) and chat_id.strip():
+                    return chat_id.strip()
+
+        if isinstance(metadata, dict):
+            chat_id = metadata.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+
+        return ""
+
+    def _extract_message_id(self, body: dict, metadata: Optional[dict]) -> str:
+        """Extract message_id from body or metadata"""
+        if isinstance(body, dict):
+            message_id = body.get("id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+
+            body_metadata = body.get("metadata", {})
+            if isinstance(body_metadata, dict):
+                message_id = body_metadata.get("message_id")
+                if isinstance(message_id, str) and message_id.strip():
+                    return message_id.strip()
+
+        if isinstance(metadata, dict):
+            message_id = metadata.get("message_id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+
+        return ""
+
     def _extract_markdown_syntax(self, llm_output: str) -> str:
         match = re.search(r"```markdown\s*(.*?)\s*```", llm_output, re.DOTALL)
         if match:
@@ -901,14 +946,391 @@ class Action:
 
         return base_html.strip()
 
+    def _generate_image_js_code(
+        self,
+        unique_id: str,
+        chat_id: str,
+        message_id: str,
+        markdown_syntax: str,
+    ) -> str:
+        """Generate JavaScript code for frontend SVG rendering and image embedding"""
+
+        # Escape the syntax for JS embedding
+        syntax_escaped = (
+            markdown_syntax.replace("\\", "\\\\")
+            .replace("`", "\\`")
+            .replace("${", "\\${")
+            .replace("</script>", "<\\/script>")
+        )
+
+        return f"""
+(async function() {{
+    const uniqueId = "{unique_id}";
+    const chatId = "{chat_id}";
+    const messageId = "{message_id}";
+    const defaultWidth = 1200;
+    const defaultHeight = 800;
+    
+    // Theme detection - check parent document for OpenWebUI theme
+    const detectTheme = () => {{
+        try {{
+            // 1. Check parent document's html/body class or data-theme
+            const html = document.documentElement;
+            const body = document.body;
+            const htmlClass = html ? html.className : '';
+            const bodyClass = body ? body.className : '';
+            const htmlDataTheme = html ? html.getAttribute('data-theme') : '';
+            
+            if (htmlDataTheme === 'dark' || bodyClass.includes('dark') || htmlClass.includes('dark')) {{
+                return 'dark';
+            }}
+            if (htmlDataTheme === 'light' || bodyClass.includes('light') || htmlClass.includes('light')) {{
+                return 'light';
+            }}
+            
+            // 2. Check meta theme-color
+            const metas = document.querySelectorAll('meta[name="theme-color"]');
+            if (metas.length > 0) {{
+                const color = metas[metas.length - 1].content.trim();
+                const m = color.match(/^#?([0-9a-f]{{6}})$/i);
+                if (m) {{
+                    const hex = m[1];
+                    const r = parseInt(hex.slice(0, 2), 16);
+                    const g = parseInt(hex.slice(2, 4), 16);
+                    const b = parseInt(hex.slice(4, 6), 16);
+                    const luma = (0.2126 * r + 0.7152 * g + 0.0722 * b) / 255;
+                    return luma < 0.5 ? 'dark' : 'light';
+                }}
+            }}
+            
+            // 3. Check system preference
+            if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {{
+                return 'dark';
+            }}
+            
+            return 'light';
+        }} catch (e) {{
+            return 'light';
+        }}
+    }};
+    
+    const currentTheme = detectTheme();
+    console.log("[MindMap Image] Detected theme:", currentTheme);
+    
+    // Theme-based colors
+    const colors = currentTheme === 'dark' ? {{
+        background: '#1f2937',
+        text: '#e5e7eb',
+        link: '#94a3b8',
+        nodeStroke: '#64748b'
+    }} : {{
+        background: '#ffffff',
+        text: '#1f2937',
+        link: '#546e7a',
+        nodeStroke: '#94a3b8'
+    }};
+    
+    // Auto-detect chat container width for responsive sizing
+    let svgWidth = defaultWidth;
+    let svgHeight = defaultHeight;
+    const chatContainer = document.getElementById('chat-container');
+    if (chatContainer) {{
+        const containerWidth = chatContainer.clientWidth;
+        if (containerWidth > 100) {{
+            // Use container width with some padding (90% of container)
+            svgWidth = Math.floor(containerWidth * 0.9);
+            // Maintain aspect ratio based on default dimensions
+            svgHeight = Math.floor(svgWidth * (defaultHeight / defaultWidth));
+            console.log("[MindMap Image] Auto-detected container width:", containerWidth, "-> SVG:", svgWidth, "x", svgHeight);
+        }}
+    }}
+    
+    console.log("[MindMap Image] Starting render...");
+    console.log("[MindMap Image] chatId:", chatId, "messageId:", messageId);
+    
+    try {{
+        // Load D3 if not loaded
+        if (typeof d3 === 'undefined') {{
+            console.log("[MindMap Image] Loading D3...");
+            await new Promise((resolve, reject) => {{
+                const script = document.createElement('script');
+                script.src = 'https://cdn.jsdelivr.net/npm/d3@7';
+                script.onload = resolve;
+                script.onerror = reject;
+                document.head.appendChild(script);
+            }});
+        }}
+        
+        // Load markmap-lib if not loaded
+        if (!window.markmap || !window.markmap.Transformer) {{
+            console.log("[MindMap Image] Loading markmap-lib...");
+            await new Promise((resolve, reject) => {{
+                const script = document.createElement('script');
+                script.src = 'https://cdn.jsdelivr.net/npm/markmap-lib@0.17';
+                script.onload = resolve;
+                script.onerror = reject;
+                document.head.appendChild(script);
+            }});
+        }}
+        
+        // Load markmap-view if not loaded
+        if (!window.markmap || !window.markmap.Markmap) {{
+            console.log("[MindMap Image] Loading markmap-view...");
+            await new Promise((resolve, reject) => {{
+                const script = document.createElement('script');
+                script.src = 'https://cdn.jsdelivr.net/npm/markmap-view@0.17';
+                script.onload = resolve;
+                script.onerror = reject;
+                document.head.appendChild(script);
+            }});
+        }}
+        
+        const {{ Transformer, Markmap }} = window.markmap;
+        
+        // Get markdown syntax
+        let syntaxContent = `{syntax_escaped}`;
+        console.log("[MindMap Image] Syntax length:", syntaxContent.length);
+        
+        // Create offscreen container
+        const container = document.createElement('div');
+        container.id = 'mindmap-offscreen-' + uniqueId;
+        container.style.cssText = 'position:absolute;left:-9999px;top:-9999px;width:' + svgWidth + 'px;height:' + svgHeight + 'px;';
+        document.body.appendChild(container);
+        
+        // Create SVG element
+        const svgEl = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+        svgEl.setAttribute('width', svgWidth);
+        svgEl.setAttribute('height', svgHeight);
+        svgEl.style.width = svgWidth + 'px';
+        svgEl.style.height = svgHeight + 'px';
+        svgEl.style.backgroundColor = colors.background;
+        container.appendChild(svgEl);
+        
+        // Transform markdown to tree
+        const transformer = new Transformer();
+        const {{ root }} = transformer.transform(syntaxContent);
+        
+        // Create markmap instance
+        const options = {{
+            autoFit: true,
+            initialExpandLevel: Infinity,
+            zoom: false,
+            pan: false
+        }};
+        
+        console.log("[MindMap Image] Rendering markmap...");
+        const markmapInstance = Markmap.create(svgEl, options, root);
+        
+        // Wait for render to complete
+        await new Promise(resolve => setTimeout(resolve, 1500));
+        markmapInstance.fit();
+        await new Promise(resolve => setTimeout(resolve, 500));
+        
+        // Clone and prepare SVG for export
+        const clonedSvg = svgEl.cloneNode(true);
+        clonedSvg.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
+        clonedSvg.setAttribute('xmlns:xlink', 'http://www.w3.org/1999/xlink');
+        
+        // Add background rect with theme color
+        const bgRect = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
+        bgRect.setAttribute('width', '100%');
+        bgRect.setAttribute('height', '100%');
+        bgRect.setAttribute('fill', colors.background);
+        clonedSvg.insertBefore(bgRect, clonedSvg.firstChild);
+        
+        // Add inline styles with theme colors
+        const style = document.createElementNS('http://www.w3.org/2000/svg', 'style');
+        style.textContent = `
+            text {{ font-family: sans-serif; font-size: 14px; fill: ${{colors.text}}; }}
+            foreignObject, .markmap-foreign, .markmap-foreign div {{ color: ${{colors.text}}; font-family: sans-serif; font-size: 14px; }}
+            h1 {{ font-size: 22px; font-weight: 700; margin: 0; }}
+            h2 {{ font-size: 18px; font-weight: 600; margin: 0; }}
+            strong {{ font-weight: 700; }}
+            .markmap-link {{ stroke: ${{colors.link}}; fill: none; }}
+            .markmap-node circle, .markmap-node rect {{ stroke: ${{colors.nodeStroke}}; }}
+        `;
+        clonedSvg.insertBefore(style, bgRect.nextSibling);
+        
+        // Convert foreignObject to text for better compatibility
+        const foreignObjects = clonedSvg.querySelectorAll('foreignObject');
+        foreignObjects.forEach(fo => {{
+            const text = fo.textContent || '';
+            const g = document.createElementNS('http://www.w3.org/2000/svg', 'g');
+            const textEl = document.createElementNS('http://www.w3.org/2000/svg', 'text');
+            textEl.setAttribute('x', fo.getAttribute('x') || '0');
+            textEl.setAttribute('y', (parseFloat(fo.getAttribute('y') || '0') + 14).toString());
+            textEl.setAttribute('fill', colors.text);
+            textEl.setAttribute('font-family', 'sans-serif');
+            textEl.setAttribute('font-size', '14');
+            textEl.textContent = text.trim();
+            g.appendChild(textEl);
+            fo.parentNode.replaceChild(g, fo);
+        }});
+        
+        // Serialize SVG to string
+        const svgData = new XMLSerializer().serializeToString(clonedSvg);
+        
+        // Cleanup container
+        document.body.removeChild(container);
+        
+        // Convert SVG string to Blob
+        const blob = new Blob([svgData], {{ type: 'image/svg+xml' }});
+        const file = new File([blob], `mindmap-${{uniqueId}}.svg`, {{ type: 'image/svg+xml' }});
+        
+        // Upload file to OpenWebUI API
+        console.log("[MindMap Image] Uploading SVG file...");
+        const token = localStorage.getItem("token");
+        const formData = new FormData();
+        formData.append('file', file);
+        
+        const uploadResponse = await fetch('/api/v1/files/', {{
+            method: 'POST',
+            headers: {{
+                'Authorization': `Bearer ${{token}}`
+            }},
+            body: formData
+        }});
+        
+        if (!uploadResponse.ok) {{
+            throw new Error(`Upload failed: ${{uploadResponse.statusText}}`);
+        }}
+        
+        const fileData = await uploadResponse.json();
+        const fileId = fileData.id;
+        const imageUrl = `/api/v1/files/${{fileId}}/content`;
+        
+        console.log("[MindMap Image] File uploaded, ID:", fileId);
+        
+        // Generate markdown image with file URL
+        const markdownImage = `![🧠 Mind Map](${{imageUrl}})`;
+        
+        // Update message via API
+        if (chatId && messageId) {{
+            
+            // Helper function with retry logic
+            const fetchWithRetry = async (url, options, retries = 3) => {{
+                for (let i = 0; i < retries; i++) {{
+                    try {{
+                        const response = await fetch(url, options);
+                        if (response.ok) return response;
+                        if (i < retries - 1) {{
+                            console.log(`[MindMap Image] Retry ${{i + 1}}/${{retries}} for ${{url}}`);
+                            await new Promise(r => setTimeout(r, 1000 * (i + 1)));
+                        }}
+                    }} catch (e) {{
+                        if (i === retries - 1) throw e;
+                        await new Promise(r => setTimeout(r, 1000 * (i + 1)));
+                    }}
+                }}
+                return null;
+            }};
+            
+            // Get current chat data
+            const getResponse = await fetch(`/api/v1/chats/${{chatId}}`, {{
+                method: "GET",
+                headers: {{ "Authorization": `Bearer ${{token}}` }}
+            }});
+            
+            if (!getResponse.ok) {{
+                throw new Error("Failed to get chat data: " + getResponse.status);
+            }}
+            
+            const chatData = await getResponse.json();
+            let updatedMessages = [];
+            let newContent = "";
+            
+            if (chatData.chat && chatData.chat.messages) {{
+                updatedMessages = chatData.chat.messages.map(m => {{
+                    if (m.id === messageId) {{
+                        const originalContent = m.content || "";
+                        // Remove existing mindmap images (both base64 and file URL patterns)
+                        const mindmapPattern = /\\n*!\\[🧠[^\\]]*\\]\\((?:data:image\\/[^)]+|(?:\\/api\\/v1\\/files\\/[^)]+))\\)/g;
+                        let cleanedContent = originalContent.replace(mindmapPattern, "");
+                        cleanedContent = cleanedContent.replace(/\\n{{3,}}/g, "\\n\\n").trim();
+                        // Append new image
+                        newContent = cleanedContent + "\\n\\n" + markdownImage;
+                        
+                        // Critical: Update content in both messages array AND history object
+                        // The history object is the source of truth for the database
+                        if (chatData.chat.history && chatData.chat.history.messages) {{
+                            if (chatData.chat.history.messages[messageId]) {{
+                                chatData.chat.history.messages[messageId].content = newContent;
+                            }}
+                        }}
+                        
+                        return {{ ...m, content: newContent }};
+                    }}
+                    return m;
+                }});
+            }}
+            
+            if (!newContent) {{
+                console.warn("[MindMap Image] Could not find message to update");
+                return;
+            }}
+            
+            // Try to update frontend display via event API (optional, may not exist in all versions)
+            try {{
+                await fetch(`/api/v1/chats/${{chatId}}/messages/${{messageId}}/event`, {{
+                    method: "POST",
+                    headers: {{
+                        "Content-Type": "application/json",
+                        "Authorization": `Bearer ${{token}}`
+                    }},
+                    body: JSON.stringify({{
+                        type: "chat:message",
+                        data: {{ content: newContent }}
+                    }})
+                }});
+            }} catch (eventErr) {{
+                // Event API is optional, continue with persistence
+                console.log("[MindMap Image] Event API not available, continuing...");
+            }}
+            
+            // Persist to database by updating the entire chat object
+            // This follows the OpenWebUI Backend-Controlled API Flow
+            const updatePayload = {{
+                chat: {{
+                    ...chatData.chat,
+                    messages: updatedMessages
+                    // history is already updated in-place above
+                }}
+            }};
+            
+            const persistResponse = await fetchWithRetry(`/api/v1/chats/${{chatId}}`, {{
+                method: "POST",
+                headers: {{
+                    "Content-Type": "application/json",
+                    "Authorization": `Bearer ${{token}}`
+                }},
+                body: JSON.stringify(updatePayload)
+            }});
+            
+            if (persistResponse && persistResponse.ok) {{
+                console.log("[MindMap Image] ✅ Message persisted successfully!");
+            }} else {{
+                console.error("[MindMap Image] ❌ Failed to persist message after retries");
+            }}
+        }} else {{
+            console.warn("[MindMap Image] ⚠️ Missing chatId or messageId, cannot persist");
+        }}
+        
+    }} catch (error) {{
+        console.error("[MindMap Image] Error:", error);
+    }}
+}})();
+"""
+
     async def action(
         self,
         body: dict,
         __user__: Optional[Dict[str, Any]] = None,
         __event_emitter__: Optional[Any] = None,
+        __event_call__: Optional[Callable[[Any], Awaitable[None]]] = None,
+        __metadata__: Optional[dict] = None,
         __request__: Optional[Request] = None,
     ) -> Optional[dict]:
-        logger.info("Action: Smart Mind Map (v0.8.0) started")
+        logger.info("Action: Smart Mind Map (v0.9.1) started")
         user_ctx = self._get_user_context(__user__)
         user_language = user_ctx["user_language"]
         user_name = user_ctx["user_name"]
@@ -960,7 +1382,7 @@ class Action:
                     if role == "user"
                     else "Assistant" if role == "assistant" else role
                 )
-                aggregated_parts.append(f"[{role_label} Message {i}]\n{text_content}")
+                aggregated_parts.append(f"{text_content}")
 
         if not aggregated_parts:
             error_message = "Unable to retrieve valid user message content."
@@ -1090,6 +1512,45 @@ class Action:
                         user_language,
                     )
 
+            # Check output mode
+            if self.valves.OUTPUT_MODE == "image":
+                # Image mode: use JavaScript to render and embed as Markdown image
+                chat_id = self._extract_chat_id(body, __metadata__)
+                message_id = self._extract_message_id(body, __metadata__)
+
+                await self._emit_status(
+                    __event_emitter__,
+                    "Smart Mind Map: Rendering image...",
+                    False,
+                )
+
+                if __event_call__:
+                    js_code = self._generate_image_js_code(
+                        unique_id=unique_id,
+                        chat_id=chat_id,
+                        message_id=message_id,
+                        markdown_syntax=markdown_syntax,
+                    )
+
+                    await __event_call__(
+                        {
+                            "type": "execute",
+                            "data": {"code": js_code},
+                        }
+                    )
+
+                await self._emit_status(
+                    __event_emitter__, "Smart Mind Map: Image generated!", True
+                )
+                await self._emit_notification(
+                    __event_emitter__,
+                    f"Mind map image has been generated, {user_name}!",
+                    "success",
+                )
+                logger.info("Action: Smart Mind Map (v0.9.1) completed in image mode")
+                return body
+
+            # HTML mode (default): embed as HTML block
             html_embed_tag = f"```html\n{final_html}\n```"
             body["messages"][-1]["content"] = f"{long_text_content}\n\n{html_embed_tag}"
 
@@ -1101,7 +1562,7 @@ class Action:
                 f"Mind map has been generated, {user_name}!",
                 "success",
             )
-            logger.info("Action: Smart Mind Map (v0.8.0) completed successfully")
+            logger.info("Action: Smart Mind Map (v0.9.1) completed in HTML mode")
 
         except Exception as e:
             error_message = f"Smart Mind Map processing failed: {str(e)}"

plugins/actions/smart-mind-map/smart_mind_map_cn.py

@@ -3,7 +3,8 @@ title: 思维导图
 author: Fu-Jie
 author_url: https://github.com/Fu-Jie
 funding_url: https://github.com/Fu-Jie/awesome-openwebui
-version: 0.8.1
+version: 0.9.1
+openwebui_id: 8d4b097b-219b-4dd2-b509-05fbe6388335
 icon_url: data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxyZWN0IHg9IjE2IiB5PSIxNiIgd2lkdGg9IjYiIGhlaWdodD0iNiIgcng9IjEiLz48cmVjdCB4PSIyIiB5PSIxNiIgd2lkdGg9IjYiIGhlaWdodD0iNiIgcng9IjEiLz48cmVjdCB4PSI5IiB5PSIyIiB3aWR0aD0iNiIgaGVpZ2h0PSI2IiByeD0iMSIvPjxwYXRoIGQ9Ik01IDE2di0zYTEgMSAwIDAgMSAxLTFoMTJhMSAxIDAgMCAxIDEgMXYzIi8+PHBhdGggZD0iTTEyIDEyVjgiLz48L3N2Zz4=
 description: 智能分析文本内容,生成交互式思维导图,帮助用户结构化和可视化知识。
 """
@@ -13,7 +14,7 @@ import os
 import re
 import time
 from datetime import datetime, timezone
-from typing import Any, Dict, Optional
+from typing import Any, Callable, Awaitable, Dict, Optional
 from zoneinfo import ZoneInfo
 
 from fastapi import Request
@@ -443,7 +444,7 @@ SCRIPT_TEMPLATE_MINDMAP = """
 
             const markdownContent = sourceEl.textContent.trim();
             if (!markdownContent) {
-                containerEl.innerHTML = '<div class="error-message">⚠️ 无法加载思维导图：缺少有效内容。</div>';
+                containerEl.innerHTML = '<div class="error-message">⚠️ 无法加载思维导图:缺少有效内容。</div>';
                 return;
             }
 
@@ -485,7 +486,7 @@ SCRIPT_TEMPLATE_MINDMAP = """
 
             }).catch((error) => {
                 console.error('Markmap loading error:', error);
-                containerEl.innerHTML = '<div class="error-message">⚠️ 资源加载失败，请稍后重试。</div>';
+                containerEl.innerHTML = '<div class="error-message">⚠️ 资源加载失败,请稍后重试。</div>';
             });
         };
 
@@ -771,19 +772,23 @@ class Action:
         )
         MODEL_ID: str = Field(
             default="",
-            description="用于文本分析的内置LLM模型ID。如果为空，则使用当前对话的模型。",
+            description="用于文本分析的内置LLM模型ID。如果为空,则使用当前对话的模型。",
         )
         MIN_TEXT_LENGTH: int = Field(
             default=100,
-            description="进行思维导图分析所需的最小文本长度（字符数）。",
+            description="进行思维导图分析所需的最小文本长度(字符数)。",
         )
         CLEAR_PREVIOUS_HTML: bool = Field(
             default=False,
-            description="是否强制清除旧的插件结果（如果为 True，则不合并，直接覆盖）。",
+            description="是否强制清除旧的插件结果(如果为 True,则不合并,直接覆盖)。",
         )
         MESSAGE_COUNT: int = Field(
             default=1,
-            description="用于生成的最近消息数量。设置为1仅使用最后一条消息，更大值可包含更多上下文。",
+            description="用于生成的最近消息数量。设置为1仅使用最后一条消息,更大值可包含更多上下文。",
+        )
+        OUTPUT_MODE: str = Field(
+            default="html",
+            description="输出模式: 'html' 为交互式HTML(默认),'image' 为嵌入Markdown图片。",
         )
 
     def __init__(self):
@@ -813,14 +818,52 @@ class Action:
             "user_language": user_data.get("language", "zh-CN"),
         }
 
+    def _extract_chat_id(self, body: dict, metadata: Optional[dict]) -> str:
+        """从 body 或 metadata 中提取 chat_id"""
+        if isinstance(body, dict):
+            chat_id = body.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+
+            body_metadata = body.get("metadata", {})
+            if isinstance(body_metadata, dict):
+                chat_id = body_metadata.get("chat_id")
+                if isinstance(chat_id, str) and chat_id.strip():
+                    return chat_id.strip()
+
+        if isinstance(metadata, dict):
+            chat_id = metadata.get("chat_id")
+            if isinstance(chat_id, str) and chat_id.strip():
+                return chat_id.strip()
+
+        return ""
+
+    def _extract_message_id(self, body: dict, metadata: Optional[dict]) -> str:
+        """从 body 或 metadata 中提取 message_id"""
+        if isinstance(body, dict):
+            message_id = body.get("id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+
+            body_metadata = body.get("metadata", {})
+            if isinstance(body_metadata, dict):
+                message_id = body_metadata.get("message_id")
+                if isinstance(message_id, str) and message_id.strip():
+                    return message_id.strip()
+
+        if isinstance(metadata, dict):
+            message_id = metadata.get("message_id")
+            if isinstance(message_id, str) and message_id.strip():
+                return message_id.strip()
+
+        return ""
+
     def _extract_markdown_syntax(self, llm_output: str) -> str:
         match = re.search(r"```markdown\s*(.*?)\s*```", llm_output, re.DOTALL)
         if match:
             extracted_content = match.group(1).strip()
         else:
-            logger.warning(
-                "LLM输出未严格遵循预期Markdown格式，将整个输出作为摘要处理。"
-            )
+            logger.warning("LLM输出未严格遵循预期Markdown格式,将整个输出作为摘要处理。")
             extracted_content = llm_output.strip()
         return extracted_content.replace("</script>", "<\\/script>")
 
@@ -844,7 +887,7 @@ class Action:
         return re.sub(pattern, "", content).strip()
 
     def _extract_text_content(self, content) -> str:
-        """从消息内容中提取文本，支持多模态消息格式"""
+        """从消息内容中提取文本,支持多模态消息格式"""
         if isinstance(content, str):
             return content
         elif isinstance(content, list):
@@ -867,7 +910,7 @@ class Action:
         user_language: str = "zh-CN",
     ) -> str:
         """
-        将新内容合并到现有的 HTML 容器中，或者创建一个新的容器。
+        将新内容合并到现有的 HTML 容器中,或者创建一个新的容器。
         """
         if (
             "<!-- OPENWEBUI_PLUGIN_OUTPUT -->" in existing_html_code
@@ -900,14 +943,392 @@ class Action:
 
         return base_html.strip()
 
+    def _generate_image_js_code(
+        self,
+        unique_id: str,
+        chat_id: str,
+        message_id: str,
+        markdown_syntax: str,
+    ) -> str:
+        """生成用于前端 SVG 渲染和图片嵌入的 JavaScript 代码"""
+
+        # 转义语法以便嵌入 JS
+        syntax_escaped = (
+            markdown_syntax.replace("\\", "\\\\")
+            .replace("`", "\\`")
+            .replace("${", "\\${")
+            .replace("</script>", "<\\/script>")
+        )
+
+        return f"""
+(async function() {{
+    const uniqueId = "{unique_id}";
+    const chatId = "{chat_id}";
+    const messageId = "{message_id}";
+    const defaultWidth = 1200;
+    const defaultHeight = 800;
+    
+    // 主题检测 - 检查 OpenWebUI 当前主题
+    const detectTheme = () => {{
+        try {{
+            // 1. 检查 html/body 的 class 或 data-theme 属性
+            const html = document.documentElement;
+            const body = document.body;
+            const htmlClass = html ? html.className : '';
+            const bodyClass = body ? body.className : '';
+            const htmlDataTheme = html ? html.getAttribute('data-theme') : '';
+            
+            if (htmlDataTheme === 'dark' || bodyClass.includes('dark') || htmlClass.includes('dark')) {{
+                return 'dark';
+            }}
+            if (htmlDataTheme === 'light' || bodyClass.includes('light') || htmlClass.includes('light')) {{
+                return 'light';
+            }}
+            
+            // 2. 检查 meta theme-color
+            const metas = document.querySelectorAll('meta[name="theme-color"]');
+            if (metas.length > 0) {{
+                const color = metas[metas.length - 1].content.trim();
+                const m = color.match(/^#?([0-9a-f]{{6}})$/i);
+                if (m) {{
+                    const hex = m[1];
+                    const r = parseInt(hex.slice(0, 2), 16);
+                    const g = parseInt(hex.slice(2, 4), 16);
+                    const b = parseInt(hex.slice(4, 6), 16);
+                    const luma = (0.2126 * r + 0.7152 * g + 0.0722 * b) / 255;
+                    return luma < 0.5 ? 'dark' : 'light';
+                }}
+            }}
+            
+            // 3. 检查系统偏好
+            if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {{
+                return 'dark';
+            }}
+            
+            return 'light';
+        }} catch (e) {{
+            return 'light';
+        }}
+    }};
+    
+    const currentTheme = detectTheme();
+    console.log("[思维导图图片] 检测到主题:", currentTheme);
+    
+    // 基于主题的颜色配置
+    const colors = currentTheme === 'dark' ? {{
+        background: '#1f2937',
+        text: '#e5e7eb',
+        link: '#94a3b8',
+        nodeStroke: '#64748b'
+    }} : {{
+        background: '#ffffff',
+        text: '#1f2937',
+        link: '#546e7a',
+        nodeStroke: '#94a3b8'
+    }};
+    
+    // 自动检测聊天容器宽度以实现自适应
+    let svgWidth = defaultWidth;
+    let svgHeight = defaultHeight;
+    const chatContainer = document.getElementById('chat-container');
+    if (chatContainer) {{
+        const containerWidth = chatContainer.clientWidth;
+        if (containerWidth > 100) {{
+            // 使用容器宽度的90%(留出边距)
+            svgWidth = Math.floor(containerWidth * 0.9);
+            // 根据默认尺寸保持宽高比
+            svgHeight = Math.floor(svgWidth * (defaultHeight / defaultWidth));
+            console.log("[思维导图图片] 自动检测容器宽度:", containerWidth, "-> SVG:", svgWidth, "x", svgHeight);
+        }}
+    }}
+    
+    console.log("[思维导图图片] 开始渲染...");
+    console.log("[思维导图图片] chatId:", chatId, "messageId:", messageId);
+    
+    try {{
+        // 加载 D3
+        if (typeof d3 === 'undefined') {{
+            console.log("[思维导图图片] 正在加载 D3...");
+            await new Promise((resolve, reject) => {{
+                const script = document.createElement('script');
+                script.src = 'https://cdn.jsdelivr.net/npm/d3@7';
+                script.onload = resolve;
+                script.onerror = reject;
+                document.head.appendChild(script);
+            }});
+        }}
+        
+        // 加载 markmap-lib
+        if (!window.markmap || !window.markmap.Transformer) {{
+            console.log("[思维导图图片] 正在加载 markmap-lib...");
+            await new Promise((resolve, reject) => {{
+                const script = document.createElement('script');
+                script.src = 'https://cdn.jsdelivr.net/npm/markmap-lib@0.17';
+                script.onload = resolve;
+                script.onerror = reject;
+                document.head.appendChild(script);
+            }});
+        }}
+        
+        // 加载 markmap-view
+        if (!window.markmap || !window.markmap.Markmap) {{
+            console.log("[思维导图图片] 正在加载 markmap-view...");
+            await new Promise((resolve, reject) => {{
+                const script = document.createElement('script');
+                script.src = 'https://cdn.jsdelivr.net/npm/markmap-view@0.17';
+                script.onload = resolve;
+                script.onerror = reject;
+                document.head.appendChild(script);
+            }});
+        }}
+        
+        const {{ Transformer, Markmap }} = window.markmap;
+        
+        // 获取 markdown 语法
+        let syntaxContent = `{syntax_escaped}`;
+        console.log("[思维导图图片] 语法长度:", syntaxContent.length);
+        
+        // 创建离屏容器
+        const container = document.createElement('div');
+        container.id = 'mindmap-offscreen-' + uniqueId;
+        container.style.cssText = 'position:absolute;left:-9999px;top:-9999px;width:' + svgWidth + 'px;height:' + svgHeight + 'px;';
+        document.body.appendChild(container);
+        
+        // 创建 SVG 元素
+        const svgEl = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+        svgEl.setAttribute('width', svgWidth);
+        svgEl.setAttribute('height', svgHeight);
+        svgEl.style.width = svgWidth + 'px';
+        svgEl.style.height = svgHeight + 'px';
+        svgEl.style.backgroundColor = colors.background;
+        container.appendChild(svgEl);
+        
+        // 将 markdown 转换为树结构
+        const transformer = new Transformer();
+        const {{ root }} = transformer.transform(syntaxContent);
+        
+        // 创建 markmap 实例
+        const options = {{
+            autoFit: true,
+            initialExpandLevel: Infinity,
+            zoom: false,
+            pan: false
+        }};
+        
+        console.log("[思维导图图片] 正在渲染 markmap...");
+        const markmapInstance = Markmap.create(svgEl, options, root);
+        
+        // 等待渲染完成
+        await new Promise(resolve => setTimeout(resolve, 1500));
+        markmapInstance.fit();
+        await new Promise(resolve => setTimeout(resolve, 500));
+        
+        // 克隆并准备 SVG 导出
+        const clonedSvg = svgEl.cloneNode(true);
+        clonedSvg.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
+        clonedSvg.setAttribute('xmlns:xlink', 'http://www.w3.org/1999/xlink');
+        
+        // 添加背景矩形(使用主题颜色)
+        const bgRect = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
+        bgRect.setAttribute('width', '100%');
+        bgRect.setAttribute('height', '100%');
+        bgRect.setAttribute('fill', colors.background);
+        clonedSvg.insertBefore(bgRect, clonedSvg.firstChild);
+        
+        // 添加内联样式(使用主题颜色)
+        const style = document.createElementNS('http://www.w3.org/2000/svg', 'style');
+        style.textContent = `
+            text {{ font-family: sans-serif; font-size: 14px; fill: ${{colors.text}}; }}
+            foreignObject, .markmap-foreign, .markmap-foreign div {{ color: ${{colors.text}}; font-family: sans-serif; font-size: 14px; }}
+            h1 {{ font-size: 22px; font-weight: 700; margin: 0; }}
+            h2 {{ font-size: 18px; font-weight: 600; margin: 0; }}
+            strong {{ font-weight: 700; }}
+            .markmap-link {{ stroke: ${{colors.link}}; fill: none; }}
+            .markmap-node circle, .markmap-node rect {{ stroke: ${{colors.nodeStroke}}; }}
+        `;
+        clonedSvg.insertBefore(style, bgRect.nextSibling);
+        
+        // 将 foreignObject 转换为 text 以提高兼容性
+        const foreignObjects = clonedSvg.querySelectorAll('foreignObject');
+        foreignObjects.forEach(fo => {{
+            const text = fo.textContent || '';
+            const g = document.createElementNS('http://www.w3.org/2000/svg', 'g');
+            const textEl = document.createElementNS('http://www.w3.org/2000/svg', 'text');
+            textEl.setAttribute('x', fo.getAttribute('x') || '0');
+            textEl.setAttribute('y', (parseFloat(fo.getAttribute('y') || '0') + 14).toString());
+            textEl.setAttribute('fill', colors.text);
+            textEl.setAttribute('font-family', 'sans-serif');
+            textEl.setAttribute('font-size', '14');
+            textEl.textContent = text.trim();
+            g.appendChild(textEl);
+            fo.parentNode.replaceChild(g, fo);
+        }});
+        
+        // 序列化 SVG 为字符串
+        const svgData = new XMLSerializer().serializeToString(clonedSvg);
+        
+        // 清理容器
+        document.body.removeChild(container);
+        
+        // 将 SVG 字符串转换为 Blob
+        const blob = new Blob([svgData], {{ type: 'image/svg+xml' }});
+        const file = new File([blob], `mindmap-${{uniqueId}}.svg`, {{ type: 'image/svg+xml' }});
+        
+        // 上传文件到 OpenWebUI API
+        console.log("[思维导图图片] 正在上传 SVG 文件...");
+        const token = localStorage.getItem("token");
+        const formData = new FormData();
+        formData.append('file', file);
+        
+        const uploadResponse = await fetch('/api/v1/files/', {{
+            method: 'POST',
+            headers: {{
+                'Authorization': `Bearer ${{token}}`
+            }},
+            body: formData
+        }});
+        
+        if (!uploadResponse.ok) {{
+            throw new Error(`上传失败: ${{uploadResponse.statusText}}`);
+        }}
+        
+        const fileData = await uploadResponse.json();
+        const fileId = fileData.id;
+        const imageUrl = `/api/v1/files/${{fileId}}/content`;
+        
+        console.log("[思维导图图片] 文件已上传, ID:", fileId);
+        
+        // 生成包含文件 URL 的 markdown 图片
+        const markdownImage = `![🧠 思维导图](${{imageUrl}})`;
+        
+        // 通过 API 更新消息
+        if (chatId && messageId) {{
+            const token = localStorage.getItem("token");
+            
+            // 带重试逻辑的请求函数
+            const fetchWithRetry = async (url, options, retries = 3) => {{
+                for (let i = 0; i < retries; i++) {{
+                    try {{
+                        const response = await fetch(url, options);
+                        if (response.ok) return response;
+                        if (i < retries - 1) {{
+                            console.log(`[思维导图图片] 重试 ${{i + 1}}/${{retries}}: ${{url}}`);
+                            await new Promise(r => setTimeout(r, 1000 * (i + 1)));
+                        }}
+                    }} catch (e) {{
+                        if (i === retries - 1) throw e;
+                        await new Promise(r => setTimeout(r, 1000 * (i + 1)));
+                    }}
+                }}
+                return null;
+            }};
+            
+            // 获取当前聊天数据
+            const getResponse = await fetch(`/api/v1/chats/${{chatId}}`, {{
+                method: "GET",
+                headers: {{ "Authorization": `Bearer ${{token}}` }}
+            }});
+            
+            if (!getResponse.ok) {{
+                throw new Error("获取聊天数据失败: " + getResponse.status);
+            }}
+            
+            const chatData = await getResponse.json();
+            let updatedMessages = [];
+            let newContent = "";
+            
+            if (chatData.chat && chatData.chat.messages) {{
+                updatedMessages = chatData.chat.messages.map(m => {{
+                    if (m.id === messageId) {{
+                        const originalContent = m.content || "";
+                        // 移除已有的思维导图图片 (包括 base64 和文件 URL 格式)
+                        const mindmapPattern = /\\n*!\\[🧠[^\\]]*\\]\\((?:data:image\\/[^)]+|(?:\\/api\\/v1\\/files\\/[^)]+))\\)/g;
+                        let cleanedContent = originalContent.replace(mindmapPattern, "");
+                        cleanedContent = cleanedContent.replace(/\\n{{3,}}/g, "\\n\\n").trim();
+                        // 追加新图片
+                        newContent = cleanedContent + "\\n\\n" + markdownImage;
+                        
+                        // 关键: 同时更新 messages 数组和 history 对象中的内容
+                        // history 对象是数据库的单一真值来源
+                        if (chatData.chat.history && chatData.chat.history.messages) {{
+                            if (chatData.chat.history.messages[messageId]) {{
+                                chatData.chat.history.messages[messageId].content = newContent;
+                            }}
+                        }}
+                        
+                        return {{ ...m, content: newContent }};
+                    }}
+                    return m;
+                }});
+            }}
+            
+            if (!newContent) {{
+                console.warn("[思维导图图片] 找不到要更新的消息");
+                return;
+            }}
+            
+            // 尝试通过事件 API 更新前端显示(可选,部分版本可能不支持)
+            try {{
+                await fetch(`/api/v1/chats/${{chatId}}/messages/${{messageId}}/event`, {{
+                    method: "POST",
+                    headers: {{
+                        "Content-Type": "application/json",
+                        "Authorization": `Bearer ${{token}}`
+                    }},
+                    body: JSON.stringify({{
+                        type: "chat:message",
+                        data: {{ content: newContent }}
+                    }})
+                }});
+            }} catch (eventErr) {{
+                // 事件 API 是可选的,继续执行持久化
+                console.log("[思维导图图片] 事件 API 不可用,继续执行...");
+            }}
+            
+            // 通过更新整个聊天对象来持久化到数据库
+            // 遵循 OpenWebUI 后端控制的 API 流程
+            const updatePayload = {{
+                chat: {{
+                    ...chatData.chat,
+                    messages: updatedMessages
+                    // history 已在上面原地更新
+                }}
+            }};
+            
+            const persistResponse = await fetchWithRetry(`/api/v1/chats/${{chatId}}`, {{
+                method: "POST",
+                headers: {{
+                    "Content-Type": "application/json",
+                    "Authorization": `Bearer ${{token}}`
+                }},
+                body: JSON.stringify(updatePayload)
+            }});
+            
+            if (persistResponse && persistResponse.ok) {{
+                console.log("[思维导图图片] ✅ 消息已持久化保存!");
+            }} else {{
+                console.error("[思维导图图片] ❌ 重试后仍然无法持久化消息");
+            }}
+        }} else {{
+            console.warn("[思维导图图片] ⚠️ 缺少 chatId 或 messageId,无法持久化");
+        }}
+        
+    }} catch (error) {{
+        console.error("[思维导图图片] 错误:", error);
+    }}
+}})();
+"""
+
     async def action(
         self,
         body: dict,
         __user__: Optional[Dict[str, Any]] = None,
         __event_emitter__: Optional[Any] = None,
+        __event_call__: Optional[Callable[[Any], Awaitable[None]]] = None,
+        __metadata__: Optional[dict] = None,
         __request__: Optional[Request] = None,
     ) -> Optional[dict]:
-        logger.info("Action: 思维导图 (v12 - Final Feedback Fix) started")
+        logger.info("Action: 思维导图 (v0.9.1) started")
         user_ctx = self._get_user_context(__user__)
         user_language = user_ctx["user_language"]
         user_name = user_ctx["user_name"]
@@ -923,7 +1344,7 @@ class Action:
             current_year = now_dt.strftime("%Y")
             current_timezone_str = tz_env or "UTC"
         except Exception as e:
-            logger.warning(f"获取时区信息失败: {e}，使用默认值。")
+            logger.warning(f"获取时区信息失败: {e},使用默认值。")
             now = datetime.now()
             current_date_time_str = now.strftime("%Y年%m月%d日 %H:%M:%S")
             current_weekday_zh = "未知星期"
@@ -931,7 +1352,7 @@ class Action:
             current_timezone_str = "未知时区"
 
         await self._emit_notification(
-            __event_emitter__, "思维导图已启动，正在为您生成思维导图...", "info"
+            __event_emitter__, "思维导图已启动,正在为您生成思维导图...", "info"
         )
 
         messages = body.get("messages")
@@ -957,7 +1378,7 @@ class Action:
                     if role == "user"
                     else "助手" if role == "assistant" else role
                 )
-                aggregated_parts.append(f"[{role_label} 消息 {i}]\n{text_content}")
+                aggregated_parts.append(f"{text_content}")
 
         if not aggregated_parts:
             error_message = "无法获取有效的用户消息内容。"
@@ -980,7 +1401,7 @@ class Action:
             long_text_content = original_content.strip()
 
         if len(long_text_content) < self.valves.MIN_TEXT_LENGTH:
-            short_text_message = f"文本内容过短({len(long_text_content)}字符)，无法进行有效分析。请提供至少{self.valves.MIN_TEXT_LENGTH}字符的文本。"
+            short_text_message = f"文本内容过短({len(long_text_content)}字符),无法进行有效分析。请提供至少{self.valves.MIN_TEXT_LENGTH}字符的文本。"
             await self._emit_notification(
                 __event_emitter__, short_text_message, "warning"
             )
@@ -1021,7 +1442,7 @@ class Action:
             }
             user_obj = Users.get_user_by_id(user_id)
             if not user_obj:
-                raise ValueError(f"无法获取用户对象，用户ID: {user_id}")
+                raise ValueError(f"无法获取用户对象,用户ID: {user_id}")
 
             llm_response = await generate_chat_completion(
                 __request__, llm_payload, user_obj
@@ -1084,26 +1505,65 @@ class Action:
                         user_language,
                     )
 
+            # 检查输出模式
+            if self.valves.OUTPUT_MODE == "image":
+                # 图片模式: 使用 JavaScript 渲染并嵌入为 Markdown 图片
+                chat_id = self._extract_chat_id(body, __metadata__)
+                message_id = self._extract_message_id(body, __metadata__)
+
+                await self._emit_status(
+                    __event_emitter__,
+                    "思维导图: 正在渲染图片...",
+                    False,
+                )
+
+                if __event_call__:
+                    js_code = self._generate_image_js_code(
+                        unique_id=unique_id,
+                        chat_id=chat_id,
+                        message_id=message_id,
+                        markdown_syntax=markdown_syntax,
+                    )
+
+                    await __event_call__(
+                        {
+                            "type": "execute",
+                            "data": {"code": js_code},
+                        }
+                    )
+
+                await self._emit_status(
+                    __event_emitter__, "思维导图: 图片已生成!", True
+                )
+                await self._emit_notification(
+                    __event_emitter__,
+                    f"思维导图图片已生成,{user_name}!",
+                    "success",
+                )
+                logger.info("Action: 思维导图 (v0.9.1) 图片模式完成")
+                return body
+
+            # HTML 模式(默认): 嵌入为 HTML 块
             html_embed_tag = f"```html\n{final_html}\n```"
             body["messages"][-1]["content"] = f"{long_text_content}\n\n{html_embed_tag}"
 
-            await self._emit_status(__event_emitter__, "思维导图: 绘制完成！", True)
+            await self._emit_status(__event_emitter__, "思维导图: 绘制完成!", True)
             await self._emit_notification(
-                __event_emitter__, f"思维导图已生成，{user_name}！", "success"
+                __event_emitter__, f"思维导图已生成,{user_name}!", "success"
             )
-            logger.info("Action: 思维导图 (v12) completed successfully")
+            logger.info("Action: 思维导图 (v0.9.1) HTML 模式完成")
 
         except Exception as e:
             error_message = f"思维导图处理失败: {str(e)}"
             logger.error(f"思维导图错误: {error_message}", exc_info=True)
-            user_facing_error = f"抱歉，思维导图在处理时遇到错误: {str(e)}。\n请检查Open WebUI后端日志获取更多详情。"
+            user_facing_error = f"抱歉,思维导图在处理时遇到错误: {str(e)}。\n请检查Open WebUI后端日志获取更多详情。"
             body["messages"][-1][
                 "content"
             ] = f"{long_text_content}\n\n❌ **错误:** {user_facing_error}"
 
             await self._emit_status(__event_emitter__, "思维导图: 处理失败。", True)
             await self._emit_notification(
-                __event_emitter__, f"思维导图生成失败, {user_name}！", "error"
+                __event_emitter__, f"思维导图生成失败, {user_name}!", "error"
             )
 
         return body

plugins/actions/summary/README.md

@@ -22,3 +22,9 @@ GitHub: [Fu-Jie/awesome-openwebui](https://github.com/Fu-Jie/awesome-openwebui)
 ## License
 
 MIT License
+
+## Changelog
+
+### v0.1.2
+
+- Removed debug messages from output

plugins/actions/summary/README_CN.md

@@ -22,3 +22,9 @@ GitHub: [Fu-Jie/awesome-openwebui](https://github.com/Fu-Jie/awesome-openwebui)
 ## 许可证
 
 MIT License
+
+## 更新日志
+
+### v0.1.2
+
+- 移除输出中的调试信息

plugins/actions/summary/summary.py

@@ -3,7 +3,7 @@ title: Deep Reading & Summary
 author: Fu-Jie
 author_url: https://github.com/Fu-Jie
 funding_url: https://github.com/Fu-Jie/awesome-openwebui
-version: 0.1.1
+version: 0.1.2
 icon_url: data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0xNSAxMmgtNSIvPjxwYXRoIGQ9Ik0xNSA4aC01Ii8+PHBhdGggZD0iTTE5IDE3VjVhMiAyIDAgMCAwLTItMkg0Ii8+PHBhdGggZD0iTTggMjFoMTJhMiAyIDAgMCAwIDItMnYtMWExIDEgMCAwIDAtMS0xSDExYTEgMSAwIDAgMC0xIDF2MWEyIDIgMCAxIDEtNCAwVjVhMiAyIDAgMSAwLTQgMHYyYTEgMSAwIDAgMCAxIDFoMyIvPjwvc3ZnPg==
 description: Provides deep reading analysis and summarization for long texts.
 requirements: jinja2, markdown
@@ -529,9 +529,7 @@ class Action:
                         if role == "user"
                         else "Assistant" if role == "assistant" else role
                     )
-                    aggregated_parts.append(
-                        f"[{role_label} Message {i}]\n{text_content}"
-                    )
+                    aggregated_parts.append(f"{text_content}")
 
             if not aggregated_parts:
                 raise ValueError("Unable to get valid user message content.")

plugins/actions/summary/summary_cn.py

@@ -1,7 +1,7 @@
 """
 title: 精读 (Deep Reading)
 icon_url: data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9ImciIHgxPSIwIiB5MT0iMCIgeDI9IjEiIHkyPSIxIj48c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjNDI4NWY0Ii8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMWU4OGU1Ii8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHBhdGggZD0iTTYgMmg4bDYgNnYxMmEyIDIgMCAwIDEtMiAySDZhMiAyIDAgMCAxLTItMlY0YTIgMiAwIDAgMSAyLTJ6IiBmaWxsPSJ1cmwoI2cpIi8+PHBhdGggZD0iTTE0IDJsNiA2aC02eiIgZmlsbD0iIzFlODhlNSIgb3BhY2l0eT0iMC42Ii8+PGxpbmUgeDE9IjgiIHkxPSIxMyIgeDI9IjE2IiB5Mj0iMTMiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIxLjUiLz48bGluZSB4MT0iOCIgeTE9IjE3IiB4Mj0iMTQiIHkyPSIxNyIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjEuNSIvPjxjaXJjbGUgY3g9IjE2IiBjeT0iMTgiIHI9IjMiIGZpbGw9IiNmZmQ3MDAiLz48cGF0aCBkPSJNMTYgMTZsMS41IDEuNSIgc3Ryb2tlPSIjNDI4NWY0IiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPjwvc3ZnPg==
-version: 0.1.1
+version: 0.1.2
 description: 深度分析长篇文本，提炼详细摘要、关键信息点和可执行的行动建议，适合工作和学习场景。
 requirements: jinja2, markdown
 """
@@ -528,7 +528,7 @@ class Action:
                         if role == "user"
                         else "助手" if role == "assistant" else role
                     )
-                    aggregated_parts.append(f"[{role_label} 消息 {i}]\n{text_content}")
+                    aggregated_parts.append(f"{text_content}")
 
             if not aggregated_parts:
                 raise ValueError("无法获取有效的用户消息内容。")

plugins/filters/async-context-compression/async_context_compression.py

@@ -6,6 +6,7 @@ author_url: https://github.com/Fu-Jie
 funding_url: https://github.com/Fu-Jie/awesome-openwebui
 description: Reduces token consumption in long conversations while maintaining coherence through intelligent summarization and message compression.
 version: 1.1.0
+openwebui_id: b1655bc8-6de9-4cad-8cb5-a6f7829a02ce
 license: MIT
 
 ═══════════════════════════════════════════════════════════════════════════════

plugins/filters/async-context-compression/async_context_compression_cn.py

@@ -6,6 +6,7 @@ author_url: https://github.com/Fu-Jie
 funding_url: https://github.com/Fu-Jie/awesome-openwebui
 description: 通过智能摘要和消息压缩，降低长对话的 token 消耗，同时保持对话连贯性。
 version: 1.1.0
+openwebui_id: 5c0617cb-a9e4-4bd6-a440-d276534ebd18
 license: MIT
 
 ═══════════════════════════════════════════════════════════════════════════════

scripts/extract_plugin_versions.py

@@ -140,22 +140,49 @@ def compare_versions(current: list[dict], previous_file: str) -> dict[str, list[
         return {"added": current, "updated": [], "removed": []}
 
     # Create lookup dictionaries by title
-    current_by_title = {p["title"]: p for p in current}
-    previous_by_title = {p["title"]: p for p in previous}
+    # Helper to extract title/version from either simple dict or raw post object
+    def get_info(p):
+        if "data" in p and "function" in p["data"]:
+            # It's a raw post object
+            manifest = p["data"]["function"].get("meta", {}).get("manifest", {})
+            title = manifest.get("title") or p.get("title")
+            version = manifest.get("version", "0.0.0")
+            return title, version, p
+        else:
+            # It's a simple dict
+            return p.get("title"), p.get("version"), p
+
+    current_by_title = {}
+    for p in current:
+        title, _, _ = get_info(p)
+        if title:
+            current_by_title[title] = p
+
+    previous_by_title = {}
+    for p in previous:
+        title, _, _ = get_info(p)
+        if title:
+            previous_by_title[title] = p
 
     result = {"added": [], "updated": [], "removed": []}
 
     # Find added and updated plugins
     for title, plugin in current_by_title.items():
+        curr_title, curr_ver, _ = get_info(plugin)
+
         if title not in previous_by_title:
             result["added"].append(plugin)
-        elif plugin["version"] != previous_by_title[title]["version"]:
-            result["updated"].append(
-                {
-                    "current": plugin,
-                    "previous": previous_by_title[title],
-                }
-            )
+        else:
+            prev_plugin = previous_by_title[title]
+            _, prev_ver, _ = get_info(prev_plugin)
+
+            if curr_ver != prev_ver:
+                result["updated"].append(
+                    {
+                        "current": plugin,
+                        "previous": prev_plugin,
+                    }
+                )
 
     # Find removed plugins
     for title, plugin in previous_by_title.items():
@@ -212,9 +239,26 @@ def format_release_notes(
         for update in comparison["updated"]:
             curr = update["current"]
             prev = update["previous"]
-            lines.append(
-                f"- **{curr['title']}**: v{prev['version']} → v{curr['version']}"
+
+            # Extract info safely
+            curr_manifest = (
+                curr.get("data", {})
+                .get("function", {})
+                .get("meta", {})
+                .get("manifest", {})
             )
+            curr_title = curr_manifest.get("title") or curr.get("title")
+            curr_ver = curr_manifest.get("version") or curr.get("version")
+
+            prev_manifest = (
+                prev.get("data", {})
+                .get("function", {})
+                .get("meta", {})
+                .get("manifest", {})
+            )
+            prev_ver = prev_manifest.get("version") or prev.get("version")
+
+            lines.append(f"- **{curr_title}**: v{prev_ver} → v{curr_ver}")
         lines.append("")
 
     if comparison["removed"] and not ignore_removed:

scripts/fetch_remote_versions.py

@@ -0,0 +1,50 @@
+import json
+import os
+import sys
+
+# Add current directory to path
+sys.path.append(os.path.dirname(os.path.abspath(__file__)))
+
+try:
+    from openwebui_stats import OpenWebUIStats
+except ImportError:
+    print("Error: openwebui_stats.py not found.")
+    sys.exit(1)
+
+
+def main():
+    # Try to get token from env
+    token = os.environ.get("OPENWEBUI_API_KEY")
+    if not token:
+        print("Error: OPENWEBUI_API_KEY environment variable not set.")
+        sys.exit(1)
+
+    print("Fetching remote plugins from OpenWebUI...")
+    client = OpenWebUIStats(token)
+    try:
+        posts = client.get_all_posts()
+    except Exception as e:
+        print(f"Error fetching posts: {e}")
+        sys.exit(1)
+
+    formatted_plugins = []
+    for post in posts:
+        # Save the full raw post object to ensure we have "compliant update json data"
+        # We inject a 'type' field just for the comparison script to know it's remote,
+        # but otherwise keep the structure identical to the API response.
+        post["type"] = "remote_plugin"
+        formatted_plugins.append(post)
+
+    output_file = "remote_versions.json"
+    with open(output_file, "w", encoding="utf-8") as f:
+        json.dump(formatted_plugins, f, indent=2, ensure_ascii=False)
+
+    print(
+        f"✅ Successfully saved {len(formatted_plugins)} remote plugins to {output_file}"
+    )
+    print(f"   You can now compare local vs remote using:")
+    print(f"   python scripts/extract_plugin_versions.py --compare {output_file}")
+
+
+if __name__ == "__main__":
+    main()

scripts/openwebui_stats.py

@@ -0,0 +1,550 @@
+#!/usr/bin/env python3
+"""
+OpenWebUI 社区统计工具
+
+获取并统计你在 openwebui.com 上发布的插件/帖子数据。
+
+使用方法：
+    1. 设置环境变量：
+       - OPENWEBUI_API_KEY: 你的 API Key
+       - OPENWEBUI_USER_ID: 你的用户 ID
+    2. 运行: python scripts/openwebui_stats.py
+
+获取 API Key：
+    访问 https://openwebui.com/settings/api 创建 API Key (sk-开头)
+
+获取 User ID：
+    从个人主页的 API 请求中获取，格式如: b15d1348-4347-42b4-b815-e053342d6cb0
+"""
+
+import os
+import json
+import requests
+from datetime import datetime, timezone, timedelta
+from typing import Optional
+from pathlib import Path
+
+# 北京时区 (UTC+8)
+BEIJING_TZ = timezone(timedelta(hours=8))
+
+
+def get_beijing_time() -> datetime:
+    """获取当前北京时间"""
+    return datetime.now(BEIJING_TZ)
+
+
+# 尝试加载 .env 文件
+try:
+    from dotenv import load_dotenv
+
+    load_dotenv()
+except ImportError:
+    pass
+
+
+class OpenWebUIStats:
+    """OpenWebUI 社区统计工具"""
+
+    BASE_URL = "https://api.openwebui.com/api/v1"
+
+    def __init__(self, api_key: str, user_id: Optional[str] = None):
+        """
+        初始化统计工具
+
+        Args:
+            api_key: OpenWebUI API Key (JWT Token)
+            user_id: 用户 ID，如果为 None 则从 token 中解析
+        """
+        self.api_key = api_key
+        self.user_id = user_id or self._parse_user_id_from_token(api_key)
+        self.session = requests.Session()
+        self.session.headers.update(
+            {
+                "Authorization": f"Bearer {api_key}",
+                "Accept": "application/json",
+                "Content-Type": "application/json",
+            }
+        )
+
+    def _parse_user_id_from_token(self, token: str) -> str:
+        """从 JWT Token 中解析用户 ID"""
+        import base64
+
+        try:
+            # JWT 格式: header.payload.signature
+            payload = token.split(".")[1]
+            # 添加 padding
+            padding = 4 - len(payload) % 4
+            if padding != 4:
+                payload += "=" * padding
+            decoded = base64.urlsafe_b64decode(payload)
+            data = json.loads(decoded)
+            return data.get("id", "")
+        except Exception as e:
+            print(f"⚠️ 无法从 Token 解析用户 ID: {e}")
+            return ""
+
+    def get_user_posts(self, sort: str = "new", page: int = 1) -> list:
+        """
+        获取用户发布的帖子列表
+
+        Args:
+            sort: 排序方式 (new/top/hot)
+            page: 页码
+
+        Returns:
+            帖子列表
+        """
+        url = f"{self.BASE_URL}/posts/users/{self.user_id}"
+        params = {"sort": sort, "page": page}
+
+        response = self.session.get(url, params=params)
+        response.raise_for_status()
+        return response.json()
+
+    def get_all_posts(self, sort: str = "new") -> list:
+        """获取所有帖子（自动分页）"""
+        all_posts = []
+        page = 1
+
+        while True:
+            posts = self.get_user_posts(sort=sort, page=page)
+            if not posts:
+                break
+            all_posts.extend(posts)
+            page += 1
+
+        return all_posts
+
+    def generate_stats(self, posts: list) -> dict:
+        """生成统计数据"""
+        stats = {
+            "total_posts": len(posts),
+            "total_downloads": 0,
+            "total_views": 0,
+            "total_upvotes": 0,
+            "total_downvotes": 0,
+            "total_saves": 0,
+            "total_comments": 0,
+            "by_type": {},
+            "posts": [],
+            "user": {},  # 用户信息
+        }
+
+        # 从第一个帖子中提取用户信息
+        if posts and "user" in posts[0]:
+            user = posts[0]["user"]
+            stats["user"] = {
+                "username": user.get("username", ""),
+                "name": user.get("name", ""),
+                "profile_url": f"https://openwebui.com/u/{user.get('username', '')}",
+                "profile_image": user.get("profileImageUrl", ""),
+                "followers": user.get("followerCount", 0),
+                "following": user.get("followingCount", 0),
+                "total_points": user.get("totalPoints", 0),
+                "post_points": user.get("postPoints", 0),
+                "comment_points": user.get("commentPoints", 0),
+                "contributions": user.get("totalContributions", 0),
+            }
+
+        for post in posts:
+            # 累计统计
+            stats["total_downloads"] += post.get("downloads", 0)
+            stats["total_views"] += post.get("views", 0)
+            stats["total_upvotes"] += post.get("upvotes", 0)
+            stats["total_downvotes"] += post.get("downvotes", 0)
+            stats["total_saves"] += post.get("saveCount", 0)
+            stats["total_comments"] += post.get("commentCount", 0)
+
+            # 解析 data 字段 - 正确路径: data.function.meta
+            function_data = post.get("data", {}).get("function", {})
+            meta = function_data.get("meta", {})
+            manifest = meta.get("manifest", {})
+            post_type = meta.get("type", function_data.get("type", "unknown"))
+
+            if post_type not in stats["by_type"]:
+                stats["by_type"][post_type] = 0
+            stats["by_type"][post_type] += 1
+
+            # 单个帖子信息
+            created_at = datetime.fromtimestamp(post.get("createdAt", 0))
+            updated_at = datetime.fromtimestamp(post.get("updatedAt", 0))
+
+            stats["posts"].append(
+                {
+                    "title": post.get("title", ""),
+                    "slug": post.get("slug", ""),
+                    "type": post_type,
+                    "version": manifest.get("version", ""),
+                    "author": manifest.get("author", ""),
+                    "description": meta.get("description", ""),
+                    "downloads": post.get("downloads", 0),
+                    "views": post.get("views", 0),
+                    "upvotes": post.get("upvotes", 0),
+                    "saves": post.get("saveCount", 0),
+                    "comments": post.get("commentCount", 0),
+                    "created_at": created_at.strftime("%Y-%m-%d"),
+                    "updated_at": updated_at.strftime("%Y-%m-%d"),
+                    "url": f"https://openwebui.com/posts/{post.get('slug', '')}",
+                }
+            )
+
+        # 按下载量排序
+        stats["posts"].sort(key=lambda x: x["downloads"], reverse=True)
+
+        return stats
+
+    def print_stats(self, stats: dict):
+        """打印统计报告到终端"""
+        print("\n" + "=" * 60)
+        print("📊 OpenWebUI 社区统计报告")
+        print("=" * 60)
+        print(f"📅 生成时间 (北京): {get_beijing_time().strftime('%Y-%m-%d %H:%M')}")
+        print()
+
+        # 总览
+        print("📈 总览")
+        print("-" * 40)
+        print(f"  📝 发布数量: {stats['total_posts']}")
+        print(f"  ⬇️  总下载量: {stats['total_downloads']}")
+        print(f"  👁️  总浏览量: {stats['total_views']}")
+        print(f"  👍 总点赞数: {stats['total_upvotes']}")
+        print(f"  💾 总收藏数: {stats['total_saves']}")
+        print(f"  💬 总评论数: {stats['total_comments']}")
+        print()
+
+        # 按类型分类
+        print("📂 按类型分类")
+        print("-" * 40)
+        for post_type, count in stats["by_type"].items():
+            print(f"  • {post_type}: {count}")
+        print()
+
+        # 详细列表
+        print("📋 发布列表 (按下载量排序)")
+        print("-" * 60)
+
+        # 表头
+        print(f"{'排名':<4} {'标题':<30} {'下载':<8} {'浏览':<8} {'点赞':<6}")
+        print("-" * 60)
+
+        for i, post in enumerate(stats["posts"], 1):
+            title = (
+                post["title"][:28] + ".." if len(post["title"]) > 30 else post["title"]
+            )
+            print(
+                f"{i:<4} {title:<30} {post['downloads']:<8} {post['views']:<8} {post['upvotes']:<6}"
+            )
+
+        print("=" * 60)
+
+    def generate_markdown(self, stats: dict, lang: str = "zh") -> str:
+        """
+        生成 Markdown 格式报告
+
+        Args:
+            stats: 统计数据
+            lang: 语言 ("zh" 中文, "en" 英文)
+        """
+        # 中英文文本
+        texts = {
+            "zh": {
+                "title": "# 📊 OpenWebUI 社区统计报告",
+                "updated": f"> 📅 更新时间: {get_beijing_time().strftime('%Y-%m-%d %H:%M')}",
+                "overview_title": "## 📈 总览",
+                "overview_header": "| 指标 | 数值 |",
+                "posts": "📝 发布数量",
+                "downloads": "⬇️ 总下载量",
+                "views": "👁️ 总浏览量",
+                "upvotes": "👍 总点赞数",
+                "saves": "💾 总收藏数",
+                "comments": "💬 总评论数",
+                "type_title": "## 📂 按类型分类",
+                "list_title": "## 📋 发布列表",
+                "list_header": "| 排名 | 标题 | 类型 | 版本 | 下载 | 浏览 | 点赞 | 收藏 | 更新日期 |",
+            },
+            "en": {
+                "title": "# 📊 OpenWebUI Community Stats Report",
+                "updated": f"> 📅 Updated: {get_beijing_time().strftime('%Y-%m-%d %H:%M')}",
+                "overview_title": "## 📈 Overview",
+                "overview_header": "| Metric | Value |",
+                "posts": "📝 Total Posts",
+                "downloads": "⬇️ Total Downloads",
+                "views": "👁️ Total Views",
+                "upvotes": "👍 Total Upvotes",
+                "saves": "💾 Total Saves",
+                "comments": "💬 Total Comments",
+                "type_title": "## 📂 By Type",
+                "list_title": "## 📋 Posts List",
+                "list_header": "| Rank | Title | Type | Version | Downloads | Views | Upvotes | Saves | Updated |",
+            },
+        }
+
+        t = texts.get(lang, texts["en"])
+
+        md = []
+        md.append(t["title"])
+        md.append("")
+        md.append(t["updated"])
+        md.append("")
+
+        # 总览
+        md.append(t["overview_title"])
+        md.append("")
+        md.append(t["overview_header"])
+        md.append("|------|------|")
+        md.append(f"| {t['posts']} | {stats['total_posts']} |")
+        md.append(f"| {t['downloads']} | {stats['total_downloads']} |")
+        md.append(f"| {t['views']} | {stats['total_views']} |")
+        md.append(f"| {t['upvotes']} | {stats['total_upvotes']} |")
+        md.append(f"| {t['saves']} | {stats['total_saves']} |")
+        md.append(f"| {t['comments']} | {stats['total_comments']} |")
+        md.append("")
+
+        # 按类型分类
+        md.append(t["type_title"])
+        md.append("")
+        for post_type, count in stats["by_type"].items():
+            md.append(f"- **{post_type}**: {count}")
+        md.append("")
+
+        # 详细列表
+        md.append(t["list_title"])
+        md.append("")
+        md.append(t["list_header"])
+        md.append("|:---:|------|:---:|:---:|:---:|:---:|:---:|:---:|:---:|")
+
+        for i, post in enumerate(stats["posts"], 1):
+            title_link = f"[{post['title']}]({post['url']})"
+            md.append(
+                f"| {i} | {title_link} | {post['type']} | {post['version']} | "
+                f"{post['downloads']} | {post['views']} | {post['upvotes']} | "
+                f"{post['saves']} | {post['updated_at']} |"
+            )
+
+        md.append("")
+        return "\n".join(md)
+
+    def save_json(self, stats: dict, filepath: str):
+        """保存 JSON 格式数据"""
+        with open(filepath, "w", encoding="utf-8") as f:
+            json.dump(stats, f, ensure_ascii=False, indent=2)
+        print(f"✅ JSON 数据已保存到: {filepath}")
+
+    def generate_readme_stats(self, stats: dict, lang: str = "zh") -> str:
+        """
+        生成 README 统计徽章区域
+
+        Args:
+            stats: 统计数据
+            lang: 语言 ("zh" 中文, "en" 英文)
+        """
+        # 获取 Top 6 插件
+        top_plugins = stats["posts"][:6]
+
+        # 中英文文本
+        texts = {
+            "zh": {
+                "title": "## 📊 社区统计",
+                "updated": f"> 🕐 自动更新于 {get_beijing_time().strftime('%Y-%m-%d %H:%M')}",
+                "author_header": "| 👤 作者 | 👥 粉丝 | ⭐ 积分 | 🏆 贡献 |",
+                "header": "| 📝 发布 | ⬇️ 下载 | 👁️ 浏览 | 👍 点赞 | 💾 收藏 |",
+                "top6_title": "### 🔥 热门插件 Top 6",
+                "top6_header": "| 排名 | 插件 | 下载 | 浏览 |",
+                "full_stats": "*完整统计请查看 [社区统计报告](./docs/community-stats.zh.md)*",
+            },
+            "en": {
+                "title": "## 📊 Community Stats",
+                "updated": f"> 🕐 Auto-updated: {get_beijing_time().strftime('%Y-%m-%d %H:%M')}",
+                "author_header": "| 👤 Author | 👥 Followers | ⭐ Points | 🏆 Contributions |",
+                "header": "| 📝 Posts | ⬇️ Downloads | 👁️ Views | 👍 Upvotes | 💾 Saves |",
+                "top6_title": "### 🔥 Top 6 Popular Plugins",
+                "top6_header": "| Rank | Plugin | Downloads | Views |",
+                "full_stats": "*See full stats in [Community Stats Report](./docs/community-stats.md)*",
+            },
+        }
+
+        t = texts.get(lang, texts["en"])
+        user = stats.get("user", {})
+
+        lines = []
+        lines.append("<!-- STATS_START -->")
+        lines.append(t["title"])
+        lines.append("")
+        lines.append(t["updated"])
+        lines.append("")
+
+        # 作者信息表格
+        if user:
+            username = user.get("username", "")
+            profile_url = user.get("profile_url", "")
+            lines.append(t["author_header"])
+            lines.append("|:---:|:---:|:---:|:---:|")
+            lines.append(
+                f"| [{username}]({profile_url}) | **{user.get('followers', 0)}** | "
+                f"**{user.get('total_points', 0)}** | **{user.get('contributions', 0)}** |"
+            )
+            lines.append("")
+
+        # 统计徽章表格
+        lines.append(t["header"])
+        lines.append("|:---:|:---:|:---:|:---:|:---:|")
+        lines.append(
+            f"| **{stats['total_posts']}** | **{stats['total_downloads']}** | "
+            f"**{stats['total_views']}** | **{stats['total_upvotes']}** | **{stats['total_saves']}** |"
+        )
+        lines.append("")
+
+        # Top 6 热门插件
+        lines.append(t["top6_title"])
+        lines.append("")
+        lines.append(t["top6_header"])
+        lines.append("|:---:|------|:---:|:---:|")
+
+        medals = ["🥇", "🥈", "🥉", "4️⃣", "5️⃣", "6️⃣"]
+        for i, post in enumerate(top_plugins):
+            medal = medals[i] if i < len(medals) else str(i + 1)
+            lines.append(
+                f"| {medal} | [{post['title']}]({post['url']}) | {post['downloads']} | {post['views']} |"
+            )
+
+        lines.append("")
+        lines.append(t["full_stats"])
+        lines.append("<!-- STATS_END -->")
+
+        return "\n".join(lines)
+
+    def update_readme(self, stats: dict, readme_path: str, lang: str = "zh"):
+        """
+        更新 README 文件中的统计区域
+
+        Args:
+            stats: 统计数据
+            readme_path: README 文件路径
+            lang: 语言 ("zh" 中文, "en" 英文)
+        """
+        import re
+
+        # 读取现有内容
+        with open(readme_path, "r", encoding="utf-8") as f:
+            content = f.read()
+
+        # 生成新的统计区域
+        new_stats = self.generate_readme_stats(stats, lang)
+
+        # 检查是否已有统计区域
+        pattern = r"<!-- STATS_START -->.*?<!-- STATS_END -->"
+        if re.search(pattern, content, re.DOTALL):
+            # 替换现有区域
+            new_content = re.sub(pattern, new_stats, content, flags=re.DOTALL)
+        else:
+            # 在简介段落之后插入统计区域
+            # 查找模式：标题 -> 语言切换行 -> 简介段落 -> 插入位置
+            lines = content.split("\n")
+            insert_pos = 0
+            found_intro = False
+
+            for i, line in enumerate(lines):
+                # 跳过标题
+                if line.startswith("# "):
+                    continue
+                # 跳过空行
+                if line.strip() == "":
+                    continue
+                # 跳过语言切换行 (如 "English | [中文]" 或 "[English] | 中文")
+                if ("English" in line or "中文" in line) and "|" in line:
+                    continue
+                # 找到第一个非空、非标题、非语言切换的段落（简介）
+                if not found_intro:
+                    found_intro = True
+                    # 继续到这个段落结束
+                    continue
+                # 简介段落后的空行或下一个标题就是插入位置
+                if line.strip() == "" or line.startswith("#"):
+                    insert_pos = i
+                    break
+
+            # 如果没找到合适位置，就放在第3行（标题和语言切换后）
+            if insert_pos == 0:
+                insert_pos = 3
+
+            # 在适当位置插入
+            lines.insert(insert_pos, "")
+            lines.insert(insert_pos + 1, new_stats)
+            lines.insert(insert_pos + 2, "")
+            new_content = "\n".join(lines)
+
+        # 写回文件
+        with open(readme_path, "w", encoding="utf-8") as f:
+            f.write(new_content)
+
+        print(f"✅ README 已更新: {readme_path}")
+
+
+def main():
+    """主函数"""
+    # 获取配置
+    api_key = os.getenv("OPENWEBUI_API_KEY")
+    user_id = os.getenv("OPENWEBUI_USER_ID")
+
+    if not api_key:
+        print("❌ 错误: 未设置 OPENWEBUI_API_KEY 环境变量")
+        print("请设置环境变量：")
+        print("  export OPENWEBUI_API_KEY='your_api_key_here'")
+        return 1
+
+    if not user_id:
+        print("❌ 错误: 未设置 OPENWEBUI_USER_ID 环境变量")
+        print("请设置环境变量：")
+        print("  export OPENWEBUI_USER_ID='your_user_id_here'")
+        print("\n提示: 用户 ID 可以从之前的 curl 请求中获取")
+        print("     例如: b15d1348-4347-42b4-b815-e053342d6cb0")
+        return 1
+
+    # 初始化
+    stats_client = OpenWebUIStats(api_key, user_id)
+    print(f"🔍 用户 ID: {stats_client.user_id}")
+
+    # 获取所有帖子
+    print("📥 正在获取帖子数据...")
+    posts = stats_client.get_all_posts()
+    print(f"✅ 获取到 {len(posts)} 个帖子")
+
+    # 生成统计
+    stats = stats_client.generate_stats(posts)
+
+    # 打印到终端
+    stats_client.print_stats(stats)
+
+    # 保存 Markdown 报告 (中英文双版本)
+    script_dir = Path(__file__).parent.parent
+
+    # 中文报告
+    md_zh_path = script_dir / "docs" / "community-stats.zh.md"
+    md_zh_content = stats_client.generate_markdown(stats, lang="zh")
+    with open(md_zh_path, "w", encoding="utf-8") as f:
+        f.write(md_zh_content)
+    print(f"\n✅ 中文报告已保存到: {md_zh_path}")
+
+    # 英文报告
+    md_en_path = script_dir / "docs" / "community-stats.md"
+    md_en_content = stats_client.generate_markdown(stats, lang="en")
+    with open(md_en_path, "w", encoding="utf-8") as f:
+        f.write(md_en_content)
+    print(f"✅ 英文报告已保存到: {md_en_path}")
+
+    # 保存 JSON 数据
+    json_path = script_dir / "docs" / "community-stats.json"
+    stats_client.save_json(stats, str(json_path))
+
+    # 更新 README 文件
+    readme_path = script_dir / "README.md"
+    readme_cn_path = script_dir / "README_CN.md"
+    stats_client.update_readme(stats, str(readme_path), lang="en")
+    stats_client.update_readme(stats, str(readme_cn_path), lang="zh")
+
+    return 0
+
+
+if __name__ == "__main__":
+    exit(main())

scripts/publish_plugin.py

@@ -0,0 +1,262 @@
+import os
+import sys
+import json
+import requests
+import re
+
+
+def parse_frontmatter(content):
+    """Extracts metadata from the python file docstring."""
+    # Allow leading whitespace and handle potential shebangs
+    match = re.search(r'^\s*"""\n(.*?)\n"""', content, re.DOTALL)
+    if not match:
+        # Fallback for files starting with comments or shebangs
+        match = re.search(r'"""\n(.*?)\n"""', content, re.DOTALL)
+        if not match:
+            return {}
+
+    frontmatter = match.group(1)
+    meta = {}
+    for line in frontmatter.split("\n"):
+        if ":" in line:
+            key, value = line.split(":", 1)
+            meta[key.strip()] = value.strip()
+    return meta
+
+
+def sync_frontmatter(file_path, content, meta, post_data):
+    """Syncs remote metadata back to local file frontmatter."""
+    changed = False
+    new_meta = meta.copy()
+
+    # 1. Sync ID
+    if "openwebui_id" not in new_meta and "post_id" not in new_meta:
+        new_meta["openwebui_id"] = post_data.get("id")
+        changed = True
+
+    # 2. Sync Icon URL (often set in UI)
+    manifest = (
+        post_data.get("data", {})
+        .get("function", {})
+        .get("meta", {})
+        .get("manifest", {})
+    )
+    if "icon_url" not in new_meta and manifest.get("icon_url"):
+        new_meta["icon_url"] = manifest.get("icon_url")
+        changed = True
+
+    # 3. Sync other fields if missing locally
+    for field in ["author", "author_url", "funding_url"]:
+        if field not in new_meta and manifest.get(field):
+            new_meta[field] = manifest.get(field)
+            changed = True
+
+    if changed:
+        print(f"  Syncing metadata back to {os.path.basename(file_path)}...")
+        # Reconstruct frontmatter
+        # We need to replace the content inside the first """ ... """
+        # This is a bit fragile with regex but sufficient for standard files
+
+        def replacement(match):
+            lines = []
+            # Keep existing description or comments if we can't parse them easily?
+            # Actually, let's just reconstruct the key-values we know
+            # and try to preserve the description if it was at the end
+
+            # Simple approach: Rebuild the whole block based on new_meta
+            # This might lose comments inside the frontmatter, but standard format is simple keys
+
+            # Try to preserve order: title, author, ..., version, ..., description
+            ordered_keys = [
+                "title",
+                "author",
+                "author_url",
+                "funding_url",
+                "version",
+                "openwebui_id",
+                "icon_url",
+                "requirements",
+                "description",
+            ]
+
+            block = ['"""']
+
+            # Add known keys in order
+            for k in ordered_keys:
+                if k in new_meta:
+                    block.append(f"{k}: {new_meta[k]}")
+
+            # Add any other custom keys
+            for k, v in new_meta.items():
+                if k not in ordered_keys:
+                    block.append(f"{k}: {v}")
+
+            block.append('"""')
+            return "\n".join(block)
+
+        new_content = re.sub(
+            r'^"""\n(.*?)\n"""', replacement, content, count=1, flags=re.DOTALL
+        )
+
+        # If regex didn't match (e.g. leading whitespace), try with whitespace
+        if new_content == content:
+            new_content = re.sub(
+                r'^\s*"""\n(.*?)\n"""', replacement, content, count=1, flags=re.DOTALL
+            )
+
+        if new_content != content:
+            with open(file_path, "w", encoding="utf-8") as f:
+                f.write(new_content)
+            return new_content  # Return updated content
+
+    return content
+
+
+def update_plugin(file_path, post_id, token):
+    print(f"Processing {os.path.basename(file_path)} (ID: {post_id})...")
+
+    with open(file_path, "r", encoding="utf-8") as f:
+        content = f.read()
+
+    meta = parse_frontmatter(content)
+    if not meta:
+        print(f"  Skipping: No frontmatter found.")
+        return False
+
+    headers = {
+        "Authorization": f"Bearer {token}",
+        "Content-Type": "application/json",
+        "Accept": "application/json",
+    }
+
+    # 1. Fetch existing post
+    try:
+        response = requests.get(
+            f"https://api.openwebui.com/api/v1/posts/{post_id}", headers=headers
+        )
+        response.raise_for_status()
+        post_data = response.json()
+    except Exception as e:
+        print(f"  Error fetching post: {e}")
+        return False
+
+    # 1.5 Sync Metadata back to local file
+    try:
+        content = sync_frontmatter(file_path, content, meta, post_data)
+        # Re-parse meta in case it changed
+        meta = parse_frontmatter(content)
+    except Exception as e:
+        print(f"  Warning: Failed to sync local metadata: {e}")
+
+    # 2. Update ONLY Content and Manifest
+    try:
+        # Ensure structure exists before populating nested fields
+        if "data" not in post_data:
+            post_data["data"] = {}
+        if "function" not in post_data["data"]:
+            post_data["data"]["function"] = {}
+        if "meta" not in post_data["data"]["function"]:
+            post_data["data"]["function"]["meta"] = {}
+        if "manifest" not in post_data["data"]["function"]["meta"]:
+            post_data["data"]["function"]["meta"]["manifest"] = {}
+
+        # Update 1: The Source Code (Inner Content)
+        post_data["data"]["function"]["content"] = content
+
+        # Update 2: The Post Body/README (Outer Content)
+        # Try to find a matching README file
+        plugin_dir = os.path.dirname(file_path)
+        base_name = os.path.basename(file_path).lower()
+        readme_content = None
+
+        # Determine preferred README filename
+        readme_files = []
+        if base_name.endswith("_cn.py"):
+            readme_files = ["README_CN.md", "README.md"]
+        else:
+            readme_files = ["README.md", "README_CN.md"]
+
+        for readme_name in readme_files:
+            readme_path = os.path.join(plugin_dir, readme_name)
+            if os.path.exists(readme_path):
+                try:
+                    with open(readme_path, "r", encoding="utf-8") as f:
+                        readme_content = f.read()
+                    print(f"  Using README: {readme_name}")
+                    break
+                except Exception as e:
+                    print(f"  Error reading {readme_name}: {e}")
+
+        if readme_content:
+            post_data["content"] = readme_content
+        elif "description" in meta:
+            post_data["content"] = meta["description"]
+        else:
+            post_data["content"] = ""
+
+        # Update Manifest (Metadata)
+        post_data["data"]["function"]["meta"]["manifest"].update(meta)
+
+        # Sync top-level fields for consistency
+        if "title" in meta:
+            post_data["title"] = meta["title"]
+            post_data["data"]["function"]["name"] = meta["title"]
+        if "description" in meta:
+            post_data["data"]["function"]["meta"]["description"] = meta["description"]
+
+    except Exception as e:
+        print(f"  Error preparing update: {e}")
+        return False
+
+    # 3. Submit Update
+    try:
+        response = requests.post(
+            f"https://api.openwebui.com/api/v1/posts/{post_id}/update",
+            headers=headers,
+            json=post_data,
+        )
+        response.raise_for_status()
+        print(f"  ✅ Success!")
+        return True
+    except Exception as e:
+        print(f"  ❌ Failed: {e}")
+        return False
+
+
+def main():
+    token = os.environ.get("OPENWEBUI_API_KEY")
+    if not token:
+        print("Error: OPENWEBUI_API_KEY not set.")
+        sys.exit(1)
+
+    base_dir = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
+    plugins_dir = os.path.join(base_dir, "plugins")
+
+    count = 0
+    # Walk through plugins directory
+    for root, _, files in os.walk(plugins_dir):
+        for file in files:
+            if file.endswith(".py"):
+                file_path = os.path.join(root, file)
+
+                # Check for ID in file content without full parse first
+                with open(file_path, "r", encoding="utf-8") as f:
+                    content = f.read(
+                        2000
+                    )  # Read first 2000 chars is enough for frontmatter
+
+                # Simple regex to find ID
+                id_match = re.search(
+                    r"(?:openwebui_id|post_id):\s*([a-z0-9-]+)", content
+                )
+
+                if id_match:
+                    post_id = id_match.group(1).strip()
+                    update_plugin(file_path, post_id, token)
+                    count += 1
+
+    print(f"\nFinished. Updated {count} plugins.")
+
+
+if __name__ == "__main__":
+    main()

scripts/sync_plugin_ids.py

@@ -0,0 +1,132 @@
+import os
+import sys
+import re
+import difflib
+
+# Add current directory to path
+sys.path.append(os.path.dirname(os.path.abspath(__file__)))
+
+try:
+    from openwebui_stats import OpenWebUIStats
+    from extract_plugin_versions import scan_plugins_directory
+except ImportError:
+    print("Error: Helper scripts not found.")
+    sys.exit(1)
+
+
+def normalize(s):
+    if not s:
+        return ""
+    return re.sub(r"\s+", " ", s.lower().strip())
+
+
+def insert_id_into_file(file_path, post_id):
+    with open(file_path, "r", encoding="utf-8") as f:
+        lines = f.readlines()
+
+    new_lines = []
+    inserted = False
+    in_frontmatter = False
+
+    for line in lines:
+        # Check for start/end of frontmatter
+        if line.strip() == '"""':
+            if not in_frontmatter:
+                in_frontmatter = True
+            else:
+                # End of frontmatter
+                in_frontmatter = False
+
+        # Check if ID already exists
+        if in_frontmatter and (
+            line.strip().startswith("openwebui_id:")
+            or line.strip().startswith("post_id:")
+        ):
+            print(f"  ID already exists in {os.path.basename(file_path)}")
+            return False
+
+        new_lines.append(line)
+
+        # Insert after version
+        if in_frontmatter and not inserted and line.strip().startswith("version:"):
+            new_lines.append(f"openwebui_id: {post_id}\n")
+            inserted = True
+
+    if inserted:
+        with open(file_path, "w", encoding="utf-8") as f:
+            f.writelines(new_lines)
+        return True
+    return False
+
+
+def main():
+    token = os.environ.get("OPENWEBUI_API_KEY")
+    if not token:
+        print("Error: OPENWEBUI_API_KEY environment variable not set.")
+        sys.exit(1)
+
+    print("Fetching remote posts...")
+    client = OpenWebUIStats(token)
+    remote_posts = client.get_all_posts()
+    print(f"Fetched {len(remote_posts)} remote posts.")
+
+    plugins_dir = os.path.join(
+        os.path.dirname(os.path.dirname(os.path.abspath(__file__))), "plugins"
+    )
+    local_plugins = scan_plugins_directory(plugins_dir)
+    print(f"Found {len(local_plugins)} local plugins.")
+
+    matched_count = 0
+
+    for plugin in local_plugins:
+        local_title = plugin.get("title", "")
+        if not local_title:
+            continue
+
+        file_path = plugin.get("file_path")
+        best_match = None
+        highest_ratio = 0.0
+
+        # 1. Try Exact Match on Manifest Title (High Confidence)
+        for post in remote_posts:
+            manifest_title = (
+                post.get("data", {})
+                .get("function", {})
+                .get("meta", {})
+                .get("manifest", {})
+                .get("title")
+            )
+            if manifest_title and normalize(manifest_title) == normalize(local_title):
+                best_match = post
+                highest_ratio = 1.0
+                break
+
+        # 2. Try Fuzzy Match on Post Title if no exact match
+        if not best_match:
+            for post in remote_posts:
+                post_title = post.get("title", "")
+                ratio = difflib.SequenceMatcher(
+                    None, normalize(local_title), normalize(post_title)
+                ).ratio()
+                if ratio > 0.8 and ratio > highest_ratio:
+                    highest_ratio = ratio
+                    best_match = post
+
+        if best_match:
+            post_id = best_match.get("id")
+            post_title = best_match.get("title")
+            print(
+                f"Match found: '{local_title}' <--> '{post_title}' (ID: {post_id}) [Score: {highest_ratio:.2f}]"
+            )
+
+            if insert_id_into_file(file_path, post_id):
+                print(f"  -> Updated {os.path.basename(file_path)}")
+                matched_count += 1
+        else:
+            print(f"No match found for: '{local_title}'")
+
+    print(f"\nTotal updated: {matched_count}")
+
+
+if __name__ == "__main__":
+    main()