Refactor class list generation in `Input` component

components/input/index.jsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import classNames from 'classnames-minimal';
 import style from './style';
 import FontIcon from '../font_icon';
 import Tooltip from '../tooltip';
@@ -41,14 +42,19 @@ class Input extends React.Component {
   }
 
   render () {
-    let className = style.root;
-    let labelClassName = style.label;
-    if (this.props.error) className += ` ${style.errored}`;
-    if (this.props.disabled) className += ` ${style.disabled}`;
-    if (this.props.className) className += ` ${this.props.className}`;
-    if (this.props.type === 'hidden') className += ` ${style.hidden}`;
-    if (this.props.icon) className += ` ${style['with-icon']}`;
-    if (!this.props.floating) labelClassName += ` ${style.fixed}`;
+    const className = classNames({
+      [style.root]: true,
+      [style.errored]: this.props.error,
+      [style.disabled]: this.props.disabled,
+      [this.props.className]: this.props.className,
+      [style.hidden]: this.props.type === 'hidden',
+      [style['with-icon']]: this.props.icon
+    });
+
+    const labelClassName = classNames({
+      [style.label]: true,
+      [style.fixed]: !this.props.floating
+    });
 
     return (
       <div data-react-toolbox='input' className={className}>

package.json

@@ -56,6 +56,7 @@
     "babel-eslint": "^4.1.3",
     "babel-loader": "^5.3.2",
     "babel-plugin-react-transform": "^1.1.1",
+    "classnames-minimal": "^1.0.0",
     "core-js": "^1.2.6",
     "cross-env": "^1.0.4",
     "cpx": "^1.2.1",