OWA-102: fix modal closing behavior

[mirovladimitrovski]

Description

When the modal is open, clicking and holding the mouse button down on any element and then moving the cursor to the overlay to release the mouse button causes the modal to close. This behavior is unintended. The modal should only close if the initial mousedown event originated on the overlay itself.

Acceptance Criteria

Correct Close Behavior

The modal closes only when the initial mousedown event starts on the overlay and the mouseup event is completed on the overlay.

Prevent Unintended Close

If the mousedown event begins on any interactive or non-overlay element within the modal and the cursor is dragged to the overlay before releasing, the modal should not close.

Interaction on Modal Content

All interactions within modal elements (e.g., buttons, text fields, dropdowns) are unaffected, and the modal remains open regardless of cursor movement or mouse button release outside these elements.

Overlay-Specific Closing

The overlay retains its intended functionality: Clicking directly on the overlay (both mousedown and mouseup) closes the modal.

This PR solves OWA-102

Steps completed:

According to our definition of done, I have completed the following steps:

• Acceptance criteria met
• Unit tests added
• Docs updated (including config and env variables)
• Translations added
• UX tested
• Browsers / platforms tested
• Rebased & ready to merge without conflicts
• Reviewed own code

[github-actions]

Visit the preview URL for this PR (updated for commit 340d43a):

https://ottwebapp--pr649-owa-102-fix-modal-cl-6uoxcu6u.web.app

_{(expires Fri, 20 Dec 2024 11:25:59 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: c198f8a3a199ba8747819f7f1e45cf602b777529}