https://littlebirdelectronics.com.au/assets/controllers/ecommerce/…chase_order_invoicee_controller-8ee587fe.js

1import { Controller } from "@hotwired/stimulus"
2
3// Shows the accounts-payable fields only when the buyer says someone else
4// handles invoices. At a small school the business manager places the order AND
5// pays it, so "me" is one click and no typing — asking them for a second,
6// different address is asking for their own twice.
7//
8// `required` is toggled here rather than set in the markup, and that is the
9// whole point of the target: a hidden required input silently kills the submit
10// button, with no message and nothing focusable to fix. See the checkout's own
11// dead-Continue-button bug. Hidden means not required; shown means required.
12export default class extends Controller {
13  static targets = ["fields", "email"]
14
15  connect() {
16    this.sync(this.element.querySelector("input[name='accounts_payable_option']:checked")?.value)
17  }
18
19  toggle(event) {
20    this.sync(event.target.value)
21  }
22
23  sync(value) {
24    const wantsOther = value === "different"
25    this.fieldsTarget.classList.toggle("hidden", !wantsOther)
26    if (this.hasEmailTarget) this.emailTarget.required = wantsOther
27  }
28}