feat(fairygui): FairyGUI 完整集成 (#314)

* feat(fairygui): FairyGUI ECS 集成核心架构

实现 FairyGUI 的 ECS 原生集成，完全替代旧 UI 系统：

核心类：
- GObject: UI 对象基类，支持变换、可见性、关联、齿轮
- GComponent: 容器组件，管理子对象和控制器
- GRoot: 根容器，管理焦点、弹窗、输入分发
- GGroup: 组容器，支持水平/垂直布局

抽象层：
- DisplayObject: 显示对象基类
- EventDispatcher: 事件分发
- Timer: 计时器
- Stage: 舞台，管理输入和缩放

布局系统：
- Relations: 约束关联管理
- RelationItem: 24 种关联类型

基础设施：
- Controller: 状态控制器
- Transition: 过渡动画
- ScrollPane: 滚动面板
- UIPackage: 包管理
- ByteBuffer: 二进制解析

* refactor(ui): 删除旧 UI 系统，使用 FairyGUI 替代

* feat(fairygui): 实现 UI 控件

- 添加显示类：Image、TextField、Graph
- 添加基础控件：GImage、GTextField、GGraph
- 添加交互控件：GButton、GProgressBar、GSlider
- 更新 IRenderCollector 支持 Graph 渲染
- 扩展 Controller 添加 selectedPageId
- 添加 STATE_CHANGED 事件类型

* feat(fairygui): 现代化架构重构

- 增强 EventDispatcher 支持类型安全、优先级和传播控制
- 添加 PropertyBinding 响应式属性绑定系统
- 添加 ServiceContainer 依赖注入容器
- 添加 UIConfig 全局配置系统
- 添加 UIObjectFactory 对象工厂
- 实现 RenderBridge 渲染桥接层
- 实现 Canvas2DBackend 作为默认渲染后端
- 扩展 IRenderCollector 支持更多图元类型

* feat(fairygui): 九宫格渲染和资源加载修复

- 修复 FGUIUpdateSystem 支持路径和 GUID 两种加载方式
- 修复 GTextInput 同时设置 _displayObject 和 _textField
- 实现九宫格渲染展开为 9 个子图元
- 添加 sourceWidth/sourceHeight 用于九宫格计算
- 添加 DOMTextRenderer 文本渲染层（临时方案）

* fix(fairygui): 修复 GGraph 颜色读取

* feat(fairygui): 虚拟节点 Inspector 和文本渲染支持

* fix(fairygui): 编辑器状态刷新和遗留引用修复

- 修复切换 FGUI 包后组件列表未刷新问题
- 修复切换组件后 viewport 未清理旧内容问题
- 修复虚拟节点在包加载后未刷新问题
- 重构为事件驱动架构，移除轮询机制
- 修复 @esengine/ui 遗留引用，统一使用 @esengine/fairygui

* fix: 移除 tsconfig 中的 @esengine/ui 引用

packages/editor-app/src/styles/SceneHierarchy.css

@@ -795,3 +795,49 @@
         display: none;
     }
 }
+
+/* ==================== Virtual Nodes | 虚拟节点 ==================== */
+/* Virtual nodes are read-only internal nodes from components like FGUI */
+/* 虚拟节点是来自组件（如 FGUI）的只读内部节点 */
+
+.outliner-item.virtual-node {
+    background: rgba(245, 158, 11, 0.05);
+    border-left: 2px solid rgba(245, 158, 11, 0.4);
+}
+
+.outliner-item.virtual-node:hover {
+    background: rgba(245, 158, 11, 0.1);
+}
+
+.outliner-item.virtual-node.selected {
+    background: rgba(245, 158, 11, 0.2);
+    border-left-color: #f59e0b;
+}
+
+.outliner-item.virtual-node .outliner-item-name.virtual-name {
+    color: #fbbf24;
+    font-style: italic;
+}
+
+.outliner-item.virtual-node .outliner-item-type.virtual-type {
+    color: #d97706;
+    font-size: 10px;
+}
+
+/* Hidden virtual node (invisible in UI) */
+/* 隐藏的虚拟节点（在 UI 中不可见） */
+.outliner-item.virtual-node.hidden-node {
+    opacity: 0.5;
+}
+
+.outliner-item.virtual-node.hidden-node .outliner-item-name {
+    text-decoration: line-through;
+}
+
+/* Virtual node icon colors */
+/* 虚拟节点图标颜色 */
+.outliner-item.virtual-node svg {
+    color: #f59e0b;
+    flex-shrink: 0;
+    margin-right: 4px;
+}

