1import React from 'react' 2import PropTypes from 'prop-types' 3 4FileChooser.propTypes = { 5 icon: PropTypes.string, 6 text: PropTypes.string, 7 className: PropTypes.string, 8 title: PropTypes.string, 9 onOpenFile: PropTypes.func.isRequired 10} 11 12export default function FileChooser({ icon, text, className, title, onOpenFile }) { 13 let fileInput; 14 return ( 15 <a href='#' onClick={() => fileInput.click()} 16 className={className} 17 title={title}> 18 <i className={'fa fa-fw ' + icon}></i> 19 {text} 20 <input 21 ref={ref => fileInput = ref} 22 className="hidden" 23 type="file" 24 onChange={e => { e.preventDefault(); if(e.target.files.length > 0) onOpenFile(e.target.files[0]); fileInput.value="";}} 25 /> 26 </a> 27 ) 28} 29