这里按消费者实际会使用的组件组织文档。每个公开组件只有一个一级页面，子功能、Props、核心数据契约和注意事项都写在组件页内，不另设多层文章来演示侧边栏。
所有公开组件从 @uichat-mira/folio 导入，样式统一来自 @uichat-mira/folio/styles.css。以下描述以当前开发源码已实现的能力为准。
组件索引#
| 组件 | 功能与详细说明 |
|---|---|
| FolioApp | 应用入口、路由、UI 配置、FolioSlots 及导航插槽 |
| FolioHeader | 全局导航、菜单、搜索与主题按钮 |
| FolioFooter | 结构化页脚、品牌、深浅色 Logo、链接分组和法律字段 |
| FolioDocsShell | 文档阅读布局、移动抽屉与组合式分页 |
| FolioDocMeta | Git 创建／更新日期及人员，Frontmatter 可独立覆写 |
| FolioPageNav | 独立的上一篇／下一篇展示组件，排序由调用者提供 |
| FolioTreeNav | 统一左侧导航、Core 内容树、父级推导和排序 |
| FolioToc | 当前文章的标题锚点与滚动高亮 |
| FolioMarkdown | Markdown 阅读与 Mermaid 浏览器增强 |
| FolioUtilityPopover | 可关闭的轻量信息浮层 |
| FolioShareButton | 浏览器分享与复制链接 |
公共组件与 Core 能力的关系#
FolioTreeNav 负责渲染侧栏；buildFolioNavigationTree()、buildFolioContentTree()、resolveFolioProjectTree() 和 getFolioTreeNeighbors() 则属于可独立使用的 Core 函数。这些契约集中写在 FolioTreeNav 中，不会伪装成另外几个 React 组件。
同样，FolioFooterBrand、FolioFooterGroup、FolioFooterLegal 是 Footer 的结构化配置类型，不需要各自独立占一个文档页面；FolioSlots 是 FolioApp 的扩展点。
使用边界#
- 分类
collection / section与内容父子路由由 Core 推导；组件目录保持平铺，并不影响 Folio 支持多级导航的能力。 - 左侧
FolioTreeNav是站点内容导航，右侧FolioToc是页内标题目录；它们不是同一个组件。 - 文档与项目文章共用阅读布局，
ui.footerOnDocs: false可隐藏这类阅读页面的站点 Footer 与正文articleFooter；不影响首页和普通文章。 - 组件级样式文件不是独立的公开 CSS 入口。消费站需要的品牌物料、具体链接与法律信息仍由消费站提供。
- 此处的接口为当前开发分支的实际实现，不应被误读为已经发布的 npm 包一定包含全部能力。
需要站点整体配置，请从 Folio 配置指南 开始。