@pemrouz/markdown-editor

GitHub-esque Markdown Editor and Markdown Previewer using CommonMark (Remarkable).

Usage no npm install needed!

<script type="module">
  import pemrouzMarkdownEditor from 'https://cdn.skypack.dev/@pemrouz/markdown-editor';
</script>

README

Markdow Editor/Previewer

image Build Status Coverage Status
Browser Results

GitHub-esque Markdown Editor and Markdown Previewer using CommonMark (Remarkable).

image

  • The Markdown Editor includes a previewer inside it. To see a preview, simply press Alt+P and Esc to resume editing.

  • By default, the styles look like the GitHub flavour but you can reset this by adding the simple class to the element.

  • Any text pasted in which has hidden HTML elements (not HTML as plain text) will be intercepted and pasted in as text/plain.

Usage

markdown-editor

State

  • value = '': The (markdown) text value of the component

  • preview = false: Whether the component is in preview or edit mode

markdown-preview

State

  • value = '': The (markdown) text value that is displayed