Markdown Editor

Markdown editor React component. An instance of this class will be loaded when you opened a note. You can access it as following:

const mde = inkdrop.getActiveEditorOrThrowError()

If you are building a plugin that extends the editor, you have to subscribe events to know when it is loaded/unloaded:

module.exports = {
  activate() {
    const editor = inkdrop.getActiveEditor()
    if (editor) {
      this.extendEditor(editor)
    } else {
      inkdrop.onEditorLoad(this.extendEditor)
    }
  },

  deactivate() {
    const editor = inkdrop.getActiveEditor()
    if (editor) this.unextendEditor(editor)
  },

  extendEditor: (editor) => {
    const { cm } = editor
  },

  unextendEditor: (editor) => {
    // unload
  }
}

For more information about accessing the editor, refer to Environment.


Extending the Inkdrop Editor

Inkdrop's editor is built on top of CodeMirror. You can access its instance via mde.cm.

All available CodeMirror APIs are documented here.

For example, you can change an editor option like so:

Example

const mde = inkdrop.getActiveEditorOrThrowError()
mde.cm.setOption('lineNumbers', true)

Properties

  • Name
    cm
    Type
    CodeMirror.Editor
    Description

    An instance of CodeMirror v5.

  • Name
    wrapper
    Type
    React.Component
    Description

    A React component that wraps CodeMirror.


Can you help us improve the docs? 🙏

The source of these docs is here on GitHub. If you see a way these docs can be improved, please fork us!