knowyt/client/src/components/PlayerList.vue

<template>
  <div class="player-list">
    <div v-for="player in players" :key="player.id">
      <Player :player="player" :show-score="showScore" :show-checkbox="showCheckbox" :checked="round.selections[player.id as any]" />
    </div>
  </div>
</template>

<script setup lang="ts">
import { usePlayersStore } from '@/stores/PlayersStore'
import { useRoundStore } from '@/stores/RoundStore'

defineProps<{
  showScore?: boolean,
  showCheckbox?: boolean,
}>()

const players = usePlayersStore().players
const round = useRoundStore().round
</script>

<style lang="scss">
@import '~/assets/css/components';

.player-list {
  padding: 8px;
  border: $box-primary-border;
  border-radius: 10px;
  background-color: $box-primary-background-color;
}
</style>