From 4d532bf62689237deb2374adaeb7ce3374d75555 Mon Sep 17 00:00:00 2001
From: Max <contact@mstoiber.com>
Date: Sun, 7 May 2017 11:40:29 +0200
Subject: [PATCH 1/2] Switch to blocks from marks

---
 src/index.js | 20 ++++++++++++++++----
 src/utils.js |  2 +-
 2 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/src/index.js b/src/index.js
index 97b10f5..9f40bfb 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,5 +1,6 @@
 // @flow
 import React from 'react';
+import { findDOMNode } from 'slate';
 
 import Portal from './lib/Portal';
 import {
@@ -23,7 +24,13 @@ const MentionsPlugin = (options?: Options): SlatePlugin => {
 
   return {
     schema: {
-      marks: {
+      nodes: {
+        default: ({ attributes, children }) => (
+          <span {...attributes}>{children}</span>
+        ),
+        line: ({ attributes, children }) => (
+          <span {...attributes}>{children}</span>
+        ),
         mention: Mention,
       },
     },
@@ -43,8 +50,12 @@ const MentionsPlugin = (options?: Options): SlatePlugin => {
           // Guard selectedIndex to be within the length of the suggestions
           const selected =
             (suggestions && selectedIndex % suggestions.length) || 0;
+
+          // const node = state.startBlock.getMarksAtRange(state.selection).findLast(mark => mark.type === 'mention');
+          // console.log(node)
+          // console.log(findDOMNode(node))
           portal = (
-            <Portal node={state.endText}>
+            <Portal node={state.startBlock}>
               <Suggestions
                 selected={selected}
                 suggestions={editor.props.suggestions}
@@ -66,7 +77,7 @@ const MentionsPlugin = (options?: Options): SlatePlugin => {
         // If the user types an @ we add a mention mark if we're not already in one
         case AT_SIGN: {
           if (currentlyInMention(state)) return;
-          return state.transform().addMark('mention').apply();
+          return state.transform().insertBlock('mention').focus().apply();
         }
         // If we're in a mention and either space or enter are pressed
         // jump out of the mention and insert a space
@@ -92,7 +103,8 @@ const MentionsPlugin = (options?: Options): SlatePlugin => {
               .transform()
               .deleteBackward(mentionLength)
               .insertText(text)
-              .removeMark('mention')
+              .splitBlock()
+              .setBlock('default')
               .insertText(' ')
               .focus()
               .apply();
diff --git a/src/utils.js b/src/utils.js
index 083eec9..4cee3c0 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -1,7 +1,7 @@
 import { FIRST_MENTION } from './constants';
 
 export const currentlyInMention = (state: Object) =>
-  state.marks.some(mark => mark.type === 'mention');
+  state.blocks.some(block => block.type === 'mention');
 
 // Find the index of the nearest "@" going backwards in text from end index
 export const nearestAt = (text: string, end: number) => {

From 01442d2b090d3dea33a68bb7f137965581a41cb8 Mon Sep 17 00:00:00 2001
From: Max <contact@mstoiber.com>
Date: Sun, 7 May 2017 11:43:39 +0200
Subject: [PATCH 2/2] Remove comment

---
 src/index.js | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/src/index.js b/src/index.js
index 9f40bfb..1cf1c38 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,6 +1,5 @@
 // @flow
 import React from 'react';
-import { findDOMNode } from 'slate';
 
 import Portal from './lib/Portal';
 import {
@@ -51,9 +50,6 @@ const MentionsPlugin = (options?: Options): SlatePlugin => {
           const selected =
             (suggestions && selectedIndex % suggestions.length) || 0;
 
-          // const node = state.startBlock.getMarksAtRange(state.selection).findLast(mark => mark.type === 'mention');
-          // console.log(node)
-          // console.log(findDOMNode(node))
           portal = (
             <Portal node={state.startBlock}>
               <Suggestions