Skip to content
A Markdown serializer for the Slate editor framework
Branch: master
Clone or download
Pull request Compare This branch is 20 commits behind tommoor:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.circleci
src
.babelrc
.eslintrc
.gitignore
.npmignore
LICENSE.txt
README.md
package.json
yarn.lock

README.md

npm version CircleCI

Slate Markdown Serializer

A Markdown serializer for the Slate Editor. Requires Slate 0.32+.

renderMark

This serializer supports the following Slate marks:

function renderMark(props) {
  switch (props.mark.type) {
    case 'bold':
      return <strong>{props.children}</strong>;
    case 'code':
      return <Code>{props.children}</Code>;
    case 'italic':
      return <em>{props.children}</em>;
    case 'underlined':
      return <u>{props.children}</u>;
    case 'deleted':
      return <del>{props.children}</del>;
    case 'added':
      return <mark>{props.children}</mark>;
    default:
  }
}

renderNode

This serializer supports the following Slate node keys:

function renderNode(props) {
  const { attributes } = props;

  switch (props.node.type) {
    case 'paragraph':
      return <Paragraph {...props} />;
    case 'block-quote':
      return <blockquote {...attributes}>{props.children}</blockquote>;
    case 'bulleted-list':
      return <ul {...attributes}>{props.children}</ul>;
    case 'ordered-list':
      return <ol {...attributes}>{props.children}</ol>;
    case 'todo-list':
      return <ul {...attributes}>{props.children}</ul>;
    case 'table':
      return <table {...attributes}>{props.children}</table>;
    case 'table-row':
      return <tr {...attributes}>{props.children}</tr>;
    case 'table-head':
      return <th {...attributes}>{props.children}</th>;
    case 'table-cell':
      return <td {...attributes}>{props.children}</td>;
    case 'list-item':
      return <li {...attributes}>{props.children}</li>;
    case 'horizontal-rule':
      return <hr />;
    case 'code':
      return <code {...attributes}>{props.children}</code>;
    case 'image':
      return <img src={props.src} title={props.title} />;
    case 'link':
      return <a href={props.href}>{props.children}</a>;
    case 'heading1':
      return <h1 {...attributes}>{props.children}</h1>;
    case 'heading2':
      return <h2 {...attributes}>{props.children}</h2>;
    case 'heading3':
      return <h3 {...attributes}>{props.children}</h3>;
    case 'heading4':
      return <h4 {...attributes}>{props.children}</h4>;
    case 'heading5':
      return <h5 {...attributes}>{props.children}</h5>;
    case 'heading6':
      return <h6 {...attributes}>{props.children}</h6>;
    default:
  }
};
You can’t perform that action at this time.