From a9d93b2924ba4dbe32d5cea7fb167b5fd7824513 Mon Sep 17 00:00:00 2001
From: bholmesdev <hey@bholmes.dev>
Date: Mon, 15 Aug 2022 16:51:08 -0400
Subject: [PATCH] fix: only add _componentX to _createMdxContent

---
 packages/mdx/lib/plugin/recma-jsx-rewrite.js | 36 +++++++++++---------
 packages/mdx/test/compile.js                 |  2 +-
 2 files changed, 20 insertions(+), 18 deletions(-)

diff --git a/packages/mdx/lib/plugin/recma-jsx-rewrite.js b/packages/mdx/lib/plugin/recma-jsx-rewrite.js
index 4a24d6c1e..1e82a1e41 100644
--- a/packages/mdx/lib/plugin/recma-jsx-rewrite.js
+++ b/packages/mdx/lib/plugin/recma-jsx-rewrite.js
@@ -358,23 +358,25 @@ export function recmaJsxRewrite(options = {}) {
               componentsInit = {type: 'Identifier', name: '_components'}
             }
 
-            for (const [id, componentName] of idToInvalidComponentName) {
-              // For JSX IDs that can’t be represented as JavaScript IDs (as in,
-              // those with dashes, such as `custom-element`), generate a
-              // separate variable that is a valid JS ID (such as `_component0`),
-              // and takes it from components:
-              // `const _component0 = _components['custom-element']`
-              declarations.push({
-                type: 'VariableDeclarator',
-                id: {type: 'Identifier', name: componentName},
-                init: {
-                  type: 'MemberExpression',
-                  object: {type: 'Identifier', name: '_components'},
-                  property: {type: 'Literal', value: id},
-                  computed: true,
-                  optional: false
-                }
-              })
+            if (isNamedFunction(scope.node, '_createMdxContent')) {
+              for (const [id, componentName] of idToInvalidComponentName) {
+                // For JSX IDs that can’t be represented as JavaScript IDs (as in,
+                // those with dashes, such as `custom-element`), generate a
+                // separate variable that is a valid JS ID (such as `_component0`),
+                // and takes it from components:
+                // `const _component0 = _components['custom-element']`
+                declarations.push({
+                  type: 'VariableDeclarator',
+                  id: {type: 'Identifier', name: componentName},
+                  init: {
+                    type: 'MemberExpression',
+                    object: {type: 'Identifier', name: '_components'},
+                    property: {type: 'Literal', value: id},
+                    computed: true,
+                    optional: false
+                  }
+                })
+              }
             }
 
             if (componentsPattern) {
diff --git a/packages/mdx/test/compile.js b/packages/mdx/test/compile.js
index c1067909c..d00059758 100644
--- a/packages/mdx/test/compile.js
+++ b/packages/mdx/test/compile.js
@@ -864,7 +864,7 @@ test('jsx', async () => {
       '  return <>{<_component0></_component0>}</>;',
       '}',
       'function MDXContent(props = {}) {',
-      '  const _component0 = _components["a-b"], {wrapper: MDXLayout} = props.components || ({});',
+      '  const {wrapper: MDXLayout} = props.components || ({});',
       '  return MDXLayout ? <MDXLayout {...props}><_createMdxContent {...props} /></MDXLayout> : _createMdxContent(props);',
       '}',
       'export default MDXContent;',