Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mixmaxhq/electron-editor-context-menu
Enable the native right-click menu in Electron.
https://github.com/mixmaxhq/electron-editor-context-menu
unsupported
Last synced: 5 days ago
JSON representation
Enable the native right-click menu in Electron.
- Host: GitHub
- URL: https://github.com/mixmaxhq/electron-editor-context-menu
- Owner: mixmaxhq
- License: mit
- Archived: true
- Created: 2016-02-06T00:56:10.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2021-06-25T19:01:09.000Z (over 3 years ago)
- Last Synced: 2024-10-15T15:45:14.040Z (22 days ago)
- Topics: unsupported
- Language: JavaScript
- Size: 67.4 KB
- Stars: 50
- Watchers: 7
- Forks: 10
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# electron-editor-context-menu
In Electron, right-clicking in text editors does… nothing.
This module enables the menu you'd expect, with optional
[spell-checker integration][spell-checker integration].
## Installation
```js
npm install electron-editor-context-menu
```
or
```js
npm install electron-editor-context-menu --save
```
## Usage
```js
// In the renderer process:
var remote = require('electron').remote;
// `remote.require` since `Menu` is a main-process module.
var buildEditorContextMenu = remote.require('electron-editor-context-menu');
window.addEventListener('contextmenu', function(e) {
// Only show the context menu in text editors.
if (!e.target.closest('textarea, input, [contenteditable="true"]')) return;
var menu = buildEditorContextMenu();
// The 'contextmenu' event is emitted after 'selectionchange' has fired but possibly before the
// visible selection has changed. Try to wait to show the menu until after that, otherwise the
// visible selection will update after the menu dismisses and look weird.
setTimeout(function() {
menu.popup(remote.getCurrentWindow());
}, 30);
});
```
### Spell-checker integration
Show spelling suggestions by passing a _selection_ object when building the menu:
```js
var selection = {
isMisspelled: true,
spellingSuggestions: [
'men',
'mean',
'menu'
]
};
var menu = buildEditorContextMenu(selection);
```
Get these suggestions when your [spell-check provider][setSpellCheckProvider] runs
—Electron will poll it immediately before the `'contextmenu'` event fires.
For a complete example using `electron-spell-check-provider`, see
[here][spell-checker integration example].
### Customizing the menu
You can add or remove items to the menu, or replace it entirely, by providing
`mainTemplate` and/or `suggestionsTemplate` parameters when building the menu:
```js
var menu = buildEditorContextMenu(selection, mainTemplate, suggestionsTemplate);
```
The `mainTemplate` parameter customizes the always-present menu items; the
`suggestionsTemplate` parameter customizes the spelling suggestion items.
Pass an array of items to replace the default items entirely; pass a function
to add/remove/edit the default items. The function will be passed the default
array of items as a parameter and should return an array of items.
## Credits
Created by [Jeff Wear][Jeff Wear].
Thanks to https://github.com/atom/electron/pull/942#issuecomment-171445954 for
the initial sketch of this.
## Copyright and License
Copyright 2016 Mixmax, Inc., licensed under the MIT License.
[spell-checker integration]: #spell-checker-integration
[setSpellCheckProvider]: https://github.com/atom/electron/blob/master/docs/api/web-frame.md#webframesetspellcheckproviderlanguage-autocorrectword-provider
[spell-checker integration example]: https://github.com/mixmaxhq/electron-spell-check-provider#but-how-do-i-show-spelling-suggestions-in-the-context-menu
[Jeff Wear]: https://github.com/wearhere
## Release History
* 1.1.1 Fix compatibility with electron-builder
* 1.1.0 Add the ability to customize the main template and the suggestions template.
* 1.0.0 Initial release.