diff --git a/packages/gatsby-remark-autolink-headers/README.md b/packages/gatsby-remark-autolink-headers/README.md index 8814340cfe4dc..42113bca576f1 100644 --- a/packages/gatsby-remark-autolink-headers/README.md +++ b/packages/gatsby-remark-autolink-headers/README.md @@ -56,6 +56,7 @@ Note: if you are using `gatsby-remark-prismjs`, make sure that it’s listed aft - `icon`: SVG shape inside a template literal or boolean `false`. Set your own svg or disable icon (optional) - `className`: String. Set your own class for the anchor (optional) - `maintainCase`: Boolean. Maintains the case for markdown header (optional) +- `removeAccents`: Boolean. Remove accents from generated headings IDs (optional) ```javascript // In your gatsby-config.js @@ -72,6 +73,7 @@ module.exports = { icon: ``, className: `custom-class`, maintainCase: true, + removeAccents: true, }, }, ], diff --git a/packages/gatsby-remark-autolink-headers/package.json b/packages/gatsby-remark-autolink-headers/package.json index 64fdcf21b45c4..9ba690fce6685 100644 --- a/packages/gatsby-remark-autolink-headers/package.json +++ b/packages/gatsby-remark-autolink-headers/package.json @@ -9,6 +9,7 @@ "dependencies": { "@babel/runtime": "^7.0.0", "github-slugger": "^1.1.1", + "lodash": "^4.17.11", "mdast-util-to-string": "^1.0.2", "unist-util-visit": "^1.3.0" }, diff --git a/packages/gatsby-remark-autolink-headers/src/__tests__/index.js b/packages/gatsby-remark-autolink-headers/src/__tests__/index.js index bc68ddf20a7de..33359862ae8c3 100644 --- a/packages/gatsby-remark-autolink-headers/src/__tests__/index.js +++ b/packages/gatsby-remark-autolink-headers/src/__tests__/index.js @@ -146,4 +146,40 @@ describe(`gatsby-remark-autolink-headers`, () => { expect(node).toMatchSnapshot() }) }) + + it(`keeps accents by default`, () => { + const markdownAST = remark.parse(` +# Héading One + +## Héading Two + +### Héading Three + `) + const removeAccents = false + + const transformed = plugin({ markdownAST }, { removeAccents }) + + visit(transformed, `heading`, node => { + expect(node.data.id).toBeDefined() + expect(node.data.id).toEqual(expect.stringMatching(/^héading/)) + }) + }) + + it(`remove accents if removeAccents is passed`, () => { + const markdownAST = remark.parse(` +# Héading One + +## Héading Two + +### Héading Three + `) + const removeAccents = true + + const transformed = plugin({ markdownAST }, { removeAccents }) + + visit(transformed, `heading`, node => { + expect(node.data.id).toBeDefined() + expect(node.data.id).toEqual(expect.stringMatching(/^heading/)) + }) + }) }) diff --git a/packages/gatsby-remark-autolink-headers/src/index.js b/packages/gatsby-remark-autolink-headers/src/index.js index 8036a90a92f33..714207ede915e 100644 --- a/packages/gatsby-remark-autolink-headers/src/index.js +++ b/packages/gatsby-remark-autolink-headers/src/index.js @@ -1,6 +1,7 @@ const toString = require(`mdast-util-to-string`) const visit = require(`unist-util-visit`) const slugs = require(`github-slugger`)() +const deburr = require(`lodash/deburr`) function patch(context, key, value) { if (!context[key]) { @@ -14,12 +15,18 @@ const svgIcon = `