I want to close the modals if the user clicks outside the modal. But the modal uses the <teleport> component to be rendered in the <body> element.
How can I prevent closing when there is clicked inside the modal?
<OnClickOutside @trigger="moreInfo = false">
<div v-if="moreInfo" class="absolute top-100 right-0 bg-white z-20">
<update-time-slot-modal :timeslot="timeSlot" @update="updateTimeSlot"/>
<delete-time-slot-modal @delete="deleteTimeSlot(timeSlot.id)"/>
</div>
</OnClickOutside>
<teleport to="body">
<!-- modal -->
</teleport>