{#if data.length > 1}
{@const labelCount = Math.min(7, data.length)}
{@const step = labelCount > 1 ? Math.floor((data.length - 1) / (labelCount - 1)) || 1 : 1}
{@const isHourly = data[0]?.date?.includes(':')}
{@const dateFormat = isHourly
? 'h A'
: period === 'year' || period === 'all'
? 'M/D/YY'
: 'M/D'}
{#each Array(labelCount) as _, i}
{@const idx = i === labelCount - 1 ? data.length - 1 : Math.min(i * step, data.length - 1)}
{#if data[idx]}
{dayjs(data[idx].date).format(dateFormat)}
{/if}
{/each}
{/if}
{#if hovered}
{@const total = Object.values(hovered.models || {}).reduce((a, b) => a + b, 0)}
{#if hovered.date?.includes(':')}
{dayjs(hovered.date).format('MMM D, h A')}
{:else}
{dayjs(hovered.date).format('MMM D, YYYY')}
{/if}
{#each Object.entries(hovered.models || {})
.sort(([, a], [, b]) => b - a)
.slice(0, 5) as [n, c]}
{n}
{c.toLocaleString()}
({total > 0 ? ((c / total) * 100).toFixed(0) : 0}%)
{/each}