Merge pull request #11 from withspectrum/enter-on-return

Insert markdown on enter

Author: mxstbr

src/index.js

@@ -140,11 +140,28 @@ const createMarkdownPlugin = (config = {}) => {
       return "not-handled";
     },
     handleReturn(ev, editorState, { setEditorState }) {
-      const newEditorState = checkReturnForState(editorState, ev);
+      let newEditorState = checkReturnForState(editorState, ev);
       if (editorState !== newEditorState) {
         setEditorState(newEditorState);
         return "handled";
       }
+
+      // If we're in a code block don't add markdown to it
+      const startKey = editorState.getSelection().getStartKey();
+      if (startKey) {
+        const currentBlockType = editorState
+          .getCurrentContent()
+          .getBlockForKey(startKey)
+          .getType();
+        if (currentBlockType === "code-block") return "not-handled";
+      }
+
+      newEditorState = checkCharacterForState(editorState, "\n");
+      if (editorState !== newEditorState) {
+        setEditorState(newEditorState);
+        return "handled";
+      }
+
       return "not-handled";
     },
     handleBeforeInput(character, editorState, { setEditorState }) {

src/modifiers/__test__/changeCurrentInlineStyle-test.js

@@ -1,4 +1,3 @@
-import { expect } from "chai";
 import Draft, { EditorState, SelectionState } from "draft-js";
 import changeCurrentInlineStyle from "../changeCurrentInlineStyle";
 
@@ -43,10 +42,8 @@ describe("changeCurrentInlineStyle", () => {
       matchArr,
       "CODE"
     );
-    expect(newEditorState).not.to.equal(editorState);
-    expect(
-      Draft.convertToRaw(newEditorState.getCurrentContent())
-    ).to.deep.equal(
+    expect(newEditorState).not.toEqual(editorState);
+    expect(Draft.convertToRaw(newEditorState.getCurrentContent())).toEqual(
       rawContentState(
         "foo bar  baz",
         [
@@ -60,4 +57,31 @@ describe("changeCurrentInlineStyle", () => {
       )
     );
   });
+  it("inserts the character at the end", () => {
+    const text = "foo `bar` baz";
+    const editorState = createEditorState(text, []);
+    const matchArr = ["`bar`", "bar"];
+    matchArr.index = 4;
+    matchArr.input = text;
+    const newEditorState = changeCurrentInlineStyle(
+      editorState,
+      matchArr,
+      "CODE",
+      "\n"
+    );
+    expect(newEditorState).not.toEqual(editorState);
+    expect(Draft.convertToRaw(newEditorState.getCurrentContent())).toEqual(
+      rawContentState(
+        "foo bar\n baz",
+        [
+          {
+            length: 3,
+            offset: 4,
+            style: "CODE",
+          },
+        ],
+        "CODE"
+      )
+    );
+  });
 });

src/modifiers/changeCurrentInlineStyle.js

@@ -1,6 +1,6 @@
 import { EditorState, SelectionState, Modifier } from "draft-js";
 
-const changeCurrentInlineStyle = (editorState, matchArr, style) => {
+const changeCurrentInlineStyle = (editorState, matchArr, style, character) => {
   const currentContent = editorState.getCurrentContent();
   const selection = editorState.getSelection();
   const key = selection.getStartKey();
@@ -23,7 +23,7 @@ const changeCurrentInlineStyle = (editorState, matchArr, style) => {
   newContentState = Modifier.insertText(
     newContentState,
     newContentState.getSelectionAfter(),
-    " "
+    character || " "
   );
   const newEditorState = EditorState.push(
     editorState,

src/modifiers/handleInlineStyle.js

@@ -24,7 +24,8 @@ const handleInlineStyle = (editorState, character) => {
           newEditorState = changeCurrentInlineStyle(
             newEditorState,
             matchArr,
-            k
+            k,
+            character
           );
         }
       } while (matchArr);