https://www.theatrefolk.com/assets/controllers/stepper_controller-1ef3a691.js

1import { Controller } from '@hotwired/stimulus'
2
3// Connects to data-controller="stepper"
4// Plus/minus buttons for a numeric input, clamped to the input's min/max.
5export default class extends Controller {
6  static targets = ['input']
7
8  increment() {
9    this.adjust(1)
10  }
11
12  decrement() {
13    this.adjust(-1)
14  }
15
16  adjust(delta) {
17    const input = this.inputTarget
18    const min = parseInt(input.min || '1', 10)
19    const max = input.max ? parseInt(input.max, 10) : Infinity
20    const current = parseInt(input.value, 10)
21    const next = isNaN(current) ? min : Math.min(max, Math.max(min, current + delta))
22    input.value = next
23    input.dispatchEvent(new Event('input', { bubbles: true }))
24  }
25}