@guoquan.net/flow-engine 0.1.9 → 0.2.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.
- package/README.md +107 -33
- package/dist/core/BehaviorController.d.ts +45 -0
- package/dist/core/BubbleManager.d.ts +19 -0
- package/dist/core/FlowEngine.d.ts +39 -0
- package/dist/core/LookAtProcessor.d.ts +8 -0
- package/dist/flow.es.js +3323 -337
- package/dist/flow.umd.js +39 -1
- package/dist/index.d.ts +3 -1
- package/dist/mcp/server.d.ts +55 -0
- package/dist/schemas/actions.d.ts +18 -0
- package/dist/types/index.d.ts +65 -9
- package/dist/ui.d.ts +1 -0
- package/package.json +12 -2
package/README.md
CHANGED
|
@@ -4,6 +4,8 @@
|
|
|
4
4
|
[](https://github.com/guoquan/flow-engine/actions/workflows/ci.yml)
|
|
5
5
|
[](https://codecov.io/gh/guoquan/flow-engine)
|
|
6
6
|
[](https://github.com/guoquan/flow-engine/actions/workflows/deploy.yml)
|
|
7
|
+
[](https://www.npmjs.com/package/@guoquan.net/flow-engine)
|
|
8
|
+
[](https://opensource.org/licenses/MIT)
|
|
7
9
|
|
|
8
10
|
[English](#english) | [中文](#中文)
|
|
9
11
|
|
|
@@ -13,36 +15,72 @@
|
|
|
13
15
|
|
|
14
16
|
> **"Flow: Convincing at first breath."**
|
|
15
17
|
|
|
16
|
-
**Flow**
|
|
18
|
+
**Flow** is a high-performance, lightweight web-based digital human engine based on WebGPU.
|
|
17
19
|
|
|
18
|
-
###
|
|
19
|
-
- **Modern Rendering**: Based on WebGPU for next-gen performance and visual quality.
|
|
20
|
-
- **Data-Driven**: Animation and behavior fully controlled via JSON configuration.
|
|
21
|
-
- **Zero-Dependency Core**: Pure frontend architecture, easy to integrate into any project.
|
|
20
|
+
### 📦 Installation
|
|
22
21
|
|
|
23
|
-
|
|
24
|
-
- **Core**: TypeScript
|
|
25
|
-
- **Rendering**: Three.js (WebGPU Renderer)
|
|
26
|
-
- **Build**: Vite
|
|
22
|
+
This package is distributed under two different scopes depending on the registry:
|
|
27
23
|
|
|
28
|
-
|
|
24
|
+
#### Stable Versions (Recommended)
|
|
29
25
|
|
|
30
|
-
|
|
26
|
+
**From NPM Registry:**
|
|
27
|
+
```bash
|
|
28
|
+
npm install @guoquan.net/flow-engine
|
|
29
|
+
```
|
|
31
30
|
|
|
31
|
+
**From GitHub Packages Registry:**
|
|
32
|
+
Add a `.npmrc` file to your project:
|
|
33
|
+
```ini
|
|
34
|
+
@guoquan:registry=https://npm.pkg.github.com
|
|
35
|
+
```
|
|
36
|
+
Then install:
|
|
32
37
|
```bash
|
|
33
|
-
|
|
38
|
+
npm install @guoquan/flow-engine
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
> **Note**: The naming difference (`@guoquan.net` on NPM vs `@guoquan` on GitHub) is due to account scope requirements on each platform.
|
|
42
|
+
|
|
43
|
+
#### Development / Latest Version
|
|
44
|
+
|
|
45
|
+
Install directly from the GitHub repository. You can specify a branch, tag, or commit hash using the `#` prefix:
|
|
46
|
+
|
|
47
|
+
```bash
|
|
48
|
+
# Latest from main branch
|
|
34
49
|
npm install github:guoquan/flow-engine
|
|
35
50
|
|
|
36
|
-
#
|
|
37
|
-
|
|
51
|
+
# Specific branch
|
|
52
|
+
npm install github:guoquan/flow-engine#develop
|
|
53
|
+
|
|
54
|
+
# Specific tag
|
|
55
|
+
npm install github:guoquan/flow-engine#v0.1.9
|
|
56
|
+
|
|
57
|
+
# Specific commit hash
|
|
58
|
+
npm install github:guoquan/flow-engine#7834b6c
|
|
38
59
|
```
|
|
39
60
|
|
|
40
|
-
|
|
61
|
+
### 🌟 Highlights
|
|
62
|
+
- **Modern Rendering**: Based on WebGPU for next-gen performance and visual quality.
|
|
63
|
+
- **Data-Driven**: Animation and behavior fully controlled via JSON configuration.
|
|
64
|
+
- **Zero-Dependency Core**: Pure frontend architecture, easy to integrate into any project.
|
|
65
|
+
|
|
66
|
+
### 🏗️ Architecture
|
|
67
|
+
Flow Engine adopts a **Controller-Agent** pattern:
|
|
68
|
+
* **FlowEngine**: The core scene manager and renderer (WebGPU).
|
|
69
|
+
* **BehaviorController (Brain)**: A finite state machine managing high-level states (`IDLE`, `TALKING`, `THINKING`).
|
|
70
|
+
* **LookAtProcessor (Reflex)**: Procedural animation system for eye contact and head tracking.
|
|
71
|
+
* **MCP Server (Bridge)**: A Node.js server enabling external AI agents to drive the avatar.
|
|
72
|
+
|
|
73
|
+
### 🤖 AI Agent Integration (MCP)
|
|
74
|
+
Flow Engine includes a built-in **Model Context Protocol (MCP)** server. This allows AI models (like Claude or Gemini) to "see" and "control" the avatar as a tool.
|
|
41
75
|
|
|
42
76
|
```bash
|
|
43
|
-
|
|
77
|
+
# Start the MCP Server
|
|
78
|
+
npm run mcp
|
|
44
79
|
```
|
|
45
80
|
|
|
81
|
+
* 👉 **[Read the MCP Integration Guide](./docs/MCP_GUIDE.md)**
|
|
82
|
+
* 👉 **[API Reference](./docs/API_REFERENCE.md)**
|
|
83
|
+
|
|
46
84
|
### 📚 Documentation
|
|
47
85
|
Please visit **[docs/](./docs/)** for the full documentation and API references.
|
|
48
86
|
|
|
@@ -52,35 +90,71 @@ Please visit **[docs/](./docs/)** for the full documentation and API references.
|
|
|
52
90
|
|
|
53
91
|
> **"一开口,就服喽。"**
|
|
54
92
|
|
|
55
|
-
**Flow**
|
|
93
|
+
**Flow** 是一个高性能、轻量级的基于 WebGPU 的 Web 端数字人引擎。
|
|
56
94
|
|
|
57
|
-
###
|
|
58
|
-
- **现代化渲染**:基于 WebGPU,提供下一代渲染性能与视觉效果。
|
|
59
|
-
- **数据驱动**:动画与行为完全通过 JSON 配置文件控制。
|
|
60
|
-
- **零依赖核心**:纯前端架构,无需后端即可运行,易于集成。
|
|
95
|
+
### 📦 安装指南
|
|
61
96
|
|
|
62
|
-
|
|
63
|
-
- **核心**: TypeScript
|
|
64
|
-
- **渲染**: Three.js (WebGPU Renderer)
|
|
65
|
-
- **构建**: Vite
|
|
97
|
+
由于注册表平台限制,本项目在不同平台使用不同的包名作用域:
|
|
66
98
|
|
|
67
|
-
|
|
99
|
+
#### 稳定版本 (推荐)
|
|
68
100
|
|
|
69
|
-
|
|
101
|
+
**从 NPM 安装:**
|
|
102
|
+
```bash
|
|
103
|
+
npm install @guoquan.net/flow-engine
|
|
104
|
+
```
|
|
70
105
|
|
|
106
|
+
**从 GitHub Packages 安装:**
|
|
107
|
+
在项目根目录创建 `.npmrc` 文件:
|
|
108
|
+
```ini
|
|
109
|
+
@guoquan:registry=https://npm.pkg.github.com
|
|
110
|
+
```
|
|
111
|
+
然后安装:
|
|
71
112
|
```bash
|
|
72
|
-
|
|
113
|
+
npm install @guoquan/flow-engine
|
|
114
|
+
```
|
|
115
|
+
|
|
116
|
+
> **注意**: 命名差异(NPM 上为 `@guoquan.net`,GitHub 上为 `@guoquan`)是因为各平台对用户作用域(Scope)的要求不同。
|
|
117
|
+
|
|
118
|
+
#### 开发版 / 最新版本
|
|
119
|
+
|
|
120
|
+
直接从 GitHub 仓库安装。你可以使用 `#` 前缀指定分支、标签或提交哈希:
|
|
121
|
+
|
|
122
|
+
```bash
|
|
123
|
+
# 安装 main 分支最新代码
|
|
73
124
|
npm install github:guoquan/flow-engine
|
|
74
125
|
|
|
75
|
-
#
|
|
76
|
-
|
|
126
|
+
# 指定分支
|
|
127
|
+
npm install github:guoquan/flow-engine#develop
|
|
128
|
+
|
|
129
|
+
# 指定标签
|
|
130
|
+
npm install github:guoquan/flow-engine#v0.1.9
|
|
131
|
+
|
|
132
|
+
# 指定提交哈希
|
|
133
|
+
npm install github:guoquan/flow-engine#7834b6c
|
|
77
134
|
```
|
|
78
135
|
|
|
79
|
-
|
|
136
|
+
### 🌟 项目亮点
|
|
137
|
+
- **现代化渲染**:基于 WebGPU,提供下一代渲染性能与视觉效果。
|
|
138
|
+
- **数据驱动**:动画与行为完全通过 JSON 配置文件控制。
|
|
139
|
+
- **零依赖核心**:纯前端架构,无需后端即可运行,易于集成。
|
|
140
|
+
|
|
141
|
+
### 🏗️ 架构设计
|
|
142
|
+
Flow Engine 采用 **Controller-Agent** 模式:
|
|
143
|
+
* **FlowEngine**: 核心场景管理器与渲染器 (WebGPU)。
|
|
144
|
+
* **BehaviorController (大脑)**: 有限状态机,管理高级行为状态 (`IDLE`, `TALKING`, `THINKING`)。
|
|
145
|
+
* **LookAtProcessor (反射)**: 程序化动画系统,负责眼神接触与头部追踪。
|
|
146
|
+
* **MCP Server (桥梁)**: 一个 Node.js 服务,允许外部 AI Agent 驱动数字人。
|
|
147
|
+
|
|
148
|
+
### 🤖 AI Agent 集成 (MCP)
|
|
149
|
+
Flow Engine 内置了 **Model Context Protocol (MCP)** 服务器。这使得 AI 模型(如 Claude 或 Gemini)能够将数字人视为一个“工具”并进行控制。
|
|
80
150
|
|
|
81
151
|
```bash
|
|
82
|
-
|
|
152
|
+
# 启动 MCP 服务器
|
|
153
|
+
npm run mcp
|
|
83
154
|
```
|
|
84
155
|
|
|
156
|
+
* 👉 **[阅读 MCP 集成指南](./docs/MCP_GUIDE.md)**
|
|
157
|
+
* 👉 **[API 参考文档](./docs/API_REFERENCE.md)**
|
|
158
|
+
|
|
85
159
|
### 📚 文档索引
|
|
86
|
-
请访问 **[docs/](./docs/)** 查看完整文档与 API 说明。
|
|
160
|
+
请访问 **[docs/](./docs/)** 查看完整文档与 API 说明。
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { AvatarBehaviorState, BehaviorIntent } from '../types';
|
|
2
|
+
/**
|
|
3
|
+
* BehaviorController (The Global Brain)
|
|
4
|
+
* Manages the high-level behavioral state machine of the avatar.
|
|
5
|
+
*/
|
|
6
|
+
export declare class BehaviorController {
|
|
7
|
+
private currentState;
|
|
8
|
+
private stateStartTime;
|
|
9
|
+
private stateTimeout;
|
|
10
|
+
private isTransitioning;
|
|
11
|
+
private debug;
|
|
12
|
+
/**
|
|
13
|
+
* Optional callback triggered when the behavioral state changes.
|
|
14
|
+
*/
|
|
15
|
+
onStateChange?: (newState: AvatarBehaviorState, intent: BehaviorIntent) => void;
|
|
16
|
+
/**
|
|
17
|
+
* @param options.debug Enable verbose logging for transitions
|
|
18
|
+
*/
|
|
19
|
+
constructor(options?: {
|
|
20
|
+
debug?: boolean;
|
|
21
|
+
});
|
|
22
|
+
/**
|
|
23
|
+
* Toggles debug logging mode without re-initializing the controller.
|
|
24
|
+
*/
|
|
25
|
+
setDebugMode(enabled: boolean): void;
|
|
26
|
+
/**
|
|
27
|
+
* @returns Whether debug mode is currently enabled.
|
|
28
|
+
*/
|
|
29
|
+
isDebugEnabled(): boolean;
|
|
30
|
+
/**
|
|
31
|
+
* Drives the brain logic.
|
|
32
|
+
* @param timeMs Consistent external timestamp (usually from requestAnimationFrame).
|
|
33
|
+
*/
|
|
34
|
+
update(timeMs: number): void;
|
|
35
|
+
/**
|
|
36
|
+
* Core API: Submit a behavioral intent to the brain.
|
|
37
|
+
* @param intent The desired behavior change
|
|
38
|
+
* @param timeMs Optional current time (defaults to performance.now())
|
|
39
|
+
*/
|
|
40
|
+
setIntent(intent: BehaviorIntent, timeMs?: number): void;
|
|
41
|
+
/**
|
|
42
|
+
* @returns The current high-level behavior state.
|
|
43
|
+
*/
|
|
44
|
+
getState(): AvatarBehaviorState;
|
|
45
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import * as THREE from 'three';
|
|
2
|
+
export declare class BubbleManager {
|
|
3
|
+
private scene;
|
|
4
|
+
private sprite;
|
|
5
|
+
private target;
|
|
6
|
+
private offset;
|
|
7
|
+
private visible;
|
|
8
|
+
private canvas;
|
|
9
|
+
private ctx;
|
|
10
|
+
private texture;
|
|
11
|
+
constructor(scene: THREE.Scene);
|
|
12
|
+
setTarget(target: THREE.Object3D): void;
|
|
13
|
+
show(text: string, type?: 'speech' | 'thought'): void;
|
|
14
|
+
hide(): void;
|
|
15
|
+
update(): void;
|
|
16
|
+
private drawBubble;
|
|
17
|
+
private drawRoundedRect;
|
|
18
|
+
private drawCloud;
|
|
19
|
+
}
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import { BehaviorIntent, AgentResponse } from '../types';
|
|
2
|
+
import { SayParams, ThinkParams } from '../schemas/actions';
|
|
1
3
|
export declare class FlowEngine {
|
|
2
4
|
private container;
|
|
3
5
|
private scene;
|
|
@@ -13,11 +15,15 @@ export declare class FlowEngine {
|
|
|
13
15
|
private animController;
|
|
14
16
|
private stageAnimController;
|
|
15
17
|
private lookAtProcessor;
|
|
18
|
+
private brain;
|
|
19
|
+
private bubbleManager;
|
|
16
20
|
private currentAvatarConfig;
|
|
17
21
|
isDebug: boolean;
|
|
18
22
|
private debugTargetMesh;
|
|
19
23
|
private debugPlaneMesh;
|
|
24
|
+
private resizeObserver;
|
|
20
25
|
constructor(containerId: string);
|
|
26
|
+
dispose(): void;
|
|
21
27
|
private setupLights;
|
|
22
28
|
/**
|
|
23
29
|
* Load an avatar by config URL
|
|
@@ -33,6 +39,39 @@ export declare class FlowEngine {
|
|
|
33
39
|
private removeDebugHelpers;
|
|
34
40
|
private onWindowResize;
|
|
35
41
|
isAutoRotate: boolean;
|
|
42
|
+
/**
|
|
43
|
+
* HIGH-LEVEL BEHAVIOR API
|
|
44
|
+
*/
|
|
45
|
+
/**
|
|
46
|
+
* Submit a 'TALKING' intent to the brain.
|
|
47
|
+
* @param params Conversation parameters (text, duration)
|
|
48
|
+
*/
|
|
49
|
+
say(params: SayParams | string): void;
|
|
50
|
+
/**
|
|
51
|
+
* Submit a 'THINKING' intent to the brain.
|
|
52
|
+
* @param params Thought parameters (text, duration)
|
|
53
|
+
*/
|
|
54
|
+
think(params?: ThinkParams | string): void;
|
|
55
|
+
/**
|
|
56
|
+
* Submit a complex behavior intent.
|
|
57
|
+
* @param intent The behavior intent object
|
|
58
|
+
*/
|
|
59
|
+
setBehavior(intent: BehaviorIntent): void;
|
|
60
|
+
/**
|
|
61
|
+
* Processes a structured response from an AI Agent.
|
|
62
|
+
* This is the primary bridge for Agent-to-Avatar interaction.
|
|
63
|
+
* @param response The structured message according to the Unified Action Protocol
|
|
64
|
+
*/
|
|
65
|
+
processAgentResponse(response: AgentResponse): void;
|
|
66
|
+
/**
|
|
67
|
+
* Internal executor for discrete action commands.
|
|
68
|
+
* Note: Actions scheduled with delay may conflict if state changes rapidly.
|
|
69
|
+
*/
|
|
70
|
+
private executeCommand;
|
|
71
|
+
/**
|
|
72
|
+
* Play a manual low-level action. Interrupts high-level brain state.
|
|
73
|
+
* @param action State name defined in config.animations.states
|
|
74
|
+
*/
|
|
36
75
|
playAction(action: string): void;
|
|
37
76
|
private animate;
|
|
38
77
|
}
|
|
@@ -28,6 +28,14 @@ export declare class LookAtProcessor implements InteractionProcessor {
|
|
|
28
28
|
update(timeMs: number, delta: number): void;
|
|
29
29
|
private calculateLookAtRotation;
|
|
30
30
|
private updateState;
|
|
31
|
+
/**
|
|
32
|
+
* Set a manual world-space target for the avatar to look at.
|
|
33
|
+
*/
|
|
34
|
+
setTarget(position: THREE.Vector3): void;
|
|
35
|
+
/**
|
|
36
|
+
* Return the LookAt system to IDLE state.
|
|
37
|
+
*/
|
|
38
|
+
reset(): void;
|
|
31
39
|
private onPointerDown;
|
|
32
40
|
private onPointerMove;
|
|
33
41
|
private onPointerUp;
|