ngx-monaco-editor icon indicating copy to clipboard operation
ngx-monaco-editor copied to clipboard

Change monaco editor context menu labels

Open Planit-Scheduler-Solutions opened this issue 1 year ago • 0 comments

I use monaco-editor version 0.34.1, @materia-ui/ngx-monaco-editor version 6.0.0 with angular 14. I am trying to change context menu labels that exists by the original monaco initialize. This is my configuration to my custom language: export function myMonacoLoad() { monaco.languages.register({ id: 'planit' });

// Brackets rules. const config: monaco.languages.LanguageConfiguration = {

// Allow square brackets to be part of a word if . is part of the word comletion not work.
wordPattern: /(-?\d*\.\d\w*)|([^\#\(\)\'\"\,\.]+)/g,
surroundingPairs: [{ open: '(', close: ')' }, { open: '"', close: '"' }],
autoClosingPairs: [{ open: '(', close: ')' }, { open: '"', close: '"' }],
brackets: [['(', ')']],

}; monaco.languages.setLanguageConfiguration('planit', config); monaco.editor.defineTheme('planitTheme', { base: 'vs', inherit: true, rules: [ { token: 'operator-type', foreground: '918100' }, { token: 'property', foreground: '003060' }, { token: 'calculation-constant', foreground: '238384' }, { token: 'comment', foreground: '369C41' }, { token: 'date', foreground: 'B04B04' }, { token: 'text', foreground: 'B04B04' }, { token: 'const', foreground: '0859a8' } ], colors: { 'editor.foreground': '#000000' } }); }`

then I add my custom actions like this: ` const colorPickerActopn = {

// An unique identifier of the contributed action. id: 'color-picker',

// A label of the action that will be presented to the user. label: 'Color Picker',

// A precondition for this action. precondition: null,

// A rule to evaluate on top of the precondition in order to dispatch the keybindings. keybindingContext: null,

contextMenuGroupId: '9_cutcopypaste',

contextMenuOrder: 7,

// Method that will be executed when the action is triggered. // @param editor The editor instance is passed in as a convenience. // Interface on monaco editor is ICodeEditor. run: this.monacoEditorService.colorPicker };

this.editor.addAction(colorPickerActopn);

const commentAction = { // An unique identifier of the contributed action. id: 'comment',

// A label of the action that will be presented to the user. label: 'Comment',

// An optional array of keybindings for the action. keybindings: [ monaco.KeyMod.CtrlCmd | monaco.KeyCode.Slash, ],

// A precondition for this action. precondition: null,

// A rule to evaluate on top of the precondition in order to dispatch the keybindings. keybindingContext: null,

contextMenuGroupId: '9_cutcopypaste',

contextMenuOrder: 8,

// Method that will be executed when the action is triggered. // @param editor The editor instance is passed in as a convenience. // Interface on monaco editor is ICodeEditor. run: this.monacoEditorService.commentRow }; this.editor.addAction(commentAction);

const hatchAction = { // An unique identifier of the contributed action. id: 'hatch',

// A label of the action that will be presented to the user. label: 'Hatch',

// A precondition for this action. precondition: null,

// A rule to evaluate on top of the precondition in order to dispatch the keybindings. keybindingContext: null,

contextMenuGroupId: '9_cutcopypaste',

contextMenuOrder: 6,

// Method that will be executed when the action is triggered. // @param editor The editor instance is passed in as a convenience. // Interface on monaco editor is ICodeEditor. run: this.monacoEditorService.hatchPicker }; this.editor.addAction(hatchAction); `

That is the menu result: enter image description here

I also tried to use import * as actions from 'monaco-editor/esm/vs/platform/actions/common/actions';

but no actions inside.

How can I change the menu items that not I entered(Need change the labels)?