diff --git a/frontend/app/element/search.tsx b/frontend/app/element/search.tsx index 031bcd97d8..e09e8a1078 100644 --- a/frontend/app/element/search.tsx +++ b/frontend/app/element/search.tsx @@ -26,6 +26,7 @@ const SearchComponent = ({ caseSensitive: caseSensitiveAtom, wholeWord: wholeWordAtom, isOpen: isOpenAtom, + focusInput: focusInputAtom, anchorRef, offsetX = 10, offsetY = 10, @@ -37,6 +38,8 @@ const SearchComponent = ({ const [search, setSearch] = useAtom(searchAtom); const [index, setIndex] = useAtom(indexAtom); const [numResults, setNumResults] = useAtom(numResultsAtom); + const [focusInputCounter, setFocusInputCounter] = useAtom(focusInputAtom); + const inputRef = useRef(null); const handleOpenChange = useCallback((open: boolean) => { setIsOpen(open); @@ -47,6 +50,7 @@ const SearchComponent = ({ setSearch(""); setIndex(0); setNumResults(0); + setFocusInputCounter(0); } }, [isOpen]); @@ -56,6 +60,15 @@ const SearchComponent = ({ onSearch?.(search); }, [search]); + // When activateSearch fires while already open, it increments focusInputCounter + // to signal this specific instance to grab focus (avoids global DOM queries). + useEffect(() => { + if (focusInputCounter > 0 && isOpen) { + inputRef.current?.focus(); + inputRef.current?.select(); + } + }, [focusInputCounter]); + const middleware: Middleware[] = []; const offsetCallback = useCallback( ({ rects }) => { @@ -146,6 +159,7 @@ const SearchComponent = ({
0) { navigator.clipboard.writeText(selectedText); diff --git a/frontend/types/custom.d.ts b/frontend/types/custom.d.ts index d0b5f0e3b0..8ee176e151 100644 --- a/frontend/types/custom.d.ts +++ b/frontend/types/custom.d.ts @@ -1,10 +1,10 @@ // Copyright 2026, Command Line Inc. // SPDX-License-Identifier: Apache-2.0 +import type { WaveEnv } from "@/app/waveenv/waveenv"; import { type Placement } from "@floating-ui/react"; import type * as jotai from "jotai"; import type * as rxjs from "rxjs"; -import type { WaveEnv } from "@/app/waveenv/waveenv"; declare global { type GlobalAtomsType = { @@ -276,6 +276,7 @@ declare global { resultsIndex: PrimitiveAtom; resultsCount: PrimitiveAtom; isOpen: PrimitiveAtom; + focusInput: PrimitiveAtom; regex?: PrimitiveAtom; caseSensitive?: PrimitiveAtom; wholeWord?: PrimitiveAtom;