Svelte 5: {@html} inside <svg> broken

[dm-de]

Describe the bug

It is impossible in Svelte 5 to use {@html} inside <svg>.
In below example, only first path is rendered.
Beer Icon should show up.
In my real project - nothing is visible.

Reproduction

App.svelte:

<script>
	import Icon from './Icon.svelte'
	
	let beer = '<path d="M17 11h1a3 3 0 0 1 0 6h-1" /><path d="M9 12v6" /><path d="M13 12v6" /><path d="M14 7.5c-1 0-1.44.5-3 .5s-2-.5-3-.5-1.72.5-2.5.5a2.5 2.5 0 0 1 0-5c.78 0 1.57.5 2.5.5S9.44 2 11 2s2 1.5 3 1.5 1.72-.5 2.5-.5a2.5 2.5 0 0 1 0 5c-.78 0-1.5-.5-2.5-.5Z" /><path d="M5 8v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8" />'
</script>

<Icon icon={beer} />

Icon.svelte:

<script>
	let {icon=''} = $props()
</script>

<svg width="24" height="24" style="border:1px solid red;">
	{@html icon}
</svg>

<br>
{icon}

Logs

No response

System Info

5.0.0-next.22
Vite

Severity

blocking all usage of svelte

[dm-de]

Svelte 5 can not add multiple elements <path /><path />
and Svelte 5 need clean html without spaces around <> etc...

So it is broken for normal use.
I found a dirty workaround - but this bug should be fixed as soon as possible.

Icon.svelte:

<script>
	let {icon=''} = $props()

	function content_workaround(str) {
		let array = str.split('>')
		array.pop()
		array = array.map(s => s.trim() + '>')
		console.log(array)
	return array
	}
</script>

<svg width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" style="border:1px solid red;">
	{#each content_workaround(icon) as ico}
		{@html ico}
	{/each}
</svg>