📝 docs: add plugin docs

docs/api/request.md → docs/api/get-plugin-settings-from-request.md

@@ -1,8 +1,8 @@
 ---
 title: getPluginSettingsFromRequest
-description: 从请求中获取插件设置
+description: get plugin settings from request
 group:
-  title: 服务端
+  title: Server
   order: 1
 nav: API
 ---

docs/api/channel.md → docs/api/plugin-channel.md

@@ -1,5 +1,5 @@
 ---
-title: Message Communication Types
+title: PluginChannel
 order: 10
 group:
   title: Miscellaneous
@@ -8,7 +8,7 @@ atomId: PluginChannel
 description: Provides detailed explanations of message types for plugin communication
 nav:
   title: API
-  order: 1
+  order: 2
 ---
 
 # PluginChannel Communication Messages

docs/api/channel.zh-CN.md → docs/api/plugin-channel.zh-CN.md

@@ -1,5 +1,5 @@
 ---
-title: 消息通信类型
+title: PluginChannel 消息通信类型
 order: 10
 group:
   title: 杂项
@@ -8,7 +8,7 @@ atomId: PluginChannel
 description: 提供了关于插件通信的消息类型的详细说明
 nav:
   title: API
-  order: 1
+  order: 10
 apiHeader:
   pkg: '@lobehub/chat-plugin-sdk'
 ---

docs/api/error.md → docs/api/plugin-error-type.md

@@ -1,5 +1,5 @@
 ---
-title: Server Error Type
+title: Plugin Error Type
 atomId: PluginErrorType
 description: Plugin error types
 group: Server

docs/api/plugin-error-type.zh-CN.md

@@ -1,5 +1,5 @@
 ---
-title: 服务端错误类型 PluginErrorType
+title: PluginErrorType 服务端错误类型
 atomId: PluginErrorType
 description: 服务端错误类型
 group: 服务端

docs/api/plugin-meta-index.md → docs/api/plugin-meta-store.md

@@ -1,9 +1,8 @@
 ---
-title: 插件市场元数据 Schema
+title: pluginMetaSchema
 group: Schema
 atomId: pluginMetaSchema
-description: 上架到插件市场中的插件元数据的数据模式定义。
-nav: API
+description: Schema for plugin meta data
 ---
 
 Schema for plugin metadata.

docs/changelog.md

@@ -1,8 +1,8 @@
 ---
-title: 更新日志
+title: Changelog
 description: New updates and improvements to @lobehub/chat-plugin-sdk
 nav:
-  title: 更新日志
+  title: Changelog
   order: 999
 ---
 

docs/changelog.zh-CN.md

@@ -0,0 +1,9 @@
+---
+title: 更新日志
+description: New updates and improvements to @lobehub/chat-plugin-sdk
+nav:
+  title: 更新日志
+  order: 999
+---
+
+<embed src="../CHANGELOG.md"></embed>

docs/guides/client-sdk.zh-CN.md

@@ -4,4 +4,42 @@ group: 插件前端
 order: 2
 ---
 
-# 客户端 SDK
+# LobeChat 客户端 SDK
+
+LobeChat Client SDK 是一套提供给插件开发者的前端开发工具包，它允许插件与 LobeChat 应用进行高效、安全的通信。通过这个 SDK，开发者可以轻松地获取 LobeChat 传递给插件的数据、发送消息、更新插件状态以及管理插件的配置信息等。
+
+SDK 的核心功能是封装了与 LobeChat 交互所需的所有底层通信逻辑，这包括使用浏览器的 `postMessage` 和 `addEventListener` 方法进行跨窗口通信。这意味着开发者不需要深入了解复杂的通信协议，就可以专注于插件功能的实现。
+
+## 使用示例
+
+### 获取插件初始化信息
+
+当插件加载完成时，开发者可能需要获取 LobeChat 传递的初始化参数和配置。使用 LobeChat Client SDK，这可以通过以下几行代码轻松完成：
+
+```javascript
+import { lobeChat } from '@lobehub/chat-plugin-sdk/client';
+
+// 获取初始化信息
+lobeChat.getPluginPayload().then((payload) => {
+  console.log('插件名称:', payload.name);
+  console.log('插件参数:', payload.arguments);
+  console.log('插件设置:', payload.settings);
+});
+```
+
+### 更新插件消息内容
+
+如果插件需要在与用户的交互中发送消息，可以使用 SDK 提供的方法来更新消息内容：
+
+```javascript
+import { lobeChat } from '@lobehub/chat-plugin-sdk/client';
+
+// 发送消息内容
+lobeChat.setPluginMessage('欢迎使用我们的插件！');
+```
+
+LobeChat Client SDK 是插件开发者的得力助手，提供了一套完整、简洁且强大的工具，用以实现 LobeChat 插件的各种交互功能。通过这些工具，开发者可以更专注于创新和提升用户体验，而无需担心通信机制的实现细节。
+
+## API
+
+关于 LobeChat Client SDK 的完整使用 API，可以查阅：[LobeChat Client SDK API 文档](/zh-CN/api/lobe-chat-client)。

