7c4c8f324afb0597d42c5e4bf5c0fc5d292df6af
js/arrow_key_canvas_navigation.js: - Replace the hardcoded CANVAS_BLOCKING_UI_WINDOW_CLASSES selector string with isDialogOpen(), which detects blocking UI more robustly: ARIA dialogs/modals via document.activeElement, PrimeVue overlay masks, native <dialog> elements, and a generic fallback that flags any full-viewport, high-z-index fixed-position div. This removes the need to hardcode every third-party node's CSS class. - Add a "Manual Overlay CSS Selectors (to Disable Panning)" setting so users can add selectors for overlays the automatic detection misses, without editing the source file or restarting ComfyUI. - Add a "Pan Speed Multiplier (Shift + Arrow Key)" setting (default 3x) for faster panning while holding Shift. - Switch from the deprecated app.ui.settings API to app.extensionManager.setting. - Replace the event.composedPath()[0] focus check with document.activeElement, and also treat contentEditable elements and litegraph's inline "property_value" span as focused inputs. - Extract isInputFocused()/hasImageCarousel() into named helper functions and reorder the keydown handler into early-exit "fast path" checks for readability. README.md: - Update docs to match the above: mention the Shift multiplier, and replace the outdated instructions to edit the CANVAS_BLOCKING_UI_WINDOW_CLASSES constant with instructions to use the new Manual Overlay CSS Selectors setting instead. Also normalized 6 files (.github/workflows/publish.yml, .gitignore, LICENSE, README.md, __init__.py, pyproject.toml) back to LF line endings — they had been accidentally converted to CRLF with no actual content changes, which was producing a noisy ~800-line diff.
ComfyUI-Arrow-Key-Canvas-Navigation
This custom "node" for ComfyUI enables pan navigation of the canvas using the arrow keys, with a customizable pan speed (and a Shift-key speed multiplier) in ComfyUI's Settings, under the "codecringebinge" subsection of the Settings Dialog's left panel.
Note:
- There are specific cases in which the arrow keys intentionally will not pan the canvas, such as when a node with more than one image is selected (as the arrow keys should retain their standard behavior of cycling through said images), or when the canvas is blocked by another UI window (e.g. the Comfy Manager, Comfy Settings, the pythongosssss Image Gallery, modals, etc.). Text inputs and text areas are also excluded so typing still works as expected.
- Blocking UI windows are detected automatically in most cases (ARIA dialogs, native
<dialog>elements, PrimeVue overlay masks, and full-viewport high-z-index overlays). If you encounter a scenario where the arrow keys are panning the canvas when they shouldn't (e.g. a custom node opens a UI window that isn't being detected), you can report this in the GitHub Issues section of this repo, or for a faster fix, identify a CSS selector for the window in question (e.g. via your browser's Developer Tools) and add it to the "Manual Overlay CSS Selectors (to Disable Panning)" setting (comma-separated list) — no restart required.
Installation
If using ComfyUI Manager:
- Look for
ComfyUI-Arrow-Key-Canvas-Navigation, confirm the author iscodecringebinge, and install it.
If installing manually:
- Clone this repo into the
custom_nodesfolder.
Thanks and cheers! 🍻
Languages
JavaScript
98.5%
Python
1.5%