import { Controller } from "@hotwired/stimulus"

export default class extends Controller {
  static targets = ["dialog"]

  connect() {
    this.dialogTarget.showModal()
  }

  close() {
    this.dialogTarget.close()
  }

  // A click whose target is the <dialog> itself landed on the backdrop
  // (the panel fills the content box), so dismiss.
  backdropClose(event) {
    if (event.target === this.dialogTarget) this.close()
  }

  remove() {
    this.element.remove()
  }
}