diff --git a/apps/readest-app/src/app/reader/components/sidebar/SearchBar.tsx b/apps/readest-app/src/app/reader/components/sidebar/SearchBar.tsx index e58babdb..47944a19 100644 --- a/apps/readest-app/src/app/reader/components/sidebar/SearchBar.tsx +++ b/apps/readest-app/src/app/reader/components/sidebar/SearchBar.tsx @@ -58,7 +58,14 @@ const SearchBar: React.FC = ({ }, [isVisible]); useEffect(() => { + const handleKeyDown = (e: KeyboardEvent) => { + if (e.key === 'Escape' && inputRef.current) { + inputRef.current.blur(); + } + }; + window.addEventListener('keydown', handleKeyDown); return () => { + window.removeEventListener('keydown', handleKeyDown); if (searchTimeout.current) { clearTimeout(searchTimeout.current); } diff --git a/apps/readest-app/src/app/reader/components/sidebar/SideBar.tsx b/apps/readest-app/src/app/reader/components/sidebar/SideBar.tsx index 0ce9fc84..2811c507 100644 --- a/apps/readest-app/src/app/reader/components/sidebar/SideBar.tsx +++ b/apps/readest-app/src/app/reader/components/sidebar/SideBar.tsx @@ -15,6 +15,7 @@ import useSidebar from '../../hooks/useSidebar'; import useDragBar from '../../hooks/useDragBar'; import SearchBar from './SearchBar'; import SearchResults from './SearchResults'; +import useShortcuts from '@/hooks/useShortcuts'; const MIN_SIDEBAR_WIDTH = 0.05; const MAX_SIDEBAR_WIDTH = 0.45; @@ -84,6 +85,8 @@ const SideBar: React.FC<{ } }; + useShortcuts({ onToggleSearchBar: handleToggleSearchBar }, [sideBarBookKey]); + const handleSearchResultClick = (cfi: string) => { getView(sideBarBookKey)?.goTo(cfi); }; diff --git a/apps/readest-app/src/helpers/shortcuts.ts b/apps/readest-app/src/helpers/shortcuts.ts index 0c9939a1..e850bb5c 100644 --- a/apps/readest-app/src/helpers/shortcuts.ts +++ b/apps/readest-app/src/helpers/shortcuts.ts @@ -2,6 +2,7 @@ export interface ShortcutConfig { onSwitchSideBar: string[]; onToggleSideBar: string[]; onToggleNotebook: string[]; + onToggleSearchBar: string[]; onReloadPage: string[]; onGoLeft: string[]; onGoRight: string[]; @@ -13,6 +14,7 @@ const DEFAULT_SHORTCUTS: ShortcutConfig = { onSwitchSideBar: ['ctrl+Tab', 'opt+Tab', 'alt+Tab'], onToggleSideBar: ['s'], onToggleNotebook: ['n'], + onToggleSearchBar: ['ctrl+f', 'cmd+f'], onReloadPage: ['shift+r'], onGoLeft: ['ArrowLeft', 'PageUp', 'h'], onGoRight: ['ArrowRight', 'PageDown', 'l'], diff --git a/apps/readest-app/src/hooks/useShortcuts.ts b/apps/readest-app/src/hooks/useShortcuts.ts index 43eacfed..880ecfd9 100644 --- a/apps/readest-app/src/hooks/useShortcuts.ts +++ b/apps/readest-app/src/hooks/useShortcuts.ts @@ -22,9 +22,9 @@ const useShortcuts = (actions: KeyActionHandlers, dependencies: React.Dependency return { ctrlKey: keys.includes('ctrl'), altKey: keys.includes('alt') || keys.includes('opt'), - metaKey: keys.includes('meta'), + metaKey: keys.includes('meta') || keys.includes('cmd'), shiftKey: keys.includes('shift'), - key: keys.find((k) => !['ctrl', 'alt', 'opt', 'meta', 'shift'].includes(k)), + key: keys.find((k) => !['ctrl', 'alt', 'opt', 'meta', 'cmd', 'shift'].includes(k)), }; };