<template>
  <dialog class="modal" :open="dialog.isDialogOpen">
    <div class="modal-box w-2/5 max-w-md max-h-xs">
      <h3 class="text-lg font-bold">{{ dialog.dialogTitle }}</h3>
      <p class="py-4">{{ dialog.dialogContent }}</p>
      <div class="modal-action">
        <button class="btn" @click="dialog.closeDialog">Close</button>
      </div>
    </div>
  </dialog>
</template>

<script lang="ts" setup>
import { useDialogStore } from "@/stores/dialog";
const dialog = useDialogStore();
dialog.enableDialog = true;
</script>

<style scoped lang="postcss">
@import "@/assets/main.css";
</style>
