<script lang="ts">
import {
    Content as ItemContent,
    Root as ItemRoot,
    Title as ItemTitle,
} from '$shared/shadcn/ui/item';
import { VirtualList } from '$shared/ui';
import { fontCollection } from '../../model';
</script>

<VirtualList items={fontCollection.filteredFonts}>
    {#snippet children({ item, index })}
        <ItemRoot>
            <ItemContent>
                <ItemTitle>{item.name}</ItemTitle>
                {item.name}
            </ItemContent>
        </ItemRoot>
    {/snippet}
</VirtualList>
