Maybe/app/javascript/controllers/dropdown_controller.js

import { Controller } from "@hotwired/stimulus"

// Connects to data-controller="dropdown"
export default class extends Controller {
  static targets = ["menu"]

  toggleMenu(event) {
    event.stopPropagation(); // Prevent event from closing the menu immediately
    this.menuTarget.classList.toggle("hidden");
  }

  hideMenu() {
    this.menuTarget.classList.add("hidden");
  }

  connect() {
    document.addEventListener("click", () => this.hideMenu());
  }

  disconnect() {
    document.removeEventListener("click", () => this.hideMenu());
  }
}