diff --git a/package.json b/package.json index 87016e79..09f91261 100644 --- a/package.json +++ b/package.json @@ -101,7 +101,6 @@ "dateformat": "^1.0.12", "deep-equal": "^1.0.1", "fuzzy": "^0.1.1", - "hast-util-to-html": "^3.0.0", "history": "^2.1.2", "immutability-helper": "^2.0.0", "immutable": "^3.7.6", @@ -113,7 +112,6 @@ "lodash": "^4.13.1", "markup-it": "^2.0.0", "material-design-icons": "^3.0.1", - "mdast-util-to-hast": "^2.4.0", "moment": "^2.11.2", "netlify-auth-js": "^0.5.5", "normalize.css": "^4.2.0", @@ -159,14 +157,17 @@ "redux-notifications": "^2.1.1", "redux-optimist": "^0.0.2", "redux-thunk": "^1.0.3", - "remark": "6", + "rehype-stringify": "^3.0.0", "remark-html": "^6.0.0", + "remark-parse": "^3.0.1", + "remark-rehype": "^2.0.0", "selection-position": "^1.0.0", "semaphore": "^1.0.5", "slate": "^0.14.14", "slate-drop-or-paste-images": "^0.2.0", "slug": "^0.9.1", "textarea-caret-position": "^0.1.1", + "unified": "^6.1.4", "unist-util-visit": "^1.1.1", "uuid": "^2.0.3", "whatwg-fetch": "^1.0.0" diff --git a/src/components/MarkupItReactRenderer/index.js b/src/components/MarkupItReactRenderer/index.js index 462170c5..320a0f75 100644 --- a/src/components/MarkupItReactRenderer/index.js +++ b/src/components/MarkupItReactRenderer/index.js @@ -1,16 +1,10 @@ import React, { PropTypes } from "react"; -import Remark from "remark"; -import toHAST from "mdast-util-to-hast"; -import hastToHTML from "hast-util-to-html"; +import unified from 'unified'; +import markdown from 'remark-parse'; +import rehype from 'remark-rehype'; +import html from 'rehype-stringify'; import registry from "../../lib/registry"; -// Setup Remark. -const remark = new Remark({ - commonmark: true, - footnotes: true, - pedantic: true, -}); - export default class MarkupItReactRenderer extends React.Component { constructor(props) { super(props); @@ -22,11 +16,12 @@ export default class MarkupItReactRenderer extends React.Component { } render() { - const { value } = this.props; - const mdast = remark.parse(value); - const hast = toHAST(mdast, { allowDangerousHTML: true }); - const html = hastToHTML(hast, { allowDangerousHTML: true }); - return
; // eslint-disable-line react/no-danger + const doc = unified() + .use(markdown, { commonmark: true, footnotes: true, pedantic: true }) + .use(rehype, { allowDangerousHTML: true }) + .use(html, { allowDangerousHTML: true }) + .processSync(this.props.value); + return
; // eslint-disable-line react/no-danger } } diff --git a/src/components/Widgets/MarkdownControlElements/VisualEditor/parser.js b/src/components/Widgets/MarkdownControlElements/VisualEditor/parser.js index a4605fcf..98fa1ad9 100644 --- a/src/components/Widgets/MarkdownControlElements/VisualEditor/parser.js +++ b/src/components/Widgets/MarkdownControlElements/VisualEditor/parser.js @@ -4,22 +4,16 @@ https://github.com/ProseMirror/prosemirror-markdown/blob/master/src/from_markdown.js */ -import Remark from "remark"; -const visit = require("unist-util-visit"); -const { Mark } = require("prosemirror-model"); +import unified from 'unified'; +import markdown from 'remark-parse'; +import visit from 'unist-util-visit'; +import { Mark } from 'prosemirror-model'; let schema; let plugins let activeMarks = Mark.none; let textsArray = []; -// Setup Remark. -const remark = new Remark({ - commonmark: true, - footnotes: true, - pedantic: true, -}); - const processMdastNode = node => { if (node.type === "root") { const content = node.children.map(childNode => processMdastNode(childNode)); @@ -139,25 +133,28 @@ const processMdastNode = node => { activeMarks = mark.removeFromSet(activeMarks); return; } - - return doc; }; const compileMarkdownToProseMirror = src => { - // console.log(src); // Clear out any old state. let activeMarks = Mark.none; let textsArray = []; - const mdast = remark.parse(src); - const doc = processMdastNode(mdast); - return doc; + const result = unified() + .use(markdown, { commonmark: true, footnotes: true, pedantic: true }) + .parse(src); + + const output = unified() + .use(() => processMdastNode) + .runSync(result); + + return output; }; -module.exports = (s, p) => { - //console.log(s) - //console.log(s.nodes.code_block.create({ params: { language: 'javascript' } })) +const parser = (s, p) => { schema = s; plugins = p; return compileMarkdownToProseMirror; }; + +export default parser;