diff --git a/lib/core/getTOC.js b/lib/core/getTOC.js index 3d99813cca..2facfaca41 100644 --- a/lib/core/getTOC.js +++ b/lib/core/getTOC.js @@ -6,6 +6,7 @@ */ const Remarkable = require('remarkable'); +const mdToc = require('markdown-toc'); const toSlug = require('./toSlug'); const tagToLevel = tag => Number(tag.slice(1)); @@ -14,7 +15,7 @@ const tagToLevel = tag => Number(tag.slice(1)); * Returns a table of content from the headings * * @return array - * Array of heading objects with `hashLink`, `text` and `children` fields + * Array of heading objects with `hashLink`, `content` and `children` fields * */ module.exports = (content, headingTags = 'h2', subHeadingTags = 'h3') => { @@ -24,30 +25,22 @@ module.exports = (content, headingTags = 'h2', subHeadingTags = 'h3') => { : []; const md = new Remarkable(); - const tokens = md.parse(content, {}); - const headings = []; - for (let i = 0; i < tokens.length; i++) { - if ( - tokens[i].type == 'heading_open' && - headingLevels.concat(subHeadingLevels).includes(tokens[i].hLevel) - ) { - headings.push({ - hLevel: tokens[i].hLevel, - text: tokens[i + 1].content, - }); - } - } + const headings = mdToc(content, { + filter: function(str, ele) { + return headingLevels.concat(subHeadingLevels).includes(ele.lvl); + }, + }).json; const toc = []; let current; headings.forEach(heading => { const entry = { - hashLink: toSlug(heading.text), - text: heading.text, + hashLink: toSlug(heading.content), + content: md.renderInline(mdToc.titleize(heading.content)), children: [], }; - if (headingLevels.includes(heading.hLevel)) { + if (headingLevels.includes(heading.lvl)) { toc.push(entry); current = entry; } else { diff --git a/lib/core/nav/OnPageNav.js b/lib/core/nav/OnPageNav.js index 1afd3079f4..ce20582b12 100644 --- a/lib/core/nav/OnPageNav.js +++ b/lib/core/nav/OnPageNav.js @@ -10,7 +10,14 @@ const React = require('react'); const siteConfig = require(process.cwd() + '/siteConfig.js'); const getTOC = require('../getTOC'); -const Link = ({hashLink, text}) => {text}; +const Link = ({hashLink, content}) => ( + +); const Headings = ({headings}) => { if (!headings.length) return null; @@ -18,7 +25,7 @@ const Headings = ({headings}) => {