* base : @-mention picker foundation - glob search, picker nav, highlight * feat : @-mention file/folder picker and mention badges in message bubbles * fix: Imports * feat : wire the @-mention picker into the chat form * fix: Bound the glob-search result cache key and prune stale entries
26 lines
475 B
Svelte
26 lines
475 B
Svelte
<script lang="ts">
|
|
import { highlightMatch } from '$lib/utils';
|
|
|
|
interface Props {
|
|
text: string;
|
|
query: string;
|
|
matchClass?: string;
|
|
}
|
|
|
|
let {
|
|
text,
|
|
query,
|
|
matchClass = 'rounded bg-yellow-200/60 px-0.5 text-foreground dark:bg-yellow-500/30'
|
|
}: 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}
|