Spaces:
Runtime error
Runtime error
File size: 3,059 Bytes
2e1ab99 c0a9bce 2e1ab99 c0a9bce 2e1ab99 c0a9bce 2e1ab99 c0a9bce 2e1ab99 |
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 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 |
import { useStore } from '@nanostores/react';
import { useEffect } from 'react';
import { shortcutsStore, type Shortcuts } from '~/lib/stores/settings';
import { isMac } from '~/utils/os';
// List of keys that should not trigger shortcuts when typing in input/textarea
const INPUT_ELEMENTS = ['input', 'textarea'];
class ShortcutEventEmitter {
#emitter = new EventTarget();
dispatch(type: keyof Shortcuts) {
this.#emitter.dispatchEvent(new Event(type));
}
on(type: keyof Shortcuts, cb: VoidFunction) {
this.#emitter.addEventListener(type, cb);
return () => {
this.#emitter.removeEventListener(type, cb);
};
}
}
export const shortcutEventEmitter = new ShortcutEventEmitter();
export function useShortcuts(): void {
const shortcuts = useStore(shortcutsStore);
useEffect(() => {
const handleKeyDown = (event: KeyboardEvent): void => {
// Don't trigger shortcuts when typing in input fields
if (
document.activeElement &&
INPUT_ELEMENTS.includes(document.activeElement.tagName.toLowerCase()) &&
!event.altKey && // Allow Alt combinations even in input fields
!event.metaKey && // Allow Cmd/Win combinations even in input fields
!event.ctrlKey // Allow Ctrl combinations even in input fields
) {
return;
}
// Debug logging in development only
if (process.env.NODE_ENV === 'development') {
console.log('Key pressed:', {
key: event.key,
code: event.code,
ctrlKey: event.ctrlKey,
shiftKey: event.shiftKey,
altKey: event.altKey,
metaKey: event.metaKey,
target: event.target,
});
}
// Handle shortcuts
for (const [name, shortcut] of Object.entries(shortcuts)) {
const keyMatches =
shortcut.key.toLowerCase() === event.key.toLowerCase() || `Key${shortcut.key.toUpperCase()}` === event.code;
// Handle ctrlOrMetaKey based on OS
const ctrlOrMetaKeyMatches = shortcut.ctrlOrMetaKey
? (isMac && event.metaKey) || (!isMac && event.ctrlKey)
: true;
const modifiersMatch =
ctrlOrMetaKeyMatches &&
(shortcut.ctrlKey === undefined || shortcut.ctrlKey === event.ctrlKey) &&
(shortcut.metaKey === undefined || shortcut.metaKey === event.metaKey) &&
(shortcut.shiftKey === undefined || shortcut.shiftKey === event.shiftKey) &&
(shortcut.altKey === undefined || shortcut.altKey === event.altKey);
if (keyMatches && modifiersMatch) {
// Prevent default browser behavior if specified
if (shortcut.isPreventDefault) {
event.preventDefault();
event.stopPropagation();
}
shortcutEventEmitter.dispatch(name as keyof Shortcuts);
shortcut.action();
break;
}
}
};
window.addEventListener('keydown', handleKeyDown);
return () => {
window.removeEventListener('keydown', handleKeyDown);
};
}, [shortcuts]);
}
|