From 4cd58455547e630b12ffd2fcea5da022e25de59c Mon Sep 17 00:00:00 2001
From: Arno Fortelny <arno.fortelny@gmail.com>
Date: Thu, 7 May 2015 18:21:36 -0400
Subject: [PATCH] [added] FormGroup/Input bsSize now propgates correctly as
 form-group-\* classes

---
 docs/examples/InputSizes.js |  9 +++++++++
 docs/src/ComponentsPage.js  |  3 +++
 docs/src/Samples.js         |  1 +
 src/FormGroup.js            |  8 +++++++-
 test/FormGroupSpec.js       | 18 ++++++++++++++++++
 5 files changed, 38 insertions(+), 1 deletion(-)
 create mode 100644 docs/examples/InputSizes.js

diff --git a/docs/examples/InputSizes.js b/docs/examples/InputSizes.js
new file mode 100644
index 0000000000..a36ffaedae
--- /dev/null
+++ b/docs/examples/InputSizes.js
@@ -0,0 +1,9 @@
+const inputSizeInstance = (
+  <form>
+    <Input type='text' bsSize="large" placeholder='Large text' />
+    <Input type='text' bsSize="medium" placeholder='Normal text' />
+    <Input type='text' bsSize="small" placeholder='Small text' />
+  </form>
+);
+
+React.render(inputSizeInstance, mountNode);
diff --git a/docs/src/ComponentsPage.js b/docs/src/ComponentsPage.js
index ba2dbde570..4382c9805b 100644
--- a/docs/src/ComponentsPage.js
+++ b/docs/src/ComponentsPage.js
@@ -561,6 +561,9 @@ const ComponentsPage = React.createClass({
                   <p>Use <code>addonBefore</code> and <code>addonAfter</code> for normal addons, <code>buttonBefore</code> and <code>buttonAfter</code> for button addons.
                   Exotic configurations may require some css on your side.</p>
                   <ReactPlayground codeText={Samples.InputAddons} />
+                  <h2 id='input-sizes'>Sizes</h2>
+                  <p>Use <code>bsSize</code> to change the size of inputs. It also works with addons and most other options.</p>
+                  <ReactPlayground codeText={Samples.InputSizes} />
                   <h2 id='input-validation'>Validation</h2>
                   <p>Set <code>bsStyle</code> to one of <code>success</code>, <code>warning</code> or <code>error</code>.
                   Add <code>hasFeedback</code> to show glyphicon. Glyphicon may need additional styling if there is an add-on or no label.</p>
diff --git a/docs/src/Samples.js b/docs/src/Samples.js
index 004fe581d7..d4821d9d10 100644
--- a/docs/src/Samples.js
+++ b/docs/src/Samples.js
@@ -84,6 +84,7 @@ export default {
   Input:                         require('fs').readFileSync(__dirname + '/../examples/Input.js', 'utf8'),
   InputTypes:                    require('fs').readFileSync(__dirname + '/../examples/InputTypes.js', 'utf8'),
   InputAddons:                   require('fs').readFileSync(__dirname + '/../examples/InputAddons.js', 'utf8'),
+  InputSizes:                    require('fs').readFileSync(__dirname + '/../examples/InputSizes.js', 'utf8'),
   InputValidation:               require('fs').readFileSync(__dirname + '/../examples/InputValidation.js', 'utf8'),
   InputHorizontal:               require('fs').readFileSync(__dirname + '/../examples/InputHorizontal.js', 'utf8'),
   InputWrapper:                  require('fs').readFileSync(__dirname + '/../examples/InputWrapper.js', 'utf8')
diff --git a/src/FormGroup.js b/src/FormGroup.js
index f117c902c2..fd2e33ccd5 100644
--- a/src/FormGroup.js
+++ b/src/FormGroup.js
@@ -28,7 +28,13 @@ FormGroup.defaultProps = {
 FormGroup.propTypes = {
   standalone: React.PropTypes.bool,
   hasFeedback: React.PropTypes.bool,
-  bsSize: React.PropTypes.oneOf(['small', 'medium', 'large']),
+  bsSize (props) {
+    if (props.standalone) {
+      return new Error('bsSize will not be used when `standalone` is set.');
+    }
+
+    return React.PropTypes.oneOf(['small', 'medium', 'large']).apply(null, arguments);
+  },
   bsStyle: React.PropTypes.oneOf(['success', 'warning', 'error']),
   groupClassName: React.PropTypes.string
 };
diff --git a/test/FormGroupSpec.js b/test/FormGroupSpec.js
index c4aa006901..f705e3945a 100644
--- a/test/FormGroupSpec.js
+++ b/test/FormGroupSpec.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import ReactTestUtils from 'react/lib/ReactTestUtils';
 import FormGroup from '../src/FormGroup';
+import {shouldWarn} from './helpers';
 
 describe('FormGroup', function() {
   it('renders children', function() {
@@ -45,6 +46,14 @@ describe('FormGroup', function() {
     assert.ok(ReactTestUtils.findRenderedDOMComponentWithClass(instance, 'form-group-lg'));
   });
 
+  it('throws warning about bsSize when standalone', function () {
+    ReactTestUtils.renderIntoDocument(
+      <FormGroup standalone bsSize="large" />
+    );
+
+    shouldWarn('Failed propType: bsSize');
+  });
+
   it('renders no form-group class when standalone', function() {
     let instance = ReactTestUtils.renderIntoDocument(
       <FormGroup standalone>
@@ -55,6 +64,15 @@ describe('FormGroup', function() {
     assert.equal(ReactTestUtils.scryRenderedDOMComponentsWithClass(instance, 'form-group').length, 0);
   });
 
+  it('renders no form-group-* class when standalone', function () {
+    let instance = ReactTestUtils.renderIntoDocument(
+      <FormGroup standalone bsSize="large" />
+    );
+
+    assert.equal(ReactTestUtils.scryRenderedDOMComponentsWithClass(instance, 'form-group').length, 0);
+    assert.equal(ReactTestUtils.scryRenderedDOMComponentsWithClass(instance, 'form-group-lg').length, 0);
+  });
+
   [{
     className: 'has-feedback',
     props: { hasFeedback: true }