store/resources/js/components/media/MediaPreviewDialog.vue

32 lines
775 B
Vue

<script setup lang="ts">
import {
Dialog,
DialogContent,
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog';
const open = defineModel<boolean>('open', { default: false });
defineProps<{
url: string | null;
title?: string;
}>();
</script>
<template>
<Dialog v-model:open="open">
<DialogContent class="sm:max-wd p-2 sm:p-4">
<DialogHeader class="sr-only">
<DialogTitle>{{ title ?? 'Pratinjau Gambar' }}</DialogTitle>
</DialogHeader>
<img
v-if="url"
:src="url"
:alt="title ?? 'Pratinjau gambar'"
class="max-h-[80vh] w-full rounded-md object-contain"
>
</DialogContent>
</Dialog>
</template>