<template>
  <div class="list-container">
    <MaterialCard
      v-for="item in items"
      :key="item.id"
      :item="item"
      @click="onItemClick(item)"
    />
  </div>
</template>

<script setup lang="ts">
import MaterialCard from './MaterialCard.vue';

const props = defineProps({
  items: {
    type: Array as () => any[],
    required: true,
    default: () => []
  }
});

const emit = defineEmits(['item-click']);

const onItemClick = (item: any) => {
  emit('item-click', item);
};
</script>

<style scoped>
.list-container {
  /* Styles for the list container if needed */
}
</style>