Docker/Maybe
Docker/Maybe
1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-07-19 05:09:38 +02:00
Code Issues Releases Activity Actions 1

Fix modal closing on color picker drag #1869 (#1931)
Some checks are pending
Publish Docker image / ci (push) Waiting to run
Details
Publish Docker image / Build docker image (push) Blocked by required conditions
Details

Browse source 
* 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

* Changed click events to mousedown within dialog elements to trigger the closing of the element
This commit is contained in:
Bryan McKnight 2025-03-03 15:37:12 -06:00 • committed by GitHub
parent 4e96ca8376
commit cf0e573533
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 6 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

4
app/views/account/transactions/bulk_edit.html.erb
View file

@ -1,12 +1,12 @@
<%= turbo_frame_tag "bulk_transaction_edit_drawer" do %> <%= turbo_frame_tag "bulk_transaction_edit_drawer" do %>
<dialog data-controller="modal" <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"> 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| %> <%= 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 class="flex h-full flex-col justify-between p-4 gap-4">
<div> <div>
<div class="flex h-9 items-center justify-end"> <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") %> <%= lucide_icon("x", class: "w-5 h-5 shrink-0") %>
</div> </div>
</div> </div>

4
app/views/shared/_drawer.html.erb
View file

@ -3,11 +3,11 @@
<%= turbo_frame_tag "drawer" do %> <%= 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" <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-controller="modal"
data-action="click->modal#clickOutside" data-action="mousedown->modal#clickOutside"
data-modal-reload-on-close-value="<%= reload_on_close %>"> data-modal-reload-on-close-value="<%= reload_on_close %>">
<div class="flex flex-col h-full gap-4"> <div class="flex flex-col h-full gap-4">
<div class="flex justify-end items-center p-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") %> <%= lucide_icon("x", class: "w-5 h-5 shrink-0") %>
</div> </div>
</div> </div>

2
app/views/shared/_modal.html.erb
View file

@ -1,6 +1,6 @@
<%# locals: (content:, classes:) -%> <%# locals: (content:, classes:) -%>
<%= turbo_frame_tag "modal" do %> <%= 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"> <div class="flex flex-col">
<%= content %> <%= content %>
</div> </div>

2
app/views/shared/_modal_form.html.erb
View file

@ -5,7 +5,7 @@
<div class="space-y-2"> <div class="space-y-2">
<header class="flex justify-between items-center"> <header class="flex justify-between items-center">
<h2 class="font-medium"><%= title %></h2> <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> </header>
<% if subtitle.present? %> <% if subtitle.present? %>