From e8e2afef63aff9c16906bb8bc38aa74992662def Mon Sep 17 00:00:00 2001
From: Gary Thomas <gary.thomas@appfolio.com>
Date: Sat, 4 Nov 2017 12:40:02 -0700
Subject: [PATCH 1/2] gt - Disallow setting type

- Add missing PropTypes from Input
---
 src/components/CreditCardNumber.js       | 8 +++++---
 test/components/CreditCardNumber.spec.js | 6 ++++++
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/components/CreditCardNumber.js b/src/components/CreditCardNumber.js
index effb8d3f9..0d3cef12c 100644
--- a/src/components/CreditCardNumber.js
+++ b/src/components/CreditCardNumber.js
@@ -25,6 +25,7 @@ function includes(array, value) {
 export default class CreditCardNumber extends React.Component {
 
   static propTypes = {
+    ...Input.propTypes,
     className: PropTypes.string,
     types: PropTypes.arrayOf(PropTypes.string),
     value: PropTypes.string,
@@ -32,6 +33,7 @@ export default class CreditCardNumber extends React.Component {
   };
 
   static defaultProps = {
+    ...Input.defaultProps,
     className: '',
     types: Object.keys(ICONS),
     onChange: () => {},
@@ -55,9 +57,9 @@ export default class CreditCardNumber extends React.Component {
 
   render() {
     /* eslint-disable  no-unused-vars */
-    const { className, onChange, types, value, ...inputProps } = this.props;
+    const { className, onChange, type, types, value, ...inputProps } = this.props;
 
-    const type = this.getType(value);
+    const ccType = this.getType(value);
 
     return (
       <InputGroup className={className}>
@@ -68,7 +70,7 @@ export default class CreditCardNumber extends React.Component {
         />
         <InputGroupAddon className="p-0 px-2">
           <Icon
-            name={typeToIconName(type)}
+            name={typeToIconName(ccType)}
             fixedWidth
             size="lg"
           />
diff --git a/test/components/CreditCardNumber.spec.js b/test/components/CreditCardNumber.spec.js
index 7d98f37aa..a2b8493ba 100644
--- a/test/components/CreditCardNumber.spec.js
+++ b/test/components/CreditCardNumber.spec.js
@@ -76,4 +76,10 @@ describe('<CreditCardNumber />', () => {
       sinon.assert.calledWith(onChange, cardNumber, undefined);
     });
   });
+
+  it('should remain type="text"', () => {
+    const component = mount(<CreditCardNumber type="wth" />);
+    const input = component.find('Input');
+    assert.equal(input.prop('type'), 'text');
+  });
 });

From 8942e263570052153f10666dc1a7dd710e70f2db Mon Sep 17 00:00:00 2001
From: Gary Thomas <gary.thomas@appfolio.com>
Date: Sat, 4 Nov 2017 15:48:53 -0700
Subject: [PATCH 2/2] gt - Correct FormRow passing component type to inputs

---
 src/components/FormRow.js       | 2 +-
 test/components/FormRow.spec.js | 4 +++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/FormRow.js b/src/components/FormRow.js
index f357521b1..ef933ea5f 100644
--- a/src/components/FormRow.js
+++ b/src/components/FormRow.js
@@ -79,7 +79,7 @@ const FormRow = props => {
               id={id}
               size={size}
               state={rowColor}
-              type={type}
+              type={typeof type === 'string' ? type : null}
               children={React.Children.map(children, child => React.cloneElement(child, { type }))}
               {...attributes}
               {...childFeedback}
diff --git a/test/components/FormRow.spec.js b/test/components/FormRow.spec.js
index 74df29f46..7a886ba83 100644
--- a/test/components/FormRow.spec.js
+++ b/test/components/FormRow.spec.js
@@ -201,7 +201,9 @@ describe('<FormRow />', () => {
     );
 
     it('should render custom input', () => {
-      assert.equal(component.find(Custom).length, 1);
+      const custom = component.find(Custom);
+      assert.equal(custom.length, 1);
+      assert.equal(custom.first().prop('type'), null);
     });
   });