@opentiny/next-sdk 0.3.2 → 0.3.3-alpha.1

package/page-tools/initialize-builtin-WebMCP.ts

@@ -0,0 +1,20 @@
+import { initializeWebMCPPolyfill } from '@mcp-b/webmcp-polyfill'
+import { setupModelContextBridge } from './bridge'
+import { isBrowser } from '../utils/env'
+
+let initialized = false
+
+export const initializeBuiltinWebMCP = () => {
+  if (isBrowser()) {
+    try {
+      if (initialized) return
+
+      initializeWebMCPPolyfill()
+      setupModelContextBridge()
+
+      initialized = true
+    } catch (err) {
+      console.warn('[next-sdk] 自动注入 modelContext polyfill 和桥接同步失败:', err)
+    }
+  }
+}

package/page-tools/page-agent-prompt.md

@@ -0,0 +1,123 @@
+## 角色
+
+你是浏览器页面的操作工具，你拥有识别网页内容，点击，填写，选择下拉框和滚动页面等功能。
+
+在执行页面操作之前，你必须先调用`browserState`工具一次，根据最新的网页状态，再调用操作动作，比如 'click','fill','select' 等动作。
+
+<intro>
+你擅长以下任务：
+1. 导航复杂网站并提取精确信息
+2. 自动化表单提交和交互式网页操作
+3. 收集和保存信息
+4. 在代理循环中有效运行
+5. 高效执行多样化的网页任务
+</intro>
+
+<input>
+在每一步，你的输入将包括：
+1. <agent_history>：一个按时间顺序排列的事件流，包括你之前的操作及其结果。
+2. <agent_state>：当前的 <user_request> 和 <step_info>。
+3. <browser_state>：当前 URL、页面标题、可交互元素总数以及语义化 YAML 树。
+</input>
+
+<browser_state>
+
+浏览器状态包含以下内容：
+
+- url: 当前查看页面的 URL。
+- title: 当前查看页面的标题。
+- 可交互元素总数：带有 `[ref=N]` 标记的元素数量。
+- YAML 树：页面的语义化结构，格式如下：
+
+```yaml
+- region:
+  - main:
+    - button [cursor=pointer] [ref=9]: 产品文档
+    - button [selected] [cursor=pointer] [ref=47]: 40元/月 2核CPU 2GB内存
+    - radio [checked] [cursor=pointer] [ref=53]: 自动生成密码
+    - button [cursor=pointer] [ref=74]: 立即购买
+```
+
+节点格式说明：
+- `- role [state1] [state2] [ref=N]: accessible name`
+- `role`：ARIA 语义角色（如 button/link/radio/heading/list/listitem 等）
+- `[state]`：可选状态标记，如 `[checked]` `[selected]` `[disabled]` `[expanded]` `[cursor=pointer]`
+- `[ref=N]`：可交互元素的唯一操作索引，**只有带 ref 的节点才能被操作**
+- `accessible name`：元素的语义化名称（通过 aria-label/aria-labelledby/innerText 等计算得出）
+- 缩进表示父子关系
+
+</browser_state>
+
+<browser_state_diff>
+
+在交互过程中，为了提高效率和减少上下文占用，工具会生成页面的增量差异（Diff）信息。
+Diff 格式示例如下：
+```diff
+- button [ref=9]: 产品文档
++ button [ref=9]: 产品文档 (已点击)
+```
+或者，当页面结构发生改变时，会展示新增或移除的节点差异。
+
+### 页面状态获取四原则（重要，请严格遵守）：
+
+> 与业界 AI 编辑器（Cursor / Windsurf）按需读取文件而非全量加载的理念完全一致——**先精准搜索，再按需拉取全量**，将发送给大模型的 token 降至最低。
+
+1. **按关键词精准搜索（最高优先级）**：当你已知要找什么类型的元素（如按钮、输入框、特定名称的链接）时，**优先使用 `searchTree` 动作**，传入 role 名称、元素文本或状态关键词搜索。它只返回命中行和上下文，token 消耗比全量树减少 80%+ 。
+   - 示例：查找所有按钮 → `{"action": "searchTree", "query": "button"}`
+   - 示例：查找含"提交"文本的节点 → `{"action": "searchTree", "query": "提交"}`
+   - 示例：查找已勾选的复选框 → `{"action": "searchTree", "query": "checked"}`
+   - 示例：精确定位某个 ref → `{"action": "searchTree", "query": "#5"}`
+2. **首次获取全量**：首次进入页面、页面发生重大刷新、或 `searchTree` 无法找到所需信息时，调用 `browserState` 并指定 `responseMode` 为 `full` 或 `both` 获取完整 A11y 树。
+3. **增量优先**：执行 `click`、`fill`、`select`、`scroll` 操作后，工具默认自动返回 `diff` 增量信息。优先阅读这些 Diff，以便快速确认操作是否生效。
+4. **按需拉取全量**：如果增量 Diff 不足以支持下一步操作，或需要寻找不在 Diff 中的 `[ref=N]` 节点，且 `searchTree` 也无法定位时，再显式调用 `browserState` 拉取完整树。
+
+</browser_state_diff>
+
+
+
+<browser_rules>
+在使用浏览器和浏览网页时严格遵守以下规则：
+
+- 仅与分配有 `[ref=N]` 的元素进行交互。
+- 仅使用明确提供的 ref 索引。
+- 每次操作后 ref 索引会重新分配，不要使用旧的 ref 索引。
+- 如果页面在执行操作后发生变化（例如输入文本操作），分析是否需要与新元素进行交互，例如从列表中选择正确的选项。
+- 默认情况下，仅列出可见视口中的元素。如果你怀疑需要交互的相关内容在屏幕外，请使用滚动操作。仅在页面下方或上方还有更多像素时才滚动。
+- 你可以使用 num_pages 参数滚动特定页数（例如，0.5 表示半页，2.0 表示两页）。
+- 如果出现验证码，告诉用户你无法解决验证码。完成任务并请用户解决它。
+- 如果缺少预期元素，尝试滚动或导航回退。
+- 除非某些条件发生变化，否则不要重复同一操作超过 3 次。
+- 如果你向输入字段填充文本且操作序列被中断，通常意味着某些内容发生了变化，例如下拉建议弹出。
+- 如果 <user_request> 包含特定的页面信息，如产品类型、评分、价格、位置等，尝试应用过滤器以提高效率。
+- <user_request> 是最终目标。如果用户指定了明确的步骤，它们始终具有最高优先级。
+- 如果你向字段输入文本，可能需要按回车键、点击搜索按钮或从下拉列表中选择以完成操作。
+- 如果不需要，不要登录页面。如果没有凭据，不要登录。
+- 有两种类型的任务，首先思考你正在处理哪种类型的请求：
+
+1. 非常具体的逐步说明：
+
+- 非常精确地遵循它们，不要跳过步骤。尝试按要求完成所有内容。
+
+2. 开放式任务。自己规划，在实现目标时保持创造性。
+
+- 如果在开放式任务中陷入困境（例如登录或验证码），可以重新评估任务并尝试替代方法，例如有时即使页面的某些部分可访问或通过 Web 搜索获取一些信息，也会意外弹出登录框。
+  </browser_rules>
+
+<capability>
+- 你只能处理单页应用。不要跳出当前页面。
+- 如果链接将在新页面中打开（例如，<a target="_blank">），不要点击该链接。
+- 任务失败是可以接受的。
+	- 用户可能是错的。如果用户的请求无法实现、不适当，或者你没有足够的信息或工具来实现它。告诉用户提出更好的请求。
+	- 网页可能已损坏。所有网页或应用都有 bug。有些 bug 会使你的工作变得困难。鼓励你告诉用户当前页面的问题。你的反馈（包括失败）对用户很有价值。
+	- 过于努力可能有害。来回重复某些操作或在知识有限的情况下推动复杂程序可能导致不良结果和有害副作用。用户宁愿你以失败告终完成任务。
+- 如果你对当前网页或任务没有相关知识。你必须要求用户提供具体说明和详细步骤。
+</capability>
+
+<task_completion_rules>
+你必须在以下情况时结束任务：
+
+- 当你完全完成用户请求时。
+- 当你感到困惑或无法解决用户请求时。或者用户请求不清楚或包含不当内容。
+- 如果绝对不可能继续。
+
+</task_completion_rules>

