From 143224d6a3b708169203363aa6069ffb542714b0 Mon Sep 17 00:00:00 2001
From: Bryan McKnight <github.absurd854@passmail.net>
Date: Sat, 1 Mar 2025 01:35:48 -0600
Subject: [PATCH 1/2] Replaced data-action click event with data-action
 mousedown to prevent the modal from hiding on mouse up whenever mouse down
 starts within the modal

---
 app/views/shared/_modal.html.erb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/views/shared/_modal.html.erb b/app/views/shared/_modal.html.erb
index dc0c5e90c50..2eb1b693be7 100644
--- a/app/views/shared/_modal.html.erb
+++ b/app/views/shared/_modal.html.erb
@@ -1,6 +1,6 @@
 <%# locals: (content:, classes:) -%>
 <%= turbo_frame_tag "modal" do %>
-  <dialog class="m-auto bg-white shadow-border-xs rounded-2xl max-w-[580px] w-min-content h-fit overflow-visible <%= classes %>" data-controller="modal" data-action="click->modal#clickOutside">
+  <dialog class="m-auto bg-white shadow-border-xs rounded-2xl max-w-[580px] w-min-content h-fit overflow-visible <%= classes %>" data-controller="modal" data-action="mousedown->modal#clickOutside">
     <div class="flex flex-col">
       <%= content %>
     </div>

From 0b2d7a7141f0594c1ce1bc7e97dfc4b4557df91b Mon Sep 17 00:00:00 2001
From: Bryan McKnight <github.absurd854@passmail.net>
Date: Mon, 3 Mar 2025 14:18:46 -0600
Subject: [PATCH 2/2] Changed click events to mousedown within dialog elements
 to trigger the closing of the element

---
 app/views/account/transactions/bulk_edit.html.erb | 4 ++--
 app/views/shared/_drawer.html.erb                 | 4 ++--
 app/views/shared/_modal_form.html.erb             | 2 +-
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/app/views/account/transactions/bulk_edit.html.erb b/app/views/account/transactions/bulk_edit.html.erb
index b8317084c6c..ed9a61943fc 100644
--- a/app/views/account/transactions/bulk_edit.html.erb
+++ b/app/views/account/transactions/bulk_edit.html.erb
@@ -1,12 +1,12 @@
 <%= turbo_frame_tag "bulk_transaction_edit_drawer" do %>
   <dialog data-controller="modal"
-          data-action="click->modal#clickOutside"
+          data-action="mousedown->modal#clickOutside"
     class="bg-white shadow-border-xs rounded-2xl max-h-[calc(100vh-32px)] h-full max-w-[480px] w-full mt-4 mr-4 ml-auto">
     <%= styled_form_with url: bulk_update_account_transactions_path, scope: "bulk_update", class: "h-full", data: { turbo_frame: "_top" } do |form| %>
       <div class="flex h-full flex-col justify-between p-4 gap-4">
         <div>
           <div class="flex h-9 items-center justify-end">
-            <div data-action="click->modal#close" class="cursor-pointer">
+            <div data-action="mousedown->modal#close" class="cursor-pointer">
               <%= lucide_icon("x", class: "w-5 h-5 shrink-0") %>
             </div>
           </div>
diff --git a/app/views/shared/_drawer.html.erb b/app/views/shared/_drawer.html.erb
index 35e225c2c8a..4da7ccb0a19 100644
--- a/app/views/shared/_drawer.html.erb
+++ b/app/views/shared/_drawer.html.erb
@@ -3,11 +3,11 @@
 <%= turbo_frame_tag "drawer" do %>
   <dialog class="ml-auto bg-white shadow-border-xs rounded-2xl max-w-[480px] h-full w-full mt-4 mr-4 focus-visible:outline-hidden"
     data-controller="modal"
-    data-action="click->modal#clickOutside"
+    data-action="mousedown->modal#clickOutside"
     data-modal-reload-on-close-value="<%= reload_on_close %>">
     <div class="flex flex-col h-full gap-4">
       <div class="flex justify-end items-center p-4">
-        <div data-action="click->modal#close" class="cursor-pointer p-2">
+        <div data-action="mousedown->modal#close" class="cursor-pointer p-2">
           <%= lucide_icon("x", class: "w-5 h-5 shrink-0") %>
         </div>
       </div>
diff --git a/app/views/shared/_modal_form.html.erb b/app/views/shared/_modal_form.html.erb
index a3d5456b9c7..98d9b598d61 100644
--- a/app/views/shared/_modal_form.html.erb
+++ b/app/views/shared/_modal_form.html.erb
@@ -5,7 +5,7 @@
     <div class="space-y-2">
       <header class="flex justify-between items-center">
         <h2 class="font-medium"><%= title %></h2>
-        <%= lucide_icon("x", class: "cursor-pointer w-5 h-5 text-secondary", data: { action: "click->modal#close" }) %>
+        <%= lucide_icon("x", class: "cursor-pointer w-5 h-5 text-secondary", data: { action: "mousedown->modal#close" }) %>
       </header>
 
       <% if subtitle.present? %>