equal
deleted
inserted
replaced
2 |
2 |
3 import ReactDOM from 'react-dom' |
3 import ReactDOM from 'react-dom' |
4 import { Form, FormControl, FormGroup, Button } from 'react-bootstrap'; |
4 import { Form, FormControl, FormGroup, Button } from 'react-bootstrap'; |
5 |
5 |
6 import PropTypes from 'prop-types'; |
6 import PropTypes from 'prop-types'; |
|
7 import SlateEditor from './SlateEditor'; |
7 |
8 |
8 class NoteInput extends Component { |
9 class NoteInput extends Component { |
9 constructor(props) { |
10 constructor(props) { |
10 super(props); |
11 super(props); |
11 |
12 |
18 handleChange(event) { |
19 handleChange(event) { |
19 this.setState({value : event.target.value}); |
20 this.setState({value : event.target.value}); |
20 } |
21 } |
21 |
22 |
22 onAddNoteClick(event) { |
23 onAddNoteClick(event) { |
23 this.props.addNote(this.state.value); |
24 const text = this.refs.editor.asPlain(); |
24 |
25 this.props.addNote(text); |
25 this.noteInput.value = ""; |
26 this.refs.editor.clear(); |
26 |
|
27 this.noteInput.focus(); |
|
28 } |
27 } |
29 |
28 |
30 componentDidMount() { |
29 componentDidMount() { |
31 this.noteInput.focus(); |
30 // this.noteInput.focus(); |
32 } |
31 } |
33 |
32 |
34 render() { |
33 render() { |
35 return ( |
34 return ( |
36 <Form> |
35 <Form> |
37 <FormGroup> |
36 <FormGroup> |
38 <FormControl |
37 <SlateEditor ref="editor" /> |
39 componentClass="textarea" |
|
40 placeholder="Enter note" |
|
41 onChange={this.handleChange} |
|
42 ref={(input) => { this.noteInput = ReactDOM.findDOMNode(input); }} |
|
43 /> |
|
44 </FormGroup> |
38 </FormGroup> |
45 <Button type="button" onClick={this.onAddNoteClick}>Add Note</Button> |
39 <Button type="button" onClick={this.onAddNoteClick}>Add Note</Button> |
46 </Form> |
40 </Form> |
47 ); |
41 ); |
48 } |
42 } |