mcpField
H
hotkey

hotkey

github.com/lobehub开发83.6k4.1k 次安装今天更新
代码仓库

关于 hotkey

面向开发者的键盘快捷键添加指南,说明如何修改常量、注册配置、翻译和 Hook,并可选择补充提示气泡。

主要功能

  1. 01添加快捷键标识符
  2. 02注册默认快捷键
  3. 03添加本地化标题和说明
  4. 04创建并注册 Hook
  5. 05可选添加提示气泡
  6. 06检查作用域和按键冲突

适用场景

  1. 01为聊天操作添加快捷键
  2. 02让快捷键显示在设置中
  3. 03排查快捷键未触发的问题

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/lobehub/lobehub --skill hotkey

安装后在 Claude Code 中输入/hotkey确认已加载。

详细介绍

添加键盘快捷键指南

添加新快捷键的步骤

1. 更新快捷键常量

在 packages/types/src/hotkey.ts 中,将新 ID 添加到 HotkeyId 联合类型中——这是 HotkeyEnum 所依据的类型来源:

export type HotkeyId =
  | 'addUserMessage'
  // existing...
  | 'saveTopic';
2. 注册默认快捷键

在 packages/const/src/hotkeys.ts 中,KeyEnum 和 combineKeys 已在此文件中本地定义,因此无需导入——将条目添加到 HotkeyEnum 和 HOTKEYS_REGISTRATION 中:

export const HotkeyEnum = {
  // existing...
  SaveTopic: 'saveTopic',
} as const satisfies Record<string, HotkeyId>;

export const HOTKEYS_REGISTRATION: HotkeyRegistration = [
  // existing...
  {
    group: HotkeyGroupEnum.Conversation,
    id: HotkeyEnum.SaveTopic,
    keys: combineKeys([KeyEnum.Alt, 'n']),
    scopes: [HotkeyScopeEnum.Chat],
  },
];
3. 添加 i18n 翻译

在 packages/locales/src/default/hotkey.ts 中:

const hotkey: HotkeyI18nTranslations = {
  saveTopic: {
    desc: '保存当前话题并新建一个话题',
    title: '保存话题',
  },
};
4. 创建并注册 Hook

在 src/hooks/useHotkeys/chatScope.ts 中:

export const useSaveTopicHotkey = () => {
  const openNewTopicOrSaveTopic = useChatStore((s) => s.openNewTopicOrSaveTopic);
  return useHotkeyById(HotkeyEnum.SaveTopic, openNewTopicOrSaveTopic);
};

export const useRegisterChatHotkeys = () => {
  useSaveTopicHotkey();
  // ...other hotkeys
};
5. 添加工具提示(可选)
const saveTopicHotkey = useUserStore(settingsSelectors.getHotkeyById(HotkeyEnum.SaveTopic));

<Tooltip hotkey={saveTopicHotkey} title={t('saveTopic.title', { ns: 'hotkey' })}>
  <Button icon={<SaveOutlined />} onClick={openNewTopicOrSaveTopic} />
</Tooltip>;

最佳实践

  1. 作用域:根据功能选择全局作用域或聊天作用域
  2. 分组:将其放入合适的分组中(系统/布局/对话)
  3. 冲突检查:确保不会与系统或浏览器快捷键冲突
  4. 平台:使用 KeyEnum.Mod,而不是硬编码 Ctrl 或 Cmd
  5. 清晰的说明:为用户提供标题和说明

故障排除

  • 无法使用:检查作用域和 RegisterHotkeys hook
  • 设置中未显示:检查 HOTKEYS_REGISTRATION 配置
  • 冲突:HotkeyInput 组件会显示警告
  • 特定页面无效:确保已激活正确的作用域

评论

支持 Markdown