diff --git a/.jules/palette.md b/.jules/palette.md index 9e76393..eb02b70 100644 --- a/.jules/palette.md +++ b/.jules/palette.md @@ -99,3 +99,7 @@ ## 2026-07-01 - Prevent Focus Stealing in Search Filter Buttons **Learning:** In hybrid mouse/keyboard search interfaces (like VS Code Webviews), clicking interactive elements like filter buttons steals DOM focus from the primary search input. This forces users to manually click back into the input or hit Tab before they can resume typing. **Action:** When implementing filter or scope toggle buttons that don't need their own text-input focus, attach a `mousedown` event listener that calls `e.preventDefault()`. This prevents the browser's default focus transition before it even fires, ensuring the user's cursor remains firmly anchored in the main search input. + +## 2026-07-02 - Actionable Escape-to-Clear Shortcut +**Learning:** Users intuitively expect the `Escape` key to clear a search input and reset applied filters. A common edge case is when a user has manually backspaced their query but filters are still active; the `Escape` key must still function as a complete reset path in this state. +**Action:** When implementing `Escape` to clear search inputs, ensure the logic checks for *both* an active query and active filters, so users are never trapped in an empty-input-but-filtered state. diff --git a/vscode-extension/src/webviews/search-view.html b/vscode-extension/src/webviews/search-view.html index a4ce668..ff482a4 100644 --- a/vscode-extension/src/webviews/search-view.html +++ b/vscode-extension/src/webviews/search-view.html @@ -1179,7 +1179,16 @@ } searchInput.addEventListener('keydown', (e) => { - if (e.key === 'ArrowDown') { + if (e.key === 'Escape' && (searchInput.value !== '' || currentScope !== 'everything')) { + e.preventDefault(); + searchInput.value = ''; + currentScope = 'everything'; + userScope = 'everything'; + updateScopeButtons(); + triggerSearchFromInput(''); + searchInput.focus(); + showStatus('Search and filters cleared'); + } else if (e.key === 'ArrowDown') { e.preventDefault(); selectItem(Math.min(selectedIndex + 1, visibleEntries.length - 1)); const selection = getEffectiveSelection(selectedIndex);