<script lang="ts" setup> import type { History } from 'masto' import sparkline from '@fnando/sparkline' const { history, } = $defineProps<{ history?: History[] }>() const historyNum = $computed(() => { if (!history) return [1, 1, 1, 1, 1, 1, 1] return [...history].reverse().map(item => Number(item.accounts) || 0) }) const sparklineEl = $ref<SVGSVGElement>() watch([$$(historyNum), $$(sparklineEl)], ([historyNum, sparklineEl]) => { if (!sparklineEl) return sparkline(sparklineEl, historyNum) }) </script> <template> <svg ref="sparklineEl" class="sparkline" width="60" height="40" stroke-width="3" /> </template>