package/page-tools/page-agent-tool.ts

@@ -0,0 +1,223 @@
+import { initializeBuiltinWebMCP } from './initialize-builtin-WebMCP'
+import { z } from 'zod'
+import { zodToJsonSchema } from 'zod-to-json-schema'
+import pageAgentPrompt from './page-agent-prompt.md?raw'
+import { PageController, clickElement, inputTextElement, selectOptionElement } from '@page-agent/page-controller'
+import { buildA11yTree, searchA11yTree, type RefMap } from './a11y-tree'
+import { PageStateCache } from './page-state-cache'
+
+declare global {
+  interface Window {
+    __webmcpcli_interactiveWhitelist?: Element[]
+    __webmcpcli_interactiveBlacklist?: Element[]
+    __webmcpcli_beforeGetBrowserState?: (() => void) | null
+  }
+}
+
+/** 在浏览器页面中注册 page-agent-tool, 用于页面的内容获取和操作，页面的动效 */
+export function registerPageAgentTool() {
+  initializeBuiltinWebMCP()
+
+  window.__webmcpcli_interactiveWhitelist = [] // 白名单元素列表，存在则识别为交互元素
+  window.__webmcpcli_interactiveBlacklist = [] // 黑名单，反之
+  window.__webmcpcli_beforeGetBrowserState = null // 指定网站覆盖该函数，用于设置当前网站的黑白名单
+
+  // 保留 PageController 仅用于 showMask/hideMask（UX 遮罩层）
+  const pageController = new PageController({ enableMask: true })
+
+  // ─── 状态 Diff 缓存
+  const stateCache = new PageStateCache()
+
+  // 当前 ref 索引 → HTMLElement 映射（每次 buildA11yTree 后更新）
+  let currentRefMap: RefMap = new Map()
+
+  // ─── inputSchema 与原版完全一致（对外 API 不变）──────────────────────────
+  const inputSchema = z.object({
+    action: z.enum(['browserState', 'click', 'fill', 'select', 'scroll', 'executeJavascript', 'searchTree'] as const)
+      .describe(`执行的动作名称, 每一次执行 'click', 'fill', 'select'动作之前，**必须**要先调用 'browserState' 去获取页面的最新状态。 
+        browserState: '查询整个页面的浏览器状态;返回页面的标题、URL、YAML格式的语义化页面树',
+        click: '根据元素索引点击;',
+        fill: '根据元素索引填写文本;'; 
+        select: '根据元素索引选择下拉框选项;'; 
+        scroll: '滚动页面的动作，可以指定水平滚动还是上下滚动; 不带元素索引时：滚动整个文档。带元素索引时：滚动该索引处的容器（或其最近的可滚动祖先元素）'
+        executeJavascript: '执行javascript代码'
+        searchTree: '按关键词搜索无障碍树，返回带行号的匹配节点及上下文，无需获取全量树。适合快速定位特定元素（如所有按钮、特定名称的链接等），显著减少上下文消耗。必须提供 query 参数。'
+    `),
+    index: z.number().min(0).optional().describe('执行动作 of the element index, 动作为 click,fill,select时，必须提供元素索引'),
+    text: z.string().optional().describe('执行动作的文本内容, 动作为 fill,select 时，必须提供文本内容'),
+    down: z.boolean().optional().describe('执行上下滚动时，必须提供down参数'),
+    right: z.boolean().optional().describe('执行水平滚动方向, 必须提供right参数'),
+    numPages: z
+      .number()
+      .optional()
+      .describe('执行动作的滚动页数, 动作为 scroll时，可以提供滚动页数，建议每次滚动0.1页，该值不要大于5.'),
+    pixels: z.number().int().min(0).optional().describe('执行动作的滚动像素数，动作为 scroll时，可以提供滚动像素数'),
+    script: z.string().optional().describe('执行的javascript代码，动作为 executeJavascript时，必须提供script参数'),
+    query: z.string().optional().describe('搜索关键词，动作为 searchTree 时必须提供。支持按 role（如 button、link）、节点名称、状态（如 checked）或 ref 索引（如 #3）搜索'),
+    contextLines: z.number().int().min(0).max(10).default(2).describe('searchTree 时每个命中行前后保留的上下文行数，默认 2'),
+    maxMatches: z.number().int().min(1).max(50).default(20).describe('searchTree 时最大返回分组数，默认 20'),
+    responseMode: z.enum(['full', 'diff', 'both'] as const)
+      .optional()
+      .default('diff')
+      .describe('返回浏览器状态的模式。full: 仅返回当前全量 A11y 树；diff: 仅返回与上一次状态的增量差异；both: 同时返回全量 A11y 树与增量差异。默认值为 diff。')
+  })
+
+  // ─── 辅助：构建错误响应 ───────────────────────────────────────────────────
+  async function errContent(msg: string) {
+    await pageController.hideMask()
+    return { content: [{ type: 'text', text: msg }] }
+  }
+
+  // ─── 核心：构建 browserState 响应（全量 or 增量 Diff）────────────────────
+  async function buildBrowserStateResponse(responseMode: 'full' | 'diff' | 'both' = 'diff'): Promise<{ content: Array<{ type: string; text: string }> }> {
+    const url = window.location.href
+    const title = document.title
+
+    // 获取用户自定义黑名单与白名单
+    const blacklist = (window.__webmcpcli_interactiveBlacklist ?? []) as Element[]
+    const whitelist = (window.__webmcpcli_interactiveWhitelist ?? []) as Element[]
+
+    // 生成语义化 ARIA YAML 树 + 刷新 refMap
+    const { yaml, refMap } = buildA11yTree(document.body, blacklist, whitelist)
+    currentRefMap = refMap
+
+    // 计算 Diff
+    const diff = stateCache.update(url, yaml)
+
+    await pageController.hideMask()
+
+    // 根据 responseMode 组装 content
+    let displayContent = ''
+    if (responseMode === 'full') {
+      displayContent = yaml
+    } else if (responseMode === 'diff') {
+      displayContent = diff.isFullRefresh ? yaml : diff.diffText
+    } else if (responseMode === 'both') {
+      displayContent = `【全量页面树】:\n${yaml}\n\n【增量差异】:\n${diff.isFullRefresh ? '（首次/刷新，无增量差异）' : diff.diffText}`
+    }
+
+    // 拼装 JSON 格式状态，与 webmcp-cli 的 state 提取逻辑对齐
+    const stateObj = {
+      url,
+      title,
+      content: displayContent
+    }
+    const text = `浏览器状态: ${JSON.stringify(stateObj)}`
+    return { content: [{ type: 'text', text }] }
+  }
+
+  // ─── 工具注册（名称与 inputSchema 与原版完全一致）────────────────────────
+  ;(document as any).modelContext.registerTool({
+    name: 'page-agent-tool',
+    description: pageAgentPrompt,
+    // @ts-ignore
+    inputSchema: zodToJsonSchema(inputSchema) as any,
+    async execute(args: any) {
+      await pageController.showMask()
+      const mode = args.responseMode ?? 'diff'
+      try {
+        // ── browserState：生成语义化 YAML + Diff ──────────────────────────
+        if (args.action === 'browserState') {
+          if (window.__webmcpcli_beforeGetBrowserState) {
+            window.__webmcpcli_beforeGetBrowserState()
+          }
+          return buildBrowserStateResponse(mode)
+
+        // ── click：用底层 clickElement(el) 操作，操作后自动返回 diff ───────
+        } else if (args.action === 'click') {
+          if (args.index === undefined) return errContent('点击结果: 缺少元素索引')
+          const el = currentRefMap.get(args.index)
+          if (!el) return errContent(`点击结果: 无效的 ref 索引 ${args.index}，请先调用 browserState 刷新页面状态`)
+          await clickElement(el)
+          // 操作成功后自动返回 diff/both/full
+          return buildBrowserStateResponse(mode)
+
+        // ── fill：输入文本，操作后自动返回 diff ───────────────────────────
+        } else if (args.action === 'fill') {
+          if (args.index === undefined || !args.text) return errContent('填写结果: 缺少元素索引或文本内容')
+          const el = currentRefMap.get(args.index)
+          if (!el) return errContent(`填写结果: 无效的 ref 索引 ${args.index}，请先调用 browserState 刷新页面状态`)
+          
+          let targetEl = el
+          if (!(targetEl instanceof HTMLInputElement) && !(targetEl instanceof HTMLTextAreaElement)) {
+            const innerInput = el.querySelector('input, textarea')
+            if (innerInput) {
+              targetEl = innerInput as HTMLElement
+            }
+          }
+
+          if (targetEl instanceof HTMLInputElement && targetEl.readOnly) {
+            targetEl.value = args.text
+            targetEl.dispatchEvent(new Event('input', { bubbles: true }))
+            targetEl.dispatchEvent(new Event('change', { bubbles: true }))
+            targetEl.dispatchEvent(new Event('blur', { bubbles: true }))
+          } else {
+            await inputTextElement(targetEl, args.text)
+          }
+          return buildBrowserStateResponse(mode)
+
+        // ── select：选择下拉框，操作后自动返回 diff ───────────────────────
+        } else if (args.action === 'select') {
+          if (args.index === undefined || !args.text) return errContent('选择结果: 缺少元素索引或文本内容')
+          const el = currentRefMap.get(args.index) as HTMLSelectElement
+          if (!el) return errContent(`选择结果: 无效的 ref 索引 ${args.index}，请先调用 browserState 刷新页面状态`)
+          await selectOptionElement(el, args.text)
+          return buildBrowserStateResponse(mode)
+
+        // ── scroll：滚动页面，操作后自动返回 diff ─────────────────────────
+        } else if (args.action === 'scroll') {
+          if (!args.down && !args.right) return errContent('滚动结果: 缺少滚动方向参数')
+
+          // 确定滚动目标（有 index 时滚动该元素容器，否则滚动整个文档）
+          const scrollTarget = args.index !== undefined
+            ? (currentRefMap.get(args.index) ?? window)
+            : window
+
+          if (args.right) {
+            const pixels = args.pixels ?? 300
+            scrollTarget.scrollBy({ left: args.right ? pixels : -pixels, behavior: 'smooth' })
+          } else {
+            const pixels = args.pixels ?? Math.round((args.numPages ?? 1) * window.innerHeight)
+            scrollTarget.scrollBy({ top: args.down ? pixels : -pixels, behavior: 'smooth' })
+          }
+
+          // 等待滚动动画完成后再采集状态
+          await new Promise(r => setTimeout(r, 400))
+          return buildBrowserStateResponse(mode)
+        // ── executeJavascript：执行任意 JS ────────────────────────────────
+        } else if (args.action === 'executeJavascript') {
+          if (!args.script) return errContent('脚本执行异常: 缺少javascript代码')
+          // eslint-disable-next-line no-new-func
+          const result = await new Function(`return (async () => { ${args.script} })()`)()
+          await pageController.hideMask()
+          return {
+            content: [{ type: 'text', text: `脚本执行结果: ${JSON.stringify(result)}` }]
+          }
+
+        // ── searchTree：关键词搜索无障碍树，返回带行号的精准结果 ──────────
+        } else if (args.action === 'searchTree') {
+          if (!args.query) return errContent('搜索失败: 缺少 query 参数')
+          const blacklist = (window.__webmcpcli_interactiveBlacklist ?? []) as Element[]
+          const whitelist = (window.__webmcpcli_interactiveWhitelist ?? []) as Element[]
+          const { text } = searchA11yTree(
+            args.query,
+            document.body,
+            blacklist,
+            whitelist,
+            {
+              contextLines: args.contextLines,
+              maxMatches: args.maxMatches,
+            },
+          )
+          await pageController.hideMask()
+          return {
+            content: [{ type: 'text', text }]
+          }
+        }
+      } catch (error) {
+        await pageController.hideMask()
+        return { content: [{ type: 'text', text: `异常: ${String(error)}` }] }
+      }
+    }
+  })
+}

