selectinput now using base HOC

src/SelectInput.js

-import React, { Component } from 'react';
-import { Input, Label } from 'reactstrap';
+import React from 'react';
+import { Input } from 'reactstrap';
 import PropTypes from 'prop-types';
 
-import newId from './utils/newId';
-
-class SelectInput extends React.Component {
-  constructor(props) {
-    super(props);
-
-    this.handleChange = this.handleChange.bind(this);
-    this.state = {
-      uuid: newId('textInput'),
-      value: this.props.value,
-    };
-  }
-
-  getDescriptionElements() {
-    let descriptionElements = {};
-    if (this.props.description) {
-      const descriptionId = `description-${this.state.uuid}"`;
-
-      descriptionElements = {
-        descriptionId,
-        description: (
-          <span className="input-description" id={descriptionId}>
-            {this.props.description}
-          </span>
-        ),
-      };
-    }
-    return descriptionElements;
-  }
-
-  handleChange(event) {
-    this.setState({ value: event.target.value });
-    this.props.onChange(event.target.value, this.props.name);
-  }
+import asInput from './utils/asInput';
 
+class Select extends React.Component {
   getOption(option, i) {
     let { label, value } = option;
 
@@ -67,46 +35,30 @@ class SelectInput extends React.Component {
   }
 
   render() {
-    const { descriptionId, description } = this.getDescriptionElements(),
+    const props = { ...this.props },
       options = this.getOptions();
 
     return (
-      <div className={this.props.className}>
-        <Label for={this.state.uuid}>{this.props.label}</Label>
-        <Input
-          id={this.state.uuid}
-          type="select"
-          name={this.props.name}
-          value={this.state.value}
-          aria-describedby={descriptionId}
-          onChange={this.handleChange}
-        >
-          {options}
-        </Input>
-        {description}
-      </div>
+      <Input
+        id={this.props.id}
+        type="select"
+        name={this.props.name}
+        value={this.props.value}
+        aria-describedby={props.describedBy}
+        onChange={props.onChange}
+        onBlur={props.onBlur}
+      >
+        {options}
+      </Input>
     );
   }
 }
 
-SelectInput.propTypes = {
-  label: PropTypes.string.isRequired,
-  name: PropTypes.string.isRequired,
-  value: PropTypes.oneOfType([
-    PropTypes.string,
-    PropTypes.number,
-  ]),
-  description: PropTypes.oneOfType([
-    PropTypes.string,
-    PropTypes.element,
-  ]),
-  options: PropTypes.array.isRequired,
-  disabled: PropTypes.bool,
-  onChange: PropTypes.func,
-};
+const SelectInput = asInput(Select);
 
-SelectInput.defaultProps = {
-  onChange: () => {},
+SelectInput.propTypes = {
+  ...SelectInput.propTypes,
+  options: PropTypes.array.isRequired
 };
 
 export default SelectInput;

src/TextInput.js

@@ -23,9 +23,4 @@ function TextField(props) {
 
 const TextInput = asInput(TextField);
 
-TextInput.defaultProps = {
-  onChange: () => {},
-  value: '',
-};
-
 export default TextInput;

src/utils/asInput.js

@@ -98,6 +98,11 @@ const asInput = (WrappedComponent) => {
     onChange: PropTypes.func,
   };
 
+  NewComponent.defaultProps = {
+    onChange: () => {},
+    value: '',
+  };
+
   return NewComponent;
 };
 

yarn.lock

@@ -2571,7 +2571,7 @@ faye-websocket@~0.11.0:
   dependencies:
     websocket-driver ">=0.5.1"
 
-fbjs@^0.8.9:
+fbjs@^0.8.4, fbjs@^0.8.9:
   version "0.8.12"
   resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.12.tgz#10b5d92f76d45575fd63a217d4ea02bea2f8ed04"
   dependencies:
@@ -4415,7 +4415,7 @@ promise@^7.1.1:
   dependencies:
     asap "~2.0.3"
 
-prop-types@^15.5.4, prop-types@^15.5.7, prop-types@^15.5.8:
+prop-types@^15.5.4, prop-types@^15.5.7, prop-types@^15.5.8, prop-types@~15.5.7:
   version "15.5.8"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.5.8.tgz#6b7b2e141083be38c8595aa51fc55775c7199394"
   dependencies:
@@ -4505,6 +4505,20 @@ rc@^1.1.7:
     minimist "^1.2.0"
     strip-json-comments "~2.0.1"
 
+react-addons-css-transition-group@^15.5.2:
+  version "15.5.2"
+  resolved "https://registry.yarnpkg.com/react-addons-css-transition-group/-/react-addons-css-transition-group-15.5.2.tgz#ea7e0a9f0e1c27ca426da4efd3559915bd42ead2"
+  dependencies:
+    fbjs "^0.8.4"
+    object-assign "^4.1.0"
+
+react-addons-transition-group@^15.5.2:
+  version "15.5.2"
+  resolved "https://registry.yarnpkg.com/react-addons-transition-group/-/react-addons-transition-group-15.5.2.tgz#da6989d9cffe27dffacaedc862000ffb09ae2206"
+  dependencies:
+    fbjs "^0.8.4"
+    object-assign "^4.1.0"
+
 react-docgen@^2.12.1:
   version "2.15.0"
   resolved "https://registry.yarnpkg.com/react-docgen/-/react-docgen-2.15.0.tgz#11aced462256e4862b14e6af6e46bdcefacb28bb"
@@ -4517,6 +4531,15 @@ react-docgen@^2.12.1:
     node-dir "^0.1.10"
     recast "^0.11.5"
 
+react-dom@^15.5.4:
+  version "15.5.4"
+  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-15.5.4.tgz#ba0c28786fd52ed7e4f2135fe0288d462aef93da"
+  dependencies:
+    fbjs "^0.8.9"
+    loose-envify "^1.1.0"
+    object-assign "^4.1.0"
+    prop-types "~15.5.7"
+
 react-fuzzy@^0.3.3:
   version "0.3.3"
   resolved "https://registry.yarnpkg.com/react-fuzzy/-/react-fuzzy-0.3.3.tgz#9f6775393cd03bbd3c977651771abe16c8b29a81"
@@ -4596,6 +4619,15 @@ react-stubber@^1.0.0:
   dependencies:
     babel-runtime "^6.5.0"
 
+react@^15.5.4:
+  version "15.5.4"
+  resolved "https://registry.yarnpkg.com/react/-/react-15.5.4.tgz#fa83eb01506ab237cdc1c8c3b1cea8de012bf047"
+  dependencies:
+    fbjs "^0.8.9"
+    loose-envify "^1.1.0"
+    object-assign "^4.1.0"
+    prop-types "^15.5.7"
+
 reactstrap-tether@1.3.4:
   version "1.3.4"
   resolved "https://registry.yarnpkg.com/reactstrap-tether/-/reactstrap-tether-1.3.4.tgz#86d94d30216ffa34ceb2c626f4b9912c0d193894"