@deep-eye/core 0.2.1 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +69 -26
  2. package/package.json +5 -2
package/README.md CHANGED
@@ -1,32 +1,77 @@
1
1
  # @deep-eye/core
2
2
 
3
- 深瞳前端团队企业级 Vue 3 组件库 | Deep-Eye - Enterprise Vue 3 Component Library for DeepTong Team
3
+ 深瞳前端 Vue 3 组件库 思维导图与 AI 会话渲染。
4
4
 
5
- ## 💡 关于 About
5
+ ## 安装
6
6
 
7
- Deep-Eye 是为深瞳前端团队打造的企业级组件库,封装了团队内部常用且难以重新封装的组件。这是 King 为深瞳前端团队付出的一份努力,旨在提升团队开发效率,统一技术标准。
7
+ ```bash
8
+ pnpm add @deep-eye/core
9
+ # 或 npm install @deep-eye/core
10
+ ```
8
11
 
9
- Deep-Eye is an enterprise-grade component library built for the DeepTong frontend team, encapsulating commonly used and hard-to-reimplement components. This is King's contribution to the DeepTong frontend team, aiming to improve development efficiency and unify technical standards.
12
+ ```ts
13
+ import { D3MindMap, AiConversation, useConversation, ASK_USER_FORM_SYSTEM_PROMPT } from '@deep-eye/core'
14
+ import '@deep-eye/core/style.css'
15
+ ```
10
16
 
11
- ## 安装 Installation
17
+ > 注意:包名是 **`@deep-eye/core`**,不是旧的 `deepeye-core`。
12
18
 
13
- ```bash
14
- # npm
15
- npm install @deep-eye/core
19
+ ## 组件
16
20
 
17
- # pnpm
18
- pnpm add @deep-eye/core
21
+ | 组件 | 说明 |
22
+ | --- | --- |
23
+ | **D3MindMap** | D3 思维导图:缩放、拖拽、折叠、主题 |
24
+ | **AiConversation** | AI 会话渲染:流式文本、富媒体、工具调用、AskUserForm |
25
+
26
+ 输入框与 SSE 由宿主实现;库只负责消息渲染。
27
+
28
+ ## AiConversation 快速上手
29
+
30
+ ### 基础流式
31
+
32
+ ```ts
33
+ import { AiConversation, useConversation } from '@deep-eye/core'
34
+
35
+ const { messages, appendDelta } = useConversation()
36
+
37
+ appendDelta({ id: 'a1', role: 'assistant', contentDelta: chunk })
38
+ appendDelta({ id: 'a1', contentDelta: more })
39
+ appendDelta({ id: 'a1', done: true })
40
+ ```
19
41
 
20
- # yarn
21
- yarn add @deep-eye/core
42
+ ```vue
43
+ <AiConversation :messages="messages" auto-scroll="smart" />
44
+ ```
45
+
46
+ 富媒体标记:`[IMG:{...}]` / `[VIDEO:{...}]` / `[AUDIO:{...}]`
47
+
48
+ ### 交互组件(AskUserForm)
49
+
50
+ 将 `ASK_USER_FORM_SYSTEM_PROMPT` 拼入 LLM system,模型输出 `{% ask-form %}` 后,表单 dock 在对话区底部;监听 `@action` 回传。
51
+
52
+ ```ts
53
+ import { ASK_USER_FORM_SYSTEM_PROMPT } from '@deep-eye/core'
54
+
55
+ const system = ['你是助手……', ASK_USER_FORM_SYSTEM_PROMPT].join('\n\n')
22
56
  ```
23
57
 
24
- ## 使用 Usage
58
+ ```vue
59
+ <AiConversation
60
+ :messages="messages"
61
+ :user-avatar="userAvatarUrl"
62
+ :assistant-avatar="assistantAvatarUrl"
63
+ @action="onAction"
64
+ />
65
+ ```
66
+
67
+ - 不传 `userAvatar` / `assistantAvatar`(也无对应插槽)则不显示头像
68
+ - AskUserForm 暂不支持自定义位置(固定底部居中)
69
+
70
+ ## D3MindMap 快速上手
25
71
 
26
72
  ```vue
27
73
  <script setup>
28
74
  import { D3MindMap } from '@deep-eye/core'
29
- import '@deep-eye/core/style.css'
30
75
 
31
76
  const data = {
32
77
  nodeData: {
@@ -34,28 +79,26 @@ const data = {
34
79
  topic: 'Deep-Eye',
35
80
  root: true,
36
81
  children: [
37
- { id: '1', topic: '可视化组件' },
38
- { id: '2', topic: '布局组件' },
82
+ { id: '1', topic: '可视化' },
83
+ { id: '2', topic: 'AI 会话' },
39
84
  ],
40
85
  },
41
86
  }
42
87
  </script>
43
88
 
44
89
  <template>
45
- <D3MindMap :data="data" height="600px" />
90
+ <D3MindMap :data="data" height="600px" show-toolbar />
46
91
  </template>
47
92
  ```
48
93
 
49
- ## 组件 Components
94
+ ## 要求
50
95
 
51
- - **D3MindMap** - 基于 D3.js 的高性能思维导图组件,支持缩放、拖拽、展开折叠等交互功能
52
- - **AiConversation** - AI 对话渲染组件,支持流式文本、富媒体(`[IMG]` / `[VIDEO]` / `[AUDIO]`)、工具调用与 AskUserForm(`{% ask-form %}`);配合 `useConversation` 与 `ASK_USER_FORM_SYSTEM_PROMPT` 使用
96
+ | 依赖 | 版本 |
97
+ | --- | --- |
98
+ | Node.js | ≥ 22 |
99
+ | Vue | ≥ 3.5 |
100
+ | TypeScript | ≥ 5.9(开发) |
53
101
 
54
102
  ## License
55
103
 
56
- MIT
57
-
58
- ---
59
-
60
- **作者 Author:King**
61
- **团队 Team:深瞳前端团队 DeepTong Frontend Team**
104
+ MIT · Author: King · 深瞳前端团队
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@deep-eye/core",
3
- "version": "0.2.1",
3
+ "version": "0.3.0",
4
4
  "publishConfig": {
5
5
  "access": "public",
6
6
  "registry": "https://registry.npmjs.org/"
@@ -35,7 +35,10 @@
35
35
  "component-library",
36
36
  "ui",
37
37
  "mindmap",
38
- "visualization"
38
+ "visualization",
39
+ "ai",
40
+ "chat",
41
+ "conversation"
39
42
  ],
40
43
  "author": "King <xintao.king@example.com>",
41
44
  "license": "MIT",