popper/src/components/ScoreDisplay.vue

<template>
  <div class="game-score">
    <span>
      <span>Score: {{ score }}</span>
      <span>Hiscore: {{ hiscore }}</span>
    </span>
    <span>
      <span>Current streak: {{ streak }}</span>
      <span>Max streak: {{ maxStreak }}</span>
    </span>
    <span>Shots left: {{ shotsLeft }}</span>
  </div>
</template>

<script setup lang="ts">
defineProps<{
  score: number;
  hiscore: number;
  shotsLeft: number;
  streak: number;
  maxStreak: number;
}>();
</script>