<script setup lang="ts">
    import { type IModal, useUIModalStore } from '@/UI-kit/store/modal.store';
    import UIModal from '@/UI-kit/components/UI/modal/UIModal.vue';
    import { storeToRefs } from 'pinia';

    const modalStore = useUIModalStore();

    const { modalList } = storeToRefs(modalStore);

    const listeners = (modal: IModal) => {
        return {
            ...modal.listeners,
            close: () => modalStore.closeModal(modal.id),
        };
    };
</script>

<template>
    <UIModal v-for="modal in modalList" :key="modal.id" :modal="modal" v-on="listeners(modal)" />
</template>
