<script lang="ts" setup>
//#region --Import--.
import type { Genre } from "~/interfaces/movie";
//#endregion

//#region --Props--.
defineProps({
  genres: {
    type: Array<Genre>,
    required: true,
    nullable: false,
  },
});
//#endregion
</script>

<template>
  <section class="mb-6">
    <div class="flex flex-wrap gap-2">
      <span v-for="genre in genres" :key="genre.id" class="px-3 py-1 bg-gray-800 rounded-full text-sm">
        {{ genre.name }}
      </span>
    </div>
  </section>
</template>

<style scoped></style>