openfoodnetwork/app/webpacker/controllers/input_char_count_controller.js

import { Controller } from "stimulus";

export default class extends Controller {
  static targets = ["count", "input"];

  connect() {
    this.inputTarget.addEventListener("keyup", this.countCharacters.bind(this));
    this.countCharacters();
  }

  countCharacters() {
    this.displayCount(this.inputTarget.value.length, this.inputTarget.maxLength);
  }

  displayCount(count, max) {
    this.countTarget.textContent = `${count}/${max}`;
  }
}