<script setup>
import { VuePDF, usePDF } from '@tato30/vue-pdf'
import '@tato30/vue-pdf/style.css'

const props = defineProps({
  url: String
})

const { pdf, pages } = usePDF(props.url)

const pdfPreviewRef = ref(null)
const pdfPreviewWidth = ref(900)
onMounted(() => {
  if(pdfPreviewRef.value) {
    pdfPreviewWidth.value = Number(pdfPreviewRef.value.offsetWidth || 900)
  }
})
</script>

<template>
  <div ref="pdfPreviewRef" class="w-100pct">
    <VuePDF v-for="page in pages" :key="page" :pdf="pdf" :page="page" :width="pdfPreviewWidth" />
  </div>
</template>