diff --git a/README.md b/README.md index ec3e4e3..4ffa58f 100644 --- a/README.md +++ b/README.md @@ -7,7 +7,7 @@ - [x] RadioButton - [x] Password - [x] Select -- [ ] TextArea +- [x] TextArea - [ ] Button - [ ] File - [ ] Date diff --git a/src/Form/Form.js b/src/Form/Form.js index 7885173..74f161c 100644 --- a/src/Form/Form.js +++ b/src/Form/Form.js @@ -5,6 +5,7 @@ import Checkbox from '../Checkbox' import RadioButton from '../RadioButton' import Password from '../Password' import Select from '../Select' +import TextArea from '../TextArea' class Form extends PureComponent { render() { @@ -28,5 +29,6 @@ Form.Checkbox = Checkbox; Form.RadioButton = RadioButton; Form.Password = Password; Form.Select = Select; +Form.TextArea = TextArea; export default Form \ No newline at end of file diff --git a/src/TextArea/TextArea.js b/src/TextArea/TextArea.js new file mode 100644 index 0000000..774395a --- /dev/null +++ b/src/TextArea/TextArea.js @@ -0,0 +1,81 @@ +import React, { Component, createRef } from 'react' +import PropTypes from 'prop-types' +import { FormContext } from '../Form' + +class TextArea extends Component { + constructor(props) { + super(props); + this.elemRef = createRef(); + } + + componentDidMount() { + const { name } = this.props; + const { onMount } = this.context; + + onMount({ + name, + type: 'textarea', + ref: this.elemRef.current, + }); + } + + render() { + const { + name, + cols, + rows, + defaultValue, + value, + readOnly, + wrap, + disabled, + maxLength, + autoFocus, + placeholder, + required, + } = this.props; + + const { onChange } = this.context; + return ( +
+