feat: merge XCBluePrint 3D visualization into project

src/App.tsx

@@ -1,9 +1,50 @@
-import { ApiDocViewer } from './components/ApiDocViewer'
-import { config } from './config'
+import { useState } from 'react';
+import { FileText, Box } from 'lucide-react';
+import { ApiDocViewer } from './components/ApiDocViewer';
+import BlueprintPage from './components/blueprint/BlueprintPage';
+import { config } from './config';
+
+type Page = 'docs' | 'blueprint';
 
 function App() {
-  document.title = config.projectName
-  return <ApiDocViewer />
+  const [currentPage, setCurrentPage] = useState<Page>('docs');
+  
+  document.title = config.projectName;
+
+  return (
+    <div className="h-screen flex flex-col">
+      <header className="h-12 bg-zinc-900 border-b border-zinc-800 flex items-center px-4 justify-between">
+        <h1 className="text-sm font-medium text-white">{config.projectName}</h1>
+        <nav className="flex gap-1">
+          <button
+            onClick={() => setCurrentPage('docs')}
+            className={`flex items-center gap-2 px-3 py-1.5 rounded text-sm ${
+              currentPage === 'docs' 
+                ? 'bg-zinc-800 text-white' 
+                : 'text-zinc-400 hover:text-white hover:bg-zinc-800/50'
+            }`}
+          >
+            <FileText size={16} />
+            API 文档
+          </button>
+          <button
+            onClick={() => setCurrentPage('blueprint')}
+            className={`flex items-center gap-2 px-3 py-1.5 rounded text-sm ${
+              currentPage === 'blueprint' 
+                ? 'bg-zinc-800 text-white' 
+                : 'text-zinc-400 hover:text-white hover:bg-zinc-800/50'
+            }`}
+          >
+            <Box size={16} />
+            3D 蓝图
+          </button>
+        </nav>
+      </header>
+      <main className="flex-1 overflow-hidden">
+        {currentPage === 'docs' ? <ApiDocViewer /> : <BlueprintPage />}
+      </main>
+    </div>
+  );
 }
 
-export default App
+export default App;