31 lines
1.0 KiB
JavaScript
31 lines
1.0 KiB
JavaScript
import { Controller } from "@hotwired/stimulus"
|
|
|
|
export default class extends Controller {
|
|
static targets = [ "button", "switch", "checkbox" ]
|
|
static values = { switchEnabled: Boolean }
|
|
|
|
connect () {
|
|
this.buttonTarget.classList.remove("hidden")
|
|
this.checkboxTarget.classList.add("hidden")
|
|
}
|
|
|
|
toggleSwitch () {
|
|
this.switchEnabledValue = !this.switchEnabledValue
|
|
this.checkboxTarget.checked = this.switchEnabledValue
|
|
|
|
if (this.switchEnabledValue) {
|
|
this.buttonTarget.setAttribute("aria-checked", "true");
|
|
this.buttonTarget.classList.remove("bg-gray-200")
|
|
this.buttonTarget.classList.add("bg-blue-600")
|
|
this.switchTarget.classList.remove("translate-x-0")
|
|
this.switchTarget.classList.add("translate-x-5")
|
|
} else {
|
|
this.buttonTarget.setAttribute("aria-checked", "false");
|
|
this.buttonTarget.classList.remove("bg-blue-600")
|
|
this.buttonTarget.classList.add("bg-gray-200")
|
|
this.switchTarget.classList.remove("translate-x-5")
|
|
this.switchTarget.classList.add("translate-x-0")
|
|
}
|
|
}
|
|
}
|