package/page-tools/page-state-cache.ts

@@ -0,0 +1,78 @@
+/**
+ * page-state-cache.ts
+ *
+ * 页面状态 Diff 缓存模块
+ * - 缓存上一次 buildA11yTree 生成的 YAML 文本
+ * - 每次操作后计算 diff，只返回 +/- 变化行，大幅节省 Token
+ */
+
+import { diffLines } from 'diff'
+
+export interface PageSnapshot {
+  url: string
+  yaml: string
+}
+
+export interface DiffResult {
+  /** 是否为全量刷新（首次加载或 URL 变化） */
+  isFullRefresh: boolean
+  /** 上一次的 URL（用于拼接 URL 变化提示） */
+  prevUrl: string
+  /** 新增行数 */
+  addedLines: number
+  /** 删除行数 */
+  removedLines: number
+  /** 只含 +/- 行的 diff 文本（不含相同行，节省 Token） */
+  diffText: string
+}
+
+export class PageStateCache {
+  private prev: PageSnapshot | null = null
+
+  /** URL 变化或首次调用时，需要全量输出 */
+  isFullRefresh(currentUrl: string): boolean {
+    return !this.prev || this.prev.url !== currentUrl
+  }
+
+  /**
+   * 更新缓存并返回 diff 结果
+   * @param url 当前页面 URL
+   * @param yaml 当前 YAML 树文本
+   */
+  update(url: string, yaml: string): DiffResult {
+    const isFullRefresh = this.isFullRefresh(url)
+    const prevUrl = this.prev?.url ?? ''
+
+    let addedLines = 0
+    let removedLines = 0
+    let diffText = ''
+
+    if (!isFullRefresh && this.prev) {
+      const changes = diffLines(this.prev.yaml, yaml)
+      const buf: string[] = []
+      changes.forEach(part => {
+        // 跳过相同行，只保留变化行，大幅节省传给 AI 的 Token 数量
+        if (!part.added && !part.removed) return
+        const lines = part.value.split('\n').filter(Boolean)
+        if (part.added) {
+          addedLines += lines.length
+          lines.forEach(l => buf.push(`+ ${l}`))
+        } else {
+          removedLines += lines.length
+          lines.forEach(l => buf.push(`- ${l}`))
+        }
+      })
+      diffText = buf.join('\n')
+    }
+
+    // 更新缓存
+    this.prev = { url, yaml }
+
+    return { isFullRefresh, prevUrl, addedLines, removedLines, diffText }
+  }
+
+  /** 强制清空缓存（页面刷新 / 手动重置场景） */
+  invalidate(): void {
+    this.prev = null
+  }
+}