packages/editor-app/src/styles/VirtualNodeInspector.css

@@ -0,0 +1,165 @@
+/**
+ * 虚拟节点检查器样式
+ * Virtual Node Inspector styles
+ */
+
+.virtual-node-inspector {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    background-color: #262626;
+    color: #ccc;
+    font-size: 11px;
+    overflow-y: auto;
+}
+
+/* Header */
+.virtual-node-header {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 8px 12px;
+    background: linear-gradient(to right, rgba(245, 158, 11, 0.1), transparent);
+    border-bottom: 1px solid #3a3a3a;
+    border-left: 3px solid #f59e0b;
+}
+
+.virtual-node-header .header-icon {
+    color: #f59e0b;
+    flex-shrink: 0;
+}
+
+.virtual-node-header .header-info {
+    flex: 1;
+    min-width: 0;
+}
+
+.virtual-node-header .header-name {
+    font-size: 13px;
+    font-weight: 600;
+    color: #fff;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.virtual-node-header .header-type {
+    font-size: 10px;
+    color: #888;
+    margin-top: 2px;
+}
+
+.virtual-node-header .header-badge {
+    font-size: 9px;
+    padding: 2px 6px;
+    background: rgba(245, 158, 11, 0.2);
+    border: 1px solid rgba(245, 158, 11, 0.4);
+    border-radius: 3px;
+    color: #f59e0b;
+    white-space: nowrap;
+}
+
+/* Read-only notice */
+.virtual-node-notice {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    padding: 6px 12px;
+    background: rgba(59, 130, 246, 0.1);
+    border-bottom: 1px solid #3a3a3a;
+    color: #60a5fa;
+    font-size: 10px;
+}
+
+/* Section */
+.virtual-node-section {
+    margin: 8px 0;
+}
+
+.virtual-node-section .section-header {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    padding: 6px 12px;
+    background: #2d2d2d;
+    border-top: 1px solid #1a1a1a;
+    border-bottom: 1px solid #1a1a1a;
+    font-size: 10px;
+    font-weight: 600;
+    color: #888;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+}
+
+.virtual-node-section .section-content {
+    padding: 4px 0;
+}
+
+/* Property Row */
+.virtual-node-property-row {
+    display: flex;
+    align-items: center;
+    padding: 4px 12px;
+    min-height: 24px;
+}
+
+.virtual-node-property-row:hover {
+    background: rgba(255, 255, 255, 0.03);
+}
+
+.virtual-node-property-row .property-label {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    width: 100px;
+    flex-shrink: 0;
+    color: #999;
+    font-size: 11px;
+}
+
+.virtual-node-property-row .property-icon {
+    display: flex;
+    align-items: center;
+    color: #666;
+}
+
+.virtual-node-property-row .property-value {
+    flex: 1;
+    color: #ccc;
+    font-family: 'JetBrains Mono', 'Fira Code', monospace;
+    font-size: 11px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.virtual-node-property-row .property-value svg {
+    color: #4ade80;
+}
+
+.virtual-node-property-row .property-value svg.disabled {
+    color: #666;
+}
+
+/* Color swatch */
+.color-swatch-wrapper {
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+}
+
+.color-swatch {
+    display: inline-block;
+    width: 16px;
+    height: 16px;
+    border-radius: 3px;
+    border: 1px solid rgba(255, 255, 255, 0.2);
+    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3);
+    flex-shrink: 0;
+}
+
+.color-value {
+    font-family: 'JetBrains Mono', 'Fira Code', monospace;
+    font-size: 10px;
+    color: #888;
+}