66 lines
1.5 KiB
JavaScript
66 lines
1.5 KiB
JavaScript
import { Controller } from '@hotwired/stimulus'
|
|
|
|
export default class extends Controller {
|
|
static classes = ['closed']
|
|
static targets = ['toggle', 'icon']
|
|
static values = {
|
|
open: {
|
|
type: Boolean,
|
|
default: true,
|
|
},
|
|
storageKey: {
|
|
type: String,
|
|
default: ''
|
|
}
|
|
}
|
|
|
|
initialize() {
|
|
this.target = this.hasToggleTarget ? this.toggleTarget : this.element
|
|
|
|
// Restore state from storage if storageKey is provided
|
|
if (this.hasStorageKey()) {
|
|
this.restoreState()
|
|
}
|
|
}
|
|
|
|
toggle() {
|
|
this.openValue = !this.openValue
|
|
}
|
|
|
|
close() {
|
|
this.openValue = false
|
|
}
|
|
|
|
open() {
|
|
this.openValue = true
|
|
}
|
|
|
|
openValueChanged(open) {
|
|
this.target.classList.toggle(this.closedClass, false === open)
|
|
|
|
if (this.hasIconTarget) {
|
|
this.iconTarget.classList.toggle('rotate-90', true === open)
|
|
}
|
|
|
|
// Save state to storage if storageKey is provided
|
|
if (this.hasStorageKey()) {
|
|
this.saveState()
|
|
}
|
|
}
|
|
|
|
hasStorageKey() {
|
|
return this.storageKeyValue && this.storageKeyValue.trim() !== ''
|
|
}
|
|
|
|
saveState() {
|
|
sessionStorage.setItem(`toggle_${this.storageKeyValue}`, this.openValue.toString())
|
|
}
|
|
|
|
restoreState() {
|
|
const savedState = sessionStorage.getItem(`toggle_${this.storageKeyValue}`)
|
|
if (savedState !== null) {
|
|
this.openValue = savedState === 'true'
|
|
}
|
|
}
|
|
}
|