ansxor.ca
bluesky client without react native baggage written in sveltekit
1<script>
2 import { segmentize } from '@atcute/bluesky-richtext-segmenter';
3 const { text, facets } = $props();
4
5 const segments = $derived(segmentize(text, facets));
6</script>
7
8{#each segments as { text, features }}
9 {#each features as feature}
10 {#if feature.$type === 'app.bsky.richtext.facet#mention'}
11 <a href={`#meow-${feature.did}`}>{text}</a>
12 {:else if feature.$type === 'app.bsky.richtext.facet#link'}
13 <a href={`#meow-${feature.uri}`}>{text}</a>
14 {:else if feature.$type === 'app.bsky.richtext.facet#tag'}
15 <a href={`#meow-${feature.tag}`}>{text}</a>
16 {:else}
17 <span>{text}</span>
18 {/if}
19 {:else}
20 <span>{text}</span>
21 {/each}
22{/each}