网站
SearchPalette - 搜索面板
在一个无障碍弹窗内展示搜索结果、操作和详情。
用法
什么时候用它
传入已经筛选的结果，由组件负责组合框和焦点行为。
来自@misoto22/folio/website
import { SearchPalette } from '@misoto22/folio/website'说明
在一个无障碍弹窗内组合搜索、操作和可选的结果详情。
实践建议
推荐
- 提供本地化标签、含义明确的链接和有用的图片替代文本。
避免
- 不要在展示组件中放入服务凭据、路由逻辑或后端模型。
示例
应用筛选的搜索结果
应用筛选条目并处理选择，搜索面板负责弹窗焦点和键盘导航。关闭后，焦点回到打开面板的按钮。
Nothing selected
组成部分
在调用处组合，而不是通过 props 配置——所以这个组件没有预料到的布局，依然表达得出来。
SearchExcerpt
将查询高亮渲染为文本，不接受使用方提供的 HTML。
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| segments必填 | ReadonlyArray<{ text: string; highlighted: boolean }> | — |