<template>
  <div class="wallet-footer">
    <ul class="d-flex justify-content-between align-items-center">
      <WalletFooterItem
        v-for="(item, index) in items"
        :key="index"
        :title="item.title"
        :icon="item.icon || ''"
        :icon-width="item.iconWidth || 30"
        :icon-height="item.iconHeight || 30"
        :subtitles="item.subtitles || []"
        @click="$emit('item-click', item, index)"
      />
    </ul>
  </div>
</template>

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

defineProps({
  /**
   * Array of item objects: { title, icon?, iconWidth?, iconHeight?, subtitles? }
   */
  items: { type: Array, required: true },
})

defineEmits(['item-click'])
</script>
