Event Propagation Issue with vue-final-modal Over Vuetify Components

[JoaoMario109]

Hi, first of all, I'd like to express my appreciation for your efforts in developing and maintaining this library. I'm encountering some issues when using vue-final-modal in conjunction with certain Vuetify components, specifically those that can be dismissed by clicking outside, such as v-dialog or v-menu. It appears that, even when vue-final-modal is active over these components, click events are being propagated to the underlying components, leading to their unintended closure. Below, I provide a detailed description of the behavior, along with relevant information. Thank you for your assistance.

Version Information

• vue-final-modal: "legacy" 2.4.3
• Vue.js: "^2.6.11"
• Vuetify: "2.7.1"

Operating System

• Linux

Reproduction Link

To reproduce the issue, please clone the following repository:

https://github.com/JoaoMario109/vue-final-modal-issue-demo

After cloning, install the dependencies and run the application.

Steps to Reproduce

1. Click on the Open Tray text located at the top bar to open the v-menu, which displays a card containing some text and an Open Popup button.
2. Click on the Open Popup button to open the modal.
3. Then, click either outside the modal or on any part of the popup. Notice that the v-menu is closed behind the modal, despite the modal being positioned over it.

Expected Behavior

When the modal is open over the v-menu with an active overlay, clicking outside the modal or on any part of the modal should not result in the closure of the underlying v-menu. Additionally, actions that prompt the modal's closure (such as clicking outside, confirming, or canceling) should only close the modal without affecting the v-menu.

Actual Behavior

Currently, any click action—whether on the modal or outside of it—when combined with an underlying v-menu or v-dialog, leads to the unintended closure of these components. This seems to occurs because the click event is not being properly intercepted by the modal, despite attempts to halt the event's propagation, such as using click.stop or other event stopping mechanisms within the modal.