diff --git a/src/FormControls/Static.js b/src/FormControls/Static.js new file mode 100644 index 0000000000..3f0f4a40a3 --- /dev/null +++ b/src/FormControls/Static.js @@ -0,0 +1,26 @@ +import React from 'react'; +import classNames from 'classnames'; +import InputBase from '../InputBase'; +import childrenValueValidation from '../utils/childrenValueInputValidation'; + +class Static extends InputBase { + getValue() { + const {children, value} = this.props; + return children ? children : value; + } + + renderInput() { + return ( +

+ {this.getValue()} +

+ ); + } +} + +Static.propTypes = { + value: childrenValueValidation, + children: childrenValueValidation +}; + +export default Static; diff --git a/src/FormControls/index.js b/src/FormControls/index.js new file mode 100644 index 0000000000..5a7c16286e --- /dev/null +++ b/src/FormControls/index.js @@ -0,0 +1,5 @@ +import Static from './Static'; + +export default { + Static +}; diff --git a/src/Input.js b/src/Input.js index 6cd7c47776..fa516a4ee4 100644 --- a/src/Input.js +++ b/src/Input.js @@ -1,6 +1,7 @@ import React from 'react'; import InputBase from './InputBase'; import ButtonInput from './ButtonInput'; +import FormControls from './FormControls'; import deprecationWarning from './utils/deprecationWarning'; class Input extends InputBase { @@ -8,6 +9,9 @@ class Input extends InputBase { if (ButtonInput.types.indexOf(this.props.type) > -1) { deprecationWarning(`Input type=${this.props.type}`, 'ButtonInput'); return ; + } else if (this.props.type === 'static') { + deprecationWarning('Input type=static', 'StaticText'); + return ; } return super.render(); diff --git a/src/index.js b/src/index.js index 118bacd7d9..2844c7ae9a 100644 --- a/src/index.js +++ b/src/index.js @@ -19,6 +19,7 @@ import DropdownButton from './DropdownButton'; import DropdownMenu from './DropdownMenu'; import DropdownStateMixin from './DropdownStateMixin'; import FadeMixin from './FadeMixin'; +import FormControls from './FormControls'; import Glyphicon from './Glyphicon'; import Grid from './Grid'; import Input from './Input'; @@ -75,6 +76,7 @@ export default { DropdownMenu, DropdownStateMixin, FadeMixin, + FormControls, Glyphicon, Grid, Input, diff --git a/test/FormControlsSpec.js b/test/FormControlsSpec.js new file mode 100644 index 0000000000..cc56ecd618 --- /dev/null +++ b/test/FormControlsSpec.js @@ -0,0 +1,37 @@ +import React from 'react'; +import ReactTestUtils from 'react/lib/ReactTestUtils'; +import FormControls from '../src/FormControls'; + +describe('Form Controls', function () { + describe('Static', function () { + it('renders a p element wrapped around the given value', function () { + const instance = ReactTestUtils.renderIntoDocument( + + ); + + const result = ReactTestUtils.findRenderedDOMComponentWithTag(instance, 'p'); + result.props.children.should.equal('v'); + }); + + it('getValue() pulls from either value or children', function () { + let instance = ReactTestUtils.renderIntoDocument( + + ); + + instance.getValue().should.equal('v'); + + instance = ReactTestUtils.renderIntoDocument( + 5 + ); + + instance.getValue().should.equal('5'); + }); + + it('throws an error if both value and children are provided', function () { + const testData = { value: 'blah', children: 'meh' }; + const result = FormControls.Static.propTypes.children(testData, 'children', 'Static'); + + result.should.be.instanceOf(Error); + }); + }); +}); diff --git a/test/InputSpec.js b/test/InputSpec.js index 065ff1824c..3a73cba5cf 100644 --- a/test/InputSpec.js +++ b/test/InputSpec.js @@ -65,13 +65,12 @@ describe('Input', function () { shouldWarn('deprecated'); }); - it('renders a p element when type=static', function () { - let instance = ReactTestUtils.renderIntoDocument( + it('throws a warning when type=static', function () { + ReactTestUtils.renderIntoDocument( ); - assert.ok(ReactTestUtils.findRenderedDOMComponentWithTag(instance, 'p')); - assert.equal(instance.getValue(), 'v'); + shouldWarn('deprecated'); }); it('renders an input element of given type when type is anything else', function () {