diff --git a/src/renderer/src/components/ui/kbd/Kbd.tsx b/src/renderer/src/components/ui/kbd/Kbd.tsx index 2d10bfc27b..7ceade4a28 100644 --- a/src/renderer/src/components/ui/kbd/Kbd.tsx +++ b/src/renderer/src/components/ui/kbd/Kbd.tsx @@ -2,6 +2,7 @@ import { cn, getOS } from "@renderer/lib/utils" import type { FC } from "react" import { Fragment, memo } from "react" import * as React from "react" +import { isHotkeyPressed } from "react-hotkeys-hook" const SharedKeys = { backspace: "⌫", @@ -69,15 +70,33 @@ export const KbdCombined: FC<{ ) } - export const Kbd: FC<{ children: string, className?: string }> = memo( ({ children, className }) => { let specialKeys = (SpecialKeys as any)[os] as Record specialKeys = { ...SharedKeys, ...specialKeys } + const [isKeyPressed, setIsKeyPressed] = React.useState(false) + React.useEffect(() => { + const handler = () => { + setIsKeyPressed(isHotkeyPressed(children.toLowerCase())) + } + document.addEventListener("keydown", handler) + document.addEventListener("keyup", handler) + + return () => { + document.removeEventListener("keydown", handler) + document.removeEventListener("keyup", handler) + } + }, [children]) + return ( {children.split("+").map((key_) => { let key: string = key_.toLowerCase() diff --git a/src/renderer/src/components/ui/tooltip/index.tsx b/src/renderer/src/components/ui/tooltip/index.tsx index e275cea74d..231e4fd5db 100644 --- a/src/renderer/src/components/ui/tooltip/index.tsx +++ b/src/renderer/src/components/ui/tooltip/index.tsx @@ -38,7 +38,7 @@ const TooltipContent = React.forwardRef< }} > {/* https://github.com/radix-ui/primitives/discussions/868 */} - + {props.children}