Skip to content

Commit

Permalink
- Requiring Codemirror outside of a browser context results in errors…
Browse files Browse the repository at this point in the history
…. In order to support server rendering, this lazily requires SimpleMDE (which uses Codemirror under the hood) from React component lifecycle events.

- Workaround to achieve sync in client-server ID's by giving ability to set up custom ID's as props added.
- Initial value was missing in textbox when redirect using react-router with already prepared state. `initialValue` option is mapped to `this.props.value ` on SimpleMDE instance creation.
- Readme typo with `value` inside in `options` fixed to avoid confusion
-.editorconfig added to keep consistency in code indentation rules etc.

Fixes #27 #29  #30
  • Loading branch information
RIP21 committed Nov 29, 2016
1 parent 35ff4da commit b3c7315
Show file tree
Hide file tree
Showing 3 changed files with 20 additions and 4 deletions.
10 changes: 10 additions & 0 deletions .editorconfig
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
[*]
indent_style = space
end_of_line = lf
indent_size = 2
charset = utf-8
trim_trailing_whitespace = true

[*.md]
max_line_length = 0
trim_trailing_whitespace = false
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -59,10 +59,10 @@ var SimpleMDE = require('react-simplemde-editor');

<SimpleMDE
onChange={this.handleChange}
value={this.state.textValue}
options={{
autofocus: true,
spellChecker: false,
value: this.state.textValue
// etc.
}}
/>
Expand Down
12 changes: 9 additions & 3 deletions src/index.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
const React = require('react');
const SimpleMDE = require('simplemde/dist/simplemde.min');
const generateId = require('./services/idGenerator');
const NOOP = require('./utils/noop');

Expand All @@ -19,7 +18,12 @@ module.exports = React.createClass({
},

componentWillMount: function() {
this.id = generateId();
const id = this.props.id;
if (id) {
this.id = id;
} else {
this.id = generateId();
}
},

componentDidMount: function() {
Expand All @@ -43,8 +47,10 @@ module.exports = React.createClass({
},

createEditor: function() {
const SimpleMDE = require('simplemde/src/js/simplemde.js');
const initialOptions = {
element: document.getElementById(this.id)
element: document.getElementById(this.id),
initialValue: this.props.value
};

const allOptions = Object.assign({}, initialOptions, this.props.options);
Expand Down

0 comments on commit b3c7315

Please sign in to comment.