组件 · 通用

Kbd 键盘按键

展示键盘快捷键的键帽样式文本。

入口 @selrux/ui/kbd · 源码 src/components/kbd/index.ts · 2 个组件 · 发布状态 preview

使用建议

避免：用 Kbd 代替真实 <kbd> 无障碍需求时不说明
限制：属性与导出以 @selrux/ui 对应子路径 d.ts/源码为准，禁止臆造

引入

tsx

import { Kbd, KbdGroup } from '@selrux/ui/kbd';

演练场

调节下方可实现的字面量属性，实时预览真实组件。函数、Portal、样式逃生口等见代码演示与 API 表。

⌘K

代码演示

基础用法

展示单个按键。

EscEnter⌘

组合键

KbdGroup 包裹多个按键。

CtrlShiftP

尺寸

size 六档。

xssmmdlgxl2xl

组合尺寸

KbdGroup 的 size 统一组内按键尺寸。

CtrlShiftPCtrlShiftPCtrlShiftP

API

属性覆盖：示例用到 2 / 2 个自有属性（100%）

由 scripts/demo-coverage.mjs 统计，不含 className / style / 原生透传属性与纯转发事件。

Kbd

主题化键盘按键。

属性	说明	类型	默认值
`size`	-	`"xs" \| "sm" \| "md" \| "lg" \| "xl" \| "2xl"`	-

另有 280 项原生属性与事件继承自 HTMLAttributes，原样透传。

KbdGroup

主题化快捷键分组。

属性	说明	类型	默认值
`size`	-	`"xs" \| "sm" \| "md" \| "lg" \| "xl" \| "2xl"`	-