<script>
	import { segmentize } from '@atcute/bluesky-richtext-segmenter';
	const { text, facets } = $props();

	const segments = $derived(segmentize(text, facets));
</script>

{#each segments as { text, features }}
	{#each features as feature}
		{#if feature.$type === 'app.bsky.richtext.facet#mention'}
			<a href={`#meow-${feature.did}`}>{text}</a>
		{:else if feature.$type === 'app.bsky.richtext.facet#link'}
			<a href={`#meow-${feature.uri}`}>{text}</a>
		{:else if feature.$type === 'app.bsky.richtext.facet#tag'}
			<a href={`#meow-${feature.tag}`}>{text}</a>
		{:else}
			<span>{text}</span>
		{/if}
	{:else}
		<span>{text}</span>
	{/each}
{/each}
