gcg/static-cms
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

allow raw html in markdown

Browse Source
This commit is contained in:
Shawn Erquhart 2017-07-12 17:18:25 -04:00
parent f22d09b781
commit 09751efe41
1 changed files with 13 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/Widgets/Markdown/unified.js
View File

@ -7,29 +7,29 @@ import htmlToRehype from 'rehype-parse';
import rehypeToRemark from 'rehype-remark'; import rehypeToRemark from 'rehype-remark';
import remarkToMarkdown from 'remark-stringify'; import remarkToMarkdown from 'remark-stringify';
import rehypeSanitize from 'rehype-sanitize'; import rehypeSanitize from 'rehype-sanitize';
import rehypeReparse from 'rehype-raw';
import rehypeMinifyWhitespace from 'rehype-minify-whitespace'; import rehypeMinifyWhitespace from 'rehype-minify-whitespace';
const remarkParseConfig = { fences: true };
const remarkStringifyConfig = { listItemIndent: '1', fences: true };
const rehypeParseConfig = { fragment: true };
/** /**
* Remove empty nodes, including the top level parents of deeply nested empty nodes. * Remove empty nodes, including the top level parents of deeply nested empty nodes.
*/ */
const rehypeRemoveEmpty = () => { const rehypeRemoveEmpty = () => {
const isVoidElement = node => ['img', 'hr'].includes(node.tagName); const isVoidElement = node => ['img', 'hr'].includes(node.tagName);
const isNonEmptyText = node => node.type === 'text' && node.value; const isNonEmptyLeaf = node => ['text', 'raw'].includes(node.type) && node.value;
const isNonEmptyNode = node => { const isNonEmptyNode = node => {
return isVoidElement(node) || isNonEmptyText(node) || find(node.children, isNonEmptyNode); return isVoidElement(node)
|| isNonEmptyLeaf(node)
|| find(node.children, isNonEmptyNode);
}; };
const transform = node => { const transform = node => {
if (isVoidElement(node) || isNonEmptyText(node)) { if (isVoidElement(node) || isNonEmptyLeaf(node)) {
return node; return node;
} }
if (node.children) { if (node.children) {
node.children = node.children.reduce((acc, childNode) => { node.children = node.children.reduce((acc, childNode) => {
if (isVoidElement(childNode) || isNonEmptyText(childNode)) { if (isVoidElement(childNode) || isNonEmptyLeaf(childNode)) {
return acc.concat(childNode); return acc.concat(childNode);
} }
return find(childNode.children, isNonEmptyNode) ? acc.concat(transform(childNode)) : acc; return find(childNode.children, isNonEmptyNode) ? acc.concat(transform(childNode)) : acc;
@ -91,12 +91,13 @@ const rehypePaperEmoji = () => {
export const markdownToHtml = markdown => { export const markdownToHtml = markdown => {
const result = unified() const result = unified()
.use(markdownToRemark, remarkParseConfig) .use(markdownToRemark, { fences: true })
.use(remarkToRehype) .use(remarkToRehype, { allowDangerousHTML: true })
.use(rehypeReparse)
.use(rehypeRemoveEmpty) .use(rehypeRemoveEmpty)
.use(rehypeSanitize) .use(rehypeSanitize)
.use(rehypeMinifyWhitespace) .use(rehypeMinifyWhitespace)
.use(rehypeToHtml) .use(rehypeToHtml, { allowDangerousHTML: true })
.processSync(markdown) .processSync(markdown)
.contents; .contents;
return result; return result;
@ -104,14 +105,14 @@ export const markdownToHtml = markdown => {
export const htmlToMarkdown = html => { export const htmlToMarkdown = html => {
const result = unified() const result = unified()
.use(htmlToRehype, rehypeParseConfig) .use(htmlToRehype, { fragment: true })
.use(rehypePaperEmoji) .use(rehypePaperEmoji)
.use(rehypeSanitize) .use(rehypeSanitize)
.use(rehypeRemoveEmpty) .use(rehypeRemoveEmpty)
.use(rehypeMinifyWhitespace) .use(rehypeMinifyWhitespace)
.use(rehypeToRemark) .use(rehypeToRemark)
.use(remarkNestedList) .use(remarkNestedList)
.use(remarkToMarkdown, remarkStringifyConfig) .use(remarkToMarkdown, { listItemIndent: '1', fences: true })
.processSync(html) .processSync(html)
.contents; .contents;
return result; return result;