import { Controller } from "@hotwired/stimulus"

// Connects to data-controller="hidden"
export default class extends Controller {

  static values = { toggler: String }

  connect() {
    const toggler = document.getElementById(this.togglerValue)
    if (toggler == undefined) {
      console.warn(`no toggler: <input type=checkbox id=${this.togglerValue}> missing!`)
      return
    }

    this.element.hidden = !toggler.checked
    toggler.addEventListener('change', () => { this.element.hidden = !toggler.checked })
  }
}