https://app.wpml.org/assets/controllers/details_dismiss_controller-19c9e143.js

1import { Controller } from "@hotwired/stimulus"
2
3// Close an open <details> popover when a click lands OUTSIDE it, and on Escape
4// (systemsdev-17651: the vacation Edit expander could only be closed by clicking Edit
5// again — on a small screen the summary may sit under the opened panel). Generic on
6// purpose: attach `data-controller="details-dismiss"` to the <details> element itself;
7// clicks inside the panel (the date pickers, the submit) are untouched.
8export default class extends Controller {
9  connect() {
10    this.boundClick = this.outsideClick.bind(this)
11    this.boundKey = this.escape.bind(this)
12    // Capture phase, so a click that some other handler swallows still closes the panel.
13    document.addEventListener("click", this.boundClick, true)
14    document.addEventListener("keydown", this.boundKey)
15  }
16
17  disconnect() {
18    document.removeEventListener("click", this.boundClick, true)
19    document.removeEventListener("keydown", this.boundKey)
20  }
21
22  outsideClick(event) {
23    if (!this.element.open) return
24    if (this.element.contains(event.target)) return
25    this.element.open = false
26  }
27
28  escape(event) {
29    if (event.key === "Escape" && this.element.open) this.element.open = false
30  }
31}