webarchi/assets/controllers/dropdown_controller.js

27 lines
808 B
JavaScript

import { Controller } from '@hotwired/stimulus';
/**
* Activate a dropdown menu and toggle icon
* [template: data_entry.html.twig]
*/
export default class extends Controller {
static targets = ['drop', 'caret'];
toggle() {
// Show / hide dropdown
this.dropTarget.classList.toggle('is-active');
const caretTarget = this.caretTarget;
const caretState = caretTarget.className.includes('down') ? 'down' : 'up';
const caretAction = {
'down': function(target) {
target.className = target.className.replace('down', 'up');
},
'up': function(target) {
target.className = target.className.replace('up', 'down');
}
};
caretAction[caretState](this.caretTarget);
}
}