@props(['title' => 'PDF', 'postUrl' => '', 'downloadUrl' => ''])
<template x-teleport="body"><div x-show="isOpen" x-cloak class="flipbook-modal"><div class="flipbook-modal-backdrop" @click="close()"></div><div class="flipbook-modal-content" @click.stop><div class="flipbook-modal-header"><span class="flipbook-modal-title">{{ $title }}</span><div class="flipbook-header-actions">@if($postUrl !== '')<a href="{{ $postUrl }}" class="flipbook-post-btn" title="{{ __('See full post') }}">&#x1F4C4; {{ __('See full post') }}</a>@endif{{-- no newline --}}@if($downloadUrl !== '')<a href="{{ $downloadUrl }}" class="flipbook-download-btn" title="{{ __('Download PDF') }}">&#x21E9; {{ __('Download') }}</a>@endif{{-- no newline --}}<button @click="close()" class="flipbook-close-btn" type="button">&times;</button></div></div><div class="flipbook-stage"><template x-if="loading"><div class="flipbook-loading"><div class="flipbook-spinner"></div><span>{{ __('Loading PDF...') }}</span></div></template><div x-ref="flipbookContainer" class="flipbook-container"></div></div><div class="flipbook-controls" x-show="!loading && totalPages > 0"><button @click="prevPage()" class="flipbook-nav-btn" :disabled="currentPage <= 1" type="button">&laquo; {{ __('Previous') }}</button><span class="flipbook-page-info" x-text="currentPage + ' / ' + totalPages"></span><button @click="nextPage()" class="flipbook-nav-btn" :disabled="currentPage >= totalPages" type="button">{{ __('Next') }} &raquo;</button></div></div></div></template>