« Text Editor Key 1.0.3

abcdef

Try to press Control + b or Control + i in the text area above!

Usage

Browser

<script src="./text-editor/index.min.js"></script>
<script src="./text-editor.key/index.min.js"></script>
<script>

  const editor = new TextEditor(document.querySelector('textarea'), {
      with: [TextEditor.Key]
  });

  editor.command('bold', function () {
      return this.wrap('<b>', '</b>'), false;
  });

  editor.key('Control-b', 'bold');

  editor.key('Control-i', function () {
      return this.wrap('<i>', '</i>'), false;
  });

</script>

CommonJS

const TextEditor = require('@taufik-nurrohman/text-editor').default;
const TextEditorKey = require('@taufik-nurrohman/text-editor.key').default;

TextEditor.state.with.push(TextEditorKey); // Load as a core extension

const editor = new TextEditor(document.querySelector('textarea'), {
    with: [TextEditorKey] // Load as an optional extension
});

editor.command('bold', function () {
    return this.wrap('<b>', '</b>'), false;
});

editor.key('Control-b', 'bold');

editor.key('Control-i', function () {
    return this.wrap('<i>', '</i>'), false;
});

ECMAScript

import TextEditor from '@taufik-nurrohman/text-editor';
import TextEditorKey from '@taufik-nurrohman/text-editor.key';

TextEditor.state.with.push(TextEditorKey); // Load as a core extension

const editor = new TextEditor(document.querySelector('textarea'), {
    with: [TextEditorKey] // Load as an optional extension
});

editor.command('bold', function () {
    return this.wrap('<b>', '</b>'), false;
});

editor.key('Control-b', 'bold');

editor.key('Control-i', function () {
    return this.wrap('<i>', '</i>'), false;
});

Methods

Instance Methods

editor.command(command, of)

Add a command to be used later by the editor.key() method.

editor.command('bold', function () {
    this.wrap('<b>', '</b>');
    return false; // Prevent normal keyboard behavior by returning `false`
});

editor.k(join = '-')

Return the current key combination.

console.log(editor.k());
console.log(editor.k('\n'));
console.log(editor.k(false));

editor.key(key, of)

Add a command that will be executed when a certain keyboard key combination is pressed.

editor.key('Control-b', 'bold'); // This will execute `editor.commands.bold()` if exists

editor.key('Control-b', function () {
    this.wrap('<b>', '</b>');
    return false; // Prevent normal keyboard behavior by returning `false`
});

Properties

Instance Properties

editor.commands

List of commands.

console.log(editor.commands);

editor.keys

List of keyboard key combinations.

console.log(editor.keys);