import { useCallback, useEffect } from 'react'; interface UseKeyboardOptions { enabled?: boolean; target?: EventTarget; } /** * Hook for handling keyboard events with automatic cleanup */ export function useKeyboard( handler: (event: KeyboardEvent) => void, options: UseKeyboardOptions = {} ) { const { enabled = true, target = document } = options; const memoizedHandler = useCallback(handler, [handler]); useEffect(() => { if (!enabled) return; target.addEventListener('keydown', memoizedHandler); return () => target.removeEventListener('keydown', memoizedHandler); }, [enabled, target, memoizedHandler]); } /** * Hook for handling escape key with a callback */ export function useEscapeKey( onEscape: () => void, options: UseKeyboardOptions = {} ) { const handleKeyDown = useCallback((event: KeyboardEvent) => { if (event.key === 'Escape') { onEscape(); } }, [onEscape]); useKeyboard(handleKeyDown, options); }