Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 | 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 17x 17x 17x 17x 17x 17x 17x 17x 17x 17x 17x 17x 17x 1x 1x 1x 1x 1x 1x 1x 1x 1x 17x 17x 17x 1x 1x | import { withInjectables } from "@ogre-tools/injectable-react";
import React, { useEffect } from "react";
import invokeShortcutInjectable, { InvokeShortcut } from "./invoke-shortcut.injectable";
export interface KeyboardShortcutListenerProps {
children: React.ReactNode;
}
interface Dependencies {
invokeShortcut: InvokeShortcut;
}
const NonInjectedKeyboardShortcutListener = ({
children,
invokeShortcut,
}: KeyboardShortcutListenerProps & Dependencies) => {
useEffect(() => {
document.addEventListener("keydown", invokeShortcut);
return () => {
document.removeEventListener("keydown", invokeShortcut);
};
});
return <>{children}</>;
};
export const KeyboardShortcutListener = withInjectables<
Dependencies,
KeyboardShortcutListenerProps
>(
NonInjectedKeyboardShortcutListener,
{
getProps: (di, props) => ({
invokeShortcut: di.inject(invokeShortcutInjectable),
...props,
}),
},
);
|