Skip to content

Commit

Permalink
feat(editor): Add keyboard shortcuts for completion navigation (#3382)
Browse files Browse the repository at this point in the history
## 📝 Summary

Add Alt-J/K (Ctrl-J/K on macOS) shortcuts to navigate through the
completion menu, inspired by Vim:
- Alt-J/Ctrl-J: Move down in completion list
- Alt-K/Ctrl-K: Move up in completion list

This provides a more efficient way to navigate completions without using
arrow keys.


https://github.com/user-attachments/assets/3c261966-e2cb-454e-9862-d26380d32cdf


## 📋 Checklist

- [x] I have read the [contributor
guidelines](https://github.com/marimo-team/marimo/blob/main/CONTRIBUTING.md).
- [x] For large changes, or changes that affect the public API: this
change was discussed or approved through an issue, on
[Discord](https://marimo.io/discord?ref=pr), or the community
[discussions](https://github.com/marimo-team/marimo/discussions) (Please
provide a link if applicable).
- [ ] I have added tests for the changes made.
- [x] I have run the code and verified that it works as expected.

## 📜 Reviewers

<!--
Tag potential reviewers from the community or maintainers who might be
interested in reviewing this pull request.

Your PR will be reviewed more quickly if you can figure out the right
person to tag with @ -->

@akshayka OR @mscolnick
  • Loading branch information
metaboulie authored Jan 9, 2025
1 parent 09d1aee commit bf49994
Showing 1 changed file with 26 additions and 0 deletions.
26 changes: 26 additions & 0 deletions frontend/src/core/codemirror/cm.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,8 @@ import {
closeBrackets,
closeBracketsKeymap,
startCompletion,
moveCompletionSelection,
completionStatus,
} from "@codemirror/autocomplete";
import {
history,
Expand Down Expand Up @@ -170,6 +172,30 @@ export const basicBundle = (opts: CodeMirrorSetupOpts): Extension[] => {
},
preventDefault: true,
},
{
key: "Alt-j",
mac: "Ctrl-j",
run: (cm) => {
if (completionStatus(cm.state) !== null) {
moveCompletionSelection(true)(cm);
return true;
}
return false;
},
preventDefault: true,
},
{
key: "Alt-k",
mac: "Ctrl-k",
run: (cm) => {
if (completionStatus(cm.state) !== null) {
moveCompletionSelection(false)(cm);
return true;
}
return false;
},
preventDefault: true,
},
]),
keymap.of([...historyKeymap, indentWithTab]),
];
Expand Down

0 comments on commit bf49994

Please sign in to comment.