30 lines
770 B
TypeScript
30 lines
770 B
TypeScript
import type { ReactNode } from 'react'
|
|
|
|
/**
|
|
* 文档的一节：锚点 + 标题 + 说明。
|
|
*
|
|
* 每个组件一节，节内再用 Demo 摆具体用法，方便直接翻着找。
|
|
*/
|
|
type SectionProps = {
|
|
/** 锚点 id，与左侧目录一致 */
|
|
id: string
|
|
title: string
|
|
/** 右侧灰字，通常写组件名或导出路径 */
|
|
api?: string
|
|
desc?: ReactNode
|
|
children: ReactNode
|
|
}
|
|
|
|
export function Section({ id, title, api, desc, children }: SectionProps) {
|
|
return (
|
|
<section id={id} className="doc-section">
|
|
<div className="doc-section-title">
|
|
<h2>{title}</h2>
|
|
{api !== undefined && <code>{api}</code>}
|
|
</div>
|
|
{desc !== undefined && <p className="doc-section-desc">{desc}</p>}
|
|
{children}
|
|
</section>
|
|
)
|
|
}
|