Skip to content

Commit 93c3d3e

Browse files
Update doc site to handle typescript files (#1611)
Resolves #1607
1 parent 274f0a4 commit 93c3d3e

File tree

2 files changed

+50
-21
lines changed

2 files changed

+50
-21
lines changed

docs/components/PropsTable.tsx

Lines changed: 44 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -3,23 +3,34 @@ import { Table, Pane, majorScale, Paragraph, Badge, Text, Heading } from 'evergr
33
import InlineCode from './MDX/renderers/InlineCode'
44

55
interface Props {
6-
data: any
6+
data: {
7+
displayName: string
8+
props: Record<string, PropDefinition>
9+
}
710
}
811

9-
const resolveReadableType: (type: any) => string = (type) => {
10-
switch (type.name) {
11-
case 'enum':
12-
return type.value.map(({ value }: { value: string }) => value).join(' | ')
13-
case 'union':
14-
return type.value.map((subType: any) => resolveReadableType(subType)).join(' | ')
15-
case 'custom':
16-
return type.raw
17-
default:
18-
return type.name
19-
}
12+
interface PropDefinition {
13+
description: string
14+
required: boolean
15+
type?: PropType
16+
tsType?: PropType
2017
}
2118

22-
const COLUMNS = ['Property', 'Type', 'Description'] as const
19+
type PropType =
20+
| {
21+
name: 'enum'
22+
value: Array<{ value: string }>
23+
}
24+
| {
25+
name: 'union'
26+
value: PropType[]
27+
}
28+
| {
29+
name: 'custom' | 'signature'
30+
raw: string
31+
}
32+
33+
const COLUMNS = ['Property', 'Type', 'Description']
2334

2435
const PropsTable: React.FC<Props> = ({ data }) => {
2536
const { displayName, props } = data
@@ -38,18 +49,17 @@ const PropsTable: React.FC<Props> = ({ data }) => {
3849
</Table.Head>
3950
<Table.Body>
4051
{Object.keys(props).map((prop) => {
41-
const { type, required, description } = props[prop]
52+
const { type, tsType, required, description } = props[prop]
4253
return (
4354
<Table.Row key={prop} minHeight={64} height="unset" paddingY={majorScale(2)}>
4455
<Table.Cell>
4556
<Pane display="flex" alignItems="center">
4657
<InlineCode>{prop}</InlineCode>
47-
{/* <Heading size={400}>{prop}</Heading> */}
4858
{required && <Badge marginLeft={majorScale(2)}>Required</Badge>}
4959
</Pane>
5060
</Table.Cell>
5161
<Table.Cell>
52-
<Text>{resolveReadableType(type)}</Text>
62+
<InlineCode>{resolveReadableType(tsType ?? type)}</InlineCode>
5363
</Table.Cell>
5464
<Table.Cell>
5565
<Paragraph>{description}</Paragraph>
@@ -66,4 +76,22 @@ const PropsTable: React.FC<Props> = ({ data }) => {
6676
)
6777
}
6878

79+
const resolveReadableType = (type: PropType | undefined): string => {
80+
if (type == null) {
81+
return 'unknown'
82+
}
83+
84+
switch (type.name) {
85+
case 'enum':
86+
return type.value.map(({ value }) => value).join(' | ')
87+
case 'union':
88+
return type.value.map((subType: PropType) => resolveReadableType(subType)).join(' | ')
89+
case 'custom':
90+
case 'signature':
91+
return type.raw
92+
default:
93+
return (type as { name: string }).name
94+
}
95+
}
96+
6997
export default PropsTable

docs/lib/component-docs.ts

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,14 @@ const getComponentDocs = async (stem: string): Promise<any[]> => {
1212
})
1313

1414
const props = await Promise.all(
15-
componentFiles.map(async (name) => {
16-
const data = await fs.readFileSync(path.join(stem, name)).toString()
15+
componentFiles.map((name) => {
16+
const filename = path.join(stem, name)
17+
const data = fs.readFileSync(filename).toString()
1718
try {
18-
const propsData = docgen.parse(data)
19+
const propsData = docgen.parse(data, undefined, undefined, { filename })
1920
return propsData
20-
} catch (e) {
21-
console.error('There was an error parsing component documentation', e)
21+
} catch (error) {
22+
console.error(`Error parsing component documentation for ${filename}\n`, error)
2223
return []
2324
}
2425
})

0 commit comments

Comments
 (0)