From a30669afa618fa933a7f750ea7abc0baed12a5e0 Mon Sep 17 00:00:00 2001
From: dinukadesilva <l.dinukadesilva@gmail.com>
Date: Sat, 31 Mar 2018 22:51:11 +0530
Subject: [PATCH] gh-84: Addition additional states of contenteditable

This fixes #84
---
 lib/react-contenteditable.js | 36 +++++++++++++++++++++++++++++-------
 src/react-contenteditable.js | 24 +++++++++++++++++++++++-
 2 files changed, 52 insertions(+), 8 deletions(-)

diff --git a/lib/react-contenteditable.js b/lib/react-contenteditable.js
index d8c1aa3..7bd96cd 100644
--- a/lib/react-contenteditable.js
+++ b/lib/react-contenteditable.js
@@ -48,13 +48,35 @@ var ContentEditable = function (_React$Component) {
           html = _props.html,
           props = _objectWithoutProperties(_props, ['tagName', 'html']);
 
+      var contentEditableState = true;
+
+      if (this.props.plainTextOnly) {
+        contentEditableState = "plaintext-only";
+      }
+
+      if (this.props.typing) {
+        contentEditableState = "typing";
+      }
+
+      if (this.props.caret) {
+        contentEditableState = "caret";
+      }
+
+      if (this.props.events) {
+        contentEditableState = "events";
+      }
+
+      if (this.props.disabled) {
+        contentEditableState = false;
+      }
+
       return _react2.default.createElement(tagName || 'div', _extends({}, props, {
         ref: function ref(e) {
           return _this2.htmlEl = e;
         },
         onInput: this.emitChange,
         onBlur: this.props.onBlur || this.emitChange,
-        contentEditable: !this.props.disabled,
+        contentEditable: contentEditableState,
         dangerouslySetInnerHTML: { __html: html }
       }), this.props.children);
     }
@@ -100,12 +122,12 @@ var ContentEditable = function (_React$Component) {
       if (!this.htmlEl) return;
       var html = this.htmlEl.innerHTML;
       if (this.props.onChange && html !== this.lastHtml) {
-        // Clone event with Object.assign to avoid 
+        // Clone event with Object.assign to avoid
         // "Cannot assign to read only property 'target' of object"
-        var evt = Object.assign({}, evt, { 
-          target: { 
-            value: html 
-          } 
+        var evt = Object.assign({}, evt, {
+          target: {
+            value: html
+          }
         });
         this.props.onChange(evt);
       }
@@ -117,4 +139,4 @@ var ContentEditable = function (_React$Component) {
 }(_react2.default.Component);
 
 exports.default = ContentEditable;
-module.exports = exports['default'];
+module.exports = exports['default'];
\ No newline at end of file
diff --git a/src/react-contenteditable.js b/src/react-contenteditable.js
index c383d04..2370efc 100644
--- a/src/react-contenteditable.js
+++ b/src/react-contenteditable.js
@@ -11,6 +11,28 @@ export default class ContentEditable extends React.Component {
   render() {
     var { tagName, html, ...props } = this.props;
 
+    var contentEditableState = true;
+
+    if (this.props.plainTextOnly) {
+      contentEditableState = "plaintext-only"
+    }
+
+    if (this.props.typing) {
+      contentEditableState = "typing"
+    }
+
+    if (this.props.caret) {
+      contentEditableState = "caret"
+    }
+
+    if (this.props.events) {
+      contentEditableState = "events"
+    }
+
+    if (this.props.disabled) {
+      contentEditableState = false
+    }
+
     return React.createElement(
       tagName || 'div',
       {
@@ -18,7 +40,7 @@ export default class ContentEditable extends React.Component {
         ref: (e) => this.htmlEl = e,
         onInput: this.emitChange,
         onBlur: this.props.onBlur || this.emitChange,
-        contentEditable: !this.props.disabled,
+        contentEditable: contentEditableState,
         dangerouslySetInnerHTML: {__html: html}
       },
       this.props.children);