Slate editor (#38)

* WIP: Slate editor

* WIP

* Focus at start / end working

* ah ha

* Super basic floating toolbar

* Nested list editing

* Pulling more logic into plugins

* inline code markdown

* Backspace at end of code block should remove mark

* Ensure there is always an empty line at editor end

* Add keyboard shortcuts for bold, italic, underline

* Add strikethrough shortcode and toolbar

* Toolbar to declarative
Fixed paragraph styling
Removed unused stuffs

* Super basic link editing

* Split Toolbar, now possible to edit and remove links

* Add new link to selection from toolbar working

* Ensure toolbar doesn't extend off screen

* Fix minor js issues, disable formatting of document title

* Boom, icons

* Remove codemirror, fix MD parsing issues

* CMD+S now saves inplace

* Add --- shortcut for horizontal rule

* Improved styling for link editor

* Add header anchors in readOnly

* More readable core text color

* Restored image file uploading 🎉

* Add support for inline md syntax, ** __ etc

* Centered

* Flooooow

* Checklist support

* Upgrade edit list plugin

* Finally. Allow keydown within rich textarea

* Update Markdown serializer

* Cleanup, remove async editor loading

* Editor > MarkdownEditor
Fixed unsaved changes warning triggered when all changes are saved

* MOAR typing

* Combine edit and view

* Fixed checkboxes still editable in readOnly

* wip

* Breadcrumb
Restored scroll

* Move document scene actions to menu

* Added: Support for code blocks, syntax highlighting

* Cleanup

*  > styled component

* Prevent CMD+Enter from adding linebreak

* Show image uploading in layout activity indicator

* Upgrade editor deps

* Improve link toolbar. Only one scenario where it's not working now

frontend/scenes/Document/components/Editor/plugins/KeyboardShortcuts.js

@@ -0,0 +1,39 @@
+// @flow
+
+export default function KeyboardShortcuts() {
+  return {
+    /**
+     * On key down, check for our specific key shortcuts.
+     *
+     * @param {Event} e
+     * @param {Data} data
+     * @param {State} state
+     * @return {State or Null} state
+     */
+    onKeyDown(ev: SyntheticEvent, data: Object, state: Object) {
+      if (!data.isMeta) return null;
+
+      switch (data.key) {
+        case 'b':
+          return this.toggleMark(state, 'bold');
+        case 'i':
+          return this.toggleMark(state, 'italic');
+        case 'u':
+          return this.toggleMark(state, 'underlined');
+        case 'd':
+          return this.toggleMark(state, 'deleted');
+        default:
+          return null;
+      }
+    },
+
+    toggleMark(state: Object, type: string) {
+      // don't allow formatting of document title
+      const firstNode = state.document.nodes.first();
+      if (firstNode === state.startBlock) return;
+
+      state = state.transform().toggleMark(type).apply();
+      return state;
+    },
+  };
+}