docs/guides/js-server.zh-CN.md

@@ -4,4 +4,78 @@ group: 插件服务端
 order: 6
 ---
 
-# OpenAPI
+# JavaScript 服务端
+
+在开发 LobeChat 插件时，您可能需要一个服务端来处理请求和发送响应。本文档将引导您使用 JavaScript 在服务端进行插件的开发，并推荐使用 Vercel 平台进行部署。
+
+## Vercel 作为服务端平台
+
+[Vercel](https://vercel.com/) 是一个云平台，它提供了简单的部署和托管服务，适合用于静态网站和服务端应用程序。对于 LobeChat 插件的开发，Vercel 的以下特性非常有用：
+
+- **简单的部署流程**：您可以通过几个简单的步骤将代码部署到云端。
+- **自定义域名支持**：Vercel 允许您将服务关联到自定义域名。
+- **自动扩展**：根据流量自动扩展资源，保证服务的可用性。
+
+## Edge Runtime 示例
+
+Edge Runtime 是 Vercel 提供的一个执行环境，它允许您的代码在全球各地的边缘网络上运行，从而减少延迟，提高响应速度。
+
+以下是一个使用 Edge Runtime 的插件服务端示例：
+
+```ts
+import { PluginErrorType, createErrorResponse } from '@lobehub/chat-plugin-sdk';
+
+import { manClothes, womanClothes } from '@/data';
+import { RequestData, ResponseData } from '@/type';
+
+export const config = {
+  runtime: 'edge',
+};
+
+export default async (req: Request) => {
+  if (req.method !== 'POST') {
+    return createErrorResponse(PluginErrorType.MethodNotAllowed);
+  }
+
+  const { gender, mood } = (await req.json()) as RequestData;
+
+  const clothes = gender === 'man' ? manClothes : womanClothes;
+
+  const result: ResponseData = {
+    clothes: mood ? clothes[mood] : Object.values(clothes).flat(),
+    mood,
+    today: Date.now(),
+  };
+
+  return new Response(JSON.stringify(result));
+};
+```
+
+在此示例中，服务端接收 POST 请求，并根据请求内容返回相应的服装推荐数据。
+
+## Node Runtime 示例
+
+如果您更熟悉 Node.js 环境，Vercel 也支持 Node Runtime。以下是一个 Node Runtime 的服务端示例：
+
+```ts
+import type { VercelRequest, VercelResponse } from '@vercel/node';
+
+import fetchContent from './_utils';
+
+export default async function handler(req: VercelRequest, res: VercelResponse) {
+  if (req.method !== 'POST') {
+    res.status(405).send('Method Not Allowed');
+    return;
+  }
+
+  const data = typeof req.body === 'string' ? JSON.parse(req.body) : req.body;
+
+  const result = await fetchContent(data);
+
+  res.status(200).send(result);
+}
+```
+
+在此示例中，服务端处理 POST 请求，并通过一个工具函数 `fetchContent` 来处理请求内容，然后返回处理结果。
+
+无论你选择 Edge Runtime 还是 Node Runtime，Vercel 都为 LobeChat 插件的服务端开发提供了便捷的部署和运行环境。您可以根据自己的需求和熟悉的技术栈选择合适的执行环境，并利用 Vercel 的优点来提升用户体验。

docs/guides/openapi-schema.zh-CN.md

@@ -4,4 +4,48 @@ group: 插件服务端
 order: 4
 ---
 
-# OpenAPI Schema
+# OpenAPI Schema 配置与使用
+
+LobeChat 的插件机制提供了一种强大而灵活的方式来扩展聊天功能，与此同时，支持 OpenAPI 规范使得插件开发变得更加标准化和简便。本文档旨在指导开发者如何在 LobeChat 服务端实现中配置和使用 OpenAPI schema，从而创建能与 LobeChat 无缝集成的插件。
+
+## OpenAPI 在 LobeChat 插件中的作用
+
+通过 OpenAPI schema，开发者可以定义插件的 API 接口，包括请求的路径、方法、参数、响应等。LobeChat 通过解析 OpenAPI 文档来理解如何与插件进行交互，这样用户就可以通过 LobeChat 的界面安装和使用插件，而不需要担心接口的具体实现细节。
+
+### 步骤 1：构建你的服务 API
+
+开发你的服务 API，并确保它能响应 LobeChat 的请求和返回适当的响应。可以使用任何你喜欢的语言和框架来构建这个 API。
+
+### 步骤 2：创建 OpenAPI 文档
+
+使用 OpenAPI 规范来描述你的服务，这包括定义 API 的路径、操作、参数、响应等。你可以选择 YAML 或 JSON 格式来编写你的 OpenAPI 文档。确保文档中包含了所有必要的细节，这样 LobeChat 才能正确地与你的服务交互。
+
+### 步骤 3：创建 LobeChat 插件清单文件
+
+创建 `manifest.json` 文件，该文件包含了插件的元数据和配置信息。最重要的是，在 `openapi` 字段中提供你的 OpenAPI 文档的 URL。
+
+插件清单 Schema 示例：
+
+```json5
+{
+  openapi: 'https://yourdomain.com/path/to/openapi.json',
+  api: [], // 配置 openapi 后便不需要再配置 api 字段
+
+  // ... 其他配置
+}
+```
+
+## OpenAPI 规范的关键要素
+
+当创建 OpenAPI 文档时，请确保包含以下内容：
+
+- **基本信息**：如标题、描述、版本等。
+- **服务器 URL**：API 服务器的 URL。
+- **端点**：可用的 API 路径和操作。
+- **参数**：每个操作的输入和输出参数。
+- **认证**：API 所使用的认证方法。
+- **响应**：通用的响应消息和错误代码。
+
+## 使用 OpenAPI 与 LobeChat 集成
+
+一旦你的 API 和 OpenAPI 文档准备就绪，你可以在 LobeChat UI 中安装和测试你的插件。用户将能够通过你在 OpenAPI 文档中定义的端点与你的服务交互。

docs/guides/plugin-fontend.zh-CN.md

@@ -6,4 +6,74 @@ group:
 order: 0
 ---
 
-# OpenAPI
+# LobeChat 插件前端开发概述
+
+LobeChat 插件前端开发允许开发者在 LobeChat 平台上构建和实现插件的用户界面 (UI) 和交互逻辑。本文档将提供一个高层次的概述，帮助开发者了解如何开发 LobeChat 插件的前端部分，并介绍与 LobeChat 平台进行交互所需的关键步骤。
+
+## 插件类型与前端需求
+
+在开始开发前，重要的是要理解不同插件类型对前端开发的需求：
+
+- **Markdown 插件**：不需要前端开发，因为它们直接返回 Markdown 格式的内容显示在聊天中。
+- **Default 插件**：前端 UI 是可选的，如有需要，可以构建简单的 UI 展示。
+- **Standalone 插件**：前端开发是必须的，因为它们需要提供丰富的交互体验。
+
+## 使用 Chat Plugin SDK
+
+LobeChat 提供了 Chat Plugin SDK，它是一套工具和组件，用于帮助开发者构建插件。对于需要前端的插件类型（如 `default` 和 `standalone`），你需要在项目中安装 SDK 并使用它来构建插件的前端部分。
+
+```fish
+pnpm i @lobehub/chat-plugin-sdk
+```
+
+或
+
+```fish
+bun i @lobehub/chat-plugin-sdk
+```
+
+## 开发前端 UI 和逻辑
+
+根据你的插件类型，你可能需要开发用户界面和交互逻辑。对于 `standalone` 插件，实现完整的应用逻辑和与 LobeChat 的通信机制至关重要。
+
+## 配置 manifest 文件
+
+为了与 LobeChat 平台集成，每个插件都需要有一个配置清单（`manifest.json`）。对于需要前端的插件，你需要在 `manifest.json` 中配置 `ui` 字段。以下是 `ui` 字段的基本配置：
+
+```json
+"ui": {
+  "height": 500,
+  "mode": "iframe",
+  "url": "http://example.com/iframe",
+  "width": 800
+}
+```
+
+`ui` 字段指定了插件 UI 的加载方式、尺寸和源地址。这里的 `mode` 通常设置为 `iframe`，意味着你的 UI 将作为一个内嵌的框架加载到 LobeChat 中。完整的 `manifest.json` 配置及其解释，请查看[插件描述清单文档](/zh-CN/api/plugin-manifest)。
+
+## UI 嵌入 iframe
+
+LobeChat 插件的 UI 本质上是嵌入了一个 iframe，这意味着插件支持所有类型的前端技术栈。无论你选择 React、Vue、Angular 或其他框架，都可以用来构建你的插件 UI。
+
+### React 技术栈支持
+
+LobeChat 提供了专门为 React 技术栈设计的模板和组件库 `@lobehub/ui`，以便开发者能够快速上手和构建插件 UI。
+
+```sh
+npm install @lobehub/ui
+```
+
+或
+
+```sh
+yarn add @lobehub/ui
+```
+
+## 关键考虑因素
+
+建议遵循以下步骤和考虑因素，以此构建一个为用户提供出色体验的扩展插件。
+
+- 了解不同插件类型的前端需求。
+- 使用 LobeChat 提供的 SDK 和组件库来简化前端开发。
+- 配置 `manifest.json` 中的 `ui` 字段以确保插件界面能正确加载。
+- 考虑用户交互的复杂度和插件的响应性。

docs/guides/plugin-server.zh-CN.md

@@ -5,4 +5,39 @@ group:
   order: 3
 ---
 
-# OpenAPI
+# LobeChat 插件服务端概述
+
+LobeChat 插件服务端是插件生态中的重要部分，它承载了与 LobeChat 主体进行交互的核心逻辑。服务端的主要职责包括处理请求、执行业务逻辑、鉴权验证以及与插件网关的通信。下面是对插件服务端应包含内容的高层次说明。
+
+## 关键组件与功能
+
+### 请求处理与业务逻辑
+
+- **请求接收**：能够接收来自 LobeChat 或插件网关的 HTTP 请求。
+- **逻辑执行**：执行具体的业务逻辑，如数据处理、外部服务调用等。
+- **响应返回**：根据业务逻辑的执行结果，返回结构化的响应数据。
+
+### 插件网关交互
+
+- **网关通信**：与插件网关进行有效的通信，确保请求的正确路由和响应的及时回传。
+- **本地与远程兼容**：支持本地开发环境和远程部署环境中的网关配置和交互。
+
+### 服务端部署与扩展
+
+- **云平台部署**：支持在云平台（如 Vercel）上部署，利用云服务的性能和扩展性。
+- **环境配置**：提供灵活的环境配置选项，以适应不同的部署需求。
+
+### 兼容性与跨语言支持
+
+- **多语言支持**：服务端不限于特定编程语言，支持 JavaScript、Python 等多种语言的实现。
+- **开发者工具**：提供 SDKs 和工具，以帮助开发者快速搭建和测试插件服务端。
+
+### OpenAPI Schema 集成（可选）
+
+- **接口定义**：使用 OpenAPI Schema 精确定义插件的 API 接口，包括路径、方法、参数和响应格式。
+- **文档化**：提供清晰的 API 文档，使得 LobeChat 可以自动识别并与插件服务端无缝集成。
+
+### 鉴权与安全（可选）
+
+- **认证机制**：实现安全的认证机制，确保只有授权的请求可以访问服务端资源。
+- **密钥管理**：提供密钥或令牌管理，允许用户通过安全的方式传递和验证鉴权信息。