SCLD-17783 Removes usage of deprecated draftjs props

.eslintrc

@@ -9,6 +9,8 @@
     "it": true
   },
   "rules": {
+    "comma-dangle": "off",
+    "quotes": ["error", "double"],
     "react/jsx-filename-extension": 0,
     "react/forbid-prop-types": 0,
     "react/no-array-index-key": 0,

.gitignore

@@ -5,4 +5,5 @@ dist
 docs/.yalc/
 docs/yalc.lock
 stats.json
-report.html
+report.html
+.idea/

README.md

@@ -4,4 +4,4 @@ This is a fork of https://github.com/jpuri/react-draft-wysiwyg used to get a wor
 
 We reverted to an earlier version due to a problem with a bugfix on v1.15.0 and the forked bugfix breaking ui unit tests
 
-More details on problems with various verisons of the source repo: https://blinemedical.atlassian.net/browse/SCLD-10296
+More details on problems with various versions of the source repo: https://blinemedical.atlassian.net/browse/SCLD-10296

package.json

@@ -58,6 +58,7 @@
   "dependencies": {
     "classnames": "^2.2.6",
     "draftjs-utils": "^0.10.2",
+    "fbjs": "^1.0.0",
     "html-to-draftjs": "^1.5.0",
     "linkify-it": "^2.2.0",
     "prop-types": "^15.7.2"

src/Editor/index.js

@@ -10,6 +10,7 @@ import {
   convertFromRaw,
   CompositeDecorator
 } from "draft-js";
+import getDefaultKeyBinding from "draft-js/lib/getDefaultKeyBinding";
 import {
   changeDepth,
   handleNewLine,
@@ -18,7 +19,9 @@ import {
   extractInlineStyle,
   getSelectedBlocksType
 } from "draftjs-utils";
+import Keys from "fbjs/lib/Keys";
 import classNames from "classnames";
+import { DraftEditorCommand } from "draft-js/lib/DraftEditorCommand";
 import ModalHandler from "../event-handler/modals";
 import FocusHandler from "../event-handler/focus";
 import KeyDownHandler from "../event-handler/keyDown";
@@ -196,6 +199,21 @@ export default class WysiwygEditor extends Component {
     this.focusHandler.onEditorMouseDown();
   };
 
+  keyBindingFn: Function = (e): ?DraftEditorCommand => {
+    // eslint-disable-next-line default-case
+    switch (e.keyCode) {
+      case Keys.TAB:
+        this.onTab(e);
+        break;
+      case Keys.UP:
+      case Keys.DOWN:
+        this.onUpDownArrow(e);
+        break;
+    }
+
+    return getDefaultKeyBinding(e);
+  }
+
   onTab: Function = (event): boolean => {
     const { onTab } = this.props;
     if (!onTab || !onTab(event)) {
@@ -519,7 +537,7 @@ export default class WysiwygEditor extends Component {
             toolbarCustomButtons.map((button, index) =>
               React.cloneElement(button, { key: index, ...controlProps })
             )}
-        </div>  
+        </div>
         )}
         <div
           ref={this.setWrapperReference}
@@ -533,9 +551,7 @@ export default class WysiwygEditor extends Component {
         >
           <Editor
             ref={this.setEditorReference}
-            onTab={this.onTab}
-            onUpArrow={this.onUpDownArrow}
-            onDownArrow={this.onUpDownArrow}
+            keyBindingFn={this.keyBindingFn}
             editorState={editorState}
             onChange={this.onChange}
             blockStyleFn={blockStyleFn}