safe-mdx 1.3.7 → 1.3.9

package/src/html/html-to-mdx-ast.test.ts

@@ -752,4 +752,52 @@ describe('parseHtmlToMdxAst with markdown processor', () => {
             ])
         })
     })
+
+    test('block-level HTML elements as direct children of root should be flow elements', () => {
+        // Test that wrapper outer HTML elements that are direct children of root 
+        // should be flow elements, not text elements
+        const htmlWithNestedBlocks = htmlToMdxAst({ 
+            html: `<div class="wrapper">
+                <h1>Title</h1>
+                <p>Some content</p>
+                <section>
+                    <h2>Subtitle</h2>
+                </section>
+            </div>
+            <article>
+                <header>Header</header>
+                <main>Content</main>
+            </article>`,
+            parentType: 'root'
+        })
+
+        // All block-level elements at root should be flow elements
+        expect(htmlWithNestedBlocks).toHaveLength(2)
+        
+        // First element: div wrapper
+        expect(htmlWithNestedBlocks[0]).toMatchObject({
+            type: 'mdxJsxFlowElement',
+            name: 'div'
+        })
+        
+        // Second element: article
+        expect(htmlWithNestedBlocks[1]).toMatchObject({
+            type: 'mdxJsxFlowElement',
+            name: 'article'
+        })
+
+        // Test with various block-level tags
+        const blockTags = ['div', 'article', 'section', 'header', 'main', 'footer', 'aside', 'nav']
+        blockTags.forEach(tag => {
+            const result = htmlToMdxAst({ 
+                html: `<${tag}>Content</${tag}>`,
+                parentType: 'root'
+            })
+            expect(result).toHaveLength(1)
+            expect(result[0]).toMatchObject({
+                type: 'mdxJsxFlowElement',
+                name: tag
+            })
+        })
+    })
 })

package/src/html/html-to-mdx-ast.ts

@@ -67,10 +67,11 @@ function defaultConvertAttributeValue({
     return value
 }
 
+
 // Remove common indentation from multi-line text while preserving relative indentation
 function deindent(text: string): string {
     const lines = text.split('\n')
-    
+
     // Find minimum indentation (excluding empty lines)
     let minIndent = Infinity
     for (const line of lines) {
@@ -81,12 +82,12 @@ function deindent(text: string): string {
             }
         }
     }
-    
+
     // If no indentation found, return as is
     if (minIndent === 0 || minIndent === Infinity) {
         return text
     }
-    
+
     // Remove common indentation from each line, preserving relative indentation
     return lines
         .map(line => line.slice(minIndent))
@@ -197,24 +198,24 @@ function htmlNodeToMdxAst(
 
     if (isTextNode(node)) {
         let textValue = node.textContent || ''
-        
+
         // Skip whitespace-only nodes between elements
         if (!textValue.trim()) {
             const prevSibling = node.previousSibling
             const nextSibling = node.nextSibling
-            
+
             // If between elements and contains newlines, it's likely formatting
-            if (textValue.includes('\n') && 
+            if (textValue.includes('\n') &&
                 ((prevSibling && isElementNode(prevSibling)) ||
                  (nextSibling && isElementNode(nextSibling)))) {
                 return []
             }
             // Otherwise preserve the whitespace (could be intentional space)
         }
-        
+
         // Always deindent text content
         textValue = deindent(textValue).trim()
-        
+
         // Skip empty text after processing
         if (!textValue) {
             return []

package/src/safe-mdx.tsx

@@ -287,7 +287,7 @@ export class MdastToJsx {
                 )
             }
             default: {
-                return this.mdastTransformer(node, 'mdxJsxElement')
+                return this.mdastTransformer(node, 'mdxJsxFlowElement')
             }
         }
     }
@@ -571,7 +571,7 @@ export class MdastToJsx {
         return res
     }
 
-    mdastTransformer(node: MyRootContent, parentType?: string): ReactNode {
+    mdastTransformer(node: MyRootContent, parentType: string): ReactNode {
         if (!node) {
             return []
         }
@@ -944,7 +944,7 @@ export class MdastToJsx {
                 })
 
                 // Process the MDX AST nodes
-                return mdxAst.map(child => this.mdastTransformer(child, parentType))
+                return mdxAst.map(child => this.mdastTransformer(child, 'html'))
             }
             case 'imageReference': {
                 return []