From 9372f594727c16c079058f1c36c4b9344390ffb6 Mon Sep 17 00:00:00 2001
From: Kelly Joseph Price <kellyjosephprice@gmail.com>
Date: Mon, 8 Apr 2024 14:55:53 -0700
Subject: [PATCH] fix: wrap: false (#855)

* fix: wrap: false

* test: whoa
---
 .../transformers/reusable-content.test.js     | 55 +++++++++++++++++++
 processor/parse/reusable-content-parser.js    | 14 ++---
 processor/transform/index.js                  |  3 +-
 processor/transform/reusable-content.js       | 19 +++++++
 4 files changed, 82 insertions(+), 9 deletions(-)
 create mode 100644 __tests__/transformers/reusable-content.test.js
 create mode 100644 processor/transform/reusable-content.js

diff --git a/__tests__/transformers/reusable-content.test.js b/__tests__/transformers/reusable-content.test.js
new file mode 100644
index 000000000..af55fb619
--- /dev/null
+++ b/__tests__/transformers/reusable-content.test.js
@@ -0,0 +1,55 @@
+import { mdast } from '../../index';
+
+describe('reusable content transfomer', () => {
+  it('should unwrap the content when `wrap: false`', () => {
+    const tags = {
+      Test: `
+# Test
+
+[link](http://example.com)
+    `,
+    };
+    const md = `
+Before
+
+<Test />
+
+After
+    `;
+
+    const tree = mdast(md, { reusableContent: { tags, wrap: false } });
+
+    expect(tree.children[0].children[0].value).toBe('Before');
+    expect(tree.children[1].type).toBe('heading');
+    expect(tree.children[2].type).toBe('paragraph');
+    expect(tree.children[3].children[0].value).toBe('After');
+  });
+
+  it('should unwrap consecutive the content when `wrap: false`', () => {
+    const tags = {
+      Test: `
+# Test
+
+[link](http://example.com)
+    `,
+    };
+    const md = `
+Before
+
+<Test />
+
+<Test />
+
+After
+    `;
+
+    const tree = mdast(md, { reusableContent: { tags, wrap: false } });
+
+    expect(tree.children[0].children[0].value).toBe('Before');
+    expect(tree.children[1].type).toBe('heading');
+    expect(tree.children[2].type).toBe('paragraph');
+    expect(tree.children[3].type).toBe('heading');
+    expect(tree.children[4].type).toBe('paragraph');
+    expect(tree.children[5].children[0].value).toBe('After');
+  });
+});
diff --git a/processor/parse/reusable-content-parser.js b/processor/parse/reusable-content-parser.js
index 5adb0aa7f..271d86fa4 100644
--- a/processor/parse/reusable-content-parser.js
+++ b/processor/parse/reusable-content-parser.js
@@ -3,7 +3,7 @@ const { insertBlockTokenizerBefore } = require('./utils');
 export const type = 'reusable-content';
 
 function tokenizeReusableContent(eat, value, silent) {
-  const { tags, disabled, wrap = true } = this.data('reusableContent');
+  const { tags, disabled } = this.data('reusableContent');
   if (disabled) return false;
 
   // Modifies the regular expression to match from
@@ -16,13 +16,11 @@ function tokenizeReusableContent(eat, value, silent) {
   /* istanbul ignore if */
   if (silent) return true;
 
-  const node = wrap
-    ? {
-        type: 'reusable-content',
-        tag,
-        children: tag in tags ? tags[tag] : [],
-      }
-    : tags[tag];
+  const node = {
+    type: 'reusable-content',
+    tag,
+    children: tag in tags ? tags[tag] : [],
+  };
 
   return eat(match[0])(node);
 }
diff --git a/processor/transform/index.js b/processor/transform/index.js
index 5b12c9d5c..dd2ea49ec 100644
--- a/processor/transform/index.js
+++ b/processor/transform/index.js
@@ -1,5 +1,6 @@
+import reusableContent from './reusable-content';
 import singleCodeTabs from './single-code-tabs';
 import tableCellInlineCode from './table-cell-inline-code';
 
-export const remarkTransformers = [singleCodeTabs];
+export const remarkTransformers = [singleCodeTabs, reusableContent];
 export const rehypeTransformers = [tableCellInlineCode];
diff --git a/processor/transform/reusable-content.js b/processor/transform/reusable-content.js
new file mode 100644
index 000000000..525fa6638
--- /dev/null
+++ b/processor/transform/reusable-content.js
@@ -0,0 +1,19 @@
+import { visit } from 'unist-util-visit';
+
+import { type } from '../parse/reusable-content-parser';
+
+function reusableContent() {
+  const { wrap = true } = this.data('reusableContent');
+
+  return tree => {
+    if (wrap) return tree;
+
+    visit(tree, type, (node, index, parent) => {
+      parent.children.splice(index, 1, ...node.children);
+    });
+
+    return tree;
+  };
+}
+
+export default reusableContent;