Added field for editing class on wrapper item.

kaivi · Mar 9, 2018 · 55972e0 · 55972e0
1 parent c4d42dc
commit 55972e0
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 6 deletions.
diff --git a/demo/demo.js b/demo/demo.js
@@ -20416,11 +20416,17 @@
 	        _this.render = function () {
 	            return _react2.default.createElement(
 	                'div',
-	                { key: _this.props.text },
+	                {
+	                    key: _this.props.text,
+	                    className: _this.props.className
+	                },
 	                _this.props.text,
 	                _react2.default.createElement(
 	                    'div',
-	                    { onClick: _this.remove, className: _this.props.className || "remove" },
+	                    {
+	                        onClick: _this.remove,
+	                        className: _this.props.className + '-remove'
+	                    },
 	                    ' \xD7 '
 	                )
 	            );
@@ -20547,7 +20553,7 @@
 	        };
 
 	        _this2.makeTagElement = function (text) {
-	            return _react2.default.createElement(RIETag, { key: text, text: text, removeHandler: _this2.removeTag });
+	            return _react2.default.createElement(RIETag, { className: _this2.props.wrapperEditing, key: text, text: text, removeHandler: _this2.removeTag });
 	        };
 
 	        _this2.renderEditingComponent = function () {
@@ -20581,7 +20587,8 @@
 	    blurDelay: _propTypes2.default.number,
 	    placeholder: _propTypes2.default.string,
 	    wrapper: _propTypes2.default.string,
-	    wrapperClass: _propTypes2.default.string
+	    wrapperClass: _propTypes2.default.string,
+	    wrapperEditing: _propTypes2.default.string
 	};
 	exports.default = RIETags;
 

diff --git a/src/RIETags.js b/src/RIETags.js
@@ -19,7 +19,16 @@ class RIETag extends React.Component {
     };
 
     render = () => {
-        return  <div key={this.props.text}>{this.props.text}<div onClick={this.remove} className={this.props.className || "remove"}> × </div></div>;
+        return  <div
+            key={this.props.text}
+            className={this.props.className}
+        >
+            {this.props.text}
+            <div
+                onClick={this.remove}
+                className={`${this.props.className}-remove`}
+            > × </div>
+        </div>;
     };
 }
 
@@ -41,6 +50,7 @@ export default class RIETags extends RIEStatefulBase {
         placeholder: PropTypes.string,
         wrapper: PropTypes.string,
         wrapperClass: PropTypes.string,
+        wrapperEditing: PropTypes.string,
     };
 
     addTag = (tag) => {
@@ -141,7 +151,7 @@ export default class RIETags extends RIEStatefulBase {
     };
 
     makeTagElement = (text) => {
-        return <RIETag key={text} text={text} removeHandler={this.removeTag} />;
+        return <RIETag className={this.props.wrapperEditing} key={text} text={text} removeHandler={this.removeTag} />;
     };
 
     renderEditingComponent = () => {