Initial commit: XCEngine API Docs Viewer
This commit is contained in:
5
.gitignore
vendored
Normal file
5
.gitignore
vendored
Normal file
@@ -0,0 +1,5 @@
|
||||
node_modules/
|
||||
dist/
|
||||
.vite/
|
||||
*.log
|
||||
.DS_Store
|
||||
12
index.html
Normal file
12
index.html
Normal file
@@ -0,0 +1,12 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>XCEngine API Docs</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
2806
package-lock.json
generated
Normal file
2806
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
27
package.json
Normal file
27
package.json
Normal file
@@ -0,0 +1,27 @@
|
||||
{
|
||||
"name": "xcengine-api-docs",
|
||||
"version": "1.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "tsc && vite build",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "^18.3.1",
|
||||
"react-dom": "^18.3.1",
|
||||
"lucide-react": "^0.511.0",
|
||||
"clsx": "^2.1.1",
|
||||
"tailwind-merge": "^3.5.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "^18.3.12",
|
||||
"@types/react-dom": "^18.3.1",
|
||||
"@vitejs/plugin-react": "^4.4.1",
|
||||
"typescript": "~5.8.3",
|
||||
"vite": "^6.3.5",
|
||||
"tailwindcss": "^3.4.17",
|
||||
"autoprefixer": "^10.4.21",
|
||||
"postcss": "^8.5.3"
|
||||
}
|
||||
}
|
||||
6
postcss.config.js
Normal file
6
postcss.config.js
Normal file
@@ -0,0 +1,6 @@
|
||||
export default {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
}
|
||||
7
src/App.tsx
Normal file
7
src/App.tsx
Normal file
@@ -0,0 +1,7 @@
|
||||
import { ApiDocViewer } from './components/ApiDocViewer'
|
||||
|
||||
function App() {
|
||||
return <ApiDocViewer />
|
||||
}
|
||||
|
||||
export default App
|
||||
74
src/components/ApiDocViewer.tsx
Normal file
74
src/components/ApiDocViewer.tsx
Normal file
@@ -0,0 +1,74 @@
|
||||
import { useState, useEffect, useCallback } from 'react'
|
||||
import { DocTree } from './DocTree'
|
||||
import { DocContent } from './DocContent'
|
||||
import { parseMarkdown, buildFileTree } from '@/lib/parser'
|
||||
import type { DocFile, ParsedDoc } from '@/lib/types'
|
||||
import { docs } from '@/data/docs'
|
||||
|
||||
const DOCS_FILES: Record<string, string> = docs
|
||||
|
||||
export const ApiDocViewer = () => {
|
||||
const [fileTree, setFileTree] = useState<DocFile[]>([])
|
||||
const [selectedPath, setSelectedPath] = useState<string | undefined>()
|
||||
const [currentDoc, setCurrentDoc] = useState<ParsedDoc | null>(null)
|
||||
|
||||
useEffect(() => {
|
||||
const files = Object.keys(DOCS_FILES)
|
||||
const basePath = '/docs'
|
||||
const tree = buildFileTree(files, basePath)
|
||||
setFileTree(tree)
|
||||
|
||||
if (files.length > 0) {
|
||||
setSelectedPath(files[0])
|
||||
}
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
if (selectedPath) {
|
||||
const content = DOCS_FILES[selectedPath]
|
||||
if (content) {
|
||||
const parsed = parseMarkdown(content)
|
||||
setCurrentDoc(parsed)
|
||||
}
|
||||
}
|
||||
}, [selectedPath])
|
||||
|
||||
const handleSelect = useCallback((file: DocFile) => {
|
||||
if (!file.isDir) {
|
||||
setSelectedPath(file.relativePath)
|
||||
}
|
||||
}, [])
|
||||
|
||||
const handleReferenceClick = useCallback((ref: string) => {
|
||||
const normalizedRef = ref.replace('.md', '')
|
||||
const allFiles = Object.keys(DOCS_FILES).map(k => k.replace('/docs/', ''))
|
||||
const match = allFiles.find(f => f.replace('.md', '') === normalizedRef)
|
||||
if (match) {
|
||||
setSelectedPath(match)
|
||||
}
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<div className="flex h-screen bg-[#1e1e1e]">
|
||||
<aside className="w-64 bg-[#252526] border-r border-[#3c3c3c] flex flex-col">
|
||||
<div className="p-3 border-b border-[#3c3c3c]">
|
||||
<h2 className="text-sm font-semibold text-gray-200">API 文档</h2>
|
||||
</div>
|
||||
<div className="flex-1 overflow-hidden">
|
||||
<DocTree
|
||||
files={fileTree}
|
||||
selectedPath={selectedPath}
|
||||
onSelect={handleSelect}
|
||||
/>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<main className="flex-1 overflow-hidden">
|
||||
<DocContent
|
||||
doc={currentDoc}
|
||||
onReferenceClick={handleReferenceClick}
|
||||
/>
|
||||
</main>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
180
src/components/DocContent.tsx
Normal file
180
src/components/DocContent.tsx
Normal file
@@ -0,0 +1,180 @@
|
||||
import React from 'react'
|
||||
import { clsx } from 'clsx'
|
||||
import type { ParsedDoc, DocTable, DocCodeBlock } from '@/lib/types'
|
||||
|
||||
interface DocContentProps {
|
||||
doc: ParsedDoc | null
|
||||
onReferenceClick: (ref: string) => void
|
||||
}
|
||||
|
||||
export const DocContent = ({ doc, onReferenceClick }: DocContentProps) => {
|
||||
if (!doc) {
|
||||
return (
|
||||
<div className="flex items-center justify-center h-full text-gray-500">
|
||||
<p>Select a document from the sidebar</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="h-full overflow-auto p-6">
|
||||
<div className="max-w-4xl mx-auto">
|
||||
<h1 className="text-2xl font-bold text-white mb-4">{doc.title}</h1>
|
||||
|
||||
{doc.metadata.namespace && (
|
||||
<div className="mb-4">
|
||||
<span className="text-gray-400">Namespace: </span>
|
||||
<code className="bg-gray-800 px-2 py-1 rounded text-blue-400">{doc.metadata.namespace}</code>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{doc.metadata.package && (
|
||||
<div className="mb-4">
|
||||
<span className="text-gray-400">Package: </span>
|
||||
<code className="bg-gray-800 px-2 py-1 rounded text-blue-400">{doc.metadata.package}</code>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{doc.metadata.type && (
|
||||
<div className="mb-4">
|
||||
<span className="text-gray-400">Type: </span>
|
||||
<span className="text-yellow-400">{doc.metadata.type}</span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{doc.metadata.inherits && (
|
||||
<div className="mb-4">
|
||||
<span className="text-gray-400">Inherits: </span>
|
||||
<code className="bg-gray-800 px-2 py-1 rounded text-purple-400">{doc.metadata.inherits}</code>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{doc.metadata.description && (
|
||||
<p className="text-gray-300 mb-6">{doc.metadata.description}</p>
|
||||
)}
|
||||
|
||||
{doc.sections.map((section, idx) => (
|
||||
<Section
|
||||
key={idx}
|
||||
section={section}
|
||||
onReferenceClick={onReferenceClick}
|
||||
/>
|
||||
))}
|
||||
|
||||
{doc.references.length > 0 && (
|
||||
<div className="mt-8 pt-4 border-t border-gray-700">
|
||||
<h3 className="text-lg font-semibold text-white mb-2">See Also</h3>
|
||||
<ul className="space-y-1">
|
||||
{doc.references.map((ref, idx) => (
|
||||
<li key={idx}>
|
||||
<button
|
||||
onClick={() => onReferenceClick(ref)}
|
||||
className="text-blue-400 hover:text-blue-300 hover:underline"
|
||||
>
|
||||
{ref}
|
||||
</button>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
interface SectionProps {
|
||||
section: import('@/lib/types').DocSection
|
||||
onReferenceClick: (ref: string) => void
|
||||
}
|
||||
|
||||
const Section = ({ section, onReferenceClick }: SectionProps) => {
|
||||
const HeadingTag = `h${Math.min(section.level + 1, 6)}` as keyof JSX.IntrinsicElements
|
||||
|
||||
return (
|
||||
<section className="mb-6">
|
||||
<HeadingTag className={clsx(
|
||||
'font-semibold text-white mb-3',
|
||||
section.level === 1 ? 'text-xl' : 'text-lg'
|
||||
)}>
|
||||
{section.title}
|
||||
</HeadingTag>
|
||||
|
||||
<div className="space-y-3">
|
||||
{section.content.map((item, idx) => {
|
||||
if (item.type === 'table') {
|
||||
return <TableContent key={idx} table={item.data as DocTable} />
|
||||
}
|
||||
if (item.type === 'code') {
|
||||
return <CodeContent key={idx} code={item.data as DocCodeBlock} />
|
||||
}
|
||||
return <TextContent key={idx} text={item.data as string} onReferenceClick={onReferenceClick} />
|
||||
})}
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
const TextContent = ({ text, onReferenceClick }: { text: string; onReferenceClick: (ref: string) => void }) => {
|
||||
const renderText = () => {
|
||||
const parts = text.split(/(@see\s+\S+)/g)
|
||||
return parts.map((part, idx) => {
|
||||
const match = part.match(/@see\s+(\S+)/)
|
||||
if (match) {
|
||||
return (
|
||||
<button
|
||||
key={idx}
|
||||
onClick={() => onReferenceClick(match[1])}
|
||||
className="text-blue-400 hover:text-blue-300 hover:underline"
|
||||
>
|
||||
{part}
|
||||
</button>
|
||||
)
|
||||
}
|
||||
return <span key={idx}>{part}</span>
|
||||
})
|
||||
}
|
||||
|
||||
return <p className="text-gray-300">{renderText()}</p>
|
||||
}
|
||||
|
||||
const TableContent = ({ table }: { table: DocTable }) => {
|
||||
if (!table.headers.length || !table.rows.length) return null
|
||||
|
||||
return (
|
||||
<div className="overflow-x-auto">
|
||||
<table className="w-full border-collapse text-sm">
|
||||
<thead>
|
||||
<tr className="bg-gray-800">
|
||||
{table.headers.map((header, idx) => (
|
||||
<th key={idx} className="border border-gray-600 px-3 py-2 text-left text-gray-200 font-semibold">
|
||||
{header}
|
||||
</th>
|
||||
))}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{table.rows.map((row, rowIdx) => (
|
||||
<tr key={rowIdx} className="hover:bg-gray-800/50">
|
||||
{row.map((cell, cellIdx) => (
|
||||
<td key={cellIdx} className="border border-gray-600 px-3 py-2 text-gray-300">
|
||||
{cell}
|
||||
</td>
|
||||
))}
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const CodeContent = ({ code }: { code: DocCodeBlock }) => {
|
||||
return (
|
||||
<pre className="bg-gray-900 border border-gray-700 rounded-lg p-4 overflow-x-auto">
|
||||
<code className={`language-${code.language || 'text'} text-sm text-gray-200`}>
|
||||
{code.code}
|
||||
</code>
|
||||
</pre>
|
||||
)
|
||||
}
|
||||
97
src/components/DocTree.tsx
Normal file
97
src/components/DocTree.tsx
Normal file
@@ -0,0 +1,97 @@
|
||||
import React, { useState } from 'react'
|
||||
import { ChevronRight, ChevronDown, Folder, FileText } from 'lucide-react'
|
||||
import { clsx } from 'clsx'
|
||||
import type { DocFile } from '@/lib/types'
|
||||
import { getDisplayName } from '@/lib/parser'
|
||||
|
||||
interface DocTreeProps {
|
||||
files: DocFile[]
|
||||
selectedPath?: string
|
||||
onSelect: (file: DocFile) => void
|
||||
}
|
||||
|
||||
interface DocTreeNodeProps {
|
||||
file: DocFile
|
||||
level: number
|
||||
selectedPath?: string
|
||||
onSelect: (file: DocFile) => void
|
||||
}
|
||||
|
||||
const DocTreeNode = React.memo(({ file, level, selectedPath, onSelect }: DocTreeNodeProps) => {
|
||||
const [expanded, setExpanded] = useState(level === 0)
|
||||
|
||||
const isSelected = selectedPath === file.relativePath
|
||||
const isDir = file.isDir
|
||||
|
||||
const handleClick = (e: React.MouseEvent) => {
|
||||
e.stopPropagation()
|
||||
if (isDir) {
|
||||
setExpanded(!expanded)
|
||||
} else {
|
||||
onSelect(file)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div
|
||||
className={clsx(
|
||||
'flex items-center gap-2 py-1 px-2 rounded-md cursor-pointer transition-colors text-sm',
|
||||
isSelected
|
||||
? 'bg-gray-600 text-white'
|
||||
: 'hover:bg-gray-700 text-gray-300'
|
||||
)}
|
||||
onClick={handleClick}
|
||||
style={{ paddingLeft: `${level * 16 + 8}px` }}
|
||||
>
|
||||
<span className="text-gray-400 shrink-0">
|
||||
{isDir ? (
|
||||
expanded ? <ChevronDown size={16} /> : <ChevronRight size={16} />
|
||||
) : (
|
||||
<span className="w-4" />
|
||||
)}
|
||||
</span>
|
||||
|
||||
<span className="text-gray-400 shrink-0">
|
||||
{isDir ? <Folder size={16} /> : <FileText size={16} />}
|
||||
</span>
|
||||
|
||||
<span className="truncate">{getDisplayName(file.name)}</span>
|
||||
</div>
|
||||
|
||||
{isDir && expanded && file.children && (
|
||||
<div>
|
||||
{file.children.map((child) => (
|
||||
<DocTreeNode
|
||||
key={child.relativePath}
|
||||
file={child}
|
||||
level={level + 1}
|
||||
selectedPath={selectedPath}
|
||||
onSelect={onSelect}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
||||
DocTreeNode.displayName = 'DocTreeNode'
|
||||
|
||||
export const DocTree = ({ files, selectedPath, onSelect }: DocTreeProps) => {
|
||||
return (
|
||||
<div className="select-none w-full h-full overflow-auto py-2">
|
||||
<div className="space-y-1">
|
||||
{files.map((file) => (
|
||||
<DocTreeNode
|
||||
key={file.relativePath}
|
||||
file={file}
|
||||
level={0}
|
||||
selectedPath={selectedPath}
|
||||
onSelect={onSelect}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
37
src/data/RHI/RHIDevice.md
Normal file
37
src/data/RHI/RHIDevice.md
Normal file
@@ -0,0 +1,37 @@
|
||||
# RHIDevice 类
|
||||
|
||||
**命名空间**: XCEngine.RHI
|
||||
|
||||
**类型**: class
|
||||
|
||||
**描述**: RHI 设备抽象基类，提供图形设备创建和管理功能。
|
||||
|
||||
## 公共方法
|
||||
|
||||
| 方法 | 描述 |
|
||||
|------|------|
|
||||
| Create() | 创建 RHI 设备实例 |
|
||||
| Initialize() | 初始化图形设备 |
|
||||
| Shutdown() | 关闭并释放设备资源 |
|
||||
|
||||
## 属性
|
||||
|
||||
| 属性 | 描述 |
|
||||
|------|------|
|
||||
| capabilities | 获取硬件能力检测结果 |
|
||||
| deviceName | 获取设备名称 |
|
||||
|
||||
## 示例代码
|
||||
|
||||
```cpp
|
||||
using namespace XCEngine::RHI;
|
||||
|
||||
class MyDevice {
|
||||
void Init() {
|
||||
auto device = RHIDevice::Create();
|
||||
device->Initialize();
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
@see RHICommandQueue.md
|
||||
48
src/data/RHI/RHITexture.md
Normal file
48
src/data/RHI/RHITexture.md
Normal file
@@ -0,0 +1,48 @@
|
||||
# RHITexture 类
|
||||
|
||||
**命名空间**: XCEngine.RHI
|
||||
|
||||
**类型**: class
|
||||
|
||||
**描述**: 纹理资源抽象，用于存储图像数据。
|
||||
|
||||
## 公共方法
|
||||
|
||||
| 方法 | 描述 |
|
||||
|------|------|
|
||||
| Create() | 创建纹理资源 |
|
||||
| Destroy() | 销毁纹理资源 |
|
||||
| Map() | 映射纹理数据到 CPU |
|
||||
| Unmap() | 取消映射 |
|
||||
|
||||
## 纹理属性
|
||||
|
||||
| 属性 | 描述 |
|
||||
|------|------|
|
||||
| width | 纹理宽度 |
|
||||
| height | 纹理高度 |
|
||||
| format | 纹理格式 |
|
||||
| mipLevels | Mipmap 级别数 |
|
||||
|
||||
## 纹理格式枚举
|
||||
|
||||
| 格式 | 描述 |
|
||||
|------|------|
|
||||
| R8G8B8A8_UNORM | 8位 RGBA |
|
||||
| R32_FLOAT | 32位单通道浮点 |
|
||||
| D32_FLOAT | 32位深度 |
|
||||
| BC7_UNORM | BC7 压缩格式 |
|
||||
|
||||
## 使用示例
|
||||
|
||||
```cpp
|
||||
RHITextureDesc desc;
|
||||
desc.width = 1024;
|
||||
desc.height = 1024;
|
||||
desc.format = RHIFormat::R8G8B8A8_UNORM;
|
||||
desc.mipLevels = 1;
|
||||
|
||||
auto texture = device->CreateTexture(desc);
|
||||
```
|
||||
|
||||
@see RHIDevice.md
|
||||
53
src/data/RHIBuffer.md
Normal file
53
src/data/RHIBuffer.md
Normal file
@@ -0,0 +1,53 @@
|
||||
# RHIBuffer 类
|
||||
|
||||
**命名空间**: XCEngine.RHI
|
||||
|
||||
**类型**: class
|
||||
|
||||
**描述**: 缓冲区资源抽象，用于存储顶点、索引、常量等数据。
|
||||
|
||||
## 缓冲区类型
|
||||
|
||||
| 类型 | 描述 |
|
||||
|------|------|
|
||||
| VertexBuffer | 顶点缓冲区 |
|
||||
| IndexBuffer | 索引缓冲区 |
|
||||
| ConstantBuffer | 常量缓冲区 |
|
||||
| ReadBackBuffer | 回读缓冲区 |
|
||||
|
||||
## 公共方法
|
||||
|
||||
| 方法 | 描述 |
|
||||
|------|------|
|
||||
| Create() | 创建缓冲区 |
|
||||
| Map() | 映射到 CPU 内存 |
|
||||
| Unmap() | 取消映射 |
|
||||
| SetData() | 设置数据 |
|
||||
|
||||
## 属性
|
||||
|
||||
| 属性 | 描述 |
|
||||
|------|------|
|
||||
| size | 缓冲区大小 |
|
||||
| usage | 缓冲区用途 |
|
||||
| stride | 数据步长 |
|
||||
|
||||
## 使用示例
|
||||
|
||||
```cpp
|
||||
RHIBufferDesc vbDesc;
|
||||
vbDesc.size = sizeof(Vertex) * vertexCount;
|
||||
vbDesc.usage = RHIBufferUsage::VertexBuffer;
|
||||
vbDesc.stride = sizeof(Vertex);
|
||||
|
||||
auto vertexBuffer = device->CreateBuffer(vbDesc);
|
||||
vertexBuffer->SetData(vertices.data());
|
||||
```
|
||||
|
||||
## 性能提示
|
||||
|
||||
- 对于静态数据，使用 Immutable 模式
|
||||
- 频繁更新的数据使用 Dynamic 模式
|
||||
- 大缓冲区考虑使用分页上传
|
||||
|
||||
@see RHIDevice.md @see RHICommandList.md
|
||||
32
src/data/RHICommandList.md
Normal file
32
src/data/RHICommandList.md
Normal file
@@ -0,0 +1,32 @@
|
||||
# RHICommandList 类
|
||||
|
||||
**命名空间**: XCEngine.RHI
|
||||
|
||||
**类型**: class
|
||||
|
||||
**继承**: IRefCounter
|
||||
|
||||
**描述**: 命令列表抽象，用于记录渲染命令。
|
||||
|
||||
## 公共方法
|
||||
|
||||
| 方法 | 描述 |
|
||||
|------|------|
|
||||
| Reset() | 重置命令列表 |
|
||||
| Close() | 关闭命令列表 |
|
||||
| BeginRenderPass() | 开始渲染通道 |
|
||||
| EndRenderPass() | 结束渲染通道 |
|
||||
| Draw() | 发出绘制调用 |
|
||||
| Dispatch() | 发出计算调度 |
|
||||
|
||||
## 示例代码
|
||||
|
||||
```cpp
|
||||
cmdList->BeginRenderPass(passDesc);
|
||||
cmdList->SetPipelineState(pso);
|
||||
cmdList->Draw(3, 1, 0, 0);
|
||||
cmdList->EndRenderPass();
|
||||
cmdList->Close();
|
||||
```
|
||||
|
||||
@see RHIDevice.md
|
||||
32
src/data/RHICommandQueue.md
Normal file
32
src/data/RHICommandQueue.md
Normal file
@@ -0,0 +1,32 @@
|
||||
# RHICommandQueue 类
|
||||
|
||||
**命名空间**: XCEngine.RHI
|
||||
|
||||
**类型**: class
|
||||
|
||||
**描述**: 命令队列抽象，用于提交渲染命令到 GPU。
|
||||
|
||||
## 公共方法
|
||||
|
||||
| 方法 | 描述 |
|
||||
|------|------|
|
||||
| Submit() | 提交命令缓冲区到队列 |
|
||||
| Wait() | 等待队列执行完成 |
|
||||
| Signal() | 信号同步对象 |
|
||||
|
||||
## 枚举
|
||||
|
||||
| 枚举值 | 描述 |
|
||||
|--------|------|
|
||||
| Direct | 直接命令队列 |
|
||||
| Compute | 计算命令队列 |
|
||||
| Copy | 复制命令队列 |
|
||||
|
||||
## 示例代码
|
||||
|
||||
```cpp
|
||||
RHICommandQueue* queue = device->GetCommandQueue(RHIQueueType::Direct);
|
||||
queue->Submit(commandBuffer);
|
||||
```
|
||||
|
||||
@see RHICommandList.md
|
||||
249
src/data/docs.ts
Normal file
249
src/data/docs.ts
Normal file
@@ -0,0 +1,249 @@
|
||||
export const docs: Record<string, string> = {
|
||||
'getting-started.md': `# 入门指南
|
||||
|
||||
**描述**: 欢迎使用 XCEngine API 文档
|
||||
|
||||
## 快速开始
|
||||
|
||||
要开始使用 XCEngine，请按照以下步骤操作：
|
||||
|
||||
1. 初始化设备
|
||||
2. 创建命令队列
|
||||
3. 执行渲染命令
|
||||
|
||||
**命名空间**: XCEngine.RHI
|
||||
|
||||
## 系统要求
|
||||
|
||||
| 要求 | 最低版本 |
|
||||
|------|----------|
|
||||
| DirectX 12 | 12.0 |
|
||||
| OpenGL | 4.6 |
|
||||
|
||||
## 示例代码
|
||||
|
||||
\`\`\`cpp
|
||||
#include <XCEngine/RHI/RHIDevice.h>
|
||||
|
||||
int main() {
|
||||
auto device = RHIDevice::Create();
|
||||
device->Initialize();
|
||||
return 0;
|
||||
}
|
||||
\`\`\`
|
||||
|
||||
@see RHIDevice.md
|
||||
`,
|
||||
|
||||
'RHIDevice.md': `# RHIDevice 类
|
||||
|
||||
**命名空间**: XCEngine.RHI
|
||||
|
||||
**类型**: class
|
||||
|
||||
**描述**: RHI 设备抽象基类，提供图形设备创建和管理功能。
|
||||
|
||||
## 公共方法
|
||||
|
||||
| 方法 | 描述 |
|
||||
|------|------|
|
||||
| Create() | 创建 RHI 设备实例 |
|
||||
| Initialize() | 初始化图形设备 |
|
||||
| Shutdown() | 关闭并释放设备资源 |
|
||||
|
||||
## 属性
|
||||
|
||||
| 属性 | 描述 |
|
||||
|------|------|
|
||||
| capabilities | 获取硬件能力检测结果 |
|
||||
| deviceName | 获取设备名称 |
|
||||
|
||||
## 示例代码
|
||||
|
||||
\`\`\`cpp
|
||||
using namespace XCEngine::RHI;
|
||||
|
||||
class MyDevice {
|
||||
void Init() {
|
||||
auto device = RHIDevice::Create();
|
||||
device->Initialize();
|
||||
}
|
||||
}
|
||||
\`\`\`
|
||||
|
||||
@see RHICommandQueue.md
|
||||
`,
|
||||
|
||||
'RHICommandQueue.md': `# RHICommandQueue 类
|
||||
|
||||
**命名空间**: XCEngine.RHI
|
||||
|
||||
**类型**: class
|
||||
|
||||
**描述**: 命令队列抽象，用于提交渲染命令到 GPU。
|
||||
|
||||
## 公共方法
|
||||
|
||||
| 方法 | 描述 |
|
||||
|------|------|
|
||||
| Submit() | 提交命令缓冲区到队列 |
|
||||
| Wait() | 等待队列执行完成 |
|
||||
| Signal() | 信号同步对象 |
|
||||
|
||||
## 枚举
|
||||
|
||||
| 枚举值 | 描述 |
|
||||
|--------|------|
|
||||
| Direct | 直接命令队列 |
|
||||
| Compute | 计算命令队列 |
|
||||
| Copy | 复制命令队列 |
|
||||
|
||||
## 示例代码
|
||||
|
||||
\`\`\`cpp
|
||||
RHICommandQueue* queue = device->GetCommandQueue(RHIQueueType::Direct);
|
||||
queue->Submit(commandBuffer);
|
||||
\`\`\`
|
||||
|
||||
@see RHICommandList.md
|
||||
`,
|
||||
|
||||
'RHICommandList.md': `# RHICommandList 类
|
||||
|
||||
**命名空间**: XCEngine.RHI
|
||||
|
||||
**类型**: class
|
||||
|
||||
**继承**: IRefCounter
|
||||
|
||||
**描述**: 命令列表抽象，用于记录渲染命令。
|
||||
|
||||
## 公共方法
|
||||
|
||||
| 方法 | 描述 |
|
||||
|------|------|
|
||||
| Reset() | 重置命令列表 |
|
||||
| Close() | 关闭命令列表 |
|
||||
| BeginRenderPass() | 开始渲染通道 |
|
||||
| EndRenderPass() | 结束渲染通道 |
|
||||
| Draw() | 发出绘制调用 |
|
||||
| Dispatch() | 发出计算调度 |
|
||||
|
||||
## 示例代码
|
||||
|
||||
\`\`\`cpp
|
||||
cmdList->BeginRenderPass(passDesc);
|
||||
cmdList->SetPipelineState(pso);
|
||||
cmdList->Draw(3, 1, 0, 0);
|
||||
cmdList->EndRenderPass();
|
||||
cmdList->Close();
|
||||
\`\`\`
|
||||
|
||||
@see RHIDevice.md
|
||||
`,
|
||||
|
||||
'RHITexture.md': `# RHITexture 类
|
||||
|
||||
**命名空间**: XCEngine.RHI
|
||||
|
||||
**类型**: class
|
||||
|
||||
**描述**: 纹理资源抽象，用于存储图像数据。
|
||||
|
||||
## 公共方法
|
||||
|
||||
| 方法 | 描述 |
|
||||
|------|------|
|
||||
| Create() | 创建纹理资源 |
|
||||
| Destroy() | 销毁纹理资源 |
|
||||
| Map() | 映射纹理数据到 CPU |
|
||||
| Unmap() | 取消映射 |
|
||||
|
||||
## 纹理属性
|
||||
|
||||
| 属性 | 描述 |
|
||||
|------|------|
|
||||
| width | 纹理宽度 |
|
||||
| height | 纹理高度 |
|
||||
| format | 纹理格式 |
|
||||
| mipLevels | Mipmap 级别数 |
|
||||
|
||||
## 纹理格式枚举
|
||||
|
||||
| 格式 | 描述 |
|
||||
|------|------|
|
||||
| R8G8B8A8_UNORM | 8位 RGBA |
|
||||
| R32_FLOAT | 32位单通道浮点 |
|
||||
| D32_FLOAT | 32位深度 |
|
||||
| BC7_UNORM | BC7 压缩格式 |
|
||||
|
||||
## 使用示例
|
||||
|
||||
\`\`\`cpp
|
||||
RHITextureDesc desc;
|
||||
desc.width = 1024;
|
||||
desc.height = 1024;
|
||||
desc.format = RHIFormat::R8G8B8A8_UNORM;
|
||||
desc.mipLevels = 1;
|
||||
|
||||
auto texture = device->CreateTexture(desc);
|
||||
\`\`\`
|
||||
|
||||
@see RHIDevice.md
|
||||
`,
|
||||
|
||||
'RHIBuffer.md': `# RHIBuffer 类
|
||||
|
||||
**命名空间**: XCEngine.RHI
|
||||
|
||||
**类型**: class
|
||||
|
||||
**描述**: 缓冲区资源抽象，用于存储顶点、索引、常量等数据。
|
||||
|
||||
## 缓冲区类型
|
||||
|
||||
| 类型 | 描述 |
|
||||
|------|------|
|
||||
| VertexBuffer | 顶点缓冲区 |
|
||||
| IndexBuffer | 索引缓冲区 |
|
||||
| ConstantBuffer | 常量缓冲区 |
|
||||
| ReadBackBuffer | 回读缓冲区 |
|
||||
|
||||
## 公共方法
|
||||
|
||||
| 方法 | 描述 |
|
||||
|------|------|
|
||||
| Create() | 创建缓冲区 |
|
||||
| Map() | 映射到 CPU 内存 |
|
||||
| Unmap() | 取消映射 |
|
||||
| SetData() | 设置数据 |
|
||||
|
||||
## 属性
|
||||
|
||||
| 属性 | 描述 |
|
||||
|------|------|
|
||||
| size | 缓冲区大小 |
|
||||
| usage | 缓冲区用途 |
|
||||
| stride | 数据步长 |
|
||||
|
||||
## 使用示例
|
||||
|
||||
\`\`\`cpp
|
||||
RHIBufferDesc vbDesc;
|
||||
vbDesc.size = sizeof(Vertex) * vertexCount;
|
||||
vbDesc.usage = RHIBufferUsage::VertexBuffer;
|
||||
vbDesc.stride = sizeof(Vertex);
|
||||
|
||||
auto vertexBuffer = device->CreateBuffer(vbDesc);
|
||||
vertexBuffer->SetData(vertices.data());
|
||||
\`\`\`
|
||||
|
||||
## 性能提示
|
||||
|
||||
- 对于静态数据，使用 Immutable 模式
|
||||
- 频繁更新的数据使用 Dynamic 模式
|
||||
- 大缓冲区考虑使用分页上传
|
||||
|
||||
@see RHIDevice.md @see RHICommandList.md
|
||||
`,
|
||||
}
|
||||
34
src/data/getting-started.md
Normal file
34
src/data/getting-started.md
Normal file
@@ -0,0 +1,34 @@
|
||||
# 入门指南
|
||||
|
||||
**描述**: 欢迎使用 XCEngine API 文档
|
||||
|
||||
## 快速开始
|
||||
|
||||
要开始使用 XCEngine，请按照以下步骤操作：
|
||||
|
||||
1. 初始化设备
|
||||
2. 创建命令队列
|
||||
3. 执行渲染命令
|
||||
|
||||
**命名空间**: XCEngine.RHI
|
||||
|
||||
## 系统要求
|
||||
|
||||
| 要求 | 最低版本 |
|
||||
|------|----------|
|
||||
| DirectX 12 | 12.0 |
|
||||
| OpenGL | 4.6 |
|
||||
|
||||
## 示例代码
|
||||
|
||||
```cpp
|
||||
#include <XCEngine/RHI/RHIDevice.h>
|
||||
|
||||
int main() {
|
||||
auto device = RHIDevice::Create();
|
||||
device->Initialize();
|
||||
return 0;
|
||||
}
|
||||
```
|
||||
|
||||
@see RHIDevice.md
|
||||
36
src/index.css
Normal file
36
src/index.css
Normal file
@@ -0,0 +1,36 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
:root {
|
||||
--sidebar-opacity: 0.8;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
|
||||
background-color: #1e1e1e;
|
||||
color: #d4d4d4;
|
||||
}
|
||||
|
||||
code, pre {
|
||||
font-family: 'Fira Code', 'Consolas', monospace;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: #2d2d2d;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #4a4a4a;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #5a5a5a;
|
||||
}
|
||||
236
src/lib/parser.ts
Normal file
236
src/lib/parser.ts
Normal file
@@ -0,0 +1,236 @@
|
||||
import type { ParsedDoc, DocMetadata, DocSection, DocTable, DocCodeBlock } from './types'
|
||||
|
||||
const METADATA_REGEX = /^\*\*([^\*]+)\*\*:\s*(.+)$/
|
||||
const TABLE_REGEX = /^\|(.+)\|$/
|
||||
const CODE_BLOCK_REGEX = /^```(\w*)$/
|
||||
const HEADING_REGEX = /^(#{1,6})\s+(.+)$/
|
||||
const HR_REGEX = /^---+$/
|
||||
const REFERENCE_REGEX = /@see\s+([^\s]+)/g
|
||||
|
||||
export function parseMarkdown(content: string): ParsedDoc {
|
||||
const lines = content.split('\n')
|
||||
const result: ParsedDoc = {
|
||||
title: '',
|
||||
metadata: {},
|
||||
sections: [],
|
||||
references: [],
|
||||
}
|
||||
|
||||
const references: string[] = []
|
||||
let metadata: DocMetadata = {}
|
||||
let sections: DocSection[] = []
|
||||
let currentSection: DocSection | null = null
|
||||
let currentContent: Array<{ type: 'text' | 'table' | 'code'; data: string | DocTable | DocCodeBlock }> = []
|
||||
let inCodeBlock = false
|
||||
let codeBlockLanguage = ''
|
||||
let codeBlockLines: string[] = []
|
||||
let tableBuffer: string[] = []
|
||||
let inTable = false
|
||||
|
||||
for (let i = 0; i < lines.length; i++) {
|
||||
const line = lines[i]
|
||||
const trimmedLine = line.trim()
|
||||
|
||||
const refMatch = trimmedLine.match(REFERENCE_REGEX)
|
||||
if (refMatch) {
|
||||
let match
|
||||
while ((match = REFERENCE_REGEX.exec(trimmedLine)) !== null) {
|
||||
references.push(match[1])
|
||||
}
|
||||
}
|
||||
|
||||
const codeMatch = line.match(CODE_BLOCK_REGEX)
|
||||
if (codeMatch) {
|
||||
if (currentSection) {
|
||||
currentSection.content = [...currentContent]
|
||||
sections.push(currentSection)
|
||||
currentSection = null
|
||||
}
|
||||
inCodeBlock = true
|
||||
codeBlockLanguage = codeMatch[1] || ''
|
||||
currentContent = []
|
||||
continue
|
||||
}
|
||||
|
||||
if (inCodeBlock) {
|
||||
if (trimmedLine === '```') {
|
||||
currentContent.push({
|
||||
type: 'code',
|
||||
data: { language: codeBlockLanguage, code: codeBlockLines.join('\n') },
|
||||
} as { type: 'code'; data: DocCodeBlock })
|
||||
codeBlockLines = []
|
||||
codeBlockLanguage = ''
|
||||
inCodeBlock = false
|
||||
|
||||
if (!currentSection) {
|
||||
currentSection = { title: '', level: 2, content: [] }
|
||||
}
|
||||
} else {
|
||||
codeBlockLines.push(line)
|
||||
}
|
||||
continue
|
||||
}
|
||||
|
||||
if (HR_REGEX.test(trimmedLine)) {
|
||||
if (inTable && tableBuffer.length > 0) {
|
||||
const table = parseTable(tableBuffer)
|
||||
if (table) {
|
||||
currentContent.push({ type: 'table', data: table })
|
||||
}
|
||||
tableBuffer = []
|
||||
inTable = false
|
||||
}
|
||||
continue
|
||||
}
|
||||
|
||||
if (!result.title && line.startsWith('# ')) {
|
||||
result.title = line.slice(2).trim()
|
||||
continue
|
||||
}
|
||||
|
||||
const headingMatch = line.match(HEADING_REGEX)
|
||||
if (headingMatch) {
|
||||
if (currentSection) {
|
||||
currentSection.content = [...currentContent]
|
||||
sections.push(currentSection)
|
||||
}
|
||||
const level = headingMatch[1].length
|
||||
const title = headingMatch[2].trim()
|
||||
currentSection = { title, level, content: [] }
|
||||
currentContent = []
|
||||
inTable = false
|
||||
tableBuffer = []
|
||||
continue
|
||||
}
|
||||
|
||||
const metaMatch = trimmedLine.match(METADATA_REGEX)
|
||||
if (metaMatch) {
|
||||
const key = metaMatch[1].toLowerCase()
|
||||
const value = metaMatch[2].trim()
|
||||
if (key === 'namespace') metadata.namespace = value
|
||||
else if (key === 'description') metadata.description = value
|
||||
else if (key === 'type') metadata.type = value
|
||||
else if (key === 'inherits') metadata.inherits = value
|
||||
else if (key === 'package') metadata.package = value
|
||||
continue
|
||||
}
|
||||
|
||||
const tableMatch = line.match(TABLE_REGEX)
|
||||
if (tableMatch) {
|
||||
const isSeparator = /^[\s|*-]+$/.test(trimmedLine.replace(/\|/g, '').trim())
|
||||
if (!isSeparator) {
|
||||
tableBuffer.push(trimmedLine)
|
||||
inTable = true
|
||||
} else {
|
||||
inTable = true
|
||||
}
|
||||
continue
|
||||
} else if (inTable && tableBuffer.length > 0) {
|
||||
const table = parseTable(tableBuffer)
|
||||
if (table) {
|
||||
currentContent.push({ type: 'table', data: table })
|
||||
}
|
||||
tableBuffer = []
|
||||
inTable = false
|
||||
}
|
||||
|
||||
if (trimmedLine) {
|
||||
currentContent.push({ type: 'text', data: trimmedLine })
|
||||
}
|
||||
}
|
||||
|
||||
if (currentSection) {
|
||||
currentSection.content = [...currentContent]
|
||||
sections.push(currentSection)
|
||||
}
|
||||
|
||||
result.metadata = metadata
|
||||
result.sections = sections
|
||||
result.references = references
|
||||
|
||||
return result
|
||||
}
|
||||
|
||||
function parseTable(tableLines: string[]): DocTable | null {
|
||||
if (tableLines.length < 1) return null
|
||||
|
||||
const headers = tableLines[0].split('|').filter(h => h.trim()).map(h => h.trim())
|
||||
const rows: string[][] = []
|
||||
|
||||
for (let i = 1; i < tableLines.length; i++) {
|
||||
const line = tableLines[i]
|
||||
const isSeparator = /^[\s|*-]+$/.test(line.replace(/\|/g, '').trim())
|
||||
if (isSeparator) continue
|
||||
|
||||
const cells = line.split('|').filter(c => c.trim()).map(c => c.trim())
|
||||
if (cells.length > 0) {
|
||||
rows.push(cells)
|
||||
}
|
||||
}
|
||||
|
||||
return { headers, rows }
|
||||
}
|
||||
|
||||
export function getDisplayName(filename: string): string {
|
||||
const name = filename.replace(/\.md$/, '')
|
||||
return name
|
||||
}
|
||||
|
||||
export function buildFileTree(files: string[], basePath: string): import('./types').DocFile[] {
|
||||
const tree: Map<string, import('./types').DocFile> = new Map()
|
||||
|
||||
for (const file of files) {
|
||||
const relativePath = file.replace(basePath, '').replace(/^[/\\]/, '')
|
||||
const parts = relativePath.split(/[/\\]/)
|
||||
|
||||
let currentPath = ''
|
||||
for (let i = 0; i < parts.length; i++) {
|
||||
const part = parts[i]
|
||||
const isLast = i === parts.length - 1
|
||||
currentPath = currentPath ? `${currentPath}/${part}` : part
|
||||
|
||||
if (!tree.has(currentPath)) {
|
||||
tree.set(currentPath, {
|
||||
name: part,
|
||||
path: `${basePath}/${currentPath}`,
|
||||
relativePath: currentPath,
|
||||
isDir: !isLast,
|
||||
children: isLast ? undefined : [],
|
||||
})
|
||||
}
|
||||
|
||||
const parentPath = currentPath.split('/').slice(0, -1).join('/')
|
||||
if (parentPath && tree.has(parentPath)) {
|
||||
const parent = tree.get(parentPath)!
|
||||
if (parent.children) {
|
||||
const existing = parent.children.find(c => c.name === part)
|
||||
if (!existing) {
|
||||
parent.children.push(tree.get(currentPath)!)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const rootFiles: import('./types').DocFile[] = []
|
||||
for (const [path, file] of tree) {
|
||||
const parentPath = path.split('/').slice(0, -1).join('/')
|
||||
if (!parentPath) {
|
||||
rootFiles.push(file)
|
||||
}
|
||||
}
|
||||
|
||||
const sortFiles = (files: import('./types').DocFile[]): import('./types').DocFile[] => {
|
||||
return files.sort((a, b) => {
|
||||
if (a.isDir !== b.isDir) return a.isDir ? -1 : 1
|
||||
return a.name.localeCompare(b.name)
|
||||
}).map(f => {
|
||||
if (f.children) {
|
||||
f.children = sortFiles(f.children)
|
||||
}
|
||||
return f
|
||||
})
|
||||
}
|
||||
|
||||
return sortFiles(rootFiles)
|
||||
}
|
||||
38
src/lib/types.ts
Normal file
38
src/lib/types.ts
Normal file
@@ -0,0 +1,38 @@
|
||||
export interface DocFile {
|
||||
name: string
|
||||
path: string
|
||||
relativePath: string
|
||||
isDir: boolean
|
||||
children?: DocFile[]
|
||||
}
|
||||
|
||||
export interface DocMetadata {
|
||||
namespace?: string
|
||||
description?: string
|
||||
type?: string
|
||||
inherits?: string
|
||||
package?: string
|
||||
}
|
||||
|
||||
export interface DocTable {
|
||||
headers: string[]
|
||||
rows: string[][]
|
||||
}
|
||||
|
||||
export interface DocCodeBlock {
|
||||
language: string
|
||||
code: string
|
||||
}
|
||||
|
||||
export interface DocSection {
|
||||
title: string
|
||||
level: number
|
||||
content: Array<{ type: 'text' | 'table' | 'code'; data: string | DocTable | DocCodeBlock }>
|
||||
}
|
||||
|
||||
export interface ParsedDoc {
|
||||
title: string
|
||||
metadata: DocMetadata
|
||||
sections: DocSection[]
|
||||
references: string[]
|
||||
}
|
||||
10
src/main.tsx
Normal file
10
src/main.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import React from 'react'
|
||||
import ReactDOM from 'react-dom/client'
|
||||
import App from './App'
|
||||
import './index.css'
|
||||
|
||||
ReactDOM.createRoot(document.getElementById('root')!).render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>,
|
||||
)
|
||||
11
tailwind.config.js
Normal file
11
tailwind.config.js
Normal file
@@ -0,0 +1,11 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: [
|
||||
"./index.html",
|
||||
"./src/**/*.{js,ts,jsx,tsx}",
|
||||
],
|
||||
theme: {
|
||||
extend: {},
|
||||
},
|
||||
plugins: [],
|
||||
}
|
||||
25
tsconfig.json
Normal file
25
tsconfig.json
Normal file
@@ -0,0 +1,25 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2020",
|
||||
"useDefineForClassFields": true,
|
||||
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||
"module": "ESNext",
|
||||
"skipLibCheck": true,
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"noEmit": true,
|
||||
"jsx": "react-jsx",
|
||||
"strict": true,
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"noFallthroughCasesInSwitch": true,
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["src/*"]
|
||||
}
|
||||
},
|
||||
"include": ["src"],
|
||||
"references": [{ "path": "./tsconfig.node.json" }]
|
||||
}
|
||||
11
tsconfig.node.json
Normal file
11
tsconfig.node.json
Normal file
@@ -0,0 +1,11 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"skipLibCheck": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "bundler",
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"strict": true
|
||||
},
|
||||
"include": ["vite.config.ts"]
|
||||
}
|
||||
16
vite.config.ts
Normal file
16
vite.config.ts
Normal file
@@ -0,0 +1,16 @@
|
||||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
import path from 'path'
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': path.resolve(__dirname, './src'),
|
||||
},
|
||||
},
|
||||
server: {
|
||||
port: 3001,
|
||||
strictPort: false,
|
||||
},
|
||||
})
|
||||
Reference in New Issue
Block a user