diff --git a/packages/remark-mdx/block.js b/packages/remark-mdx/block.js
index bf91aceb2..f2f4c0837 100644
--- a/packages/remark-mdx/block.js
+++ b/packages/remark-mdx/block.js
@@ -24,13 +24,15 @@ const cdataOpenExpression = /^/
const elementCloseExpression = /^$/
const otherElementOpenExpression = new RegExp(openCloseTag.source + '\\s*$')
+const fragmentOpenExpression = /^<>/
function blockHtml(eat, value, silent) {
- const blocks = '[a-z\\.]+(\\.){0,1}[a-z\\.]'
+ const blocks = '[a-z\\.]*(\\.){0,1}[a-z][a-z0-9\\.]*'
const elementOpenExpression = new RegExp(
'^?(' + blocks + ')(?=(\\s|/?>|$))',
'i'
)
+
const length = value.length
let index = 0
let next
@@ -48,6 +50,7 @@ function blockHtml(eat, value, silent) {
[directiveOpenExpression, directiveCloseExpression, true],
[cdataOpenExpression, cdataCloseExpression, true],
[elementOpenExpression, elementCloseExpression, true],
+ [fragmentOpenExpression, elementCloseExpression, true],
[otherElementOpenExpression, elementCloseExpression, false]
]
diff --git a/packages/remark-mdx/test/__snapshots__/test.js.snap b/packages/remark-mdx/test/__snapshots__/test.js.snap
index c2b204d2f..5c2df1559 100644
--- a/packages/remark-mdx/test/__snapshots__/test.js.snap
+++ b/packages/remark-mdx/test/__snapshots__/test.js.snap
@@ -10,6 +10,8 @@ const makeShortcode = name => function MDXDefaultShortcode(props) {
return
};
const Baz = makeShortcode(\\"Baz\\");
+const Paragraph = makeShortcode(\\"Paragraph\\");
+const Button = makeShortcode(\\"Button\\");
const layoutProps = {
};
@@ -28,6 +30,15 @@ export default function MDXContent({
Hi!
+ Foo
+
+ Hi!
+
+ <>Foo>
+ <>
+ Foo
+ >
+ Hello, world!
;
}
@@ -171,12 +182,107 @@ Object {
Hi!
",
},
+ Object {
+ "position": Position {
+ "end": Object {
+ "column": 54,
+ "line": 12,
+ "offset": 192,
+ },
+ "indent": Array [],
+ "start": Object {
+ "column": 1,
+ "line": 12,
+ "offset": 139,
+ },
+ },
+ "type": "jsx",
+ "value": "Foo ",
+ },
+ Object {
+ "position": Position {
+ "end": Object {
+ "column": 10,
+ "line": 16,
+ "offset": 218,
+ },
+ "indent": Array [
+ 1,
+ 1,
+ ],
+ "start": Object {
+ "column": 1,
+ "line": 14,
+ "offset": 194,
+ },
+ },
+ "type": "jsx",
+ "value": "
+ Hi!
+ ",
+ },
+ Object {
+ "position": Position {
+ "end": Object {
+ "column": 9,
+ "line": 18,
+ "offset": 228,
+ },
+ "indent": Array [],
+ "start": Object {
+ "column": 1,
+ "line": 18,
+ "offset": 220,
+ },
+ },
+ "type": "jsx",
+ "value": "<>Foo>",
+ },
+ Object {
+ "position": Position {
+ "end": Object {
+ "column": 4,
+ "line": 22,
+ "offset": 242,
+ },
+ "indent": Array [
+ 1,
+ 1,
+ ],
+ "start": Object {
+ "column": 1,
+ "line": 20,
+ "offset": 230,
+ },
+ },
+ "type": "jsx",
+ "value": "<>
+ Foo
+>",
+ },
+ Object {
+ "position": Position {
+ "end": Object {
+ "column": 23,
+ "line": 24,
+ "offset": 266,
+ },
+ "indent": Array [],
+ "start": Object {
+ "column": 1,
+ "line": 24,
+ "offset": 244,
+ },
+ },
+ "type": "jsx",
+ "value": "Hello, world! ",
+ },
],
"position": Object {
"end": Object {
"column": 1,
- "line": 11,
- "offset": 138,
+ "line": 25,
+ "offset": 267,
},
"start": Object {
"column": 1,
diff --git a/packages/remark-mdx/test/test.js b/packages/remark-mdx/test/test.js
index 87d010b54..a05fb6fde 100644
--- a/packages/remark-mdx/test/test.js
+++ b/packages/remark-mdx/test/test.js
@@ -16,6 +16,20 @@ export default Foo
Hi!
+
+Foo
+
+
+ Hi!
+
+
+<>Foo>
+
+<>
+ Foo
+>
+
+Hello, world!
`
// Manually apply all mdx transformations for now
@@ -65,6 +79,16 @@ it('maintains the proper positional info', () => {
expect(result).toMatchSnapshot()
})
+it('does not wrap an block level elements in a paragraph', () => {
+ const result = transpile(FIXTURE)
+
+ expect(result).not.toMatch(//)
+ expect(result).not.toMatch(/<>/)
+ expect(result).not.toMatch(/
{
const fixture = [
'import Foo1 from "./foo"',