Support `<Markdown>` slot

[atinux]

I would like to explore the possibility of using slots for Markdown, see https://github.com/nuxt-themes/alpine/blob/00b07fecfece1cd249468c80b874008b9e3792c2/elements/Hero.vue#L19-L20

Transforming:

<h1 class="text-3xl font-bold text-primary-900 dark:text-primary-100">
 <Markdown v-if="$slots.title" :use="$slots.title" unwrap="p" class="!my-0" />
 <span v-else>Default title</span>
</h1>

Into

<h1 class="text-3xl font-bold text-primary-900 dark:text-primary-100">
 <Markdown :use="$slots.title" unwrap="p" class="!my-0">Default title</Markdown>
</h1>

Also, with the current Hero implementation, I have this warning:

[atinux]

Can you take a look at this @farnabaz ?

[farnabaz]

To do so we should introduce a breaking change and remove <Markdown /> support, mark use as a required prop. WDYT @atinux ?
Because when $slots.title is empty/undefined Vue falls back to the default value of the prop and it renders default slot

As for the warning, why do we need to pass the class to a slot? <Markdown> renders a list of text nodes in most cases and passing a class to text nodes and an array of nodes will raise this warning.

[atinux]

Removed the class to the slot.

That makes sense to force the use prop personally, also we could force that its value is not a string to make sure the reactivity works well:

<Markdown use="default">Default content</Markdown>

Should be

<Markdown :use="$slots.default">Default content</Markdown>