@skillpet/chat-core

文档

• 在线 API 文档 — 前端组件完整接口参考（AI 可读版）
• 后端对接手册 — HTTP 接口、SSE 协议、消息存储（AI 可读版）
• llms.txt — AI 文档索引

框架无关的核心包，供 @skillpet/chat-react 和 @skillpet/chat-vue 内部依赖。也可单独使用于 Headless 场景（自定义 UI、Node.js 后端等）。

React / Vue 用户：直接安装 @skillpet/chat-react 或 @skillpet/chat-vue 即可，core 会作为依赖自动安装。

安装

npm install @skillpet/chat-core

导出一览

函数

| 名称 | 说明 | |------|------| | processSSEStream(options) | 发起 POST 请求并解析 SSE 流，通过回调更新消息状态 | | parseHistoryMessages(messages, uiStrings?) | 将后端历史消息还原为 ChatMessage[] | | setChatLanguage(lang) | 切换内置 i18n 语言（zh-CN / en / ja / ko / es / fr / zh-TW） | | cn(...inputs) | Tailwind class 合并工具（clsx + tailwind-merge） |

类型

| 名称 | 说明 | |------|------| | ChatMessage | 聊天消息 | | ChatPanelConfig | API 地址、鉴权等配置 | | ChatPanelProps | ChatPanel 组件完整 Props（含 readOnly?: boolean，v0.9+） | | ChatPanelEmptyState | 空状态自定义 | | ChatAttachment | 附件（id, name, type, url, previewUrl） | | InitCapabilities | 后端返回的能力配置 | | QueuedSendCap | 排队发送能力（enabled, maxQueueSize）（v0.6） | | QueuedMessage | 排队中的消息（id, content, attachments, createdAt）（v0.6） | | GeneratedImage | AI 生成单张图片元数据（v0.7） | | ImageGenerationAction | 图片生成交互动作（display / single_select / multi_select）（v0.7） | | ImageGenerationBlock | 消息中的图片生成内容块（v0.7） | | ReadOnlyMode | ChatPanelProps.readOnly?: boolean — 只读模式标志（v0.9） | | SlashCommand | 斜杠指令 | | AskUserQuestion | 结构化提问 | | SSECallbacks | SSE 回调集合 | | SSEStreamUiStrings | SSE 文案 | | ParseHistoryUiStrings | 历史解析文案 | | MessagePart / AgentToolStep / ToolInlineResult | 消息段落与工具结果 |

• 图片生成（v0.7） — 通过 SSE image_generating / image_generation 推送生成态与结果，上述类型用于消息块与交互配置。

CSS

import "@skillpet/chat-core/styles.css";

内置蓝色品牌色主题（支持亮/暗模式），通过 CSS 变量可完全自定义。

SSE 流处理

import { processSSEStream } from "@skillpet/chat-core";

await processSSEStream({
  url: "/api/chat/stream",
  body: { message: "Hello", projectId: "demo" },
  token: "bearer-token",
  callbacks: {
    updateMessages: (updater) => setMessages(updater),
    onFinally: () => console.log("done"),
  },
});

主题 CSS 变量

覆盖 .skillpet-chat 上的变量即可自定义配色：

.skillpet-chat {
  --skillpet-chat-primary: oklch(0.6 0.22 145);
}

完整变量列表见 根 README。

CDN 使用

<!-- unpkg -->
<script src="https://unpkg.com/@skillpet/chat-core/dist/index.umd.js"></script>
<link rel="stylesheet" href="https://unpkg.com/@skillpet/chat-core/dist/skillpet-chat.css" />

<!-- jsdelivr -->
<script src="https://cdn.jsdelivr.net/npm/@skillpet/chat-core/dist/index.umd.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@skillpet/chat-core/dist/skillpet-chat.css" />

<script>
  // 全局变量 SkillpetChatCore
  const { processSSEStream, setChatLanguage } = SkillpetChatCore;
</script>

License

MIT