File size: 475 Bytes
c59fd93 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 | <script lang="ts">
import { highlightMatch } from '$lib/utils';
interface Props {
text: string;
query: string;
matchClass?: string;
}
let {
matchClass = 'rounded bg-yellow-200/60 px-0.5 text-foreground dark:bg-yellow-500/30',
query,
text
}: Props = $props();
let segments = $derived(highlightMatch(text, query));
</script>
{#each segments as seg, i (i)}
{#if seg.match}
<mark class={matchClass}>{seg.text}</mark>
{:else}
{seg.text}
{/if}
{/each}
|