feat(animations): 添加动画演示导航组和相关页面组件

添加新的动画演示导航组，包含完整流程动画和内部机制动画两个分类
实现 MCP 服务发现、上下文压缩和 Token 计数三个动画演示页面
重构导航结构，将原动画演示项移动到新分类下

Author: tt-a1i

src/App.tsx

@@ -50,6 +50,16 @@ const UIRenderingLayer = lazy(() => import('./pages/UIRenderingLayer').then(m =>
 const ThemeSystem = lazy(() => import('./pages/ThemeSystem').then(m => ({ default: m.ThemeSystem })));
 const TelemetrySystem = lazy(() => import('./pages/TelemetrySystem').then(m => ({ default: m.TelemetrySystem })));
 const Animation = lazy(() => import('./pages/Animation').then(m => ({ default: m.Animation })));
+const ToolSchedulerAnimation = lazy(() => import('./pages/ToolSchedulerAnimation').then(m => ({ default: m.ToolSchedulerAnimation })));
+const StreamingParserAnimation = lazy(() => import('./pages/StreamingParserAnimation').then(m => ({ default: m.StreamingParserAnimation })));
+const MCPDiscoveryAnimation = lazy(() => import('./pages/MCPDiscoveryAnimation').then(m => ({ default: m.MCPDiscoveryAnimation })));
+const ContextCompressionAnimation = lazy(() => import('./pages/ContextCompressionAnimation').then(m => ({ default: m.ContextCompressionAnimation })));
+const SubagentAnimation = lazy(() => import('./pages/SubagentAnimation').then(m => ({ default: m.SubagentAnimation })));
+const TurnInternalAnimation = lazy(() => import('./pages/TurnInternalAnimation').then(m => ({ default: m.TurnInternalAnimation })));
+const FormatConverterAnimation = lazy(() => import('./pages/FormatConverterAnimation').then(m => ({ default: m.FormatConverterAnimation })));
+const ChunkAssemblyAnimation = lazy(() => import('./pages/ChunkAssemblyAnimation').then(m => ({ default: m.ChunkAssemblyAnimation })));
+const TokenCountingAnimation = lazy(() => import('./pages/TokenCountingAnimation').then(m => ({ default: m.TokenCountingAnimation })));
+const FunctionResponseAnimation = lazy(() => import('./pages/FunctionResponseAnimation').then(m => ({ default: m.FunctionResponseAnimation })));
 const CoreCode = lazy(() => import('./pages/CoreCode').then(m => ({ default: m.CoreCode })));
 const LoopMechanism = lazy(() => import('./pages/LoopMechanism').then(m => ({ default: m.LoopMechanism })));
 
@@ -222,6 +232,26 @@ function App() {
         return <TelemetrySystem />;
       case 'animation':
         return <Animation />;
+      case 'tool-scheduler-anim':
+        return <ToolSchedulerAnimation />;
+      case 'streaming-parser-anim':
+        return <StreamingParserAnimation />;
+      case 'mcp-discovery-anim':
+        return <MCPDiscoveryAnimation />;
+      case 'context-compression-anim':
+        return <ContextCompressionAnimation />;
+      case 'subagent-anim':
+        return <SubagentAnimation />;
+      case 'turn-internal-anim':
+        return <TurnInternalAnimation />;
+      case 'format-converter-anim':
+        return <FormatConverterAnimation />;
+      case 'chunk-assembly-anim':
+        return <ChunkAssemblyAnimation />;
+      case 'token-counting-anim':
+        return <TokenCountingAnimation />;
+      case 'function-response-anim':
+        return <FunctionResponseAnimation />;
       case 'code':
         return <CoreCode />;
       case 'loop':

src/nav.ts

@@ -114,6 +114,33 @@ export const navGroups: NavGroup[] = [
       { id: 'telemetry', label: '遥测系统' },
     ],
   },
+  {
+    id: 'animations',
+    title: '动画演示',
+    icon: '🎬',
+    defaultOpen: false,
+    items: [
+      { id: 'animation', label: '完整流程动画', highlight: true },
+      { id: 'tool-scheduler-anim', label: '工具调度状态机', highlight: true },
+      { id: 'streaming-parser-anim', label: '流式解析器', highlight: true },
+      { id: 'mcp-discovery-anim', label: 'MCP服务发现', highlight: true },
+      { id: 'context-compression-anim', label: '上下文压缩', highlight: true },
+      { id: 'subagent-anim', label: '子代理系统', highlight: true },
+    ],
+  },
+  {
+    id: 'internal-animations',
+    title: '内部机制动画',
+    icon: '🔬',
+    defaultOpen: true,
+    items: [
+      { id: 'turn-internal-anim', label: 'Turn 状态流转', highlight: true },
+      { id: 'format-converter-anim', label: '格式转换管道', highlight: true },
+      { id: 'chunk-assembly-anim', label: 'Chunk 组装', highlight: true },
+      { id: 'token-counting-anim', label: 'Token 计数', highlight: true },
+      { id: 'function-response-anim', label: 'FunctionResponse 构建', highlight: true },
+    ],
+  },
   {
     id: 'appendix',
     title: '附录',
@@ -123,7 +150,6 @@ export const navGroups: NavGroup[] = [
       { id: 'config', label: '配置系统' },
       { id: 'auth', label: '认证流程' },
       { id: 'startup', label: '启动流程' },
-      { id: 'animation', label: '动画演示', highlight: true },
       { id: 'code', label: '核心代码' },
       { id: 'loop', label: 'Loop机制' },
     ],