1<script>
 2  import { t, locale } from './i18n.js';
 3  let { values, labels, metric = t("minutes") } = $props();
 4  const fmt = (v) => new Intl.NumberFormat(locale, { maximumFractionDigits: 1 }).format(v);
 5  let max = $derived(Math.max(1, ...values));
 6</script>
 7<ol class="chart" aria-label={metric}>
 8  {#each values as value, index}
 9    <li><span class="chart-label">{labels[index]}</span><span class="track"><span class="fill" style:width="{Math.max(0, value / max * 100)}%"></span></span><span class="chart-value">{fmt(value)} <small>{metric}</small></span></li>
10  {/each}
11</ol>