CODEWITHSUNDEEP
javascriptmonaco-editorreact-monaco-editor
DecPK
DecPK

Reputation: 25406

How to trigger command pallette in monaco editor with custom keyboard shortcut

Hi I'm creating a JS/TS editor online learnjs.app but I would like to give user is when user presses cmd/ctrl + p depend upon os then it should show/open command pallette. But I couldn't find any solution as of now.

I've tried some solutions as per some blogs or chatGPT suggestion but not working like below:

const action = monacoRef.current.editor.getAction(
    "editor.action.showCommands"
);

if (action) {
    action.run();
}

Trying above code on keyboard listenr on cmd + p. But that doesn't seems to be working. Any suggestions

Upvotes: 1

Views: 86

Answers (1)

redoc
redoc

Reputation: 2469

I am not able to explain why that doesn't work, you should get some errors, but this works:
I have added alert statement to debug it if not. You can safely remove it.

myEditor.addCommand(
        monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyP, // Ctrl+P or Cmd+P
        function () {
            alert()
            // Trigger the built-in command palette command
            myEditor.trigger('keyboard', 'editor.action.quickCommand', null);
        }
    );

Your code in playground: this My answer: this, focus the preview before using shortcut

Upvotes: 0

Related Questions