Default Prose Headings components should not render as links (bad HTML and too opinionated)
Is your feature request related to a problem? Please describe
As you can see here main/src/runtime/components/Prose/ProseH3.vue, H2 to H6 headings become links.
-
It's not good to have such opiniated structure for something so basic like Heading HTML elements.
-
The V1 option was better, i.e., having hidden
#on left side of heading which shows onhover, instead of converting entire heading text intoa. -
Also, it's not good HTML too, because such
alink is inline. Andalink cannot have certain descendants. But currently, the component accepts any slot, so any random HTML element will be descendant ofa. -
Also, it makes it harder to select the Text of the Heading.
Describe the solution you'd like
Just add simple slot like https://github.com/nuxt/content/blob/main/src/runtime/components/Prose/ProseH1.vue.
Nothing fancy.
For those who want links in their headings, they can add it using respective remark plugin (e.g., autolink-headings). That plugin gives way more options any way.
Describe alternatives you've considered
Create own Prose components for H2 to H6 headings. 👎🏻 Because it's like resetting something, whereas styling and how template should be --- such things any way should be left to the user, and not Module.
Additional context
Tailwind's Preflight philosophy. As a Module, have sensible defaults. Don't have such opiniated rigidity that user have to spend time resetting things anyway.
Simply make things behave more like you’d expect them to.
- It's only h2 to h4
- You can just override the prose components' behavior as you like: #1248
I like that links are generated by default, but I also agree with your point, that it's overriding standard behavior and kind of restrictive sometimes, even though it's just a heading (that is not supposed to contain that much other elements).
Being able to define in the config if the heading-links are generated would be a great option.
@nobkd
- Yes, we can override it, but will have to do in every project. 😕
- Also, need to create H2, H3, H4 such three separate
.vuefiles every time. - And, most importantly, some words of Headings can at times be links. So, how will that work? Because currently, entire headings themselves are getting converted into links.
So, better to have such template of heading-links inside some theme of Content Module (e.g., Content-wind) and not inside the core Module itself.