Merge c1b4e47 into f5a08a0

olahol · Oct 20, 2015 · 0af7c0e · 0af7c0e
2 parents f5a08a0 + c1b4e47
commit 0af7c0e
Showing 1 changed file with 33 additions and 23 deletions.
diff --git a/react-tagsinput.js b/react-tagsinput.js
@@ -52,6 +52,18 @@
     }
   });
 
+  function standardLayout(tagNodes, inputElement) {
+    var ns = this.props.classNamespace === "" ? "" : this.props.classNamespace + "-";
+    return (
+      React.createElement("div", {
+        style: this.props.style
+        , className: this.props.classNames.div || ns + "tagsinput"
+        , onClick: this.handleClick
+      }, tagNodes, inputElement
+      )
+    );
+  }
+
   var TagsInput = React.createClass({
     propTypes: {
       value: React.PropTypes.array
@@ -82,6 +94,7 @@
       , renderTag: React.PropTypes.func
       , required: React.PropTypes.bool
       , maxTagLength: React.PropTypes.number
+      , layout: React.PropTypes.func
     }
 
     , getDefaultProps: function () {
@@ -107,6 +120,7 @@
         , transform: function (tag) { return tag.trim(); }
         , renderTag: null
         , required: false
+        , layout: standardLayout
       };
     }
 
@@ -329,29 +343,25 @@
       var hasTags = tagNodes.length;
       var needsTags = this.props.required && !hasTags;
 
-      return (
-        React.createElement("div", {
-          style: this.props.style,
-          className: this.props.classNames.div || ns + "tagsinput"
-          , onClick: this.handleClick
-        }, tagNodes, React.createElement(Input, {
-          ref: "input"
-          , ns: ns
-          , name: this.props.name
-          , classNames: this.props.classNames
-          , placeholder: this.props.placeholder
-          , value: this.state.tag
-          , invalid: this.state.invalid
-          , validating: this.state.validating
-          , onKeyDown: this.onKeyDown
-          , onKeyUp: this.props.onKeyUp
-          , onChange: this.onChange
-          , onBlur: this.onBlur
-          , onFocus: this.props.onFocus
-          , required: needsTags
-          , maxLength: this.props.maxTagLength
-        }))
-      );
+      var inputElement = React.createElement(Input, {
+        ref: "input"
+        , ns: ns
+        , name: this.props.name
+        , classNames: this.props.classNames
+        , placeholder: this.props.placeholder
+        , value: this.state.tag
+        , invalid: this.state.invalid
+        , validating: this.state.validating
+        , onKeyDown: this.onKeyDown
+        , onKeyUp: this.props.onKeyUp
+        , onChange: this.onChange
+        , onBlur: this.onBlur
+        , onFocus: this.props.onFocus
+        , required: needsTags
+        , maxLength: this.props.maxTagLength
+      });
+
+      return this.props.layout.call(this, tagNodes, inputElement);
     }
   });