https://www.autobutler.dk/assets/controllers/shared/toggle_controller-643a348f.js

1import { Controller } from "@hotwired/stimulus";
2
3export default class extends Controller {
4  static targets = ['toggleable'];
5  static values = { 
6    scrollTarget: String
7  };
8
9  connect() {
10    this.toggleClass = this.data.get('class')
11  }
12
13  toggle(event) {
14    if(!this.data.get('process-default'))
15      event.preventDefault();
16
17    this.toggleableTargets.forEach(target => {
18      const cssClasses = target.dataset.toggleClass || this.toggleClass || 'hidden';
19
20      cssClasses.split(' ').forEach(cssClass => {
21        target.classList.toggle(cssClass);
22      });
23    });
24
25    if (this.data.get('scrollToElement') == 'true'){
26      this.element.scrollIntoView({
27        behavior: 'smooth'
28      });
29    }
30  }
31
32  toggleAndScroll(event) {
33    this.toggle(event);
34
35    if (this.scrollTargetValue) {
36      const targetElement = document.querySelector(this.scrollTargetValue);
37      if (targetElement) {
38        targetElement.scrollIntoView({
39          behavior: 'smooth',
40          block: 'start'
41        });
42      }
43    }
44  }
45}