payne8/docbox
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Simplify now that remark solves this in core

Browse Source
This commit is contained in:
Tom MacWright
2016-03-22 10:44:34 -04:00
parent 1ca0ea23fe
commit 2364301ee6
2 changed files with 7 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/content.js
View File

@ -3,7 +3,6 @@ import Section from './section';
import PureRenderMixin from 'react-pure-render/mixin'; import PureRenderMixin from 'react-pure-render/mixin';
import GithubSlugger from 'github-slugger'; import GithubSlugger from 'github-slugger';
import { transformURL } from '../../custom'; import { transformURL } from '../../custom';
import remark from 'remark';
let slugger = new GithubSlugger(); let slugger = new GithubSlugger();
let slug = title => { slugger.reset(); return slugger.slug(title); }; let slug = title => { slugger.reset(); return slugger.slug(title); };
@ -77,13 +76,11 @@ var Content = React.createClass({
}, },
render() { render() {
let { ast, language, leftClassname, rightClassname } = this.props; let { ast, language, leftClassname, rightClassname } = this.props;
let parser = remark();
return (<div className='clearfix'> return (<div className='clearfix'>
{chunkifyAST(ast, language).map((chunk, i) => <Section {chunkifyAST(ast, language).map((chunk, i) => <Section
leftClassname={leftClassname} leftClassname={leftClassname}
rightClassname={rightClassname} rightClassname={rightClassname}
chunk={chunk} chunk={chunk}
parser={parser}
key={i} />)} key={i} />)}
</div>); </div>);
} }

14
src/components/section.js
View File

@ -1,14 +1,15 @@
import React from 'react'; import React from 'react';
import remark from 'remark';
import remarkHTML from 'remark-html'; import remarkHTML from 'remark-html';
import remarkHighlight from '../highlight'; import remarkHighlight from '../highlight';
import PureRenderMixin from 'react-pure-render/mixin'; import PureRenderMixin from 'react-pure-render/mixin';
import { postHighlight } from '../../custom'; import { postHighlight } from '../../custom';
function renderHighlighted(nodes, parser) { function renderHighlighted(nodes) {
return { return {
__html: postHighlight(parser __html: postHighlight(remark()
.use(remarkHTML) .use(remarkHTML)
.stringify(parser.use(remarkHighlight).run({ .stringify(remark().use(remarkHighlight).run({
type: 'root', type: 'root',
children: nodes children: nodes
}))) })))
@ -20,8 +21,7 @@ var Section = React.createClass({
propTypes: { propTypes: {
chunk: React.PropTypes.object.isRequired, chunk: React.PropTypes.object.isRequired,
leftClassname: React.PropTypes.string.isRequired, leftClassname: React.PropTypes.string.isRequired,
rightClassname: React.PropTypes.string.isRequired, rightClassname: React.PropTypes.string.isRequired
parser: React.PropTypes.object.isRequired
}, },
render() { render() {
let { chunk, leftClassname, rightClassname } = this.props; let { chunk, leftClassname, rightClassname } = this.props;
@ -31,10 +31,10 @@ var Section = React.createClass({
className={`keyline-top section contain clearfix ${preview ? 'preview' : ''}`}> className={`keyline-top section contain clearfix ${preview ? 'preview' : ''}`}>
<div <div
className={leftClassname} className={leftClassname}
dangerouslySetInnerHTML={renderHighlighted(left, this.props.parser)} /> dangerouslySetInnerHTML={renderHighlighted(left)} />
{right.length > 0 && <div {right.length > 0 && <div
className={rightClassname} className={rightClassname}
dangerouslySetInnerHTML={renderHighlighted(right, this.props.parser)} />} dangerouslySetInnerHTML={renderHighlighted(right)} />}
</div>); </div>);
} }
}); });