@matheuswr89/react-native-markdown-editor NPM

React Native Markdown Editor

This is a library for rendering a markdown editor for the markdown with helper buttons to easily write markdown. With live preview markdown as well (thanks to https://github.com/Benjamin-Dobell/react-native-markdown-view)

Install the node module:

yarn add @matheuswr89/react-native-markdown-editor

or with npm:

npm install --save @matheuswr89/react-native-markdown-editor

Then see Usage for futher details

Screenshot:

Bold Text

Italic Text

Underline text

~~Strikethrough~~

Inline code

Url Links:

Images:

function codeExample(arg) {
}

Import the editor through

import { MarkdownEditor } from '@matheuswr89/react-native-markdown-editor';

And use like this this in the jsx

<MarkdownEditor />

And pass a function onMarkdownChange which will be callback when markdown is changed

 <MarkdownEditor onMarkdownChange={onTextChange} />

It can be used with a toolbar and have a submit menu option there!

To set a content in the editor, just pass the content in the props markdown like this:

 <MarkdownEditor onMarkdownChange={onTextChange} markdown={yourVariable} />

You can customize the styles of the following elements:

And you can do this by passing a props as below:

 <MarkdownEditor placeholderTextColor={yourVariableStylesHere} />

or:

 <MarkdownEditor placeholderTextColor={{yourStylesHere}} />

Name	Type	Default	Description	Required
onMarkdownChange	function		Callback function, calls when markdown is typed	True
placeholder	string	"Type here"	Text of placeholder of the input	False
markdown	string	""	Content of editor	False
placeholderTextColor	string	"#000"	Color of the placeholder	False
buttonStyles	StyleSheet		Action button styles	False
buttonContainerStyles	StyleSheet		Action button container styles	False
textInputStyles	StyleSheet		Text input style	False
markdownViewStyles	StyleSheet		Markdown preview style (limited)	False