import { Controller } from "@hotwired/stimulus"

// Connects to data-controller="toggle-section"
export default class extends Controller {
  static targets = ["section", "icon"]
  
  connect() {
    // Ensure the section starts hidden
    this.sectionTarget.classList.add("hidden")
  }
  
  toggle() {
    const isHidden = this.sectionTarget.classList.contains("hidden")
    
    if (isHidden) {
      // Show the section
      this.sectionTarget.classList.remove("hidden")
      this.iconTarget.classList.add("rotate-180")
    } else {
      // Hide the section
      this.sectionTarget.classList.add("hidden")
      this.iconTarget.classList.remove("rotate-180")
    }
  }
}