Remove layout props in compiled jsx (#1199)

Closes #742
mdx-js · Jul 31, 2020 · b8bedc9 · b8bedc9
1 parent b6f3fdf
commit b8bedc9
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 25 deletions.
diff --git a/packages/mdx/mdx-hast-to-jsx.js b/packages/mdx/mdx-hast-to-jsx.js
@@ -97,7 +97,7 @@ function serializeRoot(node, options) {
 
   const fn = `function MDXContent({ components, ...props }) {
 return (
-  <MDXLayout {...layoutProps} {...props} components={components}>
+  <MDXLayout {...props} components={components}>
 ${doc}
   </MDXLayout>
 )
@@ -144,14 +144,6 @@ MDXContent.isMDXComponent = true`
     ]
   }).code
 
-  let layoutProps = 'const layoutProps = {'
-
-  if (exportNames.length !== 0) {
-    layoutProps += '\n  ' + exportNames.join(',\n  ') + '\n'
-  }
-
-  layoutProps += '};'
-
   const allJsxNames = [
     ...babelPluginApplyMdxPropInstance.state.names,
     ...babelPluginApplyMdxPropToExportsInstance.state.names
@@ -173,7 +165,6 @@ MDXContent.isMDXComponent = true`
   const moduleBase = `${importStatements}
 ${exportStatementsPostMdxTypeProps}
 ${fakedModulesForGlobalScope}
-${layoutProps}
 ${mdxLayout}`
 
   if (skipExport) {

diff --git a/packages/mdx/test/index.test.js b/packages/mdx/test/index.test.js
@@ -54,16 +54,10 @@ it('Should match sample blog post snapshot', async () => {
         return <div {...props} />;
       };
 
-    const layoutProps = {};
     const MDXLayout = \\"wrapper\\";
     export default function MDXContent({ components, ...props }) {
       return (
-        <MDXLayout
-          {...layoutProps}
-          {...props}
-          components={components}
-          mdxType=\\"MDXLayout\\"
-        >
+        <MDXLayout {...props} components={components} mdxType=\\"MDXLayout\\">
           <h1>{\`Hello World\`}</h1>
         </MDXLayout>
       );
@@ -340,15 +334,12 @@ test('Should handle layout props', () => {
     };
     const Foo = makeShortcode(\\"Foo\\");
     const Bar = makeShortcode(\\"Bar\\");
-    const layoutProps = {
-      foo
-    };
     const MDXLayout = ({children}) => <div>{children}</div>
     export default function MDXContent({
       components,
       ...props
     }) {
-      return <MDXLayout {...layoutProps} {...props} components={components} mdxType=\\"MDXLayout\\">
+      return <MDXLayout {...props} components={components} mdxType=\\"MDXLayout\\">
         <h1>{\`Hello, world!\`}</h1>
         <p>{\`I'm an awesome paragraph.\`}</p>
         {

diff --git a/packages/remark-mdxjs/test/__snapshots__/test.js.snap b/packages/remark-mdxjs/test/__snapshots__/test.js.snap
@@ -10,15 +10,12 @@ const makeShortcode = name => function MDXDefaultShortcode(props) {
 };
 const Paragraph = makeShortcode(\\"Paragraph\\");
 const Button = makeShortcode(\\"Button\\");
-const layoutProps = {
-  Baz
-};
 const MDXLayout = Foo
 export default function MDXContent({
   components,
   ...props
 }) {
-  return <MDXLayout {...layoutProps} {...props} components={components} mdxType=\\"MDXLayout\\">
+  return <MDXLayout {...props} components={components} mdxType=\\"MDXLayout\\">
     <h1>{\`Hello, world! \`}
       <Foo bar={{
         baz: 'qux'