File size: 1,195 Bytes
e8a6c67 | 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 27 28 29 30 31 | <script lang="ts">
import type { EvidenceItem } from '$lib/types/evidence';
import type { Tier } from '$lib/types/tier';
import TierGlyph from '$lib/components/glyphs/TierGlyph.svelte';
import EvidenceCard from './EvidenceCard.svelte';
interface Props { items: EvidenceItem[]; }
let { items }: Props = $props();
function tally(t: Tier) {
return items.filter((e) => e.tier === t).length;
}
</script>
<section class="evidence-grid" aria-label="Evidence cards">
<div class="evidence-grid-head">
<span class="section-label">Evidence · {items.length} cards</span>
<span class="evidence-grid-meta">
<span class="evidence-grid-tally"><TierGlyph tier="empirical" size={9} /> {tally('empirical')}</span>
<span class="evidence-grid-tally"><TierGlyph tier="modeled" size={9} /> {tally('modeled')}</span>
<span class="evidence-grid-tally"><TierGlyph tier="proxy" size={9} /> {tally('proxy')}</span>
<span class="evidence-grid-tally"><TierGlyph tier="synthetic" size={9} /> {tally('synthetic')}</span>
</span>
</div>
<div class="evidence-grid-rail">
{#each items as ev (ev.id)}
<EvidenceCard {ev} />
{/each}
</div>
</section>
|