Add keyboard navigation: e/c/slash shortcuts, j/k list nav, focus visibility

- App.vue: e → edit on viewer pages; / → focus search (custom event); c → focus
  chat on home or navigate to /chat; update shortcuts panel with Lists + Chat sections
- theme.css: add a:focus-visible to focus-ring rules (router-link cards now show
  visible keyboard focus outline)
- SearchBar.vue: expose focus() via defineExpose for cross-component focus dispatch
- NotesListView / TasksListView: j/k vim-style navigation with kb-active-item
  highlight; listen for shortcut:focus-search; cleanup on unmount
- HomeView.vue: listen for shortcut:focus-chat, call chatInputRef.focus()

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-04 08:39:49 -05:00
parent 264c3664ba
commit 969ef0efa3
6 changed files with 174 additions and 25 deletions
+3 -1
View File
@@ -106,9 +106,11 @@ body {
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
button:focus-visible {
button:focus-visible,
a:focus-visible {
outline: none;
box-shadow: var(--focus-ring);
border-radius: var(--radius-sm);
}
/* Responsive breakpoints: 480px (phone), 768px (tablet), 1024px (desktop) */