fix: codeblock yaml data section

nuxtlabs · Nov 15, 2024 · b74b764 · b74b764
1 parent fcb2ff3
commit b74b764
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 15 deletions.
diff --git a/package.json b/package.json
@@ -20,7 +20,7 @@
     "dev:prepare": "nuxi prepare playground",
     "generate": "nuxi generate playground",
     "lint": "eslint --ext .js,.ts,.vue .",
-    "test": "pnpm lint && vitest run",
+    "test": "vitest run",
     "prepack": "pnpm build",
     "release": "release-it"
   },

diff --git a/src/from-markdown.ts b/src/from-markdown.ts
@@ -13,16 +13,18 @@ export default (opts: RemarkMDCOptions = {}) => {
   const canContainEols = ['textComponent']
 
   const experimentalCodeBlockYamlProps = (node: Container) => {
+    const firstSection = node.children[0] as Container
     if (
-      node.children?.length &&
-      node.children[0].type === 'code' &&
-      node.children[0].lang === 'yaml' &&
-      node.children[0].meta === '[props]'
+      firstSection &&
+      firstSection.children?.length &&
+      firstSection.children[0].type === 'code' &&
+      firstSection.children[0].lang === 'yaml' &&
+      firstSection.children[0].meta === '[props]'
     ) {
-      node.rawData = node.children[0].value as string
+      node.rawData = firstSection.children[0].value as string
       node.mdc = node.mdc || {}
       node.mdc.codeBlockProps = true
-      node.children!.splice(0, 1)
+      firstSection.children!.splice(0, 1)
     }
   }
   const experimentalAutoUnwrap = (node: Container) => {

diff --git a/test/__snapshots__/codeblock-props.test.ts.snap b/test/__snapshots__/codeblock-props.test.ts.snap
@@ -22,6 +22,9 @@ exports[`basic > YamlProps 1`] = `
         ],
         "key": "value",
       },
+      "mdc": {
+        "codeBlockProps": true,
+      },
       "name": "with-frontmatter-yaml",
       "position": {
         "end": {
@@ -38,8 +41,7 @@ exports[`basic > YamlProps 1`] = `
       "rawData": "array:
   - item
   - itemKey: value
-key: value
----",
+key: value",
       "type": "containerComponent",
     },
   ],
@@ -146,6 +148,9 @@ exports[`basic > nested-component-yamlProps 1`] = `
               "fmAttributes": {
                 "key": "value",
               },
+              "mdc": {
+                "codeBlockProps": true,
+              },
               "name": "hello",
               "position": {
                 "end": {
@@ -159,8 +164,7 @@ exports[`basic > nested-component-yamlProps 1`] = `
                   "offset": 165,
                 },
               },
-              "rawData": "key: value
----",
+              "rawData": "key: value",
               "type": "containerComponent",
             },
           ],
@@ -202,6 +206,9 @@ exports[`basic > nested-component-yamlProps 1`] = `
         ],
         "key": "value",
       },
+      "mdc": {
+        "codeBlockProps": true,
+      },
       "name": "with-frontmatter-and-nested-component-yaml",
       "position": {
         "end": {
@@ -218,8 +225,7 @@ exports[`basic > nested-component-yamlProps 1`] = `
       "rawData": "array:
   - item
   - itemKey: value
-key: value
----",
+key: value",
       "type": "containerComponent",
     },
   ],
@@ -521,6 +527,9 @@ exports[`basic > yamlProps1 1`] = `
           "subkey2": "value",
         },
       },
+      "mdc": {
+        "codeBlockProps": true,
+      },
       "name": "with-frontmatter-yaml1",
       "position": {
         "end": {
@@ -540,8 +549,7 @@ key2:
   subkey2: value
 array:
   - item
-  - itemKey: value
----",
+  - itemKey: value",
       "type": "containerComponent",
     },
   ],