package/remoter/createRemoter.ts

@@ -5,10 +5,11 @@ import scan from './svgs/scan.svg?url'
 import link from './svgs/link.svg?url'
 import qrCode from './svgs/qrcode.svg?url'
 import iconCopy from './svgs/icon-copy.svg?url'
+import logo from './svgs/logo.svg?url'
 
 const DEFAULT_REMOTE_URL = 'https://chat.opentiny.design'
 const DEFAULT_QR_CODE_URL = 'https://ai.opentiny.design/next-remoter'
-const DEFAULT_LOGO_URL = 'https://ai.opentiny.design/next-remoter/svgs/logo-next-no-bg-left.svg'
+const DEFAULT_LOGO_URL = logo
 
 /** 菜单项配置接口 */
 export interface MenuItemConfig {

package/remoter/svgs/logo.svg

@@ -0,0 +1,45 @@
+<svg width="100.000000" height="100.000000" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+	<desc>
+			Created with Pixso.
+	</desc>
+	<defs>
+		<radialGradient gradientTransform="translate(67.5526 65.1155) rotate(51.0683) scale(22.991 20.6919)" cx="0.000000" cy="0.000000" r="1.000000" id="paint_radial_9_3036_0" gradientUnits="userSpaceOnUse">
+			<stop stop-color="#5ADDF8"/>
+			<stop stop-color="#AEBFFF"/>
+			<stop offset="0.329153" stop-color="#1476FF"/>
+			<stop offset="0.667785" stop-color="#655AF8"/>
+			<stop offset="0.868255" stop-color="#948CFF"/>
+			<stop offset="1.000000" stop-color="#D25AF8"/>
+			<stop offset="1.000000" stop-color="#5A8BF8"/>
+		</radialGradient>
+		<linearGradient x1="69.000122" y1="85.000198" x2="69.500107" y2="70.500183" id="paint_linear_9_3039_0" gradientUnits="userSpaceOnUse">
+			<stop stop-color="#000000" stop-opacity="0.000000"/>
+			<stop offset="1.000000" stop-color="#000000"/>
+		</linearGradient>
+		<radialGradient gradientTransform="translate(26.9999 24.7118) rotate(38.3655) scale(77.7996 109.496)" cx="0.000000" cy="0.000000" r="1.000000" id="paint_radial_9_3040_0" gradientUnits="userSpaceOnUse">
+			<stop stop-color="#5ADDF8"/>
+			<stop stop-color="#AEBFFF"/>
+			<stop offset="0.329153" stop-color="#1476FF"/>
+			<stop offset="0.667785" stop-color="#655AF8"/>
+			<stop offset="0.868255" stop-color="#948CFF"/>
+			<stop offset="1.000000" stop-color="#D25AF8"/>
+			<stop offset="1.000000" stop-color="#5A8BF8"/>
+		</radialGradient>
+	</defs>
+	<rect id="NEXT-LOGO-无背景渐变-左" width="100.000000" height="99.999939" fill="#FFFFFF" fill-opacity="0"/>
+	<mask id="mask9_3032" mask-type="alpha" maskUnits="userSpaceOnUse" x="0.000000" y="0.000061" width="99.999939" height="99.999939">
+		<rect id="画板 1773" y="0.000061" width="99.999962" height="99.999947" fill="#000000" fill-opacity="1.000000"/>
+	</mask>
+	<g mask="url(#mask9_3032)">
+		<path id="矢量 1" d="M64.07 81.01L64 63L82 63.07L67.51 82.23C66.39 83.71 64.07 82.9 64.07 81.01Z" fill="url(#paint_radial_9_3036_0)" fill-opacity="1.000000" fill-rule="evenodd"/>
+		<g opacity="0.100000" style="mix-blend-mode:normal">
+			<path id="矢量 1" d="M64.07 81.01L64 63L82 63.07L67.51 82.23C66.39 83.71 64.07 82.9 64.07 81.01Z" fill="url(#paint_linear_9_3039_0)" fill-opacity="1.000000" fill-rule="evenodd"/>
+		</g>
+		<rect id="矩形 5" x="12.000000" y="19.000153" rx="26.999992" width="75.999977" height="53.999985" fill="url(#paint_radial_9_3040_0)" fill-opacity="1.000000"/>
+		<rect id="矩形 5" x="12.500000" y="19.500153" rx="26.499992" width="74.999977" height="52.999985" fill="#000000" fill-opacity="0"/>
+		<rect id="矩形 5" x="12.500000" y="19.500153" rx="26.499992" width="74.999977" height="52.999985" stroke="#000000" stroke-opacity="0" stroke-width="1.000000"/>
+		<path id="path" d="M54.61 59.06C55.78 60.05 57.1 60.66 58.57 60.89C60.05 61.12 61.43 61.04 62.72 60.65C64 60.26 65.96 58.58 65.96 58.58C65.96 58.58 70.98 54.73 70.98 45.61C70.98 36.5 66.5 32.5 66.5 32.5C66.5 32.5 65.28 31.31 63.5 31C61.71 30.68 60.57 30.98 59.34 31.33C49.11 34.23 37.62 34.33 27.42 31.33C26.19 30.98 25.09 30.93 24.11 31.17C23.13 31.42 22.29 31.89 21.58 32.59C18.35 35.81 17.12 41.06 17 45.61C16.87 50.09 18.03 55.24 21.06 58.54C21.96 59.52 23.02 60.22 24.22 60.63C25.41 61.04 26.68 61.12 28.01 60.89C29.34 60.66 30.52 60.05 31.54 59.06C31.98 58.62 32.61 58.07 33.43 57.4C34.24 56.73 35.16 56.08 36.21 55.44C37.25 54.8 38.38 54.25 39.61 53.8C40.84 53.35 42.09 53.13 43.38 53.13C44.64 53.13 45.84 53.36 47 53.83C48.15 54.29 49.21 54.84 50.18 55.48C51.14 56.12 52 56.78 52.74 57.45C53.49 58.11 54.11 58.65 54.61 59.06Z" fill="#FFFFFF" fill-opacity="1.000000" fill-rule="nonzero"/>
+		<rect id="矩形 840" x="58.016602" y="38.000046" rx="2.000000" width="3.999999" height="11.999996" transform="rotate(1.39597 58.016602 38.000046)" fill="#1476FF" fill-opacity="1.000000"/>
+		<path id="合并" d="M28.97 38C28.17 37.97 27.38 38.42 27.01 39.19L23.2 47.11C22.71 48.13 23.15 49.34 24.18 49.81C25.22 50.28 26.45 49.83 26.94 48.8L28.97 44.59L30.99 48.81C31.48 49.83 32.72 50.28 33.75 49.81C34.79 49.34 35.23 48.13 34.74 47.11L30.93 39.19C30.56 38.42 29.78 37.98 28.97 38Z" fill="#1476FF" fill-opacity="1.000000" fill-rule="evenodd"/>
+	</g>
+</svg>

package/vite-env.d.ts

@@ -2,4 +2,9 @@
 declare module '*.svg?url' {
   const src: string;
   export default src;
+}
+
+declare module '*.md?raw' {
+  const content: string;
+  export default content;
 }