网站
SiteNavigation - 网站导航
响应式导航，以及明确的语言和外观选项。
用法
什么时候用它
使用具名导航区域，并为移动端提供支持键盘操作的抽屉。
来自@misoto22/folio/website
import { SiteNavigation } from '@misoto22/folio/website'说明
公开网站的页首导航，配有支持键盘操作的移动端导航抽屉。
实践建议
推荐
- 提供本地化标签、含义明确的链接和有用的图片替代文本。
避免
- 不要在展示组件中放入服务凭据、路由逻辑或后端模型。
示例
导航与阅读偏好
导航接收真实链接元素，以及由应用控制的语言偏好。缩窄画布后，可以操作移动端抽屉及其本地化关闭按钮。
组成部分
在调用处组合，而不是通过 props 配置——所以这个组件没有预料到的布局，依然表达得出来。
NavigationSearchTrigger
始终可见的搜索入口，显示键盘快捷键，并在小屏幕上采用紧凑尺寸。
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| label必填 | string | — | |
| onClick必填 | () => void | — | |
| shortcut | string | '⌘ K' | — |
PreferenceMenu
用于选择一项持久阅读偏好的紧凑具名控件。
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| icon必填 | ReactNode | — | |
| label必填 | string | — | |
| onValueChange必填 | (value: string) => void | — | |
| options必填 | { value: string; label: string; icon?: ReactNode }[] | — | |
| value必填 | string | — | |
| disabled | boolean | — |