added inputId attribute: input element ID (#3)

add an ID to the input element

README.md

@@ -42,6 +42,7 @@ class App extends Component {
         label="Select CSV with secret Death Star statistics"
         onFileLoaded={this.handleForce}
         onError={this.handleDarkSideForce}
+        inputId="ObiWan"
       />
     )
   }
@@ -58,6 +59,7 @@ ReactDOM.render(<App />, document.getElementById('root'))
 | label        | string, element |             | If present, it will be rendered in a `<label>` to describe input aim. |
 | onFileLoaded | function        |             | (**_required_**) The function to be called passing loaded results.    |
 | onError      | function        |             | Error handling function.                                              |
+| inputId      | string          |             | An id to be applied to the `<input>` element.                         |
 
 ### Results
 

src/index.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { string, func, element, oneOfType } from 'prop-types';
 const PapaParse = require('papaparse/papaparse.min.js');
 
-const CSVReader = ({ cssClass = 'csv-reader-input', label, onFileLoaded, onError }) => {
+const CSVReader = ({ cssClass = 'csv-reader-input', label, onFileLoaded, onError, inputId = null }) => {
   let fileContent = undefined;
 
   const handleChangeFile = e => {
@@ -22,7 +22,7 @@ const CSVReader = ({ cssClass = 'csv-reader-input', label, onFileLoaded, onError
   return (
     <div className={cssClass}>
       {label && <label>{label}</label>}
-      <input className="csv-input" type="file" accept="text/csv" onChange={e => handleChangeFile(e)} />
+      <input className="csv-input" type="file" id={inputId} accept="text/csv" onChange={e => handleChangeFile(e)} />
     </div>
   );
 };
@@ -31,7 +31,8 @@ CSVReader.propTypes = {
   cssClass: string,
   label: oneOfType([string, element]),
   onFileLoaded: func,
-  onError: func
+  onError: func,
+  inputId: string
 };
 
-export default CSVReader;
+export default CSVReader;