Enhancement Request: Allow selection of wrapping element tag

[TotallyInformation]

Hi, as GitHub callouts are considered blockquotes, I would much prefer to us a sematic blockhub tag instead of div. Would be possible to add this as a configuration option?

[jaywcjlove]

Wrap tag name with container

let markdown = `> [!CAUTION] \n> Hello World`;
const htmlStr = remark()
  .use(remarkParse)
  .use(remarkAlert, { tagName: "blockquote" })
  .use(remarkRehype)
  .use(rehypeStringify)
  .processSync(markdown).toString()

The output HTML will be:

<blockquote class="markdown-alert markdown-alert-caution" dir="auto">
<p class="markdown-alert-title" dir="auto"><svg class="octicon" viewBox="0 0 16 16" width="16" height="16" aria-hidden="true"><path d="M4.47.22A.749.749 0 0 1 5 0h6c.199 0 .389.079.53.22l4.25 4.25c.141.14.22.331.22.53v6a.749.749 0 0 1-.22.53l-4.25 4.25A.749.749 0 0 1 11 16H5a.749.749 0 0 1-.53-.22L.22 11.53A.749.749 0 0 1 0 11V5c0-.199.079-.389.22-.53Zm.84 1.28L1.5 5.31v5.38l3.81 3.81h5.38l3.81-3.81V5.31L10.69 1.5ZM8 4a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5A.75.75 0 0 1 8 4Zm0 8a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"></path></svg>CAUTION</p>
<p>Hello World</p>
</blockquote>

I’m not sure if I misunderstood, but I implemented a tagName setting to change the outer container’s tag name. @TotallyInformation

[TotallyInformation]

Cool! Thanks for that.