Merge branch 'master' into wysiwyg

Benjamin Kniffler · Benjamin Kniffler · commit 72f8baf2f050 · 2016-04-05T17:40:54.000+02:00
diff --git a/draft-js-emoji-plugin/CHANGELOG.md b/draft-js-emoji-plugin/CHANGELOG.md
@@ -8,6 +8,11 @@ This project adheres to [Semantic Versioning](http://semver.org/).
 ### Changed
 
 - Move to a flat configuration. Instead of plugin properties (decorators & hooks) being stored within pluginProps they now moved to the root object. See the changes here [#150](https://github.com/draft-js-plugins/draft-js-plugins/pull/150/files) as well as the initial discussion here [#143](https://github.com/draft-js-plugins/draft-js-plugins/issues/143)
+- Improved the regex and now test for a whitespace in front of the `:` to make sure it doesn't match on normal text like a link [#104](https://github.com/draft-js-plugins/draft-js-plugins/issues/104)
+
+### Fixed
+
+- Fix using backspace to close the autocomplete suggestions after typing a `:` [#153](https://github.com/draft-js-plugins/draft-js-plugins/issues/153)
 
 ## 0.0.4 - 2016-03-29
 
diff --git a/draft-js-emoji-plugin/src/EmojiSearch/index.js b/draft-js-emoji-plugin/src/EmojiSearch/index.js
@@ -60,10 +60,18 @@ export default class EmojiSearch extends Component {
 
     // identify the start & end positon of the search-text
     const { blockKey, decoratorKey, leafKey } = decodeOffsetKey(this.props.offsetKey);
-    const { start, end } = editorState
+
+    const leave = editorState
       .getBlockTree(blockKey)
       .getIn([decoratorKey, 'leaves', leafKey]);
 
+    // the leave can be empty when it is removed due e.g. using backspace
+    if (leave === undefined) {
+      return editorState;
+    }
+
+    const { start, end } = leave;
+
     // get the current selection
     const selection = editorState.getSelection();
 
diff --git a/draft-js-emoji-plugin/src/emojiSearchStrategy.js b/draft-js-emoji-plugin/src/emojiSearchStrategy.js
@@ -2,7 +2,7 @@
 
 import findWithRegex from 'find-with-regex';
 
-const EMOJI_REGEX = /:[\w]*/g;
+const EMOJI_REGEX = /(\s|^):[\w]*/g;
 
 export default (contentBlock: Object, callback: Function) => {
   findWithRegex(EMOJI_REGEX, contentBlock, callback);
diff --git a/draft-js-mention-plugin/CHANGELOG.md b/draft-js-mention-plugin/CHANGELOG.md
@@ -8,6 +8,11 @@ This project adheres to [Semantic Versioning](http://semver.org/).
 ### Changed
 
 - Move to a flat configuration. Instead of plugin properties (decorators & hooks) being stored within pluginProps they now moved to the root object. See the changes here [#150](https://github.com/draft-js-plugins/draft-js-plugins/pull/150/files) as well as the initial discussion here [#143](https://github.com/draft-js-plugins/draft-js-plugins/issues/143)
+- Improved the regex and now test for a whitespace in front of the `@` to make sure it doesn't match on normal text like an email [#104](https://github.com/draft-js-plugins/draft-js-plugins/issues/104)
+
+### Fixed
+
+- Fix using backspace to close the autocomplete suggestions after typing an `@` [#110](https://github.com/draft-js-plugins/draft-js-plugins/issues/110)
 
 ## 0.0.4 - 2016-03-29
 
diff --git a/draft-js-mention-plugin/src/MentionSearch/index.js b/draft-js-mention-plugin/src/MentionSearch/index.js
@@ -55,9 +55,16 @@ export default class MentionSearch extends Component {
 
     // identify the start & end positon of the search-text
     const { blockKey, decoratorKey, leafKey } = decodeOffsetKey(this.props.offsetKey);
-    const { start, end } = editorState
+
+    // the leave can be empty when it is removed due e.g. using backspace
+    const leave = editorState
       .getBlockTree(blockKey)
       .getIn([decoratorKey, 'leaves', leafKey]);
+    if (leave === undefined) {
+      return editorState;
+    }
+
+    const { start, end } = leave;
 
     // get the current selection
     const selection = editorState.getSelection();
diff --git a/draft-js-mention-plugin/src/mentionSearchStrategy.js b/draft-js-mention-plugin/src/mentionSearchStrategy.js
@@ -2,7 +2,7 @@
 
 import findWithRegex from 'find-with-regex';
 
-const MENTION_REGEX = /\@[\w]*/g;
+const MENTION_REGEX = /(\s|^)\@[\w]*/g;
 
 export default (contentBlock: Object, callback: Function) => {
   findWithRegex(MENTION_REGEX, contentBlock, callback);
diff --git a/draft-js-plugins-editor/src/Editor/index.js b/draft-js-plugins-editor/src/Editor/index.js
@@ -92,22 +92,38 @@ class PluginEditor extends Component {
 
   createPluginHooks = () => {
     const pluginHooks = {};
+    const eventHookKeys = [];
+    const fnHookKeys = [];
     const plugins = this.resolvePlugins();
 
     plugins.forEach((plugin) => {
       Object.keys(plugin).forEach((attrName) => {
         if (attrName === 'onChange') return;
 
-        if (attrName.indexOf('on') === 0 || attrName.indexOf('handle') === 0) {
-          pluginHooks[attrName] = this.createEventHooks(attrName, plugins);
+        // if `attrName` has been added as a hook key already, ignore this one
+        if (eventHookKeys.indexOf(attrName) !== -1 || fnHookKeys.indexOf(attrName) !== -1) return;
+
+        const isEventHookKey = attrName.indexOf('on') === 0 || attrName.indexOf('handle') === 0;
+        if (isEventHookKey) {
+          eventHookKeys.push(attrName);
+          return;
         }
 
-        // checks if the function ends with Fn
-        if (attrName.length - 2 === attrName.indexOf('Fn')) {
-          pluginHooks[attrName] = this.createFnHooks(attrName, plugins);
+        // checks if `attrName` ends with 'Fn'
+        const isFnHookKey = (attrName.length - 2 === attrName.indexOf('Fn'));
+        if (isFnHookKey) {
+          fnHookKeys.push(attrName);
         }
       });
     });
+
+    eventHookKeys.forEach((attrName) => {
+      pluginHooks[attrName] = this.createEventHooks(attrName, plugins);
+    });
+    fnHookKeys.forEach((attrName) => {
+      pluginHooks[attrName] = this.createFnHooks(attrName, plugins);
+    });
+
     return pluginHooks;
   };
 
diff --git a/package.json b/package.json
@@ -93,6 +93,7 @@
     "find-with-regex": "^1.0.2",
     "immutable": "^3.7.6",
     "linkify-it": "1.2.0",
+    "loader-utils": "^0.2.13",
     "tlds": "1.99.0",
     "union-class-names": "^1.0.0",
     "webpack": "^1.12.14"
