Support Custom-ID Markdown Syntax #1636
Conversation
|
Thank you for your pull request and welcome to our community. We require contributors to sign our Contributor License Agreement, and we don't seem to have you on file. In order for us to review and merge your code, please sign up at https://code.facebook.com/cla. If you are contributing on behalf of someone else (eg your employer), the individual CLA may not be sufficient and your employer may need the corporate CLA signed. If you have received this in error or have any questions, please contact us at [email protected]. Thanks! |
|
Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Facebook open source project. Thanks! |
|
Deploy preview for reactjs ready! Built with commit 16515ce |
There was a problem hiding this comment.
This looks fine to me. In hindsight, it's a great idea.
I don't mind merging this to unblock our translations efforts– but given how close it is to gatsby-remark-header-custom-ids– maybe @KyleAMathews and the Gatsby community would like to see it merged upstream?
| exports.shouldUpdateScroll = ({routerProps: {location}}) => { | ||
| const offset = getTargetOffset(location.hash); | ||
| return offset !== null ? [0, offset] : true; | ||
| }; |
There was a problem hiding this comment.
Looks like a forked+formatted version of gatsby-remark-autolink-headers/src/gatsby-browser.js 👍
| dangerouslySetInnerHTML={{__html: script}} | ||
| />, | ||
| ]); | ||
| }; |
There was a problem hiding this comment.
Looks like a formed+formatted version of gatsby-remark-autolink-headers/src/gatsby-ssr.js 👍
| // Remove the custom ID part from the text node. | ||
| const lastNode = node.children[node.children.length - 1]; | ||
| lastNode.value = lastNode.value.replace(match[1], ''); | ||
| } |
There was a problem hiding this comment.
Looks like a formed+formatted version of gatsby-remark-autolink-headers/src/index.js with the exception of the above ~10 lines 👍
|
@bvaughn we could always merge it in, and switch to the open-sourced plugin later! |
|
Would love this PRed upstream! We do merge and release pretty quickly so it might be easier to just PR your improvements to us. |
|
😄 I've found it pretty easy to get contributes to Gatsby plug-ins merged quickly! I'll merge this for now and we can revert once the upstream change has been published |
|
Thank you for merging. I believe this works in our use case, but right now this is not suitable for upstream because:
|
|
I don't think I agree that the first two bullet points are blockers, and some basic tests could be written pretty easily 😄 |
|
Yes, I'll make a PR to the official plug-in tonight or this weekend :) |
|
That's awesome 😄 I think other Gatsby users will really appreciate the ability to customize header ids like this |
For the reason why this is necessary, see: #1608
This PR enables user-defined IDs on markdown headings, as explained in this guide.
A heading with an explicit custom ID would look like this:
To implement this, we introduce a new custom Gatsby plug-in, which will work in place of the official gatsby-remark-autolink-headers plugin (MIT Licensed).
gatsby-remark-autolink-headersand copied most of its contents underpluginsdirectory in this repository. The new custom plugin is calledgatsby-remark-header-custom-ids.To check how this works, edit some
*.mdfile undercontent, and execute the following:yarn(removes the official plugin)yarn reset(this seems to be important after something changed in config)yarn devoryarn buildNotes:
CC @tesseralis