Is your feature request related to a problem? Please describe. A clear and
concise description of what the problem is.

I am using markdown for titles, but I need to add some <Components /> to it, for example:

### This is title <Badge>something</Badge>

### This is another title <Badge>something</Badge>

now, this badge content is not aligned to the title text.

Possible solutions to this would be:

<h3 className="flex items-center gap-2">This is title <Badge>something</Badge></h3>

<h3 className="flex items-center gap-2">This is another title <Badge>something</Badge></h3>

Problem with this one is that it doesn't apper in the TOC on the right then.

### This is title <Badge>something</Badge>[#this-is-title]

### This is another title <Badge>something</Badge>[#this-is-another-title]

#this-is-title, #this-is-another-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

this doesn't scale well, because I need to add here all of the #ids that I am going to use, while also I need to define the id it self [#this-is-title]

Describe the solution you'd like A clear and concise description of what you
want to happen.

1. Either have a toc={true} for a <h1-6 /> tags
2. define classes to markdown ### This is title <Badge>something</Badge>{.center}
3. ability to define additional ids -> ### This is title <Badge>something</Badge>[#this-is-title #center]