<template>
  <v-pagination
    v-if="pagination.last"
    :model-value="modelValue"
    :length="pagination.last"
    rounded="circle"
    @update:model-value="onPageUpdated"
  />
</template>

<script setup lang="ts">
import type { PropType } from "@vue/runtime-core";
import type { Pagination } from "~/types/data";

const props = defineProps({
  modelValue: {
    type: Number,
    required: true
  },
  pagination: {
    type: Object as PropType<Pagination>,
    required: true
  }
});

const emit = defineEmits(['update:modelValue']);

const onPageUpdated = (newPage: number) => {
  emit('update:modelValue', newPage);
};
</script>

<style scoped lang="scss">
</style>
