import React from 'react' ; import styles from '../Form.module.scss' ; import { IconDefinition } from '@fortawesome/fontawesome-svg-core' ; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' ; import classnames from 'classnames' ; interface LabelButton { name : string ; icon : IconDefinition ; onClick : ( ) => void ; } interface Props { shortName : string ; name ? : string ; horizontal ? : boolean ; buttons ? : LabelButton [ ] ; } const InputLabel = ( { shortName , name , horizontal , buttons , children } ) => < label htmlFor = { shortName } className = { classnames ( styles . input , { [ styles . horizontal ] : horizontal , } ) } > { name && < div className = { styles . inputLabel } > < span > { name } < /span> { buttons && < span className = { styles . inputLabelButtonWrapper } > { buttons . map ( ( button , i ) => < FontAwesomeIcon icon = { button . icon } title = { button . name } className = { styles . inputLabelButton } key = { i } onClick = { ( e ) => { e . preventDefault ( ) ; button . onClick ( ) ; } } / > ) } < /span>} < /div>} { children } < /label>; export default InputLabel ;