Feature Request: Support trailing `{...}` attributes on headings & paragraphs in MDC

[L33Z22L11]

MDC already supports {#id .class} syntax, but only on components/blocks—not when placed at the end of a plain heading or paragraph line, like in markdown-it.

Problem

• Headings in multi-language content get long, ugly URI‑encoded IDs
• Cannot override heading ID or add classes to paragraphs by just appending {...}

Proposal

Support the trailing {...} syntax on plain text blocks:

• Headings: ## 标题 {#my-id} → set id="my-id"
• Paragraphs: Text {.class} → add class to the <p> container
• Strip the {...} part from rendered text

Why

• Clean, readable URLs/anchors for multi‑language sites
• Simple styling without wrapper components

[hareland]

Hey @L33Z22L11,

You can do Styled [text]{#id .text-primary} like this - is this similar to what you are looking for?

[L33Z22L11]

Thanks!
That only creates a <span> for inline text.
I need {...} to set ID/class on the whole heading/paragraph block, not just inline.

[hareland]

@L33Z22L11

You can also do:

::section{#id .text-primary.uppercase}
Some div
::

I have not seen this last one documented tho, but i am using it.
Would think that you could do this with any arbitrary HTML tag, but cannot try it out right now.

Had issues with regular divs, but this is a workaround (they tend to work on the second level of another component/element:

<div>

::div{#main .bg-secondary.flex.gap-4}
  :u-button{label="GitHub"}
  :u-button{label="GitHub"}
::
</div>