Select a document from the sidebar
+{doc.metadata.namespace}
+ {doc.metadata.package}
+ {doc.metadata.inherits}
+ {doc.metadata.description}
+ )} + + {doc.sections.map((section, idx) => ( + + ))} + + {doc.references.length > 0 && ( +{renderText()}
+} + +const TableContent = ({ table }: { table: DocTable }) => { + if (!table.headers.length || !table.rows.length) return null + + return ( +| + {header} + | + ))} +
|---|
| + {cell} + | + ))} +
+
+ {code.code}
+
+
+ )
+}
diff --git a/src/components/DocTree.tsx b/src/components/DocTree.tsx
new file mode 100644
index 0000000..9507936
--- /dev/null
+++ b/src/components/DocTree.tsx
@@ -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 (
+