diff --git a/Example/components/ExampleWithOnChangeContent.js b/Example/components/ExampleWithOnChangeContent.js
index 48646a7..b1f194c 100644
--- a/Example/components/ExampleWithOnChangeContent.js
+++ b/Example/components/ExampleWithOnChangeContent.js
@@ -16,7 +16,9 @@ var ExampleWithOnChangeContent = React.createClass({
+ onContentChange={this._onContentChange}
+ editMode
+ />
);
},
diff --git a/README.md b/README.md
index 57d78ed..c99788a 100644
--- a/README.md
+++ b/README.md
@@ -52,6 +52,7 @@ React.render(, document.getElementById('content'));
Optional props:
- ```onContentChange```, function to be called on each content change, getting the new content as an argument (as the property name says!)
+ - ```editMode```, can choose whether to initialize markdown editor with edit mode or preview mode. `true` by default
- ```styles```, see [Styling](#styling) below
You can also listen to content changes on the editor. If you are using Reflux, by listening to the changes on ```MarkdownEditorContentStore```.
diff --git a/src/MarkdownEditor.js b/src/MarkdownEditor.js
index 4a62bc4..e4be75c 100644
--- a/src/MarkdownEditor.js
+++ b/src/MarkdownEditor.js
@@ -33,12 +33,13 @@ var MarkdownEditor = React.createClass({
initialContent: React.PropTypes.string.isRequired,
iconsSet: React.PropTypes.oneOf(['font-awesome', 'materialize-ui']).isRequired,
onContentChange: React.PropTypes.func,
- editorTabs: React.PropTypes.bool
+ editorTabs: React.PropTypes.bool,
+ editMode: React.PropTypes.bool
},
getInitialState: function() {
- var uniqueInstanceRef = Math.random().toString(36).substring(7)
- return {content: this.props.initialContent, inEditMode: true, instanceRef: uniqueInstanceRef};
+ var uniqueInstanceRef = Math.random().toString(36).substring(7);
+ return {content: this.props.initialContent, inEditMode: this.props.editMode, instanceRef: uniqueInstanceRef};
},
render: function() {
@@ -71,7 +72,8 @@ var MarkdownEditor = React.createClass({
{editorMenu}
+ styleActiveTab: this.props.styles.styleActiveTab}}
+ editMode={this.state.inEditMode} />
{divContent}
@@ -177,7 +179,8 @@ MarkdownEditor.defaultProps = {
'right': '20px',
'top': '10px'
}
- }
+ },
+ editMode: true
}
module.exports = MarkdownEditor;
diff --git a/src/components/MarkdownEditorTabs.js b/src/components/MarkdownEditorTabs.js
index 294d600..b8b4c87 100644
--- a/src/components/MarkdownEditorTabs.js
+++ b/src/components/MarkdownEditorTabs.js
@@ -8,9 +8,13 @@ var objectAssign = require('object-assign');
var MarkdownEditorTabs = React.createClass({
mixins: [Reflux.ListenerMixin],
+ propTypes: {
+ editMode: React.PropTypes.bool
+ },
+
getInitialState: function() {
return {
- activeTab: 0
+ activeTab: this.props.editMode ? 0 : 1
};
},