import { Controller } from '@hotwired/stimulus'

export default class extends Controller {

    static classes = ['closed', 'iconClosed', 'iconExpanded']
    static targets = ['submenu', 'button', 'icon']
    static values = { expanded: Boolean }

    toggleSubmenu() {
        this.expandedValue = !this.expandedValue
    }

    expandedValueChanged(expanded) {
        this.submenuTarget.classList.toggle(this.closedClass, false === expanded)
        if (false === this.hasButtonTarget) {
            return
        }
        this.buttonTarget.setAttribute('aria-expanded', expanded)
        if (false === this.hasIconTarget) {
            return
        }
        if (true === expanded) {
            this.iconTarget.classList.add(...this.iconExpandedClasses)
            this.iconTarget.classList.remove(...this.iconClosedClasses)
        } else {
            this.iconTarget.classList.add(...this.iconClosedClasses)
            this.iconTarget.classList.remove(...this.iconExpandedClasses)
        }
    }
}