refactor(editor): 提取行为树编辑器为独立包并重构编辑器架构 (#216)

* refactor(editor): 提取行为树编辑器为独立包并重构编辑器架构 * feat(editor): 添加插件市场功能 * feat(editor): 重构插件市场以支持版本管理和ZIP打包 * feat(editor): 重构插件发布流程并修复React渲染警告 * fix(plugin): 修复插件发布和市场的路径不一致问题 * feat: 重构插件发布流程并添加插件删除功能 * fix(editor): 完善插件删除功能并修复多个关键问题 * fix(auth): 修复自动登录与手动登录的竞态条件问题 * feat(editor): 重构插件管理流程 * feat(editor): 支持 ZIP 文件直接发布插件 - 新增 PluginSourceParser 解析插件源 - 重构发布流程支持文件夹和 ZIP 两种方式 - 优化发布向导 UI * feat(editor): 插件市场支持多版本安装 - 插件解压到项目 plugins 目录 - 新增 Tauri 后端安装/卸载命令 - 支持选择任意版本安装 - 修复打包逻辑，保留完整 dist 目录结构 * feat(editor): 个人中心支持多版本管理 - 合并同一插件的不同版本 - 添加版本历史展开/折叠功能 - 禁止有待审核 PR 时更新插件 * fix(editor): 修复 InspectorRegistry 服务注册 - InspectorRegistry 实现 IService 接口 - 注册到 Core.services 供插件使用 * feat(behavior-tree-editor): 完善插件注册和文件操作 - 添加文件创建模板和操作处理器 - 实现右键菜单创建行为树功能 - 修复文件读取权限问题（使用 Tauri 命令） - 添加 BehaviorTreeEditorPanel 组件 - 修复 rollup 配置支持动态导入 * feat(plugin): 完善插件构建和发布流程 * fix(behavior-tree-editor): 完整恢复编辑器并修复 Toast 集成 * fix(behavior-tree-editor): 修复节点选中、连线跟随和文件加载问题并优化性能 * fix(behavior-tree-editor): 修复端口连接失败问题并优化连线样式 * refactor(behavior-tree-editor): 移除调试面板功能简化代码结构 * refactor(behavior-tree-editor): 清理冗余代码合并重复逻辑 * feat(behavior-tree-editor): 完善编辑器核心功能增强扩展性 * fix(lint): 修复ESLint错误确保CI通过 * refactor(behavior-tree-editor): 优化编辑器工具栏和编译器功能 * refactor(behavior-tree-editor): 清理技术债务，优化代码质量 * fix(editor-app): 修复字符串替换安全问题
2025-11-18 14:46:51 +08:00
parent eac660b1a0
commit bce3a6e253
251 changed files with 26144 additions and 8844 deletions
@@ -0,0 +1,83 @@
+import React, { useMemo } from 'react';
+import { ConnectionRenderer } from './ConnectionRenderer';
+import { ConnectionViewData } from '../../types';
+import { Node } from '../../domain/models/Node';
+import { Connection } from '../../domain/models/Connection';
+
+interface ConnectionLayerProps {
+    connections: Connection[];
+    nodes: Node[];
+    selectedConnection?: { from: string; to: string } | null;
+    getPortPosition: (nodeId: string, propertyName?: string, portType?: 'input' | 'output') => { x: number; y: number } | null;
+    onConnectionClick?: (e: React.MouseEvent, fromId: string, toId: string) => void;
+    onConnectionContextMenu?: (e: React.MouseEvent, fromId: string, toId: string) => void;
+}
+export const ConnectionLayer: React.FC<ConnectionLayerProps> = ({
+    connections,
+    nodes,
+    selectedConnection,
+    getPortPosition,
+    onConnectionClick,
+    onConnectionContextMenu
+}) => {
+    const nodeMap = useMemo(() => {
+        return new Map(nodes.map((node) => [node.id, node]));
+    }, [nodes]);
+
+    const connectionViewData = useMemo(() => {
+        return connections
+            .map((connection) => {
+                const fromNode = nodeMap.get(connection.from);
+                const toNode = nodeMap.get(connection.to);
+
+                if (!fromNode || !toNode) {
+                    return null;
+                }
+
+                return { connection, fromNode, toNode };
+            })
+            .filter((item): item is NonNullable<typeof item> => item !== null);
+    }, [connections, nodeMap]);
+
+    const isConnectionSelected = (connection: { from: string; to: string }) => {
+        return selectedConnection?.from === connection.from &&
+               selectedConnection?.to === connection.to;
+    };
+
+    if (connectionViewData.length === 0) {
+        return null;
+    }
+
+    return (
+        <svg
+            className="connection-layer"
+            style={{
+                position: 'absolute',
+                inset: 0,
+                pointerEvents: 'none',
+                overflow: 'visible',
+                zIndex: 0
+            }}
+        >
+            <g style={{ pointerEvents: 'auto' }}>
+                {connectionViewData.map(({ connection, fromNode, toNode }) => {
+                    const viewData: ConnectionViewData = {
+                        connection,
+                        isSelected: isConnectionSelected(connection)
+                    };
+                    return (
+                        <ConnectionRenderer
+                            key={`${connection.from}-${connection.to}`}
+                            connectionData={viewData}
+                            fromNode={fromNode}
+                            toNode={toNode}
+                            getPortPosition={getPortPosition}
+                            onClick={onConnectionClick}
+                            onContextMenu={onConnectionContextMenu}
+                        />
+                    );
+                })}
+            </g>
+        </svg>
+    );
+};