Skip to content

Commit 24edcfc

Browse files
committed
Add types modal scaffold
1 parent 2d3b660 commit 24edcfc

File tree

19 files changed

+316
-155
lines changed

19 files changed

+316
-155
lines changed

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
"start": "env NODE_ENV=development ts-node -r tsconfig-paths/register devServer.ts"
1515
},
1616
"dependencies": {
17-
"@date-fns/docs": "0.12.1",
17+
"@date-fns/docs": "0.14.0",
1818
"@sentry/browser": "^5.30.0",
1919
"@sentry/tracing": "^5.30.0",
2020
"@switcher/preact": "2.3.0",
Lines changed: 35 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { ComponentChildren, FunctionComponent, h } from 'preact'
1+
import { ComponentChildren, FunctionComponent, h, Fragment } from 'preact'
22
import { DocHeaderAnchor } from '~/ui/components/DocHeaderAnchor'
33
import { Markdown } from '~/ui/components/Markdown'
44

@@ -9,33 +9,44 @@ interface ReturnType {
99

1010
interface Props {
1111
returns: ReturnType[]
12+
header?: 'h2' | 'h3'
1213
}
1314

14-
export const DocReturns: FunctionComponent<Props> = ({ returns }) => (
15-
<section>
16-
<h2 id="returns">
15+
export const DocReturns: FunctionComponent<Props> = ({ returns, header }) => {
16+
const headerContent = (
17+
<>
1718
Returns
1819
<DocHeaderAnchor anchor="returns" />
19-
</h2>
20+
</>
21+
)
2022

21-
<table>
22-
<thead>
23-
<tr>
24-
<th>Type</th>
25-
<th>Description</th>
26-
</tr>
27-
</thead>
23+
return (
24+
<section>
25+
{header === 'h2' ? (
26+
<h2 id="returns">{headerContent}</h2>
27+
) : (
28+
<h3 id="returns">{headerContent}</h3>
29+
)}
2830

29-
<tbody>
30-
{returns.map((returnData, index) => (
31-
<tr key={index}>
32-
<td>{returnData.type}</td>
33-
<td>
34-
<Markdown value={returnData.description} />
35-
</td>
31+
<table>
32+
<thead>
33+
<tr>
34+
<th>Type</th>
35+
<th>Description</th>
3636
</tr>
37-
))}
38-
</tbody>
39-
</table>
40-
</section>
41-
)
37+
</thead>
38+
39+
<tbody>
40+
{returns.map((returnData, index) => (
41+
<tr key={index}>
42+
<td>{returnData.type}</td>
43+
<td>
44+
<Markdown value={returnData.description} />
45+
</td>
46+
</tr>
47+
))}
48+
</tbody>
49+
</table>
50+
</section>
51+
)
52+
}

src/ui/components/DocParams/index.tsx renamed to src/ui/components/JSDocParams/index.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ interface Props {
77
params: DateFnsDocs.JSDocParam[]
88
}
99

10-
export const DocParams: FunctionComponent<Props> = ({ params }) => (
10+
export const JSDocParams: FunctionComponent<Props> = ({ params }) => (
1111
<>
1212
{params.map((param, index) => (
1313
<tr key={index}>
@@ -55,7 +55,7 @@ const ParamPropsTable: FunctionComponent<{
5555
</thead>
5656

5757
<tbody>
58-
<DocParams params={props} />
58+
<JSDocParams params={props} />
5959
</tbody>
6060
</table>
6161
</div>
File renamed without changes.

src/ui/components/DocType/index.tsx renamed to src/ui/components/TSDocType/index.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ interface Props {
55
type: SomeType
66
}
77

8-
export const DocType: FunctionComponent<Props> = ({ type }) => {
8+
export const TSDocType: FunctionComponent<Props> = ({ type }) => {
99
// console.log({ type })
1010

1111
switch (type.type) {
@@ -16,7 +16,7 @@ export const DocType: FunctionComponent<Props> = ({ type }) => {
1616
return (
1717
<span>
1818
Array{'<'}
19-
<DocType type={type.elementType} />
19+
<TSDocType type={type.elementType} />
2020
{'>'}
2121
</span>
2222
)

src/ui/screens/Docs/Doc/JSDoc/Arguments/index.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { h, FunctionComponent } from 'preact'
22
import type { DateFnsDocs } from '@date-fns/docs/types'
3-
import { DocParams } from '~/ui/components/DocParams'
3+
import { JSDocParams } from '~/ui/components/JSDocParams'
44
import { DocHeaderAnchor } from '~/ui/components/DocHeaderAnchor'
55

66
interface Props {
@@ -24,7 +24,7 @@ export const Arguments: FunctionComponent<Props> = ({ args }) => (
2424
</thead>
2525

2626
<tbody>
27-
<DocParams params={args} />
27+
<JSDocParams params={args} />
2828
</tbody>
2929
</table>
3030
</section>

src/ui/screens/Docs/Doc/JSDoc/Properties/index.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { h, FunctionComponent } from 'preact'
22
import type { DateFnsDocs } from '@date-fns/docs/types'
3-
import { DocParams } from '~/ui/components/DocParams'
3+
import { JSDocParams } from '~/ui/components/JSDocParams'
44
import { DocHeaderAnchor } from '~/ui/components/DocHeaderAnchor'
55

66
interface Props {
@@ -24,7 +24,7 @@ export const Properties: FunctionComponent<Props> = ({ properties }) => (
2424
</thead>
2525

2626
<tbody>
27-
<DocParams params={properties} />
27+
<JSDocParams params={properties} />
2828
</tbody>
2929
</table>
3030
</section>
Lines changed: 59 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,67 @@
1-
import { h, FunctionComponent } from 'preact'
1+
import { h, FunctionComponent, Fragment } from 'preact'
22
import type { DateFnsDocs } from '@date-fns/docs/types'
3-
import { DocParams } from '~/ui/components/DocParams'
43
import { DocHeaderAnchor } from '~/ui/components/DocHeaderAnchor'
4+
import type { ParameterReflection } from 'typedoc'
5+
import { TSDocType } from '~/ui/components/TSDocType'
6+
import { Markdown } from '~/ui/components/Markdown'
7+
import { joinCommentParts } from '@date-fns/docs/utils'
8+
import * as styles from './styles.css'
59

610
interface Props {
7-
args: DateFnsDocs.JSDocParam[]
11+
args: ParameterReflection[]
12+
header: 'h2' | 'h3'
813
}
914

10-
export const Arguments: FunctionComponent<Props> = ({ args }) => (
11-
<section>
12-
<h2 id="arguments">
15+
export const Arguments: FunctionComponent<Props> = ({ args, header }) => {
16+
const headerContent = (
17+
<>
1318
Arguments
1419
<DocHeaderAnchor anchor="arguments" />
15-
</h2>
16-
17-
<table>
18-
<thead>
19-
<tr>
20-
<th>Name</th>
21-
<th>Type</th>
22-
<th>Description</th>
23-
</tr>
24-
</thead>
25-
26-
<tbody>
27-
<DocParams params={args} />
28-
</tbody>
29-
</table>
30-
</section>
31-
)
20+
</>
21+
)
22+
23+
return (
24+
<section>
25+
{header === 'h2' ? (
26+
<h2 id="arguments">{headerContent}</h2>
27+
) : (
28+
<h3 id="arguments">{headerContent}</h3>
29+
)}
30+
31+
<table>
32+
<thead>
33+
<tr>
34+
<th>Name</th>
35+
<th>Type</th>
36+
<th>Description</th>
37+
</tr>
38+
</thead>
39+
40+
<tbody>
41+
{args.map((arg, index) => (
42+
<tr key={index}>
43+
<td>
44+
{arg.name}
45+
46+
{arg.flags.isOptional && (
47+
<div class={styles.optionalLabel}>(optional)</div>
48+
)}
49+
</td>
50+
51+
<td>{arg.type && <TSDocType type={arg.type} />}</td>
52+
53+
<td>
54+
{arg.comment?.summary && (
55+
<Markdown value={joinCommentParts(arg.comment.summary)} />
56+
)}
57+
<code>
58+
<pre>{JSON.stringify(arg, null, 2)}</pre>
59+
</code>
60+
</td>
61+
</tr>
62+
))}
63+
</tbody>
64+
</table>
65+
</section>
66+
)
67+
}
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import { style } from '@vanilla-extract/css'
2+
3+
export const optionalLabel = style({
4+
fontStyle: 'italic',
5+
})

src/ui/screens/Docs/Doc/TSDoc/Exceptions/index.tsx

Lines changed: 0 additions & 37 deletions
This file was deleted.

0 commit comments

Comments
 (0)