Fix lightbox transitionend listener leak

Switch to a Stimulus action for automatic handling
This commit is contained in:
Jeremy Daer
2025-12-05 16:18:01 -08:00
parent 6006491ab4
commit db55923fdb
2 changed files with 1 additions and 9 deletions
@@ -3,14 +3,6 @@ import { Controller } from "@hotwired/stimulus"
export default class extends Controller {
static targets = [ "caption", "image", "dialog", "zoomedImage" ]
connect() {
this.dialogTarget.addEventListener('transitionend', this.handleTransitionEnd.bind(this))
}
disconnect() {
this.dialogTarget.removeEventListener('transitionend', this.handleTransitionEnd.bind(this))
}
open(event) {
this.dialogTarget.showModal()
this.#set(event.target.closest("a"))
+1 -1
View File
@@ -1,5 +1,5 @@
<%= tag.dialog class:"lightbox", aria: { label: "Image Viewer (Press escape to close)" },
data: { controller: "dialog", dialog_target: "dialog", dialog_modal_value: "true", lightbox_target: "dialog", action: "keydown.esc->dialog#close:stop" } do %>
data: { controller: "dialog", dialog_target: "dialog", dialog_modal_value: "true", lightbox_target: "dialog", action: "keydown.esc->dialog#close:stop transitionend->lightbox#handleTransitionEnd" } do %>
<figure class="lightbox__figure">
<img src="" class="lightbox__image" data-lightbox-target="zoomedImage" />