Incorrect Parsing of YAML Syntax in VSCode Outline View

[L33Z22L11]

Description:

In the current implementation of the YAML method to pass props to Vue components using MDC, the --- identifier, which is used to separate the properties, is causing incorrect parsing in VSCode’s outline view.

When a YAML block is used in Vue components (as shown below), the line above --- is mistakenly being interpreted as a second-level heading in the outline view, which leads to confusion in the structure of the document.

Example:

::icon-card
---
icon: IconNuxt
description: Harness the full power of Nuxt and the Nuxt ecosystem.
title: Nuxt Architecture.
---
::

Steps to Reproduce:

1. Create a Vue component using the YAML method for passing props as shown above.
2. Open the markdown file in VSCode.
3. Check the outline view where the line above --- is being misinterpreted as a heading (e.g., ##).

Expected Behavior:
The --- identifier and the properties defined should be treated as part of the YAML block, and the line above --- should not be mistaken for a second-level heading in the outline view.

Possible Solution:
Review and adjust the parsing logic for the outline view in VSCode to handle YAML syntax correctly in the context of Vue components.

[nobkd]

That's because that is a setext heading in standard markdown.
Vscode mdc is just highlighting the code, nothing else.

[L33Z22L11]

Thank you for your reply!

I understand that this behavior is due to the standard Markdown specification treating --- as a Setext heading. However, this leads to confusion and affects the "Sticky Scroll" feature in VSCode when it is enabled by default. As a result, the unexpected line sticks to the top of the editor.

It would be helpful if there could be a way to exclude YAML blocks from being treated as Setext headings, so that the "Sticky Scroll" feature works correctly.