<template>
  <div class="row">
    <CardStatsDetails
      v-for="(stat, index) in stats"
      :key="index"
      :title="stat.title"
      :number="stat.number"
      :unit="stat.unit"
      :align="stat.align || 'left'"
      :number-id="stat.numberId || ''"
    />
  </div>
</template>

<script setup>
import CardStatsDetails from './CardStatsDetails.vue'

defineProps({
  /**
   * Array of stat objects: { title, number, unit, align?, numberId? }
   */
  stats: { type: Array, required: true },
})
</script>
