[added] bsSize prop to Input, supporting input groups

This allows for specifying a size, such as 'small' or 'large', such as:

    <Input
      type="text"
      placeholder="Search"
      bsSize="small"
      buttonAfter={<Button><Glyphicon glyph="search" /></Button>}
      />

(Input groups are enabled whenever these props have values:
addonBefore, addonAfter, buttonBefore, or buttonAfter)

This maps to the "input-group-sm" and "input-group-lg" classes as documented here:
http://getbootstrap.com/components/#input-groups-sizing

Author: Matthew Scott

src/Input.jsx

@@ -4,6 +4,7 @@ var classSet = require('./utils/classSet');
 var Button = require('./Button');
 
 var Input = React.createClass({
+
   propTypes: {
     type: React.PropTypes.string,
     label: React.PropTypes.node,
@@ -12,6 +13,7 @@ var Input = React.createClass({
     addonAfter: React.PropTypes.node,
     buttonBefore: React.PropTypes.node,
     buttonAfter: React.PropTypes.node,
+    bsSize: React.PropTypes.oneOf(['small', 'medium', 'large']),
     bsStyle: function(props) {
       if (props.type === 'submit') {
         // Return early if `type=submit` as the `Button` component
@@ -140,8 +142,14 @@ var Input = React.createClass({
       </span>
     ) : null;
 
+    var inputGroupClassName;
+    switch (this.props.bsSize) {
+      case 'small': inputGroupClassName = 'input-group-sm'; break;
+      case 'large': inputGroupClassName = 'input-group-lg'; break;
+    }
+
     return addonBefore || addonAfter || buttonBefore || buttonAfter ? (
-      <div className="input-group" key="input-group">
+      <div className={joinClasses(inputGroupClassName, 'input-group')} key="input-group">
         {addonBefore}
         {buttonBefore}
         {children}

test/InputSpec.jsx

@@ -123,6 +123,22 @@ describe('Input', function () {
     assert.ok(ReactTestUtils.findRenderedDOMComponentWithClass(instance, 'input-group-addon'));
   });
 
+  it('renders input-group with sm or lg class name when bsSize is small or large', function () {
+    var instance = ReactTestUtils.renderIntoDocument(
+      <Input addonBefore="$" bsSize="small" />
+    );
+
+    assert.ok(ReactTestUtils.findRenderedDOMComponentWithClass(instance, 'input-group'));
+    assert.ok(ReactTestUtils.findRenderedDOMComponentWithClass(instance, 'input-group-sm'));
+
+    instance = ReactTestUtils.renderIntoDocument(
+      <Input addonBefore="$" bsSize="large" />
+    );
+
+    assert.ok(ReactTestUtils.findRenderedDOMComponentWithClass(instance, 'input-group'));
+    assert.ok(ReactTestUtils.findRenderedDOMComponentWithClass(instance, 'input-group-lg'));
+  });
+
   it('renders btn-group', function() {
     var instance = ReactTestUtils.renderIntoDocument(
       <Input buttonAfter={<Button>!</Button>} />