From 57266d53bc00be6f3450d85248b273128367951d Mon Sep 17 00:00:00 2001
From: David Zukowski <zukoweb@gmail.com>
Date: Mon, 17 Apr 2017 10:18:31 -0500
Subject: [PATCH] fix(Input): replace disabled class with disabled attribute

---
 src/elements/Input/Input.js             |  3 ++-
 src/lib/htmlInputPropsUtils.js          |  6 +-----
 test/specs/elements/Input/Input-test.js | 13 ++++++++++++-
 3 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/src/elements/Input/Input.js b/src/elements/Input/Input.js
index 504b5722b1..bcde171a7c 100644
--- a/src/elements/Input/Input.js
+++ b/src/elements/Input/Input.js
@@ -162,7 +162,6 @@ class Input extends Component {
     const classes = cx(
       'ui',
       size,
-      useKeyOnly(disabled, 'disabled'),
       useKeyOnly(error, 'error'),
       useKeyOnly(fluid, 'fluid'),
       useKeyOnly(focus, 'focus'),
@@ -184,6 +183,8 @@ class Input extends Component {
     if (onChange) htmlInputProps.onChange = this.handleChange
     htmlInputProps.ref = this.handleInputRef
 
+    if (_.has(this.props, 'disabled')) htmlInputProps.disabled = disabled
+
     // tabIndex
     if (!_.isNil(tabIndex)) htmlInputProps.tabIndex = tabIndex
     else if (disabled) htmlInputProps.tabIndex = -1
diff --git a/src/lib/htmlInputPropsUtils.js b/src/lib/htmlInputPropsUtils.js
index 90c4413ec3..ad29cbef41 100644
--- a/src/lib/htmlInputPropsUtils.js
+++ b/src/lib/htmlInputPropsUtils.js
@@ -5,12 +5,8 @@ export const htmlInputAttrs = [
   'selected', 'defaultValue', 'defaultChecked',
 
   // LIMITED HTML PROPS
-  'autoCapitalize', 'autoComplete', 'autoCorrect', 'autoFocus', 'checked', 'form', 'max', 'maxLength', 'min',
+  'autoCapitalize', 'autoComplete', 'autoCorrect', 'autoFocus', 'checked', 'disabled', 'form', 'max', 'maxLength', 'min',
   'multiple', 'name', 'pattern', 'placeholder', 'readOnly', 'required', 'step', 'type', 'value',
-
-  // Heads Up!
-  // Do not pass disabled, it duplicates the SUI CSS opacity rule.
-  // 'disabled',
 ]
 
 export const htmlInputEvents = [
diff --git a/test/specs/elements/Input/Input-test.js b/test/specs/elements/Input/Input-test.js
index dd2f46d8c4..cdc43c699f 100644
--- a/test/specs/elements/Input/Input-test.js
+++ b/test/specs/elements/Input/Input-test.js
@@ -73,7 +73,6 @@ describe('Input', () => {
   })
 
   common.propKeyOnlyToClassName(Input, 'action')
-  common.propKeyOnlyToClassName(Input, 'disabled')
   common.propKeyOnlyToClassName(Input, 'error')
   common.propKeyOnlyToClassName(Input, 'fluid')
   common.propKeyOnlyToClassName(Input, 'focus')
@@ -204,6 +203,18 @@ describe('Input', () => {
     })
   })
 
+  describe('disabled', () => {
+    it('is applied to the underlying html input element', () => {
+      shallow(<Input disabled />)
+        .find('input')
+        .should.have.prop('disabled', true)
+
+      shallow(<Input disabled={false} />)
+        .find('input')
+        .should.have.prop('disabled', false)
+    })
+  })
+
   describe('tabIndex', () => {
     it('is not set by default', () => {
       shallow(<Input />)