summaryrefslogtreecommitdiffhomepage
path: root/src/features/surface-host/ui/StatTable.svelte
blob: 415423f491dc47bea4a925bc9d35a75df22415d5 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<script lang="ts">
	import type { StatFieldView } from "../logic/types";

	// Renders a run of stat fields as one aligned label/value table. Headerless:
	// the column semantics aren't known generically, but the two-column layout
	// gives the tidy, aligned readout the stats deserve (e.g. extension → version).
	let { stats }: { readonly stats: readonly StatFieldView[] } = $props();
</script>

<div class="overflow-x-auto">
	<table class="table table-sm">
		<tbody>
			{#each stats as stat, i (i)}
				<tr>
					<th class="font-medium">{stat.label}</th>
					<td class="text-right tabular-nums">{stat.value}</td>
				</tr>
			{/each}
		</tbody>
	</table>
</div>