New: HintedSelectInput Component

Co-Authored-By: taloth <taloth@users.noreply.github.com>
This commit is contained in:
Qstick 2019-08-04 22:05:13 -04:00
parent 9ca81eb320
commit 52ec4c4a66
10 changed files with 170 additions and 17 deletions

View file

@ -0,0 +1,44 @@
import PropTypes from 'prop-types';
import React from 'react';
import classNames from 'classnames';
import EnhancedSelectInputOption from './EnhancedSelectInputOption';
import styles from './HintedSelectInputOption.css';
function HintedSelectInputOption(props) {
const {
value,
hint,
isMobile,
...otherProps
} = props;
return (
<EnhancedSelectInputOption
isMobile={isMobile}
{...otherProps}
>
<div className={classNames(
styles.optionText,
isMobile && styles.isMobile
)}
>
<div>{value}</div>
{
hint != null &&
<div className={styles.hintText}>
{hint}
</div>
}
</div>
</EnhancedSelectInputOption>
);
}
HintedSelectInputOption.propTypes = {
value: PropTypes.string.isRequired,
hint: PropTypes.node,
isMobile: PropTypes.bool.isRequired
};
export default HintedSelectInputOption;