Improve Hotkeys pressed-shortcut filtering #203

New issue

Closed

opened 2026-06-01 18:16:14 +00:00 by steve · 0 comments

steve commented

2026-06-01 18:16:14 +00:00

Owner

Problem

The filter input should keep the capture action inside the input affordance and
make capture mode modal enough that typed shortcut attempts do not leak to the
browser, command routing, or the focused input. Captured key chords should filter
the command list by matching shortcuts, and text filtering should still be easy
to clear.

Goal

Improve hotkeys-settings.svelte so the keyboard icon turns into the active
Press hotkey control, capture mode consumes keydown events, completed shortcut
captures render as removable tags, and text input with content shows a clear
button.

Scope

Workspace Hotkeys settings UI.
Shortcut capture/filter state and event handling in the Hotkeys tab.
Focused component tests for the filtering/capture behavior when practical.

Non-goals

Changing CommandManager hotkey persistence or execution semantics.
Adding new hotkey conflict resolution behavior.
Redesigning the Settings shell outside the Hotkeys tab.

Acceptance Criteria

Clicking the keyboard affordance inside the filter input enables pressed
hotkey mode without showing a separate adjacent "Press hotkey" button.
While pressed hotkey mode is active, keydown input is prevented from reaching
normal text input, browser defaults, or app command routing.
After a short idle gap, the pressed keys become a visible filter tag with a
delete icon, and the command list filters to shortcuts that match the captured
key presses.
Multiple captured filters can be removed independently.
Once text exists in the search input, a clear button appears inside the input
and clears only the typed text.
Existing text search, assigned-only filtering, hotkey add/remove/reset, and
conflict indicators keep working.

Implementation Notes

Inspect the existing capture state in
packages/workspace/src/lib/components/configuration/hotkeys-settings.svelte
before changing behavior.
Prefer the app keymap/modal scope if the component already has access to it;
otherwise use component-level capture listeners that explicitly prevent and
stop propagation while pressed-hotkey mode is active.
Reuse existing hotkey formatting helpers and matching logic where available.

Suggested Files or Specs To Inspect

packages/workspace/src/lib/components/configuration/hotkeys-settings.svelte
packages/workspace/src/lib/components/configuration/*.test.ts
spec/src/20-packages/workspace/index.md
spec/src/30-cross-package-contracts/commands-and-keymaps.md
spec/src/30-cross-package-contracts/configuration-and-settings.md

Validation Commands

pnpm --filter @lapis-notes/workspace check:all
pnpm test:smoke if the final diff affects app boot or shared runtime routing

Follow-up Tasks

Implementation Summary

Polished the active Hotkeys search capture button to use the primary accent/default button styling while preserving the secondary state for an inactive keyboard filter with tags. Added an E2E assertion for the accent class.

Reopen Reason

Regression polish in the last committed hotkeys capture change: active Press hotkey should use the primary accent button styling.

The Hotkeys settings tab has a keyboard capture affordance for filtering the command list by shortcut, but its current UI adds a separate "Press hotkey" button beside the input and does not consume all key presses while capture mode is active. ## Problem The filter input should keep the capture action inside the input affordance and make capture mode modal enough that typed shortcut attempts do not leak to the browser, command routing, or the focused input. Captured key chords should filter the command list by matching shortcuts, and text filtering should still be easy to clear. ## Goal Improve `hotkeys-settings.svelte` so the keyboard icon turns into the active `Press hotkey` control, capture mode consumes keydown events, completed shortcut captures render as removable tags, and text input with content shows a clear button. ## Scope - Workspace Hotkeys settings UI. - Shortcut capture/filter state and event handling in the Hotkeys tab. - Focused component tests for the filtering/capture behavior when practical. ## Non-goals - Changing `CommandManager` hotkey persistence or execution semantics. - Adding new hotkey conflict resolution behavior. - Redesigning the Settings shell outside the Hotkeys tab. ## Acceptance Criteria - Clicking the keyboard affordance inside the filter input enables pressed hotkey mode without showing a separate adjacent "Press hotkey" button. - While pressed hotkey mode is active, keydown input is prevented from reaching normal text input, browser defaults, or app command routing. - After a short idle gap, the pressed keys become a visible filter tag with a delete icon, and the command list filters to shortcuts that match the captured key presses. - Multiple captured filters can be removed independently. - Once text exists in the search input, a clear button appears inside the input and clears only the typed text. - Existing text search, assigned-only filtering, hotkey add/remove/reset, and conflict indicators keep working. ## Implementation Notes - Inspect the existing capture state in `packages/workspace/src/lib/components/configuration/hotkeys-settings.svelte` before changing behavior. - Prefer the app keymap/modal scope if the component already has access to it; otherwise use component-level capture listeners that explicitly prevent and stop propagation while pressed-hotkey mode is active. - Reuse existing hotkey formatting helpers and matching logic where available. ## Suggested Files or Specs To Inspect - `packages/workspace/src/lib/components/configuration/hotkeys-settings.svelte` - `packages/workspace/src/lib/components/configuration/*.test.ts` - `spec/src/20-packages/workspace/index.md` - `spec/src/30-cross-package-contracts/commands-and-keymaps.md` - `spec/src/30-cross-package-contracts/configuration-and-settings.md` ## Validation Commands - `pnpm --filter @lapis-notes/workspace check:all` - `pnpm test:smoke` if the final diff affects app boot or shared runtime routing ## Related Issues ## Follow-up Tasks ## Implementation Summary Polished the active Hotkeys search capture button to use the primary accent/default button styling while preserving the secondary state for an inactive keyboard filter with tags. Added an E2E assertion for the accent class. ## Reopen Reason Regression polish in the last committed hotkeys capture change: active Press hotkey should use the primary accent button styling.

steve

2026-06-01 18:16:14 +00:00