Merge 34a51e2 into da060aa

.changeset/five-files-count.md

@@ -0,0 +1,5 @@
+---
+'@hashicorp/platform-remark-plugins': minor
+---
+
+Add `jump-to-section` plugin

packages/remark-plugins/all.js

@@ -1,17 +1,20 @@
 import anchorLinks from './plugins/anchor-links/index.js'
+import jumpToSection from './plugins/jump-to-section/index.js'
 import paragraphCustomAlerts from './plugins/paragraph-custom-alerts/index.js'
 import typography from './plugins/typography/index.js'
 import includeMarkdown from './plugins/include-markdown/index.js'
 
 // for easy use of everything at the same time
 export default function allPlugins({
  anchorLinks: anchorLinksOptions,
+
  typography: typographyOptions,
  includeMarkdown: includeMarkdownOptions,
 } = {}) {
  return [
  [includeMarkdown, includeMarkdownOptions],
  [anchorLinks, anchorLinksOptions],
+ jumpToSection,
  paragraphCustomAlerts,
  [typography, typographyOptions],
  ]

packages/remark-plugins/package.json

@@ -15,6 +15,7 @@
  "remark-stringify": "^10.0.1",
  "to-vfile": "^7.2.2",
  "unist-builder": "^3.0.0",
+ "unist-util-flatmap": "^1.0.0",
  "unist-util-is": "^5.1.1",
  "unist-util-map": "^3.0.0",
  "unist-util-visit": "^4.1.0"

packages/remark-plugins/plugins/jump-to-section/index.js

@@ -0,0 +1,31 @@
+import flatMap from 'unist-util-flatmap'
+import { is } from 'unist-util-is'
+import { u } from 'unist-builder'
+
+export default function jumpToSection() {
+ return function transformer(tree) {
+ flatMap(tree, (node, index) => {
+ if (is(node, 'heading') && index === 0) {
+ return [
+ node,
+ u('mdxJsxFlowElement', {
+ name: 'JumpToSection',
+ attributes: [
+ u('mdxJsxAttribute', {
+ name: 'headings',
+ value: u(
+ 'mdxJsxAttributeValueExpression',
+ { data: { estree: undefined } },
+ 'headings'
+ ),
+ }),
+ ],
+ }),
+ ]
+ }
+
+ // No change
+ return [node]
+ })
+ }
+}

packages/remark-plugins/plugins/jump-to-section/index.test.js

@@ -0,0 +1,43 @@
+import { remark } from 'remark'
+import remarkMdx from 'remark-mdx'
+
+import jumpToSection from '.'
+
+describe('jump-to', () => {
+ it('should insert a jump-to component after the first h1', () => {
+ const md = `
+# Hello World
+## Hello World
+### Hello World
+#### Hello World
+##### Hello World
+###### Hello World
+`
+
+ const result = execute(md)
+
+ const expected = `# Hello World
+
+<JumpToSection headings={headings}/>
+
+## Hello World
+
+### Hello World
+
+#### Hello World
+
+##### Hello World
+
+###### Hello World
+`
+ expect(result).toEqual(expected)
+ })
+})
+
+function execute(input, options = {}) {
+ return remark()
+ .use(jumpToSection, options)
+ .use(remarkMdx)
+ .processSync(input)
+ .toString()
+}