Stimulus checkbox select all component

[hfpp2012]

import CheckboxSelectAll from "stimulus-checkbox-select-all";

export default class extends CheckboxSelectAll {
  static targets = ["checkboxDeleteButton"];

  initialize() {
    super.initialize();

    this.toggleDeleteButton = this.toggleDeleteButton.bind(this);
  }

  connect() {
    super.connect();

    // Get all checked checkboxes
    // this.checked;

    // Get all unchecked checkboxes
    // this.unchecked;

    this.checkboxTargets.forEach((checkbox) =>
      checkbox.addEventListener("change", this.toggleDeleteButton)
    );

    this.checkboxAllTarget.addEventListener("change", this.toggleDeleteButton);
  }

  toggleDeleteButton() {
    if (this.checkboxAllTarget.checked) {
      this.checkboxDeleteButtonTarget.hidden = false;
    } else {
      this.checkboxDeleteButtonTarget.hidden = true;
    }
  }
}

result: