Spaces:
Running
Running
File size: 1,620 Bytes
f2bee8a |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 |
import PropTypes from 'prop-types';
import React from 'react';
import styles from './question.css';
import Input from '../forms/input.jsx';
import enterIcon from './icon--enter.svg';
const QuestionComponent = props => {
const {
answer,
className,
question,
onChange,
onClick,
onKeyPress
} = props;
return (
<div className={className}>
<div className={styles.questionContainer}>
{question ? (
<div className={styles.questionLabel}>{question}</div>
) : null}
<div className={styles.questionInput}>
<Input
autoFocus
value={answer}
onChange={onChange}
onKeyPress={onKeyPress}
/>
<button
className={styles.questionSubmitButton}
onClick={onClick}
>
<img
className={styles.questionSubmitButtonIcon}
draggable={false}
src={enterIcon}
/>
</button>
</div>
</div>
</div>
);
};
QuestionComponent.propTypes = {
answer: PropTypes.string,
className: PropTypes.string,
onChange: PropTypes.func.isRequired,
onClick: PropTypes.func.isRequired,
onKeyPress: PropTypes.func.isRequired,
question: PropTypes.string
};
export default QuestionComponent;
|